/* Sabiá — esquemas de cor da exploração.
   Tokens semânticos: cada versão usa SÓ estes nomes; nenhum hex fora deste arquivo.
   Contraste validado (WCAG): texto, --muted, --urgent e --calm ≥ 4,5:1 sobre fundo e superfície;
   texto de botão ≥ 4,5:1; --line ≥ 3:1 sobre o fundo (bordas de campo visíveis).
   Exceção conhecida: tema 0, texto do botão a 4,0:1 — é a paleta atual, mantida como referência. */

:root,
:root[data-tema="0"]{ /* 0 · Mata à noite — a paleta atual do briefing */
  --bg:#0E2119; --surface:#142E22; --fg:#F6F1E4; --muted:#B6A692; --line:#7A6553;
  --accent:#C2562B; --on-accent:#F6F1E4; --urgent:#E9A93A; --on-urgent:#0E2119; --calm:#8DA07A;
  --accent-inv:#A8461F; --on-accent-inv:#F6F1E4; /* destaque sobre bloco --fg */
  color-scheme:dark;
}
:root[data-tema="1"]{ /* 1 · Azulejo — cobalto dos azulejos à noite + o laranja do peito do sabiá */
  --bg:#0C1A2E; --surface:#13274A; --fg:#F5F0E6; --muted:#AEBBD0; --line:#5A74A3;
  --accent:#E8702A; --on-accent:#0C1A2E; --urgent:#F4C542; --on-urgent:#0C1A2E; --calm:#8FB8E8;
  --accent-inv:#A84A12; --on-accent-inv:#F5F0E6; /* destaque sobre bloco --fg */
  color-scheme:dark;
}
:root[data-tema="2"]{ /* 2 · Ipê amarelo — amarelo chapado, tinta preta, verde da mata */
  --bg:#F2C12E; --surface:#F7D766; --fg:#17160F; --muted:#4E4012; --line:#7A5E12;
  --accent:#0F5A3A; --on-accent:#FBEFC4; --urgent:#8E2413; --on-urgent:#FFF3D6; --calm:#174F7A;
  --accent-inv:#5FD39A; --on-accent-inv:#17160F; /* destaque sobre bloco --fg */
  color-scheme:light;
}
:root[data-tema="3"]{ /* 3 · MASP — concreto da Paulista + vermelho dos pilares da Lina */
  --bg:#E8E4DD; --surface:#F5F2ED; --fg:#1A1A1A; --muted:#57524B; --line:#827B70;
  --accent:#C8231A; --on-accent:#FFFFFF; --urgent:#8A4C00; --on-urgent:#FFFFFF; --calm:#2C6A4C;
  --accent-inv:#FF5A45; --on-accent-inv:#1A1A1A; /* destaque sobre bloco --fg */
  color-scheme:light;
}
:root[data-tema="4"]{ /* 4 · Peito do sabiá — ferrugem do peito, garganta creme, amarelo do anel do olho */
  --bg:#A64A24; --surface:#8F3D1B; --fg:#FBF1E3; --muted:#FDEBDD; --line:#EBB08F;
  --accent:#1E140C; --on-accent:#F5C04A; --urgent:#FFE6A3; --on-urgent:#1E140C; --calm:#E3EAC0;
  --accent-inv:#1E140C; --on-accent-inv:#F5C04A; /* destaque sobre bloco --fg */
  color-scheme:dark;
}

/* Derivados — use estes em vez de rgba com número. */
:root{
  --hair:  color-mix(in srgb, var(--fg) 14%, transparent);   /* filete fino */
  --hair-2:color-mix(in srgb, var(--fg) 28%, transparent);   /* filete visível */
  --ghost: color-mix(in srgb, var(--fg) 10%, transparent);   /* texto-fantasma decorativo */
  --veil:  color-mix(in srgb, var(--bg) 82%, transparent);   /* véu sobre fundo decorativo */
}

/* Barra de revisão — ferramenta da exploração, não faz parte da página. */
.tema-switch{position:fixed;left:16px;bottom:16px;z-index:2147483000;display:flex;align-items:center;gap:6px;
  padding:7px 8px 7px 14px;border-radius:999px;background:rgba(12,12,12,.86);color:#fff;
  font:500 12px/1 Inter,system-ui,sans-serif;letter-spacing:.02em;box-shadow:0 2px 12px rgba(0,0,0,.3)}
.tema-switch .rot{opacity:.7;margin-right:2px}
.tema-switch .nome{min-width:112px;margin-left:4px;opacity:.95}
.tema-switch button{cursor:pointer;padding:0;border:2px solid transparent;font:500 12px/1 Inter,system-ui,sans-serif}
.tema-switch button.cor{width:24px;height:24px;border-radius:50%;color:transparent}
.tema-switch button.cor[aria-pressed="true"]{border-color:#fff}
.tema-switch .sep{width:1px;height:20px;background:rgba(255,255,255,.28);margin:0 4px}
.tema-switch button.tela{height:28px;padding:0 14px;border-radius:999px;background:rgba(255,255,255,.14);color:#fff}
.tema-switch button.tela[aria-pressed="true"]{background:#fff;color:#111}
.tema-celular{position:fixed;inset:0;z-index:2147482000;display:grid;place-items:center;background:rgba(10,10,10,.84)}
.tema-celular iframe{width:390px;height:min(844px,calc(100vh - 110px));border:0;border-radius:40px;background:#000;
  box-shadow:0 0 0 10px #151515,0 0 0 11px #3a3a3a,0 30px 80px rgba(0,0,0,.5)}
html.tema-celular-aberto{overflow:hidden}
html.tema-limpo .tema-switch{display:none}
@media (max-width:640px){.tema-switch .nome,.tema-switch .sep,.tema-switch button.tela{display:none}}