@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800;900&family=Inter:wght@400;500;600;700&display=swap');
:root{font-family:Inter,Arial,sans-serif;color:#e7f4ff;background:#050a11}*{box-sizing:border-box}body{margin:0;overflow:hidden}button,input{font:inherit}button{cursor:pointer}#game,canvas{position:fixed;inset:0;width:100%;height:100%;display:block}#vignette{position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse,transparent 40%,#030914aa 100%)}#crosshair{position:fixed;left:50%;top:50%;width:22px;height:22px;transform:translate(-50%,-50%);pointer-events:none}#crosshair i{position:absolute;background:#d6faff;box-shadow:0 0 5px #00cfff}#crosshair i:nth-child(1){width:2px;height:6px;left:10px;top:0}#crosshair i:nth-child(2){width:2px;height:6px;left:10px;bottom:0}#crosshair i:nth-child(3){height:2px;width:6px;top:10px;left:0}#crosshair i:nth-child(4){height:2px;width:6px;top:10px;right:0}[hidden]{display:none!important}.wordmark{font-family:'Barlow Condensed',Impact,sans-serif;font-size:30px;font-weight:900;line-height:.83;letter-spacing:.04em}.wordmark span{color:#44d9fe;margin-left:5px}.wordmark small{display:block;font:700 10px Inter,Arial,sans-serif;letter-spacing:.29em;color:#829fb2;margin-top:9px}#menu{position:fixed;inset:0;background:linear-gradient(90deg,#04101bef 0%,#04101bdc 48%,#05132268 100%);overflow:auto}.menuGlow{position:absolute;right:-13vw;top:12vh;width:65vw;height:65vw;max-height:800px;border:1px solid #49d2ff24;border-radius:50%;box-shadow:0 0 0 65px #2dcaff08,0 0 0 130px #2dcaff04,0 0 160px #1369ad4d;pointer-events:none}.menuGlow:after{content:'A';position:absolute;inset:10%;display:grid;place-items:center;color:#25c4ff0c;font:900 min(65vw,700px) 'Barlow Condensed',Impact,sans-serif}.menuInner{position:relative;min-height:100vh;max-width:1500px;margin:auto;padding:42px clamp(25px,5vw,90px) 25px;display:flex;flex-direction:column}.topline,.menuFoot{display:flex;justify-content:space-between;gap:20px;align-items:flex-start}.status,.eyebrow{font-size:12px;font-weight:800;letter-spacing:.2em;color:#62daff}.status:before{content:'';display:inline-block;width:8px;height:8px;background:#56e6ad;border-radius:50%;margin-right:9px;box-shadow:0 0 12px #56e6ad}.menuContent{width:min(590px,100%);margin:auto 0;padding:55px 0}.eyebrow{color:#6fa4bc}h1{font-family:'Barlow Condensed',Impact,sans-serif;font-size:clamp(64px,8vw,116px);font-weight:900;line-height:.82;letter-spacing:.015em;margin:22px 0 26px}h1 span{color:#55d9f9}.story{font-size:16px;line-height:1.65;color:#a9c1d1;max-width:520px;margin-bottom:30px}.form{display:flex;gap:12px}.form label,.join label{font-size:11px;font-weight:800;letter-spacing:.13em;color:#93adbf}.form label{flex:1}.form small{color:#68889d;font-size:10px}input{display:block;width:100%;background:#091c2b;border:1px solid #4b839f66;color:#ecfaff;border-radius:3px;padding:14px 13px;margin-top:9px;outline:none}input:focus{border-color:#5bdaff;box-shadow:0 0 0 3px #39b9ef24}input::placeholder{color:#6d899a}.actions{display:flex;gap:10px;margin-top:15px}.actions button{border-radius:3px;padding:17px 18px;font-size:12px;font-weight:900;letter-spacing:.09em}.primary{flex:1;border:1px solid #8ceeff;background:#5ddcff;color:#001826;box-shadow:0 0 24px #22bbee4d}.primary span{float:right;font-size:18px;line-height:.75}.outline{flex:1;border:1px solid #68a6bd86;background:#071827a6;color:#d8f3ff}.join{margin-top:24px;padding-top:20px;border-top:1px solid #5090ae45}.join>div{display:flex;gap:8px}.join input{margin-top:8px;letter-spacing:.14em;text-transform:uppercase}.join button{align-self:end;white-space:nowrap;background:#133b51;color:#aeeaff;border:1px solid #4caaca74;border-radius:3px;height:47px;padding:0 17px;font-size:12px;font-weight:800}.error{min-height:20px;color:#ff8592;font-size:13px}.menuFoot{font-size:10px;color:#63859a;letter-spacing:.15em;font-weight:800;border-top:1px solid #4a8aa340;padding-top:18px}#hud{position:fixed;inset:0;pointer-events:none;padding:26px 32px;display:flex;flex-direction:column;justify-content:space-between}#hud header,#hud footer{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}#hud .wordmark{font-size:23px}.matchscore{display:flex;align-items:center;gap:18px;background:#041727d9;border:1px solid #80b6c450;padding:9px 20px;clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px)}.matchscore b{font:800 36px 'Barlow Condensed',Impact,sans-serif;color:#5bd6ff}.matchscore b:last-child{color:#ff6a73}.matchscore span{font-size:10px;letter-spacing:.14em;font-weight:800;color:#c7d8e3}.matchscore em{font-style:normal;color:#6a8495;margin:0 6px}.timer{font:800 28px 'Barlow Condensed',Impact,sans-serif;background:#041727c9;padding:8px 14px;border:1px solid #80b6c450}.hudBox{background:#041727d9;border-left:3px solid #45d7f3;padding:10px 15px;font-size:10px;font-weight:800;letter-spacing:.14em;color:#9db8c8;min-width:140px}.hudBox strong{display:block;font:800 32px 'Barlow Condensed',Impact,sans-serif;color:#fff;letter-spacing:0}.meter{height:4px;background:#224151;margin-top:4px}.meter span{display:block;height:100%;background:#59e2fa;width:100%;transition:width .2s}.footerRight{display:flex;gap:12px;align-items:end}.small{pointer-events:auto;color:#94ddf0;border:0;background:transparent;padding:4px 0 0;font-size:10px;font-weight:700}.help{position:absolute;bottom:13px;left:50%;transform:translateX(-50%);font-size:11px;color:#a7c2cf;text-shadow:0 2px 5px #000;white-space:nowrap}#killfeed{position:absolute;right:32px;top:93px;text-align:right;color:#c8f1ff;font-size:13px;line-height:1.6;text-shadow:0 2px 5px #000}.centerNotice{position:absolute;top:31%;left:50%;transform:translateX(-50%);font:800 30px 'Barlow Condensed',Impact,sans-serif;color:#fff;text-shadow:0 0 14px #36caff;letter-spacing:.1em;text-align:center}#board{position:fixed;inset:12% 22%;background:#051a2bee;border:1px solid #74cbe477;padding:25px 35px;overflow:auto}#board h2{font:800 38px 'Barlow Condensed',Impact,sans-serif;letter-spacing:.08em;margin:0 0 14px}#boardRows .row{display:grid;grid-template-columns:1fr 70px 70px;gap:10px;border-bottom:1px solid #4563786b;padding:10px}.row.blue{color:#64dbff}.row.red{color:#ff8288}@media(max-width:700px){.menuInner{padding:24px}.menuContent{padding:38px 0}.form,.actions{flex-direction:column}.topline .wordmark{font-size:24px}.status{font-size:10px}.menuFoot{flex-direction:column}#hud{padding:15px}#hud .wordmark{font-size:16px}.matchscore{gap:6px;padding:7px}.matchscore b{font-size:24px}.matchscore span{font-size:9px}.timer{font-size:20px;padding:7px}.help{display:none}#board{inset:15% 5%}}
