.artist-catalog { padding: 72px 0; background: #091b17; color: #f4eee2; }
.catalog-intro { max-width: 740px; line-height: 1.7; color: #bfcac2; margin: 14px 0 30px; }
.catalog-layout { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(300px, .75fr); gap: 28px; align-items: start; }
.catalog-list-panel, .catalog-player { background: #10241e; border: 1px solid #2b4a3c; border-radius: 16px; padding: 22px; }
.catalog-search-label { display: block; font-size: .86rem; margin-bottom: 10px; color: #e1c984; }
.catalog-search { width: 100%; padding: 13px 15px; background: #071813; border: 1px solid #54735d; border-radius: 8px; color: white; font: inherit; }
.catalog-search:focus-visible, .catalog-play:focus-visible, .catalog-yt:focus-visible { outline: 3px solid #ebd07b; outline-offset: 3px; }
.catalog-count { color: #aabbaf; font-size: .83rem; padding: 10px 0; }
.catalog-row { display: grid; grid-template-columns: 84px minmax(0, 1fr) auto; align-items: center; gap: 16px; border-top: 1px solid #365046; padding: 14px 0; }
.catalog-cover { width: 84px; aspect-ratio: 1; object-fit: cover; border-radius: 7px; background: #233a2c; }
.catalog-info { min-width: 0; }
.catalog-date { display: block; color: #e1c984; font-size: .76rem; margin-bottom: 4px; }
.catalog-info h3 { font-size: 1.08rem; line-height: 1.2; margin: 0 0 6px; color: #fff; }
.catalog-info p { margin: 0; color: #bacdbf; font-size: .87rem; line-height: 1.35; }
.catalog-play { display: inline-block; text-decoration: none; border: 1px solid #d7b96d; border-radius: 100px; padding: 9px 14px; background: transparent; color: #f8e1a0; cursor: pointer; white-space: nowrap; font: inherit; font-weight: 700; }
.catalog-play:hover, .catalog-play.is-active { background: #d8bd74; color: #14241a; }
.catalog-player { position: sticky; top: 86px; }
.catalog-player-kicker { text-transform: uppercase; letter-spacing: .14em; color: #d9bd76; font-size: .75rem; font-weight: 700; }
.catalog-player h3 { margin: 10px 0 4px; font-size: 1.4rem; }
#catalog-release, .catalog-player-note { color: #b9c5bc; font-size: .9rem; }
#catalog-frame-wrap { margin: 18px 0 10px; }
.catalog-yt { display: inline-block; color: #f3d48d; margin-top: 6px; }
[hidden] { display: none !important; }
@media (max-width: 800px) { .catalog-layout { grid-template-columns: 1fr; } .catalog-player { position: static; grid-row: 1; } }
@media (max-width: 500px) { .artist-catalog { padding: 45px 0; } .catalog-list-panel, .catalog-player { padding: 16px; } .catalog-row { grid-template-columns: 62px minmax(0, 1fr); gap: 10px; } .catalog-cover { width: 62px; } .catalog-play { grid-column: 2; justify-self: start; padding: 8px 14px; } }