.cc22-launch-cinematic[hidden],
.cc22-launch-cinematic [hidden] {
  display: none !important;
}

.cc22-launch-cinematic {
  position: fixed;
  inset: 0;
  z-index: 20000;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: #0d0620;
}

.cc22-launch-cinematic__video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #0d0620;
}

.cc22-launch-cinematic__skip,
.cc22-launch-cinematic__start {
  position: absolute;
  z-index: 1;
  min-height: 44px;
  padding: 9px 20px;
  border: 1px solid hsl(38 70% 38%);
  border-radius: 9px;
  background: linear-gradient(180deg, hsl(45 100% 72%), hsl(40 95% 54%));
  box-shadow: inset 0 1px 0 hsl(48 100% 90% / .9), 0 5px 0 hsl(32 60% 30% / .5), 0 10px 18px #0009;
  color: hsl(32 80% 22%);
  font: 700 17px/1 "Segoe UI", system-ui, sans-serif;
  letter-spacing: .04em;
  cursor: pointer;
}

.cc22-launch-cinematic__skip {
  top: calc(18px + env(safe-area-inset-top));
  right: calc(18px + env(safe-area-inset-right));
}

.cc22-launch-cinematic__start {
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.cc22-launch-cinematic button:hover,
.cc22-launch-cinematic button:focus-visible {
  filter: brightness(1.08);
  outline: 2px solid #fff3d7;
  outline-offset: 3px;
}