*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 15% 0,#26455d,transparent 60%),#101f32;color:#eff8f2;font-family:system-ui,sans-serif}header{display:flex;justify-content:space-between;padding:18px 5%;border-bottom:1px solid #99c6cc30}a{color:#b6d9d9;text-decoration:none}main{max-width:1100px;margin:auto;padding:25px 18px}.eyebrow{color:#f3c580;font-size:10px;letter-spacing:4px}h1{font-size:clamp(38px,6vw,65px);letter-spacing:-2px;margin:8px 0 20px}.hud{display:flex;justify-content:space-around;gap:9px;padding:16px 10px;background:#254457;border:1px solid #658e9d;border-bottom:0;border-radius:20px 20px 0 0;font-size:10px;letter-spacing:1px;color:#a7c7d3}.hud b{display:block;color:#ffdd9e;font-size:23px;letter-spacing:0;margin-top:4px}#lives{color:#f59b9d}.stage{position:relative;overflow:hidden;border:1px solid #658e9d;border-radius:0 0 22px 22px;box-shadow:0 12px 0 #0a1524,0 30px 50px #0004}canvas{display:block;width:100%;aspect-ratio:16/10;touch-action:none}.overlay{position:absolute;inset:0;display:grid;place-items:center;text-align:center;background:#102a40ec;padding:24px}.overlay[hidden]{display:none}.overlay img{width:160px;border-radius:28px;box-shadow:0 10px 0 #091d2e}.overlay h2{font-size:28px;margin:20px 0 9px}.overlay p{max-width:430px;color:#b6d3de;line-height:1.7}.start{background:linear-gradient(#ffe0a1,#e5ab67);border:0;border-radius:12px;padding:16px 32px;box-shadow:0 5px 0 #92683f;color:#44311b;font-weight:850;cursor:pointer}.toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:26px}.toolbar p{font-size:13px;color:#b1d6d8;min-height:22px;margin:0}.toolbar div{display:flex;gap:8px}.toolbar button{padding:10px 15px;border:1px solid #7fa9b3;background:#254457;color:#e3f0ed;border-radius:9px;cursor:pointer}.controls{display:flex;gap:12px;justify-content:center;margin-top:18px}.controls button{min-width:90px;height:63px;flex:1;max-width:160px;background:linear-gradient(#426c7d,#2a4c60);border:1px solid #8db8bd;box-shadow:0 5px 0 #081724;border-radius:13px;color:#f6f7e9;font-size:13px;font-weight:800;touch-action:manipulation;cursor:pointer;user-select:none}.controls button:nth-child(2){background:linear-gradient(#6abfae,#388e87)}.controls button:nth-child(3){background:linear-gradient(#ab9cce,#71689b)}.controls button:active{transform:translateY(3px);box-shadow:0 2px 0 #081724}.help{font-size:12px;color:#93b4c4;line-height:1.8;margin-top:25px}@media(max-width:620px){main{padding:20px 10px}.hud{padding:12px 6px;font-size:8px}.hud b{font-size:16px}canvas{aspect-ratio:4/5}.overlay img{width:125px}.overlay h2{font-size:25px}.overlay p{font-size:13px}.toolbar{flex-direction:column;align-items:flex-start}.controls{gap:7px}.controls button{min-width:0;height:58px;font-size:11px}.toolbar button{font-size:12px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}