/* ═══════════════════════════════════════════════════════════
   MIRA · tokens — a única fonte da verdade do visual.
   Base herdada do Farol (neutros frios, dois temas nascidos juntos).
   Camada de carreira: só destaque, secundária, motivo e detalhe tipográfico.
   Modo claro/escuro: data-modo no <html> (o script do <head> decide antes de pintar).
   ═══════════════════════════════════════════════════════════ */

/* ── escala, tipografia, raios, movimento ── */
:root {
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 24px;
  --s-6: 32px; --s-7: 48px; --s-8: 64px; --s-9: 96px;

  --f-display: 'Instrument Sans', -apple-system, 'SF Pro Display', system-ui, sans-serif;
  --f-texto:   'Onest', -apple-system, 'SF Pro Text', system-ui, sans-serif;
  --t-56: 56px; --t-34: 34px; --t-28: 28px; --t-22: 22px; --t-17: 17px; --t-15: 15px; --t-13: 13px; --t-11: 11px;

  --r-s: 10px;  --r: 14px;  --r-l: 22px;  --r-pill: 999px;

  --mola:    cubic-bezier(.2, .8, .2, 1);
  --retorno: cubic-bezier(.34, 1.56, .64, 1);
  --d-toque: 60ms;
  --d-volta: 320ms;
  --d-tela:  280ms;
  --d-folha: 320ms;

  --aba-h: 64px;
  --col: 560px;
  --sa-b: env(safe-area-inset-bottom, 0px);
  --sa-t: env(safe-area-inset-top, 0px);
}

/* ── neutros: claro (base) ── */
:root, [data-modo="claro"] {
  color-scheme: light;
  --bg:     #F5F6F8;
  --sup:    #FFFFFF;
  --sup-2:  #ECEEF2;
  --txt:    #111318;
  --txt-2:  #5C6370;
  --txt-3:  #667085;
  --sep:    #E3E6EB;

  --ok:   #177F4F;
  --erro: #C8323A;
  --aten: #8F5F00;

  --vidro:        rgba(255, 255, 255, .58);
  --vidro-borda:  rgba(255, 255, 255, .75);
  --vidro-brilho: rgba(255, 255, 255, .95);
  --vidro-sombra: rgba(17, 19, 24, .14);
  --motivo-op: .075;
}

/* ── neutros: escuro ── */
@media (prefers-color-scheme: dark) {
  :root:not([data-modo]) { color-scheme: dark; --bg: #0E0F12; --sup: #17191E; --sup-2: #1F2229; --txt: #F2F3F5; --txt-2: #9AA0AB; --txt-3: #858C97; --sep: #26292F; --ok: #3CCB84; --erro: #F0616A; --aten: #E8B54D; --vidro: rgba(23,25,30,.58); --vidro-borda: rgba(255,255,255,.12); --vidro-brilho: rgba(255,255,255,.35); --vidro-sombra: rgba(0,0,0,.45); --motivo-op: .11; }
}
[data-modo="escuro"] {
  color-scheme: dark;
  --bg:     #0E0F12;
  --sup:    #17191E;
  --sup-2:  #1F2229;
  --txt:    #F2F3F5;
  --txt-2:  #9AA0AB;
  --txt-3:  #858C97;
  --sep:    #26292F;

  --ok:   #3CCB84;
  --erro: #F0616A;
  --aten: #E8B54D;

  --vidro:        rgba(23, 25, 30, .58);
  --vidro-borda:  rgba(255, 255, 255, .12);
  --vidro-brilho: rgba(255, 255, 255, .35);
  --vidro-sombra: rgba(0, 0, 0, .45);
  --motivo-op: .11;
}

/* ═══ camada de carreira ═══
   Cada carreira define 6 cores (-l claro, -d escuro) e o motivo.
   Contraste conferido por testes/contraste.mjs (AA: 4,5:1 texto, 3:1 gráfico).
   Nada de brasão, insígnia ou logotipo. */

[data-carreira="administrativo"] {
  --c-acc-l: #2459E0; --c-acctxt-l: #FFFFFF; --c-sec-l: #5E6675;
  --c-acc-d: #5B8CFF; --c-acctxt-d: #08122B; --c-sec-d: #9AA0AB;
  --motivo: none;
}
[data-carreira="militar"] {
  --c-acc-l: #4A652B; --c-acctxt-l: #FFFFFF; --c-sec-l: #75683F;
  --c-acc-d: #A3C170; --c-acctxt-d: #121A08; --c-sec-d: #C4B58C;
  /* grade de coordenadas: linha fina a cada 24 px, marca maior a cada 96 px */
  --motivo: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96'%3E%3Cpath d='M0 .5H96M.5 0V96M0 24.5H96M0 48.5H96M0 72.5H96M24.5 0V96M48.5 0V96M72.5 0V96' stroke='%23000' stroke-width='1' fill='none' opacity='.55'/%3E%3Cpath d='M44 48.5H53M48.5 44V53' stroke='%23000' stroke-width='1.5'/%3E%3C/svg%3E");
  --motivo-tam: 96px 96px;
  --rotulo-transform: uppercase; --rotulo-espaco: .12em; --rotulo-variante: normal;
}
[data-carreira="prefeitura"] {
  --c-acc-l: #1765C1; --c-acctxt-l: #FFFFFF; --c-sec-l: #23764D;
  --c-acc-d: #6FAAF5; --c-acctxt-d: #06182E; --c-sec-d: #6FCF9C;
  /* quadras: malha ortogonal irregular, como ruas vistas de cima */
  --motivo: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='120'%3E%3Cpath d='M0 18.5H160M0 61.5H160M0 97.5H160M22.5 0V120M71.5 0V120M118.5 0V120M71.5 40.5H118.5M140.5 61.5V97.5M40.5 97.5V120' stroke='%23000' stroke-width='3' fill='none'/%3E%3C/svg%3E");
  --motivo-tam: 160px 120px;
  --rotulo-transform: uppercase; --rotulo-espaco: .06em; --rotulo-variante: normal;
}
[data-carreira="juridico"] {
  --c-acc-l: #7A2638; --c-acctxt-l: #FFFFFF; --c-sec-l: #4A4A55;
  --c-acc-d: #D8959F; --c-acctxt-d: #2A0A12; --c-sec-d: #A9A9B6;
  /* fio duplo horizontal, como os filetes de um código anotado */
  --motivo: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='22'%3E%3Cpath d='M0 1.5H8M0 5.5H8' stroke='%23000' stroke-width='1'/%3E%3C/svg%3E");
  --motivo-tam: 8px 22px;
  --rotulo-transform: none; --rotulo-espaco: .08em; --rotulo-variante: all-small-caps;
}

/* a carreira alimenta os tokens de uso (declarados no mesmo elemento que a escolhe) */
[data-carreira] {
  --acc: var(--c-acc-l); --acc-txt: var(--c-acctxt-l); --sec: var(--c-sec-l);
}
[data-modo="escuro"][data-carreira], [data-modo="escuro"] [data-carreira] {
  --acc: var(--c-acc-d); --acc-txt: var(--c-acctxt-d); --sec: var(--c-sec-d);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-modo])[data-carreira] { --acc: var(--c-acc-d); --acc-txt: var(--c-acctxt-d); --sec: var(--c-sec-d); }
}
/* o modo declarado no próprio elemento vence o herdado (prancha clara dentro de página escura e vice-versa) */
[data-modo="claro"][data-carreira] { --acc: var(--c-acc-l); --acc-txt: var(--c-acctxt-l); --sec: var(--c-sec-l); }
[data-modo="escuro"][data-carreira] { --acc: var(--c-acc-d); --acc-txt: var(--c-acctxt-d); --sec: var(--c-sec-d); }
[data-carreira] {
  --acc-soft: color-mix(in srgb, var(--acc) 13%, transparent);
  --acc-line: color-mix(in srgb, var(--acc) 38%, transparent);
}

/* ── modo sóbrio ── */
@media (prefers-reduced-motion: reduce) {
  :root { --d-toque: 0ms; --d-volta: 120ms; --d-tela: 0ms; --d-folha: 120ms; --retorno: ease-out; }
}
:root.sobrio { --d-volta: 150ms; --retorno: ease-out; }
