.card{width:300px;height:400px;background:#f8fafc;position:relative;display:flex;place-content:center;place-items:center;overflow:hidden;border-radius:20px;transition:all .3s ease}.dark .card{background:#0f172a}.card h2{color:#1e293b;font-size:2em;transition:color .3s ease;text-align:center;display:flex;align-items:center;justify-content:center;word-wrap:break-word;hyphens:auto}.dark .card h2{color:transparent}.card:before{content:"";position:absolute;width:100px;background-image:linear-gradient(180deg,rgb(6,182,212),rgb(59,130,246));height:130%;animation:rotBGimg 3s linear infinite;transition:all .2s linear}@keyframes rotBGimg{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.card:after{content:"";position:absolute;background:#f8fafc;inset:5px;border-radius:15px;transition:background .3s ease}.dark .card:after{background:#0f172a}.e-card{margin:10px auto;background:rgba(255,255,255,.1);box-shadow:0 8px 28px -9px rgba(0,0,0,.45);position:relative;width:240px;height:330px;border-radius:16px;overflow:hidden;transition:all .3s ease;backdrop-filter:blur(10px)}.dark .e-card{background:rgba(17,24,39,.5);box-shadow:0 8px 28px -9px rgba(0,0,0,.8)}.wave{position:absolute;width:540px;height:700px;opacity:.6;left:0;top:0;margin-left:-50%;margin-top:-70%;background:linear-gradient(744deg,#af40ff,#5b42f3 60%,#00ddeb);transition:opacity .3s ease}.dark .wave{opacity:.8}.icon{width:3em;margin-top:-1em;padding-bottom:1em}.infotop{text-align:center;font-size:20px;position:absolute;top:5.6em;left:0;right:0;color:rgb(255,255,255);font-weight:600;transition:color .3s ease;padding:0 10px;line-height:1.6}.dark .infotop{color:rgb(240,245,255)}.name{font-size:14px;font-weight:500;position:relative;top:.5em;text-transform:lowercase;transition:color .3s ease;line-height:1.5;word-wrap:break-word;overflow-wrap:break-word;letter-spacing:.3px}.dark .e-card .infotop .name.subtitle-green,.dark .e-card.playing .infotop .name.subtitle-green,.dark .infotop .name.subtitle-green,.e-card .infotop .name.subtitle-green,.e-card.playing .infotop .name.subtitle-green,.infotop .name.subtitle-green{color:#ffffff!important;-webkit-text-fill-color:#ffffff!important;font-weight:500!important;text-shadow:0 2px 4px rgba(0,0,0,.5)!important;letter-spacing:.3px!important}.wave:nth-child(2),.wave:nth-child(3){top:210px}.playing .wave{border-radius:40%;animation:wave 3s linear infinite}.wave{border-radius:40%;animation:wave 55s linear infinite}.playing .wave:nth-child(2){animation-duration:4s}.wave:nth-child(2){animation-duration:50s}.playing .wave:nth-child(3){animation-duration:5s}.wave:nth-child(3){animation-duration:45s}@keyframes wave{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}