*{box-sizing:border-box}html{margin:0;background:#fff;scroll-behavior:auto;scrollbar-gutter:stable}body{margin:0;color:#171611;background:#fff;overflow-x:hidden;font-family:'PT Sans',sans-serif}body.in-story{overflow:hidden;height:100svh}.skip-link{position:fixed;top:8px;left:8px;z-index:100;background:#fff;padding:12px 18px;transform:translateY(-150%);color:#243f35}.skip-link:focus{transform:none}#journey{height:100svh;position:relative;background:#a4cfd5}.hero-stage{position:sticky;top:0;height:100svh;overflow:hidden;display:grid;place-items:center}.scene-frame{height:100%;width:min(100%,177.77778svh);position:relative;overflow:hidden}#story{display:block;border:0;width:100%;height:100%;position:absolute;inset:0;background:#a4cfd5}#illustration{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2;display:block}#illustration[hidden]{display:none}.handoff-active #story{pointer-events:none}.hero-clouds{position:absolute;bottom:-2px;left:0;width:100%;pointer-events:none;z-index:3;opacity:1}.hero-clouds::before{content:"";position:absolute;bottom:0;left:0;right:0;height:4px;background:#fff}.hero-clouds img{display:block;width:100%;height:auto}.hero-clouds[hidden]{display:none}.sound-toggle:focus-visible{outline:2px solid #f26d32;outline-offset:4px}#website{position:relative;z-index:4;background:#fff;outline:none;scroll-margin-top:0}.sound-toggle{position:fixed;bottom:max(20px,env(safe-area-inset-bottom));right:max(20px,env(safe-area-inset-right));z-index:12;display:grid;place-items:center;width:48px;height:48px;border:0;border-radius:50%;color:#fff;background:#fff3;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 3px 12px #302c2514;cursor:pointer}.sound-toggle[hidden]{display:none}.sound-toggle.on-paper{color:#fff;background:#52675e55}.equalizer{height:20px;display:flex;align-items:center;gap:3px}.equalizer i{display:block;width:3px;border-radius:2px;background:currentColor;height:8px}.equalizer i:nth-child(2){height:15px}.equalizer i:nth-child(3){height:20px}.equalizer i:nth-child(4){height:13px}.equalizer i:nth-child(5){height:7px}.sound-toggle.playing i{animation:music-bar 1.25s ease-in-out infinite alternate}.sound-toggle.playing i:nth-child(2){animation-delay:-.7s}.sound-toggle.playing i:nth-child(3){animation-delay:-.3s}.sound-toggle.playing i:nth-child(4){animation-delay:-.9s}.sound-toggle.playing i:nth-child(5){animation-delay:-.5s}@keyframes music-bar{to{transform:scaleY(.35)}}#handoff-error{position:fixed;z-index:30;left:20px;bottom:20px;max-width:370px;margin:0;padding:14px 18px;border-radius:8px;background:#fffaf1;color:#713c26;font:13px/1.5 'PT Sans',sans-serif}#review-panel{position:fixed;z-index:99;top:12px;left:12px;width:265px;padding:10px 12px;background:#fff8e9ee;box-shadow:0 3px 12px #0002;color:#244a40;border-radius:9px;font:11px/1.5 system-ui}#review-panel button{margin:5px 4px 0 0;padding:6px 8px;background:#fff;border:1px solid #b4bdae;border-radius:5px;color:inherit;cursor:pointer}#review-panel output{display:block;margin-top:7px;overflow-wrap:anywhere}body.capture-only #review-panel{display:none}
@media(max-width:620px){.sound-toggle{width:43px;height:43px;bottom:max(14px,env(safe-area-inset-bottom));right:14px}}
@media(prefers-reduced-motion:reduce){.sound-toggle.playing i{animation:none}html{scroll-behavior:auto}}

/* Give iOS a parent-owned hit target when the frozen iframe relinquishes touch. */
.story-skip{position:fixed;left:max(18px,env(safe-area-inset-left,0px));bottom:max(18px,env(safe-area-inset-bottom,0px));z-index:25;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:44px;padding:11px 17px;border-radius:999px;background:#fff6e6f2;box-shadow:0 2px 6px #173d3120;color:#254c40;text-decoration:none;font:600 12px/1.4 'PT Sans',sans-serif;white-space:nowrap;touch-action:manipulation}
.story-skip span{font-size:17px;line-height:1}.story-skip:hover{background:#fff1ce}.story-skip:focus-visible{outline:2px solid #e99324;outline-offset:4px}
body:not(.in-story) .story-skip,.story-skip[hidden]{display:none}
body.in-story #handoff-error{bottom:max(78px,calc(env(safe-area-inset-bottom,0px) + 60px));max-width:calc(100vw - 40px)}
@media(max-width:1080px){.story-skip{left:50%;transform:translateX(-50%);max-width:calc(100vw - 156px)}}
.handoff-scroll-surface{display:none;position:absolute;inset:0;z-index:1;touch-action:pan-y}.handoff-active .handoff-scroll-surface{display:block}
.hero-clouds::after{content:"";position:absolute;inset:auto 0 0;height:30%;background:linear-gradient(to bottom,rgba(255,255,255,0),#fff 94%);pointer-events:none}

/* Safari browser chrome changes the visible height during native scrolling. */
@supports(height:100dvh){.handoff-active .hero-stage{height:100dvh}.handoff-active .scene-frame{width:min(100%,177.77778dvh)}}