/* ============================================================
   ידע רכב · Yeda Rechev — Premium White / Chrome Design System
   UI/UX layer only. No logic, selectors, or data fields changed.
   Loaded after the per-page Tailwind config so it cascades last.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Heebo:wght@300;400;500;600;700;800;900&family=Rubik:wght@500;600;700;800&display=swap');

/* ---------- Design tokens ---------- */
:root{
  --yr-bg:            #eef1f6;   /* bright base */
  --yr-bg-2:          #f7f9fc;
  --yr-surface:       #ffffff;   /* solid white panel */
  --yr-glass:         rgba(255,255,255,.78);
  --yr-glass-soft:    rgba(255,255,255,.58);
  --yr-chrome:        #c4ccd6;   /* metallic silver */
  --yr-chrome-light:  #eef1f6;
  --yr-chrome-dark:   #8a94a1;
  --yr-ink:           #0e1218;   /* dark text */
  --yr-ink-2:         #1c2530;
  --yr-muted:         #6b7480;   /* muted text */
  --yr-muted-2:       #94a0ad;
  --yr-border:        #e3e8ef;   /* chrome border */
  --yr-border-strong: #cfd5dd;
  --yr-accent:        #2f6bff;   /* AI blue */
  --yr-accent-2:      #1f57e6;
  --yr-accent-cyan:   #16c8e6;
  --yr-success:       #1f9d57;
  --yr-warning:       #d68a00;
  --yr-risk:          #e23b4e;
  --yr-shadow-sm:     0 6px 18px -12px rgba(20,40,80,.30);
  --yr-shadow:        0 14px 34px -18px rgba(20,40,80,.30);
  --yr-shadow-lg:     0 30px 70px -28px rgba(20,40,80,.34);
  --yr-radius:        18px;
  --yr-radius-lg:     26px;
  --carbon: repeating-linear-gradient(45deg,rgba(20,40,80,.045) 0 1px,transparent 1px 6px),
            repeating-linear-gradient(-45deg,rgba(20,40,80,.045) 0 1px,transparent 1px 6px);
}

/* ---------- Base / ambient background ---------- */
html,body{ scroll-behavior:smooth; }
body{
  font-family:'Heebo',system-ui,-apple-system,'Segoe UI',sans-serif !important;
  color:var(--yr-ink) !important;
  background-color:var(--yr-bg) !important;
  background-image:
    radial-gradient(900px 560px at 88% -6%, rgba(47,107,255,.10), transparent 60%),
    radial-gradient(760px 620px at -4% 104%, rgba(22,200,230,.08), transparent 62%),
    linear-gradient(180deg,#f7f9fc,#eef1f6) !important;
  background-attachment:fixed;
}
::selection{ background:rgba(47,107,255,.18); }

/* Refined chrome scrollbar */
::-webkit-scrollbar{ width:11px; height:11px; }
::-webkit-scrollbar-track{ background:#e9edf3; }
::-webkit-scrollbar-thumb{ background:linear-gradient(180deg,#cfd5dd,#aeb6c1); border-radius:6px; border:2px solid #e9edf3; }
::-webkit-scrollbar-thumb:hover{ background:linear-gradient(180deg,#aeb6c1,#8a94a1); }

/* ---------- White text is reserved for explicitly dark/saturated surfaces. ---------- */
html a[class*="from-primary"], html button[class*="from-primary"],
html [class*="bg-gradient-to"][class*="from-primary"].text-white,
html .bg-primary.text-white, html .bg-secondary.text-white,
html [class*="bg-red-5"].text-white, html [class*="bg-red-6"].text-white,
html [class*="bg-emerald-5"].text-white, html [class*="bg-emerald-6"].text-white,
html [class*="bg-green-5"].text-white, html [class*="bg-green-6"].text-white,
html [class*="bg-amber-5"].text-white, html [class*="bg-amber-6"].text-white,
html [class*="bg-blue-5"].text-white, html [class*="bg-blue-6"].text-white,
html [class*="bg-indigo-5"].text-white, html [class*="bg-indigo-6"].text-white,
html [class*="bg-sky-5"].text-white, html [class*="bg-sky-6"].text-white{
  color:#fff !important;
}

/* Typographic refinement for headings */
h1,h2,h3{ font-family:'Rubik','Heebo',sans-serif; letter-spacing:-.4px; }

/* Contrast fix: light accent-text shades (100–300) were tuned for dark bg.
   Darken them so colored labels stay readable on the white base. */
html .text-emerald-100,html .text-emerald-200,html .text-emerald-300{ color:#047857 !important; }
html .text-green-100,html .text-green-200,html .text-green-300{ color:#15803d !important; }
html .text-red-100,html .text-red-200,html .text-red-300{ color:#b91c1c !important; }
html .text-rose-100,html .text-rose-200,html .text-rose-300{ color:#be123c !important; }
html .text-amber-100,html .text-amber-200,html .text-amber-300{ color:#b45309 !important; }
html .text-yellow-100,html .text-yellow-200,html .text-yellow-300{ color:#a16207 !important; }
html .text-orange-100,html .text-orange-200,html .text-orange-300{ color:#c2410c !important; }
html .text-sky-100,html .text-sky-200,html .text-sky-300{ color:#0369a1 !important; }
html .text-blue-100,html .text-blue-200,html .text-blue-300{ color:#1d4ed8 !important; }
html .text-indigo-100,html .text-indigo-200,html .text-indigo-300{ color:#4338ca !important; }
html .text-cyan-100,html .text-cyan-200,html .text-cyan-300{ color:#0e7490 !important; }
html .text-violet-100,html .text-violet-200,html .text-violet-300{ color:#6d28d9 !important; }

/* ---------- Form controls (light chrome) ---------- */
.yr-form-control,
.yr-select,
.yr-input,
.yr-textarea,
input[type="text"],input[type="email"],input[type="number"],input[type="search"],
select,textarea{
  background:#fff;
  color:var(--yr-ink-2);
  border:1px solid var(--yr-border);
  border-radius:12px;
  transition:border-color .18s, box-shadow .18s, background .18s;
}
.yr-form-control::placeholder,
.yr-input::placeholder,
.yr-textarea::placeholder,
input::placeholder,textarea::placeholder{ color:#64748b; opacity:1; }

.yr-form select,.yr-form input,.yr-form textarea,
.yr-card select,.yr-card input,.yr-card textarea,
main select,main input[type="text"],main input[type="email"],main input[type="number"],main input[type="search"],main textarea,
select.bg-white,input.bg-white,textarea.bg-white,
select[class*="bg-white"],input[class*="bg-white"],textarea[class*="bg-white"]{
  background-color:#ffffff !important;
  color:#0f172a !important;
}

select option,
.yr-select option,
main select option{
  background:#ffffff !important;
  color:#0f172a !important;
}

.yr-form-control:disabled,
.yr-select:disabled,
.yr-input:disabled,
.yr-textarea:disabled,
select:disabled,input:disabled,textarea:disabled{
  background:#f1f5f9 !important;
  color:#475569 !important;
  opacity:1 !important;
  cursor:not-allowed;
}
input:focus,select:focus,textarea:focus{
  outline:none;
  border-color:var(--yr-accent);
  box-shadow:0 0 0 3px rgba(47,107,255,.16);
  background:#fff;
}

/* Accessible, keyboard-visible focus everywhere */
a:focus-visible,button:focus-visible,[role="button"]:focus-visible,
input:focus-visible,select:focus-visible,textarea:focus-visible,
[tabindex]:focus-visible{
  outline:2px solid var(--yr-accent);
  outline-offset:2px;
  border-radius:8px;
}

/* ============================================================
   Reusable premium components
   ============================================================ */

/* Chrome card — solid white luxury panel */
.yr-chrome-card{
  background:linear-gradient(180deg,#ffffff,#f7f9fc);
  border:1px solid var(--yr-border);
  border-radius:var(--yr-radius-lg);
  box-shadow:var(--yr-shadow), inset 0 1px 0 rgba(255,255,255,.9);
  transition:transform .2s ease, box-shadow .2s ease;
}
.yr-chrome-card:hover{ transform:translateY(-3px); box-shadow:var(--yr-shadow-lg); }

/* Glass panel — frosted glassmorphism */
.yr-glass{
  background:linear-gradient(180deg,var(--yr-glass),var(--yr-glass-soft));
  -webkit-backdrop-filter:blur(20px) saturate(140%);
  backdrop-filter:blur(20px) saturate(140%);
  border:1px solid rgba(255,255,255,.9);
  border-radius:var(--yr-radius-lg);
  box-shadow:var(--yr-shadow), inset 0 1px 0 rgba(255,255,255,.95);
}

/* Metric chip */
.yr-chip{
  display:inline-flex; align-items:center; gap:8px;
  padding:7px 13px; border-radius:999px;
  background:rgba(47,107,255,.08);
  border:1px solid rgba(47,107,255,.16);
  color:var(--yr-accent-2);
  font-weight:700; font-size:13px;
}
.yr-chip--chrome{
  background:linear-gradient(180deg,#fdfefe,#eef1f6);
  border:1px solid var(--yr-border-strong);
  color:var(--yr-ink-2);
}

/* Score gauge (decorative ring + value) */
.yr-gauge{
  position:relative; display:inline-grid; place-items:center;
  width:var(--g,120px); height:var(--g,120px); border-radius:50%;
  background:conic-gradient(var(--yr-accent) calc(var(--val,0)*1%), #e7ebf1 0);
  box-shadow:inset 0 2px 6px rgba(20,40,80,.12);
}
.yr-gauge::after{
  content:""; position:absolute; inset:11px; border-radius:50%;
  background:#fff; box-shadow:inset 0 1px 0 #fff, 0 2px 8px -4px rgba(20,40,80,.25);
}
.yr-gauge > *{ position:relative; z-index:1; }
.yr-gauge__num{ font-family:'Rubik',sans-serif; font-weight:800; font-size:1.8rem; color:var(--yr-ink); letter-spacing:-1px; }
.yr-gauge__label{ font-size:11px; font-weight:600; color:var(--yr-muted-2); }

/* Premium primary button */
.yr-btn{
  position:relative; overflow:hidden;
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  padding:14px 26px; border:none; border-radius:14px; cursor:pointer;
  font:700 16px/1 'Heebo',sans-serif; color:#fff;
  background:linear-gradient(180deg,var(--yr-accent),var(--yr-accent-2));
  box-shadow:0 14px 30px -12px rgba(31,87,230,.55), inset 0 1px 0 rgba(255,255,255,.35);
  transition:transform .18s ease, box-shadow .18s ease;
}
.yr-btn:hover{ transform:translateY(-2px); box-shadow:0 20px 40px -12px rgba(31,87,230,.65); }

/* Secondary / chrome button */
.yr-btn--chrome{
  color:var(--yr-ink-2);
  background:linear-gradient(180deg,#fdfefe,#eef1f5 48%,#dde2e9 52%,#f3f5f8);
  border:1px solid var(--yr-border-strong);
  box-shadow:inset 0 1px 0 #fff, 0 4px 10px rgba(20,40,80,.08);
}
.yr-btn--chrome:hover{ transform:translateY(-2px); box-shadow:inset 0 1px 0 #fff, 0 8px 18px rgba(20,40,80,.12); }

/* Risk / caution note */
.yr-risk-note{
  display:flex; gap:11px; align-items:flex-start;
  padding:13px 15px; border-radius:14px;
  background:rgba(226,59,78,.06); border:1px solid rgba(226,59,78,.18);
  color:#9a2330; font-size:14px; line-height:1.5;
}
.yr-risk-note--warn{ background:rgba(214,138,0,.07); border-color:rgba(214,138,0,.22); color:#8a5800; }
.yr-risk-note--info{ background:rgba(47,107,255,.06); border-color:rgba(47,107,255,.16); color:#1f57e6; }

/* Section header */
.yr-section-header{
  font-family:'Rubik',sans-serif; font-weight:700; font-size:1.05rem;
  color:#46505c; margin:0 0 14px;
}

/* Responsive grids */
.yr-grid{ display:grid; gap:16px; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); }
.yr-grid-2{ display:grid; gap:18px; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); }
.yr-grid-3{ display:grid; gap:14px; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); }

/* RTL form layout helper */
.yr-form{ direction:rtl; text-align:right; }
.yr-form .yr-field{ display:flex; flex-direction:column; gap:.4rem; margin-bottom:1rem; }
.yr-form label{ font-weight:600; font-size:.85rem; color:var(--yr-muted); }

/* Soft reveal for safe content */
@keyframes yr-rise{ from{opacity:0; transform:translateY(10px);} to{opacity:1; transform:none;} }
.yr-rise{ animation:yr-rise .5s cubic-bezier(.16,1,.3,1) both; }

/* Chrome gradient text (brand / highlights) */
.yr-chrome-text{
  background:linear-gradient(180deg,#5a636f 0%,#1c2530 28%,#8a94a1 52%,#1c2530 74%,#5a636f 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.yr-accent-text{
  background:linear-gradient(120deg,var(--yr-accent-2),var(--yr-accent-cyan));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}

/* ---------- Chrome shell / page background ---------- */
/* Optional wrapper to give any page the premium ambient chrome base. */
.yr-shell{
  min-height:100vh;
  background-color:var(--yr-bg);
  background-image:
    radial-gradient(900px 560px at 88% -6%, rgba(47,107,255,.10), transparent 60%),
    radial-gradient(760px 620px at -4% 104%, rgba(22,200,230,.08), transparent 62%),
    linear-gradient(180deg,#f7f9fc,#eef1f6);
}

/* Subtle carbon-fibre sporty accent utility */
.yr-carbon{ background-image:var(--carbon); }

/* Best-match hero panel — premium spotlight card */
.yr-hero{
  position:relative; overflow:hidden;
  padding:28px;
  background:linear-gradient(180deg,#ffffff,#f4f7fb);
  border:1px solid var(--yr-border-strong);
  border-radius:var(--yr-radius-lg);
  box-shadow:var(--yr-shadow-lg), inset 0 1px 0 #fff;
}
.yr-hero::before{ /* restrained blue AI glow */
  content:""; position:absolute; right:-12%; bottom:-42%;
  width:440px; height:440px; pointer-events:none;
  background:radial-gradient(circle, rgba(47,107,255,.16), transparent 60%);
}
.yr-hero > *{ position:relative; z-index:1; }
.yr-hero__badge{
  display:inline-flex; align-items:center; gap:7px;
  padding:6px 14px; border-radius:999px;
  font:700 12px/1 'Heebo',sans-serif; letter-spacing:.3px;
  color:#fff; background:linear-gradient(120deg,var(--yr-accent-2),var(--yr-accent-cyan));
  box-shadow:0 8px 20px -10px rgba(31,87,230,.7), inset 0 1px 0 rgba(255,255,255,.4);
}

/* Metric tile — compact stat card */
.yr-tile{
  padding:16px;
  background:linear-gradient(180deg,#ffffff,#f7f9fc);
  border:1px solid var(--yr-border);
  border-radius:var(--yr-radius);
  box-shadow:var(--yr-shadow-sm), inset 0 1px 0 #fff;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.yr-tile:hover{ transform:translateY(-2px); border-color:var(--yr-border-strong); box-shadow:var(--yr-shadow); }
.yr-tile__label{ font-size:12px; font-weight:600; color:var(--yr-muted); margin:0 0 4px; }
.yr-tile__value{ font-family:'Rubik',sans-serif; font-weight:800; font-size:1.6rem; line-height:1; color:var(--yr-ink); letter-spacing:-.5px; }
.yr-tile__sub{ font-size:11px; font-weight:600; color:var(--yr-muted-2); margin-top:4px; }

/* Hairline chrome divider */
.yr-divider{ height:1px; border:0; background:linear-gradient(90deg,transparent,var(--yr-border-strong),transparent); margin:18px 0; }

/* ============================================================
   Shared navbar / footer / drawer / modal
   Dark carbon-chrome cockpit shell over the white/chrome body.
   Matches the uploaded prototype (dark header, light body) and
   keeps the legacy slate-* utility text readable on the dark shell.
   ============================================================ */
.yr-header{
  position:sticky; top:0; z-index:50;
  background:
    var(--carbon),
    linear-gradient(180deg, rgba(22,27,34,.93), rgba(13,17,23,.92));
  -webkit-backdrop-filter:saturate(150%) blur(16px);
  backdrop-filter:saturate(150%) blur(16px);
  border-bottom:1px solid rgba(196,204,214,.16);
  box-shadow:0 16px 40px -26px rgba(0,0,0,.8);
}
.yr-header::after{ /* AI accent strip */
  content:""; display:block; height:2px;
  background:linear-gradient(90deg,var(--yr-accent-cyan),var(--yr-accent),var(--yr-accent-2));
  opacity:.7;
}
.yr-brand{ display:flex; align-items:center; gap:12px; text-decoration:none; }
.yr-brand__mark{
  position:relative; width:40px; height:40px; border-radius:11px; overflow:hidden;
  background:linear-gradient(150deg,#3b7bff,#1f57e6);
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 6px 16px -4px rgba(47,107,255,.5), inset 0 1px 0 rgba(255,255,255,.4);
}
.yr-brand__name{
  font-family:'Rubik',sans-serif; font-weight:800; font-size:22px; line-height:1; letter-spacing:-.5px;
}
.yr-brand__sub{ font-size:10px; font-weight:600; letter-spacing:2.5px; color:#9aa3af; }
/* Light silver chrome brand text on the dark shell */
.yr-header .yr-chrome-text, .yr-footer .yr-chrome-text, .yr-drawer-panel .yr-chrome-text{
  background:linear-gradient(180deg,#f2f5f9 0%,#c4ccd6 30%,#9aa3af 52%,#e2e7ee 74%,#aab2bd 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}

/* Glass nav pills (live on the dark header + dark drawer) */
.yr-nav-pill{
  padding:9px 18px; border-radius:999px;
  border:1px solid rgba(196,204,214,.18);
  background:rgba(255,255,255,.06);
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
  color:#d7dde5; font-weight:600; font-size:14px; text-decoration:none;
  transition:transform .18s, box-shadow .18s, border-color .18s, background .18s, color .18s;
}
.yr-nav-pill:hover{
  transform:translateY(-1px); color:#fff;
  background:rgba(255,255,255,.12); border-color:rgba(196,204,214,.32);
  box-shadow:0 8px 18px -10px rgba(0,0,0,.6);
}
.yr-nav-pill--active{
  background:linear-gradient(180deg, rgba(47,107,255,.26), rgba(31,87,230,.32));
  border-color:rgba(47,107,255,.5); color:#fff; font-weight:700;
  box-shadow:0 0 0 1px rgba(47,107,255,.18), 0 8px 22px -10px rgba(47,107,255,.7);
}

/* Mobile drawer panel — dark chrome */
.yr-drawer-panel{
  background:
    var(--carbon),
    linear-gradient(180deg, #141922, #0d1117);
  border-inline-start:1px solid rgba(196,204,214,.16);
  box-shadow:-24px 0 60px -30px rgba(0,0,0,.8);
}

/* Chrome icon button (mobile toggle / close) */
.yr-icon-btn{
  display:inline-flex; align-items:center; justify-content:center;
  width:44px; height:44px; border-radius:999px;
  border:1px solid rgba(196,204,214,.22);
  background:rgba(255,255,255,.07); color:#e2e7ee;
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
  transition:background .18s, border-color .18s, color .18s;
}
.yr-icon-btn:hover{ background:rgba(255,255,255,.14); border-color:rgba(196,204,214,.38); color:#fff; }

.yr-footer{
  margin-top:64px; padding:34px 16px; text-align:center; color:#aab2bd;
  background:
    var(--carbon),
    linear-gradient(180deg, rgba(13,17,23,.97), rgba(9,12,16,.99));
  border-top:1px solid rgba(196,204,214,.14);
}
.yr-footer a{ transition:color .18s; }

/* Login modal — dark chrome glass card */
.yr-modal-card{
  background:
    var(--carbon),
    linear-gradient(180deg, #161b22, #0e131a);
  border:1px solid rgba(196,204,214,.18);
  box-shadow:0 40px 90px -30px rgba(0,0,0,.85), inset 0 1px 0 rgba(255,255,255,.06);
}
.yr-modal-card::after{ /* chrome accent strip */
  content:""; position:absolute; left:0; right:0; top:0; height:2px; border-radius:inherit;
  background:linear-gradient(90deg,var(--yr-accent-cyan),var(--yr-accent),var(--yr-accent-2)); opacity:.6;
}

@media (max-width:640px){
  .yr-brand__name{ font-size:19px; }
  .yr-hero{ padding:20px; }
}

/* ---------- Low-motion: respect reduced-motion preference ---------- */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important; animation-iteration-count:1 !important;
    transition-duration:.001ms !important; scroll-behavior:auto !important;
  }
  .yr-chrome-card:hover,.yr-tile:hover,.yr-btn:hover,.yr-btn--chrome:hover,.yr-nav-pill:hover{ transform:none !important; }
}

/* ============================================================
   Recommendation Results — Premium Dashboard UI
   ============================================================ */

/* Score gauge — animated SVG ring (re-implemented from ScoreGauge.dc.html) */
.yr-score-gauge{ position:relative; display:inline-block; }
.yr-score-gauge__ring{ display:block; overflow:visible; }
.yr-score-gauge__track{ fill:none; stroke:#e7ebf1; }
.yr-score-gauge__progress{
  fill:none; stroke:url(#yr-gauge-gradient);
  stroke-linecap:round;
  transition:stroke-dashoffset 1.15s cubic-bezier(.16,1,.3,1);
  filter:drop-shadow(0 2px 6px rgba(47,107,255,.28));
}
.yr-score-gauge__value{
  font-family:'Rubik',sans-serif; font-weight:800;
  fill:var(--yr-ink); letter-spacing:-1px;
}
.yr-score-gauge__label{
  font-family:'Heebo',sans-serif; font-weight:600;
  fill:var(--yr-muted-2); letter-spacing:.3px;
}

/* Hero — best-match spotlight */
.yr-result-hero{
  position:relative; overflow:hidden;
  padding:32px;
  background:linear-gradient(180deg,#ffffff,#f4f7fb);
  border:1px solid var(--yr-border-strong);
  border-radius:var(--yr-radius-lg);
  box-shadow:var(--yr-shadow-lg), inset 0 1px 0 #fff;
}
.yr-result-hero::before{
  content:""; position:absolute; left:-10%; bottom:-40%;
  width:460px; height:460px; pointer-events:none;
  background:radial-gradient(circle, rgba(47,107,255,.12), transparent 60%);
}
.yr-result-hero > *{ position:relative; z-index:1; }

/* Metric strip — compact dashboard row */
.yr-metric-strip{
  display:grid; gap:12px;
  grid-template-columns:repeat(auto-fit, minmax(130px,1fr));
}
.yr-metric-item{
  padding:14px;
  background:linear-gradient(180deg,#ffffff,#f7f9fc);
  border:1px solid var(--yr-border);
  border-radius:var(--yr-radius);
  box-shadow:var(--yr-shadow-sm), inset 0 1px 0 #fff;
  text-align:center;
  transition:transform .2s ease, box-shadow .2s ease;
}
.yr-metric-item:hover{ transform:translateY(-2px); box-shadow:var(--yr-shadow); }
.yr-metric-item__label{
  font-size:11px; font-weight:600; color:var(--yr-muted);
  margin:0 0 4px; line-height:1.3;
}
.yr-metric-item__value{
  font-family:'Rubik',sans-serif; font-weight:700;
  font-size:1.15rem; line-height:1.1;
  color:var(--yr-ink); letter-spacing:-.3px;
}
.yr-metric-item__sub{
  font-size:10px; font-weight:500; color:var(--yr-muted-2); margin-top:3px;
}

/* Car recommendation card */
.yr-car-card{
  background:linear-gradient(180deg,#ffffff,#f7f9fc);
  border:1px solid var(--yr-border);
  border-radius:var(--yr-radius-lg);
  box-shadow:var(--yr-shadow), inset 0 1px 0 rgba(255,255,255,.9);
  padding:0;
  overflow:hidden;
  transition:transform .22s ease, box-shadow .22s ease;
}
.yr-car-card:hover{ transform:translateY(-3px); box-shadow:var(--yr-shadow-lg); }

.yr-car-card__header{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:22px 24px 16px;
  border-bottom:1px solid var(--yr-border);
  background:linear-gradient(180deg,#ffffff,#fafbfd);
}

.yr-car-card__body{ padding:20px 24px 24px; }

/* Spec chips row */
.yr-spec-chips{
  display:flex; flex-wrap:wrap; gap:6px; margin-top:8px;
}
.yr-spec-chip{
  display:inline-flex; align-items:center; gap:4px;
  padding:4px 10px; border-radius:999px;
  background:linear-gradient(180deg,#fdfefe,#eef1f6);
  border:1px solid var(--yr-border);
  font-size:11px; font-weight:600; color:var(--yr-ink-2);
}

/* Data table inside card */
.yr-data-grid{
  display:grid; gap:1px;
  grid-template-columns:1fr;
  background:var(--yr-border);
  border-radius:14px;
  overflow:hidden;
  margin-top:16px;
}
.yr-data-row{
  display:grid;
  grid-template-columns:minmax(120px,1fr) 1fr;
  gap:0;
  background:#fff;
}
.yr-data-row:nth-child(even){ background:#fafbfd; }
.yr-data-row__label{
  padding:9px 14px;
  font-size:12px; font-weight:600; color:var(--yr-muted);
  border-left:1px solid var(--yr-border);
}
.yr-data-row__value{
  padding:9px 14px;
  font-size:12px; font-weight:500; color:var(--yr-ink);
}

/* Method sub-row */
.yr-method-row{
  display:grid;
  grid-template-columns:minmax(120px,1fr) 1fr;
  gap:0;
  background:#f4f6f9;
}
.yr-method-row__label{
  padding:5px 14px 5px 14px;
  font-size:10.5px; font-weight:600; color:var(--yr-muted-2);
  border-left:1px solid var(--yr-border);
}
.yr-method-row__value{
  padding:5px 14px;
  font-size:10.5px; font-weight:500; color:var(--yr-muted);
  line-height:1.5;
}

/* Comparison comment block */
.yr-comment-block{
  padding:14px 16px; border-radius:14px;
  background:rgba(47,107,255,.05);
  border:1px solid rgba(47,107,255,.14);
  font-size:13px; line-height:1.6; color:var(--yr-ink-2);
  margin-top:16px;
}
.yr-comment-block__title{
  font-weight:700; color:var(--yr-accent-2);
  margin-bottom:4px; font-size:13px;
}

/* Risk note — uses existing yr-risk-note + yr-risk-note--warn */

/* Collapsible search queries */
.yr-queries-toggle{
  cursor:pointer; user-select:none;
  display:inline-flex; align-items:center; gap:6px;
  padding:8px 14px; border-radius:999px;
  background:linear-gradient(180deg,#fdfefe,#eef1f6);
  border:1px solid var(--yr-border);
  font-size:12px; font-weight:600; color:var(--yr-muted);
  transition:background .18s, border-color .18s;
}
.yr-queries-toggle:hover{ border-color:var(--yr-border-strong); }
.yr-queries-toggle svg{ transition:transform .2s ease; }
.yr-queries-toggle[aria-expanded="true"] svg{ transform:rotate(180deg); }
.yr-queries-list{
  margin-top:8px; padding:0 14px;
  font-size:12px; color:var(--yr-muted); line-height:1.7;
  list-style:none;
}
.yr-queries-list li::before{ content:"• "; color:var(--yr-accent); }

/* Fit score color utilities */
.yr-fit--high{ color:#1f8a4d; }
.yr-fit--mid{ color:#b45309; }
.yr-fit--low{ color:var(--yr-muted); }
.yr-fit-bg--high{ background:linear-gradient(135deg,#e6f7ed,#d0f0db); border-color:#a7e2b8; }
.yr-fit-bg--mid{ background:linear-gradient(135deg,#fef3e2,#fde9c8); border-color:#f5d08c; }
.yr-fit-bg--low{ background:linear-gradient(135deg,#f0f1f4,#e8eaee); border-color:#cfd5dd; }

/* Reliability grade badges */
.yr-grade{ display:inline-flex; align-items:center; gap:4px; padding:4px 10px; border-radius:999px; font-size:11px; font-weight:700; }
.yr-grade--low{ background:rgba(31,138,77,.1); color:#1f8a4d; border:1px solid rgba(31,138,77,.25); }
.yr-grade--mid{ background:rgba(180,83,9,.1); color:#b45309; border:1px solid rgba(180,83,9,.25); }
.yr-grade--high{ background:rgba(226,59,78,.1); color:#c0293a; border:1px solid rgba(226,59,78,.25); }
.yr-grade--unknown{ background:rgba(107,116,128,.1); color:#6b7480; border:1px solid rgba(107,116,128,.25); }

/* Profile summary chips (light theme) */
.yr-profile-chip{
  display:inline-flex; align-items:center;
  padding:5px 12px; border-radius:999px;
  background:linear-gradient(180deg,#fdfefe,#f0f2f6);
  border:1px solid var(--yr-border);
  font-size:11px; font-weight:600; color:var(--yr-ink-2);
}
.yr-profile-chip--accent{
  background:rgba(47,107,255,.07);
  border-color:rgba(47,107,255,.2);
  color:var(--yr-accent-2);
}

/* Result ready panel — premium upgrade */
.yr-ready-panel{
  text-align:center;
  padding:36px 28px;
  background:linear-gradient(180deg,#ffffff,#f4f7fb);
  border:1px solid var(--yr-border-strong);
  border-radius:var(--yr-radius-lg);
  box-shadow:var(--yr-shadow-lg), inset 0 1px 0 #fff;
}

/* Disclaimer boxes */
.yr-disclaimer{
  padding:14px 16px; border-radius:14px;
  font-size:13px; line-height:1.6;
}
.yr-disclaimer--warn{
  background:rgba(214,138,0,.06); border:1px solid rgba(214,138,0,.2);
  color:#8a5800;
}
.yr-disclaimer--info{
  background:rgba(47,107,255,.05); border:1px solid rgba(47,107,255,.14);
  color:var(--yr-accent-2);
}
.yr-disclaimer--neutral{
  background:linear-gradient(180deg,#fafbfc,#f4f6f9);
  border:1px solid var(--yr-border);
  color:var(--yr-ink-2);
}

/* Annual cost breakdown mini-bar */
.yr-cost-bar{
  display:flex; height:8px; border-radius:4px; overflow:hidden;
  background:#e7ebf1; margin-top:6px;
}
.yr-cost-bar__seg{
  height:100%; min-width:4px;
  transition:width .5s cubic-bezier(.16,1,.3,1);
}

@media (max-width:640px){
  .yr-result-hero{ padding:20px 16px; }
  .yr-car-card__header{ padding:16px 16px 12px; flex-direction:column; align-items:stretch; }
  .yr-car-card__body{ padding:16px; }
  .yr-metric-strip{ grid-template-columns:repeat(2,1fr); gap:8px; }
  .yr-data-row{ grid-template-columns:1fr; }
  .yr-data-row__label{ border-left:none; border-bottom:1px solid var(--yr-border); }
  .yr-method-row{ grid-template-columns:1fr; }
  .yr-method-row__label{ border-left:none; }
  .yr-glass{ padding:24px 20px; }
}

/* Legal pages — readable prose on mobile */
@media (max-width:480px){
  main .max-w-4xl{ padding:1.25rem !important; }
  main .max-w-4xl h2{ font-size:1.75rem; }
  main .max-w-4xl h3{ font-size:1.15rem; }
  main .max-w-4xl ul{ padding-right:1.25rem; }
}

/* ============================================================
   Advisor flow shell — prototype parity (Run 1)
   Premium dark-chrome step toolbar, preference summary,
   and AI analyzing screen. RTL + mobile friendly.
   ============================================================ */
.yr-flow-hidden{ display:none !important; }

/* Sticky dark chrome advisor shell (step indicator + progress) */
.yr-app-header{
  position:sticky; top:0; z-index:40;
  border-radius:16px; overflow:hidden;
  background:
    var(--carbon),
    linear-gradient(180deg,#161b22,#0e131a);
  border:1px solid rgba(196,204,214,.16);
  box-shadow:0 18px 40px -26px rgba(0,0,0,.7);
}
.yr-app-header__inner{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:12px 18px;
}
.yr-app-header__brand{ display:flex; align-items:center; gap:11px; min-width:0; }
.yr-app-header__mark{
  flex:none; width:36px; height:36px; border-radius:10px;
  background:linear-gradient(150deg,#3b7bff,#1f57e6);
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 6px 16px -4px rgba(47,107,255,.55), inset 0 1px 0 rgba(255,255,255,.4);
}
.yr-app-header__brand-text{ display:flex; flex-direction:column; line-height:1.05; }
.yr-app-header__name{
  font-family:'Rubik',sans-serif; font-weight:800; font-size:18px; letter-spacing:-.4px;
  background:linear-gradient(180deg,#ffffff 0%,#e9ecf1 30%,#a9b2bd 54%,#e9ecf1 76%,#ffffff 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.yr-app-header__sub{ font-size:9.5px; font-weight:600; letter-spacing:2px; color:#7b8694; }
.yr-app-header__right{ display:flex; align-items:center; gap:12px; }

.yr-step-pill{
  display:inline-flex; align-items:center; gap:8px;
  padding:7px 14px; border-radius:999px;
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12);
}
.yr-step-pill__num{ font-family:'Rubik',sans-serif; font-weight:700; font-size:13px; color:#5e9bff; }
.yr-step-pill__sep{ font-size:12px; color:#7b8694; }
.yr-step-pill__label{ font-size:13px; font-weight:600; color:#c4ccd6; }

.yr-step-restart{
  display:inline-flex; align-items:center; gap:7px;
  padding:8px 14px; border-radius:10px;
  border:1px solid rgba(255,255,255,.14); background:rgba(255,255,255,.05);
  color:#d6dce4; font:600 13px/1 'Heebo',sans-serif; cursor:pointer;
  transition:background .18s, border-color .18s;
}
.yr-step-restart:hover{ background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.24); }

.yr-progress{ height:3px; background:rgba(255,255,255,.08); }
.yr-progress__fill{
  height:100%; width:20%;
  background:linear-gradient(90deg,var(--yr-accent-cyan),var(--yr-accent));
  border-radius:0 3px 3px 0;
  transition:width .5s cubic-bezier(.16,1,.3,1);
}

/* Preference summary */
.yr-pref-summary__head{ margin-bottom:18px; text-align:center; }
.yr-pref-summary__title{ font-family:'Rubik',sans-serif; font-weight:800; font-size:1.6rem; color:var(--yr-ink); margin:0 0 6px; }
.yr-pref-summary__subtitle{ font-size:14px; color:var(--yr-muted); margin:0; }
.yr-pref-grid{ display:grid; gap:14px; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); }
.yr-pref-card{
  display:flex; align-items:flex-start; gap:13px;
  padding:15px 16px; border-radius:16px;
  background:linear-gradient(180deg,#ffffff,#f7f9fc);
  border:1px solid var(--yr-border);
  box-shadow:var(--yr-shadow-sm), inset 0 1px 0 #fff;
}
.yr-pref-card__icon{
  flex:none; width:40px; height:40px; border-radius:12px;
  background:linear-gradient(180deg,#eef3ff,#dfe9ff);
  display:flex; align-items:center; justify-content:center; color:var(--yr-accent);
}
.yr-pref-card__body{ min-width:0; }
.yr-pref-card__label{ font-size:12px; font-weight:600; color:var(--yr-muted-2); margin-bottom:2px; }
.yr-pref-card__value{ font-size:14.5px; font-weight:700; color:var(--yr-ink-2); word-break:break-word; }
.yr-pref-card--weights{ flex-direction:column; grid-column:1 / -1; }
.yr-pref-weights{ display:grid; gap:10px; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); width:100%; }
.yr-pref-weight__head{ display:flex; justify-content:space-between; font-size:12px; font-weight:600; color:var(--yr-ink-2); margin-bottom:5px; }
.yr-pref-weight__bar{ height:6px; border-radius:3px; background:#e7ebf1; overflow:hidden; }
.yr-pref-weight__fill{ height:100%; background:linear-gradient(90deg,var(--yr-accent),var(--yr-accent-cyan)); border-radius:3px; }
.yr-pref-error{ margin-top:14px; color:#b91c1c; font-size:13px; font-weight:600; text-align:center; }
.yr-pref-summary__actions{ display:flex; flex-wrap:wrap; gap:12px; justify-content:center; margin-top:22px; }

/* AI analyzing screen */
.yr-analyzing-panel{
  min-height:54vh;
  display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center;
  padding:34px 20px;
  background:linear-gradient(180deg,var(--yr-glass),var(--yr-glass-soft));
  -webkit-backdrop-filter:blur(20px) saturate(140%); backdrop-filter:blur(20px) saturate(140%);
  border:1px solid rgba(255,255,255,.9); border-radius:var(--yr-radius-lg);
  box-shadow:var(--yr-shadow-lg), inset 0 1px 0 rgba(255,255,255,.95);
}
.yr-analyzing-ring{ position:relative; width:220px; height:220px; display:grid; place-items:center; margin-bottom:26px; }
.yr-analyzing-ring__halo{ position:absolute; inset:16px; border-radius:50%; border:1px dashed rgba(47,107,255,.3); animation:yr-spin 14s linear infinite; }
.yr-analyzing-ring__svg{ grid-area:1 / 1; width:220px; height:220px; transform:rotate(-90deg); }
.yr-analyzing-ring__track{ fill:none; stroke:#e7ebf1; stroke-width:12; }
.yr-analyzing-ring__progress{
  fill:none; stroke:url(#yr-analyze-grad); stroke-width:12; stroke-linecap:round;
  stroke-dasharray:502.65; stroke-dashoffset:502.65;
  transition:stroke-dashoffset .25s linear;
  filter:drop-shadow(0 3px 10px rgba(47,107,255,.4));
}
.yr-analyzing-ring__center{ grid-area:1 / 1; display:flex; flex-direction:column; align-items:center; }
.yr-analyzing-ring__pct{ font-family:'Rubik',sans-serif; font-weight:800; font-size:50px; letter-spacing:-2px; color:var(--yr-ink); line-height:1; }
.yr-analyzing-ring__sign{ font-size:22px; color:var(--yr-muted-2); }
.yr-analyzing-ring__caption{ font-size:12px; font-weight:600; letter-spacing:1px; color:var(--yr-muted-2); margin-top:2px; }
.yr-analyzing-panel__title{ font-family:'Rubik',sans-serif; font-weight:700; font-size:1.5rem; margin:0 0 8px; color:var(--yr-ink); }
.yr-analyzing-panel__eta{ font-size:14px; color:var(--yr-muted); margin:0 0 22px; min-height:20px; }
.yr-analysis-steps{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:10px; width:100%; max-width:360px; text-align:right; }
.yr-analysis-step{ display:flex; align-items:center; gap:11px; font-size:13.5px; color:var(--yr-muted-2); transition:color .3s; }
.yr-analysis-step__dot{
  flex:none; width:18px; height:18px; border-radius:50%;
  border:2px solid #d4dae2; background:#fff; position:relative;
  transition:border-color .3s, background .3s;
}
.yr-analysis-step.is-active{ color:var(--yr-ink-2); font-weight:600; }
.yr-analysis-step.is-active .yr-analysis-step__dot{ border-color:var(--yr-accent); }
.yr-analysis-step.is-active .yr-analysis-step__dot::after{
  content:""; position:absolute; inset:3px; border-radius:50%;
  background:var(--yr-accent); animation:ir_pulse 1.4s ease-in-out infinite;
}
.yr-analysis-step.is-done{ color:var(--yr-ink-2); }
.yr-analysis-step.is-done .yr-analysis-step__dot{ border-color:var(--yr-success); background:var(--yr-success); }
.yr-analysis-step.is-done .yr-analysis-step__dot::after{ content:none; }

@keyframes ir_pulse{ 0%,100%{ opacity:.55; } 50%{ opacity:1; } }
@keyframes yr-spin{ to{ transform:rotate(360deg); } }

/* Inline button spinner (analyze button) */
.yr-spin{
  display:inline-block; width:18px; height:18px;
  border:2px solid rgba(255,255,255,.35); border-top-color:#fff;
  border-radius:50%; animation:yr-spin .8s linear infinite;
}

@media (max-width:640px){
  .yr-app-header__inner{ padding:10px 12px; gap:10px; }
  .yr-app-header__sub{ display:none; }
  .yr-step-pill__label{ display:none; }
  .yr-step-restart span{ display:none; }
  .yr-step-restart{ padding:8px; }
  .yr-pref-grid{ grid-template-columns:1fr; }
  .yr-analyzing-ring,.yr-analyzing-ring__svg{ width:180px; height:180px; }
  .yr-analyzing-ring__pct{ font-size:42px; }
}

/* Dashboard card overflow protection */
.history-card{ overflow:hidden; word-break:break-word; }
.detail-section{ overflow:hidden; word-break:break-word; }
.detail-section table{ font-size:11px; }
@media (max-width:480px){
  .detail-section table th,
  .detail-section table td{ padding:4px 6px; font-size:10px; }
}

/* ============================================================
   Internal advisor flow — Compare & Details (Run 2 parity)
   Same-page compare / details / cost-breakdown / risk views.
   Visual continuity with the .yr-* premium white/chrome system.
   ============================================================ */

/* Result CTAs (compare top 3 / back to preferences) */
.yr-result-actions{
  display:flex; flex-wrap:wrap; gap:12px; align-items:center;
  margin-bottom:18px;
}
.yr-result-actions__note{ font-size:12px; color:var(--yr-muted-2); margin:0; }
.yr-result-actions .yr-btn[disabled]{
  opacity:.5; cursor:not-allowed; box-shadow:none; transform:none;
}
.yr-result-actions .yr-btn[disabled]:hover{ transform:none; box-shadow:none; }

/* Shared flow-view container + header (compare + details) */
.yr-flow-view{ margin-top:4px; }
.yr-flow-header{ display:flex; align-items:center; gap:14px; margin-bottom:22px; flex-wrap:wrap; }
.yr-flow-back{
  flex:none; width:42px; height:42px; border-radius:12px;
  border:1px solid var(--yr-border-strong);
  background:linear-gradient(180deg,#fdfefe,#eef1f5 48%,#dde2e9 52%,#f3f5f8);
  box-shadow:inset 0 1px 0 #fff;
  display:flex; align-items:center; justify-content:center; cursor:pointer;
  color:var(--yr-ink-2); transition:transform .18s;
}
.yr-flow-back:hover{ transform:translateX(3px); }
.yr-flow-title{ font-family:'Rubik',sans-serif; font-weight:800; font-size:1.7rem; letter-spacing:-.6px; color:var(--yr-ink); margin:0; }
.yr-flow-subtitle{ font-size:13px; color:var(--yr-muted); margin:4px 0 0; }

/* ---------- Compare view ---------- */
.yr-compare-view{ }
.yr-compare-scroll{ overflow-x:auto; -webkit-overflow-scrolling:touch; padding-bottom:4px; }
.yr-compare-table{
  min-width:560px; border-radius:20px; overflow:hidden;
  background:linear-gradient(180deg,var(--yr-glass),var(--yr-glass-soft));
  -webkit-backdrop-filter:blur(18px) saturate(140%); backdrop-filter:blur(18px) saturate(140%);
  border:1px solid rgba(255,255,255,.9);
  box-shadow:var(--yr-shadow-lg);
}
.yr-compare-row{
  display:grid;
  grid-template-columns:minmax(140px,.9fr) repeat(var(--yr-compare-cols,3),minmax(130px,1fr));
  border-bottom:1px solid rgba(20,40,80,.05);
}
.yr-compare-row:last-child{ border-bottom:none; }
.yr-compare-row--head{
  background:linear-gradient(180deg,rgba(47,107,255,.05),transparent);
  border-bottom:1px solid rgba(20,40,80,.08);
}
.yr-compare-row:nth-child(even):not(.yr-compare-row--head){ background:rgba(20,40,80,.012); }
.yr-compare-rowlabel{
  padding:14px 16px; display:flex; align-items:center; gap:8px;
  font:600 13px/1.35 'Heebo',sans-serif; color:var(--yr-muted);
  background:rgba(20,40,80,.02);
}
.yr-compare-cell{
  padding:14px 12px; border-right:1px solid rgba(20,40,80,.04);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px;
  text-align:center;
}
.yr-compare-cell__val{ font-family:'Rubik',sans-serif; font-weight:700; font-size:15px; color:var(--yr-ink-2); word-break:break-word; }
.yr-compare-cell--head{ gap:8px; padding:18px 12px; }
.yr-compare-cell__title{ font-family:'Rubik',sans-serif; font-weight:700; font-size:15px; color:var(--yr-ink); line-height:1.15; }
.yr-compare-cell__sub{ font-size:11.5px; color:var(--yr-muted-2); }
.yr-compare-cell__chips{ display:flex; flex-wrap:wrap; gap:5px; justify-content:center; }
.yr-compare-winner .yr-compare-cell__val{ color:var(--yr-success); }
.yr-compare-winner__badge{
  display:inline-flex; align-items:center; gap:4px;
  padding:3px 9px; border-radius:999px;
  background:rgba(31,138,77,.1); color:var(--yr-success);
  font:700 11px/1 'Heebo',sans-serif;
}

/* ---------- Details view ---------- */
.yr-details-view{ }
.yr-details-grid{ display:grid; grid-template-columns:1.25fr 1fr; gap:20px; align-items:start; }
.yr-details-section{ margin-top:20px; }

.yr-cost-panel{
  padding:24px 26px; border-radius:20px;
  background:linear-gradient(180deg,var(--yr-glass),var(--yr-glass-soft));
  -webkit-backdrop-filter:blur(18px) saturate(140%); backdrop-filter:blur(18px) saturate(140%);
  border:1px solid rgba(255,255,255,.9);
  box-shadow:var(--yr-shadow-lg);
}
.yr-cost-panel__head{ display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:6px; flex-wrap:wrap; }
.yr-cost-panel__caption{ font-size:13px; font-weight:600; color:var(--yr-muted-2); margin-bottom:3px; }
.yr-cost-total{ font-family:'Rubik',sans-serif; font-weight:800; font-size:38px; letter-spacing:-1.5px; color:var(--yr-ink); line-height:1; }
.yr-cost-total__unit{ font-size:15px; font-weight:600; color:var(--yr-muted-2); margin-inline-start:6px; }
.yr-cost-panel__aside{ text-align:left; }
.yr-cost-panel__aside-label{ font-size:12px; font-weight:600; color:var(--yr-muted-2); }
.yr-cost-panel__aside-val{ font-family:'Rubik',sans-serif; font-weight:700; font-size:18px; color:var(--yr-ink-2); }
.yr-cost-partial-tag{
  display:inline-flex; align-items:center; gap:5px; margin-top:8px;
  padding:4px 10px; border-radius:999px;
  background:rgba(214,138,0,.08); border:1px solid rgba(214,138,0,.22);
  color:#8a5800; font:700 11px/1 'Heebo',sans-serif;
}
.yr-cost-segment-bar{
  display:flex; height:22px; border-radius:7px; overflow:hidden;
  margin:16px 0 18px; background:#e7ebf1;
}
.yr-cost-segment-bar__seg{ height:100%; min-width:3px; transition:width .6s cubic-bezier(.16,1,.3,1); }
.yr-cost-segment-row{
  display:flex; align-items:center; gap:12px;
  padding:11px 0; border-bottom:1px solid rgba(20,40,80,.05);
}
.yr-cost-segment-row:last-child{ border-bottom:none; }
.yr-cost-segment-row__swatch{ flex:none; width:12px; height:12px; border-radius:4px; }
.yr-cost-segment-row__label{ flex:1; font:600 14px/1.3 'Heebo',sans-serif; color:var(--yr-ink-2); }
.yr-cost-segment-row__pct{ font-size:13px; color:var(--yr-muted-2); }
.yr-cost-segment-row__amt{ font-family:'Rubik',sans-serif; font-weight:700; font-size:15px; color:var(--yr-ink-2); min-width:74px; text-align:left; }

/* ---------- Typed risk notes ---------- */
.yr-risk-stack{ display:flex; flex-direction:column; gap:12px; }
.yr-risk-note--success{ background:rgba(31,138,77,.07); border-color:rgba(31,138,77,.2); color:#1f7a45; }
.yr-risk-note--warning{ background:rgba(214,138,0,.07); border-color:rgba(214,138,0,.22); color:#8a5800; }
.yr-risk-note--neutral{ background:linear-gradient(180deg,#fafbfc,#f4f6f9); border-color:var(--yr-border); color:var(--yr-ink-2); }
.yr-risk-note__title{ font-weight:700; font-size:13px; margin-bottom:3px; }
.yr-risk-note__icon{ flex:none; width:26px; height:26px; border-radius:8px; display:flex; align-items:center; justify-content:center; margin-top:1px; }
.yr-risk-note ul{ margin:6px 0 0; padding-inline-start:18px; }
.yr-risk-note li{ margin-bottom:3px; }

.yr-flow-footer{ display:flex; flex-wrap:wrap; gap:12px; margin-top:24px; justify-content:flex-end; }

@media (max-width:820px){
  .yr-details-grid{ grid-template-columns:1fr; }
}
@media (max-width:640px){
  .yr-flow-title{ font-size:1.4rem; }
  .yr-cost-total{ font-size:32px; }
  .yr-cost-panel{ padding:18px 16px; }
  .yr-result-actions .yr-btn,
  .yr-result-actions .yr-btn--chrome{ flex:1 1 auto; }
}

/* ---------- Premium empty state (no recommendations) ---------- */
.yr-empty-state{
  display:flex; flex-direction:column; align-items:center; text-align:center;
  gap:12px; padding:40px 24px;
  background:linear-gradient(180deg,#ffffff,#f5f8fc);
  border:1px solid var(--yr-border); border-radius:var(--yr-radius-lg);
  box-shadow:var(--yr-shadow-sm), inset 0 1px 0 #fff;
}
.yr-empty-state__icon{
  flex:none; width:60px; height:60px; border-radius:18px;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(180deg,#eef3ff,#dfe9ff); color:var(--yr-accent);
}
.yr-empty-state__title{ font-family:'Rubik',sans-serif; font-weight:800; font-size:1.35rem; color:var(--yr-ink); margin:0; }
.yr-empty-state__text{ font-size:13.5px; line-height:1.7; color:var(--yr-muted); margin:0; max-width:520px; }
.yr-empty-state__hints{
  list-style:none; margin:4px 0 6px; padding:0;
  display:flex; flex-direction:column; gap:6px; font-size:12.5px; color:var(--yr-muted-2);
}
.yr-empty-state__hints li{ position:relative; padding-inline-start:16px; }
.yr-empty-state__hints li::before{
  content:""; position:absolute; inset-inline-start:0; top:7px;
  width:6px; height:6px; border-radius:50%; background:var(--yr-accent);
}

/* ---------- Small-phone polish (360–430px) ---------- */
@media (max-width:430px){
  .yr-pref-summary__actions .yr-btn,
  .yr-pref-summary__actions .yr-btn--chrome{ width:100%; }
  .yr-flow-footer{ justify-content:stretch; }
  .yr-flow-footer .yr-btn,
  .yr-flow-footer .yr-btn--chrome{ flex:1 1 auto; text-align:center; }
  .yr-cost-total{ font-size:28px; }
  .yr-empty-state{ padding:30px 16px; }
  .yr-empty-state__title{ font-size:1.2rem; }
  .yr-analyzing-panel{ padding:26px 14px; }
}

/* Vehicle review / comparison prototype alignment */
.yr-review-result-shell{border:1px solid var(--yr-border);border-radius:var(--yr-radius-lg);background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(247,249,252,.9));box-shadow:var(--yr-shadow-lg);}
.yr-review-result-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;}
.yr-result-section{display:block!important;border:1px solid var(--yr-border);border-radius:22px;background:rgba(255,255,255,.82);padding:18px;box-shadow:var(--yr-shadow-sm);}
.yr-result-section--wide{grid-column:1/-1;}
.yr-section-kicker{display:inline-flex;align-items:center;border:1px solid rgba(47,107,255,.22);background:rgba(47,107,255,.08);color:var(--yr-accent-2);border-radius:999px;padding:5px 11px;margin-bottom:12px;font-size:12px;font-weight:800;}
.yr-competitor-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;}
.yr-competitor-card{border:1px solid var(--yr-border);border-radius:18px;background:linear-gradient(180deg,#fff,#f7f9fc);padding:16px;}
.yr-competitor-card dt{font-size:11px;font-weight:800;color:var(--yr-muted);}
.yr-competitor-card dd{margin:2px 0 0;color:var(--yr-ink-2);}
.yr-mini-badge{border-radius:999px;padding:3px 8px;font-size:11px;font-weight:800;border:1px solid var(--yr-border);white-space:nowrap;}
.yr-mini-badge--warn{background:rgba(214,138,0,.08);border-color:rgba(214,138,0,.25);color:#8a5800;}
.yr-compare-category-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;}
@media (max-width:640px){.yr-review-result-grid{grid-template-columns:1fr}.yr-result-section{padding:15px}.yr-result-hero{padding:18px 15px}.yr-competitor-grid,.yr-compare-category-grid{grid-template-columns:1fr}}

/* Review/compare parity: reuse advisor chrome for tool-specific final dashboards */
.yr-tool-analyzing-popover{max-width:min(92vw,420px);min-height:auto;padding:24px;border-radius:28px;background:linear-gradient(180deg,var(--yr-glass),var(--yr-glass-soft));border:1px solid rgba(255,255,255,.9);box-shadow:var(--yr-shadow-lg)}
.yr-review-result-shell,.yr-compare-result-shell{border-radius:32px;background:linear-gradient(180deg,var(--yr-glass),var(--yr-glass-soft));border:1px solid rgba(255,255,255,.9);box-shadow:var(--yr-shadow-lg),inset 0 1px 0 rgba(255,255,255,.95)}
.yr-review-result-grid,.yr-compare-dashboard-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.yr-partial-research{box-shadow:var(--yr-shadow-sm)}
@media(max-width:640px){.yr-review-result-shell,.yr-compare-result-shell{border-radius:24px;padding:14px!important}.yr-review-result-grid,.yr-compare-dashboard-grid{grid-template-columns:1fr;gap:12px}.yr-result-section{padding:15px;border-radius:18px}.yr-result-hero{padding:20px 16px;border-radius:22px}.yr-tool-analyzing-popover{width:calc(100vw - 28px);padding:18px}}

.yr-result-section.hidden{display:none!important}

/* ============================================================
   Vehicle Review — Single Tabbed Card
   ============================================================ */
.yr-review-single-card{
  border:1px solid var(--yr-border-strong);
  border-radius:var(--yr-radius-lg);
  background:linear-gradient(180deg,#ffffff,#f7f9fc);
  box-shadow:var(--yr-shadow-lg), inset 0 1px 0 #fff;
  overflow:hidden;
}
.yr-review-tabs{
  display:flex; gap:0; overflow-x:auto; -webkit-overflow-scrolling:touch;
  border-bottom:1px solid var(--yr-border);
  background:linear-gradient(180deg,#fafbfd,#f4f6f9);
  padding:0 16px;
  scrollbar-width:none;
}
.yr-review-tabs::-webkit-scrollbar{display:none}
.yr-review-tab{
  flex:none; padding:12px 18px; border:none; background:none; cursor:pointer;
  font:600 13px/1 'Heebo',sans-serif; color:var(--yr-muted);
  border-bottom:2px solid transparent; white-space:nowrap;
  transition:color .18s, border-color .18s;
}
.yr-review-tab:hover{color:var(--yr-ink-2)}
.yr-review-tab.is-active{
  color:var(--yr-accent-2); border-bottom-color:var(--yr-accent);
  font-weight:700;
}
.yr-review-tab-panel{display:none; padding:24px; color:var(--yr-ink-2); direction:rtl; text-align:right}
.yr-review-tab-panel.is-active{display:block; animation:yr-rise .3s ease both}
.yr-review-param-grid{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:10px;
}
.yr-review-param{
  padding:10px 14px; border-radius:12px;
  background:linear-gradient(180deg,#ffffff,#f7f9fc);
  border:1px solid var(--yr-border);
}
.yr-review-param__label{display:block; font-size:11px; font-weight:600; color:var(--yr-muted); margin-bottom:2px}
.yr-review-param__value{display:block; font-size:14px; font-weight:700; color:var(--yr-ink)}
.yr-review-mini-card{
  padding:12px 16px; border-radius:14px;
  background:linear-gradient(180deg,#ffffff,#f7f9fc);
  border:1px solid var(--yr-border);
  box-shadow:var(--yr-shadow-sm);
}
.yr-review-list{list-style:disc; padding-inline-start:18px; margin:0; line-height:1.8}
.yr-review-list li{margin-bottom:4px; color:var(--yr-ink-2); font-size:13.5px}
.yr-review-competitor-grid{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:12px;
}

/* Ensure .yr-result-hero stays light everywhere */
.yr-review-single-card .yr-result-hero{
  background:linear-gradient(180deg,#ffffff,#f4f7fb);
  border-color:var(--yr-border-strong);
  color:var(--yr-ink);
}
.yr-review-single-card .yr-result-hero .yr-chip{color:var(--yr-accent-2)}
.yr-review-single-card .yr-result-hero h3{color:var(--yr-ink)}

@media(max-width:640px){
  .yr-review-tab-panel{padding:16px}
  .yr-review-param-grid{grid-template-columns:1fr}
  .yr-review-competitor-grid{grid-template-columns:1fr}
  .yr-review-tab{padding:10px 14px; font-size:12px}
}

/* Result cards: premium light surfaces with semantic text colors */
.yr-result-card,.yr-review-single-card,.yr-compare-result-card,.yr-result-section{
  background:linear-gradient(180deg,#ffffff,#f4f7fb);
  border:1px solid var(--yr-border-strong);
  color:var(--yr-ink);
  box-shadow:var(--yr-shadow-sm), inset 0 1px 0 #fff;
}
.yr-result-section,.yr-compare-result-card{border-radius:22px;overflow:hidden}
.yr-result-section{display:block!important;padding:18px}
.yr-card-title,.yr-result-card h3,.yr-result-card h4,.yr-compare-result-card h3,.yr-compare-result-card h4,.yr-review-single-card h3,.yr-review-single-card h4{color:var(--yr-ink)!important}
.yr-card-subtitle,.yr-result-card p,.yr-compare-result-card p,.yr-review-single-card p{color:var(--yr-ink-2)}
.yr-result-card .text-slate-100,.yr-result-card .text-slate-200,.yr-result-card .text-slate-300,
.yr-compare-result-card .text-slate-100,.yr-compare-result-card .text-slate-200,.yr-compare-result-card .text-slate-300,
.yr-result-section .text-slate-100,.yr-result-section .text-slate-200,.yr-result-section .text-slate-300{color:var(--yr-ink-2)!important}
.yr-result-card .text-slate-400,.yr-compare-result-card .text-slate-400,.yr-result-section .text-slate-400{color:var(--yr-muted)!important}

#compareLegalConfirm,
#legal-confirm,
.legal-consent-checkbox {
  appearance: none !important;
  -webkit-appearance: none !important;
  width: 1.5rem;
  height: 1.5rem;
  flex: 0 0 auto;
  display: inline-block;
  border: 2px solid var(--yr-accent, #2f6bff) !important;
  border-radius: 0.375rem;
  background-color: #ffffff !important;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 82% 82%;
  cursor: pointer;
}

#compareLegalConfirm:checked,
#legal-confirm:checked,
.legal-consent-checkbox:checked {
  background-color: #ffffff !important;
  border-color: var(--yr-accent, #2f6bff) !important;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 10.5L8.2 14.5L16 5.5' stroke='%232f6bff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C%2Fsvg%3E") !important;
}

#compareLegalConfirm:focus-visible,
#legal-confirm:focus-visible,
.legal-consent-checkbox:focus-visible {
  outline: 3px solid rgba(47, 107, 255, 0.25);
  outline-offset: 2px;
}

/* Scoped compare-result color guard: keep generated comparison answer text on system primary blue. */
#resultsSection .yr-compare-result-card,
#resultsSection .yr-compare-result-card :where(h1,h2,h3,h4,h5,h6,p,span,dt,dd,li,div),
#winnerDisplay :where(h1,h2,h3,h4,h5,h6,p,div),
#categoriesSection :where(h1,h2,h3,h4,h5,h6,p,dt,dd,li) {
  color: var(--yr-accent, #2f6bff);
}
#resultsSection .car-result-chip,
#resultsSection .car-result-chip *,
#resultsSection button,
#resultsSection button * {
  color: inherit;
}
