/* ════════════════════════════════════════════════════════════════════
   ATP — Accessibility layer (loaded after atp-styles.css)
   Focus rings, skip link, reduced motion, touch behavior.
   Keeps the approved visual design untouched for mouse/touch users.
   ════════════════════════════════════════════════════════════════════ */

/* ── Keyboard focus: lime ring, only via :focus-visible (never on mouse click) */
:focus-visible {
  outline: 2px solid var(--accent, #e3fc53);
  outline-offset: 3px;
  border-radius: 2px;
}
/* Dark ring on light/lime surfaces so the ring stays visible */
.on-paper :focus-visible,
.cta :focus-visible,
[data-screen-label]:not([data-screen-label="01 Home"]) main :focus-visible {
  outline-color: #0a0a0a;
}
/* Dark overlays keep the lime ring */
.menu-overlay :focus-visible,
.search-overlay :focus-visible,
.form-overlay :focus-visible,
.lang-overlay :focus-visible,
.cb-panel :focus-visible,
.stats-band :focus-visible,
footer :focus-visible {
  outline-color: var(--accent, #e3fc53);
}

/* ── Skip link: hidden until focused */
.skip-link {
  position: fixed;
  left: 24px;
  top: -64px;
  z-index: 1000;
  background: var(--accent, #e3fc53);
  color: #0a0a0a;
  font-family: "Montserrat", system-ui, sans-serif;
  font-weight: 700;
  font-size: 14px;
  padding: 12px 20px;
  text-decoration: none;
  transition: top 0.15s ease;
}
.skip-link:focus {
  top: 16px;
}

/* ── Faster taps / no double-tap zoom ambiguity on interactive elements */
a, button, [role="button"], input, select, textarea, summary {
  touch-action: manipulation;
}

/* ── Reduced motion: stop continuous + entrance animations */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  .gear-spin,
  .cb-gear-carrier,
  .cb-launcher-pulse,
  .pulse {
    animation: none !important;
  }
  /* Reveal content immediately instead of fading in */
  .reveal {
    opacity: 1 !important;
    transform: none !important;
  }
}
