:root{--font-display: "Fredoka", "Baloo 2", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--color-text: #fff8e7;--color-text-soft: #f7e6b8;--color-text-muted: #c9b6e0;--color-accent: #ffd23f;--color-accent-strong: #ff9f1c;--color-frame: #1f0f3a;--color-frame-edge: rgba(255, 210, 63, .35);--color-board: #170828;--color-status: rgba(34, 16, 60, .78);--color-page-base: #0a0418;--shadow-frame: 0 28px 60px -20px rgba(0, 0, 0, .7), 0 8px 24px -8px rgba(255, 95, 156, .35), inset 0 1px 0 rgba(255, 255, 255, .08);color-scheme:dark;font-family:var(--font-display);line-height:1.4;font-weight:600;color:var(--color-text);background-color:var(--color-page-base);background-image:radial-gradient(ellipse at 18% 0%,rgba(255,156,84,.55),transparent 55%),radial-gradient(ellipse at 82% 12%,rgba(255,86,158,.45),transparent 50%),radial-gradient(circle at 50% 100%,rgba(94,34,168,.7),transparent 60%),linear-gradient(180deg,#2a0f4d 0%,#150829 60%,#0a0418 100%);background-attachment:fixed;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}html{background-color:var(--color-page-base)}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;overflow-x:hidden;background-color:var(--color-page-base)}button,input,textarea,select{font:inherit}button{border:none;cursor:pointer;color:var(--color-text);background:transparent}button:focus-visible{outline:3px solid var(--color-accent);outline-offset:3px}#app{width:100%;min-width:0}.app-shell{width:min(100%,28rem);margin:0 auto;min-width:0;min-height:100dvh;display:grid;grid-template-rows:auto 1fr auto;gap:18px;padding-block:max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-bottom))}.hud{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;padding-inline:max(16px,env(safe-area-inset-left)) max(16px,env(safe-area-inset-right))}.hud__brand{display:flex;align-items:center;gap:10px;min-width:0}.hud__logo{width:40px;height:40px;display:block;filter:drop-shadow(0 4px 8px rgba(255,86,158,.45));animation:hud-logo-bounce 3.2s ease-in-out infinite;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}.hud__title{margin:0;font-family:var(--font-display);font-size:clamp(1.5rem,6vw,1.9rem);font-weight:700;letter-spacing:.5px;line-height:1;background:linear-gradient(180deg,#fff7c4 0%,#ffd23f 60%,#ff9f1c 100%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 2px 0 rgba(80,20,0,.25);filter:drop-shadow(0 3px 0 rgba(74,17,79,.55))}.hud__score{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border-radius:999px;background:linear-gradient(180deg,rgba(255,255,255,.18),rgba(255,255,255,0)),linear-gradient(180deg,#ffd23f 0%,#ff9f1c 100%);color:#3a1500;box-shadow:0 4px #b25c00,0 8px 18px #ff9f1c66,inset 0 1px #fff9;white-space:nowrap}.hud__score-icon{width:18px;height:18px;flex-shrink:0;filter:drop-shadow(0 1px 0 rgba(255,255,255,.5))}.hud__score-value{font-size:1.25rem;font-weight:700;line-height:1;letter-spacing:.5px;font-variant-numeric:tabular-nums}.board-shell{width:100%;min-width:0;display:grid;align-content:start;padding-inline:max(12px,env(safe-area-inset-left)) max(12px,env(safe-area-inset-right))}.board-actions{display:flex;width:100%;min-width:0;justify-content:flex-end;gap:10px;margin-bottom:4px}.board-actions__leading{margin-right:auto}.board-frame{width:100%;display:grid;gap:10px;padding:12px;border-radius:24px;background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,0)),linear-gradient(180deg,#2c1450 0%,#1a0a35 100%);border:2px solid var(--color-frame-edge);box-shadow:var(--shadow-frame);position:relative;isolation:isolate}.board-frame:before{content:"";position:absolute;top:4px;right:4px;bottom:4px;left:4px;border-radius:20px;border:1px solid rgba(255,210,63,.12);pointer-events:none;z-index:0}.board-viewport{width:100%;min-width:0;aspect-ratio:1;position:relative;z-index:1}#phaser-root{width:100%;height:100%;min-width:0;min-height:0;border-radius:18px;overflow:hidden;background:radial-gradient(circle at 50% 0%,rgba(255,210,63,.12),transparent 65%),linear-gradient(180deg,#1a0b35 0%,#0c0420 100%);box-shadow:inset 0 2px 12px #0000008c,inset 0 -1px #ffffff0f}#phaser-root canvas{display:block;width:100%;height:100%;border-radius:18px}.hud__button{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:0 18px;border-radius:999px;font-weight:700;font-size:.95rem;letter-spacing:.3px;color:#fff8e7;background:linear-gradient(180deg,rgba(255,255,255,.22),rgba(255,255,255,0)),linear-gradient(180deg,#6dd47e 0%,#2f8f55 100%);box-shadow:0 4px #1c5634,0 6px 14px #2d9e5a66,inset 0 1px #fff6;text-shadow:0 1px 0 rgba(0,40,16,.4);transition:transform 80ms ease,box-shadow 80ms ease,filter .12s ease}.hud__button--hint{background:linear-gradient(180deg,rgba(255,255,255,.28),rgba(255,255,255,0)),linear-gradient(180deg,#ffd870 0%,#ff9f1c 100%);color:#3a1500;text-shadow:0 1px 0 rgba(255,255,255,.35);box-shadow:0 4px #a25400,0 6px 14px #ff9f1c66,inset 0 1px #ffffff8c}.hud__button--shuffle{background:linear-gradient(180deg,rgba(255,255,255,.25),rgba(255,255,255,0)),linear-gradient(180deg,#6ec5ff 0%,#3a78d6 100%);box-shadow:0 4px #1c468c,0 6px 14px #3a78d666,inset 0 1px #ffffff73}.hud__button--music{background:linear-gradient(180deg,rgba(255,255,255,.22),rgba(255,255,255,0)),linear-gradient(180deg,#b487ec 0%,#7a47c2 100%);box-shadow:0 4px #4a1e7e,0 6px 14px #7a47c266,inset 0 1px #ffffff73}.hud__button--music[aria-pressed=false]{background:linear-gradient(180deg,rgba(255,255,255,.18),rgba(255,255,255,0)),linear-gradient(180deg,#756c8c 0%,#3f3a55 100%);box-shadow:0 4px #1c1430,0 6px 14px #3a325859,inset 0 1px #ffffff40}.hud__button:hover:not(:disabled){filter:brightness(1.05)}.hud__button:active:not(:disabled){transform:translateY(3px);box-shadow:0 1px #0006,0 2px 6px #0000004d,inset 0 1px #ffffff4d}.hud__button:disabled{opacity:.45;cursor:not-allowed;filter:grayscale(.4)}.hud__button-icon{width:18px;height:18px;flex-shrink:0}.hud__button-label{line-height:1}.status-bar{min-height:44px;display:flex;align-items:center;justify-content:center;margin-inline:max(16px,env(safe-area-inset-left)) max(16px,env(safe-area-inset-right));padding:0 18px;border-radius:999px;background:var(--color-status);color:var(--color-text-soft);font-weight:500;font-size:.95rem;text-align:center;border:1px solid rgba(255,210,63,.18);box-shadow:inset 0 1px #ffffff0f,0 4px 16px #0006;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}@keyframes hud-logo-bounce{0%,to{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-3px) rotate(4deg)}}@media (prefers-reduced-motion: reduce){.hud__logo{animation:none}}.splash{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;padding:24px;z-index:9999}.splash__card{width:min(100%,22rem);display:flex;flex-direction:column;align-items:center;gap:16px;padding:32px 28px;border-radius:24px;background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,0)),linear-gradient(180deg,#2c1450 0%,#1a0a35 100%);border:2px solid var(--color-frame-edge);box-shadow:var(--shadow-frame);text-align:center}.splash__logo{width:72px;height:72px;filter:drop-shadow(0 4px 14px rgba(255,86,158,.45));animation:splash-logo-bounce 1.6s ease-in-out infinite}.splash__title{margin:0;font-size:1.6rem;letter-spacing:.5px;color:var(--color-accent);text-shadow:0 2px 0 rgba(0,0,0,.4)}.splash__caption{margin:0;font-size:.95rem;color:var(--color-text-muted);font-variant-numeric:tabular-nums}.splash__progress{width:100%;height:8px;border-radius:999px;background:rgba(0,0,0,.45);overflow:hidden;border:1px solid rgba(255,210,63,.2)}.splash__progress-fill{width:0%;height:100%;border-radius:999px;background:linear-gradient(90deg,#ffd870,#ff9f1c);transition:width .22s ease}@keyframes splash-logo-bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@media (prefers-reduced-motion: reduce){.splash__logo{animation:none}.splash__progress-fill{transition:none}}