/* ============================================================
   ENTHUSIAST EXCHANGE — CATEGORY / SEARCH PAGE (Used Wheels).
   Sharetribe search-page pattern: faceted filter rail + unique-
   item listing grid + saved-search hook. Generated template —
   edit the generator in HANDOFF notes, not each page.
   ============================================================ */
.crumbs{ background:var(--paper); border-bottom:1px solid var(--line); }
.crumbs__inner{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; padding:11px 0;
  font-family:var(--f-mono); font-size:10.5px; letter-spacing:.05em; text-transform:uppercase; }
.crumbs a{ color:var(--carbon); } .crumbs a:hover{ color:var(--command); }
.crumbs .sep{ color:var(--line-input); } .crumbs .cur{ color:var(--ink); font-weight:500; }
/* compact category hero */
.chero{ position:relative; background:var(--ocean-900); color:#fff; overflow:hidden; }
.chero__ghost{ position:absolute; right:-2%; top:50%; transform:translateY(-50%); font-family:var(--f-head); font-weight:900;
  font-size:clamp(60px,11vw,130px); line-height:1; color:transparent; -webkit-text-stroke:1.5px rgba(255,255,255,.07);
  pointer-events:none; user-select:none; white-space:nowrap; }
.chero__inner{ position:relative; z-index:2; padding-block:26px 28px; }
.chero__kicker{ font-family:var(--f-mono); font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:var(--lime); }
.chero h1{ font-family:var(--f-head); font-weight:800; text-transform:uppercase; font-size:clamp(1.6rem,4vw,2.4rem); line-height:.95; margin:9px 0 8px; }
.chero__sub{ font-size:13.5px; line-height:1.6; color:rgba(255,255,255,.78); max-width:66ch; }
/* layout */
.cat{ padding-block:26px 48px; background:var(--bone); }
.cat__grid{ display:grid; grid-template-columns:1fr; gap:18px; }
@media (min-width:960px){ .cat__grid{ grid-template-columns:240px minmax(0,1fr); align-items:start; } }
/* filter rail */
.frail{ background:var(--paper); border:1px solid var(--line); border-radius:var(--r); overflow:hidden; }
@media (min-width:960px){ .frail{ position:sticky; top:130px; } }
.frail__veh{ padding:14px 15px; background:var(--ocean-900); color:#fff; }
.frail__veh-lbl{ font-family:var(--f-mono); font-size:9.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--lime); margin-bottom:7px; }
.frail__veh p{ font-size:12px; line-height:1.5; color:rgba(255,255,255,.7); margin-bottom:10px; }
.fgroup{ border-bottom:1px solid var(--line-2); padding:13px 15px; }
.fgroup:last-child{ border-bottom:none; }
.fgroup__lbl{ display:flex; justify-content:space-between; align-items:center; font-family:var(--f-mono); font-size:10px;
  letter-spacing:.1em; text-transform:uppercase; color:var(--ink); font-weight:500; margin-bottom:9px; }
.fgroup__lbl svg{ width:12px; height:12px; color:var(--carbon); }
.fopt{ display:flex; align-items:center; gap:8px; font-size:13px; color:var(--carbon); padding-block:4px; cursor:pointer; }
.fopt:hover{ color:var(--ink); }
.fopt input{ accent-color:var(--command); width:14px; height:14px; flex:none; }
.fprice{ display:flex; gap:8px; align-items:center; }
.fprice input{ width:100%; min-width:0; padding:8px 9px; border:1px solid var(--line-input); border-radius:var(--r-sm); font-size:13px; font-family:var(--f-mono); }
.fprice span{ color:var(--carbon); font-size:12px; }
.frail__clear{ display:block; text-align:center; padding:12px; font-family:var(--f-mono); font-size:10px; letter-spacing:.08em;
  text-transform:uppercase; color:var(--command); border-top:1px solid var(--line-2); }
.frail__clear:hover{ color:var(--ink); }
/* results toolbar */
.rbar{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:14px; }
.rbar__count{ font-family:var(--f-mono); font-size:11px; letter-spacing:.05em; text-transform:uppercase; color:var(--carbon); }
.rbar__count b{ color:var(--ink); }
.rbar__right{ margin-left:auto; display:flex; gap:9px; align-items:center; flex-wrap:wrap; }
.rsave{ display:inline-flex; align-items:center; gap:7px; font-family:var(--f-mono); font-size:10.5px; letter-spacing:.05em;
  text-transform:uppercase; color:var(--command); padding:9px 13px; border:1px dashed var(--command); border-radius:var(--pill); transition:var(--t); }
.rsave:hover{ background:rgba(206,32,47,.06); }
.rsave svg{ width:13px; height:13px; }
.xsort{ font-family:var(--f-mono); font-size:11px; letter-spacing:.05em; text-transform:uppercase;
  padding:9px 12px; border:1px solid var(--line-input); border-radius:var(--r-sm); background:var(--paper); color:var(--ink); }
/* listing cards */
.lst-grid{ display:grid; grid-template-columns:1fr; gap:12px; }
@media (min-width:700px){ .lst-grid{ grid-template-columns:1fr 1fr; } }
@media (min-width:1180px){ .lst-grid{ grid-template-columns:repeat(3,1fr); } }
.lst{ position:relative; background:var(--paper); border:1px solid var(--line); border-radius:var(--r); display:flex;
  flex-direction:column; overflow:hidden; transition:var(--t); }
.lst:hover{ border-color:var(--command); box-shadow:var(--sh); transform:translateY(-2px); }
.lst__media{ position:relative; aspect-ratio:4/3; border-bottom:1px solid var(--line-2); overflow:hidden; background:#fff; }
.lst__img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.lst__img--product{ object-fit:contain; background:#fff; padding:10px; }
.lst__flags{ position:absolute; top:9px; left:9px; display:flex; flex-direction:column; gap:5px; z-index:2; align-items:flex-start; }
.lst__shots{ position:absolute; bottom:9px; right:9px; z-index:2; font-family:var(--f-mono); font-size:9px;
  background:rgba(10,12,14,.78); color:#fff; padding:3px 7px; border-radius:var(--r-sm); display:inline-flex; align-items:center; gap:5px; }
.lst__shots svg{ width:11px; height:11px; }
.lst__body{ padding:13px 13px 15px; display:flex; flex-direction:column; flex:1; }
.lst__brand{ font-family:var(--f-mono); font-size:10px; font-weight:500; letter-spacing:.06em; text-transform:uppercase; color:var(--command); margin-bottom:5px; }
.lst__name{ font-family:var(--f-head); font-weight:700; text-transform:uppercase; font-size:16px; line-height:1; margin-bottom:6px; color:var(--ink); }
.lst__spec{ font-family:var(--f-mono); font-size:11px; color:var(--carbon); margin-bottom:10px; }
.lst__seller{ display:flex; align-items:center; gap:8px; margin-bottom:11px; }
img.lst__avatar{ width:22px; height:22px; border-radius:50%; object-fit:cover; flex:none; }
.lst__who{ font-size:12px; color:var(--carbon); line-height:1.3; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.lst__who b{ color:var(--ink); font-weight:700; }
.lst__who .st{ color:var(--star); }
.lst__foot{ margin-top:auto; padding-top:11px; border-top:1px solid var(--line-2); display:flex; align-items:flex-end; justify-content:space-between; gap:8px; }
.lst__price .now{ font-family:var(--f-head); font-weight:800; font-size:22px; line-height:1; color:var(--ink); }
.lst__price .obo{ font-family:var(--f-mono); font-size:10px; color:var(--carbon); margin-top:4px; }
.lst__price .obo b{ color:var(--ink); }
.lst__loc{ font-family:var(--f-mono); font-size:10px; letter-spacing:.04em; text-transform:uppercase;
  color:var(--carbon); display:inline-flex; align-items:center; gap:5px; white-space:nowrap; }
.lst__loc svg{ width:12px; height:12px; flex:none; }
.flag--new{ background:var(--lime); color:var(--on-lime); }
.flag--exc{ background:var(--command); color:#fff; }
.flag--good{ background:var(--ocean-900); color:#fff; }
.flag--fair{ background:var(--orange-deep); color:#fff; }
.flag--drop{ background:#15803d; color:#fff; }
.flag--ink{ background:var(--ocean-900); color:#fff; }
/* liquidity proof — recently sold strip */
.soldbar{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; background:var(--paper);
  border:1px solid var(--line); border-left:3px solid #15803d; border-radius:var(--r-sm);
  padding:10px 14px; margin-bottom:14px; }
.soldbar__lbl{ font-family:var(--f-mono); font-size:9px; letter-spacing:.12em; text-transform:uppercase; color:#15803d; font-weight:500; white-space:nowrap; }
.soldbar__item{ font-family:var(--f-mono); font-size:10.5px; color:var(--carbon); white-space:nowrap; }
.soldbar__item b{ color:var(--ink); }
.soldbar__item .d{ color:#15803d; }
/* pagination */
.pgn{ display:flex; justify-content:center; align-items:center; gap:6px; margin-top:24px; }
.pgn a{ min-width:38px; height:38px; display:grid; place-items:center; padding:0 10px; border:1px solid var(--line-input);
  border-radius:var(--r-sm); font-family:var(--f-mono); font-size:11.5px; color:var(--carbon); transition:var(--t); }
.pgn a:hover{ border-color:var(--command); color:var(--command); }
.pgn a.is-active{ background:var(--ocean-900); border-color:var(--ocean-900); color:var(--lime); }

/* ---- block ---- */

.otband{ background:var(--ocean-900); border-radius:var(--r); padding:20px 20px; display:flex; flex-wrap:wrap; gap:15px; align-items:center; }
.otband img{ height:28px; width:auto; flex:none; }
.otband .t{ flex:1; min-width:240px; }
.otband .t .k{ font-family:var(--f-mono); font-size:9px; letter-spacing:.12em; text-transform:uppercase; color:var(--lime); margin-bottom:5px; }
.otband .t h2{ font-family:var(--f-head); font-weight:800; text-transform:uppercase; color:#fff; font-size:clamp(1rem,2.4vw,1.3rem); line-height:1.05; }
.otband .t p{ color:rgba(255,255,255,.72); font-size:12px; line-height:1.6; margin-top:5px; }
.otband .t p b{ color:#fff; }

/* ---- block ---- */

.galband{ background:var(--paper); border:1px solid var(--line); border-radius:var(--r); padding:18px 18px; display:flex; flex-wrap:wrap; gap:14px; align-items:center; }
.galband__thumbs{ display:flex; gap:8px; flex:none; }
.galband__thumbs img{ width:74px; height:56px; object-fit:cover; border-radius:8px; border:1px solid var(--line-2); }
.galband .t{ flex:1; min-width:220px; }
.galband .t .k{ font-family:var(--f-mono); font-size:9px; letter-spacing:.12em; text-transform:uppercase; color:#CE202F; margin-bottom:4px; }
.galband .t h2{ font-family:var(--f-head); font-weight:800; text-transform:uppercase; font-size:clamp(1rem,2.2vw,1.25rem); color:var(--ink); line-height:1.05; }
.galband .t p{ font-size:12px; line-height:1.55; color:var(--carbon); margin-top:4px; }

/* ==== utilities (extracted from inline style attributes) ==== */
.u0ef0fd0{ position:absolute !important; top:10px !important; left:10px !important; z-index:2 !important; font-family:var(--f-mono) !important; font-size:8px !important; letter-spacing:.08em !important; text-transform:uppercase !important; background:#101214 !important; color:#fff !important; padding:4px 9px !important; border-radius:999px !important; }
.u1648ea5{ padding-block:0 48px !important; background:var(--bone) !important; }
.u1eb3ce8{ font-family:var(--f-head) !important; font-weight:800 !important; text-transform:uppercase !important; font-size:clamp(1.2rem,2.6vw,1.6rem) !important; line-height:1 !important; }
.u2a2bb0b{ flex:1 !important; min-width:260px !important; }
.u5adc127{ display:flex !important; gap:9px !important; flex-wrap:wrap !important; }
.u5ae331e{ font-family:var(--f-mono) !important; font-size:10px !important; letter-spacing:.14em !important; text-transform:uppercase !important; color:var(--lime) !important; margin-bottom:6px !important; }
.u5dab486{ flex:none !important; }
.u691af2a{ margin-top:12px !important; font-family:var(--f-mono) !important; font-size:10px !important; letter-spacing:.06em !important; text-transform:uppercase !important; }
.ub0ddb85{ color:rgba(255,255,255,.55) !important; }
.ucb5ea9e{ padding-block:6px 26px !important; }
.ud0ef855{ background:var(--ocean-900) !important; color:#fff !important; border-radius:var(--r) !important; padding:24px 22px !important; display:flex !important; align-items:center !important; gap:18px !important; flex-wrap:wrap !important; }
.ud162de7{ color:var(--lime) !important; font-weight:500 !important; }

/* ==== /fits rail (2026-09-01) — shares this sheet with /wheels ====
   The vehicle block's dynamically-added deep-level cells (drive/body/
   package/…, count unbounded — one per attribute the tree returns). */
[data-fits-ymm] [data-ymm-extra-cell] label{ display:none; }
[data-fits-ymm] [data-ymm-extra-cell] select{ width:100%; margin-bottom:6px; border:0; border-radius:4px;
  background:#fff; color:var(--ink); padding:8px; font-size:16px; }
@media (min-width:768px){ [data-fits-ymm] [data-ymm-extra-cell] select{ font-size:13px; } }