@layer components{.collection-main__loading-fallback{padding:var(--space-8) 0}.collection-main__title{font-family:var(--font-display);font-size:var(--text-2xl);font-weight:var(--weight-regular);line-height:var(--leading-tight);color:var(--color-text);margin-bottom:var(--space-4)}.collection-main__description{font-size:var(--text-base);color:var(--color-text);max-width:60ch}.collection-grid{display:grid;grid-template-columns:1fr;column-gap:var(--space-3);row-gap:var(--space-8)}@media (width >= 768px){.collection-grid{grid-template-columns:repeat(3,1fr);column-gap:var(--space-6);row-gap:var(--space-12)}}.collection-empty{padding:var(--space-16) 0;text-align:center}.collection-empty__message{font-size:var(--text-lg);color:var(--color-text);margin-bottom:var(--space-6)}.collection-pagination{display:flex;align-items:center;justify-content:center;gap:var(--space-1);margin-top:var(--space-12);flex-wrap:wrap}.collection-pagination__page{min-width:2.5rem;height:2.5rem;display:inline-flex;align-items:center;justify-content:center;border:1px solid transparent;color:var(--color-text);text-decoration:none;font-size:var(--text-sm);transition:var(--transition-base)}.collection-pagination__page.is-active{border-color:var(--color-walnut);color:var(--color-walnut);font-weight:var(--weight-semibold)}.collection-pagination__page:hover:not(.is-active){border-color:var(--color-border, #ddd)}.collection-pagination__arrow{min-width:2.5rem;height:2.5rem;display:inline-flex;align-items:center;justify-content:center;color:var(--color-text);text-decoration:none;border:1px solid transparent;transition:var(--transition-base)}.collection-pagination__arrow:hover:not(.is-disabled){border-color:var(--color-border, #ddd)}.collection-pagination__arrow.is-disabled{opacity:.35;pointer-events:none}.collection-pagination__gap{display:inline-flex;align-items:center;justify-content:center;min-width:2.5rem;height:2.5rem;color:var(--color-text-muted, #888);font-size:var(--text-sm)}}@layer components{.collection-filters-bar{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);padding-block:var(--space-4);border-bottom:1px solid var(--color-surface-warm);margin-bottom:var(--space-6);flex-wrap:wrap}.collection-filters-bar__left{display:flex;align-items:center;gap:var(--space-3);flex:1 1 0;min-width:0}.collection-filters-bar__sort-inline{display:none;flex-shrink:0}@media (width >= 1024px){.collection-filters-bar__sort-inline{display:block}}.collection-filters-bar__right{display:none}@media (width >= 1024px){.collection-filters-bar__right{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:5px}}.collection-search-input{display:flex;align-items:center;gap:0;flex:1 1 0;min-width:120px;max-width:453px;border:1px solid var(--color-surface-warm);background:var(--color-surface);transition:border-color .2s ease}.collection-search-input:focus-within{border-color:var(--color-walnut)}.collection-search-input__icon{flex-shrink:0;margin-left:12px;color:var(--color-text-filter-muted);pointer-events:none}.collection-search-input__field{flex:1 1 auto;min-width:0;padding:9px 8px;border:none;background:transparent;font-size:var(--text-sm);line-height:1.25rem;font-family:var(--font-ui, "Switzer", sans-serif);color:var(--color-text)}.collection-search-input__field::placeholder{color:var(--color-text-filter-muted)}.collection-search-input__field:focus{outline:none}.collection-search-input__field::-webkit-search-cancel-button{display:none}.collection-search-input__actions{display:flex;align-items:center;flex-shrink:0;gap:4px;padding-right:6px}.collection-search-input__submit{padding:6px 10px;border:none;border-radius:0;background:var(--color-walnut);color:var(--color-text-on-dark);font-family:var(--font-ui, "Switzer", sans-serif);font-size:var(--text-xs);font-weight:var(--weight-semibold);letter-spacing:.04em;text-transform:uppercase;cursor:pointer;white-space:nowrap;transition:background-color .2s ease,opacity .2s ease}.collection-search-input__submit:hover{opacity:.92}.collection-search-input__clear{display:flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:none;background:transparent;color:var(--color-text-filter-muted);cursor:pointer}.collection-search-input__clear:hover{color:var(--color-text)}.filter-dropdown{position:relative}.filter-dropdown__trigger{display:flex;align-items:center;gap:var(--space-2);padding:9px 20px;border:1px solid var(--color-surface-warm);background:var(--color-surface);font-size:var(--text-sm);line-height:1.25rem;font-family:var(--font-ui, "Switzer", sans-serif);cursor:pointer;transition:border-color .2s ease;white-space:nowrap}.filter-dropdown__trigger:hover{border-color:var(--color-text)}.filter-dropdown__trigger.has-active{border-color:var(--color-walnut);color:var(--color-walnut)}.filter-dropdown__trigger.filter-dropdown__trigger--muted{opacity:.75;border-style:dashed}.filter-dropdown__empty{list-style:none;margin:0;padding:0}.filter-dropdown__empty-message{display:block;padding:var(--space-3) var(--space-4);font-size:var(--text-xs);line-height:1.35;color:var(--color-text-muted);max-width:280px}.filter-dropdown__badge{width:6px;height:6px;border-radius:50%;background:var(--color-walnut);flex-shrink:0}.filter-dropdown__chevron{transition:transform .2s ease;flex-shrink:0}.filter-dropdown__chevron.is-open{transform:rotate(180deg)}.filter-dropdown__menu{position:absolute;top:calc(100% + 4px);left:0;z-index:50;min-width:200px;background:var(--color-surface);border:1px solid var(--color-surface-warm);box-shadow:0 4px 16px var(--color-shadow-ui);list-style:none;padding:var(--space-2) 0;margin:0}.filter-dropdown__option{display:flex;align-items:center;width:100%;padding:var(--space-2) var(--space-4);background:transparent;border:none;text-align:left;font-size:var(--text-sm);font-family:inherit;cursor:pointer;gap:var(--space-2)}.filter-dropdown__option:hover{background:var(--color-surface-alt)}.filter-dropdown__option.is-active{font-weight:var(--weight-semibold);color:var(--color-walnut)}.filter-dropdown__option-label{flex:1}.filter-dropdown__count{font-size:var(--text-xs);color:var(--color-text-muted)}.filter-dropdown__check{color:var(--color-walnut);flex-shrink:0}.active-filters{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2);padding-block:var(--space-3)}.filter-pill{display:inline-flex;align-items:center;gap:var(--space-1);padding:4px 10px;border:1px solid var(--color-walnut);color:var(--color-walnut);font-size:var(--text-xs);font-family:inherit;background:transparent;cursor:pointer;transition:var(--transition-base)}.filter-pill:hover{background:var(--color-walnut);color:#fff}.filter-pill__remove{font-size:1em;line-height:1}.filter-pill--clear{border-color:var(--color-border);color:var(--color-text-muted)}.filter-pill--clear:hover{background:var(--color-surface-alt);color:var(--color-text)}.sort-select{padding:9px 32px 9px 20px;border:1px solid var(--color-surface-warm);font-size:var(--text-sm);line-height:1.25rem;font-family:var(--font-ui, "Switzer", sans-serif);background:var(--color-surface) url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3 4.5L6 7.5l3-3' stroke='%230F0F0F' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 12px center;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;transition:border-color .2s ease;flex:0 0 auto;width:auto}.sort-select:hover{border-color:var(--color-text)}.collection-filters-bar__mobile-trigger{display:flex;align-items:center;gap:var(--space-2);padding:9px 20px;border:1px solid var(--color-surface-warm);background:var(--color-surface);font-size:var(--text-sm);line-height:1.25rem;font-family:var(--font-ui, "Switzer", sans-serif);cursor:pointer;flex-shrink:0}@media (width >= 1024px){.collection-filters-bar__mobile-trigger{display:none}}@media not all and (width >= 1024px){.collection-filters-bar{flex-wrap:wrap}.collection-filters-bar__left{width:100%;order:-1}.collection-search-input{max-width:none}}.collection-filter-sheet__overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--color-scrim-strong);z-index:199;opacity:0;pointer-events:none;transition:opacity .3s ease}.collection-filter-sheet__overlay.is-visible{opacity:1;pointer-events:all}.collection-filter-sheet{position:fixed;bottom:0;left:0;right:0;z-index:200;background:var(--color-surface);border-top:1px solid var(--color-surface-warm);box-shadow:0 -4px 24px var(--color-shadow-elevated);max-height:80vh;overflow-y:auto;transform:translateY(100%);transition:transform .3s ease}.collection-filter-sheet.is-open{transform:translateY(0)}.collection-filter-sheet__header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-4) var(--space-6);border-bottom:1px solid var(--color-surface-warm);position:sticky;top:0;background:var(--color-surface);z-index:1}.collection-filter-sheet__title{font-size:var(--text-base);font-weight:var(--weight-semibold);color:var(--color-text)}.collection-filter-sheet__close{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;background:transparent;border:none;cursor:pointer;color:var(--color-text)}.collection-filter-sheet .filter-dropdown{display:block;border-bottom:1px solid var(--color-surface-warm);padding:var(--space-3) var(--space-6)}.collection-filter-sheet .filter-dropdown__menu{position:static;box-shadow:none;border:none;padding:var(--space-2) 0 0;min-width:auto}.collection-filter-sheet .active-filters{padding:var(--space-3) var(--space-6);border-bottom:1px solid var(--color-surface-warm)}.collection-filter-sheet__sort{display:none;padding:var(--space-3) var(--space-6);border-bottom:1px solid var(--color-surface-warm)}@media not all and (width >= 1024px){.collection-filter-sheet__sort{display:block}}.collection-filter-sheet__sort-label{display:block;margin-bottom:var(--space-2);font-size:var(--text-xs);font-weight:var(--weight-semibold);font-family:var(--font-ui, "Switzer", sans-serif);letter-spacing:.04em;text-transform:uppercase;color:var(--color-text-muted)}.collection-filter-sheet__sort .sort-select{width:100%;max-width:none;flex:1 1 auto}}
