html,body,#root{background:#000;width:100%;height:100%;margin:0;overflow:hidden}@supports (height:100dvh){#root{height:100dvh}}#root{font-family:Trebuchet MS,Segoe UI,system-ui,sans-serif}.sprite,.btn,.btn-round{background-image:url(/assets/spritesheet/ui_sheet.png);background-repeat:no-repeat;background-size:calc(var(--s,1) * 1024px) calc(var(--s,1) * 1024px)}.sprite{flex:none;display:inline-block}.f-panel{width:calc(var(--s,1) * 384px);height:calc(var(--s,1) * 480px);background-position:calc(var(--s,1) * -4px) calc(var(--s,1) * -4px)}.f-title{width:calc(var(--s,1) * 384px);height:calc(var(--s,1) * 128px);background-position:calc(var(--s,1) * -396px) calc(var(--s,1) * -4px)}.f-counter{width:calc(var(--s,1) * 160px);height:calc(var(--s,1) * 56px);background-position:calc(var(--s,1) * -4px) calc(var(--s,1) * -684px)}.f-health-frame{width:calc(var(--s,1) * 256px);height:calc(var(--s,1) * 48px);background-position:calc(var(--s,1) * -4px) calc(var(--s,1) * -748px)}.f-health-green{width:calc(var(--s,1) * 256px);height:calc(var(--s,1) * 48px);background-position:calc(var(--s,1) * -436px) calc(var(--s,1) * -684px)}.f-health-amber{width:calc(var(--s,1) * 256px);height:calc(var(--s,1) * 48px);background-position:calc(var(--s,1) * -172px) calc(var(--s,1) * -684px)}.f-health-red{width:calc(var(--s,1) * 256px);height:calc(var(--s,1) * 48px);background-position:calc(var(--s,1) * -700px) calc(var(--s,1) * -684px)}.f-icon-score,.f-icon-time,.f-icon-pause,.f-icon-minus,.f-icon-plus,.f-icon-forward,.f-icon-fire-front,.f-icon-fire-left,.f-icon-fire-right,.f-icon-turn-left,.f-icon-turn-right{width:calc(var(--s,1) * 48px);height:calc(var(--s,1) * 48px)}.f-icon-score{background-position:calc(var(--s,1) * -940px) calc(var(--s,1) * -748px)}.f-icon-time{background-position:calc(var(--s,1) * -60px) calc(var(--s,1) * -804px)}.f-icon-pause{background-position:calc(var(--s,1) * -716px) calc(var(--s,1) * -748px)}.f-icon-minus{background-position:calc(var(--s,1) * -660px) calc(var(--s,1) * -748px)}.f-icon-plus{background-position:calc(var(--s,1) * -828px) calc(var(--s,1) * -748px)}.f-icon-forward{background-position:calc(var(--s,1) * -492px) calc(var(--s,1) * -748px)}.f-icon-fire-front{background-position:calc(var(--s,1) * -324px) calc(var(--s,1) * -748px)}.f-icon-fire-left{background-position:calc(var(--s,1) * -380px) calc(var(--s,1) * -748px)}.f-icon-fire-right{background-position:calc(var(--s,1) * -436px) calc(var(--s,1) * -748px)}.f-icon-turn-left{background-position:calc(var(--s,1) * -116px) calc(var(--s,1) * -804px)}.f-icon-turn-right{background-position:calc(var(--s,1) * -172px) calc(var(--s,1) * -804px)}.scale-lg{--s:.9}.scale-md{--s:.7}.btn{--s:.8;box-sizing:border-box;width:calc(var(--s) * 256px);height:calc(var(--s) * 88px);padding:0 calc(var(--s) * 28px);font:inherit;font-size:calc(var(--s) * 28px);cursor:pointer;touch-action:manipulation;background-color:#0000;border:0;justify-content:center;align-items:center;font-weight:700;line-height:1;display:inline-flex}.btn-primary{background-position:calc(var(--s) * -532px) calc(var(--s) * -492px);color:#3a210d;text-shadow:0 1px #ffffff73}.btn-primary:hover:not(:disabled){background-position:calc(var(--s) * -268px) calc(var(--s) * -492px)}.btn-primary:active:not(:disabled){background-position:calc(var(--s) * -4px) calc(var(--s) * -588px)}.btn-primary:disabled{background-position:calc(var(--s) * -4px) calc(var(--s) * -492px);color:#5f564b;cursor:not-allowed}.btn-secondary{background-position:calc(var(--s) * -268px) calc(var(--s) * -588px);color:#f6e7c8}.btn-secondary:hover:not(:disabled){filter:brightness(1.25)}.btn-secondary:active:not(:disabled){background-position:calc(var(--s) * -532px) calc(var(--s) * -588px)}.btn-round{--s:.8;box-sizing:border-box;width:calc(var(--s) * 64px);height:calc(var(--s) * 64px);background-color:#0000;background-position:calc(var(--s) * -868px) calc(var(--s) * -588px);cursor:pointer;touch-action:manipulation;border:0;justify-content:center;align-items:center;padding:0;display:inline-flex}.btn-round:hover{background-position:calc(var(--s) * -796px) calc(var(--s) * -588px)}.btn-round:active{background-position:calc(var(--s) * -940px) calc(var(--s) * -588px)}.btn-round>.sprite{--s:.6}.btn:focus-visible,.btn-round:focus-visible,.scores [role=tab]:focus-visible,.scores button:focus-visible,.scores summary:focus-visible,.scores select:focus-visible{outline-offset:2px;outline:3px solid #fff;box-shadow:0 0 0 6px #0b1c2d}.scene{box-sizing:border-box;color:#f6e7c8;background:linear-gradient(#06162673,#06162699),url(/assets/ui_scene_background.png) 50%/cover no-repeat;flex-wrap:wrap;justify-content:center;align-items:center;gap:24px;height:100%;padding:16px;display:flex;overflow:auto}.menu-column{flex-direction:column;align-items:center;margin:auto 0;display:flex}.menu-title{margin:0;line-height:0}.card{box-sizing:border-box;padding:calc(var(--s) * 48px) calc(var(--s) * 40px) calc(var(--s) * 40px);text-align:center;color:#f6e7c8;flex-direction:column;align-items:center;gap:10px;display:flex}.card-title{font-size:calc(var(--s) * 34px);color:#ffd978;text-shadow:0 2px #6b3a12,0 0 8px #0009;margin:0}.card p{margin:0}.card ul{text-align:left;font-size:13px;line-height:1.5}.card h2{color:#ffd978}.card kbd{background:#223a57;border:1px solid #b9722f;border-radius:4px;padding:0 5px;font-family:ui-monospace,Consolas,monospace;font-size:12px}.result-score,.result-time{align-items:center;gap:8px;display:flex}.result-score{font-size:calc(var(--s) * 28px);color:#fff;font-weight:700}.result-time{font-size:calc(var(--s) * 20px)}.result-score>.sprite,.result-time>.sprite{--s:.6}.overlay{background:#0009;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.option-row{align-items:center;gap:8px;display:flex}.option-label{text-align:left;flex:1;font-size:16px}.option-value{color:#fff;min-width:52px;font-size:18px;font-weight:700}.scores{box-sizing:border-box;color:#f6e7c8;background:#14263d;border:5px solid #b9722f;border-radius:16px;width:min(100%,380px);max-height:100%;margin:auto 0;padding:14px 16px;overflow:auto;box-shadow:0 8px 24px #00000073,inset 0 0 0 2px #e0a25a}.scores [role=tablist]{gap:8px;margin-bottom:12px;display:flex}.scores [role=tab]{font:inherit;color:#f6e7c8;cursor:pointer;background:#223a57;border:2px solid #b9722f;border-radius:10px;flex:1;padding:8px 10px;font-weight:700}.scores [role=tab][aria-selected=true]{color:#2b1808;background:#e0a25a}.scores table{border-collapse:collapse;width:100%;margin-bottom:10px}.scores th{text-align:left;color:#ffd978;border-bottom:2px solid #b9722f;padding:4px 6px}.scores td{padding:4px 6px}.scores tbody tr:nth-child(2n){background:#ffffff0f}.scores nav{justify-content:center}.scores button:not([role=tab]){font:inherit;color:#2b1808;cursor:pointer;background:#e0a25a;border:2px solid #b9722f;border-radius:8px;padding:6px 12px;font-weight:700}.scores button:disabled{opacity:.5;cursor:not-allowed}.scores summary{cursor:pointer;margin-top:10px}.scores select{font:inherit}.hud{color:#fff;text-shadow:0 1px 3px #000c;pointer-events:none;justify-content:space-between;align-items:flex-start;gap:8px;padding:10px 14px;font-weight:700;display:flex;position:absolute;top:0;left:0;right:0}.hud-health{--s:.85;width:calc(var(--s) * 256px);height:calc(var(--s) * 48px);position:relative}.hud-health>.sprite{position:absolute;top:0;left:0}.hud-health-text{justify-content:center;align-items:center;font-size:13px;display:flex;position:absolute;inset:0}.hud-right{gap:8px;display:flex}.hud-counter{--s:.9;box-sizing:border-box;padding-left:calc(var(--s) * 14px);font-size:calc(var(--s) * 20px);align-items:center;gap:6px;display:flex}.hud-counter>.sprite{--s:.5}.touch-btn{--s:1.7;touch-action:none;-webkit-user-select:none;user-select:none}.touch-btn>.sprite{--s:1.36}.touch-pause{--s:1.3;position:absolute;top:60px;right:12px}@media (width<=900px){.touch-btn{--s:1.4}.touch-btn>.sprite{--s:1.12}.touch-pause{--s:1.1}}@media (width<=640px){.touch-btn{--s:1.2}.touch-btn>.sprite{--s:.96}.touch-pause{--s:1}}@media (height<=600px){.scale-lg{--s:.6}.scale-md,.btn{--s:.55}.scene{gap:12px;padding:8px}.card{gap:6px}.card ul{font-size:11px;line-height:1.35}.card h2{margin-bottom:4px!important;font-size:15px!important}}.result-card{padding-top:calc(var(--s) * 44px);padding-bottom:calc(var(--s) * 44px);gap:6px}.result-card .btn{--s:.62}.result-card [role=status],.result-alert p{font-size:13px;line-height:1.3}.result-alert{flex-direction:column;align-items:center;gap:6px;display:flex}@media (height<=600px){.result-card{padding-top:calc(var(--s) * 40px);padding-bottom:calc(var(--s) * 40px);gap:3px}.result-card .btn{--s:.42}.result-card [role=status],.result-alert p{font-size:11px;line-height:1.2}@media (pointer:coarse) and (height<=480px){.touch-btn{--s:1;opacity:.92}.touch-btn>.sprite{--s:.8}.touch-pause{--s:.85;top:46px;right:max(10px, env(safe-area-inset-right))}.hud{padding:6px max(10px, env(safe-area-inset-right)) 0 max(10px, env(safe-area-inset-left))}.hud-health{--s:.62}.hud-health-text{font-size:10px}.hud-counter{--s:.68}.hud-counter>.sprite{--s:.42}.hud-right{gap:6px}}@media (pointer:coarse) and (height<=360px){.touch-btn{--s:.85}.touch-btn>.sprite{--s:.68}.touch-pause{--s:.72;top:40px}.hud-health{--s:.52}.hud-counter{--s:.58}}}.name-input{box-sizing:border-box;width:100%;font:inherit;text-align:center;color:#f6e7c8;background:#061626a6;border:2px solid #6b3a12;border-radius:6px;outline:none;flex:none;padding:8px 10px;font-size:16px}.name-input::placeholder{color:#f6e7c880}.name-input:focus{border-color:#ffd978}.menu-card>.btn{flex:none}@media (height<=600px){.name-input{padding:3px 8px}}@media (pointer:coarse){.menu-card section[aria-labelledby=controls-title]{display:none}.menu-card{justify-content:center}}.last-match{text-align:center;color:#f6e7c8;margin:0 0 8px;font-size:14px}
