:root{--paper: #f4efe4;--paper-deep: #ebe3d2;--ink: #2b2418;--ink-soft: #6b5e4a;--cinnabar: #b4442a;--cinnabar-soft: #d36a4f;--moss: #4f6d55;--line: rgba(43, 36, 24, .1);--card: #fffaf1;--shadow: 0 10px 30px rgba(80, 52, 24, .08);--tab-h: 62px;--safe-b: env(safe-area-inset-bottom)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#app{margin:0;min-height:100%;background:var(--paper);color:var(--ink);font-family:PingFang SC,Noto Sans SC,Source Han Sans SC,sans-serif}body{padding-bottom:env(safe-area-inset-bottom)}a{color:inherit;text-decoration:none}button,input{font:inherit}.app-shell{min-height:100vh}.page{min-height:100vh;padding:20px 18px calc(var(--tab-h) + var(--safe-b) + 16px)}.page.no-tab{padding-bottom:calc(24px + var(--safe-b))}.page-title{margin:0 0 4px;font-size:26px;font-weight:700;letter-spacing:.08em}.page-sub{margin:0 0 18px;color:var(--ink-soft);font-size:13px}.search-bar{display:flex;align-items:center;gap:8px;background:var(--card);border:1px solid var(--line);border-radius:999px;padding:10px 14px;box-shadow:var(--shadow)}.search-bar input{flex:1;border:0;outline:none;background:transparent;color:var(--ink)}.book-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px 10px}.book-card{display:flex;flex-direction:column;gap:8px}.cover{width:100%;aspect-ratio:3 / 4;object-fit:cover;border-radius:8px;background:linear-gradient(160deg,#d9c7a8,#b89b73);box-shadow:0 8px 16px #462a1029}.cover.placeholder{display:flex;align-items:flex-end;padding:10px;color:#fffaf1;font-size:13px;font-weight:600;line-height:1.35}.book-name{font-size:13px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.book-author{font-size:12px;color:var(--ink-soft);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tab-bar{position:fixed;left:0;right:0;bottom:0;height:calc(var(--tab-h) + var(--safe-b));padding-bottom:var(--safe-b);display:grid;grid-template-columns:repeat(3,1fr);background:#f4efe4f0;border-top:1px solid var(--line);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:20}.tab-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:var(--ink-soft);font-size:11px}.tab-item.active{color:var(--cinnabar);font-weight:600}.tab-icon{font-size:18px}.auth-card{margin-top:48px;background:var(--card);border-radius:18px;padding:28px 22px;box-shadow:var(--shadow)}.field{margin-bottom:14px}.field label{display:block;margin-bottom:6px;font-size:13px;color:var(--ink-soft)}.field input{width:100%;border:1px solid var(--line);background:#fff;border-radius:12px;padding:12px 14px;outline:none}.btn{border:0;border-radius:999px;padding:12px 18px;background:var(--cinnabar);color:#fffaf1;font-weight:600}.btn.block{width:100%}.btn.ghost{background:transparent;color:var(--cinnabar);border:1px solid rgba(180,68,42,.3)}.btn:disabled{opacity:.55}.muted-link{display:block;margin-top:16px;text-align:center;color:var(--ink-soft);font-size:13px}.section-head{display:flex;align-items:baseline;justify-content:space-between;margin:24px 0 12px}.section-head h3{margin:0;font-size:16px}.chips{display:flex;flex-wrap:wrap;gap:8px}.chip{border:1px solid var(--line);background:var(--card);border-radius:999px;padding:6px 12px;font-size:13px}.chip.active{background:var(--cinnabar);color:#fff;border-color:var(--cinnabar)}.detail-hero{display:grid;grid-template-columns:108px 1fr;gap:16px;align-items:start}.detail-hero .cover{width:108px}.meta{color:var(--ink-soft);font-size:13px;line-height:1.7}.intro{margin-top:18px;line-height:1.8;color:var(--ink-soft);font-size:14px;white-space:pre-wrap}.action-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:22px}.chapter-item{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);font-size:14px}.reader-page{min-height:100vh;padding:0;touch-action:pan-y}.reader-page.paper{background:#f4efe4;color:#2b2418}.reader-page.green{background:#cfe3c8;color:#243126}.reader-page.night{background:#161410;color:#d8d0c2}.reader-content{padding:72px 22px 120px;max-width:720px;margin:0 auto}.reader-title{margin:0 0 18px;font-size:20px;font-weight:700}.reader-content p{margin:0 0 .9em;text-indent:2em;letter-spacing:.04em}.chapter-block{padding-bottom:28px;margin-bottom:8px;border-bottom:1px dashed rgba(43,36,24,.12)}.reader-page.night .chapter-block{border-bottom-color:#d8d0c21f}.reader-load-tip{padding:18px 0 8px;text-align:center;color:var(--ink-soft);font-size:13px}.reader-menu,.reader-bottom{position:fixed;left:0;right:0;z-index:30;background:#14100ce0;color:#f4efe4}.reader-menu{top:0;display:flex;align-items:center;gap:10px;padding:12px 14px}.reader-bottom{bottom:0;display:grid;grid-template-columns:repeat(4,1fr);padding:10px 8px calc(10px + var(--safe-b));text-align:center;font-size:13px}.ghost-btn{background:transparent;border:0;color:inherit}.drawer,.sheet{position:fixed;top:0;right:0;bottom:0;left:0;z-index:40;background:#00000073}.drawer-panel,.sheet-panel{position:absolute;background:var(--paper);color:var(--ink)}.drawer-panel{top:0;right:0;width:min(82vw,360px);height:100%;overflow:auto;padding:18px}.sheet-panel{left:0;right:0;bottom:0;border-radius:18px 18px 0 0;padding:18px 18px calc(18px + var(--safe-b))}.empty{padding:48px 0;text-align:center;color:var(--ink-soft)}.loading{padding:28px 0;text-align:center;color:var(--ink-soft)}.app-toast{position:fixed;left:50%;bottom:18%;transform:translate(-50%);background:#2b2418e6;color:#fffaf1;padding:10px 16px;border-radius:999px;font-size:13px;z-index:99;max-width:80vw}.back-row{display:flex;align-items:center;gap:8px;margin-bottom:16px;color:var(--ink-soft)}.setting-row{display:flex;align-items:center;justify-content:space-between;margin:14px 0}.theme-picks{display:flex;gap:8px}.theme-pick{width:42px;height:42px;border-radius:50%;border:2px solid transparent}.theme-pick.paper{background:#f4efe4}.theme-pick.green{background:#cfe3c8}.theme-pick.night{background:#161410}.theme-pick.active{border-color:var(--cinnabar)}.progress-text{font-size:12px;color:var(--ink-soft)}.shelf-item{display:grid;grid-template-columns:64px 1fr auto;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}.shelf-item .cover{width:64px;aspect-ratio:3 / 4}
