body.sort-puzzle.pp{overscroll-behavior:none}html.sort-puzzle:has(body.pp){overscroll-behavior:none}body.sort-puzzle{--c0:#e0453f;--c1:#2f6fdb;--c2:#f3c22e;--c3:#2f9e57;--c4:#8853d4;--c5:#f07f2a;--c6:#ec6aaa;--c7:#5cc6ef;--c8:#8a5a3b;--c9:#a5cf3a;--c10:#2d3e6c;--c11:#8d9099}.pp-stage.s-stage{-webkit-tap-highlight-color:transparent;flex:auto;align-items:center;min-height:0;padding:16px;overflow:clip;container-type:size}@media (width>=631px){.pp-stage.s-stage{--stage-fit:567px}}.pp-card.s-card{--card-pad:22px;--gap:14px;--hud-h:52px;--tools-h:48px;--tip-h:20px;--chrome:calc(var(--hud-h) + var(--tools-h) + var(--tip-h) + 3 * var(--gap));--avail-w:min(var(--board-max,720px), 100cqw - 2 * var(--card-pad));--avail-h:calc(100cqh - 2 * var(--card-pad) - var(--chrome));box-sizing:border-box;min-width:min(100%,440px);max-width:100%;padding:var(--card-pad);gap:var(--gap);align-items:center;position:relative}.s-probe{width:var(--avail-w);height:max(0px, var(--avail-h));visibility:hidden;pointer-events:none;position:absolute;top:0;left:0}@container (width<=599px){.pp-card.s-card{--card-pad:0px;--gap:12px;background:0 0;border:none;border-radius:0;width:100%;min-width:0;height:100%}.s-board{margin-block:auto}}@container (width<=599px) and (height<=520px){.pp-card.s-card{--chrome:calc(var(--hud-h) + var(--tools-h) + 2 * var(--gap))}.s-tip{display:none}}.s-hud{height:var(--hud-h);flex:none;grid-template-columns:repeat(3,minmax(0,1fr)) auto;align-self:stretch;gap:8px;display:grid}.pp-stat.s-stat{flex-direction:column;justify-content:center;min-width:0;padding:0 8px;display:flex;container-type:inline-size}.s-stat .pp-stat-value{font-size:min(22px, 100cqi / (var(--chars,1) * .62));white-space:nowrap;line-height:24px}.pp-newgame.s-levels{white-space:nowrap;touch-action:manipulation;justify-content:center;align-items:center;gap:8px;padding:0 18px;display:flex}.s-levels-icon{fill:none;stroke:currentColor;stroke-width:2.2px;stroke-linejoin:round;display:none}.s-board{--d:0px;--pick:.15s;width:calc(var(--bw,0) * var(--d));height:calc(var(--bh,0) * var(--d));touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;outline:none;flex:none;position:relative}.s-board:focus-visible{outline-offset:8px;border-radius:8px;outline:3px solid #241f1a}.s-tube{width:calc(1.7 * var(--d));height:calc((var(--head) + var(--th) + .15) * var(--d));translate:calc((var(--x) - .21) * var(--d)) calc((var(--y) - var(--head)) * var(--d));cursor:pointer;position:absolute;top:0;left:0}.s-glass{--edge:max(1.5px, calc(var(--d) * .05));left:calc(.21 * var(--d));top:calc(var(--head) * var(--d));box-sizing:border-box;width:calc(1.28 * var(--d));height:calc(var(--th) * var(--d));border:var(--edge) solid #d8cab2;border-radius:0 0 calc(.64 * var(--d)) calc(.64 * var(--d));background:linear-gradient(90deg,#ffffffd9,#ffffff73 55%,#ffffffbf);border-top:none;position:absolute}.s-glass:before{content:"";left:calc(-.07 * var(--d) - var(--edge));right:calc(-.07 * var(--d) - var(--edge));top:calc(-.05 * var(--d));height:calc(.13 * var(--d));background:#d8cab2;border-radius:99px;position:absolute}@media (hover:hover) and (pointer:fine){.s-tube:hover .s-glass,.s-tube:hover .s-glass:before{background-color:#0000;border-color:#c4b394}.s-tube:hover .s-glass:before{background:#c4b394}}.s-tube.is-selected .s-glass{border-color:#b39c74}.s-tube.is-selected .s-glass:before{background:#b39c74}.s-tube.is-target .s-glass{border-color:#d59a1b;box-shadow:0 0 0 3px #e3ab2e}.s-tube.is-target .s-glass:before,.s-tube.is-hint .s-glass:before{background:#d59a1b}.s-tube.is-cursor .s-glass{outline-offset:calc(.12 * var(--d) + 2px);border-radius:0 0 calc(.64 * var(--d)) calc(.64 * var(--d));outline:3px solid #241f1a}.s-tube.is-hint .s-glass{border-color:#d59a1b;animation:.8s ease-in-out 3 s-hint;box-shadow:0 0 0 3px #e3ab2e}.s-tube.is-hint:not(.is-hint-from):after{content:"";left:50%;top:calc((var(--head) - .62) * var(--d));width:calc(.5 * var(--d));height:calc(.36 * var(--d));clip-path:polygon(0 0,100% 0,50% 100%);background:#d59a1b;animation:.8s ease-in-out 3 s-point;position:absolute;translate:-50%}@keyframes s-hint{50%{box-shadow:0 0 0 6px #e3ab2e59}}@keyframes s-point{50%{translate:-50% calc(.18 * var(--d))}}.s-tube.is-complete .s-glass{border-color:color-mix(in srgb, var(--cap-color) 40%, #d8cab2)}.s-tube.is-complete .s-glass:before{left:calc(-.02 * var(--d) - var(--edge));right:calc(-.02 * var(--d) - var(--edge));top:calc(-.26 * var(--d));height:calc(.3 * var(--d));border-radius:calc(.09 * var(--d));background:var(--cap-color);box-shadow:inset 0 calc(-.07 * var(--d)) 0 #0003;animation:.26s cubic-bezier(.3,1.4,.5,1) s-cap}@keyframes s-cap{0%{translate:0 calc(-.7 * var(--d));opacity:0}}.s-ball{--c:var(--c0);z-index:2;box-sizing:border-box;width:var(--d);height:var(--d);background:radial-gradient(circle at 34% 30%, color-mix(in srgb, var(--c) 40%, #fff) 0 7%, var(--c) 50%, color-mix(in srgb, var(--c) 80%, #000) 100%);box-shadow:inset 0 calc(var(--d) * -.05) 0 #0000001f;translate:calc(var(--x,0) * var(--d)) calc((var(--y,0) - var(--lift,0)) * var(--d));transition:translate var(--pick) cubic-bezier(.2, .7, .3, 1);pointer-events:none;border-radius:50%;justify-content:center;align-items:center;display:flex;position:absolute;top:0;left:0}.s-ball.is-flying{z-index:4;transition:none}.s-board.is-instant .s-ball{transition:none}.s-sym{fill:#ffffffe6;width:46%;height:46%}.c-0{--c:var(--c0)}.c-1{--c:var(--c1)}.c-2{--c:var(--c2)}.c-3{--c:var(--c3)}.c-4{--c:var(--c4)}.c-5{--c:var(--c5)}.c-6{--c:var(--c6)}.c-7{--c:var(--c7)}.c-8{--c:var(--c8)}.c-9{--c:var(--c9)}.c-10{--c:var(--c10)}.c-11{--c:var(--c11)}.c-2 .s-sym,.c-7 .s-sym,.c-9 .s-sym{fill:#241f1a8c}.s-ball.is-new{animation:s-drop .32s cubic-bezier(.3, 1.3, .5, 1) calc(var(--order,0) * 14ms) backwards}@keyframes s-drop{0%{transform:translateY(calc(-1.2 * var(--d)));opacity:0}}.s-board.is-won .s-tube,.s-board.is-won .s-ball{animation:s-hop .46s ease-out calc(var(--t,var(--i,0)) * 60ms + .2s)}@keyframes s-hop{40%{transform:translateY(calc(-.45 * var(--d)))}}@media (prefers-reduced-motion:reduce){.s-ball{transition:none}.s-ball.is-new,.s-board.is-won .s-tube,.s-board.is-won .s-ball,.s-tube.is-complete .s-glass:before,.s-tube.is-hint:after,.s-tube.is-hint .s-glass{animation:none}}.s-tools{height:var(--tools-h);flex:none;grid-template-columns:repeat(3,minmax(0,1fr));align-self:stretch;gap:8px;display:grid}.s-tool,.s-tool:hover{min-width:0;box-shadow:none;color:#3d352c;cursor:pointer;touch-action:manipulation;background:#f2ebdd;border:none;border-radius:12px;justify-content:center;align-items:center;gap:6px;padding:0 4px;font-family:Instrument Sans,system-ui,sans-serif;font-size:15px;font-weight:600;transition:none;display:flex}.s-tool[hidden]{display:none}@media (hover:hover) and (pointer:fine){.s-tool:hover:not(:disabled){background:#eae0cd}.s-tool.s-next:hover{background:var(--accent);filter:brightness(.94)}}.s-tool:active:not(:disabled){background:#e6dbc6}.s-tool svg{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;flex:none}.s-tool:disabled,.s-tool:disabled:hover{color:#b9ae9d;cursor:default}.s-tool.s-next,.s-tool.s-next:hover{background:var(--accent);color:var(--game-accent-ink,#fff)}.s-tool.s-next svg{stroke-width:2.4px}.s-tool:focus-visible,.pp-newgame.s-levels:focus-visible{outline-offset:2px;outline:3px solid #241f1a}.s-tip{height:var(--tip-h);font-size:14px;line-height:var(--tip-h);text-align:center;color:#6f6557;white-space:nowrap;text-overflow:ellipsis;flex:none;align-self:stretch;margin:0;overflow:hidden}.s-tip.is-stuck{color:#8f4a0e;font-weight:600}.s-sr-only,.s-sprites{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.s-picker{box-sizing:border-box;color:#241f1a;overscroll-behavior:contain;background:#fff;border:1px solid #eadfce;border-radius:22px;width:min(440px,100vw - 32px);max-height:min(560px,100dvh - 48px);padding:0;box-shadow:0 30px 80px -30px #241f1a80}.s-picker[open]{display:flex}.s-picker::backdrop{background:#241f1a73}.s-picker-panel{flex-direction:column;flex:auto;min-height:0;padding:18px 18px 20px;display:flex}.s-picker-head{justify-content:space-between;align-items:center;gap:12px;display:flex}.s-picker-title{letter-spacing:-.01em;color:#241f1a;margin:0;font-family:Bricolage Grotesque,sans-serif;font-size:22px;font-weight:800}.s-picker-close,.s-picker-close:hover{width:44px;height:44px;box-shadow:none;color:#3d352c;cursor:pointer;touch-action:manipulation;background:#f2ebdd;border:none;border-radius:12px;flex:none;justify-content:center;align-items:center;padding:0;transition:none;display:flex}.s-picker-close svg{fill:none;stroke:currentColor;stroke-width:2.2px;stroke-linecap:round}.s-picker-note{color:#6f6557;margin:8px 0 14px;font-size:14px;line-height:1.45}.s-picker-grid{flex:auto;grid-template-columns:repeat(auto-fill,minmax(56px,1fr));gap:8px;min-height:0;margin:-4px;padding:4px;display:grid;overflow-y:auto}.s-level,.s-level:hover{height:56px;box-shadow:none;color:#241f1a;cursor:pointer;touch-action:manipulation;background:#f2ebdd;border:2px solid #0000;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:1px;padding:0;transition:none;display:flex}.s-level-number{font-variant-numeric:tabular-nums;font-family:Bricolage Grotesque,sans-serif;font-size:19px;font-weight:800;line-height:1}.s-level-moves{color:#2c6e5e;font-variant-numeric:tabular-nums;font-size:11px;font-weight:600;line-height:1.2}.s-level.is-solved,.s-level.is-solved:hover{background:#dff1ec}.s-level.is-current,.s-level.is-current:hover{border-color:#241f1a}@media (hover:hover) and (pointer:fine){.s-level:hover{background:#eae0cd}.s-level.is-solved:hover{background:#cde9e1}.s-picker-close:hover{background:#eae0cd}}.s-level:focus-visible,.s-picker-close:focus-visible{outline-offset:2px;outline:3px solid #241f1a}.celebration-icon:has(.s-go-tube){background:0 0;width:auto;height:auto}.s-go-tube{--d:24px;width:calc(1.28 * var(--d));height:calc(4.67 * var(--d));margin:calc(.3 * var(--d)) auto 0;position:relative}.s-go-glass{box-sizing:border-box;border-radius:0 0 calc(.64 * var(--d)) calc(.64 * var(--d));background:#ffffffb3;border:2px solid #d8cab2;border-top:none;position:absolute;inset:0}.s-go-glass:before{content:"";left:-2px;right:-2px;top:calc(-.26 * var(--d));height:calc(.3 * var(--d));border-radius:calc(.09 * var(--d));background:var(--c);box-shadow:inset 0 calc(-.07 * var(--d)) 0 #0003;position:absolute}.s-go-tube .s-go-ball{left:calc(.14 * var(--d));top:auto;bottom:calc(.14 * var(--d) + var(--slot) * 1.07 * var(--d));translate:none}.s-go-slot-0{--slot:0}.s-go-slot-1{--slot:1}.s-go-slot-2{--slot:2}.s-go-slot-3{--slot:3}@container (width<=419px){.s-hud{grid-template-columns:repeat(3, minmax(0, 1fr)) var(--hud-h);gap:6px}.pp-newgame.s-levels{padding:0}.s-levels-icon{display:block}.s-levels-label{display:none}}@container (aspect-ratio>=4/3) and (height<=500px){.pp-card.s-card{--card-pad:0px;--gap:10px;--side:200px;--side-gap:20px;--hud-h:48px;--tools-h:44px;--avail-w:calc(100cqw - var(--side) - var(--side-gap));--avail-h:100cqh;grid-template-columns:auto var(--side);column-gap:var(--side-gap);background:0 0;border:none;border-radius:0;grid-template-rows:auto auto 1fr;grid-template-areas:"board hud""board tools""board tip";align-content:center;align-items:start;width:auto;min-width:0;height:auto;display:grid}.s-board{grid-area:board;align-self:center;margin-block:0}.s-hud{grid-area:hud;grid-template-columns:1fr 1fr 1fr;grid-auto-rows:var(--hud-h);height:auto}.pp-newgame.s-levels{grid-column:1/-1;padding:0 8px}.s-levels-icon{display:none}.s-levels-label{display:inline}.s-tools{grid-area:tools;grid-auto-rows:var(--tools-h);height:auto}.s-tool-label{display:none}.s-tip{white-space:normal;text-align:left;grid-area:tip;height:auto;line-height:1.4}}@container (aspect-ratio>=4/3) and (height<=360px){.s-tip{display:none}}@media (height<=500px){body.sort-puzzle .pp-stage.s-stage{padding-top:8px;padding-bottom:8px}}@media (width<=599px){.pp-stage.s-stage{padding:12px}}body.pp.immersive .pp-stage.s-stage{padding:72px 16px 24px}body.pp.immersive .pp-card.s-card{--card-pad:16px;--board-max:900px;background:#fff;border:1px solid #eadfce;border-radius:22px;width:auto;min-width:min(100%,440px);height:auto}body.pp.immersive .pp-card.s-card .s-board{margin-block:0}@media (orientation:landscape) and (height<=500px){body.pp.immersive .pp-stage.s-stage{padding:12px 136px 12px 16px}body.pp.immersive .pp-card.s-card{--card-pad:10px;--avail-w:calc(100cqw - 2 * var(--card-pad) - var(--side) - var(--side-gap));--avail-h:calc(100cqh - 2 * var(--card-pad))}}