:root{--paper: #ebe5d6;--paper-light: #f5f0e4;--ink: #173a49;--ink-soft: #55717b;--blue: #176f91;--blue-dark: #0c425a;--sun: #dd754e;--serif: "Yu Mincho", "Hiragino Mincho ProN", "Noto Serif JP", serif;--sans: "Avenir Next", "Helvetica Neue", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;color-scheme:light;font-synthesis:none}*{box-sizing:border-box}html{background:var(--paper);scroll-behavior:smooth;scroll-padding-top:76px}body{margin:0;min-width:320px;color:var(--ink);background:radial-gradient(circle at 72% 12%,rgba(255,251,230,.66),transparent 29rem),linear-gradient(90deg,rgba(30,91,111,.035) 1px,transparent 1px),var(--paper);background-size:auto,92px 100%,auto;font-family:var(--serif);overflow-x:clip}body:before{content:"";position:fixed;inset:0;z-index:30;pointer-events:none;opacity:.18;background:repeating-linear-gradient(7deg,transparent 0 11px,rgba(23,58,73,.035) 12px 13px),repeating-linear-gradient(91deg,transparent 0 17px,rgba(255,255,255,.11) 18px 19px);mix-blend-mode:multiply}::selection{color:#fff9e9;background:var(--blue)}a,button{color:inherit}a{text-underline-offset:.22em}button{font:inherit}.reader-bar{position:fixed;inset:0 0 auto;z-index:24;height:62px;padding:0 clamp(16px,3vw,42px);display:grid;grid-template-columns:1fr auto minmax(120px,18vw) auto;align-items:center;gap:clamp(14px,2.4vw,36px);color:var(--paper-light);background:#0c425af0;border-bottom:1px solid rgba(247,238,215,.25);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);font-family:var(--sans)}.reader-brand{width:max-content;display:flex;align-items:center;gap:10px;color:inherit;text-decoration:none;font-size:11px;letter-spacing:.16em}.reader-brand-mark{width:30px;height:30px;display:grid;place-items:center;color:var(--blue-dark);background:var(--paper-light);border-radius:50%;font-family:var(--serif);font-size:15px;letter-spacing:0}.reader-position{min-width:92px;display:flex;align-items:baseline;justify-content:flex-end;gap:12px;font-size:10px;letter-spacing:.14em}.reader-position strong{min-width:34px;font-size:12px;font-variant-numeric:tabular-nums;letter-spacing:.04em}.reader-progress{height:1px;overflow:hidden;background:#f5f0e43d}.reader-progress i{display:block;width:100%;height:100%;background:var(--paper-light);transform:scaleX(0);transform-origin:left;will-change:transform}.motion-toggle{border:0;padding:7px 0;display:flex;align-items:center;gap:8px;color:inherit;background:transparent;cursor:pointer;font-size:10px;letter-spacing:.08em}.motion-toggle:focus-visible,.reader-brand:focus-visible,.begin-reading:focus-visible,.colophon a:focus-visible{outline:2px solid currentColor;outline-offset:5px}#app{position:relative;z-index:2}.opening{position:relative;min-height:100svh;padding-top:62px;overflow:hidden;color:var(--paper-light);background:linear-gradient(180deg,#06374c14,#06374c57),var(--blue)}.opening:before{content:"";position:absolute;width:min(42vw,590px);aspect-ratio:1;left:8vw;top:16vh;border:1px solid rgba(245,240,228,.42);border-radius:50%;box-shadow:0 0 0 4vw #f5f0e406,0 0 0 9vw #f5f0e405}.opening:after{content:"";position:absolute;width:clamp(108px,14vw,210px);aspect-ratio:1;right:13vw;top:18vh;border-radius:50%;background:var(--sun);box-shadow:0 28px 70px #51291e33}.opening-water{position:absolute;inset:48% 0 0;z-index:1;background:repeating-linear-gradient(174deg,transparent 0 38px,rgba(244,238,216,.15) 39px 40px),linear-gradient(180deg,#07445c00,#05364970);clip-path:polygon(0 8%,13% 4%,25% 9%,38% 2%,51% 7%,66% 0,82% 5%,100% 1%,100% 100%,0 100%)}.opening-water i{position:absolute;left:calc(10% + var(--i, 0) * 21%);top:calc(22% + var(--i, 0) * 9%);width:23vw;height:1px;background:#f5f0e442;transform:rotate(calc(-3deg + var(--i, 0) * 1deg))}.opening-water i:nth-child(1){--i: 0}.opening-water i:nth-child(2){--i: 1}.opening-water i:nth-child(3){--i: 2}.opening-water i:nth-child(4){--i: 3}.opening-inner{position:relative;z-index:2;width:min(1180px,calc(100% - 64px));min-height:calc(100svh - 62px);margin:0 auto;padding:45px 0 34px;display:grid;grid-template-rows:auto 1fr auto}.opening-overline{margin:0;display:flex;justify-content:space-between;font:10px var(--sans);letter-spacing:.22em}.opening-title-wrap{align-self:center;width:min(810px,78%);margin:3vh 0 0 8vw}.opening-original{margin:0 0 12px;color:#f5f0e4bd;font:10px/1.2 var(--sans);letter-spacing:.26em}.opening h1{margin:0;font-size:clamp(72px,13vw,180px);font-weight:400;line-height:.94;letter-spacing:-.08em;text-shadow:0 14px 40px rgba(2,42,58,.14)}.opening-byline{margin:30px 0 0 8px;font-size:clamp(14px,1.5vw,18px);letter-spacing:.09em}.opening-byline small{display:block;margin-top:7px;color:#f5f0e49e;font:10px/1 var(--sans);letter-spacing:.16em}.opening-bottom{display:flex;align-items:end;gap:30px}.begin-reading{width:min(270px,32vw);margin-left:auto;padding:14px 0;display:flex;justify-content:space-between;color:inherit;border-top:1px solid rgba(245,240,228,.65);border-bottom:1px solid rgba(245,240,228,.65);text-decoration:none;font:14px/1 var(--sans);letter-spacing:.16em}.begin-reading i{font-style:normal;font-size:15px}.book-shell{position:relative;padding:clamp(85px,12vw,170px) 24px 180px}.text-frontispiece{max-width:740px;min-height:clamp(440px,52vh,560px);margin:0 auto clamp(80px,12vw,170px);padding:42px 0;display:flex;flex-direction:column;justify-content:center;text-align:center;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink)}.text-frontispiece h2{margin:0 0 30px;font-size:clamp(48px,8vw,84px);font-weight:400;letter-spacing:.13em;text-indent:.13em}.text-frontispiece dl{width:min(400px,100%);margin:0 auto;display:grid;gap:9px;font-size:18px}.text-frontispiece dl div{display:grid;grid-template-columns:70px 1fr}.text-frontispiece dt{color:var(--ink-soft);font:18px var(--sans);letter-spacing:.16em}.text-frontispiece dd{margin:0;text-align:left;letter-spacing:.08em}.book-copy{max-width:680px;margin:0 auto;font-size:clamp(16px,1.5vw,18px);line-height:2.25;letter-spacing:.045em;text-align:justify;text-justify:inter-ideograph}.book-paragraph{position:relative;margin:0 0 1.75em;min-height:1em;overflow:visible}.book-paragraph:first-of-type:first-letter{float:left;margin:.07em .14em 0 0;color:var(--blue);font-size:4.4em;line-height:.8}.book-paragraph:nth-of-type(75n):before{content:attr(data-line);position:absolute;right:calc(100% + 46px);top:.75em;color:#173a497a;font:10px/1 var(--sans);letter-spacing:.1em}ruby{position:relative;display:inline-block;vertical-align:baseline;ruby-position:over;ruby-align:center}ruby>rb{display:inline}ruby>rt{position:absolute;left:50%;bottom:calc(100% - .5em);width:max-content;color:var(--ink-soft);font-size:max(.52em,10px);line-height:1;letter-spacing:0;text-align:center;white-space:nowrap;transform:translate(calc(-50% + var(--ruby-shift, 0px)))}ruby>rp{display:none}.fluid-segment{display:inline-block;position:relative;transform-origin:50% 60%;backface-visibility:hidden}.fluid-active .fluid-segment{will-change:transform}.colophon{position:relative;min-height:88vh;padding:clamp(90px,14vw,180px) max(24px,calc((100vw - 1020px)/2));display:grid;grid-template-columns:minmax(160px,.65fr) minmax(320px,1.5fr);align-items:center;gap:clamp(50px,10vw,150px);overflow:hidden;color:var(--paper-light);background:repeating-linear-gradient(174deg,transparent 0 55px,rgba(245,240,228,.05) 56px 57px),var(--blue-dark)}.colophon-emblem{position:relative;width:min(100%,360px);aspect-ratio:1;justify-self:center}.colophon-moon,.colophon-sun{position:absolute;display:block;aspect-ratio:1;border-radius:50%}.colophon-moon{width:76%;left:0;top:3%;border:1px solid rgba(245,240,228,.5);box-shadow:0 0 0 clamp(16px,2.8vw,40px) #f5f0e409,0 0 0 clamp(40px,6vw,82px) #f5f0e405}.colophon-main{position:relative;z-index:1;max-width:580px}.colophon-kicker{color:#f5f0e48c;font:10px/1 var(--sans);letter-spacing:.24em}.colophon h2{margin:25px 0 45px;font-size:clamp(30px,4vw,48px);font-weight:400;letter-spacing:.08em}.colophon-main>p:not(.colophon-kicker){margin:0 0 24px;font-size:13px;line-height:2.1;letter-spacing:.04em}.colophon a{color:inherit}.colophon-links{margin-top:48px;display:grid;grid-template-columns:1fr 1fr;gap:1px;background:#f5f0e452;border:1px solid rgba(245,240,228,.32)}.colophon-links a{padding:17px 18px;background:var(--blue-dark);text-decoration:none;font:12px var(--sans);letter-spacing:.08em}.colophon-links a:hover{background:#15566e}.segment-meter{position:fixed;left:24px;bottom:21px;z-index:15;width:150px;padding:10px 12px;display:grid;gap:3px;color:var(--ink);background:#ebe5d6d1;border-left:2px solid var(--blue);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font-family:var(--sans);pointer-events:none}.segment-meter span,.segment-meter small{font-size:10px;letter-spacing:.12em}.segment-meter b{font-size:10px;font-weight:500;font-variant-numeric:tabular-nums}.motion-paused .segment-meter{opacity:.4}@media(max-width:760px){.reader-bar{grid-template-columns:auto 1fr auto;gap:14px;height:56px;padding-inline:14px}.reader-brand>span:last-child,.reader-progress{display:none}.reader-brand-mark{width:28px;height:28px}.reader-position{justify-content:center}.motion-toggle{min-width:94px;justify-content:flex-end}.opening{padding-top:56px}.opening-inner{width:calc(100% - 34px);min-height:calc(100svh - 56px);padding-top:28px}.opening:before{width:76vw;left:-16vw;top:20vh}.opening:after{width:116px;right:10vw;top:19vh}.opening-title-wrap{width:100%;margin:10vh 0 0}.opening h1{font-size:clamp(68px,21vw,96px);white-space:nowrap}.opening-bottom{align-items:start;flex-direction:column}.begin-reading{width:100%}.book-shell{padding-inline:20px}.text-frontispiece h2{font-size:48px}.book-copy{font-size:16px;line-height:2.18}.book-paragraph{margin-bottom:1.62em}.book-paragraph:nth-of-type(75n):before{right:auto;left:-13px;top:-8px}.colophon{min-height:100svh;grid-template-columns:1fr;gap:40px}.colophon-emblem{width:min(68vw,300px);justify-self:start;margin-left:5vw}.colophon-links{grid-template-columns:1fr}.segment-meter{left:10px;bottom:10px;transform:scale(.86);transform-origin:bottom left}}@media(max-width:390px){.motion-toggle{min-width:0}.opening-overline span:last-child{display:none}.book-shell{padding-inline:16px}.book-copy{font-size:15px}.segment-meter{display:none}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.segment-meter{display:none}.fluid-segment{transform:none!important}}