/* EpicSemtle Design System — Glass material helpers */
/* Uses generated tokens.css variables. Keep this file hand-authored. */

.epic-glass {
  /* Default Glass: stable Figma style f8560251d8bcc248f585e5db8c3b8820e5839dc4. */
  --glass-surface: var(--color-glass-default-surface);
  --glass-stroke-highlight: transparent;
  --glass-stroke: transparent;
  --glass-stroke-shadow: transparent;
  --glass-highlight: var(--color-glass-default-highlight);
  --glass-edge-top: var(--color-glass-default-edge-top);
  --glass-edge-bottom: var(--color-glass-default-edge-bottom);
  --glass-shadow: var(--color-glass-default-shadow);
  --glass-backdrop-blur: 18px;
  --glass-inner-offset-x: 5px;
  --glass-inner-offset-y: 5px;
  --glass-inner-blur: 15px;
  --glass-inner-spread: 0px;
  --glass-shadow-offset-x: 0px;
  --glass-shadow-offset-y: 18px;
  --glass-shadow-blur: 44px;
  --glass-shadow-spread: 0px;
  --glass-border-width: 0px;
  --glass-elevation-shadow: transparent;
  --glass-elevation-offset-x: 0px;
  --glass-elevation-offset-y: 0px;
  --glass-elevation-blur: 0px;
  --glass-elevation-spread: 0px;

  /* CSS approximation of Figma native GLASS / Liquid Glass fields. */
  --glass-liquid-light-intensity: 0.40;
  --glass-liquid-light-angle: 315deg;
  --glass-stroke-angle: 135deg;
  --glass-liquid-refraction: 0.06;
  --glass-liquid-depth: 8;
  --glass-liquid-dispersion: 0.015;
  --glass-liquid-frost-radius: 24px;

  position: relative;
  isolation: isolate;
  overflow: hidden;
  background:
    linear-gradient(var(--glass-surface), var(--glass-surface)) padding-box,
    linear-gradient(
      var(--glass-stroke-angle),
      var(--glass-stroke-highlight) 0%,
      var(--glass-stroke) 42%,
      var(--glass-stroke-shadow) 100%
    ) border-box;
  border: var(--glass-border-width) solid transparent;
  box-shadow:
    inset var(--glass-inner-offset-x) var(--glass-inner-offset-y) var(--glass-inner-blur) var(--glass-inner-spread) var(--glass-highlight),
    inset 0 1px 0 var(--glass-edge-top),
    inset 0 -1px 0 var(--glass-edge-bottom),
    var(--glass-shadow-offset-x) var(--glass-shadow-offset-y) var(--glass-shadow-blur) var(--glass-shadow-spread) var(--glass-shadow),
    var(--glass-elevation-offset-x) var(--glass-elevation-offset-y) var(--glass-elevation-blur) var(--glass-elevation-spread) var(--glass-elevation-shadow);
  -webkit-backdrop-filter:
    blur(var(--glass-backdrop-blur))
    saturate(calc(1 + var(--glass-liquid-light-intensity)))
    contrast(calc(1 + var(--glass-liquid-refraction)));
  backdrop-filter:
    blur(var(--glass-backdrop-blur))
    saturate(calc(1 + var(--glass-liquid-light-intensity)))
    contrast(calc(1 + var(--glass-liquid-refraction)));
}

.epic-glass::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  border-radius: inherit;
  background:
    linear-gradient(
      var(--glass-liquid-light-angle),
      color-mix(in srgb, var(--glass-highlight) 72%, transparent) 0%,
      transparent 42%,
      color-mix(in srgb, var(--glass-stroke) 38%, transparent) 100%
    ),
    radial-gradient(
      circle at 18% 12%,
      color-mix(in srgb, white calc(var(--glass-liquid-light-intensity) * 100%), transparent) 0%,
      transparent 48%
    );
  opacity: calc(0.55 + var(--glass-liquid-light-intensity));
  mix-blend-mode: screen;
}

.epic-glass::after {
  content: "";
  position: absolute;
  inset: -1px;
  z-index: -1;
  pointer-events: none;
  border-radius: inherit;
  background:
    linear-gradient(
      90deg,
      color-mix(in srgb, #7dd3fc calc(var(--glass-liquid-dispersion) * 900%), transparent),
      transparent 32%,
      color-mix(in srgb, #f0abfc calc(var(--glass-liquid-dispersion) * 900%), transparent)
    );
  opacity: calc(var(--glass-liquid-refraction) * 2.4);
  transform:
    translate3d(
      calc(var(--glass-liquid-depth) * 0.16px),
      calc(var(--glass-liquid-depth) * 0.12px),
      0
    );
  filter: blur(var(--glass-liquid-frost-radius));
}

.epic-glass--soft {
  /* Complete pre-Default Soft geometry; do not inherit Default material geometry. */
  --glass-edge-top: transparent;
  --glass-edge-bottom: transparent;
  --glass-inner-offset-x: var(--effect-glass-inner-offset-x);
  --glass-inner-offset-y: var(--effect-glass-inner-offset-y);
  --glass-inner-blur: var(--effect-glass-inner-blur);
  --glass-inner-spread: var(--effect-glass-inner-spread);
  --glass-shadow-offset-x: var(--effect-glass-shadow-offset-x);
  --glass-shadow-offset-y: var(--effect-glass-shadow-offset-y);
  --glass-shadow-spread: var(--effect-glass-shadow-spread);
  --glass-border-width: 1px;
  --glass-liquid-light-angle: 135deg;
  --glass-surface: var(--color-glass-soft-surface);
  --glass-stroke-highlight: var(--color-glass-soft-stroke-highlight);
  --glass-stroke: var(--color-glass-soft-stroke);
  --glass-stroke-shadow: var(--color-glass-soft-stroke-shadow);
  --glass-highlight: var(--color-glass-soft-highlight);
  --glass-shadow: var(--color-glass-soft-shadow);
  --glass-backdrop-blur: var(--effect-glass-soft-backdrop-blur);
  --glass-shadow-blur: var(--effect-glass-soft-shadow-blur);
  --glass-liquid-light-intensity: 0.18;
  --glass-liquid-refraction: 0.06;
  --glass-liquid-depth: 8;
  --glass-liquid-dispersion: 0.015;
  --glass-liquid-frost-radius: 24px;
}

.epic-glass--contrast {
  /* Deprecated compatibility alias: use .epic-glass--soft. */
  --glass-edge-top: transparent;
  --glass-edge-bottom: transparent;
  --glass-inner-offset-x: var(--effect-glass-inner-offset-x);
  --glass-inner-offset-y: var(--effect-glass-inner-offset-y);
  --glass-inner-blur: var(--effect-glass-inner-blur);
  --glass-inner-spread: var(--effect-glass-inner-spread);
  --glass-shadow-offset-x: var(--effect-glass-shadow-offset-x);
  --glass-shadow-offset-y: var(--effect-glass-shadow-offset-y);
  --glass-shadow-spread: var(--effect-glass-shadow-spread);
  --glass-border-width: 1px;
  --glass-liquid-light-angle: 135deg;
  --glass-surface: var(--color-glass-soft-surface);
  --glass-stroke-highlight: var(--color-glass-soft-stroke-highlight);
  --glass-stroke: var(--color-glass-soft-stroke);
  --glass-stroke-shadow: var(--color-glass-soft-stroke-shadow);
  --glass-highlight: var(--color-glass-soft-highlight);
  --glass-shadow: var(--color-glass-soft-shadow);
  --glass-backdrop-blur: var(--effect-glass-soft-backdrop-blur);
  --glass-shadow-blur: var(--effect-glass-soft-shadow-blur);
  --glass-liquid-light-intensity: 0.18;
  --glass-liquid-refraction: 0.06;
  --glass-liquid-depth: 8;
  --glass-liquid-dispersion: 0.015;
  --glass-liquid-frost-radius: 24px;
}

.epic-glass--middle {
  --glass-edge-top: transparent;
  --glass-edge-bottom: transparent;
  --glass-inner-offset-x: var(--effect-glass-inner-offset-x);
  --glass-inner-offset-y: var(--effect-glass-inner-offset-y);
  --glass-inner-blur: var(--effect-glass-inner-blur);
  --glass-inner-spread: var(--effect-glass-inner-spread);
  --glass-shadow-offset-x: var(--effect-glass-shadow-offset-x);
  --glass-shadow-offset-y: var(--effect-glass-shadow-offset-y);
  --glass-shadow-spread: var(--effect-glass-shadow-spread);
  --glass-border-width: 1px;
  --glass-liquid-light-angle: 135deg;
  --glass-surface: var(--color-glass-middle-surface);
  --glass-stroke-highlight: var(--color-glass-middle-stroke-highlight);
  --glass-stroke: var(--color-glass-middle-stroke);
  --glass-stroke-shadow: var(--color-glass-middle-stroke-shadow);
  --glass-highlight: var(--color-glass-middle-highlight);
  --glass-shadow: var(--color-glass-middle-shadow);
  --glass-backdrop-blur: var(--effect-glass-middle-backdrop-blur);
  --glass-shadow-blur: var(--effect-glass-middle-shadow-blur);
  --glass-liquid-light-intensity: 0.24;
  --glass-liquid-refraction: 0.08;
  --glass-liquid-depth: 10;
  --glass-liquid-dispersion: 0.02;
  --glass-liquid-frost-radius: 26px;
}

.epic-glass--strong {
  --glass-edge-top: transparent;
  --glass-edge-bottom: transparent;
  --glass-inner-offset-x: var(--effect-glass-inner-offset-x);
  --glass-inner-offset-y: var(--effect-glass-inner-offset-y);
  --glass-inner-blur: var(--effect-glass-inner-blur);
  --glass-inner-spread: var(--effect-glass-inner-spread);
  --glass-shadow-offset-x: var(--effect-glass-shadow-offset-x);
  --glass-shadow-offset-y: var(--effect-glass-shadow-offset-y);
  --glass-shadow-spread: var(--effect-glass-shadow-spread);
  --glass-border-width: 1px;
  --glass-liquid-light-angle: 135deg;
  --glass-surface: var(--color-glass-strong-surface);
  --glass-stroke-highlight: var(--color-glass-strong-stroke-highlight);
  --glass-stroke: var(--color-glass-strong-stroke);
  --glass-stroke-shadow: var(--color-glass-strong-stroke-shadow);
  --glass-highlight: var(--color-glass-strong-highlight);
  --glass-shadow: var(--color-glass-strong-shadow);
  --glass-backdrop-blur: var(--effect-glass-strong-backdrop-blur);
  --glass-shadow-blur: var(--effect-glass-strong-shadow-blur);
  --glass-liquid-light-intensity: 0.14;
  --glass-liquid-refraction: 0.05;
  --glass-liquid-depth: 7;
  --glass-liquid-dispersion: 0.012;
  --glass-liquid-frost-radius: 20px;
}

.epic-glass--solid {
  --glass-edge-top: transparent;
  --glass-edge-bottom: transparent;
  --glass-inner-offset-x: var(--effect-glass-inner-offset-x);
  --glass-inner-offset-y: var(--effect-glass-inner-offset-y);
  --glass-inner-blur: var(--effect-glass-inner-blur);
  --glass-inner-spread: var(--effect-glass-inner-spread);
  --glass-shadow-offset-x: var(--effect-glass-shadow-offset-x);
  --glass-shadow-offset-y: var(--effect-glass-shadow-offset-y);
  --glass-shadow-spread: var(--effect-glass-shadow-spread);
  --glass-border-width: 1px;
  --glass-liquid-light-angle: 135deg;
  --glass-surface: var(--color-glass-solid-surface);
  --glass-stroke-highlight: var(--color-glass-solid-stroke-highlight);
  --glass-stroke: var(--color-glass-solid-stroke);
  --glass-stroke-shadow: var(--color-glass-solid-stroke-shadow);
  --glass-highlight: var(--color-glass-solid-highlight);
  --glass-shadow: var(--color-glass-solid-shadow);
  --glass-backdrop-blur: var(--effect-glass-solid-backdrop-blur);
  --glass-shadow-blur: var(--effect-glass-solid-shadow-blur);
  --glass-liquid-light-intensity: 0.10;
  --glass-liquid-refraction: 0.03;
  --glass-liquid-depth: 5;
  --glass-liquid-dispersion: 0.008;
  --glass-liquid-frost-radius: 14px;
}

.epic-glass--flat {
  --glass-edge-top: transparent;
  --glass-edge-bottom: transparent;
  --glass-inner-offset-x: var(--effect-glass-inner-offset-x);
  --glass-inner-offset-y: var(--effect-glass-inner-offset-y);
  --glass-inner-blur: var(--effect-glass-inner-blur);
  --glass-inner-spread: var(--effect-glass-inner-spread);
  --glass-shadow-offset-x: var(--effect-glass-shadow-offset-x);
  --glass-shadow-offset-y: var(--effect-glass-shadow-offset-y);
  --glass-shadow-spread: var(--effect-glass-shadow-spread);
  --glass-border-width: 1px;
  --glass-liquid-light-angle: 135deg;
  --glass-surface: var(--color-glass-soft-surface);
  --glass-stroke-highlight: var(--color-glass-soft-stroke);
  --glass-stroke: var(--color-glass-soft-stroke);
  --glass-stroke-shadow: var(--color-glass-soft-stroke);
  --glass-highlight: transparent;
  --glass-shadow: transparent;
  --glass-backdrop-blur: 0px;
  --glass-shadow-blur: 0px;
  --glass-liquid-light-intensity: 0;
  --glass-liquid-refraction: 0;
  --glass-liquid-depth: 0;
  --glass-liquid-dispersion: 0;
  --glass-liquid-frost-radius: 0px;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.epic-glass--flat::before,
.epic-glass--flat::after {
  display: none;
}

.epic-glass[class*="epic-glass--elevation-"] {
  /* Elevation uses its own outside shadow. Keep the base material shadow off
     so it does not show through the transparent glass surface and darken it. */
  --glass-shadow: transparent;
}

.epic-glass--elevation-1,
.epic-glass--elevation-bottom-1 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-1);
  --glass-elevation-offset-x: var(--effect-elevation-bottom-1-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-bottom-1-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-1-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-1-spread);
}

.epic-glass--elevation-2,
.epic-glass--elevation-bottom-2 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-2);
  --glass-elevation-offset-x: var(--effect-elevation-bottom-2-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-bottom-2-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-2-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-2-spread);
}

.epic-glass--elevation-3,
.epic-glass--elevation-bottom-3 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-3);
  --glass-elevation-offset-x: var(--effect-elevation-bottom-3-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-bottom-3-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-3-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-3-spread);
}

.epic-glass--elevation-4,
.epic-glass--elevation-bottom-4 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-4);
  --glass-elevation-offset-x: var(--effect-elevation-bottom-4-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-bottom-4-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-4-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-4-spread);
}

.epic-glass--elevation-5,
.epic-glass--elevation-bottom-5 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-5);
  --glass-elevation-offset-x: var(--effect-elevation-bottom-5-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-bottom-5-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-5-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-5-spread);
}

.epic-glass--elevation-top-1 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-1);
  --glass-elevation-offset-x: var(--effect-elevation-top-1-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-top-1-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-1-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-1-spread);
}

.epic-glass--elevation-top-2 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-2);
  --glass-elevation-offset-x: var(--effect-elevation-top-2-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-top-2-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-2-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-2-spread);
}

.epic-glass--elevation-top-3 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-3);
  --glass-elevation-offset-x: var(--effect-elevation-top-3-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-top-3-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-3-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-3-spread);
}

.epic-glass--elevation-top-4 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-4);
  --glass-elevation-offset-x: var(--effect-elevation-top-4-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-top-4-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-4-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-4-spread);
}

.epic-glass--elevation-top-5 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-5);
  --glass-elevation-offset-x: var(--effect-elevation-top-5-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-top-5-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-5-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-5-spread);
}

.epic-glass--elevation-center-1 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-1);
  --glass-elevation-offset-x: var(--effect-elevation-center-1-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-center-1-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-1-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-1-spread);
}

.epic-glass--elevation-center-2 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-2);
  --glass-elevation-offset-x: var(--effect-elevation-center-2-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-center-2-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-2-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-2-spread);
}

.epic-glass--elevation-center-3 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-3);
  --glass-elevation-offset-x: var(--effect-elevation-center-3-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-center-3-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-3-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-3-spread);
}

.epic-glass--elevation-center-4 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-4);
  --glass-elevation-offset-x: var(--effect-elevation-center-4-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-center-4-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-4-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-4-spread);
}

.epic-glass--elevation-center-5 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-5);
  --glass-elevation-offset-x: var(--effect-elevation-center-5-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-center-5-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-5-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-5-spread);
}

.epic-glass--elevation-left-1 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-1);
  --glass-elevation-offset-x: var(--effect-elevation-left-1-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-left-1-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-1-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-1-spread);
}

.epic-glass--elevation-left-2 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-2);
  --glass-elevation-offset-x: var(--effect-elevation-left-2-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-left-2-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-2-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-2-spread);
}

.epic-glass--elevation-left-3 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-3);
  --glass-elevation-offset-x: var(--effect-elevation-left-3-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-left-3-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-3-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-3-spread);
}

.epic-glass--elevation-left-4 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-4);
  --glass-elevation-offset-x: var(--effect-elevation-left-4-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-left-4-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-4-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-4-spread);
}

.epic-glass--elevation-left-5 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-5);
  --glass-elevation-offset-x: var(--effect-elevation-left-5-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-left-5-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-5-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-5-spread);
}

.epic-glass--elevation-right-1 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-1);
  --glass-elevation-offset-x: var(--effect-elevation-right-1-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-right-1-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-1-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-1-spread);
}

.epic-glass--elevation-right-2 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-2);
  --glass-elevation-offset-x: var(--effect-elevation-right-2-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-right-2-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-2-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-2-spread);
}

.epic-glass--elevation-right-3 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-3);
  --glass-elevation-offset-x: var(--effect-elevation-right-3-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-right-3-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-3-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-3-spread);
}

.epic-glass--elevation-right-4 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-4);
  --glass-elevation-offset-x: var(--effect-elevation-right-4-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-right-4-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-4-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-4-spread);
}

.epic-glass--elevation-right-5 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-5);
  --glass-elevation-offset-x: var(--effect-elevation-right-5-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-right-5-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-5-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-5-spread);
}

.epic-glass--elevation-bottom-left-1 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-1);
  --glass-elevation-offset-x: var(--effect-elevation-bottom-left-1-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-bottom-left-1-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-1-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-1-spread);
}

.epic-glass--elevation-bottom-left-2 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-2);
  --glass-elevation-offset-x: var(--effect-elevation-bottom-left-2-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-bottom-left-2-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-2-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-2-spread);
}

.epic-glass--elevation-bottom-left-3 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-3);
  --glass-elevation-offset-x: var(--effect-elevation-bottom-left-3-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-bottom-left-3-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-3-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-3-spread);
}

.epic-glass--elevation-bottom-left-4 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-4);
  --glass-elevation-offset-x: var(--effect-elevation-bottom-left-4-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-bottom-left-4-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-4-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-4-spread);
}

.epic-glass--elevation-bottom-left-5 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-5);
  --glass-elevation-offset-x: var(--effect-elevation-bottom-left-5-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-bottom-left-5-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-5-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-5-spread);
}

.epic-glass--elevation-bottom-right-1 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-1);
  --glass-elevation-offset-x: var(--effect-elevation-bottom-right-1-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-bottom-right-1-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-1-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-1-spread);
}

.epic-glass--elevation-bottom-right-2 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-2);
  --glass-elevation-offset-x: var(--effect-elevation-bottom-right-2-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-bottom-right-2-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-2-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-2-spread);
}

.epic-glass--elevation-bottom-right-3 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-3);
  --glass-elevation-offset-x: var(--effect-elevation-bottom-right-3-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-bottom-right-3-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-3-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-3-spread);
}

.epic-glass--elevation-bottom-right-4 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-4);
  --glass-elevation-offset-x: var(--effect-elevation-bottom-right-4-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-bottom-right-4-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-4-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-4-spread);
}

.epic-glass--elevation-bottom-right-5 {
  --glass-elevation-shadow: var(--color-glass-elevation-shadow-5);
  --glass-elevation-offset-x: var(--effect-elevation-bottom-right-5-offset-x);
  --glass-elevation-offset-y: var(--effect-elevation-bottom-right-5-offset-y);
  --glass-elevation-blur: var(--effect-glass-elevation-5-blur);
  --glass-elevation-spread: var(--effect-glass-elevation-5-spread);
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .epic-glass {
    background: color-mix(in srgb, var(--glass-surface) 88%, var(--color-layout-bg-panel, white));
  }
}