/* Frontend styles matching the screenshot */
.cv4-outer{ font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; color:#1f2937; }
.cv4-cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; max-width:1100px; margin:0 auto 18px; }
.cv4-card{ background:#fff; border:1px solid #ebeef2; border-radius:14px; padding:16px; text-align:center; box-shadow:0 6px 16px rgba(16,24,40,.06); }
.cv4-card img{ width:100%; border-radius:12px; margin-bottom:10px; }
.cv4-card h3{ margin:6px 0 12px; font-size:16px; font-weight:700; }
.cv4-meta{ display:flex; justify-content:space-between; color:#6b7280; font-size:12px; margin-bottom:6px; }
.cv4-progress{ height:8px; background:#efe7bf; border-radius:999px; overflow:hidden; position:relative; }
.cv4-progress>span{ position:absolute; left:0; top:0; bottom:0; background:#f7c948; width:0%; transition:width .25s ease; }
.cv4-btn{ width:100%; margin-top:12px; padding:10px 12px; border:1px solid #cfd8e3; background:#fff; border-radius:8px; font-weight:700; cursor:pointer; }

.cv4-summary{ background:#fff9ec; border:1px solid #eadfb8; border-radius:12px; padding:16px; max-width:560px; margin:10px auto; box-shadow:0 8px 14px rgba(16,24,40,.04); }
.cv4-summary-top{ font-weight:700; display:flex; align-items:center; gap:8px; margin-bottom:10px; }
.cv4-row{ display:grid; grid-template-columns: 1.4fr 2.2fr 60px; align-items:center; gap:10px; margin:8px 0; }
.cv4-row-label{ color:#374151; }
.cv4-row-bar{ height:10px; background:#fff; border:1px solid #eee; border-radius:999px; position:relative; overflow:hidden; }
.cv4-row-bar>span{ position:absolute; left:0; top:0; bottom:0; background:#bfeec9; width:0%; transition:width .25s ease; }
.cv4-row-pct{ text-align:right; color:#6b7280; font-weight:600; }
.cv4-summary hr{ border:none; border-top:1px solid #eadfb8; margin:14px 0; }
.cv4-closing{ text-align:center; color:#5b5b5b; margin:6px 0 12px; }
.cv4-actions{ display:flex; gap:10px; justify-content:center; }
.cv4-btn-primary{ background:#f7c948; border:1px solid #e2c54f; color:#111; text-decoration:none; padding:10px 14px; border-radius:8px; font-weight:700; }
.cv4-btn-ghost{ background:#fff; border:1px solid #94a3b8; color:#111; text-decoration:none; padding:10px 14px; border-radius:8px; font-weight:600; }

.cv4-live{ text-align:center; font-size:12px; color:#6b7280; margin-top:8px; }
.cv4-live .dot-green{ display:inline-block; width:8px; height:8px; border-radius:999px; background:#22c55e; margin-right:6px; vertical-align:middle; }
.cv4-live .dot-grey{ display:inline-block; width:6px; height:6px; border-radius:999px; background:#9ca3af; margin:0 6px 0 16px; vertical-align:middle; }

@media (max-width: 900px){
  .cv4-cards{ grid-template-columns:1fr; }
}