/* Plain-CSS layer: only the bits that are not worth expressing as utilities
   (scrollbars, keyframes, [hidden] hard-override) plus a tiny pre-Tailwind
   fallback so the page never flashes unstyled while the CDN loads. */

:root {
  color-scheme: dark light;
  /* Dark is the default; light only applies on an explicit opt-in. */
  --fallback-bg: #262624;
  --fallback-fg: #f5f4ee;
}
[data-theme="light"] {
  --fallback-bg: #f0eee6;
  --fallback-fg: #1f1e1c;
}

body {
  margin: 0;
  background: var(--fallback-bg);
  color: var(--fallback-fg);
  font-family: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

/* Utility classes must never beat an explicit hidden attribute. */
[hidden] { display: none !important; }

/* Scrollbars */
* {
  scrollbar-width: thin;
  scrollbar-color: var(--c-line-strong, #999) transparent;
}
*::-webkit-scrollbar { width: 10px; height: 10px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb {
  background-color: var(--c-line-strong, #999);
  border-radius: 999px;
  border: 2px solid transparent;
  background-clip: content-box;
}
*::-webkit-scrollbar-thumb:hover { background-color: var(--c-fg-muted, #666); }
*::-webkit-scrollbar-corner { background: transparent; }

/* Animations used by JS-rendered nodes */
@keyframes spin-cw { to { transform: rotate(360deg); } }
.is-spinning { animation: spin-cw .9s linear infinite; }

@keyframes rise-in {
  from { opacity: 0; transform: translateY(6px) scale(.98); }
  to   { opacity: 1; transform: none; }
}
.anim-rise { animation: rise-in .18s ease-out both; }

@keyframes toast-in {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: none; }
}
.anim-toast { animation: toast-in .2s cubic-bezier(.2, .8, .3, 1) both; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}