/* A pinned, content-sized stage. Grid stretching must never disable sticky. */
.story-layout{align-items:start;position:relative}
.app-story .sticky-stage{align-self:start;position:sticky;top:var(--story-stage-top,12px);height:max-content;min-height:0;padding:14px 0;gap:0}
.app-story .phone-frame{height:auto;min-height:0;flex-shrink:0;transform:none}
.app-story .story-chapter{min-height:max(760px,100svh);scroll-margin-top:24px}
.story-screen-stack{display:grid;isolation:isolate;position:relative;background:var(--cream);overflow:hidden}
.story-screen-stack .story-panel{grid-area:1/1;align-self:stretch;min-height:0!important;opacity:0;visibility:hidden;pointer-events:none;will-change:auto;transform:translateY(12px)}
.story-screen-stack .story-panel:first-child{opacity:1;visibility:visible;transform:none}
.story-panel .preview-content{flex:1}
.app-story .stage-orbit{top:6%;height:84%;left:0;right:0}
.app-story .stage-caption{margin-bottom:14px}
.app-story .screen-caption{margin-top:14px}
.app-story .screen-enlarge{min-height:40px;padding:6px 10px}
.app-story .story-dots{margin-top:9px;margin-bottom:0}
.story-dots a{transition:background .25s ease,width .25s ease}
.story-chapter{transition:opacity .25s ease}
/* Compact the composition rather than scaling or clipping its typography. */
@media(min-width:681px) and (max-height:900px){
 .story-panel .preview-content{padding:15px 15px 12px}
 .story-panel .preview-topline{margin-bottom:13px}
 .story-panel .preview-heading h4{font-size:29px;margin:6px 0}
 .story-panel .preview-search{margin-top:12px;padding:10px 12px}
 .story-panel .preview-filters{margin:10px 0}
 .story-panel .preview-piece img{height:70px}
 .story-panel .preview-piece{padding:8px}
 .story-panel .preview-outfit{height:225px;margin-top:13px}
 .story-panel .preview-outfit img{height:115px}
 .story-panel .preview-outfit img:nth-child(2){height:190px}
 .story-panel .preview-outfit img:nth-child(3){height:75px}
 .story-panel .preview-look-note{margin:12px 0}
 .story-panel .preview-nav{padding:10px 6px}
 .story-panel .preview-month{margin-top:13px}
 .story-panel .preview-week{margin:10px 0}
 .story-panel .preview-calendar-look>div{height:100px}
 .app-story .stage-caption{font-size:9px;margin-bottom:10px}
 .app-story .screen-caption{font-size:11px;margin-top:10px}
 .app-story .screen-enlarge{font-size:12px;min-height:36px}
}
@media(min-width:681px) and (max-height:740px){
 .story-panel .preview-garments .preview-piece:nth-child(n+3){display:none}
 .story-panel .preview-piece img{height:90px}
 .story-panel .preview-outfit{height:190px}
 .story-panel .preview-outfit img{height:95px}
 .story-panel .preview-outfit img:nth-child(2){height:160px}
 .story-panel .preview-outfit img:nth-child(3){height:65px}
 .story-panel .preview-calendar-look>div{height:75px}
 .app-story .stage-caption{margin-bottom:8px}
 .app-story .screen-caption{margin-top:8px}
 .app-story .story-dots{margin-top:6px}
}
@media(min-width:581px) and (max-width:680px){
 .story-layout{display:flex;flex-direction:column;gap:0}
 .app-story .sticky-stage{width:100%;max-width:100%;margin:0}
 .app-story .phone-frame{width:100%;max-width:320px}
 .app-story .story-chapters{width:100%}
 .app-story .story-chapter{border-top:1px solid #cdbbb9;padding:40px 0}
}
@media(max-width:680px){
 .app-story .sticky-stage{position:relative;top:auto;min-height:0;padding:30px 0}
 .app-story .story-chapter{min-height:0}
 .story-screen-stack .story-panel{transition:opacity .55s cubic-bezier(.22,.61,.36,1),transform .55s cubic-bezier(.22,.61,.36,1),visibility .55s}
}
/* Reduced motion keeps pinning and clear chapter changes without spatial effects. */
@media(prefers-reduced-motion:reduce){
 .story-screen-stack .story-panel{will-change:auto;transition:none!important;transform:none!important}
 .story-dots a,.story-chapter{transition:none!important}
}
@media(min-width:681px) and (max-height:650px){
 .app-story .sticky-stage{padding:8px 0}
 .app-story .stage-caption{display:none}
 .story-panel .preview-topline{display:none}
 .story-panel .preview-heading p{display:none}
 .story-panel .preview-heading h4{font-size:27px;margin:6px 0}
 .story-panel .preview-content{padding:12px 14px}
 .story-panel .preview-outfit{height:170px;margin-top:10px}
 .story-panel .preview-outfit img{height:80px}
 .story-panel .preview-outfit img:nth-child(2){height:140px}
 .story-panel .preview-outfit img:nth-child(3){height:60px}
 .story-panel .preview-day-label{display:none}
 .story-panel .preview-month{margin-top:8px}
 .story-panel .preview-week{margin:6px 0}
 .story-panel .preview-save{margin-top:10px;padding:10px 14px}
 .app-story .screen-caption{margin-top:8px;font-size:10px}
}

/* Editorial motion: progressive enhancement, with a fully readable static page. */
.hero-line{display:block;overflow:hidden;padding:.09em 0;margin:-.09em 0}
.hero-line>span,.hero-line>em{display:block}
.manifesto-content{max-width:1200px;margin:auto}
.manifesto-content .manifesto-description{font-size:15px;line-height:1.8;max-width:570px;margin:0 auto;color:var(--muted)}
.manifesto-phrase{display:block}
.manifesto-line b{font-weight:400;display:inline-block}
.chapter-content{width:100%}
.app-story{overflow-x:clip}
.outfit-playground{overflow:clip}
.travel-art{overflow:clip;border-radius:12px}

@media(prefers-reduced-motion:no-preference){
 .motion-ready .site-header:after{content:'';position:fixed;inset:0 0 auto;height:2px;background:var(--wine);transform:scaleX(var(--reading-progress,0));transform-origin:left;pointer-events:none;z-index:100}
 .motion-ready .hero-line>span,.motion-ready .hero-line>em{animation:headline-rise 1.15s cubic-bezier(.16,1,.3,1) both;animation-delay:.08s}
 .motion-ready .hero-line:nth-child(2)>em{animation-delay:.22s}
 .motion-ready .hero-art.intro{animation:picture-unfold 1.45s cubic-bezier(.16,1,.3,1) backwards;animation-delay:.12s}
 .motion-ready .hero .eyebrow.intro{animation-duration:1.1s}
 .motion-ready .hero-description.intro{animation-delay:.32s;animation-duration:1.1s}
 .motion-ready .hero-actions.intro{animation-delay:.43s;animation-duration:1.1s}
 .motion-ready .hero-features.intro{animation-delay:.54s;animation-duration:1.1s}
 .motion-ready .reveal{transition-duration:1s;transition-delay:var(--reveal-delay,0ms);transition-timing-function:cubic-bezier(.16,1,.3,1);transform:translateY(42px)}
 .motion-ready .reveal.visible{transform:none}
 .motion-ready .manifesto-line span{transform:scaleX(var(--line-scale,1))}
 .motion-ready .manifesto-line b{transform:rotate(var(--spark-turn,0deg))}
 .motion-ready .manifesto-line span:first-child{transform-origin:right}
 .motion-ready .manifesto-line span:last-child{transform-origin:left}
 .motion-ready .stage-orbit{border-radius:50%;background:radial-gradient(ellipse at center,#d5bcb638,transparent 69%)}
 .motion-ready .stage-orbit:before{content:'';position:absolute;inset:-14px;border:1px dashed #b8928838;border-radius:50%;transform:rotate(var(--orbit-turn,0deg))}
 .motion-ready .stage-orbit:after{content:'';position:absolute;inset:6%;border-radius:50%;background:radial-gradient(ellipse at 65% 40%,#bd8a7838,transparent 68%);opacity:var(--story-warmth,0)}
 .motion-ready .chapter-content{will-change:auto}
 .motion-ready .chapter-number{display:block}
 .motion-ready .chapter-tags span{transition:background .45s,border-color .45s}
 .motion-ready .is-current .chapter-tags span{background:#f8f6f26b;border-color:#b58c8d}
 .motion-ready .story-dots a{transition:background .4s,width .5s cubic-bezier(.16,1,.3,1)}
 .motion-ready .download-section:before{transform:scale(var(--grid-scale,1));transform-origin:center}
 .motion-ready .download-section:after{transform:translateY(var(--glow-shift,0px))}
 .motion-ready .store-options.visible .store-card{animation:card-arrive .85s cubic-bezier(.16,1,.3,1) backwards;animation-delay:.12s}
 .motion-ready .store-options.visible .store-card:nth-child(2){animation-delay:.23s}
 .motion-ready dialog.site-dialog[open]{animation:dialog-arrive .4s cubic-bezier(.16,1,.3,1)}
 .motion-ready dialog.site-dialog[open]::backdrop{animation:backdrop-arrive .3s ease-out}
 .motion-ready .faq-list details[open]>p{animation:answer-arrive .35s ease-out}
 .motion-ready .desktop-nav a{position:relative}
 .motion-ready .desktop-nav a:after{content:'';position:absolute;bottom:-8px;height:1px;left:0;right:0;background:var(--wine);transform:scaleX(0);transform-origin:left;transition:transform .35s cubic-bezier(.16,1,.3,1)}
 .motion-ready .desktop-nav a:hover:after,.motion-ready .desktop-nav a:focus-visible:after{transform:scaleX(1)}
 @supports ((background-clip:text) or (-webkit-background-clip:text)){
  .motion-ready .manifesto-phrase{background:linear-gradient(90deg,var(--ink) 50%,#887d76 50%);background-size:200% 100%;background-position:var(--ink-position,0%) 0;background-clip:text;-webkit-background-clip:text;color:transparent}
  .motion-ready em.manifesto-phrase{background-image:linear-gradient(90deg,var(--wine) 50%,#887d76 50%)}
 }
 @media(min-width:681px) and (min-height:600px){
  .motion-ready .manifesto{min-height:155svh;padding:0 var(--page-gutter)}
  .motion-ready .manifesto-content{position:sticky;top:0;min-height:100svh;padding:60px 0;display:flex;flex-direction:column;justify-content:center;align-items:center}
  .motion-ready .manifesto h2{font-size:clamp(40px,5.2vw,78px);line-height:1.13;letter-spacing:-2.6px;margin:26px 0}
  .motion-ready .manifesto-line{margin-top:30px}
 }
 @media(hover:hover) and (pointer:fine){
  .motion-ready .button,.motion-ready .store-card{transition:transform .4s cubic-bezier(.16,1,.3,1),box-shadow .4s,background .25s,border-color .25s}
  .motion-ready .button:hover{transform:translateY(-4px);box-shadow:0 12px 28px #6e293d20}
  .motion-ready .store-card:hover{transform:translateY(-6px);box-shadow:0 18px 36px #1e0b1626}
  .motion-ready .hero-features .icon{transition:transform .45s cubic-bezier(.16,1,.3,1)}
  .motion-ready .hero-features a:hover .icon{transform:translateY(-4px) rotate(-6deg)}
 }
}
@keyframes headline-rise{from{transform:translateY(115%);opacity:.1}to{transform:none;opacity:1}}
@keyframes picture-unfold{from{opacity:0;clip-path:inset(8% 4% 4% round 38px);transform:translateY(20px) scale(.96)}to{opacity:1;clip-path:inset(0 round 12px);transform:none}}
@keyframes card-arrive{from{opacity:0;transform:translateY(28px) scale(.96)}to{opacity:1;transform:none}}
@keyframes dialog-arrive{from{opacity:0;transform:translateY(20px) scale(.98)}to{opacity:1;transform:none}}
@keyframes backdrop-arrive{from{opacity:0}to{opacity:1}}
@keyframes answer-arrive{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@media(max-width:680px){
 .manifesto-content h2{font-size:clamp(32px,6.7vw,46px);line-height:1.17;letter-spacing:-1.5px}
 .manifesto-content .manifesto-description{font-size:14px}
 .manifesto-content>.eyebrow{font-size:9px;letter-spacing:1.3px}
 .motion-ready .manifesto-phrase:first-child{max-width:520px;margin:0 auto .2em}
 .motion-ready .reveal{transform:translateY(24px)}
 .motion-ready .reveal.visible{transform:none}
}
@media(prefers-reduced-motion:reduce){
 .hero-line{overflow:visible}
 .hero-line>span,.hero-line>em,.chapter-content{transform:none!important;opacity:1!important}
 .manifesto-phrase{color:var(--ink);background:none}
 em.manifesto-phrase{color:var(--wine)}
 .manifesto-content{position:static}
 .motion-ready .reveal{transform:none!important;opacity:1!important}
}