/* V5.0.58 unified mobile framework. Desktop remains untouched. */
@media (max-width: 820px) {
  html.xls-mobile-ui-v558 {
    --m558-page-x: 12px;
    --m558-header-h: 62px;
    --m558-control-h: 44px;
    --m558-tabbar-h: 72px;
    --m558-bg: #f4f7fb;
    --m558-surface: #ffffff;
    --m558-text: #17324f;
    --m558-muted: #6f8298;
    --m558-line: #dce6f0;
    --m558-blue: #2574df;
    --m558-blue-soft: #eaf3ff;
    width: 100%;
    overflow-x: hidden;
    color-scheme: light;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    scroll-padding-bottom: calc(var(--m558-tabbar-h) + 24px + env(safe-area-inset-bottom, 0px));
  }

  html.xls-mobile-ui-v558 *,
  html.xls-mobile-ui-v558 *::before,
  html.xls-mobile-ui-v558 *::after { box-sizing: border-box; }

  html.xls-mobile-ui-v558 body {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 100vh !important;
    min-height: 100svh !important;
    margin: 0 !important;
    overflow-x: hidden !important;
    background-color: var(--m558-bg) !important;
    color: var(--m558-text) !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: none;
  }

  html.xls-mobile-ui-v558 body.xls-v558-has-tabbar {
    padding-bottom: calc(var(--m558-tabbar-h) + 24px + env(safe-area-inset-bottom, 0px)) !important;
  }

  html.xls-mobile-ui-v558 body.xls-v558-exam,
  html.xls-mobile-ui-v558 body.mock-exam-mode,
  html.xls-mobile-ui-v558 body.mock-exam-page {
    padding-bottom: calc(18px + env(safe-area-inset-bottom, 0px)) !important;
  }

  html.xls-mobile-ui-v558 img,
  html.xls-mobile-ui-v558 video,
  html.xls-mobile-ui-v558 canvas { max-width: 100%; }

  html.xls-mobile-ui-v558 a,
  html.xls-mobile-ui-v558 button,
  html.xls-mobile-ui-v558 input,
  html.xls-mobile-ui-v558 select,
  html.xls-mobile-ui-v558 textarea {
    -webkit-tap-highlight-color: transparent;
  }

  html.xls-mobile-ui-v558 button,
  html.xls-mobile-ui-v558 [role="button"],
  html.xls-mobile-ui-v558 .btn,
  html.xls-mobile-ui-v558 [class$="-btn"],
  html.xls-mobile-ui-v558 [class*="-btn "],
  html.xls-mobile-ui-v558 .pill,
  html.xls-mobile-ui-v558 .tab-button,
  html.xls-mobile-ui-v558 .nav-button {
    min-height: var(--m558-control-h) !important;
    touch-action: manipulation;
  }

  html.xls-mobile-ui-v558 input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
  html.xls-mobile-ui-v558 select {
    min-height: var(--m558-control-h) !important;
    max-width: 100% !important;
    min-width: 0 !important;
    font-size: 16px !important;
  }

  html.xls-mobile-ui-v558 textarea {
    max-width: 100% !important;
    min-width: 0 !important;
    font-size: 16px !important;
  }

  html.xls-mobile-ui-v558 label:has(> input[type="checkbox"]),
  html.xls-mobile-ui-v558 label:has(> input[type="radio"]),
  html.xls-mobile-ui-v558 label:has(input[type="checkbox"]),
  html.xls-mobile-ui-v558 label:has(input[type="radio"]) {
    min-height: var(--m558-control-h);
    touch-action: manipulation;
  }

  /* Header owner: avatar, nearby title and menu share one vertical center. */
  html.xls-mobile-ui-v558 body.xls-v430-header-owner [data-xls-header-ready="v430"] {
    width: calc(100% - (var(--m558-page-x) * 2)) !important;
    max-width: 680px !important;
    min-height: var(--m558-header-h) !important;
    height: var(--m558-header-h) !important;
    margin: max(8px, env(safe-area-inset-top, 0px)) auto 12px !important;
    padding: 8px 9px !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    overflow: hidden !important;
    border: 1px solid rgba(211, 224, 239, .98) !important;
    border-radius: 18px !important;
    background: rgba(255, 255, 255, .97) !important;
    box-shadow: 0 6px 20px rgba(36, 66, 101, .08) !important;
    -webkit-backdrop-filter: blur(16px) saturate(145%);
    backdrop-filter: blur(16px) saturate(145%);
  }

  html.xls-mobile-ui-v558 body.xls-v430-header-owner [data-xls-header-ready="v430"] > .brand,
  html.xls-mobile-ui-v558 body.xls-v430-header-owner [data-xls-header-ready="v430"] > .profile-brand,
  html.xls-mobile-ui-v558 body.xls-v430-header-owner [data-xls-header-ready="v430"] > .zsb-brand,
  html.xls-mobile-ui-v558 body.xls-v430-header-owner [data-xls-header-ready="v430"] > .xls-brand,
  html.xls-mobile-ui-v558 body.xls-v430-header-owner [data-xls-header-ready="v430"] > .ai-records-brand {
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 9px !important;
    overflow: hidden !important;
  }

  html.xls-mobile-ui-v558 body.xls-v430-header-owner [data-xls-header-ready="v430"] .xls-v430-logo-box {
    flex: 0 0 36px !important;
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    min-height: 36px !important;
    margin: 0 !important;
    padding: 0 !important;
    align-self: center !important;
    border-radius: 12px !important;
  }

  html.xls-mobile-ui-v558 body.xls-v430-header-owner [data-xls-header-ready="v430"] .xls-v430-mobile-title {
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: calc(100vw - 128px) !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    align-self: center !important;
    display: block !important;
    color: #143758 !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
    text-align: left !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    transform: none !important;
  }

  html.xls-mobile-ui-v558 body.xls-v430-header-owner [data-xls-header-ready="v430"] > .xls-mobile-fixed-menu-slot {
    flex: 0 0 44px !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: grid !important;
    place-items: center !important;
    align-self: center !important;
    position: static !important;
  }

  html.xls-mobile-ui-v558 body #xlsMobileAppMenuBtnV424 {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    max-width: 44px !important;
    max-height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 14px !important;
    display: grid !important;
    place-items: center !important;
  }

  /* One bottom navigation geometry across the whole site. */
  html.xls-mobile-ui-v558 body #xlsMobileTabbarV439,
  html.xls-mobile-ui-v558 body .mobile-bottom-nav[data-v558-legacy-owner="1"] {
    position: fixed !important;
    z-index: 2147483000 !important;
    left: max(10px, env(safe-area-inset-left, 0px)) !important;
    right: max(10px, env(safe-area-inset-right, 0px)) !important;
    bottom: calc(8px + env(safe-area-inset-bottom, 0px)) !important;
    width: auto !important;
    max-width: 656px !important;
    height: var(--m558-tabbar-h) !important;
    min-height: var(--m558-tabbar-h) !important;
    margin: 0 auto !important;
    padding: 7px !important;
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 4px !important;
    overflow: hidden !important;
    border: 1px solid rgba(211, 224, 239, .98) !important;
    border-radius: 22px !important;
    background: rgba(255, 255, 255, .97) !important;
    box-shadow: 0 14px 38px rgba(32, 61, 96, .17) !important;
    -webkit-backdrop-filter: blur(18px) saturate(150%);
    backdrop-filter: blur(18px) saturate(150%);
  }

  html.xls-mobile-ui-v558 body #xlsMobileTabbarV439 a,
  html.xls-mobile-ui-v558 body .mobile-bottom-nav[data-v558-legacy-owner="1"] a {
    width: 100% !important;
    min-width: 0 !important;
    height: 56px !important;
    min-height: 56px !important;
    margin: 0 !important;
    padding: 5px 2px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    border-radius: 15px !important;
    color: #708399 !important;
    font-size: 10.5px !important;
    line-height: 1 !important;
    font-weight: 750 !important;
    text-decoration: none !important;
    touch-action: manipulation;
  }

  html.xls-mobile-ui-v558 body #xlsMobileTabbarV439 a.is-active,
  html.xls-mobile-ui-v558 body #xlsMobileTabbarV439 a.active,
  html.xls-mobile-ui-v558 body .mobile-bottom-nav[data-v558-legacy-owner="1"] a.is-active,
  html.xls-mobile-ui-v558 body .mobile-bottom-nav[data-v558-legacy-owner="1"] a.active {
    background: var(--m558-blue-soft) !important;
    color: var(--m558-blue) !important;
  }

  html.xls-mobile-ui-v558 body #xlsMobileTabbarV439 svg,
  html.xls-mobile-ui-v558 body .mobile-bottom-nav[data-v558-legacy-owner="1"] svg {
    width: 21px !important;
    height: 21px !important;
    max-width: 21px !important;
    max-height: 21px !important;
    display: block !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 2 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
  }

  html.xls-mobile-ui-v558 body .mobile-bottom-nav[data-v558-superseded="1"] { display: none !important; }
  html.xls-mobile-ui-v558 body.xls-v558-exam #xlsMobileTabbarV439,
  html.xls-mobile-ui-v558 body.mock-exam-mode #xlsMobileTabbarV439,
  html.xls-mobile-ui-v558 body.mock-exam-page #xlsMobileTabbarV439 { display: none !important; }

  /* Profile foundation: stable hero, tabs, cards and modal. */
  html.xls-mobile-ui-v558 body.profile-page .profile-app-v539 {
    width: 100% !important;
    max-width: 680px !important;
    min-width: 0 !important;
    margin: 0 auto !important;
    padding-left: var(--m558-page-x) !important;
    padding-right: var(--m558-page-x) !important;
  }

  html.xls-mobile-ui-v558 body.profile-page .profile-mobile-hero {
    width: 100% !important;
    min-width: 0 !important;
    display: grid !important;
    grid-template-columns: 52px minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 0 0 12px !important;
    padding: 13px !important;
    border: 1px solid var(--m558-line) !important;
    border-radius: 18px !important;
    background: var(--m558-surface) !important;
    box-shadow: 0 7px 22px rgba(38, 66, 99, .07) !important;
  }

  html.xls-mobile-ui-v558 body.profile-page .mobile-avatar-button {
    width: 52px !important;
    height: 52px !important;
    min-width: 52px !important;
    min-height: 52px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 15px !important;
    overflow: hidden !important;
  }

  html.xls-mobile-ui-v558 body.profile-page .profile-mobile-hero h1,
  html.xls-mobile-ui-v558 body.profile-page .profile-mobile-hero p { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  html.xls-mobile-ui-v558 body.profile-page .profile-mobile-hero h1 { margin: 2px 0 !important; font-size: 17px !important; line-height: 1.25 !important; }
  html.xls-mobile-ui-v558 body.profile-page .profile-mobile-hero p,
  html.xls-mobile-ui-v558 body.profile-page .mobile-hello { font-size: 11px !important; line-height: 1.35 !important; }

  html.xls-mobile-ui-v558 body.profile-page .profile-mobile-nav {
    position: relative !important;
    inset: auto !important;
    z-index: 30 !important;
    width: 100% !important;
    min-width: 0 !important;
    transform: none !important;
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 4px !important;
    margin: 0 0 16px !important;
    padding: 5px !important;
    border: 1px solid var(--m558-line) !important;
    border-radius: 16px !important;
    background: #edf2f7 !important;
    box-shadow: none !important;
    isolation: isolate;
    pointer-events: auto !important;
  }

  html.xls-mobile-ui-v558 body.profile-page .profile-mobile-nav button {
    width: 100% !important;
    min-width: 0 !important;
    height: 48px !important;
    min-height: 48px !important;
    margin: 0 !important;
    padding: 0 5px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 0 !important;
    border-radius: 12px !important;
    background: transparent !important;
    color: #667b91 !important;
    box-shadow: none !important;
    cursor: pointer !important;
    pointer-events: auto !important;
    touch-action: manipulation !important;
  }

  html.xls-mobile-ui-v558 body.profile-page .profile-mobile-nav button > span { display: none !important; }
  html.xls-mobile-ui-v558 body.profile-page .profile-mobile-nav button strong { font-size: 12px !important; line-height: 1 !important; font-weight: 800 !important; }
  html.xls-mobile-ui-v558 body.profile-page .profile-mobile-nav button.is-active {
    background: #fff !important;
    color: var(--m558-blue) !important;
    box-shadow: 0 2px 9px rgba(38, 70, 107, .09) !important;
  }

  html.xls-mobile-ui-v558 body.profile-page [data-section-panel][hidden] { display: none !important; }
  html.xls-mobile-ui-v558 body.profile-page .overview-actions > *,
  html.xls-mobile-ui-v558 body.profile-page .modal-actions > *,
  html.xls-mobile-ui-v558 body.profile-page .form-actions > * { min-height: 44px !important; }

  html.xls-mobile-ui-v558 body.profile-page .profile-modal .modal-dialog {
    width: calc(100% - 24px) !important;
    max-width: 520px !important;
    max-height: calc(100svh - 32px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
    overflow: auto !important;
    -webkit-overflow-scrolling: touch;
    border-radius: 20px !important;
  }

  html.xls-mobile-ui-v558 body.profile-page .profile-modal .modal-close {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
  }

  html.xls-mobile-ui-v558 :focus-visible {
    outline: 3px solid rgba(37, 116, 223, .28) !important;
    outline-offset: 2px !important;
  }
}

@media (max-width: 359px) {
  html.xls-mobile-ui-v558 { --m558-page-x: 8px; }
  html.xls-mobile-ui-v558 body.xls-v430-header-owner [data-xls-header-ready="v430"] { gap: 7px !important; padding-left: 8px !important; padding-right: 8px !important; }
  html.xls-mobile-ui-v558 body.xls-v430-header-owner [data-xls-header-ready="v430"] > .brand,
  html.xls-mobile-ui-v558 body.xls-v430-header-owner [data-xls-header-ready="v430"] > .profile-brand { gap: 7px !important; }
  html.xls-mobile-ui-v558 body.xls-v430-header-owner [data-xls-header-ready="v430"] .xls-v430-mobile-title { max-width: calc(100vw - 118px) !important; font-size: 15px !important; }
  html.xls-mobile-ui-v558 body.profile-page .profile-mobile-hero { grid-template-columns: 48px minmax(0, 1fr) !important; }
  html.xls-mobile-ui-v558 body.profile-page .mobile-avatar-button { width: 48px !important; height: 48px !important; min-width: 48px !important; min-height: 48px !important; }
  html.xls-mobile-ui-v558 body.profile-page .mobile-hero-actions { display: none !important; }
}

@media (prefers-reduced-motion: reduce) {
  html.xls-mobile-ui-v558 *,
  html.xls-mobile-ui-v558 *::before,
  html.xls-mobile-ui-v558 *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}