/* The catalog gets the full canvas; refinements live in a calm, opaque drawer. */
body:has([data-shop-catalog]) .page-intro{padding-top:56px;padding-bottom:34px}
body:has([data-shop-catalog]) .page-intro h1{font-size:calc(clamp(76px,8.7vw,126px)*var(--heading-scale))}
.shop-section{display:block;padding-top:6px}
.shop-results{min-width:0}
.shop-section .shop-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:42px 24px}
.shop-toolbar{display:flex;align-items:center;gap:22px;min-height:62px;margin-bottom:26px}
.shop-filter-toggle{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:44px;padding:10px 18px;background:#222221;border:0;border-radius:100px;font-size:12px;font-weight:600;transition:background 180ms ease,color 180ms ease}
.shop-filter-toggle>.ui-icon{width:17px;height:17px}
.shop-filter-toggle:hover,.shop-filter-toggle[aria-expanded="true"]{background:var(--fg);color:var(--bg)}
[data-shop-filter-active]{display:inline-flex;justify-content:center;align-items:center;min-width:20px;height:20px;padding:0 5px;border-radius:100px;background:var(--accent);color:var(--on-accent);font-size:12px}
.shop-toolbar [data-shop-count]{margin-right:auto;color:var(--muted);font-size:12px;scroll-margin-top:calc(var(--header-height,88px) + 24px)}
.shop-sort{display:flex;align-items:center;gap:8px;position:relative;color:var(--muted);font-size:12px}
.shop-sort select{appearance:none;-webkit-appearance:none;min-height:44px;max-width:172px;background:transparent;color:var(--fg);border:0;border-radius:0;box-shadow:none;padding:10px 25px 10px 6px;font-size:12px}
.shop-sort>.ui-icon{position:absolute;right:1px;width:14px;height:14px;pointer-events:none;color:var(--fg)}
.shop-sort option{background:var(--surface);color:var(--fg)}
.shop-active-filters{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:-5px 0 27px}
.shop-active-filters button{display:inline-flex;align-items:center;gap:10px;min-height:36px;padding:8px 12px;border:0;border-radius:100px;background:#242323;color:var(--fg);font-size:12px;line-height:1.4}
.shop-active-filters button:hover{background:#343232}
.shop-active-filters svg{width:12px;height:12px}
.shop-section .catalog-footnote{margin-top:40px;font-size:12px;color:#8d8c88}
/* Native dialog gives one focus boundary and places controls above every blur layer. */
dialog.shop-filter-panel,body[data-surface="frosted"] dialog.shop-filter-panel{position:fixed;inset:12px auto auto 12px;width:min(440px,calc(100vw - 24px));height:auto;max-width:none;max-height:calc(100dvh - 24px);margin:0;padding:0;border:0;border-radius:12px;background:var(--surface);color:var(--fg);box-shadow:inset 0 1px 0 #ffffff09,18px 0 100px #0007;overflow:hidden;backdrop-filter:none;-webkit-backdrop-filter:none;opacity:0;transform:translateX(-22px);transition:transform 260ms cubic-bezier(.2,.7,.2,1),opacity 220ms ease}
.shop-filter-panel[data-state="open"],body[data-surface="frosted"] .shop-filter-panel[data-state="open"]{opacity:1;transform:translateX(0)}
.shop-filter-panel::backdrop,body[data-surface="frosted"] .shop-filter-panel::backdrop{background:#03030399;backdrop-filter:none;-webkit-backdrop-filter:none;opacity:0;transition:opacity 220ms ease}
.shop-filter-panel[data-state="open"]::backdrop,body[data-surface="frosted"] .shop-filter-panel[data-state="open"]::backdrop{opacity:1}
.shop-filter-shell{height:auto;max-height:calc(100dvh - 24px);display:flex;flex-direction:column}
.shop-filter-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;flex-shrink:0;padding:20px 24px 18px;background:var(--surface)}
.shop-filter-heading .eyebrow{font-size:12px;letter-spacing:.12em;color:var(--muted);margin-bottom:7px}
.shop-filter-heading h2{font-size:32px;line-height:.97;letter-spacing:-.015em}
.shop-filter-close{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:#ffffff06;transition:background 180ms ease}
.shop-filter-close:hover{background:#ffffff13}
.shop-filter-close .ui-icon{width:20px;height:20px}
.shop-filter-body{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#ffffff48 transparent;scrollbar-gutter:stable;padding:4px 24px 20px}
.shop-filter-columns{display:grid;grid-template-columns:minmax(0,1fr);gap:22px}
.shop-filter-column{display:flex;flex-direction:column;gap:20px;min-width:0}
.shop-facet{min-width:0;margin:0;padding:0;border:0}
.shop-facet legend{float:none;margin-bottom:8px;padding:0;font-family:var(--font-body);font-size:12px;font-weight:700;color:var(--fg);letter-spacing:0;line-height:1.5}
.facet-grid,.shop-section .shop-category-bar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;margin:0}
.shop-section .facet-choice{display:flex;align-items:center;gap:8px;min-width:0;min-height:38px;width:100%;padding:7px 9px;background:transparent;color:var(--muted);border:0;border-radius:6px;box-shadow:none;font-size:12px;line-height:1.45;letter-spacing:0;text-transform:none;text-align:left;font-weight:500;white-space:normal;transition:color 180ms ease,background 180ms ease}
.shop-section .facet-choice::before{display:none}
.shop-section .facet-choice:not(:disabled):hover{background:#ffffff05;color:var(--fg)}
.shop-section .facet-choice[aria-pressed="true"]{background:#ffffff09;color:var(--fg);box-shadow:inset 2px 0 var(--accent)}
.facet-label{flex:1;min-width:0}
.facet-count{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;min-width:21px;height:21px;padding:0 5px;border-radius:50%;background:#ffffff07;color:var(--muted);font-size:12px;font-variant-numeric:tabular-nums;line-height:1}
.facet-choice[aria-pressed="true"] .facet-count{background:var(--accent);color:var(--on-accent)}
.shop-section .facet-choice:disabled{opacity:.36;cursor:not-allowed;background:transparent;box-shadow:none}
.facet-choice--all{grid-column:1/-1}
.facet-artist-grid{display:grid;grid-template-columns:1fr;gap:4px}
.shop-section .facet-choice--artist{position:relative;flex-direction:row;align-items:center;justify-content:flex-start;min-height:40px;padding:6px 9px;background:var(--bg);font-size:12px}
.facet-choice--artist .facet-label{flex:1;min-width:0;padding:0}
.facet-choice--artist .facet-count{position:static;min-width:19px;height:19px;font-size:12px}
.facet-artist-image{flex:0 0 26px;width:26px;height:26px;object-fit:cover;border-radius:50%;filter:grayscale(1);opacity:.8;transition:filter 180ms ease,opacity 180ms ease}
.facet-artist-logo{object-fit:contain;border-radius:0;padding:1px;width:26px}
.facet-choice--artist:hover .facet-artist-image,.facet-choice--artist[aria-pressed="true"] .facet-artist-image{filter:none;opacity:1}
.facet-swatch{display:block;flex:0 0 19px;width:19px;height:19px;background:var(--swatch);border-radius:50%;box-shadow:inset 0 0 0 1px #ffffff20,0 2px 5px #0003}
.facet-choice[aria-pressed="true"] .facet-swatch{outline:1px solid var(--fg);outline-offset:2px}
.facet-note{font-size:12px;color:var(--muted);line-height:1.5;margin-top:8px}
.facet-size-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}
.shop-price-range{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.shop-price-range label{display:flex;flex-direction:column;gap:7px;min-width:0;font-size:12px;color:var(--muted)}
.shop-price-range input{width:100%;min-width:0;min-height:44px;padding:10px 12px;border:1px solid #ffffff26;border-radius:5px;background:var(--bg);color:var(--fg);font:600 14px/1.2 var(--font-body);font-variant-numeric:tabular-nums}
.shop-price-range input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.shop-section .facet-choice--size{justify-content:center;padding-inline:6px;font-size:12px;min-height:38px;background:var(--bg)}
.facet-choice--size .facet-label{flex:0}
.facet-choice--size .facet-count{min-width:19px;height:19px;font-size:11px;padding:0 4px;background:color-mix(in srgb,var(--fg) 9%,transparent)}
.shop-filter-actions{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-shrink:0;padding:16px 24px;background:var(--surface);box-shadow:0 -12px 30px color-mix(in srgb,var(--surface) 75%,transparent)}
.shop-reset{display:inline-flex;align-items:center;gap:10px;min-height:44px;font-size:12px;color:var(--muted)}
.shop-reset:hover{color:var(--fg)}
.shop-reset .ui-icon{width:13px;height:13px}
.shop-filter-actions .button{min-width:180px;justify-content:space-between;min-height:44px;border-radius:5px;font-size:12px;letter-spacing:.02em;text-transform:none}

@media(max-width:1100px){.shop-section .shop-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:34px 20px}}
@media(max-width:700px){
  body:has([data-shop-catalog]) .page-intro{padding-top:40px;padding-bottom:24px}
  .shop-section .shop-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 14px}
  .shop-toolbar{gap:12px;flex-wrap:wrap;margin-bottom:20px}
  .shop-filter-toggle{font-size:12px;padding:9px 14px}
  .shop-toolbar [data-shop-count]{font-size:12px;margin-left:auto;margin-right:0}
  .shop-sort{width:100%;justify-content:flex-end;margin-top:-9px;font-size:12px}
  .shop-sort select{font-size:12px}
  .shop-active-filters{margin-top:0;gap:6px}
  .shop-active-filters button{font-size:12px}
  dialog.shop-filter-panel,body[data-surface="frosted"] dialog.shop-filter-panel{inset:10px auto auto 10px;width:calc(100vw - 20px);height:auto;max-height:calc(100dvh - 20px);border-radius:10px}
  .shop-filter-heading{padding:18px 18px 16px;gap:10px}
  .shop-filter-heading h2{font-size:28px;max-width:240px}
  .shop-filter-heading .eyebrow{font-size:12px;margin-bottom:9px}
  .shop-filter-shell{max-height:calc(100dvh - 20px)}
  .shop-filter-body{padding:4px 18px 20px}
  .shop-filter-columns{grid-template-columns:1fr;gap:22px}
  .shop-filter-column{gap:20px}
  .facet-artist-grid{grid-template-columns:1fr}
  .shop-section .facet-choice{font-size:12px;min-height:44px}
  .shop-section .facet-choice--artist{min-height:44px;font-size:13px}
  .shop-filter-actions{padding:15px 18px max(15px,env(safe-area-inset-bottom));gap:16px}
  .shop-filter-actions .button{min-width:0;flex:1;gap:12px;padding:13px 16px;font-size:12px}
  .shop-reset{font-size:12px;white-space:nowrap}
}
@media(max-height:520px){.shop-filter-heading{padding-block:16px}.shop-filter-heading h2{font-size:30px}.shop-filter-actions{padding-block:12px}}
[data-motion="reduced"] .shop-filter-panel,[data-motion="reduced"] .shop-filter-panel::backdrop,[data-motion="reduced"] .shop-filter-toggle{transition:none}
@media(prefers-reduced-motion:reduce){.shop-filter-panel,.shop-filter-panel::backdrop,.shop-filter-toggle,.shop-section .facet-choice,.facet-artist-image{transition:none}}
@media(forced-colors:active){dialog.shop-filter-panel{border:1px solid CanvasText}.facet-choice,.shop-filter-toggle,.shop-filter-close,.shop-active-filters button{border:1px solid ButtonText}.shop-section .facet-choice[aria-pressed="true"]{outline:2px solid Highlight;box-shadow:none}.facet-count{color:CanvasText}.facet-swatch{border:1px solid CanvasText;forced-color-adjust:none}}