:root{color-scheme:dark;font-family:system-ui,sans-serif;color:#ecf9e9;background:#091822}*{box-sizing:border-box}body{margin:0}main{max-width:1050px;margin:auto;padding:24px}header{display:flex;justify-content:space-between;gap:16px;align-items:center;font-size:11px;letter-spacing:2px;color:#82a6a3}a{color:#b7ef8c;letter-spacing:0;font-size:15px}h1{font-size:clamp(36px,6vw,64px);letter-spacing:-2px;margin:28px 0 8px}em{font-style:normal;color:#b7ef8c}p{color:#a8c3c4;line-height:1.6}button{font:inherit;font-weight:700;border:1px solid #53716b;border-radius:12px;background:#193535;color:#ecf9e9;padding:12px 18px;cursor:pointer;touch-action:none}button:hover{background:#28504a}button:disabled{opacity:.5;cursor:default}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:3px solid #e8dc75;outline-offset:3px}nav{display:flex;gap:10px;flex-wrap:wrap;margin:24px 0}nav button[aria-current="true"]{border-color:#b7ef8c;background:#284934}.hud{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;font-size:14px}.arena{position:relative;overflow:hidden;border:2px solid #557c69;border-radius:20px;background:#102330;box-shadow:0 15px 65px #0005}canvas{display:block;width:100%;touch-action:none}#panel{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:#091822dd;padding:20px}#panel[hidden]{display:none}#panel h2{font-size:clamp(24px,4vw,42px);margin:0}#start{background:#b7ef8c;color:#142d22;border:0;min-width:200px}.hint{font-size:13px}.touch{display:flex;gap:8px;justify-content:center}.touch button{min-width:48px;min-height:48px;user-select:none}@media(max-width:600px){main{padding:12px}header span{display:none}.hud{font-size:12px}button{padding:10px}#panel p{font-size:13px;margin:8px 0}h1{margin-top:20px}}
