/**
 * Innova Hub UI overlay — modal snap-open + tap/focus rings.
 * Link LAST. Does not touch card grid, 2-col layout, or Show Cam chrome.
 */

/* —— 1. App description modal: feel instant (≤120ms) ——
   Cause: dialog 300ms + 18–28px travel, backdrop 280ms,
   section stagger 80ms + i×50ms then 420ms fade, hero zoom 700ms.
   JS still double-rAF (~32ms) before .is-open; keep CSS ~90ms. */
.app-modal-backdrop {
  transition: opacity 0.09s ease !important;
}

.app-modal-dialog {
  transform: translateY(3px) scale(0.997);
  transition:
    opacity 0.09s ease,
    transform 0.09s ease !important;
}

.app-modal.is-open .app-modal-dialog {
  opacity: 1;
  transform: translateY(0) scale(1);
}

@media (max-width: 560px) {
  .app-modal-dialog {
    transform: translateY(4px) scale(1);
  }
  .app-modal.is-open .app-modal-dialog {
    transform: translateY(0);
  }
}

.modal-stage::before {
  transform: none !important;
  transition: none !important;
}

.modal-reveal,
.app-modal.is-open .modal-reveal {
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
}

/* —— 2. Kill rectangular blue tap/focus; brand cherry ring follows radius —— */
html,
body,
a,
button,
[role="button"],
summary,
.card-hit,
.hub-gate,
.btn-abrir,
.btn-sitio,
.chip-link,
.modal-btn,
.app-modal-close,
.social-pill,
.hub-foot-install,
.hub-viewer-back,
.catalog-pick-card {
  -webkit-tap-highlight-color: transparent;
}

button::-moz-focus-inner {
  border: 0;
}

.card-hit {
  border-radius: inherit;
}

:is(
  a,
  button,
  [role="button"],
  .card-hit,
  .hub-gate,
  .btn-abrir,
  .btn-sitio,
  .chip-link,
  .modal-btn,
  .app-modal-close,
  .social-pill,
  .hub-foot-install,
  .hub-viewer-back,
  .catalog-pick-card
):focus {
  outline: none;
}

:is(
  a,
  button,
  [role="button"],
  .card-hit,
  .hub-gate,
  .btn-abrir,
  .btn-sitio,
  .chip-link,
  .modal-btn,
  .modal-btn-primary,
  .modal-btn-secondary,
  .app-modal-close,
  .social-pill,
  .hub-foot-install,
  .hub-viewer-back,
  .catalog-pick-card
):focus-visible:not(.showcam-mini-cta):not(.showcam-mini-app) {
  outline: none !important;
  /* Ink inner + soft cherry outer; box-shadow follows each control's radius
     (999px pills stay round, 12–14px cards/buttons stay theirs). */
  box-shadow:
    0 0 0 2px #070a10,
    0 0 0 4px rgba(220, 78, 78, 0.72) !important;
}

.card:has(.card-hit:focus-visible) {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    0 0 0 2px #070a10,
    0 0 0 4px rgba(220, 78, 78, 0.72) !important;
}