:root{color-scheme:dark;--cyan:#6ae3d1;--pink:#f980ae;--cream:#f5efdc;--muted:#a3b5b8}*{box-sizing:border-box}body{margin:0;background:#111a20;color:var(--cream);font-family:system-ui,-apple-system,'PingFang TC',sans-serif;background-image:radial-gradient(ellipse at 50% 20%,#203a3a66,transparent 70%)}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit;background:#ffffff0b;border:1px solid #ffffff25;border-radius:10px;padding:10px 14px;touch-action:none;user-select:none}button:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}button:hover{filter:brightness(1.13)}[hidden]{display:none!important}main{max-width:1500px;margin:auto;padding:0 40px}header{height:80px;border-bottom:1px solid #ffffff12;display:flex;justify-content:space-between;align-items:center}.brand{display:flex;gap:10px;align-items:center;text-decoration:none;color:inherit;font-weight:800;font-size:24px}.brand>span{background:var(--cyan);border-radius:10px;color:#163031;padding:3px 9px}.brand small{font-size:9px;letter-spacing:2px;color:#8ca8a8;margin-left:10px}.build{font-size:10px;letter-spacing:2px;color:#7e989c}.page-heading{display:flex;align-items:center;justify-content:space-between;padding:25px 0}.eyebrow{font-size:10px;letter-spacing:3px;color:var(--cyan);font-weight:800}h1{margin:8px 0 0;font-size:30px}h1 span{font-size:12px;font-weight:400;margin-left:18px;color:var(--muted)}.mode-pill{border:1px solid #ffffff22;border-radius:30px;padding:10px 16px;font-size:11px}.mode-pill i{color:var(--cyan);margin:0 10px}.arena{position:relative;border:1px solid #57737677;border-radius:20px;overflow:hidden;background:#26363d;isolation:isolate;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}canvas{display:block;width:100%;aspect-ratio:16/9;touch-action:none}.arena:fullscreen{border:0;border-radius:0;width:100vw;height:100dvh}.arena:fullscreen canvas{width:100%;height:100%;aspect-ratio:auto}.scoreboard{position:absolute;top:18px;left:50%;transform:translateX(-50%);display:flex;gap:0;align-items:stretch;z-index:2;pointer-events:none}.team{width:145px;background:#152c32ed;display:flex;align-items:center;gap:12px;padding:10px 16px;position:relative}.team b{font-size:28px}.team small{font-size:10px;white-space:nowrap}.blue{color:var(--cyan);border-radius:12px 0 0 12px}.pink{color:var(--pink);border-radius:0 12px 12px 0}.team-bar{position:absolute;bottom:0;left:12px;right:12px;height:3px;background:#ffffff17}.team-bar i{display:block;width:0;height:100%;background:currentColor}.match-clock{background:#131c24ef;padding:10px 20px;display:flex;flex-direction:column;text-align:center;justify-content:center}.match-clock b{font-size:20px;font-variant-numeric:tabular-nums}.match-clock small{font-size:8px;color:#a5b7b9;margin-top:3px}.top-actions{position:absolute;right:18px;top:18px;display:flex;gap:6px;z-index:5}.top-actions button{background:#17252cce;padding:8px 11px;font-size:18px}.zone-status{position:absolute;top:95px;left:50%;transform:translateX(-50%);font-size:11px;background:#14252bd9;padding:7px 15px;border-radius:20px;color:#cee3db;white-space:nowrap}.feed{position:absolute;left:20px;top:20px;max-width:200px;font-size:10px;line-height:1.7;color:#f3d9aa;pointer-events:none}.player-hud{position:absolute;left:24px;bottom:24px;display:flex;align-items:center;gap:9px;background:#13252ddb;border:1px solid #a3d8d22e;border-radius:12px;padding:8px 14px 8px 4px;pointer-events:none}.player-hud img{width:55px;height:55px;object-fit:contain}.player-hud>div{display:flex;flex-direction:column;gap:4px}.player-hud b{font-size:11px}.player-hud span{font-size:9px;color:#bcd6cc}.hp-track{width:100px;height:5px;background:#ffffff22;border-radius:3px}.hp-track i{display:block;background:var(--cyan);height:100%;width:100%;border-radius:3px}.ammo{margin-left:15px}.ammo #ammo{font-size:19px;color:#ffce79;letter-spacing:2px}.ammo small{font-size:8px;color:#94aaa7}.super-button{position:absolute;bottom:26px;right:27px;width:82px;height:82px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:conic-gradient(#b8a1fa var(--charge,0%),#243344 0);border:2px solid #b6a1dd6b;z-index:3;gap:1px}.super-button>span{font-size:23px}.super-button b{font-size:11px}.super-button small{font-size:8px}.super-button.ready{color:#281b38;border-color:#ffe6a4;background:#ffd184;box-shadow:0 0 30px #ffd88e66}.lobby{position:absolute;inset:0;background:linear-gradient(100deg,#102027fa 5%,#14272cda 45%,#182d3580);z-index:4;display:flex;align-items:center;gap:20px;padding:70px 7% 50px}.lobby[hidden]{display:none}.lobby-copy{width:57%;z-index:1}.lobby h2{font-size:clamp(26px,3.4vw,48px);line-height:1.35;margin:20px 0;letter-spacing:1px}.lobby-copy>p:not(.eyebrow){color:#a8c2c3;font-size:12px;line-height:1.9}.rule-chips{display:flex;gap:7px;margin:18px 0}.rule-chips span{border:1px solid #97d0c633;background:#6ae3d106;font-size:9px;padding:6px 8px;border-radius:5px;color:#bce1d6}.primary{display:block;margin-top:20px;min-width:220px;text-align:left;background:var(--cyan);color:#123132;font-weight:800;border:0;padding:17px 24px;box-shadow:0 4px 0 #26867d}.primary span{float:right}.text-button{background:none!important;border:0;padding:7px 0;font-size:10px;color:#c0b396;text-decoration:underline}.control-tip{font-size:10px!important;margin-top:10px}.hero-select{width:43%;position:relative;text-align:center}.hero-display{position:relative;height:230px;display:flex;align-items:center;justify-content:center}.hero-display img{width:240px;max-height:100%;object-fit:contain;z-index:1;filter:drop-shadow(0 15px 15px #0005)}.hero-orbit{position:absolute;width:230px;height:230px;border:1px solid #73cdbb44;border-radius:50%;box-shadow:0 0 75px #61c6ab1a,inset 0 0 55px #81dab418}.hero-description>span{color:#8cd9c7;font-size:9px;letter-spacing:2px}.hero-description h3{font-size:23px;margin:7px 0}.hero-description p{font-size:10px;color:#a2bdbb;margin:5px 0 16px}.hero-cards{display:flex;justify-content:center;gap:9px}.hero-card{width:90px;padding:5px 7px 9px;background:#152b32ad;border-color:#8abbb72e}.hero-card img{width:60px;height:60px;object-fit:contain}.hero-card span{display:block;font-size:9px}.hero-card.selected{border:2px solid var(--cyan);background:#29534f;box-shadow:0 0 18px #6ae3d117}.modal{position:absolute;inset:0;z-index:6;background:#112128ef;display:grid;place-items:center;padding:25px}.modal>div{max-width:600px}.modal h2{font-size:27px}.modal p{font-size:13px;line-height:1.9;color:#b4cdca}.rotate-overlay{display:none}.respawn{position:absolute;left:50%;top:45%;transform:translate(-50%,-50%);z-index:3;background:#16202cee;padding:20px 35px;text-align:center;border:1px solid #f498ae66;border-radius:15px;font-size:20px;font-weight:700}.touch-controls{display:none}footer{display:flex;justify-content:space-between;padding:22px 0;color:#6f9196;font-size:9px;letter-spacing:1px}.arena:has(.lobby:not([hidden])) .player-hud,.arena:has(.lobby:not([hidden])) .super-button,.arena:has(.lobby:not([hidden])) .touch-controls,.arena:has(.lobby:not([hidden])) .zone-status{visibility:hidden}
@media(max-width:950px),(pointer:coarse){html,body{height:100%;overflow:hidden;overscroll-behavior:none}main{padding:0;width:100%;height:100%;max-width:none}header,.page-heading,footer{display:none}.arena{position:fixed;inset:0;width:100%;height:100vh;height:100dvh;border:0;border-radius:0}canvas{width:100%;height:100%;aspect-ratio:auto}.scoreboard{top:max(10px,env(safe-area-inset-top))}.team{width:110px;padding:7px 12px;gap:8px}.team b{font-size:22px}.team small{font-size:9px}.match-clock{padding:6px 13px}.match-clock b{font-size:16px}.top-actions{right:max(12px,env(safe-area-inset-right));top:max(10px,env(safe-area-inset-top))}.top-actions button{font-size:17px;width:34px;height:36px;padding:0}.zone-status{top:65px;font-size:9px;padding:5px 11px}.feed{top:70px;left:max(16px,env(safe-area-inset-left));max-width:180px;font-size:9px}.lobby{padding:62px max(34px,env(safe-area-inset-right)) 22px max(34px,env(safe-area-inset-left));gap:18px}.lobby h2{font-size:29px;margin:9px 0}.lobby .eyebrow{font-size:8px;margin:0}.lobby-copy>p:not(.eyebrow){font-size:10px;line-height:1.7}.rule-chips{margin:10px 0;gap:5px}.rule-chips span{font-size:8px;padding:4px 6px}.primary{min-width:190px;padding:12px 18px;margin-top:12px}.control-tip{font-size:8px!important}.text-button{font-size:9px;padding:6px 0}.hero-display{height:125px}.hero-display img{width:150px}.hero-orbit{width:130px;height:130px}.hero-description h3{font-size:18px;margin:3px 0}.hero-description p{font-size:9px;margin:4px 0 8px}.hero-description>span{font-size:8px}.hero-card{width:70px;padding:3px 5px 6px}.hero-card img{width:42px;height:42px}.hero-card span{font-size:8px}.hero-cards{gap:6px}.player-hud{left:50%;transform:translateX(-50%);bottom:max(12px,env(safe-area-inset-bottom));padding:5px 10px 5px 1px;gap:5px}.player-hud img{width:36px;height:36px}.player-hud b{font-size:9px}.player-hud span{font-size:8px}.hp-track{width:70px;height:4px}.ammo{margin-left:6px}.ammo #ammo{font-size:14px}.ammo small{font-size:7px}.super-button{width:57px;height:57px;bottom:138px;right:max(30px,env(safe-area-inset-right));font-size:11px}.super-button>span{font-size:17px}.super-button b{font-size:9px}.super-button small{font-size:7px}.touch-controls{display:flex;position:absolute;bottom:max(16px,env(safe-area-inset-bottom));left:max(22px,env(safe-area-inset-left));right:max(22px,env(safe-area-inset-right));justify-content:space-between;z-index:3;pointer-events:none}.stick{position:relative;width:112px;height:112px;pointer-events:auto;touch-action:none;border-radius:50%;border:1px solid #8ae5d967;background:#1d4d494f}.aim{border-color:#fa9ebf78;background:#743a544f}.stick-cross{position:absolute;inset:0;display:grid;place-items:center;font-size:75px;color:#abddd324}.stick i{position:absolute;width:48px;height:48px;left:50%;top:50%;margin:-24px;background:linear-gradient(140deg,#a0e0d2,#3f8d86);border:1px solid #dcfff290;border-radius:50%;box-shadow:0 3px 10px #0003;pointer-events:none}.aim i{background:linear-gradient(140deg,#ffc1d7,#ad6386);border-color:#ffe3eb90}.stick small{position:absolute;bottom:7px;width:100%;text-align:center;font-size:8px;color:#dfddd0;pointer-events:none}.modal h2{font-size:24px}.modal p{font-size:11px}.respawn{font-size:16px}.arena:has(.modal:not([hidden])) .touch-controls{visibility:hidden}}
@media(max-height:360px) and (orientation:landscape){.hero-display{height:95px}.lobby h2{font-size:24px}.control-tip{display:none}.lobby{padding-top:57px}.hero-card img{width:36px;height:36px}.rule-chips{margin:7px 0}.team{width:94px}.team small{font-size:8px}.hero-description p{font-size:8px}.super-button{bottom:124px}.stick{width:100px;height:100px}}
@media(max-width:950px) and (orientation:portrait),(pointer:coarse) and (orientation:portrait){.rotate-overlay{display:flex;position:absolute;inset:0;z-index:10;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:30px;background:radial-gradient(circle,#254945,#111c24 70%)}.rotate-icon{font-size:54px;color:var(--cyan);border:2px solid #83d1ba;border-radius:15px;padding:0 24px;margin-bottom:35px}.rotate-overlay h2{font-size:24px}.rotate-overlay p{font-size:12px;line-height:1.9;color:#b1ccbf}.arena>*:not(canvas):not(.rotate-overlay){visibility:hidden}}

.arcade-home{display:grid;place-items:center;width:34px;height:36px;border:1px solid #ffffff25;border-radius:9px;text-decoration:none;color:#edeee1;font-size:21px;background:#17252cce;touch-action:manipulation}

.auto-aim{position:absolute;right:126px;bottom:48px;z-index:3;background:#193b3b;color:#9df1d9;font-size:11px}.auto-aim[aria-pressed="false"]{color:#b8b8bf;background:#28313b}@media(max-width:950px),(pointer:coarse){.auto-aim{left:max(22px,env(safe-area-inset-left));right:auto;bottom:145px;padding:8px 12px;font-size:10px}}

.mode-select{display:flex;gap:8px;margin:12px 0}.mode-select button{font-size:12px;padding:10px 12px;background:#172930}.mode-select button[aria-pressed="true"]{background:#6ae3d1;color:#163c34;border-color:#6ae3d1;font-weight:800}.hero-cards{display:grid;grid-template-columns:repeat(3,90px);gap:8px}.hero-display{height:175px}.hero-card img{width:46px;height:46px}.hero-card{padding:4px 7px 7px}.lobby{padding-top:68px;padding-bottom:28px}.lobby h2{margin:12px 0}.hero-description p{min-height:27px;max-width:290px;margin:5px auto 10px;line-height:1.5}.survival .team-bar{display:none}.survival .feed{top:auto;bottom:105px}.arena:has(.lobby:not([hidden])) .auto-aim{visibility:hidden}
@media(max-width:950px),(pointer:coarse){.lobby{padding-top:52px;padding-bottom:12px;gap:12px}.lobby-copy{width:56%}.hero-select{width:44%}.lobby-copy>.eyebrow{display:none}.mode-select{margin:0 0 8px;gap:5px}.mode-select button{font-size:10px;padding:8px}.lobby h2{font-size:26px;margin:7px 0}.hero-display{height:74px}.hero-display img{width:90px}.hero-orbit{width:80px;height:80px}.hero-description h3{font-size:16px}.hero-description p{font-size:8px;min-height:25px;margin:3px auto 6px}.hero-cards{grid-template-columns:repeat(3,65px);gap:5px}.hero-card{width:65px;padding:3px 4px 4px}.hero-card img{width:32px;height:32px}.hero-card span{font-size:8px}.control-tip{font-size:8px!important}.survival .feed{bottom:78px;max-width:200px;font-size:8px}}@media(max-height:360px) and (orientation:landscape){.hero-display{height:48px}.hero-display img{width:65px}.hero-orbit{width:55px;height:55px}.lobby h2{font-size:22px}.hero-description p{margin-bottom:3px}.mode-select button{padding:6px 8px}.lobby-copy>p:not(.eyebrow){font-size:9px}.rule-chips{margin:6px 0}}

.skill-button{position:absolute;bottom:30px;right:122px;width:76px;height:76px;border-radius:23px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:conic-gradient(#83dfef var(--skill-charge,0%),#263841 0);border:2px solid #81bddb6b;z-index:3;gap:1px;padding:5px;color:#f1fcff;touch-action:none}.skill-button.ready{background:#1e5b66;border-color:#8cf5f1;box-shadow:0 0 22px #6ecac12a}.skill-button>span{font-size:23px;line-height:22px}.skill-button b{font-size:10px}.skill-button small{font-size:8px}.skill-button em,.super-button em{position:absolute;right:-4px;top:-3px;background:#111e28;border:1px solid #849b9766;border-radius:5px;font-size:9px;font-style:normal;padding:2px 4px}.auto-aim{right:218px}.hero-abilities{display:flex;flex-direction:column;gap:3px;text-align:left;max-width:275px;margin:0 auto 10px;font-size:10px;color:#d5e3d6}.hero-abilities i{display:inline-block;font-style:normal;color:#9ce4d5;min-width:35px;font-size:9px}.hero-abilities span:nth-child(2) i{color:#8ee5fa}.hero-abilities span:nth-child(3) i{color:#d8b2ff}.hero-description p{display:none}.hp-track i,.team-bar i{transition:width .1s linear}.skill-button:active,.super-button:active{filter:brightness(1.3)}.arena:has(.lobby:not([hidden])) .skill-button,.arena:has(.modal:not([hidden])) .skill-button{visibility:hidden}.lobby .hero-display{height:150px}
@media(max-width:950px),(pointer:coarse){.skill-button{width:58px;height:58px;right:max(103px,calc(env(safe-area-inset-right) + 72px));bottom:137px;border-radius:18px}.skill-button>span{font-size:18px;line-height:18px}.skill-button b{font-size:9px}.skill-button small{font-size:7px}.skill-button em,.super-button em{display:none}.auto-aim{right:auto}.hero-abilities{max-width:205px;margin-bottom:6px;font-size:8px;gap:2px}.hero-abilities i{font-size:7px;min-width:27px}.lobby .hero-display{height:58px}.hero-description h3{margin:3px 0}.skill-button,.super-button{box-shadow:0 4px 10px #0002}}@media(max-height:360px) and (orientation:landscape){.lobby .hero-display{height:40px}.hero-abilities{font-size:7px}.skill-button{bottom:123px}.hero-cards{gap:3px}}

.stick.held{border-color:#b5fff0;background:#459b844d;box-shadow:0 0 25px #64dfb529}.stick.aim.held{border-color:#ffd3e3;background:#c758854f;box-shadow:0 0 25px #ee8fb234}

.super-button{padding:4px}.super-button small,.skill-button small{white-space:nowrap}