/* ============================================================
   FALAMIGO V8.8 — Relatório de progresso (tela e impressão A4)
   ============================================================ */
body:has(#s-relatorio.on){--maxw:920px}
#s-relatorio{gap:14px}
.rel-controls{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between}
.rel-period{display:inline-flex;padding:4px;border-radius:999px;background:var(--card-2);border:1.5px solid var(--line)}
.rel-pbtn{min-height:44px;min-width:92px;padding:8px 16px;border-radius:999px;border:0;background:transparent;color:var(--ink-2);font:750 1rem/1 var(--f-body);cursor:pointer}
.rel-pbtn[aria-pressed="true"]{background:var(--deep);color:var(--on-deep)}
.rel-print{min-height:48px;font-size:1rem}
.rel-tip{margin:0;font-size:.9rem;color:var(--muted)}

/* A folha: papel claro também no tema escuro, como será impresso. */
.rel-sheet{
  --rp-ink:#22343b;--rp-ink2:#40565e;--rp-muted:#5d6e74;--rp-line:#d7e2dc;--rp-soft:#f3f7f4;
  --rp-deep:#2f6461;--rp-deep-soft:#dcefe8;--rp-ok:#3f7a55;--rp-ok-soft:#e1f2e5;--rp-warn:#8a6420;--rp-warn-soft:#fbefd6;--rp-live:#9a4f36;--rp-live-soft:#fbe7dc;
  background:#fff;color:var(--rp-ink);border-radius:22px;border:1px solid var(--rp-line);box-shadow:var(--sh-2);
  padding:28px 26px;display:flex;flex-direction:column;gap:20px;font-size:15px;line-height:1.5;margin-bottom:8px;color-scheme:light
}
.rel-sheet h1,.rel-sheet h2,.rel-sheet h3{color:var(--rp-ink);font-family:var(--f-display)}
.rel-sheet{overflow-wrap:break-word;hyphens:auto}
.rel-mini span,.rel-kpi small,.rel-kpi span{overflow-wrap:normal;word-break:normal}
.rel-head{display:flex;gap:16px;align-items:flex-start;justify-content:space-between;border-bottom:3px solid var(--rp-deep);padding-bottom:16px}
.rel-brand{display:block;font-size:.78rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--rp-deep)}
.rel-head h1{font-size:2rem;margin:4px 0 6px}
.rel-head p{margin:0;color:var(--rp-ink2)}
.rel-badge{flex:0 0 auto}
.rel-badge svg{width:74px;height:74px}
.rel-kpis{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.rel-kpi{background:var(--rp-soft);border:1px solid var(--rp-line);border-radius:16px;padding:14px;display:flex;flex-direction:column;gap:2px;min-width:0}
.rel-kpi b{font:800 1.6rem/1.1 var(--f-display);color:var(--rp-deep)}
.rel-kpi span{font-weight:750;color:var(--rp-ink)}
.rel-kpi small{color:var(--rp-muted);font-size:.85rem}
.rel-sec{display:flex;flex-direction:column;gap:10px;break-inside:avoid;page-break-inside:avoid}
.rel-sec h2{font-size:1.25rem;display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}
.rel-sec h2 small{font:600 .85rem var(--f-body);color:var(--rp-muted)}
.rel-sec h3{font-size:1rem;margin-top:4px}
.rel-chart{width:100%;height:auto;display:block}
.rel-chart .rel-grid{stroke:var(--rp-line);stroke-width:1}
.rel-chart .rel-ax{font:600 12px var(--f-body);fill:var(--rp-muted)}
.rel-chart .rel-val{font:700 12px var(--f-body);fill:var(--rp-ink2)}
.rel-chart .rel-barr{fill:#9cc9bb}
.rel-chart .rel-barr.is-goal{fill:var(--rp-deep)}
.rel-chart .rel-zero{fill:var(--rp-line)}
.rel-chart .rel-goal{stroke:var(--rp-warn);stroke-width:1.6;stroke-dasharray:6 5}
.rel-chart .rel-goal-t{font:700 12px var(--f-body);fill:var(--rp-warn)}
.rel-note{margin:0;font-size:.85rem;color:var(--rp-muted)}
.rel-muted{margin:0;color:var(--rp-muted)}
.rel-skills{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px}
.rel-skill{border:1px solid var(--rp-line);border-radius:14px;padding:12px;display:flex;flex-direction:column;gap:6px;min-width:0;break-inside:avoid}
.rel-skill-top{display:flex;justify-content:space-between;gap:8px;align-items:flex-start;flex-wrap:wrap}
.rel-skill-top b{font-size:1rem}
.rel-state{font-size:.8rem;font-weight:800;padding:3px 9px;border-radius:999px;background:var(--rp-soft);color:var(--rp-ink2);max-width:100%}
.rel-skill small{color:var(--rp-muted);font-size:.84rem}
.rel-meter{height:8px;border-radius:99px;background:var(--rp-soft);overflow:hidden;border:1px solid var(--rp-line)}
.rel-meter i{display:block;height:100%;background:var(--rp-deep)}
.rel-st-ok .rel-state{background:var(--rp-ok-soft);color:var(--rp-ok)}
.rel-st-ok .rel-meter i{background:var(--rp-ok)}
.rel-st-warn .rel-state{background:var(--rp-warn-soft);color:var(--rp-warn)}
.rel-st-warn .rel-meter i{background:var(--rp-warn)}
.rel-st-mid .rel-state{background:var(--rp-deep-soft);color:var(--rp-deep)}
.rel-two{display:grid;grid-template-columns:minmax(0,1fr);gap:20px}
.rel-mini{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.rel-mini>div{background:var(--rp-soft);border-radius:12px;padding:10px;display:flex;flex-direction:column;min-width:0}
.rel-mini b{font:800 1.4rem/1.1 var(--f-display);color:var(--rp-deep)}
.rel-mini span{font-size:.8rem;color:var(--rp-ink2);line-height:1.3}
.rel-words{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 12px}
.rel-words li{display:flex;gap:6px;align-items:baseline;border-bottom:1px dotted var(--rp-line);padding:3px 0;min-width:0}
.rel-words li b{font-weight:800}
.rel-words li span{color:var(--rp-muted);font-size:.88rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;flex:1}
.rel-words li em{font-style:normal;font-weight:700;font-size:.82rem;color:var(--rp-live);margin-left:auto}
.rel-stages{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 12px;font-size:.9rem}
.rel-stages i{display:inline-block;width:12px;height:12px;border-radius:4px;margin-right:6px;vertical-align:-1px}
.rel-stages .s-firme{background:var(--rp-ok)}.rel-stages .s-cons{background:var(--rp-deep)}.rel-stages .s-apr{background:#9cc9bb}.rel-stages .s-novo{background:var(--rp-line)}
.rel-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.rel-list li{display:flex;flex-direction:column;border-left:4px solid var(--rp-deep);padding:4px 0 4px 12px}
.rel-list li span{font-size:.88rem;color:var(--rp-muted)}
.rel-foot-sec p{margin:0}
.rel-footer{border-top:1px solid var(--rp-line);padding-top:12px;font-size:.8rem;color:var(--rp-muted)}
@media(min-width:640px){
  .rel-sheet{padding:36px 40px}
  .rel-kpis{grid-template-columns:repeat(4,minmax(0,1fr))}
  .rel-two{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:380px){
  .rel-sheet{padding:20px 16px}
  .rel-head h1{font-size:1.6rem}
  .rel-skills,.rel-words{grid-template-columns:minmax(0,1fr)}
  .rel-badge{display:none}
}

/* ---------- Impressão A4 ---------- */
@page{size:A4 portrait;margin:12mm 13mm 14mm}
@media print{
  html,body{background:#fff!important;height:auto!important;overflow:visible!important}
  body>*:not(#app){display:none!important}
  #app{max-width:none!important;height:auto!important;overflow:visible!important;box-shadow:none!important;border:0!important;background:#fff!important;display:block!important}
  .tabbar,.toast,.sheet,.sheet-bg,#bootSplash,.rel-toolbar{display:none!important}
  .screen:not(#s-relatorio){display:none!important}
  #s-relatorio{display:block!important;padding:0!important;overflow:visible!important;animation:none!important}
  .rel-sheet{box-shadow:none;border:0;border-radius:0;padding:0;gap:12px;font-size:10pt;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .rel-sec{break-inside:auto;page-break-inside:auto}
  .rel-sec h2{break-after:avoid;page-break-after:avoid}
  .rel-skill,.rel-kpi,.rel-mini>div,.rel-list li,.rel-chart,.rel-head,.rel-footer{break-inside:avoid;page-break-inside:avoid}
  .rel-skill{padding:9px 10px;gap:4px}
  .rel-head h1{font-size:22pt}
  .rel-kpis{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
  .rel-kpi{padding:9px 10px}
  .rel-kpi b{font-size:17pt}
  .rel-skills{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .rel-two{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
  .rel-words{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rel-badge{display:block}
  .rel-sec h2{font-size:13pt}
  .rel-chart{max-height:52mm}
  .rel-footer{font-size:8.5pt}
}

/* Entrada na tela Você */
.rel-entry{display:flex;align-items:center;gap:14px;width:100%;text-align:left;padding:16px;border-radius:var(--r-m);background:var(--card);border:1.5px solid var(--action-edge);box-shadow:var(--sh-1);color:var(--ink);cursor:pointer;min-height:76px}
.rel-entry-ic{width:48px;height:48px;border-radius:16px;display:grid;place-items:center;background:var(--deep-soft);color:var(--deep);flex:0 0 auto}
.rel-entry-ic svg{width:24px;height:24px}
.rel-entry-copy{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.rel-entry-copy b{font:750 1.08rem/1.3 var(--f-display)}
.rel-entry-copy span{font-size:.9rem;color:var(--muted)}