/* Santé — identidade visual (Brandbook: Azul Royal, Rubi, Cinza Claro; tipografia Work Sans) */
@font-face { font-family: "Work Sans"; font-style: normal; font-weight: 300; font-display: swap; src: url(/fonts/work-sans-latin-300-normal.woff2) format("woff2"); }
@font-face { font-family: "Work Sans"; font-style: normal; font-weight: 400; font-display: swap; src: url(/fonts/work-sans-latin-400-normal.woff2) format("woff2"); }
@font-face { font-family: "Work Sans"; font-style: normal; font-weight: 500; font-display: swap; src: url(/fonts/work-sans-latin-500-normal.woff2) format("woff2"); }
@font-face { font-family: "Work Sans"; font-style: normal; font-weight: 600; font-display: swap; src: url(/fonts/work-sans-latin-600-normal.woff2) format("woff2"); }
@font-face { font-family: "Work Sans"; font-style: normal; font-weight: 700; font-display: swap; src: url(/fonts/work-sans-latin-700-normal.woff2) format("woff2"); }
@font-face { font-family: "Work Sans"; font-style: italic; font-weight: 300; font-display: swap; src: url(/fonts/work-sans-latin-300-italic.woff2) format("woff2"); }
@font-face { font-family: "Work Sans"; font-style: italic; font-weight: 700; font-display: swap; src: url(/fonts/work-sans-latin-700-italic.woff2) format("woff2"); }

:root {
  --azul: #063053;          /* Azul Royal */
  --azul-2: #0B4273;
  --rubi: #CE0058;          /* Rubi */
  --rubi-2: #A80048;
  --cinza: #D0D3E2;         /* Cinza Claro */
  --painel: #F6F6F9;
  --branco: #FFFFFF;
  --ink: #0E2238;
  --ink-2: #4B5A70;
  --ink-3: #7C879A;
  --line: #E1E4EE;
  --azul-soft: #E6ECF3;
  --rubi-soft: #FBE5EE;
  --good: #1E7F55; --good-soft: #DFF2E8;
  --warn: #9A6400; --warn-soft: #FBEFD5;
  --bad: #B42318;  --bad-soft: #FDE4E1;
  --radius: 14px;
  --shadow: 0 1px 2px rgba(6,48,83,.06), 0 6px 20px rgba(6,48,83,.06);
  --font: "Work Sans", "Segoe UI", system-ui, -apple-system, sans-serif;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--painel); color: var(--ink); font: 15px/1.5 var(--font); }
img { max-width: 100%; }
[hidden] { display: none !important; }
button, input, select, textarea { font: inherit; color: inherit; }
a { color: var(--azul); }
:focus-visible { outline: 2px solid var(--rubi); outline-offset: 2px; }
.num { font-variant-numeric: tabular-nums; }
.muted { color: var(--ink-3); font-size: 13px; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Títulos no padrão do brandbook: itálico leve + destaque em negrito itálico, fio rubi abaixo */
.titulo { font-style: italic; font-weight: 300; font-size: 28px; line-height: 1.15; color: var(--azul); margin: 0; letter-spacing: -.01em; text-wrap: balance; }
.titulo b { font-weight: 700; }
.titulo + .subtitulo { margin-top: 4px; }
.subtitulo { font-style: italic; font-weight: 300; color: var(--ink-2); margin: 0; }
.fio { display: block; width: 48px; height: 2px; background: var(--rubi); border: 0; margin: 12px 0 18px; }
h2, h3 { color: var(--azul); margin: 0; }
h3 { font-size: 16px; font-weight: 600; }

/* Botões */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; border: 0; border-radius: 10px; padding: 11px 18px; font-weight: 600; cursor: pointer; background: var(--azul); color: #fff; text-decoration: none; }
.btn:hover { background: var(--azul-2); }
.btn.rubi { background: var(--rubi); }
.btn.rubi:hover { background: var(--rubi-2); }
.btn.ghost { background: var(--azul-soft); color: var(--azul); }
.btn.ghost:hover { background: #D7E1EC; }
.btn.danger { background: var(--bad); }
.btn.sm { padding: 6px 12px; font-size: 13px; border-radius: 8px; }
.btn:disabled { opacity: .5; cursor: default; }
.link-btn { border: 0; background: none; color: var(--azul); font-weight: 600; cursor: pointer; padding: 4px; text-decoration: underline; text-underline-offset: 3px; }

/* Formulários */
.field { display: grid; gap: 4px; min-width: 0; }
.field > label, .lbl { font-size: 12px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--ink-2); }
.input, .field input, .field select, .field textarea { width: 100%; border: 1px solid var(--cinza); background: #fff; border-radius: 10px; padding: 10px 12px; }
.field textarea { min-height: 90px; resize: vertical; }
.input:focus, .field input:focus, .field select:focus, .field textarea:focus { border-color: var(--azul); outline: 2px solid var(--azul-soft); outline-offset: 0; }
.hint { font-size: 12px; color: var(--ink-3); }
.erro { color: var(--bad); font-size: 14px; font-weight: 500; }
.ok-msg { color: var(--good); font-size: 14px; font-weight: 500; }

.ck { display: inline-flex; align-items: center; gap: 7px; border: 1px solid var(--cinza); border-radius: 999px; padding: 5px 12px 5px 9px; font-size: 13px; cursor: pointer; background: #fff; user-select: none; }
.ck input { margin: 0; accent-color: var(--azul); width: 15px; height: 15px; }
.ck:has(input:checked) { border-color: var(--azul); background: var(--azul-soft); color: var(--azul); }
.ck.forte { font-weight: 600; }
.ck:has(input:disabled) { opacity: .55; cursor: default; }
.sw { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; font-size: 14px; color: var(--ink-2); }
.sw input { appearance: none; width: 34px; height: 20px; border-radius: 10px; background: var(--cinza); position: relative; margin: 0; cursor: pointer; flex: none; transition: background .15s; }
.sw input::after { content: ""; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: #fff; transition: left .15s; }
.sw input:checked { background: var(--good); }
.sw input:checked::after { left: 16px; }

/* Pílulas de estado */
.pill { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 600; padding: 2px 9px; border-radius: 999px; white-space: nowrap; }
.pill.good { background: var(--good-soft); color: var(--good); }
.pill.mid { background: var(--warn-soft); color: var(--warn); }
.pill.bad { background: var(--bad-soft); color: var(--bad); }
.pill.azul { background: var(--azul-soft); color: var(--azul); }
.pill.rubi { background: var(--rubi-soft); color: var(--rubi-2); }
.pill.neutra { background: var(--painel); color: var(--ink-2); border: 1px solid var(--line); }
.bit { font-size: 11px; font-weight: 700; padding: 1px 7px; border-radius: 5px; font-variant-numeric: tabular-nums; }
.bit.um { background: var(--good-soft); color: var(--good); }
.bit.zero { background: var(--bad-soft); color: var(--bad); }


.rc-nota { font-size: 11px; color: var(--ink-3); font-style: normal; }
.rc-nota a { color: inherit; }
.toast { position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%); background: var(--azul); color: #fff; padding: 11px 18px; border-radius: 10px; font-size: 14px; z-index: 50; max-width: calc(100% - 32px); box-shadow: var(--shadow); }
.toast.erro-t { background: var(--bad); }

@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }