.scene{position:relative;width:100%;aspect-ratio:8 / 5;overflow:hidden;border-radius:var(--radius-feature);background:var(--canvas-soft);box-shadow:inset 0 0 0 1px var(--border);isolation:isolate}.scene svg{display:block;width:100%;height:100%}.scene{--illus-sky-top: color-mix(in oklab, var(--forest-soft) 70%, var(--canvas));--illus-sky-bottom: color-mix(in oklab, var(--gold-soft) 90%, var(--canvas));--illus-celestial: color-mix(in oklab, var(--gold) 45%, var(--surface-raised));--illus-cloud: var(--surface-raised);--illus-cloud-shade: color-mix(in oklab, var(--gold-soft) 60%, var(--surface-raised));--illus-cloud-opacity: .9;--illus-night: 0;--illus-far-light: color-mix(in oklab, var(--forest-soft) 60%, var(--gold-soft));--illus-far: color-mix(in oklab, var(--forest-soft) 80%, var(--forest));--illus-foliage: color-mix(in oklab, var(--forest) 55%, var(--forest-soft));--illus-foliage-light: color-mix(in oklab, var(--forest) 35%, var(--gold-soft));--illus-foliage-deep: color-mix(in oklab, var(--forest) 85%, var(--shadow-hard));--illus-wall: color-mix(in oklab, var(--surface-raised) 60%, var(--clay-soft));--illus-wall-shade: color-mix(in oklab, var(--clay-soft) 75%, var(--clay));--illus-roof: color-mix(in oklab, var(--clay) 80%, var(--canvas));--illus-roof-shade: color-mix(in oklab, var(--clay) 80%, var(--shadow-hard));--illus-trim: var(--surface-raised);--illus-door: color-mix(in oklab, var(--forest) 80%, var(--canvas));--illus-curtain: color-mix(in oklab, var(--clay) 35%, var(--surface-raised));--illus-light: var(--gold);--illus-light-soft: color-mix(in oklab, var(--gold) 45%, var(--surface-raised));--illus-glow-strength: .45;--illus-screen: color-mix(in oklab, var(--forest-soft) 55%, var(--surface-raised));--illus-pavement: color-mix(in oklab, var(--canvas-soft) 70%, var(--surface-raised));--illus-ground: color-mix(in oklab, var(--canvas-soft) 70%, var(--border));--illus-ground-shade: color-mix(in oklab, var(--border) 60%, var(--ink-muted));--illus-metal: color-mix(in oklab, var(--forest) 75%, var(--shadow-hard));--illus-room: color-mix(in oklab, var(--gold-soft) 55%, var(--surface-raised));--illus-room-shade: color-mix(in oklab, var(--gold-soft) 80%, var(--clay));--illus-floor: color-mix(in oklab, var(--clay) 40%, var(--gold-soft));--illus-floor-shade: color-mix(in oklab, var(--clay) 80%, var(--shadow-hard));--illus-rug: color-mix(in oklab, var(--forest) 35%, var(--surface-raised));--illus-wood: color-mix(in oklab, var(--clay) 65%, var(--gold));--illus-wood-shade: color-mix(in oklab, var(--clay) 75%, var(--shadow-hard));--illus-paper: var(--surface-raised);--illus-book-a: color-mix(in oklab, var(--forest) 70%, var(--surface-raised));--illus-book-b: color-mix(in oklab, var(--clay) 70%, var(--surface-raised));--illus-book-c: color-mix(in oklab, var(--gold) 70%, var(--surface-raised));--illus-dusk: color-mix(in oklab, var(--clay) 60%, var(--gold));--illus-water: color-mix(in oklab, var(--forest-soft) 55%, var(--gold-soft));--illus-water-deep: color-mix(in oklab, var(--forest) 45%, var(--forest-soft));--illus-mist: var(--illus-sky-bottom);--illus-cast: color-mix(in oklab, var(--shadow-hard) 14%, transparent);--illus-line: var(--ink-muted);--illus-shadow: color-mix(in oklab, var(--shadow-hard) 18%, transparent);--illus-vignette: color-mix(in oklab, var(--shadow-hard) 16%, transparent)}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .scene{--illus-sky-top: color-mix(in oklab, var(--canvas) 80%, var(--forest-soft));--illus-sky-bottom: color-mix(in oklab, var(--forest-soft) 70%, var(--canvas));--illus-celestial: color-mix(in oklab, var(--ink) 88%, var(--gold));--illus-cloud: var(--surface-raised);--illus-cloud-shade: var(--surface);--illus-cloud-opacity: .5;--illus-night: 1;--illus-far-light: color-mix(in oklab, var(--forest-soft) 70%, var(--surface));--illus-far: color-mix(in oklab, var(--canvas-soft) 45%, var(--forest-soft));--illus-foliage: color-mix(in oklab, var(--forest-soft) 75%, var(--canvas));--illus-foliage-light: var(--forest-soft);--illus-foliage-deep: color-mix(in oklab, var(--canvas) 70%, var(--forest-soft));--illus-wall: color-mix(in oklab, var(--surface-raised) 80%, var(--clay-soft));--illus-wall-shade: color-mix(in oklab, var(--surface) 70%, var(--clay-soft));--illus-roof: color-mix(in oklab, var(--clay-soft) 85%, var(--canvas));--illus-roof-shade: color-mix(in oklab, var(--clay-soft) 50%, var(--canvas));--illus-trim: color-mix(in oklab, var(--ink-muted) 45%, var(--surface-raised));--illus-door: color-mix(in oklab, var(--forest-soft) 80%, var(--canvas));--illus-curtain: color-mix(in oklab, var(--clay-soft) 70%, var(--clay));--illus-light-soft: color-mix(in oklab, var(--gold) 75%, var(--ink));--illus-glow-strength: .85;--illus-screen: color-mix(in oklab, var(--forest) 70%, var(--ink));--illus-pavement: color-mix(in oklab, var(--surface) 80%, var(--border));--illus-ground: var(--canvas-soft);--illus-ground-shade: var(--border);--illus-metal: var(--surface-raised);--illus-room: color-mix(in oklab, var(--surface-raised) 75%, var(--clay-soft));--illus-room-shade: color-mix(in oklab, var(--surface) 60%, var(--clay-soft));--illus-floor: color-mix(in oklab, var(--clay-soft) 70%, var(--surface));--illus-floor-shade: color-mix(in oklab, var(--canvas) 70%, var(--clay-soft));--illus-rug: color-mix(in oklab, var(--forest-soft) 80%, var(--surface));--illus-wood: color-mix(in oklab, var(--clay-soft) 60%, var(--clay));--illus-wood-shade: color-mix(in oklab, var(--clay-soft) 70%, var(--canvas));--illus-paper: color-mix(in oklab, var(--ink) 85%, var(--gold));--illus-book-a: var(--forest-soft);--illus-book-b: var(--clay-soft);--illus-book-c: var(--gold-soft);--illus-dusk: var(--shadow-hard);--illus-water: color-mix(in oklab, var(--forest-soft) 45%, var(--canvas));--illus-water-deep: color-mix(in oklab, var(--canvas) 85%, var(--forest-soft));--illus-shadow: color-mix(in oklab, var(--shadow-hard) 45%, transparent);--illus-vignette: color-mix(in oklab, var(--shadow-hard) 45%, transparent)}}:root[data-theme=dark] .scene{--illus-sky-top: color-mix(in oklab, var(--canvas) 80%, var(--forest-soft));--illus-sky-bottom: color-mix(in oklab, var(--forest-soft) 70%, var(--canvas));--illus-celestial: color-mix(in oklab, var(--ink) 88%, var(--gold));--illus-cloud: var(--surface-raised);--illus-cloud-shade: var(--surface);--illus-cloud-opacity: .5;--illus-night: 1;--illus-far-light: color-mix(in oklab, var(--forest-soft) 70%, var(--surface));--illus-far: color-mix(in oklab, var(--canvas-soft) 45%, var(--forest-soft));--illus-foliage: color-mix(in oklab, var(--forest-soft) 75%, var(--canvas));--illus-foliage-light: var(--forest-soft);--illus-foliage-deep: color-mix(in oklab, var(--canvas) 70%, var(--forest-soft));--illus-wall: color-mix(in oklab, var(--surface-raised) 80%, var(--clay-soft));--illus-wall-shade: color-mix(in oklab, var(--surface) 70%, var(--clay-soft));--illus-roof: color-mix(in oklab, var(--clay-soft) 85%, var(--canvas));--illus-roof-shade: color-mix(in oklab, var(--clay-soft) 50%, var(--canvas));--illus-trim: color-mix(in oklab, var(--ink-muted) 45%, var(--surface-raised));--illus-door: color-mix(in oklab, var(--forest-soft) 80%, var(--canvas));--illus-curtain: color-mix(in oklab, var(--clay-soft) 70%, var(--clay));--illus-light-soft: color-mix(in oklab, var(--gold) 75%, var(--ink));--illus-glow-strength: .85;--illus-screen: color-mix(in oklab, var(--forest) 70%, var(--ink));--illus-pavement: color-mix(in oklab, var(--surface) 80%, var(--border));--illus-ground: var(--canvas-soft);--illus-ground-shade: var(--border);--illus-metal: var(--surface-raised);--illus-room: color-mix(in oklab, var(--surface-raised) 75%, var(--clay-soft));--illus-room-shade: color-mix(in oklab, var(--surface) 60%, var(--clay-soft));--illus-floor: color-mix(in oklab, var(--clay-soft) 70%, var(--surface));--illus-floor-shade: color-mix(in oklab, var(--canvas) 70%, var(--clay-soft));--illus-rug: color-mix(in oklab, var(--forest-soft) 80%, var(--surface));--illus-wood: color-mix(in oklab, var(--clay-soft) 60%, var(--clay));--illus-wood-shade: color-mix(in oklab, var(--clay-soft) 70%, var(--canvas));--illus-paper: color-mix(in oklab, var(--ink) 85%, var(--gold));--illus-book-a: var(--forest-soft);--illus-book-b: var(--clay-soft);--illus-book-c: var(--gold-soft);--illus-dusk: var(--shadow-hard);--illus-water: color-mix(in oklab, var(--forest-soft) 45%, var(--canvas));--illus-water-deep: color-mix(in oklab, var(--canvas) 85%, var(--forest-soft));--illus-shadow: color-mix(in oklab, var(--shadow-hard) 45%, transparent);--illus-vignette: color-mix(in oklab, var(--shadow-hard) 45%, transparent)}.scene .night-only{opacity:var(--illus-night)}.scene .day-only{opacity:calc(1 - var(--illus-night))}.scene .layer{transform-box:view-box;transform-origin:50% 72%;translate:calc(var(--cam-x) * var(--d, 1) * 1px) calc(var(--cam-y) * var(--d, 1) * 1px);scale:calc(1 + var(--cam-z) * var(--d, 1));transition:translate calc(var(--motion-step) * 6) var(--ease-out),scale calc(var(--motion-step) * 6) var(--ease-out);animation:layer-idle 22s ease-in-out infinite}.scene .layer__pointer{transform-box:view-box}@keyframes layer-idle{0%,to{transform:translate(0)}25%{transform:translate(calc(var(--d, 1) * 7px),calc(var(--d, 1) * -2.4px))}50%{transform:translate(calc(var(--d, 1) * 1.4px),calc(var(--d, 1) * 3.2px))}75%{transform:translate(calc(var(--d, 1) * -7px),calc(var(--d, 1) * -.8px))}}.scene,.scene[data-scene-step="1"]{--cam-x: 0;--cam-y: 0;--cam-z: 0}.scene[data-scene-step="2"]{--cam-x: -10;--cam-y: 4;--cam-z: .03}.scene[data-scene-step="3"]{--cam-x: 10;--cam-y: 8;--cam-z: .065}.scene[data-scene-step=r]{--cam-x: 0;--cam-y: 26;--cam-z: .01}.scene [data-from],.scene [data-until]{transition:opacity calc(var(--motion-step) * 3) var(--ease-out),transform calc(var(--motion-step) * 3) var(--ease-out)}.scene[data-scene-step="1"] [data-from="2"],.scene[data-scene-step="1"] [data-from="3"],.scene[data-scene-step="1"] [data-from=r],.scene[data-scene-step="2"] [data-from="3"],.scene[data-scene-step="2"] [data-from=r],.scene[data-scene-step="3"] [data-from=r],.scene[data-scene-step="2"] [data-until="1"],.scene[data-scene-step="3"] [data-until="1"],.scene[data-scene-step="3"] [data-until="2"],.scene[data-scene-step=r] [data-until="1"],.scene[data-scene-step=r] [data-until="2"],.scene[data-scene-step=r] [data-until="3"]{opacity:0}.scene[data-scene-step="1"] [data-from="2"],.scene[data-scene-step="1"] [data-from="3"],.scene[data-scene-step="1"] [data-from=r],.scene[data-scene-step="2"] [data-from="3"],.scene[data-scene-step="2"] [data-from=r],.scene[data-scene-step="3"] [data-from=r]{transform:translateY(8px)}.scene .amb{transform-box:fill-box;transform-origin:center}.scene .rise,.scene .mote{opacity:0}.scene .from-base{transform-box:fill-box;transform-origin:50% 100%}.scene .from-top{transform-box:fill-box;transform-origin:50% 0%}@keyframes scene-breathe{0%,to{opacity:.8}50%{opacity:1}}.scene .breathe{animation:scene-breathe 6s ease-in-out infinite}@keyframes scene-flicker{0%,to{opacity:1}8%{opacity:.9}11%{opacity:1}46%{opacity:.95}52%{opacity:1}}.scene .flicker{animation:scene-flicker 9s steps(1,end) infinite}@keyframes scene-drift{0%,to{transform:translate(0)}50%{transform:translate(40px)}}.scene .drift{animation:scene-drift 64s ease-in-out infinite}@keyframes scene-sway{0%,to{transform:rotate(-1.6deg)}50%{transform:rotate(1.6deg)}}.scene .sway{animation:scene-sway 7s ease-in-out infinite}@keyframes scene-pendulum{0%,to{transform:rotate(-.8deg)}50%{transform:rotate(.8deg)}}.scene .pendulum{animation:scene-pendulum 10s ease-in-out infinite}@keyframes scene-bob{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}.scene .bob{animation:scene-bob 5s ease-in-out infinite}@keyframes scene-twinkle{0%,to{opacity:1}50%{opacity:.2}}.scene .twinkle{animation:scene-twinkle 4s ease-in-out infinite}@keyframes scene-rise{0%,to{opacity:0;transform:translate(0) scale(.6)}18%{opacity:.6}88%{opacity:0;transform:translate(-12px,-50px) scale(1.6)}}.scene .rise{animation:scene-rise 7s ease-out infinite}@keyframes scene-mote{0%,to{opacity:0;transform:translate(0)}30%{opacity:.9}70%{opacity:.7}90%{opacity:0;transform:translate(8px,-26px)}}.scene .mote{animation:scene-mote 11s ease-in-out infinite}@keyframes scene-pulse{0%,to{transform:scale(1);opacity:.8}50%{transform:scale(1.1);opacity:1}}.scene .pulse{animation:scene-pulse 5s ease-in-out infinite}.scene.is-paused,.scene.is-paused *{animation-play-state:paused}.scene[data-scene=two-windows] .facade--left,.scene[data-scene=two-windows] .facade--right{transition:transform calc(var(--motion-step) * 6) var(--ease-out)}.scene[data-scene=two-windows][data-scene-step="3"] .facade--left,.scene[data-scene=two-windows][data-scene-step=r] .facade--left{transform:translate(34px)}.scene[data-scene=two-windows][data-scene-step="3"] .facade--right,.scene[data-scene=two-windows][data-scene-step=r] .facade--right{transform:translate(-34px)}.scene[data-scene=table-and-pages] .chair-facing{transform-box:fill-box;transform-origin:50% 100%;transition:transform calc(var(--motion-step) * 6) var(--ease-out)}.scene[data-scene=table-and-pages][data-scene-step="3"] .chair-facing,.scene[data-scene=table-and-pages][data-scene-step=r] .chair-facing{transform:rotate(-8deg)}.scene .clock-hand--hour,.scene .clock-hand--minute{transform-box:fill-box;transform-origin:center;transition:transform calc(var(--motion-step) * 8) var(--ease-out)}.scene[data-scene-step="2"] .clock-hand--minute{transform:rotate(150deg)}.scene[data-scene-step="3"] .clock-hand--minute{transform:rotate(420deg)}.scene[data-scene-step=r] .clock-hand--minute{transform:rotate(560deg)}.scene[data-scene-step="2"] .clock-hand--hour{transform:rotate(12deg)}.scene[data-scene-step="3"] .clock-hand--hour{transform:rotate(35deg)}.scene[data-scene-step=r] .clock-hand--hour{transform:rotate(47deg)}.scene[data-scene=dinner-table] .chair-out--left,.scene[data-scene=dinner-table] .chair-out--right{transition:transform calc(var(--motion-step) * 6) var(--ease-out)}.scene[data-scene=dinner-table][data-scene-step="3"] .chair-out--left,.scene[data-scene=dinner-table][data-scene-step=r] .chair-out--left{transform:translate(-22px)}.scene[data-scene=dinner-table][data-scene-step="3"] .chair-out--right,.scene[data-scene=dinner-table][data-scene-step=r] .chair-out--right{transform:translate(22px)}.scene:after{content:"";position:absolute;inset:0;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='1 0 0 0 0 1 0 0 0 0 1 0 0 0 0 0 0 0 0 0.55'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");background-size:180px 180px;mix-blend-mode:soft-light;opacity:.55;border-radius:inherit}.scene .celestial-path{transition:transform calc(var(--motion-step) * 8) var(--ease-out)}.scene[data-scene-step="2"] .celestial-path{transform:translateY(12px)}.scene[data-scene-step="3"] .celestial-path,.scene[data-scene-step=r] .celestial-path{transform:translateY(28px)}.scene .dusk{opacity:0;transition:opacity calc(var(--motion-step) * 8) var(--ease-out)}.scene[data-scene-step="2"] .dusk{opacity:.35}.scene[data-scene-step="3"] .dusk{opacity:.7}.scene[data-scene-step=r] .dusk{opacity:.45}.scene .fly,.scene .firefly,.scene .bee,.scene .ripple{opacity:0}@keyframes scene-fly{0%,to{opacity:0;transform:translate(0)}8%{opacity:1}86%{opacity:1}94%{opacity:0;transform:translate(360px,-40px)}}.scene .fly{animation:scene-fly 34s linear infinite}@keyframes scene-flap{0%,to{transform:scaleY(1)}50%{transform:scaleY(-.5)}}.scene .flap{transform-box:fill-box;transform-origin:50% 50%;animation:scene-flap .9s ease-in-out infinite}@keyframes scene-firefly{0%,to{opacity:0;transform:translate(0)}20%{opacity:1;transform:translate(6px,-8px)}45%{opacity:.3;transform:translate(-4px,-14px)}70%{opacity:1;transform:translate(8px,-20px)}}.scene .firefly{animation:scene-firefly 7s ease-in-out infinite}.scene .bee{animation:scene-firefly 4s ease-in-out infinite}.scene .ripple{transform-box:fill-box;transform-origin:center}@keyframes scene-ripple{0%,to{opacity:0;transform:scale(.1)}15%{opacity:.8}90%{opacity:0;transform:scale(1)}}.scene .ripple{animation:scene-ripple 6s ease-out infinite}.scene .emerge{opacity:0;transform-box:fill-box;transform-origin:center}@keyframes scene-emerge{0%,to{opacity:0;transform:scale(.6)}25%{opacity:.55}85%{opacity:0;transform:scale(1.9)}}.scene[data-scene-step=r] .emerge{animation:scene-emerge 4.5s ease-out infinite}.scene .spark{opacity:0}@keyframes scene-spark{0%,to{opacity:0;transform:translate(0)}30%{opacity:.9}90%{opacity:0;transform:translateY(-34px)}}.scene[data-scene-step=r] .spark{animation:scene-spark 5s ease-out infinite}