.product-grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:18px;padding:16px 0 20px;display:grid;position:relative}.product-card-skeleton{background:var(--surface);border:var(--public-hairline);border-radius:var(--radius-sharp);flex-direction:column;gap:10px;padding:12px;display:flex}.skeleton{background:var(--sand-light);border-radius:var(--radius-chip);animation:1.4s ease-in-out infinite product-skeleton-pulse;display:block}.skeleton-thumb{width:100%;padding-top:100%}.skeleton-title{width:70%;height:14px}.skeleton-price{width:40%;height:14px}@keyframes product-skeleton-pulse{0%,to{opacity:1}50%{opacity:.55}}.product-grid__empty-state{text-align:center;padding:var(--space-16) var(--space-8);background:var(--surface-muted);border-radius:var(--radius-plate);border:var(--public-hairline);border-top:2px solid var(--public-accent);flex-direction:column;justify-content:center;align-items:center;min-height:500px;display:flex}.product-grid__empty-icon{color:var(--public-accent-strong);margin-bottom:var(--space-8)}.product-grid__empty-title{font-family:var(--font-display);font-size:var(--text-3xl);font-weight:var(--font-extrabold);letter-spacing:-.01em;color:var(--public-text);margin-bottom:var(--space-4);line-height:1.1}.product-grid__empty-description{font-size:var(--text-lg);color:var(--public-text-muted);max-width:500px;line-height:1.7;font-weight:var(--font-medium);margin:0}@media (prefers-reduced-motion:reduce){.skeleton{animation:none}}@media (max-width:1400px){.product-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:20px}}@media (max-width:1200px){.product-grid{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px}}@media (max-width:1024px){.product-grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px;padding:16px 0}.product-grid__empty-state{min-height:400px;padding:var(--space-12) var(--space-6)}.product-grid__empty-title{font-size:var(--text-2xl)}.product-grid__empty-description{font-size:var(--text-base);max-width:400px}}@media (max-width:768px){.product-grid{gap:var(--space-3);padding:var(--space-2) 0;grid-template-columns:repeat(2,1fr)}.product-grid__empty-state{padding:var(--space-10) var(--space-4);min-height:350px}.product-grid__empty-title{font-size:var(--text-xl);margin-bottom:var(--space-3)}.product-grid__empty-description{font-size:var(--text-base);max-width:350px;line-height:1.6}.product-grid__empty-icon{margin-bottom:var(--space-6)}}@media (max-width:640px){.product-grid{grid-template-columns:repeat(2,1fr);gap:10px}.product-grid__empty-state{padding:var(--space-8) var(--space-3);min-height:300px}.product-grid__empty-title{font-size:var(--text-lg)}.product-grid__empty-description{font-size:var(--text-sm);max-width:300px}}@media (max-width:480px){.product-grid{grid-template-columns:repeat(2,1fr);gap:8px;padding:8px 0}.product-grid__empty-state{padding:var(--space-6) var(--space-2);min-height:280px}.product-grid__empty-title{font-size:var(--text-base);margin-bottom:var(--space-2)}.product-grid__empty-description{font-size:var(--text-sm);max-width:250px;line-height:1.5}.product-grid__empty-icon{margin-bottom:var(--space-4)}}@media (max-width:380px){.product-grid{grid-template-columns:repeat(2,1fr);gap:6px;padding:6px 0}.product-grid__empty-state{padding:var(--space-4) var(--space-2);min-height:250px}.product-grid__empty-title{font-size:var(--text-sm)}.product-grid__empty-description{font-size:var(--text-xs);max-width:200px}}@media (max-width:320px){.product-grid{grid-template-columns:repeat(2,1fr);gap:4px;padding:4px 0}}
.product-sort{align-items:center;gap:12px;display:flex;position:relative}.sort-label{font-size:var(--text-sm);color:var(--public-text-muted);white-space:nowrap;font-weight:700}.sort-dropdown{z-index:3600;position:relative}.sort-button{background:var(--white);border:1px solid var(--public-border-strong);border-radius:var(--radius-sharp);cursor:pointer;justify-content:space-between;align-items:center;gap:10px;min-width:200px;min-height:44px;padding:10px 14px;transition:border-color .15s;display:flex}.sort-button:hover{border-color:var(--dark-900)}.sort-button:focus{outline:none}.sort-button:focus-visible{border-color:var(--public-accent-strong);outline:2px solid var(--public-accent-strong);outline-offset:2px}.sort-button-text{color:var(--dark-900);font-size:13px;font-weight:600}.sort-chevron{color:var(--public-text-muted);transition:color .15s}.sort-chevron--open{color:var(--public-accent-strong);transform:rotate(180deg)}.sort-options{background:var(--white);border:var(--public-hairline-strong);border-radius:var(--radius-sharp);box-shadow:var(--shadow-overlay);z-index:4000;flex-direction:column;gap:2px;min-width:100%;padding:4px;animation:.15s ease-out sortDropdownAppear;display:flex;position:absolute;top:calc(100% + 4px);right:0}@keyframes sortDropdownAppear{0%{opacity:0}to{opacity:1}}.sort-option{border-radius:var(--radius-sharp);width:100%;min-height:40px;color:var(--public-text-soft);cursor:pointer;text-align:left;white-space:nowrap;background:0 0;border:none;border-left:2px solid #0000;justify-content:space-between;align-items:center;padding:10px 12px;font-size:13px;font-weight:500;transition:background-color .15s,color .15s;display:flex}.sort-option:hover{background:var(--surface-muted);color:var(--dark-900)}.sort-option:focus-visible{outline:2px solid var(--public-accent-strong);outline-offset:-2px}.sort-option--selected,.sort-option--selected:hover{border-left-color:var(--public-accent);background:var(--public-accent-pale);color:var(--dark-900);font-weight:700}.check-icon{color:var(--public-accent-strong);opacity:0;transition:opacity .15s}.sort-option--selected .check-icon{opacity:1}.sort-overlay{z-index:3500;background:0 0;position:fixed;inset:0}@media (max-width:768px){.product-sort{gap:var(--space-2);align-items:center;padding:0}.sort-label{white-space:nowrap;flex-shrink:0;font-size:10px;display:block}.sort-button{min-width:140px;padding:var(--space-2) var(--space-3)}}@media (max-width:480px){.product-sort{gap:var(--space-1);align-items:center;padding:0}.sort-label{letter-spacing:.08em;white-space:nowrap;flex-shrink:0;font-size:9px;display:block}.sort-button{min-width:110px;padding:var(--space-2) var(--space-3);font-size:var(--text-xs)}.sort-button-text{font-size:var(--text-xs)}}@media (prefers-reduced-motion:reduce){.sort-options{animation:none}}
