#donut-container {
  position: absolute;
  top: -4rem;
  right: -2rem;
  color: white;
  font-family: monospace;
  width: min(60vw, 1100px);
  height: min(60vw, 1100px);
  max-width: 1100px;
  max-height: 1100px;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}

#donut-container pre {
  display: block;
  width: auto;
  max-width: 100%;
  max-height: 100%;
  margin: 0;
  padding: 0;
  white-space: pre;
  font-family: monospace;
  font-size: clamp(10px, 1.5vw, 14px);
  line-height: 0.78;
  letter-spacing: 0;
  text-align: center;
  overflow: hidden;
}

#donut-container::after {
  content: "";
  position: absolute;
  inset: 0;
  background: url('data:image/png;base64,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...') center/contain no-repeat;
  pointer-events: none;
}

@media (max-width: 900px) {
  #donut-container {
    top: 16%;
    right: 4%;
    left: auto;
    transform: none;
    width: min(72vw, 720px);
    height: min(72vw, 720px);
  }
}

@media (max-width: 600px) {
  #donut-container {
    position: absolute;
    top: 6rem;
    left: 50%;
    right: auto;
    transform: translateX(-50%);
    width: min(80vw, 420px);
    height: min(80vw, 420px);
    margin: 0;
  }

  #donut-container pre {
    font-size: clamp(8px, 2.2vw, 12px);
    line-height: 0.78;
  }

  #donut-container::after {
    background-size: contain;
  }
}