.cf54-first-value{margin:18px 0;padding:22px;border:1px solid color-mix(in srgb,var(--primary,#8b5cf6) 22%,var(--border,#e5e7eb));border-radius:24px;background:linear-gradient(135deg,color-mix(in srgb,var(--primary,#8b5cf6) 8%,var(--pulso-surface,var(--surface,var(--panel,#fff)))),var(--pulso-surface,var(--surface,var(--panel,#fff))) 58%);box-shadow:0 18px 50px rgba(38,20,78,.08)}
.cf54-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}.cf54-head h2,.cf54-copy h2{margin:5px 0 7px;font-size:clamp(1.35rem,2vw,1.8rem);line-height:1.15}.cf54-head p,.cf54-copy p{margin:0;color:var(--pulso-muted,var(--muted,#6b7280));max-width:760px;line-height:1.55}.cf54-hide{border:0;background:transparent;color:var(--pulso-muted,var(--muted,#6b7280));font-size:1.45rem;line-height:1;cursor:pointer;padding:5px 8px;border-radius:10px}.cf54-hide:hover{background:color-mix(in srgb,var(--primary,#8b5cf6) 10%,transparent);color:var(--pulso-ink,var(--ink,var(--text,#222)))}
.cf54-progress{margin:18px 0}.cf54-progress>div{display:flex;justify-content:space-between;gap:10px;font-size:.86rem}.cf54-progress>div span{font-weight:700}.cf54-progress>div strong{font-size:.9rem}.cf54-progress>i{display:block;height:8px;margin:8px 0 6px;border-radius:999px;background:color-mix(in srgb,var(--pulso-muted,var(--muted,#6b7280)) 16%,transparent);overflow:hidden}.cf54-progress>i>em{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--primary,#8b5cf6),color-mix(in srgb,var(--primary,#8b5cf6) 55%,#ec4899));transition:width .3s ease}.cf54-progress>small{color:var(--pulso-muted,var(--muted,#6b7280))}
.cf54-actions{display:grid;grid-template-columns:1.35fr 1fr 1fr;gap:12px}.cf54-actions article{display:grid;grid-template-columns:auto 1fr;gap:10px;padding:16px;border:1px solid var(--pulso-line,var(--border,#e5e7eb));border-radius:18px;background:var(--pulso-surface,var(--surface,var(--panel,#fff)));min-width:0}.cf54-actions article>span{width:34px;height:34px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--primary,#8b5cf6) 10%,transparent);font-weight:900}.cf54-actions article>div{min-width:0}.cf54-actions article small{display:block;color:var(--pulso-muted,var(--muted,#6b7280));font-weight:800;letter-spacing:.06em;font-size:.66rem}.cf54-actions article b{display:block;margin:4px 0;font-size:.98rem}.cf54-actions article p{margin:0;color:var(--pulso-muted,var(--muted,#6b7280));font-size:.82rem;line-height:1.4}.cf54-actions article .btn{grid-column:1/-1;justify-self:start;margin-top:2px}.cf54-actions article.is-primary{border-color:color-mix(in srgb,var(--primary,#8b5cf6) 30%,var(--pulso-line,var(--border,#e5e7eb)));background:linear-gradient(145deg,color-mix(in srgb,var(--primary,#8b5cf6) 7%,var(--pulso-surface,var(--surface,var(--panel,#fff)))),var(--pulso-surface,var(--surface,var(--panel,#fff))))}.cf54-actions article.is-primary>span{background:var(--primary,#8b5cf6);color:#fff}
.cf54-first-value footer{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:14px;padding-top:14px;border-top:1px solid var(--pulso-line,var(--border,#e5e7eb));color:var(--pulso-muted,var(--muted,#6b7280));font-size:.78rem}.cf54-first-value footer .text-btn{white-space:nowrap}
.cf54-empty{display:grid;grid-template-columns:minmax(0,1fr) minmax(380px,1.25fr);align-items:center;gap:24px}.cf54-start-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.cf54-start-grid button{appearance:none;text-align:left;border:1px solid var(--pulso-line,var(--border,#e5e7eb));border-radius:18px;padding:16px;background:var(--pulso-surface,var(--surface,var(--panel,#fff)));color:var(--pulso-ink,var(--ink,var(--text,#222)));cursor:pointer;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}.cf54-start-grid button:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--primary,#8b5cf6) 45%,var(--pulso-line,var(--border,#e5e7eb)));box-shadow:0 12px 24px rgba(38,20,78,.08)}.cf54-start-grid button>span{display:grid;width:36px;height:36px;place-items:center;margin-bottom:10px;border-radius:12px;background:color-mix(in srgb,var(--primary,#8b5cf6) 10%,transparent);font-size:1.1rem}.cf54-start-grid button>b{display:block;margin-bottom:5px}.cf54-start-grid button>small{display:block;color:var(--pulso-muted,var(--muted,#6b7280));line-height:1.4}
@media(max-width:980px){.cf54-actions{grid-template-columns:1fr 1fr}.cf54-actions article.is-primary{grid-column:1/-1}.cf54-empty{grid-template-columns:1fr}.cf54-start-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:680px){.cf54-first-value{margin:14px 0;padding:17px;border-radius:20px}.cf54-actions,.cf54-start-grid{grid-template-columns:1fr}.cf54-actions article.is-primary{grid-column:auto}.cf54-first-value footer{align-items:flex-start;flex-direction:column}.cf54-head h2,.cf54-copy h2{font-size:1.35rem}.cf54-start-grid button{padding:14px}.cf54-actions article{padding:14px}.cf54-actions article .btn{width:100%;justify-content:center}}


/* CF54 — compatibilidade visual com o tema Pulso */
html[data-product-ux="pulso"] .cf54-first-value{
  color:var(--pulso-ink);
  background:linear-gradient(135deg,color-mix(in srgb,var(--pulso-lime) 7%,var(--pulso-surface)),var(--pulso-surface) 62%);
  border-color:color-mix(in srgb,var(--pulso-lime) 24%,var(--pulso-line));
  box-shadow:var(--pulso-shadow);
}
html[data-theme="dark"][data-product-ux="pulso"] .cf54-first-value{
  background:linear-gradient(145deg,#121827,#0f1522);
  border-color:#2c3650;
}
html[data-theme="dark"][data-product-ux="pulso"] .cf54-start-grid button,
html[data-theme="dark"][data-product-ux="pulso"] .cf54-actions article{
  background:#171f30;
  border-color:#2d3850;
  color:#f7f8fc;
}
html[data-theme="dark"][data-product-ux="pulso"] .cf54-copy p,
html[data-theme="dark"][data-product-ux="pulso"] .cf54-head p,
html[data-theme="dark"][data-product-ux="pulso"] .cf54-start-grid button>small,
html[data-theme="dark"][data-product-ux="pulso"] .cf54-actions article p,
html[data-theme="dark"][data-product-ux="pulso"] .cf54-actions article small{
  color:#aab3c6;
}
