/* Reader chapter preferences / comfort layer. */
.reading-page{position:relative}
.reading-page .reader-progress{position:sticky;top:0;z-index:120;display:flex;align-items:center;gap:8px;height:5px;background:transparent;pointer-events:none}
.reading-page .reader-progress__track{height:3px;flex:1;background:rgba(120,145,170,.16);border-radius:999px;overflow:hidden}
.reading-page .reader-progress__track span{display:block;height:100%;width:0;background:var(--ck-blue);border-radius:999px;transition:width .12s linear}
.reading-page .reader-progress>span:last-child{font-size:9px;color:var(--ck-muted);min-width:28px;text-align:right;opacity:.7}
.reading-page .reader-preference-panel{position:absolute;right:0;top:calc(100% + 8px);z-index:100;width:min(360px,calc(100vw - 28px));padding:15px;max-height:min(78vh,560px);overflow:auto;overscroll-behavior:contain;border:1px solid var(--ck-line);background:var(--ck-surface);color:var(--ck-text);border-radius:18px;box-shadow:0 24px 60px rgba(20,45,75,.2);backdrop-filter:blur(12px)}
.reading-page .reader-preference-panel__head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:12px}
.reading-page .reader-preference-panel__head strong{display:block;font-size:15px}
.reading-page .reader-preference-panel__head span{display:block;margin-top:3px;font-size:10px;color:var(--ck-muted);line-height:1.45}
.reading-page .reader-icon-button{width:30px;height:30px;border:1px solid var(--ck-line);border-radius:9px;background:transparent;color:inherit;font-size:20px;line-height:1;cursor:pointer}
.reading-page .reader-preset-row{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid var(--ck-line)}
.reading-page .reader-preset-label{font-size:10px;font-weight:800;color:var(--ck-muted);margin-right:2px}
.reading-page .btn-xs{min-height:30px!important;padding:5px 8px!important;font-size:10px!important;border-radius:9px!important}
.reading-page .reader-preference-panel__grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.reading-page .reader-preference-panel label{display:grid;gap:6px;font-size:11px;font-weight:800;min-width:0}
.reading-page .reader-preference-panel select,.reading-page .reader-preference-panel input[type=range]{width:100%;min-width:0}
.reading-page .reader-range-wrap{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center}
.reading-page .reader-range-wrap output{min-width:48px;text-align:right;font-size:10px;color:var(--ck-muted);font-variant-numeric:tabular-nums}
.reading-page .reader-preference-panel .pref-check{grid-column:1/-1;display:flex;align-items:center;gap:7px}
.reading-page .reader-utility-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:12px;padding-top:12px;border-top:1px solid var(--ck-line)}
.reading-page .reader-utility-grid .btn{min-width:0;font-size:10px!important}
.reading-page .reader-preference-panel__footer{display:flex!important;align-items:flex-end;justify-content:space-between;gap:12px;margin-top:12px;padding-top:12px;border-top:1px solid var(--ck-line)}
.reading-page .reader-preference-panel__footer>div:first-child{min-width:0}
.reading-page .reader-preference-panel__footer [data-reader-sync-status]{display:block;font-size:10px;color:var(--ck-muted);line-height:1.4}
.reading-page .reader-preference-panel__footer [data-reader-sync-status][data-state="dirty"]{color:#a55b00}
.reading-page .reader-preference-panel__footer [data-reader-sync-status][data-state="saving"]{color:var(--ck-blue)}
.reading-page .reader-preference-panel__footer [data-reader-sync-status][data-state="error"]{color:#b42318}
.reading-page .reader-preference-panel__footer [data-reader-saved-at]{display:block;margin-top:2px;font-size:9px;color:var(--ck-muted)}
.reading-page .reader-save-actions{display:flex;gap:7px;flex-shrink:0}
.reading-page .reader-save-actions .btn{white-space:nowrap}
.reading-page .reader-body[data-reader-theme="dark"]{background:#171d26;color:#e9eef5}
.reading-page .reader-body[data-reader-theme="dark"] .reader-toolbar{background:#111822;color:#b8c6d6}
.reading-page .reader-body[data-reader-theme="dark"] .reader-prose{color:#e9eef5}
.reading-page .reader-body[data-reader-theme="sepia"]{background:#f6eedf;color:#4b4033}
.reading-page .reader-body[data-reader-theme="night"]{background:#101614;color:#dae7df}
.reading-page .reader-body[data-reader-theme="night"] .reader-toolbar{background:#0c1210;color:#b8c9bf}
.reading-page .reader-body[data-reader-width="narrow"] .reader-prose{max-width:720px;margin:auto}
.reading-page .reader-body[data-reader-width="comfortable"] .reader-prose{max-width:860px;margin:auto}
.reading-page .reader-body[data-reader-width="wide"] .reader-prose{max-width:1040px;margin:auto}
.reading-page .reader-prose p{max-width:72ch}
.reading-page .reader-focus-mode .reader-title,.reading-page .reader-focus-mode .reader-topline,.reading-page .reader-focus-mode .reader-pagination{opacity:.18;transition:opacity .2s ease}
.reading-page .reader-focus-mode .reader-topline:hover,.reading-page .reader-focus-mode .reader-pagination:hover,.reading-page .reader-focus-mode .reader-title:hover{opacity:1}
.reading-page .reader-focus-mode .reader-body{box-shadow:0 14px 50px rgba(20,45,75,.08)}
.reading-page [data-reader-scroll-top]{opacity:.82}
.reading-page [data-reader-scroll-top].is-visible{border-color:#bcd9fb}
.reading-page .reader-toolbar-actions{position:relative}
@media(max-width:680px){
  .reading-page .reader-preference-panel{
    right:0;
    top:calc(100% + 6px);
    width:min(320px,calc(100vw - 20px));
    max-height:min(72vh,500px);
    padding:11px;
    border-radius:15px;
    box-shadow:0 16px 38px rgba(20,45,75,.18);
  }
  .reading-page .reader-preference-panel__head{gap:8px;margin-bottom:8px}
  .reading-page .reader-preference-panel__head strong{font-size:13px}
  .reading-page .reader-preference-panel__head span{font-size:9px;line-height:1.35}
  .reading-page .reader-preset-row{gap:5px;margin-bottom:9px;padding-bottom:9px;overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}
  .reading-page .reader-preset-row::-webkit-scrollbar{display:none}
  .reading-page .reader-preset-label{font-size:9px;flex:0 0 auto}
  .reading-page .btn-xs{min-height:28px!important;padding:4px 7px!important;font-size:9px!important;flex:0 0 auto}
  .reading-page .reader-preference-panel__grid{grid-template-columns:1fr 1fr;gap:8px}
  .reading-page .reader-preference-panel label{font-size:10px;gap:4px}
  .reading-page .reader-preference-panel .pref-check{grid-column:1/-1}
  .reading-page .reader-utility-grid{grid-template-columns:1fr 1fr 1fr;gap:5px;margin-top:9px;padding-top:9px}
  .reading-page .reader-utility-grid .btn{font-size:9px!important;padding-inline:6px!important;min-height:32px!important}
  .reading-page .reader-preference-panel__footer{display:flex!important;align-items:stretch;flex-direction:column;gap:8px;margin-top:9px;padding-top:9px}
  .reading-page .reader-save-actions{width:100%;gap:5px}
  .reading-page .reader-save-actions .btn{flex:1;min-height:34px!important;font-size:9px!important;padding-inline:7px!important}
  .reading-page .reader-preference-panel__footer [data-reader-sync-status]{font-size:9px}
  .reading-page .reader-preference-panel__footer [data-reader-saved-at]{font-size:8px}
}
@media(prefers-reduced-motion:reduce){
  .reading-page .reader-preference-panel,.reading-page .reader-focus-mode .reader-title,.reading-page .reader-focus-mode .reader-topline,.reading-page .reader-focus-mode .reader-pagination{transition:none}
}


/* V6 reader preference hardening: page reader theme must win over global site theme. */
.reading-page .reader-body[data-reader-theme="paper"]{background:#fff!important;color:#243b57!important}
.reading-page .reader-body[data-reader-theme="paper"] .reader-toolbar{background:#fff!important;color:#6b7b91!important}
.reading-page .reader-body[data-reader-theme="paper"] .reader-prose{background:#fff!important;color:#243b57!important}
.reading-page .reader-body[data-reader-theme="sepia"]{background:#f6eedf!important;color:#4b4033!important}
.reading-page .reader-body[data-reader-theme="sepia"] .reader-toolbar{background:#efe3cf!important;color:#725f4b!important}
.reading-page .reader-body[data-reader-theme="sepia"] .reader-prose{background:#f6eedf!important;color:#4b4033!important}
.reading-page .reader-body[data-reader-theme="sepia"] .reader-prose p,
.reading-page .reader-body[data-reader-theme="sepia"] .reader-prose li,
.reading-page .reader-body[data-reader-theme="sepia"] .reader-prose blockquote,
.reading-page .reader-body[data-reader-theme="sepia"] .reader-prose h1,
.reading-page .reader-body[data-reader-theme="sepia"] .reader-prose h2,
.reading-page .reader-body[data-reader-theme="sepia"] .reader-prose h3{color:#4b4033!important}
.reading-page .reader-body[data-reader-theme="dark"]{background:#171d26!important;color:#e9eef5!important}
.reading-page .reader-body[data-reader-theme="dark"] .reader-toolbar{background:#111822!important;color:#b8c6d6!important}
.reading-page .reader-body[data-reader-theme="dark"] .reader-prose,
.reading-page .reader-body[data-reader-theme="dark"] .reader-prose p,
.reading-page .reader-body[data-reader-theme="dark"] .reader-prose li,
.reading-page .reader-body[data-reader-theme="dark"] .reader-prose blockquote,
.reading-page .reader-body[data-reader-theme="dark"] .reader-prose h1,
.reading-page .reader-body[data-reader-theme="dark"] .reader-prose h2,
.reading-page .reader-body[data-reader-theme="dark"] .reader-prose h3{background:#171d26!important;color:#e9eef5!important}
.reading-page .reader-body[data-reader-theme="night"]{background:#101614!important;color:#dae7df!important}
.reading-page .reader-body[data-reader-theme="night"] .reader-toolbar{background:#0c1210!important;color:#b8c9bf!important}
.reading-page .reader-body[data-reader-theme="night"] .reader-prose,
.reading-page .reader-body[data-reader-theme="night"] .reader-prose p,
.reading-page .reader-body[data-reader-theme="night"] .reader-prose li,
.reading-page .reader-body[data-reader-theme="night"] .reader-prose blockquote,
.reading-page .reader-body[data-reader-theme="night"] .reader-prose h1,
.reading-page .reader-body[data-reader-theme="night"] .reader-prose h2,
.reading-page .reader-body[data-reader-theme="night"] .reader-prose h3{background:#101614!important;color:#dae7df!important}
.reading-page .reader-prose{font-size:var(--reader-font-size,18px)!important;line-height:var(--reader-line-height,1.9)!important}
.reading-page .reader-prose p,
.reading-page .reader-prose li,
.reading-page .reader-prose blockquote{line-height:inherit!important}
.reading-page .reader-preference-panel[hidden]{display:none!important}

@media(max-width:680px){
  .reading-page .reader-preference-panel{
    position:fixed;
    left:10px;right:10px;bottom:10px;top:auto;
    width:auto;max-width:none;
    max-height:min(74vh,520px);
    padding:12px;
    border-radius:16px;
  }
  .reading-page .reader-preference-panel__grid{grid-template-columns:1fr 1fr;gap:9px}
  .reading-page .reader-utility-grid{grid-template-columns:1fr 1fr;gap:6px}
  .reading-page .reader-utility-grid [data-reader-reset]{grid-column:1/-1}
  .reading-page .reader-preference-panel__footer{gap:7px}
  .reading-page .reader-save-actions{display:grid;grid-template-columns:1fr 1.35fr;width:100%}
  .reading-page .reader-save-actions .btn{min-height:38px!important;font-size:10px!important}
}

/* V7 reader preferences: mobile panel follows the reader toolbar instead of the viewport. */
.reading-page .reader-preference-panel__footer>div:first-child{
  display:flex!important;
  align-items:center;
  gap:8px;
  flex:1 1 auto;
  min-width:0;
  white-space:nowrap;
  overflow:hidden;
}
.reading-page .reader-preference-panel__footer [data-reader-sync-status]{
  display:inline-block!important;
  flex:0 1 auto;
  min-width:0;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.reading-page .reader-preference-panel__footer [data-reader-saved-at]{
  display:inline-block!important;
  flex:0 0 auto;
  margin-top:0!important;
  white-space:nowrap;
}

@media(max-width:680px){
  .reading-page .reader-preference-panel{
    position:absolute!important;
    left:auto!important;
    right:0!important;
    top:calc(100% + 6px)!important;
    bottom:auto!important;
    width:min(330px,calc(100vw - 18px))!important;
    max-width:calc(100vw - 18px)!important;
    max-height:min(72vh,520px)!important;
    overflow:auto!important;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior:contain;
  }
  .reading-page .reader-preference-panel__footer>div:first-child{
    display:flex!important;
    align-items:center!important;
    gap:6px!important;
    white-space:normal!important;
    overflow:visible!important;
  }
  .reading-page .reader-preference-panel__footer [data-reader-sync-status]{
    font-size:9px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .reading-page .reader-preference-panel__footer [data-reader-saved-at]{
    font-size:8px!important;
    white-space:nowrap!important;
  }
}


/* ================================================================
   V8 — Reader controls redesign: clean mobile toolbar + real focus
   ================================================================ */
.reading-page .reader-toolbar{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:16px!important;
  min-width:0!important;
  overflow:visible!important;
}
.reading-page .reader-toolbar-label{display:grid;gap:2px;min-width:0}
.reading-page .reader-toolbar-kicker{font-size:9px;font-weight:900;letter-spacing:.14em;text-transform:uppercase;color:var(--ck-muted)}
.reading-page .reader-toolbar-label>[data-reader-mode-label]{font-size:12px;font-weight:750;color:var(--ck-text)}
.reading-page .reader-toolbar-actions{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:7px!important;min-width:0!important;flex:0 0 auto!important;position:relative!important}
.reading-page .reader-action{min-height:34px!important;padding:0 11px!important;border-radius:10px!important;font-size:10px!important;font-weight:850!important;white-space:nowrap!important}
.reading-page .reader-action[aria-pressed="true"]{background:#edf5ff!important;border-color:#bcd9fb!important;color:#1f73bd!important}
.reading-page .reader-translation-tools{display:contents}
.reading-page .reader-preference-panel{z-index:80!important;overflow:auto!important;-webkit-overflow-scrolling:touch!important}
.reading-page .reader-focus-exit{display:none;position:fixed;right:14px;top:calc(74px + env(safe-area-inset-top));z-index:2400;border:1px solid rgba(255,255,255,.35);border-radius:999px;padding:9px 13px;background:rgba(16,31,50,.92);color:#fff;box-shadow:0 12px 28px rgba(12,31,54,.2);font-size:10px;font-weight:850;cursor:pointer;backdrop-filter:blur(10px)}
.reading-page .reader-focus-mode .reader-focus-exit{display:inline-flex;align-items:center;gap:6px}
.reading-page .reader-focus-mode .reader-topline,
.reading-page .reader-focus-mode .reader-title,
.reading-page .reader-focus-mode .reader-toolbar,
.reading-page .reader-focus-mode .reader-pagination{display:none!important}
.reading-page .reader-focus-mode .reader-article{margin-top:0!important}
.reading-page .reader-focus-mode .reader-body{margin-top:0!important;border:0!important;border-radius:22px!important;box-shadow:none!important}
.reading-page .reader-focus-mode .reader-prose{max-width:760px!important;margin:0 auto!important;padding:58px 22px 70px!important}
.reading-page .reader-focus-mode .reader-progress{position:fixed;left:16px;right:16px;top:calc(62px + env(safe-area-inset-top));z-index:2390}

@media(max-width:680px){
  .reading-page .reader-toolbar{display:grid!important;grid-template-columns:1fr!important;gap:9px!important;padding:10px 12px!important}
  .reading-page .reader-toolbar-label{padding-right:2px}
  .reading-page .reader-toolbar-label>[data-reader-mode-label]{font-size:11px!important}
  .reading-page .reader-toolbar-actions{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;width:100%!important;gap:6px!important}
  .reading-page .reader-action{width:100%!important;min-width:0!important;min-height:38px!important;padding:0 5px!important;border-radius:10px!important;font-size:9.5px!important}
  .reading-page .reader-preference-panel{
    position:absolute!important;left:0!important;right:0!important;top:calc(100% + 8px)!important;bottom:auto!important;
    width:auto!important;max-width:none!important;max-height:min(72vh,540px)!important;padding:12px!important;border-radius:15px!important;
    box-shadow:0 18px 42px rgba(15,40,65,.18)!important;
  }
  .reading-page .reader-preference-panel__grid{grid-template-columns:1fr 1fr!important;gap:9px!important}
  .reading-page .reader-utility-grid{grid-template-columns:1fr 1fr!important;gap:6px!important}
  .reading-page .reader-utility-grid [data-reader-reset]{grid-column:1/-1}
  .reading-page .reader-preference-panel__footer{display:grid!important;grid-template-columns:1fr!important;gap:8px!important}
  .reading-page .reader-save-actions{display:grid!important;grid-template-columns:1fr 1.2fr!important;width:100%!important}
  .reading-page .reader-save-actions .btn{min-height:38px!important;font-size:10px!important}
  .reading-page .reader-focus-exit{right:12px;top:calc(70px + env(safe-area-inset-top));font-size:9.5px;padding:8px 11px}
  .reading-page .reader-focus-mode .reader-prose{padding:52px 16px 64px!important}
  .reading-page .reader-focus-mode .reader-progress{left:10px;right:10px;top:calc(62px + env(safe-area-inset-top))}
  .reading-page .reader-body{overflow:visible!important}
}