.album-detail-page{background:#050505;color:var(--white)}
.album-detail-page:before{content:"";position:fixed;z-index:0;inset:0;background:linear-gradient(rgba(0,0,0,.62),rgba(0,0,0,.9)),url("assets/music-bg.webp") center/cover no-repeat;pointer-events:none}
.album-detail-page .site-header{background:rgba(5,5,5,.92)}
.album-detail-page main,.album-detail-page footer{position:relative;z-index:1}
.album-overview{display:grid;grid-template-columns:minmax(280px,560px) minmax(0,1fr);align-items:center;gap:clamp(52px,8vw,130px);width:min(calc(100% - var(--pad) - var(--pad)),1280px);min-height:0;margin-inline:auto;padding:calc(clamp(130px,16vh,180px) - 20px) 0 0}
.album-detail-cover{position:relative;isolation:isolate;aspect-ratio:1;overflow:hidden;border:1px solid rgba(125,220,255,.28);background-color:#080808;background-position:center;background-size:cover;background-repeat:no-repeat;box-shadow:0 26px 70px rgba(0,0,0,.38)}
.album-detail-cover-08{background-image:radial-gradient(circle at 68% 31%,#f4f0e8 0 1%,#3c6d79 2% 14%,#111820 15% 38%,#751219 39% 42%,#050505 68%)}
.album-detail-cover-09{background-image:radial-gradient(circle at 64% 34%,#eafcff 0 1%,#17647a 2% 16%,#0a1218 17% 42%,#8b1649 43% 45%,#050505 70%)}
.album-detail-cover-07{background-image:linear-gradient(128deg,#060606 0 26%,#484848 27% 43%,#1b91b2 44% 46%,#0b1115 47% 69%,#7a151c 70% 72%,#050505 73%)}
.album-detail-cover-06{background-image:repeating-radial-gradient(circle at 38% 62%,#080808 0 14px,#173c48 15px 17px,#111 18px 31px,#681117 32px 34px)}
.album-detail-cover-05{background-image:linear-gradient(42deg,#050505 0 22%,#74131a 23% 25%,#292929 26% 52%,#17647a 53% 55%,#080808 56%)}
.album-detail-cover-04{background-image:radial-gradient(ellipse at 72% 28%,#dbeef3 0 1%,#1f7188 2% 17%,#090d10 18% 47%,#651219 70%,#050505)}
.album-detail-cover-03{background-image:linear-gradient(150deg,#080808 0 35%,#8c171e 36% 38%,#222 39% 61%,#1c7993 62% 64%,#050505 65%)}
.album-detail-cover-02{background-image:repeating-linear-gradient(118deg,#070707 0 14%,#303030 15% 24%,#12617a 25% 26%,#0b0b0b 27% 41%,#711219 42% 43%)}
.album-detail-cover-01{background-image:radial-gradient(circle at 36% 38%,#ece9df 0 1%,#4c1015 2% 18%,#0a0a0a 19% 53%,#174957 76%,#050505)}
.album-detail-info{min-width:0}
.album-detail-info h1{margin:35px 0 24px;font:500 clamp(58px,7.4vw,112px)/.78 "Space Grotesk";letter-spacing:-.075em;overflow-wrap:anywhere}
.album-detail-artist{margin:0;color:#c7c7c7;font:500 10px/1 "Space Grotesk";letter-spacing:.22em}
.album-detail-info dl{margin:clamp(45px,6vw,80px) 0 0;border-top:1px solid rgba(255,255,255,.18)}
.album-detail-info dl div{display:grid;grid-template-columns:130px 1fr;padding:16px 0;border-bottom:1px solid rgba(255,255,255,.12)}
.album-detail-info dt,.album-detail-info dd{margin:0;font:500 8px/1.4 "Space Grotesk";letter-spacing:.16em}.album-detail-info dt{color:#666}.album-detail-info dd{color:#d2d2d2}
.tracklist-section{width:min(calc(100% - var(--pad) - var(--pad)),1280px);margin-inline:auto;padding:20px 0 clamp(90px,12vw,170px)}
.tracklist-heading{display:grid;grid-template-columns:1fr auto;align-items:end;margin-bottom:20px}
.tracklist-heading:before,.tracklist-heading:after{content:none}
.tracklist-heading h2{margin:0;font:500 clamp(27px,4.5vw,66px)/.8 "Space Grotesk";letter-spacing:-.07em}
.tracklist-heading>span{padding-bottom:8px;color:#777;font:500 8px/1 "Space Grotesk";letter-spacing:.18em}
.tracklist-actions{display:flex;align-items:flex-end;flex-direction:column;gap:14px;padding-bottom:8px}
.tracklist-actions>span{color:#777;font:500 8px/1 "Space Grotesk";letter-spacing:.18em}
.playback-controls{display:grid;grid-template-columns:42px 46px 190px 46px 42px;gap:6px}
.play-all-button{position:relative;display:flex;width:190px;min-height:48px;align-items:center;justify-content:center;padding:0 15px;overflow:hidden;border:1px solid rgba(125,220,255,.6);background:rgba(0,0,0,.42);color:#fff;font:600 9px/1 "Space Grotesk";letter-spacing:.16em;cursor:pointer;transition:border-color .3s ease,background-color .3s ease}
.play-all-button:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(125,220,255,.12),transparent);transform:translateX(-110%);transition:transform .3s ease;pointer-events:none}
.play-all-button b{position:relative;color:#7ddcff;font-size:14px;transition:transform .3s ease}.play-all-button span{position:relative}.play-all-button.is-active{border-color:#7ddcff;background:rgba(125,220,255,.08)}
.track-skip-button{display:grid;min-width:46px;min-height:48px;padding:0;place-items:center;border:1px solid rgba(125,220,255,.46);background:rgba(0,0,0,.42);color:#7ddcff;font:500 17px/1 "Space Grotesk";cursor:pointer;transition:border-color .3s ease,background-color .3s ease,color .3s ease,opacity .3s ease}
.track-skip-button:disabled{opacity:.28;cursor:default}
.skip-icon{display:flex;align-items:center;justify-content:center;gap:2px;width:24px;height:18px}
.skip-icon i{display:block;width:0;height:0;border-top:6px solid transparent;border-bottom:6px solid transparent}
.skip-icon.is-next i{border-left:8px solid currentColor}
.skip-icon.is-previous i{border-right:8px solid currentColor}
.repeat-button{display:grid;min-width:42px;min-height:48px;padding:0;place-items:center;border:1px solid rgba(255,255,255,.2);background:rgba(0,0,0,.36);color:rgba(255,255,255,.52);cursor:pointer;transition:border-color .3s ease,background-color .3s ease,color .3s ease,box-shadow .3s ease}
.repeat-button svg{width:22px;height:22px;overflow:visible;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:square;stroke-linejoin:miter}
.repeat-button text{fill:currentColor;stroke:none;font:700 7px/1 "Space Grotesk";text-anchor:middle}
.repeat-button.is-active{border-color:rgba(125,220,255,.72);background:rgba(125,220,255,.08);color:#7ddcff;box-shadow:0 0 9px rgba(125,220,255,.16)}
.tracklist{margin:0;padding:0;border-top:1px solid rgba(255,255,255,.22);list-style:none}
.track-row{display:grid;grid-template-columns:54px minmax(0,1fr) 64px 92px;align-items:center;gap:18px;min-height:82px;padding:12px 14px;border-bottom:1px solid rgba(255,255,255,.12);background:rgba(0,0,0,.24);transition:background-color .25s ease,border-color .25s ease}
.track-number{color:#168bb5;font:500 9px/1 "Space Grotesk";letter-spacing:.16em}
.track-name{display:flex;min-width:0;flex-direction:column;gap:7px}.track-name strong{font:500 clamp(15px,1.5vw,21px)/1.1 "Space Grotesk";letter-spacing:-.02em;overflow-wrap:anywhere}.track-name small{color:#777;font:500 7px/1 "Space Grotesk";letter-spacing:.15em}
.track-duration{color:#aaa;font:500 8px/1 "Space Grotesk";letter-spacing:.025em;text-align:right;white-space:nowrap}
.track-duration.is-placeholder{justify-self:end;width:24px;color:#d7d7d7;font-size:10px;font-weight:300;letter-spacing:0;text-align:center;opacity:.45}
.track-audio-button{display:flex;align-items:center;justify-content:flex-end;gap:9px;padding:0;border:0;background:none;color:#ddd;cursor:pointer}
.track-audio-button i{display:grid;width:30px;height:30px;place-items:center;border:1px solid rgba(125,220,255,.58);border-radius:50%;color:#bdefff;font:normal 7px/1 "Space Grotesk";text-indent:1px}
.track-audio-button span{width:36px;font:600 7px/1 "Space Grotesk";letter-spacing:.12em;text-align:left}
.track-row.is-playing{border-bottom-color:rgba(237,28,36,.5);background:rgba(237,28,36,.055)}
.track-row.is-playing .track-number,.track-row.is-playing .track-audio-button i{color:var(--red);border-color:rgba(237,28,36,.72)}
.track-row.has-audio-error{opacity:.58}.track-row.has-audio-error .track-audio-button{cursor:default}
.album-back-nav{margin-top:clamp(80px,10vw,130px);padding-top:36px;border-top:1px solid var(--line)}
.album-back-nav a{display:inline-flex;align-items:center;gap:16px;min-height:54px;padding:0 18px;border:1px solid #444;font:500 10px/1 "Space Grotesk";letter-spacing:.16em}
@media(hover:hover) and (pointer:fine){.track-row:hover{border-bottom-color:rgba(125,220,255,.42);background:rgba(125,220,255,.045)}.track-audio-button:hover i{border-color:#bdefff}.play-all-button:hover{border-color:#bdefff;background:rgba(125,220,255,.08)}.play-all-button:hover:before{transform:translateX(110%)}.play-all-button:hover b{transform:translateX(3px)}.track-skip-button:not(:disabled):hover{border-color:#bdefff;background:rgba(125,220,255,.08);color:#d9f8ff}.repeat-button:hover{border-color:rgba(125,220,255,.58);color:#bdefff}.album-back-nav a:hover{border-color:var(--red)}}
@media(max-width:760px){.album-detail-page:before{background-image:linear-gradient(rgba(0,0,0,.6),rgba(0,0,0,.9)),url("assets/music-bg-mobile.webp")}.album-overview{grid-template-columns:1fr;width:calc(100% - var(--pad)*2);min-height:0;gap:52px;padding-top:98px;padding-bottom:0}.album-detail-cover{width:min(100%,480px);margin-inline:auto}.album-detail-info h1{margin:28px 0 20px;font-size:clamp(25px,7.5vw,36px)}.album-detail-info dl{margin-top:42px}.album-detail-info dl div{grid-template-columns:100px 1fr;padding:14px 0}.tracklist-section{width:calc(100% - var(--pad)*2);padding-top:20px}.tracklist-heading{display:block}.tracklist-heading h2{font-size:7.5vw}.tracklist-heading>span{display:block;margin-top:18px;padding:0}.tracklist-actions{align-items:flex-start;gap:12px;margin-top:24px;padding:0}.playback-controls{grid-template-columns:34px 38px minmax(0,1fr) 38px 34px;width:min(100%,350px);gap:4px}.play-all-button{width:100%;min-height:46px;padding-inline:7px;font-size:8px;transition:none}.track-skip-button{min-width:38px;min-height:46px;transition:none}.repeat-button{min-width:34px;min-height:46px;transition:none}.repeat-button svg{width:19px;height:19px}.play-all-button:before{display:none}.play-all-button b{transition:none}.track-row{grid-template-columns:32px minmax(0,1fr) 42px 76px;gap:8px;min-height:76px;padding:10px 4px}.track-name{gap:6px}.track-name strong{font-size:clamp(12px,3.6vw,16px)}.track-name small{font-size:6px}.track-duration{font-size:5.5px;letter-spacing:0}.track-audio-button{gap:6px}.track-audio-button i{width:28px;height:28px}.track-audio-button span{width:34px;font-size:6px}.album-back-nav{margin-top:78px}}
