/* espresso-panel overrides - the opinionated treatment on top of the tokens
   for the etelej.com lab-sites. Layer AFTER espresso-panel-theme.css. Each
   rule is a deliberate identity decision; page-level looks live in
   espresso-panel-page.css. */

/* Focus: the identity's plain amber ring - 2px outline with a small offset,
   as foundation.css ships it. No glow; elevation is a hairline here. */
[data-theme="espresso-panel"] :focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
  border-radius: 1px;
}

/* Selection: the accent wash, derived from tokens - never a new color. */
[data-theme="espresso-panel"] ::selection {
  background: var(--accent-soft);
}

/* Mono counts: every numeral, label and code path gets tabular figures. */
[data-theme="espresso-panel"] .tabular {
  font-variant-numeric: tabular-nums;
}

@media (prefers-reduced-motion: reduce) {
  [data-theme="espresso-panel"] *,
  [data-theme="espresso-panel"] *::before,
  [data-theme="espresso-panel"] *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}