:root{
  --cobalt:#1B3987; --cobalt-2:#2B4694; --night:#122868; --lilac:#B9AEEA; --lilac-hi:#D6CFF7; --lilac-ink:#4B3FA0;
  --paper:#FFFFFF; --wash:#F3F4F9; --wash-2:#E9EBF4; --rule:#D8DCEA; --rule-hi:#B9C0D8;
  --ink:#151A30; --ink-2:#434A66; --ink-3:#717892;
  --go:#17714A; --go-bg:#E3F3EA; --warn:#8A5A00; --warn-bg:#FBF1D9; --stop:#A3262A; --stop-bg:#FBE6E6;
  --sans:'Aileron',-apple-system,'Helvetica Neue',Helvetica,Arial,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,Menlo,monospace;
  --nav:232px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.45 var(--sans);-webkit-font-smoothing:antialiased}
a{color:var(--cobalt);text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:2px}
:focus-visible{outline:2px solid var(--lilac-ink);outline-offset:2px}
h1,h2,h3{margin:0;font-weight:700;letter-spacing:-.022em;line-height:1.12;text-wrap:balance}
h1{font-size:30px}
h2{font-size:21px}
h3{font-size:16px;letter-spacing:-.01em}
p{margin:0}
code,kbd,.mono{font-family:var(--mono);font-size:.88em}
kbd{border:1px solid var(--rule-hi);border-bottom-width:2px;border-radius:3px;padding:0 5px;background:#fff;color:var(--ink-2)}
svg .tone{fill:var(--lilac-hi);fill-opacity:.45}

/* ── top band ───────────────────────────────────────── */
.band{background:var(--cobalt);color:#fff;position:sticky;top:0;z-index:40}
.band-in{display:flex;align-items:center;gap:22px;height:62px;padding:0 20px}
.brand{display:flex;align-items:center;gap:10px;color:#fff;flex:none;width:calc(var(--nav) - 20px)}
.brand:hover{text-decoration:none}
.brand svg{width:40px;height:auto;color:var(--lilac)}
.brand b{font-size:18px;letter-spacing:-.04em}
.brand span{font-size:18px;letter-spacing:-.04em;color:var(--lilac-hi);font-weight:400;margin-left:-4px}
.search{position:relative;flex:1;max-width:760px}
.search input{width:100%;height:40px;border:0;border-radius:3px;padding:0 44px 0 14px;font:16px var(--sans);color:var(--ink);background:#fff}
.search input::placeholder{color:var(--ink-3)}
.search input:focus{outline:2px solid var(--lilac);outline-offset:0}
.search kbd{position:absolute;right:10px;top:10px}
.band-links{display:flex;gap:18px;margin-left:auto;align-items:center;font-size:14px}
.band-links a{color:#fff}
.pad-link{display:flex;align-items:center;gap:8px;background:var(--lilac);color:#1A1636!important;font-weight:700;padding:8px 13px;border-radius:3px}
.pad-link:hover{background:var(--lilac-hi);text-decoration:none}
.pad-link i{font-style:normal;font-family:var(--mono);font-size:12px;background:#1A1636;color:#fff;border-radius:9px;padding:0 6px;min-width:18px;text-align:center}

/* search results drop */
.drop{position:absolute;left:0;right:0;top:44px;background:#fff;color:var(--ink);border:1px solid var(--rule-hi);border-radius:3px;box-shadow:0 14px 40px rgba(18,40,104,.22);max-height:70vh;overflow:auto;display:none}
.drop.on{display:block}
.drop a{display:grid;grid-template-columns:34px 1fr auto;gap:12px;align-items:center;padding:8px 12px;color:var(--ink);border-top:1px solid var(--wash-2)}
.drop a:first-child{border-top:0}
.drop a:hover,.drop a.hi{background:var(--wash);text-decoration:none}
.drop svg{width:34px;height:34px;color:var(--cobalt)}
.drop .t{font-weight:700;font-size:14px}
.drop .s{font-size:12.5px;color:var(--ink-3)}
.drop .r{font-size:13px;text-align:right;color:var(--ink-2)}
.drop .empty{padding:14px;color:var(--ink-2);font-size:14px}

/* ── the sourcing lens ─────────────────────────────── */
.lens{background:var(--night);color:#fff;border-bottom:1px solid #0c1c4c}
.lens-in{display:flex;align-items:center;gap:16px;min-height:40px;padding:5px 20px;flex-wrap:wrap}
.lens-label{font-size:13px;color:var(--lilac-hi)}
.seg{display:flex;border:1px solid rgba(255,255,255,.22);border-radius:3px;overflow:hidden}
.seg button{border:0;background:transparent;color:#fff;font:13px var(--sans);padding:5px 12px;cursor:pointer;border-left:1px solid rgba(255,255,255,.16)}
.seg button:first-child{border-left:0}
.seg button:hover{background:rgba(255,255,255,.08)}
.seg button[aria-pressed=true]{background:var(--lilac);color:#1A1636;font-weight:700}
.chk{display:flex;align-items:center;gap:7px;font-size:13px;cursor:pointer;user-select:none}
.chk input{accent-color:var(--lilac);width:15px;height:15px;margin:0}
.lens-note{margin-left:auto;font-size:12.5px;color:#AEB7DA}
.lens-note b{color:#fff;font-family:var(--mono);font-weight:500}

/* ── frame ──────────────────────────────────────────── */
.frame{display:grid;grid-template-columns:var(--nav) minmax(0,1fr);min-height:calc(100vh - 102px)}
.nav{border-right:1px solid var(--rule);background:var(--wash);padding:18px 0 40px;position:sticky;top:102px;height:calc(100vh - 102px);overflow:auto;font-size:13.5px}
.nav h3{font-size:13.5px;padding:12px 20px 4px}
.nav h3 a{color:var(--ink)}
.nav ul{list-style:none;margin:0;padding:0 0 6px}
.nav li a{display:flex;justify-content:space-between;gap:8px;padding:3px 20px 3px 28px;color:var(--ink-2)}
.nav li a:hover{background:var(--wash-2);color:var(--cobalt);text-decoration:none}
.nav li a[aria-current]{color:var(--cobalt);font-weight:700;box-shadow:inset 3px 0 0 var(--cobalt)}
.nav li a em{font-style:normal;color:var(--ink-3);font-family:var(--mono);font-size:11.5px}
.nav .sep{border-top:1px solid var(--rule);margin:14px 20px}
.nav .aux a{display:block;padding:3px 20px;color:var(--ink-2)}
main{padding:26px 34px 80px;min-width:0}
.crumbs{font-size:13px;color:var(--ink-3);margin-bottom:12px}
.crumbs a{color:var(--ink-2)}
.lede{color:var(--ink-2);font-size:16px;max-width:72ch;margin-top:8px}

/* ── home ───────────────────────────────────────────── */
.home-head{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:40px;align-items:end;padding-bottom:26px;border-bottom:1px solid var(--rule)}
.home-head h1{font-size:40px;letter-spacing:-.035em;max-width:20ch}
.stats{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--rule);border-radius:3px}
.stats div{padding:12px 14px;border-left:1px solid var(--rule)}
.stats div:first-child{border-left:0}
.stats b{display:block;font-size:22px;letter-spacing:-.03em}
.stats span{font-size:12.5px;color:var(--ink-3)}
.cat{padding:30px 0 6px}
.cat-h{display:flex;align-items:baseline;gap:18px;margin-bottom:14px}
.cat-h h2{flex:none;white-space:nowrap}
.cat-h p{color:var(--ink-3);font-size:14px}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(186px,1fr));border-top:1px solid var(--rule);border-left:1px solid var(--rule)}
.tile{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:14px 16px 16px;border-right:1px solid var(--rule);border-bottom:1px solid var(--rule);color:var(--ink);min-height:156px}
.tile:hover{background:var(--wash);text-decoration:none}
.tile:hover b{color:var(--cobalt);text-decoration:underline;text-underline-offset:2px}
.tile svg{width:64px;height:64px;color:var(--cobalt);margin-bottom:4px}
.tile b{font-size:14.5px;letter-spacing:-.01em;line-height:1.2}
.tile span{font-size:12.5px;color:var(--ink-3)}
.agent-strip{margin-top:44px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:34px;background:var(--cobalt);color:#fff;border-radius:3px;padding:28px 30px}
.agent-strip h2{font-size:24px}
.agent-strip p{color:#C6CCE8;margin-top:10px;max-width:52ch}
.agent-strip a{color:var(--lilac-hi)}
pre{margin:0;background:#0f1d4d;color:#E6E8F5;border-radius:3px;padding:14px 16px;overflow:auto;font:12.5px/1.6 var(--mono)}
pre .c{color:#8E98C2}
pre .k{color:var(--lilac)}

/* ── category tables ────────────────────────────────── */
.sub{padding-top:34px;scroll-margin-top:110px}
.sub-h{display:grid;grid-template-columns:72px minmax(0,1fr);gap:16px;align-items:center;margin-bottom:12px}
.sub-h svg{width:72px;height:72px;color:var(--cobalt)}
.sub-h p{color:var(--ink-2);font-size:14px;margin-top:4px;max-width:80ch}
.tbl-wrap{overflow-x:auto;border:1px solid var(--rule);border-radius:3px}
table.parts{border-collapse:collapse;width:100%;font-size:13.5px;font-variant-numeric:tabular-nums}
.parts th{position:sticky;top:0;background:var(--wash-2);text-align:left;font-weight:700;font-size:12.5px;color:var(--ink-2);padding:8px 10px;border-bottom:1px solid var(--rule-hi);white-space:nowrap;cursor:pointer;user-select:none}
.parts th:hover{color:var(--cobalt)}
.parts th[aria-sort]::after{content:'';display:inline-block;margin-left:5px;border:4px solid transparent;vertical-align:1px}
.parts th[aria-sort=ascending]::after{border-bottom-color:currentColor;vertical-align:3px}
.parts th[aria-sort=descending]::after{border-top-color:currentColor;vertical-align:-1px}
.parts td{padding:8px 10px;border-top:1px solid var(--wash-2);vertical-align:top}
.parts tbody tr:nth-child(even){background:#FAFBFD}
.parts tbody tr:hover{background:#EEF0FA}
.parts tr.hide{display:none}
.parts .nm{min-width:230px}
.parts td{max-width:190px}
.parts .nm{max-width:300px}
.parts .nm a{font-weight:700;color:var(--ink)}
.parts .nm a:hover{color:var(--cobalt)}
.parts .nm small{display:block;color:var(--ink-3);font-size:12px}
.parts .num{text-align:right;white-space:nowrap}
.parts th.num{text-align:right}
.sub-h h2 .cnt{font-size:14px;font-weight:400;color:var(--ink-3);margin-left:8px;letter-spacing:0}
.parts .pr{text-align:right;white-space:nowrap;font-weight:700}
.parts .pr small{display:block;font-weight:400;color:var(--ink-3);font-size:11.5px}
.parts .act{text-align:right;width:1%}
.parts .unk{color:var(--ink-3)}
.none-row{display:none;padding:16px;color:var(--ink-2);font-size:14px;background:var(--wash)}
.none-row.on{display:block}

/* chips */
.cc{display:inline-flex;align-items:center;gap:4px;font:500 11.5px var(--mono);padding:1px 6px;border-radius:2px;border:1px solid var(--rule-hi);color:var(--ink-2);background:#fff;white-space:nowrap}
.cc.hq{border-style:dashed}
.cc.cn{border-color:#E3B9B9;color:#8A2C2C;background:#FFF7F7}
.cc.us{border-color:#B6C2E6;color:var(--cobalt);background:#F4F6FD}
.tag{display:inline-block;font-size:11.5px;font-weight:700;padding:1px 6px;border-radius:2px;white-space:nowrap}
.tag.go{background:var(--go-bg);color:var(--go)}
.tag.stop{background:var(--stop-bg);color:var(--stop)}
.tag.unk{background:var(--wash-2);color:var(--ink-3);font-weight:400}
.conf{font:500 11px var(--mono);letter-spacing:.02em}
.conf.VERIFIED{color:var(--go)}.conf.REPORTED{color:var(--warn)}.conf.UNVERIFIED{color:var(--stop)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--cobalt);background:var(--cobalt);color:#fff;font:700 13.5px var(--sans);padding:8px 14px;border-radius:3px;cursor:pointer;white-space:nowrap}
.btn:hover{background:var(--cobalt-2);text-decoration:none}
.btn.ghost{background:#fff;color:var(--cobalt)}
.btn.ghost:hover{background:var(--wash)}
.btn.lilac{background:var(--lilac);border-color:var(--lilac);color:#1A1636}
.btn.lilac:hover{background:var(--lilac-hi)}
.btn.sm{padding:4px 9px;font-size:12.5px}
.btn.done{background:var(--go);border-color:var(--go);color:#fff}

/* ── part page ──────────────────────────────────────── */
.pp{display:grid;grid-template-columns:320px minmax(0,1fr) 300px;gap:30px;align-items:start}
.art{border:1px solid var(--rule);border-radius:3px;background:linear-gradient(var(--wash),#fff);padding:30px;display:grid;place-items:center}
.art svg{width:100%;max-width:240px;height:auto;color:var(--cobalt)}
.dl{margin-top:12px;border:1px solid var(--rule);border-radius:3px}
.dl a,.dl span{display:flex;justify-content:space-between;padding:9px 12px;border-top:1px solid var(--wash-2);font-size:13.5px}
.dl a:first-child,.dl span:first-child{border-top:0}
.dl span{color:var(--ink-3)}
.pp h1{font-size:28px}
.mpn{font-family:var(--mono);font-size:13px;color:var(--ink-2);margin-top:8px;overflow-wrap:anywhere}
.facts{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;align-items:center}
.pp .summary{font-size:16px;color:var(--ink-2);margin-top:14px;max-width:62ch}
.buy{border:1px solid var(--rule-hi);border-radius:3px;padding:16px;position:sticky;top:120px}
.ladder{width:100%;border-collapse:collapse;font-size:13.5px;font-variant-numeric:tabular-nums;margin-bottom:12px}
.ladder th{font-size:12px;color:var(--ink-3);font-weight:400;text-align:left;padding:4px 0}
.ladder td{padding:5px 0;border-top:1px solid var(--wash-2)}
.ladder td:last-child,.ladder th:last-child{text-align:right}
.ladder td.at{font-size:12px;color:var(--ink-3);padding-left:8px}
.ladder td.at a{color:var(--ink-3)}
.ladder td b{font-size:15px}
.buy .noprice{font-size:14px;color:var(--ink-2);margin-bottom:12px}
.buy .noprice b{display:block;color:var(--ink);font-size:17px;margin-bottom:4px}
.qty{display:flex;gap:8px;margin-bottom:8px}
.qty input{width:90px;border:1px solid var(--rule-hi);border-radius:3px;padding:7px 9px;font:14px var(--sans)}
.qty .btn{flex:1}
.buy .btn.ghost{width:100%;margin-top:6px}
.buy small{display:block;color:var(--ink-3);font-size:12px;margin-top:10px}
.section{margin-top:34px}
.section > h2{font-size:18px;padding-bottom:8px;border-bottom:1px solid var(--rule);margin-bottom:12px}
.kv{width:100%;border-collapse:collapse;font-size:14px}
.kv th{text-align:left;font-weight:400;color:var(--ink-2);width:38%;padding:7px 12px 7px 0;border-bottom:1px solid var(--wash-2);vertical-align:top}
.kv td{padding:7px 0;border-bottom:1px solid var(--wash-2);font-weight:700}
.kv td a{font-weight:400}
.calc{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:14px}
.calc label{font-size:12.5px;color:var(--ink-2);display:grid;gap:4px}
.calc input,.calc select{border:1px solid var(--rule-hi);border-radius:3px;padding:7px 9px;font:14px var(--sans);background:#fff;width:100%}
.lc{width:100%;border-collapse:collapse;font-size:14px;font-variant-numeric:tabular-nums}
.lc td{padding:6px 0;border-bottom:1px solid var(--wash-2)}
.lc td:last-child{text-align:right}
.lc .tot td{border-top:2px solid var(--ink);border-bottom:0;font-weight:700;font-size:16px;padding-top:9px}
.lc small{color:var(--ink-3)}
.lc tr.maybe td{color:var(--warn);background:var(--warn-bg)}
.lc tr.maybe td:first-child{padding-left:8px}
.fine{font-size:12.5px;color:var(--ink-3);margin-top:8px;max-width:80ch}
.rel{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:0;border-top:1px solid var(--rule);border-left:1px solid var(--rule)}
.rel a{display:grid;grid-template-columns:44px 1fr;gap:10px;align-items:center;padding:10px 12px;border-right:1px solid var(--rule);border-bottom:1px solid var(--rule);color:var(--ink)}
.rel a:hover{background:var(--wash);text-decoration:none}
.rel svg{width:44px;height:44px;color:var(--cobalt)}
.rel b{font-size:13.5px;display:block}
.rel span{font-size:12px;color:var(--ink-3)}
.maker{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--rule);border-radius:3px}
.maker div{padding:12px 14px;border-left:1px solid var(--rule)}
.maker div:first-child{border-left:0}
.maker span{display:block;font-size:12px;color:var(--ink-3)}
.maker b{font-size:15px}
.custom{margin-top:12px;display:flex;gap:18px;align-items:center;justify-content:space-between;background:var(--wash);border-left:3px solid var(--lilac-ink);padding:14px 16px}
.custom p{font-size:14px;color:var(--ink-2);max-width:70ch}
.src{list-style:none;padding:0;margin:0;font-size:13.5px}
.src li{padding:6px 0;border-bottom:1px solid var(--wash-2);display:flex;gap:12px;justify-content:space-between}
.src li a{overflow-wrap:anywhere}
.src li span{color:var(--ink-3);flex:none}

/* ── JSON drawer (press J) ──────────────────────────── */
.jd{position:fixed;top:0;right:0;bottom:0;width:min(560px,92vw);background:#0f1d4d;color:#E6E8F5;z-index:60;transform:translateX(100%);transition:transform .22s cubic-bezier(.25,.46,.45,.94);display:flex;flex-direction:column;visibility:hidden}
.jd.on{transform:none;visibility:visible;box-shadow:-20px 0 60px rgba(10,20,60,.35)}
.jd header{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid rgba(255,255,255,.12);gap:12px}
.jd header b{font-size:14px}
.jd header a{color:var(--lilac-hi);font:12.5px var(--mono)}
.jd header button{background:none;border:1px solid rgba(255,255,255,.25);color:#fff;border-radius:3px;padding:3px 9px;cursor:pointer;font:12px var(--sans)}
.jd pre{flex:1;border-radius:0;background:transparent;padding:16px 18px}
.jhint{position:fixed;right:16px;bottom:16px;z-index:30;background:#fff;border:1px solid var(--rule-hi);border-radius:3px;padding:6px 10px;font-size:12.5px;color:var(--ink-2);box-shadow:0 6px 20px rgba(18,40,104,.12);cursor:pointer}
.jhint:hover{color:var(--cobalt)}

/* duty by origin strip */
.origins{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:6px;margin:4px 0 14px;max-width:720px}
.og{display:grid;justify-items:center;gap:4px;padding:8px 4px;border:1px solid var(--rule);border-radius:3px;font-variant-numeric:tabular-nums;position:relative}
.og{cursor:pointer}.og:hover{background:var(--wash)}
.og.cur{border-color:var(--cobalt);box-shadow:inset 0 0 0 1px var(--cobalt)}
.og-c{font:500 11.5px var(--mono);color:var(--ink-2)}
.og-bar{height:54px;width:14px;background:var(--wash-2);border-radius:2px;display:flex;align-items:flex-end;overflow:hidden}
.og-bar i{display:block;width:100%;background:var(--cobalt)}
.og b{font-size:13px}
.og em{position:absolute;top:4px;right:5px;font:normal 10px var(--mono);color:var(--warn)}
@media (max-width:640px){.origins{grid-template-columns:repeat(5,minmax(0,1fr))}}

/* compare */
.parts .ck{width:1%;padding-right:0}
.parts .ck input{accent-color:var(--cobalt);width:15px;height:15px;margin:2px 0 0}
.cmpbar{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:35;display:flex;gap:10px;align-items:center;background:var(--ink);color:#fff;padding:8px 10px 8px 16px;border-radius:3px;box-shadow:0 10px 30px rgba(18,40,104,.3);font-size:13.5px}
.cmpbar[hidden]{display:none}
.cmpbar .ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.35)}
.cmpt{border-collapse:collapse;font-size:14px;min-width:100%}
.cmpt th,.cmpt td{padding:9px 12px;border-bottom:1px solid var(--wash-2);text-align:left;vertical-align:top;min-width:180px}
.cmpt thead th{background:var(--wash-2);font-size:14px}
.cmpt thead th small{display:block;font-weight:400;color:var(--ink-3)}
.cmpt tbody th{font-weight:400;color:var(--ink-2);min-width:160px;position:sticky;left:0;background:#fff}
.cmpt td.diff{background:#F6F4FE}

/* ── order pad ──────────────────────────────────────── */
.padt{width:100%;border-collapse:collapse;font-size:14px;margin-top:18px}
.padt th{text-align:left;font-size:12.5px;color:var(--ink-2);background:var(--wash-2);padding:8px 10px}
.padt td{padding:10px;border-bottom:1px solid var(--wash-2);vertical-align:middle}
.padt input[type=number]{width:80px;border:1px solid var(--rule-hi);border-radius:3px;padding:6px 8px;font:14px var(--sans)}
.padt select{border:1px solid var(--rule-hi);border-radius:3px;padding:6px 8px;font:14px var(--sans);background:#fff}
.padt .x{background:none;border:0;color:var(--ink-3);cursor:pointer;font-size:18px}
.padt .x:hover{color:var(--stop)}
.pad-foot{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:30px;margin-top:22px}
.pad-foot textarea,.pad-foot input{width:100%;border:1px solid var(--rule-hi);border-radius:3px;padding:9px 10px;font:14px var(--sans)}
.pad-foot label{display:grid;gap:5px;font-size:13px;color:var(--ink-2);margin-bottom:12px}
.commit{background:var(--wash);border-left:3px solid var(--cobalt);padding:14px 16px;font-size:15px;font-weight:700;margin-bottom:14px}
.empty-pad{padding:40px 0;color:var(--ink-2);font-size:15px}

/* ── docs page ─────────────────────────────────────── */
.doc{max-width:860px}
.doc h2{margin-top:36px;margin-bottom:10px}
.doc p,.doc li{color:var(--ink-2);font-size:15px;max-width:72ch}
.doc p+p{margin-top:10px}
.doc pre{margin-top:12px}
.doc table{border-collapse:collapse;width:100%;font-size:14px;margin-top:12px}
.doc td,.doc th{border-bottom:1px solid var(--wash-2);padding:8px 10px 8px 0;text-align:left;vertical-align:top}
.doc th{font-size:12.5px;color:var(--ink-3);font-weight:400}

footer.foot{border-top:1px solid var(--rule);padding:20px 34px;font-size:12.5px;color:var(--ink-3);display:flex;gap:20px;flex-wrap:wrap;justify-content:space-between;margin-left:var(--nav)}

@media (max-width:1180px){
  .pp{grid-template-columns:260px minmax(0,1fr)}
  .buy{grid-column:1/-1;position:static}
}
@media (max-width:900px){
  .frame{grid-template-columns:minmax(0,1fr)}
  .nav{display:none}
  footer.foot{margin-left:0}
  .brand{width:auto}
  .brand span,.band-links .hide-s{display:none}
  .home-head{grid-template-columns:1fr}
  .pp{grid-template-columns:minmax(0,1fr)}
  .pp > *{min-width:0}
  .pp > :nth-child(1){order:3}.pp > :nth-child(2){order:1}.pp > :nth-child(3){order:2}
  .jhint{display:none}
  .art{padding:18px}.art svg{max-width:150px}
  .calc{grid-template-columns:repeat(2,minmax(0,1fr))}
  .maker{grid-template-columns:1fr}.maker div{border-left:0;border-top:1px solid var(--rule)}.maker div:first-child{border-top:0}
  .agent-strip,.pad-foot{grid-template-columns:1fr}
  .lens-note{display:none}
}
@media (max-width:640px){
  .cat-h{flex-direction:column;gap:4px}
  .cat-h h2{white-space:normal}
  .pad-link b{display:none}
  .search kbd{display:none}
  .search input{padding-right:12px;font-size:15px}
  .kv th{width:42%}
  .home-head h1{letter-spacing:-.03em}
  .band-in{gap:12px;padding:0 16px}
  main{padding:18px 16px 60px}
  .home-head h1{font-size:30px}
  .lens-in{padding:6px 16px;gap:10px}
  .seg button{padding:5px 8px}
  .custom{flex-direction:column;align-items:flex-start}
}

/* ── product photos ─────────────────────────────────── */
.parts .th{width:68px;padding:4px 6px 4px 4px}
.parts .th a{display:block;width:60px;height:60px;border-radius:3px;background:#fff}
.parts .th img{width:60px;height:60px;object-fit:contain;display:block}
.noimg{display:grid;place-items:center;width:100%;height:100%;color:var(--rule-hi)}
.noimg svg{width:70%;height:70%}
.tpic{display:grid;place-items:center;width:132px;height:132px;margin:0 auto 6px;align-self:center}
.tpic img{width:100%;height:100%;object-fit:contain}
.tpic svg{width:64px;height:64px;color:var(--cobalt)}
.tiles.big{margin:22px 0 8px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.tiles.big .tpic{width:156px;height:156px}
.sub-h .tpic{width:84px;height:84px;margin:0}
.sub-h{grid-template-columns:84px minmax(0,1fr)}
.sub-h h1 .cnt{font-size:15px;font-weight:400;color:var(--ink-3);margin-left:10px;letter-spacing:0}
.sub-h h2 a{color:inherit}
.art.photo{background:#fff;padding:14px}
.art{margin:0}
.art img{width:100%;height:auto;aspect-ratio:1;object-fit:contain;display:block}
.art figcaption{font-size:11.5px;color:var(--ink-3);margin-top:8px;text-align:center;line-height:1.35}
.art figcaption a{color:var(--ink-3);text-decoration:underline;text-underline-offset:2px}
.art .noimg{aspect-ratio:1;color:var(--cobalt)}
.drop img{width:34px;height:34px;object-fit:contain;display:block}

/* ── spec filters ───────────────────────────────────── */
.facets{border-right:1px solid var(--rule);background:var(--wash);padding:14px 0 40px;position:sticky;top:102px;height:calc(100vh - 102px);overflow:auto;font-size:13px}
.fback{display:block;padding:2px 18px 8px;font-size:12.5px;color:var(--ink-2)}
.fback::before{content:'‹ '}
.fhead{display:flex;justify-content:space-between;align-items:baseline;gap:8px;padding:0 18px 6px}
.fhead b{font-size:14.5px}
.fhead .linkish{white-space:nowrap}
.fg{border:0;border-top:1px solid var(--rule);margin:0;padding:10px 18px 8px;min-width:0}
.fg legend{font-weight:700;font-size:12.5px;color:var(--ink);padding:0;float:left;width:100%;margin-bottom:4px}
.fg label{clear:both;display:grid;grid-template-columns:16px minmax(0,1fr) auto;gap:7px;align-items:start;padding:2px 0;color:var(--ink-2);cursor:pointer;line-height:1.3}
.fg label:hover span{color:var(--cobalt)}
.fg input{accent-color:var(--cobalt);margin:1px 0 0;width:14px;height:14px}
.fg em{font-style:normal;font-family:var(--mono);font-size:11px;color:var(--ink-3)}
.fg label.zero{opacity:.38}
.facets .sep{border-top:1px solid var(--rule);margin:10px 18px}
.facets .aux a{display:block;padding:2px 18px;color:var(--ink-2)}
.linkish{border:0;background:none;padding:0;font:inherit;font-size:12.5px;color:var(--cobalt);cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 10px}
.chips:empty{display:none}
.chip{border:1px solid var(--rule-hi);background:#fff;border-radius:14px;padding:3px 8px 3px 11px;font:12.5px var(--sans);color:var(--ink);cursor:pointer}
.chip span{color:var(--ink-3)}
.chip i{font-style:normal;color:var(--ink-3);margin-left:3px}
.chip:hover{border-color:var(--cobalt)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.ftoggle{display:none}
.none-row .linkish{font-size:inherit}
@media (max-width:1180px){.pp{grid-template-columns:340px minmax(0,1fr)}}
@media (max-width:900px){
  .facets{position:static;height:auto;border-right:0;border-bottom:1px solid var(--rule);padding:10px 0}
  .ftoggle{display:block;margin:4px 16px 0;border:1px solid var(--rule-hi);background:#fff;border-radius:3px;padding:7px 12px;font:600 13.5px var(--sans);color:var(--ink);width:calc(100% - 32px);text-align:left}
  .facets:not(.open) .fg,.facets:not(.open) .sep,.facets:not(.open) .aux,.facets:not(.open) .fhead{display:none}
  .facets.open .fg{display:block}
  .pp > :nth-child(1){order:1}.pp > :nth-child(2){order:2}.pp > :nth-child(3){order:3}
  .art.photo{max-width:420px;margin:0 auto}
  .tiles.big .tpic{width:120px;height:120px}
}
@media (max-width:640px){
  .parts .th{width:52px}.parts .th a,.parts .th img{width:46px;height:46px}
  .tiles.big{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tpic,.tiles.big .tpic{width:100px;height:100px}
}


/* ── McMaster-style sizing (Oct 30 2026): small pictures, dense index ── */
.tpic{width:64px;height:64px;margin:0}
.tpic svg{width:44px;height:44px}
.cat{margin-top:26px}
.cat-t{font-size:19px;letter-spacing:-.01em;border-bottom:2px solid var(--cobalt);padding-bottom:5px;margin:0 0 10px}
.cat-t a{color:var(--ink)}
.mtiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(98px,1fr));gap:4px 6px}
.mt{display:flex;flex-direction:column;align-items:center;gap:4px;padding:6px 4px 8px;color:var(--ink-2);font-size:12px;line-height:1.25;text-align:center;border-radius:3px}
.mt:hover{background:var(--wash);text-decoration:none}
.mt:hover span{color:var(--cobalt);text-decoration:underline;text-underline-offset:2px}
.mt .tpic{width:64px;height:64px}
.pg-t{font-size:26px}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:10px;margin-top:20px}
.card{display:grid;grid-template-columns:96px minmax(0,1fr);gap:14px;align-items:start;border:1px solid var(--rule);border-radius:3px;padding:14px;color:var(--ink);min-height:132px}
.card:hover{background:var(--wash);border-color:var(--rule-hi);text-decoration:none}
.card:hover b{color:var(--cobalt);text-decoration:underline;text-underline-offset:2px}
.card .tpic{width:96px;height:96px}
.card b{display:block;font-size:15px;line-height:1.25}
.card p{font-size:13px;color:var(--ink-2);margin:4px 0 8px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.card span{font-size:12px;color:var(--ink-3)}
.sub-h{grid-template-columns:64px minmax(0,1fr)}
.sub-h .tpic{width:64px;height:64px}
.parts .th{width:52px;padding:4px}
.parts .th a,.parts .th img{width:44px;height:44px}
.pp{grid-template-columns:280px minmax(0,1fr) 300px}
.art,.art.photo{max-width:280px;padding:10px}
.art img{max-width:100%;max-height:260px}
img{max-width:100%}
.home-head{padding-bottom:14px;gap:24px}
.home-head h1{font-size:26px;line-height:1.15;letter-spacing:-.02em}
.home-head .lede{font-size:14.5px;margin-top:6px}
.stats div{padding:8px 12px}
.stats b{font-size:20px}
@media (max-width:1180px){.pp{grid-template-columns:240px minmax(0,1fr)}.art,.art.photo{max-width:240px}}
@media (max-width:900px){.art,.art.photo{max-width:220px;margin:0 auto}}
@media (max-width:640px){.mtiles{grid-template-columns:repeat(3,minmax(0,1fr))}.cards{grid-template-columns:1fr}.card{grid-template-columns:72px minmax(0,1fr)}.card .tpic{width:72px;height:72px}}

@media (prefers-reduced-motion:reduce){*{transition:none!important}}