:root {
  --hemp-blue: #003366;
  --hemp-gold: #D4AF37;
}

body {
  font-family: 'Segoe UI', Roboto, Arial, sans-serif;
  background: linear-gradient(135deg, #001c3d 0%, #003366 55%, #012a52 100%);
  min-height: 100vh;
  overflow-x: hidden;
}

.auth-bg {
  position: fixed;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}

.auth-bg__shape {
  position: absolute;
  border-radius: 50%;
  opacity: 0.12;
  background: var(--hemp-gold);
  animation: float 18s ease-in-out infinite;
}

.shape-1 { width: 480px; height: 480px; top: -150px; left: -120px; animation-delay: 0s; }
.shape-2 { width: 320px; height: 320px; bottom: -100px; right: -80px; background: #ffffff; animation-delay: 4s; }
.shape-3 { width: 220px; height: 220px; top: 40%; right: 10%; animation-delay: 8s; }

@keyframes float {
  0%, 100% { transform: translateY(0) translateX(0) scale(1); }
  50% { transform: translateY(-30px) translateX(20px) scale(1.05); }
}

.auth-card {
  position: relative;
  z-index: 1;
  border-radius: 1rem;
  backdrop-filter: blur(2px);
}

.auth-logo {
  max-height: 64px;
}

@media (prefers-reduced-motion: reduce) {
  .auth-bg__shape { animation: none; }
}
