/* CarSussed colour system. This is the single palette source for all page bundles.
 * Light reading surfaces; graphite for brand anchors; green for actions/positive
 * results; amber for investigation; red for failures and serious warnings.
 * Keep colour literals here. The existing layout and interaction styles use tokens.
 */
:root {
  color-scheme: light;
  --graphite: #1c2225;
  --graphite-raised: #272f32;
  --ink: #202824;
  --page-bg: #f7f8f6;
  --surface: #ffffff;
  --surface-subtle: #eef1ed;
  --text: var(--ink);
  --muted: #59665f;
  --line: #d4dcd5;
  --line-strong: #8b9a90;
  --primary: #217d4b;
  --primary-hover: #166d43;
  --on-primary: #ffffff;
  --accent: #166d43;
  --accent-soft: #edf4ee;
  --accent-line: #a2c4ae;
  --positive: #187849;
  --positive-soft: #edf6ef;
  --positive-line: #a8cbb4;
  --caution: #8a5b12;
  --caution-soft: #faf3e6;
  --caution-line: #dbc290;
  --negative: #ad3838;
  --negative-soft: #fcf0ef;
  --negative-line: #dfb4af;
  --focus: #217d4b;
  --focus-soft: #d4e9da;
  --overlay: rgba(28,34,37,.64);
  --shadow: 0 12px 30px rgba(28,34,37,.07);
  /* Compatibility aliases for existing components. */
  --bg: var(--page-bg);
  --bg2: var(--surface-subtle);
  --panel: var(--surface);
  --panel2: var(--surface-subtle);
  --lime: var(--accent);
  --green: var(--positive);
  --amber: var(--caution);
  --red: var(--negative);
  --blue: var(--muted);
  --white: var(--on-primary);
}

/* Deliberate dark surfaces, using the same semantic roles. */
.topbar, .hero-report-card, .price-card, .purchase-panel, .report-head,
.guide-cta, .mobile-unlock-bar, footer {
  color-scheme: dark;
  --page-bg: var(--graphite);
  --surface: var(--graphite);
  --surface-subtle: var(--graphite-raised);
  --text: #f6f8f6;
  --muted: #b8c4bd;
  --line: #414e46;
  --line-strong: #74877b;
  --accent: #71c794;
  --accent-soft: #293c30;
  --accent-line: #50775f;
  --positive: #71c794;
  --positive-soft: #293c30;
  --positive-line: #50775f;
  --caution: #e6b966;
  --caution-soft: #3d3526;
  --caution-line: #806b45;
  --negative: #ef9b93;
  --negative-soft: #422e2d;
  --negative-line: #88605b;
  --focus: #a2d9b6;
  --focus-soft: #415e4b;
  --bg: var(--page-bg);
  --bg2: var(--surface-subtle);
  --panel: var(--surface);
  --panel2: var(--surface-subtle);
  --lime: var(--accent);
  --green: var(--positive);
  --amber: var(--caution);
  --red: var(--negative);
  --blue: var(--muted);
  background: var(--surface);
  color: var(--text);
}

body, .guide-body { background: var(--page-bg); color: var(--text); }
.topbar { background: var(--graphite); border-bottom-color: var(--line); }
.brand, .footer-brand { color: var(--text); }
.primary, .brand-mark, .saved-count, .skip-link,
.promo-strip-kicker, .sale-badge, .action-step span {
  background: var(--primary);
  color: var(--on-primary);
  box-shadow: none;
}
.primary:hover { background: var(--primary-hover); filter: none; }
.primary:disabled { background: var(--primary); }
.primary span, .primary strong, .primary em { color: inherit; }
.free-mot-form input, .free-query-field input, .smart-search {
  color-scheme: light;
  background: var(--on-primary);
  color: var(--ink);
  border-color: var(--line-strong);
}
.smart-search input { color: var(--ink); }
input::placeholder { color: #59665f; opacity: 1; }
.field input::placeholder { color: var(--muted); }
.free-mot-form input:focus, .free-query-field input:focus {
  border-color: var(--focus);
}
.secondary:hover, .ghost:hover { border-color: var(--line-strong); }
#lockedMotStatus[data-status="positive"] { color: var(--positive); }
#lockedMotStatus[data-status="caution"] { color: var(--caution); }
#lockedMotStatus[data-status="negative"] { color: var(--negative); }
.attention-hook:not(.no-flags) { background: var(--caution-soft); border-color: var(--caution-line); }
.attention-hook:not(.no-flags) .check-point-list b { color: var(--caution); background: var(--caution-soft); }
.consent-row input { accent-color: var(--primary); }
.modal::backdrop { background: var(--overlay); }
.tracking-banner { background: var(--surface); color: var(--text); border-color: var(--line-strong); }
.hero-free-mot, .locked-preview-head, .sample-callout, .guide-summary,
.locked-found-line, .locked-inline-offer, .free-mot-upsell,
.free-upgrade, .free-mot-explainer, .guide-article .worked-example {
  background: var(--surface);
  border-color: var(--line);
}
.hero-report-card, .premium-card { background: var(--surface); }
.hero-free-mot, .hero-report-card, .price-card { box-shadow: var(--shadow); }
.car-glow { background: transparent; }
.car-line { stroke: var(--line); }
.live-chip, .free-badge, .sample-label {
  background: var(--surface-subtle);
  color: var(--text);
  border-color: var(--line);
}
.sample-notice { background: var(--surface-subtle); border-color: var(--line); }
.sample-notice strong, .sample-notice span,
.locked-label, .example-label, .sample-label { color: var(--muted)!important; }
.demo-verdict { background: var(--positive-soft); border-color: var(--positive-line); }
.demo-verdict span, .demo-score { color: var(--positive); }
.demo-footer i, .confidence i { background: var(--primary); }
.demo-footer>div, .confidence>div { background: var(--line); }
.status-card.ok { border-color: var(--positive-line); }
.status-card.warn { border-color: var(--caution-line); }
.status-card.bad { border-color: var(--negative-line); }
.status-positive { border-left-color: var(--positive); }
.status-check, .status-concern { border-left-color: var(--caution); }
.status-check .assessment-head>span, .status-concern .assessment-head>span {
  background: var(--caution-soft); color: var(--caution);
}
.status-critical { border-left-color: var(--negative); }
.status-critical .assessment-head>span { background: var(--negative-soft); color: var(--negative); }
.danger, .insight.flag .icon, .v-negotiate strong { color: var(--caution); }
.v-buy strong { color: var(--positive); }
.v-caution strong { color: var(--caution); }
.v-walk strong { color: var(--negative); }
.form-error { background: var(--negative-soft); color: var(--negative); border-color: var(--negative-line); }
.sample-verdict { background: var(--caution-soft); border-color: var(--caution-line); }
.checkout-limit, .legal-notice { border-left-color: var(--line-strong); }
.locked-ready-dot { box-shadow: none; }
.locked-placeholder i { background: var(--line-strong); }
.locked-benefit { border-color: var(--line); background: var(--surface-subtle); }
.purchase-panel { border-color: var(--line); }
.mobile-unlock-bar:not(.hidden) { background: var(--graphite); border-top-color: var(--line); box-shadow: var(--shadow); }
.price-card li, .footer-links a { color: var(--muted); }
footer { box-shadow: 0 0 0 100vmax var(--graphite); clip-path: inset(0 -100vmax); }

@media print {
  .report-head, .hero-report-card, .price-card, .purchase-panel, .guide-cta {
    color-scheme: light;
    --surface: #ffffff; --surface-subtle: #eef1ed; --text: #202824;
    --muted: #59665f; --line: #d4dcd5; --positive: #187849;
    --caution: #8a5b12; --negative: #ad3838;
    background: var(--surface)!important; color: var(--text)!important;
  }
}