@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:400;font-display:swap;src:url('brand/fonts/bvp-400-vietnamese.woff2') format('woff2');unicode-range:U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB}
@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:400;font-display:swap;src:url('brand/fonts/bvp-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:500;font-display:swap;src:url('brand/fonts/bvp-500-vietnamese.woff2') format('woff2');unicode-range:U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB}
@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:500;font-display:swap;src:url('brand/fonts/bvp-500-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:600;font-display:swap;src:url('brand/fonts/bvp-600-vietnamese.woff2') format('woff2');unicode-range:U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB}
@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:600;font-display:swap;src:url('brand/fonts/bvp-600-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:700;font-display:swap;src:url('brand/fonts/bvp-700-vietnamese.woff2') format('woff2');unicode-range:U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB}
@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:700;font-display:swap;src:url('brand/fonts/bvp-700-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:800;font-display:swap;src:url('brand/fonts/bvp-800-vietnamese.woff2') format('woff2');unicode-range:U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB}
@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:800;font-display:swap;src:url('brand/fonts/bvp-800-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}

/* BATCH A DEF-002 (r30): PER-WEIGHT metric-compatible fallbacks so the Be Vietnam Pro swap does not
   reflow text at any used weight (single-average adjust under-sized w600+, flipping chip wraps at
   320px). Values computed from each shipped woff2 vs local Arial (identical charset). */
@font-face{font-family:'Be Vietnam Pro Fallback';font-weight:400;src:local('Arial');size-adjust:106.5%;ascent-override:93.9%;descent-override:24.9%;line-gap-override:0%}
@font-face{font-family:'Be Vietnam Pro Fallback';font-weight:500;src:local('Arial');size-adjust:107.8%;ascent-override:92.7%;descent-override:24.6%;line-gap-override:0%}
@font-face{font-family:'Be Vietnam Pro Fallback';font-weight:600;src:local('Arial');size-adjust:109.2%;ascent-override:91.6%;descent-override:24.3%;line-gap-override:0%}
@font-face{font-family:'Be Vietnam Pro Fallback';font-weight:700;src:local('Arial');size-adjust:110.5%;ascent-override:90.5%;descent-override:24.0%;line-gap-override:0%}
@font-face{font-family:'Be Vietnam Pro Fallback';font-weight:800;src:local('Arial');size-adjust:111.9%;ascent-override:89.4%;descent-override:23.7%;line-gap-override:0%}
/* OD-025 approved brand palette (Rio 2026-07-30): graphite #1F2933 · emerald #10B981 · light gray #E5E7EB · white #FFFFFF.
   Legacy variable NAMES are kept so every existing rule re-themes itself; --gold is now the emphasis colour
   (deep emerald, AA on white), --accent the brand emerald. */
:root{--ink:#1F2933;--muted:#4B5563;--bg:#FFFFFF;--panel:#FFFFFF;--panel2:#F3F4F6;--line:#E5E7EB;--accent:#047857;--gold:#047857;--green:#047857;--red:#B91C1C;--amber:#92400E;--shadow:0 8px 22px rgba(31,41,51,.08);--xm-sat:env(safe-area-inset-top,0px);--xm-sar:env(safe-area-inset-right,0px);--xm-sab:env(safe-area-inset-bottom,0px);--xm-sal:env(safe-area-inset-left,0px)}
/* Accessibility note (Codex OD-025 r1): the approved brand emerald #10B981 stays the BRAND colour (logo,
   tints #ECFDF5/#C8EEDD, decorative borders) but fails WCAG AA as text or as a solid button background
   (2.54:1 vs white). Interactive/solid/emphasis uses therefore run on its AA-passing deep shade
   #047857 (5.48:1 on white, 4.98:1 on the gray panel) with #065F46 (7.68:1) for hover.
   Codex r4 addendum: text sitting ON an emerald tint (rgba(16,185,129,.1–.25)) must be #065F46 — #047857
   dips below 4.5:1 once the tint composites over the gray panel. Hover states may never set #fff over a
   tint. Status boxes (.warnbox/.mp/.pv-chip/.bd.bad) pair light backgrounds (#FEF3C7/#D1FAE5/#FEE2E2)
   with the dark status colours — never dark-theme backgrounds under dark text. */
*{box-sizing:border-box}body{margin:0;font-family:"Be Vietnam Pro","Be Vietnam Pro Fallback",Inter,"Segoe UI",Roboto,Arial,sans-serif;background:var(--bg);color:var(--ink)}
a{color:inherit}button,input,select{font:inherit}
.topbar{position:sticky;top:0;z-index:40;background:rgba(13,9,8,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.top-inner{max-width:1320px;margin:0 auto;padding:13px 18px;display:flex;align-items:center;gap:16px;justify-content:space-between}
.logo{display:flex;align-items:center;gap:11px}.mark{width:40px;height:40px;border-radius:10px;background:linear-gradient(135deg,var(--accent),#065F46);display:grid;place-items:center;font-weight:900;color:var(--gold)}
.brand-word{font-weight:900;font-size:20px;letter-spacing:.3px}.brand-word span{color:var(--gold)}.tagline{color:var(--muted);font-size:11px}
.lang{display:inline-flex;border:1px solid var(--line);border-radius:8px;overflow:hidden}.lang button{border:0;background:var(--panel);color:var(--muted);padding:8px 11px;font-weight:800;cursor:pointer}.lang button.active{background:var(--accent);color:#fff}
[data-lang=en] .vi,[data-lang=vi] .en{display:none!important}
.hero{background:var(--bg)}
.hero-inner{max-width:1320px;margin:0 auto;padding:38px 18px 16px;display:grid;grid-template-columns:1.1fr .9fr;gap:28px;align-items:center}
h1{font-size:clamp(38px,6.5vw,64px);line-height:.95;margin:0 0 12px}.hero-copy{font-size:clamp(14px,1.5vw,17px);color:var(--muted);margin:0 0 12px;font-weight:700}.hero-note{color:#4B5563;font-size:14px;line-height:1.6;max-width:640px}
.hero-photo{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;min-height:170px}.hero-photo img{width:100%;height:100%;min-height:170px;object-fit:cover;border-radius:10px;border:1px solid var(--line);background:#0c0f15}
.wrap{max-width:1320px;margin:0 auto;padding:16px 18px 60px}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;margin:16px 0}
.stat{border:1px solid var(--line);background:var(--panel);border-radius:10px;padding:11px}.stat strong{display:block;font-size:20px;color:var(--gold)}.stat span{color:var(--muted);font-size:12px}
/* Action CTAs — clearly buttons (accent-tinted, raised) */
.actionbar{display:flex;flex-wrap:wrap;gap:9px;margin:16px 0 4px;align-items:center}
.bar-h{flex-basis:100%;font-size:11.5px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:2px}
.actionbar button{border:1.5px solid rgba(16,185,129,.42);background:rgba(16,185,129,.10);color:#047857;border-radius:10px;padding:10px 15px;font-weight:800;font-size:13.5px;cursor:pointer;transition:.15s}
.actionbar button:hover{background:rgba(16,185,129,.2);border-color:var(--accent);color:#065F46;transform:translateY(-1px)}
.actionbar button.key{background:linear-gradient(135deg,var(--accent),#065F46);color:#fff;border-color:transparent;box-shadow:0 6px 18px rgba(16,185,129,.3)}
/* Category tabs — clearly navigation (segmented control, not buttons) */
.navwrap{margin:18px 0 6px}.nav-h{font-size:11.5px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin:0 0 7px}
.tabs{display:inline-flex;gap:2px;flex-wrap:wrap;margin:0;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:5px;max-width:100%}
.tabs button{border:0;background:transparent;color:var(--muted);padding:8px 13px;border-radius:8px;font-weight:800;font-size:13.5px;cursor:pointer;transition:.13s}
.tabs button:hover{color:var(--ink);background:var(--panel2)}
.tabs button.active{background:var(--accent);color:#fff}
.tabs .tsep{width:1px;align-self:stretch;background:var(--line);margin:3px 5px}
.tabpanel{display:none}.tabpanel.active{display:block}
.vstat{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 12px;color:var(--muted);font-size:13px}.vstat b{color:var(--ink)}
.layout{display:grid;grid-template-columns:262px 1fr;gap:20px;align-items:start}
.filters{position:sticky;top:80px;border:1px solid var(--line);border-radius:12px;background:var(--panel);padding:14px;max-height:calc(100vh - 96px);overflow:auto}.filters h2{margin:0 0 12px;font-size:16px}.fg{margin-bottom:11px}.fg label{display:block;color:var(--muted);font-size:12px;font-weight:700;margin-bottom:5px}
select,.range-input,.search-input{width:100%;border:1px solid var(--line);border-radius:9px;padding:10px 11px;min-height:42px;background:var(--panel2);color:var(--ink)}
.twocol{display:grid;grid-template-columns:1fr 1fr;gap:8px}.toggle{display:flex;align-items:center;gap:8px;font-size:13px;color:#4B5563;margin:8px 0}
.toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;gap:10px;flex-wrap:wrap}.count{color:var(--muted);font-size:14px}
.searchbar{margin:10px 0 8px;display:flex;gap:10px;flex-wrap:wrap;align-items:center}.searchbar .q{flex:1;min-width:200px}.searchbar .sortsel{flex:0 0 auto;width:auto;max-width:250px;min-width:170px}.ghost{border:1px solid var(--line);background:var(--panel2);color:var(--ink);border-radius:8px;padding:9px 12px;font-weight:800;cursor:pointer}.sortinfo{color:var(--muted);font-size:13px}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 6px}.chip{border:1px solid var(--line);background:var(--panel2);color:var(--ink);padding:7px 11px;border-radius:999px;font-size:13px;cursor:pointer}.chip:hover{border-color:var(--gold);color:var(--gold)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.card{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--panel);display:flex;flex-direction:column;cursor:pointer;transition:.16s}.card:hover{border-color:#6e3833;box-shadow:var(--shadow);transform:translateY(-2px)}
.media{position:relative;aspect-ratio:16/10;background:#F3F4F6;overflow:hidden}.media img{width:100%;height:100%;object-fit:cover;background:#F3F4F6}
.nophoto{height:100%;display:grid;place-items:center;gap:4px;color:#9CA3AF;font-weight:800;background:repeating-linear-gradient(45deg,#0c0f15,#0c0f15 10px,#10141c 10px,#10141c 20px)}.nophoto small{font-weight:700;color:#9CA3AF}
.sb{position:absolute;top:8px;left:8px;font-size:10px;font-weight:700;border-radius:5px;padding:2px 6px;background:rgba(255,255,255,.94);color:#3C434B;border:1px solid rgba(31,41,51,.14)}
.vb{position:absolute;top:8px;right:8px;font-size:11px;font-weight:800;border-radius:6px;padding:3px 7px;background:rgba(16,185,129,.16);color:#065F46}
.nu{position:absolute;bottom:8px;left:8px;font-size:11px;font-weight:800;border-radius:6px;padding:3px 7px;background:rgba(58,214,168,.16);color:var(--green)}
.pc{position:absolute;bottom:8px;right:8px;background:rgba(0,0,0,.7);color:#fff;font-size:11px;border-radius:6px;padding:3px 6px}
.cbody{padding:12px;display:flex;flex-direction:column;gap:7px;flex:1}.cbody h3{margin:0;font-size:15px;line-height:1.3;min-height:38px}
.price{color:var(--gold);font-size:18px;font-weight:900}.pbadge{font-size:11px;color:var(--muted);margin-left:6px;font-weight:700}
.meta{display:flex;flex-wrap:wrap;gap:6px;color:var(--muted);font-size:12px}
.badges{display:flex;flex-wrap:wrap;gap:5px}.bd{font-size:11px;font-weight:750;border-radius:6px;padding:3px 7px;background:var(--panel2);color:#4B5563;border:1px solid var(--line)}.bd.good{background:#0e2a23;color:var(--green);border-color:#164034}.bd.bad{background:#FEE2E2;color:#B91C1C;border-color:#F5C6C6}.bd.info{background:rgba(16,185,129,.14);color:#065F46;border-color:#A7F3D0}.bd.warn{background:#3a2a12;color:var(--amber);border-color:#5a4420}
.cta{display:flex;gap:6px;flex-wrap:wrap;margin-top:auto;padding-top:6px}.cta a,.cta button{font-size:12px;font-weight:800;border-radius:8px;padding:7px 9px;border:1px solid var(--line);background:var(--panel2);color:var(--ink);text-decoration:none;cursor:pointer}.cta a.primary,.cta button.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.cta a.ctac{background:rgba(16,185,129,.1);border-color:#6e2a24;color:#B91C1C;font-weight:850}.cta a.ctac:hover{background:rgba(16,185,129,.2);color:#B91C1C}
.contact-blk{border:1px solid var(--line);border-radius:12px;background:var(--panel);padding:13px;margin-top:10px}.contact-blk h3{margin:0 0 8px}
.cb-seller{font-size:14px;margin-bottom:10px}
.cb-cta{display:flex;flex-wrap:wrap;gap:8px}
.cb-cta a,.cb-cta button{font-size:13px;font-weight:800;border-radius:9px;padding:9px 13px;border:1px solid var(--line);background:var(--panel2);color:var(--ink);text-decoration:none;cursor:pointer;font-family:inherit}
.cb-cta a.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.cb-cta a:hover,.cb-cta button:hover{filter:brightness(1.12)}
.cb-cta button[data-dealer]{background:rgba(16,185,129,.12);border-color:#A7F3D0;color:#065F46}
.cb-note{margin-top:9px;font-size:11.5px}
.src-chip{margin-top:10px;font-size:11.5px;color:var(--muted)}.src-chip a{color:var(--muted);text-decoration:underline}
.xm-consent{font-size:11.5px;line-height:1.5;color:var(--muted);background:var(--panel);border:1px solid var(--line);border-radius:9px;padding:8px 10px;margin:8px 0}
.xm-ts{margin:10px 0}.xm-ts-note{font-size:11.5px;color:var(--muted);margin:6px 0 0}
.xm-ts-static{display:none}.xm-ts-static.xm-ts-on{display:block}.xm-ts-collapsed{display:block!important;padding-bottom:6px!important}.xm-ts-collapsed .cf-turnstile{display:none!important}.xm-ts-collapsed .xm-ts-note{color:var(--green);margin:0;font-size:12px}
/* MOBILE LIGHTBOX REPAIR (owner feedback round 2, 2026-08-26). Root cause of "no way to close the
   enlarged photo on iPhone": the site shell #gtShell (gt-shell.css) is position:sticky;top:0;
   z-index:1200 and so painted OVER every SPA overlay - .lb was z-index:300, so its close button at
   top:8px/right:8px sat UNDER the shell's 64px band. elementFromPoint on the X returned
   .gt-shell-menu: tapping "close" actually opened the shell's hamburger drawer, which is exactly
   why the only way out felt like reload / go Home. Same defect hit .modal (.gt-shell-right) and
   .finder-modal (.gt-shell-menu). Fix = lift the whole SPA overlay band above the shell, keeping
   the existing RELATIVE order (modal < finder < toast < lightbox < visual-search) byte-for-byte
   intact so nothing else changes: 100->1300, 110->1310, 240->1340, 300->1360, 1200->1400.
   touch-action goes pan-y -> none: pan-y never permitted pinch-zoom anyway (that value excludes it),
   so nothing is lost, and it is what stops the page behind scrolling under the overlay on iOS. */
.lb{position:fixed;inset:0;z-index:1360;background:rgba(0,0,0,.93);display:none;align-items:center;justify-content:center;touch-action:none;overscroll-behavior:contain}
.lb.open{display:flex}
.lb-img{max-width:94vw;max-height:84vh;object-fit:contain;border-radius:6px;box-shadow:0 8px 40px rgba(0,0,0,.6)}
/* 44x44 minimum tap target, inside the iPhone safe area (env() is 0 without viewport-fit=cover,
   where iOS already insets the web view itself - the calc() is correct in both cases), and a white
   ring + shadow so it reads as a control against a near-black backdrop or any photo behind it. */
.lb-x{position:absolute;top:calc(var(--xm-sat,0px) + 10px);right:calc(var(--xm-sar,0px) + 10px);width:44px;height:44px;min-width:44px;min-height:44px;padding:0;border-radius:50%;border:2px solid rgba(255,255,255,.92);background:rgba(17,17,17,.86);color:#fff;font-size:22px;line-height:1;cursor:pointer;z-index:3;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 12px rgba(0,0,0,.65);-webkit-tap-highlight-color:transparent}
.lb-prev,.lb-next{position:absolute;top:50%;transform:translateY(-50%);width:46px;height:46px;border-radius:50%;border:0;background:rgba(0,0,0,.45);color:#fff;font-size:26px;line-height:1;cursor:pointer;z-index:2;display:flex;align-items:center;justify-content:center;padding:0;-webkit-tap-highlight-color:transparent}
.lb-prev{left:calc(var(--xm-sal,0px) + 10px)}.lb-next{right:calc(var(--xm-sar,0px) + 10px)}
.lb-count{position:absolute;bottom:calc(var(--xm-sab,0px) + 16px);left:50%;transform:translateX(-50%);color:#fff;font-size:13px;background:rgba(0,0,0,.5);padding:4px 12px;border-radius:20px}
/* Cosmetic defect found while verifying the repair: the site-wide :focus-visible rule further down
   also sets border-radius:4px, and the modal stack manager auto-focuses .lb-x the moment the
   lightbox opens - so the round close/nav controls always rendered as squared-off boxes. Keep the
   focus outline (accessibility), restore the circle. Scoped to the lightbox only. */
.lb-x:focus-visible,.lb-prev:focus-visible,.lb-next:focus-visible{border-radius:50%}
.lb-src{position:absolute;bottom:14px;right:16px;color:#fff;font-size:12px;background:rgba(255,255,255,.16);padding:6px 12px;border-radius:8px;text-decoration:none}
#mGallery img{cursor:zoom-in;-webkit-touch-callout:none}img.fc-img{cursor:pointer;-webkit-touch-callout:none}
/* the .lb-x{top:8px;right:8px} override that used to live here is deliberately gone - it dropped the
   button back out of the safe-area calc above, which is where the iPhone defect lived. */
@media(max-width:600px){.lb-prev,.lb-next{width:44px;height:44px;font-size:22px}.lb-src{bottom:54px}}
.cb-report{margin-top:10px;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.cb-report button{font-size:11.5px;font-weight:700;border:1px solid var(--line);background:var(--panel2);color:var(--muted);border-radius:7px;padding:5px 9px;cursor:pointer;font-family:inherit}
.cb-report button:hover{color:var(--ink);border-color:var(--accent)}
.section-title{font-size:19px;margin:4px 0 6px}.disc{color:var(--muted);font-size:13px;margin:0 0 14px}
.dir-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.dir-card{border:1px solid var(--line);border-radius:12px;background:var(--panel);padding:14px;display:flex;flex-direction:column;gap:8px;cursor:pointer}.dir-card h3{margin:0;font-size:16px}
.dir-meta{color:var(--muted);font-size:13px;line-height:1.5}.tag{font-size:11px;font-weight:750;border-radius:6px;padding:3px 7px;background:var(--panel2);color:#4B5563;border:1px solid var(--line)}.tag.official{background:rgba(16,185,129,.14);color:#065F46;border-color:#A7F3D0}.tag.car{background:rgba(16,185,129,.14);color:#065F46;border-color:#A7F3D0}
.tags{display:flex;flex-wrap:wrap;gap:5px}.rating{color:var(--amber);font-weight:800}
.dir-bar{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 16px}.dir-bar select{max-width:210px}
.model-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}.model-card{border:1px solid var(--line);border-radius:10px;padding:13px;background:var(--panel);cursor:pointer}.model-card:hover{border-color:var(--accent)}.model-card strong{display:block;font-size:15px;margin-bottom:6px}.model-card .mini{color:var(--muted);font-size:13px;line-height:1.55}
.promo-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin-top:8px}.promo{border:1px dashed var(--line);border-radius:10px;padding:13px;background:linear-gradient(180deg,rgba(16,185,129,.05),transparent);color:var(--muted);font-size:13px}.promo strong{display:block;color:var(--ink);margin-bottom:3px}.promo.live{cursor:pointer;border-style:solid}.promo.live:hover{border-color:var(--accent);transform:translateY(-2px)}.promo.live span{color:var(--gold);font-weight:700}
.hrow{display:flex;gap:12px;overflow-x:auto;padding:4px 2px 12px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}.hrow>*{flex:0 0 270px;scroll-snap-align:start}.hrow .model-card{flex:0 0 230px}
.hot-sec{margin:6px 0 16px}.hot-sec h3{margin:0 0 8px;font-size:17px}
.mbars{display:flex;flex-direction:column;gap:6px;margin:8px 0}.mbar{display:grid;grid-template-columns:118px 1fr 40px;gap:8px;align-items:center;font-size:12px;color:var(--muted)}.mbar .track{height:9px;border-radius:6px;background:var(--panel2);overflow:hidden}.mbar .fill{height:100%;background:var(--accent)}
.rel-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:8px}.rel-item{border:1px solid var(--line);border-radius:9px;overflow:hidden;background:var(--panel2);cursor:pointer}.rel-item img{width:100%;aspect-ratio:16/10;object-fit:cover}.rel-item .ri{padding:7px}.rel-item .ri b{display:block;font-size:12px;color:var(--ink);line-height:1.3}.rel-item .ri span{font-size:12px;color:var(--gold);font-weight:800}
.warnbox{border:1px solid #FDE68A;background:#FEF3C7;color:var(--amber);border-radius:9px;padding:10px;font-size:13px;margin:10px 0}
.histbox{border:1px solid var(--line);background:var(--panel2);border-radius:9px;padding:10px;font-size:13px;margin:10px 0;color:#4B5563}
.modal{position:fixed;inset:0;background:rgba(0,0,0,.8);display:none;align-items:flex-start;justify-content:center;padding:22px;z-index:1300;overflow:auto}.modal.open{display:flex}
.modal-panel{width:min(1080px,100%);background:var(--panel);border:1px solid var(--line);border-radius:14px;overflow:hidden}.soon-modal .modal-panel,.val-modal .modal-panel{width:min(560px,100%)}
.modal-head{display:flex;justify-content:space-between;gap:12px;padding:16px;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--panel)}.modal-title{margin:0;font-size:21px}.close{border:1px solid var(--line);background:var(--panel2);color:var(--ink);border-radius:8px;padding:8px 12px;cursor:pointer}
.modal-body{padding:16px;display:grid;grid-template-columns:1.1fr .9fr;gap:18px}.gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.gallery img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:8px;background:#0c0f15}
.spec-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:10px 0}.spec{border:1px solid var(--line);border-radius:8px;padding:9px;background:var(--panel2)}.spec small{display:block;color:var(--muted);margin-bottom:3px}.notes{color:#4B5563;line-height:1.55;white-space:pre-wrap}
.soon-body{padding:20px}.soon-body p{color:#4B5563;line-height:1.6;margin:0 0 10px}
.tray{position:fixed;right:16px;bottom:16px;z-index:70;background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:12px;display:none;max-width:min(560px,calc(100vw - 32px))}.tray.open{display:block}
.footer-note{color:var(--muted);font-size:12px;margin-top:30px;line-height:1.6}
/* hero search */
.hero-inner2{max-width:920px;margin:0 auto;padding:46px 18px 20px;text-align:center}
.hero-h1{font-size:clamp(38px,6.5vw,62px);line-height:.95;margin:0 0 8px}
.hero-tag{font-size:clamp(18px,2.5vw,27px);font-weight:850;color:var(--gold);margin:0 0 8px;line-height:1.15;letter-spacing:.2px}
.hero-promise{font-size:clamp(15px,1.8vw,19px);color:#4B5563;font-weight:700;margin:0 0 8px;line-height:1.3}
.hero-search{display:flex;gap:8px;max-width:660px;margin:20px auto 12px;background:var(--panel);border:1.5px solid var(--line);border-radius:14px;padding:7px;box-shadow:var(--shadow)}
.hero-search:focus-within{border-color:var(--accent)}
.hero-q{flex:1;border:0;background:transparent;color:var(--ink);font-size:16px;padding:12px 14px;outline:none;min-width:0;min-height:auto}
.hero-go{border:0;background:linear-gradient(135deg,var(--accent),#065F46);color:#fff;font-weight:800;font-size:15px;padding:0 22px;border-radius:10px;cursor:pointer;white-space:nowrap}
.hero-quick{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin:8px 0 2px}
.hero-quick button{border:1px solid var(--line);background:var(--panel2);color:#4B5563;border-radius:999px;padding:8px 15px;font-weight:800;font-size:13px;cursor:pointer}
.hero-quick button:hover{border-color:var(--accent);color:#fff}
/* navbar links */
.navlinks{display:flex;align-items:center;gap:3px}
.navlinks button{border:0;background:transparent;color:var(--muted);font-weight:800;font-size:13px;padding:8px 11px;border-radius:8px;cursor:pointer;white-space:nowrap}
.navlinks button:hover{color:var(--ink);background:var(--panel2)}
.navlinks .post{background:var(--accent);color:#fff}.navlinks .post:hover{background:#b51d15;color:#fff}
.navlinks .bn{display:inline-block;min-width:15px;font-size:10px;background:var(--accent);color:#fff;border-radius:8px;padding:0 5px;margin-left:3px;font-weight:900}
.topright{display:flex;align-items:center;gap:8px}
.menu-toggle{display:none;border:1px solid var(--line);background:var(--panel2);color:var(--ink);font-size:18px;line-height:1;padding:7px 11px;border-radius:9px;cursor:pointer}
/* detail-modal CTA row */
.mcta{display:flex;gap:8px;flex-wrap:wrap;margin:2px 0 14px}
.mcta a,.mcta button{flex:1 1 auto;min-width:130px;text-align:center;font-size:13px;font-weight:800;border-radius:10px;padding:11px 12px;border:1.5px solid var(--line);background:var(--panel2);color:var(--ink);text-decoration:none;cursor:pointer}
.mcta a.primary{background:linear-gradient(135deg,var(--accent),#065F46);border-color:transparent;color:#fff}
.mcta .src{border-color:rgba(16,185,129,.42);background:rgba(16,185,129,.10);color:#047857}
.mcta button:hover,.mcta a:hover{border-color:var(--accent)}
.mcta-bottom{margin:14px 0 2px}
/* compare tray + hint + compare modal */
.tray .thint{font-size:12px;color:var(--amber);margin-top:7px}
.tray .tgo{margin-top:9px;width:100%;border:0;border-radius:9px;padding:9px;font-weight:800;cursor:pointer;background:var(--accent);color:#fff}
.tray .tgo:disabled{background:var(--panel2);color:var(--muted);cursor:not-allowed}
.cmp-wrap{overflow-x:auto}.cmp-tbl{width:100%;border-collapse:collapse;font-size:13px;min-width:420px}.cmp-tbl th,.cmp-tbl td{border:1px solid var(--line);padding:9px;text-align:left;vertical-align:top}.cmp-tbl th{background:var(--panel2);color:var(--muted);font-weight:800;white-space:nowrap;position:sticky;left:0}.cmp-tbl td{color:#374151}.cmp-tbl img{width:100%;max-width:150px;aspect-ratio:16/10;object-fit:cover;border-radius:7px}
.cta button[data-cmp].on{background:var(--accent);color:#fff;border-color:var(--accent)}
/* mobile filter drawer toggle */
.filter-toggle{display:none;width:100%;margin:0 0 10px;border:1.5px solid var(--accent);background:rgba(16,185,129,.1);color:#047857;border-radius:10px;padding:11px;font-weight:800;cursor:pointer}
@media(max-width:980px){
  .top-inner{position:relative}
  .hero-inner2{padding-left:16px;padding-right:16px}
  .layout{grid-template-columns:1fr}
  .filter-toggle{display:block}
  .filters{position:static;max-height:none;display:none}
  .filters.open{display:block}
  .modal{padding:10px}.modal-body{grid-template-columns:1fr}
  .menu-toggle{display:inline-flex}
  .navlinks{display:none;position:absolute;top:calc(100% + 8px);right:14px;flex-direction:column;align-items:stretch;background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:7px;z-index:60;min-width:190px;max-width:calc(100vw - 28px)}
  .topbar.menu-open .navlinks{display:flex}
  .navlinks button{text-align:left;white-space:normal}
}
@media(max-width:560px){
  .stats{grid-template-columns:repeat(2,1fr)}
  .hero-search{flex-wrap:wrap}.hero-go{flex:1 1 100%;padding:12px}
  .actionbar button{flex:1 1 auto}
  .mcta a,.mcta button{flex:1 1 100%}
  .navwrap{position:relative}
  .tabs{display:flex;flex-wrap:nowrap;overflow-x:auto;width:100%;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .tabs button{flex:0 0 auto}
  .navwrap::after{content:"";position:absolute;right:0;bottom:5px;height:42px;width:30px;background:linear-gradient(90deg,transparent,var(--bg));pointer-events:none}
  .searchbar .sortsel{flex:1 1 100%;max-width:none}
  .modal-head{padding:13px}.modal-title{font-size:18px}.gallery{grid-template-columns:1fr}
}
.lead-form{display:flex;flex-direction:column;gap:9px;margin:8px 0}.lead-form label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted);font-weight:700}.lead-form textarea{resize:vertical;min-height:64px;font-family:inherit}
/* company footer */
.site-footer{border-top:1px solid var(--line);background:#0a0706;margin-top:36px}
.foot-inner{max-width:1320px;margin:0 auto;padding:26px 18px 30px}
.foot-brand .logo{margin-bottom:8px}.foot-tag{color:#4B5563;font-weight:700;margin:0 0 8px;font-size:14px}
.foot-op{color:var(--muted);font-size:13px;margin:0 0 4px}.foot-em{font-size:13px;margin:0 0 14px}.foot-em a{color:var(--gold);font-weight:700;text-decoration:none}.foot-em a:hover{text-decoration:underline}
.foot-links{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 14px}
.foot-links button{border:1px solid var(--line);background:var(--panel2);color:#4B5563;border-radius:8px;padding:8px 12px;font-weight:700;font-size:13px;cursor:pointer}
.foot-links button:hover{border-color:var(--accent);color:#fff}
.foot-disc{color:var(--muted);font-size:12px;line-height:1.6;margin:0;max-width:920px}
/* page modal (about/terms/privacy/etc) */
.page-modal .modal-panel{width:min(720px,100%)}
.pg-body{padding:18px;line-height:1.65;color:#374151;font-size:14.5px}.pg-body p{margin:0 0 11px}.pg-body a{color:var(--gold)}
.pg-ul{margin:6px 0 12px;padding-left:18px}.pg-ul li{margin:6px 0;color:#374151}
.vthumb.vph{background:linear-gradient(135deg,#0b3d2e,#047857);min-height:96px;border-radius:10px}
.vthumb-ph{display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#0b3d2e,#047857);color:#fff;font-size:26px;width:100%;height:100%;min-height:96px;border-radius:10px}
.vbadge{position:absolute;left:8px;bottom:8px;background:rgba(2,44,34,.82);color:#fff;font-size:10.5px;font-weight:800;padding:3px 8px;border-radius:999px;letter-spacing:.02em}
.vcar{display:flex;gap:10px;overflow-x:auto;padding:4px 0 10px}.vcar .vc{flex:0 0 210px;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff;cursor:pointer}
.vcar .vc img{width:100%;height:118px;object-fit:cover;display:block}.vcar .vc .vt{font-size:12.5px;font-weight:700;padding:7px 9px 2px;line-height:1.3}.vcar .vc .vm{font-size:11.5px;color:#6b7280;padding:0 9px 8px}
.trust-chip.nd{background:#f3f4f6;color:#6b7280;border-color:#e5e7eb;font-weight:600}
.card-dealer .trust-chip{white-space:normal;line-height:1.3;text-align:left}
.trust-chip{display:inline-block;font-size:11px;font-weight:850;border-radius:6px;padding:3px 8px;background:rgba(16,185,129,.12);color:#065F46;border:1px solid #A7F3D0;white-space:nowrap;font-family:inherit;line-height:1.35;vertical-align:middle}
.trust-chip.clk{cursor:pointer;transition:background .12s,border-color .12s}
.trust-chip.clk:hover,.trust-chip.clk:focus-visible{background:rgba(16,185,129,.24);border-color:var(--gold);outline:none}
.card-dealer{margin:6px 0 0}
.dm-kicker{font-size:10.5px;font-weight:850;letter-spacing:.05em;text-transform:uppercase;color:var(--gold);opacity:.92;margin-bottom:8px}
.dm-foot{font-size:11.5px;line-height:1.55;color:var(--muted);border-top:1px solid var(--line);margin-top:14px;padding-top:11px}
.bdg-dealer{font-family:inherit;cursor:pointer;color:#065F46;border-color:#A7F3D0;background:rgba(16,185,129,.1);transition:background .12s,border-color .12s}
.bdg-dealer:hover,.bdg-dealer:focus-visible{background:rgba(16,185,129,.22);border-color:var(--gold);outline:none}
.ext-chip{display:inline-block;font-size:11px;font-weight:750;border-radius:6px;padding:3px 7px;margin:2px 0 0 4px;background:var(--panel2);color:#4B5563;border:1px solid var(--line)}.ext-chip.g{color:#047857}.ext-chip.f{color:#1D4ED8}
.trust-sec{border:1px solid var(--line);border-radius:11px;background:var(--panel2);padding:12px;margin:12px 0}.trust-sec h3{margin:0 0 8px}
.trust-score-row{display:flex;gap:12px;align-items:flex-start;margin-bottom:8px}
.sr2 h3{margin:0 0 6px}
.sr2c{display:inline-block;border-radius:999px;padding:3px 10px;font-size:11.5px;margin:2px 4px 2px 0;border:1px solid var(--line)}
.sr2c.ok{background:rgba(16,185,129,.09);border-color:#10b981;color:#047857;font-weight:700}
.sr2c.nd{background:var(--panel2,#f4f4f5);color:var(--muted,#6b7280)} /* neutral gray — missing data is NEVER styled as bad */
.sr2g{margin:8px 0}.sr2g b{font-size:12.5px}.sr2cs{margin-top:3px}
.sr2-why summary{cursor:pointer;font-weight:800;font-size:13.5px;margin:8px 0;color:var(--accent,#047857)}
.sr2-not{font-size:12px;color:var(--muted);border-top:1px dashed var(--line);padding-top:8px}
.fadv{border:1px solid var(--line);border-radius:12px;padding:4px 10px;margin:10px 0;background:var(--panel2,#fafafa)}
.fadv summary{cursor:pointer;font-weight:800;font-size:13.5px;padding:8px 2px;min-height:44px;box-sizing:border-box;list-style:none;display:flex;justify-content:space-between;align-items:center}
.fadv summary::-webkit-details-marker{display:none}
.fadv[open] .fadv-caret{transform:rotate(180deg)}.fadv-caret{transition:transform .15s}
.trust-score{font-size:30px;font-weight:900;color:var(--gold);line-height:1;white-space:nowrap}.trust-score small{font-size:14px;color:var(--muted);font-weight:700}
.tck-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:8px 0}
.tck{display:flex;gap:7px;align-items:center;font-size:12.5px;border:1px solid var(--line);border-radius:7px;padding:6px 8px;background:var(--panel)}.tck b{margin-left:auto;color:var(--muted);font-weight:800}
.tck.ok{border-color:#2c4a32}.tck.ok>span:first-child{color:var(--green)}.tck.ok b{color:#047857}
.tck.pend>span:first-child{color:#92400E}.tck.no>span:first-child{color:#4B5563}
.ext-block{border:1px solid var(--line);border-radius:9px;padding:10px;margin-top:8px;background:var(--panel)}.ext-block.muted{opacity:.85}
.ext-h{font-weight:800;margin-bottom:5px}
.ext-rev{font-size:12.5px;color:#4B5563;border-left:2px solid var(--line);padding-left:8px;margin:6px 0;line-height:1.5}
.ext-block a{display:inline-block;margin-top:6px;color:var(--gold);font-weight:700}
@media(max-width:560px){.tck-grid{grid-template-columns:1fr}}
.presets{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:8px 0}
/* --- Simplified mobile result controls + filter bottom-sheet (Tom UX 2026-08-12) --- */
.rsearch{margin:10px 0 8px}.rsearch .q{width:100%}
.rtoolbar{display:flex;align-items:center;gap:10px;margin:0 0 8px;flex-wrap:wrap}
.rcount{font-size:19px;font-weight:800;color:var(--ink);flex:0 0 auto}
.rtools{margin-left:auto;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.rbtn{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--panel2);color:var(--ink);border-radius:10px;padding:9px 13px;font-weight:800;font-size:14px;cursor:pointer;line-height:1}
.rbtn b{color:var(--accent,#10b981)}
.rselwrap{padding:0 6px 0 13px}.rsel{border:0;background:none;color:var(--ink);font-weight:800;font-size:14px;cursor:pointer;max-width:150px;padding:9px 4px 9px 0}
.rmini{padding:9px 12px;font-size:16px}
.poprow{display:flex;gap:7px;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:2px;flex-wrap:nowrap;margin:0 0 10px;scrollbar-width:none}.poprow::-webkit-scrollbar{display:none}
.poprow>button{flex:0 0 auto;white-space:nowrap}
.achips{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 8px}
.achips:empty{display:none}
.achip{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--accent,#10b981);background:rgba(16,185,129,.08);color:#047857;border-radius:20px;padding:5px 11px;font-size:12.5px;font-weight:700;cursor:pointer}
.achip b{font-weight:800;opacity:.7}
.filter-sheet .modal-panel{width:min(560px,100%);max-height:88vh;overflow-y:auto;padding:18px 16px}
.fsheet-actions{position:sticky;bottom:-18px;background:var(--panel);display:flex;gap:10px;padding:12px 0 2px;margin-top:8px;border-top:1px solid var(--line)}
.fsheet-actions>*{flex:1}
.filters-sheet{display:block!important}
.filters-sheet h2{display:none} /* the sheet already carries its own title */
@media(max-width:640px){.filter-sheet{align-items:flex-end;padding:0}.filter-sheet .modal-panel{width:100%;max-width:100%;max-height:90vh;border-radius:16px 16px 0 0}}
.presets .preset-lbl{font-size:12px;color:var(--muted);font-weight:700;margin-right:2px}
.presets button{font-size:12.5px;font-weight:700;border:1px solid var(--line);background:var(--panel2);color:var(--ink);border-radius:999px;padding:5px 11px;cursor:pointer}
.presets button:hover{border-color:var(--accent);color:var(--gold)}
.video-feed{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px;margin-top:12px}
.vcard{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--panel);cursor:pointer;display:flex;flex-direction:column}
.vthumb{position:relative;aspect-ratio:9/16;background:#0d0d10;overflow:hidden}.vthumb img{width:100%;height:100%;object-fit:cover}
.vplay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:40px;color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.7);pointer-events:none}
.vsrc{position:absolute;top:8px;left:8px;background:rgba(0,0,0,.62);color:#fff;font-size:11px;font-weight:800;padding:3px 7px;border-radius:6px}
.vbody{padding:10px;display:flex;flex-direction:column;gap:5px}.vbody h4{margin:0;font-size:13.5px;line-height:1.3}
.vmeta{font-size:12px;color:var(--muted)}
.vcta{display:flex;flex-wrap:wrap;gap:6px;margin-top:3px}
.vcta button,.vcta a{font-size:11.5px;font-weight:700;border:1px solid var(--line);background:var(--panel2);color:var(--ink);border-radius:7px;padding:5px 8px;cursor:pointer;text-decoration:none}
.vcta a.tk{background:var(--accent);color:#fff;border-color:var(--accent)}
.vid-strip{display:flex;gap:8px;overflow-x:auto;padding:4px 0}.vid-strip .vthumb{flex:0 0 92px;aspect-ratio:9/16;border-radius:8px}
.valcard{border:1px solid var(--line);border-radius:12px;background:var(--panel2);padding:12px}
.valcard-h{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px}.valcard-h b{font-size:16px}
.val-prices{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;text-align:center}
.val-prices>div{border:1px solid var(--line);border-radius:9px;padding:8px;background:var(--panel)}
.val-prices small{display:block;color:var(--muted);font-size:11px;margin-bottom:3px}.val-prices b{font-size:15px}
.val-prices .val-med{border-color:#A7F3D0}.val-prices .val-med b{color:var(--gold);font-size:17px}



@media(max-width:560px){.video-feed{grid-template-columns:1fr 1fr}}
/* ===== Tìm xe thông minh (buyer concierge chat) ===== */
.finder-modal{padding:0;align-items:stretch;justify-content:center;z-index:1310}
.finder-modal .modal-panel{width:min(640px,100%);max-height:100vh;height:100%;display:flex;flex-direction:column;border-radius:0;border:0}
@media(min-width:641px){.finder-modal{padding:18px}.finder-modal .modal-panel{height:auto;max-height:calc(100vh - 36px);border-radius:16px;border:1px solid var(--line)}}
/* #7(b): the first step (greeting + type chips only) shouldn't leave a big empty gap on mobile — hug content instead of stretching full-height */
@media(max-width:640px){.finder-modal.fin-firststep{align-items:flex-start}.finder-modal.fin-firststep .modal-panel{height:auto;max-height:100vh}.finder-modal.fin-firststep .fin-chat{flex:0 1 auto;min-height:0;padding-bottom:6px}}
.fin-head{align-items:flex-start}.fin-head .modal-title{font-size:19px;display:flex;align-items:center;gap:8px}.fin-sub{margin-top:4px;max-width:92%;font-size:12.5px}
.fin-chat{flex:1;overflow-y:auto;padding:15px;display:flex;flex-direction:column;gap:10px;background:linear-gradient(180deg,#F9FAFB,#F3F4F6);-webkit-overflow-scrolling:touch}
.fin-input{border-top:1px solid var(--line);background:var(--panel);padding:11px 13px 13px;display:flex;flex-direction:column;gap:9px}
.fin-msg{max-width:88%;padding:10px 13px;border-radius:14px;font-size:14px;line-height:1.5;white-space:pre-wrap;word-break:break-word}
.fin-msg.bot{align-self:flex-start;background:var(--panel2);border:1px solid var(--line);color:#1F2933;border-bottom-left-radius:4px}
.fin-msg.user{align-self:flex-end;background:linear-gradient(135deg,var(--accent),#065F46);color:#fff;font-weight:700;border-bottom-right-radius:4px}
.fin-msg.wide{max-width:100%;background:transparent;border:0;padding:2px 0}
.fin-msg.fin-loadblock{max-width:100%;background:transparent;border:0;padding:2px 0}
.fin-opts{display:flex;flex-wrap:wrap;gap:8px}
.fin-chip{border:1.5px solid var(--line);background:var(--panel2);color:var(--ink);border-radius:999px;padding:9px 14px;font-size:13.5px;font-weight:750;cursor:pointer;transition:.13s}
.fin-chip:hover{border-color:var(--accent);color:#047857}
.fin-chip.on{background:rgba(16,185,129,.18);border-color:var(--accent);color:#065F46}
.fin-chip.go{background:linear-gradient(135deg,var(--accent),#065F46);color:#fff;border-color:transparent}
.fin-chip.gold{background:linear-gradient(135deg,var(--gold),#065F46);color:#ffffff;border-color:transparent}
.fin-chip.dash{background:transparent;color:var(--muted);border-style:dashed}
.fin-skip{display:flex;flex-wrap:wrap;gap:8px;justify-content:space-between;align-items:center}
.fin-textrow{display:flex;gap:7px}
.fin-textin{flex:1;min-width:0;border:1.5px solid var(--line);border-radius:10px;padding:11px 13px;background:var(--panel2);color:var(--ink);font-size:15px;min-height:44px}
.fin-textin:focus{outline:none;border-color:var(--accent)}
.fin-send{border:0;border-radius:10px;padding:0 17px;font-weight:850;font-size:13.5px;cursor:pointer;background:linear-gradient(135deg,var(--accent),#065F46);color:#fff;white-space:nowrap}
.fin-send[disabled]{opacity:.6;cursor:progress;filter:saturate(.7)}
/* FIX2: search-progress UX — product-safe step label + pulsing dots + skeleton listing cards (perceived-hang guard, NOT chain-of-thought) */
.fin-loading{display:flex;align-items:center;gap:9px;font-size:13.5px;font-weight:700;color:var(--ink);padding:2px 0 4px}
.fin-loading .fl-step{transition:opacity .18s ease}
.fin-dots{display:inline-flex;gap:4px;align-items:center}
.fin-dots i{width:6px;height:6px;border-radius:50%;background:var(--accent,#c0392b);display:inline-block;animation:findot 1s infinite ease-in-out}
.fin-dots i:nth-child(2){animation-delay:.16s}.fin-dots i:nth-child(3){animation-delay:.32s}
@keyframes findot{0%,80%,100%{transform:scale(.5);opacity:.4}40%{transform:scale(1);opacity:1}}
.fin-skel{border:1px solid var(--line);border-radius:12px;background:var(--panel);overflow:hidden;margin:8px 0;display:flex;gap:10px;padding:10px}
.fin-skel .sk-img{width:120px;height:78px;border-radius:8px;flex:0 0 auto}
.fin-skel .sk-main{flex:1;display:flex;flex-direction:column;gap:8px;padding-top:4px}
.fin-skel .sk-line{height:12px;border-radius:6px}.fin-skel .sk-line.w70{width:70%}.fin-skel .sk-line.w40{width:40%}.fin-skel .sk-line.w90{width:90%}
.sk-shimmer{background:linear-gradient(100deg,var(--panel2) 30%,rgba(255,255,255,.10) 50%,var(--panel2) 70%);background-size:200% 100%;animation:finshimmer 1.25s infinite linear}
@keyframes finshimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
.fin-num{display:flex;gap:8px;flex-wrap:wrap}.fin-num input,.fin-input select{flex:1;min-width:130px;border:1px solid var(--line);border-radius:9px;padding:10px 11px;background:var(--panel2);color:var(--ink);min-height:44px}
.fin-note{font-size:11.5px;color:var(--muted);line-height:1.5}
.fin-bucket{margin:13px 0 1px;font-size:14px;font-weight:850;color:var(--gold);display:flex;align-items:baseline;gap:7px;flex-wrap:wrap}.fin-bucket .bk-sub{font-size:11px;font-weight:700;color:var(--muted)}
.fin-card{border:1px solid var(--line);border-radius:12px;background:var(--panel);overflow:hidden;margin:8px 0;display:flex;flex-direction:column}
.fc-top{display:flex;gap:10px;padding:10px}
.fc-img{width:98px;height:74px;flex:0 0 98px;aspect-ratio:98/74;min-height:74px;border-radius:8px;object-fit:cover;background:#F3F4F6}
.fc-noimg{width:98px;height:74px;flex:0 0 98px;border-radius:8px;display:grid;place-items:center;background:repeating-linear-gradient(45deg,#0c0f15,#0c0f15 8px,#12100f 8px,#12100f 16px);color:#9CA3AF;font-size:22px}
.fc-main{flex:1;min-width:0}.fin-card h4{margin:0 0 3px;font-size:14px;line-height:1.32}
.fc-price{color:var(--gold);font-weight:900;font-size:15px}.fc-price .mp{font-size:11px;font-weight:800;margin-left:6px;border-radius:5px;padding:1px 6px}
.mp.below{background:#D1FAE5;color:var(--green);border:1px solid #A7F3D0}.mp.fair{background:rgba(16,185,129,.14);color:#065F46;border:1px solid #A7F3D0}.mp.above{background:#FEF3C7;color:var(--amber);border:1px solid #FDE68A}.mp.low,.mp.poa{background:var(--panel2);color:#4B5563;border:1px solid var(--line)}
.fc-meta{font-size:11.5px;color:var(--muted);margin-top:3px;display:flex;flex-wrap:wrap;gap:8px}
.fin-tscore{font-size:11px;font-weight:850;border-radius:5px;padding:1px 6px;background:rgba(16,185,129,.12);color:#065F46;border:1px solid #A7F3D0}
.fin-why{font-size:12px;color:#4B5563;padding:0 10px 6px}.fin-why b{color:#92400E;font-weight:800}
.fin-cav{font-size:11.5px;color:var(--amber);padding:0 10px 7px;line-height:1.45}
.fin-pv{margin:2px 10px 8px;padding:9px 11px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.02)}
.pv-row{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px}
.pv-h{font-size:12px;font-weight:800;color:#92400E}
.pv-chip{font-size:12px;font-weight:800;padding:3px 10px;border-radius:999px}
.pv-chip.below{background:#D1FAE5;color:var(--green);border:1px solid #A7F3D0}
.pv-chip.fair{background:#ECFDF5;color:#047857;border:1px solid #A7F3D0}
.pv-chip.above{background:#FEF3C7;color:var(--amber);border:1px solid #FDE68A}
.pv-chip.warn{background:#FEE2E2;color:#B91C1C;border:1px solid #F5C6C6}
.pv-chip.low,.pv-chip.poa{background:var(--panel2);color:#4B5563;border:1px solid var(--line)}
.pv-note{font-size:11.5px;color:#4B5563;line-height:1.5;margin-top:5px}
.pv-conf{font-size:10.5px;color:#4B5563;margin-top:4px}
.pv-bar{position:relative;height:6px;border-radius:3px;margin:10px 2px 3px;background:linear-gradient(90deg,#A7F3D0,#FDE68A 55%,#FECDA8)}
.pv-med{position:absolute;top:-3px;width:2px;height:12px;background:#92400E;border-radius:1px;transform:translateX(-1px)}
.pv-dot{position:absolute;top:-4px;width:14px;height:14px;border-radius:50%;border:2px solid #14100e;transform:translateX(-7px)}
.pv-dot.below{background:var(--green)}.pv-dot.fair{background:#047857}.pv-dot.above{background:var(--amber)}.pv-dot.warn{background:#ff6b5c}
.pv-scale{display:flex;justify-content:space-between;font-size:10px;color:#4B5563;margin:0 2px}
.ff-trust{margin-top:12px;display:grid;gap:4px}
.ff-trust span{display:block;font-size:12px;color:#4B5563;line-height:1.5}
.fin-rankwhy{font-size:11px;color:#4B5563;padding:0 10px 6px;line-height:1.5}
.fin-rankwhy b{color:#92400E;font-weight:800}
.cmp-note{font-size:12.5px;color:#4B5563;line-height:1.6;margin:0 0 10px;padding:9px 11px;border:1px solid var(--line);border-radius:10px;background:rgba(255,255,255,.02)}
.cmp-note b{color:#92400E}
.cmp-tbl td.cmp-best{box-shadow:inset 0 0 0 1.5px #2e6b4f;background:rgba(22,64,52,.25);border-radius:6px}
.fin-shortbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:10px 0 2px}
.fin-shortbar .fin-chip.on{background:#ECFDF5;border-color:#047857;color:#047857}
.fc-cta{display:flex;flex-wrap:wrap;gap:6px;padding:0 10px 10px}
.fc-cta a,.fc-cta button{font-size:11.5px;font-weight:800;border-radius:8px;padding:6px 9px;border:1px solid var(--line);background:var(--panel2);color:var(--ink);text-decoration:none;cursor:pointer}
.fc-cta .primary{background:var(--accent);border-color:var(--accent);color:#fff}
/* Item 4: urgent-mode CTA — contact becomes the gold primary, the rest are de-emphasised */
.fc-cta .gold-cta{background:linear-gradient(135deg,var(--gold),#065F46);border-color:var(--gold);color:#ffffff;font-weight:900;order:-1;box-shadow:0 4px 12px rgba(16,185,129,.22)}
.fin-card-urgent .fc-cta button{opacity:.78;font-weight:750}
.fin-card-urgent .fc-cta .gold-cta{opacity:1}
.fc-more{display:none}
@media(max-width:480px){
  /* mobile result card: ONE primary action (Xem chi tiết, or gold Liên hệ when urgent) + a "Thêm" overflow — mirrors the .ad-cta pattern, no 5 wrapped buttons */
  .fc-cta:not(.fc-open)>*:not(.primary):not(.gold-cta):not(.fc-more){display:none}
  .fc-cta.fc-open>*{display:inline-flex}
  .fc-more{display:inline-flex}
  .fc-cta a,.fc-cta button{min-height:44px;align-items:center;justify-content:center;font-size:13px;padding:10px 12px;flex:1 1 auto}
  .fc-cta .fc-more{flex:0 0 auto}
  /* collapsible "Vì sao" — the caution/anomaly/verify lines are separate .fin-cav blocks and ALWAYS stay visible */
  .fin-why .why-r{display:none}
  .fin-why.fc-open .why-r{display:block;margin-top:4px}
  .fin-why .why-h{cursor:pointer;display:inline-flex;align-items:center;min-height:36px}
  .fin-why .why-h::after{content:"▾";margin-left:6px;color:#92400E}
  .fin-why.fc-open .why-h::after{content:"▴"}
  /* readable metadata (no 10px) */
  .fin-card h4{font-size:15px;line-height:1.3}
  .fc-meta{font-size:13px}
  .fin-why{font-size:13px}
  .fin-cav{font-size:13px}
  .fin-pv .pv-note{font-size:12.5px}
  .ff-trust span{font-size:12.5px}
}
.fin-follow{display:flex;flex-wrap:wrap;gap:7px;margin:7px 0 2px}
.fin-actions{display:flex;flex-wrap:wrap;gap:7px;margin-top:9px;border-top:1px dashed var(--line);padding-top:9px}
.hero-finder{display:inline-flex;align-items:center;gap:9px;margin:6px auto 2px;border:0;border-radius:12px;padding:13px 22px;font-weight:850;font-size:15.5px;cursor:pointer;background:linear-gradient(135deg,var(--gold),#065F46);color:#ffffff;box-shadow:0 8px 22px rgba(16,185,129,.22);transition:.15s}
.hero-finder:hover{transform:translateY(-1px);box-shadow:0 10px 28px rgba(16,185,129,.32)}.hero-finder .hf-em{font-size:18px;line-height:1}
.navlinks .finder{background:rgba(16,185,129,.14);color:#065F46}.navlinks .finder:hover{background:rgba(16,185,129,.24);color:#065F46}
/* Flagship Find My Vehicle */
.flagship{max-width:680px;margin:22px auto 10px;background:linear-gradient(160deg,#241a17,#1a1210);border:1.5px solid #4a3a2a;border-radius:18px;padding:20px 20px 18px;box-shadow:0 16px 44px rgba(0,0,0,.5),0 0 0 1px rgba(16,185,129,.06);position:relative;text-align:left}
.ff-badge{display:inline-block;font-size:11px;font-weight:850;letter-spacing:.04em;text-transform:uppercase;color:#ffffff;background:linear-gradient(135deg,var(--gold),#065F46);border-radius:999px;padding:4px 11px;margin-bottom:10px}
.ff-title{margin:0;font-size:26px;font-weight:900;color:var(--ink);line-height:1.1}
.ff-sub{margin:6px 0 14px;font-size:14.5px;color:var(--muted);line-height:1.45}
.ff-inputrow{display:flex;gap:9px;background:var(--bg);border:1.5px solid #5a4630;border-radius:13px;padding:7px;box-shadow:inset 0 1px 6px rgba(0,0,0,.4)}
.ff-input{flex:1;border:0;background:transparent;color:var(--ink);font-size:16px;padding:13px 14px;outline:none;min-width:0}
.ff-go{border:0;background:linear-gradient(135deg,var(--gold),#065F46);color:#ffffff;font-weight:900;font-size:15.5px;padding:0 20px;border-radius:10px;cursor:pointer;white-space:nowrap;display:flex;align-items:center;gap:6px;animation:ffpulse 2.6s ease-in-out infinite}
.ff-go:hover{filter:brightness(1.06)}.ff-go .ff-arr{font-size:18px}
@keyframes ffpulse{0%,100%{box-shadow:0 0 0 0 rgba(16,185,129,0)}50%{box-shadow:0 0 0 6px rgba(16,185,129,.14)}}
.ff-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:12px}
.ff-chip{border:1px solid var(--line);background:var(--panel);color:var(--ink);font-size:13px;font-weight:600;border-radius:999px;padding:7px 13px;cursor:pointer;transition:.12s;text-align:left}
.ff-chip:hover{border-color:var(--gold);background:rgba(16,185,129,.1);color:#fff}
.hero-search2{max-width:680px;margin:8px auto 4px;text-align:center}
.hero-search2 .hs2-lbl{display:block;font-size:12px;color:var(--muted);margin-bottom:6px}
.hero-search2 .hero-search{max-width:560px;margin:0 auto;padding:5px}
.hero-search2 .hero-q{font-size:14.5px;padding:9px 12px}
.hero-search2 .hero-go{padding:0 16px;font-size:14px;background:var(--panel2);color:var(--ink);border:1px solid var(--line)}
.navlinks .finder.ff-nav{background:linear-gradient(135deg,var(--gold),#065F46);color:#ffffff;font-weight:850;box-shadow:0 4px 14px rgba(16,185,129,.2)}
.navlinks .finder.ff-nav:hover{filter:brightness(1.06)}
@media(prefers-reduced-motion:reduce){.ff-go{animation:none}}
@media(max-width:640px){.flagship{padding:16px 14px;margin:16px auto 8px}.ff-title{font-size:22px}.ff-inputrow{flex-wrap:wrap}.ff-go{flex:1 1 100%;justify-content:center;padding:12px}.ff-chip{font-size:12px;padding:6px 11px}}
.actionbar button.finder2{border-color:rgba(16,185,129,.45);background:rgba(16,185,129,.1);color:var(--gold)}.actionbar button.finder2:hover{background:rgba(16,185,129,.2);color:#065F46}
.fin-fab{display:none;position:fixed;left:50%;transform:translateX(-50%);bottom:16px;z-index:66;border:0;border-radius:999px;padding:12px 20px;font-weight:850;font-size:14px;cursor:pointer;background:linear-gradient(135deg,var(--gold),#065F46);color:#ffffff;box-shadow:0 10px 26px rgba(0,0,0,.5)}
.fin-fab .hf-em{font-size:16px}
@media(max-width:980px){.fin-fab.show{display:inline-flex;align-items:center;gap:7px}body.fin-trayopen .fin-fab.show,body.hero-inview .fin-fab.show{display:none}}
/* seller offer engine */
.actionbar button.seller2{border-color:rgba(58,214,168,.45);background:rgba(58,214,168,.10);color:#047857}.actionbar button.seller2:hover{background:rgba(58,214,168,.2);color:#065F46}
.sell-est{border:1px solid var(--line);border-radius:10px;background:var(--panel);padding:6px 12px;margin:9px 0}
.sell-band{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:8px 0;border-bottom:1px dashed var(--line);font-size:13px}
.sell-band:last-child{border-bottom:0}.sell-band span{color:#4B5563}.sell-band b{color:var(--gold);font-weight:900;white-space:nowrap}
.sell-band.floor b{color:var(--green)}.sell-band.floor span{color:#047857}
/* ===== Sponsored dealer carousel (native billboard) ===== */
.ad-zone{margin:10px 0 4px}
.ad-bb{position:relative;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:linear-gradient(120deg,var(--panel),var(--panel2) 60%,var(--panel));box-shadow:0 8px 24px rgba(0,0,0,.30)}
.ad-bb::before{content:"";position:absolute;inset:0;background:radial-gradient(420px 130px at 11% 0,rgba(16,185,129,.08),transparent 72%);pointer-events:none;z-index:1}
.ad-rail{display:flex;transition:transform .45s cubic-bezier(.4,0,.2,1);will-change:transform}
.ad-slide{flex:0 0 100%;min-width:100%;display:grid;grid-template-areas:"lead mid media";grid-template-columns:minmax(158px,0.9fr) minmax(0,1.6fr) 208px;align-items:stretch;height:148px}
.ad-lead{grid-area:lead;position:relative;z-index:2;padding:13px 16px;display:flex;flex-direction:column;justify-content:center;gap:7px}
.ad-tag{align-self:flex-start;font-size:10.5px;font-weight:850;letter-spacing:.4px;border-radius:999px;padding:3px 10px;background:linear-gradient(135deg,var(--gold),#065F46);color:#ffffff;box-shadow:0 3px 10px rgba(0,0,0,.3)}
.ad-idrow{display:flex;align-items:center;gap:9px}
.ad-avatar{width:42px;height:42px;border-radius:9px;object-fit:cover;object-position:center;border:1px solid var(--line);flex:0 0 42px;background:#0c0f15}
.ad-spon{font-size:17px;font-weight:900;line-height:1.15;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ad-trust{font-size:10.5px;font-weight:850;border-radius:6px;padding:2px 7px;background:rgba(16,185,129,.12);color:#065F46;border:1px solid #A7F3D0;white-space:nowrap;font-family:inherit;cursor:pointer;line-height:1.4;transition:background .12s,border-color .12s}
.ad-trust:hover,.ad-trust:focus-visible{background:rgba(16,185,129,.24);border-color:var(--gold);outline:none}
.ad-mid{grid-area:mid;position:relative;z-index:2;padding:13px 10px;display:flex;flex-direction:column;justify-content:center;gap:8px;min-width:0}
.ad-sub{color:#4B5563;font-size:13px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ad-cta{display:flex;gap:7px;flex-wrap:wrap;align-items:center}
.ad-cta button{font-size:12.5px;font-weight:800;border-radius:9px;padding:8px 13px;border:1.5px solid var(--line);background:var(--panel2);color:var(--ink);cursor:pointer;transition:.15s}
.ad-cta button.primary{background:linear-gradient(135deg,var(--accent),#065F46);border-color:transparent;color:#fff}
.ad-cta button:hover{transform:translateY(-1px);border-color:var(--accent)}
.ad-src{font-size:10.5px;color:var(--muted);text-decoration:none}.ad-src:hover{color:var(--gold)}
.ad-media{grid-area:media;position:relative;background:#0c0f15;overflow:hidden}
.ad-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 42%;display:block}
.ad-media.contain img{object-fit:contain;object-position:center;padding:10px}
.ad-noimg{width:100%;height:100%;display:grid;place-items:center;color:#9CA3AF;font-weight:800;font-size:13px;text-align:center;padding:8px;background:repeating-linear-gradient(45deg,#0c0f15,#0c0f15 10px,#12100f 10px,#12100f 20px)}
.ad-nav{position:absolute;top:50%;transform:translateY(-50%);width:30px;height:30px;border-radius:50%;border:1px solid var(--line);background:rgba(13,9,8,.72);color:#fff;font-size:17px;line-height:1;cursor:pointer;z-index:3;display:grid;place-items:center;backdrop-filter:blur(4px)}
.ad-nav:hover{border-color:var(--accent);background:rgba(13,9,8,.92)}
.ad-nav.prev{left:7px}.ad-nav.next{right:7px}
.ad-bb:not(.ad-single) .ad-lead{padding-left:50px}
.ad-dots{position:absolute;bottom:7px;left:50%;transform:translateX(-50%);display:flex;gap:5px;z-index:3}
.ad-dots button{width:6px;height:6px;border-radius:50%;border:0;background:rgba(255,255,255,.42);cursor:pointer;padding:0;transition:.2s}
.ad-dots button.on{background:var(--gold);width:16px;border-radius:4px}
.ad-bb.ad-single .ad-nav,.ad-bb.ad-single .ad-dots{display:none}
.adshow.rich{display:grid;gap:10px;margin:10px 0 0}
.adshow.rich .ash{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0}
.adshow.rich .ash h3{margin:0;font-size:15px;color:var(--ink)}
.adshow.rich .room.more{margin-left:auto;color:var(--gold);border-color:#C8EEDD;background:#ECFDF5;font-weight:700}
.ad-partner-lane{display:grid;gap:8px;margin-top:6px;padding-top:12px;border-top:1px solid var(--line)}
.ad-partner-lane .ad-bb{border-color:#A7F3D0;box-shadow:0 6px 18px rgba(4,120,87,.10)}
.ad-bb{touch-action:pan-y}
@media(max-width:640px){
  .ad-slide{grid-template-areas:"media lead" "media mid";grid-template-columns:104px 1fr;grid-template-rows:auto auto;height:auto;min-height:104px;align-items:stretch}
  .ad-lead,.ad-bb:not(.ad-single) .ad-lead{padding:10px 12px 1px;gap:4px}.ad-mid{padding:1px 12px 10px;gap:6px}
  .ad-spon{font-size:15px}.ad-sub{font-size:12.5px;-webkit-line-clamp:2}.ad-avatar{width:32px;height:32px;border-radius:7px;flex:0 0 32px}
  .ad-media{min-height:96px}.ad-nav{display:none}
  .ad-cta button{padding:7px 11px;font-size:12px}
  .ad-cta button:not(.primary){display:none}
  .ad-src{font-size:10px}
  .adshow.rich .ash{align-items:flex-start}.adshow.rich .ash h3{font-size:14px;line-height:1.35;flex:1 1 190px}
  .adshow.rich .room.more{margin-left:0;max-width:100%;white-space:normal}
}
@media(prefers-reduced-motion:reduce){.ad-rail{transition:none}}
.card .media img{transition:opacity .18s ease}
.hp-dots{position:absolute;left:0;right:0;bottom:7px;display:flex;gap:4px;justify-content:center;pointer-events:none;z-index:2}
.hp-dots span{width:5px;height:5px;border-radius:50%;background:rgba(255,255,255,.55);box-shadow:0 0 2px rgba(0,0,0,.55)}
.hp-dots span.on{background:#fff}
@media (hover:none),(pointer:coarse){.hp-dots{display:none}}
@media (prefers-reduced-motion:reduce){.card .media img{transition:none}}
/* OD-024 card photo carousel */
.media[data-car]{touch-action:pan-y}
.media[data-car] img{-webkit-user-drag:none;user-select:none}
.ctrack{display:flex;height:100%;will-change:transform;transition:transform .28s cubic-bezier(.22,.61,.36,1)}
.ctrack.noanim{transition:none}
.ctrack img{flex:0 0 100%;width:100%;height:100%;object-fit:cover;background:#F3F4F6;pointer-events:none;user-select:none;-webkit-user-drag:none}
.cnav{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:30px;height:30px;border-radius:50%;border:0;background:rgba(0,0,0,.5);color:#fff;font-size:20px;line-height:1;cursor:pointer;display:grid;place-items:center;padding:0 0 2px;opacity:0;transition:opacity .15s}
.cprev{left:8px}.cnext{right:8px}
.card .media:hover .cnav,.cnav:focus-visible{opacity:1}
.cnav:hover{background:#047857}
@media (hover:none),(pointer:coarse){.cnav{opacity:.8;width:34px;height:34px;font-size:22px}}
.cpos{position:absolute;bottom:8px;right:8px;background:rgba(0,0,0,.7);color:#fff;font-size:11px;border-radius:6px;padding:3px 7px;z-index:2;font-weight:700}
.cdots{position:absolute;left:0;right:0;bottom:7px;display:flex;gap:4px;justify-content:center;pointer-events:none;z-index:2}
.cdots span{width:5px;height:5px;border-radius:50%;background:rgba(255,255,255,.55);box-shadow:0 0 2px rgba(0,0,0,.55)}
.cdots span.on{background:#fff}
@media (prefers-reduced-motion:reduce){.ctrack{transition:none}}
/* ============================================================================================
   OD-025 — Option 1 "Trắng sạch" production layer (Rio-approved 2026-07-30).
   Light marketplace look: white surfaces, hairline #E5E7EB borders, graphite ink, emerald accent.
   This layer OVERRIDES the legacy rules above (which already re-themed via the new :root palette);
   engine hooks, IDs and the OD-024 carousel affordances are untouched.
   ============================================================================================ */
body{font-size:15px;line-height:1.5}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}
/* ---- header ---- */
.topbar{background:#fff;border-bottom:1px solid var(--line);box-shadow:none;position:sticky;top:0;z-index:60}
.top-inner{max-width:1200px;margin:0 auto;display:flex;align-items:center;gap:16px;padding:10px 24px}
.logo.brandmark{background:none;border:0;padding:0;cursor:pointer;display:inline-flex;align-items:center}
.logo.brandmark svg{height:34px;width:auto;display:block}
.hd-tag{font-size:12px;color:var(--muted)}
.navlinks button,.navlinks a{font-size:13.5px;font-weight:500;color:#3C434B;background:none;border:0;padding:8px 10px;border-radius:8px;cursor:pointer;font-family:inherit}
.navlinks button:hover,.navlinks a:hover{background:var(--panel2);color:var(--ink)}
.navlinks .post{background:var(--accent);color:#fff;font-weight:600;padding:9px 16px;border-radius:9px}
.navlinks .post:hover{background:#065F46;color:#fff}
.navlinks .hdr-more{display:none!important} /* !important: the Gian Hàng anchor carries an inline display */
.topbar.menu-open .navlinks .hdr-more{display:flex!important}
.lang{font-size:12px;border:1px solid var(--line);border-radius:7px;padding:2px 4px;background:#fff}
.lang button{color:var(--muted)}.lang button.active{color:#fff;font-weight:700}
/* ---- hero ---- */
.hero{background:#fff;border-bottom:0;padding:0}
.hero-inner2{max-width:1200px;margin:0 auto;padding:34px 24px 6px;text-align:center}
.hero-h1{font-size:30px;font-weight:800;letter-spacing:-.015em;color:var(--ink);margin:0}
.hero-sub{color:var(--muted);font-size:14.5px;margin:6px auto 0;max-width:640px}
.hero-search2{max-width:640px;margin:20px auto 0;padding:0}
.hero-search{display:flex;background:#fff;border:1.5px solid #D6D9DE;border-radius:14px;padding:6px;box-shadow:0 2px 10px rgba(31,41,51,.05)}
.hero-search:focus-within{border-color:var(--accent)}
.hero-q{flex:1;border:none;background:none;font:inherit;font-size:15px;padding:10px 14px;color:var(--ink);min-width:0;outline:none}
.hero-q::placeholder{color:#4B5563}
.hero-search .hero-go,.hero-search2 .hero-go,#heroGo{background:var(--accent);color:#fff;border:0;font-weight:700;font-size:14.5px;padding:10px 26px;border-radius:9px;cursor:pointer;box-shadow:none}
.hero-search .hero-go:hover,#heroGo:hover{background:#065F46}
.hero-quick{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:14px auto 0}
.hero-quick button{font-size:13px;font-weight:500;color:#3C434B;background:#fff;border:1px solid var(--line);border-radius:999px;padding:7px 15px;cursor:pointer;font-family:inherit}
.hero-quick button:hover{border-color:var(--accent);color:var(--gold)}
.hero-note{color:var(--muted);font-size:12px;max-width:640px}
/* Flagship Find-My-Vehicle hero panel (always visible, top of homepage — owner order 2026-07-31) */
.ai-flagship{max-width:760px;margin:20px auto 0;background:linear-gradient(165deg,#ECFDF5,#FFFFFF 70%);border:1.5px solid #A7F3D0;border-radius:16px;padding:18px 20px 16px;text-align:left;box-shadow:0 12px 34px rgba(4,120,87,.10)}
.ai-flagship .ff-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:10px;margin-bottom:11px}
.ai-flagship .ff-k{font-size:17px;font-weight:800;color:#065F46;letter-spacing:-.01em}
.ai-flagship .ff-sub2{font-size:13px;color:#374151}
.ai-flagship .ff-input{font-size:16.5px;padding:15px 16px;min-height:54px;border:1px solid #A7F3D0}
.ai-flagship .ff-go{font-size:15.5px;font-weight:800;padding:0 26px;min-height:54px}
.ai-flagship .ff-chips{margin-top:11px}
.ff-inputrow{display:flex;gap:8px;margin:0}
.ff-input{flex:1;border:1px solid #C8EEDD;background:#fff;border-radius:9px;padding:10px 13px;font:inherit;font-size:14px;min-width:0;color:var(--ink);box-shadow:none}
.ff-go{background:var(--accent);color:#fff;border:0;font-weight:600;border-radius:9px;padding:10px 18px;box-shadow:none;animation:none;font-size:14px}
.ff-go:hover{background:#065F46}
#ffMic{width:auto!important;margin-top:0!important;flex:0 0 auto;border:1px solid #C8EEDD!important;background:#fff!important;border-radius:9px!important;padding:10px 12px!important;color:var(--ink)!important;font-size:13px!important;cursor:pointer}
.ff-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}
.ff-chip{font-size:12px;color:var(--gold);background:#fff;border:1px solid #C8EEDD;border-radius:999px;padding:5px 11px;box-shadow:none}
.ff-chip:hover{border-color:var(--accent);background:#ECFDF5;color:var(--gold)}
/* ---- main scaffolding ---- */
.wrap{max-width:1200px;margin:0 auto;padding:10px 24px 8px}
.stats{margin:8px 0 0}
.stat-line{font-size:12.5px;color:var(--muted);margin:0;text-align:left}
.stat-line b{color:var(--ink);font-weight:600}
.navwrap{margin-top:14px}
.nav-h{display:none}
.tabs{display:flex;flex-wrap:wrap;gap:8px;border:0;background:none;padding:0}
.tabs button{font-size:13px;font-weight:500;color:#3C434B;background:#fff;border:1px solid var(--line);border-radius:999px;padding:7px 15px;cursor:pointer;font-family:inherit}
.tabs button:hover{border-color:#C9CDD2}
.tabs button.active{color:var(--gold);border-color:#C8EEDD;background:#ECFDF5;font-weight:600}
.tabs .tsep{display:none}
.vstat{font-size:12.5px;color:var(--muted)}
.searchbar{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0 0}
.search-input{background:#fff;border:1px solid var(--line);color:var(--ink);border-radius:9px;padding:9px 12px;font:inherit;font-size:13.5px}
.search-input:focus{border-color:var(--accent);outline:none}
.ghost{background:#fff;border:1px solid var(--line);color:#3C434B;border-radius:9px;padding:9px 12px;font-size:13px;cursor:pointer;font-family:inherit}
.ghost:hover{border-color:#C9CDD2}
.chips .chip{background:#fff;border:1px solid var(--line);color:var(--ink)}
.chips .chip:hover{border-color:var(--accent);color:var(--gold)}
.presets{display:flex;flex-wrap:wrap;gap:7px;align-items:center}
.presets button{background:#fff;border:1px solid var(--line);color:#3C434B;border-radius:999px;padding:6px 12px;font-size:12.5px}
.presets button:hover{border-color:var(--accent);color:var(--gold)}
.preset-lbl{color:var(--muted);font-size:12px}
button.filter-toggle,#filterToggle{display:inline-flex;width:auto;align-items:center;gap:6px;background:#ECFDF5;border:1px solid #C8EEDD;color:var(--gold);font-weight:600;border-radius:9px;padding:8px 13px;font-size:13px;margin:10px 0 0;cursor:pointer}
.toolbar .count{font-size:12.5px;color:var(--muted)}
.toolbar .count b{color:var(--ink)}
/* ---- cards (Option-1) ---- */
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.card{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;display:flex;flex-direction:column;transition:box-shadow .15s,transform .15s;box-shadow:none;cursor:pointer}
.card:hover{box-shadow:0 8px 22px rgba(31,41,51,.09);transform:translateY(-2px);border-color:var(--line)}
.card .media{aspect-ratio:4/3;background:#EDEFF2}
.card .media .sb{background:rgba(255,255,255,.94);color:#3C434B;font-weight:600;border-radius:6px}
.card .media .vb{background:rgba(255,255,255,.94);color:#3C434B;border-radius:6px;top:8px;right:46px;left:auto;bottom:auto}
.card .media .nu{background:var(--accent);color:#fff;border-radius:6px}
.card .media .sv{position:absolute;right:8px;top:8px;width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.94);display:flex;align-items:center;justify-content:center;font-size:14px;color:#3C434B;border:0;cursor:pointer;z-index:3;padding:0}
.card .media .sv:hover{color:#C0392B}
.cbody{padding:11px 13px 13px;display:flex;flex-direction:column;gap:8px;flex:1}
.cbody h3{font-size:14px;font-weight:600;line-height:1.35;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ink)}
.pr{font-size:17px;font-weight:800;letter-spacing:-.01em;color:var(--ink)}
.meta3{display:grid;grid-template-columns:1fr 1fr 1.2fr;border:1px solid var(--line);border-radius:9px;overflow:hidden}
.meta3 span{font-size:11.5px;color:#4A525A;padding:6px 4px;text-align:center;background:#FAFBFC;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.meta3 span+span{border-left:1px solid var(--line)}
.cbody .badges{display:flex;gap:5px;flex-wrap:wrap}
.st{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:6px 8px;margin-top:auto}
.band{font-size:11px;font-weight:600;padding:4px 9px;border-radius:999px;white-space:nowrap}
.band.in{color:var(--gold);background:#ECFDF5}
.band.hi{color:#8A5A00;background:#FCF2DC}
.band.lo{color:#1266A5;background:#E8F1F8}
.band.na{color:#5F6670;background:#EEEFF1}
.st .seller{font-size:11.5px;color:var(--muted)}
.st .card-dealer{margin:0;flex-basis:100%;min-width:0}
.cbody h3 a[data-xe]{color:inherit;text-decoration:none}
a.det{text-decoration:none}
.det{display:block;text-align:center;font-size:13px;font-weight:600;color:var(--gold);border:1px solid #C8EEDD;border-radius:9px;padding:8px;margin-top:2px;background:#fff;cursor:pointer;font-family:inherit}
.det:hover{background:#ECFDF5}
/* ---- sell band / honesty / sponsored-showroom row ---- */
.sellband{margin:34px 0 0}
.sellband .in{background:#fff;border:1px solid var(--line);border-radius:16px;padding:26px 30px;display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.sellband h2{font-size:18px;font-weight:700;margin:0;color:var(--ink)}
.sellband p{font-size:13.5px;color:var(--muted);margin:3px 0 0}
.sellband .acts{margin-left:auto;display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.sellband .a1{background:var(--accent);color:#fff;border:0;font-weight:600;font-size:14px;padding:11px 20px;border-radius:10px;cursor:pointer;font-family:inherit}
.sellband .a1:hover{background:#065F46}
.sellband .a2{color:var(--gold);background:#fff;font-weight:600;font-size:14px;padding:11px 20px;border-radius:10px;border:1px solid #C8EEDD;cursor:pointer;font-family:inherit}
.sellband .a2:hover{background:#ECFDF5}
.sellband .a3{color:var(--muted);background:none;border:0;font-size:13px;font-weight:600;cursor:pointer;font-family:inherit}
.sellband .a3:hover{color:var(--gold)}
.honest{margin:30px 0 0;display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.honest div{font-size:12.5px;color:#4A525A;line-height:1.55;padding:14px 16px;background:#F5F6F7;border-radius:12px}
.honest b{display:block;color:var(--ink);font-size:12.5px;margin-bottom:3px}
.ad-zone{margin:28px 0 0}
.rooms h3{font-size:13px;font-weight:600;color:var(--muted);margin:0 0 10px;display:flex;align-items:center;gap:8px}
.ad-tag2{font-size:10px;font-weight:700;color:var(--muted);border:1px solid var(--line);border-radius:5px;padding:1px 6px;letter-spacing:.03em}
.rooms .row{display:flex;flex-wrap:wrap;gap:8px}
.rooms .adshow{border:1px solid var(--line);border-radius:14px;background:#fff;padding:14px 16px;margin:10px 0}.adshow .ash{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:8px}.adshow h3{margin:0;font-size:14.5px}.adshow .slide{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;min-height:52px}.adshow .bn{font-size:21px;font-weight:850;letter-spacing:-.01em}.adshow .dn{font-size:12.5px;color:#6b7280;margin-top:2px}.adshow .dots{display:flex;gap:5px;margin-top:10px}.adshow .dots i{width:7px;height:7px;border-radius:999px;background:#e5e7eb;cursor:pointer}.adshow .dots i.on{background:#047857}.adshow .gocta{white-space:nowrap}.room{font-size:12.5px;color:#3C434B;background:#fff;border:1px solid var(--line);border-radius:999px;padding:7px 14px;cursor:pointer;font-family:inherit}
.rooms .room small{color:var(--muted);font-size:11px}
.rooms .room:hover{border-color:var(--accent);color:var(--gold)}
.rooms .room.more{color:var(--gold);border-color:#C8EEDD;background:#ECFDF5;font-weight:600}
/* ---- footer ---- */
.site-footer{margin-top:44px;background:#fff;border-top:1px solid var(--line)}
.foot-inner{max-width:1200px;margin:0 auto;padding:30px 24px;display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:26px}
@media(max-width:980px){.foot-inner{grid-template-columns:1fr 1fr}}
.foot-logo svg{height:30px;width:auto}
.foot-tag,.foot-op{color:var(--muted);font-size:12.5px;line-height:1.7}
.foot-em a{color:var(--gold);font-weight:600}
.foot-links{display:flex;flex-direction:column;align-items:flex-start;gap:0}
.foot-h{font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin:0 0 8px;display:block}
.foot-links button,.foot-links a{display:block;font-size:13px;color:#4A525A;padding:3px 0;background:none;border:0;cursor:pointer;font-family:inherit;text-align:left;text-decoration:none}
.foot-links button:hover,.foot-links a:hover{color:var(--gold)}
.foot-disc{grid-column:1/-1;border-top:1px solid var(--line);padding-top:14px;font-size:11.5px;color:#4B5563;line-height:1.6}
.footer-note{color:#4B5563;font-size:11.5px}
/* ---- modals & shared surfaces on light ---- */
.modal-panel{box-shadow:0 24px 64px rgba(31,41,51,.18);border:1px solid var(--line)}
.bd{background:#F5F6F7;color:#4A525A;border:1px solid var(--line);border-radius:6px}
.bd.good{background:#ECFDF5;color:var(--gold);border-color:#C8EEDD}
.bd.warn{background:#FCF2DC;color:#8A5A00;border-color:#F3E3BD}
/* ---- desktop filters: collapsed by default (Option-1 hierarchy); the ⚙ toggle opens the FULL sidebar ---- */
@media (min-width:901px){
  .filter-toggle{display:inline-flex}
  .layout{display:block}
  .layout aside.filters{display:none}
  .layout:has(aside.filters.open){display:grid;grid-template-columns:280px 1fr;gap:16px}
  aside.filters.open{display:block}
}
/* ---- mobile (Option-1 dense 2-col) ---- */
@media (max-width:900px){
  .top-inner{padding:9px 14px;gap:10px}
  .hd-tag{display:none}
  .hero-inner2{padding:22px 16px 6px}
  .hero-h1{font-size:22px}
  .hero-sub{font-size:13px}
  .ai-flagship{padding:14px 13px 12px;margin-top:14px;border-radius:14px}
  .ai-flagship .ff-k{font-size:15.5px}
  .ai-flagship .ff-input{font-size:16px;min-height:50px;padding:13px 13px}
  .ai-flagship .ff-go{min-height:50px;padding:0 18px}
  .wrap{padding:10px 16px 8px}
  .grid{grid-template-columns:1fr 1fr;gap:10px}
  .cbody{padding:9px 10px 11px;gap:7px}
  .cbody h3{font-size:12.5px}
  .pr{font-size:15px}
  .meta3 span{font-size:10.5px;padding:5px 2px}
  .st .seller{display:none}
  .det{font-size:12px;padding:7px}
  .sellband .in{padding:20px;flex-direction:column;align-items:flex-start}
  .sellband .acts{margin-left:0}
  .honest{grid-template-columns:1fr;gap:8px}
  .foot-inner{grid-template-columns:1fr;gap:20px}
  .topbar.menu-open .navlinks .hdr-more{display:block}
}
/* BATCH A (2026-08-02): DEF-002 CLS reserves — async-filled blocks get reserved space so the page
   does not shift when stats/chips/continue-chip arrive. DEF-006 touch targets >=44px. */
.stats{min-height:74px}
.hero-quick{min-height:46px}
#ffChips{min-height:78px}
.ai-flagship{min-height:200px}
@media(max-width:640px){.stats{min-height:142px}.ai-flagship{min-height:252px}#ffChips{min-height:114px}}
.lang button{min-height:44px;min-width:44px;padding:10px 13px}
.hero-quick button{min-height:44px;padding:10px 16px}
#xmToast{position:fixed;left:50%;bottom:86px;transform:translateX(-50%) translateY(8px);background:#111827;color:#fff;padding:10px 16px;border-radius:999px;font-size:13px;font-weight:600;opacity:0;pointer-events:none;transition:.18s;z-index:1340;max-width:90vw}
#xmToast.show{opacity:1;transform:translateX(-50%)}
.chip-wrap{display:inline-flex;align-items:center;gap:3px}
.chip-x{border:1px solid var(--line);background:var(--panel);color:#B91C1C;border-radius:999px;min-width:36px;min-height:36px;line-height:1;cursor:pointer;font-size:13px;font-weight:700;padding:0}
.modal-panel:focus{outline:none}
/* --- Giá Thật Price Intelligence --- */
/* Giá Thật Price Intelligence card — scoped .pi- styles, mobile-first, light theme to match the detail sheet. */
.pi-card{border:1px solid #e5e7eb;border-radius:14px;background:#fff;padding:12px 12px 14px;margin:2px 0 4px;box-shadow:0 1px 2px rgba(15,23,42,.04)}
.pi-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 10px}
.pi-badge{font-weight:800;font-size:14px;color:#0f172a;letter-spacing:.1px}
.pi-sub{font-size:11px;font-weight:700;color:#64748b;background:#f1f5f9;border-radius:999px;padding:3px 8px;white-space:nowrap}
.pi-tabs{display:flex;gap:4px;background:#f1f5f9;border-radius:10px;padding:3px;margin:0 0 12px}
.pi-tab{flex:1;border:0;background:transparent;color:#475569;font-weight:700;font-size:13px;padding:7px 6px;border-radius:8px;cursor:pointer;line-height:1.2;transition:background .12s,color .12s}
.pi-tab.on{background:#fff;color:#0f172a;box-shadow:0 1px 2px rgba(15,23,42,.08)}
.pi-panel{display:none}
.pi-panel.on{display:block}
.pi-chart{width:100%;height:auto;display:block;color:#94a3b8;margin:2px 0 10px;overflow:visible}
.pi-ax{font-size:12px;font-weight:600;fill:#94a3b8}
.pi-ax-d{display:none}
.pi-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:6px 0;border-top:1px solid #f1f5f9;font-size:13px;color:#475569}
.pi-row:first-child{border-top:0}
.pi-row b{font-size:14px;font-weight:800;color:#0f172a;white-space:nowrap}
.pi-chg{margin:8px 0 4px;font-weight:800;font-size:13.5px}
.pi-up{color:#dc2626}
.pi-down{color:#059669}
.pi-flat{color:#64748b}
.pi-note{font-size:11.5px;line-height:1.5;color:#94a3b8;margin:8px 0 0}
.pi-accum{margin:0}
.pi-empty{text-align:center;padding:14px 8px;color:#64748b;font-size:13.5px}
.pi-empty b{display:block;color:#0f172a;font-size:15px;margin-bottom:2px}
.pi-empty-sub{font-weight:700;color:#334155;margin:2px 0}
.pi-pos{font-size:14px;color:#334155;margin:0 0 12px;line-height:1.4}
.pi-pos b{font-weight:800}
.pi-below b{color:#059669}
.pi-above b{color:#dc2626}
.pi-around b{color:#2563eb}
.pi-bar{position:relative;height:26px;margin:4px 0 14px}
.pi-bar-track{position:absolute;top:11px;left:0;right:0;height:4px;border-radius:4px;background:#e2e8f0}
.pi-bar-iqr{position:absolute;top:9px;height:8px;border-radius:6px;background:#bfdbfe}
.pi-bar-med{position:absolute;top:5px;width:3px;height:16px;border-radius:2px;background:#2563eb;transform:translateX(-1px)}
.pi-bar-subj{position:absolute;top:1px;width:12px;height:12px;border-radius:50%;background:#0a7c5a;border:2px solid #fff;box-shadow:0 0 0 1px #0a7c5a;transform:translateX(-6px)}
.pi-seg{margin:14px 0 0;padding:12px 0 0;border-top:1px solid #eef2f7}
.pi-seg h4{margin:0 0 6px;font-size:13.5px;font-weight:800;color:#0f172a}
.pi-snaps{display:flex;flex-wrap:wrap;gap:5px;margin:8px 0 2px}
.pi-snap{font-size:11px;color:#475569;background:#f8fafc;border:1px solid #eef2f7;border-radius:7px;padding:3px 7px;white-space:nowrap}
.pi-snap b{font-weight:700;color:#0f172a}
.pi-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:2px 0 4px}
.pi-stat{background:#f8fafc;border:1px solid #eef2f7;border-radius:10px;padding:10px 8px;text-align:center}
.pi-stat-v{font-size:18px;font-weight:800;color:#0f172a;line-height:1.1}
.pi-stat-l{font-size:11px;font-weight:600;color:#64748b;margin-top:3px}
.pi-loading{min-height:80px}
.pi-skel{height:14px;border-radius:6px;background:linear-gradient(90deg,#f1f5f9,#e9eef5,#f1f5f9);background-size:200% 100%;animation:piSk 1.1s linear infinite;margin:8px 0}
.pi-skel:first-child{width:60%}
@keyframes piSk{0%{background-position:200% 0}100%{background-position:-200% 0}}
@media(max-width:420px){.pi-tab{font-size:12px;padding:7px 3px}.pi-badge{font-size:13px}.pi-stat-v{font-size:16px}}

/* ===== VSEARCH (Visual Search MVP, staged 2026-08-19) ===== */
.vs-open-btn{border:1px solid var(--line,#d8dee4);background:#fff;border-radius:12px;padding:9px 13px;font-weight:700;cursor:pointer;font-size:14px}
.ff-inputrow .vs-open-btn{flex:0 0 auto;white-space:nowrap}
@media(max-width:640px){.ff-inputrow .vs-open-btn{flex:1 1 100%;margin-top:2px}}
@media(min-width:641px){.ff-inputrow .ff-input{min-width:200px}}
/* Owner feedback round 1 (2026-08-26): voice + photo were mismatched/stacked on mobile - #ffMic's
   base rule (bare id selector, unconditional !important) and .vs-open-btn's own 640px rule
   disagreed on width, so one sat full-width alone while the other floated auto-width. Forced both
   into one 50/50 row with matched height/padding/radius, centered icon+text; falls back to
   stacked only below ~380px. Higher specificity + !important + later source order than both prior
   rules, so this wins outright rather than fighting the cascade.
   Round 2 (Codex found 390px still stacking): the round-1 rule relied on flex-basis alone with
   white-space:nowrap - flex items don't shrink below their CONTENT's min-width by default, so at
   390px the two labels' one-line width left only ~2px of slack before the row's own flex-wrap
   (line ~450) kicked in and dropped the second button to a new line. A 2px margin is not robust -
   any small font-metric difference between rendering environments could tip it over, which is
   almost certainly why this measured fine in one environment and failed in another. Fixed at the
   root instead of trimming the margin further: min-width:0 removes the content-based floor, and an
   explicit width (not just flex-basis) makes the 50/50 split deterministic rather than
   negotiated. white-space is intentionally left to wrap (not nowrap) as the real safety net - if a
   label is ever too wide for its half at any width/font/locale, it wraps to a second line instead
   of breaking the row; the flex row's default align-items:stretch (unchanged, not overridden here)
   still keeps both buttons the same height either way, one line or two. */
@media(max-width:640px){
  .ff-inputrow #ffMic,.ff-inputrow .vs-open-btn{
    flex:1 1 calc(50% - 4px)!important;width:calc(50% - 4px)!important;min-width:0!important;
    max-width:calc(50% - 4px)!important;margin-top:8px!important;min-height:44px;box-sizing:border-box;
    padding:10px 8px!important;border-radius:10px!important;font-size:14px!important;line-height:1.25;
    display:flex!important;align-items:center;justify-content:center;gap:6px;text-align:center;
    white-space:normal!important;
  }
}
@media(max-width:380px){
  .ff-inputrow #ffMic,.ff-inputrow .vs-open-btn{flex:1 1 100%!important;width:100%!important;max-width:100%!important;margin-top:6px!important}
}
#vsModal{display:none;position:fixed;inset:0;z-index:1400;background:rgba(17,24,39,.55)}
#vsModal.open{display:block}
.vs-sheet{position:absolute;left:0;right:0;bottom:0;max-height:92vh;overflow:auto;background:#fff;border-radius:18px 18px 0 0;padding:16px 16px 28px}
.vs-h{font-size:18px;font-weight:800;margin:0 0 2px}
.vs-sub{color:#556;font-size:13.5px;margin:0 0 12px}
.vs-x{position:absolute;top:10px;right:12px;border:0;background:#f1f3f5;border-radius:10px;padding:6px 11px;font-size:15px;cursor:pointer;min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent}
.vs-inrow{display:flex;gap:10px;margin:10px 0}
.vs-inbtn{flex:1;border:1.5px dashed #059669;background:#f2fbf7;border-radius:14px;padding:18px 10px;text-align:center;font-weight:700;color:#047857;cursor:pointer;font-size:14px}
.vs-note{font-size:11.5px;color:#8a94a0;margin-top:8px}
.vs-linkrow{display:flex;gap:8px;margin-top:12px}
.vs-linkrow input{flex:1;border:1px solid #d8dee4;border-radius:10px;padding:9px 10px;font-size:13px}
.vs-linkrow button{border:0;background:#eef1f4;border-radius:10px;padding:9px 12px;font-weight:700;cursor:pointer}
.vs-prev{width:100%;max-height:220px;object-fit:contain;border-radius:12px;background:#f4f6f8;margin:8px 0}
.vs-idcard{border:1px solid #cde9dd;background:#f6fcf9;border-radius:14px;padding:12px;margin:10px 0}
.vs-idname{font-size:19px;font-weight:800;margin:2px 0}
.vs-conf{display:inline-block;background:#059669;color:#fff;border-radius:999px;padding:2px 10px;font-size:12px;font-weight:700}
.vs-conf.lo{background:#b45309}
.vs-band{border-top:1px dashed #cbd5df;margin-top:10px;padding-top:10px}
.vs-band b{font-size:16px}
.vs-bandlbl{font-size:11px;letter-spacing:1px;color:#64707c;font-weight:800}
.vs-ctas{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.vs-cta{border:0;border-radius:11px;padding:10px 13px;font-weight:700;cursor:pointer;font-size:13.5px}
.vs-cta.pri{background:#059669;color:#fff}
.vs-cta.sec{background:#eef1f4}
.vs-cands button{display:block;width:100%;text-align:left;border:1px solid #d8dee4;background:#fff;border-radius:11px;padding:10px 12px;margin:6px 0;cursor:pointer;font-size:14px}
.vs-comp{border:1px solid #e3e8ee;border-radius:12px;padding:9px 11px;margin:7px 0;font-size:13px}
.vs-comp b{font-size:14px}
.vs-warn{color:#92400e;font-size:12px;margin-top:4px}
.vs-geo-chips{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0}
.vs-geo-chips button{border:1px solid #d8dee4;background:#fff;border-radius:999px;padding:6px 11px;font-size:12.5px;cursor:pointer}
.vs-geo-chips button.on{background:#059669;color:#fff;border-color:#059669}
.vs-muted{color:#66707a;font-size:12.5px}
.vs-budget{display:flex;gap:8px;margin-top:10px}
.vs-budget input{flex:1;border:1px solid #d8dee4;border-radius:10px;padding:9px;font-size:14px}
.vs-mocktag{font-size:10.5px;color:#98a2ad;margin-top:6px}
/* GT2-D01: multi-photo accumulation confirmation (index.html vsShotsConfHtml()) - filled dots + a
   count so "Thêm ảnh khác" visibly ADDS to the attempt instead of silently replacing the preview. */
.vs-shots-conf{display:flex;align-items:center;gap:7px;margin:8px 0;font-size:12.5px;font-weight:700;color:#047857}
.vs-shot-dot{width:8px;height:8px;border-radius:50%;background:#d8dee4;display:inline-block;flex:0 0 auto}
.vs-shot-dot.on{background:#059669}
@media (min-width:720px){.vs-sheet{max-width:520px;left:auto;right:24px;bottom:24px;border-radius:18px}}

/* OWNER BANNER LAYOUT (2026-08-26): >=1760px = rails both sides; 1250-1759px = right rail only;
   <1250px = one horizontal banner after intents/before listings. Never resizes .wrap's own
   max-width — rails live in the flex track beside it, so the product grid never compresses on the
   wide tier and only reflows its existing auto-fill columns (unchanged CSS) on the narrow tier.
   Reuses ADS/adsFor/adTrust (data layer only); renderRailAd() below is a new slim renderer for
   this narrow shape — the existing rich #adZoneTop carousel/renderAds() is untouched. */
.xm-bannerlayout{display:flex;align-items:flex-start;justify-content:center}
.xm-bannerlayout>.wrap{flex:1 1 auto;min-width:0}
.banner-rail{display:none;flex:0 0 190px;width:190px;position:sticky;top:88px;align-self:flex-start}
@media(min-width:1250px){.banner-rail.bnr-right{display:block}.xm-bannerlayout{gap:18px}}
@media(min-width:1760px){.banner-rail.bnr-left{display:block}.xm-bannerlayout{gap:22px}}
.bnr-card{border:1px solid var(--line,#E5E7EB);border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 6px 18px rgba(0,0,0,.07)}
.bnr-card img{display:block;width:100%;height:auto}
.bnr-tag{font-size:10px;letter-spacing:.04em;text-transform:uppercase;color:#98a2ad;padding:9px 13px 0;margin:0}
.bnr-house{padding:14px 13px 16px;text-align:center;color:var(--muted,#6b7280)}
.bnr-house b{display:block;color:var(--ink);font-size:14px;margin-bottom:6px;line-height:1.3}
.bnr-house p{font-size:12px;line-height:1.5;margin:0 0 11px}
.bnr-house a,.bnr-house button{display:inline-block;background:var(--accent,#047857);color:#fff!important;font-weight:700;font-size:12.5px;padding:8px 16px;border:0;border-radius:9px;text-decoration:none;cursor:pointer;font-family:inherit}
.bnr-mobile{display:block;margin:14px 0 4px}
.bnr-mobile .bnr-card{display:flex;align-items:center;gap:12px;border-radius:14px}
.bnr-mobile .bnr-tag{display:none}
.bnr-mobile .bnr-house{display:flex;align-items:center;gap:12px;padding:13px 15px;text-align:left;flex:1}
.bnr-mobile .bnr-house b{margin:0 0 2px}
.bnr-mobile .bnr-house p{margin:0}
.bnr-mobile .bnr-house a,.bnr-mobile .bnr-house button{flex:0 0 auto;white-space:nowrap}
@media(min-width:1250px){.bnr-mobile{display:none}}

/* GT-FIRSTPARTY-DISCOVERY-001 (2026-08-28) — a listing posted directly on Giá Thật says so on the
   card. It is a statement of WHERE the ad was posted, not a verification, trust or partner claim,
   and it sits in the media overlay. Measured, not guessed: at 390px the card is 174px wide, the
   heart (.sv) holds the top-right corner and the vertical label (.vb) sits 46px in from it, so a
   top-left chip overlapped .vb by 43px - and by 58px at 360px. BOTTOM-left is genuinely free (the
   carousel counter is bottom-RIGHT), so the chip goes there on one line at every width.
   .nu / .vbadge also live bottom-left, so they step aside - but only on a card that HAS this chip,
   because the sibling selector cannot match on an aggregate card. The label WRAPS rather than
   ellipsing: truncating it to "Đăng trên…" would hide the only word that carries the meaning. */
.fpb{position:absolute;bottom:8px;left:8px;z-index:2;max-width:calc(100% - 60px);font-size:10.5px;font-weight:800;line-height:1.3;letter-spacing:.01em;border-radius:6px;padding:3px 8px;background:var(--accent);color:#fff;white-space:normal;overflow-wrap:anywhere;text-align:left}
.fpb~.nu,.fpb~.vbadge{left:auto;right:8px}
@media (max-width:640px){.fpb{font-size:9.5px;padding:2px 6px;max-width:calc(100% - 54px)}}