/**
 * IUSLEAD — Design tokens (única fuente de verdad).
 * Cargar antes de styles.css, visual-refine.css y citizen.css.
 */
:root {
  /* Brand */
  --brand-navy: #0f2744;
  --brand-navy-deep: #0a1628;
  --brand-navy-l: #1a3a5c;
  --brand-gold: #c9a055;
  --brand-gold-l: #e2c078;
  --brand-gold-soft: rgba(201, 160, 85, 0.45);
  --brand-gold-d: rgba(201, 160, 85, 0.14);
  --brand-primary: var(--brand-navy);
  --brand-accent: var(--brand-gold);

  /* Platform accent (panel maestro) */
  --platform-purple: #7c3aed;
  --platform-purple-dim: rgba(124, 58, 237, 0.18);

  /* Surfaces */
  --bg-base: #090b10;
  --bg-elevated: #10131a;
  --bg-raised: #12151c;
  --bg-card: #151820;
  --bg-card-h: #1a1e28;
  --bg-widget: rgba(255, 255, 255, 0.032);
  --bg-surface: rgba(255, 255, 255, 0.042);
  --bg-surface-h: rgba(255, 255, 255, 0.068);
  --bg-glass: rgba(18, 19, 25, 0.82);
  --bg-input: rgba(255, 255, 255, 0.055);

  /* Glass premium */
  --glass-bg: rgba(15, 22, 34, 0.72);
  --glass-border: rgba(255, 255, 255, 0.1);
  --glass-blur: blur(28px) saturate(160%);

  /* Text */
  --text: rgba(255, 255, 255, 0.96);
  --text-sec: rgba(255, 255, 255, 0.62);
  --text-muted: rgba(255, 255, 255, 0.4);

  /* Semantic colors */
  --blue: #7094f0;
  --blue-dim: rgba(112, 148, 240, 0.12);
  --green: #5ecba8;
  --green-dim: rgba(94, 203, 168, 0.11);
  --orange: #d4a054;
  --orange-dim: rgba(212, 160, 84, 0.12);
  --red: #e07a7a;
  --red-dim: rgba(224, 122, 122, 0.11);
  --purple: #a594e8;
  --purple-dim: rgba(165, 148, 232, 0.11);
  --teal: #5db8be;
  --teal-dim: rgba(93, 184, 190, 0.11);
  --pink: #c77da8;
  --pink-dim: rgba(199, 125, 168, 0.11);
  --gold: var(--brand-gold);

  /* Status */
  --status-ok: #22c55e;
  --status-warn: #fb923c;
  --status-error: #ef4444;
  --status-muted: var(--text-muted);

  /* Borders & focus */
  --border: rgba(255, 255, 255, 0.075);
  --border-h: rgba(255, 255, 255, 0.13);
  --border-gold: rgba(201, 160, 85, 0.28);
  --border-focus: rgba(201, 160, 85, 0.45);

  /* Spacing (8pt grid) */
  --phi: 1.618;
  --space-unit: 8px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 40px;
  --s1: 4px;
  --s2: 8px;
  --s3: 12px;
  --s4: 16px;
  --s5: 20px;
  --s6: 24px;
  --s8: 32px;
  --s10: 40px;
  --s12: 48px;

  /* Radius */
  --r-xs: 6px;
  --r-sm: 9px;
  --r: 12px;
  --r-md: 10px;
  --r-lg: 14px;
  --r-xl: 18px;

  /* Typography */
  --font-ui: 'Inter', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  --font-display: 'Plus Jakarta Sans', var(--font-ui);
  --text-xs: 11px;
  --text-sm: 12.5px;
  --text-base: 14px;
  --text-md: 15.5px;
  --text-lg: 18px;
  --text-xl: 22px;
  --text-2xl: 28px;

  /* Shadows & elevation */
  --sh-sm: 0 1px 2px rgba(0, 0, 0, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.04);
  --sh: 0 4px 16px rgba(0, 0, 0, 0.28), 0 0 0 1px rgba(0, 0, 0, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.05);
  --sh-lg: 0 12px 40px rgba(0, 0, 0, 0.36), 0 0 0 1px rgba(0, 0, 0, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.06);
  --sh-kpi: 0 2px 8px rgba(0, 0, 0, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.06);
  --sh-dock: 0 8px 32px rgba(0, 0, 0, 0.48), 0 0 0 0.5px rgba(255, 255, 255, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.06);
  --sh-gold: 0 4px 20px rgba(201, 160, 85, 0.12);
  --elevation-1: var(--sh-sm);
  --elevation-2: var(--sh);
  --elevation-3: var(--sh-lg);

  /* Blur */
  --blur: blur(24px) saturate(150%);

  /* Motion */
  --ease: cubic-bezier(0.25, 0.1, 0.25, 1);
  --ease-out: cubic-bezier(0, 0, 0.2, 1);
  --duration-fast: 150ms;
  --duration-normal: 220ms;
  --duration-slow: 350ms;

  /* Layout (panel) */
  --topbar-h: 56px;
  --dock-pad: 76px;
  --titlebar-h: 0px;
  --aux-bar-h: 0px;
  --shell-top: calc(var(--titlebar-h) + var(--aux-bar-h));
  --chrome-top: calc(var(--shell-top) + var(--topbar-h));

  /* Charts */
  --chart-h-line: 220px;
  --chart-h-cell: 200px;

  /* Citizen pages (light premium) */
  --citizen-bg: #eef2f8;
  --citizen-bg-gradient: linear-gradient(165deg, #e8eef8 0%, #f4f7fb 45%, #fafbfd 100%);
  --citizen-card: rgba(255, 255, 255, 0.92);
  --citizen-card-border: rgba(15, 39, 68, 0.08);
  --citizen-text: #0f1c2e;
  --citizen-muted: #64748b;
  --citizen-line: rgba(15, 28, 46, 0.08);
  --citizen-primary: var(--brand-navy);
  --citizen-accent: var(--brand-gold);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --duration-fast: 0ms;
    --duration-normal: 0ms;
    --duration-slow: 0ms;
  }
}

@media (max-width: 1100px) {
  :root {
    --chart-h-line: 196px;
    --chart-h-cell: 184px;
  }
}
