:root {
  color-scheme: light;
  --surface: #fff;
  --surface-raised: #f1f6f8;
  --surface-subtle: #f8fafc;
  --link-hover: #005e69;
  --primary-bg: #007f84;
  --primary-hover: #006d74;
  --success-bg: #eaf6ef;
  --success-text: #398564;
  --warning-bg: #fbf4e7;
  --warning-text: #926517;
  --error-bg: #fcefed;
  --error-text: #a74747;
  --info-bg: #eaf2fb;
  --info-text: #426e9e;
  --chart-issued: #315c75;
  --chart-received: #35a99e;
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0b1420;
  --surface: #142232;
  --surface-raised: #1b2c40;
  --surface-subtle: #101d2c;
  --navy: #0b1928;
  --navy2: #122e40;
  --ink: #e7eef6;
  --muted: #a3b3c5;
  --line: #2b3e53;
  --teal: #6cd7cc;
  --teal-light: #143c3b;
  --danger: #ffacaf;
  --amber: #f2c879;
  --shadow: 0 3px 16px #00000020;
  --link-hover: #a2eee6;
  --primary-bg: #14777c;
  --primary-hover: #17676d;
  --success-bg: #143c33;
  --success-text: #85dec0;
  --warning-bg: #382f1e;
  --warning-text: #f5cd80;
  --error-bg: #3d242d;
  --error-text: #ffc0bf;
  --info-bg: #1d334b;
  --info-text: #acd2ff;
  --chart-issued: #87a9c8;
  --chart-received: #64cabb;
}
a:hover { color: var(--link-hover); }
.card, .topbar, .modal-heading, dialog, .login-body, .skip-link { background: var(--surface); }
.btn { background: var(--surface); color: var(--ink); border-color: var(--line); }
.btn:hover { background: var(--surface-raised); color: var(--ink); border-color: var(--muted); }
.btn.primary { background: var(--primary-bg); border-color: var(--primary-bg); color: #fff; }
.btn.primary:hover { background: var(--primary-hover); border-color: var(--primary-hover); }
.btn.danger { color: var(--danger); border-color: var(--danger); }
.btn.ghost { background: transparent; border-color: transparent; }
.btn.soft, .company-avatar, .form-step, .steps>div:before { background: var(--teal-light); color: var(--teal); border-color: var(--line); }
.stat-top span, .stat-number small, .stat-bottom, .chart-legend, .chart-empty,
.attention-item p, .attention-item>a, .table-sub, .table-footer, .tabs a,
.field-help, .parties h3, .parties p, .dates-row span, .timeline-item span,
.detail-meta, .customer-card p, .app-footer, .app-footer>span:first-child,
.login-help, .secure-caption, .modal-heading button, #global-search,
.help-link, kbd { color: var(--muted); }
.stat-bottom .good { color: var(--success-text); }
.stat-icon, .empty .empty-icon, .connection-icon { background: var(--info-bg); color: var(--info-text); border-color: var(--line); }
.stat-icon.teal { background: var(--success-bg); color: var(--success-text); }
.stat-icon.amber, .attention-symbol { background: var(--warning-bg); color: var(--warning-text); }
.stat-icon.rose { background: var(--error-bg); color: var(--error-text); }
th, .summary-note, .dates-row, .connection-url, .evidence div { background: var(--surface-subtle); }
th, .summary-note { color: var(--muted); }
td { border-color: var(--line); color: var(--ink); }
td strong, label, .empty h3 { color: var(--ink); }
tbody tr:hover { background: var(--surface-raised); }
.file-icon, .help-link, kbd, dialog { border-color: var(--line); }
.file-icon { color: var(--muted); }
.badge { background: var(--surface-raised); color: var(--muted); }
.badge.green, .badge.teal, .alert.success { background: var(--success-bg); color: var(--success-text); border-color: var(--success-text); }
.badge.red, .alert.error { background: var(--error-bg); color: var(--error-text); border-color: var(--error-text); }
.badge.amber, .alert.warning, .environment { background: var(--warning-bg); color: var(--warning-text); border-color: var(--line); }
.badge.blue, .alert { background: var(--info-bg); color: var(--info-text); border-color: var(--line); }
input, select, textarea { background: var(--surface-subtle); color: var(--ink); border-color: var(--line); accent-color: var(--primary-bg); }
input::placeholder, textarea::placeholder { color: var(--muted); opacity: 1; }
.timeline-item:before { box-shadow: 0 0 0 4px var(--surface); }
.attention-item, .timeline-item, .status-list>div, .summary-list>div { border-color: var(--line); }
.dot, .bar-pair i { background: var(--chart-issued); }
.dot.teal, .bar-pair i:last-child { background: var(--chart-received); }
.chart-grid i { border-color: var(--line); }
.theme-toggle { gap: 7px; min-width: 44px; min-height: 44px; border: 1px solid var(--line); color: var(--ink); flex-shrink: 0; }
.theme-toggle svg { width: 19px; height: 19px; }
.theme-label { font-size: 11px; white-space: nowrap; }
.theme-sun { display: none; }
[data-theme="light"] .theme-sun { display: block; }
[data-theme="light"] .theme-moon { display: none; }
.login-form-wrap { position: relative; padding-top: 90px; }
.login-theme { position: absolute; top: 24px; right: 28px; }
@media(max-width:1180px) { .topbar .theme-label { display: none; } }
@media(max-width:640px) { .topbar-right { gap: 7px; } .login-theme { top: 18px; right: 20px; } }