.back-link { color: #eebc69; text-decoration: none; font-weight: 700; }
.back-link:hover, .back-link:focus-visible { text-decoration: underline; }
.album-page { display: block; width: 100%; max-width: 1120px; margin: 0 auto; padding: clamp(48px, 8vw, 110px) 0 95px; }
.album-heading { max-width: 820px; }
.album-heading h1 { font-size: clamp(3.6rem, 8vw, 7.5rem); margin-bottom: 28px; }
.album-intro { color: #d9e2d9; font-size: clamp(1.15rem, 2vw, 1.4rem); line-height: 1.5; max-width: 40rem; }
.album-status { color: #eebc69; font-size: .95rem; margin: 30px 0 0; }
.album-controls { display: flex; flex-wrap: wrap; gap: 12px 18px; align-items: center; border-top: 1px solid #547168; border-bottom: 1px solid #547168; padding: 22px 0; margin: 38px 0 25px; }
.album-controls label { font-size: .82rem; color: #cbd9ce; font-weight: 700; }
.album-controls input, .album-controls select { background: #203b30; color: #f6f2e8; border: 1px solid #779685; border-radius: 8px; font: inherit; padding: 12px 14px; }
.album-controls input { flex: 1 1 280px; min-width: 0; }
.album-controls select { min-width: 130px; }
.album-controls :focus-visible, .album-more:focus-visible { outline: 3px solid #eebc69; outline-offset: 3px; }
.album-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.album-card { position: relative; min-width: 0; padding: 26px 27px 25px 42px; background: #193329; border: 1px solid #3d6150; border-radius: 5px 14px 14px 5px; overflow-wrap: anywhere; }
.album-card:before { content: ''; position: absolute; inset: 0 auto 0 0; width: 10px; background: linear-gradient(#eebc69, #a87949); }
.album-card h2 { margin: 6px 0 0; color: #f6f2e8; font-size: clamp(1.35rem, 2.1vw, 1.9rem); line-height: 1.12; letter-spacing: -.035em; }
.album-artist { color: #eebc69; font-weight: 800; font-size: .85rem; text-transform: uppercase; letter-spacing: .08em; margin: 0; }
.album-comment { color: #d9e2d9; line-height: 1.55; margin: 19px 0 25px; white-space: pre-line; }
.album-youtube { display: inline-block; margin-top: 18px; color: #eebc69; font-size: .9rem; font-weight: 700; text-underline-offset: 4px; }
.album-youtube:hover { color: #f8cd86; }
.album-youtube:focus-visible { outline: 3px solid #eebc69; outline-offset: 4px; }
.album-meta { display: flex; justify-content: space-between; align-items: center; gap: 12px; color: #a9beae; font-size: .87rem; margin-top: 20px; }
.album-meta strong { color: #e8eee5; }
.album-poster { display: inline-flex; align-items: center; gap: 9px; min-width: 0; }
.album-avatar { width: 34px; height: 34px; object-fit: cover; border-radius: 50%; flex: none; background: #315242; }
.album-more { display: block; margin: 34px auto 0; padding: 14px 24px; border: 1px solid #eebc69; border-radius: 6px; color: #102720; background: #eebc69; font: inherit; font-weight: 800; cursor: pointer; }
.album-more[hidden] { display: none; }
@media (max-width: 700px) { .album-list { grid-template-columns: 1fr; } .album-page { padding: 54px 0 70px; } .album-controls label[for="album-search"] { flex-basis: 100%; } }
