.cipva-wrap{ --bg:#ffffff; --fg:#0f172a; --muted:#64748b; --brand:#0ea5e9; --line:#e2e8f0; --ok:#16a34a; --warn:#dc2626; }
.cipva-card{ background:var(--bg); color:var(--fg); border:1px solid var(--line); border-radius:16px; padding:20px; box-shadow:0 2px 12px rgba(2,6,23,.06); max-width:860px; margin:0 auto; }
.cipva-title{ font-size:1.4rem; line-height:1.2; margin:0 0 6px; font-weight:700; }
.cipva-sub{ color:var(--muted); margin:0 0 16px; }
.cipva-mode{ display:flex; gap:12px; margin:8px 0 12px; flex-wrap:wrap; }
.cipva-radio{ display:flex; align-items:center; gap:8px; border:1px solid var(--line); padding:8px 10px; border-radius:999px; cursor:pointer; user-select:none; }
.cipva-radio input{ accent-color: var(--brand); }
.cipva-inputs{ display:grid; grid-template-columns: 1fr; gap:10px; margin-top:10px; }
.cipva-label{ font-size:.9rem; color:var(--muted); }
.cipva-input{ border:1px solid var(--line); border-radius:12px; padding:12px 14px; font-size:1rem; width:100%; outline:none; }
.cipva-input:focus{ border-color: var(--brand); box-shadow: 0 0 0 3px rgba(14,165,233,.15); }
.cipva-actions{ display:flex; gap:10px; margin:14px 0 6px; flex-wrap:wrap; }
.cipva-btn{ background:var(--brand); color:#fff; border:none; padding:10px 14px; border-radius:12px; font-weight:600; cursor:pointer; }
.cipva-btn.ghost{ background:transparent; color:var(--brand); border:1px solid var(--brand); }
.cipva-results{ margin-top:10px; }
.cipva-grid{ display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:12px; }
.cipva-kpi{ border:1px solid var(--line); border-radius:14px; padding:14px; }
.kpi-label{ color:var(--muted); font-size:.85rem; margin-bottom:6px; }
.kpi-value{ font-size:1.25rem; font-weight:800; }
.kpi-sub{ color:var(--muted); font-size:.8rem; margin-top:2px; }
.cipva-note{ font-size:.85rem; color:var(--muted); margin-top:12px; }
.hidden{ display:none !important; }
.sr-only{ position:absolute !important; height:1px; width:1px; overflow:hidden; clip:rect(1px, 1px, 1px, 1px); white-space:nowrap; }

@media (min-width:680px){
  .cipva-inputs{ grid-template-columns: 1fr 1fr; }
  .cipva-grid{ grid-template-columns: repeat(4, minmax(0,1fr)); }
}