*{box-sizing:border-box}
body{margin:0;background:#0b0b0b;color:#eee;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial}
a{color:#ffd700}
header{padding:18px 16px;border-bottom:1px solid #222;background:#000}
.brand{max-width:1200px;margin:0 auto;display:flex;align-items:center;gap:16px}
.brand img{height:48px}
.brand .right{line-height:1.25}
.brand h1{margin:0;color:#ffd700;font-weight:800;letter-spacing:.5px;font-size:22px}
.brand .sub{opacity:.85;margin-top:4px;font-size:13px}
.hero{background:linear-gradient(180deg, rgba(255,215,0,0.06), transparent);border-bottom:1px solid #222}
.hero .inner{max-width:1200px;margin:0 auto;padding:18px 16px}
.wrap{max-width:1200px;margin:0 auto;padding:20px}
.controls{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:10px}
input[type=search]{flex:1;min-width:240px;padding:10px 12px;border-radius:10px;border:1px solid #2a2a2a;background:#111;color:#eee}
.filters{background:#121212;border:1px solid #222;border-radius:14px;padding:10px;margin:10px 0}
.filter-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
.filter-row label{font-size:12px;background:#161616;border:1px solid #2b2b2b;border-radius:999px;padding:6px 10px;display:flex;align-items:center;gap:6px;cursor:pointer}
.filter-row input{accent-color:#ffd700}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:18px}
.card{background:#151515;border:1px solid #222;border-radius:16px;overflow:hidden;display:flex;flex-direction:column}
.thumb{aspect-ratio:1/1;background:#0f0f0f;display:flex;align-items:center;justify-content:center;font-size:12px;color:#777}
.card h3{font-size:16px;margin:12px 12px 4px}
.spec{font-size:12px;color:#bbb;margin:0 12px 8px;min-height:48px}
.price{margin:0 12px 8px;color:#6DFF8A;font-weight:800}
.meta{margin:0 12px 8px;color:#888;font-size:12px}
.btn{margin:10px 12px 14px;padding:10px 12px;background:#ffd700;color:#000;font-weight:800;border:none;border-radius:12px;text-decoration:none;text-align:center}
.btn:active{transform:translateY(1px)}
footer{padding:18px;text-align:center;color:#888;border-top:1px solid #222}
.small{font-size:12px;color:#aaa}
.actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.action-btn{padding:8px 10px;border:1px solid #333;border-radius:10px;background:#141414;color:#eee;cursor:pointer;font-size:12px}
.action-btn:hover{border-color:#ffd700;color:#ffd700}
.sticky-cta{position:fixed;right:16px;bottom:16px;background:#ffd700;color:#000;padding:12px 14px;border-radius:999px;font-weight:800;text-decoration:none;border:1px solid #d4b400}
.hero{background:linear-gradient(180deg, rgba(0,0,0,0.25), rgba(0,0,0,0.25)), url('neobar-hero.png') center/cover no-repeat; border-bottom:1px solid #222}