/* Browser adaptation of the supplied Figma Glass preset.
   Light -45deg / 80%, Refraction 80, Depth 20, Dispersion 50, Frost 4, Splay 0.
   CSS approximates the optical edge with directional gradients and split highlights;
   it does not reproduce Figma's proprietary refraction renderer pixel for pixel. */
:root{
  --glass-light-angle:135deg;
  --glass-light-intensity:.8;
  --glass-refraction:.8;
  --glass-depth:20px;
  --glass-dispersion:.5;
  --glass-frost:4px;
  --glass-fill:.05;
}
.application-site .glass-button,.site-header .discord-link,#presentation .play-icon,#presentation .video-toggle{position:relative}
.application-site .glass-button,.site-header .discord-link,#presentation .presentation-apply,#presentation .video-toggle,#presentation .play-icon{
  isolation:isolate;
  border:1px solid rgb(255 255 255 / .08);
  background:
    radial-gradient(ellipse at 0 0,rgb(255 255 255 / .055),transparent 70%),
    linear-gradient(var(--glass-light-angle),rgb(255 255 255 / .035),transparent 45%,rgb(255 255 255 / .018)),
    rgb(255 255 255 / var(--glass-fill));
  -webkit-backdrop-filter:blur(var(--glass-frost)) saturate(1.1);
  backdrop-filter:blur(var(--glass-frost)) saturate(1.1);
  box-shadow:
    inset .7px .7px 1px rgb(255 255 255 / calc(var(--glass-light-intensity)*.38)),
    inset -.7px -.7px 1px rgb(255 255 255 / calc(var(--glass-light-intensity)*.18)),
    inset 1px 1px 3px rgb(175 216 255 / calc(var(--glass-dispersion)*.11)),
    inset -1px -.5px 2px rgb(255 199 218 / calc(var(--glass-dispersion)*.09)),
    inset 0 0 var(--glass-depth) rgb(255 255 255 / .035);
}
.application-site .glass-button::before,.site-header .discord-link::before,#presentation .presentation-apply::before,#presentation .video-toggle::before,#presentation .play-icon::before{
  content:'';position:absolute;inset:-1px;border-radius:inherit;padding:1px;pointer-events:none;
  background:linear-gradient(var(--glass-light-angle),
    rgb(255 255 255 / calc(var(--glass-light-intensity)*.7)) 0%,
    rgb(255 255 255 / .13) 22%,rgb(255 255 255 / .025) 48%,
    rgb(255 255 255 / calc(var(--glass-refraction)*.28)) 76%,
    rgb(255 255 255 / .1) 100%);
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
}
.application-site .glass-button:hover:not(:disabled),.site-header .discord-link:hover,#presentation .presentation-apply:hover,#presentation .video-toggle:hover,#presentation .promo-play:hover .play-icon{
  --glass-fill:.085;
  background:
    radial-gradient(ellipse at 0 0,rgb(255 255 255 / .075),transparent 70%),
    linear-gradient(var(--glass-light-angle),rgb(255 255 255 / .04),transparent 45%,rgb(255 255 255 / .02)),
    rgb(255 255 255 / var(--glass-fill));
}
@media(forced-colors:active){
 .application-site .glass-button,.site-header .discord-link,#presentation .presentation-apply,#presentation .video-toggle,#presentation .play-icon{border:1px solid ButtonText;background:ButtonFace;box-shadow:none;backdrop-filter:none}
 .application-site .glass-button::before,.site-header .discord-link::before,#presentation .presentation-apply::before,#presentation .video-toggle::before,#presentation .play-icon::before{display:none}
}
