@font-face {
    font-family: ChunkfiveRegular;
    src: url(/fonts/chunkfive.otf);
  }
  :root {
      --font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  }
  html {
      font-size: 100%;
      height: 100%;
  }
  body {
      margin: 0;
      padding: 0;
      height: 100%;
      user-select: none;
      font-family: var(--font-sans-serif);
      font-size: 1rem;
      font-weight: 400;
      line-height: 1.5;
      color: #212529;
      background-color: #000000;
      -webkit-text-size-adjust: 100%;
      -webkit-tap-highlight-color: transparent;
      overflow: hidden;
  }
  *, ::after, ::before {
      box-sizing: border-box;
  }
  
  .center {
      justify-content: center !important;
      flex-direction: column !important;
      display: flex !important;
      text-align: center;
  }
  .full-size {
      height: 100% !important;
      width: 100% !important;
  }
  h1 {
      color: #fff !important;
      font-weight: 300 !important;
      margin: 0 !important;
  }
  @media (min-width: 1200px)
  #h1 {
      font-size: 2.5rem;
  }
  h1 {
      font-family: 'ChunkFiveRegular';
      font-size: calc(1.375rem + 5vw);
      font-size: clamp(8px, 1.375rem + 50vw, 20vw);
      margin-top: 0;
      margin-bottom: 0.5rem;
      font-weight: 500;
      line-height: 1.2;
      color: #fff;
      text-shadow: 0px 1px 0px #999, 0px 2px 0px #888, 0px 3px 0px #777, 0px 4px 0px #666, 0px 5px 0px #555, 0px 6px 0px #444, 0px 7px 0px #333, 0px 8px 7px #001135;
  }
  h1 span {
      display: inline-block;
  }
  
  .K {
      animation: swing1 3.5s ease-out;
      animation: swing1 3.5s cubic-bezier(0, 0, 0.58, 1);
  }
  .K span {
      animation: spin1 3.5s ease-out;
      animation: spin1 3.5s cubic-bezier(0, 0, 0.58, 1);
  }
  
  .ik {
      animation: scale-in 2s ease-out;
      animation: scale-in 2s cubic-bezier(0, 0, 0.38, 1);
  }
  
  .i {
      animation: swing2 3s ease-out;
      animation: swing2 3s cubic-bezier(0, 0, 0.38, 1);
  }
  .i span {
      animation: spin2 3s ease-out;
      animation: spin2 3s cubic-bezier(0, 0, 0.38, 1);
  }
  
  .R {
      animation: slide-in-bounce 5s ease-out;
  }
  
  h1 {
      animation: bounce-slide 5s ease-out;
      transform: scale(1) rotate(0) translateX(0) translateY(0);
  }
  
  body {
      background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
      background-size: 400% 400%;
      animation: gradient 15s ease infinite;
  }
  
  body.pre-animation * {
      display: none;
  }
  
  body.animation h1 {
      animation: scale-out 3s ease-in;
  }

  @keyframes gradient {
      0% {
          background-position: 0% 50%;
      }
      50% {
          background-position: 100% 50%;
      }
      100% {
          background-position: 0% 50%;
      }
  }
  
  @keyframes scale-in {
      0%  {transform: scale(0);}
      100% {transform: scale(1);}	
  }
  
  @keyframes scale-out {
      0%  {transform: scale(1) rotate(0);}
      75% {transform: scale(0) rotate(320deg);}
      100% {transform: scale(0) rotate(0);}
  }
  
  @keyframes spin1 {
      0%  {transform: rotate(-1560deg);}
      100% {transform: rotate(0);}
  }
  
  @keyframes spin2 {
      0%  {transform: rotate(2700deg);}
      100% {transform: rotate(0);}
  }
  
  @keyframes swing1 {
      0%  {transform: rotate(58deg) translateX(-102vw) translateY(-76vh);}
      100% {transform: rotate(0) translateX(0) translateY(0);}
  }
  
  @keyframes swing2 {
      0%  {transform: rotate(95deg) translateX(90vw) translateY(90vh);}
      100% {transform: rotate(0) translateX(0) translateY(0);}
  }
  @keyframes slide-in-bounce {
      0%  {transform: translateX(800vw);}
      93%  {transform: translateX(-12px) rotate(0);}
      95%  {transform: translateX(-10px) rotate(-1.7deg);}
      96%  {transform: translateX(-5px);}
      100% {transform: translateX(0) rotate(0);}
  }
  
  @keyframes bounce-slide {
      0%  {transform: translateX(0);}
      93%  {transform: translateX(0);}
      94%  {transform: translateX(-4px);}
      95%  {transform: translateX(-3px);}
      100% {transform: translateX(0);}
  }