body {
  display: flex;
  flex-direction: column;
  align-items: center;
  background: black;
}

* {
  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
    Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  color: white;
}

header {
  font-size: calc(2vh + 1vw);
  font-weight: bold;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: calc(1vh + 2vw);
  margin: 2vh;
}

header img {
  height: calc(4vh + 3vw);
  outline: rgb(162, 135, 0) 3px solid;
  border-radius: 15vh;
  filter: drop-shadow(5px 5px 15px rgb(255, 187, 0));
  animation: rotate3D 5s linear infinite;
  transform-origin: center;
}

#trump-bg {
  width: calc(17vh + 5vw);
  max-width: 50vh;
  z-index: -4;
  margin-top: 3vh;
  filter: drop-shadow(4px -5px 0 rgb(87, 87, 87));
}

@keyframes rotate3D {
  0% {
    transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg);
  }
  40% {
    transform: rotateX(20deg) rotateY(20deg) rotateZ(0deg);
  }
  50% {
    transform: rotateX(30deg) rotateY(30deg) rotateZ(0deg);
  }
  75% {
    transform: rotateX(180deg) rotateY(90deg) rotateZ(0deg);
  }
  95% {
    transform: rotateX(355deg) rotateY(355deg) rotateZ(355deg);
  }
  100% {
    transform: rotateX(360deg) rotateY(360deg) rotateZ(360deg);
  }
}

.goldText {
  background: linear-gradient(90deg, #ffd900, #ffa536, #ffd700, #fffacd);
  background-size: 200%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: gold-shimmer 3s infinite linear;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2), 2px 2px 4px rgba(0, 0, 0, 0.1),
    3px 3px 6px rgba(0, 0, 0, 0.1);
  transform: rotateY(20deg) rotateX(10deg);
  perspective: 500px;
  display: inline-block;
  font-size: calc(4vh + 3vw);
  font-family: 'RapidtechDemo', sans-serif;
}

@keyframes gold-shimmer {
  0% {
    background-position: 0% 50%;
  }
  100% {
    background-position: 100% 50%;
  }
}

@font-face {
  font-family: 'RapidtechDemo';
  src: url('./RapidtechDemoRegular.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

#ton-connect button {
  width: calc(12vh + 10vw);
  height: 5vh;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}

#ton-connect button div {
  font-size: calc(1.1vh + 0.7vw);
}