/* Free ACOS calculator — shared by /tools/amazon-acos-calculator and /embed/amazon-acos-calculator.
   Site tokens with fallbacks: the embed page loads no styles.css. */
.ac { font-family: inherit; color: var(--ink, #0f172a); }
.ac-groups { display: grid; gap: 16px; }
.ac-group { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 12px; border: 1px solid var(--line, #e2e8f0); border-radius: 10px; padding: 14px 16px 6px; margin: 0; min-width: 0; }
.ac-group legend { font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--muted, #64748b); padding: 0 6px; }
.ac-field { margin-bottom: 12px; min-width: 0; }
.ac-span { grid-column: 1 / -1; }
.ac-field label { display: block; font-size: 13px; font-weight: 700; margin-bottom: 6px; }
.ac-field input { width: 100%; box-sizing: border-box; background: var(--bg, #fff); color: var(--ink, #0f172a); border: 1px solid var(--line, #cbd5e1); border-radius: 8px; padding: 10px 12px; font-size: 16px; font-family: inherit; }
.ac-field input:focus { outline: none; border-color: var(--accent, #0e7be5); }
.ac-hint { font-size: 12.5px; color: var(--muted, #64748b); margin: 0 0 10px; line-height: 1.5; }
.ac-hint a { color: var(--accent, #0e7be5); }
.ac-err { font-size: 12.5px; color: var(--err-ink, #b91c1c); margin: 6px 0 0; }
.ac-results { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 16px; }
.ac-tile { background: var(--bg, #fff); border: 1px solid var(--line, #e2e8f0); border-radius: 10px; padding: 12px 14px; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ac-tile-label { font-size: 12px; font-weight: 700; color: var(--muted, #64748b); }
.ac-tile-val { font-size: 24px; font-weight: 800; letter-spacing: -0.01em; font-variant-numeric: tabular-nums; }
.ac-tile-note { font-size: 11.5px; color: var(--muted, #64748b); line-height: 1.4; }
.ac-verdict { grid-column: 1 / -1; margin: 0; font-size: 14px; font-weight: 700; border-radius: 8px; padding: 10px 12px; background: var(--bg-soft, #f1f5f9); }
.ac-verdict.ac-good { color: var(--ok-ink, #166534); background: var(--ok-bg, #dcfce7); }
.ac-verdict.ac-bad { color: var(--err-ink, #b91c1c); background: var(--err-bg, #fee2e2); }
.ac-powered { font-size: 12px; color: var(--muted, #64748b); margin: 12px 0 0; text-align: right; }
.ac-powered a { color: inherit; }
@media (min-width: 560px) { .ac-results { grid-template-columns: repeat(4, minmax(0, 1fr)); } }