:root { color-scheme:dark; --bg:#090d0b; --surface:#131a16; --line:#2b3731; --text:#f2f5f3; --muted:#9caba3; --accent:#87efba; }
* { box-sizing:border-box; } body { margin:0; min-height:100vh; background:radial-gradient(circle at 80% 0,rgba(70,210,141,.13),transparent 30rem),var(--bg); color:var(--text); font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif; }
.reader-shell { width:min(1120px,calc(100% - 32px)); margin:auto; padding:52px 0 80px; }.reader-header { display:flex; justify-content:space-between; gap:24px; align-items:flex-start; }.reader-header h1,.book-header h1 { margin:0; font-size:clamp(2.6rem,6vw,5rem); letter-spacing:-.06em; line-height:.95; }.reader-header>div>p:last-child,.description,.authors { color:var(--muted); line-height:1.55; }.reader-eyebrow { margin:0 0 12px; color:var(--accent); font-size:.72rem; font-weight:850; letter-spacing:.17em; }.reader-header nav { display:flex; gap:12px; align-items:center; color:var(--muted); font-size:.82rem; }.reader-header a,.book-header>a { color:var(--text); text-decoration:none; }.catalog-hero { display:flex; gap:10px; align-items:baseline; margin:54px 0 22px; padding-bottom:18px; border-bottom:1px solid var(--line); }.catalog-hero strong { font-size:2rem; }.catalog-hero span { color:var(--muted); }.reader-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }.reader-book,.reader-empty,.locked-book { padding:26px; border:1px solid var(--line); border-radius:20px; background:linear-gradient(145deg,#18211c,var(--surface)); }.book-symbol { display:grid; width:52px; height:62px; place-items:center; border-radius:7px 13px 13px 7px; background:var(--accent); color:#082116; font-size:1.5rem; font-weight:900; }.access-label { color:var(--accent); font-size:.68rem; font-weight:800; letter-spacing:.09em; text-transform:uppercase; }.reader-book h2 { margin:8px 0 4px; font-size:1.5rem; }.reader-book .description { min-height:3em; }.book-footer { display:flex; justify-content:space-between; gap:14px; align-items:center; margin-top:22px; color:var(--muted); font-size:.8rem; }.book-footer a,.locked-book a { padding:9px 13px; border:1px solid var(--line); border-radius:999px; color:var(--text); text-decoration:none; }.book-header { max-width:760px; margin-bottom:44px; }.book-header>a { display:inline-block; margin-bottom:42px; color:var(--muted); }.chapter-list { display:grid; gap:12px; }.reader-chapter { padding:18px 20px; border:1px solid var(--line); border-radius:16px; background:var(--surface); }.reader-chapter.resume { border-color:rgba(135,239,186,.55); }.chapter-copy { display:flex; gap:14px; align-items:center; margin-bottom:13px; }.chapter-copy>span { color:var(--accent); font:700 .75rem ui-monospace,monospace; }.chapter-copy h2 { margin:0; font-size:1rem; }.chapter-copy p { margin:4px 0 0; color:var(--muted); font-size:.72rem; }.reader-chapter audio { width:100%; height:36px; }.locked-book { max-width:620px; }.reader-empty { grid-column:1/-1; text-align:center; }
.player-toolbar { position:sticky; top:10px; z-index:5; display:grid; grid-template-columns:auto minmax(0,1fr) auto auto; gap:12px; align-items:center; padding:13px; border:1px solid var(--line); border-radius:16px; background:rgba(19,26,22,.96); box-shadow:0 12px 35px rgba(0,0,0,.28); backdrop-filter:blur(12px); }
.player-toolbar button,.player-toolbar select { min-height:40px; border:1px solid var(--line); border-radius:999px; background:#0d1310; color:var(--text); font:inherit; }.player-toolbar button { padding:8px 13px; cursor:pointer; }.player-toolbar button:disabled { cursor:not-allowed; opacity:.42; }.player-toolbar label span,.now-playing span { display:block; margin-bottom:4px; color:var(--muted); font-size:.64rem; font-weight:750; letter-spacing:.07em; text-transform:uppercase; }.player-toolbar select { padding:7px 11px; }.now-playing { min-width:0; }.now-playing strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:.86rem; }.reader-chapter.playing { border-color:var(--accent); box-shadow:0 0 0 1px rgba(135,239,186,.12); }
@media(max-width:720px){.reader-header{flex-direction:column}.reader-grid{grid-template-columns:1fr}.reader-shell{width:calc(100% - 20px);padding-top:30px}.reader-header nav{flex-wrap:wrap}.player-toolbar{position:static;grid-template-columns:1fr 1fr}.now-playing{grid-column:1/-1;grid-row:1}.player-toolbar label{grid-column:1/-1}.player-toolbar select{width:100%}}
