:root{--bg:#14161c;--bg-raised:#1d2029;--fg:#e8eaf0;--fg-dim:#9aa0ae;--accent:#5ac8fa;--danger:#ff5a5f;--success:#4cd964;--radius:12px;--font:system-ui, -apple-system, "Segoe UI", sans-serif}*{box-sizing:border-box}[hidden]{display:none!important}html,body{background:var(--bg);height:100%;color:var(--fg);font-family:var(--font);overscroll-behavior:none;margin:0}#app{justify-content:center;align-items:center;height:100%;display:flex}canvas#board{touch-action:none;width:100%;height:100%;display:block}#screens{pointer-events:none;position:fixed;inset:0}#screens>*{pointer-events:auto}.hud{padding:calc(6px + env(safe-area-inset-top)) calc(10px + env(safe-area-inset-right)) 6px calc(10px + env(safe-area-inset-left));color:var(--fg-dim);-webkit-user-select:none;user-select:none;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;font-size:13px;display:flex;position:fixed;top:0;left:0;right:0}.hud-group{align-items:center;gap:8px;display:flex}.hud-group-left{flex-shrink:1;min-width:0}.hud-group-right{flex-wrap:wrap;justify-content:flex-end}.hud-label{color:var(--fg);text-overflow:ellipsis;white-space:nowrap;font-weight:600;overflow:hidden}.hud-btn{border-radius:calc(var(--radius) / 2);background:var(--bg-raised);min-width:48px;height:44px;color:var(--fg);font:22px var(--font);cursor:pointer;border:none;padding:0 10px}.hud-btn:hover:not(:disabled){filter:brightness(1.25)}.hud-btn:disabled{opacity:.35;cursor:default}.hud-btn-confirm{background:var(--danger);font-size:13px}.hud-actions{border-left:1px solid var(--bg-raised);gap:10px;margin-left:20px;padding-left:16px;display:flex}.hud-btn-big{border-radius:var(--radius);min-width:64px;height:60px;font-size:32px}@media (width<=420px){.hud,.hud-group{gap:6px}.hud-btn{min-width:40px;height:42px;padding:0 6px;font-size:19px}.hud-btn-big{min-width:50px;height:50px;font-size:26px}.hud-actions{gap:6px;margin-left:8px;padding-left:8px}}.overlay-backdrop{z-index:10;background:#0a0b0fb8;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.overlay-card{border-radius:var(--radius);background:var(--bg-raised);text-align:center;flex-direction:column;gap:10px;min-width:240px;max-width:90vw;padding:24px 28px;display:flex}.overlay-card h2{margin:0 0 6px;font-size:24px}.ov-sub{color:var(--fg-dim);margin:0 0 8px;font-size:13px}.ov-stars{font-size:40px;line-height:1.1}.ov-star{color:#3a3f4d}.ov-star-on{color:#ffc53d;text-shadow:0 0 12px #ffc53d80}.ov-btn{border-radius:calc(var(--radius) / 2);background:var(--bg);height:44px;color:var(--fg);font:16px var(--font);cursor:pointer;border:none}.ov-btn:hover{filter:brightness(1.3)}.ov-btn-primary{background:var(--accent);color:#0c0d11;font-weight:600}.screen{background:var(--bg);padding:calc(12px + env(safe-area-inset-top)) 16px calc(16px + env(safe-area-inset-bottom));flex-direction:column;align-items:center;display:flex;position:fixed;inset:0;overflow-y:auto}.screen-title{cursor:pointer;justify-content:center}.title-logo{letter-spacing:.04em;margin:0;font-size:clamp(40px,10vw,72px)}.title-logo span:nth-child(8n+1){color:#e5484d}.title-logo span:nth-child(8n+2){color:#f76b15}.title-logo span:nth-child(8n+3){color:#ffc53d}.title-logo span:nth-child(8n+4){color:#46a758}.title-logo span:nth-child(8n+5){color:#12a594}.title-logo span:nth-child(8n+6){color:#3e63dd}.title-logo span:nth-child(8n+7){color:#8e4ec6}.title-logo span:nth-child(8n+8){color:#e93d82}.title-hint{color:var(--fg-dim);animation:2.4s ease-in-out infinite title-pulse}@keyframes title-pulse{50%{opacity:.35}}@media (prefers-reduced-motion:reduce){.title-hint{animation:none}}.screen-menu{justify-content:center;gap:10px}.menu-logo{margin:0 0 18px}.menu-btn{border-radius:var(--radius);background:var(--bg-raised);width:min(320px,84vw);height:52px;color:var(--fg);font:18px var(--font);cursor:pointer;border:none;position:relative}.menu-btn:hover:not(:disabled){filter:brightness(1.25)}.menu-btn:disabled{opacity:.45;cursor:default}.menu-soon{color:var(--fg-dim);font-size:11px;position:absolute;top:50%;right:14px;transform:translateY(-50%)}.screen-bar{align-items:center;gap:12px;width:min(560px,100%);margin-bottom:16px;display:flex}.screen-bar h2{margin:0;font-size:20px}.pack-list{flex-direction:column;gap:10px;width:min(560px,100%);display:flex}.pack-card{border-radius:var(--radius);background:var(--bg-raised);color:var(--fg);font:16px var(--font);text-align:left;cursor:pointer;border:none;flex-direction:column;align-items:flex-start;gap:4px;padding:14px 16px;display:flex}.pack-card:hover:not(:disabled){filter:brightness(1.2)}.pack-card:disabled{opacity:.45;cursor:default}.pack-name{font-weight:600}.pack-sub{color:var(--fg-dim);font-size:12px}.level-grid{grid-template-columns:repeat(4,1fr);gap:10px;width:min(560px,100%);display:grid}.level-card{border-radius:var(--radius);background:var(--bg-raised);color:var(--fg);font:18px var(--font);cursor:pointer;border:none;flex-direction:column;align-items:center;gap:2px;padding:12px 0 8px;display:flex}.level-card:hover{filter:brightness(1.2)}.level-stars{color:#ffc53d;min-height:14px;font-size:12px}.settings-form{flex-direction:column;gap:14px;width:min(420px,100%);display:flex}.settings-row{justify-content:space-between;align-items:center;gap:16px;font-size:15px;display:flex}.settings-danger{background:var(--danger);color:#fff;margin-top:18px}.htp-card{border-radius:var(--radius);background:var(--bg-raised);flex-direction:column;gap:12px;width:min(480px,100%);padding:20px;display:flex}.htp-sprite{background:var(--bg);border-radius:calc(var(--radius) / 2);width:100%;height:120px;display:block}.htp-card h3{margin:0}.htp-card p{color:var(--fg-dim);min-height:96px;margin:0;line-height:1.5}.htp-dots{justify-content:center;gap:6px;display:flex}.htp-dot{background:var(--bg);border-radius:50%;width:8px;height:8px}.htp-dot-on{background:var(--accent)}.htp-controls{justify-content:space-between;gap:10px;display:flex}.htp-controls .ov-btn{flex:1}.daily-stats{text-align:center;margin:8px 0 4px}.daily-stats p{margin:2px 0}.daily-play{width:min(420px,100%)}.daily-cal{grid-template-columns:repeat(10,1fr);gap:6px;width:min(420px,100%);margin-top:16px;display:grid}.daily-day{aspect-ratio:1;border-radius:calc(var(--radius) / 2);background:var(--bg-raised);color:var(--fg-dim);font:12px var(--font);cursor:pointer;border:none}.daily-day-solved{background:var(--success);color:#0c0d11;font-weight:600}.daily-day-missed{opacity:.5}.daily-day-today{outline:2px solid var(--accent)}.daily-legend{margin-top:12px}.endless-form{flex-direction:column;gap:18px;width:min(420px,100%);display:flex}.endless-section h3{color:var(--fg-dim);margin:0 0 8px;font-size:15px}.endless-seg{gap:8px;display:flex}.endless-mechs{grid-template-columns:repeat(2,1fr);gap:8px;display:grid}.endless-seg-btn{border:1px solid var(--bg-raised);border-radius:calc(var(--radius) / 2);background:var(--bg-raised);min-height:44px;color:var(--fg-dim);font:14px var(--font);cursor:pointer;flex:1;padding:0 10px}.endless-seg-btn.on{background:var(--accent);border-color:var(--accent);color:#0c0d11;font-weight:600}.endless-start{margin-top:4px}.tip-toast{border-radius:calc(var(--radius) / 2);background:var(--bg-raised);max-width:min(480px,92vw);color:var(--fg);text-align:center;pointer-events:none;padding:8px 14px;font-size:13px;position:fixed;top:56px;left:50%;transform:translate(-50%);box-shadow:0 4px 16px #0006}