.collection-toolbar { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:24px; }
.collection-toolbar h3 { margin-bottom:0; }
.collection-view-switch { display:flex; align-items:center; flex-shrink:0; gap:6px; }
.collection-view-button { display:flex; align-items:center; justify-content:center; width:28px; height:36px; opacity:.35; }
.collection-view-button[aria-current], .collection-view-button:hover { opacity:1; }
.collection-view-button:focus-visible { outline:2px solid black; outline-offset:3px; }
.collection-grid-icon { display:grid; grid-template-columns:repeat(2,8px); grid-template-rows:repeat(2,8px); gap:2px; }
.collection-grid-icon i { border:1px solid currentColor; }
.collection-view-button img { display:block; max-width:none; }
.collection-letter .author-name { padding:8px 0; border-top:.5px solid black; }
.collection-letter h1 { color:rgba(0,0,0,.4); margin:0; text-transform:uppercase; }
.collection-browser[data-view="list"] .collection-artists { border-bottom:.5px solid black; }
.collection-browser[data-view="list"] a.author-name:focus-visible { outline:2px solid black; outline-offset:-2px; }
.collection-browser[data-view="list"] a.author-name:focus-visible .author-image { visibility:visible; }
.collection-browser[data-view="list"] .author-image { pointer-events:none; }
.collection-browser[data-view="list"] .author-image img,
.collection-browser[data-view="list"] .author-image video { max-height:55vh; object-fit:contain; object-position:right; width:100%; height:auto; }
.collection-browser[data-view="grid"] .collection-artists { display:grid; grid-template-columns:repeat(5,minmax(0,199px)); justify-content:space-between; gap:58px 30px; padding:78px 40px 0; border-top:.5px solid black; }
.collection-browser[data-view="grid"] .collection-letter { display:none; }
.collection-browser[data-view="grid"] .author { min-width:0; opacity:1; transform:none; }
.collection-browser[data-view="grid"] a.author-name { border:0; padding:0; height:100%; }
.collection-browser[data-view="grid"] a.author-name .container-fluid { display:flex!important; flex-direction:column; align-items:stretch!important; padding:0; }
.collection-browser[data-view="grid"] a.author-name .title-wrapper { max-width:none; width:100%; order:2; margin-top:16px; }
.collection-browser[data-view="grid"] a.author-name h1 { display:block; padding:0; margin:0 0 8px; font-size:18px; line-height:22px; }
.collection-browser[data-view="grid"] a.author-name .details { display:block; font-size:14px; line-height:16px; }
.collection-browser[data-view="grid"] a.author-name .location { font-weight:400; }
.collection-browser[data-view="grid"] .author-image-wrapper { display:block; position:relative; width:100%; height:198px; margin:0; float:none; order:1; }
.collection-browser[data-view="grid"] .author-image { position:static; visibility:visible; width:100%; height:100%; display:flex; align-items:flex-end; }
.collection-browser[data-view="grid"] .author-image img,
.collection-browser[data-view="grid"] .author-image video { width:auto!important; height:auto!important; max-width:100%; max-height:198px; object-fit:contain; object-position:left bottom; transform:none; }
.collection-browser[data-view="grid"] a.author-name:focus-visible { outline:2px solid black; outline-offset:6px; }
@media(min-width:1440px) {
 .collection-browser[data-view="grid"] .collection-artists { padding-left:70px; padding-right:70px; }
}
@media(max-width:1100px) {
 .collection-browser[data-view="grid"] .collection-artists { grid-template-columns:repeat(4,minmax(0,199px)); }
}
@media(max-width:767px) {
 .collection-toolbar { gap:12px; }
 .collection-toolbar h3 { font-size:18px; line-height:24px; }
 .collection-view-button { width:36px; height:44px; }
 .collection-browser[data-view="grid"] .collection-artists { grid-template-columns:repeat(2,minmax(0,1fr)); padding:36px 20px 0; gap:32px 20px; }
 .collection-browser[data-view="grid"] .author-image-wrapper { height:160px; }
 .collection-browser[data-view="grid"] .author-image img,
 .collection-browser[data-view="grid"] .author-image video { max-height:160px; }
 .collection-browser[data-view="list"] a.author-name .title-wrapper { max-width:100%; }
 .collection-browser[data-view="list"] a.author-name .details { display:block; font-size:14px; line-height:18px; margin-top:6px; }
 .collection-browser[data-view="list"] a.author-name { padding:12px 0; }
}
@media(prefers-reduced-motion:reduce) {
 .collection-browser .pre-fade, .collection-browser .fade-in-slide { opacity:1; transform:none; transition:none; }
}

@media(min-width:1440px) {
 .collection-browser .collection-toolbar,
 .collection-browser[data-view="list"] .collection-artists .container-fluid { padding-left:70px; padding-right:70px; }
 .collection-browser[data-view="list"] .author-image-wrapper { position:absolute; left:58.333%; width:310px; margin:0; }
}

/* Match the reference gallery's 600ms image fade without moving the layout. */
.collection-browser[data-view="grid"].collection-lazy-fade .author-image img {
 opacity:0;
 transition:opacity 600ms ease;
}
.collection-browser[data-view="grid"].collection-lazy-fade .author-image img.collection-image-visible {
 opacity:1;
}
@media(prefers-reduced-motion:reduce) {
 .collection-browser[data-view="grid"].collection-lazy-fade .author-image img {
  opacity:1;
  transition:none;
 }
}

/* Render the complete Drive player at its native size, then scale the frame. */
.collection-drive-frame { position:relative; width:100%; aspect-ratio:16/9; overflow:hidden; }
.collection-drive-frame .collection-drive-video { position:absolute; top:0; left:0; border:0; width:640px; max-width:none; height:360px; max-height:none; transform:scale(var(--drive-scale, 1)); transform-origin:top left; }
.collection-browser[data-view="list"] .collection-drive-frame { pointer-events:auto; }