/*
 * ZBaiArt friendly dark mode.
 * Loaded after route styles and friendly-ui.css. New visitors start here;
 * the shared header can switch back to the existing light presentation.
 */

/* The theme switch remains useful in both modes. */
body.zb-friendly-ui .site-theme-toggle {
    display: inline-flex;
    min-width: 44px;
    min-height: 44px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 12px;
    border: 1px solid var(--zb-line);
    border-radius: var(--zb-radius-sm);
    background: var(--zb-paper);
    box-shadow: var(--zb-shadow-xs);
    color: var(--zb-ink-soft);
    cursor: pointer;
    font-size: 0.78rem;
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
    transition: transform 150ms ease, border-color 150ms ease, background 150ms ease, color 150ms ease, box-shadow 150ms ease;
}

body.zb-friendly-ui .site-theme-toggle:hover {
    border-color: var(--zb-coral-300);
    background: var(--zb-coral-50);
    color: var(--zb-action);
    transform: translateY(-1px);
}

body.zb-friendly-ui .site-theme-toggle-icon {
    display: inline-grid;
    width: 25px;
    height: 25px;
    place-items: center;
    border: 1px solid var(--zb-line);
    border-radius: 8px;
    background: var(--zb-paper-warm);
    color: var(--zb-action);
}

@media (min-width: 1180px) {
    body.zb-friendly-ui .site-theme-toggle {
        width: calc(100% - 4px);
        justify-content: flex-start;
        margin: -8px 2px 0;
        padding-inline: 10px;
    }
}

@media (min-width: 761px) and (max-width: 1179px) {
    body.zb-friendly-ui .site-theme-toggle-label {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
        clip-path: inset(50%);
        white-space: nowrap;
    }
}

@media (max-width: 760px) {
    body.zb-friendly-ui .site-theme-toggle {
        min-height: 44px;
        margin-left: auto;
        padding-inline: 10px;
    }

    body.zb-friendly-ui .site-theme-toggle-label {
        font-size: 0.72rem;
    }
}

@media (max-width: 430px) {
    body.zb-friendly-ui .site-theme-toggle {
        width: 44px;
        padding: 0;
        justify-content: center;
    }

    body.zb-friendly-ui .site-theme-toggle-label {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
    }
}

/* Friendly late-night gallery palette: warm, readable, and deliberately not pure black. */
html[data-theme="dark"] {
    color-scheme: dark;
    background: #11141a;
    --zb-coral-50: #322326;
    --zb-coral-100: #432b2e;
    --zb-coral-200: #633a3c;
    --zb-coral-300: #a65d59;
    --zb-coral-400: #e77f76;
    --zb-coral-500: #ff948a;
    --zb-coral-600: #ffaaa1;
    --zb-coral-700: #ffc1ba;
    --zb-cream: #11141a;
    --zb-paper: #181c24;
    --zb-paper-warm: #202630;
    --zb-sage: #75d3ca;
    --zb-sage-soft: #183531;
    --zb-gold: #f2c66d;
    --zb-gold-soft: #382f1e;
    --zb-ink: #f7f2ee;
    --zb-ink-soft: #d9d2cc;
    --zb-muted: #b7c0cc;
    --zb-quiet: #919cab;
    --zb-line: #343c49;
    --zb-line-strong: #46515f;
    --zb-positive: #75d3a5;
    --zb-danger: #ff9299;
    --zb-info: #8bc5f4;
    --zb-action: #ff948a;
    --zb-action-hover: #ffb0a8;
    --zb-patreon: #e55986;
    --zb-label: #c8a99f;
    --zb-shadow-xs: 0 2px 9px rgba(0, 0, 0, 0.2);
    --zb-shadow-sm: 0 10px 28px rgba(0, 0, 0, 0.24);
    --zb-shadow-md: 0 20px 52px rgba(0, 0, 0, 0.31);
    --zb-shadow-lift: 0 24px 62px rgba(0, 0, 0, 0.38);
    --primary: var(--zb-coral-500);
    --primary-dk: var(--zb-coral-400);
    --primary-lt: var(--zb-coral-100);
    --bg: var(--zb-cream);
    --bg-card: var(--zb-paper);
    --bg-card2: var(--zb-paper-warm);
    --border: var(--zb-line);
    --text: var(--zb-ink);
    --muted: var(--zb-muted);
}

html[data-theme="dark"] body.zb-friendly-ui {
    background:
        radial-gradient(circle at 91% -4%, rgba(255, 148, 138, 0.12), transparent 34rem),
        radial-gradient(circle at 17% 32%, rgba(242, 198, 109, 0.055), transparent 26rem),
        linear-gradient(180deg, #141820 0, #11141a 34rem, #101218 100%);
    color: var(--zb-ink);
}

html[data-theme="dark"] body.zb-friendly-ui::before {
    background-image: radial-gradient(rgba(229, 218, 210, 0.13) 0.7px, transparent 0.7px);
    opacity: 0.13;
}

html[data-theme="dark"] body.zb-friendly-ui ::selection {
    background: #74433f;
    color: #fff8f4;
}

html[data-theme="dark"] body.zb-friendly-ui :where(a) {
    color: var(--zb-coral-600);
}

html[data-theme="dark"] body.zb-friendly-ui :where(a:hover) {
    color: var(--zb-coral-700);
}

html[data-theme="dark"] body.zb-friendly-ui :where(a, button, input, select, textarea, [tabindex]):focus-visible {
    outline-color: rgba(255, 148, 138, 0.64);
}

/* Shared shell and navigation. */
html[data-theme="dark"] body.zb-friendly-ui .navbar {
    border-color: var(--zb-line);
    background: rgba(20, 24, 31, 0.95);
    box-shadow: 10px 0 34px rgba(0, 0, 0, 0.27);
}

html[data-theme="dark"] body.zb-friendly-ui .nav-logo,
html[data-theme="dark"] body.zb-friendly-ui .nav-logo:hover {
    color: var(--zb-ink);
}

html[data-theme="dark"] body.zb-friendly-ui .nav-logo span {
    color: var(--zb-coral-500);
}

html[data-theme="dark"] body.zb-friendly-ui .nav-section-label {
    color: #c6a79e;
}

html[data-theme="dark"] body.zb-friendly-ui .nav-scroll-cue {
    display: none !important;
}

html[data-theme="dark"] body.zb-friendly-ui .nav-links a:not(.btn-patreon):not(.btn-patreon-login) {
    color: #c5cdd7;
}

html[data-theme="dark"] body.zb-friendly-ui .nav-links a:not(.btn-patreon):not(.btn-patreon-login):hover,
html[data-theme="dark"] body.zb-friendly-ui .nav-links a:not(.btn-patreon):not(.btn-patreon-login):focus-visible {
    border-color: #614044;
    background: #282128;
    color: #ffb8b0;
}

html[data-theme="dark"] body.zb-friendly-ui .nav-links a.is-active:not(.btn-patreon):not(.btn-patreon-login),
html[data-theme="dark"] body.zb-friendly-ui .nav-links a[aria-current="page"]:not(.btn-patreon):not(.btn-patreon-login) {
    border-color: #794b4a;
    background: linear-gradient(135deg, #352529, #27222a);
    box-shadow: 0 7px 20px rgba(0, 0, 0, 0.18);
    color: #ffb8b0;
}

html[data-theme="dark"] body.zb-friendly-ui .nav-item-mark,
html[data-theme="dark"] body.zb-friendly-ui .site-theme-toggle-icon {
    border-color: var(--zb-line);
    background: #222832;
    color: #b9c2ce;
}

html[data-theme="dark"] body.zb-friendly-ui .nav-links a:hover .nav-item-mark,
html[data-theme="dark"] body.zb-friendly-ui .nav-links a.is-active .nav-item-mark,
html[data-theme="dark"] body.zb-friendly-ui .nav-links a[aria-current="page"] .nav-item-mark {
    border-color: #ff948a;
    background: #ff948a;
    color: #241719;
}

html[data-theme="dark"] body.zb-friendly-ui .nav-logo::before {
    background-color: #f8f4f1;
}

html[data-theme="dark"] body.zb-friendly-ui .nav-logo::after {
    color: #c5a69d;
}

html[data-theme="dark"] body.zb-friendly-ui .site-theme-toggle {
    border-color: var(--zb-line);
    background: #1d222b;
    box-shadow: var(--zb-shadow-xs);
    color: #d9e0e8;
}

html[data-theme="dark"] body.zb-friendly-ui .site-theme-toggle:hover {
    border-color: #7f4c4a;
    background: #2b2229;
    color: #ffb8b0;
}

/* Inputs, chips, tabs, buttons, and reusable cards. */
html[data-theme="dark"] body.zb-friendly-ui :where(
    .search-input-main, .form-input, .char-modal-input,
    input[type="search"], input[type="text"], input[type="email"], input[type="url"],
    input[type="number"], textarea, select
) {
    border-color: var(--zb-line);
    background: #171b22;
    color: var(--zb-ink);
    box-shadow: var(--zb-shadow-xs);
}

html[data-theme="dark"] body.zb-friendly-ui :where(input, textarea)::placeholder {
    color: #8f9aaa;
    opacity: 1;
}

html[data-theme="dark"] body.zb-friendly-ui :where(
    .top-tab, .subtab, .filter-chip-link, .ci-action, .rc-link, .rp-action,
    .blog-action, .public-feed-action, .official-action, .community-feed-chip,
    .community-action-btn, .zb-watch-btn
) {
    border-color: var(--zb-line);
    background: #1b2028;
    color: #c5cdd7;
}

html[data-theme="dark"] body.zb-friendly-ui :where(
    .top-tab, .subtab, .filter-chip-link, .ci-action, .rc-link, .rp-action,
    .blog-action, .public-feed-action, .official-action, .community-feed-chip
):is(:hover, .active, .is-active) {
    border-color: #80504e;
    background: #39272c;
    color: #ffbeb7;
}

html[data-theme="dark"] body.zb-friendly-ui :where(
    .support-card, .patreon-gate-banner, .character-card, .upcoming-card,
    .myvotes-card, .hof-card, .recap-card, .series-card, .character-index-card,
    .series-index-card, .suggestion-card, .queue-card, .profile-card,
    .community-card, .public-compact-join, .site-not-found-panel,
    .lb-panel, .blog-feature, .blog-card, .public-feed-feature, .public-feed-card,
    .official-panel, .campaign-teaser, .western-lane-block
) {
    border-color: var(--zb-line);
    background: rgba(24, 28, 36, 0.97);
    box-shadow: var(--zb-shadow-sm);
}

html[data-theme="dark"] body.zb-friendly-ui :where(.tag, .badge, .status-chip, .tier-badge, .pill, .chip) {
    border-color: var(--zb-line);
    background: #242a34;
    color: #d1d8e1;
}

html[data-theme="dark"] body.zb-friendly-ui :where(.vote-progress-bar, .char-vote-track, .cn-progress-track, .track, .profile-make-meter, .char-rally-track) {
    background: #2b323d;
}

/* Primary coral controls use dark ink to pass contrast in both normal and compact sizes. */
html[data-theme="dark"] body.zb-friendly-ui :where(
    .btn-patreon, .btn-patreon-login, .btn-patreon-cta, .btn-unlock-patreon,
    .public-compact-cta, .community-action-btn.is-primary, .suggestions-back-characters,
    .blog-primary, .blog-post-primary, .public-feed-primary, .official-primary
) {
    border-color: #ff948a;
    background: #ff948a;
    color: #261719 !important;
}

html[data-theme="dark"] body.zb-friendly-ui :where(
    .btn-patreon, .btn-patreon-login, .btn-patreon-cta, .btn-unlock-patreon,
    .public-compact-cta, .community-action-btn.is-primary, .suggestions-back-characters,
    .blog-primary, .blog-post-primary, .public-feed-primary, .official-primary
):hover {
    border-color: #ffb0a8;
    background: #ffb0a8;
    color: #261719 !important;
}

/* Home. */
html[data-theme="dark"] body.zb-route-index :where(
    .home-quality-strip, .home-discovery-primer, .home-crawl-strip,
    .home-discovery-band, .public-conversion, .home-zb3d-shell,
    .home-crawl-link, .home-discovery-link
) {
    border-color: var(--zb-line);
    background: rgba(24, 28, 36, 0.94);
    box-shadow: var(--zb-shadow-sm);
}

html[data-theme="dark"] body.zb-route-index :where(
    .home-pull-line, .home-landing-copy p, .home-quality-copy,
    .home-crawl-link span, .home-discovery-link span
) {
    color: var(--zb-muted);
}

html[data-theme="dark"] body.zb-route-index :where(
    .home-crawl-title, .home-crawl-link strong, .home-discovery-link strong
) {
    color: var(--zb-ink);
}

html[data-theme="dark"] body.zb-route-index .choice-hero {
    background:
        radial-gradient(circle at 82% 8%, rgba(117, 211, 202, 0.09), transparent 25rem),
        radial-gradient(circle at 54% 0%, rgba(255, 148, 138, 0.11), transparent 22rem),
        #11141a;
    color: var(--zb-ink);
}

html[data-theme="dark"] body.zb-route-index .choice-hero::before {
    background-image: radial-gradient(circle, rgba(229, 218, 210, 0.13) 1px, transparent 1.3px);
}

html[data-theme="dark"] body.zb-route-index :where(.choice-title, .home-pull-line, .home-quality-title, .home-zb3d-title) {
    color: var(--zb-ink);
}

html[data-theme="dark"] body.zb-route-index :where(.home-landing-copy .choice-sub, .home-zb3d-text) {
    color: var(--zb-muted);
}

html[data-theme="dark"] body.zb-route-index :where(.home-quality-card, .public-lane-btn.is-secondary) {
    border-color: var(--zb-line);
    background: #202630;
    color: var(--zb-ink-soft) !important;
}

html[data-theme="dark"] body.zb-route-index :where(.home-quality-card span, .home-zb3d-proof span) {
    color: #c8d0da;
}

html[data-theme="dark"] body.zb-route-index .public-lane-btn.is-primary {
    border-color: #ff948a;
    background: #ff948a;
    color: #261719 !important;
}

/* Works, activity, tutorial, launch, and almost-funded panels. */
html[data-theme="dark"] body.zb-route-zbaiart :where(
    .public-quality-strip, .public-quality-proof, .public-discovery, .public-discovery-guide, .public-discovery-context,
    .public-compact-panel, .tutorial-shell, .tutorial-panel, .tutorial-login-callout,
    .focus-shell, .focus-panel, .focus-target-card, .focus-feed-row, .focus-stats, .focus-stat,
    .launch-pulse-card, .launch-pulse-panel, .vote-action-shelf,
    .activity-shell, .activity-panel, .activity-card, .activity-row,
    .act-next-card, .act-today-chase
) {
    border-color: var(--zb-line);
    background: #181c24;
    color: var(--zb-ink-soft);
    box-shadow: var(--zb-shadow-sm);
}

html[data-theme="dark"] body.zb-route-zbaiart .public-quality-proof {
    border-color: var(--zb-line);
    background:
        linear-gradient(135deg, rgba(24, 28, 36, 0.98), rgba(48, 31, 42, 0.94)),
        #181c24;
    color: var(--zb-ink-soft);
    box-shadow: var(--zb-shadow-sm), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

html[data-theme="dark"] body.zb-route-zbaiart .public-quality-kicker {
    color: #ffaaa1;
}

html[data-theme="dark"] body.zb-route-zbaiart .public-quality-link {
    padding: 0 12px;
    border: 1px solid #80504e;
    border-radius: 10px;
    background: #39272c;
    color: #ffbeb7;
}

html[data-theme="dark"] body.zb-route-zbaiart .public-quality-link:is(:hover, :focus-visible) {
    border-color: #ff948a;
    background: #ff948a;
    color: #261719;
}

html[data-theme="dark"] body.zb-route-zbaiart :where(
    .public-quality-title, .public-discovery-title, .public-discovery-link strong, .public-compact-copy strong,
    .tutorial-login-callout strong, .focus-title, .focus-panel-title, .focus-stat-value,
    .focus-target-name, .focus-feed-title, .launch-pulse-card strong,
    .activity-title, .activity-row strong, .activity-card strong
) {
    color: var(--zb-ink) !important;
}

html[data-theme="dark"] body.zb-route-zbaiart :where(
    .public-quality-text, .public-discovery-text, .public-discovery-context, .public-discovery-link span, .public-compact-copy span,
    .tutorial-login-callout > span, .focus-stat-label, .focus-stat-meta,
    .focus-target-meta, .focus-feed-meta, .focus-feed-time, .focus-sub,
    .focus-empty, .activity-meta, .activity-copy
) {
    color: var(--zb-muted) !important;
}

html[data-theme="dark"] body.zb-route-zbaiart :where(.public-discovery-link, .focus-quick-card, .focus-feed-item) {
    border-color: var(--zb-line);
    background: #202630;
    color: var(--zb-ink-soft);
}

html[data-theme="dark"] body.zb-route-zbaiart :where(.act-next-btn.primary, .focus-action.is-primary) {
    border-color: #ff948a;
    background: #ff948a;
    color: #261719 !important;
}

html[data-theme="dark"] body.zb-route-zbaiart .act-next-btn-secondary {
    border-color: var(--zb-line);
    background: #202630;
    color: var(--zb-ink) !important;
}

html[data-theme="dark"] body.zb-route-zbaiart .act-next-btn-secondary:hover,
html[data-theme="dark"] body.zb-route-zbaiart .act-next-btn-secondary:focus-visible {
    border-color: #ff948a;
    background: #2b252b;
    color: #ffaaa1 !important;
}

html[data-theme="dark"] body.zb-route-zbaiart :where(
    .public-discovery-kicker, .focus-kicker
) {
    color: #ffaaa1 !important;
}

html[data-theme="dark"] body.zb-route-zbaiart .focus-panel-note {
    color: #8edbd4;
}

html[data-theme="dark"] body.zb-route-zbaiart .vote-action-shelf :where(
    .vote-shelf-item, .vote-shelf-timer, .vote-shelf-daily, .vote-shelf-boost,
    .vote-shelf-coins, .cycle-pill, .vote-shelf-help
) {
    border-color: #534438;
    background: #29251f;
    color: #d7d0c8;
}

html[data-theme="dark"] body.zb-route-zbaiart .vote-action-shelf :where(
    .vote-shelf-copy strong, .vote-shelf-value strong, .vote-chip strong
) {
    color: var(--zb-gold);
}

html[data-theme="dark"] body.zb-route-zbaiart .vote-action-shelf :where(
    .vote-shelf-label, .vote-chip-label, .vote-left-copy
) {
    color: #e5c8bf;
}

/* Character, series, Hall of Fame, recaps, and saved votes. */
html[data-theme="dark"] body:is(.zb-route-character, .zb-route-character-hub) :where(
    .char-page-tier, .char-page-stat, .char-support-card, .char-rally-panel,
    .char-related-panel, .char-share-card
) {
    border-color: var(--zb-line);
    background: #181c24;
    box-shadow: var(--zb-shadow-sm);
}

html[data-theme="dark"] body.zb-route-series :where(.si-card, .series-index-card),
html[data-theme="dark"] body.zb-route-halloffame .hof-card,
html[data-theme="dark"] body.zb-route-myvotes .myvotes-card,
html[data-theme="dark"] body:is(.zb-route-zbaiart, .zb-route-recaps, .zb-route-recap) .recap-card {
    border-color: var(--zb-line);
    background: #181c24;
    color: var(--zb-ink-soft);
}

html[data-theme="dark"] body.zb-route-series :where(.si-featured, .si-meta, .si-sub),
html[data-theme="dark"] body:is(.zb-route-zbaiart, .zb-route-recaps, .zb-route-recap) :where(.rc-meta, .rc-sub, .rc-section-helper),
html[data-theme="dark"] body.zb-route-myvotes :where(.myvotes-card-source, .myvotes-card-tier, .myvotes-card-date, .myvotes-support-meta) {
    color: var(--zb-muted);
}

html[data-theme="dark"] body.zb-route-series :where(.si-featured > span, .si-hof),
html[data-theme="dark"] body:is(.zb-route-zbaiart, .zb-route-recaps, .zb-route-recap) .rc-read,
html[data-theme="dark"] body.zb-route-halloffame .hof-hub-link {
    color: #ffaaa1;
}

html[data-theme="dark"] body.zb-route-series :where(.si-kicker, .sh-kicker),
html[data-theme="dark"] body.zb-route-series-hub :where(.si-kicker, .sh-kicker),
html[data-theme="dark"] body.zb-route-character-hub .ch-kicker,
html[data-theme="dark"] body:is(.zb-route-recaps, .zb-route-recap) .rc-kicker {
    color: #ffaaa1;
}

html[data-theme="dark"] body.zb-route-halloffame :where(
    .vote-count-wrap span, .hof-inducted, .card-tier
) {
    color: #f2c66d !important;
}

html[data-theme="dark"] body.zb-route-halloffame .hof-card .card-tier,
html[data-theme="dark"] body.zb-route-halloffame .hof-card .hof-inducted {
    color: #f2c66d !important;
}

html[data-theme="dark"] body.zb-route-halloffame .ring-count {
    color: #261719 !important;
}

html[data-theme="dark"] body.zb-route-myvotes .myvotes-card-status {
    color: #83d7a9;
}

/* Final route-local friendly cascades use literal light colors; these shims must come later. */
html[data-theme="dark"] body.zb-route-characters :where(
    .ci-actions a, .ci-reveal, .ci-find input, .ci-clear,
    .ci-sort-row .filter-chip-link, .ci-item, .ci-signal
) {
    border-color: var(--zb-line);
    background: #1b2028;
    color: var(--zb-ink-soft);
    box-shadow: var(--zb-shadow-xs);
}

html[data-theme="dark"] body.zb-route-characters :where(.ci-item:hover, .ci-item:focus-visible) {
    border-color: #80504e;
    background: #202630;
}

html[data-theme="dark"] body.zb-route-characters :where(.ci-name) {
    color: var(--zb-ink);
}

html[data-theme="dark"] body.zb-route-characters :where(.ci-meta) {
    color: var(--zb-muted);
}

html[data-theme="dark"] body.zb-route-characters .ci-art-shell {
    background: #242a34;
}

html[data-theme="dark"] body.zb-route-characters .ci-sort-row .filter-chip-link.is-active {
    border-color: #ff948a;
    background: #ff948a;
    color: #261719;
}

html[data-theme="dark"] body:is(.zb-route-series, .zb-route-series-hub) :where(
    .si-head, .si-summary-note, .si-find input, .si-clear, .si-actions a,
    .si-signals > span, .si-card, .sh-head, .sh-kpi, .sh-find input,
    .sh-clear, .sh-links a, .sh-state, .sh-card, .sh-path-card, .sh-mini
) {
    border-color: var(--zb-line);
    background: #181c24;
    color: var(--zb-ink-soft);
    box-shadow: var(--zb-shadow-xs);
}

html[data-theme="dark"] body:is(.zb-route-series, .zb-route-series-hub) :where(.si-title, .si-card h2, .si-card h3) {
    color: var(--zb-ink);
}

html[data-theme="dark"] body:is(.zb-route-series, .zb-route-series-hub) :where(
    .sh-name, .sh-grid-head h2, .sh-path-card strong
) {
    color: var(--zb-ink) !important;
}

html[data-theme="dark"] body:is(.zb-route-series, .zb-route-series-hub) :where(
    .sh-meta, .sh-sub, .sh-context-secondary, .sh-grid-head span, .sh-path-card span
) {
    color: var(--zb-muted) !important;
}

html[data-theme="dark"] body:is(.zb-route-character, .zb-route-character-hub) :where(
    .ch-mini-kicker, .ch-snapshot-label
),
html[data-theme="dark"] body:is(.zb-route-zbaiart, .zb-route-recaps, .zb-route-recap) .rc-hero-label,
html[data-theme="dark"] body.zb-route-community .suggestions-return-kicker {
    color: #ffaaa1 !important;
}

html[data-theme="dark"] body:is(.zb-route-series, .zb-route-series-hub) :where(.si-intro, .si-summary, .si-count, .si-signals, .sh-context-primary) {
    color: var(--zb-muted);
}

html[data-theme="dark"] body:is(.zb-route-series, .zb-route-series-hub) :where(.si-art-shell, .si-art, .sh-card img) {
    background: #242a34;
}

html[data-theme="dark"] body:is(.zb-route-series, .zb-route-series-hub) .si-open-cue {
    background: rgba(19, 22, 29, 0.92);
    color: #ffaaa1;
}

html[data-theme="dark"] body:is(.zb-route-character, .zb-route-character-hub) :where(
    .ch-intro, .ch-main, .ch-side, .ch-rel, .ch-kpi, .ch-snapshot-item,
    .ch-cta, .ch-rel-card, .ch-path-card, .ch-snapshot
) {
    border-color: var(--zb-line);
    background: #181c24;
    color: var(--zb-ink-soft);
    box-shadow: var(--zb-shadow-xs);
}

html[data-theme="dark"] body:is(.zb-route-character, .zb-route-character-hub) :where(.ch-name, .ch-snapshot-title, .ch-rel-name) {
    color: var(--zb-ink);
}

html[data-theme="dark"] body:is(.zb-route-character, .zb-route-character-hub) :where(
    .ch-meta, .ch-public-note, .ch-rel-note, .ch-series-context, .ch-snapshot-copy
) {
    color: var(--zb-muted);
}

html[data-theme="dark"] body:is(.zb-route-character, .zb-route-character-hub) :where(.ch-img, .ch-rel-card img) {
    background: #242a34;
}

html[data-theme="dark"] body:is(.zb-route-character, .zb-route-character-hub) .ch-cta.is-primary,
html[data-theme="dark"] body:is(.zb-route-series, .zb-route-series-hub) .sh-links-primary a:first-child,
html[data-theme="dark"] body:is(.zb-route-zbaiart, .zb-route-recaps, .zb-route-recap) :where(.rc-links a:first-child, .rc-primary) {
    border-color: #ff948a;
    background: #ff948a;
    color: #261719;
}

html[data-theme="dark"] body:is(.zb-route-zbaiart, .zb-route-recaps, .zb-route-recap) :where(
    .rc-find input, .rc-clear, .rc-links a, .rc-link-button, .rc-secondary,
    .rc-next-links a, .rc-hero-pill, .rc-hero, .rc-item, .rc-next
) {
    border-color: var(--zb-line);
    background: #181c24;
    color: var(--zb-ink-soft);
    box-shadow: var(--zb-shadow-xs);
}

html[data-theme="dark"] body:is(.zb-route-zbaiart, .zb-route-recaps, .zb-route-recap) :where(
    .rc-title, .rc-list-head h2, .rc-hero h2, .rc-item h2, .rc-item h3, .rc-next h2
) {
    color: var(--zb-ink);
}

html[data-theme="dark"] body:is(.zb-route-zbaiart, .zb-route-recaps, .zb-route-recap) :where(.rc-sub, .rc-summary, .rc-hero-summary, .rc-meta, .rc-count) {
    color: var(--zb-muted);
}

html[data-theme="dark"] body:is(.zb-route-zbaiart, .zb-route-recaps, .zb-route-recap) :where(.rc-hero-media, .rc-item-media) {
    background: #242a34;
}

html[data-theme="dark"] body.zb-route-recap :where(.rp-head, .rp-section, .rp-panel) {
    border-color: var(--zb-line);
    background: #181c24;
    color: var(--zb-ink-soft);
    box-shadow: var(--zb-shadow-sm);
}

html[data-theme="dark"] body.zb-route-recap :where(
    .rp-chip, .rp-stat-pill, .rp-quick-list li, .rp-char-card,
    .rp-series-link, .rp-browse-link
) {
    border-color: var(--zb-line);
    background: #202630;
    color: var(--zb-ink-soft);
}

html[data-theme="dark"] body.zb-route-recap :where(
    .rp-title, .rp-section-title, .rp-panel h3, .rp-quick-list strong,
    .rp-body-content h2, .rp-body-content h3, .rp-char-card strong
) {
    color: var(--zb-ink);
}

html[data-theme="dark"] body.zb-route-recap :where(
    .rp-summary, .rp-meta, .rp-quick-list, .rp-body-content,
    .rp-panel a, .rp-panel div, .rp-char-card span,
    .rp-series-link span, .rp-browse-link span, .rp-back
) {
    color: var(--zb-muted);
}

html[data-theme="dark"] body.zb-route-recap .rp-primary {
    border-color: #ff948a;
    background: #ff948a;
    color: #261719;
}

html[data-theme="dark"] body.zb-route-myvotes .myvotes-page {
    --myvotes-ink: #f7f2ee;
    --myvotes-copy: #b7c0cc;
    --myvotes-soft: #9ba5b3;
    --myvotes-panel: #181c24;
    --myvotes-panel-deep: #202630;
    --myvotes-border: #343c49;
    --myvotes-accent: #ff948a;
    --myvotes-amber: #f2c66d;
    color: var(--myvotes-ink);
}

html[data-theme="dark"] body.zb-route-myvotes .myvotes-page :where(
    .myvotes-stats, .myvotes-card, .myvotes-card-prev, .myvotes-card-history,
    .myvotes-support-chip, .myvotes-rollover-stat, .myvotes-rollover-item,
    .myvotes-rollover-empty
) {
    border-color: var(--myvotes-border);
    background: #181c24;
    color: var(--myvotes-copy);
    box-shadow: var(--zb-shadow-xs);
}

html[data-theme="dark"] body.zb-route-myvotes .myvotes-card-img,
html[data-theme="dark"] body.zb-route-myvotes .myvotes-card-img::after {
    background: #242a34;
    color: var(--myvotes-copy);
}

/* My Votes uses a late light section shell; keep the heading and grid on one dark surface. */
html[data-theme="dark"] body.zb-route-myvotes .myvotes-page .myvotes-section {
    border-color: var(--myvotes-border);
    background: #181c24;
    color: var(--myvotes-ink);
    box-shadow: var(--zb-shadow-sm);
}

html[data-theme="dark"] body.zb-route-myvotes .myvotes-page .myvotes-section-head,
html[data-theme="dark"] body.zb-route-myvotes .myvotes-page .myvotes-stats {
    border-color: var(--myvotes-border);
    background: #181c24;
}

html[data-theme="dark"] body.zb-route-myvotes .myvotes-page .myvotes-section-title,
html[data-theme="dark"] body.zb-route-myvotes .myvotes-page .myvotes-card-name,
html[data-theme="dark"] body.zb-route-myvotes .myvotes-page .myvotes-stat-num {
    color: var(--myvotes-ink);
}

html[data-theme="dark"] body.zb-route-myvotes .myvotes-page .myvotes-section-sub,
html[data-theme="dark"] body.zb-route-myvotes .myvotes-page .myvotes-page-summary,
html[data-theme="dark"] body.zb-route-myvotes .myvotes-page .myvotes-stat-label {
    color: var(--myvotes-copy);
}

html[data-theme="dark"] body.zb-route-myvotes .myvotes-page .myvotes-card,
html[data-theme="dark"] body.zb-route-myvotes .myvotes-page .myvotes-card-prev,
html[data-theme="dark"] body.zb-route-myvotes .myvotes-page .myvotes-card-history {
    border-color: var(--myvotes-border);
    background: #202630;
    color: var(--myvotes-ink);
    box-shadow: var(--zb-shadow-xs);
}

html[data-theme="dark"] body.zb-route-myvotes .myvotes-page .myvotes-card:hover,
html[data-theme="dark"] body.zb-route-myvotes .myvotes-page .myvotes-card:focus-visible {
    border-color: #79504e;
    background: #282d37;
}

html[data-theme="dark"] body.zb-route-myvotes .myvotes-page .myvotes-card-footer {
    border-color: var(--myvotes-border);
}

/* Community, Suggestions, and creator moderation. */
html[data-theme="dark"] body.zb-route-community :where(
    .community-action-strip, .community-activity-stat, .community-callout-card,
    .community-activity-panel, .community-feed-row, .community-rail-panel,
    .community-feed-more-btn, .suggestions-return-banner, .how-it-works,
    .creator-spotlight-banner, .my-suggestion-banner, .community-hero,
    .suggestion-vote-card, .suggestion-queue-card, .suggestions-public-link,
    .creator-mod-panel, .mod-item, .mod-note-input, .mod-preview-empty
) {
    border-color: var(--zb-line);
    background: #181c24;
    color: var(--zb-ink-soft);
    box-shadow: var(--zb-shadow-sm);
}

html[data-theme="dark"] body.zb-route-community :where(
    .community-action-title, .community-callout-name, .community-feed-main strong,
    .community-feed-mini-name, .suggestions-return-title, .suggestions-public-link strong, .creator-mod-header,
    .mod-item strong
) {
    color: var(--zb-ink) !important;
}

html[data-theme="dark"] body.zb-route-community :where(
    .community-action-meta, .community-callout-meta, .community-feed-meta,
    .community-activity-copy, .suggestions-return-copy p, .suggestions-public-link span, .creator-mod-body,
    .creator-mod-body > p, .mod-toggle, .mod-preview-label, .mod-preview-empty
) {
    color: var(--zb-muted) !important;
}

html[data-theme="dark"] body.zb-route-community :where(
    .community-callout-label, .community-chase-label, .community-feed-streak,
    .community-callout-meta strong, .community-action-pill strong
) {
    color: var(--zb-gold);
}

html[data-theme="dark"] body.zb-route-community :where(.community-action-pill, .community-reaction-stamp) {
    border-color: var(--zb-line);
    background: #242a34;
    color: var(--zb-ink-soft);
}

html[data-theme="dark"] body.zb-route-community .community-feed-thumb {
    border-color: var(--zb-line);
    background: #202630;
}

/* Authenticated Community and Suggestions use a shared three-level surface hierarchy. */
html[data-theme="dark"] body.zb-route-community .community-explore,
html[data-theme="dark"] body.zb-route-community .community-activity-panel,
html[data-theme="dark"] body.zb-route-community .community-rail-panel,
html[data-theme="dark"] body.zb-route-community .my-suggestion-banner,
html[data-theme="dark"] body.zb-route-community .creator-mod-panel {
    border-color: var(--zb-line);
    background: #181c24;
    color: var(--zb-ink-soft);
    box-shadow: var(--zb-shadow-sm);
}

html[data-theme="dark"] body.zb-route-community .community-feed-row,
html[data-theme="dark"] body.zb-route-community .community-rail-row {
    border-color: var(--zb-line);
    background: #202630;
    color: var(--zb-ink-soft);
}

html[data-theme="dark"] body.zb-route-community .community-feed-row:hover,
html[data-theme="dark"] body.zb-route-community .community-rail-row:hover {
    background: #282f3a;
}

html[data-theme="dark"] body.zb-route-community :where(
    .community-explore-title, .community-activity-title, .community-section-row h3,
    .community-rail-title, .community-rail-name, .community-feed-mini-name,
    .community-feed-main, .my-suggestion-banner-title
) {
    color: var(--zb-ink) !important;
}

html[data-theme="dark"] body.zb-route-community :where(
    .community-explore-copy, .community-activity-copy, .community-feed-meta,
    .community-rail-meta, .community-rail-foot, .community-section-row > span,
    .my-suggestion-banner-copy
) {
    color: var(--zb-muted) !important;
}

html[data-theme="dark"] body.zb-route-community .suggestions-simplified-tabs,
html[data-theme="dark"] body.zb-route-community .suggestions-simplified-tabs .tab-group,
html[data-theme="dark"] body.zb-route-community .suggestions-status-subtabs {
    border-color: var(--zb-line);
    background: #181c24;
}

html[data-theme="dark"] body.zb-route-community .suggestions-simplified-tabs .top-tab {
    border-color: var(--zb-line);
    background: #202630;
    color: #cbd3dd;
}

html[data-theme="dark"] body.zb-route-community .suggestions-simplified-tabs .top-tab:is(:hover, .active),
html[data-theme="dark"] body.zb-route-community .suggestions-simplified-tabs .top-tab:focus-visible {
    border-color: #80504e;
    background: #39272c;
    color: #ffbeb7;
}

html[data-theme="dark"] body.zb-route-community .suggest-form-wrap .suggest-form-card,
html[data-theme="dark"] body.zb-route-community .suggest-rules-card {
    border-color: var(--zb-line);
    background: #181c24;
    color: var(--zb-ink-soft);
    box-shadow: var(--zb-shadow-sm);
}

html[data-theme="dark"] body.zb-route-community :where(
    .suggest-page-title, .suggest-rules-card h2, .suggest-queue-preview h2,
    .suggest-monthly-copy strong, .suggest-form-wrap .form-group > label,
    .suggest-form-wrap .tier-details strong
) {
    color: var(--zb-ink) !important;
}

html[data-theme="dark"] body.zb-route-community :where(
    .suggest-form-wrap .suggest-intro, .suggest-rules-list li, .suggest-monthly-copy,
    .suggest-monthly-copy small, .suggest-form-wrap .hint, .suggest-direction-hint,
    .suggest-form-wrap .tier-details span, .suggest-policy-confirm
) {
    color: var(--zb-muted) !important;
}

html[data-theme="dark"] body.zb-route-community .suggest-monthly-status {
    border-color: #326658;
    background: #18352f;
}

html[data-theme="dark"] body.zb-route-community .suggest-monthly-icon {
    background: #244840;
    color: #8be0ca;
}

html[data-theme="dark"] body.zb-route-community .suggest-monthly-meter {
    background: #2b4a45;
}

html[data-theme="dark"] body.zb-route-community .suggest-form-wrap .form-input,
html[data-theme="dark"] body.zb-route-community .suggest-form-wrap .sort-select {
    border-color: var(--zb-line);
    background: #12161c;
    color: var(--zb-ink);
}

html[data-theme="dark"] body.zb-route-community .suggest-form-wrap .tier-option {
    border-color: var(--zb-line);
    background: #202630;
    color: var(--zb-ink-soft);
}

html[data-theme="dark"] body.zb-route-community .suggest-form-wrap .tier-option.selected {
    border-color: #a65d59;
    background: #39272c;
}

html[data-theme="dark"] body.zb-route-community .suggest-queue-preview {
    border-color: var(--zb-line);
}

html[data-theme="dark"] body.zb-route-community .suggest-feedback-error,
html[data-theme="dark"] body.zb-route-community .suggest-feedback.error {
    border-color: #79464c;
    background: #3a2026;
    color: #ffb5ba;
}

/* Profile surfaces keep custom artwork while controls and content remain readable. */
html[data-theme="dark"] body.zb-route-profile :where(
    .profile-make-topbar, .profile-make-action, .profile-focus-tabs,
    .profile-focus-tab, .profile-make-card, .profile-section, .profile-panel,
    .profile-drawer, .showcase-drawer
) {
    border-color: var(--zb-line);
    background: rgba(24, 28, 36, 0.96);
    color: var(--zb-ink-soft);
}

html[data-theme="dark"] body.zb-route-profile :where(.profile-make-brand, .profile-make-action, .profile-make-coin) {
    color: var(--zb-ink);
}

html[data-theme="dark"] body.zb-route-profile .profile-make-coin {
    border-color: #6e5930;
    background: #382f1e;
    color: var(--zb-gold);
}

/* Member Hub: the parent canvas is the backdrop; cosmetics stay vivid above it. */
html[data-theme="dark"] body.zb-route-profile .profile-wrap.profile-layout-root {
    --profile-hub-ink: var(--zb-ink);
    --profile-hub-muted: var(--zb-muted);
    --profile-hub-line: var(--zb-line);
    --profile-hub-paper: #181c24;
    --profile-hub-warm: #202630;
    --profile-hub-coral: #ff948a;
    --profile-hub-coral-soft: #39272c;
    --profile-hub-teal: #75d3ca;
    --profile-hub-gold: #f2c66d;
    background:
        radial-gradient(circle at 88% 0%, rgba(117, 211, 202, 0.07), transparent 27rem),
        radial-gradient(circle at 16% 0%, rgba(255, 148, 138, 0.08), transparent 24rem),
        #11141a;
    color: var(--profile-hub-ink);
}

html[data-theme="dark"] body.zb-route-profile .profile-wrap.profile-layout-root .profile-make-topbar,
html[data-theme="dark"] body.zb-route-profile .profile-wrap.profile-layout-root .profile-focus-tabs,
html[data-theme="dark"] body.zb-route-profile .profile-wrap.profile-layout-root :where(
    .profile-overview-section, .pinned-section, .featured-achievements-section,
    .achievements-section, .site-rank-section, .collection-tracks-section,
    .profile-extras-section, .profile-private-card, .coins-info, .shop-section,
    .feed-section, .profile-layout-manager
) {
    border-color: var(--profile-hub-line);
    background: var(--profile-hub-paper);
    color: var(--profile-hub-ink);
    box-shadow: var(--zb-shadow-sm);
}

html[data-theme="dark"] body.zb-route-profile .profile-wrap.profile-layout-root .profile-make-brand,
html[data-theme="dark"] body.zb-route-profile .profile-wrap.profile-layout-root .profile-make-brand-copy strong,
html[data-theme="dark"] body.zb-route-profile .profile-wrap.profile-layout-root :where(
    .profile-section-title, .pinned-title, .featured-achievements-title,
    .achievements-title, .site-rank-title, .profile-private-title,
    .feed-title, .shop-title, .profile-layout-manager-title
) {
    color: var(--profile-hub-ink);
}

html[data-theme="dark"] body.zb-route-profile .profile-wrap.profile-layout-root .profile-make-brand-copy small,
html[data-theme="dark"] body.zb-route-profile .profile-wrap.profile-layout-root .profile-overview-meta {
    color: var(--profile-hub-muted);
}

html[data-theme="dark"] body.zb-route-profile .profile-wrap.profile-layout-root .profile-make-action {
    border-color: var(--profile-hub-line);
    background: #202630;
    color: var(--profile-hub-ink);
}

html[data-theme="dark"] body.zb-route-profile .profile-wrap.profile-layout-root .profile-make-action:is(:hover, :focus-visible) {
    border-color: #80504e;
    background: #39272c;
    color: #ffbeb7;
}

html[data-theme="dark"] body.zb-route-profile .profile-wrap.profile-layout-root .profile-focus-tab {
    border-color: transparent;
    background: transparent;
    color: #c5cdd7;
}

html[data-theme="dark"] body.zb-route-profile .profile-wrap.profile-layout-root .profile-focus-tab:is(:hover, :focus-visible, .is-active, .active) {
    border-color: #80504e;
    background: #39272c;
    color: #ffbeb7;
}

html[data-theme="dark"] body.zb-route-profile .profile-next-action {
    border-color: #6e5930;
    background: #2a261b;
    color: var(--profile-hub-ink);
    box-shadow: var(--zb-shadow-sm);
}

html[data-theme="dark"] body.zb-route-profile .profile-next-action-icon {
    border-color: #806936;
    background: #382f1e;
    color: var(--profile-hub-gold);
}

html[data-theme="dark"] body.zb-route-profile .profile-next-action h2 {
    color: var(--profile-hub-ink);
}

html[data-theme="dark"] body.zb-route-profile .profile-next-action :where(p, .profile-next-action-facts) {
    color: var(--profile-hub-muted);
}

html[data-theme="dark"] body.zb-route-profile .profile-next-action-kicker {
    color: var(--profile-hub-gold);
}

html[data-theme="dark"] body.zb-route-profile .profile-wrap.profile-layout-root .profile-overview-card,
html[data-theme="dark"] body.zb-route-profile .profile-wrap.profile-layout-root :where(
    .collection-track-card, .featured-achievement-card, .ach-item, .shop-item,
    .coin-summary-card, .coin-history-item, .pinned-card, .character-shelf-card,
    .inbox-item, .invite-card, .collection-binder-card, .featured-unlock-card
) {
    border-color: var(--profile-hub-line);
    background: var(--profile-hub-warm);
    color: var(--profile-hub-ink);
}

html[data-theme="dark"] body.zb-route-profile .profile-wrap.profile-layout-root .profile-overview-card:hover {
    border-color: #80504e;
    background: #282f3a;
}

html[data-theme="dark"] body.zb-route-profile .profile-wrap.profile-layout-root .profile-overview-label {
    color: #ffaaa1;
}

html[data-theme="dark"] body.zb-route-profile .profile-wrap.profile-layout-root .profile-overview-value,
html[data-theme="dark"] body.zb-route-profile .profile-wrap.profile-layout-root .affinity-tag strong {
    color: var(--profile-hub-ink);
}

html[data-theme="dark"] body.zb-route-profile .profile-wrap.profile-layout-root .affinity-tag {
    border-color: var(--profile-hub-line);
    background: #202630;
    color: var(--profile-hub-ink-soft);
}

html[data-theme="dark"] body.zb-route-profile .profile-wrap.profile-layout-root .affinity-tag span {
    color: var(--profile-hub-muted);
}

/* Recap grids must not paint an empty light cell when the final row is uneven. */
html[data-theme="dark"] body:is(.zb-route-zbaiart, .zb-route-recaps, .zb-route-recap) .rc-list {
    background: transparent;
}

/* The voting board uses its own late light variables; remap the whole component system. */
html[data-theme="dark"] body.zb-route-zbaiart .zb-page-header-vault {
    background: transparent;
}

html[data-theme="dark"] body.zb-route-zbaiart .zb-page-header-vault .patreon-section-title {
    color: var(--zb-ink);
}

html[data-theme="dark"] body.zb-route-zbaiart .zb-page-header-vault .patreon-section-sub {
    color: var(--zb-muted);
}

html[data-theme="dark"] body.zb-route-zbaiart .zb-page-header-vault .patreon-section-icon {
    border-color: #80504e;
    background: #39272c;
    color: #ffaaa1;
}

html[data-theme="dark"] body.zb-route-zbaiart .zb-tab-vault {
    --works-vote-ink: var(--zb-ink);
    --works-vote-muted: var(--zb-muted);
    --works-vote-line: var(--zb-line);
    --works-vote-paper: #181c24;
    --works-vote-warm: #202630;
    --works-vote-coral: #ff948a;
    --works-vote-coral-dark: #ffb0a8;
    --works-vote-teal: #75d3ca;
}

html[data-theme="dark"] body.zb-route-zbaiart .zb-tab-vault .chars-toolbar,
html[data-theme="dark"] body.zb-route-zbaiart .zb-tab-vault .vote-shelf-daily,
html[data-theme="dark"] body.zb-route-zbaiart .zb-tab-vault .vote-shelf-coins {
    border-color: var(--works-vote-line);
    background: var(--works-vote-paper);
    color: var(--works-vote-ink);
    box-shadow: var(--zb-shadow-sm);
}

html[data-theme="dark"] body.zb-route-zbaiart .zb-tab-vault .search-input-main,
html[data-theme="dark"] body.zb-route-zbaiart .zb-tab-vault .filter-chip-link,
html[data-theme="dark"] body.zb-route-zbaiart .zb-tab-vault .btn-reset {
    border-color: var(--works-vote-line);
    background: #12161c;
    color: var(--works-vote-ink);
}

html[data-theme="dark"] body.zb-route-zbaiart .zb-tab-vault .filter-chip-link.active {
    border-color: #80504e;
    background: #39272c;
    color: #ffbeb7;
}

html[data-theme="dark"] body.zb-route-zbaiart .zb-tab-vault .vote-shelf-daily,
html[data-theme="dark"] body.zb-route-zbaiart .zb-tab-vault .vote-shelf-coins,
html[data-theme="dark"] body.zb-route-zbaiart .zb-tab-vault .works-vote-card {
    border-color: var(--works-vote-line);
    background: var(--works-vote-paper);
    color: var(--works-vote-ink);
}

html[data-theme="dark"] body.zb-route-zbaiart .zb-tab-vault .works-vote-card:is(:hover, :focus-within) {
    border-color: #80504e;
    box-shadow: var(--zb-shadow-md);
}

html[data-theme="dark"] body.zb-route-zbaiart .zb-tab-vault .works-vote-card-image {
    background: #242a34;
}

html[data-theme="dark"] body.zb-route-zbaiart .zb-tab-vault .works-vote-card-heading h4,
html[data-theme="dark"] body.zb-route-zbaiart .zb-tab-vault .works-vote-progress-head strong,
html[data-theme="dark"] body.zb-route-zbaiart .zb-tab-vault .vote-shelf-coins .vote-shelf-value,
html[data-theme="dark"] body.zb-route-zbaiart .zb-tab-vault .vote-shelf-votes {
    color: var(--works-vote-ink);
}

html[data-theme="dark"] body.zb-route-zbaiart .zb-tab-vault :where(
    .works-vote-card-heading .card-source, .works-vote-progress-head,
    .zb-card-action-meta, .vote-left-copy
) {
    color: var(--works-vote-muted);
}

html[data-theme="dark"] body.zb-route-zbaiart .zb-tab-vault .works-vote-progress-track {
    background: #2b323d;
}

html[data-theme="dark"] body.zb-route-zbaiart .zb-tab-vault .works-vote-support .character-support-tracker {
    border-color: #80504e;
    background: #39272c;
    color: #ffbeb7;
}

html[data-theme="dark"] body.zb-route-zbaiart .zb-tab-vault .works-vote-card .is-vote .zb-card-action-btn {
    border-color: var(--works-vote-coral);
    background: var(--works-vote-coral);
    color: #261719;
}

html[data-theme="dark"] body.zb-route-zbaiart .zb-tab-vault .works-vote-card .is-boost .zb-card-action-btn {
    border-color: var(--works-vote-line);
    background: #202630;
    color: var(--works-vote-ink);
}

html[data-theme="dark"] body.zb-route-zbaiart .zb-tab-vault .works-vote-card .is-boost .zb-card-action-btn:is(:hover, :focus-visible) {
    border-color: #806936;
    background: #382f1e;
    color: var(--zb-gold);
}

/* Authenticated route closeout: neutralize late light-theme component rules. */
html[data-theme="dark"] body.zb-friendly-ui .filter-chip-row {
    border-color: var(--zb-line) !important;
    background: transparent !important;
    color: var(--zb-ink-soft) !important;
}

html[data-theme="dark"] body.zb-friendly-ui .filter-chip-row :where(.filter-chip-link, .btn-reset) {
    border-color: var(--zb-line) !important;
    background: #1b2028 !important;
    color: var(--zb-ink-soft) !important;
}

html[data-theme="dark"] body.zb-friendly-ui .filter-chip-row :where(.filter-chip-link.active, .filter-chip-link:hover, .filter-chip-link:focus-visible) {
    border-color: #80504e !important;
    background: #39272c !important;
    color: #ffbeb7 !important;
}

html[data-theme="dark"] body.zb-route-index .home-zb3d-spotlight {
    border-color: var(--zb-line) !important;
    background:
        radial-gradient(circle at 85% 12%, rgba(117, 211, 202, 0.08), transparent 24rem),
        radial-gradient(circle at 16% 0%, rgba(255, 148, 138, 0.09), transparent 22rem),
        #181c24 !important;
    color: var(--zb-ink) !important;
}

html[data-theme="dark"] body.zb-route-zbaiart :where(
    .tutorial-step-card, .tutorial-link-card, .tutorial-action-panel,
    .tutorial-coin-quick, .tutorial-shortcut-grid > a,
    .tutorial-coin-friendly-grid > div, .tutorial-coin-friendly-spend,
    .tutorial-reward-note
) {
    border-color: var(--zb-line) !important;
    background: #202630 !important;
    color: var(--zb-ink-soft) !important;
    box-shadow: var(--zb-shadow-xs) !important;
}

html[data-theme="dark"] body.zb-route-zbaiart :where(
    .tutorial-title, .tutorial-steps-title, .tutorial-destinations-title,
    .tutorial-shortcuts-title, .tutorial-coins-title,
    .tutorial-step-card strong, .tutorial-link-card strong,
    .tutorial-destination-title, .tutorial-coin-friendly-head
) {
    color: var(--zb-ink) !important;
}

html[data-theme="dark"] body.zb-route-zbaiart :where(
    .tutorial-step-card p, .tutorial-link-copy, .tutorial-reward-note,
    .tutorial-coin-friendly-grid span, .tutorial-coin-friendly-spend span
) {
    color: var(--zb-muted) !important;
}

html[data-theme="dark"] body.zb-route-zbaiart .zb-tab-vault .works-vote-card-info {
    border-color: var(--works-vote-line) !important;
    background: var(--works-vote-paper) !important;
    color: var(--works-vote-ink) !important;
}

html[data-theme="dark"] body.zb-route-zbaiart .zb-tab-vault :where(.vote-chip, .vote-shelf-votes) {
    border-color: var(--works-vote-line) !important;
    background: #202630 !important;
    color: var(--works-vote-ink) !important;
}

html[data-theme="dark"] body.zb-route-zbaiart .zb-tab-almostfunded :where(
    .focus-target-card, .focus-feed-row, .focus-stat, .finish-this-card,
    .vote-action-shelf, .cycle-countdown-banner
) {
    border-color: var(--zb-line) !important;
    background: #202630 !important;
    color: var(--zb-ink-soft) !important;
}

html[data-theme="dark"] body.zb-route-zbaiart .zb-tab-almostfunded :where(
    .focus-target-name, .focus-stat-value, .focus-feed-title,
    .finish-this-card strong
) {
    color: var(--zb-ink) !important;
}

html[data-theme="dark"] body.zb-route-zbaiart .zb-tab-almostfunded :where(
    .focus-target-meta, .focus-stat-label, .focus-stat-meta,
    .focus-feed-meta, .focus-feed-time, .finish-this-card span
) {
    color: var(--zb-muted) !important;
}

html[data-theme="dark"] body.zb-route-community .community-page > .chars-header h1 {
    color: var(--zb-ink) !important;
}

html[data-theme="dark"] body.zb-route-community :where(
    .community-explore-card, .community-series-card, .community-leader-panel,
    .community-leader-row, .community-hot-card, .community-milestone-strip,
    .community-feed-avatar
) {
    border-color: var(--zb-line) !important;
    background: #202630 !important;
    color: var(--zb-ink-soft) !important;
}

html[data-theme="dark"] body.zb-route-community :where(
    .community-explore-card:hover, .community-series-card:hover,
    .community-leader-row:hover, .community-hot-card:hover
) {
    border-color: #80504e !important;
    background: #282f3a !important;
}

html[data-theme="dark"] body.zb-route-community :where(
    .community-explore-name, .community-series-name, .community-leader-name,
    .community-hot-name, .community-milestone-strip strong
) {
    color: var(--zb-ink) !important;
}

html[data-theme="dark"] body.zb-route-community :where(
    .community-explore-meta, .community-series-meta-row, .community-leader-meta,
    .community-hot-meta, .community-milestone-strip span,
    .community-rail-rank
) {
    color: var(--zb-muted) !important;
}

html[data-theme="dark"] body.zb-route-community .suggest-queue > .sug-card-list {
    border: 0 !important;
    background: transparent !important;
    color: inherit !important;
    padding: 0 !important;
    box-shadow: none !important;
}

html[data-theme="dark"] body.zb-route-community .suggest-queue .sug-list-card.sug-option-card,
html[data-theme="dark"] body.zb-route-community .suggest-queue .sug-list-card.sug-card-funded,
html[data-theme="dark"] body.zb-route-community .suggest-queue .sug-list-card.sug-card-completed {
    border-color: var(--zb-line) !important;
    background: #202630 !important;
    color: var(--zb-ink-soft) !important;
    box-shadow: var(--zb-shadow-xs) !important;
    opacity: 1 !important;
}

html[data-theme="dark"] body.zb-route-community .suggest-queue .sug-list-card.sug-card-completed {
    border-color: rgba(0, 200, 150, 0.42) !important;
    background: linear-gradient(135deg, rgba(0, 200, 150, 0.16), #202630) !important;
    color: var(--zb-ink) !important;
}

html[data-theme="dark"] body.zb-route-community .suggest-queue :where(
    .sug-list-card:hover, .sug-list-card.sug-option-card:hover, .sug-list-card.sug-card-completed:hover
) {
    border-color: #80504e !important;
    background: #282f3a !important;
    box-shadow: var(--zb-shadow-sm) !important;
    opacity: 1 !important;
}

html[data-theme="dark"] body.zb-route-community .suggest-queue .sug-list-card.sug-card-completed:hover {
    border-color: rgba(0, 200, 150, 0.62) !important;
    background: linear-gradient(135deg, rgba(0, 200, 150, 0.22), #282f3a) !important;
}

html[data-theme="dark"] body.zb-route-community .suggest-queue :where(
    .sug-card-title, .queue-explainer, .sug-card-body strong
) {
    color: var(--zb-ink) !important;
}

html[data-theme="dark"] body.zb-route-community .suggest-queue .sug-card-completed :where(
    .sug-card-title, .sug-card-body, .sug-vote-count
) {
    color: var(--zb-ink) !important;
}

html[data-theme="dark"] body.zb-route-community .suggest-queue :where(
    .sug-card-meta, .sug-card-notes, .sug-queue-note, .sug-card-progress-line
) {
    color: var(--zb-muted) !important;
}

html[data-theme="dark"] body.zb-route-community .suggest-queue .sug-card-completed :where(
    .sug-card-meta, .sug-card-notes
) {
    color: #c5d0dc !important;
}

html[data-theme="dark"] body.zb-route-community .my-suggestions-page h3,
html[data-theme="dark"] body.zb-route-community .mine-overview-title {
    color: var(--zb-ink) !important;
}

html[data-theme="dark"] body.zb-route-community .my-suggestions-page h3 .suggestion-series,
html[data-theme="dark"] body.zb-route-community .mine-overview-copy {
    color: var(--zb-muted) !important;
}

html[data-theme="dark"] body.zb-route-community .mine-overview {
    border-color: var(--zb-line) !important;
    background: #181c24 !important;
    color: var(--zb-ink-soft) !important;
    box-shadow: var(--zb-shadow-sm) !important;
}

html[data-theme="dark"] body.zb-route-community .my-suggestion-card,
html[data-theme="dark"] body.zb-route-community .mine-overview-stat,
html[data-theme="dark"] body.zb-route-community .my-suggestion-stat {
    border-color: var(--zb-line) !important;
    background: #202630 !important;
    color: var(--zb-ink-soft) !important;
    opacity: 1 !important;
    box-shadow: var(--zb-shadow-xs) !important;
}

html[data-theme="dark"] body.zb-route-community .my-suggestion-card {
    box-shadow: 0 10px 22px rgba(5, 2, 8, 0.28), inset 2px 0 0 rgba(255, 95, 148, 0.42) !important;
}

html[data-theme="dark"] body.zb-route-community .my-suggestion-card:hover {
    border-color: #80504e !important;
    background: #282f3a !important;
}

html[data-theme="dark"] body.zb-route-community .my-suggestion-card.status-completed {
    border-color: rgba(0, 200, 150, 0.42) !important;
    background: linear-gradient(135deg, rgba(0, 200, 150, 0.14), #202630) !important;
    color: var(--zb-ink) !important;
    opacity: 1 !important;
    box-shadow: 0 10px 22px rgba(5, 2, 8, 0.28), inset 2px 0 0 rgba(0, 200, 150, 0.55) !important;
}

html[data-theme="dark"] body.zb-route-community .my-suggestion-card :where(strong, .my-suggestion-stat strong),
html[data-theme="dark"] body.zb-route-community .mine-overview-stat strong {
    color: var(--zb-ink) !important;
}

html[data-theme="dark"] body.zb-route-community .my-suggestion-card :where(.suggestion-series, .my-suggestion-stat span, .suggestion-admin-note),
html[data-theme="dark"] body.zb-route-community .mine-overview-stat span {
    color: var(--zb-muted) !important;
}

html[data-theme="dark"] body.zb-route-community .my-suggestion-state {
    border-color: var(--zb-line) !important;
    background: #242a34 !important;
    color: var(--zb-ink-soft) !important;
}

html[data-theme="dark"] body.zb-route-community .my-suggestion-state.is-completed,
html[data-theme="dark"] body.zb-route-community .my-suggestion-card.status-completed .my-suggestion-state {
    border-color: rgba(0, 200, 150, 0.48) !important;
    background: rgba(0, 200, 150, 0.18) !important;
    color: #bff7e6 !important;
}

html[data-theme="dark"] body.zb-route-community .my-suggestion-state.is-funded {
    border-color: rgba(240, 194, 75, 0.42) !important;
    background: rgba(240, 194, 75, 0.14) !important;
    color: #ffe7a8 !important;
}

html[data-theme="dark"] body.zb-route-community .my-suggestion-state.is-pending {
    border-color: rgba(255, 179, 71, 0.40) !important;
    background: rgba(255, 179, 71, 0.12) !important;
    color: #ffd9a0 !important;
}

html[data-theme="dark"] body.zb-route-community .my-suggestion-link {
    border-color: rgba(255, 95, 148, 0.42) !important;
    background: rgba(255, 95, 148, 0.14) !important;
    color: #ffd8e6 !important;
}

html[data-theme="dark"] body.zb-route-community .my-suggestion-link:hover {
    background: rgba(255, 95, 148, 0.22) !important;
    color: #fff !important;
}

html[data-theme="dark"] body.zb-route-community .btn-sug-edit-inline.my-suggestion-action,
html[data-theme="dark"] body.zb-route-community .my-suggestions .zb-watch-btn.is-compact {
    border-color: var(--zb-line) !important;
    background: #242a34 !important;
    color: var(--zb-ink-soft) !important;
}

html[data-theme="dark"] body.zb-route-community .mine-overview-count {
    border-color: rgba(255, 95, 148, 0.34) !important;
    background: rgba(255, 95, 148, 0.12) !important;
    color: #ffd8e6 !important;
}

html[data-theme="dark"] body.zb-route-community .my-suggestions-page .suggestion-tier {
    border-color: rgba(255, 95, 148, 0.30) !important;
    background: rgba(255, 95, 148, 0.12) !important;
    color: #ffe1ec !important;
}

html[data-theme="dark"] body.zb-route-profile .profile-wrap.profile-layout-root .profile-layout-titlebar {
    border-color: var(--profile-hub-line) !important;
    background: #202630 !important;
    color: var(--profile-hub-ink) !important;
}

html[data-theme="dark"] body.zb-route-profile .profile-wrap.profile-layout-root .profile-layout-toggle,
html[data-theme="dark"] body.zb-route-profile .profile-wrap.profile-layout-root .profile-layout-heading {
    color: var(--profile-hub-ink) !important;
}

html[data-theme="dark"] body.zb-route-profile .profile-wrap.profile-layout-root .profile-layout-manager-btn {
    border-color: var(--profile-hub-line) !important;
    background: #202630 !important;
    color: var(--profile-hub-ink) !important;
}

html[data-theme="dark"] body.zb-route-profile .profile-wrap.profile-layout-root .profile-layout-manager-btn:is(:hover, :focus-visible) {
    border-color: #80504e !important;
    background: #39272c !important;
    color: #ffbeb7 !important;
}

html[data-theme="dark"] body.zb-route-myvotes .myvotes-page .myvotes-card-img::after {
    background: linear-gradient(145deg, #202630, #181c24) !important;
    color: var(--myvotes-copy) !important;
}

html[data-theme="dark"] body.zb-friendly-ui .btn-logout {
    border-color: var(--zb-line) !important;
    background: #202630 !important;
    color: var(--zb-ink-soft) !important;
}

/* Blog, official feed, leaderboards, alerts, and footer. */
html[data-theme="dark"] body.zb-friendly-ui.zb-route-blog :where(
    .blog-topic-row, .blog-feature, .blog-card, .blog-post-head,
    .blog-post-body, .blog-related, .blog-related-card
),
html[data-theme="dark"] body.zb-friendly-ui.zb-route-feed :where(
    .public-feed-feature, .public-feed-panel, .public-feed-card
),
html[data-theme="dark"] body.zb-friendly-ui.zb-route-official :where(.official-panel, .official-card),
html[data-theme="dark"] body.zb-friendly-ui.zb-route-leaderboard .lb-panel {
    border-color: var(--zb-line);
    background: rgba(24, 28, 36, 0.97);
    box-shadow: var(--zb-shadow-sm);
}

html[data-theme="dark"] body.zb-friendly-ui :where(.notice, .success, .alert-success, .status-success) {
    border-color: #326658;
    background: #18352f;
    color: #a8ead0;
}

html[data-theme="dark"] body.zb-friendly-ui :where(.error, .alert-error, .status-error) {
    border-color: #79464c;
    background: #3a2026;
    color: #ffb5ba;
}

html[data-theme="dark"] body.zb-friendly-ui :where(.site-not-found-panel, .site-toast, .vote-toast) {
    border-color: var(--zb-line);
    background: #1b2028;
    color: var(--zb-ink);
    box-shadow: var(--zb-shadow-md);
}

html[data-theme="dark"] body.zb-friendly-ui .site-footer {
    border-color: var(--zb-line);
    background: rgba(20, 24, 31, 0.97);
}

html[data-theme="dark"] body.zb-friendly-ui :where(.footer-tagline, .footer-copy) {
    color: var(--zb-muted);
}

html[data-theme="dark"] body.zb-friendly-ui .footer-nav a {
    color: #bdc6d1;
}

/* ZBaiArt3D has inline light-surface styles; this targeted layer repairs both hero and lane copy. */
html[data-theme="dark"] body.zb-route-zbwestern :where(
    .western-hero h1, .western-hero-title, .western-lane-block h2,
    .western-lane-block h3, .western-lane-block strong
) {
    color: var(--zb-ink) !important;
}

html[data-theme="dark"] body.zb-route-zbwestern :where(
    .western-hero p, .western-hero-sub, .western-lane-block p,
    .western-lane-block li, .western-lane-block span
) {
    color: var(--zb-muted) !important;
}

html[data-theme="dark"] body.zb-route-zbwestern :where(.western-lane-block, .campaign-teaser) {
    border-color: var(--zb-line) !important;
    background: #181c24 !important;
}

html[data-theme="dark"] body.zb-route-zbwestern .western-lane-btn.is-primary {
    border-color: #ff948a !important;
    background: #ff948a !important;
    color: #261719 !important;
}

@media (max-width: 760px) {
    html[data-theme="dark"] body.zb-friendly-ui .nav-links a:not(.btn-patreon):not(.btn-patreon-login) {
        border-color: var(--zb-line);
        background: #1b2028;
    }
}

@media (prefers-contrast: more) {
    html[data-theme="dark"] {
        --zb-muted: #d2d8df;
        --zb-line: #647080;
        --zb-line-strong: #7b8796;
    }
}

/* July 2026 authenticated UI closeout: shared controls and dense member views. */
html[data-theme="dark"] body.zb-route-zbaiart .top-tab-bar.zb-main-tabs {
    border-bottom: 0 !important;
}

html[data-theme="dark"] body.zb-route-zbaiart .zb-main-tabs .tab-group {
    align-items: stretch;
}

html[data-theme="dark"] body.zb-route-zbaiart .zb-main-tabs .top-tab {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    margin-bottom: 0;
    border: 1px solid var(--zb-line) !important;
    border-radius: 10px;
    background: #1b2028 !important;
    color: #c9d1db !important;
}

html[data-theme="dark"] body.zb-route-zbaiart .zb-main-tabs .top-tab:is(:hover, :focus-visible, .active) {
    border-color: #80504e !important;
    background: #39272c !important;
    color: #ffbeb7 !important;
}

html[data-theme="dark"] body.zb-route-zbaiart .zb-main-tabs :where(.top-tab, .tab-group)::after {
    content: none !important;
    display: none !important;
}

html[data-theme="dark"] body.zb-route-zbaiart :where(
    .tutorial-shortcut-grid strong,
    .tutorial-coin-friendly-grid strong,
    .tutorial-coin-friendly-head h2
) {
    color: var(--zb-ink) !important;
}

html[data-theme="dark"] body.zb-route-zbaiart :where(
    .tutorial-shortcut-grid small,
    .tutorial-coin-friendly-grid small,
    .tutorial-coin-friendly-head p,
    .tutorial-coin-friendly-spend
) {
    color: var(--zb-muted) !important;
}

html[data-theme="dark"] body.zb-route-zbaiart :where(.zb-tab-launch, .zb-tab-activity) > .cycle-countdown-banner.vote-action-shelf {
    min-height: 0;
    padding: 0;
    border: 0 !important;
    border-radius: 0;
    background: transparent !important;
    box-shadow: none !important;
}

html[data-theme="dark"] body.zb-route-zbaiart .zb-tab-activity .act-rank-context {
    border-color: var(--zb-line) !important;
    background: #181c24 !important;
}

html[data-theme="dark"] body.zb-route-zbaiart .zb-tab-activity .act-rank-card {
    border-color: var(--zb-line) !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: var(--zb-ink-soft) !important;
    box-shadow: none !important;
}

html[data-theme="dark"] body.zb-route-zbaiart .zb-tab-activity .act-rank-card strong {
    color: var(--zb-ink) !important;
}

html[data-theme="dark"] body.zb-route-zbaiart .zb-tab-activity .act-rank-card span {
    color: var(--zb-muted) !important;
}

html[data-theme="dark"] body.zb-route-community .suggest-queue .sug-card-progress-line {
    min-height: 28px;
    padding: 5px 7px;
    border: 1px solid var(--zb-line) !important;
    border-radius: 7px;
    background: #181c24 !important;
    color: var(--zb-muted) !important;
}

html[data-theme="dark"] body.zb-route-community .suggest-queue .sug-vote-bar-wrap {
    background: #3a4350 !important;
}

html[data-theme="dark"] body.zb-route-community .suggest-queue :where(
    .member-support-tracker,
    .sug-decision-stack.is-card .member-support-tracker
) {
    border: 1px solid #665234 !important;
    background: #352d20 !important;
    color: #f3ca76 !important;
    box-shadow: none !important;
}

html[data-theme="dark"] body.zb-route-community .suggest-queue .member-support-tracker.is-maxed {
    border-color: #376f66 !important;
    background: #1d3935 !important;
    color: #93ded5 !important;
}

html[data-theme="dark"] body.zb-route-community .suggest-queue :where(
    .member-support-label,
    .sug-support-meter,
    .sug-support-meter span
) {
    color: inherit !important;
}

/* July 2026 dark-mode closeout for flattened route furniture. */
html[data-theme="dark"] body.zb-route-characters .ci-search-row .ci-sort-row,
html[data-theme="dark"] body.zb-route-halloffame :where(.hof-sort-row, .hof-tier-row) {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

html[data-theme="dark"] body.zb-route-series .si-head {
    border: 0 !important;
    border-bottom: 1px solid var(--zb-line) !important;
    background: transparent !important;
    box-shadow: none !important;
}

html[data-theme="dark"] body.zb-route-series .si-head :where(h1, .si-title) {
    color: var(--zb-ink) !important;
}

html[data-theme="dark"] body.zb-route-series .si-head :where(.si-sub, .si-intro, .si-count) {
    color: var(--zb-muted) !important;
}

html[data-theme="dark"] body.zb-route-community :where(.suggestions-return-banner, .how-it-works) {
    border: 0 !important;
    border-bottom: 1px solid var(--zb-line) !important;
    background: transparent !important;
    box-shadow: none !important;
}

html[data-theme="dark"] body.zb-route-community :where(
    .suggestions-simplified-tabs,
    .suggestions-simplified-tabs .tab-group,
    .suggestions-status-subtabs
) {
    border: 0 !important;
    border-bottom: 1px solid var(--zb-line) !important;
    background: transparent !important;
    box-shadow: none !important;
}

html[data-theme="dark"] body.zb-route-community :where(.community-activity-panel, .suggest-queue) {
    background: transparent !important;
    box-shadow: none !important;
}

html[data-theme="dark"] body.zb-route-community .suggest-queue .sug-card-votes-row {
    background: transparent !important;
}

/* July 2026 profile readability closeout. Preserve the cosmetic palette while
   lifting secondary and disabled text above dark surfaces. */
html[data-theme="dark"] body.zb-route-profile .profile-wrap.profile-layout-root :where(
    .collection-track-meta,
    .collection-track-next,
    .profile-make-contributor-detail,
    .profile-make-goal small,
    .profile-make-featured-meta,
    .profile-make-featured-stats small
) {
    color: #c8d0dc !important;
}

html[data-theme="dark"] body.zb-route-profile .profile-wrap.profile-layout-root :where(
    .profile-make-kicker,
    .profile-make-tier-pill,
    .profile-make-badge,
    .collection-track-cost,
    .collection-coin-pill
) {
    color: #f3ca76 !important;
}

html[data-theme="dark"] body.zb-route-profile .profile-wrap.profile-layout-root .ach-item.locked :where(.ach-name, .ach-emoji, .ach-tier-dot) {
    opacity: 0.68;
}

html[data-theme="dark"] body.zb-route-profile .profile-wrap.profile-layout-root .ach-item.locked-forever :where(.ach-name, .ach-emoji, .ach-tier-dot) {
    opacity: 0.66;
}

html[data-theme="dark"] body.zb-route-profile .profile-wrap.profile-layout-root .ach-feature-toggle:disabled {
    color: #f3ca76 !important;
    opacity: 0.72;
}