/* bitflip · rack stylesheet. Dark teal instrument rack; one mint accent, amber for warnings. */
:root{
  --ground:#072B2A;--ground-d:#051F1E;--panel:#0D3B38;--panel-hi:#11433F;--panel-lo:#092F2D;--hole:#021312;
  --screen:#031615;--screen-e:#0A2F2C;--mint:#7DF2C9;--mint-2:rgba(125,242,201,.22);--mint-1:rgba(125,242,201,.10);
  --silk:#CFEDE2;--head:#DDF5EC;--body:#A8D3C5;--dim:#6E9C90;--amber:#FFB547;--red:#FF7A6B;
  --pale:#DCEAE4;--pale-k:#E8F1EC;--pale-ink:#0A3A37;--pale-body:#2B5651;--ink:#072B2A;
  --f-text:'Atkinson Hyperlegible Next',system-ui,-apple-system,'Segoe UI',sans-serif;
  --f-mono:'Atkinson Hyperlegible Mono',ui-monospace,'Cascadia Mono',Consolas,monospace;
  --f-dot:'Doto','Atkinson Hyperlegible Mono',ui-monospace,monospace;
  --f-wm:'Unbounded',system-ui,sans-serif;
  --glow:0 0 10px rgba(125,242,201,.45);--glow-a:0 0 10px rgba(255,181,71,.4);
  --ease:cubic-bezier(.2,.8,.2,1);
  --rw:30px;--gutW:64px;--padL:24px;--padR:24px;
  --fs-h1:46px;--fs-h2:30px;--fs-body:17px;--fs-lg:10.5px;--fs-key:12.5px;--fs-vl:30px;
  --side:160px;
}
@media (min-width:1700px){:root{--fs-h1:56px;--fs-h2:34px;--fs-body:18px;--fs-lg:11px;--fs-key:13px;--fs-vl:36px;--side:184px;--padL:28px;--padR:28px}}
@media (max-width:1359px){:root{--rw:22px;--gutW:56px;--fs-h1:40px;--fs-h2:28px;--fs-body:16px;--fs-key:12px;--fs-vl:26px;--side:148px}}
@media (max-width:1023px){:root{--rw:12px;--gutW:0px;--padL:20px;--padR:20px;--fs-h1:40px}}
@media (max-width:599px){:root{--rw:8px;--padL:16px;--padR:16px;--fs-h1:34px;--fs-h2:24px;--fs-body:16px;--fs-vl:24px}}

*,*::before,*::after{box-sizing:border-box}
html{background:var(--ground);-webkit-text-size-adjust:100%;overflow-x:clip}
body{margin:0;background:var(--ground);color:var(--body);font:400 var(--fs-body)/1.55 var(--f-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:clip}
button,input,textarea{font:inherit;color:inherit}
a{color:inherit}
h1,h2,p{margin:0}
[hidden]{display:none!important}
::selection{background:rgba(125,242,201,.28);color:var(--head)}
.lg{font:600 var(--fs-lg)/1.35 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--silk)}
.lg.dim{color:var(--dim)}
.fine{font:400 12px/1.55 var(--f-mono);color:var(--body);letter-spacing:.02em}

/* ---------------------------------------------------------------- rack frame */
.rack{position:relative;display:grid;grid-template-columns:var(--rw) minmax(0,1fr) var(--rw);min-height:100vh;
  background:var(--ground) repeating-linear-gradient(0deg,rgba(255,255,255,.014) 0 1px,transparent 1px 3px)}
.rail{grid-row:1/span 2;position:relative;background:linear-gradient(90deg,#062523,#0A3533 45%,#062523);border-left:1px solid rgba(0,0,0,.35);border-right:1px solid rgba(0,0,0,.35)}
.rail.l{grid-column:1}.rail.r{grid-column:3}
.rail i{position:absolute;left:50%;width:9px;height:6px;margin-left:-4.5px;border-radius:2px;background:var(--hole);box-shadow:inset 0 1px 1px rgba(0,0,0,.8),0 1px 0 rgba(255,255,255,.05)}
.rail b{position:absolute;left:0;right:0;text-align:center;font:500 7px/1 var(--f-mono);color:rgba(207,237,226,.28);letter-spacing:0}
.bays{grid-column:2;min-width:0;position:relative}
.rack-foot{grid-column:2;height:44px;background:#051d1c;border-top:1px solid rgba(0,0,0,.4);display:flex;align-items:center;padding-left:var(--padL)}
.rack-foot span{font:600 10px var(--f-mono);letter-spacing:.2em;text-transform:uppercase;color:rgba(207,237,226,.25)}
.cables{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;overflow:visible;z-index:5}
@media (max-width:1023px){.cables{display:none}.rail i,.rail b{display:none}}

/* ---------------------------------------------------------------- units */
.bay{position:relative;display:grid;grid-template-columns:minmax(0,1fr) var(--gutW);
  background:linear-gradient(180deg,rgba(255,255,255,.025),transparent 40%) ,var(--ground);
  border-top:1px solid rgba(255,255,255,.05);border-bottom:2px solid #04191a;box-shadow:0 1px 0 rgba(255,255,255,.04)}
.bay::before,.bay::after{content:"";position:absolute;top:14px;width:12px;height:12px;border-radius:50%;
  background:radial-gradient(circle at 40% 35%,#2a6e67,#123f3b 60%,#0a2725);box-shadow:inset 0 0 0 1px rgba(0,0,0,.4),0 1px 1px rgba(0,0,0,.5)}
.bay::before{left:-17px}.bay::after{right:-17px}
@media (max-width:1359px){.bay::before{left:-13px}.bay::after{right:-13px}}
@media (max-width:1023px){.bay::before,.bay::after{display:none}}
.face{min-width:0;padding:26px var(--padR) 30px var(--padL)}
.gut{position:relative;border-left:1px solid rgba(0,0,0,.25)}
@media (max-width:1023px){.gut{display:none}}
.jack{position:absolute;left:0;right:0;display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center}
.jack .lg{font-size:9px;letter-spacing:.14em;line-height:1.25}
.jh{display:block;width:20px;height:20px;border-radius:50%;background:radial-gradient(circle,#010b0a 0 3px,#6a8f88 3.5px 5px,#2c4c48 5.5px 7px,#19403c 7.5px);box-shadow:0 1px 2px rgba(0,0,0,.6),0 0 0 1px rgba(0,0,0,.3)}
.jk-s{font:500 8px var(--f-mono);color:var(--dim);letter-spacing:.1em}
.mp{display:flex;align-items:center;gap:10px;margin-bottom:22px}
.mp .lg{color:var(--silk)}
.led{display:inline-block;flex:none;width:6px;height:6px;border-radius:50%;background:#1d4a45;box-shadow:inset 0 0 0 1px rgba(0,0,0,.35)}
.led.on,.led.pwr{background:var(--mint);box-shadow:0 0 6px rgba(125,242,201,.8)}
.led.amber{background:var(--amber);box-shadow:0 0 6px rgba(255,181,71,.7)}
.led.red{background:var(--red);box-shadow:0 0 6px rgba(255,122,107,.7)}
.led.blink{animation:blink 1s steps(2,end) infinite}
@keyframes blink{50%{opacity:.25}}
.split{display:grid;grid-template-columns:minmax(0,1.62fr) minmax(0,1fr);gap:28px;align-items:start}
@media (max-width:1023px){.split{grid-template-columns:1fr}}
h1{font:500 var(--fs-h1)/1.08 var(--f-text);letter-spacing:-.01em;color:var(--head)}
h2{font:500 var(--fs-h2)/1.15 var(--f-text);letter-spacing:-.005em;color:var(--head);margin-bottom:18px}
.bd{color:var(--body);max-width:44ch}
.txt{min-width:0;display:flex;flex-direction:column}
.txt-foot{margin-top:auto;padding-top:28px;display:flex;flex-direction:column;align-items:flex-start;gap:20px}
.tape{display:inline-block;background:#030c0b;color:#fff;font:700 13px/1 var(--f-text);letter-spacing:.04em;text-transform:uppercase;padding:7px 11px 6px;transform:rotate(-1.2deg);box-shadow:0 2px 0 rgba(0,0,0,.35)}
.ibm{display:flex;flex-direction:column;gap:8px}
.ibm-w{font:800 22px/1 var(--f-text);letter-spacing:.02em;color:transparent;background:repeating-linear-gradient(180deg,var(--dim) 0 2px,transparent 2px 4px);-webkit-background-clip:text;background-clip:text}
.ibm .lg{color:var(--dim);max-width:44ch}

/* ---------------------------------------------------------------- controls */
.key{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;border:0;border-radius:3px;cursor:pointer;text-decoration:none;
  font:700 var(--fs-key)/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--head);
  background:linear-gradient(180deg,#14504a,#0E3F3B);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),inset 0 0 0 1px rgba(0,0,0,.25),0 2px 0 #031917,0 3px 6px rgba(0,0,0,.35);
  transition:transform .08s var(--ease),box-shadow .08s var(--ease),background .15s}
.key .led{position:absolute;left:8px;top:8px;width:5px;height:5px}
.key:hover{background:linear-gradient(180deg,#17585a,#10463f)}
.key:active,.key.down{transform:translateY(2px);box-shadow:inset 0 1px 0 rgba(255,255,255,.05),inset 0 0 0 1px rgba(0,0,0,.3),0 0 0 #031917}
.key:focus-visible,.dial:focus-visible,.lever:focus-visible,canvas:focus-visible,.bay-img:focus-visible{outline:2px solid var(--mint);outline-offset:2px}
.key:disabled{opacity:.45;cursor:default;transform:none}
.key.primary{background:linear-gradient(180deg,#8CF7D2,#6FE6BD);color:var(--ink);box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 2px 0 #2c9a76,0 6px 18px rgba(125,242,201,.18)}
.key.primary:hover{background:linear-gradient(180deg,#9BFADB,#7DF2C9)}
.key.primary:disabled{opacity:.55}
.vfd{position:relative;background:var(--screen);border-radius:3px;padding:9px 12px;min-width:0;
  box-shadow:inset 0 0 0 1px var(--screen-e),inset 0 2px 8px rgba(0,0,0,.6),0 1px 0 rgba(255,255,255,.04)}
.vl{display:block;font:800 var(--fs-vl)/1.05 var(--f-dot);color:var(--mint);text-shadow:var(--glow);letter-spacing:.02em;white-space:nowrap;overflow:hidden;text-overflow:clip}
.vl.amber,.amber .vl{color:var(--amber);text-shadow:var(--glow-a)}
.vl.sm{font-size:16px;font-family:var(--f-mono);font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.vl-l{display:block;font:600 10px/1 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--silk);margin-bottom:7px}
.scr{position:relative;background:var(--screen);border-radius:3px;overflow:hidden;
  box-shadow:inset 0 0 0 1px var(--screen-e),inset 0 0 40px rgba(0,0,0,.6),0 1px 0 rgba(255,255,255,.04)}
.scr canvas{display:block;width:100%;height:100%}
.scr-leg{position:absolute;font:600 10.5px/1.3 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:rgba(207,237,226,.6);pointer-events:none;z-index:2}
.scr-leg.tl{left:12px;top:10px}.scr-leg.tr{right:12px;top:10px;text-align:right}.scr-leg.bl{left:12px;bottom:10px}.scr-leg.br{right:12px;bottom:8px}
.dial{position:relative;width:132px;height:132px;cursor:grab;touch-action:none;user-select:none}
.dial.small{width:62px;height:62px}
.dial svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}

/* ---------------------------------------------------------------- hero */
.hero .face{display:grid;grid-template-columns:minmax(0,1fr) var(--side);grid-template-areas:"top top" "scr side" "bot under";column-gap:24px;padding-top:14px}
.hz-top{grid-area:top;display:flex;align-items:center;gap:24px;min-height:52px;margin-bottom:12px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.mark{display:inline-block;width:30px;height:30px;flex:none}
.mark svg{width:100%;height:100%;display:block}
.wm{font:600 24px/1 var(--f-wm);color:var(--mint);letter-spacing:-.01em;text-shadow:0 0 14px rgba(125,242,201,.25)}
.plate{display:flex;align-items:center;gap:8px}
.plate .lg{font-size:10px}
.hz-clock{margin-left:auto;display:flex;align-items:center;gap:14px}
.hz-clock .lg{text-align:right;font-size:10px}
.hz-state{min-width:176px}.hz-count{min-width:126px;text-align:center}
.hz-state .vl,.hz-count .vl{font-size:22px}
.hz-wal-m{display:none}
.hz-scr{grid-area:scr;height:clamp(420px,44vw,620px);cursor:crosshair}
.hz-tags{position:absolute;inset:0;pointer-events:none;z-index:2}
.hz-tags span{position:absolute;transform:translate(-50%,-150%);font:700 10.5px/1 var(--f-mono);letter-spacing:.06em;color:var(--silk);white-space:nowrap;text-shadow:0 0 3px #031615,0 0 3px #031615;transition:color .3s}
.hz-tags span.lit{color:#fff;text-shadow:0 0 8px rgba(125,242,201,.9),0 0 3px #000}
.hz-tags span.duel{color:var(--amber)}
.hz-tip{position:absolute;z-index:3;pointer-events:none;background:rgba(2,16,15,.94);border:1px solid var(--screen-e);padding:8px 10px;font:500 11px/1.5 var(--f-mono);color:var(--silk);letter-spacing:.04em;white-space:nowrap}
.hz-tip b{color:var(--mint)}
.hz-side{grid-area:side;display:flex;flex-direction:column;align-items:center;gap:14px}
.hz-keys{display:flex;flex-direction:column;gap:10px;width:100%}
.hz-keys .key{justify-content:flex-start;padding-left:24px}
.hz-q{width:100%;text-align:center}.hz-q .vl{font-size:22px}
.dial-l{margin-top:-4px}
.hz-copy{grid-area:bot;margin-top:24px;max-width:calc(100% - 420px)}
.sub{margin-top:18px;max-width:58ch;color:var(--body)}
.hz-read{grid-area:bot;justify-self:end;width:400px;margin-top:24px;display:flex;flex-direction:column;gap:14px}
.hz-wins{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.hz-wins .vl{font-size:calc(var(--fs-vl) * .82)}
.hz-leg{color:var(--silk);font-size:10px;line-height:1.6}
.hz-cta{display:grid;grid-template-columns:1.6fr 1fr;gap:12px}
.hz-cta .key{min-height:52px}
.hz-under{grid-area:under;margin-top:24px;display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.hz-under .key{width:100%}
.hz-under .tape{margin-top:auto;align-self:flex-end}
@media (max-width:1279px){.hz-copy{max-width:calc(100% - 380px)}.hz-read{width:360px}}
@media (max-width:1023px){
  .hero .face{grid-template-columns:1fr;grid-template-areas:"top" "scr" "copy" "read" "side" "under"}
  .hz-top{flex-wrap:wrap;gap:12px}
  .plate{display:none}
  .hz-wal-m{display:inline-flex;margin-left:auto}
  .hz-clock{width:100%;margin:0;display:grid;grid-template-columns:1fr auto}
  .hz-clock .lg{display:none}
  .hz-state{min-width:0}
  .hz-scr{height:clamp(300px,62vw,520px)}
  .hz-copy{grid-area:copy;max-width:none}
  .hz-read{grid-area:read;width:auto;justify-self:stretch}
  .hz-cta{order:-1;grid-template-columns:1fr}.hz-cta .key:last-child{display:none}
  .hz-side{flex-direction:row;flex-wrap:wrap;margin-top:18px}
  .hz-keys{display:grid;grid-template-columns:repeat(3,1fr)}
  .hz-keys [data-wallet]{display:inline-flex}
  .hz-side .dial,.dial-l{display:none}
  .hz-q{display:none}
}
@media (max-width:599px){.hz-scr{height:300px}.hz-wins .vl{font-size:22px}.hz-keys .key{padding-left:22px;font-size:11.5px;letter-spacing:.1em}}

/* ---------------------------------------------------------------- house coin */
.tk-r1{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px}
.tk-ca{display:flex;align-items:center;font:600 17px/1.3 var(--f-mono);color:var(--mint);word-break:break-all;letter-spacing:.02em}
.tk-keys{display:grid;grid-template-columns:repeat(4,auto);gap:8px}
.tk-r2{display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) auto minmax(0,1.6fr);gap:12px;margin-top:14px;align-items:center}
.tk-poll{display:flex;align-items:center;gap:8px}
.tk-st{display:flex;align-items:center;min-height:56px}
@media (max-width:1023px){.tk-r1{grid-template-columns:1fr}.tk-keys{grid-template-columns:repeat(4,1fr)}.tk-r2{grid-template-columns:repeat(2,1fr)}.tk-poll,.tk-st{grid-column:span 2}}
@media (max-width:599px){.tk-keys{grid-template-columns:repeat(2,1fr)}}

/* ---------------------------------------------------------------- fridge */
.fr-scr{height:500px}
.fr-rows{position:absolute;right:20px;top:72px;bottom:56px;width:min(300px,44%);display:flex;flex-direction:column;justify-content:space-between;z-index:2}
.fr-row{display:grid;grid-template-columns:1fr 110px;align-items:end;gap:10px}
.fr-row .lg{font-size:10px;grid-column:1/-1;margin-bottom:-4px}
.fr-row .vl{font-size:26px}
.fr-row .u{font:600 11px var(--f-mono);color:var(--silk);margin-left:6px;text-shadow:none}
.fr-row canvas{width:110px;height:22px}
.ladder{margin-top:30px;position:relative;height:74px}
.ladder svg{width:100%;height:100%;overflow:visible}
@media (max-width:599px){.fr-scr{height:auto}.fr-scr canvas{height:330px}.fr-rows{position:static;width:auto;display:grid;grid-template-columns:1fr 1fr;gap:12px 16px;padding:0 14px 16px}.fr-row{grid-template-columns:1fr}.fr-row canvas{display:none}.fr-row .vl{font-size:20px}.fr-scr .scr-leg.bl{top:10px;bottom:auto}
  .hz-scr .scr-leg.tr{display:none}.hz-tags span{font-size:9px}}

/* ---------------------------------------------------------------- sequencer */
.sq-scr{height:264px}

/* ---------------------------------------------------------------- noise */
.na-grid{display:grid;grid-template-columns:minmax(0,1fr) 172px minmax(0,1.25fr);gap:24px;align-items:start}
.na-iq{height:464px}
.na-sw{display:flex;flex-direction:column;gap:10px;align-items:stretch}
.na-sw .dial{align-self:center;width:120px;height:120px;margin-bottom:6px}
.na-sw .vfd .vl{font-size:22px}
.na-desc{font:400 13px/1.45 var(--f-mono);color:var(--body);text-align:center;min-height:38px}
.na-medl{margin-top:6px;color:var(--mint);font-size:10px}
.na-medl b{font-weight:600}
.gbar{display:grid;grid-template-columns:var(--g-cols,1fr 3fr 2fr 1fr);margin-top:6px;border:1px solid rgba(125,242,201,.35);border-radius:2px;overflow:hidden}
.gbar button{border:0;border-right:1px solid rgba(125,242,201,.25);background:transparent;padding:8px 6px;font:700 10.5px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--silk);cursor:pointer;min-width:0;overflow:hidden;white-space:nowrap}
.gbar button:last-child{border-right:0;color:var(--amber)}
.gbar button[aria-checked=true]{background:var(--mint-2);color:var(--mint)}
.gbar button:last-child[aria-checked=true]{background:rgba(255,181,71,.18);color:var(--amber)}
.glab{margin:10px 0 18px;color:var(--mint)}
.na-hon{color:var(--body);font-size:15px;margin-bottom:16px}
.na-map{height:240px}
@media (max-width:1279px){.na-grid{grid-template-columns:minmax(0,1fr) 160px}.na-grid .txt{grid-column:1/-1}}
@media (max-width:1023px){.na-grid{grid-template-columns:1fr}.na-iq{height:360px}.na-sw{display:grid;grid-template-columns:1fr 1fr}.na-sw .dial,.na-desc,.na-medl{grid-column:1/-1}.na-sw .dial{justify-self:center;margin:22px 0 18px}}

/* ---------------------------------------------------------------- bell */
.bl-scr{height:400px}
.bl-score{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:10px}
.sc{padding:14px 16px}
.sc-t{display:block;font:700 13px/1.2 var(--f-mono);letter-spacing:.06em;color:var(--head);margin-bottom:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sc .vl{font-size:68px;text-align:center}
.bl-leg{margin-bottom:28px;font-size:10px}
#bell .key.primary{align-self:flex-start;min-width:220px;min-height:48px;margin:22px 0 22px}
@media (max-width:599px){.bl-scr{height:300px}.sc .vl{font-size:52px}}

/* ---------------------------------------------------------------- vent */
.vent .face{padding:14px var(--padL)}
.vents{height:14px;background:repeating-linear-gradient(90deg,#021312 0 26px,transparent 26px 36px);border-radius:3px;opacity:.9}

/* ---------------------------------------------------------------- pale units */
.pale{background:var(--pale) repeating-linear-gradient(0deg,rgba(0,0,0,.012) 0 1px,transparent 1px 3px);color:var(--pale-ink);border-bottom-color:#9fb8b0}
.pale .lg{color:var(--pale-ink)}
.pale h2{color:var(--pale-ink)}
.pale .bd{color:var(--pale-body)}
.pale .fine{color:var(--pale-body)}
.pale .gut{border-left-color:rgba(0,0,0,.08)}
.pale .key:not(.primary){background:linear-gradient(180deg,#F1F7F3,#E1ECE6);color:var(--pale-ink);box-shadow:inset 0 1px 0 #fff,inset 0 0 0 1px rgba(10,58,55,.14),0 2px 0 #a9c1b9,0 3px 6px rgba(10,58,55,.12)}
.pale .key:not(.primary):active{box-shadow:inset 0 0 0 1px rgba(10,58,55,.18)}
.pale .key .led{background:#b9cfc8}
.pale .key .led.on{background:#23A57B;box-shadow:0 0 5px rgba(35,165,123,.7)}
.pale .led.pwr,.pale .fl .led.on{background:#23A57B;box-shadow:0 0 5px rgba(35,165,123,.6)}
.deck-h{margin-bottom:30px}
.zones{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr) minmax(0,.73fr);gap:24px;align-items:start}
@media (max-width:1279px){.zones{grid-template-columns:1fr 1fr}.zones #zC{grid-column:1/-1}}
@media (max-width:1023px){.zones{grid-template-columns:1fr}}
.grp{display:flex;align-items:center;gap:10px;margin-bottom:16px;min-height:26px}
.grp::before{content:"";width:6px;height:10px;border-left:1px solid rgba(10,58,55,.5);border-top:1px solid rgba(10,58,55,.5);align-self:flex-end}
.grp i{flex:1;height:1px;background:rgba(10,58,55,.3)}
.fl{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.fl.gap{margin-top:18px}
.fl-m{margin-left:auto;font:600 10px var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--pale-body)}
.fl-m.err{color:#c4462f}
.fl .led{width:5px;height:5px}
.fl .led.bad{background:#e2694f;box-shadow:0 0 5px rgba(226,105,79,.6)}
.win{display:flex;align-items:center;background:var(--screen);border-radius:3px;box-shadow:inset 0 0 0 1px #0e3c38,inset 0 2px 6px rgba(0,0,0,.6);min-height:42px}
.win input,.win textarea{flex:1;min-width:0;border:0;outline:0;background:transparent;color:var(--mint);font:600 15px/1.4 var(--f-mono);letter-spacing:.04em;padding:10px 12px;resize:none}
.win input::placeholder,.win textarea::placeholder{color:rgba(125,242,201,.28)}
.win:focus-within{box-shadow:inset 0 0 0 1px var(--mint),0 0 0 3px rgba(125,242,201,.18)}
.win .pre{padding-left:12px;font:700 15px var(--f-mono);color:var(--mint)}
.win.lk .pre{width:52px;padding:0 0 0 12px;font-size:10.5px;letter-spacing:.14em;color:var(--silk);border-right:1px solid #12403c;align-self:stretch;display:flex;align-items:center}
.win.ta{align-items:stretch}
.links{display:grid;gap:8px}
.za-r1{display:grid;grid-template-columns:160px minmax(0,1fr);gap:20px}
.za-nt{display:flex;flex-direction:column}
.za-nt .fl:not(:first-child){margin-top:12px}
.za-meta{margin-top:14px;font:600 10px/1.6 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--pale-body);display:flex;flex-direction:column}
.bay-img{position:relative;height:148px;background:var(--screen);border-radius:3px;cursor:pointer;display:grid;place-items:center;box-shadow:inset 0 0 0 1px #0e3c38,inset 0 2px 8px rgba(0,0,0,.6);overflow:hidden}
.bay-img input{position:absolute;width:1px;height:1px;opacity:0}
.bay-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:none}
.bay-img.has img{display:block}.bay-img.has .img-leg{display:none}
.bay-img.drag{box-shadow:inset 0 0 0 2px var(--mint)}
.img-leg{display:flex;flex-direction:column;align-items:center;gap:5px;text-align:center;color:var(--silk);font:600 9.5px/1.3 var(--f-mono);letter-spacing:.14em;text-transform:uppercase}
.img-leg b{color:var(--mint);font-size:10.5px;margin-top:4px}
.cn{position:absolute;width:10px;height:10px;border:1px solid rgba(207,237,226,.6)}
.cn.tl{left:8px;top:8px;border-right:0;border-bottom:0}.cn.tr{right:8px;top:8px;border-left:0;border-bottom:0}.cn.bl{left:8px;bottom:8px;border-right:0;border-top:0}.cn.br{right:8px;bottom:8px;border-left:0;border-top:0}
.vfd.mini{margin-left:auto;padding:3px 8px}.vfd.mini .vl{font-size:14px}
.buy{display:grid;grid-template-columns:minmax(0,1fr) 44px 44px 62px;gap:10px;align-items:center}
.buy-v{display:flex;align-items:baseline;gap:8px;min-height:52px;cursor:text}
.buy-v .vl{font-size:26px}
.buy-v .u{margin-left:auto;font:700 11px var(--f-mono);letter-spacing:.14em;color:var(--silk)}
.buy-v input{position:absolute;inset:0;opacity:0;cursor:text}
.buy .key{min-height:44px;padding:0;font-size:20px}
.lever{margin-left:auto;display:flex;align-items:center;gap:8px;cursor:pointer;user-select:none}
.lever .lg{font-size:10px}
.lv{width:62px;height:26px;border-radius:13px;background:var(--screen);box-shadow:inset 0 0 0 1px #0e3c38,inset 0 2px 5px rgba(0,0,0,.6);position:relative}
.lv i{position:absolute;top:4px;left:5px;width:24px;height:18px;border-radius:9px;background:linear-gradient(180deg,#9df9da,#55cfa6);box-shadow:0 1px 2px rgba(0,0,0,.5);transition:left .18s var(--ease)}
.lever[aria-checked=true] .lv i{left:33px;background:linear-gradient(180deg,#ffd08a,#e59b2e)}
.chip{height:400px}
.chip canvas{cursor:pointer}
.filt{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin-top:12px}
.filt .key{min-height:34px;padding:0 4px 0 12px;font-size:10px;letter-spacing:.1em}
.filt .key[aria-pressed=true] .led{background:#23A57B;box-shadow:0 0 5px rgba(35,165,123,.7)}
.qsel{display:grid;grid-template-columns:62px 44px minmax(0,1fr) 44px auto;gap:10px;align-items:center;margin-top:14px}
.qsel .key{min-height:44px;padding:0}
.qv{text-align:center}.qv .vl{font-size:26px}
.occ{text-align:right;font-size:10px;line-height:1.6;color:var(--pale-ink)}
.strip{margin-top:14px;background:var(--screen);border-radius:3px;box-shadow:inset 0 0 0 1px #0e3c38,inset 0 2px 8px rgba(0,0,0,.6);display:grid;grid-template-columns:minmax(0,1fr) 120px 56px;gap:12px;padding:12px 14px;align-items:center;min-height:78px}
.st-t{font:600 12.5px/1.55 var(--f-mono);color:var(--silk);letter-spacing:.04em;min-width:0}
.st-1{display:flex;align-items:center;gap:10px;color:var(--mint);font-weight:700;letter-spacing:.1em}
.grade{font:700 10px var(--f-mono);letter-spacing:.14em;text-transform:uppercase;border:1px solid currentColor;padding:2px 6px}
.grade.feral{color:var(--amber)}
.st-sp span{display:block;font:600 9px var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin-bottom:4px}
.st-sp canvas{width:120px;height:34px;display:block}
.st-iq{width:56px;height:56px}
@media (max-width:599px){.za-r1{grid-template-columns:1fr}.bay-img{height:170px}.filt{grid-template-columns:repeat(3,1fr)}.chip{height:300px}.strip{grid-template-columns:1fr 56px}.st-sp{display:none}.qsel{grid-template-columns:44px minmax(0,1fr) 44px}.qsel .dial,.occ{display:none}}
.zc{display:flex;flex-direction:column;gap:14px}
.req-scr{min-height:540px;display:flex;flex-direction:column}
.req-h{display:flex;justify-content:space-between;padding:12px 14px 6px;font:600 10px var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--silk)}
.req{margin:0;padding:6px 14px 10px;font:500 12.5px/1.6 var(--f-mono);color:var(--silk);white-space:pre-wrap;word-break:break-word;flex:1}
.req .k{color:var(--silk)}.req .v{color:var(--mint)}.req .h{color:var(--head);font-weight:700;letter-spacing:.06em}.req .n{color:var(--dim)}
.req .cur{display:inline-block;width:8px;height:14px;background:var(--mint);vertical-align:-2px;animation:blink 1s steps(2,end) infinite}
.req-st{display:flex;align-items:center;gap:8px;padding:10px 14px;border-top:1px solid #0d3532;font:600 10px/1.4 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--silk);min-height:40px}
.req-st.err{color:var(--red)}
.done{padding:14px;border-top:1px solid #0d3532;font:500 12.5px/1.6 var(--f-mono);color:var(--silk)}
.done b{color:var(--mint)}.done a{color:var(--mint)}
.done .row{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.done .key{min-height:36px;font-size:10.5px;padding:0 12px}
.zc-side{display:flex;flex-direction:column;gap:12px}
.key.wal{justify-content:space-between;padding:0 14px 0 26px;min-height:46px}
.k-sub{font:500 11px var(--f-mono);letter-spacing:.04em;text-transform:none;color:var(--pale-body)}
.key.sign{min-height:56px;font-size:13.5px;letter-spacing:.18em}

/* receipts */
.rx-grid{display:grid;grid-template-columns:minmax(0,1.62fr) minmax(0,1fr);grid-template-areas:"head head" "left prn" "logos prn";column-gap:28px;row-gap:24px}
.rx-head{grid-area:head;display:grid;grid-template-columns:minmax(0,1.62fr) minmax(0,1fr);gap:28px;align-items:start}
.rx-head h2{margin:0}
.rx-left{grid-area:left;min-width:0}
.paper{background:#F1F7F3;border-radius:2px;box-shadow:inset 0 0 0 1px rgba(10,58,55,.12),0 1px 2px rgba(10,58,55,.12)}
.rx-tape{height:250px;padding:0}
.rx-tape canvas{display:block;width:100%;height:100%}
.rx-proof{background:#F1F7F3;margin-top:-1px;padding:14px 16px;box-shadow:inset 0 0 0 1px rgba(10,58,55,.12);font:500 12.5px/1.7 var(--f-mono);color:var(--pale-ink);letter-spacing:.03em}
.pf-h{display:flex;justify-content:space-between;font-weight:700;letter-spacing:.14em;text-transform:uppercase;font-size:11px;margin-bottom:4px}
.pf-h span:last-child{color:var(--pale-body);font-weight:600}
.pf-l{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pf-k{display:flex;gap:18px;margin-top:6px;align-items:center}
.pf-a{font:700 11px var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--pale-ink);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.pf-n{margin-left:auto;font:600 10px var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--pale-body)}
.rx-logos{grid-area:logos;display:flex;gap:40px;align-items:center;flex-wrap:wrap}
.lgo{display:flex;align-items:center;gap:10px;color:var(--pale-ink)}
.lgo .sol{width:26px;height:21px}
.lgo b{font:700 19px/1 var(--f-wm);letter-spacing:.02em}
.lgo .ibm-w{background:repeating-linear-gradient(180deg,var(--pale-ink) 0 2px,transparent 2px 4px);-webkit-background-clip:text;background-clip:text}
.rx-prn{grid-area:prn;display:flex;flex-direction:column;min-width:0}
.prn-h{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.prn-h>span:first-child{display:flex;align-items:center;gap:8px}
.prn-slot{height:12px;border-radius:3px;background:#0b302d;box-shadow:inset 0 2px 4px rgba(0,0,0,.6)}
.prn-out{position:relative;height:620px;overflow:hidden;margin:0 8px;-webkit-mask:linear-gradient(180deg,#000 85%,transparent);mask:linear-gradient(180deg,#000 85%,transparent)}
.rcpt{background:#F7FBF8;padding:18px 18px 26px;font:500 12.5px/1.55 var(--f-mono);color:var(--pale-ink);box-shadow:0 2px 6px rgba(10,58,55,.12);margin-bottom:14px;letter-spacing:.02em;
  -webkit-mask:linear-gradient(#000,#000) top/100% calc(100% - 8px) no-repeat,radial-gradient(circle at 6px 0,transparent 5px,#000 5.5px) bottom/12px 8px repeat-x;mask:linear-gradient(#000,#000) top/100% calc(100% - 8px) no-repeat,radial-gradient(circle at 6px 0,transparent 5px,#000 5.5px) bottom/12px 8px repeat-x}
.rcpt.new{animation:feed 1.6s var(--ease)}
@keyframes feed{from{transform:translateY(-100%)}}
.rcpt .rh{display:flex;justify-content:center;align-items:center;gap:8px;font:600 19px var(--f-wm);color:var(--pale-ink)}
.rcpt .rh .mark{width:24px;height:24px}
.rcpt .rs{text-align:center;font-weight:700;letter-spacing:.12em;margin:6px 0 10px}
.rcpt hr{border:0;border-top:1px dashed rgba(10,58,55,.4);margin:8px 0}
.rcpt .kv{display:grid;grid-template-columns:96px minmax(0,1fr);gap:0 8px}
.rcpt .kv span:nth-child(odd){font-weight:700}
.rcpt .bits{font-size:11.5px;letter-spacing:.06em;word-break:break-all}
.rcpt .tag{text-align:center;margin-top:10px;font-weight:700;letter-spacing:.2em;font-size:10.5px}
@media (max-width:1023px){.rx-grid{grid-template-columns:1fr;grid-template-areas:"head" "left" "logos" "prn"}.rx-head{grid-template-columns:1fr;gap:12px}.prn-out{height:520px}}

/* foot */
.ft-row{display:grid;grid-template-columns:auto minmax(0,.9fr) minmax(0,1fr);gap:28px;align-items:center;position:relative}
.iec{width:72px;display:flex;flex-direction:column;align-items:center;gap:8px}
.iec::before{content:"";width:58px;height:44px;border-radius:6px;background:#0a2523;box-shadow:inset 0 0 0 2px #133e3a,inset 0 0 0 9px #0a2523,inset 0 0 0 10px #1c4a45}
.iec .lg{font-size:8.5px;text-align:center;color:var(--silk)}
.serial{position:relative;display:flex;gap:16px;align-items:center;padding:16px 22px;background:linear-gradient(180deg,#DCEAE4,#C9DCD4);border-radius:2px;color:var(--pale-ink);font:600 11.5px/1.75 var(--f-mono);letter-spacing:.12em;box-shadow:0 2px 0 rgba(0,0,0,.3)}
.serial .mark{width:34px;height:34px}
.rv{position:absolute;width:5px;height:5px;border-radius:50%;background:#9db6ad;box-shadow:inset 0 1px 1px rgba(0,0,0,.4)}
.rv.a{left:6px;top:6px}.rv.b{right:6px;top:6px}.rv.c{left:6px;bottom:6px}.rv.d{right:6px;bottom:6px}
.ft-fine p{font:500 11.5px/1.6 var(--f-mono);color:var(--body);letter-spacing:.02em}
.ft-row>.tape{position:absolute;right:0;top:-44px}
@media (max-width:1023px){.ft-row{grid-template-columns:1fr}.iec{display:none}.ft-row>.tape{position:static;justify-self:start}}

/* ---------------------------------------------------------------- overlays */
.sheet{position:fixed;inset:0;z-index:50;display:grid;place-items:center;background:rgba(1,10,9,.6);backdrop-filter:blur(2px);padding:16px}
.sheet-in{width:min(420px,100%);background:var(--panel);border-radius:4px;padding:20px;box-shadow:0 20px 60px rgba(0,0,0,.6),inset 0 0 0 1px rgba(255,255,255,.06)}
.sheet .mp{margin-bottom:16px}
.sheet .x{margin-left:auto;background:none;border:0;color:var(--silk);font-size:24px;cursor:pointer;line-height:1}
.wal-list{display:grid;gap:10px}
.wal-list .key{justify-content:flex-start;gap:12px;padding-left:16px;text-transform:none;letter-spacing:.04em;font-size:14px}
.wal-list img{width:24px;height:24px;border-radius:5px}
.sheet .fine{margin-top:14px}
.sheet .fine a{color:var(--mint)}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:60;background:#03110f;color:var(--head);font:600 12px/1.4 var(--f-mono);letter-spacing:.08em;padding:12px 16px;border-radius:3px;box-shadow:0 8px 30px rgba(0,0,0,.5),inset 0 0 0 1px var(--screen-e);max-width:calc(100% - 32px)}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}