/* mimoapi.cc - FOUR STREAMS */
:root{--bone:#f3f5ec;--bone2:#e5eadb;--plate:#fbfcf7;--ink:#0f332b;--ink2:#3a5650;--ln:rgba(15,51,43,.24);--acc:#b41620;--accd:#8f0f17;--pink:#ff9aa2;--deep:#0a251f;--oni:#eef1e6;--oni2:#abc3bc;--lni:rgba(238,241,230,.26);
--disp:"Lexend",system-ui,sans-serif;--body:"Manrope",system-ui,sans-serif;--mono:"DM Mono",ui-monospace,Menlo,Consolas,monospace}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--bone);color:var(--ink);font:400 17px/1.65 var(--body);overflow-x:hidden;-webkit-font-smoothing:antialiased}
img,svg{max-width:100%}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:.2em}
a:hover{color:var(--acc)}
:focus-visible{outline:2px solid var(--acc);outline-offset:3px}
.ink :focus-visible,pre :focus-visible{outline-color:var(--pink)}
h1,h2,h3,p,ul,ol,dl,dd,figure{margin:0}
h1{font:300 clamp(2.25rem,5.1vw,4.4rem)/1.05 var(--disp);letter-spacing:-.035em;overflow-wrap:break-word}
h2{font:400 clamp(1.5rem,2.5vw,2.1rem)/1.15 var(--disp);letter-spacing:-.02em}
h3{font:700 1.06rem/1.35 var(--body)}
.wrap{max-width:1248px;margin:0 auto;padding:0 clamp(20px,4vw,48px)}
.skip{position:absolute;left:12px;top:-80px;z-index:50;background:var(--ink);color:var(--oni);padding:12px 16px}
.skip:focus{top:12px;color:var(--oni)}

/* stave: four parallel hairlines */
.stave{position:relative;height:13px;background:repeating-linear-gradient(to bottom,var(--ln) 0 1px,transparent 1px 4px);pointer-events:none}
.stave::after{content:"";position:absolute;height:3px;width:min(18%,220px);background:var(--acc);top:-1px;left:8%}
.s2::after{top:3px;left:31%}.s3::after{top:7px;left:56%}.s4::after{top:11px;left:76%}
.band{position:relative;padding:clamp(56px,7vw,96px) 0}
.band>.stave{position:absolute;top:0;left:0;right:0}
.tint{background:var(--bone2)}
.ink{background:var(--ink);color:var(--oni)}
.ink .stave{background:repeating-linear-gradient(to bottom,var(--lni) 0 1px,transparent 1px 4px)}
.ink .stave::after{background:var(--pink)}
.ink a:hover{color:var(--pink)}

/* header */
.top{position:relative;z-index:20;background:var(--bone)}
.top-in{display:flex;align-items:center;min-height:76px;gap:8px}
.logo{display:inline-flex;align-items:center;gap:11px;min-height:44px;text-decoration:none;font:600 1.16rem/1 var(--disp);letter-spacing:-.02em;color:var(--ink)}
.logo:hover{color:var(--ink)}
.mark path{fill:none;stroke-width:2.1}.mark .m-a{stroke-width:2.6}.m-i{stroke:var(--ink)}.m-a{stroke:var(--acc)}
.nav{display:flex;margin-left:auto}
.nav a{display:inline-flex;align-items:center;min-height:76px;padding:0 15px;text-decoration:none;font:500 .82rem/1 var(--mono);letter-spacing:.01em;color:var(--ink2);white-space:nowrap}
.nav a:hover{color:var(--ink);box-shadow:inset 0 -3px 0 var(--ln)}
.nav a[aria-current]{color:var(--ink);box-shadow:inset 0 -3px 0 var(--acc)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 24px;border:1px solid var(--acc);border-radius:2px;background:var(--acc);color:#ffffff;font:700 .98rem/1.2 var(--body);text-decoration:none;cursor:pointer;text-align:center;transition:background .15s,border-color .15s}
.btn:hover{background:var(--accd);border-color:var(--accd);color:#ffffff}
.btn.big{min-height:56px;padding:0 32px;font-size:1.05rem}
.btn.sm{min-height:44px;padding:0 16px;font-size:.9rem}
.btn.ghost{background:transparent;border-color:var(--ink);color:var(--ink)}
.btn.ghost:hover{background:var(--ink);color:var(--oni);border-color:var(--ink)}
.ink .btn.ghost{border-color:var(--lni);color:var(--oni)}
.ink .btn.ghost:hover{background:var(--oni);color:var(--ink);border-color:var(--oni)}
.ink .btn:not(.ghost){background:var(--pink);border-color:var(--pink);color:#3d060a}
.ink .btn:not(.ghost):hover{background:#ffffff;border-color:#ffffff;color:#3d060a}
.hbtn{margin-left:14px;white-space:nowrap}
.burger{display:none;width:48px;height:48px;padding:13px 11px;border:1px solid var(--ink);border-radius:2px;background:transparent;cursor:pointer;flex-direction:column;justify-content:space-between}
.burger i{display:block;height:2px;background:var(--ink)}.burger i:nth-child(3){background:var(--acc)}
.lnk{display:inline-flex;align-items:center;min-height:48px;font-weight:600}

/* shared atoms */
.lead{font-size:clamp(1.06rem,1.5vw,1.24rem);line-height:1.6;color:var(--ink2);max-width:60ch;margin-top:22px}
.eyebrow{font:500 .8rem/1.4 var(--mono);color:var(--acc);margin-bottom:20px;letter-spacing:.02em}
.acts-row{display:flex;flex-wrap:wrap;align-items:center;gap:14px 26px;margin-top:32px}
.lit{display:inline-grid;gap:3px;width:26px;flex:none}
.lit i{display:block;height:2px;background:var(--ln)}.lit i.on{background:var(--ink)}.lit i.on:last-of-type,.lit i.on:nth-last-child(1){background:var(--ink)}
.lit i.on+i:not(.on){background:var(--ln)}
.bul{list-style:none;padding:0}
.bul li{display:grid;grid-template-columns:26px minmax(0,1fr);gap:18px;align-items:start;padding:17px 0;border-top:1px solid var(--ln)}
.bul li:last-child{border-bottom:1px solid var(--ln)}
.bul .lit{margin-top:.5em}
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:6px 10px;padding:0;margin-bottom:26px;font:400 .78rem/1.4 var(--mono);color:var(--ink2)}
.crumbs li{display:inline-flex;align-items:center;gap:10px}
.crumbs li+li::before{content:"";width:14px;height:5px;border-top:1px solid var(--ink2);border-bottom:1px solid var(--ink2)}
.crumbs a{display:inline-flex;align-items:center;min-height:44px}
.crumbs li[aria-current]{color:var(--ink)}
.facts div{display:flex;justify-content:space-between;align-items:baseline;gap:20px;padding:13px 0;border-top:1px solid var(--ln)}
.facts div:last-child{border-bottom:1px solid var(--ln)}
.facts dt{font:400 .8rem/1.4 var(--mono);color:var(--ink2);min-width:0}
.facts dd{font:300 clamp(1.5rem,2.3vw,1.95rem)/1.1 var(--disp);letter-spacing:-.03em;white-space:nowrap}
.ink .facts div{border-color:var(--lni)}.ink .facts dt{color:var(--oni2)}

/* home */
.hero{padding-bottom:0;padding-top:clamp(44px,6vw,84px)}
.hero-g{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(32px,5vw,80px);align-items:end}
.hero-g>*{min-width:0}
.cross{display:block;width:100%;height:clamp(70px,9vw,120px);margin-top:clamp(36px,5vw,64px)}
.cross path{fill:none;stroke:var(--ink);stroke-width:1;vector-effect:non-scaling-stroke}
.cross .x-a{stroke:var(--acc);stroke-width:3}
.codeband{padding-top:clamp(48px,6vw,80px)}
.code-g{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(32px,5vw,80px);align-items:end}
.code-g>*{min-width:0}
.code-l h2{margin-bottom:26px;font-weight:300}
.split{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(24px,5vw,72px)}
.split>*{min-width:0}
.feats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px clamp(28px,4vw,56px)}
.feats.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.feat{border-top:1px solid var(--ink);padding-top:16px;min-width:0}
.ix{display:block;font:500 .76rem/1 var(--mono);color:var(--acc);margin-bottom:14px}
.feat p,.steps p,.use p{color:var(--ink2);font-size:.98rem;margin-top:8px}
.steps{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px clamp(24px,3vw,44px)}
.steps li{min-width:0;border-top:1px solid var(--ink);padding-top:20px}
.steps .lit{width:44px;gap:5px;margin-bottom:22px}.steps .lit i{height:3px}
.steps .lit i.on{background:var(--acc)}
.use{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:8px 32px;padding:20px 0;border-top:1px solid var(--ln)}
.use:last-child{border-bottom:1px solid var(--ln)}
.use p{margin-top:0}
.use h3{font:400 1.18rem/1.3 var(--disp);letter-spacing:-.01em}

/* faq */
.faq details{border-top:1px solid var(--ink)}
.faq details:last-child{border-bottom:1px solid var(--ink)}
.faq summary{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:64px;padding:14px 0;cursor:pointer;list-style:none;font:400 1.12rem/1.35 var(--disp);letter-spacing:-.01em}
.faq summary::-webkit-details-marker{display:none}
.faq summary span{min-width:0}
.fx{display:grid;gap:3px;width:22px;flex:none}
.fx i{display:block;height:2px;background:var(--ink);transition:transform .2s,background .2s}
[open]>summary .fx i{background:var(--acc)}
[open]>summary .fx i:nth-child(1){transform:translateY(7.5px)}[open]>summary .fx i:nth-child(2){transform:translateY(2.5px)}
[open]>summary .fx i:nth-child(3){transform:translateY(-2.5px)}[open]>summary .fx i:nth-child(4){transform:translateY(-7.5px)}
.faq details p{padding:0 46px 22px 0;color:var(--ink2);max-width:68ch}

/* cta band */
.ctab-g{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:32px clamp(32px,5vw,80px);align-items:end}
.ctab h2{font:300 clamp(1.9rem,4vw,3.3rem)/1.06 var(--disp);letter-spacing:-.035em}
.ctab p{color:var(--oni2);margin-top:16px;max-width:52ch}
.ctab-a{display:flex;flex-wrap:wrap;gap:14px}

/* page head */
.phead{margin-bottom:clamp(36px,5vw,64px);max-width:920px}
.phead h1{font-size:clamp(2.1rem,4.4vw,3.7rem)}
.when{font:400 .8rem/1.4 var(--mono);color:var(--ink2);margin-top:22px}

/* key + support */
.keyhero{padding-top:clamp(36px,4.5vw,64px)}
.key-g{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);grid-template-areas:"h f" "x f";grid-template-rows:auto 1fr;gap:0 clamp(32px,5vw,80px)}
.key-g>*{min-width:0}
.key-l{grid-area:h}.key-r{grid-area:f}.key-f{grid-area:x;max-width:520px}
.key-l .phead{margin-bottom:36px}
.card.form,.plate,.calc{position:relative;background:var(--plate);border:1px solid var(--ink);border-radius:2px;padding:37px clamp(18px,2.4vw,30px) clamp(20px,2.4vw,30px)}
.card.form::before,.plate::before,.calc::before{content:"";position:absolute;top:6px;left:0;right:0;height:13px;background:repeating-linear-gradient(to bottom,var(--ln) 0 1px,transparent 1px 4px)}
.card.form::after,.plate::after,.calc::after{content:"";position:absolute;top:13px;left:22%;width:72px;height:3px;background:var(--acc)}
.key-r>.btn.ghost,.key-r>a.btn{width:100%;margin-bottom:10px;background:var(--plate)}
.key-r>a.btn.ghost:hover{background:var(--ink)}
.key-r>.note{margin-bottom:16px}
.note{font-size:.84rem;line-height:1.5;color:var(--ink2);margin-top:8px}
.mut{color:var(--ink2)}
.tabs2{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--ink);margin-bottom:20px}
.tabs2 button{min-height:48px;border:0;background:transparent;color:var(--ink2);font:600 .96rem/1.2 var(--body);cursor:pointer;box-shadow:none}
.tabs2 button[aria-selected="true"]{color:var(--ink);box-shadow:inset 0 -3px 0 var(--ink)}
.msg:empty{display:none}
.msg{font-size:.92rem;margin-bottom:14px}
.msg.err{padding:11px 14px;border-left:3px solid var(--acc);background:#f8e3e4;color:#70090b}
.row{margin-bottom:16px}
.row label,.calc label{display:block;font:500 .78rem/1.4 var(--mono);color:var(--ink2);margin-bottom:7px}
input,select,textarea{width:100%;min-height:48px;padding:10px 13px;border:1px solid var(--ink);border-radius:2px;background:#ffffff;color:var(--ink);font:400 1rem/1.4 var(--body)}
textarea{min-height:140px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:2px solid var(--acc);outline-offset:1px}
form[data-form] .btn,form[data-support] button{width:100%}
form[data-support] button{min-height:48px;border:1px solid var(--acc);border-radius:2px;background:var(--acc);color:#ffffff;font:700 .98rem/1.2 var(--body);cursor:pointer}
form[data-support] button:hover{background:var(--accd)}
form[data-support] output,form[data-support] [data-out],form[data-support]>p{display:block;font-size:.9rem;color:var(--ink2);margin-top:12px}
.keyout{display:none}.keyout.on{display:block}
.keyout h3{font:400 1.3rem/1.2 var(--disp);margin-bottom:14px}
.keybox{display:flex;align-items:center;gap:12px;padding:10px 10px 10px 14px;background:var(--ink);color:var(--oni);border-radius:2px}
.keybox span{flex:1;min-width:0;font:400 .88rem/1.5 var(--mono);word-break:break-all}
.keybox .btn{flex:none;background:var(--pink);border-color:var(--pink);color:#3d060a}
.keyout p{margin-top:12px;font-size:.94rem;line-height:1.9;overflow-wrap:anywhere}
.keyout code{font:400 .86rem var(--mono);background:var(--bone2);padding:2px 6px}
.acts{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}

/* prose */
.prose{max-width:72ch;min-width:0}
.prose>*+*{margin-top:1.1em}
.prose h2{margin-top:2em;padding-top:22px;border-top:1px solid var(--ink);scroll-margin-top:24px}
.prose>h2:first-child{margin-top:0}
.prose h3{margin-top:1.8em;font-size:1.12rem}
.prose ul,.prose ol{padding-left:1.25em}
.prose li+li{margin-top:.4em}
.prose li::marker{color:var(--acc)}
.prose a{color:var(--accd);font-weight:600}
.prose :not(pre)>code{font:400 .88em var(--mono);background:var(--bone2);padding:.12em .38em;border-radius:2px;overflow-wrap:anywhere}
.tint .prose :not(pre)>code{background:var(--bone)}
.prose table{display:block;max-width:100%;overflow-x:auto;border-collapse:collapse;font-size:.94rem}
.prose th,.prose td{padding:11px 16px 11px 0;border-bottom:1px solid var(--ln);text-align:left;vertical-align:top;min-width:120px}
.prose th{font:500 .78rem/1.4 var(--mono);color:var(--ink2);border-bottom-color:var(--ink)}
.prose blockquote{margin:1.4em 0 0;padding-left:20px;border-left:3px solid var(--acc)}

/* code */
pre.code{position:relative;margin:0;max-width:100%;overflow-x:auto;background:var(--deep);color:#e2efe2;padding:58px 20px 22px;border-radius:2px;font:400 .86rem/1.65 var(--mono);tab-size:2}
.prose pre.code{margin-top:1.3em}
pre.code code{font:inherit;white-space:pre}
.code .k{color:var(--pink)}.code .s{color:#bce9b4}.code .c{color:#93b3ab}
.copy{position:absolute;top:7px;right:7px;min-height:44px;min-width:64px;padding:0 14px;border:1px solid var(--lni);border-radius:2px;background:var(--deep);color:var(--oni);font:500 .76rem/1 var(--mono);cursor:pointer}
.copy:hover{background:var(--oni);color:var(--ink)}
.codebox{border:1px solid var(--lni);border-radius:2px;background:var(--deep);min-width:0}
.codetabs{display:flex;border-bottom:1px solid var(--lni);overflow-x:auto}
.codetabs button{min-height:48px;padding:0 20px;border:0;background:transparent;color:var(--oni2);font:500 .82rem/1 var(--mono);cursor:pointer;white-space:nowrap}
.codetabs button[aria-selected="true"]{color:var(--oni);box-shadow:inset 0 -3px 0 var(--pink)}
.codebox pre.code{border-radius:0}

/* docs + article */
.doc-g{display:grid;grid-template-columns:260px minmax(0,1fr);gap:clamp(32px,6vw,88px);align-items:start}
.art-g{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:clamp(32px,6vw,88px);align-items:start}
.doc-g>*,.art-g>*{min-width:0}
.doc-s,.art-s{position:sticky;top:24px}
.toc-h,.side-h{font:500 .78rem/1.4 var(--mono);color:var(--ink2);margin-bottom:12px}
.toc ol{list-style:none;padding:0}
.toc a{display:flex;align-items:center;min-height:44px;padding:6px 0 6px 16px;border-left:1px solid var(--ln);text-decoration:none;font-size:.92rem;line-height:1.35;color:var(--ink2)}
.toc a:hover{border-left:3px solid var(--acc);padding-left:14px;color:var(--ink)}
.side{margin-top:32px;padding-top:18px;border-top:1px solid var(--ink)}
.side .side-h{font:400 1.2rem/1.25 var(--disp);color:var(--ink);letter-spacing:-.01em;margin-bottom:8px}
.side p{font-size:.92rem;color:var(--ink2)}
.side .btn{margin-top:16px;width:100%}
.take{background:var(--bone2);padding:clamp(20px,3vw,32px);margin-bottom:44px;max-width:72ch}
.take h2{font-size:1.3rem;margin-bottom:18px}
.take .bul li:last-child{border-bottom:0;padding-bottom:0}

/* pricing */
.nums{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:28px clamp(16px,2.4vw,36px)}
.nums div{min-width:0;border-top:1px solid var(--ink);padding-top:16px;position:relative}
.nums div:first-child::before{content:"";position:absolute;top:-2px;left:0;width:56px;height:3px;background:var(--acc)}
.nums b{display:block;font:300 clamp(2rem,3.6vw,3.2rem)/1.05 var(--disp);letter-spacing:-.04em}
.nums span{display:block;font:400 .78rem/1.45 var(--mono);color:var(--ink2);margin-top:10px}
.psub{margin-top:30px;font-weight:600}
.price-g{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:40px clamp(32px,5vw,80px);align-items:start}
.price-g>*{min-width:0}
.price-g h2{margin-bottom:24px}
.calc>div{margin-bottom:16px}.calc>div:last-child{margin:22px 0 0;padding-top:16px;border-top:1px solid var(--ln)}
.calc output{display:block;font:300 clamp(2.4rem,4vw,3.2rem)/1.05 var(--disp);letter-spacing:-.04em;color:var(--acc)}
.price-e .use{grid-template-columns:minmax(0,1fr)}

/* 404 */
.nf{padding-bottom:0}
.nf-l{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:0 28px;margin-top:28px}
.nf-l a{display:inline-flex;align-items:center;min-height:44px;font-weight:600}

/* footer */
.foot{position:relative;background:var(--bone2);padding:56px 0 36px}
.foot>.stave{position:absolute;top:0;left:0;right:0}
.foot-in{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:28px clamp(32px,5vw,80px)}
.foot-b p{color:var(--ink2);font-size:.94rem;margin-top:10px;max-width:40ch}
.foot-l{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:0 28px;align-content:start}
.foot-l a{display:inline-flex;align-items:center;min-height:44px;font:500 .82rem/1.3 var(--mono);text-decoration:none}
.foot-l a:hover{text-decoration:underline}
.legal-n{grid-column:1/-1;padding-top:20px;border-top:1px solid var(--ln);font:400 .76rem/1.6 var(--mono);color:var(--ink2)}

@media (max-width:1040px){
.feats.four{grid-template-columns:repeat(2,minmax(0,1fr))}
.nav a{padding:0 10px}
}
@media (max-width:900px){
.burger{display:flex;margin-left:8px}
.hbtn{margin-left:auto;min-height:44px;padding:0 14px;font-size:.9rem}
.top-in{min-height:66px}
.nav{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;background:var(--bone);border-bottom:1px solid var(--ink);padding:8px clamp(20px,4vw,48px) 16px;margin:0}
.nav.open{display:flex}
.nav a{min-height:50px;padding:0;border-top:1px solid var(--ln);font-size:.92rem}
.nav a:first-child{border-top:0}
.nav a[aria-current],.nav a:hover{box-shadow:inset 3px 0 0 var(--acc);padding-left:14px}
.hero-g,.code-g,.split,.ctab-g,.price-g,.doc-g,.art-g,.foot-in{grid-template-columns:minmax(0,1fr)}
.key-g{grid-template-columns:minmax(0,1fr);grid-template-areas:"h" "f" "x";gap:0}
.key-l .phead{margin-bottom:26px}
.key-f{margin-top:36px;max-width:none}
.doc-s,.art-s{position:static}
.art-s{order:-1}
.steps{grid-template-columns:minmax(0,1fr)}
.nums{grid-template-columns:repeat(2,minmax(0,1fr))}
.nums div:first-child{grid-column:1/-1}
.split-h:empty{display:none}
}
@media (max-width:600px){
body{font-size:16px}
.feats,.feats.four,.use{grid-template-columns:minmax(0,1fr)}
.feats{gap:28px}
.logo{font-size:1.04rem;gap:8px}
.mark{width:26px;height:26px}
.btn.big{width:100%}
.faq details p{padding-right:0}
.keybox{flex-direction:column;align-items:stretch}
.acts .btn{flex:1 1 100%}
}
@media (max-width:380px){
.hbtn{padding:0 10px;font-size:.84rem}
.logo span{font-size:.96rem}
}
@media (prefers-reduced-motion:reduce){
html{scroll-behavior:auto}
*,*::before,*::after{transition:none!important;animation:none!important}
}