/* sineSYNC - minimal custom polish on top of Tailwind */
:root { color-scheme: dark; }
.glow {
  box-shadow: 0 0 0.75rem rgba(34, 211, 238, 0.25), 0 0 1.5rem rgba(217, 70, 239, 0.15);
}
.grid-fade {
  background-image:
    radial-gradient(circle at 10% 20%, rgba(34,211,238,.14), transparent 45%),
    radial-gradient(circle at 80% 10%, rgba(217,70,239,.14), transparent 42%),
    radial-gradient(circle at 50% 80%, rgba(59,130,246,.10), transparent 44%),
    linear-gradient(to bottom, rgba(255,255,255,.06) 1px, transparent 1px),
    linear-gradient(to right, rgba(255,255,255,.06) 1px, transparent 1px);
  background-size: auto, auto, auto, 36px 36px, 36px 36px;
  background-position: 0 0;
}
.modal-backdrop { display:none; }
.modal-backdrop.show { display:flex; }
.card { background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.10); }

/* subtle motion accents */
@keyframes floaty {
  0%, 100% { transform: translateY(0px); }
  50% { transform: translateY(-10px); }
}
.floaty { animation: floaty 6s ease-in-out infinite; }

@keyframes shimmer {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
.shimmer {
  background-size: 200% 200%;
  animation: shimmer 10s ease infinite;
}