/* Consolidated from mobile-runtime-guard.css during frontend cleanup 2026-07-08. */
/* Mobile runtime guard: keep hidden desktop/sidebar UI from deforming mobile shells. */
@media (max-width: 980px) {
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar {
    display: none !important;
    width: 0 !important;
    min-width: 0 !important;
    max-width: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    overflow: hidden !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar #sidebarUserButton {
    display: none !important;
    width: 0 !important;
    min-width: 0 !important;
    max-width: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    overflow: hidden !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  html body.view-dashboard #dashboard.active-view #homeDashboard.home-v2 .home-figma-mobile {
    display: block !important;
    width: 390px !important;
    max-width: 100vw !important;
    margin: 0 auto !important;
  }

  html body.view-dashboard #dashboard.active-view #homeDashboard.home-v2 .home-figma-goal-rail {
    left: 16px !important;
    top: 16px !important;
    width: 322px !important;
    height: 66px !important;
    min-width: 322px !important;
    max-width: 322px !important;
    min-height: 66px !important;
    max-height: 66px !important;
    overflow: hidden !important;
    border-radius: 24px !important;
    transform: none !important;
  }

  html body.view-dashboard #dashboard.active-view #homeDashboard.home-v2 .home-figma-avatar-tile {
    left: 10px !important;
    top: 8px !important;
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    max-width: 46px !important;
    min-height: 46px !important;
    max-height: 46px !important;
    overflow: hidden !important;
    border-radius: 50% !important;
    transform: none !important;
  }

  html body.view-dashboard #dashboard.active-view #homeDashboard.home-v2 .home-figma-avatar-tile img,
  html body.view-dashboard #dashboard.active-view #homeDashboard.home-v2 .home-figma-avatar-tile .home-figma-logo-img {
    display: block !important;
    position: absolute !important;
    left: -4px !important;
    top: -5px !important;
    width: 54px !important;
    height: 54px !important;
    max-width: none !important;
    max-height: none !important;
    object-fit: cover !important;
    border-radius: 50% !important;
    transform: none !important;
  }

  html body.view-dashboard #dashboard.active-view #homeDashboard.home-v2 .home-figma-goal-copy {
    left: 70px !important;
    right: 18px !important;
    top: 20px !important;
    z-index: 2 !important;
    display: flex !important;
    align-items: baseline !important;
    justify-content: flex-start !important;
    gap: 13px !important;
    width: auto !important;
    max-width: 218px !important;
    height: 26px !important;
    min-width: 0 !important;
    overflow: visible !important;
    white-space: nowrap !important;
    transform: none !important;
  }

  html body.view-dashboard #dashboard.active-view #homeDashboard.home-v2 .home-figma-goal-copy > span {
    display: inline-flex !important;
    align-items: baseline !important;
    flex: 0 1 auto !important;
    min-width: 0 !important;
    max-width: 116px !important;
    gap: 3px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  html body.view-dashboard #dashboard.active-view #homeDashboard.home-v2 .home-figma-goal-copy > span:nth-child(2) {
    max-width: 132px !important;
  }

  html body.view-dashboard #dashboard.active-view #homeDashboard.home-v2 .home-figma-goal-copy em {
    display: inline-block !important;
    min-width: 13px !important;
    font-size: 20px !important;
    font-weight: 720 !important;
    line-height: 20px !important;
    text-align: center !important;
    transform: translateY(1px) !important;
  }
}

/* Final desktop-only navigation lock. Loaded last to keep every section aligned. */
@media (min-width: 981px) {
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-community) .app-shell > .sidebar,
  html body .app-shell > .sidebar {
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "PingFang SC", "Microsoft YaHei", Arial, sans-serif;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > .nav-list,
  html body .app-shell > .sidebar > .nav-list {
    box-sizing: border-box !important;
    transform: none !important;
    transition: none !important;
    will-change: auto !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > .nav-list > .nav-link,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > .nav-list > .nav-link:hover,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > .nav-list > .nav-link:active,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > .nav-list > .nav-link:focus-visible,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > .nav-list > .nav-link.active,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > .nav-list > .nav-link.active:hover,
  html body .app-shell > .sidebar > .nav-list > .nav-link,
  html body .app-shell > .sidebar > .nav-list > .nav-link:hover,
  html body .app-shell > .sidebar > .nav-list > .nav-link:active,
  html body .app-shell > .sidebar > .nav-list > .nav-link:focus-visible,
  html body .app-shell > .sidebar > .nav-list > .nav-link.active,
  html body .app-shell > .sidebar > .nav-list > .nav-link.active:hover {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: var(--desktop-nav-item-gap, 7px) !important;
    box-sizing: border-box !important;
    flex: 0 0 var(--desktop-nav-item-width, 86px) !important;
    width: var(--desktop-nav-item-width, 86px) !important;
    min-width: var(--desktop-nav-item-min-width, 86px) !important;
    max-width: var(--desktop-nav-item-max-width, 86px) !important;
    height: var(--desktop-nav-item-height, 50px) !important;
    min-height: var(--desktop-nav-item-height, 50px) !important;
    max-height: var(--desktop-nav-item-height, 50px) !important;
    padding: var(--desktop-nav-item-padding, 0 12px) !important;
    overflow: var(--desktop-nav-item-overflow, hidden) !important;
    border: var(--desktop-nav-item-border, 1px solid rgba(255, 255, 255, 0.76)) !important;
    border-radius: var(--desktop-nav-item-radius, 25px) !important;
    color: rgba(29, 42, 53, 0.84) !important;
    font-family: inherit !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 20px !important;
    letter-spacing: 0 !important;
    background: var(
      --desktop-nav-item-background,
      linear-gradient(145deg, rgba(255, 255, 255, 0.66), rgba(255, 255, 255, 0.34)), rgba(255, 255, 255, 0.36)
    ) !important;
    box-shadow: var(
      --desktop-nav-item-shadow,
      0 14px 28px -24px rgba(45, 66, 82, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.94), inset 0 -1px 0 rgba(31, 48, 61, 0.045)
    ) !important;
    -webkit-backdrop-filter: blur(18px) saturate(1.12) !important;
    backdrop-filter: blur(18px) saturate(1.12) !important;
    transform: none !important;
    will-change: auto !important;
    transition:
      background 120ms ease,
      border-color 120ms ease,
      box-shadow 120ms ease,
      color 120ms ease !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > .nav-list > .nav-link:not(.active):hover,
  html body .app-shell > .sidebar > .nav-list > .nav-link:not(.active):hover {
    background: var(--desktop-nav-item-hover-background, rgba(255, 255, 255, 0.42)) !important;
    border-color: var(--desktop-nav-item-hover-border, rgba(255, 255, 255, 0.7)) !important;
    box-shadow: var(
      --desktop-nav-item-hover-shadow,
      0 14px 24px -22px rgba(157, 104, 5, 0.16), inset 0 1px 12px rgba(255, 255, 255, 0.5), inset 0 -10px 18px rgba(255, 228, 128, 0.1)
    ) !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > .nav-list > .nav-link.active,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > .nav-list > .nav-link.active:hover,
  html body .app-shell > .sidebar > .nav-list > .nav-link.active,
  html body .app-shell > .sidebar > .nav-list > .nav-link.active:hover {
    border-color: var(--desktop-nav-item-active-border, rgba(255, 255, 255, 0.74)) !important;
    background: var(--desktop-nav-item-active-background, rgba(255, 255, 255, 0.5)) !important;
    box-shadow: var(
      --desktop-nav-item-active-shadow,
      0 16px 30px -24px rgba(24, 112, 223, 0.2), inset 0 1px 14px rgba(255, 255, 255, 0.58), inset 0 -10px 18px rgba(24, 112, 223, 0.04)
    ) !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > .nav-list > .nav-link.active > .icon,
  html body .app-shell > .sidebar > .nav-list > .nav-link.active > .icon {
    color: var(--dashboard-nav-active-color, #2fb996) !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > .nav-list > .nav-link.admin-access-only.is-hidden,
  html body .app-shell > .sidebar > .nav-list > .nav-link.admin-access-only.is-hidden {
    display: none !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > .nav-list > .nav-link > .icon,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > .nav-list > .nav-link:hover > .icon,
  html body .app-shell > .sidebar > .nav-list > .nav-link > .icon,
  html body .app-shell > .sidebar > .nav-list > .nav-link:hover > .icon {
    position: static !important;
    display: grid !important;
    width: var(--desktop-nav-icon-size, 20px) !important;
    min-width: var(--desktop-nav-icon-size, 20px) !important;
    max-width: var(--desktop-nav-icon-size, 20px) !important;
    height: var(--desktop-nav-icon-size, 20px) !important;
    min-height: var(--desktop-nav-icon-size, 20px) !important;
    max-height: var(--desktop-nav-icon-size, 20px) !important;
    margin: 0 !important;
    place-items: center !important;
    color: var(--dashboard-nav-icon-color, rgba(55, 68, 83, 0.76)) !important;
    background: var(--dashboard-nav-icon-bg, transparent) !important;
    border: var(--dashboard-nav-icon-border, 0) !important;
    border-radius: var(--desktop-nav-icon-radius, 8px) !important;
    box-shadow: var(--dashboard-nav-icon-shadow, none) !important;
    transform: none !important;
    transition: color 120ms ease !important;
    will-change: auto !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > .nav-list > .nav-link > span:not(.icon),
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > .nav-list > .nav-link:hover > span:not(.icon),
  html body .app-shell > .sidebar > .nav-list > .nav-link > span:not(.icon),
  html body .app-shell > .sidebar > .nav-list > .nav-link:hover > span:not(.icon) {
    position: static !important;
    display: block !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 20px !important;
    min-height: 20px !important;
    max-height: 20px !important;
    overflow: visible !important;
    color: inherit !important;
    font-family: inherit !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 20px !important;
    letter-spacing: 0 !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
    transform: none !important;
    transition: color 120ms ease !important;
    will-change: auto !important;
  }

  .nav-ai-link {
    --desktop-nav-item-gap: 0;
    --desktop-nav-item-width: 50px;
    --desktop-nav-item-min-width: 50px;
    --desktop-nav-item-max-width: 50px;
    --desktop-nav-item-height: 50px;
    --desktop-nav-item-padding: 0;
    --desktop-nav-item-overflow: visible;
    --desktop-nav-item-radius: 50%;
    --desktop-nav-item-border: 1px solid rgba(255, 255, 255, 0.96);
    --desktop-nav-item-background: rgba(255, 254, 250, 0.78);
    --desktop-nav-item-shadow: 0 0 0 6px rgba(255, 211, 78, 0.13), 0 13px 24px -10px rgba(86, 62, 5, 0.32), inset 0 1px 1px rgba(255, 255, 255, 0.94);
    --desktop-nav-item-hover-background: rgba(255, 255, 255, 0.9);
    --desktop-nav-item-hover-border: rgba(255, 255, 255, 0.98);
    --desktop-nav-item-hover-shadow: 0 0 0 8px rgba(255, 211, 78, 0.2), 0 16px 28px -10px rgba(86, 62, 5, 0.36), inset 0 1px 1px rgba(255, 255, 255, 0.96);
    --desktop-nav-item-active-background: rgba(255, 255, 255, 0.92);
    --desktop-nav-item-active-border: rgba(255, 255, 255, 0.98);
    --desktop-nav-item-active-shadow: 0 0 0 9px rgba(255, 211, 78, 0.24), 0 17px 30px -10px rgba(54, 153, 126, 0.38), inset 0 1px 1px rgba(255, 255, 255, 0.98);
    --desktop-nav-icon-size: 40px;
    --desktop-nav-icon-radius: 50%;
    --dashboard-nav-icon-bg: #ffd34e;
    --dashboard-nav-icon-border: 1px solid rgba(255, 255, 255, 0.96);
    --dashboard-nav-icon-shadow: 0 8px 14px -9px rgba(21, 32, 51, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.84);
  }

  .nav-ai-link .nav-ai-icon img {
    display: block;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 50%;
    object-fit: cover;
    object-position: center 42%;
  }

  .nav-ai-link .nav-ai-status {
    position: absolute;
    right: 2px;
    top: 2px;
    z-index: 3;
    display: block;
    width: 10px;
    height: 10px;
    max-width: none;
    filter: drop-shadow(0 3px 5px rgba(21, 153, 103, 0.3));
    pointer-events: none;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > button#sidebarUserButton.sidebar-user-card,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > button#sidebarUserButton.sidebar-user-card.is-logged-in,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > button#sidebarUserButton.sidebar-user-card:hover,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > button#sidebarUserButton.sidebar-user-card:active,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > button#sidebarUserButton.sidebar-user-card:focus-visible,
  html body .app-shell > .sidebar button#sidebarUserButton.sidebar-user-card,
  html body .app-shell > .sidebar button#sidebarUserButton.sidebar-user-card.is-logged-in,
  html body .app-shell > .sidebar button#sidebarUserButton.sidebar-user-card:hover,
  html body .app-shell > .sidebar button#sidebarUserButton.sidebar-user-card:active,
  html body .app-shell > .sidebar button#sidebarUserButton.sidebar-user-card:focus-visible {
    position: absolute !important;
    inset: 9px 18px auto auto !important;
    display: grid !important;
    grid-template-columns: 38px minmax(0, 1fr) 20px !important;
    align-items: center !important;
    gap: 10px !important;
    box-sizing: border-box !important;
    width: 216px !important;
    min-width: 216px !important;
    max-width: 216px !important;
    height: 52px !important;
    min-height: 52px !important;
    max-height: 52px !important;
    padding: 6px 10px !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 255, 255, 0.76) !important;
    border-radius: 28px !important;
    color: rgba(29, 42, 53, 0.86) !important;
    background:
      linear-gradient(145deg, rgba(255, 255, 255, 0.68), rgba(255, 255, 255, 0.34)),
      rgba(255, 255, 255, 0.38) !important;
    box-shadow:
      0 14px 28px -24px rgba(45, 66, 82, 0.34),
      inset 0 1px 0 rgba(255, 255, 255, 0.94),
      inset 0 -1px 0 rgba(31, 48, 61, 0.05) !important;
    -webkit-backdrop-filter: blur(18px) saturate(1.12) !important;
    backdrop-filter: blur(18px) saturate(1.12) !important;
    transform: none !important;
    will-change: auto !important;
    transition:
      background 120ms ease,
      border-color 120ms ease,
      box-shadow 120ms ease,
      color 120ms ease !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > button#sidebarUserButton.sidebar-user-card > img,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > button#sidebarUserButton.sidebar-user-card.is-logged-in > img,
  html body .app-shell > .sidebar button#sidebarUserButton.sidebar-user-card > img,
  html body .app-shell > .sidebar button#sidebarUserButton.sidebar-user-card.is-logged-in > img {
    grid-column: 1 !important;
    position: static !important;
    display: block !important;
    width: 38px !important;
    min-width: 38px !important;
    max-width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
    max-height: 38px !important;
    margin: 0 !important;
    border-radius: 50% !important;
    object-fit: cover !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > button#sidebarUserButton.sidebar-user-card > span,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > button#sidebarUserButton.sidebar-user-card.is-logged-in > span,
  html body .app-shell > .sidebar button#sidebarUserButton.sidebar-user-card > span,
  html body .app-shell > .sidebar button#sidebarUserButton.sidebar-user-card.is-logged-in > span {
    grid-column: 2 !important;
    position: static !important;
    display: grid !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 1px !important;
    overflow: hidden !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > button#sidebarUserButton.sidebar-user-card > span > strong,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > button#sidebarUserButton.sidebar-user-card.is-logged-in > span > strong,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > button#sidebarUserButton.sidebar-user-card > span > small,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > button#sidebarUserButton.sidebar-user-card.is-logged-in > span > small,
  html body .app-shell > .sidebar button#sidebarUserButton.sidebar-user-card > span > strong,
  html body .app-shell > .sidebar button#sidebarUserButton.sidebar-user-card.is-logged-in > span > strong,
  html body .app-shell > .sidebar button#sidebarUserButton.sidebar-user-card > span > small,
  html body .app-shell > .sidebar button#sidebarUserButton.sidebar-user-card.is-logged-in > span > small {
    display: block !important;
    position: static !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > button#sidebarUserButton.sidebar-user-card > span > strong,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > button#sidebarUserButton.sidebar-user-card.is-logged-in > span > strong,
  html body .app-shell > .sidebar button#sidebarUserButton.sidebar-user-card > span > strong,
  html body .app-shell > .sidebar button#sidebarUserButton.sidebar-user-card.is-logged-in > span > strong {
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 17px !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > button#sidebarUserButton.sidebar-user-card > span > small,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > button#sidebarUserButton.sidebar-user-card.is-logged-in > span > small,
  html body .app-shell > .sidebar button#sidebarUserButton.sidebar-user-card > span > small,
  html body .app-shell > .sidebar button#sidebarUserButton.sidebar-user-card.is-logged-in > span > small {
    font-size: 10px !important;
    font-weight: 700 !important;
    line-height: 14px !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > button#sidebarUserButton.sidebar-user-card > b,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > button#sidebarUserButton.sidebar-user-card.is-logged-in > b,
  html body .app-shell > .sidebar button#sidebarUserButton.sidebar-user-card > b,
  html body .app-shell > .sidebar button#sidebarUserButton.sidebar-user-card.is-logged-in > b {
    grid-column: 3 !important;
    position: static !important;
    display: grid !important;
    width: var(--desktop-nav-icon-size, 20px) !important;
    min-width: var(--desktop-nav-icon-size, 20px) !important;
    max-width: var(--desktop-nav-icon-size, 20px) !important;
    height: var(--desktop-nav-icon-size, 20px) !important;
    min-height: var(--desktop-nav-icon-size, 20px) !important;
    max-height: var(--desktop-nav-icon-size, 20px) !important;
    margin: 0 !important;
    place-items: center !important;
    color: #2fb996 !important;
    font-size: 0 !important;
    line-height: 20px !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community) .app-shell > .sidebar > button#sidebarUserButton.sidebar-user-card > b::before,
  html body .app-shell > .sidebar button#sidebarUserButton.sidebar-user-card > b::before {
    content: "" !important;
    display: block !important;
    width: 7px !important;
    height: 7px !important;
    border-right: 1.8px solid currentColor !important;
    border-bottom: 1.8px solid currentColor !important;
    border-radius: 1px !important;
    transform: rotate(-45deg) !important;
  }
}

/* Shared compact navigation: keep all four destinations clear before the mobile shell takes over. */
@media (min-width: 981px) and (max-width: 1240px) {
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar {
    --dashboard-nav-icon-color: rgba(55, 68, 83, 0.76);
    --dashboard-nav-icon-bg: linear-gradient(145deg, rgba(255, 255, 255, 0.74), rgba(232, 246, 243, 0.4));
    --dashboard-nav-icon-border: 1px solid rgba(255, 255, 255, 0.68);
    --dashboard-nav-icon-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 8px 14px -12px rgba(42, 67, 72, 0.36);
    --dashboard-nav-active-color: #2fb996;
    position: fixed !important;
    inset: 0 auto auto 20px !important;
    z-index: 150 !important;
    display: grid !important;
    grid-template-columns: minmax(172px, 236px) minmax(0, 1fr) 52px !important;
    align-items: center !important;
    column-gap: 8px !important;
    box-sizing: border-box !important;
    width: calc(100vw - 40px) !important;
    min-width: 0 !important;
    max-width: calc(100vw - 40px) !important;
    height: 64px !important;
    min-height: 64px !important;
    max-height: 64px !important;
    margin: 0 !important;
    padding: 8px 10px !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 255, 255, 0.66) !important;
    border-radius: 24px !important;
    background:
      linear-gradient(145deg, rgba(255, 255, 255, 0.56), rgba(255, 255, 255, 0.24)),
      rgba(255, 255, 255, 0.28) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.88),
      inset 0 -1px 0 rgba(15, 23, 42, 0.04),
      0 16px 36px -32px rgba(15, 23, 42, 0.38) !important;
    -webkit-backdrop-filter: blur(24px) saturate(1.14) !important;
    backdrop-filter: blur(24px) saturate(1.14) !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar > .brand {
    position: relative !important;
    inset: auto !important;
    grid-column: 1 !important;
    display: grid !important;
    grid-template-columns: 42px minmax(0, 1fr) !important;
    grid-template-rows: 48px !important;
    align-items: center !important;
    row-gap: 0 !important;
    column-gap: 10px !important;
    box-sizing: border-box !important;
    width: 236px !important;
    min-width: 0 !important;
    max-width: 236px !important;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    margin: 0 !important;
    padding: 0 6px !important;
    overflow: hidden !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar .brand-icon {
    position: static !important;
    display: block !important;
    width: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    max-height: 42px !important;
    margin: 0 !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    align-self: center !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar .brand-copy {
    position: static !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: 22px 20px !important;
    gap: 2px !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 44px !important;
    align-self: center !important;
    margin: 0 !important;
    overflow: hidden !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar .brand-copy > strong {
    position: static !important;
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 22px !important;
    min-height: 22px !important;
    max-height: 22px !important;
    align-self: center !important;
    margin: 0 !important;
    overflow: hidden !important;
    color: rgba(17, 19, 24, 0.94) !important;
    font-size: 19px !important;
    font-weight: 860 !important;
    line-height: 22px !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar .brand .brand-copy .exam-type-picker,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar .brand .exam-type-picker,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar .exam-type-picker {
    position: relative !important;
    inset: auto !important;
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 20px !important;
    min-height: 20px !important;
    max-height: 20px !important;
    margin: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    transform: none !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar .brand .brand-copy .exam-type-picker select,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar .brand .exam-type-picker select,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar .exam-type-picker select {
    position: static !important;
    display: block !important;
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 20px !important;
    min-height: 20px !important;
    max-height: 20px !important;
    margin: 0 !important;
    padding: 0 16px 0 0 !important;
    border: 0 !important;
    color: rgba(56, 67, 82, 0.72) !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: 12px !important;
    font-weight: 680 !important;
    line-height: 20px !important;
    text-align: left !important;
    text-align-last: left !important;
    appearance: none !important;
    -webkit-appearance: none !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar .brand .brand-copy .exam-type-picker::after,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar .brand .exam-type-picker::after,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar .exam-type-picker::after {
    content: "" !important;
    position: absolute !important;
    left: auto !important;
    right: 3px !important;
    top: 5px !important;
    display: block !important;
    width: 5px !important;
    height: 5px !important;
    border: 0 !important;
    border-right: 1.5px solid rgba(24, 112, 223, 0.68) !important;
    border-bottom: 1.5px solid rgba(24, 112, 223, 0.68) !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: rotate(45deg) !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar > .nav-list {
    position: static !important;
    inset: auto !important;
    grid-column: 2 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar > .nav-list > .nav-link {
    flex: 0 1 var(--desktop-nav-item-width, 80px) !important;
    width: var(--desktop-nav-item-width, 80px) !important;
    min-width: var(--desktop-nav-item-min-width, 68px) !important;
    max-width: var(--desktop-nav-item-max-width, 80px) !important;
    height: var(--desktop-nav-item-height, 44px) !important;
    min-height: var(--desktop-nav-item-height, 44px) !important;
    max-height: var(--desktop-nav-item-height, 44px) !important;
    padding: var(--desktop-nav-item-padding, 0 9px) !important;
    border-radius: var(--desktop-nav-item-radius, 22px) !important;
    font-size: 12px !important;
  }

  .nav-ai-link {
    --desktop-nav-item-width: 44px;
    --desktop-nav-item-min-width: 44px;
    --desktop-nav-item-max-width: 44px;
    --desktop-nav-item-height: 44px;
    --desktop-nav-icon-size: 36px;
    --desktop-nav-item-shadow: 0 0 0 4px rgba(255, 211, 78, 0.12), 0 10px 18px -9px rgba(86, 62, 5, 0.3), inset 0 1px 1px rgba(255, 255, 255, 0.94);
    --desktop-nav-item-hover-shadow: 0 0 0 5px rgba(255, 211, 78, 0.18), 0 12px 21px -9px rgba(86, 62, 5, 0.34), inset 0 1px 1px rgba(255, 255, 255, 0.96);
    --desktop-nav-item-active-shadow: 0 0 0 6px rgba(255, 211, 78, 0.22), 0 13px 22px -9px rgba(54, 153, 126, 0.34), inset 0 1px 1px rgba(255, 255, 255, 0.98);
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar > button#sidebarUserButton.sidebar-user-card,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar > button#sidebarUserButton.sidebar-user-card.is-logged-in {
    position: static !important;
    inset: auto !important;
    grid-column: 3 !important;
    justify-self: end !important;
    display: grid !important;
    grid-template-columns: 40px !important;
    justify-items: center !important;
    box-sizing: border-box !important;
    width: 48px !important;
    min-width: 48px !important;
    max-width: 48px !important;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    padding: 4px !important;
    border-radius: 999px !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar > button#sidebarUserButton.sidebar-user-card > img,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar > button#sidebarUserButton.sidebar-user-card.is-logged-in > img {
    width: 40px !important;
    min-width: 40px !important;
    max-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    max-height: 40px !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar > button#sidebarUserButton.sidebar-user-card > span,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar > button#sidebarUserButton.sidebar-user-card > b,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar > button#sidebarUserButton.sidebar-user-card.is-logged-in > span,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar > button#sidebarUserButton.sidebar-user-card.is-logged-in > b {
    display: none !important;
  }
}

/* Wide desktop navbar: every top-level route shares the homepage shell. */
@media (min-width: 1241px) {
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar {
    --dashboard-nav-icon-color: rgba(55, 68, 83, 0.76);
    --dashboard-nav-icon-bg: linear-gradient(145deg, rgba(255, 255, 255, 0.74), rgba(232, 246, 243, 0.4));
    --dashboard-nav-icon-border: 1px solid rgba(255, 255, 255, 0.68);
    --dashboard-nav-icon-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 8px 14px -12px rgba(42, 67, 72, 0.36);
    --dashboard-nav-active-color: #2fb996;
    --desktop-nav-left: 520px;
    --desktop-nav-gap: 18px;
    position: fixed !important;
    top: 0 !important;
    left: max(24px, calc((100vw - 1376px) / 2)) !important;
    right: auto !important;
    bottom: auto !important;
    z-index: 150 !important;
    display: grid !important;
    align-items: center !important;
    column-gap: 18px !important;
    width: min(1376px, calc(100vw - 64px)) !important;
    min-width: min(1376px, calc(100vw - 64px)) !important;
    max-width: min(1376px, calc(100vw - 64px)) !important;
    height: 70px !important;
    min-height: 70px !important;
    max-height: 70px !important;
    margin: 0 !important;
    padding: 8px 18px !important;
    overflow: visible !important;
    border: 1px solid rgba(255, 255, 255, 0.52) !important;
    border-radius: 24px !important;
    background:
      linear-gradient(145deg, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.22)),
      rgba(255, 255, 255, 0.26) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.82),
      inset 0 -1px 0 rgba(15, 23, 42, 0.04),
      0 18px 42px -36px rgba(15, 23, 42, 0.44) !important;
    transform: none !important;
    -webkit-backdrop-filter: blur(30px) saturate(1.18) !important;
    backdrop-filter: blur(30px) saturate(1.18) !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar:has(.community-nav-link) {
    --desktop-nav-left: 500px;
    --desktop-nav-gap: 10px;
    --desktop-nav-item-width: 78px;
    --desktop-nav-item-min-width: 72px;
    --desktop-nav-item-max-width: 78px;
    --desktop-nav-item-padding: 0 9px;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar:has(.admin-access-only:not(.is-hidden)) {
    --desktop-nav-left: clamp(420px, calc(100vw - 820px), 500px);
    --desktop-nav-gap: 12px;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar:has(.community-nav-link):has(.admin-access-only:not(.is-hidden)) {
    --desktop-nav-left: 450px;
    --desktop-nav-gap: 8px;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar > a.brand,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar > a.brand.active,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar > .brand.brand {
    position: absolute !important;
    left: 18px !important;
    top: 10px !important;
    display: grid !important;
    grid-template-columns: 48px minmax(0, 370px) !important;
    grid-template-rows: 50px !important;
    align-items: center !important;
    row-gap: 0 !important;
    column-gap: 12px !important;
    width: 430px !important;
    min-width: 430px !important;
    max-width: 430px !important;
    height: 50px !important;
    min-height: 50px !important;
    max-height: 50px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    clip: auto !important;
    color: rgba(17, 19, 24, 0.94) !important;
    text-decoration: none !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    transform: none !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar .brand-icon {
    position: static !important;
    display: block !important;
    box-sizing: border-box !important;
    width: 48px !important;
    min-width: 48px !important;
    max-width: 48px !important;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    margin: 0 !important;
    padding: 1px !important;
    border: 1px solid rgba(255, 255, 255, 0.72) !important;
    border-radius: 999px !important;
    object-fit: cover !important;
    align-self: center !important;
    background:
      linear-gradient(145deg, rgba(255, 255, 255, 0.58), rgba(255, 228, 128, 0.24)),
      rgba(255, 255, 255, 0.24) !important;
    box-shadow:
      0 10px 22px -18px rgba(42, 54, 68, 0.42),
      inset 0 1px 0 rgba(255, 255, 255, 0.92) !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar .brand-copy {
    position: static !important;
    display: grid !important;
    grid-template-columns: max-content 176px !important;
    align-items: center !important;
    gap: 18px !important;
    width: 370px !important;
    min-width: 0 !important;
    max-width: 370px !important;
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    clip: auto !important;
    background: transparent !important;
    align-self: center !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar .brand-copy strong {
    position: static !important;
    display: block !important;
    width: auto !important;
    min-width: max-content !important;
    max-width: none !important;
    height: auto !important;
    margin: 0 !important;
    overflow: visible !important;
    color: rgba(17, 19, 24, 0.94) !important;
    font-size: 22px !important;
    font-weight: 850 !important;
    line-height: 22px !important;
    letter-spacing: -0.3px !important;
    white-space: nowrap !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar .brand .brand-copy .exam-type-picker,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar .brand .exam-type-picker,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar .exam-type-picker {
    position: absolute !important;
    display: block !important;
    flex: none !important;
    width: 176px !important;
    min-width: 176px !important;
    max-width: 176px !important;
    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    left: 164px !important;
    top: 9px !important;
    right: auto !important;
    bottom: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    transform: none !important;
    border-radius: 16px !important;
    border: 1px solid rgba(255, 255, 255, 0.74) !important;
    background:
      linear-gradient(145deg, rgba(255, 255, 255, 0.72), rgba(255, 255, 255, 0.4)),
      rgba(255, 255, 255, 0.4) !important;
    box-shadow:
      0 10px 22px -20px rgba(43, 66, 82, 0.34),
      inset 0 1px 0 rgba(255, 255, 255, 0.94),
      inset 0 -1px 0 rgba(31, 48, 61, 0.04) !important;
    -webkit-backdrop-filter: blur(18px) saturate(1.1) !important;
    backdrop-filter: blur(18px) saturate(1.1) !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar .brand .brand-copy .exam-type-picker select,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar .brand .exam-type-picker select,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar .exam-type-picker select {
    position: static !important;
    display: block !important;
    box-sizing: border-box !important;
    width: 176px !important;
    min-width: 0 !important;
    max-width: 176px !important;
    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    margin: 0 !important;
    padding: 0 30px 0 16px !important;
    border: 0 !important;
    border-radius: 16px !important;
    color: rgba(38, 48, 64, 0.78) !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: 14px !important;
    font-weight: 720 !important;
    line-height: 32px !important;
    text-align: center !important;
    text-align-last: center !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    transform: none !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar .brand .brand-copy .exam-type-picker::after,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar .brand .exam-type-picker::after,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar .exam-type-picker::after {
    content: "" !important;
    position: absolute !important;
    right: 15px !important;
    left: auto !important;
    top: 50% !important;
    display: block !important;
    width: 7px !important;
    height: 7px !important;
    border: 0 !important;
    border-right: 1.8px solid rgba(24, 112, 223, 0.68) !important;
    border-bottom: 1.8px solid rgba(24, 112, 223, 0.68) !important;
    border-radius: 1px !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: 0 !important;
    line-height: 1 !important;
    transform: translateY(-60%) rotate(45deg) !important;
    pointer-events: none !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar > .nav-list {
    position: absolute !important;
    left: var(--desktop-nav-left) !important;
    right: auto !important;
    top: 8.85px !important;
    bottom: auto !important;
    z-index: 4 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    justify-self: start !important;
    gap: var(--desktop-nav-gap) !important;
    width: max-content !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 50px !important;
    min-height: 50px !important;
    max-height: 50px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar > .nav-list > .nav-link > .icon,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar > .nav-list > .nav-link:hover > .icon,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar > .nav-list > .nav-link.active > .icon {
    position: static !important;
    display: grid !important;
    width: var(--desktop-nav-icon-size, 20px) !important;
    min-width: var(--desktop-nav-icon-size, 20px) !important;
    max-width: var(--desktop-nav-icon-size, 20px) !important;
    height: var(--desktop-nav-icon-size, 20px) !important;
    min-height: var(--desktop-nav-icon-size, 20px) !important;
    max-height: var(--desktop-nav-icon-size, 20px) !important;
    margin: 0 !important;
    padding: 0 !important;
    place-items: center !important;
    color: var(--dashboard-nav-icon-color, rgba(55, 68, 83, 0.76)) !important;
    background: var(--dashboard-nav-icon-bg, transparent) !important;
    border: var(--dashboard-nav-icon-border, 0) !important;
    border-radius: var(--desktop-nav-icon-radius, 8px) !important;
    box-shadow: var(--dashboard-nav-icon-shadow, none) !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar > .nav-list > .nav-link > .icon svg,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar > .nav-list > .nav-link:hover > .icon svg,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar > .nav-list > .nav-link.active > .icon svg {
    display: block !important;
    width: 18px !important;
    min-width: 18px !important;
    max-width: 18px !important;
    height: 18px !important;
    min-height: 18px !important;
    max-height: 18px !important;
    overflow: visible !important;
    color: currentColor !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.85 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar > .nav-list > .nav-link > .icon svg :is(path, circle, rect, line, polyline, polygon),
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar > .nav-list > .nav-link:hover > .icon svg :is(path, circle, rect, line, polyline, polygon),
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar > .nav-list > .nav-link.active > .icon svg :is(path, circle, rect, line, polyline, polygon) {
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.85 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar > .nav-list > .nav-link.active > .icon {
    color: var(--dashboard-nav-active-color, #2fb996) !important;
  }

  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar button#sidebarUserButton.sidebar-user-card,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar button#sidebarUserButton.sidebar-user-card.is-logged-in {
    -webkit-backdrop-filter: blur(18px) saturate(1.12) !important;
    backdrop-filter: blur(18px) saturate(1.12) !important;
  }
}

/* Desktop account micro polish: keep the membership chip visually quiet. */
@media (min-width: 1241px) {
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar button#sidebarUserButton.sidebar-user-card > span > small,
  html body:is(.view-dashboard, .view-practice, .view-mock, .view-profile, .view-mp3, .view-mistakes, .view-admin, .view-agent, .view-community):not(.figma-answer-265-active) .app-shell > .sidebar button#sidebarUserButton.sidebar-user-card.is-logged-in > span > small {
    display: block !important;
    width: fit-content !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 16px !important;
    padding: 0 7px !important;
    border-radius: 999px !important;
    background: rgba(245, 180, 0, 0.12) !important;
    color: #8a6100 !important;
    line-height: 16px !important;
  }
}