/* ==========================================================================
   AZRA REF-UI v75 — Pop-Noir reference pass
   1) Bottom dock: flat bar glued to the bottom edge, hairline top border,
      outline icons, active item = white capsule with icon + label.
   2) Messages list: "Instagram Chats" look — outlined rounded cards,
      squircle avatars, bold time, dim read previews / bright unread, pink badge.
   LOAD LAST (after azra-feed-polish.css). Uses tokens from azra-tokens.css.
   ========================================================================== */

/* ---------------------------------------------------------------- 1) DOCK */
@media (max-width: 1020px) {
  :root { --az-dock-h: 68px; }
  html body { --bottombar: 68px; }

  html body #bottomnav.az-dock,
  html body .hxm-bar.az-dock {
    position: fixed !important;
    inset: auto 0 0 0 !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 10px 14px calc(10px + env(safe-area-inset-bottom)) !important;
    gap: 0 !important;
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    background: var(--az-bg, #000) !important;
    background-image: none !important;
    border: 0 !important;
    border-top: 1px solid var(--az-line, rgba(255,255,255,.1)) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    overflow: visible !important;
    animation: none !important;
    transform: none !important;
    opacity: 1 !important;
    z-index: 70;
  }
  html body #bottomnav.az-dock.is-hidden,
  html body .hxm-bar.az-dock.is-hidden {
    transform: none !important; opacity: 1 !important; pointer-events: auto !important;
  }

  /* sliding white capsule (position set by azra-dock.js through --dx / --dw) */
  html body #bottomnav.az-dock::before,
  html body .hxm-bar.az-dock::before {
    content: "" !important;
    position: absolute !important;
    z-index: -1;
    inset: auto !important;
    top: 10px !important;
    bottom: calc(10px + env(safe-area-inset-bottom)) !important;
    left: 0 !important;
    right: auto !important;
    width: var(--dw, 0px) !important;
    height: auto !important;
    border-radius: 999px !important;
    background: var(--az-dock-active-bg, #fff) !important;
    box-shadow: none !important;
    opacity: var(--dop, 0) !important;
    transform: translate3d(var(--dx, 0px), 0, 0) !important;
  }

  /* items */
  html body #bottomnav.az-dock > button,
  html body .hxm-bar.az-dock > * {
    height: 46px !important;
    min-width: 48px !important;
    padding: 0 8px !important;
    border-radius: 999px !important;
    background: transparent !important;
    box-shadow: none !important;
    border: 0 !important;
    color: var(--az-text-2, #D5D6DC) !important;
    font: 700 13px/1 var(--az-font-ui, inherit) !important;
    letter-spacing: 0 !important;
    animation: none;
  }
  html body #bottomnav.az-dock > button svg,
  html body .hxm-bar.az-dock > * svg {
    width: 24px !important; height: 24px !important;
    stroke-width: 1.6 !important; filter: none !important;
  }
  html body #bottomnav.az-dock > button.active,
  html body .hxm-bar.az-dock > .on {
    flex-grow: 3.2;
    padding: 0 16px !important;
    background: transparent !important;
    box-shadow: none !important;
    color: var(--az-dock-active-fg, #000) !important;
  }
  html body #bottomnav.az-dock > button.active .az-dl,
  html body .hxm-bar.az-dock > .on > span {
    max-width: 120px; margin-inline-start: 8px; font-weight: 700;
  }

  /* "Create" is now a flat item (no raised bead) — kept yellow so it stays discoverable */
  html body #bottomnav.az-dock > .plus {
    flex: 1 1 0 !important;
    width: auto !important;
    min-width: 48px !important;
    height: 46px !important;
    margin: 0 !important;
    padding: 0 12px !important;
    border-radius: 999px !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    transform: none !important;
    color: var(--az-primary, #FFD500) !important;
  }
  html[data-theme="light"] body #bottomnav.az-dock > .plus { color: var(--az-gold-text, #7A5C00) !important; }

  /* badge: small pink dot-pill */
  html body #bottomnav.az-dock .cnt {
    top: 2px; inset-inline-end: 4px; inset-inline-start: auto;
    min-width: 17px; height: 17px; padding: 0 5px;
    display: grid; place-items: center;
    border-radius: 999px;
    background: var(--az-pink, #FF7AC6); color: #000;
    font: 800 10px/1 var(--az-font-ui, inherit);
    border: 2px solid var(--az-bg, #000);
    box-sizing: content-box;
  }
  html body #bottomnav.az-dock .cnt.hidden { display: none; }
  html body #bottomnav.az-dock > button.active:has(.cnt:not(.hidden)) { padding-inline-end: 30px !important; }
  html body #bottomnav.az-dock > button.active .cnt { top: 4px; inset-inline-end: 8px; border-color: var(--az-dock-active-bg, #fff); }

  /* the old soft scrim behind the floating bar is pointless (and smudgy on light) with a flat bar */
  html::after { display: none !important; }
  .azx-totop { bottom: calc(var(--az-dock-h) + 16px + env(safe-area-inset-bottom)) !important; }

  /* room for the flat bar */
  html body .layout { padding-bottom: calc(var(--az-dock-h) + 20px + env(safe-area-inset-bottom)) !important; }
  html body .toasts, html body #toasts { bottom: calc(var(--az-dock-h) + 16px + env(safe-area-inset-bottom)) !important; }
}

/* ------------------------------------------------------ 2) MESSAGES LIST */
html body .msgs { background: transparent !important; }
html body .convs { background: transparent !important; }

html body .conv-top,
html[data-theme] body #convList#convList .conv-top {
  position: sticky; top: 0; z-index: 3;
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 18px 18px 8px !important;
  background: var(--az-bg, #000) !important;
  border: 0 !important;
  -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
}
html body .conv-top > b {
  font: 700 22px/1.1 var(--az-font-display, inherit);
  letter-spacing: -.01em; color: var(--az-text, #fff);
}
html body #convList .conv-top .btn,
html body #convList .conv-top .btn.btn-primary {
  height: 40px; padding: 0 16px; border-radius: 999px;
  background: transparent !important; background-image: none !important;
  color: var(--az-text, #fff) !important; text-shadow: none !important;
  border: 1px solid var(--az-line-strong, rgba(255,255,255,.18)) !important;
  box-shadow: none !important; font-weight: 700;
}
html body #convList .conv-top .btn::before, html body #convList .conv-top .btn::after { display: none !important; }
html body #convList .conv-top .btn svg { stroke: currentColor !important; filter: none !important; }
html body #convList .conv-top .btn:active { transform: scale(.95); }

html body .conv-search,
html[data-theme] body #convList#convList .conv-search {
  display: flex; align-items: center; gap: 10px;
  margin: 6px 14px 12px !important; padding: 0 16px !important; height: 46px;
  border-radius: 23px !important;
  border: 1px solid var(--az-line-strong, rgba(255,255,255,.18)) !important;
  background: transparent !important; color: var(--az-mut, #9A9DA8);
}
html body #convList#convList .conv-search input {
  font-size: 14px; color: var(--az-text, #fff);
  border: 0 !important; background: transparent !important; box-shadow: none !important; outline: 0 !important;
  height: 100%; padding: 0 !important;
}
html body .conv-search:focus-within {
  border-color: var(--az-primary, #FFD500) !important; box-shadow: none !important;
}

html body #convList .conv-top, html body #convList .conv-search,
html body #convList .conv-section, html body #convList .conv { flex: none !important; }

html body .conv-section {
  padding: 12px 22px 8px !important;
  color: var(--az-dim, #6A6D78) !important;
  font: 700 11px/1 var(--az-font-ui, inherit); letter-spacing: .12em;
}
html body .group-section { border-top: 0 !important; margin-top: 4px; }
html body .conv-empty { padding: 10px 22px 18px; color: var(--az-dim, #6A6D78); }

/* the card */
html body .convs .conv {
  position: relative;
  display: flex; align-items: center; gap: 14px;
  margin: 0 14px 10px !important;
  min-height: 86px;
  padding: 12px 16px 12px 12px !important;
  padding-inline: 12px 16px !important;
  background: transparent !important;
  border: 1px solid var(--az-line-strong, rgba(255,255,255,.18)) !important;
  border-radius: 28px !important;
  cursor: pointer;
  transition: border-color var(--az-dur-2, 200ms), background var(--az-dur-2, 200ms), transform var(--az-dur-1, 120ms);
  -webkit-tap-highlight-color: transparent;
}
html body .convs .conv[hidden] { display: none !important; }
html body .convs .conv:hover { background: var(--az-surface, #0C0C0E) !important; }
html body .convs .conv:active { transform: scale(.985); }
html body .convs .conv.active {
  background: var(--az-primary-soft, rgba(255,213,0,.12)) !important;
  border-color: var(--az-primary-line, rgba(255,213,0,.3)) !important;
}
html body .convs .conv:focus-visible { outline: 2px solid var(--az-primary, #FFD500); outline-offset: 2px; }

/* squircle avatar */
html body .convs .conv .avatar,
html body .convs .conv .group-avatar {
  width: 62px !important; height: 62px !important; flex: none;
  border-radius: 22px !important; overflow: hidden;
  font: 700 20px/1 var(--az-font-display, inherit); letter-spacing: .02em;
  border: 0 !important;
}
html body .convs .conv .avatar img { width: 100%; height: 100%; object-fit: cover; }
html body .convs .conv .avatar .on {
  width: 13px; height: 13px; inset-inline-end: 3px; bottom: 3px;
  border: 2.5px solid var(--az-bg, #000);
}
/* initials fallback → flat pop colours with white/black letters like the reference */
html body .convs .conv:nth-of-type(4n+1) .avatar:not(:has(img)) { background: #EE5BA4; color: #fff; }
html body .convs .conv:nth-of-type(4n+2) .avatar:not(:has(img)) { background: #3B82F6; color: #fff; }
html body .convs .conv:nth-of-type(4n+3) .avatar:not(:has(img)) { background: var(--az-green, #22E06B); color: #000; }
html body .convs .conv:nth-of-type(4n+4) .avatar:not(:has(img)) { background: var(--az-primary, #FFD500); color: #000; }
html body .convs .group-conv .group-avatar {
  background: var(--az-surface-2, #16161A) !important; color: var(--az-text, #fff) !important;
  display: grid; place-items: center;
  border: 1px solid var(--az-line-strong, rgba(255,255,255,.18)) !important;
}
html body .convs .group-conv.active .group-avatar {
  background: var(--az-primary, #FFD500) !important; color: #000 !important; border-color: transparent !important;
}

/* text column */
html body .convs .conv .cm {
  flex: 1; min-width: 0;
  display: flex; flex-direction: column; gap: 6px; line-height: 1.3;
}
html body .convs .conv .cm > b {
  display: flex; align-items: baseline; justify-content: space-between; gap: 10px; font-weight: 600;
}
html body .convs .conv .cm > b > span:first-child {
  display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font: 600 15.5px/1.25 var(--az-font-ui, inherit); color: var(--az-text, #fff);
}
html body .convs .conv .cm > b > span:last-child {
  flex: none; display: block; white-space: nowrap;
  font: 700 12px/1 var(--az-font-ui, inherit); color: var(--az-text, #fff);
  font-variant-numeric: tabular-nums;
}
/* preview: two lines, dim when read, bright when unread */
html body .convs .conv .cm > span {
  display: -webkit-box !important;
  -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2;
  white-space: normal !important; overflow: hidden; text-overflow: ellipsis;
  font: 500 13.5px/1.4 var(--az-font-ui, inherit);
  color: var(--az-dim, #6A6D78) !important;
}
html body .convs .conv:has(.un) .cm > span {
  color: var(--az-text, #fff) !important; font-weight: 600;
  padding-inline-end: 36px;
}

/* unread badge — pink circle, bottom-end of the card */
html body .convs .conv .un {
  position: absolute; inset-inline-end: 16px; bottom: 14px;
  min-width: 26px; height: 26px; padding: 0 7px;
  display: grid; place-items: center;
  border-radius: 999px;
  background: var(--az-pink, #FF7AC6) !important; color: #000 !important;
  font: 800 12px/1 var(--az-font-ui, inherit);
  animation: az-dock-pop var(--az-dur-3, 320ms) var(--az-spring, cubic-bezier(.34,1.4,.5,1));
}

/* mobile: full-bleed list, icon-only "new message" button */
@media (max-width: 1020px) {
  html body .msgs { border: 0 !important; border-radius: 0 !important; }
  html body .convs { border-inline-end: 0 !important; padding-bottom: calc(var(--az-dock-h, 68px) + 24px + env(safe-area-inset-bottom)); }
}
@media (max-width: 640px) {
  html body #convList .conv-top .btn { width: 42px; height: 42px; padding: 0; font-size: 0; justify-content: center; }
  html body #convList .conv-top .btn svg { width: 20px; height: 20px; font-size: 14px; }
}

/* ------------------------------------------------ light theme (cream + ink) */
html[data-theme="light"] body .convs .conv:hover { background: var(--az-surface, #fff) !important; }
html[data-theme="light"] body .convs .conv .un { color: #000 !important; }

/* --------------------------------------------- thread: matching, light touch */
html body .thread-head { border-bottom: 1px solid var(--az-line, rgba(255,255,255,.09)) !important; }
html body .composer { border-top: 1px solid var(--az-line, rgba(255,255,255,.09)) !important; }
html body .composer textarea {
  background: transparent !important;
  border: 1px solid var(--az-line-strong, rgba(255,255,255,.18)) !important;
  border-radius: 24px !important;
}
html body .bubble:not(.mine) {
  background: var(--az-bubble-other-bg, #16161A); color: var(--az-bubble-other-fg, #F5F5F7);
  border: 1px solid var(--az-line, rgba(255,255,255,.09)); border-radius: 20px 20px 20px 6px;
}
html body .bubble.mine {
  background: var(--az-bubble-own-bg, #FFD500); color: var(--az-bubble-own-fg, #000);
  border-radius: 20px 20px 6px 20px;
}
html[dir="rtl"] body .bubble:not(.mine) { border-radius: 20px 20px 6px 20px; }
html[dir="rtl"] body .bubble.mine { border-radius: 20px 20px 20px 6px; }

@media (prefers-reduced-motion: reduce) {
  html body .convs .conv, html body .convs .conv .un { transition: none !important; animation: none !important; }
}

/* ==========================================================================
   v75b — closer to the reference: ultra-thin outlines, pure black, dark search
   ========================================================================== */
/* kill the golden ambient glow behind the messages screen */
html:has(.msgs)::before { display: none !important; }
html:has(.msgs) body, html:has(.msgs) body .layout, html:has(.msgs) body #view { background: var(--az-bg, #000) !important; }

/* header */
html[data-theme] body #convList#convList .conv-top { padding: 20px 18px 10px !important; }
html[data-theme] body #convList#convList .conv-top > b { font-size: 24px; font-weight: 600; letter-spacing: .005em; }

/* SEARCH — dark filled field */
html[data-theme] body #convList#convList .conv-search {
  height: 50px; margin: 8px 14px 14px !important; padding: 0 18px !important; gap: 12px;
  border-radius: 25px !important;
  background: #0B0B0D !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  color: #6D6F78;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.03) !important;
  transition: border-color .2s, background .2s;
}
html[data-theme] body #convList#convList .conv-search svg { width: 19px; height: 19px; flex: none; stroke: currentColor; opacity: .9; }
html[data-theme] body #convList#convList .conv-search input { font-size: 14.5px; font-weight: 500; color: #F2F2F4; }
html[data-theme] body #convList#convList .conv-search input::placeholder { color: #5C5E67; opacity: 1; }
html[data-theme] body #convList#convList .conv-search:focus-within {
  background: #111114 !important; border-color: rgba(255,255,255,.28) !important; color: #fff; box-shadow: none !important;
}
html[data-theme="light"] body #convList#convList .conv-search { background: #fff !important; border-color: var(--az-line-strong) !important; color: var(--az-mut); }
html[data-theme="light"] body #convList#convList .conv-search input { color: var(--az-text); }
html[data-theme="light"] body #convList#convList .conv-search input::placeholder { color: var(--az-dim); }

/* section label: quieter */
html[data-theme] body #convList#convList .conv-section { padding: 6px 24px 10px !important; font-size: 10.5px; letter-spacing: .16em; color: #55575F !important; }

/* CARDS */
html[data-theme] body #convList#convList .conv {
  margin: 0 14px 11px !important;
  min-height: 90px;
  padding: 13px 18px 13px 13px !important;
  padding-inline: 13px 18px !important;
  gap: 16px;
  background: #060607 !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 30px !important;
}
html[data-theme] body #convList#convList .conv:hover { background: #0C0C0E !important; border-color: rgba(255,255,255,.18) !important; }
html[data-theme] body #convList#convList .conv.active {
  background: #0C0C0E !important; border-color: rgba(255,255,255,.34) !important;
}
html[data-theme] body #convList#convList .conv .avatar,
html[data-theme] body #convList#convList .conv .group-avatar {
  width: 64px !important; height: 64px !important; border-radius: 23px !important;
}
html[data-theme] body #convList#convList .conv .cm { gap: 7px; }
html[data-theme] body #convList#convList .conv .cm > b > span:first-child { font-size: 15px; font-weight: 600; letter-spacing: .015em; }
html[data-theme] body #convList#convList .conv .cm > b > span:last-child { font-size: 11.5px; font-weight: 800; letter-spacing: .02em; }
html[data-theme] body #convList#convList .conv .cm > span { font-size: 13px; font-weight: 500; color: #4A4C54 !important; }
html[data-theme] body #convList#convList .conv:has(.un) .cm > span { color: #fff !important; font-weight: 600; }
html[data-theme] body #convList#convList .conv .un {
  inset-inline-end: 18px; bottom: 15px; min-width: 28px; height: 28px; font-size: 12px;
  background: #F060AB !important; color: #1a0612 !important;
}
html[data-theme] body #convList#convList .conv .avatar:not(:has(img)) { letter-spacing: .03em; font-weight: 700; }

/* light theme keeps the same structure with ink lines */
html[data-theme="light"] body #convList#convList .conv { background: #fff !important; border-color: rgba(20,16,10,.12) !important; }
html[data-theme="light"] body #convList#convList .conv .cm > span { color: var(--az-dim) !important; }
html[data-theme="light"] body #convList#convList .conv:has(.un) .cm > span { color: var(--az-text) !important; }
html[data-theme="light"] body #convList#convList .conv .un { color: #000 !important; }

/* ==========================================================================
   v75c — "More" bottom sheet (ACT.moreSheet → .overlay.az-more-sheet)
   ========================================================================== */
html[data-theme] body .overlay.az-more-sheet {
  background: rgba(0,0,0,.66) !important;
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  padding: 0 !important; align-items: end !important;
}
html[data-theme] body .overlay.az-more-sheet .modal {
  position: relative;
  width: 100%; max-width: 560px !important; margin-inline: auto;
  max-height: 88vh; max-height: 88dvh;
  background: #050506 !important; background-image: none !important;
  border: 0 !important; border-top: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 34px 34px 0 0 !important;
  box-shadow: 0 -24px 60px rgba(0,0,0,.6) !important;
  padding-bottom: env(safe-area-inset-bottom);
  animation: az-sheet-up var(--az-dur-3, 320ms) var(--az-ease, cubic-bezier(.2,.8,.2,1));
}
@keyframes az-sheet-up { from { transform: translateY(40px); opacity: 0; } to { transform: none; opacity: 1; } }
/* grabber */
html[data-theme] body .overlay.az-more-sheet .modal::before {
  content: ""; position: absolute; top: 8px; left: 50%; width: 40px; height: 4px; margin-left: -20px;
  border-radius: 4px; background: rgba(255,255,255,.2); z-index: 3;
}
html[data-theme] body .overlay.az-more-sheet .modal-head {
  padding: 26px 20px 12px !important; background: transparent !important; border: 0 !important;
  -webkit-backdrop-filter: none !important; backdrop-filter: none !important; position: static;
}
html[data-theme] body .overlay.az-more-sheet .modal-head h3 {
  font: 600 22px/1.1 var(--az-font-display, inherit); letter-spacing: .005em; color: var(--az-text, #fff);
}
html[data-theme] body .overlay.az-more-sheet .modal-head .icon-btn {
  width: 40px; height: 40px; border-radius: 50%;
  background: transparent !important; color: var(--az-text, #fff) !important;
  border: 1px solid rgba(255,255,255,.16) !important; box-shadow: none !important;
}
html[data-theme] body .overlay.az-more-sheet .modal-body { padding: 4px 16px 20px !important; overflow: auto; }

/* tiles */
html[data-theme] body .az-more-sheet .sheet-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
html[data-theme] body .az-more-sheet .sheet-nav button {
  flex-direction: row; justify-content: flex-start; align-items: center; gap: 12px;
  min-height: 64px; padding: 10px 14px 10px 10px; text-align: start;
  background: #08080A !important; background-image: none !important;
  border: 1px solid rgba(255,255,255,.10) !important; border-radius: 22px !important; box-shadow: none !important;
  color: var(--az-text, #fff) !important;
  font: 600 14px/1.2 var(--az-font-ui, inherit);
  transition: background .2s, border-color .2s, transform .12s;
  -webkit-tap-highlight-color: transparent;
}
html[data-theme] body .az-more-sheet .sheet-nav button:hover { background: #0F0F12 !important; border-color: rgba(255,255,255,.2) !important; }
html[data-theme] body .az-more-sheet .sheet-nav button:active { transform: scale(.97); }
html[data-theme] body .az-more-sheet .sheet-nav button:focus-visible { outline: 2px solid var(--az-primary, #FFD500); outline-offset: 2px; }
/* icon → coloured squircle */
html[data-theme] body .az-more-sheet .sheet-nav button > svg {
  flex: none; box-sizing: content-box; width: 22px; height: 22px; padding: 9px;
  border-radius: 15px; stroke: #000; stroke-width: 1.9; fill: none; filter: none;
  background: var(--az-primary, #FFD500);
}
html[data-theme] body .az-more-sheet .sheet-nav button:nth-child(4n+1) > svg { background: #EE5BA4; stroke: #fff; }
html[data-theme] body .az-more-sheet .sheet-nav button:nth-child(4n+2) > svg { background: #3B82F6; stroke: #fff; }
html[data-theme] body .az-more-sheet .sheet-nav button:nth-child(4n+3) > svg { background: var(--az-green, #22E06B); stroke: #000; }
html[data-theme] body .az-more-sheet .sheet-nav button:nth-child(4n+4) > svg { background: var(--az-primary, #FFD500); stroke: #000; }
/* unread badge: sits on the icon's corner so it never covers the label */
html[data-theme] body .az-more-sheet .sheet-nav .cnt {
  top: 4px !important; transform: none; inset-inline-start: 30px !important; inset-inline-end: auto !important;
  min-width: 20px; height: 20px; padding: 0 !important; display: grid; place-items: center;
  background: #F060AB !important; color: #1a0612 !important; border-radius: 999px !important;
  border: 2px solid #08080A; box-sizing: content-box;
  font: 800 10.5px/1 var(--az-font-ui, inherit) !important;
}
html[data-theme="light"] body .az-more-sheet .sheet-nav .cnt { border-color: #fff; }

/* member links → outlined rows */
html[data-theme] body .az-more-sheet .azra-mobile-member-links { display: grid !important; grid-template-columns: 1fr; gap: 8px; margin-top: 14px; }
html[data-theme] body .az-more-sheet .azra-mobile-member-links a {
  justify-content: flex-start; gap: 12px; min-height: 54px; padding: 0 18px;
  background: transparent !important; border: 1px solid rgba(255,255,255,.10) !important; border-radius: 999px !important;
  color: var(--az-text, #fff) !important; font: 600 14px/1 var(--az-font-ui, inherit);
  transition: background .2s, border-color .2s;
}
html[data-theme] body .az-more-sheet .azra-mobile-member-links a:hover { background: #0F0F12 !important; border-color: rgba(255,255,255,.2) !important; }
html[data-theme] body .az-more-sheet .azra-mobile-member-links a svg { width: 20px; height: 20px; stroke-width: 1.7; }
html[data-theme] body .az-more-sheet .azra-mobile-member-links a::after {
  content: ""; margin-inline-start: auto; width: 8px; height: 8px;
  border-top: 2px solid currentColor; border-inline-end: 2px solid currentColor;
  transform: rotate(45deg); opacity: .4;
}
html[dir="rtl"] body .az-more-sheet .azra-mobile-member-links a::after { transform: rotate(-135deg); }

/* language + back buttons */
html[data-theme] body .az-more-sheet .modal-body > .row { gap: 10px; margin-top: 14px !important; }
html[data-theme] body .az-more-sheet .modal-body > .row .btn {
  flex: 1; justify-content: center; height: 46px; border-radius: 999px !important;
  background: transparent !important; background-image: none !important;
  border: 1px solid rgba(255,255,255,.16) !important; color: var(--az-text, #fff) !important;
  box-shadow: none !important; font-weight: 700;
}

/* light theme */
html[data-theme="light"] body .overlay.az-more-sheet { background: rgba(20,16,10,.4) !important; }
html[data-theme="light"] body .overlay.az-more-sheet .modal { background: var(--az-bg) !important; border-top-color: var(--az-line-strong) !important; box-shadow: 0 -20px 50px rgba(60,40,10,.18) !important; }
html[data-theme="light"] body .overlay.az-more-sheet .modal::before { background: rgba(20,16,10,.2); }
html[data-theme="light"] body .overlay.az-more-sheet .modal-head .icon-btn { border-color: var(--az-line-strong) !important; }
html[data-theme="light"] body .az-more-sheet .sheet-nav button,
html[data-theme="light"] body .az-more-sheet .azra-mobile-member-links a { background: #fff !important; border-color: var(--az-line) !important; }
html[data-theme="light"] body .az-more-sheet .modal-body > .row .btn { border-color: var(--az-line-strong) !important; }

@media (prefers-reduced-motion: reduce) { html body .overlay.az-more-sheet .modal { animation: none !important; } }