@font-face { font-family: 'Public Sans'; font-style: normal; font-weight: 400 700; font-display: swap; src: url(/assets/fonts/public-sans.woff2) format('woff2'); }
:root { color-scheme: light dark;
  --font: 'Public Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --ink: #16202e; --muted: #4f5b6d; --edge: #7c8798; --line: #dde2e9; --panel: #f4f6f9; --bg: #ffffff; --surface: #ffffff;
  --success: #1f7a4d; --success-bg: #e8f4ee; --error: #b42318; --error-bg: #fdecea; --warn: #8a5a00; --warn-bg: #fdf3e1;
  --focus: #16202e;
  --s1: 0.25rem; --s2: 0.5rem; --s3: 0.75rem; --s4: 1rem; --s5: 1.5rem; --s6: 2rem; --s7: 3rem; --s8: 4rem;
  --r-control: 6px; --r-card: 10px;
  --t-small: 0.875rem; --t-body: 1rem; --t-lead: 1.125rem; --t-h3: 1.125rem; --t-h2: 1.375rem; --t-h1: 1.75rem;
  --tap: 2.75rem;
  /* Lender colours: the neutral theme until /brand.css says otherwise. */
  --brand-primary: #2f4b6e; --brand-on-primary: #ffffff; --brand-accent: #1f7a6d; --brand-on-accent: #ffffff;
  --brand-link: #2f4b6e; --brand-ink: #2f4b6e; --brand-tint: #eef1f3; }
@media (prefers-color-scheme: dark) { :root {
  --ink: #e7ebf1; --muted: #a7b0bf; --edge: #7f8a9b; --line: #333b48; --panel: #1b212b; --bg: #11161d; --surface: #161c25;
  --success: #7fd1a6; --success-bg: #15291f; --error: #ff9b8f; --error-bg: #34191a; --warn: #f2c26b; --warn-bg: #2f2614;
  --focus: #e7ebf1; } }
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; font-family: var(--font); font-size: var(--t-body); line-height: 1.55; color: var(--ink); background: var(--bg); }
h1, h2, h3 { line-height: 1.25; text-wrap: balance; color: var(--ink); }
h1 { font-size: var(--t-h1); font-weight: 700; margin: 0 0 var(--s3); letter-spacing: -0.01em; }
h2 { font-size: var(--t-h2); font-weight: 700; margin: var(--s6) 0 var(--s3); }
h3 { font-size: var(--t-h3); font-weight: 600; margin: var(--s5) 0 var(--s2); }
p { margin: 0 0 var(--s3); }
a { color: var(--brand-link); text-underline-offset: 0.15em; }
a:hover { text-decoration-thickness: 2px; }
@media (prefers-color-scheme: dark) { a { color: var(--ink); } }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
code { font-size: 0.9375em; overflow-wrap: anywhere; }
.lede { font-size: var(--t-lead); color: var(--muted); margin-top: 0; }
.muted { color: var(--muted); }
.hint { display: block; font-size: var(--t-small); color: var(--muted); }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@media (prefers-reduced-motion: no-preference) { a, button, input, select, .service, .card-link { transition: background-color 120ms, border-color 120ms, box-shadow 120ms, color 120ms; } }
button, .button { font: inherit; font-weight: 600; display: inline-flex; align-items: center; justify-content: center; gap: var(--s2);
  min-height: var(--tap); padding: 0.5rem 1.125rem; border-radius: var(--r-control); cursor: pointer; text-decoration: none; line-height: 1.2;
  border: 1.5px solid var(--edge); background: var(--surface); color: var(--ink); }
button:hover, .button:hover { border-color: var(--ink); }
button:disabled { opacity: 0.6; cursor: progress; }
button.primary, .button.primary { background: var(--brand-primary); color: var(--brand-on-primary); border-color: var(--brand-primary); min-height: 3.25rem; padding: 0.75rem 1.5rem; font-size: 1.0625rem; width: 100%; }
button.primary:hover, .button.primary:hover { filter: brightness(1.08); border-color: var(--brand-primary); }
@media (min-width: 40rem) { button.primary, .button.primary { width: auto; min-width: 14rem; } }
button.secondary, .button.secondary { background: var(--surface); color: var(--ink); border-color: var(--edge); }
button.danger { color: var(--error); border-color: currentColor; }
label { display: block; font-weight: 600; margin-bottom: var(--s1); }
input, select, textarea { font: inherit; color: var(--ink); background: var(--bg); width: 100%; min-height: 3rem; padding: 0.625rem 0.75rem;
  border: 1.5px solid var(--edge); border-radius: var(--r-control); }
select { padding-right: 2rem; }
input:hover, select:hover { border-color: var(--ink); }
input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid var(--focus); outline-offset: 1px; border-color: var(--ink); }
input[type="checkbox"] { width: 1.5rem; height: 1.5rem; min-height: 0; padding: 0; margin: 0; flex: none; accent-color: var(--brand-primary); cursor: pointer; }
input[type="color"] { width: 4.5rem; padding: 0.25rem; }
input[type="file"] { padding: 0.5rem; min-height: var(--tap); }
input[type="file"]::file-selector-button { font: inherit; font-weight: 600; margin-right: var(--s3); min-height: 2.25rem; padding: 0.25rem 0.75rem; border-radius: var(--r-control); border: 1.5px solid var(--edge); background: var(--panel); color: var(--ink); cursor: pointer; }
[aria-invalid="true"], .has-error input, .has-error select { border-color: var(--error); border-width: 2px; }
.field-error { color: var(--error); font-size: var(--t-small); font-weight: 600; margin: var(--s1) 0 0; }
.card, .panel { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-card); padding: var(--s5); }
.alert { border-radius: var(--r-card); padding: var(--s3) var(--s4); margin: 0 0 var(--s4); border: 1px solid; }
.alert p:last-child, .alert ul:last-child { margin-bottom: 0; }
.alert-error { color: var(--error); background: var(--error-bg); border-color: currentColor; }
.alert-error a { color: inherit; font-weight: 600; }
.alert-success { color: var(--success); background: var(--success-bg); border-color: currentColor; font-weight: 600; }
.alert-info { color: var(--ink); background: var(--panel); border-color: var(--line); }
.pill { display: inline-block; font-size: 0.8125rem; font-weight: 600; line-height: 1.4; padding: 0.125rem 0.625rem; border-radius: 999px; white-space: nowrap; }
.pill-done { color: var(--success); background: var(--success-bg); }
.pill-open { color: var(--warn); background: var(--warn-bg); }
.pill-blocked { color: var(--error); background: var(--error-bg); }
.pill-neutral { color: var(--muted); background: var(--panel); }
table { border-collapse: collapse; width: 100%; font-variant-numeric: tabular-nums; }
th, td { text-align: left; vertical-align: top; padding: var(--s3) var(--s3); border-bottom: 1px solid var(--line); }
thead th { font-size: 0.8125rem; font-weight: 600; color: var(--muted); letter-spacing: 0.02em; border-bottom-width: 2px; }
tbody th, tfoot th { font-weight: 600; }
tfoot td, tfoot th { font-weight: 700; border-bottom: 0; }
caption { text-align: left; font-weight: 700; padding: 0 0 var(--s2); }
.scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
@media (max-width: 40rem) {
  table.stack thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  table.stack, table.stack tbody, table.stack tr, table.stack td { display: block; width: 100%; }
  table.stack tr { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 var(--s3); border-bottom: 1px solid var(--line); padding: var(--s3) 0; }
  table.stack td { border: 0; padding: var(--s1) 0; }
  table.stack td:first-child, table.stack td:last-child:nth-child(even) { grid-column: 1 / -1; }
  table.stack caption { display: block; }
  table.stack td[data-label]::before { content: attr(data-label); display: block; font-size: 0.8125rem; font-weight: 600; color: var(--muted); }
}

body { background: var(--panel); }
body:not(.console) > main { max-width: 40rem; margin: var(--s7) auto; padding: var(--s6); background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-card); }
@media (max-width: 42rem) { body:not(.console) > main { margin: var(--s4); padding: var(--s5); } }
.meta { color: var(--muted); font-size: var(--t-small); }
.view-switch { background: var(--surface); border-bottom: 1px solid var(--line); }
.view-switch .console-wrap { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s2); padding-top: var(--s2); padding-bottom: var(--s2); font-size: var(--t-small); }
.view-switch span { color: var(--muted); font-weight: 600; }
.view-switch a { display: inline-flex; align-items: center; gap: var(--s1); min-height: var(--tap); padding: 0 var(--s3); border: 1px solid var(--line); border-radius: 999px; color: var(--ink); text-decoration: none; font-weight: 600; }
.view-switch .new-tab { flex: none; }
@media (max-width: 40rem) { .view-switch span:first-child { flex-basis: 100%; } .view-switch a { padding: 0 var(--s2); } }
.view-switch a[aria-current] { background: var(--brand-primary); border-color: var(--brand-primary); color: var(--brand-on-primary); }
.guide-strip { background: var(--surface); border-bottom: 1px solid var(--line); }
.guide-strip .console-wrap { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s2) var(--s3); padding-top: var(--s2); padding-bottom: var(--s2); font-size: var(--t-small); }
.guide-strip a { display: inline-flex; align-items: center; gap: var(--s1); min-height: var(--tap); font-weight: 600; }
.guide-strip .guide-go { padding: 0 var(--s3); border: 1px solid var(--brand-primary); border-radius: 999px; text-decoration: none; color: var(--ink); }
.guide-steps { list-style: none; counter-reset: guide; margin: var(--s3) 0; padding: 0; display: grid; gap: var(--s2); }
.guide-steps li { counter-increment: guide; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s2) var(--s3); padding: var(--s3); border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.guide-steps li > div { flex: 1 1 16rem; display: grid; gap: var(--s1); }
.guide-steps li > div > strong::before { content: counter(guide) ". "; }
.guide-steps li span { color: var(--muted); }
.guide-steps .guide-mark { justify-self: start; padding: 0 var(--s2); border-radius: 999px; font-size: var(--t-small); font-weight: 600; background: var(--panel); color: var(--ink); }
.guide-steps .guide-next { border-color: var(--brand-primary); border-width: 2px; }
.guide-steps .guide-next .guide-mark { background: var(--brand-primary); color: var(--brand-on-primary); }
.guide-steps .guide-done strong { text-decoration: line-through; color: var(--muted); }
.guide-steps .guide-go { display: inline-flex; align-items: center; gap: var(--s1); min-height: var(--tap); font-weight: 600; }
.guide-hide { font-size: var(--t-small); }
.practice-banner { margin: 0; padding: var(--s3) var(--s4); background: var(--warn-bg); color: var(--warn); font-weight: 600; text-align: center; border-bottom: 2px solid var(--warn); }
/* The request form. */
.back { display: inline-flex; align-items: center; gap: var(--s1); min-height: var(--tap); font-weight: 600; text-decoration: none; margin: calc(var(--s3) * -1) 0 var(--s2); }
.back .icon { width: 1.125rem; height: 1.125rem; }
.chosen { list-style: none; padding: 0; margin: 0 0 var(--s4); display: flex; flex-wrap: wrap; gap: var(--s2); }
.chosen li { display: inline-flex; align-items: center; gap: var(--s2); font-size: 0.9375rem; font-weight: 600; padding: 0.25rem 0.75rem 0.25rem 0.375rem; border-radius: 999px; background: var(--panel); }
.chosen .icon { width: 1.25rem; height: 1.25rem; color: var(--brand-ink); }
@media (prefers-color-scheme: dark) { .chosen .icon { color: var(--ink); } }
.chosen-edit { display: inline-flex; align-items: center; min-height: var(--tap); font-size: 0.9375rem; font-weight: 600; }
.form-part { margin-top: var(--s5); }
.form-part + .form-part { border-top: 1px solid var(--line); padding-top: var(--s5); margin-top: var(--s6); }
.part-label { font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); margin: 0 0 var(--s1); }
fieldset { border: 0; padding: 0; margin: 0 0 var(--s5); min-width: 0; }
legend { float: left; width: 100%; padding: 0; font-weight: 700; font-size: 1.25rem; line-height: 1.3; margin: 0 0 var(--s4); color: var(--ink); }
legend + * { clear: both; }
.fields { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--s4) var(--s3); }
.fields > .field { grid-column: span 12; margin: 0; }
@media (min-width: 30rem) { .fields > .f-first_name, .fields > .f-last_name, .fields > .f-email, .fields > .f-phone { grid-column: span 6; } }
.fields > .f-state, .fields > .f-to_state, .fields > .f-zip, .fields > .f-to_zip { grid-column: span 6; }
@media (min-width: 30rem) { .fields > .f-city, .fields > .f-to_city { grid-column: span 6; } .fields > .f-state, .fields > .f-to_state, .fields > .f-zip, .fields > .f-to_zip { grid-column: span 3; } }
@media (min-width: 30rem) { .fields > .f-vehicle_year { grid-column: span 3; } .fields > .f-vehicle_make, .fields > .f-vehicle_model { grid-column: span 6; } .fields > .f-vehicle_runs { grid-column: span 3; } .fields > .f-vehicle_make { grid-column: span 4; } .fields > .f-vehicle_model { grid-column: span 5; } }
.field label { font-size: 0.9375rem; }
.optional { font-weight: 400; color: var(--muted); }
.error-summary { color: var(--error); background: var(--error-bg); border: 1.5px solid currentColor; border-radius: var(--r-card); padding: var(--s3) var(--s4); margin: 0 0 var(--s5); }
.error-summary p { margin: 0; font-weight: 700; }
.error-summary li a { display: inline-block; padding: 0.625rem 0; }
.link-row a, .site-footer a.foot-own { display: inline-flex; align-items: center; min-height: var(--tap); }
.error-summary ul { margin: var(--s2) 0 0; padding-left: 1.25rem; }
.error-summary li { margin: var(--s1) 0; }
.error-summary a { color: inherit; }
/* The two boxes: the whole box is the tap target, the words stay full size and fully visible. */
.who { font-size: 1.0625rem; }
.consent-box { display: grid; grid-template-columns: auto 1fr; gap: var(--s3); align-items: start; padding: var(--s4); margin-bottom: var(--s3);
  border: 1.5px solid var(--edge); border-radius: var(--r-card); background: var(--surface); }
.consent-box:has(input:checked) { border-color: var(--brand-primary); box-shadow: inset 0 0 0 1px var(--brand-primary); background: var(--brand-tint); }
@media (prefers-color-scheme: dark) { .consent-box:has(input:checked) { border-color: var(--ink); box-shadow: inset 0 0 0 1px var(--ink); background: var(--panel); } }
.consent-box input { margin-top: 0.125rem; }
.consent-box label { font-weight: 400; font-size: 0.9375rem; line-height: 1.55; margin: 0; cursor: pointer; }
.boxes-cleared { color: var(--error); font-weight: 600; }
.choice-note { display: flex; gap: var(--s2); align-items: flex-start; font-size: 0.9375rem; color: var(--ink); background: var(--panel); border-radius: var(--r-card); padding: var(--s3) var(--s4); }
.choice-note .icon { flex: none; color: var(--muted); width: 1.25rem; height: 1.25rem; margin-top: 0.15rem; }
.choice-note p { margin: 0; }
.send { margin-top: var(--s5); }

body.console { margin: 0; background: var(--panel); }
.console-brand { background: var(--brand-primary); color: var(--brand-on-primary); }
.console-brand .console-wrap { display: flex; align-items: center; min-height: 3.5rem; padding-top: var(--s2); padding-bottom: var(--s2); }
.console-brand img { height: 2.25rem; width: auto; max-width: 100%; display: block; }
/* A dark logo on a dark band sits on a small white plate (Will, 2026-10-26); the band stays the primary color. */
.console-brand img.logo-plate, .bar-preview img.logo-plate { background: #ffffff; padding: 0.25rem 0.5rem; border-radius: 6px; box-sizing: content-box; }
.console-brand span { font-weight: 700; font-size: 1.125rem; }
.console-bar { background: var(--surface); border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 5; }
/* On a phone the header scrolls away with the page; the name already in the brand band is not said twice. */
@media (max-width: 40rem) { .console-bar { position: static; } .console-top.named .console-lender-name { display: none; } }
.console-wrap { width: 100%; max-width: 68rem; margin: 0 auto; padding-left: max(1rem, env(safe-area-inset-left)); padding-right: max(1rem, env(safe-area-inset-right)); }
.console-top { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s2) var(--s4); padding-top: var(--s3); padding-bottom: var(--s2); }
.console-lender { font-weight: 700; font-size: 1.125rem; margin-right: auto; line-height: 1.25; }
.console-lender small { display: block; font-size: 0.75rem; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }
.console-who { color: var(--muted); font-size: var(--t-small); }
@media (max-width: 40rem) { .console-top { display: grid; grid-template-columns: 1fr auto; } .console-who { grid-column: 1 / -1; grid-row: 2; } }
.console-bar form { margin: 0; }
.console-nav { display: flex; flex-wrap: wrap; gap: 0; }
.console-nav::-webkit-scrollbar { display: none; }
.console-nav a { display: inline-flex; align-items: center; min-height: var(--tap); padding: 0 var(--s2); color: var(--muted); text-decoration: none; font-weight: 600; font-size: 0.9375rem; border-bottom: 3px solid transparent; }
.console-nav a:first-child { padding-left: 0; }
.console-nav a:hover { color: var(--ink); }
.console-nav a[aria-current="page"] { color: var(--ink); border-bottom-color: var(--ink); }
.nav-sep { flex: none; width: 1px; margin: var(--s3) var(--s2); background: var(--line); }
body.console main { padding-top: var(--s6); padding-bottom: var(--s8); }
body.console main > h1 { margin-bottom: var(--s4); }
body.console main > p, .intro { max-width: 46rem; }
.panel { margin: var(--s4) 0; padding: var(--s5); }
.panel > h2:first-child, .panel > h3:first-child, .panel > summary + h2 { margin-top: 0; }
.panel input:not([type="color"]):not([type="file"]):not([type="checkbox"]), .panel select { max-width: 32rem; }
.panel p { margin-bottom: var(--s4); }
.panel label { margin-bottom: var(--s1); }
.panel .hint { margin: 0 0 var(--s2); }
form.panel button[type="submit"], form.plain button[type="submit"], form.stop button[type="submit"] { background: var(--brand-primary); color: var(--brand-on-primary); border-color: var(--brand-primary); }
form.inline { display: inline-flex; flex-wrap: wrap; align-items: center; gap: var(--s2); margin: 0 var(--s2) var(--s1) 0; }
form.inline select { width: auto; min-width: 9rem; }
form[data-confirm] button[type="submit"] { color: var(--error); border-color: var(--error); background: var(--surface); }
/* The Demo fill asks to be sure, but it is the page's main action, not a danger. */
form.fill[data-confirm] button.primary { background: var(--brand-primary); color: var(--brand-on-primary); border-color: var(--brand-primary); }
form.inline .result:empty { display: none; }
.result { color: var(--muted); font-size: var(--t-small); min-height: 1em; margin: var(--s2) 0 0; }
.result.error { color: var(--error); font-weight: 600; }
.result input { margin-top: var(--s2); }
.note { display: block; border-radius: var(--r-card); padding: var(--s3) var(--s4); background: var(--surface); border: 1px solid var(--line); color: var(--ink); max-width: 46rem; }
.note-success { background: var(--success-bg); border-color: var(--success); color: var(--success); font-weight: 600; }
.note-warn { background: var(--warn-bg); border-color: var(--warn); color: var(--warn); font-weight: 600; margin: 0 0 var(--s2); }
.grid { display: grid; gap: var(--s4); grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr)); }
.grid > * { min-width: 0; }
.grid > .panel { margin: 0; }
.grid-top { align-items: start; }
.brand-preview-row { display: grid; gap: var(--s4); grid-template-columns: minmax(0, 1fr) auto; align-items: start; }
.brand-preview-mark { text-align: center; }
.brand-preview-mark figure { margin: 0; }
.bar-name { position: relative; font-weight: 700; font-size: 1.25rem; color: #ffffff; }
.bar-name.on-light { color: #111111; }
.grid { margin: var(--s4) 0; }
@media (max-width: 40rem) { .brand-preview-row { grid-template-columns: minmax(0, 1fr); } .brand-preview-mark { text-align: left; } }
table { background: var(--surface); }
.table-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-card); padding: var(--s2) var(--s4); margin: var(--s3) 0 var(--s5); }
.table-card table { margin: 0; }
.table-card tr:last-child td, .table-card tr:last-child th { border-bottom: 0; }
.tiles { list-style: none; padding: 0; margin: var(--s4) 0; display: grid; gap: var(--s3); grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); }
code.ref { white-space: nowrap; font-weight: 600; }
code.url { overflow-wrap: anywhere; font-weight: 600; }
td.nowrap { white-space: nowrap; }
.scroll:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.tiles-money { grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); }
.tiles li { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-card); padding: var(--s4); color: var(--muted); font-size: 0.9375rem; }
.tiles a { display: block; color: inherit; text-decoration: none; margin: calc(var(--s4) * -1); padding: var(--s4); border-radius: var(--r-card); }
.tiles a:hover { background: var(--panel); }
.tile-n { display: block; font-size: 1.875rem; font-weight: 700; color: var(--ink); line-height: 1.15; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.start { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s4); }
.start h2 { margin: 0 0 var(--s1); }
.start p { margin: 0; color: var(--muted); }
.start .button { background: var(--brand-primary); color: var(--brand-on-primary); border-color: var(--brand-primary); min-height: 3rem; padding: 0.75rem 1.5rem; }
.cards { list-style: none; padding: 0; margin: var(--s4) 0; display: grid; gap: var(--s3); grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); }
.card-link { display: block; height: 100%; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-card); padding: var(--s4); color: var(--ink); text-decoration: none; }
.card-link:hover { border-color: var(--edge); }
.card-link strong { display: block; font-size: 1.0625rem; }
.card-link span { display: block; color: var(--muted); font-size: 0.9375rem; margin-top: var(--s1); }
.section-label { font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); margin: var(--s6) 0 var(--s2); }
.periods { display: flex; flex-wrap: wrap; gap: var(--s2); align-items: center; }
.periods a, .periods strong { display: inline-flex; align-items: center; min-height: var(--tap); padding: 0 var(--s3); border-radius: 999px; border: 1px solid var(--line); background: var(--surface); text-decoration: none; color: var(--ink); font-weight: 600; font-size: 0.9375rem; }
.periods strong { background: var(--ink); color: var(--bg); border-color: var(--ink); }
.funnel { list-style: none; padding: 0; margin: var(--s4) 0; display: grid; gap: var(--s2); grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); counter-reset: none; }
.funnel li { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-card); padding: var(--s4); color: var(--muted); font-size: 0.9375rem; }
details.more { margin: var(--s3) 0 var(--s5); }
details.more > summary, details.panel > summary { cursor: pointer; font-weight: 600; min-height: var(--tap); display: flex; align-items: center; }
.preview-logo img { max-width: 100%; max-height: 6rem; background: repeating-conic-gradient(#cfd5de 0 25%, #fff 0 50%) 0 0 / 16px 16px; }
.preview-mark img { width: 4rem; height: 4rem; background: repeating-conic-gradient(#cfd5de 0 25%, #fff 0 50%) 0 0 / 16px 16px; }
.bar-preview { position: relative; display: flex; align-items: center; min-height: 4.5rem; padding: var(--s3) var(--s4); border-radius: var(--r-control); overflow: hidden; margin: 0 0 var(--s2); border: 1px solid var(--line); }
.bar-preview svg.bar-bg { position: absolute; inset: 0; width: 100%; height: 100%; }
.bar-preview img { position: relative; height: 2.5rem; width: auto; max-width: 100%; }
.bar-preview.on-white { background: #ffffff; }
.previews { display: grid; gap: var(--s1); margin-bottom: var(--s3); }
.previews .hint { margin: 0 0 var(--s2); }
figure { margin: var(--s2) 0; }
figcaption { color: var(--muted); font-size: var(--t-small); }
dl.values { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: var(--s2) var(--s4); }
dl.values dt { font-weight: 600; }
dl.values dd { margin: 0; overflow-wrap: anywhere; }
@media (max-width: 30rem) { dl.values { grid-template-columns: minmax(0, 1fr); gap: 0; } dl.values dd { margin-bottom: var(--s2); } }
.choices { list-style: none; padding: 0; margin: 0 0 var(--s3); display: flex; flex-wrap: wrap; gap: var(--s2); }
.choices li { position: relative; display: flex; align-items: center; gap: var(--s2); min-height: 3rem; padding: 0 var(--s4) 0 var(--s3); border: 1.5px solid var(--line); border-radius: var(--r-control); background: var(--surface); }
.choices li:has(input:checked) { border-color: var(--ink); background: var(--panel); }
.choices label { font-weight: 600; margin: 0; cursor: pointer; }
.choices label::after { content: ''; position: absolute; inset: 0; }
.request-form .consent-box { font-size: var(--t-small); }
.scroll-hint { display: none; margin-top: var(--s2); }
.boxes-note { font-weight: 600; }
ul.named { margin: 0 0 var(--s2); padding-left: 1.25rem; }
.swatch-value { font-size: var(--t-small); color: var(--muted); margin-left: var(--s2); }
/* Phone rules last, so they win over the base rules above (the menu wraps onto more rows rather than scrolling). */
@media (max-width: 40rem) {
  form.request-form { padding: var(--s4); }
  .scroll-hint { display: block; }
  .tile-n { font-size: 1.5rem; }
  .tiles-money { grid-template-columns: minmax(0, 1fr); }
  .console-nav a { padding: 0 0.375rem; }
  .console-nav a:first-child { padding-left: 0; }
}
.wizard-step { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-card); padding: var(--s5); margin: var(--s4) 0; scroll-margin-top: 7rem; }
.wizard-step > h2 { display: flex; align-items: center; flex-wrap: wrap; gap: var(--s3); margin: 0 0 var(--s3); font-size: 1.25rem; }
.step-n { display: inline-grid; place-items: center; width: 2rem; height: 2rem; border-radius: 999px; background: var(--panel); font-size: 0.9375rem; flex: none; }
.wizard-step .panel { border: 0; padding: 0; margin: var(--s4) 0 0; background: none; }
.wizard-step details.panel { border: 1px solid var(--line); padding: 0 var(--s4); margin: var(--s2) 0; }
.progress { display: grid; gap: var(--s2); margin: var(--s2) 0 var(--s5); max-width: 40rem; }
.progress p { margin: 0; font-weight: 600; }
progress { width: 100%; height: 0.75rem; accent-color: var(--success); }
.next-up { border-left: 4px solid var(--warn); }
.next-up h2 { margin-top: 0; font-size: 1.125rem; }
.next-up p:last-child { margin-bottom: 0; }
tr.state-done td { color: var(--muted); }
tr.state-done td:first-child, tr.state-done td + td { color: var(--muted); }
.step-index { list-style: none; padding: 0; margin: var(--s3) 0; display: flex; flex-wrap: wrap; gap: var(--s2); }
.step-index a { display: inline-flex; align-items: center; gap: var(--s2); min-height: var(--tap); padding: 0 var(--s3); border: 1px solid var(--line); border-radius: 999px; background: var(--surface); color: var(--ink); text-decoration: none; font-size: 0.9375rem; font-weight: 600; }
.step-index a.done { color: var(--muted); }
details.more { margin: var(--s4) 0; }
details.more > summary { cursor: pointer; font-weight: 600; min-height: var(--tap); display: flex; align-items: center; }
.row-link { display: inline-flex; align-items: center; min-height: var(--tap); font-weight: 600; }
.step-index a.done::before { content: '\2713'; color: var(--success); }