/*
 * ZZVibe V3.2 visual polish
 * A production-safe finishing layer for the real WoWonder interface.
 */

body.zzv3 {
  --zzv3-accent: #8358e8;
  --zzv3-accent-strong: #6f42d7;
  --zzv3-accent-soft: rgba(131, 88, 232, 0.12);
  --zzv3-purple: #8358e8;
  --zzv3-blue: #3b82d0;
  --zzv3-coral: #e85d75;
  --zzv3-green: #2eae70;
  --zzv3-amber: #d99a36;
  --zzv3-bg: #f0f2f5;
  --zzv3-bg-elevated: #f5f6f8;
  --zzv3-shell: #ffffff;
  --zzv3-surface: #ffffff;
  --zzv3-surface-soft: #f4f5f7;
  --zzv3-surface-hover: #eceef2;
  --zzv3-surface-raised: #eef0f4;
  --zzv3-text: #191a1f;
  --zzv3-text-soft: #50535c;
  --zzv3-muted: #777b86;
  --zzv3-border: rgba(23, 25, 31, 0.09);
  --zzv3-border-strong: rgba(23, 25, 31, 0.14);
  --zzv3-shadow-sm: 0 1px 2px rgba(15, 16, 19, 0.04), 0 7px 22px rgba(15, 16, 19, 0.035);
  --zzv3-shadow-md: 0 14px 42px rgba(15, 16, 19, 0.1);
  --zzv3-radius-sm: 11px;
  --zzv3-radius-md: 15px;
  --zzv3-radius-lg: 19px;
  --zzv3-radius-xl: 24px;
  --zzv3-header-height: 64px;
  --zzv3-home-max: 1180px;
  --zzv3-feed-width: 720px;
  --zzv3-rail-width: 340px;
  --zzv3-column-gap: 22px;
  background: var(--zzv3-bg) !important;
  color: var(--zzv3-text);
  font-size: 14px;
}

body.zzv3.zzv3-dark {
  --zzv3-accent: #9268ed;
  --zzv3-accent-strong: #b08df4;
  --zzv3-accent-soft: rgba(146, 104, 237, 0.15);
  --zzv3-bg: #111216;
  --zzv3-bg-elevated: #15171c;
  --zzv3-shell: #17191e;
  --zzv3-surface: #1c1f25;
  --zzv3-surface-soft: #21242b;
  --zzv3-surface-hover: #292d35;
  --zzv3-surface-raised: #24272f;
  --zzv3-text: #f5f6f8;
  --zzv3-text-soft: #c8cbd2;
  --zzv3-muted: #969ba6;
  --zzv3-border: rgba(255, 255, 255, 0.08);
  --zzv3-border-strong: rgba(255, 255, 255, 0.13);
  --zzv3-shadow-sm: 0 1px 1px rgba(0, 0, 0, 0.22), 0 9px 26px rgba(0, 0, 0, 0.16);
  --zzv3-shadow-md: 0 18px 48px rgba(0, 0, 0, 0.3);
  background: var(--zzv3-bg) !important;
}

body.zzv3 .wow_content,
body.zzv3 .panel,
body.zzv3 .modal-content,
body.zzv3 .dropdown-menu {
  background-color: var(--zzv3-surface);
  color: var(--zzv3-text);
  border-color: var(--zzv3-border);
}

/* Header: balanced like a social product, not an admin dashboard. */
body.zzv3 header .navbar,
body.zzv3 .tag_navbar_top,
body.zzv3 .tag_navbar_top_right {
  min-height: var(--zzv3-header-height);
  background: rgba(255, 255, 255, 0.94);
  border-color: var(--zzv3-border);
  box-shadow: 0 1px 0 var(--zzv3-border);
  backdrop-filter: saturate(145%) blur(18px);
  -webkit-backdrop-filter: saturate(145%) blur(18px);
}

body.zzv3.zzv3-dark header .navbar,
body.zzv3.zzv3-dark .tag_navbar_top,
body.zzv3.zzv3-dark .tag_navbar_top_right {
  background: rgba(23, 25, 30, 0.96);
}

body.zzv3 .tag_header,
body.zzv3 .tag_navbar_top .container-fluid,
body.zzv3 .tag_navbar_top .tag_header {
  min-height: var(--zzv3-header-height);
  height: var(--zzv3-header-height);
}

body.zzv3 .tag_header {
  gap: 12px;
  padding-inline: 8px;
}

body.zzv3 .header-brand {
  width: 40px;
  min-width: 40px;
  height: 40px;
  padding: 5px;
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 14px;
  background: linear-gradient(145deg, #b953d2 0%, #8259e9 52%, #438fdc 100%);
  box-shadow: 0 7px 18px rgba(109, 73, 203, 0.22);
}

body.zzv3 .tag_header .search-container {
  width: min(360px, 28vw);
}

body.zzv3 .tag_header .search-input {
  height: 42px;
  padding-inline: 43px 40px;
  color: var(--zzv3-text);
  background: var(--zzv3-surface-raised);
  border: 1px solid transparent;
  border-radius: 999px;
  font-size: 13px;
}

body.zzv3 .tag_header .search-input:focus {
  background: var(--zzv3-surface);
  border-color: rgba(146, 104, 237, 0.52);
  box-shadow: 0 0 0 3px var(--zzv3-accent-soft);
}

body.zzv3 .tag_hdr_right {
  gap: 7px;
}

body.zzv3 .tag_hdr_droptoggle,
body.zzv3 .tag_hdr_right > .dropdown > .dropdown-toggle,
body.zzv3 .tag_navbar_top_right .dropdown-toggle,
body.zzv3 .tag_toggle_sidebar,
body.zzv3 .tag_toggle_search {
  width: 42px;
  min-width: 42px;
  height: 42px;
  color: var(--zzv3-text-soft);
  background: var(--zzv3-surface-raised);
  border: 1px solid transparent;
  border-radius: 50%;
}

body.zzv3 .tag_hdr_droptoggle:hover,
body.zzv3 .tag_hdr_droptoggle:focus,
body.zzv3 .tag_toggle_sidebar:hover,
body.zzv3 .tag_toggle_search:hover {
  color: var(--zzv3-text);
  background: var(--zzv3-surface-hover);
  border-color: var(--zzv3-border);
}

body.zzv3 .tag_hdr_user_droptoggle {
  width: auto;
  min-width: 42px;
  height: 42px;
  max-width: 154px;
  padding: 3px 12px 3px 3px;
  border-radius: 999px;
}

body.zzv3 .tag_hdr_user_droptoggle img {
  width: 34px;
  height: 34px;
}

body.zzv3 .zzv3-primary-tabs {
  top: 0;
  height: var(--zzv3-header-height);
  gap: 6px;
}

body.zzv3 .zzv3-primary-tab {
  width: 64px;
  height: 52px;
  margin-top: 6px;
  color: var(--zzv3-muted) !important;
  border-radius: 14px;
  font-size: 20px;
}

body.zzv3 .zzv3-primary-tab:hover {
  color: var(--zzv3-text) !important;
  background: var(--zzv3-surface-hover);
}

body.zzv3 .zzv3-primary-tab.is-active {
  color: var(--zzv3-purple) !important;
  background: var(--zzv3-accent-soft);
}

body.zzv3 .zzv3-primary-tab.is-active::after {
  right: 18px;
  bottom: -6px;
  left: 18px;
  height: 3px;
  border-radius: 3px 3px 0 0;
}

body.zzv3 .zzv3-primary-tab.zzv3-route-reels:hover,
body.zzv3 .zzv3-primary-tab.zzv3-route-reels.is-active {
  color: var(--zzv3-coral) !important;
}

body.zzv3 .zzv3-primary-tab.zzv3-route-groups:hover,
body.zzv3 .zzv3-primary-tab.zzv3-route-groups.is-active {
  color: var(--zzv3-blue) !important;
}

body.zzv3 .zzv3-primary-tab.zzv3-route-products:hover,
body.zzv3 .zzv3-primary-tab.zzv3-route-products.is-active {
  color: var(--zzv3-green) !important;
}

/* Left navigation: restrained chrome with memorable colored icons. */
body.zzv3 .tag_sidebar {
  background: var(--zzv3-bg-elevated);
  border-color: var(--zzv3-border);
}

body.zzv3 .sidebar_innr {
  padding: 14px 10px 30px;
}

body.zzv3 .tag_sidebar_section > a {
  min-height: 48px;
  gap: 11px;
  margin: 2px 0;
  padding: 6px 9px;
  color: var(--zzv3-text-soft);
  border: 1px solid transparent;
  border-radius: 14px;
  font-size: 13px;
  font-weight: 680;
}

body.zzv3 .tag_sidebar_section > a > svg {
  width: 34px !important;
  min-width: 34px;
  height: 34px !important;
  padding: 7px;
  border-radius: 50%;
}

body.zzv3 .tag_sidebar_section > a:hover,
body.zzv3 .tag_sidebar_section > a:focus,
body.zzv3 .tag_sidebar_section > a.active,
body.zzv3 .tag_sidebar_section > a.zzv3-current {
  color: var(--zzv3-text);
  background: var(--zzv3-surface-raised);
  border-color: var(--zzv3-border);
}

/* Home: wider, better aligned and visually connected. */
body.zzv3.zzv3-home-surface .page-margin {
  margin-top: 18px;
}

body.zzv3.zzv3-home-surface .page-margin > .container {
  width: calc(100% - 32px);
  max-width: var(--zzv3-home-max);
  padding-inline: 0;
}

body.zzv3 .greetalert {
  max-width: var(--zzv3-home-max);
  margin: 0 auto 12px;
  padding: 0 2px;
}

body.zzv3 .greetalert #daynightmsg {
  color: var(--zzv3-text);
  font-size: 20px;
  font-weight: 760;
  letter-spacing: -0.025em;
}

@media (min-width: 1200px) {
  body.zzv3.zzv3-home-surface .page-margin > .container > .row {
    display: grid !important;
    grid-template-columns: minmax(0, var(--zzv3-feed-width)) minmax(0, var(--zzv3-rail-width));
    justify-content: center;
    align-items: start;
    gap: var(--zzv3-column-gap);
    margin: 0;
  }

  body.zzv3.zzv3-home-surface .page-margin .middlecol,
  body.zzv3.zzv3-home-surface .page-margin .rightcol {
    width: auto !important;
    max-width: none !important;
    padding: 0 !important;
    float: none !important;
  }
}

/* V3.3.6: keep the account controls inside the primary desktop header row. */
body.zzv3 .tag_navbar_top .tag_header > .tag_navbar_top_right {
  flex: 0 0 auto;
  width: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  margin-block: 0;
  margin-inline: auto 0;
  padding: 0;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

@media (min-width: 768px) {
  body.zzv3 .tag_navbar_top .tag_header > .tag_navbar_top_right {
    align-self: stretch;
    display: flex;
    align-items: center;
    position: relative;
    z-index: 3;
  }

  body.zzv3 .tag_navbar_top .tag_header > .tag_navbar_top_right .tag_hdr_right {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    width: auto !important;
    min-height: 0;
    height: 100%;
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0 6px !important;
  }
}

/* V3.3.7: compact desktop rail that expands on hover or keyboard focus. */
@media (min-width: 993px) and (hover: hover) and (pointer: fine) {
  body.zzv3 {
    --zzv3-sidebar-collapsed: 72px;
    --zzv3-sidebar-expanded: 244px;
  }

  body.zzv3 .tag_header_top_m {
    margin-inline-start: var(--zzv3-sidebar-collapsed) !important;
  }

  body.zzv3.tag_header_top_p .tag_show_fnd_bottom {
    inset-inline-start: var(--zzv3-sidebar-collapsed) !important;
  }

  body.zzv3 .tag_navbar_top_side {
    width: var(--zzv3-sidebar-collapsed) !important;
    z-index: 1035;
    overflow: hidden;
    box-shadow: none;
    transition:
      width 220ms cubic-bezier(0.2, 0.8, 0.2, 1) 110ms,
      box-shadow 180ms ease;
    will-change: width;
  }

  body.zzv3 .tag_navbar_top_side:hover,
  body.zzv3 .tag_navbar_top_side:focus-within {
    width: var(--zzv3-sidebar-expanded) !important;
    box-shadow: 12px 0 34px rgba(8, 12, 20, 0.14);
    transition-delay: 0ms;
  }

  [dir="rtl"] body.zzv3 .tag_navbar_top_side:hover,
  [dir="rtl"] body.zzv3 .tag_navbar_top_side:focus-within {
    box-shadow: -12px 0 34px rgba(8, 12, 20, 0.14);
  }

  body.zzv3 .tag_navbar_top_side .sidebar_innr {
    padding-inline: 9px !important;
    overflow-x: hidden !important;
  }

  body.zzv3 .tag_navbar_top_side .sidebar_innr > .btn {
    width: 100%;
    min-width: 0 !important;
    flex: 0 0 auto;
    justify-content: flex-start;
    gap: 0 !important;
    overflow: hidden !important;
    padding-inline: 8px !important;
    white-space: nowrap;
    transition:
      gap 180ms ease,
      background-color 160ms ease,
      border-color 160ms ease;
  }

  body.zzv3 .tag_navbar_top_side .sidebar_innr > .btn > svg {
    flex: 0 0 34px;
    margin: 0 !important;
  }

  body.zzv3 .tag_navbar_top_side .sidebar_innr > .btn > span {
    position: static !important;
    display: block !important;
    min-width: 0;
    max-width: 0;
    margin: 0;
    padding: 0 !important;
    overflow: hidden;
    opacity: 0;
    color: inherit !important;
    background: transparent !important;
    border-radius: 0 !important;
    line-height: 1.25 !important;
    text-overflow: clip;
    white-space: nowrap;
    transform: translateX(-8px) !important;
    pointer-events: none;
    transition:
      max-width 210ms cubic-bezier(0.2, 0.8, 0.2, 1),
      opacity 120ms ease,
      transform 180ms ease;
  }

  [dir="rtl"] body.zzv3 .tag_navbar_top_side .sidebar_innr > .btn > span {
    transform: translateX(8px) !important;
  }

  body.zzv3 .tag_navbar_top_side:hover .sidebar_innr > .btn,
  body.zzv3 .tag_navbar_top_side:focus-within .sidebar_innr > .btn {
    gap: 11px !important;
  }

  body.zzv3 .tag_navbar_top_side:hover .sidebar_innr > .btn > span,
  body.zzv3 .tag_navbar_top_side:focus-within .sidebar_innr > .btn > span {
    max-width: 172px;
    opacity: 1;
    transform: none !important;
    transition-delay: 55ms;
  }
}

@media (min-width: 993px) and (hover: hover) and (pointer: fine) and (prefers-reduced-motion: reduce) {
  body.zzv3 .tag_navbar_top_side,
  body.zzv3 .tag_navbar_top_side .sidebar_innr > .btn,
  body.zzv3 .tag_navbar_top_side .sidebar_innr > .btn > span {
    transition: none !important;
  }
}

/* V3.3.8: align the brand with the rail and use a real double-chevron control. */
@media (min-width: 993px) {
  body.zzv3 .tag_navbar_top .tag_header > .header-brand {
    order: 0;
    margin-inline-start: 8px;
  }

  body.zzv3 .tag_navbar_top .tag_header > .tag_toggle_sidebar {
    order: 1;
    margin: 0 !important;
    font-size: 19px;
  }

  body.zzv3 .tag_navbar_top .tag_header > .tag_toggle_sidebar > svg {
    display: none !important;
  }

  body.zzv3 .tag_navbar_top .tag_header > .tag_toggle_sidebar::after {
    content: "\f101";
    display: inline-block;
    font-family: FontAwesome;
    font-size: 19px;
    line-height: 1;
    transition: transform 180ms ease;
  }

  body.zzv3 .tag_navbar_top .tag_header > .search-container {
    order: 2;
  }

  body.zzv3 .tag_navbar_top .tag_header > .tag_navbar_top_right {
    order: 3;
  }

  body.zzv3 .tag_navbar_top .tag_header .tag_toggle_search {
    display: none !important;
  }

  [dir="rtl"] body.zzv3 .tag_navbar_top .tag_header > .tag_toggle_sidebar::after {
    transform: scaleX(-1);
  }
}

@media (max-width: 992px) {
  body.zzv3 .tag_navbar_top .tag_header .tag_toggle_search {
    display: none !important;
  }

  body.zzv3 .tag_navbar_top .tag_header .search-container.show .tag_toggle_search {
    display: inline-flex !important;
  }
}

@media (min-width: 993px) and (hover: hover) and (pointer: fine) {
  body.zzv3 .tag_header_top_m {
    transition:
      opacity 250ms linear,
      margin-inline-start 220ms cubic-bezier(0.2, 0.8, 0.2, 1);
  }

  body.zzv3.zzv3-sidebar-pinned .tag_header_top_m {
    margin-inline-start: var(--zzv3-sidebar-expanded) !important;
  }

  body.zzv3.zzv3-sidebar-pinned.tag_header_top_p .tag_show_fnd_bottom {
    inset-inline-start: var(--zzv3-sidebar-expanded) !important;
  }

  body.zzv3.zzv3-sidebar-pinned .tag_navbar_top_side {
    width: var(--zzv3-sidebar-expanded) !important;
    box-shadow: 12px 0 34px rgba(8, 12, 20, 0.14);
    transition-delay: 0ms;
  }

  [dir="rtl"] body.zzv3.zzv3-sidebar-pinned .tag_navbar_top_side {
    box-shadow: -12px 0 34px rgba(8, 12, 20, 0.14);
  }

  body.zzv3.zzv3-sidebar-pinned .tag_navbar_top_side .sidebar_innr > .btn {
    gap: 11px !important;
  }

  body.zzv3.zzv3-sidebar-pinned .tag_navbar_top_side .sidebar_innr > .btn > span {
    max-width: 172px;
    opacity: 1;
    transform: none !important;
    transition-delay: 55ms;
  }

  body.zzv3.zzv3-sidebar-pinned .tag_navbar_top .tag_header > .tag_toggle_sidebar::after {
    transform: rotate(180deg);
  }

  [dir="rtl"] body.zzv3.zzv3-sidebar-pinned .tag_navbar_top .tag_header > .tag_toggle_sidebar::after {
    transform: scaleX(-1) rotate(180deg);
  }
}

/* V3.3.9: show the real transparent ZZ logo instead of the icon treatment. */
body.zzv3 .tag_navbar_top .header-brand {
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  padding: 0 !important;
  overflow: visible;
  background: transparent !important;
  border: 0 !important;
  border-radius: 50%;
  box-shadow: none !important;
}

body.zzv3 .tag_navbar_top .header-brand .tag_logo_pc {
  display: block !important;
  width: 44px !important;
  height: 44px !important;
  max-width: 44px !important;
  max-height: 44px !important;
  object-fit: contain;
  border-radius: 50%;
  filter: drop-shadow(0 5px 10px rgba(105, 72, 203, 0.2));
}

body.zzv3 .tag_navbar_top .header-brand .tag_logo_mobi {
  display: none !important;
}

@media (max-width: 992px) {
  body.zzv3 .tag_navbar_top .header-brand,
  body.zzv3 .tag_navbar_top .header-brand .tag_logo_pc {
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    max-width: 38px !important;
    max-height: 38px !important;
  }
}

/* Stories: real full-bleed story cards, not tiny floating avatars. */
body.zzv3 .tag_stories_on_home {
  position: relative;
  max-width: var(--zzv3-home-max);
  margin: 0 auto 15px;
  padding: 4px 2px 6px;
  overflow: hidden;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

body.zzv3 .tag_stories_on_home .tag_lbox_stories {
  width: 100%;
}

body.zzv3 .tag_stories_on_home .status-list {
  width: 100%;
  display: flex;
  align-items: stretch;
  gap: 12px;
  padding: 4px 4px 8px;
  overflow-x: auto;
  scroll-snap-type: x proximity;
  scrollbar-width: none;
}

body.zzv3 .tag_stories_on_home .status-list::-webkit-scrollbar {
  display: none;
}

body.zzv3 .tag_stories_on_home .status-list > li {
  position: relative;
  width: 116px;
  min-width: 116px;
  height: 168px;
  margin: 0;
  overflow: visible;
  text-align: left;
  scroll-snap-align: start;
}

body.zzv3 .tag_stories_on_home .status-list > li.story_empty {
  display: none;
}

body.zzv3 .tag_stories_on_home .status-list > li > a {
  position: relative;
  isolation: isolate;
  width: 116px;
  height: 168px;
  display: block;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background: var(--zzv3-surface-raised);
  border: 1px solid var(--zzv3-border-strong);
  border-radius: 19px;
  box-shadow: var(--zzv3-shadow-sm);
}

body.zzv3 .tag_stories_on_home .status-list > li.not_seen_story > a {
  border: 2px solid var(--zzv3-purple);
}

body.zzv3 .tag_stories_on_home .status-list > li > a::after {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 0;
  background: linear-gradient(180deg, rgba(8, 9, 12, 0.03) 34%, rgba(8, 9, 12, 0.78) 100%);
  pointer-events: none;
}

body.zzv3 .tag_stories_on_home .status-list > li > a > img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  border: 0;
  border-radius: 18px;
  transition: transform 180ms ease;
}

body.zzv3 .tag_stories_on_home .status-list > li:hover > a > img {
  transform: scale(1.035);
}

body.zzv3 .tag_stories_on_home .status-list > li > a > span {
  position: absolute;
  z-index: 3;
  top: 10px;
  right: auto;
  bottom: auto;
  left: 10px;
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  overflow: hidden;
  padding: 2px;
  color: #fff;
  background: var(--zzv3-surface);
  border: 2px solid var(--zzv3-purple);
  border-radius: 50%;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.22);
}

body.zzv3 .tag_stories_on_home .status-list > li > a > span > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}

body.zzv3 .tag_stories_on_home .status-list > li.create_new > a {
  border-color: var(--zzv3-border-strong);
}

body.zzv3 .tag_stories_on_home .status-list > li.create_new > a > span {
  top: 10px;
  right: 10px;
  left: auto;
  padding: 0;
  background: var(--zzv3-purple);
  border: 2px solid #fff;
}

body.zzv3 .tag_stories_on_home .status-list > li.create_new > a > span svg {
  width: 17px;
  height: 17px;
}

body.zzv3 .tag_stories_on_home .status-list > li > p {
  position: absolute;
  z-index: 4;
  right: 9px;
  bottom: 11px;
  left: 9px;
  width: auto;
  margin: 0;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  line-height: 15px;
  text-shadow: 0 1px 5px rgba(0, 0, 0, 0.68);
}

body.zzv3 .tag_stories_on_home .view-more-stories {
  position: absolute;
  z-index: 6;
  top: 50%;
  right: 8px;
  width: 40px;
  min-width: 40px;
  height: 40px;
  color: var(--zzv3-text);
  background: var(--zzv3-surface);
  border: 1px solid var(--zzv3-border-strong);
  border-radius: 50%;
  box-shadow: var(--zzv3-shadow-md);
  transform: translateY(-50%);
}

/* Filters: a useful compact control, no empty full-width box. */
body.zzv3 .tag_home_filters,
body.zzv3.zzv3-dark .tag_home_filters {
  max-width: var(--zzv3-home-max);
  min-height: 48px;
  justify-content: flex-start;
  gap: 8px;
  margin: 0 auto 16px;
  padding: 0 2px;
  overflow: visible;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

body.zzv3 .tag_home_filters .tag_page_nav {
  width: auto;
  flex: 0 1 auto;
  flex-wrap: nowrap;
  gap: 3px;
  margin: 0;
  padding: 4px;
  overflow-x: auto;
  background: var(--zzv3-surface);
  border: 1px solid var(--zzv3-border);
  border-radius: 14px;
  box-shadow: var(--zzv3-shadow-sm);
  scrollbar-width: none;
}

body.zzv3 .tag_home_filters .tag_page_nav::-webkit-scrollbar {
  display: none;
}

body.zzv3 .tag_home_filters .btn,
body.zzv3 .tag_home_filters .btn-mat,
body.zzv3 .tag_home_post_order .dropdown-toggle {
  min-height: 38px;
  padding: 8px 13px;
  color: var(--zzv3-muted);
  border-radius: 10px;
  font-size: 13px;
  font-weight: 680;
  white-space: nowrap;
}

body.zzv3 .tag_home_filters .filter-by-li.active > a,
body.zzv3 .tag_home_filters .filter-by-li > a:hover,
body.zzv3 .tag_home_post_order > a:hover {
  color: var(--zzv3-accent-strong);
  background: var(--zzv3-accent-soft);
}

body.zzv3 .tag_home_filters .tag_home_goup {
  margin-inline-start: auto;
  background: var(--zzv3-surface);
  border: 1px solid var(--zzv3-border);
}

/* Composer and posts: one confident feed surface with better hierarchy. */
body.zzv3 .tag_pub_box_bg {
  min-height: 82px;
  gap: 11px;
  margin-bottom: 16px;
  padding: 15px;
  background: var(--zzv3-surface);
  border: 1px solid var(--zzv3-border);
  border-radius: 20px;
  box-shadow: var(--zzv3-shadow-sm);
}

body.zzv3 .tag_pub_box_avatar,
body.zzv3 .tag_pub_box_avatar img {
  width: 46px;
  min-width: 46px;
  height: 46px;
}

body.zzv3 .tag_pub_box_bg_text {
  min-height: 46px;
  padding-inline: 17px;
  color: var(--zzv3-muted);
  background: var(--zzv3-surface-raised);
  border: 1px solid transparent;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 560;
}

body.zzv3 .tag_pub_box_bg_text:hover,
body.zzv3 .tag_pub_box_bg_text:focus {
  color: var(--zzv3-text-soft);
  background: var(--zzv3-surface-hover);
  border-color: var(--zzv3-border);
}

body.zzv3 .tag_pub_box_bg_camlve {
  width: 44px;
  min-width: 44px;
  height: 44px;
  border-radius: 14px;
}

body.zzv3 .post-container,
body.zzv3 .post.wow_content,
body.zzv3 .posts_load > div > .wow_content {
  overflow: visible;
  background: var(--zzv3-surface);
  border: 1px solid var(--zzv3-border);
  border-radius: 20px;
  box-shadow: var(--zzv3-shadow-sm);
}

body.zzv3 .post-container {
  margin-bottom: 16px;
}

body.zzv3 .post .post-heading,
body.zzv3 .post-container .post-heading {
  padding: 16px 17px 11px;
}

body.zzv3 .post-heading .avatar,
body.zzv3 .post-heading .avatar img {
  width: 46px;
  height: 46px;
}

body.zzv3 .post-heading .user-name,
body.zzv3 .post-heading .user-name a {
  color: var(--zzv3-text);
  font-size: 14px;
  font-weight: 760;
}

body.zzv3 .post-heading .ajax-time,
body.zzv3 .tag_post_hdr_sub {
  color: var(--zzv3-muted);
  font-size: 12px;
}

body.zzv3 .post .post-description,
body.zzv3 .post-container .post-description {
  padding-inline: 17px;
  color: var(--zzv3-text);
  font-size: 14.5px;
  line-height: 1.58;
}

body.zzv3 .post-file,
body.zzv3 .post-file img,
body.zzv3 .post-file video,
body.zzv3 .post-container .wo_adaptive_media,
body.zzv3 .post-container .wo_adaptive_media img {
  border-radius: 14px;
}

body.zzv3 .post .post-actions,
body.zzv3 .post-container .post-actions,
body.zzv3 .tag_post_actions {
  gap: 6px;
  padding: 8px 12px 10px;
  border-color: var(--zzv3-border);
}

body.zzv3 .post .post-actions .stat-item,
body.zzv3 .post-container .post-actions .stat-item,
body.zzv3 .tag_post_actions .btn,
body.zzv3 .post .post-actions .stat-item:nth-child(1),
body.zzv3 .post .post-actions .stat-item:nth-child(2),
body.zzv3 .post .post-actions .stat-item:nth-child(3),
body.zzv3 .tag_post_actions > *:nth-child(1),
body.zzv3 .tag_post_actions > *:nth-child(2),
body.zzv3 .tag_post_actions > *:nth-child(3) {
  min-height: 40px;
  padding: 9px 12px;
  color: var(--zzv3-muted);
  background: transparent;
  border-radius: 12px;
  font-weight: 680;
}

body.zzv3 .post .post-actions .stat-item:hover,
body.zzv3 .post-container .post-actions .stat-item:hover,
body.zzv3 .tag_post_actions .btn:hover {
  color: var(--zzv3-accent-strong);
  background: var(--zzv3-accent-soft);
}

body.zzv3 .comment-text,
body.zzv3 .comment-reply .comment-text {
  background: var(--zzv3-surface-raised);
  border-radius: 7px 16px 16px 16px;
}

/* Right rail: every widget belongs to the same product. */
body.zzv3 .rightcol.sidebar_fixed {
  top: 80px;
}

body.zzv3 .rightcol .wow_content,
body.zzv3 .tag_sidebar_widget {
  margin-bottom: 16px;
  padding: 15px;
  background: var(--zzv3-surface);
  border: 1px solid var(--zzv3-border);
  border-radius: 18px;
  box-shadow: var(--zzv3-shadow-sm);
}

body.zzv3 .tag_sidebar_widget_title,
body.zzv3 .wo_page_hdng {
  color: var(--zzv3-text);
  font-size: 15px;
  font-weight: 760;
}

body.zzv3 .rightcol .featured-users-innr,
body.zzv3 .rightcol .tag_pro_users {
  gap: 9px;
}

body.zzv3 .rightcol .btn-main,
body.zzv3 .rightcol .btn-default {
  border-radius: 11px;
}

body.zzv3 .zz-weather-widget,
body.zzv3 .zz-weather-light,
body.zzv3 .zz-weather-dark {
  margin-bottom: 16px !important;
  padding: 15px !important;
  color: var(--zzv3-text) !important;
  background: var(--zzv3-surface) !important;
  border: 1px solid var(--zzv3-border) !important;
  border-radius: 18px !important;
  box-shadow: var(--zzv3-shadow-sm) !important;
}

body.zzv3 .zz-weather-title {
  font-size: 16px;
  font-weight: 760;
}

body.zzv3 .zz-weather-refresh,
body.zzv3 .zz-weather-day {
  color: var(--zzv3-text-soft);
  background: var(--zzv3-surface-raised);
}

/* Native create menu: useful but no longer a giant detached purple tile. */
body.zzv3 .tag_create_dropup {
  right: 28px;
  bottom: 26px;
}

body.zzv3 .tag_create_dropup.tag_chat_header {
  right: 104px;
}

body.zzv3 .tag_create_dropup > .btn,
body.zzv3 .tag_create_dropup > .btn.btn-main {
  min-width: 48px;
  width: 48px;
  height: 48px;
  line-height: 47px;
  color: var(--zzv3-accent-strong) !important;
  background: var(--zzv3-surface) !important;
  border: 1px solid var(--zzv3-border-strong) !important;
  border-radius: 16px;
  box-shadow: var(--zzv3-shadow-md);
}

body.zzv3 .tag_create_dropup > .btn:hover {
  color: #fff !important;
  background: var(--zzv3-purple) !important;
}

body.zzv3 .tag_create_dropup > .dropdown-menu::before {
  background: var(--zzv3-surface);
}

/* Messages, chat, reels and live inherit the calmer V3.2 surfaces. */
body.zzv3 .tag_messages,
body.zzv3 .chat_main,
body.zzv3 .wo_reels_cont,
body.zzv3 .tag_live_stage,
body.zzv3 .tag_self_hosted_stage {
  border-color: var(--zzv3-border);
  box-shadow: var(--zzv3-shadow-md);
}

body.zzv3 .chat_main {
  border-radius: 18px 18px 0 0;
}

@media (max-width: 1199px) {
  body.zzv3.zzv3-home-surface .page-margin > .container {
    max-width: 1040px;
  }

  body.zzv3.zzv3-home-surface .middlecol {
    width: min(100%, 680px);
    max-width: 680px;
  }
}

@media (max-width: 991px) {
  body.zzv3.zzv3-home-surface .page-margin > .container {
    max-width: 720px;
  }

  body.zzv3.zzv3-home-surface .middlecol {
    width: min(100%, 720px);
    max-width: 720px;
    margin-inline: auto;
  }

  body.zzv3 .tag_stories_on_home,
  body.zzv3 .tag_home_filters,
  body.zzv3 .greetalert {
    max-width: 720px;
  }
}

@media (max-width: 767px) {
  body.zzv3 {
    --zzv3-header-height: 56px;
  }

  body.zzv3 .tag_header {
    gap: 8px;
    padding-inline: 8px;
  }

  body.zzv3 .header-brand {
    width: 36px;
    min-width: 36px;
    height: 36px;
    border-radius: 12px;
  }

  body.zzv3 .tag_header .search-input {
    height: 38px;
  }

  body.zzv3.zzv3-home-surface .page-margin {
    margin-top: 10px;
  }

  body.zzv3.zzv3-home-surface .page-margin > .container {
    width: 100%;
    padding-inline: 9px;
  }

  body.zzv3 .greetalert {
    margin-bottom: 8px;
    padding-inline: 4px;
  }

  body.zzv3 .greetalert #daynightmsg {
    font-size: 18px;
  }

  body.zzv3 .tag_stories_on_home {
    margin-bottom: 10px;
    padding-inline: 0;
  }

  body.zzv3 .tag_stories_on_home .status-list {
    gap: 9px;
    padding: 4px 2px 7px;
  }

  body.zzv3 .tag_stories_on_home .status-list > li,
  body.zzv3 .tag_stories_on_home .status-list > li > a {
    width: 96px;
    min-width: 96px;
    height: 142px;
  }

  body.zzv3 .tag_stories_on_home .status-list > li > a {
    border-radius: 17px;
  }

  body.zzv3 .tag_stories_on_home .status-list > li > a > img {
    width: 100%;
    height: 100%;
    border-radius: 16px;
  }

  body.zzv3 .tag_stories_on_home .status-list > li > a > span {
    top: 8px;
    left: 8px;
    width: 29px;
    height: 29px;
  }

  body.zzv3 .tag_stories_on_home .status-list > li.create_new > a > span {
    top: 8px;
    right: 8px;
    left: auto;
  }

  body.zzv3 .tag_stories_on_home .status-list > li > p {
    right: 8px;
    bottom: 9px;
    left: 8px;
    font-size: 11px;
  }

  body.zzv3 .tag_home_filters,
  body.zzv3.zzv3-dark .tag_home_filters {
    min-height: 44px;
    margin-bottom: 11px;
    padding: 0;
    overflow-x: auto;
  }

  body.zzv3 .tag_home_filters .tag_page_nav {
    flex: 0 0 auto;
    max-width: 100%;
    border-radius: 13px;
  }

  body.zzv3 .tag_pub_box_bg {
    min-height: 68px;
    margin-bottom: 11px;
    padding: 10px;
    border-radius: 17px;
  }

  body.zzv3 .tag_pub_box_avatar,
  body.zzv3 .tag_pub_box_avatar img {
    width: 40px;
    min-width: 40px;
    height: 40px;
  }

  body.zzv3 .tag_pub_box_bg_text {
    min-height: 40px;
    padding-inline: 12px;
    font-size: 12px;
  }

  body.zzv3 .tag_pub_box_bg_camlve {
    width: 39px;
    min-width: 39px;
    height: 39px;
  }

  body.zzv3 .post-container,
  body.zzv3 .post.wow_content,
  body.zzv3 .posts_load > div > .wow_content {
    border-radius: 17px;
  }

  body.zzv3 .post .post-heading,
  body.zzv3 .post-container .post-heading {
    padding: 13px 13px 9px;
  }

  body.zzv3 .post .post-description,
  body.zzv3 .post-container .post-description {
    padding-inline: 13px;
  }

  body.zzv3 .tag_create_dropup {
    display: none;
  }

  body.zzv3 .zzv3-mobile-nav {
    background: color-mix(in srgb, var(--zzv3-shell) 96%, transparent);
    border-color: var(--zzv3-border);
  }
}

@media (max-width: 430px) {
  body.zzv3 .tag_stories_on_home .status-list > li,
  body.zzv3 .tag_stories_on_home .status-list > li > a {
    width: 90px;
    min-width: 90px;
    height: 134px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.zzv3 .tag_stories_on_home .status-list > li > a > img {
    transition: none;
  }
}

/* V3.6.7: compact, balanced and fully usable phone header. */
@media (max-width: 767px) {
  body.zzv3 .tag_navbar_top,
  body.zzv3 .tag_navbar_top .container-fluid,
  body.zzv3 .tag_navbar_top .tag_header {
    min-height: 56px !important;
    height: 56px !important;
  }

  body.zzv3 .tag_navbar_top {
    background: var(--zzv3-surface) !important;
    background: color-mix(in srgb, var(--zzv3-surface) 94%, transparent) !important;
    border-bottom: 1px solid var(--zzv3-border) !important;
    box-shadow: 0 4px 18px rgba(22, 24, 31, 0.04) !important;
  }

  body.zzv3 .tag_navbar_top .container-fluid {
    padding: 0 !important;
  }

  body.zzv3 .tag_navbar_top .tag_header {
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: 6px !important;
    padding: 8px 10px !important;
    overflow: visible;
  }

  body.zzv3 .tag_navbar_top .tag_header > .tag_toggle_sidebar {
    order: 0;
    flex: 0 0 40px;
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    padding: 8px !important;
    color: var(--zzv3-text-soft) !important;
    background: var(--zzv3-surface-raised) !important;
    border: 1px solid transparent !important;
    border-radius: 14px !important;
    box-shadow: none !important;
  }

  body.zzv3 .tag_navbar_top .tag_header > .tag_toggle_sidebar > svg {
    width: 22px;
    height: 22px;
  }

  body.zzv3 .tag_navbar_top .tag_header > .header-brand,
  body.zzv3 .tag_navbar_top .header-brand .tag_logo_pc {
    width: 36px !important;
    min-width: 36px !important;
    height: 36px !important;
    max-width: 36px !important;
    max-height: 36px !important;
  }

  body.zzv3 .tag_navbar_top .tag_header > .header-brand {
    order: 1;
    flex: 0 0 36px;
    margin: 0 !important;
  }

  body.zzv3 .tag_navbar_top .header-brand .tag_logo_pc {
    filter: drop-shadow(0 4px 8px rgba(105, 72, 203, 0.2));
  }

  /* WoWonder collapses this form to width:0 below 520px. Keep the real search pill. */
  body.zzv3 .tag_navbar_top .tag_header > .search-container {
    position: relative !important;
    order: 2;
    display: flex !important;
    align-items: center;
    flex: 1 1 112px;
    width: auto !important;
    min-width: 72px !important;
    max-width: none !important;
    height: 40px;
    margin: 0 !important;
  }

  body.zzv3 .tag_navbar_top .tag_header > .search-container > form {
    position: relative;
    display: block !important;
    float: none !important;
    flex: 1 1 auto;
    width: 100% !important;
    min-width: 0 !important;
    height: 40px !important;
    margin: 0 !important;
    overflow: visible !important;
    border-radius: 14px !important;
  }

  body.zzv3 .tag_navbar_top .tag_header > .search-container > form > svg {
    left: 12px !important;
    width: 19px !important;
    height: 19px !important;
    opacity: 0.62 !important;
    transform: translateY(-50%) !important;
  }

  body.zzv3 .tag_navbar_top .tag_header .search-input {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 40px !important;
    padding: 0 11px 0 40px !important;
    overflow: hidden;
    color: var(--zzv3-text) !important;
    background: var(--zzv3-surface-raised) !important;
    border: 1px solid transparent !important;
    border-radius: 14px !important;
    font-size: 14px !important;
    line-height: 40px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.zzv3 .tag_navbar_top .tag_header .search-input:focus {
    background: var(--zzv3-surface) !important;
    border-color: rgba(131, 88, 232, 0.45) !important;
    box-shadow: 0 0 0 3px var(--zzv3-accent-soft) !important;
  }

  body.zzv3 .tag_navbar_top .tag_header > .tag_navbar_top_right {
    position: static !important;
    order: 3;
    display: flex !important;
    flex: 0 0 auto;
    width: auto !important;
    min-width: 0 !important;
    height: 40px !important;
    margin: 0 !important;
  }

  body.zzv3 .tag_navbar_top_right .tag_hdr_right {
    position: static !important;
    inset: auto !important;
    display: flex !important;
    align-items: center;
    justify-content: flex-end !important;
    gap: 4px !important;
    width: auto !important;
    height: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.zzv3 .tag_navbar_top_right .tag_hdr_right > .dropdown {
    flex: 0 0 40px;
    width: 40px;
    margin: 0 !important;
  }

  body.zzv3 .tag_navbar_top_right .tag_hdr_droptoggle,
  body.zzv3 .tag_hdr_right > .zz-weather-menu > .zz-weather-menu-trigger {
    display: inline-flex !important;
    align-items: center;
    justify-content: center !important;
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    gap: 0 !important;
    padding: 8px !important;
    color: var(--zzv3-text-soft) !important;
    background: var(--zzv3-surface-raised) !important;
    border: 1px solid transparent !important;
    border-radius: 14px !important;
    box-shadow: none !important;
  }

  body.zzv3 .tag_navbar_top_right .tag_hdr_droptoggle > svg {
    width: 21px !important;
    height: 21px !important;
  }

  body.zzv3 .tag_hdr_right > .zz-weather-menu > .zz-weather-menu-trigger {
    padding: 5px !important;
  }

  body.zzv3 .zz-weather-menu-icon {
    width: 28px;
    min-width: 28px;
    height: 28px;
    font-size: 16px;
    box-shadow: 0 3px 8px rgba(217, 154, 54, 0.18);
  }

  body.zzv3 .zz-weather-menu-status {
    top: 1px;
    right: 1px;
  }

  body.zzv3 .tag_navbar_top_right .tag_hdr_droptoggle:hover,
  body.zzv3 .tag_navbar_top_right .tag_hdr_droptoggle:focus,
  body.zzv3 .tag_navbar_top_right .show > .tag_hdr_droptoggle,
  body.zzv3 .tag_navbar_top_right .open > .tag_hdr_droptoggle,
  body.zzv3 .tag_navbar_top .tag_header > .tag_toggle_sidebar:hover,
  body.zzv3 .tag_navbar_top .tag_header > .tag_toggle_sidebar:focus {
    color: var(--zzv3-accent-strong) !important;
    background: var(--zzv3-accent-soft) !important;
    border-color: rgba(131, 88, 232, 0.16) !important;
  }

  /* Search becomes a focused full-width header while results are open. */
  body.zzv3 .tag_navbar_top .tag_header > .search-container.show,
  body.zzv3 .tag_navbar_top .tag_header > .search-container.open {
    position: fixed !important;
    z-index: 1105 !important;
    top: 0 !important;
    right: 0 !important;
    left: 0 !important;
    display: flex !important;
    gap: 8px;
    width: 100% !important;
    min-width: 0 !important;
    height: 56px !important;
    padding: 8px 10px !important;
    background: var(--zzv3-surface) !important;
    border-bottom: 1px solid var(--zzv3-border);
    box-shadow: 0 8px 24px rgba(22, 24, 31, 0.08);
  }

  body.zzv3 .tag_navbar_top .tag_header > .search-container.show > .tag_toggle_search,
  body.zzv3 .tag_navbar_top .tag_header > .search-container.open > .tag_toggle_search {
    position: static !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex: 0 0 40px;
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    padding: 8px !important;
    color: var(--zzv3-text-soft) !important;
    background: var(--zzv3-surface-raised) !important;
    border-radius: 14px !important;
  }

  body.zzv3 .tag_navbar_top .tag_header > .search-container.show > form,
  body.zzv3 .tag_navbar_top .tag_header > .search-container.open > form {
    flex: 1 1 auto;
    width: auto !important;
  }

  body.zzv3 .tag_navbar_top .tag_header > .search-container.show ~ .tag_navbar_top_right,
  body.zzv3 .tag_navbar_top .tag_header > .search-container.open ~ .tag_navbar_top_right {
    display: none !important;
  }

  body.zzv3 .tag_navbar_top_right .requests-container > .dropdown-menu,
  body.zzv3 .tag_navbar_top_right .notification-container > .dropdown-menu,
  body.zzv3 .tag_navbar_top .tag_header > .search-container > .search-dropdown-container {
    top: 62px !important;
  }

  body.zzv3 .tag_hdr_right > .zz-weather-menu > .zz-weather-menu-panel,
  [dir="rtl"] body.zzv3 .tag_hdr_right > .zz-weather-menu > .zz-weather-menu-panel {
    top: 62px !important;
  }

  [dir="rtl"] body.zzv3 .tag_navbar_top .tag_header > .search-container > form > svg {
    right: 12px !important;
    left: auto !important;
  }

  [dir="rtl"] body.zzv3 .tag_navbar_top .tag_header .search-input {
    padding: 0 40px 0 11px !important;
  }
}

@media (max-width: 359px) {
  body.zzv3 .tag_navbar_top .tag_header {
    gap: 4px !important;
    padding-inline: 6px !important;
  }

  body.zzv3 .tag_navbar_top .tag_header > .search-container {
    flex-basis: 44px;
    min-width: 44px !important;
  }

  body.zzv3 .tag_navbar_top .tag_header > .search-container:not(.show):not(.open) .search-input {
    padding-right: 0 !important;
    color: transparent !important;
    font-size: 0 !important;
  }

  body.zzv3 .tag_navbar_top .tag_header > .search-container:not(.show):not(.open) .search-input::placeholder {
    color: transparent !important;
  }
}

/* V3.6.2: keep the floating-chat composer usable inside WoWonder's fixed-height dock. */
body.zzv3 .chat_main .chat-tab-container,
body.zzv3 .chat_main .chat-tab-container-inner,
body.zzv3 .chat_main .chat-messages-wrapper {
  min-height: 0;
}

body.zzv3 .chat_main .chat-tab-container-inner {
  flex: 1 1 0;
}

body.zzv3 .chat_main .chat-messages-wrapper {
  flex: 1 1 auto;
  width: 100%;
}

body.zzv3 .chat_main .chat-textarea.btn-group {
  position: relative;
  z-index: 4;
  display: block;
  flex: 0 0 auto;
  width: 100%;
  min-height: 86px;
  max-height: none;
  padding: 8px 10px 9px;
  overflow: visible;
  background: var(--zzv3-surface);
  border: 0;
  border-top: 1px solid var(--zzv3-border);
  border-radius: 0;
}

body.zzv3 .chat_main .chat-textarea > form {
  display: block;
  width: 100%;
  min-width: 0;
}

body.zzv3 .chat_main .chat-textarea .chat-btns-w {
  position: relative;
  z-index: 3;
  justify-content: flex-start;
  flex-wrap: nowrap;
  gap: 8px;
  min-height: 29px;
  padding: 0 3px 7px;
  overflow: visible;
}

/* V3.6.5: keep GIF search and results inside the visible floating-chat area. */
body.zzv3 .chat_main .chat-textarea .chat-btns-w .chat_optns.open,
body.zzv3 .chat_main .chat-textarea .chat-btns-w .chat_optns.show {
  z-index: 8;
}

body.zzv3 .chat_main .chat-textarea .chat-btns-w #chat-gifs > .dropdown-menu {
  z-index: 12;
  height: 260px !important;
  overflow: hidden;
  color: var(--zzv3-text);
  background: var(--zzv3-surface);
  border: 1px solid var(--zzv3-border);
  border-radius: 16px;
  box-shadow: 0 -18px 38px rgba(15, 23, 42, 0.18);
}

body.zzv3 .chat_main .chat-textarea #chat-gifs .tag_chat_GIF {
  display: flex;
  flex-direction: column;
  gap: 8px;
  height: 100%;
  padding: 9px;
  overflow: hidden;
}

body.zzv3 .chat_main .chat-textarea .zzv36-chat-gif-search {
  position: relative;
  z-index: 3;
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  width: 100%;
  min-height: 38px;
}

body.zzv3 .chat_main .chat-textarea .zzv36-chat-gif-search > svg {
  position: absolute;
  z-index: 2;
  left: 12px;
  color: var(--zzv3-muted);
  pointer-events: none;
}

body.zzv3 .chat_main .chat-textarea .zzv36-chat-gif-search-input {
  display: block !important;
  width: 100% !important;
  height: 38px !important;
  min-height: 38px !important;
  margin: 0 !important;
  padding: 0 34px 0 38px !important;
  color: var(--zzv3-text) !important;
  background: var(--zzv3-surface-raised) !important;
  border: 1px solid var(--zzv3-border-strong) !important;
  border-radius: 12px !important;
  outline: 0;
  box-shadow: none !important;
  font-size: 12.5px;
  line-height: 38px;
  box-sizing: border-box;
  appearance: auto;
  -webkit-appearance: auto;
}

body.zzv3 .chat_main .chat-textarea .zzv36-chat-gif-search-input:focus {
  background: var(--zzv3-surface) !important;
  border-color: var(--zzv3-accent) !important;
  box-shadow: 0 0 0 3px var(--zzv3-accent-soft) !important;
}

body.zzv3 .chat_main .chat-textarea .zzv36-chat-gif-search-input::placeholder {
  color: var(--zzv3-muted);
  opacity: 1;
}

body.zzv3 .chat_main .chat-textarea #chat-gifs .tag_chat_GIF_cont {
  flex: 1 1 auto;
  width: auto;
  height: auto !important;
  min-height: 0;
  max-height: none !important;
  margin: 0 -3px;
  padding: 0;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: transparent;
  border: 0;
  border-radius: 10px;
  box-shadow: none;
  scrollbar-width: thin;
  scrollbar-color: var(--zzv3-border-strong) transparent;
}

body.zzv3 .chat_main .chat-textarea #chat-gifs .tag_chat_GIF_cont img,
body.zzv3 .chat_main .chat-textarea #chat-gifs .skel_chat_gif {
  height: 92px;
  max-height: 92px;
  object-fit: cover;
  background: var(--zzv3-surface-raised);
  border-radius: 10px;
}

body.zzv3 .chat_main .chat-textarea #chat-gifs .tag_chat_GIF_cont .empty_state {
  min-height: 100%;
  padding: 30px 10px;
  color: var(--zzv3-muted);
}

body.zzv3 .chat_main .chat-textarea textarea#sendMessage {
  position: relative;
  z-index: 2;
  display: block !important;
  width: 100% !important;
  height: 40px !important;
  min-height: 40px !important;
  max-height: 88px !important;
  margin: 0 !important;
  padding: 9px 40px 9px 13px !important;
  overflow-y: auto;
  color: var(--zzv3-text) !important;
  caret-color: var(--zzv3-purple);
  background: var(--zzv3-surface-raised) !important;
  border: 1px solid var(--zzv3-border-strong) !important;
  border-radius: 14px !important;
  outline: none !important;
  box-shadow: none !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  -webkit-user-select: text;
  user-select: text;
}

body.zzv3 .chat_main .chat-textarea textarea#sendMessage:focus {
  border-color: color-mix(in srgb, var(--zzv3-purple) 70%, transparent) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--zzv3-purple) 16%, transparent) !important;
}

body.zzv3 .chat_main .chat-textarea textarea#sendMessage::placeholder {
  color: var(--zzv3-muted) !important;
  opacity: 1;
}

body.zzv3 .chat_main .chat-textarea .tag_chat_emoji {
  z-index: 5;
  right: 18px;
  bottom: 18px;
  pointer-events: auto;
}

@supports not (border-color: color-mix(in srgb, white 50%, transparent)) {
  body.zzv3 .chat_main .chat-textarea textarea#sendMessage:focus {
    border-color: var(--zzv3-purple) !important;
    box-shadow: 0 0 0 3px rgba(127, 83, 255, 0.16) !important;
  }
}

/*
 * V3.3 screenshot-led refinement
 * Aligns the home hierarchy, removes the double post shell and compacts the
 * account menu without changing WoWonder markup or behaviour.
 */
@media (min-width: 1200px) {
  body.zzv3.zzv3-home-surface .greetalert,
  body.zzv3.zzv3-home-surface .tag_stories_on_home,
  body.zzv3.zzv3-home-surface .tag_home_filters {
    max-width: calc(var(--zzv3-feed-width) + var(--zzv3-rail-width) + var(--zzv3-column-gap));
  }
}

body.zzv3 .greetalert #daynightmsg,
body.zzv3 .greetalert #daynightmsg * {
  color: var(--zzv3-text) !important;
}

body.zzv3 .greetalert #daynightmsg {
  font-size: 21px !important;
  font-weight: 760 !important;
  letter-spacing: -0.025em;
}

/* The outer WoWonder wrapper is structural; the inner panel is the card. */
body.zzv3.zzv3-home-surface .posts_load .post-container {
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.zzv3.zzv3-home-surface .posts_load .post-container > .post > .panel {
  margin: 0 0 16px !important;
  overflow: visible;
  background: var(--zzv3-surface) !important;
  border: 1px solid var(--zzv3-border) !important;
  border-radius: 20px !important;
  box-shadow: var(--zzv3-shadow-sm) !important;
}

body.zzv3.zzv3-home-surface .posts_load .post-container > .post > .panel > .post-description {
  padding-bottom: 0;
}

body.zzv3.zzv3-home-surface .posts_load .wow_shared_posts {
  background: var(--zzv3-surface-soft);
  border-color: var(--zzv3-border-strong);
  border-radius: 16px;
}

body.zzv3.zzv3-home-surface .posts_load .tag_post_actions {
  margin: 14px -17px 0;
  padding: 8px 10px;
  border-top: 1px solid var(--zzv3-border);
}

/* Empty reaction/count rows previously created the large blank post footer. */
body.zzv3.zzv3-home-surface .posts_load .tag_post_foot_stats {
  min-height: 0;
  margin: 0;
  padding: 0 0 3px;
}

body.zzv3.zzv3-home-surface .posts_load .tag_post_foot_stats .post-actions {
  min-height: 0;
  margin: 0 !important;
  padding: 0 !important;
}

body.zzv3.zzv3-home-surface .posts_load .tag_post_foot_stats .post-actions .stat-item {
  min-height: 0;
  margin: 0;
  padding: 4px 5px;
  background: transparent;
  border-radius: 8px;
}

body.zzv3.zzv3-home-surface .posts_load .tag_post_foot_stats .post-actions:not(:has(.stat-item:not(.d-none))),
body.zzv3.zzv3-home-surface .posts_load .tag_post_foot_stats .post-actions:has(> .like-stat .like-emo:empty) {
  display: none !important;
}

body.zzv3.zzv3-home-surface .posts_load .post-footer.hidden {
  display: none !important;
}

/* Account menu: compact social-app sheet instead of a tall square admin list. */
@media (min-width: 768px) {
  body.zzv3 .tag_navbar_top_right .tag_hdr_right > .tag_main_usr_ddmenu .tag_hdr_user_dropdown {
    right: 4px !important;
    bottom: auto !important;
    left: auto !important;
    width: 320px !important;
    min-width: 320px !important;
    max-width: 320px !important;
    max-height: min(680px, calc(100vh - 88px)) !important;
    padding: 9px !important;
    overflow-x: hidden;
    overflow-y: auto;
    color: var(--zzv3-text) !important;
    background: var(--zzv3-surface) !important;
    border: 1px solid var(--zzv3-border) !important;
    border-radius: 20px !important;
    box-shadow: 0 22px 60px rgba(9, 10, 13, 0.24) !important;
  }

  body.zzv3 .tag_hdr_user_dropdown > li > a {
    display: flex;
    align-items: center;
    min-height: 44px;
    padding: 5px 8px;
    color: var(--zzv3-text-soft) !important;
    line-height: 34px;
    border-radius: 12px;
    font-size: 13.5px;
    font-weight: 630;
  }

  body.zzv3 .tag_hdr_user_dropdown > li > a:hover,
  body.zzv3 .tag_hdr_user_dropdown > li > a:focus {
    color: var(--zzv3-text) !important;
    background: var(--zzv3-surface-raised) !important;
  }

  body.zzv3 .tag_hdr_user_dropdown > li > a::before {
    display: none;
  }

  body.zzv3 .tag_hdr_user_dropdown > li > a > svg,
  body.zzv3 .tag_hdr_user_dropdown > li > a > img {
    width: 32px;
    min-width: 32px;
    height: 32px;
    margin-right: 12px;
  }

  body.zzv3 .tag_hdr_user_dropdown > li > a > svg {
    padding: 7px;
    color: var(--zzv3-accent-strong);
    background: var(--zzv3-accent-soft);
  }

  body.zzv3 .tag_hdr_user_submenu {
    gap: 5px;
    margin: 1px 0 7px;
    padding-left: 52px;
  }

  body.zzv3 .tag_hdr_user_submenu a {
    min-height: 28px;
    margin: 0;
    padding: 0 9px;
    color: var(--zzv3-text-soft) !important;
    background: var(--zzv3-surface-raised);
    border-radius: 999px;
    font-size: 11.5px;
    line-height: 28px;
  }

  body.zzv3 .tag_hdr_user_submenu a:hover {
    color: var(--zzv3-accent-strong) !important;
    background: var(--zzv3-accent-soft);
  }

  body.zzv3 .tag_hdr_user_dropdown hr {
    margin: 6px 4px;
    border-color: var(--zzv3-border);
  }
}

@media (max-width: 767px) {
  body.zzv3.zzv3-home-surface .posts_load .post-container > .post > .panel {
    border-radius: 17px !important;
  }
}

/* V3.3.1: preserve WoWonder's native dropdown mechanics and restore hit targets. */
@media (min-width: 768px) {
  body.zzv3 .tag_navbar_top_right .tag_hdr_right {
    z-index: 1048 !important;
  }

  body.zzv3 .tag_navbar_top_right .tag_main_usr_ddmenu,
  body.zzv3 .tag_navbar_top_right .tag_main_usr_ddmenu.show {
    position: relative;
    z-index: 1;
    pointer-events: auto !important;
  }

  body.zzv3 .tag_navbar_top_right .tag_hdr_right > .tag_main_usr_ddmenu .tag_hdr_user_dropdown {
    max-height: calc(100vh - 100px) !important;
    overflow-y: auto !important;
    overscroll-behavior-y: contain;
    scrollbar-gutter: stable;
    touch-action: pan-y pinch-zoom;
    pointer-events: auto !important;
    isolation: isolate;
    z-index: 2 !important;
  }

  body.zzv3 .tag_hdr_user_dropdown > li {
    position: relative;
    pointer-events: auto !important;
  }

  body.zzv3 .tag_hdr_user_dropdown > li > a {
    position: relative;
    z-index: 2;
    display: block !important;
    width: 100%;
    cursor: pointer;
    pointer-events: auto !important;
  }

  body.zzv3 .tag_hdr_user_dropdown > li > a::before {
    pointer-events: none !important;
  }

  body.zzv3 .tag_hdr_user_dropdown > li > a > * {
    pointer-events: none !important;
  }

  body.zzv3 .tag_hdr_user_dropdown .tag_hdr_user_submenu,
  body.zzv3 .tag_hdr_user_dropdown .tag_hdr_user_submenu > a,
  body.zzv3 .tag_hdr_user_dropdown #collapseInvite,
  body.zzv3 .tag_hdr_user_dropdown #collapseInvite * {
    pointer-events: auto !important;
  }

  body.zzv3 .tag_hdr_user_dropdown .tag_hdr_user_submenu > a > * {
    pointer-events: none !important;
  }

  body.zzv3 .tag_hdr_user_dropdown::-webkit-scrollbar {
    width: 10px;
  }

  body.zzv3 .tag_hdr_user_dropdown::-webkit-scrollbar-thumb {
    background: color-mix(in srgb, var(--zzv3-accent) 55%, transparent);
    border: 3px solid var(--zzv3-surface);
    border-radius: 999px;
  }
}

/* V3.3.2: render the live account menu above WoWonder's fixed shell. */
@media (min-width: 768px) {
  body.zzv3 > .tag_hdr_user_dropdown.zzv3-profile-menu-portal,
  body.zzv3 > .tag_mobi_langs_menu.zzv3-profile-language-portal {
    position: fixed !important;
    top: var(--zzv3-profile-menu-top, 72px) !important;
    right: var(--zzv3-profile-menu-right, 12px) !important;
    bottom: auto !important;
    left: auto !important;
    z-index: 1090 !important;
    float: none !important;
    width: 320px !important;
    min-width: 320px !important;
    max-width: calc(100vw - 24px) !important;
    max-height: var(--zzv3-profile-menu-max-height, calc(100vh - 88px)) !important;
    margin: 0 !important;
    padding: 9px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior-y: contain;
    color: var(--zzv3-text) !important;
    background: var(--zzv3-surface) !important;
    border: 1px solid var(--zzv3-border) !important;
    border-radius: 20px !important;
    box-shadow: 0 24px 70px rgba(5, 7, 12, 0.38) !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    pointer-events: auto !important;
    isolation: isolate;
    touch-action: pan-y pinch-zoom;
    -webkit-overflow-scrolling: touch;
  }

  body.zzv3 > .tag_hdr_user_dropdown.zzv3-profile-menu-portal {
    display: block !important;
  }

  body.zzv3 > .tag_mobi_langs_menu.zzv3-profile-language-portal {
    display: none !important;
    pointer-events: auto !important;
  }

  body.zzv3.zzv3-profile-language-open > .tag_hdr_user_dropdown.zzv3-profile-menu-portal {
    display: none !important;
  }

  body.zzv3.zzv3-profile-language-open > .tag_mobi_langs_menu.zzv3-profile-language-portal {
    display: block !important;
  }

  body.zzv3 > .tag_hdr_user_dropdown.zzv3-profile-menu-portal > li,
  body.zzv3 > .tag_hdr_user_dropdown.zzv3-profile-menu-portal > li > a {
    pointer-events: auto !important;
  }

  body.zzv3 > .tag_hdr_user_dropdown.zzv3-profile-menu-portal > li > a {
    display: flex !important;
    align-items: center;
  }

  body.zzv3 > .tag_mobi_langs_menu.zzv3-profile-language-portal > .btn,
  body.zzv3 > .tag_mobi_langs_menu.zzv3-profile-language-portal > li,
  body.zzv3 > .tag_mobi_langs_menu.zzv3-profile-language-portal > li > a {
    pointer-events: auto !important;
  }
}

/* V3.3.5: let Pro member cards use the full widget width without becoming oversized. */
@media (min-width: 1200px) {
  body.zzv3.zzv3-home-surface .rightcol .tag_pro_users {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: start;
    gap: 10px;
    margin: 0;
  }

  body.zzv3.zzv3-home-surface .rightcol .tag_pro_users:not(:has(> div:nth-child(3))) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.zzv3.zzv3-home-surface .rightcol .tag_pro_users > div {
    width: auto !important;
    min-width: 0 !important;
    padding: 0 !important;
  }

  body.zzv3.zzv3-home-surface .rightcol .tag_pro_users > div > a {
    height: 100%;
    margin: 0 !important;
    padding: 6px !important;
    overflow: hidden;
    background: var(--zzv3-surface-soft);
    border: 1px solid var(--zzv3-border) !important;
    border-radius: 14px;
    box-shadow: none !important;
  }

  body.zzv3.zzv3-home-surface .rightcol .tag_pro_users > div img {
    width: 100%;
    height: auto !important;
    aspect-ratio: 4 / 5;
    object-fit: cover;
    border-radius: 10px !important;
  }

  body.zzv3.zzv3-home-surface .rightcol .tag_pro_users > div h4 {
    margin: 8px 2px 2px;
    overflow: hidden;
    color: var(--zzv3-text);
    font-size: 13px;
    line-height: 17px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}

/* V3.4.0: compact live weather in the social header. */
body.zzv3 .tag_hdr_right > .zz-weather-menu {
  position: relative;
  margin: 0 3px;
}

body.zzv3 .tag_hdr_right > .zz-weather-menu > .zz-weather-menu-trigger {
  position: relative;
  display: inline-flex !important;
  align-items: center;
  justify-content: flex-start;
  width: auto !important;
  min-width: 76px !important;
  height: 42px !important;
  gap: 7px;
  padding: 4px 11px 4px 5px !important;
  overflow: visible;
  color: var(--zzv3-text) !important;
  background: linear-gradient(135deg, rgba(244, 184, 74, 0.13), var(--zzv3-accent-soft)) !important;
  border: 1px solid rgba(217, 154, 54, 0.18) !important;
  border-radius: 999px !important;
  box-shadow: 0 5px 18px rgba(38, 28, 10, 0.06);
  transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

body.zzv3 .zz-weather-menu-trigger::after {
  display: none !important;
}

body.zzv3 .zz-weather-menu-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  min-width: 32px;
  height: 32px;
  overflow: hidden;
  font-family: "Apple Color Emoji", "Segoe UI Emoji", sans-serif;
  font-size: 18px;
  line-height: 1;
  background: linear-gradient(145deg, #fff5bd 0%, #ffd166 52%, #ff9f55 100%);
  border: 1px solid rgba(255, 255, 255, 0.74);
  border-radius: 50%;
  box-shadow: 0 5px 13px rgba(217, 154, 54, 0.25);
}

body.zzv3 .zz-weather-menu-temp {
  min-width: 27px;
  font-size: 13px;
  font-variant-numeric: tabular-nums;
  font-weight: 780;
  letter-spacing: -0.025em;
  text-align: center;
}

body.zzv3 .zz-weather-menu-status {
  position: absolute;
  top: 3px;
  right: 4px;
  width: 7px;
  height: 7px;
  background: var(--zzv3-accent);
  border: 2px solid var(--zzv3-surface);
  border-radius: 50%;
  box-sizing: content-box;
}

body.zzv3 .zz-weather-menu.is-loading .zz-weather-menu-status {
  animation: zzWeatherPulse 1.2s ease-in-out infinite;
}

body.zzv3 .zz-weather-menu.is-ready .zz-weather-menu-status {
  background: var(--zzv3-green);
}

body.zzv3 .zz-weather-menu.has-error .zz-weather-menu-status {
  background: var(--zzv3-coral);
}

body.zzv3 .zz-weather-menu.has-error .zz-weather-menu-temp {
  color: var(--zzv3-coral);
}

body.zzv3 .zz-weather-menu.open > .zz-weather-menu-trigger,
body.zzv3 .zz-weather-menu.show > .zz-weather-menu-trigger {
  border-color: rgba(131, 88, 232, 0.4) !important;
  box-shadow: 0 0 0 3px var(--zzv3-accent-soft), 0 7px 22px rgba(38, 28, 10, 0.09);
}

body.zzv3 .tag_hdr_right > .zz-weather-menu > .zz-weather-menu-panel {
  position: absolute !important;
  top: calc(100% + 10px) !important;
  right: 0 !important;
  bottom: auto !important;
  left: auto !important;
  z-index: 1095 !important;
  width: 350px !important;
  min-width: 350px !important;
  height: auto !important;
  max-height: calc(100vh - 88px) !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  color: var(--zzv3-text) !important;
  background: var(--zzv3-surface) !important;
  background: color-mix(in srgb, var(--zzv3-surface) 96%, transparent) !important;
  border: 1px solid var(--zzv3-border-strong) !important;
  border-radius: 20px !important;
  box-shadow: 0 24px 64px rgba(8, 10, 14, 0.24) !important;
  backdrop-filter: blur(20px) saturate(145%);
  -webkit-backdrop-filter: blur(20px) saturate(145%);
  transform-origin: top right;
  isolation: isolate;
}

body.zzv3 .zz-weather-menu.open > .zz-weather-menu-panel,
body.zzv3 .zz-weather-menu.show > .zz-weather-menu-panel {
  animation: zzWeatherPanelIn 170ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

body.zzv3 .zz-weather-menu-panel::before {
  content: "";
  position: absolute;
  top: 0;
  right: 18px;
  left: 18px;
  z-index: 2;
  height: 3px;
  background: linear-gradient(90deg, #ffd166, #ff8a65, var(--zzv3-accent));
  border-radius: 0 0 999px 999px;
  pointer-events: none;
}

body.zzv3 .zz-weather-menu-panel .zz-weather-widget,
body.zzv3 .zz-weather-menu-panel .zz-weather-light,
body.zzv3 .zz-weather-menu-panel .zz-weather-dark {
  margin: 0 !important;
  padding: 18px !important;
  color: var(--zzv3-text) !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 20px !important;
  box-shadow: none !important;
}

body.zzv3 .zz-weather-menu-panel .zz-weather-head {
  margin-bottom: 16px;
}

body.zzv3 .zz-weather-menu-panel .zz-weather-title {
  font-size: 16px;
  font-weight: 800;
  letter-spacing: -0.02em;
}

body.zzv3 .zz-weather-menu-panel .zz-weather-subtitle {
  margin-top: 2px;
  color: var(--zzv3-muted);
  opacity: 1;
}

body.zzv3 .zz-weather-menu-panel .zz-weather-refresh {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  padding: 0;
  color: var(--zzv3-text-soft);
  background: var(--zzv3-surface-raised);
  border: 1px solid var(--zzv3-border);
  border-radius: 12px;
  transition: color 150ms ease, background 150ms ease, transform 150ms ease;
}

body.zzv3 .zz-weather-menu-panel .zz-weather-now {
  gap: 14px;
  margin-bottom: 16px;
  padding: 14px;
  background: linear-gradient(135deg, rgba(255, 209, 102, 0.15), var(--zzv3-accent-soft));
  border: 1px solid var(--zzv3-border);
  border-radius: 16px;
}

body.zzv3 .zz-weather-menu-panel .zz-weather-temp {
  min-width: 92px;
  color: var(--zzv3-text);
  font-size: 38px;
  letter-spacing: -0.055em;
}

body.zzv3 .zz-weather-menu-panel .zz-weather-meta {
  color: var(--zzv3-text-soft);
  line-height: 1.65;
}

body.zzv3 .zz-weather-menu-panel .zz-weather-meta > div:first-child {
  color: var(--zzv3-text);
  font-weight: 760;
}

body.zzv3 .zz-weather-menu-panel .zz-weather-days {
  gap: 8px;
}

body.zzv3 .zz-weather-menu-panel .zz-weather-day {
  min-width: 0;
  padding: 10px;
  color: var(--zzv3-text-soft);
  background: var(--zzv3-surface-raised);
  border: 1px solid var(--zzv3-border);
  border-radius: 13px;
}

body.zzv3 .zz-weather-menu-panel .zz-weather-day-name,
body.zzv3 .zz-weather-menu-panel .zz-weather-day-temp {
  color: var(--zzv3-text);
}

body.zzv3 .zz-weather-menu-panel .zz-weather-loading,
body.zzv3 .zz-weather-menu-panel .zz-weather-error {
  padding: 12px;
  background: var(--zzv3-surface-raised);
  border-radius: 13px;
}

body.zzv3 .zz-weather-menu-panel .zz-weather-error {
  color: var(--zzv3-coral);
  background: rgba(232, 93, 117, 0.1);
}

[dir="rtl"] body.zzv3 .tag_hdr_right > .zz-weather-menu > .zz-weather-menu-panel {
  right: auto !important;
  left: 0 !important;
  transform-origin: top left;
}

@media (hover: hover) and (pointer: fine) {
  body.zzv3 .tag_hdr_right > .zz-weather-menu > .zz-weather-menu-trigger:hover {
    transform: translateY(-1px);
    border-color: rgba(217, 154, 54, 0.34) !important;
    box-shadow: 0 9px 24px rgba(38, 28, 10, 0.11);
  }

  body.zzv3 .zz-weather-menu-panel .zz-weather-refresh:hover {
    color: var(--zzv3-accent-strong);
    background: var(--zzv3-accent-soft);
    transform: rotate(20deg);
  }
}

@media (max-width: 1100px) {
  body.zzv3 .tag_hdr_right > .zz-weather-menu > .zz-weather-menu-trigger {
    width: 42px !important;
    min-width: 42px !important;
    padding: 4px !important;
  }

  body.zzv3 .zz-weather-menu-temp {
    display: none;
  }
}

@media (max-width: 767px) {
  body.zzv3 .tag_hdr_right > .zz-weather-menu {
    margin: 0 !important;
  }

  body.zzv3 .tag_hdr_right > .zz-weather-menu > .zz-weather-menu-panel,
  [dir="rtl"] body.zzv3 .tag_hdr_right > .zz-weather-menu > .zz-weather-menu-panel {
    position: fixed !important;
    top: auto !important;
    right: 10px !important;
    bottom: 57px !important;
    left: 10px !important;
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    max-height: calc(100vh - 80px) !important;
    border-radius: 20px !important;
    transform-origin: bottom center;
  }

  body.zzv3 .zz-weather-menu-panel .zz-weather-now {
    flex-direction: row !important;
    align-items: center !important;
  }

  body.zzv3 .zz-weather-menu-panel .zz-weather-days {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  body.zzv3 .zz-weather-menu-panel .zz-weather-day {
    padding: 8px;
  }

  body.zzv3 .zz-weather-menu-panel .zz-weather-day-desc {
    display: none;
  }
}

@keyframes zzWeatherPulse {
  0%, 100% { opacity: 0.45; transform: scale(0.82); }
  50% { opacity: 1; transform: scale(1.15); }
}

@keyframes zzWeatherPanelIn {
  from { opacity: 0; transform: translateY(-6px) scale(0.98); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  body.zzv3 .zz-weather-menu-status,
  body.zzv3 .zz-weather-menu-panel,
  body.zzv3 .zz-weather-menu-trigger,
  body.zzv3 .zz-weather-refresh {
    animation: none !important;
    transition: none !important;
  }
}

/* V3.4.2: centre the actual feed, not the feed plus its right rail. */
@media (min-width: 1600px) {
  body.zzv3.zzv3-home-surface .page-margin > .container {
    max-width: calc(
      var(--zzv3-rail-width) +
      var(--zzv3-column-gap) +
      var(--zzv3-feed-width) +
      var(--zzv3-column-gap) +
      var(--zzv3-rail-width)
    ) !important;
  }

  body.zzv3.zzv3-home-surface .page-margin > .container > .row {
    grid-template-columns:
      minmax(0, var(--zzv3-rail-width))
      minmax(0, var(--zzv3-feed-width))
      minmax(0, var(--zzv3-rail-width)) !important;
  }

  body.zzv3.zzv3-home-surface .page-margin .middlecol {
    grid-column: 2;
  }

  body.zzv3.zzv3-home-surface .page-margin .rightcol {
    grid-column: 3;
  }

  body.zzv3.zzv3-home-surface .home-announcement,
  body.zzv3.zzv3-home-surface .greetalert,
  body.zzv3.zzv3-home-surface .tag_stories_on_home,
  body.zzv3.zzv3-home-surface .tag_home_filters,
  body.zzv3.zzv3-home-surface .page-margin > .container > hr.style-two {
    width: min(100%, var(--zzv3-feed-width));
    max-width: var(--zzv3-feed-width) !important;
    margin-right: auto !important;
    margin-left: auto !important;
  }

  body.zzv3.zzv3-home-surface .tag_stories_on_home .status-list {
    justify-content: center;
    justify-content: safe center;
  }

  body.zzv3.zzv3-home-surface .tag_stories_on_home .status-list:has(> li:nth-child(6):not(.story_empty)) {
    justify-content: flex-start;
  }

  body.zzv3.zzv3-home-surface .tag_home_filters {
    justify-content: center;
  }

  body.zzv3.zzv3-home-surface .tag_home_filters .tag_page_nav {
    margin-right: auto;
    margin-left: auto;
  }
}

/* V3.4.3: make the home filter rail match the composer width. */
@media (min-width: 768px) {
  body.zzv3.zzv3-home-surface .tag_home_filters.home > .tag_page_nav {
    width: 100%;
    min-width: 0;
    flex: 1 1 100%;
    justify-content: stretch;
    margin: 0 !important;
  }

  body.zzv3.zzv3-home-surface .tag_home_filters.home > .tag_page_nav > .filter-by-li {
    min-width: 0;
    flex: 1 1 0;
    margin: 0 !important;
  }

  body.zzv3.zzv3-home-surface .tag_home_filters.home > .tag_page_nav > .filter-by-li:last-child {
    padding-right: 0 !important;
  }

  body.zzv3.zzv3-home-surface .tag_home_filters.home > .tag_page_nav > .filter-by-li > a {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-width: 0;
    gap: 7px;
    padding-right: 9px !important;
    padding-left: 9px !important;
  }

  body.zzv3.zzv3-home-surface .tag_home_filters.home > .tag_home_goup {
    position: absolute;
    z-index: 3;
    top: 50%;
    right: 6px;
    min-width: 60px;
    margin: 0 !important;
    transform: translateY(-50%);
  }

  body.zzv3.zzv3-home-surface .tag_home_filters.home:has(> .tag_home_goup.btn-home-go-up) > .tag_page_nav {
    padding-right: 72px;
  }
}

/*
 * V3.5: product navigation and everyday social workflows.
 * This layer keeps WoWonder's native data/actions and improves their hierarchy.
 */

/* Feed modes: one calm control for discovery, relations, chronology and saved posts. */
body.zzv3.zzv3-home-surface .zzv35-feed-tabs {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: min(100%, var(--zzv3-feed-width));
  min-height: 70px;
  gap: 18px;
  margin: 18px auto 10px;
  padding: 10px 12px 10px 18px;
  color: var(--zzv3-text);
  background: var(--zzv3-surface);
  border: 1px solid var(--zzv3-border);
  border-radius: 20px;
  box-shadow: var(--zzv3-shadow-sm);
}

body.zzv3 .zzv35-feed-tabs-heading {
  display: flex;
  min-width: 126px;
  flex-direction: column;
  gap: 2px;
}

body.zzv3 .zzv35-feed-tabs-heading strong {
  color: var(--zzv3-text);
  font-size: 15px;
  font-weight: 780;
  letter-spacing: -0.015em;
}

body.zzv3 .zzv35-feed-tabs-heading span {
  color: var(--zzv3-muted);
  font-size: 11px;
  line-height: 1.25;
}

body.zzv3 .zzv35-feed-tabs-options {
  display: grid;
  min-width: 0;
  flex: 1 1 auto;
  grid-template-columns: repeat(4, minmax(76px, 1fr));
  gap: 6px;
  padding: 4px;
  background: var(--zzv3-surface-soft);
  border: 1px solid var(--zzv3-border);
  border-radius: 15px;
}

body.zzv3 .zzv35-feed-tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  height: 42px;
  gap: 7px;
  padding: 0 10px;
  color: var(--zzv3-text-soft);
  background: transparent;
  border: 0;
  border-radius: 11px;
  outline: 0;
  font-size: 12px;
  font-weight: 680;
  white-space: nowrap;
  transition: color 150ms ease, background 150ms ease, box-shadow 150ms ease, transform 150ms ease;
}

body.zzv3 .zzv35-feed-tab-mark {
  width: 7px;
  height: 7px;
  flex: 0 0 7px;
  background: var(--zzv3-muted);
  border-radius: 50%;
  opacity: 0.48;
  transition: opacity 150ms ease, transform 150ms ease;
}

body.zzv3 .zzv35-feed-tab[data-feed-mode="following"] .zzv35-feed-tab-mark {
  background: var(--zzv3-blue);
}

body.zzv3 .zzv35-feed-tab[data-feed-mode="latest"] .zzv35-feed-tab-mark {
  background: var(--zzv3-green);
}

body.zzv3 .zzv35-feed-tab[data-feed-mode="favorites"] .zzv35-feed-tab-mark {
  background: var(--zzv3-coral);
}

body.zzv3 .zzv35-feed-tab.active {
  color: var(--zzv3-accent-strong);
  background: var(--zzv3-surface);
  box-shadow: 0 1px 2px rgba(15, 16, 19, 0.06), 0 5px 14px rgba(15, 16, 19, 0.05);
}

body.zzv3 .zzv35-feed-tab.active .zzv35-feed-tab-mark {
  background: currentColor;
  opacity: 1;
  transform: scale(1.22);
}

body.zzv3 .zzv35-feed-tab:focus-visible {
  box-shadow: 0 0 0 3px var(--zzv3-accent-soft);
}

body.zzv3.zzv3-home-surface .tag_home_post_order {
  display: none !important;
}

body.zzv3 #posts-laoded {
  position: relative;
  min-height: 96px;
  transition: opacity 140ms ease;
}

body.zzv3 #posts-laoded.zzv35-feed-loading {
  cursor: progress;
  opacity: 0.52;
  pointer-events: none;
}

/* Composer: compact entry point, strong modal hierarchy and device-local drafts. */
body.zzv3 .tag_pub_box_bg .tag_pub_box_bg_text {
  display: flex !important;
  min-width: 0;
  flex: 1 1 auto;
  align-items: flex-start !important;
  justify-content: center !important;
  flex-direction: column;
  gap: 2px;
  text-align: left;
}

body.zzv3 .tag_pub_box_bg .tag_pub_box_bg_text > span {
  display: block;
  width: 100%;
  overflow: hidden;
  color: var(--zzv3-text-soft);
  font-size: 13px;
  font-weight: 650;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.zzv3 .tag_pub_box_bg .tag_pub_box_bg_text > small {
  display: block;
  color: var(--zzv3-muted);
  font-size: 10px;
  font-weight: 520;
  letter-spacing: 0;
}

body.zzv3 .tag_main_pub_box .modal-dialog {
  width: min(680px, calc(100vw - 28px));
  max-width: 680px;
}

body.zzv3 .tag_main_pub_box .modal-content {
  overflow: hidden;
  border: 1px solid var(--zzv3-border-strong) !important;
  border-radius: 24px !important;
  box-shadow: 0 28px 80px rgba(15, 16, 19, 0.22) !important;
}

body.zzv3 .tag_main_pub_box .modal-header {
  min-height: 76px;
  padding: 12px 16px !important;
  border-bottom: 1px solid var(--zzv3-border) !important;
}

body.zzv3 .tag_main_pub_box .modal-header > div:first-child {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 10px;
}

body.zzv3 .zzv35-composer-title {
  display: inline-flex;
  min-width: 0;
  flex-direction: column;
  gap: 1px;
  text-align: left;
}

body.zzv3 .zzv35-composer-title strong {
  color: var(--zzv3-text);
  font-size: 16px;
  font-weight: 790;
  letter-spacing: -0.02em;
}

body.zzv3 .zzv35-composer-title small {
  color: var(--zzv3-muted);
  font-size: 11px;
  font-weight: 520;
}

body.zzv3 .tag_main_pub_box #post-textarea {
  min-height: 150px;
  padding: 20px 20px 10px;
}

body.zzv3 .tag_main_pub_box #post-textarea .postText {
  min-height: 116px;
  color: var(--zzv3-text);
  font-size: 18px;
  line-height: 1.48;
}

body.zzv3 .zzv35-composer-draft {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 34px;
  gap: 12px;
  padding: 3px 20px 9px;
  color: var(--zzv3-muted);
  font-size: 11px;
}

body.zzv3 .zzv35-composer-draft-status[data-state="saved"],
body.zzv3 .zzv35-composer-draft-status[data-state="restored"] {
  color: var(--zzv3-green);
}

body.zzv3 .zzv35-composer-draft-status[data-state="error"] {
  color: var(--zzv3-coral);
}

body.zzv3 .zzv35-composer-draft-clear {
  padding: 4px 8px;
  color: var(--zzv3-text-soft);
  background: transparent;
  border: 0;
  border-radius: 8px;
  font-size: 11px;
  font-weight: 650;
}

body.zzv3 .zzv35-composer-draft-clear:hover,
body.zzv3 .zzv35-composer-draft-clear:focus-visible {
  color: var(--zzv3-coral);
  background: rgba(232, 93, 117, 0.1);
  outline: 0;
}

body.zzv3 .tag_main_pub_box .publisher-box-footer {
  border-top: 1px solid var(--zzv3-border);
}

body.zzv3 .tag_main_pub_box #publisher-button {
  min-width: 92px;
  height: 42px;
  padding: 0 18px;
  border-radius: 12px;
  font-weight: 740;
}

/* Post actions: save is a first-class action, while native share/like/comment stay intact. */
body.zzv3 .zzv35-post-secondary-actions {
  gap: 4px;
}

body.zzv3 .zzv35-save-post {
  min-height: 38px;
  gap: 7px;
  margin: 0;
  padding: 0 11px;
  color: var(--zzv3-text-soft);
  background: transparent;
  border: 0;
  border-radius: 11px;
  font: inherit;
  font-weight: 620;
  transition: color 150ms ease, background 150ms ease, transform 150ms ease;
}

body.zzv3 .zzv35-save-post svg {
  width: 20px;
  height: 20px;
}

body.zzv3 .zzv35-save-post.active {
  color: var(--zzv3-accent-strong);
  background: var(--zzv3-accent-soft);
}

body.zzv3 .zzv35-save-post:hover,
body.zzv3 .zzv35-save-post:focus-visible {
  color: var(--zzv3-accent-strong);
  background: var(--zzv3-accent-soft);
  outline: 0;
}

/* Notification centre: scannable categories with explicit new/earlier groups. */
body.zzv3 .notification-container > .zzv35-notification-menu {
  width: 430px !important;
  min-width: 430px !important;
  max-width: calc(100vw - 24px) !important;
  max-height: min(720px, calc(100vh - 84px)) !important;
  padding: 10px !important;
  overflow-x: hidden;
  overflow-y: auto;
  background: var(--zzv3-surface) !important;
  border: 1px solid var(--zzv3-border-strong) !important;
  border-radius: 22px !important;
  box-shadow: var(--zzv3-shadow-md) !important;
}

body.zzv3 .zzv35-notification-tools {
  position: sticky;
  z-index: 4;
  top: -10px;
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 -2px 8px;
  padding: 8px 2px 9px;
  background: var(--zzv3-surface);
  border-bottom: 1px solid var(--zzv3-border);
}

body.zzv3 .zzv35-notification-filters {
  display: flex;
  min-width: 0;
  flex: 1 1 auto;
  gap: 4px;
  overflow-x: auto;
  scrollbar-width: none;
}

body.zzv3 .zzv35-notification-filters::-webkit-scrollbar {
  display: none;
}

body.zzv3 .zzv35-notification-filters button,
body.zzv3 .zzv35-notification-read {
  min-height: 34px;
  padding: 0 10px;
  color: var(--zzv3-text-soft);
  background: var(--zzv3-surface-soft);
  border: 1px solid transparent;
  border-radius: 10px;
  font-size: 11px;
  font-weight: 690;
  white-space: nowrap;
}

body.zzv3 .zzv35-notification-filters button.active {
  color: var(--zzv3-accent-strong);
  background: var(--zzv3-accent-soft);
  border-color: rgba(131, 88, 232, 0.16);
}

body.zzv3 .zzv35-notification-read {
  flex: 0 0 auto;
  color: var(--zzv3-accent-strong);
  background: transparent;
}

body.zzv3 .zzv35-notification-filters button:focus-visible,
body.zzv3 .zzv35-notification-read:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 3px var(--zzv3-accent-soft);
}

body.zzv3 #hdr_notifi > .turn-off-sound {
  min-height: 36px;
  margin: 0 0 5px;
  padding: 7px 10px;
  color: var(--zzv3-muted);
  background: transparent;
  border-radius: 10px;
  font-size: 11px;
}

body.zzv3 #hdr_notifi > .turn-off-sound svg {
  width: 17px;
  height: 17px;
}

body.zzv3 .zzv35-notification-group-label {
  padding: 10px 9px 5px;
  color: var(--zzv3-muted);
  font-size: 10px;
  font-weight: 790;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

body.zzv3 #notification-list > .notification-list {
  position: relative;
  margin: 2px 0;
  overflow: hidden;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 14px;
  transition: background 140ms ease, border-color 140ms ease, transform 140ms ease;
}

body.zzv3 #notification-list > .notification-list > a {
  display: block;
  padding: 10px;
  color: var(--zzv3-text);
}

body.zzv3 #notification-list > .notification-list.unread {
  background: var(--zzv3-accent-soft);
  border-color: rgba(131, 88, 232, 0.12);
}

body.zzv3 #notification-list > .notification-list.unread::before {
  position: absolute;
  top: 50%;
  left: 4px;
  width: 3px;
  height: 24px;
  background: var(--zzv3-accent);
  border-radius: 99px;
  content: "";
  transform: translateY(-50%);
}

body.zzv3 #notification-list > .notification-list:hover {
  background: var(--zzv3-surface-hover);
  border-color: var(--zzv3-border);
}

body.zzv3 #notification-list > .notification-list .notification-user-avatar img {
  width: 46px;
  height: 46px;
  border: 2px solid var(--zzv3-surface);
  border-radius: 15px;
  object-fit: cover;
  box-shadow: 0 0 0 1px var(--zzv3-border);
}

body.zzv3 #notification-list > .notification-list .notification-text {
  min-width: 0;
  color: var(--zzv3-text-soft);
  line-height: 1.38;
}

body.zzv3 #notification-list > .notification-list .notification-text > span:first-child {
  color: var(--zzv3-text);
  font-weight: 760;
}

body.zzv3 #notification-list > .notification-list .ajax-time {
  margin-top: 3px;
  color: var(--zzv3-muted);
  font-size: 10px;
}

body.zzv3 #notification-list > .zzv35-notification-filtered {
  display: none !important;
}

body.zzv3 .zzv35-notification-empty {
  margin: 12px 2px 4px;
  padding: 24px 18px;
  color: var(--zzv3-muted);
  background: var(--zzv3-surface-soft);
  border: 1px dashed var(--zzv3-border-strong);
  border-radius: 14px;
  text-align: center;
  font-size: 12px;
}

/* Mobile bottom navigation is rendered once, outside the AJAX page container. */
body.zzv3 .zzv35-mobile-nav {
  display: none;
}

@media (hover: hover) and (pointer: fine) {
  body.zzv3 .zzv35-feed-tab:hover {
    color: var(--zzv3-text);
    background: var(--zzv3-surface-hover);
    transform: translateY(-1px);
  }

  body.zzv3 .zzv35-save-post:hover {
    transform: translateY(-1px);
  }
}

@media (max-width: 767px) {
  body.zzv3 .tag_sec_toolbar {
    display: none !important;
  }

  body.zzv3 .zzv35-mobile-nav {
    position: fixed;
    z-index: 1035;
    right: 8px;
    bottom: max(8px, env(safe-area-inset-bottom));
    left: 8px;
    display: grid;
    min-height: 66px;
    padding: 5px 7px;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    color: var(--zzv3-text-soft);
    background: color-mix(in srgb, var(--zzv3-surface) 92%, transparent);
    border: 1px solid var(--zzv3-border-strong);
    border-radius: 22px;
    box-shadow: 0 14px 40px rgba(15, 16, 19, 0.18);
    backdrop-filter: saturate(150%) blur(20px);
    -webkit-backdrop-filter: saturate(150%) blur(20px);
  }

  body.zzv3 .zzv35-mobile-nav-item {
    position: relative;
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 1px;
    color: var(--zzv3-muted);
    border-radius: 15px;
    font-size: 9px;
    font-weight: 700;
    text-decoration: none;
  }

  body.zzv3 .zzv35-mobile-nav-item.active {
    color: var(--zzv3-accent-strong);
    background: var(--zzv3-accent-soft);
  }

  body.zzv3 .zzv35-mobile-nav-icon {
    position: relative;
    display: inline-flex;
    width: 34px;
    height: 34px;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
  }

  body.zzv3 .zzv35-mobile-nav-icon svg {
    width: 21px;
    height: 21px;
  }

  body.zzv3 .zzv35-mobile-nav-create {
    color: var(--zzv3-accent-strong);
  }

  body.zzv3 .zzv35-mobile-nav-create .zzv35-mobile-nav-icon {
    width: 46px;
    height: 46px;
    margin-top: -18px;
    color: #fff;
    background: linear-gradient(145deg, var(--zzv3-accent) 0%, var(--zzv3-blue) 100%);
    border: 4px solid var(--zzv3-surface);
    border-radius: 16px;
    box-shadow: 0 8px 20px rgba(111, 66, 215, 0.28);
  }

  body.zzv3 .zzv35-mobile-nav-avatar img {
    width: 28px;
    height: 28px;
    border: 2px solid var(--zzv3-surface);
    border-radius: 10px;
    object-fit: cover;
    box-shadow: 0 0 0 1px var(--zzv3-border-strong);
  }

  body.zzv3 .zzv35-mobile-nav-item.active .zzv35-mobile-nav-avatar img {
    box-shadow: 0 0 0 2px var(--zzv3-accent);
  }

  body.zzv3 .zzv35-mobile-nav-badge {
    position: absolute;
    top: 0;
    right: 0;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    color: #fff;
    background: var(--zzv3-coral);
    border: 2px solid var(--zzv3-surface);
    border-radius: 999px;
    font-size: 8px;
    line-height: 12px;
  }

  body.zzv3 .tag_content:not(.tag_content_n_margin) {
    padding-bottom: calc(88px + env(safe-area-inset-bottom)) !important;
  }

  body.zzv3.modal-open .zzv35-mobile-nav {
    opacity: 0;
    pointer-events: none;
    transform: translateY(115%);
  }

  body.zzv3.zzv3-home-surface .zzv35-feed-tabs {
    min-height: 0;
    margin: 12px 0 8px;
    padding: 8px;
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
    border-radius: 17px;
  }

  body.zzv3 .zzv35-feed-tabs-heading {
    display: none;
  }

  body.zzv3 .zzv35-feed-tabs-options {
    width: 100%;
    grid-template-columns: repeat(4, minmax(66px, 1fr));
    overflow-x: auto;
  }

  body.zzv3 .zzv35-feed-tab {
    height: 40px;
    gap: 5px;
    padding: 0 7px;
    font-size: 11px;
  }

  body.zzv3 .tag_pub_box_bg .tag_pub_box_bg_text > small {
    display: none;
  }

  body.zzv3 .tag_main_pub_box .modal-dialog {
    width: auto;
    max-width: none;
    margin: 8px;
  }

  body.zzv3 .tag_main_pub_box .modal-content {
    max-height: calc(100vh - 16px);
    border-radius: 20px !important;
  }

  body.zzv3 .tag_main_pub_box #post-textarea {
    min-height: 130px;
    padding: 16px 16px 6px;
  }

  body.zzv3 .tag_main_pub_box #post-textarea .postText {
    min-height: 100px;
    font-size: 17px;
  }

  body.zzv3 .zzv35-composer-draft {
    padding-right: 16px;
    padding-left: 16px;
  }

  body.zzv3 .notification-container > .zzv35-notification-menu {
    position: fixed !important;
    top: 64px !important;
    right: 8px !important;
    bottom: calc(82px + env(safe-area-inset-bottom)) !important;
    left: 8px !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    max-height: none !important;
    border-radius: 20px !important;
  }

  body.zzv3 .zzv35-notification-tools {
    align-items: stretch;
    flex-direction: column;
  }

  body.zzv3 .zzv35-notification-read {
    position: absolute;
    top: 8px;
    right: 3px;
  }

  body.zzv3 .zzv35-notification-filters {
    padding-right: 64px;
  }
}

/* V3.5: keep the fresh-post pill stable and remove it completely when cleared. */
body.zzv3 .posts-count:not(.posts-hashtag-count) {
  display: none !important;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  white-space: nowrap;
  cursor: pointer;
  animation: none !important;
  transform: translateX(-50%) !important;
  transition: color 160ms ease, background-color 160ms ease, box-shadow 160ms ease !important;
}

body.zzv3 .posts-count:not(.posts-hashtag-count):not(:empty) {
  display: inline-flex !important;
}

body.zzv3 .posts-count:not(.posts-hashtag-count):hover,
body.zzv3 .posts-count:not(.posts-hashtag-count):focus,
body.zzv3 .posts-count:not(.posts-hashtag-count):active {
  animation: none !important;
  transform: translateX(-50%) !important;
}

/* V3.6.4 Messenger quick inbox: compact, scannable and consistent with chat. */
body.zzv3 .messages-notification-container > .zzv36-message-menu {
  width: 390px !important;
  min-width: 390px !important;
  max-width: calc(100vw - 24px) !important;
  max-height: min(650px, calc(100vh - 84px)) !important;
  padding: 0 !important;
  overflow: hidden !important;
  list-style: none;
  color: var(--zzv3-text) !important;
  background: var(--zzv3-surface) !important;
  border: 1px solid var(--zzv3-border-strong) !important;
  border-radius: 22px !important;
  box-shadow: var(--zzv3-shadow-md) !important;
}

body.zzv3 .zzv36-message-menu-head {
  position: sticky;
  z-index: 5;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 62px;
  padding: 12px 14px;
  background: var(--zzv3-surface);
  border-bottom: 1px solid var(--zzv3-border);
}

body.zzv3 .zzv36-message-menu-title {
  display: block !important;
  margin: 0 !important;
  color: var(--zzv3-text) !important;
  font-size: 18px;
  font-weight: 780;
  line-height: 1.2;
}

body.zzv3 .zzv36-message-menu-open {
  display: grid;
  place-items: center;
  width: 38px;
  min-width: 38px;
  height: 38px;
  color: var(--zzv3-accent-strong) !important;
  background: var(--zzv3-accent-soft);
  border: 1px solid rgba(131, 88, 232, 0.14);
  border-radius: 12px;
  transition: background 140ms ease, transform 140ms ease, box-shadow 140ms ease;
}

body.zzv3 .zzv36-message-menu-open:hover {
  background: rgba(131, 88, 232, 0.2);
  transform: translateY(-1px);
}

body.zzv3 .zzv36-message-menu-open:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 3px var(--zzv3-accent-soft);
}

body.zzv3 .zzv36-message-menu-list {
  max-height: min(588px, calc(100vh - 146px));
  padding: 7px 8px 8px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior-y: contain;
  scrollbar-width: thin;
  scrollbar-color: var(--zzv3-border-strong) transparent;
}

body.zzv3 .zzv36-message-menu-list[aria-busy="true"] {
  opacity: 0.78;
}

body.zzv3 #messages-list > .messages-list {
  position: relative;
  min-height: 72px;
  margin: 2px 0;
  padding: 9px 10px;
  overflow: hidden;
  color: var(--zzv3-text) !important;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 15px;
  transition: background 140ms ease, border-color 140ms ease, transform 140ms ease;
}

body.zzv3 #messages-list > .messages-list::before,
body.zzv3 #messages-list > .zzv36-message-menu-all::before {
  display: none !important;
}

body.zzv3 #messages-list > .messages-list.unread {
  background: var(--zzv3-accent-soft);
  border-color: rgba(131, 88, 232, 0.14);
}

body.zzv3 #messages-list > .messages-list.unread::after {
  position: absolute;
  right: 12px;
  bottom: 15px;
  width: 8px;
  height: 8px;
  content: "";
  background: var(--zzv3-accent);
  border: 2px solid var(--zzv3-surface);
  border-radius: 999px;
  box-sizing: content-box;
}

body.zzv3 #messages-list > .messages-list:hover,
body.zzv3 #messages-list > .messages-list:focus-visible {
  background: var(--zzv3-surface-hover);
  border-color: var(--zzv3-border);
  transform: translateX(1px);
}

body.zzv3 #messages-list > .messages-list:focus-visible {
  outline: 0;
  box-shadow: inset 0 0 0 2px var(--zzv3-accent-soft);
}

body.zzv3 #messages-list > .messages-list > .valign {
  align-items: center;
  gap: 11px;
}

body.zzv3 #messages-list > .messages-list .notification-user-avatar {
  width: 50px;
  min-width: 50px;
  height: 50px;
  margin: 0;
}

body.zzv3 #messages-list > .messages-list .notification-user-avatar img {
  width: 50px !important;
  height: 50px !important;
  object-fit: cover;
  border: 2px solid var(--zzv3-surface);
  border-radius: 16px !important;
  box-shadow: 0 0 0 1px var(--zzv3-border);
}

body.zzv3 #messages-list > .messages-list .notification-text {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  flex: 1 1 auto;
  width: auto !important;
  min-width: 0;
  max-width: none !important;
  padding: 0 !important;
  column-gap: 9px;
  row-gap: 3px;
}

body.zzv3 #messages-list > .messages-list .notification-text > span {
  grid-row: 1;
  grid-column: 1;
  min-width: 0;
  overflow: hidden;
  color: var(--zzv3-text) !important;
  font-size: 14px;
  font-weight: 730;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.zzv3 #messages-list > .messages-list .ajax-time {
  grid-row: 1;
  grid-column: 2;
  align-self: center;
  margin: 0 !important;
  color: var(--zzv3-muted) !important;
  font-size: 10.5px;
  font-weight: 560;
  line-height: 1.3;
  opacity: 1 !important;
  white-space: nowrap;
}

body.zzv3 #messages-list > .messages-list .header-message {
  display: block;
  grid-row: 2;
  grid-column: 1 / -1;
  min-width: 0;
  padding: 0 18px 0 0;
  overflow: hidden;
  color: var(--zzv3-text-soft) !important;
  font-size: 12.5px;
  font-weight: 500;
  line-height: 1.4;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.zzv3 #messages-list > .messages-list .header-message svg {
  width: 14px;
  height: 14px;
  fill: currentColor !important;
  vertical-align: -2px;
}

body.zzv3 #messages-list > .zzv36-message-menu-all {
  position: sticky;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  margin: 7px 0 0;
  padding: 8px 12px;
  color: var(--zzv3-accent-strong) !important;
  background: var(--zzv3-accent-soft) !important;
  border: 1px solid rgba(131, 88, 232, 0.14);
  border-radius: 13px;
  font-size: 12.5px;
  font-weight: 720;
  box-shadow: 0 -8px 18px var(--zzv3-surface);
  transition: background 140ms ease, border-color 140ms ease;
}

body.zzv3 #messages-list > .zzv36-message-menu-all:hover,
body.zzv3 #messages-list > .zzv36-message-menu-all:focus-visible {
  background: rgba(131, 88, 232, 0.2) !important;
  border-color: rgba(131, 88, 232, 0.28);
}

body.zzv3 #messages-list > .zzv36-message-menu-all:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 3px var(--zzv3-accent-soft);
}

body.zzv3 .zzv36-message-menu-list > .skel_noti {
  padding: 9px 10px;
}

body.zzv3 .zzv36-message-menu-list > .empty_state {
  margin: 8px 2px;
  padding: 32px 18px;
  color: var(--zzv3-muted);
  background: var(--zzv3-surface-soft);
  border: 1px dashed var(--zzv3-border-strong);
  border-radius: 16px;
}

@media (max-width: 767px) {
  body.zzv3 .messages-notification-container > .zzv36-message-menu {
    position: fixed !important;
    top: 64px !important;
    right: 8px !important;
    bottom: calc(82px + env(safe-area-inset-bottom)) !important;
    left: 8px !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    max-height: none !important;
    border-radius: 20px !important;
  }

  body.zzv3 .zzv36-message-menu-list {
    max-height: calc(100% - 62px);
  }
}

/* V3.6.6 mobile shell: one navigation dock and one usable top bar. */
@media (max-width: 767px) {
  body.zzv3 {
    padding-bottom: 0 !important;
  }

  /* The translated V3.5 dock replaces the legacy JavaScript-generated dock. */
  body.zzv3 .zzv3-mobile-nav {
    display: none !important;
  }

  body.zzv3 .tag_navbar_top .tag_header {
    min-width: 0;
    gap: 6px;
    padding: 0 8px !important;
  }

  body.zzv3 .tag_navbar_top .tag_header > .tag_toggle_sidebar {
    order: 0;
    flex: 0 0 38px;
    width: 38px;
    min-width: 38px;
    height: 38px;
    margin: 0 !important;
  }

  body.zzv3 .tag_navbar_top .tag_header > .header-brand {
    order: 1;
    display: flex !important;
    flex: 0 0 38px;
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    margin: 0 !important;
  }

  body.zzv3 .tag_navbar_top .tag_header > .search-container {
    order: 2;
    flex: 1 1 auto;
    width: auto !important;
    min-width: 64px;
    max-width: none;
    margin: 0 !important;
  }

  body.zzv3 .tag_navbar_top .tag_header > .search-container > form {
    min-width: 0;
    margin: 0 !important;
  }

  body.zzv3 .tag_navbar_top .tag_header .search-input {
    min-width: 0;
    padding-inline: 38px 10px;
    font-size: 16px;
    text-overflow: ellipsis;
  }

  body.zzv3 .tag_navbar_top .tag_header > .tag_navbar_top_right {
    position: static !important;
    order: 3;
    display: flex;
    flex: 0 0 auto;
    width: auto;
    min-width: 0;
    min-height: 0 !important;
    height: auto;
    margin: 0;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }

  body.zzv3 .tag_navbar_top_right .tag_hdr_right {
    position: static !important;
    inset: auto !important;
    z-index: auto !important;
    display: flex !important;
    justify-content: flex-end !important;
    gap: 3px;
    width: auto !important;
    min-width: 0;
    height: auto;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Messages and profile already live in the bottom dock on phones. */
  body.zzv3 .tag_navbar_top_right .messages-notification-container,
  body.zzv3 .tag_navbar_top_right .tag_main_usr_ddmenu {
    display: none !important;
  }

  body.zzv3 .tag_navbar_top_right .tag_hdr_droptoggle,
  body.zzv3 .tag_hdr_right > .zz-weather-menu > .zz-weather-menu-trigger {
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    padding: 7px !important;
    color: var(--zzv3-text-soft) !important;
  }

  body.zzv3 .tag_navbar_top_right .tag_hdr_right > .dropdown {
    margin: 0 !important;
  }

  /* Keep sheets between the header and V3 dock instead of behind either. */
  body.zzv3 .tag_navbar_top_right .requests-container > .dropdown-menu,
  body.zzv3 .tag_navbar_top_right .notification-container > .dropdown-menu {
    position: fixed !important;
    top: 64px !important;
    right: 8px !important;
    bottom: calc(82px + env(safe-area-inset-bottom)) !important;
    left: 8px !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 8px 10px !important;
    border-radius: 20px !important;
    box-shadow: var(--zzv3-shadow-md) !important;
    overscroll-behavior-y: contain;
  }

  body.zzv3 .tag_hdr_right > .zz-weather-menu > .zz-weather-menu-panel,
  [dir="rtl"] body.zzv3 .tag_hdr_right > .zz-weather-menu > .zz-weather-menu-panel {
    position: fixed !important;
    top: 64px !important;
    right: 8px !important;
    bottom: auto !important;
    left: 8px !important;
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    max-height: calc(100dvh - 158px) !important;
    margin: 0 !important;
    overflow-y: auto;
    border-radius: 20px !important;
  }

  body.zzv3 .tag_navbar_top .tag_header > .search-container > .search-dropdown-container {
    position: fixed !important;
    top: 64px !important;
    right: 8px !important;
    bottom: calc(82px + env(safe-area-inset-bottom)) !important;
    left: 8px !important;
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 10px !important;
    overflow-y: auto;
    border-radius: 20px !important;
    box-shadow: var(--zzv3-shadow-md) !important;
  }

  body.zzv3 .tag_navbar_top .tag_header > .search-container.show ~ .tag_navbar_top_right {
    display: none !important;
  }
}

@media (max-width: 390px) {
  body.zzv3 .tag_navbar_top .tag_header {
    gap: 4px;
    padding-inline: 5px !important;
  }

  body.zzv3 .tag_navbar_top .tag_header > .tag_toggle_sidebar,
  body.zzv3 .tag_navbar_top_right .tag_hdr_droptoggle,
  body.zzv3 .tag_hdr_right > .zz-weather-menu > .zz-weather-menu-trigger {
    width: 36px !important;
    min-width: 36px !important;
    height: 36px !important;
  }

  body.zzv3 .tag_navbar_top .tag_header .search-input {
    padding-inline: 34px 8px;
    font-size: 16px;
  }
}

@supports not (background: color-mix(in srgb, white 50%, transparent)) {
  @media (max-width: 767px) {
    body.zzv3 .zzv35-mobile-nav {
      background: var(--zzv3-surface);
    }
  }
}

@media (prefers-reduced-motion: reduce) {
  body.zzv3 .zzv35-feed-tab,
  body.zzv3 #posts-laoded,
  body.zzv3 .zzv35-save-post,
  body.zzv3 .posts-count:not(.posts-hashtag-count),
  body.zzv3 #notification-list > .notification-list,
  body.zzv3 #messages-list > .messages-list,
  body.zzv3 .zzv36-message-menu-open,
  body.zzv3 #messages-list > .zzv36-message-menu-all,
  body.zzv3 .zzv35-mobile-nav {
    transition: none !important;
  }
}

/* Keep the V3.6.7 phone header after every legacy responsive override. */
@media (max-width: 767px) {
  body.zzv3 .tag_navbar_top .tag_header {
    gap: 6px !important;
    padding: 8px 10px !important;
  }

  body.zzv3 .tag_navbar_top .tag_header > .header-brand {
    flex-basis: 36px !important;
    width: 36px !important;
    min-width: 36px !important;
    height: 36px !important;
  }

  body.zzv3 .tag_navbar_top .tag_header > .search-container {
    flex: 1 1 112px !important;
    min-width: 72px !important;
  }

  body.zzv3 .tag_navbar_top .tag_header > .search-container > form {
    float: none !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 40px !important;
    overflow: visible !important;
  }

  body.zzv3 .tag_navbar_top .tag_header .search-input {
    height: 40px !important;
    padding: 0 11px 0 40px !important;
    font-size: 14px !important;
    border-radius: 14px !important;
  }

  body.zzv3 .tag_navbar_top_right .tag_hdr_droptoggle,
  body.zzv3 .tag_hdr_right > .zz-weather-menu > .zz-weather-menu-trigger {
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    border-radius: 14px !important;
  }

  body.zzv3 .tag_navbar_top_right .requests-container > .dropdown-menu,
  body.zzv3 .tag_navbar_top_right .notification-container > .dropdown-menu,
  body.zzv3 .tag_navbar_top .tag_header > .search-container > .search-dropdown-container,
  body.zzv3 .tag_hdr_right > .zz-weather-menu > .zz-weather-menu-panel,
  [dir="rtl"] body.zzv3 .tag_hdr_right > .zz-weather-menu > .zz-weather-menu-panel {
    top: 62px !important;
  }

  [dir="rtl"] body.zzv3 .tag_navbar_top .tag_header .search-input {
    padding: 0 40px 0 11px !important;
  }
}

@media (max-width: 359px) {
  body.zzv3 .tag_navbar_top .tag_header {
    gap: 4px !important;
    padding-inline: 6px !important;
  }

  body.zzv3 .tag_navbar_top .tag_header > .search-container {
    flex-basis: 44px !important;
    min-width: 44px !important;
  }
}

/* V3.6.8: viewport-safe mobile composer with a native sheet layout. */
@media (max-width: 767px) {
  body.zzv3.modal-open {
    width: 100%;
    max-width: 100vw;
    padding-right: 0 !important;
    overflow: hidden !important;
    overscroll-behavior: none;
  }

  body.zzv3 .tag_main_pub_box,
  body.zzv3 .tag_main_pub_box.show,
  body.zzv3 .tag_main_pub_box.in {
    position: fixed !important;
    inset: 0 !important;
    width: 100% !important;
    max-width: 100vw !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  body.zzv3 .tag_main_pub_box > .modal-dialog {
    position: relative !important;
    inset: auto !important;
    width: calc(100vw - 12px) !important;
    min-width: 0 !important;
    max-width: calc(100vw - 12px) !important;
    height: calc(100vh - 12px) !important;
    max-height: calc(100vh - 12px) !important;
    margin: 6px auto !important;
    padding: 0 !important;
    overflow: hidden !important;
    transform: none !important;
  }

  body.zzv3 .tag_main_pub_box > .modal-dialog > .tag_pub_box.modal-content {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 1px solid var(--zzv3-border-strong) !important;
    border-radius: 19px !important;
    box-sizing: border-box;
  }

  body.zzv3 .tag_pub_box.modal-content > form.publisher-box {
    display: flex !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    flex-direction: column;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior-y: contain;
    box-sizing: border-box;
  }

  body.zzv3 .tag_main_pub_box .modal-header {
    position: sticky !important;
    z-index: 24;
    top: 0;
    display: flex !important;
    width: 100%;
    min-width: 0;
    min-height: 64px !important;
    flex: 0 0 auto;
    gap: 8px;
    margin: 0 !important;
    padding: 10px 12px !important;
    background: var(--zzv3-surface) !important;
    box-sizing: border-box;
  }

  body.zzv3 .tag_main_pub_box .modal-header > div:first-child {
    display: flex;
    min-width: 0;
    flex: 1 1 auto;
    gap: 8px;
    overflow: hidden;
  }

  body.zzv3 .tag_main_pub_box .modal-header > div:first-child > .btn-default {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 40px;
    width: 40px;
    min-width: 40px;
    height: 40px;
    padding: 8px;
    background: var(--zzv3-surface-raised) !important;
    border-radius: 13px;
  }

  body.zzv3 .tag_main_pub_box .zzv35-composer-title {
    min-width: 0;
    flex: 1 1 auto;
    overflow: hidden;
  }

  body.zzv3 .tag_main_pub_box .zzv35-composer-title strong,
  body.zzv3 .tag_main_pub_box .zzv35-composer-title small {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.zzv3 .tag_main_pub_box .modal-header > div:nth-child(2) {
    display: flex;
    align-items: center;
    flex: 0 0 auto;
    gap: 5px;
  }

  body.zzv3 .tag_main_pub_box #publisher-button {
    width: auto !important;
    min-width: 76px !important;
    height: 40px !important;
    padding: 0 15px !important;
    border-radius: 13px !important;
  }

  body.zzv3 .tag_main_pub_box #post-textarea {
    display: block;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: clamp(180px, 45vh, 380px) !important;
    min-height: clamp(180px, 45dvh, 380px) !important;
    flex: 1 1 auto;
    padding: 14px 14px 6px !important;
    overflow-x: hidden !important;
    overflow-y: auto;
    box-sizing: border-box;
  }

  body.zzv3 .tag_main_pub_box .wo_pub_txtara_combo {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto;
    min-height: 100%;
    max-height: none !important;
    overflow-x: hidden !important;
    box-sizing: border-box;
  }

  body.zzv3 .tag_main_pub_box #post-textarea textarea.postText {
    display: block;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 170px !important;
    padding: 8px 4px !important;
    overflow-x: hidden !important;
    overflow-y: auto;
    white-space: pre-wrap !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
    box-sizing: border-box;
  }

  body.zzv3 .tag_main_pub_box .zzv35-composer-draft,
  body.zzv3 .tag_main_pub_box #results,
  body.zzv3 .tag_main_pub_box form.publisher-box > .tag_pub_hide,
  body.zzv3 .tag_main_pub_box .publisher-box-footer {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
  }

  body.zzv3 .tag_main_pub_box #results,
  body.zzv3 .tag_main_pub_box #results * {
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  body.zzv3 .tag_main_pub_box .zzv35-composer-draft {
    min-height: 38px;
    flex: 0 0 auto;
    padding: 4px 14px 9px;
  }

  body.zzv3 .tag_main_pub_box .zzv35-composer-draft-status {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.zzv3 .tag_main_pub_box .zzv35-composer-draft-clear {
    flex: 0 0 auto;
  }

  body.zzv3 .tag_main_pub_box .publisher-box-footer {
    position: sticky;
    z-index: 22;
    bottom: 0;
    flex: 0 0 auto;
    margin-top: auto;
    overflow: visible;
    background: var(--zzv3-surface);
    box-shadow: 0 -8px 24px rgba(15, 16, 19, 0.05);
  }

  body.zzv3 .tag_main_pub_box .publisher-box-footer .pub-footer-bottom {
    display: flex !important;
    width: 100%;
    min-width: 0;
    min-height: 52px;
    gap: 8px;
    padding: 8px 14px !important;
    box-sizing: border-box;
  }

  body.zzv3 .tag_main_pub_box .publisher-box-footer .pub-footer-bottom > div {
    min-width: 0;
  }

  body.zzv3 .tag_main_pub_box .publisher-box-footer .pub-footer-bottom > div:first-child {
    display: flex;
    align-items: center;
    flex: 1 1 auto;
    overflow: hidden;
  }

  body.zzv3 .tag_main_pub_box .publisher-box-footer .wow_pub_privacy,
  body.zzv3 .tag_main_pub_box .publisher-box-footer .wow_pub_privacy_dropdown {
    min-width: 0;
    max-width: 100%;
  }

  body.zzv3 .tag_main_pub_box .publisher-box-footer .pub-footer-bottom > div:last-child {
    display: flex;
    align-items: center;
    flex: 0 0 auto;
    gap: 3px;
  }

  body.zzv3 .tag_main_pub_box .publisher-box-footer .pub-footer-upper {
    display: flex !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 58px;
    align-items: center;
    justify-content: flex-start !important;
    flex-wrap: nowrap !important;
    gap: 6px;
    margin: 0 !important;
    padding: 8px 10px calc(8px + env(safe-area-inset-bottom)) !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    text-align: start !important;
    white-space: nowrap;
    scroll-padding-inline: 10px;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    box-sizing: border-box;
  }

  body.zzv3 .tag_main_pub_box .publisher-box-footer .pub-footer-upper::-webkit-scrollbar {
    display: none;
  }

  body.zzv3 .tag_main_pub_box .pub-footer-upper > .tag_pub_box_btns,
  body.zzv3 .tag_main_pub_box .pub-footer-upper > a.tag_pub_box_btns,
  body.zzv3 .tag_main_pub_box .pub-footer-upper > .tag_pubbox_record {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex: 0 0 42px !important;
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--zzv3-accent-strong) !important;
    background: var(--zzv3-surface-raised) !important;
    border: 1px solid transparent !important;
    border-radius: 14px !important;
    box-sizing: border-box;
  }

  body.zzv3 .tag_main_pub_box .pub-footer-upper > .tag_pubbox_record > .tag_pub_box_btns {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 14px !important;
  }

  body.zzv3 .tag_main_pub_box .pub-footer-upper .tag_pub_box_btns svg {
    width: 22px;
    height: 22px;
    margin: 0 !important;
  }

  body.zzv3 .tag_main_pub_box .publisher-box-emooji,
  body.zzv3 .tag_main_pub_box .wow_pub_privacy_menu {
    max-width: calc(100vw - 40px) !important;
  }
}

@supports (height: 100dvh) {
  @media (max-width: 767px) {
    body.zzv3 .tag_main_pub_box > .modal-dialog {
      height: calc(100dvh - 12px) !important;
      max-height: calc(100dvh - 12px) !important;
    }
  }
}

@media (max-width: 430px) {
  body.zzv3 .tag_main_pub_box .zzv35-composer-title small {
    display: none;
  }

  body.zzv3 .tag_main_pub_box .charsLeft-post {
    max-width: 34px;
    margin: 0 2px;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}