:root{color-scheme:dark;--ink:#edf1df;--muted:#a6b4a1;--lime:#c8f07b;--line:#38483c;--dark:#0b110f;--orange:#f4a867}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--dark);font-family:Arial,Helvetica,sans-serif;color:var(--ink)}body{display:grid;place-items:center;min-height:100dvh;background:radial-gradient(ellipse at 50% 5%,#27382b 0,transparent 65%),#0b110f}button,a,input{touch-action:manipulation}button{font:700 12px/1.2 ui-monospace,monospace;letter-spacing:.07em;color:var(--ink);background:#202e24;border:1px solid #53674e;padding:13px 18px;cursor:pointer;min-height:44px;transition:background .12s,border-color .12s}button:hover,button:focus-visible{background:#364932;border-color:var(--lime);outline:2px solid var(--lime);outline-offset:3px}button:active{transform:translateY(1px)}button.primary{color:#132216;background:var(--lime);border-color:var(--lime)}button.active{border-color:var(--lime);background:#3e5631}a{color:var(--muted);font:11px ui-monospace,monospace;letter-spacing:.12em;text-decoration:none}a:hover{color:var(--lime)}#shell{width:min(1120px,100%);padding:24px}header{height:54px;display:flex;align-items:center;justify-content:space-between;gap:15px}.brand{font:900 13px ui-monospace,monospace;letter-spacing:.18em}.brand b{font-weight:400;color:var(--muted)}.tools{display:flex;gap:6px}.tools button{font-size:10px;padding:9px 12px;min-height:36px}#stage{position:relative;aspect-ratio:8/5;isolation:isolate;box-shadow:0 18px 70px #0008;border:1px solid #526448;background:#15221a;overflow:hidden}canvas{display:block;width:100%;height:100%;image-rendering:pixelated;touch-action:none;outline:none}#hud{position:absolute;inset:0 0 auto;pointer-events:none;background:linear-gradient(#09110ff2,#09110fd0,transparent);padding:12px 18px 20px;font:12px ui-monospace,monospace}#hud[hidden]{display:none}#status{display:flex;justify-content:space-between;gap:10px;color:var(--lime);font-weight:bold;letter-spacing:.1em}#players{display:flex;justify-content:space-between;gap:16px;margin-top:9px}.player-hud{display:flex;align-items:center;gap:9px;color:#dce2d6;flex-wrap:wrap}.hp{display:inline-block;background:#202921;width:76px;height:5px;vertical-align:middle}.hp i{display:block;background:var(--lime);height:100%}.player-hud.p2 .hp i{background:var(--orange)}#panel{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:26px;overflow:auto;background:linear-gradient(100deg,#0b120ff2 5%,#0b120fd9 60%,#0b120f88)}#panel[hidden]{display:none}.eyebrow{color:var(--lime);font:11px ui-monospace,monospace;letter-spacing:.32em;margin:0 0 13px}h1{font-size:clamp(28px,5.4vw,64px);font-weight:950;letter-spacing:-.055em;line-height:.95;margin:4px 0 16px;text-align:center;text-shadow:4px 4px #0b110f}h1 em{font-style:normal;color:var(--lime)}h2{font-size:30px;letter-spacing:-.02em;margin:0 0 14px}p{color:var(--muted);font-size:14px;line-height:1.55;max-width:550px;text-align:center;margin:5px 0 18px}.choices{display:flex;gap:10px;justify-content:center;width:100%;max-width:730px}.choices>button{flex:1;max-width:240px;text-align:left;padding:18px}.choices b{display:block;font-size:15px;letter-spacing:0;margin-bottom:10px}.choices small{display:block;font:11px/1.5 Arial,sans-serif;letter-spacing:0;color:var(--muted)}.mode-no{font:10px ui-monospace,monospace;color:var(--lime);display:block;margin-bottom:15px}.menu-bottom{display:flex;gap:9px;justify-content:center;align-items:center;margin-top:20px}.stats{display:flex;gap:35px;margin:5px 0 22px;text-align:center}.stats strong{display:block;font-size:30px;color:var(--lime)}.stats span{font:10px ui-monospace,monospace;color:var(--muted)}.controls{font:11px/1.6 ui-monospace,monospace;color:var(--muted);text-align:center;margin-top:16px;max-width:650px}.room-map{display:block;width:120px;height:65px;margin:0 auto 13px;border:1px solid #50684a;background:#17271c}.room-map rect{fill:#577049}.room-map circle{fill:#d8e6ad}#toast{position:absolute;left:50%;top:20%;transform:translateX(-50%);text-align:center;color:var(--lime);font:700 14px ui-monospace,monospace;letter-spacing:.14em;pointer-events:none;text-shadow:0 2px 3px #000;white-space:pre-line;line-height:1.6;max-width:90%;z-index:2}footer{display:flex;justify-content:space-between;padding:14px 2px;font:10px/1.5 ui-monospace,monospace;color:var(--muted);gap:15px}.edition{letter-spacing:.12em;white-space:nowrap}.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px 30px;width:min(540px,100%);font-size:13px}.settings-grid label{display:flex;gap:12px;align-items:center;justify-content:space-between}.settings-grid input[type=range]{width:110px;accent-color:var(--lime)}.keys{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;max-width:540px;width:100%}.keys button{padding:8px;font-size:10px;min-height:34px;text-align:left}.keys-title{margin:15px 0 8px;font:11px ui-monospace,monospace;color:var(--lime)}#touch{height:130px;display:flex;position:relative;gap:20px;user-select:none}#touch[hidden]{display:none}.touch-half{position:relative;flex:1;display:flex;justify-content:space-around;align-items:center;gap:12px}.touch-half[hidden]{display:none}.stick{width:105px;height:105px;border:1px solid #688353;border-radius:50%;position:relative;touch-action:none;background:radial-gradient(#263d2b,#17251c);flex-shrink:0}.stick span{width:39px;height:39px;position:absolute;left:32px;top:32px;border-radius:50%;background:#76995988;border:1px solid #accb8f;pointer-events:none}.stick b{position:absolute;bottom:9px;text-align:center;width:100%;font:9px ui-monospace,monospace;color:var(--muted);pointer-events:none}.fire{border-radius:50%;width:77px;height:77px;background:#3c5430;border:2px solid #a8d878;touch-action:none}.touch-half[data-player="1"] .fire{border-color:var(--orange);background:#493323}.cycle{position:absolute;bottom:4px;left:50%;transform:translateX(-50%);min-height:26px;font-size:9px;padding:5px 10px}#pause:disabled{opacity:.4;cursor:default}.best{margin-top:18px;font:11px ui-monospace,monospace;color:var(--muted)}@media(max-width:700px){#shell{padding:8px}header{height:46px;gap:7px}.brand{font-size:9px;letter-spacing:.04em}.brand b{display:none}.tools button{padding:6px;min-height:34px;font-size:9px}a{font-size:9px}.edition{display:none}footer{font-size:9px}.choices{gap:6px}.choices>button{padding:10px;min-height:100px}.choices b{font-size:12px}.choices small{font-size:10px}.mode-no{margin-bottom:8px}#panel{padding:14px}h2{font-size:23px}p{font-size:11px;margin-bottom:10px}.eyebrow{font-size:9px;margin-bottom:8px;letter-spacing:.2em}.controls{font-size:9px;margin-top:8px}.menu-bottom{margin-top:10px}#hud{padding:6px 8px 12px;font-size:9px}#players{margin-top:6px;gap:5px}.hp{width:38px}.player-hud{gap:5px}#toast{font-size:10px}.room-map{width:85px;height:47px;margin-bottom:7px}.settings-grid{font-size:11px;gap:8px}.settings-grid input[type=range]{width:75px}.keys{gap:4px}.keys button{min-height:26px;padding:5px;font-size:9px}.keys-title{margin:7px 0 4px}.stats strong{font-size:24px}.best{font-size:9px;margin-top:10px}}@media(max-width:470px){#stage{aspect-ratio:8/6}canvas{object-fit:contain}.choices small{display:none}.choices>button{min-height:72px}.room-map{width:68px;height:42px}.controls{max-width:300px}.brand{display:none}#touch{gap:5px}.touch-half{gap:6px}.touch-half .stick{width:85px;height:85px}.stick span{left:22px;top:22px}.fire{width:62px;height:62px}.settings-grid{grid-template-columns:1fr}.keys button{font-size:8px}}@media(prefers-reduced-motion:reduce){button{transition:none}}

button,.stick{-webkit-tap-highlight-color:transparent}@media(max-width:470px){#stage:has(#panel:not([hidden])){min-height:340px}#stage:has(#panel[data-state="settings"]){min-height:445px}#panel[data-state="settings"]{justify-content:flex-start;padding-top:20px}}
#shell,#stage{min-width:0}#stage{width:100%}.keys{grid-template-columns:repeat(2,minmax(0,1fr))}.keys button{min-width:0}