/* Long translated navigation must fit before positioning its popovers. */
@media (min-width: 901px) {
  .app-header.fintech-home-header .main-nav { flex: 1; min-width: 0; flex-wrap: wrap; gap: 0 2px; }
  .app-header.fintech-home-header .main-nav .nav-item { height: auto; min-height: 32px; min-width: 0; max-width: 100%; }
  .app-header.fintech-home-header .main-nav .nav-item > a { height: auto; min-height: 32px; white-space: normal; overflow-wrap: anywhere; }
  .app-header.fintech-home-header .header-actions { flex-shrink: 0; }
  #app .app-header.fintech-home-header { height: auto; min-height: var(--header-height, 64px); }
}
/* Short Vietnamese labels fit tablet widths without reducing the existing font size. */
@media (min-width: 961px) and (max-width: 1200px) {
  :root[lang='vi'] .app-header.fintech-home-header .main-nav { column-gap: 0; }
}
.app-header.fintech-home-header .nav-popover {
  position: fixed; left: var(--nav-menu-left, 12px); right: auto;
  top: var(--nav-menu-top, 64px); width: var(--nav-menu-width, min(340px, calc(100vw - 24px)));
  max-width: calc(100vw - 24px); max-height: var(--nav-menu-height, calc(100dvh - 80px));
  overflow-y: auto; box-sizing: border-box;
}
.app-header.fintech-home-header .popover-copy { min-width: 0; white-space: normal; overflow-wrap: anywhere; }
.app-header.fintech-home-header .popover-copy > * { white-space: normal; overflow-wrap: anywhere; }
/* The header stays in document flow, so no extra blank spacer is required. */
:root[data-design-variant='refined'] .mobile-app-shell .h5-home-tools {
  position: sticky; top: 0; z-index: 30; background: var(--design-bg);
  padding-top: env(safe-area-inset-top, 0px);
}