:root{font-family:Arial,Helvetica,sans-serif;color:#202020;background:#f6f6f3;--yellow:#ffdd00}*{box-sizing:border-box}body{margin:0}header{background:white;border-bottom:1px solid #e2e2dd;padding:22px max(24px,calc((100vw - 1120px)/2));display:flex;align-items:center;justify-content:space-between;gap:24px}header img{width:230px;max-width:50%}header span{font-size:13px;color:#666}main{max-width:1120px;margin:auto;padding:48px 24px}.intro{margin-bottom:30px}.eyebrow{font-size:12px;font-weight:700;letter-spacing:2px;color:#666}h1{font-size:48px;line-height:1.08;letter-spacing:-1.8px;margin:14px 0 18px}.intro>p:last-child{max-width:630px;color:#62625b;line-height:1.6}.search-panel{background:#fff;border:1px solid #ddd;border-radius:16px;padding:25px;box-shadow:0 5px 20px #00000004}label{display:block;font-weight:700;font-size:14px;margin-bottom:12px}.input-wrap{display:flex;border:2px solid #272727;border-radius:9px;overflow:hidden}.input-wrap:focus-within{outline:3px solid var(--yellow);outline-offset:3px}input{width:100%;min-width:0;border:0;padding:17px;font:inherit;font-size:17px;outline:0}button{font:inherit;cursor:pointer}.input-wrap button{border:0;background:white;color:#666;padding:0 18px}.filters{display:flex;gap:9px;margin-top:18px;flex-wrap:wrap}.filters button{border:1px solid #ddd;background:white;border-radius:25px;padding:10px 17px;font-size:14px}.filters button[aria-pressed=true]{background:#222;color:white;border-color:#222}button:focus-visible,summary:focus-visible{outline:3px solid #c9a900;outline-offset:3px}.results-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:30px 0 15px}h2{font-size:19px;margin:0}#status{font-size:13px;color:#666}#results{display:grid;gap:14px}.card{background:#fff;border:1px solid #deded9;border-radius:12px;padding:23px;display:grid;grid-template-columns:1fr 340px;gap:25px}.tag{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.4px;background:var(--yellow);padding:6px 9px;border-radius:4px}.tag.oem{background:#e9e9e5}h3{font-size:19px;line-height:1.4;margin:13px 0}.codes{display:flex;gap:8px 20px;flex-wrap:wrap;font-size:13px;color:#555}.codes span{display:block;margin:5px 0}.codes b{color:#222;display:block;font-weight:600;margin-top:4px;overflow-wrap:anywhere}.printer-box{border-left:1px solid #e6e6e0;padding-left:25px;font-size:13px;line-height:1.6}.printer-box strong{font-size:12px}.match{color:#245c39;background:#f0f7ee;border-radius:6px;padding:9px 12px;margin:0 0 10px;overflow-wrap:anywhere}.printer-box ul{padding-left:18px;margin:8px 0}.printer-box li{overflow-wrap:anywhere}summary{cursor:pointer;color:#555;font-weight:600}.empty{padding:35px;text-align:center;background:#fff;border:1px dashed #ccc;border-radius:12px;color:#666}.empty strong{display:block;color:#222;margin-bottom:10px}#more{display:block;margin:25px auto;background:#222;color:#fff;border:0;padding:13px 25px;border-radius:8px}#more[hidden]{display:none}footer{font-size:12px;color:#777;margin-top:40px;line-height:1.6}@media(max-width:700px){header{padding:18px 20px}header span{display:none}main{padding:30px 18px}h1{font-size:37px}.search-panel{padding:19px}.card{grid-template-columns:1fr;gap:18px;padding:20px}.printer-box{padding:16px 0 0;border-left:0;border-top:1px solid #eee}.results-heading{align-items:flex-start;flex-direction:column;gap:3px}input{font-size:15px;padding:15px}.input-wrap button{padding:0 10px}.filters button{padding:9px 12px}}
:root{--yellow:#F9E300;--black:#000000;--navy:#0A1F52;--cyan:#00C2C2;--slate:#5C677D;--aqua:#E1F0F4;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;color:var(--black);background:#F6F6F6}
header{background:var(--yellow);border-bottom:8px solid var(--black);padding-top:22px;padding-bottom:22px}
header img{width:290px;max-width:65%;height:auto}
header span{color:var(--black);font-weight:600;border-left:1px solid var(--black);padding-left:24px}
main{padding-top:40px}
.intro{background:var(--navy);color:white;margin:-40px -24px 28px;padding:36px 32px;border-bottom:7px solid var(--cyan)}
.eyebrow{color:var(--yellow);letter-spacing:1.4px}
h1,h2,h3{font-family:"Forma DJR Banner","Helvetica Neue",Helvetica,Arial,sans-serif}
h1{font-weight:800;font-size:48px;letter-spacing:-1.2px;margin:13px 0 16px}
.intro>p:last-child{color:white;line-height:1.6;max-width:650px}
.search-panel{border:0;border-top:6px solid var(--yellow);border-radius:8px;padding:25px;box-shadow:0 4px 20px #0A1F5210}
.input-wrap{border-color:var(--navy);border-radius:6px}
.input-wrap:focus-within{outline-color:var(--cyan)}
.input-wrap button{color:var(--navy);font-weight:600}
.filters button{border-color:var(--slate);border-radius:6px;color:var(--navy);font-weight:600}
.filters button[aria-pressed=true]{background:var(--yellow);color:var(--black);border-color:var(--yellow)}
.filters button:hover{border-color:var(--black)}
button:focus-visible,summary:focus-visible{outline-color:var(--navy)}
h2{color:var(--navy)}
#status,.codes,summary{color:var(--slate)}
.card{border-color:var(--aqua);border-radius:8px;box-shadow:0 2px 8px #0A1F5205}
.card:has(.tag:not(.oem)){border-left:6px solid var(--yellow)}
.tag{background:var(--yellow);color:var(--black);border-radius:3px}
.tag.oem{background:var(--navy);color:white}
.codes b{color:var(--black)}
.printer-box{border-color:var(--aqua)}
.match{background:var(--aqua);color:var(--navy);border-left:4px solid var(--cyan);border-radius:3px;font-weight:600}
summary:hover{color:var(--navy)}
#more{background:var(--yellow);color:var(--black);font-weight:600;border-radius:6px;border:2px solid var(--yellow)}
#more:hover{border-color:var(--black)}
footer{color:var(--navy);border-top:4px solid var(--yellow);padding:20px 0}
@media(max-width:700px){header{padding:18px 20px}.intro{margin:-30px -18px 24px;padding:28px 22px}h1{font-size:37px}.search-panel{padding:19px}.card:has(.tag:not(.oem)){border-left-width:4px}.printer-box{border-top-color:var(--aqua)}}
select{font:inherit;color:var(--navy);background:white;border:1px solid var(--slate);border-radius:6px;padding:12px 35px 12px 14px;min-width:220px;max-width:100%}select:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}.brand-picker{margin-bottom:22px}#refine-panel{margin:0 0 20px;padding:16px 20px;background:var(--aqua);border-radius:6px}#refine-panel[hidden]{display:none}#refine-panel label{margin-bottom:8px}
.eol-label{display:block;color:#E91C32;font-size:15px;font-weight:700;margin-top:7px}
