:root{--mint:#70ffe1;--acid:#caff62;--violet:#a26fff;--pink:#ff4f9a;--gold:#ffd66c;--ink:#05040d;--panel:rgba(5,8,19,.84);--line:rgba(112,255,225,.28)}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--ink) url("assets/textures/alien-hull-v1.webp") center/520px;color:#f5fffc;font-family:Inter,"Segoe UI",system-ui,sans-serif;touch-action:none}button,a{font:inherit}.shell{position:relative;width:100%;height:100dvh;min-height:580px;overflow:hidden}#renderCanvas{display:block;width:100%;height:100%;outline:0;touch-action:none}.scanlines{position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,transparent 0 4px,rgba(112,255,225,.018) 5px);box-shadow:inset 0 0 150px #000b}
.topbar{position:absolute;z-index:8;top:0;left:0;right:0;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:15px 20px;background:linear-gradient(#03050de8,transparent);pointer-events:none}.topbar a{justify-self:start;padding:9px 13px;border:1px solid var(--line);border-radius:99px;color:var(--mint);background:#070d19aa;text-decoration:none;font-size:.62rem;font-weight:900;letter-spacing:.12em;pointer-events:auto}.topbar>div{text-align:center}.topbar small{display:block;color:#779995;font-size:.48rem;letter-spacing:.26em}.topbar strong{font-size:.8rem;letter-spacing:.24em}.topbar p{justify-self:end;margin:0;color:#8aa5a0;font-size:.52rem;letter-spacing:.12em}.topbar b{display:block;color:var(--gold);font-size:.9rem;text-align:right}
.lobby-panel{position:absolute;z-index:7;left:50%;bottom:4.5%;width:min(650px,92vw);transform:translateX(-50%);padding:18px 24px 16px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(125deg,rgba(6,13,24,.9),rgba(16,7,29,.86));box-shadow:0 22px 70px #000a,inset 0 1px #ffffff12;backdrop-filter:blur(12px);text-align:center}.eyebrow{margin:0;color:var(--mint);font-size:.5rem;font-weight:900;letter-spacing:.25em}.lobby-panel h1{margin:5px 0 3px;font-size:clamp(1.9rem,5vw,3.6rem);line-height:1;color:transparent;background:linear-gradient(90deg,var(--mint),var(--acid),var(--gold));-webkit-background-clip:text;background-clip:text}.lobby-panel>p:nth-of-type(2){max-width:580px;margin:7px auto 12px;color:#a7bbb9;font-size:.73rem;line-height:1.45}.machine-picker{display:flex;align-items:center;justify-content:center;gap:15px}.machine-picker button{width:38px;height:38px;border:1px solid var(--line);border-radius:50%;background:#071321;color:var(--mint);font-size:1.5rem;cursor:pointer}.machine-picker div{min-width:145px}.machine-picker span,.machine-picker b{display:block}.machine-picker span{color:#789893;font-size:.48rem;letter-spacing:.14em}.machine-picker b{margin-top:3px;color:var(--gold);font-size:.64rem;letter-spacing:.16em}.primary,.start-screen button{margin-top:12px;padding:12px 21px;border:0;border-radius:99px;color:#06120e;background:linear-gradient(100deg,var(--mint),var(--acid),var(--gold));box-shadow:0 0 30px #70ffe133;font-size:.66rem;font-weight:1000;letter-spacing:.12em;cursor:pointer}.lobby-actions{display:flex;justify-content:center;gap:8px;margin-top:12px}.lobby-actions .primary{margin-top:0}.activity{padding:11px 17px;border:1px solid #ff4f9a77;border-radius:99px;color:#ffc5de;background:linear-gradient(120deg,#29112bea,#10152ae8);box-shadow:0 0 25px #ff4f9a20;font-size:.62rem;font-weight:1000;letter-spacing:.1em;cursor:pointer}.lobby-panel>small{display:block;margin-top:8px;color:#68827d;font-size:.48rem;letter-spacing:.06em}
.start-screen{position:absolute;z-index:20;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:25px;background:radial-gradient(circle at 50% 38%,rgba(38,31,80,.92),rgba(3,4,12,.985) 64%);text-align:center;transition:.6s opacity,.6s visibility}.start-screen.hidden{opacity:0;visibility:hidden;pointer-events:none}.start-screen>p:first-child{margin:0 0 10px;color:var(--mint);font-size:.55rem;font-weight:900;letter-spacing:.26em}.start-screen h2{margin:0;font-size:clamp(4rem,11vw,9rem);line-height:.7;letter-spacing:.06em}.start-screen h2 span{font-size:.58em;color:transparent;-webkit-text-stroke:2px var(--acid);text-shadow:0 0 40px #caff6233}.start-screen>p:nth-last-of-type(1){max-width:650px;margin:22px auto 5px;color:#abc2bd;line-height:1.55}.start-screen>small{margin-top:12px;color:#708a85;font-size:.55rem}.orb{position:relative;width:160px;height:88px;margin-top:24px}.orb i{position:absolute;left:50%;top:50%;width:75px;height:75px;border:1px solid var(--mint);border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 25px #70ffe133;animation:orbit 3s linear infinite}.orb i:nth-child(2){width:120px;height:34px;border-color:var(--violet);animation-direction:reverse}.orb i:nth-child(3){width:12px;height:12px;background:var(--acid);box-shadow:0 0 18px var(--acid)}
.hidden{display:none!important}.hud{position:absolute;z-index:8;top:70px;left:50%;transform:translateX(-50%);display:flex;gap:6px;padding:6px;border:1px solid var(--line);border-radius:15px;background:var(--panel);backdrop-filter:blur(8px)}.hud div{min-width:105px;padding:8px 11px;border-radius:10px;background:#70ffe108}.hud small,.hud b{display:block}.hud small{color:#78948f;font-size:.44rem;letter-spacing:.14em}.hud b{margin-top:3px;color:var(--acid);font-size:.78rem;letter-spacing:.08em}.message{position:absolute;z-index:8;left:50%;bottom:18%;transform:translateX(-50%);padding:9px 16px;border:1px solid var(--mint);background:#06121dd9;color:var(--mint);font-size:.58rem;font-weight:900;letter-spacing:.14em}.leave{position:absolute;z-index:9;left:17px;bottom:18px;padding:9px 12px;border:1px solid var(--line);border-radius:99px;background:#06101bd9;color:var(--mint);font-size:.54rem;font-weight:900;letter-spacing:.1em}.mobile-controls{position:absolute;z-index:9;left:50%;bottom:14px;transform:translateX(-50%);display:flex;gap:7px}.mobile-controls button{min-width:108px;padding:13px;border:1px solid var(--line);border-radius:15px;background:#071321db;color:var(--mint);font-size:.6rem;font-weight:900;letter-spacing:.07em}.mobile-controls .launch{color:#101006;background:linear-gradient(100deg,var(--acid),var(--gold))}
.walk-controls{position:absolute;z-index:9;left:20px;bottom:20px;display:grid;grid-template-columns:repeat(3,46px);grid-template-rows:18px 46px 46px;gap:5px;padding:9px;border:1px solid var(--line);border-radius:22px;background:#050b17c9;backdrop-filter:blur(9px)}.walk-controls span{grid-column:1/-1;color:#73918b;text-align:center;font-size:.44rem;font-weight:900;letter-spacing:.2em}.walk-controls button{border:1px solid var(--line);border-radius:13px;background:#102033d9;color:var(--mint);font-weight:900;touch-action:none}.walk-controls button:active{color:#07120e;background:var(--acid)}#walkForward{grid-column:2}#turnLeft{grid-column:1;grid-row:3}#walkBack{grid-column:2;grid-row:3}#turnRight{grid-column:3;grid-row:3}
.hockey-mode{position:absolute;z-index:12;inset:0;pointer-events:none}.hockey-scoreboard{position:absolute;top:12px;left:50%;width:min(920px,calc(100% - 24px));transform:translateX(-50%);display:grid;grid-template-columns:auto minmax(90px,.7fr) minmax(180px,1.3fr) minmax(90px,.7fr) auto;align-items:stretch;gap:7px;padding:7px;border:1px solid #70ffe14d;border-radius:18px;background:linear-gradient(120deg,#06101bea,#130a22e8);box-shadow:0 18px 45px #0009,inset 0 1px #ffffff12;backdrop-filter:blur(10px);pointer-events:auto}.hockey-scoreboard>button,.hockey-scoreboard>div{min-width:0;border:1px solid #70ffe12b;border-radius:11px;background:#081421d9}.hockey-scoreboard>button{padding:9px 12px;color:var(--mint);font-size:.52rem;font-weight:950;letter-spacing:.08em;cursor:pointer}.hockey-team,.hockey-match{display:grid;place-items:center;padding:5px 10px;text-align:center}.hockey-scoreboard small{color:#83a09a;font-size:.4rem;font-weight:900;letter-spacing:.13em}.hockey-team b{font:950 1.65rem ui-monospace,monospace;line-height:1}.hockey-team.player b{color:var(--pink);text-shadow:0 0 18px #ff4f9a88}.hockey-team.cpu b{color:var(--mint);text-shadow:0 0 18px #70ffe188}.hockey-match strong{display:block;margin-top:3px;color:var(--gold);font-size:.69rem;letter-spacing:.13em}.hockey-prompt{position:absolute;left:50%;bottom:12%;transform:translateX(-50%);max-width:86%;padding:9px 16px;border:1px solid #ff4f9a66;border-radius:99px;background:#080d19e8;color:#ffd8e9;box-shadow:0 0 28px #ff4f9a2b;font-size:.56rem;font-weight:950;letter-spacing:.12em;text-align:center}.hockey-help{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);width:min(720px,calc(100% - 24px));padding:8px 12px;border:1px solid #70ffe12b;border-radius:99px;background:#050b14cf;color:#8ba6a1;font-size:.44rem;font-weight:900;letter-spacing:.11em;text-align:center}.hockey-open>.topbar{visibility:hidden}
.result-screen{position:absolute;z-index:18;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;background:radial-gradient(circle at 50% 42%,rgba(46,25,83,.92),rgba(2,4,12,.98) 66%);text-align:center}.result-screen>p:first-child{margin:0;color:var(--mint);font-size:.58rem;font-weight:900;letter-spacing:.28em}.result-screen h2{margin:8px 0 20px;font-size:clamp(2.8rem,8vw,7rem)}.result-screen>div{min-width:250px;padding:18px;border:1px solid var(--line);border-radius:18px;background:#07101ccc}.result-screen small,.result-screen b{display:block}.result-screen small{color:#79958f;font-size:.52rem;letter-spacing:.18em}.result-screen b{margin-top:5px;color:var(--gold);font-size:2.2rem}.result-screen>p:nth-of-type(2){color:#a8bdb8}.result-screen button{min-width:230px;margin-top:8px;padding:12px 18px;border:0;border-radius:99px;background:linear-gradient(100deg,var(--mint),var(--acid),var(--gold));color:#07120e;font-size:.62rem;font-weight:1000;letter-spacing:.1em;cursor:pointer}.result-screen .secondary{border:1px solid var(--line);background:#07101c;color:var(--mint)}
.table-mode{position:absolute;z-index:14;inset:0;display:flex;justify-content:center;background:radial-gradient(circle at 50% 28%,#183d3c 0,#09081d 45%,#02030a 100%);padding:8px;touch-action:none}.table-cabinet{position:relative;width:min(780px,100%);height:100%;min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto;padding:10px;border:1px solid #70ffe150;border-radius:28px;background:linear-gradient(rgba(4,11,20,.92),rgba(5,5,16,.97)),url("assets/textures/alien-hull-v1.webp") center/520px;box-shadow:0 0 70px #70ffe124,inset 0 0 0 4px #080e1c}.table-scoreboard{display:grid;grid-template-columns:auto repeat(3,minmax(76px,1fr)) minmax(140px,1.7fr);gap:6px;align-items:stretch;padding:4px 4px 9px}.table-scoreboard>div,.table-scoreboard>button{min-width:0;padding:8px 10px;border:1px solid #70ffe12d;border-radius:10px;background:linear-gradient(rgba(7,17,29,.85),rgba(5,9,21,.94)),url("assets/textures/alien-circuit-v1.webp") center/300px}.table-scoreboard button{color:var(--mint);font-size:.53rem;font-weight:900;letter-spacing:.1em;cursor:pointer}.table-scoreboard small,.table-scoreboard b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.table-scoreboard small{color:#789894;font-size:.39rem;letter-spacing:.14em}.table-scoreboard b{margin-top:3px;color:var(--acid);font:900 .72rem ui-monospace,monospace;letter-spacing:.05em}.pinball-window{position:relative;min-height:0;display:grid;place-items:center;overflow:hidden;border:1px solid #70ffe149;border-radius:22px;background:#02050b;box-shadow:inset 0 0 55px #000,0 18px 50px #0008}.pinball-window canvas{display:block;width:auto;height:100%;max-width:100%;max-height:100%;aspect-ratio:19/28;touch-action:none}.glass-reflection{position:absolute;inset:0;pointer-events:none;background:linear-gradient(112deg,rgba(255,255,255,.07),transparent 18% 73%,rgba(112,255,225,.045));mix-blend-mode:screen}.table-message{position:absolute;z-index:4;left:50%;top:15%;transform:translate(-50%,-10px);max-width:80%;padding:9px 16px;border:1px solid var(--mint);border-radius:999px;background:#030b16e8;color:var(--mint);font-size:.6rem;font-weight:1000;letter-spacing:.14em;text-align:center;box-shadow:0 0 28px #70ffe13c;transition:.2s}.table-controls{display:grid;grid-template-columns:1fr minmax(145px,.75fr) 1fr;gap:8px;padding:9px 4px 2px}.table-controls button{min-height:48px;border:1px solid #70ffe14f;border-radius:15px;background:linear-gradient(#10223a,#071321);color:var(--mint);font-size:.61rem;font-weight:1000;letter-spacing:.07em;cursor:pointer;touch-action:none;box-shadow:inset 0 1px #ffffff12}.table-controls button:active,.table-controls button.active{transform:translateY(2px);color:#04100c;background:linear-gradient(100deg,var(--mint),var(--acid));box-shadow:0 0 26px #70ffe158}.table-controls .table-launch{color:#171005;background:linear-gradient(100deg,var(--acid),var(--gold));border-color:#ffd66c66}.table-open>#renderCanvas,.table-open>.scanlines,.table-open>.topbar{visibility:hidden}.table-open .result-screen{z-index:30}
@keyframes orbit{to{transform:translate(-50%,-50%) rotate(360deg)}}
@media(min-width:901px){.lobby-panel{left:auto;right:3%;bottom:4%;width:min(520px,42vw);transform:none;padding:16px 21px 14px}.lobby-panel h1{font-size:clamp(1.8rem,3.6vw,3rem)}.lobby-panel>p:nth-of-type(2){font-size:.69rem}.walk-controls{bottom:24px}}
@media(max-width:720px){.topbar{padding:11px}.topbar>div{display:none}.topbar a{font-size:.5rem}.lobby-panel{bottom:2%;padding:14px 16px}.lobby-panel>small{display:none}.lobby-actions{gap:5px}.lobby-actions .primary,.lobby-actions .activity{min-width:0;flex:1;padding:10px 7px;font-size:.52rem}.walk-controls{left:9px;bottom:234px;transform:scale(.84);transform-origin:left bottom}.hockey-scoreboard{top:6px;width:calc(100% - 10px);grid-template-columns:42px 1fr 1.25fr 1fr 42px;gap:3px;padding:4px;border-radius:12px}.hockey-scoreboard>button{padding:6px 3px;font-size:0}.hockey-scoreboard>button:first-child:before{content:'←';font-size:1rem}.hockey-scoreboard>button:last-child:before{content:'↻';font-size:1rem}.hockey-team,.hockey-match{padding:4px 2px}.hockey-scoreboard small{font-size:.28rem;letter-spacing:.05em}.hockey-team b{font-size:1.25rem}.hockey-match strong{font-size:.5rem;letter-spacing:.06em}.hockey-prompt{bottom:13%;padding:7px 10px;font-size:.45rem;white-space:nowrap}.hockey-help{bottom:7px;width:calc(100% - 10px);padding:6px;font-size:.34rem;letter-spacing:.04em}.hud{top:54px;width:calc(100% - 16px);gap:3px}.hud div{min-width:0;flex:1;padding:6px}.hud small{font-size:.36rem}.hud b{font-size:.57rem}.hud div:last-child{flex:1.7}.mobile-controls{bottom:10px;width:calc(100% - 18px)}.mobile-controls button{min-width:0;flex:1;padding:12px 5px}.leave{top:56px;bottom:auto;font-size:0}.leave:before{content:'←';font-size:1rem}.message{bottom:76px;white-space:nowrap}.start-screen>small{font-size:.46rem}.table-mode{padding:0}.table-cabinet{border:0;border-radius:0;padding:4px;grid-template-rows:auto minmax(0,1fr) auto}.table-scoreboard{grid-template-columns:auto repeat(3,1fr);gap:3px;padding:2px 1px 4px}.table-scoreboard>div,.table-scoreboard>button{padding:6px 5px}.table-scoreboard button{font-size:0;width:40px}.table-scoreboard button:before{content:'←';font-size:1rem}.table-scoreboard .table-mission{grid-column:1/-1;text-align:center;padding:4px}.table-scoreboard small{font-size:.32rem}.table-scoreboard b{font-size:.58rem}.pinball-window{border-radius:10px}.table-controls{gap:5px;padding:5px 1px 1px;grid-template-columns:1fr .82fr 1fr}.table-controls button{min-height:54px;padding:5px;font-size:.53rem}.table-controls .table-launch{font-size:.48rem}.table-message{top:12%;font-size:.5rem}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}