/* Self-contained styles for the embeddable Profit-Safe CPC calculator. Kept in
   its own file so the /embed/* CSP can stay script-src 'self' / style-src
   'self' rather than allowing inline execution inside a third-party page. */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font: 400 14px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  color: #0b1625; background: #ffffff; -webkit-font-smoothing: antialiased;
}
.w { max-width: 560px; margin: 0 auto; padding: 18px; }
.w-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.w-head h1 { margin: 0; font-size: 16px; font-weight: 750; letter-spacing: -.02em; }
.w-head span { color: #667586; font-size: 11px; }
.w-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.w-field { display: flex; flex-direction: column; gap: 5px; }
.w-field label { color: #5e6b7b; font-size: 11px; font-weight: 650; }
.w-field input {
  width: 100%; padding: 9px 11px; border: 1px solid #dfe6ee; border-radius: 9px;
  font: inherit; font-size: 14px; color: #0b1625; background: #fbfcfe;
}
.w-field input:focus { outline: 2px solid #2377c6; outline-offset: 1px; border-color: #2377c6; }
.w-out { margin-top: 14px; border: 1px solid #dfe6ee; border-radius: 12px; overflow: hidden; }
.w-row { display: grid; grid-template-columns: 1.4fr 1fr; border-bottom: 1px solid #eef2f7; }
.w-row:last-child { border-bottom: 0; }
.w-row > dt { margin: 0; padding: 10px 13px; color: #5e6b7b; font-size: 12px; }
.w-row > dd { margin: 0; padding: 10px 13px; color: #0b1625; font-size: 14px; font-weight: 700; text-align: right; background: #f9fbfd; font-variant-numeric: tabular-nums; }
.w-row.is-primary > dt { color: #0b1625; font-weight: 650; }
.w-row.is-primary > dd { color: #12603f; background: #eefaf3; font-size: 16px; }
.w-note { margin: 12px 0 0; color: #7c8896; font-size: 11px; line-height: 1.5; }
.w-foot { margin-top: 14px; padding-top: 12px; border-top: 1px solid #eef2f7; display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.w-foot a { color: #1f6bb8; font-size: 12px; font-weight: 650; text-decoration: none; }
.w-foot a:hover, .w-foot a:focus { text-decoration: underline; }
.w-foot small { color: #98a3b1; font-size: 11px; }
@media (max-width: 460px) { .w-grid { grid-template-columns: 1fr; } }