/* Tokens do mock-up (poc/visualizador/estilo.css), reduzidos ao que o estágio A usa. */
:root{ --fundo:#eaf0f6; --papel:#fff; --tinta:#0b2540; --tinta-2:#29517a; --hair:rgba(11,37,64,.12); --hair-2:rgba(11,37,64,.2); --quente:#a33f28; --quente-fundo:#f8ece6;
  --sans:"Geist",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; --mono:"Geist Mono",ui-monospace,Menlo,monospace; }
*{ box-sizing:border-box; }
body{ margin:0; background:var(--fundo); color:var(--tinta); font:16px/1.5 var(--sans); }
.faixa{ background:var(--papel); border-bottom:1px solid var(--hair-2); padding:8px 16px; font-size:13px; font-weight:600; text-align:center; }
.topo{ display:flex; justify-content:space-between; align-items:center; gap:12px; padding:14px 24px; background:var(--tinta); color:#fff; }
.topo .marca{ font-weight:700; letter-spacing:.18em; font-size:14px; }
.topo form{ margin:0; } .topo button{ font:inherit; font-size:14px; color:#fff; background:none; border:1px solid rgba(255,255,255,.4); border-radius:8px; padding:5px 12px; cursor:pointer; }
.topo .quem{ font-size:13px; opacity:.85; margin-right:10px; }
main{ max-width:880px; margin:28px auto; padding:0 16px; }
.cartao{ background:var(--papel); border:1px solid var(--hair); border-radius:16px; padding:22px 24px; margin-bottom:14px; }
h1{ font-size:28px; letter-spacing:-.02em; margin:0 0 6px; } h2{ font-size:19px; margin:0 0 8px; }
.sub{ color:var(--tinta-2); margin:0 0 18px; }
table{ width:100%; border-collapse:collapse; } th,td{ text-align:left; padding:10px 8px; border-bottom:1px solid var(--hair); font-size:15px; } th{ font-size:13px; color:var(--tinta-2); }
a{ color:var(--tinta-2); }
.etiqueta{ display:inline-block; padding:2px 8px; border-radius:6px; font-size:12px; font-weight:700; background:var(--fundo); }
.etiqueta.sint{ background:var(--quente-fundo); color:var(--quente); }
.mono{ font-family:var(--mono); }
.form p{ margin:0 0 12px; } .form label{ display:block; font-weight:600; font-size:14px; margin-bottom:4px; }
.form input{ width:100%; font:inherit; padding:10px 12px; border:1px solid var(--hair-2); border-radius:10px; }
.btn{ font:inherit; font-weight:650; padding:11px 18px; border-radius:10px; border:0; background:var(--tinta); color:#fff; cursor:pointer; }
.erro{ background:var(--quente-fundo); color:var(--quente); padding:10px 12px; border-radius:10px; font-size:14px; }
.nota{ font-size:13.5px; color:var(--tinta-2); }
/* estágio B: entrada, questionário, consulta, métricas */
.msgs{ list-style:none; padding:0; margin:0 0 14px; } .msgs li{ padding:10px 14px; border-radius:10px; margin-bottom:6px; font-size:14.5px; background:#e6f2ea; color:#1d5c34; }
.msgs li.error{ background:var(--quente-fundo); color:var(--quente); }
.btn-2{ background:var(--papel); color:var(--tinta); border:1px solid var(--hair-2); } .btn-p{ padding:7px 12px; font-size:14px; }
.btn[disabled]{ opacity:.5; cursor:default; }
.linha{ display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.passos{ list-style:none; padding:0; margin:0; counter-reset:p; } .passos>li{ counter-increment:p; display:flex; gap:12px; align-items:flex-start; padding:12px 0; border-bottom:1px solid var(--hair); }
.passos>li::before{ content:counter(p); flex:0 0 28px; height:28px; border-radius:50%; background:var(--fundo); display:grid; place-items:center; font-weight:700; font-size:14px; }
.passos>li.ok::before{ content:"✓"; background:#e6f2ea; color:#1d5c34; } .passos .corpo{ flex:1; } .passos h3{ margin:2px 0 4px; font-size:16px; }
fieldset{ border:1px solid var(--hair); border-radius:14px; padding:16px 18px; margin:0 0 14px; background:var(--papel); }
legend{ font-weight:700; padding:0 6px; }
.campo{ margin:0 0 12px; } .campo>label,.campo>.rot{ display:block; font-weight:600; font-size:14px; margin-bottom:4px; }
.campo input[type=text],.campo input[type=number],.campo input[type=date],.campo select,.campo textarea{ width:100%; font:inherit; padding:9px 11px; border:1px solid var(--hair-2); border-radius:10px; background:#fff; }
.campo textarea{ min-height:76px; } .ajuda{ font-size:13px; color:var(--tinta-2); margin:2px 0 0; }
.opcoes{ display:flex; flex-wrap:wrap; gap:6px 14px; } .opcoes label{ font-weight:500; font-size:14.5px; display:inline-flex; gap:6px; align-items:center; }
.grade{ display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:10px 14px; }
.remedio{ border-top:1px dashed var(--hair-2); padding-top:12px; margin-top:4px; }
.med{ display:grid; grid-template-columns:1fr auto; gap:8px 14px; align-items:center; padding:14px 0; border-bottom:1px solid var(--hair); }
.med .nome{ font-weight:650; } .med .det{ font-size:13.5px; color:var(--tinta-2); }
.seg{ display:inline-flex; border:1px solid var(--hair-2); border-radius:10px; overflow:hidden; flex-wrap:wrap; }
.seg input{ position:absolute; opacity:0; pointer-events:none; } .seg label{ padding:8px 12px; font-size:14px; cursor:pointer; border-left:1px solid var(--hair); }
.seg label:first-of-type{ border-left:0; } .seg input:checked+label{ background:var(--tinta); color:#fff; }
.seg input:focus-visible+label{ outline:2px solid var(--tinta-2); outline-offset:-2px; }
.dose{ grid-column:1/-1; display:none; } .med.mudou .dose{ display:block; }
.mudou-l{ margin:6px 0 0; padding-left:20px; } .tempo-g{ font-size:44px; font-weight:700; letter-spacing:-.02em; }
.meta-ok{ color:#1d5c34; } .meta-nao{ color:var(--quente); }
.tab-m td,.tab-m th{ font-size:13.5px; padding:8px 6px; vertical-align:top; } .tab-m td.n{ text-align:right; font-family:var(--mono); }
.cartoes{ display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:10px; margin-bottom:14px; }
.cartoes .cartao{ margin:0; padding:14px 16px; } .cartoes b{ display:block; font-size:24px; } .cartoes span{ font-size:13px; color:var(--tinta-2); }
.rolagem{ overflow-x:auto; }
.aviso-medico{ font-size:17px; line-height:1.6; }
@media (max-width:600px){ .med{ grid-template-columns:1fr; } main{ margin:18px auto; } .cartao{ padding:18px 16px; } }
.pac-conf{ margin-top:4px; font-size:13.5px; color:var(--tinta-2); } .pac-conf.difere{ color:var(--quente); font-weight:600; }
.etiqueta.novo{ background:#e4eefc; color:#1b4a8a; margin-top:4px; }
.alerta-topo{ margin:0; padding:9px 16px; background:var(--quente-fundo); color:var(--quente); font-size:14px; font-weight:600; text-align:center; }
.alerta-topo a{ color:inherit; }
.ajuda-link{ color:#fff; font-size:13px; margin-right:14px; }
.ajuda ol{ padding-left:22px; } .ajuda li{ margin:0 0 8px; } .ajuda h2{ margin-top:4px; }
a.btn{ text-decoration:none; display:inline-block; }
.cartao.destaque{ border:2px solid var(--tinta-2); }
.link-convite{ width:100%; font:13.5px var(--mono); padding:10px 12px; border:1px solid var(--hair-2); border-radius:10px; background:var(--fundo); }
.form input[type=password],.form input[type=email],.form input[type=text]{ width:100%; font:inherit; padding:10px 12px; border:1px solid var(--hair-2); border-radius:10px; }
button.link{ font:inherit; color:var(--tinta-2); background:none; border:0; padding:0; text-decoration:underline; cursor:pointer; }
.linha form{ margin:0; }
.campo input[type=datetime-local]{ width:100%; font:inherit; padding:9px 11px; border:1px solid var(--hair-2); border-radius:10px; background:#fff; }
/* progresso do processamento */
.prog{ height:14px; border-radius:999px; background:var(--fundo); overflow:hidden; margin:14px 0 8px; }
.prog i{ display:block; height:100%; border-radius:999px; background:var(--tinta-2); transition:width 1.2s ease; min-width:14px; }
.prog-linha{ font-size:17px; margin:0 0 14px; } .prog-linha b{ font-size:22px; margin-right:8px; }
.prog-etapas{ list-style:none; padding:0; margin:0 0 14px; display:grid; gap:6px; }
.prog-etapas li{ padding:8px 12px 8px 38px; border-radius:10px; position:relative; color:var(--tinta-2); font-size:15px; }
.prog-etapas li::before{ content:""; position:absolute; left:12px; top:50%; width:14px; height:14px; margin-top:-7px; border-radius:50%; border:2px solid var(--hair-2); }
.prog-etapas li.feita{ color:var(--tinta); } .prog-etapas li.feita::before{ background:#1d6b3a; border-color:#1d6b3a; }
.prog-etapas li.agora{ background:var(--fundo); color:var(--tinta); font-weight:650; }
.prog-etapas li.agora::before{ border-color:var(--tinta-2); border-top-color:transparent; animation:gira 1s linear infinite; }
@keyframes gira{ to{ transform:rotate(360deg); } }
@media (prefers-reduced-motion: reduce){ .prog-etapas li.agora::before{ animation:none; } .prog i{ transition:none; } }

/* paciente cadastrado: as três opções do médico */
.opcoes{ display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 14px; margin: 12px 0 18px; }
.opcao{ display: flex; flex-direction: column; gap: 6px; margin: 0; text-decoration: none; color: inherit; }
.opcao h3{ margin: 0; }
.opcao p{ margin: 0 0 8px; flex: 1; }
.opcao .btn{ align-self: flex-start; }
a.opcao:hover{ border-color: currentColor; }

/* teste retroativo */
.etiqueta.retro-antecipou{ background:#e3f4ea; color:#17643a; } .etiqueta.retro-parcial{ background:var(--quente-fundo); color:var(--quente); }
.etiqueta.retro-nao{ background:#fbe6e3; color:#9c2b1e; } tr.apagado td{ opacity:.6; }