/* Local draft: warm palette and requested entry / story / closing layers. */
body,.hero-stage,.skip{background:#FAF6EF;color:#382F2C}
.hero-message,.selection{background:#EAC99B}
.intro{background:#F0DDD5}
.states{background:#F1E9DF}
.task-field span,.place,#state-panel,.tabs button[data-state=focus],.tabs button[data-state=deep]{background:#E9DFD2}
.task-field span:nth-child(2),.task-field span:nth-child(4),.tabs button[data-state=ask],.tabs button[data-state=create],#state-panel[data-rhythm=ask],#state-panel[data-rhythm=create]{background:#EAC99B}
.task-field span:nth-child(6),.human-row,.tabs button[data-state=collision],.tabs button[data-state=human],#state-panel[data-rhythm=collision],#state-panel[data-rhythm=human]{background:#EAD0CD}
footer{background:#F0DDD5}
.pill{background:#A5352C;border-color:#A5352C;color:#FFFAF4;min-height:46px}
.pill:hover{background:#862A23}
a:focus-visible,button:focus-visible,[tabindex]:focus-visible{outline-color:#A5352C}
.principles span,.place-mark,header>a:last-child span{color:#A5352C}
/* Preserve the original grid footprint; expand only the interactive surface. */
a.place-mark{position:relative;display:block;width:30.171875px;height:41px}
a.place-mark svg{display:block;width:100%;height:100%}
a.place-mark::after{content:"";position:absolute;left:50%;top:50%;width:44px;height:44px;transform:translate(-50%,-50%)}
a.place-mark:focus-visible{outline:none}
a.place-mark:focus-visible::after{outline:3px solid #A5352C;outline-offset:3px;border-radius:3px}
@media(max-width:700px){a.place-mark{width:23.46875px;height:33px}}
.task-field,.task-field span,#state-panel,.tabs button,.state-art i,.principles p,.boundary,.footer-bottom{border-color:#AB9385}
.tabs button[aria-selected=true]{border-color:#A5352C;color:#862A23}
.state-art i:nth-child(3){background:#A5352C;border-color:#A5352C}
figcaption,.media-note{color:#65534B}
.film{background:#E9DFD2}
.film video,.poster,.sketch img,.human-row img{filter:none}
.film:after{content:none}
.film .poster{z-index:0}
.film video{opacity:0;z-index:1}
.film video.frame-ready{opacity:1}
.film-status{position:absolute;z-index:3;left:12px;right:12px;bottom:14px;width:fit-content;max-width:calc(100% - 24px);padding:8px 11px;border-radius:5px;background:#FAF6EF;color:#65534B;font-size:12px;line-height:1.4;pointer-events:none}
.film-status[hidden]{display:none}
.film-progress{background:#A5352C;z-index:1;pointer-events:none}
.story-nav{display:flex;gap:26px;font-size:12px;justify-content:flex-end;min-height:30px;align-items:center}
.story-nav a,.manifest-link,.bot-link{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
.story-nav a:hover,.manifest-link:hover,.bot-link:hover{color:#A5352C}
.hero-actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px 24px;margin-top:30px}
.hero-message .hero-actions .pill{margin:0}
.manifest-link{font-size:13px;display:inline-flex;gap:14px;align-items:center;min-height:44px}
.first-meeting{background:#FAF6EF;border-top:1px solid #D7C6B8}
.first-meeting h2{font-family:Georgia,'Times New Roman',serif;max-width:900px}
.first-meeting .lead{font-size:clamp(26px,2.6vw,38px)}
.origin{background:#EFE4D6}
.origin .two-col{margin-top:0;align-items:start}
.origin-slot{aspect-ratio:16/9;margin-top:48px;border:1px solid #AE9281;background:#F8F1E8;position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:24px;border-radius:10px}
.origin-slot p{font-family:Georgia,serif;font-size:clamp(22px,3vw,42px);max-width:80%;line-height:1.2}
.slot-corner{position:absolute;top:24px;left:26px;font-size:18px}
.slot-note{font-size:13px;line-height:1.5;margin-top:18px;color:#65534B}
.join-layer{border-top:1px solid #B69789;padding-top:32px;display:grid;grid-template-columns:1fr 1fr;gap:7vw}
.join-layer h3{font-family:Georgia,serif;font-size:34px}
.join-copy{max-width:490px;font-size:18px;line-height:1.65}
.join-copy .pill{margin-top:26px}
.bot-link{display:table;font-size:15px;margin-top:8px;padding:8px 0}
.join-copy .join-note{font-size:14px;line-height:1.65;color:#65534B;margin-top:18px}
@media(max-width:700px){
.story-nav{font-size:11px;justify-content:space-between;gap:12px;min-height:30px}
.hero-actions{margin-top:18px;gap:4px 18px}
.hero-message{padding:20px 24px}
.hero-stage{min-height:710px}
.wordmark{margin-bottom:16px}
.join-layer{grid-template-columns:1fr;gap:24px}
.join-copy{font-size:16px}
.join-layer h3{font-size:30px}
.origin-slot{margin-top:32px;padding:16px}
.slot-corner{top:12px;left:16px;font-size:13px}
.slot-note{font-size:12px;margin-top:12px}
.origin-slot p{font-size:23px;max-width:95%}
}
/* Let short screens scroll the header away before pinning the complete film. */
@media(max-width:700px) and (max-height:740px){
.hero{height:max(190svh,1040px)}
.hero-stage{min-height:640px;top:min(0px,calc(100svh - 640px))}
header{min-height:54px}.wordmark{margin-bottom:12px}
.hero-message{padding:16px 20px}
.hero-caption{padding:10px 0}
}
@media(max-height:540px) and (min-width:701px){.hero-stage{top:calc(100svh - 540px)}}
@media(prefers-reduced-motion:reduce){.film video.frame-ready{display:none}.hero{height:auto}.hero-stage{top:0}}
/* Film-first opening. Copy occupies its own band, never the faces. */
.hero{height:210svh}
.hero-stage{height:100svh;min-height:540px;top:0;padding:0 3vw;display:grid;grid-template-columns:1fr auto;grid-template-rows:58px minmax(0,1fr) auto;column-gap:24px}
.hero header{grid-column:1/-1;grid-row:1;min-height:58px;padding-left:155px}
.hero header>a:first-child{display:none}
.hero header>span{margin-left:0}
.hero .wordmark{grid-column:1;grid-row:1;align-self:center;font-size:27px;letter-spacing:-.055em;margin:0;pointer-events:none;width:140px}
.hero .story-nav{grid-column:2;grid-row:3;font-size:11px;z-index:2}
.hero-composition{grid-column:1/-1;grid-row:2;display:flex;flex-direction:column;gap:0;max-height:none;min-height:0}
.hero .film{order:-1;flex:1;min-height:0;border-radius:3px;background:#D6D5D3}
.hero .film video,.hero .poster{object-fit:contain;object-position:center;filter:none}
.hero .hero-message{background:transparent;border-radius:0;padding:20px 0 16px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px 28px}
.hero h1{font-size:clamp(32px,3.6vw,54px);line-height:1.05}
.hero h1 br{display:none}
.hero h1 span{white-space:nowrap;margin-left:.18em}
.hero .hero-actions{margin:0;gap:8px 22px}
.hero .scroll-label{margin:0;font-size:9px;grid-column:1/-1}
.hero-caption{grid-column:1;grid-row:3;padding:10px 0 16px;font-size:9px}
.hero-caption span:last-child{display:none}
.film-status{left:10px;bottom:10px;font-size:11px}
.photo-essay{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:48px 28px;align-items:start;margin-top:36px}
.photo-essay figure{grid-column:span 4}
.photo-essay figure:first-child{grid-column:span 8}
.photo-essay figure:nth-child(2){grid-column:10/span 3;align-self:end}
.photo-essay figure:nth-child(3){grid-column:1/span 4}
.photo-essay figure:nth-child(4){grid-column:6/span 3;margin-top:80px}
.photo-essay figure:nth-child(5){grid-column:10/span 3}
.photo-essay figure:nth-child(6){grid-column:2/span 5}
.photo-essay figure:nth-child(7){grid-column:8/span 4;margin-top:90px}
.photo-essay img{display:block;width:100%;height:auto;filter:none;object-fit:contain}
.photo-essay figcaption{font-size:12px;padding-top:12px}
@media(max-width:700px){
.hero{height:200svh}
.hero-stage{padding:0 16px;height:100svh;min-height:540px;top:min(0px,calc(100svh - 540px));grid-template-rows:56px minmax(0,1fr) 38px;column-gap:0}
.hero header{min-height:56px;padding-left:120px}
.hero header>span{display:none}
.hero header>a:last-child{margin-left:auto}
.hero .wordmark{font-size:24px;width:114px}
.hero .film video,.hero .poster{object-fit:cover;object-position:88% center}
.hero h1 span{margin-left:0}
.hero .hero-message{display:block;padding:18px 0 8px}
.hero h1{font-size:clamp(32px,8.7vw,43px);line-height:1.08}
.hero h1 br{display:block}
.hero .hero-actions{margin-top:12px;gap:4px 16px}
.hero .hero-actions .pill{font-size:12px;padding:12px 16px;gap:18px}
.hero .manifest-link{font-size:11px;gap:6px}
.hero .scroll-label{display:none}
.hero .story-nav{grid-column:1/-1;font-size:10px;justify-content:space-between;min-height:38px}
.hero-caption{display:none}
.photo-essay{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 16px;margin-top:28px}
.photo-essay figure:nth-child(n){grid-column:auto;margin-top:0;align-self:start}
.photo-essay figure:first-child{grid-column:1/-1}
.photo-essay figure:nth-child(3),.photo-essay figure:nth-child(5),.photo-essay figure:nth-child(7){margin-top:44px}
.photo-essay figcaption{font-size:10px;line-height:1.5}
}
@media(prefers-reduced-motion:reduce){.hero{height:auto}.hero-stage{position:relative;top:0}}