/* ── Design tokens — PCI Compliance (verbatim from pci-policy.html) ── */
:root {
  --bg: #edf0f4; --card: #f5f7fa; --ink: #202124; --muted: #5f6368;
  --line: #dadce0; --accent: #1967d2; --ok: #137333; --ok-bg: #e6f4ea;
  --warn: #b06000; --warn-bg: #fef7e0; --danger: #c5221f; --danger-bg: #fce8e6;
  --info: #1967d2; --info-bg: #e8f0fe; --nav-bg: #f5f7fa; --topbar-bg: #f5f7fa;
  --topbar-h: 56px;

  /* Status — map to semantic tokens */
  --status-compliant:        var(--ok);      --status-compliant-bg:        var(--ok-bg);
  --status-in-progress:      var(--warn);    --status-in-progress-bg:      var(--warn-bg);
  --status-non-compliant:    var(--danger);  --status-non-compliant-bg:    var(--danger-bg);
  --status-not-applicable:   var(--muted);   --status-not-applicable-bg:   var(--bg);
  --status-not-started:      var(--info);    --status-not-started-bg:      var(--info-bg);

  /* Elevation */
  --shadow-sm: 0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.04);
  --shadow-md: 0 4px 12px rgba(0,0,0,.10), 0 2px 4px rgba(0,0,0,.06);
  --shadow-lg: 0 8px 24px rgba(0,0,0,.12), 0 4px 8px rgba(0,0,0,.08);

  /* Border radius */
  --radius-sm: 6px; --radius-md: 10px; --radius-lg: 16px;

  /* Spacing scale */
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px;
  --space-5: 20px; --space-6: 24px; --space-8: 32px; --space-10: 40px;

  /* Sidebar */
  --sidebar-w: 220px; --sidebar-bg: var(--card);
}

[data-theme="dark"] {
  --bg: #202124; --card: #2d2f31; --ink: #e8eaed; --muted: #9aa0a6;
  --line: #3c4043; --accent: #8ab4f8; --ok: #81c995; --ok-bg: #0d3820;
  --warn: #fdd663; --warn-bg: #302a00; --danger: #f28b82; --danger-bg: #3c1a19;
  --info: #8ab4f8; --info-bg: #1a237e22; --nav-bg: #2d2f31; --topbar-bg: #2d2f31;
}