:root {
  --bg: #090b10; --panel: #141820; --panel-2: #181e27;
  --text: #f2f4f8; --muted: #939eaf; --line: rgba(175,198,221,.12);
}
html { scrollbar-gutter: stable; }
body {
  background: radial-gradient(ellipse at 88% 0%,rgba(0,240,255,.07),transparent 40%),
    radial-gradient(ellipse at 8% 28%,rgba(153,84,255,.045),transparent 42%),var(--bg);
  background-attachment: fixed;
  font-family: -apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
  -webkit-font-smoothing: antialiased;
}
button,input { font: inherit; }
button,a,input,summary { -webkit-tap-highlight-color: transparent; }
button,a { transition: background .18s ease,color .18s ease,border-color .18s ease,box-shadow .18s ease; }
button:focus-visible,a:focus-visible,[role="button"]:focus-visible,summary:focus-visible { outline: 2px solid var(--cyan); outline-offset: 4px; }
.site-header {
  width: min(1280px,calc(100% - 32px)); margin: 16px auto 0; padding: 14px 24px;
  min-height: 74px; top: 12px; border: 1px solid var(--line); border-radius: 24px;
  background: rgba(20,24,32,.78); backdrop-filter: blur(24px) saturate(150%);
  box-shadow: 0 8px 40px rgba(0,0,0,.12);
}
.brand span { font-size: .83rem; letter-spacing: .12em; }
.brand strong { font-size: .65rem; letter-spacing: .18em; margin-top: 7px; }
.site-nav { padding: 4px; gap: 4px; }
.site-nav a { border: 0; border-radius: 999px; padding: 10px 17px; font-size: .85rem; white-space: nowrap; }
.site-nav a:hover { background: rgba(255,255,255,.045); }
.site-nav a.active { background: rgba(255,255,255,.08); color: #fff; box-shadow: inset 0 0 0 1px rgba(255,255,255,.06); }
.home-shell,.reader-shell { width: min(1100px,calc(100% - 48px)); }
.home-hero { padding-top: 100px; }
.home-hero h1 { font-weight: 700; letter-spacing: -.055em; }
.eyebrow { font-size: .68rem; letter-spacing: .16em; }
.chapter-hero { padding: 70px 0 38px; }
.chapter-hero h1 { font-weight: 700; }
.chapter-card { border-radius: 28px; padding: 30px; border: 1px solid var(--line); background: linear-gradient(150deg,rgba(31,39,51,.8),rgba(19,24,32,.95)); box-shadow: 0 12px 36px rgba(0,0,0,.12); }
.chapter-card.featured { border-top: 1px solid rgba(252,238,10,.3); }
.chapter-card:hover { border-color: rgba(0,240,255,.4); box-shadow: 0 14px 48px rgba(0,240,255,.04); }
.chapter-card h3 { font-size: clamp(1.8rem,3vw,2.6rem); letter-spacing: -.04em; }
.card-meta span { border-radius: 999px; padding: 6px 10px; background: rgba(255,255,255,.025); border-color: var(--line); }
.player-bar { border-radius: 22px; background: rgba(25,32,42,.88); border-color: rgba(173,205,229,.15); backdrop-filter: blur(28px); box-shadow: 0 12px 40px rgba(0,0,0,.18); top: 104px; padding: 17px 22px; }
.speed-control { padding: 3px; border-radius: 999px; background: rgba(0,0,0,.16); }
.speed-control .control-label { margin-left: 10px; }
.speed-control button { min-width: 46px; padding: 9px 11px; border: 0; border-radius: 999px; background: transparent; color: var(--muted); font-size: .82rem; }
.speed-control button.active { color: var(--cyan); background: rgba(0,240,255,.11); box-shadow: inset 0 0 0 1px rgba(0,240,255,.16); }
.repeat-button,.play-actions button { border-radius: 999px; border-color: var(--line); }
.part-nav { gap: 7px; padding: 5px 0 10px; scrollbar-width: thin; scrollbar-color: #364252 transparent; }
.part-nav a { border: 1px solid transparent; border-radius: 999px; background: rgba(255,255,255,.035); padding: 10px 14px; }
.part-nav a:hover { border-color: rgba(0,240,255,.3); background: rgba(0,240,255,.06); }
.line-filters { gap: 4px; }
.line-filters button { border: 0; border-radius: 999px; background: transparent; color: var(--muted); padding: 9px 14px; font-size: .82rem; }
.line-filters button.active { color: #f1f4f7; background: rgba(255,255,255,.09); box-shadow: inset 0 0 0 1px rgba(255,255,255,.04); }
.library-tools { background: rgba(20,25,33,.72); border-radius: 24px; padding: 20px 22px; gap: 24px; }
.search-field input { border-radius: 14px; background: rgba(0,0,0,.18); border: 1px solid var(--line); padding: 13px 16px; }
.search-field input:focus { border-color: rgba(0,240,255,.4); box-shadow: 0 0 0 3px rgba(0,240,255,.04); }
.scene,.scene-lines.standalone,.text-card { border-radius: 24px; overflow: hidden; }
.scene-header,.text-card-header { background: rgba(255,255,255,.025); }
.scene-header { padding: 19px 22px; }
.line { border-left-width: 2px; border-bottom-color: rgba(160,190,210,.075); }
.line.has-audio:hover { background: rgba(0,240,255,.025); border-left-color: rgba(0,240,255,.5); }
.line.playing { background: rgba(0,240,255,.06); border-left-color: var(--cyan); }
.play-button { color: var(--yellow); border: 1px solid rgba(252,238,10,.18); background: rgba(252,238,10,.045); }
.play-button:hover { border-color: rgba(252,238,10,.5); background: rgba(252,238,10,.1); }
.badge { border-radius: 999px; padding: 6px 10px; font-size: .62rem; }
.part-title-row { flex-wrap: wrap; }
.part h2 { font-size: clamp(1.4rem,4vw,2rem); }
.chapter-stats div { border-radius: 18px; }
.to-top { border-radius: 999px; border-color: var(--line); backdrop-filter: blur(16px); }
.loading,.error,.empty-note { border-radius: 20px; }
@media(max-width:760px) {
  .site-header { width: calc(100% - 24px); margin-top: 12px; padding: 18px; border-radius: 22px; gap: 15px; position: relative; top: 0; }
  .site-nav { width: 100%; padding: 0; gap: 3px; }
  .site-nav a { padding: 9px 12px; font-size: .78rem; flex-shrink: 0; }
  .home-shell,.reader-shell { width: calc(100% - 32px); }
  .chapter-hero { padding: 48px 5px 28px; }
  .home-hero { padding: 60px 5px; }
  .library-tools { padding: 18px; gap: 16px; border-radius: 22px; }
  .player-bar { position: static; padding: 18px; border-radius: 22px; gap: 15px; }
  .speed-control { width: fit-content; }
  .chapter-card { border-radius: 24px; }
  .line-filters button { padding: 9px 12px; }
  .scene,.text-card { border-radius: 20px; }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}