/* Sinalvita – estilos. Cores definidas como tokens; tema escuro automático. */
:root {
  --bg: #f6f5f4;
  --surface: #ffffff;
  --surface-2: #f1efed;
  --border: #e3dfdc;
  --input-border: #a9a19b;
  --text: #1f2328;
  --text-2: #57606a;
  --muted: #6b7280;
  --brand: #0d6b74;
  --brand-2: #0a4f57;
  --brand-soft: #e1f1f2;
  --logo-escuro: #0f2f3d;
  --logo-verde: #12a364;
  --accent: #334e7a;
  --focus: #2f6fdb;
  --grid: rgba(0, 0, 0, 0.07);
  --band: rgba(22, 163, 74, 0.13);
  --band-line: rgba(22, 163, 74, 0.55);
  --ref-line: rgba(60, 60, 60, 0.45);
  --zona-r: rgba(255, 51, 85, 0.12);
  --zona-y: rgba(255, 204, 0, 0.22);
  --zona-g: rgba(0, 214, 130, 0.16);
  /* Cores dos gráficos e da barra de posição (o texto e as etiquetas continuam com --st-*) */
  /* paleta viva e brilhante: esmeralda, ouro, coral, lilás e ciano */
  --ch-verde: #00d682;
  --ch-amarelo: #ffcc00;
  --ch-vermelho: #ff3355;
  --ch-cinza: #a98bff;
  --ch-linha: #00a8ff;
  --ch-ponto-normal: #00b86e;
  --ch-ponto-baixo: #ff9500;
  --ch-ponto-alto: #ff1f45;
  /* números/textos com a mesma cor do gráfico, um pouco mais fortes para leitura */
  --ch-txt-verde: #00a862;
  --ch-txt-amarelo: #cc9200;
  --ch-txt-vermelho: #e8173c;
  --ch-txt-cinza: #7b55f5;
  --st-normal: #15803d;
  --st-baixo: #c2710c;
  --st-alto: #d11a2a;
  --st-alterado: #d11a2a;
  --st-none: #94a3b8;
  --shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 2px 8px rgba(0, 0, 0, 0.04);
  --radius: 14px;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #141518;
    --surface: #1d1f23;
    --surface-2: #26292e;
    --border: #33363c;
    --input-border: #5f646d;
    --text: #eceef1;
    --text-2: #b4bac3;
    --muted: #9aa1ab;
    --brand: #3cc3cc;
    --brand-2: #1f9aa3;
    --brand-soft: #10303a;
    --accent: #8fb0e8;
    --focus: #6b9cf0;
    --grid: rgba(255, 255, 255, 0.08);
    --band: rgba(74, 222, 128, 0.14);
    --band-line: rgba(74, 222, 128, 0.5);
    --ref-line: rgba(255, 255, 255, 0.4);
    --zona-r: rgba(255, 64, 96, 0.17);
    --zona-y: rgba(255, 214, 10, 0.15);
    --zona-g: rgba(0, 230, 140, 0.15);
    --ch-verde: #00e68c;
    --ch-amarelo: #ffd60a;
    --ch-vermelho: #ff4d6d;
    --ch-cinza: #9d7bff;
    --ch-linha: #2ec4ff;
    --ch-ponto-normal: #2bffaa;
    --ch-ponto-baixo: #ffaa33;
    --ch-ponto-alto: #ff6b88;
    --ch-txt-verde: #2bffaa;
    --ch-txt-amarelo: #ffd60a;
    --ch-txt-vermelho: #ff6b88;
    --ch-txt-cinza: #b9a2ff;
    --st-normal: #4ade80;
    --st-baixo: #f5a524;
    --st-alto: #ff5c66;
    --st-alterado: #ff5c66;
    --st-none: #6b7280;
    --shadow: none;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #141518; --surface: #1d1f23; --surface-2: #26292e; --border: #33363c; --input-border: #5f646d;
  --text: #eceef1; --text-2: #b4bac3; --muted: #9aa1ab;
  --brand: #3cc3cc; --brand-2: #1f9aa3; --brand-soft: #10303a; --accent: #8fb0e8; --focus: #6b9cf0;
  --grid: rgba(255, 255, 255, 0.08); --band: rgba(74, 222, 128, 0.14); --band-line: rgba(74, 222, 128, 0.5);
  --ref-line: rgba(255, 255, 255, 0.4); --zona-r: rgba(255, 64, 96, 0.17); --zona-y: rgba(255, 214, 10, 0.15); --zona-g: rgba(0, 230, 140, 0.15);
  --ch-verde: #00e68c; --ch-amarelo: #ffd60a; --ch-vermelho: #ff4d6d; --ch-cinza: #9d7bff; --ch-linha: #2ec4ff;
  --ch-ponto-normal: #2bffaa; --ch-ponto-baixo: #ffaa33; --ch-ponto-alto: #ff6b88;
  --ch-txt-verde: #2bffaa; --ch-txt-amarelo: #ffd60a; --ch-txt-vermelho: #ff6b88; --ch-txt-cinza: #b9a2ff;
  --st-normal: #4ade80; --st-baixo: #f5a524; --st-alto: #ff5c66; --st-alterado: #ff5c66; --st-none: #6b7280;
  --shadow: none; color-scheme: dark;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font: 15px/1.5 "Segoe UI", Roboto, system-ui, -apple-system, Helvetica, Arial, sans-serif;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
h1 { font-size: 1.6rem; margin: 0 0 4px; line-height: 1.2; }
h2 { font-size: 1.1rem; margin: 0 0 12px; }
h3 { font-size: 1rem; margin: 20px 0 8px; }
p { margin: 0 0 10px; }
a { color: var(--brand); }
.muted { color: var(--muted); }
.small { font-size: 0.85rem; }
.txt-warn { color: var(--st-alto); font-weight: 600; }
.txt-ok { color: var(--st-normal); font-weight: 600; }
[hidden] { display: none !important; }

/* ---------- Cabeçalho ---------- */
.topbar {
  position: sticky; top: 0; z-index: 20;
  display: flex; align-items: center; gap: 24px;
  padding: 10px max(16px, calc((100vw - 1180px) / 2));
  background: color-mix(in srgb, var(--surface) 92%, transparent);
  backdrop-filter: saturate(1.4) blur(8px);
  border-bottom: 1px solid var(--border);
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.02), 0 4px 16px rgba(0, 0, 0, 0.04);
}
/* faixa fina na cor da marca */
.topbar::before {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px;
  background: linear-gradient(90deg, #ff4d6d, #ffc21a, #19d48a); /* faixa do semáforo, como no logo */
}
.brand { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--text); flex: none; }
.brand img { border-radius: 10px; box-shadow: 0 2px 6px rgba(15, 47, 61, 0.25); }
.brand-text { display: flex; flex-direction: column; line-height: 1.05; }
.brand-name { font-weight: 800; font-size: 1.35rem; letter-spacing: -0.03em; }
.brand-name { color: var(--logo-escuro); }
.brand-name span { color: var(--logo-verde); }
:root[data-theme="dark"] .brand-name { color: var(--text); }
:root[data-theme="dark"] .brand-name span { color: #19d48a; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .brand-name { color: var(--text); }
  :root:not([data-theme="light"]) .brand-name span { color: #19d48a; }
}
.brand-tag { font-size: 0.68rem; color: var(--muted); letter-spacing: .06em; text-transform: uppercase; margin-top: 2px; }

/* Menu principal em "pílula" */
.nav { display: flex; gap: 2px; padding: 4px; background: var(--surface-2); border: 1px solid var(--border); border-radius: 12px; }
.nav a, .nav button {
  display: flex; align-items: center; gap: 7px; background: none; border: none; font-family: inherit; cursor: pointer; white-space: nowrap;
  padding: 7px 14px; border-radius: 9px;
  color: var(--text-2); text-decoration: none; font-weight: 600; font-size: 0.92rem;
  transition: background .15s, color .15s, box-shadow .15s;
}
.nav a svg, .nav button svg { width: 17px; height: 17px; fill: currentColor; }
.nav a:hover, .nav button:hover { color: var(--text); background: color-mix(in srgb, var(--surface) 60%, transparent); }
.nav a.active { background: var(--surface); color: var(--brand); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); }
.nav button:disabled { opacity: 0.4; cursor: default; background: none; }
/* "+ Novo exame": mesmo formato dos outros, com um destaque discreto (texto vermelho e "+" num círculo) */
.nav .nav-cta { color: var(--brand); }
.nav .nav-cta svg:first-child { background: var(--brand); fill: #fff; border-radius: 50%; padding: 2px; }
.nav .nav-cta:hover, .nav .nav-cta[aria-expanded="true"] { color: var(--brand-2); background: color-mix(in srgb, var(--brand) 8%, var(--surface)); }
.nav .nav-cta.active { background: var(--surface); color: var(--brand); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); }
.nav .nav-cta .nav-chev { width: 15px; height: 15px; margin-left: -3px; transition: transform .15s; }
.nav .nav-cta[aria-expanded="true"] .nav-chev { transform: rotate(180deg); }
/* Menu "Novo exame": digitar ou importar PDF */
.novo-menu { position: fixed; right: auto; padding: 6px; display: grid; gap: 2px; z-index: 60; }
.novo-menu[hidden] { display: none; }
.novo-menu .novo-opt { align-items: center; gap: 12px; padding: 10px; }
.novo-ico { width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center; flex: none; background: var(--brand-soft); }
.novo-menu .novo-ico svg { width: 20px; height: 20px; fill: var(--brand); }
.novo-ico-pdf { background: color-mix(in srgb, var(--focus) 14%, var(--surface)); }
.novo-menu .novo-ico-pdf svg { fill: var(--focus); }
.novo-txt { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.novo-txt strong { font-size: 0.93rem; }
.novo-txt small { font-size: 0.78rem; color: var(--muted); white-space: normal; }
/* Botão "← Voltar" no título das telas */
.btn-back svg { width: 18px; height: 18px; fill: currentColor; }
.btn-back:disabled { opacity: 0.45; cursor: default; }
.nav .lbl-short { display: none; }
@media (max-width: 700px) {
  .nav .lbl-long { display: none; }
  .nav .lbl-short { display: inline; }
}
.profile-select { max-width: 180px; }

/* ---------- Tela de entrada (nome e senha) ---------- */
body.locked .topbar, body.locked .view, body.locked .footer, body.locked .sync-banner { display: none !important; }
.gate {
  min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 24px 16px; background:
    radial-gradient(circle at 50% 0%, var(--brand-soft), transparent 60%), var(--bg);
}
.gate-card { width: 100%; max-width: 420px; padding: 28px 26px; margin: 0; }
.gate-card h1 { font-size: 1.35rem; margin-bottom: 8px; }
.gate-logo { display: flex; align-items: center; justify-content: center; gap: 10px; margin-bottom: 18px; }
.gate-logo img { border-radius: 14px; }
.gate-logo .brand-name { font-size: 1.8rem; }
.gate-btn { width: 100%; margin-top: 4px; padding: 11px 16px; }
.gate-foot { color: var(--muted); font-size: 0.8rem; margin-top: 14px; text-align: center; }
.gate-check { margin: 12px 0; }
.link-btn {
  display: block; margin: 12px auto 0; background: none; border: none; font: inherit; font-size: 0.9rem;
  color: var(--brand); text-decoration: underline; cursor: pointer;
}
.recovery-code {
  margin: 14px 0 6px; padding: 14px; text-align: center; border: 2px dashed var(--brand); border-radius: 12px;
  font: 700 1.5rem/1.2 ui-monospace, Consolas, monospace; letter-spacing: 0.08em; background: var(--surface-2);
  user-select: all;
}
.caixa-alta { text-transform: uppercase; letter-spacing: .02em; }
.code-input { text-transform: uppercase; font-family: ui-monospace, Consolas, monospace; letter-spacing: 0.06em; }
/* Lado direito do cabeçalho: [Imprimir | Enviar]  [avatar ▾] */
.hdr-actions { display: flex; align-items: center; gap: 12px; margin-left: auto; }
.hdr-group { display: flex; border: 1px solid var(--border); border-radius: 10px; overflow: hidden; background: var(--surface); }
.hdr-btn {
  display: inline-flex; align-items: center; gap: 7px; padding: 8px 14px;
  background: none; border: none; font: inherit; font-weight: 600; font-size: 0.88rem;
  color: var(--text-2); cursor: pointer; white-space: nowrap;
}
.hdr-btn + .hdr-btn { border-left: 1px solid var(--border); }
.hdr-btn svg { width: 17px; height: 17px; fill: currentColor; flex: none; }
.hdr-btn:hover { background: var(--surface-2); color: var(--brand); }

/* ---------- Animações dos ícones do cabeçalho (ao passar o mouse ou focar pelo teclado) ---------- */
.nav a svg, .nav button svg { transform-origin: center; }
.nav a[href="#home"]:hover svg, .nav a[href="#home"]:focus-visible svg { animation: hl-pulo .6s ease; }
.nav a[href="#historico"]:hover svg, .nav a[href="#historico"]:focus-visible svg { animation: hl-lapis .7s ease; }
@keyframes hl-lapis { 0%, 100% { transform: rotate(0) translate(0, 0); } 30% { transform: rotate(-12deg) translate(-1px, 1px); } 60% { transform: rotate(8deg) translate(1px, -1px); } }
.nav a[href="#dashboard"]:hover svg, .nav a[href="#dashboard"]:focus-visible svg { animation: hl-lupa .8s ease; }
#btn-print:hover svg, #btn-print:focus-visible svg { animation: hl-imprime .7s ease; }
#btn-send:hover svg, #btn-send:focus-visible svg { animation: hl-voa .8s ease; }
.nav .nav-cta:hover svg:first-child, .nav .nav-cta:focus-visible svg:first-child { animation: hl-gira-mais .5s ease; }
.gear-btn:hover svg, .gear-btn:focus-visible svg { animation: hl-engrenagem 1s ease; transform: none; }
.user-btn:hover .avatar, .user-btn:focus-visible .avatar { animation: hl-pulsa .7s ease; }
.brand:hover img { animation: hl-batida 0.9s ease; }
/* O logo abre "Sobre o Sinalvita": ao passar o mouse aparece um fundo leve; na página Sobre fica destacado */
.topbar .brand { padding: 4px 10px 4px 4px; margin-left: -4px; border-radius: 14px; transition: background .15s; }
.topbar .brand:hover, .topbar .brand:focus-visible, .topbar .brand.active { background: var(--brand-soft); }

@keyframes hl-pulo { 0%, 100% { transform: translateY(0); } 35% { transform: translateY(-4px); } 65% { transform: translateY(1px); } }
@keyframes hl-volta-tempo { from { transform: rotate(0); } to { transform: rotate(-360deg); } }
@keyframes hl-lupa { 0%, 100% { transform: rotate(0) scale(1); } 25% { transform: rotate(-14deg) scale(1.12); } 50% { transform: rotate(10deg) scale(1.12); } 75% { transform: rotate(-6deg) scale(1.05); } }
@keyframes hl-imprime { 0%, 100% { transform: translateY(0); } 30% { transform: translateY(-2px); } 60% { transform: translateY(3px) scaleY(.92); } }
@keyframes hl-voa { 0% { transform: translate(0, 0); opacity: 1; } 45% { transform: translate(14px, -6px) rotate(-12deg); opacity: 0; } 46% { transform: translate(-12px, 4px); opacity: 0; } 100% { transform: translate(0, 0); opacity: 1; } }
@keyframes hl-gira-mais { from { transform: rotate(0) scale(1); } 60% { transform: rotate(180deg) scale(1.2); } to { transform: rotate(180deg) scale(1); } }
@keyframes hl-engrenagem { from { transform: rotate(0); } to { transform: rotate(180deg); } }
@keyframes hl-pulsa { 0%, 100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(13, 107, 116, .35); } 50% { transform: scale(1.08); box-shadow: 0 0 0 6px rgba(13, 107, 116, 0); } }
@keyframes hl-batida { 0%, 100% { transform: scale(1); } 15% { transform: scale(1.1); } 30% { transform: scale(1); } 45% { transform: scale(1.08); } 60% { transform: scale(1); } }

/* Respeita quem prefere menos movimento (configuração do sistema) */
@media (prefers-reduced-motion: reduce) {
  .nav a svg, .nav button svg, .gear-btn svg, .avatar, .brand img { animation: none !important; transition: none !important; }
}

/* Engrenagem (Configurações) à direita do Perfil */
.gear-btn {
  width: 40px; height: 40px; flex: none; display: grid; place-items: center; border-radius: 50%;
  border: 1px solid var(--border); background: var(--surface); color: var(--text-2);
  transition: background .15s, color .15s, transform .3s;
}
.gear-btn svg { width: 21px; height: 21px; fill: currentColor; transition: transform .4s; }
.gear-btn:hover { background: var(--surface-2); color: var(--text); }
.gear-btn.active { background: var(--brand-soft); color: var(--brand); border-color: color-mix(in srgb, var(--brand) 35%, var(--border)); }

/* Conta: avatar com a inicial + menu */
.user-menu { position: relative; }
.user-btn {
  display: flex; align-items: center; gap: 9px; padding: 4px 8px 4px 4px;
  background: none; border: 1px solid transparent; border-radius: 999px; font: inherit; color: var(--text); cursor: pointer;
}
.user-btn:hover, .user-btn[aria-expanded="true"], .user-btn.active { background: var(--surface-2); border-color: var(--border); }
.avatar {
  width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; flex: none;
  background: linear-gradient(135deg, var(--brand), var(--brand-2)); color: #fff; font-weight: 800; font-size: 0.95rem;
}
.user-label { display: flex; flex-direction: column; line-height: 1.1; text-align: left; }
.user-label strong { font-size: 0.88rem; }
.user-label small { font-size: 0.7rem; color: var(--muted); }
.chev { width: 18px; height: 18px; fill: var(--muted); transition: transform .15s; }
.user-btn[aria-expanded="true"] .chev { transform: rotate(180deg); }
.dropdown {
  position: absolute; right: 0; top: calc(100% + 8px); min-width: 210px; z-index: 40;
  background: var(--surface); border: 1px solid var(--border); border-radius: 12px; padding: 6px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.14);
}
.dropdown a, .dropdown button {
  display: flex; align-items: center; gap: 10px; width: 100%; padding: 9px 10px; border-radius: 8px;
  background: none; border: none; font: inherit; font-size: 0.92rem; color: var(--text); text-decoration: none; cursor: pointer; text-align: left;
}
.dropdown svg { width: 18px; height: 18px; fill: var(--text-2); }
.dropdown a:hover, .dropdown button:hover, .dropdown a:focus-visible, .dropdown button:focus-visible { background: var(--surface-2); }
.dropdown hr { border: none; border-top: 1px solid var(--border); margin: 6px 4px; }
#btn-logout { color: var(--st-alto); }
#btn-logout svg { fill: var(--st-alto); }

@media (max-width: 1400px) {
  .user-label, .brand-tag { display: none; }
  .topbar { gap: 14px; }
  .nav a, .nav button { padding: 7px 10px; }
}
@media (min-width: 701px) and (max-width: 1200px) {
  .nav span { display: none; } /* tela menor: só os ícones (o nome aparece ao passar o mouse) */
}
.span-2 { grid-column: span 2; }

/* Aviso de salvamento automático pausado */
.sync-banner {
  display: flex; align-items: center; justify-content: center; gap: 10px; flex-wrap: wrap;
  padding: 8px 16px; background: #fff4d6; color: #5c4400; border-bottom: 1px solid #f0d58a; font-size: 0.9rem;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .sync-banner { background: #3a3014; color: #f5e2a8; border-color: #5c4a1a; }
}
.sync-status { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

/* ---------- Estrutura ---------- */
.view { width: 100%; max-width: 1180px; margin: 0 auto; padding: 24px 16px 40px; flex: 1; outline: none; }
.footer { width: 100%; max-width: 1180px; margin: 0 auto; padding: 8px 16px 20px; text-align: center; }
/* Aviso médico no rodapé, no estilo do laudo */
.medical-note {
  margin: 0 auto 8px; max-width: 760px; padding: 10px 16px; border-radius: 8px;
  background: var(--brand-soft); color: var(--text); font-size: 0.85rem; font-weight: 600; line-height: 1.4;
}
.footer-sub { margin: 0; color: var(--muted); font-size: 0.78rem; }
.card {
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
  box-shadow: var(--shadow); padding: 20px; margin-bottom: 16px;
}
.page-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 18px; }
.page-head p { max-width: 720px; }

/* ---------- Formulários ---------- */
input, select, textarea {
  font: inherit; color: var(--text);
  background: var(--surface); border: 1px solid var(--input-border); border-radius: 9px;
  padding: 8px 10px; min-width: 0; width: 100%;
}
/* Foco em azul: vermelho fica reservado para erros e valores fora da faixa */
input:focus, select:focus, textarea:focus, button:focus-visible, a:focus-visible, tr:focus-visible, summary:focus-visible {
  outline: 2px solid var(--focus); outline-offset: 1px; border-color: transparent;
}
.fld { display: flex; flex-direction: column; gap: 4px; margin-bottom: 12px; }
.fld > span { font-size: 0.85rem; font-weight: 600; color: var(--text-2); }
.fld.end { justify-content: flex-end; }
/* Busca de exame em destaque na digitação */
.entry-busca {
  margin: 6px 0 14px; padding: 14px 16px 10px; border-radius: 14px;
  background: color-mix(in srgb, var(--focus) 7%, var(--surface));
  border: 1px solid color-mix(in srgb, var(--focus) 30%, var(--border));
}
.entry-busca-tit { display: block; font-weight: 800; font-size: 0.95rem; margin-bottom: 8px; color: var(--text); }
.entry-busca-campo { position: relative; display: flex; align-items: center; }
.entry-busca-campo svg { position: absolute; left: 14px; width: 22px; height: 22px; fill: var(--focus); pointer-events: none; }
.entry-busca-campo input {
  width: 100%; padding: 13px 44px 13px 46px; font-size: 1.05rem; border-radius: 12px;
  border: 2px solid color-mix(in srgb, var(--focus) 55%, var(--border)); background: var(--surface);
}
.entry-busca-campo input:focus { border-color: var(--focus); box-shadow: 0 0 0 4px color-mix(in srgb, var(--focus) 18%, transparent); outline: none; }
.entry-busca-campo input::-webkit-search-cancel-button { display: none; }
.entry-busca-limpa {
  position: absolute; right: 8px; width: 30px; height: 30px; border-radius: 8px; border: 0;
  background: var(--surface-2); color: var(--text-2); cursor: pointer; font-size: 0.9rem;
}
.entry-busca-limpa:hover { background: color-mix(in srgb, var(--focus) 15%, var(--surface)); color: var(--focus); }
.entry-busca-dica { margin: 6px 2px 0; }
.grid-2, .grid-3, .grid-4 { display: grid; gap: 0 14px; }
.grid-2 { grid-template-columns: repeat(2, 1fr); }
.grid-3 { grid-template-columns: repeat(3, 1fr); }
.grid-4 { grid-template-columns: 2fr 1fr 1fr auto; align-items: end; }
.profile-edit { margin-top: 14px; padding-top: 14px; border-top: 1px dashed var(--border); }
.pf-actions { flex-direction: row; gap: 8px; }
.grid-5 { display: grid; gap: 0 14px; grid-template-columns: 1.6fr 1fr 1.5fr 1fr auto; align-items: end; }
.span-3 { grid-column: 1 / -1; }
.form-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 8px; flex-wrap: wrap; }
.form-error { color: var(--st-alto); font-weight: 600; min-height: 1em; margin: 8px 0 0; }
.check { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; font-size: 0.9rem; }
.check input { width: auto; }

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  font: inherit; font-weight: 600; text-decoration: none; cursor: pointer;
  padding: 9px 16px; border-radius: 10px; border: 1px solid transparent; white-space: nowrap;
}
.btn.primary { background: var(--brand); color: #fff; }
.btn.primary:hover { background: var(--brand-2); }
/* Envio: WhatsApp em verde e e-mail em azul, com o símbolo de cada um */
.btn.btn-whats, .btn.btn-email { color: #fff; display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.btn.btn-whats { background: #1fa855; }
.btn.btn-whats:hover { background: #178a45; }
.btn.btn-email { background: #1a73e8; }
.btn.btn-email:hover { background: #135cbd; }
.btn-ico { width: 18px; height: 18px; flex: none; }
.btn.ghost { background: var(--surface); color: var(--text); border-color: var(--border); }
.btn.ghost:hover { background: var(--surface-2); }
.btn.danger-ghost { background: transparent; color: var(--st-alto); border-color: var(--border); }
.btn.danger-ghost:hover { background: var(--brand-soft); }
.btn.sm { padding: 5px 10px; font-size: 0.85rem; }
.btn-row { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 12px; }
.file-btn { position: relative; }

/* ---------- Digitação de exames ---------- */
.cats { margin: 8px 0 16px; }
/* Categoria (Hemograma, Glicemia...): faixa destacada no topo do bloco */
details.cat { border: 1px solid var(--border); border-radius: 14px; margin-bottom: 14px; background: var(--surface-2); overflow: hidden; }
details.cat > summary {
  list-style: none; cursor: pointer; padding: 13px 18px; font-weight: 800; font-size: 1.02rem; letter-spacing: .01em;
  display: flex; justify-content: space-between; align-items: center; gap: 10px;
  background: linear-gradient(90deg, color-mix(in srgb, var(--brand) 11%, var(--surface)), var(--surface) 75%);
  border-left: 5px solid var(--brand); color: var(--text);
}
details.cat[open] > summary { border-bottom: 1px solid var(--border); }
details.cat > summary:hover { background: linear-gradient(90deg, color-mix(in srgb, var(--brand) 16%, var(--surface)), var(--surface) 75%); }
details.cat > summary::-webkit-details-marker { display: none; }
details.cat > summary::before { content: "▸"; color: var(--brand); margin-right: 4px; transition: transform .15s; }
details.cat[open] > summary::before { transform: rotate(90deg); }
details.cat > summary > span:first-child { flex: 1; }
.cat-count { font-size: 0.78rem; font-weight: 700; color: var(--ch-txt-verde); background: color-mix(in srgb, var(--ch-verde) 14%, var(--surface)); padding: 2px 10px; border-radius: 999px; }
.an-head, .an-row {
  /* nome · resultado · unidade · referência (larga o bastante para "Superior a 108,7") · posição */
  display: grid; grid-template-columns: minmax(150px, 1.45fr) minmax(80px, 100px) minmax(60px, 80px) minmax(175px, 1.15fr) minmax(90px, 0.75fr);
  gap: 10px; align-items: center; padding: 6px 16px;
}
.an-head { font-size: 0.72rem; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); padding: 10px 26px 2px; }
/* Cada exame num "cartão" com contorno arredondado */
.an-row {
  margin: 6px 10px; padding: 9px 16px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface);
  transition: border-color .15s, box-shadow .15s;
}
.an-row:hover, .an-row:focus-within { border-color: color-mix(in srgb, var(--focus) 45%, var(--border)); box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05); }
.an-row:last-child { margin-bottom: 12px; }
/* nome do exame: mesmo peso em todas as linhas (preenchidas ou não) */
.an-row .an-name { font-weight: 600; }

/* Material da coleta (Sangue, Soro, Plasma, Urina) ao lado do nome do exame */
.mat-tag {
  display: inline-block; margin-left: 6px; padding: 1px 7px; border-radius: 999px;
  font-size: 0.68rem; font-weight: 600; letter-spacing: .02em; line-height: 1.5;
  vertical-align: middle; white-space: nowrap; border: 1px solid transparent; cursor: help;
}
h2 .mat-tag { font-size: 0.72rem; position: relative; top: -2px; }
.mat-sangue { background: #fde8e8; color: #a51c1c; border-color: #f6c4c4; }
.mat-soro { background: #fff4d6; color: #8a5a00; border-color: #f2dc9c; }
.mat-plasma { background: #e6f0fb; color: #1f5590; border-color: #c4d8f1; }
.mat-urina { background: #fbf6cf; color: #6b6000; border-color: #ece08e; }
.mat-saliva { background: #e3f7f4; color: #0f6b5f; border-color: #a9e2d8; }
.mat-fezes { background: #f3ebe3; color: #6b4426; border-color: #dcc7b3; }
:root[data-theme="dark"] .mat-fezes { background: #33261b; color: #e3c2a3; border-color: #4f3a28; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .mat-fezes { background: #33261b; color: #e3c2a3; border-color: #4f3a28; } }
:root[data-theme="dark"] .mat-saliva { background: #123430; color: #8fe0d2; border-color: #1f4f48; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .mat-saliva { background: #123430; color: #8fe0d2; border-color: #1f4f48; } }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .mat-sangue { background: #3d1a1a; color: #f4a5a5; border-color: #5c2626; }
  :root:not([data-theme="light"]) .mat-soro { background: #3a2e12; color: #f0cc7a; border-color: #574519; }
  :root:not([data-theme="light"]) .mat-plasma { background: #16283d; color: #9cc3ef; border-color: #234063; }
  :root:not([data-theme="light"]) .mat-urina { background: #34320f; color: #e6dc78; border-color: #4f4b17; }
}
:root[data-theme="dark"] .mat-sangue { background: #3d1a1a; color: #f4a5a5; border-color: #5c2626; }
:root[data-theme="dark"] .mat-soro { background: #3a2e12; color: #f0cc7a; border-color: #574519; }
:root[data-theme="dark"] .mat-plasma { background: #16283d; color: #9cc3ef; border-color: #234063; }
:root[data-theme="dark"] .mat-urina { background: #34320f; color: #e6dc78; border-color: #4f4b17; }
/* campo preenchido: borda verde fina e fundo verde bem leve (em vez da borda grossa) */
.an-row input.f-val:not(:placeholder-shown),
.an-row .f-pct:not(:placeholder-shown),
.an-row.is-qual.filled select.f-val {
  border-color: color-mix(in srgb, var(--ch-verde) 75%, var(--input-border));
  background: color-mix(in srgb, var(--ch-verde) 6%, var(--surface));
}
.an-row.invalid-val .f-val, .an-row.invalid-ref .f-ref, .an-row.invalid-pct .f-pct, .an-row.invalid-pref .f-pref { border-color: var(--st-alto); background: color-mix(in srgb, var(--st-alto) 10%, var(--surface)); }
.an-row .f-un, .an-row .f-ref, .an-row .f-pref { color: var(--text-2); font-size: 0.9rem; }
.an-row .ref-cell:not(:has(.ref-edit)) { padding-right: 28px; }
/* Unidade e referência fixas: aparecem como texto */
.an-row input.locked { border-color: transparent; background: transparent; padding-left: 0; padding-right: 0; cursor: default; text-overflow: ellipsis; }
.an-row input.locked:focus { outline: none; }
.ref-cell { display: flex; align-items: center; gap: 2px; min-width: 0; }
.ref-edit {
  flex: none; width: 26px; height: 26px; border-radius: 6px; border: 1px solid var(--input-border);
  background: var(--surface); color: var(--text-2); cursor: pointer; font-size: 0.9rem; line-height: 1; opacity: 0.8;
}
.an-row:hover .ref-edit, .ref-edit:focus-visible { opacity: 1; }
.ref-edit:hover { border-color: var(--focus); color: var(--focus); }
.an-row.unlocked .ref-edit { display: none; }
.an-row.unlocked input.f-un, .an-row.unlocked input.f-ref { color: var(--text); }
.g-wrap { min-width: 0; }
/* Unidade com a listinha ▾ de unidades possíveis */
.un-cell { display: flex; align-items: center; gap: 2px; min-width: 0; }
.un-cell .f-un { flex: 1; min-width: 0; }
.un-pick {
  flex: none; width: 22px; height: 24px; border-radius: 6px; border: 1px solid var(--input-border);
  background: var(--surface); color: var(--text-2); cursor: pointer; font-size: 0.75rem; line-height: 1; padding: 0;
}
.un-pick:hover, .un-pick:focus-visible { border-color: var(--focus); color: var(--focus); }
.un-menu {
  position: fixed; z-index: 60; min-width: 150px; max-height: 320px; overflow-y: auto;
  background: var(--surface); border: 1px solid var(--border); border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.14); padding: 6px;
}
.un-menu-tit { font-size: 0.72rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--muted); padding: 4px 8px 6px; }
.un-opt {
  display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%;
  padding: 7px 10px; border: 0; border-radius: 7px; background: none; color: var(--text);
  font: inherit; font-size: 0.92rem; text-align: left; cursor: pointer;
}
.un-opt:hover, .un-opt:focus-visible { background: var(--surface-2); outline: none; }
.un-opt.on { background: color-mix(in srgb, var(--focus) 12%, var(--surface)); color: var(--focus); font-weight: 700; }
.un-padrao { font-size: 0.7rem; font-weight: 600; color: var(--muted); }
.un-menu-dica { font-size: 0.75rem; color: var(--muted); padding: 6px 8px 2px; border-top: 1px solid var(--border); margin-top: 4px; }
/* Subdivisões (ex.: Série vermelha / Série branca) */
/* Subgrupo: título com marcador colorido, separado do cartão de cima */
.sub-head {
  display: flex; align-items: center; gap: 8px;
  margin: 14px 10px 0; padding: 0 6px;
  font-size: 0.78rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--brand);
}
.sub-head::before { content: ""; width: 10px; height: 10px; border-radius: 3px; background: var(--brand); flex: none; }
.sub-head::after { content: ""; flex: 1; height: 1px; background: color-mix(in srgb, var(--brand) 25%, var(--border)); }
.sub-head + .an-head { padding-top: 4px; }
/* Série branca: linha do % em cima, absoluto embaixo */
.an-row.has-pct { row-gap: 6px; }
.an-row.has-pct .an-name { grid-row: span 2; align-self: center; }
.an-sub { display: block; font-weight: 400; line-height: 1.3; }
.an-etnia { display: block; margin-top: 3px; font-weight: 400; line-height: 1.3; color: var(--focus); }
.an-etnia.warn { color: var(--st-baixo); }
.unit-fixed { color: var(--text-2); font-size: 0.9rem; }
/* Campo calculado automaticamente (ex.: R do TTPA) */
/* Campos calculados sozinhos: azul, tracejado e em itálico, para diferenciar do que é digitado */
.an-row.calc-auto .f-val,
.an-row.calc-auto.filled .f-val {
  background: var(--calc-bg); color: var(--calc-fg); border: 1.5px dashed var(--calc-borda);
  font-style: italic; font-weight: 600; cursor: default;
}
.calc-tag { display: none; margin-left: 6px; padding: 1px 7px; border-radius: 999px; font-size: 0.68rem; font-weight: 600; vertical-align: middle; white-space: nowrap; }
.an-row.is-calc.calc-auto .calc-tag.auto { display: inline-block; background: var(--calc-bg); color: var(--calc-fg); border: 1px dashed var(--calc-borda); }
.an-row.is-calc:not(.calc-auto) .calc-tag.manual { display: inline-block; background: var(--st-baixo-soft, #fff4d6); color: #8a5a00; border: 1px solid #f2dc9c; }
:root { --calc-bg: #eaf2fd; --calc-fg: #1f5590; --calc-borda: #7fa9dc; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) { --calc-bg: #16283d; --calc-fg: #9cc3ef; --calc-borda: #3d6a9e; }
}
:root[data-theme="dark"] { --calc-bg: #16283d; --calc-fg: #9cc3ef; --calc-borda: #3d6a9e; }
.an-row.unlocked input.f-pref { color: var(--text); }
.txt-g { color: #2e9e3a; font-weight: 600; }
.txt-y { color: #b08a00; font-weight: 600; }
.txt-r { color: var(--st-alto); font-weight: 600; }
/* qualitativos (Negativo, Ligeiramente turvo...): a lista ocupa resultado + unidade, para o texto caber inteiro */
.an-row.is-qual select.f-val { grid-column: span 2; width: 100%; min-width: 0; text-overflow: ellipsis; }
.an-qual-hint { grid-column: span 2; font-size: 0.85rem; }

/* Layout do preenchimento: formulário + resumo lateral fixo */
.entry-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 16px; align-items: start; }
.entry-layout > form { margin: 0; }
.entry-side {
  position: sticky; top: 76px; margin: 0; padding: 16px;
  display: flex; flex-direction: column; gap: 10px; max-height: calc(100vh - 96px);
}
.side-head { display: flex; align-items: baseline; gap: 8px; }
.side-head h2 { margin: 0; flex: 1; }
.side-toggle { display: none; }
.side-hint { margin: 0; }
.side-list { list-style: none; margin: 0; padding: 0; overflow-y: auto; flex: 1; min-height: 60px; border-top: 1px solid var(--border); }
.side-list li { border-bottom: 1px solid var(--border); }
.side-list li.muted { padding: 10px 0; border: none; }
.side-item {
  width: 100%; display: grid; grid-template-columns: 1fr auto; gap: 2px 8px; align-items: center;
  background: none; border: none; font: inherit; color: var(--text); text-align: left;
  padding: 8px 6px; cursor: pointer; border-radius: 8px;
}
.side-item:hover { background: var(--surface-2); }
.side-name { font-size: 0.88rem; font-weight: 600; }
.side-val { grid-column: 1; font-size: 0.85rem; color: var(--text-2); font-variant-numeric: tabular-nums; }
.side-item .badge { grid-column: 2; grid-row: 1 / span 2; }
.side-actions { display: flex; flex-direction: column; gap: 8px; }
.notice { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; padding: 12px 16px; border-color: var(--focus); }
kbd { font: 600 0.8em/1 inherit; border: 1px solid var(--border); border-bottom-width: 2px; border-radius: 5px; padding: 2px 6px; background: var(--surface-2); }
.an-row.flash { animation: flash 1.6s ease-out; }
@keyframes flash { 0%, 30% { background: color-mix(in srgb, var(--focus) 18%, transparent); } 100% { background: transparent; } }

/* ---------- Dashboard ---------- */
.kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 16px; }
.kpi { display: flex; flex-direction: column; gap: 2px; margin: 0; padding: 16px 18px; }
.kpi-label { font-size: 0.8rem; color: var(--muted); font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
.kpi-value { font-size: 1.9rem; font-weight: 700; line-height: 1.15; font-variant-numeric: tabular-nums; }
.kpi-value.ok { color: var(--st-normal); }
.kpi-value.warn { color: var(--st-alto); }
/* Quadros clicáveis */
.kpi-btn { font: inherit; color: var(--text); text-align: left; cursor: pointer; transition: border-color .15s, transform .15s, box-shadow .15s; }
.kpi-btn:hover { border-color: var(--brand); transform: translateY(-1px); box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08); }
.kpi-more { margin-top: 4px; font-size: 0.78rem; font-weight: 600; color: var(--brand); }

/* ---------- Home ---------- */
body[data-page="home"] .page-head { margin-bottom: 12px; }
.kpis-compact { gap: 12px; margin-bottom: 12px; }
.kpis-compact .kpi { padding: 10px 14px; gap: 0; }
.kpis-compact .kpi-value { font-size: 1.55rem; }
.kpis-compact .kpi-more { margin-top: 2px; }
.home-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-bottom: 16px; }
.home-card { margin: 0; display: flex; flex-direction: column; }
.home-card.span-wide { grid-column: 1 / -1; }
.hc-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; }
.hc-head h2 { margin: 0; }
.hc-chart { position: relative; height: 260px; }
.hc-donut { position: relative; height: 220px; }
.donut-center {
  position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; pointer-events: none;
}
.donut-center strong { font-size: 2rem; color: var(--ch-txt-verde); line-height: 1; }
.donut-center span { font-size: 0.78rem; color: var(--muted); }
/* Legenda da rosca: mini-quadros com número, %, nome e barra */
.donut-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 14px; }
.ds {
  --c: var(--st-none);
  display: flex; flex-direction: column; gap: 4px; padding: 10px 12px; text-align: left;
  background: color-mix(in srgb, var(--c) 8%, var(--surface)); border: 1px solid color-mix(in srgb, var(--c) 30%, var(--border));
  border-left: 4px solid var(--c); border-radius: 10px; font: inherit; color: var(--text);
}
button.ds { cursor: pointer; transition: transform .15s, box-shadow .15s; }
button.ds:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08); }
/* --c = cor suave (borda/fundo, igual ao gráfico); --t = cor do número (mais forte, para leitura) */
.ds-g { --c: var(--ch-verde); --t: var(--ch-txt-verde); }
.ds-y { --c: var(--ch-amarelo); --t: var(--ch-txt-amarelo); }
.ds-r { --c: var(--ch-vermelho); --t: var(--ch-txt-vermelho); }
.ds-n { --c: var(--ch-cinza); --t: var(--ch-txt-cinza); }
.ds-top { display: flex; align-items: baseline; justify-content: space-between; }
.ds-num { font-size: 1.6rem; font-weight: 800; line-height: 1; color: var(--t, var(--c)); font-variant-numeric: tabular-nums; }
.ds-pct { font-size: 0.85rem; font-weight: 700; color: var(--text-2); }
.ds-lbl { font-size: 0.85rem; font-weight: 600; color: var(--text-2); }
.ds-go { color: var(--c); font-weight: 700; }
.ds-bar { height: 5px; border-radius: 999px; background: color-mix(in srgb, var(--c) 15%, transparent); overflow: hidden; }
.ds-bar i { display: block; height: 100%; background: var(--c); border-radius: 999px; }
.li-badge { display: flex; align-items: center; gap: 10px; }
.li-badge .gauge { width: 110px; min-width: 110px; }
@media (max-width: 860px) {
  .home-grid { grid-template-columns: 1fr; }
}

/* Janela Imprimir / Enviar */
.share-form { display: flex; flex-direction: column; gap: 8px; margin: 8px 0 12px; }
.share-form .opt {
  display: grid; grid-template-columns: auto minmax(0, 1fr) minmax(170px, 230px); gap: 4px 12px; align-items: center;
  padding: 9px 12px; border: 1px solid var(--border); border-radius: 10px; cursor: pointer;
}
.share-form .opt:has(input:checked) { border-color: var(--brand); background: var(--brand-soft); }
.share-form .opt input[type=radio] { width: auto; margin: 0; accent-color: var(--brand); }
.share-form .opt-txt { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.share-form .opt-txt strong { font-size: 0.95rem; }
.share-form select { padding: 6px 8px; font-size: 0.88rem; }
/* "Um exame": busca digitando, com sugestões */
.sh-busca { position: relative; display: block; min-width: 0; }
.sh-busca input[type=search] { padding: 6px 10px; font-size: 0.9rem; border-color: var(--focus); }
.sh-sug {
  position: absolute; left: 0; right: 0; top: calc(100% + 4px); z-index: 20; list-style: none; margin: 0; padding: 4px;
  background: var(--surface); border: 1px solid var(--input-border); border-radius: 10px; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.16);
  max-height: 260px; overflow-y: auto;
}
.sh-sug li { padding: 7px 9px; border-radius: 7px; cursor: pointer; font-size: 0.9rem; line-height: 1.3; }
.sh-sug li.on, .sh-sug li[data-i]:hover { background: var(--brand-soft); }
.sh-sug li.vazio { cursor: default; }
.sh-varios-cont { justify-self: end; font-weight: 600; }
/* "Exames escolhidos": lista para marcar, com filtro */
.sh-varios { margin: -2px 0 2px; padding: 10px 12px; border: 1px solid var(--brand); border-top: none; border-radius: 0 0 10px 10px; background: var(--surface); display: grid; gap: 8px; }
.sh-varios[hidden] { display: none; }
.share-form .opt:has(+ .sh-varios:not([hidden])) { border-radius: 10px 10px 0 0; }
.sh-varios-lista { max-height: 230px; overflow-y: auto; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 4px 14px; align-content: start; }
.sh-vg { display: contents; }
.sh-vg[hidden] { display: none; }
.sh-vg-tit { grid-column: 1 / -1; font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--brand); margin-top: 6px; }
.sh-vi { display: flex; align-items: center; gap: 8px; padding: 3px 4px; border-radius: 6px; cursor: pointer; font-size: 0.88rem; }
.sh-vi[hidden] { display: none; }
.sh-vi:hover { background: var(--surface-2); }
.sh-vi input { width: auto; margin: 0; accent-color: var(--brand); flex: none; }
.rep-hist-tit { font-size: 1rem; margin: 16px 0 6px; }
/* ---------- Nuvem (Supabase) ---------- */
.nuvem-form { display: grid; gap: 10px; max-width: 460px; margin-top: 8px; }
.nuvem-consent { display: flex; gap: 8px; align-items: flex-start; line-height: 1.45; color: var(--text-2); }
.nuvem-consent input { width: auto; margin-top: 3px; flex: none; accent-color: var(--brand); }
.nuvem-aviso { padding: 10px 12px; border-radius: 10px; background: color-mix(in srgb, var(--st-normal) 10%, var(--surface)); border: 1px solid color-mix(in srgb, var(--st-normal) 35%, var(--border)); }
/* indicador no cabeçalho: nuvem verde = sincronizado, amarela = enviando/sem internet, vermelha = erro */
.nuvem-ind { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; flex: none; }
.nuvem-ind[hidden] { display: none; }
.nuvem-ind svg { width: 22px; height: 22px; fill: var(--st-normal); }
.nuvem-ind.nuvem-sincronizando svg, .nuvem-ind.nuvem-offline svg { fill: var(--st-baixo); }
.nuvem-ind.nuvem-erro svg { fill: var(--st-alto); }
.nuvem-ind:hover { background: var(--surface-2); }
/* ---------- Sobre o Sinalvita ---------- */
.sb-hero { display: flex; align-items: center; gap: 22px; padding: 26px 26px 24px; overflow: hidden;
  background: linear-gradient(90deg, #ff4d6d, #ffc21a, #19d48a) top / 100% 5px no-repeat, var(--surface); }
.sb-hero img { border-radius: 20px; flex: none; box-shadow: 0 4px 14px rgba(15, 47, 61, 0.25); }
.sb-nome { font-weight: 800; font-size: 2rem; letter-spacing: -0.03em; line-height: 1.1; color: var(--logo-escuro); }
.sb-nome span { color: var(--logo-verde); }
:root[data-theme="dark"] .sb-nome { color: var(--text); }
:root[data-theme="dark"] .sb-nome span { color: #19d48a; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .sb-nome { color: var(--text); } :root:not([data-theme="light"]) .sb-nome span { color: #19d48a; } }
.sb-slogan { color: var(--muted); font-size: 0.95rem; margin-top: 2px; }
.sb-frase { margin: 10px 0 0; font-size: 1.05rem; }
.sb-problema { border-left: 4px solid var(--st-baixo); }
.sb-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; margin-top: 6px; }
.sb-item { display: flex; gap: 12px; padding: 14px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface); }
.sb-item h3 { font-size: 1rem; margin: 0 0 4px; }
.sb-item p { margin: 0; color: var(--text-2); line-height: 1.5; }
.sb-ico { width: 42px; height: 42px; flex: none; display: grid; place-items: center; font-size: 1.35rem; border-radius: 12px; background: var(--brand-soft); }
.sb-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; vertical-align: middle; }
.sb-g { background: var(--ch-verde); } .sb-y { background: var(--ch-amarelo); } .sb-r { background: var(--ch-vermelho); }
.sb-acoes { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; background: var(--brand-soft); }
.sb-aviso { text-align: center; margin: 4px 0 20px; }
@media (max-width: 560px) { .sb-hero { flex-direction: column; text-align: center; } }
/* Exames escolhidos / para o médico: um bloco por exame */
.rep-exame { margin: 18px 0 8px; padding-top: 12px; border-top: 2px solid var(--border); break-inside: auto; }
.rep-exame:first-of-type { border-top: none; padding-top: 0; }
.rep-ex-tit { display: flex; align-items: center; gap: 10px; font-size: 1.05rem; margin: 0 0 4px; }
.rep-ex-resumo { margin: 0 0 8px; }
.rep-ex-graf { height: 170px; margin: 4px 0 8px; break-inside: avoid; }
.sh-graf { display: flex; align-items: center; gap: 10px; padding: 6px 12px; cursor: pointer; font-size: 0.92rem; }
.sh-graf input { width: 18px; height: 18px; margin: 0; accent-color: var(--brand); flex: none; }
.share-actions { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0 6px; }
.share-actions .btn { flex: 1; padding: 9px 10px; }
.share-nota { margin: 0; }
/* Área fora da tela onde o PDF é desenhado antes de virar arquivo */
.pdf-palco { position: fixed; left: -12000px; top: 0; width: 794px; background: #fff; color: #000; z-index: -1; }
.pdf-palco .page-head { display: none; }
.pdf-palco .report { border: none; box-shadow: none; padding: 16px 20px; margin: 0; }
.pdf-logo { display: inline-flex; align-items: center; gap: 8px; font-weight: 800; font-size: 1.5rem; color: #0f2f3d; letter-spacing: -0.02em; }
.pdf-logo-txt b { color: #12a364; font-weight: 800; }
.pdf-logo-ico { width: 34px; height: 34px; flex: none; }
/* Passo a passo depois de gerar o PDF */
.pdf-ok { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 10px; background: color-mix(in srgb, var(--st-normal) 10%, var(--surface)); border: 1px solid color-mix(in srgb, var(--st-normal) 35%, var(--border)); }
.pdf-ok-ico { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: var(--st-normal); color: #fff; font-weight: 800; flex: none; }
.passos { margin: 12px 0 8px; padding-left: 22px; display: grid; gap: 6px; }
/* Janela de Imprimir / Enviar: mais larga e mais alta (sem rolagem) */
.dialog-lista.is-share { width: min(820px, calc(100vw - 32px)); max-height: calc(100vh - 32px); }
.dialog-lista.is-share .dlg-head { padding: 12px 20px; }
.dialog-lista.is-share .dlg-body { padding: 8px 20px 14px; }
.dialog-lista.is-share .share-form { margin: 4px 0 8px; gap: 6px; }
@media (max-width: 560px) {
  .share-form .opt { grid-template-columns: auto minmax(0, 1fr); }
  .share-form .opt select, .share-form .opt .sh-busca, .share-form .opt .sh-varios-cont { grid-column: 2; justify-self: stretch; }
}
#sh-texto { font-size: 0.82rem; font-family: ui-monospace, Consolas, monospace; background: var(--surface-2); }
.print-chart { position: relative; height: 260px; margin: 8px 0; }
.print-gauges .gauge + .gauge { margin-top: 4px; }

/* ---------- Consultar: busca ---------- */
/* Busca do Consultar em destaque (mesmo visual da busca da digitação) */
.busca-card {
  padding: 18px 20px;
  background: color-mix(in srgb, var(--focus) 7%, var(--surface));
  border: 1px solid color-mix(in srgb, var(--focus) 30%, var(--border));
}
.busca-label { display: block; font-weight: 800; font-size: 1.05rem; margin-bottom: 10px; color: var(--text); }
.busca-wrap { position: relative; }
.busca-wrap > svg { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); width: 22px; height: 22px; fill: var(--focus); pointer-events: none; }
#busca-exame {
  padding: 13px 14px 13px 46px; font-size: 1.05rem; border-radius: 12px;
  border: 2px solid color-mix(in srgb, var(--focus) 55%, var(--border)); background: var(--surface);
}
#busca-exame:focus { border-color: var(--focus); outline: none; box-shadow: 0 0 0 4px color-mix(in srgb, var(--focus) 18%, transparent); }
.busca-sug {
  position: absolute; left: 0; right: 0; top: calc(100% + 6px); z-index: 30; list-style: none; margin: 0; padding: 6px;
  max-height: 360px; overflow-y: auto; background: var(--surface); border: 1px solid var(--border); border-radius: 12px;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.14);
}
.busca-sug li[data-id] {
  display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 12px; align-items: center;
  padding: 9px 10px; border-radius: 8px; cursor: pointer;
}
.busca-sug li.on, .busca-sug li[data-id]:hover { background: var(--surface-2); }
.bs-main { display: flex; flex-direction: column; min-width: 0; }
.bs-main .small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bs-val { font-weight: 700; white-space: nowrap; }
.bs-vazio { padding: 12px; color: var(--muted); }
.busca-chips { margin-top: 12px; align-items: center; }
.chips-label { font-size: 0.85rem; font-weight: 600; color: var(--text-2); margin-right: 2px; }
.chip.chip-on { border-color: var(--brand); background: var(--brand-soft); }

/* ---------- Consultar: ficha do exame ---------- */
.ficha { border-top: 4px solid var(--brand); }
.ficha { padding: 16px 20px; }
.ficha-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 10px; }
.ficha-head h2 { font-size: 1.35rem; margin: 1px 0 1px; }
.ficha-head p { margin: 1px 0 0; }
.ficha-cat { font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--brand); }
.ficha-acoes { display: flex; gap: 6px; flex: none; }
.ficha-tiles { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; margin-bottom: 10px; }
.ft { display: flex; flex-direction: column; gap: 2px; padding: 7px 11px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface-2); min-width: 0; }
.ft-main { background: var(--brand-soft); border-color: color-mix(in srgb, var(--brand) 25%, var(--border)); }
.ft-lbl { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }
.ficha .legend { margin-top: 6px; }
.ft-val { font-size: 1.15rem; font-weight: 800; line-height: 1.15; white-space: nowrap; }
.ft-val .trend { font-size: 0.9rem; }
/* resultados em texto (Ligeiramente turvo, Não reagente...): quebram a linha e cabem no cartão */
.ft-texto .ft-val { white-space: normal; overflow-wrap: anywhere; font-size: 1.02rem; line-height: 1.25; }
/* exames qualitativos: 4 cartões mais largos (último, anterior, esperado, fora da faixa) */
.ficha-tiles.ficha-tiles-qual { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 700px) { .ficha-tiles.ficha-tiles-qual { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ft-extra { font-size: 0.78rem; color: var(--text-2); display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
@media (max-width: 1000px) { .ficha-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 560px) {
  .ficha-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ficha-head { flex-direction: column; }
  .busca-sug li[data-id] { grid-template-columns: minmax(0, 1fr) auto; }
  .busca-sug li[data-id] .badge { display: none; }
}

/* ---------- Impacto na saúde ---------- */
.impacto-card h2 { margin-bottom: 10px; }
.imp-estados { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px; }
.imp-estados.imp-estados-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.imp-estado { padding: 10px 12px; border-radius: 10px; border: 1px solid var(--border); background: var(--surface-2); opacity: .75; }
.imp-estado.on { opacity: 1; border-width: 2px; box-shadow: 0 2px 10px rgba(0, 0, 0, .06); }
.imp-estado-tit { font-weight: 700; font-size: .88rem; margin-bottom: 4px; }
.est-dentro { border-left: 4px solid var(--st-normal); }
.est-alto { border-left: 4px solid var(--st-alto); }
.est-baixo { border-left: 4px solid var(--st-baixo); }
.est-dentro.on { border-color: var(--st-normal); background: color-mix(in srgb, var(--st-normal) 8%, var(--surface)); }
.est-alto.on { border-color: var(--st-alto); background: color-mix(in srgb, var(--st-alto) 7%, var(--surface)); }
.est-baixo.on { border-color: var(--st-baixo); background: color-mix(in srgb, var(--st-baixo) 8%, var(--surface)); }
.imp-voce { font-size: .72rem; font-weight: 700; color: var(--brand); white-space: nowrap; }
.imp-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 10px; }
.imp-col { padding: 10px 14px; border-radius: 10px; }
.imp-col h3 { margin: 0 0 6px; font-size: .95rem; }
.imp-sub { display: block; font-size: .78rem; font-weight: 500; color: var(--text-2); margin-top: 1px; }
.imp-sub .unit { font-size: 1em; }
.imp-col .dicas-medico { margin: 4px 0 8px; }
.imp-cols.imp-cols-1 { grid-template-columns: 1fr; }
.imp-col ul { margin: 0; padding-left: 20px; display: grid; gap: 4px; font-size: .9rem; }
.imp-pos { background: color-mix(in srgb, var(--st-normal) 8%, var(--surface)); border: 1px solid color-mix(in srgb, var(--st-normal) 30%, var(--border)); }
.imp-neg { background: color-mix(in srgb, var(--st-alto) 6%, var(--surface)); border: 1px solid color-mix(in srgb, var(--st-alto) 28%, var(--border)); }
/* Etiqueta melhorou / piorou / estável */
.tend { display: inline-block; font-size: .72rem; font-weight: 800; padding: 1px 7px; border-radius: 999px; }
.tend-melhorou { color: var(--st-normal); background: color-mix(in srgb, var(--st-normal) 14%, transparent); }
.tend-piorou { color: var(--st-alto); background: color-mix(in srgb, var(--st-alto) 12%, transparent); }
.tend-estavel { color: var(--text-2); background: var(--surface-2); }
/* Placar da Home */
.placar { display: grid; grid-template-columns: 1fr 1fr 0.7fr; gap: 12px; }
.placar-col { padding: 12px 14px; border-radius: 12px; border: 1px solid var(--border); background: var(--surface-2); }
.placar-num { font-size: 1.8rem; font-weight: 800; line-height: 1; display: flex; align-items: center; gap: 8px; }
.placar-num span { font-size: 1rem; }
.placar-tit { font-weight: 700; font-size: .9rem; margin: 4px 0 8px; }
.placar-melhorou { background: color-mix(in srgb, var(--st-normal) 8%, var(--surface)); border-color: color-mix(in srgb, var(--st-normal) 30%, var(--border)); }
.placar-melhorou .placar-num { color: var(--st-normal); }
.placar-piorou { background: color-mix(in srgb, var(--st-alto) 6%, var(--surface)); border-color: color-mix(in srgb, var(--st-alto) 28%, var(--border)); }
.placar-piorou .placar-num { color: var(--st-alto); }
.placar .chips { gap: 6px; }
.chip.chip-melhorou { border-color: color-mix(in srgb, var(--st-normal) 40%, var(--border)); }
.chip.chip-piorou { border-color: color-mix(in srgb, var(--st-alto) 40%, var(--border)); }
@media (max-width: 860px) {
  .imp-estados, .imp-estados.imp-estados-2, .imp-cols, .placar { grid-template-columns: 1fr; }
}

/* ---------- Sugestões de melhoria ---------- */
.btn-dica { background: #fff6d6; color: #7a5a00; border-color: #f0d58a; }
.btn-dica:hover { background: #ffefb8; }
.dicas-card { border-left: 5px solid #e0b400; background: color-mix(in srgb, #fff6d6 45%, var(--surface)); }
.dicas-head { display: flex; gap: 12px; align-items: flex-start; margin-bottom: 8px; }
.dicas-head h2 { margin: 0 0 2px; }
.dicas-head p { margin: 0; }
.dicas-ico { font-size: 1.8rem; line-height: 1; }
.dicas-medico { margin: 8px 0; padding: 8px 12px; border-radius: 8px; background: var(--brand-soft); font-size: 0.9rem; }
.dicas-lista { margin: 8px 0 10px; padding-left: 22px; display: grid; gap: 6px; }
.dicas-lista li { line-height: 1.45; }
.dicas-lista li::marker { color: #c49a00; }
.dicas-aviso { margin: 0; font-size: 0.78rem; color: var(--muted); border-top: 1px dashed var(--border); padding-top: 8px; }
.li-dica { font-size: 0.8rem; color: #7a5a00; margin-top: 3px; line-height: 1.35; white-space: normal; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .dicas-card { background: color-mix(in srgb, #5c4a1a 30%, var(--surface)); }
  :root:not([data-theme="light"]) .li-dica, :root:not([data-theme="light"]) .btn-dica { color: #f5e2a8; }
  :root:not([data-theme="light"]) .btn-dica { background: #3a3014; border-color: #5c4a1a; }
}

/* Histórico de um exame (abaixo do gráfico) */
.foco-card { border-color: var(--brand); }
.foco-sub { margin: 2px 0 0; }
.c-val .muted { font-weight: 400; }
.c-date-strong { white-space: nowrap; }
table.results tr.foco-ultimo td { background: var(--brand-soft); }

/* Janela com lista (coletas / dentro / fora da faixa) */
.dialog-lista { width: min(680px, calc(100vw - 32px)); max-height: min(80vh, 760px); padding: 0; display: flex; flex-direction: column; }
.dialog-lista:not([open]) { display: none; }
.dlg-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 16px 20px; border-bottom: 1px solid var(--border); }
.dlg-head h2 { margin: 0; }
.dlg-body { overflow-y: auto; padding: 8px 20px 16px; }
.dlg-foot { margin: 12px 0 0; }
.lista-cat { font-size: 0.8rem; text-transform: uppercase; letter-spacing: .04em; color: var(--brand); margin: 14px 0 4px; }
.lista { list-style: none; margin: 0; padding: 0; }
.lista li + li { border-top: 1px solid var(--border); }
.lista-item {
  width: 100%; display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) auto 14px; gap: 12px; align-items: center;
  padding: 10px 8px; background: none; border: none; border-radius: 8px; font: inherit; color: var(--text); text-align: left; cursor: pointer;
}
.lista-item:hover:not([disabled]) { background: var(--surface-2); }
.lista-item[disabled] { cursor: default; opacity: 1; }
.li-main, .li-val { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.li-num { font-weight: 700; white-space: nowrap; }
.li-side { text-align: right; grid-column: 2 / 4; }
.li-go { color: var(--muted); font-size: 1.2rem; }
.link-btn.inline { display: inline; margin: 0; padding: 0; }

/* Lista de exames (Dentro / Fora da faixa): larga e compacta, uma linha por exame */
.dialog-lista.is-larga { width: min(900px, calc(100vw - 32px)); max-height: calc(100vh - 48px); }
.lista-resumo { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0 4px; }
.lr-item { font-size: .85rem; font-weight: 700; padding: 4px 10px; border-radius: 999px; background: var(--surface-2); }
.lr-alto { color: var(--st-alto); background: color-mix(in srgb, var(--st-alto) 10%, transparent); }
.lr-baixo { color: var(--st-baixo); background: color-mix(in srgb, var(--st-baixo) 12%, transparent); }
.lr-ok { color: var(--st-normal); background: color-mix(in srgb, var(--st-normal) 10%, transparent); }
.semref-dica { font-size: .88rem; padding: 10px 12px; border-radius: 10px; background: var(--surface-2); border-left: 4px solid var(--st-none); line-height: 1.45; }
.badge.badge-semref { color: var(--muted); border-color: var(--border); }
.perto-dica { border-left-color: #e0b400; background: color-mix(in srgb, #fff6d6 55%, var(--surface)); }
.is-larga .lista-cat { position: sticky; top: -8px; z-index: 2; background: var(--surface); padding: 8px 0 6px; margin: 10px 0 0; border-bottom: 1px solid var(--border); }
/* Listas Fora da faixa / Perto do limite / Dentro: categoria em faixa, exames em cartões, chips que filtram */
.is-larga .lista-cat {
  display: flex; align-items: center; gap: 8px; padding: 9px 14px; margin: 14px 0 6px; border: 0; border-radius: 10px;
  font-size: 0.85rem; font-weight: 800; letter-spacing: .05em; color: var(--text);
  background: linear-gradient(90deg, color-mix(in srgb, var(--brand) 11%, var(--surface)), var(--surface) 80%);
  border-left: 5px solid var(--brand);
}
.lista-cat-n { font-size: 0.75rem; font-weight: 700; color: var(--text-2); background: var(--surface-2); border-radius: 999px; padding: 1px 8px; letter-spacing: 0; }
.lista-compacta li + li { border-top: 0; }
.lista-compacta .lc-item {
  margin: 6px 0; padding: 10px 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface);
  transition: border-color .15s, box-shadow .15s;
}
.lista-compacta .lc-item:hover { background: var(--surface); border-color: color-mix(in srgb, var(--focus) 45%, var(--border)); box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05); }
.lc-tend { display: block; margin-top: 4px; font-size: 0.75rem; }
.lc-quanto { font-size: 0.76rem; font-weight: 700; }
.lc-quanto-alto { color: var(--st-alto); }
.lc-quanto-baixo { color: var(--st-baixo); }
.lr-rot { align-self: center; }
button.lr-item { border: 1.5px solid transparent; font: inherit; font-size: .85rem; font-weight: 700; cursor: pointer; color: var(--text-2); }
button.lr-item.lr-alto { color: var(--st-alto); }
button.lr-item.lr-baixo { color: var(--st-baixo); }
button.lr-item:hover { border-color: var(--border); }
button.lr-item.on { border-color: currentColor; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08); }
.lc-item { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) 120px auto 14px; padding: 8px 8px; gap: 14px; }
.lc-nome { display: flex; flex-direction: column; min-width: 0; }
.lc-desc { font-size: .8rem; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lc-val { display: flex; flex-direction: column; min-width: 0; }
.lc-ref { font-size: .78rem; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lc-gauge .gauge { min-width: 100px; }
.lc-badge { display: flex; flex-direction: column; align-items: center; gap: 2px; }
.lc-data { font-size: .72rem; color: var(--muted); }
@media (max-width: 700px) {
  .lc-item { grid-template-columns: minmax(0, 1fr) auto 14px; }
  .lc-item .lc-val { grid-column: 1; grid-row: 2; }
  .lc-item .lc-gauge { display: none; }
  .lc-item .lc-badge { grid-column: 2; grid-row: 1 / 3; }
  .lc-item .li-go { grid-column: 3; grid-row: 1 / 3; }
}

.alerts h2 { margin-bottom: 10px; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip {
  font: inherit; font-size: 0.88rem; cursor: pointer;
  border: 1px solid var(--border); background: var(--surface-2); color: var(--text);
  padding: 6px 12px; border-radius: 999px;
}
.chip b { margin-left: 4px; }
.chip.st-alto b, .chip.st-alterado b { color: var(--st-alto); }
.chip.st-baixo b { color: var(--st-baixo); }
.chip:hover { border-color: var(--brand); }

.chart-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 8px; }
.chart-head h2 { margin-bottom: 2px; }
.chart-head select { width: auto; max-width: 240px; }
.chart-box { position: relative; height: 300px; }
.legend { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 10px; color: var(--text-2); }
.legend span { display: inline-flex; align-items: center; gap: 6px; }
.lg-zona { width: 18px; height: 11px; display: inline-block; border-radius: 2px; border: 1px solid var(--border); }
.lg-zona.z-g { background: var(--zona-g); }
.lg-zona.z-y { background: var(--zona-y); }
.lg-zona.z-r { background: var(--zona-r); }
.lg-group { font-weight: 600; color: var(--text); }
.lg-group:not(:first-child) { margin-left: 8px; }
.lg-dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }
.lg-dot.st-normal { background: var(--ch-ponto-normal); }
.lg-dot.st-baixo { background: var(--ch-ponto-baixo); }
.lg-dot.st-alto { background: var(--ch-ponto-alto); }

.table-tools { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 8px; }
.table-tools h2 { margin: 0; }
.filters { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.filters select { width: auto; }
.table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
table.results { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
table.results th, table.results td { text-align: left; padding: 9px 10px; border-bottom: 1px solid var(--border); vertical-align: middle; }
table.results thead th { font-size: 0.75rem; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); font-weight: 600; }
table.results tr.grp th { background: var(--surface-2); font-size: 0.85rem; color: var(--text-2); padding: 6px 10px; }
table.results tr.subgrp th { font-size: 0.72rem; text-transform: uppercase; letter-spacing: .04em; color: var(--brand); padding: 8px 10px 4px 18px; }
.pct-line { font-weight: 400; margin-top: 2px; white-space: nowrap; }
.c-desc { color: var(--text-2); font-style: italic; line-height: 1.3; }
.txt-st-alto, .txt-st-alterado { color: var(--st-alto); }
.txt-st-baixo { color: var(--st-baixo); }
/* Linhas alinhadas entre as colunas Posição / Data / Anterior (valor principal e %) */
.cell-line { height: 26px; display: flex; align-items: center; gap: 8px; white-space: nowrap; }
.cell-line + .cell-line { margin-top: 2px; }
.c-bar .cell-line .gauge { flex: 1; padding-top: 9px; margin-top: -4px; }
/* Comparação com o resultado anterior */
.trend-wrap { display: flex; flex-direction: column; justify-content: center; }
.trend { display: inline-flex; align-items: center; gap: 8px; font-weight: 400; }
.delta {
  display: inline-block; min-width: 52px; text-align: center; padding: 2px 7px; border-radius: 6px;
  font-weight: 700; font-size: 0.82rem; font-variant-numeric: tabular-nums;
}
.d-melhor { background: color-mix(in srgb, var(--st-normal) 15%, transparent); color: var(--st-normal); }
.d-pior { background: color-mix(in srgb, var(--st-alto) 13%, transparent); color: var(--st-alto); }
.d-igual { background: var(--surface-2); color: var(--text-2); }
.prev-val { font-size: 0.85rem; color: var(--text-2); }
.prev-val strong { color: var(--text); font-weight: 600; }
.prev-date { font-size: 0.75rem; color: var(--muted); white-space: nowrap; padding-left: 60px; line-height: 1.2; }
/* Tabelas em "cartões" (Consultar, histórico do exame e relatórios): mesmo visual da digitação */
table.results.cartoes { border-collapse: separate; border-spacing: 0 6px; margin-top: -6px; }
table.results.cartoes thead th { border-bottom: 0; padding-bottom: 2px; }
table.results.cartoes tbody tr:not(.grp):not(.subgrp) td {
  background: var(--surface); border-bottom: 1px solid var(--border); border-top: 1px solid var(--border);
  transition: border-color .15s, background .15s;
}
table.results.cartoes tbody tr:not(.grp):not(.subgrp) td:first-child { border-left: 1px solid var(--border); border-radius: 12px 0 0 12px; padding-left: 14px; }
table.results.cartoes tbody tr:not(.grp):not(.subgrp) td:last-child { border-right: 1px solid var(--border); border-radius: 0 12px 12px 0; }
table.results.cartoes tbody tr.clickable:hover td { background: var(--surface); border-color: color-mix(in srgb, var(--focus) 45%, var(--border)); }
table.results.cartoes tr.selected td, table.results.cartoes tr.foco-ultimo td { background: var(--brand-soft); border-color: color-mix(in srgb, var(--brand) 40%, var(--border)); }
table.results.cartoes tr.selected td:first-child { box-shadow: none; border-left: 4px solid var(--brand); }
/* categoria: faixa destacada (igual à da digitação) */
table.results.cartoes tr.grp th {
  padding: 11px 16px; font-size: 0.98rem; font-weight: 800; color: var(--text); border-bottom: 0;
  background: linear-gradient(90deg, color-mix(in srgb, var(--brand) 11%, var(--surface)), var(--surface) 75%);
  border-left: 5px solid var(--brand); border-radius: 10px;
}
table.results.cartoes tr.grp:not(:first-child) th { box-shadow: 0 -8px 0 var(--surface); }
/* subgrupo: título com marcador colorido */
table.results.cartoes tr.subgrp th { padding: 10px 6px 0; border-bottom: 0; font-size: 0.74rem; font-weight: 800; letter-spacing: .06em; color: var(--brand); }
table.results.cartoes tr.subgrp th::before { content: ""; display: inline-block; width: 9px; height: 9px; border-radius: 3px; background: var(--brand); margin-right: 8px; vertical-align: 0; }
table.results tr.clickable { cursor: pointer; }
table.results tr.clickable:hover td { background: var(--surface-2); }
table.results tr.selected td { background: var(--brand-soft); }
table.results tr.selected td:first-child { box-shadow: inset 3px 0 0 var(--brand); }
table.results td.actions { text-align: right; white-space: nowrap; }
table.results td.actions .btn + .btn { margin-left: 6px; }
table.refs input { max-width: 130px; padding: 5px 8px; }
table.refs tr.invalid input { border-color: var(--st-alto); }
.c-val { font-weight: 700; white-space: nowrap; }
.unit { font-weight: 400; color: var(--muted); font-size: 0.85em; }
.c-date { white-space: nowrap; color: var(--text-2); font-size: 0.9rem; }
.c-bar { min-width: 140px; }
.c-trend { white-space: nowrap; }
.trend { font-weight: 600; }

.badge {
  display: inline-block; font-size: 0.78rem; font-weight: 700; padding: 2px 9px; border-radius: 999px;
  border: 1px solid currentColor; white-space: nowrap;
}
.badge.st-normal { color: var(--st-normal); }
.badge.st-baixo { color: var(--st-baixo); }
.badge.st-alto, .badge.st-alterado { color: var(--st-alto); }
.badge.st-perto { color: #b7791f; }
/* Relatório "Para levar ao médico": faixas que separam "fora da faixa" de "perto do limite" */
table.results tr.bloco th { text-align: left; font-size: 0.95rem; font-weight: 800; padding: 10px 12px; border-radius: 8px; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
table.results tr.bloco-fora th { background: color-mix(in srgb, var(--st-alto) 12%, var(--surface)); color: var(--st-alto); }
table.results tr.bloco-perto th { background: color-mix(in srgb, #f0b429 18%, var(--surface)); color: #8a5a00; }
.tag { font-size: 0.7rem; background: var(--surface-2); color: var(--text-2); padding: 1px 6px; border-radius: 6px; }

/* Medidor "de ruim a bom": vermelho | amarelo | verde | amarelo | vermelho + seta */
.gauge { position: relative; padding-top: 9px; min-width: 90px; }
.g-track { position: relative; height: 10px; border-radius: 2px; overflow: hidden; background: var(--surface-2); }
.g-seg { position: absolute; top: 0; bottom: 0; }
.g-r { background: var(--ch-vermelho); }
.g-y { background: var(--ch-amarelo); }
.g-g { background: var(--ch-verde); }
.gauge.empty .g-track { opacity: 0.35; }
.g-arrow {
  position: absolute; top: 0; width: 0; height: 0; transform: translateX(-50%);
  border-left: 6px solid transparent; border-right: 6px solid transparent; border-top: 10px solid var(--text);
  transition: left 0.25s ease;
}

/* ---------- Boas-vindas ---------- */
.welcome { max-width: 640px; margin: 24px auto; text-align: center; padding: 32px 24px; }
.welcome img { border-radius: 18px; margin-bottom: 12px; }
.welcome form { text-align: left; margin-top: 20px; }
.welcome-btns { justify-content: center; flex-wrap: wrap; margin-top: 6px; }

/* ---------- Histórico ---------- */
.history { display: grid; gap: 12px; }
.hist { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin: 0; }
.hist-date { font-size: 1.2rem; font-weight: 700; }
.hist-actions { display: flex; gap: 8px; }

/* ---------- Configurações ---------- */
.custom-list { padding-left: 18px; }
.custom-list li { margin-bottom: 6px; }

/* ---------- Relatório ---------- */
.report-head { display: flex; justify-content: space-between; align-items: center; gap: 16px; border-bottom: 2px solid var(--brand); padding-bottom: 12px; margin-bottom: 16px; flex-wrap: wrap; }
.report-meta { text-align: right; }
.report h2 { margin-top: 20px; }
.report-charts { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.mini-chart { margin: 0; border: 1px solid var(--border); border-radius: 10px; padding: 10px; break-inside: avoid; }
.mini-chart figcaption { font-weight: 600; font-size: 0.9rem; margin-bottom: 4px; }
.mini-box { position: relative; height: 170px; }
.disclaimer { margin-top: 20px; font-size: 0.8rem; color: var(--muted); }

/* ---------- Diálogo e aviso ---------- */
.dialog {
  border: 1px solid var(--border); border-radius: var(--radius); padding: 22px;
  background: var(--surface); color: var(--text); width: min(560px, calc(100vw - 32px));
}
.dialog::backdrop { background: rgba(0, 0, 0, 0.45); }

/* ---------- Importar PDF do laboratório ---------- */
.dialog-importar { width: min(860px, calc(100vw - 32px)); max-height: min(90vh, 900px); overflow-y: auto; padding: 0 22px; }
/* botões sempre visíveis no rodapé da janela (a lista rola por cima) */
.dialog-importar > .btn-row {
  position: sticky; bottom: 0; z-index: 2; margin: 0 -22px; padding: 12px 22px 16px;
  background: var(--surface); border-top: 1px solid var(--border); box-shadow: 0 -6px 14px rgba(0, 0, 0, 0.06);
}
.dialog-importar .dlg-head { margin: 0 -22px 12px; position: sticky; top: 0; background: var(--surface); z-index: 1; }
.imp-carregando { display: flex; align-items: center; gap: 10px; padding: 18px 0; }
.spinner { width: 18px; height: 18px; border-radius: 50%; border: 3px solid var(--border); border-top-color: var(--brand); animation: hl-gira 0.8s linear infinite; flex: none; }
@keyframes hl-gira { to { transform: rotate(360deg); } }
.imp-erro { margin: 14px 0; line-height: 1.5; }
.imp-campos { margin: 6px 0 8px; }
.imp-lista-wrap { border: 1px solid var(--border); border-radius: 10px; overflow: auto; max-height: 46vh; margin: 8px 0 10px; }
.imp-lista { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
.imp-lista th { position: sticky; top: 0; background: var(--surface-2); text-align: left; font-size: 0.75rem; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); padding: 8px 10px; z-index: 1; }
.imp-lista td { padding: 8px 10px; border-top: 1px solid var(--border); vertical-align: top; }
.imp-lista td:first-child, .imp-lista th:first-child { width: 34px; text-align: center; }
.imp-val { font-weight: 700; white-space: nowrap; }
.imp-orig { margin-top: 3px; font-size: 0.75rem; color: var(--muted); font-family: Consolas, "Courier New", monospace; overflow-wrap: anywhere; }
.imp-texto { margin: 6px 0 12px; }
.imp-texto summary { cursor: pointer; color: var(--text-2); font-size: 0.85rem; }
.imp-texto pre { max-height: 220px; overflow: auto; background: var(--surface-2); border-radius: 8px; padding: 10px; font-size: 0.75rem; white-space: pre-wrap; }
/* Aviso de preenchimento salvo: fundo âmbar de atenção */
.notice-rascunho {
  background: color-mix(in srgb, var(--ch-amarelo) 22%, var(--surface));
  border: 1px solid color-mix(in srgb, #d99a00 70%, var(--border)); border-left-width: 5px; font-weight: 600;
}
.notice-rascunho > span::before { content: "⚠"; color: #c98a00; margin-right: 8px; font-size: 1.1em; }
.notice-pdf { border-color: var(--ch-linha); background: color-mix(in srgb, var(--ch-linha) 8%, var(--surface)); }
/* linhas que vieram do PDF: contorno azul arredondado em volta de toda a linha, com fundo bem leve, para conferir */
.an-row.from-pdf {
  border-color: color-mix(in srgb, var(--ch-linha) 60%, var(--border));
  background: color-mix(in srgb, var(--ch-linha) 5%, var(--surface));
  box-shadow: inset 0 0 0 0.5px color-mix(in srgb, var(--ch-linha) 40%, transparent);
}
/* Coleta vinda de PDF: no modo "só os importados" não há azul (todos são importados); no modo "todos", o azul diferencia */
.pdf-so .an-row.from-pdf { border-color: var(--border); background: var(--surface); box-shadow: none; }
.pdf-so .an-row.from-pdf .an-name::after { display: none; }
.pdf-so .pdf-legenda, .pdf-so .side-pdf { display: none; }
.pdf-so-txt { display: none; margin-top: 6px; }
.notice-pdf.pdf-so .pdf-so-txt { display: block; }
.notice-pdf .btn-row { display: flex; gap: 8px; flex-wrap: wrap; }
/* lembrete do que significa o azul (aviso do topo e painel Resumo) */
.pdf-legenda { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
.pdf-amostra {
  display: inline-block; padding: 2px 10px; border-radius: 8px; font-size: 0.7rem; font-weight: 700; white-space: nowrap;
  color: var(--ch-linha); background: color-mix(in srgb, var(--ch-linha) 8%, var(--surface));
  border: 1.5px solid color-mix(in srgb, var(--ch-linha) 60%, var(--border));
}
.side-pdf { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; color: var(--text-2); }
/* etiqueta "do PDF" abaixo do nome */
.an-row.from-pdf .an-name::after {
  content: "do PDF"; display: inline-block; margin-top: 4px; padding: 1px 8px; border-radius: 999px;
  font-size: 0.66rem; font-weight: 700; letter-spacing: .03em; font-style: normal;
  color: var(--ch-linha); background: color-mix(in srgb, var(--ch-linha) 12%, var(--surface)); border: 1px solid color-mix(in srgb, var(--ch-linha) 35%, var(--border));
}
#btn-import:hover svg, #btn-import:focus-visible svg { animation: hl-pulo .6s ease; }
.toast {
  position: fixed; left: 50%; bottom: 24px; transform: translate(-50%, 20px);
  background: var(--text); color: var(--bg); padding: 10px 18px; border-radius: 10px;
  opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s; z-index: 50; font-weight: 600;
  max-width: calc(100vw - 32px);
}
.toast.show { opacity: 1; transform: translate(-50%, 0); }

/* ---------- Celular ---------- */
@media (max-width: 860px) {
  .kpis { grid-template-columns: repeat(2, 1fr); }
  .an-head { display: none; }
  .an-row { grid-template-columns: 1fr 1fr; gap: 6px 10px; padding: 10px 12px; margin: 6px 6px; }
  .an-name { grid-column: 1 / -1; }
  .an-row.has-pct .an-name { grid-row: auto; }
  .ref-cell { grid-column: 1; }
  .g-wrap { grid-column: 2; }
  /* Resumo vira uma barra fixa no rodapé; a lista abre com "Revisar" */
  .entry-layout { grid-template-columns: 1fr; }
  body[data-page="novo"] .footer, body[data-page="editar"] .footer { padding-bottom: 170px; }
  .entry-side {
    position: fixed; left: 0; right: 0; bottom: 0; top: auto; z-index: 25;
    border-radius: 14px 14px 0 0; max-height: 70vh; box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.12);
  }
  .side-toggle { display: inline-flex; }
  .entry-side:not(.open) .side-list, .entry-side:not(.open) .side-hint { display: none; }
  .side-actions { flex-direction: row; flex-wrap: wrap; }
  .side-actions .btn { flex: 1; }
  .side-actions #btn-cancel { flex-basis: 100%; }
  .entry-side:not(.open) #btn-cancel { display: none; }
  .an-qual-hint { grid-column: 1 / -1; }
}
@media (max-width: 700px) {
  body { padding-bottom: 64px; }
  .topbar { gap: 10px; justify-content: space-between; }
  .nav {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 30;
    background: var(--surface); border: none; border-top: 1px solid var(--border); border-radius: 0;
    justify-content: space-around; gap: 0; padding: 4px 4px calc(4px + env(safe-area-inset-bottom));
  }
  .nav a, .nav button { flex-direction: column; gap: 2px; font-size: 0.66rem; padding: 6px 2px; flex: 1; min-width: 0; }
  .nav a.active { background: var(--brand-soft); box-shadow: none; }
  .nav .nav-cta { background: none; color: var(--brand); box-shadow: none; position: relative; }
  .nav .nav-cta svg:first-child { background: var(--brand); fill: #fff; border-radius: 50%; padding: 2px; }
  .nav .nav-cta.active { background: var(--brand-soft); color: var(--brand); }
  /* no celular, a setinha fica pequena no canto do ícone */
  .nav .nav-cta .nav-chev { position: absolute; top: 4px; right: calc(50% - 22px); width: 13px; height: 13px; margin: 0; }
  /* o efeito de vidro (backdrop-filter) prenderia o menu inferior fixo dentro do cabeçalho */
  .topbar { backdrop-filter: none; background: var(--surface); }
  .nav a svg, .nav button svg { width: 21px; height: 21px; }
  .profile-select { max-width: 150px; }
  .hdr-btn span { display: none; } /* no celular, só os ícones */
  .hdr-btn { padding: 8px; }
  .span-2 { grid-column: auto; }
  .view { padding: 16px 16px 24px; }
  h1 { font-size: 1.35rem; }
  .card { padding: 16px; }
  .page-head { flex-direction: column; }
  .grid-2, .grid-3, .grid-4, .grid-5 { grid-template-columns: 1fr; }
  .kpi-value { font-size: 1.5rem; }
  .chart-head { flex-direction: column; }
  .chart-head select { max-width: 100%; width: 100%; }
  .chart-box { height: 240px; }
  .results td.c-date { font-size: 0.8rem; }
  .lista-item { grid-template-columns: minmax(0, 1fr) auto 14px; }
  .lista-item .li-val { grid-column: 1 / 2; grid-row: 2; }
  .lista-item .li-badge { grid-row: 1; grid-column: 2; }
  .lista-item .li-go { grid-row: 1 / 3; grid-column: 3; }
  .li-side { grid-column: 2 / 3; }
  .c-bar { min-width: 90px; }
  .results .gauge { min-width: 80px; }
  .hist { flex-direction: column; align-items: stretch; }
  .report-charts { grid-template-columns: 1fr; }
  .report-meta { text-align: left; }
  .toast { bottom: 80px; }
  body[data-page="novo"] .toast, body[data-page="editar"] .toast { bottom: 190px; }
  .entry-side { bottom: calc(58px + env(safe-area-inset-bottom)); }
}

/* ---------- Impressão ---------- */
/* ---------- Página Resumo ---------- */
.print-only { display: none; }
.rs-topo { display: flex; flex-direction: column; gap: 14px; }
.rs-escolha { display: flex; align-items: flex-end; gap: 12px; flex-wrap: wrap; }
.rs-escolha .fld { flex: 1; min-width: 240px; margin: 0; }
.rs-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px; }
.rs-kpi { /* as cores vêm das classes ds-g / ds-y / ds-r / ds-n (iguais aos cartões da Home) */
  display: flex; flex-direction: column; gap: 2px; padding: 12px 14px; border-radius: 12px;
  background: color-mix(in srgb, var(--c) 10%, var(--surface)); border: 1px solid color-mix(in srgb, var(--c) 35%, var(--border)); border-left: 4px solid var(--c);
}
.rs-kpi-num { font-size: 1.7rem; font-weight: 800; line-height: 1.1; color: var(--t); font-variant-numeric: tabular-nums; }
.rs-kpi-rot { font-weight: 600; color: var(--text-2); font-size: 0.88rem; }
.rs-texto { font-size: 1rem; line-height: 1.6; margin: 0; }
.rs-cont { display: inline-block; min-width: 22px; padding: 0 7px; border-radius: 999px; background: var(--surface-2); color: var(--text-2); font-size: 0.8rem; font-weight: 700; text-align: center; vertical-align: middle; }
.rs-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 10px; }
.rs-col { border-radius: 12px; padding: 12px 14px; border: 1px solid var(--border); }
.rs-col h3 { margin: 0 0 8px; font-size: 0.98rem; }
.rs-mel { background: color-mix(in srgb, var(--ch-verde) 8%, var(--surface)); border-color: color-mix(in srgb, var(--ch-verde) 35%, var(--border)); }
.rs-mel h3 { color: var(--ch-txt-verde); }
.rs-pio { background: color-mix(in srgb, var(--ch-vermelho) 7%, var(--surface)); border-color: color-mix(in srgb, var(--ch-vermelho) 32%, var(--border)); }
.rs-pio h3 { color: var(--ch-txt-vermelho); }
.rs-per { background: color-mix(in srgb, var(--ch-amarelo) 10%, var(--surface)); border-color: color-mix(in srgb, var(--ch-amarelo) 40%, var(--border)); }
.rs-per h3 { color: var(--ch-txt-amarelo); }
.rs-nov { background: color-mix(in srgb, var(--ch-cinza) 10%, var(--surface)); border-color: color-mix(in srgb, var(--ch-cinza) 40%, var(--border)); }
.rs-nov h3 { color: var(--ch-txt-cinza); }
.rs-lista { list-style: none; margin: 0; padding: 0; }
.rs-item {
  width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 10px; text-align: left;
  padding: 7px 4px; border: 0; border-top: 1px dashed var(--border); background: none; color: var(--text); font: inherit; cursor: pointer; border-radius: 6px;
}
.rs-lista li:first-child .rs-item { border-top: 0; }
.rs-item:hover { background: color-mix(in srgb, var(--surface-2) 70%, transparent); }
.rs-nome { display: flex; flex-direction: column; min-width: 0; }
.rs-val { white-space: nowrap; font-weight: 700; margin-left: auto; }
.rs-areas { list-style: none; margin: 0; padding: 0; }
.rs-area { display: grid; grid-template-columns: 14px minmax(160px, 0.8fr) minmax(0, 2fr); gap: 10px; align-items: baseline; padding: 9px 0; border-top: 1px solid var(--border); }
.rs-area:first-child { border-top: 0; }
.rs-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--ch-cinza); display: inline-block; }
.rs-g .rs-dot { background: var(--ch-verde); }
.rs-y .rs-dot { background: var(--ch-amarelo); }
.rs-r .rs-dot { background: var(--ch-vermelho); }
.rs-area-nome { font-weight: 700; }
.rs-area-txt { color: var(--text-2); display: flex; flex-direction: column; gap: 5px; align-items: flex-start; }
/* Por área: cada exame numa etiqueta colorida */
.rs-area-rot { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; }
.rs-rot-fora { color: var(--st-alto); }
.rs-rot-perto { color: #8a7400; }
.rs-pills { display: flex; flex-wrap: wrap; gap: 5px; }
.rs-pill {
  display: inline-flex; align-items: center; gap: 4px; padding: 2px 9px; border-radius: 999px; font-size: 0.86rem; font-weight: 600;
  border: 1px solid currentColor; line-height: 1.5; -webkit-print-color-adjust: exact; print-color-adjust: exact;
}
.rs-pill b { font-weight: 800; font-size: 0.78rem; }
.rs-pill-alto, .rs-pill-alterado { color: var(--st-alto); background: color-mix(in srgb, var(--st-alto) 10%, var(--surface)); }
.rs-pill-baixo { color: var(--st-baixo); background: color-mix(in srgb, var(--st-baixo) 12%, var(--surface)); }
.rs-pill-perto { color: #6b5a00; background: color-mix(in srgb, #ffd60a 28%, var(--surface)); border-color: #d4b106; }
.rs-tudo-ok { color: var(--st-normal); font-weight: 600; }
.rs-area-head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px 16px; margin-bottom: 6px; }
.rs-area-head h2 { margin: 0; }
.rs-legenda { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; }
.rs-legenda .rs-pill { font-size: 0.76rem; padding: 1px 8px; }
.rs-legenda .rs-tudo-ok { font-size: 0.8rem; }
.rs-aten { border-top: 1px solid var(--border); padding: 14px 0; }
.rs-aten:first-of-type { border-top: 0; }
.rs-aten-top { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.rs-link { border: 0; background: none; padding: 0; font: inherit; color: var(--text); cursor: pointer; font-size: 1.02rem; }
.rs-link:hover { color: var(--brand); text-decoration: underline; }
.rs-aten-meta { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 3px; color: var(--text-2); }
.rs-aten-gauge { max-width: 320px; margin-top: 6px; }
.rs-sig { margin: 8px 0 4px; }
.rs-dicas { margin: 4px 0 0; padding-left: 20px; color: var(--text-2); }
.rs-dicas li { margin: 2px 0; }
.rs-med { margin: 6px 0 0; color: var(--st-alto); font-weight: 600; }
.rs-habitos { list-style: none; margin: 0; padding: 0; }
.rs-habitos li { display: flex; flex-direction: column; padding: 6px 0; border-top: 1px dashed var(--border); }
.rs-habitos li:first-child { border-top: 0; }
.rs-medico { margin-top: 14px; padding: 12px 14px; border-radius: 12px; border: 1px solid color-mix(in srgb, var(--st-alto) 30%, var(--border)); background: color-mix(in srgb, var(--st-alto) 5%, var(--surface)); }
.rs-medico h3 { margin: 0 0 6px; font-size: 0.98rem; }
.rs-medico ul { margin: 0; padding-left: 20px; }
.rs-h3 { font-size: 0.98rem; margin: 14px 0 2px; }
.nav a[href="#resumo"]:hover svg, .nav a[href="#resumo"]:focus-visible svg { animation: hl-pulo .6s ease; }
@media (max-width: 700px) {
  .rs-cols { grid-template-columns: 1fr; }
  .rs-area { grid-template-columns: 14px minmax(0, 1fr); }
  .rs-area-txt { grid-column: 2; }
}

@media print {
  .print-only { display: block; }
  .rs-escolha { display: none; }
  .rs-col, .rs-kpi, .rs-dot, .rs-medico { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .rs-aten, .rs-area, .rs-col { break-inside: avoid; }
  .card + .card { margin-top: 18px; }
}
@media print {
  :root { --bg: #fff; --surface: #fff; --surface-2: #f3f3f3; --text: #000; --shadow: none; }
  body { background: #fff; padding: 0; }
  .topbar, .no-print, .toast { display: none !important; }
  .footer { padding: 12px 0 0; }
  .medical-note { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .view { padding: 0; max-width: none; }
  .card { border: none; padding: 0; box-shadow: none; }
  .report-table tr, .mini-chart, figure, .print-chart { break-inside: avoid; }
  .report h2, .report h3, .report-table tr.grp, .report-table tr.subgrp { break-after: avoid; }
  table.results.cartoes td, table.results.cartoes th { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .report-charts { grid-template-columns: repeat(2, 1fr); }
  .badge, .gauge { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}