app/globals.css

@import "katex/dist/katex.min.css";

@tailwind base;
@tailwind components;
@tailwind utilities;

:root {
  --font-serif: "Newsreader", "IBM Plex Serif", ui-serif, Georgia, serif;
  --font-sans: "Inter", ui-sans-serif, system-ui, sans-serif;
  --font-mono: "JetBrains Mono", "IBM Plex Mono", ui-monospace, SFMono-Regular, monospace;
}

html,
body {
  background: #fafaf7;
  color: #0e0e10;
  font-family: var(--font-sans);
  font-feature-settings: "ss01", "cv11";
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* KaTeX visual fine tuning */
.katex {
  font-size: 1.05em;
}

/* Subtle selection */
::selection {
  background: #e8b53c33;
  color: #0e0e10;
}

/* Hide scrollbar in horizontal slide track */
.no-scrollbar::-webkit-scrollbar {
  display: none;
}
.no-scrollbar {
  scrollbar-width: none;
}

/* Grid paper background utility */
.bg-grid {
  background-image:
    linear-gradient(to right, rgba(14, 14, 16, 0.04) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(14, 14, 16, 0.04) 1px, transparent 1px);
  background-size: 32px 32px;
}

/* Reduced motion respect */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}