/* Kitan: content-bearing planes, meaningful index marks, no decorative metrics. */
:root{--serif:"Yu Mincho","Hiragino Mincho ProN","Noto Serif CJK JP",Georgia,serif;--rail:238px;--timing:cubic-bezier(.2,.72,.22,1)}
::selection{background:var(--accent);color:var(--on-accent)}
.library{background:var(--paper)}
.library #app{max-width:2000px;margin:auto}
.archive-rail{position:fixed;inset:0 auto 0 max(0px,calc((100vw - 2000px)/2));width:var(--rail);padding:36px 25px 22px;border-right:1px solid var(--line);display:flex;flex-direction:column;z-index:10;background:var(--paper);overflow:auto;scrollbar-width:thin}
.archive-brand{display:block;position:relative;padding-bottom:27px;border-bottom:1px solid var(--line)}
.brand-eyebrow{display:flex;justify-content:space-between;align-items:center;font-size:10px;letter-spacing:.19em;margin-bottom:18px;color:var(--muted)}
.brand-eyebrow i{height:5px;width:5px;background:var(--accent);transform:rotate(45deg)}
.archive-brand strong{display:block;font:400 61px/1.1 var(--serif);letter-spacing:.13em;white-space:nowrap}
.archive-brand strong span{color:var(--accent);font-size:34px;vertical-align:top;display:inline-block;transform:translateY(10px)}
.archive-brand>small{display:block;font:10px/1.8 Georgia,serif;letter-spacing:.09em;margin-top:12px;color:var(--muted)}
.rail-intro{font:16px/1.95 var(--serif);white-space:pre-line;letter-spacing:.07em;margin:30px 0}
.rail-nav{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.rail-nav button{min-height:49px;display:flex;align-items:center;gap:16px;border-bottom:1px solid var(--line);text-align:left;position:relative}
.rail-nav button:before{content:'';position:absolute;left:-25px;top:50%;width:0;height:1px;background:var(--accent);transition:width .35s var(--timing)}
.rail-nav button[aria-current=page]:before,.rail-nav button:hover:before{width:16px}
.rail-nav small{font:11px Georgia,serif;color:var(--muted)}
.rail-nav span{font-size:13px;letter-spacing:.05em}
.rail-nav .icon{margin-left:auto;width:16px;opacity:0;transform:translateX(-7px);transition:opacity .25s,transform .35s var(--timing)}
.rail-nav button:hover .icon,.rail-nav button:focus-visible .icon,.rail-nav button[aria-current=page] .icon{opacity:1;transform:none;color:var(--accent)}
.rail-note{margin-top:36px;min-height:185px}
.eyebrow{font-size:10px;font-weight:400;letter-spacing:.14em;color:var(--muted)}
.rail-note h2{font:19px/1.7 var(--serif);margin:13px 0 10px}
.rail-note p{font-size:13px;color:var(--muted);line-height:1.9;min-height:70px}
.line-link{display:inline-flex;gap:24px;align-items:center;min-height:40px;font-size:12px;position:relative}
.line-link:after{content:'';position:absolute;bottom:3px;left:0;width:100%;height:1px;transform:scaleX(.2);transform-origin:left;background:var(--accent);transition:transform .45s var(--timing)}
.line-link:hover:after,.line-link:focus-visible:after{transform:scaleX(1)}
.line-link .icon{width:17px;transition:transform .35s var(--timing)}
.line-link:hover .icon{transform:translateX(5px)}
.rail-bottom{margin-top:auto;padding-top:36px}
.rail-tools{display:flex;gap:6px;border-bottom:1px solid var(--line);padding-bottom:14px;margin-bottom:13px}
.rail-tools .icon-button{border:1px solid transparent;border-radius:0;width:46px;height:44px;position:relative}
.rail-tools .icon-button:hover,.rail-tools .icon-button:focus-visible{border-color:var(--line);color:var(--accent);background:none}
.rail-tools .icon{width:19px;height:19px;transition:transform .45s var(--timing)}
.rail-tools [data-action=theme]:hover .icon{transform:rotate(35deg)}
.return-site{display:flex;align-items:center;justify-content:space-between;font:12px/2 Georgia,serif;letter-spacing:.04em;color:var(--muted)}
.return-site .icon{width:14px}
.archive-main{margin-left:var(--rail);min-width:0}
.archive-heading{height:84px;padding:0 32px;display:flex;align-items:center;gap:28px;border-bottom:1px solid var(--line)}
.archive-heading h1{font:15px/1.5 var(--serif);letter-spacing:.14em}
.archive-heading>span{font:10px/1.6 Georgia,serif;letter-spacing:.16em;color:var(--muted)}
.archive-heading .line-link{margin-left:auto}
.story-strip{display:flex;height:min(660px,calc(100svh - 150px));min-height:450px;overflow:hidden;border-bottom:1px solid var(--line)}
.story-panel{flex:1;min-width:0;position:relative;border-right:1px solid #7776;transition:flex .65s var(--timing);background:#171517}
.story-panel:last-child{border:0}
.story-panel.is-current{flex:1.55}
.story-panel:after{content:'';position:absolute;bottom:0;left:0;right:0;height:3px;background:#c43143;transform:scaleX(0);transform-origin:left;transition:transform .6s var(--timing);pointer-events:none}
.story-panel.is-current:after{transform:scaleX(1)}
.story-surface{display:block;position:relative;height:100%;color:#fff;overflow:hidden}
.story-surface:focus-visible{outline-offset:-5px;outline-color:#fff}
.story-image{position:absolute;inset:0;overflow:hidden}
.story-image svg{width:100%;height:100%;transition:transform 1.2s var(--timing);transform:scale(1.04)}
.story-panel.is-current .story-image svg{transform:scale(1)}
.story-image:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#100e111a 30%,#100e1188 68%,#100e11f5 100%);pointer-events:none}
.story-top{position:absolute;top:24px;left:23px;right:23px;display:flex;align-items:center;justify-content:space-between;text-shadow:0 1px 5px #000}
.story-top>span{font:25px/1 Georgia,serif;font-variant-numeric:tabular-nums}
.story-top small{font:10px/1.5 Georgia,serif;letter-spacing:.18em;text-transform:uppercase}
.story-caption{position:absolute;left:23px;right:23px;bottom:26px;display:flex;flex-direction:column;align-items:flex-start}
.story-caption>small{font:10px/1.5 Georgia,serif;letter-spacing:.14em;color:#d2c7cb;margin-bottom:12px}
.story-caption>strong{font:400 clamp(23px,2.5vw,38px)/1.55 var(--serif);letter-spacing:.025em;text-wrap:balance}
.story-description{font-size:12px;line-height:1.9;color:#ddd3d8;display:grid;max-height:0;opacity:0;overflow:hidden;transition:max-height .5s var(--timing),opacity .3s,margin .4s}
.story-panel.is-current .story-description{max-height:90px;opacity:1;margin-top:12px}
.story-enter{width:100%;display:flex;justify-content:space-between;align-items:center;border-top:1px solid #fff5;padding-top:18px;margin-top:22px;font-size:12px;letter-spacing:.07em}
.story-enter .icon{width:23px;transition:transform .4s var(--timing)}
.story-surface:hover .story-enter .icon{transform:translateX(5px)}
.archive-seam{min-height:60px;padding:12px 32px;display:flex;justify-content:space-between;gap:20px;align-items:center;border-bottom:1px solid var(--line);font:13px/1.7 var(--serif)}
.archive-seam>span{display:flex;align-items:center;gap:14px;letter-spacing:.09em}
.archive-seam i{width:5px;height:5px;border:1px solid var(--accent);border-radius:50%}
.preview-controls{display:none}
.archive-seam a{display:flex;gap:18px;align-items:center;font-size:11px}.archive-seam a .icon{width:16px;transform:rotate(90deg)}
.reading-thread{margin:0 32px;padding:20px 0;display:flex;align-items:center;gap:18px;border-bottom:1px solid var(--line)}
.thread-label{color:var(--accent);font-size:11px}.reading-thread img{height:44px;width:30px;object-fit:cover}.reading-thread strong{font:16px/1.6 var(--serif)}
.thread-line{height:1px;background:var(--line);flex:1;position:relative;overflow:hidden}
.thread-line:after{content:'';position:absolute;inset:0;background:var(--accent);transform:translateX(-100%);transition:transform .7s var(--timing)}
.reading-thread:hover .thread-line:after{transform:none}.thread-action{font-size:11px;color:var(--muted)}.reading-thread>.icon{width:17px}
.archive-collection{padding:62px 32px 0;scroll-margin-top:24px}
.archive-section-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:27px}
.archive-section-head h2{font:400 30px/1.5 var(--serif);letter-spacing:.05em;margin-top:8px}
.archive-search{border-bottom:1px solid var(--line);display:flex;align-items:center;gap:14px;min-height:44px;width:230px}
.archive-search .icon{width:17px;color:var(--muted)}.archive-search input{background:none;border:0;outline:none;min-width:0;width:100%;font-size:12px;padding:12px 0}
.archive-search:focus-within{border-color:var(--accent)}
.archive-filters{display:flex;gap:32px;border-bottom:1px solid var(--line);margin-bottom:26px}
.archive-filters .filter{font-size:12px;display:flex;align-items:center;gap:10px;font-weight:400}
.archive-filters .filter:after{height:1px;transform:scaleX(0);transition:transform .3s var(--timing);background:var(--accent);display:block;position:absolute;content:'';bottom:-1px;left:0;right:0}
.archive-filters .filter[aria-pressed=true]:after{transform:scaleX(1)}
.archive-filters i{width:4px;height:4px;border-radius:50%;background:var(--accent);opacity:0;transition:opacity .3s}
.archive-filters [aria-pressed=true] i{opacity:1}
.archive-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:44px 22px}
.archive-book{position:relative;min-width:0}
.archive-cover{display:block;position:relative;aspect-ratio:2/3;overflow:hidden;background:var(--surface);border:1px solid var(--line)}
.cover-primary{width:100%;height:100%;object-fit:contain;transition:transform .8s var(--timing)}
.cover-peek{position:absolute;inset:0 0 0 58%;border-left:1px solid #eee9;transform:translateX(102%);transition:transform .6s var(--timing);background:#171517;box-shadow:-12px 0 35px #0004}
.cover-peek img{width:100%;height:100%;object-fit:cover;object-position:right center}.cover-peek>span{position:absolute;bottom:58px;right:12px;writing-mode:vertical-rl;font-size:11px;letter-spacing:.14em;background:#121112dd;color:#fff;padding:14px 8px}
.cover-enter{position:absolute;bottom:0;left:0;right:0;padding:15px 18px;background:#151215f5;color:#fff;display:flex;align-items:center;justify-content:space-between;font-size:12px;transform:translateY(102%);transition:transform .4s var(--timing);border-top:1px solid #c43143}
.cover-enter .icon{width:18px}
.archive-cover:hover .cover-primary,.archive-cover:focus-visible .cover-primary{transform:translateX(-4%) scale(1.02)}
.archive-cover:hover .cover-peek,.archive-cover:focus-visible .cover-peek,.archive-cover:hover .cover-enter,.archive-cover:focus-visible .cover-enter{transform:none}
.archive-bookmark{position:absolute;right:1px;top:1px;width:44px;height:44px;border-radius:0;background:#171517dd;color:#fff;border-left:1px solid #8885;border-bottom:1px solid #8885}
.archive-bookmark:hover{color:#f06c78;background:#171517}
.archive-bookmark[aria-pressed=true]{background:#b32838;color:#fff}
.archive-bookmark .icon{width:17px;height:17px}
.archive-book-info{display:grid;grid-template-columns:31px 1fr;gap:12px;padding-top:18px;border-top:1px solid var(--line);margin-top:7px}
.entry-number{font:20px/1.3 Georgia,serif;color:var(--muted)}
.archive-book-info small{display:block;font:10px/1.2 Georgia,serif;letter-spacing:.13em;color:var(--accent);margin-bottom:8px}
.archive-book-info h3{font:400 20px/1.5 var(--serif);letter-spacing:.025em}
.archive-book-info h3 a{background:linear-gradient(var(--accent),var(--accent)) 0 100%/0 1px no-repeat;transition:background-size .4s var(--timing)}
.archive-book-info h3 a:hover{background-size:100% 1px}
.archive-book-info p{font-size:12px;line-height:1.85;color:var(--muted);margin-top:10px}
.book-resume{display:flex;align-items:center;gap:14px;font-size:10px;margin-top:16px;color:var(--accent);min-height:32px}
.book-resume i{flex:1;background:var(--line);height:1px}.book-resume b{display:block;width:var(--progress);height:1px;background:var(--accent)}
.archive-footer{margin:60px 32px 0;padding:30px 0;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:22px}
.archive-footer>span{font:25px/1.5 var(--serif);white-space:nowrap}.archive-footer small{font:11px Georgia,serif;margin-left:12px}.archive-footer p{font-size:10px;color:var(--muted);max-width:280px}.archive-footer a{display:flex;gap:12px;align-items:center;font:11px Georgia,serif}.archive-footer .icon{width:15px}
/* The reader retains the original image fit contract; chrome shares the archive. */
.reader-title .brand strong{font:400 24px var(--serif);letter-spacing:.05em}
.reader-title h1{font-family:var(--serif);font-size:15px;letter-spacing:.03em}
.reader-header{border-bottom:1px solid var(--line)}
.reader-dock{border-radius:2px;box-shadow:none;background:var(--paper);backdrop-filter:none;border-color:var(--line)}
.reading-modes{display:flex;gap:4px;margin-left:2px;padding-left:14px;border-left:1px solid var(--line)}
.reading-mode{position:relative;display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;min-width:84px;padding:0 12px;color:var(--muted);font-size:14px;font-weight:500;line-height:1.4;white-space:nowrap;touch-action:manipulation;transition:color .15s,background-color .15s}
.reading-mode:after{content:'';position:absolute;left:12px;right:12px;bottom:3px;height:1px;background:var(--accent);transform:scaleX(0);transition:transform .2s var(--timing)}
.reading-mode:hover,.reading-mode:active{color:var(--ink);background:var(--surface)}
.reading-mode[aria-pressed=true]{color:var(--accent)}
.reading-mode[aria-pressed=true]:after{transform:scaleX(1)}
.reading-mode .icon{width:18px;height:18px;flex:none}
.settings-dialog .reading-modes{margin:0;padding:4px;border:1px solid var(--line)}
.settings-dialog .reading-mode{flex:1;min-width:0}
.mode-help{font-size:12px;line-height:1.7;color:var(--muted);margin-top:10px}
.reader-hint{font-size:11px}
.reader-dock:before{content:'';position:absolute;top:-1px;left:0;width:36px;height:1px;background:var(--accent)}
.reader .icon-button,.reader .tool-button,.focus-return{border-radius:1px}
.reader .scrubber::-webkit-slider-thumb{border-radius:0;width:7px;height:15px}.reader .scrubber::-moz-range-thumb{border-radius:0;width:7px;height:15px}
.reader-page{animation:page-arrive .24s var(--timing)}
dialog{border-radius:2px;box-shadow:0 20px 90px #0005;transform-origin:top right}
dialog::backdrop{backdrop-filter:none;background:#0009}
.segmented,.segmented button,.jump-form input,.jump-form button,.page-thumb{border-radius:1px}
.page-drawer{border-left:1px solid var(--line);border-radius:0;animation:drawer-arrive .32s var(--timing)}
.pill{border-radius:1px;font-weight:400;min-height:48px;padding:13px 24px;font-size:14px}
.jump-form button,.skip-link{color:var(--on-accent)}
@keyframes page-arrive{from{opacity:.55}to{opacity:1}}
@keyframes drawer-arrive{from{opacity:.4;transform:translateX(32px)}to{opacity:1;transform:none}}
@media(max-width:720px){.reader-dock{display:grid;grid-template-columns:44px 54px minmax(0,1fr) 44px;gap:4px 8px;padding:5px 9px;min-height:0}.reader-dock>.icon-button{width:44px;height:44px}.reader-dock>.page-number{min-height:44px}.reader-dock>.reading-modes{grid-column:1/-1;margin:0;padding:3px 0 0;border-left:0;border-top:1px solid var(--line)}.reader-dock .reading-mode{flex:1;min-width:0}.reader-stage{bottom:calc(142px + env(safe-area-inset-bottom))}}
@media(min-width:1600px){:root{--rail:266px}.archive-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.story-strip{height:720px;max-height:calc(100svh - 145px)}.archive-rail{padding-inline:32px}}
@media(max-height:800px) and (min-width:901px){.archive-rail{padding-top:25px}.archive-brand{padding-bottom:20px}.rail-intro{margin:20px 0}.rail-note{margin-top:22px;min-height:150px}.rail-bottom{padding-top:20px}.rail-note p{min-height:0}.rail-note h2{margin:8px 0}.story-strip{min-height:425px}}
@media(max-width:1100px){:root{--rail:210px}.archive-rail{padding-inline:20px}.archive-brand strong{font-size:52px}.story-caption{left:18px;right:18px}.story-caption>strong{font-size:25px}.archive-heading{padding-inline:24px}.archive-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.archive-heading>span{display:none}.archive-collection{padding-inline:24px}.archive-seam{padding-inline:24px}.reading-thread{margin-inline:24px}.thread-action{display:none}}
@media(max-width:900px){:root{--rail:0px}.archive-rail{position:relative;inset:auto;width:100%;padding:18px 24px 0;display:grid;grid-template-columns:1fr auto;overflow:visible;border-right:0;border-bottom:1px solid var(--line)}.archive-brand{border:0;padding:0;display:flex;align-items:center;gap:14px}.archive-brand strong{font-size:35px;letter-spacing:.07em}.archive-brand strong span{font-size:20px;transform:translateY(4px)}.brand-eyebrow{font-size:9px;max-width:50px;line-height:1.6;margin:0}.brand-eyebrow i{display:none}.archive-brand>small{display:none}.rail-intro,.rail-note,.return-site{display:none}.rail-bottom{margin:0;padding:0;grid-column:2;grid-row:1}.rail-tools{border:0;padding:0;margin:0;gap:0}.rail-tools .icon-button{width:42px}.rail-nav{grid-column:1/-1;flex-direction:row;border:0;gap:30px;margin-top:15px}.rail-nav button{border:0;gap:9px;min-height:43px}.rail-nav small{font-size:10px}.rail-nav span{font-size:12px}.rail-nav .icon{display:none}.rail-nav button:before{left:0;top:auto;bottom:-1px;width:100%;transform:scaleX(0)}.rail-nav button[aria-current=page]:before,.rail-nav button:hover:before{width:100%;transform:scaleX(1)}.archive-heading{height:61px}.archive-heading h1{font-size:13px}.story-strip{height:520px;min-height:0}.story-caption>strong{font-size:25px}.archive-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.archive-book-info{grid-template-columns:23px 1fr;gap:8px}.archive-book-info h3{font-size:17px}.entry-number{font-size:17px}}
@media(max-width:620px){.archive-rail{padding:14px 18px 0}.archive-brand{gap:10px}.archive-brand strong{font-size:31px}.rail-tools .icon-button{width:38px;height:44px}.rail-tools [data-action=search]{display:none}.rail-nav{gap:25px}.archive-heading{padding:0 18px;height:54px;gap:10px}.archive-heading h1{font-size:12px}.archive-heading .line-link{font-size:10px;gap:13px}.story-strip{height:480px;display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}.story-panel,.story-panel.is-current{flex:0 0 83%;scroll-snap-align:start;transition:none}.story-panel:last-child{flex-basis:100%}.story-image svg{transform:none}.story-top{left:22px;right:22px;top:22px}.story-caption{left:22px;right:22px;bottom:24px}.story-caption>strong{font-size:32px}.story-description,.story-panel.is-current .story-description{opacity:1;max-height:70px;margin-top:10px}.story-enter{padding-top:15px;margin-top:17px}.archive-seam{padding:14px 18px;font-size:11px;min-height:55px}.archive-seam a{font-size:10px;gap:8px}.archive-seam>span{gap:8px}.reading-thread{margin:0 18px;gap:12px}.thread-label{font-size:10px}.reading-thread strong{font-size:14px}.reading-thread img{width:24px;height:35px}.archive-collection{padding:40px 18px 0}.archive-section-head{display:block;margin-bottom:16px}.archive-section-head h2{font-size:26px}.archive-search{width:100%;margin-top:18px}.archive-filters{gap:26px;margin-bottom:20px}.archive-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 14px}.archive-book-info{grid-template-columns:1fr;padding-top:12px;margin-top:4px}.entry-number{display:none}.archive-book-info h3{font-size:16px}.archive-book-info p{font-size:11px;line-height:1.9}.archive-book-info small{font-size:9px}.archive-bookmark{width:40px;height:44px}.archive-footer{margin:40px 18px 0;flex-wrap:wrap;gap:15px;padding:24px 0}.archive-footer p{order:3;flex-basis:100%;max-width:none}.archive-footer a{margin-left:auto}.reader-title h1{font-size:13px}.cover-peek{display:none}.cover-enter{padding:12px;font-size:11px}.archive-cover:hover .cover-primary{transform:none}}
@media(prefers-reduced-motion:reduce){.story-panel{transition:none}.story-image svg,.archive-cover:hover .cover-primary{transform:none}.cover-peek{display:none}.reader-page{animation:none}.line-link:after{transition:none}}
@media(max-width:620px){.preview-controls{display:flex;margin-left:auto;gap:4px}.preview-controls .icon-button{width:44px;height:44px;border-radius:0;border:1px solid var(--line)}.preview-controls .icon{width:16px}.archive-seam>a{display:none}}
@media(prefers-contrast:more){:root{--muted:#494247;--line:#746b72}:root[data-theme=dark]{--muted:#ddd3d8;--line:#9a8992}.story-description{color:#fff}}
