:root{color-scheme:dark;--bg:#080710;--panel:#15121f;--panel-2:#1b172a;--text:#f7f4ff;--muted:#aca6bd;--line:#ffffff22;--accent:#c8a1ff;--accent-strong:#d0a9ff}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;line-height:1.5}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 80% 15%,#60329435,transparent 38%),radial-gradient(ellipse at 12% 55%,#202b6830,transparent 45%)}
a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid #e4caff;outline-offset:4px}
.wrap{max-width:1200px;margin:0 auto;padding:0 25px;width:100%}
.site-header{position:sticky;top:0;z-index:10;background:#090812e9;backdrop-filter:blur(20px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;padding-top:18px;padding-bottom:18px;gap:20px}
.logo{font-size:17px;font-weight:760;letter-spacing:.03em;white-space:nowrap}.logo span{color:var(--accent)}
.nav-right{display:flex;align-items:center;gap:26px;color:#d0cbdc;font-size:13px}.nav-right a:hover{color:white}
.lang{background:#ffffff10;color:white;border:1px solid #ffffff30;padding:8px 12px;border-radius:20px;white-space:nowrap}
.hero{min-height:570px;display:flex;align-items:center;position:relative;overflow:hidden;background:linear-gradient(90deg,#090812 7%,#090812cf 53%,#08071044),radial-gradient(ellipse at 78% 38%,#8e48c690,transparent 32%),radial-gradient(ellipse at 85% 68%,#263b8d8a,transparent 35%)}
.hero:after{content:"";position:absolute;right:9%;top:11%;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle at 34% 33%,#fff9f0 0 11%,transparent 12%),radial-gradient(circle at 68% 29%,#eadbc6 0 7%,transparent 8%),radial-gradient(circle at 63% 62%,#e1d2be 0 10%,transparent 11%),radial-gradient(circle at 39% 71%,#efe5d5 0 8%,transparent 9%),radial-gradient(circle at 50% 50%,#fffdf7 0%,#f2e8d8 58%,#decfb7 81%,#c8b49b 100%);border:1px solid #fff8ea73;box-shadow:0 0 30px #fff0ca8c,0 0 95px #b88eff40,0 0 150px #b88eff20;opacity:.96}
.stars{position:absolute;inset:0;background-image:radial-gradient(#fff9 1px,transparent 1px),radial-gradient(#d3b7ff9c 1px,transparent 1px);background-size:79px 93px,133px 147px;background-position:13px 9px,43px 37px;opacity:.24}
.hero .wrap{position:relative;z-index:1}.eyebrow{text-transform:uppercase;letter-spacing:.25em;color:#cbaaff;font-size:11px;font-weight:750}
.hero h1{font-size:clamp(45px,6.5vw,86px);line-height:1.08;margin:20px 0;letter-spacing:-.055em;max-width:740px}.hero h1 em{font-style:normal;background:linear-gradient(90deg,#fff,#b993ff);background-clip:text;color:transparent}
.sub{color:#bcb5cb;max-width:540px;line-height:1.9;font-size:15px}
.actions{display:flex;gap:12px;margin-top:32px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:30px;padding:12px 22px;font-size:13px;border:1px solid #ffffff35;background:#ffffff10;color:#fff;transition:background .2s,border-color .2s}
.btn:hover{background:#ffffff1b;border-color:#ffffff70}.btn.primary{background:#c49afa;color:#150d23;border-color:#c49afa;font-weight:750}.btn.primary:hover{background:#d7b8ff}
.section{padding:80px 0}.section-title{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:30px}.section-title h2{font-size:32px;margin:8px 0 0;letter-spacing:-.035em}
.group-head{display:flex;align-items:center;gap:15px;margin:0 0 20px}.group-head h3{font-size:21px;font-weight:650;letter-spacing:.01em;margin:0}.group-head .group-line{height:1px;flex:1;background:#ffffff20}
.catalog-group+.catalog-group{margin-top:58px}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.card{display:block;background:var(--panel);border:1px solid #ffffff14;border-radius:17px;overflow:hidden;transition:transform .2s,border-color .2s}.card:hover{transform:translateY(-5px);border-color:#a47bdb66}
.art{aspect-ratio:1.2;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;isolation:isolate}
.art::before{content:"";position:absolute;inset:0;background-image:radial-gradient(#fff8 1px,transparent 1px);background-size:43px 55px;opacity:.28;z-index:0}
.art .symbol{font-size:90px;filter:drop-shadow(0 0 36px #ffffff55);position:relative;z-index:2}.art.has-cover{background:#171322}.art.has-cover img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;z-index:1}
.art.a{background:radial-gradient(circle at 60% 30%,#ffd18b,#a75c8a 36%,#302147 70%,#121124)}.art.b{background:radial-gradient(circle at 48% 45%,#bc94ff,#483d96 33%,#141d46 65%,#0b0b1c)}.art.c{background:radial-gradient(circle at 48% 65%,#9e9cbb,#39445d 28%,#1b2136 56%,#090c1c)}
.art.album{background:radial-gradient(circle at 48% 39%,#bc91e8 0%,#6a478f 17%,#2e2851 42%,#17152b 67%,#0d0b19 100%)}.art.album .symbol{font-size:108px;font-weight:300}.art.cosmic{background:radial-gradient(circle at 48% 45%,#9d87f8,#352876 45%,#070b23)}.art.midnight{background:radial-gradient(circle at 60% 40%,#4b608f,#151b35 50%,#090b1a)}
.art.album::after{content:"";position:absolute;width:58%;height:70%;border-radius:50%;border:1px solid #ffffff4f;box-shadow:0 0 0 25px #ffffff07,0 0 0 65px #ffffff07,0 0 70px #c296ff3c;transform:rotate(-28deg)}
.card-info{padding:23px}.card-info h4{font-size:21px;margin:0 0 17px;font-weight:680;letter-spacing:.01em}.card .card-cta{font-size:13px;color:#dbc1ff;display:inline-flex;align-items:center;gap:8px}
.empty{border:1px dashed #ffffff24;border-radius:14px;color:#a79db6;padding:25px;font-size:13px;background:#ffffff04}
.about{background:#ffffff05;border-top:1px solid #ffffff0f;border-bottom:1px solid #ffffff0f}.about h2{font-size:32px;margin:12px 0 14px}
footer{padding:35px 25px;text-align:center;color:#8e889e;font-size:12px}
.detail-top{padding:41px 0 0}.backlink{display:inline-flex;align-items:center;color:#cbb5e9;font-size:13px;gap:8px}.backlink:hover{color:white}
.album-hero{display:grid;grid-template-columns:minmax(240px,370px) 1fr;gap:55px;align-items:center;padding:40px 0 50px}.album-hero .art{aspect-ratio:1;box-shadow:0 22px 80px #0008;border-radius:18px;border:1px solid #ffffff16}
.album-hero h1,.song-hero h1{font-size:clamp(36px,5vw,67px);line-height:1.15;letter-spacing:-.045em;margin:15px 0 18px}.album-hero .sub{margin-top:20px}
.album-page .track-section{padding-bottom:90px}.track-header{font-size:29px;margin:10px 0 24px;letter-spacing:-.025em}
.track-list{border-top:1px solid var(--line)}.track-row{display:flex;align-items:center;padding:20px 13px;border-bottom:1px solid var(--line);gap:25px;transition:background .15s}.track-row:hover{background:#ffffff0b}.track-number{width:25px;flex-shrink:0;text-align:center;color:#9189a5;font-variant-numeric:tabular-nums;font-size:13px}.track-name{font-size:17px;flex:1;font-weight:580}.track-play{width:36px;height:36px;border-radius:50%;border:1px solid #ffffff35;display:flex;align-items:center;justify-content:center;background:#ffffff0b;color:#ddc7ff}
.song-hero{display:grid;grid-template-columns:minmax(200px,300px) 1fr;align-items:center;gap:48px;padding:40px 0 48px}.song-hero .art{aspect-ratio:1;border:1px solid #ffffff19;border-radius:16px}.song-hero .art .symbol{font-size:92px}
.song-content{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(280px,1fr);gap:24px;padding-bottom:90px}.content-box{border:1px solid #ffffff1c;border-radius:20px;background:#171321;padding:28px;min-width:0}.content-box h2{font-size:20px;margin:0 0 23px}.content-box p{color:#c8bed2;line-height:1.95;font-size:14px}.lyrics{color:#d8cfe4;line-height:2.25;font-size:14px;white-space:pre-line}
.media-placeholder{min-height:285px;background:radial-gradient(circle at center,#553575,#14111f 65%);border-radius:14px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:28px;color:#c3b1d6}.media-placeholder .symbol{font-size:62px;line-height:1.2;color:#d4b2fc}.media-placeholder p{font-size:13px;margin:14px auto 0;max-width:270px;line-height:1.7}
.media-player{width:100%;display:block;border-radius:14px;max-height:470px;background:#090812}.audio-player{width:100%;margin:12px 0 4px}.audio-title{font-size:12px;color:#bfb1ce;margin:20px 0 5px}.song-extras{display:grid;gap:24px}
@media(max-width:900px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.album-hero{gap:32px}.song-content{grid-template-columns:1fr}.song-extras{grid-template-columns:1fr}}
@media(max-width:720px){.nav{flex-wrap:wrap;padding-top:15px;padding-bottom:15px}.nav-right{gap:17px;font-size:12px;justify-content:space-between;width:100%}.hero{min-height:510px}.hero::after{right:-160px}.grid{grid-template-columns:1fr}.section{padding:55px 0}.section-title h2{font-size:28px}.art{aspect-ratio:1.45}.catalog-group+.catalog-group{margin-top:40px}.album-hero,.song-hero{grid-template-columns:1fr;gap:22px;padding:30px 0 40px}.album-hero .art{max-width:330px;width:100%}.song-hero .art{max-width:240px;width:100%}.album-hero h1,.song-hero h1{font-size:37px}.song-extras{grid-template-columns:1fr}.track-row{gap:14px;padding:17px 4px}.track-name{font-size:15px}.content-box{padding:22px}.detail-top{padding-top:26px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.card,.btn,.track-row{transition:none}}
/* Album tracks and songs have independent audio/video entry points. */
.song-art-link{display:block}
.song-card .card-info h4{margin-bottom:18px}
.song-card .card-info h4 a:hover,.track-name:hover{color:#e4c9ff}
.card-actions,.track-actions{display:flex;flex-wrap:wrap;gap:9px}
.mini-action{display:inline-flex;align-items:center;justify-content:center;padding:9px 14px;background:#ffffff0b;border:1px solid #cbaaff48;border-radius:22px;color:#ead8ff;font-size:12px;white-space:nowrap;transition:background .2s,border-color .2s}
.mini-action:hover{background:#bc8bf829;border-color:#dfbbff}
.track-actions{margin-left:auto}
.player-box{align-self:start}
.media-tabs{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:22px;padding-bottom:18px;border-bottom:1px solid var(--line)}
.media-tab{border:1px solid #ffffff29;background:#ffffff08;color:#c8bad6;padding:11px 19px;border-radius:30px;font-size:13px;font-weight:650;transition:background .2s}
.media-tab:hover{background:#ffffff16;color:#fff}
.media-tab.is-active{background:#c49afa;color:#150d23;border-color:#c49afa}
.media-panel{min-height:100px}
.audio-player{margin:20px 0;accent-color:#c49afa}
.audio-placeholder{min-height:220px}
@media(max-width:720px){.track-row{flex-wrap:wrap}.track-actions{width:100%;margin-left:38px}.mini-action{padding:9px 15px}.song-card .art{aspect-ratio:1.25}}
@media(prefers-reduced-motion:reduce){.mini-action,.media-tab{transition:none}}

/* Persistent on-page music player: plays without navigating to a song page. */
.mini-action.quick-play{font-family:inherit;cursor:pointer}
.mini-action.quick-play.is-playing{background:#c49afa;color:#160c25;border-color:#c49afa;font-weight:700}
body.has-quick-player{padding-bottom:116px}
.quick-player[hidden],.quick-error[hidden]{display:none}
.quick-player{position:fixed;bottom:0;left:0;right:0;z-index:30;background:#12101ef5;border-top:1px solid #cbaaff50;box-shadow:0 -15px 50px #0008;backdrop-filter:blur(24px);padding:11px max(18px,calc((100vw - 1200px)/2 + 25px)) calc(11px + env(safe-area-inset-bottom));}
.quick-player-inner{display:grid;grid-template-columns:52px minmax(140px,1fr) 150px minmax(210px,1.3fr) 30px;align-items:center;column-gap:14px}
.quick-cover{width:52px;height:52px;display:block;overflow:hidden;border:1px solid #ffffff25;border-radius:7px;background:#29203d}
.quick-cover img{display:block;width:100%;height:100%;object-fit:cover}
.quick-song{min-width:0;display:flex;flex-direction:column;gap:3px}
.quick-song a{font-size:14px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;font-weight:650}
.quick-song a:hover{color:#dcb9ff}
.quick-song span{font-size:11px;color:#aca1bb}
.quick-controls{display:flex;align-items:center;justify-content:center;gap:10px}
.quick-control{display:inline-flex;align-items:center;justify-content:center;border:0;background:transparent;color:#e7dbf4;cursor:pointer;width:31px;height:31px;border-radius:50%;font-size:16px;line-height:1}
.quick-control:hover{background:#ffffff24}
.quick-main{width:38px;height:38px;background:#d3afff;color:#1d112c;font-size:19px;font-weight:700}
.quick-main:hover{background:#ead7ff}
.quick-timeline{display:flex;gap:10px;align-items:center;min-width:0}
.quick-timeline span{font-variant-numeric:tabular-nums;color:#aba2b7;font-size:11px;white-space:nowrap}
.quick-timeline input{min-width:0;flex:1;cursor:pointer;accent-color:#d2b3ff}
.quick-close{font-size:24px;color:#aaa0b6}
.quick-error{margin:5px 0 0;text-align:center;font-size:12px;color:#ffbdc5}
@media(max-width:780px){
 body.has-quick-player{padding-bottom:160px}
 .quick-player{padding:10px 14px calc(10px + env(safe-area-inset-bottom))}
 .quick-player-inner{grid-template-columns:44px minmax(0,1fr) auto 25px;grid-template-rows:44px 28px;gap:7px 10px}
 .quick-cover{width:44px;height:44px}
 .quick-song{grid-column:2;grid-row:1}
 .quick-controls{grid-column:3;grid-row:1;gap:0}
 .quick-timeline{grid-column:1 / -1;grid-row:2}
 .quick-close{grid-column:4;grid-row:1;width:25px}
 .quick-control{width:30px;height:30px}
 .quick-main{width:35px;height:35px}
}
@media(max-width:390px){.quick-song span{font-size:10px}.quick-song a{font-size:12px}.quick-controls{gap:0}.quick-controls .quick-control{width:26px}.quick-controls .quick-main{width:30px;height:30px}}

/* Album/song view counters: backend totals on production, explicitly local in preview. */
.view-counter{display:inline-flex;align-items:center;gap:5px;color:#afa6c0;font-size:12px;font-weight:450;font-variant-numeric:tabular-nums;white-space:nowrap;line-height:1.4}
.view-counter svg{color:#b1a3c6;flex:none}
.view-counter .view-value{font-weight:550;color:#c8bdde}
.card-info>.view-counter{display:flex;margin-top:17px}
.album-hero .view-counter,.song-hero .view-counter{display:flex;width:max-content;margin:15px 0 21px;font-size:13px}
.track-info{flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:4px}
.track-info .track-name{flex:none}
.track-info .view-counter{font-size:11px}
@media(max-width:720px){.track-info{flex:1;min-width:155px}.track-info .view-counter{white-space:normal}}