/* Selected cream navigation: a conventional compact row before the portrait. */
:root { --preview-cream:#f3ecdf;--preview-plum:#2b1b25;--eva-toolbar-desktop:88px;--eva-toolbar-mobile:64px; }
:root body > .preview-header.preview-header {
 position:sticky!important;top:0!important;z-index:80!important;
 display:grid!important;grid-template-columns:auto minmax(0,1fr)!important;align-items:center!important;gap:24px!important;
 width:100%!important;max-width:1440px!important;left:0!important;right:0!important;margin:0 auto!important;
 height:88px;min-height:88px;padding:20px clamp(24px,6.2vw,88px)!important;
 color:var(--preview-cream)!important;border:0!important;border-radius:0;
 background:transparent!important;box-shadow:none!important;text-shadow:none;
 isolation:isolate;mix-blend-mode:normal;filter:none;backdrop-filter:none;-webkit-backdrop-filter:none;will-change:auto;overflow:visible;box-sizing:border-box;
}
:root .eva-toolbar-space { display:none!important; }
:root body > .preview-header.preview-header::before,
:root body > .preview-header.preview-header::after { display:none!important; }
:root body > .preview-header.preview-header[data-menu-open] { translate:0 0;opacity:1;pointer-events:auto; }
:root body > .preview-header.preview-header.is-toolbar-hidden { translate:0 calc(-100% - env(safe-area-inset-top,0px) - 12px); }
.preview-brand-group { display:flex;align-items:center;gap:14px;justify-self:start;min-width:0;border-radius:24px;padding:0 12px;background:var(--preview-cream);color:var(--preview-plum); }
.preview-brand { display:block;font:500 12px/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:inherit;white-space:nowrap;padding:10px 0; }
:root .preview-header .preview-nav {
 display:flex;grid-column:2;align-items:center;justify-content:center;justify-self:end;width:auto!important;max-width:100%;
 gap:8px!important;padding:2px 16px!important;border-radius:24px;background:var(--preview-cream);color:var(--preview-plum);
 font:400 15px/1.3 var(--sans)!important;letter-spacing:0!important;box-shadow:none;
}
:root .preview-header .preview-nav a {
 display:flex;align-items:center;justify-content:center;min-height:44px;padding:10px 14px!important;color:var(--preview-plum)!important;
 border:0!important;border-radius:20px;white-space:nowrap;text-decoration:none;opacity:1;background:transparent;text-shadow:none;
}
:root .preview-header .preview-nav a::after { display:none!important; }
:root .preview-header .preview-nav a:hover { background:#d798ac20; }
:root .preview-header .preview-nav a[aria-current] { text-decoration:underline;text-underline-offset:7px;text-decoration-thickness:2px;text-decoration-color:#d798ac; }
:root .preview-header .preview-nav a:focus-visible,
.preview-brand:focus-visible,.preview-menu-toggle:focus-visible { outline:2px solid #a45f78;outline-offset:3px; }
.preview-menu-toggle { display:none;border:0;border-radius:22px;background:var(--preview-cream);color:var(--preview-plum);font:400 15px/1 var(--sans);min-height:44px;padding:12px 18px;cursor:pointer;text-shadow:none; }
:root .preview-header .eva-audio-player { justify-self:auto;width:30px; }
:root .preview-header .eva-melody-button { color:#bd8399;background:transparent;border:0;min-width:30px;width:30px;height:40px;min-height:40px; }
:root .preview-header .eva-melody-mark { width:21px;height:27px; }
:root .preview-header .eva-melody-heart,:root .preview-header .eva-melody-note { stroke:currentColor; }
.hero-scene::before { background:linear-gradient(90deg,#1b0d18a3,#21111b55 28%,transparent 62%); }
.hero-introduction > p { max-width:270px;text-shadow:0 1px 10px #1b0d1855; }
@media(max-width:1000px) and (min-width:801px) {
 :root body > .preview-header.preview-header { gap:16px!important;padding-inline:28px!important; }
 :root .preview-header .preview-nav { gap:2px!important;font-size:14px!important;padding-inline:10px!important; }
 :root .preview-header .preview-nav a { padding-inline:10px!important; }
 .preview-brand { font-size:11px;letter-spacing:.12em; }
 .preview-brand-group { gap:8px; }
}
@media(max-width:1280px) {
 :root { --eva-toolbar-desktop:64px; }
 :root body > .preview-header.preview-header { height:64px;min-height:64px;padding:10px 20px!important;grid-template-columns:minmax(0,1fr) auto!important;gap:10px!important; }
 .preview-brand { font-size:11px;letter-spacing:.13em; }
 .preview-brand-group { gap:10px; }
 .preview-menu-toggle { display:block;grid-column:2;grid-row:1;justify-self:end; }
 :root .preview-header .eva-audio-player { width:28px; }
 :root .preview-header .preview-brand-group { padding-inline:10px; }
 :root .preview-header .preview-nav {
  display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 10px!important;visibility:hidden;opacity:0;pointer-events:none;translate:0 -6px;transition:opacity 180ms ease,translate 220ms cubic-bezier(.22,.72,.24,1),visibility 0s linear 220ms;position:absolute;grid-area:auto!important;justify-self:stretch;top:calc(100% + 8px);left:20px!important;right:20px!important;
  width:calc(100% - 40px)!important;max-width:none!important;padding:14px 16px!important;margin-top:0;
  border-radius:14px;box-shadow:none;font-size:17px!important;
  max-height:calc(100dvh - 84px);overflow-y:auto;overscroll-behavior:contain;
 }
 :root body > .preview-header.preview-header[data-menu-open] { height:64px;min-height:64px; }
 :root .preview-header[data-menu-open] .preview-nav { visibility:visible;opacity:1;pointer-events:auto;translate:0 0;transition-delay:0s; }
 :root .preview-header .preview-nav a { min-height:44px;padding:10px 12px!important;font-size:17px;justify-content:flex-start; }
}
@media(prefers-reduced-motion:reduce) {
 :root body > .preview-header.preview-header { transition:opacity 120ms ease!important; }
 :root body > .preview-header.preview-header.is-toolbar-hidden { translate:0 0!important; }
 :root .preview-header .preview-nav { translate:0 0!important;transition:opacity 120ms ease,visibility 0s linear 120ms!important; }
 :root .preview-header[data-menu-open] .preview-nav { transition-delay:0s!important; }
}


/* The original portrait is one continuous scene, including behind the header.
   Its upper-left velvet supplies the menu's space without a second image seam. */
.preview-home { margin-top:-88px; }
@media(max-width:1280px) { .preview-home { margin-top:-64px; } }

/* Homepage: one route per chapter, with the physical diary intact. */
.preview-home .hero-scene { --hero-menu-space:0px;height:clamp(650px,65vw,960px); }
.preview-home .hero-visual {
  inset:0;width:100%;height:100%;
  -webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - var(--preview-photo-feather,150px)),transparent);
  mask-image:linear-gradient(to bottom,#000 calc(100% - var(--preview-photo-feather,150px)),transparent);
}
.preview-home .hero-visual::before { display:none; }
@media(max-width:700px) { .preview-home .hero-visual { --preview-photo-feather:120px; } }
.preview-home .hero-content { position:absolute;inset:0;pointer-events:none; }
.preview-home .hero-introduction { position:absolute;left:7%;top:24%;max-width:470px;pointer-events:auto; }
.preview-home .hero-introduction h1 { font-size:clamp(74px,8.4vw,124px);line-height:.97;letter-spacing:-.065em; }
.preview-home .hero-introduction > p { font-size:clamp(17px,1.7vw,23px);line-height:1.35;max-width:290px;margin-top:22px; }
.preview-home .hero-introduction .pill-link { margin-top:24px; }
.preview-home .hello-note { top:auto;left:31%;bottom:12%;right:auto;width:clamp(225px,24vw,330px);padding:22px 25px 20px;transform:rotate(5deg);z-index:2; }
.preview-home .hello-note > p { font-size:clamp(24px,2.6vw,34px); }
.preview-home .hello-note .sweet-note { gap:8px; }
.preview-home .hello-note .sweet-note > span { font-size:clamp(18px,1.7vw,24px); }
.preview-home .little-girl-feature { padding-block:44px 68px; }
.preview-home .little-girl-opening { align-items:center;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:10%; }
.preview-byline { font:400 12px/1.5 var(--sans);letter-spacing:.05em;color:#d4bec8;margin-bottom:17px; }
.preview-home .little-girl-copy h2 { font-size:clamp(54px,6vw,78px); }
.preview-home .preview-song-letter { display:block;width:100%;max-width:490px;margin:26px 0 20px;padding:28px 8% 112px; }
.preview-song-letter .little-girl-letter-copy > p:not(.visually-quiet) { font:400 24px/1.28 var(--hand);color:#654754; }
.preview-song-letter .little-girl-letter-copy > .little-girl-letter-greeting { font-size:27px!important;margin-bottom:14px;color:#a15f78!important; }
.preview-home .little-girl-actions { align-items:flex-start;gap:7px;margin-top:16px; }
.preview-home .little-girl-actions[tabindex="-1"]:focus { outline:none; }
.preview-home .little-girl-actions > a { min-height:46px;padding:12px 20px; }
.preview-home .little-girl-actions > .preview-story-link { display:inline-flex;justify-content:flex-start;gap:20px;padding:8px 0;min-width:0;min-height:40px;border:0;border-radius:0;background:transparent;color:#dfcbd2;font-size:13px;text-decoration:underline;text-underline-offset:5px;text-decoration-color:#dfcbd244; }
.preview-home .home-app-options { width:auto;max-width:330px;text-align:left; }
.preview-home .home-app-options > summary { padding-block:9px;min-height:40px; }
.preview-home .little-girl-keepsake { width:132px;right:-58px;top:-24px; }
.preview-home .little-girl-video-caption { font-size:24px;min-height:52px;white-space:normal;line-height:1.2;padding:10px 4px; }
.preview-home .latest-scene.latest-scene--quiet { padding-top:22px;padding-bottom:74px; }
.preview-home .release-invitation { width:min(760px,100%);margin-inline:auto;gap:42px; }
.preview-home .release-invitation > a { width:176px;flex:none; }
.preview-home .release-invitation img { width:100%; }
.preview-home .release-invitation h2 { font-size:44px;line-height:1.05;margin:0 0 12px; }
.preview-home .release-invitation p:not(.preview-byline) { font-size:16px;line-height:1.65;max-width:390px; }
.preview-home .release-invitation .preview-byline { margin-bottom:9px;font-family:var(--hand);font-size:23px;color:#d7afc0;letter-spacing:0; }
.preview-home .song-list > li { display:block; }
.preview-home .song-list .home-song-story { display:flex;align-items:center;gap:18px;width:100%;padding:25px 0;min-height:84px; }
.preview-home .song-list .song-copy { flex:1; }
.preview-home .song-list .song-copy strong { font-size:clamp(23px,2.25vw,32px); }
.preview-home .song-list .home-song-story > .icon { width:18px;height:18px;color:#8f776d; }
.preview-home .preview-music-cloth { padding-bottom:34px; }
.preview-home .videos-scene { padding-top:70px;padding-bottom:80px; }
.preview-home .videos-layout { align-items:center; }
.preview-home .home-featured-video { margin:0; }
.preview-home .preview-all-videos { margin-top:26px;font-size:15px;gap:24px; }
.preview-home .preview-story-cloth { padding-top:40px;padding-bottom:45px; }
.preview-home .story-scene { padding-top:12px;padding-bottom:20px; }
.preview-home .little-scene { margin-block:48px;padding-block:70px; }
.preview-contact { position:relative;isolation:isolate;width:calc(100% - 12%);max-width:1200px;margin:40px auto 72px;padding:66px 8%;color:#403235; }
.preview-contact > .wide-paper { position:absolute;inset:0;z-index:-1; }
.preview-contact h2 { font:400 clamp(36px,4.5vw,62px)/1.08 var(--sans);letter-spacing:-.055em; }
.preview-contact h2 em { color:#a1677c;font-style:normal; }
.preview-contact p { max-width:590px;font:400 17px/1.65 var(--sans);margin-top:21px; }
.preview-contact-email { display:inline-flex;align-items:center;gap:26px;margin-top:30px;min-height:46px;font-size:clamp(18px,2.5vw,29px);border-bottom:1px solid #a4758766;user-select:text; }
.preview-contact-email .icon { width:20px;height:20px;flex:none; }
.preview-home .footer-v17 { padding-top:15px;padding-bottom:30px; }
.preview-home .footer-copy { display:flex;align-items:baseline;gap:30px;flex-wrap:wrap; }
.preview-home .footer-copy h2 { font-size:44px; }
.preview-home .footer-copy p { margin:0;color:#ddcbd3;font-size:15px; }
.preview-home .social-keepsakes { display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;align-items:end;margin-top:32px; }
.preview-home .social-card { display:grid;grid-template-rows:170px auto;gap:12px;min-width:0; }
.preview-home .social-object { display:flex!important;align-items:flex-end;justify-content:center;height:170px;min-height:0; }
.preview-home .social-object img { display:block!important;position:static;width:auto;max-width:100%;height:auto;max-height:160px;object-fit:contain; }
.preview-home .social-label { min-height:52px;padding:14px 18px!important;display:flex;align-items:center; }
.preview-home .social-title { display:flex;width:100%;justify-content:space-between;font-size:15px; }
.preview-home .footer-signoff { margin-top:45px; }
.preview-home .footer-meta a { font-size:13px; }
@media(min-width:801px) and (max-width:1000px) {
  .preview-home .hello-note { left:45%;bottom:8%; }
  .preview-home .little-girl-opening { gap:7%; }
  .preview-home .little-girl-keepsake { width:116px;right:-40px;top:-28px; }
  .preview-song-letter .little-girl-letter-copy > p:not(.visually-quiet) { font-size:22px; }
  .preview-home .preview-song-letter { padding-bottom:98px; }
}
@media(max-width:800px) {
  .preview-home .hero-scene { height:580px; }
  .preview-home .hero-visual { height:570px; }
  .preview-home .hero-introduction { left:24px;top:145px;max-width:245px; }
  .preview-home .hero-introduction h1 { font-size:58px;line-height:.98; }
  .preview-home .hero-introduction > p { font-size:16px;line-height:1.4;max-width:215px;margin-top:21px; }
  .preview-home .hero-introduction .pill-link { width:auto;font-size:13px;padding:13px 17px;margin-top:21px; }
  .preview-home .hello-note { left:auto;right:22px;bottom:26px;width:212px;padding:18px 21px 15px; }
  .preview-home .hello-note > p { font-size:25px; }
  .preview-home .hello-note .sweet-note > span { font-size:18px; }
  .preview-home .little-girl-feature { padding:20px 24px 45px; }
  .preview-home .little-girl-opening { display:flex;flex-direction:column;gap:28px; }
  .preview-home .little-girl-copy { display:contents; }
  .preview-home .little-girl-heading-group { order:0;width:100%;max-width:500px; }
  .preview-home .little-girl-copy h2 { font-size:59px; }
  .preview-home .preview-song-letter { order:3;margin:4px 0 0;max-width:500px;padding:27px 9% 105px; }
  .preview-song-letter .little-girl-letter-copy > p:not(.visually-quiet) { font-size:23px;line-height:1.3; }
  .preview-home .little-girl-actions { order:2;width:100%;max-width:500px;align-items:flex-start;margin-top:0; }
  .preview-home .little-girl-film-stage { order:1;width:270px;max-width:calc(100% - 30px);margin-top:0; }
  .preview-home .little-girl-keepsake { width:116px;right:-28px;top:-28px; }
  .preview-home .little-girl-video-caption { font-size:23px; }
  .preview-home .latest-scene.latest-scene--quiet { padding:24px 24px 52px; }
  .preview-home .release-invitation { display:grid;grid-template-columns:110px minmax(0,1fr);gap:24px;align-items:center; }
  .preview-home .release-invitation > a { width:110px; }
  .preview-home .release-invitation h2 { font-size:32px; }
  .preview-home .release-invitation p:not(.preview-byline) { font-size:14px;line-height:1.5; }
  .preview-home .release-invitation .preview-byline { font-size:21px;line-height:1.1; }
  .preview-home .release-invitation .underlined-link { font-size:13px;gap:15px; }
  .preview-home .song-list .home-song-story { min-height:63px;padding:17px 0;gap:13px; }
  .preview-home .song-list .song-copy strong { font-size:21px; }
  .preview-home .preview-music-cloth { padding-bottom:22px; }
  .preview-home .videos-scene { padding:44px 24px 50px; }
  .preview-home .videos-layout { gap:28px; }
  .preview-home .preview-all-videos { margin-top:22px;font-size:14px; }
  .preview-home .preview-story-cloth { padding-top:28px;padding-bottom:24px; }
  .preview-home .story-scene { padding-top:12px;padding-bottom:15px; }
  .preview-home .little-scene { margin-block:32px;padding-block:44px; }
  .preview-contact { width:calc(100% - 28px);padding:38px 24px 43px;margin:30px auto 48px; }
  .preview-contact h2 { font-size:39px; }
  .preview-contact p { font-size:15px;margin-top:18px; }
  .preview-contact-email { font-size:18px;gap:10px;margin-top:25px; }
  .preview-contact-email .icon { width:16px;height:16px; }
  .preview-home .footer-copy { gap:10px;display:block; }
  .preview-home .footer-copy h2 { font-size:39px; }
  .preview-home .footer-copy p { margin-top:12px;font-size:14px; }
  .preview-home .social-keepsakes { grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 20px;margin-top:25px; }
  .preview-home .social-card { grid-template-rows:125px auto;gap:10px; }
  .preview-home .social-object { height:125px; }
  .preview-home .social-object img { max-height:120px; }
  .preview-home .social-label { min-height:48px;padding:13px 14px!important; }
  .preview-home .social-title { font-size:14px; }
}
@media(max-width:360px) {
  .preview-home .hero-introduction { left:21px;top:141px; }
  .preview-home .hero-introduction h1 { font-size:52px; }
  .preview-home .hero-introduction > p { font-size:15px;max-width:190px; }
  .preview-home .hello-note { right:15px;width:195px; }
  .preview-home .little-girl-feature { padding-inline:22px; }
  .preview-home .little-girl-copy h2 { font-size:54px; }
  .preview-home .preview-song-letter { padding-inline:10%; }
  .preview-song-letter .little-girl-letter-copy > p:not(.visually-quiet) { font-size:22px; }
  .preview-home .release-invitation { grid-template-columns:90px minmax(0,1fr);gap:19px; }
  .preview-home .release-invitation > a { width:90px; }
  .preview-contact { padding-inline:22px; }
  .preview-contact-email { font-size:16px;gap:7px; }
}
/* Reset the old two-column mobile object rows and the old menu grid area. */
.preview-home .social-card { grid-template-columns:minmax(0,1fr)!important;width:100%; }
.preview-home .social-object { grid-column:1;grid-row:1; }
.preview-home .social-label { grid-column:1;grid-row:2;width:100%;max-width:none; }