:root {
  --background: 0 0% 100%;
  --foreground: 240 10% 3.9%;
  --card: 0 0% 100%;
  --border: 240 5.9% 90%;
  --muted: 240 4.8% 95.9%;
  --muted-foreground: 240 3.8% 46.1%;
  --primary: 240 5.9% 10%;
  --primary-foreground: 0 0% 98%;
}

.dark {
  --background: 240 10% 3.9%;
  --foreground: 0 0% 98%;
  --card: 240 10% 3.9%;
  --border: 240 3.7% 15.9%;
  --muted: 240 3.7% 15.9%;
  --muted-foreground: 240 5% 64.9%;
  --primary: 0 0% 98%;
  --primary-foreground: 240 5.9% 10%;
}

.logo-font {
  font-family: 'Fuggles', cursive;
}

.no-highlight {
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  user-select: none;
}

html { scroll-behavior: smooth; }

.gradient-text {
  background: linear-gradient(to right, hsl(var(--primary)), hsl(var(--muted-foreground)));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

::-webkit-scrollbar { width: 0; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: hsl(var(--border)); border-radius: 999px; }

/* Prose content for blog posts */
.prose-content h2 { font-size: 1.5rem; font-weight: 700; margin-top: 2rem; margin-bottom: 0.75rem; }
.prose-content h3 { font-size: 1.25rem; font-weight: 700; margin-top: 1.5rem; margin-bottom: 0.5rem; }
.prose-content p { margin-bottom: 1rem; line-height: 1.75; color: hsl(var(--foreground)); }
.prose-content a { color: hsl(var(--primary)); text-decoration: underline; text-underline-offset: 3px; }
.prose-content ul, .prose-content ol { margin: 0 0 1rem 1.5rem; }
.prose-content ul { list-style: disc; }
.prose-content ol { list-style: decimal; }
.prose-content li { margin-bottom: 0.35rem; line-height: 1.7; }
.prose-content blockquote { border-left: 3px solid hsl(var(--border)); padding-left: 1rem; margin: 1rem 0; color: hsl(var(--muted-foreground)); font-style: italic; }
.prose-content img { border-radius: 0.5rem; margin: 1.25rem 0; max-width: 100%; }
.prose-content hr { border-color: hsl(var(--border)); margin: 2rem 0; }
.prose-content code { background: hsl(var(--muted)); padding: 0.15rem 0.4rem; border-radius: 0.3rem; font-size: 0.875em; }
.prose-content pre.code-block { background: #1e1e1e; border-radius: 0.5rem; padding: 1rem; overflow-x: auto; margin: 1.25rem 0; }
.prose-content pre.code-block code { background: none; padding: 0; font-size: 0.85rem; }
.katex-block { overflow-x: auto; padding: 0.5rem 0; }

.animate-fade-in { animation: fadeIn 0.5s ease-out; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }

/* Masonry-style grids (CSS columns approximate the original's JS masonry) */
.masonry { column-count: 1; column-gap: 1rem; }
@media (min-width: 640px) { .masonry { column-count: 2; } }
@media (min-width: 1024px) { .masonry-3 { column-count: 3; } }
.masonry > * { break-inside: avoid; margin-bottom: 1rem; display: inline-block; width: 100%; }

/* Search command palette */
#search-dialog { background: rgba(0,0,0,0.5); }
#search-dialog .search-panel { background: hsl(var(--background)); }

/* Table of contents */
#toc-container { max-height: calc(100vh - 8rem); overflow-y: auto; }

/* Sticky bar */
#sticky-bar { transition: opacity 0.3s; }