/* Design tokens — usado com styles.css */
:root {
  --shadow-soft: 0 18px 50px rgba(0, 0, 0, 0.28);
  --ip-blue: #0066ff;
  --status-ativo: #22c55e;
  --status-pendente: #f59e0b;
  --status-alerta: #ef4444;
  --shadow-card: 0 4px 24px rgba(0, 0, 0, 0.12);
  --shadow-elevated: 0 8px 32px rgba(0, 0, 0, 0.24);
  --shadow-modal: 0 25px 60px rgba(0, 0, 0, 0.45);
  --radius-lg: 16px;
  --radius-xl: 22px;
  --radius-pill: 999px;
  --space-page-x: clamp(1rem, 2vw, 1.75rem);
  --space-page-y: clamp(1rem, 2.5vw, 2rem);
  --header-blur: 16px;
  --z-sticky-topbar: 50;
  --z-sidebar: 45;
  --ease-out: cubic-bezier(0.33, 1, 0.68, 1);
  --t-fast: 0.18s;
  --t-norm: 0.22s;
  --focus-ring: 0 0 0 3px rgba(14, 165, 233, 0.45);
  --focus-ring-offset: 2px;
  --ip-font: "Inter", system-ui, -apple-system, sans-serif;
  --ip-fs-2xs: 0.68rem;
  --ip-fs-xs: 0.75rem;
  --ip-fs-sm: 0.82rem;
  --ip-fs-md: 0.88rem;
  --ip-fs-lg: 1rem;
  --ip-fs-xl: 1.2rem;
  --ip-fs-2xl: 1.5rem;
}

html[data-theme="light"] {
  --shadow-soft: 0 20px 50px rgba(15, 23, 42, 0.1);
  --shadow-card: 0 4px 20px rgba(15, 23, 42, 0.07);
  --shadow-elevated: 0 12px 40px rgba(15, 23, 42, 0.08);
  --shadow-modal: 0 24px 48px rgba(15, 23, 42, 0.12);
  --focus-ring: 0 0 0 3px rgba(0, 102, 255, 0.35);
}