/* DIRECT LINK FAST LOADING */
.direct-loading-screen{
position:fixed;
inset:0;
z-index:12000;
display:none;
align-items:center;
justify-content:center;
padding:22px;
background:
radial-gradient(circle at 20% 10%, rgba(19,200,255,.16), transparent 30%),
radial-gradient(circle at 80% 20%, rgba(250,204,21,.10), transparent 26%),
#050607;
}
html.direct-song-loading .direct-loading-screen{
display:flex;
}
html.direct-song-loading .app{
visibility:hidden;
}
.direct-loading-card{
width:min(360px, 100%);
border-radius:24px;
background:#0e1116;
border:1px solid rgba(255,255,255,.10);
box-shadow:0 24px 60px rgba(0,0,0,.55);
padding:24px 20px;
text-align:center;
}
.direct-loading-spinner{
width:42px;
height:42px;
border-radius:999px;
border:3px solid rgba(255,255,255,.12);
border-top-color:var(--blue);
margin:0 auto 14px;
animation:directSpin .72s linear infinite;
}
.direct-loading-card strong{
display:block;
color:#fff;
font-size:18px;
font-weight:950;
}
.direct-loading-card span{
display:block;
margin-top:7px;
color:#9aa0aa;
font-size:12.5px;
font-weight:750;
}
@keyframes directSpin{
to{ transform:rotate(360deg); }
}
#loadMore{
display:none;
margin:16px auto 12px;
height:42px;
border-radius:999px;
border:1px solid rgba(255,255,255,.10);
background:#111318;
color:#fff;
font-size:13px;
font-weight:900;
padding:0 16px;
cursor:pointer;
}
@media (min-width:720px){
.app-shell{
max-width:920px;
}
.premium-card{
min-height:210px;
}
.hero-people{
right:20px;
bottom:-12px;
width:285px;
}
#list{
grid-template-columns:1fr 1fr;
gap:8px 18px;
}
.song-row{
border-bottom:1px solid rgba(255,255,255,.06);
}
.rail{
gap:18px;
}
.album-card{
flex-basis:148px;
}
.album-cover{
width:148px;
}
.deezer-world-list{
grid-template-columns:1fr 1fr;
gap:10px;
}
}
@media (min-width:1024px){
.app-shell{
max-width:1280px;
padding-left:18px;
padding-right:18px;
}
.hero{
padding-left:18px;
padding-right:18px;
}
.premium-card{
min-height:180px;
padding:24px 28px;
border-radius:18px;
}
.premium-content{
max-width:43%;
}
.premium-kicker{
font-size:11px;
}
.premium-title{
font-size:29px;
line-height:1.02;
max-width:420px;
}
.premium-sub{
font-size:13.5px;
max-width:420px;
}
.premium-btn{
height:40px;
padding:0 18px;
}
.hero-mobile{display:none}
.hero-desktop{
display:block;
right:28px;
bottom:0;
width:auto;
height:100%;
max-height:100%;
max-width:52%;
object-fit:contain;
object-position:right bottom;
}
#list{
grid-template-columns:repeat(3,1fr);
gap:8px 22px;
}
.album-card{
flex-basis:158px;
}
.album-cover{
width:158px;
}
.deezer-world-list{
grid-template-columns:repeat(3,1fr);
}
}
@media (min-width:1380px){
.app-shell{
max-width:1500px;
}
.premium-card{
min-height:190px;
}
.premium-title{
font-size:31px;
}
#list{
grid-template-columns:repeat(4,1fr);
}
.hero-desktop{
right:55px;
bottom:0;
height:100%;
max-height:100%;
max-width:50%;
}
}
@media (max-width:390px){
.premium-card{
min-height:188px;
}
.premium-title{
font-size:22px;
}
.premium-content{
max-width:58%;
}
.hero-people{
right:-18px;
bottom:-8px;
width:190px;
max-width:54%;
}
.song-order-cover{
width:116px;
height:116px;
}
.song-order-title{
font-size:19px;
}
}
@media (max-width:365px){
.premium-title{
font-size:21px;
}
.premium-sub{
font-size:11.5px;
}
.song-row{
grid-template-columns:45px 1fr 42px;
}
.song-cover{
width:45px;
height:45px;
}
.album-card{
flex-basis:116px;
}
.album-cover{
width:116px;
}
.hero-people{
width:176px;
}
}