:root{color-scheme:dark;--paper:#101413;--panel:#191e1c;--ink:#e9e8df;--muted:#b6bdb5;--line:#3b4540;--red:#f07764;font:16px/1.7 system-ui,-apple-system,"Yu Gothic","Microsoft YaHei",sans-serif}
:root[data-day="1"]{color-scheme:light;--paper:#f2f0e7;--panel:#e9e7dd;--ink:#222c29;--muted:#53605a;--line:#b9bfb5;--red:#a2392b}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink)}button,select{font:inherit;color:inherit}button,a,select{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button,select{background:none;border:1px solid var(--line);border-radius:0;min-height:44px;padding:.5rem .9rem}button{cursor:pointer}button:hover,a:hover{color:var(--red)}button:active{background:var(--panel);transform:translateY(1px)}button:disabled{opacity:.55;cursor:default}a{color:inherit;text-underline-offset:5px}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--red);outline-offset:5px}h1,h2,h3,p{margin-top:0}h1,h2,h3,.wordmark{font-family:"Yu Mincho","Noto Serif CJK JP","Songti SC","SimSun",serif;font-weight:500}h2{font-size:clamp(2rem,3.5vw,3.5rem);line-height:1.22;margin:.7rem 0 1.5rem}h2 small{display:block;font:13px/1.8 system-ui;letter-spacing:.12em;margin-top:1rem}h3{font-size:1.35rem;line-height:1.45}.sr-only{position:absolute;clip-path:inset(50%);width:1px;height:1px;overflow:hidden}.skip{position:fixed;top:-100px;z-index:5;background:var(--paper);padding:1rem}.skip:focus{top:0}[hidden]{display:none!important}
.masthead{display:flex;gap:2rem;align-items:center;justify-content:space-between;min-height:82px;padding:1rem 3.5vw;border-bottom:1px solid var(--line)}.wordmark{text-decoration:none;font-size:1.25rem;letter-spacing:.12em}.wordmark small{font:12px system-ui;letter-spacing:.1em;margin-left:1rem}.collection{font-size:12px;letter-spacing:.1em;color:var(--muted)}.collection span{margin-left:1rem}.masthead nav{display:flex;gap:.65rem}#main{max-width:1740px;margin:auto}
.overview{display:grid;grid-template-columns:minmax(245px,.75fr) minmax(0,2fr);gap:5vw;padding:3.5rem 3.5vw 3rem}.eyebrow{font-size:13px;letter-spacing:.16em;color:var(--muted)}h1{font-size:clamp(4rem,6.8vw,7rem);line-height:1.06;letter-spacing:.03em;margin:2rem 0 1.3rem}h1 span{display:block;color:var(--red)}h1 small{display:block;font:13px/1.5 system-ui;letter-spacing:.25em;margin-top:1.3rem}.original-title{font-size:13px;color:var(--muted);max-width:19rem}.red-rule{width:3rem;border-top:2px solid var(--red);margin:1.8rem 0}.thesis{font-size:1.1rem;line-height:1.9;max-width:24rem}.muted{color:var(--muted);font-size:14px;max-width:24rem}.primary{display:flex;justify-content:space-between;gap:2rem;width:100%;max-width:24rem;border-color:var(--red);color:var(--red);padding:.85rem 1rem;margin-top:1.7rem}.progress{font-size:13px;color:var(--muted);margin:.8rem 0 2rem}.index-note{display:flex;flex-wrap:wrap;gap:.4rem 1.5rem;border-top:1px solid var(--line);padding-top:1rem;max-width:24rem;font-size:13px;letter-spacing:.1em}.index-note small{flex-basis:100%;color:var(--muted);font-size:13px;letter-spacing:0}
.grid-heading{display:flex;justify-content:space-between;gap:1rem;color:var(--muted);font-size:13px;margin-bottom:1.5rem}.window-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.6rem 1.2rem}.leaf{display:block;border:0;padding:0;text-align:left;min-width:0}.leaf-image{height:clamp(120px,13.9vw,235px);width:100%;background:#090b0a;display:block;border:1px solid var(--line);position:relative;overflow:hidden}.leaf img{width:100%;height:100%;object-fit:contain;display:block;transition:opacity .2s}.leaf:hover .leaf-image{border-color:var(--red)}.leaf-tag{position:absolute;bottom:8px;right:8px;font-size:12px;background:#131815;color:#f5d3c8;padding:2px 8px;border-left:2px solid #f07764}.leaf-caption{display:flex;justify-content:space-between;gap:.5rem;margin-top:.55rem;line-height:1.5}.leaf-title{font-size:15px}.leaf-number{font:13px/1.7 system-ui;color:var(--muted)}.leaf-reading{display:block;font:11px/1.5 system-ui;letter-spacing:.06em;color:var(--muted);margin-top:3px}.leaf[data-complete="true"] .leaf-tag{background:#f07764;color:#151c18}
.scene{padding:1.5rem 3.5vw 2rem}.scene-nav{display:flex;align-items:center;justify-content:space-between;gap:.6rem;margin-bottom:1.6rem}.scene-nav button{border:0;padding-left:0;padding-right:0}.scene-nav>span{font:13px/1.6 system-ui;letter-spacing:.12em;color:var(--muted)}.scene-layout{display:grid;grid-template-columns:minmax(0,2.6fr) minmax(270px,1fr);gap:3.5vw;align-items:start}.picture-stage{background:#080b0a;min-height:250px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);position:relative;overflow:hidden}.picture-plane{position:relative;max-width:100%;width:100%;line-height:0}.picture-plane.portrait{width:min(100%,calc((100svh - 260px)*.666667));min-width:190px}.picture-plane>img{display:block;width:100%;height:auto;max-width:100%}.picture-plane:not(.portrait){max-width:min(100%,calc((100svh - 285px)*1.77683))}.markers,.thread{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.thread{overflow:visible}.thread path{fill:none;stroke:#ff8067;stroke-width:3;filter:drop-shadow(0 0 6px #fa6b57);stroke-dasharray:100;stroke-dashoffset:0}.marker{position:absolute;pointer-events:auto;transform:translate(-50%,-50%);border:1px solid #f8d1c2;border-radius:50%;background:#171c18e8;color:#fff1e9;width:44px;height:44px;min-height:44px;padding:0;line-height:42px;font-size:14px;box-shadow:0 0 0 5px #141a1560}.marker:hover,.marker[aria-pressed="true"]{color:#151914;background:#f08770;border-color:#f08770}.marker:active{transform:translate(-50%,-50%) scale(.97)}.focus-ring{position:absolute;pointer-events:none;border:1px solid #f5ba9e;background:#f2877011;outline:1px solid #13181560;outline-offset:4px}.image-tools{display:flex;align-items:center;justify-content:space-between;gap:.8rem;font-size:13px;color:var(--muted);margin:.65rem 0}.image-tools button{border:0;white-space:nowrap}.interaction{border-top:1px solid var(--line);padding-top:1rem}.instruction{font-size:15px;margin:0 0 .9rem}.clue-buttons{display:flex;flex-wrap:wrap;gap:.6rem}.clue-buttons button{font-size:14px;flex:1;white-space:nowrap}.clue-buttons button[aria-pressed="true"]{border-color:var(--red);color:var(--red);background:var(--panel)}.range-label{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:.5rem;font-size:15px}.closure-range{width:100%;accent-color:var(--red);height:44px;cursor:ew-resize}.range-ends{display:flex;justify-content:space-between;font-size:13px;color:var(--muted)}
.reading{padding-top:.25rem}.scene-story{font-size:17px;line-height:1.9}.reading-note{border-top:1px solid var(--line);padding-top:1.3rem;min-height:185px}.reading-note>p:last-child{font-size:15px;line-height:1.85;margin-bottom:1rem}.note-label{font-size:12px;letter-spacing:.12em;color:var(--red)}.observation-count{font-size:13px;color:var(--muted);margin:1rem 0}.source-note{font-size:13px;color:var(--muted);border-top:1px solid var(--line);padding-top:1rem}.source-note summary{min-height:44px;cursor:pointer}.source-note p{line-height:1.85}.colophon{border-top:1px solid var(--line);margin:0 3.5vw;padding:1.6rem 0 2rem;display:flex;justify-content:space-between;gap:2rem;align-items:start;color:var(--muted);font-size:13px}.colophon p{max-width:45rem}.colophon div{display:flex;flex-wrap:wrap;gap:.7rem 1.2rem}.colophon a{min-height:44px;white-space:nowrap}dialog{position:fixed;inset:0;width:100vw;height:100dvh;max-width:none;max-height:none;background:#090d0c;color:#eee9df;border:0;margin:0;padding:5rem 1rem 3rem}dialog::backdrop{background:#090d0c}dialog img{display:block;width:100%;height:100%;object-fit:contain}dialog button{position:absolute;right:1rem;top:1rem;z-index:2;background:#111916;color:#eee9df;border-color:#63766a}dialog p{position:absolute;bottom:.4rem;left:0;text-align:center;width:100%;font-size:13px;color:#ccd2cd;margin:0}.fallback{padding:2rem}.scene.entering{animation:arrive .28s ease-out}@keyframes arrive{from{opacity:0}to{opacity:1}}
@media(min-width:1700px){.leaf-image{height:245px}}
@media(max-width:1100px){.overview{gap:2.5rem;grid-template-columns:240px minmax(0,1fr)}.window-grid{gap:1.2rem .8rem}.leaf-title{font-size:14px}.scene-layout{grid-template-columns:minmax(0,1.8fr) minmax(250px,1fr);gap:1.8rem}.masthead{gap:1rem}.collection span{display:none}}
@media(max-width:760px){.masthead{padding:.8rem 1rem;gap:.7rem}.wordmark small,.collection{display:none}.masthead nav{gap:.4rem}.masthead button,.masthead select{font-size:14px}.overview{display:block;padding:2rem 1rem}.introduction{display:grid;grid-template-columns:1fr 1fr;gap:0 1.2rem}.introduction .eyebrow,.original-title,.thesis,.muted{grid-column:1/-1}h1{font-size:3.6rem;margin:.4rem 0 1rem;grid-column:1/-1}h1 span{display:inline}h1 small{display:inline-block;margin-left:1rem;vertical-align:middle;letter-spacing:.1em}.red-rule{display:none}.thesis{max-width:none;margin:.7rem 0}.muted{max-width:none}.primary{grid-column:1/-1;margin-top:.7rem;max-width:none}.progress{grid-column:1/-1;margin-bottom:1.5rem}.index-note{display:none}.nine-leaves{margin-top:.4rem}.grid-heading{font-size:12px}.window-grid{gap:1.2rem .6rem}.leaf-image{height:clamp(100px,29vw,200px)}.leaf-title{font-size:13px;word-break:keep-all;overflow-wrap:anywhere}.leaf-number{font-size:12px}.leaf-reading{display:none}.leaf-tag{bottom:4px;right:4px;font-size:11px;padding:1px 4px}.scene{padding:.7rem 1rem 2rem}.scene-layout{display:flex;flex-direction:column;gap:1.5rem}.image-column,.reading{width:100%}.scene-nav{margin-bottom:.75rem}.scene-nav>span{font-size:11px}.scene-nav button{font-size:14px}.picture-stage{min-height:0}.picture-plane:not(.portrait){max-width:100%}.picture-plane.portrait{width:min(100%,calc((100svh - 220px)*.666667))}.marker{width:36px;height:36px;min-height:36px;line-height:34px}.marker::before{content:"";position:absolute;inset:-5px}.scene-story{font-size:16px}.reading-note{min-height:0}h2{margin-top:.4rem}.colophon{margin:0 1rem;display:block}.colophon div{gap:1rem}.image-tools{font-size:12px}.clue-buttons button{font-size:13px;padding:.5rem}.image-tools>span{max-width:60%}.range-ends{font-size:12px}}
.detail-window{display:block;width:100%;height:150px;background:#090d0c;border:1px solid var(--line);margin-bottom:1rem}
.reset-reading{border:0;padding:0;margin:-1rem 0 1rem;color:var(--muted);font-size:13px;grid-column:1/-1}
/* Keep the image's face and selected detail clear. Mobile uses the equal-action buttons below. */
.marker{transform:translate(-100%,-100%)}.marker:active{transform:translate(-100%,-100%) scale(.97)}
@media(max-width:760px){.markers{display:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(prefers-contrast:more){:root{--muted:var(--ink);--line:var(--ink)}.marker{background:#111}}