/* Haven · diagnóstico da rotina. Design System v2 (mesmos tokens de site.css, que carrega antes). Mobile first, tudo local: CSP sem inline. */

.dx{min-height:100svh;display:flex;flex-direction:column;align-items:center;gap:20px;padding:calc(var(--header-h) + 28px) 20px 56px;
  background:radial-gradient(60% 40% at 50% 0%,rgba(198,220,255,.6),rgba(198,220,255,0) 70%),radial-gradient(40% 30% at 100% 60%,rgba(156,194,255,.26),rgba(156,194,255,0) 70%),radial-gradient(40% 30% at 0% 90%,rgba(244,235,222,.8),rgba(244,235,222,0) 70%),var(--nevoa)}
.dx [hidden]{display:none!important}

/* Entrada: sem cartão, como a abertura da landing */
.dx-intro{width:100%;max-width:720px;display:flex;flex-direction:column;align-items:flex-start;gap:16px;padding-top:12px}
.dx-intro .chip{align-self:flex-start;text-align:left;border-radius:20px}
.dx-intro h1{font-size:clamp(36px,6vw,60px);line-height:1.06;letter-spacing:-.04em;margin-top:4px}
.dx-intro .btn{margin-top:8px}
.dx-apoio,.dx-privado,.dx-estado{font-size:14px;line-height:21px;color:var(--text-secondary);max-width:560px}
.dx-estado,.dx-privado{display:flex;gap:8px;align-items:flex-start;font-size:13px;line-height:19px;color:var(--text-tertiary)}
.dx-estado .i,.dx-privado .i{width:16px;height:16px;margin-top:2px}
.dx-privado a{color:var(--text-link)}
.dx-sem-js{padding:16px;border-radius:var(--radius-lg);background:#fff;border:1px solid var(--line);display:flex;flex-direction:column;gap:12px}
.dx-sem-js p:last-child{display:flex;flex-wrap:wrap;gap:8px}

/* Cartão de pergunta e de resultado */
.dx-cartao{width:100%;max-width:720px;background:#fff;border:1px solid var(--line);border-radius:var(--radius-xl);box-shadow:var(--shadow-card);padding:20px;display:flex;flex-direction:column;gap:20px}

.dx-barra{appearance:none;-webkit-appearance:none;width:100%;height:6px;border:0;border-radius:999px;background:var(--blue-100);overflow:hidden}
.dx-barra::-webkit-progress-bar{background:var(--blue-100);border-radius:999px}
.dx-barra::-webkit-progress-value{background:var(--action);border-radius:999px;transition:width 220ms var(--ease-spring)}
.dx-barra::-moz-progress-bar{background:var(--action);border-radius:999px}

.dx-grupo{margin:0;padding:0;border:0;min-inline-size:0;display:flex;flex-direction:column;gap:16px}
.dx-grupo legend{display:block;width:100%;padding:0;float:left}
.dx-grupo legend + *{clear:both}
.dx-passo{display:block;font-size:13px;line-height:18px;font-weight:500;color:var(--text-tertiary);margin-bottom:8px;font-variant-numeric:tabular-nums}
.dx-titulo{display:block;margin:0;font-weight:300;font-size:clamp(24px,4.4vw,32px);line-height:1.2;letter-spacing:-.025em;color:var(--ink);text-wrap:balance}

#dx-form{display:flex;flex-direction:column;gap:16px}
.dx-ops{display:grid;gap:10px}
.dx-op{display:flex;align-items:center;gap:14px;min-height:56px;padding:12px 16px;border:1px solid var(--line);border-radius:var(--radius-lg);background:#fff;color:var(--ink);font-size:16px;line-height:22px;cursor:pointer;transition:background-color 120ms,border-color 120ms}
.dx-op:hover{background:var(--blue-50)}
.dx-op input{appearance:none;-webkit-appearance:none;flex:none;width:24px;height:24px;margin:0;border:1.5px solid var(--border-input);border-radius:50%;background:#fff;cursor:pointer}
.dx-op input:checked{border-color:var(--action);background:var(--action);box-shadow:inset 0 0 0 5px #fff}
.dx-op:has(input:checked){background:var(--blue-50);border-color:var(--action);color:var(--blue-700)}
.dx-op:has(input:focus-visible){outline:2px solid var(--action);outline-offset:2px}
.dx-op input:focus-visible{outline:none}

.dx-ajuda{font-size:14px;line-height:20px;color:var(--text-secondary)}
.dx-nota{font-size:13px;line-height:18px;font-weight:500;color:var(--blue-700);min-height:0}
.dx-nota:empty{display:none}
.dx-acoes{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.dx-acoes .btn-primary{margin-left:auto}
.dx-grupo:focus{outline:none}
.dx-grupo:focus-visible{outline:2px solid var(--action);outline-offset:6px;border-radius:var(--radius-md)}
.dx .btn{white-space:normal;height:auto;min-height:44px;text-align:center;padding-block:10px}
.dx .btn-52{min-height:52px}
.dx .btn:disabled{opacity:.4;box-shadow:none;cursor:not-allowed}
.dx-motivo{font-size:13px;line-height:18px;color:var(--text-tertiary);text-align:right;margin-top:-8px}

/* Resultado */
.dx-res .chip{align-self:flex-start}
.dx-res h1{font-weight:300;font-size:clamp(28px,4.8vw,40px);line-height:1.12;letter-spacing:-.03em;text-wrap:balance}
.dx-res h1:focus{outline:none}
.dx-corpo{display:flex;flex-direction:column;gap:16px}
.dx-lead{font-size:17px;line-height:27px;color:var(--text-secondary);text-wrap:pretty}
.dx-bloco{display:flex;flex-direction:column;gap:4px;padding-top:16px;border-top:1px solid var(--line)}
.dx-bloco:first-child{padding-top:0;border-top:0}
.dx-bloco p:last-child{color:var(--text-secondary)}
.dx-bloco strong{color:var(--ink);font-weight:600}
.dx-rotulo{font-size:13px;line-height:18px;font-weight:500;color:var(--blue-700)}
.dx-outras{font-size:14px;line-height:21px;color:var(--text-secondary)}
.dx-transp{font-size:13px;line-height:19px;color:var(--text-tertiary);padding:12px 14px;border-radius:var(--radius-md);background:var(--surface-subtle)}
.dx-fora{display:flex;gap:10px;align-items:flex-start;padding:14px;border-radius:var(--radius-md);background:var(--blue-50);color:var(--blue-700);font-size:14px;line-height:20px}
.dx-fora .i{margin-top:1px}

.dx-cta{display:flex;flex-direction:column;align-items:stretch;gap:12px;padding:20px;border-radius:var(--radius-xl);background:var(--aura)}
.dx-cta-linha{font-weight:500;font-size:17px;line-height:24px;color:var(--ink)}
.dx-cta .dx-apoio{color:var(--ink-2)}
.dx-cta .btn{width:100%}
.dx-refazer{align-self:center}

@media (min-width:720px){
  .dx{padding-top:calc(var(--header-h) + 48px);gap:28px}
  .dx-cartao{padding:36px;gap:24px}
  .dx-cta{padding:24px 28px}
  .dx-cta .btn{width:auto;align-self:flex-start}
}
@media (prefers-reduced-motion:reduce){.dx-barra::-webkit-progress-value,.dx-op{transition:none}}
