/* Oparo Foundations — the REAL fleet design tokens (matches Connect/Docs/Files).
   Source of truth: ohub/documentation/oparo-foundations.md. Self-hosted fonts
   (CSP-safe, no external requests). Align consumes these — no forked palette. */

@font-face { font-family:'Montserrat'; font-weight:400; font-display:swap; src:url('/brand/montserrat-400.woff2') format('woff2'); }
@font-face { font-family:'Montserrat'; font-weight:500; font-display:swap; src:url('/brand/montserrat-500.woff2') format('woff2'); }
@font-face { font-family:'Montserrat'; font-weight:600; font-display:swap; src:url('/brand/montserrat-600.woff2') format('woff2'); }
@font-face { font-family:'Montserrat'; font-weight:700; font-display:swap; src:url('/brand/montserrat-700.woff2') format('woff2'); }
@font-face { font-family:'ADA Hybrid'; font-weight:400 700; font-display:swap;
  src:url('/brand/ada-hybrid.woff2') format('woff2'), url('/brand/ada-hybrid.woff') format('woff'); }

:root {
  /* spacing (4px grid) */
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:20px;
  --space-6:24px; --space-8:32px; --space-10:40px; --space-12:48px; --space-16:64px;
  /* radii / shadows */
  --radius-sm:6px; --radius-md:10px; --radius-lg:14px; --radius-xl:18px; --radius-full:9999px;
  --shadow-xs:0 1px 2px 0 rgb(15 23 42 / .06);
  --shadow-sm:0 1px 3px 0 rgb(15 23 42 / .08), 0 1px 2px -1px rgb(15 23 42 / .06);
  --shadow-md:0 4px 8px -2px rgb(15 23 42 / .08), 0 2px 4px -2px rgb(15 23 42 / .06);
  --shadow-lg:0 12px 24px -4px rgb(15 23 42 / .12), 0 4px 8px -4px rgb(15 23 42 / .08);
  /* type */
  --font-sans:Montserrat, Arial, sans-serif;
  --font-heading:'ADA Hybrid', Montserrat, Arial, sans-serif;
  --fs-xs:12px; --fs-sm:14px; --fs-md:16px; --fs-lg:18px; --fs-xl:20px; --fs-2xl:24px; --fs-3xl:30px;
  --fw-regular:400; --fw-medium:500; --fw-semibold:600; --fw-bold:700;
  /* motion */
  --motion-fast:120ms; --motion-normal:180ms; --motion-slow:260ms;
  --ease-standard:cubic-bezier(0.2,0,0,1); --ease-emphasized:cubic-bezier(0.2,0,0,1.2);
  /* layout */
  --sidebar-w:264px; --topbar-h:60px; --content-max:1120px;
  /* colors — light (fleet values) */
  --color-background:#f7f8fa; --color-surface:#ffffff; --color-surface-elevated:#ffffff; --color-surface-2:#eef1f5;
  --color-border:#e2e5eb; --color-border-subtle:rgb(15 23 42 / .08);
  --color-text:#111315; --color-text-muted:#5c6570;
  --color-primary:#2563eb; --color-primary-hover:#1d4ed8; --color-primary-subtle:rgb(37 99 235 / .12);
  --color-success:#059669; --color-success-subtle:rgb(5 150 105 / .12); --color-success-text:#047857;
  --color-warning:#d97706; --color-warning-subtle:rgb(217 119 6 / .12); --color-warning-text:#b45309;
  --color-danger:#dc2626; --color-danger-subtle:rgb(248 113 113 / .1); --color-danger-text:#b91c1c;
  --color-info:#2563eb; --color-info-subtle:rgb(37 99 235 / .12);
  --color-focus-ring:#2563eb; --color-link:#2563eb; --color-on-primary:#ffffff;
  --color-paro:#7c3aed; --color-paro-hover:#6d28d9; --color-paro-subtle:rgb(124 58 237 / .12); --color-on-paro:#fff;
  --color-auth-gradient-start:#eef1f6; --color-auth-gradient-end:#f7f8fa;
}

@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) {
  --color-background:#111315; --color-surface:#171a1f; --color-surface-elevated:#1c2028; --color-surface-2:#232833;
  --color-border:rgb(148 163 184 / .18); --color-border-subtle:rgb(148 163 184 / .12);
  --color-text:#e8edf5; --color-text-muted:#94a3b8;
  --color-primary:#3b82f6; --color-primary-hover:#2563eb; --color-primary-subtle:rgb(59 130 246 / .18);
  --color-success:#10b981; --color-success-subtle:rgb(16 185 129 / .18); --color-success-text:#6ee7b7;
  --color-warning:#f59e0b; --color-warning-subtle:rgb(245 158 11 / .18); --color-warning-text:#fcd34d;
  --color-danger:#f87171; --color-danger-subtle:rgb(248 113 113 / .15); --color-danger-text:#fca5a5;
  --color-focus-ring:#60a5fa; --color-link:#93c5fd;
  --color-paro:#8b5cf6; --color-paro-hover:#7c3aed; --color-paro-subtle:rgb(139 92 246 / .18);
  --color-auth-gradient-start:#1e293b; --color-auth-gradient-end:#111315;
  --shadow-lg:0 12px 24px -4px rgb(0 0 0 / .4);
}}
:root[data-theme="dark"] {
  --color-background:#111315; --color-surface:#171a1f; --color-surface-elevated:#1c2028; --color-surface-2:#232833;
  --color-border:rgb(148 163 184 / .18); --color-text:#e8edf5; --color-text-muted:#94a3b8;
  --color-primary:#3b82f6; --color-primary-subtle:rgb(59 130 246 / .18);
  --color-success:#10b981; --color-success-subtle:rgb(16 185 129 / .18); --color-success-text:#6ee7b7;
  --color-danger:#f87171; --color-danger-subtle:rgb(248 113 113 / .15);
  --color-paro:#8b5cf6; --color-paro-subtle:rgb(139 92 246 / .18);
}