/* lease-findr UI. Tokens: DESIGN.md ("Ledger", LH-201). Change values here, never per component.
   Layout: header / [filter rail | results (List or Map view) | the detail drawer]. The map is a view, not a pane (LH-201).
   Rail becomes an off-canvas sheet < 1100px; drawer goes full-screen and Map view stacks the map above the table < 760px. */
:root{
  --bg:oklch(.962 .006 100); --panel:oklch(.990 .004 100); --ink:oklch(.23 .012 100); --ink2:oklch(.34 .012 100);
  --mute:oklch(.47 .013 100); --faint:oklch(.52 .012 100); --line:oklch(.905 .008 100); --line2:oklch(.94 .006 100);
  --line-strong:oklch(.64 .012 100); --hover:oklch(.975 .006 100);
  --hl:var(--ink); --hl-ink:var(--panel); --hl-edge:var(--ink);                 /* no brand hue: ink on paper (LH-201) */
  --accent:oklch(.25 .02 100); --accent-ink:oklch(.99 .004 100); --focus:oklch(.30 .02 100);
  --good:oklch(.50 .12 150); --good-ink:oklch(.42 .11 150); --warn:oklch(.52 .11 65); --warn-ink:oklch(.45 .10 62);
  --bad:oklch(.52 .17 27); --bad-ink:oklch(.46 .16 27);
  --sel:color-mix(in oklch, var(--ink) 8%, var(--panel));
  --shadow:0 10px 40px oklch(.2 .01 100 / .16), 0 2px 6px oklch(.2 .01 100 / .06);
  --f:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
  --fs-xs:11.5px; --fs-s:12.5px; --fs-m:13.5px; --fs-l:15px; --fs-xl:18px; --fs-2xl:22px; --fs-3xl:28px;
  --r-ctl:4px; --r-panel:6px;
  --railw:264px; --sidew:0px; --drawerw:470px; --headh:48px;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:oklch(.165 .006 100); --panel:oklch(.200 .007 100); --ink:oklch(.94 .008 100); --ink2:oklch(.85 .010 100);
  --mute:oklch(.72 .012 100); --faint:oklch(.68 .012 100); --line:oklch(.30 .009 100); --line2:oklch(.25 .008 100);
  --line-strong:oklch(.52 .012 100); --hover:oklch(.235 .008 100);
  --hl:oklch(.94 .008 100); --hl-ink:oklch(.200 .007 100); --hl-edge:var(--hl);   /* dark: paper on ink */
  --accent:oklch(.94 .008 100); --accent-ink:oklch(.200 .007 100); --focus:var(--hl);
  --good:oklch(.76 .14 150); --good-ink:oklch(.80 .13 150); --warn:oklch(.79 .13 70); --warn-ink:oklch(.82 .12 72);
  --bad:oklch(.70 .16 27); --bad-ink:oklch(.76 .15 27);
  --shadow:0 10px 40px oklch(.10 .01 100 / .55), 0 2px 6px oklch(.10 .01 100 / .35); --swring:oklch(.94 .008 100 / .28); color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:oklch(.165 .006 100); --panel:oklch(.200 .007 100); --ink:oklch(.94 .008 100); --ink2:oklch(.85 .010 100);
  --mute:oklch(.72 .012 100); --faint:oklch(.68 .012 100); --line:oklch(.30 .009 100); --line2:oklch(.25 .008 100);
  --line-strong:oklch(.52 .012 100); --hover:oklch(.235 .008 100);
  --hl:oklch(.94 .008 100); --hl-ink:oklch(.200 .007 100); --hl-edge:var(--hl);   /* dark: paper on ink */
  --accent:oklch(.94 .008 100); --accent-ink:oklch(.200 .007 100); --focus:var(--hl);
  --good:oklch(.76 .14 150); --good-ink:oklch(.80 .13 150); --warn:oklch(.79 .13 70); --warn-ink:oklch(.82 .12 72);
  --bad:oklch(.70 .16 27); --bad-ink:oklch(.76 .15 27);
  --shadow:0 10px 40px oklch(.10 .01 100 / .55), 0 2px 6px oklch(.10 .01 100 / .35); --swring:oklch(.94 .008 100 / .28); color-scheme:dark}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--sel:color-mix(in oklch, var(--ink) 12%, var(--panel))}}
:root[data-theme="dark"]{--sel:color-mix(in oklch, var(--ink) 12%, var(--panel))}

/* ==================================================================== components (LH-123, explorer owner)
   Everything below consumes the tokens above. Buyer axis: --good = good for the buyer, --bad = bad for the
   buyer, --warn = assumed. Tinted pill = color-mix(X 14%, panel) + X-ink text. */
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{background:var(--bg);color:var(--ink);font:var(--fs-m)/1.4 var(--f);display:flex;flex-direction:column;overflow:hidden;-webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
a{color:var(--ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px}
a:hover{background:var(--sel)}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.num{font-variant-numeric:tabular-nums}
.mono{font-family:var(--mono)}
.muted{color:var(--mute)}
.gd{color:var(--good-ink)} .bd{color:var(--bad-ink)} .vs0{color:var(--ink2)}
[hidden]{display:none!important}
.sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:fixed;left:8px;top:-60px;z-index:200;background:var(--hl);color:var(--hl-ink);border:1px solid var(--hl-edge);padding:8px 12px;border-radius:var(--r-ctl);font-weight:650;text-decoration:none}
.skip:focus{top:8px}
kbd{font:var(--fs-xs) var(--mono);padding:0 5px;border:1px solid var(--line-strong);border-bottom-width:2px;border-radius:var(--r-ctl);color:var(--ink2);background:var(--panel)}

/* shared controls */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:30px;padding:0 12px;border-radius:var(--r-ctl);border:1px solid var(--line-strong);background:var(--panel);color:var(--ink);font-size:var(--fs-s);font-weight:500;white-space:nowrap;text-decoration:none}
.btn:hover{background:var(--hover)}
.btn.primary{background:var(--hl);border-color:var(--hl-edge);color:var(--hl-ink);font-weight:650}
.btn.primary:hover{background:color-mix(in oklch,var(--hl) 88%,var(--ink))}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn.primary:disabled:hover{background:var(--hl)}
.btn svg{width:14px;height:14px}
.linkbtn{border:0;background:none;color:var(--ink);padding:2px 0;min-height:24px;font-size:var(--fs-s);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px}
.linkbtn:hover{background:var(--sel)}
.iconbtn{border:1px solid transparent;background:none;border-radius:var(--r-ctl);color:var(--mute);height:30px;min-width:30px;padding:0 6px;display:inline-flex;align-items:center;justify-content:center;gap:4px;font-size:var(--fs-s)}
.iconbtn:hover{background:var(--hover);border-color:var(--line-strong);color:var(--ink)}
.iconbtn.sm{height:24px;min-width:24px}
.iconbtn svg{width:15px;height:15px}
.pill{display:inline-block;padding:1px 7px;border-radius:999px;font-size:var(--fs-xs);font-weight:600;white-space:nowrap}
.pill.good{background:color-mix(in oklch,var(--good) 14%,var(--panel));color:var(--good-ink)}
.pill.warn{background:color-mix(in oklch,var(--warn) 14%,var(--panel));color:var(--warn-ink)}
.pill.bad{background:color-mix(in oklch,var(--bad) 14%,var(--panel));color:var(--bad-ink)}
.tag-assumed{display:inline-block;padding:0 6px;border-radius:999px;font-size:var(--fs-xs);font-weight:600;line-height:17px;background:color-mix(in oklch,var(--warn) 14%,var(--panel));color:var(--warn-ink);white-space:nowrap;text-transform:none;letter-spacing:0}
.hint{color:var(--faint);font-size:var(--fs-xs);margin:6px 0 0;line-height:1.4}
/* LH-199: a small "?" that links to help.html#anchor. 18px circle, 24px hit area. */
.qhelp{position:relative;display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;margin:0 4px 0 2px;border:1px solid var(--line-strong);border-radius:999px;background:var(--panel);color:var(--ink2);font-size:var(--fs-xs);font-weight:650;line-height:1;text-decoration:none;vertical-align:1px}.qhelp::after{content:"";position:absolute;inset:-4px}a.qhelp:hover,a:hover>.qhelp{background:var(--sel);color:var(--ink)}
.callout{margin-top:9px;padding:7px 9px;border-radius:var(--r-ctl);background:var(--line2);color:var(--ink2);font-size:var(--fs-xs);line-height:1.45}
.callout.warn{background:color-mix(in oklch,var(--warn) 14%,var(--panel));color:var(--warn-ink)}
.callout.bad{background:color-mix(in oklch,var(--bad) 14%,var(--panel));color:var(--bad-ink)}

/* ---------- header: one 48px row, shared by every page (LH-209 S1: common.js renderNav) */
.top{height:var(--headh);flex:none;display:flex;align-items:center;gap:8px;padding:0 14px;background:var(--panel);border-bottom:1px solid var(--line);min-width:0;overflow:hidden}
.brand-h{margin:0;font-size:inherit;font-weight:inherit;flex:none}
.brand{display:inline-flex;align-items:center;min-height:24px;font-size:var(--fs-xl);font-weight:650;letter-spacing:-.01em;white-space:nowrap;color:var(--ink);text-decoration:none}
.brand:hover{background:none}
.brand{font-weight:600}
.brand .mark{width:14px;height:14px;margin-right:7px;fill:currentColor;flex:none}   /* ascending bars (LH-201) */
.spacer{flex:1}
.gnav{display:flex;gap:2px;margin-left:6px;min-width:0}
.gnav a{display:inline-flex;align-items:center;gap:6px;min-height:30px;padding:0 10px;border-radius:var(--r-ctl);color:var(--ink2);font-size:var(--fs-s);font-weight:550;text-decoration:none;white-space:nowrap}
.gnav a:hover{background:var(--hover)}
.gnav a[aria-current="page"]{color:var(--ink);font-weight:650;border-radius:0;box-shadow:inset 0 -2px 0 var(--ink)}
.balpill{display:inline-flex;align-items:baseline;gap:3px;min-height:30px;padding:5px 10px;border:1px solid var(--line-strong);border-radius:999px;color:var(--ink2);font-size:var(--fs-s);white-space:nowrap;text-decoration:none;flex:none}
.balpill b{color:var(--ink);font-weight:700}
.balpill:hover{background:var(--hover)}
.balpill.is-warn{background:color-mix(in oklch,var(--warn) 14%,var(--panel));color:var(--warn-ink)}
.balpill.is-warn b{color:var(--warn-ink)}
.balpill.is-bad{background:color-mix(in oklch,var(--bad) 14%,var(--panel));color:var(--bad-ink)}
.balpill.is-bad b{color:var(--bad-ink)}
.hbtn{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 10px;border:1px solid var(--line-strong);background:var(--panel);border-radius:var(--r-ctl);color:var(--ink2);white-space:nowrap;font-size:var(--fs-s);text-decoration:none;flex:none}
.hbtn:hover{background:var(--hover)}
.hbtn[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.hbtn svg{width:15px;height:15px;flex:none}
.amenu-btn{border-color:transparent;padding:0 6px 0 4px;color:var(--ink);max-width:260px;min-width:0}
.amenu-btn:hover,.amenu-btn[aria-expanded="true"]{border-color:var(--line-strong)}
.amenu-btn .av{width:22px;height:22px;border-radius:50%;background:var(--ink);color:var(--panel);display:inline-grid;place-items:center;font-size:var(--fs-xs);font-weight:700;flex:none}
.amenu-btn .who{overflow:hidden;text-overflow:ellipsis;min-width:0;font-size:var(--fs-s)}
.amenu-btn .mlbl{display:none}
.amenu-btn .caret{font-size:10px;color:var(--mute)}
.hmenu{position:fixed;z-index:80;width:250px;max-width:calc(100vw - 16px);padding:4px;background:var(--panel);border:1px solid var(--line-strong);border-radius:var(--r-panel);box-shadow:var(--shadow)}
.hmenu .mnav{display:none}
.hmenu .mgrp{display:flex;flex-direction:column;gap:1px}
.hmenu a,.hmenu button{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;width:100%;min-height:36px;padding:6px 10px;border:0;background:none;border-radius:var(--r-ctl);color:var(--ink);font-size:var(--fs-m);text-align:left;text-decoration:none;white-space:nowrap}
.hmenu a:hover,.hmenu button:hover{background:var(--hover)}
.hmenu a[aria-current="page"]{background:var(--sel);font-weight:650}
.hmenu small{display:block;color:var(--mute);font-size:var(--fs-xs);max-width:100%;overflow:hidden;text-overflow:ellipsis}
.hmenu #themeBtn{flex-direction:row;align-items:center;justify-content:flex-start;gap:8px}
.hmenu #themeBtn svg{width:15px;height:15px}
.hmenu .mgrp #logoutBtn{border-top:1px solid var(--line);border-radius:0;margin-top:3px;padding-top:9px}
.only-narrow,.only-phone{display:none}
/* first run (LH-209 S6): an account with no searches gets no filter rail and no Filters button */
body.nosearch .rail,body.nosearch #railBtn,body.nosearch .backdrop{display:none!important}
body.nosearch .layout{grid-template-columns:minmax(0,1fr) var(--sidew)}

/* ---------- context bar: Showing · [search switcher ▾] · last run · credits a run · status · Edit search (LH-209 S2) */
.ctx{position:relative;z-index:7;flex:none;display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;min-height:40px;padding:5px 14px;background:var(--panel);border-bottom:1px solid var(--line);min-width:0}
.ctx .lbl{font-size:var(--fs-xs);font-weight:650;text-transform:uppercase;letter-spacing:.06em;color:var(--mute)}
.swwrap{position:relative;min-width:0;max-width:100%}
.swb{display:inline-flex;align-items:center;gap:7px;max-width:100%;text-align:left;min-height:30px;padding:0 10px;border:1px solid var(--line-strong);border-radius:var(--r-ctl);background:var(--panel);color:var(--ink);font-size:var(--fs-s);font-weight:650;white-space:nowrap}
.swb:hover{background:var(--hover)}
.swb .t{overflow:hidden;text-overflow:ellipsis;min-width:0}
.swb small{font-weight:450;color:var(--mute);font-size:inherit}
.swb .caret{font-size:10px;color:var(--mute);flex:none}
.swpop{position:absolute;top:calc(100% + 6px);left:0;z-index:50;width:440px;max-width:calc(100vw - 28px);padding:4px;background:var(--panel);border:1px solid var(--line-strong);border-radius:var(--r-panel);box-shadow:var(--shadow)}
.swpop ul{list-style:none;margin:0;padding:0;max-height:min(60vh,420px);overflow:auto}
.swpop li[role="option"]{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1px 12px;padding:7px 10px;border-radius:var(--r-ctl);cursor:pointer;color:var(--ink);font-size:var(--fs-s)}
.swpop li[role="option"]:hover{background:var(--hover)}
.swpop li[aria-selected="true"]{background:var(--sel);box-shadow:inset 0 0 0 1px var(--line-strong)}
.swpop li:focus-visible{outline:2px solid var(--focus);outline-offset:-2px}
.swpop li b{font-weight:650;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.swpop li .s{color:var(--mute);font-size:var(--fs-xs)}
.swpop li .r{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.swpop .warn{color:var(--warn-ink)}
.swpop li.all{margin-top:4px;padding-top:11px;border-top:1px solid var(--line);border-radius:0 0 var(--r-ctl) var(--r-ctl)}
.swacts{display:flex;flex-direction:column;margin-top:4px;padding-top:4px;border-top:1px solid var(--line)}
.swacts a{display:flex;align-items:center;min-height:34px;padding:0 10px;border-radius:var(--r-ctl);color:var(--ink);font-weight:600;text-decoration:none}
.swacts a:hover{background:var(--hover)}
.meta{display:flex;flex-wrap:wrap;align-items:center;gap:2px 10px;min-width:0;color:var(--mute);font-size:var(--fs-s)}
.meta .ok{color:var(--good-ink)} .meta .warn{color:var(--warn-ink)} .meta .bad{color:var(--bad-ink)}
.meta a{color:var(--ink)}
.meta .dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--good);margin-right:5px;vertical-align:1px}
.meta .dot.stale{background:var(--warn)} .meta .dot.bad{background:var(--bad)} .meta .dot.none{background:var(--line-strong)}
.badge-n{display:inline-block;min-width:18px;padding:0 5px;border-radius:999px;background:var(--accent);color:var(--accent-ink);font-size:var(--fs-xs);font-weight:700;line-height:18px;text-align:center}

/* ---------- layout */
.layout{flex:1;min-height:0;display:grid;grid-template-columns:var(--railw) minmax(0,1fr) var(--sidew)}
body.drawer-open{--sidew:var(--drawerw)}

/* ---------- rail */
.rail{background:var(--panel);border-right:1px solid var(--line);overflow-y:auto;overscroll-behavior:contain;padding:12px 14px 40px;min-width:0}
.rail-head{display:flex;align-items:center;gap:10px;margin-bottom:4px}
.rail-head h2{font-size:var(--fs-l);margin:0;font-weight:700;flex:1}
.rail-head h2:focus{outline:0}
.fgroup{margin-top:18px}
.fgroup.first{margin-top:8px}
.fgroup>.fh{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:7px}
.fh h3{margin:0;font-size:var(--fs-s);font-weight:650;color:var(--ink)}
.fh small{color:var(--faint);font-size:var(--fs-xs);white-space:nowrap}
/* Any / Only / Except at a facet group title (LH-201) */
.fmode{display:inline-flex;border:1px solid var(--line-strong);border-radius:var(--r-ctl);overflow:hidden}
.fmode button{height:22px;padding:0 7px;border:0;background:var(--panel);color:var(--mute);font-size:var(--fs-xs);font-weight:600;line-height:1}
.fmode button+button{border-left:1px solid var(--line-strong)}
.fmode button:hover{background:var(--hover);color:var(--ink)}
.fmode button[aria-pressed="true"]{background:var(--accent);color:var(--accent-ink)}
.search{width:100%;height:32px;padding:0 10px;border:1px solid var(--line-strong);border-radius:var(--r-ctl);background:var(--bg)}
.search::placeholder,.rng input::placeholder,.savev input::placeholder,.notes::placeholder{color:var(--faint)}
.chips{display:flex;flex-wrap:wrap;gap:5px}
.chip{display:inline-flex;align-items:center;gap:5px;height:26px;padding:0 8px;border:1px solid var(--line-strong);border-radius:var(--r-ctl);background:var(--panel);color:var(--ink2);font-size:var(--fs-s);white-space:nowrap;max-width:100%;user-select:none}
.chip:hover{background:var(--hover)}
.chip .ct{color:var(--faint);font-size:var(--fs-xs);font-variant-numeric:tabular-nums}
.chip .st{font-weight:700}
.chip.zero{color:var(--faint);border-style:dashed}
.chip .lbl{overflow:hidden;text-overflow:ellipsis}
.chip.on,.chip.yes{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.chip.on .ct,.chip.yes .ct{color:inherit;opacity:.85}
.chip.ex{background:color-mix(in oklch,var(--bad) 14%,var(--panel));border-color:var(--bad-ink);color:var(--bad-ink)}
.chip.ex .lbl{text-decoration:line-through}
.chip.maybe{border-style:dashed;border-color:var(--ink2);color:var(--ink);background:var(--sel)}
.chip.more{border-style:dashed;color:var(--mute)}
.sw{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--c,var(--faint));box-shadow:inset 0 0 0 1px var(--swring,oklch(.2 .01 100 / .2));flex:none}
.chip .sw{width:9px;height:9px}
.dealer-chip{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:var(--r-ctl);background:var(--sel);border:1px solid var(--line-strong);font-size:var(--fs-s);margin-top:10px}
.dealer-chip b{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dealer-chip button{border:0;background:none;color:var(--ink2);font-size:16px;line-height:1;min-width:24px;min-height:24px}
.rng{display:grid;grid-template-columns:minmax(0,1fr) 68px 68px;gap:5px;align-items:center;margin-top:5px}
.rng .rl{font-size:var(--fs-s);color:var(--ink2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rng input{width:100%;height:30px;padding:0 7px;border:1px solid var(--line-strong);border-radius:var(--r-ctl);background:var(--bg);font-variant-numeric:tabular-nums;min-width:0}
.rng input.set{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.seg{display:inline-flex;border:1px solid var(--line-strong);border-radius:var(--r-ctl);overflow:hidden}
.seg button{border:0;background:var(--panel);padding:0 11px;height:28px;font-size:var(--fs-s);color:var(--ink2)}
.seg button+button{border-left:1px solid var(--line-strong)}
.seg button[aria-pressed="true"]{background:var(--accent);color:var(--accent-ink);font-weight:600}
.views{display:flex;flex-wrap:wrap;gap:5px}
.view{display:inline-flex;align-items:center;height:26px;border:1px solid var(--line-strong);border-radius:var(--r-ctl);background:var(--panel);font-size:var(--fs-s);overflow:hidden}
.view>button{border:0;background:none;padding:0 9px;height:100%;color:var(--ink2)}
.view>button:hover{background:var(--hover)}
.view>button.x{padding:0 7px;color:var(--mute);min-width:24px}
.view>button.x:hover{color:var(--bad-ink)}
.view.active{border-color:var(--accent);background:var(--accent)}
.view.active>button{color:var(--accent-ink);font-weight:600}
.savev{display:flex;gap:6px;margin-top:7px}
.savev input{flex:1;min-width:0;height:30px;padding:0 8px;border:1px solid var(--line-strong);border-radius:var(--r-ctl);background:var(--bg);font-size:var(--fs-s)}
.optrow{display:grid;grid-template-columns:repeat(auto-fill,minmax(56px,1fr));gap:5px}
.optrow .chip{justify-content:center}
.optrow .chip.more{grid-column:span 2}
/* Options: listed features, then one package row per make */
.osub+.osub{margin-top:11px}
.osh{margin:0 0 6px;font-size:var(--fs-xs);font-weight:600;color:var(--mute)}
.hint.scope{color:var(--ink2)}
.ls{display:none}
.rail-foot{margin-top:24px;padding-top:12px;border-top:1px solid var(--line);gap:8px;flex-wrap:wrap}
.rail-legal{flex-basis:100%;margin:6px 0 0;font-size:var(--fs-xs);color:var(--mute);line-height:2}
.rail-legal a{color:var(--mute);display:inline-block;min-height:24px}
.t0 .hint{margin:9px 0 5px}

/* ---------- results toolbar */
.main{min-width:0;min-height:0;display:flex;flex-direction:column;background:var(--panel)}
.tbar{flex:none;display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;min-height:40px;padding:5px 12px;border-bottom:1px solid var(--line);background:var(--panel);min-width:0}
.segtabs{display:flex;gap:4px;flex:none}
.segtabs:empty{display:none}
.segtabs button{height:28px;padding:0 10px;border:1px solid var(--line-strong);border-radius:var(--r-ctl);background:var(--panel);color:var(--ink2);font-size:var(--fs-s);font-weight:500;white-space:nowrap}
.segtabs button:hover{background:var(--hover)}
.segtabs button[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:650}
.segtabs .n{font-variant-numeric:tabular-nums;margin-left:6px;opacity:.85}
.showing{color:var(--mute);white-space:nowrap;font-size:var(--fs-s);font-variant-numeric:tabular-nums;overflow:hidden;text-overflow:ellipsis;min-width:0}
.showing b{color:var(--ink);font-weight:700}
.showing .ld{color:var(--mute)}
.showing .ld.warn{color:var(--warn-ink)}
/* active filters as removable tokens */
.ftoks{display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px;min-width:0}
.ftok{display:inline-flex;align-items:center;gap:6px;height:24px;max-width:220px;padding:0 4px 0 8px;border:1px solid var(--line-strong);border-radius:var(--r-ctl);background:var(--panel);color:var(--ink);font-size:var(--fs-xs);font-weight:600;font-variant-numeric:tabular-nums}
.ftok .tl{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ftok .tx{color:var(--mute);font-size:10px;width:14px;text-align:center}
.ftok:hover{background:var(--hover)} .ftok:hover .tx{color:var(--ink)}
.ftok.ex{color:var(--bad-ink)}
.ftoks .linkbtn{font-size:var(--fs-xs)}
.tbar.busy .showing .ld::before{content:"";display:inline-block;width:7px;height:7px;margin-right:6px;border-radius:50%;background:var(--warn);vertical-align:1px;animation:pulse 1.2s ease-in-out infinite}
/* "Program" in the results toolbar and the inline panel under it (row 1) */
.progbtn{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 9px;border:1px solid var(--line-strong);border-radius:var(--r-ctl);background:var(--panel);color:var(--ink2);font-size:var(--fs-s);white-space:nowrap}
.progbtn:hover{background:var(--hover)}
.progbtn[aria-expanded="true"]{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.progbtn .pk{font-weight:600;color:var(--ink)}
.progbtn .pv{color:var(--ink2)}
.progbtn .pset{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px;color:var(--ink)}
.prog{flex:none;max-height:min(52vh,460px);overflow-y:auto;overscroll-behavior:contain;padding:10px 12px 12px;border-bottom:1px solid var(--line-strong);background:var(--bg)}
.prog-head{display:flex;align-items:baseline;gap:12px}
.prog-head h2{margin:0;font-size:var(--fs-m);font-weight:700;flex:none}
.prog-head h2:focus{outline:0}
.prog-head h2:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.prog-head p{margin:0;flex:1;color:var(--mute);font-size:var(--fs-xs)}
.prow{display:grid;grid-template-columns:minmax(150px,1.6fr) repeat(5,minmax(70px,1fr)) 64px;gap:6px 8px;align-items:center;padding:6px 0;border-top:1px solid var(--line)}
.prow.phd{border-top:0;padding:8px 0 2px;font-size:var(--fs-xs);font-weight:650;letter-spacing:.06em;text-transform:uppercase;color:var(--mute)}
.prow.pm .psc{padding-left:14px}
.psc{min-width:0;font-size:var(--fs-s);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.psc .muted{font-size:var(--fs-xs)}
.pf{display:flex;flex-direction:column;min-width:0}
.pf .fl{display:none;font-size:var(--fs-xs);color:var(--mute)}
.pf input{height:30px;width:100%;min-width:0;padding:0 7px;border:1px solid var(--line-strong);border-radius:var(--r-ctl);background:var(--panel);font-variant-numeric:tabular-nums;font-size:var(--fs-s);color:var(--ink)}
.pf input::placeholder{color:var(--faint);font-style:italic}
.pf.assumed input{border-style:dashed;border-color:var(--warn-ink);background:color-mix(in oklch,var(--warn) 8%,var(--panel))}
.pf.assumed input::placeholder{color:var(--warn-ink)}
.pf input[aria-invalid="true"]{border-color:var(--bad-ink);box-shadow:inset 0 0 0 1px var(--bad-ink)}
.pf.na{font-size:var(--fs-xs);padding-left:7px}
.prow .linkbtn{justify-self:end;font-size:var(--fs-xs)}
.padd{display:flex;align-items:center;gap:8px;margin-top:8px;font-size:var(--fs-s);color:var(--ink2)}
.padd select{height:30px;padding:0 8px;border:1px solid var(--line-strong);border-radius:var(--r-ctl);background:var(--panel);color:var(--ink);font-size:var(--fs-s);max-width:100%}
.perr{margin:6px 0 0;color:var(--bad-ink);font-size:var(--fs-xs);min-height:0}
.perr:empty{display:none}
.kbdhint{display:inline-flex;align-items:center;gap:6px;border:0;background:none;color:var(--mute);font-size:var(--fs-xs);min-height:24px;padding:0 4px;border-radius:var(--r-ctl)}
.kbdhint:hover{color:var(--ink);background:var(--hover)}
body.drawer-open .kbdhint .lbl,body.map-on .kbdhint .lbl{display:none}
@media (max-width:1600px){body.drawer-open .progbtn .pset,body.map-on .progbtn .pset{display:none}}

/* ---------- table */
.tablewrap{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain}
.tablewrap:focus{outline:0}
table.grid{border-collapse:separate;border-spacing:0;width:100%;font-size:var(--fs-s)}
.grid th{position:sticky;top:0;z-index:2;background:var(--panel);text-align:left;padding:0;border-bottom:1px solid var(--line-strong);white-space:nowrap;vertical-align:bottom}
.grid th .th{display:flex;align-items:center;gap:3px;width:100%;min-height:34px;padding:8px 8px 6px;border:0;background:none;font-size:var(--fs-xs);font-weight:650;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);text-align:inherit;white-space:nowrap}
.grid th.r .th{justify-content:flex-end}
.grid th .th:hover{color:var(--ink)}
.grid th .th:focus-visible{outline-offset:-2px}
.grid th.sorted .th{color:var(--ink)}
.grid th.sorted .th::after{content:"↓";font-size:var(--fs-xs)}
.grid th.sorted.asc .th::after{content:"↑"}
.grid th.r,.grid td.r{text-align:right}
.grid td{padding:0 8px;height:38px;border-bottom:1px solid var(--line);white-space:nowrap;vertical-align:middle;font-variant-numeric:tabular-nums}
.grid tbody tr{cursor:pointer}
.grid tbody tr:hover td{background:var(--hover)}
.grid tbody tr.sel td{background:var(--sel)}
.grid tbody tr.sel{outline:1px solid var(--mute);outline-offset:-1px}
.grid tbody tr.gap,.grid tbody tr.gap:hover td{background:none;cursor:default}
.grid tbody tr.gap td{padding:0;border:0;height:auto}
.grid tbody tr:focus{outline:0}
.grid tbody tr:focus-visible{outline:2px solid var(--focus);outline-offset:-2px}
.grid tr.sold td{color:var(--mute)}
.grid tr.sold .c-trim b{text-decoration:line-through;text-decoration-thickness:1px}
/* the numeric block: est. $/mo is the hero figure, leverage next, the rest supporting */
.c-est{min-width:74px}
.est{font-size:var(--fs-m);font-weight:700;color:var(--ink)}
.ap{color:var(--warn-ink);font-weight:600;margin-right:1px}
/* priced at MSRP (no listed price): a visible word, not just a tooltip (row 2) */
.tmsrp{display:inline-block;margin-right:5px;padding:0 4px;border-radius:2px;font:600 var(--fs-xs)/16px var(--mono);vertical-align:1px;background:color-mix(in oklch,var(--warn) 14%,var(--panel));color:var(--warn-ink)}
.est.at-msrp{font-weight:600;color:var(--ink2)}
.c-price{color:var(--ink2);font-weight:500}
.c-year{width:46px}
.c-fav{width:34px;padding:0 0 0 6px!important}
.star{border:0;background:none;width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;font-size:16px;line-height:1;color:var(--line-strong);border-radius:var(--r-ctl)}
.star:hover{color:var(--ink);background:var(--hover)}
.star.on{color:var(--ink)}
.c-note{width:150px;max-width:150px;min-width:120px}
.note-in{width:100%;border:1px solid transparent;background:transparent;border-radius:var(--r-ctl);padding:4px 6px;font-size:var(--fs-s);color:var(--ink2);text-overflow:ellipsis}
.note-in::placeholder{color:var(--faint)}
.note-in:hover{border-color:var(--line-strong)}
.note-in:focus{border-color:var(--ink);background:var(--panel);outline:2px solid var(--focus);outline-offset:1px}
.c-trim{max-width:280px;overflow:hidden;text-overflow:ellipsis}
.c-trim b{font-weight:600}
.c-trim .mdl{color:var(--mute);font-size:var(--fs-xs);margin-left:5px}
.c-trim .sub{display:none}
.c-dealer{max-width:180px;overflow:hidden;text-overflow:ellipsis;color:var(--ink2)}
.c-color{max-width:160px;overflow:hidden;text-overflow:ellipsis}
.c-color .sw{margin-right:6px;vertical-align:-1px}
.c-color .sw.int{width:8px;height:8px;margin:0 0 0 6px;border-radius:2px}
.age-aged{color:var(--good-ink);font-weight:600}
.age-old{color:var(--good-ink);font-weight:700}
.drop{color:var(--good-ink);font-size:var(--fs-xs);margin-left:4px}
.more-row td{text-align:center;height:52px;cursor:default}
.more-row:hover td{background:none!important}
/* priority hiding as the table narrows */
.grid.w-m .p3{display:none}
.grid.w-s .p2{display:none}
.grid.w-xs .p1{display:none}
.grid.w-xs .c-trim .sub{display:block;color:var(--mute);font-size:var(--fs-xs);overflow:hidden;text-overflow:ellipsis;line-height:1.2}
.grid.w-xs .c-trim .mdl{display:none}
.c-trim .sub .sk{color:var(--ink2);font-weight:600}
/* the search that found the car, in the mixed view (LH-209 S3) */
.c-trim .stag{display:inline-block;max-width:150px;margin-left:5px;padding:0 5px;border:1px solid var(--line-strong);border-radius:3px;color:var(--ink2);font-size:var(--fs-xs);line-height:16px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:1px}
.c-trim .sub .stag{margin:0 4px 0 0;max-width:110px;vertical-align:0}
.grid.w-xs .c-trim > .stag{display:none}
.grid.w-xs .c-trim .pill{display:none}
/* skeleton rows while loading */
.skel td{cursor:default}
.skel i{display:block;height:9px;border-radius:2px;background:var(--line);width:70%;animation:pulse 1.4s ease-in-out infinite}
.skel td.r i{margin-left:auto;width:55%}
.skel:nth-child(3n) i{width:50%} .skel:nth-child(4n+1) td.c-trim i{width:85%}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.45}}
.empty,.errpanel{padding:48px 24px;max-width:56ch;margin:0 auto;color:var(--mute);text-align:left}
.empty h3,.errpanel h3{color:var(--ink);margin:0 0 6px;font-size:var(--fs-l)}
.empty p,.errpanel p{margin:0 0 12px}
.empty code{font-family:var(--mono);background:var(--bg);padding:2px 6px;border-radius:var(--r-ctl)}
.errpanel h3::before{content:"!";display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;margin-right:8px;border-radius:50%;background:color-mix(in oklch,var(--bad) 14%,var(--panel));color:var(--bad-ink);font-size:var(--fs-s);vertical-align:1px}
.errpanel code{font:var(--fs-xs) var(--mono);color:var(--ink2);overflow-wrap:anywhere}

/* stages (LH-201): a neutral dot plus the word, never a pastel per-tag pill. Signed reads good, Dropped reads muted. */
.tag{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 8px;border-radius:var(--r-ctl);border:1px solid var(--line-strong);background:var(--panel);color:var(--ink2);font-size:var(--fs-xs);font-weight:600;white-space:nowrap}
.tag::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--line-strong);flex:none}
button.tag:hover{background:var(--hover)}
.tag.t-watching::before{background:var(--mute)}
.tag.t-contacted,.tag.t-negotiating{color:var(--ink)}
.tag.t-contacted::before,.tag.t-negotiating::before{background:var(--ink)}
.tag.t-signed{color:var(--good-ink)} .tag.t-signed::before{background:var(--good)}
.tag.t-dropped{color:var(--mute)} .tag.t-dropped::before{background:transparent;box-shadow:inset 0 0 0 1px var(--line-strong)}
.tag.none::before{display:none}
.tag.none{border-style:dashed;background:transparent;color:var(--faint);font-weight:500}
tr.sel .tag.none{color:var(--mute)}
@media (hover:hover){tr:not(:hover):not(.sel) .tag.none{border-color:transparent;color:transparent}}
.tagpop{position:fixed;z-index:50;background:var(--panel);border:1px solid var(--line-strong);border-radius:var(--r-panel);box-shadow:var(--shadow);padding:6px;display:flex;flex-direction:column;gap:3px;min-width:170px}
.tagpop button{justify-content:flex-start;width:100%;height:28px}

/* option badges: filled = has it; struck = doesn't; table shows only "has" plus an unknown count */
.obs{display:inline-flex;gap:3px;align-items:center}
.ob{display:inline-flex;align-items:center;justify-content:center;min-width:28px;height:20px;padding:0 4px;border-radius:var(--r-ctl);border:1px solid var(--line-strong);font:600 var(--fs-xs)/1 var(--f);letter-spacing:.02em;color:var(--ink2)}
.ob.yes{background:color-mix(in oklch,var(--good) 14%,var(--panel));border-color:color-mix(in oklch,var(--good) 45%,var(--panel));color:var(--good-ink)}
.ob.no{color:var(--faint);text-decoration:line-through;border-color:var(--line);background:var(--line2)}
.ob.unk{border-style:dashed;color:var(--mute)}
.ob.unk::after{content:"?";margin-left:1px}
.ob-more{color:var(--mute);font-size:var(--fs-xs);margin-left:3px}
.ob-none{color:var(--faint)}
.ob-err{color:var(--bad-ink);font-size:var(--fs-xs)}

/* leverage: neutral bar; the top band gets the highlighter */
.lev{display:inline-flex;align-items:center;gap:7px;justify-content:flex-end}
.levbar{width:36px;height:6px;border-radius:2px;background:var(--line);overflow:hidden;display:inline-block}
.levbar i{display:block;height:100%;background:var(--line-strong)}
.lev b{min-width:20px;text-align:right;font-weight:600;color:var(--ink2)}
.lev.mid .levbar i{background:var(--ink2)} .lev.mid b{color:var(--ink);font-weight:650}
.lev.hi .levbar{box-shadow:inset 0 0 0 1px var(--hl-edge)}
.lev.hi .levbar i{background:var(--hl)}
.lev.hi b{background:var(--hl);color:var(--hl-ink);border-radius:2px;padding:0 3px;font-weight:700}
.noinc{color:var(--warn-ink);font-weight:700}
.pill.seg-loaner{background:var(--line2);color:var(--ink2);margin-left:5px}
.pill.seg-loaner.seg-confirmed{background:color-mix(in oklch,var(--good) 14%,var(--panel));color:var(--good-ink)}
.pill.seg-used{background:var(--line2);color:var(--mute);margin-left:5px}

/* ---------- side column: map */
/* Map view: the map takes the results area; List view hides it (LH-201) */
.side.mapview{position:relative;z-index:0;isolation:isolate;flex:1;min-width:0;min-height:0;background:var(--bg);border-top:1px solid var(--line)}
body:not(.map-on) .side.mapview{display:none}
body.map-on .tablewrap{display:none}
.viewseg{flex:none}
#map{position:absolute;inset:0}
.mapnote{position:absolute;left:10px;bottom:22px;z-index:500;background:var(--panel);border:1px solid var(--line-strong);border-radius:var(--r-ctl);padding:4px 8px;font-size:var(--fs-xs);color:var(--mute);box-shadow:var(--shadow);max-width:calc(100% - 20px)}
.mapfit{position:absolute;right:10px;top:10px;z-index:500}
.pin-wrap{background:none;border:0}
.pin{display:flex;align-items:center;justify-content:center;border-radius:50%;background:var(--hl);color:var(--hl-ink);font:700 var(--fs-xs)/1 var(--f);border:2px solid var(--hl-edge);box-shadow:0 1px 4px oklch(.2 .01 100 / .35);transition:transform .15s cubic-bezier(.25,1,.5,1)}
.pin:hover{transform:scale(1.1)}
.pin.cl{background:var(--ink);color:var(--panel);border-color:var(--panel)}
.pin.active{background:var(--hl);border:3px solid var(--ink);color:var(--hl-ink)}
.leaflet-container{font:inherit;background:var(--bg)}
:root[data-theme="dark"] .leaflet-tile-pane{filter:invert(1) hue-rotate(180deg) brightness(.85) contrast(.9) saturate(.6)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .leaflet-tile-pane{filter:invert(1) hue-rotate(180deg) brightness(.85) contrast(.9) saturate(.6)}}

/* ---------- drawer: a summary strip, then sections divided by rules (no cards) */
.drawer{position:fixed;top:var(--headh);right:0;bottom:26px;width:var(--drawerw);z-index:30;background:var(--panel);border-left:1px solid var(--line-strong);display:flex;flex-direction:column;transform:translateX(105%);transition:transform .18s cubic-bezier(.25,1,.5,1);visibility:hidden}
body.drawer-open .drawer{transform:none;visibility:visible}
.dhead{flex:none;padding:12px 14px 10px 16px;border-bottom:1px solid var(--line);display:flex;gap:6px;align-items:flex-start}
.dhead .t{flex:1;min-width:0}
.dhead h2{margin:0;font-size:var(--fs-l);font-weight:700;line-height:1.3}
.dhead h2:focus{outline:0}
.dhead h2:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.vinrow{display:flex;align-items:center;gap:6px;margin-top:2px;color:var(--mute);font:var(--fs-xs) var(--mono)}
.dstar{font-size:19px;color:var(--mute)} .dstar.on{color:var(--ink)}
.dbody{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:0 16px 40px}
.sec{padding:14px 0;border-top:1px solid var(--line)}
.sum+.sec{border-top:1px solid var(--line-strong)}
.sec h4{margin:0 0 9px;font-size:var(--fs-s);font-weight:650;color:var(--ink);display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.sec h4 a,.sec h4 button,.sec h4 .muted{font-weight:500;font-size:var(--fs-xs)}
.sum{padding:14px 0 12px}
.sum .k{display:block;font-size:var(--fs-xs);color:var(--mute)}
.sum .s{display:block;font-size:var(--fs-xs);color:var(--mute)}
.sum-hero b{display:block;font-size:var(--fs-3xl);font-weight:700;line-height:1.1;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.sum-hero b small{font-size:var(--fs-m);font-weight:500;color:var(--mute);margin-left:2px}
.sum-hero.assumed b{color:var(--ink2);font-weight:500}
.sum-hero .tmsrp{margin:0 0 0 2px}
.sum-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:12px}
.sum-grid b{display:block;font-size:var(--fs-xl);font-weight:650;font-variant-numeric:tabular-nums;line-height:1.2}
.sum-grid b.lev-hi{display:inline-block;background:var(--hl);color:var(--hl-ink);padding:0 4px;border-radius:2px}
.sum-grid .s.gd{color:var(--good-ink)} .sum-grid .s.bd{color:var(--bad-ink);font-weight:600}
.sum-dealer{margin-top:12px;font-size:var(--fs-s)}
/* stage select in the drawer header (LH-201) */
.dstage{flex:none;align-self:flex-start}
.dstage select{height:28px;max-width:132px;padding:0 6px;border:1px solid var(--line-strong);border-radius:var(--r-ctl);background:var(--panel);color:var(--mute);font-size:var(--fs-s)}
.dstage select.set{color:var(--ink);font-weight:600}
.notes{width:100%;min-height:64px;margin-top:6px;resize:vertical;border:1px solid var(--line-strong);border-radius:var(--r-ctl);padding:8px 9px;background:var(--bg);font-size:var(--fs-m);line-height:1.45}
.savestate{font-size:var(--fs-xs);color:var(--faint);min-height:16px;margin-top:3px;text-align:right}
.photo{margin:0;padding:14px 0 0;border-top:1px solid var(--line)}
.photo img{display:block;width:100%;aspect-ratio:3/1;max-height:150px;object-fit:cover;border-radius:var(--r-panel);background:var(--line2)}
.photo figcaption{font-size:var(--fs-xs);color:var(--faint);margin-top:5px}
.facts{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:0;font-size:var(--fs-s)}
.facts dt{color:var(--mute)}
.facts dd{margin:0;text-align:right;font-variant-numeric:tabular-nums;min-width:0;overflow-wrap:anywhere}
.facts dd small{display:block;color:var(--faint);font-size:var(--fs-xs)}
.optgrid{display:grid;grid-template-columns:1fr 1fr;gap:6px 10px}
.optgrid .o{display:flex;align-items:center;gap:7px;font-size:var(--fs-s);min-width:0}
.optgrid .o .ob{flex:none;min-width:36px}
.optgrid .o span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pk{width:100%;border-collapse:collapse;margin-top:9px;font-size:var(--fs-s)}
.pk td{padding:5px 0;border-top:1px solid var(--line);vertical-align:top}
.pk td.r{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap;padding-left:10px}
.pk details{color:var(--mute);font-size:var(--fs-xs)}
/* OpenSpec named options: name · code, price right-aligned; standard items recede */
.osh2{margin:14px 0 2px;font-size:var(--fs-s);font-weight:650;color:var(--ink)}
.pk.named{margin-top:4px}
.pk.named .gh th{padding:9px 0 3px;text-align:left;font-size:var(--fs-xs);font-weight:650;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);border-top:0}
.pk.named .cd{font:var(--fs-xs) var(--mono);color:var(--mute);margin-left:4px}
.pk.named tr.std td,.pk.named tr.nc td{color:var(--mute)}
.pk.named tr.nc .nm{color:var(--ink2)}
.pk.named .ncw{font-size:var(--fs-xs)}
.pk.named small.why{display:block;color:var(--mute);font-size:var(--fs-xs)}
.pk.named tr.tot .muted{font-weight:500;font-size:var(--fs-xs);margin-left:4px}
.pk.named tr.tot td{border-top:1px solid var(--line-strong);font-weight:650;color:var(--ink)}
.recon{margin:7px 0 0;font-size:var(--fs-s);color:var(--ink2);font-variant-numeric:tabular-nums}
.hint.attr a{color:var(--faint)}
.pk summary{cursor:pointer;color:var(--ink)}
.codes{display:flex;flex-wrap:wrap;gap:3px;margin-top:7px}
.codes span{font:var(--fs-xs) var(--mono);padding:1px 4px;border-radius:2px;background:var(--line2);color:var(--ink2)}
.codes span.key{background:color-mix(in oklch,var(--good) 14%,var(--panel));color:var(--good-ink);font-weight:700}
details.raw{margin-top:9px;font-size:var(--fs-s)}
details.raw summary{cursor:pointer;color:var(--mute)}
.levbig{display:flex;align-items:baseline;gap:8px}
.levbig b{font-size:var(--fs-2xl);font-weight:700;font-variant-numeric:tabular-nums}
.levparts{display:grid;grid-template-columns:118px 1fr 46px;gap:6px 10px;align-items:center;margin-top:8px;font-size:var(--fs-s)}
.levparts .bar{height:6px;border-radius:2px;background:var(--line);overflow:hidden}
.levparts .bar i{display:block;height:100%;background:var(--ink2)}
.levparts .v{text-align:right;font-variant-numeric:tabular-nums;color:var(--ink2)}
.levparts .why{grid-column:1/-1;margin:-3px 0 4px;color:var(--faint);font-size:var(--fs-xs)}
.ph{display:flex;gap:12px;align-items:center}
.ph svg{flex:none}
.ph ul{list-style:none;margin:0;padding:0;flex:1;font-size:var(--fs-s);font-variant-numeric:tabular-nums}
.ph li{display:flex;justify-content:space-between;padding:2px 0}
.dealer-name{font-weight:650;font-size:var(--fs-m)}
.dmeta{margin-top:6px;display:flex;gap:6px;align-items:center;font-size:var(--fs-xs)}
.plat{display:inline-block;white-space:nowrap;padding:1px 7px;border-radius:999px;font-size:var(--fs-xs);font-weight:600;background:var(--line2);color:var(--ink2)}
.plat.dealercom{background:color-mix(in oklch,var(--good) 14%,var(--panel));color:var(--good-ink)}
.plat.blocked,.plat.error{background:color-mix(in oklch,var(--bad) 14%,var(--panel));color:var(--bad-ink)}
.linkrow{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.ext3p{margin:8px 0 0;font-size:var(--fs-s)}   /* third-party text link + non-affiliation line (LH-200) */
ul.ev{margin:4px 0 0;padding-left:16px;font-size:var(--fs-s);text-align:left}
ul.ev li.yes{color:var(--good-ink)}
ul.ev li.hint{color:var(--mute)}
dd b.ok{color:var(--good-ink)}

/* lease */
.lgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:12px}
.lgrid label{display:flex;flex-direction:column;gap:3px;font-size:var(--fs-xs);color:var(--mute);min-width:0}
.lgrid label.wide{grid-column:span 2}
.lgrid .lt{display:flex;align-items:center;gap:5px;flex-wrap:wrap;min-height:18px}
.lgrid input,.lgrid select{height:30px;width:100%;min-width:0;padding:0 8px;border:1px solid var(--line-strong);border-radius:var(--r-ctl);background:var(--bg);font-size:var(--fs-s);font-variant-numeric:tabular-nums;color:var(--ink)}
.lgrid label.assumed input,.lgrid label.assumed select{border-style:dashed;border-color:var(--warn-ink);background:color-mix(in oklch,var(--warn) 8%,var(--bg))}
.ltog{display:flex;flex-wrap:wrap;gap:4px 14px;margin-top:9px;font-size:var(--fs-s)}
.ltog label{display:flex;align-items:center;gap:7px;cursor:pointer;color:var(--ink2);min-height:28px}
.ltog input{accent-color:var(--ink);margin:0;width:16px;height:16px}
details.adv{margin-top:10px}
details.adv summary{cursor:pointer;color:var(--ink2);font-size:var(--fs-s);min-height:24px;display:list-item}
details.adv.has-assumed summary::after{content:"has assumptions";margin-left:8px;padding:0 6px;border-radius:999px;font-size:var(--fs-xs);font-weight:600;background:color-mix(in oklch,var(--warn) 14%,var(--panel));color:var(--warn-ink)}
.lout{padding:4px 0 2px}
.pay{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.pay b{font-size:var(--fs-3xl);font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-.01em;line-height:1}
.pay b .ap{font-weight:600}
.pay small{color:var(--mute);font-size:var(--fs-m)}
.tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;margin-top:12px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-ctl);overflow:hidden}
.tiles div{background:var(--panel);padding:6px 8px;min-width:0}
.tiles b{display:block;font-size:var(--fs-m);font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tiles span{font-size:var(--fs-xs);color:var(--mute)}
.target{margin:9px 0 0;font-size:var(--fs-s);color:var(--ink2)}
.ext3p.stale a{color:var(--mute)}
.stale{opacity:.55;transition:opacity .15s}
/* inputs behind a disclosure; the result stays on top (row 10) */
details.linputs{margin-top:10px;border-top:1px solid var(--line);padding-top:8px}
details.linputs>summary{cursor:pointer;font-size:var(--fs-s);font-weight:600;color:var(--ink);min-height:28px;display:list-item}
.lprog{margin:9px 0 0;font-size:var(--fs-s);color:var(--ink2);line-height:1.5}
.lprog .linkbtn{margin-left:2px}
.lprogbtns{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:10px}
.lprogbtns .hint{flex-basis:100%;margin-top:2px}

/* shortcut sheet: a non-modal popover */
.help{position:fixed;right:16px;bottom:44px;z-index:90;width:min(340px,calc(100vw - 32px));background:var(--panel);border:1px solid var(--line-strong);border-radius:var(--r-panel);box-shadow:var(--shadow);padding:12px 14px 14px}
.help:focus{outline:0}
.help-head{display:flex;align-items:center;justify-content:space-between}
.help h2{margin:0;font-size:var(--fs-m);font-weight:650}
.help dl{display:grid;grid-template-columns:auto 1fr;gap:6px 12px;margin:10px 0 0;font-size:var(--fs-s);align-items:center}
.help dd{margin:0;color:var(--ink2)}

/* toast + misc */
.toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);z-index:100;background:var(--ink);color:var(--bg);padding:8px 14px;border-radius:var(--r-panel);font-size:var(--fs-s);box-shadow:var(--shadow);pointer-events:none;opacity:0;transition:opacity .15s}
.toast.show{opacity:1}
.toast.err{background:var(--bad-ink);color:var(--bg)}
.backdrop{display:none}
/* The footer is 26px and the drawer stops above it, so Tab never lands on a link hidden under the drawer (row 4). */
.foot{flex:none;display:flex;gap:14px;align-items:center;justify-content:flex-end;height:26px;padding:0 16px;border-top:1px solid var(--line);background:var(--panel);color:var(--mute);font-size:var(--fs-xs)}
.foot a{color:var(--mute)}
.empty .btn.primary{margin-top:4px}

/* ---------- responsive */
@media (max-width:1100px){
  :root{--railw:0px}
  .only-narrow{display:inline-flex}
  .rail{position:fixed;z-index:40;top:var(--headh);left:0;bottom:0;width:320px;max-width:88vw;transform:translateX(-102%);transition:transform .18s cubic-bezier(.25,1,.5,1);box-shadow:var(--shadow);visibility:hidden}
  body.rail-open .rail{transform:none;visibility:visible}
  body.rail-open .backdrop{display:block;position:fixed;inset:var(--headh) 0 0 0;z-index:35;background:oklch(.15 .01 100 / .4)}
  body.drawer-open{--sidew:0px}
  .drawer{box-shadow:var(--shadow)}
}
@media (max-width:760px){
  .top{padding:0 8px;gap:6px}
  .brand{font-size:var(--fs-l)}
  .hbtn{height:40px;min-width:40px;padding:0 9px;justify-content:center}
  .top .gnav,.balpill{display:none}
  .amenu-btn{max-width:none;padding:0 9px}
  .amenu-btn .av,.amenu-btn .who{display:none}
  .amenu-btn .mlbl{display:inline}
  .hmenu{width:260px}
  .hmenu .mnav{display:flex;flex-direction:column;gap:1px;margin:0 0 3px;padding-bottom:3px;border-bottom:1px solid var(--line)}
  .hmenu .mnav a{min-height:44px;font-size:var(--fs-m)}
  .hmenu .mnav a[aria-current="page"]{box-shadow:none;background:var(--sel);border-radius:var(--r-ctl)}
  .hmenu .mgrp a,.hmenu .mgrp button{min-height:44px}
  /* the switcher is the most important context on the page: give it the full width (S8) */
  .ctx{padding:6px 8px;gap:4px 8px}
  .ctx .lbl{display:none}
  .swwrap{width:100%}
  .swb{width:100%;min-height:40px;justify-content:space-between}
  .swb .t{flex:1}
  .swpop{width:calc(100vw - 16px)}
  .meta{font-size:var(--fs-xs)}
  .wide-only{display:none!important}
  .only-phone{display:flex}
  .btn{height:40px}
  .chip,.view,.seg button{height:34px}
  .segtabs button,.progbtn{height:40px}
  .dealer-chip button,.view>button.x{min-width:32px;min-height:32px}
  .prog{max-height:62vh}
  .prog-head{flex-wrap:wrap}
  .prog-head p{order:3;flex-basis:100%}
  .prog-head .iconbtn{margin-left:auto;height:40px;min-width:40px}
  .prow{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .prow.phd{display:none}
  .prow .psc{grid-column:1/-1;padding-left:0!important}
  .pf .fl{display:block}
  .pf input,.padd select{height:40px;font-size:16px}
  .prow .linkbtn{grid-column:3;min-height:40px}
  .search,.rng input,.savev input,.lgrid input,.lgrid select{height:40px;font-size:16px}
  .layout{display:flex;flex-direction:column}
  body.map-on .tablewrap{display:block}
  body.map-on .side.mapview{flex:none;height:38vh;border-top:0;border-bottom:1px solid var(--line);order:-1}
  .main{flex:1}
  .tbar{flex-wrap:wrap;gap:4px 10px;padding:6px 8px}
  .segtabs{order:2;width:100%;overflow-x:auto;scrollbar-width:none}
  .kbdhint{display:none}
  .drawer{top:0;bottom:0;width:100%;--drawerw:100%;z-index:60}
  .rail{top:0;z-index:70}
  body.rail-open .backdrop{inset:0;z-index:65}
  .grid td{height:48px;padding:0 4px}
  .grid td:first-child,.grid th:first-child .th{padding-left:8px}
  .grid th .th{padding-left:4px;padding-right:4px}
  .levbar,.drop{display:none}
  .lf{display:none}
  .ls{display:inline}
  .c-trim{max-width:118px}
  /* In the mixed view, keep the search attribution legible in the narrow Car cell. */
  .c-trim .sub .stag{max-width:100%;margin-right:0}
  .c-trim .sub .stag + .car-sub-rest{display:none}
  .lgrid,.tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sum-hero b{font-size:var(--fs-2xl)}
  .foot{display:none}
  .help{right:8px;bottom:8px}
}
@media (max-width:370px){.c-trim{max-width:96px}}
@media (hover:none){.fh small kbd{display:none}}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}
