:root{--amber:#ffc233;--amber-dim:#c08c1b;--ink:#10151c;--panel:#0e141c9e;--stroke:#ffffff29;--safe-t:env(safe-area-inset-top,0px);--safe-b:env(safe-area-inset-bottom,0px);--safe-l:env(safe-area-inset-left,0px);--safe-r:env(safe-area-inset-right,0px)}*{box-sizing:border-box;margin:0;padding:0}html,body{overscroll-behavior:none;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;color:#eef3f8;background:#0b1016;width:100%;height:100%;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;overflow:hidden}body{position:fixed;top:0;bottom:0;left:0;right:0}#scene{touch-action:none;width:100%;height:100%;display:block;position:absolute;top:0;bottom:0;left:0;right:0}.hidden{display:none!important}#hud{pointer-events:none;z-index:10;position:absolute;top:0;bottom:0;left:0;right:0}#panel-top{top:calc(10px + var(--safe-t));left:calc(10px + var(--safe-l));background:var(--panel);border:1px solid var(--stroke);-webkit-backdrop-filter:blur(8px);border-radius:12px;flex-direction:column;gap:6px;padding:9px 11px;display:flex;position:absolute}.gauge{align-items:center;gap:8px;display:flex}.gauge-label{letter-spacing:.14em;opacity:.72;width:44px;font-size:9px;font-weight:700}.bar{background:#ffffff24;border-radius:5px;width:108px;height:9px;overflow:hidden}.bar i{background:linear-gradient(90deg, #b57a2a, var(--amber));border-radius:5px;width:0%;height:100%;transition:width 90ms linear;display:block}.bar.truck i{background:linear-gradient(90deg,#2f7d5a,#58d39a)}#score{letter-spacing:.14em;opacity:.8;font-size:10px;font-weight:700}#score b{color:var(--amber);font-size:13px}#panel-buttons{top:calc(10px + var(--safe-t));right:calc(10px + var(--safe-r));pointer-events:auto;flex-direction:column;gap:8px;display:flex;position:absolute}.icon-btn{border:1px solid var(--stroke);background:var(--panel);-webkit-backdrop-filter:blur(8px);color:#eef3f8;width:50px;height:50px;font:inherit;cursor:pointer;border-radius:13px;flex-direction:column;justify-content:center;align-items:center;gap:1px;display:flex}.icon-btn:active{background:#ffc23347}.icon-btn.off{opacity:.45}.icon-btn svg{fill:none;stroke:currentColor;stroke-width:1.7px;stroke-linecap:round;stroke-linejoin:round;width:21px;height:21px}.icon-btn span{letter-spacing:.08em;opacity:.85;font-size:8px;font-weight:800}.icon-btn.off #wave{display:none}#objective{top:calc(10px + var(--safe-t));background:var(--panel);border:1px solid var(--stroke);letter-spacing:.03em;white-space:nowrap;opacity:.9;-webkit-backdrop-filter:blur(8px);border-radius:999px;padding:7px 14px;font-size:11px;position:absolute;left:50%;transform:translate(-50%)}#toast{color:#1a1206;letter-spacing:.06em;opacity:0;white-space:nowrap;background:#ffc233f0;border-radius:14px;padding:12px 22px;font-size:15px;font-weight:800;transition:opacity .25s,transform .25s;position:absolute;top:38%;left:50%;transform:translate(-50%,-50%)scale(.9)}#toast.show{opacity:1;transform:translate(-50%,-50%)scale(1)}#touch{pointer-events:none;position:absolute;top:0;bottom:0;left:0;right:0}.pad{bottom:calc(12px + var(--safe-b));pointer-events:auto;touch-action:none;justify-content:center;align-items:center;width:148px;height:148px;display:flex;position:absolute}#pad-l{left:calc(10px + var(--safe-l))}#pad-r{right:calc(10px + var(--safe-r))}.ring{-webkit-backdrop-filter:blur(4px);background:radial-gradient(circle,#0c121a80,#0c121a42);border:2px solid #ffffff42;border-radius:50%;width:122px;height:122px;position:relative}.pad.active .ring{border-color:#ffc233bf}.knob{will-change:transform;background:#ffffffd1;border-radius:50%;width:54px;height:54px;margin:-27px 0 0 -27px;position:absolute;top:50%;left:50%;box-shadow:0 3px 10px #0006}.pad.active .knob{background:var(--amber)}.pad-label{text-align:center;letter-spacing:.1em;text-transform:uppercase;opacity:.7;pointer-events:none;font-size:9px;font-weight:700;position:absolute;bottom:-2px;left:0;right:0}#mode-switch{z-index:2;bottom:calc(20px + var(--safe-b));background:var(--panel);border:1px solid var(--stroke);pointer-events:auto;-webkit-backdrop-filter:blur(8px);border-radius:999px;gap:4px;padding:4px;display:flex;position:absolute;left:50%;transform:translate(-50%)}#mode-switch button{color:#eef3f8;font:inherit;letter-spacing:.12em;cursor:pointer;opacity:.6;background:0 0;border:0;border-radius:999px;padding:9px 18px;font-size:11px;font-weight:800}#mode-switch button.active{background:var(--amber);color:#1a1206;opacity:1}#start,#help{z-index:30;padding:calc(18px + var(--safe-t)) 18px calc(18px + var(--safe-b));background:radial-gradient(circle at 50% 40%,#23303e,#0b1016 75%);justify-content:center;align-items:center;display:flex;position:absolute;top:0;bottom:0;left:0;right:0;overflow:auto}#help{-webkit-backdrop-filter:blur(10px);background:#080c11db}.card{text-align:center;border:1px solid var(--stroke);background:#121922c7;border-radius:20px;width:min(560px,100%);padding:24px 20px}#start h1{letter-spacing:.04em;color:var(--amber);font-size:clamp(26px,8vw,44px);font-weight:900;line-height:1}#start h1 span{letter-spacing:.3em;color:#eef3f8;margin-top:6px;font-size:.52em;display:block}.tag{opacity:.75;margin:14px 0 20px;font-size:13px}#btn-start,#btn-close-help{background:var(--amber);color:#1a1206;font:inherit;letter-spacing:.14em;cursor:pointer;border:0;border-radius:999px;padding:15px 34px;font-size:14px;font-weight:900}#btn-start:active,#btn-close-help:active{background:var(--amber-dim)}.hint{opacity:.55;margin-top:18px;font-size:11px;line-height:1.6}#help h2{letter-spacing:.14em;color:var(--amber);margin-bottom:16px;font-size:18px}#help h3{letter-spacing:.18em;opacity:.6;margin-bottom:8px;font-size:10px}.cols{text-align:left;grid-template-columns:1fr;gap:18px;display:grid}@media (min-width:520px){.cols{grid-template-columns:1fr 1fr}}#help ul{flex-direction:column;gap:7px;list-style:none;display:flex}#help li{opacity:.88;font-size:12px;line-height:1.5}kbd{border:1px solid var(--stroke);min-width:20px;font:inherit;text-align:center;background:#ffffff17;border-radius:5px;margin-right:2px;padding:1px 5px;font-size:11px;display:inline-block}.tip{opacity:.7;margin:18px 0;font-size:12px}.chk{opacity:.8;margin-bottom:18px;font-size:12px;display:block}.chk input{margin-right:6px}@media (max-width:700px){#objective{display:none}}@media (max-width:560px) and (orientation:portrait){#mode-switch{bottom:calc(180px + var(--safe-b))}}@media (max-height:460px){.pad{width:122px;height:122px}.ring{width:104px;height:104px}.knob{width:46px;height:46px;margin:-23px 0 0 -23px}#objective{display:none}#mode-switch button{padding:7px 14px}}
