/* Real Lease Cost: polish layer (design/polish/SPEC.md, Oct 30 2026). Loads AFTER style.css and realnumber.css.
   It re-values the tokens and re-cuts the components. Rules: every colour lives in the two :root blocks below,
   no rule here carries the important flag, no inline style anywhere (CSP). Six text sizes on a phone, six on a desk.
   Surfaces step (bg, s1, s2, s3) instead of borders. Glow sits on all-in money and the one primary button only.
   The display face comes from --face, which the font file's own CSS sets; until then the system stack serves. */
:root{
  --bg:#120b2c; --s1:#1b1140; --s2:#241757; --s3:#2d1f68;
  --line:#2a1d5a; --line-strong:#7362b6; --photo-edge:#3b2c78;
  --ink:#efecfb; --muted:#aba4d2; --link:#c4b9ff; --focus:#8fc7ff;
  --money:#2cf0a4; --money-sm:#5df3b8; --warn:#f3c565; --bad:#ff9d9d;
  --btn-lime:#d9f76a; --btn-face:#2cf0a4; --btn-ink:#10082b;
  --glow:0 0 18px 0 rgb(44 240 164 / .22);
  --btn-glow:0 0 0 1px rgb(44 240 164 / .25),0 6px 18px -6px rgb(44 240 164 / .45);
  --shade:0 1px 0 0 rgb(0 0 0 / .18);
  /* old names, so style.css and realnumber.css rules that still read them get the new values */
  --panel:var(--s1); --panel2:var(--s2); --accent:var(--money); --accent-ink:var(--btn-ink); --accent2:var(--link);
  --btn-bg:linear-gradient(135deg,var(--btn-lime),var(--btn-face)); --btn-shadow:var(--btn-glow);
  --body:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --display:var(--face,var(--body));
  --t1:12px; --t2:14px; --t3:16px; --t4:20px; --t5:28px; --t6:40px;
  --sp1:4px; --sp2:8px; --sp3:12px; --sp4:16px; --sp5:24px; --sp6:32px; --sp7:48px;
  --r1:6px; --r2:10px; --r3:14px; --radius:var(--r3);
  color-scheme:dark;
}
@media (prefers-color-scheme: light){
  :root{ --bg:#f5f3fa; --s1:#ffffff; --s2:#efecf7; --s3:#e6e1f3;
         --line:#e2ddf0; --line-strong:#8377b4; --photo-edge:#d6d0e8;
         --ink:#1a1140; --muted:#5b5385; --link:#4a3cae; --focus:#3b55d8;
         --money:#0f8a52; --money-sm:#0b6e41; --warn:#7a4a00; --bad:#b1231b;
         --btn-lime:#0f7d4b; --btn-face:#0f7d4b; --btn-ink:#ffffff;
         --glow:none; --btn-glow:0 1px 2px 0 rgb(15 125 75 / .30); --shade:0 1px 2px 0 rgb(26 17 64 / .08);
         color-scheme:light; }
}
@media (min-width:721px){ :root{ --t2:15px; --t5:34px; --t6:48px; } }

/* base */
html,body{font-family:var(--body);font-size:var(--t2);line-height:1.5}
a{color:var(--link)}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:var(--r1)}
h1{font-family:var(--display);font-size:var(--t5);line-height:1.1;letter-spacing:-.025em;font-weight:700;margin:var(--sp1) 0 var(--sp3)}
h2{font-family:var(--display);font-size:var(--t4);line-height:1.25;letter-spacing:-.015em;font-weight:650;margin:0 0 var(--sp3)}
h3{font-size:var(--t2);color:var(--muted);font-weight:600;margin:0 0 var(--sp2)}
.sub,.rc-where,.stamp,.paidline,.consent,.foot .sub,.carimg figcaption,.hero-cues,.crumbs,.count,.hint,.rn-cap{font-size:var(--t1)}
.tagline,.navlink,.work,.lead,.hero-sub,.ask label,.ask-opt label,.controls label,.nlform label,.more-filters summary,
.chip,.mode,.rc-adv,.rc-line,.rc-total .rc-l,.rn-l,.glossary dd,.glossary dt,.legend dd,.legend dt,.note,.badge-premium,
.picks li,.more li,.nlstate,.where,.deal-sum,.rules ol,.prose .lead,table.cov td,table.cov th,.srclink,.btn,.tag{font-size:var(--t2)}
.prose .lead,.lead,.hero-sub,.deal-sum,.rc-car,.picks h2,.top3 h2,.controls-h,.glossary summary{font-size:var(--t3)}
.deal-sum{line-height:1.5}

/* header: a quieter band, one tone up from the page */
.top{background:var(--s1);border-bottom:0;box-shadow:var(--shade);padding:var(--sp3) 0}
.brand{font-family:var(--display);font-size:var(--t4);letter-spacing:-.02em;font-weight:700}
.navlink{color:var(--muted);font-weight:600;padding:10px var(--sp3);border-radius:var(--r2)}
.navlink:hover,.navlink.on{color:var(--ink);background:var(--s3)}
.tagline{margin:var(--sp2) 0 0}
.stamp{margin:var(--sp1) 0 0}

/* the first screen */
.first{margin:var(--sp6) 0 var(--sp5);gap:0 var(--sp7)}
.first h1{font-size:var(--t5);margin:0 0 var(--sp3);max-width:22ch}
.hero-sub{margin:0 0 var(--sp4);max-width:56ch}
.ask{background:var(--s1);border:0;border-radius:var(--r3);padding:var(--sp4) var(--sp4) var(--sp4);box-shadow:var(--shade)}
.ask label.primary{font-size:var(--t2)}
.ask input,.ask select,.ask-opt select,.controls input,.controls select,.nlform input,.nlform select{
  background:var(--s2);border:1px solid var(--line-strong);border-radius:var(--r2);padding:10px var(--sp3);font-size:var(--t3)}
.ask input:hover,.ask select:hover,.controls input:hover,.controls select:hover,.nlform input:hover,.nlform select:hover{border-color:var(--muted)}
.ask #miles{font-family:var(--display);font-size:var(--t5);font-weight:700;letter-spacing:-.02em;padding:var(--sp2) var(--sp4);
  border-width:1px;min-height:60px;max-width:320px}
.ask-opt{gap:var(--sp3) var(--sp5);padding:var(--sp4) 0 0}
.work{margin:var(--sp3) 0 0;font-size:var(--t2);max-width:62ch}
.first-rn{padding:var(--sp1) 0 0}

/* the real number (motion lane): sizes to the scale, money in the display face */
.rn-op,.rn-v{font-size:var(--t3)}
.rn-l{font-size:var(--t2)}
.rn-v small{font-size:var(--t1)}
.rn-tot .rn-l{font-size:var(--t2)}
.rn-tot .rn-v{font-family:var(--display);font-size:var(--t6);color:var(--money);text-shadow:var(--glow);letter-spacing:-.03em}
.rn-tot .rn-v small{font-size:var(--t2)}
.rn-tot .rn-b{background:var(--money);border-radius:var(--r1)}
.rn-rule{opacity:.9}
.rn-cap{margin-top:var(--sp3)}

/* cards and receipts: a surface, no border, numbers on one baseline grid of 8 */
.receipt,.picks,.controls,.glossary,.legend,section.coverage,section.rules,.partners,.newsletter,.tablewrap,table.math{
  background:var(--s1);border:0;border-radius:var(--r3);box-shadow:var(--shade)}
.receipt{padding:var(--sp4) var(--sp4) var(--sp3)}
.receipt:hover{background:var(--s2)}
.receipt.big{padding:var(--sp5) var(--sp5) var(--sp4)}
.receipt.big:hover{background:var(--s1)}
.cards{gap:var(--sp3)}
.rc-head{margin:0 0 var(--sp2)}
.rc-car{font-family:var(--display);font-size:var(--t3);font-weight:650;letter-spacing:-.01em;margin:0 0 2px}
.rc-where{margin:0 0 var(--sp2)}
.rc-adv{font-size:var(--t2);padding:var(--sp2) 0;border-bottom:1px dashed var(--line-strong)}
.rc-adv .rc-v{font-size:var(--t3);font-weight:500}
.rc-lines{padding:var(--sp1) 0 var(--sp2);border-bottom:1px solid var(--line-strong)}
.rc-line{font-size:var(--t2);padding:var(--sp1) 0}
.rc-v{font-size:var(--t2)}
.rc-pen,.rc-pen .rc-v{color:var(--warn)}
.rc-total{padding:var(--sp2) 0 0}
.rc-total .rc-l{font-size:var(--t2)}
.rc-sum{font-family:var(--display);font-size:var(--t5);font-weight:700;letter-spacing:-.03em;color:var(--money);text-shadow:var(--glow)}
.receipt.big .rc-sum{font-size:var(--t6)}
.receipt.big .rc-line,.receipt.big .rc-adv{font-size:var(--t2);padding:var(--sp2) 0}
.receipt.big .rc-v{font-size:var(--t3)}
.receipt.big .rc-car{font-size:var(--t4)}
.top3{margin:0 0 var(--sp5)}
.top3 h2{font-family:var(--body);font-size:var(--t2);font-weight:600;color:var(--muted);letter-spacing:0;margin:0 0 var(--sp3)}

/* chips: one shape, three states */
.chips{gap:var(--sp2);margin:0 0 var(--sp5)}
.chip{background:var(--s1);border:1px solid var(--line);color:var(--ink);font-size:var(--t2);font-weight:600;padding:var(--sp2) var(--sp4);min-height:40px;box-shadow:var(--shade)}
.chip:hover{background:var(--s2);border-color:var(--line-strong)}
.chip.on,.chip.make.on{background:var(--ink);color:var(--bg);border-color:var(--ink);box-shadow:none}
.chip.make{color:var(--muted);font-weight:500}
.mode{background:var(--s2);border:1px solid var(--line-strong);color:var(--muted);font-size:var(--t2)}
.mode.active{background:var(--ink);color:var(--bg);border-color:var(--ink)}

/* controls */
.controls{padding:var(--sp4);margin-bottom:var(--sp4)}
.controls-h{font-family:var(--body);font-size:var(--t3);font-weight:600;margin:0 0 var(--sp2)}
.control-row{gap:var(--sp3) var(--sp4)}
.more-filters summary{font-size:var(--t2);padding:var(--sp3) 0}
.hint{margin:var(--sp3) 0 0}

/* the table: head one tone up, rows divided by a hairline, no outer border */
thead th{background:var(--s2);font-size:var(--t1);color:var(--muted);padding:var(--sp3) var(--sp3);border-bottom:0;letter-spacing:.01em}
tbody td{padding:var(--sp3);border-bottom:1px solid var(--line)}
tbody tr:hover{background:var(--s2)}
td.total{font-family:var(--display);font-size:var(--t4);font-weight:700;letter-spacing:-.02em;color:var(--money);text-shadow:var(--glow)}
td.total .sub{font-family:var(--body);letter-spacing:0}
td.car a{font-weight:600}
.sub{font-size:var(--t1);color:var(--muted)}
.count{margin:var(--sp3) 0 var(--sp5)}
.empty{padding:var(--sp7) var(--sp4)}
table.math th{font-size:var(--t2);padding:var(--sp3) var(--sp4);border-bottom:1px solid var(--line)}
table.math td{padding:var(--sp3) var(--sp4);border-bottom:1px solid var(--line);font-size:var(--t2)}
table.math{overflow:clip;margin:0 0 var(--sp4)}
table.cov td,table.cov th{padding:var(--sp2) var(--sp3)}
td.unknown,.unknown{color:var(--warn);font-weight:600;font-size:var(--t1);letter-spacing:.02em}

/* badges: sentence case, a quiet pill. The trust words say what they mean without shouting. */
.tag{font-size:var(--t1);font-weight:600;letter-spacing:0;text-transform:none;border-radius:999px;padding:3px var(--sp2);
  border:1px solid var(--line-strong);color:var(--muted);background:var(--s2)}
.tag.warn{color:var(--bad);border-color:var(--bad);background:var(--s1)}
.badge-premium{background:var(--s2);border:0;border-left:3px solid var(--line-strong);border-radius:var(--r2);padding:var(--sp3) var(--sp4);margin:var(--sp4) 0}
.note{background:var(--s2);border:0;border-radius:var(--r2);padding:var(--sp3) var(--sp4)}
.warn-note{border-left:3px solid var(--warn)}
.bracket{border:1px dashed var(--warn);color:var(--warn);border-radius:var(--r2)}

/* buttons: one primary a screen, lime to mint, a soft lift. Ghost is the only other kind. */
.btn{background:var(--btn-bg);color:var(--btn-ink);font-size:var(--t2);font-weight:700;padding:var(--sp3) var(--sp5);border-radius:999px;box-shadow:var(--btn-glow)}
.btn:hover{filter:brightness(1.03)}
.btn:active{filter:brightness(.97)}
.btn.ghost{background:var(--s1);color:var(--ink);border:1px solid var(--line-strong);box-shadow:none}
.btn.ghost:hover{background:var(--s2)}
.srclink{background:var(--s1);border:1px solid var(--line-strong);border-radius:999px;padding:var(--sp3) var(--sp4);box-shadow:var(--shade)}
.srclink:hover{background:var(--s2);text-decoration:none}

/* picks and the index */
.picks{padding:var(--sp4) var(--sp4);margin:0 0 var(--sp4)}
.picks h2{font-family:var(--body);font-weight:600;letter-spacing:0}
.picks li{padding:var(--sp2) 0;border-bottom:1px solid var(--line)}
.picks b{color:var(--money-sm);text-shadow:none}
.more li b{color:var(--money-sm);text-shadow:none}
.deal-sum b{font-family:var(--display);font-size:var(--t4);letter-spacing:-.02em;color:var(--money);text-shadow:none}
.rlci-num b{font-family:var(--display);font-size:var(--t6);color:var(--money);text-shadow:var(--glow);letter-spacing:-.03em}
.rlci-chart .last{fill:var(--money)}

/* glossary, legend, prose */
.glossary{padding:0 var(--sp4)}
.glossary summary{font-size:var(--t3);padding:var(--sp4) 0}
.glossary dl,.legend dl{gap:var(--sp2) var(--sp4)}
.legend,section.coverage,section.rules{padding:var(--sp4) var(--sp4);margin-bottom:var(--sp4)}
.prose h2{margin:var(--sp6) 0 var(--sp3)}
.prose code{background:var(--s2);border-radius:var(--r1);font-size:var(--t1)}
.crumbs{margin:var(--sp5) 0 0}
.next{margin:var(--sp4) 0}
.more{margin:var(--sp6) 0 var(--sp2)}
.more li{padding:var(--sp2) 0;border-bottom:1px solid var(--line)}

/* newsletter: the one primary button on the page lives here when no deal card is on screen */
.newsletter{padding:var(--sp5) var(--sp5);margin:0 0 var(--sp4)}
.nl-grid{gap:var(--sp3)}
.consent{margin:var(--sp3) 0}
.nlstate.err{color:var(--bad)}

/* footer */
.foot{border-top:1px solid var(--line);padding:var(--sp5) 20px var(--sp7);font-size:var(--t2)}
.footnav a{padding:var(--sp2) var(--sp1)}

/* photos (image lane): one crop, a soft inner edge, the credit under it in one size */
.carimg img{aspect-ratio:16/10;object-fit:cover;border-radius:var(--r2);background:var(--s2);
  box-shadow:inset 0 0 0 1px var(--photo-edge)}
.carimg figcaption{margin:var(--sp1) 0 0;font-size:var(--t1);color:var(--muted);line-height:1.4;text-wrap:pretty}
.carimg figcaption a{color:var(--muted);text-decoration:underline;text-underline-offset:2px}
.rc-img{margin:0 0 var(--sp3)}
.deal-img{margin:var(--sp3) 0 var(--sp3)}
.carimg.sil svg{color:var(--line-strong)}

/* new classes from the integration build (PRD section 8). Assumed names, listed in SPEC.md. */
.quickpicks,.quick-picks{display:flex;flex-wrap:wrap;gap:var(--sp2);margin:var(--sp2) 0 0}
.quickpicks .chip,.quick-picks .chip,.qp{min-height:40px;padding:var(--sp2) var(--sp3);font-variant-numeric:tabular-nums}
.answer-h,.first-answer h2{font-family:var(--display);font-size:var(--t4);letter-spacing:-.015em;color:var(--ink);margin:var(--sp5) 0 var(--sp3)}
.covering,.now-covering{font-size:var(--t1);color:var(--muted);margin:var(--sp3) 0 var(--sp5);line-height:1.6}
.assumptions,.assume{background:var(--s1);border:0;border-radius:var(--r3);box-shadow:var(--shade);padding:var(--sp4);margin:0 0 var(--sp4)}
.assumptions summary,.assume summary{cursor:pointer;font-weight:600;font-size:var(--t2);min-height:44px;display:flex;align-items:center}
.assumptions dl,.assume dl{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--sp2) var(--sp4);margin:var(--sp3) 0 0;font-size:var(--t2)}
.assumptions dd,.assume dd{margin:0;color:var(--ink);font-variant-numeric:tabular-nums;text-align:right}
.assumptions dt,.assume dt{color:var(--muted)}
.rc-plain,.card-line{font-size:var(--t2);color:var(--muted);margin:var(--sp2) 0 0;text-wrap:pretty}
.rc-plain b,.card-line b{color:var(--ink);font-weight:600}
.charging,.charge{display:flex;gap:var(--sp2);flex-wrap:wrap}
.charging .mode,.charge .mode{min-height:44px}

/* phone: the same six sizes, tighter rhythm */
@media (max-width:720px){
  .top{padding:var(--sp2) 0}
  .brand{font-size:var(--t3)}
  .navlink{font-size:var(--t1);padding:10px var(--sp2);min-height:40px}
  .first{margin:var(--sp4) 0 var(--sp4)}
  .first h1{font-size:var(--t5)}
  .first-ask.ask,.ask{padding:var(--sp3)}
  .ask #miles{font-size:var(--t5);min-height:56px;max-width:none}
  .rc-sum{font-size:var(--t5)}
  .receipt.big .rc-sum{font-size:var(--t6)}
  .rn-tot .rn-v{font-size:var(--t6)}
  .controls{padding:var(--sp3)}
  .control-row{gap:var(--sp2) var(--sp3)}
  tbody td,thead th,table.cov td,table.cov th{padding:var(--sp2)}
  section.coverage table.cov,.prose table.cov{display:block;overflow-x:auto;max-width:100%}
  .newsletter{padding:var(--sp4) var(--sp3)}
  .foot{padding:var(--sp4) var(--sp4) var(--sp6)}
  .rlci-num b{font-size:var(--t6)}
  .chips{gap:var(--sp2) 6px}
  .chip{padding:var(--sp2) var(--sp3)}
}
@media (max-width:900px){
  td.car,th:first-child{background:var(--s1)}
  thead th:first-child{background:var(--s2)}
  tbody tr:hover td.car{background:var(--s2)}
  .tablewrap::after{background:linear-gradient(90deg,transparent,var(--s1))}
}

/* ---- round 3 (Oct 30 2026): geography, insurance, charging, phone rows. Tokens and t1..t6 only. ---- */
/* the hero: the promise fills the left column under the question */
.first-lede{min-width:0}
.first-promise{font-size:var(--t3);color:var(--muted);margin:0;max-width:40ch;text-wrap:pretty}
/* the assumptions rows: one grid per row, so a label never collapses to one word a line */
.assume dl,.assumptions dl{grid-template-columns:minmax(0,1fr);gap:var(--sp3)}
.a-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:var(--sp2) var(--sp4);align-items:start}
.a-row dt{min-width:0;overflow-wrap:normal;font-size:var(--t2);color:var(--muted)}
.a-row dd{min-width:0;margin:0;text-align:left;font-size:var(--t2)}
.a-basis{display:block;font-size:var(--t1);color:var(--muted);overflow-wrap:anywhere}
.own{font-size:var(--t1)}
.own input{min-height:44px;font-size:var(--t3)}
@media (max-width:640px){ .a-row{grid-template-columns:minmax(0,1fr)} }
/* charging: three 44px chips beside the state chooser */
.charge-seg{border:0;padding:0;margin:var(--sp3) 0 0;min-width:0}
.charge-seg legend,.charge-seg .lbl{font-size:var(--t2);font-weight:600;color:var(--ink);padding:0;margin:0 0 var(--sp2)}
.segs{display:flex;flex-wrap:wrap;gap:var(--sp2)}
.seg{position:relative;display:inline-flex}
.seg input{position:absolute;opacity:0;width:1px;height:1px}
.seg span{display:inline-flex;align-items:center;min-height:44px;padding:0 var(--sp4);border-radius:999px;border:1px solid var(--line-strong);
  background:var(--s2);color:var(--ink);font-size:var(--t2);font-weight:600;cursor:pointer}
.seg input:checked + span,a.seg[aria-current] span{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.seg input:focus-visible + span{outline:2px solid var(--focus);outline-offset:2px}
a.seg:hover{text-decoration:none}
a.seg:hover span{border-color:var(--muted)}
.charge-note{font-size:var(--t1);color:var(--warn);margin:var(--sp2) 0 0;max-width:52ch}
.ev-charge{background:var(--s1);border-radius:var(--r3);box-shadow:var(--shade);padding:var(--sp4);margin:0 0 var(--sp4)}
.ev-charge .sub{margin:var(--sp2) 0 0}
/* the local count and the "only my state" switch, under the answer heading */
.local-count{font-size:var(--t2);color:var(--muted);margin:0 0 var(--sp2);max-width:72ch;text-wrap:pretty}
.only-state{margin:0 0 var(--sp2)}
.only-state[hidden]{display:none}
.toggle{display:inline-flex;align-items:center;gap:var(--sp2);min-height:44px;font-size:var(--t2);font-weight:600;cursor:pointer}
.toggle input{width:20px;height:20px;accent-color:var(--money)}
/* insurance band on cards; the basis printed under every receipt line */
.rcard-ins{font-size:var(--t1);color:var(--muted);margin:var(--sp1) 0 0}
.rc-b{display:block;font-size:var(--t1);color:var(--muted);line-height:1.4;max-width:52ch;margin:2px 0 0}
/* shortcut and brand chips now sit under More filters */
.more-filters .chips{margin:var(--sp2) 0 var(--sp4)}
.results .covering{margin:var(--sp4) 0 var(--sp2)}
/* desktop: the first card's price clears the fold */
@media (min-width:901px){
  .first{margin:var(--sp5) 0 var(--sp4)}
  .rcard .carimg img{aspect-ratio:2/1}
  .where-row{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp2) var(--sp4)}
}
/* the phone row (round 3): car with its mark, all-in big, monthly small, one trust line with a
   details toggle; no sideways scroll in simple view */
.ptrust{display:none}
@media (max-width:640px){
  table.mode-simple,table.list{display:block;width:100%}
  table.mode-simple thead,table.list thead{display:none}
  table.mode-simple tbody,table.list tbody{display:block}
  table.mode-simple tr,table.list tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--sp1) var(--sp3);
    padding:var(--sp3);border-bottom:1px solid var(--line)}
  table.mode-simple td,table.list td{display:block;padding:0;border:0;position:static;min-width:0;max-width:none;box-shadow:none;background:transparent}
  table.mode-simple td.car,table.list td.car{grid-column:1;grid-row:1 / span 2}
  table.mode-simple td.total,table.list td.total{grid-column:2;grid-row:1;text-align:right;font-size:var(--t5)}
  table.mode-simple td:nth-child(3),table.list td:nth-child(3){display:block;grid-column:2;grid-row:2;text-align:right;font-size:var(--t1);color:var(--muted)}
  table.mode-simple td:nth-child(n+4),table.list td:nth-child(n+4){display:none}
  table.mode-simple td.car > .sub,table.list td.car > .sub{display:none}
  .ptrust{display:block;margin:var(--sp1) 0 0}
  .ptrust summary{display:inline-flex;align-items:center;min-height:44px;font-size:var(--t1);color:var(--muted);cursor:pointer;list-style:none}
  .ptrust summary::-webkit-details-marker{display:none}
  .ptrust summary::after{content:"+";margin-left:var(--sp2);color:var(--link)}
  .ptrust[open] summary::after{content:"\2212"}
  .ptrust-d{font-size:var(--t1);color:var(--muted);display:flex;flex-wrap:wrap;gap:var(--sp1) var(--sp3)}
  .tablewrap:has(> table.mode-simple),.tablewrap:has(> table.list){overflow:visible}
  .tablewrap:has(> table.mode-simple)::after,.tablewrap:has(> table.list)::after{display:none}
  .seg span{padding:0 var(--sp3)}
}
.local-row{display:flex;flex-wrap:wrap;align-items:center;gap:0 var(--sp4);margin:0 0 var(--sp1)}
.local-row .local-count,.local-row .only-state{margin:0}
.first > .assume{margin:var(--sp3) 0 0}
@media (min-width:901px){
  .first{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"lede ask" "assume ask";align-items:start;row-gap:0}
  .first > .first-lede{grid-area:lede}
  .first > .ask{grid-area:ask;grid-row:1 / span 2}
  .first > .assume{grid-area:assume;margin:var(--sp4) 0 0;align-self:start}
  .first-ask .where{margin:var(--sp3) 0 var(--sp2)}
  .first-ask .where .lbl{font-size:var(--t3)}
  .first-ask .mchips{margin-bottom:var(--sp2)}
  .results-h{margin-top:0}
}
@media (min-width:901px){
  .rcard .carimg img{aspect-ratio:5/2}
  .first{margin-top:var(--sp4)}
  .allin-def{margin:0 0 var(--sp2)}
}
/* round 3, seat B: the assumptions panel is a list of rows, never a two-column grid of rows */
.assume dl,.assumptions dl{display:block}
.assume .a-row{display:grid;grid-template-columns:minmax(96px,32%) minmax(0,1fr);gap:var(--sp1) var(--sp3);padding:var(--sp2) 0;border-top:1px solid var(--line)}
.assume .a-row:first-child{border-top:0}
.assume .own span{flex:none}
@media (max-width:380px){ .assume .a-row{grid-template-columns:minmax(0,1fr)} }
/* "See all N deals ranked": flex drops the spaces between items, so the gap puts them back */
.see-all a{gap:.3em}
#see-all-n{display:inline}
/* the budget slider in the brand tone, both themes */
#ceiling{accent-color:var(--money);width:100%;max-width:320px;min-height:44px}
/* desktop rows: the meta line runs wide instead of stacking, so a row is not 130px of blank */
@media (min-width:901px){
  td.car .sub{max-width:62ch;display:flex;flex-wrap:wrap;gap:2px var(--sp3)}
  tbody td{padding:var(--sp2) var(--sp3)}
}
/* Data status tables stack their cells on a phone instead of clipping */
@media (max-width:640px){
  .prose table.cov,.prose table.cov tbody,.prose table.cov tr,.prose table.cov td,.prose table.cov th{display:block;width:auto}
  .prose table.cov thead{display:none}
  .prose table.cov tr{padding:var(--sp2) 0;border-bottom:1px solid var(--line)}
  .prose table.cov td,.prose table.cov th{border:0;padding:var(--sp1) 0;text-align:left;overflow-wrap:anywhere}
  .prose table.cov td[data-label]::before{content:attr(data-label);color:var(--muted)}
  .prose .tablewrap{overflow:visible}
}
.noscript-note{font-size:var(--t2);color:var(--warn);margin:var(--sp2) 0 0}
.see-all a{display:inline-block;min-height:0;padding:var(--sp3) 0;line-height:1.4}
@media (max-width:720px){
  .first-promise{font-size:var(--t2);margin:0 0 var(--sp2)}
  .first > .assume{padding:0 var(--sp3);margin:var(--sp2) 0 0}
  .charge-seg{margin:var(--sp2) 0 0}
  .charge-seg legend{margin:0 0 var(--sp1)}
  .local-row{gap:0 var(--sp3)}
}