/* Sale countdown banner - one horizontal strip that wraps on phones. */
.scb-bar {
    display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px;
    padding: 12px 14px; border-radius: 10px; background: var(--e-surface); border: 1px solid var(--e-line);
    border-left: 4px solid var(--e-accent);
}
.scb-text { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; min-width: 0; }
.scb-head { margin: 0; font-weight: 650; font-size: 1.02em; overflow-wrap: anywhere; }
.scb-clock { display: flex; gap: 6px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.scb-part { display: inline-flex; align-items: baseline; }
.scb-n { font-size: 1.45em; font-weight: 750; letter-spacing: -.01em; }
.scb-u { font-size: .8em; color: var(--e-ink-3); margin-left: 1px; }
.scb-ended { margin: 0; font-weight: 600; color: var(--e-ink-2); }
.scb-cta { text-decoration: none; display: inline-flex; align-items: center; white-space: nowrap; }
.scb-cta:focus-visible { outline: 2px solid var(--e-focus); outline-offset: 2px; }
@media (max-width: 400px) {
    .scb-cta { width: 100%; justify-content: center; }
}
html[data-compact="1"] .scb-bar { padding: 8px 10px; }
html[data-compact="1"] .scb-n { font-size: 1.2em; }
