:root{--paper: #f7f6f1;--paper-2: #eeece5;--tape: #e2dccd;--tape-stripe: rgba(0, 0, 0, .05);--rule: rgba(0, 0, 0, .08);--text: #000000;--text-2: #6d6b66;--ink-r: #e2453c;--ink-y: #ffcb05;--ink-b: #1d5fd3;--ink-o: #ff8a1e;--ink-g: #2fa65a;--ink-p: #7a50d4;--bleed: #c8443a;--card: #ffffff;--card-border: rgba(0, 0, 0, .35);--warn: #c8443a;--dot: rgba(0, 0, 0, .18);--ease-out: cubic-bezier(.2, .8, .2, 1);--ease-spring: cubic-bezier(.34, 1.56, .64, 1);--font-stack: "Avenir Next", "Segoe UI", system-ui, -apple-system, sans-serif;color-scheme:light dark}:root[data-appearance=dark]{color-scheme:dark}:root[data-appearance=light]{color-scheme:light}@media (prefers-color-scheme: dark){:root:not([data-appearance=light]){--paper: #202024;--paper-2: #2a2a2f;--tape: #3a3934;--tape-stripe: rgba(255, 255, 255, .05);--rule: rgba(255, 255, 255, .09);--text: #f4f3ee;--text-2: #a3a29b;--ink-r: #f0564d;--ink-y: #ffd43a;--ink-b: #4a82e8;--ink-o: #ff9a3c;--ink-g: #46bd6e;--ink-p: #9b76f0;--bleed: #e06b62;--card: #2a2a2f;--card-border: rgba(255, 255, 255, .35);--warn: #e06b62;--dot: rgba(255, 255, 255, .22)}}:root[data-appearance=dark]{--card: #2a2a2f;--card-border: rgba(255, 255, 255, .35);--warn: #e06b62;--dot: rgba(255, 255, 255, .22);--paper: #202024;--paper-2: #2a2a2f;--tape: #3a3934;--tape-stripe: rgba(255, 255, 255, .05);--rule: rgba(255, 255, 255, .09);--text: #f4f3ee;--text-2: #a3a29b;--ink-r: #f0564d;--ink-y: #ffd43a;--ink-b: #4a82e8;--ink-o: #ff9a3c;--ink-g: #46bd6e;--ink-p: #9b76f0;--bleed: #e06b62}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--paper);color:var(--text);font-family:var(--font-stack);font-size:17px;line-height:1.45;-webkit-tap-highlight-color:transparent;touch-action:manipulation;overscroll-behavior:none}button{font:inherit;color:inherit;background:none;border:none;padding:0;cursor:pointer}input{font:inherit}:focus-visible{outline:2px solid var(--text);outline-offset:2px}.app{min-height:100dvh;display:flex;flex-direction:column;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}.screen{width:100%;max-width:960px;margin:0 auto;padding:0 16px 24px;flex:1;display:flex;flex-direction:column}.topbar{height:56px;display:flex;align-items:center;gap:12px}.wordmark{font-size:28px;font-weight:700;letter-spacing:-.01em}.topbar-number{color:var(--text-2);font-size:15px}.topbar-spacer{flex:1}.timer{font-variant-numeric:tabular-nums;font-size:17px;min-width:3.2em;text-align:right}.menu-wrap{position:relative}.menu-button{min-width:44px;min-height:44px;border-radius:12px;display:grid;place-items:center;font-size:22px;line-height:1}.menu-pop{position:absolute;right:0;top:48px;background:var(--paper);border:1px solid var(--rule);border-radius:12px;padding:4px;z-index:40;min-width:11em;box-shadow:0 6px 14px #0000001f}.menu-pop a,.menu-pop button{display:block;width:100%;text-align:left;padding:10px 12px;border-radius:8px;font-size:15px;color:var(--text);text-decoration:none}.menu-pop a:hover,.menu-pop button:hover{background:var(--paper-2)}.play{display:flex;flex-direction:column;align-items:center;flex:1}.progress-chip{min-height:28px;display:flex;align-items:center;justify-content:center;gap:10px;font-size:15px;color:var(--text-2)}.progress-chip .count{font-variant-numeric:tabular-nums;color:var(--text);border:1px solid var(--rule);border-radius:999px;padding:2px 10px}.progress-chip .count.done{background:var(--text);color:var(--paper);border-color:var(--text)}.board-wrap{position:relative}.board-well{background:var(--paper-2);border-radius:16px;padding:10px;position:relative;touch-action:none;user-select:none;-webkit-user-select:none;transition:opacity .2s var(--ease-out)}.board-well.dimmed .cell>*:not(.run-lit){opacity:.45}.board{display:grid;gap:0;position:relative}.cell{position:relative;width:var(--cell);height:var(--cell);background:var(--paper);box-shadow:inset 0 0 0 .5px var(--rule);display:grid;place-items:center;padding:0;overflow:visible}.cell.tape{background-color:var(--tape);background-image:repeating-linear-gradient(45deg,var(--tape-stripe) 0 3px,transparent 3px 6px)}.cell.shake{animation:tint-shake .24s var(--ease-out)}@keyframes tint-shake{25%{transform:translate(-3px)}60%{transform:translate(3px)}}.band{position:absolute;z-index:1;pointer-events:none}.band.h{top:32%;height:36%;left:0;right:0}.band.v{left:32%;width:36%;top:0;bottom:0}.band.h.start{left:8%;border-top-left-radius:999px;border-bottom-left-radius:999px}.band.h.end{right:8%;border-top-right-radius:999px;border-bottom-right-radius:999px}.band.v.start{top:8%;border-top-left-radius:999px;border-top-right-radius:999px}.band.v.end{bottom:8%;border-bottom-left-radius:999px;border-bottom-right-radius:999px}.band.swept{animation:tint-sweep .16s var(--ease-out) both;animation-delay:var(--sweep-delay, 0ms)}@keyframes tint-sweep{0%{opacity:0}}.band.ripple{animation:tint-ripple .24s var(--ease-out)}@keyframes tint-ripple{50%{opacity:.7}}.mix-square{position:absolute;z-index:2;left:32%;top:32%;width:36%;height:36%;pointer-events:none;animation:tint-mix-in .12s var(--ease-out) both}@keyframes tint-mix-in{0%{opacity:0}}.drop-token{position:relative;z-index:3;width:64%;height:64%;border-radius:999px;box-shadow:inset 0 0 0 2px #00000040,inset 6px 6px 8px #ffffff40;animation:tint-pop .16s var(--ease-spring) both;display:grid;place-items:center;color:#0000008c;font-size:calc(var(--cell) * .3);line-height:1}@keyframes tint-pop{0%{transform:scale(.6)}to{transform:scale(1)}}.drop-token.dragging-source{opacity:.3}.drop-token .pin{position:absolute;top:8%;right:8%;width:22%;height:22%;border-radius:999px;background:var(--paper);border:1.5px solid rgba(0,0,0,.4)}.drop-token .flag{position:absolute;top:-6%;right:-6%;min-width:38%;height:38%;border-radius:999px;background:var(--warn);color:#fff;font-size:calc(var(--cell) * .2);display:grid;place-items:center}.drop-token .ok{position:absolute;top:-6%;right:-6%;min-width:38%;height:38%;border-radius:999px;background:var(--text);color:var(--paper);font-size:calc(var(--cell) * .18);display:grid;place-items:center;animation:tint-ok .9s var(--ease-out) both}@keyframes tint-ok{0%{transform:scale(1.06)}15%{transform:scale(1)}85%{opacity:1}to{opacity:0}}.drag-ghost{position:absolute;z-index:30;width:var(--cell);height:var(--cell);pointer-events:none;display:grid;place-items:center;filter:drop-shadow(0 4px 6px rgba(0,0,0,.25))}.drag-ghost .drop-token{animation:none}.place-dot{position:absolute;z-index:2;width:6px;height:6px;border-radius:999px;background:var(--dot);pointer-events:none}.cell.drop-target{box-shadow:inset 0 0 0 2px var(--text)}.recipe-card{position:relative;z-index:4;width:78%;height:62%;border-radius:6px;background:var(--card);border:1.5px solid var(--card-border);display:flex;align-items:center;justify-content:center;gap:8%}.recipe-card.met{border-color:var(--text);transform:translateY(-1px)}.recipe-card.intruded{border-color:var(--warn)}.recipe-card .slot{width:28%;aspect-ratio:1;border-radius:999px;display:grid;place-items:center;font-size:calc(var(--cell) * .16);color:#0000008c}.recipe-card .slot.empty{border:2px solid;opacity:.6;background:transparent!important}.recipe-card .slot.filled{animation:tint-slot-fill .16s var(--ease-out)}@keyframes tint-slot-fill{0%{transform:scale(.7)}}.recipe-card .keep-clean{width:34%;aspect-ratio:1;border-radius:999px;border:2px solid var(--text-2);position:relative}.recipe-card .keep-clean:after{content:"";position:absolute;left:-15%;top:44%;width:130%;height:2px;background:var(--text-2);transform:rotate(-45deg)}.recipe-card .check{position:absolute;top:-7px;right:-7px;width:15px;height:15px;border-radius:999px;background:var(--text);color:var(--paper);font-size:10px;line-height:15px;text-align:center;animation:tint-check .2s var(--ease-out)}@keyframes tint-check{0%{transform:scale(0)}}.recipe-card .intruder{position:absolute;top:-6px;right:-6px;width:13px;height:13px;border-radius:999px;border:1.5px solid var(--warn);display:grid;place-items:center}.recipe-card .intruder:after{content:"";width:120%;height:1.5px;background:var(--warn);transform:rotate(-45deg);position:absolute}.cell.hinted .recipe-card,.cell.hinted .drop-token{outline:3px solid var(--text);outline-offset:2px}.cell.hinted-empty:after{content:"";position:absolute;inset:15%;border:3px dashed var(--text);border-radius:8px;z-index:5;pointer-events:none}.cell.run-lit{box-shadow:inset 0 0 0 2px var(--text);z-index:6}.bleed-overlay{position:absolute;inset:10px;pointer-events:none;z-index:7}.bleed-overlay line{stroke:var(--bleed);stroke-width:3;stroke-dasharray:6 6;stroke-linecap:round;opacity:.85}.explain-callout{position:absolute;left:50%;transform:translate(-50%);top:-8px;translate:0 -100%;z-index:40;background:var(--text);color:var(--paper);border-radius:12px;padding:10px 14px;font-size:15px;line-height:1.4;width:max-content;max-width:min(86vw,380px);box-shadow:0 6px 14px #0000002e}.board-well.revealing .recipe-card,.board-well.revealing .cell.tape{transition:opacity .3s var(--ease-out);opacity:0}.board-well.revealing{animation:tint-settle .6s var(--ease-out)}@keyframes tint-settle{0%{transform:scale(1)}55%{transform:scale(.985)}to{transform:scale(1)}}.reveal-wipe{position:absolute;inset:0;border-radius:inherit;background:var(--paper-2);transform-origin:bottom;animation:tint-wipe .6s var(--ease-out) both;pointer-events:none;z-index:20}@keyframes tint-wipe{0%{transform:scaleY(1)}to{transform:scaleY(0)}}.status-line{min-height:24px;margin-top:10px;font-size:15px;color:var(--text-2);text-align:center}.pots{display:flex;align-items:center;justify-content:center;gap:20px;margin-top:16px}.pot{position:relative;width:56px;height:56px;border-radius:999px;border:1px solid var(--rule);transition:transform .16s var(--ease-spring),box-shadow .16s var(--ease-out)}.pot.selected{transform:translateY(-6px);box-shadow:0 6px 14px #0000001f}.pot.empty{opacity:.55}.pot-fill{position:absolute;left:4px;right:4px;bottom:4px;border-radius:999px 999px 26px 26px;background:#ffffff47;pointer-events:none}.pot.pulse-find{animation:tint-find .6s var(--ease-out)}.drop-token.pulse-find{animation:tint-find .6s var(--ease-out) 2}@keyframes tint-find{50%{transform:scale(1.12)}}.pot-count{position:absolute;right:-4px;top:-4px;min-width:22px;height:22px;border-radius:999px;background:var(--text);color:var(--paper);font-size:13px;font-variant-numeric:tabular-nums;display:grid;place-items:center;padding:0 5px}.pot.eraser{width:44px;height:44px;background:var(--paper-2);display:grid;place-items:center;font-size:18px}.actions{display:flex;justify-content:center;gap:12px;margin-top:16px}.button,.button-primary{min-height:44px;padding:0 18px;border-radius:12px;font-size:15px;display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none}.button{border:1px solid var(--rule);color:var(--text)}.button-primary{background:var(--text);color:var(--paper)}.button:disabled,.button-primary:disabled{opacity:.4;cursor:default}.sheet-backdrop{position:fixed;inset:0;background:#0000004d;z-index:50;display:flex;align-items:flex-end;justify-content:center}.sheet{width:100%;max-width:560px;background:var(--paper);border-radius:20px 20px 0 0;box-shadow:0 -8px 24px #00000024;padding:24px 20px calc(20px + env(safe-area-inset-bottom));animation:tint-sheet-in .22s var(--ease-out)}@keyframes tint-sheet-in{0%{transform:translateY(24px);opacity:0}}.sheet h2{margin:0;font-size:28px;font-weight:700}.sheet .sub{margin-top:6px;color:var(--text-2);font-size:15px}.share-preview{margin-top:14px;background:var(--paper-2);border-radius:12px;padding:12px;font-size:13px;line-height:1.35;white-space:pre-wrap;font-family:ui-monospace,monospace}.sheet-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}.text-toggle{margin-top:12px;font-size:15px;color:var(--text-2);text-decoration:underline}.page-title{font-size:28px;font-weight:700;margin:16px 0 4px}.page-sub{color:var(--text-2);font-size:15px;margin:0 0 16px}.chips{display:flex;gap:8px;margin:12px 0}.chip{min-height:44px;padding:0 16px;border-radius:999px;border:1px solid var(--rule);font-size:15px}.chip.selected{background:var(--text);color:var(--paper);border-color:var(--text)}.field-row{display:flex;gap:8px;align-items:center;margin:10px 0;flex-wrap:wrap}.text-input{min-height:44px;padding:0 12px;border:1px solid var(--rule);border-radius:12px;background:var(--paper);color:var(--text);font-size:15px;width:10em}.stat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px;margin-top:12px}.stat{background:var(--paper-2);border-radius:12px;padding:12px}.stat .value{font-size:22px;font-weight:700;font-variant-numeric:tabular-nums}.stat .label{font-size:13px;color:var(--text-2);margin-top:2px}.settings-row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:52px;border-bottom:1px solid var(--rule)}.settings-row .label{font-size:17px}.seg{display:flex;border:1px solid var(--rule);border-radius:999px;overflow:hidden}.seg button{min-height:36px;padding:0 12px;font-size:13px}.seg button.selected{background:var(--text);color:var(--paper)}.toggle{width:52px;height:32px;border-radius:999px;border:1px solid var(--rule);background:var(--paper-2);position:relative;transition:background .16s var(--ease-out)}.toggle:after{content:"";position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:999px;background:var(--paper);border:1px solid var(--rule);transition:transform .16s var(--ease-out)}.toggle.on{background:var(--text)}.toggle.on:after{transform:translate(20px)}.tutorial-copy{font-size:17px;margin:12px 0;text-align:center;min-height:3.2em}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}