/* ---------- window shell ---------- */
.win-host{position:fixed;inset:0;z-index:40;pointer-events:none}
.win{position:absolute;inset:0;display:none;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;pointer-events:auto;
  padding:calc(var(--st) + 12px) 14px calc(var(--sb) + 24px);background:radial-gradient(120% 80% at 50% 40%,rgba(10,6,20,.55),rgba(5,3,10,.88));will-change:transform,opacity}
.win.open{display:block}
.win-frame{max-width:480px;margin:0 auto}
body.win-open .hud-top,body.win-open .dock-wrap,body.win-open .hint-pill{opacity:0;pointer-events:none;transition:opacity .25s}
.hud-top,.dock-wrap{transition:opacity .35s .15s}
.win-close{flex:none;width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-size:18px;font-weight:800;transition:transform .15s var(--spring)}
.win-close:active{transform:scale(.9)}
.w-sub{font:700 13px/1.2 var(--display);letter-spacing:.12em;text-transform:uppercase;color:var(--mute);margin:26px 4px 12px}
.w-note{font-size:12.5px;color:var(--mute);text-align:center;margin:14px 8px 0}
.w-note.dark{color:#3c4a40}
.vbtn{display:flex;align-items:center;justify-content:center;min-height:48px;padding:0 16px;border-radius:14px;font-weight:700;font-size:14.5px;text-decoration:none;color:#fff;background:linear-gradient(180deg,#3a3350,#221d33);border:1px solid rgba(255,255,255,.14);box-shadow:0 4px 0 #0d0a16,inset 0 1px 0 rgba(255,255,255,.2)}
.vbtn:active,.vbtn.down{transform:translateY(3px);box-shadow:0 1px 0 #0d0a16,inset 0 1px 0 rgba(255,255,255,.2)}
.vbtn.gold{color:#2a1a00;background:linear-gradient(180deg,#ffe08a,#ffb938);border-color:#ffd36b;box-shadow:0 4px 0 #8a5a00,0 0 18px rgba(255,198,90,.35)}
.vbtn:disabled{opacity:.45}
.ins-btns{display:grid;gap:10px;margin-top:16px}

/* ---------- TV: CRT ---------- */
.crt-set{padding:14px;border-radius:26px;background:linear-gradient(180deg,#7a6450,#4a3a2c 60%,#3a2c20);border:3px solid #1f1812;box-shadow:0 30px 60px rgba(0,0,0,.7),inset 0 2px 0 rgba(255,255,255,.2);background-image:repeating-linear-gradient(90deg,rgba(0,0,0,.06) 0 2px,transparent 2px 7px),linear-gradient(180deg,#7a6450,#4a3a2c 60%,#3a2c20)}
.crt-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.crt-brand{font:900 italic 15px var(--display);letter-spacing:.14em;color:#f3e3c3;text-shadow:0 1px 0 #000}
.crt-brand small{font-size:9px;letter-spacing:.3em;color:#d8b47a;margin-left:6px}
.crt-set .win-close{background:linear-gradient(180deg,#d8c6a8,#9c8a6c);color:#3a2c20;box-shadow:0 3px 0 #2a2018}
.crt-bezel{padding:14px;border-radius:22px;background:#1a1410;box-shadow:inset 0 0 0 3px #0c0907,inset 0 6px 14px rgba(0,0,0,.8)}
.crt-screen{position:relative;aspect-ratio:4/3;border-radius:22px/28px;overflow:hidden;background:#06080e;box-shadow:inset 0 0 40px rgba(0,0,0,.9),0 0 30px rgba(120,180,255,.18)}
.crt-screen video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(1.2) contrast(1.05)}
.crt-idle{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;background:radial-gradient(circle,#1b2a6a,#060818);font:700 13px ui-monospace,Menlo,monospace;color:#cfe3ff;text-shadow:0 0 8px #7fb0ff}
.crt-idle b{font-size:26px;color:#7fff9a;text-shadow:0 0 10px #4fff7a}
.crt-osd{position:absolute;right:16px;top:12px;font:800 18px ui-monospace,Menlo,monospace;color:#7fff9a;text-shadow:0 0 8px #4fff7a,2px 2px 0 #000;z-index:3}
.crt-scan{position:absolute;inset:0;z-index:2;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(0,0,0,.32) 0 1px,transparent 1px 3px);animation:roll 8s linear infinite}
.crt-curve{position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(ellipse at 50% 50%,transparent 60%,rgba(0,0,0,.55)),linear-gradient(160deg,rgba(255,255,255,.12),transparent 30%)}
.crt-static{position:absolute;inset:-50%;z-index:4;opacity:0;pointer-events:none;background:repeating-radial-gradient(circle at 17% 32%,#fff 0 1px,#000 1px 2px),repeating-radial-gradient(circle at 62% 71%,#999 0 1px,transparent 1px 3px);mix-blend-mode:screen}
.crt-static.on{animation:static .45s steps(6)}
@keyframes static{0%{opacity:.9;transform:translate(0,0)}25%{transform:translate(-7%,4%)}50%{opacity:.7;transform:translate(5%,-6%)}75%{transform:translate(-3%,7%)}100%{opacity:0;transform:translate(0,0)}}
.crt-ctl{display:flex;align-items:center;gap:12px;margin-top:14px}
.dial{position:relative;width:64px;height:64px;border-radius:50%;flex:none;background:radial-gradient(circle at 35% 30%,#efe6d6,#8c7e6a 70%);box-shadow:0 4px 0 #2a2018,0 6px 14px rgba(0,0,0,.6)}
.dial i{position:absolute;inset:8px;border-radius:50%;background:repeating-conic-gradient(#b8a88e 0 6deg,#a29276 6deg 12deg);transition:transform .45s var(--spring)}
.dial i::after{content:"";position:absolute;left:50%;top:3px;width:4px;height:16px;margin-left:-2px;border-radius:2px;background:#3a2c20}
.dial span{position:absolute;left:50%;bottom:-18px;transform:translateX(-50%);font:800 10px var(--display);color:#f3e3c3;letter-spacing:.2em}
.crt-btns{display:flex;flex-direction:column;gap:8px;flex:1}
.tbtn{min-height:44px;border-radius:10px;font:800 13px var(--display);letter-spacing:.08em;color:#3a2c20;background:linear-gradient(180deg,#e9dcc4,#b9a889);box-shadow:0 4px 0 #2a2018}
.tbtn:active,.tbtn.down{transform:translateY(3px);box-shadow:0 1px 0 #2a2018}
.crt-grille{width:60px;height:92px;border-radius:8px;background:repeating-linear-gradient(0deg,#1f1812 0 3px,#5a4838 3px 6px)}
.vcr{display:flex;align-items:center;gap:10px;margin-top:22px;padding:10px 12px;border-radius:10px;background:linear-gradient(180deg,#2a2a33,#15151b);border:2px solid #0a0a0e;box-shadow:inset 0 1px 0 rgba(255,255,255,.12)}
.vcr-led{width:9px;height:9px;border-radius:50%;background:#3a1010;flex:none}.vcr-led.on{background:#ff3b3b;box-shadow:0 0 10px #ff3b3b}
.vcr-slot{width:110px;height:14px;border-radius:3px;background:#050507;box-shadow:inset 0 2px 4px #000;flex:none}
.vcr-title{font:700 12px ui-monospace,Menlo,monospace;color:#7fe6ff;text-shadow:0 0 6px #4fe6ff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vhs-shelf{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.vhs{position:relative;display:flex;flex-direction:column;min-height:120px;border-radius:6px;overflow:hidden;background:#141217;border:2px solid #050405;box-shadow:0 6px 0 #050405,0 10px 20px rgba(0,0,0,.6);text-align:left}
.vhs:active,.vhs.down{transform:translateY(4px);box-shadow:0 2px 0 #050405}
.vhs-label{height:74px;background-size:cover;background-position:center;border-bottom:3px solid #ff4fb0}
.vhs-name{padding:8px 10px 4px;font:800 13px var(--display);color:#fff;line-height:1.15}
.vhs-reels{display:flex;gap:14px;padding:4px 10px 10px}.vhs-reels i{width:14px;height:14px;border-radius:50%;border:3px solid #444;background:#111}
.vhs.in{outline:2px solid #7fff9a;box-shadow:0 0 0 4px rgba(127,255,154,.2),0 6px 0 #050405}
.vhs-fly{position:fixed;z-index:60;pointer-events:none;margin:0}

/* ---------- cassette boombox ---------- */
.boom{position:relative;margin-top:22px;padding:16px 14px 18px;border-radius:24px;background:linear-gradient(180deg,#d9d4cc,#a7a097 55%,#8d877e);border:3px solid #2a2622;box-shadow:0 30px 60px rgba(0,0,0,.7),inset 0 2px 0 #fff9;color:#2a2622}
.boom-handle{position:absolute;left:22%;right:22%;top:-22px;height:28px;border:6px solid #3a3530;border-bottom:0;border-radius:18px 18px 0 0}
.boom-head{display:flex;align-items:center;gap:10px}
.boom-brand{font:900 italic 17px var(--display);letter-spacing:.06em;color:#2a2622}.boom-brand b{color:#d12f6e}
.boom-model{font:700 9px var(--display);letter-spacing:.24em;color:#5d564d;margin-right:auto}
.boom .win-close{background:linear-gradient(180deg,#3a3530,#1d1a17);color:#e9e2d6;box-shadow:0 3px 0 #000}
.boom-face{display:flex;align-items:center;gap:10px;margin-top:14px}
.spk{width:58px;height:58px;border-radius:50%;flex:none;background:radial-gradient(circle,#2a2622 30%,#1a1714 32%,#2a2622 60%,#0f0d0b);box-shadow:inset 0 0 0 4px #5d564d,0 2px 0 #fff6}
.spk i{display:block;width:100%;height:100%;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.15) 0 10%,transparent 12%);transform:scale(calc(1 + var(--beat)*.12))}
.cass-bay{flex:1;padding:8px;border-radius:10px;background:#1d1a17;box-shadow:inset 0 3px 8px #000}
.cassette{position:relative;padding:8px;border-radius:8px;background:linear-gradient(180deg,#3a3446,#24202e);border:1px solid #000}
.cass-label{display:flex;flex-direction:column;padding:5px 8px;border-radius:4px;background:linear-gradient(180deg,#fff4dc,#f1d9a8);color:#3a2418;min-height:38px;background-image:repeating-linear-gradient(0deg,transparent 0 9px,rgba(209,47,110,.25) 9px 10px),linear-gradient(180deg,#fff4dc,#f1d9a8)}
.cass-label span{font:700 italic 14px "Snell Roundhand","Segoe Script",cursive;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cass-label small{font-size:9px;letter-spacing:.1em;color:#7a5a40}
.cass-win{position:relative;display:flex;align-items:center;justify-content:space-between;margin:8px 12px 2px;height:44px;padding:0 6px;border-radius:22px;background:rgba(10,8,14,.85);box-shadow:inset 0 0 8px #000}
.reel{position:relative;width:34px;height:34px;border-radius:50%;background:radial-gradient(circle,#e9e2d6 0 22%,#5a3a26 24% 100%);will-change:transform}
.reel i{position:absolute;inset:9px;border-radius:50%;background:conic-gradient(#e9e2d6 0 12%,transparent 0 33%,#e9e2d6 0 45%,transparent 0 66%,#e9e2d6 0 78%,transparent 0)}
.tape-band{position:absolute;left:30%;right:30%;top:50%;height:3px;margin-top:-1.5px;background:#5a3a26}
.cass-screws{position:absolute;inset:0;pointer-events:none}.cass-screws i{position:absolute;width:5px;height:5px;border-radius:50%;background:#8a8496}.cass-screws i:nth-child(1){left:4px;top:4px}.cass-screws i:nth-child(2){right:4px;top:4px}.cass-screws i:nth-child(3){left:4px;bottom:4px}.cass-screws i:nth-child(4){right:4px;bottom:4px}
.vu-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}
.vu{position:relative;height:74px;border-radius:8px;overflow:hidden;background:radial-gradient(ellipse at 50% 110%,#ffe7a8,#f3c76a);box-shadow:inset 0 0 0 3px #3a3530,inset 0 6px 12px rgba(0,0,0,.35)}
.vu-scale{position:absolute;left:12%;right:12%;top:14px;height:60px;border-radius:50% 50% 0 0;border-top:2px solid #3a2418;background:repeating-conic-gradient(from -52deg at 50% 100%,#3a2418 0 1deg,transparent 1deg 9deg);-webkit-mask:radial-gradient(circle at 50% 100%,transparent 70%,#000 71%);mask:radial-gradient(circle at 50% 100%,transparent 70%,#000 71%)}
.vu-scale::after{content:"";position:absolute;right:0;top:0;width:30%;height:100%;background:rgba(209,47,110,.45)}
.needle{position:absolute;left:50%;bottom:-6px;width:2px;height:62px;margin-left:-1px;background:#1d1a17;transform-origin:50% 100%;transform:rotate(-50deg);transition:transform .08s linear}
.vu span{position:absolute;left:8px;bottom:6px;font:800 11px var(--display);color:#3a2418}
.pkeys{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:16px;padding:8px;border-radius:10px;background:#2a2622;box-shadow:inset 0 3px 6px #000}
.pkey{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:64px;border-radius:4px 4px 8px 8px;font-size:15px;color:#2a2622;background:linear-gradient(180deg,#fbf8f2,#d8d0c2);box-shadow:0 8px 0 #8d877e,0 9px 0 #000;transition:transform .08s,box-shadow .08s}
.pkey small{font:800 9px var(--display);letter-spacing:.14em;color:#5d564d}
.pkey:active,.pkey.down,.pkey.latched{transform:translateY(6px);box-shadow:0 2px 0 #8d877e,0 3px 0 #000}
.pkey.latched{background:linear-gradient(180deg,#ffd0e2,#f39ac0)}
.prog{display:flex;align-items:center;gap:10px;margin-top:16px;font:700 12px ui-monospace,Menlo,monospace;color:#3a3530}
.prog-bar{flex:1;height:6px;border-radius:3px;background:#5d564d;overflow:hidden}.prog-bar i{display:block;height:100%;background:#d12f6e;transform-origin:left;transform:scaleX(0)}
.boom .w-sub{color:#3a3530}
.mix{display:flex;flex-direction:column;gap:6px}
.mix-row{display:flex;align-items:center;gap:12px;min-height:50px;padding:0 12px;border-radius:10px;background:rgba(255,255,255,.35);border:1px solid rgba(0,0,0,.12);text-align:left;color:#2a2622}
.mix-row.on{background:#fff4dc;box-shadow:inset 3px 0 0 #d12f6e}
.mix-n{font:800 12px ui-monospace,Menlo,monospace;color:#7a5a40}.mix-t{flex:1;font-weight:650;font-size:14.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mix-eq{display:none;gap:2px;align-items:flex-end;height:14px}.mix-row.on .mix-eq{display:flex}.mix-eq i{width:3px;background:#d12f6e;height:40%}
.boom.rolling .mix-row.on .mix-eq i,.win.rolling .mix-row.on .mix-eq i{animation:eqb .8s ease-in-out infinite}.mix-eq i:nth-child(2){animation-delay:.2s!important}.mix-eq i:nth-child(3){animation-delay:.4s!important}
@keyframes eqb{50%{height:100%}}
.suno{display:block;text-align:center;margin-top:16px;padding:12px;color:#d12f6e;font-weight:700;text-decoration:none}

/* ---------- badge cabinet ---------- */
.vault{padding:16px;border-radius:24px;background:linear-gradient(180deg,#4a2f20,#2c1a10);border:4px solid #1a0f08;box-shadow:0 30px 60px rgba(0,0,0,.7),inset 0 2px 0 rgba(255,255,255,.12)}
.vault-head{display:flex;align-items:center;justify-content:space-between;font:900 15px var(--display);letter-spacing:.24em;color:#ffd59a;text-shadow:0 0 10px rgba(255,190,110,.6)}
.vault .win-close{background:linear-gradient(180deg,#c99a5b,#8a6230);color:#2a1a0c;box-shadow:0 3px 0 #1a0f08}
.vault-sub{font-size:13px;color:#d8b48a;margin:8px 2px 14px}
.vault-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:14px;border-radius:14px;background:#3a1c2c radial-gradient(circle at 30% 20%,rgba(255,255,255,.06),transparent 60%);box-shadow:inset 0 4px 14px rgba(0,0,0,.7)}
.vb{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 4px;min-height:104px;border-radius:12px;background:rgba(0,0,0,.25)}
.vb-ic{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;font-size:26px;color:var(--c);background:radial-gradient(circle at 35% 30%,rgba(255,255,255,.35),rgba(255,255,255,.04) 60%),#1a1020;box-shadow:0 0 0 3px color-mix(in srgb,var(--c) 60%,#000),0 0 18px color-mix(in srgb,var(--c) 45%,transparent);text-shadow:0 0 10px var(--c)}
.vb-n{font-size:11.5px;font-weight:700;color:#f3e3c3;text-align:center;line-height:1.15}
.vb.locked .vb-ic{filter:grayscale(1) brightness(.5);box-shadow:0 0 0 3px #333}
.vb-lock{position:absolute;right:10px;top:8px;font-size:12px}
.vb.got::after{content:"✓";position:absolute;right:10px;top:8px;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;font-size:11px;background:#ffc65a;color:#2a1a00}
.inspect{margin-top:16px;padding:18px;border-radius:18px;background:radial-gradient(ellipse at 50% 20%,#3a2450,#140a1c);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1);text-align:center}
.inspect h2{font:800 24px var(--display);margin-top:14px;color:#fff}
.ins-how{color:#e8d8ff;font-size:14.5px;margin-top:6px}.ins-state{color:#ffc65a;font-size:13.5px;font-weight:700;margin-top:8px}
.ins-stage{height:230px;display:grid;place-items:center;perspective:700px;touch-action:none;cursor:grab}
.medal{position:relative;width:180px;height:180px;transform-style:preserve-3d;transition:transform .05s linear}
.medal.spring{transition:transform .7s var(--spring)}
.medal.pop{animation:pop .6s var(--spring)}
@keyframes pop{40%{scale:1.15}}
.m-face,.m-back{position:absolute;inset:0;border-radius:50%;display:grid;place-items:center;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.m-face{font-size:84px;color:var(--c);text-shadow:0 0 22px var(--c),0 3px 0 rgba(0,0,0,.4);background:radial-gradient(circle at 35% 30%,rgba(255,255,255,.4),transparent 45%),radial-gradient(circle,#2a1838 55%,#120a1c 56%);box-shadow:0 0 0 10px color-mix(in srgb,var(--c) 70%,#000),0 0 0 13px #0b0610,0 20px 40px rgba(0,0,0,.6),0 0 50px color-mix(in srgb,var(--c) 40%,transparent)}
.m-back{transform:rotateY(180deg);flex-direction:column;background:repeating-radial-gradient(circle,#c99a5b 0 2px,#a8783c 2px 4px);box-shadow:0 0 0 10px #8a6230,0 0 0 13px #0b0610;color:#2a1a0c;font:900 18px var(--display);letter-spacing:.2em}
.m-back small{display:block;font-size:10px}
.m-shine{position:absolute;inset:0;border-radius:50%;pointer-events:none;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.55) 48%,transparent 60%);background-size:250% 100%;background-position:var(--sx,120%) 0;mix-blend-mode:overlay;animation:shine 3.5s ease-in-out infinite}
@keyframes shine{0%,50%{background-position:130% 0}100%{background-position:-60% 0}}
.medal.locked .m-face{filter:grayscale(1) brightness(.6)}

/* ---------- coin terminal ---------- */
.tcase{padding:16px;border-radius:22px;background:linear-gradient(180deg,#d4d2da,#9e9bab 60%,#7d7a8a);border:3px solid #2a2834;box-shadow:0 30px 60px rgba(0,0,0,.7),inset 0 2px 0 #fff}
.tcase-head{display:flex;align-items:center;justify-content:space-between;font:900 13px var(--display);letter-spacing:.16em;color:#2a2834}
.tcase .win-close{background:linear-gradient(180deg,#ff6a6a,#b81f1f);color:#fff;box-shadow:0 4px 0 #5a0c0c}
.phos{position:relative;margin-top:12px;min-height:360px;padding:16px;border-radius:18px;overflow:hidden;background:radial-gradient(ellipse at 50% 40%,#0c2e18,#020904 80%);box-shadow:inset 0 0 40px #000,0 0 0 6px #22202c,0 0 0 8px #4a4860,0 0 30px rgba(92,255,157,.25)}
.phos-in{position:relative;z-index:1;font:700 14px/1.45 ui-monospace,Menlo,monospace;color:#5cff9d;text-shadow:0 0 6px rgba(92,255,157,.8);transform-origin:top}
.phos-scan{position:absolute;inset:0;z-index:2;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(0,0,0,.28) 0 1px,transparent 1px 3px),radial-gradient(ellipse,transparent 60%,rgba(0,0,0,.5));animation:flickp 4s infinite}
@keyframes flickp{0%,96%,100%{opacity:1}97%{opacity:.8}}
.ph-h{font-size:16px}.dim{color:#2fa860;text-shadow:none}.tiny{font-size:11px;margin:-2px 0 6px}
.ph-stats{display:grid;grid-template-columns:1fr 1fr;gap:6px 14px;margin:10px 0 12px}
.ph-stats span{display:flex;flex-direction:column;font-size:11px;color:#2fa860;text-shadow:none}.ph-stats b{font-size:17px;color:#5cff9d;text-shadow:0 0 6px rgba(92,255,157,.8)}
.ph-stats b.dn{color:#ff7a6a;text-shadow:0 0 6px rgba(255,122,106,.7)}
.tchart{width:100%;height:auto;display:block;margin:4px 0 8px}
.ph-row{display:flex;justify-content:space-between;gap:10px;border-bottom:1px dashed rgba(92,255,157,.2);padding:5px 0}.ph-row span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ph-row.sell b,.ph-row.sell span{color:#ff9a7a;text-shadow:0 0 6px rgba(255,122,106,.6)}
.ph-link{display:block;margin-top:14px;padding:12px;text-align:center;border:2px solid #5cff9d;border-radius:6px;color:#5cff9d;text-decoration:none;box-shadow:0 0 12px rgba(92,255,157,.3)}
.blink{animation:led 1s steps(2) infinite}
.tctl{display:flex;align-items:center;gap:14px;margin-top:16px}
.knob-wrap{position:relative;width:96px;flex:none;text-align:center}
.cknob{position:relative;width:70px;height:70px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#f2f1f6,#7d7a8a 70%);box-shadow:0 5px 0 #2a2834,0 8px 16px rgba(0,0,0,.5)}
.cknob i{position:absolute;inset:10px;border-radius:50%;background:repeating-conic-gradient(#3a3846 0 8deg,#2a2834 8deg 16deg);transform:rotate(-30deg);transition:transform .5s var(--spring)}
.cknob i::after{content:"";position:absolute;left:50%;top:3px;width:5px;height:16px;margin-left:-2.5px;border-radius:3px;background:#5cff9d;box-shadow:0 0 8px #5cff9d}
.kl{display:inline-block;font:800 10px var(--display);letter-spacing:.08em;color:#4a4860;margin:6px 3px 0}.kl.on{color:#0c6a34;text-shadow:0 0 6px rgba(92,255,157,.8)}
.tkeys{flex:1;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.key{min-height:46px;border-radius:8px;font:800 12px var(--display);letter-spacing:.08em;color:#d6ffe6;background:linear-gradient(180deg,#2e3c34,#16201a);box-shadow:0 5px 0 #070b09,inset 0 0 0 1px rgba(92,255,157,.25);transition:transform .08s,box-shadow .08s}
.key.on{color:#5cff9d;text-shadow:0 0 6px #5cff9d;box-shadow:0 5px 0 #070b09,inset 0 0 0 1px #5cff9d,inset 0 0 14px rgba(92,255,157,.35)}
.key:active,.key.down{transform:translateY(4px);box-shadow:0 1px 0 #070b09,inset 0 0 0 1px rgba(92,255,157,.35)}
.trange{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}.key.sm{min-height:44px}

/* ---------- creations gallery ---------- */
.gallery{padding:16px;border-radius:22px;background:#2a1638 repeating-linear-gradient(90deg,rgba(255,255,255,.03) 0 2px,transparent 2px 40px);border:1px solid rgba(255,255,255,.1);box-shadow:0 30px 60px rgba(0,0,0,.7)}
.gal-head{display:flex;align-items:center;gap:10px}
.gal-title{font:900 italic 22px var(--display);color:#fff;text-shadow:0 0 6px #fff,0 0 18px var(--pink),0 0 36px var(--pink)}
.gal-head small{color:var(--mute);margin-right:auto;font-size:12px}
.gallery .win-close{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2)}
.gal-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px 14px;margin-top:18px}
.gal-p{position:relative;padding:8px 8px 10px;background:#f4ede0;border-radius:3px;box-shadow:0 10px 20px rgba(0,0,0,.6);transform:rotate(var(--r));color:#2a1a10;text-align:left}
.gal-p::before{content:"";position:absolute;left:50%;top:-6px;width:12px;height:12px;margin-left:-6px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#ff9ec7,#c2135f);box-shadow:0 2px 3px rgba(0,0,0,.5)}
.gal-img{display:block;aspect-ratio:1;background-size:cover;background-position:center;background-color:#222}
.gal-cap{display:block;margin-top:7px;font-size:12.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gal-vid{position:absolute;right:14px;top:14px;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-size:11px;color:#fff;background:rgba(0,0,0,.6)}
.gal-view{margin-top:20px;padding:16px;border-radius:18px;background:rgba(0,0,0,.35);text-align:center}
.gal-frame{padding:10px;background:#f4ede0;border-radius:4px;box-shadow:0 14px 30px rgba(0,0,0,.6)}.gal-frame img{width:100%;height:auto;display:block}
.gal-view h2{font:800 22px var(--display);margin-top:14px}

/* ---------- arcade ---------- */
.cab{padding:14px;border-radius:22px 22px 10px 10px;background:linear-gradient(90deg,#1b1030,#3a2160 50%,#1b1030);border:3px solid #0c0616;box-shadow:0 30px 60px rgba(0,0,0,.7)}
.cab-marq{position:relative;display:flex;align-items:center;justify-content:center;min-height:56px;padding:0 56px;border-radius:10px;background:linear-gradient(180deg,#ff6ab3,#a3125b);box-shadow:0 0 26px rgba(255,79,176,.6),inset 0 2px 0 rgba(255,255,255,.4)}
.cab-marq span{font:900 italic 19px var(--display);letter-spacing:.08em;color:#fff;text-shadow:0 0 10px #fff,0 2px 0 #5a0830;animation:flick 6s infinite}
.cab-marq .win-close{position:absolute;right:6px;top:6px;background:rgba(0,0,0,.35);color:#fff}
.cab-screen{position:relative;margin-top:14px;border-radius:14px;overflow:hidden;box-shadow:inset 0 0 0 6px #0a0614,0 0 26px rgba(79,230,255,.3)}
.cab-screen canvas{display:block;width:100%;height:auto;aspect-ratio:3/4;touch-action:none;background:#050414}
.cab-scan{position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(0,0,0,.25) 0 1px,transparent 1px 3px),radial-gradient(ellipse,transparent 65%,rgba(0,0,0,.5))}
.cab-panel{display:flex;align-items:center;gap:14px;margin-top:14px;padding:14px;border-radius:12px;background:linear-gradient(180deg,#24143e,#120a22)}
.stick{position:relative;width:64px;height:64px;border-radius:50%;flex:none;background:radial-gradient(circle,#0a0614 40%,#2a1a44);box-shadow:inset 0 3px 6px #000}
.stick i{position:absolute;left:50%;top:50%;width:16px;height:36px;margin:-30px 0 0 -8px;border-radius:8px;background:linear-gradient(90deg,#999,#eee,#999);transform-origin:50% 100%;transition:transform .12s}
.stick i::before{content:"";position:absolute;left:50%;top:-12px;width:28px;height:28px;margin-left:-14px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ff9ec7,#d1104f)}
.abtn{flex:1;min-height:56px;border-radius:999px;font:900 13px var(--display);letter-spacing:.1em;color:#fff;box-shadow:0 6px 0 #000,inset 0 2px 0 rgba(255,255,255,.4);transition:transform .08s,box-shadow .08s}
.abtn.red{background:radial-gradient(circle at 35% 30%,#ff8fa8,#d1104f)}.abtn.blue{background:radial-gradient(circle at 35% 30%,#9ff3ff,#1aa9d6)}
.abtn:active,.abtn.down{transform:translateY(5px);box-shadow:0 1px 0 #000,inset 0 2px 0 rgba(255,255,255,.4)}
.cab-hi{text-align:center;font:800 13px ui-monospace,Menlo,monospace;color:var(--gold);margin-top:10px}

/* ---------- crew manifest (amber) ---------- */
.amber{padding:16px;border-radius:20px;background:radial-gradient(ellipse at 50% 30%,#2a1a06,#0c0702);box-shadow:inset 0 0 50px #000,0 0 0 6px #2a2620,0 0 0 9px #5a5248,0 30px 60px rgba(0,0,0,.7);font-family:ui-monospace,Menlo,monospace;color:#ffb347;text-shadow:0 0 6px rgba(255,179,71,.6)}
.amber-head{display:flex;align-items:center;justify-content:space-between;font-weight:800;letter-spacing:.1em;font-size:14px}
.amber .win-close{color:#ffb347;border:2px solid #ffb347;background:none}
.amb-sub{font-size:12px;color:#c07a20;margin:8px 0 14px}
.amb-find{display:flex;align-items:center;gap:8px;min-height:50px;padding:0 12px;border:2px solid #ffb347;border-radius:8px}
.amb-find input{flex:1;min-width:0;background:none;border:0;outline:0;color:#ffd08a;font:700 16px ui-monospace,Menlo,monospace;text-shadow:0 0 6px rgba(255,179,71,.6)}
.amb-find input::placeholder{color:#7a4a10}
.amb-card{display:flex;flex-direction:column;gap:4px;margin-top:12px;padding:12px;border:1px dashed #ffb347;border-radius:8px;font-size:13px}.amb-card b{font-size:16px}.amb-gap{color:#ffd08a}
.rockers{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:16px 0 12px}
.rocker{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:56px;border-radius:8px;font:800 10px ui-monospace,Menlo,monospace;color:#7a4a10;background:linear-gradient(180deg,#2a2016,#140e08);box-shadow:0 5px 0 #000,inset 0 0 0 1px #5a3a10;transition:transform .08s,box-shadow .08s}
.rocker small{font-size:10px}
.rocker.on{color:#ffb347;text-shadow:0 0 8px #ffb347;transform:translateY(3px);box-shadow:0 2px 0 #000,inset 0 0 0 1px #ffb347,inset 0 0 16px rgba(255,179,71,.25)}
.amb-list{display:flex;flex-direction:column}
.amb-row{display:grid;grid-template-columns:28px 1fr auto auto;gap:8px;align-items:center;min-height:46px;border-bottom:1px dashed rgba(255,179,71,.25);font-size:13px}
.amb-seat{color:#c07a20}.amb-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.amb-name small{color:#c07a20;font-size:10px}.amb-bal{color:#ffd08a}.amb-pay{min-width:52px;text-align:right;font-weight:800;font-size:11px}
.amb-fold{margin-top:18px}.amb-fold summary{list-style:none;min-height:46px;display:flex;align-items:center;font-size:12px;font-weight:800;cursor:pointer}.amb-fold summary::-webkit-details-marker{display:none}
.amb-foot{font-size:11px;color:#c07a20;margin-top:16px;line-height:1.5}

/* ---------- teletype ---------- */
.tele{padding:14px;border-radius:18px;background:linear-gradient(180deg,#5a5a64,#2e2e36);border:3px solid #15151b;box-shadow:0 30px 60px rgba(0,0,0,.7)}
.tele-head{display:flex;align-items:center;justify-content:space-between;font:900 13px var(--display);letter-spacing:.16em;color:#e9e9f2}
.tele .win-close{background:linear-gradient(180deg,#e9e9f2,#a8a8b4);color:#2e2e36;box-shadow:0 3px 0 #000}
.paper{margin-top:12px;padding:18px 22px;background:#fbf7e9;color:#2a2420;font:700 13.5px/1.55 ui-monospace,Menlo,monospace;border-radius:2px;box-shadow:0 10px 20px rgba(0,0,0,.5);
  background-image:radial-gradient(circle at 8px 50%,#2e2e36 4px,transparent 4.5px),radial-gradient(circle at calc(100% - 8px) 50%,#2e2e36 4px,transparent 4.5px),repeating-linear-gradient(0deg,rgba(0,80,160,.07) 0 1px,transparent 1px 22px);background-size:100% 24px,100% 24px,auto;background-repeat:repeat-y}
.tl{padding:10px 4px;border-bottom:1px dashed rgba(0,0,0,.2)}.tl b{display:block;color:#b1123f;letter-spacing:.14em;font-size:12px}.tl p{margin-top:3px}
.tl.end{text-align:center;color:#7a7060;border:0;font-size:12px}

/* ---------- ID card ---------- */
.idc{padding:16px;border-radius:22px;background:linear-gradient(180deg,#1d2440,#0e1222);border:1px solid rgba(255,255,255,.12);box-shadow:0 30px 60px rgba(0,0,0,.7)}
.idc-head{display:flex;align-items:center;justify-content:space-between;font:900 13px var(--display);letter-spacing:.2em;color:var(--cyan)}
.idc .win-close{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.2)}
.card-id{position:relative;display:flex;gap:14px;align-items:center;margin:14px 0 18px;padding:16px;border-radius:16px;overflow:hidden;background:linear-gradient(135deg,#f4ede0,#d9cfbf);color:#2a2420;box-shadow:0 12px 26px rgba(0,0,0,.6)}
.cid-photo{width:76px;height:92px;flex:none;border-radius:8px;display:grid;place-items:center;font:900 30px var(--display);color:#fff;background:linear-gradient(135deg,#7a5cff,#ff4fb0);background-size:cover;background-position:center}
.cid-txt{display:flex;flex-direction:column;min-width:0}.cid-txt small{font:800 9px var(--display);letter-spacing:.2em;color:#8a7a6a}.cid-txt b{font:800 17px var(--display);margin-bottom:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cid-holo{position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 30%,rgba(255,79,176,.25) 42%,rgba(79,230,255,.25) 50%,transparent 62%);background-size:250% 100%;animation:shine 5s ease-in-out infinite;mix-blend-mode:multiply}
.fld{display:flex;flex-direction:column;gap:6px;margin-bottom:12px;font-size:12.5px;color:var(--mute);font-weight:600}
.fld input{min-height:50px;padding:0 14px;border-radius:12px;border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.35);color:#fff;font:600 16px var(--body);outline:0}
.fld input:focus{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(79,230,255,.2)}
.switches{display:flex;flex-direction:column;gap:6px;margin-top:18px}
.sw{display:flex;align-items:center;justify-content:space-between;min-height:52px;padding:0 14px;border-radius:12px;background:rgba(255,255,255,.05);font-weight:650}
.sw input{width:52px;height:30px;accent-color:var(--cyan)}
.stats3{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:16px}
.stats3 span{display:flex;flex-direction:column;align-items:center;gap:4px;padding:12px 4px;border-radius:12px;background:rgba(255,255,255,.05);font-size:11.5px;color:var(--mute)}.stats3 b{font:800 20px var(--display);color:#fff}
.links{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}

.mb-media.on-tv{position:absolute;inset:0;width:100%;height:100%;opacity:1}
@media (min-width:700px){.win{padding-top:40px}}
@media (prefers-reduced-motion:reduce){.win *{animation:none!important}}
.media-park{position:fixed;left:0;top:0;width:1px;height:1px;overflow:hidden;opacity:0;pointer-events:none}
.vb.earned .vb-ic{animation:vbglow 2.4s ease-in-out infinite}@keyframes vbglow{50%{box-shadow:0 0 0 3px var(--c),0 0 28px var(--c)}}
