/* GarageForge 7.1 — Performance Cockpit visual refresh */
:root{
  --radius:18px;
  --radius-sm:12px;
  --shadow:0 18px 50px rgba(0,0,0,.24);
  --shadow-soft:0 10px 28px rgba(0,0,0,.16);
  --glass:color-mix(in srgb,var(--panel) 88%,transparent);
  --glass-2:color-mix(in srgb,var(--panel2) 82%,transparent);
  --accent-soft:color-mix(in srgb,var(--accent) 14%,transparent);
  --accent-border:color-mix(in srgb,var(--accent) 42%,var(--border));
}
html{scroll-behavior:smooth;color-scheme:dark}
body[data-theme="white-red"]{color-scheme:light}
body{
  min-height:100vh;
  background:
    radial-gradient(900px 540px at 82% -10%,color-mix(in srgb,var(--accent) 18%,transparent),transparent 64%),
    radial-gradient(720px 520px at 35% 112%,color-mix(in srgb,var(--accent2) 10%,transparent),transparent 70%),
    linear-gradient(135deg,color-mix(in srgb,var(--bg) 96%,#000),var(--bg))!important;
  letter-spacing:.002em;
}
body:before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;opacity:.16;
  background-image:linear-gradient(135deg,rgba(255,255,255,.025) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.025) 50%,rgba(255,255,255,.025) 75%,transparent 75%);
  background-size:28px 28px;
  mask-image:linear-gradient(to bottom,#000,transparent 75%);
}
.shell{grid-template-columns:272px minmax(0,1fr)!important}
.shell>aside{
  background:linear-gradient(180deg,color-mix(in srgb,var(--bg) 95%,#000),color-mix(in srgb,var(--panel) 90%,#000))!important;
  border-right:1px solid color-mix(in srgb,var(--border) 78%,transparent)!important;
  box-shadow:14px 0 42px rgba(0,0,0,.17);
  padding:18px 14px 14px!important;
  grid-template-rows:auto auto minmax(0,1fr) auto!important;
}
.brand{padding:2px 8px 14px!important;gap:12px!important;position:relative}
.brand .mark{
  width:46px!important;height:46px!important;border-radius:14px!important;
  color:white!important;font-size:15px;letter-spacing:.04em;
  background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 90%,white 10%),color-mix(in srgb,var(--accent) 68%,#000))!important;
  border:1px solid color-mix(in srgb,var(--accent) 60%,white 8%);
  box-shadow:0 0 0 5px color-mix(in srgb,var(--accent) 7%,transparent),0 12px 28px color-mix(in srgb,var(--accent) 22%,transparent)!important;
}
.brand-copy{min-width:0}.brand b{font-size:16px;letter-spacing:-.02em}.brand small{font-size:10.5px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.brand-kicker{display:block;color:var(--accent);font-size:9px;font-weight:800;letter-spacing:.16em;margin-bottom:3px;text-transform:uppercase}
.nav-search{padding:0 6px 12px;position:relative}
.nav-search input{width:100%;height:38px;padding:8px 34px 8px 12px!important;border-radius:12px!important;background:color-mix(in srgb,var(--panel2) 78%,transparent)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.025)}
.nav-search input:focus{outline:none;border-color:var(--accent)!important;box-shadow:0 0 0 3px var(--accent-soft)!important}
.nav-search .search-key{position:absolute;right:15px;top:9px;border:1px solid var(--border);border-radius:6px;color:var(--muted);font-size:9px;padding:3px 5px;background:var(--panel)}
.shell>aside>nav{gap:3px!important;padding:1px 4px 12px 2px!important}
.nav-group-label{font-size:9px;font-weight:850;letter-spacing:.16em;text-transform:uppercase;color:color-mix(in srgb,var(--muted) 82%,transparent);padding:15px 10px 6px;user-select:none}
.nav-group-label:first-child{padding-top:5px}
.nav{
  min-height:39px;display:flex;align-items:center;gap:9px!important;padding:8px 10px!important;border-radius:11px!important;
  color:color-mix(in srgb,var(--text) 76%,var(--muted))!important;transition:background .16s,border-color .16s,color .16s,transform .16s,box-shadow .16s;
  position:relative;overflow:hidden;
}
.nav .nav-icon{width:24px;height:24px;display:grid;place-items:center;border-radius:8px;background:color-mix(in srgb,var(--panel2) 86%,transparent);border:1px solid color-mix(in srgb,var(--border) 78%,transparent);color:var(--muted);font-size:12px;font-weight:900;flex:0 0 auto;transition:.16s}
.nav:hover{transform:translateX(2px);background:color-mix(in srgb,var(--panel2) 78%,var(--accent) 5%)!important;border-color:color-mix(in srgb,var(--border) 72%,var(--accent) 18%)!important;color:var(--text)!important}
.nav.active{background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 18%,var(--panel2)),color-mix(in srgb,var(--panel2) 95%,transparent))!important;border-color:var(--accent-border)!important;color:var(--text)!important;box-shadow:inset 3px 0 0 var(--accent),0 7px 20px color-mix(in srgb,var(--accent) 9%,transparent)!important}
.nav.active .nav-icon{background:var(--accent)!important;border-color:var(--accent)!important;color:#fff!important;box-shadow:0 5px 16px color-mix(in srgb,var(--accent) 28%,transparent)}
.aside-foot{gap:8px!important}.aside-foot button{background:color-mix(in srgb,var(--panel2) 55%,transparent)!important;border-color:color-mix(in srgb,var(--border) 80%,transparent)!important;text-align:center!important;font-size:11px}
.aside-foot button:hover{border-color:var(--accent)!important;color:var(--text)!important}
main{background:transparent!important}
main>header{
  height:80px!important;padding:0 30px!important;background:color-mix(in srgb,var(--bg) 80%,transparent)!important;
  border-bottom:1px solid color-mix(in srgb,var(--border) 72%,transparent)!important;box-shadow:0 8px 24px rgba(0,0,0,.08);
}
main>header:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:linear-gradient(90deg,transparent,var(--accent),transparent);opacity:.22}
main>header span{font-size:9px!important;letter-spacing:.18em!important;color:var(--accent)!important;font-weight:850}
main>header strong{font-size:15px;letter-spacing:-.01em}
.head-actions{gap:9px!important}.head-actions select,.head-actions button{height:38px!important}
#themePicker,#vehiclePicker{border-radius:11px!important;background:color-mix(in srgb,var(--panel) 90%,transparent)!important}
#syncNow{position:relative;padding-left:27px!important}#syncNow:before{content:"";position:absolute;left:11px;top:50%;width:7px;height:7px;border-radius:50%;background:var(--good);box-shadow:0 0 0 4px color-mix(in srgb,var(--good) 12%,transparent);transform:translateY(-50%)}
.primary{border-radius:11px!important;min-height:38px;background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 92%,white 8%),color-mix(in srgb,var(--accent) 72%,#000))!important;color:#fff!important;box-shadow:0 8px 22px color-mix(in srgb,var(--accent) 22%,transparent)!important;transition:transform .15s,box-shadow .15s,filter .15s}
.primary:hover{transform:translateY(-1px);filter:brightness(1.08);box-shadow:0 11px 28px color-mix(in srgb,var(--accent) 30%,transparent)!important}.primary:active{transform:translateY(0)}
#content{max-width:1720px!important;padding:30px 32px 46px!important}
.page-head{align-items:center!important;margin-bottom:24px!important;padding-bottom:18px;border-bottom:1px solid color-mix(in srgb,var(--border) 66%,transparent);position:relative}
.page-head:after{content:"";position:absolute;bottom:-1px;left:0;width:78px;height:2px;border-radius:99px;background:linear-gradient(90deg,var(--accent),transparent)}
.page-head h1{font-size:30px!important;line-height:1.08;letter-spacing:-.035em!important;font-weight:850!important;margin-bottom:7px!important}.page-head p{font-size:13px;line-height:1.5;max-width:760px}
.cards,.grid2,.grid3,.grid4{gap:16px!important}
.card,.panel,dialog,.resultbox,.factory-option-card,.taxonomy-card,.workflow-step,.social-post7,.gauge7{
  background:linear-gradient(155deg,color-mix(in srgb,var(--panel) 96%,white 1.5%),color-mix(in srgb,var(--panel2) 72%,var(--panel)))!important;
  border:1px solid color-mix(in srgb,var(--border) 76%,transparent)!important;
  box-shadow:var(--shadow-soft)!important;
}
.card,.panel{border-radius:var(--radius)!important;padding:18px!important;position:relative}
.card:before,.panel:before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(135deg,rgba(255,255,255,.035),transparent 34%);opacity:.7}
.card{transition:transform .16s,border-color .16s,box-shadow .16s}.card:hover{transform:translateY(-2px);border-color:var(--accent-border)!important;box-shadow:var(--shadow)!important}
.metric{overflow:hidden}.metric:after{content:"";position:absolute;left:0;top:0;width:100%;height:2px;background:linear-gradient(90deg,var(--accent),transparent 70%);opacity:.8}
.metric .label{font-size:10px!important;font-weight:800;text-transform:uppercase;letter-spacing:.12em}.metric .value{font-size:29px!important;letter-spacing:-.045em;margin:8px 0 5px!important}.metric .sub{line-height:1.4}
.section-title{margin-bottom:14px!important}.section-title h2{font-size:16px!important;letter-spacing:-.015em}.section-title h2:before{content:"";display:inline-block;width:5px;height:15px;background:var(--accent);border-radius:99px;margin-right:8px;vertical-align:-2px;box-shadow:0 0 12px var(--accent-soft)}
.smallbtn,.ghost,button:not(.nav):not(.primary){border-radius:10px!important;transition:background .15s,border-color .15s,color .15s,transform .15s}.smallbtn:hover,.ghost:hover,button:not(.nav):not(.primary):hover{background:var(--accent-soft)!important;border-color:var(--accent-border)!important;color:var(--text)!important}.smallbtn:active,.ghost:active{transform:scale(.985)}
input,select,textarea{border-radius:11px!important;background:color-mix(in srgb,var(--panel2) 86%,transparent)!important;border-color:color-mix(in srgb,var(--border) 78%,transparent)!important;transition:border-color .15s,box-shadow .15s,background .15s}
input:focus,select:focus,textarea:focus{outline:none!important;border-color:var(--accent)!important;box-shadow:0 0 0 3px var(--accent-soft)!important;background:color-mix(in srgb,var(--panel2) 94%,transparent)!important}
.form{gap:14px!important}.form label{font-size:11px!important;font-weight:700;color:color-mix(in srgb,var(--text) 68%,var(--muted))!important;letter-spacing:.01em}.form label:focus-within{color:var(--accent)!important}
.tag,.pill{background:color-mix(in srgb,var(--panel2) 76%,transparent)!important;border-color:color-mix(in srgb,var(--border) 82%,transparent)!important}.tag{font-weight:700;letter-spacing:.01em}
.progress{height:9px!important;background:color-mix(in srgb,var(--bg) 70%,#000)!important;border:1px solid color-mix(in srgb,var(--border) 55%,transparent)}.progress i,.progress>span{background:linear-gradient(90deg,var(--accent),var(--accent2))!important;box-shadow:0 0 14px color-mix(in srgb,var(--accent) 30%,transparent)}
.stat{border-radius:12px!important;background:color-mix(in srgb,var(--panel2) 70%,transparent)!important;border-color:color-mix(in srgb,var(--border) 68%,transparent)!important;padding:13px!important}.stat small{font-weight:800;letter-spacing:.08em;text-transform:uppercase}.stat b{font-size:14px}
.list-item{padding:13px 4px!important;border-color:color-mix(in srgb,var(--border) 58%,transparent)!important;border-radius:9px;transition:background .14s,padding .14s}.list-item:hover{background:color-mix(in srgb,var(--accent) 4%,transparent);padding-left:8px!important;padding-right:8px!important}
.title{font-weight:780!important;letter-spacing:-.01em}.meta{font-size:11px!important;line-height:1.45}
.table-wrap,.tablewrap{border-radius:14px;overflow:auto}.table,.tablewrap table{border-collapse:separate!important;border-spacing:0!important}.table th,.tablewrap th{position:sticky;top:0;z-index:1;background:color-mix(in srgb,var(--panel) 96%,transparent)!important;backdrop-filter:blur(12px);font-size:9px!important;font-weight:850!important;letter-spacing:.11em!important}.table td,.table th,.tablewrap td,.tablewrap th{border-color:color-mix(in srgb,var(--border) 58%,transparent)!important}.table tbody tr,.tablewrap tbody tr{transition:background .14s}.table tbody tr:hover,.tablewrap tbody tr:hover{background:color-mix(in srgb,var(--accent) 5%,transparent)}
.tabs{background:transparent!important;gap:7px!important}.tab{border-radius:10px!important;background:color-mix(in srgb,var(--panel2) 78%,transparent)!important}.tab.active,.engGroup.active,.engTab.active{background:linear-gradient(135deg,var(--accent),color-mix(in srgb,var(--accent) 74%,#000))!important;border-color:var(--accent)!important;color:#fff!important;box-shadow:0 6px 18px color-mix(in srgb,var(--accent) 20%,transparent)}
.category-list{background:linear-gradient(180deg,color-mix(in srgb,var(--panel) 96%,transparent),color-mix(in srgb,var(--bg) 84%,transparent))!important}.category-list button.active{background:var(--accent-soft)!important;border-color:var(--accent-border)!important;box-shadow:inset 3px 0 0 var(--accent)}
dialog{border-radius:20px!important;padding:22px!important;box-shadow:0 28px 90px rgba(0,0,0,.5)!important}dialog::backdrop{background:rgba(0,0,0,.72)!important;backdrop-filter:blur(6px)}
#toast{background:color-mix(in srgb,var(--panel) 92%,var(--accent) 8%)!important;color:var(--text)!important;border:1px solid var(--accent-border);box-shadow:0 16px 48px rgba(0,0,0,.35);border-radius:12px!important}
.photo{border-radius:14px!important;box-shadow:0 10px 24px rgba(0,0,0,.18)}
.factory-check-row,.planner-check-item{border-radius:12px!important;background:color-mix(in srgb,var(--panel2) 76%,transparent)!important;transition:.15s}.factory-check-row:hover,.planner-check-item:hover{border-color:var(--accent-border)!important;background:color-mix(in srgb,var(--panel2) 84%,var(--accent) 4%)!important;transform:translateY(-1px)}
.gauge7{overflow:hidden}.gauge7:after{content:"";position:absolute;left:0;bottom:0;width:100%;height:3px;background:linear-gradient(90deg,var(--accent),transparent)}
.studio-canvas7,.telemetry-canvas7,.wiring-viewer,.blueprint-wrap{border-color:color-mix(in srgb,var(--border) 75%,transparent)!important;box-shadow:inset 0 0 34px rgba(0,0,0,.2),0 10px 30px rgba(0,0,0,.12)}
.empty{border:1px dashed color-mix(in srgb,var(--border) 72%,transparent);border-radius:12px;margin:4px 0;background:color-mix(in srgb,var(--panel2) 28%,transparent)}
.note,.warning{background:color-mix(in srgb,var(--accent) 7%,var(--panel2))!important;border-color:var(--accent-border)!important}
/* theme-specific ambient polish */
body[data-theme="black-red"]{--accent-soft:rgba(225,6,0,.12)}
body[data-theme="carbon-gold"] .brand .mark{color:#111!important}
body[data-theme="white-red"] body:before{opacity:.05}
body[data-theme="white-red"] .brand .mark{color:white!important}
body[data-theme="white-red"] .card:before,body[data-theme="white-red"] .panel:before{background:linear-gradient(135deg,rgba(255,255,255,.55),transparent 32%)}
body[data-theme="white-red"] .nav.active .nav-icon{color:#fff!important}
/* premium scrollbars */
*{scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--accent) 48%,var(--border)) transparent}
*::-webkit-scrollbar{width:9px;height:9px}*::-webkit-scrollbar-track{background:transparent}*::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--accent) 34%,var(--border));border:2px solid transparent;background-clip:padding-box;border-radius:999px}*::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--accent) 62%,var(--border));border:2px solid transparent;background-clip:padding-box}
@media(max-width:1100px){.shell{grid-template-columns:248px minmax(0,1fr)!important}#content{padding:24px!important}}
@media(max-width:780px){
  .shell{display:block!important}.shell>aside{display:block!important;padding:8px!important;box-shadow:none!important}.nav-search{display:none}.nav-group-label{display:none}.shell>aside>nav{display:flex!important;padding:4px!important;gap:6px!important}.nav{min-width:max-content!important}.nav .nav-icon{display:none}.brand{display:none!important}main>header{height:auto!important;min-height:70px;padding:10px 12px!important;gap:10px}.head-actions{justify-content:flex-end}.head-actions select{max-width:126px}#content{padding:18px 14px 34px!important}.page-head{align-items:flex-start!important}.page-head h1{font-size:25px!important}.card,.panel{padding:15px!important}
}

/* GarageForge 7.4 Visual Build / Verification / Shop Pro */
.verified-badge74{display:flex;flex-direction:column;gap:4px;padding:12px 14px;margin:8px 0;border:1px solid color-mix(in srgb,var(--accent,#60a5fa) 55%,transparent);border-radius:12px;background:linear-gradient(135deg,rgba(16,185,129,.13),rgba(15,23,42,.55));box-shadow:inset 0 0 24px rgba(16,185,129,.06)}
.verified-badge74 b,.verified-pill74{color:#bbf7d0}.verified-badge74 small{color:var(--muted,#94a3b8)}
.warn-row74 td{background:rgba(245,158,11,.08)}
.dvi-list74{display:grid;gap:8px;margin-top:12px}.dvi-row74{display:grid;grid-template-columns:1fr auto;gap:4px 12px;padding:10px 12px;border-radius:10px;border:1px solid var(--border,#273244)}.dvi-row74 small{grid-column:1/-1;color:var(--muted,#94a3b8)}.dvi-row74.green{border-left:4px solid #22c55e}.dvi-row74.yellow{border-left:4px solid #eab308}.dvi-row74.red{border-left:4px solid #ef4444}
#gf74Canvas{width:100%;height:auto;min-height:380px;border-radius:14px;background:#09111c;box-shadow:inset 0 0 0 1px rgba(148,163,184,.12)}