/* QAME_MOBILE_APP_SHELL_V1_0_18
 * Mobile-only presentation layer for the existing QAME Laravel/Sneat UI.
 * Desktop (>= 768px) is intentionally untouched.
 */

/* Authentication/guest pages are intentionally outside the QAME mobile shell. */
html.qame-auth-guest,
html.qame-auth-guest body {
  visibility: visible !important;
  opacity: 1 !important;
}
html.qame-auth-guest .qame-mobile-topbar,
html.qame-auth-guest .qame-mobile-bottom-nav,
html.qame-auth-guest .qame-mobile-sheet-backdrop,
html.qame-auth-guest .qame-mobile-help-shell {
  display: none !important;
}

@media (max-width: 767.98px) {
  :root {
    --qame-mobile-blue: #1769e0;
    --qame-mobile-blue-dark: #0f4fae;
    --qame-mobile-sky: #eef5ff;
    --qame-mobile-bg: #f4f7fb;
    --qame-mobile-card: #ffffff;
    --qame-mobile-text: #17324d;
    --qame-mobile-muted: #7a8ca5;
    --qame-mobile-border: #e7edf5;
    --qame-mobile-shadow: 0 8px 28px rgba(37, 73, 118, .08);
    --qame-mobile-radius: 20px;
    --qame-mobile-bottom-nav-h: 76px;
  }

  html.qame-mobile-app,
  html.qame-mobile-app body {
    background: var(--qame-mobile-bg) !important;
    min-width: 0 !important;
    overflow-x: hidden !important;
  }

  html.qame-mobile-app body {
    padding-bottom: calc(var(--qame-mobile-bottom-nav-h) + env(safe-area-inset-bottom, 0px) + 12px) !important;
  }

  /* Remove only the desktop shell on phones. The original menu remains in the DOM
     so routes can be discovered without extra HTTP requests. */
  html.qame-mobile-app #layout-menu,
  html.qame-mobile-app .layout-menu,
  html.qame-mobile-app .layout-navbar.navbar-detached,
  html.qame-mobile-app .layout-navbar:not(.qame-mobile-topbar),
  html.qame-mobile-app .layout-menu-toggle,
  html.qame-mobile-app .drag-target {
    display: none !important;
  }

  html.qame-mobile-app .layout-wrapper,
  html.qame-mobile-app .layout-container,
  html.qame-mobile-app .layout-page,
  html.qame-mobile-app .content-wrapper,
  html.qame-mobile-app .container-xxl,
  html.qame-mobile-app .container-fluid {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  html.qame-mobile-app .layout-page {
    padding-left: 0 !important;
  }

  html.qame-mobile-app .content-wrapper {
    padding-top: 0 !important;
    background: var(--qame-mobile-bg) !important;
  }

  html.qame-mobile-app .container-xxl,
  html.qame-mobile-app .container-fluid,
  html.qame-mobile-app .container-p-y {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  html.qame-mobile-app .container-p-y {
    padding-top: 12px !important;
    padding-bottom: 12px !important;
  }

  .qame-mobile-topbar {
    position: sticky;
    top: 0;
    z-index: 1080;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 64px;
    padding: calc(10px + env(safe-area-inset-top, 0px)) 16px 10px;
    background: rgba(255, 255, 255, .96);
    border-bottom: 1px solid rgba(231, 237, 245, .9);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
  }

  .qame-mobile-brand {
    display: flex;
    align-items: center;
    min-width: 0;
    gap: 10px;
    text-decoration: none !important;
  }

  .qame-mobile-brand-mark {
    width: 38px;
    height: 38px;
    border-radius: 13px;
    display: grid;
    place-items: center;
    flex: 0 0 38px;
    color: #fff;
    background: linear-gradient(145deg, var(--qame-mobile-blue), #3b88ff);
    box-shadow: 0 7px 18px rgba(23, 105, 224, .22);
    font-weight: 800;
    letter-spacing: -.5px;
  }

  .qame-mobile-brand-mark.has-official-logo {
    background: transparent;
    box-shadow: none;
    border-radius: 0;
    overflow: hidden;
  }

  .qame-mobile-brand-mark .qame-mobile-official-logo {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
  }

  .qame-mobile-brand-copy {
    min-width: 0;
    line-height: 1.05;
  }

  .qame-mobile-brand-title {
    display: block;
    color: var(--qame-mobile-text);
    font-size: 14px;
    font-weight: 800;
    letter-spacing: .01em;
  }

  .qame-mobile-brand-subtitle {
    display: block;
    margin-top: 3px;
    color: var(--qame-mobile-muted);
    font-size: 10px;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 205px;
  }

  .qame-mobile-profile-btn {
    width: 40px;
    height: 40px;
    border: 0;
    border-radius: 50%;
    background: #edf4ff;
    padding: 0;
    overflow: hidden;
    display: grid;
    place-items: center;
    color: var(--qame-mobile-blue-dark);
    font-weight: 800;
    box-shadow: inset 0 0 0 1px rgba(23, 105, 224, .08);
  }

  .qame-mobile-profile-btn img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .qame-mobile-dashboard {
    margin: 14px 0 4px;
  }

  .qame-mobile-hero {
    position: relative;
    overflow: hidden;
    border-radius: 24px;
    padding: 20px 18px 18px;
    color: #fff;
    background:
      radial-gradient(circle at 86% 17%, rgba(255,255,255,.24) 0 22px, transparent 23px),
      radial-gradient(circle at 94% 32%, rgba(255,255,255,.14) 0 54px, transparent 55px),
      linear-gradient(135deg, #0c55c5 0%, #1f76ef 58%, #4b9cff 100%);
    box-shadow: 0 12px 30px rgba(27, 101, 204, .20);
  }

  .qame-mobile-hero-kicker {
    font-size: 11px;
    font-weight: 700;
    opacity: .85;
    text-transform: uppercase;
    letter-spacing: .08em;
  }

  .qame-mobile-hero h2 {
    color: #fff !important;
    margin: 5px 0 4px;
    font-size: 24px;
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: -.025em;
  }

  .qame-mobile-hero p {
    margin: 0;
    max-width: 78%;
    color: rgba(255,255,255,.86) !important;
    font-size: 12.5px;
    line-height: 1.45;
  }

  .qame-mobile-hero-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    margin-top: 16px;
    padding: 0 15px;
    border-radius: 13px;
    background: #fff;
    color: var(--qame-mobile-blue-dark) !important;
    text-decoration: none !important;
    font-size: 12.5px;
    font-weight: 800;
    box-shadow: 0 6px 14px rgba(0,0,0,.08);
  }

  .qame-mobile-section {
    margin-top: 18px;
  }

  .qame-mobile-section-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 0 2px 10px;
  }

  .qame-mobile-section-title {
    margin: 0;
    color: var(--qame-mobile-text);
    font-size: 16px;
    line-height: 1.25;
    font-weight: 800;
  }

  .qame-mobile-section-link {
    color: var(--qame-mobile-blue) !important;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none !important;
  }

  .qame-mobile-quick-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px 7px;
    padding: 16px 8px 12px;
    background: var(--qame-mobile-card);
    border: 1px solid var(--qame-mobile-border);
    border-radius: var(--qame-mobile-radius);
    box-shadow: var(--qame-mobile-shadow);
  }

  .qame-mobile-quick-item {
    appearance: none;
    border: 0;
    background: transparent;
    min-width: 0;
    padding: 0 2px;
    text-align: center;
    text-decoration: none !important;
    color: var(--qame-mobile-text) !important;
  }

  .qame-mobile-quick-icon {
    width: 50px;
    height: 50px;
    margin: 0 auto 7px;
    border-radius: 16px;
    display: grid;
    place-items: center;
    background: #eef5ff;
    color: var(--qame-mobile-blue);
    font-size: 23px;
    box-shadow: inset 0 0 0 1px rgba(23, 105, 224, .06);
  }

  .qame-mobile-quick-icon i,
  .qame-mobile-bottom-icon i,
  .qame-mobile-fab i {
    font-size: inherit;
    line-height: 1;
  }

  .qame-mobile-quick-label {
    display: block;
    min-height: 30px;
    overflow: hidden;
    color: #27435e;
    font-size: 10.5px;
    line-height: 1.25;
    font-weight: 700;
    word-break: break-word;
  }

  .qame-mobile-explore-track {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(220px, 74vw);
    gap: 12px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    overscroll-behavior-inline: contain;
    padding: 2px 2px 8px;
    scrollbar-width: none;
  }

  .qame-mobile-explore-track::-webkit-scrollbar {
    display: none;
  }

  .qame-mobile-explore-card {
    position: relative;
    min-height: 126px;
    padding: 16px;
    border-radius: 20px;
    background: #fff;
    border: 1px solid var(--qame-mobile-border);
    text-decoration: none !important;
    color: var(--qame-mobile-text) !important;
    scroll-snap-align: start;
    overflow: hidden;
    box-shadow: 0 7px 22px rgba(37, 73, 118, .07);
  }

  .qame-mobile-explore-card::after {
    content: '';
    position: absolute;
    right: -30px;
    bottom: -38px;
    width: 110px;
    height: 110px;
    border-radius: 50%;
    background: rgba(23, 105, 224, .07);
  }

  .qame-mobile-explore-card strong {
    position: relative;
    z-index: 1;
    display: block;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.3;
  }

  .qame-mobile-explore-card span {
    position: relative;
    z-index: 1;
    display: block;
    margin-top: 6px;
    max-width: 80%;
    color: var(--qame-mobile-muted);
    font-size: 11px;
    line-height: 1.42;
  }

  .qame-mobile-explore-badge {
    position: relative;
    z-index: 1;
    display: inline-grid !important;
    place-items: center;
    width: 35px;
    height: 35px;
    margin: 0 0 10px !important;
    border-radius: 12px;
    background: #edf5ff;
    color: var(--qame-mobile-blue) !important;
    font-size: 18px !important;
  }

  /* v1.0.2: the purpose-built mobile dashboard replaces the native dashboard
     overview/cards requested for removal. This rule is mobile-only. */
  html.qame-mobile-app .qame-mobile-hide-native-dashboard {
    display: none !important;
  }

  /* Existing QAME content: make it phone-friendly without changing desktop. */
  html.qame-mobile-app .card {
    border-radius: 18px !important;
  }

  html.qame-mobile-app .card-body {
    padding: 14px !important;
  }

  html.qame-mobile-app .btn,
  html.qame-mobile-app button:not(.qame-mobile-quick-item):not(.qame-mobile-bottom-item):not(.qame-mobile-profile-btn) {
    min-height: 42px;
  }

  html.qame-mobile-app .form-control,
  html.qame-mobile-app .form-select,
  html.qame-mobile-app .select2-selection {
    min-height: 42px !important;
  }

  html.qame-mobile-app .table-responsive {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  html.qame-mobile-app .modal-dialog {
    margin: 8px !important;
    max-width: calc(100% - 16px) !important;
  }

  html.qame-mobile-app .modal-content {
    border-radius: 20px !important;
  }

  /* Bottom app navigation */
  .qame-mobile-bottom-nav {
    position: fixed;
    z-index: 1090;
    left: 0;
    right: 0;
    bottom: 0;
    height: calc(var(--qame-mobile-bottom-nav-h) + env(safe-area-inset-bottom, 0px));
    padding: 8px 12px env(safe-area-inset-bottom, 0px);
    display: grid;
    grid-template-columns: 1fr 1fr 1.25fr 1fr 1fr;
    align-items: center;
    background: rgba(255,255,255,.98);
    border-top: 1px solid var(--qame-mobile-border);
    box-shadow: 0 -10px 28px rgba(34, 67, 108, .08);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
  }

  .qame-mobile-bottom-item {
    min-width: 0;
    min-height: 54px;
    border: 0;
    background: transparent;
    padding: 4px 2px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    color: #90a0b6 !important;
    text-decoration: none !important;
    font-size: 9.5px;
    font-weight: 700;
  }

  .qame-mobile-bottom-item.is-active {
    color: var(--qame-mobile-blue) !important;
  }

  .qame-mobile-bottom-icon {
    font-size: 22px;
    line-height: 1;
  }

  .qame-mobile-bottom-center {
    position: relative;
    align-self: stretch;
  }

  .qame-mobile-fab {
    position: absolute;
    left: 50%;
    top: -31px;
    transform: translateX(-50%);
    width: 62px;
    height: 62px;
    border-radius: 50%;
    border: 5px solid #fff;
    display: grid;
    place-items: center;
    background: linear-gradient(145deg, #0e61d7, #2584ff);
    color: #fff;
    font-size: 27px;
    box-shadow: 0 8px 20px rgba(23, 105, 224, .28);
  }

  .qame-mobile-bottom-icon-placeholder {
    width: 22px;
    height: 22px;
    display: block;
  }

  .qame-mobile-center-label {
    line-height: 1;
    color: inherit;
  }

  /* More / Quick Actions sheet */
  .qame-mobile-sheet-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1100;
    background: rgba(16, 36, 58, .42);
    opacity: 0;
    pointer-events: none;
    transition: opacity .18s ease;
  }

  .qame-mobile-sheet {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1110;
    max-height: min(74vh, 620px);
    overflow: auto;
    padding: 10px 16px calc(18px + env(safe-area-inset-bottom, 0px));
    background: #fff;
    border-radius: 24px 24px 0 0;
    box-shadow: 0 -20px 50px rgba(16, 36, 58, .20);
    transform: translateY(105%);
    transition: transform .22s ease;
  }

  .qame-mobile-sheet-backdrop.is-open {
    opacity: 1;
    pointer-events: auto;
  }

  .qame-mobile-sheet.is-open {
    transform: translateY(0);
  }

  .qame-mobile-sheet-handle {
    width: 42px;
    height: 5px;
    border-radius: 999px;
    background: #dfe6ef;
    margin: 0 auto 12px;
  }

  .qame-mobile-sheet-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
  }

  .qame-mobile-sheet-header h3 {
    margin: 0;
    color: var(--qame-mobile-text);
    font-size: 17px;
    font-weight: 800;
  }

  .qame-mobile-sheet-close {
    width: 38px;
    height: 38px;
    border: 0;
    border-radius: 12px;
    background: #f2f5f9;
    color: #5e7189;
    font-size: 20px;
  }

  .qame-mobile-sheet-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .qame-mobile-sheet-link {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 54px;
    padding: 10px 12px;
    border-radius: 15px;
    background: #f7f9fc;
    border: 1px solid #edf1f6;
    color: #27435e !important;
    text-decoration: none !important;
    font-size: 11px;
    font-weight: 700;
  }

  .qame-mobile-sheet-link i {
    color: var(--qame-mobile-blue);
    font-size: 20px;
    flex: 0 0 auto;
  }

  @media (max-width: 359.98px) {
    .qame-mobile-quick-grid {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .qame-mobile-brand-subtitle {
      max-width: 150px;
    }
  }
}

@media (min-width: 768px) {
  .qame-mobile-topbar,
  .qame-mobile-dashboard,
  .qame-mobile-bottom-nav,
  .qame-mobile-sheet,
  .qame-mobile-sheet-backdrop {
    display: none !important;
  }
}

/* v1.0.2 mobile Help, Profile and Certificate QR Scanner */
@media (max-width: 767.98px) {
  .qame-mobile-profile-btn { display: none !important; }

  .qame-mobile-help-btn {
    flex: 0 0 auto;
    min-height: 40px !important;
    padding: 0 13px;
    border: 0;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    background: #22a447;
    color: #fff;
    box-shadow: 0 7px 18px rgba(34, 164, 71, .22);
    font-size: 12px;
    font-weight: 800;
  }

  .qame-mobile-help-btn i { font-size: 17px; }

  html.qame-mobile-app .qame-mobile-hide-native-profile {
    display: none !important;
  }

  .qame-mobile-profile-page {
    margin: 0 -14px 8px;
    padding-bottom: 8px;
  }

  .qame-mobile-profile-hero {
    padding: 26px 20px 22px;
    color: #fff;
    background:
      radial-gradient(circle at 87% 18%, rgba(255,255,255,.18) 0 44px, transparent 45px),
      linear-gradient(140deg, #0757c9 0%, #0d6ce8 56%, #2b85f6 100%);
    box-shadow: 0 12px 30px rgba(18, 93, 196, .16);
  }

  .qame-mobile-profile-identity {
    display: flex;
    align-items: center;
    gap: 16px;
    min-width: 0;
  }

  .qame-mobile-profile-avatar {
    width: 82px;
    height: 82px;
    flex: 0 0 82px;
    overflow: hidden;
    border: 4px solid rgba(255,255,255,.94);
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: #fff;
    color: #0d4b9e;
    font-size: 27px;
    font-weight: 900;
    box-shadow: 0 8px 24px rgba(0,0,0,.14);
  }

  .qame-mobile-profile-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .qame-mobile-profile-copy {
    min-width: 0;
    flex: 1 1 auto;
  }

  .qame-mobile-profile-copy h2 {
    margin: 0 0 5px;
    color: #fff !important;
    font-size: 20px;
    line-height: 1.2;
    font-weight: 850;
    overflow-wrap: anywhere;
  }

  .qame-mobile-profile-copy p {
    margin: 2px 0;
    color: rgba(255,255,255,.82) !important;
    font-size: 11px;
    line-height: 1.35;
  }

  .qame-mobile-role-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-top: 7px;
    color: #fff;
    font-size: 11px;
    font-weight: 800;
  }

  .qame-mobile-role-badge i { font-size: 17px; }

  .qame-mobile-profile-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-top: 22px;
  }

  .qame-mobile-profile-action {
    min-height: 44px !important;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 850;
  }

  .qame-mobile-profile-action-outline {
    border: 1.5px solid rgba(255,255,255,.94);
    background: transparent;
    color: #fff;
  }

  .qame-mobile-profile-action-solid {
    border: 1.5px solid #fff;
    background: #fff;
    color: #0e5fc9;
  }

  .qame-mobile-profile-menu {
    margin-top: 12px;
    background: #fff;
    border-top: 1px solid var(--qame-mobile-border);
    border-bottom: 1px solid var(--qame-mobile-border);
  }

  .qame-mobile-profile-row {
    width: 100%;
    min-height: 64px !important;
    padding: 0 18px;
    border: 0;
    border-bottom: 1px solid #eff3f8;
    background: #fff;
    display: grid;
    grid-template-columns: 34px minmax(0,1fr) 24px;
    align-items: center;
    gap: 10px;
    color: #1550a6 !important;
    text-align: left;
    text-decoration: none !important;
  }

  .qame-mobile-profile-row:last-child { border-bottom: 0; }
  .qame-mobile-profile-row-icon { font-size: 24px; color: #0c5bc4; line-height: 1; }
  .qame-mobile-profile-row-label { color: #174b94; font-size: 14px; font-weight: 750; }
  .qame-mobile-profile-row-chevron { color: #91aed7; font-size: 24px; }
  .qame-mobile-profile-menu-logout { margin-top: 18px; margin-bottom: 14px; }
  .qame-mobile-logout-row .qame-mobile-profile-row-icon,
  .qame-mobile-logout-row .qame-mobile-profile-row-label { color: #174b94; }

  .qame-mobile-help-center {
    position: fixed;
    inset: 0;
    z-index: 1160;
    display: none;
    overflow-y: auto;
    overscroll-behavior: contain;
    background: #f6f9fd;
    color: #14385f;
    -webkit-overflow-scrolling: touch;
  }

  .qame-mobile-help-center.is-open { display: block; }
  body.qame-mobile-help-open .qame-mobile-bottom-nav { display: none !important; }

  .qame-mobile-help-header {
    position: sticky;
    top: 0;
    z-index: 3;
    min-height: 84px;
    padding: calc(14px + env(safe-area-inset-top, 0px)) 18px 14px;
    display: grid;
    grid-template-columns: 44px 1fr 44px;
    align-items: center;
    gap: 8px;
    background: linear-gradient(135deg, #0c5bc4 0%, #1769e0 58%, #2b7cf0 100%);
    box-shadow: 0 1px 0 rgba(255,255,255,.14);
  }

  .qame-mobile-help-header h2 {
    margin: 0;
    color: #fff !important;
    text-align: center;
    font-size: 20px;
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: -.01em;
  }

  .qame-mobile-help-back {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: #fff;
    font-size: 25px;
  }

  .qame-mobile-help-header-spacer { width: 42px; height: 42px; }

  .qame-mobile-help-search-wrap {
    position: sticky;
    top: calc(84px + env(safe-area-inset-top, 0px));
    z-index: 2;
    padding: 14px 18px;
    background: rgba(255,255,255,.98);
    border-bottom: 1px solid #e8eef6;
  }

  .qame-mobile-help-search {
    min-height: 52px;
    padding: 0 12px;
    display: grid;
    grid-template-columns: 28px minmax(0,1fr) 32px;
    align-items: center;
    gap: 8px;
    border-radius: 12px;
    background: #fff;
    box-shadow: inset 0 0 0 1px #e4ebf4;
  }

  .qame-mobile-help-search > i {
    color: #365d85;
    font-size: 25px;
  }

  .qame-mobile-help-search input {
    width: 100%;
    min-width: 0;
    height: 48px;
    padding: 0;
    border: 0;
    outline: 0;
    box-shadow: none !important;
    background: transparent;
    color: #193d63;
    font-size: 15px;
    font-weight: 650;
  }

  .qame-mobile-help-search input::placeholder { color: #8b99ab; font-weight: 600; }

  .qame-mobile-help-search-clear {
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 50%;
    background: #edf3f9;
    color: #58718c;
    font-size: 19px;
  }

  .qame-mobile-help-content {
    padding: 20px 0 calc(34px + env(safe-area-inset-bottom, 0px));
    background: #fff;
  }

  .qame-mobile-help-section {
    padding: 0 18px 18px;
    background: #fff;
  }

  .qame-mobile-help-section + .qame-mobile-help-section {
    margin-top: 8px;
    padding-top: 22px;
    border-top: 10px solid #f3f7fb;
  }

  .qame-mobile-help-section h3 {
    margin: 0 0 9px;
    color: #123b68;
    font-size: 20px;
    line-height: 1.25;
    font-weight: 850;
    letter-spacing: -.02em;
  }

  .qame-mobile-help-list { display: block; }

  .qame-mobile-help-row {
    width: 100%;
    min-height: 86px !important;
    padding: 13px 2px;
    display: grid;
    grid-template-columns: 52px minmax(0,1fr) 30px;
    align-items: center;
    gap: 10px;
    border: 0;
    border-bottom: 1px solid #edf2f7;
    border-radius: 0;
    background: transparent;
    color: #103f79 !important;
    text-align: left;
    text-decoration: none !important;
  }

  .qame-mobile-help-row:last-child { border-bottom: 0; }
  .qame-mobile-help-row[hidden] { display: none !important; }

  .qame-mobile-help-row-icon {
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    color: #1769e0;
    font-size: 29px;
    line-height: 1;
  }

  .qame-mobile-help-row-copy { min-width: 0; }
  .qame-mobile-help-row-copy strong {
    display: block;
    color: #123f79;
    font-size: 16px;
    line-height: 1.25;
    font-weight: 800;
  }
  .qame-mobile-help-row-copy small {
    display: block;
    margin-top: 6px;
    color: #71849b;
    font-size: 12px;
    line-height: 1.4;
    font-weight: 500;
  }
  .qame-mobile-help-row-chevron { color: #2b7fea; font-size: 28px; justify-self: end; }

  .qame-mobile-help-inline-card {
    margin: 10px 0 4px;
    padding: 15px;
    border: 1px solid #dce9f7;
    border-radius: 16px;
    background: #f5f9ff;
    color: #34536f;
  }
  .qame-mobile-help-inline-card[hidden] { display: none !important; }
  .qame-mobile-help-inline-card strong { display: block; margin-bottom: 8px; color: #164a87; font-size: 13px; }
  .qame-mobile-help-inline-card p { margin: 0 0 8px; color: #5f738a !important; font-size: 11.5px; line-height: 1.5; }
  .qame-mobile-help-inline-card p:last-child { margin-bottom: 0; }
  .qame-mobile-help-inline-card b { color: #284e78; }

  .qame-mobile-help-empty {
    padding: 54px 28px 70px;
    text-align: center;
    color: #72859b;
  }
  .qame-mobile-help-empty[hidden] { display: none !important; }
  .qame-mobile-help-empty i { display: block; margin-bottom: 10px; color: #9aabc0; font-size: 42px; }
  .qame-mobile-help-empty strong { display: block; color: #415b75; font-size: 14px; }
  .qame-mobile-help-empty span { display: block; margin-top: 5px; font-size: 11px; line-height: 1.45; }

  .qame-mobile-scanner {
    position: fixed;
    inset: 0;
    z-index: 1200;
    display: none;
    overflow-y: auto;
    background: #071525;
    color: #fff;
  }
  .qame-mobile-scanner.is-open { display: block; }
  .qame-mobile-scanner-header {
    position: sticky;
    top: 0;
    z-index: 2;
    min-height: 68px;
    padding: calc(10px + env(safe-area-inset-top, 0px)) 14px 10px;
    display: flex;
    align-items: center;
    gap: 12px;
    background: rgba(7,21,37,.92);
    backdrop-filter: blur(12px);
  }
  .qame-mobile-scanner-header strong { display: block; color: #fff; font-size: 15px; }
  .qame-mobile-scanner-header span { display: block; margin-top: 2px; color: #9fb4cc; font-size: 10.5px; }
  .qame-mobile-scanner-close {
    width: 42px; height: 42px; min-height: 42px !important;
    border: 0; border-radius: 13px; display: grid; place-items: center;
    background: rgba(255,255,255,.10); color: #fff; font-size: 21px;
  }
  .qame-mobile-scanner-body { padding: 14px 16px calc(30px + env(safe-area-inset-bottom, 0px)); }
  .qame-mobile-camera-wrap {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
    max-height: 62vh;
    overflow: hidden;
    border-radius: 24px;
    background: #0c2239;
  }
  .qame-mobile-scanner-video { width: 100%; height: 100%; object-fit: cover; display: none; }
  .qame-mobile-scanner.camera-on .qame-mobile-scanner-video { display: block; }
  .qame-mobile-scanner-idle {
    position: absolute; inset: 0; display: flex; flex-direction: column;
    align-items: center; justify-content: center; gap: 10px; color: #8da8c3; font-size: 11px;
  }
  .qame-mobile-scanner-idle i { font-size: 54px; color: #5f86ad; }
  .qame-mobile-scanner.camera-on .qame-mobile-scanner-idle { display: none; }
  .qame-mobile-scan-frame {
    pointer-events: none;
    position: absolute;
    left: 14%; right: 14%; top: 14%; bottom: 14%;
  }
  .qame-mobile-scan-frame span { position: absolute; width: 42px; height: 42px; border-color: #39d16b; border-style: solid; }
  .qame-mobile-scan-frame span:nth-child(1) { left:0; top:0; border-width:4px 0 0 4px; border-radius:11px 0 0 0; }
  .qame-mobile-scan-frame span:nth-child(2) { right:0; top:0; border-width:4px 4px 0 0; border-radius:0 11px 0 0; }
  .qame-mobile-scan-frame span:nth-child(3) { left:0; bottom:0; border-width:0 0 4px 4px; border-radius:0 0 0 11px; }
  .qame-mobile-scan-frame span:nth-child(4) { right:0; bottom:0; border-width:0 4px 4px 0; border-radius:0 0 11px 0; }
  .qame-mobile-scanner-status { min-height: 38px; margin: 12px 2px 8px; color: #c1d1e2 !important; font-size: 11px; line-height: 1.45; text-align: center; }
  .qame-mobile-scanner-status.is-error { color: #ff9a9a !important; }
  .qame-mobile-scanner-status.is-success { color: #65e58f !important; }
  .qame-mobile-scanner-primary,
  .qame-mobile-upload-btn {
    width: 100%; min-height: 46px !important; border: 0; border-radius: 14px;
    display: flex; align-items: center; justify-content: center; gap: 8px;
    background: #1769e0; color: #fff !important; font-size: 12px; font-weight: 850;
  }
  .qame-mobile-upload-btn { background: #17314d; border: 1px solid #2a4866; }
  .qame-mobile-scanner-primary i,
  .qame-mobile-upload-btn i { font-size: 19px; }
  .qame-mobile-scanner-divider { position: relative; margin: 14px 0; text-align:center; color:#69829d; font-size:10px; }
  .qame-mobile-scanner-divider::before { content:''; position:absolute; left:0; right:0; top:50%; border-top:1px solid #1f3851; }
  .qame-mobile-scanner-divider span { position:relative; padding:0 8px; background:#071525; }
  .qame-mobile-manual-verify { margin-top: 16px; }
  .qame-mobile-manual-verify label { display:block; margin-bottom:6px; color:#9fb4cc; font-size:10.5px; font-weight:700; }
  .qame-mobile-manual-verify > div { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; }
  .qame-mobile-manual-verify input {
    min-width:0; min-height:44px; padding:0 12px; border:1px solid #28445f; border-radius:12px;
    background:#0d2237; color:#fff; outline:none; font-size:11px;
  }
  .qame-mobile-manual-verify button {
    min-height:44px !important; padding:0 15px; border:0; border-radius:12px;
    background:#22a447; color:#fff; font-size:11px; font-weight:800;
  }
  .qame-mobile-scanner-footnote { margin: 12px 4px 0; color: #7890aa !important; font-size: 9.5px; line-height: 1.45; text-align:center; }
  .qame-mobile-scanner-footnote strong { color:#9fb6cd; }
}


  /* v1.0.18 dedicated Help Center page + Help-only page transitions */
  html.qame-help-center-page .qame-mobile-topbar,
  html.qame-help-center-page .qame-mobile-bottom-nav { display: none !important; }
  html.qame-help-center-page body { padding-bottom: 0 !important; }
  html.qame-help-center-page .container-xxl,
  html.qame-help-center-page .container-fluid,
  html.qame-help-center-page .container-p-y { padding: 0 !important; }

  .qame-help-page { min-height: 100dvh; background: #fff; color: #123b68; }
  .qame-help-mobile-header {
    min-height: 76px; padding: calc(10px + env(safe-area-inset-top, 0px)) 16px 10px;
    display: grid; grid-template-columns: 44px minmax(0,1fr) 44px; align-items:center; gap:8px;
    background: linear-gradient(135deg,#0c5bc4 0%,#1769e0 58%,#2b7cf0 100%); color:#fff;
  }
  .qame-help-mobile-header h1 { margin:0; color:#fff !important; text-align:center; font-size:20px; font-weight:800; }
  .qame-help-mobile-back { width:42px; height:42px; min-height:42px !important; display:grid; place-items:center; border:0; border-radius:50%; background:transparent; color:#fff; font-size:24px; }
  .qame-help-mobile-spacer { width:42px; height:42px; }
  .qame-help-desktop-heading { display:none; }
  .qame-help-search-zone { padding:14px 18px; background:#fff; border-bottom:1px solid #e8eef6; }
  .qame-help-search-box { min-height:52px; padding:0 12px; display:grid; grid-template-columns:28px minmax(0,1fr) 32px; align-items:center; gap:8px; border:1px solid #dfe8f2; border-radius:12px; background:#fff; }
  .qame-help-search-box > i { color:#365d85; font-size:25px; }
  .qame-help-search-box input { width:100%; min-width:0; height:48px; padding:0; border:0; outline:0; box-shadow:none !important; background:transparent; color:#193d63; font-size:15px; font-weight:650; }
  .qame-help-search-box input::placeholder { color:#8b99ab; font-weight:600; }
  .qame-help-search-clear { width:30px; height:30px; min-height:30px !important; display:grid; place-items:center; border:0; border-radius:50%; background:#edf3f9; color:#58718c; font-size:19px; }
  .qame-help-body { background:#fff; }
  .qame-help-section { padding:20px 15px 8px; }
  .qame-help-section + .qame-help-section { margin-top:8px; padding-top:22px; border-top:10px solid #f3f7fb; }
  .qame-help-section h2 { margin:0 0 12px; color:#123b68; font-size:20px; line-height:1.25; font-weight:850; }
  .qame-help-list { display:block; }
  .qame-help-row { width:100%; min-height:79px; padding:12px 8px; display:grid; grid-template-columns:42px minmax(0,1fr) 28px; align-items:center; gap:10px; border:0; border-bottom:1px solid #edf2f7; background:transparent; color:#103f79 !important; text-align:left; text-decoration:none !important; }
  .qame-help-row[hidden] { display:none !important; }
  .qame-help-row-icon { width:36px; height:36px; display:grid; place-items:center; color:#1769e0; font-size:22px; }
  .qame-help-row-copy strong { display:block; color:#123f79; font-size:15px; line-height:1.25; font-weight:800; }
  .qame-help-row-copy small { display:block; margin-top:5px; color:#71849b; font-size:11px; line-height:1.4; }
  .qame-help-row-chevron { color:#2b7fea; font-size:26px; justify-self:end; }
  .qame-help-inline-card { margin:10px 5px 4px; padding:15px; border:1px solid #dce9f7; border-radius:16px; background:#f5f9ff; color:#34536f; }
  .qame-help-inline-card[hidden] { display:none !important; }
  .qame-help-inline-card strong { display:block; margin-bottom:8px; color:#164a87; font-size:13px; }
  .qame-help-inline-card p { margin:0 0 8px; color:#5f738a !important; font-size:11.5px; line-height:1.5; }
  .qame-help-empty { padding:48px 24px 68px; text-align:center; color:#72859b; }
  .qame-help-empty[hidden] { display:none !important; }
  .qame-help-empty i { display:block; margin-bottom:10px; font-size:40px; color:#9aabc0; }

  /* v1.0.18: Help Center-only destination-entry swipe.
     The page being left is never translated or hidden. This prevents BFCache/back
     restores from returning to an off-canvas blank page. No fade is used. */
  .qame-help-page.qame-help-enter-from-right,
  .qame-help-page.qame-help-enter-from-left {
    will-change: transform;
    backface-visibility: hidden;
  }
  .qame-help-page.qame-help-enter-from-right { animation:qameHelpEnterRight .15s cubic-bezier(.22,.61,.36,1) both; }
  .qame-help-page.qame-help-enter-from-left { animation:qameHelpEnterLeft .15s cubic-bezier(.22,.61,.36,1) both; }
  @keyframes qameHelpEnterRight { from{transform:translate3d(100%,0,0)} to{transform:translate3d(0,0,0)} }
  @keyframes qameHelpEnterLeft { from{transform:translate3d(-100%,0,0)} to{transform:translate3d(0,0,0)} }

  /* v1.0.18 unified mobile footer. The desktop Sneat footer remains intact,
     while dedicated mobile pages use one compact, centered footer component. */
  html.qame-mobile-app.qame-help-center-page .content-footer,
  html.qame-mobile-app.qame-help-center-page footer.content-footer,
  html.qame-mobile-app.qame-mobile-dedicated-route .content-footer,
  html.qame-mobile-app.qame-mobile-dedicated-route footer.content-footer {
    display:none !important;
  }
  .qame-help-mobile-footer { display:none !important; }
  .qame-mobile-site-footer {
    display:block;
    width:100%;
    margin:0;
    padding:24px 18px 26px;
    border-top:1px solid #e7edf5;
    background:#fff;
    color:#7d8fa3;
    text-align:center;
  }
  .qame-mobile-site-footer-with-nav {
    margin-bottom:calc(var(--qame-mobile-bottom-nav-h) + env(safe-area-inset-bottom, 0px) + 10px);
  }
  .qame-mobile-site-footer-brand {
    color:#123b68;
    font-size:13px;
    line-height:1.25;
    font-weight:900;
    letter-spacing:.025em;
  }
  .qame-mobile-site-footer-division {
    margin-top:3px;
    color:#8292a5;
    font-size:10.5px;
    line-height:1.35;
    font-weight:650;
  }
  .qame-mobile-site-footer-copy {
    margin-top:13px;
    color:#8a98a9;
    font-size:10.5px;
    line-height:1.45;
  }
  .qame-mobile-site-footer-project {
    margin-top:10px;
    color:#526b84;
    font-size:10.5px;
    line-height:1.55;
  }
  .qame-mobile-site-footer-project strong {
    color:#123b68;
    font-weight:800;
    white-space:nowrap;
  }
  .qame-mobile-site-footer-project span { white-space:nowrap; }
  .qame-mobile-site-footer-theme {
    margin-top:9px;
    color:#9aa7b6;
    font-size:9.5px;
    line-height:1.4;
  }
  .qame-mobile-site-footer-theme a {
    color:#74879d !important;
    text-decoration:none !important;
    font-weight:700;
  }

  /* QR Scanner and all other mobile controls open immediately; no page-swipe animation. */
  .qame-mobile-scanner.is-open { display:block; animation:none !important; transition:none !important; }
  .qame-mobile-scanner.is-open.is-closing { animation:none !important; transition:none !important; }

  @media (prefers-reduced-motion: reduce) {
    .qame-help-page.qame-help-enter-from-right,
    .qame-help-page.qame-help-enter-from-left {
      animation:none !important; transition:none !important;
    }
  }

@media (min-width: 768px) {
  .qame-mobile-help-center,
  .qame-mobile-scanner,
  .qame-mobile-profile-page {
    display: none !important;
  }
}


/* v1.0.18 Help Center desktop presentation */
@media (min-width: 768px) {
  .qame-help-page { max-width: 1180px; margin: 0 auto; padding: 4px 0 28px; background: transparent; }
  .qame-help-mobile-header { display:none !important; }

  .qame-help-mobile-footer,
  .qame-mobile-site-footer { display:none !important; }
  .qame-help-desktop-heading { display:block; margin-bottom:18px; }
  .qame-help-desktop-heading .breadcrumb { margin-bottom:8px; }
  .qame-help-desktop-heading h1 { margin:0; color:#233446; font-size:25px; font-weight:750; }
  .qame-help-desktop-heading p { margin:6px 0 0; color:#8592a3; }
  .qame-help-search-zone { padding:0; margin-bottom:18px; background:transparent; border:0; }
  .qame-help-search-box { max-width:720px; min-height:50px; border-radius:12px; box-shadow:0 2px 10px rgba(67,89,113,.06); }
  .qame-help-body { display:grid; grid-template-columns:minmax(0,1fr) minmax(300px,.52fr); gap:18px; background:transparent; }
  .qame-help-section { padding:18px 20px; border:1px solid #e7eaf0; border-radius:14px; background:#fff; box-shadow:0 2px 12px rgba(67,89,113,.05); }
  .qame-help-section + .qame-help-section { margin-top:0; padding-top:18px; border-top:1px solid #e7eaf0; }
  .qame-help-section h2 { margin-bottom:8px; font-size:18px; color:#233446; }
  .qame-help-row { min-height:76px; grid-template-columns:44px minmax(0,1fr) 28px; padding:10px 6px; }
  .qame-help-row-copy strong { color:#33475b; font-size:14px; }
  .qame-help-row-copy small { color:#8592a3; font-size:11.5px; }
  .qame-help-row-icon { color:#1769e0; font-size:21px; }
  .qame-help-row-chevron { color:#a6b1be; font-size:22px; }
  .qame-help-inline-card { margin:12px 0 2px; }
  .qame-help-empty { grid-column:1/-1; padding:30px; border-radius:14px; background:#fff; border:1px solid #e7eaf0; }
}


/* v1.0.18 real server-rendered dedicated mobile pages */
@media (max-width: 767.98px) {
  html.qame-mobile-dedicated-route .container-xxl,
  html.qame-mobile-dedicated-route .container-fluid,
  html.qame-mobile-dedicated-route .container-p-y { padding-left: 0 !important; padding-right: 0 !important; padding-top: 0 !important; }

  .qame-mobile-dedicated-page { min-height: calc(100dvh - 138px); padding: 14px 14px 22px; background: var(--qame-mobile-bg); color: var(--qame-mobile-text); }
  .qame-mobile-page-title { margin: 4px 2px 12px; color:#1f344a; font-size:20px; font-weight:850; letter-spacing:-.02em; }
  .qame-mobile-page-subtitle { margin:-6px 2px 16px; color:#7b8ca4; font-size:11px; line-height:1.45; }

  .qame-mobile-dedicated-hero { padding:20px; border-radius:20px; background:linear-gradient(135deg,#0e5fc9 0%,#1769e0 62%,#4f8ff0 100%); color:#fff; box-shadow:0 10px 28px rgba(23,105,224,.14); }
  .qame-mobile-dedicated-hero .eyebrow { display:inline-flex; align-items:center; min-height:25px; padding:0 9px; border-radius:999px; background:rgba(255,255,255,.16); color:#fff; font-size:10px; font-weight:800; }
  .qame-mobile-dedicated-hero h1 { margin:12px 0 6px; color:#fff !important; font-size:24px; line-height:1.15; font-weight:900; letter-spacing:-.03em; }
  .qame-mobile-dedicated-hero p { margin:0; color:rgba(255,255,255,.84) !important; font-size:11.5px; line-height:1.5; }
  .qame-mobile-dedicated-hero .hero-action { display:inline-flex; align-items:center; justify-content:center; min-height:44px; margin-top:16px; padding:0 16px; border-radius:12px; background:#fff; color:#0f5fc8 !important; text-decoration:none !important; font-size:12px; font-weight:850; }

  .qame-mobile-block { margin-top:14px; padding:16px; border:1px solid #e7edf5; border-radius:18px; background:#fff; box-shadow:0 5px 20px rgba(37,73,118,.05); }
  .qame-mobile-block-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:10px; }
  .qame-mobile-block-head h2 { margin:0; color:#263b50; font-size:15px; font-weight:850; }
  .qame-mobile-block-head span { color:#8b9ab0; font-size:10px; }

  .qame-mobile-dedicated-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px 7px; }
  .qame-mobile-dedicated-action { min-width:0; padding:4px 0; display:flex; flex-direction:column; align-items:center; gap:7px; color:#29435e !important; text-decoration:none !important; text-align:center; font-size:10px; font-weight:750; }
  .qame-mobile-dedicated-action .icon { width:48px; height:48px; display:grid; place-items:center; border-radius:15px; background:#eef5ff; color:#1769e0; font-size:23px; }
  .qame-mobile-dedicated-action.is-unavailable { opacity:.48; pointer-events:none; }

  .qame-mobile-link-list { overflow:hidden; border:1px solid #e8eef5; border-radius:16px; background:#fff; }
  .qame-mobile-link-row { width:100%; min-height:66px; padding:10px 13px; display:grid; grid-template-columns:38px minmax(0,1fr) 22px; align-items:center; gap:10px; border:0; border-bottom:1px solid #eef2f7; background:#fff; color:#224b7b !important; text-decoration:none !important; }
  .qame-mobile-link-row:last-child { border-bottom:0; }
  .qame-mobile-link-row .row-icon { width:34px; height:34px; display:grid; place-items:center; border-radius:11px; background:#eef5ff; color:#1769e0; font-size:20px; }
  .qame-mobile-link-row .row-copy { min-width:0; }
  .qame-mobile-link-row .row-copy strong { display:block; color:#26435f; font-size:12.5px; font-weight:820; }
  .qame-mobile-link-row .row-copy small { display:block; margin-top:3px; color:#8999ad; font-size:10px; line-height:1.35; }
  .qame-mobile-link-row > i { justify-self:end; color:#90a7c1; font-size:22px; }
  .qame-mobile-link-row.is-unavailable { opacity:.48; pointer-events:none; }

  .qame-mobile-profile-card { margin:-14px -14px 14px; padding:26px 18px 24px; background:linear-gradient(135deg,#0c5bc4 0%,#1769e0 58%,#2b7cf0 100%); color:#fff; }
  .qame-mobile-profile-card .identity { display:flex; align-items:center; gap:14px; }
  .qame-mobile-profile-card .avatar { width:78px; height:78px; flex:0 0 78px; display:grid; place-items:center; border:5px solid rgba(255,255,255,.9); border-radius:50%; background:#fff; color:#0d4b9e; font-size:24px; font-weight:900; }
  .qame-mobile-profile-card h1 { margin:0 0 5px; color:#fff !important; font-size:20px; font-weight:900; line-height:1.2; }
  .qame-mobile-profile-card p { margin:2px 0; color:rgba(255,255,255,.82) !important; font-size:11px; }
  .qame-mobile-profile-card .role { display:inline-flex; align-items:center; gap:5px; margin-top:7px; color:#fff; font-size:11px; font-weight:800; }
  .qame-mobile-profile-card .actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:20px; }
  .qame-mobile-profile-card .actions a { min-height:44px; display:flex; align-items:center; justify-content:center; border-radius:999px; border:1.5px solid rgba(255,255,255,.96); color:#fff !important; text-decoration:none !important; font-size:11px; font-weight:850; }
  .qame-mobile-profile-card .actions a:last-child { background:#fff; color:#0e5fc9 !important; }

  .qame-mobile-profile-menu { margin-top:12px; border:1px solid #e7edf5; border-radius:16px; overflow:hidden; background:#fff; }
  .qame-mobile-profile-menu .qame-mobile-profile-row { min-height:62px !important; }
  .qame-mobile-logout-card { margin-top:14px; }

  .qame-mobile-scan-page { min-height:calc(100dvh - 138px); padding:14px; background:#071525; color:#fff; }
  .qame-mobile-scan-page .scan-title { margin:2px 0 4px; color:#fff; font-size:20px; font-weight:850; }
  .qame-mobile-scan-page .scan-subtitle { margin:0 0 14px; color:#91a8c0; font-size:11px; }
  .qame-mobile-scan-camera { position:relative; aspect-ratio:1/1; max-height:52dvh; overflow:hidden; border-radius:20px; background:#0c2239; border:1px solid #28445f; }
  .qame-mobile-scan-camera video { width:100%; height:100%; object-fit:cover; display:block; }
  .qame-mobile-scan-page:not(.camera-on) video { visibility:hidden; }
  .qame-mobile-scan-idle { position:absolute; inset:0; display:grid; place-items:center; align-content:center; gap:8px; color:#7690aa; text-align:center; }
  .qame-mobile-scan-idle i { font-size:54px; color:#356fbb; }
  .qame-mobile-scan-page.camera-on .qame-mobile-scan-idle { display:none; }
  .qame-mobile-scan-frame { position:absolute; inset:17%; pointer-events:none; }
  .qame-mobile-scan-frame span { position:absolute; width:35px; height:35px; border-color:#fff; border-style:solid; }
  .qame-mobile-scan-frame span:nth-child(1){left:0;top:0;border-width:4px 0 0 4px;border-radius:11px 0 0 0}
  .qame-mobile-scan-frame span:nth-child(2){right:0;top:0;border-width:4px 4px 0 0;border-radius:0 11px 0 0}
  .qame-mobile-scan-frame span:nth-child(3){left:0;bottom:0;border-width:0 0 4px 4px;border-radius:0 0 0 11px}
  .qame-mobile-scan-frame span:nth-child(4){right:0;bottom:0;border-width:0 4px 4px 0;border-radius:0 0 11px 0}
  .qame-mobile-scan-status { min-height:38px; margin:12px 2px 8px; color:#c1d1e2 !important; font-size:11px; line-height:1.45; text-align:center; }
  .qame-mobile-scan-status.is-error { color:#ff9a9a !important; } .qame-mobile-scan-status.is-success { color:#65e58f !important; }
  .qame-mobile-scan-primary,.qame-mobile-scan-upload { width:100%; min-height:46px !important; border:0; border-radius:14px; display:flex; align-items:center; justify-content:center; gap:8px; background:#1769e0; color:#fff !important; font-size:12px; font-weight:850; }
  .qame-mobile-scan-upload { margin-top:10px; background:#17314d; border:1px solid #2a4866; }
  .qame-mobile-scan-manual { margin-top:14px; }
  .qame-mobile-scan-manual label { display:block; margin-bottom:6px; color:#9fb4cc; font-size:10.5px; font-weight:700; }
  .qame-mobile-scan-manual > div { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; }
  .qame-mobile-scan-manual input { min-width:0; min-height:44px; padding:0 12px; border:1px solid #28445f; border-radius:12px; background:#0d2237; color:#fff; outline:none; font-size:11px; }
  .qame-mobile-scan-manual button { min-height:44px !important; padding:0 15px; border:0; border-radius:12px; background:#22a447; color:#fff; font-size:11px; font-weight:800; }
  .qame-mobile-scan-note { margin:12px 4px 0; color:#7890aa !important; font-size:9.5px; line-height:1.45; text-align:center; }
}

@media (min-width: 768px) {
  .qame-mobile-dedicated-page,.qame-mobile-scan-page { max-width:980px; margin:0 auto; }
  .qame-mobile-dedicated-page { min-height:auto; padding:10px 0 28px; background:transparent; }
  .qame-mobile-dedicated-hero { max-width:760px; }
  .qame-mobile-dedicated-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .qame-mobile-profile-card { margin:0 0 18px; border-radius:18px; }
  .qame-mobile-scan-page { min-height:auto; padding:22px; border-radius:18px; }
}

/* v1.0.18 Help Center article system */
.qame-help-article-shell { background:#f5f8fc; min-height:calc(100dvh - 76px); padding-bottom:28px; }
.qame-help-article-intro {
  display:grid; grid-template-columns:56px minmax(0,1fr); gap:14px; align-items:start;
  padding:22px 18px 20px; background:#fff; border-bottom:1px solid #e8eef6;
}
.qame-help-article-icon { width:52px; height:52px; display:grid; place-items:center; border-radius:16px; background:#eaf3ff; color:#1769e0; font-size:28px; }
.qame-help-article-kicker { display:block; margin:1px 0 5px; color:#6d85a0; font-size:10px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }
.qame-help-article-intro h1 { margin:0; color:#123b68; font-size:22px; line-height:1.18; font-weight:900; letter-spacing:-.02em; }
.qame-help-article-intro p { margin:7px 0 0; color:#6f839b !important; font-size:12px; line-height:1.55; }
.qame-help-article-content { padding:14px; }
.qame-help-article-card,
.qame-help-article-action-card,
.qame-help-related-card { margin-bottom:12px; padding:17px; border:1px solid #e5ecf4; border-radius:16px; background:#fff; box-shadow:0 4px 16px rgba(38,72,110,.04); }
.qame-help-article-card h2 { margin:0 0 10px; color:#153f6d; font-size:16px; line-height:1.3; font-weight:850; }
.qame-help-article-card p { margin:0 0 10px; color:#5f748b !important; font-size:12px; line-height:1.65; }
.qame-help-article-card p:last-child { margin-bottom:0; }
.qame-help-article-list { margin:0; padding:0; list-style:none; }
.qame-help-article-list li { position:relative; margin:0; padding:8px 0 8px 24px; color:#526b84; font-size:12px; line-height:1.5; border-bottom:1px solid #f0f3f7; }
.qame-help-article-list li:last-child { border-bottom:0; }
.qame-help-article-list li::before { content:'✓'; position:absolute; left:1px; top:8px; width:16px; height:16px; display:grid; place-items:center; border-radius:50%; background:#e9f3ff; color:#1769e0; font-size:10px; font-weight:900; }
.qame-help-article-steps { margin:0; padding:0; list-style:none; counter-reset:qame-help-step; }
.qame-help-article-steps li { counter-increment:qame-help-step; display:grid; grid-template-columns:30px minmax(0,1fr); gap:10px; align-items:start; padding:8px 0; color:#526b84; font-size:12px; line-height:1.5; }
.qame-help-article-steps li::before { content:counter(qame-help-step); width:26px; height:26px; display:grid; place-items:center; border-radius:50%; background:#1769e0; color:#fff; font-size:11px; font-weight:850; }
.qame-help-article-note { margin-top:12px; padding:12px; display:grid; grid-template-columns:22px minmax(0,1fr); gap:8px; border-radius:12px; background:#eef6ff; color:#41617e; font-size:11.5px; line-height:1.5; }
.qame-help-article-note i { color:#1769e0; font-size:20px; }
.qame-help-article-action-card { display:grid; gap:13px; }
.qame-help-article-action-card strong { display:block; color:#193f68; font-size:14px; font-weight:850; }
.qame-help-article-action-card span { display:block; margin-top:4px; color:#7c8da3; font-size:11px; line-height:1.45; }
.qame-help-primary-action { min-height:46px; padding:0 15px; display:flex; align-items:center; justify-content:center; gap:7px; border-radius:13px; background:#1769e0; color:#fff !important; text-decoration:none !important; font-size:12px; font-weight:850; }
.qame-help-primary-action i { font-size:20px; }
.qame-help-related-card > strong { display:block; margin-bottom:6px; color:#183e67; font-size:13px; font-weight:850; }
.qame-help-related-card > a { min-height:48px; display:grid; grid-template-columns:28px minmax(0,1fr) 22px; align-items:center; gap:7px; border-top:1px solid #edf1f6; color:#24548a !important; text-decoration:none !important; font-size:11.5px; font-weight:750; }
.qame-help-related-card > a:first-of-type { border-top:0; }
.qame-help-related-card > a > i:first-child { color:#1769e0; font-size:18px; }
.qame-help-related-card > a > i:last-child { justify-self:end; color:#7fa1c6; font-size:20px; }

@media (max-width: 767.98px) {
  .qame-help-article-page .qame-help-mobile-header h1 { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:18px; }
}

@media (min-width: 768px) {
  .qame-help-article-page { max-width:980px; }
  .qame-help-article-page .qame-help-desktop-heading { margin-bottom:14px; }
  .qame-help-article-shell { min-height:0; padding:0; background:transparent; }
  .qame-help-article-intro { grid-template-columns:64px minmax(0,1fr); padding:22px; border:1px solid #e5eaf1; border-radius:16px; box-shadow:0 2px 12px rgba(67,89,113,.05); }
  .qame-help-article-icon { width:60px; height:60px; border-radius:18px; font-size:30px; }
  .qame-help-article-intro h1 { font-size:25px; color:#273f57; }
  .qame-help-article-intro p { max-width:780px; font-size:13px; color:#7a8797 !important; }
  .qame-help-article-content { padding:16px 0 0; display:grid; grid-template-columns:minmax(0,1fr) 310px; gap:14px; align-items:start; }
  .qame-help-article-card { grid-column:1; margin-bottom:0; padding:20px; border-radius:14px; box-shadow:0 2px 10px rgba(67,89,113,.04); }
  .qame-help-article-action-card,
  .qame-help-related-card { grid-column:2; margin-bottom:0; position:sticky; top:18px; }
  .qame-help-related-card { position:static; }
  .qame-help-article-card h2 { font-size:17px; color:#2d4258; }
  .qame-help-article-card p,
  .qame-help-article-list li,
  .qame-help-article-steps li { font-size:12.5px; }
}

/* v1.0.18 Explore QAME: native free-swipe carousel + optional View All grid. */
@media (max-width: 767.98px) {
  .qame-explore-block { overflow: hidden; padding-left: 0; padding-right: 0; }
  .qame-explore-head { margin-bottom: 12px; padding: 0 16px; align-items: flex-start; }
  .qame-explore-head > div { min-width: 0; }
  .qame-explore-head > div > span { display:block; margin-top:4px; color:#8b9ab0; font-size:10px; }
  .qame-explore-view-all {
    flex:0 0 auto; min-height:32px; padding:0 2px 0 8px; border:0; background:transparent;
    display:inline-flex; align-items:center; gap:3px; color:#1769e0; font-size:10.5px; font-weight:800;
  }
  .qame-explore-view-all i { font-size:18px; transition:transform .18s ease; }
  .qame-explore-block.is-expanded .qame-explore-view-all i { transform:rotate(90deg); }

  .qame-explore-track {
    display:flex; gap:11px; overflow-x:auto; overflow-y:hidden; padding:2px 16px 10px;
    scroll-snap-type:x proximity; scroll-padding-inline:16px; overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch; scrollbar-width:none; touch-action:pan-x pan-y;
  }
  .qame-explore-track::-webkit-scrollbar { display:none; }
  .qame-explore-card {
    flex:0 0 152px; min-width:152px; min-height:164px; padding:14px 13px 13px;
    border:1px solid #e4ebf4; border-radius:17px; background:#fff; color:#21415f !important;
    text-decoration:none !important; scroll-snap-align:start; box-shadow:0 5px 16px rgba(37,73,118,.055);
    display:flex; flex-direction:column; align-items:flex-start;
  }
  .qame-explore-card .qame-explore-icon {
    width:43px; height:43px; flex:0 0 43px; display:grid; place-items:center; margin-bottom:12px;
    border-radius:14px; background:#eef5ff; color:#1769e0; font-size:22px;
  }
  .qame-explore-card strong { display:block; color:#143e6b; font-size:12.5px; line-height:1.25; font-weight:850; }
  .qame-explore-card small { display:block; margin-top:6px; color:#8393a8; font-size:9.7px; line-height:1.42; }
  .qame-explore-card.is-unavailable { opacity:.45; pointer-events:none; }

  .qame-explore-dots { display:flex; justify-content:center; gap:5px; min-height:10px; margin:0 0 9px; }
  .qame-explore-dots span { width:5px; height:5px; border-radius:50%; background:#ccd8e8; }
  .qame-explore-dots span.is-active { width:15px; border-radius:999px; background:#1769e0; }

  .qame-explore-block.is-expanded .qame-explore-track {
    display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; overflow:visible; padding-bottom:12px;
  }
  .qame-explore-block.is-expanded .qame-explore-card { min-width:0; width:100%; min-height:148px; }
  .qame-explore-block.is-expanded .qame-explore-dots { display:none; }

  .qame-explore-feature {
    margin:0 16px 2px; min-height:128px; padding:16px; border-radius:18px;
    display:grid; grid-template-columns:48px minmax(0,1fr); gap:12px; align-items:center;
    position:relative; overflow:hidden; color:#fff !important; text-decoration:none !important;
    background:
      radial-gradient(circle at 91% 18%,rgba(255,255,255,.18) 0 34px,transparent 35px),
      linear-gradient(135deg,#0d4da8 0%,#1769e0 58%,#3b8af4 100%);
    box-shadow:0 10px 24px rgba(23,105,224,.15);
  }
  .qame-explore-feature-icon {
    width:48px; height:48px; border-radius:15px; display:grid; place-items:center;
    background:rgba(255,255,255,.16); color:#fff; font-size:27px;
  }
  .qame-explore-feature-copy { min-width:0; padding-right:2px; }
  .qame-explore-feature-copy small { display:block; color:rgba(255,255,255,.70); font-size:8.5px; font-weight:850; letter-spacing:.08em; }
  .qame-explore-feature-copy strong { display:block; margin-top:4px; color:#fff; font-size:16px; font-weight:900; }
  .qame-explore-feature-copy em { display:block; margin-top:4px; color:rgba(255,255,255,.82); font-size:9.8px; line-height:1.4; font-style:normal; }
  .qame-explore-feature-action {
    grid-column:2; justify-self:start; display:inline-flex; align-items:center; gap:3px; margin-top:-1px;
    min-height:29px; padding:0 10px; border-radius:999px; background:#fff; color:#0e5fc9; font-size:9.5px; font-weight:850;
  }
  .qame-explore-feature-action i { font-size:15px; }
}

/* QAME v1.0.18 — structured Level 1-4 mobile cards */
@media (max-width: 767.98px) {
  .qame-level-card .qame-mobile-block-head {
    align-items:flex-start;
    margin-bottom:13px;
  }
  .qame-level-card .qame-mobile-block-head > div {
    min-width:0;
  }
  .qame-level-card .qame-mobile-block-head h2 {
    font-size:16px;
    line-height:1.2;
  }
  .qame-level-card .qame-mobile-block-head span {
    display:block;
    margin-top:3px;
    color:#8b9ab0;
    font-size:10.5px;
    line-height:1.35;
  }
  .qame-level-grid {
    align-items:start;
  }
  .qame-level-grid--five {
    grid-template-columns:repeat(5,minmax(0,1fr)) !important;
    gap:11px 4px !important;
  }
  .qame-level-grid--three {
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:12px 10px !important;
  }
  .qame-level-grid--five .qame-mobile-dedicated-action {
    font-size:9.5px;
    line-height:1.15;
  }
  .qame-level-grid--five .qame-mobile-dedicated-action .icon {
    width:45px;
    height:45px;
    border-radius:14px;
    font-size:21px;
  }
  .qame-level-grid--three .qame-mobile-dedicated-action {
    font-size:10px;
    line-height:1.2;
  }
  .qame-level-grid .qame-mobile-dedicated-action > span:last-child {
    max-width:100%;
    overflow-wrap:anywhere;
  }
}

@media (max-width: 359.98px) {
  .qame-level-grid--five .qame-mobile-dedicated-action .icon {
    width:41px;
    height:41px;
    font-size:19px;
  }
  .qame-level-grid--five .qame-mobile-dedicated-action {
    font-size:8.8px;
  }
}

/* ========================================================================== */
/* v1.0.18 — Participant My Trainings mobile polish                           */
/* Scoped entirely to pages detected by mobile.js as the live participant     */
/* training portal. Desktop/tablet markup and behavior are unchanged.          */
/* ========================================================================== */
@media (max-width: 767.98px) {
  html.qame-mobile-app body.qame-mobile-training-enhanced {
    --qame-training-gap: 12px;
    background: #f4f7fb !important;
  }

  body.qame-mobile-training-enhanced .qame-training-hide-breadcrumb,
  body.qame-mobile-training-enhanced footer.content-footer,
  body.qame-mobile-training-enhanced .content-footer,
  body.qame-mobile-training-enhanced .qame-training-dashboard-link {
    display: none !important;
  }

  body.qame-mobile-training-enhanced .container-xxl,
  body.qame-mobile-training-enhanced .container-fluid,
  body.qame-mobile-training-enhanced .container-p-y {
    max-width: 100% !important;
  }

  /* Keep the page identity, but remove desktop-scale vertical space. */
  body.qame-mobile-training-enhanced h1,
  body.qame-mobile-training-enhanced h2,
  body.qame-mobile-training-enhanced h3 {
    letter-spacing: -.015em;
  }

  /* Compact Participant Portal introduction. */
  body.qame-mobile-training-enhanced .qame-training-hero {
    margin-bottom: var(--qame-training-gap) !important;
    border: 1px solid #e8eef6 !important;
    border-radius: 18px !important;
    box-shadow: none !important;
    overflow: hidden;
  }
  body.qame-mobile-training-enhanced .qame-training-hero .card-body,
  body.qame-mobile-training-enhanced .qame-training-hero > .p-3,
  body.qame-mobile-training-enhanced .qame-training-hero > .p-4 {
    padding: 15px !important;
  }
  body.qame-mobile-training-enhanced .qame-training-hero h1,
  body.qame-mobile-training-enhanced .qame-training-hero h2,
  body.qame-mobile-training-enhanced .qame-training-hero h3,
  body.qame-mobile-training-enhanced .qame-training-hero h4 {
    margin-bottom: 5px !important;
    font-size: 20px !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
    color: #17395f !important;
  }
  body.qame-mobile-training-enhanced .qame-training-hero p {
    margin-bottom: 0 !important;
    font-size: 12px !important;
    line-height: 1.45 !important;
    color: #8190a4 !important;
  }
  body.qame-mobile-training-enhanced .qame-training-hero .badge {
    margin-bottom: 8px !important;
    font-size: 10px !important;
    border-radius: 7px !important;
  }

  /* Four compact summary cells instead of tall 2x2 statistic cards. */
  body.qame-mobile-training-enhanced .qame-training-stat-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 7px !important;
    margin-bottom: var(--qame-training-gap) !important;
  }
  body.qame-mobile-training-enhanced .qame-training-stat-grid > [class*="col"],
  body.qame-mobile-training-enhanced .qame-training-stat-grid > .qame-training-stat-card {
    width: auto !important;
    max-width: none !important;
    flex: none !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  body.qame-mobile-training-enhanced .qame-training-stat-card {
    min-width: 0 !important;
    min-height: 86px !important;
    padding: 10px 7px !important;
    border: 1px solid #e8eef6 !important;
    border-radius: 15px !important;
    box-shadow: none !important;
    background: #fff !important;
    overflow: hidden;
  }
  body.qame-mobile-training-enhanced .qame-training-stat-card .card-body {
    padding: 0 !important;
  }
  body.qame-mobile-training-enhanced .qame-training-stat-card .avatar,
  body.qame-mobile-training-enhanced .qame-training-stat-card [class*="icon-box"],
  body.qame-mobile-training-enhanced .qame-training-stat-card .rounded-circle {
    transform: scale(.82);
    transform-origin: top right;
  }
  body.qame-mobile-training-enhanced .qame-training-stat-card h3,
  body.qame-mobile-training-enhanced .qame-training-stat-card h4,
  body.qame-mobile-training-enhanced .qame-training-stat-card .h3,
  body.qame-mobile-training-enhanced .qame-training-stat-card .h4 {
    margin: 4px 0 2px !important;
    font-size: 20px !important;
    line-height: 1 !important;
    font-weight: 850 !important;
    color: #233d5c !important;
  }
  body.qame-mobile-training-enhanced .qame-training-stat-card p,
  body.qame-mobile-training-enhanced .qame-training-stat-card small,
  body.qame-mobile-training-enhanced .qame-training-stat-card span {
    font-size: 9px !important;
    line-height: 1.25 !important;
  }

  /* Search + status filter condensed into one clean mobile card. */
  body.qame-mobile-training-enhanced .qame-training-filter-card {
    margin-bottom: var(--qame-training-gap) !important;
    padding: 13px !important;
    border: 1px solid #e8eef6 !important;
    border-radius: 18px !important;
    box-shadow: none !important;
    background: #fff !important;
  }
  body.qame-mobile-training-enhanced .qame-training-filter-card .card-body {
    padding: 0 !important;
  }
  body.qame-mobile-training-enhanced .qame-training-filter-card label {
    margin-bottom: 5px !important;
    color: #2a425e !important;
    font-size: 11px !important;
    font-weight: 700 !important;
  }
  body.qame-mobile-training-enhanced .qame-training-filter-card input,
  body.qame-mobile-training-enhanced .qame-training-filter-card select,
  body.qame-mobile-training-enhanced .qame-training-filter-card .form-control,
  body.qame-mobile-training-enhanced .qame-training-filter-card .form-select,
  body.qame-mobile-training-enhanced .qame-training-filter-card .btn {
    min-height: 43px !important;
    border-radius: 12px !important;
    font-size: 12px !important;
  }

  /* Individual training cards: readable title, restrained metadata and a stable
     one-line Details control instead of the narrow multi-line button. */
  body.qame-mobile-training-enhanced .qame-training-record {
    position: relative;
    margin-bottom: 11px !important;
    border: 1px solid #e5edf6 !important;
    border-radius: 18px !important;
    box-shadow: 0 5px 14px rgba(31, 67, 112, .045) !important;
    background: #fff !important;
    overflow: hidden;
  }
  body.qame-mobile-training-enhanced .qame-training-record .card-body {
    padding: 14px !important;
  }
  body.qame-mobile-training-enhanced .qame-training-record h4,
  body.qame-mobile-training-enhanced .qame-training-record h5,
  body.qame-mobile-training-enhanced .qame-training-record h6,
  body.qame-mobile-training-enhanced .qame-training-record .card-title,
  body.qame-mobile-training-enhanced .qame-training-record strong {
    color: #263f5c;
  }
  body.qame-mobile-training-enhanced .qame-training-record .card-title,
  body.qame-mobile-training-enhanced .qame-training-record h4,
  body.qame-mobile-training-enhanced .qame-training-record h5 {
    margin-bottom: 5px !important;
    padding-right: 78px;
    font-size: 14px !important;
    line-height: 1.25 !important;
    font-weight: 800 !important;
  }
  body.qame-mobile-training-enhanced .qame-training-record p,
  body.qame-mobile-training-enhanced .qame-training-record small,
  body.qame-mobile-training-enhanced .qame-training-record .text-muted {
    font-size: 10.5px !important;
    line-height: 1.4 !important;
    color: #8a98aa !important;
  }
  body.qame-mobile-training-enhanced .qame-training-open {
    min-width: 74px !important;
    width: auto !important;
    min-height: 38px !important;
    height: 38px !important;
    padding: 0 10px !important;
    border-radius: 12px !important;
    white-space: nowrap !important;
    line-height: 36px !important;
    font-size: 11px !important;
    text-align: center !important;
  }
  body.qame-mobile-training-enhanced .qame-training-status-badge {
    display: inline-flex !important;
    align-items: center;
    width: auto !important;
    min-height: 24px;
    padding: 4px 9px !important;
    border-radius: 999px !important;
    font-size: 9px !important;
    font-weight: 800 !important;
    letter-spacing: .025em;
    text-transform: uppercase;
  }
  body.qame-mobile-training-enhanced .qame-training-record.is-clickable {
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }
  body.qame-mobile-training-enhanced .qame-training-record.is-clickable:active {
    transform: scale(.995);
  }

  /* Use the same production mobile footer as dedicated QAME pages and keep it
     clear of the fixed bottom navigation / raised QR button. */
  body.qame-mobile-training-enhanced .qame-mobile-training-enhanced-footer {
    margin-top: 22px;
  }
}

@media (max-width: 350px) {
  body.qame-mobile-training-enhanced .qame-training-stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* QAME_MOBILE_TYPOGRAPHY_STABILITY_V1_0_47_0
 *
 * Global mobile-shell protection for phones with larger text/accessibility
 * settings. We intentionally keep text-size-adjust at 100% rather than
 * disabling it so the UI remains accessibility-friendly while preventing
 * browser auto-inflation from unexpectedly breaking compact QAME layouts.
 */
@media (max-width: 767.98px) {
  html.qame-mobile-app,
  html.qame-mobile-app body {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
  }

  html.qame-mobile-app *,
  html.qame-mobile-app *::before,
  html.qame-mobile-app *::after {
    box-sizing: border-box;
  }

  /* Flex/grid children must be allowed to shrink instead of forcing cards,
     headers, sheets, or rows wider than the phone viewport. */
  html.qame-mobile-app .qame-mobile-topbar > *,
  html.qame-mobile-app .qame-mobile-brand,
  html.qame-mobile-app .qame-mobile-brand-copy,
  html.qame-mobile-app .qame-mobile-block-head > *,
  html.qame-mobile-app .qame-mobile-link-row > *,
  html.qame-mobile-app .qame-mobile-profile-identity > *,
  html.qame-mobile-app .qame-mobile-profile-copy,
  html.qame-mobile-app .qame-mobile-profile-card .identity > *,
  html.qame-mobile-app .qame-mobile-bottom-item,
  html.qame-mobile-app .qame-mobile-sheet-link,
  html.qame-mobile-app [class*="qame-training-card"] > * {
    min-width: 0;
  }

  /* Keep the always-visible app-shell controls stable. These labels must not
     wrap and increase the fixed header/bottom-nav height on large-font phones. */
  html.qame-mobile-app .qame-mobile-brand-title {
    max-width: calc(100vw - 138px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 14px !important;
    line-height: 1.1 !important;
  }

  html.qame-mobile-app .qame-mobile-brand-subtitle {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 10px !important;
    line-height: 1.2 !important;
  }

  html.qame-mobile-app .qame-mobile-help-btn,
  html.qame-mobile-app .qame-mobile-help-btn > span {
    white-space: nowrap;
    font-size: 12px !important;
    line-height: 1.15 !important;
  }

  html.qame-mobile-app .qame-mobile-bottom-item {
    min-height: 54px;
    height: auto;
  }

  html.qame-mobile-app .qame-mobile-bottom-item > span:last-child:not(.qame-mobile-bottom-icon):not(.qame-mobile-fab-wrap),
  html.qame-mobile-app .qame-mobile-fab-wrap > span:last-child,
  html.qame-mobile-app .qame-nav-label-v1032 {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap !important;
    font-size: 9.5px !important;
    line-height: 1.15 !important;
  }

  /* Compact status controls should stay one-line and use min-height rather
     than fixed height. This protects badges/buttons while allowing larger
     accessible controls when their component permits it. */
  html.qame-mobile-app .qame-mobile-dedicated-hero .eyebrow,
  html.qame-mobile-app .badge,
  html.qame-mobile-app [class*="requirement-chip"],
  html.qame-mobile-app [class*="training-view"],
  html.qame-mobile-app [class*="status-badge"] {
    white-space: nowrap;
  }

  html.qame-mobile-app button,
  html.qame-mobile-app .btn,
  html.qame-mobile-app a[class*="action"],
  html.qame-mobile-app a[class*="button"] {
    max-width: 100%;
  }

  /* Inputs remain usable without being forced into a fixed height by font
     scaling. Existing component min-heights remain the lower bound. */
  html.qame-mobile-app input,
  html.qame-mobile-app select,
  html.qame-mobile-app textarea,
  html.qame-mobile-app .form-control,
  html.qame-mobile-app .form-select,
  html.qame-mobile-app .select2-selection {
    max-width: 100%;
  }

  /* Preserve deliberate two-line mobile title clamps used by QAME cards. */
  html.qame-mobile-app [style*="-webkit-line-clamp: 2"],
  html.qame-mobile-app [style*="-webkit-line-clamp:2"] {
    overflow: hidden;
  }
}

