/* Shared theme tokens for every page (reader, library, login). The reader's
   pre-paint inline script sets body[data-theme] before first paint; these
   variables make the themes consistent across pages. */

:root {
  color-scheme: light;
  --bg: #f4f6f3;
  --panel: #ffffff;
  --panel-strong: #f9faf8;
  --text: #1d241d;
  --muted: #667164;
  --border: #d9dfd5;
  --accent: #1f6f5b;
  --accent-strong: #175545;
  --shadow: 0 16px 40px rgba(37, 45, 35, 0.12);
  --control-bg: color-mix(in srgb, var(--panel), transparent 12%);
  --control-hover: color-mix(in srgb, var(--accent), transparent 91%);
  --control-ring: color-mix(in srgb, var(--accent), transparent 38%);
  --control-icon-size: 28px;
  --sidebar-icon-size: 23px;
  --ui-font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --ui-size-xs: 11px;
  --ui-size-sm: 12px;
  --ui-size-md: 13px;
  --ui-size-page: 10px;
  --ui-size-title: 16px;
  --ui-size-brand: 18px;
  --ui-size-reader-heading: 22px;
  --ui-weight-normal: 400;
  --ui-weight-medium: 500;
  --ui-line-tight: 1.2;
  --ui-line-normal: 1.35;
  --reader-line: 1.58;
  --reader-font: Georgia, "Times New Roman", serif;
  --reader-size: 19px;
  --reader-block-space: clamp(24px, 3.2vh, 38px);
  --reader-controls-space: 48px;
  --reader-page-bottom-reserve: calc(var(--reader-size) * 3.16);
  --reader-inline-space: clamp(18px, 6vw, 96px);
  --mobile-actions-height: 0px;
  --app-height: 100vh;
  --mobile-bottom-reserve: 40px;
  --sidebar-width: 300px;
}

body[data-theme="sepia"] {
  --bg: #f0eadc;
  --panel: #fbf6e9;
  --panel-strong: #f7f1e1;
  --text: #2c2418;
  --muted: #74674f;
  --border: #ddd0b8;
  --accent: #7d4b25;
  --accent-strong: #5e371a;
}

body[data-theme="dark"] {
  color-scheme: dark;
  --bg: #151716;
  --panel: #1f2422;
  --panel-strong: #252c29;
  --text: #eff3ec;
  --muted: #a5b0a7;
  --border: #39423d;
  --accent: #65c5a7;
  --accent-strong: #8ad9c0;
  --shadow: 0 16px 40px rgba(0, 0, 0, 0.26);
}