/* Mobi Eletroposto — tokens de marca (compartilhados entre app e painel) */
:root {
  --ink: #0A1F44;        /* azul-noite: texto e superfícies escuras */
  --ink-2: #3D4F73;      /* texto secundário */
  --ink-3: #7A89A8;      /* texto terciário / ícones */
  --volt: #1652F0;       /* azul Mobi: ação primária */
  --volt-press: #0F42C7;
  --sky: #3FB8FF;        /* faísca: energia, progresso */
  --sky-soft: #E3F4FF;
  --mist: #EEF3FA;       /* fundo do app */
  --paper: #FFFFFF;
  --line: #DCE4F0;
  --charge: #12B886;     /* somente estado "carregando"/sucesso */
  --charge-soft: #E3F8F1;
  --warn: #F2A516;
  --warn-soft: #FFF4DC;
  --stop: #E1464A;
  --stop-soft: #FDECEC;

  --f-display: 'Bricolage Grotesque', system-ui, sans-serif;
  --f-body: 'Figtree', system-ui, sans-serif;

  --r-sm: 10px;
  --r-md: 16px;
  --r-lg: 24px;
  --r-pill: 999px;

  --shadow-1: 0 1px 2px rgba(10, 31, 68, .06), 0 2px 8px rgba(10, 31, 68, .05);
  --shadow-2: 0 8px 28px rgba(10, 31, 68, .14);
  --ease: cubic-bezier(.2, .8, .2, 1);
}

*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; } /* classes com display (ex.: .stack) não podem "reaparecer" elementos ocultos */
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; font-family: var(--f-body); color: var(--ink); background: var(--mist); font-size: 16px; line-height: 1.45; -webkit-font-smoothing: antialiased; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
a { color: var(--volt); }
:focus-visible { outline: 3px solid var(--sky); outline-offset: 2px; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.num { font-family: var(--f-display); font-variant-numeric: tabular-nums; letter-spacing: -.02em; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; transition-duration: .001ms !important; }
}