/* BA21: Blue gray light semantic tokens. x-dc compatibility layer. */
:root {
  color-scheme: light;
  --background: #e8edf3;
  --foreground: #1e293b;
  --card: #ffffff;
  --card-foreground: #1e293b;
  --popover: #ffffff;
  --popover-foreground: #1e293b;
  --primary: #243b53;
  --primary-foreground: #ffffff;
  --secondary: #edf2f7;
  --secondary-foreground: #243b53;
  --muted: #f1f5f9;
  --muted-foreground: #526176;
  --accent: #e2eaf3;
  --accent-foreground: #243b53;
  --destructive: #dc2626;
  --destructive-subtle: #fef2f2;
  --destructive-border: #fecaca;
  --success: #166534;
  --success-subtle: #f0fdf4;
  --warning: #854d0e;
  --warning-subtle: #fefce8;
  --info: #1e40af;
  --info-subtle: #eff6ff;
  --primary-hover: #334e68;
  --inverse-muted: #d9e2ec;
  --inverse-border: #627d98;
  --chart-1: #243b53;
  --chart-2: #526d88;
  --chart-3: #829ab1;
  --border: #cbd5e1;
  --input: #94a3b8;
  --ring: #486581;
  --radius: 10px;
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 10px;
  --radius-xl: 14px;
  --control-height: 36px;
  --control-height-sm: 32px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --shadow-sm: 0 1px 2px rgb(0 0 0 / 5%);
  --shadow-popover: 0 4px 12px rgb(0 0 0 / 10%);
}
body { background: var(--background); color: var(--foreground); }
:where(button,input,select,textarea) { font:inherit; accent-color:var(--primary); }
:where(button,[role=button]) { touch-action:manipulation; }
:where(button,input,select,textarea,a,[tabindex]):focus-visible { outline:2px solid var(--ring); outline-offset:2px; }
:where(button,input,select,textarea):disabled { cursor:not-allowed; opacity:.5; }
::selection { background:var(--primary); color:var(--primary-foreground); }