/* Static content is the default. Enhancement preserves a single artwork frame. */
.home{--scene-bg:#f3f0e9;--scene-ink:#282720;--scene-muted:#696158;--scene-accent:#6e2638;background:var(--scene-bg);color:var(--scene-ink)}
.home .header,.home footer{position:relative;z-index:3}.home .brand{font-size:23px}.brand img{mix-blend-mode:normal;object-fit:contain;width:44px;height:44px}
.journey{position:relative}.journey-scene{position:relative;padding:40px 7%}.living-mark{width:min(80vw,550px);margin:0 auto 40px}.mark-frame{position:relative;width:100%;aspect-ratio:1}.mark-frame canvas,.resolved-mark{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.mark-frame canvas{display:none}
.moment{padding:40px 0 60px;max-width:650px}.overline{font-size:14px;letter-spacing:.025em;line-height:1.5;margin-bottom:24px}.moment h1,.moment h2{font-size:clamp(38px,6.6vw,105px);line-height:1.02;letter-spacing:-.055em}.moment em{color:var(--scene-accent)}.moment-note{font-size:18px;line-height:1.7;margin-top:24px;color:var(--scene-muted)}
.story-link{display:inline-flex;align-items:center;gap:18px;min-height:44px;border-bottom:1px solid currentColor;margin-top:20px;font-size:16px;color:var(--scene-accent)}.moment .contact{margin-top:24px;padding:15px 20px;min-height:48px;font-size:16px;background:var(--scene-accent);color:#fff}.moment .signed{font-size:14px;line-height:1.6;margin-top:16px;color:var(--scene-muted)}
.journey-nav{display:none}.journey-nav button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;min-height:44px;padding:0}.journey-nav button:disabled{opacity:.35;cursor:default}button:focus-visible{outline:2px solid var(--scene-accent);outline-offset:4px}
/* Desktop and landscape: copy and artwork share a row above the controls. */
:is(.mesh-ready,.mesh-loading) .journey{height:690svh}
:is(.mesh-ready,.mesh-loading) .journey-scene{--stacked:0;position:sticky;top:0;height:100svh;min-height:0;display:grid;grid-template-columns:minmax(0,44fr) minmax(0,56fr);grid-template-rows:minmax(0,1fr) auto;gap:20px 4%;padding:max(18px,env(safe-area-inset-top)) max(5%,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(6%,env(safe-area-inset-left));overflow:hidden}
:is(.mesh-ready,.mesh-loading) .living-mark{grid-column:2;grid-row:1;display:flex;align-items:center;justify-content:center;width:auto;height:100%;min-height:0;margin:0}
:is(.mesh-ready,.mesh-loading) .mark-frame{width:min(100%,calc(100svh - 125px));max-width:820px;flex-shrink:0}
:is(.mesh-ready,.mesh-loading) .mark-frame canvas{display:block}:is(.mesh-ready,.mesh-loading) .resolved-mark{opacity:0}
:is(.mesh-ready,.mesh-loading) .chapters{grid-column:1;grid-row:1;display:grid;align-self:center;min-width:0;max-height:100%;overflow:auto;scrollbar-width:thin}
:is(.mesh-ready,.mesh-loading) .moment{grid-area:1/1;align-self:start;width:100%;max-width:none;padding:4px;opacity:0;visibility:hidden;pointer-events:none}
:is(.mesh-ready,.mesh-loading) .moment.is-current{visibility:visible;pointer-events:auto}.mesh-loading .moment:first-child{opacity:1;visibility:visible}
:is(.mesh-ready,.mesh-loading) .journey-nav{grid-column:1/-1;grid-row:2;display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0;border-top:1px solid color-mix(in srgb,var(--scene-ink) 18%,transparent);padding-top:8px;color:var(--scene-muted)}
.chapter-count{font:14px var(--mono);letter-spacing:.03em;white-space:nowrap;flex-shrink:0}.chapter-dots{display:flex;gap:0}.chapter-dots button{width:44px;display:grid;place-items:center}.chapter-dots span{width:5px;height:5px;border-radius:50%;background:currentColor;opacity:.32}.chapter-dots [aria-current="step"] span{width:7px;height:7px;opacity:1;background:var(--scene-accent)}.next-chapter{font-size:14px!important;display:flex;gap:14px;align-items:center}.next-chapter span{font-size:22px}.previous-chapter{display:none;font-size:14px!important;align-items:center;gap:10px}
@media(max-width:1100px){.moment h1,.moment h2{font-size:clamp(36px,6.1vw,68px)}.moment-note{font-size:17px}.overline{margin-bottom:18px}.moment .contact{padding:14px 16px;gap:14px}}
/* Portrait: one shared text row holds the tallest chapter. Artwork uses the rest. */
@media(max-width:600px),(max-width:900px) and (orientation:portrait){
 .home .header{min-height:100px}.home .brand img{width:40px;height:40px}
 :is(.mesh-ready,.mesh-loading) .journey-scene{--stacked:1;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto auto;gap:16px;padding:max(10px,env(safe-area-inset-top)) max(6%,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(6%,env(safe-area-inset-left))}
 :is(.mesh-ready,.mesh-loading) .living-mark{grid-column:1;grid-row:1}
 :is(.mesh-ready,.mesh-loading) .mark-frame{width:min(82vw,var(--art-size,32svh));max-width:500px}
 :is(.mesh-ready,.mesh-loading) .chapters{grid-column:1;grid-row:2;max-height:calc(100svh - 180px);width:100%;max-width:580px;justify-self:center}
 :is(.mesh-ready,.mesh-loading) .journey-nav{grid-row:3;grid-column:1}
 .moment h1,.moment h2{font-size:clamp(36px,min(11.5vw,6.4svh),60px)}.overline{margin-bottom:14px;font-size:14px}.moment-note{font-size:17px;line-height:1.55;margin-top:16px}.moment .contact{margin-top:18px;padding:13px 17px}.moment .signed{margin-top:12px}.story-link{margin-top:14px}
 .chapter-dots{display:none}.previous-chapter{display:flex}.chapter-count{order:1}.next-chapter{order:2}.previous-chapter{order:0}
}
@media(max-height:650px){
 .moment h1,.moment h2{font-size:clamp(34px,min(6vw,10svh),55px)}.overline{margin-bottom:12px}.moment-note{font-size:16px;line-height:1.5;margin-top:12px}.moment .contact{margin-top:14px;padding:12px 15px}.moment .signed{margin-top:10px}.story-link{margin-top:12px}
}
@media(max-width:600px) and (max-height:650px){.moment h1,.moment h2{font-size:36px}:is(.mesh-ready,.mesh-loading) .journey-scene{gap:10px}}
@media(min-width:601px) and (max-height:500px){
 :is(.mesh-ready,.mesh-loading) .journey-scene{gap:8px 4%;padding-top:max(8px,env(safe-area-inset-top));padding-bottom:max(6px,env(safe-area-inset-bottom))}
 .moment h1,.moment h2{font-size:clamp(32px,4.3vw,43px)}.moment-note{font-size:16px}.overline{font-size:14px;margin-bottom:8px}.moment .contact{margin-top:10px;padding:10px 13px}.moment .signed{margin-top:8px}.moment-note{margin-top:10px}
 .chapter-dots{display:none}.previous-chapter{display:flex}.chapter-count{order:1}.next-chapter{order:2}
}