/* The same phone travels from the opening composition to the exact horizontal center. */
html{scrollbar-gutter:stable}html.dialog-open{overflow:hidden}
.nav-cta{background:var(--button);color:var(--button-text);border-color:var(--button);min-height:44px;padding-inline:23px;font-size:13px}
.story.enhanced{--initial-phone-width:min(250px,28svh);--initial-phone-left:calc(100% - var(--initial-phone-width) - 50px);--initial-phone-top:calc(50% - 282px);--final-phone-width:min(380px,38svh);--final-phone-top:50%;--final-phone-offset:-50%}
.enhanced .hero{display:block}.enhanced .hero-copy{position:absolute;left:0;top:50%;width:49%;transform:translateY(-50%);padding-bottom:65px}
.enhanced .hero-art{position:absolute;inset:0;height:100%;margin:0;isolation:auto}
.enhanced .hero-phone{left:var(--initial-phone-left);top:var(--initial-phone-top);right:auto;bottom:auto;width:var(--initial-phone-width);transform:rotate(9deg);animation:none;will-change:transform}
.enhanced .couple{left:calc(50% - 45px);bottom:8svh}.enhanced .floating-note{bottom:16svh;right:0}
.enhanced .orbit{left:75%;top:45%}.enhanced .art-label{left:52%;top:18%;bottom:auto}.enhanced .spark-one{right:0;top:13%;bottom:auto}.enhanced .spark-two{left:53%;top:39%;bottom:auto}
.enhanced .phone-caption{left:50%;bottom:30px;transform:translateX(-50%);font-size:12px;max-width:none}
.enhanced .chapters{z-index:0}.enhanced .chapter{height:110svh;min-height:0;padding:0;pointer-events:none}
.enhanced .scene-panels{position:absolute;inset:0;pointer-events:none;z-index:4}
.enhanced .story-panel{position:absolute;top:50%;left:0;width:min(390px,calc(50% - var(--final-phone-width)/2 - 48px));max-width:none;transform:translateY(calc(-50% + 22px));opacity:0;visibility:hidden;pointer-events:none;transition:opacity .4s,transform .55s cubic-bezier(.2,.7,.2,1),visibility .4s}
.enhanced .story-panel.is-active{opacity:1;visibility:visible;transform:translateY(-50%);pointer-events:auto}
.story-panel h2{font-size:clamp(35px,3.9vw,59px);font-weight:850;line-height:1.08;letter-spacing:-1.8px;margin:24px 0 20px}.story-panel h2>span{color:var(--pink)}
.enhanced .story-panel>p{max-width:none;min-height:0;font-size:16px;line-height:1.7;color:var(--muted)}
.story-panel>.section-index,.story-panel>h2,.story-panel>p,.story-panel>.demo-trigger{transform:translateY(14px);opacity:0;transition:transform .55s cubic-bezier(.2,.7,.2,1),opacity .45s}
.story-panel.is-active>.section-index,.story-panel.is-active>h2,.story-panel.is-active>p,.story-panel.is-active>.demo-trigger{transform:none;opacity:1}
.story-panel.is-active>h2{transition-delay:.06s}.story-panel.is-active>p{transition-delay:.11s}.story-panel.is-active>.demo-trigger{transition-delay:.16s}
.demo-trigger{border:1px solid var(--line);background:var(--button);color:var(--button-text);border-radius:100px;min-height:48px;padding:12px 23px;margin-top:26px;font-size:14px;font-weight:850;transition:transform .2s,background .2s}
.demo-trigger:hover{background:var(--pink)}.enhanced .chapter-hand{font-size:25px;line-height:1.25;margin-top:29px}
.enhanced .chapter-dots{right:0;transform:translateY(-50%);gap:7px;z-index:5}.enhanced .chapter-dots a{width:86px;height:44px;border:0;display:grid;place-items:center;border-radius:100px;font-size:12px;font-weight:800;background:var(--surface);color:var(--muted)}
.enhanced .chapter-dots a::before{content:none}.enhanced .chapter-dots a[aria-current=step]{transform:none;background:var(--button);color:var(--button-text)}
.feature-dialog{width:min(480px,calc(100% - 32px));padding:32px 24px 24px;max-height:90dvh;overscroll-behavior:contain}
.feature-dialog-title{font-size:25px!important;margin:8px 30px 22px 0!important;line-height:1.2!important;letter-spacing:-.5px!important}
.feature-dialog .playground{margin:0;width:100%;max-width:none;box-shadow:none;transform:none}.feature-dialog .playground>p{margin-top:12px;margin-bottom:0;font-size:13px;line-height:1.65}
.feature-dialog .answers button{min-height:48px;font-size:13px}.feature-dialog .small-action{min-height:44px;font-size:13px}.feature-dialog .interaction-status{font-size:12px}.feature-dialog .demo-footnote{font-size:10px}
.feature-dialog .demo-label,.feature-dialog .points-top,.feature-dialog .question-top{font-size:9px}.feature-dialog .profile-main h3{font-size:18px}.feature-dialog .profile-main p{font-size:12px}
.feature-dialog .profile-colors button{width:44px;height:44px;border-width:8px}.feature-dialog .profile-themes button{min-height:44px;font-size:12px}.feature-dialog .profile-themes>span{font-size:12px}
.feature-dialog .shop-tabs button{min-height:44px;font-size:13px}.feature-dialog .shop-item{min-height:120px}.feature-dialog .shop-item strong{font-size:12px}.feature-dialog .shop-item small{font-size:10px}
@keyframes phone-to-center{0%{left:var(--initial-phone-left);top:var(--initial-phone-top);width:var(--initial-phone-width);transform:rotate(9deg);z-index:1}35%{z-index:1}36%{z-index:3}100%{left:50%;top:var(--final-phone-top);width:var(--final-phone-width);transform:translate(-50%,var(--final-phone-offset)) rotate(0);z-index:3}}
@keyframes intro-away{from{opacity:1;transform:translateY(-50%)}to{opacity:0;transform:translateY(calc(-50% - 60px));visibility:hidden;pointer-events:none}}
@supports(animation-timeline:view()){@media(prefers-reduced-motion:no-preference){.enhanced .hero-phone{animation:phone-to-center linear both;animation-timeline:--journey;animation-range:contain 0% contain 7%}.enhanced .hero-copy{animation:intro-away linear both;animation-timeline:--journey;animation-range:contain 0% contain 6%}.enhanced .couple,.enhanced .floating-note,.enhanced .hero-bottom,.enhanced .art-label,.enhanced .art-spark{animation-range:contain 0% contain 6%}}}
@supports not(animation-timeline:view()){.enhanced.is-reading .hero-phone{left:50%;top:var(--final-phone-top);width:var(--final-phone-width);transform:translate(-50%,var(--final-phone-offset));z-index:3;transition:left .8s,top .8s,width .8s,transform .8s}}
@media(max-width:1150px){.story.enhanced{--initial-phone-left:calc(100% - var(--initial-phone-width) - 20px)}.enhanced .story-panel{width:calc(50% - var(--final-phone-width)/2 - 30px)}.story-panel h2{font-size:36px}.enhanced .story-panel>p{font-size:14px}.enhanced .chapter-hand{font-size:23px}.enhanced .chapter-dots a{width:72px;font-size:11px}}
@media(max-width:800px){
  .wrap{width:calc(100% - 36px)}.nav{height:76px}.nav-cta{font-size:13px;min-height:44px;padding:10px 18px;gap:14px}.brand{font-size:20px}.brand img{width:38px;height:38px}
  .story.enhanced{--initial-phone-width:min(40vw,26svh);--initial-phone-left:calc(90% - var(--initial-phone-width));--initial-phone-top:calc(100svh - var(--initial-phone-width)*2.174 - 180px);--final-phone-width:min(68vw,26svh);--final-phone-top:28px;--final-phone-offset:0%}
  .enhanced .hero-copy{top:26px;width:100%;padding:0;transform:none}.hero-copy>p{font-size:16px}.enhanced .hero-actions{margin-top:23px}.download-button{min-height:60px}.download-button small{font-size:8px;line-height:1.3}.download-button strong{font-size:18px}
  .enhanced .couple{left:0;bottom:145px}.enhanced .floating-note{bottom:130px;right:0}.enhanced .orbit{left:57%;top:57%}.enhanced .art-label{left:0;top:auto;bottom:53%}.enhanced .spark-one{top:auto;bottom:55%;right:8px}.enhanced .spark-two{top:auto;bottom:36%;left:0}.enhanced .hero-bottom{bottom:100px}
  .enhanced .scene-panels{inset:auto 0 88px;height:230px}.enhanced .story-panel{inset:0;width:100%;height:100%;transform:translateY(18px);text-align:center}.enhanced .story-panel.is-active{transform:none}
  .enhanced .story-panel>.section-index{font-size:9px;letter-spacing:1.15px;max-width:none;line-height:1.5}.story-panel h2{font-size:34px;line-height:1.04;letter-spacing:-1px;margin:12px 0 11px}.enhanced .story-panel>p{font-size:14px;line-height:1.55;max-width:390px;margin-inline:auto;min-height:0}.enhanced .chapter-hand{display:none}
  .demo-trigger{min-height:46px;margin-top:16px;padding:10px 23px;font-size:14px}.enhanced .phone-caption{display:none}
  .enhanced .chapter-dots{display:flex;position:absolute;top:auto;bottom:max(12px,env(safe-area-inset-bottom));left:50%;right:auto;transform:translateX(-50%);flex-direction:row;width:100%;gap:2px;background:var(--surface);border:1px solid var(--line);padding:4px;border-radius:100px;justify-content:space-between}
  .enhanced .chapter-dots a{flex:1;width:auto;height:44px;min-width:0;font-size:11px;background:none}.enhanced .chapter{height:115svh;min-height:0}.enhanced .hero-spacer{height:100svh}
  .feature-dialog{position:fixed;inset:auto 0 0;margin:0 auto;width:100%;max-width:540px;max-height:88dvh;padding:30px 20px max(24px,env(safe-area-inset-bottom));border-radius:28px 28px 0 0}.feature-dialog .playground{padding:22px}.feature-dialog-title{font-size:24px!important}.feature-dialog .memory-playground>p{font-family:Caveat,cursive;font-size:28px;min-height:42px}.feature-dialog .memory-playground h3{font-size:24px}
  @keyframes intro-away{from{opacity:1;transform:none}to{opacity:0;transform:translateY(-60px);visibility:hidden;pointer-events:none}}
}
@media(max-width:800px) and (max-height:740px){.story.enhanced{--initial-phone-top:calc(100svh - var(--initial-phone-width)*2.174 - 90px);--final-phone-width:min(64vw,23svh);--final-phone-top:18px}.enhanced .couple{bottom:60px;width:min(74vw,330px)}.enhanced .floating-note{bottom:70px}.enhanced .hero-bottom{bottom:30px}.enhanced .hero-copy{top:14px}.enhanced h1{font-size:45px;margin-block:18px}.hero-copy>p{font-size:14px}.enhanced .hero-actions{margin-top:18px}.enhanced .scene-panels{height:215px;bottom:78px}.story-panel h2{font-size:29px;margin-block:10px}.enhanced .story-panel>p{font-size:13px;line-height:1.5}.demo-trigger{margin-top:12px;min-height:44px}.enhanced .story-panel>.section-index{font-size:8px}.enhanced .chapter-dots{bottom:8px}}
@media(max-width:375px){.brand{font-size:18px}.brand img{width:34px;height:34px}.nav-cta{font-size:12px;padding-inline:16px}.download-button{padding:10px;gap:8px}.download-button strong{font-size:15px}.download-button small{font-size:7px}.enhanced .story-panel>p{font-size:13px}.story-panel h2{font-size:29px}.enhanced .chapter-dots a{font-size:10px}.feature-dialog .playground{padding:18px}.feature-dialog .profile-main h3{font-size:15px}.feature-dialog .profile-main p{font-size:11px}.feature-dialog .profile-themes>span{font-size:10px}.feature-dialog .shop-item strong{font-size:10px}}
@media(max-width:600px) and (max-height:620px){.story.enhanced{--initial-phone-width:min(38vw,22svh);--final-phone-width:19svh}.enhanced .scene-panels{height:210px;bottom:84px}.story-panel h2{font-size:26px;margin-block:8px}.enhanced .story-panel>p{font-size:12.5px;line-height:1.45}.demo-trigger{margin-top:8px}}
@media(max-height:500px) and (min-width:600px) and (max-width:800px){.story.enhanced{--final-phone-width:36svh;--final-phone-top:50%;--final-phone-offset:-50%}.enhanced .scene-panels{left:0;right:auto;top:50%;bottom:auto;width:calc(50% - var(--final-phone-width)/2 - 20px);height:260px;transform:translateY(-50%)}.enhanced .story-panel{text-align:left}.story-panel h2{font-size:25px}.enhanced .story-panel>p{font-size:12px}.enhanced .story-panel>.section-index{font-size:7px}.demo-trigger{font-size:12px}.enhanced .chapter-dots{left:auto;right:0;bottom:50%;transform:translateY(50%);width:85px;flex-direction:column;border:0;background:none}.enhanced .chapter-dots a{width:100%;min-height:40px}}
@media(prefers-reduced-motion:reduce){.story-panel>*{opacity:1;transform:none;transition:none}.demo-trigger{transition:none}.nav-cta{transition:none}}
