:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--color-bg:#f7f6f3;--color-surface:#fff;--color-board:#d8d3cc;--color-border:#2a26200f;--color-text-primary:#2a2620;--color-text-secondary:#8a8378;--color-accent:#4f8ef7;--shadow-elevation-1:0 1px 2px #2a26200d, 0 2px 6px #2a26200f;--shadow-elevation-2:0 2px 4px #2a26200f, 0 6px 16px #2a26201a;--sans:"Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;font-family:var(--sans);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html,body{background:var(--color-bg);height:100%;color:var(--color-text-primary);overscroll-behavior:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent;margin:0}#app{flex-direction:column;width:100%;max-width:640px;height:100dvh;margin:0 auto;display:flex;overflow:hidden}#app[hidden],#start-menu[hidden],#tutorial-overlay[hidden]{display:none}#top-bar{padding:max(16px, env(safe-area-inset-top)) 20px 12px;flex:none;justify-content:center;gap:14px;display:flex;position:relative}.help-button{top:max(16px, env(safe-area-inset-top));border:1px solid var(--color-border);background:var(--color-surface);width:36px;height:36px;box-shadow:var(--shadow-elevation-1);color:var(--color-text-secondary);cursor:pointer;border-radius:50%;justify-content:center;align-items:center;font-family:inherit;font-size:15px;font-weight:700;display:flex;position:absolute;right:20px}.score-block{background:var(--color-surface);border:1px solid var(--color-border);max-width:220px;box-shadow:var(--shadow-elevation-1);border-radius:18px;flex-direction:column;flex:1 1 0;align-items:center;gap:3px;padding:12px 18px;display:flex}.score-label{letter-spacing:.07em;text-transform:uppercase;color:var(--color-text-secondary);font-size:12px;font-weight:600}.score-value{font-variant-numeric:tabular-nums;color:var(--color-text-primary);font-size:clamp(22px,6vw,30px);font-weight:700;transition:transform .15s}.score-value.pulse{animation:.5s score-pulse}@keyframes score-pulse{0%{color:var(--color-accent);transform:scale(1.16)}to{color:var(--color-text-primary);transform:scale(1)}}#board-container{flex:auto;width:100%;min-height:0;display:block;position:relative}#board-container canvas{touch-action:none;display:block}#bottom-bar{padding:12px 20px max(20px, env(safe-area-inset-bottom));flex:none;justify-content:center;align-items:center;gap:28px;display:flex}.next-group,.upcoming-group{flex-direction:column;align-items:center;gap:6px;display:flex}.next-label{letter-spacing:.07em;text-transform:uppercase;color:var(--color-text-secondary);font-size:13px;font-weight:600}.upcoming-tiles{align-items:center;gap:6px;min-height:38px;display:flex}.upcoming-tile{background:var(--color-surface);border:1px solid var(--color-border);min-width:30px;box-shadow:var(--shadow-elevation-1);color:var(--color-text-secondary);text-align:center;font-variant-numeric:tabular-nums;opacity:.8;border-radius:12px;padding:6px 10px;font-size:14px;font-weight:700;transform:scale(.92)}.next-number{background:var(--color-surface);border:1px solid var(--color-border);min-width:52px;box-shadow:var(--shadow-elevation-2);color:var(--color-text-primary);text-align:center;font-variant-numeric:tabular-nums;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;will-change:transform;border-radius:16px;padding:10px 16px;font-size:22px;font-weight:700;transition:box-shadow .15s}.next-number.pop{animation:.2s next-pop}.next-number.dragging{cursor:grabbing;box-shadow:0 10px 24px #2a26202e}@keyframes next-pop{0%{transform:scale(.7)}to{transform:scale(1)}}#start-menu{min-height:100dvh;padding:24px 20px max(24px, env(safe-area-inset-bottom));justify-content:center;align-items:center;display:flex}.menu-card{background:var(--color-surface);border:1px solid var(--color-border);width:100%;max-width:420px;box-shadow:var(--shadow-elevation-2);border-radius:24px;flex-direction:column;align-items:center;gap:18px;padding:28px 24px;display:flex}.menu-title{color:var(--color-text-primary);margin:0;font-size:32px;font-weight:700}.menu-subtitle{color:var(--color-text-secondary);text-align:center;margin:-10px 0 0;font-size:14px}.grid-size-options{grid-template-columns:repeat(2,1fr);gap:12px;width:100%;display:grid}.grid-size-option{border:1.5px solid var(--color-border);background:var(--color-bg);cursor:pointer;border-radius:16px;flex-direction:column;align-items:center;gap:10px;padding:16px 10px;font-family:inherit;transition:border-color .15s,box-shadow .15s,transform .1s;display:flex}.grid-size-option:hover{transform:translateY(-1px)}.grid-size-option.selected{border-color:var(--color-accent);background:var(--color-surface);box-shadow:0 0 0 3px #4f8ef729}.grid-preview{gap:2px;width:56px;height:56px;display:grid}.grid-preview-cell{background:var(--color-board);border-radius:3px}.grid-size-option.selected .grid-preview-cell{background:var(--color-accent);opacity:.4}.grid-size-label{color:var(--color-text-primary);font-size:13px;font-weight:700}.grid-size-best{font-variant-numeric:tabular-nums;color:var(--color-text-secondary);font-size:11px;font-weight:600}.how-to-play-toggle{color:var(--color-accent);cursor:pointer;background:0 0;border:none;padding:4px 8px;font-family:inherit;font-size:13px;font-weight:600}.how-to-play{background:var(--color-bg);border:1px solid var(--color-border);width:100%;max-height:45vh;color:var(--color-text-secondary);border-radius:14px;padding:14px 16px;font-size:13px;line-height:1.5;overflow-y:auto}.how-to-play h2{color:var(--color-text-primary);margin:12px 0 6px;font-size:13px}.how-to-play h2:first-child{margin-top:0}.how-to-play ul{flex-direction:column;gap:4px;margin:0;padding-left:18px;display:flex}.play-button{background:var(--color-accent);color:#fff;cursor:pointer;width:100%;box-shadow:var(--shadow-elevation-2);border:none;border-radius:16px;padding:14px;font-family:inherit;font-size:16px;font-weight:700;transition:transform .1s}.play-button:active{transform:scale(.98)}.tutorial-overlay{z-index:1000;position:fixed;inset:0}.tutorial-scrim{background:#14120f99;position:absolute;inset:0}.tutorial-spotlight{border:2px solid var(--color-accent);pointer-events:none;border-radius:16px;transition:top .2s,left .2s,width .2s,height .2s,opacity .15s;position:absolute;box-shadow:0 0 0 4px #4f8ef740,0 0 24px #4f8ef759}.tutorial-tooltip{background:var(--color-surface);width:min(300px,100vw - 32px);box-shadow:var(--shadow-elevation-2);border-radius:18px;padding:18px 20px;position:absolute}.tutorial-step-progress{letter-spacing:.08em;text-transform:uppercase;color:var(--color-text-secondary);margin:0 0 6px;font-size:11px;font-weight:700}.tutorial-step-title{color:var(--color-text-primary);margin:0 0 6px;font-size:17px;font-weight:700}.tutorial-step-body{color:var(--color-text-secondary);margin:0 0 14px;font-size:14px;line-height:1.45}.tutorial-actions{justify-content:space-between;align-items:center;gap:12px;display:flex}.tutorial-skip{color:var(--color-text-secondary);cursor:pointer;background:0 0;border:none;padding:6px 4px;font-family:inherit;font-size:13px;font-weight:600}.tutorial-next{background:var(--color-accent);color:#fff;cursor:pointer;border:none;border-radius:12px;padding:8px 18px;font-family:inherit;font-size:14px;font-weight:700}@media (width>=720px){#app{max-width:720px;padding:16px 0}.score-block{padding:16px 22px}}