/*
 * Pythia public visual foundation.
 *
 * This layer is intentionally additive while public_frontend.css remains the
 * compatibility entrypoint. Palette values continue to come from the existing
 * --bg/--panel/--text/--blue/... variables so Terminal and Slate retain their
 * established color mappings.
 */

:root {
  /* Protected Pythia font roles. */
  --public-font-display: "Space Grotesk", Inter, ui-sans-serif, system-ui, sans-serif;
  --public-font-body: "IBM Plex Sans", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --public-font-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Consolas, monospace;

  /* A compact spacing scale shared by narrative and utility-led pages. */
  --public-space-1: 0.25rem;
  --public-space-2: 0.5rem;
  --public-space-3: 0.75rem;
  --public-space-4: 1rem;
  --public-space-5: 1.5rem;
  --public-space-6: 2rem;
  --public-space-7: 3rem;
  --public-space-8: 4rem;
  --public-section-space: clamp(4.5rem, 9vw, 8.75rem);

  /* Layout roles preserve the existing 1180px public shell as the default. */
  --public-shell-wide: 1360px;
  --public-shell-default: 1180px;
  --public-measure: 68ch;
  --public-measure-compact: 54ch;
  --public-gutter: 20px;

  /* Shared geometry and motion. Individual surfaces may remap these locally. */
  --public-radius-sm: 6px;
  --public-radius: 8px;
  --public-radius-lg: 16px;
  --public-motion-fast: 140ms;
  --public-motion-base: 200ms;
  --public-motion-reveal: 420ms;
  --public-ease: cubic-bezier(0.2, 0.72, 0.2, 1);
  --public-focus-color: var(--cyan);
  --public-on-accent: var(--bg);
}

html.theme-slate {
  /* Slate already maps --cyan to violet; this alias documents that contract. */
  --public-focus-color: var(--cyan);
}

/* Public decorative glows and orbital accents may extend beyond their local
   section boxes; clip them at the document boundary without affecting nested
   workbench and article scrollers. */
html {
  overflow-x: clip;
}

.public-type-display {
  font-family: var(--public-font-display);
}

.public-type-body {
  font-family: var(--public-font-body);
}

.public-type-mono {
  font-family: var(--public-font-mono);
}

/* Give every new and existing interactive element a theme-aware fallback. */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 2px solid var(--public-focus-color);
  outline-offset: 3px;
}

@media (max-width: 720px) {
  :root {
    --public-gutter: 14px;
    --public-section-space: clamp(3.75rem, 16vw, 5.75rem);
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    transition-delay: 0ms !important;
  }
}