@layer amfr-layout {
.catalog-browser { min-width: 0; padding: 12px 0 calc(var(--player-height, 0px) + 36px); }
.catalog-browser h1, .catalog-browser h2 { overflow-wrap: anywhere; }
.catalog-back { display: inline-flex; align-items: center; min-height: 44px; padding: 6px 0; }
.catalog-search { display: grid; gap: 6px; max-width: 620px; margin: 14px 0; }
.catalog-search input { width: 100%; }
.catalog-results { margin: 20px 0; min-width: 0; }
.catalog-entity-list, .catalog-track-list { display: grid; gap: 12px; min-width: 0; }
.catalog-entity-card {
    display: grid; grid-template-columns: minmax(84px, 120px) minmax(0, 1fr);
    gap: 14px; min-width: 0; padding: 12px;
    border: 1px solid var(--amfr-line); border-radius: var(--amfr-radius-card); background: var(--amfr-surface);
}
.catalog-browser {
    --amfr-line: rgba(212,175,55,.38); --amfr-surface: #111113;
    --amfr-surface-raised: #1c1b18; --amfr-muted: #bcb7a8; --amfr-accent-bright: #e6c65c;
    color: #f3f0e7;
}
.catalog-browser .catalog-summary, .catalog-browser .catalog-track-row, .catalog-browser .catalog-entity-card {
    border-color: var(--amfr-line); background-color: var(--amfr-surface);
}
.catalog-browser .catalog-card-art, .catalog-browser .catalog-art-fallback,
.catalog-browser .catalog-track-cover { background-color: var(--amfr-surface-raised); color: var(--amfr-muted); }
.catalog-browser a, .artist-country, .catalog-browser .amfr-icon-action { color: #e6c65c; }
.catalog-browser a:focus-visible, .catalog-browser button:focus-visible { outline: 2px solid #e6c65c; outline-offset: 4px; }
.catalog-browser .catalog-card-body p, .catalog-browser .catalog-track-body p,
.catalog-browser .catalog-track-number { color: var(--amfr-muted); }
.artist-profile-summary { border-color: rgba(212,175,55,.48); box-shadow: 0 8px 28px rgba(0,0,0,.35); }
.artist-profile-summary .catalog-art-fallback { border: 1px solid rgba(212,175,55,.55); padding: 0; }
.catalog-browser .artist-profile-links a { color: #e6c65c; background: rgba(18,18,20,.9); border-color: rgba(212,175,55,.45); }
.artist-profile-links a:hover { background: rgba(212,175,55,.12); border-color: #d4af37; }
.artist-genres { color: #bcb7a8; }
.catalog-browser .catalog-artist-card {
    display: flex; flex-direction: column; position: relative; gap: 0; padding: 12px;
    background-size: cover; background-position: center; overflow: hidden;
    border-color: rgba(212,175,55,.48); box-shadow: 0 6px 22px rgba(0,0,0,.3);
}
.catalog-artist-card .catalog-card-art { aspect-ratio: 1; padding: 0; width: 100%; border: 1px solid rgba(212,175,55,.3); }
.catalog-artist-card .catalog-card-body { padding: 12px 6px 0; text-align: center; }
.catalog-artist-card .catalog-card-body h2 { color: #e6c65c; line-height: 1.4; }
.catalog-browser .catalog-artist-card .catalog-card-body p { color: #f3f0e7; text-shadow: 0 1px 4px #000; }
.artist-card-open { position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
.catalog-artist-card:hover, .catalog-artist-card:focus-within { border-color: #e6c65c; box-shadow: 0 0 18px rgba(212,175,55,.18); }
[data-artist-stats][data-stale]::after, [data-track-stats][data-stale]::after { content: " \26a0"; color: #e6c65c; }
.catalog-entity-card.is-playing, .catalog-track-row.is-playing { border-color: var(--amfr-accent-bright); }
.catalog-card-art, .catalog-art-fallback {
    display: grid; place-items: center; overflow: hidden; min-width: 0;
    aspect-ratio: 1; border-radius: var(--amfr-radius-control); background: var(--amfr-surface-raised); color: var(--amfr-muted);
    text-align: center; padding: 8px;
}
.catalog-card-art img, .catalog-art-fallback img {
    width: 100%; height: 100%; object-fit: cover; border-radius: inherit;
}
.catalog-card-body, .catalog-track-body { min-width: 0; overflow-wrap: anywhere; }
.catalog-card-body h2 { margin: 0 0 8px; font-size: 1.1rem; }
.catalog-card-body p, .catalog-track-body p { color: var(--amfr-muted); margin: 6px 0; }
.catalog-relation { display: inline-flex; align-items: center; min-height: 44px; margin-inline-end: 10px; }
.catalog-summary {
    display: grid; grid-template-columns: minmax(96px, 180px) minmax(0, 1fr);
    align-items: center; gap: 16px; padding: 16px; margin: 12px 0 20px;
    border: 1px solid var(--amfr-line); border-radius: var(--amfr-radius-panel); background: var(--amfr-surface);
}
.catalog-summary .catalog-art-fallback { width: 100%; }
.catalog-summary p { margin: 4px 0; overflow-wrap: anywhere; }
.catalog-id { color: var(--amfr-muted); font-size: .9rem; }
.artist-profile-summary { background-size: cover; background-position: center; }
.artist-profile-presentation { grid-column: 1 / -1; min-width: 0; }
.artist-biography { white-space: pre-line; line-height: 1.7; max-width: 85ch; }
.artist-profile-links { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 12px; }
.artist-profile-links a { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 12px; border: 1px solid var(--amfr-line); border-radius: var(--amfr-radius-control); }
.catalog-track-row {
    display: grid; grid-template-columns: 22px 48px minmax(0,1fr); gap: 10px;
    align-items: center; min-width: 0; padding: 10px;
    border: 1px solid var(--amfr-line); border-radius: var(--amfr-radius-card); background: var(--amfr-surface);
}
.catalog-track-number { color: var(--amfr-muted); font-variant-numeric: tabular-nums; text-align: center; }
.catalog-track-cover { width: 48px; aspect-ratio: 1; overflow: hidden; border-radius: var(--amfr-radius-control); background: var(--amfr-surface-raised); }
.catalog-track-cover img { width: 100%; height: 100%; object-fit: cover; }
.catalog-track-body { display: grid; gap: 3px; }
.catalog-track-title { font-weight: 700; overflow-wrap: anywhere; }
.catalog-track-actions { grid-column: 1 / -1; display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.catalog-track-actions a { display: inline-flex; align-items: center; min-height: 44px; padding: 8px; }
.catalog-track-actions .amfr-icon-action { width: 38px; min-width: 38px; height: 38px; min-height: 38px; flex: 0 0 38px; }
.catalog-track-actions .amfr-icon-action svg { width: 18px; height: 18px; }
.catalog-browser button, .catalog-browser a { max-width: 100%; }
.catalog-browser [data-i18n] { overflow-wrap: anywhere; }
#browse-actions { align-items: center; }
#browse-actions a { display: inline-flex; align-items: center; min-height: 44px; padding: 8px; }
.amfr-artist-follow { display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.amfr-artist-follow svg { width: 22px; height: 22px; flex: 0 0 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.amfr-artist-follow.is-following { color: var(--amfr-accent); border-color: currentColor; }
#browse-search-groups > section { min-width: 0; }
@media (min-width: 640px) {
    .catalog-entity-list { --amfr-collection-min: 280; --amfr-collection-max: 360; grid-template-columns: repeat(auto-fit, minmax(0, min(100%, var(--amfr-collection-width, 280px)))); justify-content: start; }
    .catalog-entity-card { grid-template-columns: 100px minmax(0,1fr); }
    .catalog-track-row { grid-template-columns: 28px 64px minmax(0,1fr) auto; }
    .catalog-track-cover { width: 64px; }
    .catalog-track-actions { grid-column: auto; }
}
@media (max-width: 360px) {
    .catalog-summary { grid-template-columns: minmax(72px, 96px) minmax(0,1fr); gap: 10px; padding: 10px; }
    .catalog-entity-card { grid-template-columns: 72px minmax(0,1fr); gap: 10px; padding: 9px; }
    .catalog-track-row { grid-template-columns: 20px 40px minmax(0,1fr); padding: 8px; }
    .catalog-track-cover { width: 40px; }
}
@media (orientation: landscape) and (max-height: 500px) {
    .catalog-summary { grid-template-columns: minmax(80px, 120px) minmax(0,1fr); }
}
@media (pointer: coarse) {
    .catalog-back, .catalog-relation, .catalog-track-actions a { min-height: 48px; }
}
@media (min-width: 1200px) {
    #browse-list:has(> .catalog-artist-card) { --amfr-collection-min: 180; --amfr-collection-max: 240; }
}
body:has(#entity-catalog-view.artist-profile-view:not([hidden])) {
    background-image: linear-gradient(rgba(8,8,10,.76), rgba(8,8,10,.84)), var(--amfr-artist-background, none);
    background-size: cover; background-position: center; background-repeat: no-repeat; background-attachment: fixed;
}
.catalog-browser.artist-profile-view .catalog-summary { background-color: rgba(13,13,15,.66); }
.catalog-browser.artist-profile-view .catalog-track-row,
.catalog-browser.artist-profile-view .catalog-entity-card { background-color: rgba(13,13,15,.86); }
.catalog-track-actions .amfr-icon-action { color: #e6c65c; background: #161513; border: 1px solid rgba(212,175,55,.45); }
.catalog-track-actions .amfr-icon-action svg { fill: currentColor; }
.catalog-track-actions .amfr-icon-action--like:not(.is-active) svg { fill: none; stroke: currentColor; stroke-width: 1.7; }
.catalog-track-actions .amfr-icon-action:hover, .catalog-track-actions .amfr-icon-action.is-active { background: rgba(212,175,55,.17); border-color: #d4af37; }
.amfr-track-menu { min-width: 220px; max-width: calc(100vw - 20px); padding: 6px; border: 1px solid rgba(212,175,55,.5); border-radius: 12px; background: #111113; color: #f3f0e7; box-shadow: 0 10px 35px #0009; }
.amfr-track-menu-item { display: flex; gap: 10px; align-items: center; width: 100%; padding: 12px; border: 0; background: transparent; color: inherit; text-align: start; cursor: pointer; }
.amfr-track-menu-icon { color: #e6c65c; width: 24px; text-align: center; }
.amfr-track-menu-item:hover, .amfr-track-menu-item:focus-visible { background: rgba(212,175,55,.13); outline: 1px solid #d4af37; border-radius: 6px; }


@media (max-width: 639px) {
    .catalog-browser.artist-profile-view { padding-top: 6px; }
    .catalog-browser.artist-profile-view > h1 { margin: 8px 0; }
    .catalog-browser.artist-profile-view .artist-profile-summary {
        grid-template-columns: minmax(88px, 112px) minmax(0, 1fr);
        align-items: start; gap: 10px; padding: 10px; margin: 6px 0 12px;
    }
    .catalog-browser.artist-profile-view .artist-profile-summary > .catalog-art-fallback {
        width: 100%; max-width: 112px; aspect-ratio: 1;
    }
    .catalog-browser.artist-profile-view .artist-profile-presentation > p { margin: 2px 0; }
    .catalog-browser.artist-profile-view .artist-biography { line-height: 1.55; margin: 4px 0; }
    .catalog-browser.artist-profile-view .artist-profile-links { gap: 8px; margin-top: 8px; }
    .catalog-browser.artist-profile-view .catalog-results { margin-block: 12px; }
    .catalog-browser.artist-profile-view .catalog-results > h2 {
        margin: 10px 0 6px; font-size: 1.1rem; line-height: 1.25;
    }
    .catalog-browser.artist-profile-view .catalog-entity-list,
    .catalog-browser.artist-profile-view .catalog-track-list { gap: 8px; }
    .catalog-browser.artist-profile-view .catalog-entity-card {
        grid-template-columns: 76px minmax(0, 1fr); gap: 8px; padding: 8px;
    }
    .catalog-browser.artist-profile-view .catalog-entity-card .catalog-card-art {
        width: 100%; max-width: 76px; aspect-ratio: 1;
    }
    .catalog-browser.artist-profile-view .catalog-card-body h2 {
        margin: 0 0 4px; font-size: 1rem; line-height: 1.25;
    }
    .catalog-browser.artist-profile-view .catalog-card-body p { margin: 2px 0; }
    .catalog-browser.artist-profile-view .catalog-track-row {
        grid-template-columns: 20px 40px minmax(0, 1fr); gap: 6px; padding: 8px;
    }
    .catalog-browser.artist-profile-view .catalog-track-cover { width: 40px; }
    .catalog-browser.artist-profile-view .catalog-track-body { gap: 1px; }
    .catalog-browser.artist-profile-view .catalog-track-body > p { margin: 2px 0; line-height: 1.3; }
    .catalog-browser.artist-profile-view .catalog-track-actions { gap: 6px; }
}

}