@import "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:#eff7ff;--accent:#b7a1ff;--bright:#efe9ff;--muted:#95a9c7;background:#040914;font-family:DM Sans,system-ui,sans-serif}*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden}body{background:#040914 url(/assets/arena.webp) 50%/cover}body.shooter{--accent:#80e5e5;--bright:#dcffff}button{font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible{outline-offset:5px;outline:2px solid #fff}button:disabled{cursor:default}#game{position:fixed;inset:0}canvas{touch-action:none;outline:none;display:block}.hud{pointer-events:none;z-index:2;background:linear-gradient(#030918ec,#03091800);grid-template-columns:1fr auto 1fr;align-items:start;gap:15px;padding:22px 28px 38px;display:grid;position:absolute;inset:0 0 auto}.brand{align-items:center;gap:12px;display:flex}.mark{color:var(--accent);text-shadow:0 0 24px var(--accent);font-size:30px}.brand strong{letter-spacing:1.5px;text-transform:uppercase;font:700 20px/.9 Barlow Condensed,sans-serif}.brand span:not(.mark){color:#8da6c4;letter-spacing:2.4px;margin-top:8px;font-size:9px;display:block}.scoreboard{text-align:center}.scoreboard>span,.best>span{letter-spacing:2.5px;color:#9cafcb;font-size:8px;font-weight:700;display:block}.scoreboard b{letter-spacing:1px;font-variant-numeric:tabular-nums;text-shadow:0 2px 20px #63ddff55;font:600 38px/1.1 Barlow Condensed,sans-serif}.best{justify-content:center;align-items:center;gap:7px;margin-top:4px;display:flex}.best span{letter-spacing:1px;font-size:7px}.best b{color:#a4b8d8;font:600 11px DM Sans,sans-serif}.tools{pointer-events:auto;justify-content:flex-end;align-items:center;gap:8px;display:flex}.tools button{color:#dceaff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#1220338a;border:1px solid #bed9ff24;border-radius:9px;width:33px;height:33px}.tools button:hover{background:#304262}.tools button:disabled{opacity:.25}#lives{letter-spacing:3px;color:#f5a7b9;margin-right:8px;font-size:14px}#combo{letter-spacing:2px;color:#ffcd8a;height:16px;margin-top:7px;font:700 12px Barlow Condensed,sans-serif}#status{color:var(--accent);letter-spacing:1.5px;pointer-events:none;font-size:9px;font-weight:700;position:absolute;top:109px;right:30px}.ability{color:#8095b6;text-align:left;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:2;background:#0b1528cc;border:1px solid #839bcb35;border-radius:12px;width:167px;padding:11px 15px;position:absolute;bottom:25px;left:28px;overflow:hidden}.ability strong{letter-spacing:1.5px;font:700 16px Barlow Condensed,sans-serif;display:block}.ability span{letter-spacing:1.7px;margin-top:5px;font-size:8px;display:block}.ability i{background:#283652;height:3px;position:absolute;inset:auto 0 0}.ability em{background:var(--accent);width:0;height:100%;transition:width .2s;display:block}.ability.charged{color:var(--bright);border-color:var(--accent);background:#23314ce6;box-shadow:0 0 24px #9c8eff2b}.ability.charged:hover{transform:translateY(-2px)}#toast{opacity:0;color:#e8f8ff;text-shadow:0 2px 12px #000;letter-spacing:3px;white-space:nowrap;pointer-events:none;z-index:3;font:700 14px Barlow Condensed,sans-serif;transition:opacity .3s,transform .3s;position:absolute;top:24%;left:50%;transform:translate(-50%,8px)}#toast.visible{opacity:1;transform:translate(-50%)}footer{color:#90a5c1;letter-spacing:1.4px;pointer-events:none;gap:22px;font-size:8px;display:flex;position:absolute;bottom:31px;right:28px}footer kbd{font:inherit;color:#c6d9ed;border-bottom:1px solid #8ea2c755;margin-right:5px;padding:3px;display:inline-block}.touch-hint{display:none}.overlay{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);z-index:4;background:radial-gradient(#081329d9 0%,#061023a8 48%,#050a1580 100%);place-items:center;padding:95px 22px 85px;display:grid;position:absolute;inset:0}.overlay[hidden],[hidden]{display:none!important}.menu{text-align:center;width:100%;max-width:740px}.eyebrow{letter-spacing:4px;color:var(--accent);font-size:9px;font-weight:700}.emblem{width:52px;height:52px;color:var(--bright);filter:drop-shadow(0 0 24px var(--accent));place-items:center;margin:20px auto 16px;font-size:40px;display:grid}h1{letter-spacing:-.5px;text-transform:uppercase;text-shadow:0 3px #3b3869,0 10px 40px #9380e522;max-width:700px;margin:0 auto 20px;font:800 clamp(48px,8vw,96px)/.86 Barlow Condensed,Impact,sans-serif}.shooter h1{text-shadow:0 3px #225c6d,0 10px 40px #50c4dc22;max-width:550px}p{color:#adc0da;max-width:370px;margin:0 auto 23px;font-size:13px;line-height:1.8}#start{color:#10182c;background:linear-gradient(145deg, var(--bright), var(--accent));letter-spacing:.5px;border:1px solid #e6e0ff88;border-radius:9px;justify-content:center;align-items:center;min-width:210px;padding:16px 34px;font-size:13px;font-weight:800;transition:transform .15s,box-shadow .15s;display:inline-flex;box-shadow:0 4px #575382,0 12px 34px #8c78ff33}#start:after{content:"→" / "";margin-left:30px;font-size:20px;line-height:.6}#start:hover{transform:translateY(-2px);box-shadow:0 6px #575382,0 18px 40px #8c78ff44}#start:active{transform:translateY(3px)}.features{color:#7f99bd;letter-spacing:1.7px;justify-content:center;gap:23px;margin:32px auto 0;font-size:8px;font-weight:700;display:flex}.features span:before{content:"◇";color:var(--accent);margin-right:7px}.menu small{color:#8da3c0;margin-top:20px;font-size:10px;display:block}.menu small b{color:#cddbf0;font-weight:500}.upgrades{grid-template-columns:repeat(3,1fr);gap:12px;max-width:670px;margin:auto;display:grid}.upgrades button{color:#ecf5ff;background:linear-gradient(150deg,#293550eb,#111d36eb);border:1px solid #7b9ac84d;border-radius:13px;min-height:135px;padding:23px 15px}.upgrades button:hover{border-color:var(--accent);transform:translateY(-3px);box-shadow:0 12px 35px #050b1f}.upgrades strong{margin:0 0 10px;font:700 22px Barlow Condensed,sans-serif;display:block}.upgrades span{color:#a5b9d7;font-size:11px;line-height:1.6}#boss{text-align:center;pointer-events:none;position:absolute;top:105px;left:25%;right:25%}#boss-phase{letter-spacing:3px;color:#f8c6cc;font:700 10px Barlow Condensed,sans-serif}#boss>div{background:#532b4444;border-radius:3px;height:4px;margin-top:6px;overflow:hidden}#boss-fill{background:#f69ab3;width:100%;height:100%;display:block;box-shadow:0 0 12px #f998af}body[data-state=ready] .ability,body[data-state=ready] #status,body[data-state=ready] #toast,body[data-state=upgrade] .features,body[data-state=paused] .features,body[data-state=over] .features{visibility:hidden}body[data-state=ready] .hud{z-index:5}body[data-state=ready] .brand{opacity:0}body[data-state=ready] .scoreboard{opacity:.45}@media (max-width:600px){.hud{grid-template-columns:1fr auto 1fr;gap:6px;padding:18px 16px}.brand{gap:7px}.brand strong{letter-spacing:.7px;max-width:100px;font-size:14px;display:block}.brand span:not(.mark){letter-spacing:1.4px;font-size:7px}.mark{font-size:24px}.scoreboard b{font-size:32px}.scoreboard .best b{font-size:10px}.tools{flex-wrap:wrap;gap:5px}.tools button{width:29px;height:29px}#lives{letter-spacing:1px;text-align:right;width:100%;margin:0;font-size:10px}.overlay{padding:110px 20px 100px}h1{font-size:67px;line-height:.88}.shooter h1{max-width:300px;font-size:63px}.eyebrow{letter-spacing:2.7px;font-size:8px}.emblem{margin:14px auto 18px}p{max-width:300px;font-size:12px;line-height:1.8}.features{letter-spacing:.8px;gap:12px;margin-top:28px;font-size:7px}.features span:before{margin-right:4px}.ability{width:150px;padding:11px 13px;bottom:22px;left:16px}.ability strong{font-size:15px}footer{letter-spacing:.5px;flex-direction:column;gap:5px;font-size:7px;bottom:30px;right:16px}footer .keyboard{display:none}.touch-hint{display:block}#status{font-size:8px;top:94px;right:16px}#toast{letter-spacing:1.5px;font-size:11px;top:25%}#boss{top:104px;left:20%;right:20%}.upgrades{grid-template-columns:1fr;gap:8px;max-width:300px}.upgrades button{text-align:left;min-height:70px;padding:12px 18px}.upgrades strong{margin-bottom:3px;font-size:19px}.upgrades span{font-size:10px}}@media (max-height:520px){.hud{padding:10px 18px}.brand strong{font-size:15px}.scoreboard b{font-size:26px}.overlay{padding:55px 20px}.emblem,.features,.menu small{display:none!important}h1,.shooter h1{margin:12px auto;font-size:50px}p{max-width:480px;margin-bottom:15px;font-size:11px}#start{padding:12px 28px}.ability{padding:8px 13px;bottom:12px}footer{bottom:18px}.upgrades button{min-height:90px;padding:13px}#status{top:75px}#boss{top:72px}}@media (prefers-reduced-motion:reduce){*{transition:none!important}}
