:root {
  --font-sans: "Inter", ui-sans-serif, system-ui, sans-serif;
  --font-mono: "JetBrains Mono", "Fira Code", monospace;
  --color-primary: #E8FD94;
  --color-background: #050505;
  --color-foreground: #F4F7FF;
}

@layer base {
  :root {
    --background: 240 10% 2%;
    --foreground: 0 0% 98%;
  }
}

@layer base {
  * {
    border-color: #232326;
  }
  html, body {
    @apply bg-[#050505] text-[#F4F7FF] antialiased overflow-hidden;
    font-family: var(--font-sans);
  }
}

@layer components {
  .neural-card {
    @apply bg-[#121214] border border-[#232326] rounded-xl p-6 transition-all duration-500 hover:border-[#E8FD94]/40 hover:shadow-[0_0_30px_rgba(232,253,148,0.1)];
    box-shadow: 0 10px 40px -10px rgba(0, 0, 0, 0.5);
  }
  
  .glass-panel {
    background: rgba(10, 10, 10, 0.7);
    backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, 0.04);
    box-shadow: 0 20px 40px -15px rgba(0, 0, 0, 0.5);
  }

  .custom-scrollbar::-webkit-scrollbar {
    width: 3px;
  }
  .custom-scrollbar::-webkit-scrollbar-track {
    background: transparent;
  }
  .custom-scrollbar::-webkit-scrollbar-thumb {
    background: rgba(232, 253, 148, 0.1);
    border-radius: 10px;
  }
  .custom-scrollbar::-webkit-scrollbar-thumb:hover {
    background: rgba(232, 253, 148, 0.4);
  }
}

@keyframes neural-pulse {
    0% { transform: scale(1) translate(0, 0); opacity: 0.2; }
    33% { transform: scale(1.1) translate(2%, -1%); opacity: 0.3; }
    66% { transform: scale(0.95) translate(-1%, 2%); opacity: 0.25; }
    100% { transform: scale(1) translate(0, 0); opacity: 0.2; }
}

.neural-glow {
    position: absolute;
    width: 50vw;
    height: 50vw;
    background: radial-gradient(circle, var(--color-primary) 0%, transparent 70%);
    border-radius: 50%;
    pointer-events: none;
    z-index: 0;
    opacity: 0.2;
    filter: blur(100px);
    animation: neural-pulse 12s infinite ease-in-out;
    filter: saturate(1.5) brightness(1.2);
}

.glass-card {
    background: rgba(255, 255, 255, 0.01);
    border: 1px solid rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(24px);
    box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.4);
}

/* Shimmer / Skeleton Loading */
@keyframes shimmer {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

.shimmer {
    background: linear-gradient(
        90deg,
        rgba(255, 255, 255, 0.02) 25%,
        rgba(255, 255, 255, 0.06) 50%,
        rgba(255, 255, 255, 0.02) 75%
    );
    background-size: 200% 100%;
    animation: shimmer 1.8s ease-in-out infinite;
    border-radius: 8px;
}

/* Toast Animations */
@keyframes slide-in-from-right {
    from { transform: translateX(100%); opacity: 0; }
    to { transform: translateX(0); opacity: 1; }
}

@keyframes fade-in {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes toast-progress {
    from { width: 100%; }
    to { width: 0%; }
}

.animate-in {
    animation-fill-mode: forwards;
    animation-duration: 500ms;
}

.duration-300 {
    animation-duration: 300ms;
}

.duration-500 {
    animation-duration: 500ms;
}

.duration-700 {
    animation-duration: 700ms;
}

.slide-in-from-right-full {
    animation-name: slide-in-from-right;
}

.fade-in {
    animation-name: fade-in;
}

.animate-toast-progress {
    animation: toast-progress linear forwards;
    animation-duration: inherit;
}

/* Premium UI Utilities */
.premium-progress {
    background: linear-gradient(90deg, #E8FD94 0%, #22C55E 100%);
    box-shadow: 0 0 12px rgba(232, 253, 148, 0.3);
}

.glow-primary {
    text-shadow: 0 0 10px rgba(232, 253, 148, 0.4);
}

@keyframes spin-slow {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.animate-spin-slow {
    animation: spin-slow 2s linear infinite;
}

@keyframes pulse-soft {
    0%, 100% { opacity: 1; filter: brightness(1); }
    50% { opacity: 0.8; filter: brightness(1.2); }
}

.animate-pulse-soft {
    animation: pulse-soft 2s ease-in-out infinite;
}

@keyframes pulse-slow {
    0%, 100% { opacity: 0.2; transform: scale(1); }
    50% { opacity: 0.4; transform: scale(1.05); }
}

.animate-pulse-slow {
    animation: pulse-slow 8s ease-in-out infinite;
}

@keyframes scanline {
    0% { transform: translateY(-100%); opacity: 0; }
    50% { opacity: 0.5; }
    100% { transform: translateY(100%); opacity: 0; }
}

.animate-scanline {
    animation: scanline 4s linear infinite;
}

@keyframes slide-in-from-bottom {
    from { transform: translateY(10px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

.slide-in-from-bottom-2 {
    animation-name: slide-in-from-bottom;
}

@keyframes slide-in-from-right {
    from { transform: translateX(20px); opacity: 0; }
    to { transform: translateX(0); opacity: 1; }
}

.slide-in-from-right-4 {
    animation-name: slide-in-from-right;
}

@keyframes slide-in-from-top {
    from { transform: translateY(-10px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

.slide-in-from-top-2 {
    animation-name: slide-in-from-top;
}

@keyframes slide-in-from-bottom-4 {
    from { transform: translateY(16px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

.slide-in-from-bottom-4 {
    animation-name: slide-in-from-bottom-4;
}

@keyframes zoom-in-95 {
    from { transform: scale(0.95); opacity: 0; }
    to { transform: scale(1); opacity: 1; }
}

.zoom-in-95 {
    animation-name: zoom-in-95;
}