/* Navigation Manager and fixed mobile drawer */
@media (max-width: 980px) {
  .mobile-drawer-backdrop {
    display: block !important;
    position: fixed !important;
    inset: 0 !important;
    background: rgba(15, 23, 42, .58) !important;
    backdrop-filter: blur(8px) !important;
    opacity: 0;
    pointer-events: none;
    transition: opacity .18s ease;
    z-index: 11990 !important;
  }
  .mobile-drawer-backdrop.is-open {
    opacity: 1 !important;
    pointer-events: auto !important;
  }
  .mobile-drawer.mobile-drawer-managed,
  .mobile-drawer {
    display: flex !important;
    position: fixed !important;
    inset: 0 auto 0 0 !important;
    width: min(92vw, 430px) !important;
    max-width: 430px !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    transform: translateX(-105%) !important;
    transition: transform .22s ease !important;
    z-index: 12000 !important;
    overflow: hidden !important;
    flex-direction: column !important;
    background:
      radial-gradient(circle at 16% 0%, rgba(96,165,250,.24), transparent 28%),
      linear-gradient(160deg, #0f172a 0%, #172554 52%, #312e81 100%) !important;
    color: #fff !important;
    border-right: 1px solid rgba(255,255,255,.14) !important;
    box-shadow: 24px 0 70px rgba(15,23,42,.45) !important;
  }
  .mobile-drawer.is-open {
    transform: translateX(0) !important;
  }
  .mobile-drawer-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 16px !important;
    padding: 22px 18px 16px !important;
    min-height: auto !important;
    border-bottom: 1px solid rgba(255,255,255,.14) !important;
    background: rgba(15,23,42,.22) !important;
    flex-shrink: 0 !important;
  }
  .mobile-drawer-title {
    font-size: clamp(28px, 8vw, 42px) !important;
    line-height: 1 !important;
    font-weight: 950 !important;
    letter-spacing: -.04em !important;
    color: #fff !important;
  }
  .mobile-drawer-subtitle {
    margin-top: 6px !important;
    color: rgba(255,255,255,.72) !important;
    font-weight: 700 !important;
    font-size: 12px !important;
  }
  .mobile-drawer-close {
    width: 54px !important;
    height: 54px !important;
    min-width: 54px !important;
    border-radius: 20px !important;
    border: 1px solid rgba(255,255,255,.16) !important;
    background: rgba(2,6,23,.72) !important;
    color: #fff !important;
    font-size: 36px !important;
    line-height: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 16px 32px rgba(0,0,0,.25) !important;
  }
  .mobile-drawer-scroll {
    display: block !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch !important;
    padding: 16px 14px 110px !important;
  }
  .mobile-drawer-profile-card {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 14px !important;
    border-radius: 24px !important;
    background: rgba(255,255,255,.12) !important;
    border: 1px solid rgba(255,255,255,.15) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
    margin-bottom: 14px !important;
  }
  .mobile-drawer-profile-card img {
    width: 52px !important;
    height: 52px !important;
    border-radius: 18px !important;
    object-fit: cover !important;
    border: 2px solid rgba(255,255,255,.34) !important;
  }
  .mobile-drawer-profile-card strong {
    display:block !important;
    color:#fff !important;
    font-weight:950 !important;
  }
  .mobile-drawer-profile-card small {
    display:block !important;
    color:rgba(255,255,255,.68) !important;
    font-weight:800 !important;
    margin-top:2px !important;
  }
  .mobile-drawer-block {
    background: rgba(255,255,255,.09) !important;
    border: 1px solid rgba(255,255,255,.14) !important;
    border-radius: 26px !important;
    overflow: hidden !important;
    margin: 0 0 14px !important;
  }
  .mobile-drawer-block-title {
    display:block !important;
    padding: 14px 16px !important;
    font-size: 12px !important;
    line-height: 1 !important;
    letter-spacing: .22em !important;
    text-transform: uppercase !important;
    font-weight: 950 !important;
    color: rgba(255,255,255,.78) !important;
    background: rgba(255,255,255,.08) !important;
    border-bottom: 1px solid rgba(255,255,255,.12) !important;
  }
  .mobile-drawer-block-content.nav-managed-mobile-grid,
  .mobile-drawer-block-content {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    padding: 12px !important;
  }
  .mobile-drawer-link.nav-managed-link,
  .mobile-drawer-link {
    min-height: 54px !important;
    height: auto !important;
    padding: 12px 13px !important;
    border-radius: 18px !important;
    border: 1px solid rgba(255,255,255,.14) !important;
    background: linear-gradient(135deg, var(--nav-accent, rgba(255,255,255,.14)), var(--nav-accent-2, rgba(255,255,255,.08))) !important;
    color: var(--nav-text-color, #fff) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    text-decoration: none !important;
    font-size: 15px !important;
    line-height: 1.15 !important;
    font-weight: 900 !important;
    letter-spacing: -.01em !important;
    box-shadow: 0 12px 26px rgba(2,6,23,.18) !important;
  }
  .mobile-drawer-link.is-active {
    outline: 2px solid rgba(255,255,255,.54) !important;
    box-shadow: 0 18px 35px rgba(2,6,23,.26) !important;
  }
  .mobile-drawer-link .nav-managed-icon {
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    border-radius: 14px !important;
    background: rgba(255,255,255,.18) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 18px !important;
  }
  .mobile-drawer-bottom-actions {
    display: grid !important;
    gap: 10px !important;
    padding-bottom: 40px !important;
  }
  .mobile-drawer-bottom-actions a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 48px !important;
    border-radius: 18px !important;
    color: #fff !important;
    text-decoration: none !important;
    font-weight: 900 !important;
    border: 1px solid rgba(255,255,255,.18) !important;
    background: rgba(255,255,255,.11) !important;
  }
  .mobile-drawer-custom-block {
    display: none !important;
  }
}

.nav-managed-left-nav .nav-managed-link {
  position: relative;
  overflow: hidden;
}
.nav-managed-link .nav-managed-label {
  min-width: 0;
}
.nav-managed-link .nav-managed-count {
  margin-left: auto;
  min-width: 20px;
  max-width: 74px;
  height: 20px;
  padding: 0 6px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  background: rgba(15,23,42,.08);
  color: #0f172a;
  font-size: 11px;
  font-weight: 950;
  line-height: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body.home-feed-page .feed-left-nav-link .nav-managed-count {
  margin-right: 3px;
}
.mobile-drawer-link .nav-managed-count {
  height: 24px;
  min-width: 24px;
  padding: 0 8px;
  background: rgba(255,255,255,.22);
  color: var(--nav-text-color, #fff);
  border: 1px solid rgba(255,255,255,.24);
}
html[data-theme="dark"] .nav-managed-left-nav .nav-managed-count {
  background: rgba(255,255,255,.12);
  color: #f8fafc;
}
.nav-managed-left-nav .nav-managed-link .nav-managed-icon {

  color: var(--nav-text-color, #fff);
}
.nav-managed-separator {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--muted, #64748b);
  font-size: 11px;
  font-weight: 950;
  letter-spacing: .08em;
  text-transform: uppercase;
  line-height: 1;
  pointer-events: none;
}
.nav-managed-separator::before,
.nav-managed-separator::after {
  content: '';
  height: 1px;
  min-width: 12px;
  flex: 1 1 auto;
  background: color-mix(in srgb, var(--line, #e5e7eb) 84%, transparent);
}
.nav-managed-separator span {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.feed-left-nav-separator {
  margin: 9px 2px 7px;
}
.mobile-drawer-nav-separator {
  margin: 6px 8px;
  color: var(--muted, #65676b);
}
.mobile-drawer-nav-separator::before,
.mobile-drawer-nav-separator::after {
  background: color-mix(in srgb, var(--line, #d9dde3) 76%, transparent);
}

/* User/admin navigation manager pages */
.nav-manager-page-card {
  margin-bottom: 16px;
}
.nav-user-order-list {
  display: grid;
  gap: 12px;
}
.nav-order-card {
  display: grid;
  grid-template-columns: 58px minmax(0,1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 14px;
  border: 1px solid var(--line, #e5e7eb);
  border-radius: 18px;
  background: var(--card, #fff);
}
.nav-order-card.is-separator {
  border-style: dashed;
  background: color-mix(in srgb, var(--card, #fff) 82%, var(--bg, #f8fafc));
}
.nav-order-card.is-separator .nav-order-preview,
.admin-nav-row-separator .admin-nav-preview {
  background: color-mix(in srgb, var(--muted, #64748b) 18%, var(--card, #fff));
  color: var(--muted, #64748b);
  font-size: 12px;
  font-weight: 950;
  letter-spacing: .06em;
}
.nav-order-preview,
.admin-nav-preview {
  width: 52px;
  height: 52px;
  border-radius: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, var(--nav-accent, #2563eb), var(--nav-accent-2, #7c3aed));
  color: var(--nav-text-color, #fff);
  font-size: 24px;
  box-shadow: 0 12px 26px rgba(15,23,42,.16);
}
.nav-order-meta {
  min-width: 0;
}
.nav-order-meta strong,
.nav-order-meta small {
  display: block;
}
.nav-order-meta small {
  color: var(--muted, #64748b);
  overflow-wrap: anywhere;
}
.nav-order-controls {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.nav-order-controls button,
.nav-manager-actions button,
.admin-navigation-page button {
  border: 0;
  border-radius: 999px;
  padding: 10px 14px;
  font-weight: 900;
  background: #2563eb;
  color: #fff;
}
.nav-order-controls input[type="number"] {
  width: 86px;
}
.nav-visible-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 800;
}
.nav-manager-actions {
  margin-top: 16px;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.nav-manager-actions .secondary-btn {
  background: #0f172a;
}
.admin-nav-grid {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 12px;
}
.admin-nav-grid label,
.admin-nav-table label {
  display: grid;
  gap: 5px;
  font-size: 12px;
  font-weight: 800;
  color: var(--muted, #64748b);
}
.admin-nav-grid input,
.admin-nav-table input,
.nav-order-controls input {
  border: 1px solid var(--line, #e5e7eb);
  border-radius: 12px;
  padding: 9px 10px;
  background: var(--card, #fff);
  color: var(--text, #0f172a);
}
.admin-nav-preview-img,
.admin-other-link-image {
  width: 52px;
  height: 52px;
  border-radius: 16px;
  object-fit: cover;
  background: var(--bg, #f8fafc);
  border: 1px solid var(--line, #e5e7eb);
}
.admin-nav-preview .admin-nav-preview-img {
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: inherit;
}
.admin-other-links-table {
  min-width: 920px;
}
.admin-nav-checks {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin: 12px 0;
}
.admin-nav-table-wrap {
  overflow-x: auto;
}
.admin-nav-table {
  width: 100%;
  min-width: 980px;
  border-collapse: separate;
  border-spacing: 0 10px;
}
.admin-nav-table td,
.admin-nav-table th {
  background: var(--card, #fff);
  border-top: 1px solid var(--line, #e5e7eb);
  border-bottom: 1px solid var(--line, #e5e7eb);
  padding: 12px;
  vertical-align: top;
}
.admin-nav-table td:first-child,
.admin-nav-table th:first-child {
  border-left: 1px solid var(--line, #e5e7eb);
  border-radius: 16px 0 0 16px;
}
.admin-nav-table td:last-child,
.admin-nav-table th:last-child {
  border-right: 1px solid var(--line, #e5e7eb);
  border-radius: 0 16px 16px 0;
}
.admin-nav-checks-cell {
  display: grid;
  gap: 5px;
}
.admin-nav-delete-toggle {
  color: #dc2626 !important;
}
.admin-nav-row-separator td {
  background: color-mix(in srgb, var(--card, #fff) 82%, var(--bg, #f8fafc));
}
@media (max-width: 780px) {
  .nav-order-card {
    grid-template-columns: 52px minmax(0,1fr);
  }
  .nav-order-controls {
    grid-column: 1 / -1;
    justify-content: flex-start;
  }
  .admin-nav-grid {
    grid-template-columns: 1fr;
  }
}

/* Clean full-screen mobile drawer: follows the active site theme. */
@media (max-width: 980px) {
  .mobile-drawer-backdrop {
    background: color-mix(in srgb, var(--text, #0f172a) 34%, transparent) !important;
    backdrop-filter: blur(10px) !important;
    z-index: 11990 !important;
  }

  .mobile-drawer.mobile-drawer-managed,
  .mobile-drawer {
    inset: 0 !important;
    width: 100vw !important;
    max-width: none !important;
    height: 100vh !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    border-radius: 0 !important;
    border: 0 !important;
    background: var(--bg, #f0f2f5) !important;
    color: var(--text, #1c1e21) !important;
    box-shadow: none !important;
    z-index: 12000 !important;
  }

  .mobile-drawer-header {
    padding: calc(14px + env(safe-area-inset-top, 0px)) 16px 14px !important;
    background: var(--card, #fff) !important;
    border-bottom: 1px solid var(--line, #d9dde3) !important;
    color: var(--text, #1c1e21) !important;
  }

  .mobile-drawer-brand-icon,
  .mobile-drawer .mobile-drawer-brand-icon {
    width: 46px !important;
    height: 46px !important;
    flex-basis: 46px !important;
    border-radius: 14px !important;
    background: var(--bg, #f0f2f5) !important;
    box-shadow: 0 8px 18px color-mix(in srgb, var(--text, #0f172a) 13%, transparent) !important;
  }

  .mobile-drawer-title,
  .mobile-drawer .mobile-drawer-brand-lockup .mobile-drawer-title {
    color: var(--text, #1c1e21) !important;
    font-size: clamp(24px, 7vw, 32px) !important;
    letter-spacing: 0 !important;
  }

  .mobile-drawer-subtitle,
  .mobile-drawer .mobile-drawer-brand-lockup .mobile-drawer-subtitle {
    color: var(--muted, #65676b) !important;
  }

  .mobile-drawer-close,
  .mobile-drawer .mobile-drawer-header .mobile-drawer-close {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    flex-basis: 46px !important;
    border-radius: 14px !important;
    background: var(--bg, #f0f2f5) !important;
    color: var(--text, #1c1e21) !important;
    border: 1px solid var(--line, #d9dde3) !important;
    box-shadow: none !important;
    font-size: 30px !important;
  }

  .mobile-drawer-scroll {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    padding: 12px 12px calc(22px + env(safe-area-inset-bottom, 0px)) !important;
    background: var(--bg, #f0f2f5) !important;
  }

  .mobile-drawer-profile-card,
  .mobile-drawer-block,
  .mobile-drawer-bottom-actions a {
    background: var(--card, #fff) !important;
    color: var(--text, #1c1e21) !important;
    border: 1px solid var(--line, #d9dde3) !important;
    box-shadow: none !important;
  }

  .mobile-drawer-profile-card {
    margin: 0 !important;
    border-radius: 18px !important;
  }

  .mobile-drawer-profile-card strong {
    color: var(--text, #1c1e21) !important;
  }

  .mobile-drawer-profile-card small,
  .mobile-drawer-shortcut small {
    color: var(--muted, #65676b) !important;
  }

  .mobile-drawer-block {
    margin: 0 !important;
    border-radius: 18px !important;
  }

  .mobile-drawer-block-title {
    padding: 13px 14px !important;
    color: var(--muted, #65676b) !important;
    background: color-mix(in srgb, var(--bg, #f0f2f5) 80%, var(--card, #fff)) !important;
    border-bottom: 1px solid var(--line, #d9dde3) !important;
    letter-spacing: .12em !important;
  }

  .mobile-drawer-block-content.nav-managed-mobile-grid,
  .mobile-drawer-block-content {
    gap: 8px !important;
    padding: 10px !important;
  }

  .mobile-drawer-link.nav-managed-link,
  .mobile-drawer-link {
    min-height: 50px !important;
    border-radius: 14px !important;
    background: var(--card, #fff) !important;
    color: var(--text, #1c1e21) !important;
    border: 1px solid var(--line, #d9dde3) !important;
    box-shadow: none !important;
  }

  .mobile-drawer-link.is-active,
  .mobile-drawer-link:hover,
  .mobile-drawer-link:focus {
    outline: 0 !important;
    background: color-mix(in srgb, var(--accent, #1877f2) 14%, var(--card, #fff)) !important;
    border-color: color-mix(in srgb, var(--accent, #1877f2) 40%, var(--line, #d9dde3)) !important;
  }

  .mobile-drawer-link .nav-managed-icon {
    background: color-mix(in srgb, var(--accent, #1877f2) 16%, var(--bg, #f0f2f5)) !important;
    color: var(--accent, #1877f2) !important;
  }

  .mobile-drawer-link .nav-managed-count {
    background: color-mix(in srgb, var(--accent, #1877f2) 16%, var(--bg, #f0f2f5)) !important;
    color: var(--accent, #1877f2) !important;
  }

  .mobile-drawer-shortcuts-list {
    display: grid !important;
    gap: 8px !important;
    padding: 10px !important;
  }

  .mobile-drawer-shortcut {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    min-height: 52px !important;
    padding: 9px 10px !important;
    border-radius: 14px !important;
    background: var(--card, #fff) !important;
    color: var(--text, #1c1e21) !important;
    border: 1px solid var(--line, #d9dde3) !important;
    text-decoration: none !important;
  }

  .mobile-drawer-shortcut img {
    width: 36px !important;
    height: 36px !important;
    flex: 0 0 36px !important;
    border-radius: 12px !important;
    object-fit: cover !important;
    background: var(--bg, #f0f2f5) !important;
  }

  .mobile-drawer-shortcut span {
    min-width: 0 !important;
    display: grid !important;
    gap: 2px !important;
  }

  .mobile-drawer-shortcut strong,
  .mobile-drawer-shortcut small {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  .mobile-drawer-shortcut strong {
    color: var(--text, #1c1e21) !important;
    font-size: 14px !important;
    line-height: 1.15 !important;
  }

  .mobile-drawer-shortcuts-empty {
    padding: 12px !important;
    color: var(--muted, #65676b) !important;
    font-weight: 750 !important;
  }

  .mobile-drawer-bottom-actions {
    padding-bottom: 0 !important;
  }
}

/* Final mobile drawer repair: true viewport height with a real scrolling link list. */
@media (max-width: 980px) {
  html.mobile-drawer-open,
  body.mobile-drawer-open {
    overflow: hidden !important;
    min-height: 100% !important;
    height: 100% !important;
  }

  .mobile-drawer.mobile-drawer-managed,
  .mobile-drawer {
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100vh !important;
    height: 100svh !important;
    height: 100dvh !important;
    min-height: 100vh !important;
    min-height: 100svh !important;
    min-height: 100dvh !important;
    max-height: 100dvh !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    border-radius: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .mobile-drawer-header {
    flex: 0 0 auto !important;
  }

  .mobile-drawer-scroll {
    flex: 1 1 0 !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior-y: contain !important;
    scrollbar-gutter: stable;
    padding-bottom: calc(var(--safe-mobile-nav-h, 68px) + 28px + env(safe-area-inset-bottom, 0px)) !important;
  }

  .mobile-drawer-shortcuts-block,
  .mobile-drawer-bottom-actions {
    flex: 0 0 auto !important;
  }

  .mobile-drawer-bottom-actions {
    padding-bottom: calc(24px + env(safe-area-inset-bottom, 0px)) !important;
  }
}

/* Last word on mobile drawer scrolling: do not bury links under shortcuts/actions. */
@media (max-width: 980px) {
  .mobile-drawer.mobile-drawer-managed,
  .mobile-drawer {
    position: fixed !important;
    inset: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100vh !important;
    height: 100svh !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
  }

  .mobile-drawer-header {
    flex: 0 0 auto !important;
  }

  .mobile-drawer-scroll {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow-y: scroll !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior-y: contain !important;
    scrollbar-gutter: stable both-edges !important;
    scrollbar-width: thin !important;
    scrollbar-color: color-mix(in srgb, var(--accent, #1877f2) 48%, transparent) transparent !important;
    padding-bottom: calc(var(--safe-mobile-nav-h, 72px) + 54px + env(safe-area-inset-bottom, 0px)) !important;
  }

  .mobile-drawer-scroll::-webkit-scrollbar {
    width: 10px !important;
  }

  .mobile-drawer-scroll::-webkit-scrollbar-thumb {
    background: color-mix(in srgb, var(--accent, #1877f2) 42%, transparent) !important;
    border-radius: 999px !important;
    border: 3px solid transparent !important;
    background-clip: content-box !important;
  }

  .mobile-drawer-site-links-block,
  .mobile-drawer-site-links-block .mobile-drawer-block-content,
  .mobile-drawer-site-links-block .nav-managed-mobile-grid {
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  .mobile-drawer-site-links-block,
  .mobile-drawer-shortcuts-block,
  .mobile-drawer-bottom-actions {
    flex: 0 0 auto !important;
  }

  .mobile-drawer-scroll::after {
    content: '' !important;
    display: block !important;
    flex: 0 0 calc(var(--safe-mobile-nav-h, 72px) + 18px + env(safe-area-inset-bottom, 0px)) !important;
  }
}

/* Mobile drawer tabs: normal links plus admin-defined Explore sidebar shortcuts. */
@media (max-width: 980px) {
  .mobile-drawer-nav-tabs-block {
    overflow: hidden !important;
    flex: 0 0 auto !important;
  }

  .mobile-drawer-tab-input {
    position: absolute !important;
    inline-size: 1px !important;
    block-size: 1px !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }

  .mobile-drawer-tab-controls {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
    padding: 10px !important;
    background: color-mix(in srgb, var(--bg, #f0f2f5) 78%, var(--card, #fff)) !important;
    border-bottom: 1px solid var(--line, #d9dde3) !important;
  }

  .mobile-drawer-tab-controls label {
    min-height: 42px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 14px !important;
    border: 1px solid var(--line, #d9dde3) !important;
    background: var(--card, #fff) !important;
    color: var(--muted, #65676b) !important;
    font-size: 14px !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    cursor: pointer !important;
  }

  #mobile-drawer-tab-links:checked ~ .mobile-drawer-tab-controls label[for="mobile-drawer-tab-links"],
  #mobile-drawer-tab-explore:checked ~ .mobile-drawer-tab-controls label[for="mobile-drawer-tab-explore"],
  #mobile-drawer-tab-other:checked ~ .mobile-drawer-tab-controls label[for="mobile-drawer-tab-other"] {
    background: color-mix(in srgb, var(--accent, #1877f2) 15%, var(--card, #fff)) !important;
    border-color: color-mix(in srgb, var(--accent, #1877f2) 45%, var(--line, #d9dde3)) !important;
    color: var(--accent, #1877f2) !important;
  }

  .mobile-drawer-tab-panel {
    display: none !important;
  }

  #mobile-drawer-tab-links:checked ~ .mobile-drawer-tab-panels .mobile-drawer-links-panel,
  #mobile-drawer-tab-explore:checked ~ .mobile-drawer-tab-panels .mobile-drawer-explore-panel,
  #mobile-drawer-tab-other:checked ~ .mobile-drawer-tab-panels .mobile-drawer-other-panel {
    display: block !important;
  }

  .mobile-drawer-tab-panels,
  .mobile-drawer-tab-panel,
  .mobile-drawer-nav-tabs-block .mobile-drawer-block-content {
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  .mobile-drawer-explore-link .nav-managed-label,
  .mobile-drawer-other-link .nav-managed-label {
    display: grid !important;
    gap: 2px !important;
  }

  .mobile-drawer-explore-link .nav-managed-label strong,
  .mobile-drawer-explore-link .nav-managed-label small,
  .mobile-drawer-other-link .nav-managed-label strong,
  .mobile-drawer-other-link .nav-managed-label small {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  .mobile-drawer-explore-link .nav-managed-label strong,
  .mobile-drawer-other-link .nav-managed-label strong {
    color: inherit !important;
    font-size: 14px !important;
    line-height: 1.1 !important;
  }

  .mobile-drawer-explore-link .nav-managed-label small,
  .mobile-drawer-other-link .nav-managed-label small {
    color: var(--muted, #65676b) !important;
    font-size: 12px !important;
    font-weight: 750 !important;
    line-height: 1.1 !important;
  }

  .mobile-drawer-explore-separator {
    height: 1px !important;
    margin: 4px 8px !important;
    background: linear-gradient(90deg, transparent, var(--line, #d9dde3), transparent) !important;
  }

  .mobile-drawer-other-link::before {
    display: none !important;
    content: none !important;
  }

  .mobile-drawer-other-link .nav-managed-image {
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    border-radius: 12px !important;
    object-fit: cover !important;
    background: color-mix(in srgb, var(--accent, #1877f2) 12%, var(--bg, #f0f2f5)) !important;
    border: 1px solid var(--line, #d9dde3) !important;
  }
}