*{margin:0;padding:0;box-sizing:border-box}html,body,#root{width:100%;height:100%;background:#04050a;overflow:hidden;font-family:Courier New,monospace;-webkit-user-select:none;user-select:none;touch-action:none}#root{display:flex;align-items:center;justify-content:center}.stage{position:relative;width:min(100vw,calc(100vh * 5 / 3));aspect-ratio:5 / 3}canvas{width:100%;height:100%;display:block;image-rendering:pixelated;image-rendering:crisp-edges;background:#04050a}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#cfe0f0;gap:14px;padding:16px;z-index:5}.overlay.title{background:radial-gradient(ellipse at center,#0b1228,#04050a 75%)}.overlay.dim{background:#02030ad1}.overlay h1{font-size:clamp(40px,9vw,84px);letter-spacing:.35em;color:#3ec9a7;text-shadow:0 0 18px rgba(62,201,167,.5),3px 3px 0 #0a2a22}.overlay h2{font-size:clamp(20px,4vw,34px);letter-spacing:.25em;color:#9ef7ff}.overlay h2.danger{color:#ff5a4a;text-shadow:0 0 14px rgba(255,90,74,.5)}.subtitle{letter-spacing:.4em;color:#8a93a6;font-size:clamp(9px,1.6vw,13px)}.story{color:#8fa0b8;font-size:clamp(10px,1.7vw,14px);line-height:1.7}.stats{color:#ffe96b;font-size:clamp(10px,1.7vw,14px);letter-spacing:.15em}.controls{color:#5e6678;font-size:clamp(8px,1.3vw,11px);line-height:1.8}.buttons{display:flex;flex-direction:column;gap:10px}button{font-family:inherit;font-size:clamp(12px,2vw,16px);letter-spacing:.2em;padding:10px 26px;background:#3ec9a714;color:#3ec9a7;border:1px solid #2a6e5c;cursor:pointer}button:hover,button:active{background:#3ec9a740;color:#d8fff4;border-color:#3ec9a7}.touch-layer{position:absolute;top:0;right:0;bottom:0;left:0;z-index:4;pointer-events:none}.touch-layer>*{pointer-events:auto}.stick{position:absolute;left:4%;bottom:7%;width:110px;height:110px;border-radius:50%;background:#8caac81a;border:2px solid rgba(140,170,200,.25)}.knob{position:absolute;left:50%;top:50%;width:44px;height:44px;margin:-22px 0 0 -22px;border-radius:50%;background:#3ec9a74d;border:2px solid rgba(62,201,167,.55)}.cluster{position:absolute;right:3%;bottom:5%;display:grid;grid-template-columns:repeat(2,auto);gap:10px;align-items:center;justify-items:center}.tbtn{display:flex;align-items:center;justify-content:center;border-radius:50%;color:#dcf0ffd9;background:#8caac81f;border:2px solid rgba(140,170,200,.3);font-size:11px;letter-spacing:.05em}.tbtn:active{background:#3ec9a759}.tbtn.big{width:64px;height:64px}.tbtn.small{width:48px;height:48px;font-size:9px}.tbtn.tiny{width:40px;height:40px;font-size:9px;border-radius:8px}.topbar{position:absolute;top:4%;right:3%;display:flex;gap:8px}.rotate-hint{display:none}@media (orientation: portrait) and (pointer: coarse){.rotate-hint{display:flex;flex-direction:column;align-items:center;justify-content:center;position:fixed;top:0;right:0;bottom:0;left:0;background:#02030af2;color:#3ec9a7;font-size:18px;letter-spacing:.3em;text-align:center;z-index:50;line-height:2.2}.rotate-hint span{color:#5e6678;font-size:11px;letter-spacing:.15em}}