/* WrenchReady "Mobile Garage" (concept C) layer — loaded after style.css.
   Inter (self-hosted, OFL), sky accent #0EA5E9 / hover #0284C7, amber only for safety. */
@font-face{font-family:Inter;src:url(/assets/fonts/inter-var.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
:root{--font:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;--bg:#F4F5F7;--border:#E5E7EB;--acc:#0EA5E9;--acc-hover:#0284C7;--acc-ink:#082F49;--mut:#6B7280;--radius:16px;--shadow:0 1px 2px #1118270a;--pro:#F3F4F6;--pro-border:#9CA3AF}
body{font-family:var(--font);font-size:16px;line-height:1.6;background:var(--bg)}
h1,h2,h3{letter-spacing:-.02em}
/* Buttons: dark ink on sky (7:1), white on hover blue — never white on white */
button,.btn{background:var(--acc);color:var(--acc-ink);border-radius:12px;font-weight:700}
button:hover,.btn:hover{background:var(--acc-hover);color:#fff}
.btn-ghost{background:#fff;color:var(--ink);border:1.5px solid var(--border)}
.btn-ghost:hover{background:#F0F9FF;color:var(--acc-ink);border-color:var(--acc)}
.linkbtn{background:none;color:var(--acc-hover);min-height:0;padding:0;font-weight:600;text-decoration:underline}
.linkbtn:hover{background:none;color:var(--acc-ink)}
a{color:#0369A1}
/* Light header */
header.site{background:#fff;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:60}
header.site a,.navbtn,.gpanel-open{color:var(--ink)}
.brand{color:var(--ink)!important}
.navbtn{border-color:var(--border);color:var(--ink)}
header.site nav{background:#fff;border-bottom:1px solid var(--border)}
header.site nav a,.gpanel-open{border-top-color:var(--border)}
header.site nav a:hover,header.site nav a[aria-current]{color:var(--acc-hover)}
header.site nav a.nav-cta{background:var(--acc);color:var(--acc-ink)}
header.site nav a.nav-cta:hover{background:var(--acc-hover);color:#fff}
.vpick-hdr select{border-color:var(--border);border-radius:10px;background:#F9FAFB}
.vpick-hdr span{color:var(--mut)}
footer.site{background:#fff;color:#374151;border-top:1px solid var(--border)}
footer.site a{color:#0369A1}
.newsletter{background:#fff;color:var(--ink)}
.tag{background:#F3F4F6;color:#374151}
.card{border-radius:16px;border-color:transparent;box-shadow:var(--shadow)}
.card:hover{border-color:#BAE6FD}
/* Safety stays amber; "call a pro" neutral */
.pro{background:#F3F4F6;border:1px solid var(--border);border-left:6px solid #9CA3AF;color:#374151}
/* Tab bar (phones) */
.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:80;display:flex;justify-content:space-around;align-items:flex-end;background:rgba(255,255,255,.96);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:1px solid var(--border);padding:6px 4px calc(6px + env(safe-area-inset-bottom))}
.tabbar a{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;min-height:48px;justify-content:flex-end;font-size:11px;font-weight:600;color:#6B7280;text-decoration:none}
.tabbar a.on{color:var(--acc-hover)}
.tabbar a:hover{color:var(--acc-hover)}
.tabbar .fab{width:52px;height:52px;border-radius:16px;background:var(--acc);color:var(--acc-ink);display:grid;place-items:center;margin-top:-24px;box-shadow:0 6px 16px rgba(2,132,199,.35)}
.tabbar .tab-ask{color:var(--ink)}
.tabbar .tab-ask:hover .fab{background:var(--acc-hover);color:#fff}
body{padding-bottom:calc(76px + env(safe-area-inset-bottom))}
.wr-hb-fab{display:none!important}
.wr-hb{bottom:calc(76px + env(safe-area-inset-bottom))}
.wr-hb-panel{bottom:0}
.wr-hb-head{background:#fff;color:var(--ink);border-bottom:1px solid var(--border)}
.wr-hb-close{color:var(--ink);background:transparent}
.wr-hb-close:hover{background:#F3F4F6;color:var(--ink)}
@media(min-width:900px){
 .tabbar{display:none}
 body{padding-bottom:calc(56px + 1.5rem)}
 .wr-hb-fab{display:inline-flex!important;background:var(--acc);color:var(--acc-ink)}
 .wr-hb-fab:hover{background:var(--acc-hover);color:#fff}
 .wr-hb{bottom:max(.75rem,env(safe-area-inset-bottom))}
 .wr-hb-panel{bottom:calc(56px + .55rem)}
}
@media print{.tabbar{display:none!important}}
/* ---------- Home ---------- */
.home-cols{margin-top:.25rem}
.top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.top .hi{margin:0;font-size:13px;font-weight:600;color:var(--mut);text-transform:uppercase;letter-spacing:.06em}
.top h1{margin:.15rem 0 0;font-size:1.35rem;line-height:1.2;font-weight:800}
.av{flex:none;width:44px;height:44px;border-radius:99px;background:#fff;border:1px solid var(--border);display:grid;place-items:center;color:var(--ink)}
.car{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 1.1rem;margin:14px -1.1rem 0;padding:8px 1.1rem 8px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.car::-webkit-scrollbar{display:none}
.vh{scroll-snap-align:start;flex:0 0 84%;max-width:360px;border-radius:22px;padding:18px;color:#fff;position:relative;overflow:hidden;min-height:168px;display:flex;flex-direction:column;align-items:flex-start;text-align:left;text-decoration:none;border:0;font:inherit;cursor:pointer;background:linear-gradient(135deg,#0EA5E9,#0369A1)}
.vh:hover{color:#fff}
.vh.tone-1{background:linear-gradient(135deg,#334155,#0F172A)}.vh.tone-2{background:linear-gradient(135deg,#0D9488,#115E59)}
.vh.tone-0:hover{background:linear-gradient(135deg,#0284C7,#075985)}
.vh:not(.on){opacity:.92}
.vh.on{box-shadow:0 0 0 3px #fff,0 0 0 5px var(--acc)}
.vh .y{font-size:12px;opacity:.9;font-weight:500}.vh .n{font-size:20px;font-weight:700;margin-top:2px;line-height:1.25;position:relative}.vh .e{font-size:13px;opacity:.9;position:relative;max-width:80%}
.vh .big{position:absolute;right:-10px;bottom:-14px;width:140px;height:140px;opacity:.18}
.vh-cta{margin-top:auto;padding-top:14px;font-size:12px;font-weight:700;opacity:.95}
.badge-on{position:absolute;top:14px;right:14px;font-size:11px;background:rgba(255,255,255,.25);padding:3px 9px;border-radius:99px;font-weight:700}
.vh-empty,.vh-add-card{background:#fff;color:var(--ink);border:2px dashed #BAE6FD}
.vh-empty:hover,.vh-add-card:hover{background:#F0F9FF;color:var(--ink)}
.vh-empty{flex-basis:100%;max-width:none}
.vh-empty .y{color:var(--mut)}.vh-add{margin-top:auto;padding-top:12px;font-weight:700;color:var(--acc-hover)}
.vh-add-card{flex:0 0 46%;max-width:200px;justify-content:center;align-items:center;text-align:center}
.vh-add-card .plus{font-size:32px;line-height:1;color:var(--acc-hover);font-weight:300}.vh-add-card .e{max-width:none;color:var(--mut)}
.dots{display:flex;gap:5px;justify-content:center;margin-top:4px;min-height:6px}.dots i{width:6px;height:6px;border-radius:9px;background:#CBD5E1}.dots i.on{width:18px;background:var(--acc)}
.seg{display:flex;background:#E5E7EB;border-radius:12px;padding:3px;margin:16px 0 12px}
.seg button{flex:1;min-height:40px;background:transparent;color:#4B5563;border-radius:9px;font-weight:600;font-size:14px;padding:6px}
.seg button:hover{background:#ffffff99;color:var(--ink)}
.seg button.on{background:#fff;color:var(--ink);box-shadow:0 1px 2px rgba(0,0,0,.08)}
.pane-note,.pane-empty{font-size:14px;color:var(--mut);margin:.25rem 0 .6rem}
.task{display:flex;gap:12px;align-items:center;background:#fff;border-radius:16px;padding:12px 14px;margin-bottom:10px;text-decoration:none;color:var(--ink);box-shadow:var(--shadow);border:1px solid transparent}
.task:hover{border-color:#BAE6FD;color:var(--ink)}
.task[hidden]{display:none}
.ti{flex:none;width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:#E0F2FE;color:#0369A1}
.ti .ico{width:22px;height:22px}
.t-chk .ti{background:#D1FAE5;color:#047857}.t-hard .ti{background:#EDE9FE;color:#6D28D9}.t-hist .ti{background:#F3F4F6;color:#374151}
.tx{min-width:0;display:flex;flex-direction:column}
.task .n{font-weight:600;line-height:1.3}.task .m{font-size:13px;color:var(--mut);margin-top:2px}
.task .go{margin-left:auto;flex:none;color:#9CA3AF;width:20px;height:20px}
.row-h{font-size:1.05rem;font-weight:700;margin:22px 0 10px;display:flex;align-items:baseline;gap:4px}
.row-h a{margin-left:auto;font-size:14px;font-weight:600;color:var(--acc-hover);text-decoration:none}
.vh-for{color:var(--mut);font-weight:600}
.hs{display:flex;gap:10px;overflow-x:auto;margin:0 -1.1rem;padding:0 1.1rem 8px;scroll-snap-type:x proximity;scrollbar-width:thin}
.vid{flex:0 0 220px;scroll-snap-align:start;background:#fff;border-radius:16px;overflow:hidden;text-decoration:none;color:var(--ink);display:flex;flex-direction:column;box-shadow:var(--shadow)}
.vid[hidden]{display:none}
.vid:hover{color:var(--ink);box-shadow:0 4px 14px #1118271a}
.th{position:relative;display:block;aspect-ratio:16/9;background:#1E293B;overflow:hidden}
.th img{width:100%;height:100%;object-fit:cover;display:block}
.th .pl{position:absolute;inset:0;display:grid;place-items:center;color:#fff}.th .pl svg{width:40px;height:40px;filter:drop-shadow(0 2px 4px #0008)}
.vid .vt{padding:10px 12px 2px;font-weight:600;font-size:14px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.vid .vs{padding:0 12px 10px;font-size:12px;color:var(--mut)}
.col-side .bigsearch{margin:14px 0 0}
.col-side .home-pick,.side-card{background:#fff;border-radius:16px;padding:16px;margin:14px 0;box-shadow:var(--shadow)}
.col-side .home-pick h2,.side-card h2{font-size:1.05rem;margin:0 0 .35rem}
.side-card p{margin:.2rem 0 .7rem;color:var(--mut);font-size:15px}
.pick-btns .picker-btn{background:#F9FAFB;color:var(--ink);border:1px solid var(--border)}
.pick-btns .picker-btn:hover{background:#F0F9FF;color:var(--acc-ink);border-color:var(--acc)}
@media(min-width:900px){
 .home-cols{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:28px;align-items:start}
 .col-side{position:sticky;top:76px}
 .col-side .bigsearch{margin-top:0}
 .top h1{font-size:1.6rem}
 .car{margin:14px 0 0;padding:4px 4px 8px}
 .vh{flex:0 0 300px}.vh-empty{flex-basis:100%}
 .hs{margin:0;padding:0 0 8px}
}
/* ---------- Guide: guided step view ---------- */
.gstep{max-width:46rem;margin:0 auto}
.gstep h1{margin:.2rem 0 .35rem;font-size:1.6rem;font-weight:800}
.g-sum{margin:0 0 .4rem;font-size:1.05rem;color:#374151}
.g-applies{display:flex;flex-wrap:wrap;gap:.35rem .5rem;align-items:center;margin:0 0 1rem;font-size:13px;color:var(--mut)}
.g-applies>span{background:#fff;border:1px solid var(--border);border-radius:99px;padding:2px 10px}
.g-applies .meta-print{min-height:28px;padding:2px 10px;font-size:13px;background:#fff;color:#374151;border:1px solid var(--border);border-radius:99px;font-weight:600}
.g-applies .meta-print:hover{background:#F0F9FF;color:var(--acc-ink)}
.g{background:#fff;border-radius:20px;padding:16px;box-shadow:var(--shadow)}
.g-top{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.g-top h2{margin:0;font-size:1.15rem}
.g-count{font-size:13px;color:var(--mut)}
.prog{height:6px;background:var(--border);border-radius:9px;margin:10px 0 14px;overflow:hidden}.prog i{display:block;height:100%;width:0;background:var(--acc);border-radius:9px;transition:width .2s}
.safety,.g .pro{display:block;border-radius:16px;padding:12px 14px;font-size:15px}
.safety{background:#FFFBEB;border:1px solid #FCD34D;color:#78350F}
.safety h3 .ti-svg,.g .pro h3 .ti-svg{width:20px;height:20px;vertical-align:-4px;margin-right:4px}.safety h3 .ti-svg{color:#B45309}
.safety h3,.g .pro h3{margin:0 0 .2rem;font-size:15px}
.safety ul,.g .pro ul{margin:0;padding-left:1.25rem}
.safety li,.g .pro li{margin:.15rem 0}
.g .pro{background:#F3F4F6;border:1px solid var(--border);color:#374151;margin-top:12px}

.gsteps{list-style:none;margin:8px 0 0;padding:0}
.gsteps .step{display:flex;gap:12px;padding:12px 0;border-top:1px solid var(--border);margin:0;align-items:flex-start}
.gsteps .step:first-child{border-top:0}
.gsteps .c{flex:none;width:32px;height:32px;min-height:32px;padding:0;border-radius:99px;border:2px solid #D1D5DB;background:#fff;color:#374151;font-weight:700;font-size:13px}
.gsteps .c:hover{border-color:var(--acc);background:#F0F9FF;color:var(--acc-ink)}
.gsteps .step.now .c{border-color:var(--acc);color:#0369A1}
.gsteps .step.done .c{background:#10B981;border-color:#10B981;color:#fff;font-size:0}
.gsteps .step.done .c::after{content:"✓";font-size:14px}
.gsteps .step.done .st{color:var(--mut)}
.gsteps .st{padding-top:3px}
.gstep .parts-card{margin-top:16px;border-radius:20px}
.g-more{margin-top:16px}
.g-acc{background:#fff;border-radius:16px;margin:10px 0;border:1px solid var(--border)}
.g-acc>summary{min-height:48px;display:flex;align-items:center;gap:.4rem;padding:.5rem 1rem;font-weight:600;cursor:pointer}
.g-acc-body{padding:0 1rem 1rem}
.g-acc .guide-vids h2{display:none}
.gstep .filed-under,.gstep .g-fine{color:var(--mut)}
@media print{.gsteps .c{border:1px solid #999}.g-acc{border:0}}
/* ---------- Videos page: light chrome ---------- */
body[data-page=videos]{background:var(--bg)}
@media(min-width:900px){body[data-page=home] .shell{grid-template-columns:minmax(0,1180px)}body[data-page=home] .gpanel{display:none!important}
 .col-side .pick-btns{grid-template-columns:1fr 1fr}}
.col-side .pick-btns{grid-template-columns:1fr 1fr}
.vfeed{background:#fff;border-radius:20px}
.vcard{color:var(--ink);border-bottom-color:var(--border)}
.vmeta{background:#fff}
.vlabel{color:#0369A1}
.vtitle{color:var(--ink)}
.vsum{color:#374151}
.vsafety{color:#78350F;background:#FFFBEB;border:1px solid #FCD34D;border-left:4px solid #F59E0B}
.vactions a{color:#0369A1}.vactions a:hover{color:var(--acc-hover)}
.vnav .btn-ghost{background:#fff;border-color:var(--border);color:var(--ink)}
.vnav .btn-ghost:hover{background:#F0F9FF;border-color:var(--acc);color:var(--acc-ink)}
@media(max-width:899px){body[data-page=videos]{padding-bottom:calc(76px + env(safe-area-inset-bottom))}.vfeed{height:calc(100svh - 7.5rem - 76px)}}
@media(min-width:900px){.car{padding:8px 6px}}
/* Per-vehicle matches */
.mg-match{background:#fff;border-radius:16px;padding:14px 16px;margin:12px 0 0;box-shadow:var(--shadow)}
.mg-match[hidden],.mg-match:empty{display:none}
.mm-h{font-size:1.05rem;margin:0 0 .4rem}
.mm-sec h3{font-size:13px;text-transform:uppercase;letter-spacing:.05em;color:var(--mut);margin:.7rem 0 .2rem}
.mm-list{list-style:none;margin:0;padding:0}
.mm-list li{padding:.4rem 0;border-top:1px solid var(--border);margin:0;line-height:1.35}
.mm-list li:first-child{border-top:0}
.mm-list a{font-weight:600;text-decoration:none}
.mm-list small{display:block;color:var(--mut)}
.mm-research{margin:.2rem 0;padding:.6rem .8rem;border-radius:12px;background:#F0F9FF;color:#0C4A6E;font-size:15px}

/* Lean home empty / active */
.home-empty .empty-card{background:#fff;border-radius:20px;padding:18px 16px;margin:12px 0;box-shadow:var(--shadow)}
.home-empty .empty-card h2{margin:0 0 .35rem;font-size:1.15rem}
.home-empty .empty-card p{margin:0 0 .85rem;color:var(--mut);font-size:15px}
.home-empty .empty-card .btn{display:inline-block;text-align:center;margin-top:.25rem}
.home-safe{margin-top:8px}
.home-active[hidden],.home-empty[hidden]{display:none!important}
.vh-for{font-weight:600;color:var(--mut)}
/* My jobs + job plan */
.jobrow{display:flex;align-items:center;gap:6px}.jobrow .task{flex:1;margin-bottom:10px}
.jobx{flex:none;min-width:40px;min-height:40px;border-radius:10px;background:#fff;border:1px solid #E5E7EB;color:#6B7280;margin-bottom:10px}
.jobs-empty{background:#fff;border-radius:16px;padding:14px;box-shadow:var(--shadow);margin-bottom:10px}
.jobs-empty p{margin:.2rem 0 .5rem}
.jchips{display:flex;flex-wrap:wrap;gap:8px;margin:.4rem 0}
.jchips .chip{min-height:40px;padding:6px 12px;border-radius:999px;background:#F0F9FF;border:1px solid #BAE6FD;color:#075985;font-weight:600;font-size:14px}
.jchips .chip.on{background:#0369A1;color:#fff;border-color:#0369A1}
.jobpick{background:#fff;border-radius:16px;padding:12px;box-shadow:var(--shadow);margin-bottom:12px}
.jobpick label{display:block;font-weight:600;margin-bottom:6px}.jobpick .jq{width:100%;min-height:44px;font-size:16px;padding:8px 10px;border:1px solid #D1D5DB;border-radius:10px;box-sizing:border-box}
.jlist{list-style:none;padding:0;margin:8px 0 0;max-height:320px;overflow:auto}.jlist li[hidden]{display:none}
.jadd{display:flex;flex-direction:column;align-items:flex-start;width:100%;text-align:left;background:#F9FAFB;border:1px solid #E5E7EB;border-radius:10px;padding:8px 10px;margin-bottom:6px;color:var(--ink);min-height:44px}
.jadd small{color:var(--mut);font-weight:400}
.jobs-h{margin:1.2rem 0 .4rem;font-size:1.05rem}
.job-app section{margin:1.2rem 0}.job-app h2{font-size:1.15rem;margin:.2rem 0 .5rem}
.jveh select{min-height:44px;font-size:16px;margin-left:6px;max-width:70vw}
.jsaved{color:#047857;font-weight:600}
.jp-over .badge{display:inline-block;background:#F3F4F6;border-radius:999px;padding:3px 10px;font-size:13px;font-weight:600;margin:0 4px 4px 0}
.job-app .callout{background:#F0F9FF;border:1px solid #BAE6FD;border-radius:12px;padding:10px 12px;margin:.6rem 0}
.job-app .callout-warn{background:#FFF7ED;border-color:#FDBA74}.jp-safe h3{font-size:1rem;margin:.6rem 0 .2rem}.jp-safe ul{padding-left:1.1rem;margin:.2rem 0}
.jp-eng{background:#fff;border-radius:16px;padding:12px;box-shadow:var(--shadow)}
.jp-part{background:#fff;border-radius:12px;padding:10px 12px;box-shadow:var(--shadow);margin-bottom:8px}.jp-part p{margin:.25rem 0}
.shopbtn{display:inline-block;padding:6px 10px;border-radius:8px;border:1px solid #D1D5DB;font-size:14px;margin:2px 4px 2px 0;text-decoration:none;min-height:32px}
.jp-tq{width:100%;border-collapse:collapse;background:#fff;border-radius:12px;overflow:hidden}.jp-tq th,.jp-tq td{text-align:left;padding:8px;border-bottom:1px solid #F3F4F6;vertical-align:top;font-size:14px}.jp-tq th{width:45%}
.pending{color:#B45309;font-weight:600}
.jp-got{background:#fff;border-radius:12px;padding:8px 12px;margin-bottom:8px;box-shadow:var(--shadow)}.jp-got summary{font-weight:600;cursor:pointer;min-height:32px}