:root{--ink:#594337;--paper:#fffdf9;--pause:#f5f6f1;--closing:#faf7f1;--accent:#be6037;background:var(--paper);color:var(--ink);scroll-behavior:auto}*{box-sizing:border-box}body{margin:0;font-family:"Hiragino Maru Gothic ProN","Yu Gothic",sans-serif;line-height:1.9}a{color:inherit}button{font:inherit;color:inherit}h1,h2,p,figure{margin:0}.story-header{height:65px;position:sticky;top:0;z-index:10;background:#fffdf9f5;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;border-bottom:1px solid #e9dfd1}.brand{font-weight:800;text-decoration:none;letter-spacing:.03em}.brand span{font-weight:400;font-size:.8em;margin-left:.35em}button{border:1px solid #ddcebd;background:transparent;border-radius:24px;padding:6px 14px;cursor:pointer;font-size:12px}a:focus-visible,button:focus-visible{outline:3px solid #a77c65;outline-offset:5px}.progress{position:sticky;top:65px;height:35px;z-index:10;display:flex;align-items:center;gap:18px;padding:0 5vw;background:#fffdf9f5;font-size:11px;letter-spacing:.08em}.track{height:2px;background:#eadfce;flex:1}.track span{display:block;background:var(--accent);height:100%;width:0}.panel{position:relative;min-height:calc(100svh - 100px);display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;gap:5vw;padding:64px max(5vw,calc((100vw - 1280px)/2));scroll-margin-top:100px}.copy{padding:15px 0 25px;position:relative;max-width:540px}h1{font-size:clamp(38px,4.6vw,70px);line-height:1.65;letter-spacing:.06em}h1 em{font-style:normal;color:var(--accent)}h2{font-size:clamp(27px,2.8vw,43px);line-height:1.8;letter-spacing:.04em;font-weight:600}.eyebrow{font-size:11px;letter-spacing:.16em;color:#826c58;margin-bottom:26px}.lead{font-size:23px;line-height:2;margin-top:24px}.story-text{font-size:clamp(17px,1.65vw,23px);line-height:2.2;margin-top:30px}.start{display:inline-flex;gap:25px;align-items:center;text-decoration:none;border-bottom:1px solid #ba9175;padding:8px 0;margin-top:32px;font-size:14px}.start span{color:var(--accent)}figure{min-width:0;text-align:center}figure img{width:100%;height:auto;max-height:65svh;object-fit:contain;mix-blend-mode:multiply;display:block}figcaption{font-size:12px;letter-spacing:.15em;color:#826c58;margin-top:12px}.reverse .copy{grid-column:2;grid-row:1}.reverse figure{grid-column:1;grid-row:1}.next{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);padding:8px 20px;text-decoration:none;color:#94705a;font-size:22px}.bubble-art{position:relative;padding-top:104px}.bubble{position:absolute;top:2px;right:18%;z-index:2;background:var(--paper);border:1.5px solid #a77c65;color:var(--ink);font-size:clamp(16px,1.4vw,20px);line-height:1.7;letter-spacing:.04em;padding:13px 25px;font-weight:500;max-width:95%}.thought{border-radius:50%}.thought::before,.thought::after{content:"";position:absolute;background:var(--paper);border:1.5px solid #a77c65;border-radius:50%}.thought::before{width:10px;height:8px;bottom:-15px;left:58%}.thought::after{width:5px;height:5px;bottom:-26px;left:54%}.speech{border-radius:46%}.speech::after{content:"";position:absolute;width:14px;height:18px;bottom:-12px;left:58%;background:var(--paper);border-right:1.5px solid #a77c65;border-bottom:1.5px solid #a77c65;transform:skewY(35deg) rotate(24deg)}#scene-together,.afterword{background:var(--closing)}.afterword{padding:100px max(24px,calc((100vw - 772px)/2));scroll-margin-top:100px}.afterword h2{font-size:28px}.afterword>p:not(.eyebrow){margin-top:24px;font-size:15px;line-height:2.2}.end-links{display:flex;align-items:baseline;flex-wrap:wrap;gap:28px}.end-links>a{font-size:13px}.colophon{color:#826c58;font-size:11px!important}.large-text .story-text{font-size:clamp(22px,2.1vw,29px)}
@media(max-width:700px){.panel{display:flex;flex-direction:column;gap:26px;padding:42px 28px 64px;justify-content:center}.copy{padding:0;width:100%;max-width:460px}.eyebrow{margin-bottom:14px}h1{font-size:42px}h2{font-size:27px}.lead{font-size:19px;margin-top:16px}.story-text{font-size:17px;margin-top:18px;line-height:2}.panel figure{width:100%;max-width:460px}.panel figure img{max-height:48svh}.cover figure img{max-height:40svh}.cover .start{margin-top:18px}.bubble-art{padding-top:100px}.bubble{font-size:16px;right:14%}.afterword{padding:64px 28px}.afterword h2{font-size:24px}}@media print{.story-header,.progress,.next,.start{display:none}.panel{min-height:0;break-after:page}.afterword{break-before:page}figure img{max-height:65vh}}

.sources{font-size:12px!important}
.observation-art.bubble-art{padding-top:0}
.observation-thoughts{display:flex;flex-wrap:wrap;justify-content:center;gap:30px 12px;margin-bottom:38px}
.observation-thoughts .bubble.thought{position:relative;inset:auto!important;font-size:clamp(14px,1.2vw,17px);padding:12px 20px;max-width:100%}
.observation-thoughts .bubble:last-child{margin-left:18%}
@media(max-width:700px){.observation-thoughts{gap:28px 10px;margin-bottom:32px}.observation-thoughts .bubble.thought{font-size:15px;padding:11px 18px}}

/* Gen: a quiet page rhythm and room for speech above the artwork. */
:root{--accent:#7d2741}
.panel{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}
.copy{min-width:0;overflow-wrap:anywhere}
.bubble-art{display:flex;flex-direction:column;align-items:center;gap:30px;padding-top:0}
.bubble-art .bubble{position:relative;inset:auto;align-self:flex-start;max-width:95%;margin-left:5%}
.bubble-art img{flex:none}
.observation-thoughts{width:100%;margin-bottom:0;gap:30px 14px}
.observation-thoughts .bubble:last-child{margin-left:0}
#scene-rest{background:var(--pause)}
#scene-together{background:var(--closing)}
figure img{max-height:62svh}
.cover figure img,#scene-hello figure img{max-height:68svh}
@media(max-width:700px){figure img,.cover figure img,#scene-hello figure img{max-height:48svh}.bubble-art{padding-top:0}.observation-thoughts{margin-bottom:0}}