html, body {
  font-variation-settings: "wght" 300, "slnt" 0;
  font-weight: 300;
}

.content {
  margin: 0 10px;
}

@media (min-width: 768px) {
  .content {
    margin: 0 25px;
  }
}

@media (min-width: 1024px) {
  .content {
    margin: 0 250px;
  }
}



@font-face {
  font-family: GT Planar;
  src: url("../fonts/GT-Planar-VF.e0b1caf8.woff2") format("woff2-variations"), url("../fonts/GT-Planar-VF.ffb02286.ttf") format("truetype-variations");
  font-weight: normal;
}

.font-thin-neg45 {
  font-variation-settings: "wght" 100, "slnt" -45;
}

.font-thin-neg30 {
  font-variation-settings: "wght" 100, "slnt" -30;
}

.font-thin-neg15 {
  font-variation-settings: "wght" 100, "slnt" -15;
}

.font-thin-0 {
  font-variation-settings: "wght" 100, "slnt" 0;
}

.font-thin-pos15 {
  font-variation-settings: "wght" 100, "slnt" 15;
}

.font-thin-pos30 {
  font-variation-settings: "wght" 100, "slnt" 30;
}

.font-thin-pos45 {
  font-variation-settings: "wght" 100, "slnt" 45;
}

.font-light-neg45 {
  font-variation-settings: "wght" 300, "slnt" -45;
}

.font-light-neg30 {
  font-variation-settings: "wght" 300, "slnt" -30;
}

.font-light-neg15 {
  font-variation-settings: "wght" 300, "slnt" -15;
}

.font-light-0 {
  font-variation-settings: "wght" 300, "slnt" 0;
}

.font-light-pos15 {
  font-variation-settings: "wght" 300, "slnt" 15;
}

.font-light-pos30 {
  font-variation-settings: "wght" 300, "slnt" 30;
}

.font-light-pos45 {
  font-variation-settings: "wght" 300, "slnt" 45;
}

.font-regular-neg45 {
  font-variation-settings: "wght" 400, "slnt" -45;
}

.font-regular-neg30 {
  font-variation-settings: "wght" 400, "slnt" -30;
}

.font-regular-neg15 {
  font-variation-settings: "wght" 400, "slnt" -15;
}

.font-regular-0 {
  font-variation-settings: "wght" 400, "slnt" 0;
}

.font-regular-pos15 {
  font-variation-settings: "wght" 400, "slnt" 15;
}

.font-regular-pos30 {
  font-variation-settings: "wght" 400, "slnt" 30;
}

.font-regular-pos45 {
  font-variation-settings: "wght" 400, "slnt" 45;
}

.font-medium-neg45 {
  font-variation-settings: "wght" 500, "slnt" -45;
}

.font-medium-neg30 {
  font-variation-settings: "wght" 500, "slnt" -30;
}

.font-medium-neg15 {
  font-variation-settings: "wght" 500, "slnt" -15;
}

.font-medium-0 {
  font-variation-settings: "wght" 500, "slnt" 0;
}

.font-medium-pos15 {
  font-variation-settings: "wght" 500, "slnt" 15;
}

.font-medium-pos30 {
  font-variation-settings: "wght" 500, "slnt" 30;
}

.font-medium-pos45 {
  font-variation-settings: "wght" 500, "slnt" 45;
}

.font-bold-neg45 {
  font-variation-settings: "wght" 700, "slnt" -45;
}

.font-bold-neg30 {
  font-variation-settings: "wght" 700, "slnt" -30;
}

.font-bold-neg15 {
  font-variation-settings: "wght" 700, "slnt" -15;
}

.font-bold-0 {
  font-variation-settings: "wght" 700, "slnt" 0;
}

.font-bold-pos15 {
  font-variation-settings: "wght" 700, "slnt" 15;
}

.font-bold-pos30 {
  font-variation-settings: "wght" 700, "slnt" 30;
}

.font-bold-pos45 {
  font-variation-settings: "wght" 700, "slnt" 45;
}

.font-black-neg45 {
  font-variation-settings: "wght" 900, "slnt" -45;
}

.font-black-neg30 {
  font-variation-settings: "wght" 900, "slnt" -30;
}

.font-black-neg15 {
  font-variation-settings: "wght" 900, "slnt" -15;
}

.font-black-0 {
  font-variation-settings: "wght" 900, "slnt" 0;
}

.font-black-pos15 {
  font-variation-settings: "wght" 900, "slnt" 15;
}

.font-black-pos30 {
  font-variation-settings: "wght" 900, "slnt" 30;
}

.font-black-pos45 {
  font-variation-settings: "wght" 900, "slnt" 45;
}

*, :before, :after {
  box-sizing: border-box;
  border: 0 solid ;
}

:before, :after {
  --tw-content: "";
}

html {
  -webkit-text-size-adjust: 100%;
  tab-size: 4;
  font-family: GT Planar, Comic Sans MS, cursive;
  line-height: 1.5;
}

body {
  line-height: inherit;
  margin: 0;
}

hr {
  height: 0;
  color: inherit;
  border-top-width: 1px;
}

abbr:where([title]) {
  text-decoration: underline dotted;
}

h1, h2, h3, h4, h5, h6 {
  font-size: inherit;
  font-weight: inherit;
}

a {
  color: inherit;
  text-decoration: inherit;
}

b, strong {
  font-weight: bolder;
}

code, kbd, samp, pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace;
  font-size: 1em;
}

small {
  font-size: 80%;
}

sub, sup {
  vertical-align: baseline;
  font-size: 75%;
  line-height: 0;
  position: relative;
}

sub {
  bottom: -.25em;
}

sup {
  top: -.5em;
}

table {
  text-indent: 0;
  border-color: inherit;
  border-collapse: collapse;
}

button, input, optgroup, select, textarea {
  font-family: inherit;
  font-size: 100%;
  line-height: inherit;
  color: inherit;
  margin: 0;
  padding: 0;
}

button, select {
  text-transform: none;
}

button, [type="button"], [type="reset"], [type="submit"] {
  -webkit-appearance: button;
  background-color: #0000;
  background-image: none;
}

:-moz-focusring {
  outline: auto ;
}

:-moz-ui-invalid {
  box-shadow: none;
}

progress {
  vertical-align: baseline;
}

::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
  height: auto;
}

[type="search"] {
  -webkit-appearance: textfield;
  outline-offset: -2px;
}

::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit;
}

summary {
  display: list-item;
}

blockquote, dl, dd, h1, h2, h3, h4, h5, h6, hr, figure, p, pre {
  margin: 0;
}

fieldset {
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
}

ol, ul, menu {
  margin: 0;
  padding: 0;
  list-style: none;
}

textarea {
  resize: vertical;
}

input::placeholder, textarea::placeholder {
  opacity: 1;
  color: #9ca3af;
}

button, [role="button"] {
  cursor: pointer;
}

:disabled {
  cursor: default;
}

img, svg, video, canvas, audio, iframe, embed, object {
  vertical-align: middle;
  display: block;
}

img, video {
  max-width: 100%;
  height: auto;
}

[hidden] {
  display: none;
}

.caps {
  text-transform: uppercase;
  letter-spacing: .04em;
  font-size: 1.4rem; /* o el tamaño que prefieras */
}


*, :before, :after {
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x: ;
  --tw-pan-y: ;
  --tw-pinch-zoom: ;
  --tw-scroll-snap-strictness: proximity;
  --tw-ordinal: ;
  --tw-slashed-zero: ;
  --tw-numeric-figure: ;
  --tw-numeric-spacing: ;
  --tw-numeric-fraction: ;
  --tw-ring-inset: ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: #3b82f680;
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur: ;
  --tw-brightness: ;
  --tw-contrast: ;
  --tw-grayscale: ;
  --tw-hue-rotate: ;
  --tw-invert: ;
  --tw-saturate: ;
  --tw-sepia: ;
  --tw-drop-shadow: ;
  --tw-backdrop-blur: ;
  --tw-backdrop-brightness: ;
  --tw-backdrop-contrast: ;
  --tw-backdrop-grayscale: ;
  --tw-backdrop-hue-rotate: ;
  --tw-backdrop-invert: ;
  --tw-backdrop-opacity: ;
  --tw-backdrop-saturate: ;
  --tw-backdrop-sepia: ;
}

h1 {
  font-variation-settings: "wght" 500, "slnt" 0;
  font-family: GT Planar, Comic Sans MS, cursive;
  font-size: 52px;
  font-weight: 500;
  line-height: 60px;
}

h2 {
  font-variation-settings: "wght" 500, "slnt" 0;
  font-family: GT Planar, Comic Sans MS, cursive;
  font-size: 22px;
  font-weight: 500;
  line-height: 32px;
}

h3 {
  font-variation-settings: "wght" 400, "slnt" 0;
  font-family: GT Planar, Comic Sans MS, cursive;
  font-size: 24px;
  font-weight: 400;
  line-height: 26px;
}

h4 {
  font-family: GT Planar, Comic Sans MS, cursive;
  font-size: 44px;
  line-height: 48px;
}

h5 {
  font-family: GT Planar, Comic Sans MS, cursive;
  font-size: 34px;
  line-height: 41px;
}

h6 {
  font-family: GT Planar, Comic Sans MS, cursive;
  font-size: 24px;
  line-height: 35.52px;
}

h7 {
  font-family: GT Planar, Comic Sans MS, cursive;
  font-size: 18px;
  line-height: 21.6px;
}

.text-italic {
  font-variation-settings: "wght" 300, "slnt" 15;
}

em {
  font-variation-settings: "wght" 300, "slnt" 15;
  font-weight: 400;
}

.ot-onum {
  -webkit-font-feature-settings: "kern" 1, "onum" 1, "pnum" 1;
  font-feature-settings: "kern" 1, "onum" 1, "pnum" 1;
}

.ot-onum-tnum {
  -webkit-font-feature-settings: "kern" 1, "onum" 1, "tnum" 1;
  font-feature-settings: "kern" 1, "onum" 1, "tnum" 1;
}

.ot-lnum {
  -webkit-font-feature-settings: "kern" 1, "lnum" 1, "pnum" 1;
  font-feature-settings: "kern" 1, "lnum" 1, "pnum" 1;
}

.ot-lnum-tnum {
  -webkit-font-feature-settings: "kern" 1, "lnum" 1, "tnum" 1;
  font-feature-settings: "kern" 1, "lnum" 1, "tnum" 1;
}

.ot-dlig {
  -webkit-font-feature-settings: "kern" 1, "liga" 1, "dlig" 1;
  font-feature-settings: "kern" 1, "liga" 1, "dlig" 1;
}

.ot-sups {
  text-transform: lowercase;
  -webkit-font-feature-settings: "kern" 1, "sups" 1;
  font-feature-settings: "kern" 1, "sups" 1;
}

.ot-onum-slash {
  -webkit-font-feature-settings: "kern" 1, "onum" 1, "zero" 1;
  font-feature-settings: "kern" 1, "onum" 1, "zero" 1;
}

.ot-lnum-slash {
  -webkit-font-feature-settings: "kern" 1, "lnum" 1, "zero" 1;
  font-feature-settings: "kern" 1, "lnum" 1, "zero" 1;
}

.ot-tf-onum-slash {
  -webkit-font-feature-settings: "kern" 1, "tnum" 1, "onum" 1, "zero" 1;
  font-feature-settings: "kern" 1, "tnum" 1, "onum" 1, "zero" 1;
}

.ot-tf-lnum-slash {
  -webkit-font-feature-settings: "kern" 1, "tnum" 1, "lnum" 1, "zero" 1;
  font-feature-settings: "kern" 1, "tnum" 1, "lnum" 1, "zero" 1;
}

.ot-osf {
  -webkit-font-feature-settings: "onum" 1, "kern" 1;
  font-feature-settings: "onum" 1, "kern" 1;
}

.ot-ssplusarrow {
  -webkit-font-feature-settings: "kern" 1, "ss01" 1, "ss02" 1, "ss03" 1, "ss04" 1;
  font-feature-settings: "kern" 1, "ss01" 1, "ss02" 1, "ss03" 1, "ss04" 1;
}

.ot-salt {
  -webkit-font-feature-settings: "calt" 1, "kern" 1;
  font-feature-settings: "calt" 1, "kern" 1;
}

.ot-smcp {
  -webkit-font-feature-settings: "smcp" 1, "kern" 1;
  font-feature-settings: "smcp" 1, "kern" 1;
}

.ot-case {
  -webkit-font-feature-settings: "case" 1, "kern" 1;
  font-feature-settings: "case" 1, "kern" 1;
}

.ot-ss01 {
  -webkit-font-feature-settings: "ss01" 1, "kern" 1;
  font-feature-settings: "ss01" 1, "kern" 1;
}

.ot-ss02 {
  -webkit-font-feature-settings: "ss02" 1, "kern" 1;
  font-feature-settings: "ss02" 1, "kern" 1;
}

.ot-ss03 {
  -webkit-font-feature-settings: "ss03" 1, "kern" 1;
  font-feature-settings: "ss03" 1, "kern" 1;
}

.ot-ss04 {
  -webkit-font-feature-settings: "ss04" 1, "kern" 1;
  font-feature-settings: "ss04" 1, "kern" 1;
}

.ot-ss05 {
  -webkit-font-feature-settings: "ss05" 1, "kern" 1;
  font-feature-settings: "ss05" 1, "kern" 1;
}

.ot-ss04-ss05 {
  -webkit-font-feature-settings: "ss04" 1, "ss05" 1, "kern" 1;
  font-feature-settings: "ss04" 1, "ss05" 1, "kern" 1;
}

.ot-aalt {
  -webkit-font-feature-settings: "aalt" 1, "kern" 1;
  font-feature-settings: "aalt" 1, "kern" 1;
}

.js-animation-paused, .js-animation-paused * {
  animation-play-state: paused !important;
}

.light-all-italic-angles {
  animation: animation-light-all-italic-angles 1.5s ease-in-out infinite alternate;
}

@keyframes animation-light-all-italic-angles {
  0% {
    font-variation-settings: "wght" 300, "slnt" -45;
  }

  100% {
    font-variation-settings: "wght" 300, "slnt" 45;
  }
}

.medium-all-italic-angles {
  animation: animation-medium-all-italic-angles 1.5s ease-in-out infinite alternate;
}

@keyframes animation-medium-all-italic-angles {
  0% {
    font-variation-settings: "wght" 500, "slnt" -45;
  }

  100% {
    font-variation-settings: "wght" 500, "slnt" 45;
  }
}

@keyframes hud-snr-plus1 {
  0% {
    opacity: 1;
    transform: translate(0, -57.2px);
  }

  30% {
    opacity: 1;
    transform: translate(-40px, 51px);
  }

  30.01% {
    opacity: 0;
    transform: translate(-40px, 51px);
  }

  30.02% {
    opacity: 0;
    transform: translate(0, -57.2px);
  }

  100% {
    opacity: 0;
    transform: translate(0, -57.2px);
  }
}

.animation-snr-plus1 {
  opacity: 0;
  animation: hud-snr-plus1 60s steps(25, end) .1s infinite;
  transform: translate(0, -57.2px);
}

@keyframes hud-snr-plus2 {
  0% {
    opacity: 1;
    transform: translate(0, -65.2px);
  }

  40% {
    opacity: 1;
    transform: translate(20px, 42px);
  }

  40.01% {
    opacity: 0;
    transform: translate(20px, 42px);
  }

  40.02% {
    opacity: 0;
    transform: translate(0, -65.2px);
  }

  100% {
    opacity: 0;
    transform: translate(0, -65.2px);
  }
}

.animation-snr-plus2 {
  opacity: 0;
  animation: hud-snr-plus2 40s steps(35, end) 10s infinite;
  transform: translate(0, -65.2px);
}

@keyframes hud-snr-plus3 {
  0% {
    opacity: 1;
    transform: translate(30px, -23px);
  }

  40% {
    opacity: 1;
    transform: translate(20px, 55px);
  }

  40.01% {
    opacity: 0;
    transform: translate(20px, 55px);
  }

  40.02% {
    opacity: 0;
    transform: translate(30px, -23px);
  }

  100% {
    opacity: 0;
    transform: translate(30px, -23px);
  }
}

.animation-snr-plus3 {
  opacity: 0;
  animation: hud-snr-plus3 30s steps(15, end) 16s infinite;
  transform: translate(20px, 55px);
}

@keyframes hud-snr-plus4 {
  0% {
    opacity: 1;
    transform: translate(-40px, -24px);
  }

  30% {
    opacity: 1;
    transform: translate(-60px, 86px);
  }

  30.01% {
    opacity: 0;
    transform: translate(-60px, 86px);
  }

  30.02% {
    opacity: 0;
    transform: translate(-40px, -24px);
  }

  100% {
    opacity: 0;
    transform: translate(-40px, -24px);
  }
}

.animation-snr-plus4 {
  opacity: 0;
  animation: hud-snr-plus4 50s steps(30, end) 5s infinite;
  transform: translate(-40px, -24px);
}

@keyframes hud-snr-plus5 {
  0% {
    opacity: 1;
    transform: translate(-73.5px, -14px);
  }

  30% {
    opacity: 1;
    transform: translate(9px, 13px);
  }

  30.01% {
    opacity: 0;
    transform: translate(9px, 13px);
  }

  30.02% {
    opacity: 0;
    transform: translate(-73.5px, -14px);
  }

  100% {
    opacity: 0;
    transform: translate(-73.5px, -14px);
  }
}

.animation-snr-plus5 {
  opacity: 0;
  animation: hud-snr-plus5 80s steps(30, end) 7.5s infinite;
  transform: translate(-73.5px, -14px);
}

.anim-pilot-stat {
  animation-duration: 30s;
  animation-timing-function: steps(8, end);
  animation-iteration-count: infinite;
  animation-direction: alternate;
}

.anim-pilot-stat-focus {
  animation-name: pilot-stat-focus;
}

@keyframes pilot-stat-focus {
  0% {
    width: 60%;
  }

  15% {
    width: 20%;
  }

  30% {
    width: 30%;
  }

  80% {
    width: 80%;
  }

  100% {
    width: 60%;
  }
}

.anim-pilot-stat-oxygen {
  animation-name: pilot-stat-oxygen;
}

@keyframes pilot-stat-oxygen {
  0% {
    width: 90%;
  }

  20% {
    width: 70%;
  }

  40% {
    width: 100%;
  }

  70% {
    width: 80%;
  }

  100% {
    width: 90%;
  }
}

.anim-pilot-stat-awake {
  animation-name: pilot-stat-awake;
}

@keyframes pilot-stat-awake {
  0% {
    width: 80%;
  }

  10% {
    width: 60%;
  }

  50% {
    width: 50%;
  }

  60% {
    width: 90%;
  }

  100% {
    width: 80%;
  }
}

.anim-pilot-stat-curiosity {
  animation-name: pilot-stat-curiosity;
}

@keyframes pilot-stat-curiosity {
  0% {
    width: 70%;
  }

  20% {
    width: 50%;
  }

  55% {
    width: 60%;
  }

  70% {
    width: 100%;
  }

  100% {
    width: 70%;
  }
}

.anim-pilot-stat-ability {
  animation-name: pilot-stat-ability;
}

@keyframes pilot-stat-ability {
  0% {
    width: 80%;
  }

  10% {
    width: 90%;
  }

  50% {
    width: 30%;
  }

  80% {
    width: 100%;
  }

  100% {
    width: 80%;
  }
}

.anim-pilot-stat-chill {
  animation-name: pilot-stat-chill;
}

@keyframes pilot-stat-chill {
  0% {
    width: 30%;
  }

  30% {
    width: 70%;
  }

  50% {
    width: 60%;
  }

  75% {
    width: 90%;
  }

  100% {
    width: 30%;
  }
}

@keyframes animation-mod-viz-candles {
  from {
    background-position: 0 0;
  }

  to {
    background-position: 100% 0;
  }
}

.animation-hud-bp-wheel {
  animation-name: hud-bp-wheel-left;
  animation-duration: 5s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  transform: rotate(0deg);
}

.animation-hud-bp-wheel-left {
  transform-origin: 41px 41px;
}

.animation-hud-bp-wheel-right {
  transform-origin: 135px 41px;
}

@keyframes hud-bp-wheel-left {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

.animation-hud-r-wheel {
  transform-origin: 39px 37px;
  animation-name: hud-r-wheel;
  animation-duration: 3s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  transform: rotate(0deg);
}

@keyframes hud-r-wheel {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

.minisite-link {
  font-variation-settings: "wght" 300, "slnt" 0;
  will-change: font-variation-settings;
  transition: font-variation-settings .2s ease-in;
}

.minisite-link:nth-of-type(3n):hover {
  font-variation-settings: "wght" 700, "slnt" 45;
  transition: font-variation-settings .2s ease-out;
}

.minisite-link:nth-of-type(3n+1):hover {
  font-variation-settings: "wght" 700, "slnt" -45;
  transition: font-variation-settings .2s ease-out;
}

.minisite-link:nth-of-type(3n+2):hover {
  font-variation-settings: "wght" 700, "slnt" 0;
  transition: font-variation-settings .2s ease-out;
}

@media (max-width: 768px) {
  .minisite-link {
    font-size: 1.5rem; /* equivalente a text-sm */
  }
}

.messaging-center > div, .messaging-center-typetester > div {
  height: 100%;
  width: 100%;
  will-change: transform;
  justify-content: center;
  align-items: center;
  transition-property: transform;
  transition-duration: .15s;
  transition-timing-function: cubic-bezier(.4, 0, .2, 1);
  display: flex;
  position: absolute;
  top: 0;
  left: 0;
}

.animation-lottie {
  z-index: -50;
  position: relative;
}

.break--new-system__image, .break--rooted-in-the-future__image {
  -o-object-fit: fill;
  object-fit: fill;
}

.ss {
  --scroll-height: 500vh;
  height: var(--scroll-height);
  backface-visibility: hidden;
}

.ss__inner {
  height: var(--visible-viewport-height);
  perspective: var(--global-perspective);
  backface-visibility: hidden;
}

.ss__tunnel {
  transform-style: preserve-3d;
  transform: var(--tunnel-translate);
}

.ss__tunnel-plane {
  transform-style: preserve-3d;
  transform: translateZ(var(--offset) );
}

.ss__tunnel-wall {
  background-position: 0 0;
  background-size: 100% 100%;
}

.ss--first .ss__tunnel-wall {
  background-image: url("../fonts/TunnelGrid-1.677942a8.svg");
}

.ss--second .ss__tunnel-wall {
  background-image: url("../fonts/TunnelGrid-2.b2828b8d.svg");
}

.ss__tunnel-wall--top {
  height: var(--tunnel-length);
  transform-origin: top;
  transform: rotateX(-90deg);
}

.ss--first .ss__tunnel-wall--top {
  background-image: url("../fonts/TunnelGrid-1-Top.9444b872.svg");
}

.ss--second .ss__tunnel-wall--top {
  background-image: url("../fonts/TunnelGrid-2-Top.f3cb0e57.svg");
}

.ss__tunnel-wall--right {
  width: var(--tunnel-length);
  transform-origin: 100%;
  transform: rotateY(-90deg);
}

.ss--first .ss__tunnel-wall--right {
  background-image: url("../fonts/TunnelGrid-1-Right.c3fb73dc.svg");
}

.ss--second .ss__tunnel-wall--right {
  background-image: url("../fonts/TunnelGrid-2-Right.705d5e31.svg");
}

.ss__tunnel-wall--bottom {
  height: var(--tunnel-length);
  transform-origin: bottom;
  transform: rotateX(90deg);
}

.ss--first .ss__tunnel-wall--bottom {
  background-image: url("../fonts/TunnelGrid-1-Bottom.5725bf15.svg");
}

.ss--second .ss__tunnel-wall--bottom {
  background-image: url("../fonts/TunnelGrid-2-Bottom.a26abd42.svg");
}

.ss__tunnel-wall--left {
  width: var(--tunnel-length);
  transform-origin: 0;
  transform: rotateY(90deg);
}

.ss--first .ss__tunnel-wall--left {
  background-image: url("../fonts/TunnelGrid-1-Left.7e65223a.svg");
}

.ss--second .ss__tunnel-wall--left {
  background-image: url("../fonts/TunnelGrid-2-Left.94646951.svg");
}

.ss__tunnel-block {
  transform-style: preserve-3d;
}

.ss__tunnel-block:before {
  content: "";
  width: 100%;
  height: 50px;
  --tw-border-opacity: 1;
  border-style: solid;
  border-width: 2px;
  border-color: rgb(112 0 255 / var(--tw-border-opacity) );
  --tw-bg-opacity: 1;
  background-color: rgb(112 0 255 / var(--tw-bg-opacity) );
  display: block;
  position: absolute;
}

.ss__tunnel-block--top:before {
  width: 100%;
  height: 100px;
  transform-origin: bottom;
  bottom: 0;
  left: 0;
  transform: rotateX(90deg);
}

.ss__tunnel-block--bottom:before {
  width: 100%;
  height: 100px;
  transform-origin: top;
  top: 0;
  left: 0;
  transform: rotateX(-90deg);
}

.ss__tunnel-block--right:before {
  width: 100px;
  height: 100%;
  transform-origin: 0;
  top: 0;
  left: 0;
  transform: rotateY(90deg);
}

.ss__tunnel-block--left:before {
  width: 100px;
  height: 100%;
  transform-origin: 100%;
  top: 0;
  right: 0;
  transform: rotateY(-90deg);
}

.ss__tunnel-block:after {
  content: "";
  height: 100%;
  width: 100%;
  --tw-border-opacity: 1;
  border-style: solid;
  border-width: 2px;
  border-color: rgb(112 0 255 / var(--tw-border-opacity) );
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
}

.ss__new-system span {
  font-variation-settings: "wght" 125, "slnt" var(--slnt);
}

*, :before, :after {
  box-sizing: border-box;
  border: 0 solid ;
}

:before, :after {
  --tw-content: "";
}

html {
  -webkit-text-size-adjust: 100%;
  tab-size: 4;
  font-family: GT Planar, Comic Sans MS, cursive;
  line-height: 1.5;
}

body {
  line-height: inherit;
  margin: 0;
}

hr {
  height: 0;
  color: inherit;
  border-top-width: 1px;
}

abbr:where([title]) {
  text-decoration: underline dotted;
}

h1, h2, h3, h4, h5, h6 {
  font-size: inherit;
  font-weight: inherit;
}

a {
  color: inherit;
  text-decoration: inherit;
}

b, strong {
  font-weight: bolder;
}

code, kbd, samp, pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace;
  font-size: 1em;
}

small {
  font-size: 80%;
}

sub, sup {
  vertical-align: baseline;
  font-size: 75%;
  line-height: 0;
  position: relative;
}

sub {
  bottom: -.25em;
}

sup {
  top: -.5em;
}

table {
  text-indent: 0;
  border-color: inherit;
  border-collapse: collapse;
}

button, input, optgroup, select, textarea {
  font-family: inherit;
  font-size: 100%;
  line-height: inherit;
  color: inherit;
  margin: 0;
  padding: 0;
}

button, select {
  text-transform: none;
}

button, [type="button"], [type="reset"], [type="submit"] {
  -webkit-appearance: button;
  background-color: #0000;
  background-image: none;
}

:-moz-focusring {
  outline: auto ;
}

:-moz-ui-invalid {
  box-shadow: none;
}

progress {
  vertical-align: baseline;
}

::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
  height: auto;
}

[type="search"] {
  -webkit-appearance: textfield;
  outline-offset: -2px;
}

::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit;
}

summary {
  display: list-item;
}

blockquote, dl, dd, h1, h2, h3, h4, h5, h6, hr, figure, p, pre {
  margin: 0;
}

fieldset {
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
}

ol, ul, menu {
  margin: 0;
  padding: 0;
  list-style: none;
}

textarea {
  resize: vertical;
}

input::placeholder, textarea::placeholder {
  opacity: 1;
  color: #9ca3af;
}

button, [role="button"] {
  cursor: pointer;
}

:disabled {
  cursor: default;
}

img, svg, video, canvas, audio, iframe, embed, object {
  vertical-align: middle;
  display: block;
}

img, video {
  max-width: 100%;
  height: auto;
}

[hidden] {
  display: none;
}

*, :before, :after {
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x: ;
  --tw-pan-y: ;
  --tw-pinch-zoom: ;
  --tw-scroll-snap-strictness: proximity;
  --tw-ordinal: ;
  --tw-slashed-zero: ;
  --tw-numeric-figure: ;
  --tw-numeric-spacing: ;
  --tw-numeric-fraction: ;
  --tw-ring-inset: ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: #3b82f680;
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur: ;
  --tw-brightness: ;
  --tw-contrast: ;
  --tw-grayscale: ;
  --tw-hue-rotate: ;
  --tw-invert: ;
  --tw-saturate: ;
  --tw-sepia: ;
  --tw-drop-shadow: ;
  --tw-backdrop-blur: ;
  --tw-backdrop-brightness: ;
  --tw-backdrop-contrast: ;
  --tw-backdrop-grayscale: ;
  --tw-backdrop-hue-rotate: ;
  --tw-backdrop-invert: ;
  --tw-backdrop-opacity: ;
  --tw-backdrop-saturate: ;
  --tw-backdrop-sepia: ;
}

.family-overview-table {
  table-layout: fixed;
  white-space: fixed;
  width: calc(100vw - 20px);
  -webkit-user-select: none;
  user-select: none;
}

@media only screen and (min-width: 768px) {
  .family-overview-table {
    width: calc(100vw - 50px);
  }
}

@media only screen and (min-width: 1024px) {
  .family-overview-table {
    width: calc(100vw - 500px);
  }
}

th, td {
  --tw-border-opacity: 1;
  border-width: 1px;
  border-color: rgb(255 255 255 / var(--tw-border-opacity) );
}

th {
  font-size: 14px;
  line-height: 1.25rem;
}

th div {
  writing-mode: vertical-lr;
  min-height: 6em;
  transform: rotate(180deg);
}

@media only screen and (min-width: 1024px) {
  th div {
    min-height: 7em;
  }
}

td {
  text-align: center;
  font-size: 8vw;
}

@media (min-width: 768px) {
  td {
    font-size: 4.5vw;
  }
}

@media (min-width: 1024px) {
  td {
    font-size: 4vw;
  }
}

td {
  font-variation-settings: "slnt" 200, "wght" 800;
}

.hide-on-mobile {
  display: none;
}

@media only screen and (min-width: 1100px) {
  .hide-on-mobile {
    display: inline;
  }
}

.empty-cell {
  border-top: 0 solid #000;
  border-left: 0 solid #000;
}

.family-overview-table {
  --font-variation-settings: "slnt" 0, "wght" 400;
  --color: red;
}

.family-overview-table td {
  font-variation-settings: "slnt" 0, "wght" 100;
  will-change: font-variation-settings, color;
}

tr:nth-of-type(2) {
  --wght: 100;
}

tr:nth-of-type(3) {
  --wght: 200;
}

tr:nth-of-type(4) {
  --wght: 300;
}

tr:nth-of-type(5) {
  --wght: 400;
}

tr:nth-of-type(6) {
  --wght: 650;
}

tr:nth-of-type(7) {
  --wght: 900;
}

td:nth-of-type(1) {
  font-variation-settings: "slnt" -45, "wght" var(--wght);
}

td:nth-of-type(2) {
  font-variation-settings: "slnt" -30, "wght" var(--wght);
}

td:nth-of-type(3) {
  font-variation-settings: "slnt" -15, "wght" var(--wght);
}

td:nth-of-type(4) {
  font-variation-settings: "slnt" 0, "wght" var(--wght);
}

td:nth-of-type(5) {
  font-variation-settings: "slnt" 15, "wght" var(--wght);
}

td:nth-of-type(6) {
  font-variation-settings: "slnt" 30, "wght" var(--wght);
}

td:nth-of-type(7) {
  font-variation-settings: "slnt" 45, "wght" var(--wght);
}

table.active td {
  font-variation-settings: var(--font-variation-settings);
  color: var(--color);
}

/* Texto general en blanco */
.custom-slogan {
  color: #FFFFFF;
}

/* Estilo base de letras */
.letter-alt-new {
  display: inline-block;
  transition: color 0.3s ease;
}

/* Solo "Join Us" en verde flúor con glow */
.highlight-join-new {
  color: rgb(0, 217, 23);
  text-shadow: 0 0 12px rgba(0, 217, 23, 0.7);
}

/* Evitar cambios de color en hover */
@media (hover:hover) {
  .letter-alt-new:hover {
    color: inherit !important;
  }
}
@media (hover:none) {
  .letter-alt-new:active {
    color: inherit !important;
  }
}




.specimen-ot-alt-indicator-inactive {
  --tw-translate-y: 16px;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y) ) rotate(var(--tw-rotate) ) skewX(var(--tw-skew-x) ) skewY(var(--tw-skew-y) ) scaleX(var(--tw-scale-x) ) scaleY(var(--tw-scale-y) );
  --tw-text-opacity: 1;
  color: rgb(97 0 255 / var(--tw-text-opacity) );
  margin-left: -1.55em;
  transition-property: transform;
  transition-duration: .15s;
  transition-timing-function: cubic-bezier(.4, 0, .2, 1);
}

.specimen-ot-alt-indicator-active {
  --tw-translate-y: 0;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y) ) rotate(var(--tw-rotate) ) skewX(var(--tw-skew-x) ) skewY(var(--tw-skew-y) ) scaleX(var(--tw-scale-x) ) scaleY(var(--tw-scale-y) );
  --tw-text-opacity: 1;
  color: rgb(0 255 133 / var(--tw-text-opacity) );
  transition-property: transform;
  transition-duration: .15s;
  transition-timing-function: cubic-bezier(.4, 0, .2, 1);
  display: inline;
}

@media (hover: hover) {
  .specimen-item:hover {
    cursor: pointer;
  }

  .specimen-item:hover .specimen-ot-alt-indicator-active {
    --tw-translate-y: -16px;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y) ) rotate(var(--tw-rotate) ) skewX(var(--tw-skew-x) ) skewY(var(--tw-skew-y) ) scaleX(var(--tw-scale-x) ) scaleY(var(--tw-scale-y) );
    transition-property: transform;
    transition-duration: .15s;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
  }
}

@media (hover: none) {
  .specimen-item:active .specimen-ot-alt-indicator-active {
    --tw-translate-y: -16px;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y) ) rotate(var(--tw-rotate) ) skewX(var(--tw-skew-x) ) skewY(var(--tw-skew-y) ) scaleX(var(--tw-scale-x) ) scaleY(var(--tw-scale-y) );
    transition-property: transform;
    transition-duration: .15s;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
  }
}

@media (hover: hover) {
  .specimen-item:hover .specimen-ot-alt-indicator-inactive {
    --tw-translate-y: 0;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y) ) rotate(var(--tw-rotate) ) skewX(var(--tw-skew-x) ) skewY(var(--tw-skew-y) ) scaleX(var(--tw-scale-x) ) scaleY(var(--tw-scale-y) );
    transition-property: transform;
    transition-duration: .15s;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
  }
}

@media (hover: none) {
  .specimen-item:active .specimen-ot-alt-indicator-inactive {
    --tw-translate-y: 0;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y) ) rotate(var(--tw-rotate) ) skewX(var(--tw-skew-x) ) skewY(var(--tw-skew-y) ) scaleX(var(--tw-scale-x) ) scaleY(var(--tw-scale-y) );
    transition-property: transform;
    transition-duration: .15s;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
  }
}

.specimen-item .ot-flat-alternates {
  -webkit-font-feature-settings: "ss04" 1, "kern" 1;
  font-feature-settings: "ss04" 1, "kern" 1;
}

@media (hover: hover) {
  .specimen-item:hover .ot-flat-alternates {
    -webkit-font-feature-settings: "ss04" 0, "kern" 1;
    font-feature-settings: "ss04" 0, "kern" 1;
  }
}

@media (hover: none) {
  .specimen-item:active .ot-flat-alternates {
    -webkit-font-feature-settings: "ss04" 0, "kern" 1;
    font-feature-settings: "ss04" 0, "kern" 1;
  }
}

.specimen-item .ot-flat-alternates-plus-curvedalts {
  -webkit-font-feature-settings: "ss03" 1, "ss04" 0, "kern" 1;
  font-feature-settings: "ss03" 1, "ss04" 0, "kern" 1;
}

@media (hover: hover) {
  .specimen-item:hover .ot-flat-alternates-plus-curvedalts {
    -webkit-font-feature-settings: "ss03" 0, "ss04" 1, "kern" 1;
    font-feature-settings: "ss03" 0, "ss04" 1, "kern" 1;
  }
}

@media (hover: none) {
  .specimen-item:active .ot-flat-alternates-plus-curvedalts {
    -webkit-font-feature-settings: "ss03" 0, "ss04" 1, "kern" 1;
    font-feature-settings: "ss03" 0, "ss04" 1, "kern" 1;
  }
}

.specimen-item .ot-singlestory-plus-curvedalts {
  -webkit-font-feature-settings: "ss02" 1, "ss03" 1, "ss01" 1, "kern" 1;
  font-feature-settings: "ss02" 1, "ss03" 1, "ss01" 1, "kern" 1;
}

@media (hover: hover) {
  .specimen-item:hover .ot-singlestory-plus-curvedalts {
    -webkit-font-feature-settings: "ss02" 0, "ss03" 0, "ss01" 0, "kern" 1;
    font-feature-settings: "ss02" 0, "ss03" 0, "ss01" 0, "kern" 1;
  }
}

@media (hover: none) {
  .specimen-item:active .ot-singlestory-plus-curvedalts {
    -webkit-font-feature-settings: "ss02" 0, "ss03" 0, "ss01" 0, "kern" 1;
    font-feature-settings: "ss02" 0, "ss03" 0, "ss01" 0, "kern" 1;
  }
}

.specimen-item .ot-singlestory {
  -webkit-font-feature-settings: "ss01" 1, "ss02" 1, "kern" 1;
  font-feature-settings: "ss01" 1, "ss02" 1, "kern" 1;
}

@media (hover: hover) {
  .specimen-item:hover .ot-singlestory {
    -webkit-font-feature-settings: "ss01" 0, "ss02" 0, "kern" 1;
    font-feature-settings: "ss01" 0, "ss02" 0, "kern" 1;
  }
}

@media (hover: none) {
  .specimen-item:active .ot-singlestory {
    -webkit-font-feature-settings: "ss01" 0, "ss02" 0, "kern" 1;
    font-feature-settings: "ss01" 0, "ss02" 0, "kern" 1;
  }
}

.specimen-item .letter-with-alt {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity) );
}

@media (hover: hover) {
  .specimen-item:hover .letter-with-alt {
    --tw-text-opacity: 1;
    color: rgb(97 0 255 / var(--tw-text-opacity) );
  }
}

@media (hover: none) {
  .specimen-item:active .letter-with-alt {
    --tw-text-opacity: 1;
    color: rgb(97 0 255 / var(--tw-text-opacity) );
  }
}

*, :before, :after {
  box-sizing: border-box;
  border: 0 solid ;
}

:before, :after {
  --tw-content: "";
}

html {
  -webkit-text-size-adjust: 100%;
  tab-size: 4;
  font-family: GT Planar, Comic Sans MS, cursive;
  line-height: 1.5;
}

body {
  line-height: inherit;
  margin: 0;
}

hr {
  height: 0;
  color: inherit;
  border-top-width: 1px;
}

abbr:where([title]) {
  text-decoration: underline dotted;
}

h1, h2, h3, h4, h5, h6 {
  font-size: inherit;
  font-weight: inherit;
}

a {
  color: inherit;
  text-decoration: inherit;
}

b, strong {
  font-weight: bolder;
}

code, kbd, samp, pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace;
  font-size: 1em;
}

small {
  font-size: 80%;
}

sub, sup {
  vertical-align: baseline;
  font-size: 75%;
  line-height: 0;
  position: relative;
}

sub {
  bottom: -.25em;
}

sup {
  top: -.5em;
}

table {
  text-indent: 0;
  border-color: inherit;
  border-collapse: collapse;
}

button, input, optgroup, select, textarea {
  font-family: inherit;
  font-size: 100%;
  line-height: inherit;
  color: inherit;
  margin: 0;
  padding: 0;
}

button, select {
  text-transform: none;
}

button, [type="button"], [type="reset"], [type="submit"] {
  -webkit-appearance: button;
  background-color: #0000;
  background-image: none;
}

:-moz-focusring {
  outline: auto ;
}

:-moz-ui-invalid {
  box-shadow: none;
}

progress {
  vertical-align: baseline;
}

::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
  height: auto;
}

[type="search"] {
  -webkit-appearance: textfield;
  outline-offset: -2px;
}

::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit;
}

summary {
  display: list-item;
}

blockquote, dl, dd, h1, h2, h3, h4, h5, h6, hr, figure, p, pre {
  margin: 0;
}

fieldset {
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
}

ol, ul, menu {
  margin: 0;
  padding: 0;
  list-style: none;
}

textarea {
  resize: vertical;
}

input::placeholder, textarea::placeholder {
  opacity: 1;
  color: #9ca3af;
}

button, [role="button"] {
  cursor: pointer;
}

:disabled {
  cursor: default;
}

img, svg, video, canvas, audio, iframe, embed, object {
  vertical-align: middle;
  display: block;
}

img, video {
  max-width: 100%;
  height: auto;
}

[hidden] {
  display: none;
}

*, :before, :after {
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x: ;
  --tw-pan-y: ;
  --tw-pinch-zoom: ;
  --tw-scroll-snap-strictness: proximity;
  --tw-ordinal: ;
  --tw-slashed-zero: ;
  --tw-numeric-figure: ;
  --tw-numeric-spacing: ;
  --tw-numeric-fraction: ;
  --tw-ring-inset: ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: #3b82f680;
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur: ;
  --tw-brightness: ;
  --tw-contrast: ;
  --tw-grayscale: ;
  --tw-hue-rotate: ;
  --tw-invert: ;
  --tw-saturate: ;
  --tw-sepia: ;
  --tw-drop-shadow: ;
  --tw-backdrop-blur: ;
  --tw-backdrop-brightness: ;
  --tw-backdrop-contrast: ;
  --tw-backdrop-grayscale: ;
  --tw-backdrop-hue-rotate: ;
  --tw-backdrop-invert: ;
  --tw-backdrop-opacity: ;
  --tw-backdrop-saturate: ;
  --tw-backdrop-sepia: ;
}

.charset-cube-container {
  align-self: flex-start;
  font-size: 6vw;
  display: none;
  position: sticky;
  top: 45px;
}

@media (min-width: 768px) {
  .charset-cube-container {
    grid-column: span 4 / span 4;
    display: flex;
  }
}

@media (min-width: 1024px) {
  .charset-cube-container {
    font-size: 6vw;
  }
}

.charset-cube {
}

.cube-type-container {
  aspect-ratio: 1 / 1.16;
  width: 100%;
  display: block;
  position: absolute;
}

.cube-type {
  height: auto;
  width: 33%;
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
}

.cube-type span {
  position: absolute;
}

.cube-type:before {
  content: "";
  height: 0;
  padding-bottom: 100%;
  display: block;
}

.cube-type-top {
  --tw-translate-x: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y) ) rotate(var(--tw-rotate) ) skewX(var(--tw-skew-x) ) skewY(var(--tw-skew-y) ) scaleX(var(--tw-scale-x) ) scaleY(var(--tw-scale-y) );
  top: 8%;
  left: 50%;
}

.cube-type-top span {
  width: 100px;
  --tw-rotate: 30deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y) ) rotate(var(--tw-rotate) ) skewX(var(--tw-skew-x) ) skewY(var(--tw-skew-y) ) scaleX(var(--tw-scale-x) ) scaleY(var(--tw-scale-y) );
  text-align: center;
  display: block;
}

.cube-type-left {
  --tw-translate-x: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y) ) rotate(var(--tw-rotate) ) skewX(var(--tw-skew-x) ) skewY(var(--tw-skew-y) ) scaleX(var(--tw-scale-x) ) scaleY(var(--tw-scale-y) );
  top: 48%;
  left: 25%;
}

.cube-type-left span {
  width: 100px;
  --tw-rotate: 30deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y) ) rotate(var(--tw-rotate) ) skewX(var(--tw-skew-x) ) skewY(var(--tw-skew-y) ) scaleX(var(--tw-scale-x) ) scaleY(var(--tw-scale-y) );
  text-align: center;
  display: block;
}

.cube-type-right {
  --tw-translate-x: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y) ) rotate(var(--tw-rotate) ) skewX(var(--tw-skew-x) ) skewY(var(--tw-skew-y) ) scaleX(var(--tw-scale-x) ) scaleY(var(--tw-scale-y) );
  top: 48%;
  left: 75%;
}

.cube-type-right span {
  width: 100px;
  --tw-rotate: -30deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y) ) rotate(var(--tw-rotate) ) skewX(var(--tw-skew-x) ) skewY(var(--tw-skew-y) ) scaleX(var(--tw-scale-x) ) scaleY(var(--tw-scale-y) );
  text-align: center;
  display: block;
}

.character-set-section {
  flex-direction: column;
  flex-grow: 1;
  margin-bottom: 25px;
  display: flex;
}

.character-set-container {
  --tw-text-opacity: 1;
  color: rgb(252 255 118 / var(--tw-text-opacity) );
  flex-flow: wrap;
  flex-grow: 1;
  display: flex;
}

.charset-single-char {
  height: 2em;
  width: calc(10% - .05px);
  justify-content: center;
  align-items: center;
  font-size: 20px;
  line-height: 24px;
  display: flex;
  box-shadow: 1px 0 #fff, 0 1px #fff, 1px 1px #fff, inset 1px 0 #fff, inset 0 1px #fff;
}

@media only screen and (min-width: 768px) {
  .charset-single-char {
    height: 2.1em;
    width: calc(8.33333% - .05px);
  }
}

@media only screen and (min-width: 1024px) {
  .charset-single-char {
    height: 2.2em;
    width: calc(5.55556% - .05px);
  }
}

.charset-highlight.zoomed {
  pointer-events: none;
  height: 200px;
  width: 200px;
  --tw-border-opacity: 1;
  border-width: 1px;
  border-color: rgb(255 255 255 / var(--tw-border-opacity) );
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity) );
  text-align: center;
  --tw-text-opacity: 1;
  color: rgb(252 255 118 / var(--tw-text-opacity) );
  font-size: 31vw;
  line-height: 1.575;
  transition-property: opacity;
  transition-duration: .15s;
  transition-timing-function: cubic-bezier(.4, 0, .2, 1);
}

@media (min-width: 768px) {
  .charset-highlight.zoomed {
    height: 300px;
    width: 300px;
    font-size: 22vw;
    line-height: 1.575;
  }
}

@media (min-width: 1024px) {
  .charset-highlight.zoomed {
    font-size: 12vw;
    line-height: 1.375;
  }
}

.messaging-center-nav {
  --tw-translate-y: -45px;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y) ) rotate(var(--tw-rotate) ) skewX(var(--tw-skew-x) ) skewY(var(--tw-skew-y) ) scaleX(var(--tw-scale-x) ) scaleY(var(--tw-scale-y) );
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter, backdrop-filter;
  transition-duration: .15s;
  transition-timing-function: cubic-bezier(.4, 0, 1, 1);
}

.js-messaging-center-nav-active {
  --tw-translate-y: 0;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y) ) rotate(var(--tw-rotate) ) skewX(var(--tw-skew-x) ) skewY(var(--tw-skew-y) ) scaleX(var(--tw-scale-x) ) scaleY(var(--tw-scale-y) );
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter, backdrop-filter;
  transition-duration: .15s;
  transition-timing-function: cubic-bezier(0, 0, .2, 1);
}

*, :before, :after {
  box-sizing: border-box;
  border: 0 solid ;
}

:before, :after {
  --tw-content: "";
}

html {
  -webkit-text-size-adjust: 100%;
  tab-size: 4;
  font-family: GT Planar, Comic Sans MS, cursive;
  line-height: 1.5;
}

body {
  line-height: inherit;
  margin: 0;
}

hr {
  height: 0;
  color: inherit;
  border-top-width: 1px;
}

abbr:where([title]) {
  text-decoration: underline dotted;
}

h1, h2, h3, h4, h5, h6 {
  font-size: inherit;
  font-weight: inherit;
}

a {
  color: inherit;
  text-decoration: inherit;
}

b, strong {
  font-weight: bolder;
}

code, kbd, samp, pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace;
  font-size: 1em;
}

small {
  font-size: 80%;
}

sub, sup {
  vertical-align: baseline;
  font-size: 75%;
  line-height: 0;
  position: relative;
}

sub {
  bottom: -.25em;
}

sup {
  top: -.5em;
}

table {
  text-indent: 0;
  border-color: inherit;
  border-collapse: collapse;
}

button, input, optgroup, select, textarea {
  font-family: inherit;
  font-size: 100%;
  line-height: inherit;
  color: inherit;
  margin: 0;
  padding: 0;
}

button, select {
  text-transform: none;
}

button, [type="button"], [type="reset"], [type="submit"] {
  -webkit-appearance: button;
  background-color: #0000;
  background-image: none;
}

:-moz-focusring {
  outline: auto ;
}

:-moz-ui-invalid {
  box-shadow: none;
}

progress {
  vertical-align: baseline;
}

::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
  height: auto;
}

[type="search"] {
  -webkit-appearance: textfield;
  outline-offset: -2px;
}

::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit;
}

summary {
  display: list-item;
}

blockquote, dl, dd, h1, h2, h3, h4, h5, h6, hr, figure, p, pre {
  margin: 0;
}

fieldset {
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
}

ol, ul, menu {
  margin: 0;
  padding: 0;
  list-style: none;
}

textarea {
  resize: vertical;
}

input::placeholder, textarea::placeholder {
  opacity: 1;
  color: #9ca3af;
}

button, [role="button"] {
  cursor: pointer;
}

:disabled {
  cursor: default;
}

img, svg, video, canvas, audio, iframe, embed, object {
  vertical-align: middle;
  display: block;
}

img, video {
  max-width: 100%;
  height: auto;
}

[hidden] {
  display: none;
}

*, :before, :after {
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x: ;
  --tw-pan-y: ;
  --tw-pinch-zoom: ;
  --tw-scroll-snap-strictness: proximity;
  --tw-ordinal: ;
  --tw-slashed-zero: ;
  --tw-numeric-figure: ;
  --tw-numeric-spacing: ;
  --tw-numeric-fraction: ;
  --tw-ring-inset: ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: #3b82f680;
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur: ;
  --tw-brightness: ;
  --tw-contrast: ;
  --tw-grayscale: ;
  --tw-hue-rotate: ;
  --tw-invert: ;
  --tw-saturate: ;
  --tw-sepia: ;
  --tw-drop-shadow: ;
  --tw-backdrop-blur: ;
  --tw-backdrop-brightness: ;
  --tw-backdrop-contrast: ;
  --tw-backdrop-grayscale: ;
  --tw-backdrop-hue-rotate: ;
  --tw-backdrop-invert: ;
  --tw-backdrop-opacity: ;
  --tw-backdrop-saturate: ;
  --tw-backdrop-sepia: ;
}

.hud-overlay-container {
  --hud-inactive-scale: 1;
  will-change: transform;
  transform: scale3d( var(--hud-inactive-scale), var(--hud-inactive-scale), var(--hud-inactive-scale) );
  pointer-events: none;
  -webkit-user-select: none;
  user-select: none;
  transition: transform 1s ease-in-out;
}

.hud-overlay-container.disable-transition {
  transition: none;
}

.hud-overlay-container > div {
  pointer-events: initial;
}

.hud-overlay-active .hud-overlay-container {
  transition: transform .2s ease-in-out;
  transform: scale3d(1, 1, 1);
}

.hud-element-container {
  --tw-border-opacity: 1;
  border-width: 2px;
  border-color: rgb(96 96 96 / var(--tw-border-opacity) );
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity) );
}

.hud-status-dot {
  height: 5px;
  width: 5px;
  border-radius: 9999px;
  margin-bottom: 2px;
  display: inline-block;
}

@media (min-width: 1024px) {
  .hud-status-dot {
    margin-top: 5px;
    margin-bottom: 4px;
  }
}

.hud-nav-dot {
  height: 5px;
  width: 5px;
  border-radius: 9999px;
  display: block;
}

@media (min-width: 768px) {
  .hud-nav-dot {
    height: 10px;
    width: 10px;
    margin-bottom: 4px;
  }
}

.hud-dot__inactive {
  --tw-bg-opacity: 1;
  background-color: rgb(0 92 0 / var(--tw-bg-opacity) );
}

.hud-dot__active {
  --tw-bg-opacity: 1;
  background-color: rgb(0 255 133 / var(--tw-bg-opacity) );
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.hud-dot__active {
  --tw-bg-opacity: 1;
  background-color: rgb(96 96 96 / var(--tw-bg-opacity) );
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.hud-dot__active:nth-last-child(1) {
  animation: animation-loading-hud-batbg-fill .2s step-end;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.hud-dot__active:nth-last-child(2) {
  animation: animation-loading-hud-batbg-fill .2s step-end 1.5s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.hud-dot__active:nth-last-child(3) {
  animation: animation-loading-hud-batbg-fill .2s step-end 1s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.hud-dot__active:nth-last-child(4) {
  animation: animation-loading-hud-batbg-fill .2s step-end .5s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.hud-dot__active:nth-last-child(5) {
  animation: animation-loading-hud-batbg-fill .2s step-end 4.5s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.hud-dot__active:nth-last-child(6) {
  animation: animation-loading-hud-batbg-fill .2s step-end .25s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.hud-dot__active:nth-last-child(7) {
  animation: animation-loading-hud-batbg-fill .2s step-end 2.75s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.hud-dot__active:nth-last-child(8) {
  animation: animation-loading-hud-batbg-fill .2s step-end 3.5s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.hud-dot__active:nth-last-child(9) {
  animation: animation-loading-hud-batbg-fill .2s step-end 4.7s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.hud-dot__active:nth-child(9) {
  animation: animation-loading-hud-batbg-fill .2s step-end 4.5s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.hud-dot__active:nth-child(20) {
  animation: animation-loading-hud-batbg-fill .2s step-end 1.8s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.hud-dot__active:nth-child(17) {
  animation: animation-loading-hud-batbg-fill .2s step-end 1.2s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.hud-dot__active:nth-child(23) {
  animation: animation-loading-hud-batbg-fill .2s step-end .6s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.hud-dot__active:nth-child(10) {
  animation: animation-loading-hud-batbg-fill .2s step-end 4.1s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.hud-dot__active:nth-child(8) {
  animation: animation-loading-hud-batbg-fill .2s step-end .4s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.hud-dot__active:nth-child(3) {
  animation: animation-loading-hud-batbg-fill .2s step-end 3.9s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.hud-dot__active:nth-child(24) {
  animation: animation-loading-hud-batbg-fill .2s step-end 3.6s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.hud-dot__active:nth-child(14) {
  animation: animation-loading-hud-batbg-fill .2s step-end .9s;
}

.timewarp-active div[data-component="hud__battery-inner"] span.hud-dot__active {
  animation: animation-intro-hud-bg-blinking .5s step-end infinite;
}

.hud-dot__fail {
  --tw-bg-opacity: 1;
  background-color: rgb(255 0 61 / var(--tw-bg-opacity) );
}

@media (min-width: 1024px) {
  .hud-status-area .hud-status-dot {
    margin-right: 6px;
  }
}

.battery-status {
  padding-left: 2px;
  padding-right: 2px;
}

.battery-empty {
  background-image: url("../images/bat-empty.02f4463a.png");
  background-repeat: space;
}

.battery-full {
  background-image: url("../images/../images/bat-full.5d588121.png");
  background-repeat: space;
}

.speedometer-counter {
  letter-spacing: .15em;
  text-align: center;
  z-index: 1;
  text-transform: uppercase;
  color: #000;
  font-variation-settings: "wght" 700, "slnt" 0;
  font-size: 26px;
  position: relative;
}

.speedometer-counter:before {
  content: attr(data-outline-duplicate-text);
  width: 100%;
  z-index: -1;
  text-align: center;
  -webkit-text-stroke: 2px #00ff85;
  font-variation-settings: "wght" 700, "slnt" 0;
  position: absolute;
  top: 0;
  left: 0;
}

.speedometer-dial {
  --rotation: -45deg;
  transform-origin: 74px 108px;
  transform: rotate(var(--rotation) );
  will-change: transform;
  transition: transform .2s;
}

.vector-full {
  background-image: url("../images/../images/bat-full.5d588121.png");
  background-repeat: space;
}

.vec-desktop-bg {
  background-image: url("../images/vec-desktop-bg.d10c5173.png");
  background-repeat: repeat;
  background-size: 8%;
}

.pilot-stat-empty {
  background-image: url("../images/stats-empty.d77c7604.gif");
  background-repeat: repeat-x;
}

.pilot-stat-full {
  background-image: url("../images/../images/stats-full.59cc70b2.gif");
  background-repeat: repeat-x;
}

.pilot-portrait {
  width: 6em;
  display: block;
  position: relative;
}

.pilot-portrait-errors {
  z-index: 50;
  height: 100%;
  width: 100%;
  background-image: url("../images/gie3.png");
  background-size: cover;
  position: absolute;
}

.pilot-portrait-colorize {
  z-index: 40;
  height: 100%;
  width: 100%;
  background-color: rgb(0 92 0 / var(--tw-bg-opacity) );
  --tw-bg-opacity: .1;
  background-blend-mode: color;
  position: absolute;
}

.pilot-portrait-image {
  z-index: 30;
  height: 100%;
  width: 100%;
  background-color: rgb(0 255 133 / var(--tw-bg-opacity) );
  --tw-bg-opacity: .5;
  background-blend-mode: overlay;
  background-position: center;
  background-size: cover;
  position: absolute;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.pilot-portrait-image {
  --tw-bg-opacity: 1;
  background-color: rgb(96 96 96 / var(--tw-bg-opacity) );
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.pilot-portrait-image:nth-last-child(1) {
  animation: animation-loading-hud-batbg-fill .2s step-end;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.pilot-portrait-image:nth-last-child(2) {
  animation: animation-loading-hud-batbg-fill .2s step-end 1.5s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.pilot-portrait-image:nth-last-child(3) {
  animation: animation-loading-hud-batbg-fill .2s step-end 1s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.pilot-portrait-image:nth-last-child(4) {
  animation: animation-loading-hud-batbg-fill .2s step-end .5s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.pilot-portrait-image:nth-last-child(5) {
  animation: animation-loading-hud-batbg-fill .2s step-end 4.5s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.pilot-portrait-image:nth-last-child(6) {
  animation: animation-loading-hud-batbg-fill .2s step-end .25s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.pilot-portrait-image:nth-last-child(7) {
  animation: animation-loading-hud-batbg-fill .2s step-end 2.75s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.pilot-portrait-image:nth-last-child(8) {
  animation: animation-loading-hud-batbg-fill .2s step-end 3.5s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.pilot-portrait-image:nth-last-child(9) {
  animation: animation-loading-hud-batbg-fill .2s step-end 4.7s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.pilot-portrait-image:nth-child(9) {
  animation: animation-loading-hud-batbg-fill .2s step-end 4.5s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.pilot-portrait-image:nth-child(20) {
  animation: animation-loading-hud-batbg-fill .2s step-end 1.8s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.pilot-portrait-image:nth-child(17) {
  animation: animation-loading-hud-batbg-fill .2s step-end 1.2s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.pilot-portrait-image:nth-child(23) {
  animation: animation-loading-hud-batbg-fill .2s step-end .6s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.pilot-portrait-image:nth-child(10) {
  animation: animation-loading-hud-batbg-fill .2s step-end 4.1s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.pilot-portrait-image:nth-child(8) {
  animation: animation-loading-hud-batbg-fill .2s step-end .4s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.pilot-portrait-image:nth-child(3) {
  animation: animation-loading-hud-batbg-fill .2s step-end 3.9s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.pilot-portrait-image:nth-child(24) {
  animation: animation-loading-hud-batbg-fill .2s step-end 3.6s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.pilot-portrait-image:nth-child(14) {
  animation: animation-loading-hud-batbg-fill .2s step-end .9s;
}

.timewarp-active div[data-component="hud__battery-inner"] span.pilot-portrait-image {
  animation: animation-intro-hud-bg-blinking .5s step-end infinite;
}

.pilot-portrait-background {
  z-index: 20;
  height: 100%;
  width: 100%;
  background-image: url("../images/pilot-bg.0ebc883e.gif");
  background-size: cover;
  position: absolute;
}

.mod-viz {
  height: 66px;
  width: 100%;
  display: block;
  position: relative;
}

.mod-viz-overlay {
  z-index: 50;
  height: 100%;
  width: 100%;
  background-image: url("../images/mod-overlay.53ec594f.gif");
  background-size: cover;
  position: absolute;
}

.mod-viz-candles {
  z-index: 40;
  height: 100%;
  width: 100%;
  background-image: url("../images/../images/mod-candles.d65006db.png");
  background-position: 0 0;
  background-repeat: repeat-x;
  background-size: cover;
  animation: animation-mod-viz-candles 20s linear infinite;
  position: absolute;
}

.mod-viz-bg {
  z-index: 30;
  height: 100%;
  width: 100%;
  background-image: url("../images/mod-bg.7c5d5cd2.png");
  background-size: cover;
  position: absolute;
}

.hud-tilt-mode-active {
}

.no-touch .hud-tilt-mode-request, .hud-tilt-mode-active .hud-tilt-mode-request {
  display: none;
}

.hud-tilt-mode-indicator-off {
  --tw-text-opacity: 1;
  color: rgb(255 0 61 / var(--tw-text-opacity) );
}

.hud-tilt-mode-indicator-on, .no-touch .hud-tilt-mode-indicator-off, .hud-tilt-mode-active .hud-tilt-mode-indicator-off {
  --tw-text-opacity: 1;
  color: rgb(96 96 96 / var(--tw-text-opacity) );
}

.no-touch .hud-tilt-mode-indicator-on, .hud-tilt-mode-active .hud-tilt-mode-indicator-on {
  --tw-text-opacity: 1;
  color: rgb(0 255 133 / var(--tw-text-opacity) );
}

.intro-active .hud-nav-buttons {
  display: none !important;
}

@keyframes animation-loading-hud-bg-blinking {
  0% {
    --tw-bg-opacity: 1;
    background-color: rgb(0 92 0 / var(--tw-bg-opacity) );
  }

  50% {
    --tw-bg-opacity: 1;
    background-color: rgb(0 44 0 / var(--tw-bg-opacity) );
  }
}

@keyframes animation-loading-hud-text-blinking {
  0% {
    --tw-text-opacity: 1;
    color: rgb(0 0 0 / var(--tw-text-opacity) );
  }

  50% {
    --tw-text-opacity: 1;
    color: rgb(0 44 0 / var(--tw-text-opacity) );
  }
}

@keyframes animation-loading-hud-border-blinking {
  0% {
    --tw-border-opacity: 1;
    border-color: rgb(0 0 0 / var(--tw-border-opacity) );
  }

  50% {
    --tw-border-opacity: 1;
    border-color: rgb(0 44 0 / var(--tw-border-opacity) );
  }
}

@keyframes animation-loading-hud-fill-blinking {
  0% {
    fill: #000;
  }

  50% {
    fill: #002c00;
  }
}

@keyframes animation-loading-hud-text-stroke-blinking {
  0% {
    -webkit-text-stroke: 2px #000;
  }

  50% {
    -webkit-text-stroke: 2px #002c00;
  }
}

@keyframes animation-loading-hud-stroke-blinking {
  0% {
    stroke: #000;
  }

  50% {
    stroke: #002c00;
  }
}

@keyframes animation-intro-hud-bg-gray-blinking {
  0% {
    --tw-bg-opacity: 1;
    background-color: rgb(255 0 61 / var(--tw-bg-opacity) );
  }

  50% {
    --tw-bg-opacity: 1;
    background-color: rgb(96 96 96 / var(--tw-bg-opacity) );
  }
}

@keyframes animation-loading-hud-statusloading-blinking {
  0% {
    --tw-bg-opacity: 1;
    background-color: rgb(0 0 0 / var(--tw-bg-opacity) );
  }

  50% {
    --tw-bg-opacity: 1;
    background-color: rgb(0 255 133 / var(--tw-bg-opacity) );
  }
}

@keyframes animation-loading-hud-batbg-fill {
  0% {
    --tw-bg-opacity: 1;
    background-color: rgb(148 148 148 / var(--tw-bg-opacity) );
  }

  50% {
    --tw-bg-opacity: 1;
    background-color: rgb(96 96 96 / var(--tw-bg-opacity) );
  }
}

.intro-active.intro-pre-warp .hud-sonar-ellipses, .intro-active.intro-pre-warp .speedometer-counter:before {
  -webkit-text-stroke: #606060;
}

.intro-active.intro-pre-warp div[data-component="hud__vec-puck-track"], .intro-active.intro-pre-warp div[data-component="hud__vec-px"], .intro-active.intro-pre-warp div[data-component="hud__tilt-pc"] {
  --tw-border-opacity: 1;
  border-color: rgb(96 96 96 / var(--tw-border-opacity) );
  --tw-bg-opacity: 1;
  background-color: rgb(96 96 96 / var(--tw-bg-opacity) );
}

.intro-active.intro-pre-warp .hud-status-dot {
  --tw-bg-opacity: 1;
  background-color: rgb(96 96 96 / var(--tw-bg-opacity) );
}

.intro-pre-warp [data-component="hud__battery-pc"] {
  --tw-text-opacity: 1;
  color: rgb(148 148 148 / var(--tw-text-opacity) );
}

.intro-active.intro-pre-warp .mod-viz {
  --tw-border-opacity: 1;
  border-color: rgb(148 148 148 / var(--tw-border-opacity) );
}

.intro-active.intro-pre-warp .mod-viz-candles {
  background-image: url("../images/mod-candles-loading.e391185c.png");
  animation: animation-mod-viz-candles 10s steps(20, end) infinite;
}

.scroll-animations-active .mod-viz-candles {
  background-image: url("../images/../images/mod-candles.d65006db.png");
  animation: animation-mod-viz-candles 20s linear infinite;
}

.intro-active.intro-pre-warp .mod-viz-overlay {
  opacity: 0;
}

.intro-active.intro-pre-warp .hud-status-area div div .hud-status-dot {
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity) );
  animation: animation-loading-hud-statusloading-blinking 6s step-end;
}

.intro-active.intro-pre-warp .hud-status-area div:nth-of-type(1) div .hud-status-dot {
  animation-delay: .25s;
}

.intro-active.intro-pre-warp .hud-status-area div:nth-of-type(2) div .hud-status-dot {
  animation-delay: .5s;
}

.intro-active.intro-pre-warp .hud-status-area div:nth-of-type(3) div .hud-status-dot {
  animation-delay: .75s;
}

.intro-active.intro-pre-warp .hud-status-area div:nth-of-type(4) div .hud-status-dot {
  animation-delay: 1s;
}

.intro-active.intro-pre-warp .hud-status-area div:nth-of-type(5) div .hud-status-dot {
  animation-delay: 1.25s;
}

.intro-active.intro-pre-warp foreignObject[data-component="hud__tape-counter-count"] {
  --tw-bg-opacity: 1 !important;
  background-color: rgb(96 96 96 / var(--tw-bg-opacity) ) !important;
  --tw-text-opacity: 1 !important;
  color: rgb(96 96 96 / var(--tw-text-opacity) ) !important;
}

.intro-active.intro-pre-warp .animation-hud-bp-wheel, .intro-active.intro-pre-warp .animation-hud-r-wheel {
  animation-duration: 8s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.bg-green {
  --tw-bg-opacity: 1;
  background-color: rgb(96 96 96 / var(--tw-bg-opacity) );
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.bg-green:nth-last-child(1) {
  animation: animation-loading-hud-batbg-fill .2s step-end;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.bg-green:nth-last-child(2) {
  animation: animation-loading-hud-batbg-fill .2s step-end 1.5s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.bg-green:nth-last-child(3) {
  animation: animation-loading-hud-batbg-fill .2s step-end 1s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.bg-green:nth-last-child(4) {
  animation: animation-loading-hud-batbg-fill .2s step-end .5s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.bg-green:nth-last-child(5) {
  animation: animation-loading-hud-batbg-fill .2s step-end 4.5s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.bg-green:nth-last-child(6) {
  animation: animation-loading-hud-batbg-fill .2s step-end .25s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.bg-green:nth-last-child(7) {
  animation: animation-loading-hud-batbg-fill .2s step-end 2.75s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.bg-green:nth-last-child(8) {
  animation: animation-loading-hud-batbg-fill .2s step-end 3.5s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.bg-green:nth-last-child(9) {
  animation: animation-loading-hud-batbg-fill .2s step-end 4.7s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.bg-green:nth-child(9) {
  animation: animation-loading-hud-batbg-fill .2s step-end 4.5s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.bg-green:nth-child(20) {
  animation: animation-loading-hud-batbg-fill .2s step-end 1.8s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.bg-green:nth-child(17) {
  animation: animation-loading-hud-batbg-fill .2s step-end 1.2s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.bg-green:nth-child(23) {
  animation: animation-loading-hud-batbg-fill .2s step-end .6s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.bg-green:nth-child(10) {
  animation: animation-loading-hud-batbg-fill .2s step-end 4.1s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.bg-green:nth-child(8) {
  animation: animation-loading-hud-batbg-fill .2s step-end .4s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.bg-green:nth-child(3) {
  animation: animation-loading-hud-batbg-fill .2s step-end 3.9s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.bg-green:nth-child(24) {
  animation: animation-loading-hud-batbg-fill .2s step-end 3.6s;
}

.intro-active.intro-pre-warp div[data-component="hud__battery-inner"] span.bg-green:nth-child(14) {
  animation: animation-loading-hud-batbg-fill .2s step-end .9s;
}

.intro-active.intro-pre-warp .pilot-portrait-errors {
  background-blend-mode: difference;
  background-image: url("../images/pilot-glitch-loading.164ac7c5.gif");
}

@keyframes animation-intro-hud-bg-blinking {
  0% {
    --tw-bg-opacity: 1;
    background-color: rgb(255 0 61 / var(--tw-bg-opacity) );
  }

  50% {
    --tw-bg-opacity: 1;
    background-color: rgb(40 0 0 / var(--tw-bg-opacity) );
  }
}

@keyframes animation-intro-hud-text-blinking {
  0% {
    --tw-text-opacity: 1;
    color: rgb(255 0 61 / var(--tw-text-opacity) );
  }

  50% {
    --tw-text-opacity: 1;
    color: rgb(40 0 0 / var(--tw-text-opacity) );
  }
}

@keyframes animation-intro-hud-border-blinking {
  0% {
    --tw-border-opacity: 1;
    border-color: rgb(89 1 1 / var(--tw-border-opacity) );
  }

  50% {
    --tw-border-opacity: 1;
    border-color: rgb(255 0 61 / var(--tw-border-opacity) );
  }
}

@keyframes animation-intro-hud-fill-blinking {
  0% {
    fill: #590101;
  }

  50% {
    fill: #ff003d;
  }
}

@keyframes animation-intro-hud-text-stroke-blinking {
  0% {
    -webkit-text-stroke: 2px #280000;
  }

  50% {
    -webkit-text-stroke: 2px #ff003d;
  }
}

@keyframes animation-intro-hud-stroke-blinking {
  0% {
    stroke: #280000;
  }

  50% {
    stroke: #ff003d;
  }
}

.timewarp-active .animation-snr-plus1, .timewarp-active .animation-snr-plus2, .timewarp-active .animation-snr-plus3, .timewarp-active .animation-snr-plus4, .timewarp-active .animation-snr-plus5 {
  opacity: 0 !important;
}

.timewarp-active .hud-sonar-ellipses {
  animation: animation-intro-hud-stroke-blinking .5s step-end infinite;
}

.timewarp-active .speedometer-counter:before {
  animation: animation-intro-hud-text-stroke-blinking .5s step-end infinite;
}

.timewarp-active div[data-component="hud__vec-puck-track"], .timewarp-active div[data-component="hud__vec-px"], .timewarp-active div[data-component="hud__tilt-pc"] {
  animation: animation-intro-hud-bg-blinking .5s step-end infinite, animation-intro-hud-border-blinking .5s step-end infinite;
}

.timewarp-active .mod-viz {
  animation: animation-intro-hud-border-blinking .5s step-end infinite;
}

.timewarp-active .hud-status-dot {
  animation: animation-intro-hud-bg-blinking .5s step-end infinite;
}

.timewarp-active [data-component="hud__battery-pc"], .timewarp-active .marquee3k__wrapper {
  animation: animation-intro-hud-text-blinking .5s step-end infinite;
}

.timewarp-active .pilot-stat-full {
  background-image: url("../images/stats-full-red.e5efd38d.gif");
}

.timewarp-active .animation-hud-bp-wheel, .timewarp-active .animation-hud-r-wheel {
  animation-duration: .3s;
}

.timewarp-active .b-p-tape-recorder svg circle, .timewarp-active .b-p-tape-recorder svg path, .timewarp-active .b-p-tape-recorder svg line {
  animation: animation-intro-hud-stroke-blinking .5s step-end infinite;
}

.timewarp-active .b-p-tape-recorder-circlefilled {
  animation: animation-intro-hud-fill-blinking .5s step-end infinite;
}

.timewarp-active foreignObject[data-component="hud__tape-counter-count"] {
  --tw-bg-opacity: 1;
  background-color: rgb(255 0 61 / var(--tw-bg-opacity) );
  --tw-text-opacity: 1;
  color: rgb(255 138 0 / var(--tw-text-opacity) );
}

.hud-bat-flux {
  padding-top: 2px;
  display: none;
}

@media (min-width: 768px) {
  .hud-bat-flux {
    display: block;
  }
}

.hud-bat-flux-warp {
  display: none;
}

@media (min-width: 768px) {
  .timewarp-active .hud-bat-flux-def {
    display: none;
  }

  .timewarp-active .hud-bat-flux-warp {
    display: block;
  }
}

.timewarp-active div[data-component="hud__battery-inner"] span.bg-green {
  animation: animation-intro-hud-bg-blinking .5s step-end infinite;
}

@keyframes pilot-stat-intro {
  0% {
    width: 95%;
  }

  15% {
    width: 99%;
  }

  30% {
    width: 93%;
  }

  80% {
    width: 100%;
  }

  100% {
    width: 98%;
  }
}

.timewarp-active .pilot-stat-container {
  --tw-border-opacity: 1;
  border-color: rgb(255 0 61 / var(--tw-border-opacity) );
}

.timewarp-active .anim-pilot-stat-focus, .timewarp-active .anim-pilot-stat-oxygen, .timewarp-active .anim-pilot-stat-awake, .timewarp-active .anim-pilot-stat-curiosity, .timewarp-active .anim-pilot-stat-ability, .timewarp-active .anim-pilot-stat-chill {
  animation-name: pilot-stat-intro;
}

.timewarp-active .anim-pilot-stat-oxygen {
  animation-delay: .5s;
}

.timewarp-active .anim-pilot-stat-awake {
  animation-delay: .35s;
}

.timewarp-active .anim-pilot-stat-curiosity {
  animation-delay: .25s;
}

.timewarp-active .anim-pilot-stat-ability {
  animation-delay: .7s;
}

.timewarp-active .anim-pilot-stat-chill {
  animation-delay: 1.2s;
}

.timewarp-active .pilot-portrait-image {
  animation: animation-intro-hud-bg-blinking .5s step-end infinite;
}

.timewarp-active .mod-viz-candles {
  background-image: url("../images/mod-candles-warp.e13d2d2e.png");
  animation: animation-mod-viz-candles .15s steps(2, end) infinite;
}

.timewarp-active .mod-viz-overlay {
  opacity: 0;
}

.timewarp-active .animation-hud-bp-wheel, .timewarp-active .animation-hud-r-wheel {
  animation-duration: .3s;
}

.warp-show, .timewarp-active .warp-hide {
  display: none;
}

.timewarp-active .warp-show {
  display: block;
}

*, :before, :after {
  box-sizing: border-box;
  border: 0 solid ;
}

:before, :after {
  --tw-content: "";
}

html {
  -webkit-text-size-adjust: 100%;
  tab-size: 4;
  font-family: GT Planar, Comic Sans MS, cursive;
  line-height: 1.5;
}

body {
  line-height: inherit;
  margin: 0;
}

hr {
  height: 0;
  color: inherit;
  border-top-width: 1px;
}

abbr:where([title]) {
  text-decoration: underline dotted;
}

h1, h2, h3, h4, h5, h6 {
  font-size: inherit;
  font-weight: inherit;
}

a {
  color: inherit;
  text-decoration: inherit;
}

b, strong {
  font-weight: bolder;
}

code, kbd, samp, pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace;
  font-size: 1em;
}

small {
  font-size: 80%;
}

sub, sup {
  vertical-align: baseline;
  font-size: 75%;
  line-height: 0;
  position: relative;
}

sub {
  bottom: -.25em;
}

sup {
  top: -.5em;
}

table {
  text-indent: 0;
  border-color: inherit;
  border-collapse: collapse;
}

button, input, optgroup, select, textarea {
  font-family: inherit;
  font-size: 100%;
  line-height: inherit;
  color: inherit;
  margin: 0;
  padding: 0;
}

button, select {
  text-transform: none;
}

button, [type="button"], [type="reset"], [type="submit"] {
  -webkit-appearance: button;
  background-color: #0000;
  background-image: none;
}

:-moz-focusring {
  outline: auto ;
}

:-moz-ui-invalid {
  box-shadow: none;
}

progress {
  vertical-align: baseline;
}

::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
  height: auto;
}

[type="search"] {
  -webkit-appearance: textfield;
  outline-offset: -2px;
}

::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit;
}

summary {
  display: list-item;
}

blockquote, dl, dd, h1, h2, h3, h4, h5, h6, hr, figure, p, pre {
  margin: 0;
}

fieldset {
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
}

ol, ul, menu {
  margin: 0;
  padding: 0;
  list-style: none;
}

textarea {
  resize: vertical;
}

input::placeholder, textarea::placeholder {
  opacity: 1;
  color: #9ca3af;
}

button, [role="button"] {
  cursor: pointer;
}

:disabled {
  cursor: default;
}

img, svg, video, canvas, audio, iframe, embed, object {
  vertical-align: middle;
  display: block;
}

img, video {
  max-width: 100%;
  height: auto;
}

[hidden] {
  display: none;
}

*, :before, :after {
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x: ;
  --tw-pan-y: ;
  --tw-pinch-zoom: ;
  --tw-scroll-snap-strictness: proximity;
  --tw-ordinal: ;
  --tw-slashed-zero: ;
  --tw-numeric-figure: ;
  --tw-numeric-spacing: ;
  --tw-numeric-fraction: ;
  --tw-ring-inset: ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: #3b82f680;
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur: ;
  --tw-brightness: ;
  --tw-contrast: ;
  --tw-grayscale: ;
  --tw-hue-rotate: ;
  --tw-invert: ;
  --tw-saturate: ;
  --tw-sepia: ;
  --tw-drop-shadow: ;
  --tw-backdrop-blur: ;
  --tw-backdrop-brightness: ;
  --tw-backdrop-contrast: ;
  --tw-backdrop-grayscale: ;
  --tw-backdrop-hue-rotate: ;
  --tw-backdrop-invert: ;
  --tw-backdrop-opacity: ;
  --tw-backdrop-saturate: ;
  --tw-backdrop-sepia: ;
}

.container {
  width: 100%;
}

@media (min-width: 640px) {
  .container {
    max-width: 640px;
  }
}

@media (min-width: 768px) {
  .container {
    max-width: 768px;
  }
}

@media (min-width: 1024px) {
  .container {
    max-width: 1024px;
  }
}

@media (min-width: 1280px) {
  .container {
    max-width: 1280px;
  }
}

@media (min-width: 1536px) {
  .container {
    max-width: 1536px;
  }
}

.typetester-overlay-container {
  pointer-events: none;
  transition: transform 1s ease-in-out;
  transform: scale3d(1.8, 1.8, 1);
}

.typetester-overlay-container > div {
  pointer-events: initial;
}

.typetester-overlay-active .typetester-overlay-container {
  transition: transform .2s ease-in-out;
  transform: scale(100%);
}

.tt__bg {
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s;
}

.typetester-overlay-active .tt__bg {
  opacity: 1;
}

.typetester-control-area-deactivated.typetester-control-area-left {
  transition: transform .2s ease-in-out;
  transform: translateX(-120%);
}

.typetester-control-area-deactivated.typetester-control-area-bottom {
  --tw-translate-y: 420%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y) ) rotate(var(--tw-rotate) ) skewX(var(--tw-skew-x) ) skewY(var(--tw-skew-y) ) scaleX(var(--tw-scale-x) ) scaleY(var(--tw-scale-y) );
  transition: transform .2s ease-in-out;
}

@media (min-width: 768px) {
  .typetester-control-area-deactivated.typetester-control-area-bottom {
    --tw-translate-y: 110%;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y) ) rotate(var(--tw-rotate) ) skewX(var(--tw-skew-x) ) skewY(var(--tw-skew-y) ) scaleX(var(--tw-scale-x) ) scaleY(var(--tw-scale-y) );
  }
}

.typetester-control-area-deactivated.typetester-control-area-bottom-mobileonly {
  --tw-translate-y: 110%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y) ) rotate(var(--tw-rotate) ) skewX(var(--tw-skew-x) ) skewY(var(--tw-skew-y) ) scaleX(var(--tw-scale-x) ) scaleY(var(--tw-scale-y) );
  transition: transform .2s ease-in-out;
}

@media (min-width: 768px) {
  .typetester-control-area-deactivated.typetester-control-area-bottom-mobileonly {
    --tw-translate-y: 0;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y) ) rotate(var(--tw-rotate) ) skewX(var(--tw-skew-x) ) skewY(var(--tw-skew-y) ) scaleX(var(--tw-scale-x) ) scaleY(var(--tw-scale-y) );
  }
}

.typetester-element-container {
  --tw-border-opacity: 1;
  border-width: 2px;
  border-color: rgb(96 96 96 / var(--tw-border-opacity) );
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity) );
}

.typetester-status-dot {
  height: 5px;
  width: 5px;
  border-radius: 9999px;
  margin-bottom: 2px;
  display: inline-block;
}

@media (min-width: 1024px) {
  .typetester-status-dot {
    margin-bottom: 4px;
  }
}

.typetester-nav-dot {
  height: 10px;
  width: 10px;
  border-radius: 9999px;
  margin-bottom: 4px;
  display: block;
}

.typetester-dot__inactive {
  --tw-bg-opacity: 1;
  background-color: rgb(41 0 108 / var(--tw-bg-opacity) );
}

.typetester-dot__active {
  --tw-bg-opacity: 1;
  background-color: rgb(0 255 133 / var(--tw-bg-opacity) );
}

.autopilot:hover {
  --tw-text-opacity: 1;
  color: rgb(123 112 255 / var(--tw-text-opacity) );
}

.typetester-icon-play-inner {
  fill: #1a0014;
}

.autopilot:hover .typetester-icon-play-inner {
  fill: #7b70ff;
}

.typetester-icon-play, .typetester-icon-stop {
  transition: transform .2s;
}

.autopilot-active .autopilot .typetester-icon-play {
  --tw-translate-y: 100%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y) ) rotate(var(--tw-rotate) ) skewX(var(--tw-skew-x) ) skewY(var(--tw-skew-y) ) scaleX(var(--tw-scale-x) ) scaleY(var(--tw-scale-y) );
  transition: transform .2s;
}

.autopilot-active .autopilot .typetester-icon-stop {
  --tw-translate-y: 0%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y) ) rotate(var(--tw-rotate) ) skewX(var(--tw-skew-x) ) skewY(var(--tw-skew-y) ) scaleX(var(--tw-scale-x) ) scaleY(var(--tw-scale-y) );
  transition: transform .2s;
}

.autopilot-active .autopilot .typetester-autoplay-icon-container {
  --tw-bg-opacity: 1;
  background-color: rgb(97 0 255 / var(--tw-bg-opacity) );
}

.autopilot-active .autopilot .typetester-autoplay-info-container {
  --tw-bg-opacity: 1;
  background-color: rgb(41 0 108 / var(--tw-bg-opacity) );
}

.autopilot-active .autopilot:hover .typetester-autoplay-icon-container {
  --tw-bg-opacity: 1;
  background-color: rgb(123 112 255 / var(--tw-bg-opacity) );
}

.autopilot-active .autopilot:hover .typetester-autoplay-info-container {
  --tw-bg-opacity: 1;
  background-color: rgb(97 0 255 / var(--tw-bg-opacity) );
}

.typetester-preset-button {
  --tw-border-opacity: 1;
  border-width: 1px;
  border-color: rgb(97 0 255 / var(--tw-border-opacity) );
  text-align: center;
  flex-direction: column;
  flex-grow: 1;
  justify-content: center;
  align-items: center;
  margin: 2px;
  padding: 5px;
  line-height: 1;
  display: flex;
}

.typetester-preset-button div {
  height: 30px;
  width: 100%;
  --tw-border-opacity: 1;
  border-width: 1px;
  border-color: rgb(97 0 255 / var(--tw-border-opacity) );
  --tw-bg-opacity: 1;
  background-color: rgb(26 0 20 / var(--tw-bg-opacity) );
  margin-bottom: 5px;
}

@media (min-width: 768px) {
  .typetester-preset-button div {
    height: auto;
    min-height: 24px;
  }
}

.typetester-preset-button:hover {
  cursor: pointer;
}

.typetester-preset-button:hover div {
  --tw-bg-opacity: 1;
  background-color: rgb(0 255 133 / var(--tw-bg-opacity) );
}

.typetester-preset-button.typetester-preset-active {
  --tw-bg-opacity: 1;
  background-color: rgb(41 0 108 / var(--tw-bg-opacity) );
  --tw-text-opacity: 1;
  color: rgb(123 112 255 / var(--tw-text-opacity) );
}

.typetester-preset-button.typetester-preset-active div {
  --tw-bg-opacity: 1;
  background-color: rgb(0 255 133 / var(--tw-bg-opacity) );
}

.typetester-features-toggle-indicator {
  height: 100%;
  width: 15px;
  --tw-translate-x: 0px;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y) ) rotate(var(--tw-rotate) ) skewX(var(--tw-skew-x) ) skewY(var(--tw-skew-y) ) scaleX(var(--tw-scale-x) ) scaleY(var(--tw-scale-y) );
  --tw-bg-opacity: 1;
  background-color: rgb(123 112 255 / var(--tw-bg-opacity) );
  transition: transform .1s;
}

.typetester-features-toggle-indicator-on {
  --tw-translate-x: 15px;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y) ) rotate(var(--tw-rotate) ) skewX(var(--tw-skew-x) ) skewY(var(--tw-skew-y) ) scaleX(var(--tw-scale-x) ) scaleY(var(--tw-scale-y) );
  --tw-bg-opacity: 1;
  background-color: rgb(0 255 133 / var(--tw-bg-opacity) );
  transition: transform .1s;
}

.typetester-powersteering-active div {
  --tw-border-opacity: 1;
  border-color: rgb(0 255 133 / var(--tw-border-opacity) );
  --tw-bg-opacity: 1;
  background-color: rgb(0 255 133 / var(--tw-bg-opacity) );
}

.typetester-powersteering-active div * {
  --tw-border-opacity: 1;
  border-color: rgb(0 255 133 / var(--tw-border-opacity) );
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity) );
  --tw-text-opacity: 1;
  color: rgb(0 255 133 / var(--tw-text-opacity) );
}

.typetester-desktop-angle-indicator {
  transform-origin: 71px 89px;
  padding: 300px;
}

.typetester-desktop-angle-indicator:hover {
  cursor: pointer;
}

.typetester-desktop-angle-indicator circle:hover, .typetester-desktop-angle-indicator stroke:hover {
  fill: #7b70ff;
}

.typetester-desktop-angle-active-angle, .typetester-desktop-weight-active-weight {
  --tw-text-opacity: 1;
  color: rgb(0 255 133 / var(--tw-text-opacity) );
}

.typetester-desktop-weight-slider-container {
}

.typetester-desktop-weight-slider {
  height: 100%;
  width: 100%;
  appearance: none;
  --tw-bg-opacity: 1;
  background-color: rgb(26 0 20 / var(--tw-bg-opacity) );
  outline-offset: 2px;
  outline: 2px solid #0000;
}

.typetester-desktop-weight-slider::-webkit-slider-thumb {
  z-index: 50;
  box-sizing: content-box;
  height: 14px;
  width: 14px;
  cursor: pointer;
  appearance: none;
  --tw-border-opacity: 1;
  border-style: solid;
  border-width: 10px;
  border-color: rgb(97 0 255 / var(--tw-border-opacity) );
  --tw-bg-opacity: 1;
  background-color: rgb(0 255 133 / var(--tw-bg-opacity) );
  border-radius: 9999px;
  margin-top: -50px;
  position: relative;
}

.typetester-desktop-weight-slider::-moz-range-thumb {
  height: 45px;
  width: 45px;
  cursor: pointer;
  appearance: none;
  --tw-border-opacity: 1;
  border-width: 4px;
  border-color: rgb(97 0 255 / var(--tw-border-opacity) );
  --tw-bg-opacity: 1;
  background-color: rgb(41 0 108 / var(--tw-bg-opacity) );
  border-radius: 9999px;
}

.typetester-desktop-weight-slider-background {
  z-index: 0;
  background-image: url("../images/../images/stats-full.59cc70b2.gif");
  background-repeat: repeat;
  margin: 5px;
  position: absolute;
  inset: 0;
}

.typetester-mobile-weight-slider {
  height: 8px;
  transform-origin: 0;
  --tw-rotate: 90deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y) ) rotate(var(--tw-rotate) ) skewX(var(--tw-skew-x) ) skewY(var(--tw-skew-y) ) scaleX(var(--tw-scale-x) ) scaleY(var(--tw-scale-y) );
  appearance: none;
  --tw-border-opacity: 1;
  border-width: 2px;
  border-color: rgb(97 0 255 / var(--tw-border-opacity) );
  --tw-bg-opacity: 1;
  background-color: rgb(26 0 20 / var(--tw-bg-opacity) );
  width: calc(var(--visible-viewport-height)  - 310px);
  margin-top: 5px;
  margin-left: 9px;
}

.typetester-mobile-weight-slider::-webkit-slider-thumb {
  height: 16px;
  width: 16px;
  cursor: pointer;
  appearance: none;
  --tw-border-opacity: 1;
  border-style: solid;
  border-width: 4px;
  border-color: rgb(97 0 255 / var(--tw-border-opacity) );
  --tw-bg-opacity: 1;
  background-color: rgb(41 0 108 / var(--tw-bg-opacity) );
  border-radius: 9999px;
  margin-top: -6px;
}

.typetester-mobile-weight-slider::-webkit-slider-runnable-track {
  height: 4px;
  background-image: url("../images/../images/stats-full-blue.9ed9440e.gif");
  background-repeat: repeat;
}

.typetester-mobile-angle-slider {
  height: 8px;
  appearance: none;
  --tw-border-opacity: 1;
  border-width: 2px;
  border-color: rgb(97 0 255 / var(--tw-border-opacity) );
  --tw-bg-opacity: 1;
  background-color: rgb(26 0 20 / var(--tw-bg-opacity) );
  outline-offset: 2px;
  outline: 2px solid #0000;
}

.typetester-mobile-angle-slider::-webkit-slider-thumb {
  height: 16px;
  width: 16px;
  cursor: pointer;
  appearance: none;
  --tw-border-opacity: 1;
  border-style: solid;
  border-width: 4px;
  border-color: rgb(97 0 255 / var(--tw-border-opacity) );
  --tw-bg-opacity: 1;
  background-color: rgb(41 0 108 / var(--tw-bg-opacity) );
  border-radius: 9999px;
  margin-top: -6px;
}

.typetester-mobile-angle-slider::-webkit-slider-runnable-track {
  height: 4px;
  background-image: url("../images/../images/stats-full-blue.9ed9440e.gif");
  background-repeat: repeat;
}

@keyframes autopilot-def {
  0% {
    font-variation-settings: "wght" 100, "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" 100, "slnt" -45;
  }

  40% {
    font-variation-settings: "wght" 900, "slnt" -45;
  }

  60% {
    font-variation-settings: "wght" 900, "slnt" 45;
  }

  80% {
    font-variation-settings: "wght" 900, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 100, "slnt" 0;
  }
}

.tt__sample {
  will-change: font-variation-settings;
  font-feature-settings: var(--user-font-feature-settings);
  font-variation-settings: "wght" var(--user-wght), "slnt" var(--user-slnt);
}

.autopilot-active .tt__sample[data-active-preset="DEF"] {
  animation: autopilot-def 5s cubic-bezier(.83, 0, .17, 1) infinite;
}

.tt__tv.enter-transition, .tt__sample.enter-transition {
  opacity: 0;
  transform: scaleX(1);
}

.tt__tv.enter-transition-active, .tt__sample.enter-transition-active {
  opacity: 1;
  transition: opacity .25s, transform .25s;
  transform: scaleX(1);
}

.tt__tv.exit-transition, .tt__sample.exit-transition {
  opacity: 1;
  transform: scaleX(1);
}

.tt__tv.exit-transition-active, .tt__sample.exit-transition-active {
  opacity: 0;
  transition: opacity .25s, transform .25s;
  transform: scaleX(0);
}

.tt-tvsample-imp {
  height: 100%;
  width: 100%;
  text-transform: uppercase;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-size: 11vw;
  display: flex;
  overflow: hidden;
}

@media (min-width: 768px) {
  .tt-tvsample-imp {
    font-size: 11vw;
  }
}

@media (min-width: 1024px) {
  .tt-tvsample-imp {
    font-size: 9vw;
  }
}

.tt-tvsample-imp span {
  animation-duration: 1s;
  animation-timing-function: ease-in;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}

.tt-imp-line-1, .tt-imp-line-2, .tt-imp-line-3, .tt-imp-line-4 {
  --tw-text-opacity: 1;
  color: rgb(97 0 255 / var(--tw-text-opacity) );
  font-variation-settings: "wght" 400, "slnt" 0;
  line-height: 80%;
}

@keyframes tt-imp-line-1-letter1 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" -45;
  }
}

@keyframes tt-imp-line-1-letter2 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" -36;
  }
}

@keyframes tt-imp-line-1-letter3 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" -27;
  }
}

@keyframes tt-imp-line-1-letter4 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" -18;
  }
}

@keyframes tt-imp-line-1-letter5 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" -9;
  }
}

@keyframes tt-imp-line-1-letter6 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" 9;
  }
}

@keyframes tt-imp-line-1-letter7 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" 18;
  }
}

@keyframes tt-imp-line-1-letter8 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" 27;
  }
}

@keyframes tt-imp-line-1-letter9 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" 36;
  }
}

@keyframes tt-imp-line-1-letter10 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" 45;
  }
}

.tt-imp-line-1 span:nth-child(1) {
  animation-name: tt-imp-line-1-letter1;
}

.tt-imp-line-1 span:nth-child(2) {
  animation-name: tt-imp-line-1-letter2;
}

.tt-imp-line-1 span:nth-child(3) {
  animation-name: tt-imp-line-1-letter3;
}

.tt-imp-line-1 span:nth-child(4) {
  animation-name: tt-imp-line-1-letter4;
}

.tt-imp-line-1 span:nth-child(5) {
  animation-name: tt-imp-line-1-letter5;
}

.tt-imp-line-1 span:nth-child(6) {
  animation-name: tt-imp-line-1-letter6;
}

.tt-imp-line-1 span:nth-child(7) {
  animation-name: tt-imp-line-1-letter7;
}

.tt-imp-line-1 span:nth-child(8) {
  animation-name: tt-imp-line-1-letter8;
}

.tt-imp-line-1 span:nth-child(9) {
  animation-name: tt-imp-line-1-letter9;
}

.tt-imp-line-1 span:nth-child(10) {
  animation-name: tt-imp-line-1-letter10;
}

@keyframes tt-imp-line-2-letter1 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" -45;
  }
}

@keyframes tt-imp-line-2-letter2 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" -33.75;
  }
}

@keyframes tt-imp-line-2-letter3 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" -22.5;
  }
}

@keyframes tt-imp-line-2-letter4 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" -11.25;
  }
}

@keyframes tt-imp-line-2-letter5 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" 0;
  }
}

@keyframes tt-imp-line-2-letter6 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" 11.25;
  }
}

@keyframes tt-imp-line-2-letter7 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" 22.5;
  }
}

@keyframes tt-imp-line-2-letter8 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" 33.75;
  }
}

@keyframes tt-imp-line-2-letter9 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" 45;
  }
}

.tt-imp-line-2 span:nth-child(1) {
  animation-name: tt-imp-line-2-letter1;
}

.tt-imp-line-2 span:nth-child(2) {
  animation-name: tt-imp-line-2-letter2;
}

.tt-imp-line-2 span:nth-child(3) {
  animation-name: tt-imp-line-2-letter3;
}

.tt-imp-line-2 span:nth-child(4) {
  animation-name: tt-imp-line-2-letter4;
}

.tt-imp-line-2 span:nth-child(5) {
  animation-name: tt-imp-line-2-letter5;
}

.tt-imp-line-2 span:nth-child(6) {
  animation-name: tt-imp-line-2-letter6;
}

.tt-imp-line-2 span:nth-child(7) {
  animation-name: tt-imp-line-2-letter7;
}

.tt-imp-line-2 span:nth-child(8) {
  animation-name: tt-imp-line-2-letter8;
}

.tt-imp-line-2 span:nth-child(9) {
  animation-name: tt-imp-line-2-letter9;
}

.tt-imp-line-2 span:nth-child(10) {
  animation-name: tt-imp-line-2-letter10;
}

@keyframes tt-imp-line-3-letter1 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" 45;
  }
}

@keyframes tt-imp-line-3-letter2 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" 36;
  }
}

@keyframes tt-imp-line-3-letter3 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" 27;
  }
}

@keyframes tt-imp-line-3-letter4 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" 18;
  }
}

@keyframes tt-imp-line-3-letter5 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" 9;
  }
}

@keyframes tt-imp-line-3-letter6 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" -9;
  }
}

@keyframes tt-imp-line-3-letter7 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" -18;
  }
}

@keyframes tt-imp-line-3-letter8 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" -27;
  }
}

@keyframes tt-imp-line-3-letter9 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" -36;
  }
}

@keyframes tt-imp-line-3-letter10 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" -45;
  }
}

.tt-imp-line-3 span:nth-child(1) {
  animation-name: tt-imp-line-3-letter1;
}

.tt-imp-line-3 span:nth-child(2) {
  animation-name: tt-imp-line-3-letter2;
}

.tt-imp-line-3 span:nth-child(3) {
  animation-name: tt-imp-line-3-letter3;
}

.tt-imp-line-3 span:nth-child(4) {
  animation-name: tt-imp-line-3-letter4;
}

.tt-imp-line-3 span:nth-child(5) {
  animation-name: tt-imp-line-3-letter5;
}

.tt-imp-line-3 span:nth-child(6) {
  animation-name: tt-imp-line-3-letter6;
}

.tt-imp-line-3 span:nth-child(7) {
  animation-name: tt-imp-line-3-letter7;
}

.tt-imp-line-3 span:nth-child(8) {
  animation-name: tt-imp-line-3-letter8;
}

.tt-imp-line-3 span:nth-child(9) {
  animation-name: tt-imp-line-3-letter9;
}

.tt-imp-line-3 span:nth-child(10) {
  animation-name: tt-imp-line-3-letter10;
}

@keyframes tt-imp-line-4-letter1 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" 45;
  }
}

@keyframes tt-imp-line-4-letter2 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" 37.5;
  }
}

@keyframes tt-imp-line-4-letter3 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" 30;
  }
}

@keyframes tt-imp-line-4-letter4 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" 22.5;
  }
}

@keyframes tt-imp-line-4-letter5 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" 15;
  }
}

@keyframes tt-imp-line-4-letter6 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" 7.5;
  }
}

@keyframes tt-imp-line-4-letter7 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" -7.5;
  }
}

@keyframes tt-imp-line-4-letter8 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" -15;
  }
}

@keyframes tt-imp-line-4-letter9 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" -22.5;
  }
}

@keyframes tt-imp-line-4-letter10 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" -30;
  }
}

@keyframes tt-imp-line-4-letter11 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" -37.5;
  }
}

@keyframes tt-imp-line-4-letter12 {
  0% {
    font-variation-settings: "wght" 400, "slnt" 0;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" -45;
  }
}

.tt-imp-line-4 span:nth-child(1) {
  animation-name: tt-imp-line-4-letter1;
}

.tt-imp-line-4 span:nth-child(2) {
  animation-name: tt-imp-line-4-letter2;
}

.tt-imp-line-4 span:nth-child(3) {
  animation-name: tt-imp-line-4-letter3;
}

.tt-imp-line-4 span:nth-child(4) {
  animation-name: tt-imp-line-4-letter4;
}

.tt-imp-line-4 span:nth-child(5) {
  animation-name: tt-imp-line-4-letter5;
}

.tt-imp-line-4 span:nth-child(6) {
  animation-name: tt-imp-line-4-letter6;
}

.tt-imp-line-4 span:nth-child(7) {
  animation-name: tt-imp-line-4-letter7;
}

.tt-imp-line-4 span:nth-child(8) {
  animation-name: tt-imp-line-4-letter8;
}

.tt-imp-line-4 span:nth-child(9) {
  animation-name: tt-imp-line-4-letter9;
}

.tt-imp-line-4 span:nth-child(10) {
  animation-name: tt-imp-line-4-letter10;
}

.tt-imp-line-4 span:nth-child(11) {
  animation-name: tt-imp-line-4-letter11;
}

.tt-imp-line-4 span:nth-child(12) {
  animation-name: tt-imp-line-4-letter12;
}

.tt-imp-line-4 span:nth-child(1) {
  animation-name: tt-imp-line-4-letter1;
}

.tt-imp-line-4 span:nth-child(2) {
  animation-name: tt-imp-line-4-letter2;
}

.tt-imp-line-4 span:nth-child(3) {
  animation-name: tt-imp-line-4-letter3;
}

.tt-imp-line-4 span:nth-child(4) {
  animation-name: tt-imp-line-4-letter4;
}

.tt-imp-line-4 span:nth-child(5) {
  animation-name: tt-imp-line-4-letter5;
}

.tt-imp-line-4 span:nth-child(6) {
  animation-name: tt-imp-line-4-letter6;
}

.tt-imp-line-4 span:nth-child(7) {
  animation-name: tt-imp-line-4-letter7;
}

.tt-imp-line-4 span:nth-child(8) {
  animation-name: tt-imp-line-4-letter8;
}

.tt-imp-line-4 span:nth-child(9) {
  animation-name: tt-imp-line-4-letter9;
}

.tt-imp-line-4 span:nth-child(10) {
  animation-name: tt-imp-line-4-letter10;
}

.tt-imp-line-4 span:nth-child(11) {
  animation-name: tt-imp-line-4-letter11;
}

.tt-imp-line-4 span:nth-child(12) {
  animation-name: tt-imp-line-4-letter12;
}

.tt-tvsample-sta {
  height: 100%;
  width: 100%;
  text-transform: uppercase;
  flex-direction: column;
  align-items: flex-start;
  margin-top: -10px;
  font-size: 25vh;
  display: flex;
}

@media (orientation: portrait) {
  .tt-tvsample-sta {
    font-size: 14vh;
  }
}

.tt-tvsample-sta {
  --base-delay-sta: .2s;
}

.tt-tvsample-sta .tt-sta-line {
  animation-duration: var(--sta-duration);
  font-feature-settings: "ss04" 1, "kern" 1;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  position: absolute;
  top: 0;
  left: 50%;
  transform: scale(.1)translateY(0)translateX(-50%);
}

.tt-sta-line {
  --tw-text-opacity: 1;
  color: rgb(97 0 255 / var(--tw-text-opacity) );
  font-variation-settings: "wght" 400, "slnt" 0;
  line-height: 100%;
}

.tt-sta-line span:nth-child(1) {
  font-variation-settings: "wght" 400, "slnt" 45;
}

.tt-sta-line span:nth-child(2) {
  font-variation-settings: "wght" 400, "slnt" 33.75;
}

.tt-sta-line span:nth-child(3) {
  font-variation-settings: "wght" 400, "slnt" 22.5;
}

.tt-sta-line span:nth-child(4) {
  font-variation-settings: "wght" 400, "slnt" 11.25;
}

.tt-sta-line span:nth-child(5) {
  font-variation-settings: "wght" 400, "slnt" -11.25;
}

.tt-sta-line span:nth-child(6) {
  font-variation-settings: "wght" 400, "slnt" -22.5;
}

.tt-sta-line span:nth-child(7) {
  font-variation-settings: "wght" 400, "slnt" -33.75;
}

.tt-sta-line span:nth-child(8) {
  font-variation-settings: "wght" 400, "slnt" -45;
}

.tt-tvsample-sta {
  --sta-scale-0: .1;
  --sta-scale-100: 1;
  --sta-translateY-0: 0vh;
  --sta-translateY-100: 100vh;
  --sta-stagger: 1s;
  --sta-duration: 8s;
}

@media (orientation: portrait) {
  .tt-tvsample-sta {
    --sta-duration: 13s;
  }
}

@keyframes anim-tt-sta-line {
  0% {
    transform: translateX(-50%) scale(var(--sta-scale-0) ) translateY(var(--sta-translateY-0) );
    line-height: 100%;
  }

  100% {
    transform: translateX(-50%) scale(var(--sta-scale-100) ) translateY(var(--sta-translateY-100) );
    line-height: 100%;
  }
}

.tt-sta-line {
  transform-origin: top;
  width: fit-content;
  animation-name: anim-tt-sta-line;
}

.tt-sta-line-1 {
  animation-delay: calc(var(--sta-stagger)  * 0);
}

.tt-sta-line-2 {
  animation-delay: calc(var(--sta-stagger)  * 1);
}

.tt-sta-line-3 {
  animation-delay: calc(var(--sta-stagger)  * 2);
}

.tt-sta-line-4 {
  animation-delay: calc(var(--sta-stagger)  * 3);
}

.tt-sta-line-5 {
  animation-delay: calc(var(--sta-stagger)  * 4);
}

.tt-sta-line-6 {
  animation-delay: calc(var(--sta-stagger)  * 5);
}

.tt-sta-line-7 {
  animation-delay: calc(var(--sta-stagger)  * 6);
}

.tt-sta-line-8 {
  animation-delay: calc(var(--sta-stagger)  * 7);
}

.tt-sta-line-9 {
  animation-delay: calc(var(--sta-stagger)  * 8);
}

@media (orientation: landscape) {
  .tt-sta-line-9 {
    display: none;
  }
}

.tt-sta-line-10 {
  animation-delay: calc(var(--sta-stagger)  * 9);
}

@media (orientation: landscape) {
  .tt-sta-line-10 {
    display: none;
  }
}

.tt-sta-line-11 {
  animation-delay: calc(var(--sta-stagger)  * 10);
}

@media (orientation: landscape) {
  .tt-sta-line-11 {
    display: none;
  }
}

.tt-sta-line-12 {
  animation-delay: calc(var(--sta-stagger)  * 11);
}

@media (orientation: landscape) {
  .tt-sta-line-12 {
    display: none;
  }
}

.tt-sta-line-13 {
  animation-delay: calc(var(--sta-stagger)  * 12);
}

@media (orientation: landscape) {
  .tt-sta-line-13 {
    display: none;
  }
}

.tt-sta-line-14 {
  animation-delay: calc(var(--sta-stagger)  * 13);
  display: none;
}

.tt-sta-line-15 {
  animation-delay: calc(var(--sta-stagger)  * 14);
  display: none;
}

.tt-sta-line-16 {
  animation-delay: calc(var(--sta-stagger)  * 15);
  display: none;
}

.tt-sta-line-17 {
  animation-delay: calc(var(--sta-stagger)  * 16);
  display: none;
}

.tt-tvsample-dom {
  height: 100%;
  width: 100%;
  text-transform: uppercase;
  --tw-text-opacity: 1;
  color: rgb(97 0 255 / var(--tw-text-opacity) );
  --wght: 900;
  --slnt: 0;
  --base-delay: .1s;
  font-variation-settings: "wght" var(--wght), "slnt" var(--slnt);
  flex-direction: column;
  justify-content: center;
  align-items: center;
  line-height: .8;
  display: flex;
  overflow: hidden;
}

.tt-tvsample-dom div span {
  animation-duration: 5s;
  animation-timing-function: ease-out;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}

.tt-dom-line-1 {
  letter-spacing: -.05em;
  font-size: 21vw;
}

@media (min-width: 768px) {
  .tt-dom-line-1 {
    font-size: 20vw;
  }
}

@media (min-width: 1024px) {
  .tt-dom-line-1 {
    font-size: 19vw;
  }
}

.tt-dom-line-2 {
  letter-spacing: -.05em;
  font-size: 12.1vw;
}

@media (min-width: 768px) {
  .tt-dom-line-2 {
    font-size: 11.575vw;
  }
}

@media (min-width: 1024px) {
  .tt-dom-line-2 {
    font-size: 10.975vw;
  }
}

.tt-dom-line-3 {
  letter-spacing: -.05em;
  font-size: 6.15vw;
}

@media (min-width: 768px) {
  .tt-dom-line-3 {
    font-size: 5.875vw;
  }
}

@media (min-width: 1024px) {
  .tt-dom-line-3 {
    font-size: 5.55vw;
  }
}

.tt-dom-line-1 span:nth-child(1) {
  --multiplier: 1;
  animation-name: anim-tt-dom-line-1-1;
  animation-delay: calc(var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-1 span:nth-child(2) {
  --multiplier: 2;
  animation-name: anim-tt-dom-line-1-2;
  animation-delay: calc(var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-1 span:nth-child(3) {
  --multiplier: 3;
  animation-name: anim-tt-dom-line-1-3;
  animation-delay: calc(var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-1 span:nth-child(4) {
  --multiplier: 4;
  animation-name: anim-tt-dom-line-1-4;
  animation-delay: calc(var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-1 span:nth-child(5) {
  --multiplier: 5;
  animation-name: anim-tt-dom-line-1-5;
  animation-delay: calc(var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-1 span:nth-child(6) {
  --multiplier: 6;
  animation-name: anim-tt-dom-line-1-6;
  animation-delay: calc(var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-1 span:nth-child(7) {
  --multiplier: 7;
  animation-name: anim-tt-dom-line-1-7;
  animation-delay: calc(var(--multiplier)  * var(--base-delay) );
}

@keyframes anim-tt-dom-line-1-1 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" 6.4;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" 6.4;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-1-2 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" 12.8;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" 12.8;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-1-3 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" 19.28;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" 19.28;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-1-4 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" 25.7;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" 25.7;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-1-5 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" 32.1;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" 32.1;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-1-6 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" 38.6;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" 38.6;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-1-7 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" 45;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" 45;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

.tt-dom-line-2 span:nth-child(1) {
  --multiplier: 10;
  animation-name: anim-tt-dom-line-2-1;
  animation-delay: calc(1 * var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-2 span:nth-child(2) {
  --multiplier: 9;
  animation-name: anim-tt-dom-line-2-2;
  animation-delay: calc(1 * var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-2 span:nth-child(3) {
  --multiplier: 8;
  animation-name: anim-tt-dom-line-2-3;
  animation-delay: calc(1 * var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-2 span:nth-child(4) {
  --multiplier: 7;
  animation-name: anim-tt-dom-line-2-4;
  animation-delay: calc(1 * var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-2 span:nth-child(5) {
  --multiplier: 6;
  animation-name: anim-tt-dom-line-2-5;
  animation-delay: calc(1 * var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-2 span:nth-child(6) {
  --multiplier: 5;
  animation-name: anim-tt-dom-line-2-6;
  animation-delay: calc(1 * var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-2 span:nth-child(7) {
  --multiplier: 4;
  animation-name: anim-tt-dom-line-2-7;
  animation-delay: calc(1 * var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-2 span:nth-child(9) {
  --multiplier: 3;
  animation-name: anim-tt-dom-line-2-9;
  animation-delay: calc(1 * var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-2 span:nth-child(10) {
  --multiplier: 2;
  animation-name: anim-tt-dom-line-2-10;
  animation-delay: calc(1 * var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-2 span:nth-child(11) {
  --multiplier: 1;
  animation-name: anim-tt-dom-line-2-11;
  animation-delay: calc(1 * var(--multiplier)  * var(--base-delay) );
}

@keyframes anim-tt-dom-line-2-1 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" -45;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" -45;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-2-2 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" -40.5;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" -40.5;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-2-3 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" -36;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" -36;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-2-4 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" -31.5;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" -31.5;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-2-5 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" -27;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" -27;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-2-6 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" -22.5;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" -22.5;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-2-7 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" -18;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" -18;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-2-9 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" -13.5;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" -13.5;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-2-10 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" -9;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" -9;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-2-11 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" -4.5;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" -4.5;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

.tt-dom-line-3 span:nth-child(1) {
  --multiplier: 1;
  animation-name: anim-tt-dom-line-3-1;
  animation-delay: calc(var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-3 span:nth-child(2) {
  --multiplier: 2;
  animation-name: anim-tt-dom-line-3-2;
  animation-delay: calc(var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-3 span:nth-child(3) {
  --multiplier: 3;
  animation-name: anim-tt-dom-line-3-3;
  animation-delay: calc(var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-3 span:nth-child(4) {
  --multiplier: 4;
  animation-name: anim-tt-dom-line-3-4;
  animation-delay: calc(var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-3 span:nth-child(5) {
  --multiplier: 5;
  animation-name: anim-tt-dom-line-3-5;
  animation-delay: calc(var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-3 span:nth-child(6) {
  --multiplier: 6;
  animation-name: anim-tt-dom-line-3-6;
  animation-delay: calc(var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-3 span:nth-child(7) {
  --multiplier: 7;
  animation-name: anim-tt-dom-line-3-7;
  animation-delay: calc(var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-3 span:nth-child(8) {
  --multiplier: 8;
  animation-name: anim-tt-dom-line-3-8;
  animation-delay: calc(var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-3 span:nth-child(9) {
  --multiplier: 9;
  animation-name: anim-tt-dom-line-3-9;
  animation-delay: calc(var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-3 span:nth-child(10) {
  --multiplier: 10;
  animation-name: anim-tt-dom-line-3-10;
  animation-delay: calc(var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-3 span:nth-child(11) {
  --multiplier: 11;
  animation-name: anim-tt-dom-line-3-11;
  animation-delay: calc(var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-3 span:nth-child(12) {
  --multiplier: 12;
  animation-name: anim-tt-dom-line-3-12;
  animation-delay: calc(var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-3 span:nth-child(13) {
  --multiplier: 13;
  animation-name: anim-tt-dom-line-3-13;
  animation-delay: calc(var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-3 span:nth-child(15) {
  --multiplier: 15;
  animation-name: anim-tt-dom-line-3-15;
  animation-delay: calc(var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-3 span:nth-child(16) {
  --multiplier: 16;
  animation-name: anim-tt-dom-line-3-16;
  animation-delay: calc(var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-3 span:nth-child(17) {
  --multiplier: 17;
  animation-name: anim-tt-dom-line-3-17;
  animation-delay: calc(var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-3 span:nth-child(18) {
  --multiplier: 18;
  animation-name: anim-tt-dom-line-3-18;
  animation-delay: calc(var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-3 span:nth-child(19) {
  --multiplier: 19;
  animation-name: anim-tt-dom-line-3-19;
  animation-delay: calc(var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-3 span:nth-child(20) {
  --multiplier: 20;
  animation-name: anim-tt-dom-line-3-20;
  animation-delay: calc(var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-3 span:nth-child(21) {
  --multiplier: 21;
  animation-name: anim-tt-dom-line-3-21;
  animation-delay: calc(var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-3 span:nth-child(22) {
  --multiplier: 22;
  animation-name: anim-tt-dom-line-3-22;
  animation-delay: calc(var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-3 span:nth-child(23) {
  --multiplier: 23;
  animation-name: anim-tt-dom-line-3-23;
  animation-delay: calc(var(--multiplier)  * var(--base-delay) );
}

.tt-dom-line-3 span:nth-child(24) {
  --multiplier: 24;
  animation-name: anim-tt-dom-line-3-24;
  animation-delay: calc(var(--multiplier)  * var(--base-delay) );
}

@keyframes anim-tt-dom-line-3-1 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" 2.045;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" 2.045;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-3-2 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" 4.09;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" 4.09;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-3-3 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" 6.615;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" 6.615;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-3-4 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" 8.18;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" 8.18;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-3-5 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" 10.225;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" 10.225;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-3-6 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" 12.27;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" 12.27;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-3-7 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" 14.315;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" 14.315;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-3-8 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" 16.36;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" 16.36;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-3-9 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" 18.405;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" 18.405;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-3-10 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" 20.45;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" 20.45;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-3-11 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" 22.495;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" 22.495;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-3-12 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" 24.54;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" 24.54;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-3-13 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" 26.585;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" 26.585;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-3-15 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" 28.63;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" 28.63;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-3-16 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" 30.675;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" 30.675;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-3-17 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" 32.72;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" 32.72;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-3-18 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" 34.765;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" 34.765;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-3-19 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" 36.81;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" 36.81;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-3-21 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" 38.885;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" 38.885;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-3-22 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" 40.9;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" 40.9;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-3-23 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" 42.945;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" 42.945;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-dom-line-3-24 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  20% {
    font-variation-settings: "wght" var(--wght), "slnt" 45;
  }

  80% {
    font-variation-settings: "wght" var(--wght), "slnt" 45;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

.tt-tvsample-bou {
  height: 100%;
  width: 100%;
  text-transform: uppercase;
  --tw-text-opacity: 1;
  color: rgb(97 0 255 / var(--tw-text-opacity) );
  --wght: 100;
  --slnt: 0;
  font-variation-settings: "wght" var(--wght), "slnt" var(--slnt);
  flex-direction: column;
  justify-content: center;
  align-items: center;
  line-height: .8;
  display: flex;
  overflow: hidden;
}

.tt-tvsample-bou div {
  letter-spacing: -.05em;
  font-size: 14vw;
}

@media (min-width: 768px) {
  .tt-tvsample-bou div {
    font-size: 14.5vw;
  }
}

@media (min-width: 1024px) {
  .tt-tvsample-bou div {
    font-size: 11vw;
  }
}

.tt-tvsample-bou div {
  animation-duration: 1s;
  animation-timing-function: ease;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}

.tt-bou-line-1 {
  animation-name: anim-tt-bou-line-1;
}

.tt-bou-line-2 {
  animation-name: anim-tt-bou-line-2;
}

.tt-bou-line-3 {
  animation-name: anim-tt-bou-line-3;
}

.tt-bou-line-4 {
  animation-name: anim-tt-bou-line-4;
}

@keyframes anim-tt-bou-line-1 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" -45;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 45;
  }
}

@keyframes anim-tt-bou-line-2 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 45;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" -45;
  }
}

@keyframes anim-tt-bou-line-3 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" -45;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" 45;
  }
}

@keyframes anim-tt-bou-line-4 {
  0% {
    font-variation-settings: "wght" var(--wght), "slnt" 45;
  }

  100% {
    font-variation-settings: "wght" var(--wght), "slnt" -45;
  }
}

.tt-tvsample-r_0 {
  height: 100%;
  width: 100%;
  text-transform: uppercase;
  --tw-text-opacity: 1;
  color: rgb(97 0 255 / var(--tw-text-opacity) );
  flex-direction: column;
  justify-content: center;
  align-items: center;
  line-height: .8;
  display: flex;
  overflow: visible;
}

@media (min-width: 1024px) {
  .tt-tvsample-r_0 {
    margin-top: 50px;
  }
}

.tt-tvsample-r_0 {
  --wght: 100;
  --slnt: 0;
  font-variation-settings: "wght" var(--wght), "slnt" var(--slnt);
}

.tt-tvsample-r_0 div {
  letter-spacing: -.05em;
  font-size: 20vw;
}

@media (min-width: 768px) {
  .tt-tvsample-r_0 div {
    font-size: 18.5vw;
  }
}

@media (min-width: 1024px) {
  .tt-tvsample-r_0 div {
    font-size: 9vw;
  }
}

.tt-tvsample-r_0 div {
  animation-duration: 2s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}

.tt-r_0-line-1 {
  animation-name: anim-tt-r_0-line-1;
}

.tt-r_0-line-2 {
  animation-name: anim-tt-r_0-line-2;
}

.tt-r_0-line-3 {
  animation-name: anim-tt-r_0-line-3;
}

.tt-r_0-line-4 {
  animation-name: anim-tt-r_0-line-4;
}

.tt-r_0-line-5 {
  animation-name: anim-tt-r_0-line-5;
}

.tt-r_0-line-6 {
  animation-name: anim-tt-r_0-line-6;
}

@keyframes anim-tt-r_0-line-1 {
  0% {
    font-variation-settings: "wght" 100, "slnt" -45;
  }

  100% {
    font-variation-settings: "wght" 100, "slnt" 45;
  }
}

@keyframes anim-tt-r_0-line-2 {
  0% {
    font-variation-settings: "wght" 300, "slnt" -45;
  }

  100% {
    font-variation-settings: "wght" 300, "slnt" 45;
  }
}

@keyframes anim-tt-r_0-line-3 {
  0% {
    font-variation-settings: "wght" 400, "slnt" -45;
  }

  100% {
    font-variation-settings: "wght" 400, "slnt" 45;
  }
}

@keyframes anim-tt-r_0-line-4 {
  0% {
    font-variation-settings: "wght" 500, "slnt" -45;
  }

  100% {
    font-variation-settings: "wght" 500, "slnt" 45;
  }
}

@keyframes anim-tt-r_0-line-5 {
  0% {
    font-variation-settings: "wght" 700, "slnt" -45;
  }

  100% {
    font-variation-settings: "wght" 700, "slnt" 45;
  }
}

@keyframes anim-tt-r_0-line-6 {
  0% {
    font-variation-settings: "wght" 900, "slnt" -45;
  }

  100% {
    font-variation-settings: "wght" 900, "slnt" 45;
  }
}

.tt-tvsample-ene {
  height: 100%;
  width: 100%;
  text-transform: uppercase;
  --tw-text-opacity: 1;
  color: rgb(97 0 255 / var(--tw-text-opacity) );
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-size: 21vw;
  line-height: 1.1;
  display: flex;
  overflow: visible;
}

@media (min-width: 768px) {
  .tt-tvsample-ene {
    font-size: 20vw;
  }
}

@media (min-width: 1024px) {
  .tt-tvsample-ene {
    padding-top: 90px;
    font-size: 5.5vw;
  }
}

.tt-tvsample-ene {
  --ltr-spc: -.05em;
  --ltr-spc-wide: 1em;
  --wght: 400;
  --slnt: 0;
  --base-delay: .1s;
  font-variation-settings: "wght" var(--wght), "slnt" var(--slnt);
  letter-spacing: var(--ltr-spc);
}

.tt-tvsample-ene div span {
  animation-duration: 3s;
  animation-timing-function: cubic-bezier(.6, .04, .98, .335);
  animation-iteration-count: infinite;
  animation-direction: alternate;
}

.tt-ene-9lt span:nth-child(2n+1) {
  animation-name: anim-tt-ene-9lt-1;
}

.tt-ene-9lt span:nth-child(2n) {
  animation-name: anim-tt-ene-9lt-2;
}

@keyframes anim-tt-ene-9lt-1 {
  0% {
    letter-spacing: var(--ltr-spc);
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  10% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  25% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" 45;
  }

  40% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" -45;
  }

  65% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" 45;
  }

  80% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" -45;
  }

  90% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  100% {
    letter-spacing: var(--ltr-spc);
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-ene-9lt-2 {
  0% {
    letter-spacing: var(--ltr-spc);
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  10% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  30% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" -45;
  }

  70% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" 45;
  }

  90% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  100% {
    letter-spacing: var(--ltr-spc);
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

.tt-ene-6lt span:nth-child(2n) {
  animation-name: anim-tt-ene-6lt-1;
}

.tt-ene-6lt span:nth-child(2n+1) {
  animation-name: anim-tt-ene-6lt-2;
}

@keyframes anim-tt-ene-6lt-1 {
  0% {
    letter-spacing: var(--ltr-spc);
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  10% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  25% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" 45;
  }

  40% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" -45;
  }

  65% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" 45;
  }

  80% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" -45;
  }

  90% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  100% {
    letter-spacing: var(--ltr-spc);
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-ene-6lt-2 {
  0% {
    letter-spacing: var(--ltr-spc);
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  10% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  30% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" -45;
  }

  70% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" 45;
  }

  90% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  100% {
    letter-spacing: var(--ltr-spc);
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

.tt-ene-7lt span:nth-child(2n) {
  animation-name: anim-tt-ene-7lt-1;
}

.tt-ene-7lt span:nth-child(2n+1) {
  animation-name: anim-tt-ene-7lt-2;
}

@keyframes anim-tt-ene-7lt-1 {
  0% {
    letter-spacing: var(--ltr-spc);
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  10% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  25% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" 45;
  }

  40% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" -45;
  }

  65% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" 45;
  }

  80% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" -45;
  }

  90% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  100% {
    letter-spacing: var(--ltr-spc);
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-ene-7lt-2 {
  0% {
    letter-spacing: var(--ltr-spc);
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  10% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  30% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" -45;
  }

  70% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" 45;
  }

  90% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  100% {
    letter-spacing: var(--ltr-spc);
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

.tt-ene-10lt span:nth-child(2n+1) {
  animation-name: anim-tt-ene-10lt-1;
}

.tt-ene-10lt span:nth-child(2n) {
  animation-name: anim-tt-ene-10lt-2;
}

@keyframes anim-tt-ene-10lt-1 {
  0% {
    letter-spacing: var(--ltr-spc);
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  10% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  25% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" 45;
  }

  40% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" -45;
  }

  65% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" 45;
  }

  80% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" -45;
  }

  90% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  100% {
    letter-spacing: var(--ltr-spc);
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

@keyframes anim-tt-ene-10lt-2 {
  0% {
    letter-spacing: var(--ltr-spc);
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  10% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  30% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" -45;
  }

  70% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" 45;
  }

  90% {
    letter-spacing: var(--ltr-spc-wide);
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }

  100% {
    letter-spacing: var(--ltr-spc);
    font-variation-settings: "wght" var(--wght), "slnt" 0;
  }
}

.tt:not(.autopilot-active) .tt__tv * {
  animation-play-state: paused;
}

*, :before, :after {
  box-sizing: border-box;
  border: 0 solid ;
}

:before, :after {
  --tw-content: "";
}

html {
  -webkit-text-size-adjust: 100%;
  tab-size: 4;
  font-family: GT Planar, Comic Sans MS, cursive;
  line-height: 1.5;
}

body {
  line-height: inherit;
  margin: 0;
}

hr {
  height: 0;
  color: inherit;
  border-top-width: 1px;
}

abbr:where([title]) {
  text-decoration: underline dotted;
}

h1, h2, h3, h4, h5, h6 {
  font-size: inherit;
  font-weight: inherit;
}

a {
  color: inherit;
  text-decoration: inherit;
}

b, strong {
  font-weight: bolder;
}

code, kbd, samp, pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace;
  font-size: 1em;
}

small {
  font-size: 80%;
}

sub, sup {
  vertical-align: baseline;
  font-size: 75%;
  line-height: 0;
  position: relative;
}

sub {
  bottom: -.25em;
}

sup {
  top: -.5em;
}

table {
  text-indent: 0;
  border-color: inherit;
  border-collapse: collapse;
}

button, input, optgroup, select, textarea {
  font-family: inherit;
  font-size: 100%;
  line-height: inherit;
  color: inherit;
  margin: 0;
  padding: 0;
}

button, select {
  text-transform: none;
}

button, [type="button"], [type="reset"], [type="submit"] {
  -webkit-appearance: button;
  background-color: #0000;
  background-image: none;
}

:-moz-focusring {
  outline: auto ;
}

:-moz-ui-invalid {
  box-shadow: none;
}

progress {
  vertical-align: baseline;
}

::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
  height: auto;
}

[type="search"] {
  -webkit-appearance: textfield;
  outline-offset: -2px;
}

::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit;
}

summary {
  display: list-item;
}

blockquote, dl, dd, h1, h2, h3, h4, h5, h6, hr, figure, p, pre {
  margin: 0;
}

fieldset {
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
}

ol, ul, menu {
  margin: 0;
  padding: 0;
  list-style: none;
}

textarea {
  resize: vertical;
}

input::placeholder, textarea::placeholder {
  opacity: 1;
  color: #9ca3af;
}

button, [role="button"] {
  cursor: pointer;
}

:disabled {
  cursor: default;
}

img, svg, video, canvas, audio, iframe, embed, object {
  vertical-align: middle;
  display: block;
}

img, video {
  max-width: 100%;
  height: auto;
}

[hidden] {
  display: none;
}

*, :before, :after {
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x: ;
  --tw-pan-y: ;
  --tw-pinch-zoom: ;
  --tw-scroll-snap-strictness: proximity;
  --tw-ordinal: ;
  --tw-slashed-zero: ;
  --tw-numeric-figure: ;
  --tw-numeric-spacing: ;
  --tw-numeric-fraction: ;
  --tw-ring-inset: ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: #3b82f680;
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur: ;
  --tw-brightness: ;
  --tw-contrast: ;
  --tw-grayscale: ;
  --tw-hue-rotate: ;
  --tw-invert: ;
  --tw-saturate: ;
  --tw-sepia: ;
  --tw-drop-shadow: ;
  --tw-backdrop-blur: ;
  --tw-backdrop-brightness: ;
  --tw-backdrop-contrast: ;
  --tw-backdrop-grayscale: ;
  --tw-backdrop-hue-rotate: ;
  --tw-backdrop-invert: ;
  --tw-backdrop-opacity: ;
  --tw-backdrop-saturate: ;
  --tw-backdrop-sepia: ;
}

.intro {
  height: var(--visible-viewport-height);
  -webkit-user-select: none;
  user-select: none;
  background: #000;
  overflow: hidden;
}

.intro__canvas {
  width: 100%;
  height: 100%;
  background-color: #000;
  position: absolute;
  top: 0;
  left: 0;
}

.intro__text-content {
  width: 100%;
  height: 100%;
  perspective: var(--global-perspective);
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
}

.intro__plane {
  width: 100%;
  height: 100%;
  text-transform: uppercase;
  text-align: center;
  transform-style: preserve-3d;
  will-change: transform;
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  top: 0;
  left: 0;
}

.intro__plane--first {
  opacity: 0;
  transform: translateZ(-10000px);
}

.intro__plane--final {
  transform: translateZ(250px);
}

.intro--enter .intro__plane--first {
  opacity: 1;
  transition: transform 2.5s ease-out, opacity .75s ease-out;
  transform: translateZ(250px);
}

.intro__plane:nth-child(1) {
  transition-delay: 0s;
}

.intro__plane:nth-child(2) {
  transition-delay: 1.25s;
}

.intro__plane:nth-child(3) {
  transition-delay: 2.5s;
}

.intro--enter-final .intro__plane--final {
  transition: transform 3.5s cubic-bezier(0, .89, .6, 1);
  transform: translateZ(0);
}

.intro__plane > div {
  letter-spacing: -.1em;
  color: #fff;
  margin-left: auto;
  margin-right: auto;
  font-size: 14.75vw;
  line-height: .9em;
  display: block;
  position: absolute;
  left: 0;
  right: 0;
}

@media (min-width: 768px) {
  .intro__plane > div {
    font-size: 10.15vw;
    line-height: 90%;
  }
}

.intro__plane:nth-child(1) div {
  --tw-text-opacity: 1;
  color: rgb(252 255 118 / var(--tw-text-opacity) );
  top: 0;
}

.intro__plane:nth-child(2) div {
  --tw-text-opacity: 1;
  color: rgb(252 255 118 / var(--tw-text-opacity) );
  bottom: 0;
}

.intro__plane:nth-child(3) div {
  --tw-text-opacity: 1;
  color: rgb(252 255 118 / var(--tw-text-opacity) );
  top: 0;
}

.intro__title-line {
  display: block;
}

.intro__title-space {
  width: 1em;
  display: inline-block;
}

.intro__scroll-down {
  letter-spacing: -.01em;
  font-variation-settings: "wght" 700, "slnt" 0;
  color: #adff2f;
  text-align: center;
  text-transform: uppercase;
  opacity: 0;
  margin-left: auto;
  margin-right: auto;
  font-size: 1.5rem;
  line-height: .9em;
  transition: all 2s ease-out;
  display: block;
  position: absolute;
  bottom: 1.5rem;
  left: 0;
  right: 0;
  transform: translateY(-150%);
}

.intro__scroll-down--visible {
  opacity: 1;
  transform: translateY(0);
}

.axes-overview {
  --visible-viewport-height: 100vh;
  --wght: 450;
  --slnt: 0;
  --pcx: 50%;
  --pcy: 50%;
  --slnt-text: "0°";
  --wght-text: "0";
  --slnt-color: "green";
  --wght-color: "green";
}

.axes-overview__type {
  font-variation-settings: "wght" var(--wght), "slnt" var(--slnt);
}

.axes-overview__puck {
  font-variation-settings: "wght" 300, "slnt" 0;
}

.axes-overview__puck--top {
  transform: translateX(var(--pcx) );
}

.axes-overview__puck--left {
  writing-mode: vertical-rl;
  text-orientation: sideways;
  transform: translateY(var(--pcy) );
}

.axes-overview__puck-inner {
  will-change: transform;
  transform: translateY(calc(var(--pcy)  * -1) ) rotate(180deg);
}

.axes-overview__puck-inner--top {
  transform: translateX(calc(var(--pcx)  * -1) );
}

.axes-overview__puck-inner--top:after {
  content: var(--slnt-text);
  color: var(--slnt-color);
}

.axes-overview__puck-inner--left:after {
  content: var(--wght-text);
  color: var(--wght-color);
}

.family-style-overview {
  --slnt: 0;
  --minus-slnt: 0;
  --color: lightgreen;
}

.family-style-overview__indicator > span {
  height: 100%;
  width: 1px;
  will-change: background;
  display: block;
}

.family-style-overview__row {
  align-items: center;
  gap: 4vw;
  display: flex;
}

@media (min-width: 768px) {
  .family-style-overview__row {
    justify-content: center;
  }
}

.family-style-overview__row {
  color: var(--color);
  pointer-events: none;
}

.family-style-overview__row:nth-child(1) .family-style-overview__column:first-child {
  font-variation-settings: "slnt" var(--minus-slnt), "wght" 100;
}

.family-style-overview__row:nth-child(1) .family-style-overview__column:last-child {
  font-variation-settings: "slnt" var(--slnt), "wght" 100;
}

.family-style-overview__row:nth-child(2) .family-style-overview__column:first-child {
  font-variation-settings: "slnt" var(--minus-slnt), "wght" 250;
}

.family-style-overview__row:nth-child(2) .family-style-overview__column:last-child {
  font-variation-settings: "slnt" var(--slnt), "wght" 250;
}

.family-style-overview__row:nth-child(3) .family-style-overview__column:first-child {
  font-variation-settings: "slnt" var(--minus-slnt), "wght" 400;
}

.family-style-overview__row:nth-child(3) .family-style-overview__column:last-child {
  font-variation-settings: "slnt" var(--slnt), "wght" 400;
}

.family-style-overview__row:nth-child(4) .family-style-overview__column:first-child {
  font-variation-settings: "slnt" var(--minus-slnt), "wght" 550;
}

.family-style-overview__row:nth-child(4) .family-style-overview__column:last-child {
  font-variation-settings: "slnt" var(--slnt), "wght" 550;
}

.family-style-overview__row:nth-child(5) .family-style-overview__column:first-child {
  font-variation-settings: "slnt" var(--minus-slnt), "wght" 750;
}

.family-style-overview__row:nth-child(5) .family-style-overview__column:last-child {
  font-variation-settings: "slnt" var(--slnt), "wght" 750;
}

.family-style-overview__row:nth-child(6) .family-style-overview__column:first-child {
  font-variation-settings: "slnt" var(--minus-slnt), "wght" 900;
}

.family-style-overview__row:nth-child(6) .family-style-overview__column:last-child {
  font-variation-settings: "slnt" var(--slnt), "wght" 900;
}

.family-style-overview__column {
  width: 100%;
  text-align: center;
  will-change: font-variation-settings;
  pointer-events: none;
  display: inline-block;
  transform: translateZ(0);
}

.family-style-overview__column:first-child {
  display: none;
}

@media (min-width: 768px) {
  .family-style-overview__column:first-child {
    display: block;
  }
}

*, :before, :after {
  box-sizing: border-box;
  border: 0 solid ;
}

:before, :after {
  --tw-content: "";
}

html {
  -webkit-text-size-adjust: 100%;
  tab-size: 4;
  font-family: GT Planar, Comic Sans MS, cursive;
  line-height: 1.5;
}

body {
  line-height: inherit;
  margin: 0;
}

hr {
  height: 0;
  color: inherit;
  border-top-width: 1px;
}

abbr:where([title]) {
  text-decoration: underline dotted;
}

h1, h2, h3, h4, h5, h6 {
  font-size: inherit;
  font-weight: inherit;
}

a {
  color: inherit;
  text-decoration: inherit;
}

b, strong {
  font-weight: bolder;
}

code, kbd, samp, pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace;
  font-size: 1em;
}

small {
  font-size: 80%;
}

sub, sup {
  vertical-align: baseline;
  font-size: 75%;
  line-height: 0;
  position: relative;
}

sub {
  bottom: -.25em;
}

sup {
  top: -.5em;
}

table {
  text-indent: 0;
  border-color: inherit;
  border-collapse: collapse;
}

button, input, optgroup, select, textarea {
  font-family: inherit;
  font-size: 100%;
  line-height: inherit;
  color: inherit;
  margin: 0;
  padding: 0;
}

button, select {
  text-transform: none;
}

button, [type="button"], [type="reset"], [type="submit"] {
  -webkit-appearance: button;
  background-color: #0000;
  background-image: none;
}

:-moz-focusring {
  outline: auto ;
}

:-moz-ui-invalid {
  box-shadow: none;
}

progress {
  vertical-align: baseline;
}

::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
  height: auto;
}

[type="search"] {
  -webkit-appearance: textfield;
  outline-offset: -2px;
}

::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit;
}

summary {
  display: list-item;
}

blockquote, dl, dd, h1, h2, h3, h4, h5, h6, hr, figure, p, pre {
  margin: 0;
}

fieldset {
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
}

ol, ul, menu {
  margin: 0;
  padding: 0;
  list-style: none;
}

textarea {
  resize: vertical;
}

input::placeholder, textarea::placeholder {
  opacity: 1;
  color: #9ca3af;
}

button, [role="button"] {
  cursor: pointer;
}

:disabled {
  cursor: default;
}

img, svg, video, canvas, audio, iframe, embed, object {
  vertical-align: middle;
  display: block;
}

img, video {
  max-width: 100%;
  height: auto;
}

[hidden] {
  display: none;
}

*, :before, :after {
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x: ;
  --tw-pan-y: ;
  --tw-pinch-zoom: ;
  --tw-scroll-snap-strictness: proximity;
  --tw-ordinal: ;
  --tw-slashed-zero: ;
  --tw-numeric-figure: ;
  --tw-numeric-spacing: ;
  --tw-numeric-fraction: ;
  --tw-ring-inset: ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: #3b82f680;
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur: ;
  --tw-brightness: ;
  --tw-contrast: ;
  --tw-grayscale: ;
  --tw-hue-rotate: ;
  --tw-invert: ;
  --tw-saturate: ;
  --tw-sepia: ;
  --tw-drop-shadow: ;
  --tw-backdrop-blur: ;
  --tw-backdrop-brightness: ;
  --tw-backdrop-contrast: ;
  --tw-backdrop-grayscale: ;
  --tw-backdrop-hue-rotate: ;
  --tw-backdrop-invert: ;
  --tw-backdrop-opacity: ;
  --tw-backdrop-saturate: ;
  --tw-backdrop-sepia: ;
}

.container {
  width: 100%;
}

@media (min-width: 640px) {
  .container {
    max-width: 640px;
  }
}

@media (min-width: 768px) {
  .container {
    max-width: 768px;
  }
}

@media (min-width: 1024px) {
  .container {
    max-width: 1024px;
  }
}

@media (min-width: 1280px) {
  .container {
    max-width: 1280px;
  }
}

@media (min-width: 1536px) {
  .container {
    max-width: 1536px;
  }
}

.pointer-events-none {
  pointer-events: none;
}

.visible {
  visibility: visible;
}

.invisible {
  visibility: hidden;
}

.static {
  position: static;
}

.fixed {
  position: fixed;
}

.absolute {
  position: absolute;
}

.relative {
  position: relative;
}

.sticky {
  position: sticky;
}

.top-0 {
  top: 0;
}

.left-\[50\%\] {
  left: 50%;
}

.top-\[50\%\] {
  top: 50%;
}

.left-0 {
  left: 0;
}

.right-0 {
  right: 0;
}

.bottom-0 {
  bottom: 0;
}

.bottom-5 {
  bottom: 15px;
}

.left-5 {
  left: 15px;
}

.right-5 {
  right: 15px;
}

.left-\[50px\] {
  left: 50px;
}

.right-\[50px\] {
  right: 50px;
}

.top-\[50px\] {
  top: 50px;
}

.bottom-\[50px\] {
  bottom: 50px;
}

.z-30 {
  z-index: 30;
}

.z-20 {
  z-index: 20;
}

.z-0 {
  z-index: 0;
}

.z-50 {
  z-index: 50;
}

.z-10 {
  z-index: 10;
}

.order-3 {
  order: 3;
}

.order-2 {
  order: 2;
}

.col-span-12 {
  grid-column: span 12 / span 12;
}

.col-span-8 {
  grid-column: span 8 / span 8;
}

.m-2 {
  margin: 2px;
}

.m-auto {
  margin: auto;
}

.m-3 {
  margin: 5px;
}

.m-1 {
  margin: 1px;
}

.my-2 {
  margin-top: 2px;
  margin-bottom: 2px;
}

.mx-auto {
  margin-left: auto;
  margin-right: auto;
}

.ml-6 {
  margin-left: 25px;
}

.mr-6 {
  margin-right: 25px;
}

.mb-\[9px\] {
  margin-bottom: 9px;
}

.mb-8 {
  margin-bottom: 100px;
}

.mb-4 {
  margin-bottom: 10px;
}

.mb-7 {
  margin-bottom: 50px;
}

.mt-\[15\%\] {
  margin-top: 15%;
}

.ml-auto {
  margin-left: auto;
}

.mr-auto {
  margin-right: auto;
}

.mb-\[0\.5rem\] {
  margin-bottom: .5rem;
}

.mt-3 {
  margin-top: 5px;
}

.mt-auto {
  margin-top: auto;
}

.-ml-\[50\%\] {
  margin-left: -50%;
}

.mb-5 {
  margin-bottom: 15px;
}

.mr-4 {
  margin-right: 10px;
}

.mb-\[75px\] {
  margin-bottom: 75px;
}

.mb-2 {
  margin-bottom: 2px;
}

.mb-\[125px\] {
  margin-bottom: 125px;
}

.mt-\[75px\] {
  margin-top: 75px;
}

.mb-3 {
  margin-bottom: 5px;
}

.mt-4 {
  margin-top: 10px;
}

.mt-5 {
  margin-top: 15px;
}

.-ml-\[6px\] {
  margin-left: -6px;
}

.mb-0 {
  margin-bottom: 0;
}

.mt-\[8px\] {
  margin-top: 8px;
}

.ml-\[12px\] {
  margin-left: 12px;
}

.mt-\[3px\] {
  margin-top: 3px;
}

.ml-\[3px\] {
  margin-left: 3px;
}

.mt-0 {
  margin-top: 0;
}

.ml-0 {
  margin-left: 0;
}

.ml-4 {
  margin-left: 10px;
}

.mb-\[102px\] {
  margin-bottom: 102px;
}

.mt-2 {
  margin-top: 2px;
}

.mr-2 {
  margin-right: 2px;
}

.ml-2 {
  margin-left: 2px;
}

.mb-\[139px\] {
  margin-bottom: 139px;
}

.ml-\[6px\] {
  margin-left: 6px;
}

.box-border {
  box-sizing: border-box;
}

.block {
  display: block;
}

.inline-block {
  display: inline-block;
}

.inline {
  display: inline;
}

.flex {
  display: flex;
}

.table {
  display: table;
}

.grid {
  display: grid;
}

.hidden {
  display: none;
}

.h-\[100\%\] {
  height: 100%;
}

.h-\[7\.25em\] {
  height: 7.25em;
}

.h-\[23px\] {
  height: 23px;
}

.h-\[1rem\] {
  height: 1rem;
}

.h-full {
  height: 100%;
}

.h-0 {
  height: 0;
}

.h-\[70px\] {
  height: 70px;
}

.h-\[7px\] {
  height: 7px;
}

.h-\[11px\] {
  height: 11px;
}

.h-4 {
  height: 10px;
}

.h-\[37px\] {
  height: 37px;
}

.h-\[16px\] {
  height: 16px;
}

.h-\[6px\] {
  height: 6px;
}

.h-\[128px\] {
  height: 128px;
}

.h-\[32px\] {
  height: 32px;
}

.h-\[13px\] {
  height: 13px;
}

.h-min {
  height: min-content;
}

.h-1\/2 {
  height: 50%;
}

.h-\[2px\] {
  height: 2px;
}

.h-1 {
  height: 1px;
}

.w-full {
  width: 100%;
}

.w-\[7\.25em\] {
  width: 7.25em;
}

.w-\[8px\] {
  width: 8px;
}

.w-\[4em\] {
  width: 4em;
}

.w-\[7em\] {
  width: 7em;
}

.w-\[1\.25em\] {
  width: 1.25em;
}

.w-\[10px\] {
  width: 10px;
}

.w-fit {
  width: fit-content;
}

.w-\[23px\] {
  width: 23px;
}

.w-\[300px\] {
  width: 300px;
}

.w-\[50\%\] {
  width: 50%;
}

.w-\[200\%\] {
  width: 200%;
}

.w-1\/2 {
  width: 50%;
}

.w-\[26px\] {
  width: 26px;
}

.w-0 {
  width: 0;
}

.w-\[45px\] {
  width: 45px;
}

.w-\[28px\] {
  width: 28px;
}

.w-3\/4 {
  width: 75%;
}

.w-5 {
  width: 15px;
}

.w-\[16px\] {
  width: 16px;
}

.w-\[6px\] {
  width: 6px;
}

.w-\[6em\] {
  width: 6em;
}

.w-\[120px\] {
  width: 120px;
}

.w-\[30px\] {
  width: 30px;
}

.w-\[130px\] {
  width: 130px;
}

.w-\[45\%\] {
  width: 45%;
}

.w-\[32px\] {
  width: 32px;
}

.w-\[30vw\] {
  width: 30vw;
}

.w-\[2px\] {
  width: 2px;
}

.min-w-\[40\%\] {
  min-width: 40%;
}

.max-w-\[66\%\] {
  max-width: 66%;
}

.max-w-\[50\%\] {
  max-width: 50%;
}

.flex-grow-0 {
  flex-grow: 0;
}

.flex-grow, .grow {
  flex-grow: 1;
}

.-translate-y-\[50\%\] {
  --tw-translate-y: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y) ) rotate(var(--tw-rotate) ) skewX(var(--tw-skew-x) ) skewY(var(--tw-skew-y) ) scaleX(var(--tw-scale-x) ) scaleY(var(--tw-scale-y) );
}

.translate-y-\[0\%\] {
  --tw-translate-y: 0%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y) ) rotate(var(--tw-rotate) ) skewX(var(--tw-skew-x) ) skewY(var(--tw-skew-y) ) scaleX(var(--tw-scale-x) ) scaleY(var(--tw-scale-y) );
}

.-translate-y-\[115\%\] {
  --tw-translate-y: -115%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y) ) rotate(var(--tw-rotate) ) skewX(var(--tw-skew-x) ) skewY(var(--tw-skew-y) ) scaleX(var(--tw-scale-x) ) scaleY(var(--tw-scale-y) );
}

.-rotate-90 {
  --tw-rotate: -90deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y) ) rotate(var(--tw-rotate) ) skewX(var(--tw-skew-x) ) skewY(var(--tw-skew-y) ) scaleX(var(--tw-scale-x) ) scaleY(var(--tw-scale-y) );
}

.rotate-180 {
  --tw-rotate: 180deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y) ) rotate(var(--tw-rotate) ) skewX(var(--tw-skew-x) ) skewY(var(--tw-skew-y) ) scaleX(var(--tw-scale-x) ) scaleY(var(--tw-scale-y) );
}

.transform {
  transform: translate(var(--tw-translate-x), var(--tw-translate-y) ) rotate(var(--tw-rotate) ) skewX(var(--tw-skew-x) ) skewY(var(--tw-skew-y) ) scaleX(var(--tw-scale-x) ) scaleY(var(--tw-scale-y) );
}

.cursor-pointer {
  cursor: pointer;
}

.select-none {
  -webkit-user-select: none;
  user-select: none;
}

.resize {
  resize: both;
}

.grid-cols-8 {
  grid-template-columns: repeat(8, minmax(0, 1fr));
}

.flex-row {
  flex-direction: row;
}

.flex-col {
  flex-direction: column;
}

.flex-wrap {
  flex-wrap: wrap;
}

.items-end {
  align-items: flex-end;
}

.items-center {
  align-items: center;
}

.items-stretch {
  align-items: stretch;
}

.justify-end {
  justify-content: flex-end;
}

.justify-center {
  justify-content: center;
}

.justify-between {
  justify-content: space-between;
}

.gap-5 {
  gap: 15px;
}

.self-end {
  align-self: flex-end;
}

.self-center {
  align-self: center;
}

.overflow-hidden {
  overflow: hidden;
}

.overflow-x-hidden {
  overflow-x: hidden;
}

.rounded-full {
  border-radius: 9999px;
}

.border-2 {
  border-width: 2px;
}

.border {
  border-width: 1px;
}

.border-y-2 {
  border-top-width: 2px;
  border-bottom-width: 2px;
}

.border-l {
  border-left-width: 1px;
}

.border-t {
  border-top-width: 1px;
}

.border-r {
  border-right-width: 1px;
}

.border-b-0 {
  border-bottom-width: 0;
}

.border-t-\[20px\] {
  border-top-width: 20px;
}

.border-t-\[18px\] {
  border-top-width: 18px;
}

.border-yellow {
  --tw-border-opacity: 1;
  border-color: rgb(252 255 118 / var(--tw-border-opacity) );
}

.border-red {
  --tw-border-opacity: 1;
  border-color: rgb(255 0 61 / var(--tw-border-opacity) );
}

.border-gray {
  --tw-border-opacity: 1;
  border-color: rgb(148 148 148 / var(--tw-border-opacity) );
}

.border-black {
  --tw-border-opacity: 1;
  border-color: rgb(0 0 0 / var(--tw-border-opacity) );
}

.border-green {
  --tw-border-opacity: 1;
  border-color: rgb(0 255 133 / var(--tw-border-opacity) );
}

.border-white {
  --tw-border-opacity: 1;
  border-color: rgb(255 255 255 / var(--tw-border-opacity) );
}

.border-green-md {
  --tw-border-opacity: 1;
  border-color: rgb(0 92 0 / var(--tw-border-opacity) );
}

.border-gray-dk {
  --tw-border-opacity: 1;
  border-color: rgb(96 96 96 / var(--tw-border-opacity) );
}

.border-blue {
  --tw-border-opacity: 1;
  border-color: rgb(97 0 255 / var(--tw-border-opacity) );
}

.bg-black {
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity) );
}

.bg-red-dk {
  --tw-bg-opacity: 1;
  background-color: rgb(40 0 0 / var(--tw-bg-opacity) );
}

.bg-green {
  --tw-bg-opacity: 1;
  background-color: rgb(0 255 133 / var(--tw-bg-opacity) );
}

.bg-green-dk {
  --tw-bg-opacity: 1;
  background-color: rgb(0 44 0 / var(--tw-bg-opacity) );
}

.bg-green-md {
  --tw-bg-opacity: 1;
  background-color: rgb(0 92 0 / var(--tw-bg-opacity) );
}

.bg-blue-md {
  --tw-bg-opacity: 1;
  background-color: rgb(41 0 108 / var(--tw-bg-opacity) );
}

.bg-blue-dk {
  --tw-bg-opacity: 1;
  background-color: rgb(26 0 20 / var(--tw-bg-opacity) );
}

.bg-blue {
  --tw-bg-opacity: 1;
  background-color: rgb(97 0 255 / var(--tw-bg-opacity) );
}

.bg-red {
  --tw-bg-opacity: 1;
  background-color: rgb(255 0 61 / var(--tw-bg-opacity) );
}

.bg-gray-dk {
  --tw-bg-opacity: 1;
  background-color: rgb(96 96 96 / var(--tw-bg-opacity) );
}

.bg-purple {
  --tw-bg-opacity: 1;
  background-color: rgb(112 0 255 / var(--tw-bg-opacity) );
}

.bg-opacity-80 {
  --tw-bg-opacity: .8;
}

.bg-opacity-75 {
  --tw-bg-opacity: .75;
}

.bg-opacity-\[80\%\] {
  --tw-bg-opacity: 80%;
}

.p-4 {
  padding: 10px;
}

.p-2 {
  padding: 2px;
}

.p-6 {
  padding: 25px;
}

.p-1 {
  padding: 1px;
}

.p-3 {
  padding: 5px;
}

.p-\[0\.2em\] {
  padding: .2em;
}

.p-0 {
  padding: 0;
}

.p-\[10px\] {
  padding: 10px;
}

.p-5 {
  padding: 15px;
}

.py-5 {
  padding-top: 15px;
  padding-bottom: 15px;
}

.px-4 {
  padding-left: 10px;
  padding-right: 10px;
}

.px-5 {
  padding-left: 15px;
  padding-right: 15px;
}

.py-4 {
  padding-top: 10px;
  padding-bottom: 10px;
}

.py-3 {
  padding-top: 5px;
  padding-bottom: 5px;
}

.pt-3 {
  padding-top: 5px;
}

.pl-7 {
  padding-left: 50px;
}

.pr-7 {
  padding-right: 50px;
}

.pt-9 {
  padding-top: 150px;
}

.pb-8 {
  padding-bottom: 100px;
}

.pb-5 {
  padding-bottom: 15px;
}

.pb-2 {
  padding-bottom: 2px;
}

.pt-7 {
  padding-top: 50px;
}

.pb-7 {
  padding-bottom: 50px;
}

.pb-4 {
  padding-bottom: 10px;
}

.pt-8 {
  padding-top: 100px;
}

.pb-6 {
  padding-bottom: 25px;
}

.pt-4 {
  padding-top: 10px;
}

.pr-4 {
  padding-right: 10px;
}

.pr-3 {
  padding-right: 5px;
}

.pb-0 {
  padding-bottom: 0;
}

.pb-\[5px\] {
  padding-bottom: 5px;
}

.pt-2 {
  padding-top: 2px;
}

.pl-3 {
  padding-left: 5px;
}

.pb-3 {
  padding-bottom: 5px;
}

.pt-\[4px\] {
  padding-top: 4px;
}

.pt-5 {
  padding-top: 15px;
}

.pt-0 {
  padding-top: 0;
}

.pl-5 {
  padding-left: 15px;
}

.pl-\[45px\] {
  padding-left: 45px;
}

.pt-\[70px\] {
  padding-top: 70px;
}

.pb-\[135px\] {
  padding-bottom: 135px;
}

.text-left {
  text-align: left;
}

.text-center {
  text-align: center;
}

.text-right {
  text-align: right;
}

.text-sm {
  font-size: 14px;
  line-height: 16px;
}

.text-lg {
  font-size: 24px;
  line-height: 28px;
}

.text-rg {
  letter-spacing: .015em;
  font-size: 17px;
  line-height: 21px;
}

.text-xs {
  font-size: 11px;
  line-height: 12px;
}

.text-4xl {
  font-size: 10.15vw;
  line-height: 90%;
}

.text-8xl {
  font-size: 23vw;
  line-height: 80%;
}

.text-5xl {
  font-size: 13vw;
  line-height: 80%;
}

.text-xl {
  font-size: 32px;
  line-height: 38px;
}

.text-\[19vw\] {
  font-size: 19vw;
}

.text-\[30vw\] {
  font-size: 30vw;
}

.text-\[8\.5vw\] {
  font-size: 8.5vw;
}

.text-\[23vw\] {
  font-size: 23vw;
}

.text-\[5vw\] {
  font-size: 5vw;
}

.text-\[28vw\] {
  font-size: 28vw;
}

.text-\[25px\] {
  font-size: 25px;
}

.text-\[50px\] {
  font-size: 50px;
}

.uppercase {
  text-transform: uppercase;
}

.italic {
  font-style: italic;
}

.tabular-nums {
  --tw-numeric-spacing: tabular-nums;
  font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction);
}

.leading-none {
  line-height: 1;
}

.leading-\[90\%\] {
  line-height: 90%;
}

.leading-\[80\%\] {
  line-height: 80%;
}

.leading-\[0\.9\] {
  line-height: .9;
}

.leading-\[95\%\] {
  line-height: 95%;
}

.leading-\[110\%\] {
  line-height: 110%;
}

.tracking-tighter {
  letter-spacing: -.05em;
}

.tracking-\[0\.022em\] {
  letter-spacing: .022em;
}

.tracking-wide {
  letter-spacing: .025em;
}

.text-white {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity) );
}

.text-yellow {
  --tw-text-opacity: 1;
  color: rgb(252 255 118 / var(--tw-text-opacity) );
}

.text-red {
  --tw-text-opacity: 1;
  color: rgb(255 0 61 / var(--tw-text-opacity) );
}

.text-gray {
  --tw-text-opacity: 1;
  color: rgb(148 148 148 / var(--tw-text-opacity) );
}

.text-green {
  --tw-text-opacity: 1;
  color: rgb(0 255 133 / var(--tw-text-opacity) );
}

.text-orange {
  --tw-text-opacity: 1;
  color: rgb(255 138 0 / var(--tw-text-opacity) );
}

.text-black {
  --tw-text-opacity: 1;
  color: rgb(0 0 0 / var(--tw-text-opacity) );
}

.text-blue {
  --tw-text-opacity: 1;
  color: rgb(97 0 255 / var(--tw-text-opacity) );
}

.text-purple {
  --tw-text-opacity: 1;
  color: rgb(112 0 255 / var(--tw-text-opacity) );
}

.text-gray-dk {
  --tw-text-opacity: 1;
  color: rgb(96 96 96 / var(--tw-text-opacity) );
}

.text-green-md {
  --tw-text-opacity: 1;
  color: rgb(0 92 0 / var(--tw-text-opacity) );
}

.antialiased {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.opacity-0 {
  opacity: 0;
}

.outline-none {
  outline-offset: 2px;
  outline: 2px solid #0000;
}

.outline {
  outline-style: solid;
}

.blur {
  --tw-blur: blur(8px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.filter {
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.transition-all {
  transition-property: all;
  transition-duration: .15s;
  transition-timing-function: cubic-bezier(.4, 0, .2, 1);
}

.duration-1000 {
  transition-duration: 1s;
}

.will-change-transform {
  will-change: transform;
}

.will-change-auto {
  will-change: auto;
}

html {
  --visible-viewport-height: 100vh;
  --global-perspective: 250px;
}

html, body {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  position: fixed;
  top: 0;
  left: 0;
  overflow: auto;
}

.grid {
  grid-template-columns: repeat(12, 1fr);
  column-gap: 20px;
  display: grid;
}

.overlay {
}

.overlay > div {
  pointer-events: initial;
}

.js-tilt-mode-active [data-component="request-motion"] {
  display: none;
}

.selection\:bg-green ::selection {
  --tw-bg-opacity: 1;
  background-color: rgb(0 255 133 / var(--tw-bg-opacity) );
}

.selection\:text-black ::selection {
  --tw-text-opacity: 1;
  color: rgb(0 0 0 / var(--tw-text-opacity) );
}

.selection\:bg-green::selection {
  --tw-bg-opacity: 1;
  background-color: rgb(0 255 133 / var(--tw-bg-opacity) );
}

.selection\:text-black::selection {
  --tw-text-opacity: 1;
  color: rgb(0 0 0 / var(--tw-text-opacity) );
}

.hover\:cursor-pointer:hover {
  cursor: pointer;
}

.hover\:border-green:hover {
  --tw-border-opacity: 1;
  border-color: rgb(0 255 133 / var(--tw-border-opacity) );
}

.hover\:border-blue:hover {
  --tw-border-opacity: 1;
  border-color: rgb(97 0 255 / var(--tw-border-opacity) );
}

.hover\:border-white:hover {
  --tw-border-opacity: 1;
  border-color: rgb(255 255 255 / var(--tw-border-opacity) );
}

.hover\:border-yellow:hover {
  --tw-border-opacity: 1;
  border-color: rgb(252 255 118 / var(--tw-border-opacity) );
}

.hover\:bg-yellow:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(252 255 118 / var(--tw-bg-opacity) );
}

.hover\:bg-green-dk:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(0 44 0 / var(--tw-bg-opacity) );
}

.hover\:bg-red-md:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(89 1 1 / var(--tw-bg-opacity) );
}

.hover\:bg-blue:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(97 0 255 / var(--tw-bg-opacity) );
}

.hover\:bg-blue-lt:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(123 112 255 / var(--tw-bg-opacity) );
}

.hover\:bg-blue-md:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(41 0 108 / var(--tw-bg-opacity) );
}

.hover\:text-green:hover {
  --tw-text-opacity: 1;
  color: rgb(0 255 133 / var(--tw-text-opacity) );
}

.hover\:text-blue:hover {
  --tw-text-opacity: 1;
  color: rgb(97 0 255 / var(--tw-text-opacity) );
}

.hover\:text-white:hover {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity) );
}

.hover\:text-yellow:hover {
  --tw-text-opacity: 1;
  color: rgb(252 255 118 / var(--tw-text-opacity) );
}

.no-touch .no-touch\:hidden {
  display: none;
}

@media (min-width: 768px) {
  .md\:relative {
    position: relative;
  }

  .md\:bottom-auto {
    bottom: auto;
  }

  .md\:top-0 {
    top: 0;
  }

  .md\:bottom-6 {
    bottom: 25px;
  }

  .md\:left-6 {
    left: 25px;
  }

  .md\:right-6 {
    right: 25px;
  }

  .md\:bottom-0 {
    bottom: 0;
  }

  .md\:left-auto {
    left: auto;
  }

  .md\:right-auto {
    right: auto;
  }

  .md\:order-1 {
    order: 1;
  }

  .md\:order-3 {
    order: 3;
  }

  .md\:col-span-4 {
    grid-column: span 4 / span 4;
  }

  .md\:col-span-8 {
    grid-column: span 8 / span 8;
  }

  .md\:col-start-5 {
    grid-column-start: 5;
  }

  .md\:m-2 {
    margin: 2px;
  }

  .md\:mb-8 {
    margin-bottom: 100px;
  }

  .md\:mb-0 {
    margin-bottom: 0;
  }

  .md\:mb-7 {
    margin-bottom: 50px;
  }

  .md\:ml-0 {
    margin-left: 0;
  }

  .md\:mt-\[112px\] {
    margin-top: 112px;
  }

  .md\:mr-2 {
    margin-right: 2px;
  }

  .md\:mt-5 {
    margin-top: 15px;
  }

  .md\:mt-\[110px\] {
    margin-top: 110px;
  }

  .md\:ml-\[155px\] {
    margin-left: 155px;
  }

  .md\:mr-\[155px\] {
    margin-right: 155px;
  }

  .md\:mr-0 {
    margin-right: 0;
  }

  .md\:mb-3 {
    margin-bottom: 5px;
  }

  .md\:block {
    display: block;
  }

  .md\:inline {
    display: inline;
  }

  .md\:flex {
    display: flex;
  }

  .md\:grid {
    display: grid;
  }

  .md\:hidden {
    display: none;
  }

  .md\:h-\[80px\] {
    height: 80px;
  }

  .md\:h-\[110px\] {
    height: 110px;
  }

  .md\:h-\[11px\] {
    height: 11px;
  }

  .md\:h-\[150px\] {
    height: 150px;
  }

  .md\:h-\[125px\] {
    height: 125px;
  }

  .md\:h-full {
    height: 100%;
  }

  .md\:w-\[151px\] {
    width: 151px;
  }

  .md\:w-\[150px\] {
    width: 150px;
  }

  .md\:w-\[16px\] {
    width: 16px;
  }

  .md\:w-full, .md\:w-\[100\%\] {
    width: 100%;
  }

  .md\:w-1\/2 {
    width: 50%;
  }

  .md\:w-\[115px\] {
    width: 115px;
  }

  .md\:w-\[160px\] {
    width: 160px;
  }

  .md\:w-\[70px\] {
    width: 70px;
  }

  .md\:w-\[95px\] {
    width: 95px;
  }

  .md\:w-\[155px\] {
    width: 155px;
  }

  .md\:w-\[108px\] {
    width: 108px;
  }

  .md\:w-\[112px\] {
    width: 112px;
  }

  .md\:max-w-\[35\%\] {
    max-width: 35%;
  }

  .md\:flex-grow-0 {
    flex-grow: 0;
  }

  .md\:flex-row {
    flex-direction: row;
  }

  .md\:items-end {
    align-items: flex-end;
  }

  .md\:items-center {
    align-items: center;
  }

  .md\:justify-center {
    justify-content: center;
  }

  .md\:justify-between {
    justify-content: space-between;
  }

  .md\:border-2 {
    border-width: 2px;
  }

  .md\:border-r {
    border-right-width: 1px;
  }

  .md\:border-t-0 {
    border-top-width: 0;
  }

  .md\:border-b {
    border-bottom-width: 1px;
  }

  .md\:border-t-\[60px\] {
    border-top-width: 60px;
  }

  .md\:border-green-dk {
    --tw-border-opacity: 1;
    border-color: rgb(0 44 0 / var(--tw-border-opacity) );
  }

  .md\:border-blue-md {
    --tw-border-opacity: 1;
    border-color: rgb(41 0 108 / var(--tw-border-opacity) );
  }

  .md\:p-4 {
    padding: 10px;
  }

  .md\:p-3 {
    padding: 5px;
  }

  .md\:p-\[20px\] {
    padding: 20px;
  }

  .md\:pb-9 {
    padding-bottom: 150px;
  }

  .md\:pb-0 {
    padding-bottom: 0;
  }

  .md\:pb-7 {
    padding-bottom: 50px;
  }

  .md\:pb-2 {
    padding-bottom: 2px;
  }

  .md\:pb-6 {
    padding-bottom: 25px;
  }

  .md\:pb-8 {
    padding-bottom: 100px;
  }

  .md\:pr-7 {
    padding-right: 50px;
  }

  .md\:pl-7 {
    padding-left: 50px;
  }

  .md\:text-left {
    text-align: left;
  }

  .md\:text-center {
    text-align: center;
  }

  .md\:text-xl {
    font-size: 32px;
    line-height: 38px;
  }

  .md\:text-4xl {
    font-size: 10.15vw;
    line-height: 90%;
  }

  .md\:text-base {
    letter-spacing: .015em;
    font-size: 17px;
    line-height: 21px;
  }

  .md\:text-lg {
    font-size: 24px;
    line-height: 28px;
  }

  .md\:text-3xl {
    font-size: 5vw;
    line-height: 90%;
  }

  .md\:text-\[20px\] {
    font-size: 20px;
  }

  .md\:text-rg {
    letter-spacing: .015em;
    font-size: 17px;
    line-height: 21px;
  }

  .md\:text-\[100px\] {
    font-size: 100px;
  }

  .md\:leading-\[115\%\] {
    line-height: 115%;
  }
}

@media (min-width: 1024px) {
  .lg\:absolute {
    position: absolute;
  }

  .lg\:left-1\/2 {
    left: 50%;
  }

  .lg\:col-span-4 {
    grid-column: span 4 / span 4;
  }

  .lg\:col-span-6 {
    grid-column: span 6 / span 6;
  }

  .lg\:col-span-8 {
    grid-column: span 8 / span 8;
  }

  .lg\:col-start-auto {
    grid-column-start: auto;
  }

  .lg\:mr-4 {
    margin-right: 10px;
  }

  .lg\:mr-0 {
    margin-right: 0;
  }

  .lg\:block {
    display: block;
  }

  .lg\:inline {
    display: inline;
  }

  .lg\:flex {
    display: flex;
  }

  .lg\:hidden {
    display: none;
  }

  .lg\:w-\[100\%\] {
    width: 100%;
  }

  .lg\:w-\[181px\] {
    width: 181px;
  }

  .lg\:w-\[180px\] {
    width: 180px;
  }

  .lg\:w-1\/3 {
    width: 33.3333%;
  }

  .lg\:w-\[20\%\] {
    width: 20%;
  }

  .lg\:w-\[13em\] {
    width: 13em;
  }

  .lg\:w-\[108px\] {
    width: 108px;
  }

  .lg\:-translate-x-1\/2 {
    --tw-translate-x: -50%;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y) ) rotate(var(--tw-rotate) ) skewX(var(--tw-skew-x) ) skewY(var(--tw-skew-y) ) scaleX(var(--tw-scale-x) ) scaleY(var(--tw-scale-y) );
  }

  .lg\:justify-end {
    justify-content: flex-end;
  }

  .lg\:self-center {
    align-self: center;
  }

  .lg\:p-\[50px\] {
    padding: 50px;
  }

  .lg\:py-\[120px\] {
    padding-top: 120px;
    padding-bottom: 120px;
  }

  .lg\:pt-8 {
    padding-top: 100px;
  }

  .lg\:pb-8 {
    padding-bottom: 100px;
  }

  .lg\:pb-0 {
    padding-bottom: 0;
  }

  .lg\:pr-6 {
    padding-right: 25px;
  }

  .lg\:pl-6 {
    padding-left: 25px;
  }

  .lg\:pr-7 {
    padding-right: 50px;
  }

  .lg\:text-\[8vw\] {
    font-size: 8vw;
  }

  .lg\:text-xl {
    font-size: 32px;
    line-height: 38px;
  }

  .lg\:text-\[13vw\] {
    font-size: 13vw;
  }

  .lg\:text-\[19vw\] {
    font-size: 19vw;
  }

  .lg\:text-\[6vw\] {
    font-size: 6vw;
  }

  .lg\:text-6xl {
    font-size: 16vw;
    line-height: 80%;
  }

  .lg\:text-\[25px\] {
    font-size: 25px;
  }

  .lg\:text-rg {
    letter-spacing: .015em;
    font-size: 17px;
    line-height: 21px;
  }

  .lg\:text-\[40px\] {
    font-size: 40px;
  }

  .lg\:text-\[200px\] {
    font-size: 200px;
  }

  .lg\:leading-none {
    line-height: 1;
  }
}

@media (min-width: 1280px) {
  .xl\:col-span-4 {
    grid-column: span 4 / span 4;
  }

  .xl\:col-span-8 {
    grid-column: span 8 / span 8;
  }

  .xl\:block {
    display: block;
  }

  .xl\:flex {
    display: flex;
  }

  .xl\:w-\[220px\] {
    width: 220px;
  }
}

@media (min-width: 1536px) {
  .xxl\:w-\[40vw\] {
    width: 40vw;
  }
}

/*# sourceMappingURL=fam-overview.a4c263fa.css.map */