.dio{--turn-time: .7s;--turn: var(--turn-time) cubic-bezier(.55, .05, .3, 1);--shade-night: rgba(6, 6, 32, .62);--edge-night: rgba(176, 186, 255, .2);--shade-day: rgba(58, 38, 18, .34);--edge-day: rgba(255, 250, 236, .5);--shade: var(--shade-night);--edge: var(--edge-night);position:relative;height:100svh;min-height:560px;overflow:hidden;isolation:isolate;background:#10132f}.dio.is-day{--shade: var(--shade-day);--edge: var(--edge-day)}.stock-night{--shade: var(--shade-night);--edge: var(--edge-night)}.stock-day{--shade: var(--shade-day);--edge: var(--edge-day)}.dio-stage{position:absolute;inset:0;overflow:hidden;touch-action:pan-y;user-select:none;-webkit-user-select:none}.dio-sky{position:absolute;inset:0;background:radial-gradient(95% 70% at 70% 20%,#3a3f8a,#252a69,#161a45 72%,#10132f)}.dio-sky-day{position:absolute;inset:0;opacity:0;will-change:opacity;transition:opacity 1.5s ease;background:radial-gradient(120% 75% at 70% 22%,#fdf6e8,#f6ead6 42%,#efd9bd)}.is-day .dio-sky-day{opacity:1}.dio-sky-grain{position:absolute;inset:0;width:100%;height:100%;opacity:.35;will-change:opacity;transition:opacity 1.4s ease}.is-day .dio-sky-grain{opacity:.9}.dio-pins{position:absolute;inset:0;will-change:opacity;transition:opacity 1.2s ease .5s}.is-day .dio-pins{opacity:0}.dio-pins svg{position:absolute;inset:0;width:100%;height:100%;fill:#fff4d6}.dio-twinkle{animation:dio-fade 1.6s ease-in-out infinite alternate}.dio-twinkle.is-late,.dio-glints.is-late{animation-delay:-1.3s}@keyframes dio-fade{0%{opacity:1}to{opacity:.15}}.dio[data-paused] *,.dio[data-paused] *:before{animation-play-state:paused!important}[data-motion=paused] .dio :is(.dio-twinkle,.dio-glints,.dio-swing){animation-play-state:paused}.dio-layer{position:absolute;left:0;top:0;will-change:transform;pointer-events:none}.dio-layer>svg{display:block;overflow:visible}.dio-sheet{position:absolute;inset:0}.dio-stock{--show-on-top: calc(var(--d, 0s) - .2s);--show-below: calc(var(--d, 0s) - .3s);--hide: calc(var(--d, 0s) + var(--turn-time));position:absolute;left:0;top:0;display:block;overflow:visible;will-change:opacity}.dio-stock.stock-night{transition:visibility 0s linear var(--show-below)}.dio-stock.stock-day{opacity:0;visibility:hidden;transition:opacity var(--turn) var(--d, 0s),visibility 0s linear var(--hide)}.dio.is-day .dio-stock.stock-day{opacity:1;visibility:visible;transition:opacity var(--turn) var(--d, 0s),visibility 0s linear var(--show-on-top)}.dio.is-day .dio-stock.stock-night{visibility:hidden;transition:visibility 0s linear var(--hide)}.dio-flood-edge{flood-color:var(--edge)}.dio-flood-shade{flood-color:var(--shade)}.dio-place>.dio-sheet{animation:dio-place .9s cubic-bezier(.2,.8,.25,1) both;animation-delay:calc(var(--i, 0) * 70ms)}@keyframes dio-place{0%{transform:translateY(7%);opacity:0}to{transform:none;opacity:1}}.dio-layer path,.dio-layer circle{transition:fill var(--turn) var(--d, 0s),opacity var(--turn) var(--d, 0s)}.dio-layer :is(.dio-flood-edge,.dio-flood-shade){transition:flood-color var(--turn) var(--d, 0s)}.dio .grain{fill:url(#dio-grain);pointer-events:none;opacity:.5}.stock-day .grain{opacity:1}.dio .grain.is-page{opacity:.5}.c-planet{fill:#6a4aa8}.stock-day .c-planet{fill:#efc9b4}.c-band{fill:#56399a}.stock-day .c-band{fill:#e7b69c}.c-band2{fill:#8a64c4}.stock-day .c-band2{fill:#f7dfcf}.c-ring{fill:#b8705a}.stock-day .c-ring{fill:#e9a57c}.c-far{fill:#4a508f}.stock-day .c-far{fill:#dcd3ec}.c-hill{fill:#3e4487}.stock-day .c-hill{fill:#c9bde3}.c-hill-lit{fill:#4b5297}.stock-day .c-hill-lit{fill:#d8cfee}.c-roof{fill:#4f579e}.stock-day .c-roof{fill:#e3dcf3}.c-win{fill:#ffd57c}.stock-day .c-win{fill:#8f84bd}.winglow{fill:url(#dio-window-glow);opacity:1}.stock-day .winglow{opacity:0}.c-ridge{fill:#343a7c}.stock-day .c-ridge{fill:#f2b48c}.c-ridge-lit{fill:#414991}.stock-day .c-ridge-lit{fill:#f8caa8}.c-plain{fill:#2b3071}.stock-day .c-plain{fill:#eb9d6c}.c-rim{fill:#373d83}.stock-day .c-rim{fill:#f4b88b}.c-pit{fill:#22265f}.stock-day .c-pit{fill:#d8845a}.c-river{fill:#5763ae}.stock-day .c-river{fill:#b9c2ee}.c-ripple{fill:#b9c1f2}.stock-day .c-ripple{fill:#eef0fb}.dio-glints-wrap{position:absolute;inset:0;transition:opacity var(--turn) var(--d, 0s)}.is-day .dio-glints-wrap{opacity:0}.dio-glints{position:absolute;inset:0;width:100%;height:100%;overflow:visible;fill:#fff3c9;animation:dio-fade 1.3s ease-in-out infinite alternate}.c-bank{fill:#24295f}.stock-day .c-bank{fill:#d9784a}.c-giant{fill:#1a1d4e}.stock-day .c-giant{fill:#2e3380}.c-giant-lit{fill:#292e6d}.stock-day .c-giant-lit{fill:#454ca6}.c-ground{fill:#352b63}.stock-day .c-ground{fill:#f2a65a}.c-chip1{fill:#5a3766}.stock-day .c-chip1{fill:#d9783d}.c-chip2{fill:#443d78}.stock-day .c-chip2{fill:#c9924c}.c-tuft{fill:#2c2a5c}.stock-day .c-tuft{fill:#c07a4a}.c-pebble{fill:#5a5690}.stock-day .c-pebble{fill:#f6e2c4}.c-tower{fill:#262452}.stock-day .c-tower{fill:#3a3f8f}.c-pad{fill:#4a4378}.stock-day .c-pad{fill:#efe3c9}.c-stripe{fill:#e0773a}.stock-day .c-stripe{fill:#f6722b}.c-gem{fill:#6a4fb0}.stock-day .c-gem{fill:#8a64c4}.c-gem-lit{fill:#b48cff}.stock-day .c-gem-lit{fill:#b89ae6}.c-fg{fill:#121439}.stock-day .c-fg{fill:#262b6e}.c-fg2{fill:#1b1d4a}.stock-day .c-fg2{fill:#3a3f8f}.c-bulb{fill:#8a4a86}.stock-day .c-bulb{fill:#f6722b}.c-core{fill:#ffd9a0;filter:url(#dio-soft-glow)}.stock-day .c-core{fill:#ffe7c2;filter:none}.c-mat{fill:var(--background)}.c-llama{fill:#d2cbe4}.stock-day .c-llama{fill:#fbf4e4}.c-llamad{fill:#17152f}.stock-day .c-llamad{fill:#3a2b24}.c-scarf{fill:#c85a2d}.stock-day .c-scarf{fill:#f6722b}.c-rocket{fill:#e7e1ef}.stock-day .c-rocket{fill:#fbf6ea}.c-nose{fill:#e0652c}.stock-day .c-nose{fill:#f6722b}.c-fin{fill:#3f47b5}.stock-day .c-fin{fill:#3245b7}.c-nozzle{fill:#2a2644}.c-porthole-rim{fill:#b9b3d0}.stock-day .c-porthole-rim{fill:#d8cfc0}.c-glass{fill:#ffd57c}.stock-day .c-glass{fill:#3a3f8f}.c-flame1{fill:#f6722b}.c-flame2{fill:#ffd57c}.dio-flame{opacity:0;filter:url(#dio-soft-glow)}.c-puff{fill:#9d96cc;opacity:0}.stock-day .c-puff{fill:#f6ecdb}.dio-hang{position:absolute;top:0;transition:transform 1.6s cubic-bezier(.5,-.28,.25,1.22);transition-delay:var(--hd, 0s)}.dio-hang.is-day-only{transform:translateY(calc(-1px * var(--up)))}.is-day .dio-hang.is-day-only{transform:none}.is-day .dio-hang.is-night-only{transform:translateY(calc(-1px * var(--up)))}.dio-swing{position:relative;transform-origin:50% 0;animation:dio-swing var(--sd, 5s) ease-in-out infinite alternate;animation-delay:var(--sdl, 0s)}@keyframes dio-swing{0%{transform:rotate(-1.6deg)}to{transform:rotate(1.6deg)}}.dio-string{position:absolute;left:50%;top:-100vh;width:1px;margin-left:-.5px;height:calc(var(--len) + 100vh);color:#dcdcff66;background:linear-gradient(color-mix(in srgb,currentColor 22%,transparent),currentColor);transition:color var(--turn) var(--d, 0s)}.is-day .dio-string{color:#4a362299}.dio-hang.is-day-only{--shade: var(--shade-day)}.dio-hang.is-night-only{--shade: var(--shade-night)}.dio-hang.is-day-only .dio-string{color:#4a362299}.dio-hang.is-night-only .dio-string{color:#dcdcff66}.dio-llama-pivot .dio-string{will-change:transform}.dio-obj{position:absolute;left:50%;top:var(--len);transform:translate(-50%,-6%);filter:drop-shadow(0 5px 6px var(--shade))}.dio-obj svg{display:block;overflow:visible}.dio-halo{position:absolute;left:50%;top:50%;width:260%;height:260%;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,#ffecbe4d,#ffecbe1a 34%,#ffecbe00 66%);pointer-events:none}.h-rays{fill:#c8642d}.h-sun{fill:#f29a4a}.h-sun-lit{fill:#f7b877}.h-moon{fill:#f5ecd6}.h-crater{fill:#e3d4b3}.h-star{fill:#e8b865}.h-cloud{fill:#fbf6ea}.h-cloud-shade{fill:#d9a45b29}.dio-llama-pivot{position:absolute;top:0}.dio-llama-swing{position:relative;transform-origin:50% 0;will-change:transform}.dio-llama{position:absolute;left:0;top:var(--len);padding:0;border:0;background:none;cursor:grab;pointer-events:auto;transform:translate(-72%,-3%);filter:drop-shadow(2px 0 0 #fff) drop-shadow(-2px 0 0 #fff) drop-shadow(0 2px 0 #fff) drop-shadow(0 -2px 0 #fff) drop-shadow(0 10px 10px var(--shade-day));will-change:transform}.dio-llama:active{cursor:grabbing}.dio-llama img{display:block;width:100%;height:100%;-webkit-user-drag:none}.dio-llama:focus-visible,.dio-rocket-button:focus-visible{outline:2px dashed #fff6df;outline-offset:6px}.dio-rocket-button{position:absolute;padding:0;border:0;border-radius:40%;background:transparent;cursor:pointer;pointer-events:auto}.dio-confetti{position:absolute;left:0;top:0;will-change:transform;filter:drop-shadow(1px 4px 3px var(--shade-day))}.dio-confetti svg{display:block}.cf-a{fill:#f6722b}.cf-b{fill:#f5ecd6}.cf-c{fill:#b8a4ff}.stock-day .cf-c{fill:#7d6bd6}.dio-vignette{position:absolute;inset:0;pointer-events:none}.dio-vignette:before,.dio-vignette:after{content:"";position:absolute;inset:0;will-change:opacity;transition:opacity 1.4s ease}.dio-vignette:before{box-shadow:inset 0 0 22vmin #02021480}.dio-vignette:after{box-shadow:inset 0 0 16vmin #3c240e33;opacity:0}.is-day .dio-vignette:before{opacity:0}.is-day .dio-vignette:after{opacity:1}.dio-tag-wrap{position:absolute;top:0;left:clamp(24px,5.5vw,96px);z-index:10;transform-origin:50% 0;will-change:transform;filter:drop-shadow(2px 12px 10px var(--shade-day))}.dio-tag-string{display:block;margin:0 auto;width:1px;height:clamp(92px,14vh,136px);background:linear-gradient(#9688a826,#9688a8b3)}.dio-tag{display:grid;width:clamp(280px,23vw,340px);transform-style:preserve-3d;will-change:transform;cursor:pointer}.dio-tag-face{position:relative;grid-area:1 / 1;display:flex;flex-direction:column;align-items:center;padding:48px 24px 14px;text-align:center;background:#f8efdb;color:var(--foreground);clip-path:polygon(22% 0,78% 0,100% 13%,100% 100%,0 100%,0 13%);mask:radial-gradient(circle 8px at 50% 22px,transparent 7.5px,#000 8px);backface-visibility:hidden;will-change:transform}.dio-tag-face.is-back{transform:rotateY(180deg);background:#f4ead3}.dio-tag-face.is-away{pointer-events:none}.dio-tag-face:after{content:"";position:absolute;inset:8px;border:1px dashed rgba(122,78,40,.35);clip-path:polygon(21% 0,79% 0,100% 12.2%,100% 100%,0 100%,0 12.2%);pointer-events:none}.dio-tag-grain{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.dio-tag-face>:not(.dio-tag-grain,.dio-tag-hole,.dio-tag-knot,.dio-stamp){position:relative;z-index:1}.dio-tag-hole{position:absolute;left:50%;top:14px;width:16px;height:16px;margin-left:-8px;border-radius:50%;box-shadow:0 0 0 3.5px var(--cosmic-orange),0 0 0 4.5px #5a381859}.dio-tag-knot{position:absolute;left:50%;top:-2px;width:1px;height:24px;margin-left:-.5px;background:#4a3622b3}.dio-tag-flip{display:inline-flex;align-self:flex-end;align-items:center;gap:6px;margin-top:12px;padding:4px 2px;border:0;background:none;font-size:12px;font-style:italic;color:var(--muted-foreground);cursor:pointer;text-decoration:underline dotted;text-underline-offset:3px;transition:color .2s ease}.dio-tag-flip svg{transition:rotate .5s cubic-bezier(.3,1.6,.5,1)}.dio-tag-flip:hover{color:var(--cosmic-orange)}.dio-tag-flip:hover svg{rotate:180deg}.dio-tag-flip:focus-visible{outline:2px dashed var(--cosmic-orange);outline-offset:2px}.dio-ruled{margin:4px 0 0;padding-top:6px;border-top:1.5px solid rgba(246,114,43,.5);font-size:14px;line-height:24px;text-align:left;text-wrap:pretty;color:var(--muted-foreground);background:repeating-linear-gradient(transparent 0 23px,#3f47b529 23px 24px);background-position:0 4px}.dio-stamp{position:absolute;right:14px;bottom:40px;display:grid;place-content:center;width:62px;height:62px;border:2px solid currentColor;border-radius:50%;box-shadow:inset 0 0 0 3px #f4ead3,inset 0 0 0 4px currentColor;color:#f6722b9e;font-family:var(--font-display);font-size:8px;font-weight:700;letter-spacing:.14em;line-height:1.1;text-align:center;rotate:-14deg;pointer-events:none;mix-blend-mode:multiply}.dio-stamp b{display:block;font-size:20px;letter-spacing:0}.dio-controls{position:absolute;right:clamp(24px,3.6vw,56px);bottom:clamp(28px,4vw,56px);z-index:11;display:flex;gap:12px;align-items:center;will-change:transform}.dio-track{position:relative;width:52px;height:26px;border-radius:13px;background:#3a3f86;box-shadow:inset 0 2px 3px #5032144d}.dio-track:before{content:"";position:absolute;inset:0;border-radius:inherit;background:#d9c7a1;box-shadow:inset 0 2px 3px #5032144d;opacity:0;will-change:opacity;transition:opacity .9s ease}.is-day .dio-track:before{opacity:1}.dio-knob{position:absolute;top:2px;left:2px;width:22px;height:22px;transform:translate(26px);will-change:transform;transition:transform .7s cubic-bezier(.5,-.3,.3,1.35)}.is-day .dio-knob{transform:none}.dio-knob svg{position:absolute;inset:0;width:22px;height:22px;will-change:opacity,transform;transition:opacity .5s ease,transform .7s ease}.dio-knob .k-sun{opacity:0;transform:rotate(90deg)}.is-day .dio-knob .k-sun{opacity:1;transform:none}.is-day .dio-knob .k-moon{opacity:0;transform:rotate(-90deg)}.dio-hint{position:absolute;left:clamp(24px,3.6vw,56px);bottom:clamp(28px,4vw,56px);z-index:11;margin:0;padding:9px 15px;font-size:14px;white-space:nowrap;line-height:1.35;color:#f8efdb;background:#0c0d28cc;clip-path:polygon(0 8%,40% 0,100% 6%,99% 94%,55% 100%,1% 96%);will-change:transform;transition:opacity .8s ease}.dio-hint b{font-weight:600;color:#f7b877}.dio-hint.is-gone{opacity:0}@media(max-width:640px){.dio-tag-wrap{left:50%;margin-left:calc(min(76vw,290px)/-2)}.dio-tag-string{height:80px}.dio-tag{width:min(76vw,290px)}.dio-tag-face{padding:42px 18px 12px}.dio-controls{right:16px;bottom:max(20px,env(safe-area-inset-bottom))}.dio-controls .paper-chip-label,.dio-hint{display:none}}@media(prefers-reduced-motion:reduce){.dio-place>.dio-sheet{animation:none}.dio-hang{transition-duration:.6s}}