#health-page { display:grid; gap:16px; margin:16px 0; }
#health-page .health-answer { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin:6px 0 14px; }
#health-page .health-badge { display:inline-flex; align-items:center; gap:8px; padding:8px 14px; border-radius:999px; font-weight:600; font-size:15px; border:1px solid var(--line); }
#health-page .health-badge.vermelho { color:#ffb3b3; background:#3a1820; border-color:#7a2f3a; }
#health-page .health-badge.laranja { color:#ffcb8f; background:#3a2614; border-color:#80522a; }
#health-page .health-badge.amarelo { color:#ffe39c; background:#352e14; border-color:#7a6a2a; }
#health-page .health-badge.verde { color:#8ff0bf; background:#11332a; border-color:#2b7a58; }
:is(#health-page,#operation-cash) .health-cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:12px; }
:is(#health-page,#operation-cash) .health-cards article { border:1px solid var(--line); background:var(--panel-soft); border-radius:10px; padding:13px 14px; min-width:0; }
:is(#health-page,#operation-cash) .health-cards span { display:block; color:var(--muted); font-size:13px; }
:is(#health-page,#operation-cash) .health-cards strong { display:block; margin-top:6px; font-size:22px; white-space:nowrap; }
:is(#health-page,#operation-cash) .health-cards small { display:block; margin-top:6px; color:var(--muted); font-size:12px; }
:is(#health-page,#operation-cash) .pos { color:var(--green); } :is(#health-page,#operation-cash) .neg { color:var(--red); }
#health-page .health-bar { display:flex; height:10px; border-radius:6px; overflow:hidden; margin:16px 0 6px; }
#health-page .health-bar span { display:block; height:100%; }
#health-page .health-bar-labels { display:flex; color:var(--muted); font-size:12px; gap:6px; }
#health-page .health-bar-labels span { flex:1; }
#health-page .health-marker { position:relative; height:12px; margin-top:-2px; }
#health-page .health-marker i { position:absolute; top:0; width:0; height:0; border-left:6px solid transparent; border-right:6px solid transparent; border-bottom:9px solid var(--text); transform:translateX(-6px); }
#health-page table { width:100%; border-collapse:collapse; font-size:14px; }
#health-page td, #health-page th { padding:7px 6px; border-top:1px solid var(--line); text-align:right; white-space:nowrap; }
#health-page th { color:var(--muted); font-weight:500; font-size:12px; border-top:0; }
#health-page td:first-child, #health-page th:first-child { text-align:left; white-space:normal; }
#health-page tr.total td { font-weight:600; border-top:2px solid var(--line); }
:is(#health-page,#operation-cash) .health-check { margin-top:10px; font-size:13px; }
:is(#health-page,#operation-cash) .health-check.ok { color:var(--green); } :is(#health-page,#operation-cash) .health-check.bad { color:var(--yellow); }
#health-page .health-two { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:16px; }
:is(#health-page,#operation-cash) .health-note { color:var(--muted); font-size:13px; margin-top:10px; }
#health-page .health-trust li { margin:6px 0; }
#health-page .health-trust { padding-left:18px; margin:6px 0 0; }

/* TELA-OVERVIEW-SAUDE: cada painel fica na largura util; so a tabela rola. */
@media (max-width:900px) {
  #health-page { grid-template-columns:minmax(0,1fr); }
  #health-page > *, #health-page .health-two > * { min-width:0; }
  #health-page .health-two, :is(#health-page,#operation-cash) .health-cards {
    grid-template-columns:minmax(0,1fr);
  }
  :is(#health-page,#operation-cash) .panel, #health-goal-milestones, #operation-cash {
    min-width:0; width:100%; padding:16px;
  }
  #health-page table {
    display:block; max-width:100%; overflow-x:auto; overscroll-behavior-x:contain;
  }
  :is(#health-page,#operation-cash) .health-cards span, #health-goal-milestones .goal-tier-grid span {
    white-space:normal; overflow-wrap:normal;
  }
  #health-goal-milestones .goal-tier { display:block; padding:14px 12px; }
  #health-goal-milestones .goal-tier h3 { margin-bottom:12px; }
  #health-goal-milestones .goal-tier-grid { grid-template-columns:minmax(0,1fr); gap:14px; }
  #health-goal-milestones .goal-tier-grid > div { display:flex; flex-direction:column; align-items:flex-start; }
  #health-goal-milestones .goal-tier-grid strong { margin-top:4px; padding-top:0; }
  body:has(#health-page:not([hidden])) #health-goal-milestones,
  body:has(#health-page:not([hidden])) #traffic-campaign-problems { margin:16px 0; }
}

/* SAUDE-CELULAR B: no rule above this media is changed. */
@media (max-width:600px) {
  :is(#health-page,#operation-cash) .health-cards { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  :is(#health-page,#operation-cash) .health-cards strong {
    font-size:clamp(15px,4.8vw,18px); white-space:normal; overflow-wrap:anywhere;
  }
  :is(#health-page,#operation-cash) .health-cards article { padding:10px; }
  #operation-cash .operation-cash-profit, #operation-cash .operation-cash-wide { grid-column:1/-1; }
  #health-goal-milestones .goal-tier-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
  #health-goal-milestones .goal-tier-grid span { white-space:normal; overflow-wrap:anywhere; }
  :is(#health-page,#operation-cash) .health-note,
  :is(#health-page,#operation-cash) .health-cards small, #health-page .health-bar-labels { font-size:13px; }
  #health-page .health-bar-labels { flex-wrap:wrap; }
  #health-page .health-bar-labels span { flex:1 1 40%; }
  :is(#health-page,#health-goal-milestones) .health-drawer {
    min-width:0; border:1px solid var(--line); border-radius:10px; background:var(--panel);
  }
  :is(#health-page,#health-goal-milestones) .health-drawer > summary {
    padding:12px; font-size:13px; cursor:pointer; overflow-wrap:anywhere;
  }
  :is(#health-page,#health-goal-milestones) .health-drawer > summary > * { display:inline; }
  #health-goal-milestones .health-drawer > summary > div > strong { margin-left:4px; }
  #operation-cash { padding:12px; }
  #operation-cash > .health-note, #operation-cash .operation-cash-control,
  #operation-cash .operation-cash-networks, #operation-cash .operation-cash-reading { font-size:13px; }
  #operation-cash .operation-cash-reading { color:var(--muted); }
  :is(#health-page,#health-goal-milestones) .health-drawer-warning { color:var(--yellow); }
  #health-page .health-drawer > .panel { border:0; margin:0; padding:12px; }
  #health-summary[hidden], #health-summary { display:none; }
  body:has(#health-page:not([hidden])) #health-summary:not([hidden]) {
    display:grid; gap:4px; min-width:0; margin:8px 0;
  }
  #health-summary .health-summary-line {
    width:100%; min-width:0; text-align:left; white-space:normal; overflow-wrap:anywhere;
    padding:6px 10px; border:1px solid var(--line); border-radius:8px;
    background:var(--panel); color:var(--text); font:inherit; font-size:13px; cursor:pointer;
  }
  #health-summary .verde { color:var(--green); }
  #health-summary .amarelo, #health-summary .laranja { color:var(--yellow); }
  #health-summary .vermelho { color:var(--red); }
  #health-page, #health-page .health-drawer, #health-month,
  #health-goal-milestones, #traffic-campaign-problems { scroll-margin-top:calc(72px + env(safe-area-inset-top)); }
  #health-page table { display:block; overflow:visible; max-width:100%; }
  #health-page thead { display:none; }
  #health-page tbody { display:block; }
  #health-page tbody tr { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); border-top:1px solid var(--line); padding:8px 0; }
  #health-page td { min-width:0; border:0; padding:2px 0; white-space:normal; overflow-wrap:anywhere; }
  #health-sources td:first-child { grid-column:1; grid-row:1; text-align:left; }
  #health-sources td:last-child { grid-column:2; grid-row:1; text-align:right; font-weight:600; }
  #health-sources td:nth-child(2), #health-sources td:nth-child(3) { grid-row:2; color:var(--muted); font-size:13px; text-align:left; }
  #health-sources td:nth-child(2):not(:empty)::before { content:'receita bruta '; }
  #health-sources td:nth-child(3)::before { content:' · custo '; }
  #health-dollar tbody tr { grid-template-columns:minmax(0,1fr); gap:2px; }
  #health-dollar td { text-align:left; font-size:13px; }
  #health-dollar td::before { content:attr(data-label) ' '; color:var(--muted); }
  #health-dollar td + td::before { content:'→ ' attr(data-label) ' '; }
}
@media (max-width:359px) {
  :is(#health-page,#operation-cash) .health-cards,
  #health-goal-milestones .goal-tier-grid { grid-template-columns:minmax(0,1fr); }
}