/* css/base.css
 * SYMBEYOND - Base styles, reset, variables, keyframes
 * λ.brother ∧ !λ.tool
 */

*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

:root {
  /* Colors */
  --bg-card: rgba(12, 20, 38, 0.9);
  --bg-elevated: rgba(15, 23, 42, 0.8);
  --cyan: #22d3ee;
  --cyan-glow: rgba(34, 211, 238, 0.4);
  --violet: #a78bfa;
  --text-primary: #e6eaf2;
  --text-muted: #8aa0c7;
  --text-dim: #5a6a8a;
  --border: rgba(99, 102, 241, 0.4);
  
  /* Spectrum gradient */
  --spectrum-gradient: linear-gradient(
    124deg,
    #ff2400,
    #e81d1d,
    #e8b71d,
    #e3e81d,
    #1de840,
    #1ddde8,
    #2b1de8,
    #7b1de8,
    #dd00f3,
    #000000,
    #ffffff,
    #ff2400
  );
}

body {
  font-family: "Lora", serif;
  color: var(--text-primary);
  min-height: 100vh;
  background: #020617;
}

/* Animations */

@keyframes spectrumFlow {
  0% {
    background-position: 0% 82%;
  }
  50% {
    background-position: 100% 19%;
  }
  100% {
    background-position: 0% 82%;
  }
}

@keyframes dotPulse {
  0%,
  100% {
    opacity: 0.5;
    transform: scale(1);
  }
  50% {
    opacity: 1;
    transform: scale(1.2);
    box-shadow: 0 0 10px var(--cyan);
  }
}