
:root{
  --bg:#080a0d;--surface:#0e1217;--surface2:#131920;--surface3:#19212a;
  --line:#252e38;--line2:#303b47;--text:#f5f7f8;--muted:#8e9aa6;
  --accent:#e7ff58;--accentSoft:rgba(231,255,88,.10);
  --green:#69dda1;--blue:#68baff;--amber:#ffcc69;--red:#ff7b7b;
  --radius:18px;--radiusLg:26px;--shadow:0 24px 70px rgba(0,0,0,.30)
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:
radial-gradient(circle at 72% -12%,rgba(231,255,88,.07),transparent 27%),
linear-gradient(180deg,#080a0d,#0b0f13 48%,#080a0d);
color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
a{color:inherit}
.hidden{display:none!important}
.muted{color:var(--muted)}
.eyebrow{color:var(--accent);font-size:10px;font-weight:950;letter-spacing:.18em;text-transform:uppercase}
h1,h2,h3,p{margin-top:0}
h1{font-size:clamp(40px,5.7vw,70px);line-height:.96;letter-spacing:-.052em}
h2{font-size:27px;letter-spacing:-.035em;margin-bottom:0}
h3{font-size:18px;letter-spacing:-.02em}
p{line-height:1.55}
button:disabled{opacity:.45;cursor:not-allowed}

.btn{border:1px solid var(--line);background:var(--surface3);color:var(--text);border-radius:13px;padding:10px 14px;font-weight:850;transition:.16s}
.btn:hover:not(:disabled){transform:translateY(-1px);border-color:var(--line2)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#090b0d}
.btn.ghost{background:transparent}
.btn.small{padding:7px 10px;font-size:12px;border-radius:11px}
.btn.danger{color:#ffc2c2;border-color:rgba(255,123,123,.25);background:rgba(255,123,123,.05)}
.iconBtn{width:38px;height:38px;padding:0;display:grid;place-items:center}

.pill{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:999px;padding:5px 8px;font-size:10px;font-weight:850;letter-spacing:.03em}
.pill.owner{color:#c6ccd2}
.pill.document{color:var(--blue);border-color:rgba(104,186,255,.30);background:rgba(104,186,255,.04)}
.pill.verified{color:var(--green);border-color:rgba(105,221,161,.30);background:rgba(105,221,161,.04)}
.pill.warn{color:var(--amber);border-color:rgba(255,204,105,.30);background:rgba(255,204,105,.04)}

.appShell{min-height:100vh;display:grid;grid-template-columns:238px 1fr}
.sidebar{position:sticky;top:0;height:100vh;padding:22px 16px;border-right:1px solid rgba(255,255,255,.05);background:rgba(9,12,15,.84);backdrop-filter:blur(18px);display:flex;flex-direction:column;gap:22px;z-index:30}
.logo{font-size:19px;font-weight:950;letter-spacing:.24em;padding:0 8px}
.logoSub{font-size:10px;color:var(--muted);letter-spacing:.08em;margin:5px 0 0 8px}
.navGroup{display:grid;gap:5px}
.navLabel{font-size:10px;color:#697581;font-weight:900;text-transform:uppercase;letter-spacing:.14em;padding:6px 9px}
.navBtn{width:100%;display:flex;gap:11px;align-items:center;text-align:left;border:0;background:transparent;color:#aeb7c0;border-radius:12px;padding:10px 11px;font-weight:800}
.navBtn:hover{background:#11171d;color:var(--text)}
.navBtn.active{background:var(--accentSoft);color:var(--text);box-shadow:inset 0 0 0 1px rgba(231,255,88,.15)}
.navIcon{width:22px;text-align:center}
.sidebarFoot{margin-top:auto;border-top:1px solid var(--line);padding:14px 8px 0}
.userMail{font-size:11px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-bottom:9px}

.main{min-width:0}
.topbar{height:70px;position:sticky;top:0;z-index:25;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 28px;border-bottom:1px solid rgba(255,255,255,.05);background:rgba(8,10,13,.84);backdrop-filter:blur(18px)}
.pageTitle{font-weight:900}
.topActions{display:flex;gap:8px;align-items:center}
.content{max-width:1180px;margin:0 auto;padding:28px 28px 70px}
.view{display:none}
.view.active{display:block}

.hero{display:grid;grid-template-columns:1.08fr .92fr;gap:18px;align-items:stretch;margin-bottom:20px}
.heroText,.vehicleHero,.card{background:linear-gradient(145deg,var(--surface2),var(--surface));border:1px solid var(--line);border-radius:var(--radiusLg);box-shadow:0 12px 36px rgba(0,0,0,.11)}
.heroText{padding:28px}
.heroText p{color:#c1c9d1;font-size:16px;max-width:650px}
.vehicleHero{padding:22px;display:flex;flex-direction:column;justify-content:space-between}
.vehicleHeroTop{display:flex;justify-content:space-between;gap:14px}
.assetIcon{width:58px;height:58px;border-radius:17px;background:var(--accent);color:#090b0d;display:grid;place-items:center;font-size:27px}
.proofCircle{width:92px;height:92px;border-radius:50%;display:grid;place-items:center;position:relative;background:conic-gradient(var(--accent) 0 var(--score),#222a32 var(--score) 100%)}
.proofCircle:after{content:"";position:absolute;width:69px;height:69px;border-radius:50%;background:var(--surface)}
.proofCircle strong{position:relative;z-index:2;font-size:21px}
.miniStats{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:18px}
.miniStat{background:#0b1014;border:1px solid var(--line);border-radius:13px;padding:11px}
.miniStat small{display:block;color:var(--muted);margin-bottom:4px}
.miniStat strong{font-size:17px}

.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.card{padding:18px;border-radius:var(--radius)}
.cardHeader{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:14px}
.kpi{font-size:33px;font-weight:950;letter-spacing:-.045em;margin-top:7px}
.section{margin-top:18px}
.sectionHead{display:flex;justify-content:space-between;gap:14px;align-items:end;margin-bottom:12px}

.garageLayout{display:grid;grid-template-columns:300px 1fr;gap:12px}
.vehicleList{display:grid;gap:8px}
.assetRow{width:100%;display:flex;justify-content:space-between;align-items:center;gap:9px;text-align:left;background:#0b1014;color:inherit;border:1px solid var(--line);border-radius:14px;padding:12px}
.assetRow.active{border-color:#667226;box-shadow:inset 0 0 0 1px rgba(231,255,88,.13)}
.vehicleName{font-weight:900}
.vehicleMeta{font-size:11px;color:var(--muted);margin-top:3px}

.specGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.spec{background:#0b1014;border:1px solid var(--line);border-radius:13px;padding:11px;min-width:0}
.spec small{display:block;color:var(--muted);font-size:10px;margin-bottom:4px}
.spec strong{display:block;overflow:hidden;text-overflow:ellipsis}
.techList{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.techRow{display:flex;justify-content:space-between;gap:14px;border-bottom:1px solid #202831;padding:9px 0;font-size:13px}
.techRow span:first-child{color:var(--muted)}
.techRow strong{text-align:right}

.timeline{display:grid}
.event{display:grid;grid-template-columns:95px 1fr auto;gap:13px;align-items:center;padding:13px 0;border-bottom:1px solid var(--line)}
.event:last-child{border-bottom:0}
.doc{display:grid;grid-template-columns:42px 1fr auto;gap:11px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}
.doc:last-child{border-bottom:0}
.docIcon{width:38px;height:38px;border:1px solid var(--line);background:#0b1014;border-radius:11px;display:grid;place-items:center}
.empty{text-align:center;color:var(--muted);padding:30px 10px}

.integrationGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.integrationCard{border:1px solid var(--line);border-radius:17px;padding:16px;background:#0b1014}
.integrationHead{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.integrationDot{width:10px;height:10px;border-radius:50%;background:var(--amber);box-shadow:0 0 0 5px rgba(255,204,105,.06)}
.integrationDot.ready{background:var(--green);box-shadow:0 0 0 5px rgba(105,221,161,.06)}

.notice{border:1px solid rgba(231,255,88,.20);background:rgba(231,255,88,.045);padding:12px 14px;border-radius:13px;color:#dce4c7;font-size:12px}
.flash{position:fixed;right:20px;bottom:20px;z-index:100;max-width:410px;background:#131920;border:1px solid var(--line2);border-radius:14px;padding:12px 14px;box-shadow:var(--shadow);font-size:13px}
.flash.good{border-color:rgba(105,221,161,.32)}
.flash.bad{border-color:rgba(255,123,123,.32)}

.authPage{min-height:100vh;display:grid;place-items:center;padding:24px}
.authBox{width:min(500px,100%);background:linear-gradient(145deg,var(--surface2),var(--surface));border:1px solid var(--line);border-radius:28px;padding:25px;box-shadow:var(--shadow)}
.authBrand{font-weight:950;letter-spacing:.22em;font-size:20px}
.authBox h1{font-size:45px;margin-top:26px}
.authTabs{display:flex;gap:7px;margin:20px 0 14px}
.authTabs .btn{flex:1}

.formGrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.full{grid-column:1/-1}
label{display:grid;gap:6px;font-size:11px;font-weight:850;color:#c9d0d7}
input,select,textarea{width:100%;background:#090d11;border:1px solid var(--line);border-radius:11px;color:var(--text);padding:11px 12px;outline:none}
input:focus,select:focus,textarea:focus{border-color:#586571}
textarea{min-height:86px;resize:vertical}
.searchWrap{position:relative}
.suggestions{position:absolute;left:0;right:0;top:calc(100% + 5px);z-index:80;background:#11171d;border:1px solid var(--line2);border-radius:13px;max-height:260px;overflow:auto;box-shadow:var(--shadow)}
.suggestion{padding:10px 12px;border-bottom:1px solid #212a33;cursor:pointer}
.suggestion:last-child{border-bottom:0}
.suggestion:hover{background:#182029}
.libraryGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}

.dropzone{border:1px dashed #45515d;border-radius:17px;padding:23px;text-align:center;background:#0a0f13;transition:.16s}
.dropzone.drag{border-color:var(--accent);background:rgba(231,255,88,.045)}
.dropIcon{width:52px;height:52px;border-radius:15px;background:var(--accent);color:#090b0d;display:grid;place-items:center;font-size:25px;margin:0 auto 10px}

dialog{width:min(780px,calc(100% - 28px));background:#10151b;color:var(--text);border:1px solid var(--line2);border-radius:23px;padding:0;box-shadow:var(--shadow)}
dialog::backdrop{background:rgba(0,0,0,.72);backdrop-filter:blur(5px)}
.modal{padding:21px}
.modalHead{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:14px}
.modalActions{display:flex;justify-content:flex-end;gap:8px;margin-top:16px}

.mobileNav{display:none}
@media(max-width:980px){
  .appShell{grid-template-columns:1fr}
  .sidebar{display:none}
  .mobileNav{display:flex;gap:5px;overflow:auto;padding:8px 14px;border-bottom:1px solid var(--line);background:#0a0e12;position:sticky;top:70px;z-index:24}
  .mobileNav .navBtn{width:auto;white-space:nowrap}
  .content{padding:20px 16px 70px}
  .topbar{padding:0 16px}
  .hero,.garageLayout{grid-template-columns:1fr}
  .integrationGrid{grid-template-columns:1fr}
}
@media(max-width:700px){
  .grid3,.grid2,.specGrid,.techList,.formGrid,.libraryGrid,.miniStats{grid-template-columns:1fr}
  .full{grid-column:auto}
  .event{grid-template-columns:1fr}
  .doc{grid-template-columns:38px 1fr}
  .doc .btn{grid-column:2}
  .topActions .topEmail{display:none}
}

@media(min-width:981px){
  .integrationGrid{grid-template-columns:repeat(2,1fr)}
}

#scanDialog{width:min(980px,calc(100% - 28px))}
#scanStatus.error{color:var(--red)}
#scanStatus.good{color:var(--green)}

.rawFieldList{display:grid;gap:7px;margin-top:10px;max-height:280px;overflow:auto}
.rawFieldRow{display:grid;grid-template-columns:54px 1fr auto;gap:10px;align-items:center;padding:9px;border:1px solid var(--line);border-radius:11px;background:#0a0f13}
.rawFieldCode{font-weight:950;color:var(--accent);font-size:11px}
.techRow strong .pill{font-size:9px;font-weight:850}
@media(max-width:700px){.rawFieldRow{grid-template-columns:45px 1fr}.rawFieldRow>.pill{grid-column:2;justify-self:start}}

.newVehicleAiBar{display:flex;gap:10px;align-items:center;margin-top:10px}
.newVehicleAiBar .muted{font-size:12px}
#newRegAnalyzeStatus.good{color:var(--green)}
#newRegAnalyzeStatus.error{color:var(--red)}
@media(max-width:700px){.newVehicleAiBar{align-items:stretch;flex-direction:column}}

.deleteNotice{
  border-color:rgba(255,123,123,.28);
  background:rgba(255,123,123,.055);
  color:#f0d9d9
}
#deleteVehicleDialog{width:min(620px,calc(100% - 28px))}

.newVehicleImportTop{
  border:1px solid rgba(231,255,88,.23);
  background:rgba(231,255,88,.035);
  border-radius:18px;
  padding:14px;
  margin-bottom:14px
}
.newVehicleImportTop .dropzone{margin-top:0!important}
.newVehicleDivider{
  display:flex;
  align-items:center;
  gap:10px;
  color:var(--muted);
  font-size:11px;
  margin:16px 0
}
.newVehicleDivider:before,.newVehicleDivider:after{
  content:"";
  height:1px;
  background:var(--line);
  flex:1
}
.saveStatus{font-size:12px;min-height:18px;margin-top:12px;text-align:right}
.saveStatus.error{color:var(--red)}

.multiPageHint{
  color:var(--accent);
  font-size:11px;
  margin-top:6px
}

#newRegName{line-height:1.55;margin-top:8px}

#vinDialog{width:min(920px,calc(100% - 28px))}
.vinIdentity{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:13px 14px;border:1px solid var(--line);border-radius:14px;background:#0a0f13
}
.vinIdentity div{display:grid;gap:4px}
.vinIdentity strong{font-size:18px;letter-spacing:.04em}
.vinCompareHead,.vinCompareRow{
  display:grid;grid-template-columns:28px minmax(120px,1fr) minmax(120px,1fr) minmax(120px,1fr);
  gap:10px;align-items:center
}
.vinCompareHead{
  color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.08em;
  padding:8px 10px;border-bottom:1px solid var(--line)
}
.vinCompareRow{
  padding:10px;border-bottom:1px solid var(--line);font-size:12px
}
.vinCompareRow:last-child{border-bottom:0}
.vinCompareRow input{width:17px;height:17px}
@media(max-width:700px){
  .vinCompareHead{display:none}
  .vinCompareRow{grid-template-columns:28px 1fr}
  .vinCompareRow>span:nth-child(3):before{content:"Aktuell: ";color:var(--muted)}
  .vinCompareRow>span:nth-child(4):before{content:"VIN: ";color:var(--muted)}
  .vinCompareRow>span:nth-child(3),.vinCompareRow>span:nth-child(4){grid-column:2}
}

.vehicleRowMain{display:flex;align-items:center;gap:10px;min-width:0}
.vehicleAvatar{
  display:grid;place-items:center;flex:0 0 auto;
  border-radius:14px;
  background:linear-gradient(180deg,rgba(231,255,88,.06),rgba(97,210,255,.04));
  border:1px solid rgba(231,255,88,.14);
  overflow:hidden;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.02)
}
.vehicleAvatar.sm{width:44px;height:44px}
.vehicleAvatar.lg{width:56px;height:56px}
.vehicleAvatar svg{width:100%;height:100%;display:block}
#heroIcon.assetIcon{
  width:72px;height:72px;padding:0;font-size:27px;background:transparent;border:0
}
#garageVehicleTitle{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap
}
.assetRow .pill{margin-left:auto}


.vehicleAvatarOuter.sm{width:44px;height:44px}
.vehicleAvatarOuter.lg{width:56px;height:56px}
.vehicleAvatarBadge{
  position:absolute;
  right:-3px;
  bottom:-2px;
  min-width:24px;
  height:15px;
  padding:0 5px;
  border-radius:999px;
  display:grid;
  place-items:center;
  background:#0b1116;
  border:1px solid rgba(255,255,255,.15);
  color:#f5f7f8;
  font-size:8px;
  font-weight:950;
  letter-spacing:.04em;
  z-index:2
}





}

.vehicleAvatarBrand{
  position:absolute;
  left:-4px;
  top:-4px;
  z-index:3;
  max-width:calc(100% - 10px)
}
.brandMark{
  display:inline-flex;
  align-items:center;
  gap:4px;
  min-height:18px;
  padding:2px 6px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(10,14,18,.92);
  color:#f3f6fa;
  font-size:9px;
  font-weight:900;
  line-height:1;
  letter-spacing:.05em;
  box-shadow:0 6px 18px rgba(0,0,0,.26)
}
.brandMark strong{font-size:9px;line-height:1;white-space:nowrap}
.brandMark.custom{background:rgba(231,255,88,.92);color:#0a1015;border-color:rgba(255,255,255,.12)}
.brandMark.aprilia{background:#111317;color:#fff;border-color:rgba(255,100,100,.45);text-transform:lowercase;font-style:italic}
.brandMark.porsche{background:#15181d;color:#f0d57f}
.brandMark.audi{padding:3px 6px}
.brandMark.audi svg{width:40px;height:12px;display:block}
.brandMark.audi,.brandMark.bmw,.brandMark.vw,.brandMark.mb{color:#eef4fb}
.brandMarkCircle{
  width:20px;height:20px;border-radius:50%;
  display:grid;place-items:center;
  border:1.5px solid currentColor;
  font-size:7px;font-weight:900;
  background:rgba(255,255,255,.04)
}
.brandMark.m{
  background:#0d1217;
  padding:3px 7px 3px 5px;
  gap:5px
}
.brandMark.m strong{font-size:11px;font-style:italic}
.brandMbars{display:inline-flex;gap:1px;align-items:flex-end}
.brandMbars i{display:block;width:4px;border-radius:1px 1px 0 0}
.brandMbars i:nth-child(1){height:9px;background:#62c8ff}
.brandMbars i:nth-child(2){height:11px;background:#3040ad}
.brandMbars i:nth-child(3){height:13px;background:#f14b65}
.brandMark.amg{background:#111317;color:#fff}
.brandMark.rs{background:#b3141f;color:#fff}
.brandMark.gti{background:#b91018;color:#fff}
.brandMark.r{background:#1b3a8a;color:#fff}
.brandMark.typer{background:#c91920;color:#fff}
.brandMark.cupra{background:#6b4cff;color:#fff}
.brandMark.abarth{background:#7c1f22;color:#fff}
.brandMark.skoda{background:#0f3a24;color:#c5ffd9}
.brandMark.seat{background:#20252b;color:#dbe5f0}
.brandMark.honda{background:#c91920;color:#fff}
.brandMark.yamaha{background:#2b2367;color:#fff}
.brandMark.ducati{background:#b40f1f;color:#fff}
.brandMark.generic{background:rgba(10,14,18,.92);color:#e8eef6}
.vehicleAvatarOuter.sm .vehicleAvatarBrand .brandMark{transform:scale(.94);transform-origin:top left}
.vehicleAvatarOuter.lg .vehicleAvatarBrand .brandMark{transform:scale(1);transform-origin:top left}

.muted.tiny{font-size:11px;opacity:.72}

/* V8.7 — manufacturer logos only. Comic vehicle art is no longer rendered. */
.manufacturerLogo{
  position:relative;
  display:inline-grid;
  place-items:center;
  flex:0 0 auto;
}
.manufacturerLogo.sm{width:48px;height:48px}
.manufacturerLogo.lg{width:68px;height:68px}

.manufacturerLogoTile{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  padding:8px;
  border-radius:14px;
  background:#f7f8fa;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:
    0 7px 20px rgba(0,0,0,.24),
    inset 0 0 0 1px rgba(0,0,0,.035);
  overflow:hidden;
}

.manufacturerLogo.lg .manufacturerLogoTile{
  padding:10px;
  border-radius:18px;
}

.manufacturerLogoTile img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
}

.manufacturerLogoFallback{
  width:100%;
  height:100%;
  place-items:center;
  text-align:center;
  color:#101419;
  font-size:10px;
  font-weight:950;
  line-height:1.05;
  letter-spacing:.02em;
  overflow-wrap:anywhere;
}

.manufacturerLogo.lg .manufacturerLogoFallback{font-size:12px}

.specialLogoBadge{
  position:absolute;
  right:-7px;
  bottom:-5px;
  min-width:25px;
  height:18px;
  padding:0 6px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:3px;
  background:#0b1014;
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 5px 14px rgba(0,0,0,.35);
  color:white;
  font-size:9px;
  font-weight:950;
  z-index:3;
}

.specialLogoBadge.imageBadge{
  width:38px;
  padding:3px 6px;
  background:#fff;
}
.specialLogoBadge.imageBadge img{
  width:100%;
  height:100%;
  object-fit:contain;
}

.bmwM strong{
  font-size:12px;
  font-style:italic;
  line-height:1;
}
.mBars{
  display:inline-flex;
  gap:1px;
  align-items:flex-end;
  transform:skew(-15deg);
}
.mBars i{display:block;width:4px}
.mBars i:nth-child(1){height:7px;background:#63c9ff}
.mBars i:nth-child(2){height:9px;background:#3946a4}
.mBars i:nth-child(3){height:11px;background:#e54a5c}

.rsBadge,.gtiBadge,.typeRBadge{background:#b81020}
.rBadge{background:#174d9d}
.cupraBadge{background:#523b2f}

#heroIcon.assetIcon{
  background:transparent;
  border:0;
  width:76px;
  height:76px;
  padding:0;
}

.vehicleRowMain{gap:12px}
#garageVehicleTitle{gap:12px}

.publicPassportPage{min-height:100vh;background:var(--bg);color:var(--text)}
.publicTopbar{height:70px;display:flex;align-items:center;justify-content:space-between;padding:0 22px;border-bottom:1px solid var(--line);background:rgba(8,12,16,.94);position:sticky;top:0;z-index:10;backdrop-filter:blur(12px)}
.publicPassportShell{width:min(1080px,calc(100% - 28px));margin:26px auto 50px}
.publicHero{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px}
.publicVehicleIdentity{display:flex;align-items:center;gap:18px;min-width:0}
.publicVehicleIdentity h1{font-size:32px;letter-spacing:-.035em;margin:3px 0 5px}
.publicScore{width:108px;height:108px;border-radius:50%;display:grid;place-items:center;text-align:center;background:radial-gradient(circle at center,#11181e 57%,transparent 58%),conic-gradient(var(--accent) 0 82%,#263039 82% 100%);border:1px solid var(--line);flex:0 0 auto}
.publicScore strong{display:block;font-size:28px;line-height:1}.publicScore span{display:block;color:var(--muted);font-size:10px;margin-top:-25px}
.publicGrid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}
.publicSpecGrid{grid-template-columns:repeat(2,1fr)}
.publicTechList{grid-template-columns:1fr}
.publicTimeline{display:grid}.publicEvent{display:flex;justify-content:space-between;gap:14px;align-items:center;padding:13px 0;border-bottom:1px solid var(--line)}.publicEvent:last-child{border-bottom:0}
.publicPrivacyNotice{margin-top:16px;text-align:center;color:var(--muted);font-size:11px;line-height:1.6;padding:12px}
.publicLoading,.publicError{text-align:center;padding:60px 20px}.publicError{margin-top:60px}
.publicSharePanel{margin-top:13px}.publicShareActive{display:grid;gap:10px}.publicShareActions{display:flex;gap:8px;flex-wrap:wrap}.publicShareInactive{display:flex;justify-content:space-between;gap:12px;align-items:center}.publicShareInactive p{margin:0}
@media(max-width:760px){.publicHero{align-items:flex-start}.publicGrid{grid-template-columns:1fr}.publicVehicleIdentity h1{font-size:25px}.publicScore{width:84px;height:84px}.publicShareInactive{display:grid}.publicSpecGrid{grid-template-columns:1fr 1fr}}

/* V8.9 Buyer-facing public dossier */
.publicBuyerHero{padding:24px}
.publicBuyerHeroMain{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}
.publicBuyerIdentity{align-items:center}
.publicEyebrowRow{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.publicLiveDot{font-size:9px;font-weight:950;letter-spacing:.08em;color:var(--green);border:1px solid rgba(105,221,161,.24);background:rgba(105,221,161,.06);padding:4px 7px;border-radius:999px}
.publicVehicleSubtitle{color:var(--muted);margin:4px 0 0}
.publicBuyerActions{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end}
.publicTrustStrip{display:grid;grid-template-columns:1.15fr repeat(4,1fr);gap:9px;margin-top:20px}
.publicScoreCard,.publicTrustItem{min-height:98px;border:1px solid var(--line);border-radius:15px;background:#0b1014;padding:12px}
.publicScoreCard{display:flex;align-items:center;gap:12px}
.publicScoreCard>div:last-child{display:grid;gap:3px}
.publicScoreCard>div:last-child span{font-weight:900}
.publicScoreCard>div:last-child small,.publicTrustItem>span:first-child{color:var(--muted);font-size:10px}
.publicScoreRing{--publicScore:0%;width:62px;height:62px;border-radius:50%;background:conic-gradient(var(--accent) 0 var(--publicScore),#222a32 var(--publicScore) 100%);display:grid;place-items:center;position:relative;flex:0 0 auto}
.publicScoreRing:after{content:"";position:absolute;width:46px;height:46px;border-radius:50%;background:#0b1014}
.publicScoreRing strong{position:relative;z-index:2;font-size:17px}
.publicTrustItem{display:grid;align-content:center;gap:6px}
.publicTrustItem strong{font-size:12px;line-height:1.25}
.publicTrustItem .pill{justify-self:start}
.publicBuyerGrid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.publicBuyerCard{min-width:0}
.publicFactGrid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.publicFact{background:#0b1014;border:1px solid var(--line);border-radius:12px;padding:11px}
.publicFact small{display:block;color:var(--muted);font-size:10px;margin-bottom:5px}
.publicFact strong{font-size:13px;overflow-wrap:anywhere}
.publicTechTable{display:grid}
.publicTechRow{display:grid;grid-template-columns:1fr 1fr auto;gap:10px;align-items:center;padding:9px 0;border-bottom:1px solid var(--line)}
.publicTechRow:last-child{border-bottom:0}
.publicTechRow>span:first-child{color:var(--muted);font-size:12px}
.publicTechRow strong{text-align:right;font-size:12px}
.publicSectionHeader{align-items:center}
.publicSectionHeader p{margin:5px 0 0;font-size:12px}
.buyerTimeline{display:grid}
.buyerTimelineItem{display:grid;grid-template-columns:28px 120px 1fr;gap:12px;min-height:78px}
.buyerTimelineRail{display:grid;justify-items:center;grid-template-rows:16px 1fr}
.buyerTimelineRail span{width:11px;height:11px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px rgba(231,255,88,.07);margin-top:4px}
.buyerTimelineRail i{display:block;width:1px;background:var(--line2);height:100%}
.buyerTimelineDate{display:grid;align-content:start;gap:4px;padding-top:1px}
.buyerTimelineDate strong{font-size:12px}
.buyerTimelineDate span{font-size:10px;color:var(--muted)}
.buyerTimelineBody{border-bottom:1px solid var(--line);padding:0 0 17px;margin-bottom:16px}
.buyerTimelineItem:last-child .buyerTimelineBody{border-bottom:0;margin-bottom:0}
.buyerTimelineTitle{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:5px}
.buyerTimelineTitle strong{font-size:13px}
.buyerTimelineBody>.muted{font-size:11px}
.publicInspectionHero{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.publicInspectionHero>div{border:1px solid var(--line);border-radius:13px;background:#0b1014;padding:12px}
.publicInspectionHero small{display:block;color:var(--muted);font-size:10px;margin-bottom:5px}
.publicInspectionHero strong{font-size:13px}
.publicOlderInspections{display:grid;margin-top:10px}
.publicOlderInspections>div{display:grid;grid-template-columns:1fr 1fr auto;gap:9px;align-items:center;border-top:1px solid var(--line);padding:9px 0;font-size:11px}
.publicProofLegend{display:grid;gap:11px}
.publicProofLegend>div{display:grid;grid-template-columns:88px 1fr;gap:12px;align-items:start}
.publicProofLegend p{margin:1px 0 0;color:var(--muted);font-size:11px;line-height:1.45}
.publicShareCard{display:grid;grid-template-columns:1fr auto;gap:22px;align-items:center}
.publicShareCardText h3{margin:5px 0 7px}
.publicShareCardText p{margin:0}
.publicShareFacts{display:flex;gap:8px 16px;flex-wrap:wrap;margin-top:14px;color:#dce4c7;font-size:11px}
.publicQrWrap{display:grid;justify-items:center;gap:7px;min-width:180px}
.publicQr{width:174px;height:174px;background:#fff;border-radius:13px;padding:9px;display:grid;place-items:center}
.publicQr img,.publicQr canvas{max-width:156px!important;max-height:156px!important}
.publicQrWrap small{font-size:9px;letter-spacing:.12em;color:var(--muted);font-weight:900}
.qrFallback{font-size:10px;color:#222;text-align:center}
.publicPrivacyNotice strong{color:var(--text)}
.publicPassportFooter{display:flex;justify-content:space-between;gap:12px;margin-top:15px;padding:13px 2px;color:var(--muted);font-size:10px}

@media(max-width:900px){
  .publicTrustStrip{grid-template-columns:repeat(2,1fr)}
  .publicScoreCard{grid-column:span 2}
}
@media(max-width:720px){
  .publicBuyerHeroMain{display:grid}
  .publicBuyerActions{justify-content:flex-start}
  .publicBuyerGrid{grid-template-columns:1fr}
  .publicTrustStrip{grid-template-columns:1fr}
  .publicScoreCard{grid-column:auto}
  .buyerTimelineItem{grid-template-columns:24px 1fr}
  .buyerTimelineDate{grid-column:2}
  .buyerTimelineBody{grid-column:2}
  .publicInspectionHero{grid-template-columns:1fr}
  .publicShareCard{grid-template-columns:1fr;justify-items:start}
  .publicPassportFooter{display:grid}
}
@media(max-width:480px){
  .publicFactGrid{grid-template-columns:1fr}
  .publicTechRow{grid-template-columns:1fr auto}
  .publicTechRow .pill{grid-column:2}
  .publicProofLegend>div{grid-template-columns:1fr}
}

@media print{
  body{background:#fff!important;color:#111!important}
  .publicPassportPage{background:#fff!important;color:#111!important}
  .publicTopbar,.noPrint{display:none!important}
  .publicPassportShell{width:100%;margin:0}
  .card,.publicFact,.publicScoreCard,.publicTrustItem,.publicInspectionHero>div{box-shadow:none!important;background:#fff!important;color:#111!important;border-color:#cfd4da!important}
  .muted,.publicVehicleSubtitle,.publicPassportFooter,.publicProofLegend p{color:#59616a!important}
  .buyerTimelineRail i{background:#cfd4da!important}
  .publicShareCard{break-inside:avoid}
  .publicHistoryCard{break-inside:auto}
}

.smartDocumentDialog{width:min(850px,calc(100% - 28px))}
.smartHint{font-size:11px;margin-top:5px;display:block}
.smartAiAction{
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
  margin-top:13px
}
.smartDocumentReview{
  margin-top:16px;
  padding:15px;
  border:1px solid var(--line);
  border-radius:17px;
  background:#0b1014
}
.smartReviewHead{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:flex-start
}
.smartActionSelect{
  display:block;
  margin-top:12px
}
.smartActionFields{margin-top:12px}
.smartWarnings{
  margin-top:11px;
  font-size:11px;
  line-height:1.45
}
.smartMismatch{
  border-color:rgba(255,123,123,.38)!important;
  background:rgba(255,123,123,.06)!important;
  color:#ffd4d4!important
}

.pickerlSummary{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:8px;
  margin-top:14px
}
.pickerlCount{
  border:1px solid var(--line);
  border-radius:13px;
  background:#0a0f13;
  padding:10px;
  display:grid;
  gap:2px
}
.pickerlCount small{font-size:10px;font-weight:900}
.pickerlCount strong{font-size:21px}
.pickerlCount span{font-size:9px;color:var(--muted)}
.pickerlCount.clean{border-color:rgba(105,221,161,.25)}
.pickerlCount.light{border-color:rgba(255,204,105,.28)}
.pickerlCount.heavy{border-color:rgba(255,146,83,.34)}
.pickerlCount.danger{border-color:rgba(255,123,123,.42)}
.pickerlCount.note{border-color:rgba(150,165,180,.2)}

.pickerlDefectHeader{
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:12px;
  margin:18px 0 9px
}
.pickerlDefectHeader h4{margin:3px 0 0}
.pickerlDefectHeader>.muted{font-size:10px;max-width:280px;text-align:right}

.pickerlDefectList{
  display:grid;
  border:1px solid var(--line);
  border-radius:14px;
  overflow:hidden
}
.pickerlDefectRow{
  display:grid;
  grid-template-columns:34px 145px minmax(120px,.8fr) minmax(200px,1.7fr) 72px;
  gap:8px;
  align-items:center;
  padding:8px;
  border-bottom:1px solid var(--line);
  border-left:3px solid transparent;
  background:#0a0f13
}
.pickerlDefectRow:last-child{border-bottom:0}
.pickerlDefectRow.clean{border-left-color:var(--green)}
.pickerlDefectRow.light{border-left-color:#ffcc69}
.pickerlDefectRow.heavy{border-left-color:#ff9253}
.pickerlDefectRow.danger{border-left-color:#ff7b7b}
.pickerlDefectRow.note,.pickerlDefectRow.unclear{border-left-color:#687584}
.pickerlDefectIndex{
  width:26px;height:26px;border-radius:50%;
  display:grid;place-items:center;
  background:#151c23;
  font-size:10px;font-weight:900
}
.pickerlDefectRow input,.pickerlDefectRow select{font-size:11px;padding:8px}
.pickerlCode{font-size:9px;color:var(--muted);text-align:right}
.pickerlEmpty{padding:18px}
.pickerlDue{font-size:11px;color:#dce4c7}

.publicPickerlSummary{
  display:flex;
  gap:7px;
  flex-wrap:wrap;
  margin-top:13px
}
.publicPickerlSummary span{
  padding:6px 9px;
  border-radius:999px;
  background:#0a0f13;
  border:1px solid var(--line);
  font-size:10px
}
.publicPickerlSummary .light{border-color:rgba(255,204,105,.3)}
.publicPickerlSummary .heavy{border-color:rgba(255,146,83,.35)}
.publicPickerlSummary .danger{border-color:rgba(255,123,123,.45)}

.publicPickerlDefects{
  display:grid;
  gap:6px;
  margin-top:13px
}
.publicPickerlDefects>div{
  display:grid;
  grid-template-columns:130px 1fr;
  gap:9px;
  padding:8px 0;
  border-bottom:1px solid var(--line);
  font-size:11px
}
.pickerlPublicSeverity{
  font-weight:900;
  font-size:9px;
  text-transform:uppercase
}
.pickerlPublicSeverity.clean{color:var(--green)}
.pickerlPublicSeverity.light{color:#ffcc69}
.pickerlPublicSeverity.heavy{color:#ff9253}
.pickerlPublicSeverity.danger{color:#ff7b7b}
.pickerlPublicSeverity.note,.pickerlPublicSeverity.unclear{color:var(--muted)}

@media(max-width:800px){
  .pickerlSummary{grid-template-columns:repeat(3,1fr)}
  .pickerlDefectRow{
    grid-template-columns:28px 1fr;
  }
  .pickerlDefectRow .pickerlPosition,
  .pickerlDefectRow .pickerlText,
  .pickerlDefectRow .pickerlCode{
    grid-column:2
  }
  .pickerlCode{text-align:left}
}

.docActions{
  display:flex;
  justify-content:flex-end;
  gap:7px;
  flex-wrap:wrap
}

.inspectionAccordion{
  border-bottom:1px solid var(--line);
  background:transparent
}
.inspectionAccordion:last-child{border-bottom:0}

.inspectionAccordion>summary{
  list-style:none;
  cursor:pointer;
  display:grid;
  grid-template-columns:150px minmax(200px,1fr) auto;
  gap:16px;
  align-items:center;
  padding:16px 4px;
  user-select:none
}
.inspectionAccordion>summary::-webkit-details-marker{display:none}
.inspectionAccordion>summary:hover{
  background:rgba(255,255,255,.015)
}

.inspectionSummaryDate,
.inspectionSummaryMain{
  display:grid;
  gap:4px
}
.inspectionSummaryDate strong{font-size:13px}
.inspectionSummaryDate span,
.inspectionSummaryMain span{font-size:11px}

.inspectionSummaryBadges{
  display:flex;
  gap:6px;
  align-items:center;
  flex-wrap:wrap;
  justify-content:flex-end
}
.inspectionChevron{
  width:28px;height:28px;
  border:1px solid var(--line);
  border-radius:50%;
  display:grid;
  place-items:center;
  transition:transform .18s ease;
  color:var(--muted)
}
.inspectionAccordion[open] .inspectionChevron{
  transform:rotate(180deg)
}

.inspectionAccordionBody{
  padding:0 4px 18px
}

.inspectionTopGrid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px
}
.inspectionDataCard{
  border:1px solid var(--line);
  border-radius:15px;
  background:#0a0f13;
  padding:13px
}
.inspectionDataCard>.eyebrow{margin-bottom:8px}

.inspectionDetailRow{
  display:grid;
  grid-template-columns:minmax(130px,1fr) minmax(120px,1fr);
  gap:12px;
  padding:7px 0;
  border-bottom:1px solid rgba(255,255,255,.045);
  font-size:11px
}
.inspectionDetailRow:last-child{border-bottom:0}
.inspectionDetailRow span{color:var(--muted)}
.inspectionDetailRow strong{text-align:right}

.inspectionCounts{
  display:flex;
  gap:7px;
  flex-wrap:wrap;
  margin:12px 0
}
.inspectionCount{
  border:1px solid var(--line);
  border-radius:999px;
  padding:6px 9px;
  font-size:10px;
  background:#0a0f13
}
.inspectionCount.clean{border-color:rgba(105,221,161,.28)}
.inspectionCount.light{border-color:rgba(255,204,105,.32)}
.inspectionCount.heavy{border-color:rgba(255,146,83,.4)}
.inspectionCount.danger{border-color:rgba(255,123,123,.5)}
.inspectionCount.note{border-color:rgba(150,165,180,.22)}

.inspectionDefectsSection{
  border:1px solid var(--line);
  border-radius:15px;
  overflow:hidden;
  background:#0a0f13
}
.inspectionSectionHead{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:end;
  padding:13px;
  border-bottom:1px solid var(--line)
}
.inspectionSectionHead h3{margin:3px 0 0}

.inspectionDefectList{display:grid}
.inspectionDefect{
  display:grid;
  grid-template-columns:32px minmax(0,1fr);
  gap:10px;
  padding:11px 13px;
  border-bottom:1px solid var(--line);
  border-left:3px solid transparent
}
.inspectionDefect:last-child{border-bottom:0}
.inspectionDefect.clean{border-left-color:var(--green)}
.inspectionDefect.light{border-left-color:#ffcc69}
.inspectionDefect.heavy{border-left-color:#ff9253}
.inspectionDefect.danger{border-left-color:#ff7b7b}
.inspectionDefect.note,
.inspectionDefect.unclear{border-left-color:#687584}

.inspectionDefectNo{
  width:26px;height:26px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:#151c23;
  font-size:10px;
  font-weight:900
}
.inspectionDefectHead{
  display:flex;
  gap:8px;
  align-items:center;
  justify-content:space-between;
  margin-bottom:4px
}
.inspectionDefectHead .muted{font-size:9px}
.inspectionDefect strong{
  font-size:11px;
  line-height:1.5
}

.inspectionActions{
  display:flex;
  gap:8px;
  justify-content:flex-end;
  flex-wrap:wrap;
  margin-top:12px
}

@media(max-width:760px){
  .inspectionAccordion>summary{
    grid-template-columns:1fr auto;
    gap:10px
  }
  .inspectionSummaryDate{grid-column:1}
  .inspectionSummaryMain{grid-column:1}
  .inspectionSummaryBadges{
    grid-column:2;
    grid-row:1 / span 2;
    align-self:center
  }
  .inspectionTopGrid{grid-template-columns:1fr}
  .inspectionDetailRow{
    grid-template-columns:1fr;
    gap:3px
  }
  .inspectionDetailRow strong{text-align:left}
}

/* OWNED model photo previews. Missing/failed images fall back to manufacturer logos. */
.vehiclePhoto{display:inline-grid;place-items:center;position:relative;flex:0 0 auto;overflow:hidden;background:var(--surface2);border:1px solid var(--line2);border-radius:13px}
.vehiclePhoto.sm{width:52px;height:48px}
.vehiclePhoto.lg{width:100%;height:100%;min-height:68px}
.vehiclePhoto>img{display:block;width:100%;height:100%;object-fit:cover}
.vehiclePhoto>img[hidden],.vehiclePhotoFallback[hidden]{display:none!important}
.vehiclePhotoFallback{display:grid;place-items:center;width:100%;height:100%}
.vehiclePhotoFallback .manufacturerLogo{max-width:100%;max-height:100%}
.vehicleSuggestion{display:flex;align-items:center;gap:10px;min-height:64px}
.vehicleSuggestion>span:last-child{display:grid;gap:3px;min-width:0}
.vehicleSuggestion small{display:block}
.vehicleDetailPhoto{width:100%;height:190px;border-radius:16px;overflow:hidden;border:1px solid var(--line2);margin-bottom:13px;background:var(--surface2)}
.vehicleDetailPhoto .vehiclePhoto.lg{width:100%;height:100%;border:0;border-radius:0}
.vehicleDetailPhoto .vehiclePhoto.lg>img{object-fit:contain;background:#0b1014}
.vehicleDetailPhoto .vehiclePhotoFallback .manufacturerLogo.lg{width:90px;height:90px}
#heroIcon:has(.vehiclePhoto){width:86px;height:72px;padding:0;border:0;background:transparent}
#heroIcon .vehiclePhoto{width:86px;height:72px}
#garageVehicleTitle .vehiclePhoto{width:52px;height:48px}
.assetRow .vehiclePhoto{width:58px;height:48px}
@media(max-width:600px){.vehicleDetailPhoto{height:160px}.assetRow .vehiclePhoto{width:50px;height:45px}}

.vehicleDetailPhoto{position:relative}
.vehicleDetailPhoto .vehiclePhotoCredit{position:absolute;left:8px;bottom:7px;z-index:2;font-size:10px;line-height:1.2;color:#fff;background:rgba(0,0,0,.78);border-radius:5px;padding:5px 7px;text-decoration:underline;text-underline-offset:2px;max-width:calc(100% - 16px)}

/* Private vehicle photo upload controls */
.vehiclePhotoControls{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:-2px 0 14px}
.vehiclePhotoControls [role="status"]{flex:1 1 190px;font-size:11px;line-height:1.45}
.vehicleDetailPhoto .vehiclePhoto.lg>img{object-fit:contain}
@media(max-width:580px){
  .vehiclePhotoControls .btn{flex:1 1 auto}
  .vehiclePhotoControls [role="status"]{flex-basis:100%}
}
