/* Shared by the login, application, report chrome and payment result shells. */
body { accent-color: var(--accent); }
:root {
  color-scheme: dark;
  --bg: #0a1220;
  --bg-secondary: #0f1b31;
  --bg-elevated: #13233e;
  --surface-strong: #1a304f;
  --panel: #0f1b31;
  --line: #294161;
  --line-strong: #45658d;
  --ink: #edf3ff;
  --ink-soft: #a8bad5;
  --ink-muted: #94a9c7;
  --accent: #43b6ff;
  --accent-hover: #8ad0ff;
  --accent-ink: #0a1220;
  --positive: #4be2ad;
  --danger: #ff7f9f;
  --warn: #ffd777;
  --info: #43b6ff;
  --vn-comparison: #aaa8ff;
  --bg-rgb: 10, 18, 32;
  --bg-secondary-rgb: 15, 27, 49;
  --bg-elevated-rgb: 19, 35, 62;
  --accent-rgb: 67, 182, 255;
  --positive-rgb: 75, 226, 173;
  --danger-rgb: 255, 127, 159;
  --warn-rgb: 255, 215, 119;
  --info-rgb: 67, 182, 255;
  --ink-muted-rgb: 148, 169, 199;
  --positive-soft: rgba(var(--positive-rgb), 0.12);
  --positive-border: rgba(var(--positive-rgb), 0.38);
  --danger-soft: rgba(var(--danger-rgb), 0.12);
  --danger-border: rgba(var(--danger-rgb), 0.34);
  --warn-soft: rgba(var(--warn-rgb), 0.12);
  --warn-border: rgba(var(--warn-rgb), 0.36);
  --info-soft: rgba(var(--info-rgb), 0.12);
  --info-border: rgba(var(--info-rgb), 0.34);
  --focus-ring: rgba(var(--accent-rgb), 0.2);
  --topbar-bg: var(--bg);
  --glass-bg: var(--bg-secondary);
  --glass-border: var(--line);
  --chart-grid: var(--line);
  --chart-muted: var(--ink-muted);
  --chart-text: var(--ink-soft);
  --chart-positive: var(--positive);
  --chart-danger: var(--danger);
  --chart-warning: var(--warn);
  --chart-info: var(--info);
  --text-primary: var(--ink);
  --text-secondary: var(--ink-soft);
  --text-muted: var(--ink-muted);
  --glow-accent: 0 0 0 1px rgba(var(--accent-rgb), 0.15), 0 18px 36px rgba(0, 0, 0, 0.22);
}

body.color-light {
  color-scheme: light;
  --bg: #eaf0f8;
  --bg-secondary: #fff;
  --bg-elevated: #f4f8ff;
  --surface-strong: #e0eaf7;
  --panel: #fff;
  --line: #d6e0ee;
  --line-strong: #7586a3;
  --ink: #0d1730;
  --ink-soft: #526581;
  --ink-muted: #526581;
  --accent: #12679f;
  --accent-hover: #0b5487;
  --accent-ink: #fff;
  --positive: #167552;
  --danger: #b83250;
  --warn: #805a00;
  --info: #12679f;
  --vn-comparison: #6552cb;
  --bg-rgb: 234, 240, 248;
  --bg-secondary-rgb: 255, 255, 255;
  --bg-elevated-rgb: 244, 248, 255;
  --accent-rgb: 18, 103, 159;
  --positive-rgb: 22, 117, 82;
  --danger-rgb: 184, 50, 80;
  --warn-rgb: 128, 90, 0;
  --info-rgb: 18, 103, 159;
  --ink-muted-rgb: 82, 101, 129;
  /* Redeclare aliases here: root custom properties resolve before inheritance. */
  --positive-soft: rgba(var(--positive-rgb), 0.1);
  --positive-border: rgba(var(--positive-rgb), 0.32);
  --danger-soft: rgba(var(--danger-rgb), 0.1);
  --danger-border: rgba(var(--danger-rgb), 0.3);
  --warn-soft: rgba(var(--warn-rgb), 0.1);
  --warn-border: rgba(var(--warn-rgb), 0.32);
  --info-soft: rgba(var(--info-rgb), 0.1);
  --info-border: rgba(var(--info-rgb), 0.3);
  --focus-ring: rgba(var(--accent-rgb), 0.2);
  --topbar-bg: var(--bg-secondary);
  --glass-bg: var(--bg-secondary);
  --glass-border: var(--line);
  --chart-grid: var(--line);
  --chart-muted: var(--ink-muted);
  --chart-text: var(--ink-soft);
  --chart-positive: var(--positive);
  --chart-danger: var(--danger);
  --chart-warning: var(--warn);
  --chart-info: var(--info);
  --text-primary: var(--ink);
  --text-secondary: var(--ink-soft);
  --text-muted: var(--ink-muted);
  --glow-accent: 0 0 0 1px rgba(var(--accent-rgb), 0.15), 0 18px 36px rgba(0, 0, 0, 0.1);
}