:root {
  --bg:#101c20; --fg:#e2e5de; --muted:#91a19f; --gold:#cfb584;
  --paper:#f4f0e5; --ink:#292a26; --book-font:12px; --line:1.35;
  --header-height:54px; color-scheme:dark;
}
* { box-sizing:border-box; scrollbar-width:none; }
*::-webkit-scrollbar { display:none; width:0; height:0; }
html { width:100%; height:100%; overflow:hidden; overscroll-behavior:none; }
body {
  position:fixed; inset:0; margin:0; width:100%; height:100vh;
  height:var(--app-height,100dvh); min-height:0; overflow:hidden;
  display:grid; grid-template-rows:minmax(0,1fr);
  overscroll-behavior:none;
  background:radial-gradient(ellipse at 50% 44%,#24383b 0,#16262a 40%,#101c20 75%);
  color:var(--fg); font:13px/1.5 'Segoe UI',Arial,sans-serif;
}
button,a,input,select { -webkit-tap-highlight-color:transparent; }
button { font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
button:disabled { opacity:.25; cursor:default; }
button:hover { color:var(--gold); }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible {
  outline:2px solid var(--gold); outline-offset:3px;
}
a { color:inherit; text-decoration:none; }
.topbar {
  position:absolute; inset:0 0 auto; z-index:20; min-width:0;
  background:transparent; box-shadow:none; backdrop-filter:none; pointer-events:none; mix-blend-mode:difference;
  height:calc(var(--header-height) + env(safe-area-inset-top,0px));
  padding:env(safe-area-inset-top,0px) max(16px,3vw,env(safe-area-inset-right,0px)) 0 max(16px,3vw,env(safe-area-inset-left,0px));
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  border:0;
}
.topbar a,.topbar button { pointer-events:auto; }
.brand { display:flex; align-items:center; gap:10px; min-width:0; overflow:hidden; font:17px Georgia,serif; letter-spacing:3px; white-space:nowrap; }
.brand>span:last-child { min-width:0; overflow:hidden; text-overflow:ellipsis; }
.brand b { font-weight:400; color:var(--gold); }
.brand small { display:block; font:6px 'Segoe UI',sans-serif; letter-spacing:2.5px; color:var(--muted); margin-top:3px; }
.brand-mark { flex:0 0 28px; color:var(--gold); font-size:24px; line-height:29px; border:1px solid #cfb58466; text-align:center; }
.top-actions { display:flex; flex-shrink:0; gap:22px; align-items:center; }
.top-actions button { min-height:32px; font-size:14px; color:#c0cac5; padding:0; }
.top-actions button span { font-size:11px; margin-left:6px; }
.top-actions .list-icon { font-size:18px; }
main {
  position:relative; z-index:1; width:100%; max-width:1600px; min-width:0; min-height:0;
  height:100%; margin:0 auto; display:grid; grid-template-rows:minmax(0,1fr) auto;
  padding:6px max(12px,1.5vw,env(safe-area-inset-right,0px)) max(8px,env(safe-area-inset-bottom,0px)) max(12px,1.5vw,env(safe-area-inset-left,0px));
  overflow:hidden;
}
.eyebrow { font:8px 'Segoe UI',sans-serif; letter-spacing:3px; color:var(--gold); }
#resume { color:var(--gold); }
#resume[hidden] { display:none; }
.reading-desk {
  position:relative; min-width:0; min-height:0; width:100%; height:100%;
  display:grid; grid-template-columns:44px minmax(0,1fr) 44px;
  grid-template-rows:minmax(0,1fr); column-gap:clamp(6px,1vw,14px);
  align-items:center; overflow:hidden; overflow:clip; isolation:isolate;
}
#book-slot {
  grid-area:1/2; width:100%; height:100%; min-width:0; min-height:0;
  display:grid; place-items:center; overflow:hidden; overflow:clip;
  contain:layout paint; overscroll-behavior:none;
}
#book-space { position:relative; flex:none; width:1px; height:1px; }
body:not(.reader-ready) #book-space { visibility:hidden; }
body:not(.reader-ready) #book-shift { transition:none; }
#book-scale { position:absolute; left:50%; top:50%; width:960px; height:684px; transform-origin:center; }
#book-shift { height:684px; transition:transform .42s ease; filter:drop-shadow(0 10px 18px #0004); }
#book { height:684px; box-shadow:8px 7px 0 -4px #cbc2ac,11px 10px 0 -5px #aaa28e,14px 13px 0 -6px #dbcfb4; border-radius:3px; }
body.cover-view #book-shift { transform:translateX(-240px); }
body.back-cover #book-shift { transform:translateX(240px); }
body.single.cover-view #book-shift,body.single.back-cover #book-shift { transform:none; }
body.cover-view #book { box-shadow:none; }
.side-controls { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px; width:44px; min-width:0; margin:0; z-index:3; }
.side-left { grid-area:1/1; }
.side-right { grid-area:1/3; }
.turn { border:1px solid #6f858347; border-radius:50%; width:40px; height:40px; padding:0; font-size:22px; color:#c1c9bf; transition:background .2s,transform .2s; }
.turn:hover { background:#ffffff09; transform:scale(1.04); }
.copy-icon { width:29px; height:29px; padding:5px; color:#9aada3; }
.copy-icon svg { width:19px; height:19px; }
#loading { position:absolute; grid-area:1/2/2/3; inset:0; display:flex; align-items:center; justify-content:center; background:transparent; z-index:30; color:var(--gold); letter-spacing:2px; pointer-events:none; }
#loading[hidden] { display:none; }
.loading-preview-scale { position:absolute; left:50%; top:50%; width:960px; height:684px; transform-origin:center; }
.loading-preview-shift { position:relative; width:100%; height:684px; transform:translateX(-240px) perspective(2000px) rotateY(-14deg) rotateZ(-1deg); transform-origin:75% 50%; filter:drop-shadow(0 10px 18px #0004); }
.loading-book { position:absolute; left:480px; top:0; }
body.single .loading-preview-shift { transform:perspective(2000px) rotateY(-10deg) rotateZ(-.6deg); transform-origin:50% 50%; }
body.single .loading-book { left:0; }
body.reader-ready #loading { opacity:0; transition:opacity 260ms ease; }
/* Internal page dimensions stay fixed so screen resizing never repaginates the story. */
.page { background:var(--paper); color:var(--ink); overflow:hidden; width:480px; height:684px; box-shadow:inset 1px 0 4px #00000012; }
.page.--left { background:linear-gradient(to right,var(--paper) 95%,#d4cdbb); }
.page.--right { background:linear-gradient(to right,#d9d1bd,var(--paper) 7%); }
.page-inner { height:100%; padding:39px 39px 34px; position:relative; display:flex; flex-direction:column; }
.page-head { color:#8b8778; font:8px 'Segoe UI',sans-serif; text-transform:uppercase; letter-spacing:2px; min-height:20px; border-bottom:1px solid #8e887020; margin-bottom:19px; }
.page-body { height:535px; flex:0 0 535px; overflow:hidden; font:var(--book-font)/var(--line) Georgia,'Times New Roman',serif; hyphens:none; word-break:normal; overflow-wrap:normal; user-select:text; -webkit-user-select:text; white-space:normal; }
.page-body p { margin:0 0 5px; orphans:2; widows:2; }
.page-body p.continuation { margin-top:0; }
.page-body h2 { font:28px/1.1 Georgia,serif; font-weight:400; margin:40px 0 27px; }
.page-body .chapter-number { font:9px 'Segoe UI',sans-serif; letter-spacing:3px; color:#8f774c; margin-top:38px; }
.page-foot { margin-top:auto; display:flex; justify-content:space-between; font:9px Georgia,serif; color:#938a76; padding-top:13px; }
.scene-mark { text-align:center; letter-spacing:10px; color:#b19c76; margin:18px 0; }
.footer-scene { position:absolute; left:50%; bottom:31px; transform:translateX(-50%); margin:0; font:11px Georgia,serif; letter-spacing:4px; color:#a18e68; }
.page-body img { max-width:100%; max-height:530px; display:block; margin:10px auto; object-fit:contain; mix-blend-mode:multiply; }
.page-body figure { margin:0; display:flex; height:100%; align-items:center; justify-content:center; }
.cover,.page.cover.--right,.page.cover.--left { background:linear-gradient(110deg,#102d34,#244c50 43%,#112e35); color:#ddc394; border:1px solid #59807a; border-radius:2px 6px 6px 2px; box-shadow:7px 5px 0 -2px #afa586,10px 8px 0 -4px #ded1af; }
.cover:after { content:''; position:absolute; inset:15px; border:1px solid #ceb37b70; pointer-events:none; }
.cover-inner { height:100%; padding:46px 44px; position:relative; text-align:center; box-shadow:inset 13px 0 14px -10px #000c; }
.cover-kicker { font-size:9px; letter-spacing:5px; }
.cover h1 { font:93px/.95 Georgia,serif; letter-spacing:9px; margin:62px 0 7px; text-shadow:1px 2px 0 #10292b; }
.cover-year { font:27px Georgia,serif; letter-spacing:19px; margin-left:14px; }
.orbit-art { width:267px; height:267px; border:1px solid #9aaf9270; border-radius:50%; position:relative; margin:32px auto 22px; background:radial-gradient(circle at 40% 35%,#8ba5a455,#1e4a4d55 30%,#071e27 68%,#142f32 70%); box-shadow:inset -12px -6px 35px #0007,0 0 45px #92bbac10; display:grid; place-items:center; overflow:visible; }
.orbit-art:before { content:''; position:absolute; inset:-19px 24px; border:1px solid #b9b08b66; border-radius:50%; transform:rotate(39deg); }
.orbit-art:after { content:'✦'; position:absolute; right:15px; top:15px; font-size:19px; color:#d8be85; }
.orbit-art img { width:232px; height:232px; object-fit:cover; border-radius:50%; opacity:.68; mix-blend-mode:luminosity; filter:contrast(1.2); }
.cover-caption { font:italic 16px/1.6 Georgia,serif; letter-spacing:1px; color:#d8c8a5; }
.cover-bottom { font:8px 'Segoe UI',sans-serif; letter-spacing:4px; margin-top:21px; }
.toc-jump { padding:0; }
.title-page .page-body { display:flex; align-items:center; justify-content:center; }
.title-page-content { width:100%; text-align:center; transform:translateY(-54px); }
.title-page-content .chapter-number { margin:0; }
.title-page-content h2 { font:54px/1.1 Georgia,serif; letter-spacing:6px; margin:28px 0 20px; }
.title-page-content .scene-mark { margin:18px 0; }
.title-page-content p { font:italic 17px/1.5 Georgia,serif; max-width:290px; margin:0 auto; }
.copy-glint p,.copy-glint h2 {
  background:linear-gradient(100deg,var(--ink) 0%,var(--ink) 43%,color-mix(in srgb,var(--ink) 72%,var(--gold)) 50%,var(--ink) 57%,var(--ink) 100%);
  background-size:250% 100%;
  background-clip:text; -webkit-background-clip:text;
  color:transparent; -webkit-text-fill-color:transparent;
  animation:copy-text-glint 480ms cubic-bezier(.2,.65,.2,1) both;
}
@keyframes copy-text-glint { from { background-position:100% 0; } to { background-position:0 0; } }
.reader-footer { position:relative; width:100%; max-width:960px; min-width:0; margin:0 auto; padding-top:6px; }
.reading-footer-controls { opacity:0; visibility:hidden; transition:opacity 300ms ease; }
body.reader-ready .reading-footer-controls { opacity:1; visibility:visible; }
.loading-footer { position:absolute; inset:6px 0 0; opacity:1; transition:opacity 260ms ease; }
body.reader-ready .loading-footer { opacity:0; pointer-events:none; }
.load-status { display:flex; justify-content:space-between; align-items:center; min-height:24px; color:#b4c0b6; font-size:10px; letter-spacing:.5px; }
#load-progress { height:2px; width:100%; margin:10px 0 11px; background:#73857c42; }
#load-fill { display:block; width:0; height:100%; background:var(--gold); transition:width 140ms linear; }
.progress-row { display:flex; justify-content:space-between; align-items:center; gap:10px; color:#b4c0b6; font-size:10px; letter-spacing:.5px; min-height:24px; }
#position { min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#jump-form { display:flex; flex-shrink:0; gap:7px; align-items:center; color:#8e9f95; }
#page-input { background:none; border:0; border-bottom:1px solid #6e8075; width:37px; text-align:center; color:#d1d4c7; font:11px 'Segoe UI'; padding:3px 0; appearance:textfield; }
#page-input::-webkit-inner-spin-button,#page-input::-webkit-outer-spin-button { appearance:none; margin:0; }
#progress { width:100%; height:2px; margin:10px 0 11px; accent-color:#d3bc86; cursor:pointer; display:block; }
.footer-note { display:flex; justify-content:space-between; gap:12px; color:#70867e; font-size:10px; min-height:15px; }
.footer-note i { margin:0 10px; }
.drawer { position:fixed; inset:0 auto auto 0; width:350px; max-width:92vw; height:var(--app-height,100dvh); background:#182b2e; z-index:100; padding:28px; overflow:auto; overscroll-behavior:contain; box-shadow:30px 0 120px #0009; }
.drawer[hidden] { display:none; }
.drawer-heading { display:flex; justify-content:space-between; }
h2 { font:32px Georgia,serif; font-weight:400; }
.drawer h2 { margin:10px 0 24px; }
.close { font-size:30px; color:#a7b6ae; }
.chapter-link { display:flex; width:100%; justify-content:space-between; padding:14px 1px; border-bottom:1px solid #ffffff10; font:15px Georgia,serif; text-align:left; }
.chapter-link span { font:10px 'Segoe UI'; color:#91a199; }
.chapter-link.active { color:var(--gold); }
.drawer-end { font-size:10px; color:#8c9c93; margin-top:25px; }
dialog { border:1px solid #53645d; background:#192c2f; color:var(--fg); width:550px; max-width:calc(100% - 24px); max-height:calc(var(--app-height,100dvh) - 24px); padding:28px; border-radius:9px; box-shadow:0 30px 120px #000a; overflow:auto; overscroll-behavior:contain; }
dialog::backdrop { background:#071316aa; backdrop-filter:blur(6px); }
dialog form .close { float:right; }
dialog input,dialog select { min-width:0; border:1px solid #52645e; border-radius:4px; background:#132427; color:#e2e7df; padding:12px; font:16px 'Segoe UI'; }
#search-input { width:100%; }
#search-results { max-height:45dvh; overflow:auto; overscroll-behavior:contain; margin-top:18px; }
#search-results button { display:block; text-align:left; padding:15px 0; border-bottom:1px solid #ffffff19; width:100%; font:14px/1.6 Georgia,serif; overflow-wrap:anywhere; }
#search-results small { display:block; font:9px 'Segoe UI'; color:var(--gold); letter-spacing:1px; margin-bottom:5px; }
#settings-dialog label { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:22px 0; }
#settings-dialog p { color:#98aaa1; font-size:12px; }
#open-bookmark { display:block; color:var(--gold); padding:10px 0; font-size:12px; }
#toast { position:fixed; left:50%; bottom:max(22px,env(safe-area-inset-bottom,0px)); transform:translate(-50%,20px); max-width:calc(100% - 24px); opacity:0; background:#e6d6ad; color:#18302d; padding:9px 20px; border-radius:6px; z-index:200; pointer-events:none; transition:.2s; }
#toast.show { opacity:1; transform:translate(-50%,0); }
/* A fixed, contained measuring box can never enlarge the document's scroll area. */
#measure { position:fixed; left:-1000px; top:0; width:402px; height:535px; visibility:hidden; contain:strict; pointer-events:none; }
.night { --paper:#262c2d; --ink:#ded9cc; }
.night .page.--left,.night .page.--right { background:#262c2d; }
.light { --paper:#fffdf8; }
.night .page-body img { mix-blend-mode:normal; }
.stf__parent { touch-action:pan-y!important; }
.stf__item,.stf__block { user-select:text!important; }
body.book-turning #book { box-shadow:none; }
body.book-turning #book-shift { filter:none; }
body.book-turning .art-cover::before,body.book-turning .art-cover::after { display:none; }
.ambient-dust { position:fixed; inset:0; overflow:hidden; pointer-events:none; z-index:0; contain:strict; }
.ambient-dust i { position:absolute; left:50%; top:48%; width:var(--size); height:var(--size); background:var(--tone); border-radius:50%; opacity:0; box-shadow:0 0 5px 1px #dfc59038; animation:ambient-drift var(--duration) var(--delay) linear infinite; will-change:transform,opacity; }
.ambient-dust.paused i { animation-play-state:paused; }
@keyframes ambient-drift {
  0% { opacity:0; transform:translate3d(var(--from-x),var(--from-y),0) scale(1.15); }
  12% { opacity:.6; }
  38% { opacity:.42; }
  72% { opacity:.17; }
  100% { opacity:.015; transform:translate3d(var(--to-x),var(--to-y),0) scale(.12); }
}
@media(max-width:899px) {
  :root { --header-height:48px; }
  .topbar { padding-right:max(12px,env(safe-area-inset-right,0px)); padding-left:max(12px,env(safe-area-inset-left,0px)); gap:8px; }
  .brand { font-size:15px; letter-spacing:2px; gap:8px; }
  .brand small { display:none; }
  .brand-mark { flex-basis:24px; font-size:21px; line-height:25px; }
  .top-actions { gap:clamp(3px,1.5vw,12px); }
  .top-actions button { width:28px; }
  .top-actions button span { display:none; }
  .top-actions .list-icon { display:inline; margin:0; }
  main { padding-top:24px; padding-left:max(8px,env(safe-area-inset-left,0px)); padding-right:max(8px,env(safe-area-inset-right,0px)); }
  .eyebrow { letter-spacing:2px; }
  .reader-footer { padding:3px 6px 0; }
  .loading-footer { inset:3px 6px 0; }
  .load-status { font-size:9px; }
  #load-progress { margin:8px 0 10px; }
  .progress-row { font-size:9px; gap:6px; }
  #jump-form { gap:4px; }
  #page-input { font-size:16px; width:34px; }
  #progress { margin:8px 0 10px; }
  .footer-note { display:none; }
  .page { border-radius:2px; }
}
@media(max-width:599px) and (min-height:501px) {
  .reading-desk { grid-template-columns:minmax(0,1fr); grid-template-rows:minmax(0,1fr) 64px; gap:3px; }
  #book-slot { grid-area:1/1; }
  #loading { grid-area:1/1/2/2; }
  .side-controls { grid-area:2/1; gap:3px; width:36px; }
  .side-left { justify-self:start; margin-left:7px; }
  .side-right { justify-self:end; margin-right:7px; }
  .turn { width:33px; height:33px; font-size:19px; }
  .copy-icon { height:25px; padding:3px; }
}
@media(max-height:500px) {
  :root { --header-height:38px; }
  main { padding-top:3px; padding-bottom:max(4px,env(safe-area-inset-bottom,0px)); }
  .reader-footer { padding-top:0; }
  .loading-footer { top:0; }
  .load-status { min-height:22px; font-size:9px; }
  #load-progress { margin:5px 0 8px; }
  .footer-note { display:none; }
  .progress-row { min-height:22px; font-size:9px; }
  #progress { margin:5px 0 8px; }
  .side-controls { gap:5px; }
  .turn { width:32px; height:32px; font-size:18px; }
  .copy-icon { height:25px; padding:3px; }
  dialog { padding:16px; }
}
@media(max-width:760px) { .ambient-dust i:nth-child(n+49) { display:none; } }
@media(prefers-reduced-motion:reduce) {
  * { scroll-behavior:auto!important; transition:none!important; }
  .ambient-dust { display:none; }
}