@font-face{font-family:Fredoka;src:url(/fonts/Fredoka-700.woff2)format("woff2");font-weight:700;font-display:swap}.wonder{--b:clamp(104px, 9.6vw, 148px);background:radial-gradient(1.4px 1.4px at 24px 36px, #ffffff8c, transparent 70%), radial-gradient(1.2px 1.2px at 132px 98px, #fff6, transparent 70%), radial-gradient(1.6px 1.6px at 76px 150px, #ffffff59, transparent 70%), radial-gradient(55% 45% at 78% 108%, var(--sky-glow-fuchsia), transparent 70%), radial-gradient(45% 40% at 8% -6%, var(--sky-glow-olo), transparent 72%), radial-gradient(40% 35% at 40% 60%, var(--sky-haze-aqua), transparent 75%), var(--sky-ground);touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;background-size:180px 170px,180px 170px,180px 170px,auto,auto,auto,auto;min-height:100dvh;position:relative;overflow:hidden}.wonder-field{width:58vw;height:78vh;position:absolute;top:7vh;left:4vw}.wonder-bubble{left:var(--x);top:var(--y);width:var(--b);height:var(--b);margin:calc(var(--b) / -2) 0 0 calc(var(--b) / -2);cursor:grab;touch-action:none;-webkit-tap-highlight-color:transparent;animation:.9s cubic-bezier(.2,.8,.2,1) both wonder-rise;animation-delay:calc(var(--i) * 70ms);background:0 0;border:0;border-radius:50%;padding:0;position:absolute}.wonder-bubble[data-dragging]{z-index:5;cursor:grabbing;transition:none}.wonder-bubble[data-flying]{z-index:6;pointer-events:none}.wonder-bubble:focus-visible{outline:3px solid var(--sky-ink);outline-offset:6px}.wonder-drift{width:100%;height:100%;animation:wonder-drift var(--drift) ease-in-out infinite alternate;animation-delay:calc(var(--i) * -1.7s);display:block}.wonder-glass{background:radial-gradient(circle at 50% 46%, #fff 0 56%, color-mix(in srgb, var(--hue) 22%, white) 74%);width:100%;height:100%;box-shadow:0 0 0 3px color-mix(in srgb, var(--hue) 75%, white), 0 0 26px 4px color-mix(in srgb, var(--hue) 55%, transparent), 0 0 70px 10px color-mix(in srgb, var(--hue) 22%, transparent);border-radius:50%;transition:transform .22s cubic-bezier(.34,1.56,.64,1);display:block;position:relative;overflow:hidden}.wonder-glass img{-o-object-fit:cover;object-fit:cover;pointer-events:none;width:118%;height:118%;position:absolute;inset:-9%}.wonder-glass:after{content:"";background:radial-gradient(28% 16% at 30% 18%, #fffffff2, #fff0 100%), radial-gradient(70% 40% at 50% 104%, color-mix(in srgb, var(--hue) 45%, transparent), transparent 70%);box-shadow:inset 0 0 0 2px #ffffff73, inset 0 -8px 18px color-mix(in srgb, var(--hue) 30%, transparent);pointer-events:none;border-radius:50%;position:absolute;inset:0}.wonder-blob{background:radial-gradient(35% 30% at 38% 32%, #ffffffb3, transparent 70%), var(--hue);border-radius:46% 54% 50% 50%/55% 52% 48% 45%;position:absolute;inset:16%}.wonder-bubble:hover .wonder-glass{transform:scale(1.05,.97)}.wonder-bubble:active .wonder-glass,.wonder-bubble[data-dragging] .wonder-glass{transform:scale(1.1,.9)}@keyframes wonder-drift{0%{transform:translate(0)rotate(0)scale(1)}50%{transform:translate(5px,-9px)rotate(2deg)scale(1.02,.985)}to{transform:translate(-6px,4px)rotate(-1.5deg)scale(.99,1.012)}}@keyframes wonder-rise{0%{opacity:0;transform:translateY(36px)scale(.6)}to{opacity:1;transform:none}}.wonder-more{left:calc(4vw + 58vw - var(--sky-control));bottom:max(24px, env(safe-area-inset-bottom));width:var(--sky-control);height:var(--sky-control);background:var(--sky-glass);box-shadow:inset 0 0 0 1px #ffffff24, 0 0 24px var(--sky-glow-olo);color:var(--sky-go);cursor:pointer;z-index:4;border:0;border-radius:50%;place-items:center;padding:0;display:grid;position:absolute}.wonder-more svg{width:44px;height:44px;transition:transform .5s cubic-bezier(.34,1.56,.64,1)}.wonder-more-swirl,.wonder-more-tip{fill:none;stroke:currentColor;stroke-width:5px;stroke-linecap:round;stroke-linejoin:round}.wonder-more-dot{fill:var(--sky-story)}.wonder-more:hover svg{transform:rotate(-40deg)}.wonder-more:active{transform:scale(var(--sky-press))}.wonder-more:focus-visible{outline:3px solid var(--sky-ink);outline-offset:4px}.wonder-forget{top:max(16px, env(safe-area-inset-top));opacity:.7;width:48px;height:48px;position:absolute;right:16px}.wonder-forget svg{fill:none;width:100%;height:100%;stroke:var(--sky-ink-faint);stroke-width:3px;stroke-linecap:round;stroke-linejoin:round}.wj{right:6vw;bottom:max(2vh, env(safe-area-inset-bottom));aspect-ratio:320/400;z-index:3;width:min(29vw,54vh,420px);position:absolute;container-type:inline-size}.wj-art,.wj-fallback{position:absolute;inset:0}.wj-art>.w-rive{width:100%;height:100%;display:block}.wj[data-over] .wj-art{filter:drop-shadow(0 0 22px var(--sky-glow-olo))}.wj-fallback:before{content:"";background:radial-gradient(80% 60% at 40% 30%,#ffffff1a,#8a5cff2e);border:3px solid #bfa5ff;border-radius:22% 22% 26% 26%/14% 14% 18% 18%;position:absolute;inset:30% 12.5% 4%;box-shadow:0 0 30px #8a5cff80}.wj:has(.w-rive-ready) .wj-fallback{display:none}.wj-items{transform-origin:50% 100%;pointer-events:none;flex-wrap:wrap-reverse;place-content:flex-start center;gap:3%;margin:0;padding:0 0 2%;list-style:none;display:flex;position:absolute;inset:36% 18% 9%}.wj-item{--w:34%;width:var(--w);aspect-ratio:1;animation:.5s cubic-bezier(.34,1.56,.64,1) both wj-in,6s ease-in-out infinite alternate wj-bob;position:relative}.wj-items[data-tier=some] .wj-item{--w:29%}.wj-items[data-tier=many] .wj-item{--w:22%}.wj-item:nth-child(2n){animation-delay:0s,-2.1s}.wj-item:nth-child(3n){animation-delay:0s,-3.7s}.wj-pic{box-shadow:0 0 0 2px color-mix(in srgb, var(--hue) 75%, white), 0 0 14px color-mix(in srgb, var(--hue) 60%, transparent);background:#fff;border-radius:50%;position:absolute;inset:0;overflow:hidden}.wj-pic img{-o-object-fit:cover;object-fit:cover;width:118%;height:118%;position:absolute;inset:-9%}.wj-blob{background:var(--hue);border-radius:46% 54% 50% 50%/55% 52% 48% 45%;position:absolute;inset:14%}.wj-num{aspect-ratio:1;background:var(--sky-go);min-width:52%;color:var(--sky-on-go);box-shadow:0 0 0 2px var(--sky-ground), 0 0 12px var(--sky-glow-olo);font:700 7.4cqi/1 "Fredoka", var(--font-body,system-ui), sans-serif;border-radius:50%;place-items:center;animation:.55s cubic-bezier(.34,1.56,.64,1) both wj-num;display:grid;position:absolute;top:-14%;right:-16%}.wj-items[data-tier=many] .wj-num{font-size:5.4cqi}.wj-sheen{pointer-events:none;background:linear-gradient(100deg,#ffffff29 0 7%,#0000 18% 84%,#ffffff12 93%);border-radius:12% 12% 22% 22%;position:absolute;inset:33% 15% 6%}.wj-lid{cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;border-radius:999px;height:27%;padding:0;position:absolute;top:7%;left:17%;right:17%}.wj-lid:focus-visible{outline:3px solid var(--sky-go);outline-offset:2px}@keyframes wj-in{0%{opacity:0;transform:translateY(-120%)scale(.3)}to{opacity:1;transform:none}}@keyframes wj-bob{0%{translate:0;rotate:-2deg}to{translate:0 -4%;rotate:2deg}}@keyframes wj-num{0%{transform:scale(.2)}60%{transform:scale(1.25)}to{transform:scale(1)}}@media (max-width:760px){.wonder{--b:clamp(84px, 24vw, 104px)}.wonder-field{width:auto;left:16px;right:16px;top:max(20px, env(safe-area-inset-top));height:52dvh}.wonder-bubble:nth-child(7){display:none}.wj{width:min(62vw,34dvh,280px);left:50%;right:auto;bottom:max(12px, env(safe-area-inset-bottom));translate:-50%}.wonder-more{left:auto;right:max(16px, env(safe-area-inset-right));bottom:max(16px, env(safe-area-inset-bottom))}}@media (prefers-reduced-motion:reduce){.wonder-bubble,.wonder-drift,.wj-item,.wj-num{animation:none}.wonder-glass,.wonder-more svg{transition:none}}.wonder[data-calm] .wonder-bubble,.wonder[data-calm] .wonder-drift,.wonder[data-calm] .wj-item,.wonder[data-calm] .wj-num{animation:none}