*,
*::before,
*::after {
  box-sizing: border-box;
}

body {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 500;
  line-height: 1.55;
  font-synthesis: none;
  color: #fff;
  background-color: green;
  min-height: 100vh;
  padding: clamp(16px, 4vw, 48px);
  overflow-wrap: anywhere;
}

body canvas {
  border: 1px solid #fff;
  display: block;
  margin: 1em auto;
}

body a,
body div {
  font-size: clamp(16px, 2.2vw, 20px);
  text-decoration: none;
  color: #fff;
  transition: transform 0.2s ease;
}

body a {
  display: inline-block;
}

body a:visited,
body a:active {
  color: #fff;
}

body a:hover {
  transform: rotate(-2deg) scale(1.1);
}

picture,
img {
  max-width: 100%;
}

img {
  display: block;
  height: auto;
}

.tracklist-container {
  max-width: 960px;
}

@media (max-width: 480px) {
  body {
    padding: 16px;
  }

  body a,
  body div {
    font-size: 16px;
  }
}