/* ============================================================
   MarkMate — Aurora blob animations only.
   All other styles are handled by Tailwind + DaisyUI utilities.
   ============================================================ */

/* ---------- Aurora background blobs ---------- */
.aurora-blob {
  position: fixed;
  border-radius: 50%;
  filter: blur(90px);
  opacity: 0.22;
  pointer-events: none;
  z-index: 0;
}

.aurora-blob-1 {
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, #00d4ff 0%, #0ea5e9 60%, transparent 100%);
  top: -150px;
  left: -150px;
  animation: float-1 18s ease-in-out infinite;
}

.aurora-blob-2 {
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, #1d4ed8 0%, #3b82f6 60%, transparent 100%);
  bottom: -100px;
  right: -100px;
  animation: float-2 22s ease-in-out infinite;
}

.aurora-blob-3 {
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, #14b8a6 0%, #06b6d4 60%, transparent 100%);
  top: 40%;
  right: 15%;
  animation: float-3 16s ease-in-out infinite;
}

.aurora-blob-4 {
  width: 350px;
  height: 350px;
  background: radial-gradient(circle, #6366f1 0%, #8b5cf6 60%, transparent 100%);
  top: 60%;
  left: 10%;
  animation: float-1 20s ease-in-out infinite reverse;
  opacity: 0.15;
}

@keyframes float-1 {
  0%   { transform: translate(0, 0) scale(1); }
  33%  { transform: translate(60px, -40px) scale(1.08); }
  66%  { transform: translate(-30px, 50px) scale(0.95); }
  100% { transform: translate(0, 0) scale(1); }
}

@keyframes float-2 {
  0%   { transform: translate(0, 0) scale(1); }
  33%  { transform: translate(-70px, 40px) scale(1.1); }
  66%  { transform: translate(40px, -60px) scale(0.92); }
  100% { transform: translate(0, 0) scale(1); }
}

@keyframes float-3 {
  0%   { transform: translate(0, 0) scale(1); }
  50%  { transform: translate(-50px, -50px) scale(1.12); }
  100% { transform: translate(0, 0) scale(1); }
}