:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#f6f0ff;background:#0d0718;font-synthesis:none;--purple:#b77aff;--lime:#c5f879;--panel:rgba(21,12,40,.82)}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:wait;opacity:.65}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid var(--lime);outline-offset:4px}button,summary{touch-action:manipulation}a{color:inherit}button svg{width:22px;height:22px;fill:currentColor}#game{width:100%;height:100dvh;min-height:300px;position:relative;overflow:hidden}#viewport{position:absolute;inset:0;touch-action:none}#viewport canvas{width:100%;height:100%;display:block;outline:none}.hud-top{position:absolute;inset:max(18px,env(safe-area-inset-top)) max(22px,env(safe-area-inset-right)) auto max(22px,env(safe-area-inset-left));display:flex;align-items:center;gap:24px;pointer-events:none}.brand{display:flex;gap:12px;align-items:center;text-decoration:none;font-size:12px;font-weight:750;letter-spacing:.1em;pointer-events:auto}.brand svg{width:37px;height:37px;fill:var(--purple);filter:drop-shadow(0 0 12px #8a37d377)}.brand b{display:block;font-size:20px;font-weight:800;letter-spacing:.04em}.hud-stats{display:flex;margin-left:auto;background:var(--panel);border:1px solid #baa1e12b;border-radius:15px;backdrop-filter:blur(16px);padding:11px 20px;gap:26px}.stat{min-width:63px}.stat>span{display:block;font-size:9px;letter-spacing:.15em;color:#b3a2ce;margin-bottom:4px}.stat strong{font-size:21px;font-variant-numeric:tabular-nums;line-height:1.1;font-weight:700}.stat small{font-size:12px;color:#a990c9}.icon-button{display:grid;place-items:center;background:var(--panel);border:1px solid #baa1e13d;border-radius:13px;width:48px;height:48px;pointer-events:auto}.icon-button:hover{background:#42255f}.progress-track{position:absolute;top:98px;left:24px;right:24px;height:3px;background:#ead2ff20;overflow:hidden;border-radius:4px}.progress-track span{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--purple),var(--lime));transition:width .5s;box-shadow:0 0 10px var(--purple)}.zone{position:absolute;top:119px;left:26px;display:flex;align-items:center;gap:9px;color:#d4c1ed;font-size:10px;letter-spacing:.17em;pointer-events:none}.zone-dot{height:5px;width:5px;border-radius:50%;background:var(--lime);box-shadow:0 0 10px #c5f879}.desktop-help{position:absolute;bottom:max(21px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);font-size:11px;white-space:nowrap;color:#cfbde2;background:var(--panel);border:1px solid #baa1e126;padding:12px 17px;border-radius:12px;pointer-events:none}.desktop-help kbd{font-family:inherit;font-weight:700;font-size:10px;color:white}.desktop-help i{font-style:normal;margin:0 10px;color:#86649f}#toast{position:absolute;left:50%;top:21%;transform:translate(-50%,-8px);padding:13px 21px;background:#19102de8;border:1px solid #ba83ff77;border-radius:12px;color:#e4ffd0;opacity:0;transition:opacity .2s,transform .2s;pointer-events:none;text-align:center;min-width:240px;font-size:13px;box-shadow:0 8px 32px #0004}#toast.visible{opacity:1;transform:translate(-50%,0)}.overlay{position:absolute;inset:0;display:flex;align-items:center;gap:40px;padding:clamp(80px,10vh,120px) clamp(24px,6vw,110px) 32px;background:linear-gradient(90deg,rgba(12,6,24,.96) 0%,rgba(12,6,24,.85) 40%,rgba(12,6,24,.08) 100%);overflow-y:auto}.menu-card{width:520px;max-width:100%;flex-shrink:0}.eyebrow{font-size:10px;letter-spacing:.19em;color:#c9a7ed;display:flex;align-items:center;gap:9px}.eyebrow span{width:6px;height:6px;background:var(--lime);border-radius:50%}h1{font-size:clamp(37px,4.3vw,64px);line-height:1.06;letter-spacing:-.055em;font-weight:750;margin:22px 0}h1 em{font-style:normal;color:var(--purple)}.menu-card>p{font-size:15px;line-height:1.7;color:#baaacd;max-width:405px}.feature-row{display:flex;gap:27px;padding:20px 0 28px}.feature-row span{color:#aa96c2;font-size:11px}.feature-row b{color:#f5eaff;font-size:18px;margin-right:4px}.primary-button{width:100%;max-width:405px;border:1px solid #d4a8ff;display:flex;justify-content:space-between;align-items:center;background:linear-gradient(105deg,#9c5be2,#7440c0);box-shadow:0 10px 40px #8e45d929;border-radius:12px;padding:17px 20px;font-size:14px;font-weight:700}.primary-button:hover{filter:brightness(1.13)}.primary-button span{font-size:22px;line-height:1}.secondary-button{margin-top:12px;width:100%;max-width:405px;background:#2b1844;border:1px solid #71499e;border-radius:12px;padding:13px 18px;font-size:12px}.secondary-button:hover{background:#402161}details{font-size:12px;max-width:405px;margin:18px 0 23px;color:#aa96c2}summary{cursor:pointer;padding:8px 0;color:#d3bfe6}details p{line-height:1.65;margin:7px 0}.menu-bottom{display:flex;gap:15px;flex-wrap:wrap;font-size:10px;color:#8f7da3}.menu-bottom a{text-decoration:none;color:#c9a4f1}.menu-bottom a:hover{text-decoration:underline}.orbit-caption{margin:auto 0 5vh auto;text-align:right;display:flex;flex-direction:column;gap:17px;color:#c8b8dc;pointer-events:none}.orbit-caption span{font-size:9px;letter-spacing:.17em}.orbit-caption b{font-size:clamp(21px,2.5vw,35px);font-weight:500;letter-spacing:-.04em;line-height:1.15}#result{margin:20px 0;color:var(--lime);font-size:14px;line-height:1.7}.touch-controls{display:none;position:absolute;inset:auto max(18px,env(safe-area-inset-right)) max(20px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));align-items:flex-end;justify-content:space-between;pointer-events:none;touch-action:none;user-select:none}.touch-controls button{pointer-events:auto;touch-action:none;user-select:none;border:1px solid #c298ed55;background:#1d103ce0;color:#e9d8fa;backdrop-filter:blur(8px)}.move-pad{display:grid;grid-template:repeat(2,48px)/repeat(3,48px);gap:5px;pointer-events:auto}.move-pad button{border-radius:13px;font-size:24px;line-height:1}.move-pad [data-move=up]{grid-area:1/2}.move-pad [data-move=left]{grid-area:2/1}.move-pad [data-move=down]{grid-area:2/2}.move-pad [data-move=right]{grid-area:2/3}.touch-controls button.active{background:#8d46d6;border-color:#d7b0ff}.look-hint{color:#c4abd8;font-size:9px;text-align:center;line-height:1.6;margin-bottom:15px;padding:0 10px;opacity:.75}#jump{border-radius:50%;width:80px;height:80px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;border-color:#b887eaaa;background:#66369bd9}#jump svg{width:28px;height:28px}#jump span{font-size:8px;font-weight:700;letter-spacing:.08em}.fallback{position:absolute;inset:0;background:#130a24;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px;text-align:center;z-index:10}.fallback h1{font-size:30px;max-width:600px}.fallback p{max-width:480px;line-height:1.7;color:#c7b2d8}.fallback a{margin-top:20px;color:#c29bef}[hidden]{display:none!important}body.playing .overlay{display:none}body:not(.playing) .touch-controls,body:not(.playing) .desktop-help{display:none}body:not(.playing) .hud-top{z-index:2}body:not(.playing) .zone,body:not(.playing) .progress-track{opacity:.45}@media(pointer:coarse){body.playing .touch-controls{display:flex}.desktop-help{display:none}}@media(max-width:700px){.hud-top{inset:max(14px,env(safe-area-inset-top)) 14px auto;gap:9px}.brand{gap:7px;font-size:8px}.brand svg{height:27px;width:27px}.brand b{font-size:15px}.hud-stats{gap:12px;padding:9px 11px;border-radius:11px}.stat{min-width:49px}.stat strong{font-size:17px}.stat small{font-size:10px}.stat>span{font-size:8px}.deaths{display:none}.icon-button{width:39px;height:43px;border-radius:10px}.progress-track{top:81px;left:14px;right:14px}.zone{top:99px;left:16px;font-size:9px}.overlay{padding:100px 24px 28px;align-items:center;background:linear-gradient(90deg,#0e071be8,#0e071b94)}.menu-card{width:100%}h1{font-size:clamp(36px,9vw,53px);margin:19px 0}.menu-card>p{font-size:13px}.feature-row{padding:15px 0 21px;gap:19px}.primary-button{max-width:none;padding:15px 18px}.secondary-button{max-width:none}.orbit-caption{display:none}details{margin:13px 0 17px}.eyebrow{font-size:9px}.menu-bottom{font-size:9px}#toast{top:25%;font-size:12px;padding:12px 15px;min-width:200px}.desktop-help{bottom:15px;font-size:9px;padding:10px}.desktop-help i{margin:0 5px}}@media(max-height:570px){.overlay{padding-top:95px;align-items:flex-start}.menu-card{width:460px}.menu-card h1{font-size:34px;margin:13px 0}.menu-card>p{font-size:12px}.feature-row{padding:10px 0 16px}.menu-bottom{padding-bottom:15px}.touch-controls{bottom:12px}.move-pad{grid-template:repeat(2,42px)/repeat(3,42px)}#jump{width:68px;height:68px}}@media(prefers-reduced-motion:reduce){.progress-track span,#toast{transition:none}}

@media(max-width:360px){.look-hint{display:none}}
/* Touch controls 1.1: an analogue stick, with no gameplay text selection or callouts. */
#viewport,.hud-top,.progress-track,.zone,.desktop-help,.touch-controls,#toast{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
#game button,#game summary,#game .brand{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
#game input,#game textarea,#game select,#game [contenteditable=true]{-webkit-user-select:text;user-select:text;-webkit-touch-callout:default;touch-action:auto}
.move-joystick{position:relative;pointer-events:auto;touch-action:none;width:170px;height:170px;flex:0 0 170px;border-radius:50%;border:2px solid #c298ed77;background:radial-gradient(circle,#39204d88 0 32%,#1d103cba 33% 59%,#bc83ff14 60% 62%,#1d103cba 63%);box-shadow:inset 0 0 25px #b269fb22,0 8px 25px #0003;backdrop-filter:blur(8px)}
.joystick-guide{position:absolute;inset:0;display:grid;place-items:center;font-size:136px;font-weight:200;color:#cfadf527;line-height:1;pointer-events:none}
.move-knob{position:absolute;width:62px;height:62px;left:calc(50% - 31px);top:calc(50% - 31px);border-radius:50%;border:2px solid #dec5ffbb;background:radial-gradient(circle at 35% 30%,#ba91e9dd,#8554bddb);box-shadow:0 4px 15px #0004;pointer-events:none;will-change:transform}
.move-joystick.active{border-color:#d9b0ff;box-shadow:inset 0 0 28px #b269fb44,0 0 18px #b269fb33}
#jump{width:90px;height:90px;flex:0 0 90px;touch-action:none}
.look-hint{position:absolute;right:4px;bottom:101px;margin:0;padding:0;max-width:110px;pointer-events:none}
@media(max-width:370px){.touch-controls{left:max(10px,env(safe-area-inset-left));right:max(10px,env(safe-area-inset-right))}.move-joystick{width:156px;height:156px;flex-basis:156px}#jump{width:82px;height:82px;flex-basis:82px}.look-hint{font-size:8px;bottom:94px}}
@media(max-height:570px) and (orientation:landscape){.touch-controls{left:max(18px,env(safe-area-inset-left));right:max(18px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom))}.move-joystick{width:150px;height:150px;flex-basis:150px}.move-knob{width:56px;height:56px;left:calc(50% - 28px);top:calc(50% - 28px)}#jump{width:84px;height:84px;flex-basis:84px}.look-hint{bottom:95px}}

/* Sector identity remains inside the purple galactic interface. */
:root{--sector:#c49aff}.zone{align-items:flex-start}.zone-dot{margin-top:18px;background:var(--sector);box-shadow:0 0 10px var(--sector)}.zone>div{display:flex;flex-direction:column;gap:5px}.zone #sector-count{font-size:8px;letter-spacing:2px;color:var(--sector)}.zone #zone-name{font-size:11px;font-weight:700;color:#f2eaff}.zone #sector-hint{font-size:9px;letter-spacing:0;color:#c7b4da;max-width:330px;text-shadow:0 1px 4px #000}.progress-track span{background:linear-gradient(90deg,var(--purple),var(--sector))}.hud-stats{border-color:color-mix(in srgb,var(--sector) 25%,transparent)}
@media(max-width:700px){.zone #sector-count{font-size:7px}.zone #zone-name{font-size:9px}.zone #sector-hint{font-size:8px;max-width:250px}.zone-dot{margin-top:16px}}
@media(max-height:530px) and (orientation:landscape){.zone{top:91px}.zone #sector-hint{display:none}.zone #zone-name{font-size:9px}.zone #sector-count{font-size:7px}.zone>div{gap:4px}}

.obby-peer{position:fixed;top:126px;right:20px;max-width:min(360px,calc(100vw - 40px));padding:10px 14px;border:1px solid #785393;border-radius:14px;background:#160e27e8;color:#eee3fa;font:600 12px/1.5 system-ui;z-index:8;pointer-events:none}.obby-peer[hidden]{display:none}@media(max-width:700px){.obby-peer{top:140px;right:10px;font-size:10px;max-width:205px;padding:7px 9px}}

.online-obby .atz-online-bar{top:112px;bottom:auto;left:50%;right:auto;transform:translateX(-50%);max-width:min(620px,calc(100vw - 24px));width:max-content}.online-obby .atz-online-bar button{min-height:34px}@media(max-width:700px){.online-obby .atz-online-bar{top:179px;padding:6px 9px;gap:6px;max-width:calc(100vw - 20px)}.online-obby .atz-online-status{font-size:10px}.online-obby .atz-online-people{max-width:80px}}@media(max-height:570px) and (orientation:landscape){.online-obby .atz-online-bar{top:82px;max-width:min(500px,calc(100vw - 24px));padding:5px 9px}.online-obby .atz-online-people{display:none}}

@media(max-width:700px){.online-obby .atz-online-people{display:none}}

/* Online HUD: room controls, race details have separate space. */
.online-obby .obby-peer{overflow-wrap:anywhere}
.online-obby .zone>div{min-width:0}
.online-obby .zone #sector-hint{max-width:100%;overflow-wrap:anywhere}
@media(min-width:701px){.online-obby .zone{top:224px;max-width:min(330px,calc(50vw - 40px))}.online-obby .obby-peer{top:224px;max-width:min(360px,calc(50vw - 40px))}}
@media(max-width:700px){.online-obby .obby-peer{top:279px}}
@media(max-height:570px) and (orientation:landscape){.online-obby .atz-online-bar{top:112px;max-width:calc(100vw - 48px);flex-wrap:nowrap}.online-obby .atz-online-orb{display:none}.online-obby .atz-online-status{min-width:0;font-size:10px}.online-obby .atz-online-bar button,.online-obby .atz-online-lag{flex:0 0 auto}.online-obby .zone{top:170px}.online-obby .obby-peer{top:170px;font-size:10px;padding:7px 9px;max-width:min(360px,calc(50vw - 40px))}}

/* A compact audio control stays outside movement and jump hitboxes. */
.audio-orb{position:absolute;right:max(24px,env(safe-area-inset-right));bottom:max(24px,env(safe-area-inset-bottom));z-index:3;width:46px;height:46px;display:grid;place-items:center;border:1px solid #ac7fe877;border-radius:50%;background:linear-gradient(140deg,#42205be8,#170d2ce8);box-shadow:0 0 22px #a04ee42b;color:#e1c6ff;touch-action:manipulation}.audio-orb svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.audio-orb svg path:first-child{fill:currentColor;stroke:none}.audio-orb:hover{border-color:#d3b0ff;filter:brightness(1.15)}.audio-slash{position:absolute;display:none;width:27px;height:2px;background:#ffbedb;transform:rotate(-45deg);box-shadow:0 0 0 2px #25103b}.audio-orb[data-muted=true] .audio-slash{display:block}.audio-settings{display:flex;justify-content:space-between;align-items:center;gap:14px;max-width:405px;margin:0 0 18px;padding:14px 15px;background:linear-gradient(120deg,#39204d88,#1c112ccc);border:1px solid #b57aee33;border-radius:14px}.audio-settings>div{display:flex;flex-direction:column;gap:5px;min-width:0}.audio-eyebrow{font-size:8px;letter-spacing:.12em;color:#b391d1}.audio-settings strong{font-size:12px;font-weight:650;color:#e7d2fb}.audio-settings #sound-status{font-size:9px;color:#baa8cc}.audio-settings label{font-size:9px;color:#cfb9e2;flex:0 0 100px;display:flex;flex-direction:column;gap:8px}.audio-settings input{width:100%;accent-color:#c084ff;cursor:pointer;min-height:24px}.obby-peer{display:flex;flex-direction:column;gap:3px}.obby-peer>span:before{content:'';display:inline-block;width:7px;height:7px;margin-right:7px;border-radius:50%;background:#b77aff;box-shadow:0 0 6px #b77aff55}.obby-peer>span[data-slot='1']:before{background:#aaa0b5}.obby-peer>span[data-slot='2']:before{background:#5ce5e4}.obby-peer>span[data-slot='3']:before{background:#ffce71}
@media(pointer:coarse){body.playing .audio-orb{bottom:max(226px,calc(env(safe-area-inset-bottom) + 226px));right:max(20px,env(safe-area-inset-right));width:43px;height:43px}}@media(max-width:700px){.audio-settings{max-width:none;padding:12px}.audio-settings label{flex-basis:85px}.audio-orb{right:14px;bottom:14px}.menu-card{padding-bottom:20px}.online-obby .obby-peer{font-size:9px;max-width:190px;top:276px}}@media(max-height:570px) and (orientation:landscape){body.playing .audio-orb{bottom:126px;right:20px;width:38px;height:38px}.audio-settings{margin-bottom:12px;padding:9px 12px}.audio-settings label{flex-basis:110px}.audio-settings #sound-status{display:none}.online-obby .obby-peer{top:169px;font-size:9px;gap:1px;max-width:220px}}@media(prefers-reduced-motion:reduce){.audio-orb{transition:none}}
