body,html{width:100%;height:100%}body{background:linear-gradient(-45deg,#ee7752,#e73c7e,#23a6d5,#23d5ab);background-size:400% 400%;animation:gradient 15s ease infinite;font-family:Arial,sans-serif;margin:0;padding:0;position:relative}@keyframes gradient{0%{background-position:0 50%}50%{background-position:100% 50%}to{background-position:0 50%}}footer,header{background-color:#333;color:white;padding:1rem;text-align:center}main{padding:2rem}.card,main{text-align:center}.card{width:340px;min-height:200px;border-radius:1rem;background:linear-gradient(135deg,#4158D0,#C850C0 46%,#FFCC70);box-shadow:0 8px 32px 0 rgba(31,38,135,.37);display:flex;flex-direction:column;justify-content:center;align-items:center;padding:32px 24px;color:#fff}.card h1{font-size:2rem;margin:0 0 1rem;font-weight:700}.card h2{font-size:1.2rem;margin:0;font-weight:400}.e-card{margin:100px auto;background:transparent;box-shadow:0 8px 28px -9px rgba(0,0,0,.45);position:relative;width:240px;height:330px;border-radius:16px;overflow:hidden}.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)}.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}.name{font-size:14px;font-weight:100;position:relative;top:1em}.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)}}body:after{content:"";position:fixed;inset:0;pointer-events:none;background:rgba(0,0,0,.35);z-index:1}.e-card,.lang-switcher{position:relative;z-index:2}.version-label{position:fixed;right:18px;bottom:12px;color:#fff;background:transparent;padding:6px 16px;border-radius:8px;font-size:.98em;z-index:100;box-shadow:none;pointer-events:none;user-select:none}.gradient-bg,.gradient-fade{position:fixed;inset:0;z-index:0;pointer-events:none;width:100vw;height:100vh;background-size:400% 400%;animation:gradient 15s ease infinite;transition:opacity 1.5s}.gradient-bg{opacity:1}.gradient-fade{opacity:0;background:transparent}@media (max-width:600px){.e-card{width:95vw;height:auto;margin:40px auto}.version-label{font-size:.85em;padding:4px 10px;right:8px;bottom:8px}}@media (min-width:601px) and (max-width:1024px){.e-card{width:70vw;height:auto;margin:60px auto}}.input-group{position:relative;width:100%}.input{width:100%;padding:1.2rem 1rem .5rem;border:1.5px solid #9e9e9e;border-radius:1rem;font-size:1rem;color:#222;background:none;outline:none;transition:border .15s cubic-bezier(.4,0,.2,1)}.user-label{position:absolute;left:1rem;top:1.1rem;color:#888;pointer-events:none;background:#fff;padding:0 .2em;transition:.15s cubic-bezier(.4,0,.2,1),color .15s;font-size:1rem}.input:focus+.user-label,.input:not(:placeholder-shown)+.user-label{font-size:.8rem;top:.3rem;color:#1565c0;background:#fff}.input-group.bottom-left{position:fixed;left:18px;bottom:12px;z-index:101;display:flex;flex-direction:column;align-items:flex-start}