/* Bad Rap welcome: 1s in, 1.5s at full opacity, 1s out per phrase. */
:root {
  --badrap-welcome-background: #fff;
  --badrap-welcome-foreground: #000;
}
@media (prefers-color-scheme: dark) {
  :root {
    --badrap-welcome-background: #000;
    --badrap-welcome-foreground: #fff;
  }
}
html.badrap-welcome-pending {
  background: var(--badrap-welcome-background);
}
html.badrap-welcome-pending body {
  overflow: hidden;
  background: var(--badrap-welcome-background);
}
html.badrap-welcome-pending body > :not([data-badrap-welcome]) {
  visibility: hidden;
}
.badrap-welcome {
  position: fixed;
  inset: 0;
  z-index: 2147483640;
  display: grid;
  place-items: center;
  box-sizing: border-box;
  padding: 0 0 5.5vh;
  background: var(--badrap-welcome-background);
  color: var(--badrap-welcome-foreground);
}
.badrap-welcome__phrase {
  box-sizing: border-box;
  width: 92%;
  margin: 0;
  font-family: "Arial Black", "Helvetica Neue", Arial, sans-serif;
  font-size: clamp(26px, 11.6vw, 82px);
  font-weight: 900;
  line-height: 1.12;
  letter-spacing: -.045em;
  text-align: center;
  white-space: pre-line;
  opacity: 0;
  animation: badrap-welcome-beat 3.5s linear both;
}
.badrap-welcome__phrase--long { font-size: clamp(26px, 10.9vw, 82px); }
.badrap-welcome__phrase--team { font-size: clamp(24px, 8.95vw, 82px); }
@keyframes badrap-welcome-beat {
  0%, 100% { opacity: 0; }
  28.57142857%, 71.42857143% { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .badrap-welcome__phrase { animation: none; opacity: 1; }
}