:root{color-scheme:dark;--bg:#04100a;--panel:rgba(6,24,16,.78);--panel-border:rgba(57,255,142,.22);--text:#cdf7e0;--muted:#5f9e7e;--x:#ffb020;--o:#3ad6ff;--p3:#39ff8e;--active:#39ff8e;--borg:#39ff8e;--borg-dim:#0e3a26;--mono:"SFMono-Regular",ui-monospace,"JetBrains Mono",Menlo,Consolas,monospace;--sans:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;color:var(--text);font-family:var(--sans);background:radial-gradient(ellipse at 50% 40%,#0a2418,#04100a 55%,#020805)}#stage{position:fixed;top:0;right:0;bottom:0;left:0}canvas{display:block;touch-action:none}#hud{position:fixed;top:14px;left:14px;width:288px;max-width:calc(100vw - 28px);background:var(--panel);border:1px solid var(--panel-border);border-radius:14px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);padding:14px 15px;z-index:10;-webkit-user-select:none;user-select:none;box-shadow:0 10px 40px #00000073}#hud h1{margin:0 0 16px;font-size:14px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--text)}#hud .sub{font-family:var(--mono);font-size:10.5px;color:var(--muted);letter-spacing:.06em;margin-bottom:12px}.turn{display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:10px;background:#ffffff0a;border:1px solid var(--panel-border);margin-bottom:9px}.dot{width:14px;height:14px;border-radius:50%;flex:0 0 auto;box-shadow:0 0 12px currentColor}.turn .who{font-weight:700;font-size:14px}.turn .who small{display:block;font-weight:400;font-size:10.5px;color:var(--muted);font-family:var(--mono);letter-spacing:.04em;margin-top:1px}.status{font-family:var(--mono);font-size:11px;line-height:1.5;color:var(--muted);min-height:30px;margin-bottom:11px;border-left:2px solid var(--panel-border);padding-left:9px}.status b{color:var(--text);font-weight:600}.row{display:flex;gap:7px;margin-bottom:8px}button.btn,select{font-family:var(--sans);font-size:12px;color:var(--text);background:#ffffff0d;border:1px solid var(--panel-border);border-radius:9px;padding:8px 10px;cursor:pointer;flex:1;transition:background .15s,border-color .15s}button.btn:hover,select:hover{background:#ffffff1a}button.btn:active{transform:translateY(1px)}select{-moz-appearance:none;appearance:none;-webkit-appearance:none}select option{background:#07200f;color:var(--text)}.ctl{margin-bottom:9px}.ctl label{display:flex;justify-content:space-between;font-family:var(--mono);font-size:10.5px;color:var(--muted);letter-spacing:.04em;margin-bottom:5px}.ctl label span{color:var(--text)}input[type=range]{width:100%;accent-color:var(--active);height:18px}.toggles{display:flex;flex-wrap:wrap;gap:6px}.toggle{display:flex;align-items:center;gap:6px;font-family:var(--mono);font-size:10.5px;color:var(--muted);background:#ffffff0a;border:1px solid var(--panel-border);border-radius:8px;padding:6px 8px;cursor:pointer;flex:1;min-width:0;justify-content:center}.toggle input{accent-color:var(--active);margin:0}.toggle.on{color:var(--text);border-color:#b8ff3a66}.roomCode{font-family:var(--mono);font-size:13px;letter-spacing:.3em;color:var(--text);background:#ffffff0a;border:1px dashed var(--panel-border);border-radius:9px;padding:7px 10px;text-align:center;margin-bottom:8px}.roomCode small{display:block;letter-spacing:.06em;font-size:9.5px;color:var(--muted);margin-top:2px}.chips{display:flex;gap:6px;margin-bottom:9px}.chip{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;font-family:var(--mono);font-size:10px;color:var(--muted);background:#ffffff0a;border:1px solid var(--panel-border);border-radius:9px;padding:6px 4px;min-width:0}.chip .mk{font-size:13px;font-weight:700}.chip.active{border-color:currentColor;box-shadow:0 0 10px currentColor}.chip.off{opacity:.45}input.code{font-family:var(--mono);font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--text);background:#ffffff0d;border:1px solid var(--panel-border);border-radius:9px;padding:8px 10px;flex:1;min-width:0}input.code::placeholder{color:var(--muted);letter-spacing:.06em}#help{font-family:var(--mono);font-size:10.5px;line-height:1.6;color:var(--muted);margin-top:11px;padding-top:11px;border-top:1px solid var(--panel-border);display:none}#help.show{display:block}#help b{color:var(--text)}.helpToggle{cursor:pointer;color:var(--active);font-family:var(--mono);font-size:10.5px;margin-top:9px;display:inline-block}#toast{position:fixed;left:50%;top:18px;transform:translate(-50%) translateY(-12px);background:var(--panel);border:1px solid var(--panel-border);border-radius:10px;padding:10px 16px;font-family:var(--mono);font-size:12px;color:var(--text);z-index:20;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);max-width:90vw;text-align:center}#toast.show{opacity:1;transform:translate(-50%) translateY(0)}#banner{position:fixed;top:0;right:0;bottom:0;left:0;display:none;align-items:center;justify-content:center;z-index:30;background:#06070e8c;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}#banner.show{display:flex}#banner .card{background:var(--panel);border:1px solid var(--panel-border);border-radius:16px;padding:28px 34px;text-align:center;box-shadow:0 20px 60px #0009}#banner .card .big{font-size:30px;font-weight:800;letter-spacing:.04em;margin-bottom:6px}#banner .card .sub2{font-family:var(--mono);font-size:12px;color:var(--muted);margin-bottom:18px}#banner .card button{font-size:13px;padding:10px 22px}#scanlines,#vignette,#flash{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none}#scanlines{z-index:6;mix-blend-mode:screen;opacity:.4;background:repeating-linear-gradient(to bottom,rgba(57,255,142,.05) 0px,rgba(57,255,142,.05) 1px,transparent 1px,transparent 3px);animation:scandrift 9s linear infinite}@keyframes scandrift{0%{background-position:0 0}to{background-position:0 120px}}#vignette{z-index:4;background:radial-gradient(ellipse at center,transparent 50%,rgba(2,8,5,.6) 100%)}#flash{z-index:30;opacity:0;background:radial-gradient(ellipse at center,#39ff8e8c,#39ff8e00 62%)}@media (prefers-reduced-motion: reduce){#scanlines{animation:none}}#hud{box-shadow:0 0 0 1px #39ff8e0f,0 0 40px #39ff8e0f,0 10px 40px #00000080}#hud:before,#hud:after{content:"";position:absolute;width:13px;height:13px;border:2px solid var(--borg);opacity:.65;pointer-events:none}#hud:before{top:-1px;left:-1px;border-right:none;border-bottom:none}#hud:after{bottom:-1px;right:-1px;border-left:none;border-top:none}#hud h1{color:var(--borg);text-shadow:0 0 9px rgba(57,255,142,.5)}h1.glitch{animation:glitch .45s steps(2,end)}@keyframes glitch{0%{text-shadow:0 0 9px rgba(57,255,142,.5)}25%{text-shadow:-2px 0 #3ad6ff,2px 0 #ff3a6b,0 0 9px rgba(57,255,142,.5);transform:translate(1px)}55%{text-shadow:2px 0 #3ad6ff,-2px 0 #ff3a6b;transform:translate(-1px)}to{text-shadow:0 0 9px rgba(57,255,142,.5);transform:none}}.turn{box-shadow:inset 0 0 12px #39ff8e0d}.status{border-left-color:var(--borg)}#hud.thinking{animation:think 1.5s ease-in-out infinite}@keyframes think{0%,to{box-shadow:0 0 0 1px #39ff8e0f,0 0 40px #39ff8e0f,0 10px 40px #00000080}50%{box-shadow:0 0 0 1px #39ff8e59,0 0 70px #39ff8e38,0 10px 40px #00000080}}@media (prefers-reduced-motion: reduce){#hud.thinking{animation:none}}button.btn,select{transition:background .15s,border-color .15s,box-shadow .15s,letter-spacing .15s}button.btn:hover,select:hover{border-color:var(--borg);box-shadow:0 0 14px #39ff8e40;letter-spacing:.02em}input[type=range]{accent-color:var(--borg)}.toggle.on{border-color:#39ff8e73;box-shadow:0 0 10px #39ff8e1f}#banner .card{border-color:#39ff8e4d;box-shadow:0 0 60px #39ff8e26,0 20px 60px #0009}.assimilated{color:var(--borg);letter-spacing:.2em;font-family:var(--mono);font-size:10.5px;text-transform:uppercase;margin-top:4px;opacity:0}#boot{position:fixed;top:0;right:0;bottom:0;left:0;z-index:40;background:#04100a;pointer-events:none;overflow:hidden}#boot:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;mix-blend-mode:screen;opacity:.5;background:repeating-linear-gradient(to bottom,rgba(57,255,142,.07) 0,rgba(57,255,142,.07) 1px,transparent 1px,transparent 3px);animation:scandrift 6s linear infinite}.boot-term{position:absolute;top:24px;left:26px;right:26px;font-family:var(--mono);color:var(--borg);font-size:13px;line-height:1.75;letter-spacing:.08em;text-transform:uppercase;text-shadow:0 0 10px rgba(57,255,142,.5)}.boot-term .bl{opacity:0;white-space:pre;overflow:hidden}.boot-term .bl.head{color:#eafff3;letter-spacing:.16em;margin-bottom:8px;text-shadow:0 0 12px rgba(57,255,142,.7)}.boot-term .ok{color:#eafff3}.boot-term.glitch{animation:bootglitch .42s steps(2,end)}@keyframes bootglitch{0%{transform:translate(0);text-shadow:0 0 10px rgba(57,255,142,.5)}20%{transform:translate(-2px,1px);text-shadow:2px 0 #3ad6ff,-2px 0 #ff3a6b,0 0 10px rgba(57,255,142,.5);opacity:.85}45%{transform:translate(2px,-1px);text-shadow:-2px 0 #3ad6ff,2px 0 #ff3a6b}70%{transform:translate(-1px);text-shadow:1px 0 #ff3a6b,-1px 0 #3ad6ff}to{transform:translate(0);text-shadow:0 0 10px rgba(57,255,142,.5)}}.boot-cursor{color:var(--borg);animation:bootblink .9s steps(1) infinite}@keyframes bootblink{0%,50%{opacity:1}50.01%,to{opacity:0}}@media (prefers-reduced-motion: reduce){#boot:before,.boot-term.glitch,.boot-cursor{animation:none}}@media (max-width:560px){#hud{top:auto;bottom:calc(8px + env(safe-area-inset-bottom,0px));left:calc(8px + env(safe-area-inset-left,0px));right:calc(8px + env(safe-area-inset-right,0px));width:auto;padding:10px 12px;max-height:45vh;max-height:45dvh;overflow-y:auto;overscroll-behavior:contain}#hud h1{font-size:12px;margin-bottom:8px}#hud .sub{margin-bottom:9px}.turn{padding:7px 9px;margin-bottom:7px}.status{min-height:0;margin-bottom:8px}.row{margin-bottom:6px}#hud:before,#hud:after{display:none}#toast{top:calc(10px + env(safe-area-inset-top,0px));font-size:11px;padding:8px 12px}#banner .card{padding:20px 22px;margin:0 14px}#banner .card .big{font-size:24px}.boot-term{font-size:10px;letter-spacing:.02em;top:16px;left:14px;right:14px}.boot-term .bl.head{letter-spacing:.08em}}@media (min-width:561px) and (max-height:520px){#hud{top:8px;left:calc(8px + env(safe-area-inset-left,0px));width:250px;padding:10px 12px;max-height:calc(100vh - 16px);max-height:calc(100dvh - 16px);overflow-y:auto;overscroll-behavior:contain}#hud h1{font-size:12px;margin-bottom:8px}#hud:before,#hud:after{display:none}.status{min-height:0;margin-bottom:8px}.row{margin-bottom:6px}}@media (pointer:coarse){button.btn,select{padding:11px 12px}input.code{padding:11px 10px}.toggle{padding:9px 8px}.helpToggle{padding:8px 0}}