@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800;900&family=DM+Sans:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--bg:#090e12;--fg:#edece3;--muted:#89989f;--cyan:#78e4e3;--orange:#f99560;--line:#ffffff1e;font-family:'DM Sans',Arial,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--fg);overflow:hidden}button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}button:focus-visible{outline:2px solid var(--cyan);outline-offset:5px}button:hover{filter:brightness(1.15)}[hidden]{display:none!important}#arena,.vignette{position:fixed;inset:0}#arena canvas{width:100%;height:100%;display:block}.vignette{pointer-events:none;background:linear-gradient(90deg,#090e12ee 0%,#090e12c9 25%,transparent 65%),linear-gradient(0deg,#090e12 0%,transparent 25%,transparent 82%,#090e1255);transition:opacity .5s}body.playing .vignette{opacity:0.2}header{position:relative;z-index:4;display:flex;align-items:center;justify-content:space-between;padding:24px 4%;border-bottom:1px solid var(--line);gap:16px;background:#0a10143b}.wordmark{font:800 30px 'Barlow Condensed',Impact,sans-serif;display:flex;align-items:center;gap:10px;letter-spacing:1px;padding:0}.mark{color:var(--cyan);font-size:32px}.wordmark .small{font:600 9px 'DM Sans',sans-serif;letter-spacing:2px;width:65px;text-align:left;line-height:1.7;border-left:1px solid var(--line);padding-left:12px;margin-left:4px}nav{display:flex;gap:35px}nav button{font-size:11px;font-weight:700;letter-spacing:1.6px;padding:10px 0;position:relative;color:var(--muted)}nav button.active{color:var(--fg)}nav button.active:after{content:'';position:absolute;bottom:-25px;left:0;right:0;background:var(--cyan);height:2px}.tag{font-size:8px;color:var(--cyan);border:1px solid #78e4e344;padding:3px 4px;letter-spacing:1px;margin-left:5px}.icon-btn{font-size:10px;font-weight:700;letter-spacing:1px;border:1px solid var(--line);padding:11px 13px;border-radius:3px;background:#0d1418a8}#welcome{position:relative;height:calc(100svh - 92px);min-height:560px;padding:0 7%}.intro{position:absolute;top:50%;transform:translateY(-57%);max-width:560px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:2.8px;color:var(--cyan);display:flex;align-items:center;gap:10px}.eyebrow i,.dot{width:5px;height:5px;border-radius:50%;background:var(--cyan);display:inline-block;box-shadow:0 0 10px #78e4e388}h1{font:900 clamp(68px,7.7vw,122px)/.9 'Barlow Condensed',Impact,sans-serif;letter-spacing:-1.8px;margin:26px 0}h1 span{color:#9daeb5}p{font-size:14px;line-height:1.8;color:#9dacb3}.mode-detail{display:flex;justify-content:space-between;width:342px;max-width:90vw;border-top:1px solid var(--line);padding-top:22px;margin:30px 0 15px;font-size:9px;font-weight:700;letter-spacing:1.4px}.mode-detail span:last-child{color:var(--muted)}.primary{display:flex;align-items:center;justify-content:space-between;background:var(--cyan);color:#0b2328;font-size:12px;font-weight:800;letter-spacing:1.3px;padding:21px 23px;min-width:342px;max-width:100%;border-radius:2px;transition:transform .2s}.primary:hover{transform:translateY(-2px)}.primary span{font-size:22px;line-height:15px}.text-btn{font-size:11px;color:#acbbc1;padding:20px 0}.text-btn span{margin-left:10px}.intro-bottom{display:flex;align-items:center;gap:8px;font-size:8px;letter-spacing:1.1px;color:#6c818b;margin-top:17px}.sep{margin:0 4px;color:#34474e}.scene-note{position:absolute;right:8%;bottom:23%;display:flex;flex-direction:column;gap:9px;border-left:2px solid var(--cyan);padding-left:15px}.micro{font-size:9px;letter-spacing:2px;color:var(--cyan)}.scene-note strong{font:600 24px 'Barlow Condensed',sans-serif;letter-spacing:1px}.scene-note>span:last-child{font-size:10px;color:#8d9fa7}.welcome-bottom{position:absolute;bottom:25px;left:4.4%;right:4.4%;display:flex;justify-content:space-between;gap:15px;align-items:center;border-top:1px solid var(--line);padding-top:23px;font-size:8px;letter-spacing:1.4px;color:#60757f}.welcome-bottom button{font-size:9px;letter-spacing:1.3px;color:#bac8ce}.welcome-bottom button span{margin-left:15px;color:var(--cyan)}#game-ui{position:fixed;inset:92px 0 0;pointer-events:none}#game-ui button{pointer-events:auto}.scoreboard{position:absolute;top:20px;left:50%;transform:translateX(-50%);display:flex;gap:28px;padding:15px 26px 12px;background:#080e13dc;border:1px solid var(--line);border-radius:5px;align-items:center;min-width:285px;justify-content:center;backdrop-filter:blur(12px)}.team{text-align:center;display:flex;flex-direction:column;gap:3px}.team-label{font-size:9px;letter-spacing:2px}.team strong{font:700 48px/1 'Barlow Condensed',sans-serif}.cyan{color:var(--cyan)}.orange{color:var(--orange)}.score-center{display:flex;flex-direction:column;text-align:center;gap:5px}.score-center span{font-size:8px;letter-spacing:1.2px;color:var(--muted)}.score-center b{font:500 25px 'Barlow Condensed',sans-serif}.game-actions{position:absolute;right:25px;top:25px;display:flex;gap:8px}.status{position:absolute;left:4%;top:35px;display:flex;flex-direction:column;gap:7px}.status strong{font:600 24px 'Barlow Condensed',sans-serif}.control-bar{position:absolute;bottom:25px;left:50%;transform:translateX(-50%);display:flex;gap:23px;white-space:nowrap;color:#8799a2;font-size:8px;letter-spacing:.7px}.control-bar b{font-weight:500}kbd{font:500 10px 'DM Sans',sans-serif;border:1px solid #ffffff30;border-radius:3px;display:inline-block;padding:4px 6px;color:#c9d3d7;background:#182127;margin-right:5px}.meter-wrap{position:absolute;bottom:90px;width:270px;left:50%;transform:translateX(-50%)}.meter-label{display:flex;justify-content:space-between;font-size:8px;letter-spacing:1.2px;margin-bottom:9px;color:#adc0c8}.meter{height:12px;background:#111d26;border:1px solid #51626b;position:relative;border-radius:2px;overflow:hidden}.sweet{position:absolute;left:65%;width:14%;height:100%;background:#80e7a67d}#power{position:absolute;left:0;top:0;height:100%;background:#a2c9d164;width:0}#needle{position:absolute;top:0;left:0;height:100%;width:3px;background:#fff;box-shadow:0 0 10px white}.meter-hint{text-align:center;font-size:9px;color:#7e939d;margin-top:8px}.stamina{position:absolute;bottom:98px;left:4%;width:90px;font-size:8px;letter-spacing:2px;color:#83949d}.stamina>div{height:3px;background:#20313b;margin-top:9px}.stamina i{display:block;height:100%;background:var(--cyan);width:100%}dialog{color:var(--fg);width:min(680px,92vw);background:#101a21;border:1px solid #3e515c;padding:40px;border-radius:5px;box-shadow:0 40px 120px #000c}dialog::backdrop{background:#04090dd9;backdrop-filter:blur(10px)}dialog h2{font:800 50px/1 'Barlow Condensed',sans-serif;margin:20px 0}dialog h3{font-size:10px;color:var(--cyan);letter-spacing:1px}dialog p{font-size:12px}dialog .close{position:absolute;right:15px;top:10px;font-size:26px;color:#8ca1ac}.help-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px 30px}.subtle{color:#627b87}#pause-dialog{width:420px;text-align:center}#pause-dialog .eyebrow{justify-content:center}#pause-dialog .primary{width:100%;min-width:0;margin-top:25px}.secondary{display:block;border:1px solid #53646c;width:100%;padding:16px;margin-top:12px;font-size:11px;letter-spacing:1px}#error{position:fixed;z-index:20;inset:20%;padding:40px;background:#17222b}#touch-controls{display:none}
@media(min-width:1600px){.intro{left:9%}.scene-note{right:12%}}
@media(max-width:900px){nav{gap:18px}.game-actions{top:140px;right:15px}.status{top:145px;left:20px}.control-bar{gap:10px;font-size:7px}.scene-note{right:5%;bottom:25%}h1{font-size:80px}.intro{max-width:430px}.welcome-bottom>span:last-child{display:none}}
@media(max-width:600px){header{padding:16px 20px}.wordmark{font-size:24px}.wordmark .small{display:none}nav{gap:15px}nav button{font-size:8px;letter-spacing:1px}nav button.active:after{bottom:-23px}#sound{font-size:8px;padding:8px}.mark{font-size:25px}#welcome{height:calc(100svh - 75px);min-height:0;padding:0 25px}.intro{top:13%;transform:none}h1{font-size:73px;margin:22px 0}.intro p{font-size:12px}.eyebrow{font-size:8px;letter-spacing:2px}.mode-detail{margin-top:20px;width:310px}.primary{min-width:310px;padding:18px}.scene-note{display:none}.welcome-bottom{bottom:15px;left:25px;right:25px}.welcome-bottom>span{display:none}.welcome-bottom button{font-size:8px}.intro-bottom{margin-top:0;font-size:7px}.vignette{background:linear-gradient(90deg,#090e12e8,#090e1270),linear-gradient(0deg,#090e12,transparent)}#game-ui{top:75px}.scoreboard{top:12px;gap:22px;padding:10px 20px;min-width:250px}.team strong{font-size:37px}.status{top:110px}.status strong{font-size:20px}.game-actions{top:110px;right:12px;gap:5px}.game-actions button{font-size:8px;padding:9px}.game-actions kbd{display:none}.control-bar{display:none}.meter-wrap{bottom:162px;width:225px}.stamina{bottom:215px;left:20px;width:65px}#touch-controls{display:flex;position:absolute;bottom:25px;left:15px;right:15px;justify-content:space-between;align-items:flex-end;pointer-events:none}.dpad{display:grid;grid-template-columns:repeat(3,43px);gap:4px}.dpad button,.touch-actions button{pointer-events:auto;touch-action:none;user-select:none;background:#18303bce;border:1px solid #56707977;border-radius:7px;height:43px;font-size:19px}.dpad button:first-child{grid-column:2}.dpad button:nth-child(2){grid-column:1;grid-row:2}.dpad button:nth-child(3){grid-column:2;grid-row:2}.dpad button:nth-child(4){grid-column:3;grid-row:2}.touch-actions{display:grid;grid-template-columns:repeat(2,54px);gap:7px}.touch-actions button{font-size:8px;letter-spacing:1px}.touch-actions .touch-shoot{grid-column:1/3;color:var(--cyan);background:#21434b;height:50px}.help-grid{grid-template-columns:1fr;gap:0}dialog{padding:25px;max-height:88svh}dialog h2{font-size:38px}dialog .primary{min-width:0;width:100%}}
@media(max-height:700px) and (min-width:601px){header{padding:15px 4%}#welcome{height:calc(100svh - 75px);min-height:0}.intro{transform:translateY(-52%)}h1{font-size:72px;margin:15px 0}.intro-bottom{margin:0}.mode-detail{margin-top:15px;padding-top:15px}.scene-note{bottom:20%}.welcome-bottom{bottom:15px}#game-ui{top:75px}}
.friend-btn{display:flex;justify-content:space-between;align-items:center;width:342px;max-width:100%;border:1px solid #78e4e35c;padding:13px 23px;margin-top:10px;color:var(--cyan);font-size:10px;font-weight:700;letter-spacing:1.2px}.friend-btn span{font-size:18px}.intro{transform:translateY(-53%)}.intro-bottom{margin-top:2px}.connection-badge{position:absolute;top:125px;left:50%;transform:translateX(-50%);font-size:9px;letter-spacing:1.2px;color:var(--cyan);background:#0a151be6;padding:8px 12px;border:1px solid #35545e;border-radius:3px}.control-bar{gap:16px}.close-room{position:absolute;right:15px;top:10px;font-size:26px;color:#8ca1ac}#friend-dialog{width:470px}.room-buttons .primary{width:100%;min-width:0}.join-row{display:flex;gap:10px;margin-top:14px}.join-row input{min-width:0;width:100%;background:#0a1218;border:1px solid #455b66;padding:14px;color:var(--cyan);font:600 15px 'DM Sans',sans-serif;text-transform:uppercase;letter-spacing:3px}.join-row .secondary{width:90px;margin:0}#room-invite{border:1px solid #456770;padding:20px;margin-top:18px;text-align:center}#room-code{display:block;font:700 32px 'Barlow Condensed',sans-serif;color:var(--cyan);letter-spacing:6px;margin:12px 0}#room-status{color:var(--cyan);font-size:12px}button:disabled{opacity:.5;cursor:default}.room-buttons button:disabled{opacity:.45}.join-row input:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
.sweet{background:#77ef99;box-shadow:0 0 10px #63ef9955}.meter-wrap.contested .meter-label{color:#f99560}.meter-wrap .meter-label{font-size:8px}.meter{height:15px}
@media(max-width:900px){.control-bar{gap:8px;flex-wrap:wrap;justify-content:center;max-width:90%;width:760px}.control-bar kbd{font-size:8px}}
@media(max-width:600px){.intro{transform:none;top:9%}.friend-btn{width:310px}.intro-bottom{font-size:7px}.intro .text-btn{padding:13px 0}.connection-badge{top:98px;font-size:7px;padding:5px 8px}.status{top:139px}.game-actions{top:139px}.touch-actions{grid-template-columns:repeat(2,54px)}.touch-actions button{height:32px}.touch-actions .touch-shoot{height:43px}.meter-wrap{bottom:179px}.stamina{bottom:220px}}
@media(max-height:740px){.intro{top:7%;transform:none}h1{font-size:66px;margin:14px 0}.intro p{margin:8px 0}.mode-detail{margin-top:13px;padding-top:12px}.intro-bottom{display:none}.intro .text-btn{padding:10px 0}.welcome-bottom{padding-top:14px}}

.header-tools{display:flex;gap:8px}.stamina{width:120px;letter-spacing:1px}.stamina #stamina-value{float:right;color:var(--cyan)}.stamina>div{height:5px;position:relative}.stamina>div:after{content:'';position:absolute;left:28%;top:-2px;height:9px;width:1px;background:#ffffff55}.stamina.exhausted,.stamina.exhausted #stamina-value{color:var(--orange)}.stamina.exhausted i{background:var(--orange)}#settings-dialog{width:min(750px,94vw);max-height:90svh;overflow:auto}#settings-dialog h2{margin:15px 0 22px}.difficulty-row{display:flex;justify-content:space-between;align-items:center;gap:20px}.difficulty-row label{font-size:10px;letter-spacing:1.3px}.difficulty-row select{padding:12px;background:#0b141b;color:var(--cyan);border:1px solid #405b64;font:inherit;font-size:12px;border-radius:3px}.bindings-heading,.binding-row{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:10px;align-items:center}.bindings-heading{font-size:9px;color:var(--muted);letter-spacing:1px;margin:25px 0 8px}.binding-row{padding:7px 0;border-bottom:1px solid var(--line);font-size:11px}.binding-row button{background:#182a32;border:1px solid #355460;padding:9px 5px;font-size:10px;border-radius:3px;color:#bfe6e5;min-height:34px}.binding-row button:hover{border-color:var(--cyan)}#bind-status{color:var(--cyan);min-height:22px}.settings-footer{display:flex;gap:12px}.settings-footer button{margin:0}.control-bar{bottom:20px}#pad-status{overflow-wrap:anywhere}#settings-dialog select:focus-visible{outline:2px solid var(--cyan)}@media(max-width:600px){header{padding:14px 12px;gap:8px}nav{gap:10px}.header-tools{gap:4px}.header-tools .icon-btn,#sound{font-size:7px;padding:8px 6px;letter-spacing:.4px}.wordmark{font-size:22px;gap:5px}.wordmark .mark{font-size:22px}.stamina{width:95px;bottom:246px}.meter-wrap{bottom:202px}.binding-row{font-size:10px;gap:6px;grid-template-columns:1.1fr .85fr 1fr}.binding-row button{font-size:8px}.bindings-heading{font-size:8px;gap:6px;grid-template-columns:1.1fr .85fr 1fr}.difficulty-row{gap:10px}.difficulty-row select{max-width:175px;font-size:11px}.touch-actions{gap:5px}.touch-actions button{height:30px}.touch-actions .touch-shoot{height:38px}#settings-dialog{padding:24px 18px}.team-label{font-size:8px;letter-spacing:1px}}
@media(max-width:600px){.stamina{bottom:272px}}
.team-energy{height:3px;width:45px;max-width:100%;background:#28414b;margin:5px auto 0}.team-energy i{display:block;height:100%;background:var(--cyan)}.team-energy.opponent i{background:var(--orange)}.team-energy.exhausted i{background:#c96659}.connection-badge{top:140px}@media(max-width:600px){.connection-badge{top:108px}}

.energy-caption{font-size:7px;letter-spacing:.6px;color:#b2c5ca;white-space:nowrap}.team-energy.exhausted+.energy-caption{color:var(--orange)}.connection-badge{top:150px}@media(max-width:600px){.connection-badge{top:119px}}

.control-legend{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:16px;background:#0a1016e8;border:1px solid #ffffff20;padding:10px 14px;white-space:nowrap}.control-legend #control-role{font:700 12px 'Barlow Condensed',sans-serif;color:var(--orange);letter-spacing:1.2px}.control-legend .control-bar{position:static;transform:none;gap:12px;width:auto;max-width:none}.meter-wrap.checking .sweet{opacity:.15}.meter-wrap.checking .meter-label{color:var(--cyan)}@media(max-width:1100px){.control-legend{max-width:96%;white-space:normal}.control-legend .control-bar{flex-wrap:wrap;justify-content:center;gap:8px}}@media(max-width:600px){.control-legend{display:none}.meter-wrap{bottom:235px}.stamina{bottom:297px}.touch-actions{gap:4px}.touch-actions button{height:28px;font-size:7px}.touch-actions .touch-shoot{height:37px}}

body.playing header nav{visibility:hidden}.scoreboard{top:-78px}.meter-wrap{left:auto;right:4%;transform:none;bottom:85px;background:#0b151ce8;padding:12px;border:1px solid #69828a55;border-radius:4px}.stamina{background:#0b151ce8;padding:10px;border-radius:3px}.meter-hint{color:#afc1ca}.connection-badge{top:65px}@media(max-width:600px){body.playing header nav{visibility:visible}.scoreboard{top:12px}.meter-wrap{left:50%;right:auto;transform:translateX(-50%);top:195px;bottom:auto;width:245px;padding:9px}.stamina{top:290px;bottom:auto;width:105px;padding:8px}.connection-badge{top:119px}}

/* The local player's head anchors the meter in every mode and camera. */
#game-ui .meter-wrap{position:fixed;left:50%;top:50%;right:auto;bottom:auto;transform:translate(-50%,-100%);width:210px;max-width:calc(100vw - 16px);padding:7px 9px;background:#09131eeb;pointer-events:none;z-index:2;box-shadow:0 3px 12px #0006}
#game-ui .meter-wrap .meter-label{font-size:7px;letter-spacing:.5px;margin-bottom:5px;gap:8px;white-space:nowrap}#game-ui .meter-wrap .meter{height:12px}#game-ui .meter-hint{display:none}
@media(max-width:600px){#game-ui .meter-wrap{width:178px;padding:6px 7px}#game-ui .meter-wrap .meter-label{font-size:6px;letter-spacing:0}#game-ui .stamina{top:auto;bottom:180px}}

#game-ui .power-mode .sweet,#game-ui .power-mode #needle{display:none}#game-ui .power-mode #power{background:linear-gradient(90deg,#74d9ed,#f6c85f 70%,#f06953);background-size:210px 100%;opacity:1}#game-ui .power-mode .meter{background:repeating-linear-gradient(90deg,#162b36 0,#162b36 calc(25% - 1px),#68818a55 calc(25% - 1px),#68818a55 25%)}

#goal-celebrations{position:absolute;left:50%;bottom:95px;transform:translateX(-50%);display:flex;gap:9px;align-items:center;padding:12px;background:#10222af2;border:1px solid #e8c969;border-radius:5px;white-space:nowrap}#goal-celebrations strong{font-size:10px;color:#f2d574}#goal-celebrations button{padding:10px;background:#28434b;font-size:10px;border-radius:3px}#goal-celebrations button[aria-pressed=true]{background:#e8c969;color:#10222a}@media(max-width:600px){#goal-celebrations{bottom:220px;gap:5px;padding:8px;flex-wrap:wrap;justify-content:center;width:310px}#goal-celebrations strong{width:100%;text-align:center}#goal-celebrations button{font-size:9px}}

#goal-replay{position:absolute;top:90px;left:50%;transform:translateX(-50%);padding:12px 18px;background:#0a1926ed;border:1px solid #78e4e3;display:flex;gap:16px;align-items:center;white-space:nowrap;font-size:11px}#goal-replay strong{color:#78e4e3}#goal-replay span{font-size:9px}#goal-replay button{background:#294551;padding:8px}.replaying #meter-wrap,.replaying .stamina,.replaying .control-legend{visibility:hidden}@media(max-width:600px){#goal-replay{top:180px;width:94%;gap:8px;padding:10px;font-size:10px}}

#skip-celebration{position:absolute;left:50%;bottom:65px;transform:translateX(-50%);padding:8px 14px;background:#233b46;border:1px solid #78919d;border-radius:3px;font-size:9px;white-space:nowrap}@media(max-width:600px){#skip-celebration{bottom:190px}}