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

body {
  background: #0d0d1a;
  min-height: 100vh;
}

/* Scrollbar */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #1a1a2e; }
::-webkit-scrollbar-thumb { background: #2a2a4a; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #d4a574; }

/* Starfield canvas */
#starfield {
  width: 100vw;
  height: 100vh;
}

/* Glow effects */
.glow-text {
  text-shadow: 0 0 20px rgba(212, 165, 116, 0.5), 0 0 40px rgba(212, 165, 116, 0.2);
}

.glow-text-subtle {
  text-shadow: 0 0 10px rgba(212, 165, 116, 0.3);
}

.glow-border {
  box-shadow: 0 0 15px rgba(212, 165, 116, 0.15), inset 0 0 15px rgba(212, 165, 116, 0.05);
}

/* Pulse animation for drop zone */
@keyframes borderPulse {
  0%, 100% { border-color: rgba(212, 165, 116, 0.3); }
  50% { border-color: rgba(212, 165, 116, 0.7); }
}

.drop-zone-pulse {
  animation: borderPulse 3s ease-in-out infinite;
}

.drop-zone-pulse:hover {
  animation: none;
  border-color: rgba(212, 165, 116, 0.9);
}

/* Typewriter effect */
@keyframes typewriter {
  from { width: 0; }
  to { width: 100%; }
}

@keyframes blink {
  50% { border-color: transparent; }
}

.typewriter-line {
  overflow: hidden;
  white-space: nowrap;
  animation: typewriter 0.8s steps(40) forwards;
}

/* Fade in staggered */
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

.fade-in-up {
  animation: fadeInUp 0.6s ease-out forwards;
  opacity: 0;
}

.fade-in-up-1 { animation-delay: 0.1s; }
.fade-in-up-2 { animation-delay: 0.2s; }
.fade-in-up-3 { animation-delay: 0.3s; }
.fade-in-up-4 { animation-delay: 0.4s; }
.fade-in-up-5 { animation-delay: 0.5s; }
.fade-in-up-6 { animation-delay: 0.6s; }

/* Infinity spin */
@keyframes slowSpin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

.slow-spin {
  animation: slowSpin 20s linear infinite;
}

/* Hexagon shape */
.hexagon {
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
}

/* Image rendering */
.pixel-perfect {
  image-rendering: pixelated;
  image-rendering: -moz-crisp-edges;
  image-rendering: crisp-edges;
}

/* Tab pill */
.tab-pill {
  transition: all 0.3s ease;
}

.tab-pill:hover {
  background: rgba(212, 165, 116, 0.15);
}

.tab-pill.active {
  background: rgba(212, 165, 116, 0.2);
  border-color: #d4a574;
  color: #d4a574;
}

/* Button hover */
.btn-amber {
  transition: all 0.2s ease;
  background: rgba(212, 165, 116, 0.15);
  border: 1px solid rgba(212, 165, 116, 0.3);
  color: #d4a574;
}

.btn-amber:hover {
  background: rgba(212, 165, 116, 0.3);
  border-color: #d4a574;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(212, 165, 116, 0.2);
}

.btn-amber:active {
  transform: translateY(0);
}

/* Card background texture */
.parchment {
  background: linear-gradient(135deg, #1e1e35 0%, #16162a 50%, #1a1a30 100%);
  border: 1px solid #2a2a4a;
}

/* Progress bar shimmer */
@keyframes shimmer {
  0% { background-position: -200% center; }
  100% { background-position: 200% center; }
}

.shimmer {
  background: linear-gradient(90deg, transparent, rgba(212,165,116,0.3), transparent);
  background-size: 200% 100%;
  animation: shimmer 2s linear infinite;
}

/* Crossfade */
.crossfade-enter {
  opacity: 0;
  transition: opacity 0.4s ease;
}

.crossfade-active {
  opacity: 1;
}

/* Drop cap */
.drop-cap::first-letter {
  float: left;
  font-size: 3.5em;
  line-height: 0.8;
  margin-right: 8px;
  color: #d4a574;
  font-family: 'Crimson Pro', serif;
  font-weight: 900;
}

/* Loading hexagon spinner */
@keyframes hexSpin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.hex-spinner {
  animation: hexSpin 2s linear infinite;
}

/* Pixel grid hover */
.pixel-cell {
  transition: outline 0.1s ease;
}

.pixel-cell:hover {
  outline: 2px solid #d4a574;
  outline-offset: -1px;
  z-index: 10;
  position: relative;
}

/* Responsive */
@media (max-width: 768px) {
  .glow-text {
    text-shadow: 0 0 10px rgba(212, 165, 116, 0.4);
  }
}