/* Base styles - Global reset, typography, animations */

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

body {
  font-family: var(--font-display, 'Inter', sans-serif);
  background: var(--page-bg);
  color: var(--text-main);
  height: 100vh;
  line-height: 1.6;
  overflow: hidden;
  font-size: var(--text-base, 0.875rem);
}

/* Keyframe animations */
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

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

.skeleton {
  background: linear-gradient(90deg, var(--page-bg) 25%, var(--border-subtle) 50%, var(--page-bg) 75%);
  background-size: 200% 100%;
  animation: shimmer 1.5s infinite;
  border-radius: var(--radius);
}

/* Skip to content link for accessibility */
.skip-to-content {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 999;
  padding: 1rem;
  background: var(--primary);
  color: white;
}

.skip-to-content:focus {
  left: 0;
}

/* Noise overlay - kept but hidden by default for new design */
.noise {
  display: none;
}

/* Disabled state utility */
.disabled,
[disabled] {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

/* Empty state utility */
.empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 300px;
  color: var(--text-muted);
  text-align: center;
}

.empty-state .material-symbols-outlined {
  font-size: 4rem;
  opacity: 0.2;
  margin-bottom: 1rem;
}