/* Painel MG · tokens das telas (visual Geist, tema claro)
   Valores exatos usados nas 12 telas do handoff. Use estes nomes no código. */
:root {
  /* Superfícies */
  --bg-app: #f3f4f3;          /* fundo atrás do menu e do painel */
  --bg-panel: #ffffff;        /* painel de conteúdo e cartões */
  --bg-subtle: #fafbfa;       /* cabeçalho de tabela, linha de total */
  --bg-hover: #f7f8f7;        /* hover de linha (indicador .rows) */
  --bg-muted: #f3f4f3;        /* trilho de segmented control, chips neutros */
  --bg-input: #e9ecea;        /* busca do menu */
  --bg-selected: #eef5f4;     /* linha selecionada */

  /* Texto */
  --ink: #0f1715;             /* texto principal */
  --ink-2: #4f5a57;           /* rótulos, texto secundário */
  --ink-3: #6b7673;           /* descrições, cabeçalhos de coluna */
  --ink-4: #8a9491;           /* metadados, fontes, "—" */
  --ink-disabled: #c3cac8;

  /* Linhas */
  --line: #e4e8e7;            /* borda de cartão e controle */
  --line-soft: #eef1f0;       /* divisórias internas */
  --line-faint: #f0f2f1;      /* linhas de tabela e grade de gráfico */
  --line-dashed: #c3cac8;     /* "não conectado", em aberto */

  /* Marca e papéis fixos */
  --brand: #0d6b66;           /* dados principais, curva, link, foco */
  --brand-tint: rgba(13,107,102,.20);
  --offer: #b07d0a;           /* SÓ o momento da oferta (1:55 / 1:25) */
  --offer-ink: #7a5300;       /* texto sobre --offer-bg */
  --offer-bg: #fbf1dc;
  --live: #c2471e;            /* SÓ "agora" / ao vivo */
  --live-bg: #fbe6de;
  --series-2: #3d5a9e;        /* segunda série (anúncio comparado) */
  --series-3: #a8b1af;        /* séries de fundo */
  --stall: #6a4fb0;           /* SÓ travamentos */

  /* Estados (sempre com palavra ou ícone) */
  --ok: #1d7a47;   --ok-bg: #e3f2e8;
  --bad: #b42d24;  --bad-bg: #fbe6e4;
  --warn: #7a5300; --warn-bg: #fbf1dc;

  /* Tipo */
  --font-sans: "Geist", "Helvetica Neue", Arial, sans-serif;
  --font-mono: "Geist Mono", ui-monospace, Menlo, monospace;
  --text-xs: 11px;    /* rótulos de eixo, pílulas */
  --text-sm: 12px;    /* metadados */
  --text-md: 12.5px;  /* rótulos de cartão, controles */
  --text-base: 13px;  /* linhas de tabela, menu */
  --text-body: 14px;  /* corpo, títulos de cartão (600) */
  --text-lg: 18px;    /* título da tela (600) */
  --text-num-sm: 20px;
  --text-num: 26px;   /* números de indicador (500, -0.03em, tabular) */

  /* Espaço (grade de 4px) */
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px;
  --space-5: 20px; --space-6: 24px; --space-7: 28px;

  /* Raios */
  --radius-xs: 5px;   /* pílulas de estado */
  --radius-sm: 6px;   /* chips, botões internos */
  --radius-md: 8px;   /* botões, inputs, itens de menu */
  --radius-lg: 12px;  /* cartões */
  --radius-xl: 14px;  /* painel de conteúdo */

  /* Sombras */
  --shadow-panel: 0 1px 2px rgba(15,23,21,.04);
  --shadow-pop: 0 6px 20px rgba(15,23,21,.08);

  /* Movimento (indicador ancorado) */
  --dur: 220ms;
  --ease: cubic-bezier(.2,.8,.2,1);

  /* Alturas de linha */
  --row-menu: 32px; --row-table: 48px; --row-trace: 40px; --control: 30px;
}