:root{color:var(--ink);background:var(--paper);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--paper:#f4f0e7;--ink:#423c34;--muted:#746b5e;--disabled-ink:#8b8378;--line:#dfd8ca;--card:#faf7f0;--wood-light:#d9b17d;--wood-mid:#c99c65;--wood-dark:#b1834f;--groove-edge:#aa7e4d;--groove:#b88d5a;--frame-shadow:#815d3933;--primary:#454e3e;--primary-ink:#fffdf5;--slot-accent:#274e4a;--color-0:#c64e42;--color-1:#e8b943;--color-2:#51816a;--color-3:#4e7fa6;--ease-out:cubic-bezier(.23, 1, .32, 1);--ease-in-out:cubic-bezier(.77, 0, .175, 1);--ease-drawer:cubic-bezier(.32, .72, 0, 1);--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-6:24px;--text-small:12px;--text-body:14px;--text-sheet-title:25px;--radius-control:13px;--radius-sheet:24px;--touch-target:44px;font-family:Avenir Next,Trebuchet MS,sans-serif}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{overscroll-behavior:none;width:100%;height:100%;margin:0;overflow:hidden}body{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:manipulation}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation;border:0}button,a{-webkit-touch-callout:none}button:disabled{cursor:default}button:focus-visible{outline:3px solid var(--ink);outline-offset:4px}button svg{flex-shrink:0;width:21px;height:21px}button[hidden],[hidden]{display:none!important}#app{background:radial-gradient(ellipse at 50% 20%, #ffffff42, transparent 70%), var(--paper);width:100%;height:100dvh}.game-shell{width:min(100%,496px);height:100%;padding:max(16px, env(safe-area-inset-top)) max(14px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(14px, env(safe-area-inset-left));grid-template-rows:auto minmax(0,1fr) auto;gap:16px;margin:auto;display:grid}.game-header{justify-content:space-between;align-items:center;min-height:56px;display:flex}.header-actions{flex-shrink:0;align-items:center;gap:10px;display:flex}.icon-button{border:1px solid var(--line);width:44px;height:44px;color:var(--muted);transition:transform .14s var(--ease-out), background .14s ease, color .14s ease;background:0 0;border-radius:50%;flex:0 0 44px;justify-content:center;align-items:center;padding:10px;display:inline-flex}.icon-button:active:not(:disabled){transform:scale(.95)}.icon-button:disabled{opacity:.45}@media (hover:hover) and (pointer:fine){.icon-button:hover:not(:disabled){background:var(--card);color:var(--ink)}}.icon-button .icon-exit,html.is-fullscreen .icon-button .icon-enter{display:none}html.is-fullscreen .icon-button .icon-exit{display:block}.brand{align-items:center;gap:12px;display:flex}.brand-mark{grid-template-columns:1fr 1fr;gap:4px;width:29px;height:29px;display:grid;transform:rotate(-7deg)}.brand-mark i{background:var(--color-0);border-radius:50%}.brand-mark i:nth-child(2){background:var(--color-1)}.brand-mark i:nth-child(3){background:var(--color-2)}.brand-mark i:nth-child(4){background:var(--color-3)}h1,h2{font-family:Iowan Old Style,Palatino Linotype,Book Antiqua,Georgia,serif;font-weight:500}h1{letter-spacing:-1.2px;margin:0;font-size:30px;line-height:1.1}.brand p{color:var(--muted);letter-spacing:.1px;margin:5px 0 0;font-size:11px}.move-meter{border-left:1px solid var(--line);flex-direction:column;align-items:center;min-width:59px;padding:5px 0 5px 16px;display:flex}.move-meter>span{color:var(--muted);letter-spacing:1.8px;font-size:8px;font-weight:700}.move-meter strong{font-variant-numeric:tabular-nums;font-family:Iowan Old Style,Georgia,serif;font-size:31px;font-weight:500;line-height:1.2}.play-area{grid-template-rows:auto minmax(0,1fr) auto;gap:12px;min-height:0;display:grid}.target-card{border:1px solid var(--line);background:var(--card);border-radius:17px;justify-content:space-between;align-items:center;gap:18px;padding:12px 18px;display:flex;box-shadow:0 2px #5b422404}.eyebrow{letter-spacing:1.7px;color:var(--muted);text-transform:uppercase;font-size:9px;font-weight:700}.target-caption p{max-width:140px;color:var(--muted);margin:8px 0 0;font-size:12px;line-height:1.5}.target-grid{background:var(--paper);border:1px solid var(--line);border-radius:11px;flex:none;grid-template-columns:repeat(4,1fr);gap:5px;padding:7px;display:grid}.color-0{--disc-color:var(--color-0)}.color-1{--disc-color:var(--color-1)}.color-2{--disc-color:var(--color-2)}.color-3{--disc-color:var(--color-3)}.target-cell{background:var(--disc-color);border-radius:50%;place-items:center;width:17px;height:17px;display:grid;box-shadow:inset 0 1px 1px #ffffff45,0 1px 1px #34200f20}.target-cell span{color:#fff9e5ce;font-family:sans-serif;font-size:7px;line-height:1}.board-wrap{min-height:0;position:relative;container-type:size}.board-mount{aspect-ratio:3/2;width:min(100cqw,150cqh - 27px,480px);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.puzzle-board{isolation:isolate;touch-action:none;background:repeating-linear-gradient(2deg, transparent 0 17px, #84552509 18px, transparent 20px 27px), linear-gradient(115deg, var(--wood-light), var(--wood-mid) 46%, var(--wood-light) 85%, var(--wood-mid));width:100%;height:100%;box-shadow:inset 0 2px 1px #fff6d680, inset 0 -3px 2px #74502b38, 0 6px 0 var(--wood-dark), 0 15px 22px -6px var(--frame-shadow);border:1px solid #926a3c4d;border-radius:26px;position:relative}.board-surface{width:96%;aspect-ratio:var(--top-slots) / var(--board-rows);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);container-type:size}.grooves{pointer-events:none;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.puzzle-board[aria-busy=true] .board-surface{pointer-events:none}.grooves path{fill:none;stroke-linecap:round;stroke-linejoin:round}.groove-edges{stroke:var(--groove-edge);stroke-width:90px;filter:drop-shadow(0 2px #fff1cf50)}.groove-inners{stroke:var(--groove);stroke-width:84px;filter:drop-shadow(0 -2px 1px #63401e36)}.groove-pocket{transform-box:view-box;transform-origin:0 0}.board-surface[data-top-slots="4"] .groove-pocket{visibility:hidden}.frame-pin{background:#78502e5c;border-radius:50%;width:4px;height:4px;position:absolute;box-shadow:0 1px #ffe2ac66}.pin-tl{top:5%;left:5%}.pin-tr{top:5%;right:5%}.pin-bl{bottom:5%;left:5%}.pin-br{bottom:5%;right:5%}.slot-layer,.disc-layer{pointer-events:none;position:absolute;inset:0}.slot{width:calc(100% / var(--top-slots));height:calc(100% / var(--board-rows));pointer-events:auto;touch-action:none;background:0 0;border-radius:50%;min-width:44px;min-height:44px;padding:0;position:absolute;transform:translate(-50%,-50%)}.slot:before{content:"";width:calc(80cqw / var(--top-slots));aspect-ratio:1;transition:transform .15s var(--ease-out), background .15s ease, box-shadow .15s ease;background:#68442633;border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)scale(.15);box-shadow:0 6.5px #ffe6b945}.slot.reachable:before{background:var(--slot-accent);box-shadow:0 0 0 10.5px color-mix(in srgb, var(--slot-accent) 22%, transparent), 0 0 37px color-mix(in srgb, var(--slot-accent) 35%, transparent);transform:translate(-50%,-50%)scale(.375)}.slot.reachable.drop-target:before{box-shadow:0 0 0 6px color-mix(in srgb, var(--slot-accent) 30%, transparent), 0 0 22px color-mix(in srgb, var(--slot-accent) 50%, transparent);transition:transform .26s cubic-bezier(.34,1.56,.64,1),background .15s,box-shadow .2s;transform:translate(-50%,-50%)scale(1)}.slot:disabled{pointer-events:none}.disc{width:calc(100% / var(--top-slots));height:calc(100% / var(--board-rows));pointer-events:auto;z-index:2;touch-action:none;background:0 0;border-radius:50%;place-items:center;min-width:44px;min-height:44px;padding:0;display:grid;position:absolute;transform:translate(-50%,-50%)}.disc-face{width:calc(72cqw / var(--top-slots));aspect-ratio:1;background:radial-gradient(ellipse at 35% 23%, #ffffff35, transparent 65%), var(--disc-color);box-shadow:inset 0 2px 1px #fff6d65e, inset 0 -4px 2px #00000021, 0 3px 0 color-mix(in srgb, var(--disc-color), #332414 25%), 0 5px 5px #55391b4d;transition:transform .16s var(--ease-out), box-shadow .16s var(--ease-out);border:1px solid #36200c1c;border-radius:50%;place-items:center;display:grid}.disc-glyph{color:#fff7dfba;text-shadow:0 1px #442d211c;border:1px solid #fff4d824;border-radius:50%;place-items:center;width:49%;height:49%;font-family:sans-serif;font-size:clamp(13px,3.4vw,20px);line-height:1;display:grid}.disc.selected{z-index:4}.disc.selected .disc-face{box-shadow:inset 0 2px 1px #fff6d680, inset 0 -3px 2px #00000020, 0 3px 0 color-mix(in srgb, var(--disc-color), #332414 25%), 0 0 0 2px #fff3d4dc, 0 9px 10px #55391b5c;transform:translateY(-3px)scale(1.025)}.disc.dragging,.disc.moving{z-index:6;will-change:transform}.disc.dragging .disc-face{transform:translateY(-4px)scale(1.04)}.play-area.entering .disc-face,.play-area.entering .target-cell{animation:enter .2s var(--ease-out) calc(var(--row,0) * 40ms) backwards}@keyframes enter{0%{opacity:0;transform:scale(.96)}}.play-hint{text-align:center;color:var(--muted);margin:0;font-size:11px;line-height:18px}.game-controls{gap:10px;display:grid}.action-buttons{grid-template-columns:1.2fr 1fr 1fr;gap:8px;display:grid}.action{border:1px solid var(--line);background:var(--card);white-space:nowrap;min-height:50px;transition:transform .14s var(--ease-out), background .14s ease, opacity .14s ease;border-radius:13px;justify-content:center;align-items:center;gap:7px;padding:10px 12px;font-size:12px;font-weight:600;display:flex}.action.primary{background:var(--primary);color:var(--primary-ink);border-color:var(--primary);box-shadow:0 3px #28302419}.action:active:not(:disabled){transform:translateY(2px)}.action:disabled{color:var(--disabled-ink);border-color:color-mix(in srgb, var(--line) 60%, transparent);box-shadow:none;background:0 0;font-weight:500}dialog{color:var(--ink);background:var(--card);border:1px solid var(--line);padding:28px;box-shadow:0 20px 80px #20180f36}dialog:not([open]){display:none}.win-dialog{text-align:center;z-index:15;opacity:1;width:min(86vw,350px);max-height:calc(100dvh - 128px);transition:opacity .3s var(--ease-out), transform .3s var(--ease-out), display .3s allow-discrete;border-radius:24px;margin:auto;position:fixed;inset:16px 0 96px;overflow:auto;transform:none}.win-dialog:not([open]){opacity:0;transition:opacity .15s var(--ease-out), transform .15s var(--ease-out), display .15s allow-discrete;transform:translateY(12px)scale(.96)}.win-shade{z-index:10;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);pointer-events:none;opacity:1;transition:opacity .25s var(--ease-out), display .2s allow-discrete;background:#1d170f20;position:fixed;inset:0}.win-shade[hidden]{opacity:0;transition:opacity .15s var(--ease-out), display .15s allow-discrete}.win-emblem{background:color-mix(in srgb, var(--color-1) 20%, transparent);width:64px;height:64px;color:var(--color-1);opacity:1;transition:opacity .3s var(--ease-out) 60ms, transform .3s var(--ease-out) 60ms;border-radius:50%;place-items:center;margin:0 auto 18px;font-size:42px;display:grid;transform:none}@starting-style{.win-dialog[open]{opacity:0;transform:translateY(12px)scale(.96)}.win-dialog[open] .win-emblem{opacity:0;transform:scale(.9)}.win-shade:not([hidden]){opacity:0}}.win-dialog h2{letter-spacing:-.8px;margin:12px 0;font-size:30px;line-height:1.15}.win-dialog p:not(.eyebrow){color:var(--muted);font-size:13px;line-height:1.5}.win-dialog .win-subtitle{margin-bottom:22px;font-size:11px!important}.win-dialog .action{width:100%}.text-button{min-height:44px;color:var(--muted);background:0 0;margin-top:8px;font-size:11px}.confirm-sheet,.settings-sheet{width:min(100%,470px);max-height:calc(100dvh - var(--space-6));padding:var(--space-4) var(--space-6) max(var(--space-6), env(safe-area-inset-bottom));border-radius:var(--radius-sheet) var(--radius-sheet) 0 0;transition:transform .3s var(--ease-drawer), display .2s allow-discrete, overlay .2s allow-discrete;margin:auto;position:fixed;inset:auto 0 0;overflow:auto;transform:none}.confirm-sheet:not([open]),.settings-sheet:not([open]){transition:transform .2s var(--ease-drawer), display .2s allow-discrete, overlay .2s allow-discrete;transform:translateY(100%)}.confirm-sheet::backdrop,.settings-sheet::backdrop{background:color-mix(in srgb, var(--ink) 32%, transparent);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);opacity:0;transition:opacity .2s var(--ease-out), display .2s allow-discrete, overlay .2s allow-discrete}.confirm-sheet[open]::backdrop,.settings-sheet[open]::backdrop{opacity:1}@starting-style{.confirm-sheet[open],.settings-sheet[open]{transform:translateY(100%)}.confirm-sheet[open]::backdrop,.settings-sheet[open]::backdrop{opacity:0}}.sheet-handle{width:36px;height:var(--space-1);margin:0 auto var(--space-6);border-radius:var(--space-1);background:var(--line)}.confirm-sheet h2,.settings-sheet h2{font-size:var(--text-sheet-title);margin:0 0 var(--space-3)}.difficulty-options{gap:var(--space-2);min-width:0;margin:var(--space-6) 0 0;border:0;padding:0;display:grid}.difficulty-options legend{margin-bottom:var(--space-3);font-size:var(--text-small);color:var(--muted);padding:0}.difficulty-options label{align-items:center;gap:var(--space-3);min-height:var(--touch-target);padding:var(--space-3) var(--space-4);border:1px solid var(--line);border-radius:var(--radius-control);background:var(--paper);font-size:var(--text-body);cursor:pointer;display:flex}.difficulty-options label:has(input:checked){border-color:var(--primary)}.difficulty-options input{width:var(--space-4);height:var(--space-4);accent-color:var(--primary);margin:0}.difficulty-options input:focus-visible{outline:3px solid var(--ink);outline-offset:var(--space-1)}.difficulty-options label:has(input:disabled){cursor:default;opacity:.45}.confirm-sheet p{color:var(--muted);margin:0 0 24px;font-size:13px;line-height:1.6}.confirm-actions{grid-template-columns:1fr 1fr;gap:10px;display:grid}.sr-only{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.celebration{z-index:20;pointer-events:none;position:absolute;inset:0;overflow:visible}.celebration i{background:var(--disc-color);opacity:0;width:8px;height:11px;animation:burst 1.3s var(--delay) linear both;border-radius:3px;position:absolute;top:50%;left:50%}@keyframes burst{0%{opacity:0;animation-timing-function:cubic-bezier(.23,1,.32,1);transform:translate(0)rotate(0)}8%{opacity:1}45%{transform:translate(calc(var(--x) * .75), var(--y)) rotate(calc(var(--spin) * .5));animation-timing-function:cubic-bezier(.55,0,1,.45)}80%{opacity:1}to{opacity:0;transform:translate(var(--x), calc(var(--y) + 260px)) rotate(var(--spin))}}@media (prefers-color-scheme:dark){:root{--paper:#222521;--ink:#eee6d5;--muted:#bcb6a6;--disabled-ink:#85877d;--line:#42453c;--card:#2b2e28;--wood-light:#8c6744;--wood-mid:#7a5638;--wood-dark:#513b2a;--groove-edge:#4b3526;--groove:#60452f;--frame-shadow:#0008;--primary:#d5dbc1;--primary-ink:#303b2a;--slot-accent:#f6e4ad}#app{background:radial-gradient(ellipse at 50% 20%, #4e52491c, transparent 70%), var(--paper)}.puzzle-board{box-shadow:inset 0 2px 1px #e6c18e33, inset 0 -3px 2px #20120755, 0 6px 0 var(--wood-dark), 0 15px 22px -6px var(--frame-shadow);border-color:#caa67535}.groove-edges{filter:drop-shadow(0 2px #d8b58624)}.groove-inners{filter:drop-shadow(0 -2px 1px #1c120a70)}.slot:before{background:#1b110c55;box-shadow:0 6.5px #e7cda522}}@media (orientation:portrait){.board-mount{top:auto;bottom:9px;transform:translate(-50%)}}@media (height<=740px) and (orientation:portrait){.game-shell{padding-top:max(12px, env(safe-area-inset-top));padding-bottom:max(8px, env(safe-area-inset-bottom));gap:10px}.game-header{min-height:44px}h1{font-size:27px}.brand p{margin-top:3px;font-size:10px}.move-meter strong{font-size:26px}.target-card{border-radius:13px;padding:8px 14px}.target-caption p{margin-top:5px;font-size:10px}.target-grid{gap:4px;padding:5px}.target-cell{width:14px;height:14px}.play-area{gap:8px}.play-hint{font-size:10px;line-height:14px}.game-controls{gap:8px}.action{min-height:44px;padding:8px 9px;font-size:11px}.settings-sheet .sheet-handle{margin-bottom:var(--space-4)}.difficulty-options{margin-top:var(--space-4)}}@media (width<=360px){.brand{gap:9px}.brand-mark{width:25px;height:25px}h1{font-size:26px}.action{gap:4px}.action svg{width:17px;height:17px}.header-actions{gap:var(--space-1)}.brand-mark{display:none}.move-meter{min-width:var(--touch-target);padding-left:var(--space-2)}.settings-sheet{padding-inline:var(--space-4)}}@media (orientation:landscape) and (height<=600px){.game-shell{width:min(100%,1020px);padding:max(10px, env(safe-area-inset-top)) max(14px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(14px, env(safe-area-inset-left));grid-template-rows:1fr;grid-template-columns:120px minmax(0,1fr) 130px;gap:12px;position:relative}.game-header{grid-area:1/1;align-self:start;align-items:flex-start}.brand{gap:8px}.brand-mark{display:none}h1{font-size:24px}.brand p{max-width:95px;font-size:9px;line-height:1.5}.header-actions{left:max(20px, env(safe-area-inset-left));bottom:max(16px, env(safe-area-inset-bottom));grid-template-columns:repeat(2, var(--touch-target));gap:var(--space-1);display:grid;position:absolute}.move-meter{border:0;gap:0;min-width:0;padding:0}.header-actions .move-meter{grid-column:1/-1}.move-meter>span{font-size:8px}.move-meter strong{font-size:27px}.play-area{grid-area:1/2;grid-template-rows:minmax(0,1fr) auto;gap:8px}.target-card{left:max(14px, env(safe-area-inset-left));text-align:center;justify-content:center;justify-items:center;gap:10px;width:120px;padding:12px 8px;display:grid;position:absolute;top:50%;transform:translateY(-50%)}.target-caption p{display:none}.target-grid{gap:5px;padding:7px}.target-cell{width:17px;height:17px}.board-wrap{grid-row:1}.play-hint{white-space:nowrap;grid-row:2;font-size:9px;line-height:12px}.game-controls{grid-area:1/3;align-self:center;gap:10px}.settings-sheet{padding-top:var(--space-3);padding-bottom:max(var(--space-4), env(safe-area-inset-bottom))}.settings-sheet .sheet-handle{margin-bottom:var(--space-3)}.difficulty-options{margin-top:var(--space-4);grid-template-columns:repeat(3,minmax(0,1fr))}.difficulty-options label{padding-inline:var(--space-3)}.action-buttons{grid-template-columns:1fr;gap:8px}.action{min-height:44px;font-size:11px}.win-dialog{inset:10px max(156px, calc(env(safe-area-inset-right) + 142px)) 10px max(146px, calc(env(safe-area-inset-left) + 132px));width:auto;max-height:calc(100dvh - 20px);padding:20px}.win-emblem{width:40px;height:40px;margin-bottom:10px;font-size:28px}.win-dialog h2{margin:8px 0;font-size:26px}.win-dialog .win-subtitle{margin-bottom:14px}}@media (orientation:landscape) and (height<=600px) and (width<=700px){.game-shell{grid-template-columns:100px minmax(0,1fr) 112px;gap:10px}.target-card{width:100px}.target-grid{gap:4px;padding:5px}.target-cell{width:15px;height:15px}.play-hint{white-space:normal}.win-dialog{inset-inline:124px 136px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;animation:none!important}.disc-face{transition-property:box-shadow}.action{transition-property:background,opacity}.slot:before,.slot.reachable.drop-target:before{transition-property:background,box-shadow}.icon-button{transition-property:background,color}.win-dialog,.win-dialog:not([open]),.win-emblem,.confirm-sheet,.confirm-sheet:not([open]),.settings-sheet,.settings-sheet:not([open]){transform:none!important}.win-dialog,.win-emblem,.win-shade,.confirm-sheet,.confirm-sheet::backdrop,.settings-sheet,.settings-sheet::backdrop{transition:opacity .15s var(--ease-out), display .15s allow-discrete, overlay .15s allow-discrete!important}.confirm-sheet:not([open]),.settings-sheet:not([open]){opacity:0}@starting-style{.confirm-sheet[open],.settings-sheet[open]{opacity:0}}.play-area.entering .disc-layer,.play-area.entering .target-grid{animation:.12s ease-out both fade-in!important}}@keyframes fade-in{0%{opacity:0}}