@font-face{font-family:Outfit;src:url('assets/outfit.woff2') format('woff2');font-display:optional}
:root{color-scheme:dark;--paper:#f0eee5;--muted:#a5aaa0;--accent:#d2bc91;--ground:#101210;scroll-behavior:smooth}
*{box-sizing:border-box}body{margin:0;background:var(--ground);color:var(--paper);font:400 17px/1.55 Outfit,Arial,sans-serif;overflow-x:hidden}a{color:inherit;text-decoration:none}button{font:inherit}a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:6px}.skip{position:fixed;top:-100px;left:24px;z-index:30;background:var(--paper);color:var(--ground);padding:12px}.skip:focus{top:16px}
.masthead{position:fixed;z-index:10;inset:0 0 auto;display:flex;align-items:center;justify-content:space-between;padding:22px 4vw;pointer-events:none;background:linear-gradient(#101210e6,transparent)}.masthead a{pointer-events:auto}.identity img{width:62px;height:50px;object-fit:contain}.mast-note{font-size:10px;letter-spacing:.22em;color:var(--muted)}.mast-note span{padding:0 17px}.visit{font-size:12px;border-bottom:1px solid #596052;padding:8px 0;display:flex;gap:24px}.visit span{font-size:19px}
#visual{position:fixed;inset:21svh 0 23svh;pointer-events:none;z-index:0;opacity:.3}#visual canvas{display:block;width:100%;height:100%}.fallback{position:absolute;width:100%;height:100%;object-fit:contain;opacity:.45;mask-image:radial-gradient(ellipse,black 30%,transparent 75%)}.loaded .fallback{display:none}:is(.enhanced,.story-starting) #visual{opacity:1}.visual-caption{display:none;position:fixed;left:4vw;right:4vw;bottom:110px;align-items:center;gap:18px;font-size:10px;color:var(--muted);letter-spacing:.07em;z-index:2;pointer-events:none}:is(.enhanced,.story-starting) .visual-caption{display:flex}.visual-caption span:first-child{font-variant-numeric:tabular-nums;color:var(--accent)}#visual-source{margin-left:auto;font-size:9px;letter-spacing:.13em}
main{position:relative;z-index:1}.chapter{min-height:90svh;padding:120px 8vw 90px;display:flex;align-items:center;justify-content:center}.copy{max-width:800px;text-align:center}.eyebrow{font-size:10px;letter-spacing:.24em;font-weight:400;color:var(--accent);margin:0 0 18px}h1,h2{font-weight:400;letter-spacing:-.055em;font-size:clamp(42px,5.2vw,78px);line-height:1.04;margin:0}em{font-family:Georgia,'Times New Roman',serif;font-weight:400;color:var(--accent);letter-spacing:-.05em}.line{display:block}.detail{margin:30px auto 0;max-width:650px}.lead{font-size:clamp(17px,1.35vw,22px);line-height:1.3;margin:0 0 10px}.detail>p:not(.lead){color:var(--muted);max-width:560px;margin:0 auto;font-size:14px;line-height:1.5}.next{display:inline-flex;align-items:center;gap:26px;margin-top:18px;font-size:11px;letter-spacing:.05em}.next span{font-size:18px}.next:hover{color:var(--accent)}.primary{display:inline-flex;align-items:center;gap:35px;margin-top:16px;border-bottom:1px solid var(--accent);padding:5px 0 9px;font-size:13px}.primary:hover{color:var(--accent)}
:is(.enhanced,.story-starting) main{pointer-events:none}:is(.enhanced,.story-starting) .chapter{height:150svh;min-height:0;padding:0;display:block}:is(.enhanced,.story-starting) .copy{position:fixed;inset:0;max-width:none;visibility:hidden;pointer-events:none}:is(.enhanced,.story-starting) .copy.active{visibility:visible}:is(.enhanced,.story-starting) .heading{position:absolute;top:10svh;left:5vw;right:5vw}:is(.enhanced,.story-starting) .detail{position:absolute;top:77svh;left:5vw;right:5vw;margin:0 auto;max-width:660px}:is(.enhanced,.story-starting) .copy.active a{pointer-events:auto}:is(.enhanced,.story-starting) .line{will-change:opacity,transform,clip-path}:is(.enhanced,.story-starting) .eyebrow,:is(.enhanced,.story-starting) .detail{will-change:opacity,transform}:is(.enhanced,.story-starting) .copy.leaving a{pointer-events:none}
.reading-tools{position:fixed;bottom:0;left:0;right:0;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:16px 4vw 24px;background:linear-gradient(transparent,#101210f5 65%)}.reading-tools nav{display:flex;gap:12px}.reading-tools nav a{display:grid;place-items:center;width:48px;height:44px;border-top:1px solid #3a4035;color:#8b9285;font-size:11px}.reading-tools nav a[aria-current]{border-top-color:var(--accent);color:var(--paper)}#motion{border:1px solid #3a4035;color:var(--muted);padding:9px 15px;border-radius:30px;background:#151914;font-size:11px;cursor:pointer;min-height:44px}#motion[aria-pressed=true]{color:var(--paper);border-color:var(--accent)}
footer{position:relative;z-index:3;background:#171c17;padding:120px 8vw 150px;display:grid;grid-template-columns:1fr 1fr;gap:50px 8vw;border-top:1px solid #333a30}footer h2{font-size:clamp(45px,4vw,75px)}footer p{max-width:480px;color:var(--muted)}footer figure{margin:50px 0 0;align-self:center}footer figure img{width:100%;display:block;aspect-ratio:1.5;object-fit:cover;filter:saturate(.65)}figcaption{font-size:11px;color:var(--muted);padding-top:12px}.resource-links{margin-top:35px;max-width:480px}.resource-links a{display:flex;justify-content:space-between;gap:20px;padding:19px 0;border-top:1px solid #3d4638;font-size:14px}.resource-links a:hover{color:var(--accent)}.resource-links span{color:var(--accent)}footer .credit{font-size:11px;max-width:650px;margin:0}.back{font-size:13px;justify-self:end;align-self:center}
@media(min-width:1800px){#visual{inset:22svh 0 23svh}:is(.enhanced,.story-starting) .heading{top:11svh}h1,h2{font-size:clamp(78px,4.5vw,108px)}.detail>p:not(.lead){font-size:16px}}
@media(max-width:800px){.masthead{padding:15px 6vw}.identity img{width:45px;height:37px}.mast-note{display:none}.visit{font-size:10px;gap:12px}h1,h2{font-size:clamp(36px,8vw,60px)}.eyebrow{margin-bottom:14px;font-size:9px}:is(.enhanced,.story-starting) .heading{top:13svh}:is(.enhanced,.story-starting) .detail{top:69svh;left:7vw;right:7vw}.lead{font-size:18px}.detail>p:not(.lead){font-size:13px;max-width:420px}.next{margin-top:12px;font-size:10px}#visual{inset:28svh 0 33svh}.visual-caption{bottom:77px;left:6vw;right:6vw;font-size:8px;gap:12px}#visual-source{display:none}.reading-tools{padding:8px 6vw 12px}.reading-tools nav{gap:6px}.reading-tools nav a{width:28px}#motion{font-size:9px;padding:7px 10px}footer{padding:80px 7vw 110px;grid-template-columns:1fr;gap:30px}footer figure{margin:0;grid-row:2}.back{justify-self:start}footer .credit{grid-row:3}}
@media(max-height:700px) and (min-width:801px){.masthead{padding-top:12px}.identity img{height:35px;width:44px}h1,h2{font-size:43px}.eyebrow{margin-bottom:8px}:is(.enhanced,.story-starting) .detail{top:74svh}.detail>p:not(.lead){font-size:12px}.lead{font-size:17px}.next{margin-top:6px}.visual-caption{bottom:76px}.reading-tools{padding-bottom:10px}#visual{inset:24svh 0 29svh}}
@media(max-height:720px) and (max-width:800px){:is(.enhanced,.story-starting) .heading{top:12svh}h1,h2{font-size:34px}:is(.enhanced,.story-starting) .detail{top:64svh}.lead{font-size:16px}.detail>p:not(.lead){font-size:12px}.visual-caption{bottom:66px}.next{margin-top:7px}#visual{inset:29svh 0 37svh}}
@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}*{transition:none!important}}
/* Keep the words above the image, leaving the collective gestures visible. */
@media(min-width:801px){:is(.enhanced,.story-starting) .heading{top:9svh}h1,h2{font-size:clamp(42px,4vw,68px)}#visual{inset:27svh 0 23svh}}
@media(min-width:1800px){:is(.enhanced,.story-starting) .heading{top:9svh}h1,h2{font-size:72px}#visual{inset:25svh 0 23svh}}
@media(max-height:700px) and (min-width:801px){h1,h2{font-size:40px}:is(.enhanced,.story-starting) .heading{top:10svh}#visual{inset:28svh 0 29svh}}
/* Allow particles to travel beyond the photographic frame during a morph. */
#visual canvas{position:absolute;left:0;top:-45%;width:100%;height:190%}
/* Monochrome field: free particles occupy the entire viewport before gathering. */
:root{--paper:#e2e2e2;--muted:#999;--accent:#bebebe;--ground:#101010}
#visual{inset:0;width:100%;height:100svh}
#visual canvas{inset:0;width:100%;height:100%}
:is(.enhanced,.story-starting) .chapter{height:280svh}
.fallback{filter:grayscale(1)}
.scroll-cue{display:none;position:fixed;z-index:2;left:15%;right:15%;bottom:13svh;text-align:center;font-size:12px;letter-spacing:.08em;color:#aaa;pointer-events:none}
:is(.enhanced,.story-starting) .scroll-cue{display:block}
:is(.enhanced,.story-starting) .heading{text-shadow:0 1px 2px #101010}
.masthead{background:linear-gradient(#101010e6,transparent)}
.reading-tools{background:linear-gradient(transparent,#101010f5 65%)}
#motion{background:#171717;border-color:#404040}
.reading-tools nav a{color:#909090;border-top-color:#3a3a3a}
.visit{border-bottom-color:#595959}
footer{background:#191919;border-color:#333}
@media(max-width:800px){.scroll-cue{font-size:10px;bottom:17svh}}
/* Words float over an immersive field instead of framing a centred image. */
:is(.enhanced,.story-starting) .heading{left:7vw;right:auto;top:15svh;max-width:620px;text-align:left}
:is(.enhanced,.story-starting) .detail{left:7vw;right:auto;top:auto;bottom:16svh;margin:0;max-width:460px;text-align:left;text-shadow:0 1px 2px #101010}
:is(.enhanced,.story-starting) .detail>p:not(.lead){margin-left:0}
@media(max-width:800px){:is(.enhanced,.story-starting) .heading{top:13svh;left:7vw;right:7vw;max-width:none}:is(.enhanced,.story-starting) .detail{left:7vw;right:7vw;bottom:17svh;max-width:none}:is(.enhanced,.story-starting) .heading h1,:is(.enhanced,.story-starting) .heading h2{font-size:36px}}
@media(max-height:720px){:is(.enhanced,.story-starting) .heading{top:13svh}:is(.enhanced,.story-starting) .detail{bottom:19svh}:is(.enhanced,.story-starting) .heading h1,:is(.enhanced,.story-starting) .heading h2{font-size:34px}}
:is(.enhanced,.story-starting) .heading,:is(.enhanced,.story-starting) .detail{isolation:isolate}
/* Enough scroll travel to finish assembly and enter exploration. */
:is(.enhanced,.story-starting) #recit{padding-bottom:30svh}

/* The photographs stay unobscured by navigation gradients. */
.masthead,.reading-tools{background:none}
:is(.enhanced,.story-starting) #relations .detail{bottom:17svh}

/* Compact language access; the chapter counter and duplicate labels are gone. */
.reading-tools{justify-content:flex-end;pointer-events:none}.reading-tools button{pointer-events:auto}
.languages{display:flex;gap:14px;align-items:center;pointer-events:auto;font-size:11px;letter-spacing:.08em}.languages a{padding:10px 2px;color:#999}.languages a[aria-current]{color:#eee;border-bottom:1px solid #999}
@media(max-width:800px){.languages{gap:12px;font-size:10px}}

/* The final title has three readable lines alongside the building. */
:is(.enhanced,.story-starting) #relations .heading{max-width:48vw}
#relations h2,:is(.enhanced,.story-starting) #relations .heading h2{font-size:clamp(27px,2.7vw,49px);line-height:1.12;letter-spacing:-.035em}
@media(max-width:800px){:is(.enhanced,.story-starting) #relations .heading{max-width:none}#relations h2,:is(.enhanced,.story-starting) #relations .heading h2{font-size:clamp(22px,5.7vw,36px)}}
@media(max-height:550px) and (min-width:801px){#relations h2,:is(.enhanced,.story-starting) #relations .heading h2{font-size:26px}:is(.enhanced,.story-starting) #relations .detail{bottom:15svh;max-width:440px}}

/* Audit implementation: a shared editorial shell with an independent scene. */
:root{--ground:#171514;--paper:#f3eee7;--muted:#c2bab2;--accent:#edafa9;--plum:#773b5b}
body{background:var(--ground)}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
button,a,select{touch-action:manipulation}button:focus-visible,a:focus-visible,select:focus-visible,h1:focus-visible,h2:focus-visible{outline:2px solid var(--accent);outline-offset:5px}
.masthead{padding:18px 4vw;gap:24px;background:linear-gradient(#171514f5,#171514d9 70%,transparent);align-items:center}
.identity{display:flex;align-items:center;gap:13px;white-space:nowrap;font-size:15px}.identity img{width:48px;height:40px}.header-nav{display:flex;align-items:center;gap:14px}.header-nav button{pointer-events:auto;background:none;border:0;color:var(--paper);font:inherit;font-size:14px;min-height:44px;padding:8px;display:flex;align-items:center;gap:9px;cursor:pointer}
.languages{font-size:12px;gap:4px}.languages a{display:grid;place-items:center;min-width:32px;min-height:44px;padding:8px 4px;color:#c2bab2}.languages a[aria-current]{color:#fff;border-color:var(--accent)}
h1,h2{font-family:Georgia,'Times New Roman',serif;letter-spacing:-.045em;font-weight:400;line-height:1.07}h1{font-size:clamp(44px,5.4vw,80px)}h2{font-size:clamp(38px,4.5vw,68px)}
.chapter-kicker{font:500 12px/1.4 Outfit,Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin:0 0 18px}
:is(.enhanced,.story-starting) .heading{left:6vw;top:18svh;max-width:43vw;text-align:left}:is(.enhanced,.story-starting) .heading h1,:is(.enhanced,.story-starting) .heading h2{font-size:clamp(40px,4.7vw,72px)}
:is(.enhanced,.story-starting) .detail{left:6vw;bottom:18svh;max-width:min(430px,37vw);padding:16px 18px 16px 0;background:linear-gradient(90deg,#171514f2 60%,#17151400);border-radius:4px;text-shadow:none}
.detail .lead{font-size:clamp(19px,1.5vw,24px);line-height:1.35}.detail>p:not(.lead){font-size:16px;line-height:1.55;color:var(--muted)}
.chapter-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:20px}.action,.next{display:inline-flex;justify-content:space-between;align-items:center;gap:18px;min-height:46px;border:1px solid #a3988c70;border-radius:4px;padding:11px 16px;font:400 14px/1.4 Outfit,Arial,sans-serif;margin:0;color:var(--paper);transition:background .2s,border-color .2s}.action:hover,.next:hover{background:#f3eee715;border-color:var(--accent);color:var(--paper)}.action.primary{background:#f0b2ac;color:#24191b;border-color:#f0b2ac}.action.primary:hover{background:#f6c6c0}.next{border:0;border-bottom:1px solid #a3988c70;padding-left:0;border-radius:0}
.scroll-cue{left:6vw;right:auto;bottom:10svh;text-align:left;font-size:12px;color:var(--muted)}
.reading-tools{padding:12px 4vw 20px;justify-content:flex-end;gap:10px;background:linear-gradient(transparent,#171514ed)}.reading-tools button{min-height:44px;font-size:13px;border:1px solid #a3988c70;background:#242020;color:var(--paper);padding:10px 15px;border-radius:4px;cursor:pointer;pointer-events:auto}#motion{font-size:13px;min-height:44px;background:#242020;border-radius:4px;color:var(--paper)}.reading-tools button[aria-pressed=true]{border-color:var(--accent);background:#49313c}.reveal-hint{font-size:12px;line-height:1.4;color:var(--muted);margin-right:auto;max-width:270px}
.reading-image,.reading-intro{display:none}.reading-mode .reading-image{display:block;margin:30px 0}.reading-image img{max-width:100%;height:auto;max-height:60vh;object-fit:contain}.reading-mode .reading-intro{display:block;margin:130px auto 0;max-width:800px;padding:0 24px;font-size:17px}.reading-mode .chapter{min-height:0;padding:70px 24px}.reading-mode .copy{max-width:900px;text-align:left;width:100%}.reading-mode .detail{margin:20px 0;max-width:680px}.reading-mode .scene-description{display:none}.reading-mode .scroll-cue{display:none}
.story-dialog{width:min(600px,calc(100% - 32px));max-height:85dvh;overflow:auto;background:#f3eee7;color:#34202c;border:0;border-radius:8px;padding:38px;box-shadow:0 24px 100px #0007}.story-dialog::backdrop{background:#171514c9;backdrop-filter:blur(5px)}.story-dialog h2{font-size:38px;margin:8px 45px 25px 0}.close{position:absolute;right:18px;top:15px;width:44px;height:44px;background:none;color:inherit;border:1px solid #773b5b45;border-radius:50%;font-size:26px;cursor:pointer}.story-dialog nav{display:flex;flex-direction:column;margin-bottom:24px}.story-dialog nav a{display:flex;gap:18px;justify-content:space-between;align-items:center;min-height:56px;border-top:1px solid #773b5b30;padding:14px 0;font-size:18px;line-height:1.35}.story-dialog nav a span{font:12px Outfit,Arial,sans-serif;color:#773b5b}.story-dialog a:hover{color:#773b5b}.story-dialog .primary{color:#fff;background:#773b5b;border-color:#773b5b;font-size:15px}.simple-link{display:block;width:fit-content;min-height:44px;padding:12px 0;font-size:14px;text-decoration:underline;text-underline-offset:4px}
footer{background:#f3eee7;color:#34202c;padding:110px 6vw 75px;border:0;gap:40px;align-items:center;grid-template-columns:1.15fr 1fr}footer h2{font-size:clamp(36px,4vw,64px);line-height:1.12}footer p,footer .chapter-kicker{color:#684253}footer p{font-size:18px;line-height:1.5}footer figure{margin:0}footer figure img{filter:none;object-fit:contain;height:auto;max-height:500px}footer .resource-links{margin-top:30px}footer .resource-links a{font-size:16px;min-height:55px;border-color:#773b5b40}footer .resource-links a:hover{color:#773b5b}footer .resource-links span{color:#773b5b}footer .back{grid-column:1/-1;justify-self:start;font-size:14px;min-height:44px;padding:12px 0;text-decoration:underline}body[data-after-story=true] .reading-tools,body[data-after-story=true] .scroll-cue{visibility:hidden}
:is(.enhanced,.story-starting) #relations .heading{max-width:46vw}#relations h2,:is(.enhanced,.story-starting) #relations .heading h2{font-size:clamp(30px,3.35vw,54px);line-height:1.12}:is(.enhanced,.story-starting) #relations .detail{bottom:16svh}
@media(max-width:800px){
 .masthead{padding:12px 5vw;gap:10px}.identity{gap:8px;font-size:13px}.identity img{width:35px;height:30px}.header-nav{gap:4px}.header-nav button{font-size:13px;padding:6px}.menu-name{display:none}.languages{display:none}
 :is(.enhanced,.story-starting) .heading{top:13svh;left:6vw;right:6vw;max-width:none}:is(.enhanced,.story-starting) .heading h1,:is(.enhanced,.story-starting) .heading h2{font-size:clamp(34px,7vw,48px)}.chapter-kicker{font-size:10px;margin-bottom:12px}
 :is(.enhanced,.story-starting) .detail,:is(.enhanced,.story-starting) #relations .detail{left:6vw;right:6vw;bottom:88px;max-width:none;padding:14px 0 8px;background:linear-gradient(0deg,#171514 88%,#17151400)}.detail .lead{font-size:19px}.detail>p:not(.lead){font-size:16px;line-height:1.45}.chapter-actions{margin-top:12px;gap:8px}.action,.next{font-size:13px;padding:10px 12px;min-height:44px}.chapter-actions .primary{flex:1}.chapter-actions .action:first-child:not(.primary){flex:1}
 .reading-tools{padding:10px 6vw 18px;gap:8px;justify-content:flex-start}.reading-tools button,#motion{font-size:12px;padding:9px 12px}.reveal-hint{display:none}.scroll-cue{bottom:74px;font-size:11px}:is(.enhanced,.story-starting) #relations .heading{max-width:none}#relations h2,:is(.enhanced,.story-starting) #relations .heading h2{font-size:clamp(26px,6.1vw,37px)}
 footer{padding:75px 6vw;grid-template-columns:1fr}footer figure{grid-row:auto}footer h2{font-size:38px}.story-dialog{padding:28px 24px}.story-dialog h2{font-size:32px}.story-dialog nav a{font-size:17px}.reading-mode .chapter{padding:45px 6vw}
}
@media(max-height:650px){:is(.enhanced,.story-starting) .heading{top:15svh}:is(.enhanced,.story-starting) .heading h1,:is(.enhanced,.story-starting) .heading h2{font-size:32px}:is(.enhanced,.story-starting) .detail,:is(.enhanced,.story-starting) #relations .detail{bottom:70px}.detail .lead{font-size:17px}.detail>p:not(.lead){font-size:14px}.chapter-kicker{margin-bottom:8px}.chapter-actions{margin-top:10px}.scroll-cue{display:none}.reading-tools{padding-bottom:10px}:is(.enhanced,.story-starting) #relations .heading h2{font-size:26px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

.story-dialog .languages{display:flex}.story-dialog .languages a{color:#684253}.story-dialog .languages a[aria-current]{color:#34202c;border-color:#773b5b}

/* Keep the first frame stable while the point renderer initializes. */
.story-starting #visual > .fallback{display:none}
