/* ===========================================================
   Painel Saúde & Treino — style.css
   Fonte separada para edição. A versão de produção
   (painel_saude_renato.html) embute este CSS inline.
   =========================================================== */

  :root{
    --ink:#16211c; --paper:#f7f6f1; --card:#ffffff; --line:#e4e2d8;
    --muted:#6b6f68; --teal:#0f8f68; --coral:#c8542a; --blue:#1a5fa0;
    --amber:#b07714; --red:#b3392c; --green-bg:#e8f4ee; --amber-bg:#fbf1de; --red-bg:#f9e7e4;
  }
  *{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
  html,body{margin:0}
  body{background:var(--paper);color:var(--ink);
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
    line-height:1.5;padding-bottom:80px}
  .num{font-variant-numeric:tabular-nums;font-feature-settings:"tnum"}
  header{padding:16px 16px 10px;position:sticky;top:0;background:var(--paper);z-index:20;border-bottom:1px solid var(--line)}
  header h1{margin:0;font-size:17px;font-weight:600;letter-spacing:-.2px}
  header .sub{color:var(--muted);font-size:12.5px;margin-top:2px}
  .tabs{display:flex;gap:6px;margin-top:12px}
  .tabs button{flex:1;border:1px solid var(--line);background:var(--card);color:var(--ink);
    padding:9px 8px;border-radius:10px;font-size:14px;font-weight:500}
  .tabs button.on{background:var(--ink);color:#fff;border-color:var(--ink)}
  main{padding:14px 16px;max-width:720px;margin:0 auto}
  .card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px;margin-bottom:14px}
  .card h2{margin:0 0 10px;font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--muted)}
  label{display:block;font-size:12px;color:var(--muted);margin-bottom:3px}
  input,select{width:100%;border:1px solid var(--line);border-radius:9px;padding:9px 10px;font-size:15px;
    background:#fff;color:var(--ink);font-variant-numeric:tabular-nums}
  input:focus,select:focus{outline:none;border-color:var(--ink)}
  .grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}
  .btn{border:none;border-radius:10px;padding:11px 14px;font-size:14px;font-weight:600;width:100%}
  .btn.pri{background:var(--teal);color:#fff}
  .btn.dark{background:var(--ink);color:#fff}
  .btn.ghost{background:#fff;border:1px solid var(--line);color:var(--ink)}
  .row-btns{display:flex;gap:8px;margin-top:12px}
  .kpi{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .kpi .box{border:1px solid var(--line);border-radius:12px;padding:10px 12px}
  .kpi .lbl{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.4px}
  .kpi .val{font-size:22px;font-weight:600;margin-top:2px}
  .kpi .val small{font-size:12px;font-weight:500;color:var(--muted)}
  .chip{display:inline-block;font-size:11px;font-weight:600;padding:2px 8px;border-radius:20px;margin-top:6px}
  .chip.g{background:var(--green-bg);color:var(--teal)}
  .chip.a{background:var(--amber-bg);color:var(--amber)}
  .chip.r{background:var(--red-bg);color:var(--red)}
  .delta{font-size:12px;margin-left:6px}
  .delta.up{color:var(--coral)} .delta.down{color:var(--teal)}
  table{width:100%;border-collapse:collapse;font-size:13px}
  th,td{text-align:right;padding:7px 6px;border-bottom:1px solid var(--line);font-variant-numeric:tabular-nums}
  th{color:var(--muted);font-weight:600;font-size:11px;text-transform:uppercase}
  td:first-child,th:first-child{text-align:left}
  .del{color:var(--red);background:none;border:none;font-size:15px;padding:0 4px}
  canvas{width:100%;height:200px;display:block}
  .metric-pick{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
  .metric-pick button{border:1px solid var(--line);background:#fff;border-radius:20px;padding:5px 11px;font-size:12.5px;font-weight:500}
  .metric-pick button.on{background:var(--ink);color:#fff;border-color:var(--ink)}
  .note{font-size:12px;color:var(--muted);margin-top:6px}
  .banner{background:#fbf1de;border:1px solid #ecdcb4;border-radius:10px;padding:9px 11px;font-size:12.5px;color:#7a5a12;margin-bottom:14px}
  .setrow{display:grid;grid-template-columns:1fr 1fr auto;gap:8px;align-items:end;margin-bottom:8px}
  .exhist{font-size:12.5px;color:var(--muted);margin-top:8px;border-top:1px dashed var(--line);padding-top:8px}
  .exhist b{color:var(--ink)}
  .hidden{display:none}
  .scroll{overflow-x:auto}
  .foot{max-width:720px;margin:18px auto 0;padding:0 16px 20px;text-align:center;font-size:11px;color:var(--muted)}
