@font-face {
  font-family: "Inter Tight Intro";
  src: url("assets/fonts/intro/InterTight-Regular.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Inter Intro";
  src: url("assets/fonts/intro/Inter-Regular.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
html.cc-intro-pending, html.cc-intro-pending body { overflow: hidden; background: #000; }
.cc-intro { display: none; }
.cc-intro[hidden] { display: none !important; }
html.cc-intro-pending .cc-intro {
  display: block;
  position: fixed;
  inset: 0;
  z-index: 2147483647;
  width: 100%;
  height: 100vh;
  height: 100dvh;
  overflow: hidden;
  background: #000;
  color: #fff;
}
.cc-intro__media, .cc-intro__media video { position: absolute; inset: 0; width: 100%; height: 100%; }
.cc-intro__media video { display: block; object-fit: cover; object-position: center; }
.cc-intro__brand {
  position: absolute;
  z-index: 1;
  top: calc(max(4.5dvh, env(safe-area-inset-top) + 12px));
  left: 50%;
  transform: translateX(-50%);
  color: #fff;
  opacity: .8;
  font: 400 clamp(28px, 3.2vw, 58px)/1 "Inter Tight Intro", sans-serif;
  white-space: nowrap;
  pointer-events: none;
}
.cc-intro__content {
  position: absolute;
  top: 63%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  width: min(100% - 32px, 720px);
  text-align: center;
}
.cc-intro__content h1 {
  margin: 0;
  color: #fff;
  font: 400 22px/1.25 "Inter Tight Intro", sans-serif;
  text-wrap: balance;
}
.cc-intro__portrait-break { display: none; }
.cc-intro__enter {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-width: 96px;
  height: 25px;
  padding: 0 12px;
  border: 0;
  border-radius: 999px;
  background: #fff;
  color: #000;
  font: 400 13px/1 "Inter Intro", sans-serif;
  white-space: nowrap;
  cursor: pointer;
}
.cc-intro__sound {
  position: absolute;
  z-index: 2;
  top: calc(14px + env(safe-area-inset-top));
  right: calc(14px + env(safe-area-inset-right));
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #fff;
  cursor: pointer;
}
.cc-intro__sound svg { width: 26px; height: 26px; }
.cc-intro__sound-on { display: none; }
.cc-intro__sound[data-sound="on"] .cc-intro__sound-on { display: block; }
.cc-intro__sound[data-sound="on"] .cc-intro__sound-off { display: none; }
.cc-intro button:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }
.cc-intro__enter:focus-visible { outline-color: #000; box-shadow: 0 0 0 3px #fff; }
@media (min-width: 700px) {
  .cc-intro__content {
    top: 70%;
    width: min(calc(100% - 48px), 1100px);
    gap: clamp(20px, 2.5vw, 48px);
  }
  .cc-intro__content h1 { font-size: clamp(30px, 3.45vw, 66px); }
  .cc-intro__enter {
    min-width: clamp(128px, 15.15vw, 292px);
    height: clamp(34px, 4.1vw, 79px);
    font-size: clamp(17px, 2vw, 39px);
  }
}
@media (max-width: 699px) and (orientation: portrait) {
  .cc-intro__media video { object-position: 58% center; }
  .cc-intro__brand { font-size: clamp(24px, 6vw, 30px); }
  .cc-intro__content {
    top: auto;
    bottom: max(10dvh, env(safe-area-inset-bottom) + 24px);
    transform: translateX(-50%);
    width: calc(100% - 32px);
    gap: 26px;
  }
  .cc-intro__content h1 {
    max-width: 390px;
    font-size: 28.6px;
  }
  .cc-intro__portrait-break { display: initial; }
  .cc-intro__enter {
    min-width: 125px;
    height: 33px;
    font-size: 17px;
  }
}
@media (max-width: 699px) and (max-aspect-ratio: 1/2) {
  .cc-intro__media video { object-position: 64% center; }
}
@media (min-width: 421px) and (max-width: 699px) and (orientation: portrait) {
  .cc-intro__content h1 { font-size: 31.2px; }
  .cc-intro__enter {
    min-width: 146px;
    height: 39px;
    font-size: 19.5px;
  }
}
@media (min-width: 1200px) and (min-aspect-ratio: 8/5) {
  .cc-intro__content { top: 76%; }
  .cc-intro__content h1 { font-size: clamp(21px, 2.415vw, 46.2px); }
  .cc-intro__enter {
    min-width: clamp(89.6px, 10.605vw, 204.4px);
    height: clamp(23.8px, 2.87vw, 55.3px);
    font-size: clamp(11.9px, 1.4vw, 27.3px);
  }
}
@media (min-width: 1200px) and (min-aspect-ratio: 8/5) and (hover: hover) and (pointer: fine) {
  .cc-intro__brand { font-size: clamp(18.2px, 2.08vw, 37.7px); }
  .cc-intro__content { top: 79%; gap: clamp(24px, 1.875vw, 36px); }
  .cc-intro__content h1 { font-size: clamp(44px, 3.645vw, 70px); }
  .cc-intro__enter {
    min-width: clamp(182px, 15.15vw, 292px);
    height: clamp(49px, 4.1vw, 79px);
    font-size: clamp(24px, 2vw, 39px);
    transition: transform 180ms ease;
    transform-origin: center;
  }
  .cc-intro__enter:hover { transform: scale(1.12); }
  .cc-intro__enter:active { transform: scale(1); }
  .cc-intro__enter--return { scale: .8; }
}
@media (min-width: 1200px) and (min-aspect-ratio: 8/5) and (hover: hover) and (pointer: fine) and (prefers-reduced-motion: reduce) {
  .cc-intro__enter { transition: none; }
}