/*
 * NextReader Silent Graphite visual system
 * Version: v3.3.0
 * Generated Date: 2026-07-26 CST
 *
 * Boundary: visual tokens, color, material, borders, shadows and welcome-logo
 * rendering only. Existing layout, typography, DOM, copy and interaction
 * geometry remain authoritative in the inherited v3.2.3 styles.
 */

/* ── Accent system: Darrk Gold is the default visual signature ── */
:root,
[data-accent="amber"] {
  --accent-primary: #f8b800;
  --accent-secondary: #c98f00;
  --accent-amber: #f8b800;
  --accent-warm: #c98f00;
  --accent-green: #f8b800;
  --accent-orange: #c98f00;
  --accent-orange-strong: #ffd04f;
  --accent-pr: 248;
  --accent-pg: 184;
  --accent-pb: 0;
  --accent-sr: 201;
  --accent-sg: 143;
  --accent-sb: 0;
  --accent-str: 255;
  --accent-stg: 208;
  --accent-stb: 79;
}

[data-accent="red"] {
  --accent-primary: #ef4444;
  --accent-secondary: #dc2626;
  --accent-amber: #ef4444;
  --accent-warm: #dc2626;
  --accent-green: #ef4444;
  --accent-orange: #dc2626;
  --accent-orange-strong: #f87171;
  --accent-pr: 239;
  --accent-pg: 68;
  --accent-pb: 68;
  --accent-sr: 220;
  --accent-sg: 38;
  --accent-sb: 38;
  --accent-str: 248;
  --accent-stg: 113;
  --accent-stb: 113;
}

[data-accent="coral"] {
  --accent-primary: #d7a642;
  --accent-secondary: #c9772a;
  --accent-amber: #d7a642;
  --accent-warm: #c9772a;
  --accent-green: #d7a642;
  --accent-orange: #c9772a;
  --accent-orange-strong: #e1a04a;
  --accent-pr: 215;
  --accent-pg: 166;
  --accent-pb: 66;
  --accent-sr: 201;
  --accent-sg: 119;
  --accent-sb: 42;
  --accent-str: 225;
  --accent-stg: 160;
  --accent-stb: 74;
}

[data-accent="emerald"] {
  --accent-primary: #5ea880;
  --accent-secondary: #3d7a5c;
  --accent-amber: #5ea880;
  --accent-warm: #3d7a5c;
  --accent-green: #5ea880;
  --accent-orange: #3d7a5c;
  --accent-orange-strong: #82c4a0;
  --accent-pr: 94;
  --accent-pg: 168;
  --accent-pb: 128;
  --accent-sr: 61;
  --accent-sg: 122;
  --accent-sb: 92;
  --accent-str: 130;
  --accent-stg: 196;
  --accent-stb: 160;
}

[data-accent="teal"] {
  --accent-primary: #2dd4bf;
  --accent-secondary: #14a094;
  --accent-amber: #2dd4bf;
  --accent-warm: #14a094;
  --accent-green: #2dd4bf;
  --accent-orange: #14a094;
  --accent-orange-strong: #5fe0d0;
  --accent-pr: 45;
  --accent-pg: 212;
  --accent-pb: 191;
  --accent-sr: 20;
  --accent-sg: 160;
  --accent-sb: 148;
  --accent-str: 95;
  --accent-stg: 224;
  --accent-stb: 208;
}

[data-accent="sapphire"] {
  --accent-primary: #60a5fa;
  --accent-secondary: #3b82f6;
  --accent-amber: #60a5fa;
  --accent-warm: #3b82f6;
  --accent-green: #60a5fa;
  --accent-orange: #3b82f6;
  --accent-orange-strong: #8dbdfc;
  --accent-pr: 96;
  --accent-pg: 165;
  --accent-pb: 250;
  --accent-sr: 59;
  --accent-sg: 130;
  --accent-sb: 246;
  --accent-str: 141;
  --accent-stg: 189;
  --accent-stb: 252;
}

[data-accent="violet"] {
  --accent-primary: #a78bfa;
  --accent-secondary: #7c3aed;
  --accent-amber: #a78bfa;
  --accent-warm: #7c3aed;
  --accent-green: #a78bfa;
  --accent-orange: #7c3aed;
  --accent-orange-strong: #c4b5fd;
  --accent-pr: 167;
  --accent-pg: 139;
  --accent-pb: 250;
  --accent-sr: 124;
  --accent-sg: 58;
  --accent-sb: 237;
  --accent-str: 196;
  --accent-stg: 181;
  --accent-stb: 253;
}

[data-accent="pink"] {
  --accent-primary: #f472b6;
  --accent-secondary: #db2777;
  --accent-amber: #f472b6;
  --accent-warm: #db2777;
  --accent-green: #f472b6;
  --accent-orange: #db2777;
  --accent-orange-strong: #f9a8d4;
  --accent-pr: 244;
  --accent-pg: 114;
  --accent-pb: 182;
  --accent-sr: 219;
  --accent-sg: 39;
  --accent-sb: 119;
  --accent-str: 249;
  --accent-stg: 168;
  --accent-stb: 212;
}

/* ── Dark material authority ── */
:root {
  color-scheme: dark;
  --bg-dark: #101113;
  --panel-bg: rgba(31, 34, 37, 0.72);
  --panel-border: rgba(250, 250, 247, 0.105);
  --text-main: #f1f0ec;
  --text-muted: #aaa8a2;
  --text-secondary: #74726d;
  --reader-surface: rgba(16, 17, 19, 0.94);
  --reader-surface-strong: rgba(23, 25, 28, 0.97);
  --reader-ink: #deddd8;
  --reader-ink-strong: #fafaf7;
  --reader-ink-muted: #aaa8a2;
  --reader-rule: rgba(250, 250, 247, 0.13);
  --reader-code-bg: rgba(8, 9, 10, 0.92);
  --reader-main-canvas-base: #101113;
  --reader-main-canvas:
    radial-gradient(circle at 52% 18%, rgba(250, 250, 247, 0.018), transparent 34%),
    linear-gradient(90deg, rgba(0, 0, 0, 0.08), transparent 18%, transparent 82%, rgba(0, 0, 0, 0.12)),
    var(--reader-main-canvas-base);
  --reader-code-border: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.17);
  --sg-base: #101113;
  --sg-base-soft: #0d0f11;
  --sg-surface: #101113;
  --sg-surface-raised: #171a1d;
  --sg-graphite: #202326;
  --sg-hairline: rgba(250, 250, 247, 0.105);
  --sg-hairline-soft: rgba(250, 250, 247, 0.065);
  --sg-glint: rgba(250, 250, 247, 0.055);
  --sg-shadow: rgba(0, 0, 0, 0.52);
  --sg-danger: #e47770;
  --sg-success: #55b487;
  --nr-control-surface: rgba(23, 26, 29, 0.94);
  --nr-control-surface-hover: rgba(35, 39, 43, 0.98);
  --nr-control-border: rgba(250, 250, 247, 0.15);
  --nr-control-text: #deddd8;
  --nr-control-text-muted: #aaa8a2;
  --nr-control-focus-ring: var(--accent-primary);
  --nr-control-active-surface: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.16);
  --nr-control-active-border: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.72);
  --nr-control-active-text: var(--accent-primary);
  --nr-control-success: var(--sg-success);
  --nr-control-danger: var(--sg-danger);
  --nr-copy-surface: rgba(13, 15, 17, 0.94);
  --nr-copy-surface-hover: rgba(27, 30, 33, 0.98);
  --nr-pill-surface: rgba(16, 17, 19, 0.9);
  --nr-progress-surface: rgba(16, 18, 20, 0.94);
  --nr-source-surface: #0d0f11;
  --nr-source-gutter-surface: #121518;
  --nr-source-selection: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.28);
  --nr-slide-stage-surface: #0d0f11;
  --nr-slide-page-surface: #ffffff;
  --nr-pptx-placeholder-surface: rgba(26, 30, 34, 0.96);
  --nr-pptx-placeholder-border: rgba(250, 250, 247, 0.3);
  --nr-pptx-placeholder-text: #deddd8;
  --nr-pptx-placeholder-text-muted: #aaa8a2;
  --nr-pptx-table-surface: rgba(23, 26, 29, 0.97);
  --nr-pptx-table-text: #deddd8;
  --nr-pptx-table-border: rgba(250, 250, 247, 0.24);
  --nr-pptx-bullet-color: currentColor;
  --nr-syntax-comment: #8b98a5;
  --nr-syntax-string: #b9d98c;
  --nr-syntax-number: #d3b0ff;
  --nr-syntax-keyword: #ff9cac;
  --nr-syntax-type: #8dcff4;
  --nr-syntax-function: #ffd580;
  --nr-syntax-property: #83d8ce;
  --nr-syntax-operator: #c9d2da;
  --nr-syntax-punctuation: #9aa6b2;
  --nr-syntax-constant: #ffa97a;
  --nr-syntax-tag: #7fd5ff;
  --nr-syntax-attribute: #c6e48b;
  --nr-syntax-inserted: #8dd5a2;
  --nr-syntax-deleted: #ff9a9a;
  --ai-fab-bg: linear-gradient(145deg, rgba(29, 29, 29, 0.98), rgba(12, 12, 12, 0.99));
  --ai-fab-color: var(--accent-primary);
  --ai-fab-shadow: 0 10px 26px rgba(0, 0, 0, 0.38), inset 0 1px 0 rgba(250, 250, 247, 0.055);
  --ai-modal-bg: linear-gradient(180deg, #181818, #090909);
  --ai-modal-border: 1px solid var(--sg-hairline);
  --ai-modal-shadow: 0 26px 84px rgba(0, 0, 0, 0.58), inset 0 1px 0 var(--sg-glint);
  --ai-header-bg: #151515;
  --ai-header-border: var(--sg-hairline-soft);
  --ai-title-color: #fafaf7;
  --ai-bubble-user-bg: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.115);
  --ai-bubble-user-border: 1px solid rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.25);
  --ai-bubble-user-color: #fafaf7;
  --ai-bubble-assistant-bg: #171717;
  --ai-bubble-assistant-border: 1px solid var(--sg-hairline-soft);
  --ai-bubble-assistant-color: #deddd8;
  --ai-input-bg: #1c1c1c;
  --ai-input-border: var(--sg-hairline);
  --ai-input-color: #f1f0ec;
  --ai-input-focus-border: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.56);
  --ai-accent: var(--accent-primary);
  --ai-accent-hover: var(--accent-secondary);
  --ai-text: #f1f0ec;
  --ai-text-muted: #9d9b95;
  --ai-divider: var(--sg-hairline-soft);
  --ai-settings-bg: rgba(14, 14, 14, 0.992);
  --ai-settings-border: 1px solid var(--sg-hairline);
  --ai-settings-input-bg: rgba(250, 250, 247, 0.035);
  --ai-settings-input-border: var(--sg-hairline);
}

/* ── Warm-white light material ── */
[data-theme="light"] {
  color-scheme: light;
  --bg-dark: #fafaf7;
  --panel-bg: rgba(245, 246, 247, 0.82);
  --panel-border: rgba(8, 8, 8, 0.12);
  --text-main: #1f1f1f;
  --text-muted: #66645f;
  --text-secondary: #8a8780;
  --reader-surface: rgba(250, 250, 247, 0.96);
  --reader-surface-strong: rgba(245, 246, 247, 0.98);
  --reader-ink: #32312f;
  --reader-ink-strong: #080808;
  --reader-ink-muted: #66645f;
  --reader-rule: rgba(8, 8, 8, 0.12);
  --reader-code-bg: rgba(31, 31, 31, 0.055);
  --reader-code-border: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.16);
  --sg-base: #fafaf7;
  --sg-base-soft: #f5f6f7;
  --sg-surface: #fafaf7;
  --sg-surface-raised: #ffffff;
  --sg-graphite: #1f1f1f;
  --sg-hairline: rgba(8, 8, 8, 0.12);
  --sg-hairline-soft: rgba(8, 8, 8, 0.075);
  --sg-glint: rgba(255, 255, 255, 0.78);
  --sg-shadow: rgba(31, 31, 31, 0.12);
  --sg-danger: #b6413b;
  --sg-success: #287554;
  --nr-control-surface: rgba(255, 255, 255, 0.94);
  --nr-control-surface-hover: rgba(245, 246, 247, 0.98);
  --nr-control-border: rgba(8, 8, 8, 0.16);
  --nr-control-text: #32312f;
  --nr-control-text-muted: #66645f;
  --nr-control-focus-ring: var(--accent-secondary);
  --nr-control-active-surface: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.12);
  --nr-control-active-border: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.68);
  --nr-control-active-text: var(--accent-secondary);
  --nr-control-success: var(--sg-success);
  --nr-control-danger: var(--sg-danger);
  --nr-copy-surface: rgba(255, 255, 255, 0.96);
  --nr-copy-surface-hover: rgba(245, 246, 247, 0.99);
  --nr-pill-surface: rgba(255, 255, 255, 0.92);
  --nr-progress-surface: rgba(255, 255, 255, 0.96);
  --nr-source-surface: #fbfbf8;
  --nr-source-gutter-surface: #f1f2f1;
  --nr-source-selection: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.22);
  --nr-slide-stage-surface: #eceeec;
  --nr-slide-page-surface: #ffffff;
  --nr-pptx-placeholder-surface: rgba(245, 246, 247, 0.97);
  --nr-pptx-placeholder-border: rgba(8, 8, 8, 0.3);
  --nr-pptx-placeholder-text: #32312f;
  --nr-pptx-placeholder-text-muted: #66645f;
  --nr-pptx-table-surface: rgba(255, 255, 255, 0.97);
  --nr-pptx-table-text: #32312f;
  --nr-pptx-table-border: rgba(8, 8, 8, 0.22);
  --nr-pptx-bullet-color: currentColor;
  --nr-syntax-comment: #5f6b76;
  --nr-syntax-string: #2f7a4f;
  --nr-syntax-number: #6d43c0;
  --nr-syntax-keyword: #a51d50;
  --nr-syntax-type: #1e638b;
  --nr-syntax-function: #805000;
  --nr-syntax-property: #116b65;
  --nr-syntax-operator: #46515c;
  --nr-syntax-punctuation: #58636e;
  --nr-syntax-constant: #9a461f;
  --nr-syntax-tag: #17648d;
  --nr-syntax-attribute: #3f6f2c;
  --nr-syntax-inserted: #21733e;
  --nr-syntax-deleted: #b4233a;
  --ai-fab-bg: linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(239, 239, 235, 0.98));
  --ai-fab-color: var(--accent-primary);
  --ai-fab-shadow: 0 9px 24px rgba(31, 31, 31, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.9);
  --ai-modal-bg: linear-gradient(180deg, #ffffff, #f5f6f7);
  --ai-modal-border: 1px solid var(--sg-hairline);
  --ai-modal-shadow: 0 26px 74px rgba(31, 31, 31, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.88);
  --ai-header-bg: #f5f6f7;
  --ai-header-border: var(--sg-hairline-soft);
  --ai-title-color: #080808;
  --ai-bubble-user-bg: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.095);
  --ai-bubble-user-border: 1px solid rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.21);
  --ai-bubble-user-color: #1f1f1f;
  --ai-bubble-assistant-bg: #f1f2f2;
  --ai-bubble-assistant-border: 1px solid var(--sg-hairline-soft);
  --ai-bubble-assistant-color: #32312f;
  --ai-input-bg: #ffffff;
  --ai-input-border: var(--sg-hairline);
  --ai-input-color: #1f1f1f;
  --ai-input-focus-border: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.48);
  --ai-text: #1f1f1f;
  --ai-text-muted: #66645f;
  --ai-divider: var(--sg-hairline-soft);
  --ai-settings-bg: rgba(250, 250, 247, 0.995);
  --ai-settings-border: 1px solid var(--sg-hairline);
  --ai-settings-input-bg: rgba(8, 8, 8, 0.03);
  --ai-settings-input-border: var(--sg-hairline);
}

/* ── Canvas and scroll material ── */
html {
  min-height: 100%;
  background: var(--reader-main-canvas-base);
  overscroll-behavior-y: none;
}

body {
  min-height: 100dvh;
  background: var(--reader-main-canvas);
  overscroll-behavior-y: auto;
}

* {
  scrollbar-color: rgba(250, 250, 247, 0.22) rgba(250, 250, 247, 0.025);
}

*::-webkit-scrollbar-track {
  background: rgba(250, 250, 247, 0.025);
}

*::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(250, 250, 247, 0.24), rgba(250, 250, 247, 0.11));
  border-color: var(--sg-base);
}

*::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.62), rgba(250, 250, 247, 0.2));
}

::selection {
  color: var(--reader-ink-strong);
  background: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.34);
  text-shadow: none;
}

[data-theme="dark"] ::-moz-selection,
::-moz-selection {
  color: var(--reader-ink-strong);
  background: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.34);
  text-shadow: none;
}

[data-theme="light"] ::selection {
  color: #111315;
  background: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.28);
  text-shadow: none;
}

[data-theme="light"] ::-moz-selection {
  color: #111315;
  background: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.28);
  text-shadow: none;
}

[data-theme="light"] {
  --reader-main-canvas-base: #fafaf7;
  --reader-main-canvas:
    radial-gradient(circle at 52% 18%, rgba(255, 255, 255, 0.76), transparent 34%),
    linear-gradient(90deg, rgba(31, 31, 31, 0.025), transparent 18%, transparent 82%, rgba(31, 31, 31, 0.035)),
    var(--reader-main-canvas-base);
}

[data-theme="light"] * {
  scrollbar-color: rgba(8, 8, 8, 0.22) rgba(8, 8, 8, 0.035);
}

[data-theme="light"] *::-webkit-scrollbar-track {
  background: rgba(8, 8, 8, 0.035);
}

[data-theme="light"] *::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(8, 8, 8, 0.22), rgba(8, 8, 8, 0.12));
  border-color: #fafaf7;
}

/* ── Three reading planes ── */
.reader-shell {
  min-height: 100dvh;
  background: var(--reader-main-canvas);
}

.reader-sidebar {
  border-right-color: var(--sg-hairline);
  background:
    linear-gradient(180deg, rgba(250, 250, 247, 0.055), rgba(250, 250, 247, 0.016)),
    rgba(15, 17, 19, 0.94);
  box-shadow: inset -1px 0 0 rgba(0, 0, 0, 0.28);
}

.reader-main {
  min-height: inherit;
  align-self: stretch;
  background: var(--reader-main-canvas);
}

.file-navigator {
  border-left-color: var(--sg-hairline);
  background:
    linear-gradient(180deg, rgba(250, 250, 247, 0.038), rgba(250, 250, 247, 0.012)),
    rgba(14, 16, 18, 0.975);
  box-shadow: -16px 0 46px rgba(0, 0, 0, 0.16), inset 1px 0 0 rgba(250, 250, 247, 0.018);
}

[data-theme="light"] .reader-sidebar {
  border-right-color: var(--sg-hairline);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.72), rgba(245, 246, 247, 0.72)),
    #f5f6f7;
  box-shadow: inset -1px 0 0 rgba(8, 8, 8, 0.025);
}

[data-theme="light"] .reader-main {
  background: var(--reader-main-canvas);
}

[data-theme="light"] .file-navigator {
  border-left-color: var(--sg-hairline);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.9), rgba(245, 246, 247, 0.92)),
    #f5f6f7;
  box-shadow: -14px 0 38px rgba(31, 31, 31, 0.07), inset 1px 0 0 rgba(255, 255, 255, 0.64);
}

/* ── Sidebar cards and navigator controls ── */
.reader-meta-card,
.reader-stat-grid {
  border-color: var(--sg-hairline);
  background:
    linear-gradient(180deg, rgba(250, 250, 247, 0.055), rgba(250, 250, 247, 0.018)),
    rgba(24, 24, 24, 0.58);
  box-shadow: inset 0 1px 0 rgba(250, 250, 247, 0.045), 0 16px 40px rgba(0, 0, 0, 0.1);
}

.reader-stat-grid div {
  background: rgba(8, 8, 8, 0.14);
  border-right-color: var(--sg-hairline-soft);
  border-bottom-color: var(--sg-hairline-soft);
}

.back-link,
.icon-btn,
.global-refresh-btn,
.clear-cache-btn,
.tree-tool-btn,
.reader-refresh-btn {
  color: var(--reader-ink-muted);
}

.sidebar-toggle,
.icon-btn,
.global-refresh-btn,
.clear-cache-btn,
.tree-tool-btn,
.reader-refresh-btn {
  border-color: var(--sg-hairline);
  background: linear-gradient(180deg, rgba(250, 250, 247, 0.052), rgba(250, 250, 247, 0.022));
  box-shadow: inset 0 1px 0 rgba(250, 250, 247, 0.045), 0 8px 22px rgba(0, 0, 0, 0.13);
}

.sidebar-toggle {
  color: var(--accent-primary);
}

.sidebar-toggle:hover,
.icon-btn:hover,
.global-refresh-btn:hover,
.tree-tool-btn:hover,
.reader-refresh-btn:not(:disabled):hover {
  color: var(--reader-ink-strong);
  border-color: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.42);
  background: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.075);
}

.load-doc-btn,
.modal-btn {
  color: var(--reader-ink-strong);
  border-color: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.27);
  background: linear-gradient(180deg, rgba(250, 250, 247, 0.065), rgba(250, 250, 247, 0.025));
  box-shadow: inset 0 1px 0 rgba(250, 250, 247, 0.065), 0 8px 22px rgba(0, 0, 0, 0.1);
}

.load-doc-btn:hover,
.modal-btn:hover {
  border-color: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.58);
  background: linear-gradient(180deg, rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.105), rgba(250, 250, 247, 0.026));
}

.clear-cache-btn:hover {
  color: var(--sg-danger);
  border-color: rgba(224, 90, 79, 0.42);
  background: rgba(224, 90, 79, 0.075);
  box-shadow: 0 0 18px rgba(224, 90, 79, 0.08);
}

.search-wrap,
.tree-current-path {
  color: var(--accent-primary);
  border-color: var(--sg-hairline);
  background: rgba(4, 4, 4, 0.52);
  box-shadow: inset 0 1px 0 rgba(250, 250, 247, 0.018);
}

.search-wrap input {
  color: var(--reader-ink);
  caret-color: var(--accent-primary);
}

.search-wrap input::placeholder {
  color: var(--text-secondary);
}

.filter-toggle input {
  accent-color: var(--accent-primary);
}

.tree-row {
  color: var(--reader-ink-muted);
}

.tree-row:hover {
  color: var(--reader-ink-strong);
  background: rgba(250, 250, 247, 0.045);
}

.tree-row.is-active {
  color: var(--reader-ink-strong);
  background: linear-gradient(90deg, rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.11), rgba(250, 250, 247, 0.025));
  box-shadow: inset 2px 0 0 rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.7);
}

.tree-meta {
  color: var(--text-secondary);
}

.section-tag,
.theme-menu-label {
  color: var(--accent-primary);
}

[data-theme="light"] .reader-meta-card,
[data-theme="light"] .reader-stat-grid {
  border-color: var(--sg-hairline);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.86), rgba(245, 246, 247, 0.72)),
    #f5f6f7;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.86), 0 14px 34px rgba(31, 31, 31, 0.055);
}

[data-theme="light"] .reader-stat-grid div {
  background: rgba(8, 8, 8, 0.018);
  border-right-color: var(--sg-hairline-soft);
  border-bottom-color: var(--sg-hairline-soft);
}

[data-theme="light"] .sidebar-toggle,
[data-theme="light"] .icon-btn,
[data-theme="light"] .global-refresh-btn,
[data-theme="light"] .clear-cache-btn,
[data-theme="light"] .tree-tool-btn,
[data-theme="light"] .reader-refresh-btn {
  border-color: var(--sg-hairline);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(31, 31, 31, 0.025));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.92), 0 7px 18px rgba(31, 31, 31, 0.055);
}

[data-theme="light"] .load-doc-btn,
[data-theme="light"] .modal-btn {
  color: var(--reader-ink-strong);
  border-color: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.26);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(31, 31, 31, 0.025));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 8px 20px rgba(31, 31, 31, 0.05);
}

[data-theme="light"] .search-wrap,
[data-theme="light"] .tree-current-path {
  border-color: var(--sg-hairline);
  background: rgba(255, 255, 255, 0.68);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.86);
}

[data-theme="light"] .tree-row:hover {
  background: rgba(8, 8, 8, 0.04);
}

/* ── Welcome state: same geometry, calmer hierarchy ── */
.welcome-inner {
  border-color: var(--sg-hairline);
  background:
    radial-gradient(circle at 50% 6%, rgba(250, 250, 247, 0.035), transparent 30%),
    linear-gradient(180deg, rgba(20, 20, 20, 0.96), rgba(8, 8, 8, 0.97));
  box-shadow: 0 32px 104px rgba(0, 0, 0, 0.39), inset 0 1px 0 rgba(250, 250, 247, 0.05);
}

.welcome-icon-wrap {
  color: var(--accent-primary);
  isolation: isolate;
  overflow: hidden;
  border-color: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.2);
  background:
    linear-gradient(145deg, rgba(250, 250, 247, 0.07), rgba(250, 250, 247, 0.025)),
    rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.08);
  box-shadow:
    inset 0 1px 0 rgba(250, 250, 247, 0.08),
    0 16px 38px rgba(0, 0, 0, 0.22);
  -webkit-backdrop-filter: blur(16px) saturate(0.88);
  backdrop-filter: blur(16px) saturate(0.88);
}

/* The browser path keeps the exact v5.3.1 Golden Baseline filter. WebKit
 * runtimes retain the isolated fallback because CSS-filtering an external
 * raster through an SVG URL can flatten the artwork to white there. */
.welcome-icon-wrap picture {
  position: relative;
  isolation: isolate;
}

.welcome-icon-wrap picture::after {
  content: "";
  display: none;
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: currentColor;
  -webkit-mask: url("./assets/nextreader-welcome-v4.1.0.webp?v=5.4.1-r2-ui-preservation-20260815") center / contain no-repeat;
  mask: url("./assets/nextreader-welcome-v4.1.0.webp?v=5.4.1-r2-ui-preservation-20260815") center / contain no-repeat;
  mix-blend-mode: color;
}

.welcome-brand-icon {
  display: block;
  inline-size: 100%;
  block-size: 100%;
  max-inline-size: none;
  object-fit: contain;
  border-radius: 0;
  filter: url("#nr-theme-brand-filter") drop-shadow(0 8px 13px rgba(0, 0, 0, 0.24));
}

.welcome-title {
  color: var(--reader-ink-strong);
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.24);
}

.welcome-desc {
  color: var(--reader-ink-muted);
}

.format-badge {
  color: var(--reader-ink);
  border-color: var(--sg-hairline);
  background: rgba(250, 250, 247, 0.025);
  box-shadow: inset 0 1px 0 rgba(250, 250, 247, 0.025);
}

.format-badge i {
  color: var(--accent-primary);
}

.drop-zone,
.welcome-drop {
  color: var(--reader-ink);
  border-color: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.24);
  background:
    radial-gradient(circle at 50% 45%, rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.035), transparent 38%),
    rgba(250, 250, 247, 0.018);
  box-shadow: inset 0 1px 0 rgba(250, 250, 247, 0.025);
}

.drop-zone i,
.welcome-drop i {
  color: var(--accent-primary);
}

.drop-zone.is-dragover,
.welcome-drop.is-dragover {
  border-color: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.72);
  background: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.085);
  box-shadow: inset 0 0 0 1px rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.16), 0 20px 52px rgba(0, 0, 0, 0.18);
}

[data-theme="light"] .welcome-inner {
  border-color: var(--sg-hairline);
  background:
    radial-gradient(circle at 50% 6%, rgba(255, 255, 255, 0.94), transparent 31%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.91), rgba(245, 246, 247, 0.82));
  box-shadow: 0 30px 84px rgba(31, 31, 31, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

[data-theme="light"] .welcome-icon-wrap {
  border-color: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.22);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.58), rgba(31, 31, 31, 0.035)),
    rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.09);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.72),
    0 14px 32px rgba(31, 31, 31, 0.1);
}

[data-theme="light"] .format-badge {
  border-color: var(--sg-hairline);
  background: rgba(255, 255, 255, 0.66);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

[data-theme="light"] .drop-zone,
[data-theme="light"] .welcome-drop {
  border-color: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.25);
  background:
    radial-gradient(circle at 50% 45%, rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.04), transparent 40%),
    rgba(255, 255, 255, 0.48);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.84);
}

/* ── Floating action rail and theme surface ── */
.fab-group > :is(.top-fab, .ai-assistant-fab, .settings-fab, .theme-fab) {
  color: var(--accent-primary) !important;
  border-color: var(--sg-hairline) !important;
  background: linear-gradient(145deg, rgba(29, 29, 29, 0.98), rgba(11, 11, 11, 0.99)) !important;
  box-shadow:
    0 10px 26px rgba(0, 0, 0, 0.38),
    inset 0 1px 0 rgba(250, 250, 247, 0.06) !important;
}

.fab-group > :is(.top-fab, .ai-assistant-fab, .settings-fab, .theme-fab):hover {
  color: var(--accent-primary) !important;
  border-color: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.5) !important;
  background: linear-gradient(145deg, rgba(35, 35, 35, 0.99), rgba(13, 13, 13, 0.99)) !important;
  box-shadow:
    0 12px 30px rgba(0, 0, 0, 0.44),
    0 0 0 1px rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.11),
    inset 0 1px 0 rgba(250, 250, 247, 0.075) !important;
}

.fab-group > :is(.top-fab, .ai-assistant-fab, .settings-fab, .theme-fab):active {
  box-shadow:
    inset 0 3px 10px rgba(0, 0, 0, 0.58),
    inset 0 1px 0 rgba(250, 250, 247, 0.025) !important;
}

.theme-menu {
  border-color: var(--sg-hairline);
  background:
    linear-gradient(180deg, rgba(25, 28, 31, 0.992), rgba(10, 12, 14, 0.994)),
    var(--sg-base);
  box-shadow: 0 26px 82px rgba(0, 0, 0, 0.56), inset 0 1px 0 rgba(250, 250, 247, 0.055);
}

.theme-mode-btn,
.theme-color-btn {
  border-color: var(--sg-hairline);
  background: rgba(250, 250, 247, 0.032);
  color: var(--reader-ink-muted);
}

.theme-mode-btn:hover,
.theme-color-btn:hover {
  color: var(--reader-ink-strong);
  border-color: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.36);
  background: rgba(250, 250, 247, 0.055);
}

.theme-mode-btn.is-active,
.theme-color-btn.is-active {
  color: var(--reader-ink-strong);
  border-color: var(--accent-primary);
  background: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.105);
  box-shadow: 0 0 0 1px rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.08);
}

.theme-color-btn[data-accent="red"] > span {
  background: linear-gradient(135deg, #f87171, #b91c1c) !important;
}

.theme-color-btn[data-accent="coral"] > span {
  background: linear-gradient(135deg, #e4b458, #b0681e) !important;
}

.theme-color-btn[data-accent="amber"] > span {
  background: linear-gradient(135deg, #ffd04f, #c98f00) !important;
}

.theme-color-btn[data-accent="emerald"] > span {
  background: linear-gradient(135deg, #82c4a0, #3d7a5c) !important;
}

.theme-color-btn[data-accent="teal"] > span {
  background: linear-gradient(135deg, #5fe0d0, #0d9488) !important;
}

.theme-color-btn[data-accent="sapphire"] > span {
  background: linear-gradient(135deg, #93bbfc, #2563eb) !important;
}

.theme-color-btn[data-accent="violet"] > span {
  background: linear-gradient(135deg, #c4b5fd, #6d28d9) !important;
}

.theme-color-btn[data-accent="pink"] > span {
  background: linear-gradient(135deg, #f9a8d4, #be185d) !important;
}

[data-theme="light"] .fab-group > :is(.top-fab, .ai-assistant-fab, .settings-fab, .theme-fab) {
  border-color: var(--sg-hairline) !important;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(239, 239, 235, 0.98)) !important;
  box-shadow:
    0 9px 24px rgba(31, 31, 31, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.92) !important;
}

[data-theme="light"] .theme-menu {
  border-color: var(--sg-hairline);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.995), rgba(245, 246, 247, 0.992)),
    #fafaf7;
  box-shadow: 0 24px 70px rgba(31, 31, 31, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.94);
}

[data-theme="light"] .theme-mode-btn,
[data-theme="light"] .theme-color-btn {
  border-color: var(--sg-hairline);
  background: rgba(8, 8, 8, 0.025);
  color: var(--reader-ink-muted);
}

/* ── Reader documents, overlays and utility surfaces ── */
.reader-shell.has-active-document .reader-paper-wrap,
.loader-modal,
.last-session-card,
.context-menu,
.translation-panel {
  color: var(--reader-ink);
  border-color: var(--sg-hairline);
  background:
    linear-gradient(180deg, rgba(250, 250, 247, 0.035), rgba(250, 250, 247, 0.012)),
    var(--reader-surface);
  box-shadow: 0 24px 74px rgba(0, 0, 0, 0.32), inset 0 1px 0 rgba(250, 250, 247, 0.04);
}

.modal-overlay {
  background: rgba(0, 0, 0, 0.62);
  backdrop-filter: blur(16px) saturate(0.84);
  -webkit-backdrop-filter: blur(16px) saturate(0.84);
}

.ai-assistant-modal-backdrop {
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.floating-toolbar,
.document-search-bar,
.pdf-controls,
.image-controls,
.ocr-panel {
  color: var(--reader-ink);
  border-color: var(--sg-hairline) !important;
  background: linear-gradient(180deg, rgba(25, 28, 31, 0.965), rgba(10, 12, 14, 0.975)) !important;
  box-shadow: 0 16px 44px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(250, 250, 247, 0.05) !important;
}

.floating-toolbar .toolbar-settings-popover {
  color: var(--reader-ink);
  border-color: var(--sg-hairline);
  background: linear-gradient(180deg, rgba(25, 28, 31, 0.99), rgba(10, 12, 14, 0.995));
  box-shadow: 0 20px 52px rgba(0, 0, 0, 0.48), inset 0 1px 0 rgba(250, 250, 247, 0.05);
}

[data-theme="light"] .floating-toolbar .toolbar-settings-popover {
  color: var(--reader-ink);
  border-color: var(--sg-hairline);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.995), rgba(245, 246, 247, 0.985));
  box-shadow: 0 18px 48px rgba(31, 31, 31, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.96);
}

.markdown-panel th {
  color: var(--reader-ink-strong);
  background: rgba(250, 250, 247, 0.05);
}

.markdown-panel td {
  color: var(--reader-ink);
  background: rgba(250, 250, 247, 0.018);
}

.markdown-panel code,
.txt-content,
.ocr-output {
  color: var(--reader-ink);
}

[data-theme="light"] .reader-shell.has-active-document .reader-paper-wrap,
[data-theme="light"] .loader-modal,
[data-theme="light"] .last-session-card,
[data-theme="light"] .context-menu,
[data-theme="light"] .translation-panel {
  border-color: var(--sg-hairline);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(245, 246, 247, 0.88)),
    #fafaf7;
  box-shadow: 0 22px 64px rgba(31, 31, 31, 0.11), inset 0 1px 0 rgba(255, 255, 255, 0.94);
}

[data-theme="light"] .floating-toolbar,
[data-theme="light"] .document-search-bar,
[data-theme="light"] .pdf-controls,
[data-theme="light"] .image-controls,
[data-theme="light"] .ocr-panel {
  color: var(--reader-ink);
  border-color: var(--sg-hairline) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(245, 246, 247, 0.96)) !important;
  box-shadow: 0 14px 38px rgba(31, 31, 31, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.94) !important;
}

.reading-layout-control,
[data-theme="light"] .reading-layout-control {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* ── Settings center: neutral graphite, same mature information architecture ── */
.nr-settings-backdrop {
  --ai-settings-bg: rgba(14, 16, 18, 0.994);
  --ai-settings-border: 1px solid var(--sg-hairline);
  --ai-settings-input-bg: rgba(250, 250, 247, 0.035);
  --ai-settings-input-border: var(--sg-hairline);
  --ai-input-color: #f1f0ec;
  --ai-text-muted: #9d9b95;
  --ai-accent: var(--accent-primary);
  background: rgba(0, 0, 0, 0.67);
  backdrop-filter: blur(18px) saturate(0.82);
  -webkit-backdrop-filter: blur(18px) saturate(0.82);
}

.nr-settings-panel {
  color: var(--ai-input-color);
  background:
    linear-gradient(180deg, rgba(250, 250, 247, 0.025), transparent 24%),
    var(--ai-settings-bg);
  border-color: var(--sg-hairline);
  box-shadow: 0 30px 92px rgba(0, 0, 0, 0.62), inset 0 1px 0 rgba(250, 250, 247, 0.055);
}

.nr-settings-head,
.nr-settings-actions {
  background: rgba(250, 250, 247, 0.012);
}

.nr-settings-nav,
.nr-settings-actions {
  border-color: var(--sg-hairline-soft);
}

.nr-settings-title > i,
.nr-settings-nav button.is-active {
  color: var(--ai-accent);
  border-color: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.24);
  background: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.085);
}

.nr-settings-head > button,
.nr-settings-nav button:hover,
.nr-settings-group > input,
.nr-api-switch,
.nr-check,
.nr-route-status div,
.nr-privacy-grid div,
.nr-settings-note,
.ai-settings-combobox-trigger {
  color: var(--ai-input-color);
  border-color: var(--sg-hairline);
  background: rgba(250, 250, 247, 0.032);
  box-shadow: inset 0 1px 0 rgba(250, 250, 247, 0.016);
}

.nr-settings-group > input:focus,
.ai-settings-combobox-trigger:focus-visible,
.ai-settings-combobox.is-open .ai-settings-combobox-trigger {
  border-color: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.68);
  box-shadow: 0 0 0 3px rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.1);
}

.ai-settings-combobox-list {
  color: var(--ai-input-color);
  border-color: var(--sg-hairline);
  background:
    linear-gradient(180deg, rgba(250, 250, 247, 0.026), transparent),
    rgba(12, 14, 16, 0.995);
  box-shadow: 0 22px 56px rgba(0, 0, 0, 0.52), inset 0 1px 0 rgba(250, 250, 247, 0.045);
  backdrop-filter: blur(18px) saturate(0.84);
  -webkit-backdrop-filter: blur(18px) saturate(0.84);
}

.ai-settings-combobox-option:hover,
.ai-settings-combobox-option:focus-visible,
.ai-settings-combobox-option[aria-selected="true"] {
  color: var(--ai-accent);
  background: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.09);
}

.ai-settings-switch-track {
  border-color: var(--sg-hairline);
  background: rgba(250, 250, 247, 0.045);
}

.ai-settings-switch-track::after {
  background: #8d8a83;
  box-shadow: 0 2px 7px rgba(0, 0, 0, 0.38);
}

.ai-settings-switch input:checked + .ai-settings-switch-track {
  border-color: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.48);
  background: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.17);
}

.ai-settings-switch input:checked + .ai-settings-switch-track::after {
  background: var(--ai-accent);
}

.nr-secret-row span[data-state="connected"],
.nr-route-status strong[data-state="connected"],
.nr-route-status strong[data-state="available"] {
  color: var(--sg-success);
}

.nr-route-status strong[data-state="unavailable"] {
  color: var(--sg-danger);
}

#nr-settings-save {
  color: #080808;
  background: var(--ai-accent);
  box-shadow: 0 8px 22px rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.15);
}

[data-theme="light"] .nr-settings-backdrop {
  --ai-settings-bg: rgba(250, 250, 247, 0.997);
  --ai-settings-border: 1px solid var(--sg-hairline);
  --ai-settings-input-bg: rgba(8, 8, 8, 0.03);
  --ai-settings-input-border: var(--sg-hairline);
  --ai-input-color: #1f1f1f;
  --ai-text-muted: #66645f;
  background: rgba(31, 31, 31, 0.28);
}

[data-theme="light"] .nr-settings-panel {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.9), transparent 24%),
    var(--ai-settings-bg);
  border-color: var(--sg-hairline);
  box-shadow: 0 28px 78px rgba(31, 31, 31, 0.17), inset 0 1px 0 rgba(255, 255, 255, 0.96);
}

[data-theme="light"] .nr-settings-head > button,
[data-theme="light"] .nr-settings-nav button:hover,
[data-theme="light"] .nr-settings-group > input,
[data-theme="light"] .nr-api-switch,
[data-theme="light"] .nr-check,
[data-theme="light"] .nr-route-status div,
[data-theme="light"] .nr-privacy-grid div,
[data-theme="light"] .nr-settings-note,
[data-theme="light"] .ai-settings-combobox-trigger {
  color: var(--ai-input-color);
  border-color: var(--sg-hairline);
  background: rgba(8, 8, 8, 0.028);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.74);
}

[data-theme="light"] .ai-settings-combobox-list {
  color: var(--ai-input-color);
  border-color: var(--sg-hairline);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), transparent),
    rgba(250, 250, 247, 0.997);
  box-shadow: 0 20px 48px rgba(31, 31, 31, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.94);
}

/* ── AI dialogue: inherit the same material language ── */
.ai-assistant-modal {
  background: var(--ai-modal-bg);
  border-color: var(--sg-hairline);
  box-shadow: var(--ai-modal-shadow);
  isolation: isolate;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.ai-modal-header,
.ai-chat-form {
  background: var(--ai-header-bg);
  border-color: var(--sg-hairline-soft);
}

.ai-chat-status {
  color: var(--ai-text-muted);
  background: #111111;
  border-color: var(--sg-hairline-soft);
}

.ai-chat-history {
  background: #0b0b0b;
}

.ai-chat-status-rag,
.ai-chat-status-refresh,
.ai-chat-status-collab,
.ai-chat-status-interval,
.ai-header-btn,
.ai-secondary-btn {
  color: var(--ai-text-muted);
  border-color: var(--sg-hairline);
  background: transparent;
}

.ai-chat-status-rag:hover,
.ai-chat-status-refresh:hover,
.ai-chat-status-collab:hover,
.ai-chat-status-interval:hover,
.ai-header-btn:hover,
.ai-secondary-btn:hover {
  color: var(--ai-accent);
  border-color: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.42);
  background: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.075);
}

.ai-chat-input,
.ai-settings-input,
.ai-settings-select {
  color: var(--ai-input-color);
  border-color: var(--sg-hairline);
  background: var(--ai-input-bg);
  caret-color: var(--ai-accent);
}

.ai-chat-input:focus,
.ai-settings-input:focus {
  border-color: var(--ai-input-focus-border);
  box-shadow: 0 0 0 3px rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.09);
}

.ai-send-btn,
.ai-chat-submit,
.ai-settings-btn.primary {
  color: #080808;
  background: var(--ai-accent);
  box-shadow: 0 8px 22px rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.14);
}

.ai-send-btn:hover,
.ai-chat-submit:hover,
.ai-settings-btn.primary:hover {
  color: #080808;
  background: var(--ai-accent-hover);
}

.ai-message.user,
.ai-bubble.user {
  color: var(--ai-bubble-user-color);
  border-color: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.25);
  background: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.105);
}

.ai-message.assistant,
.ai-bubble.assistant {
  color: var(--ai-bubble-assistant-color);
  border-color: var(--sg-hairline-soft);
  background: var(--ai-bubble-assistant-bg);
}

[data-theme="light"] .ai-modal-header,
[data-theme="light"] .ai-chat-form {
  background: var(--ai-header-bg);
  border-color: var(--sg-hairline-soft);
}

[data-theme="light"] .ai-chat-status {
  background: #f1f2f2;
  border-color: var(--sg-hairline-soft);
}

[data-theme="light"] .ai-chat-history {
  background: #fafaf7;
}

[data-theme="light"] .ai-chat-input,
[data-theme="light"] .ai-settings-input,
[data-theme="light"] .ai-settings-select {
  color: var(--ai-input-color);
  border-color: var(--sg-hairline);
  background: var(--ai-input-bg);
}

/* ── Footer and native title plane ── */
.site-footer-nr {
  color: var(--text-secondary);
  border-color: var(--sg-hairline);
  background: rgba(19, 21, 23, 0.86);
  box-shadow: 0 14px 38px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(250, 250, 247, 0.035);
  backdrop-filter: blur(18px) saturate(0.82);
  -webkit-backdrop-filter: blur(18px) saturate(0.82);
}

.site-footer-nr a {
  color: var(--text-muted) !important;
  text-decoration-color: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.44) !important;
}
.site-footer-nr .site-footer-record-link {
  display: none;
  color: #666762 !important;
  font-size: .82em;
  font-weight: 500;
  text-decoration-line: underline;
}
[data-theme="light"] .site-footer-nr .site-footer-record-link { color: #747771 !important; }
.site-footer-nr .site-footer-separator { display: none; }
.site-footer-nr.is-document-bottom :is(.site-footer-separator, .site-footer-record-link) { display: inline; }
.site-footer-nr .site-footer-record-link:hover { color: var(--accent-primary) !important; }

@media (max-width: 600px) {
  .site-footer-nr {
    white-space: normal;
  }
  .site-footer-nr .site-footer-record-link { white-space: nowrap; }
}

.mac-window-bar {
  border-color: var(--sg-hairline);
  background: rgba(18, 20, 22, 0.94);
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.34);
}

[data-theme="light"] .site-footer-nr {
  color: var(--text-secondary);
  border-color: var(--sg-hairline);
  background: rgba(250, 250, 247, 0.9);
  box-shadow: 0 12px 34px rgba(31, 31, 31, 0.09), inset 0 1px 0 rgba(255, 255, 255, 0.88);
}

[data-theme="light"] body.is-tauri:not(.is-embedded) .mac-window-bar,
body.is-tauri[data-theme="light"]:not(.is-embedded) .mac-window-bar {
  border-color: var(--sg-hairline);
  background: rgba(250, 250, 247, 0.94);
  box-shadow: inset 0 -1px 0 rgba(31, 31, 31, 0.055);
}

/* ── v3.2.5 responsive guardrails ── */
.theme-menu {
  max-height: calc(100dvh - max(24px, calc(env(safe-area-inset-top, 0px) + env(safe-area-inset-bottom, 0px) + 24px)));
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  touch-action: pan-y;
}

.image-controls {
  width: min(100%, 940px);
  max-width: min(100%, 940px) !important;
  flex-wrap: nowrap !important;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-inline: contain;
  scrollbar-width: none;
}

.image-controls::-webkit-scrollbar {
  display: none;
}

.image-controls > * {
  flex: 0 0 auto;
}

.image-controls .image-title {
  flex: 1 1 140px;
  min-width: 90px;
}

.image-controls .image-counter,
.image-controls .image-zoom-level {
  min-width: 44px;
}

.reader-shell[data-current-format="image"] .document-surface-global-actions {
  top: var(--reading-layout-fixed-top, 48px);
  right: var(--reading-layout-fixed-right, 48px);
}

@media (min-width: 601px) and (max-width: 1024px) {
  body:not(.is-tauri):not(.is-embedded) .reader-shell[data-current-format="image"] .document-surface-global-actions {
    top: 112px;
  }
}

@media (max-width: 900px) {
  .reader-shell.has-active-document .reader-main,
  .reader-shell.has-active-document.is-navigator-expanded .reader-main,
  .reader-shell.has-active-document.is-reader-layout-custom .reader-main,
  .reader-shell.has-active-document.is-reader-layout-custom.is-navigator-expanded .reader-main {
    padding-right: 16px;
  }

  .document-surface-global-actions {
    max-width: calc(
      100vw - var(--reader-side-rail-right, 12px) - var(--reader-side-rail-size, 46px) - 32px
    );
  }

  .image-controls {
    justify-content: flex-start;
    gap: 4px;
    padding: 10px 8px;
  }

  .image-controls button {
    padding: 6px 7px !important;
  }

  .image-controls .image-title {
    flex: 0 1 72px;
    min-width: 64px;
    max-width: 90px;
  }

  .image-controls .image-counter,
  .image-controls .image-zoom-level {
    min-width: 40px;
  }
}

@media (max-width: 600px) {
  .reader-shell.has-active-document .reader-main,
  .reader-shell.has-active-document.is-navigator-expanded .reader-main,
  .reader-shell.has-active-document.is-reader-layout-custom .reader-main,
  .reader-shell.has-active-document.is-reader-layout-custom.is-navigator-expanded .reader-main {
    padding-right: 12px;
  }

  .image-controls {
    width: 100%;
    margin-inline: 0;
    padding-inline: 9px;
  }

  .image-controls .image-title {
    min-width: 72px;
    max-width: 84px;
  }

  .reader-shell[data-current-format="image"] .document-surface-global-actions {
    top: auto;
    right: auto;
    bottom: max(58px, calc(env(safe-area-inset-bottom, 0px) + 52px));
    left: 50%;
    transform: translateX(-50%);
  }
}

@media (max-height: 620px), (max-width: 700px) {
  .theme-menu {
    width: min(284px, calc(100vw - 24px));
    padding: 14px;
    gap: 12px;
    border-radius: 14px;
  }

  .theme-menu-section {
    gap: 8px;
  }

  .theme-mode-btn {
    min-height: 40px;
  }

  .theme-color-grid {
    gap: 8px;
  }

  .theme-color-btn {
    padding: 4px;
    border-radius: 12px;
  }
}

/* ── v3.7.1 theme completeness and contrast authority ── */
:root {
  --accent-contrast: #090a0b;
  --accent-readable: var(--accent-orange-strong);
  --nr-control-active-text: var(--accent-readable);
}

[data-theme="light"] {
  color-scheme: light;
  --accent-readable: #7a5700;
  --nr-control-active-text: var(--accent-readable);
  --text-muted: #5d625f;
  --text-secondary: #686d69;
  --reader-ink: #2b2d2b;
  --reader-ink-muted: #5d625f;
  --sg-danger: #b42318;
  --sg-success: #147a4d;
}

[data-theme="light"][data-accent="red"] { --accent-readable: #b42318; }
[data-theme="light"][data-accent="coral"] { --accent-readable: #79500a; }
[data-theme="light"][data-accent="amber"] { --accent-readable: #7a5700; }
[data-theme="light"][data-accent="emerald"] { --accent-readable: #276749; }
[data-theme="light"][data-accent="teal"] { --accent-readable: #0f766e; }
[data-theme="light"][data-accent="sapphire"] { --accent-readable: #1d4ed8; }
[data-theme="light"][data-accent="violet"] { --accent-readable: #6d28d9; }
[data-theme="light"][data-accent="pink"] { --accent-readable: #a91458; }

[data-theme="dark"] {
  color-scheme: dark;
  --nr-control-active-text: var(--accent-readable);
}

.layout-mode-btn.is-active {
  color: var(--accent-contrast);
}

[data-theme="light"] .layout-mode-btn.is-active {
  color: var(--accent-contrast);
}

[data-theme="dark"] .theme-menu {
  color: #f1f0ec;
  border-color: rgba(250, 250, 247, 0.12);
  background:
    linear-gradient(180deg, rgba(25, 28, 31, 0.995), rgba(10, 12, 14, 0.997)),
    #101113;
}

[data-theme="dark"] .theme-mode-btn {
  color: #c2c0ba;
  border-color: rgba(250, 250, 247, 0.12);
  background: rgba(250, 250, 247, 0.035);
}

[data-theme="dark"] .theme-mode-btn:hover,
[data-theme="dark"] .theme-mode-btn.is-active {
  color: #fafaf7;
}

[data-theme="light"] .theme-menu {
  color: #20231f;
  border-color: rgba(31, 31, 31, 0.12);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.998), rgba(244, 245, 245, 0.997)),
    #fafaf7;
}

[data-theme="light"] .theme-menu-label {
  color: var(--accent-readable);
}

[data-theme="light"] .theme-mode-btn,
[data-theme="light"] .theme-color-btn {
  color: #4e544f;
  border-color: rgba(31, 31, 31, 0.13);
  background: rgba(31, 31, 31, 0.035);
}

[data-theme="light"] .theme-mode-btn:hover {
  color: #171916;
  border-color: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.48);
  background: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.08);
}

[data-theme="light"] .theme-mode-btn.is-active {
  color: #171916;
  border-color: var(--accent-primary);
  background: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.13);
}

[data-theme="light"] :is(
  .loader-modal,
  .last-session-card,
  .context-menu,
  .translation-panel,
  .translation-status-toast,
  .annotation-dialog-panel,
  .annotation-popover,
  .confirm-dialog,
  .reader-toast,
  .nr-translation-combobox-list
) {
  color: #2b2d2b;
  border-color: rgba(31, 31, 31, 0.12);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.985), rgba(245, 246, 247, 0.975)),
    #fafaf7;
  box-shadow: 0 24px 68px rgba(31, 31, 31, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.92);
}

[data-theme="light"] :is(
  .loader-modal,
  .last-session-card,
  .context-menu,
  .translation-panel,
  .translation-status-toast,
  .annotation-dialog-panel,
  .annotation-popover,
  .confirm-dialog,
  .reader-toast
) :is(h1, h2, h3, h4, strong, .translation-panel-title) {
  color: #171916;
}

[data-theme="light"] :is(
  .translation-panel,
  .translation-status-toast,
  .annotation-popover,
  .reader-toast,
  .last-session-card
) :is(small, p, .reader-toast-copy small, .translation-panel-title small) {
  color: #5d625f;
}

[data-theme="light"] .annotation-dialog-panel textarea {
  color: #20231f;
  border-color: rgba(31, 31, 31, 0.13);
  background: rgba(31, 31, 31, 0.04);
}

[data-theme="light"] .annotation-dialog-actions button,
[data-theme="light"] .translation-tool-btn,
[data-theme="light"] .nr-full-translation-tools button {
  color: #4e544f;
  border-color: rgba(31, 31, 31, 0.13);
  background: rgba(255, 255, 255, 0.76);
}

[data-theme="light"] .annotation-dialog-actions #annotation-save {
  color: var(--accent-contrast);
  background: var(--accent-primary);
}

[data-theme="light"] #reading-bookmarks-clear {
  color: #b42318;
}

[data-theme="light"] :is(button, input, textarea, select):disabled {
  color: #707670;
  opacity: 0.74;
}

[data-theme="light"] .section-tag {
  color: var(--accent-readable);
}

[data-theme="light"] .welcome-brand-icon {
  filter: url("#nr-theme-brand-filter") drop-shadow(0 8px 13px rgba(31, 31, 31, 0.16));
}

html[data-nr-seed-runtime="tauri"] .welcome-icon-wrap picture::after {
  display: block;
}

html[data-nr-seed-runtime="tauri"] .welcome-brand-icon {
  filter: drop-shadow(0 8px 13px rgba(0, 0, 0, 0.24));
}

html[data-nr-seed-runtime="tauri"][data-theme="light"] .welcome-brand-icon {
  filter: drop-shadow(0 8px 13px rgba(31, 31, 31, 0.16));
}

@supports (-webkit-touch-callout: none) {
  .welcome-icon-wrap picture::after { display: block; }
  .welcome-brand-icon { filter: drop-shadow(0 8px 13px rgba(0, 0, 0, 0.24)); }
  [data-theme="light"] .welcome-brand-icon { filter: drop-shadow(0 8px 13px rgba(31, 31, 31, 0.16)); }
}

[data-theme="light"] .doc-version-pill {
  color: var(--accent-readable);
}

[data-theme="light"] .back-link {
  color: #59616d;
}

[data-theme="light"] :is(
  .nr-settings-title > i,
  .nr-settings-title span,
  .nr-settings-nav button.is-active,
  .nr-credential-group > a,
  .ai-settings-combobox-option:hover,
  .ai-settings-combobox-option:focus-visible,
  .ai-settings-combobox-option[aria-selected="true"]
) {
  color: var(--accent-readable);
}

[data-theme="light"] :is(
  .ai-chat-status-rag:hover,
  .ai-chat-status-refresh:hover,
  .ai-chat-status-collab:hover,
  .ai-chat-status-interval:hover,
  .ai-header-btn:hover,
  .ai-secondary-btn:hover
) {
  color: var(--accent-readable);
}

[data-theme="light"] .tree-meta,
[data-theme="light"] .last-session-btn.is-muted {
  color: #52606d;
}

[data-theme="light"] .ai-session-tab.active,
[data-theme="light"] .ai-session-tab.active .ai-session-tab-name {
  color: var(--accent-readable);
}

[data-theme="light"] :is(
  .ai-chat-status-sync,
  .ai-chat-status-rag,
  .ai-chat-status-refresh,
  .ai-chat-status-collab,
  .ai-chat-status-interval
) {
  color: #59616d;
  border-color: rgba(31, 41, 55, 0.2);
  background: rgba(255, 255, 255, 0.58);
}

/* ── v3.8.0 raw accent icon and mirrored side-control authority ── */
:is(
  .format-badge i,
  .drop-zone i,
  .welcome-drop i,
  #sidebar-toggle,
  #nav-hamburger,
  .pill-files i,
  .load-doc-btn > i,
  .global-refresh-btn > i,
  .tree-tool-btn > i,
  .reader-refresh-btn > i
) {
  color: var(--accent-primary);
}

@media (min-width: 601px) {
  :is(#sidebar-toggle, #nav-hamburger) {
    color: var(--accent-primary);
    border-color: var(--sg-hairline);
    background: linear-gradient(180deg, rgba(250, 250, 247, 0.052), rgba(250, 250, 247, 0.022));
    box-shadow:
      inset 0 1px 0 rgba(250, 250, 247, 0.045),
      0 16px 42px rgba(0, 0, 0, 0.18);
  }

  :is(#sidebar-toggle, #nav-hamburger):hover {
    color: var(--accent-primary);
    border-color: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.42);
    background: rgba(var(--accent-pr), var(--accent-pg), var(--accent-pb), 0.075);
  }

  [data-theme="light"] :is(#sidebar-toggle, #nav-hamburger) {
    color: var(--accent-primary);
    border-color: var(--sg-hairline);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(31, 31, 31, 0.025));
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.92),
      0 16px 42px rgba(31, 31, 31, 0.1);
  }

  [data-theme="light"] :is(#sidebar-toggle, #nav-hamburger):hover {
    color: var(--accent-primary);
  }
}

body.is-embedded :is(#sidebar-toggle, #nav-hamburger) {
  display: none;
}
/* OCR → translation consent and recovery surface */
.ocr-translation-confirm-backdrop {
  position: fixed;
  inset: 0;
  z-index: 12600;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(4, 5, 5, .58);
  backdrop-filter: blur(5px);
}
.ocr-translation-confirm-backdrop[hidden] { display: none !important; }
.ocr-translation-confirm {
  width: min(520px, calc(100vw - 32px));
  max-height: min(680px, calc(100dvh - 32px));
  overflow: auto;
  border: 1px solid rgba(255, 190, 0, .28);
  border-radius: 18px;
  background: #111313;
  color: var(--reader-ink-strong);
  box-shadow: 0 26px 80px rgba(0, 0, 0, .58), inset 0 1px rgba(255, 255, 255, .04);
}
.ocr-translation-confirm header,
.ocr-translation-confirm footer { display: flex; align-items: center; gap: 10px; padding: 16px 18px; }
.ocr-translation-confirm header { justify-content: space-between; border-bottom: 1px solid rgba(148, 163, 184, .14); }
.ocr-translation-confirm header span { color: var(--accent-primary); font: 750 10px/1 var(--font-mono); letter-spacing: .16em; }
.ocr-translation-confirm h2 { margin: 5px 0 0; font: 750 20px/1.2 var(--font-main); }
.ocr-translation-confirm header button { width: 34px; height: 34px; border: 1px solid rgba(148,163,184,.2); border-radius: 10px; background: transparent; color: inherit; font-size: 22px; cursor: pointer; }
.ocr-translation-confirm > p { margin: 0; padding: 16px 18px 4px; color: var(--reader-ink-muted); font: 550 13px/1.65 var(--font-main); }
.ocr-translation-confirm dl { margin: 12px 18px; border: 1px solid rgba(148,163,184,.14); border-radius: 12px; overflow: hidden; }
.ocr-translation-confirm dl div { display: grid; grid-template-columns: 92px minmax(0,1fr); gap: 12px; padding: 11px 12px; border-bottom: 1px solid rgba(148,163,184,.11); }
.ocr-translation-confirm dl div:last-child { border-bottom: 0; }
.ocr-translation-confirm dt { color: var(--reader-ink-muted); font: 650 11px/1.45 var(--font-main); }
.ocr-translation-confirm dd { margin: 0; color: var(--reader-ink-strong); font: 600 12px/1.5 var(--font-main); overflow-wrap: anywhere; }
.ocr-translation-confirm .ocr-translation-error,
.ocr-translation-confirm .ocr-translation-progress { margin: 10px 18px 0; padding: 10px 12px; border-radius: 10px; }
.ocr-translation-confirm .ocr-translation-error { background: rgba(239,68,68,.10); color: #fca5a5; }
.ocr-translation-confirm .ocr-translation-progress { background: rgba(255,190,0,.10); color: var(--accent-primary); }
.ocr-translation-confirm footer { border-top: 1px solid rgba(148,163,184,.14); }
.ocr-translation-confirm footer span { flex: 1; }
.ocr-translation-confirm footer button { min-height: 38px; padding: 0 14px; border-radius: 10px; font: 700 12px/1 var(--font-main); cursor: pointer; }
.ocr-translation-confirm footer .secondary { border: 1px solid rgba(148,163,184,.22); background: transparent; color: var(--reader-ink-strong); }
.ocr-translation-confirm footer .primary { border: 1px solid var(--accent-primary); background: var(--accent-primary); color: #151200; }
.ocr-translation-confirm footer button:disabled { opacity: .4; cursor: not-allowed; }
[data-theme="light"] .ocr-translation-confirm { background: #fff; color: #19202a; box-shadow: 0 26px 80px rgba(15,23,42,.2); }
@media (max-width: 560px) {
  .ocr-translation-confirm-backdrop { padding: 10px; }
  .ocr-translation-confirm dl div { grid-template-columns: 1fr; gap: 3px; }
  .ocr-translation-confirm footer { flex-wrap: wrap; }
  .ocr-translation-confirm footer span { display: none; }
  .ocr-translation-confirm footer button { flex: 1 1 44%; }
}
