:root {
  --color-text: #2b2b2d;
  --color-accent: #6b1f2a;
  --color-accent-2: #6b1f2a;
  --color-divider: color-mix(in srgb, #2b2b2d 16%, transparent);
  --color-accent-100: oklch(96% 0.014 15);
  --color-accent-200: oklch(90% 0.035 15);
  --color-accent-300: oklch(80% 0.065 15);
  --color-accent-400: oklch(64% 0.1 15);
  --color-accent-500: #6b1f2a;
  --color-accent-600: oklch(31% 0.1 15);
  --color-accent-700: oklch(27% 0.09 15);
  --color-accent-800: oklch(23% 0.07 15);
  --color-accent-900: oklch(20% 0.04 15);
  --color-accent-2-100: oklch(96% 0.014 15);
  --color-accent-2-200: oklch(90% 0.035 15);
  --color-accent-2-300: oklch(80% 0.065 15);
  --color-accent-2-400: oklch(64% 0.1 15);
  --color-accent-2-500: #6b1f2a;
  --color-accent-2-600: oklch(31% 0.1 15);
  --color-accent-2-700: oklch(27% 0.09 15);
  --color-accent-2-800: oklch(23% 0.07 15);
  --color-accent-2-900: oklch(20% 0.04 15);
}
html { scroll-behavior: smooth; }
body { margin: 0; text-wrap: pretty; background: var(--color-bg); }
a { color: var(--color-accent-700); }
a:hover { color: var(--color-accent-900); }
@keyframes seoSpin { to { transform: rotate(360deg); } }
@keyframes seoFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
@media (prefers-reduced-motion: reduce) { [data-anim] { animation: none !important; } }
