:root { color-scheme: light; font-family: ui-sans-serif, system-ui, "Microsoft YaHei", sans-serif; }
* { box-sizing: border-box; } body { margin: 0; background: #eee8dc; color: #2b2924; } button, input { font: inherit; }
button { border: 0; border-radius: 12px; background: #2f5c4f; color: white; padding: .72rem 1rem; cursor: pointer; } button.ghost { color: inherit; background: transparent; border: 1px solid currentColor; }
.app { min-height: 100dvh; max-width: 1000px; margin: auto; padding: 1.25rem; }.card { background: #fffdf8; border-radius: 20px; box-shadow: 0 12px 40px #29201513; padding: 1.5rem; }
.auth { max-width: 440px; margin: 12vh auto; }.eyebrow { letter-spacing: .15em; font-size: .75rem; text-transform: uppercase; color: #52756a; }.stack { display: grid; gap: 1rem; }.stack label { display:grid; gap:.4rem; font-weight:600; } input { border: 1px solid #c9c0b1; padding: .7rem; border-radius: 10px; background: transparent; }
.muted, .message { color: #756e61; }.message.error { color: #a32929; }.topbar { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:1.3rem; }.topbar h1 { margin:0; font-size:1.5rem; }.actions { display:flex; gap:.6rem; flex-wrap:wrap; }.shelf { display:grid; grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); gap:1rem; }.book { text-align:left; min-height:170px; display:flex; flex-direction:column; justify-content:flex-end; background:linear-gradient(145deg,#8d604b,#382e3a); }.book:nth-child(3n) { background:linear-gradient(145deg,#627763,#203b40); }.book:nth-child(3n+2) { background:linear-gradient(145deg,#bd9d55,#7b3d2c); }.book small { opacity:.82; margin-top:.4rem; }.empty { text-align:center; padding:4rem 1rem; }.hidden { display:none!important; }
.reader { position:fixed; inset:0; z-index:3; padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom); display:flex; flex-direction:column; background:var(--reader-bg); color:var(--reader-fg); }.reader[data-theme="paper"] { --reader-bg:#f3ecd9; --reader-fg:#2d281f; }.reader[data-theme="night"] { --reader-bg:#171917; --reader-fg:#d9d4c5; }.reader[data-theme="mint"] { --reader-bg:#dceae0; --reader-fg:#263a31; }
.reader-head { display:flex; align-items:center; justify-content:space-between; padding:.8rem 1rem; font-size:.9rem; opacity:.86; }.reader-page { flex:1; overflow:auto; padding:var(--pad) max(1.5rem, calc((100vw - 720px)/2)); font-family:Georgia,"Noto Serif SC","Songti SC",serif; font-size:var(--font-size); line-height:var(--line-height); white-space:pre-wrap; }.reader-page h2 { text-align:center; font-size:1.1em; margin:1rem 0 2rem; }.reader-footer { padding:.8rem 1rem; display:flex; justify-content:space-between; gap:.5rem; }.reader-menu { position:absolute; inset:auto 1rem 3.8rem; padding:1rem; background:#000b; color:white; border-radius:16px; display:grid; gap:.75rem; }.setting-row { display:flex; align-items:center; gap:.5rem; justify-content:space-between; }.setting-row input { width:7rem; }.toc { position:absolute; inset:0 auto 0 0; width:min(80vw,360px); overflow:auto; background:var(--reader-bg); box-shadow:3px 0 20px #0004; padding:1rem; }.toc button { display:block; width:100%; text-align:left; margin:.35rem 0; background:transparent; color:inherit; }.toc button.active { background:#7774; }.progress { opacity:.7; font-size:.8rem; }
@media (max-width:600px) { .app { padding:1rem; }.topbar { align-items:flex-start; }.reader-page { padding-left:1.25rem; padding-right:1.25rem; } }
.reader-footer { flex-wrap:wrap; }.reader-menu { max-height:min(76dvh,620px); overflow:auto; }.setting-row select { max-width:12rem; }.reader-menu hr { width:100%; border:0; border-top:1px solid #fff5; }.tts-note { margin:0; max-width:22rem; font-size:.78rem; color:#fffc; }.tts-progress { position:absolute; z-index:2; top:3.6rem; left:50%; transform:translateX(-50%); max-width:calc(100vw - 2rem); padding:.4rem .7rem; border-radius:999px; background:#000b; color:#fff; font-size:.78rem; white-space:nowrap; }
.book-overview { max-width:900px; margin:0 auto; padding:1.5rem 0 3rem; }.overview-head { display:flex; align-items:flex-start; gap:1rem; margin-bottom:1.25rem; }.overview-head h1 { margin:.1rem 0; }.overview-head .ghost { flex:0 0 auto; }.overview-hero,.cache-overview { display:flex; align-items:center; justify-content:space-between; gap:1.25rem; margin-bottom:1rem; }.overview-hero p,.cache-overview p { margin:.35rem 0; }.overview-percent { font-size:2.5rem; color:#2f5c4f; }.section-title { display:flex; justify-content:space-between; align-items:end; gap:1rem; margin:2rem 0 .8rem; }.section-title h2 { margin:.1rem 0; }.chapter-overview { display:grid; gap:.75rem; }.chapter-card { background:#fffdf8; border:1px solid #d8cfbf; border-radius:16px; padding:1rem 1.1rem; }.chapter-card.current { border-color:#52756a; box-shadow:0 3px 14px #2f5c4f19; }.chapter-title { display:flex; align-items:flex-start; gap:.8rem; }.chapter-title>span { display:grid; place-items:center; flex:0 0 2rem; height:2rem; border-radius:50%; background:#e9dfcd; color:#52756a; font-weight:700; }.chapter-title h3 { margin:0; font-size:1rem; }.chapter-title p { margin:.2rem 0 0; }.chapter-read { margin-left:auto; flex:0 0 auto; }.chapter-meta { display:flex; flex-wrap:wrap; gap:.5rem; margin:.8rem 0 .55rem 2.8rem; }.cache-badge,.content-badge { padding:.22rem .5rem; border-radius:999px; font-size:.78rem; background:#ede7dc; }.cache-badge.complete { background:#dcebe1; color:#245844; }.cache-badge.partial { background:#f3e4bc; color:#765000; }.cache-badge.other_settings { background:#e5e2f1; color:#51487a; }.chapter-preview { margin:.2rem 0 0 2.8rem; line-height:1.65; color:#5f584d; }.cache-overview { background:#eef4ed; }
@media (max-width:600px) { .book-overview { padding:1rem 0 2rem; }.overview-head { display:block; }.overview-head .ghost { margin-bottom:1rem; }.overview-hero,.cache-overview,.section-title { align-items:flex-start; flex-direction:column; }.overview-hero button { width:100%; }.chapter-card { padding:.85rem; }.chapter-title { gap:.6rem; }.chapter-read { padding:.55rem .65rem; }.chapter-meta,.chapter-preview { margin-left:0; } }