/* Phuoc Hung OJ - canonical Navbar geometry (Phase 8.51.91)
   --------------------------------------------------------------------------
   This file is the sole runtime owner of Navbar dimensions. Slot placement,
   color, sprites and text effects remain configurable elsewhere; geometry is
   deliberately deterministic so route changes, scrollbars, active states and
   asynchronous fonts cannot move the navigation horizontally. */

html.ph85190-navbar-layout-manager {
  --ph85191-navbar-height: 60px;
  --ph85191-ticker-height: 30px;
  --ph85191-secondary-width: 265px;
  --ph85191-logo-slot-width: 96px;
  --ph85191-primary-slot-width: 128px;
  scrollbar-gutter: stable;
}

html.ph85190-navbar-layout-manager.ph84953-nav-guest {
  --ph85191-secondary-width: 315px;
}

html.ph85190-navbar-layout-manager body .nav.ph84944-nav > .row {
  box-sizing: border-box !important;
  width: calc(100% - 32px) !important;
  max-width: 1280px !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

html.ph85190-navbar-layout-manager body .nav.ph84944-nav > .row > .columns {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) var(--ph85191-secondary-width) !important;
  align-items: stretch !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  height: var(--ph85191-navbar-height) !important;
  padding: 0 15px !important;
}

html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph84944-nav-main {
  display: flex !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  height: var(--ph85191-navbar-height) !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph84944-nav-secondary {
  position: relative !important;
  z-index: 6 !important;
  display: flex !important;
  flex: 0 0 var(--ph85191-secondary-width) !important;
  box-sizing: border-box !important;
  width: var(--ph85191-secondary-width) !important;
  min-width: var(--ph85191-secondary-width) !important;
  max-width: var(--ph85191-secondary-width) !important;
  height: var(--ph85191-navbar-height) !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: #fff !important;
  isolation: isolate !important;
}

html.theme--dark.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph84944-nav-secondary {
  background: #132238 !important;
}

html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph8519-primary-candidate[data-ph-default-placement="more"] {
  display: none !important;
}

html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph8519-primary-candidate[data-ph-default-placement="primary"] {
  display: flex !important;
}

html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph84944-more-panel .ph8519-more-candidate[data-ph-default-placement="primary"] {
  display: none !important;
}

html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph84944-more-panel .ph8519-more-candidate[data-ph-default-placement="more"] {
  display: flex !important;
}

html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph84944-more-panel .ph8519-more-group-empty {
  display: none !important;
}

html.ph85190-navbar-layout-manager body .ph8508-navbar-ticker {
  position: sticky !important;
  z-index: 10000 !important;
  top: var(--ph85191-navbar-height) !important;
  box-sizing: border-box !important;
  height: var(--ph85191-ticker-height) !important;
  min-height: var(--ph85191-ticker-height) !important;
  max-height: var(--ph85191-ticker-height) !important;
  margin: 0 !important;
  clear: both !important;
  transform: none !important;
}

@media (min-width: 601px) {
  html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph84944-nav-main > .ph84953-nav-logo {
    display: flex !important;
    flex: 0 0 var(--ph85191-logo-slot-width) !important;
    width: var(--ph85191-logo-slot-width) !important;
    min-width: var(--ph85191-logo-slot-width) !important;
    max-width: var(--ph85191-logo-slot-width) !important;
    order: 0 !important;
  }

  html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph84944-nav-main > .nav__list-item.ph8519-primary-candidate.ph8519-primary-candidate {
    flex: 0 0 var(--ph85191-primary-slot-width) !important;
    width: var(--ph85191-primary-slot-width) !important;
    min-width: var(--ph85191-primary-slot-width) !important;
    max-width: var(--ph85191-primary-slot-width) !important;
    contain: layout style !important;
  }

  html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph84944-nav-main > .ph84953-nav-more {
    order: 1000 !important;
  }

  html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph84944-nav-main > .ph8519-primary-candidate > .ph8500-nav-primary {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 34px minmax(0, 1fr) !important;
    grid-template-rows: 1fr !important;
    gap: 6px !important;
    align-items: center !important;
    justify-items: start !important;
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    height: var(--ph85191-navbar-height) !important;
    margin: 0 !important;
    padding: 0 8px !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1.14 !important;
    text-align: left !important;
    transform: none !important;
    transition-property: color, background-color, box-shadow, opacity, filter !important;
  }

  html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph84944-nav-main > .ph8519-primary-candidate > .ph8500-nav-primary::after {
    position: absolute !important;
    right: 8px !important;
    bottom: 0 !important;
    left: 8px !important;
    height: 3px !important;
    border-radius: 3px 3px 0 0 !important;
    background: transparent !important;
    content: "" !important;
    pointer-events: none !important;
  }

  html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph84944-nav-main > .ph8519-primary-candidate > .ph8500-nav-primary.nav--active::after,
  html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph84944-nav-main > .ph8519-primary-candidate > .ph8500-nav-primary[aria-current="page"]::after {
    background: currentColor !important;
  }

  html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph84944-nav-main .ph8500-nav-primary > .ph8500-nav-icon {
    grid-column: 1 !important;
    grid-row: 1 !important;
    justify-self: center !important;
    flex: 0 0 32px !important;
    box-sizing: border-box !important;
    width: 32px !important;
    min-width: 32px !important;
    max-width: 32px !important;
    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    margin: 0 !important;
    pointer-events: none !important;
  }

  html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph84944-nav-main .ph8500-nav-primary > .ph8500-nav-copy {
    grid-column: 2 !important;
    grid-row: 1 !important;
    align-self: center !important;
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    overflow: hidden !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1.14 !important;
    text-align: left !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    pointer-events: none !important;
  }

  html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph84944-nav-main .ph8500-nav-primary > .ph8500-more-caret {
    position: absolute !important;
    top: 50% !important;
    right: 5px !important;
    bottom: auto !important;
    width: 12px !important;
    min-width: 12px !important;
    transform: translateY(-50%) !important;
    pointer-events: none !important;
  }

  html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph84944-nav-secondary > .nav__list-item[data-dropdown-target="#menu-nav-domain"] {
    display: none !important;
  }

  html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph84944-nav-secondary > .nav__list-item[data-dropdown-target="#menu-ph-language"] {
    flex: 0 0 113px !important;
    width: 113px !important;
    min-width: 113px !important;
    max-width: 113px !important;
  }

  html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph84944-nav-secondary > .nav__list-item[data-dropdown-target="#menu-nav-user"] {
    flex: 0 0 152px !important;
    width: 152px !important;
    min-width: 152px !important;
    max-width: 152px !important;
  }

  html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph84944-nav-secondary > .nav__list-item[data-dropdown-target="#menu-nav-user"] > .nav__item {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 16px !important;
    gap: 5px !important;
    align-items: center !important;
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    padding: 0 10px !important;
    overflow: hidden !important;
  }

  html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph84944-nav-secondary [data-ph84962-nickname-text] {
    display: block !important;
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }
}

@media (min-width: 1241px) {
  html.ph85190-navbar-layout-manager {
    --ph85191-logo-slot-width: 96px;
    --ph85191-primary-slot-width: 128px;
  }

  html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph84944-nav-main > .ph84953-nav-logo .nav__logo {
    width: 90px !important;
    min-width: 90px !important;
    max-width: 90px !important;
  }
}

@media (min-width: 1161px) and (max-width: 1240px) {
  html.ph85190-navbar-layout-manager {
    --ph85191-logo-slot-width: 72px;
    --ph85191-primary-slot-width: 118px;
  }

  html.ph85190-navbar-layout-manager.ph84953-nav-guest {
    --ph85191-primary-slot-width: 115px;
  }
}

@media (min-width: 1101px) and (max-width: 1160px) {
  html.ph85190-navbar-layout-manager {
    --ph85191-logo-slot-width: 72px;
    --ph85191-primary-slot-width: 112px;
  }

  html.ph85190-navbar-layout-manager.ph84953-nav-guest {
    --ph85191-primary-slot-width: 104px;
  }
}

@media (min-width: 1024px) and (max-width: 1100px) {
  html.ph85190-navbar-layout-manager {
    --ph85191-logo-slot-width: 72px;
    --ph85191-primary-slot-width: 99px;
  }

  html.ph85190-navbar-layout-manager.ph84953-nav-guest {
    --ph85191-primary-slot-width: 93px;
  }
}

@media (min-width: 901px) and (max-width: 1023px) {
  html.ph85190-navbar-layout-manager {
    --ph85191-logo-slot-width: 72px;
    --ph85191-primary-slot-width: 79px;
  }

  html.ph85190-navbar-layout-manager.ph84953-nav-guest {
    --ph85191-primary-slot-width: 71px;
  }
}

@media (min-width: 901px) and (max-width: 1240px) {
  html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph84944-nav-main > .ph84953-nav-logo .nav__logo {
    width: 66px !important;
    min-width: 66px !important;
    max-width: 66px !important;
  }

  html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph84944-nav-main > .ph8519-primary-candidate > .ph8500-nav-primary {
    grid-template-columns: 30px minmax(0, 1fr) !important;
    gap: 4px !important;
    padding: 0 5px !important;
  }

  html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph84944-nav-main .ph8500-nav-primary > .ph8500-nav-icon {
    width: 30px !important;
    min-width: 30px !important;
    max-width: 30px !important;
    height: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;
  }

  html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph84944-nav-main .ph8500-nav-primary > .ph8500-nav-copy {
    display: block !important;
    max-height: 2.28em !important;
    font-size: 10.5px !important;
    line-height: 1.14 !important;
    white-space: normal !important;
  }
}

@media (min-width: 760px) and (max-width: 900px) {
  html.ph85190-navbar-layout-manager {
    --ph85191-logo-slot-width: 40px;
    --ph85191-primary-slot-width: 64px;
  }

  html.ph85190-navbar-layout-manager.ph84953-nav-guest {
    --ph85191-primary-slot-width: 55px;
  }
}

@media (min-width: 680px) and (max-width: 759px) {
  html.ph85190-navbar-layout-manager {
    --ph85191-logo-slot-width: 40px;
    --ph85191-primary-slot-width: 50px;
  }

  html.ph85190-navbar-layout-manager.ph84953-nav-guest {
    --ph85191-primary-slot-width: 42px;
  }
}

@media (min-width: 601px) and (max-width: 679px) {
  html.ph85190-navbar-layout-manager {
    --ph85191-logo-slot-width: 40px;
    --ph85191-primary-slot-width: 38px;
  }

  html.ph85190-navbar-layout-manager.ph84953-nav-guest {
    --ph85191-primary-slot-width: 29px;
  }
}

@media (min-width: 601px) and (max-width: 900px) {
  html.ph85190-navbar-layout-manager body .nav.ph84944-nav > .row > .columns {
    padding-right: 8px !important;
    padding-left: 8px !important;
  }

  html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph84944-nav-main > .ph84953-nav-logo .nav__logo {
    width: 38px !important;
    min-width: 38px !important;
    max-width: 38px !important;
  }

  html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph84944-nav-main > .ph8519-primary-candidate > .ph8500-nav-primary {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
    padding: 0 !important;
  }

  html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph84944-nav-main .ph8500-nav-primary > .ph8500-nav-icon {
    flex: 0 0 30px !important;
    width: 30px !important;
    min-width: 30px !important;
    max-width: 30px !important;
    height: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;
  }

  html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph84944-nav-main .ph8500-nav-primary > .ph8500-nav-copy,
  html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph84944-nav-main .ph8500-nav-primary > .ph8500-more-caret {
    display: none !important;
  }
}

@media (max-width: 600px) {
  html.ph85190-navbar-layout-manager {
    --ph85191-navbar-height: 56px;
    --ph85191-ticker-height: 28px;
    scrollbar-gutter: auto;
  }

  html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph84944-nav-main > .ph8519-primary-candidate[data-ph-default-placement="more"] {
    display: none !important;
  }

  html.ph85190-navbar-layout-manager body .nav.ph84944-nav .ph84944-more-panel .ph8519-more-candidate[data-ph-default-placement="primary"] {
    display: none !important;
  }
}