.comp-hero{background:linear-gradient(135deg,#0a0a0a 0%,#1a2332 100%);padding:2rem 0;position:relative;overflow:hidden}.comp-hero-content{z-index:1;position:relative}.comp-hero h1{color:#fff;letter-spacing:-.02em;margin-bottom:.375rem;font-size:2rem;font-weight:800;line-height:1.15}.comp-hero-accent{color:var(--accent)}.comp-hero p{color:#ffffff8c;margin:0 0 1rem;font-size:.9375rem;line-height:1.6}.comp-hero .search-bar{max-width:480px}.comp-hero .comp-search-input{width:100%;font-size:.875rem;font-family:var(--font-body);border-radius:var(--radius-md);color:#fff;background:#ffffff14 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23ffffff60' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.35-4.35'/%3E%3C/svg%3E") .75rem no-repeat;border:1px solid #ffffff26;padding:.625rem 1rem .625rem 2.5rem;transition:border-color .15s,box-shadow .15s}.comp-hero .comp-search-input::placeholder{color:#fff6}.comp-hero .comp-search-input:focus{border-color:var(--accent);background-color:#ffffff1a;outline:none;box-shadow:0 0 0 2px #00823c26}.comp-content{background:var(--surface);min-height:60vh;padding:1.5rem 0 3.5rem}.comp-results-count,.comp-results-count strong{color:var(--text-secondary)}.comp-results-count strong{color:var(--text-primary)}.comp-pagination .page-info{color:var(--text-secondary)}.comp-layout{gap:1.5rem;display:flex}.comp-main{flex:1;min-width:0}.comp-results-bar{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;margin-bottom:1rem;padding-bottom:.75rem;display:flex}.comp-results-count{color:var(--text-secondary);font-size:.8125rem;font-weight:500}.comp-grid,.comp-loading-grid{grid-template-columns:repeat(3,1fr);gap:1rem;display:grid}.comp-skeleton{border-radius:var(--radius-lg);background:linear-gradient(90deg,#e8e8e8 25%,#f4f4f4 50%,#e8e8e8 75%) 0 0/200% 100%;height:320px;animation:1.5s ease-in-out infinite comp-shimmer}@keyframes comp-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.comp-empty{text-align:center;background:var(--surface-alt);border-radius:var(--radius-lg);border:1px solid var(--border);padding:3.5rem 2rem}.comp-empty-icon{opacity:.4;margin-bottom:1rem;font-size:2.5rem}.comp-empty p{color:var(--text-secondary);margin:0 0 1rem;font-size:.9375rem}.comp-pagination{border-top:1px solid var(--border);justify-content:center;align-items:center;gap:.75rem;margin-top:1.5rem;padding-top:1.25rem;display:flex}.comp-pagination .page-info{background:var(--surface-alt);border:1px solid var(--border);border-radius:var(--radius-sm);padding:.25rem .625rem;font-size:.8125rem;font-weight:500}.comp-filters{background:var(--surface-alt);border:1px solid var(--border);border-radius:var(--radius-lg);flex-shrink:0;align-self:flex-start;width:260px;padding:1rem;position:sticky;top:84px;overflow:hidden}.comp-filters:before{content:"";background:var(--accent);height:3px;position:absolute;top:0;left:0;right:0}.comp-filters-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;margin-bottom:1rem;padding-bottom:.625rem;display:flex}.comp-filters-title{align-items:center;gap:.375rem;display:flex}.comp-filters-title svg{fill:none;width:14px;height:14px;stroke:var(--accent);stroke-width:2px;stroke-linecap:round;stroke-linejoin:round}.comp-filters-title span{text-transform:uppercase;letter-spacing:.06em;color:var(--text-primary);font-size:.6875rem;font-weight:700}.comp-clear-btn{color:var(--scan-blue);cursor:pointer;background:0 0;border:none;padding:.125rem .375rem;font-size:.625rem;font-weight:600;text-decoration:underline;transition:color .15s}.comp-clear-btn:hover{color:#013d6b}.comp-filter-group{margin-bottom:1rem}.comp-filter-group:last-child{margin-bottom:0}.comp-filter-label{text-transform:uppercase;letter-spacing:.04em;color:var(--text-secondary);margin-bottom:.375rem;font-size:.6875rem;font-weight:700;display:block}.comp-filter-select,.comp-filter-input{width:100%;font-size:.8125rem;font-family:var(--font-body);border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface-alt);color:var(--text-primary);appearance:none;padding:.4375rem .625rem;transition:border-color .15s}.comp-filter-select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2355555590' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-position:right .625rem center;background-repeat:no-repeat;padding-right:1.75rem}.comp-filter-select option{background:var(--surface-alt);color:var(--text-primary)}.comp-filter-select:focus,.comp-filter-input:focus{border-color:var(--accent);outline:none;box-shadow:0 0 0 2px #00823c1a}.comp-filter-input::placeholder{color:#999}.comp-price-row{align-items:center;gap:.375rem;display:flex}.comp-price-row .comp-filter-input{flex:1;min-width:0}.comp-price-sep{color:var(--text-secondary);flex-shrink:0;font-size:.75rem}.comp-checkbox{cursor:pointer;color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface-alt);align-items:center;gap:.5rem;padding:.4375rem .625rem;font-size:.8125rem;transition:border-color .15s;display:flex}.comp-checkbox:hover{border-color:var(--accent)}.comp-checkbox input[type=checkbox]{width:15px;height:15px;accent-color:var(--accent);flex-shrink:0}.comp-checkbox span{font-weight:500}.comp-active-count{color:#fff;background:var(--accent);border-radius:var(--radius-sm);justify-content:center;align-items:center;min-width:18px;height:18px;margin-left:.25rem;padding:0 .375rem;font-size:.625rem;font-weight:700;display:inline-flex}@media (max-width:1024px){.comp-grid,.comp-loading-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:768px){.comp-hero{padding:1.5rem 0}.comp-hero h1{font-size:1.625rem}.comp-layout{flex-direction:column}.comp-filters{width:100%;position:static}.comp-grid,.comp-loading-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:480px){.comp-hero h1{font-size:1.375rem}.comp-grid,.comp-loading-grid{grid-template-columns:1fr}}