/* Site-wide palettes. Section backgrounds stay on one plane; controls use
   neighbouring greys for hierarchy. */
html[data-theme="dark"] {
  color-scheme: dark;
  --theme-bg: #000;
  --theme-accent: #0879ed;
  --theme-surface: #252525;
  --theme-raised: #2d2d2d;
  --theme-ink: #f5f5f5;
  --theme-muted: #b7b7b7;
  --theme-line: #545454;
  --paper: var(--theme-bg);
  --paper-light: var(--theme-bg);
  --ink: var(--theme-ink);
  --muted: var(--theme-muted);
  --line: var(--theme-line);
  --forest: #363636;
  --forest-dark: var(--theme-bg);
  --lime: #dfdfdf;
}
html[data-theme="light"] {
  color-scheme: light;
  --theme-bg: #f5f5f5;
  --theme-accent: #0069e8;
  --theme-surface: #fff;
  --theme-raised: #eeeeee;
  --theme-ink: #292929;
  --theme-muted: #646464;
  --theme-line: #cdcdcd;
  --paper: var(--theme-bg);
  --paper-light: var(--theme-bg);
  --ink: var(--theme-ink);
  --muted: var(--theme-muted);
  --line: var(--theme-line);
  --forest: #363636;
  --forest-dark: var(--theme-bg);
  --lime: #595959;
}
html { --page-gutter: clamp(24px, 4.1vw, 74px); --page-end-gutter: calc(var(--page-gutter) + 7px); background: var(--theme-bg); }
body { background: var(--theme-bg); color: var(--theme-ink); }
html[data-theme] .site-header { padding-inline: var(--page-gutter); }
html[data-theme] :is(.intro-band, .section, .contact-section, .site-footer) { padding-left: var(--page-gutter); padding-right: var(--page-end-gutter); }
html[data-theme] .project-map-section { --map-gutter: var(--page-gutter); padding-right: var(--page-end-gutter); }
html[data-theme] .explorer { margin-left: calc(-1 * var(--page-gutter)); margin-right: calc(-1 * var(--page-end-gutter)); }
html[data-theme] :is(.explorer-heading, .explorer-panels) { padding-left: var(--page-gutter); padding-right: var(--page-end-gutter); }
html[data-theme] :focus-visible { outline-color: var(--theme-ink) !important; }
html[data-theme="light"] .hero :focus-visible { outline-color: #fff !important; }
html[data-theme] :is(.site-header, .site-header.is-scrolled, .site-header .site-nav, .affiliations, .intro-band, .work-section, .project-map-section, .approach-section, .reviews-section, .contact-section, .explorer, .site-footer, .site-footer .footer-bottom) {
  background: var(--theme-bg);
  color: var(--theme-ink);
}
html[data-theme] .hero { background-color: var(--theme-bg); }
html[data-theme="dark"] .hero h1 em { color: #f5f5f5; }
html[data-theme="dark"] .hero .button-dark { background: #f2f2f2; color: #1c1c1c; }
html[data-theme="dark"] .hero .button-dark:hover { background: #fff; }
html[data-theme="dark"] .button-cream { color: #000; }
html[data-theme="dark"] .hero :is(button, a):focus-visible { outline-color: #fff; }
html[data-theme] .site-header, html[data-theme] .site-header.is-scrolled { border-color: var(--theme-line); box-shadow: none; }
html[data-theme] .site-header .site-nav { box-shadow: none; border: 1px solid var(--theme-line); border-top: 0; }
.header-actions { display: flex; align-items: center; gap: 8px; flex: none; }
.theme-toggle { display: grid; place-items: center; width: 44px; height: 44px; padding: 9px; border: 1px solid transparent; background: transparent; color: var(--theme-ink); cursor: pointer; transition: border-color .2s, background .2s; }
.theme-toggle:hover { border-color: var(--theme-line); background: var(--theme-surface); }
.theme-toggle:focus-visible, .site-header .menu-toggle:focus-visible { outline: 2px solid var(--theme-ink); outline-offset: 3px; }
.theme-icon { width: 20px; height: 20px; }
html[data-theme="dark"] .theme-icon-moon, html[data-theme="light"] .theme-icon-sun { display: none; }
html[data-theme="dark"] .logo-link img { filter: brightness(0) invert(1); }
html[data-theme="light"] .logo-link img { filter: none; }
html[data-theme] .site-header .menu-toggle span { background: var(--theme-ink); }
html[data-theme="dark"] .site-nav>a:not(.nav-contact):hover, html[data-theme="dark"] .site-footer .footer-bottom a:hover { color: #fff; }
html[data-theme="dark"] .nav-contact:hover { background: #f5f5f5; color: #1c1c1c; }

html[data-theme] :is(.section-lead, .project-meta small, .review-grid figcaption span, .contact-top span, .contact-bottom p, .footer-top p) { color: var(--theme-muted); }
html[data-theme="dark"] :is(.intro-symbol, .section h2 em, .contact-section h2 em, .approach-section h2 em, .quote-mark, .approach-steps>div>span) { color: #d3d3d3; }
html[data-theme="dark"] :is(.eyebrow.light, .approach-main>p:not(.eyebrow), .approach-steps p) { color: var(--theme-muted); }
html[data-theme="dark"] .approach-steps>div { border-color: var(--theme-line); }
html[data-theme="dark"] :is(.review-grid figure, .project-dialog) { background: var(--theme-surface); color: var(--theme-ink); }
html[data-theme="dark"] .review-grid figcaption { border-color: var(--theme-line); }
html[data-theme="dark"] .review-portrait { background: var(--theme-raised); }
html[data-theme="dark"] .review-grid figcaption .review-website, html[data-theme="dark"] .reviews-count { color: var(--theme-muted); }
html[data-theme="dark"] .reviews-arrows button { border-color: var(--theme-line); color: var(--theme-ink); }
html[data-theme="dark"] .reviews-arrows button:hover:not(:disabled) { background: #e5e5e5; border-color: #e5e5e5; color: #1c1c1c; }
html[data-theme="dark"] .circle-arrow { border-color: var(--theme-line); }
html[data-theme="dark"] .project-card:hover .circle-arrow { background: var(--theme-raised); }
html[data-theme="dark"] .contact-bottom { border-color: var(--theme-line); }
html[data-theme="dark"] .dialog-close { background: var(--theme-raised); color: var(--theme-ink); }
html[data-theme="dark"] .project-dialog::backdrop { background: #000b; }

html[data-theme="dark"] .affiliations-viewport::before { background: linear-gradient(90deg, var(--theme-bg), transparent); }
html[data-theme="dark"] .affiliations-viewport::after { background: linear-gradient(270deg, var(--theme-bg), transparent); }
html[data-theme="light"] .affiliations-viewport::before { background: linear-gradient(90deg, #f5f5f5, transparent); }
html[data-theme="light"] .affiliations-viewport::after { background: linear-gradient(270deg, #f5f5f5, transparent); }
html[data-theme="dark"] .affiliation-link:focus-visible { outline-color: #f5f5f5; }
html[data-theme="dark"] .affiliation-logo img { filter: brightness(0) invert(1); }
html[data-theme="dark"] .affiliation-logo--rayon img, html[data-theme="dark"] .affiliation-logo--addwork img { filter: url(#affiliation-dark-knockout) brightness(0) invert(1); }
html[data-theme="dark"] .affiliation-logo--higgsfield img { filter: grayscale(1) invert(1); mix-blend-mode: screen; }

/* Explorer selections use neutral surfaces and clear outlines. */
html[data-theme] :is(.explorer, .explorer-stage-bar, .explorer-estimate, .explorer-choice-card) { background: var(--theme-bg); color: var(--theme-ink); }
html[data-theme="light"] .explorer-choice-art svg { filter: grayscale(1) invert(1); }
html[data-theme] .explorer-stage-bar { border-color: var(--theme-line); }
html[data-theme] .explorer-estimate { border-color: var(--theme-line); }
html[data-theme] :is(.explorer-options button, .explorer-pills button, .explorer-area-presets button, .explorer-service-list button) { transition: border-color .2s ease, transform .2s ease; }
html[data-theme="dark"] :is(.explorer-heading .eyebrow, .explorer-heading-actions p, .explorer-kicker, .explorer-intro, .explorer-help, .explorer-detection, .explorer-estimate-meta, .explorer-small, .explorer-estimate details, .explorer-site-note, .explorer-plans-note) { color: var(--theme-muted); }
html[data-theme="dark"] .explorer-steps button { color: #b7b7b7; }
html[data-theme="dark"] .explorer-steps button:disabled { color: #7b7b7b; }
html[data-theme="dark"] :is(.explorer-steps button:not([aria-selected="true"]):not(:disabled):hover, .explorer-stage-bar .explorer-learn-more, .explorer-start-over, .explorer-stage-bar .explorer-learn-more:hover, .explorer-start-over:hover) { color: var(--theme-ink); }
html[data-theme="dark"] .explorer-steps button[aria-selected="true"] { color: #0879ed; border-color: transparent; border-bottom-color: #0879ed; }
html[data-theme="dark"] :is(.explorer-stage-bar .explorer-learn-more:hover, .explorer-start-over:hover) { border-bottom-color: #f5f5f5; }
html[data-theme="dark"] :is(.explorer-stage-bar .explorer-learn-more, .explorer-start-over) { border-left-color: var(--theme-line); }
html[data-theme="dark"] :is(.explorer-options button, .explorer-pills button, .explorer-area-presets button, .explorer-service-list button, .explorer-brand-card, .explorer-brand-views figure, .explorer-budget-tabs, .explorer-field input, .explorer-field select, .explorer-field textarea) { background: var(--theme-surface); border-color: var(--theme-line); color: var(--theme-ink); }
html[data-theme="dark"] :is(.explorer-options button.is-selected, .explorer-pills button.is-selected, .explorer-area-presets button.is-selected, .explorer-service-list button.is-selected, .explorer-budget-tabs button[aria-selected="true"]) { background: var(--theme-raised); border-color: #f5f5f5; color: #fff; }
html[data-theme="dark"] :is(.explorer-options button:not(:disabled):hover, .explorer-pills button:not(:disabled):hover, .explorer-area-presets button:not(:disabled):hover, .explorer-service-list button:not(:disabled):hover) { border-color: #e4e4e4; }
html[data-theme="dark"] :is(.explorer-options button span, .explorer-area-presets button small, .explorer-service-list span, .explorer-service-list strong em, .explorer-brand-details>p:not(.explorer-kicker), .explorer-unique-service-note p:not(.explorer-kicker)) { color: var(--theme-muted); }
html[data-theme="dark"] :is(.explorer-options button .explorer-finish-rate, .explorer-options button .explorer-choice-note, .explorer-options button .explorer-option-delta, .explorer-options-levels button .explorer-level-minimum, .explorer-area-suggestion, .explorer-area-fit-message, .explorer-area-presets button .explorer-area-fit, .explorer-service-list button .explorer-service-delta, .explorer-service-list small, .explorer-input-unit, .explorer-input-prefix) { color: #e1e1e1; }
html[data-theme="dark"] :is(.explorer-options button .explorer-option-delta, .explorer-service-list button .explorer-service-delta) { border-color: var(--theme-line); background: transparent; }
html[data-theme="dark"] :is(.explorer-options button .explorer-option-delta.is-increase, .explorer-options button .explorer-option-delta.is-decrease, .explorer-service-list button .explorer-service-delta.is-increase, .explorer-service-list button .explorer-service-delta.is-decrease) { border-color: #8c8c8c; background: #363636; color: #f5f5f5; }
html[data-theme="dark"] :is(.explorer-options-levels button.is-area-unavailable, .explorer-area-presets button:disabled, .explorer-area-presets button.is-selected:disabled) { background: #222222; border-color: #3c3c3c; color: #8d8d8d; }
html[data-theme="dark"] :is(.explorer-options-levels button.is-area-unavailable span, .explorer-area-presets button:disabled span, .explorer-area-presets button:disabled small) { color: #8d8d8d; }
html[data-theme="dark"] .explorer-field { color: #e1e1e1; }
html[data-theme="dark"] .explorer-field input::placeholder, html[data-theme="dark"] .explorer-field textarea::placeholder { color: #919191; opacity: 1; }
html[data-theme="dark"] .explorer-budget-tabs button { color: var(--theme-muted); }
html[data-theme="dark"] .explorer-budget-tabs button+button { border-left-color: var(--theme-line); }
html[data-theme="dark"] .explorer-area-entry button { border-color: #a1a1a1; background: var(--theme-raised); color: var(--theme-ink); }
html[data-theme="dark"] .explorer-area-entry button:not(:disabled):hover { border-color: #fff; background: #3d3d3d; }
html[data-theme="dark"] :is(.explorer-site-note, .explorer-plans-note, .explorer-unique-service-note, .explorer-decision-result) { background: var(--theme-surface); border-left-color: #cbcbcb; }
html[data-theme="dark"] :is(.explorer-scope-fields, .explorer-navigation, .explorer-brief-actions, .explorer-summary, .explorer-summary>div, .explorer-brand-preview>span, .explorer-brand-views) { border-color: var(--theme-line); }
html[data-theme="dark"] .explorer-brand-views { background: var(--theme-line); }
html[data-theme="dark"] .explorer-brand-preview>span, html[data-theme="dark"] .explorer-brand-actions button, html[data-theme="dark"] .explorer-brand-preview { color: var(--theme-ink); }
html[data-theme="dark"] .explorer-brand-preview:hover>span { background: var(--theme-raised); }
html[data-theme="dark"] .explorer-brand-actions button { border-color: var(--theme-line); background: var(--theme-surface); }
html[data-theme="dark"] .explorer-brand-actions button:first-child, html[data-theme="dark"] .explorer-brand-actions button.is-selected { border-color: #f5f5f5; background: #e6e6e6; color: #1c1c1c; }
html[data-theme="dark"] .explorer-brand-actions button:first-child.is-selected { box-shadow: inset 0 0 0 2px #1c1c1c; }
html[data-theme="dark"] .explorer-service-list button::before { border-color: #b7b7b7; }
html[data-theme="dark"] .explorer-service-list button.is-selected::before { border-color: #f5f5f5; background: #f5f5f5; box-shadow: inset 0 0 0 3px #2d2d2d; }
html[data-theme="dark"] .explorer-estimate summary { color: var(--theme-ink); }
html[data-theme="dark"] :is(.explorer-ledger-row, .explorer-cost-effects, .explorer-fit, .explorer-fees, .explorer-total-components>div, .explorer-total-exclusions, #explorer-fee-lines>div, .explorer-info-header, .explorer-info-section, .explorer-brand-dialog-switch, .explorer-offer-detail) { border-color: var(--theme-line); }
html[data-theme="dark"] :is(.explorer-ledger-value, .explorer-ledger-row .explorer-ledger-value, .explorer-ledger-row .explorer-range, .explorer-ledger-row .explorer-fit, .explorer-unit-rate, #explorer-total-range, .explorer-total-components strong, #explorer-fee-lines>div strong) { color: var(--theme-ink); }
html[data-theme="dark"] :is(.explorer-estimate-caveat, .explorer-ledger-row .explorer-quote-note, #explorer-effect-lines p, .explorer-budget-legend, .explorer-fees-cue, #explorer-fee-lines>div, .explorer-total-components>div, .explorer-total-caption, .explorer-total-exclusions, .explorer-summary span, .explorer-decision-result p:last-child, .explorer-next-step>p:not(.explorer-kicker):not(.explorer-offer-price):not(.explorer-estimate-meta):not(.explorer-small), .explorer-offer-detail p, .explorer-offer-detail span) { color: var(--theme-muted); }
html[data-theme="dark"] .explorer-planning-total { border-color: var(--theme-line); background: var(--theme-surface); }
html[data-theme="dark"] .explorer-next-step { background: var(--theme-bg); }
html[data-theme="dark"] .explorer-budget-track { background: #595959; }
html[data-theme="dark"] :is(#explorer-budget-band, .explorer-legend-range) { background: #fff; }
html[data-theme="dark"] :is(#explorer-budget-marker, .explorer-legend-budget) { background: #adadad; }
html[data-theme="dark"] :is(.explorer-info-dialog, .explorer-brand-dialog, .explorer-brand-dialog-frame) { background: var(--theme-bg); border-color: var(--theme-line); color: var(--theme-ink); }
html[data-theme="dark"] :is(.explorer-info-header button, .explorer-brand-dialog-header button) { border-color: var(--theme-line); color: var(--theme-ink); }
html[data-theme="dark"] :is(.explorer-info-header button:hover, .explorer-brand-dialog-header button:hover) { background: var(--theme-raised); }
html[data-theme="dark"] :is(.explorer-info-intro, .explorer-info-detail, .explorer-info-section>.explorer-estimate-meta, .explorer-info-section>.explorer-quote-note, .explorer-info-dialog #explorer-total-note, .explorer-info-dialog details p, .explorer-info-dialog [data-home-pricing], .explorer-brand-dialog>p) { color: var(--theme-muted); }
html[data-theme="dark"] :is(.explorer-info-dialog details>summary, .explorer-info-dialog .explorer-fees>summary, .explorer-brand-dialog-switch button[aria-pressed="true"]) { color: var(--theme-ink); }
html[data-theme="dark"] .explorer-brand-dialog-switch button { color: var(--theme-muted); }
html[data-theme="dark"] .explorer-brand-dialog-switch button[aria-pressed="true"] { border-color: #f5f5f5; }
html[data-theme="dark"] .explorer-recommendation-tray { border-color: #595959; background: var(--theme-bg); color: var(--theme-ink); box-shadow: 0 4px 0 var(--theme-bg), 0 -14px 42px #0004; }
html[data-theme="dark"] .explorer-recommendation-card { border-color: var(--theme-line); background: var(--theme-surface); }
html[data-theme="dark"] :is(.explorer-recommendation-eyebrow, .explorer-recommendation-card>strong, .explorer-recommendation-impact) { color: var(--theme-muted); }
html[data-theme="dark"] .explorer-recommendation-card p { color: var(--theme-ink); }
html[data-theme="dark"] .explorer-recommendation-card button { border-color: #f5f5f5; background: #f5f5f5; color: #1c1c1c; }
html[data-theme="dark"] .explorer-recommendation-card button:hover { background: #dadada; }
html[data-theme="dark"] .explorer-choice-art :is(.scene-shore-water, .scene-road-surface) { fill: #2c2c2c; }
html[data-theme="dark"] .explorer-choice-art :is(.scene-shore-wave, .scene-shore-line, .scene-dirt-tracks) { stroke: #9d9d9d; }
html[data-theme="dark"] .explorer-choice-card[data-project="home"][data-setting="Country"] .scene-road-surface { fill: #333333; }
html[data-theme="dark"] .explorer-choice-card[data-project="home"][data-setting="Country"] .scene-road-edge { stroke: #9d9d9d; }

/* Preserve the plan's black line work as an illustration on a paper panel. */
html[data-theme="dark"] :is(.explorer-brand-plan-preview, .explorer-brand-dialog-frame.is-plan) { background: #ededed; }
html[data-theme="dark"] :is(.explorer-brand-plan-preview img, .explorer-brand-dialog-frame.is-plan img) { mix-blend-mode: multiply; }

html[data-theme="dark"] .site-footer { border-top-color: rgba(255,255,255,.17); }
html[data-theme="dark"] .site-footer .footer-bottom { background: var(--theme-bg); border-color: rgba(255,255,255,.17); color: var(--theme-muted); }
html[data-theme="light"] .site-footer { border-top-color: rgba(41, 41, 41,.17); }
html[data-theme="light"] .site-footer .footer-bottom { background: var(--theme-bg); border-color: rgba(41, 41, 41,.17); color: var(--theme-muted); }
html[data-theme="light"] .footer-logo img { filter: brightness(0); }
html[data-theme="light"] .site-footer .footer-bottom a:hover { color: var(--theme-ink); }

/* The map is always usable; light mode brightens its canvas and markers. */
html[data-theme="dark"] .project-map-section {
  --map-bg: var(--theme-bg);
  --map-ink: var(--theme-ink);
  --map-muted: var(--theme-muted);
  --map-line: #545454;
}
html[data-theme="dark"] :is(.project-map-eyebrow, .project-map-detail-kicker, .project-map-detail-place, .project-map-detail-desc, .project-map-source, .project-map-result.is-selected strong, .project-map-result>span:last-child) { color: var(--theme-muted); }
html[data-theme="dark"] .project-map-stage { background: var(--theme-bg); border-color: transparent; }
html[data-theme="dark"] .project-map-land { fill: #3f3f3f; stroke: #7c7c7c; }
html[data-theme="dark"] .project-map-pin.is-cluster:not([data-type="Mixed"]) { background: #202020; border-color: var(--pin-color); color: #fff; }
html[data-theme="dark"] .project-map-pin.is-cluster:hover { background: #595959; }
html[data-theme="dark"] .project-map-pin.is-cluster[data-type="Mixed"]:hover { background: radial-gradient(circle, #383838 0 57%, transparent 59%), var(--pin-mix); }
html[data-theme="dark"] .project-map-controls button { background: rgba(45, 45, 45, .78); color: #fff; }
html[data-theme="dark"] .project-map-controls button:hover { background: #494949; }
html[data-theme="dark"] .project-map-detail { background: #252525; }
html[data-theme="dark"] .project-map-result.is-selected strong, html[data-theme="dark"] .project-map-detail-items button:hover { color: #fff; }

html[data-theme="light"] .project-map-section {
  --map-bg: var(--theme-bg);
  --map-ink: var(--theme-ink);
  --map-muted: var(--theme-muted);
  --map-line: var(--theme-line);
  --map-pulse-ring: rgba(41, 41, 41, .65);
  --map-pulse-shadow: rgba(41, 41, 41, .16);
  --map-pin-neutral: #363636;
  --map-pin-custom-homes: #727272;
  --map-pin-branded-homes: #686868;
  --map-pin-unique-projects: #666666;
  --map-pin-branding-projects: #626262;
  --map-pin-systems: #376c9b;
}
html[data-theme="light"] .project-map-eyebrow, html[data-theme="light"] .project-map-source { color: var(--theme-muted); }
html[data-theme="light"] .project-map-summary { background: var(--theme-surface); border-color: var(--theme-line); }
html[data-theme="light"] .project-map-summary-row { border-color: var(--theme-line); }
html[data-theme="light"] .project-map-stage { background: var(--theme-bg); border-color: var(--theme-line); }
html[data-theme="light"] :is(.project-map-grid, .project-map-grid-minor) { stroke: rgba(94, 94, 94, .17); }
html[data-theme="light"] .project-map-land { fill: #c6c6c6; stroke: #868686; }
html[data-theme="light"] .project-map-pin.is-cluster:not([data-type="Mixed"]) { background: #fff; border-color: var(--pin-color); color: #292929; }
html[data-theme="light"] .project-map-pin.is-cluster[data-type="Mixed"]:hover { background: radial-gradient(circle, #383838 0 57%, transparent 59%), var(--pin-mix); }
html[data-theme="light"] .project-map-pin:not(.is-cluster)::before { box-shadow: 0 0 0 1px #363636; }
html[data-theme="light"] .project-map-pin.is-ambient-cluster::before { box-shadow: 0 0 0 1px #363636; }
html[data-theme="light"] .project-map-pin[data-type="All"]::after { border-color: #363636; box-shadow: 0 0 7px rgba(41, 41, 41, .16); }
html[data-theme="light"] .project-map-pin:focus-visible { outline-color: #363636; }
html[data-theme="light"] .project-map-controls button { background: rgba(255, 255, 255, .82); color: #292929; }
html[data-theme="light"] .project-map-controls button:hover { background: #e4e4e4; }
html[data-theme="light"] .project-map-detail { background: #fff; color: var(--theme-ink); }
html[data-theme="light"] :is(.project-map-detail-kicker, .project-map-detail-place, .project-map-detail-desc, .project-map-detail-items button, .project-map-result.is-selected strong, .project-map-result>span:last-child) { color: var(--theme-ink); }
html[data-theme="light"] .project-map-more { border-color: var(--theme-line); color: var(--theme-ink); }
html[data-theme="light"] .project-map-more:hover { background: #363636; color: #fff; }

html[data-theme="light"] .approach-section, html[data-theme="light"] .contact-section { color: var(--theme-ink); }
html[data-theme="light"] :is(.approach-main>p:not(.eyebrow), .approach-steps p, .contact-top span, .contact-bottom p) { color: var(--theme-muted); }
html[data-theme="light"] :is(.eyebrow.light, .approach-steps>div>span) { color: #636363; }
html[data-theme="light"] :is(.approach-steps>div, .contact-bottom) { border-color: var(--theme-line); }
html[data-theme="light"] :is(.review-grid figure, .project-dialog) { background: var(--theme-surface); color: var(--theme-ink); }
html[data-theme="light"] .review-portrait { background: var(--theme-raised); }
html[data-theme="light"] .explorer-options button, html[data-theme="light"] .explorer-pills button, html[data-theme="light"] .explorer-area-presets button, html[data-theme="light"] .explorer-service-list button { background: var(--theme-surface); }
html[data-theme="light"] :is(.explorer-estimate, .explorer-choice-card, .explorer-stage-bar, .explorer-info-dialog, .explorer-brand-dialog, .explorer-brand-dialog-frame) { background: var(--theme-bg); }
html[data-theme="light"] .explorer-next-step { background: var(--theme-bg); }
html[data-theme="light"] .explorer-recommendation-tray { background: var(--theme-bg); color: var(--theme-ink); border-color: var(--theme-line); box-shadow: 0 4px 0 var(--theme-bg), 0 -14px 42px #0002; }
html[data-theme="light"] .explorer-recommendation-head { border-color: var(--theme-line); }
html[data-theme="light"] .explorer-recommendation-card { background: var(--theme-surface); border-color: var(--theme-line); }
html[data-theme="light"] :is(.explorer-recommendation-eyebrow, .explorer-recommendation-card>strong, .explorer-recommendation-impact) { color: #636363; }
html[data-theme="light"] .explorer-recommendation-card p { color: var(--theme-ink); }
html[data-theme="light"] .explorer-recommendation-card button { background: #363636; border-color: #363636; color: #fff; }
html[data-theme="light"] .explorer-recommendation-card button:hover { background: #535353; }
@media (max-width: 760px) {
  .header-actions { gap: 1px; }
  .theme-toggle { width: 40px; height: 40px; padding: 8px; }
}
@media (max-width: 400px) {
  html { --page-gutter: 16px; }
  .site-header .logo-link { width: min(58vw, 220px); }
}
@media (prefers-reduced-motion: reduce) {
  .theme-toggle { transition: none; }
}

/* Let Explorer choices sit on the page itself; reserve fills for primary actions. */
html[data-theme] .explorer :is(
  .explorer-options button,
  .explorer-pills button,
  .explorer-area-presets button,
  .explorer-service-list button,
  .explorer-brand-actions button,
  .explorer-budget-tabs,
  .explorer-budget-tabs button,
  .explorer-options button .explorer-option-delta,
  .explorer-service-list button .explorer-service-delta
) { background: transparent; }
html[data-theme] .explorer .explorer-brand-actions button { color: var(--theme-ink); box-shadow: none; }
html[data-theme] .explorer .explorer-brand-actions button.is-selected { border-color: var(--theme-ink); }
html[data-theme] .explorer .explorer-budget-tabs button[aria-selected="true"] {
  color: var(--theme-ink);
  box-shadow: inset 0 -2px 0 currentColor;
}

/* Quiet structural dividers without weakening choice or action outlines. */
html[data-theme="dark"] #design-explorer { --explorer-divider: rgba(255, 255, 255, .16); }
html[data-theme="light"] #design-explorer { --explorer-divider: rgba(41, 41, 41, .16); }
html[data-theme] #design-explorer :is(
  .explorer-stage-bar,
  .explorer-estimate,
  .explorer-scope-fields,
  .explorer-navigation,
  .explorer-brief-actions,
  .explorer-ledger-row,
  .explorer-cost-effects,
  .explorer-fit,
  .explorer-fees,
  .explorer-total-components > div,
  .explorer-total-exclusions,
  .explorer-summary,
  .explorer-summary > div,
  .explorer-info-header,
  .explorer-info-section,
  .explorer-brand-dialog-switch,
  .explorer-offer-detail,
  .explorer-recommendation-head,
  #explorer-fee-lines > div
) { border-color: var(--explorer-divider); }
html[data-theme] #design-explorer :is(.explorer-stage-bar .explorer-learn-more, .explorer-start-over) {
  border-left-color: var(--explorer-divider);
}

/* Blue is the only chromatic interface accent; both themes share neutral states. */
html[data-theme] .explorer-steps button[aria-selected="true"] {
  color: var(--theme-accent);
  border-bottom-color: var(--theme-accent);
}
html[data-theme] .explorer :is(.explorer-error, .explorer-budget-range-error, .explorer-area-fit-message.is-over-budget) { color: var(--theme-ink); }
html[data-theme] .explorer :is(.explorer-site-note, .explorer-plans-note, .explorer-unique-service-note, .explorer-decision-result) { color: var(--theme-muted); }