:root{color-scheme:dark;--bg:oklch(from #0d0f14 l c h);--surface:oklch(from #12171d l c h);--text:oklch(96% .006 153);--muted:oklch(from #a7b0be l c h);--subtle:oklch(62% .015 250);--accent:oklch(from #39ff88 l c h);--gold:oklch(from #f6c453 l c h);--line:oklch(27% .012 250);--danger:oklch(73% .15 18);font-family:Arial,Helvetica,system-ui,sans-serif;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-size:13px;-webkit-font-smoothing:antialiased}button,input{font:inherit}button,a,input{touch-action:manipulation}button{cursor:pointer;color:inherit;transition:background 160ms ease-out,color 160ms ease-out,border-color 160ms ease-out,opacity 160ms ease-out}button:disabled{opacity:.35;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible,canvas:focus-visible{outline:2px solid var(--accent);outline-offset:5px}button:active:not(:disabled){opacity:.75}button,svg{flex-shrink:0}[hidden]{display:none!important}.svg-defs{position:absolute;width:0;height:0;overflow:hidden;pointer-events:none}
header{height:76px;display:flex;align-items:center;padding:0 32px;gap:28px;border-bottom:1px solid var(--line);position:relative;z-index:5;background:var(--bg)}.brand{display:flex;color:var(--text);text-decoration:none}.brand svg{display:block;width:112px;height:32px}.wallet{display:flex;align-items:center;gap:16px;margin-left:auto;font-variant-numeric:tabular-nums}.wallet strong{font-size:13px;font-weight:500;min-width:62px;text-align:right}.demo-pill{font-size:9px;letter-spacing:1.5px;color:var(--muted)}nav{display:flex;align-items:center;gap:6px;border-left:1px solid var(--line);padding-left:20px}.icon-button{display:grid;place-items:center;width:34px;height:34px;border:0;background:transparent;color:var(--muted);border-radius:4px;padding:7px}.icon-button:hover{background:var(--surface);color:var(--text)}.icon-button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}.wallet .icon-button{width:28px;height:28px;padding:6px;color:var(--subtle)}
main{height:calc(100dvh - 76px);min-height:500px}.arena{position:relative;height:100%;overflow:hidden;background:var(--bg)}#game{display:block;width:100%;height:100%;touch-action:none;transition:opacity 200ms ease-out}body:not([data-view="play"]) #game{opacity:0;pointer-events:none}.arena-top{position:absolute;bottom:20px;left:32px;right:32px;display:flex;justify-content:space-between;align-items:center;color:var(--subtle);font-size:10px;letter-spacing:.2px;pointer-events:none}.connection{display:flex;align-items:center;gap:7px;font-variant-numeric:tabular-nums}.connection::before{content:'';width:4px;height:4px;background:var(--subtle);border-radius:50%}.connection[data-connected="true"]::before{background:var(--accent)}.lobby{position:absolute;inset:0;display:grid;place-items:center;padding:32px 24px 76px}.menu{width:304px;max-width:100%}.menu-logo{margin:0 -12px 44px;font-size:0;font-weight:400}.menu-logo svg{width:100%;height:auto;display:block;color:var(--text)}.entry label,.entry-label{font-size:9px;letter-spacing:1.8px;color:var(--muted);font-weight:500}.entry input{display:block;width:100%;height:46px;background:transparent;border:0;border-bottom:1px solid var(--line);border-radius:0;color:var(--text);font-size:14px;padding:0 0 4px;margin:6px 0 28px;transition:border-color 160ms ease-out}.entry input:focus{border-color:var(--accent);outline:none}.entry input:focus-visible{box-shadow:0 2px 0 -1px var(--accent)}.entry-label{display:flex;align-items:center;justify-content:space-between}.entry-label span:last-child{font-size:10px;letter-spacing:0;color:var(--subtle);text-transform:none}.stakes{display:flex;gap:8px;margin:12px 0 24px}.stakes button{height:44px;flex:1;min-width:0;border:1px solid var(--line);background:transparent;color:var(--muted);border-radius:4px;font-size:13px;font-variant-numeric:tabular-nums}.stakes button:hover{border-color:var(--muted);color:var(--text)}.stakes button.selected{border-color:var(--accent);color:var(--accent);background:oklch(from #39ff88 l c h / .055)}.primary{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;height:48px;background:var(--accent);color:var(--bg);border:0;border-radius:4px;font-size:11px;font-weight:700;letter-spacing:1.6px}.primary:hover:not(:disabled){background:oklch(93% .15 153)}.primary span{font-size:21px;line-height:1;font-weight:400;letter-spacing:-2px;margin-top:-2px}
.leaderboard{position:absolute;right:30px;top:30px;width:172px;padding:0;pointer-events:none}.board-title{font-size:9px;letter-spacing:1.7px;color:var(--subtle);margin-bottom:21px}.leader{display:flex;align-items:center;gap:8px;font-size:10px;margin:14px 0}.leader .rank{width:15px;color:var(--subtle);font-size:8px;font-variant-numeric:tabular-nums}.leader i{width:4px;height:4px;border-radius:50%;flex-shrink:0}.leader>span:not(.rank){overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.leader strong{margin-left:auto;white-space:nowrap;font-size:10px;font-weight:400;font-variant-numeric:tabular-nums}.leader.me{color:var(--accent)}.board-foot,.board-loot{display:flex;justify-content:space-between;font-size:9px;color:var(--subtle);margin-top:10px;gap:12px;font-variant-numeric:tabular-nums}.board-foot{border-top:1px solid var(--line);padding-top:14px;margin-top:20px}.board-foot strong,.board-loot strong{font-weight:400;color:var(--muted)}.board-loot strong{color:var(--gold)}.minimap{position:absolute;right:28px;bottom:64px;pointer-events:none}#map{width:96px;height:96px;display:block;opacity:.65}body:not([data-view="play"]) .leaderboard,body:not([data-view="play"]) .minimap{display:none}
.hud{position:absolute;bottom:62px;left:50%;transform:translateX(-50%);display:flex;gap:32px;align-items:center;background:var(--bg);border:1px solid var(--line);padding:18px 22px;border-radius:6px}.hud>div>span{display:block;color:var(--subtle);font-size:8px;letter-spacing:1.5px;margin-bottom:8px}.hud strong{font-size:22px;font-weight:500;font-variant-numeric:tabular-nums;white-space:nowrap;letter-spacing:-.6px}.prize-stat strong{color:var(--gold)}.kills-stat{min-width:34px}.extract-wrap{width:174px}#extract{display:flex;align-items:center;justify-content:center;gap:20px;height:40px;width:100%;border:0;border-radius:3px;background:var(--accent);color:var(--bg);font-size:10px;font-weight:700;letter-spacing:1.5px;touch-action:none;user-select:none;-webkit-user-select:none}#extract:hover{background:oklch(93% .15 153)}kbd{font:9px Arial,Helvetica,sans-serif;letter-spacing:0;opacity:.6}#extract kbd{border:1px solid oklch(from #0d0f14 l c h / .25);padding:2px 4px;border-radius:2px}.progress{height:6px;position:relative;background:var(--surface);margin-top:8px;overflow:hidden;border-radius:1px}.progress span{position:absolute;inset:0;background:var(--accent);transform:scaleX(0);transform-origin:left}.progress::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent 88%,var(--bg) 88%);background-size:10% 100%;pointer-events:none}.extract-wrap small{display:block;margin-top:7px;color:var(--muted);font-size:9px;text-align:center;font-variant-numeric:tabular-nums}.boost-indicator{position:absolute;left:30px;bottom:74px;display:flex;align-items:center;gap:7px;color:var(--accent);font-size:8px;letter-spacing:1.5px;pointer-events:none}.boost-indicator span{font-size:24px;line-height:1;letter-spacing:-2px}.boundary-warning{position:absolute;top:28px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:16px;color:var(--danger);font-size:9px;pointer-events:none;border:1px solid oklch(39% .04 18);background:var(--bg);padding:10px 14px;border-radius:3px}.boundary-warning strong{font-size:8px;letter-spacing:1.2px;font-weight:500}.boundary-warning small{font-size:10px;font-variant-numeric:tabular-nums;color:var(--muted)}.boundary-warning.critical{border-color:var(--danger)}
.result{position:absolute;left:50%;top:50%;transform:translate(-50%,-55%);width:304px;max-width:calc(100% - 48px);text-align:center}.eyebrow{font-size:9px;letter-spacing:1.8px;color:var(--muted)}.result h2{font-size:46px;line-height:1.15;font-weight:500;letter-spacing:-2px;margin:22px 0 14px;color:var(--text);font-variant-numeric:tabular-nums}.result[data-success="true"] h2{color:var(--gold)}.result p{font-size:12px;line-height:1.6;color:var(--muted);margin:0 0 36px;min-height:20px}.network-notice{position:absolute;top:24px;left:50%;transform:translateX(-50%);max-width:calc(100% - 40px);width:max-content;color:var(--gold);font-size:11px;background:var(--bg);border:1px solid var(--line);padding:10px 14px;border-radius:3px;z-index:3}#toast{position:absolute;top:26px;left:50%;transform:translateX(-50%);color:var(--text);background:var(--bg);max-width:calc(100% - 40px);font-size:11px;text-align:center;pointer-events:none}#toast:not(:empty){border:1px solid var(--line);padding:11px 16px;border-radius:3px}
dialog{width:360px;max-width:calc(100vw - 40px);padding:32px;background:var(--bg);color:var(--text);border:1px solid var(--line);border-radius:6px}dialog::backdrop{background:oklch(10% .01 250 / .92)}#closeHelp{position:absolute;top:12px;right:12px;font-size:22px}dialog h2{font-size:19px;font-weight:500;letter-spacing:-.4px;margin:0 0 28px}.controls,.rules-key{margin:0;padding:0}.controls>div,.rules-key>div{display:flex;justify-content:space-between;gap:16px;margin:18px 0;font-size:11px}.controls dt,.rules-key dt{color:var(--muted)}.controls dd,.rules-key dd{margin:0;text-align:right}.rules-key{border-top:1px solid var(--line);margin-top:24px;padding-top:8px}.rules-key dt{display:flex;align-items:center;gap:8px}.food-dot,.gold-dot{width:4px;height:4px;border-radius:50%;background:var(--muted)}.gold-dot{width:7px;height:7px;background:var(--gold)}dialog p{color:var(--muted);font-size:10px;line-height:1.7;margin:18px 0 0}dialog .help-demo{border-top:1px solid var(--line);padding-top:18px;font-size:9px;color:var(--subtle)}
@media(max-width:700px){header{height:64px;padding:0 18px;gap:14px}.brand svg{width:88px;height:28px}.wallet{gap:8px}.wallet strong{font-size:12px;min-width:58px}.demo-pill{font-size:8px;letter-spacing:1px}.wallet .icon-button{display:grid}nav{padding-left:10px;gap:0}.icon-button{width:40px;height:40px;padding:10px}main{height:calc(100dvh - 64px);min-height:460px}.lobby{padding-bottom:68px}.menu{width:280px}.menu-logo{margin-bottom:36px}.arena-top{left:18px;right:18px;bottom:17px;font-size:9px}.leaderboard{right:18px;top:22px;width:136px}.leader{gap:6px;font-size:9px;margin:11px 0}.leader strong{font-size:9px}.leader .rank{width:12px}.board-title{font-size:8px;margin-bottom:16px}.board-foot,.board-loot{font-size:8px}.board-foot{padding-top:10px;margin-top:14px}.hud{bottom:52px;width:calc(100% - 36px);max-width:420px;padding:14px;gap:20px;justify-content:space-between}.hud strong{font-size:20px}.hud>div>span{font-size:7px;letter-spacing:1.2px}.kills-stat{min-width:24px}.extract-wrap{width:144px}#extract{height:38px;font-size:9px;gap:12px}.minimap{right:16px;bottom:178px}#map{width:70px;height:70px}.boost-indicator{left:20px;bottom:185px;font-size:7px}.boundary-warning{top:22px;left:18px;transform:none;flex-direction:column;align-items:flex-start;gap:6px;padding:9px;max-width:140px}.boundary-warning strong{font-size:7px}.boundary-warning small{font-size:9px}.result h2{font-size:42px}}
@media(max-width:380px){header{padding:0 12px;gap:10px}.brand svg{width:76px}.wallet{gap:6px}nav{padding-left:6px}.hud{gap:12px;padding:12px}.extract-wrap{width:130px}.hud strong{font-size:18px}.kills-stat{min-width:20px}}
@media(max-height:620px) and (min-width:701px){header{height:60px}main{height:calc(100dvh - 60px);min-height:400px}.lobby{padding:24px 24px 52px}.menu{width:280px}.menu-logo{width:230px;margin:0 auto 20px}.entry input{margin-bottom:18px;height:36px}.stakes{margin-bottom:18px}.stakes button{height:38px}.primary{height:42px}.hud{bottom:46px}.arena-top{bottom:14px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important}}
@media(max-width:380px){.brand svg{width:68px}.wallet strong{min-width:52px;font-size:11px}.wallet .icon-button{width:24px;height:24px}nav .icon-button{width:36px}}
body[data-view="play"] main{min-height:0}
@media(max-height:480px) and (min-width:480px){header{height:52px;padding:0 20px}main{height:calc(100dvh - 52px);min-height:0}.lobby{padding:20px 32px}.menu{width:600px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:36px}.menu-logo{width:100%;margin:0}.entry input{height:32px;margin:4px 0 14px}.stakes{margin:8px 0 14px}.stakes button{height:38px}.primary{height:42px}.hud{bottom:34px;padding:10px 16px;gap:24px}.hud strong{font-size:18px}.hud>div>span{margin-bottom:5px}#extract{height:32px}.progress{height:4px;margin-top:6px}.extract-wrap small{font-size:8px;margin-top:5px}.arena-top{bottom:10px}.leaderboard{display:none}.minimap{bottom:42px}#map{width:64px;height:64px}.boost-indicator{bottom:45px}.boundary-warning{top:16px}.result h2{font-size:36px;margin:12px 0}.result p{margin-bottom:20px}}
.lobby{grid-template-columns:minmax(0,1fr)}
