:root {
  --lz-base-background-colour: #1E1F22;
  --lz-base-text-colour: #E3E3E3;
  --lz-base-content-width: 769px;
  --lz-navigation-bar-background-colour: #18191C;
  --lz-navigation-bar-border-colour: #2E2F33;
  --lz-button-corner-radius: 9px;
  --lz-button-brightness-default: 1.0;
  --lz-button-brightness-shift: -0.2;
  --lz-button-colour-support: #4A148C;
  --lz-button-colour-discord: #5865F2;
  --lz-button-colour-twitch: #9146FF;
  --lz-button-colour-patreon: #FF424D;
  --lz-button-colour-instagram: 45deg, #FF922D, #F32E87, #8E39C1, #5964E9;
  --lz-wrapper-content-gap: 13px;
  --lz-plate-colour: #2a2b2fAA;
  --lz-plate-corner-radius: 9px;
  --lz-plate-padding: 9px;
  --lz-plate-gap: 13px;
  --lz-icon-small: 32px;
  --lz-preview-spacing-top: -4px;
  --lz-preview-spacing-mini: 1px;
  --lz-preview-corner-radius: 9px;
  --lz-text-header: 2.1rem;
  --lz-text-medium: 1.6rem;
  --lz-text-small: 1.1rem;
  --lz-text-api-discord: 2rem;
  --glitch-h: 269;
  --glitch-s: 100%;
  --glitch-l: 33.69%;
  --glitch-a: 0.369;
  --lz-index-background-fx: 9;
  --lz-index-navigation-bar: 8;
  --lz-index-content: 10;
  --lz-fx-glow-size-1: 5px;
  --lz-fx-glow-size-2: 10px;
  --lz-fx-glow-size-3: 15px;
  --lz-fx-glow-size-add: 3px;
}

html, body {
  margin: 0;
  padding: 0;
  height: 100%;
  background: var(--lz-base-background-colour);
  color: var(--lz-base-text-colour);
  font-family: "Inter", "Segoe UI", sans-serif;
  font-size: 62.5%;
  user-select: none;
}

#lz-background-fx {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  z-index: var(--lz-index-background-fx);
  pointer-events: none;
}

.lz-text-logo-title {
  font-style: italic;
  font-size: 2.24rem;
  font-weight: 600;
  margin: 0;
  animation: lz-fx-text-glow-pulse-purple 2.2s ease-in-out infinite alternate;
}

.lz-text-logo-sub {
  align-self: center;
  font-style: italic;
  font-size: 1.28rem;
  opacity: 0.8;
  margin-top: -5px;
  animation: lz-fx-text-glow-pulse-purple 2.2s ease-in-out infinite alternate;
}

.lz-text-logo-tag {
  color: #000000;
  font-size: 3.2rem;
  font-style: italic;
  font-weight: bold;
  letter-spacing: -0.069em;
  animation: lz-fx-text-glow-pulse-celestial 2.5s ease-in-out infinite alternate;
}

.lz-text-logo-tag:hover {
  display: inline-block;
  text-shadow: 0 0 20px #00000069;
  animation: lz-fx-text-glitch-purple 1s infinite;
}

.lz-text-header {
  font-weight: 600;
  font-style: italic;
  font-size: var(--lz-text-header);
  display: block;
  text-align: center;
  z-index: var(--lz-index-content);
  margin-bottom: 0.7rem;
}

.lz-text-medium {
  font-size: var(--lz-text-medium);
}

.lz-text-small {
  font-size: var(--lz-text-small);
}

.lz-text-plate-name {
  font-size: 1.6rem;
  padding-left: 9px;
}

.lz-text-footnote {
  font-style: italic;
  font-size: 1.1rem;
  opacity: 0.8;
  position: relative;
  top: -1rem;
}

.lz-text-api-discord {
  font-weight: 600;
  font-size: 1.65rem;
  grid-column: 1 / -1;
  margin-top: -4px;
  margin-bottom: 2px;
}

.lz-navigation-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  padding: 13px;
  background: var(--lz-navigation-bar-background-colour);
  border-bottom: 1px solid var(--lz-navigation-bar-border-colour);
  top: 0;
  z-index: var(--lz-index-navigation-bar);
}

.lz-navigation-bar-left {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin-top: -4px;
}

.lz-navigation-bar-center {
  display: flex;
  position: absolute;
  align-items: center;
  left: 50%;
  transform: translateX(-50%);
  gap: 9px;
}

.lz-navigation-bar-right {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

.lz-button {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  white-space: nowrap;
  height: 33px;
  padding: 0 13px;
  border-radius: var(--lz-button-corner-radius);
  margin-bottom: 1px;
  font-size: clamp(1.1rem, 3.0vw, 1.5rem);
  font-weight: 600;
  text-decoration: none;
  color: #ffffff;
  border: none;
  background: none;
  cursor: pointer;
  overflow: hidden;
  z-index: 0;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
  transform: translateY(0);
  box-shadow: 0 2px 6px #00000026;
}

.lz-button::before {
  content: "";
  position: absolute;
  inset: 0;
  background: inherit;
  z-index: -1;
  border-radius: inherit;
  filter: brightness(var(--lz-button-brightness-default));
  transition: filter 0.25s ease;
}

.lz-button:hover::before {
  filter: brightness(calc(var(--lz-button-brightness-default) + var(--lz-button-brightness-shift)));
}

.lz-button:active::before {
  filter: brightness(var(--lz-button-brightness-default));
}

.lz-button:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 12px #00000033;
}

.lz-button:active {
  transform: translateY(0);
  box-shadow: 0 2px 6px #00000026;
}

.lz-button-support {
  font-style: italic;
  font-size: 2.0rem;
  background: var(--lz-button-colour-support);
  line-height: 1;
  margin-top: 3px;
  animation:
    lz-fx-box-glow-pulse-purple 2.4s ease-in-out infinite alternate,
    lz-fx-float 3.6s ease-in-out infinite;
}

.lz-button-support:hover {
  animation:
    lz-fx-box-glow-pulse-celestial 1.8s ease-in-out infinite alternate,
    lz-fx-float 3.6s ease-in-out infinite;
}

.lz-button-discord {
  background: var(--lz-button-colour-discord);
  width: 47%;
}

.lz-button-twitch-follow {
  background: var(--lz-button-colour-twitch);
  margin-top: -7px;
  width: 27%;
}

.lz-button-twitch-sub {
  background: var(--lz-button-colour-twitch);
  margin-top: -7px;
  width: 47%;
}

.lz-button-patreon {
  background: var(--lz-button-colour-patreon);
  width: 50%;
}

.lz-button-instagram {
  background: linear-gradient(var(--lz-button-colour-instagram));
  width: 50%;
}

.lz-wrapper-logo-text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.lz-wrapper-page-content {
  max-width: var(--lz-base-content-width);
  margin: 0 auto;
  padding: 0 20px;
  position: relative;
  z-index: var(--lz-index-content);
}

.lz-wrapper {
  display: flex;
  align-items: center;
  gap: var(--lz-wrapper-content-gap);
}

.lz-wrapper-row {
  display: flex;
  flex-direction: row;
  gap: 0px;
}

.lz-wrapper-column {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.lz-wrapper-row img {
  display: inline-block;
  margin: 0px;
}

.lz-wrapper-column img {
  display: block;
  margin: 0px;
}

.lz-wrapper-row span {
  line-height: 1;
  margin: 0px;
}

.lz-wrapper-column span {
  margin: 0px;
}

.lz-wrapper-grid-double {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--lz-plate-gap);
}

.lz-plate {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: var(--lz-plate-gap);
  padding: var(--lz-plate-padding);
  background: var(--lz-plate-colour);
  border-radius: var(--lz-plate-corner-radius);
  color: var(--lz-base-text-colour);
  text-decoration: none;
  text-align: center;
  font-weight: 600;
  box-shadow: 0 0 8px #5865F233;
  transition: all 0.3s ease;
  margin-bottom: var(--lz-plate-gap);
}

.lz-plate:hover {
  animation: lz-fx-box-glow-pulse-darkpurple 2.4s ease-in-out infinite alternate;
  transform: translateY(-1px);
}

.lz-icon-small {
  width: var(--lz-icon-small) !important;
  height: var(--lz-icon-small) !important;
  object-fit: contain;
}

.lz-footnote {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.lz-footnote-left {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin-left: 25px;
}

.lz-footnote-right {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-right: 25px;
}

.lz-preview {
  width: 100%;
  position: relative;
  margin: var(--lz-preview-spacing-top) var(--lz-preview-spacing-mini) var(--lz-preview-spacing-mini) var(--lz-preview-spacing-mini);
  overflow: hidden;
}

.lz-preview-yt-single {
  aspect-ratio: 16 / 9;
}

.lz-preview-yt-double {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: calc(var(--lz-plate-gap) - 2px);
  overflow: hidden;
}

.lz-preview-iframe-yt-single {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  border: none;
  border-radius: var(--lz-preview-corner-radius);
}

.lz-preview-iframe-yt-double {
  aspect-ratio: 16 / 9;
  width: 100%;
  border: none;
  border-radius: var(--lz-preview-corner-radius);
}

.lz-preview-is-hidden {
  visibility: hidden;
}

@keyframes lz-fx-text-glow-pulse-purple {
  0% {
    text-shadow:
      0 0 var(--lz-fx-glow-size-1) #881AFF73,
      0 0 var(--lz-fx-glow-size-2) #6F00E659,
      0 0 var(--lz-fx-glow-size-3) #5400AD47;
  }

  100% {
    text-shadow:
      0 0 calc(var(--lz-fx-glow-size-1) + var(--lz-fx-glow-size-add)) #A34DFFBF,
      0 0 calc(var(--lz-fx-glow-size-2) + var(--lz-fx-glow-size-add)) #7B00FF8C,
      0 0 calc(var(--lz-fx-glow-size-3) + var(--lz-fx-glow-size-add)) #5900B86B;
  }
}

@keyframes lz-fx-text-glow-pulse-celestial {
  0% {
    text-shadow:
      0 0 var(--lz-fx-glow-size-1) #FFFFFF99,
      0 0 var(--lz-fx-glow-size-2) #C8C8FF73,
      0 0 var(--lz-fx-glow-size-3) #B4B4FF59;
  }

  100% {
    text-shadow:
      0 0 calc(var(--lz-fx-glow-size-1) + var(--lz-fx-glow-size-add)) #FFFFFFCC,
      0 0 calc(var(--lz-fx-glow-size-2) + var(--lz-fx-glow-size-add)) #DCDCFF99,
      0 0 calc(var(--lz-fx-glow-size-3) + var(--lz-fx-glow-size-add)) #C8C8FF73;
  }
}

@keyframes lz-fx-text-glitch-purple {
  0% {
    text-shadow:
      2px 0 hsla(var(--glitch-h), var(--glitch-s), calc(var(--glitch-l) + 10%), var(--glitch-a)),
      -2px 0 hsla(var(--glitch-h), var(--glitch-s), calc(var(--glitch-l) + 20%), var(--glitch-a)),
      0 0 #000;
  }

  20% {
    text-shadow:
      -2px -2px hsla(var(--glitch-h), var(--glitch-s), calc(var(--glitch-l) + 5%), var(--glitch-a)),
      2px 2px hsla(var(--glitch-h), var(--glitch-s), calc(var(--glitch-l) + 15%), var(--glitch-a)),
      0 0 #000;
  }

  40% {
    text-shadow:
      2px -2px hsla(var(--glitch-h), var(--glitch-s), calc(var(--glitch-l) + 12%), var(--glitch-a)),
      -2px 2px hsla(var(--glitch-h), var(--glitch-s), calc(var(--glitch-l) + 18%), var(--glitch-a)),
      0 0 #000;
  }

  60% {
    text-shadow:
      -2px 2px hsla(var(--glitch-h), var(--glitch-s), calc(var(--glitch-l) + 8%), var(--glitch-a)),
      2px -2px hsla(var(--glitch-h), var(--glitch-s), calc(var(--glitch-l) + 14%), var(--glitch-a)),
      0 0 #000;
  }

  80% {
    text-shadow:
      2px 0 hsla(var(--glitch-h), var(--glitch-s), calc(var(--glitch-l) + 10%), var(--glitch-a)),
      -2px 0 hsla(var(--glitch-h), var(--glitch-s), calc(var(--glitch-l) + 20%), var(--glitch-a)),
      0 0 #000;
  }

  100% {
    text-shadow: 0 0 #000;
  }
}

@keyframes lz-fx-box-glow-pulse-purple {
  0% {
    box-shadow:
      0 0 var(--lz-fx-glow-size-1) #5A00788C,
      0 0 var(--lz-fx-glow-size-2) #7800A066,
      0 0 var(--lz-fx-glow-size-3) #9600C84D;
  }

  100% {
    box-shadow:
      0 0 calc(var(--lz-fx-glow-size-1) + var(--lz-fx-glow-size-add)) #5A0078D9,
      0 0 calc(var(--lz-fx-glow-size-2) + var(--lz-fx-glow-size-add)) #7800A0A6,
      0 0 calc(var(--lz-fx-glow-size-3) + var(--lz-fx-glow-size-add)) #9600C880;
  }
}

@keyframes lz-fx-box-glow-pulse-darkpurple {
  0% {
    box-shadow:
      0 0 var(--lz-fx-glow-size-1) #3C005A4D,
      0 0 var(--lz-fx-glow-size-2) #5A007840,
      0 0 var(--lz-fx-glow-size-3) #78009633;
  }

  100% {
    box-shadow:
      0 0 calc(var(--lz-fx-glow-size-1) + var(--lz-fx-glow-size-add)) #3C005A59,
      0 0 calc(var(--lz-fx-glow-size-2) + var(--lz-fx-glow-size-add)) #5A00784D,
      0 0 calc(var(--lz-fx-glow-size-3) + var(--lz-fx-glow-size-add)) #78009640;
  }
}

@keyframes lz-fx-box-glow-pulse-celestial {
  0% {
    box-shadow:
      0 0 var(--lz-fx-glow-size-1) #FFFFFF99,
      0 0 var(--lz-fx-glow-size-2) #C8C8FF73,
      0 0 var(--lz-fx-glow-size-3) #B4B4FF59;
  }

  100% {
    box-shadow:
      0 0 calc(var(--lz-fx-glow-size-1) + var(--lz-fx-glow-size-add)) #FFFFFFCC,
      0 0 calc(var(--lz-fx-glow-size-2) + var(--lz-fx-glow-size-add)) #DCDCFF99,
      0 0 calc(var(--lz-fx-glow-size-3) + var(--lz-fx-glow-size-add)) #C8C8FF73;
  }
}

@keyframes lz-fx-float {
  0%, 100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-3px);
  }
}

@media (max-height: 1200px) {
  :root {
    --lz-base-content-width: 666px;
    --lz-text-header: 2.0rem;
  }

  .lz-button-twitch-follow {
    width: 33%;
  }

  .lz-button-discord,
  .lz-button-twitch-sub {
    width: 57%;
  }

  .lz-button-patreon,
  .lz-button-instagram {
    width: 60%;
  }
}

@media (max-width: 600px) {
  :root {
    --lz-text-header: 1.8rem;
  }

  .lz-button-twitch-follow {
    width: 40%;
  }

  .lz-button-discord,
  .lz-button-twitch-sub {
    width: 65%;
  }

  .lz-button-patreon,
  .lz-button-instagram {
    width: 70%;
  }
}

@media (max-width: 450px) {
  :root {
    --lz-text-header: 1.6rem;
  }

  .lz-button-twitch-follow {
    width: 43%;
  }

  .lz-button-discord,
  .lz-button-twitch-sub {
    width: 75%;
  }

  .lz-button-patreon,
  .lz-button-instagram {
    width: 80%;
  }

  .lz-preview-yt-double {
    grid-template-columns: repeat(1, 2fr);
  }
}