.catalogue-loading {margin:24px 0 48px}
.catalogue-loading>p {font-size:var(--type-body);color:var(--muted);margin:0 0 24px}
.catalogue-placeholder-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.catalogue-loading-roasters .catalogue-placeholder-grid {grid-template-columns:repeat(3,minmax(0,1fr))}
.catalogue-loading-roasters .catalogue-placeholder-media {aspect-ratio:auto;height:190px}
.catalogue-placeholder {min-width:0}
.catalogue-placeholder-media {aspect-ratio:4/3;background:var(--panel);border-radius:var(--radius-card)}
.catalogue-placeholder-line {height:24px;width:80%;background:var(--panel);margin-top:16px;border-radius:var(--radius-control)}
.catalogue-placeholder-line.short {width:55%;height:16px;margin-top:8px}
.catalogue-update {min-height:24px;margin:16px 0;opacity:0;font-size:var(--type-body);color:var(--muted);animation:catalogue-update-reveal 0s 1s forwards}
@keyframes catalogue-update-reveal {to{opacity:1}}
@media(max-width:1000px){.catalogue-placeholder-grid,.catalogue-loading-roasters .catalogue-placeholder-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.catalogue-placeholder-grid{grid-template-columns:1fr;gap:24px}.catalogue-placeholder:nth-child(n+4){display:none}}
@media(max-width:560px){.catalogue-loading-roasters .catalogue-placeholder-grid{grid-template-columns:1fr}.catalogue-loading-roasters .catalogue-placeholder-media{height:180px}}
@media(prefers-reduced-motion:reduce){.catalogue-update{animation:none;opacity:1}}