/* NEO HUMAN — design tokens. Nenhum hexadecimal deve ser espalhado pelo código: use sempre estas variáveis. */
:root {
  /* superfícies */
  --eon-bg: #050812;
  --eon-bg-2: #080D18;
  --eon-surface: #0D1422;
  --eon-surface-elevated: #111A2B;
  --eon-glass: rgba(13, 20, 34, .72);
  --eon-glass-2: rgba(255, 255, 255, .045);
  --eon-border: rgba(255, 255, 255, .08);
  --eon-border-active: rgba(120, 150, 255, .28);
  /* texto */
  --eon-text: #F5F7FA;
  --eon-text-secondary: #9AA4B5;
  --eon-text-muted: #667085;
  /* energia */
  --eon-cyan: #5FE1FF;
  --eon-blue: #5C8CFF;
  --eon-violet: #7B61FF;
  --eon-magenta: #B45CFF;
  --eon-amber: #E9B54A;
  --eon-orange: #F29B5B;
  --eon-red: #FF6B73;
  --eon-gradient: linear-gradient(135deg, #5FE1FF 0%, #6F7BFF 45%, #9B5CFF 100%);
  --eon-gradient-soft: linear-gradient(90deg, rgba(70, 220, 255, .14), rgba(120, 80, 255, .16));
  /* forma e sombra */
  --eon-radius-sm: 12px;
  --eon-radius-md: 18px;
  --eon-radius-lg: 24px;
  --eon-shadow: 0 20px 60px rgba(0, 0, 0, .35);
  --eon-shadow-sm: 0 8px 24px rgba(0, 0, 0, .28);
  --eon-glow: 0 8px 30px rgba(90, 120, 255, .22);
  /* movimento */
  --eon-ease: cubic-bezier(.22, 1, .36, 1);
  --eon-transition-fast: 150ms var(--eon-ease);
  --eon-transition-normal: 250ms var(--eon-ease);
  --eon-transition-slow: 700ms var(--eon-ease);

  /* layout */
  --sidebar-w: 210px;
  --tab-h: 70px;
  --safe-b: env(safe-area-inset-bottom, 0px);
  --safe-t: env(safe-area-inset-top, 0px);
  --font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;

  /* apelidos usados pelos componentes existentes (mapeados nos tokens acima) */
  --bg: var(--eon-bg);
  --bg-2: var(--eon-bg-2);
  --card: var(--eon-glass);
  --card-2: var(--eon-glass-2);
  --line: var(--eon-border);
  --text: var(--eon-text);
  --text-2: var(--eon-text-secondary);
  --text-3: var(--eon-text-muted);
  --accent: var(--eon-cyan);
  --accent-ink: #04101A;
  --accent-soft: rgba(95, 225, 255, .12);
  --ok: var(--eon-cyan);
  --warn: var(--eon-amber);
  --hard: var(--eon-orange);
  --bad: var(--eon-red);
  --info: var(--eon-blue);
  --shadow: var(--eon-shadow);
  --shadow-sm: var(--eon-shadow-sm);
  --img-bg: #080D18;
  --r-sm: var(--eon-radius-sm);
  --r: var(--eon-radius-md);
  --r-lg: var(--eon-radius-lg);
  --r-pill: 999px;
  --pad: 18px;
  --ease: var(--eon-ease);
  color-scheme: dark;
}
