:root{--color-desk: #141210;--color-desk-elevated: #1c1916;--color-desk-subtle: #241f1b;--color-mist: #a39a8c;--color-haze: #7a7368;--color-cream: #e8e0d4;--color-cream-fg: #141210;--color-paper: #f3eee4;--color-paper-ink: #1a1714;--color-cell: #fffaf3;--color-cell-given: #ebe4d6;--color-sun: #c45c26;--color-moon: #1a3558;--color-danger: #b54a3c;--color-border: color-mix(in oklab, #f4efe6 12%, transparent);--color-border-strong: color-mix(in oklab, #f4efe6 22%, transparent);--font-display: "Fraunces", ui-serif, Georgia, "Times New Roman", serif;--font-sans: "Figtree", ui-sans-serif, system-ui, sans-serif;--radius-xs: 4px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 24px;--radius-2xl: 32px}*,*:before,*:after{box-sizing:border-box}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html,body,#root{min-height:100%}body{margin:0;background:var(--color-desk);color:var(--color-cream);font-family:var(--font-sans)}main{width:min(440px,100%);margin-inline:auto}button{font:inherit;color:inherit}button:not(:disabled),[role=button]:not(:disabled){cursor:pointer}button:disabled{cursor:default}svg{display:block}.shell{--cell: min(56px, calc((100vw - 56px) / 6.8));--gap: min(12px, 2.4vw);min-height:100dvh;max-width:440px;margin:0 auto;padding-inline:16px;padding-top:max(3.5rem,calc(env(safe-area-inset-top,0px) + 2.5rem));padding-bottom:max(2.75rem,calc(env(safe-area-inset-bottom,0px) + 1.75rem));display:flex;flex-direction:column;gap:16px}.topbar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;column-gap:8px;min-height:44px}.brand{grid-column:2;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:2px}.brand-mark{width:36px;height:36px;color:var(--color-cream)}.eyebrow{margin:0;font-size:.6875rem;letter-spacing:.18em;text-transform:uppercase;color:var(--color-mist);font-weight:600;text-align:center}.brand h1,h1{margin:0;font-family:var(--font-display);font-size:1.75rem;font-weight:500;font-style:italic;letter-spacing:-.03em;line-height:1.1;text-wrap:balance;text-align:center;color:var(--color-cream)}.top-actions{grid-column:3;justify-self:end;display:flex;gap:8px}.icon-btn{width:44px;height:44px;border-radius:var(--radius-md);border:1px solid var(--color-border);background:var(--color-desk-elevated);color:var(--color-cream);display:grid;place-items:center;transition:transform .15s cubic-bezier(.22,1,.36,1),background-color .15s ease,border-color .15s ease}.icon-btn:hover{background:var(--color-desk-subtle)}.icon-btn:active{transform:scale(.96)}.meta{display:flex;align-items:flex-end;justify-content:space-between;gap:12px}.meta-kicker{margin:0;font-size:.9375rem;font-weight:600;color:var(--color-cream)}.meta-sub{margin:2px 0 0;font-size:.875rem;color:var(--color-mist)}.timer{text-align:right}.timer-label{display:block;font-size:.6875rem;letter-spacing:.14em;text-transform:uppercase;color:var(--color-haze);font-weight:600}.timer-value{font-variant-numeric:tabular-nums;font-size:1.25rem;font-weight:600;color:var(--color-cream)}.paper-wrap{background:var(--color-paper);color:var(--color-paper-ink);border-radius:var(--radius-2xl);padding:16px;box-shadow:0 24px 60px color-mix(in oklab,#000 45%,transparent)}.paper-skel{height:320px;border-radius:var(--radius-2xl);background:var(--color-desk-elevated)}.board{display:grid;grid-template-columns:repeat(5,minmax(0,1fr) var(--gap)) minmax(0,1fr);grid-template-rows:repeat(5,minmax(0,1fr) var(--gap)) minmax(0,1fr);aspect-ratio:1;width:100%}.cell{position:relative;border:0;border-radius:var(--radius-md);background:var(--color-cell);color:var(--color-paper-ink);box-shadow:inset 0 0 0 1px color-mix(in oklab,var(--color-paper-ink) 8%,transparent);display:grid;place-items:center;padding:0;min-width:0;min-height:0;overflow:visible;touch-action:manipulation;user-select:none;-webkit-user-select:none;transition:transform .15s cubic-bezier(.22,1,.36,1),background-color .15s ease,box-shadow .15s ease}.cell:not(:disabled):hover{background:color-mix(in oklab,var(--color-cell) 70%,var(--color-cell-given))}.cell:not(:disabled):active{transform:scale(.96)}.cell-given{background:var(--color-cell-given)}.cell-sun{color:var(--color-sun)}.cell-moon{color:var(--color-moon)}.cell-on:not(:disabled){box-shadow:inset 0 0 0 2px var(--color-paper-ink)}.cell-error{box-shadow:inset 0 0 0 2px var(--color-danger);background:color-mix(in oklab,var(--color-cell) 82%,var(--color-danger))}.cell-won{animation:cell-pop .5s cubic-bezier(.22,1,.36,1) both}.token{width:56%;height:56%}.cell-sun .token{width:64%;height:64%}.mark{width:22px;height:22px;border-radius:999px;background:var(--color-paper);color:var(--color-paper-ink);box-shadow:0 0 0 1px color-mix(in oklab,var(--color-paper-ink) 16%,transparent);display:grid;place-items:center;justify-self:center;align-self:center;z-index:2;pointer-events:none}.mark svg{width:12px;height:12px}.hint-line{min-height:1.4em;margin:0;font-size:.875rem;color:var(--color-mist);text-wrap:pretty;transition:color .15s ease}.hint-line.on{color:var(--color-cream)}.toolbar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.tool{height:44px;border-radius:var(--radius-md);border:1px solid var(--color-border);background:var(--color-desk-elevated);color:var(--color-cream);font:inherit;font-weight:600;font-size:.875rem;display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:transform .15s cubic-bezier(.22,1,.36,1),background-color .15s ease,opacity .15s ease}.tool:hover:not(:disabled){background:var(--color-desk-subtle)}.tool:active:not(:disabled){transform:scale(.96)}.tool:disabled{opacity:.4}.tool-warn{background:var(--color-cream);color:var(--color-cream-fg);border-color:transparent}.modes{display:flex;flex-wrap:wrap;gap:8px}.chip{height:36px;padding:0 14px;border-radius:999px;border:1px solid var(--color-border);background:transparent;color:var(--color-mist);font:inherit;font-size:.8125rem;font-weight:600;text-transform:capitalize;transition:background-color .15s ease,color .15s ease,transform .15s cubic-bezier(.22,1,.36,1)}.chip:active{transform:scale(.96)}.chip-on{background:var(--color-cream);color:var(--color-cream-fg);border-color:transparent}.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0}.stats>div{background:var(--color-desk-elevated);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:12px 10px 14px;text-align:center}.stats dt{font-size:.6875rem;letter-spacing:.14em;text-transform:uppercase;color:var(--color-haze);font-weight:600}.stats dd{margin:4px 0 0;font-variant-numeric:tabular-nums;font-size:1.25rem;font-weight:600;color:var(--color-cream)}.win-screen{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;background:#fff;color:#141210;display:grid;place-items:center;padding:max(3.5rem,calc(env(safe-area-inset-top,0px) + 2rem)) 24px max(2.75rem,calc(env(safe-area-inset-bottom,0px) + 1.75rem));animation:win-screen-in .28s cubic-bezier(.22,1,.36,1) both}.win-screen-stack{position:relative;display:flex;flex-direction:column;align-items:center}.win-screen-time{margin:0;font-variant-numeric:tabular-nums;font-family:var(--font-sans);font-size:clamp(3.25rem,16vw,5.5rem);font-weight:650;letter-spacing:-.05em;line-height:1;color:#141210}.win-reset{position:absolute;top:calc(100% + 32px);left:50%;translate:-50% 0;min-width:168px;height:48px;padding:0 28px;border:0;border-radius:var(--radius-md);background:#141210;color:#f3eee4;font:inherit;font-weight:600;font-size:1rem;animation:win-reset-in .24s cubic-bezier(.22,1,.36,1) both}.win-reset:active{transform:scale(.96)}.btn-primary,.btn-ghost{height:44px;border-radius:var(--radius-md);font:inherit;font-weight:600;border:0;transition:transform .15s cubic-bezier(.22,1,.36,1)}.btn-primary{background:var(--color-cream);color:var(--color-cream-fg)}.btn-ghost{background:transparent;color:var(--color-cream);border:1px solid var(--color-border)}.btn-primary:active,.btn-ghost:active{transform:scale(.96)}.modal-root{position:fixed;top:0;right:0;bottom:0;left:0;background:color-mix(in oklab,#000 55%,transparent);display:grid;place-items:end center;padding:16px;padding-bottom:calc(16px + env(safe-area-inset-bottom));z-index:40}.modal{width:min(440px,100%);background:var(--color-paper);color:var(--color-paper-ink);border-radius:var(--radius-xl);padding:24px 22px 20px;animation:rise .25s cubic-bezier(.22,1,.36,1) both}.modal .eyebrow{color:var(--color-haze)}.modal h2{margin:6px 0 0;font-family:var(--font-display);font-size:1.5rem;font-weight:500;letter-spacing:-.03em;text-wrap:balance;line-height:1.2}.rules{counter-reset:rule;margin:16px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px;color:color-mix(in oklab,var(--color-paper-ink) 78%,transparent);font-size:.9375rem}.rules li{display:grid;grid-template-columns:18px 1fr;gap:10px;counter-increment:rule}.rules li:before{content:counter(rule);width:18px;font-variant-numeric:tabular-nums;font-weight:600;color:var(--color-sun)}.demo-row{display:flex;align-items:center;gap:8px;margin-top:14px}.mini{width:36px;height:36px;border-radius:var(--radius-sm);background:var(--color-cell);color:var(--color-sun);box-shadow:inset 0 0 0 1px color-mix(in oklab,var(--color-paper-ink) 8%,transparent);display:grid;place-items:center}.mini .token{width:60%;height:60%}.mini-good{box-shadow:inset 0 0 0 2px var(--color-moon);color:var(--color-moon)}.demo-eq{font-weight:650;width:16px;text-align:center}.demo-cap{font-size:.75rem;color:var(--color-haze)}.modal-go{width:100%;margin-top:20px}@keyframes rise{0%{opacity:0;transform:translateY(8px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes cell-pop{0%{transform:scale(.92)}to{transform:scale(1)}}@keyframes win-screen-in{0%{opacity:0}to{opacity:1}}@keyframes win-reset-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@media(min-width:640px){.shell{padding-top:max(2.25rem,calc(env(safe-area-inset-top,0px) + 1.5rem));padding-bottom:max(2.5rem,calc(env(safe-area-inset-bottom,0px) + 1.5rem))}.modal-root{place-items:center}}@media(prefers-reduced-motion:reduce){.cell,.icon-btn,.tool,.chip,.btn-primary,.btn-ghost,.win-screen,.win-reset,.modal,.start-card,.cell-won{animation:none;transition:none}}.version{margin:8px 0 0;text-align:center;font-size:.75rem;letter-spacing:.16em;text-transform:uppercase;color:var(--color-mist);font-weight:600}.version-on{color:var(--color-cream)}.start-screen{min-height:100dvh;max-width:440px;margin:0 auto;padding-inline:16px;padding-top:max(3.5rem,calc(env(safe-area-inset-top,0px) + 2.5rem));padding-bottom:max(2.75rem,calc(env(safe-area-inset-bottom,0px) + 1.75rem));display:flex;flex-direction:column;gap:16px}.start-top{display:grid;grid-template-columns:1fr auto 1fr;align-items:center}.start-top .brand{grid-column:2}.start-top .icon-btn{grid-column:3;justify-self:end}.start-tag{margin:0;text-align:center;color:var(--color-mist);font-size:.9375rem}.start-card{background:var(--color-paper);color:var(--color-paper-ink);border-radius:var(--radius-xl);padding:22px 20px 20px}.start-card .eyebrow{color:var(--color-haze)}.start-card h2{margin:6px 0 0;font-family:var(--font-display);font-size:1.5rem;font-weight:500;letter-spacing:-.03em;text-wrap:balance;line-height:1.2;color:var(--color-paper-ink);text-align:left;font-style:normal}.start-go{width:100%;margin-top:20px;height:48px;background:var(--color-desk);color:var(--color-cream)}.start-best{margin:0;text-align:center;font-variant-numeric:tabular-nums;color:var(--color-cream);font-weight:600;font-size:1rem}.start-card .demo-cap{color:var(--color-haze)}