/* DISCOVYX glass: liquid colour behind frosted, light-edged panels.
   Used by the log in, Premium and support pages (body.glass-page). The verify page carries its own copy. */
.liquid{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.liquid i{position:absolute;border-radius:50%;filter:blur(70px);opacity:.75;will-change:transform}
.liquid i:nth-child(1){width:46vmax;height:46vmax;left:-12vmax;top:-14vmax;background:#f8409a;animation:dx-drift1 19s ease-in-out infinite alternate}
.liquid i:nth-child(2){width:42vmax;height:42vmax;right:-14vmax;top:18vmax;background:#6a3df0;animation:dx-drift2 23s ease-in-out infinite alternate}
.liquid i:nth-child(3){width:38vmax;height:38vmax;left:14vmax;bottom:-20vmax;background:#1f6bff;animation:dx-drift3 27s ease-in-out infinite alternate}
.liquid::after{content:"";position:absolute;inset:0;background:rgba(11,10,18,.66)}
@keyframes dx-drift1{to{transform:translate(14vmax,10vmax) scale(1.15)}}
@keyframes dx-drift2{to{transform:translate(-12vmax,-8vmax) scale(.9)}}
@keyframes dx-drift3{to{transform:translate(8vmax,-12vmax) scale(1.1)}}
@media(prefers-reduced-motion:reduce){.liquid i{animation:none}}

body.glass-page{background:#0b0a12;position:relative;overflow-x:hidden}
body.glass-page>*:not(.liquid){position:relative;z-index:1}

/* The panel */
.glass-page .card,.glass-page .plan,.glass-page .glass{
 background:linear-gradient(160deg,rgba(255,255,255,.13),rgba(255,255,255,.04) 42%,rgba(255,255,255,.07));
 -webkit-backdrop-filter:blur(30px) saturate(170%);backdrop-filter:blur(30px) saturate(170%);
 border:1px solid rgba(255,255,255,.16);border-radius:28px;
 box-shadow:inset 0 1px 0 rgba(255,255,255,.38),inset 0 -1px 0 rgba(255,255,255,.06),inset 0 0 26px rgba(255,255,255,.04),0 30px 80px rgba(0,0,0,.5)}
.glass-page .plan.gold{border-color:rgba(255,215,106,.45);box-shadow:inset 0 1px 0 rgba(255,255,255,.38),inset 0 0 40px rgba(255,200,90,.08),0 30px 80px rgba(0,0,0,.5)}

/* Fields and buttons on glass */
.glass-page input[type=text],.glass-page input[type=email],.glass-page input[type=password],.glass-page input[type=url],.glass-page textarea,.glass-page select{
 background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.18);border-radius:14px;color:#fff;
 box-shadow:inset 0 1px 0 rgba(255,255,255,.14)}
.glass-page input:focus,.glass-page textarea:focus,.glass-page select:focus{outline:none;border-color:#f8409a;box-shadow:0 0 0 3px rgba(248,64,154,.26),0 0 22px rgba(248,64,154,.3)}
.glass-page input::placeholder,.glass-page textarea::placeholder{color:rgba(255,255,255,.42)}
.glass-page .submit,.glass-page .buy{border-radius:999px;box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 10px 30px rgba(248,64,154,.38)}
.glass-page .tabs{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14);border-radius:999px}
.glass-page .tabs button{border-radius:999px}
.glass-page .tabs button.on{background:rgba(255,255,255,.18);box-shadow:inset 0 1px 0 rgba(255,255,255,.3)}
.glass-page .legal{border-top-color:rgba(255,255,255,.12)}
.glass-page .top img{border-radius:11px}