* {
  scrollbar-width: thin;
  scrollbar-color: #2a3a52 #0a0f1e;
}
*::-webkit-scrollbar { width: 6px; }
*::-webkit-scrollbar-track { background: #0a0f1e; }
*::-webkit-scrollbar-thumb { background: #2a3a52; border-radius: 3px; }

body {
  background:
    radial-gradient(ellipse at 20% 0%, rgba(6,182,212,0.06) 0%, transparent 50%),
    radial-gradient(ellipse at 80% 100%, rgba(6,182,212,0.04) 0%, transparent 50%),
    #0a0f1e;
}

.grid-bg {
  background-image:
    linear-gradient(rgba(42,58,82,0.25) 1px, transparent 1px),
    linear-gradient(90deg, rgba(42,58,82,0.25) 1px, transparent 1px);
  background-size: 40px 40px;
}

@keyframes pulse-green {
  0%, 100% { box-shadow: 0 0 0 0 rgba(34,197,94,0.6); }
  50% { box-shadow: 0 0 0 6px rgba(34,197,94,0); }
}

@keyframes glow-border {
  0%, 100% { box-shadow: 0 0 15px rgba(6,182,212,0.3), inset 0 0 15px rgba(6,182,212,0.05); }
  50% { box-shadow: 0 0 25px rgba(6,182,212,0.5), inset 0 0 25px rgba(6,182,212,0.1); }
}

@keyframes scan-line {
  0% { transform: translateY(-100%); }
  100% { transform: translateY(100vh); }
}

@keyframes fade-up {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes shimmer {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}

@keyframes pulse-alert {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.6; }
}

.animate-pulse-green { animation: pulse-green 2s infinite; }
.animate-glow { animation: glow-border 2s ease-in-out infinite; }
.animate-fade-up { animation: fade-up 0.5s ease-out forwards; }
.animate-pulse-alert { animation: pulse-alert 1s ease-in-out infinite; }

.shimmer-bg {
  background: linear-gradient(90deg, #1e293b 25%, #2a3a52 50%, #1e293b 75%);
  background-size: 200% 100%;
  animation: shimmer 1.5s infinite;
}

.glass {
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  background: rgba(30,41,59,0.7);
  border: 1px solid rgba(42,58,82,0.6);
}

.scan-progress-bar {
  background: linear-gradient(90deg, #06b6d4, #22d3ee, #06b6d4);
  background-size: 200% 100%;
  animation: shimmer 1s infinite linear;
}

.verdict-safe {
  background: linear-gradient(135deg, rgba(34,197,94,0.15), rgba(34,197,94,0.05));
  border: 1px solid rgba(34,197,94,0.3);
}

.verdict-suspicious {
  background: linear-gradient(135deg, rgba(245,158,11,0.15), rgba(245,158,11,0.05));
  border: 1px solid rgba(245,158,11,0.3);
}

.verdict-dangerous {
  background: linear-gradient(135deg, rgba(239,68,68,0.15), rgba(239,68,68,0.05));
  border: 1px solid rgba(239,68,68,0.3);
}

.btn-primary {
  background: linear-gradient(135deg, #06b6d4, #0284c7);
  transition: all 0.3s ease;
}
.btn-primary:hover {
  background: linear-gradient(135deg, #22d3ee, #0ea5e9);
  transform: translateY(-1px);
  box-shadow: 0 4px 20px rgba(6,182,212,0.3);
}

.btn-ghost {
  border: 1px solid #2a3a52;
  transition: all 0.3s ease;
}
.btn-ghost:hover {
  border-color: #06b6d4;
  background: rgba(6,182,212,0.1);
}

.browser-mockup {
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid #2a3a52;
  background: #0f172a;
}

.browser-bar {
  background: #1e293b;
  padding: 8px 12px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.traffic-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
}

.input-focus-glow:focus {
  outline: none;
  box-shadow: 0 0 0 2px rgba(6,182,212,0.5), 0 0 20px rgba(6,182,212,0.15);
  border-color: #06b6d4;
}

.toast-enter {
  animation: fade-up 0.3s ease-out;
}