/* var.29 grafo74 — Modern UI Phase 14: Accessibility & Performance */
:root {
  --ui-a11y-ring: 0 0 0 4px rgba(22, 131, 141, .24);
  --ui-a11y-target: 44px;
}

.ui-skip-link {
  position: fixed;
  z-index: 100000;
  top: max(8px, env(safe-area-inset-top));
  left: max(8px, env(safe-area-inset-left));
  padding: 10px 14px;
  border-radius: 10px;
  background: #0b5960;
  color: #fff !important;
  font-weight: 700;
  text-decoration: none;
  box-shadow: 0 8px 24px rgba(0,0,0,.25);
  transform: translateY(-160%);
  transition: transform 160ms ease;
}
.ui-skip-link:focus { transform: translateY(0); }

.ui-visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 2px solid #16838d;
  outline-offset: 3px;
  box-shadow: var(--ui-a11y-ring);
}

:where(button, input[type="button"], input[type="submit"], input[type="reset"], .ui-icon-only) {
  touch-action: manipulation;
}

:where(.ui-icon-only, .topnav > a.icon) {
  min-width: var(--ui-a11y-target);
  min-height: var(--ui-a11y-target);
}

img[loading="lazy"] {
  content-visibility: auto;
}

.ui-deferred-section {
  content-visibility: auto;
  contain-intrinsic-size: auto 540px;
}

.ui-media-error {
  min-height: 72px;
  border: 1px dashed currentColor;
  opacity: .72;
}

html[data-theme="dark"] .ui-skip-link,
html.dark .ui-skip-link,
body.dark-theme .ui-skip-link {
  background: #d9f5f2;
  color: #103c40 !important;
}

@media (prefers-contrast: more) {
  :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
    outline-width: 3px;
    outline-offset: 4px;
    box-shadow: none;
  }
  :where(input, select, textarea, button) { border-width: 2px; }
}

@media (prefers-reduced-data: reduce) {
  * { background-attachment: scroll !important; }
}

@media (prefers-reduced-motion: reduce) {
  .ui-skip-link { transition: none; }
  html { scroll-behavior: auto !important; }
}

@media print {
  .ui-skip-link, .ui-live-region { display: none !important; }
  .ui-deferred-section { content-visibility: visible; contain-intrinsic-size: none; }
}
