/* Only interactive states and viewport containment; source layout lives in its captured styles. */
.replica-menu-portal { position: relative; z-index: 50; }
.replica-menu-portal .nav-menu-positioner { width: max-content; height: auto; max-width: calc(100vw - 20px); }
.replica-menu-portal .nav-menu-popup,
.replica-menu-portal [role="menu"] { max-width: calc(100vw - 20px); max-height: calc(100dvh - 24px); overflow: auto; }
.replica-menu-portal .nav-menu-content > div { max-width: calc(100vw - 22px); }
.replica-observed-dialog { position: fixed; inset: 0; width: 100vw; height: 100dvh; max-width: none; max-height: none; padding: 0; margin: 0; border: 0; background: transparent; color: inherit; overflow: auto; }
.replica-observed-dialog::backdrop { background: transparent; }
.replica-dialog-header-click::backdrop { background: rgba(0, 0, 0, .12); }
.replica-dialog-header-click .w-\[500px\] { max-width: calc(100vw - 32px); }
.replica-mobile-header [role="dialog"] { max-height: calc(100dvh - 70px); overflow-y: auto; }
.replica-preview-status { margin-top: 12px; }
@media (max-width: 520px) {
  .replica-menu-portal .nav-menu-content > div > .grid { grid-template-columns: minmax(0, 1fr) !important; }
  .replica-menu-portal .nav-menu-content .grid > .border-l { border-left: 0; padding-left: 0; }
  .replica-menu-portal .nav-menu-content .grid > div { min-width: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .replica-menu-portal * { transition-duration: 0s !important; }
}