/* Shared editorial identity. Scene geometry and input remain independent. */
:root{--paper:#e9e5dc;--ink:#302f2b;--muted:#77736a;--hairline:#8b84734d;--serif:Georgia,'Times New Roman','Songti SC',serif}
body{font-family:var(--serif);background:var(--paper);color:var(--ink);-webkit-font-smoothing:antialiased}
h1,.title h1,.intro h1,.caption h1,.time-intro h1{font-family:var(--serif);font-weight:400;font-size:clamp(40px,4.5vw,64px);letter-spacing:-.025em;line-height:1.12}
.title .definition,.intro .en,.definition,.time-intro .definition{font-family:var(--serif);font-weight:400;font-size:clamp(17px,1.5vw,21px);line-height:1.6}
.ipa,.title .ipa{font-family:var(--serif);font-size:13px;opacity:.65}
.zh,.title .zh,.intro .zh{font-size:14px;line-height:1.85;font-weight:400}
header{height:76px;padding:0 5vw;background:transparent;color:inherit;border:0}
header small,.study{font-family:var(--serif);font-size:10px;letter-spacing:.08em;line-height:1.6}
nav a,nav{font-family:var(--serif);font-size:15px;font-weight:400}
.circle,.tools button{width:36px;height:36px;border:1px solid var(--hairline);border-radius:50%;background:transparent}
.circle svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}
.hint{font-family:var(--serif);font-size:11px;line-height:1.8;opacity:.65}
body.anemoia,body.kenopsia,body.opia{background:#171918;color:#e9e5dc}
body.anemoia header,body.kenopsia header,body.opia header{position:absolute;inset:0 0 auto;z-index:20;background:linear-gradient(#1118,transparent);color:#e9e5dc}
.anemoia .panorama,.kenopsia .panorama{height:100svh}.anemoia .world{border:0}.anemoia .world,.kenopsia .world{width:max(100vw,300svh)}
.pan-copy{left:5vw;bottom:7vh;max-width:470px}.pan-copy:before{opacity:.75}
.gaze-scene{height:100svh;background:radial-gradient(ellipse at 64% 35%,#4c4d48,#202422 75%)}
.gaze-photo{width:min(74vw,1000px);height:min(49.333vw,666px);left:66%;top:40%;filter:saturate(.55);mask-image:linear-gradient(90deg,transparent,#000 14%,#000 85%,transparent),linear-gradient(0deg,transparent,#000 15%,#000 90%,transparent);mask-composite:intersect}
.eye-region{left:39%;top:23%;width:51%;height:22%}.gaze-scene .title{bottom:7vh;max-width:470px}.gaze-scene:after{inset:65% 0 0}
.routes,.mono,.expression{background:var(--paper)}.routes .title,.mono .title,.expression .title{padding:35px 5vw 15px}
.letterfield{background:none;border-top:1px solid #8b847320;height:360px;margin-top:12px}
.letterrows{font-family:var(--serif);font-size:16px;gap:25px;color:#969084;left:32%;top:34px;transform:perspective(1100px) rotateY(-8deg);transform-origin:left center}
.letterrows div{word-spacing:32px}.stranger{font-family:var(--serif);font-size:20px;font-weight:400;border:0}
.mono-caption{opacity:.5}.here{border-width:4px;box-shadow:0 8px 24px #302b2518}.destination{border-width:2px;box-shadow:none}.map path{opacity:.45}.breadcrumbs button{font-size:11px}
.expression .whole{box-shadow:0 10px 28px #302b251a}.paper{background:#f1eee7;box-shadow:0 5px 20px #302b2510}.expression-note{opacity:.45}
body.book-study{background:#292b27;color:#e8e3d7}body.book-study header{background:#292b27}body.book-study main{background:radial-gradient(ellipse at 65% 10%,#b3a58a25,transparent 65%),linear-gradient(155deg,#57594e,#343830 80%)}
body.book-study .desk{background:linear-gradient(165deg,#b4aa8a16,#2528200a 65%);border-top:1px solid #d7caaa1c;box-shadow:inset 0 15px 28px #15191118;margin-top:28px;height:490px}
body.book-study .book{filter:drop-shadow(2px 5px 3px #10140e60);width:280px;height:280px}
body.book-study .intro{padding-top:24px}body.book-study .hint{color:#d5d1c7}body.book-study .footer{opacity:.5}
.river-word,.year,.time-ending h2{font-family:var(--serif);font-weight:400}.time-intro{max-width:700px}
@media(max-width:600px){header{height:68px;padding:0 20px}.utilities{gap:7px}.circle{width:32px;height:32px}nav,nav a{font-size:13px}nav{gap:12px}.pan-copy{left:24px;bottom:50px;max-width:calc(100vw - 48px)}.title h1,.intro h1,.caption h1,.time-intro h1{font-size:40px}.gaze-photo{width:115vw;height:76.667vw;left:54%;top:32%}.eye-region{left:20%;top:22%;width:72%;height:20%}.gaze-scene .title{left:24px;bottom:7vh;max-width:calc(100vw - 48px)}.letterrows{font-size:13px;gap:29px;left:36%}.stranger{font-size:18px}.routes .title,.mono .title,.expression .title{padding:30px 24px 14px}body.book-study .desk{height:970px}body.book-study .book{width:280px;height:280px}}
/* Random-entry continuity: one experience identity, independent scenes. */
:root{--serif:'Cormorant Garamond','Noto Serif SC',Georgia,serif}
body:not(.atlas-overview){background:#202221;color:#eee7dc;--hairline:#ffffff35;--paper:#202221;--ink:#eee7dc}
body:not(.atlas-overview) header,body.time header,body.book-study header{height:96px;padding:0 5vw;background:linear-gradient(#171918b0,transparent);color:#eee7dc;border:0}
header small,.study{opacity:.55}
h1,.title h1,.intro h1,.caption h1,.time-intro h1{letter-spacing:.025em;font-size:clamp(42px,5vw,70px)}
.title .definition,.intro .en,.definition,.time-intro .definition{font-size:21px;line-height:1.7}
.circle,.tools button{width:40px;height:40px;border-color:#ffffff35;color:#eee7dc;background:#11131418}
.circle:hover{border-color:#eee7dc88;background:#eee7dc15}
.routes,.mono,.expression{background:radial-gradient(ellipse at 65% 25%,#45464055,transparent 75%),#202221;color:#eee7dc}
.routes .title,.mono .title,.expression .title,.intro{max-width:650px}
.letterrows{color:#a5a095}.stranger{color:#eee7dc}.letterfield{border-color:#ffffff16}
.paper{background:#ded8cb;color:#38362f}.here{border-color:#bcb5a54d}.destination{border-color:#bcb5a54d}.map path{stroke:#bcb5a5}.breadcrumbs button{color:#c0b8aa}
body.book-study main{background:radial-gradient(ellipse at 65% 10%,#77756842,transparent 75%),#252724}body.book-study .desk{background:linear-gradient(160deg,#b2a78a16,#10131010);border-color:#ffffff12}
body.time .river-view{background:#252724;color:#eee7dc}body.time .river-shade{background:linear-gradient(0deg,#202221,transparent 28%)}
.atlas-nav{display:flex;gap:12px;align-items:center}.atlas-nav a{display:inline-grid;place-items:center;opacity:1;text-decoration:none}.atlas-nav a[aria-current]{border-color:#eee7dc88;background:#eee7dc15}
.atlas-back{display:flex;align-items:center;gap:14px;font-size:10px;letter-spacing:.08em}.atlas-back span{opacity:.55}
@media(max-width:600px){body:not(.atlas-overview) header,body.time header,body.book-study header{height:84px;padding:0 22px}.atlas-back span{display:none}.atlas-nav{gap:10px}.title h1,.intro h1,.caption h1,.time-intro h1{font-size:42px}.title .definition,.intro .en,.definition,.time-intro .definition{font-size:19px}.routes .title,.mono .title,.expression .title{padding-top:24px}}
/* Both themes are explicit; photography keeps readable local captions. */
:root[data-theme=dark]{color-scheme:dark;--theme-bg:#202221;--theme-fg:#eee7dc;--theme-muted:#b1aaa0;--theme-line:#ffffff35;--theme-surface:#292b29}
:root[data-theme=light]{color-scheme:light;--theme-bg:#eee9df;--theme-fg:#34312b;--theme-muted:#726b60;--theme-line:#746b594d;--theme-surface:#e4ded2}
html[data-theme] body,html[data-theme] body:not(.atlas-overview){background:var(--theme-bg);color:var(--theme-fg);--paper:var(--theme-bg);--ink:var(--theme-fg);--hairline:var(--theme-line)}
html[data-theme] .routes,html[data-theme] .mono,html[data-theme] .expression,html[data-theme] body.book-study main{background:radial-gradient(ellipse at 65% 20%,#9d948215,transparent 75%),var(--theme-bg);color:var(--theme-fg)}
html[data-theme] body:not(.atlas-overview) header,html[data-theme] body.time header,html[data-theme] body.book-study header{color:var(--theme-fg);background:linear-gradient(var(--theme-bg),transparent)}
html[data-theme] .circle,html[data-theme] .tools button{color:var(--theme-fg);border-color:var(--theme-line);background:color-mix(in srgb,var(--theme-bg) 75%,transparent)}
html[data-theme] .stranger,html[data-theme] .breadcrumbs button{color:var(--theme-fg)}
html[data-theme] .letterrows,html[data-theme] .atlas-overview a small,html[data-theme] body.book-study .hint{color:var(--theme-muted)}
html[data-theme] .letterfield,html[data-theme] .atlas-overview .list a{border-color:var(--theme-line)}
html[data-theme] .atlas-overview a strong{font-family:var(--serif)}
html[data-theme] dialog{background:var(--theme-bg);color:var(--theme-fg)}
html[data-theme=light] .gaze-scene{background:radial-gradient(ellipse at 64% 35%,#b6b2a7,#eee9df 75%)}
html[data-theme=light] .gaze-scene:after{background:linear-gradient(transparent,#eee9df)}
html[data-theme=light] .gaze-scene .title{color:var(--theme-fg);text-shadow:none}
html[data-theme=light] .gaze-photo{filter:saturate(.55);opacity:.9}
html[data-theme=light] .gaze-photo.direct{opacity:0}html[data-theme=light] .gaze-scene[data-looking=true] .direct{opacity:.9}
html[data-theme=light] body.book-study .desk{background:linear-gradient(155deg,#d3c8b530,#b9ac9310);border-color:var(--theme-line)}
html[data-theme] body.time .river-view{background:var(--theme-bg)}
html[data-theme=light] .paper{background:#f7f3ea;color:#34312b}
.overview-theme{position:fixed;right:5vw;top:28px;z-index:30;cursor:pointer}.atlas-overview main{padding-top:100px}
#study-theme svg{fill:none}#study-theme[aria-pressed=true] svg{fill:#a99b6b25}
@media(max-width:600px){header .study{display:none}.utilities{gap:8px}.atlas-nav{gap:8px}.overview-theme{top:20px;right:22px}.atlas-overview main{padding-top:90px}html[data-theme] body.time .river-view{color:var(--theme-fg)}html[data-theme] body.time .river-shade{background:linear-gradient(0deg,var(--theme-bg),transparent 28%)}}
.atlas-overview .overview-return{display:inline-flex;align-items:center;gap:10px;border:0;padding:0;margin-bottom:30px;font-size:14px;color:var(--theme-muted)}.atlas-overview .overview-return span{display:inline;margin:0;font-size:12px}
.atlas-back i.circle{display:inline-grid;place-items:center;flex-shrink:0}
.embedded-scene header,.embedded-scene #study-theme,.embedded-scene .tools a,.embedded-scene .footer,.embedded-scene .study-note{display:none!important}
.embedded-scene .panorama,.embedded-scene .gaze-scene{height:100svh}.embedded-scene #zenosyne{padding-top:20px}.scene-frozen *{animation-play-state:paused!important}.scene-frozen main{pointer-events:none}
@media(max-width:600px){body.book-study .book{width:220px;height:220px}body.book-study .desk{height:710px}.expression-space{grid-template-columns:1fr 1fr;gap:16px;padding:10px 20px 24px}.expression-space .whole{aspect-ratio:3/4}.expression-space .paper{min-height:210px}.expression .received{width:40px;height:40px}.expression .title .definition{font-size:17px}.book-instruction{margin-top:14px!important}}
/* Onism: a place occupies the view; alternatives remain peripheral. */
.routes .map{height:440px;margin:0 5vw}.routes .map svg{display:none}.routes .here{width:72%;height:80%;border:0;background-size:cover;box-shadow:none}.routes .destination{z-index:2;opacity:.75;transition:opacity .25s}.routes .destination:hover,.routes .destination:focus-visible{opacity:1}.routes .here small{background:#161b19aa;padding:5px 10px}
.expression .paper{background:linear-gradient(#eee9dfa6,#eee9dfa6),url('/images/anemoia.webp') center/cover}.expression .paper:before{border:0}.expression .received{border:2px solid #eee9df88}
@media(max-width:600px){.routes .here{width:76%;height:65%}.routes .map{height:370px}}
html[data-theme] .expression .paper{background:linear-gradient(#eee9df80,#eee9df80),url('/images/anemoia.webp') center/cover;color:#34312b}
/* Embedded scenes use the remaining viewport, including both definition languages. */
.embedded-scene,.embedded-scene body{height:100%;overflow:hidden}
.embedded-scene main{height:100%;min-height:0}
.embedded-scene .ipa{display:inline-flex;align-items:center;gap:10px;line-height:30px}
.scene-pronunciation,.scene-pronunciation .pronunciation-control{display:inline-flex;align-items:center;position:relative;pointer-events:auto;line-height:1}
.scene-pronunciation .pronounce-button{display:grid;place-items:center;width:30px;height:30px;min-height:0;padding:0;border:1px solid currentColor;border-radius:50%;color:inherit;background:transparent;cursor:pointer}
.scene-pronunciation svg{display:block}
.scene-pronunciation .pronunciation-error{position:absolute;top:100%;left:0;width:170px;font-size:11px;line-height:1.5}
.embedded-scene .routes,.embedded-scene .mono,.embedded-scene .expression{height:100%;display:flex;flex-direction:column;overflow:hidden}
.embedded-scene .routes .title,.embedded-scene .mono .title,.embedded-scene .expression .title{padding:18px 5vw 8px;max-width:850px;flex-shrink:0}
.embedded-scene .title h1,.embedded-scene .intro h1,.embedded-scene .time-intro h1{font-size:clamp(30px,4vw,48px);margin:0 0 6px}
.embedded-scene .title .definition,.embedded-scene .intro .en,.embedded-scene .time-intro .definition{font-size:18px;line-height:1.5;margin:8px 0 5px}
.embedded-scene .title .zh,.embedded-scene .intro .zh,.embedded-scene .time-intro .zh{font-size:13px;line-height:1.7;margin:4px 0}
.embedded-scene .title .hint{margin:8px 0 0}
.embedded-scene .routes .map{height:auto;flex:1;min-height:120px;margin:0 5vw}
.embedded-scene .breadcrumbs{flex-shrink:0;padding:10px 5vw;min-height:32px;display:flex;gap:10px;overflow:auto;white-space:nowrap}
.embedded-scene .letterfield{flex:1;height:auto;min-height:140px;margin:8px 5vw}
.embedded-scene .mono-caption{padding:8px 5vw;margin:0;flex-shrink:0}
.embedded-scene .expression-space{flex:1;min-height:0;align-items:center;padding:8px 5vw;gap:24px}
.embedded-scene .expression-space .whole{max-height:100%;height:100%;width:auto;max-width:100%;object-fit:contain}
.embedded-scene .expression-space .paper{height:100%;min-height:0}
.embedded-scene .expression>.hint,.embedded-scene .expression-note{margin:0;padding:6px 5vw;font-size:11px}
.embedded-scene .pan-copy,.embedded-scene .gaze-scene .title{bottom:28px}
.embedded-scene #ambedo{height:100%;min-height:0}
.embedded-scene .caption{bottom:28px}
.embedded-scene body.book-study main{display:flex;flex-direction:column;height:100%}
.embedded-scene body.book-study .intro{padding:16px 5vw 0;max-width:750px;flex-shrink:0}
.embedded-scene body.book-study .desk{flex:1;min-height:160px;height:auto;width:100%;margin:8px 0 0}
.embedded-scene body.book-study .book{width:min(25vw,32vh,260px);height:min(25vw,32vh,260px)}
.embedded-scene body.book-study .hint{padding:6px 5vw;margin:0;flex-shrink:0;font-size:11px}
.embedded-scene .tools{bottom:14px;right:18px}
.embedded-scene #zenosyne:not([hidden]){height:100%;padding:0;display:flex;flex-direction:column}
.embedded-scene .time-intro{flex-shrink:0;max-width:800px;padding:14px 5vw 10px}
.embedded-scene .time-intro .hint{margin:8px 0 0}
.embedded-scene .ribbon{flex:1;min-height:0;overflow:auto;width:100%;overscroll-behavior:contain}
.embedded-scene .river-view{height:var(--river-height,55svh)}
.embedded-scene .river-word,.embedded-scene .time-ending{display:none}
.embedded-scene .river-date{bottom:55px;left:5vw;right:auto}
.embedded-scene .river-instruction{bottom:15px}
.embedded-scene .season-layer{width:100%;height:100%;background-size:200% 200%;top:50%;left:50%}
@media(max-width:600px){
 .embedded-scene .title .definition,.embedded-scene .intro .en,.embedded-scene .time-intro .definition{font-size:16px}
 .embedded-scene .title h1,.embedded-scene .intro h1,.embedded-scene .time-intro h1{font-size:32px}
 .embedded-scene .routes .title,.embedded-scene .mono .title,.embedded-scene .expression .title{padding-top:12px}
 .embedded-scene .pan-copy,.embedded-scene .gaze-scene .title{left:5vw;max-width:90vw}
 .embedded-scene .caption{left:5vw;max-width:90vw;padding:0}
 .embedded-scene .caption h1{font-size:38px}
 .embedded-scene .caption .definition{max-width:none;font-size:18px;margin:12px 0 4px}
 .embedded-scene .caption .hint{margin-top:12px}
 .embedded-scene .destination{width:54px;height:42px}
 .embedded-scene .letterrows{font-size:12px;gap:18px}
 .embedded-scene body.book-study .book{width:min(48vw,26vh);height:min(48vw,26vh)}
 .embedded-scene .expression-space{gap:14px}
}
/* Opia: keep the copy alongside the gaze, rather than pinned to the lower edge. */
.embedded-scene body.opia .gaze-scene .title{top:50%;bottom:auto;left:6vw;width:31vw;max-width:470px;transform:translateY(-50%)}
@media(max-width:600px){
 .embedded-scene body.opia .gaze-scene .title{top:45%;bottom:auto;left:6vw;width:88vw;max-width:none;transform:none}
}
@media(max-width:600px) and (max-height:650px){
 .embedded-scene body.opia .gaze-scene .title{top:43%}
 .embedded-scene body.opia .gaze-scene .title .hint{margin-top:6px}
}

/* Kenopsia: one place, before and after its people have left. */
.kenopsia .world>.ken-occupied{position:absolute;inset:0;pointer-events:none;will-change:opacity}
.ken-time-control{position:fixed;right:5vw;bottom:40px;width:min(280px,30vw);z-index:6;color:#eee4d2;text-shadow:0 1px 8px #000}
.ken-time-control>div{display:flex;justify-content:space-between;gap:20px;font-size:11px;letter-spacing:.04em;margin-bottom:10px}
.ken-time-control input{display:block;width:100%;height:20px;margin:0;cursor:ew-resize;accent-color:#c9ba96}
.kenopsia .pan-copy,.embedded-scene body.kenopsia .pan-copy{top:50%;bottom:auto;left:6vw;transform:translateY(-50%);max-width:min(510px,46vw)}
@media(max-width:600px){
 .kenopsia .ken-time-control{right:5vw;left:5vw;bottom:20px;width:90vw}
 .embedded-scene body.kenopsia .pan-copy,.kenopsia .pan-copy{top:50%;bottom:auto;left:6vw;max-width:88vw}
 .kenopsia .pan-copy .hint{margin-top:10px}
}
.kenopsia .pan-copy:before{background:radial-gradient(ellipse at 32% 60%,#131615eb 12%,#131615af 48%,transparent 76%);inset:-55px -70px -65px -7vw}
.kenopsia .ken-time-control input{appearance:none;background:linear-gradient(#d2c6ac88,#d2c6ac88) center/100% 1px no-repeat;border:0;border-radius:0;outline-offset:6px}
.kenopsia .ken-time-control input::-webkit-slider-thumb{appearance:none;width:12px;height:12px;border-radius:50%;background:#d2c6ac;border:1px solid #f0e7d3}
.kenopsia .ken-time-control input::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:#d2c6ac;border:1px solid #f0e7d3}