/* ============================================================
   CINDER TV — BASE LAYER
   ------------------------------------------------------------
   Element-level baseline scoped to the Cinder shell. Additive,
   low-risk polish only — it must not change layout, color, or
   spacing of existing surfaces (those migrate per phase). It owns
   cross-cutting concerns: text rendering, selection, focus, and
   the global reduced-motion guard.

   Loaded AFTER cinder-refined.css / components.css so it can set
   shell-wide defaults, but it deliberately avoids !important and
   high-specificity overrides — that fight is being retired.
   ============================================================ */

/* ── Crisper type now that real webfonts load ── */
body.cinder-site-shell.primary-bg-color {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* ── Accent-tinted selection ── */
body.cinder-site-shell.primary-bg-color ::selection {
    background: rgba(79, 140, 255, 0.30);
    color: #ffffff;
}

/* ── Anchored scrolling clears the sticky header; opt-in smooth scroll ── */
@media (prefers-reduced-motion: no-preference) {
    html {
        scroll-behavior: smooth;
    }
}
body.cinder-site-shell.primary-bg-color :target {
    scroll-margin-top: 96px;
}

/* ── Unified keyboard focus ring for interactive elements that don't
      already define one (buttons/inputs handle their own). Visible only
      for keyboard users via :focus-visible. ── */
body.cinder-site-shell.primary-bg-color a:focus-visible,
body.cinder-site-shell.primary-bg-color summary:focus-visible,
body.cinder-site-shell.primary-bg-color [tabindex]:focus-visible {
    outline: 2px solid rgba(var(--cinder-site-glow-rgb), 0.75);
    outline-offset: 2px;
    border-radius: var(--r-xs);
}

/* ── Global reduced-motion guard (belt-and-suspenders across the shell) ── */
@media (prefers-reduced-motion: reduce) {
    body.cinder-site-shell.primary-bg-color *,
    body.cinder-site-shell.primary-bg-color *::before,
    body.cinder-site-shell.primary-bg-color *::after {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
        scroll-behavior: auto !important;
    }
}