:root{--toy-mint: #b7dcc4;--toy-lilac: #cdbfe8;--toy-wood-light: #fbe9cc;--toy-wood: #f0d0a0;--toy-wood-dark: #d4a068;--toy-wood-deep: #8f5f36;--toy-radius: 22px;--toy-radius-lg: 32px;--toy-lip: 6px;--toy-drop: 0 16px 22px -10px rgba(73, 87, 101, .34);--toy-spring: cubic-bezier(.34, 1.56, .64, 1);--toy-soft: cubic-bezier(.25, .8, .3, 1);--toy-focus: var(--peach-dark)}.toy-shell{width:min(var(--toy-width, 920px),calc(100% - 2rem));margin:0 auto;padding-bottom:3rem;color:var(--ink)}.toy-shell :focus-visible{outline:4px solid var(--toy-focus);outline-offset:4px}.toy-shell-bar{display:flex;align-items:center;gap:.75rem;margin-bottom:1.1rem}.toy-round-label{flex:1;color:var(--muted);font-family:var(--font-display);font-size:1.05rem}.toy-stars{display:flex;gap:.3rem;margin:0;padding:0;list-style:none}.toy-star{width:2.35rem;height:2.35rem}.toy-star svg{display:block;width:100%;height:100%;overflow:visible}.toy-star path{fill:color-mix(in srgb,var(--ink) 10%,transparent);stroke:color-mix(in srgb,var(--ink) 26%,transparent);stroke-width:2.5;stroke-linejoin:round;stroke-dasharray:5 4}.toy-star.is-current path{stroke:var(--honey);stroke-dasharray:none;fill:color-mix(in srgb,var(--honey) 22%,transparent)}.toy-star.is-filled path{fill:var(--honey);stroke:#d9a93a;stroke-dasharray:none;filter:drop-shadow(0 3px 0 #d9a93a)}.toy-star.is-filled{animation:toy-pop .52s var(--toy-spring) both}.toy-shell-stage{position:relative}.toy-hint{min-height:1.6em;margin:1.2rem 0 0;color:var(--ink);font-family:var(--font-display);font-size:1.15rem;text-align:center}.toy-pips{display:inline-flex;flex-wrap:wrap;gap:.35rem}.toy-pip{width:.9rem;height:.9rem;border:2px dashed color-mix(in srgb,var(--ink) 30%,transparent);border-radius:999px}.toy-pip.is-filled{border:0;background:var(--peach);box-shadow:0 2px 0 var(--peach-dark);animation:toy-pop .42s var(--toy-spring) both}.toy-btn{--btn-face: var(--peach);--btn-lip: var(--peach-dark);display:inline-flex;align-items:center;justify-content:center;gap:.45rem;min-height:56px;padding:0 1.5rem;border:0;border-radius:999px;background:var(--btn-face);color:#fff;font-family:var(--font-display);font-size:1.25rem;font-weight:700;cursor:pointer;touch-action:manipulation;box-shadow:inset 0 3px #ffffff59,0 var(--toy-lip) 0 var(--btn-lip),var(--toy-drop);transition:transform .16s var(--toy-spring),box-shadow .16s ease}.toy-btn:hover{transform:translateY(-2px)}.toy-btn:active{transform:translateY(4px);box-shadow:inset 0 3px #ffffff59,0 2px 0 var(--btn-lip),0 6px 10px -6px #4957654d}.toy-btn-small{--btn-face: var(--surface);--btn-lip: color-mix(in srgb, var(--paper-deep) 70%, var(--line) 30%);padding:0 1.1rem;color:var(--ink);font-size:1.02rem}.toy-piece{--toy-face: var(--surface);--toy-edge: color-mix(in srgb, var(--toy-face) 72%, #7a5132);position:relative;border:0;border-radius:var(--toy-radius);background:var(--toy-face);color:var(--ink);cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;box-shadow:inset 0 3px #ffffff8c,inset 0 -2px #0000000a,0 var(--toy-lip) 0 var(--toy-edge),var(--toy-drop);transition:transform .18s var(--toy-spring),box-shadow .18s ease,scale .18s var(--toy-spring)}@media(hover:hover){.toy-piece:not(:disabled):hover{transform:translateY(-3px) rotate(-1deg)}}.toy-piece:not(:disabled):active{transform:translateY(4px);box-shadow:inset 0 3px #ffffff8c,0 2px 0 var(--toy-edge),0 6px 10px -6px #4957654d}.toy-board{position:relative;border-radius:var(--toy-radius-lg);background:repeating-linear-gradient(96deg,rgba(143,95,54,.045) 0 2px,transparent 2px 11px),radial-gradient(120% 80% at 30% 0%,rgba(255,255,255,.55),transparent 60%),linear-gradient(180deg,var(--toy-wood-light),var(--toy-wood));padding:clamp(1rem,3vw,1.75rem);box-shadow:inset 0 3px #ffffffb3,inset 0 -3px #8f5f361f,0 10px 0 var(--toy-wood-dark),0 28px 40px -14px #49576561}.toy-board:before,.toy-board:after{content:"";position:absolute;top:-12px;width:92px;height:26px;border-radius:3px;background:repeating-linear-gradient(45deg,rgba(255,255,255,.45) 0 6px,transparent 6px 12px),color-mix(in srgb,var(--pink) 85%,transparent);box-shadow:0 2px 4px #4957651f;pointer-events:none}.toy-board:before{left:22px;transform:rotate(-7deg)}.toy-board:after{right:22px;transform:rotate(6deg);background:repeating-linear-gradient(-45deg,rgba(255,255,255,.45) 0 6px,transparent 6px 12px),color-mix(in srgb,var(--sky) 85%,transparent)}.toy-tray{border:3px dashed color-mix(in srgb,var(--sky) 70%,white);border-radius:var(--toy-radius-lg);background:radial-gradient(circle at 1px 1px,rgba(73,87,101,.07) 1px,transparent 1.5px) 0 0 / 10px 10px,color-mix(in srgb,var(--sky) 20%,var(--surface));padding:clamp(.9rem,3vw,1.4rem);box-shadow:inset 0 4px 10px #49576514}.toy-draggable{touch-action:none;cursor:grab;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-user-drag:none}.toy-draggable *{pointer-events:none;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}.toy-draggable[data-selected]:not([data-dragging]){animation:toy-float 1.3s ease-in-out infinite;outline:4px solid var(--peach);outline-offset:5px}.toy-draggable[data-selected][data-settled]{animation:none}.toy-draggable[data-dragging]{z-index:40;scale:1.12;cursor:grabbing;transition:scale .16s var(--toy-spring);box-shadow:inset 0 3px #ffffff8c,0 var(--toy-lip) 0 var(--toy-edge),0 28px 30px -12px #49576573}.toy-target[data-ready]{animation:toy-breathe 1.6s ease-in-out infinite}.toy-target[data-over]{scale:1.07;transition:scale .16s var(--toy-spring)}.toy-target[data-wrong]{animation:toy-wiggle .48s ease both}.toy-overlay{position:absolute;inset:-.5rem;z-index:30;display:grid;place-items:center;border-radius:var(--toy-radius-lg);background:color-mix(in srgb,var(--paper) 70%,transparent);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);animation:toy-fade-in .24s ease both}.toy-overlay-card{position:relative;display:grid;justify-items:center;gap:.6rem;width:min(24rem,calc(100% - 2rem));border-radius:28px;background:var(--book-cover-paper);padding:2rem 1.5rem 1.6rem;text-align:center;box-shadow:0 8px 0 var(--paper-deep),0 30px 50px -16px #49576573;animation:toy-bounce-in .56s var(--toy-spring) both}.toy-overlay-card:before{content:"";position:absolute;top:-13px;left:50%;width:110px;height:28px;translate:-50% 0;rotate:-3deg;border-radius:3px;background:repeating-linear-gradient(45deg,rgba(255,255,255,.45) 0 6px,transparent 6px 12px),color-mix(in srgb,var(--honey) 88%,transparent);box-shadow:0 2px 4px #4957651f}.toy-overlay-title{font-family:var(--font-display);font-size:clamp(1.9rem,5vw,2.5rem);line-height:1.05}.toy-overlay-text{margin:0 0 .5rem;color:var(--muted);font-size:1.05rem}.toy-cheer-star{width:5.5rem;height:5.5rem;animation:toy-spin-in .7s var(--toy-spring) both}.toy-cheer-star svg{width:100%;height:100%;overflow:visible}.toy-cheer-star path{fill:var(--honey);stroke:#d9a93a;stroke-width:2.5;stroke-linejoin:round;filter:drop-shadow(0 3px 0 #d9a93a)}.toy-sticker{display:inline-grid;place-items:center;width:6.5rem;height:6.5rem;border:6px solid #fff;border-radius:999px;background:radial-gradient(circle at 35% 30%,#fff6d9,var(--honey));box-shadow:0 0 0 2px color-mix(in srgb,var(--ink) 10%,transparent),0 12px 18px -8px #49576573;rotate:-8deg}.toy-sticker-emoji{font-size:3.4rem;line-height:1}.toy-finale-sticker{width:8rem;height:8rem;margin-top:-4.2rem;animation:toy-sticker-in .8s var(--toy-spring) both}.toy-finale-sticker .toy-sticker-emoji{font-size:4.3rem}.toy-fx-layer{position:fixed;inset:0;z-index:1000;overflow:hidden;pointer-events:none}.toy-confetti{position:absolute;box-shadow:0 1px #00000014}.toy-fly-token{position:fixed;z-index:1001;line-height:1;pointer-events:none;filter:drop-shadow(0 6px 6px rgba(73,87,101,.3))}.toy-anim-pop{animation:toy-pop .52s var(--toy-spring) both}.toy-anim-wiggle{animation:toy-wiggle .48s ease both}.toy-anim-in{animation:toy-bounce-in .52s var(--toy-spring) both}@keyframes toy-pop{0%{transform:scale(1)}35%{transform:scale(1.22) rotate(-4deg)}65%{transform:scale(.94) rotate(2deg)}to{transform:scale(1)}}@keyframes toy-wiggle{0%,to{transform:rotate(0)}20%{transform:rotate(-6deg)}45%{transform:rotate(5deg)}70%{transform:rotate(-3deg)}85%{transform:rotate(1deg)}}@keyframes toy-bounce-in{0%{transform:translateY(18px) scale(.6);opacity:0}60%{transform:translateY(-4px) scale(1.06);opacity:1}to{transform:translateY(0) scale(1);opacity:1}}@keyframes toy-float{0%,to{transform:translateY(-4px) rotate(-2deg)}50%{transform:translateY(-10px) rotate(2deg)}}@keyframes toy-breathe{0%,to{box-shadow:0 0 color-mix(in srgb,var(--peach) 0%,transparent)}50%{box-shadow:0 0 0 6px color-mix(in srgb,var(--peach) 35%,transparent)}}@keyframes toy-fade-in{0%{opacity:0}to{opacity:1}}@keyframes toy-spin-in{0%{transform:scale(0) rotate(-180deg)}to{transform:scale(1) rotate(0)}}@keyframes toy-sticker-in{0%{transform:scale(.2) rotate(40deg);opacity:0}60%{transform:scale(1.12) rotate(-6deg);opacity:1}to{transform:scale(1) rotate(0);opacity:1}}@media(max-width:560px){.toy-shell-bar{gap:.5rem}.toy-star{width:1.9rem;height:1.9rem}.toy-round-label{font-size:.92rem;white-space:nowrap}.toy-restart{width:56px;padding:0;font-size:1.4rem}.toy-restart-text{display:none}.toy-board:before,.toy-board:after{width:64px;height:20px;top:-9px}}@media(prefers-reduced-motion:reduce){.toy-shell *,.toy-shell *:before,.toy-shell *:after{animation-duration:1ms!important;animation-iteration-count:1!important;transition-duration:1ms!important}}.sb-shell{--toy-width: 920px;--sb-base: clamp(2.5rem, 7vw, 4.2rem)}.sb-cut{--sb-shadow: 0 5px 4px rgba(60, 40, 20, .28);display:inline-block;line-height:1;filter:drop-shadow(2.5px 0 0 #fff) drop-shadow(-2.5px 0 0 #fff) drop-shadow(0 2.5px 0 #fff) drop-shadow(0 -2.5px 0 #fff) drop-shadow(var(--sb-shadow))}.sb-scene,.sb-scene *,.sb-tray,.sb-tray *,.sb-float{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-user-drag:none}.sb-placed *,.sb-pick *,.sb-art-wrap,.sb-art-wrap *{pointer-events:none}.sb-backdrops{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(.5rem,2vw,1rem);width:min(100%,34rem);margin:0 auto 1.6rem}.sb-backdrop-btn{display:flex;align-items:center;justify-content:center;gap:.5rem;min-height:60px;padding:.4rem .75rem;font-family:var(--font-display);font-size:1.1rem}.sb-backdrop-beach{--toy-face: #d4ecf3}.sb-backdrop-forest{--toy-face: #d3ecdb}.sb-backdrop-night{--toy-face: #d9d4f0}.sb-backdrop-btn[aria-pressed=true]{--toy-face: var(--honey);outline:4px solid #fff;outline-offset:-4px}.sb-backdrop-icon{font-size:1.6rem;line-height:1}.sb-frame{padding:clamp(.6rem,2vw,1rem)}.sb-scene{position:relative;overflow:hidden;aspect-ratio:16 / 10;border-radius:22px;background:#fdf1dc;box-shadow:inset 0 0 0 3px #ffffffa6,0 3px #8f5f3640;cursor:copy;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}.sb-art-wrap{position:absolute;inset:0;animation:toy-fade-in .38s ease both;pointer-events:none}.sb-art{display:block;width:100%;height:100%}.sb-twinkle circle{animation:sb-twinkle 2.2s ease-in-out infinite;transform-box:fill-box;transform-origin:center}.sb-placed{position:absolute;z-index:1;display:grid;place-items:center;min-width:56px;min-height:56px;border:0;border-radius:999px;background:transparent;padding:0;font-size:var(--sb-base);translate:-50% -50%;rotate:var(--r, 0deg);cursor:grab;touch-action:none;-webkit-tap-highlight-color:transparent}.sb-placed[data-lifted]{z-index:5;cursor:grabbing}.sb-placed-scale{position:relative;display:block;scale:var(--s, 1);transition:scale .26s var(--toy-spring),transform .2s var(--toy-spring)}.sb-placed.is-active .sb-placed-scale:after{content:"";position:absolute;left:50%;top:50%;width:1.45em;height:1.45em;translate:-50% -50%;border:3px dashed rgba(255,255,255,.95);border-radius:999px;box-shadow:0 0 0 2px color-mix(in srgb,var(--peach) 55%,transparent);animation:sb-spin 9s linear infinite;pointer-events:none}.sb-placed[data-lifted] .sb-placed-scale{transform:translateY(-8px) rotate(-5deg) scale(1.14)}.sb-placed[data-lifted] .sb-placed-art{--sb-shadow: 0 18px 10px rgba(60, 40, 20, .25)}.sb-placed-art{animation:sb-slap .48s cubic-bezier(.3,.9,.4,1.2) both;transition:filter .2s ease}.sb-scene.is-tada .sb-placed-scale{animation:sb-hop .7s var(--toy-spring) both;animation-delay:calc(var(--i, 0) * 60ms)}.sb-scene.is-peeling .sb-placed-scale{animation:sb-peel .4s ease-in both;animation-delay:calc(var(--i, 0) * 12ms)}.sb-tada-banner{position:absolute;left:50%;top:50%;z-index:10;translate:-50% -50%;border:6px solid #fff;border-radius:999px;background:var(--peach);padding:.3rem 1.6rem .45rem;color:#fff;font-family:var(--font-display);font-size:clamp(2rem,7vw,3.4rem);line-height:1;white-space:nowrap;box-shadow:0 7px 0 var(--peach-dark),0 22px 30px -10px #49576580;pointer-events:none;animation:sb-banner 1.9s var(--toy-spring) both}.sb-float{position:fixed;z-index:1001;font-size:3.4rem;translate:-50% -60%;rotate:-6deg;pointer-events:none;--sb-shadow: 0 18px 10px rgba(60, 40, 20, .25)}.sb-tray{touch-action:none;display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:.4rem;margin-top:1.6rem;border-style:solid;border-color:color-mix(in srgb,var(--toy-lilac) 60%,white);background:linear-gradient(135deg,rgba(255,255,255,.55) 0 30%,transparent 30% 60%,rgba(255,255,255,.35) 60% 70%,transparent 70%),radial-gradient(circle at 1px 1px,rgba(73,87,101,.07) 1px,transparent 1.5px) 0 0 / 10px 10px,color-mix(in srgb,var(--toy-lilac) 22%,var(--surface))}.sb-pick{position:relative;display:grid;place-items:center;min-width:56px;min-height:60px;border:0;border-radius:20px;background:transparent;padding:0;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;animation:toy-bounce-in .46s var(--toy-spring) both}.sb-pick:before{content:"";position:absolute;inset:12%;border:2px dashed color-mix(in srgb,var(--toy-lilac) 80%,var(--ink) 10%);border-radius:999px;opacity:.6}.sb-pick-art{position:relative;font-size:clamp(2rem,5vw,2.6rem);rotate:-4deg;transition:rotate .18s var(--toy-spring),scale .18s var(--toy-spring)}.sb-pick:nth-child(2n) .sb-pick-art{rotate:5deg}@media(hover:hover){.sb-pick:hover .sb-pick-art{scale:1.12;rotate:0deg}}.sb-pick:active .sb-pick-art{scale:.92}.sb-pick.is-picked{background:color-mix(in srgb,var(--honey) 40%,white);box-shadow:0 0 0 3px #fff,0 0 0 6px var(--peach)}.sb-pick.is-picked .sb-pick-art{animation:toy-float 1.4s ease-in-out infinite}.sb-controls{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem;margin-top:1.4rem}.sb-size{display:flex;align-items:center;gap:.5rem;border-radius:999px;background:var(--book-cover-paper);padding:.35rem;box-shadow:0 4px 0 var(--paper-deep),0 12px 18px -12px #49576559}.sb-size-btn{width:60px;padding:0}.sb-size-btn:disabled{opacity:.45;cursor:default;transform:none}.sb-size-glyph{line-height:1}.sb-size-glyph.is-small{font-size:1.05rem}.sb-size-glyph.is-big{font-size:1.9rem}.sb-size-meter{display:flex;align-items:flex-end;gap:.25rem;height:1.5rem}.sb-size-dot{width:.55rem;border-radius:999px;background:color-mix(in srgb,var(--ink) 16%,transparent);transition:background .2s ease}.sb-size-dot:nth-child(1){height:30%}.sb-size-dot:nth-child(2){height:55%}.sb-size-dot:nth-child(3){height:78%}.sb-size-dot:nth-child(4){height:100%}.sb-size-dot.is-on{background:var(--peach)}.sb-actions{display:flex;gap:.75rem}.sb-tada{padding:0 1.8rem;font-size:1.4rem}.sb-note{margin:.6rem 0 0;color:var(--muted);font-size:.92rem;text-align:center}@keyframes sb-slap{0%{transform:translateY(-22px) scale(1.7);opacity:0}30%{opacity:1}55%{transform:translateY(0) scale(1.18,.78)}75%{transform:scale(.94,1.07)}to{transform:scale(1)}}@keyframes sb-hop{0%,to{transform:translateY(0) rotate(0)}35%{transform:translateY(-18px) rotate(-8deg) scale(1.12)}60%{transform:translateY(2px) rotate(5deg) scale(1.05,.93)}80%{transform:translateY(-4px) rotate(-2deg)}}@keyframes sb-peel{0%{transform:scale(1);opacity:1}40%{transform:translateY(-6px) rotate(10deg) scale(1.1);opacity:1}to{transform:translateY(-40px) rotate(-25deg) scale(.4);opacity:0}}@keyframes sb-banner{0%{transform:scale(.2) rotate(-20deg);opacity:0}18%{transform:scale(1.12) rotate(4deg);opacity:1}28%{transform:scale(1) rotate(-2deg)}82%{transform:scale(1) rotate(-2deg);opacity:1}to{transform:scale(.8) rotate(-2deg);opacity:0}}@keyframes sb-twinkle{0%,to{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.6)}}@keyframes sb-spin{to{rotate:360deg}}@media(max-width:560px){.sb-scene{aspect-ratio:1 / 1;border-radius:16px}.sb-backdrop-btn{flex-direction:column;gap:.1rem;padding:.4rem .25rem;font-size:.9rem}.sb-tray{grid-template-columns:repeat(5,minmax(0,1fr));gap:.35rem .25rem}.sb-controls{justify-content:center}.sb-tada{padding:0 1.3rem;font-size:1.25rem}}
