.preparation{height:calc(var(--intro-height) + 220px);position:relative}.prep-stage{position:sticky;top:var(--header);height:var(--intro-height);min-height:390px;display:flex;align-items:center}.prep-inner{width:min(100% - 80px,1200px);margin:auto;display:grid;grid-template-columns:1fr 1.22fr;align-items:center;gap:24px}.prep-copy{position:relative;z-index:1;padding:20px 0}.eyebrow{font-size:11px;font-weight:600;line-height:1.5;letter-spacing:.13em;text-transform:uppercase;margin:0 0 24px;color:var(--muted)}
.title-mask{overflow:hidden;padding-bottom:8px}.body-mask{overflow:hidden;margin-top:20px}.prep-description{font-size:16px;line-height:1.6;margin:0;color:var(--muted)}.continue{display:inline-flex;align-items:center;gap:32px;font-size:12px;min-height:48px;margin-top:26px}.continue span{font-size:18px}.still-life{margin:0;min-width:0}.still-life img{display:block;width:100%;height:auto}
.pure-p02.is-enhanced:not(.is-reduced) #prep-title{transform:translateY(var(--title-y,112%));opacity:var(--title-alpha,0);will-change:transform,opacity}.pure-p02.is-enhanced:not(.is-reduced) .prep-description{transform:translateY(var(--body-y,110%));opacity:var(--body-alpha,0);will-change:transform,opacity}.pure-p02.is-enhanced:not(.is-reduced) .continue{opacity:var(--link-alpha,0);visibility:var(--link-visible,hidden)}.pure-p02.is-enhanced:not(.is-reduced) .still-life{transform:translateY(var(--image-y,12px));opacity:var(--image-alpha,.75);will-change:transform,opacity}
.extraction{padding:12px max(40px,calc((100% - 1200px)/2)) 56px;position:relative;min-height:calc(100svh + 280px)}.extraction-stage{width:calc(var(--media-height)*1.75 + 4px);max-width:100%;margin-inline:auto;position:sticky;top:calc(var(--header) + 22px);padding-bottom:20px}.extraction-heading{margin-bottom:28px}.extraction-heading .eyebrow{margin-bottom:14px}.extraction-heading>p:last-child{font-size:16px;line-height:1.5;color:var(--muted);margin:16px 0 0}
.sync-grid{display:grid;grid-template-columns:1fr calc((var(--media-height) - 16px)*.75);gap:16px;height:var(--media-height);overflow:clip}.panel{position:relative;overflow:hidden;margin:0;min-height:0;border-radius:12px;background:#fff}.panel>img,.panel>canvas{display:block;position:absolute;width:100%;height:100%;inset:0;object-fit:contain}.panel>canvas{opacity:0}.panel>canvas[data-frame]{opacity:1}.detail-stack{display:grid;grid-template-rows:1fr 1fr;gap:16px;min-height:0}.pure-p02.is-enhanced:not(.is-reduced) .main-panel{transform:translateX(var(--main-x,20%));will-change:transform}.pure-p02.is-enhanced:not(.is-reduced) .timer-panel{opacity:var(--timer-alpha,0);transform:translateX(var(--timer-x,48px));will-change:transform,opacity}.pure-p02.is-enhanced:not(.is-reduced) .pressure-panel{opacity:var(--pressure-alpha,0);transform:translateX(var(--pressure-x,48px));will-change:transform,opacity}
.transport{display:flex;align-items:center;gap:24px;margin-top:12px}.transport button{min-width:154px;text-align:left}.transport input{flex:1;min-width:0;height:30px;accent-color:var(--ink)}.transport output{font-size:11px;font-variant-numeric:tabular-nums;white-space:nowrap}#media-status{font-size:12px;color:var(--muted);margin:0;min-height:18px}#atlas{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.pure-p02.is-reduced .preparation{height:auto}.pure-p02.is-reduced .prep-stage{position:relative;top:auto;min-height:480px}.pure-p02.is-reduced .extraction{min-height:0}.pure-p02.is-reduced .extraction-stage{position:relative;top:auto}
@media(max-width:760px){.preview-bar{padding-inline:20px}.product-name span{display:none}.preview-bar button{font-size:12px}.prep-inner{width:calc(100% - 40px);grid-template-columns:1fr;gap:0;align-content:center;height:100%;position:relative}.prep-stage{min-height:0}.prep-copy{padding:32px 0 0}.eyebrow{margin-bottom:18px;font-size:10px}.body-mask{margin-top:16px}.prep-description{font-size:15px}.continue{margin-top:14px;gap:24px}.still-life{width:min(100%,510px);margin:0 auto}.still-life img{width:100%}.preparation{height:calc(var(--intro-height) + 180px)}.extraction{padding:26px 20px 44px;min-height:0}.extraction-stage{position:relative;top:auto;padding-bottom:0;width:100%}.extraction-heading{margin-bottom:24px}.extraction-heading>p:last-child{font-size:15px}.sync-grid{grid-template-columns:1fr;height:auto;gap:10px}.main-panel{aspect-ratio:1}.detail-stack{grid-template-columns:1fr 1fr;grid-template-rows:auto;gap:10px}.detail-stack .panel{aspect-ratio:1.5}.panel{border-radius:9px}.pure-p02.is-enhanced:not(.is-reduced) .main-panel{transform:none}.pure-p02.is-enhanced:not(.is-reduced) .timer-panel,.pure-p02.is-enhanced:not(.is-reduced) .pressure-panel{transform:translateY(var(--timer-x,30px))}.transport{gap:12px;flex-wrap:wrap}.transport button{min-width:130px;font-size:12px}.transport input{flex-basis:30%}.transport output{font-size:10px}.pure-p02.is-reduced .prep-stage{min-height:0;height:auto;padding-bottom:20px}}
@media(max-width:380px){.prep-inner{width:calc(100% - 32px)}.preview-bar{padding-inline:16px}.extraction{padding-inline:16px}.transport{gap:9px}.transport button{min-width:122px}.transport output{font-size:9px}}
@media(max-height:650px) and (min-width:761px){.extraction-stage{position:relative;top:auto}.extraction{min-height:0}.prep-stage{min-height:350px}.prep-inner{grid-template-columns:1fr 1fr}.sync-grid{height:390px}}


.scroll-cue{position:absolute;bottom:16px;left:max(40px,calc((100% - 1200px)/2));font-size:11px;color:var(--muted);opacity:var(--cue-alpha,1)}.pure-p02.is-reduced .scroll-cue{display:none}@media(max-width:760px){.scroll-cue{left:20px;bottom:12px}}

@media(max-width:760px){.pure-p02.is-enhanced:not(.is-reduced) .pressure-panel{transform:translateY(var(--pressure-x,24px))}}

/* P02 v2: real preparation footage, with a separate scroll-reading layer. */
.film-chapter{height:240svh;background:#20201e}
.film-stage{position:sticky;top:var(--header);height:calc(100svh - var(--header));min-height:450px;isolation:isolate;overflow:clip;color:#fff}
#prep-film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 45%;z-index:-3}
.film-shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(180deg,rgba(18,19,18,.42),rgba(18,19,18,.33) 45%,rgba(18,19,18,.52))}
.film-stage:after{content:"";position:absolute;inset:0;background:var(--surface);opacity:var(--handoff,0);pointer-events:none;z-index:3}
.film-copy{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:48px 40px 90px;transform:translateY(var(--copy-y,40px));opacity:var(--copy-alpha,1);text-align:center}
.film-copy .eyebrow{color:#ffffffba;letter-spacing:.16em;margin-bottom:36px}
.lyric-lines{display:flex;flex-direction:column;gap:22px;width:min(100%,1200px)}
.film-chapter .lyric{margin:0;font-size:clamp(38px,4.45vw,64px);font-weight:600;line-height:1.14;letter-spacing:-.045em;background:linear-gradient(90deg,#fff 0%,#fff var(--lit,0%),rgba(255,255,255,.45) var(--lit,0%),rgba(255,255,255,.45) 100%);background-clip:text;-webkit-background-clip:text;color:transparent;width:fit-content;max-width:100%;align-self:center;padding-bottom:3px}
.pure-p02.is-enhanced:not(.is-reduced) .film-chapter #prep-title{transform:none;opacity:1}
.film-next{display:inline-flex;align-items:center;gap:22px;min-height:48px;margin-top:32px;font-size:13px;opacity:var(--next-alpha,0);visibility:var(--next-visible,hidden)}
.film-next span{font-size:18px}.film-bottom{position:absolute;bottom:22px;left:40px;right:40px;display:flex;align-items:center;justify-content:space-between;gap:24px;z-index:4;font-size:11px;color:#ffffffc9}.film-bottom button{font-size:12px;color:white;min-width:98px;text-align:right}.film-scroll{opacity:var(--scroll-alpha,1)}.film-status{position:absolute;bottom:70px;right:40px;font-size:12px;color:white;margin:0}
.film-chapter+.extraction{padding-top:64px}
.pure-p02.is-reduced .film-chapter{height:auto}.pure-p02.is-reduced .film-stage{position:relative;top:0;height:calc(100svh - var(--header))}.pure-p02.is-reduced .film-copy{transform:none;opacity:1}.pure-p02.is-reduced .film-chapter .lyric{background:none;color:white}.pure-p02.is-reduced .film-next{opacity:1;visibility:visible}.pure-p02.is-reduced .film-scroll{display:none}.pure-p02.is-reduced .film-stage:after{opacity:0}
@media(max-width:760px){.film-chapter{height:250svh}.film-stage{min-height:500px}.film-copy{padding:32px 20px 90px}.film-copy .eyebrow{font-size:10px;margin-bottom:32px}.lyric-lines{gap:25px}.film-chapter .lyric{font-size:38px;line-height:1.13}.film-next{margin-top:28px}.film-bottom{left:20px;right:20px;bottom:18px}.film-status{right:20px;font-size:11px}#prep-film{object-position:51% 45%}.film-chapter+.extraction{padding-top:44px}}
@media(max-width:380px){.film-copy{padding-inline:16px}.film-chapter .lyric{font-size:36px}.lyric-lines{gap:22px}.film-bottom{left:16px;right:16px}}
@media(max-height:600px) and (min-width:761px){.film-stage{min-height:360px}.film-copy{padding-block:26px 60px}.film-copy .eyebrow{margin-bottom:18px}.lyric-lines{gap:14px}.film-chapter .lyric{font-size:38px}.film-next{margin-top:12px}.film-bottom{bottom:6px}}

/* v3: one fixed central sentence; the frame aligns with the next chapter. */
.extraction-heading .extraction-description{font-size:16px;line-height:1.5;color:var(--muted);margin:16px 0 0}
.extraction-facts{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 24px;list-style:none;padding:0;margin:16px 0 0;font-size:16px;line-height:1.5;color:var(--ink)}
.extraction-facts li{max-width:100%}.extraction-facts strong{font-weight:600}
.film-chapter{height:260svh;background:var(--surface)}
.film-stage{display:grid;place-items:center;min-height:0;background:var(--surface)}
.film-stage:after{display:none}
.film-frame{position:relative;isolation:isolate;overflow:clip;width:var(--frame-width,100%);height:var(--frame-height,100%);border-radius:var(--frame-radius,0);background:#20201e}
.film-copy{padding:48px 32px;transform:none;opacity:1;justify-content:center}
.lyric-lines{display:grid;place-items:center;gap:24px;width:100%;max-width:1200px}
.film-chapter .lyric{color:#fff;background:none;font-size:clamp(38px,4.15vw,60px);line-height:1.15;padding:0;align-self:center}
.pure-p02.is-enhanced:not(.is-reduced) .film-chapter .lyric{grid-area:1/1;opacity:var(--line-alpha,0);visibility:var(--line-visible,hidden)}
.pure-p02.is-enhanced:not(.is-reduced) .film-chapter #prep-title{opacity:var(--line-alpha,1);visibility:var(--line-visible,visible)}
.film-bottom{left:24px;right:24px;bottom:14px}
#film-play{display:grid;place-items:center;width:48px;min-width:48px;height:48px;padding:0;border-radius:50%;background:rgba(18,19,18,.12)}
#film-play:hover{background:rgba(18,19,18,.22)}
#film-play:focus-visible{outline-color:#fff}
#film-play svg{width:22px;height:22px;fill:currentColor}
#film-play .icon-pause,#film-play[data-state="playing"] .icon-play{display:none}
#film-play[data-state="playing"] .icon-pause{display:initial}
.pure-p02.is-reduced .film-frame{height:auto;min-height:400px;width:100%}
.pure-p02.is-reduced .film-stage{height:auto;min-height:0;padding:24px max(20px,calc((100% - 1200px)/2))}
.pure-p02.is-reduced .film-copy{position:relative;inset:auto;padding:72px 24px 90px}
.pure-p02.is-reduced .film-chapter .lyric{visibility:visible;opacity:1;grid-area:auto;font-size:clamp(30px,3vw,44px)}
.pure-p02.is-reduced .film-bottom{justify-content:flex-end}
@media(max-width:760px){.film-chapter{height:280svh}.film-copy{padding:52px 20px}.film-chapter .lyric{font-size:38px}.film-bottom{left:16px;right:16px;bottom:10px}.film-status{right:16px}.film-chapter+.extraction{padding-top:32px}}
@media(max-width:380px){.film-copy{padding-inline:16px}.film-chapter .lyric{font-size:36px}.film-bottom{left:12px;right:12px}}

/* Three labels share their typography and badge styling. */
.panel-label{
  position:absolute;left:20px;top:16px;max-width:calc(100% - 40px);
  font-size:16px;font-weight:500;line-height:24px;color:#464b4f;
  background:var(--paper);padding:2px 6px;border-radius:4px
}
.main-panel .panel-label{left:auto;right:20px}
@media(max-width:760px){
  .main-panel .panel-label{top:3px;right:10px;max-width:calc(100% - 20px)}
  .detail-stack .panel{aspect-ratio:auto;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto 1fr}
  .detail-stack .panel-label{grid-area:1/1;position:relative;left:auto;top:auto;justify-self:start;margin:4px;max-width:calc(100% - 8px)}
  .detail-stack .panel>img,.detail-stack .panel>canvas{grid-area:2/1;position:relative;aspect-ratio:1.5;height:auto}
}