:root {
  --night: #0d1f24;
  --bone: #efe0bf;
  --ink: #140c1a;
  --slime: #b6ff5a; /* done, lit */
  --pumpkin: #ff9a3a; /* action */
  --blood: #ff4a6a; /* time running out */
  --witch: #b26bff;
  --paper: #efe4cc;
  --stone: linear-gradient(#4a4560, #35304a);
  --spring: cubic-bezier(0.34, 1.56, 0.64, 1);
}

* {
  box-sizing: border-box;
  margin: 0;
  -webkit-tap-highlight-color: transparent;
}

html,
body {
  height: 100%;
  color: #ece6ff;
  font-family: 'Rubik', system-ui, sans-serif;
  overscroll-behavior: none;
}

body {
  background:
    radial-gradient(circle at 78% 7%, #f4f7d8 0 26px, #e7f0b866 29px, #9fd67a22 70px, transparent 140px),
    linear-gradient(#0d1f24 0%, #16303a 40%, #2b2448 72%, #120d1c 100%);
  background-attachment: fixed;
}

.spooky {
  font-family: 'Bagel Fat One', 'Rubik', sans-serif;
  font-weight: 400;
}

button {
  font: inherit;
  border: 0;
  cursor: pointer;
  color: inherit;
  background: none;
  transition: transform 0.35s var(--spring);
}

button:active:not(:disabled) {
  transform: scale(0.93) rotate(-1.5deg);
  transition-duration: 0.06s;
}

button:disabled {
  opacity: 0.4;
  cursor: default;
}

.ghost {
  display: block;
  filter: drop-shadow(0 6px 14px rgb(0 0 0 / 0.5));
}

.bob {
  animation: bob 2.6s ease-in-out infinite;
}

@keyframes bob {
  50% {
    transform: translateY(-8px) rotate(2deg);
  }
}

.wobble {
  animation: wobble 0.5s var(--spring);
}

@keyframes wobble {
  20% {
    transform: scale(0.86, 1.12) rotate(-6deg);
  }
  45% {
    transform: scale(1.1, 0.92) rotate(5deg);
  }
  70% {
    transform: scale(0.97, 1.03) rotate(-2deg);
  }
}

.pop {
  animation: pop 0.45s var(--spring) both;
}

@keyframes pop {
  from {
    transform: scale(0.6);
    opacity: 0;
  }
}

.toast {
  position: fixed;
  left: 50%;
  bottom: calc(110px + env(safe-area-inset-bottom));
  transform: translateX(-50%);
  background: var(--blood);
  color: white;
  font-weight: 900;
  padding: 12px 18px;
  border-radius: 14px;
  z-index: 50;
  box-shadow: 0 0 20px #ff4a6a88;
  animation: pop 0.4s var(--spring);
}
