/* Read On: a chapter route rather than a static shelf. */
:root{--paper:#f5f3e9;--ink:#192f35;--accent:#146c70;--soft:#fffdf5;--wash:#dce9e6;--edge:#aac2ba;--display:'Plus Jakarta Sans';--text:Georgia}
body{background:#102b32}.app-shell{max-width:1500px;background:var(--paper)}body[data-concept=startreading] main{display:block}
.topbar{height:68px;background:#102b32;color:#eff4e7;border:0}.identity{font:700 19px var(--display),sans-serif;letter-spacing:0}.identity img{border-radius:50%}.edition{color:#9bd4c3;opacity:1;letter-spacing:.12em}
.hero{display:grid;position:relative;height:auto;overflow:hidden;min-height:390px;grid-template-columns:minmax(0,1.35fr) minmax(260px,.65fr);background:#12373e;color:#f8f5e8;border:0}
.hero-copy{padding:58px clamp(30px,7vw,110px)}.hero .eyebrow{color:#94d6c4}.hero h1{font:700 clamp(40px,4.5vw,70px)/1.03 var(--display),sans-serif;letter-spacing:-.05em;max-width:850px}.hero .deck{font-size:16px;max-width:540px;opacity:.85}.hero .author{color:#c5e6d7}
.hero-actions .primary{background:#d0a85c;color:#172e32;border-color:#d0a85c}.hero-actions .secondary{color:#f8f5e8;border-color:#8daea8}.hero-actions button{border-radius:0;font:700 12px var(--display),sans-serif;letter-spacing:.04em;text-transform:uppercase}
.hero-art{display:grid;min-height:300px;border:0;background:#1c4850;position:relative}.route-chart{width:75%;display:grid;justify-items:center;gap:15px}.route-node{font:700 10px var(--display),sans-serif;letter-spacing:.2em;color:#abd3c7}.route-path{width:6px;height:95px;background:#5d888a;position:relative;border-radius:9px;overflow:hidden}.route-path i{display:block;background:#d0a85c;width:100%;height:0;transition:height .25s}.route-chart strong{font:700 clamp(58px,6vw,96px)/1 var(--display),sans-serif;letter-spacing:-.08em;color:#f5e5b9}
.workspace{display:flex;flex-direction:column}.rail{order:0;display:flex;flex-direction:row;justify-content:center;gap:0;padding:0;background:#dfece5;border:0;border-bottom:1px solid var(--edge);position:relative;top:auto;height:auto}.rail button{font:700 12px var(--display),sans-serif;text-transform:uppercase;letter-spacing:.06em;padding:17px 24px;border-right:1px solid var(--edge);border-radius:0}.rail button:hover{background:#c5ddd4}
.reader-area{order:1;max-width:1120px;padding:34px clamp(20px,7vw,100px) 90px}.route-navigator{display:flex;justify-content:space-between;gap:25px;align-items:center;margin:0 0 30px;border:1px solid var(--edge);border-left:6px solid var(--accent);background:var(--soft);padding:17px 20px}.route-kicker{display:block;color:var(--accent);font:700 10px var(--display),sans-serif;letter-spacing:.16em;margin-bottom:6px}.route-navigator strong{font:700 18px/1.3 var(--display),sans-serif}.route-controls{display:flex;gap:7px;flex-shrink:0}.route-controls button{padding:11px 13px;border:1px solid var(--edge);background:transparent;color:var(--ink);font:700 11px var(--display),sans-serif}.route-controls button:disabled{opacity:.35;cursor:default}.route-controls button:hover:not(:disabled){background:var(--wash)}
.progress-track{height:2px;margin:14px 0 26px}.reading-sheet{max-width:820px;background:transparent;border:0;border-left:2px solid #d0a85c;padding:0 20px 0 clamp(28px,5vw,68px)}.reading-sheet h2{font:700 clamp(31px,3.7vw,48px)/1.1 var(--display),sans-serif;letter-spacing:-.05em;margin-bottom:38px}.page-text{font:var(--reading-size,19px)/var(--reading-line,1.75) Georgia,serif}
.page-actions,.jump-row{max-width:820px}.page-actions button,.jump-row button{background:#12373e;color:#f8f5e8;border-color:#12373e;font-family:var(--display),sans-serif}.page-actions button:disabled{opacity:.35}
footer{background:#102b32;color:#e9f1e9;border:0}.archive-note{border:0;border-top:1px solid #6f9b91;border-radius:0;padding:16px 0 0;max-width:650px}.archive-heading{color:#b7ddc6}
@media(max-width:800px){.hero{grid-template-columns:1fr 170px}.hero-copy{padding:40px 28px}.hero h1{font-size:42px}.route-chart strong{font-size:58px}.rail{justify-content:flex-start;overflow:auto}.rail button{padding:14px 17px;white-space:nowrap}.route-navigator{align-items:flex-start;flex-direction:column}.route-controls{width:100%}.route-controls button{flex:1}.reader-area{padding:26px 18px 70px}}
@media(max-width:600px){body[data-concept=startreading] .hero{display:block!important;min-height:0}.hero-copy{padding:27px 20px}.hero h1{font-size:35px}.hero-art{display:none}.hero-meta{margin-top:20px}.reader-intro{display:none}.route-navigator{margin-bottom:20px;padding:14px}.route-navigator strong{font-size:16px}.reading-sheet{padding:0 4px 0 18px}.reading-sheet h2{font-size:30px}.page-actions button{font-size:10px;padding:10px 8px}}
