*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;font-family:Avenir Next,Segoe UI,system-ui,sans-serif;background:#0a1016}#stage{position:relative;width:100vw;height:100vh;height:100dvh;overflow:hidden}canvas{position:absolute;inset:0;display:block}#ui{position:absolute;inset:0;pointer-events:none}#ui>*{pointer-events:auto}.panel{position:absolute;top:50%;left:28px;transform:translateY(-50%);width:min(340px,calc(100vw - 32px));max-height:calc(100vh - 32px);overflow-y:auto;background:#0d2a35d1;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(190,231,222,.18);border-radius:18px;padding:26px 28px;color:#eaf6f2;box-shadow:0 18px 50px #04121873}.panel h1{margin:0;font-size:26px;letter-spacing:.04em;font-weight:700}.panel h2{margin:0 0 10px;font-size:20px;font-weight:600}.tagline{margin:2px 0 18px;font-size:13px;color:#9cc9bd}.id-row{display:flex;align-items:baseline;gap:10px;margin-bottom:14px}.id-label{font-size:12px;color:#9cc9bd}.id-value{font-family:ui-monospace,Menlo,monospace;font-size:18px;letter-spacing:.18em;color:#ffd98a}.field{display:block;margin-bottom:13px;font-size:13px;color:#c4e2d8}.field>span{display:block;margin-bottom:5px}.field em{color:#86a89e;font-style:normal;font-size:12px}.field input[type=text]{width:100%;padding:8px 10px;border-radius:9px;border:1px solid rgba(190,231,222,.25);background:#091c2499;color:#eaf6f2;font-size:14px;outline:none}.field input[type=text]:focus{border-color:#58b7a4}.seg{display:flex;gap:6px}.seg button{flex:1;padding:7px 4px;font-size:13px;border-radius:9px;border:1px solid rgba(190,231,222,.22);background:#091c248c;color:#c4e2d8;cursor:pointer;transition:background .12s,color .12s}.seg button:hover:not(:disabled){background:#2e60688c}.seg button.active{background:#2e8f7f;border-color:#3fbfa9;color:#fff;font-weight:600}.seg button:disabled{opacity:.35;cursor:default}.run-info{font-size:12.5px;color:#9cc9bd;margin:4px 0 14px;min-height:16px}.run-info.warn{color:#ffb98a}button.primary{width:100%;padding:12px;font-size:15px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;border:none;border-radius:11px;background:linear-gradient(180deg,#3fbfa9,#2e8f7f);color:#08251f;cursor:pointer}button.primary:hover:not(:disabled){filter:brightness(1.08)}button.primary:disabled{opacity:.4;cursor:default}#past-runs-wrap{margin-top:16px;font-size:12.5px;color:#9cc9bd}#past-runs-wrap summary{cursor:pointer}#past-runs{list-style:none;margin:8px 0 0;padding:0;max-height:130px;overflow-y:auto}#past-runs li{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:4px 0;border-bottom:1px solid rgba(190,231,222,.08)}#past-runs .run-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:ui-monospace,Menlo,monospace;font-size:11px}#past-runs button{flex-shrink:0;font-size:11px;padding:3px 8px;border-radius:6px;border:1px solid rgba(190,231,222,.25);background:transparent;color:#9fe8d8;cursor:pointer}.overlay{position:absolute;left:50%;top:2%;transform:translate(-50%);width:100%;text-align:center;color:#d7efe8;pointer-events:none}.overlay h2{margin:0;font-size:clamp(20px,3.5vw,30px);font-weight:800;letter-spacing:.22em;text-transform:uppercase;color:#bfe9de;text-shadow:0 2px 14px rgba(4,12,16,.9)}.hint{margin:6px 0 0;font-size:13px;color:#8fb8ac}.hint.dim{color:#6d8d84;font-size:11.5px}#countdown{top:34%}#countdown-num{font-size:clamp(70px,14vw,130px);font-weight:800;color:#cfeee6;text-shadow:0 4px 26px rgba(63,191,169,.4)}#hud{position:absolute;top:14px;right:18px;display:flex;flex-direction:column;align-items:flex-end;gap:2px;pointer-events:none}#hud-score{font-size:30px;font-weight:800;color:#e6f7f1;text-shadow:0 2px 12px rgba(4,12,16,.85)}#hud-progress{font-size:12.5px;color:#86aca2;font-family:ui-monospace,Menlo,monospace}.big-score{font-size:44px;font-weight:800;margin:6px 0;color:#ffd98a}.row{display:flex;gap:10px;margin-top:16px}.row button{flex:1;padding:10px;border-radius:10px;border:1px solid rgba(190,231,222,.25);background:#091c248c;color:#c4e2d8;cursor:pointer;font-size:13px}.row button.primary{width:auto;padding:10px;font-size:13px}.restart-hint{margin-top:14px;text-align:center}#touch-buttons{position:absolute;inset:55% 0 0;display:flex;flex-direction:column;gap:10px;padding:12px 14px calc(14px + env(safe-area-inset-bottom));touch-action:none}#touch-buttons .touch-row{flex:1;display:flex;gap:10px;min-height:0}#touch-buttons button{flex:1;min-height:64px;border-radius:16px;border:3px solid var(--finger-color, #3fbfa9);background:#0d2a358c;color:#eaf6f2;font-size:18px;font-weight:700;touch-action:none;-webkit-user-select:none;user-select:none}#touch-buttons .touch-thumb{flex:0 0 auto;width:100%;height:72px}#touch-buttons button.pressed{background:var(--finger-color, #3fbfa9)}.hidden{display:none!important}@media(max-width:700px){.panel{left:50%;transform:translate(-50%,-50%)}}