:root{--bg:#f5f7fb;--card:#fff;--text:#101828;--muted:#667085;--line:#e4e7ec;--accent:#111827;--soft:#eef2f7}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}.shell{max-width:1440px;margin:auto;padding:0 22px 60px}.topbar{height:72px;display:flex;align-items:center;justify-content:space-between}.brand{font-size:21px;font-weight:800;color:var(--text);text-decoration:none}.brand span{font-weight:500;margin-left:4px;color:#667085}.top-actions{display:flex;gap:8px}.ghost,.compare-btn,.quick button,.filter-head button,.pill{border:1px solid var(--line);background:#fff;border-radius:12px;padding:9px 13px;font:inherit;font-size:13px;cursor:pointer}.compare-btn{background:var(--accent);color:#fff;border-color:var(--accent)}.compare-btn b{background:#fff;color:var(--accent);border-radius:99px;padding:1px 6px;margin-left:4px}.hero{background:linear-gradient(135deg,#fff 0%,#f0f4fa 100%);border:1px solid var(--line);border-radius:28px;padding:42px;display:flex;justify-content:space-between;align-items:center;gap:30px}.eyebrow{font-size:11px;font-weight:800;letter-spacing:.14em;color:#667085;margin-bottom:12px}.hero h1{margin:0;font-size:clamp(30px,4vw,52px);letter-spacing:-1.8px;line-height:1.05}.hero p{margin:15px 0 0;color:var(--muted);max-width:650px;line-height:1.65}.hero-stat{min-width:150px;height:150px;border-radius:28px;background:#fff;border:1px solid var(--line);display:flex;flex-direction:column;align-items:center;justify-content:center}.hero-stat strong{font-size:42px}.hero-stat span{font-size:13px;color:var(--muted)}.toolbar{display:grid;grid-template-columns:1fr 240px;gap:12px;margin:18px 0 12px}.search-wrap{display:flex;align-items:center;background:#fff;border:1px solid var(--line);border-radius:15px;padding:0 15px}.search-wrap span{font-size:24px;color:#98a2b3}.search-wrap input,.toolbar select,.filters input{border:0;outline:0;background:transparent;font:inherit}.search-wrap input{width:100%;padding:15px 10px;font-size:14px}.toolbar select{background:#fff;border:1px solid var(--line);border-radius:15px;padding:0 14px}.quick{display:flex;gap:8px;overflow:auto;padding-bottom:5px}.quick button{white-space:nowrap}.quick button.active,.pill.active{background:var(--accent);color:#fff;border-color:var(--accent)}.content-layout{display:grid;grid-template-columns:260px 1fr;gap:18px;margin-top:18px}.filters{background:#fff;border:1px solid var(--line);border-radius:20px;padding:18px;height:max-content;position:sticky;top:12px}.filter-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.filter-head h2{margin:0;font-size:17px}.filter-group{border-top:1px solid var(--line);padding:17px 0}.filter-group:first-of-type{border-top:0;padding-top:0}.filter-group>label:first-child{display:block;font-size:12px;font-weight:700;margin-bottom:9px}.filter-group>input{width:100%;border:1px solid var(--line);background:#fff;border-radius:10px;padding:10px;font-size:12px}.brand-list{display:flex;flex-direction:column;gap:3px;margin-top:8px;max-height:240px;overflow:auto}.brand-option{display:flex;justify-content:space-between;padding:8px 9px;border-radius:9px;font-size:12px;cursor:pointer}.brand-option:hover,.brand-option.active{background:var(--soft)}.brand-option span:last-child{color:#98a2b3}.range-row{display:grid;grid-template-columns:1fr auto 1fr;gap:6px;align-items:center}.range-row input{width:100%;border:1px solid var(--line);border-radius:10px;padding:9px;font-size:12px}.range-row span{font-size:11px;color:var(--muted)}.pill-grid{display:flex;flex-wrap:wrap;gap:6px}.pill{padding:7px 9px;font-size:11px}.check{font-size:12px!important;font-weight:500!important;display:flex!important;align-items:center;gap:8px}.check input{accent-color:#111827}.results-head{display:flex;justify-content:space-between;align-items:center;margin:3px 2px 12px;font-size:13px}.updated{color:#98a2b3;font-size:11px}.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.card{background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;display:flex;flex-direction:column;min-width:0;transition:.18s transform,.18s box-shadow}.card:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(16,24,40,.08)}.card-media{height:210px;background:linear-gradient(145deg,#f7f8fa,#eef1f5);display:flex;align-items:center;justify-content:center;position:relative}.card-media img{max-width:84%;max-height:88%;object-fit:contain;mix-blend-mode:multiply}.no-img{font-size:34px;color:#98a2b3}.compare-check{position:absolute;top:10px;left:10px;width:28px;height:28px;border-radius:9px;border:1px solid var(--line);background:#fff;display:grid;place-items:center}.compare-check input{accent-color:#111827}.stock{position:absolute;top:10px;right:10px;background:#fff;border:1px solid var(--line);border-radius:99px;padding:5px 8px;font-size:10px}.card-body{padding:15px}.brand-name{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:#98a2b3;font-weight:700}.card h3{font-size:15px;line-height:1.3;margin:5px 0 8px}.price{font-size:19px;font-weight:800}.old{font-size:11px;color:#98a2b3;text-decoration:line-through;margin-left:5px}.variant{font-size:10px;color:#667085;margin-top:4px;min-height:15px}.spec-row{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:13px}.spec{background:#f8fafc;border-radius:9px;padding:8px 5px;text-align:center}.spec b{display:block;font-size:10px}.spec span{font-size:9px;color:#98a2b3}.rating{margin-top:11px;font-size:11px;color:#475467}.rating strong{color:#111827}.empty{text-align:center;padding:80px 20px;color:var(--muted)}.empty div{font-size:42px}.empty h3{color:var(--text);margin:10px 0 5px}.hidden{display:none!important}.modal{position:fixed;inset:0;background:rgba(15,23,42,.48);z-index:30;display:grid;place-items:center;padding:20px}.modal-card{width:min(1100px,100%);max-height:90vh;overflow:auto;background:#fff;border-radius:24px;padding:22px}.modal-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:18px}.modal-head h2{margin:0}.modal-head p{margin:5px 0;color:var(--muted);font-size:12px}.icon-btn{border:0;background:#f2f4f7;width:34px;height:34px;border-radius:50%;font-size:22px;cursor:pointer}.compare-table{width:100%;border-collapse:collapse;font-size:12px}.compare-table th,.compare-table td{border:1px solid var(--line);padding:10px;text-align:left;vertical-align:top}.compare-table th{background:#f8fafc}.loading{text-align:center;padding:60px;color:var(--muted)}@media(max-width:1180px){.grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:900px){.content-layout{grid-template-columns:1fr}.filters{position:static}.hero{padding:30px}.hero-stat{min-width:120px;height:120px}.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:620px){.shell{padding:0 12px 40px}.topbar{height:60px}.top-actions .ghost{display:none}.hero{padding:24px;border-radius:22px;align-items:flex-start}.hero-stat{display:none}.toolbar{grid-template-columns:1fr}.toolbar select{height:48px}.grid{grid-template-columns:1fr 1fr;gap:9px}.card-media{height:160px}.card-body{padding:12px}.card h3{font-size:13px}.price{font-size:16px}.spec-row{display:none}}
