.filter-section{width:100%;background:linear-gradient(135deg,#f8fafc,#ffffff);border-bottom:1px solid #e2e8f0;padding:2rem 0;position:relative}.filter-section:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at 20% 50%,rgba(120,119,198,.03) 0,transparent 50%),radial-gradient(circle at 80% 20%,rgba(255,119,198,.03) 0,transparent 50%);pointer-events:none}.filter-container{max-width:1200px;margin:0 auto;padding:0 1.5rem;position:relative;z-index:1}.filter-header{display:flex;align-items:center;gap:1rem;margin-bottom:2rem}.filter-header-icon{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:12px;padding:.75rem;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px rgba(102,126,234,.2)}.filter-header-icon svg{color:white}.filter-header-content{flex:1}.filter-title{font-size:1.5rem;font-weight:700;color:#1e293b;margin:0 0 .25rem}.filter-subtitle,.filter-title{font-family:Quicksand,sans-serif}.filter-subtitle{font-size:.875rem;color:#64748b;margin:0}.filter-controls{display:grid;grid-template-columns:1fr auto auto;gap:2rem;align-items:start;padding-top:131px}.filter-group{display:flex;flex-direction:column;gap:.75rem}.filter-label{font-size:.875rem;font-weight:600;color:#ffffff;margin:0;font-family:Quicksand,sans-serif}.category-buttons{display:flex;gap:.5rem;flex-wrap:wrap}.category-button{display:flex;align-items:center;gap:.5rem;padding:.75rem 1rem;background:rgba(255,255,255,0);border:2px solid #000000;border-radius:12px;color:#111827;font-family:Quicksand,sans-serif;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s ease;position:relative;overflow:hidden}.category-button:before{content:"";position:absolute;top:0;left:-75%;width:50%;height:100%;background:linear-gradient(120deg,rgba(255,255,255,0),rgba(255,255,255,.4) 50%,rgba(255,255,255,0));transform:skewX(-20deg);transition:left .5s}.category-button:hover:before{left:125%}.category-button:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(17,24,39,.1)}.category-button.active{background:linear-gradient(135deg,#111827,#000000);border-color:#111827;color:white;box-shadow:0 4px 12px rgba(0,0,0,.25)}.category-button.active:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,0,0,.35)}.category-label{white-space:nowrap}.layout-buttons{display:flex;gap:.25rem;background:#f1f5f9;padding:.25rem;border-radius:10px}.layout-button{padding:.75rem;background:transparent;border:none;border-radius:8px;color:#64748b;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex;align-items:center;justify-content:center}.layout-button:hover{background:white;color:#3b82f6;box-shadow:0 2px 8px rgba(0,0,0,.1)}.layout-button.active{background:white;color:#3b82f6;box-shadow:0 2px 8px rgba(59,130,246,.2)}.rarity-dropdown{position:relative;min-width:200px}.rarity-trigger{width:100%;padding:.75rem 1rem;background:white;border:2px solid #e2e8f0;border-radius:12px;color:#374151;font-family:Quicksand,sans-serif;font-size:.875rem;font-weight:500;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:.5rem;transition:all .2s cubic-bezier(.4,0,.2,1)}.rarity-trigger:hover{border-color:#3b82f6;box-shadow:0 2px 8px rgba(59,130,246,.1)}.rarity-trigger.open{border-color:#3b82f6;box-shadow:0 0 0 3px rgba(59,130,246,.1)}.chevron{transition:transform .2s cubic-bezier(.4,0,.2,1)}.chevron.rotated{transform:rotate(180deg)}.rarity-dropdown-menu{position:absolute;top:calc(100% + .5rem);left:0;right:0;background:white;border:1px solid #e2e8f0;border-radius:12px;box-shadow:0 10px 25px rgba(0,0,0,.1);z-index:50;max-height:300px;overflow-y:auto;animation:dropdownSlide .2s cubic-bezier(.4,0,.2,1)}@keyframes dropdownSlide{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.rarity-option{width:100%;padding:.75rem 1rem;background:transparent;text-align:left;cursor:pointer;transition:background-color .15s ease;border:none;border-bottom:1px solid #f1f5f9}.rarity-option:last-child{border-bottom:none}.rarity-option:hover{background:#f8fafc}.rarity-option.selected{background:#eff6ff;color:#3b82f6}.rarity-info{display:flex;flex-direction:column;gap:.125rem}.rarity-name{font-family:Quicksand,sans-serif;font-size:.875rem;font-weight:500;color:#374151}.rarity-option.selected .rarity-name{color:#3b82f6}.rarity-description{font-family:Quicksand,sans-serif;font-size:.75rem;color:#64748b}.filter-title{color:#f1f5f9}.filter-subtitle{color:#94a3b8}.layout-buttons{background:#1e293b}.layout-button{color:#94a3b8}.layout-button.active,.layout-button:hover{background:#334155;color:#60a5fa}.rarity-trigger{color:#cbd5e1}.rarity-dropdown-menu,.rarity-trigger{background:#1e293b;border-color:#334155}.rarity-option{border-bottom-color:#334155}.rarity-option:hover{background:#334155}.rarity-option.selected{background:#1e3a8a}.rarity-name{color:#cbd5e1}.rarity-option.selected .rarity-name{color:#60a5fa}.rarity-description{color:#94a3b8}@media (max-width:1024px){.filter-controls{grid-template-columns:1fr;gap:1.5rem}.category-buttons{justify-content:center}}@media (max-width:768px){.filter-section{padding:1.5rem 0}.filter-container{padding:0 1rem}.filter-header{margin-bottom:1.5rem}.filter-title{font-size:1.25rem}.category-buttons{gap:.375rem}.category-button{padding:.625rem .875rem;font-size:.8125rem}.category-label{display:none}.layout-buttons{align-self:center}.rarity-dropdown{min-width:180px}}@media (max-width:480px){.filter-header{flex-direction:column;align-items:flex-start;gap:.75rem}.filter-header-icon{align-self:center}.filter-header-content{text-align:center;width:100%}.category-buttons{justify-content:center;gap:.25rem}.category-button{padding:.5rem}}.load-more-btn{padding:16px 20px;background-color:#1a1a1a;color:#fff;cursor:pointer;font-family:Quicksand,sans-serif;font-size:.95rem;border:2px solid transparent;border-radius:10px;display:inline-flex;align-items:center;gap:10px;transition:all .3s ease;margin-top:74px;position:relative;left:50%;transform:translateX(-50%)}.load-more-btn:hover{background-color:transparent;color:#3ECF8E;border-color:#3ECF8E}