:root{
  color-scheme:dark;
  --bg:#080a0f;--panel:#11151d;--panel2:#171c26;--ink:#f6f7fb;--muted:#9da8ba;
  --line:#273041;--accent:#79e7d4;--accent2:#8ca7ff;--danger:#ff8c8c;--paper:#f8f5ee;--paperInk:#20242b;
  --reader-font:19px;--reader-leading:1.72;--reader-width:760px;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--bg);color:var(--ink);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
button,input,select,textarea{font:inherit}
button{touch-action:manipulation}
a{color:inherit}
.sr-shell{min-height:100vh;padding-bottom:calc(92px + env(safe-area-inset-bottom))}
.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:10px;padding:calc(10px + env(safe-area-inset-top)) 14px 10px;background:rgba(8,10,15,.92);backdrop-filter:blur(16px);border-bottom:1px solid rgba(255,255,255,.08)}
.brand{font-weight:850;letter-spacing:-.02em;white-space:nowrap}.brand small{display:block;color:var(--muted);font-size:11px;font-weight:650;letter-spacing:.03em}
.spacer{flex:1}
.iconbtn,.btn{border:1px solid var(--line);background:var(--panel2);color:var(--ink);border-radius:12px;min-height:44px;padding:10px 13px;font-weight:750;cursor:pointer}
.iconbtn{width:44px;padding:0;display:grid;place-items:center}
.btn.primary{background:linear-gradient(135deg,var(--accent),#5bbfd0);border-color:transparent;color:#06110f}
.btn.ghost{background:transparent}
.btn:disabled{opacity:.48;cursor:not-allowed}
.main{max-width:1120px;margin:0 auto;padding:16px}
.hero{display:grid;grid-template-columns:1fr auto;gap:18px;align-items:center;background:linear-gradient(145deg,#141925,#0d121a);border:1px solid var(--line);border-radius:24px;padding:20px;overflow:hidden}
.hero h1{font-size:clamp(28px,7vw,48px);line-height:1;margin:0 0 8px;letter-spacing:-.04em}.hero p{margin:0;color:var(--muted);max-width:650px;line-height:1.5}
.cover-mini{width:110px;aspect-ratio:2/3;border-radius:10px;background:linear-gradient(160deg,#1e2740,#0b0d13 65%);border:1px solid #38445b;display:flex;flex-direction:column;justify-content:flex-end;padding:11px;box-shadow:0 18px 50px rgba(0,0,0,.35)}
.cover-mini b{font-size:14px;line-height:1.05}.cover-mini span{font-size:9px;color:var(--accent);margin-top:7px}
.quickgrid,.bookgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px;margin-top:14px}
.quick,.bookcard{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:16px;min-height:120px}
.quick h3,.bookcard h3{margin:0 0 7px}.quick p,.bookcard p{margin:0;color:var(--muted);line-height:1.45;font-size:14px}
.quick button,.bookcard button{margin-top:12px;width:100%}
.sectionhead{display:flex;align-items:end;gap:10px;margin:28px 2px 10px}.sectionhead h2{margin:0}.sectionhead p{margin:0;color:var(--muted);font-size:13px}
.tabs{display:flex;gap:8px;overflow:auto;padding:4px 0 10px;scrollbar-width:none}.tabs::-webkit-scrollbar{display:none}
.tab{flex:none;border:1px solid var(--line);background:transparent;color:var(--muted);border-radius:999px;padding:9px 13px;font-weight:700}.tab.on{background:var(--panel2);color:var(--ink);border-color:#4a5872}
.progressbar{height:5px;background:#252d3c;border-radius:999px;overflow:hidden;margin:10px 0}.progressbar>i{display:block;height:100%;background:var(--accent);width:0}
.bookmeta{font-size:12px;color:var(--muted)}
.empty{padding:24px;border:1px dashed var(--line);border-radius:18px;color:var(--muted);text-align:center}
.boot{min-height:100vh;display:flex;gap:13px;align-items:center;justify-content:center;color:var(--muted)}.boot strong{color:var(--ink);display:block}.boot span{display:block;font-size:13px;margin-top:3px}.river-mark{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 35% 30%,#a4fff0,#4ba69c 40%,#141a24 75%);color:#06110f;font-weight:950;box-shadow:0 0 28px rgba(121,231,212,.25)}
.reader-shell{min-height:100vh;background:var(--paper);color:var(--paperInk);padding-bottom:calc(100px + env(safe-area-inset-bottom))}
.reader-top{position:sticky;top:0;z-index:25;display:flex;align-items:center;gap:8px;padding:calc(8px + env(safe-area-inset-top)) 10px 8px;background:color-mix(in srgb,var(--paper) 91%,transparent);backdrop-filter:blur(16px);border-bottom:1px solid rgba(20,25,35,.11)}
.reader-title{min-width:0;flex:1}.reader-title b,.reader-title span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.reader-title span{font-size:11px;opacity:.62;margin-top:2px}
.reader-top .iconbtn{background:rgba(255,255,255,.55);border-color:rgba(20,25,35,.13);color:var(--paperInk)}
.reading-progress{height:3px;position:sticky;top:calc(61px + env(safe-area-inset-top));z-index:24;background:rgba(20,25,35,.1)}.reading-progress i{display:block;height:100%;width:0;background:#256a61}
.reader{max-width:var(--reader-width);margin:0 auto;padding:34px 22px 90px;font-family:Georgia,"Times New Roman",serif;font-size:var(--reader-font);line-height:var(--reader-leading)}
.reader h1{font-size:clamp(29px,8vw,48px);line-height:1.05;margin:10vh 0 10px;letter-spacing:-.035em}.reader .author{font-family:Inter,ui-sans-serif,sans-serif;font-size:14px;opacity:.65;margin-bottom:20vh}
.reader h2{font-family:Inter,ui-sans-serif,sans-serif;font-size:clamp(24px,7vw,36px);line-height:1.12;margin:5vh 0 28px;letter-spacing:-.03em}
.reader p{margin:0 0 1.05em;scroll-margin-top:110px;border-radius:7px;transition:background .18s,box-shadow .18s}
.reader p[data-current="1"]{background:rgba(31,117,104,.08);box-shadow:0 0 0 8px rgba(31,117,104,.08)}
.word{border-radius:4px;padding:0 .02em}.word.spoken{background:#bdf3e7;box-shadow:0 0 0 2px #bdf3e7}
.reader-actions{position:fixed;left:50%;bottom:calc(12px + env(safe-area-inset-bottom));transform:translateX(-50%);z-index:35;display:flex;align-items:center;gap:7px;width:min(96vw,720px);padding:8px;background:rgba(13,18,24,.94);color:#fff;border:1px solid rgba(255,255,255,.13);border-radius:18px;box-shadow:0 16px 45px rgba(0,0,0,.28);backdrop-filter:blur(16px)}
.reader-actions button,.reader-actions select{min-height:46px;border:0;border-radius:12px;background:#202836;color:white;font-weight:750}
.reader-actions button{min-width:46px;padding:0 12px}.reader-actions .play{background:var(--accent);color:#07110f;flex:1}.reader-actions select{max-width:170px;padding:0 9px}
.listenstatus{position:fixed;left:50%;bottom:calc(78px + env(safe-area-inset-bottom));transform:translateX(-50%);z-index:34;font:600 12px/1.2 Inter,sans-serif;color:white;background:rgba(9,12,17,.8);padding:7px 10px;border-radius:999px;opacity:0;pointer-events:none;transition:opacity .2s}.listenstatus.on{opacity:1}
.drawer{position:fixed;inset:0;z-index:50;background:rgba(0,0,0,.44);display:flex;justify-content:flex-end;opacity:0;pointer-events:none;transition:opacity .18s}.drawer.open{opacity:1;pointer-events:auto}
.drawerpanel{width:min(92vw,390px);height:100%;background:#10141c;color:white;padding:calc(18px + env(safe-area-inset-top)) 16px calc(20px + env(safe-area-inset-bottom));overflow:auto;transform:translateX(100%);transition:transform .2s}.drawer.open .drawerpanel{transform:translateX(0)}
.drawer h3{margin:8px 0 14px}.chapterbtn{display:block;width:100%;text-align:left;background:transparent;color:#cad3e3;border:0;border-bottom:1px solid #222a38;padding:12px 4px}.chapterbtn.on{color:var(--accent);font-weight:800}
.setting{margin:16px 0}.setting label{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:#b4bfd0;margin-bottom:8px}.setting input[type=range],.setting select{width:100%}
.themechips{display:flex;gap:8px}.themechip{flex:1;min-height:40px;border-radius:10px;border:1px solid #30394a;background:#171d28;color:white}.themechip[data-theme=sepia]{background:#f0e7d3;color:#2d2a25}.themechip[data-theme=light]{background:white;color:#222}.themechip.on{outline:2px solid var(--accent)}
.reader-shell[data-theme=dark]{--paper:#0d1118;--paperInk:#e9edf5}.reader-shell[data-theme=sepia]{--paper:#f0e7d3;--paperInk:#332e28}
.write-shell{max-width:1000px;margin:0 auto;padding:16px}.write-grid{display:grid;grid-template-columns:240px 1fr;gap:12px}.chapters,.editorcard{border:1px solid var(--line);background:var(--panel);border-radius:18px;padding:12px}.chapter-row{display:flex;gap:6px;margin:5px 0}.chapter-row button{flex:1;text-align:left;background:transparent;border:0;color:#c9d2e2;padding:9px;border-radius:9px}.chapter-row button.on{background:#222a38;color:white}.editorcard input,.editorcard textarea{width:100%;border:1px solid var(--line);background:#0b0e14;color:white;border-radius:12px;padding:12px}.editorcard textarea{min-height:56vh;resize:vertical;line-height:1.6}.savehint{font-size:12px;color:var(--muted);margin-top:7px}
.modal{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:70;display:none;place-items:end center;padding:12px}.modal.open{display:grid}.modalcard{width:min(100%,560px);background:#111722;border:1px solid #2a3445;border-radius:22px;padding:18px;max-height:86vh;overflow:auto}.modalcard h2{margin:0 0 6px}.modalcard p{color:var(--muted);line-height:1.45}.modalcard .btn{width:100%;margin-top:8px}
.importstatus{font-size:13px;color:var(--muted);min-height:22px;margin-top:8px}
@media(max-width:680px){
  .main{padding:12px}.hero{grid-template-columns:1fr;padding:17px}.cover-mini{display:none}
  .quickgrid,.bookgrid{grid-template-columns:1fr 1fr}.quick,.bookcard{padding:13px}.quick{min-height:105px}
  .reader{padding:24px 18px 100px;font-size:var(--reader-font);line-height:var(--reader-leading)}
  .reader-actions{bottom:calc(6px + env(safe-area-inset-bottom));width:calc(100vw - 12px);border-radius:16px}.reader-actions select{max-width:124px}
  .write-grid{grid-template-columns:1fr}.chapters{max-height:180px;overflow:auto}
}
@media(max-width:430px){.quickgrid,.bookgrid{grid-template-columns:1fr}.topbar .brand small{display:none}}

.topbar:has(#wp){flex-wrap:wrap}
.topbar:has(#wp) .spacer{flex:1 1 12px}
.topbar:has(#wp) #wp,.topbar:has(#wp) #wu,.topbar:has(#wp) #wr{white-space:nowrap}
@media(max-width:620px){
  .topbar:has(#wp){align-items:flex-start}
  .topbar:has(#wp) .brand{flex:1 1 150px}
  .topbar:has(#wp) .spacer{display:none}
  .topbar:has(#wp) #wp,.topbar:has(#wp) #wu,.topbar:has(#wp) #wr{min-height:38px;padding:7px 9px;font-size:11px;flex:1 1 auto}
}

@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
/* Launch commerce */
.sr-launch-ladder{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}.sr-launch-ladder b{width:100%;font-size:13px}.sr-launch-ladder span{padding:7px 10px;border:1px solid rgba(156,126,230,.28);border-radius:999px;font-size:12px;background:rgba(112,77,170,.09)}.sr-support-pop{position:fixed;inset:0;z-index:9999;display:grid;place-items:end center;padding:18px;background:rgba(5,4,9,.58);backdrop-filter:blur(8px)}.sr-support-pop-card{position:relative;width:min(560px,100%);padding:22px;border:1px solid rgba(169,138,236,.3);border-radius:22px;background:#161020;box-shadow:0 24px 80px rgba(0,0,0,.45)}.sr-support-pop-card h3{margin:8px 0}.sr-support-pop-card p{color:#c9bfd5;line-height:1.55}.sr-support-x{position:absolute;right:12px;top:10px;border:0;background:transparent;color:#fff;font-size:28px}.sr-support-amounts{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0 8px}