/* ============================================================
   LAYER 2 · base — the accessibility and motion floor.
   Not per-component contracts: the minimum every surface gets.
   ============================================================ */
*, *::before, *::after { box-sizing: border-box }

/* Links (defined even where a design has none yet, so editor-added
   links never fall back to browser blue). */
a { color: var(--accent); text-decoration: none }
a:hover { color: var(--accent-hover) }

/* --- Focus: one visible ring, on everything focusable ---
   Keyboard users get a ring; pointer users don't. Every interactive
   ep- class repeats this rule locally so a product layer that restyles
   a control cannot accidentally drop it. */
:focus-visible { outline: var(--focus-outline); outline-offset: var(--focus-offset) }
.ep-btn:focus-visible,
.ep-nav-link:focus-visible,
.ep-alert__action:focus-visible,
.ep-tooltip__trigger:focus-visible,
.ep-feature--tile:focus-visible,
.ep-product__action:focus-visible,
.ep-tab:focus-visible { outline: var(--focus-outline); outline-offset: var(--focus-offset) }

/* --- Disabled floor ---
   Anchors can't be disabled, so a "disabled" link is marked
   aria-disabled and taken out of the tab order by the component
   (tabindex="-1"); this removes its pointer affordance too. */
[aria-disabled="true"] { cursor: not-allowed }
a[aria-disabled="true"], a[aria-disabled="true"] > * { pointer-events: none }

/* Busy controls keep their label but stop inviting a second click. */
[aria-busy="true"] { cursor: progress }

/* Screen-reader-only text (icon-only buttons, live-region labels). */
.ep-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0 }

/* Skip link — visible only when focused. */
.ep-skip-link { position: absolute; left: -9999px; top: 0; z-index: 999; padding: 10px 16px; border-radius: var(--radius-btn-sm); background: var(--surface-card); color: var(--text-primary); box-shadow: var(--shadow-lg) }
.ep-skip-link:focus-visible { left: 12px; top: 12px }

/* ============================================================
   MOTION POLICY — prefers-reduced-motion.
   Decorative loops (wave, caret, softPulse) stop dead; transitions
   collapse to 0ms; shimmer and spinArc survive as STATIC states so
   loading is still legible rather than invisible.
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0ms !important; scroll-behavior: auto !important }
  /* decorative loops — off entirely */
  .ep-mock-wave__bar, .ep-mock__pulse, .ep-caret, .ep-pulse { animation: none !important }
  .ep-mock-wave__bar { height: 58% !important }
  .ep-mock__pulse, .ep-pulse { opacity: 1 !important }
  /* loading — kept, as a static state */
  .ep-skeleton { animation: none !important; background: var(--surface-sunken) !important }
  .ep-spinner { animation: none !important }
  /* the nav underline is informative, so it stays — instantly */
  .ep-nav-link:hover, .ep-nav-link--active { background-size: 100% 2px !important }
}