/* Reader dark mode — layered on top of fantasy/neutral appearance. */

html[data-color-scheme="dark"] {
    color-scheme: dark;
    --paper: #10151a;
    --surface: #1a2128;
    --surface-strong: #232b33;
    --surface-sidebar: #182027;
    --surface-warm: #1c242c;
    --surface-warm-strong: #24303a;
    --surface-card: rgba(26, 33, 40, 0.9);
    --surface-card-hover: rgba(32, 40, 48, 0.96);
    --reader-panel: rgba(20, 26, 32, 0.94);
    --reader-ink: #ece7de;
    --surface-note: rgba(36, 44, 52, 0.9);
    --ink: #ece7de;
    --muted: #9aa3ad;
    --line: #33404c;
    --green: #5fb89a;
    --wine: #d46a8c;
    --gold: #e0b04a;
    --blue: #7eb0d4;
    --plum: #c4a0c2;
    --shadow: 0 18px 48px rgba(0, 0, 0, 0.42);
}

html[data-color-scheme="dark"] body.theme-neutral {
    --wine: #8aa4c8;
    --gold: #7eb0d4;
    --blue: #7eb0d4;
    --plum: #8aa4c8;
}

html[data-color-scheme="dark"] body.chaptertrail-site {
    color: var(--ink);
    background-color: var(--paper);
    background-image:
        linear-gradient(180deg, rgba(10, 14, 18, 0.72), rgba(10, 14, 18, 0.8)),
        var(--chaptertrail-site-bg, none);
}

html[data-color-scheme="dark"] body.chaptertrail-site .site-header,
html[data-color-scheme="dark"] body.chaptertrail-site.theme-neutral .site-header,
html[data-color-scheme="dark"] body.chaptertrail-site.theme-fantasy .site-header {
    background: rgba(18, 24, 30, 0.88);
    border-bottom-color: rgba(255, 255, 255, 0.08);
}

html[data-color-scheme="dark"] .chapter-read-progress__track {
    background: rgba(255, 255, 255, 0.16);
}

html[data-color-scheme="dark"] .chapter-read-progress__fill {
    background: var(--green);
}

html[data-color-scheme="dark"] .chapter-read-progress__track--time {
    background: rgba(224, 176, 74, 0.22);
}

html[data-color-scheme="dark"] body.chaptertrail-site .site-main,
html[data-color-scheme="dark"] body.chaptertrail-site.theme-neutral .site-main,
html[data-color-scheme="dark"] body.chaptertrail-site.theme-fantasy .site-main {
    border-color: rgba(255, 255, 255, 0.08);
    background: linear-gradient(180deg, rgba(26, 33, 40, 0.88) 0%, rgba(18, 24, 30, 0.78) 100%);
    box-shadow:
        0 22px 54px rgba(0, 0, 0, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

html[data-color-scheme="dark"] body.chaptertrail-site .site-main:has(.chaptertrail-landing-shell),
html[data-color-scheme="dark"] body.chaptertrail-site.theme-neutral .site-main:has(.chaptertrail-landing-shell),
html[data-color-scheme="dark"] body.chaptertrail-site.theme-fantasy .site-main:has(.chaptertrail-landing-shell) {
    background: transparent;
    box-shadow: none;
}

html[data-color-scheme="dark"] .chaptertrail-landing,
html[data-color-scheme="dark"] body.chaptertrail-site.theme-neutral .site-main .chaptertrail-landing-shell .chaptertrail-landing,
html[data-color-scheme="dark"] body.chaptertrail-site.theme-neutral .site-main .chaptertrail-landing {
    border-color: rgba(255, 255, 255, 0.08);
    background: linear-gradient(180deg, rgba(26, 33, 40, 0.88) 0%, rgba(18, 24, 30, 0.78) 100%);
    box-shadow:
        0 22px 54px rgba(0, 0, 0, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

html[data-color-scheme="dark"] .site-nav-dropdown,
html[data-color-scheme="dark"] .site-search,
html[data-color-scheme="dark"] .site-menu-toggle,
html[data-color-scheme="dark"] .site-account-trigger,
html[data-color-scheme="dark"] .site-login-link,
html[data-color-scheme="dark"] .site-color-scheme-toggle {
    border-color: rgba(255, 255, 255, 0.12);
    background: rgba(22, 28, 34, 0.94);
    color: var(--ink);
}

html[data-color-scheme="dark"] .site-search input {
    color: var(--ink);
}

html[data-color-scheme="dark"] .button--secondary,
html[data-color-scheme="dark"] .account-card,
html[data-color-scheme="dark"] .account-settings-card,
html[data-color-scheme="dark"] .profile-panel,
html[data-color-scheme="dark"] .profile-sidebar,
html[data-color-scheme="dark"] .account-sidebar,
html[data-color-scheme="dark"] .fiction-chapter-panel,
html[data-color-scheme="dark"] .fiction-rating-panel,
html[data-color-scheme="dark"] .fiction-reviews-panel,
html[data-color-scheme="dark"] .fiction-detail-hero-shell--has-banner,
html[data-color-scheme="dark"] .chapter-reader-page,
html[data-color-scheme="dark"] .chapter-reader-paywall,
html[data-color-scheme="dark"] .browse-list,
html[data-color-scheme="dark"] .forum-table-wrap,
html[data-color-scheme="dark"] .knowledge-base__link,
html[data-color-scheme="dark"] .reader-plan-card,
html[data-color-scheme="dark"] .changelog-entry,
html[data-color-scheme="dark"] .login-modal__panel,
html[data-color-scheme="dark"] .register-modal__panel {
    border-color: var(--line);
    background: var(--surface-card);
    color: var(--ink);
}

html[data-color-scheme="dark"] h1,
html[data-color-scheme="dark"] h2,
html[data-color-scheme="dark"] h3,
html[data-color-scheme="dark"] .fiction-detail-copy h1,
html[data-color-scheme="dark"] .chapter-reader-header h1,
html[data-color-scheme="dark"] .discovery-author-page h1,
html[data-color-scheme="dark"] .browse-page-heading h1,
html[data-color-scheme="dark"] .chaptertrail-section-heading h1,
html[data-color-scheme="dark"] .chaptertrail-section-heading h2 {
    color: var(--ink);
}

html[data-color-scheme="dark"] .fiction-subtitle,
html[data-color-scheme="dark"] .fiction-author,
html[data-color-scheme="dark"] .fiction-synopsis,
html[data-color-scheme="dark"] .fiction-cover-scores__label,
html[data-color-scheme="dark"] .fiction-cover-scores__meta,
html[data-color-scheme="dark"] .discovery-author-page .lead,
html[data-color-scheme="dark"] .browse-page-heading p {
    color: var(--muted);
}

html[data-color-scheme="dark"] .fiction-cover-scores__label--overall {
    color: var(--ink);
}

html[data-color-scheme="dark"] .fiction-stat-grid dt,
html[data-color-scheme="dark"] .fiction-stat-grid small {
    color: var(--muted);
}

html[data-color-scheme="dark"] .fiction-stat-grid dd {
    color: var(--ink);
}

html[data-color-scheme="dark"] .fiction-stat-grid div {
    background: var(--surface-strong);
}

html[data-color-scheme="dark"] .fiction-stat-grid,
html[data-color-scheme="dark"] .fiction-chapter-list a,
html[data-color-scheme="dark"] .fiction-tags span,
html[data-color-scheme="dark"] .fiction-row,
html[data-color-scheme="dark"] .home-shelf-card {
    border-color: var(--line);
    background: rgba(255, 255, 255, 0.04);
    color: var(--ink);
}

html[data-color-scheme="dark"] .home-shelf-card__copy,
html[data-color-scheme="dark"] .profile-fiction-copy,
html[data-color-scheme="dark"] .author-work-card__copy,
html[data-color-scheme="dark"] .account-library-copy {
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: rgba(16, 22, 28, 0.62);
    box-shadow:
        0 20px 44px rgba(0, 0, 0, 0.36),
        inset 0 1px 0 rgba(255, 255, 255, 0.12);
    backdrop-filter: blur(18px) saturate(150%);
    -webkit-backdrop-filter: blur(18px) saturate(150%);
    color: var(--ink);
}

html[data-color-scheme="dark"] .home-shelf-card__copy h3,
html[data-color-scheme="dark"] .home-shelf-card__copy h3 a,
html[data-color-scheme="dark"] .account-library-copy h2 a,
html[data-color-scheme="dark"] .profile-fiction-copy a,
html[data-color-scheme="dark"] .author-work-card__copy a {
    color: var(--ink);
}

html[data-color-scheme="dark"] .home-shelf-card__copy p,
html[data-color-scheme="dark"] .account-library-copy p,
html[data-color-scheme="dark"] .account-library-copy small {
    color: var(--muted);
}

html[data-color-scheme="dark"] .fiction-chapter-list small,
html[data-color-scheme="dark"] .fiction-empty-chapter,
html[data-color-scheme="dark"] .author-work-card__meta {
    color: var(--muted);
}

html[data-color-scheme="dark"] input,
html[data-color-scheme="dark"] textarea,
html[data-color-scheme="dark"] select {
    color: var(--ink);
    background: var(--surface-strong);
    border-color: var(--line);
}

html[data-color-scheme="dark"] .login-modal,
html[data-color-scheme="dark"] .register-modal {
    background: rgba(8, 12, 16, 0.72);
}

html[data-color-scheme="dark"] .chapter-reader-action {
    border-color: rgba(255, 255, 255, 0.12);
    background: rgba(255, 255, 255, 0.04);
    color: var(--muted);
}

html[data-color-scheme="dark"] .chapter-reader-action:hover,
html[data-color-scheme="dark"] .chapter-reader-action:focus-visible {
    border-color: color-mix(in srgb, var(--wine) 40%, transparent);
    background: color-mix(in srgb, var(--wine) 14%, transparent);
    color: var(--wine);
}

html[data-color-scheme="dark"] .chapter-reader-action--danger {
    border-color: color-mix(in srgb, #f0a0b0 28%, transparent);
    color: #f0a0b0;
}

html[data-color-scheme="dark"] .chapter-reader-action--danger:hover,
html[data-color-scheme="dark"] .chapter-reader-action--danger:focus-visible {
    border-color: #f0a0b0;
    background: color-mix(in srgb, #f0a0b0 12%, transparent);
    color: #f0a0b0;
}

html[data-color-scheme="dark"] .chapter-reader-listen__panel,
html[data-color-scheme="dark"] .chapter-reader-listen__tab {
    border-color: color-mix(in srgb, var(--gold) 34%, transparent);
    background: color-mix(in srgb, var(--gold) 12%, var(--surface-strong));
}

html[data-color-scheme="dark"] .chapter-reader-listen__stop {
    background: rgba(255, 255, 255, 0.08);
    color: var(--ink);
}

html[data-color-scheme="dark"] .chapter-reader-listen__voice select {
    background: var(--surface-strong);
    border-color: rgba(255, 255, 255, 0.12);
    color: var(--ink);
}

html[data-color-scheme="dark"] .chapter-reader-body [data-listening="true"] {
    background: color-mix(in srgb, var(--gold) 18%, transparent);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--gold) 18%, transparent);
}

html[data-color-scheme="dark"] .chapter-position-notice {
    border-color: color-mix(in srgb, var(--gold) 36%, transparent);
    background: color-mix(in srgb, var(--gold) 12%, var(--surface-strong));
}

html[data-color-scheme="dark"] .chapter-position-notice--saved {
    border-color: color-mix(in srgb, var(--green) 32%, transparent);
    background: color-mix(in srgb, var(--green) 12%, var(--surface-strong));
}