:root{--bg:#eef2f1;--card:#fff;--tx:#12232b;--mu:#5d7078;--bd:#d6dfdd;--ac:#0b8f8c;--ac2:#0a6f8f;--acx:#fff;--am:#f0a62b;--bad:#c8372d;--ok:#1f9d63;--in:#f5f8f7;--ed:#0c161b;--edt:#c9e4e0;--nav:62px;--side:224px;--r:14px;--sh:0 1px 2px rgba(18,35,43,.06),0 8px 24px rgba(18,35,43,.06);color-scheme:light}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#0b1519;--card:#132228;--tx:#e3eeed;--mu:#8ea6a8;--bd:#223840;--ac:#2cc4bd;--ac2:#3aa7d6;--acx:#05211f;--in:#0e1b20;--sh:none;color-scheme:dark}}
:root[data-theme="dark"]{--bg:#0b1519;--card:#132228;--tx:#e3eeed;--mu:#8ea6a8;--bd:#223840;--ac:#2cc4bd;--ac2:#3aa7d6;--acx:#05211f;--in:#0e1b20;--sh:none;color-scheme:dark}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--tx);font:15px/1.5 "Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,Roboto,sans-serif;-webkit-tap-highlight-color:transparent;overscroll-behavior-y:none}
[hidden]{display:none!important}
.i{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}.i.lg{width:22px;height:22px}
:focus-visible{outline:2px solid var(--ac);outline-offset:2px}
/* shell */
#app{min-height:100vh;display:grid;grid-template-rows:auto 1fr;grid-template-columns:minmax(0,1fr)}
.top{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:10px;padding:calc(8px + env(safe-area-inset-top,0px)) 14px 8px;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(12px);border-bottom:1px solid var(--bd)}
.brand{display:none;align-items:center;gap:8px;color:var(--ac)}.brand b{color:var(--tx);font-size:17px;letter-spacing:-.2px}
.top h1{margin:0;font-size:18px;font-weight:700;letter-spacing:-.2px;flex:1}
.top-r{display:flex;gap:6px;align-items:center}
.chip{display:flex;align-items:center;gap:6px;border:1px solid var(--bd);background:var(--card);color:var(--tx);padding:6px 10px;border-radius:99px;font:600 12.5px inherit;cursor:pointer;max-width:150px}
.chip span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ib{border:0;background:transparent;color:var(--mu);width:36px;height:36px;border-radius:10px;display:grid;place-items:center;cursor:pointer;transition:background .15s,color .15s}
.ib:hover{background:var(--in);color:var(--tx)}
#nav{position:fixed;z-index:30;left:0;right:0;bottom:0;display:flex;background:var(--card);border-top:1px solid var(--bd);padding:4px 4px calc(4px + env(safe-area-inset-bottom,0px))}
#nav button{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;border:0;background:transparent;color:var(--mu);font:600 11px inherit;padding:6px 2px;border-radius:12px;cursor:pointer;transition:color .15s,background .15s}
#nav button[aria-current="page"]{color:var(--ac);background:color-mix(in srgb,var(--ac) 12%,transparent)}
main{padding:14px 14px calc(var(--nav) + 90px + env(safe-area-inset-bottom,0px));max-width:860px;width:100%;margin:0 auto}
body.ed-open main{padding-bottom:calc(var(--nav) + 46vh + 20px)}
body.ed-min main{padding-bottom:calc(var(--nav) + 100px)}
@media(min-width:900px){
  #app{grid-template-columns:var(--side) minmax(0,1fr);grid-template-rows:auto 1fr}
  .top{grid-column:2;padding-top:12px}.brand{display:none}
  #nav{top:0;bottom:0;right:auto;width:var(--side);flex-direction:column;gap:2px;padding:76px 12px 12px;border-top:0;border-right:1px solid var(--bd)}
  #nav::before{content:"Mikromahn";position:absolute;top:18px;left:20px;font:800 18px inherit;letter-spacing:-.3px;color:var(--ac)}
  #nav button{flex:0 0 auto;flex-direction:row;gap:12px;font-size:14px;padding:11px 14px;justify-content:flex-start}
  main{grid-column:2;padding-bottom:140px;margin:0 auto}
  body.ed-open main{padding-bottom:50vh}body.ed-min main{padding-bottom:90px}
  #ed{left:var(--side)!important;bottom:0!important}
}
/* pages */
.pg{animation:swap .22s ease}
@keyframes swap{from{opacity:0;transform:translateY(6px)}}
.card{background:var(--card);border:1px solid var(--bd);border-radius:var(--r);padding:16px;margin-bottom:14px;box-shadow:var(--sh)}
.card h2{margin:0 0 4px;font-size:16px;letter-spacing:-.1px}
.card>p.sub,.sub{margin:0 0 12px;color:var(--mu);font-size:13.5px}
.g{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:520px){.g.s1{grid-template-columns:1fr}}
.f{display:flex;flex-direction:column;gap:4px;min-width:0}.f.w{grid-column:1/-1}
label{font-size:12.5px;font-weight:600;color:var(--mu)}
.rq{color:var(--bad)}
input,select,textarea{font:16px inherit;width:100%;color:var(--tx);background:var(--in);border:1.5px solid var(--bd);border-radius:10px;padding:10px 11px;transition:border-color .15s,box-shadow .15s}
textarea{font:14px ui-monospace,"Cascadia Mono",Menlo,Consolas,monospace;resize:vertical}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--ac);box-shadow:0 0 0 3px color-mix(in srgb,var(--ac) 22%,transparent)}
.f small{color:var(--mu);font-size:12px}
.er{display:none;color:var(--bad);font-size:12px;font-style:normal;font-weight:600}
.f.bad input,.f.bad select,.f.bad textarea{border-color:var(--bad)}.f.bad .er{display:block}
.ck{display:flex;align-items:center;gap:9px;font-size:14px;font-weight:500;color:var(--tx);margin:8px 0}
.ck input{width:19px;height:19px;accent-color:var(--ac);flex:none}
.btn{display:inline-flex;align-items:center;gap:7px;font:600 14px inherit;border:1.5px solid var(--bd);background:var(--card);color:var(--tx);padding:10px 15px;border-radius:11px;cursor:pointer;transition:transform .1s,background .15s}
.btn:hover{background:var(--in)}.btn:active{transform:scale(.97)}
.btn.pri{background:var(--ac);border-color:var(--ac);color:var(--acx)}.btn.pri:hover{filter:brightness(1.07);background:var(--ac)}
.btn.sm{padding:6px 10px;font-size:12.5px}.btn.dng{color:var(--bad)}
.row{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;align-items:center}
.seg{display:flex;background:var(--in);border:1px solid var(--bd);border-radius:12px;padding:3px;gap:3px;overflow-x:auto}
.seg button{flex:1;border:0;background:transparent;color:var(--mu);font:600 13px inherit;padding:8px 10px;border-radius:9px;cursor:pointer;white-space:nowrap;display:flex;gap:6px;align-items:center;justify-content:center}
.seg button[aria-selected="true"]{background:var(--card);color:var(--tx);box-shadow:0 1px 4px rgba(0,0,0,.15)}
.pro{background:var(--am);color:#2b1a00;font:700 10px inherit;padding:2px 6px;border-radius:99px}
.tag{display:inline-block;font:600 12px inherit;padding:3px 9px;border-radius:99px;background:color-mix(in srgb,var(--ac) 14%,transparent);color:var(--ac)}
.tag.am{background:color-mix(in srgb,var(--am) 25%,transparent);color:#9a6200}
:root[data-theme="dark"] .tag.am{color:var(--am)}
.hint,.meta{color:var(--mu);font-size:12.5px}
.note{border-left:3px solid var(--am);background:color-mix(in srgb,var(--am) 12%,transparent);padding:9px 12px;border-radius:0 10px 10px 0;font-size:13px;margin:12px 0 0}
/* home */
.hero{border-radius:var(--r);padding:20px;margin-bottom:14px;color:#fff;background:linear-gradient(120deg,#0a4f5c,#0b8f8c);position:relative;overflow:hidden}
.hero h2{margin:0 0 4px;font-size:21px;letter-spacing:-.3px}.hero p{margin:0;opacity:.88;font-size:14px;max-width:46ch}
.hero .arcs{position:absolute;right:-30px;top:-30px;width:170px;height:170px;opacity:.18}
.tiles{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(min-width:620px){.tiles{grid-template-columns:repeat(3,1fr)}}
.tile{text-align:left;border:1px solid var(--bd);background:var(--card);color:var(--tx);border-radius:var(--r);padding:14px;cursor:pointer;display:flex;flex-direction:column;gap:6px;font:inherit;box-shadow:var(--sh);transition:transform .12s,border-color .15s}
.tile:hover{border-color:var(--ac)}.tile:active{transform:scale(.98)}
.tile .i{color:var(--ac);width:22px;height:22px}.tile b{font-size:15px}.tile span{color:var(--mu);font-size:12.5px;line-height:1.35}
.steps{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.steps li{display:flex;gap:10px;align-items:center;font-size:14px}
.steps .dot{width:22px;height:22px;border-radius:50%;border:2px solid var(--bd);display:grid;place-items:center;flex:none;color:transparent}
.steps li.done .dot{background:var(--ok);border-color:var(--ok);color:#fff}.steps li.done{color:var(--mu)}
.steps .i{width:13px;height:13px;stroke-width:3}
/* lists */
.li{display:flex;gap:10px;align-items:center;justify-content:space-between;padding:10px 0;border-top:1px solid var(--bd)}
.li:first-child{border-top:0}.li b{display:block}.li small{color:var(--mu)}
.empty{text-align:center;color:var(--mu);padding:18px 8px;font-size:14px}
.cmp{width:100%;border-collapse:collapse;font-size:13.5px}.cmp td,.cmp th{padding:8px 6px;border-top:1px solid var(--bd);text-align:left}.cmp th{color:var(--mu);font-weight:600}
.code{font:700 22px ui-monospace,"Cascadia Mono",Menlo,monospace;letter-spacing:1px}
/* editor sheet */
#ed{position:fixed;z-index:40;width:100%;left:0;right:0;bottom:calc(var(--nav) + env(safe-area-inset-bottom,0px));background:var(--ed);color:var(--edt);border-radius:18px 18px 0 0;box-shadow:0 -10px 40px rgba(0,0,0,.35);display:flex;flex-direction:column;height:46vh;transition:height .28s cubic-bezier(.2,.8,.2,1),transform .28s,opacity .2s;max-width:1100px;margin:0 auto}
@media(min-width:900px){#ed{right:0;width:auto;max-width:none;border-radius:18px 0 0 0}}
#ed.min{height:52px}#ed.min textarea,#ed.min .ed-f{display:none}
#ed.full{height:100dvh;bottom:0;left:0!important;right:0;border-radius:0;z-index:60;max-width:none;padding-bottom:env(safe-area-inset-bottom,0px)}
#ed.hidden{transform:translateY(110%);opacity:0;pointer-events:none}
.ed-h{display:flex;align-items:center;gap:8px;padding:8px 8px 8px 14px;min-height:52px;color:#e8f4f2}
.ed-h .ib{color:#a9c4c1}.ed-h .ib:hover{background:rgba(255,255,255,.08);color:#fff}
.ed-h .meta{color:#7fa09c}.sp{flex:1}
.led{width:9px;height:9px;border-radius:50%;background:#e5534b}.led.a{background:var(--am)}.led.g{background:#3ddc97;box-shadow:0 0 8px #3ddc97}
#out{flex:1;min-height:0;margin:0 10px;width:auto;background:#081015;color:var(--edt);border:1px solid #1b2c33;border-radius:10px;font:13px/1.6 ui-monospace,"Cascadia Mono",Menlo,Consolas,monospace;white-space:pre;overflow:auto;resize:none;tab-size:4}
.ed-f{display:flex;gap:8px;align-items:center;padding:10px;flex-wrap:wrap}
.ed-f .btn{background:#17262d;border-color:#243942;color:#e5f2f0;padding:8px 12px}.ed-f .btn.pri{background:var(--ac);border-color:var(--ac);color:var(--acx)}
.ed-f .hint{margin-left:auto;color:#7fa09c}
#fab{position:fixed;z-index:35;right:14px;bottom:calc(var(--nav) + 14px + env(safe-area-inset-bottom,0px));display:flex;gap:8px;align-items:center;border:0;background:var(--ed);color:#e8f4f2;padding:12px 16px;border-radius:99px;box-shadow:0 8px 24px rgba(0,0,0,.35);font:700 13px inherit;cursor:pointer;transition:transform .2s,opacity .2s}
#fab.hidden{transform:scale(.6);opacity:0;pointer-events:none}
#fab span{background:var(--am);color:#2b1a00;border-radius:99px;padding:1px 8px}
@media(min-width:900px){#fab{bottom:20px}}
body.ed-full #nav{z-index:10}
#toast{position:fixed;left:50%;top:calc(64px + env(safe-area-inset-top,0px));transform:translate(-50%,-14px);background:#102028;color:#fff;padding:10px 16px;border-radius:12px;font-size:13.5px;opacity:0;pointer-events:none;transition:.25s;z-index:99;max-width:min(92vw,440px);text-align:center;box-shadow:0 8px 28px rgba(0,0,0,.3)}
#toast.on{opacity:1;transform:translate(-50%,0)}#toast.bad{background:var(--bad)}
/* login */
#gate{position:fixed;inset:0;z-index:100;background:linear-gradient(160deg,#0a3a46,#0b8f8c);display:grid;place-items:center;padding:16px;overflow:auto}
.gbox{background:var(--card);color:var(--tx);width:100%;max-width:380px;border-radius:20px;padding:24px;box-shadow:0 20px 60px rgba(0,0,0,.35);animation:swap .3s}
.gbox h2{margin:8px 0 4px;font-size:22px;letter-spacing:-.3px}.gbox .logo{width:48px;height:48px;border-radius:14px;background:var(--ac);color:var(--acx);display:grid;place-items:center}
.gbox .f{margin-top:12px}.gbox .btn{width:100%;justify-content:center;margin-top:14px}
.gbox a{color:var(--ac);font-size:13px;cursor:pointer;display:inline-block;margin-top:12px}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* print previews + printing */
.pv{margin:12px 0;display:flex;justify-content:center;background:var(--in);border:1px solid var(--bd);border-radius:12px;padding:10px}
.pv svg{width:100%;max-width:420px;height:auto;max-height:520px;box-shadow:0 2px 12px rgba(0,0,0,.18);background:#fff}
#printroot{display:none}
@media print{
  html,body{background:#fff!important}
  body>*:not(#printroot){display:none!important}
  #printroot{display:block!important}
  #printroot .pp{display:block;break-after:page;page-break-after:always}
  #printroot .pp:last-child{break-after:auto;page-break-after:auto}
}
/* ads */
.ad{margin:6px 0 14px;text-align:center;min-height:50px}
.ad>small{display:block;color:var(--mu);font-size:11px;margin-bottom:4px}
.ad.promo{border:1px dashed var(--ac);border-radius:var(--r);padding:14px;background:color-mix(in srgb,var(--ac) 8%,transparent);text-align:left}
.ad.promo b{display:block;margin-bottom:2px}.ad.promo span{color:var(--mu);font-size:13px}.ad.promo .btn{margin-top:10px}

/* assistant */
.ask{display:flex;gap:8px;align-items:flex-start}.ask textarea{flex:1;font:16px inherit;resize:none}
.mic{border:1.5px solid var(--bd);background:var(--in);color:var(--ac);width:46px;height:46px;border-radius:12px;flex:none}.mic.on{background:var(--bad);color:#fff;border-color:var(--bad);animation:pulse 1s infinite}
@keyframes pulse{50%{opacity:.6}}
.chips2{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 2px}.chip2{border:1px solid var(--bd);background:var(--card);color:var(--tx);font:600 12.5px inherit;padding:6px 11px;border-radius:99px;cursor:pointer}.chip2:hover{border-color:var(--ac);color:var(--ac)}

/* small-phone polish (v2.2.1): tabs wrap instead of hiding, tighter header */
@media(max-width:480px){.seg{flex-wrap:wrap;overflow:visible}.seg button{flex:1 1 auto;padding:8px}.top h1{font-size:16px}.top .chip,.top .rt{max-width:46vw}}
@media(max-width:360px){.top{padding-left:10px;padding-right:10px}.top h1{font-size:15px;line-height:1.2}}

/* router chip, menu, modal, stats */
.top-r{position:relative}.chip.add{background:var(--ac);border-color:var(--ac);color:var(--acx)}.chip .caret{width:14px;height:14px;opacity:.7}
.rmenu{position:absolute;right:0;top:calc(100% + 6px);z-index:60;min-width:250px;max-width:min(92vw,320px);background:var(--card);border:1px solid var(--bd);border-radius:14px;box-shadow:0 14px 40px rgba(0,0,0,.28);padding:6px;animation:swap .15s ease}
.rm-h{font:700 11px inherit;text-transform:uppercase;letter-spacing:.06em;color:var(--mu);padding:8px 10px 4px}
.rm-i{display:flex;gap:10px;align-items:center;width:100%;text-align:left;border:0;background:transparent;color:var(--tx);padding:9px 10px;border-radius:10px;cursor:pointer;font:inherit}
.rm-i:hover{background:var(--in)}.rm-i.on{background:color-mix(in srgb,var(--ac) 12%,transparent)}.rm-i b{display:block;font-size:14px}.rm-i small{color:var(--mu);font-size:12px}
.rm-c{width:20px;flex:none;color:var(--ac);display:grid;place-items:center}.rmenu hr{border:0;border-top:1px solid var(--bd);margin:4px 0}
.rmodal{position:fixed;inset:0;z-index:90;background:rgba(5,15,20,.55);display:grid;place-items:center;padding:14px;overflow:auto;backdrop-filter:blur(2px)}
.rbox{background:var(--card);color:var(--tx);width:100%;max-width:440px;border-radius:18px;padding:18px;box-shadow:0 20px 60px rgba(0,0,0,.4);animation:swap .2s;max-height:92vh;overflow:auto}
.rbox h2{margin:0 0 4px;font-size:18px}.rbox h3{margin:14px 0 6px;font-size:13px;color:var(--mu);text-transform:uppercase;letter-spacing:.05em}.rbox h3 small{text-transform:none;letter-spacing:0;font-weight:500}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(92px,1fr));gap:8px}.stats>div{background:var(--in);border:1px solid var(--bd);border-radius:10px;padding:8px 10px}.stats b{display:block;font-size:16px;word-break:break-word}.stats small{color:var(--mu);font-size:11.5px}
/* v3.1: wordmark, experts, live router */
.wm{display:inline-flex;align-items:flex-end;gap:calc(var(--h)*.05);height:var(--h);vertical-align:middle}.wm i{display:block;height:100%;-webkit-mask:center/contain no-repeat;mask:center/contain no-repeat}
.wm .a{background:var(--tx);-webkit-mask-image:url(wm-mikro.png);mask-image:url(wm-mikro.png)}.wm .b{background:linear-gradient(180deg,var(--ac),color-mix(in srgb,var(--ac) 62%,#0a3d8f));-webkit-mask-image:url(wm-mahn.png);mask-image:url(wm-mahn.png)}
.wm.inv .a{background:#fff}.wm.inv .b{background:#b9f5f0}.hero .wm{margin-bottom:8px;display:flex}
.exc{display:flex;gap:10px;padding:10px;border:1px solid var(--bd);border-radius:12px;background:var(--card);margin-bottom:8px;text-align:left;width:100%;color:inherit;cursor:pointer}
.exc .av,.exc img{width:56px;height:56px;border-radius:12px;object-fit:cover;background:var(--in);flex:none;display:grid;place-items:center;font-weight:700;color:var(--ac)}.exc b{display:block}.exc small{color:var(--mu)}
.stars{color:var(--am);letter-spacing:1px}.vb{color:var(--ac);font-weight:700;font-size:12px}.cat{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px;margin:8px 0}.cat img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:10px}
.kp{display:grid;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:8px;margin:8px 0}.kp div{background:var(--in);border-radius:12px;padding:10px}.kp b{display:block;font-size:20px}.kp small{color:var(--mu)}
.lg2{display:flex;gap:12px;font-size:12px;color:var(--mu)}.lg2 i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:4px}.sw{display:flex;gap:8px;margin-bottom:12px}.sw .btn{flex:1}.sw .btn.on{background:var(--ac);color:var(--acx)}
.t-w{display:none}@media(max-width:899px){.t-h{display:none}.t-w{display:inline-flex}}
.cbox{height:min(52vh,420px);overflow-y:auto;background:var(--in);border-radius:12px;padding:10px;display:flex;flex-direction:column;gap:6px}
.bub{max-width:82%;align-self:flex-start;background:var(--card);border:1px solid var(--bd);border-radius:14px 14px 14px 4px;padding:7px 10px;white-space:pre-wrap;overflow-wrap:anywhere}
.bub.me{align-self:flex-end;background:var(--ac);color:var(--acx);border-color:transparent;border-radius:14px 14px 4px 14px}.bub small{display:block;opacity:.65;font-size:10.5px;margin-top:2px}
.cin{display:flex;gap:8px;margin-top:8px;align-items:flex-end}.cin textarea{flex:1;min-height:44px}