:root{color:#eef1ff;font-synthesis:none;text-rendering:geometricprecision;background:#0b0d18;font-family:Plus Jakarta Sans,Avenir Next,Avenir,Segoe UI,PingFang SC,Microsoft YaHei,sans-serif}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden}body{min-width:320px}#app{background:radial-gradient(circle at 18% 18%,#6366f12e,#0000 26rem),radial-gradient(circle at 82% 72%,#ec489929,#0000 24rem),#0b0d18;position:relative}#game-canvas{touch-action:none;outline:none;width:100vw;height:100vh;display:block}#hud{top:max(16px, env(safe-area-inset-top));left:max(16px, env(safe-area-inset-left));pointer-events:none;color:#eef1ff;align-items:center;gap:10px;display:flex;position:absolute}.hud-metric{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);text-align:center;background:#0b0d18b8;border:1px solid #eef1ff3d;min-width:84px;padding:8px 10px;box-shadow:0 8px 24px #00000057}.hud-metric span{color:#eef1ffad;letter-spacing:.04em;font-size:.68rem;display:block}.hud-metric strong{margin-top:2px;font-size:1.08rem;display:block}#status-line{background:#0b0d1899;border-left:3px solid #6366f1;min-width:132px;padding:9px 11px;font-size:.78rem;font-weight:700}.combo-metric{color:#eef1ff9e;border-color:#f472b652;font-size:.72rem;transition:color .15s,border-color .15s,box-shadow .15s}.combo-metric.combo-active{color:#fde68a;border-color:#fbbf24b3;box-shadow:0 0 24px #fbbf2452}.popup-layer{pointer-events:none;z-index:12;position:absolute;inset:0;overflow:hidden}.score-popup{text-shadow:0 2px 10px #0009;will-change:opacity, top;font-size:1.05rem;font-weight:800;position:absolute;transform:translate(-50%,-50%)}.overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:20;background:#070912c7;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.overlay.hidden{display:none}.title-content{text-align:center;background:linear-gradient(160deg,#1e213ceb,#0f1122f2);border:1px solid #eef1ff29;border-radius:22px;width:min(92vw,460px);padding:30px 28px 34px;animation:.42s cubic-bezier(.2,.9,.3,1.2) pop;box-shadow:0 28px 80px #00000080}@keyframes pop{0%{opacity:0;transform:scale(.86)}to{opacity:1;transform:scale(1)}}.title-icon{font-size:2.6rem}.title-main{background:linear-gradient(90deg,#818cf8,#f472b6);color:#0000;-webkit-background-clip:text;background-clip:text;margin:8px 0 4px;font-size:2rem;font-weight:800}.title-sub{color:#eef1ffb3;margin:0;font-size:.92rem}.title-story{color:#eef1ffd1;margin:16px 0;font-size:.9rem;line-height:1.6}.title-tips{text-align:left;color:#eef1ffd1;background:#00000038;border:1px solid #eef1ff1f;border-radius:12px;margin:0 auto 18px;padding:12px 14px;font-size:.82rem;list-style:none}.title-tips li{margin:4px 0}.title-tips b{color:#c7d2fe}.btn-primary{appearance:none;cursor:pointer;color:#0b0d18;background:linear-gradient(90deg,#818cf8,#f472b6);border:none;border-radius:999px;padding:12px 26px;font-size:1rem;font-weight:800;transition:transform .12s,box-shadow .12s;box-shadow:0 12px 30px #816cf16b}.btn-primary:active{transform:translateY(2px)scale(.98);box-shadow:0 6px 18px #816cf16b}.result-grid{grid-template-columns:repeat(3,1fr);gap:10px;margin:18px 0 22px;display:grid}.result-item{background:#00000047;border:1px solid #eef1ff24;border-radius:14px;padding:12px 8px}.result-item span{color:#eef1ffa8;font-size:.72rem;display:block}.result-item strong{color:#c7d2fe;margin-top:4px;font-size:1.4rem;display:block}#touch-controls{right:max(18px, env(safe-area-inset-right));bottom:max(18px, env(safe-area-inset-bottom));left:max(18px, env(safe-area-inset-left));pointer-events:none;justify-content:space-between;align-items:flex-end;display:none;position:absolute}#touch-stick{aspect-ratio:1;pointer-events:auto;touch-action:none;background:#0b0d1885;border:1px solid #eef1ff47;border-radius:50%;width:clamp(96px,24vw,132px);position:relative}#touch-knob{aspect-ratio:1;background:#818cf8;border-radius:50%;width:42%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 0 24px #816cf170}#dash-button{aspect-ratio:1;color:#0b0d18;pointer-events:auto;touch-action:none;background:linear-gradient(135deg,#f472b6,#fb7185);border:1px solid #eef1ff4d;border-radius:50%;width:clamp(74px,18vw,96px);font-weight:800}@media (pointer:coarse),(width<=760px){#hud{right:max(12px, env(safe-area-inset-right));left:max(12px, env(safe-area-inset-left));flex-wrap:wrap;gap:8px}.hud-metric{min-width:70px;padding:7px 8px}#status-line{min-width:min(148px,48vw);font-size:.72rem}#touch-controls{display:flex}}