/* Warm paper, native serif text, and softly moving Voronoi mist. */
#cover-title .cover-recipient{display:block;font:500 22px/1.5 'Cormorant Garamond',Georgia,serif;letter-spacing:.23em}
#cover-title .cover-letter{display:block;font:400 clamp(56px,17vw,85px)/1.12 'Cormorant Garamond',Georgia,serif;letter-spacing:-.055em;margin-top:4px}
.story-started .backdrop{background:#e5d6c4;transition:background 1s}
.story-started .ambient-wash{background:radial-gradient(ellipse at 50% 20%,#eed8b880,transparent 70%),#e9ddcb}
.book{box-shadow:2px 2px #d9c8aa,4px 4px #efdfc2,0 12px 30px #49301e30}
.story-page,.paper,.blank-paper-back{background-color:#fbf1df!important;color:#39291f}
.paper,.blank-paper-back{background-image:linear-gradient(100deg,#c8aa7120,transparent 22%,#ffffff08 80%,#9977460a)!important;box-shadow:inset 4px 0 14px #74523012,inset 0 0 2px #99714630}
.blank-paper-back{background-color:#f7ecd7!important}
.paper,.final-page .paper{padding:14px 14px 10px;justify-content:flex-end;isolation:isolate}
.paper:after{z-index:5;background:linear-gradient(90deg,#78502b12,transparent 6%,transparent 95%,#9269320b);box-shadow:inset 0 0 22px #97734608}
.final-page .paper:before{content:none}
.page-illustration,.final-page .page-illustration,.final-page.reveal-complete .page-illustration,.paused .final-page .page-illustration{
  position:absolute;inset:0;z-index:0;width:100%;height:100%!important;border:0;background:#e1cfae;box-shadow:none;clip-path:none;transform:none;
  mask-image:none;-webkit-mask-image:none;animation:none!important;
}
.page-illustration:after{inset:0;border:0;background:linear-gradient(180deg,transparent 45%,#ebd9bb22 65%,#f5e9d455);z-index:8}
.page-art,.final-page .page-art{object-position:50% 50%}
.message-cloud{position:relative;z-index:2;flex:none;width:100%;padding:20px 9px 0;isolation:isolate}
.message-cloud:before{content:none}
.cloud-mist{position:absolute;inset:-32px -45px -50px;z-index:-1;background:#fbf1df;opacity:0;overflow:hidden;mask:url('cloud-text.svg') center/100% 100% no-repeat;-webkit-mask:url('cloud-text.svg') center/100% 100% no-repeat;pointer-events:none}
.cloud-mist:before,.cloud-mist:after{content:'';position:absolute;inset:-28%;background:url('voronoi-cloud.png') 0 0/320px 320px repeat;opacity:.38;animation:cloud-drift 19s ease-in-out infinite alternate;animation-play-state:paused;pointer-events:none}
.cloud-mist:after{opacity:.28;background-size:470px 470px;animation-name:cloud-drift-back;animation-duration:27s}
.page-copy,.paper.long .page-copy,.final-page .page-copy{position:relative;flex:none;display:block;margin:0;padding:0 3px;color:#30241d;font:500 31px/1.24 'Cormorant Garamond',Georgia,serif;letter-spacing:0;text-shadow:0 0 9px #fff5dd90;overflow:visible;opacity:0}
.keepsake-signature,.final-page .keepsake-signature{position:relative;color:#69452d;font:500 28px/1.24 'Cormorant Garamond',Georgia,serif;margin:12px 0 0;opacity:0;animation:none!important;text-shadow:0 0 9px #fff5dd90}
.page-folio,.final-page .page-folio{position:relative;z-index:3;display:block;text-align:center;flex:none;margin:0;padding-top:9px;color:#8c7558;opacity:0}
.story-revealed .cloud-mist{animation:cloud-appear .65s ease-out both}
.story-revealed .page-copy{animation:text-appear .75s ease-out .28s both}
.story-page.story-revealed .keepsake-signature{animation:text-appear .75s ease-out .5s both!important}
.story-revealed .page-folio{animation:text-appear .6s ease-out .4s both}
.story-page.story-revealed.is-current .cloud-mist:before,.story-page.story-revealed.is-current .cloud-mist:after{animation-play-state:running}
.story-read .cloud-mist{animation:none;opacity:.7}
.story-page.story-read .page-copy,.story-read .page-folio,.story-page.story-read .keepsake-signature{animation:none!important;opacity:1}
.book.is-turning .message-cloud *,.book.is-turning .cloud-mist:before,.book.is-turning .cloud-mist:after,.paused .cloud-mist:before,.paused .cloud-mist:after,.page-asleep .message-cloud *,.page-asleep .cloud-mist:before,.page-asleep .cloud-mist:after{animation-play-state:paused!important}
@keyframes text-appear{from{opacity:0}to{opacity:1}}
@keyframes cloud-appear{from{opacity:0}to{opacity:.7}}
@keyframes cloud-drift{from{transform:translate(-18px,-12px) scale(1.02)}to{transform:translate(20px,12px) scale(1.08)}}
@keyframes cloud-drift-back{from{transform:translate(20px,16px) scale(1.08)}to{transform:translate(-20px,-14px) scale(1.02)}}
@media(prefers-reduced-motion:reduce){.story-revealed .cloud-mist{animation:none;opacity:.7}.story-page.story-revealed .page-copy,.story-revealed .page-folio,.story-page.story-revealed .keepsake-signature{animation:none!important;opacity:1}.cloud-mist:before,.cloud-mist:after{animation:none!important}}
.page-folio:before,.page-folio:after,.final-page .page-folio:before,.final-page .page-folio:after{background:#b59a714f}
.book-nav{background:#f8eddbeb;border-color:#d7c6aa;color:#34251c}
.book-nav button{background:#171511;border-color:#b69a72;color:#fae7c4}
.gesture-hint{color:#59432c}
#restart{background:#f7ead7;color:#58412b}
.cover:before{background:#f0e4d4 url('cover-poster.jpg') center/cover no-repeat}
.cover-video{position:absolute;inset:0 -22px;z-index:-1;width:calc(100% + 44px);height:100%;object-fit:cover;pointer-events:none}
.cover-legibility{position:absolute;inset:30% -22px 20%;z-index:0;background:radial-gradient(ellipse at center,#f6ecdbeb 0%,#f6ecdb9c 45%,transparent 72%);pointer-events:none}
.cover .fit-content{position:relative;z-index:1}
.sun-emitter{visibility:hidden}
.sun-halo{width:230px;height:230px;left:-115px;top:-115px;background:radial-gradient(circle,#fffef3 0%,#fff1c6ca 7%,#ffdc969c 17%,#ffbf744a 34%,transparent 68%);animation-duration:2.6s}
.sun-rays{animation-duration:5.2s;filter:none}
.sun-streak{left:-140px;width:280px;height:12px;top:-6px;animation-duration:2.2s;background:radial-gradient(ellipse,#fffefa 0%,#ffeccac9 18%,#ffd48c50 42%,transparent 73%)}
.sun-flare-ghost{animation-duration:2.8s}
.scene-light{animation-duration:4s}
.swipe-track:before{animation:track-shine 2.8s ease-in-out infinite;background:linear-gradient(100deg,transparent 20%,#ffe6b97a 50%,transparent 80%)}
@keyframes sun-heartbeat{from{opacity:.72;transform:scale(.85)}to{opacity:1;transform:scale(1.2)}}
@keyframes sun-rays-drift{from{opacity:.65;transform:rotate(-8deg) scale(.98)}to{opacity:1;transform:rotate(9deg) scale(1.08)}}
@media(max-height:700px){.paper,.final-page .paper{padding:10px 10px 8px}.message-cloud{padding:17px 7px 0}}