/* Palette and readability polish. Load last; existing layout and motion hooks remain. */
:root {
  --paper: #F2F4F8;
  --white: #FAFBFE;
  --ink: #182943;
  --dark: #182943;
  --accent: #3159D9;
  --muted: #526078;
  --line: #D8DFEC;
  --wash: #E9EDF5;
  --blue-wash: #E8EEFC;
  --accent-soft: #E8EEFC;
  --accent-line: #B6C5EE;
  --accent-hover: #2447B7;
  --panel-shadow: 0 3px 0 #D9E0ED, 0 8px 22px #18294308, inset 0 2px 0 #FFF;
}

body { background: var(--paper); color: var(--ink); }
::selection { background: #D5DFF8; color: var(--ink); }
input, select, textarea { color: var(--ink); border-color: var(--line); }
input::placeholder, textarea::placeholder { color: var(--muted); opacity: 1; }
input[type="checkbox"], .account-check input { accent-color: var(--accent); }
.fdd-map-selected-label, .account-preview-label { letter-spacing: 0; }

/* Navigation and controls retain their dimensions with softer surface depth. */
.identity img, .footer-top img { display: block; height: auto; }
.account-form-mark { width: 64px; height: auto; }
@media (max-width: 800px) { .account-form-mark { width: 53px; height: auto; } }
.site-header { background: #FAFBFEED; border-color: #FFFFFFDC; }
.site-header.is-scrolled { background: #FAFBFEF5; border-color: var(--line); box-shadow: 0 8px 26px #1829430E; }
.main-nav, .hero-links a, .hero-links button { color: var(--ink); }
#saved-count { color: var(--ink); background: var(--wash); }
.btn, .btn:hover, .account-nav-link, .account-nav-link:hover {
  background: linear-gradient(155deg, #2B3F60, #182943 75%);
  color: #FAFBFE;
  border-color: transparent;
  box-shadow: 0 5px 14px #18294326, 0 2px 5px #18294312;
  transform: none;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
}
.btn-secondary, .btn-secondary:hover,
.card-actions .btn-secondary, .card-actions .btn-secondary:hover {
  background: linear-gradient(155deg, #FFFFFF, #F2F4F8);
  color: var(--ink);
  border-color: transparent;
  box-shadow: 0 4px 12px #1829430F, 0 1px 4px #1829430A;
  transform: none;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
}
@media (hover: hover) and (pointer: fine) {
  .btn:hover:not(:disabled), .account-nav-link:hover {
    background: linear-gradient(155deg, #354D73, #1D3556 75%);
    box-shadow: 0 9px 20px #18294330, 0 3px 8px #18294316;
    transform: translateY(-2px);
  }
  .btn-secondary:hover:not(:disabled), .card-actions .btn-secondary:hover:not(:disabled) {
    color: var(--accent-hover);
    background: linear-gradient(155deg, #FFFFFF, #F7F9FD);
    box-shadow: 0 8px 18px #18294318, 0 2px 6px #1829430D;
    transform: translateY(-2px);
  }
}
.btn:active:not(:disabled), .account-nav-link:active {
  transform: translateY(1px);
  box-shadow: 0 2px 6px #18294324;
}
.btn-secondary:active:not(:disabled), .card-actions .btn-secondary:active:not(:disabled) {
  transform: translateY(1px);
  box-shadow: 0 1px 5px #18294312;
}
.btn:disabled, .btn-secondary:disabled, .card-actions .btn-secondary:disabled {
  transform: none;
  box-shadow: none;
}
.btn:focus-visible, .btn-secondary:focus-visible, .account-nav-link:focus-visible {
  outline: 3px solid var(--accent);
  outline-offset: 3px;
}
@media (prefers-reduced-motion: reduce) {
  .btn, .btn:hover, .btn:active:not(:disabled),
  .btn-secondary, .btn-secondary:hover, .btn-secondary:active:not(:disabled),
  .card-actions .btn-secondary, .card-actions .btn-secondary:hover:not(:disabled),
  .card-actions .btn-secondary:active:not(:disabled),
  .account-nav-link, .account-nav-link:hover, .account-nav-link:active {
    transition: none;
    transform: none;
  }
  .btn:hover:not(:disabled), .btn-secondary:hover:not(:disabled) { transform: none; }
}
.text-link, .source-link, .filter-reset, .results-meta button,
.research-tools button, .page-intro .eyebrow, .desk-panel .eyebrow,
.consult-steps strong, .tabs button[aria-selected="true"] { color: var(--accent); }
.text-link:hover, .source-link:hover { color: var(--accent-hover); }
.account-nav-link > span { color: #C2D2FF; }
.account-nav-link[aria-current="page"] { box-shadow: 0 5px 14px #18294326, 0 2px 5px #18294312; outline: 2px solid var(--accent-line); outline-offset: 2px; }
.account-nav-link[aria-current="page"]:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
.surface-tag {
  color: var(--accent);
  background: linear-gradient(150deg, #FFFFFF, #F2F4F8);
  box-shadow: 0 2px 1px #D9E0ED, 0 3px 5px #18294306;
}
.surface-tag > span, .account-preview-label i, .progress-line span.active { background: var(--accent); }
.premium-hero .surface-tag > span,
.research-flow .surface-tag > span,
.consult-feature .surface-tag > span { background: #24875A; }

/* A quiet blue-gray tint supports the cobalt accents without changing the composition. */
.hero.premium-hero {
  background: radial-gradient(ellipse at 80% 75%, #E4E9F4 0, transparent 48%), linear-gradient(130deg, #E8EDF5, #FAFBFE 48%, #EEF2F9);
  border-color: #FAFBFE;
}
.hero-aura {
  background: radial-gradient(ellipse at 50% 50%, #9DB0E5 0, #DCE4F7 48%, transparent 72%);
  opacity: .22;
  animation: none;
}
.hero-sub, .hero-search .search-icon { color: var(--muted); }
.hero-search { background: #FAFBFEED; box-shadow: 0 3px 0 #D6DEED, 0 15px 30px #18294308; }
.hero-links a:hover, .hero-links button:hover, .hero-links span { color: var(--accent); }
.scene-orbit { border-color: #C7D3ED80; }
.scene-orbit > div { background: #7B95D9; box-shadow: 0 0 12px #7B95D940; }
.document-object { background: linear-gradient(130deg, #FFFFFF, #F6F8FD); border-color: #FFFFFF; }
.document-top > span, .document-object > p, .document-fact > span, .document-note { color: var(--muted); }
.document-fact, .document-top > span { border-color: var(--line); }
.document-line { background: #E2E8F3; }
.note-object { background: linear-gradient(130deg, #2B3F60, #182943); border-color: #4A5F7D; color: #FAFBFE; }
.note-symbol { background: linear-gradient(140deg, #456BCD, #3159D9); box-shadow: inset 0 1px #9CB2F1, 0 5px 13px #101D3240; color: #FAFBFE; }
.note-topics > span { color: #E5EBFA; border-color: #FFFFFF30; }
.scroll-cue { background: var(--paper); color: var(--ink); }
.scroll-cue span { color: var(--accent); }

/* Cards, saved decisions and guided steps use the same restrained accent. */
.brand-card, .filter-panel, .research-sidebar, .saved-row, .desk-panel,
.consult-layout > form, .consult-layout > div, .consult-summary, .page-end,
.account-form-panel, .account-panel { background: linear-gradient(150deg, #FFFFFF, #F5F7FC); }
.card-topline, .card-desc, .card-source, .sample-note, .card-reason ul,
.stack-top, .stack-card p, .mini-brand-strip span { color: var(--muted); }
.card-stats dd, .filterbar label { color: var(--ink); }
/* Compact headline figures; numeric tables retain their column alignment. */
.bd-essential > strong,
.bd-cost-range > strong,
.bd-revenue-figure > strong,
.card-stats dd,
.result-money strong,
.reported-result > strong,
.loan-reference-stats dd {
  font-variant-numeric: lining-nums proportional-nums;
  font-kerning: normal;
  letter-spacing: -.045em;
}
/* Every dollar range shares the same compact figures and separately spaced dash. */
.fdd-money-range { white-space: nowrap; }
.fdd-money-amount {
  font-variant-numeric: lining-nums proportional-nums;
  font-kerning: normal;
  letter-spacing: -.045em;
}
.fdd-money-dash { padding: 0 3px; letter-spacing: normal; }
.card-image .save-button { color: var(--ink); }
.card-image .save-button[aria-pressed="true"],
.card-feedback button[aria-pressed="true"], .decision-tag {
  color: var(--accent);
  background: var(--accent-soft);
  border-color: var(--accent-line);
}
.card-reason details, .criteria-details { background: #F5F7FC; border-color: var(--line); }
/* Expert help is visible at the point where a buyer needs to narrow their choices. */
.recommendation-expert {
  margin-top: 28px;
  padding: clamp(22px, 3vw, 34px);
  border: 1px solid var(--line);
  border-radius: 16px;
  background: linear-gradient(135deg, #FFFFFF, #ECF1FA);
}
.recommendation-expert .surface-tag { margin-bottom: 16px; }
.recommendation-expert .surface-tag > span { background: #24875A; }
.recommendation-expert h2 { max-width: 620px; font-size: clamp(25px, 2.4vw, 32px); line-height: 1.2; margin: 0 0 14px; }
.recommendation-expert-intro { max-width: 680px; color: var(--muted); font-size: 16px; line-height: 1.65; }
.recommendation-expert-benefits { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; list-style: none; padding: 24px 0; margin: 24px 0; border-block: 1px solid var(--line); }
.recommendation-expert-benefits h3 { font-size: 16px; line-height: 1.4; margin: 0 0 8px; }
.recommendation-expert-benefits p { color: var(--muted); font-size: 14px; line-height: 1.65; }
.recommendation-expert-footer { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.recommendation-expert-footer .btn { white-space: normal; text-align: center; }
.recommendation-expert-footer .consultation-note { margin: 10px 0 0; font-size: 13px; color: var(--muted); }
.recommendation-expert-footer .partnership-credit { margin: 0; font-size: 13px; color: var(--muted); }
.recommendation-method { margin-top: 16px; }
@media (max-width: 1100px) {
  .recommendation-expert-benefits { grid-template-columns: 1fr; gap: 20px; }
  .recommendation-expert-footer { align-items: flex-start; flex-direction: column; gap: 16px; }
}
@media (max-width: 560px) {
  .recommendation-expert-footer > div, .recommendation-expert-footer .btn { width: 100%; }
}
.card-reason summary { color: var(--accent); }
.choice:has(input:checked) { border-color: var(--accent-line); background: var(--accent-soft); }
.stack-card, .stack-card:nth-child(2) { background: linear-gradient(135deg, #FAFBFE, #EAF0F8); }
.stack-icon { color: var(--accent); background: #FAFBFE; box-shadow: 0 2px 0 #D7DFEE, inset 0 1px #FFFFFF; }
.fact-chips span { color: var(--muted); background: #FAFBFE; border-color: var(--line); }
.stack-card.stack-dark { color: #FAFBFE; background: radial-gradient(ellipse at 100% 0, #304A74, #182943 65%); border-color: #4A5F7D; }
.stack-dark .stack-top, .stack-dark p { color: #D6E0F4; }
.stack-dark .stack-icon { color: #FAFBFE; background: linear-gradient(130deg, #456BCD, #3159D9); box-shadow: 0 2px 0 #2447B7, inset 0 1px #9CB2F1; }
.brief-lines span { color: #E0E8F8; }
.consult-feature { background: radial-gradient(ellipse at 100% 50%, #DEE6FA66, transparent 60%), linear-gradient(130deg, #FAFBFE, #ECF1FA); }
.preview-notice, .question-note, .no-guess, .ready-summary { background: var(--wash); color: var(--muted); border-color: var(--line); }
.recurring-fees h3 { font-size: 20px; margin-bottom: 8px; }
.breakdown-fees { margin-top: 18px; }
.breakdown-fees > div { display: grid; grid-template-columns: minmax(110px, 1fr) minmax(0, 2fr); gap: 18px; padding: 16px 0; border-bottom: 1px solid var(--line); }
.breakdown-fees dt { font-size: 14px; font-weight: 600; }
.breakdown-fees dd { margin: 0; font-size: 15px; font-weight: 600; letter-spacing: -.02em; overflow-wrap: anywhere; }
.breakdown-fees dd p { margin: 6px 0; font-size: 13px; font-weight: 400; letter-spacing: normal; }
.breakdown-fees dd a { font-size: 12px; font-weight: 400; letter-spacing: normal; }
.recurring-fees > .sidebar-note { margin-top: 16px; }
@media (max-width: 520px) { .breakdown-fees > div { grid-template-columns: 1fr; gap: 6px; } }
.finance-bar { background: #DBE3F1; }
.finance-bar > span { background: var(--accent); }
.result-money > div { background: linear-gradient(135deg, #FFFFFF, #EEF3FC); }
dialog { background: #FAFBFE; }
dialog::backdrop { background: #18294366; }
.modal-close { color: var(--muted); }
.site-footer { background: #EBEFF7; }
.footer-bottom { border-color: #D2DCED; color: var(--muted); }
.footer-bottom button { color: var(--muted); }

/* Source material stays neutral; color never implies a financial judgment. */
.bd-page {
  --bd-rule: #D8DFEC;
  --bd-ink: #182943;
  --bd-muted: #526078;
  --bd-accent: #3159D9;
  --bd-surface: #FAFBFE;
  --bd-shadow: 0 6px 18px #18294308, inset 0 1px 0 #FFFFFF;
}
.bd-cover-grid .bd-intro, .bd-intro, .bd-consult { background: linear-gradient(145deg, #FFFFFF, #F5F7FC); }
.bd-page .source-link, .bd-account-card .text-link, .bd-faq .text-link,
.bd-document-icon, .bd-page-nav button:hover, .bd-page-nav button:focus-visible,
.bd-disclosure > summary:hover, .bd-item > summary:hover { color: var(--accent); }
.bd-page .source-link:hover { color: var(--accent-hover); }
.bd-page-nav button:hover, .bd-page-nav button:focus-visible { border-bottom-color: var(--accent); }
.bd-page-nav button:focus-visible { outline-color: var(--accent); }
.bd-primary-actions .is-active, .bd-decision.is-active { color: var(--accent); background: var(--accent-soft); border-color: var(--accent-line); }
.bd-primary-actions .is-active { box-shadow: 0 4px 12px #1829430F; }
.bd-decision:hover, .bd-note-submit:hover { background: var(--wash); }
.bd-account-card { background: linear-gradient(135deg, #FFFFFF, #EEF3FD); border-color: #CBD8F0; }
.bd-account-icon { background: var(--accent-soft); color: var(--accent); border-color: #BDCCEE; }
.bd-source-chip, .bd-revenue-figure, .bd-network-summary, .bd-network-table thead th,
.bd-research-panel textarea, .bd-note-submit { background: var(--wash); border-color: var(--line); }
.bd-header-source, .bd-source-chip, .bd-page-nav button, .bd-quick-facts dt,
.bd-account-card p, .bd-investment-scale span, .bd-inline-action p,
.bd-network-summary span, .bd-chart-caption span, .bd-bar-year,
.bd-chart-note, .bd-document small { color: var(--muted); }
.bd-investment-scale strong, .bd-chart-control select, .bd-document { color: var(--ink); }
.bd-range-track { background: linear-gradient(90deg, #CFDBF7, #3159D9); }
.bd-range-track i { background: var(--accent); box-shadow: 0 0 0 1px #8EA7E5; }
.bd-bar:not(.bd-bar-missing) { background: linear-gradient(180deg, #7895E4, #3159D9); }
.bd-bar-track { border-color: #BBCBE7; background: repeating-linear-gradient(to top, transparent 0, transparent 49px, #E0E7F4 49px, #E0E7F4 50px); }
.bd-document { background: #F4F7FC; border-color: var(--line); }
.bd-document:hover { background: var(--accent-soft); border-color: var(--accent-line); }
.bd-network-table tbody tr:last-child { background: #F5F7FC; }

/* Map selection is a focus state, never an availability/territory signal. */
.fdd-brand-map { --map-red: #3159D9; --map-ink: #182943; --map-muted: #526078; }
.fdd-map-toolbar > button:focus-visible, .fdd-map-row:focus-visible,
.fdd-map-zoom button:focus-visible { outline-color: var(--accent); }
.fdd-map-row.is-selected { background: var(--accent-soft); }
.fdd-map-selection, .fdd-map-unavailable { background: var(--wash); }
.fdd-map-layout { background: #EFF3FA; border-color: var(--line); }
.fdd-map-canvas { background: #ECF1F8; }
.fdd-map-county { fill: #E2E9F4; stroke: #BAC9E1; }
.fdd-map-county.county-1 { fill: #EDF2FA; }
.fdd-map-county.county-2 { fill: #E7EEF8; }
.fdd-map-city-dot { fill: #687D9D; }
.fdd-map-city-label { stroke: #EDF2FA; }
.fdd-map-dot { stroke: #687D9D; }
.fdd-map-pin text { fill: #455B7D; }
.fdd-map-pin.is-selected .fdd-map-dot { stroke: #FAFBFE; }
.fdd-map-pin.is-selected text { fill: #FAFBFE; }
.fdd-map-caption { background: #F7F9FDEB; }
.fdd-map-row:hover { background: #F4F7FC; }
.fdd-map-row.is-selected { background: var(--accent-soft); }
.fdd-map-index { background: #F7F9FD; border-color: var(--line); }
.fdd-map-row.is-selected .fdd-map-index { background: var(--accent); border-color: var(--accent); }
.fdd-map-row, .fdd-map-toolbar > button, .fdd-map-zoom button { color: var(--ink); }
.fdd-map-selection p, .fdd-map-scope, .fdd-map-row small,
.fdd-map-help, .fdd-map-sources p, .fdd-map-sources a, .fdd-map-sources summary,
.fdd-map-empty, .fdd-map-unavailable p, .fdd-map-caption,
.fdd-map-result-count, .fdd-map-selected-label span, .fdd-map-view-label,
.fdd-map-index, .fdd-map-row > span:last-child, .fdd-map-north { color: var(--muted); }
.fdd-map-selection a { color: var(--accent); }
.fdd-map-county-label { fill: #53647F; }
.fdd-map-city-label { fill: #455B7D; }
.fdd-map-pin:focus .fdd-map-dot { stroke: var(--ink); }
.fdd-map-row.is-selected .fdd-map-index { color: #FAFBFE; }

/* Neutral account copy is readable on every pale panel, including small notes. */
.account-back, .account-guest-link, .account-signin,
.account-introduction > p:not(.surface-tag), .account-value-list p > span,
.account-form-intro, .account-check, .account-field-hint, .account-switch,
.account-preview-label, .account-preview-note p,
.account-heading > div > p:not(.surface-tag), .account-stats strong small,
.account-stats a > span, .account-panel-heading > span, .account-step-number,
.account-step p, .account-answer-status > span, .account-shortlist-items small,
.account-shortlist-items i, .account-shortlist-empty p, .account-research-totals,
.account-delete-panel { color: var(--muted); }
.account-value-list strong, .account-form input:not([type="checkbox"]) { color: var(--ink); }
.account-value-icon, .account-switch a, .account-stats i,
.account-panel-heading > a, .account-step .text-link,
.account-back:hover, .account-guest-link:hover, .account-signin:hover,
.account-shortlist-items > a:hover strong { color: var(--accent); }
.account-value-icon, .account-stats > a { background: linear-gradient(145deg, #FAFBFE, #EDF2FA); }
.account-preview-note, .account-answer-status > span { background: var(--wash); border-color: var(--line); }
.account-answer-status > span.is-answered { color: var(--accent); background: var(--accent-soft); border-color: #C2D1F1; }
.account-shortlist-items em { color: var(--accent); background: var(--accent-soft); border-color: #C2D1F1; }
.account-profile-avatar { color: #E7EEFF; background: linear-gradient(130deg, #2B3F60, #182943); box-shadow: 0 2px 0 #101D32; }
.account-form input:not([type="checkbox"]):not([aria-invalid="true"]):focus { outline-color: var(--accent); border-color: #8EA7E5; }
/* Validation errors, storage warnings and destructive actions retain semantic colors. */

.loan-reference { margin: 18px 0 22px; padding: 18px 20px; background: var(--accent-soft); border-radius: 12px; }
.loan-reference-title { font-weight: 600; margin: 0 0 14px; }
.loan-reference-stats { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; margin: 0 0 12px; }
.loan-reference-stats dt { font-size: 13px; color: var(--muted); }
.loan-reference-stats dd { margin: 3px 0 0; font-size: 24px; line-height: 1.3; font-weight: 600; }
.loan-source-date { font-size: 12px; color: var(--muted); line-height: 1.6; margin: 12px 0 0; }
.loan-reference-reset { margin-top: 16px; font-size: 14px; }
.loan-reference-reset:disabled { opacity: .5; cursor: default; }
@media(max-width:560px) { .loan-reference { padding: 15px; }.loan-reference-stats dd { font-size: 21px; } }
@media print {
  body, .site-footer, .hero.premium-hero, .bd-intro, .bd-consult,
  .brand-card, .account-panel, .account-form-panel, .stack-card,
  .stack-card.stack-dark { background: #FFFFFF; color: #182943; }
  .stack-dark p, .stack-dark .stack-top, .brief-lines span { color: #526078; }
}
