/* Original coin animation and wordmark: https://bots-n-bones.com.
   Colours follow the application's theme instead of the site's coral palette. */
.app-splash {
  position: fixed;
  inset: 0;
  display: grid;
  place-items: center;
  background: var(--canvas, #d9d5c8);
  color: var(--ink, #191917);
  perspective: 900px;
}
.app-splash__coin {
  position: relative;
  width: clamp(168px, 20vw, 272px);
  aspect-ratio: 320 / 122;
  transform-style: preserve-3d;
  animation: bnb-logo-coin-spin 1s linear infinite;
}
.app-splash__face {
  position: absolute;
  inset: 0;
  background: currentColor;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  -webkit-mask: url('/assets/brand/wordmark.png') center / contain no-repeat;
  mask: url('/assets/brand/wordmark.png') center / contain no-repeat;
  transform: rotateY(0) translateZ(4px);
}
.app-splash__face--back { transform: rotateY(180deg) translateZ(4px); }
@keyframes bnb-logo-coin-spin { to { transform: rotateY(360deg); } }
@media (prefers-reduced-motion: reduce) {
  .app-splash__coin { animation: none; }
}
