/*
 * Vibeforge visual system overrides
 * Loaded after runtime theme customization in _head.tpl.
 */

:root {
  --vf-ui-accent: var(--vf-accent, var(--link-color, #4c6fff));
  --vf-ui-accent-strong: var(--vf-accent-strong, #2f4dff);
  --vf-ui-surface: var(--vf-surface, #ffffff);
  --vf-ui-surface-alt: var(--vf-surface-alt, #f5f7fb);
  --vf-ui-border: var(--vf-border, rgba(15, 23, 42, 0.08));
  --vf-ui-border-strong: var(--vf-border-strong, rgba(15, 23, 42, 0.18));
  --vf-ui-shadow-sm: var(--vf-shadow-sm, 0 10px 24px rgba(15, 23, 42, 0.1));
  --vf-ui-shadow-md: var(--vf-shadow-md, 0 18px 40px rgba(15, 23, 42, 0.14));
  --vf-ui-radius: var(--vf-radius-lg, 18px);
  --vf-chat-sidebar-width: 82px;
  --vf-chat-sidebar-gap: 22px;
}


/* MapLibre location search and maps */
.js_geocomplete {
  position: relative;
}

.vf-geocoder-results {
  position: absolute;
  z-index: 1105;
  width: min(100%, 560px);
  max-height: 260px;
  overflow-y: auto;
  margin-top: 6px;
  padding: 6px;
  background: var(--body-bg, #fff);
  border: 1px solid rgba(107, 124, 153, 0.28);
  border-radius: 10px;
  box-shadow: 0 14px 34px rgba(15, 34, 65, 0.16);
}

.vf-geocoder-option {
  display: block;
  width: 100%;
  padding: 10px 12px;
  color: var(--body-color, #172033);
  text-align: left;
  background: transparent;
  border: 0;
  border-radius: 7px;
}

.vf-geocoder-option:hover,
.vf-geocoder-option.is-active {
  background: rgba(53, 99, 255, 0.1);
}

.vf-map {
  width: 100%;
  min-height: 280px;
  overflow: hidden;
  background: #e8eef5;
  border-radius: 0 0 12px 12px;
}

.vf-map-static iframe {
  display: block;
  width: 100%;
  min-height: 280px;
  border: 0;
}

.vf-map-unavailable {
  display: grid;
  place-items: center;
  color: #5f6f86;
  font-weight: 600;
}

body.night-mode .vf-geocoder-results {
  background: var(--card-dark-color, #152235);
  border-color: rgba(148, 163, 184, 0.3);
}

body.night-mode .vf-geocoder-option {
  color: #edf4ff;
}

/* Header utility dropdowns open without decorative movement. Keep this scoped
   away from account menus, content menus, and the left navigation rail. */
.main-wrapper .main-header .navbar-wrapper > ul > li.vf-header-create,
.main-wrapper .main-header .navbar-wrapper > ul > li.js_live-requests,
.main-wrapper .main-header .navbar-wrapper > ul > li.js_live-messages,
.main-wrapper .main-header .navbar-wrapper > ul > li.js_live-notifications,
.main-wrapper .main-header .navbar-wrapper > ul > li.vf-header-create > a,
.main-wrapper .main-header .navbar-wrapper > ul > li.js_live-requests > a,
.main-wrapper .main-header .navbar-wrapper > ul > li.js_live-messages > a,
.main-wrapper .main-header .navbar-wrapper > ul > li.js_live-notifications > a,
.main-wrapper .main-header .navbar-wrapper > ul > li.vf-header-create > .dropdown-menu,
.main-wrapper .main-header .navbar-wrapper > ul > li.js_live-requests > .dropdown-menu,
.main-wrapper .main-header .navbar-wrapper > ul > li.js_live-messages > .dropdown-menu,
.main-wrapper .main-header .navbar-wrapper > ul > li.js_live-notifications > .dropdown-menu,
.main-wrapper .main-header .navbar-wrapper > ul > li.vf-header-create > .dropdown-menu *,
.main-wrapper .main-header .navbar-wrapper > ul > li.js_live-requests > .dropdown-menu *,
.main-wrapper .main-header .navbar-wrapper > ul > li.js_live-messages > .dropdown-menu *,
.main-wrapper .main-header .navbar-wrapper > ul > li.js_live-notifications > .dropdown-menu * {
  animation: none !important;
  transition: none !important;
}

.main-wrapper .main-header .navbar-wrapper > ul > li.vf-header-create > a,
.main-wrapper .main-header .navbar-wrapper > ul > li.js_live-requests > a,
.main-wrapper .main-header .navbar-wrapper > ul > li.js_live-messages > a,
.main-wrapper .main-header .navbar-wrapper > ul > li.js_live-notifications > a,
.main-wrapper .main-header .navbar-wrapper > ul > li.vf-header-create .dropdown-item,
.main-wrapper .main-header .navbar-wrapper > ul > li.js_live-requests .dropdown-item,
.main-wrapper .main-header .navbar-wrapper > ul > li.js_live-messages .dropdown-item,
.main-wrapper .main-header .navbar-wrapper > ul > li.js_live-notifications .dropdown-item {
  transform: none !important;
}

/* Keep the header Messages card readable and independent from feed row rules. */
.main-wrapper .main-header .js_live-messages > .dropdown-widget,
.main-wrapper .main-header .js_live-messages .dropdown-widget-body,
.main-wrapper .main-header .js_live-messages .dropdown-widget-body .js_scroller {
  background: #ffffff !important;
}

.main-wrapper .main-header .js_live-messages .dropdown-widget-body .js_scroller {
  padding: 0 8px 8px !important;
}

.main-wrapper .main-header .js_live-messages .dropdown-widget-body ul,
.main-wrapper .main-header .js_live-messages .dropdown-widget-body li,
.main-wrapper .main-header .js_live-messages .dropdown-widget-body .feeds-item {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

.main-wrapper .main-header .js_live-messages .dropdown-widget-body .feeds-item + .feeds-item {
  border-top: 1px solid rgba(220, 229, 241, 0.82);
}

.main-wrapper .main-header .js_live-messages .dropdown-widget-body .feeds-item .data-container {
  display: grid !important;
  grid-template-columns: 42px minmax(0, 1fr) !important;
  align-items: center !important;
  justify-content: stretch !important;
  gap: 10px !important;
  width: 100% !important;
  min-height: 62px !important;
  margin: 0 !important;
  padding: 9px 6px !important;
  text-align: left !important;
}

.main-wrapper .main-header .js_live-messages .dropdown-widget-body .feeds-item .data-avatar {
  grid-column: 1;
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  margin: 0 !important;
}

.main-wrapper .main-header .js_live-messages .dropdown-widget-body .feeds-item .data-avatar img,
.main-wrapper .main-header .js_live-messages .dropdown-widget-body .feeds-item .data-avatar .left-avatar,
.main-wrapper .main-header .js_live-messages .dropdown-widget-body .feeds-item .data-avatar .right-avatar {
  width: 42px !important;
  height: 42px !important;
  object-fit: cover;
}

.main-wrapper .main-header .js_live-messages .dropdown-widget-body .feeds-item .data-content {
  grid-column: 2;
  min-width: 0 !important;
  margin: 0 !important;
  overflow: hidden;
}

.main-wrapper .main-header .js_live-messages .dropdown-widget-body .feeds-item .name,
.main-wrapper .main-header .js_live-messages .dropdown-widget-body .feeds-item .text,
.main-wrapper .main-header .js_live-messages .dropdown-widget-body .feeds-item .time {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.main-wrapper .main-header .js_live-messages .dropdown-widget-body .feeds-item .name {
  color: #172033 !important;
  font-size: 0.82rem;
  font-weight: 850;
  line-height: 1.25;
}

.main-wrapper .main-header .js_live-messages .dropdown-widget-body .feeds-item .text,
.main-wrapper .main-header .js_live-messages .dropdown-widget-body .feeds-item .time {
  margin-top: 2px;
  color: #718198 !important;
  font-size: 0.72rem;
  line-height: 1.25;
}

.main-wrapper .main-header .js_live-messages .sgnmrl-dropdown-requests {
  display: block !important;
  margin: 0 0 8px !important;
  padding: 0 0 8px !important;
  border-bottom: 1px solid rgba(220, 229, 241, 0.88) !important;
  background: #ffffff !important;
}

.main-wrapper .main-header .js_live-messages .sgnmrl-dr-title {
  padding: 8px 6px 6px !important;
  color: #6b7c93 !important;
  font-size: 0.72rem;
  font-weight: 850;
}

.main-wrapper .main-header .js_live-messages .sgnmrl-dr-list,
.main-wrapper .main-header .js_live-messages .sgnmrl-dr-item {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
}

.main-wrapper .main-header .js_live-messages .sgnmrl-dr-footer {
  padding: 8px 6px !important;
  border-top: 1px solid rgba(231, 237, 245, 0.92);
  font-size: 0.76rem;
  font-weight: 800;
}

body.night-mode .main-wrapper .main-header .js_live-messages > .dropdown-widget,
body.night-mode .main-wrapper .main-header .js_live-messages .dropdown-widget-body,
body.night-mode .main-wrapper .main-header .js_live-messages .dropdown-widget-body .js_scroller,
body.night-mode .main-wrapper .main-header .js_live-messages .sgnmrl-dropdown-requests {
  background: #111827 !important;
}

body.night-mode .main-wrapper .main-header .js_live-messages .dropdown-widget-body .feeds-item .name {
  color: #f1f5f9 !important;
}

body.night-mode .main-wrapper .main-header .js_live-messages .dropdown-widget-body .feeds-item .text,
body.night-mode .main-wrapper .main-header .js_live-messages .dropdown-widget-body .feeds-item .time,
body.night-mode .main-wrapper .main-header .js_live-messages .sgnmrl-dr-title {
  color: #9fb0c6 !important;
}

/* r158 launch correction: keep publisher modal below fixed nav and preserve weather scene imagery. */
html body.modal-open #modal.js_modal-publisher {
  box-sizing: border-box !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  padding-top: clamp(76px, 9vh, 104px) !important;
  padding-bottom: 28px !important;
}

html body #modal.js_modal-publisher .modal-dialog,
html body #modal.js_modal-publisher .modal-dialog.modal-lg,
html body #modal.js_modal-publisher .modal-dialog.modal-xl,
html body #modal.js_modal-publisher .modal-dialog.modal-dialog-centered {
  min-height: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

html body .main-wrapper .sidebar-meta-widget[class*="is-weather-"] {
  overflow: hidden !important;
  background-color: #10233d !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  background-blend-mode: overlay !important;
  color: #ffffff !important;
}

html body .main-wrapper .sidebar-meta-widget[class*="is-weather-"] .sidebar-weather-board {
  border-color: rgba(255, 255, 255, 0.14) !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body .main-wrapper .sidebar-meta-widget[class*="is-weather-"] .sidebar-meta-datetime,
html body .main-wrapper .sidebar-meta-widget[class*="is-weather-"] .sidebar-weather-condition,
html body .main-wrapper .sidebar-meta-widget[class*="is-weather-"] .sidebar-weather-temp,
html body .main-wrapper .sidebar-meta-widget[class*="is-weather-"] .sidebar-weather-snark,
html body .main-wrapper .sidebar-meta-widget[class*="is-weather-"] .sidebar-weather-day {
  color: rgba(255, 255, 255, 0.9) !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-sun {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.26), rgba(6, 18, 34, 0.42)), url("/content/themes/modern/images/heroes/community-ocean.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-partly-cloudy {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.32), rgba(6, 18, 34, 0.5)), url("/content/themes/modern/images/heroes/community-desert.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-cloudy {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.36), rgba(6, 18, 34, 0.56)), url("/content/themes/modern/images/heroes/community-sky.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-fog {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.34), rgba(6, 18, 34, 0.58)), url("/content/themes/modern/images/heroes/community-city.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-drizzle {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.34), rgba(6, 18, 34, 0.58)), url("/content/themes/modern/images/heroes/community-waterfall.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-rain {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.38), rgba(6, 18, 34, 0.62)), url("/content/themes/modern/images/heroes/community-garden.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-snow {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.22), rgba(6, 18, 34, 0.46)), url("/content/themes/modern/images/heroes/community-snow.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-storm {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.4), rgba(6, 18, 34, 0.64)), url("/content/themes/modern/images/heroes/community-forest.webp") !important;
}

/* r159 weather scene photos must be visible on the filled board surface too. */
html body .main-wrapper .sidebar-meta-widget[class*="is-weather-"] .sidebar-weather-board {
  overflow: hidden !important;
  min-height: 184px !important;
  padding: 16px !important;
  border-radius: 18px !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  background-blend-mode: overlay !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-sun .sidebar-weather-board {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.24), rgba(6, 18, 34, 0.46)), url("/content/themes/modern/images/heroes/community-ocean.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-partly-cloudy .sidebar-weather-board {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.3), rgba(6, 18, 34, 0.52)), url("/content/themes/modern/images/heroes/community-desert.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-cloudy .sidebar-weather-board {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.34), rgba(6, 18, 34, 0.58)), url("/content/themes/modern/images/heroes/community-sky.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-fog .sidebar-weather-board {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.32), rgba(6, 18, 34, 0.58)), url("/content/themes/modern/images/heroes/community-city.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-drizzle .sidebar-weather-board {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.34), rgba(6, 18, 34, 0.6)), url("/content/themes/modern/images/heroes/community-waterfall.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-rain .sidebar-weather-board {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.38), rgba(6, 18, 34, 0.64)), url("/content/themes/modern/images/heroes/community-garden.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-snow .sidebar-weather-board {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.22), rgba(6, 18, 34, 0.48)), url("/content/themes/modern/images/heroes/community-snow.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-storm .sidebar-weather-board {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.42), rgba(6, 18, 34, 0.68)), url("/content/themes/modern/images/heroes/community-forest.webp") !important;
}

/* r160 weather photos should read as photos, not as a blue panel. */
html body .main-wrapper .sidebar-meta-widget[class*="is-weather-"],
html body .main-wrapper .sidebar-meta-widget[class*="is-weather-"] .sidebar-weather-board {
  background-color: transparent !important;
  background-blend-mode: normal !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-sun,
html body .main-wrapper .sidebar-meta-widget.is-weather-sun .sidebar-weather-board {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.08), rgba(6, 18, 34, 0.34)), url("/content/themes/modern/images/heroes/community-ocean.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-partly-cloudy,
html body .main-wrapper .sidebar-meta-widget.is-weather-partly-cloudy .sidebar-weather-board {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.12), rgba(6, 18, 34, 0.38)), url("/content/themes/modern/images/heroes/community-desert.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-cloudy,
html body .main-wrapper .sidebar-meta-widget.is-weather-cloudy .sidebar-weather-board {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.14), rgba(6, 18, 34, 0.42)), url("/content/themes/modern/images/heroes/community-sky.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-fog,
html body .main-wrapper .sidebar-meta-widget.is-weather-fog .sidebar-weather-board {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.14), rgba(6, 18, 34, 0.42)), url("/content/themes/modern/images/heroes/community-city.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-drizzle,
html body .main-wrapper .sidebar-meta-widget.is-weather-drizzle .sidebar-weather-board {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.18), rgba(6, 18, 34, 0.46)), url("/content/themes/modern/images/heroes/community-waterfall.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-rain,
html body .main-wrapper .sidebar-meta-widget.is-weather-rain .sidebar-weather-board {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.22), rgba(6, 18, 34, 0.5)), url("/content/themes/modern/images/heroes/community-garden.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-snow,
html body .main-wrapper .sidebar-meta-widget.is-weather-snow .sidebar-weather-board {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.08), rgba(6, 18, 34, 0.34)), url("/content/themes/modern/images/heroes/community-snow.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-storm,
html body .main-wrapper .sidebar-meta-widget.is-weather-storm .sidebar-weather-board {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.26), rgba(6, 18, 34, 0.54)), url("/content/themes/modern/images/heroes/community-forest.webp") !important;
}

/* r159 weather scene photos must be visible on the filled board surface too. */
html body .main-wrapper .sidebar-meta-widget[class*="is-weather-"] .sidebar-weather-board {
  overflow: hidden !important;
  min-height: 184px !important;
  padding: 16px !important;
  border-radius: 18px !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  background-blend-mode: overlay !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-sun .sidebar-weather-board {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.24), rgba(6, 18, 34, 0.46)), url("/content/themes/modern/images/heroes/community-ocean.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-partly-cloudy .sidebar-weather-board {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.3), rgba(6, 18, 34, 0.52)), url("/content/themes/modern/images/heroes/community-desert.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-cloudy .sidebar-weather-board {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.34), rgba(6, 18, 34, 0.58)), url("/content/themes/modern/images/heroes/community-sky.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-fog .sidebar-weather-board {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.32), rgba(6, 18, 34, 0.58)), url("/content/themes/modern/images/heroes/community-city.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-drizzle .sidebar-weather-board {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.34), rgba(6, 18, 34, 0.6)), url("/content/themes/modern/images/heroes/community-waterfall.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-rain .sidebar-weather-board {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.38), rgba(6, 18, 34, 0.64)), url("/content/themes/modern/images/heroes/community-garden.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-snow .sidebar-weather-board {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.22), rgba(6, 18, 34, 0.48)), url("/content/themes/modern/images/heroes/community-snow.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-storm .sidebar-weather-board {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.42), rgba(6, 18, 34, 0.68)), url("/content/themes/modern/images/heroes/community-forest.webp") !important;
}

body.n_activated,
body.n_live {
  --vf-chat-sidebar-top: 120px;
}

body {
  --vf-chat-sidebar-top: 70px;
}

html body.modal-open #modal {
  padding-right: 0 !important;
  padding-left: 0 !important;
}

html body #modal .modal-dialog {
  width: auto !important;
  max-width: min(560px, calc(100vw - 32px)) !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

html body #modal .modal-dialog.modal-sm {
  max-width: min(430px, calc(100vw - 32px)) !important;
}

html body #modal .modal-dialog.modal-lg {
  max-width: min(860px, calc(100vw - 32px)) !important;
}

html body #modal .modal-dialog.modal-xl {
  max-width: min(1120px, calc(100vw - 32px)) !important;
}

#modal .modal-content {
  background: var(--vf-modal-surface, var(--vf-ui-surface)) !important;
  color: var(--body-color, #172033);
  border: 1px solid var(--vf-modal-border, var(--vf-ui-border));
  border-radius: 18px;
  box-shadow: 0 24px 70px rgba(15, 34, 65, 0.24);
  overflow: hidden;
}

#modal .modal-header {
  background: var(--vf-modal-header-bg, var(--vf-header-aesthetic-bg-color, var(--header-bg-color, var(--vf-ui-accent)))) !important;
  background-image: var(--vf-modal-header-bg, var(--vf-header-aesthetic-bg-image, var(--header-bg-color, var(--vf-ui-accent)))) !important;
  color: var(--vf-modal-header-text, var(--vf-header-aesthetic-text, #ffffff)) !important;
  border-bottom-color: var(--vf-modal-border, var(--vf-ui-border));
  align-items: center;
  gap: 12px;
  min-height: 0;
  padding: 18px 22px;
}

#modal .modal-header .modal-title,
#modal .modal-header .btn-close,
#modal .modal-header .nav-link,
#modal .modal-header .text-link {
  color: var(--vf-modal-header-text, var(--vf-header-aesthetic-text, #ffffff)) !important;
}

#modal .modal-header .modal-title {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
  font-size: 17px;
  font-weight: 800;
  line-height: 1.28;
  letter-spacing: 0;
}

#modal .modal-header .btn-close,
#modal .modal-header .close {
  flex: 0 0 auto;
  margin: 0 0 0 auto !important;
  opacity: 0.86;
}

#modal .modal-body,
#modal .vf-share-modal-body {
  background: var(--vf-modal-surface, var(--vf-ui-surface)) !important;
  padding: 22px;
}

#modal .modal-footer,
#modal .vf-share-modal-footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  background: var(--vf-modal-surface, var(--vf-ui-surface)) !important;
  border-top-color: var(--vf-modal-border, var(--vf-ui-border));
  padding: 14px 18px 18px;
}

#modal .modal-footer > * {
  margin: 0;
}

#modal .modal-footer .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 0 20px;
  border-radius: 999px;
  font-weight: 800;
  line-height: 1;
}

#modal .modal-footer .btn-light,
#modal .modal-footer .btn-secondary {
  background: #f3f7fd;
  border-color: #d9e4f2;
  color: #24324a;
}

#modal .vf-modal-confirm-header {
  background: var(--vf-modal-surface, var(--vf-ui-surface)) !important;
  background-image: none !important;
  color: #172033 !important;
  border-bottom: 1px solid var(--vf-modal-border, var(--vf-ui-border));
}

#modal .vf-modal-confirm-header .modal-title {
  color: #172033 !important;
}

#modal .vf-modal-confirm-body {
  padding: 0 22px;
}

#modal .vf-modal-confirm-message {
  margin: 0 0 18px;
  color: #52627b;
  font-size: 14px;
  font-weight: 650;
  line-height: 1.45;
}

#modal .vf-modal-confirm-body .form-group {
  margin-top: 0 !important;
  padding-bottom: 18px;
}

#modal .vf-modal-confirm-footer {
  border-top: 0;
  padding-top: 16px;
}

body.night-mode #modal .vf-modal-confirm-header {
  background: var(--vf-modal-surface, #172033) !important;
  color: #f7faff !important;
}

body.night-mode #modal .vf-modal-confirm-header .modal-title {
  color: #f7faff !important;
}

#modal .form-control,
#modal .form-select,
#modal textarea.form-control {
  background-color: var(--vf-ui-surface-alt, #f5f7fb);
  border-color: var(--vf-modal-border, var(--vf-ui-border));
  color: var(--body-color, #172033);
}

#modal .btn-primary {
  background: var(--vf-accent, var(--link-color, #4c6fff)) !important;
  border-color: var(--vf-accent, var(--link-color, #4c6fff)) !important;
}

.vf-posts-filter .btn,
.vf-posts-filter .countries-filter,
.vf-posts-filter .btn-group-text,
.vf-posts-filter-mobile-sheet .btn,
.vf-posts-filter-mobile-sheet .countries-filter,
.vf-posts-filter-mobile-sheet .btn-group-text {
  text-transform: capitalize !important;
}

.js_lazy-bg {
  background-color: rgba(110, 132, 154, 0.12);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}

.emoji-menu .nav-tabs {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: stretch;
  justify-content: center;
  gap: 8px;
  padding: 10px 14px !important;
}

.emoji-menu .nav-tabs > li,
.emoji-menu .nav-tabs > .nav-item {
  float: none !important;
  flex: 1 1 0;
  width: auto !important;
  margin: 0 !important;
}

.emoji-menu .nav-tabs > li > .nav-link {
  width: 100%;
  min-height: 42px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border-radius: 9px !important;
  white-space: nowrap;
}

body:not(.night-mode) {
  background-color: #edf3f7;
  background-image: none;
  background-size: auto;
  background-attachment: fixed;
}

.main-wrapper .main-header {
  border-bottom-color: var(--vf-ui-border);
}

/* The installed app uses its own navigation and Settings surfaces. */
html.app-standalone body .footer-links-shell {
  display: none !important;
}

@media (display-mode: standalone),
       (display-mode: fullscreen),
       (display-mode: minimal-ui),
       (display-mode: window-controls-overlay) {
  html body .footer-links-shell {
    display: none !important;
  }
}

.main-wrapper .main-header {
  overflow: visible !important;
  z-index: 12000 !important;
}

.main-wrapper .main-header .container,
.main-wrapper .main-header .container-fluid,
.main-wrapper .main-header .row,
.main-wrapper .main-header .header-right,
.main-wrapper .main-header .navbar-wrapper,
.main-wrapper .main-header .navbar-wrapper > ul,
.main-wrapper .main-header .navbar-wrapper > ul > li.dropdown {
  overflow: visible !important;
}

.main-wrapper .main-header .navbar-wrapper > ul > li.dropdown.show {
  z-index: 12010 !important;
}

.main-wrapper .main-header .navbar-wrapper > ul > li.dropdown.nav-widget-menu-open {
  position: relative !important;
  z-index: 2145 !important;
  overflow: visible !important;
}

.main-wrapper .main-header .navbar-wrapper > ul > li.dropdown > .dropdown-menu,
.main-wrapper .main-header .navbar-wrapper > ul > li.dropdown > .dropdown-widget,
.main-wrapper .main-header .navbar-wrapper > ul > li.dropdown > .dropdown-menu.dropdown-widget {
  z-index: 12020 !important;
}

.main-wrapper .main-header .navbar-wrapper > ul > li.dropdown.nav-widget-menu-open > .dropdown-menu,
.main-wrapper .main-header .navbar-wrapper > ul > li.dropdown.nav-widget-menu-open > .dropdown-widget,
.main-wrapper .main-header .navbar-wrapper > ul > li.dropdown.nav-widget-menu-open > .dropdown-menu.dropdown-widget {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 2146 !important;
  max-height: min(520px, calc(100dvh - 96px)) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  pointer-events: auto !important;
}

.main-wrapper .main-header .js_live-messages,
.main-wrapper .main-header .js_live-requests,
.main-wrapper .main-header .js_live-notifications {
  z-index: 12020 !important;
}

/* Groups directory refresh */
.vf-groups-shell .vf-groups-grid {
  row-gap: 18px;
}

.vf-groups-shell .vf-group-card-col {
  display: flex;
}

.vf-groups-shell .vf-group-card {
  width: 100%;
  margin: 0;
  padding: 0;
  border-radius: 18px;
  border: 1px solid rgba(148, 163, 184, 0.25);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 250, 255, 0.95));
  box-shadow: 0 14px 32px rgba(15, 23, 42, 0.12);
  text-align: left;
  overflow: hidden;
}

.vf-groups-shell .vf-group-card .img.vf-group-card-media {
  position: relative;
  top: auto;
  left: auto;
  transform: none;
  margin: 0;
  padding: 0;
  border-radius: 0;
  background: transparent;
  width: 100%;
  display: block;
  aspect-ratio: 16 / 8;
  overflow: hidden;
}

.vf-groups-shell .vf-group-card .img.vf-group-card-media a {
  display: block;
  width: 100%;
  height: 100%;
}

.vf-groups-shell .vf-group-card .img.vf-group-card-media img {
  width: 100%;
  height: 100%;
  border-radius: 0;
  object-fit: cover;
  transition: transform 0.28s ease;
}

.vf-groups-shell .vf-group-card:hover .img.vf-group-card-media img {
  transform: scale(1.04);
}

.vf-groups-shell .vf-group-card-body {
  padding: 14px 14px 15px;
}

.vf-groups-shell .vf-group-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.vf-groups-shell .vf-group-card-title {
  margin: 0;
  font-size: 1.03rem;
  line-height: 1.25;
  font-weight: 800;
  color: #0f172a !important;
  text-decoration: none !important;
}

.vf-groups-shell .vf-group-card-title:hover {
  color: var(--vf-ui-accent-strong) !important;
}

.vf-groups-shell .vf-group-card-privacy {
  flex: 0 0 auto;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #1e3a8a;
  background: rgba(59, 130, 246, 0.16);
  border: 1px solid rgba(59, 130, 246, 0.24);
}

.vf-groups-shell .vf-group-card-meta {
  margin-top: 9px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 14px;
  color: #475569;
  font-size: 0.82rem;
  font-weight: 700;
}

.vf-groups-shell .vf-group-card-meta span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.vf-groups-shell .vf-group-card-plan {
  margin-top: 10px;
}

.vf-groups-shell .vf-group-card-plan .badge {
  font-size: 0.74rem;
}

.vf-groups-shell .vf-group-card-action {
  margin-top: 12px;
}

.vf-groups-shell .vf-group-card-action .btn {
  min-width: 128px;
  border-radius: 999px;
  font-weight: 700;
  box-shadow: none;
}

.vf-groups-shell .see-more {
  border: 1px solid rgba(76, 111, 255, 0.22);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.9);
  color: #1e3a8a;
  font-weight: 700;
}

body.night-mode .vf-groups-shell .vf-group-card {
  background: linear-gradient(180deg, rgba(24, 34, 49, 0.97), rgba(18, 28, 42, 0.95));
  border-color: var(--card-dark-divider);
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.34);
}

body.night-mode .vf-groups-shell .vf-group-card-title {
  color: #f8fbff !important;
}

body.night-mode .vf-groups-shell .vf-group-card-title:hover {
  color: #9eb7ff !important;
}

body.night-mode .vf-groups-shell .vf-group-card-meta {
  color: #b7c5d8;
}

body.night-mode .vf-groups-shell .vf-group-card-privacy {
  color: #dbe9ff;
  background: rgba(76, 111, 255, 0.22);
  border-color: rgba(123, 152, 255, 0.34);
}

body.night-mode .vf-groups-shell .see-more {
  background: rgba(18, 28, 42, 0.9);
  border-color: rgba(123, 152, 255, 0.32);
  color: #dbe9ff;
}

@media (max-width: 767.98px) {
  .vf-groups-shell .vf-group-card-body {
    padding: 12px;
  }

  .vf-groups-shell .vf-group-card-title {
    font-size: 0.98rem;
  }
}

/* Messenger desktop: a stable inbox, conversation and details split without changing legacy routes. */
@media (min-width: 1024px) {
  html body.vf-page-messages .vf-messages-shell.vf-messages-pwa-shell > .row { display:grid; grid-template-columns:minmax(270px,320px) minmax(480px,1fr); gap:18px; }
  html body.vf-page-messages .vf-messages-shell .sg-offcanvas-sidebar,
  html body.vf-page-messages .vf-messages-shell .sg-offcanvas-mainbar { width:auto; max-width:none; padding:0; }
  html body.vf-page-messages .vf-messages-shell .sg-offcanvas-sidebar > .card,
  html body.vf-page-messages .vf-messages-shell .panel-messages { height:calc(100dvh - 190px); min-height:560px; overflow:hidden; }
  html body.vf-page-messages .vf-messages-shell .panel-messages { display:flex; flex-direction:column; }
  html body.vf-page-messages .vf-messages-shell .panel-messages .card-body { display:flex; flex:1; flex-direction:column; min-height:0; }
  html body.vf-page-messages .vf-messages-shell .panel-messages .chat-conversations { flex:1; min-height:0; }
  html body.vf-page-messages .vf-messages-shell .vf-messenger-compose { margin-top:auto; }
  html body .chat-widget.chat-box { max-width:min(360px,calc((100vw - 360px)/3)); }
}

.vf-messenger-message-actions { display:none; align-items:center; gap:5px; margin:5px 0; }
.conversation:hover .vf-messenger-message-actions, .conversation:focus-within .vf-messenger-message-actions { display:flex; }
.vf-messenger-message-actions button { display:grid; place-items:center; width:28px; height:28px; padding:0; border:1px solid rgba(148,163,184,.22); border-radius:8px; background:#f7faff; color:#52708d; font-size:14px; line-height:1; }
.vf-messenger-message-actions button:hover { background:#e7f2ff; color:#087af5; }
body.night-mode .vf-messenger-message-actions button { border-color:#35465d; background:#1d2b3d; color:#c8d8ea; }

/* Messenger content must never inherit hero or dark-overlay text colors. */
html body.vf-page-messages .vf-messages-shell .panel-messages,
html body.vf-page-messages .vf-messages-shell .panel-messages .card-body,
html body.vf-page-messages .vf-messages-shell .panel-messages .chat-conversations,
html body.vf-page-messages .vf-messages-shell .panel-messages .conversation:not(.right) .text,
html body.vf-page-messages .vf-messages-shell .panel-messages .chat-form-message textarea { color:#172033 !important; -webkit-text-fill-color:#172033 !important; }
html body.vf-page-messages .vf-messages-shell .panel-messages .chat-form-message textarea { background:#f5f8fc !important; caret-color:#087af5 !important; }
html body.vf-page-messages .vf-messages-shell textarea.js_post-message,
html body.vf-page-messages .vf-messages-shell textarea.js_post-message:focus {
  color:#172033 !important;
  -webkit-text-fill-color:#172033 !important;
  background:#f5f8fc !important;
  caret-color:#087af5 !important;
}
html body.vf-page-messages .vf-messages-shell textarea.js_post-message::placeholder {
  color:#718198 !important;
  -webkit-text-fill-color:#718198 !important;
  opacity:1 !important;
}
html body.vf-page-messages .vf-messages-shell .panel-messages .conversation.right .text { color:#fff !important; -webkit-text-fill-color:#fff !important; }
body.night-mode.vf-page-messages .vf-messages-shell .panel-messages,
body.night-mode.vf-page-messages .vf-messages-shell .panel-messages .card-body,
body.night-mode.vf-page-messages .vf-messages-shell .panel-messages .chat-conversations,
body.night-mode.vf-page-messages .vf-messages-shell .panel-messages .conversation:not(.right) .text,
body.night-mode.vf-page-messages .vf-messages-shell .panel-messages .chat-form-message textarea { color:#e5eef8 !important; -webkit-text-fill-color:#e5eef8 !important; }
body.night-mode.vf-page-messages .vf-messages-shell textarea.js_post-message,
body.night-mode.vf-page-messages .vf-messages-shell textarea.js_post-message:focus { color:#e5eef8 !important; -webkit-text-fill-color:#e5eef8 !important; background:#152338 !important; }
body.night-mode.vf-page-messages .vf-messages-shell textarea.js_post-message::placeholder { color:#9eb0c6 !important; -webkit-text-fill-color:#9eb0c6 !important; }

/* Floating Messenger windows use the same readable composer treatment. */
html body .chat-widget .chat-form-message textarea.js_post-message,
html body .chat-widget .chat-form-message textarea.js_post-message:focus {
  color:#172033 !important;
  -webkit-text-fill-color:#172033 !important;
  background:#ffffff !important;
  caret-color:#087af5 !important;
}
html body .chat-widget .chat-form-message textarea.js_post-message::placeholder { color:#718198 !important; -webkit-text-fill-color:#718198 !important; opacity:1 !important; }
html body .chat-widget .chat-widget-head .chat-user-card .name,
html body .chat-widget .chat-widget-head .chat-user-card .name * { color:#ffffff !important; -webkit-text-fill-color:#ffffff !important; }
body.night-mode .chat-widget .chat-form-message textarea.js_post-message,
body.night-mode .chat-widget .chat-form-message textarea.js_post-message:focus { color:#e5eef8 !important; -webkit-text-fill-color:#e5eef8 !important; background:#152338 !important; }

/* Restore the desktop contacts rail while preserving the compact mobile launcher. */
:root {
  --vf-chat-contact-dock-width: 0px;
}

/* The compact desktop contacts dock is 56px wide with a 16px page inset. */
@media (min-width: 768px) and (max-width: 1199.98px) {
  :root {
    --vf-chat-contact-dock-width: 72px;
  }
}

@media (min-width: 1200px) {
  :root {
    --vf-chat-contact-dock-width: 82px;
  }

  html body .chat-sidebar {
    position: fixed !important;
    top: var(--vf-chat-sidebar-top) !important;
    right: 12px !important;
    bottom: 12px !important;
    left: auto !important;
    display: block !important;
    width: 70px !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: calc(100vh - var(--vf-chat-sidebar-top) - 12px) !important;
    padding: 0 !important;
    border: 1px solid rgba(206, 213, 224, 0.78) !important;
    border-radius: 0 !important;
    background: #ffffff !important;
    box-shadow: -1px 0 0 rgba(15, 23, 42, 0.04), 0 8px 24px rgba(15, 23, 42, 0.08) !important;
    overflow: hidden !important;
    z-index: 1002;
  }

  html body .chat-sidebar::before {
    display: block !important;
    top: 10px !important;
    width: 26px !important;
    height: 2px !important;
    background: #20c7bc !important;
  }

  html body .chat-sidebar-shell {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: hidden !important;
  }

  html body .chat-sidebar-content {
    position: absolute !important;
    top: 28px !important;
    right: 0 !important;
    bottom: 110px !important;
    left: 0 !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: hidden !important;
  }

  html body .chat-sidebar-content .js_scroller {
    display: block !important;
    height: 100% !important;
    max-height: 100% !important;
    overflow-y: auto !important;
  }

  html body .chat-sidebar .chat-avatar-wrapper {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 100% !important;
    min-height: 54px !important;
    margin: 0 !important;
    padding: 5px 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
  }

  html body .chat-sidebar .chat-avatar {
    flex: 0 0 44px;
    width: 44px !important;
    height: 44px !important;
    margin: 0 !important;
  }

  html body .chat-sidebar .chat-contact-name,
  html body .chat-sidebar .last-seen,
  html body .chat-sidebar .pb10 {
    display: none !important;
  }

  html body .chat-sidebar .chat-sidebar-footer {
    position: absolute !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
    height: 110px !important;
    min-height: 110px !important;
    max-height: 110px !important;
    gap: 10px !important;
    padding: 10px 0 14px !important;
    border-top: 1px solid #e5e7eb !important;
    border-radius: 0 !important;
    background: #ffffff !important;
    box-shadow: 0 -10px 18px rgba(255, 255, 255, 0.96) !important;
    overflow: visible !important;
  }

  html body .chat-sidebar .chat-sidebar-footer::before {
    display: block !important;
  }

  html body .chat-sidebar .chat-sidebar-footer .btn-chat,
  html body .chat-sidebar .chat-sidebar-footer .js_chat-new.btn-chat {
    display: inline-flex !important;
    width: 40px !important;
    min-width: 40px !important;
    max-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    max-height: 40px !important;
    margin: 0 !important;
    border-radius: 999px !important;
  }

  html body .chat-sidebar .chat-sidebar-footer .js_chat-new.btn-chat::before {
    display: none !important;
  }

  html body .chat-sidebar .chat-sidebar-footer .js_chat-new.btn-chat .main-icon,
  html body .chat-sidebar .chat-sidebar-footer .js_chat-new.btn-chat svg {
    display: block !important;
  }

  html body .chat-widget.chat-box.new,
  html body .chat-widget.chat-box.fresh {
    right: calc(var(--vf-chat-contact-dock-width) + 16px) !important;
  }

  body.night-mode .chat-sidebar,
  body.night-mode .chat-sidebar .chat-sidebar-footer {
    background: #172033 !important;
    border-color: rgba(148, 163, 184, 0.18) !important;
  }
}

@media (min-width: 1600px) {
  :root {
    --vf-chat-contact-dock-width: 266px;
  }

  html body .chat-sidebar {
    width: 254px !important;
    border-radius: 14px 0 0 14px !important;
  }

  html body .chat-sidebar::before {
    content: "Chats" !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 48px !important;
    padding: 17px 16px 0 !important;
    color: #172033 !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    text-align: left !important;
    background: transparent !important;
    transform: none !important;
  }

  html body .chat-sidebar-content {
    top: 48px !important;
    bottom: 64px !important;
  }

  html body .chat-sidebar .chat-avatar-wrapper {
    justify-content: flex-start !important;
    gap: 10px;
    min-height: 58px !important;
    padding: 7px 12px !important;
  }

  html body .chat-sidebar .chat-avatar-wrapper:hover {
    background: #f2f4f7 !important;
  }

  html body .chat-sidebar .chat-contact-name {
    display: block !important;
    min-width: 0;
    overflow: hidden;
    color: #26354d;
    font-size: 13px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  html body .chat-sidebar .chat-sidebar-footer {
    flex-direction: row !important;
    justify-content: flex-end !important;
    height: 64px !important;
    min-height: 64px !important;
    max-height: 64px !important;
    gap: 8px !important;
    padding: 10px 14px !important;
  }

  body.night-mode .chat-sidebar::before,
  body.night-mode .chat-sidebar .chat-contact-name {
    color: #edf4ff !important;
  }

  body.night-mode .chat-sidebar .chat-avatar-wrapper:hover {
    background: rgba(51, 65, 85, 0.78) !important;
  }
}

/* r180 composer modal toolbar reset */
html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .js_post-editor-quill-wrap {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  min-height: 112px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .ql-toolbar.ql-snow {
  align-self: flex-start !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: calc(100% - 10px) !important;
  min-height: 32px !important;
  margin: 0 0 10px !important;
  padding: 4px 8px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: rgba(248, 250, 253, 0.96) !important;
  box-shadow: 0 0 0 1px rgba(203, 215, 232, 0.88) !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .ql-toolbar.ql-snow .ql-formats {
  margin-right: 4px !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .ql-container.ql-snow {
  width: 100% !important;
  border: 0 !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .ql-editor {
  min-height: 76px !important;
  padding: 0 !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-tools-quick {
  width: auto !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

body.night-mode #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .ql-toolbar.ql-snow {
  background: rgba(23, 35, 52, 0.96) !important;
  box-shadow: 0 0 0 1px rgba(96, 121, 155, 0.36) !important;
}

/* r181 composer modal emergency reset */
html body #modal.js_modal-publisher .modal-content,
html body #modal.js_modal-publisher .modal-body,
html body #modal.js_modal-publisher .js_modal-publisher-body {
  overflow: visible !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) {
  overflow: visible !important;
  z-index: 4 !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .colored-text-wrapper,
html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .js_post-editor-quill-wrap {
  display: block !important;
  width: 100% !important;
  min-height: 112px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .js_post-editor-quill-toolbar,
html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .ql-toolbar.ql-snow {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: calc(100vw - 260px) !important;
  min-height: 28px !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .ql-toolbar.ql-snow button {
  width: 24px !important;
  height: 24px !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .ql-container.ql-snow,
html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .ql-editor {
  width: 100% !important;
  min-height: 74px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-emojis {
  position: relative !important;
  z-index: 30 !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-emojis .emoji-menu {
  position: absolute !important;
  top: 30px !important;
  right: 0 !important;
  z-index: 2000 !important;
  width: 220px !important;
  max-height: 240px !important;
  overflow: hidden !important;
  border: 1px solid rgba(203, 215, 232, 0.9) !important;
  border-radius: 16px !important;
  background: #ffffff !important;
  box-shadow: 0 18px 46px rgba(15, 34, 65, 0.24) !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-tools-quick,
html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-footer {
  position: relative !important;
  z-index: 1 !important;
}

body.night-mode #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .js_post-editor-quill-toolbar,
body.night-mode #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .ql-toolbar.ql-snow {
  background: transparent !important;
  box-shadow: none !important;
}

body.night-mode #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-emojis .emoji-menu {
  border-color: rgba(96, 121, 155, 0.36) !important;
  background: #121c2a !important;
}

@media (max-width: 767.98px) {
  html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .js_post-editor-quill-toolbar,
  html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .ql-toolbar.ql-snow {
    max-width: calc(100vw - 128px) !important;
  }

  html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-emojis .emoji-menu {
    right: -4px !important;
    width: 204px !important;
  }
}

/* Pages directory refresh */
.vf-pages-shell .vf-pages-grid {
  row-gap: 18px;
}

.vf-pages-shell .vf-page-card-col {
  display: flex;
}

.vf-pages-shell .vf-page-card {
  width: 100%;
  margin: 0;
  padding: 0;
  border-radius: 18px;
  border: 1px solid rgba(148, 163, 184, 0.25);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 250, 255, 0.95));
  box-shadow: 0 14px 32px rgba(15, 23, 42, 0.12);
  text-align: left;
  overflow: hidden;
}

.vf-pages-shell .vf-page-card .img.vf-page-card-media {
  position: relative;
  top: auto;
  left: auto;
  transform: none;
  margin: 0;
  padding: 0;
  border-radius: 0;
  background: transparent;
  width: 100%;
  display: block;
  aspect-ratio: 16 / 8;
  overflow: hidden;
}

.vf-pages-shell .vf-page-card .img.vf-page-card-media a {
  display: block;
  width: 100%;
  height: 100%;
}

.vf-pages-shell .vf-page-card .img.vf-page-card-media img {
  width: 100%;
  height: 100%;
  border-radius: 0;
  object-fit: cover;
  transition: transform 0.28s ease;
}

.vf-pages-shell .vf-page-card:hover .img.vf-page-card-media img {
  transform: scale(1.04);
}

.vf-pages-shell .vf-page-card-body {
  padding: 14px 14px 15px;
}

.vf-pages-shell .vf-page-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.vf-pages-shell .vf-page-card-head .verified-badge {
  flex: 0 0 auto;
}

.vf-pages-shell .vf-page-card-title {
  margin: 0;
  font-size: 1.03rem;
  line-height: 1.25;
  font-weight: 800;
  color: #0f172a !important;
  text-decoration: none !important;
}

.vf-pages-shell .vf-page-card-title:hover {
  color: var(--vf-ui-accent-strong) !important;
}

.vf-pages-shell .vf-page-card-meta {
  margin-top: 9px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 14px;
  color: #475569;
  font-size: 0.82rem;
  font-weight: 700;
}

.vf-pages-shell .vf-page-card-meta span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.vf-pages-shell .vf-page-card-plan {
  margin-top: 10px;
}

.vf-pages-shell .vf-page-card-plan .badge {
  font-size: 0.74rem;
}

.vf-pages-shell .vf-page-card-action {
  margin-top: 12px;
}

.vf-pages-shell .vf-page-card-action .btn {
  min-width: 128px;
  border-radius: 999px;
  font-weight: 700;
  box-shadow: none;
}

.vf-pages-shell .see-more {
  border: 1px solid rgba(76, 111, 255, 0.22);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.9);
  color: #1e3a8a;
  font-weight: 700;
}

body.night-mode .vf-pages-shell .vf-page-card {
  background: linear-gradient(180deg, rgba(24, 34, 49, 0.97), rgba(18, 28, 42, 0.95));
  border-color: var(--card-dark-divider);
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.34);
}

body.night-mode .vf-pages-shell .vf-page-card-title {
  color: #f8fbff !important;
}

body.night-mode .vf-pages-shell .vf-page-card-title:hover {
  color: #9eb7ff !important;
}

body.night-mode .vf-pages-shell .vf-page-card-meta {
  color: #b7c5d8;
}

body.night-mode .vf-pages-shell .see-more {
  background: rgba(18, 28, 42, 0.9);
  border-color: rgba(123, 152, 255, 0.32);
  color: #dbe9ff;
}

@media (max-width: 767.98px) {
  .vf-pages-shell .vf-page-card-body {
    padding: 12px;
  }

  .vf-pages-shell .vf-page-card-title {
    font-size: 0.98rem;
  }
}

/* Header dropdown (messages / requests / notifications) */
.main-wrapper .main-header .js_live-messages .dropdown-widget-header,
.main-wrapper .main-header .js_live-requests .dropdown-widget-header,
.main-wrapper .main-header .js_live-notifications .dropdown-widget-header {
  background: linear-gradient(180deg, rgba(248, 251, 255, 0.98), rgba(241, 247, 255, 0.96)) !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.28) !important;
  border-radius: 12px 12px 0 0;
}

.main-wrapper .main-header .js_live-messages .dropdown-widget-header .title,
.main-wrapper .main-header .js_live-requests .dropdown-widget-header .title,
.main-wrapper .main-header .js_live-notifications .dropdown-widget-header .title {
  color: #0f172a !important;
}

body.night-mode .main-wrapper .main-header .js_live-messages .dropdown-widget-header,
body.night-mode .main-wrapper .main-header .js_live-requests .dropdown-widget-header,
body.night-mode .main-wrapper .main-header .js_live-notifications .dropdown-widget-header {
  background: linear-gradient(180deg, rgba(23, 33, 48, 0.96), rgba(18, 28, 42, 0.94)) !important;
  border-bottom: 1px solid rgba(96, 121, 155, 0.42) !important;
}

body.night-mode .main-wrapper .main-header .js_live-messages .dropdown-widget-header .title,
body.night-mode .main-wrapper .main-header .js_live-requests .dropdown-widget-header .title,
body.night-mode .main-wrapper .main-header .js_live-notifications .dropdown-widget-header .title {
  color: #f8fbff !important;
}

/* Sidebar polish */
.main-side-nav-card {
  overflow: hidden;
}

.main-side-nav-card .card-body.with-nav {
  padding: 14px 12px;
}

.sidebar-section-heading {
  display: flex;
  align-items: center;
  gap: 8px;
  border-radius: 12px;
  padding: 8px 10px;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: #64748b !important;
}

.sidebar-section-heading:hover,
.sidebar-section-heading:focus {
  background: rgba(76, 111, 255, 0.08);
  color: #334155 !important;
  text-decoration: none;
}

.sidebar-section-label {
  font-size: 0.72rem;
  text-transform: none;
}

.main-side-nav > li > a,
.side-nav > li > a {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 40px;
  border-radius: 12px;
}

/* Composer polish */
.composer-launcher {
  border: 1px solid var(--vf-ui-border);
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 250, 255, 0.98));
  box-shadow: var(--vf-ui-shadow-sm);
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.composer-launcher:hover {
  transform: translateY(-1px);
  border-color: var(--vf-ui-border-strong);
  box-shadow: var(--vf-ui-shadow-md);
}

.composer-launcher-avatar {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, 0.94);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.14);
}

.composer-launcher-input {
  color: #475569;
  font-weight: 600;
  letter-spacing: -0.01em;
}

body.night-mode .composer-launcher {
  background: linear-gradient(180deg, rgba(20, 29, 43, 0.95), rgba(15, 24, 36, 0.95));
  border-color: var(--card-dark-divider);
}

body.night-mode .composer-launcher-input {
  color: #b5c5d8;
}

/* Unified feed promo cards */
.vf-promo-card {
  background: linear-gradient(145deg, #1d4ed8 0%, #2563eb 46%, #0ea5e9 100%) !important;
  color: #f8fbff;
  border-radius: 18px;
  box-shadow: 0 16px 34px rgba(29, 78, 216, 0.28);
}

.vf-promo-card .card-header {
  background: transparent;
  border-bottom: 1px solid rgba(255, 255, 255, 0.18);
}

.vf-promo-card .user-box {
  display: flex;
  align-items: center;
  gap: 10px;
  border-radius: 14px;
  padding: 8px;
  background: rgba(255, 255, 255, 0.12);
  margin-bottom: 8px;
  transition: transform 0.18s ease, background-color 0.18s ease;
}

.vf-promo-card .user-box:hover {
  transform: translateY(-1px);
  background: rgba(255, 255, 255, 0.2);
}

.vf-promo-card .user-box img {
  width: 44px;
  height: 44px;
  min-width: 44px;
  border-radius: 12px;
  object-fit: cover;
  border: 1px solid rgba(255, 255, 255, 0.32);
}

.vf-promo-card .user-box .name {
  font-weight: 700;
  line-height: 1.2;
}

/* Profile polish */
.vf-profile-shell .profile-header {
  overflow: visible;
  margin-bottom: 0 !important;
  border-radius: 24px 24px 0 0;
  border: 1px solid var(--vf-ui-border);
  border-bottom: 0;
  box-shadow: var(--vf-ui-shadow-md);
}

.vf-profile-shell .post .post-image img,
.vf-profile-shell .post .photos img,
.vf-profile-shell .post img.img-fluid,
.vf-profile-shell .post-image img,
.vf-profile-shell .post-media img {
  max-width: 100%;
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

.vf-profile-shell .post .post-image,
.vf-profile-shell .post .photos,
.vf-profile-shell .post-media {
  width: 100%;
  overflow: hidden;
}

.vf-profile-shell .profile-cover-wrapper {
  height: clamp(220px, 32vw, 360px) !important;
  min-height: clamp(220px, 32vw, 360px);
  position: relative !important;
  overflow: hidden;
  border-radius: 24px 24px 0 0;
}

.vf-profile-shell .profile-cover-wrapper img {
  display: block;
}

.vf-profile-shell .profile-cover-wrapper img.js_position-cover-cropped {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: fill !important;
  object-position: center top !important;
}

.vf-profile-shell .profile-cover-wrapper img.js_position-cover-full {
  position: absolute !important;
  top: 0;
  left: 0 !important;
  width: 100% !important;
  height: auto !important;
  max-width: none !important;
  object-fit: contain !important;
  object-position: center top !important;
}

.vf-profile-shell .profile-name-wrapper {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 16px 20px 8px;
}

.vf-profile-shell .profile-name-wrapper > a:first-of-type {
  font-size: clamp(1.3rem, 1.8vw, 1.75rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  color: #0f172a;
}

html body .main-wrapper .vf-profile-shell.profile-theme-preset-page .profile-name-wrapper,
html body .main-wrapper .vf-profile-shell.profile-theme-preset-page .profile-name-wrapper > a:first-of-type,
html body .main-wrapper .vf-profile-shell.profile-theme-preset-page .profile-name-wrapper .text-muted,
html body .main-wrapper .vf-profile-shell.profile-theme-preset-page .profile-name-wrapper .badge.bg-primary,
html body .main-wrapper .vf-profile-shell.profile-theme-preset-page .profile-featured-song,
html body .main-wrapper .vf-profile-shell.profile-theme-preset-page .profile-featured-song a {
  color: #0f172a !important;
}

.vf-profile-shell .profile-name-wrapper .text-muted {
  font-size: 0.95rem;
  font-weight: 600;
}

.vf-profile-shell .profile-buttons-wrapper {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  padding: 0 20px 18px;
}

.vf-profile-shell .profile-buttons-wrapper .btn {
  box-shadow: none;
}

.vf-profile-shell .profile-header-stats {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 4;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  padding: 6px 8px;
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.24);
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.58), rgba(15, 23, 42, 0.38));
  box-shadow: 0 14px 30px rgba(2, 8, 23, 0.36);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.vf-profile-shell .profile-header-stats-grid {
  display: inline-flex;
  align-items: stretch;
}

.vf-profile-shell .profile-header-stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 62px;
  padding: 4px 8px;
  line-height: 1.05;
}

.vf-profile-shell .profile-header-stats-grid .profile-header-stat:not(:last-child) {
  border-right: 1px solid rgba(255, 255, 255, 0.22);
}

.vf-profile-shell .profile-header-stat-link {
  text-decoration: none !important;
  color: inherit !important;
  transition: background-color 0.2s ease, transform 0.2s ease;
}

.vf-profile-shell .profile-header-stat-link:hover {
  background: rgba(255, 255, 255, 0.08);
}

.vf-profile-shell .profile-header-stat-link:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.5);
  outline-offset: -2px;
}

.vf-profile-shell .profile-header-stat .stat-value {
  font-size: 0.96rem;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: #f8fbff;
}

.vf-profile-shell .profile-header-stat .stat-label {
  margin-top: 5px;
  font-size: 0.56rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: rgba(236, 246, 255, 0.9);
}

.vf-profile-shell .profile-header-stats-window {
  display: none;
}

.vf-anchor-offset {
  display: block;
  position: relative;
  top: -92px;
}

.vf-profile-shell .profile-tabs-wrapper a {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-width: 82px;
  text-align: center !important;
  line-height: 1.1;
}

.vf-profile-shell .profile-tabs-wrapper a.active {
  text-align: center !important;
}

.vf-profile-shell .profile-tabs-wrapper a .main-icon {
  margin-right: 0 !important;
}

.vf-profile-shell .profile-tabs-wrapper a span {
  margin-left: 0 !important;
}

.vf-profile-shell .profile-tabs-wrapper {
  margin-top: 0;
  margin-bottom: 20px;
  border-radius: 0 0 24px 24px;
  border: 1px solid var(--vf-ui-border);
  border-top: 0;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: var(--vf-ui-shadow-md);
}

body.night-mode .vf-profile-shell .profile-tabs-wrapper {
  background: var(--card-dark-color);
  border-color: var(--card-dark-divider);
}

@media (min-width: 992px) {
  .vf-profile-shell .profile-tabs-wrapper {
    display: flex;
    align-items: center;
    justify-content: flex-start !important;
    gap: 0;
    overflow-x: auto;
    white-space: nowrap;
    padding: 0 10px;
  }

  .vf-profile-shell .profile-tabs-wrapper a {
    flex-direction: row;
    min-width: auto;
    gap: 6px;
    padding: 14px 11px;
    line-height: 1;
    font-size: 0.92rem;
    font-weight: 700;
  }

  .vf-profile-shell .profile-tabs-wrapper a span.d-none.d-xxl-inline-block {
    display: inline-block !important;
    margin-left: 0 !important;
  }

  .vf-profile-shell .profile-tabs-wrapper a .main-icon svg,
  .vf-profile-shell .profile-tabs-wrapper a .main-icon i {
    width: 18px !important;
    height: 18px !important;
    font-size: 18px !important;
  }
}

.profile-name-flag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  margin: 0 0.35rem;
  flex-shrink: 0;
}

.profile-name-flag.profile-name-flag-emoji {
  font-size: 1.1rem;
  line-height: 1;
}

.profile-name-flag.profile-name-flag-swatch {
  width: 1.5rem;
  height: 1rem;
  border-radius: 3px;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.35), 0 2px 10px rgba(15, 23, 42, 0.18);
  background-size: cover;
  background-repeat: no-repeat;
}

.vf-profile-shell .profile-avatar-wrapper {
  width: auto !important;
  height: auto !important;
  bottom: auto !important;
  overflow: hidden;
  border-radius: 999px;
}

.vf-profile-shell .profile-avatar-wrapper > img {
  display: block;
  width: 90px !important;
  height: 90px !important;
  min-width: 90px !important;
  min-height: 90px !important;
  max-width: none !important;
  max-height: none !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  object-position: center center !important;
}

@media (min-width: 576px) {
  .vf-profile-shell .profile-avatar-wrapper > img {
    width: 120px !important;
    height: 120px !important;
    min-width: 120px !important;
    min-height: 120px !important;
  }
}

@media (min-width: 768px) {
  .vf-profile-shell .profile-header .profile-avatar-wrapper {
    top: 170px !important;
  }

  .vf-profile-shell .profile-avatar-wrapper > img {
    width: 150px !important;
    height: 150px !important;
    min-width: 150px !important;
    min-height: 150px !important;
  }
}

@media (min-width: 992px) {
  .vf-profile-shell .profile-header {
    min-height: clamp(280px, 30vw, 360px);
  }

  .vf-profile-shell .profile-header::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 46%;
    border-radius: 0 0 24px 24px;
    background: linear-gradient(180deg, rgba(2, 6, 23, 0) 0%, rgba(2, 6, 23, 0.42) 62%, rgba(2, 6, 23, 0.6) 100%);
    pointer-events: none;
    z-index: 3;
  }

  .vf-profile-shell .profile-header .profile-avatar-wrapper:not(.static) {
    top: auto !important;
    bottom: 18px !important;
    left: 22px !important;
    transform: translateX(0) !important;
    z-index: 5;
  }

  .vf-profile-shell .profile-avatar-wrapper > img {
    width: 160px !important;
    height: 160px !important;
    min-width: 160px !important;
    min-height: 160px !important;
  }

  .vf-profile-shell .profile-name-wrapper {
    left: 212px !important;
    right: 360px !important;
    bottom: 30px !important;
    min-height: 0;
    padding: 0 !important;
    gap: 10px;
    justify-content: flex-start;
    text-align: left !important;
    z-index: 5;
  }

  .vf-profile-shell .profile-buttons-wrapper {
    left: auto !important;
    right: 20px !important;
    bottom: 26px !important;
    padding: 0 !important;
    justify-content: flex-end;
    z-index: 5;
  }

  .vf-profile-shell .profile-header-stats {
    top: auto;
    right: 34px;
    bottom: 104px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    z-index: 5;
  }

  .vf-profile-shell .profile-header-stats-grid {
    gap: 0;
  }

  .vf-profile-shell .profile-header-stat {
    min-width: 114px;
    padding: 2px 20px;
    align-items: center;
  }

  .vf-profile-shell .profile-header-stats-grid .profile-header-stat:not(:last-child) {
    border-right: 0;
  }

  .vf-profile-shell .profile-header-stats-grid .profile-header-stat + .profile-header-stat {
    border-left: 1px solid rgba(255, 255, 255, 0.28);
  }

  .vf-profile-shell .profile-header-stat .stat-value {
    font-size: 2.25rem;
    font-weight: 900;
    letter-spacing: -0.015em;
    line-height: 0.95;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.45);
  }

  .vf-profile-shell .profile-header-stat .stat-label {
    margin-top: 7px;
    font-size: 0.73rem;
    letter-spacing: 0.12em;
    color: rgba(246, 250, 255, 0.92);
    text-shadow: 0 1px 8px rgba(0, 0, 0, 0.4);
  }

  .vf-profile-shell .profile-header-stats-window {
    display: none;
  }

  .vf-profile-shell .profile-header-stat-link:hover {
    background: transparent;
    transform: translateY(-1px);
  }

  .vf-profile-shell .profile-header-stat-link:focus-visible {
    outline: 2px solid rgba(255, 255, 255, 0.45);
    outline-offset: -2px;
  }

  .vf-profile-shell .profile-name-wrapper > a:first-of-type {
    color: #f8fbff !important;
    font-size: clamp(1.9rem, 2vw, 2.3rem);
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.45);
  }

  .vf-profile-shell .profile-name-wrapper .text-muted,
  .vf-profile-shell .profile-name-wrapper .badge.bg-primary,
  .vf-profile-shell .profile-featured-song,
  .vf-profile-shell .profile-featured-song a {
    color: #f8fbff !important;
    text-shadow: 0 1px 8px rgba(0, 0, 0, 0.4);
  }

  html body .main-wrapper .vf-profile-shell.profile-theme-preset-page .profile-name-wrapper,
  html body .main-wrapper .vf-profile-shell.profile-theme-preset-page .profile-name-wrapper > a:first-of-type,
  html body .main-wrapper .vf-profile-shell.profile-theme-preset-page .profile-name-wrapper .text-muted,
  html body .main-wrapper .vf-profile-shell.profile-theme-preset-page .profile-name-wrapper .badge.bg-primary,
  html body .main-wrapper .vf-profile-shell.profile-theme-preset-page .profile-featured-song,
  html body .main-wrapper .vf-profile-shell.profile-theme-preset-page .profile-featured-song a {
    color: #f8fbff !important;
  }
}

.profile-avatar-wrapper.avatar-frame-gold img {
  border: 4px solid #d4af37;
  box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.25);
}

.profile-avatar-wrapper.avatar-frame-silver img {
  border: 4px solid #c0c0c0;
  box-shadow: 0 0 0 3px rgba(192, 192, 192, 0.3);
}

.profile-avatar-wrapper.avatar-frame-rainbow img {
  border: 4px solid transparent;
  background-image: linear-gradient(#fff, #fff), linear-gradient(135deg, #ff6b6b, #ffd93d, #6bcb77, #4d96ff, #b983ff);
  background-origin: border-box;
  background-clip: content-box, border-box;
}

.profile-avatar-wrapper.avatar-frame-neon img {
  border: 4px solid #00e5ff;
  box-shadow: 0 0 12px rgba(0, 229, 255, 0.75), 0 0 0 2px rgba(0, 229, 255, 0.2);
}

.profile-featured-song {
  margin-top: 2px;
  font-size: 0.92rem;
  color: #64748b;
}

.vf-profile-shell .profile-name-wrapper .verified-badge,
.vf-profile-shell .profile-name-wrapper .verified-badge .svg-container {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  line-height: 1;
}

.vf-profile-shell .profile-name-wrapper > a:first-of-type + .verified-badge,
.profile-name-wrapper > a:first-of-type + .verified-badge {
  margin-left: 3px !important;
  transform: translateY(-0.34em);
}

.vf-profile-shell .profile-name-wrapper > a:first-of-type + .verified-badge svg,
.profile-name-wrapper > a:first-of-type + .verified-badge svg {
  width: 32px !important;
  height: 32px !important;
}

.vf-profile-shell .profile-name-wrapper .verified-badge svg {
  width: 24px !important;
  height: 24px !important;
}

.vf-profile-shell .profile-name-wrapper > a:not(:first-of-type),
.vf-profile-shell .profile-name-wrapper .profile-name-flag,
.vf-profile-shell .profile-name-wrapper .verified-badge,
.vf-profile-shell .profile-name-wrapper .badge {
  display: inline-flex;
  align-items: center;
  vertical-align: middle;
}

.vf-profile-shell .profile-name-wrapper {
  column-gap: 4px;
}

.vf-profile-shell .profile-name-wrapper .profile-name-flag {
  margin-left: 3px !important;
  margin-right: 0 !important;
}

.vf-profile-shell .profile-name-wrapper .profile-name-flag + .profile-name-flag {
  margin-left: 2px !important;
}

.vf-profile-shell .profile-name-wrapper > a:first-of-type + .verified-badge svg,
.vf-profile-shell .profile-name-wrapper > a:first-of-type + .verified-badge .svg-container,
.profile-name-wrapper > a:first-of-type + .verified-badge svg,
.profile-name-wrapper > a:first-of-type + .verified-badge .svg-container {
  width: 32px !important;
  height: 32px !important;
}

.vf-profile-shell .profile-featured-song {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  line-height: 1.1;
}

.vf-profile-shell .profile-featured-song i {
  margin-right: 0 !important;
  line-height: 1;
}

body.night-mode .vf-profile-shell .profile-name-wrapper > a:first-of-type {
  color: #f8fafc;
}

body.night-mode .main-wrapper .vf-profile-shell.profile-theme-preset-page .profile-name-wrapper,
body.night-mode .main-wrapper .vf-profile-shell.profile-theme-preset-page .profile-name-wrapper > a:first-of-type,
body.night-mode .main-wrapper .vf-profile-shell.profile-theme-preset-page .profile-name-wrapper .text-muted,
body.night-mode .main-wrapper .vf-profile-shell.profile-theme-preset-page .profile-name-wrapper .badge.bg-primary,
body.night-mode .main-wrapper .vf-profile-shell.profile-theme-preset-page .profile-featured-song,
body.night-mode .main-wrapper .vf-profile-shell.profile-theme-preset-page .profile-featured-song a {
  color: #f8fafc !important;
}

body.night-mode .profile-featured-song {
  color: #9cb0c6;
}

/* Chat sidebar dock */
.chat-sidebar {
  right: var(--vf-chat-sidebar-gap) !important;
  top: var(--vf-chat-sidebar-top) !important;
  bottom: 16px !important;
  width: var(--vf-chat-sidebar-width) !important;
  height: auto !important;
  min-height: 0;
  max-height: calc(100vh - var(--vf-chat-sidebar-top) - 16px);
  max-width: calc(100vw - 24px);
  box-sizing: border-box;
  border: 1px solid rgba(206, 213, 224, 0.72);
  border-radius: 0;
  background: #ffffff;
  box-shadow: -1px 0 0 rgba(15, 23, 42, 0.04), 0 8px 24px rgba(15, 23, 42, 0.08);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  overflow: hidden !important;
}

.chat-sidebar::before {
  content: "";
  position: absolute;
  top: 10px;
  left: 50%;
  width: 26px;
  height: 2px;
  border-radius: 999px;
  background: #20c7bc;
  transform: translateX(-50%);
  opacity: 0.9;
}

.chat-sidebar-shell {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  border-radius: inherit;
  overflow: hidden !important;
}

.chat-sidebar-content {
  top: 28px;
  bottom: 132px;
  left: 0;
  width: 100%;
  z-index: 1;
  overflow: hidden !important;
  clip-path: inset(0 0 0 0 round 0);
}

.chat-sidebar-content .js_scroller {
  height: 100% !important;
  max-height: 100% !important;
  padding-bottom: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  scrollbar-width: none;
}

.chat-sidebar-content .js_scroller::-webkit-scrollbar {
  display: none;
  width: 0;
}

.chat-sidebar .chat-avatar-wrapper {
  width: 100%;
  min-height: 54px;
  margin: 0;
  padding: 5px 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  transition: background 0.16s ease;
}

.chat-sidebar .chat-avatar-wrapper:hover {
  background: #f2f4f7;
  box-shadow: none;
  transform: none;
}

.chat-sidebar .chat-avatar {
  width: 44px;
  height: 44px;
  margin-bottom: 0;
}

.chat-sidebar .chat-avatar img {
  border: 0;
  box-shadow: none;
}

.chat-sidebar .chat-avatar .online-status {
  right: -1px;
  bottom: 0;
  border: 2px solid #ffffff;
  font-size: 9px;
}

.chat-sidebar .chat-avatar .online-status.offline {
  color: #a8b3c3;
}

.chat-sidebar .chat-avatar-wrapper .last-seen {
  display: none;
}

.chat-sidebar .chat-avatar-wrapper .pb10 {
  display: none;
}

.chat-sidebar-footer {
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 5;
  width: 100%;
  max-width: none;
  min-height: 118px;
  padding: 10px 0 16px;
  border-top: 1px solid #e5e7eb;
  border-radius: 0;
  background: #ffffff;
  box-shadow: 0 -10px 18px rgba(255, 255, 255, 0.96);
  transform: none;
  text-align: center;
}

.chat-sidebar-footer::before {
  content: "";
  position: absolute;
  right: 0;
  bottom: 100%;
  left: 0;
  height: 28px;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0), #ffffff 86%);
}

.chat-sidebar .chat-sidebar-shell .chat-sidebar-footer {
  left: 0 !important;
  right: 0 !important;
  display: flex !important;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  background-color: #ffffff;
  background-image: none;
  border-style: none;
  overflow: hidden;
  isolation: isolate;
}

.chat-sidebar .chat-sidebar-footer .btn-chat {
  width: 40px !important;
  min-width: 40px !important;
  max-width: 40px !important;
  height: 40px !important;
  min-height: 40px !important;
  max-height: 40px !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex: 0 0 40px;
  margin-left: auto;
  margin-right: auto;
  padding: 0 !important;
  border-radius: 999px !important;
  background: #f0f2f5;
  border: 0;
  box-shadow: none;
  color: var(--vf-ui-accent);
  transition: transform 0.18s ease, background 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.chat-sidebar-footer .js_chat-new.btn-chat {
  background: #e7f0ff;
  color: #1877f2;
  box-shadow: none;
}

.chat-sidebar .chat-sidebar-footer .btn-chat.mb10 {
  margin-bottom: 0 !important;
}

.chat-sidebar-footer .btn-chat:hover {
  background: #e4e6eb;
  border-color: transparent;
  box-shadow: none;
  transform: none;
}

.chat-sidebar-footer .js_chat-new.btn-chat:hover {
  background: #dbeafe;
  border-color: transparent;
  box-shadow: none;
}

.chat-widget.chat-box.new .chat-widget-head .chat-user-card .name,
.chat-widget.chat-box.fresh .chat-widget-head .chat-user-card .name {
  color: #ffffff !important;
}

.chat-widget.chat-box.new .chat-widget-head .chat-head-btn,
.chat-widget.chat-box.new .chat-widget-head .chat-head-btn .main-icon,
.chat-widget.chat-box.fresh .chat-widget-head .chat-head-btn,
.chat-widget.chat-box.fresh .chat-widget-head .chat-head-btn .main-icon {
  color: #ffffff !important;
  fill: currentColor;
}

.chat-sidebar-footer .btn-chat:focus,
.chat-sidebar-footer .btn-chat.show,
.chat-sidebar-footer .btn-chat[aria-expanded="true"] {
  background: rgba(255, 255, 255, 0.98);
  border-color: rgba(0, 130, 255, 0.34);
  box-shadow: 0 0 0 3px rgba(0, 130, 255, 0.12), 0 12px 22px rgba(15, 23, 42, 0.12);
}

.chat-sidebar-footer .btn-chat .main-icon,
.chat-sidebar-footer .btn-chat svg {
  color: var(--vf-ui-accent);
  fill: currentColor;
  pointer-events: none;
}

.chat-sidebar-footer .js_chat-new.btn-chat .main-icon,
.chat-sidebar-footer .js_chat-new.btn-chat svg {
  color: var(--vf-ui-accent);
}

.chat-sidebar .chat-sidebar-footer .dropdown-menu.show {
  position: fixed !important;
  top: auto !important;
  right: calc(var(--vf-chat-sidebar-gap) + var(--vf-chat-sidebar-width) + 14px) !important;
  bottom: 22px !important;
  left: auto !important;
  width: 236px;
  max-width: calc(100vw - 32px);
  padding: 8px;
  transform: none !important;
  z-index: 1045;
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 20px 46px rgba(15, 23, 42, 0.16);
  backdrop-filter: blur(18px) saturate(1.14);
  -webkit-backdrop-filter: blur(18px) saturate(1.14);
}

.chat-sidebar .chat-sidebar-footer .action-dropdown-menu .dropdown-item {
  padding: 9px 10px;
  border-radius: 13px;
  color: #182235;
}

.chat-sidebar .chat-sidebar-footer .action-dropdown-menu .dropdown-item:hover,
.chat-sidebar .chat-sidebar-footer .action-dropdown-menu .dropdown-item:focus {
  background: linear-gradient(90deg, rgba(0, 130, 255, 0.08), rgba(31, 209, 162, 0.08));
}

.chat-sidebar .chat-sidebar-footer .action-dropdown-menu .action {
  gap: 9px;
  font-size: 13px;
  line-height: 1.25;
  font-weight: 750;
}

.chat-sidebar .chat-sidebar-footer .action-dropdown-menu .action-desc {
  padding-left: 29px;
  margin-top: 2px;
  color: #667085;
  font-size: 11px;
  line-height: 1.3;
}

.chat-sidebar .chat-sidebar-footer .action-dropdown-menu .main-icon,
.chat-sidebar .chat-sidebar-footer .action-dropdown-menu .fa {
  color: var(--vf-ui-accent);
  opacity: 0.9;
}

.chat-sidebar .chat-sidebar-footer .action-dropdown-menu .dropdown-divider {
  margin: 6px 4px;
  border-color: rgba(148, 163, 184, 0.16);
}

.chat-sidebar-shell .chat-sidebar-footer a.btn-chat {
  top: 0;
}

body.night-mode .chat-sidebar {
  border-color: rgba(148, 163, 184, 0.18);
  background: #172033;
  box-shadow: -1px 0 0 rgba(255, 255, 255, 0.06), 0 8px 24px rgba(0, 0, 0, 0.28);
}

body.night-mode .chat-sidebar .chat-avatar-wrapper {
  background: transparent;
}

body.night-mode .chat-sidebar .chat-avatar-wrapper:hover,
body.night-mode .chat-sidebar-footer .btn-chat {
  background: rgba(51, 65, 85, 0.78);
}

body.night-mode .chat-sidebar-footer {
  background: #172033;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

body.night-mode .chat-sidebar-footer::before {
  background: linear-gradient(180deg, rgba(23, 32, 51, 0), #172033 86%);
}

body.night-mode .chat-sidebar .chat-avatar-wrapper:hover,
body.night-mode .chat-sidebar-footer .btn-chat:hover {
  background: rgba(38, 52, 76, 0.94);
}

body.night-mode .chat-sidebar .chat-avatar-wrapper .last-seen {
  background: rgba(15, 23, 42, 0.74);
  color: #b6c4d6;
}

body.night-mode .chat-sidebar .chat-sidebar-footer .dropdown-menu.show {
  border-color: rgba(148, 163, 184, 0.18);
  background: rgba(21, 32, 48, 0.94);
  box-shadow: 0 20px 46px rgba(0, 0, 0, 0.32);
}

body.night-mode .chat-sidebar .chat-sidebar-footer .action-dropdown-menu .dropdown-item {
  color: #e5edf8;
}

body.night-mode .chat-sidebar .chat-sidebar-footer .action-dropdown-menu .dropdown-item:hover,
body.night-mode .chat-sidebar .chat-sidebar-footer .action-dropdown-menu .dropdown-item:focus {
  background: rgba(59, 130, 246, 0.13);
}

body.night-mode .chat-sidebar .chat-sidebar-footer .action-dropdown-menu .action-desc {
  color: #9fb0c8;
}

@media (min-width: 1600px) {
  .chat-sidebar {
    bottom: 0 !important;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
  }

  .chat-sidebar .chat-sidebar-shell .chat-sidebar-footer {
    bottom: 0 !important;
    min-height: 126px;
    padding-bottom: 20px;
  }
}

@media (min-width: 1200px) and (max-width: 1599.98px) {
  :root {
    --vf-chat-sidebar-width: 62px;
    --vf-chat-sidebar-gap: 18px;
  }

  .main-wrapper,
  .top-bar,
  .main-header {
    padding-right: 0 !important;
  }

  .main-wrapper > .container,
  .main-wrapper > .container-lg,
  .main-wrapper > .container-xl,
  .main-wrapper > .container-xxl,
  .main-wrapper > .container-fluid.sg-offcanvas,
  .main-wrapper .container.mt20.sg-offcanvas {
    max-width: min(1140px, calc(100vw - 72px));
    transform: none;
  }

  .main-wrapper .vf-newsfeed-shell {
    left: auto !important;
    transform: none !important;
  }

  .main-wrapper .main-header > .container,
  .main-wrapper .main-header > .container-lg,
  .main-wrapper .main-header > .container-xl,
  .main-wrapper .main-header > .container-xxl,
  .main-wrapper .main-header > .container-fluid {
    max-width: min(1140px, calc(100vw - 72px));
    transform: none;
  }

  .main-wrapper .main-header .logo img {
    max-width: min(100%, 220px) !important;
  }

  .main-wrapper .main-header .search-wrapper {
    max-width: min(460px, 38vw);
  }

  .vf-share-slideout.js-vf-share-slideout {
    left: 0 !important;
    top: calc(50% - 104px) !important;
    bottom: auto !important;
    transform: translateY(-50%) !important;
  }

  .vf-share-slideout.js-vf-share-slideout .vf-share-panel {
    top: 50% !important;
  }

  #vf-vibeguide-assistant,
  #vf-vibeguide-assistant.vf-assistant-left-tab,
  #vf-vibeguide-assistant.vf-assistant-mobile-tab {
    left: 0 !important;
    top: calc(50% + 88px) !important;
    bottom: auto !important;
    transform: translateY(-50%) !important;
    z-index: 1065 !important;
  }

  #vf-vibeguide-assistant .vf-assistant-panel,
  #vf-vibeguide-assistant.vf-assistant-left-tab .vf-assistant-panel,
  #vf-vibeguide-assistant.vf-assistant-mobile-tab .vf-assistant-panel {
    top: calc(50% + 88px) !important;
    bottom: auto !important;
    left: 56px !important;
    right: auto !important;
    transform: translateY(-50%) !important;
  }

  .chat-sidebar {
    display: block !important;
    top: auto !important;
    right: 18px !important;
    bottom: 18px !important;
    width: 62px !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: 10px 0;
    border-radius: 24px;
    overflow: visible !important;
  }

  .chat-sidebar::before,
  .chat-sidebar-content {
    display: none !important;
  }

  .chat-sidebar-shell {
    height: auto;
    overflow: visible !important;
  }

  .chat-sidebar .chat-sidebar-shell .chat-sidebar-footer,
  .chat-sidebar-footer {
    position: static !important;
    inset: auto !important;
    display: flex !important;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    width: 100% !important;
    padding: 0 !important;
    background: transparent;
    box-shadow: none;
  }

  .chat-sidebar .chat-sidebar-footer .btn-chat {
    width: 44px !important;
    min-width: 44px !important;
    max-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    flex-basis: 44px;
  }

  .chat-sidebar .chat-sidebar-footer .dropdown-menu.show {
    right: 92px !important;
    bottom: 18px !important;
  }
}

@media (max-width: 1199.98px) {
  .chat-sidebar {
    display: none !important;
  }
}

/* Universal floating chat compose launcher */
.chat-sidebar {
  top: auto !important;
  right: max(18px, env(safe-area-inset-right, 0px)) !important;
  bottom: max(22px, env(safe-area-inset-bottom, 0px)) !important;
  left: auto !important;
  display: block !important;
  width: 56px !important;
  height: 108px !important;
  min-height: 108px !important;
  max-height: 108px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
  z-index: 1002;
}

.chat-sidebar::before,
.chat-sidebar-content,
.chat-sidebar-footer::before {
  display: none !important;
}

.chat-sidebar-shell,
.chat-sidebar .chat-sidebar-shell .chat-sidebar-footer,
.chat-sidebar-footer {
  position: static !important;
  inset: auto !important;
  display: block !important;
  width: 56px !important;
  height: 108px !important;
  min-height: 108px !important;
  max-height: 108px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

.chat-sidebar .chat-sidebar-footer {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}

.chat-sidebar .chat-sidebar-footer .btn-chat {
  position: relative;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 42px !important;
  min-width: 42px !important;
  max-width: 42px !important;
  height: 42px !important;
  min-height: 42px !important;
  max-height: 42px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.94) !important;
  color: #111827 !important;
  box-shadow: 0 6px 16px rgba(15, 23, 42, 0.14), 0 1px 3px rgba(15, 23, 42, 0.08) !important;
}

.chat-sidebar .chat-sidebar-footer .js_chat-new.btn-chat {
  width: 56px !important;
  min-width: 56px !important;
  max-width: 56px !important;
  height: 56px !important;
  min-height: 56px !important;
  max-height: 56px !important;
  background: #ffffff !important;
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.18), 0 1px 3px rgba(15, 23, 42, 0.08) !important;
}

.chat-sidebar .chat-sidebar-footer .js_chat-new.btn-chat .main-icon,
.chat-sidebar .chat-sidebar-footer .js_chat-new.btn-chat svg {
  display: none !important;
}

.chat-sidebar .chat-sidebar-footer .js_chat-new.btn-chat::before {
  content: "\f044";
  font-family: "Font Awesome 6 Free", "Font Awesome 5 Free";
  font-size: 21px;
  font-weight: 900;
  line-height: 1;
}

.chat-sidebar .chat-sidebar-footer .js_chat-new.btn-chat:hover,
.chat-sidebar .chat-sidebar-footer .js_chat-new.btn-chat:focus {
  background: #f7f8fa !important;
  color: #050505 !important;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.2), 0 1px 3px rgba(15, 23, 42, 0.1) !important;
  transform: translateY(-1px);
}

.chat-widget.chat-box.new,
.chat-widget.chat-box.fresh {
  right: max(18px, env(safe-area-inset-right, 0px)) !important;
  bottom: calc(max(22px, env(safe-area-inset-bottom, 0px)) + 122px) !important;
  width: min(366px, calc(100vw - 20px)) !important;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.2);
  overflow: hidden;
}

@media (min-width: 1200px) and (max-width: 1599.98px) and (pointer: fine) {
  html body .main-wrapper .vf-newsfeed-shell {
    width: min(1140px, calc(100vw - 112px)) !important;
    max-width: min(1140px, calc(100vw - 112px)) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    transform: translateX(0) !important;
  }

  html body .chat-sidebar {
    right: max(18px, env(safe-area-inset-right, 0px)) !important;
  }

  html body .chat-widget.chat-box.new,
  html body .chat-widget.chat-box.fresh,
  html body .vf-chat-compose-panel {
    right: max(18px, env(safe-area-inset-right, 0px)) !important;
  }
}

.chat-widget.chat-box.new .chat-widget-head,
.chat-widget.chat-box.fresh .chat-widget-head {
  min-height: 54px;
  padding: 14px 18px 8px 18px;
  border-bottom: 0;
  border-radius: 0;
  background: #ffffff !important;
  color: #050505;
  cursor: default;
}

.chat-widget.chat-box.new .chat-widget-head .chat-user-card .name,
.chat-widget.chat-box.fresh .chat-widget-head .chat-user-card .name {
  color: #050505 !important;
  font-size: 1rem;
  font-weight: 650;
}

.chat-widget.chat-box.new .chat-widget-head .chat-head-btn,
.chat-widget.chat-box.new .chat-widget-head .chat-head-btn .main-icon,
.chat-widget.chat-box.fresh .chat-widget-head .chat-head-btn,
.chat-widget.chat-box.fresh .chat-widget-head .chat-head-btn .main-icon {
  color: #a100ff !important;
  fill: currentColor;
}

.chat-widget.chat-box.new .chat-widget-content,
.chat-widget.chat-box.fresh .chat-widget-content {
  display: flex !important;
  flex-direction: column;
  height: auto !important;
  min-height: 0 !important;
  max-height: min(430px, calc(100vh - 130px));
  background: #ffffff;
}

.chat-widget.chat-box.new .chat-to,
.chat-widget.chat-box.fresh .chat-to {
  position: static;
  order: 0;
  display: flex;
  align-items: center;
  min-height: 54px;
  padding: 0 18px;
  border-bottom: 1px solid #d8dce2;
  color: #333333;
  font-size: 1rem;
}

.chat-widget.chat-box.new .chat-to .to,
.chat-widget.chat-box.fresh .chat-to .to {
  position: static;
  top: auto;
  left: auto;
  flex: 0 0 auto;
  margin-right: 12px;
  font-weight: 600;
  line-height: 32px;
}

.chat-widget.chat-box.new .chat-to .tags,
.chat-widget.chat-box.fresh .chat-to .tags {
  display: flex;
  align-items: center;
  flex: 0 1 auto;
  max-width: 70%;
  margin: 0;
  padding: 0;
  line-height: 1;
}

.chat-widget.chat-box.new .chat-to .tags li,
.chat-widget.chat-box.fresh .chat-to .tags li {
  margin: 0 6px 0 0;
}

.chat-widget.chat-box.new .chat-to .typeahead,
.chat-widget.chat-box.fresh .chat-to .typeahead {
  float: none;
  flex: 1 1 auto;
  min-width: 72px;
  height: 32px;
}

.chat-widget.chat-box.new .chat-to input,
.chat-widget.chat-box.fresh .chat-to input {
  width: 100% !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  font-size: 1rem;
  line-height: 32px !important;
  height: 32px !important;
  padding: 0 !important;
}

.chat-widget.chat-box.new .chat-conversations,
.chat-widget.chat-box.fresh .chat-conversations {
  order: 1;
  flex: 0 1 auto;
  max-height: min(300px, calc(100vh - 250px));
  padding: 12px 18px 14px;
  overflow-y: auto;
}

.chat-widget.chat-box.new .vf-new-chat-picker,
.chat-widget.chat-box.fresh .vf-new-chat-picker {
  display: grid;
  gap: 8px;
}

.chat-widget.chat-box.new .vf-new-chat-contact,
.chat-widget.chat-box.fresh .vf-new-chat-contact {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 54px;
  padding: 8px 10px;
  border: 0;
  border-radius: 12px;
  background: transparent;
  color: #1f2937;
  text-align: left;
  cursor: pointer;
}

.chat-widget.chat-box.new .vf-new-chat-contact:hover,
.chat-widget.chat-box.fresh .vf-new-chat-contact:hover,
.chat-widget.chat-box.new .vf-new-chat-contact:focus,
.chat-widget.chat-box.fresh .vf-new-chat-contact:focus {
  background: #f0f2f5;
  outline: 0;
}

.chat-widget.chat-box.new .vf-new-chat-contact-avatar,
.chat-widget.chat-box.fresh .vf-new-chat-contact-avatar {
  position: relative;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
}

.chat-widget.chat-box.new .vf-new-chat-contact-avatar img,
.chat-widget.chat-box.fresh .vf-new-chat-contact-avatar img {
  display: block;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  object-fit: cover;
}

.chat-widget.chat-box.new .vf-new-chat-contact-avatar .online-status,
.chat-widget.chat-box.fresh .vf-new-chat-contact-avatar .online-status {
  position: absolute;
  right: -1px;
  bottom: 0;
  border: 2px solid #ffffff;
  font-size: 8px;
}

.chat-widget.chat-box.new .vf-new-chat-contact-name,
.chat-widget.chat-box.fresh .vf-new-chat-contact-name {
  min-width: 0;
  overflow: hidden;
  color: #374151;
  font-size: 0.92rem;
  font-weight: 650;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.chat-widget.chat-box.new .vf-new-chat-empty,
.chat-widget.chat-box.fresh .vf-new-chat-empty {
  padding: 18px 8px;
  color: #6b7280;
  font-size: 0.92rem;
  text-align: center;
}

.vf-chat-compose-panel {
  position: fixed;
  right: max(18px, env(safe-area-inset-right, 0px));
  bottom: calc(max(22px, env(safe-area-inset-bottom, 0px)) + 122px);
  display: flex;
  flex-direction: column;
  width: min(366px, calc(100vw - 20px));
  max-height: min(560px, calc(100vh - 140px));
  border: 1px solid rgba(15, 23, 42, 0.1);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 18px 42px rgba(15, 23, 42, 0.18), 0 2px 8px rgba(15, 23, 42, 0.08);
  overflow: hidden;
  z-index: 1003;
}

.vf-chat-compose-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 54px;
  padding: 14px 18px 8px;
  background: #ffffff;
}

.vf-chat-compose-title {
  color: #050505;
  font-size: 1rem;
  font-weight: 650;
  line-height: 1.25;
}

.vf-chat-compose-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  margin: -4px -8px -4px 0;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #2563ff;
  cursor: pointer;
}

.vf-chat-compose-close:hover,
.vf-chat-compose-close:focus {
  background: #f0f2f5;
  outline: 0;
}

.vf-chat-compose-close .main-icon {
  color: currentColor;
  fill: currentColor;
}

.vf-chat-compose-to {
  display: flex;
  align-items: center;
  min-height: 54px;
  padding: 0 18px;
  border-bottom: 1px solid #d8dce2;
  color: #333333;
  font-size: 1rem;
}

.vf-chat-compose-to-label {
  flex: 0 0 auto;
  margin-right: 12px;
  font-weight: 600;
  line-height: 32px;
}

.vf-chat-compose-to .tags {
  display: flex;
  align-items: center;
  flex: 0 1 auto;
  max-width: 68%;
  margin: 0;
  padding: 0;
  line-height: 1;
}

.vf-chat-compose-to .tags li {
  margin: 0 6px 0 0;
}

.vf-chat-compose-to .typeahead {
  float: none;
  flex: 1 1 auto;
  min-width: 72px;
  height: 32px;
}

.vf-chat-compose-to input {
  width: 100% !important;
  height: 32px !important;
  padding: 0 !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 1rem;
  line-height: 32px !important;
}

.vf-chat-compose-list {
  flex: 1 1 auto;
  max-height: min(390px, calc(100vh - 250px));
  padding: 12px 18px 14px;
  overflow-y: auto;
}

.vf-chat-compose-contact {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 54px;
  padding: 8px 10px;
  border: 0;
  border-radius: 12px;
  background: transparent;
  color: #1f2937;
  text-align: left;
  cursor: pointer;
}

.vf-chat-compose-contact:hover,
.vf-chat-compose-contact:focus {
  background: #f0f2f5;
  outline: 0;
}

.vf-chat-compose-contact-avatar {
  position: relative;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
}

.vf-chat-compose-contact-avatar img {
  display: block;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  object-fit: cover;
}

.vf-chat-compose-contact-avatar .online-status {
  position: absolute;
  right: -1px;
  bottom: 0;
  border: 2px solid #ffffff;
  font-size: 8px;
}

.vf-chat-compose-contact-name {
  min-width: 0;
  overflow: hidden;
  color: #374151;
  font-size: 0.92rem;
  font-weight: 650;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.vf-chat-compose-empty {
  padding: 18px 8px;
  color: #6b7280;
  font-size: 0.92rem;
  text-align: center;
}

@media (max-width: 575.98px) {
  .chat-sidebar {
    right: max(16px, env(safe-area-inset-right, 0px)) !important;
    bottom: max(18px, env(safe-area-inset-bottom, 0px)) !important;
  }

  .chat-widget.chat-box.new,
  .chat-widget.chat-box.fresh {
    right: 8px !important;
    left: 8px !important;
    bottom: calc(max(18px, env(safe-area-inset-bottom, 0px)) + 118px) !important;
    width: auto !important;
  }

  .vf-chat-compose-panel {
    right: 8px;
    left: 8px;
    bottom: calc(max(18px, env(safe-area-inset-bottom, 0px)) + 118px);
    width: auto;
    max-height: min(540px, calc(100vh - 136px));
  }
}

@media (min-width: 992px) and (max-width: 1366.98px) and (pointer: coarse) {
  .main-wrapper,
  .top-bar,
  .main-header {
    padding-right: 0 !important;
  }

  .main-wrapper .vf-newsfeed-shell {
    left: auto !important;
    max-width: calc(100vw - 32px) !important;
    transform: none !important;
  }

  .main-wrapper .vf-newsfeed-shell .vf-side-rail {
    display: none !important;
  }

  .main-wrapper .vf-newsfeed-shell .sg-offcanvas-mainbar > .row > .col-xl-9 {
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .main-wrapper .vf-newsfeed-shell .sg-offcanvas-mainbar {
    padding-right: 12px !important;
    padding-left: 12px !important;
  }

  .chat-sidebar {
    display: none !important;
  }
}

@media (min-width: 1200px) {
  .main-wrapper .vf-newsfeed-shell {
    --vf-newsfeed-right-rail-width: clamp(340px, 20vw, 360px);
  }

  .main-wrapper .vf-newsfeed-shell .vf-side-rail,
  .main-wrapper .vf-newsfeed-shell .vf-side-rail > .theiaStickySidebar {
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  .main-wrapper .vf-newsfeed-shell .vf-side-rail > .theiaStickySidebar {
    overflow-x: hidden;
  }

  .main-wrapper .vf-newsfeed-shell .vf-side-rail .card,
  .main-wrapper .vf-newsfeed-shell .vf-side-rail .sidebar-meta-widget,
  .main-wrapper .vf-newsfeed-shell .vf-side-rail .sidebar-weather-board,
  .main-wrapper .vf-newsfeed-shell .vf-side-rail .side-rail-widget-body,
  .main-wrapper .vf-newsfeed-shell .vf-side-rail .side-rail-widget-content {
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }
}

@media (min-width: 1200px) {
  .main-wrapper .vf-newsfeed-shell .sg-offcanvas-mainbar > .row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) var(--vf-newsfeed-right-rail-width);
    align-items: start;
  }

  .main-wrapper .vf-newsfeed-shell .sg-offcanvas-mainbar > .row > .col-12.col-xl-9 {
    width: auto !important;
    max-width: none !important;
    min-width: 0;
  }

  .main-wrapper .vf-newsfeed-shell .vf-side-rail {
    flex: 0 0 var(--vf-newsfeed-right-rail-width) !important;
    width: var(--vf-newsfeed-right-rail-width) !important;
    max-width: var(--vf-newsfeed-right-rail-width) !important;
    min-width: 340px !important;
  }

  .main-wrapper .vf-newsfeed-shell .vf-side-rail > .theiaStickySidebar {
    position: sticky !important;
    top: 70px !important;
    right: auto !important;
    left: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    transform: none !important;
  }

}

@media (max-width: 991.98px) {
  .vf-profile-shell .profile-header .profile-avatar-wrapper:not(.static) {
    top: 156px !important;
  }

  .vf-profile-shell .profile-name-wrapper {
    justify-content: center;
    text-align: center;
    padding-top: 52px;
    padding-bottom: 10px;
  }

  .vf-profile-shell .profile-name-wrapper > a:first-of-type {
    width: 100%;
    font-size: 1.24rem;
    line-height: 1.2;
  }

  .main-side-nav-card .card-body.with-nav {
    padding: 10px;
  }

  .vf-profile-shell .profile-name-wrapper,
  .vf-profile-shell .profile-buttons-wrapper {
    padding-left: 14px;
    padding-right: 14px;
  }

  .vf-profile-shell .profile-buttons-wrapper {
    justify-content: center;
    gap: 8px;
    padding-top: 2px;
  }

  .vf-profile-shell .profile-header-stats {
    top: 10px;
    right: 10px;
    bottom: auto;
    padding: 5px 7px;
    border-radius: 12px;
  }

  .vf-profile-shell .profile-header-stat {
    min-width: 56px;
    padding: 3px 7px;
  }

  .vf-profile-shell .profile-header-stat .stat-value {
    font-size: 0.9rem;
  }

  .vf-profile-shell .profile-header-stat .stat-label {
    font-size: 0.54rem;
    letter-spacing: 0.05em;
  }

  .vf-profile-shell .profile-header-stats-window {
    font-size: 0.48rem;
    letter-spacing: 0.08em;
  }

  .vf-anchor-offset {
    top: -74px;
  }
}

@media (max-width: 767px) {
  .profile-header .profile-name-wrapper a {
    color: #000000 !important;
  }
}

@media (min-width: 576px) and (max-width: 767.98px) {
  .vf-profile-shell .profile-header .profile-avatar-wrapper:not(.static) {
    top: 150px !important;
  }
}

@media (min-width: 768px) and (max-width: 991.98px) {
  .vf-profile-shell .profile-header .profile-avatar-wrapper:not(.static) {
    top: 162px !important;
  }

  .vf-profile-shell .profile-name-wrapper {
    padding-top: 72px;
  }
}

/* Live studio refresh */
.live-stream-wrapper.live-studio-shell {
  position: relative;
  border: 1px solid rgba(146, 171, 206, 0.28);
  border-radius: 24px;
  padding: 20px;
  background:
    radial-gradient(circle at 4% -14%, rgba(85, 150, 255, 0.2), transparent 42%),
    radial-gradient(circle at 100% 0%, rgba(35, 84, 159, 0.18), transparent 36%),
    linear-gradient(165deg, #1d2a3f 0%, #22334d 34%, #1f2e45 100%);
  box-shadow: 0 24px 52px rgba(18, 33, 54, 0.2);
  color: #dfe7f6;
}

.live-stream-wrapper.live-studio-shell::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  border: 1px solid rgba(255, 255, 255, 0.05);
  pointer-events: none;
}

body.night-mode .live-stream-wrapper.live-studio-shell {
  border-color: rgba(120, 140, 165, 0.3);
  background:
    radial-gradient(circle at 6% -12%, rgba(73, 125, 217, 0.2), transparent 44%),
    radial-gradient(circle at 100% 0%, rgba(37, 70, 128, 0.2), transparent 38%),
    linear-gradient(162deg, #172233 0%, #1a2638 40%, #162030 100%);
}

.live-stream-title {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
  color: #f5f9ff;
  font-size: 1rem;
  line-height: 1.2;
}

.live-stream-title-main {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 46px;
}

.live-stream-title-main .main-icon {
  width: 32px;
  height: 32px;
}

.live-stream-title-text {
  font-family: var(--heading-font-family);
  font-size: clamp(1.62rem, 1.2rem + 1.1vw, 2rem);
  font-weight: 700;
  letter-spacing: -0.02em;
}

.live-stream-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
  align-items: center;
}

.live-stream-actions .live-stream-option {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.live-stream-actions .live-stream-option .btn {
  border-width: 1px;
  border-color: rgba(124, 165, 227, 0.5);
  background: rgba(17, 33, 54, 0.66);
  color: #cde1ff;
  font-weight: 600;
  min-height: 40px;
  padding: 0.4rem 0.95rem;
  font-size: 0.9rem;
}

.live-stream-actions .live-stream-option .btn:hover {
  border-color: rgba(152, 190, 250, 0.65);
  background: rgba(34, 52, 78, 0.82);
  color: #e6f0ff;
}

.live-stream-actions .live-stream-option .btn-check:checked + .btn {
  border-color: rgba(107, 168, 255, 0.7);
  background: linear-gradient(135deg, rgba(20, 91, 196, 0.92), rgba(25, 120, 226, 0.92));
  color: #fff;
}

.live-stream-actions .live-stream-primary-action.btn {
  background: linear-gradient(135deg, #ef476f 0%, #e6335d 100%);
  border-color: rgba(255, 122, 158, 0.86);
  color: #fff;
  min-height: 40px;
  padding: 0.42rem 1.05rem;
  font-weight: 700;
  box-shadow: 0 10px 24px rgba(234, 72, 116, 0.32);
}

.live-stream-actions #js_live-end.live-stream-primary-action.btn {
  background: linear-gradient(135deg, #ff7b2f 0%, #ef4444 100%);
  border-color: rgba(255, 165, 117, 0.86);
  box-shadow: 0 10px 24px rgba(239, 89, 73, 0.34);
}

.live-stream-actions .live-stream-primary-action.btn:hover {
  filter: brightness(1.03);
}

.live-stream-actions .live-paid-price {
  min-width: 100px;
  max-width: 128px;
  height: 42px;
  padding: 0 14px;
  background: rgba(10, 20, 34, 0.88);
  border: 1px solid rgba(105, 163, 244, 0.58);
  color: #e8f2ff;
  font-weight: 600;
  font-size: 0.94rem;
  line-height: 42px;
  outline: none;
}

.live-stream-actions .live-paid-price::placeholder {
  color: rgba(213, 227, 250, 0.68);
}

.live-studio-settings {
  border: 1px solid rgba(146, 171, 206, 0.3);
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(245, 251, 255, 0.96), rgba(238, 247, 255, 0.93));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.45), 0 10px 24px rgba(14, 30, 52, 0.12);
}

body.night-mode .live-studio-settings {
  border-color: rgba(90, 109, 136, 0.6);
  background: linear-gradient(180deg, rgba(25, 38, 57, 0.96), rgba(21, 33, 51, 0.92));
}

.live-studio-settings .card-body {
  padding: 14px 14px 12px;
}

.live-studio-settings-grid {
  display: grid;
  grid-template-columns: minmax(220px, 330px) minmax(300px, 1fr);
  gap: 10px 20px;
  align-items: start;
}

.live-setting-label {
  margin-bottom: 7px;
  font-weight: 700;
  color: #2f4668;
}

.live-studio-settings .form-text {
  color: #607690;
}

body.night-mode .live-setting-label {
  color: #c1d4ed;
}

body.night-mode .live-studio-settings .form-text {
  color: #93a7be;
}

.live-studio-settings #js_live-privacy {
  max-width: 100%;
  height: 42px;
  border-radius: 12px;
  border-color: rgba(140, 166, 202, 0.45);
  box-shadow: none;
}

.live-stream-wrapper.live-studio-shell .js_live-cohosts.chat-to {
  position: relative;
  top: auto;
  left: auto;
  right: auto;
  margin-top: 4px;
  padding: 0 0 0 74px;
  border-bottom: 0;
  background: transparent;
}

.live-stream-wrapper.live-studio-shell .js_live-cohosts.chat-to .to {
  position: absolute;
  top: 7px;
  left: 0;
  font-weight: 700;
  color: #2f4668;
}

body.night-mode .live-stream-wrapper.live-studio-shell .js_live-cohosts.chat-to .to {
  color: #b7cbe4;
}

.live-stream-wrapper.live-studio-shell .js_live-cohosts.chat-to ul.tags li {
  margin-top: 4px;
  margin-right: 6px;
  border-radius: 999px;
  border: 1px solid rgba(117, 151, 198, 0.48);
  background: #fff;
  color: #2d4669;
  font-weight: 600;
}

body.night-mode .live-stream-wrapper.live-studio-shell .js_live-cohosts.chat-to ul.tags li {
  border-color: rgba(109, 140, 181, 0.6);
  background: rgba(30, 45, 67, 0.94);
  color: #cfddf2;
}

.live-stream-wrapper.live-studio-shell .js_live-cohosts.chat-to .typeahead {
  float: left;
  width: 100%;
  max-width: 480px;
}

.live-stream-wrapper.live-studio-shell .js_live-cohosts.chat-to .typeahead input {
  border-radius: 12px;
  border: 1px solid rgba(126, 158, 201, 0.45);
  background: rgba(255, 255, 255, 0.98);
  color: #314a6b;
  font-weight: 600;
  line-height: 34px;
  padding: 0 12px;
}

body.night-mode .live-stream-wrapper.live-studio-shell .js_live-cohosts.chat-to .typeahead input {
  border-color: rgba(95, 122, 158, 0.62);
  background: rgba(22, 33, 50, 0.96);
  color: #d6e6ff;
}

.live-stream-wrapper.live-studio-shell .live-stream-video.live-stream-stage {
  height: clamp(250px, 52vw, 620px);
  min-height: 260px;
  border: 1px solid rgba(110, 141, 187, 0.38);
  border-radius: 20px;
  background: #02050d;
  box-shadow: inset 0 0 0 1px rgba(243, 248, 255, 0.05), 0 14px 34px rgba(7, 16, 30, 0.45);
}

.live-stream-wrapper.live-studio-shell .live-stream-video.live-stream-stage::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  z-index: 1;
  background:
    linear-gradient(180deg, rgba(0, 6, 16, 0.32) 0%, rgba(0, 6, 16, 0.08) 22%, rgba(0, 6, 16, 0.22) 100%);
}

.live-stream-wrapper.live-studio-shell .live-stream-video .live-counter {
  top: 14px;
  left: 14px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  z-index: 4;
}

.live-stream-wrapper.live-studio-shell .live-stream-video .live-counter .status,
.live-stream-wrapper.live-studio-shell .live-stream-video .live-counter .number {
  border-radius: 999px;
  backdrop-filter: blur(8px);
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(12, 20, 33, 0.76);
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  font-weight: 700;
}

.live-stream-wrapper.live-studio-shell .live-stream-video .live-counter .status {
  background: linear-gradient(135deg, #f03d5d, #f45d7a);
  border-color: rgba(255, 168, 190, 0.5);
}

.live-stream-wrapper.live-studio-shell .live-stream-video .live-counter .status.offline {
  background: rgba(15, 24, 38, 0.84);
  border-color: rgba(180, 193, 212, 0.32);
}

.live-stream-wrapper.live-studio-shell .live-stream-video .live-counter .number {
  margin-left: 0;
  padding: 5px 12px;
  color: #eff5ff;
}

.live-stream-wrapper.live-studio-shell .live-stream-video .live-recording {
  top: 14px;
  right: 14px;
  border-radius: 999px;
  padding: 6px 12px;
  color: #ffd5d5;
  background: rgba(20, 8, 14, 0.76);
  border: 1px solid rgba(235, 92, 103, 0.38);
  z-index: 4;
}

.live-stream-wrapper.live-studio-shell .live-stream-video .live-status {
  bottom: 18px;
  border-radius: 999px;
  background: rgba(8, 17, 30, 0.82);
  border: 1px solid rgba(131, 159, 199, 0.4);
  color: #e6effc;
  max-width: calc(100% - 24px);
  box-shadow: 0 8px 26px rgba(7, 15, 29, 0.45);
  z-index: 4;
}

.live-stream-wrapper.live-studio-shell .live-stream-video .live-status.info {
  background: linear-gradient(135deg, rgba(25, 97, 208, 0.94), rgba(34, 127, 231, 0.94));
  border-color: rgba(130, 181, 255, 0.62);
}

.live-stream-wrapper.live-studio-shell .live-stream-video .live-status.success {
  background: linear-gradient(135deg, rgba(32, 140, 85, 0.95), rgba(41, 174, 105, 0.95));
  border-color: rgba(129, 223, 175, 0.55);
}

.live-stream-wrapper.live-studio-shell .live-stream-video .live-status.error {
  background: linear-gradient(135deg, rgba(208, 61, 74, 0.95), rgba(229, 89, 102, 0.95));
  border-color: rgba(247, 158, 166, 0.6);
}

.live-stream-wrapper.live-studio-shell .live-stream-video .live-comments {
  height: min(230px, 44%);
  padding: 14px;
  background-image: linear-gradient(180deg, rgba(0, 0, 0, 0) 8%, rgba(5, 10, 19, 0.84) 62%, rgba(5, 10, 19, 0.96) 100%);
}

.live-stream-buttons.live-control-toolbar {
  margin-top: 16px;
  text-align: center;
  width: fit-content;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding: 10px 12px;
  border-radius: 20px;
  background: rgba(235, 244, 255, 0.18);
  border: 1px solid rgba(170, 194, 226, 0.32);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

.live-stream-buttons.live-control-toolbar[style*="display: block"],
.live-stream-buttons.live-control-toolbar[style*="display:block"] {
  display: flex !important;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
}

.live-stream-buttons.live-control-toolbar > * {
  margin-right: 0 !important;
}

.live-control-item,
.live-control-item .live-control-btn {
  margin-right: 0 !important;
}

.live-control-btn.btn {
  width: 52px;
  height: 52px;
  border-radius: 16px !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  padding: 0 !important;
  line-height: 1;
  background: rgba(241, 247, 255, 0.96);
  border: 1px solid rgba(184, 203, 230, 0.62);
  color: #214063;
  box-shadow: 0 10px 22px rgba(6, 17, 33, 0.24);
  transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

.live-control-btn.btn i {
  margin: 0 !important;
  line-height: 1;
  font-size: 1.02rem;
}

.live-control-btn.btn:hover {
  transform: translateY(-1px);
  background: #fff;
  box-shadow: 0 14px 28px rgba(8, 20, 39, 0.28);
}

.live-control-btn.btn-danger {
  background: linear-gradient(135deg, #f04969, #f66076);
  border-color: rgba(247, 162, 174, 0.68);
  color: #fff;
}

body.night-mode .live-control-btn.btn {
  background: rgba(26, 39, 58, 0.96);
  border-color: rgba(95, 119, 151, 0.52);
  color: #d9e8fb;
}

body.night-mode .live-stream-buttons.live-control-toolbar {
  background: rgba(14, 23, 38, 0.5);
  border-color: rgba(97, 122, 158, 0.32);
}

body.night-mode .live-control-btn.btn:hover {
  background: rgba(33, 49, 73, 0.98);
}

.live-stream-wrapper.live-studio-shell #camera-select-menu .dropdown-menu {
  border-radius: 14px;
  border: 1px solid rgba(182, 201, 226, 0.55);
  box-shadow: 0 16px 32px rgba(12, 24, 43, 0.2);
}

body.night-mode .live-stream-wrapper.live-studio-shell #camera-select-menu .dropdown-menu {
  border-color: rgba(87, 109, 141, 0.62);
  box-shadow: 0 18px 36px rgba(0, 0, 0, 0.45);
}

@media (min-width: 992px) {
  .live-stream-wrapper.live-studio-shell {
    padding: 24px;
  }
}

@media (max-width: 991.98px) {
  .live-stream-wrapper.live-studio-shell {
    border-radius: 20px;
    padding: 14px;
  }

  .live-stream-actions {
    justify-content: flex-start;
    width: 100%;
  }

  .live-studio-settings-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .live-stream-wrapper.live-studio-shell .live-stream-video.live-stream-stage {
    height: clamp(230px, 62vw, 480px);
  }

  .live-stream-buttons.live-control-toolbar {
    padding: 8px 10px;
    border-radius: 18px;
  }

  .live-stream-wrapper.live-studio-shell .js_live-cohosts.chat-to {
    padding-left: 0;
  }

  .live-stream-wrapper.live-studio-shell .js_live-cohosts.chat-to .to {
    position: static;
    display: block;
    margin-bottom: 6px;
  }
}

@media (max-width: 575.98px) {
  .live-stream-title {
    margin-bottom: 14px;
  }

  .live-stream-title-text {
    font-size: 1.52rem;
  }

  .live-stream-actions .live-stream-option,
  .live-stream-actions .live-stream-primary-action {
    width: 100%;
  }

  .live-stream-actions .live-stream-option .btn,
  .live-stream-actions .live-stream-primary-action.btn {
    width: 100%;
    justify-content: center;
  }

  .live-stream-actions .live-paid-price {
    width: 100%;
    max-width: 100%;
  }

  .live-stream-wrapper.live-studio-shell .live-stream-video.live-stream-stage {
    min-height: 210px;
  }

  .live-stream-wrapper.live-studio-shell .live-stream-video .live-status {
    font-size: 0.84rem;
    padding: 9px 14px;
  }

  .live-control-btn.btn {
    width: 46px;
    height: 46px;
    border-radius: 14px !important;
  }

  .live-stream-buttons.live-control-toolbar {
    width: 100%;
    justify-content: center;
  }
}

/* LiveSmart broadcast and podcast archive polish */
body.vf-page-broadcasting .page-header {
  min-height: 168px;
  margin-bottom: 24px;
  background:
    radial-gradient(circle at 16% 18%, rgba(47, 125, 255, 0.24), transparent 28%),
    radial-gradient(circle at 86% 8%, rgba(32, 201, 151, 0.2), transparent 30%),
    linear-gradient(135deg, #102033 0%, #17385c 48%, #1d5c73 100%);
  color: #f8fbff;
  box-shadow: 0 18px 42px rgba(15, 23, 42, 0.16);
}

body.vf-page-broadcasting .page-header .floating-img,
body.vf-page-broadcasting .page-header .circle-2,
body.vf-page-broadcasting .page-header .circle-3 {
  opacity: 0.16;
}

body.vf-page-broadcasting .page-header .inner h2 {
  font-size: clamp(2rem, 1.4rem + 1.7vw, 3.1rem);
  letter-spacing: 0;
}

body.vf-page-broadcasting .page-header .inner p {
  max-width: 620px;
  color: rgba(248, 251, 255, 0.82);
  font-size: 1rem;
}

.vf-broadcasting-page {
  max-width: 1240px;
}

.vf-broadcasting-page .card.vf-broadcasting-card {
  overflow: hidden;
  border: 1px solid rgba(148, 163, 184, 0.16);
  border-radius: 18px;
  background: linear-gradient(180deg, #ffffff, #f8fbff);
  box-shadow: 0 20px 48px rgba(15, 23, 42, 0.12) !important;
}

.vf-broadcasting-page .vf-broadcasting-shell {
  display: grid;
  gap: 18px;
}

.vf-broadcasting-page .vf-broadcasting-frame {
  height: clamp(520px, 52vw, 720px);
  border: 1px solid rgba(15, 23, 42, 0.12);
  border-radius: 16px;
  background:
    linear-gradient(135deg, rgba(15, 23, 42, 0.94), rgba(30, 64, 95, 0.88));
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.14);
}

.vf-broadcasting-page .vf-broadcasting-meta {
  display: grid;
  gap: 16px;
  padding: 18px;
  border: 1px solid rgba(148, 163, 184, 0.16);
  border-radius: 16px;
  background: #ffffff;
}

.vf-broadcasting-page .vf-broadcasting-meta > .mt20,
.vf-broadcasting-page .vf-broadcasting-meta > .mt15,
.vf-broadcasting-page .vf-broadcasting-meta > .row {
  margin-top: 0 !important;
}

.vf-broadcasting-page .form-label {
  margin-bottom: 6px;
  color: #24344d;
  font-size: 0.82rem;
  font-weight: 800;
}

.vf-broadcasting-page .form-control,
.vf-broadcasting-page .form-select {
  min-height: 44px;
  border-radius: 12px;
  border-color: rgba(148, 163, 184, 0.28);
  background-color: #f8fafc;
  box-shadow: none;
}

.vf-broadcasting-page textarea.form-control {
  line-height: 1.45;
}

.vf-broadcasting-page .form-control:focus,
.vf-broadcasting-page .form-select:focus {
  border-color: rgba(47, 125, 255, 0.52);
  box-shadow: 0 0 0 3px rgba(47, 125, 255, 0.11);
}

.vf-broadcasting-page .vf-broadcasting-help {
  margin-top: 2px;
  border-color: rgba(47, 125, 255, 0.14);
  border-radius: 16px;
  background: linear-gradient(180deg, #f8fbff, #eef6ff);
}

.vf-broadcasting-page .vf-broadcasting-actions {
  margin-top: 0;
  padding: 0;
}

.vf-broadcasting-page #js_live-start,
.vf-broadcasting-page .vf-broadcasting-tip .btn {
  min-height: 46px;
  border-radius: 14px !important;
  font-weight: 800;
}

.vf-broadcasting-page #js_live-start {
  border: 0;
  background: linear-gradient(135deg, #2f7dff, #20c997);
  box-shadow: 0 14px 28px rgba(47, 125, 255, 0.22);
}

.vf-podcasts-page {
  max-width: 1240px;
}

.vf-podcasts-page .card {
  border: 1px solid rgba(148, 163, 184, 0.14);
  border-radius: 16px;
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.08);
}

.vf-podcasts-page .vf-podcast-hero {
  overflow: hidden;
  background:
    radial-gradient(circle at 12% 6%, rgba(32, 201, 151, 0.24), transparent 30%),
    radial-gradient(circle at 88% 0%, rgba(47, 125, 255, 0.28), transparent 34%),
    linear-gradient(135deg, #101d33 0%, #17395d 48%, #1f6b7a 100%) !important;
  border-color: rgba(116, 177, 255, 0.28) !important;
  box-shadow: 0 22px 52px rgba(15, 23, 42, 0.18) !important;
}

.vf-podcasts-page .vf-podcast-hero .card-body {
  min-height: 154px;
  padding: 30px 32px;
}

.vf-podcasts-page .vf-podcast-hero h4 {
  color: #ffffff;
  font-size: clamp(2.1rem, 1.45rem + 1.8vw, 3.2rem);
  font-weight: 850;
  letter-spacing: 0;
}

.vf-podcasts-page .vf-podcast-hero .text-muted {
  max-width: 680px;
  color: rgba(242, 248, 255, 0.78) !important;
  font-size: 1.02rem;
}

.vf-podcasts-page .vf-podcast-hero .btn-primary {
  border: 1px solid rgba(255, 255, 255, 0.36);
  background: rgba(255, 255, 255, 0.96);
  color: #17395d;
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.18);
}

.vf-podcasts-page .vf-podcast-hero .btn-outline-secondary {
  border-color: rgba(255, 255, 255, 0.26);
  background: rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.76);
}

.vf-podcasts-page .btn {
  border-radius: 12px;
  font-weight: 800;
}

.vf-podcasts-page .vf-podcast-section-card .card-body {
  padding: 24px;
}

.vf-podcasts-page .vf-podcast-section-card h5 {
  margin-bottom: 18px !important;
  color: #1c2b45;
  font-size: 1.16rem;
  font-weight: 850;
}

.vf-podcasts-page .vf-podcast-section-card .card-body > .text-muted:only-child,
.vf-podcasts-page .vf-podcast-section-card .row:empty::before,
.vf-podcasts-page .vf-podcast-featured-shows .row:empty::before,
.vf-podcasts-page .vf-podcast-latest-episodes .row:empty::before {
  display: block;
  width: 100%;
  padding: 22px;
  border: 1px dashed rgba(148, 163, 184, 0.36);
  border-radius: 14px;
  background: #f8fafc;
  color: #64748b;
  font-weight: 700;
}

.vf-podcasts-page .vf-podcast-section-card .row:empty::before,
.vf-podcasts-page .vf-podcast-featured-shows .row:empty::before {
  content: "No shows to display yet.";
}

.vf-podcasts-page .vf-podcast-latest-episodes .row:empty::before {
  content: "No episodes have been published yet.";
}

.vf-podcasts-page .vf-podcast-empty-state {
  display: grid;
  min-height: 150px;
  place-items: center;
  gap: 7px;
  padding: 28px;
  border: 1px dashed rgba(47, 125, 255, 0.28);
  border-radius: 16px;
  background:
    radial-gradient(circle at 50% 0%, rgba(47, 125, 255, 0.1), transparent 42%),
    linear-gradient(180deg, #f8fbff, #f1f6fd);
  color: #64748b;
  text-align: center;
}

.vf-podcasts-page .vf-podcast-empty-state i {
  display: inline-grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(47, 125, 255, 0.14), rgba(32, 201, 151, 0.14));
  color: #2f7dff;
  font-size: 1.2rem;
}

.vf-podcasts-page .vf-podcast-empty-state strong {
  color: #1f2d44;
  font-size: 1rem;
}

.vf-podcasts-page .vf-podcast-empty-state span {
  max-width: 360px;
  font-size: 0.92rem;
}

.vf-podcasts-page .vf-podcast-show-card,
.vf-podcasts-page .vf-podcast-list-card,
.vf-podcasts-page .vf-podcast-episode-row {
  border-color: rgba(148, 163, 184, 0.18) !important;
  border-radius: 14px !important;
  background: #ffffff;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.vf-podcasts-page .vf-podcast-show-card:hover,
.vf-podcasts-page .vf-podcast-list-card:hover {
  border-color: rgba(47, 125, 255, 0.28) !important;
  box-shadow: 0 14px 28px rgba(15, 23, 42, 0.1);
  transform: translateY(-1px);
}

.vf-podcasts-page .vf-podcast-show-card img,
.vf-podcasts-page .vf-podcast-detail-card img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 12px !important;
}

.vf-podcasts-page audio {
  overflow: hidden;
  border-radius: 999px;
}

body.night-mode .vf-broadcasting-page .card.vf-broadcasting-card,
body.night-mode .vf-broadcasting-page .vf-broadcasting-meta,
body.night-mode .vf-podcasts-page .card,
body.night-mode .vf-podcasts-page .vf-podcast-show-card,
body.night-mode .vf-podcasts-page .vf-podcast-list-card,
body.night-mode .vf-podcasts-page .vf-podcast-episode-row {
  border-color: rgba(148, 163, 184, 0.18);
  background: #182233;
}

body.night-mode .vf-broadcasting-page .form-control,
body.night-mode .vf-broadcasting-page .form-select {
  border-color: rgba(148, 163, 184, 0.24);
  background-color: #101827;
  color: #e5edf8;
}

@media (max-width: 767.98px) {
  body.vf-page-broadcasting .page-header {
    display: none;
  }

  .vf-broadcasting-page,
  .vf-podcasts-page {
    margin-top: 12px !important;
  }

  .vf-broadcasting-page .vf-broadcasting-frame {
    height: clamp(560px, 84dvh, 760px);
  }

  .vf-podcasts-page .vf-podcast-hero .card-body {
    align-items: stretch !important;
  }
}

/* v15i final profile page system */
.vf-profile-shell .sg-offcanvas-mainbar > .row {
  --bs-gutter-x: 1rem;
  --bs-gutter-y: 1rem;
  margin-top: 12px;
}

@media (min-width: 992px) {
  .vf-profile-shell .sg-offcanvas-mainbar > .row {
    display: grid;
    grid-template-columns: minmax(300px, 0.36fr) minmax(0, 1fr);
    gap: 16px;
    width: 100%;
    margin-right: 0;
    margin-left: 0;
  }

  .vf-profile-shell .sg-offcanvas-mainbar > .row > .vf-profile-sidebar,
  .vf-profile-shell .sg-offcanvas-mainbar > .row > .vf-profile-main {
    width: auto;
    max-width: none;
    padding-right: 0;
    padding-left: 0;
  }

  body.vf-page-profile:not(.vf-view-default) .vf-profile-shell .sg-offcanvas-mainbar > .row > .col-12 {
    grid-column: 1 / -1;
    width: 100%;
    max-width: none;
    padding-right: 0;
    padding-left: 0;
  }

  body.vf-page-profile:is(.vf-view-friends, .vf-view-followers, .vf-view-followings, .vf-view-subscribers, .vf-view-subscriptions) .vf-profile-shell .card-body > ul.row > .col-md-6.col-lg-3 {
    flex: 0 0 auto;
    width: 25%;
    max-width: 25%;
  }
}

.vf-profile-shell .vf-profile-sidebar,
.vf-profile-shell .vf-profile-main {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.vf-profile-shell .vf-profile-sidebar > *,
.vf-profile-shell .vf-profile-main > * {
  margin-bottom: 0 !important;
}

.vf-profile-shell .card {
  border: 1px solid var(--vf-ui-border);
  border-radius: 20px;
  background: var(--vf-ui-surface);
  box-shadow: 0 14px 32px rgba(15, 23, 42, 0.12);
  overflow: hidden;
}

.vf-profile-shell .card .card-header {
  border-bottom: 1px solid var(--vf-ui-border);
  background: linear-gradient(180deg, rgba(248, 251, 255, 0.96), rgba(243, 248, 255, 0.9));
  padding: 13px 16px;
}

.vf-profile-shell .card .card-header strong {
  font-size: 0.92rem;
  font-weight: 800;
  letter-spacing: 0.02em;
}

.vf-profile-shell .card .card-body {
  padding: 14px 16px;
}

.vf-profile-shell .vf-profile-sidebar .card .card-header {
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 0.76rem;
}

.vf-profile-shell .vf-profile-sidebar .card .card-body {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.97), rgba(247, 251, 255, 0.95));
}

.vf-profile-shell .vf-profile-sidebar .about-list li {
  margin-bottom: 8px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(15, 23, 42, 0.08);
}

.vf-profile-shell .vf-profile-sidebar .about-list li:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: 0;
}

.vf-profile-shell .vf-profile-sidebar .about-list-item {
  position: relative;
  display: block;
  padding-left: 30px;
  font-size: 0.92rem;
  line-height: 1.4;
  word-break: break-word;
}

.vf-profile-shell .vf-profile-sidebar .about-list-item .svg-container {
  position: absolute;
  left: 0;
  top: 2px;
  transform: none;
}

.vf-profile-shell .vf-profile-sidebar .about-list-item i {
  position: absolute;
  left: 0;
  top: 3px;
  width: 18px;
  min-width: 18px;
  text-align: center;
  margin-right: 0 !important;
  line-height: 1;
}

.vf-profile-shell .vf-profile-sidebar .about-list-item .main-icon,
.vf-profile-shell .vf-profile-sidebar .about-list-item .main-icon * {
  width: 18px !important;
  height: 18px !important;
  color: #4c6fff !important;
  fill: #4c6fff !important;
}

.vf-profile-shell .vf-profile-sidebar .badge.bg-light.text-primary {
  background: rgba(76, 111, 255, 0.12) !important;
  border: 1px solid rgba(76, 111, 255, 0.24);
}

.vf-profile-shell .vf-profile-main .composer-launcher {
  border-radius: 20px;
  border: 1px solid rgba(76, 111, 255, 0.24);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(245, 250, 255, 0.98));
  box-shadow: 0 18px 36px rgba(15, 23, 42, 0.14);
}

.vf-profile-shell .vf-profile-main .composer-launcher .card-body {
  padding: 15px 16px !important;
}

.vf-profile-shell .vf-profile-main .composer-launcher-input {
  font-size: 0.97rem;
  font-weight: 600;
  color: #4b5c74;
}

.vf-profile-shell .vf-profile-main .post {
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 20px;
  background: var(--vf-ui-surface);
  box-shadow: 0 18px 38px rgba(15, 23, 42, 0.14);
  overflow: hidden;
}

.vf-profile-shell .vf-profile-main .post.post-menu-open {
  overflow: visible !important;
  z-index: 2140 !important;
}

.vf-profile-shell .vf-profile-main .post.post-menu-open .post-body,
.vf-profile-shell .vf-profile-main .post.post-menu-open .post-header,
.vf-profile-shell .vf-profile-main .post.post-menu-open .post-meta {
  overflow: visible !important;
}

.vf-profile-shell .vf-profile-main .post.post-menu-open .post-header .post-meta > .dropdown.show {
  z-index: 2141 !important;
}

.vf-profile-shell .vf-profile-main .post.post-menu-open .post-header .post-meta > .dropdown.show > .dropdown-menu,
.vf-profile-shell .vf-profile-main .post.post-menu-open .post-header .post-meta > .dropdown > .dropdown-menu.show {
  z-index: 2142 !important;
  max-height: min(420px, calc(100vh - 96px)) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  pointer-events: auto !important;
}

.vf-profile-shell .vf-profile-main .post .post-body {
  padding-top: 14px;
}

.vf-profile-shell .vf-profile-main .post .post-footer,
.vf-profile-shell .vf-profile-main .post .comments,
.vf-profile-shell .vf-profile-main .post .comment {
  border-top-color: var(--vf-ui-border);
}

.vf-profile-shell .vf-profile-main .post .post-actions .action-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 40px;
  line-height: 1;
}

.vf-profile-shell .vf-profile-main .post .post-actions .reaction-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

.vf-profile-shell .btn-primary {
  border-radius: 999px;
  font-weight: 700;
  letter-spacing: 0.01em;
  box-shadow: 0 10px 22px rgba(76, 111, 255, 0.24);
}

.vf-profile-shell .btn-light {
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, 0.32);
  background: rgba(255, 255, 255, 0.94);
}

.vf-profile-shell .profile-header,
.vf-profile-shell .profile-cover-wrapper {
  border-radius: 24px !important;
}

.vf-profile-shell .profile-header {
  overflow: hidden;
  margin-top: 0 !important;
}

.vf-profile-shell .sg-offcanvas-mainbar {
  padding-top: 15px;
}

.vf-profile-shell .profile-name-wrapper > a:first-of-type {
  font-size: clamp(1.45rem, 2.05vw, 2.05rem);
  line-height: 1.08;
}

.vf-profile-shell .profile-header-presence-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 3px 8px;
  border-radius: 6px;
  font-size: 0.66rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  border: 1px solid rgba(255, 255, 255, 0.4);
  background: rgba(7, 16, 33, 0.45);
  color: #f8fbff !important;
}

.vf-profile-shell .profile-header-presence-badge.is-online {
  background: rgba(22, 163, 74, 0.28);
  border-color: rgba(134, 239, 172, 0.45);
}

.vf-profile-shell .profile-header-presence-badge.is-offline {
  background: rgba(100, 116, 139, 0.34);
  border-color: rgba(203, 213, 225, 0.42);
}

.vf-profile-shell .profile-header-meta {
  order: 24;
  flex-basis: 100%;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 6px;
}

.vf-profile-shell .profile-header-meta-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.86rem;
  font-weight: 700;
  color: #f8fbff !important;
  text-decoration: none !important;
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.4);
}

.vf-profile-shell .profile-header-meta-item i {
  font-size: 0.8rem;
  line-height: 1;
}

.vf-profile-shell .profile-header-meta-link:hover {
  text-decoration: underline !important;
}

.vf-profile-shell .profile-header-identity {
  order: 28;
  flex-basis: 100%;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px;
}

.vf-profile-shell .profile-header-pronouns {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #f8fbff !important;
  font-size: 0.86rem;
  font-weight: 700;
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.4);
}

.vf-profile-shell .profile-header-pronouns i {
  color: #f8fbff !important;
  font-size: 0.8rem;
  line-height: 1;
}

.vf-profile-shell .profile-header-identity .profile-name-flag {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.vf-profile-shell .profile-header-social {
  order: 30;
  flex-basis: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  margin-top: 6px;
}

.vf-profile-shell .profile-header-social-link {
  width: 28px;
  height: 28px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none !important;
  color: #f8fbff !important;
  background: rgba(15, 23, 42, 0.24);
  border: 1px solid rgba(255, 255, 255, 0.34);
  box-shadow: none;
  transition: transform 0.18s ease, background-color 0.18s ease;
}

.vf-profile-shell .profile-header-social-link:hover {
  transform: translateY(-1px);
  background: rgba(76, 111, 255, 0.42);
}

.vf-profile-shell .profile-header-social-link i,
.vf-profile-shell .profile-header-social-link svg {
  font-size: 14px !important;
  line-height: 1 !important;
  width: 14px !important;
  height: 14px !important;
}

/* Hide owner quick actions under stats (Import Calendar + Edit Profile) */
.vf-profile-shell .profile-buttons-wrapper button[data-url*="events/import_ics.php"],
.vf-profile-shell .profile-buttons-wrapper a[href$="/settings/profile"] {
  display: none !important;
}

/* Dark glass stats panel */
.vf-profile-shell .profile-header-stats {
  padding: 8px 12px;
  border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  background: linear-gradient(180deg, rgba(7, 16, 33, 0.58), rgba(7, 16, 33, 0.38));
  box-shadow: 0 14px 30px rgba(2, 8, 23, 0.35);
  backdrop-filter: blur(9px);
  -webkit-backdrop-filter: blur(9px);
}

@media (min-width: 1200px) {
  .vf-profile-shell .sg-offcanvas-mainbar > .row {
    --bs-gutter-x: 1.1rem;
  }
}

@media (min-width: 992px) {
  .vf-profile-shell .profile-header {
    min-height: clamp(390px, 38vw, 490px) !important;
  }

  .vf-profile-shell .profile-cover-wrapper {
    height: clamp(390px, 38vw, 490px) !important;
    min-height: clamp(390px, 38vw, 490px) !important;
  }

  .vf-profile-shell .profile-avatar-wrapper > img {
    width: 164px !important;
    height: 164px !important;
    min-width: 164px !important;
    min-height: 164px !important;
  }

  .vf-profile-shell .profile-header .profile-avatar-wrapper:not(.static) {
    left: 28px !important;
    bottom: 86px !important;
  }

  .vf-profile-shell .profile-name-wrapper {
    left: 230px !important;
    right: 470px !important;
    bottom: 92px !important;
  }

  .vf-profile-shell .profile-name-wrapper > a:first-of-type {
    font-size: clamp(2.12rem, 2.4vw, 2.72rem) !important;
    letter-spacing: -0.01em;
  }

  .vf-profile-shell .profile-header-meta {
    margin-top: 7px;
    gap: 14px;
  }

  .vf-profile-shell .profile-buttons-wrapper {
    right: 34px !important;
    bottom: 60px !important;
  }

  .vf-profile-shell .profile-header-stats {
    right: 34px !important;
    bottom: 126px !important;
  }

  .vf-profile-shell .profile-tabs-wrapper {
    position: relative;
    z-index: 8;
    display: flex !important;
    align-items: stretch;
    justify-content: flex-start !important;
    gap: 0 !important;
    width: 100% !important;
    margin: -44px 0 16px !important;
    padding: 0 !important;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x proximity;
    scrollbar-width: thin;
    border-radius: 0 0 24px 24px !important;
    border: 1px solid rgba(255, 255, 255, 0.24);
    border-top: 2px solid rgba(255, 255, 255, 0.3);
    background: linear-gradient(180deg, rgba(8, 18, 37, 0.88), rgba(10, 21, 42, 0.84));
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.24),
      0 16px 34px rgba(2, 8, 23, 0.38) !important;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
  }

  .vf-profile-shell .profile-tabs-wrapper::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 8px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0));
    pointer-events: none;
  }

  .vf-profile-shell .profile-tabs-wrapper > a {
    flex: 0 0 auto;
    min-width: 132px;
    margin: 0 !important;
    padding: 15px 8px 11px !important;
    border-radius: 0 !important;
    border-bottom: 3px solid transparent;
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 7px;
    font-size: 0.9rem;
    font-weight: 700;
    line-height: 1;
    color: rgba(240, 247, 255, 0.92) !important;
    text-align: center !important;
    white-space: nowrap;
    scroll-snap-align: start;
  }

  .vf-profile-shell .profile-tabs-wrapper > a + a {
    border-left: 1px solid rgba(255, 255, 255, 0.12);
  }

  .vf-profile-shell .profile-tabs-wrapper > a .main-icon,
  .vf-profile-shell .profile-tabs-wrapper > a .main-icon * {
    margin-right: 0 !important;
    color: rgba(240, 247, 255, 0.92) !important;
    fill: rgba(240, 247, 255, 0.92) !important;
  }

  .vf-profile-shell .profile-tabs-wrapper > a span,
  .vf-profile-shell .profile-tabs-wrapper > a span.d-none.d-xxl-inline-block {
    margin-left: 0 !important;
    display: inline-block !important;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
  }

  .vf-profile-shell .profile-tabs-wrapper > a.active,
  .vf-profile-shell .profile-tabs-wrapper > a:hover {
    background: rgba(76, 111, 255, 0.34) !important;
    border-bottom-color: #7ea2ff;
    color: #ffffff !important;
  }

  .vf-profile-shell .profile-tabs-wrapper > a.active .main-icon,
  .vf-profile-shell .profile-tabs-wrapper > a.active .main-icon *,
  .vf-profile-shell .profile-tabs-wrapper > a:hover .main-icon,
  .vf-profile-shell .profile-tabs-wrapper > a:hover .main-icon * {
    color: #ffffff !important;
    fill: #ffffff !important;
  }

  .vf-profile-shell .profile-tabs-wrapper > a:first-child {
    border-bottom-left-radius: 24px !important;
  }

  .vf-profile-shell .profile-tabs-wrapper > a:last-child {
    border-bottom-right-radius: 24px !important;
  }
}

@media (max-width: 991.98px) {
  .vf-profile-shell .vf-profile-sidebar,
  .vf-profile-shell .vf-profile-main {
    gap: 12px;
  }

  .vf-profile-shell .card {
    border-radius: 16px;
  }

  .vf-profile-shell .card .card-header {
    padding: 11px 13px;
  }

  .vf-profile-shell .card .card-body {
    padding: 12px 13px;
  }

  .vf-profile-shell .profile-tabs-wrapper {
    border-radius: 14px;
    margin-top: 8px;
    display: flex !important;
    justify-content: flex-start !important;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: thin;
  }

  .vf-profile-shell .profile-tabs-wrapper a {
    flex: 0 0 auto;
    min-width: 96px;
    padding: 10px 6px;
    white-space: nowrap;
  }

  .vf-profile-shell .profile-header-meta {
    justify-content: center;
    margin-top: 7px;
    gap: 10px;
  }

  .vf-profile-shell .profile-header-meta-item {
    font-size: 0.82rem;
  }

  .vf-profile-shell .profile-header-social {
    justify-content: center;
    margin-top: 8px;
  }

  .vf-profile-shell .profile-header-social-link {
    width: 28px;
    height: 28px;
    border-radius: 999px;
  }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
  .vf-profile-shell .profile-name-wrapper {
    right: 440px !important;
  }

  .vf-profile-shell .profile-header-stats {
    right: 26px !important;
    bottom: 130px !important;
  }

  .vf-profile-shell .profile-buttons-wrapper {
    right: 26px !important;
    bottom: 58px !important;
    gap: 8px;
  }
}

body.night-mode .vf-profile-shell .card {
  background: var(--card-dark-color);
  border-color: var(--card-dark-divider);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.35);
}

body.night-mode .vf-profile-shell .card .card-header {
  background: linear-gradient(180deg, rgba(24, 34, 49, 0.95), rgba(20, 30, 44, 0.9));
  border-bottom-color: var(--card-dark-divider);
}

body.night-mode .vf-profile-shell .vf-profile-sidebar .about-list li {
  border-bottom-color: var(--card-dark-divider);
}

body.night-mode .vf-profile-shell .vf-profile-sidebar .badge.bg-light.text-primary {
  background: rgba(76, 111, 255, 0.22) !important;
  border-color: rgba(110, 141, 255, 0.34);
}

body.night-mode .vf-profile-shell .vf-profile-main .composer-launcher {
  background: linear-gradient(180deg, rgba(23, 33, 48, 0.95), rgba(20, 30, 45, 0.95));
  border-color: rgba(86, 114, 150, 0.34);
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.34);
}

body.night-mode .vf-profile-shell .vf-profile-main .composer-launcher-input {
  color: #b9cade;
}

body.night-mode .vf-profile-shell .vf-profile-main .post {
  background: var(--card-dark-color);
  border-color: var(--card-dark-divider);
}

body.night-mode .vf-profile-shell .vf-profile-sidebar .card .card-body {
  background: linear-gradient(180deg, rgba(24, 34, 49, 0.95), rgba(20, 30, 44, 0.9)) !important;
}

body.night-mode .vf-profile-shell .btn-light {
  background: rgba(26, 37, 54, 0.9);
  border-color: rgba(96, 121, 155, 0.42);
  color: #e5efff;
}

body.night-mode .vf-profile-shell .profile-tabs-wrapper {
  background: linear-gradient(180deg, rgba(7, 15, 29, 0.92), rgba(9, 17, 33, 0.9));
  border-color: rgba(114, 132, 162, 0.34);
}

body.night-mode .vf-profile-shell .profile-header-social-link {
  background: rgba(12, 20, 36, 0.36);
  border-color: rgba(159, 179, 206, 0.32);
}

body.night-mode .vf-profile-shell .profile-header-meta-item {
  color: #f8fbff !important;
}

/* v16 site-wide profile-inspired skin */
.main-wrapper .card:not(.vf-promo-card) {
  border: 1px solid var(--vf-ui-border);
  border-radius: 18px;
  background: var(--vf-ui-surface);
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.1);
  overflow: hidden;
}

.main-wrapper .card .card-header {
  border-bottom: 1px solid var(--vf-ui-border);
  background: linear-gradient(180deg, rgba(248, 251, 255, 0.96), rgba(243, 248, 255, 0.9));
}

.main-wrapper .post {
  border: 1px solid var(--vf-ui-border);
  border-radius: 18px;
  background: var(--vf-ui-surface);
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.1);
  overflow: hidden;
}

.main-wrapper .post .post-footer,
.main-wrapper .post .comments,
.main-wrapper .post .comment {
  border-top-color: var(--vf-ui-border);
}

.main-wrapper .btn.btn-primary {
  border-radius: 999px;
  font-weight: 700;
  letter-spacing: 0.01em;
  box-shadow: 0 10px 20px rgba(76, 111, 255, 0.24);
}

.main-wrapper .btn.btn-light {
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, 0.34);
  background: rgba(255, 255, 255, 0.94);
}

.main-wrapper .nav-tabs,
.main-wrapper .nav-pills {
  gap: 6px;
}

.main-wrapper .nav-tabs .nav-link,
.main-wrapper .nav-pills .nav-link {
  border-radius: 11px;
  font-weight: 700;
}

.main-wrapper .nav-tabs .nav-link.active,
.main-wrapper .nav-pills .nav-link.active {
  border-color: rgba(76, 111, 255, 0.25);
  background: rgba(76, 111, 255, 0.12);
  color: #2343cf;
}

.main-wrapper .form-control,
.main-wrapper .form-select {
  border-radius: 12px;
  border-color: rgba(148, 163, 184, 0.34);
}

.main-wrapper .form-control:focus,
.main-wrapper .form-select:focus {
  border-color: rgba(76, 111, 255, 0.5);
  box-shadow: 0 0 0 0.2rem rgba(76, 111, 255, 0.14);
}

.main-wrapper .list-group-item {
  border-color: var(--vf-ui-border);
}

body.night-mode .main-wrapper .card:not(.vf-promo-card),
body.night-mode .main-wrapper .post {
  background: var(--card-dark-color);
  border-color: var(--card-dark-divider);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.35);
}

body.night-mode .main-wrapper .card .card-body:not(.vf-foryou-hero-body),
body.night-mode .main-wrapper .card .bg-white,
body.night-mode .main-wrapper .card .bg-light,
body.night-mode .main-wrapper .bg-white,
body.night-mode .main-wrapper .bg-light {
  background-color: var(--card-dark-color) !important;
}

body.night-mode .main-wrapper .vf-for-you-shell .vf-foryou-hero-card .vf-foryou-hero-body {
  background: transparent !important;
  background-color: transparent !important;
}

body.night-mode .main-wrapper .card .card-header {
  background: linear-gradient(180deg, rgba(24, 34, 49, 0.95), rgba(20, 30, 44, 0.9));
  border-bottom-color: var(--card-dark-divider);
}

body.night-mode .main-wrapper .btn.btn-light {
  background: rgba(26, 37, 54, 0.9);
  border-color: rgba(96, 121, 155, 0.42);
  color: #e5efff;
}

body.night-mode .main-wrapper .nav-tabs .nav-link.active,
body.night-mode .main-wrapper .nav-pills .nav-link.active {
  background: rgba(76, 111, 255, 0.26);
  border-color: rgba(110, 141, 255, 0.42);
  color: #dbe8ff;
}

body.night-mode .main-wrapper .form-control,
body.night-mode .main-wrapper .form-select {
  border-color: rgba(96, 121, 155, 0.42);
  background: rgba(26, 37, 54, 0.94);
  color: #e5efff;
}

@media (max-width: 991.98px) {
  .main-wrapper .card:not(.vf-promo-card),
  .main-wrapper .post {
    border-radius: 14px;
  }
}

/* Avatar / cover action dropdown layering fix */
.vf-profile-shell .profile-avatar-wrapper {
  overflow: visible !important;
  z-index: 20 !important;
}

.vf-profile-shell .profile-avatar-change,
.vf-profile-shell .profile-avatar-crop,
.vf-profile-shell .profile-avatar-delete,
.vf-profile-shell .profile-cover-change,
.vf-profile-shell .profile-cover-crop,
.vf-profile-shell .profile-cover-position,
.vf-profile-shell .profile-cover-delete,
.vf-profile-shell .profile-cover-buttons {
  z-index: 21 !important;
}

.vf-profile-shell .profile-avatar-change .dropdown-menu,
.vf-profile-shell .profile-avatar-change .action-dropdown-menu,
.vf-profile-shell .profile-cover-change .dropdown-menu,
.vf-profile-shell .profile-cover-change .action-dropdown-menu,
.vf-profile-shell .profile-cover-crop .dropdown-menu,
.vf-profile-shell .profile-cover-crop .action-dropdown-menu,
.vf-profile-shell .profile-cover-buttons .dropdown-menu,
.vf-profile-shell .profile-cover-buttons .action-dropdown-menu {
  z-index: 2200 !important;
}

.vf-profile-shell.profile-action-menu-open .profile-cover-buttons {
  position: relative !important;
  overflow: visible !important;
  z-index: 2140 !important;
}

.vf-profile-shell .profile-action-menu-open,
.vf-profile-shell .profile-avatar-change.profile-action-menu-open,
.vf-profile-shell .profile-cover-change.profile-action-menu-open,
.vf-profile-shell .profile-cover-crop.profile-action-menu-open,
.vf-profile-shell .profile-cover-buttons .dropdown.profile-action-menu-open,
.vf-profile-shell .profile-buttons-wrapper .dropdown.profile-action-menu-open {
  position: relative !important;
  overflow: visible !important;
  z-index: 2141 !important;
}

.vf-profile-shell .profile-action-menu-open > .dropdown-menu.show,
.vf-profile-shell .profile-action-menu-open > .action-dropdown-menu.show,
.vf-profile-shell .profile-action-menu-open > .dropdown-menu[data-bs-popper],
.vf-profile-shell .profile-avatar-change.profile-action-menu-open > .dropdown-menu,
.vf-profile-shell .profile-cover-change.profile-action-menu-open > .dropdown-menu,
.vf-profile-shell .profile-cover-crop.profile-action-menu-open > .dropdown-menu,
.vf-profile-shell .profile-cover-buttons .dropdown.profile-action-menu-open > .dropdown-menu,
.vf-profile-shell .profile-buttons-wrapper .dropdown.profile-action-menu-open > .dropdown-menu {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 2142 !important;
  max-height: min(420px, calc(100vh - 96px)) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  pointer-events: auto !important;
}

@media (min-width: 992px) {
  .vf-profile-shell .profile-header .profile-avatar-wrapper:not(.static),
  .vf-profile-shell .profile-name-wrapper,
  .vf-profile-shell .profile-buttons-wrapper,
  .vf-profile-shell .profile-header-stats {
    z-index: 20 !important;
  }

  .vf-profile-shell .profile-tabs-wrapper {
    z-index: 6 !important;
  }
}

/* Avatar dropdown above profile name */
.vf-profile-shell .profile-header .profile-avatar-wrapper,
.vf-profile-shell .profile-header .profile-avatar-wrapper:not(.static) {
  z-index: 60 !important;
}

.vf-profile-shell .profile-avatar-change,
.vf-profile-shell .profile-avatar-change .dropdown,
.vf-profile-shell .profile-avatar-change .dropdown-menu,
.vf-profile-shell .profile-avatar-change .action-dropdown-menu {
  z-index: 61 !important;
}

@media (min-width: 992px) {
  .vf-profile-shell .profile-name-wrapper,
  .vf-profile-shell .profile-buttons-wrapper,
  .vf-profile-shell .profile-header-stats {
    z-index: 12 !important;
  }
}

/* v20 full default-theme reskin (light mode only, feature-safe CSS overrides) */
:root {
  --vf-v20-paper: #f7f1e6;
  --vf-v20-paper-soft: #fffaf2;
  --vf-v20-ink: #1f2a37;
  --vf-v20-muted: #69788a;
  --vf-v20-accent: #c85a2b;
  --vf-v20-accent-strong: #a0441d;
  --vf-v20-accent-soft: rgba(200, 90, 43, 0.14);
  --vf-v20-outline: rgba(31, 42, 55, 0.16);
  --vf-v20-shadow: 0 14px 0 rgba(31, 42, 55, 0.08), 0 24px 48px rgba(18, 29, 45, 0.12);
  --vf-v20-focus: 0 0 0 0.2rem rgba(200, 90, 43, 0.24);
}

body:not(.night-mode) {
  color: var(--vf-v20-ink);
  background-color: #edf3f7;
  background-image: none;
}

body:not(.night-mode) .main-wrapper {
  color: var(--vf-v20-ink);
}

body:not(.night-mode) .main-wrapper .text-muted {
  color: var(--vf-v20-muted) !important;
}

body:not(.night-mode) .main-wrapper a:not(.btn):not(.dropdown-item) {
  color: #1a6a80;
}

body:not(.night-mode) .main-wrapper a:not(.btn):not(.dropdown-item):hover {
  color: #0f4f61;
}

body:not(.night-mode) .main-wrapper .main-header {
  background:
    linear-gradient(90deg, rgba(26, 35, 52, 0.98), rgba(23, 52, 65, 0.97)),
    repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.06) 0 1px, rgba(255, 255, 255, 0) 1px 6px);
  border-bottom: 2px solid rgba(255, 229, 194, 0.45);
  box-shadow: 0 18px 34px rgba(8, 20, 33, 0.34);
}

body:not(.night-mode) .main-wrapper .main-header .navbar-wrapper > ul > li > a,
body:not(.night-mode) .main-wrapper .main-header .navbar-wrapper > ul > li > .dropdown-toggle {
  color: #f7efe2 !important;
  border-radius: 10px;
  transition: background-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

body:not(.night-mode) .main-wrapper .main-header .navbar-wrapper > ul > li > a:hover,
body:not(.night-mode) .main-wrapper .main-header .navbar-wrapper > ul > li > .dropdown-toggle:hover {
  background: rgba(255, 235, 204, 0.14);
  color: #fff8ef !important;
  transform: translateY(-1px);
}

body:not(.night-mode) .main-wrapper .main-header .counter {
  background: #f08d57 !important;
  color: #1b2735 !important;
}

body:not(.night-mode) .main-wrapper .card:not(.vf-promo-card):not(.main-side-nav-card),
body:not(.night-mode) .main-wrapper .post {
  position: relative;
  border: 1px solid rgba(31, 42, 55, 0.16);
  border-radius: 20px;
  background:
    linear-gradient(180deg, rgba(255, 251, 243, 0.98), rgba(245, 236, 222, 0.98)),
    repeating-linear-gradient(90deg, rgba(31, 42, 55, 0.018) 0 1px, rgba(31, 42, 55, 0) 1px 5px);
  box-shadow: var(--vf-v20-shadow);
  overflow: hidden;
  transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
  animation: vfV20Rise 280ms ease both;
}

body:not(.night-mode) .main-wrapper .card:not(.vf-promo-card):not(.main-side-nav-card)::before,
body:not(.night-mode) .main-wrapper .post::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 4px;
  background: linear-gradient(90deg, #e0753d 0%, #d06435 36%, #1e7f95 100%);
  pointer-events: none;
}

body:not(.night-mode) .main-wrapper .card:not(.vf-promo-card):not(.main-side-nav-card):hover,
body:not(.night-mode) .main-wrapper .post:hover {
  transform: translateY(-3px);
  border-color: rgba(31, 42, 55, 0.26);
  box-shadow: 0 18px 0 rgba(31, 42, 55, 0.09), 0 32px 58px rgba(18, 29, 45, 0.17);
}

body:not(.night-mode) .main-wrapper .card .card-header {
  border-bottom: 1px solid rgba(31, 42, 55, 0.12);
  background: linear-gradient(180deg, rgba(255, 248, 237, 0.98), rgba(248, 240, 228, 0.95));
}

body:not(.night-mode) .main-wrapper .card .card-header strong,
body:not(.night-mode) .main-wrapper .card .card-header h6 {
  letter-spacing: 0.03em;
}

body:not(.night-mode) .main-wrapper .post .post-footer,
body:not(.night-mode) .main-wrapper .post .comments,
body:not(.night-mode) .main-wrapper .post .comment {
  border-top-color: rgba(31, 42, 55, 0.12);
}

body:not(.night-mode) .main-wrapper .btn {
  border-radius: 12px;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  font-size: 0.76rem;
  transition: transform 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease, color 0.18s ease;
}

body:not(.night-mode) .main-wrapper .btn:active {
  transform: translateY(1px);
}

body:not(.night-mode) .main-wrapper .btn.btn-primary {
  border: 1px solid rgba(146, 58, 23, 0.5);
  background: linear-gradient(135deg, #df7a45 0%, #c85a2b 48%, #b84d22 100%);
  color: #fff8f2;
  box-shadow: 0 10px 0 rgba(132, 57, 28, 0.18), 0 14px 28px rgba(200, 90, 43, 0.32);
}

body:not(.night-mode) .main-wrapper .btn.btn-primary:hover,
body:not(.night-mode) .main-wrapper .btn.btn-primary:focus {
  background: linear-gradient(135deg, #e58a58 0%, #d06733 48%, #bb501f 100%);
  box-shadow: 0 12px 0 rgba(132, 57, 28, 0.2), 0 18px 34px rgba(200, 90, 43, 0.36);
  color: #fffdf8;
}

body:not(.night-mode) .main-wrapper .btn.btn-light {
  border: 1px solid rgba(31, 42, 55, 0.2);
  background: linear-gradient(180deg, rgba(255, 252, 244, 0.96), rgba(245, 236, 223, 0.96));
  color: #253243;
  box-shadow: 0 6px 0 rgba(31, 42, 55, 0.08);
}

body:not(.night-mode) .main-wrapper .btn.btn-light:hover {
  background: linear-gradient(180deg, rgba(255, 254, 248, 0.98), rgba(251, 243, 232, 0.98));
  border-color: rgba(31, 42, 55, 0.3);
  color: #18212e;
}

body:not(.night-mode) .main-wrapper .btn:focus-visible,
body:not(.night-mode) .main-wrapper .form-control:focus-visible,
body:not(.night-mode) .main-wrapper .form-select:focus-visible,
body:not(.night-mode) .main-wrapper .nav-link:focus-visible {
  box-shadow: var(--vf-v20-focus);
}

body:not(.night-mode) .main-wrapper .form-control,
body:not(.night-mode) .main-wrapper .form-select {
  border: 1px solid rgba(31, 42, 55, 0.2);
  border-radius: 10px;
  background: rgba(255, 251, 244, 0.92);
  color: #1f2a37;
}

body:not(.night-mode) .main-wrapper .form-control::placeholder {
  color: #7c8897;
}

body:not(.night-mode) .main-wrapper .form-control:focus,
body:not(.night-mode) .main-wrapper .form-select:focus {
  border-color: rgba(200, 90, 43, 0.54);
  background: #fffefb;
  box-shadow: var(--vf-v20-focus);
}

body:not(.night-mode) .main-wrapper .dropdown-menu {
  border: 1px solid rgba(31, 42, 55, 0.18);
  border-radius: 14px;
  padding: 6px;
  background: linear-gradient(180deg, rgba(255, 252, 244, 0.99), rgba(246, 238, 226, 0.98));
  box-shadow: 0 18px 40px rgba(18, 29, 45, 0.18);
}

body:not(.night-mode) .main-wrapper .dropdown-menu .dropdown-item {
  border-radius: 9px;
  transition: background-color 0.15s ease, color 0.15s ease;
}

body:not(.night-mode) .main-wrapper .dropdown-menu .dropdown-item:hover,
body:not(.night-mode) .main-wrapper .dropdown-menu .dropdown-item:focus {
  background: rgba(200, 90, 43, 0.14);
  color: #8f3e1a;
}

body:not(.night-mode) .main-wrapper .main-side-nav > li > a,
body:not(.night-mode) .main-wrapper .side-nav > li > a {
  position: relative;
  border-radius: 10px;
  transition: background-color 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

body:not(.night-mode) .main-wrapper .main-side-nav > li > a:hover,
body:not(.night-mode) .main-wrapper .side-nav > li > a:hover {
  background: rgba(31, 127, 149, 0.12);
  color: #145569 !important;
  transform: translateX(2px);
}

body:not(.night-mode) .main-wrapper .main-side-nav > li.active > a,
body:not(.night-mode) .main-wrapper .side-nav > li.active > a {
  background: rgba(200, 90, 43, 0.16);
  color: #8f3e1a !important;
}

body:not(.night-mode) .main-wrapper .main-side-nav > li.active > a::before,
body:not(.night-mode) .main-wrapper .side-nav > li.active > a::before {
  content: "";
  position: absolute;
  left: 0;
  top: 8px;
  bottom: 8px;
  width: 3px;
  border-radius: 999px;
  background: #c85a2b;
}

body:not(.night-mode) .main-wrapper .nav-tabs,
body:not(.night-mode) .main-wrapper .nav-pills {
  gap: 7px;
}

body:not(.night-mode) .main-wrapper .nav-tabs .nav-link,
body:not(.night-mode) .main-wrapper .nav-pills .nav-link {
  border-radius: 10px;
  border: 1px solid transparent;
  color: #415367;
}

body:not(.night-mode) .main-wrapper .nav-tabs .nav-link.active,
body:not(.night-mode) .main-wrapper .nav-pills .nav-link.active {
  border-color: rgba(200, 90, 43, 0.35);
  background: rgba(200, 90, 43, 0.12);
  color: #8f3e1a;
}

body:not(.night-mode) .main-wrapper .table > :not(caption) > * > * {
  border-bottom-color: rgba(31, 42, 55, 0.12);
}

body:not(.night-mode) .main-wrapper .table tbody tr:hover {
  background: rgba(31, 127, 149, 0.08);
}

body:not(.night-mode) .composer-launcher {
  border: 1px solid rgba(31, 42, 55, 0.18);
  background: linear-gradient(180deg, rgba(255, 251, 243, 0.97), rgba(245, 236, 223, 0.95));
  box-shadow: 0 10px 0 rgba(31, 42, 55, 0.08), 0 18px 34px rgba(18, 29, 45, 0.13);
}

body:not(.night-mode) .composer-launcher:hover {
  border-color: rgba(31, 42, 55, 0.26);
  box-shadow: 0 14px 0 rgba(31, 42, 55, 0.08), 0 24px 42px rgba(18, 29, 45, 0.16);
}

body:not(.night-mode) .composer-launcher-input {
  color: #344456;
}

.post-meta .dropdown .post-menu-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.post-meta .dropdown .post-menu-toggle:focus {
  outline: none;
  box-shadow: none;
}

.action-dropdown-menu {
  min-width: 240px;
  padding: 8px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 18px;
  box-shadow: 0 20px 45px rgba(15, 23, 42, 0.14);
}

.action-dropdown-menu .dropdown-item {
  display: block;
  padding: 10px 12px;
  border: 0;
  border-radius: 14px;
  white-space: normal;
  background: transparent;
}

.action-dropdown-menu .dropdown-item:hover,
.action-dropdown-menu .dropdown-item:focus {
  background: #f8fafc;
}

.action-dropdown-menu .action,
.action-dropdown-menu .action.no-desc {
  display: flex;
  align-items: center;
  gap: 10px;
}

.action-dropdown-menu .action-desc {
  margin-top: 4px;
}

.action-dropdown-menu .main-icon,
.action-dropdown-menu .fa {
  flex: 0 0 20px;
  margin-right: 0;
}

.post-edit-inline {
  padding: 10px 16px 16px;
  border-top: 1px solid #eef2f7;
  background: #f8fafc;
}

.post-edit-inline .post-form {
  margin-bottom: 12px;
}

.post-edit-inline .js_post-editor-quill-wrap {
  border: 1px solid #e3e8ef;
  border-radius: 18px;
  background: #fff;
  box-shadow: none;
  overflow: hidden;
}

.post-edit-inline .js_post-editor-quill-wrap .ql-toolbar.ql-snow {
  padding: 10px 12px 6px;
  background: #fff;
}

.post-edit-inline .js_post-editor-quill-wrap .ql-container.ql-snow {
  border-top: 1px solid #eef2f7 !important;
  background: #fff;
}

.post-edit-inline .js_post-editor-quill-wrap .ql-editor {
  min-height: 120px;
  padding: 14px 16px 16px !important;
}

.post-edit-inline .x-form-tools {
  right: 18px;
  bottom: 16px;
}

body.night-mode .action-dropdown-menu {
  border-color: rgba(148, 163, 184, 0.2);
  background: #151b24;
  box-shadow: 0 20px 45px rgba(2, 6, 23, 0.5);
}

body.night-mode .action-dropdown-menu .dropdown-item:hover,
body.night-mode .action-dropdown-menu .dropdown-item:focus {
  background: rgba(148, 163, 184, 0.12);
}

body.night-mode .post-edit-inline {
  border-top-color: var(--card-dark-divider);
  background: rgba(15, 23, 42, 0.48);
}

body.night-mode .post-edit-inline .js_post-editor-quill-wrap {
  border-color: rgba(148, 163, 184, 0.18);
  background: var(--card-dark-input);
  box-shadow: none;
}

body.night-mode .post-edit-inline .js_post-editor-quill-wrap .ql-toolbar.ql-snow,
body.night-mode .post-edit-inline .js_post-editor-quill-wrap .ql-container.ql-snow {
  background: var(--card-dark-input);
}

body.night-mode .post-edit-inline .js_post-editor-quill-wrap .ql-container.ql-snow {
  border-top-color: rgba(148, 163, 184, 0.14) !important;
}

body:not(.night-mode) .main-wrapper .list-group-item {
  border-color: rgba(31, 42, 55, 0.12);
  background: transparent;
}

@keyframes vfV20Rise {
  0% {
    opacity: 0;
    transform: translateY(8px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 991.98px) {
  body:not(.night-mode) .main-wrapper .card:not(.vf-promo-card),
  body:not(.night-mode) .main-wrapper .post {
    border-radius: 16px;
  }

  body:not(.night-mode) .main-wrapper .card:not(.vf-promo-card):hover,
  body:not(.night-mode) .main-wrapper .post:hover {
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  body:not(.night-mode) .main-wrapper .card:not(.vf-promo-card),
  body:not(.night-mode) .main-wrapper .post,
  body:not(.night-mode) .main-wrapper .btn,
  body:not(.night-mode) .main-wrapper .main-side-nav > li > a,
  body:not(.night-mode) .main-wrapper .side-nav > li > a,
  body:not(.night-mode) .main-wrapper .main-header .navbar-wrapper > ul > li > a,
  body:not(.night-mode) .main-wrapper .main-header .navbar-wrapper > ul > li > .dropdown-toggle {
    animation: none !important;
    transition: none !important;
  }
}

/* Keep the modern left sidebar on the cool brand palette */
body:not(.night-mode) .main-wrapper .main-side-nav-card {
  background:
    radial-gradient(circle at top right, rgba(76, 111, 255, 0.08), rgba(76, 111, 255, 0) 34%),
    linear-gradient(180deg, rgba(244, 248, 255, 0.98), rgba(236, 242, 250, 0.96)) !important;
  border-color: rgba(191, 219, 254, 0.32) !important;
  box-shadow: 0 16px 34px rgba(15, 23, 42, 0.07) !important;
}

body:not(.night-mode) .main-wrapper .main-side-nav-card::before {
  background: linear-gradient(90deg, #4c6fff 0%, #2f6fe4 42%, #22c1ee 100%) !important;
}

body:not(.night-mode) .main-wrapper .sidebar-layout-modern .sidebar-section-block {
  border-top-color: rgba(148, 163, 184, 0.12) !important;
}

body:not(.night-mode) .main-wrapper .sidebar-layout-modern .sidebar-section-title {
  color: #55657c !important;
}

body:not(.night-mode) .main-wrapper .sidebar-layout-modern .sidebar-section-title .main-icon,
body:not(.night-mode) .main-wrapper .sidebar-layout-modern .sidebar-section-title .sidebar-section-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  min-width: 18px;
  margin-right: 0 !important;
  transform: translateY(0);
  vertical-align: middle !important;
}

body:not(.night-mode) .main-wrapper .sidebar-layout-modern .sidebar-section-title .mr10 {
  margin-right: 0 !important;
}

body:not(.night-mode) .main-wrapper .sidebar-layout-modern .sidebar-section-title .main-icon svg,
body:not(.night-mode) .main-wrapper .sidebar-layout-modern .sidebar-section-title .sidebar-section-icon svg {
  display: block;
}

body:not(.night-mode) .main-wrapper .sidebar-layout-modern .sidebar-section-title .sidebar-section-icon,
body:not(.night-mode) .main-wrapper .sidebar-layout-modern .sidebar-section-title .sidebar-section-icon * {
  color: #9aaed8 !important;
  fill: #9aaed8 !important;
}

body:not(.night-mode) .main-wrapper .sidebar-layout-modern .sidebar-grid-item,
body:not(.night-mode) .main-wrapper .sidebar-layout-modern .sidebar-quick-item {
  border-color: rgba(181, 194, 218, 0.5) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(247, 250, 255, 0.94)) !important;
  color: #1d2b41 !important;
  box-shadow: 0 4px 10px rgba(148, 163, 184, 0.08) !important;
}

body:not(.night-mode) .main-wrapper .sidebar-layout-modern .sidebar-grid-item:hover,
body:not(.night-mode) .main-wrapper .sidebar-layout-modern .sidebar-quick-item:hover {
  background: linear-gradient(180deg, rgba(242, 247, 255, 0.98), rgba(234, 242, 255, 0.96)) !important;
  border-color: rgba(47, 111, 228, 0.18) !important;
  box-shadow: 0 8px 16px rgba(148, 163, 184, 0.12) !important;
}

body:not(.night-mode) .main-wrapper .sidebar-layout-modern .sidebar-grid-item.is-active,
body:not(.night-mode) .main-wrapper .sidebar-layout-modern .sidebar-quick-item.is-active {
  background: linear-gradient(180deg, rgba(229, 238, 255, 0.98), rgba(219, 231, 255, 0.96)) !important;
  border-color: rgba(47, 111, 228, 0.26) !important;
  box-shadow: inset 0 0 0 1px rgba(47, 111, 228, 0.1), 0 8px 16px rgba(76, 111, 255, 0.08) !important;
}

body:not(.night-mode) .main-wrapper .sidebar-layout-modern .sidebar-grid-item.is-active::before,
body:not(.night-mode) .main-wrapper .sidebar-layout-modern .sidebar-quick-item.is-active::before {
  background: var(--vf-accent) !important;
  opacity: 1 !important;
}

body:not(.night-mode) .main-wrapper .sidebar-layout-modern .sidebar-grid-item .main-icon,
body:not(.night-mode) .main-wrapper .sidebar-layout-modern .sidebar-grid-item .main-icon *,
body:not(.night-mode) .main-wrapper .sidebar-layout-modern .sidebar-quick-item .main-icon,
body:not(.night-mode) .main-wrapper .sidebar-layout-modern .sidebar-quick-item .main-icon * {
  color: #7188c3 !important;
  fill: #7188c3 !important;
}

body:not(.night-mode) .main-wrapper .sidebar-layout-modern .sidebar-grid-item.is-active .main-icon,
body:not(.night-mode) .main-wrapper .sidebar-layout-modern .sidebar-grid-item.is-active .main-icon *,
body:not(.night-mode) .main-wrapper .sidebar-layout-modern .sidebar-quick-item.is-active .main-icon,
body:not(.night-mode) .main-wrapper .sidebar-layout-modern .sidebar-quick-item.is-active .main-icon * {
  color: var(--vf-accent) !important;
  fill: var(--vf-accent) !important;
}

@media (min-width: 768px) {
  .main-wrapper .sidebar-layout-modern {
    padding: 14px 12px !important;
  }

  .main-wrapper .sidebar-layout-modern .sidebar-section-block {
    padding: 14px 0 !important;
    border-top: 1px solid rgba(148, 163, 184, 0.14);
  }

  .main-wrapper .sidebar-layout-modern .sidebar-section-block:first-child {
    padding-top: 0 !important;
    border-top: 0;
  }

  .main-wrapper .sidebar-layout-modern .sidebar-section-title {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 30px;
    margin: 0 0 8px;
    padding: 0 8px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
  }

  .main-wrapper .sidebar-layout-modern .sidebar-grid,
  .main-wrapper .sidebar-layout-modern .sidebar-quick-grid {
    display: flex !important;
    flex-direction: column;
    gap: 3px;
  }

  .main-wrapper .sidebar-layout-modern .sidebar-grid-item,
  .main-wrapper .sidebar-layout-modern .sidebar-quick-item {
    position: relative;
    display: grid !important;
    grid-template-columns: 34px minmax(0, 1fr);
    align-items: center;
    min-height: 42px;
    padding: 5px 10px 5px 7px !important;
    border: 0 !important;
    border-radius: 12px !important;
    box-shadow: none !important;
    background: transparent !important;
  }

  .main-wrapper .sidebar-layout-modern .sidebar-grid-item::before,
  .main-wrapper .sidebar-layout-modern .sidebar-quick-item::before {
    content: "";
    position: absolute;
    top: 8px;
    bottom: 8px;
    left: 0;
    width: 3px;
    border-radius: 999px;
    background: transparent;
  }

  .main-wrapper .sidebar-layout-modern .sidebar-grid-item .main-icon,
  .main-wrapper .sidebar-layout-modern .sidebar-quick-item .main-icon,
  .main-wrapper .sidebar-layout-modern .sidebar-quick-item .shortcut-thumb {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px !important;
    height: 28px !important;
    min-width: 28px;
    margin: 0 !important;
    border-radius: 9px;
    background: rgba(76, 111, 255, 0.08);
  }

  .main-wrapper .sidebar-layout-modern .sidebar-grid-item span,
  .main-wrapper .sidebar-layout-modern .sidebar-quick-item span {
    min-width: 0;
    overflow: hidden;
    color: inherit;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.15;
    text-overflow: ellipsis;
  }

  .main-wrapper .sidebar-layout-modern .sidebar-grid-item:hover,
  .main-wrapper .sidebar-layout-modern .sidebar-quick-item:hover {
    transform: none;
    background: rgba(76, 111, 255, 0.07) !important;
    box-shadow: none !important;
  }

  .main-wrapper .sidebar-layout-modern .sidebar-grid-item.is-active,
  .main-wrapper .sidebar-layout-modern .sidebar-quick-item.is-active {
    background: rgba(76, 111, 255, 0.12) !important;
    box-shadow: none !important;
  }

  .main-wrapper .sidebar-layout-modern .sidebar-grid-item.is-active::before,
  .main-wrapper .sidebar-layout-modern .sidebar-quick-item.is-active::before {
    background: var(--vf-accent, #4c6fff) !important;
  }

  .main-wrapper .sidebar-layout-modern .sidebar-grid-item.is-active .main-icon,
  .main-wrapper .sidebar-layout-modern .sidebar-quick-item.is-active .main-icon {
    background: rgba(76, 111, 255, 0.16);
  }

  .main-wrapper .sidebar-layout-modern .sidebar-see-more {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) 18px;
    align-items: center;
    width: 100%;
    min-height: 42px;
    margin: 10px 0 0;
    padding: 5px 10px 5px 7px;
    border: 0;
    border-radius: 12px;
    background: transparent;
    color: #52627a;
    font-size: 13px;
    font-weight: 800;
    text-align: left;
  }

  .main-wrapper .sidebar-layout-modern .sidebar-see-more::before {
    content: "+";
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 9px;
    background: rgba(76, 111, 255, 0.08);
    color: var(--vf-accent, #4c6fff);
    font-size: 18px;
    line-height: 1;
  }

  .main-wrapper .sidebar-layout-modern .sidebar-see-more::after {
    content: "\f107";
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free";
    font-weight: 900;
    justify-self: end;
    color: #8794a8;
    transition: transform 0.18s ease;
  }

  .main-wrapper .sidebar-layout-modern .sidebar-see-more:not(.collapsed)::after {
    transform: rotate(180deg);
  }

  .main-wrapper .sidebar-layout-modern .sidebar-see-more:hover,
  .main-wrapper .sidebar-layout-modern .sidebar-see-more:focus {
    background: rgba(76, 111, 255, 0.07);
    color: #1d2b41;
  }

  body.night-mode .main-wrapper .sidebar-layout-modern .sidebar-section-block {
    border-top-color: rgba(141, 154, 170, 0.18);
  }

  body.night-mode .main-wrapper .sidebar-layout-modern .sidebar-grid-item,
  body.night-mode .main-wrapper .sidebar-layout-modern .sidebar-quick-item,
  body.night-mode .main-wrapper .sidebar-layout-modern .sidebar-see-more {
    background: transparent !important;
    color: #d8e2ee;
  }

  body.night-mode .main-wrapper .sidebar-layout-modern .sidebar-grid-item:hover,
  body.night-mode .main-wrapper .sidebar-layout-modern .sidebar-quick-item:hover,
  body.night-mode .main-wrapper .sidebar-layout-modern .sidebar-see-more:hover,
  body.night-mode .main-wrapper .sidebar-layout-modern .sidebar-see-more:focus {
    background: rgba(124, 145, 255, 0.12) !important;
  }

  body.night-mode .main-wrapper .sidebar-layout-modern .sidebar-grid-item.is-active,
  body.night-mode .main-wrapper .sidebar-layout-modern .sidebar-quick-item.is-active {
    background: rgba(124, 145, 255, 0.18) !important;
  }
}

/* Restore the core modern light palette after legacy warm reskin rules */
body:not(.night-mode) {
  color: var(--body-color) !important;
  background-color: #edf3f7 !important;
  background-image: none !important;
}

body:not(.night-mode) .main-wrapper {
  color: var(--body-color) !important;
}

body:not(.night-mode) .main-wrapper .main-header {
  background: linear-gradient(90deg, #17365a 0%, #215c97 100%) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
  box-shadow: 0 10px 24px rgba(12, 24, 43, 0.22) !important;
}

body:not(.night-mode) .main-wrapper .main-header .navbar-wrapper > ul > li > a,
body:not(.night-mode) .main-wrapper .main-header .navbar-wrapper > ul > li > .dropdown-toggle {
  color: #f8fbff !important;
}

body:not(.night-mode) .main-wrapper .main-header .counter {
  background: var(--vf-accent) !important;
  color: #ffffff !important;
}

body:not(.night-mode) .main-wrapper .main-header .search-wrapper .form-control {
  background: rgba(255, 255, 255, 0.14) !important;
  border-color: rgba(255, 255, 255, 0.16) !important;
  color: #f8fbff !important;
}

body:not(.night-mode) .main-wrapper .main-header .search-wrapper .form-control::placeholder {
  color: rgba(248, 251, 255, 0.72) !important;
}

.main-wrapper .main-header .logo,
.main-wrapper .main-header .logo:hover {
  display: block !important;
  line-height: 70px !important;
}

.main-wrapper .main-header .logo img {
  display: inline-block !important;
  vertical-align: middle !important;
  max-height: 50px !important;
}

.main-wrapper .main-header .logo picture {
  display: inline-flex !important;
  align-items: center !important;
  min-width: 0 !important;
}

@media (min-width: 768px) {
  .main-wrapper .main-header .logo-wrapper {
    display: flex;
    align-items: center;
    min-height: 70px;
  }

  .main-wrapper .main-header .logo,
  .main-wrapper .main-header .logo:hover {
    display: inline-flex !important;
    align-items: center;
    line-height: 1 !important;
    height: auto;
  }

  .main-wrapper .main-header .logo img {
    max-height: 48px !important;
  }

  .main-wrapper .main-header .header-search-cluster {
    display: flex;
    align-items: center;
    gap: 12px;
  }

  .main-wrapper .main-header .header-search-cluster .home-icon {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    transform: none !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 44px;
    min-width: 44px;
    height: 44px;
    padding: 0;
    border-radius: 12px;
    z-index: auto;
  }

  .main-wrapper .main-header .header-search-cluster .search-wrapper {
    flex: 1 1 auto;
    min-width: 0;
  }
}

body:not(.night-mode) .main-wrapper .card:not(.vf-promo-card),
body:not(.night-mode) .main-wrapper .post,
body:not(.night-mode) .main-wrapper .publisher,
body:not(.night-mode) .main-wrapper .dropdown-menu,
body:not(.night-mode) .main-wrapper .x-form {
  background: var(--vf-surface) !important;
  border: 1px solid var(--vf-border) !important;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.12) !important;
}

body:not(.night-mode) .main-wrapper .card:not(.vf-promo-card)::before,
body:not(.night-mode) .main-wrapper .post::before {
  background: linear-gradient(90deg, #4c6fff 0%, #2f6fe4 42%, #22c1ee 100%) !important;
}

body:not(.night-mode) .main-wrapper .card .card-header {
  background: transparent !important;
  border-bottom: 1px solid var(--vf-border) !important;
}

.main-wrapper .vf-for-you-shell .vf-foryou-hero-card,
.main-wrapper .vf-dashboard-shell .profdash-hero,
.main-wrapper .vf-guide-page .vf-guide-intro,
.main-wrapper .hc-shell .hc-hero-card {
  position: relative;
  min-height: 230px;
  border: 0 !important;
  border-radius: 24px !important;
  overflow: hidden;
  color: #ffffff !important;
  box-shadow: 0 24px 54px rgba(12, 24, 43, 0.22) !important;
  transform: none !important;
}

.main-wrapper .vf-for-you-shell .vf-foryou-hero-card,
.main-wrapper .vf-dashboard-shell .profdash-hero,
.main-wrapper .vf-guide-page .vf-guide-intro,
.main-wrapper .hc-shell .hc-hero-card {
  background:
    radial-gradient(circle at 86% 28%, rgba(255, 255, 255, 0.13), transparent 26%),
    linear-gradient(90deg, #17365a 0%, #215c97 100%) !important;
}

.main-wrapper .vf-for-you-shell .vf-foryou-hero-card::before,
.main-wrapper .vf-dashboard-shell .profdash-hero::before,
.main-wrapper .vf-guide-page .vf-guide-intro::before,
.main-wrapper .hc-shell .hc-hero-card::before {
  content: "" !important;
  position: absolute;
  inset: 0;
  height: auto !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), transparent 52%) !important;
  opacity: 1;
  pointer-events: none;
}

.main-wrapper .vf-for-you-shell .vf-foryou-hero-card::after,
.main-wrapper .vf-dashboard-shell .profdash-hero::after,
.main-wrapper .vf-guide-page .vf-guide-intro::after,
.main-wrapper .hc-shell .hc-hero-card::after {
  content: "";
  position: absolute;
  right: -70px;
  bottom: -90px;
  width: 260px;
  height: 260px;
  border-radius: 50%;
  border: 34px solid rgba(255, 255, 255, 0.08);
  pointer-events: none;
}

.main-wrapper .vf-for-you-shell .vf-foryou-hero-body,
.main-wrapper .vf-dashboard-shell .profdash-hero-body,
.main-wrapper .vf-guide-page .vf-guide-intro .card-body,
.main-wrapper .hc-shell .hc-hero-body {
  position: relative;
  z-index: 1;
  min-height: 230px;
  padding: 30px !important;
}

.main-wrapper .vf-for-you-shell .vf-foryou-hero-title,
.main-wrapper .vf-dashboard-shell .profdash-hero-title,
.main-wrapper .vf-guide-page .vf-guide-intro h1,
.main-wrapper .hc-shell .hc-hero-title,
.main-wrapper .hc-shell .hc-hero-title a {
  color: #ffffff !important;
  font-size: clamp(2rem, 3vw, 3.25rem) !important;
  font-weight: 900 !important;
  line-height: 1.04 !important;
  letter-spacing: 0 !important;
  text-shadow: 0 2px 12px rgba(6, 16, 44, 0.22);
}

.main-wrapper .vf-dashboard-shell .profdash-hero-eyebrow {
  margin-bottom: 8px;
  color: rgba(255, 255, 255, 0.78) !important;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.main-wrapper .hc-shell .hc-hero-eyebrow {
  margin-bottom: 8px;
  color: rgba(255, 255, 255, 0.78) !important;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.main-wrapper .vf-for-you-shell .vf-foryou-hero-copy,
.main-wrapper .vf-dashboard-shell .profdash-hero-subtitle,
.main-wrapper .vf-guide-page .vf-guide-intro-copy,
.main-wrapper .hc-shell .hc-hero-subtitle {
  max-width: 620px;
  color: #ffffff !important;
  font-size: 1rem;
  font-weight: 650;
  text-shadow: 0 1px 8px rgba(6, 16, 44, 0.18);
}

.main-wrapper .vf-for-you-shell .vf-foryou-hero-card .btn.btn-primary,
.main-wrapper .vf-dashboard-shell .profdash-hero .btn.btn-primary,
.main-wrapper .vf-guide-page .vf-guide-intro .btn.btn-light,
.main-wrapper .vf-guide-page .vf-guide-intro .btn.btn-outline-light,
.main-wrapper .hc-shell .hc-hero-card .btn.btn-primary,
.main-wrapper .hc-shell .hc-hero-card .btn.btn-outline-light {
  border: 1px solid rgba(255, 255, 255, 0.26) !important;
  background: rgba(35, 67, 207, 0.92) !important;
  color: #ffffff !important;
  box-shadow: 0 12px 28px rgba(13, 30, 86, 0.24) !important;
}

.main-wrapper .vf-for-you-shell .vf-foryou-hero-card .btn.btn-primary:hover,
.main-wrapper .vf-dashboard-shell .profdash-hero .btn.btn-primary:hover,
.main-wrapper .vf-guide-page .vf-guide-intro .btn.btn-light:hover,
.main-wrapper .vf-guide-page .vf-guide-intro .btn.btn-outline-light:hover,
.main-wrapper .hc-shell .hc-hero-card .btn.btn-primary:hover,
.main-wrapper .hc-shell .hc-hero-card .btn.btn-outline-light:hover {
  background: rgba(20, 46, 172, 0.98) !important;
}

.main-wrapper .vf-for-you-shell .vf-foryou-hero-art span,
.main-wrapper .vf-dashboard-shell .profdash-hero-art span,
.main-wrapper .hc-shell .hc-hero-art span {
  position: absolute;
  display: block;
  pointer-events: none;
}

.main-wrapper .vf-for-you-shell .vf-foryou-hero-spark,
.main-wrapper .vf-dashboard-shell .profdash-hero-spark,
.main-wrapper .hc-shell .hc-hero-spark {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.78);
}

.main-wrapper .vf-for-you-shell .vf-foryou-hero-spark-one,
.main-wrapper .vf-dashboard-shell .profdash-hero-spark-one,
.main-wrapper .hc-shell .hc-hero-spark-one {
  top: 34px;
  right: 210px;
}

.main-wrapper .vf-for-you-shell .vf-foryou-hero-spark-two,
.main-wrapper .vf-dashboard-shell .profdash-hero-spark-two,
.main-wrapper .hc-shell .hc-hero-spark-two {
  right: 110px;
  bottom: 42px;
  width: 18px;
  height: 18px;
  opacity: 0.46;
}

.main-wrapper .vf-for-you-shell .vf-foryou-hero-note,
.main-wrapper .vf-for-you-shell .vf-foryou-hero-heart,
.main-wrapper .vf-dashboard-shell .profdash-hero-panel,
.main-wrapper .vf-dashboard-shell .profdash-hero-orbit,
.main-wrapper .hc-shell .hc-hero-panel,
.main-wrapper .hc-shell .hc-hero-orbit {
  right: 44px;
  bottom: 34px;
  width: 132px;
  height: 92px;
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.16);
  border: 1px solid rgba(255, 255, 255, 0.24);
  backdrop-filter: blur(10px);
}

.main-wrapper .vf-for-you-shell .vf-foryou-hero-heart,
.main-wrapper .vf-dashboard-shell .profdash-hero-orbit,
.main-wrapper .hc-shell .hc-hero-orbit {
  right: 136px;
  bottom: 96px;
  width: 70px;
  height: 70px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.11);
}

.main-wrapper .vf-dashboard-shell .profdash-hero-kpis {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  max-width: 720px;
  margin-top: 22px;
}

.main-wrapper .vf-dashboard-shell .profdash-hero-kpi {
  padding: 14px;
  border: 1px solid rgba(255, 255, 255, 0.24);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.13);
  color: #ffffff;
}

.main-wrapper .vf-dashboard-shell .profdash-hero-kpi .value {
  font-size: 1.3rem;
  font-weight: 800;
  line-height: 1;
}

.main-wrapper .vf-dashboard-shell .profdash-hero-kpi .label {
  margin-top: 5px;
  color: rgba(255, 255, 255, 0.82);
  font-size: 12px;
}

.main-wrapper .vf-for-you-shell .vf-foryou-stat-body,
.main-wrapper .vf-dashboard-shell .profdash-stat-body {
  display: flex;
  align-items: center;
  gap: 14px;
}

.main-wrapper .vf-dashboard-shell .profdash-card {
  height: 100%;
}

.main-wrapper .vf-dashboard-shell .profdash-stat-body {
  min-height: 122px;
  align-items: center;
  padding: 18px !important;
}

.main-wrapper .vf-dashboard-shell .profdash-stat-body > div:last-child {
  min-width: 0;
}

.main-wrapper .vf-dashboard-shell .profdash-label,
.main-wrapper .vf-dashboard-shell .profdash-value,
.main-wrapper .vf-dashboard-shell .profdash-change {
  display: block;
  min-width: 0;
}

.main-wrapper .vf-dashboard-shell .profdash-label {
  min-height: 16px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.main-wrapper .vf-dashboard-shell .profdash-value {
  min-height: 30px;
}

.main-wrapper .vf-dashboard-shell .profdash-change {
  display: -webkit-box;
  min-height: 34px;
  overflow: hidden;
  line-height: 1.25;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.main-wrapper .vf-for-you-shell .vf-foryou-stat-icon,
.main-wrapper .vf-dashboard-shell .profdash-stat-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 14px;
  background: rgba(76, 111, 255, 0.12);
  color: var(--vf-accent, #4c6fff);
}

.main-wrapper .vf-for-you-shell .vf-foryou-rec-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.main-wrapper .vf-for-you-shell .vf-foryou-rec-card {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  padding: 14px;
  border: 1px solid var(--vf-border, rgba(148, 163, 184, 0.24));
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.72);
}

.main-wrapper .vf-for-you-shell .vf-foryou-rec-avatar img,
.main-wrapper .vf-for-you-shell .vf-foryou-rec-avatar .profile-avatar {
  width: 58px;
  height: 58px;
  border-radius: 16px;
  object-fit: cover;
}

.main-wrapper .vf-for-you-shell .vf-foryou-rec-name,
.main-wrapper .vf-for-you-shell .vf-foryou-post-title {
  color: #0b6880;
  font-weight: 800;
}

.main-wrapper .vf-for-you-shell .vf-foryou-rec-handle,
.main-wrapper .vf-for-you-shell .vf-foryou-rec-meta {
  color: #64748b;
  font-size: 12px;
}

.main-wrapper .vf-for-you-shell .vf-foryou-post-list {
  display: grid;
  gap: 14px;
}

.main-wrapper .vf-for-you-shell .vf-foryou-post-row {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid rgba(148, 163, 184, 0.22) !important;
  border-radius: 18px !important;
  background: #ffffff !important;
  box-shadow: 0 14px 30px rgba(15, 23, 42, 0.08) !important;
  transform: none !important;
}

.main-wrapper .vf-for-you-shell .vf-foryou-post-row::before {
  height: 0 !important;
  background: transparent !important;
}

.main-wrapper .vf-for-you-shell .vf-foryou-post-thumb {
  position: relative;
  display: block;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: #eef4ff;
}

.main-wrapper .vf-for-you-shell .vf-foryou-post-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.main-wrapper .vf-for-you-shell .vf-foryou-post-thumb::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 38%;
  background: linear-gradient(180deg, transparent, rgba(15, 23, 42, 0.22));
  pointer-events: none;
}

.main-wrapper .vf-for-you-shell .vf-foryou-post-main {
  display: grid;
  gap: 8px;
  padding: 15px 18px 16px;
}

.main-wrapper .vf-for-you-shell .vf-foryou-post-title {
  display: -webkit-box;
  overflow: hidden;
  margin: 0;
  color: #0f5f78 !important;
  font-size: 1.02rem;
  font-weight: 850;
  line-height: 1.22;
  text-decoration: none;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.main-wrapper .vf-for-you-shell .vf-foryou-post-title:hover {
  color: var(--vf-accent-strong, #2f6fe4) !important;
}

.main-wrapper .vf-for-you-shell .vf-foryou-post-excerpt {
  display: -webkit-box;
  overflow: hidden;
  max-width: 38rem;
  color: #485a72;
  font-size: 0.93rem;
  line-height: 1.38;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.main-wrapper .vf-for-you-shell .vf-foryou-post-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  min-width: 0;
  color: #748196;
  font-size: 0.76rem;
  line-height: 1.25;
}

.main-wrapper .vf-for-you-shell .vf-foryou-post-meta a {
  max-width: 170px;
  overflow: hidden;
  color: #0b6880;
  font-weight: 800;
  text-decoration: none;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.main-wrapper .vf-for-you-shell .vf-foryou-post-meta span:last-child {
  overflow: hidden;
  min-width: 0;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.main-wrapper .vf-for-you-shell .vf-foryou-post-stats {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 2px;
  padding-top: 11px;
  border-top: 1px solid rgba(148, 163, 184, 0.18);
}

.main-wrapper .vf-for-you-shell .vf-foryou-post-stats span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 28px;
  padding: 5px 10px;
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, 0.2);
  background: rgba(248, 251, 255, 0.92);
  color: #52627a;
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1;
}

.main-wrapper .vf-for-you-shell .vf-foryou-post-stats i {
  color: var(--vf-accent, #4c6fff);
  font-size: 0.82rem;
}

.main-wrapper .vf-for-you-shell .vf-foryou-post-stats strong {
  font-weight: 850;
}

.main-wrapper .vf-for-you-shell .vf-foryou-post-stats em {
  color: #7a879a;
  font-size: 0.72rem;
  font-style: normal;
  font-weight: 750;
}

.main-wrapper .vf-for-you-shell .vf-foryou-section-card,
.main-wrapper .vf-for-you-shell .vf-foryou-onboarding-card,
.main-wrapper .vf-for-you-shell .vf-foryou-stat-card {
  overflow: hidden;
  border-radius: 18px !important;
}

.main-wrapper .vf-for-you-shell .vf-foryou-section-card.h-100,
.main-wrapper .vf-for-you-shell .vf-foryou-games-card.h-100 {
  height: auto !important;
}

.main-wrapper .vf-for-you-shell .vf-foryou-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 58px;
  padding: 16px 18px !important;
}

.main-wrapper .vf-for-you-shell .vf-foryou-section-head strong {
  min-width: 0;
  color: #22314a;
  font-size: 0.98rem;
  font-weight: 850;
  line-height: 1.2;
}

.main-wrapper .vf-for-you-shell .vf-foryou-section-head a,
.main-wrapper .vf-for-you-shell .vf-foryou-section-footer a {
  flex: 0 0 auto;
  color: var(--vf-accent-strong, #2f6fe4);
  font-size: 0.72rem;
  font-weight: 850;
  letter-spacing: 0.03em;
  text-decoration: none;
  text-transform: uppercase;
}

.main-wrapper .vf-for-you-shell .vf-foryou-section-card .card-body {
  padding: 18px !important;
}

.main-wrapper .vf-for-you-shell .vf-foryou-section-footer {
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid rgba(148, 163, 184, 0.18);
}

.main-wrapper .vf-for-you-shell .vf-foryou-rec-grid {
  grid-template-columns: 1fr;
  gap: 10px;
}

.main-wrapper .vf-for-you-shell .vf-foryou-rec-card {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr) auto;
  grid-template-areas:
    "avatar name action"
    "avatar handle action"
    "avatar meta action";
  align-items: center;
  gap: 3px 12px;
  min-height: 82px;
  padding: 12px;
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(248, 251, 255, 0.92));
}

.main-wrapper .vf-for-you-shell .vf-foryou-rec-avatar {
  grid-area: avatar;
}

.main-wrapper .vf-for-you-shell .vf-foryou-rec-avatar img,
.main-wrapper .vf-for-you-shell .vf-foryou-rec-avatar .profile-avatar {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  border: 2px solid #ffffff;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.12);
}

.main-wrapper .vf-for-you-shell .vf-foryou-rec-name {
  grid-area: name;
  overflow: hidden;
  color: #25344d !important;
  line-height: 1.2;
  text-decoration: none;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.main-wrapper .vf-for-you-shell .vf-foryou-rec-handle {
  grid-area: handle;
  overflow: hidden;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.main-wrapper .vf-for-you-shell .vf-foryou-rec-meta {
  grid-area: meta;
  line-height: 1.2;
}

.main-wrapper .vf-for-you-shell .vf-foryou-rec-btn {
  grid-area: action;
  align-self: center;
  min-width: 76px;
  border-radius: 999px !important;
  font-size: 0.72rem;
  font-weight: 850;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.main-wrapper .vf-for-you-shell .vf-foryou-checklist-item {
  border-color: rgba(148, 163, 184, 0.22) !important;
  border-radius: 14px !important;
  background: rgba(248, 251, 255, 0.82);
}

.main-wrapper .vf-for-you-shell .vf-foryou-reel-grid,
.main-wrapper .vf-for-you-shell .vf-foryou-game-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.main-wrapper .vf-for-you-shell .vf-foryou-reel-card,
.main-wrapper .vf-for-you-shell .vf-foryou-game-card {
  position: relative;
  display: grid;
  gap: 7px;
  min-width: 0;
  overflow: hidden;
  padding: 10px;
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-radius: 16px;
  background: #ffffff;
  color: #25344d;
  text-decoration: none;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.07);
}

.main-wrapper .vf-for-you-shell .vf-foryou-reel-thumb,
.main-wrapper .vf-for-you-shell .vf-foryou-game-thumb {
  position: relative;
  display: block;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(76, 111, 255, 0.14), rgba(34, 193, 238, 0.16));
}

.main-wrapper .vf-for-you-shell .vf-foryou-game-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.main-wrapper .vf-for-you-shell .vf-foryou-reel-play,
.main-wrapper .vf-for-you-shell .vf-foryou-game-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.main-wrapper .vf-for-you-shell .vf-foryou-reel-play {
  position: absolute;
  inset: 50% auto auto 50%;
  width: 42px;
  height: 42px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  color: var(--vf-accent-strong, #2f6fe4);
  transform: translate(-50%, -50%);
}

.main-wrapper .vf-for-you-shell .vf-foryou-reel-duration {
  position: absolute;
  top: 16px;
  right: 16px;
  padding: 4px 7px;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.72);
  color: #ffffff;
  font-size: 0.68rem;
  font-weight: 850;
}

.main-wrapper .vf-for-you-shell .vf-foryou-reel-title,
.main-wrapper .vf-for-you-shell .vf-foryou-game-title,
.main-wrapper .vf-for-you-shell .vf-foryou-course-title,
.main-wrapper .vf-for-you-shell .vf-foryou-arcade-title {
  display: block;
  overflow: hidden;
  color: #22314a;
  font-weight: 850;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.main-wrapper .vf-for-you-shell .vf-foryou-reel-meta,
.main-wrapper .vf-for-you-shell .vf-foryou-game-meta,
.main-wrapper .vf-for-you-shell .vf-foryou-course-meta,
.main-wrapper .vf-for-you-shell .vf-foryou-arcade-meta {
  display: block;
  overflow: hidden;
  color: #64748b;
  font-size: 0.78rem;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.main-wrapper .vf-for-you-shell .vf-foryou-game-btn,
.main-wrapper .vf-for-you-shell .vf-foryou-arcade-btn,
.main-wrapper .vf-for-you-shell .vf-foryou-course-badge {
  width: fit-content;
  min-height: 28px;
  padding: 0 11px;
  border-radius: 999px;
  background: rgba(76, 111, 255, 0.1);
  color: var(--vf-accent-strong, #2f6fe4);
  font-size: 0.7rem;
  font-weight: 850;
  letter-spacing: 0.03em;
  line-height: 28px;
  text-transform: uppercase;
}

.main-wrapper .vf-for-you-shell .vf-foryou-course-list,
.main-wrapper .vf-for-you-shell .vf-foryou-arcade-list {
  display: grid;
  gap: 10px;
}

.main-wrapper .vf-for-you-shell .vf-foryou-course-row,
.main-wrapper .vf-for-you-shell .vf-foryou-arcade-row {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  min-width: 0;
  padding: 12px;
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-radius: 14px;
  background: rgba(248, 251, 255, 0.78);
  color: #25344d;
  text-decoration: none;
}

.main-wrapper .vf-for-you-shell .vf-foryou-course-icon,
.main-wrapper .vf-for-you-shell .vf-foryou-arcade-thumb {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  overflow: hidden;
  border-radius: 14px;
  background: rgba(76, 111, 255, 0.1);
  color: var(--vf-accent-strong, #2f6fe4);
}

.main-wrapper .vf-for-you-shell .vf-foryou-course-icon img,
.main-wrapper .vf-for-you-shell .vf-foryou-arcade-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.main-wrapper .vf-for-you-shell .vf-foryou-course-main,
.main-wrapper .vf-for-you-shell .vf-foryou-arcade-main {
  min-width: 0;
}

@media (max-width: 991.98px) {
  .main-wrapper .vf-for-you-shell .vf-foryou-hero-card,
  .main-wrapper .vf-for-you-shell .vf-foryou-hero-body {
    min-height: 0;
  }

  .main-wrapper .vf-for-you-shell .vf-foryou-hero-body {
    padding: 22px !important;
  }

  .main-wrapper .vf-for-you-shell .vf-foryou-hero-art {
    display: none;
  }

  .main-wrapper .vf-for-you-shell .vf-foryou-hero-card .btn.btn-primary {
    width: 100%;
    justify-content: center;
  }

  .main-wrapper .vf-for-you-shell .vf-foryou-stat-body {
    min-height: 96px;
  }
}

@media (max-width: 575.98px) {
  .main-wrapper .vf-for-you-shell {
    margin-top: 12px !important;
  }

  .main-wrapper .vf-for-you-shell .vf-foryou-hero-title {
    font-size: 2rem !important;
  }

  .main-wrapper .vf-for-you-shell .vf-foryou-section-head {
    align-items: flex-start;
    min-height: 0;
    padding: 14px 16px !important;
  }

  .main-wrapper .vf-for-you-shell .vf-foryou-section-card .card-body {
    padding: 16px !important;
  }

  .main-wrapper .vf-for-you-shell .vf-foryou-rec-card {
    grid-template-columns: 52px minmax(0, 1fr);
    grid-template-areas:
      "avatar name"
      "avatar handle"
      "avatar meta"
      "action action";
  }

  .main-wrapper .vf-for-you-shell .vf-foryou-rec-btn {
    width: 100%;
    margin-top: 8px;
  }

  .main-wrapper .vf-for-you-shell .vf-foryou-reel-grid,
  .main-wrapper .vf-for-you-shell .vf-foryou-game-grid {
    grid-template-columns: 1fr;
  }

  .main-wrapper .vf-for-you-shell .vf-foryou-course-row,
  .main-wrapper .vf-for-you-shell .vf-foryou-arcade-row {
    grid-template-columns: 46px minmax(0, 1fr);
  }

  .main-wrapper .vf-for-you-shell .vf-foryou-course-badge,
  .main-wrapper .vf-for-you-shell .vf-foryou-arcade-btn {
    grid-column: 2;
  }
}

body:not(.night-mode) .main-wrapper .btn.btn-primary {
  border-color: transparent !important;
  background: linear-gradient(135deg, var(--vf-accent), var(--vf-accent-strong)) !important;
  color: #ffffff !important;
  box-shadow: 0 10px 20px rgba(76, 111, 255, 0.28) !important;
}

body:not(.night-mode) .main-wrapper .btn.btn-light {
  border: 1px solid var(--vf-border) !important;
  background: var(--vf-surface) !important;
  color: var(--body-color) !important;
  box-shadow: none !important;
}

body:not(.night-mode) .main-wrapper .form-control,
body:not(.night-mode) .main-wrapper .form-select,
body:not(.night-mode) .composer-launcher {
  border-color: var(--vf-border-strong) !important;
  background: var(--vf-surface) !important;
  color: var(--body-color) !important;
  box-shadow: var(--vf-shadow-sm) !important;
}

body:not(.night-mode) .composer-launcher-input {
  color: #475569 !important;
}

body:not(.night-mode) .main-wrapper .dropdown-menu {
  border-color: var(--vf-border) !important;
}

body:not(.night-mode) .main-wrapper .dropdown-menu .dropdown-item:hover,
body:not(.night-mode) .main-wrapper .dropdown-menu .dropdown-item:focus {
  background: var(--vf-accent-soft) !important;
  color: var(--vf-accent-strong) !important;
}

body:not(.night-mode) .main-wrapper .nav-tabs .nav-link.active,
body:not(.night-mode) .main-wrapper .nav-pills .nav-link.active {
  background: linear-gradient(135deg, var(--vf-accent), var(--vf-accent-strong)) !important;
  border-color: transparent !important;
  color: #ffffff !important;
}

.marketplace-tabs {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  gap: 8px;
  padding: 10px 12px;
}

.marketplace-tabs > ul {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0 2px;
  min-width: 0;
}

.marketplace-tabs > ul > li {
  float: none;
}

.marketplace-tabs > ul > li > a {
  display: inline-flex;
  align-items: center;
  padding: 10px 8px;
  white-space: nowrap;
}

.marketplace-tabs > ul > li > a .main-icon {
  margin-right: 6px !important;
}

.marketplace-tabs-actions {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: flex-end;
  margin-top: 0 !important;
}

.market-settings-tabs .btn-group {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.market-settings-tabs .btn-group > .btn,
.market-settings-tabs .btn-group > .btn-group > .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  margin: 0 !important;
  border-radius: 10px !important;
  line-height: 1;
  white-space: nowrap;
}

.market-settings-tabs .btn-group > .btn + .btn {
  margin-left: 0 !important;
}

.product-actions {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.product-actions-primary {
  width: 100%;
  justify-content: center;
}

.product-actions-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.product-actions-grid .btn {
  width: 100%;
  min-width: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  white-space: nowrap;
}

.product-actions-grid .btn .fa {
  margin-right: 6px;
}

@media (max-width: 1439.98px) {
  .marketplace-tabs-actions {
    justify-content: flex-start;
  }
}

@media (max-width: 767.98px) {
  .marketplace-tabs {
    padding: 10px 12px;
  }

  .marketplace-tabs > ul {
    gap: 2px 6px;
  }

  .marketplace-tabs > ul > li > a {
    padding: 9px 10px;
  }

  .marketplace-tabs-actions {
    justify-content: flex-start;
  }
}

@media (max-width: 991.98px) {
  .blogs-wrapper .js_blogs-stream > .col-md-4,
  .blogs-wrapper .js_blogs-stream > .col-sm-6,
  .blogs-wrapper .js_blogs-stream > .col-sm-12 {
    display: block !important;
  }
}

@media (min-width: 992px) {
  .main-wrapper .blogs-wrapper .js_blogs-stream > .col-lg-4 {
    flex: 0 0 33.333333% !important;
    max-width: 33.333333% !important;
  }
}

@media (max-width: 575.98px) {
  .blogs-wrapper .js_blogs-stream > [class*="col-"] {
    flex: 0 0 100%;
    max-width: 100%;
  }
}
.vf-newsfeed-shell .post .post-actions,
.js_posts_stream .post .post-actions,
.blog-wrapper .post-actions {
  position: relative;
  overflow: visible;
  z-index: 3;
}

.vf-newsfeed-shell .post,
.js_posts_stream .post,
.blog-wrapper .post {
  isolation: isolate;
  overflow: visible;
}

.vf-newsfeed-shell .post:focus-within,
.vf-newsfeed-shell .post:hover,
.js_posts_stream .post:focus-within,
.js_posts_stream .post:hover,
.blog-wrapper .post:focus-within,
.blog-wrapper .post:hover {
  z-index: 20;
}

.vf-newsfeed-shell .post .post-header,
.vf-newsfeed-shell .post .post-meta,
.js_posts_stream .post .post-header,
.js_posts_stream .post .post-meta,
.blog-wrapper .post .post-header,
.blog-wrapper .post .post-meta {
  position: relative;
  z-index: 4;
}

.vf-newsfeed-shell .post .post-actions .action-btn,
.js_posts_stream .post .post-actions .action-btn,
.blog-wrapper .post-actions .action-btn {
  position: relative;
  z-index: 4;
}

.vf-newsfeed-shell .post .post-actions .action-btn:hover,
.vf-newsfeed-shell .post .post-actions .action-btn:focus,
.vf-newsfeed-shell .post .post-actions .action-btn:focus-within,
.js_posts_stream .post .post-actions .action-btn:hover,
.js_posts_stream .post .post-actions .action-btn:focus,
.js_posts_stream .post .post-actions .action-btn:focus-within,
.blog-wrapper .post-actions .action-btn:hover,
.blog-wrapper .post-actions .action-btn:focus,
.blog-wrapper .post-actions .action-btn:focus-within {
  z-index: 30;
}

.vf-newsfeed-shell .post .post-actions .reactions-wrapper,
.js_posts_stream .post .post-actions .reactions-wrapper,
.blog-wrapper .post-actions .reactions-wrapper,
.comment-actions .reactions-wrapper {
  position: relative !important;
  overflow: visible !important;
  z-index: 31;
}

.vf-newsfeed-shell .post .post-actions .reactions-wrapper::before,
.js_posts_stream .post .post-actions .reactions-wrapper::before,
.blog-wrapper .post-actions .reactions-wrapper::before,
.comment-actions .reactions-wrapper::before {
  content: "";
  position: absolute;
  right: -84px;
  bottom: 100%;
  left: -84px;
  display: none;
  height: 14px;
}

.vf-newsfeed-shell .post .post-actions .reactions-wrapper:hover::before,
.js_posts_stream .post .post-actions .reactions-wrapper:hover::before,
.blog-wrapper .post-actions .reactions-wrapper:hover::before,
.comment-actions .reactions-wrapper:hover::before {
  display: block;
}

.comment-actions .reactions-container {
  z-index: 10000 !important;
  overflow: visible !important;
  pointer-events: auto !important;
}

.vf-newsfeed-shell .reactions-container,
.js_posts_stream .reactions-container,
.blog-wrapper .reactions-container {
  position: absolute !important;
  top: auto !important;
  right: auto !important;
  bottom: calc(100% + 12px) !important;
  left: 68% !important;
  transform: translateX(-50%) !important;
  display: none;
  flex-wrap: nowrap;
  width: max-content;
  max-width: none;
  height: 48px;
  padding: 0 8px;
  align-items: center;
  overflow: visible;
  z-index: 9999;
}

.vf-newsfeed-shell .post .post-actions .reactions-wrapper .reaction-btn,
.js_posts_stream .post .post-actions .reactions-wrapper .reaction-btn,
.blog-wrapper .post-actions .reactions-wrapper .reaction-btn {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.vf-newsfeed-shell .post .post-actions .reactions-wrapper .reaction-btn-name,
.js_posts_stream .post .post-actions .reactions-wrapper .reaction-btn-name,
.blog-wrapper .post-actions .reactions-wrapper .reaction-btn-name {
  margin-left: 0;
}

.vf-newsfeed-shell .reactions-container .reactions_item,
.js_posts_stream .reactions-container .reactions_item,
.blog-wrapper .reactions-container .reactions_item {
  position: relative;
  width: 48px;
  height: 48px;
  overflow: visible;
  animation: none !important;
  -webkit-animation: none !important;
  transform: none;
}

.vf-newsfeed-shell .reactions-container .reactions_item .emoji,
.js_posts_stream .reactions-container .reactions_item .emoji,
.blog-wrapper .reactions-container .reactions_item .emoji {
  position: absolute;
  top: 50%;
  right: auto;
  left: 50%;
  transform: translate(-50%, -50%) scale(0.325);
  transform-origin: center center;
}

.vf-newsfeed-shell .reactions-container .reactions_item:hover,
.js_posts_stream .reactions-container .reactions_item:hover,
.blog-wrapper .reactions-container .reactions_item:hover {
  transform: scale(1.18) translateY(-2px);
}

.vf-newsfeed-shell .comment-form textarea,
.js_posts_stream .comment-form textarea {
  padding-right: 182px !important;
}

.vf-newsfeed-shell .comment-form .x-form-tools,
.js_posts_stream .comment-form .x-form-tools {
  right: 12px;
  gap: 6px;
}

.vf-newsfeed-shell .comment-form .x-form-tools > li,
.js_posts_stream .comment-form .x-form-tools > li {
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: visible;
}

.vf-newsfeed-shell .comment-form .x-form-tools > li i,
.js_posts_stream .comment-form .x-form-tools > li i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: currentColor;
  line-height: 1;
}

.vf-newsfeed-shell .comment-form .x-form-tools-post,
.js_posts_stream .comment-form .x-form-tools-post {
  min-width: 24px;
  overflow: visible;
}

@media (max-width: 767.98px) {
  .main-wrapper .main-header {
    width: 100% !important;
    max-width: 100vw !important;
    overflow: visible !important;
  }

  .main-wrapper .main-header > .container,
  .main-wrapper .main-header > .container-fluid {
    width: 100% !important;
    max-width: 100% !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
  }

  .main-wrapper .main-header > .container > .row,
  .main-wrapper .main-header > .container-fluid > .row {
    align-items: center !important;
    min-height: 70px;
    width: 100% !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
  }

  .main-wrapper .main-header > .container > .row > [class*="col-"],
  .main-wrapper .main-header > .container-fluid > .row > [class*="col-"] {
    display: flex !important;
    align-items: center !important;
    min-height: 70px;
  }

  .main-wrapper .main-header > .container > .row > [class*="col-"]:first-child,
  .main-wrapper .main-header > .container-fluid > .row > [class*="col-"]:first-child {
    flex: 0 0 calc(100% - 168px) !important;
    max-width: calc(100% - 168px) !important;
    justify-content: flex-start !important;
    left: 0 !important;
    right: auto !important;
  }

  .main-wrapper .main-header > .container > .row > [class*="col-"]:last-child,
  .main-wrapper .main-header > .container-fluid > .row > [class*="col-"]:last-child {
    flex: 0 0 168px !important;
    max-width: 168px !important;
    justify-content: flex-end !important;
  }

  .main-wrapper .main-header .logo-wrapper {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    height: 70px !important;
    width: 100%;
    padding-left: 16px !important;
    padding-right: 8px !important;
    overflow: hidden !important;
  }

  .main-wrapper .main-header .logo,
  .main-wrapper .main-header .logo:hover {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100%;
    height: 70px;
    line-height: 1 !important;
    overflow: hidden !important;
  }

  .main-wrapper .main-header .logo img {
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    display: block !important;
    width: auto !important;
    max-width: min(100%, 176px) !important;
    max-height: 42px !important;
    object-fit: contain;
    object-position: left center;
  }

  html.app-standalone .main-wrapper .main-header {
    height: calc(70px + env(safe-area-inset-top, 0px)) !important;
    min-height: calc(70px + env(safe-area-inset-top, 0px)) !important;
    padding-top: env(safe-area-inset-top, 0px) !important;
  }

  html.app-standalone .main-wrapper .main-header > .container,
  html.app-standalone .main-wrapper .main-header > .container-fluid {
    height: 70px !important;
    min-height: 70px !important;
  }

  html.app-standalone .main-wrapper .main-header .logo-wrapper,
  html.app-standalone .main-wrapper .main-header .logo,
  html.app-standalone .main-wrapper .main-header .logo:hover,
  html.app-standalone .main-wrapper .main-header .navbar-wrapper > ul > li > a {
    height: 70px !important;
  }

  html.app-standalone .main-wrapper .main-header .logo,
  html.app-standalone .main-wrapper .main-header .logo:hover {
    transform: none !important;
  }

  html.app-standalone .main-wrapper .main-header .logo img {
    max-width: min(100%, 176px) !important;
    max-height: 42px !important;
    transform: none !important;
  }

  .main-wrapper .main-header .header-right,
  .main-wrapper .main-header .navbar-wrapper,
  .main-wrapper .main-header .navbar-wrapper > ul {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    width: 100%;
    min-width: 0;
    overflow: visible !important;
  }

  .main-wrapper .main-header .navbar-wrapper > ul {
    gap: 2px;
    margin: 0 !important;
    padding: 0 !important;
  }

  .main-wrapper .main-header .navbar-wrapper > ul > li {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto;
    height: 70px !important;
    margin: 0 !important;
    overflow: visible !important;
  }

  .main-wrapper .main-header .navbar-wrapper > ul > li.d-none,
  .main-wrapper .main-header .navbar-wrapper > ul > li.d-none.d-md-block,
  .main-wrapper .main-header .navbar-wrapper > ul > li.d-none.d-xxl-block {
    display: none !important;
  }

  .main-wrapper .main-header .navbar-wrapper > ul > li > a,
  .main-wrapper .main-header .navbar-wrapper > ul > li > .dropdown-toggle {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 999px !important;
    line-height: 1 !important;
    vertical-align: middle !important;
  }

  .main-wrapper .main-header .navbar-wrapper > ul > li > a .header-icon,
  .main-wrapper .main-header .navbar-wrapper > ul > li > .dropdown-toggle .header-icon {
    display: block !important;
    flex: 0 0 auto;
    line-height: 1 !important;
  }

  .main-wrapper .main-header .navbar-wrapper > ul > li > a:hover,
  .main-wrapper .main-header .navbar-wrapper > ul > li.dropdown.show > a,
  .main-wrapper .main-header .navbar-wrapper > ul > li > .dropdown-toggle:hover {
    background: rgba(255, 255, 255, 0.1) !important;
  }

  .main-wrapper .main-header .navbar-wrapper .counter {
    top: 3px !important;
    right: 2px !important;
    min-width: 16px !important;
    height: 16px !important;
    padding: 0 4px !important;
    font-size: 0.62rem !important;
    line-height: 16px !important;
  }

  .main-wrapper .posts-staging-btn,
  .main-wrapper .posts-staging-btn:hover,
  .main-wrapper .posts-staging-btn:focus,
  .main-wrapper .posts-staging-btn:active {
    position: sticky !important;
    top: 82px !important;
    left: auto !important;
    right: auto !important;
    width: fit-content;
    margin: 10px auto 14px !important;
    min-height: 38px;
    padding: 0 18px !important;
    border: 1px solid rgba(255, 255, 255, 0.26) !important;
    border-radius: 999px !important;
    background: linear-gradient(180deg, #4c6fff, #2f56f6) !important;
    box-shadow: 0 14px 30px rgba(47, 86, 246, 0.28) !important;
    font-size: 0.78rem !important;
    font-weight: 800 !important;
    line-height: 38px !important;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    animation: none !important;
    transition: none !important;
    transform: none !important;
    z-index: 95 !important;
  }

  html.app-standalone .main-wrapper .posts-staging-btn,
  html.app-standalone .main-wrapper .posts-staging-btn:hover,
  html.app-standalone .main-wrapper .posts-staging-btn:focus,
  html.app-standalone .main-wrapper .posts-staging-btn:active {
    top: calc(82px + env(safe-area-inset-top, 0px)) !important;
  }

  .admin-shell .admin-mobile-menu-head,
  .admin-shell .admin-mobile-menu-trigger {
    display: flex;
    align-items: center;
  }

  .admin-shell .admin-mobile-menu-head {
    position: sticky;
    top: 0;

    justify-content: space-between;
    min-height: 56px;
    padding: 0 16px;
    border-bottom: 1px solid rgba(148, 163, 184, 0.28);
    border-radius: 16px 16px 0 0;
    background: var(--vf-ui-surface, #ffffff);
  }

  .admin-shell .admin-mobile-menu-close {
    width: 40px;
    height: 40px;
    border: 0;
    border-radius: 50%;
    background: rgba(15, 23, 42, 0.08);
    color: inherit;
    font-size: 24px;
    line-height: 1;
  }

  .admin-shell .admin-mobile-menu-trigger {
    justify-content: flex-start;
    margin: 0 0 12px;
  }

  .admin-shell.sg-offcanvas {
    overflow: visible;
  }

  .admin-shell.sg-offcanvas .admin-sidebar {
    position: fixed !important;
    top: calc(70px + env(safe-area-inset-top, 0px));
    bottom: calc(64px + env(safe-area-inset-bottom, 0px));
    left: -100%;
    width: 100%;
    padding: 0 12px 16px !important;
    overflow-y: auto;
    overscroll-behavior: contain;
    z-index: 1040;
  }

  .admin-shell.sg-offcanvas.active .admin-sidebar {
    left: 0;
  }

  .admin-shell.sg-offcanvas.active .sg-offcanvas-mainbar {
    left: 100%;
  }

  body.night-mode .admin-shell .admin-mobile-menu-head {
    background: var(--card-dark-color);
    border-bottom-color: var(--card-dark-divider);
  }

  html,
  body {
    max-width: 100%;
    overflow-x: hidden;
  }

  .vf-newsfeed-shell {
    padding-right: 12px !important;
    padding-left: 12px !important;
  }

  .vf-newsfeed-shell > .row,
  .vf-newsfeed-shell .sg-offcanvas-mainbar > .row {
    --bs-gutter-x: 0;
  }

  .vf-newsfeed-shell .post,
  .js_posts_stream .post {
    border-radius: 18px !important;
    margin-bottom: 14px !important;
  }

  .vf-newsfeed-shell .post .post-body,
  .js_posts_stream .post .post-body {
    padding: 14px 12px 10px !important;
  }

  .vf-newsfeed-shell .post .post-header,
  .js_posts_stream .post .post-header {
    display: grid !important;
    grid-template-columns: 44px minmax(0, 1fr);
    align-items: center;
    column-gap: 10px;
    min-height: 50px;
    margin-bottom: 10px;
  }

  .vf-newsfeed-shell .post .post-avatar,
  .js_posts_stream .post .post-avatar {
    display: block !important;
    width: 44px !important;
    height: 44px !important;
    padding: 0 !important;
    overflow: hidden;
  }

  .vf-newsfeed-shell .post .post-avatar-picture,
  .js_posts_stream .post .post-avatar-picture {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 0 !important;
    border-radius: 50% !important;
    background-position: center center !important;
    background-size: cover !important;
  }

  .vf-newsfeed-shell .post .post-meta,
  .js_posts_stream .post .post-meta {
    position: relative;
    display: block !important;
    width: auto !important;
    min-width: 0;
    min-height: 44px;
    padding-right: 44px;
    line-height: 1.25 !important;
  }

  .vf-newsfeed-shell .post .post-meta > .d-inline-flex,
  .js_posts_stream .post .post-meta > .d-inline-flex {
    display: flex !important;
    max-width: 100%;
    min-width: 0;
    align-items: center !important;
    flex-wrap: nowrap !important;
    overflow: hidden;
    font-size: 0.88rem;
    line-height: 1.2;
  }

  .vf-newsfeed-shell .post .post-meta > .d-inline-flex a,
  .js_posts_stream .post .post-meta > .d-inline-flex a {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .vf-newsfeed-shell .post .post-title,
  .js_posts_stream .post .post-title {
    display: block;
    max-width: 100%;
    margin-top: 1px;
    overflow: hidden;
    color: #64748b;
    font-size: 0.78rem;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .vf-newsfeed-shell .post .post-time,
  .js_posts_stream .post .post-time {
    margin-top: 4px;
    overflow: hidden;
    color: #64748b;
    font-size: 0.72rem !important;
    line-height: 1.25 !important;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .vf-newsfeed-shell .post .post-meta > .float-end.dropdown,
  .js_posts_stream .post .post-meta > .float-end.dropdown {
    position: absolute !important;
    top: 1px;
    right: 0;
    float: none !important;
    width: 38px !important;
    height: 38px !important;
  }

  .vf-newsfeed-shell .post .post-menu-toggle,
  .js_posts_stream .post .post-menu-toggle {
    width: 38px !important;
    height: 38px !important;
    border: 1px solid rgba(219, 227, 240, 0.92) !important;
    border-radius: 999px !important;
    background: #f8fafc !important;
    color: #475569 !important;
  }

  .vf-newsfeed-shell .post .post-meta > .dropdown > .action-dropdown-menu,
  .vf-newsfeed-shell .post .post-meta > .dropdown > .dropdown-menu.action-dropdown-menu,
  .js_posts_stream .post .post-meta > .dropdown > .action-dropdown-menu,
  .js_posts_stream .post .post-meta > .dropdown > .dropdown-menu.action-dropdown-menu {
    right: 0 !important;
    left: auto !important;
    width: min(260px, calc(100vw - 32px)) !important;
    min-width: min(260px, calc(100vw - 32px)) !important;
    max-width: calc(100vw - 32px) !important;
    max-height: min(420px, calc(100dvh - 140px)) !important;
    padding: 6px !important;
    border-radius: 16px !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
  }

  .vf-newsfeed-shell .post .post-meta > .dropdown > .action-dropdown-menu .dropdown-item,
  .js_posts_stream .post .post-meta > .dropdown > .action-dropdown-menu .dropdown-item {
    padding: 9px 10px !important;
    border-radius: 12px !important;
  }

  .vf-newsfeed-shell .post .post-meta > .dropdown > .action-dropdown-menu .action,
  .js_posts_stream .post .post-meta > .dropdown > .action-dropdown-menu .action {
    gap: 9px;
    min-height: 24px;
  }

  .vf-newsfeed-shell .post .post-media,
  .js_posts_stream .post .post-media {
    margin-right: 0 !important;
    margin-left: 0 !important;
  }

  .vf-newsfeed-shell .post .post-body > .mt10.plr15,
  .js_posts_stream .post .post-body > .mt10.plr15 {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }

  .vf-newsfeed-shell .post .post-media-image,
  .js_posts_stream .post .post-media-image {
    border-radius: 16px !important;
    overflow: hidden;
  }

  .vf-newsfeed-shell .post .post-media-image .source,
  .js_posts_stream .post .post-media-image .source {
    bottom: 8px;
    left: 8px;
    max-width: calc(100% - 16px);
    padding: 6px 9px;
    overflow: hidden;
    border-radius: 10px;
    font-size: 0.68rem !important;
    line-height: 1.1 !important;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .vf-newsfeed-shell .post .post-media-meta,
  .js_posts_stream .post .post-media-meta {
    padding: 11px 14px 13px !important;
  }

  .vf-newsfeed-shell .post .post-media-meta .title,
  .js_posts_stream .post .post-media-meta .title {
    display: -webkit-box !important;
    overflow: hidden !important;
    color: #0f5f76;
    font-size: 1rem !important;
    line-height: 1.28 !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  .vf-newsfeed-shell .post .post-media-meta .text,
  .js_posts_stream .post .post-media-meta .text {
    display: -webkit-box !important;
    max-height: none !important;
    overflow: hidden !important;
    color: #253247;
    font-size: 0.9rem !important;
    line-height: 1.42 !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  .vf-newsfeed-shell .post .post-text,
  .js_posts_stream .post .post-text {
    font-size: 0.95rem !important;
    line-height: 1.45 !important;
  }

  .vf-newsfeed-shell .post .post-stats,
  .js_posts_stream .post .post-stats {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    flex-wrap: nowrap !important;
    margin: 8px 0 6px !important;
    padding: 8px 8px !important;
    border-top: 1px solid rgba(226, 232, 240, 0.86);
    overflow: hidden;
  }

  .vf-newsfeed-shell .post .post-stats .float-start,
  .js_posts_stream .post .post-stats .float-start {
    flex: 0 0 auto;
    margin-right: 0 !important;
  }

  .vf-newsfeed-shell .post .post-stats .float-end,
  .js_posts_stream .post .post-stats .float-end {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    flex: 1 1 auto;
    gap: 3px !important;
    min-width: 0;
  }

  .vf-newsfeed-shell .post .post-stats .pointer,
  .vf-newsfeed-shell .post .post-stats .text-link,
  .js_posts_stream .post .post-stats .pointer,
  .js_posts_stream .post .post-stats .text-link {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-width: 0;
    margin-left: 0 !important;
    gap: 3px;
    font-size: 0.72rem !important;
    line-height: 1.2 !important;
    letter-spacing: -0.02em;
    white-space: nowrap;
    color: #64748b !important;
  }

  .vf-newsfeed-shell .post .post-stats .pointer i,
  .vf-newsfeed-shell .post .post-stats .text-link i,
  .js_posts_stream .post .post-stats .pointer i,
  .js_posts_stream .post .post-stats .text-link i {
    margin-right: 0 !important;
    font-size: 0.86rem !important;
    color: #64748b !important;
  }

  .vf-newsfeed-shell .post .post-actions,
  .js_posts_stream .post .post-actions {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
    margin-top: 0 !important;
    padding: 0 8px 12px !important;
  }

  .vf-newsfeed-shell .post .post-actions .action-btn,
  .js_posts_stream .post .post-actions .action-btn {
    flex: 1 1 0 !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    min-height: 42px !important;
    padding-right: 8px !important;
    padding-left: 8px !important;
    border: 1px solid rgba(219, 227, 240, 0.92) !important;
    border-radius: 999px !important;
    background: #f8fbff !important;
    justify-content: center !important;
  }

  .vf-newsfeed-shell .post .post-actions .action-btn i,
  .vf-newsfeed-shell .post .post-actions .action-btn svg,
  .vf-newsfeed-shell .post .post-actions .action-btn .main-icon,
  .js_posts_stream .post .post-actions .action-btn i,
  .js_posts_stream .post .post-actions .action-btn svg,
  .js_posts_stream .post .post-actions .action-btn .main-icon {
    color: #3488ff !important;
    fill: #3488ff !important;
  }

  .vf-newsfeed-shell .post .post-actions .reaction-btn,
  .js_posts_stream .post .post-actions .reaction-btn {
    width: 100%;
    min-height: 40px;
    justify-content: center;
  }

  .vf-newsfeed-shell .reactions-container,
  .js_posts_stream .reactions-container,
  .blog-wrapper .reactions-container {
    left: 0 !important;
    bottom: calc(100% + 16px) !important;
    display: none;
    align-items: center !important;
    flex-wrap: nowrap !important;
    width: max-content !important;
    max-width: calc(100vw - 28px) !important;
    height: 58px !important;
    min-height: 58px !important;
    padding: 5px 8px !important;
    white-space: nowrap !important;
    overflow: visible !important;
    transform: none !important;
  }

  .vf-newsfeed-shell .reactions-container .reactions_item,
  .js_posts_stream .reactions-container .reactions_item,
  .blog-wrapper .reactions-container .reactions_item {
    width: 48px !important;
    height: 52px !important;
    overflow: visible !important;
  }

  .vf-newsfeed-shell .reactions-container .reactions_item .emoji,
  .js_posts_stream .reactions-container .reactions_item .emoji,
  .blog-wrapper .reactions-container .reactions_item .emoji {
    top: 50% !important;
  }

  .vf-share-slideout.js-vf-share-slideout,
  #vf-vibeguide-assistant.vf-assistant-mobile-tab,
  #vf-vibeguide-assistant.vf-assistant-left-tab {
    display: none !important;
  }
}

@media (max-width: 575px) {
  .logo-wrapper .logo img {
    left: auto !important;
    right: auto;
  }

  .main-wrapper .main-header .container .row .col-7 .logo-wrapper .logo img {
    position: static !important;
  }
}

#modal.js_modal-publisher .publisher-overlay {
  display: none !important;
}

#modal.js_modal-publisher .modal-content {
  height: auto !important;
  min-height: 0 !important;
}

#modal.js_modal-publisher .modal-body,
#modal.js_modal-publisher .js_modal-publisher-body {
  padding: 0 !important;
}

#modal.js_modal-publisher .publisher[data-modal-mode="true"] {
  padding-top: 4px !important;
}

#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message {
  margin-bottom: 4px !important;
  padding-right: 58px !important;
}

#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message .colored-text-wrapper,
#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message textarea,
#modal.js_modal-publisher .publisher[data-modal-mode="true"] .js_post-editor-quill-wrap,
#modal.js_modal-publisher .publisher[data-modal-mode="true"] .js_post-editor-quill-wrap .ql-editor {
  background: #ffffff !important;
  color: #172033 !important;
  caret-color: #172033 !important;
}

#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message textarea::placeholder,
#modal.js_modal-publisher .publisher[data-modal-mode="true"] .js_post-editor-quill-wrap .ql-editor.ql-blank::before {
  color: #6b7280 !important;
  opacity: 1 !important;
}

body.night-mode #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message .colored-text-wrapper,
body.night-mode #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message textarea,
body.night-mode #modal.js_modal-publisher .publisher[data-modal-mode="true"] .js_post-editor-quill-wrap,
body.night-mode #modal.js_modal-publisher .publisher[data-modal-mode="true"] .js_post-editor-quill-wrap .ql-editor {
  background: var(--card-dark-input, #111827) !important;
  color: var(--card-dark-input-color, #f4f6f8) !important;
  caret-color: var(--card-dark-input-color, #f4f6f8) !important;
}

body.night-mode #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message textarea::placeholder,
body.night-mode #modal.js_modal-publisher .publisher[data-modal-mode="true"] .js_post-editor-quill-wrap .ql-editor.ql-blank::before {
  color: #aeb9c7 !important;
}

#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-emojis {
  position: relative !important;
  right: auto !important;
  bottom: auto !important;
  z-index: 70 !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: flex-end !important;
  width: calc(100% - 28px) !important;
  margin: 0 14px 8px !important;
}

#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-emojis .position-relative {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  width: 100% !important;
}

#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-emojis .js_emoji-menu-toggle {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 34px !important;
  height: 34px !important;
  border-radius: 50% !important;
  color: #55616f !important;
  cursor: pointer !important;
}

#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-emojis .js_emoji-menu-toggle:hover {
  background: rgba(47, 109, 255, 0.08) !important;
  color: #2f6dff !important;
}

#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-emojis .emoji-menu {
  position: static !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  top: auto !important;
  width: min(360px, 100%) !important;
  max-width: min(360px, 100%) !important;
  max-height: min(220px, 42vh) !important;
  overflow: hidden !important;
  margin: 8px 0 0 auto !important;
  padding: 10px !important;
  border-radius: 16px !important;
  box-shadow: 0 18px 42px rgba(15, 34, 65, 0.18) !important;
  z-index: 999999 !important;
}

#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-emojis .emoji-menu .js_scroller {
  max-height: 132px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-emojis .emoji-menu .tab-content {
  width: 100% !important;
  min-width: 0 !important;
}

#modal.js_modal-publisher .publisher-close,
#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-close {
  top: max(14px, env(safe-area-inset-top, 0px)) !important;
  right: 14px !important;
  left: auto !important;
}

#modal.js_modal-publisher .publisher-close .btn-close,
#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-close .btn-close {
  box-sizing: border-box;
  width: 38px !important;
  height: 38px !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 50%;
  background-position: center !important;
  background-size: 13px 13px !important;
}

#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-tools-quick {
  width: calc(100% - 28px) !important;
  margin: 0 14px 12px !important;
}

#modal.js_modal-publisher .publisher[data-modal-mode="true"].publisher-feelings-layer-open {
  padding-bottom: 330px !important;
}

#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-meta[data-meta="feelings"] {
  position: relative !important;
  z-index: 9000 !important;
  overflow: visible !important;
}

#modal.js_modal-publisher .publisher[data-modal-mode="true"] #feelings-menu,
#modal.js_modal-publisher .publisher[data-modal-mode="true"] #feelings-types {
  z-index: 9100 !important;
  pointer-events: auto !important;
}

.publisher.publisher-footer-menu-open,
.publisher.publisher-footer-menu-open .publisher-footer,
.publisher.publisher-footer-menu-open .publisher-footer-buttons {
  position: relative !important;
  overflow: visible !important;
  z-index: 2138 !important;
}

.publisher.publisher-footer-menu-open .publisher-footer .btn-group.show {
  position: relative !important;
  z-index: 2139 !important;
}

.publisher.publisher-footer-menu-open .publisher-footer .btn-group.show > .dropdown-menu,
.publisher.publisher-footer-menu-open .publisher-footer .btn-group > .dropdown-menu.show,
.publisher.publisher-footer-menu-open .publisher-footer .btn-group > .dropdown-menu[data-bs-popper] {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 2140 !important;
  max-height: min(360px, calc(100vh - 96px)) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  pointer-events: auto !important;
}

.js_autocomplete.autocomplete-menu-open,
.js_autocomplete-tags.autocomplete-menu-open,
.publisher.publisher-gif-menu-open {
  position: relative !important;
  overflow: visible !important;
  z-index: 2138 !important;
}

.js_autocomplete.autocomplete-menu-open > .dropdown-menu.auto-complete,
.js_autocomplete-tags.autocomplete-menu-open > .dropdown-menu.auto-complete,
.publisher.publisher-gif-menu-open .dropdown-menu.gif-search {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 2140 !important;
  max-height: min(360px, calc(100vh - 96px)) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  pointer-events: auto !important;
}

#modal.js_modal-publisher .publisher[data-modal-mode="true"] .js_post-editor-quill-wrap .ql-editor {
  min-height: 72px !important;
  padding: 16px 14px 10px !important;
}

.main-wrapper .post .js_comment-form:not(.vf-in-comment-modal) {
  display: none !important;
}

/* Comments use the focused composer modal on every viewport. Keeping a second
 * inline composer open on narrow screens caused its editor and tools to split. */
@media (max-width: 767.98px) {
  .main-wrapper .post .js_comment-form:not(.vf-in-comment-modal) {
    display: none !important;
  }
}

/* A save action is a post control, never a browser-default dark button. */
html body .main-wrapper .post .post-actions button.action-btn {
  border: 0 !important;
  background: transparent !important;
  color: #52657d !important;
  box-shadow: none !important;
}

html body .main-wrapper .post .post-actions button.action-btn:hover,
html body .main-wrapper .post .post-actions button.action-btn:focus-visible {
  background: #eff6ff !important;
  color: #173c8c !important;
}

html body .main-wrapper .post .post-actions button.action-btn.active,
html body .main-wrapper .post .post-actions button.action-btn.is-saved {
  background: rgba(47, 109, 255, 0.1) !important;
  color: #1d4ed8 !important;
}

@media (max-width: 767.98px) {
  .main-wrapper .post .js_comment-form {
    display: grid !important;
    grid-template-columns: 48px minmax(0, 1fr);
    align-items: flex-start;
    gap: 12px;
    padding: 18px 16px 20px !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 251, 255, 0.98));
    border-top: 1px solid rgba(148, 163, 184, 0.2);
  }

  .main-wrapper .post .js_comment-form .comment-avatar {
    width: 48px;
    margin: 0 !important;
  }

  .main-wrapper .post .js_comment-form .comment-avatar-picture {
    width: 48px !important;
    height: 48px !important;
    border-radius: 50% !important;
    border: 2px solid rgba(255, 255, 255, 0.96);
    box-shadow: 0 10px 22px rgba(15, 23, 42, 0.14);
  }

  .main-wrapper .post .js_comment-form .comment-data {
    min-width: 0;
    width: 100%;
  }

  .main-wrapper .post .comment-form {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    min-height: 64px;
    padding: 9px 10px 9px 16px !important;
    overflow: visible !important;
    border: 1px solid rgba(148, 163, 184, 0.22) !important;
    border-radius: 22px !important;
    background: #ffffff !important;
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.08) !important;
    transition: border-color 0.18s ease, box-shadow 0.18s ease;
  }

  .main-wrapper .post .comment-form:focus-within {
    border-color: rgba(63, 109, 246, 0.42) !important;
    box-shadow: 0 12px 28px rgba(63, 109, 246, 0.16) !important;
  }

  .main-wrapper .post .comment-form textarea,
  .vf-newsfeed-shell .comment-form textarea,
  .js_posts_stream .comment-form textarea {
    grid-column: 1;
    width: 100% !important;
    min-height: 44px !important;
    max-height: 160px !important;
    height: auto !important;
    padding: 10px 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #0f172a;
    font-size: 1rem !important;
    line-height: 1.45 !important;
    overflow-y: auto !important;
  }

  .main-wrapper .post .comment-form textarea::placeholder {
    color: rgba(71, 85, 105, 0.46);
  }

  .main-wrapper .post .comment-form .x-form-tools,
  .vf-newsfeed-shell .comment-form .x-form-tools,
  .js_posts_stream .comment-form .x-form-tools {
    position: static !important;
    grid-column: 2;
    display: inline-flex !important;
    align-items: center;
    justify-content: flex-end;
    gap: 7px;
    width: auto !important;
    min-width: 0;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  .main-wrapper .post .comment-form .x-form-tools > li,
  .vf-newsfeed-shell .comment-form .x-form-tools > li,
  .js_posts_stream .comment-form .x-form-tools > li {
    float: none !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex: 0 0 34px !important;
    width: 34px !important;
    min-width: 34px !important;
    height: 34px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 50% !important;
    color: #3f6df6 !important;
    background: transparent !important;
    overflow: visible !important;
  }

  .main-wrapper .post .comment-form .x-form-tools > li:hover,
  .main-wrapper .post .comment-form:focus-within .x-form-tools-post {
    background: rgba(63, 109, 246, 0.1) !important;
  }

  .main-wrapper .post .comment-form .x-form-tools > li i {
    margin: 0 !important;
    font-size: 1.2rem !important;
    line-height: 1 !important;
  }

  .main-wrapper .post .comment-voice-notes,
  .main-wrapper .post .comment-attachments {
    margin-top: 10px !important;
    border-radius: 18px !important;
    border-color: rgba(148, 163, 184, 0.2) !important;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.06);
  }

  body.night-mode .main-wrapper .post .js_comment-form {
    background: linear-gradient(180deg, rgba(20, 29, 43, 0.96), rgba(15, 23, 42, 0.96));
    border-top-color: rgba(148, 163, 184, 0.16);
  }

  body.night-mode .main-wrapper .post .comment-form {
    border-color: rgba(148, 163, 184, 0.2) !important;
    background: rgba(15, 23, 42, 0.92) !important;
    box-shadow: 0 10px 26px rgba(2, 6, 23, 0.34) !important;
  }

  body.night-mode .main-wrapper .post .comment-form textarea {
    color: #e5eef8;
  }

  body.night-mode .main-wrapper .post .comment-form textarea::placeholder {
    color: rgba(181, 197, 216, 0.55);
  }

  body.night-mode .main-wrapper .post .comment-form .x-form-tools > li:hover,
  body.night-mode .main-wrapper .post .comment-form:focus-within .x-form-tools-post {
    background: rgba(96, 165, 250, 0.16) !important;
  }
}

@media (max-width: 767.98px) {
  .main-wrapper .post .comment-data .vf-comment-publisher {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    border: 1px solid rgba(148, 163, 184, 0.22) !important;
    border-radius: 22px !important;
    background: #ffffff !important;
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.08) !important;
  }

  .main-wrapper .post .comment-data .vf-comment-publisher:focus-within {
    border-color: rgba(63, 109, 246, 0.42) !important;
    box-shadow: 0 12px 28px rgba(63, 109, 246, 0.16) !important;
  }

  .main-wrapper .post .vf-comment-publisher .publisher-message.no-avatar {
    min-height: 0 !important;
    padding: 12px 14px 4px !important;
    margin: 0 !important;
    overflow: visible !important;
  }

  .main-wrapper .post .vf-comment-publisher .colored-text-wrapper {
    display: block !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
  }

  .main-wrapper .post .vf-comment-publisher textarea.js_post-comment {
    width: 100% !important;
    min-height: 46px !important;
    height: 46px;
    max-height: 180px !important;
    margin: 0 !important;
    padding: 9px 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    font-size: 1rem !important;
    line-height: 1.45 !important;
  }

  .main-wrapper .post .vf-comment-publisher .js_post-editor-quill-wrap {
    width: 100% !important;
    margin: 0 !important;
    background: transparent !important;
  }

  .main-wrapper .post .vf-comment-publisher .js_post-editor-quill-wrap .ql-toolbar.ql-snow {
    padding: 0 0 8px !important;
    border: 0 !important;
    background: transparent !important;
  }

  .main-wrapper .post .vf-comment-publisher .js_post-editor-quill-wrap .ql-container.ql-snow {
    height: auto !important;
    min-height: 54px !important;
    border: 0 !important;
    background: transparent !important;
  }

  .main-wrapper .post .vf-comment-publisher .js_post-editor-quill-wrap .ql-editor {
    min-height: 54px !important;
    padding: 6px 0 8px !important;
    overflow-y: hidden !important;
  }

  .main-wrapper .post .vf-comment-publisher .publisher-slider {
    display: none !important;
    height: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  .main-wrapper .post .vf-comment-publisher.vf-comment-has-scraper .publisher-slider {
    display: block !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0 10px 10px !important;
    overflow: visible !important;
  }

  .main-wrapper .post .vf-comment-publisher.vf-comment-has-scraper .publisher-scraper {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
  }

  .main-wrapper .post .vf-comment-publisher .publisher-tools-quick {
    position: static !important;
    display: flex !important;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: nowrap !important;
    gap: 8px;
    width: 100% !important;
    margin: 0 !important;
    padding: 8px 10px 10px !important;
    border-top: 1px solid rgba(148, 163, 184, 0.16) !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .main-wrapper .post .vf-comment-publisher .publisher-tools-quick .publisher-quick-action {
    float: none !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex: 0 0 40px !important;
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 14px !important;
    color: #3f6df6 !important;
    background: rgba(63, 109, 246, 0.08) !important;
    overflow: visible !important;
  }

  .main-wrapper .post .vf-comment-publisher .publisher-tools-quick .publisher-quick-action:hover,
  .main-wrapper .post .vf-comment-publisher:focus-within .publisher-tools-quick .publisher-quick-action.js_post-comment {
    background: rgba(63, 109, 246, 0.16) !important;
  }

  body.night-mode .main-wrapper .post .comment-data .vf-comment-publisher {
    border-color: rgba(148, 163, 184, 0.2) !important;
    background: rgba(15, 23, 42, 0.92) !important;
    box-shadow: 0 10px 26px rgba(2, 6, 23, 0.34) !important;
  }

  body.night-mode .main-wrapper .post .vf-comment-publisher .publisher-tools-quick {
    border-top-color: rgba(148, 163, 184, 0.16) !important;
  }
}

#modal.js_modal-comment-publisher .modal-dialog {
  max-width: 860px;
}

#modal.js_modal-comment-publisher .modal-content {
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
  border-radius: 22px !important;
}

#modal.js_modal-comment-publisher .modal-body,
#modal.js_modal-comment-publisher .js_modal-comment-publisher-body {
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

#modal.js_modal-comment-publisher .js_comment-form {
  display: block !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

#modal.js_modal-comment-publisher .js_comment-form > .comment-avatar,
#modal.js_modal-comment-publisher .comment-avatar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

#modal.js_modal-comment-publisher .comment-data {
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

#modal.js_modal-comment-publisher .vf-comment-publisher {
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 22px !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

#modal.js_modal-comment-publisher .vf-comment-publisher .publisher-message.no-avatar {
  min-height: 0 !important;
  padding: 42px 18px 8px !important;
  margin: 0 !important;
  overflow: visible !important;
}

#modal.js_modal-comment-publisher .vf-comment-publisher .colored-text-wrapper {
  display: block !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
}

#modal.js_modal-comment-publisher .vf-comment-publisher textarea.js_post-comment {
  width: 100% !important;
  min-height: 92px !important;
  max-height: 420px !important;
  margin: 0 !important;
  padding: 12px 14px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  font-size: 1rem !important;
  line-height: 1.5 !important;
}

#modal.js_modal-comment-publisher .vf-comment-publisher .js_post-editor-quill-wrap {
  width: 100% !important;
  margin: 0 !important;
  background: transparent !important;
}

#modal.js_modal-comment-publisher .vf-comment-publisher .js_post-editor-quill-wrap .ql-toolbar.ql-snow {
  padding: 0 6px 10px !important;
  border: 0 !important;
  background: transparent !important;
}

#modal.js_modal-comment-publisher .vf-comment-publisher .js_post-editor-quill-wrap .ql-container.ql-snow {
  height: auto !important;
  min-height: 92px !important;
  border: 0 !important;
  background: transparent !important;
}

#modal.js_modal-comment-publisher .vf-comment-publisher .js_post-editor-quill-wrap .ql-editor {
  min-height: 92px !important;
  padding: 18px 14px 12px !important;
  overflow-y: hidden !important;
}

#modal.js_modal-comment-publisher .vf-comment-publisher .publisher-slider {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

#modal.js_modal-comment-publisher .vf-comment-publisher.vf-comment-has-scraper .publisher-slider {
  display: block !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 0 16px 12px !important;
  overflow: visible !important;
}

#modal.js_modal-comment-publisher .vf-comment-publisher.vf-comment-has-scraper .publisher-scraper {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
}

#modal.js_modal-comment-publisher .vf-comment-publisher .publisher-tools-quick {
  position: static !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: nowrap !important;
  gap: 10px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 12px 16px 16px !important;
  border-top: 1px solid rgba(148, 163, 184, 0.16) !important;
  background: transparent !important;
  box-shadow: none !important;
}

#modal.js_modal-comment-publisher .vf-comment-publisher .publisher-tools-quick .publisher-quick-action {
  float: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 52px !important;
  width: 52px !important;
  min-width: 52px !important;
  height: 52px !important;
  min-height: 52px !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 18px !important;
  color: #3f6df6 !important;
  background: rgba(63, 109, 246, 0.08) !important;
  overflow: visible !important;
}

#modal.js_modal-comment-publisher .vf-comment-publisher .publisher-tools-quick .publisher-quick-action:hover,
#modal.js_modal-comment-publisher .vf-comment-publisher .publisher-tools-quick .publisher-quick-action.js_post-comment {
  background: rgba(63, 109, 246, 0.16) !important;
}

#modal.js_modal-comment-publisher .comment-voice-notes,
#modal.js_modal-comment-publisher .comment-attachments {
  margin: 0 16px 16px !important;
}

body.night-mode #modal.js_modal-comment-publisher .vf-comment-publisher {
  background: #151b24 !important;
}

.main-wrapper .post .post-footer,
.main-wrapper .post .post-comments,
.main-wrapper .post .js_comment-form,
.main-wrapper .post .js_comment-form .comment-data,
.main-wrapper .post .vf-comment-publisher,
.main-wrapper .post .vf-comment-publisher .publisher-tools-quick,
.main-wrapper .post .vf-comment-publisher .publisher-quick-action,
#modal.js_modal-comment-publisher,
#modal.js_modal-comment-publisher .modal-dialog,
#modal.js_modal-comment-publisher .modal-content,
#modal.js_modal-comment-publisher .js_comment-form,
#modal.js_modal-comment-publisher .comment-data,
#modal.js_modal-comment-publisher .vf-comment-publisher,
#modal.js_modal-comment-publisher .vf-comment-publisher .publisher-tools-quick,
#modal.js_modal-comment-publisher .vf-comment-publisher .publisher-quick-action {
  overflow: visible !important;
}

.main-wrapper .post .vf-comment-publisher,
#modal.js_modal-comment-publisher .vf-comment-publisher {
  position: relative !important;
  z-index: 20 !important;
}

.main-wrapper .post .vf-comment-publisher .publisher-tools-quick,
#modal.js_modal-comment-publisher .vf-comment-publisher .publisher-tools-quick {
  position: relative !important;
  z-index: 25 !important;
}

.main-wrapper .post .vf-comment-publisher .publisher-quick-action,
#modal.js_modal-comment-publisher .vf-comment-publisher .publisher-quick-action {
  position: relative !important;
}

.main-wrapper .post .vf-comment-publisher .emoji-menu,
#modal.js_modal-comment-publisher .vf-comment-publisher .emoji-menu {
  z-index: 999999 !important;
  max-height: min(260px, 60vh);
  overflow: hidden !important;
}

.main-wrapper .post .vf-comment-publisher .emoji-menu .js_scroller,
#modal.js_modal-comment-publisher .vf-comment-publisher .emoji-menu .js_scroller {
  max-height: 180px !important;
  overflow-y: auto !important;
}

.emoji-menu.vf-detached-emoji-menu {
  position: fixed !important;
  right: auto !important;
  bottom: auto !important;
  max-width: calc(100vw - 16px) !important;
  z-index: 999999 !important;
  max-height: min(260px, 60vh);
  overflow: hidden !important;
  padding: 28px 10px 0 10px !important;
}

.emoji-menu.vf-detached-emoji-menu .tab-content {
  width: 100% !important;
  min-width: 0 !important;
}

.emoji-menu.vf-detached-emoji-menu .js_scroller {
  max-height: 180px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

.emoji-menu.vf-detached-emoji-menu .item {
  float: left;
}

    .emoji-menu.vf-detached-emoji-menu .vf-detached-emoji-close { /* lowered z-index to avoid covering search input */
    z-index: 1;
  position: absolute;
  top: 8px;
  right: 10px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(15, 23, 42, 0.06);
  color: #475569;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}

.emoji-menu.vf-detached-emoji-menu .vf-detached-emoji-close:hover {
  background: rgba(63, 109, 246, 0.14);
  color: #1f45d8;
}

@media (max-width: 575.98px) {
  #modal.js_modal-comment-publisher .modal-dialog {
    width: calc(100vw - 16px) !important;
    max-width: calc(100vw - 16px) !important;
    margin: 12px auto auto !important;
  }

  #modal.js_modal-comment-publisher .modal-content {
    max-height: none !important;
  }

  #modal.js_modal-comment-publisher .vf-comment-publisher .publisher-tools-quick {
    gap: 8px !important;
    padding: 10px 12px 14px !important;
  }

  #modal.js_modal-comment-publisher .vf-comment-publisher .publisher-tools-quick .publisher-quick-action {
    flex-basis: 48px !important;
    width: 48px !important;
    min-width: 48px !important;
    height: 48px !important;
    min-height: 48px !important;
  }
}

#external-link-modal {
  --vf-external-modal-width: min(520px, calc(100vw - 32px));
}

#external-link-modal .modal-dialog {
  width: var(--vf-external-modal-width) !important;
  max-width: var(--vf-external-modal-width) !important;
  min-height: 0 !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

#external-link-modal .modal-dialog.modal-dialog-centered {
  display: flex !important;
  align-items: center !important;
  min-height: calc(100dvh - 32px) !important;
}

#external-link-modal .modal-content {
  min-height: 0 !important;
  height: auto !important;
  max-height: calc(100dvh - 48px) !important;
  overflow: hidden !important;
  border-radius: 18px !important;
  background: #ffffff !important;
  box-shadow: 0 24px 64px rgba(15, 23, 42, 0.26) !important;
}

html.app-standalone #external-link-modal .modal-content,
html.app-standalone #external-link-modal .modal-dialog,
html.app-standalone #external-link-modal .modal-body,
html.app-standalone #external-link-modal .modal-footer {
  height: auto !important;
  min-height: 0 !important;
}

#external-link-modal .modal-header {
  position: static !important;
  width: auto !important;
  min-height: 0 !important;
  padding: 16px 18px !important;
  border-radius: 18px 18px 0 0 !important;
}

#external-link-modal .modal-title {
  font-size: 1.05rem !important;
  line-height: 1.25 !important;
  font-weight: 800 !important;
}

#external-link-modal .modal-body {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: 18px !important;
  overflow: visible !important;
  background: #ffffff !important;
  color: #1f2937 !important;
  font-size: 1rem !important;
  line-height: 1.45 !important;
}

#external-link-modal .modal-footer {
  position: static !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 10px !important;
  width: auto !important;
  padding: 14px 18px 18px !important;
  border-top: 1px solid rgba(148, 163, 184, 0.18) !important;
  background: #ffffff !important;
}

#external-link-modal .modal-footer .btn {
  min-width: 112px;
  border-radius: 999px !important;
  font-weight: 800 !important;
  text-transform: none !important;
}

body.night-mode #external-link-modal .modal-content,
body.night-mode #external-link-modal .modal-body,
body.night-mode #external-link-modal .modal-footer {
  background: #151b24 !important;
  color: #e5eef8 !important;
}

@media (max-width: 575.98px) {
  #external-link-modal .modal-dialog {
    display: flex !important;
    align-items: center !important;
    min-height: calc(100dvh - 32px) !important;
    margin: 16px auto !important;
  }

  #external-link-modal .modal-footer {
    flex-wrap: nowrap !important;
  }

  #external-link-modal .modal-footer .btn {
    flex: 1 1 0;
    min-width: 0;
  }
}

/* Final page-hero overrides: keep these synced with the main nav treatment. */
html body:not(.night-mode) .main-wrapper .vf-dashboard-shell .profdash-hero,
html body:not(.night-mode) .main-wrapper .vf-guide-page .vf-guide-intro,
html body:not(.night-mode) .main-wrapper .hc-shell .hc-hero-card {
  background:
    radial-gradient(circle at 86% 28%, rgba(255, 255, 255, 0.13), transparent 26%),
    linear-gradient(90deg, #17365a 0%, #215c97 100%) !important;
}

html body:not(.night-mode) .main-wrapper .vf-for-you-shell .vf-foryou-hero-card {
  background-color: #071426 !important;
  background-image:
    linear-gradient(90deg, rgba(5, 12, 24, 0.66) 0%, rgba(5, 12, 24, 0.34) 52%, rgba(5, 12, 24, 0.14) 100%),
    url("/assets/backgrounds/nature_0047.jpg") !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}

html body .main-wrapper .vf-for-you-shell .vf-foryou-hero-card .vf-foryou-hero-copy,
html body .main-wrapper .vf-for-you-shell .vf-foryou-hero-card .vf-foryou-hero-copy.text-muted,
html body .main-wrapper .vf-dashboard-shell .profdash-hero .profdash-hero-subtitle,
html body .main-wrapper .vf-dashboard-shell .profdash-hero .profdash-hero-subtitle.text-muted,
html body .main-wrapper .vf-guide-page .vf-guide-intro .vf-guide-intro-copy,
html body .main-wrapper .vf-guide-page .vf-guide-intro .vf-guide-intro-copy.text-muted,
html body .main-wrapper .hc-shell .hc-hero-card .hc-hero-subtitle,
html body .main-wrapper .hc-shell .hc-hero-card .hc-hero-subtitle.text-muted {
  color: #ffffff !important;
}

html body:not(.night-mode) .main-wrapper .vf-guide-page .vf-guide-section,
html body:not(.night-mode) .main-wrapper .vf-guide-page .vf-guide-panel {
  border: 1px solid var(--vf-border) !important;
  background:
    radial-gradient(circle at top right, rgba(84, 214, 255, 0.10), transparent 24%),
    linear-gradient(180deg, #ffffff 0%, #fbfdff 100%) !important;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.12) !important;
}

html body:not(.night-mode) .main-wrapper .vf-guide-page .vf-guide-section::before,
html body:not(.night-mode) .main-wrapper .vf-guide-page .vf-guide-panel::before {
  background: linear-gradient(90deg, #4c6fff 0%, #2f6fe4 42%, #22c1ee 100%) !important;
}

html body .main-wrapper .vf-guide-page .vf-guide-chip {
  background: rgba(255, 255, 255, 0.14) !important;
  color: rgba(255, 255, 255, 0.94) !important;
}

/* Launchpad polish: bring the hub into the same VibeForge product language. */
html body .main-wrapper .vf-launchpad-shell {
  --vf-lp-ink: #172033 !important;
  --vf-lp-muted: #64748b !important;
  --vf-lp-line: rgba(148, 163, 184, 0.22) !important;
  --vf-lp-surface: #ffffff !important;
  --vf-lp-soft: rgba(76, 111, 255, 0.08) !important;
  --vf-lp-teal: var(--vf-accent-strong, #2f6fe4) !important;
  --vf-lp-coral: #0b6880 !important;
  --vf-lp-gold: #475569 !important;
  --vf-lp-blue: var(--vf-accent, #4c6fff) !important;
}

html body .main-wrapper .vf-launchpad-main {
  gap: 20px !important;
}

html body:not(.night-mode) .main-wrapper .vf-launchpad-hero {
  min-height: 230px !important;
  border: 0 !important;
  border-radius: 24px !important;
  background:
    radial-gradient(circle at 86% 28%, rgba(255, 255, 255, 0.13), transparent 26%),
    linear-gradient(90deg, rgba(23, 54, 90, 0.94) 0%, rgba(33, 92, 151, 0.92) 100%),
    url("/content/uploads/pwa/home_2400x1600.webp") center/cover !important;
  box-shadow: 0 24px 54px rgba(12, 24, 43, 0.22) !important;
}

html body .main-wrapper .vf-launchpad-hero::before {
  content: "" !important;
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent 54%) !important;
  pointer-events: none;
}

html body .main-wrapper .vf-launchpad-hero::after {
  content: "" !important;
  position: absolute;
  right: -70px;
  bottom: -90px;
  width: 260px;
  height: 260px;
  border: 34px solid rgba(255, 255, 255, 0.08);
  border-radius: 50%;
  pointer-events: none;
}

html body .main-wrapper .vf-launchpad-hero-body {
  position: relative;
  z-index: 1;
  min-height: 230px;
  align-items: flex-start !important;
  padding: 30px !important;
}

html body .main-wrapper .vf-launchpad-eyebrow {
  margin-bottom: 8px !important;
  color: rgba(255, 255, 255, 0.78) !important;
  font-size: 0.76rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.14em !important;
}

html body .main-wrapper .vf-launchpad-title {
  color: #ffffff !important;
  font-size: clamp(2rem, 3vw, 3.25rem) !important;
  font-weight: 900 !important;
  line-height: 1.04 !important;
  text-shadow: 0 2px 12px rgba(6, 16, 44, 0.22);
}

html body .main-wrapper .vf-launchpad-copy {
  max-width: 620px !important;
  color: rgba(255, 255, 255, 0.9) !important;
  font-size: 1rem !important;
  font-weight: 650 !important;
  line-height: 1.5 !important;
  text-shadow: 0 1px 8px rgba(6, 16, 44, 0.18);
}

html body .main-wrapper .vf-launchpad-actions {
  justify-content: flex-end;
  min-width: 250px;
}

html body .main-wrapper .vf-launchpad-actions .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  border-radius: 999px !important;
  font-size: 0.78rem;
  font-weight: 850;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

html body .main-wrapper .vf-launchpad-actions .btn-outline-light {
  border-color: rgba(255, 255, 255, 0.5) !important;
  color: #ffffff !important;
}

html body:not(.night-mode) .main-wrapper .vf-launchpad-metric,
html body:not(.night-mode) .main-wrapper .vf-launchpad-section,
html body:not(.night-mode) .main-wrapper .vf-launchpad-mini,
html body:not(.night-mode) .main-wrapper .vf-launchpad-checklist {
  border: 1px solid var(--vf-border, rgba(148, 163, 184, 0.24)) !important;
  border-radius: 18px !important;
  background:
    radial-gradient(circle at top right, rgba(84, 214, 255, 0.09), transparent 26%),
    linear-gradient(180deg, #ffffff 0%, #fbfdff 100%) !important;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.1) !important;
}

html body .main-wrapper .vf-launchpad-section {
  overflow: hidden;
}

html body:not(.night-mode) .main-wrapper .vf-launchpad-section::before,
html body:not(.night-mode) .main-wrapper .vf-launchpad-metric::before {
  background: linear-gradient(90deg, #4c6fff 0%, #2f6fe4 42%, #22c1ee 100%) !important;
}

html body .main-wrapper .vf-launchpad-strip {
  gap: 14px !important;
}

html body .main-wrapper .vf-launchpad-metric {
  position: relative;
  overflow: hidden;
  min-height: 96px !important;
  padding: 18px !important;
}

html body .main-wrapper .vf-launchpad-metric span {
  color: #64748b !important;
  font-size: 0.72rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.06em !important;
}

html body .main-wrapper .vf-launchpad-metric strong {
  color: #172033 !important;
  font-size: 1.55rem !important;
  font-weight: 900 !important;
  line-height: 1.08 !important;
}

html body .main-wrapper .vf-launchpad-section-head {
  align-items: flex-start !important;
  padding: 18px 20px 0 !important;
}

html body .main-wrapper .vf-launchpad-section-title {
  color: #22314a !important;
  font-size: 1.05rem !important;
  font-weight: 900 !important;
}

html body .main-wrapper .vf-launchpad-section-note {
  max-width: 460px;
  color: #64748b !important;
  font-size: 0.82rem !important;
  line-height: 1.35 !important;
  text-align: right;
}

html body .main-wrapper .vf-launchpad-action-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
  padding: 18px 20px 20px !important;
}

html body .main-wrapper .vf-launchpad-grid,
html body .main-wrapper .vf-launchpad-onboarding-grid {
  gap: 14px !important;
  padding: 18px 20px 20px !important;
}

html body .main-wrapper .vf-launchpad-row {
  gap: 14px !important;
}

html body .main-wrapper .vf-launchpad-tile,
html body .main-wrapper .vf-launchpad-action {
  min-width: 0;
  border: 1px solid rgba(148, 163, 184, 0.2) !important;
  border-radius: 16px !important;
  background: rgba(255, 255, 255, 0.86) !important;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.07);
}

html body .main-wrapper .vf-launchpad-tile {
  min-height: 154px !important;
  padding: 15px !important;
}

html body .main-wrapper .vf-launchpad-action {
  min-height: 150px !important;
  flex-direction: column;
  padding: 16px !important;
}

html body .main-wrapper .vf-launchpad-tile:hover,
html body .main-wrapper .vf-launchpad-action:hover {
  border-color: rgba(76, 111, 255, 0.3) !important;
  box-shadow: 0 16px 34px rgba(15, 23, 42, 0.12) !important;
}

html body .main-wrapper .vf-launchpad-icon,
html body .main-wrapper .vf-launchpad-action-icon {
  border-radius: 14px !important;
  background: rgba(76, 111, 255, 0.1) !important;
  color: var(--vf-accent-strong, #2f6fe4) !important;
}

html body .main-wrapper .vf-launchpad-tile:nth-child(2n) .vf-launchpad-icon,
html body .main-wrapper .vf-launchpad-tile:nth-child(3n) .vf-launchpad-icon,
html body .main-wrapper .vf-launchpad-tile:nth-child(5n) .vf-launchpad-icon,
html body .main-wrapper .vf-launchpad-action-blue .vf-launchpad-action-icon,
html body .main-wrapper .vf-launchpad-action-coral .vf-launchpad-action-icon,
html body .main-wrapper .vf-launchpad-action-gold .vf-launchpad-action-icon {
  color: var(--vf-accent-strong, #2f6fe4) !important;
}

html body .main-wrapper .vf-launchpad-tile-title {
  min-width: 0;
  color: #22314a !important;
  font-size: 0.98rem !important;
  font-weight: 900 !important;
  line-height: 1.2 !important;
}

html body .main-wrapper .vf-launchpad-tile-copy,
html body .main-wrapper .vf-launchpad-action-copy {
  color: #64748b !important;
  font-size: 0.82rem !important;
  line-height: 1.4 !important;
}

html body .main-wrapper .vf-launchpad-tile-meta {
  color: #52627a !important;
  font-size: 0.76rem !important;
  line-height: 1.25 !important;
}

html body .main-wrapper .vf-launchpad-status,
html body .main-wrapper .vf-launchpad-chip {
  border: 1px solid rgba(76, 111, 255, 0.14) !important;
  background: rgba(76, 111, 255, 0.08) !important;
  color: var(--vf-accent-strong, #2f6fe4) !important;
}

html body .main-wrapper .vf-launchpad-chip {
  min-height: 28px !important;
  padding: 4px 10px !important;
  font-size: 0.72rem !important;
  font-weight: 850 !important;
}

html body .main-wrapper .vf-launchpad-dot,
html body .main-wrapper .vf-launchpad-progress span {
  background: linear-gradient(135deg, var(--vf-accent, #4c6fff), #22c1ee) !important;
}

html body .main-wrapper .vf-launchpad-mini {
  padding: 16px !important;
}

html body .main-wrapper .vf-launchpad-mini strong,
html body .main-wrapper .vf-launchpad-action-title,
html body .main-wrapper .vf-launchpad-checklist h3 {
  color: #22314a !important;
  font-weight: 900 !important;
}

html body .main-wrapper .vf-launchpad-mini a,
html body .main-wrapper .vf-launchpad-action-label,
html body .main-wrapper .vf-launchpad-checklist a:hover {
  color: var(--vf-accent-strong, #2f6fe4) !important;
  font-weight: 850 !important;
}

html body .main-wrapper .vf-launchpad-check {
  border-color: rgba(148, 163, 184, 0.24) !important;
  background: #ffffff !important;
}

html body .main-wrapper .vf-launchpad-check.is-done {
  border-color: rgba(76, 111, 255, 0.18) !important;
  background: rgba(76, 111, 255, 0.08) !important;
  color: var(--vf-accent-strong, #2f6fe4) !important;
}

html body .main-wrapper .vf-launchpad-permission-note {
  background: rgba(248, 251, 255, 0.72);
  color: #64748b !important;
}

@media (max-width: 1199.98px) {
  html body .main-wrapper .vf-launchpad-action-grid {
    grid-template-columns: 1fr !important;
  }

  html body .main-wrapper .vf-launchpad-action {
    min-height: auto !important;
    flex-direction: row;
  }
}

@media (max-width: 991.98px) {
  html body .main-wrapper .vf-launchpad-hero,
  html body .main-wrapper .vf-launchpad-hero-body {
    min-height: 0 !important;
  }

  html body .main-wrapper .vf-launchpad-hero-body {
    padding: 22px !important;
  }

  html body .main-wrapper .vf-launchpad-actions {
    width: 100%;
    min-width: 0;
    justify-content: flex-start;
  }

  html body .main-wrapper .vf-launchpad-actions .btn {
    flex: 1 1 190px;
  }

  html body .main-wrapper .vf-launchpad-section-note {
    text-align: left;
  }
}

@media (max-width: 575.98px) {
  html body .main-wrapper .vf-launchpad-title {
    font-size: 2rem !important;
  }

  html body .main-wrapper .vf-launchpad-strip,
  html body .main-wrapper .vf-launchpad-grid,
  html body .main-wrapper .vf-launchpad-row,
  html body .main-wrapper .vf-launchpad-action-grid,
  html body .main-wrapper .vf-launchpad-onboarding-grid {
    grid-template-columns: 1fr !important;
  }

  html body .main-wrapper .vf-launchpad-tile {
    min-height: 0 !important;
  }

  html body .main-wrapper .vf-launchpad-tile-title {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* Launchpad night-mode parity: keep this beside the Launchpad light rules it overrides. */
html body.night-mode .main-wrapper .vf-launchpad-shell {
  --vf-lp-ink: #e5edf7 !important;
  --vf-lp-muted: #9fb0c6 !important;
  --vf-lp-line: rgba(148, 163, 184, 0.24) !important;
  --vf-lp-surface: #121b28 !important;
  --vf-lp-soft: #1a273a !important;
}

html body.night-mode .main-wrapper .vf-launchpad-hero {
  isolation: isolate !important;
  background-color: #071426 !important;
  background-image:
    linear-gradient(90deg, rgba(5, 12, 24, 0.64) 0%, rgba(5, 12, 24, 0.34) 52%, rgba(5, 12, 24, 0.12) 100%),
    url("/content/themes/modern/images/landing/vf-global-lisbon.webp") !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  border-color: rgba(148, 163, 184, 0.24) !important;
  color: #ffffff !important;
}

html body.night-mode .main-wrapper .vf-launchpad-photo {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  opacity: 1 !important;
  visibility: visible !important;
}

html body.night-mode .main-wrapper .vf-launchpad-hero::before,
html body.night-mode .main-wrapper .vf-launchpad-hero::after {
  z-index: 2 !important;
}

html body.night-mode .main-wrapper .vf-launchpad-hero-body {
  z-index: 3 !important;
  background: transparent !important;
  background-color: transparent !important;
}

html body.night-mode .main-wrapper .vf-launchpad-metric,
html body.night-mode .main-wrapper .vf-launchpad-section,
html body.night-mode .main-wrapper .vf-launchpad-mini,
html body.night-mode .main-wrapper .vf-launchpad-checklist,
html body.night-mode .main-wrapper .vf-launchpad-shell .sg-offcanvas-mainbar .vf-launchpad-main .vf-launchpad-metric,
html body.night-mode .main-wrapper .vf-launchpad-shell .sg-offcanvas-mainbar .vf-launchpad-main .vf-launchpad-section,
html body.night-mode .main-wrapper .vf-launchpad-shell .sg-offcanvas-mainbar .vf-launchpad-main .vf-launchpad-mini,
html body.night-mode .main-wrapper .vf-launchpad-shell .sg-offcanvas-mainbar .vf-launchpad-main .vf-launchpad-checklist {
  background: #121b28 !important;
  background-color: #121b28 !important;
  background-image: none !important;
  border-color: rgba(148, 163, 184, 0.24) !important;
  color: #e5edf7 !important;
  box-shadow: none !important;
}

html body.night-mode .main-wrapper .vf-launchpad-tile,
html body.night-mode .main-wrapper .vf-launchpad-action,
html body.night-mode .main-wrapper .vf-launchpad-shell .sg-offcanvas-mainbar .vf-launchpad-main .vf-launchpad-tile,
html body.night-mode .main-wrapper .vf-launchpad-shell .sg-offcanvas-mainbar .vf-launchpad-main .vf-launchpad-action {
  background: #172334 !important;
  background-color: #172334 !important;
  background-image: none !important;
  border-color: rgba(148, 163, 184, 0.24) !important;
  color: #e5edf7 !important;
  box-shadow: none !important;
}

html body.night-mode .main-wrapper .vf-launchpad-metric span,
html body.night-mode .main-wrapper .vf-launchpad-section-note,
html body.night-mode .main-wrapper .vf-launchpad-tile-copy,
html body.night-mode .main-wrapper .vf-launchpad-action-copy,
html body.night-mode .main-wrapper .vf-launchpad-tile-meta {
  color: #9fb0c6 !important;
}

html body.night-mode .main-wrapper .vf-launchpad-metric strong,
html body.night-mode .main-wrapper .vf-launchpad-section-title,
html body.night-mode .main-wrapper .vf-launchpad-tile-title,
html body.night-mode .main-wrapper .vf-launchpad-action-title,
html body.night-mode .main-wrapper .vf-launchpad-mini strong,
html body.night-mode .main-wrapper .vf-launchpad-checklist h3,
html body.night-mode .main-wrapper .vf-launchpad-checklist a {
  color: #e5edf7 !important;
}

html body.night-mode .main-wrapper .vf-launchpad-icon,
html body.night-mode .main-wrapper .vf-launchpad-action-icon,
html body.night-mode .main-wrapper .vf-launchpad-check {
  background: #1a273a !important;
  border-color: rgba(148, 163, 184, 0.24) !important;
  color: #8fb7ff !important;
}

html body.night-mode .main-wrapper .vf-launchpad-status,
html body.night-mode .main-wrapper .vf-launchpad-chip,
html body.night-mode .main-wrapper .vf-launchpad-check.is-done {
  background: rgba(76, 111, 255, 0.16) !important;
  border-color: rgba(143, 183, 255, 0.28) !important;
  color: #b9d2ff !important;
}

html body.night-mode .main-wrapper .vf-launchpad-permission-note {
  background: #1a273a !important;
  border-color: rgba(148, 163, 184, 0.24) !important;
  color: #9fb0c6 !important;
}

/* Memories page */
html body .main-wrapper .vf-newsfeed-shell .vf-memories-hero {
  position: relative;
  min-height: 210px;
  overflow: hidden;
  border: 0 !important;
  border-radius: 22px !important;
  background:
    radial-gradient(circle at 88% 22%, rgba(84, 214, 255, 0.18), transparent 28%),
    radial-gradient(circle at 8% 10%, rgba(255, 255, 255, 0.12), transparent 24%),
    linear-gradient(110deg, #102b49 0%, #1f5b96 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 24px 54px rgba(12, 24, 43, 0.22) !important;
}

html body .main-wrapper .vf-newsfeed-shell .vf-memories-hero::before {
  content: "" !important;
  position: absolute;
  inset: 0;
  height: auto !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent 54%),
    radial-gradient(circle at 100% 100%, rgba(34, 193, 238, 0.18), transparent 34%) !important;
  pointer-events: none;
}

html body .main-wrapper .vf-newsfeed-shell .vf-memories-hero::after {
  content: "" !important;
  position: absolute;
  right: -62px;
  bottom: -88px;
  width: 250px;
  height: 250px;
  border: 32px solid rgba(255, 255, 255, 0.08);
  border-radius: 50%;
  pointer-events: none;
}

html body .main-wrapper .vf-newsfeed-shell .vf-memories-hero .circle-1,
html body .main-wrapper .vf-newsfeed-shell .vf-memories-hero .circle-2 {
  display: none !important;
}

html body .main-wrapper .vf-newsfeed-shell .vf-memories-hero .inner {
  position: relative;
  z-index: 1;
  display: flex;
  min-height: 210px;
  max-width: 660px;
  flex-direction: column;
  justify-content: center;
  padding: 28px 34px !important;
  text-align: left;
}

html body .main-wrapper .vf-newsfeed-shell .vf-memories-eyebrow {
  margin-bottom: 8px;
  color: rgba(255, 255, 255, 0.78);
  font-size: 0.76rem;
  font-weight: 850;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

html body .main-wrapper .vf-newsfeed-shell .vf-memories-hero h2 {
  margin: 0 !important;
  color: #ffffff !important;
  font-size: clamp(2rem, 3vw, 3rem) !important;
  font-weight: 900 !important;
  line-height: 1.02 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  text-shadow: 0 2px 12px rgba(6, 16, 44, 0.22);
}

html body .main-wrapper .vf-newsfeed-shell .vf-memories-hero p {
  max-width: 590px;
  margin: 12px 0 0 !important;
  color: rgba(255, 255, 255, 0.9) !important;
  font-size: 0.98rem !important;
  font-weight: 650 !important;
  line-height: 1.45 !important;
  text-shadow: 0 1px 8px rgba(6, 16, 44, 0.18);
}

html body .main-wrapper .vf-newsfeed-shell .vf-memories-hero-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 20px;
}

html body .main-wrapper .vf-newsfeed-shell .vf-memories-hero-meta span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  padding: 0 13px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.12);
  color: rgba(255, 255, 255, 0.92);
  font-size: 0.78rem;
  font-weight: 850;
  backdrop-filter: blur(10px);
}

html body .main-wrapper .vf-newsfeed-shell .vf-memories-hero + .vf-posts-filter {
  min-height: 58px;
  margin-bottom: 12px !important;
  padding: 10px 14px !important;
  border: 1px solid var(--vf-border, rgba(148, 163, 184, 0.24)) !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%) !important;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.1) !important;
}

html body .main-wrapper .vf-newsfeed-shell .vf-memories-hero + .vf-posts-filter > span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  color: #22314a;
  font-size: 0.9rem;
  font-weight: 900;
  letter-spacing: 0.04em;
}

html body .main-wrapper .vf-newsfeed-shell .vf-memories-hero + .vf-posts-filter > span::before {
  content: "\\f1da";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 12px;
  background: rgba(76, 111, 255, 0.1);
  color: var(--vf-accent-strong, #2f6fe4);
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  letter-spacing: 0;
}

html body .main-wrapper .vf-newsfeed-shell .vf-memories-hero + .vf-posts-filter .btn-group .btn {
  min-height: 36px;
  border-radius: 999px !important;
  font-weight: 850;
}

html body .main-wrapper .vf-newsfeed-shell .vf-memories-empty {
  display: grid;
  justify-items: center;
  gap: 12px;
  margin-bottom: 20px;
  padding: 34px 28px;
  border: 1px solid var(--vf-border, rgba(148, 163, 184, 0.24));
  border-radius: 22px;
  background:
    radial-gradient(circle at top right, rgba(84, 214, 255, 0.1), transparent 28%),
    linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.1);
  text-align: center;
}

html body .main-wrapper .vf-newsfeed-shell .vf-memories-empty-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 68px;
  height: 68px;
  border-radius: 22px;
  background: linear-gradient(135deg, rgba(76, 111, 255, 0.12), rgba(34, 193, 238, 0.14));
  color: var(--vf-accent-strong, #2f6fe4);
}

html body .main-wrapper .vf-newsfeed-shell .vf-memories-empty-title {
  color: #22314a;
  font-size: 1.1rem;
  font-weight: 900;
  line-height: 1.2;
}

html body .main-wrapper .vf-newsfeed-shell .vf-memories-empty-copy {
  max-width: 520px;
  color: #64748b;
  font-size: 0.93rem;
  line-height: 1.45;
}

html body .main-wrapper .vf-newsfeed-shell .vf-memories-empty-action {
  min-height: 40px;
  margin-top: 4px;
  padding: 0 18px !important;
  border-radius: 999px !important;
  font-size: 0.78rem;
  font-weight: 850;
  letter-spacing: 0.02em;
  line-height: 40px !important;
  text-transform: uppercase;
}

html body.night-mode .main-wrapper .vf-newsfeed-shell .vf-memories-empty {
  border-color: rgba(148, 163, 184, 0.24) !important;
  background:
    radial-gradient(circle at top right, rgba(84, 214, 255, 0.08), transparent 28%),
    linear-gradient(180deg, #121b28 0%, #111827 100%) !important;
  box-shadow: none !important;
  color: #e5edf7 !important;
}

html body.night-mode .main-wrapper .vf-newsfeed-shell .vf-memories-empty-icon {
  background: rgba(76, 111, 255, 0.16) !important;
  color: #8fb7ff !important;
}

html body.night-mode .main-wrapper .vf-newsfeed-shell .vf-memories-empty-title {
  color: #e5edf7 !important;
}

html body.night-mode .main-wrapper .vf-newsfeed-shell .vf-memories-empty-copy {
  color: #9fb0c6 !important;
}

html body .main-wrapper .vf-newsfeed-shell .post-memory-header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 18px !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.18) !important;
  background: linear-gradient(180deg, rgba(248, 251, 255, 0.96), rgba(255, 255, 255, 0.92)) !important;
  color: #52627a;
  font-size: 0.78rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.02em;
}

html body .main-wrapper .vf-newsfeed-shell .post-memory-header::before {
  content: "\\f1da";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 11px;
  background: rgba(76, 111, 255, 0.1);
  color: var(--vf-accent-strong, #2f6fe4);
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
}

@media (max-width: 575.98px) {
  html body .main-wrapper .vf-newsfeed-shell .vf-memories-hero {
    min-height: 0;
    border-radius: 20px !important;
  }

  html body .main-wrapper .vf-newsfeed-shell .vf-memories-hero .inner {
    padding: 22px !important;
  }

  html body .main-wrapper .vf-newsfeed-shell .vf-memories-hero h2 {
    font-size: 2rem !important;
  }

  html body .main-wrapper .vf-newsfeed-shell .vf-memories-hero-meta span {
    width: 100%;
  }

  html body .main-wrapper .vf-newsfeed-shell .vf-memories-empty {
    padding: 28px 18px;
  }
}

/* Popular posts page */
html body .main-wrapper .vf-newsfeed-shell .vf-popular-hero {
  position: relative;
  min-height: 210px;
  overflow: hidden;
  border: 0 !important;
  border-radius: 22px !important;
  background:
    radial-gradient(circle at 86% 24%, rgba(84, 214, 255, 0.18), transparent 28%),
    radial-gradient(circle at 10% 8%, rgba(255, 255, 255, 0.12), transparent 24%),
    linear-gradient(110deg, #102b49 0%, #1f5b96 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 24px 54px rgba(12, 24, 43, 0.22) !important;
}

html body .main-wrapper .vf-newsfeed-shell .vf-popular-hero::before {
  content: "" !important;
  position: absolute;
  inset: 0;
  height: auto !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent 54%),
    radial-gradient(circle at 100% 100%, rgba(34, 193, 238, 0.18), transparent 34%) !important;
  pointer-events: none;
}

html body .main-wrapper .vf-newsfeed-shell .vf-popular-hero::after {
  content: "" !important;
  position: absolute;
  right: -62px;
  bottom: -88px;
  width: 250px;
  height: 250px;
  border: 32px solid rgba(255, 255, 255, 0.08);
  border-radius: 50%;
  pointer-events: none;
}

html body .main-wrapper .vf-newsfeed-shell .vf-popular-hero .inner {
  position: relative;
  z-index: 1;
  display: flex;
  min-height: 210px;
  max-width: 660px;
  flex-direction: column;
  justify-content: center;
  padding: 28px 34px !important;
  text-align: left;
}

html body .main-wrapper .vf-newsfeed-shell .vf-popular-eyebrow {
  margin-bottom: 8px;
  color: rgba(255, 255, 255, 0.78);
  font-size: 0.76rem;
  font-weight: 850;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

html body .main-wrapper .vf-newsfeed-shell .vf-popular-hero h2 {
  margin: 0 !important;
  color: #ffffff !important;
  font-size: clamp(2rem, 3vw, 3rem) !important;
  font-weight: 900 !important;
  line-height: 1.02 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  text-shadow: 0 2px 12px rgba(6, 16, 44, 0.22);
}

html body .main-wrapper .vf-newsfeed-shell .vf-popular-hero p {
  max-width: 590px;
  margin: 12px 0 0 !important;
  color: rgba(255, 255, 255, 0.9) !important;
  font-size: 0.98rem !important;
  font-weight: 650 !important;
  line-height: 1.45 !important;
  text-shadow: 0 1px 8px rgba(6, 16, 44, 0.18);
}

html body .main-wrapper .vf-newsfeed-shell .vf-popular-hero-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 20px;
}

html body .main-wrapper .vf-newsfeed-shell .vf-popular-hero-meta span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  padding: 0 13px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.12);
  color: rgba(255, 255, 255, 0.92);
  font-size: 0.78rem;
  font-weight: 850;
  backdrop-filter: blur(10px);
}

html body .main-wrapper .vf-newsfeed-shell .vf-popular-hero + .vf-posts-filter {
  min-height: 58px;
  margin-bottom: 12px !important;
  padding: 10px 14px !important;
  border: 1px solid var(--vf-border, rgba(148, 163, 184, 0.24)) !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%) !important;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.1) !important;
}

html body .main-wrapper .vf-newsfeed-shell .vf-popular-hero + .vf-posts-filter > .dropdown-toggle,
html body .main-wrapper .vf-newsfeed-shell .vf-popular-hero + .vf-posts-filter > span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  color: #22314a;
  font-size: 0.9rem;
  font-weight: 900;
  letter-spacing: 0.02em;
}

html body .main-wrapper .vf-newsfeed-shell .vf-popular-hero + .vf-posts-filter > .dropdown-toggle::before,
html body .main-wrapper .vf-newsfeed-shell .vf-popular-hero + .vf-posts-filter > span::before {
  content: "\\f06d";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 12px;
  background: rgba(76, 111, 255, 0.1);
  color: var(--vf-accent-strong, #2f6fe4);
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  letter-spacing: 0;
}

html body .main-wrapper .vf-newsfeed-shell .vf-popular-hero + .vf-posts-filter .countries-filter,
html body .main-wrapper .vf-newsfeed-shell .vf-popular-hero + .vf-posts-filter .btn-group .btn {
  min-height: 36px;
  border-radius: 999px !important;
  font-weight: 850;
}

@media (max-width: 575.98px) {
  html body .main-wrapper .vf-newsfeed-shell .vf-popular-hero {
    min-height: 0;
    border-radius: 20px !important;
  }

  html body .main-wrapper .vf-newsfeed-shell .vf-popular-hero .inner {
    min-height: 0;
    padding: 22px !important;
  }

  html body .main-wrapper .vf-newsfeed-shell .vf-popular-hero h2 {
    font-size: 2rem !important;
  }

  html body .main-wrapper .vf-newsfeed-shell .vf-popular-hero-meta span {
    width: 100%;
  }
}

/* Discover posts page */
html body .main-wrapper .vf-newsfeed-shell .vf-discover-hero {
  position: relative;
  min-height: 210px;
  overflow: hidden;
  border: 0 !important;
  border-radius: 22px !important;
  background:
    radial-gradient(circle at 86% 24%, rgba(84, 214, 255, 0.18), transparent 28%),
    radial-gradient(circle at 10% 8%, rgba(255, 255, 255, 0.12), transparent 24%),
    linear-gradient(110deg, #102b49 0%, #1f5b96 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 24px 54px rgba(12, 24, 43, 0.22) !important;
}

html body .main-wrapper .vf-newsfeed-shell .vf-discover-hero::before {
  content: "" !important;
  position: absolute;
  inset: 0;
  height: auto !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent 54%),
    radial-gradient(circle at 100% 100%, rgba(34, 193, 238, 0.18), transparent 34%) !important;
  pointer-events: none;
}

html body .main-wrapper .vf-newsfeed-shell .vf-discover-hero::after {
  content: "" !important;
  position: absolute;
  right: -62px;
  bottom: -88px;
  width: 250px;
  height: 250px;
  border: 32px solid rgba(255, 255, 255, 0.08);
  border-radius: 50%;
  pointer-events: none;
}

html body .main-wrapper .vf-newsfeed-shell .vf-discover-hero .inner {
  position: relative;
  z-index: 1;
  display: flex;
  min-height: 210px;
  max-width: 660px;
  flex-direction: column;
  justify-content: center;
  padding: 28px 34px !important;
  text-align: left;
}

html body .main-wrapper .vf-newsfeed-shell .vf-discover-eyebrow {
  margin-bottom: 8px;
  color: rgba(255, 255, 255, 0.78);
  font-size: 0.76rem;
  font-weight: 850;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

html body .main-wrapper .vf-newsfeed-shell .vf-discover-hero h2 {
  margin: 0 !important;
  color: #ffffff !important;
  font-size: clamp(2rem, 3vw, 3rem) !important;
  font-weight: 900 !important;
  line-height: 1.02 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  text-shadow: 0 2px 12px rgba(6, 16, 44, 0.22);
}

html body .main-wrapper .vf-newsfeed-shell .vf-discover-hero p {
  max-width: 590px;
  margin: 12px 0 0 !important;
  color: rgba(255, 255, 255, 0.9) !important;
  font-size: 0.98rem !important;
  font-weight: 650 !important;
  line-height: 1.45 !important;
  text-shadow: 0 1px 8px rgba(6, 16, 44, 0.18);
}

html body .main-wrapper .vf-newsfeed-shell .vf-discover-hero-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 20px;
}

html body .main-wrapper .vf-newsfeed-shell .vf-discover-hero-meta span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  padding: 0 13px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.12);
  color: rgba(255, 255, 255, 0.92);
  font-size: 0.78rem;
  font-weight: 850;
  backdrop-filter: blur(10px);
}

html body .main-wrapper .vf-newsfeed-shell .vf-discover-hero + .vf-posts-filter {
  min-height: 58px;
  margin-bottom: 12px !important;
  padding: 10px 14px !important;
  border: 1px solid var(--vf-border, rgba(148, 163, 184, 0.24)) !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%) !important;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.1) !important;
}

html body .main-wrapper .vf-newsfeed-shell .vf-discover-hero + .vf-posts-filter > .dropdown-toggle,
html body .main-wrapper .vf-newsfeed-shell .vf-discover-hero + .vf-posts-filter > span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  color: #22314a;
  font-size: 0.9rem;
  font-weight: 900;
  letter-spacing: 0.02em;
}

html body .main-wrapper .vf-newsfeed-shell .vf-discover-hero + .vf-posts-filter > .dropdown-toggle::before,
html body .main-wrapper .vf-newsfeed-shell .vf-discover-hero + .vf-posts-filter > span::before {
  content: "\\f14e";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 12px;
  background: rgba(76, 111, 255, 0.1);
  color: var(--vf-accent-strong, #2f6fe4);
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  letter-spacing: 0;
}

html body .main-wrapper .vf-newsfeed-shell .vf-discover-hero + .vf-posts-filter .countries-filter,
html body .main-wrapper .vf-newsfeed-shell .vf-discover-hero + .vf-posts-filter .btn-group .btn {
  min-height: 36px;
  border-radius: 999px !important;
  font-weight: 850;
}

html body .main-wrapper .vf-newsfeed-shell .vf-discover-empty {
  display: grid;
  justify-items: center;
  gap: 12px;
  margin-bottom: 20px;
  padding: 34px 28px;
  border: 1px solid var(--vf-border, rgba(148, 163, 184, 0.24));
  border-radius: 22px;
  background:
    radial-gradient(circle at top right, rgba(84, 214, 255, 0.1), transparent 28%),
    linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.1);
  text-align: center;
}

html body .main-wrapper .vf-newsfeed-shell .vf-discover-empty-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 68px;
  height: 68px;
  border-radius: 22px;
  background: linear-gradient(135deg, rgba(76, 111, 255, 0.12), rgba(34, 193, 238, 0.14));
  color: var(--vf-accent-strong, #2f6fe4);
}

html body .main-wrapper .vf-newsfeed-shell .vf-discover-empty-title {
  color: #22314a;
  font-size: 1.1rem;
  font-weight: 900;
  line-height: 1.2;
}

html body .main-wrapper .vf-newsfeed-shell .vf-discover-empty-copy {
  max-width: 520px;
  color: #64748b;
  font-size: 0.93rem;
  line-height: 1.45;
}

html body .main-wrapper .vf-newsfeed-shell .vf-discover-empty-action {
  min-height: 40px;
  margin-top: 4px;
  padding: 0 18px !important;
  border-radius: 999px !important;
  font-size: 0.78rem;
  font-weight: 850;
  letter-spacing: 0.02em;
  line-height: 40px !important;
  text-transform: uppercase;
}

html body.night-mode .main-wrapper .vf-newsfeed-shell .vf-discover-empty {
  border-color: rgba(148, 163, 184, 0.24) !important;
  background:
    radial-gradient(circle at top right, rgba(84, 214, 255, 0.08), transparent 28%),
    linear-gradient(180deg, #121b28 0%, #111827 100%) !important;
  box-shadow: none !important;
  color: #e5edf7 !important;
}

html body.night-mode .main-wrapper .vf-newsfeed-shell .vf-discover-empty-icon {
  background: rgba(76, 111, 255, 0.16) !important;
  color: #8fb7ff !important;
}

html body.night-mode .main-wrapper .vf-newsfeed-shell .vf-discover-empty-title {
  color: #e5edf7 !important;
}

html body.night-mode .main-wrapper .vf-newsfeed-shell .vf-discover-empty-copy {
  color: #9fb0c6 !important;
}

/* r109 local hub dark-mode fallback for page-local card rules */
html body.night-mode.vf-page-local .main-wrapper .vf-local-page-content .vf-local-feature,
html body.night-mode.vf-page-local .main-wrapper .vf-local-page-content .vf-local-card,
html body.night-mode.vf-page-local .main-wrapper .vf-local-page-content .vf-local-record,
html body.night-mode.vf-page-local .main-wrapper .vf-local-page-content .vf-local-tool {
  background: #121b28 !important;
  background-color: #121b28 !important;
  background-image: none !important;
  border-color: rgba(148, 163, 184, 0.24) !important;
  box-shadow: none !important;
  color: #e5edf7 !important;
}

html body.night-mode.vf-page-local .main-wrapper .vf-local-page-content .vf-local-feature:hover,
html body.night-mode.vf-page-local .main-wrapper .vf-local-page-content .vf-local-card:hover,
html body.night-mode.vf-page-local .main-wrapper .vf-local-page-content .vf-local-tool[open] {
  background: #172334 !important;
  border-color: rgba(143, 183, 255, 0.34) !important;
  color: #e5edf7 !important;
}

html body.night-mode.vf-page-local .main-wrapper .vf-local-page-content .vf-local-empty,
html body.night-mode.vf-page-local .main-wrapper .vf-local-page-content .vf-local-answer {
  background: #172334 !important;
  background-color: #172334 !important;
  border: 1px solid rgba(148, 163, 184, 0.24) !important;
  color: #9fb0c6 !important;
}

html body.night-mode.vf-page-local .main-wrapper .vf-local-page-content .vf-local-feature strong,
html body.night-mode.vf-page-local .main-wrapper .vf-local-page-content .vf-local-card strong,
html body.night-mode.vf-page-local .main-wrapper .vf-local-page-content .vf-local-record h4,
html body.night-mode.vf-page-local .main-wrapper .vf-local-page-content .vf-local-tool summary {
  color: #e5edf7 !important;
}

html body.night-mode.vf-page-local .main-wrapper .vf-local-page-content .vf-local-feature span,
html body.night-mode.vf-page-local .main-wrapper .vf-local-page-content .vf-local-card span,
html body.night-mode.vf-page-local .main-wrapper .vf-local-page-content .vf-local-record p,
html body.night-mode.vf-page-local .main-wrapper .vf-local-page-content .vf-local-tool-helper {
  color: #9fb0c6 !important;
}

html body.night-mode.vf-page-local .main-wrapper .vf-local-page-content .vf-local-feature i,
html body.night-mode.vf-page-local .main-wrapper .vf-local-page-content .vf-local-tool summary::after {
  background: rgba(76, 111, 255, 0.16) !important;
  color: #8fb7ff !important;
}

html body.night-mode.vf-page-local .main-wrapper .vf-local-page-content .vf-local-pill {
  background: rgba(76, 111, 255, 0.16) !important;
  color: #b9d2ff !important;
}

/* r110 events dark-mode fallback for page-local calendar rules */
html body.night-mode.vf-page-events .main-wrapper .vf-events-calendar-card {
  background: linear-gradient(180deg, #121b28 0%, #111827 100%) !important;
  border-color: rgba(148, 163, 184, 0.24) !important;
  box-shadow: none !important;
  color: #e5edf7 !important;
}

html body.night-mode.vf-page-events .main-wrapper .vf-events-calendar-day,
html body.night-mode.vf-page-events .main-wrapper .vf-events-week-column,
html body.night-mode.vf-page-events .main-wrapper .vf-events-list-item {
  background: #121b28 !important;
  background-color: #121b28 !important;
  background-image: none !important;
  border-color: rgba(148, 163, 184, 0.24) !important;
  box-shadow: none !important;
  color: #e5edf7 !important;
}

html body.night-mode.vf-page-events .main-wrapper .vf-events-calendar-day.is-outside,
html body.night-mode.vf-page-events .main-wrapper .vf-events-calendar-day.is-empty,
html body.night-mode.vf-page-events .main-wrapper .vf-events-week-column.is-empty {
  background: #0f1724 !important;
  color: #70839a !important;
}

html body.night-mode.vf-page-events .main-wrapper .vf-events-calendar-event,
html body.night-mode.vf-page-events .main-wrapper .vf-events-view-switch,
html body.night-mode.vf-page-events .main-wrapper .vf-events-toolbar-actions .countries-filter,
html body.night-mode.vf-page-events .main-wrapper .vf-events-calendar-more {
  background: #172334 !important;
  background-color: #172334 !important;
  background-image: none !important;
  border-color: rgba(148, 163, 184, 0.24) !important;
  color: #b9d2ff !important;
}

html body.night-mode.vf-page-events .main-wrapper .vf-events-calendar-header h3,
html body.night-mode.vf-page-events .main-wrapper .vf-events-list-group h4,
html body.night-mode.vf-page-events .main-wrapper .vf-events-calendar-dayhead,
html body.night-mode.vf-page-events .main-wrapper .vf-events-week-head strong,
html body.night-mode.vf-page-events .main-wrapper .vf-events-calendar-event strong,
html body.night-mode.vf-page-events .main-wrapper .vf-events-list-item strong {
  color: #e5edf7 !important;
}

html body.night-mode.vf-page-events .main-wrapper .vf-events-calendar-header p,
html body.night-mode.vf-page-events .main-wrapper .vf-events-calendar-dow,
html body.night-mode.vf-page-events .main-wrapper .vf-events-calendar-date-label,
html body.night-mode.vf-page-events .main-wrapper .vf-events-week-head span,
html body.night-mode.vf-page-events .main-wrapper .vf-events-calendar-event span,
html body.night-mode.vf-page-events .main-wrapper .vf-events-list-item span {
  color: #9fb0c6 !important;
}

html body .main-wrapper .vf-saved-empty {
  display: grid;
  justify-items: center;
  gap: 16px;
  width: min(100%, 680px);
  margin: 18px auto 24px;
  padding: 44px 36px;
  border: 1px solid var(--vf-border, rgba(148, 163, 184, 0.24));
  border-radius: 22px;
  background:
    radial-gradient(circle at top right, rgba(84, 214, 255, 0.1), transparent 28%),
    linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.1);
  text-align: center;
}

html body .main-wrapper .vf-saved-empty-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 68px;
  height: 68px;
  border-radius: 22px;
  background: linear-gradient(135deg, rgba(76, 111, 255, 0.12), rgba(34, 193, 238, 0.14));
  color: var(--vf-accent-strong, #2f6fe4);
}

html body .main-wrapper .vf-saved-empty-title {
  color: #22314a;
  font-size: 1.1rem;
  font-weight: 900;
  line-height: 1.2;
}

html body .main-wrapper .vf-saved-empty-copy {
  max-width: 520px;
  color: #64748b;
  font-size: 0.95rem;
  line-height: 1.55;
}

html body .main-wrapper .vf-saved-empty-action {
  min-height: 40px;
  margin-top: 8px;
  padding: 0 22px !important;
  border-radius: 999px !important;
  font-size: 0.78rem;
  font-weight: 850;
  letter-spacing: 0.02em;
  line-height: 40px !important;
  text-transform: uppercase;
}

html body.night-mode .main-wrapper .vf-saved-empty {
  border-color: rgba(148, 163, 184, 0.24) !important;
  background:
    radial-gradient(circle at top right, rgba(84, 214, 255, 0.08), transparent 28%),
    linear-gradient(180deg, #121b28 0%, #111827 100%) !important;
  box-shadow: none !important;
  color: #e5edf7 !important;
}

html body.night-mode .main-wrapper .vf-saved-empty-icon {
  background: rgba(76, 111, 255, 0.16) !important;
  color: #8fb7ff !important;
}

html body.night-mode .main-wrapper .vf-saved-empty-title {
  color: #e5edf7 !important;
}

html body.night-mode .main-wrapper .vf-saved-empty-copy {
  color: #9fb0c6 !important;
}

html body .main-wrapper .vf-search-empty {
  display: grid;
  justify-items: center;
  gap: 14px;
  width: min(100%, 620px);
  margin: 28px auto 30px;
  padding: 42px 34px;
  border: 1px solid var(--vf-border, rgba(148, 163, 184, 0.24));
  border-radius: 22px;
  background:
    radial-gradient(circle at top right, rgba(84, 214, 255, 0.1), transparent 28%),
    linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.1);
  text-align: center;
}

html body .main-wrapper .vf-search-empty-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 66px;
  height: 66px;
  border-radius: 22px;
  background: linear-gradient(135deg, rgba(76, 111, 255, 0.12), rgba(34, 193, 238, 0.14));
  color: var(--vf-accent-strong, #2f6fe4);
  font-size: 1.35rem;
}

html body .main-wrapper .vf-search-empty-title {
  color: #22314a;
  font-size: 1.08rem;
  font-weight: 900;
  line-height: 1.2;
}

html body .main-wrapper .vf-search-empty-copy {
  max-width: 460px;
  color: #64748b;
  font-size: 0.95rem;
  line-height: 1.55;
}

html body .main-wrapper .vf-search-suggestions {
  width: min(100%, 980px);
  margin: 28px auto 32px;
  padding: 28px;
  border: 1px solid var(--vf-border, rgba(148, 163, 184, 0.24));
  border-radius: 24px;
  background:
    radial-gradient(circle at top right, rgba(84, 214, 255, 0.11), transparent 30%),
    linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.11);
}

html body .main-wrapper .vf-search-suggestions-head {
  max-width: 680px;
  margin: 0 auto 22px;
  text-align: center;
}

html body .main-wrapper .vf-search-suggestions-kicker {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 8px;
  color: #2f6fe4;
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

html body .main-wrapper .vf-search-suggestions-kicker::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #6ee7cf;
  box-shadow: 0 0 0 5px rgba(110, 231, 207, 0.16);
}

html body .main-wrapper .vf-search-suggestions-head h3 {
  margin: 0;
  color: #172033;
  font-size: clamp(1.35rem, 2vw, 2rem);
  font-weight: 900;
  line-height: 1.12;
}

html body .main-wrapper .vf-search-suggestions-head p {
  max-width: 560px;
  margin: 10px auto 0;
  color: #64748b;
  font-size: 0.96rem;
  line-height: 1.55;
}

html body .main-wrapper .vf-search-suggestions-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 14px;
}

html body .main-wrapper .vf-search-suggestion-card {
  display: grid;
  gap: 8px;
  min-height: 148px;
  padding: 18px;
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-radius: 18px;
  background: rgba(248, 251, 255, 0.82);
  color: #172033 !important;
  text-decoration: none !important;
  transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

html body .main-wrapper .vf-search-suggestion-card:hover {
  transform: translateY(-2px);
  border-color: rgba(76, 111, 255, 0.3);
  box-shadow: 0 14px 26px rgba(15, 23, 42, 0.1);
}

html body .main-wrapper .vf-search-suggestion-card span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 15px;
  background: linear-gradient(135deg, rgba(76, 111, 255, 0.12), rgba(34, 193, 238, 0.14));
  color: var(--vf-accent-strong, #2f6fe4);
  font-size: 1.05rem;
}

html body .main-wrapper .vf-search-suggestion-card strong {
  color: #22314a;
  font-size: 1rem;
  font-weight: 900;
  line-height: 1.2;
}

html body .main-wrapper .vf-search-suggestion-card em {
  color: #64748b;
  font-size: 0.86rem;
  font-style: normal;
  font-weight: 600;
  line-height: 1.4;
}

html body .main-wrapper .vf-support-empty {
  display: grid;
  justify-items: center;
  gap: 13px;
  margin: 0;
  padding: 42px 28px;
  border-radius: 0 0 18px 18px;
  background:
    radial-gradient(circle at top right, rgba(84, 214, 255, 0.1), transparent 30%),
    linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
  text-align: center;
}

html body .main-wrapper .vf-support-empty-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 62px;
  height: 62px;
  border-radius: 20px;
  background: linear-gradient(135deg, rgba(76, 111, 255, 0.12), rgba(34, 193, 238, 0.14));
  color: var(--vf-accent-strong, #2f6fe4);
  font-size: 1.25rem;
}

html body .main-wrapper .vf-support-empty-title {
  color: #22314a;
  font-size: 1.05rem;
  font-weight: 900;
  line-height: 1.2;
}

html body .main-wrapper .vf-support-empty-copy {
  max-width: 420px;
  color: #64748b;
  font-size: 0.92rem;
  line-height: 1.5;
}

html body .main-wrapper .vf-support-empty-action {
  min-height: 38px;
  margin-top: 5px;
  padding: 0 18px !important;
  border-radius: 999px !important;
  font-size: 0.78rem;
  font-weight: 850;
  letter-spacing: 0.02em;
  line-height: 38px !important;
  text-transform: uppercase;
}

@media (max-width: 767.98px) {
  html body .main-wrapper .vf-support-ticket-table-empty {
    overflow-x: hidden;
  }

  html body .main-wrapper .vf-support-ticket-table-empty .table {
    width: 100%;
    table-layout: fixed;
  }

  html body .main-wrapper .vf-support-ticket-table-empty thead {
    display: none;
  }

  html body .main-wrapper .vf-support-ticket-table-empty .vf-support-empty {
    padding: 34px 20px;
  }
}

html body.vf-page-packages .main-wrapper .page-content > .row {
  row-gap: 22px;
}

html body.vf-page-packages .main-wrapper .sg-offcanvas {
  margin-top: 18px !important;
}

html body.vf-page-packages .main-wrapper .vf-packages-hero .inner {
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas:
    "title"
    "copy";
  align-content: center;
  align-items: start;
  row-gap: 14px;
}

html body.vf-page-packages .main-wrapper .vf-packages-hero h2 {
  max-width: 720px !important;
}

html body.vf-page-packages .main-wrapper .vf-packages-hero .text-xlg,
html body.vf-page-packages .main-wrapper .vf-packages-hero p.text-xlg {
  max-width: 620px !important;
  margin: 0 !important;
}

html body.vf-page-packages .main-wrapper .page-content > .row > [class*="col-"] {
  display: block;
}

html body.vf-page-packages .main-wrapper .card-pricing {
  display: block;
  width: 100%;
  overflow: hidden;
  border: 1px solid rgba(148, 163, 184, 0.22) !important;
  border-radius: 20px !important;
  background:
    radial-gradient(circle at top right, rgba(84, 214, 255, 0.09), transparent 30%),
    linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.1) !important;
}

html body.vf-page-packages .main-wrapper .card-pricing .card-header {
  padding: 20px 20px 6px;
  border-bottom: 0;
}

html body.vf-page-packages .main-wrapper .card-pricing .card-header h3 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0;
  color: #172033 !important;
  font-size: 1.18rem;
  font-weight: 900;
  line-height: 1.25;
}

html body.vf-page-packages .main-wrapper .card-pricing .card-header .float-end {
  float: none !important;
  flex: 0 0 auto;
}

html body.vf-page-packages .main-wrapper .card-pricing .icon {
  width: 46px;
  height: 46px;
  max-width: 46px !important;
  border: 1px solid rgba(76, 111, 255, 0.16);
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(76, 111, 255, 0.12), rgba(34, 193, 238, 0.14));
  object-fit: cover;
}

html body.vf-page-packages .main-wrapper .card-pricing .card-body {
  padding: 10px 20px 18px;
  min-height: 0;
}

html body.vf-page-packages .main-wrapper .card-pricing .price {
  margin: 0;
  color: #0f172a;
  font-size: clamp(2rem, 3vw, 2.8rem);
  font-weight: 950;
  line-height: 1;
}

html body.vf-page-packages .main-wrapper .card-pricing .card-body .price + div {
  margin-top: 7px;
  color: #64748b;
  font-weight: 700;
}

html body.vf-page-packages .main-wrapper .card-pricing .list-group {
  display: block;
}

html body.vf-page-packages .main-wrapper .card-pricing .packages-permissions.collapse:not(.show) {
  display: none !important;
}

html body.vf-page-packages .main-wrapper .card-pricing .list-group-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 11px 20px;
  border-color: rgba(148, 163, 184, 0.14);
  color: #334155;
  font-weight: 650;
  line-height: 1.35;
}

html body.vf-page-packages .main-wrapper .card-pricing .list-group-item svg {
  flex: 0 0 auto;
  margin-right: 0 !important;
}

html body.vf-page-packages .main-wrapper .card-pricing .card-footer {
  margin-top: 0;
  padding: 18px 20px 20px;
  border-top: 1px solid rgba(148, 163, 184, 0.14);
}

html body.vf-page-packages .main-wrapper .card-pricing .btn-danger,
html body.vf-page-packages .main-wrapper .card-pricing .btn-primary {
  min-height: 42px;
  border: 0 !important;
  background: linear-gradient(135deg, var(--vf-accent, #4c6fff), #18bfa8) !important;
  box-shadow: 0 12px 24px rgba(76, 111, 255, 0.24);
  color: #ffffff !important;
  font-weight: 900;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

@media (min-width: 1200px) {
  html body:not(.n_chat) .main-wrapper > .page-header:not(.bank-transfer):not(.vf-sidebar-hero):not(.mini) {
    width: calc(100% + 75px);
    margin-right: -75px;
  }
}

@media (max-width: 575.98px) {
  html body .main-wrapper .vf-newsfeed-shell .vf-discover-hero {
    min-height: 0;
    border-radius: 20px !important;
  }

  html body .main-wrapper .vf-newsfeed-shell .vf-discover-hero .inner {
    min-height: 0;
    padding: 22px !important;
  }

  html body .main-wrapper .vf-newsfeed-shell .vf-discover-hero h2 {
    font-size: 2rem !important;
  }

  html body .main-wrapper .vf-newsfeed-shell .vf-discover-hero-meta span {
    width: 100%;
  }

  html body .main-wrapper .vf-newsfeed-shell .vf-discover-empty {
    padding: 28px 18px;
  }

  html body .main-wrapper .vf-saved-empty {
    margin: 14px auto 20px;
    padding: 30px 20px;
  }

  html body .main-wrapper .vf-search-empty {
    margin: 18px auto 24px;
    padding: 30px 20px;
  }

  html body .main-wrapper .vf-search-suggestions {
    margin: 18px auto 24px;
    padding: 22px;
  }

  html body .main-wrapper .vf-search-suggestions-grid {
    grid-template-columns: 1fr;
  }
}

/* Watch page */
html body .main-wrapper .vf-newsfeed-shell .vf-watch-hero {
  position: relative;
  min-height: 210px;
  overflow: hidden;
  border: 0 !important;
  border-radius: 22px !important;
  background:
    radial-gradient(circle at 86% 24%, rgba(84, 214, 255, 0.18), transparent 28%),
    radial-gradient(circle at 10% 8%, rgba(255, 255, 255, 0.12), transparent 24%),
    linear-gradient(110deg, #102b49 0%, #1f5b96 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 24px 54px rgba(12, 24, 43, 0.22) !important;
}

html body .main-wrapper .vf-newsfeed-shell .vf-watch-hero::before {
  content: "" !important;
  position: absolute;
  inset: 0;
  height: auto !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent 54%),
    radial-gradient(circle at 100% 100%, rgba(34, 193, 238, 0.18), transparent 34%) !important;
  pointer-events: none;
}

html body .main-wrapper .vf-newsfeed-shell .vf-watch-hero::after {
  content: "" !important;
  position: absolute;
  right: -62px;
  bottom: -88px;
  width: 250px;
  height: 250px;
  border: 32px solid rgba(255, 255, 255, 0.08);
  border-radius: 50%;
  pointer-events: none;
}

html body .main-wrapper .vf-newsfeed-shell .vf-watch-hero .inner {
  position: relative;
  z-index: 1;
  display: flex;
  min-height: 210px;
  max-width: 660px;
  flex-direction: column;
  justify-content: center;
  padding: 28px 34px !important;
  text-align: left;
}

html body .main-wrapper .vf-newsfeed-shell .vf-watch-eyebrow {
  margin-bottom: 8px;
  color: rgba(255, 255, 255, 0.78);
  font-size: 0.76rem;
  font-weight: 850;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

html body .main-wrapper .vf-newsfeed-shell .vf-watch-hero h2 {
  margin: 0 !important;
  color: #ffffff !important;
  font-size: clamp(2rem, 3vw, 3rem) !important;
  font-weight: 900 !important;
  line-height: 1.02 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  text-shadow: 0 2px 12px rgba(6, 16, 44, 0.22);
}

html body .main-wrapper .vf-newsfeed-shell .vf-watch-hero p {
  max-width: 590px;
  margin: 12px 0 0 !important;
  color: rgba(255, 255, 255, 0.9) !important;
  font-size: 0.98rem !important;
  font-weight: 650 !important;
  line-height: 1.45 !important;
  text-shadow: 0 1px 8px rgba(6, 16, 44, 0.18);
}

html body .main-wrapper .vf-newsfeed-shell .vf-watch-hero-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 20px;
}

html body .main-wrapper .vf-newsfeed-shell .vf-watch-hero-meta span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  padding: 0 13px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.12);
  color: rgba(255, 255, 255, 0.92);
  font-size: 0.78rem;
  font-weight: 850;
  backdrop-filter: blur(10px);
}

html body .main-wrapper .vf-newsfeed-shell .vf-watch-hero + .vf-posts-filter {
  min-height: 58px;
  margin-bottom: 12px !important;
  padding: 10px 14px !important;
  border: 1px solid var(--vf-border, rgba(148, 163, 184, 0.24)) !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%) !important;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.1) !important;
}

html body .main-wrapper .vf-newsfeed-shell .vf-watch-hero + .vf-posts-filter > span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  color: #22314a;
  font-size: 0.9rem;
  font-weight: 900;
  letter-spacing: 0.02em;
}

html body .main-wrapper .vf-newsfeed-shell .vf-watch-hero + .vf-posts-filter > span::before {
  content: "\\f144";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 12px;
  background: rgba(76, 111, 255, 0.1);
  color: var(--vf-accent-strong, #2f6fe4);
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  letter-spacing: 0;
}

html body .main-wrapper .vf-newsfeed-shell .vf-watch-hero + .vf-posts-filter .countries-filter,
html body .main-wrapper .vf-newsfeed-shell .vf-watch-hero + .vf-posts-filter .btn-group .btn {
  min-height: 36px;
  border-radius: 999px !important;
  font-weight: 850;
}

@media (max-width: 575.98px) {
  html body .main-wrapper .vf-newsfeed-shell .vf-watch-hero {
    min-height: 0;
    border-radius: 20px !important;
  }

  html body .main-wrapper .vf-newsfeed-shell .vf-watch-hero .inner {
    min-height: 0;
    padding: 22px !important;
  }

  html body .main-wrapper .vf-newsfeed-shell .vf-watch-hero h2 {
    font-size: 2rem !important;
  }

  html body .main-wrapper .vf-newsfeed-shell .vf-watch-hero-meta span {
    width: 100%;
  }
}

/* Directory family: People, Dating, Pages, Groups, Events */
html body .main-wrapper .vf-directory-hero.page-header {
  position: relative;
  width: min(calc(100% - 48px), 1320px) !important;
  max-width: calc(100% - 48px) !important;
  overflow: hidden;
  margin: 18px auto 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 24px !important;
  background:
    radial-gradient(circle at 86% 24%, rgba(84, 214, 255, 0.18), transparent 28%),
    radial-gradient(circle at 10% 8%, rgba(255, 255, 255, 0.12), transparent 24%),
    linear-gradient(110deg, #102b49 0%, #1f5b96 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 24px 54px rgba(12, 24, 43, 0.18) !important;
}

html body .main-wrapper .vf-directory-hero.page-header::before {
  content: "" !important;
  position: absolute;
  inset: 0;
  height: auto !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent 54%),
    radial-gradient(circle at 100% 100%, rgba(34, 193, 238, 0.18), transparent 34%) !important;
  pointer-events: none;
}

html body .main-wrapper .vf-directory-hero.page-header::after {
  content: "" !important;
  position: absolute;
  right: -62px;
  bottom: -88px;
  width: 250px;
  height: 250px;
  border: 32px solid rgba(255, 255, 255, 0.08);
  border-radius: 50%;
  pointer-events: none;
}

html body .main-wrapper .vf-directory-hero .floating-img,
html body .main-wrapper .vf-directory-hero .circle-2,
html body .main-wrapper .vf-directory-hero .circle-3 {
  display: none !important;
}

html body .main-wrapper .vf-directory-hero .container,
html body .main-wrapper .vf-directory-hero .container-fluid {
  position: relative;
  z-index: 1;
  max-width: 1320px;
  min-height: 230px;
  padding: 28px 34px 30px;
  text-align: left !important;
}

html body .main-wrapper .vf-directory-hero .vf-events-hero-kicker {
  display: inline-flex;
  margin: 0 0 10px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: rgba(255, 255, 255, 0.78) !important;
  font-size: 0.76rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.14em !important;
  line-height: 1.2;
  text-transform: uppercase;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

html body .main-wrapper .vf-directory-hero .vf-events-hero-kicker::before {
  width: 8px !important;
  height: 8px !important;
  margin-right: 2px;
  background: #7ce8d2 !important;
  box-shadow: 0 0 0 6px rgba(124, 232, 210, 0.14) !important;
}

html body .main-wrapper .vf-directory-hero h2 {
  width: auto !important;
  max-width: 760px;
  margin: 0 !important;
  color: #ffffff !important;
  font-size: clamp(2.1rem, 3.8vw, 3.35rem) !important;
  font-weight: 900 !important;
  line-height: 1.02 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  text-shadow: 0 2px 12px rgba(6, 16, 44, 0.22);
}

html body .main-wrapper .vf-directory-hero .vf-events-hero-subtitle,
html body .main-wrapper .vf-directory-hero p.text-xlg.vf-events-hero-subtitle {
  max-width: 620px !important;
  margin: 12px 0 0 !important;
  color: rgba(255, 255, 255, 0.9) !important;
  font-size: 1rem !important;
  font-weight: 650 !important;
  line-height: 1.5 !important;
  text-align: left !important;
  text-shadow: 0 1px 8px rgba(6, 16, 44, 0.18);
}

html body .main-wrapper .vf-directory-hero .vf-events-hero-stats {
  display: flex !important;
  flex-wrap: wrap;
  gap: 8px;
  max-width: 760px !important;
  margin: 16px 0 0 !important;
}

html body .main-wrapper .vf-directory-hero .vf-events-hero-stat {
  display: inline-grid;
  grid-template-columns: auto auto;
  grid-template-areas:
    "value label"
    "value note";
  align-items: center;
  column-gap: 9px;
  flex: 0 1 auto;
  min-width: 0;
  max-width: 240px;
  padding: 7px 11px !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.1) !important;
  color: #ffffff !important;
  text-align: left;
  backdrop-filter: blur(10px);
}

html body .main-wrapper .vf-directory-hero .vf-events-hero-stat strong {
  grid-area: value;
  color: #ffffff !important;
  font-size: 0.9rem !important;
  font-weight: 900;
  line-height: 1;
}

html body .main-wrapper .vf-directory-hero .vf-events-hero-stat span,
html body .main-wrapper .vf-directory-hero .vf-events-hero-stat em {
  display: block;
  margin-top: 0;
  color: rgba(255, 255, 255, 0.82) !important;
  font-size: 0.64rem !important;
  font-style: normal;
  font-weight: 850;
  letter-spacing: 0.04em;
  line-height: 1.1;
  text-transform: uppercase;
}

html body .main-wrapper .vf-directory-hero .vf-events-hero-stat span {
  grid-area: label;
}

html body .main-wrapper .vf-directory-hero .vf-events-hero-stat em {
  grid-area: note;
  color: rgba(255, 255, 255, 0.66) !important;
  font-size: 0.62rem !important;
  font-weight: 650;
  letter-spacing: 0;
  text-transform: none;
}

html body .main-wrapper .vf-directory-hero .vf-events-hero-search {
  max-width: 540px !important;
  margin: 18px 0 0 !important;
}

html body .main-wrapper .vf-directory-hero .vf-events-hero-search .mx-sm-auto {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

html body .main-wrapper .vf-directory-hero .vf-events-hero-search .input-group {
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.22) !important;
  border-radius: 16px !important;
  background: rgba(8, 20, 36, 0.22) !important;
  box-shadow: 0 14px 28px rgba(6, 12, 20, 0.16) !important;
  backdrop-filter: blur(10px);
}

html body .main-wrapper .vf-directory-hero .vf-events-hero-search .form-control {
  min-height: 44px !important;
  border: 0 !important;
  background: transparent !important;
  color: #ffffff !important;
  box-shadow: none !important;
}

html body .main-wrapper .vf-directory-hero .vf-events-hero-search .form-control::placeholder {
  color: rgba(255, 255, 255, 0.74) !important;
}

html body .main-wrapper .vf-directory-hero .vf-events-hero-search .btn {
  min-height: 44px !important;
  border: 0 !important;
  background: linear-gradient(135deg, var(--vf-accent, #4c6fff), var(--vf-accent-strong, #2f6fe4)) !important;
  color: #ffffff !important;
  padding-right: 22px !important;
  padding-left: 22px !important;
  font-weight: 850 !important;
}

@media (min-width: 992px) {
  html body .main-wrapper .vf-directory-hero .container,
  html body .main-wrapper .vf-directory-hero .container-fluid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(340px, 430px);
    grid-template-areas:
      "kicker tools"
      "title tools"
      "copy search";
    column-gap: 46px;
    align-items: center;
  }

  html body .main-wrapper .vf-directory-hero .vf-events-hero-kicker {
    grid-area: kicker;
    align-self: end;
  }

  html body .main-wrapper .vf-directory-hero h2 {
    grid-area: title;
    align-self: center;
  }

  html body .main-wrapper .vf-directory-hero .vf-events-hero-subtitle,
  html body .main-wrapper .vf-directory-hero p.text-xlg.vf-events-hero-subtitle {
    grid-area: copy;
    align-self: start;
  }

  html body .main-wrapper .vf-directory-hero .vf-events-hero-stats {
    grid-area: tools;
    align-self: end;
    display: grid !important;
    grid-template-columns: 1fr;
    gap: 10px;
    width: 100%;
    max-width: none !important;
    margin: 0 !important;
  }

  html body .main-wrapper .vf-directory-hero .vf-events-hero-stat {
    display: grid;
    width: 100%;
    max-width: none;
    min-height: 50px;
  }

  html body .main-wrapper .vf-directory-hero .vf-events-hero-search {
    grid-area: search;
    align-self: start;
    width: 100%;
    max-width: none !important;
    margin: 14px 0 0 !important;
  }

  html body .main-wrapper .vf-people-hero .vf-events-hero-stats {
    grid-template-columns: repeat(3, minmax(112px, 1fr));
    gap: 12px;
  }

  html body .main-wrapper .vf-people-hero .vf-events-hero-stat {
    display: flex !important;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    min-height: 52px;
    padding: 9px 13px !important;
  }

  html body .main-wrapper .vf-people-hero .vf-events-hero-stat strong,
  html body .main-wrapper .vf-people-hero .vf-events-hero-stat span {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  html body .main-wrapper .vf-people-hero .vf-events-hero-stat span {
    margin-top: 4px;
  }

  html body .main-wrapper .vf-directory-hero:not(.vf-people-hero):not(.vf-pages-hero):not(.vf-groups-hero):not(.vf-dating-hero) .vf-events-hero-stat {
    display: block;
    min-height: 68px;
    padding: 11px 14px !important;
    border-radius: 18px !important;
  }

  html body .main-wrapper .vf-directory-hero:not(.vf-people-hero):not(.vf-pages-hero):not(.vf-groups-hero):not(.vf-dating-hero) .vf-events-hero-stat strong {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  html body .main-wrapper .vf-directory-hero:not(.vf-people-hero):not(.vf-pages-hero):not(.vf-groups-hero):not(.vf-dating-hero) .vf-events-hero-stat span {
    display: block;
    margin-top: 6px;
    font-size: 0.62rem !important;
    letter-spacing: 0.04em;
    white-space: nowrap;
  }
}

html body .main-wrapper .vf-directory-shell {
  position: relative;
}

html body .main-wrapper .vf-directory-hero + .vf-directory-shell {
  margin-top: 18px !important;
}

html body .main-wrapper .vf-directory-shell .content-tabs {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  overflow: visible;
  margin-bottom: 18px !important;
  padding: 8px 10px !important;
  border: 1px solid var(--vf-border, rgba(148, 163, 184, 0.24)) !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, 0.96) !important;
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.12) !important;
}

html body .main-wrapper .vf-directory-shell .content-tabs ul {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
  flex: 1 1 auto;
}

html body .main-wrapper .vf-directory-shell .content-tabs li {
  float: none !important;
}

html body .main-wrapper .vf-directory-shell .content-tabs li a {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  padding: 0 13px !important;
  border-radius: 999px !important;
  color: #52627a !important;
  font-size: 0.82rem;
  font-weight: 850;
  text-decoration: none !important;
}

html body .main-wrapper .vf-directory-shell .content-tabs li.active a {
  background: linear-gradient(135deg, var(--vf-accent, #4c6fff), var(--vf-accent-strong, #2f6fe4)) !important;
  color: #ffffff !important;
  box-shadow: 0 10px 20px rgba(76, 111, 255, 0.22);
}

html body .main-wrapper .vf-directory-shell .content-tabs .float-end {
  float: none !important;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex: 0 0 auto;
  margin-top: 0 !important;
  margin-left: auto !important;
}

html body .main-wrapper .vf-directory-shell .content-tabs .btn {
  min-height: 38px;
  border-radius: 999px !important;
  font-size: 0.78rem;
  font-weight: 850;
}

html body .main-wrapper .vf-directory-shell .posts-filter,
html body .main-wrapper .vf-directory-shell .card {
  border: 1px solid var(--vf-border, rgba(148, 163, 184, 0.24)) !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%) !important;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.1) !important;
}

html body .main-wrapper .vf-directory-shell .posts-filter {
  min-height: 58px;
  margin-bottom: 14px !important;
  padding: 10px 14px !important;
}

html body .main-wrapper .vf-directory-shell .posts-filter > span {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  color: #22314a;
  font-size: 0.92rem;
  font-weight: 900;
}

html body .main-wrapper .vf-directory-shell .posts-filter .countries-filter,
html body .main-wrapper .vf-directory-shell .posts-filter .btn,
html body .main-wrapper .vf-directory-shell .vf-events-view-switch a,
html body .main-wrapper .vf-directory-shell .vf-events-date-filter .form-control {
  min-height: 36px;
  border-radius: 999px !important;
  font-weight: 850;
}

html body .main-wrapper .vf-directory-shell .side-nav li a {
  border-radius: 12px;
  font-weight: 750;
}

html body .main-wrapper .vf-directory-shell .side-nav li.active a {
  background: rgba(76, 111, 255, 0.1) !important;
  color: var(--vf-accent-strong, #2f6fe4) !important;
}

html body .main-wrapper .vf-directory-shell .feeds-item {
  margin-bottom: 10px;
  padding: 12px !important;
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.82);
}

html body .main-wrapper .vf-directory-shell .feeds-item .data-avatar img {
  border: 2px solid #ffffff;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.12);
}

html body .main-wrapper .vf-directory-shell .card-header {
  min-height: 56px;
  padding: 16px 18px !important;
  color: #22314a !important;
  font-weight: 900;
}

html body .main-wrapper .vf-directory-shell .card-body {
  padding: 18px !important;
}

html body .main-wrapper .vf-directory-shell .form-label {
  color: #475569;
  font-size: 0.78rem;
  font-weight: 850;
}

html body .main-wrapper .vf-directory-shell .form-control,
html body .main-wrapper .vf-directory-shell .form-select {
  min-height: 42px;
  border-radius: 12px !important;
}

html body .main-wrapper .vf-directory-shell .text-center.text-muted {
  padding: 28px 18px;
  border: 1px dashed rgba(148, 163, 184, 0.28);
  border-radius: 16px;
  background: rgba(248, 251, 255, 0.74);
}

@media (max-width: 767.98px) {
  html body .main-wrapper .vf-directory-hero.page-header {
    padding: 30px 0 28px !important;
  }

  html body .main-wrapper .vf-directory-hero h2 {
    font-size: 2.1rem !important;
  }

  html body .main-wrapper .vf-directory-hero .vf-events-hero-stats {
    display: grid !important;
    grid-template-columns: 1fr;
  }

  html body .main-wrapper .vf-directory-hero .vf-events-hero-search .input-group {
    border-radius: 18px !important;
  }

  html body .main-wrapper .vf-directory-hero .vf-events-hero-search .btn {
    padding-right: 16px !important;
    padding-left: 16px !important;
  }

  html body .main-wrapper .vf-directory-shell .content-tabs {
    padding: 8px !important;
  }

  html body .main-wrapper .vf-directory-shell .content-tabs ul {
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 2px;
  }

  html body .main-wrapper .vf-directory-shell .content-tabs li {
    flex: 0 0 auto;
  }

  html body .main-wrapper .vf-directory-shell .content-tabs .float-end {
    float: none !important;
    margin-top: 8px !important;
  }

  html body .main-wrapper .vf-directory-shell .posts-filter .float-end {
    float: none !important;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 8px;
  }
}

/* Blogs landing header */
html body .main-wrapper .vf-blogs-hero.page-header {
  position: relative;
  width: min(calc(100% - 48px), 1320px) !important;
  max-width: calc(100% - 48px) !important;
  overflow: hidden;
  margin: 18px auto 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 24px !important;
  background:
    radial-gradient(circle at 88% 24%, rgba(84, 214, 255, 0.18), transparent 28%),
    radial-gradient(circle at 10% 8%, rgba(255, 255, 255, 0.12), transparent 24%),
    linear-gradient(110deg, #102b49 0%, #1f5b96 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 24px 54px rgba(12, 24, 43, 0.18) !important;
}

html body .main-wrapper .vf-blogs-hero.page-header::before {
  content: "" !important;
  position: absolute;
  inset: 0;
  height: auto !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent 54%),
    radial-gradient(circle at 100% 100%, rgba(34, 193, 238, 0.18), transparent 34%) !important;
  pointer-events: none;
}

html body .main-wrapper .vf-blogs-hero.page-header::after {
  content: "" !important;
  position: absolute;
  right: -62px;
  bottom: -88px;
  width: 250px;
  height: 250px;
  border: 32px solid rgba(255, 255, 255, 0.08);
  border-radius: 50%;
  pointer-events: none;
}

html body .main-wrapper .vf-blogs-hero .floating-img,
html body .main-wrapper .vf-blogs-hero .circle-2,
html body .main-wrapper .vf-blogs-hero .circle-3 {
  display: none !important;
}

html body .main-wrapper .vf-blogs-hero .container,
html body .main-wrapper .vf-blogs-hero .container-fluid {
  position: relative;
  z-index: 1;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(340px, 430px);
  grid-template-areas:
    "kicker stats"
    "title stats"
    "copy search";
  column-gap: 46px;
  align-items: center;
  min-height: 250px;
  max-width: 1320px;
  padding: 30px 34px !important;
  text-align: left !important;
}

html body .main-wrapper .vf-blogs-hero .vf-events-hero-kicker {
  grid-area: kicker;
  align-self: end;
  display: inline-flex;
  margin: 0 0 10px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: rgba(255, 255, 255, 0.78) !important;
  font-size: 0.76rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.14em !important;
  line-height: 1.2;
  text-transform: uppercase;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

html body .main-wrapper .vf-blogs-hero .vf-events-hero-kicker::before {
  width: 8px !important;
  height: 8px !important;
  margin-right: 2px;
  background: #7ce8d2 !important;
  box-shadow: 0 0 0 6px rgba(124, 232, 210, 0.14) !important;
}

html body .main-wrapper .vf-blogs-hero h2 {
  grid-area: title;
  width: auto !important;
  margin: 0 !important;
  color: #ffffff !important;
  font-size: clamp(2.1rem, 3.8vw, 3.35rem) !important;
  font-weight: 900 !important;
  line-height: 1.02 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  text-shadow: 0 2px 12px rgba(6, 16, 44, 0.22);
}

html body .main-wrapper .vf-blogs-hero .vf-events-hero-subtitle,
html body .main-wrapper .vf-blogs-hero p.text-xlg.vf-events-hero-subtitle {
  grid-area: copy;
  max-width: 620px !important;
  margin: 12px 0 0 !important;
  color: rgba(255, 255, 255, 0.9) !important;
  font-size: 1rem !important;
  font-weight: 650 !important;
  line-height: 1.5 !important;
  text-align: left !important;
  text-shadow: 0 1px 8px rgba(6, 16, 44, 0.18);
}

html body .main-wrapper .vf-blogs-hero .vf-events-hero-stats {
  grid-area: stats;
  align-self: end;
  display: grid !important;
  grid-template-columns: 1fr;
  gap: 10px;
  width: 100%;
  max-width: none !important;
  margin: 0 !important;
}

html body .main-wrapper .vf-blogs-hero .vf-events-hero-stat {
  display: inline-grid;
  grid-template-columns: auto auto;
  grid-template-areas:
    "value label";
  align-items: center;
  justify-content: start;
  column-gap: 10px;
  width: 100%;
  min-height: 46px;
  padding: 8px 13px !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.1) !important;
  color: #ffffff !important;
  text-align: left;
  backdrop-filter: blur(10px);
}

html body .main-wrapper .vf-blogs-hero .vf-events-hero-stat strong {
  grid-area: value;
  color: #ffffff !important;
  font-size: 0.92rem !important;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
}

html body .main-wrapper .vf-blogs-hero .vf-events-hero-stat span {
  grid-area: label;
  margin: 0;
  color: rgba(255, 255, 255, 0.78) !important;
  font-size: 0.64rem !important;
  font-weight: 850;
  letter-spacing: 0.05em;
  line-height: 1.1;
  text-transform: uppercase;
  white-space: nowrap;
}

html body .main-wrapper .vf-blogs-hero .vf-events-hero-search {
  grid-area: search;
  align-self: start;
  width: 100%;
  max-width: none !important;
  margin: 14px 0 0 !important;
}

html body .main-wrapper .vf-blogs-hero .vf-events-hero-search .mx-sm-auto {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

html body .main-wrapper .vf-blogs-hero .vf-events-hero-search .input-group {
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.22) !important;
  border-radius: 16px !important;
  background: rgba(8, 20, 36, 0.22) !important;
  box-shadow: 0 14px 28px rgba(6, 12, 20, 0.16) !important;
  backdrop-filter: blur(10px);
}

html body .main-wrapper .vf-blogs-hero .vf-events-hero-search .form-control {
  min-height: 44px !important;
  border: 0 !important;
  background: transparent !important;
  color: #ffffff !important;
  box-shadow: none !important;
}

html body .main-wrapper .vf-blogs-hero .vf-events-hero-search .form-control::placeholder {
  color: rgba(255, 255, 255, 0.74) !important;
}

html body .main-wrapper .vf-blogs-hero .vf-events-hero-search .btn {
  min-height: 44px !important;
  border: 0 !important;
  background: linear-gradient(135deg, var(--vf-accent, #4c6fff), var(--vf-accent-strong, #2f6fe4)) !important;
  color: #ffffff !important;
  padding-right: 22px !important;
  padding-left: 22px !important;
  font-weight: 850 !important;
}

html body .main-wrapper .vf-blogs-hero + .vf-blogs-shell {
  margin-top: 18px !important;
}

@media (max-width: 767.98px) {
  html body .main-wrapper .vf-blogs-hero.page-header {
    width: min(calc(100% - 24px), 1320px) !important;
    max-width: calc(100% - 24px) !important;
  }

  html body .main-wrapper .vf-blogs-hero .container,
  html body .main-wrapper .vf-blogs-hero .container-fluid {
    display: block !important;
    min-height: 0;
    padding: 24px !important;
  }

  html body .main-wrapper .vf-blogs-hero h2 {
    font-size: 2.1rem !important;
  }

  html body .main-wrapper .vf-blogs-hero .vf-events-hero-stats {
    margin-top: 18px !important;
  }
}

/* Reels: keep the surface immersive instead of mixing with directory chrome. */
html body.vf-page-reels,
html body.vf-page-reels .main-wrapper {
  overflow-x: hidden !important;
}

html body.vf-page-reels .main-wrapper .vf-reels-hero {
  display: none !important;
}

html body.vf-page-reels .main-wrapper .vf-reels-shell {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body.vf-page-reels .main-wrapper .vf-reels-shell > .row,
html body.vf-page-reels .main-wrapper .vf-reels-shell .sg-offcanvas-mainbar {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body.vf-page-reels .main-wrapper .vf-reels-shell .sg-offcanvas-sidebar,
html body.vf-page-reels .main-wrapper .vf-reels-shell .ads-campaigns,
html body.vf-page-reels .main-wrapper .vf-reels-shell .ads,
html body.vf-page-reels .main-wrapper .vf-reels-shell .card:not(.reel-comments-wrapper .card) {
  display: none !important;
}

html body.vf-page-reels .reels-wrapper {
  top: 70px !important;
  z-index: 40 !important;
  background: #07090d !important;
  color-scheme: dark;
  overscroll-behavior: contain;
  touch-action: pan-y;
}

html body.vf-page-reels .reels-wrapper::before {
  content: "";
  position: fixed;
  inset: 70px 0 0;
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(90deg, #050609 0%, #0b0e14 50%, #050609 100%);
}

html body.vf-page-reels .vf-reels-floating-actions {
  position: fixed;
  top: 88px;
  left: 18px;
  z-index: 90;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  max-width: min(360px, calc(100vw - 36px));
  pointer-events: auto;
}

html body.vf-page-reels .vf-reels-floating-actions .btn,
.vf-reels-hero-actions .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 38px;
  border-radius: 999px;
  font-weight: 850;
  line-height: 1;
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.24);
}

html body.vf-page-reels .vf-reels-floating-actions .btn-light,
.vf-reels-hero-actions .btn-light {
  border-color: rgba(255, 255, 255, 0.2);
  background: rgba(255, 255, 255, 0.16);
  color: #fff;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.vf-reels-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
}

html body.vf-page-reels .reel-container {
  padding-top: 70px !important;
  background: transparent !important;
}

html body.vf-page-reels .reel-video-wrapper {
  align-items: center;
  justify-content: center;
}

html body.vf-page-reels .reel-video-wrapper .reel-video-container {
  width: min(430px, calc(100vw - 142px)) !important;
  max-width: 430px !important;
  height: calc(100dvh - 94px) !important;
  max-height: 820px;
  margin: 12px auto !important;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 24px;
  background: #000;
  box-shadow: 0 28px 70px rgba(0, 0, 0, 0.48);
}

html body.vf-page-reels .reel-video-wrapper .reel-video-container .plyr--video,
html body.vf-page-reels .reel-video-wrapper .reel-video-container video {
  height: 100% !important;
  border-radius: inherit;
}

html body.vf-page-reels .reel-video-wrapper .reel-video-container .video-caption {
  right: 0 !important;
  padding: 46px 16px 18px !important;
  background: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, 0.84) 72%, rgba(0, 0, 0, 0.96) 100%) !important;
}

html body.vf-page-reels .reel-video-wrapper .reel-video-container .video-controlls {
  right: -76px !important;
  bottom: 28px !important;
}

html body.vf-page-reels .reel-actions {
  gap: 12px;
}

html body.vf-page-reels .reel-actions .post-avatar .post-avatar-picture {
  min-width: 52px;
  min-height: 52px;
  border: 2px solid rgba(255, 255, 255, 0.88);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.35);
}

html body.vf-page-reels .reel-actions .action-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  background: rgba(255, 255, 255, 0.12) !important;
  box-shadow: 0 12px 26px rgba(0, 0, 0, 0.26);
  backdrop-filter: blur(12px);
}

html body.vf-page-reels .reel-actions .action-btn:hover {
  background: rgba(255, 255, 255, 0.2) !important;
}

html body.vf-page-reels .reel-action-btn span {
  color: rgba(255, 255, 255, 0.9);
  font-weight: 850;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.55);
}

html body.vf-page-reels .reel-next-btn,
html body.vf-page-reels .reel-prev-btn,
html body.vf-page-reels .reel-video-wrapper .reel-close-btn {
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
  background: rgba(255, 255, 255, 0.12) !important;
  color: #ffffff !important;
  box-shadow: 0 12px 26px rgba(0, 0, 0, 0.26);
  backdrop-filter: blur(12px);
}

html body.vf-page-reels .reel-next-btn,
html body.vf-page-reels .reel-prev-btn {
  right: calc(50% - 305px) !important;
}

html body.vf-page-reels .reel-comments-wrapper {
  z-index: 2;
  border-left: 1px solid rgba(148, 163, 184, 0.24);
  box-shadow: -20px 0 50px rgba(0, 0, 0, 0.28);
}

@media (max-width: 767.98px) {
  html body.vf-page-reels .reels-wrapper {
    top: 70px !important;
  }

  html body.vf-page-reels .vf-reels-floating-actions {
    top: 82px;
    left: 12px;
    max-width: calc(100vw - 94px);
  }

  html body.vf-page-reels .vf-reels-floating-actions .btn {
    width: 42px;
    min-width: 42px;
    height: 42px;
    min-height: 42px;
    padding: 0;
  }

  html body.vf-page-reels .vf-reels-floating-actions .btn span {
    display: none;
  }

  html body.vf-page-reels .reel-container {
    padding-top: 70px !important;
  }

  html body.vf-page-reels .reel-video-wrapper .reel-video-container {
    width: 100vw !important;
    max-width: none !important;
    height: calc(100dvh - 70px) !important;
    max-height: none;
    margin: 0 !important;
    border: 0;
    border-radius: 0;
  }

  html body.vf-page-reels .reel-video-wrapper .reel-video-container .video-controlls {
    right: 14px !important;
    bottom: 22px !important;
  }

  html body.vf-page-reels .reel-actions .action-btn {
    width: 46px;
    height: 46px;
  }
}

html body .main-wrapper .vf-guide-page .vf-guide-stat {
  border: 1px solid rgba(255, 255, 255, 0.24) !important;
  background: rgba(255, 255, 255, 0.13) !important;
  color: #ffffff !important;
}

html body .main-wrapper .vf-guide-page .vf-guide-stat span {
  color: rgba(255, 255, 255, 0.82) !important;
}

.main-wrapper .page-header:not(.bank-transfer) .vf-events-hero-stat em {
  display: block;
  margin-top: 4px;
  color: rgba(255, 255, 255, 0.72);
  font-size: 0.72rem;
  font-style: normal;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
}

/* Keep page hero decorations fluid instead of off-canvas. */
.main-wrapper .page-header:not(.bank-transfer) {
  overflow: hidden !important;
}

.main-wrapper .page-header:not(.bank-transfer) .circle-2 {
  right: clamp(-150px, -9vw, -56px) !important;
  width: clamp(220px, 28vw, 420px) !important;
  height: clamp(220px, 28vw, 420px) !important;
}

.main-wrapper .page-header:not(.bank-transfer) .circle-3 {
  left: clamp(-170px, -10vw, -64px) !important;
  width: clamp(220px, 30vw, 440px) !important;
  height: clamp(220px, 30vw, 440px) !important;
}

.main-wrapper .page-header.vf-events-hero {
  isolation: isolate;
}

@media (max-width: 767.98px) {
  .main-wrapper .page-header:not(.bank-transfer) .circle-2,
  .main-wrapper .page-header:not(.bank-transfer) .circle-3 {
    opacity: 0.14 !important;
  }
}

/* Blog article polish */
.main-wrapper .blog-wrapper .vf-blog-title {
  max-width: 900px;
  margin: 2px 0 14px;
  color: #111827;
  font-size: clamp(1.9rem, 2.45vw, 2.65rem);
  line-height: 1.08;
  font-weight: 800 !important;
  letter-spacing: 0;
  text-wrap: balance;
}

.main-wrapper .blog-wrapper .vf-blog-kicker {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 26px;
  color: #94a3b8;
  font-size: 0.74rem;
}

.main-wrapper .blog-wrapper .vf-blog-kicker .fa {
  font-size: 0.72rem;
}

.main-wrapper .blog-wrapper .vf-blog-kicker-pill {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 5px 10px;
  border: 1px solid rgba(47, 107, 255, 0.12);
  border-radius: 999px;
  background: rgba(47, 107, 255, 0.06);
  color: #2457d6;
  font-size: 0.72rem;
  font-weight: 800;
  line-height: 1;
  text-decoration: none;
}

.main-wrapper .blog-wrapper .vf-blog-kicker-pill:hover {
  border-color: rgba(47, 107, 255, 0.22);
  background: rgba(47, 107, 255, 0.1);
  color: #1745ad;
}

.main-wrapper .blog-wrapper .post-meta a {
  color: #0f766e;
  font-weight: 700;
}

.main-wrapper .blog-wrapper .post-time {
  margin-top: 3px;
  color: #94a3b8;
  font-size: 0.84rem;
  line-height: 1.35;
}

.main-wrapper .blog-wrapper .blog-meta-counter {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 36px;
  margin-left: 6px;
  margin-bottom: 0;
  padding: 7px 13px;
  border-radius: 12px;
  background: #f6f8fb;
  color: #475569;
  font-size: 0.84rem;
  font-weight: 700;
  line-height: 1;
}

.main-wrapper .blog-wrapper .blog-meta-counter:hover {
  background: #eef3f8;
  color: #17365a;
}

.main-wrapper .blog-wrapper > .mb20 img.img-fluid {
  border-radius: 0;
}

body.night-mode .main-wrapper .blog-wrapper .vf-blog-title {
  color: #f8fafc;
}

body.night-mode .main-wrapper .blog-wrapper .vf-blog-kicker {
  color: #64748b;
}

body.night-mode .main-wrapper .blog-wrapper .vf-blog-kicker-pill {
  border-color: rgba(110, 229, 194, 0.2);
  background: rgba(110, 229, 194, 0.1);
  color: #a7f3eb;
}

body.night-mode .main-wrapper .blog-wrapper .post-meta a {
  color: #7dd3fc;
}

body.night-mode .main-wrapper .blog-wrapper .post-time {
  color: #94a3b8;
}

body.night-mode .main-wrapper .blog-wrapper .blog-meta-counter {
  background: rgba(148, 163, 184, 0.1);
  color: #cbd5e1;
}

@media (max-width: 767.98px) {
  .main-wrapper .blog-wrapper {
    padding: 22px 18px;
  }

  .main-wrapper .blog-wrapper .vf-blog-title {
    margin-bottom: 12px;
    font-size: clamp(1.55rem, 7vw, 2rem);
    line-height: 1.12;
  }

  .main-wrapper .blog-wrapper .vf-blog-kicker {
    margin-bottom: 22px;
    gap: 8px;
  }

  .main-wrapper .blog-wrapper .blog-meta-counter {
    min-height: 34px;
    margin-left: 0;
    margin-right: 6px;
    padding: 7px 11px;
  }
}

/* Blog listing cards */
.main-wrapper .blogs-wrapper .blog-container {
  border: 1px solid rgba(15, 23, 42, 0.08);
  background: #ffffff;
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.08);
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.main-wrapper .blogs-wrapper .blog-container:hover {
  transform: translateY(-2px);
  border-color: rgba(47, 107, 255, 0.16);
  box-shadow: 0 18px 42px rgba(15, 23, 42, 0.12);
}

.main-wrapper .blogs-wrapper .blog-container.primary {
  background: #ffffff;
}

.main-wrapper .blogs-wrapper .blog-container.primary .blog-image {
  position: relative;
}

.main-wrapper .blogs-wrapper .vf-featured-ribbon {
  position: absolute;
  top: 18px;
  left: -38px;
  z-index: 2;
  width: 150px;
  padding: 8px 0;
  transform: rotate(-45deg);
  background: linear-gradient(135deg, #24d39b 0%, #1697d6 100%);
  color: #ffffff;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.24);
  font-size: 0.68rem;
  font-weight: 900;
  line-height: 1;
  letter-spacing: 0.14em;
  text-align: center;
  text-transform: uppercase;
  pointer-events: none;
}

.main-wrapper .blogs-wrapper .vf-featured-ribbon::before,
.main-wrapper .blogs-wrapper .vf-featured-ribbon::after {
  content: "";
  position: absolute;
  bottom: -5px;
  border-top: 5px solid rgba(14, 76, 116, 0.72);
}

.main-wrapper .blogs-wrapper .vf-featured-ribbon::before {
  left: 0;
  border-left: 5px solid transparent;
}

.main-wrapper .blogs-wrapper .vf-featured-ribbon::after {
  right: 0;
  border-right: 5px solid transparent;
}

@media (min-width: 768px) {
  .main-wrapper .blogs-wrapper .blog-container.primary {
    display: grid;
    grid-template-columns: minmax(320px, 0.95fr) minmax(0, 1.05fr);
    height: auto;
    min-height: 410px;
  }

  .main-wrapper .blogs-wrapper .blog-container.primary .blog-image {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 410px;
  }

  .main-wrapper .blogs-wrapper .blog-container.primary .blog-image img {
    display: block;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    object-fit: cover;
  }
}

.main-wrapper .blogs-wrapper .blog-content {
  padding: 18px;
}

.main-wrapper .blogs-wrapper .blog-content h3 {
  color: #111827;
  font-size: 1.08rem;
  font-weight: 800;
  line-height: 1.16;
  letter-spacing: 0;
  text-transform: none;
  text-wrap: balance;
  -webkit-box-orient: vertical;
}

.main-wrapper .blogs-wrapper .blog-content .text {
  color: #64748b;
  font-size: 0.9rem;
  line-height: 1.5;
}

.main-wrapper .blogs-wrapper .blog-container.primary .blog-content {
  display: inline-flex;
  flex-direction: column;
  vertical-align: top;
  width: 100%;
  color: #111827;
  height: 100%;
  padding: 22px 22px 20px;
}

@media (min-width: 768px) {
  .main-wrapper .blogs-wrapper .blog-container.primary .blog-content {
    width: auto;
  }
}

.main-wrapper .blogs-wrapper .blog-container.primary .blog-content h3 {
  font-size: clamp(1.22rem, 1.45vw, 1.52rem);
  line-height: 1.14;
  max-height: calc(1.14em * 4);
  -webkit-line-clamp: 4;
}

.main-wrapper .blogs-wrapper .blog-container.primary .blog-content .text {
  color: #64748b;
  font-size: 0.92rem;
  font-weight: 400;
  line-height: 1.48;
  max-height: calc(1.48em * 4);
  -webkit-line-clamp: 4;
}

.main-wrapper .blogs-wrapper .vf-blog-card-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 14px 0 12px;
}

.main-wrapper .blogs-wrapper .vf-blog-card-stats span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 28px;
  padding: 6px 10px;
  border-radius: 999px;
  background: #f3f7fb;
  color: #52627a;
  font-size: 0.76rem;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}

.main-wrapper .blogs-wrapper .vf-blog-card-stats i {
  color: #0f766e;
  font-size: 0.78rem;
}

.main-wrapper .blogs-wrapper .blog-container.primary .blog-content > div:last-child {
  margin-top: 14px;
}

.main-wrapper .blogs-wrapper .blog-container.primary .text-link {
  color: #0f766e;
  font-weight: 700;
}

.main-wrapper .blogs-wrapper .blog-more {
  background: rgba(23, 54, 90, 0.9);
}

body.night-mode .main-wrapper .blogs-wrapper .blog-container,
body.night-mode .main-wrapper .blogs-wrapper .blog-container.primary {
  border-color: rgba(148, 163, 184, 0.12);
  background: var(--card-dark-color);
}

body.night-mode .main-wrapper .blogs-wrapper .blog-content h3,
body.night-mode .main-wrapper .blogs-wrapper .blog-container.primary .blog-content,
body.night-mode .main-wrapper .blogs-wrapper .blog-container.primary .blog-content h3 {
  color: #f8fafc;
}

body.night-mode .main-wrapper .blogs-wrapper .blog-content .text,
body.night-mode .main-wrapper .blogs-wrapper .blog-container.primary .blog-content .text {
  color: #cbd5e1;
}

body.night-mode .main-wrapper .blogs-wrapper .vf-blog-card-stats span {
  background: rgba(148, 163, 184, 0.14);
  color: #dbe7f5;
}

/* Admin featured blog selector */
.vf-featured-blog-picker {
  position: relative;
  max-width: 680px;
}

.vf-featured-blog-selected,
.vf-featured-blog-result {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-width: 0;
}

.vf-featured-blog-selected {
  min-height: 86px;
  padding: 12px;
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 14px;
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
}

.vf-featured-blog-selected.is-empty {
  min-height: 70px;
  border-style: dashed;
}

.vf-featured-blog-selected img,
.vf-featured-blog-result img {
  width: 84px;
  height: 58px;
  flex: 0 0 84px;
  border-radius: 10px;
  object-fit: cover;
  background: #e8eef6;
}

.vf-featured-blog-selected strong,
.vf-featured-blog-result strong {
  display: block;
  color: #172033;
  font-size: 0.96rem;
  line-height: 1.2;
}

.vf-featured-blog-selected span,
.vf-featured-blog-result em {
  display: block;
  margin-top: 4px;
  color: #64748b;
  font-size: 0.8rem;
  font-style: normal;
  line-height: 1.3;
}

.vf-featured-blog-results {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 8px);
  z-index: 50;
  max-height: 360px;
  overflow-y: auto;
  padding: 8px;
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 18px 42px rgba(15, 23, 42, 0.16);
}

.vf-featured-blog-result {
  padding: 9px;
  border: 0;
  border-radius: 12px;
  background: transparent;
  text-align: left;
}

.vf-featured-blog-result:hover,
.vf-featured-blog-result:focus {
  background: #eef5ff;
}

.vf-featured-blog-status {
  padding: 12px;
  color: #64748b;
  font-size: 0.9rem;
}

body.night-mode .vf-featured-blog-selected,
body.night-mode .vf-featured-blog-results {
  border-color: rgba(148, 163, 184, 0.16);
  background: #1f2937;
}

body.night-mode .vf-featured-blog-selected strong,
body.night-mode .vf-featured-blog-result strong {
  color: #f8fafc;
}

body.night-mode .vf-featured-blog-selected span,
body.night-mode .vf-featured-blog-result em,
body.night-mode .vf-featured-blog-status {
  color: #cbd5e1;
}

body.night-mode .vf-featured-blog-result:hover,
body.night-mode .vf-featured-blog-result:focus {
  background: #27364a;
}

/* Messages page polish */
.vf-messages-shell .sg-offcanvas-sidebar > .card {
  border-radius: 18px;
}

.vf-messages-shell .sg-offcanvas-sidebar > .card > .card-header.with-icon {
  padding: 10px 10px !important;
}

.vf-messages-shell .vf-messages-thread-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

.vf-messages-shell .vf-messages-thread-title {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  color: #152238;
  font-size: 0.82rem;
  font-weight: 800;
  line-height: 1.2;
  white-space: nowrap;
}

.vf-messages-shell .vf-messages-thread-title .main-icon {
  width: 16px !important;
  height: 16px !important;
  margin-right: 4px !important;
}

.vf-messages-shell .vf-messages-thread-action {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
}

.vf-messages-shell .sg-offcanvas-sidebar > .card > .card-header.with-icon > .row {
  display: flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  gap: 6px;
  margin: 0 !important;
}

.vf-messages-shell .sg-offcanvas-sidebar > .card > .card-header.with-icon > .row > [class*="col-"] {
  width: auto !important;
  max-width: none !important;
  padding: 0 !important;
}

.vf-messages-shell .sg-offcanvas-sidebar > .card > .card-header.with-icon > .row > [class*="col-"]:first-child {
  flex: 1 1 112px;
  min-width: 112px;
  margin: 0 !important;
  overflow: visible;
  color: #152238;
  font-size: 0.82rem;
  font-weight: 800;
  line-height: 1.2;
  text-overflow: clip;
  white-space: nowrap;
}

.vf-messages-shell .sg-offcanvas-sidebar > .card > .card-header.with-icon > .row > [class*="col-"]:first-child .main-icon {
  width: 16px !important;
  height: 16px !important;
  margin-right: 4px !important;
}

.vf-messages-shell .sg-offcanvas-sidebar > .card > .card-header.with-icon > .row > [class*="col-"]:last-child {
  display: inline-flex !important;
  flex: 0 0 auto;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  min-width: 0;
  text-align: right !important;
}

.vf-messages-shell .sg-offcanvas-sidebar .card-header .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  margin: 0 !important;
  padding: 0 12px !important;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

.vf-messages-shell .sg-offcanvas-sidebar .card-header .js_chat-new {
  width: 30px;
  min-width: 30px;
  min-height: 30px;
  padding: 0 !important;
}

.vf-messages-shell .sg-offcanvas-sidebar .card-body {
  padding-top: 10px !important;
}

.vf-messages-shell .sg-offcanvas-sidebar .feeds-item .data-container {
  min-height: 58px;
  padding: 9px 10px !important;
}

.vf-messages-shell .sg-offcanvas-sidebar .feeds-item .data-content {
  min-width: 0;
  max-width: 100%;
  padding-left: 50px !important;
}

.vf-messages-shell .panel-messages > .card-header.with-icon {
  background: linear-gradient(135deg, #0c2340 0%, #19599e 100%);
  border-bottom: 0;
  color: #ffffff !important;
  font-weight: 850;
  letter-spacing: 0.01em;
  box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.12);
}

.vf-messages-shell .panel-messages > .card-header.with-icon,
.vf-messages-shell .panel-messages > .card-header.with-icon * {
  color: #ffffff !important;
}

body.night-mode .vf-messages-shell .sg-offcanvas-sidebar > .card > .card-header.with-icon > .row > [class*="col-"]:first-child {
  color: #e5edf7;
}

body.night-mode .vf-messages-shell .vf-messages-thread-title {
  color: #e5edf7;
}

.vf-messages-shell .conversation-body {
  max-width: min(76%, 720px);
  min-width: 0;
}

.vf-messages-shell .conversation.right .conversation-body {
  margin-left: auto;
}

.vf-messages-shell .conversation-body .text {
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.vf-messages-shell .conversation.right .conversation-body .text {
  text-align: left;
}

@media (max-width: 767.98px) {
  .vf-messages-shell .conversation-body {
    max-width: 86%;
  }
}

/* Right rail suggested events */
.main-wrapper .vf-suggested-events-card .card-header {
  padding-bottom: 12px;
}

.main-wrapper .vf-suggested-events-card .vf-events-calendar-hero {
  position: relative;
  min-height: 118px;
  margin: 0 14px 12px;
  padding: 14px;
  border: 1px solid rgba(214, 226, 251, 0.95);
  border-radius: 16px;
  background:
    linear-gradient(135deg, rgba(232, 239, 253, 0.94), rgba(247, 250, 255, 0.98));
  color: #253247;
  overflow: hidden;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
}

.main-wrapper .vf-suggested-events-card .vf-events-calendar-mode {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 3px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.72);
  color: #64748b;
  font-size: 0.68rem;
  font-weight: 800;
}

.main-wrapper .vf-suggested-events-card .vf-events-calendar-filter {
  min-width: 0;
  padding: 5px 8px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #64748b;
  font-size: 0.68rem;
  font-weight: 800;
  line-height: 1.2;
  cursor: pointer;
}

.main-wrapper .vf-suggested-events-card .vf-events-calendar-filter.is-active {
  background: #ffffff;
  color: #0f6b80;
  box-shadow: 0 6px 14px rgba(15, 23, 42, 0.08);
  font-size: 0.68rem;
}

.main-wrapper .vf-suggested-events-card .vf-events-calendar-filter:focus {
  outline: 0;
}

.main-wrapper .vf-suggested-events-card .vf-events-calendar-summary {
  position: absolute;
  right: 16px;
  bottom: 16px;
  left: 88px;
  min-width: 0;
  color: rgba(255, 255, 255, 0.82);
  text-align: left;
}

.main-wrapper .vf-suggested-events-card .vf-events-calendar-summary span,
.main-wrapper .vf-suggested-events-card .vf-events-calendar-summary strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.main-wrapper .vf-suggested-events-card .vf-events-calendar-summary span {
  color: #253247;
  font-size: 0.8rem;
  font-weight: 850;
  line-height: 1.2;
}

.main-wrapper .vf-suggested-events-card .vf-events-calendar-summary strong {
  margin-top: 5px;
  color: #64748b;
  font-size: 0.66rem;
  font-weight: 750;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.main-wrapper .vf-suggested-events-card .vf-events-calendar-date {
  position: absolute;
  left: 18px;
  bottom: 16px;
  width: 54px;
  padding: 8px 6px;
  border-radius: 14px;
  background: #ffffff;
  text-align: center;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08);
}

.main-wrapper .vf-suggested-events-card .vf-events-calendar-date strong {
  display: block;
  color: #0f6b80;
  font-size: 1.5rem;
  font-weight: 750;
  line-height: 1;
}

.main-wrapper .vf-suggested-events-card .vf-events-calendar-date span {
  display: block;
  margin-top: 3px;
  color: #64748b;
  font-size: 0.58rem;
  font-weight: 850;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.main-wrapper .vf-suggested-events-card .card-body.with-list {
  max-height: 360px;
  overflow-x: hidden;
  overflow-y: auto;
  padding-bottom: 14px;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

.main-wrapper .vf-suggested-events-card .suggested-event-item.is-hidden {
  display: none;
}

.main-wrapper .vf-suggested-events-card .js-vf-calendar-list[hidden] {
  display: none !important;
}

.main-wrapper .vf-suggested-events-card .vf-events-calendar-empty {
  display: none;
  margin: 0 14px 14px;
  padding: 22px 16px;
  border: 1px dashed rgba(148, 163, 184, 0.45);
  border-radius: 14px;
  background: rgba(248, 250, 252, 0.86);
  color: #64748b;
  font-size: 0.82rem;
  font-weight: 750;
  text-align: center;
}

.main-wrapper .vf-suggested-events-card .vf-events-calendar-empty.is-visible {
  display: block;
}

.main-wrapper .vf-suggested-events-card .card-body.with-list::-webkit-scrollbar {
  display: none;
  width: 0;
}

.main-wrapper .vf-suggested-events-card .card-body.with-list::-webkit-scrollbar-thumb {
  background: transparent;
}

.main-wrapper .vf-suggested-events-card .suggested-event-item .data-container {
  position: relative;
  display: block;
  max-width: 100%;
  padding: 14px 12px 14px 24px;
  overflow: hidden;
}

.main-wrapper .vf-suggested-events-card .suggested-event-item .data-container::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 12px;
  width: 1px;
  background: #d8e0ea;
}

.main-wrapper .vf-suggested-events-card .suggested-event-item:first-child .data-container::before {
  top: 22px;
}

.main-wrapper .vf-suggested-events-card .suggested-event-item:last-child .data-container::before {
  bottom: calc(100% - 22px);
}

.main-wrapper .vf-suggested-events-card .suggested-event-item .data-avatar {
  position: absolute;
  top: 17px;
  left: 6px;
  z-index: 1;
  width: 13px;
  height: 13px;
  border: 3px solid #ffffff;
  border-radius: 999px;
  background: #7c66ff;
  box-shadow: 0 0 0 2px #7c66ff;
}

.main-wrapper .vf-suggested-events-card .suggested-event-item .data-avatar img {
  display: none;
}

.main-wrapper .vf-suggested-events-card .suggested-event-item .data-content {
  display: block;
  padding-left: 0 !important;
  min-width: 0;
}

.main-wrapper .vf-suggested-events-card .suggested-event-body {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 8px;
  align-items: start;
  max-width: 100%;
  overflow: hidden;
}

.main-wrapper .vf-suggested-events-card .suggested-event-time {
  color: #0a6f8a;
  font-weight: 850;
  letter-spacing: 0.01em;
  line-height: 1;
  text-align: right;
  min-width: 0;
}

.main-wrapper .vf-suggested-events-card .suggested-event-time strong {
  font-size: 0.86rem;
  font-weight: 850;
}

.main-wrapper .vf-suggested-events-card .suggested-event-time span {
  margin-left: 2px;
  font-size: 0.5rem;
  font-weight: 800;
}

.main-wrapper .vf-suggested-events-card .suggested-event-details {
  min-width: 0;
  overflow: hidden;
}

.main-wrapper .vf-suggested-events-card .suggested-event-title a {
  display: block;
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: normal;
  color: #08708c;
  font-size: 0.72rem;
  font-weight: 850;
  line-height: 1.2;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.main-wrapper .vf-suggested-events-card .suggested-event-meta,
.main-wrapper .vf-suggested-events-card .suggested-event-stat {
  max-width: 100%;
  overflow: hidden;
  color: #687386;
  font-size: 0.68rem;
  font-weight: 650;
  line-height: 1.25;
}

.main-wrapper .vf-suggested-events-card .suggested-event-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 5px;
  grid-column: 1 / 3;
  margin-top: 6px;
  max-width: 100%;
  overflow: hidden;
}

.main-wrapper .vf-suggested-events-card .suggested-event-actions .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  min-width: 24px;
  margin: 0 !important;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: transparent;
  box-shadow: none;
}

.main-wrapper .vf-suggested-events-card .suggested-event-actions .suggested-event-interest {
  width: 24px;
  max-width: 24px;
  height: 24px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: rgba(9, 112, 140, 0.08);
  overflow: hidden;
  color: #08708c;
  font-size: 0;
  font-weight: 850;
  letter-spacing: 0;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.main-wrapper .vf-suggested-events-card .suggested-event-actions .suggested-event-interest i,
.main-wrapper .vf-suggested-events-card .suggested-event-actions .suggested-event-save i {
  margin: 0 !important;
  font-size: 0.72rem;
}

.main-wrapper .vf-suggested-events-card .suggested-event-actions .suggested-event-interest i {
  margin-right: 0 !important;
}

.main-wrapper .vf-suggested-events-card .suggested-event-actions .suggested-event-save {
  width: 24px;
  height: 24px;
  padding: 0;
  border-radius: 999px;
  color: #7c66ff;
  background: rgba(124, 102, 255, 0.1);
}

.main-wrapper .vf-suggested-events-card .suggested-event-actions .suggested-event-save:hover,
.main-wrapper .vf-suggested-events-card .suggested-event-actions .suggested-event-interest:hover {
  background: rgba(239, 246, 255, 0.98);
}

/* Logged-in home polish */
.main-wrapper .vf-stories-card.vf-stories-card-empty .stories-wrapper {
  min-height: 0;
  padding: 6px 14px 14px;
  margin-bottom: 0;
}

.main-wrapper .vf-stories-card.vf-stories-card-empty .stories.sngine.carousel,
.main-wrapper .vf-stories-card.vf-stories-card-empty #stories {
  display: flex !important;
  align-items: center;
  min-height: 0;
  height: 76px !important;
  margin: 0 !important;
}

.main-wrapper .vf-stories-card.vf-stories-card-empty .add-story {
  position: relative;
  display: flex !important;
  align-items: center;
  width: 100% !important;
  min-width: 100% !important;
  height: 76px !important;
  margin: 0 !important;
  padding: 11px 16px 11px 12px;
  border: 1px solid rgba(219, 227, 240, 0.92);
  border-radius: 16px !important;
  background:
    linear-gradient(90deg, rgba(45, 111, 183, 0.08), rgba(110, 229, 194, 0.08)),
    linear-gradient(180deg, #ffffff, #f8fbff);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.92), 0 8px 20px rgba(15, 23, 42, 0.045);
  cursor: pointer;
}

.main-wrapper .vf-stories-card.vf-stories-card-empty .add-story::after {
  content: "Add a story";
  position: absolute;
  top: 18px;
  left: 76px;
  max-width: calc(100% - 140px);
  overflow: hidden;
  color: #253247;
  font-size: 0.95rem;
  font-weight: 850;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.main-wrapper .vf-stories-card.vf-stories-card-empty .add-story::before {
  content: "Share a quick update with your network";
  position: absolute;
  top: 41px;
  left: 76px;
  max-width: calc(100% - 140px);
  overflow: hidden;
  color: #64748b;
  font-size: 0.78rem;
  font-weight: 650;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.main-wrapper .vf-stories-card.vf-stories-card-empty .add-story .img {
  flex: 0 0 46px;
  width: 46px !important;
  min-width: 46px !important;
  height: 46px !important;
  min-height: 46px !important;
  border-radius: 50% !important;
  background-size: cover !important;
  background-position: center !important;
  box-shadow: 0 0 0 2px #ffffff, 0 2px 8px rgba(15, 23, 42, 0.12);
  margin-bottom: 0;
}

.main-wrapper .vf-stories-card.vf-stories-card-empty .add-story .add {
  top: 50% !important;
  right: 16px !important;
  bottom: auto !important;
  left: auto !important;
  width: 34px !important;
  height: 34px !important;
  padding: 8px !important;
  border-radius: 999px !important;
  box-shadow: 0 8px 18px rgba(37, 99, 235, 0.2) !important;
  transform: translateY(-50%) !important;
}

.main-wrapper .vf-blog-carousel-card .vf-blog-carousel-placeholder {
  display: flex;
  aspect-ratio: 2 / 1;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 8px;
  background:
    radial-gradient(circle at 78% 18%, rgba(110, 229, 194, 0.18), transparent 28%),
    linear-gradient(135deg, #17365a 0%, #245f9d 100%);
  color: #ffffff;
  font-weight: 800;
}

.main-wrapper .vf-blog-carousel-card .vf-blog-carousel-placeholder i {
  font-size: 1.35rem;
  opacity: 0.92;
}

.main-wrapper .vf-blog-carousel-card .vf-blog-carousel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.main-wrapper .vf-blog-carousel-card .vf-blog-carousel-header .sidebar-widget-heading {
  min-width: 0;
  color: #21344d;
  font-size: 0.92rem;
  font-weight: 850;
}

.main-wrapper .vf-blog-carousel-card .vf-blog-carousel-header .sidebar-widget-icon {
  color: #4f73ff !important;
}

.main-wrapper .vf-blog-carousel-card .vf-blog-carousel-see-all {
  flex: 0 0 auto;
  padding: 5px 10px;
  border: 1px solid rgba(82, 112, 143, 0.16);
  border-radius: 999px;
  background: rgba(248, 251, 255, 0.88);
  color: #52708f !important;
  font-size: 0.68rem;
  font-weight: 850;
  letter-spacing: 0.06em;
  line-height: 1;
  text-decoration: none;
  text-transform: uppercase;
}

.main-wrapper .vf-blog-carousel-card .vf-blog-carousel-see-all:hover {
  border-color: rgba(79, 115, 255, 0.28);
  background: rgba(79, 115, 255, 0.1);
  color: #2f56d6 !important;
}

.main-wrapper .vf-blog-carousel-card .post-media-image-wrapper {
  background: #eff6ff;
}

.main-wrapper .vf-blog-carousel-card .card-body {
  overflow: hidden;
}

.main-wrapper .vf-blog-carousel-card .carousel,
.main-wrapper .vf-blog-carousel-card .carousel-inner,
.main-wrapper .vf-blog-carousel-card .carousel-item {
  max-width: 100%;
  overflow: hidden;
}

.main-wrapper .vf-blog-carousel-card .post-media.list {
  display: block;
  width: 100%;
  max-width: 100%;
  margin: 0;
  overflow: hidden;
  border-radius: 0 0 18px 18px;
  background: #ffffff;
}

.main-wrapper .vf-blog-carousel-card .post-media-image-wrapper,
.main-wrapper .vf-blog-carousel-card .post-media-image,
.main-wrapper .vf-blog-carousel-card .post-media-image > div {
  width: 100%;
  max-width: 100%;
}

.main-wrapper .vf-blog-carousel-card .post-media-image > div {
  border-radius: 14px;
}

.main-wrapper .vf-blog-carousel-card .post-media-image-meta {
  bottom: 10px;
  left: 10px;
  max-width: calc(100% - 20px);
}

.main-wrapper .vf-blog-carousel-card .post-media-meta {
  width: 100%;
  min-width: 0;
  padding: 13px 14px 15px;
}

.main-wrapper .vf-blog-carousel-card .post-media-meta .title {
  display: -webkit-box;
  overflow: hidden;
  color: #0f6b80;
  font-size: 0.92rem;
  font-weight: 850;
  line-height: 1.25;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.main-wrapper .vf-blog-carousel-card .post-media-meta .text {
  display: -webkit-box;
  max-height: none;
  overflow: hidden;
  color: #475569;
  font-size: 0.82rem;
  line-height: 1.35;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.main-wrapper .vf-blog-carousel-card .post-media-meta .info {
  overflow: hidden;
  color: #64748b;
  font-size: 0.72rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.main-wrapper .vf-blog-carousel-card .vf-carousel-control {
  width: 32px;
  height: 32px;
  top: 35%;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.72);
  opacity: 1;
}

.main-wrapper .vf-side-rail .vf-blog-carousel-card .card-body {
  padding: 0 !important;
}

.main-wrapper .vf-side-rail .vf-blog-carousel-card .post-media.list {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  padding: 12px;
  border-radius: 0 0 18px 18px;
}

.main-wrapper .vf-side-rail .vf-blog-carousel-card .post-media-image-wrapper,
.main-wrapper .vf-side-rail .vf-blog-carousel-card .post-media-image {
  width: 92px;
  max-width: 92px;
  min-width: 92px;
}

.main-wrapper .vf-side-rail .vf-blog-carousel-card .post-media-image {
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border-radius: 12px;
  background: #eff6ff;
}

.main-wrapper .vf-side-rail .vf-blog-carousel-card .post-media-image > div {
  width: 100%;
  max-width: 100%;
  height: 100%;
  min-height: 0;
  padding-top: 0 !important;
  border-radius: 12px;
}

.main-wrapper .vf-side-rail .vf-blog-carousel-card .vf-blog-carousel-placeholder {
  aspect-ratio: auto;
  height: 100%;
  min-height: 0;
}

.main-wrapper .vf-side-rail .vf-blog-carousel-card .post-media-image-meta {
  display: none;
}

.main-wrapper .vf-side-rail .vf-blog-carousel-card .post-media-meta {
  padding: 0;
}

.main-wrapper .vf-side-rail .vf-blog-carousel-card .post-media-meta .title {
  margin-bottom: 7px !important;
  color: #1d3c55 !important;
  font-size: 0.88rem;
  line-height: 1.25;
}

.main-wrapper .vf-side-rail .vf-blog-carousel-card .post-media-meta .info {
  color: #718199 !important;
  font-size: 0.72rem;
  font-weight: 750;
  line-height: 1.35;
  white-space: normal;
}

.main-wrapper .vf-side-rail .vf-blog-carousel-card .post-media-meta .info a {
  color: #426079;
  font-weight: 850;
}

.main-wrapper .vf-side-rail .vf-blog-carousel-card .post-media-meta .text {
  display: none;
}

.main-wrapper .vf-side-rail .vf-blog-carousel-card .vf-carousel-control {
  top: 50%;
  width: 28px;
  height: 28px;
}

body.night-mode .main-wrapper .vf-blog-carousel-card .vf-blog-carousel-header .sidebar-widget-heading {
  color: #e7eef8;
}

body.night-mode .main-wrapper .vf-blog-carousel-card .vf-blog-carousel-see-all {
  border-color: rgba(148, 163, 184, 0.18);
  background: rgba(15, 23, 42, 0.48);
  color: #b8c7dc !important;
}

body.night-mode .main-wrapper .vf-side-rail .vf-blog-carousel-card .post-media.list {
  background: rgba(15, 23, 42, 0.28);
}

body.night-mode .main-wrapper .vf-side-rail .vf-blog-carousel-card .post-media-meta .title {
  color: #f4f8ff !important;
}

body.night-mode .main-wrapper .vf-side-rail .vf-blog-carousel-card .post-media-meta .info,
body.night-mode .main-wrapper .vf-side-rail .vf-blog-carousel-card .post-media-meta .info a {
  color: #aebdd2 !important;
}

.main-wrapper .vf-side-rail .vf-sponsored-card:not(.bg-transparent) .card-body {
  overflow: hidden;
  text-align: center;
}

.main-wrapper .vf-side-rail .vf-sponsored-card:not(.bg-transparent) .card-body > a {
  display: inline-block;
  width: 300px;
  max-width: 300px;
  vertical-align: top;
}

.main-wrapper .vf-side-rail .vf-sponsored-card:not(.bg-transparent) .card-body > a > img,
.main-wrapper .vf-side-rail .vf-sponsored-card:not(.bg-transparent) .card-body > a > video {
  display: block;
  width: 300px !important;
  max-width: 300px !important;
  height: 250px !important;
  object-fit: cover;
}

/* r22 user-facing launch polish */
body:not(.night-mode).vf-page-index .main-wrapper .vf-newsfeed-shell {
  --vf-polish-card-border: rgba(207, 219, 235, 0.84);
  --vf-polish-card-shadow: 0 12px 30px rgba(30, 51, 86, 0.08);
  --vf-polish-card-shadow-hover: 0 16px 36px rgba(30, 51, 86, 0.11);
  --vf-polish-accent: linear-gradient(90deg, #2f6dff 0%, #21bdd3 100%);
}

body:not(.night-mode).vf-page-index .main-wrapper .vf-newsfeed-shell .card:not(.vf-promo-card),
body:not(.night-mode).vf-page-index .main-wrapper .vf-newsfeed-shell .post {
  border-color: var(--vf-polish-card-border) !important;
  background: rgba(255, 255, 255, 0.96) !important;
  box-shadow: var(--vf-polish-card-shadow) !important;
  transform: none !important;
}

body:not(.night-mode).vf-page-index .main-wrapper .vf-newsfeed-shell .card:not(.vf-promo-card):hover,
body:not(.night-mode).vf-page-index .main-wrapper .vf-newsfeed-shell .post:hover {
  border-color: rgba(184, 202, 227, 0.96) !important;
  box-shadow: var(--vf-polish-card-shadow-hover) !important;
  transform: translateY(-1px) !important;
}

body:not(.night-mode).vf-page-index .main-wrapper .vf-newsfeed-shell .card:not(.vf-promo-card)::before,
body:not(.night-mode).vf-page-index .main-wrapper .vf-newsfeed-shell .post::before {
  height: 3px !important;
  background: var(--vf-polish-accent) !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .post.post-menu-open,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_posts_stream .post.post-menu-open,
.js_posts_stream .post.post-menu-open,
.post.post-menu-open,
.post.standalone.post-menu-open,
.lightbox-post.post-menu-open {
  overflow: visible !important;
  z-index: 2140 !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .post.post-menu-open .post-body,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .post.post-menu-open .post-header,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .post.post-menu-open .post-meta,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .post.post-menu-open .post-time,
.js_posts_stream .post.post-menu-open .post-body,
.js_posts_stream .post.post-menu-open .post-header,
.js_posts_stream .post.post-menu-open .post-meta,
.js_posts_stream .post.post-menu-open .post-time,
.post.post-menu-open .post-body,
.post.post-menu-open .post-header,
.post.post-menu-open .post-meta,
.post.post-menu-open .post-time,
.lightbox-post.post-menu-open .post-body,
.lightbox-post.post-menu-open .post-header,
.lightbox-post.post-menu-open .post-meta,
.lightbox-post.post-menu-open .post-time {
  overflow: visible !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .post.post-menu-open .post-header .post-meta > .dropdown.show,
.js_posts_stream .post.post-menu-open .post-header .post-meta > .dropdown.show,
.post.post-menu-open .post-header .post-meta > .dropdown.show,
.lightbox-post.post-menu-open .post-header .post-meta > .dropdown.show,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .post.post-menu-open .post-time > .btn-group.show,
.js_posts_stream .post.post-menu-open .post-time > .btn-group.show,
.post.post-menu-open .post-time > .btn-group.show,
.lightbox-post.post-menu-open .post-time > .btn-group.show {
  z-index: 2141 !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .post.post-menu-open .post-header .post-meta > .dropdown.show > .dropdown-menu,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .post.post-menu-open .post-header .post-meta > .dropdown > .dropdown-menu.show,
.js_posts_stream .post.post-menu-open .post-header .post-meta > .dropdown.show > .dropdown-menu,
.js_posts_stream .post.post-menu-open .post-header .post-meta > .dropdown > .dropdown-menu.show,
.post.post-menu-open .post-header .post-meta > .dropdown.show > .dropdown-menu,
.post.post-menu-open .post-header .post-meta > .dropdown > .dropdown-menu.show,
.lightbox-post.post-menu-open .post-header .post-meta > .dropdown.show > .dropdown-menu,
.lightbox-post.post-menu-open .post-header .post-meta > .dropdown > .dropdown-menu.show,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .post.post-menu-open .post-time > .btn-group.show > .dropdown-menu,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .post.post-menu-open .post-time > .btn-group > .dropdown-menu.show,
.js_posts_stream .post.post-menu-open .post-time > .btn-group.show > .dropdown-menu,
.js_posts_stream .post.post-menu-open .post-time > .btn-group > .dropdown-menu.show,
.post.post-menu-open .post-time > .btn-group.show > .dropdown-menu,
.post.post-menu-open .post-time > .btn-group > .dropdown-menu.show,
.lightbox-post.post-menu-open .post-time > .btn-group.show > .dropdown-menu,
.lightbox-post.post-menu-open .post-time > .btn-group > .dropdown-menu.show {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 2142 !important;
  max-height: min(420px, calc(100vh - 96px)) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  pointer-events: auto !important;
}

.post-comments.comments-filter-open,
.post-comments.comments-filter-open .comments-filter {
  position: relative;
  overflow: visible !important;
  z-index: 2138 !important;
}

.post-comments.comments-filter-open .js_comments-filter.show {
  z-index: 2139 !important;
}

.post-comments.comments-filter-open .comments-filter .dropdown-menu.show,
.post-comments.comments-filter-open .comments-filter .dropdown-menu[data-bs-popper] {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 2140 !important;
  max-height: min(320px, calc(100vh - 96px)) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  pointer-events: auto !important;
}

.post-comments.comments-menu-open,
.post-comments.comments-menu-open .comment-data,
.comment.comment-menu-open {
  position: relative;
  overflow: visible !important;
  z-index: 2138 !important;
}

.comment.comment-menu-open .comment-btn.show {
  z-index: 2139 !important;
}

.comment.comment-menu-open .comment-btn .dropdown-menu.show,
.comment.comment-menu-open .comment-btn .dropdown-menu[data-bs-popper] {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 2140 !important;
  max-height: min(320px, calc(100vh - 96px)) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  pointer-events: auto !important;
}

.reactions-wrapper.reactions-open,
.post-comments.comments-reactions-open,
.comment.comment-reactions-open {
  position: relative;
  overflow: visible !important;
  z-index: 2138 !important;
}

.reactions-wrapper.reactions-open .reactions-container {
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 2140 !important;
  pointer-events: auto !important;
}

.vf-comment-publisher.emoji-menu-open,
.x-form.emoji-menu-open,
.post-comments.comments-emoji-open,
.comment.comment-emoji-open,
.post-comments.comments-voice-open,
.comment.comment-voice-open,
.post-comments.comments-attachments-open,
.comment.comment-attachments-open {
  position: relative;
  overflow: visible !important;
  z-index: 2138 !important;
}

.vf-comment-publisher.emoji-menu-open .emoji-menu,
.x-form.emoji-menu-open .emoji-menu,
.emoji-menu.vf-detached-emoji-menu {
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 2140 !important;
  pointer-events: auto !important;
}

.comment.comment-voice-open .comment-voice-notes {
  position: relative;
  overflow: visible !important;
  z-index: 2139 !important;
}

.comment.comment-attachments-open .comment-attachments {
  position: relative;
  overflow: visible !important;
  z-index: 2139 !important;
}

body:not(.night-mode).vf-page-index .main-wrapper .vf-newsfeed-shell .card .card-header {
  min-height: 48px;
  padding: 13px 16px !important;
  border-bottom-color: rgba(218, 228, 241, 0.86) !important;
  background: rgba(255, 255, 255, 0.92) !important;
}

body:not(.night-mode).vf-page-index .main-wrapper .vf-newsfeed-shell .card .card-header strong,
body:not(.night-mode).vf-page-index .main-wrapper .vf-newsfeed-shell .card .card-header h6 {
  color: #203047;
  font-size: 0.94rem;
  font-weight: 850;
  letter-spacing: 0.02em !important;
}

body:not(.night-mode).vf-page-index .vf-newsfeed-shell .main-side-nav-card {
  border-color: rgba(207, 219, 235, 0.76) !important;
  box-shadow: 0 10px 26px rgba(30, 51, 86, 0.07) !important;
}

body:not(.night-mode).vf-page-index .vf-newsfeed-shell .main-side-nav-card::before {
  display: none !important;
}

body.vf-page-index .vf-newsfeed-shell .main-side-nav-card .card-body.with-nav {
  padding: 13px 10px !important;
}

body.vf-page-index .vf-newsfeed-shell .sidebar-section-block {
  margin-bottom: 14px;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(220, 229, 241, 0.78);
}

body.vf-page-index .vf-newsfeed-shell .sidebar-section-block:last-child {
  border-bottom: 0;
}

body.vf-page-index .vf-newsfeed-shell .sidebar-section-title {
  min-height: 30px;
  padding: 3px 10px;
  color: #687992;
}

body.vf-page-index .vf-newsfeed-shell .sidebar-section-title span {
  font-size: 0.7rem;
  font-weight: 850;
  letter-spacing: 0.08em;
}

body.vf-page-index .vf-newsfeed-shell .sidebar-grid,
body.vf-page-index .vf-newsfeed-shell .sidebar-quick-grid {
  gap: 4px;
}

body.vf-page-index .vf-newsfeed-shell .sidebar-grid-item,
body.vf-page-index .vf-newsfeed-shell .sidebar-quick-item,
body.vf-page-index .vf-newsfeed-shell .sidebar-see-more {
  min-height: 42px;
  padding: 8px 11px !important;
  border-radius: 12px;
  color: #2f3f55;
  transition: background-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
}

body.vf-page-index .vf-newsfeed-shell .sidebar-grid-item .main-icon,
body.vf-page-index .vf-newsfeed-shell .sidebar-quick-item .main-icon,
body.vf-page-index .vf-newsfeed-shell .sidebar-see-more .main-icon {
  width: 20px !important;
  height: 20px !important;
  min-width: 20px;
  margin-right: 10px !important;
  color: #6d7f98;
}

body.vf-page-index .vf-newsfeed-shell .sidebar-grid-item.is-active {
  background: rgba(47, 109, 255, 0.1) !important;
  box-shadow: inset 3px 0 0 #2f6dff;
  color: #173c8c !important;
}

body.vf-page-index .vf-newsfeed-shell .sidebar-grid-item.is-active .main-icon {
  color: #2f6dff;
}

body.vf-page-index .vf-newsfeed-shell .composer-launcher {
  margin-bottom: 16px !important;
}

body.vf-page-index .vf-newsfeed-shell .composer-launcher .card-body {
  padding: 13px 16px 12px !important;
}

body.vf-page-index .vf-newsfeed-shell .composer-launcher-input {
  min-height: 44px;
  border: 1px solid rgba(209, 221, 237, 0.92);
  background: #f8fbff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.86);
}

body.vf-page-index .vf-newsfeed-shell .vf-composer-quick-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 11px;
  padding-left: 54px;
}

body.vf-page-index .vf-newsfeed-shell .vf-composer-quick-actions button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 30px;
  padding: 0 11px;
  border: 1px solid rgba(211, 223, 239, 0.9);
  border-radius: 999px;
  background: #ffffff;
  color: #536680;
  font-size: 0.76rem;
  font-weight: 800;
  line-height: 1;
  cursor: pointer;
}

body.vf-page-index .vf-newsfeed-shell .vf-composer-quick-actions i {
  color: #2f6dff;
  font-size: 0.78rem;
}

body.vf-page-index .vf-newsfeed-shell .js_recommendation-strip .card-header {
  align-items: center !important;
  min-height: 62px;
}

body.vf-page-index .vf-newsfeed-shell .js_recommendation-strip .card-body {
  padding: 14px 16px 16px !important;
}

body.vf-page-index .vf-newsfeed-shell .js_recommendation-strip ul {
  margin: 0;
}

body.vf-page-index .vf-newsfeed-shell .js_recommendation-strip li,
body.vf-page-index .vf-newsfeed-shell .js_recommendation-strip .feeds-item,
body.vf-page-index .vf-newsfeed-shell .js_recommendation-strip .data-container {
  border-color: rgba(221, 230, 242, 0.76) !important;
}

body.vf-page-index .vf-newsfeed-shell .js_recommendation-strip .btn-close {
  opacity: 0.52;
  transform: scale(0.86);
}

body.vf-page-index .vf-newsfeed-shell .js_recommendation-strip .btn-close:hover {
  opacity: 0.82;
}

body.vf-page-index .vf-newsfeed-shell .vf-posts-filter {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 14px !important;
}

body.vf-page-index .vf-newsfeed-shell .vf-posts-filter .btn,
body.vf-page-index .vf-newsfeed-shell .vf-posts-filter .countries-filter {
  min-height: 36px !important;
  padding: 0 13px !important;
  border: 1px solid rgba(211, 223, 239, 0.9) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.92) !important;
  color: #31536b !important;
  box-shadow: 0 8px 18px rgba(30, 51, 86, 0.06) !important;
  font-size: 0.78rem !important;
  font-weight: 850 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

body.vf-page-index .vf-newsfeed-shell .vf-side-rail .card,
body.vf-page-index .vf-newsfeed-shell .vf-side-rail .sidebar-weather-board {
  margin-bottom: 18px !important;
  border-radius: 18px !important;
}

body.vf-page-index .vf-newsfeed-shell .vf-side-rail .card-header {
  min-height: 46px !important;
  padding: 12px 14px !important;
}

body.vf-page-index .vf-newsfeed-shell .vf-side-rail .card-header .float-end,
body.vf-page-index .vf-newsfeed-shell .vf-side-rail .card-header a.float-end,
body.vf-page-index .vf-newsfeed-shell .vf-side-rail .card-header a {
  color: #52708f !important;
  font-size: 0.68rem;
  font-weight: 850;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

body.vf-page-index .vf-newsfeed-shell .vf-side-rail .card-body {
  padding: 14px !important;
}

body.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-sponsored-card:not(.bg-transparent) .card-body {
  padding: 12px 10px 14px !important;
}

body.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-blog-carousel-card .post-media.list {
  padding: 12px !important;
}

body.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-blog-carousel-card .post-media-meta .title {
  color: #1e6074;
  font-size: 0.84rem;
}

body.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-suggested-events-card .vf-events-calendar-hero {
  margin: 0 !important;
  border-radius: 14px !important;
}

body.vf-page-index .vf-newsfeed-shell .sidebar-weather-board {
  box-shadow: 0 14px 34px rgba(18, 38, 84, 0.16) !important;
}

@media (max-width: 767.98px) {
  body.vf-page-index .vf-newsfeed-shell .vf-composer-quick-actions {
    padding-left: 0;
  }
}

/* r23 user-facing detail polish */
body:not(.night-mode).vf-page-index .main-wrapper .main-header {
  box-shadow: 0 8px 20px rgba(12, 24, 43, 0.18) !important;
}

@media (min-width: 1200px) {
  body.vf-page-index .main-wrapper .main-header .header-search-cluster {
    gap: 14px;
  }

  body.vf-page-index .main-wrapper .main-header .header-search-cluster .home-icon,
  body.vf-page-index .main-wrapper .main-header .navbar-wrapper > ul > li > a,
  body.vf-page-index .main-wrapper .main-header .navbar-wrapper > ul > li > .dropdown-toggle {
    width: 40px;
    min-width: 40px;
    height: 40px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.06);
    color: rgba(248, 251, 255, 0.88) !important;
  }

  body.vf-page-index .main-wrapper .main-header .header-search-cluster .home-icon:hover,
  body.vf-page-index .main-wrapper .main-header .navbar-wrapper > ul > li > a:hover,
  body.vf-page-index .main-wrapper .main-header .navbar-wrapper > ul > li > .dropdown-toggle:hover {
    background: rgba(255, 255, 255, 0.12);
    color: #ffffff !important;
  }

  body.vf-page-index .main-wrapper .main-header .search-wrapper .form-control {
    height: 42px !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, 0.16) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 10px 22px rgba(10, 23, 42, 0.12);
  }
}

body.vf-page-index .vf-newsfeed-shell .js_recommendation-strip .feeds-item {
  min-height: 68px;
  border-bottom: 1px solid rgba(221, 230, 242, 0.76);
}

body.vf-page-index .vf-newsfeed-shell .js_recommendation-strip .feeds-item:last-child {
  border-bottom: 0;
}

body.vf-page-index .vf-newsfeed-shell .js_recommendation-strip .data-container {
  min-height: 68px;
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

body.vf-page-index .vf-newsfeed-shell .js_recommendation-strip .btn-danger,
body.vf-page-index .vf-newsfeed-shell .js_recommendation-strip .btn-outline-danger {
  border-color: rgba(225, 29, 72, 0.12) !important;
  background: rgba(225, 29, 72, 0.08) !important;
  color: #be123c !important;
  box-shadow: none !important;
}

body.vf-page-index .vf-newsfeed-shell .js_recommendation-strip .btn-danger:hover,
body.vf-page-index .vf-newsfeed-shell .js_recommendation-strip .btn-outline-danger:hover {
  border-color: rgba(225, 29, 72, 0.2) !important;
  background: rgba(225, 29, 72, 0.14) !important;
}

body.vf-page-index .vf-newsfeed-shell .js_recommendation-strip .btn-light {
  border-color: rgba(211, 223, 239, 0.9) !important;
  background: rgba(255, 255, 255, 0.92) !important;
  color: #23344a !important;
  box-shadow: none !important;
}

body.vf-page-index .vf-newsfeed-shell .js_recommendation-strip .text-muted {
  color: #687a91 !important;
}

body.vf-page-index .vf-newsfeed-shell .sidebar-meta-widget {
  border-radius: 18px;
}

body.vf-page-index .vf-newsfeed-shell .sidebar-weather-board {
  min-height: 184px;
  padding: 16px 16px 14px !important;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 18px !important;
  background:
    radial-gradient(circle at 82% 4%, rgba(95, 132, 255, 0.24), transparent 34%),
    linear-gradient(135deg, #143153 0%, #203d79 100%) !important;
  box-shadow: 0 12px 28px rgba(18, 38, 84, 0.14) !important;
}

body.vf-page-index .vf-newsfeed-shell .sidebar-meta-datetime {
  padding: 0 16px 8px;
  color: rgba(248, 251, 255, 0.82);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.04em;
}

body.vf-page-index .vf-newsfeed-shell .sidebar-weather-current-head {
  gap: 8px;
  margin-bottom: 6px;
}

body.vf-page-index .vf-newsfeed-shell .sidebar-weather-temp {
  font-size: 3.1rem !important;
  line-height: 0.95 !important;
}

body.vf-page-index .vf-newsfeed-shell .sidebar-weather-snark {
  max-width: 170px;
  margin-top: 8px !important;
  color: rgba(255, 255, 255, 0.78) !important;
  font-size: 0.76rem !important;
  line-height: 1.28 !important;
}

body.vf-page-index .vf-newsfeed-shell .sidebar-weather-days {
  gap: 7px;
}

body.vf-page-index .vf-newsfeed-shell .sidebar-weather-day {
  min-height: 24px;
  color: rgba(255, 255, 255, 0.78);
}

body.vf-page-index .vf-newsfeed-shell .vf-suggested-events-card .vf-events-calendar-empty {
  margin: 0 !important;
  padding: 18px 14px !important;
  border-color: rgba(159, 177, 203, 0.34) !important;
  border-radius: 14px !important;
  background: linear-gradient(180deg, rgba(248, 251, 255, 0.96), rgba(242, 247, 253, 0.9)) !important;
  color: #65758c !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
}

body.vf-page-index .vf-newsfeed-shell .vf-suggested-events-card .vf-events-calendar-empty::before {
  content: "\f133";
  display: block;
  margin-bottom: 7px;
  color: #7f93ae;
  font-family: "Font Awesome 6 Free", "Font Awesome 5 Free";
  font-size: 1rem;
  font-weight: 900;
  opacity: 0.75;
}

/* r24 interaction-state polish */
body.vf-page-index .main-wrapper {
  --vf-polish-focus: 0 0 0 3px rgba(47, 109, 255, 0.2);
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell a:focus-visible,
body.vf-page-index .main-wrapper .vf-newsfeed-shell button:focus-visible,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .btn:focus-visible,
body.vf-page-index .main-wrapper .vf-newsfeed-shell [role="button"]:focus-visible,
body.vf-page-index .main-wrapper .main-header a:focus-visible,
body.vf-page-index .main-wrapper .main-header button:focus-visible,
body.vf-page-index .main-wrapper .main-header .form-control:focus-visible {
  outline: 0 !important;
  box-shadow: var(--vf-polish-focus) !important;
}

body.vf-page-index .vf-newsfeed-shell .sidebar-grid-item:hover,
body.vf-page-index .vf-newsfeed-shell .sidebar-quick-item:hover,
body.vf-page-index .vf-newsfeed-shell .sidebar-see-more:hover {
  background: rgba(47, 109, 255, 0.07) !important;
  color: #173c8c !important;
  text-decoration: none !important;
}

body.vf-page-index .vf-newsfeed-shell .vf-composer-quick-actions button,
body.vf-page-index .vf-newsfeed-shell .vf-posts-filter .btn,
body.vf-page-index .vf-newsfeed-shell .vf-posts-filter .countries-filter,
body.vf-page-index .vf-newsfeed-shell .post .post-actions .action-btn,
body.vf-page-index .vf-newsfeed-shell .js_posts_stream .post .post-actions .action-btn,
body.vf-page-index .vf-newsfeed-shell .js_recommendation-strip .btn,
body.vf-page-index .vf-newsfeed-shell .vf-events-calendar-filter {
  transition: background-color 0.16s ease, border-color 0.16s ease, color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

body.vf-page-index .vf-newsfeed-shell .vf-composer-quick-actions button:hover,
body.vf-page-index .vf-newsfeed-shell .vf-composer-quick-actions button:focus,
body.vf-page-index .vf-newsfeed-shell .vf-posts-filter .btn:hover,
body.vf-page-index .vf-newsfeed-shell .vf-posts-filter .countries-filter:hover {
  border-color: rgba(47, 109, 255, 0.26) !important;
  background: rgba(239, 246, 255, 0.98) !important;
  color: #173c8c !important;
  box-shadow: 0 8px 18px rgba(30, 51, 86, 0.08) !important;
}

body.vf-page-index .vf-newsfeed-shell .post .post-actions .action-btn:hover,
body.vf-page-index .vf-newsfeed-shell .post .post-actions .action-btn:focus,
body.vf-page-index .vf-newsfeed-shell .js_posts_stream .post .post-actions .action-btn:hover,
body.vf-page-index .vf-newsfeed-shell .js_posts_stream .post .post-actions .action-btn:focus {
  border-color: rgba(47, 109, 255, 0.24) !important;
  background: #eff6ff !important;
  color: #173c8c !important;
  transform: translateY(-1px);
}

body.vf-page-index .vf-newsfeed-shell .post .post-actions .action-btn:active,
body.vf-page-index .vf-newsfeed-shell .js_posts_stream .post .post-actions .action-btn:active,
body.vf-page-index .vf-newsfeed-shell .vf-composer-quick-actions button:active,
body.vf-page-index .vf-newsfeed-shell .vf-posts-filter .btn:active {
  transform: translateY(0);
}

body.vf-page-index .vf-newsfeed-shell .card .card-header a:hover,
body.vf-page-index .vf-newsfeed-shell .vf-side-rail .card-header a:hover {
  color: #1d4ed8 !important;
  text-decoration: none !important;
}

body.vf-page-index .vf-newsfeed-shell .js_recommendation-strip .btn-close:focus-visible {
  opacity: 0.9;
  box-shadow: var(--vf-polish-focus) !important;
}

body.vf-page-index .vf-newsfeed-shell .vf-events-calendar-filter:hover {
  color: #0f6b80;
}

body.vf-page-index .vf-newsfeed-shell .vf-events-calendar-filter:focus-visible {
  box-shadow: var(--vf-polish-focus) !important;
}

@media (hover: none), (pointer: coarse) {
  body:not(.night-mode).vf-page-index .main-wrapper .vf-newsfeed-shell .card:not(.vf-promo-card):hover,
  body:not(.night-mode).vf-page-index .main-wrapper .vf-newsfeed-shell .post:hover,
  body.vf-page-index .vf-newsfeed-shell .post .post-actions .action-btn:hover,
  body.vf-page-index .vf-newsfeed-shell .js_posts_stream .post .post-actions .action-btn:hover {
    transform: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.vf-page-index .main-wrapper .vf-newsfeed-shell *,
  body.vf-page-index .main-wrapper .main-header * {
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
  }
}

@media (min-width: 992px) {
  .main-wrapper .vf-stories-card.vf-stories-card-empty .card-header {
    padding-bottom: 6px;
  }
}

@media (max-width: 767.98px) {
  .main-wrapper .vf-newsfeed-shell .vf-stories-card {
    margin-bottom: 12px !important;
    border-radius: 16px !important;
    overflow: hidden;
  }

  .main-wrapper .vf-newsfeed-shell .vf-stories-card .card-header {
    padding: 10px 12px 4px !important;
    min-height: 0;
  }

  .main-wrapper .vf-newsfeed-shell .vf-stories-card .card-header strong {
    font-size: 0.84rem;
    letter-spacing: 0.02em;
  }

  .main-wrapper .vf-newsfeed-shell .vf-stories-card .stories-wrapper {
    margin-bottom: 0 !important;
    padding: 0 10px 10px !important;
    min-height: 0 !important;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
  }

  .main-wrapper .vf-newsfeed-shell .vf-stories-card .stories.sngine.carousel,
  .main-wrapper .vf-newsfeed-shell .vf-stories-card #stories {
    display: flex !important;
    align-items: stretch !important;
    gap: 8px;
    height: 112px !important;
    min-height: 0 !important;
    margin: 0 !important;
  }

  .main-wrapper .vf-newsfeed-shell .vf-stories-card .story,
  .main-wrapper .vf-newsfeed-shell .vf-stories-card .add-story {
    flex: 0 0 78px !important;
    width: 78px !important;
    min-width: 78px !important;
    height: 108px !important;
    margin: 0 !important;
  }

  .main-wrapper .vf-newsfeed-shell .vf-stories-card .story>.item-link>.item-preview,
  .main-wrapper .vf-newsfeed-shell .vf-stories-card .add-story .img {
    height: 108px !important;
    border-radius: 14px !important;
  }

  .main-wrapper .vf-newsfeed-shell .vf-stories-card .add-story .add {
    width: 30px !important;
    height: 30px !important;
    bottom: 6px !important;
    left: calc(50% - 15px) !important;
  }

  .main-wrapper .vf-newsfeed-shell .vf-stories-card.vf-stories-card-empty .card-header {
    display: none !important;
  }

  .main-wrapper .vf-newsfeed-shell .vf-stories-card.vf-stories-card-empty .stories-wrapper {
    padding: 10px 12px !important;
  }

  .main-wrapper .vf-newsfeed-shell .vf-stories-card.vf-stories-card-empty .stories.sngine.carousel,
  .main-wrapper .vf-newsfeed-shell .vf-stories-card.vf-stories-card-empty #stories {
    height: 56px !important;
  }

  .main-wrapper .vf-newsfeed-shell .vf-stories-card.vf-stories-card-empty .add-story {
    display: flex !important;
    align-items: center;
    width: 100% !important;
    min-width: 100% !important;
    height: 56px !important;
    padding: 7px 14px 7px 8px;
    border: 1px solid rgba(219, 227, 240, 0.92);
    border-radius: 16px !important;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
  }

  .main-wrapper .vf-newsfeed-shell .vf-stories-card.vf-stories-card-empty .add-story::after {
    content: "Add a story";
    margin-left: 12px;
    color: #253247;
    font-size: 0.92rem;
    font-weight: 800;
    line-height: 1;
  }

  .main-wrapper .vf-newsfeed-shell .vf-stories-card.vf-stories-card-empty .add-story .img {
    flex: 0 0 40px;
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    border-radius: 50% !important;
  }

  .main-wrapper .vf-newsfeed-shell .vf-stories-card.vf-stories-card-empty .add-story .add {
    top: 29px !important;
    bottom: auto !important;
    left: 36px !important;
    width: 22px !important;
    height: 22px !important;
    padding: 4px !important;
    transform: none !important;
  }

  .main-wrapper .vf-newsfeed-shell .composer-launcher {
    margin-bottom: 12px !important;
    border-radius: 16px !important;
  }

  .main-wrapper .vf-newsfeed-shell .composer-launcher .card-body {
    padding: 10px 12px !important;
  }

  .main-wrapper .vf-newsfeed-shell .composer-launcher .d-flex {
    min-height: 46px;
  }

  .main-wrapper .vf-newsfeed-shell .composer-launcher-avatar {
    flex: 0 0 36px !important;
    width: 36px !important;
    min-width: 36px !important;
    max-width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
    max-height: 36px !important;
    margin-right: 9px !important;
    object-fit: cover;
  }

  .main-wrapper .vf-newsfeed-shell .composer-launcher-input {
    min-height: 46px;
    height: 46px;
    padding: 0 14px !important;
    border-radius: 999px !important;
    align-items: center;
    overflow: hidden;
    color: #334155;
    font-size: 0.9rem !important;
    line-height: 1.25 !important;
    white-space: nowrap;
    text-overflow: ellipsis;
  }

  .main-wrapper .vf-newsfeed-shell .vf-posts-filter-mobile-sheet-enabled {
    margin-bottom: 12px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
  }

  .main-wrapper .vf-newsfeed-shell .vf-posts-filter-mobile-trigger {
    min-height: 42px !important;
    border: 1px solid rgba(219, 227, 240, 0.96) !important;
    background: rgba(255, 255, 255, 0.96) !important;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08) !important;
  }

  .vf-posts-filter-mobile-backdrop {
    pointer-events: none !important;
  }

  .vf-posts-filter-mobile-backdrop.is-open {
    pointer-events: auto !important;
  }

  .vf-posts-filter-mobile-sheet {
    bottom: max(84px, calc(76px + env(safe-area-inset-bottom, 0px))) !important;
    width: min(calc(100vw - 20px), 420px) !important;
    max-height: min(620px, calc(100dvh - 132px)) !important;
    padding: 14px 14px 18px !important;
    border: 1px solid rgba(219, 227, 240, 0.86);
    border-radius: 24px !important;
  }

  .vf-posts-filter-mobile-sheet-title {
    margin-bottom: 14px !important;
    font-size: 1.05rem !important;
  }

  .vf-posts-filter-mobile-stack .btn,
  .vf-posts-filter-mobile-stack .countries-filter,
  .vf-posts-filter-mobile-stack .btn-group .btn {
    min-height: 42px !important;
    border-radius: 14px !important;
  }

  .main-wrapper .vf-newsfeed-shell .js_posts_stream {
    padding-bottom: max(90px, calc(78px + env(safe-area-inset-bottom, 0px)));
  }
}

@media (orientation: landscape) and (max-width: 1024px) and (pointer: coarse) {
  html.app-standalone body:not(.vf-page-live):not(.vf-page-broadcasting):not(.vf-page-podcasts):not(.vf-page-broadcasts):not(.vf-page-livesmartvideo) {
    overflow: hidden !important;
  }

  html.app-standalone body:not(.vf-page-live):not(.vf-page-broadcasting):not(.vf-page-podcasts):not(.vf-page-broadcasts):not(.vf-page-livesmartvideo)::before {
    content: "Please rotate your device to portrait mode.";
    position: fixed;
    inset: 0;
    z-index: 2147483646;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 32px;
    background:
      radial-gradient(circle at 50% 12%, rgba(110, 229, 194, 0.16), transparent 30%),
      linear-gradient(145deg, #17365a 0%, #10233d 100%);
    color: #ffffff;
    font-size: clamp(1.25rem, 5vw, 2rem);
    font-weight: 800;
    line-height: 1.25;
    text-align: center;
    letter-spacing: 0;
    pointer-events: auto;
  }

  html.app-standalone body:not(.vf-page-live):not(.vf-page-broadcasting):not(.vf-page-podcasts):not(.vf-page-broadcasts):not(.vf-page-livesmartvideo)::after {
    content: "";
    position: fixed;
    left: 50%;
    top: calc(50% - 86px);
    z-index: 2147483647;
    width: 42px;
    height: 66px;
    border: 3px solid rgba(255, 255, 255, 0.88);
    border-radius: 13px;
    transform: translate(-50%, -50%) rotate(-90deg);
    box-shadow: 0 0 0 10px rgba(255, 255, 255, 0.08);
    pointer-events: none;
  }
}

@media (max-width: 767.98px) {
  .asw-menu-btn {
    bottom: max(84px, calc(76px + env(safe-area-inset-bottom, 0px))) !important;
    left: 16px !important;
  }
}

@media (max-width: 767.98px) {
  html body .footer-bottom-bar {
    height: 76px !important;
    min-height: 76px !important;
    max-height: 76px !important;
    border-top: 1px solid rgba(148, 163, 184, 0.18) !important;
    background:
      linear-gradient(180deg, rgba(32, 97, 151, 0.96), rgba(18, 39, 67, 0.98)) !important;
    box-shadow: 0 -14px 32px rgba(15, 23, 42, 0.22) !important;
    border-radius: 0 !important;
  }

  html body .footer-bottom-bar .container,
  html body .footer-bottom-bar-links {
    height: 76px !important;
    min-height: 76px !important;
    max-height: 76px !important;
  }

  html body .footer-bottom-bar .container {
    padding-right: 8px !important;
    padding-left: 8px !important;
  }

  html body .footer-bottom-bar-links {
    align-items: center !important;
    gap: 3px !important;
  }

  html body .footer-bottom-bar-links > .link,
  html body .footer-bottom-bar-links .link {
    height: 76px !important;
    min-height: 76px !important;
    max-height: 76px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  html body .footer-bottom-bar-links > .link > a,
  html body .footer-bottom-bar-links .link a,
  html.app-standalone body .footer-bottom-bar-links > .link > a {
    height: 64px !important;
    min-height: 64px !important;
    max-height: 64px !important;
    gap: 3px !important;
    border-radius: 0 !important;
  }

  html body .footer-bottom-bar-links .link.active > a,
  html body .footer-bottom-bar-links .link > a:hover,
  html body .footer-bottom-bar-links .link.show > a {
    background: rgba(255, 255, 255, 0.1) !important;
  }

  html body .footer-bottom-bar-links .title {
    font-size: 0.68rem !important;
    line-height: 1.1 !important;
  }

  html body .footer-bottom-bar .footer-add-link {
    transform: none !important;
  }

  html body .footer-bottom-bar .footer-add-toggle {
    width: 58px !important;
    min-width: 58px !important;
    height: 64px !important;
    min-height: 64px !important;
    max-height: 64px !important;
    border-radius: 0 !important;
    border: 1px solid rgba(255, 255, 255, 0.26) !important;
    box-shadow: 0 12px 24px rgba(24, 119, 242, 0.28) !important;
  }

  html body .footer-bottom-bar .footer-add-toggle .title {
    font-size: 0.66rem !important;
  }

  html body .footer-add-backdrop {
    pointer-events: none !important;
  }

  html body .footer-add-backdrop.active {
    pointer-events: auto !important;
    z-index: 2140 !important;
  }

  html body.footer-add-open .footer-bottom-bar {
    z-index: 2141 !important;
    overflow: visible !important;
  }

  html body.footer-add-open .footer-bottom-bar .footer-add-link {
    position: relative !important;
    z-index: 2142 !important;
    overflow: visible !important;
  }

  html body .footer-bottom-bar .footer-add-menu {
    bottom: max(84px, calc(76px + env(safe-area-inset-bottom, 0px))) !important;
    width: min(calc(100vw - 20px), 420px) !important;
    max-height: min(620px, calc(100dvh - 132px)) !important;
    border-radius: 24px !important;
  }

  html body.footer-add-open .footer-bottom-bar .footer-add-menu.show {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    z-index: 2143 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    pointer-events: auto !important;
  }

  html body .footer-add-sheet-body {
    max-height: min(620px, calc(100dvh - 132px)) !important;
    padding-bottom: 20px !important;
  }
}

/* Keep profile action buttons in a single row */
@media (min-width: 992px) {
  html body .main-wrapper .vf-profile-shell .profile-buttons-wrapper {
    display: inline-flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 8px !important;
  }

  html body .main-wrapper .vf-profile-shell .profile-buttons-wrapper > .btn,
  html body .main-wrapper .vf-profile-shell .profile-buttons-wrapper > button.btn,
  html body .main-wrapper .vf-profile-shell .profile-buttons-wrapper > a.btn,
  html body .main-wrapper .vf-profile-shell .profile-buttons-wrapper > .dropdown,
  html body .main-wrapper .vf-profile-shell .profile-buttons-wrapper > .d-inline-block.dropdown,
  html body .main-wrapper .vf-profile-shell .profile-buttons-wrapper > .d-inline-block.dropdown > .btn {
    position: static !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    margin: 0 !important;
    transform: none !important;
  }

  html body .main-wrapper .vf-profile-shell .profile-buttons-wrapper > .d-inline-block.dropdown {
    display: inline-flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    position: relative !important;
  }

  html body .main-wrapper .vf-profile-shell .profile-buttons-wrapper > .d-inline-block.dropdown > .action-dropdown-menu,
  html body .main-wrapper .vf-profile-shell .profile-buttons-wrapper > .d-inline-block.dropdown > .dropdown-menu.action-dropdown-menu,
  html body .main-wrapper .vf-profile-shell .profile-buttons-wrapper > .d-inline-block.dropdown > .dropdown-menu.action-dropdown-menu[data-bs-popper] {
    top: auto !important;
    right: 0 !important;
    bottom: calc(100% + 10px) !important;
    left: auto !important;
    width: max-content !important;
    min-width: 240px !important;
    max-width: min(280px, calc(100vw - 32px)) !important;
    max-height: min(380px, calc(100vh - 128px)) !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    margin: 0 !important;
    transform: none !important;
    border-radius: 14px !important;
    z-index: 60 !important;
  }

  html body .main-wrapper .vf-profile-shell .profile-buttons-wrapper > .d-inline-block.dropdown.profile-action-menu-open > .action-dropdown-menu,
  html body .main-wrapper .vf-profile-shell .profile-buttons-wrapper > .d-inline-block.dropdown.profile-action-menu-open > .dropdown-menu.action-dropdown-menu,
  html body .main-wrapper .vf-profile-shell .profile-buttons-wrapper > .d-inline-block.dropdown.profile-action-menu-open > .dropdown-menu.action-dropdown-menu[data-bs-popper] {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    right: 0 !important;
    bottom: auto !important;
    left: auto !important;
    width: max-content !important;
    min-width: 240px !important;
    max-width: min(300px, calc(100vw - 48px)) !important;
    max-height: min(520px, calc(100vh - 96px)) !important;
    max-height: min(520px, calc(100dvh - 96px)) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    transform: none !important;
    z-index: 2147483000 !important;
  }

  html body .main-wrapper .vf-profile-shell .profile-buttons-wrapper > .d-inline-block.dropdown.profile-action-menu-open > .action-dropdown-menu.vf-profile-action-menu-positioned,
  html body .main-wrapper .vf-profile-shell .profile-buttons-wrapper > .d-inline-block.dropdown.profile-action-menu-open > .dropdown-menu.action-dropdown-menu.vf-profile-action-menu-positioned,
  html body .main-wrapper .vf-profile-shell .profile-buttons-wrapper > .d-inline-block.dropdown.profile-action-menu-open > .dropdown-menu.action-dropdown-menu.vf-profile-action-menu-positioned[data-bs-popper] {
    position: fixed !important;
    top: var(--vf-profile-action-menu-top, 16px) !important;
    right: auto !important;
    bottom: auto !important;
    left: var(--vf-profile-action-menu-left, 16px) !important;
    width: min(300px, calc(100vw - 32px)) !important;
    min-width: min(240px, calc(100vw - 32px)) !important;
    max-width: min(300px, calc(100vw - 32px)) !important;
    max-height: var(--vf-profile-action-menu-max-height, min(520px, calc(100dvh - 32px))) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    transform: none !important;
    z-index: 2147483000 !important;
  }

  html body .main-wrapper .vf-profile-shell .profile-buttons-wrapper > .d-inline-block.dropdown > .action-dropdown-menu .dropdown-item {
    padding: 8px 10px !important;
    border-radius: 10px !important;
    white-space: normal !important;
  }

  html body .main-wrapper .vf-profile-shell .profile-buttons-wrapper > .d-inline-block.dropdown > .action-dropdown-menu .dropdown-divider {
    margin: 4px 0 !important;
  }

  html body .main-wrapper .vf-profile-shell .profile-buttons-wrapper > .d-inline-block.dropdown > .action-dropdown-menu .action {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.92rem;
    line-height: 1.15;
  }

  html body .main-wrapper .vf-profile-shell .profile-buttons-wrapper > .d-inline-block.dropdown > .action-dropdown-menu .action-desc {
    display: none !important;
  }

  html body .main-wrapper .vf-profile-shell .profile-buttons-wrapper > .d-inline-block.dropdown > .action-dropdown-menu .main-icon,
  html body .main-wrapper .vf-profile-shell .profile-buttons-wrapper > .d-inline-block.dropdown > .action-dropdown-menu .fa {
    width: 18px !important;
    height: 18px !important;
    flex-basis: 18px !important;
  }
}

@media (max-width: 991.98px) {
  html body .main-wrapper .vf-profile-shell .profile-buttons-wrapper > .d-inline-block.dropdown.profile-action-menu-open > .action-dropdown-menu,
  html body .main-wrapper .vf-profile-shell .profile-buttons-wrapper > .d-inline-block.dropdown.profile-action-menu-open > .dropdown-menu.action-dropdown-menu,
  html body .main-wrapper .vf-profile-shell .profile-buttons-wrapper > .d-inline-block.dropdown.profile-action-menu-open > .dropdown-menu.action-dropdown-menu[data-bs-popper] {
    position: fixed !important;
    top: auto !important;
    right: 12px !important;
    bottom: max(92px, calc(84px + env(safe-area-inset-bottom, 0px))) !important;
    left: 12px !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    max-height: min(520px, calc(100vh - 156px)) !important;
    max-height: min(520px, calc(100dvh - 156px)) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    transform: none !important;
    z-index: 2147483000 !important;
  }
}

/* Forums landing hero */
html body .main-wrapper .vf-forums-hero.page-header {
  position: relative;
  width: min(calc(100% - 48px), 1320px) !important;
  max-width: calc(100% - 48px) !important;
  min-height: 0 !important;
  margin: 18px auto 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 24px !important;
  background:
    radial-gradient(circle at 86% 22%, rgba(126, 232, 210, 0.14), transparent 28%),
    radial-gradient(circle at 12% 10%, rgba(255, 255, 255, 0.12), transparent 24%),
    linear-gradient(110deg, #112b49 0%, #1f6699 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 24px 54px rgba(12, 24, 43, 0.18) !important;
}

html body .main-wrapper .vf-forums-hero.page-header::before {
  content: "" !important;
  position: absolute;
  inset: 0;
  height: auto !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent 58%),
    radial-gradient(circle at 100% 100%, rgba(45, 166, 235, 0.18), transparent 34%) !important;
  pointer-events: none;
}

html body .main-wrapper .vf-forums-hero.page-header::after {
  content: "" !important;
  position: absolute;
  right: -70px;
  bottom: -88px;
  width: 250px;
  height: 250px;
  border: 32px solid rgba(255, 255, 255, 0.08);
  border-radius: 50%;
  pointer-events: none;
}

html body .main-wrapper .vf-forums-hero .floating-img,
html body .main-wrapper .vf-forums-hero .circle-2,
html body .main-wrapper .vf-forums-hero .circle-3 {
  display: none !important;
}

html body .main-wrapper .vf-forums-hero .inner {
  position: relative;
  z-index: 1;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(340px, 430px);
  grid-template-areas:
    "kicker stats"
    "title stats"
    "copy search";
  column-gap: 46px;
  align-items: center;
  width: 100% !important;
  max-width: 1320px !important;
  min-height: 250px !important;
  margin: 0 auto !important;
  padding: 30px 34px !important;
  text-align: left !important;
}

html body .main-wrapper .vf-forums-hero-kicker {
  grid-area: kicker;
  align-self: end;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin: 0 0 10px !important;
  color: rgba(255, 255, 255, 0.78) !important;
  font-size: 0.76rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.14em !important;
  line-height: 1.2;
  text-transform: uppercase;
}

html body .main-wrapper .vf-forums-hero-kicker::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #7ce8d2;
  box-shadow: 0 0 0 6px rgba(124, 232, 210, 0.14);
}

html body .main-wrapper .vf-forums-hero h2 {
  grid-area: title;
  width: auto !important;
  margin: 0 !important;
  color: #ffffff !important;
  font-size: clamp(2.1rem, 3.8vw, 3.35rem) !important;
  font-weight: 900 !important;
  line-height: 1.02 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  text-shadow: 0 2px 12px rgba(6, 16, 44, 0.22);
}

html body .main-wrapper .vf-forums-hero p.text-xlg {
  grid-area: copy;
  max-width: 620px !important;
  margin: 12px 0 0 !important;
  color: rgba(255, 255, 255, 0.9) !important;
  font-size: 1rem !important;
  font-weight: 650 !important;
  line-height: 1.5 !important;
  text-align: left !important;
  text-shadow: 0 1px 8px rgba(6, 16, 44, 0.18);
}

html body .main-wrapper .vf-forums-hero-stats {
  grid-area: stats;
  align-self: end;
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  width: 100%;
  margin: 0 !important;
}

html body .main-wrapper .vf-forums-hero-stat {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 10px;
  min-height: 46px;
  padding: 8px 13px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.1);
  color: #ffffff;
  backdrop-filter: blur(10px);
}

html body .main-wrapper .vf-forums-hero-stat strong {
  color: #ffffff !important;
  font-size: 1rem !important;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
}

html body .main-wrapper .vf-forums-hero-stat span {
  color: rgba(255, 255, 255, 0.78) !important;
  font-size: 0.66rem !important;
  font-weight: 850;
  letter-spacing: 0.05em;
  line-height: 1.1;
  text-transform: uppercase;
  white-space: nowrap;
}

html body .main-wrapper .vf-forums-hero-search {
  grid-area: search;
  align-self: start;
  width: 100%;
  margin: 14px 0 0 !important;
}

html body .main-wrapper .vf-forums-hero-search .input-group {
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.22) !important;
  border-radius: 16px !important;
  background: rgba(8, 20, 36, 0.22) !important;
  box-shadow: 0 14px 28px rgba(6, 12, 20, 0.16) !important;
  backdrop-filter: blur(10px);
}

html body .main-wrapper .vf-forums-hero-search .form-control {
  min-height: 44px !important;
  border: 0 !important;
  background: transparent !important;
  color: #ffffff !important;
  box-shadow: none !important;
}

html body .main-wrapper .vf-forums-hero-search .form-control::placeholder {
  color: rgba(255, 255, 255, 0.74) !important;
}

html body .main-wrapper .vf-forums-hero-search .btn {
  min-height: 44px !important;
  border: 0 !important;
  background: linear-gradient(135deg, var(--vf-accent, #4c6fff), var(--vf-accent-strong, #2f6fe4)) !important;
  color: #ffffff !important;
  padding-right: 22px !important;
  padding-left: 22px !important;
  font-weight: 850 !important;
}

html body .main-wrapper .vf-forums-shell {
  margin-top: 18px !important;
}

html body .main-wrapper .vf-forums-shell .content-tabs {
  border-radius: 18px !important;
  border: 1px solid rgba(219, 227, 240, 0.78) !important;
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.08) !important;
}

html body .main-wrapper .vf-forums-stats-panel .card {
  border: 1px solid rgba(219, 227, 240, 0.78) !important;
  border-radius: 18px !important;
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.08) !important;
}

@media (max-width: 767.98px) {
  html body .main-wrapper .vf-forums-hero.page-header {
    width: min(calc(100% - 24px), 1320px) !important;
    max-width: calc(100% - 24px) !important;
  }

  html body .main-wrapper .vf-forums-hero .inner {
    display: block !important;
    min-height: 0 !important;
    padding: 24px !important;
  }

  html body .main-wrapper .vf-forums-hero h2 {
    font-size: 2.1rem !important;
  }

  html body .main-wrapper .vf-forums-hero-stats {
    margin-top: 18px !important;
  }
}

/* Sidebar destination pages: shared professional module shell. */
html body .main-wrapper .vf-sidebar-hero.page-header {
  position: relative;
  width: min(calc(100% - 48px), 1320px) !important;
  max-width: calc(100% - 48px) !important;
  min-height: 0 !important;
  margin: 18px auto 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 24px !important;
  background:
    radial-gradient(circle at 88% 22%, rgba(124, 232, 210, 0.14), transparent 28%),
    radial-gradient(circle at 10% 10%, rgba(255, 255, 255, 0.12), transparent 24%),
    linear-gradient(112deg, #112b49 0%, #1f6699 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 24px 54px rgba(12, 24, 43, 0.18) !important;
}

html body .main-wrapper .vf-sidebar-hero.page-header::before {
  content: "" !important;
  position: absolute;
  inset: 0;
  height: auto !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent 58%),
    radial-gradient(circle at 100% 100%, rgba(45, 166, 235, 0.18), transparent 34%) !important;
  pointer-events: none;
}

html body .main-wrapper .vf-sidebar-hero.page-header::after {
  content: "" !important;
  position: absolute;
  right: -68px;
  bottom: -90px;
  width: 250px;
  height: 250px;
  border: 32px solid rgba(255, 255, 255, 0.08);
  border-radius: 50%;
  pointer-events: none;
}

html body .main-wrapper .vf-sidebar-hero .floating-img,
html body .main-wrapper .vf-sidebar-hero .circle-2,
html body .main-wrapper .vf-sidebar-hero .circle-3 {
  display: none !important;
}

html body .main-wrapper .vf-sidebar-hero .inner,
html body .main-wrapper .vf-sidebar-hero .container,
html body .main-wrapper .vf-sidebar-hero .container-fluid {
  position: relative;
  z-index: 1;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(330px, 430px);
  grid-template-areas:
    "kicker stats"
    "title stats"
    "copy search";
  column-gap: 46px;
  align-items: center;
  width: 100% !important;
  max-width: 1320px !important;
  min-height: 238px !important;
  margin: 0 auto !important;
  padding: 30px 34px !important;
  text-align: left !important;
}

html body .main-wrapper .vf-sidebar-hero .row,
html body .main-wrapper .vf-sidebar-hero .row.mt20,
html body .main-wrapper .vf-sidebar-hero .row.vf-events-hero-search {
  grid-area: search;
  width: 100%;
  max-width: none !important;
  margin: 14px 0 0 !important;
}

html body .main-wrapper .vf-sidebar-hero .row.justify-content-center,
html body .main-wrapper .vf-sidebar-hero .row.mt20.justify-content-center {
  display: contents !important;
}

html body .main-wrapper .vf-sidebar-hero .row.justify-content-center > [class*="col-"] {
  grid-area: title;
  max-width: 620px !important;
  padding: 0 !important;
  text-align: left !important;
}

html body .main-wrapper .vf-sidebar-hero .row.justify-content-center > [class*="col-"] h2,
html body .main-wrapper .vf-sidebar-hero .row.justify-content-center > [class*="col-"] p {
  text-align: left !important;
}

html body .main-wrapper .vf-sidebar-hero .row.mt20.justify-content-center > [class*="col-"] {
  grid-area: search;
  max-width: 100% !important;
}

html body .main-wrapper .vf-sidebar-hero .vf-events-hero-kicker {
  grid-area: kicker;
  align-self: end;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin: 0 0 10px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: rgba(255, 255, 255, 0.78) !important;
  font-size: 0.76rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.14em !important;
  line-height: 1.2;
  text-transform: uppercase;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

html body .main-wrapper .vf-sidebar-hero .vf-events-hero-kicker::before {
  width: 8px !important;
  height: 8px !important;
  background: #7ce8d2 !important;
  box-shadow: 0 0 0 6px rgba(124, 232, 210, 0.14) !important;
}

html body .main-wrapper .vf-sidebar-hero h2 {
  grid-area: title;
  width: auto !important;
  margin: 0 !important;
  color: #ffffff !important;
  font-size: clamp(2.05rem, 3.65vw, 3.2rem) !important;
  font-weight: 900 !important;
  line-height: 1.02 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  text-shadow: 0 2px 12px rgba(6, 16, 44, 0.22);
}

html body .main-wrapper .vf-sidebar-hero .text-xlg,
html body .main-wrapper .vf-sidebar-hero p.text-xlg,
html body .main-wrapper .vf-sidebar-hero .vf-events-hero-subtitle {
  grid-area: copy;
  max-width: 620px !important;
  margin: 12px 0 0 !important;
  color: rgba(255, 255, 255, 0.9) !important;
  font-size: 1rem !important;
  font-weight: 650 !important;
  line-height: 1.5 !important;
  text-align: left !important;
  text-shadow: 0 1px 8px rgba(6, 16, 44, 0.18);
}

html body .main-wrapper .vf-sidebar-hero .vf-events-hero-stats {
  grid-area: stats;
  align-self: end;
  display: grid !important;
  grid-template-columns: 1fr;
  gap: 10px;
  width: 100%;
  max-width: none !important;
  margin: 0 !important;
}

html body .main-wrapper .vf-sidebar-hero .vf-events-hero-stat {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 10px;
  min-height: 46px;
  padding: 8px 13px !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.1) !important;
  color: #ffffff !important;
  text-align: left;
  backdrop-filter: blur(10px);
}

html body .main-wrapper .vf-sidebar-hero .vf-events-hero-stat strong {
  color: #ffffff !important;
  font-size: 0.92rem !important;
  font-weight: 900 !important;
  line-height: 1;
  white-space: nowrap;
}

html body .main-wrapper .vf-sidebar-hero .vf-events-hero-stat span,
html body .main-wrapper .vf-sidebar-hero .vf-events-hero-stat em {
  margin: 0 !important;
  color: rgba(255, 255, 255, 0.78) !important;
  font-size: 0.64rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.05em;
  line-height: 1.1;
  text-transform: uppercase;
  white-space: nowrap;
}

html body .main-wrapper .vf-sidebar-hero .mx-sm-auto,
html body .main-wrapper .vf-sidebar-hero .col-sm-9,
html body .main-wrapper .vf-sidebar-hero .col-lg-6 {
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body .main-wrapper .vf-sidebar-hero .input-group {
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.22) !important;
  border-radius: 16px !important;
  background: rgba(8, 20, 36, 0.22) !important;
  box-shadow: 0 14px 28px rgba(6, 12, 20, 0.16) !important;
  backdrop-filter: blur(10px);
}

html body .main-wrapper .vf-sidebar-hero .form-control {
  min-height: 44px !important;
  border: 0 !important;
  background: transparent !important;
  color: #ffffff !important;
  box-shadow: none !important;
}

html body .main-wrapper .vf-sidebar-hero .form-control::placeholder {
  color: rgba(255, 255, 255, 0.74) !important;
}

html body .main-wrapper .vf-sidebar-hero .btn {
  min-height: 44px !important;
  border: 0 !important;
  background: linear-gradient(135deg, var(--vf-accent, #4c6fff), var(--vf-accent-strong, #2f6fe4)) !important;
  color: #ffffff !important;
  padding-right: 22px !important;
  padding-left: 22px !important;
  font-weight: 850 !important;
}

html body .main-wrapper .vf-market-hero .input-group {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(120px, 0.62fr) auto;
}

html body .main-wrapper .vf-games-hero > .container > .mt10,
html body .main-wrapper .vf-games-hero > .container-fluid > .mt10 {
  display: none !important;
}

html body .main-wrapper .vf-sidebar-module-shell {
  margin-top: 18px !important;
}

html body .main-wrapper .vf-sidebar-module-shell .content-tabs {
  border: 1px solid rgba(219, 227, 240, 0.78) !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, 0.96) !important;
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.08) !important;
}

html body .main-wrapper .vf-sidebar-module-shell .content-tabs ul {
  min-height: 56px;
  align-items: center;
}

html body.vf-page-games .main-wrapper .vf-sidebar-module-shell .vf-games-tabs {
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: thin;
}

html body.vf-page-games .main-wrapper .vf-sidebar-module-shell .vf-games-tabs ul {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0;
  width: 100%;
  min-width: max-content;
  margin: 0 !important;
  padding: 0 10px !important;
}

html body.vf-page-games .main-wrapper .vf-sidebar-module-shell .vf-games-tabs li {
  flex: 1 0 128px !important;
  min-width: 128px;
  text-align: center;
}

html body.vf-page-games .main-wrapper .vf-sidebar-module-shell .vf-games-tabs li a {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 56px;
  padding: 0 10px !important;
  white-space: nowrap !important;
}

html body .main-wrapper .vf-sidebar-module-shell .content-tabs .float-end {
  margin: 8px 10px 8px auto !important;
}

html body .main-wrapper .vf-sidebar-module-shell .card {
  border: 1px solid rgba(219, 227, 240, 0.78) !important;
  border-radius: 18px !important;
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.07) !important;
}

html body .main-wrapper .vf-sidebar-module-shell .card .card-header {
  border-bottom-color: rgba(219, 227, 240, 0.72) !important;
  background: linear-gradient(180deg, rgba(248, 250, 252, 0.98), rgba(255, 255, 255, 0.98)) !important;
  color: #172033 !important;
  font-weight: 800 !important;
}

html body .main-wrapper .vf-sidebar-module-shell .side-nav li a {
  border-radius: 12px !important;
}

html body .main-wrapper .vf-sidebar-module-shell .posts-filter {
  border: 1px solid rgba(219, 227, 240, 0.78) !important;
  border-radius: 16px !important;
  background: rgba(255, 255, 255, 0.96) !important;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.06) !important;
}

html body .main-wrapper .vf-sidebar-module-shell .product,
html body .main-wrapper .vf-sidebar-module-shell .movie-card,
html body .main-wrapper .vf-sidebar-module-shell .game-card,
html body .main-wrapper .vf-sidebar-module-shell .contest-card {
  border-radius: 16px !important;
  overflow: hidden;
}

html body .main-wrapper .vf-creator-tool-shell .card,
html body .main-wrapper .vf-creator-tool-shell.card,
html body .main-wrapper .vf-creator-tool-shell .content-tabs {
  border: 1px solid rgba(219, 227, 240, 0.78) !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, 0.96) !important;
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.07) !important;
}

html body .main-wrapper .vf-creator-tool-shell .card-header {
  border-bottom-color: rgba(219, 227, 240, 0.72) !important;
  background: linear-gradient(180deg, rgba(248, 250, 252, 0.98), rgba(255, 255, 255, 0.98)) !important;
  color: #172033 !important;
  font-weight: 800 !important;
}

html body .main-wrapper .vf-workspace-hero.page-header {
  position: relative;
  overflow: hidden !important;
  min-height: 0 !important;
  margin: 0 0 14px !important;
  padding: 0 !important;
  border: 1px solid rgba(219, 227, 240, 0.74) !important;
  border-radius: 20px !important;
  background:
    radial-gradient(circle at 88% 28%, rgba(124, 232, 210, 0.16), transparent 30%),
    linear-gradient(118deg, #112b49 0%, #22669a 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.1) !important;
}

html body .main-wrapper .vf-workspace-hero.page-header::after {
  content: "" !important;
  position: absolute;
  right: -42px;
  bottom: -68px;
  width: 180px;
  height: 180px;
  border: 24px solid rgba(255, 255, 255, 0.08);
  border-radius: 50%;
}

html body .main-wrapper .vf-workspace-hero .inner {
  position: relative;
  z-index: 1;
  width: 100%;
  margin: 0 !important;
  padding: 24px 28px !important;
  text-align: left !important;
}

html body .main-wrapper .vf-workspace-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  color: rgba(255, 255, 255, 0.78);
  font-size: 0.74rem;
  font-weight: 850;
  letter-spacing: 0.14em;
  line-height: 1.2;
  text-transform: uppercase;
}

html body .main-wrapper .vf-workspace-eyebrow::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #7ce8d2;
  box-shadow: 0 0 0 6px rgba(124, 232, 210, 0.14);
}

html body .main-wrapper .vf-workspace-hero h2 {
  margin: 0 !important;
  color: #ffffff !important;
  font-size: clamp(1.75rem, 3vw, 2.45rem) !important;
  font-weight: 900 !important;
  line-height: 1.05 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
}

html body .main-wrapper .vf-workspace-hero p.text-lg {
  max-width: 680px;
  margin: 8px 0 0 !important;
  color: rgba(255, 255, 255, 0.88) !important;
  font-size: 0.98rem !important;
  font-weight: 650 !important;
  line-height: 1.45 !important;
  text-align: left !important;
}

html body .main-wrapper .vf-workspace-card {
  border: 1px solid rgba(219, 227, 240, 0.78) !important;
  border-radius: 18px !important;
  overflow: hidden;
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.07) !important;
}

html body .main-wrapper .vf-workspace-card .card-header {
  border-bottom-color: rgba(219, 227, 240, 0.72) !important;
  background: linear-gradient(180deg, rgba(248, 250, 252, 0.98), rgba(255, 255, 255, 0.98)) !important;
  color: #172033 !important;
  font-weight: 800 !important;
}

html body .main-wrapper .vf-workspace-card .card-body > ul {
  margin-bottom: 0 !important;
}

html body .main-wrapper .vf-creator-tool-shell .live-stream-wrapper {
  border: 1px solid rgba(219, 227, 240, 0.78) !important;
  border-radius: 22px !important;
  background: rgba(255, 255, 255, 0.96) !important;
  box-shadow: 0 18px 42px rgba(15, 23, 42, 0.08) !important;
}

html body .main-wrapper .vf-sidebar-module-shell iframe {
  border-radius: 16px;
}

/* Podcast live studio */
html body .main-wrapper .vf-podcast-live-page {
  margin-top: 18px !important;
}

html body .main-wrapper .vf-podcast-live-page .vf-broadcasting-card {
  padding: 22px !important;
  border: 1px solid rgba(219, 227, 240, 0.78) !important;
  border-radius: 22px !important;
  background:
    radial-gradient(circle at 0 0, rgba(124, 232, 210, 0.1), transparent 28%),
    linear-gradient(180deg, #ffffff, #f8fbff) !important;
  box-shadow: 0 20px 46px rgba(15, 23, 42, 0.1) !important;
}

html body .main-wrapper .vf-podcast-live-page .vf-broadcasting-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas:
    "bar"
    "stage"
    "meta"
    "actions";
  gap: 18px;
  align-items: start;
}

html body .main-wrapper .vf-podcast-live-page .vf-broadcasting-studio-bar {
  grid-area: bar;
  margin: 0 !important;
}

html body .main-wrapper .vf-podcast-live-page .vf-broadcasting-frame {
  grid-area: stage;
  height: clamp(560px, 48vw, 760px) !important;
  min-height: 520px !important;
  margin: 0 !important;
}

html body .main-wrapper .vf-podcast-live-page .vf-broadcasting-meta {
  grid-area: meta;
  max-height: none;
  margin: 0 !important;
  padding: 18px !important;
  overflow: visible;
  border-radius: 18px !important;
}

html body .main-wrapper .vf-podcast-live-page .vf-broadcasting-meta > .mt20:first-child {
  margin-top: 0 !important;
}

html body .main-wrapper .vf-podcast-live-page .vf-podcast-field,
html body .main-wrapper .vf-podcast-live-page .vf-podcast-fields-grid > [class*="col-"] {
  margin-top: 0 !important;
}

html body .main-wrapper .vf-podcast-live-page .vf-podcast-field + .vf-podcast-field,
html body .main-wrapper .vf-podcast-live-page .vf-podcast-fields-grid {
  margin-top: 14px !important;
}

html body .main-wrapper .vf-podcast-live-page .vf-podcast-fields-grid {
  --bs-gutter-x: 12px;
  --bs-gutter-y: 12px;
}

html body .main-wrapper .vf-podcast-live-page .vf-podcast-field-title,
html body .main-wrapper .vf-podcast-live-page .vf-podcast-field-description {
  max-width: none;
}

html body .main-wrapper .vf-podcast-live-page .form-label {
  margin-bottom: 6px !important;
  color: #334155 !important;
  font-size: 0.78rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.02em;
}

html body .main-wrapper .vf-podcast-live-page .form-control,
html body .main-wrapper .vf-podcast-live-page .form-select {
  min-height: 42px !important;
  border-color: rgba(203, 213, 225, 0.88) !important;
  border-radius: 13px !important;
  background-color: rgba(255, 255, 255, 0.94) !important;
  box-shadow: none !important;
}

html body .main-wrapper .vf-podcast-live-page textarea.form-control {
  min-height: 84px !important;
  resize: vertical;
}

html body .main-wrapper .vf-podcast-live-page #js_livesmart-podcast-transcript {
  min-height: 108px !important;
}

html body .main-wrapper .vf-podcast-live-page .vf-broadcasting-help {
  margin-top: 14px !important;
  padding: 14px 16px !important;
  border-radius: 14px !important;
}

html body .main-wrapper .vf-podcast-live-page .vf-broadcasting-help ul {
  display: grid;
  gap: 5px;
}

html body .main-wrapper .vf-podcast-live-page .vf-broadcasting-actions {
  grid-area: actions;
  justify-content: flex-end !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body .main-wrapper .vf-podcast-live-page #js_live-start {
  min-height: 48px !important;
  border-radius: 15px !important;
  font-size: 0.92rem !important;
}

html body .main-wrapper .vf-podcast-live-page #js_live-start a {
  font-size: 0.92rem !important;
  white-space: normal;
}

html body .main-wrapper .vf-podcast-live-page .vf-broadcasting-tip .btn {
  min-height: 48px !important;
}

@media (max-width: 1199.98px) {
  html body .main-wrapper .vf-podcast-live-page .vf-broadcasting-shell {
    grid-template-columns: 1fr;
    grid-template-areas:
      "bar"
      "stage"
      "meta"
      "actions";
  }

  html body .main-wrapper .vf-podcast-live-page .vf-broadcasting-meta {
    max-height: none;
    overflow: visible;
  }
}

@media (max-width: 767.98px) {
  html body .main-wrapper .vf-podcast-live-page .vf-broadcasting-card {
    padding: 14px !important;
  }

  html body .main-wrapper .vf-podcast-live-page .vf-broadcasting-frame {
    height: min(420px, 62vh) !important;
    min-height: 320px !important;
  }

  html body .main-wrapper .vf-podcast-live-page .vf-broadcasting-actions,
  html body .main-wrapper .vf-podcast-live-page .vf-broadcasting-tip,
  html body .main-wrapper .vf-podcast-live-page #js_live-start {
    width: 100%;
  }
}

/* Podcasts library polish */
html body .main-wrapper .vf-podcasts-page {
  width: min(calc(100% - 48px), 1320px) !important;
  max-width: calc(100% - 48px) !important;
  margin-top: 18px !important;
  padding-right: 0 !important;
  padding-left: 0 !important;
}

html body .main-wrapper .vf-podcasts-page > .row {
  margin-right: 0 !important;
  margin-left: 0 !important;
}

html body .main-wrapper .vf-podcasts-page .sg-offcanvas-mainbar {
  padding-right: 0 !important;
  padding-left: 0 !important;
}

html body .main-wrapper .vf-podcasts-page .vf-podcast-hero {
  width: 100% !important;
  max-width: none !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
  margin-bottom: 18px !important;
}

html body .main-wrapper .vf-podcasts-page .vf-podcast-hero.page-header .inner {
  grid-template-areas:
    "copy actions";
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 34px;
}

html body .main-wrapper .vf-podcasts-page .vf-podcast-hero-copy {
  grid-area: copy;
  max-width: 720px;
}

html body .main-wrapper .vf-podcasts-page .vf-podcast-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 10px;
  color: rgba(255, 255, 255, 0.78);
  font-size: 0.76rem;
  font-weight: 850;
  letter-spacing: 0.14em;
  line-height: 1.2;
  text-transform: uppercase;
}

html body .main-wrapper .vf-podcasts-page .vf-podcast-eyebrow::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #7ce8d2;
  box-shadow: 0 0 0 6px rgba(124, 232, 210, 0.14);
}

html body .main-wrapper .vf-podcasts-page .vf-podcast-hero h4 {
  margin: 0 !important;
  color: #ffffff !important;
  font-size: clamp(2.05rem, 3.65vw, 3.2rem) !important;
  font-weight: 900 !important;
  line-height: 1.02 !important;
  letter-spacing: 0 !important;
}

html body .main-wrapper .vf-podcasts-page .vf-podcast-hero .text-muted {
  max-width: 680px;
  margin-top: 12px;
  color: rgba(255, 255, 255, 0.88) !important;
  font-size: 1rem !important;
  font-weight: 650;
  line-height: 1.5;
}

html body .main-wrapper .vf-podcasts-page .vf-podcast-hero-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
}

html body .main-wrapper .vf-podcasts-page .vf-podcast-hero-stats span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding: 8px 13px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.78);
  font-size: 0.68rem;
  font-weight: 850;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  backdrop-filter: blur(10px);
}

html body .main-wrapper .vf-podcasts-page .vf-podcast-hero-stats strong {
  color: #ffffff;
  font-size: 0.98rem;
  font-weight: 900;
  letter-spacing: 0;
}

html body .main-wrapper .vf-podcasts-page .vf-podcast-hero-actions {
  grid-area: actions;
  justify-content: flex-end;
  min-width: min(100%, 280px);
}

html body .main-wrapper .vf-podcasts-page .vf-podcast-hero .btn {
  min-height: 44px;
  border-radius: 14px !important;
  font-weight: 850 !important;
}

html body .main-wrapper .vf-podcasts-page .vf-podcast-hero .btn-primary {
  border: 0 !important;
  background: linear-gradient(135deg, #4c6fff, #20c997) !important;
  color: #ffffff !important;
  box-shadow: 0 14px 28px rgba(18, 38, 63, 0.22) !important;
}

html body .main-wrapper .vf-podcasts-page .vf-podcast-hero .btn-outline-secondary {
  border-color: rgba(255, 255, 255, 0.26) !important;
  background: rgba(255, 255, 255, 0.1) !important;
  color: rgba(255, 255, 255, 0.86) !important;
}

html body .main-wrapper .vf-podcasts-page .vf-podcast-home-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  align-items: stretch;
}

html body .main-wrapper .vf-podcasts-page .vf-podcast-home-grid .vf-podcast-section-card {
  height: 100%;
  margin-bottom: 0 !important;
}

html body .main-wrapper .vf-podcasts-page .vf-podcast-section-card,
html body .main-wrapper .vf-podcasts-page .vf-podcast-detail-card {
  border: 1px solid rgba(219, 227, 240, 0.78) !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, 0.96) !important;
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.07) !important;
}

html body .main-wrapper .vf-podcasts-page .vf-podcast-section-card .card-body,
html body .main-wrapper .vf-podcasts-page .vf-podcast-detail-card .card-body {
  padding: 22px !important;
}

html body .main-wrapper .vf-podcasts-page .vf-podcast-section-card h5 {
  margin-bottom: 16px !important;
  color: #172033 !important;
  font-size: 1rem !important;
  font-weight: 900 !important;
  letter-spacing: 0;
}

html body .main-wrapper .vf-podcasts-page .vf-podcast-empty-state {
  min-height: 188px !important;
  padding: 24px !important;
  border: 1px dashed rgba(47, 125, 255, 0.26) !important;
  border-radius: 16px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(47, 125, 255, 0.1), transparent 42%),
    linear-gradient(180deg, #f8fbff, #f1f6fd) !important;
}

html body .main-wrapper .vf-podcasts-page .vf-podcast-show-card,
html body .main-wrapper .vf-podcasts-page .vf-podcast-list-card,
html body .main-wrapper .vf-podcasts-page .vf-podcast-episode-row {
  border-color: rgba(219, 227, 240, 0.86) !important;
  border-radius: 15px !important;
  background: #ffffff !important;
}

@media (max-width: 1199.98px) {
  html body .main-wrapper .vf-podcasts-page .vf-podcast-home-grid {
    grid-template-columns: 1fr;
  }

  html body .main-wrapper .vf-podcasts-page .vf-podcast-hero.page-header .inner {
    grid-template-areas:
      "copy"
      "actions";
    grid-template-columns: 1fr;
  }

  html body .main-wrapper .vf-podcasts-page .vf-podcast-hero-actions {
    justify-content: flex-start;
  }
}

@media (max-width: 767.98px) {
  html body .main-wrapper .vf-podcasts-page {
    width: min(calc(100% - 24px), 1320px) !important;
    max-width: calc(100% - 24px) !important;
  }

  html body .main-wrapper .vf-podcasts-page .vf-podcast-hero .card-body {
    min-height: 0;
    padding: 24px !important;
  }

  html body .main-wrapper .vf-podcasts-page .vf-podcast-hero h4 {
    font-size: 2.1rem !important;
  }

  html body .main-wrapper .vf-podcasts-page .vf-podcast-hero-actions,
  html body .main-wrapper .vf-podcasts-page .vf-podcast-hero-actions .btn {
    width: 100%;
  }
}

@media (max-width: 767.98px) {
  html body .main-wrapper .vf-sidebar-hero.page-header {
    width: min(calc(100% - 24px), 1320px) !important;
    max-width: calc(100% - 24px) !important;
  }

  html body .main-wrapper .vf-sidebar-hero .inner,
  html body .main-wrapper .vf-sidebar-hero .container,
  html body .main-wrapper .vf-sidebar-hero .container-fluid {
    display: block !important;
    min-height: 0 !important;
    padding: 24px !important;
  }

  html body .main-wrapper .vf-sidebar-hero h2 {
    font-size: 2.1rem !important;
  }

  html body .main-wrapper .vf-sidebar-hero .vf-events-hero-stats {
    margin-top: 18px !important;
  }

  html body .main-wrapper .vf-market-hero .input-group {
    display: flex !important;
    flex-direction: column;
  }

  html body .main-wrapper .vf-market-hero .input-group .form-control,
  html body .main-wrapper .vf-market-hero .input-group .btn {
    width: 100% !important;
  }
}

/* Contextual community badges and Friendiversary */
html body .vf-community-badges {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px;
  margin-left: 6px;
  vertical-align: middle;
}

html body .vf-community-badge {
  display: inline-flex;
  align-items: center;
  max-width: 170px;
  min-height: 19px;
  padding: 2px 7px;
  border: 1px solid rgba(84, 118, 170, 0.16);
  border-radius: 999px;
  background: rgba(245, 248, 255, 0.94);
  color: #315079;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: 0;
  white-space: nowrap;
}

html body .vf-community-badge-admin,
html body .vf-community-badge-moderator {
  border-color: rgba(35, 107, 210, 0.24);
  background: rgba(232, 241, 255, 0.98);
  color: #235ba8;
}

html body .vf-community-badge-top {
  border-color: rgba(20, 184, 166, 0.26);
  background: rgba(226, 252, 247, 0.98);
  color: #0d7369;
}

html body .vf-community-badge-rising,
html body .vf-community-badge-starter {
  border-color: rgba(123, 92, 255, 0.22);
  background: rgba(243, 240, 255, 0.98);
  color: #5141b7;
}

html body .vf-community-badge-manual {
  border-color: rgba(16, 185, 129, 0.28);
  background: rgba(230, 252, 244, 0.98);
  color: #087555;
}

html body .comment-author .vf-community-badges {
  margin-left: 4px;
}

html body .comment-author .vf-community-badge {
  max-width: 120px;
  min-height: 17px;
  padding: 2px 6px;
  font-size: 9px;
}

html body .vf-community-badges-user-card,
html body .vf-community-badges-user-list {
  width: 100%;
  justify-content: center;
  margin: 6px 0 0;
}

html body .vf-community-badges-user-list {
  width: auto;
  justify-content: flex-start;
  margin: 0 0 0 6px;
}

html body .vf-community-award-btn {
  border-color: rgba(214, 226, 244, 0.98) !important;
  color: #315079 !important;
  font-weight: 800 !important;
}

html body .vf-badge-award-member {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px;
  border: 1px solid rgba(214, 226, 244, 0.9);
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(249, 252, 255, 0.98), rgba(243, 248, 255, 0.94));
}

html body .vf-badge-award-avatar {
  flex: 0 0 48px;
  width: 48px;
  height: 48px;
  border: 2px solid #ffffff;
  border-radius: 50%;
  background-position: center;
  background-size: cover;
  box-shadow: 0 8px 18px rgba(20, 37, 68, 0.14);
}

html body .vf-badge-award-member strong,
html body .vf-badge-award-member small {
  display: block;
}

html body .vf-badge-award-member strong {
  color: #162238;
  font-size: 15px;
  font-weight: 900;
}

html body .vf-badge-award-member small {
  color: #60718e;
  font-size: 12px;
  font-weight: 700;
}

html body .vf-badge-award-form {
  margin-top: 16px;
  padding: 16px;
  border: 1px solid rgba(218, 228, 243, 0.9);
  border-radius: 16px;
  background: #ffffff;
}

html body .vf-badge-award-current {
  margin-top: 18px;
}

html body .vf-badge-award-section-title {
  margin-bottom: 9px;
  color: #53657f;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

html body .vf-badge-award-list {
  display: grid;
  gap: 8px;
}

html body .vf-badge-award-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border: 1px solid rgba(218, 228, 243, 0.9);
  border-radius: 14px;
  background: rgba(248, 251, 255, 0.9);
}

html body .vf-badge-award-empty {
  padding: 14px;
  border: 1px dashed rgba(177, 196, 224, 0.95);
  border-radius: 14px;
  color: #60718e;
  font-weight: 700;
  text-align: center;
}

html body .main-wrapper .vf-newsfeed-shell .vf-friendiversary-strip {
  margin: 0 0 14px;
  padding: 18px;
  border: 1px solid rgba(214, 226, 244, 0.86);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 16px 42px rgba(32, 66, 116, 0.09);
}

html body .main-wrapper .vf-newsfeed-shell .vf-friendiversary-strip-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 12px;
}

html body .main-wrapper .vf-newsfeed-shell .vf-friendiversary-eyebrow {
  display: block;
  margin-bottom: 3px;
  color: #517096;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

html body .main-wrapper .vf-newsfeed-shell .vf-friendiversary-strip h3 {
  margin: 0;
  color: #162238;
  font-size: 18px;
  font-weight: 900;
  letter-spacing: 0;
}

html body .main-wrapper .vf-newsfeed-shell .vf-friendiversary-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 10px;
}

html body .main-wrapper .vf-newsfeed-shell .vf-friendiversary-card {
  display: flex;
  align-items: center;
  gap: 11px;
  min-width: 0;
  padding: 12px;
  border: 1px solid rgba(218, 228, 243, 0.9);
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(249, 252, 255, 0.98), rgba(243, 248, 255, 0.94));
  color: #24324a;
  text-decoration: none;
}

html body .main-wrapper .vf-newsfeed-shell .vf-friendiversary-avatar {
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  border: 2px solid #ffffff;
  border-radius: 50%;
  background-position: center;
  background-size: cover;
  box-shadow: 0 6px 16px rgba(20, 37, 68, 0.16);
}

html body .main-wrapper .vf-newsfeed-shell .vf-friendiversary-copy {
  display: grid;
  min-width: 0;
  gap: 2px;
}

html body .main-wrapper .vf-newsfeed-shell .vf-friendiversary-copy strong {
  overflow: hidden;
  color: #162238;
  font-size: 14px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html body .main-wrapper .vf-newsfeed-shell .vf-friendiversary-copy span {
  color: #60718e;
  font-size: 12px;
  font-weight: 700;
}

/* Packages has a simple title/subtitle hero, not the multi-zone directory hero. */
html body.vf-page-packages .main-wrapper .vf-packages-hero.page-header .inner {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: center !important;
  gap: 14px !important;
  min-height: 238px !important;
  padding: 34px !important;
  text-align: left !important;
}

html body.vf-page-packages .main-wrapper .vf-packages-hero.page-header h2 {
  margin: 0 !important;
  max-width: 720px !important;
  text-align: left !important;
}

html body.vf-page-packages .main-wrapper .vf-packages-hero.page-header .text-xlg,
html body.vf-page-packages .main-wrapper .vf-packages-hero.page-header p.text-xlg {
  margin: 0 !important;
  max-width: 620px !important;
  text-align: left !important;
}

html body .vf-stories-actions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

html body .vf-stories-actions .btn {
  border: 1px solid rgba(83, 110, 157, 0.16);
  box-shadow: 0 6px 16px rgba(25, 45, 79, 0.08);
}

html body .vf-stories-actions .js_story-stealth-toggle.active {
  border-color: rgba(68, 93, 255, 0.35);
}

html body .vf-story-analytics-modal {
  padding: 18px;
}

html body .vf-story-analytics-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 14px;
}

html body .vf-story-stealth-note {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(68, 93, 255, 0.08);
  color: #42526d;
  font-size: 12px;
  font-weight: 700;
}

html body .vf-story-analytics-search {
  margin-bottom: 14px;
  border-radius: 14px;
}

html body .vf-story-analytics-list {
  display: grid;
  gap: 14px;
}

html body .vf-story-analytics-item {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  gap: 14px;
  padding: 14px;
  border: 1px solid rgba(83, 110, 157, 0.14);
  border-radius: 18px;
  background: #ffffff;
  box-shadow: 0 12px 28px rgba(28, 48, 84, 0.08);
}

html body .vf-story-analytics-media img,
html body .vf-story-video-thumb {
  width: 72px;
  height: 96px;
  border-radius: 14px;
  object-fit: cover;
  background: linear-gradient(145deg, #eaf3ff, #f8fbff);
}

html body .vf-story-video-thumb {
  display: grid;
  place-items: center;
  color: #315dff;
}

html body .vf-story-analytics-content {
  min-width: 0;
}

html body .vf-story-analytics-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 12px;
}

html body .vf-story-analytics-metrics div {
  padding: 10px;
  border-radius: 14px;
  background: #f5f8fd;
}

html body .vf-story-analytics-metrics strong {
  display: block;
  color: #142033;
  font-size: 18px;
  line-height: 1;
}

html body .vf-story-analytics-metrics span {
  color: #63738d;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

html body .vf-story-viewers {
  display: grid;
  gap: 8px;
}

html body .vf-story-viewer-row {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

html body .vf-story-viewer-row img {
  flex: 0 0 34px;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  object-fit: cover;
}

html body .vf-story-viewer-row div {
  display: grid;
  min-width: 0;
}

html body .vf-story-viewer-row strong {
  overflow: hidden;
  color: #24324a;
  font-size: 13px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html body .vf-story-viewer-row span {
  color: #657590;
  font-size: 12px;
  font-weight: 700;
}

html body #zuck-modal .vf-super-reaction {
  position: relative;
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 50%;
  background: linear-gradient(135deg, #ff477e, #ff2d55);
  box-shadow: 0 8px 18px rgba(255, 45, 85, 0.32);
  cursor: pointer;
}

html body #zuck-modal .vf-super-reaction span::before {
  content: "\2665";
  color: #ffffff;
  font-size: 18px;
  line-height: 1;
}

html body #zuck-modal .vf-super-reaction.is-sent {
  animation: vf-super-reaction-pop 0.42s ease both;
}

html body #zuck-modal .vf-super-reaction.is-sent::after {
  content: "\2665";
  position: absolute;
  bottom: 20px;
  color: #ff477e;
  font-size: 26px;
  text-shadow: 0 8px 16px rgba(255, 45, 85, 0.28);
  animation: vf-super-heart-float 1.1s ease-out forwards;
}

html body .vf-ai-content-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  width: fit-content;
  min-height: 24px;
  margin: 0;
  padding: 3px 9px;
  border: 1px solid rgba(72, 102, 164, 0.16);
  border-radius: 999px;
  background: rgba(244, 248, 255, 0.92);
  color: #52627b;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: 0;
  vertical-align: middle;
}

html body .vf-ai-content-badge i {
  color: #315dff;
  font-size: 11px;
}

html body .vf-ai-content-badge-detected {
  background: rgba(49, 93, 255, 0.08);
  color: #30405f;
}

html body .vf-ai-content-badge-declared {
  background: rgba(34, 197, 149, 0.10);
  color: #245a52;
}

html body .vf-post-title-actions {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  margin-left: 6px;
  vertical-align: middle;
}

html body .post-collaboration-actions {
  gap: 6px;
  vertical-align: middle;
}

html body .post-collaboration-actions .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0;
  text-transform: none;
}

html body .post-collaboration-actions .ml5 {
  margin-left: 0 !important;
}

@keyframes vf-super-reaction-pop {
  0% { transform: scale(1); }
  45% { transform: scale(1.16); }
  100% { transform: scale(1); }
}

@keyframes vf-super-heart-float {
  0% {
    opacity: 0;
    transform: translateY(0) scale(0.76);
  }
  20% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: translateY(-62px) scale(1.18);
  }
}

@media (max-width: 575.98px) {
  html body #modal .modal-dialog,
  html body #modal .modal-dialog.modal-sm,
  html body #modal .modal-dialog.modal-lg,
  html body #modal .modal-dialog.modal-xl {
    max-width: calc(100vw - 24px) !important;
    margin: 12px auto !important;
  }

  html body #modal .modal-content {
    border-radius: 16px;
  }

  html body #modal .modal-header {
    padding: 16px 18px;
  }

  html body #modal .modal-header .modal-title {
    font-size: 16px;
  }

  html body #modal .modal-body {
    padding: 18px;
  }

  html body #modal .modal-footer {
    padding: 12px 14px 16px;
  }

  html body #modal .modal-footer .btn {
    flex: 1 1 auto;
    min-width: 0;
    padding: 0 14px;
  }

  html body #modal .vf-modal-confirm-body {
    padding: 0 18px;
  }

  html body .vf-story-analytics-summary {
    align-items: flex-start;
    flex-direction: column;
  }

  html body .vf-story-analytics-item {
    grid-template-columns: 58px minmax(0, 1fr);
    gap: 12px;
    padding: 12px;
  }

  html body .vf-story-analytics-media img,
  html body .vf-story-video-thumb {
    width: 58px;
    height: 78px;
  }

  html body .vf-story-analytics-metrics {
    grid-template-columns: 1fr;
  }

  html body .vf-community-badges {
    width: 100%;
    margin: 5px 0 0;
  }

  html body .comment-author .vf-community-badges {
    width: auto;
    margin-top: 2px;
  }

  html body .main-wrapper .vf-newsfeed-shell .vf-friendiversary-strip {
    padding: 14px;
  }

  html body .main-wrapper .vf-newsfeed-shell .vf-friendiversary-list {
    grid-template-columns: 1fr;
  }
}

/* r25 mobile/responsive launch polish */
@media (max-width: 767.98px) {
  body.vf-page-index .main-wrapper .vf-newsfeed-shell {
    width: min(calc(100% - 20px), 640px) !important;
    max-width: calc(100% - 20px) !important;
    margin-top: 12px !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell > .row,
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .sg-offcanvas-mainbar > .row {
    margin-right: 0 !important;
    margin-left: 0 !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell > .row > [class*="col-"],
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .sg-offcanvas-mainbar > .row > [class*="col-"] {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .card:not(.vf-promo-card),
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .post {
    border-radius: 16px !important;
    box-shadow: 0 10px 24px rgba(30, 51, 86, 0.07) !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .card:not(.vf-promo-card)::before,
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .post::before {
    height: 2px !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .composer-launcher .d-flex {
    align-items: flex-start !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .composer-launcher-input {
    display: block !important;
    min-height: 42px !important;
    height: 42px !important;
    min-width: 0;
    padding: 10px 13px !important;
    overflow: hidden;
    line-height: 20px !important;
    white-space: nowrap !important;
    text-overflow: ellipsis;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 5px;
    width: 100%;
    margin-top: 10px;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions button {
    justify-content: center;
    gap: 4px;
    min-width: 0;
    min-height: 32px;
    padding: 0 4px;
    font-size: 0.64rem;
    white-space: nowrap;
    overflow: hidden;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions button i {
    flex: 0 0 auto;
    margin-right: 0 !important;
    font-size: 0.72rem;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_recommendation-strip .card-header {
    min-height: 0;
    padding: 12px 14px !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_recommendation-strip .card-header .small {
    font-size: 0.72rem;
    line-height: 1.25;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_recommendation-strip .card-body {
    padding: 10px 12px 12px !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_recommendation-strip .feeds-item,
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_recommendation-strip .data-container {
    min-height: 62px;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter-mobile-trigger {
    min-height: 44px !important;
    padding: 0 14px !important;
    border-radius: 999px !important;
    font-size: 0.82rem !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-header,
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-meta {
    padding-right: 12px !important;
    padding-left: 12px !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-body {
    padding-bottom: 0 !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-text {
    font-size: 0.92rem !important;
    line-height: 1.45 !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-media,
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-media-image,
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-media-image .source {
    border-radius: 14px !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-stats {
    display: grid;
    grid-template-columns: 1fr;
    gap: 6px;
    padding: 9px 12px !important;
    font-size: 0.78rem !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-stats .float-start,
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-stats .float-end {
    float: none !important;
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
    justify-content: flex-start;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-actions {
    gap: 6px !important;
    padding: 0 8px 10px !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-actions .action-btn {
    min-height: 40px !important;
    font-size: 0.78rem !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .comment-form textarea,
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-comment-publisher textarea.js_post-comment {
    font-size: 16px !important;
  }
}

@media (min-width: 768px) and (max-width: 1199.98px) {
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions {
    padding-left: 48px;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter {
    flex-wrap: wrap;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-actions .action-btn {
    min-height: 40px !important;
  }
}

/* r26 empty/loading-state launch polish */
body.vf-page-index .main-wrapper .vf-newsfeed-shell .text-center.text-muted.mb20:has(.no-data) {
  margin: 0 0 18px !important;
  padding: 28px 22px !important;
  border: 1px solid rgba(211, 223, 239, 0.88);
  border-radius: 18px;
  background:
    radial-gradient(circle at 50% 0%, rgba(84, 214, 255, 0.12), transparent 34%),
    linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
  box-shadow: 0 10px 28px rgba(30, 51, 86, 0.08);
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .text-center.text-muted.mb20:has(.no-data) svg {
  width: 58px !important;
  height: 58px !important;
  margin-bottom: 12px !important;
  padding: 12px;
  border-radius: 18px;
  background: rgba(47, 109, 255, 0.08);
  color: #2f6dff;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .no-data {
  display: block;
  max-width: 280px;
  margin: 0 auto;
  color: #4f6178 !important;
  font-size: 0.92rem;
  font-weight: 800;
  line-height: 1.35;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .alert-post.see-more,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_see-more {
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  margin: 14px 0 18px !important;
  padding: 0 18px !important;
  border: 1px solid rgba(211, 223, 239, 0.92) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.94) !important;
  color: #2a3b53 !important;
  font-size: 0.84rem;
  font-weight: 800;
  box-shadow: 0 10px 24px rgba(30, 51, 86, 0.08) !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .alert-post.see-more:hover,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_see-more:hover {
  border-color: rgba(47, 109, 255, 0.28) !important;
  color: #1f55db !important;
  transform: translateY(-1px);
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .loader,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .loader_small,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .loader_large {
  border-color: rgba(47, 109, 255, 0.14) !important;
  border-top-color: #2f6dff !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_comments-filter-loader {
  padding: 14px 0 !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .comment-form .loader_small,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .js_comment-form .loader_small,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .alert-post.see-more .loader_small {
  flex: 0 0 auto;
  width: 18px !important;
  height: 18px !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-stories-card.vf-stories-card-empty {
  overflow: hidden;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-stories-card.vf-stories-card-empty .stories-wrapper {
  background:
    radial-gradient(circle at 14% 12%, rgba(47, 109, 255, 0.1), transparent 28%),
    linear-gradient(180deg, rgba(248, 251, 255, 0.98), rgba(255, 255, 255, 0.98));
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-stories-card.vf-stories-card-empty .add-story {
  border-color: rgba(211, 223, 239, 0.9) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.86);
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-stories-card.vf-stories-card-empty .add-story::after {
  color: #253247 !important;
  letter-spacing: 0;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-suggested-events-card .vf-events-calendar-empty {
  display: grid;
  place-items: center;
  min-height: 116px;
  text-align: center;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-suggested-events-card .vf-events-calendar-empty::before {
  width: 34px;
  height: 34px;
  margin-bottom: 9px;
  border-radius: 12px;
  background: rgba(47, 109, 255, 0.08);
  color: #2f6dff;
  line-height: 34px;
}

@media (max-width: 767.98px) {
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .text-center.text-muted.mb20:has(.no-data) {
    padding: 22px 16px !important;
    border-radius: 16px;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .text-center.text-muted.mb20:has(.no-data) svg {
    width: 50px !important;
    height: 50px !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .alert-post.see-more,
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_see-more {
    min-height: 42px;
    margin-bottom: 14px !important;
    font-size: 0.8rem;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-suggested-events-card .vf-events-calendar-empty {
    min-height: 96px;
    padding: 16px 12px !important;
  }
}

/* r27 modal/sheet launch polish */
html body.modal-open #modal {
  background: rgba(12, 24, 42, 0.48);
  backdrop-filter: blur(2px);
}

html body #modal .modal-dialog {
  margin-top: clamp(18px, 5vh, 56px) !important;
  margin-bottom: clamp(18px, 5vh, 56px) !important;
}

html body #modal .modal-dialog.modal-dialog-centered {
  min-height: calc(100dvh - 36px) !important;
  margin-top: 18px !important;
  margin-bottom: 18px !important;
}

html body #modal .modal-content {
  border-color: rgba(204, 217, 235, 0.92) !important;
  border-radius: 20px !important;
  box-shadow: 0 26px 76px rgba(15, 34, 65, 0.26) !important;
}

html body #modal .modal-header {
  min-height: 58px;
  padding: 16px 20px !important;
  border-bottom: 1px solid rgba(217, 226, 239, 0.42) !important;
}

html body #modal .modal-header .modal-title {
  flex: 1 1 auto;
  min-width: 0;
  max-width: calc(100% - 44px);
  overflow: hidden;
  font-size: 1rem !important;
  line-height: 1.3 !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html body #modal .modal-header .btn-close,
html body #modal .modal-header .close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 34px;
  height: 34px;
  padding: 0 !important;
  margin: 0 0 0 auto !important;
  border-radius: 50%;
  background-position: center !important;
  background-size: 14px 14px !important;
  background-color: rgba(255, 255, 255, 0.14);
  opacity: 0.9;
}

html body #modal .modal-header .btn-close:hover,
html body #modal .modal-header .close:hover {
  background-color: rgba(255, 255, 255, 0.22);
  opacity: 1;
}

html body #modal .modal-body {
  padding: 20px !important;
}

html body #modal .modal-body > :last-child {
  margin-bottom: 0;
}

html body #modal .modal-footer {
  gap: 8px;
  padding: 14px 20px 18px !important;
  border-top: 1px solid rgba(217, 226, 239, 0.74) !important;
}

html body #modal .modal-footer .btn,
html body #modal .vf-share-modal-footer .btn {
  min-width: 104px;
  min-height: 42px;
  padding: 0 18px;
  border-radius: 999px !important;
  font-size: 0.86rem;
  text-transform: none !important;
}

html body #modal .modal-footer .btn-light,
html body #modal .modal-footer .btn-secondary,
html body #modal .vf-share-modal-footer .btn-light,
html body #modal .vf-share-modal-footer .btn-secondary {
  border-color: rgba(203, 216, 233, 0.96) !important;
  background: #f6f9fd !important;
  color: #26364d !important;
}

html body #modal .form-control,
html body #modal .form-select,
html body #modal textarea.form-control {
  min-height: 42px;
  border-radius: 12px;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, background-color 0.16s ease;
}

html body #modal textarea.form-control {
  min-height: 96px;
}

html body #modal .form-control:focus,
html body #modal .form-select:focus,
html body #modal textarea.form-control:focus {
  border-color: rgba(47, 109, 255, 0.42) !important;
  background-color: #ffffff;
  box-shadow: 0 0 0 3px rgba(47, 109, 255, 0.14) !important;
}

html body #modal .btn:focus-visible,
html body #modal .btn-close:focus-visible,
html body #modal .close:focus-visible {
  outline: 0 !important;
  box-shadow: 0 0 0 3px rgba(47, 109, 255, 0.22) !important;
}

html body #modal .vf-modal-confirm-header {
  border-radius: 20px 20px 0 0 !important;
  background:
    radial-gradient(circle at 8% 0%, rgba(84, 214, 255, 0.12), transparent 32%),
    #ffffff !important;
}

html body #modal .vf-modal-confirm-message {
  color: #4f6178 !important;
  font-size: 0.92rem !important;
}

html body #modal.js_modal-comment-publisher .modal-dialog {
  max-width: min(760px, calc(100vw - 32px)) !important;
}

html body #modal.js_modal-comment-publisher .modal-content,
html body #modal.js_modal-publisher .modal-content {
  border-radius: 22px !important;
}

html body #modal.js_modal-comment-publisher .vf-comment-publisher textarea.js_post-comment,
html body #modal.js_modal-comment-publisher .vf-comment-publisher .js_post-editor-quill-wrap .ql-editor {
  font-size: 1rem !important;
  line-height: 1.48 !important;
}

html body #modal.js_modal-comment-publisher .vf-comment-publisher .publisher-tools-quick {
  justify-content: space-between !important;
  border-top-color: rgba(217, 226, 239, 0.78) !important;
}

html body #modal.js_modal-comment-publisher .vf-comment-publisher .publisher-tools-quick .publisher-quick-action {
  border: 1px solid rgba(47, 109, 255, 0.12) !important;
}

html body #external-link-modal .modal-content {
  border: 1px solid rgba(204, 217, 235, 0.92) !important;
  box-shadow: 0 26px 76px rgba(15, 34, 65, 0.26) !important;
}

@media (max-width: 575.98px) {
  html body #modal .modal-dialog,
  html body #modal .modal-dialog.modal-sm,
  html body #modal .modal-dialog.modal-lg,
  html body #modal .modal-dialog.modal-xl {
    max-width: calc(100vw - 20px) !important;
    margin-top: 10px !important;
    margin-bottom: max(10px, env(safe-area-inset-bottom, 0px)) !important;
  }

  html body #modal .modal-content {
    max-height: calc(100dvh - 20px) !important;
    border-radius: 18px !important;
  }

  html body #modal .modal-header {
    min-height: 54px;
    padding: 14px 16px !important;
  }

  html body #modal .modal-body {
    padding: 16px !important;
    overflow-y: auto;
  }

  html body #modal .modal-footer {
    flex-wrap: nowrap;
    padding: 12px 14px max(14px, env(safe-area-inset-bottom, 0px)) !important;
  }

  html body #modal .modal-footer .btn,
  html body #modal .vf-share-modal-footer .btn {
    flex: 1 1 0;
    min-width: 0;
    padding: 0 12px;
    white-space: nowrap;
  }

  html body #modal.js_modal-comment-publisher .modal-dialog {
    max-width: calc(100vw - 16px) !important;
    margin-top: 8px !important;
  }

  html body #modal.js_modal-comment-publisher .vf-comment-publisher .publisher-message.no-avatar {
    padding-top: 30px !important;
  }

  html body #modal.js_modal-comment-publisher .vf-comment-publisher textarea.js_post-comment {
    min-height: 78px !important;
    font-size: 16px !important;
  }

  html body #modal.js_modal-comment-publisher .vf-comment-publisher .publisher-tools-quick {
    gap: 7px !important;
    padding-bottom: max(12px, env(safe-area-inset-bottom, 0px)) !important;
  }
}

body.night-mode #modal .modal-content,
body.night-mode #external-link-modal .modal-content {
  border-color: rgba(148, 163, 184, 0.18) !important;
  box-shadow: 0 26px 76px rgba(0, 0, 0, 0.44) !important;
}

body.night-mode #modal .modal-footer {
  border-top-color: rgba(148, 163, 184, 0.16) !important;
}

body.night-mode #modal .form-control:focus,
body.night-mode #modal .form-select:focus,
body.night-mode #modal textarea.form-control:focus {
  background-color: #172033;
}

/* r28 header icon centering fix */
@media (min-width: 1200px) {
  body.vf-page-index .main-wrapper .main-header .header-search-cluster .home-icon,
  body.vf-page-index .main-wrapper .main-header .navbar-wrapper > ul > li > a,
  body.vf-page-index .main-wrapper .main-header .navbar-wrapper > ul > li > .dropdown-toggle {
    position: relative;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    line-height: 1 !important;
    text-align: center;
  }

  body.vf-page-index .main-wrapper .main-header .header-search-cluster .home-icon .main-icon,
  body.vf-page-index .main-wrapper .main-header .header-search-cluster .home-icon .header-icon,
  body.vf-page-index .main-wrapper .main-header .navbar-wrapper > ul > li > a .main-icon,
  body.vf-page-index .main-wrapper .main-header .navbar-wrapper > ul > li > a .header-icon,
  body.vf-page-index .main-wrapper .main-header .navbar-wrapper > ul > li > .dropdown-toggle .main-icon,
  body.vf-page-index .main-wrapper .main-header .navbar-wrapper > ul > li > .dropdown-toggle .header-icon {
    position: static !important;
    display: block !important;
    flex: 0 0 24px !important;
    width: 24px !important;
    height: 24px !important;
    margin: 0 !important;
    transform: none !important;
  }

  body.vf-page-index .main-wrapper .main-header .navbar-wrapper > ul > li > .user-menu img {
    display: block !important;
    flex: 0 0 28px !important;
    width: 28px !important;
    height: 28px !important;
    margin: 0 !important;
    border-radius: 50%;
    object-fit: cover;
  }

  body.vf-page-index .main-wrapper .main-header .navbar-wrapper > ul > li > .user-menu .title {
    display: none !important;
  }

  body.vf-page-index .main-wrapper .main-header .navbar-wrapper > ul > li > .user-menu.dropdown-toggle::after {
    position: absolute;
    top: 50%;
    right: -12px;
    margin: 0 !important;
    transform: translateY(-50%);
  }

  body.vf-page-index .main-wrapper .main-header .navbar-wrapper .counter {
    position: absolute !important;
    top: -4px !important;
    right: -3px !important;
    margin: 0 !important;
  }
}

/* r29 header dropdown launch polish */
body.vf-page-index .main-wrapper .main-header .navbar-wrapper > ul > li.dropdown > .dropdown-menu,
body.vf-page-index .main-wrapper .main-header .navbar-wrapper > ul > li.dropdown > .dropdown-widget,
body.vf-page-index .main-wrapper .main-header .navbar-wrapper > ul > li.dropdown > .dropdown-menu.dropdown-widget {
  min-width: 292px;
  max-width: min(360px, calc(100vw - 24px));
  margin-top: 12px !important;
  padding: 8px !important;
  border: 1px solid rgba(203, 216, 233, 0.92) !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, 0.98) !important;
  box-shadow: 0 20px 54px rgba(15, 34, 65, 0.24) !important;
  overflow: hidden;
}

body.vf-page-index .main-wrapper .main-header .dropdown-widget {
  width: min(360px, calc(100vw - 24px)) !important;
}

body.vf-page-index .main-wrapper .main-header .dropdown-widget-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 44px;
  margin: -8px -8px 6px;
  padding: 12px 14px !important;
  border-bottom: 1px solid rgba(220, 229, 241, 0.88) !important;
  border-radius: 18px 18px 0 0 !important;
  background: linear-gradient(180deg, #f8fbff 0%, #f2f7fd 100%) !important;
}

body.vf-page-index .main-wrapper .main-header .dropdown-widget-header .title {
  color: #172033 !important;
  font-size: 0.86rem;
  font-weight: 900;
  letter-spacing: 0;
}

body.vf-page-index .main-wrapper .main-header .dropdown-widget-header .text-link,
body.vf-page-index .main-wrapper .main-header .dropdown-widget-header a {
  color: #2f6dff !important;
  font-size: 0.74rem;
  font-weight: 850;
  text-transform: none;
}

body.vf-page-index .main-wrapper .main-header .dropdown-widget-body {
  max-height: min(420px, calc(100dvh - 190px));
  margin: 0 -8px;
  padding: 0 8px;
  overflow: hidden;
}

body.vf-page-index .main-wrapper .main-header .dropdown-widget-body .js_scroller {
  max-height: min(420px, calc(100dvh - 190px)) !important;
  padding-right: 2px;
  overflow-y: auto !important;
}

body.vf-page-index .main-wrapper .main-header .dropdown-widget-body ul {
  margin: 0 !important;
  padding: 0 !important;
}

body.vf-page-index .main-wrapper .main-header .dropdown-widget-body li,
body.vf-page-index .main-wrapper .main-header .dropdown-widget-body .feeds-item,
body.vf-page-index .main-wrapper .main-header .dropdown-widget-body .data-container {
  border-radius: 12px;
}

body.vf-page-index .main-wrapper .main-header .dropdown-widget-body li:hover,
body.vf-page-index .main-wrapper .main-header .dropdown-widget-body .feeds-item:hover,
body.vf-page-index .main-wrapper .main-header .dropdown-widget-body .data-container:hover {
  background: rgba(47, 109, 255, 0.06);
}

body.vf-page-index .main-wrapper .main-header .dropdown-widget-footer {
  display: flex !important;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  margin: 8px -8px -8px !important;
  padding: 0 14px !important;
  border-top: 1px solid rgba(220, 229, 241, 0.88) !important;
  border-radius: 0 0 18px 18px !important;
  background: #f7faff !important;
  color: #2f6dff !important;
  font-size: 0.8rem;
  font-weight: 900;
  text-align: center;
}

body.vf-page-index .main-wrapper .main-header .dropdown-widget-footer:hover {
  background: rgba(47, 109, 255, 0.08) !important;
  color: #1f55db !important;
}

body.vf-page-index .main-wrapper .main-header .user-menu + .dropdown-menu {
  min-width: 256px;
}

body.vf-page-index .main-wrapper .main-header .user-menu + .dropdown-menu .dropdown-item {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 38px;
  padding: 8px 10px !important;
  border-radius: 12px;
  color: #26364d !important;
  font-size: 0.86rem;
  font-weight: 750;
}

body.vf-page-index .main-wrapper .main-header .user-menu + .dropdown-menu .dropdown-item:hover,
body.vf-page-index .main-wrapper .main-header .user-menu + .dropdown-menu .dropdown-item:focus {
  background: rgba(47, 109, 255, 0.08) !important;
  color: #1f55db !important;
}

body.vf-page-index .main-wrapper .main-header .user-menu + .dropdown-menu .dropdown-item .main-icon,
body.vf-page-index .main-wrapper .main-header .user-menu + .dropdown-menu .dropdown-item img {
  flex: 0 0 20px;
  width: 20px !important;
  height: 20px !important;
  margin: 0 !important;
}

body.vf-page-index .main-wrapper .main-header .user-menu + .dropdown-menu .dropdown-divider {
  margin: 6px 4px;
  border-color: rgba(220, 229, 241, 0.9);
}

@media (max-width: 767.98px) {
  body.vf-page-index .main-wrapper .main-header .navbar-wrapper > ul > li.dropdown > .dropdown-menu,
  body.vf-page-index .main-wrapper .main-header .navbar-wrapper > ul > li.dropdown > .dropdown-widget,
  body.vf-page-index .main-wrapper .main-header .navbar-wrapper > ul > li.dropdown > .dropdown-menu.dropdown-widget {
    width: calc(100vw - 20px) !important;
    max-width: calc(100vw - 20px) !important;
    margin-top: 10px !important;
    border-radius: 16px !important;
  }

  body.vf-page-index .main-wrapper .main-header .dropdown-widget-body,
  body.vf-page-index .main-wrapper .main-header .dropdown-widget-body .js_scroller {
    max-height: min(420px, calc(100dvh - 160px)) !important;
  }
}

body.night-mode.vf-page-index .main-wrapper .main-header .navbar-wrapper > ul > li.dropdown > .dropdown-menu,
body.night-mode.vf-page-index .main-wrapper .main-header .navbar-wrapper > ul > li.dropdown > .dropdown-widget,
body.night-mode.vf-page-index .main-wrapper .main-header .navbar-wrapper > ul > li.dropdown > .dropdown-menu.dropdown-widget {
  border-color: rgba(148, 163, 184, 0.2) !important;
  background: rgba(22, 31, 45, 0.98) !important;
  box-shadow: 0 20px 54px rgba(0, 0, 0, 0.42) !important;
}

body.night-mode.vf-page-index .main-wrapper .main-header .dropdown-widget-header,
body.night-mode.vf-page-index .main-wrapper .main-header .dropdown-widget-footer {
  border-color: rgba(148, 163, 184, 0.16) !important;
  background: rgba(18, 27, 40, 0.94) !important;
}

body.night-mode.vf-page-index .main-wrapper .main-header .dropdown-widget-header .title,
body.night-mode.vf-page-index .main-wrapper .main-header .user-menu + .dropdown-menu .dropdown-item {
  color: #edf4ff !important;
}

/* r30 small-control and metadata consistency polish */
body.vf-page-index .main-wrapper .vf-newsfeed-shell .badge,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .rounded-pill.badge,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .badge.bg-light,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .badge.text-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 22px;
  padding: 3px 8px;
  border-radius: 999px !important;
  font-size: 0.68rem;
  font-weight: 900;
  line-height: 1;
  letter-spacing: 0;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .badge.bg-light,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .badge.text-primary {
  border: 1px solid rgba(211, 223, 239, 0.92);
  background: rgba(247, 250, 255, 0.96) !important;
  color: #2f6dff !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .btn-sm,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .btn.btn-sm {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  gap: 6px;
  padding: 0 12px;
  border-radius: 999px;
  font-size: 0.76rem;
  font-weight: 850;
  line-height: 1;
  text-transform: none;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .btn-sm i,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .btn-sm .main-icon,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .btn-sm svg {
  flex: 0 0 auto;
  margin: 0 !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .text-muted,
body.vf-page-index .main-wrapper .vf-newsfeed-shell small,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .small {
  letter-spacing: 0;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .card-header small,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .card-header .small,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .card-header .float-end,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .card-header a.float-end {
  color: #60758e !important;
  font-size: 0.72rem;
  font-weight: 850;
  line-height: 1.2;
  text-transform: none;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .card-header small a,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .card-header a.float-end,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .card-header .float-end a {
  color: #2f6dff !important;
  text-decoration: none !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .card-header small a:hover,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .card-header a.float-end:hover,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .card-header .float-end a:hover {
  color: #1f55db !important;
  text-decoration: none !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-meta,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_posts_stream .post .post-meta {
  color: #61738b !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-time,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_posts_stream .post .post-time {
  color: #6d7f96 !important;
  font-size: 0.78rem !important;
  font-weight: 750 !important;
  line-height: 1.3 !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-title,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_posts_stream .post .post-title {
  color: #1f2f46 !important;
  font-weight: 900 !important;
  letter-spacing: 0;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-stats .pointer,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-stats .text-link,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_posts_stream .post .post-stats .pointer,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_posts_stream .post .post-stats .text-link {
  color: #52667f !important;
  font-size: 0.8rem !important;
  font-weight: 800 !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-stats i,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_posts_stream .post .post-stats i {
  color: #2f6dff !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_recommendation-strip .data-content,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_recommendation-strip .text-muted,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_recommendation-strip small {
  color: #687a91 !important;
  font-size: 0.76rem;
  font-weight: 750;
  line-height: 1.32;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-side-rail .post-media-meta .text,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-side-rail .post-media-meta .info,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-side-rail .suggested-event-meta {
  color: #6d7f96 !important;
  font-size: 0.76rem;
  font-weight: 750;
  line-height: 1.32;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-side-rail .card-header a,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-side-rail .card-header small a {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
}

@media (max-width: 767.98px) {
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .btn-sm,
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .btn.btn-sm {
    min-height: 34px;
    padding: 0 10px;
    font-size: 0.74rem;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .card-header small,
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .card-header .small,
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .card-header .float-end,
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .card-header a.float-end {
    font-size: 0.7rem;
  }
}

body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .badge.bg-light,
body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .badge.text-primary {
  border-color: rgba(148, 163, 184, 0.22);
  background: rgba(31, 45, 64, 0.92) !important;
  color: #9fb8ff !important;
}

body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-title,
body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .js_posts_stream .post .post-title {
  color: #edf4ff !important;
}

/* r31 search and filter-control polish */
body.vf-page-index .main-wrapper .main-header .search-wrapper {
  position: relative;
}

body.vf-page-index .main-wrapper .main-header .search-wrapper form {
  position: relative;
  margin: 0;
}

body.vf-page-index .main-wrapper .main-header .search-wrapper .form-control {
  min-width: 260px;
  padding-right: 18px !important;
  padding-left: 48px !important;
  color: #f8fbff !important;
  font-size: 0.9rem;
  font-weight: 750;
  letter-spacing: 0;
}

body.vf-page-index .main-wrapper .main-header .search-wrapper .form-control::placeholder {
  color: rgba(248, 251, 255, 0.72) !important;
  font-weight: 700;
}

body.vf-page-index .main-wrapper .main-header .search-wrapper .form-control:focus {
  border-color: rgba(255, 255, 255, 0.32) !important;
  background: rgba(255, 255, 255, 0.22) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14), 0 0 0 3px rgba(84, 214, 255, 0.16) !important;
}

body.vf-page-index .main-wrapper .main-header .search-wrapper .search-input-icon {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 12px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 42px;
  color: rgba(248, 251, 255, 0.82);
  line-height: 1;
  transform: none;
  pointer-events: none;
}

body.vf-page-index .main-wrapper .main-header .search-wrapper .search-input-icon .header-icon,
body.vf-page-index .main-wrapper .main-header .search-wrapper .search-input-icon svg {
  display: block;
  width: 20px !important;
  height: 20px !important;
  margin: 0 !important;
  vertical-align: middle !important;
}

body.vf-page-index .main-wrapper .main-header .dropdown-search {
  width: min(360px, calc(100vw - 24px)) !important;
  margin-top: 10px !important;
}

body.vf-page-index .main-wrapper .main-header .dropdown-search .dropdown-widget-body {
  min-height: 72px;
}

body.vf-page-index .main-wrapper .main-header .dropdown-search .loader {
  margin: 18px auto !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter {
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter > span,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter > .dropdown-toggle {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  color: #5b6f88 !important;
  font-size: 0.78rem;
  font-weight: 850;
  letter-spacing: 0;
  line-height: 1;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter .btn,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter .countries-filter,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter .btn-group .btn {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 38px !important;
  line-height: 1 !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter .btn i,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter .btn .main-icon,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter .countries-filter i,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter .countries-filter .main-icon {
  margin: 0 !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter .dropdown-menu,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter .action-dropdown-menu {
  min-width: 220px;
  padding: 8px !important;
  border: 1px solid rgba(203, 216, 233, 0.92) !important;
  border-radius: 16px !important;
  background: rgba(255, 255, 255, 0.98) !important;
  box-shadow: 0 16px 44px rgba(15, 34, 65, 0.18) !important;
}

.posts-filter.posts-filter-menu-open,
.vf-posts-filter.posts-filter-menu-open,
.vf-posts-filter-mobile-sheet.posts-filter-menu-open {
  position: relative;
  z-index: 2140 !important;
  overflow: visible !important;
}

.posts-filter.posts-filter-menu-open .dropdown.show,
.posts-filter.posts-filter-menu-open .btn-group.show,
.posts-filter.posts-filter-menu-open .countries-filter.show,
.vf-posts-filter-mobile-sheet.posts-filter-menu-open .dropdown.show,
.vf-posts-filter-mobile-sheet.posts-filter-menu-open .btn-group.show,
.vf-posts-filter-mobile-sheet.posts-filter-menu-open .countries-filter.show {
  z-index: 2141 !important;
}

.posts-filter.posts-filter-menu-open .dropdown-menu.show,
.posts-filter.posts-filter-menu-open .dropdown-menu[data-bs-popper],
.vf-posts-filter-mobile-sheet.posts-filter-menu-open .dropdown-menu.show,
.vf-posts-filter-mobile-sheet.posts-filter-menu-open .dropdown-menu[data-bs-popper] {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 2142 !important;
  max-height: min(420px, calc(100vh - 96px)) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  pointer-events: auto !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter .dropdown-menu .dropdown-item,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter .action-dropdown-menu .dropdown-item {
  min-height: 36px;
  padding: 8px 10px !important;
  border-radius: 11px;
  font-size: 0.82rem;
  font-weight: 800;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter .dropdown-menu .dropdown-item:hover,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter .dropdown-menu .dropdown-item:focus,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter .action-dropdown-menu .dropdown-item:hover,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter .action-dropdown-menu .dropdown-item:focus {
  background: rgba(47, 109, 255, 0.08) !important;
  color: #1f55db !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter-mobile-trigger {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-weight: 900 !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter-mobile-sheet {
  box-shadow: 0 22px 58px rgba(15, 34, 65, 0.22);
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter-mobile-stack .btn,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter-mobile-stack .countries-filter,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter-mobile-stack .btn-group .btn {
  justify-content: center !important;
  font-weight: 850 !important;
}

@media (min-width: 1200px) {
  body.vf-page-index .main-wrapper .main-header .search-wrapper .form-control {
    min-width: 300px;
  }
}

@media (max-width: 767.98px) {
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter {
    gap: 7px;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter .btn,
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter .countries-filter,
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter .btn-group .btn {
    min-height: 40px !important;
    padding: 0 12px !important;
    font-size: 0.78rem !important;
  }
}

body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter .dropdown-menu,
body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter .action-dropdown-menu {
  border-color: rgba(148, 163, 184, 0.2) !important;
  background: rgba(22, 31, 45, 0.98) !important;
  box-shadow: 0 16px 44px rgba(0, 0, 0, 0.38) !important;
}

/* r34 search icon position correction */
.search-wrapper form .search-input-icon {
  top: -12px !important;
}

/* r35 media and link-preview consistency polish */
body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-media,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_posts_stream .post .post-media {
  overflow: hidden;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-media-image,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_posts_stream .post .post-media-image,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .photos,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_posts_stream .post .photos {
  border-radius: 16px !important;
  background: #eef5ff;
  overflow: hidden;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-media-image img,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-media-image > img,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .photos img,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_posts_stream .post .post-media-image img,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_posts_stream .photos img {
  display: block;
  max-width: 100%;
  object-fit: cover;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-media-meta,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_posts_stream .post .post-media-meta {
  border: 1px solid rgba(211, 223, 239, 0.88);
  border-top: 0;
  border-radius: 0 0 16px 16px;
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-media-image + .post-media-meta,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_posts_stream .post .post-media-image + .post-media-meta {
  margin-top: -1px;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-media-meta .title,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_posts_stream .post .post-media-meta .title {
  color: #1d3c55 !important;
  font-weight: 900 !important;
  letter-spacing: 0;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-media-meta .text,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_posts_stream .post .post-media-meta .text {
  color: #53667f !important;
  font-weight: 650;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-media-image .source,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_posts_stream .post .post-media-image .source {
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: rgba(15, 34, 65, 0.7) !important;
  color: #ffffff !important;
  box-shadow: 0 8px 18px rgba(15, 34, 65, 0.2);
  backdrop-filter: blur(8px);
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-blog-carousel-card .post-media-image,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-blog-carousel-card .post-media-image > div,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-blog-carousel-card .vf-blog-carousel-placeholder {
  border-radius: 14px !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-blog-carousel-card .post-media-meta .title {
  color: #1d3c55 !important;
  letter-spacing: 0;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-blog-carousel-card .post-media-meta .info {
  color: #718199 !important;
  font-weight: 750;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-side-rail .vf-blog-carousel-card .post-media.list {
  align-items: center;
  min-height: 100px;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-side-rail .vf-blog-carousel-card .post-media-image-wrapper,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-side-rail .vf-blog-carousel-card .post-media-image {
  flex: 0 0 92px;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-side-rail .vf-blog-carousel-card .post-media-image > div {
  background-position: center !important;
  background-size: cover !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-blog-carousel-card .vf-carousel-control {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(211, 223, 239, 0.9);
  color: #2f6dff;
  box-shadow: 0 8px 18px rgba(30, 51, 86, 0.12);
}

@media (max-width: 767.98px) {
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-media-image,
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_posts_stream .post .post-media-image,
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .photos,
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_posts_stream .post .photos {
    border-radius: 14px !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-media-meta,
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_posts_stream .post .post-media-meta {
    padding: 10px 12px 12px !important;
    border-radius: 0 0 14px 14px;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-media-meta .title,
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_posts_stream .post .post-media-meta .title {
    font-size: 0.92rem !important;
  }
}

body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-media-meta,
body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .js_posts_stream .post .post-media-meta {
  border-color: rgba(148, 163, 184, 0.18);
  background: linear-gradient(180deg, #172033 0%, #141d2b 100%);
}

body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-media-meta .title,
body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .js_posts_stream .post .post-media-meta .title,
body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-blog-carousel-card .post-media-meta .title {
  color: #edf4ff !important;
}

/* r36 list-row consistency polish */
body.vf-page-index .main-wrapper .vf-newsfeed-shell .feeds-item {
  list-style: none;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .feeds-item .data-container {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 64px;
  padding: 10px 12px !important;
  border-radius: 14px;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .feeds-item .data-container.small {
  min-height: 58px;
  padding: 8px 10px !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .feeds-item .data-avatar {
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  margin: 0 !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .feeds-item .data-container.small .data-avatar {
  flex-basis: 38px;
  width: 38px;
  height: 38px;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .feeds-item .data-avatar img {
  display: block;
  width: 100% !important;
  height: 100% !important;
  border-radius: 50%;
  object-fit: cover;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .feeds-item .data-content {
  flex: 1 1 auto;
  min-width: 0;
  padding-left: 0 !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .feeds-item .data-content .name,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .feeds-item .data-content .name a,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .feeds-item .data-content > a {
  overflow: hidden;
  color: #1f2f46 !important;
  font-size: 0.88rem;
  font-weight: 900;
  line-height: 1.22;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .feeds-item .data-content .text-muted,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .feeds-item .data-content small,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .feeds-item .data-content .sub-text {
  display: block;
  overflow: hidden;
  color: #687a91 !important;
  font-size: 0.76rem;
  font-weight: 750;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .feeds-item .data-content .float-end {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  margin-left: 10px;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .feeds-item .data-content .float-end .btn {
  min-height: 30px;
  padding: 0 10px;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_recommendation-strip .feeds-item .data-container {
  gap: 10px;
  border-radius: 12px;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_recommendation-strip .feeds-item .data-avatar {
  flex-basis: 40px;
  width: 40px;
  height: 40px;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_recommendation-strip .feeds-item:hover .data-container {
  background: rgba(47, 109, 255, 0.05);
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_recommendation-strip .vf-recommendation-reason {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 6px;
  margin-top: 2px;
  color: #6b7d94 !important;
  font-size: 0.74rem;
  font-weight: 750;
  line-height: 1.25;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_recommendation-strip .vf-recommendation-reason .btn-link {
  min-height: 0;
  color: #2f6dff !important;
  font-size: inherit;
  font-weight: 850;
  line-height: inherit;
  text-decoration: none;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_recommendation-strip .vf-recommendation-reason .btn-link:hover,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .js_recommendation-strip .vf-recommendation-reason .btn-link:focus {
  text-decoration: underline;
}

body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .js_recommendation-strip .vf-recommendation-reason {
  color: #9fb0c6 !important;
}

body.vf-page-index .main-wrapper .main-header .dropdown-widget-body .feeds-item .data-container {
  min-height: 58px;
  padding: 8px 10px !important;
}

body.vf-page-index .main-wrapper .main-header .dropdown-widget-body .feeds-item .data-avatar {
  flex-basis: 38px;
  width: 38px;
  height: 38px;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-suggested-events-card .suggested-event-item .data-container {
  display: block;
  min-height: 0;
  border-radius: 0;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-suggested-events-card .suggested-event-title a {
  letter-spacing: 0;
  text-transform: none;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-suggested-events-card .suggested-event-actions .btn {
  min-height: 26px;
  font-size: 0.7rem;
}

@media (max-width: 767.98px) {
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .feeds-item .data-container {
    gap: 10px;
    min-height: 58px;
    padding: 8px 10px !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .feeds-item .data-avatar {
    flex-basis: 38px;
    width: 38px;
    height: 38px;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .feeds-item .data-content .float-end {
    gap: 5px;
  }
}

body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .feeds-item .data-content .name,
body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .feeds-item .data-content .name a,
body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .feeds-item .data-content > a {
  color: #edf4ff !important;
}

/* r37 alert and notice consistency polish */
body.vf-page-index .main-wrapper .vf-newsfeed-shell .alert {
  position: relative;
  overflow: hidden;
  border-radius: 16px;
  border-width: 1px;
  box-shadow: 0 10px 26px rgba(30, 51, 86, 0.08);
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .alert .icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  min-width: 42px;
  margin-right: 12px;
  border-radius: 14px;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .alert .text {
  min-width: 0;
  color: #435670;
  font-size: 0.92rem;
  font-weight: 700;
  line-height: 1.45;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .alert .text strong {
  display: inline-block;
  margin-bottom: 2px;
  color: #20324a;
  font-weight: 900;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .alert a:not(.btn) {
  color: #1f55db !important;
  font-weight: 850;
  text-decoration: none !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .alert-warning {
  border-color: rgba(245, 158, 11, 0.22) !important;
  background:
    radial-gradient(circle at top left, rgba(245, 158, 11, 0.12), transparent 34%),
    linear-gradient(180deg, #fffaf0 0%, #fff7e6 100%) !important;
  color: #744b13 !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .alert-warning .icon {
  background: rgba(245, 158, 11, 0.13);
  color: #b45309;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .alert-info,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .alert-post.see-more {
  border-color: rgba(47, 109, 255, 0.16) !important;
  background:
    radial-gradient(circle at top left, rgba(84, 214, 255, 0.12), transparent 32%),
    linear-gradient(180deg, #ffffff 0%, #f5f9ff 100%) !important;
  color: #31536b !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .alert-success {
  border-color: rgba(34, 197, 149, 0.18) !important;
  background: linear-gradient(180deg, #f3fff9 0%, #ecfbf5 100%) !important;
  color: #246251 !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .alert-danger {
  border-color: rgba(225, 29, 72, 0.18) !important;
  background: linear-gradient(180deg, #fff5f7 0%, #fff0f3 100%) !important;
  color: #9f1239 !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .alert + .text-center .btn,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .alert + .text-center .btn-primary {
  min-height: 40px;
  padding: 0 18px;
  border-radius: 999px;
  font-weight: 900;
  text-transform: none;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .see-more.js_see-more {
  cursor: pointer;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .see-more.js_see-more span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .see-more.js_see-more span::after {
  content: "\f107";
  color: #2f6dff;
  font-family: "Font Awesome 6 Free", "Font Awesome 5 Free";
  font-size: 0.78rem;
  font-weight: 900;
}

@media (max-width: 767.98px) {
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .alert {
    border-radius: 14px;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .alert .icon {
    width: 36px;
    height: 36px;
    min-width: 36px;
    margin-right: 10px;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .alert .text {
    font-size: 0.86rem;
  }
}

body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .alert {
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.26);
}

body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .alert .text,
body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .alert .text strong {
  color: #edf4ff !important;
}

/* r64 world-style exploration heroes */
html body .main-wrapper .vf-world-hero.page-header {
  position: relative !important;
  isolation: isolate;
  display: block !important;
  width: min(1320px, calc(100% - 48px)) !important;
  min-height: 258px;
  margin: 18px auto 28px !important;
  padding: 44px 34px 38px !important;
  overflow: hidden !important;
  border: 1px solid rgba(255, 255, 255, 0.22) !important;
  border-radius: 24px !important;
  background-color: #102238 !important;
  background-position: center !important;
  background-size: cover !important;
  box-shadow: 0 28px 70px rgba(10, 24, 42, 0.22) !important;
  color: #ffffff !important;
}

html body .main-wrapper .vf-world-hero-directory {
  background-image:
    linear-gradient(90deg, rgba(4, 12, 24, 0.82), rgba(15, 50, 82, 0.62) 52%, rgba(13, 42, 69, 0.42)),
    url("/content/themes/modern/images/landing/vf-global-seoul.webp") !important;
}

html body .main-wrapper .vf-world-hero-pages {
  background-image:
    linear-gradient(90deg, rgba(4, 12, 24, 0.82), rgba(22, 64, 91, 0.58) 54%, rgba(11, 34, 54, 0.4)),
    url("/content/themes/modern/images/landing/vf-global-lisbon.webp") !important;
}

html body .main-wrapper .vf-world-hero-groups {
  background-image:
    linear-gradient(90deg, rgba(4, 12, 24, 0.84), rgba(20, 68, 76, 0.6) 54%, rgba(13, 42, 69, 0.42)),
    url("/content/themes/modern/images/landing/vf-global-nairobi.webp") !important;
}

html body .main-wrapper .vf-world-hero-events {
  background-image:
    linear-gradient(90deg, rgba(4, 12, 24, 0.82), rgba(31, 58, 100, 0.58) 54%, rgba(13, 42, 69, 0.38)),
    url("/content/themes/modern/images/landing/vf-global-seoul.webp") !important;
}

html body .main-wrapper .vf-world-hero-blogs {
  background-image:
    linear-gradient(90deg, rgba(4, 12, 24, 0.84), rgba(14, 51, 83, 0.62) 54%, rgba(13, 42, 69, 0.38)),
    url("/content/themes/modern/images/landing/vf-global-lisbon.webp") !important;
}

html body .main-wrapper .vf-world-hero.page-header::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: -1;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0)),
    radial-gradient(circle at 88% 16%, rgba(255, 255, 255, 0.22), transparent 24%) !important;
}

html body .main-wrapper .vf-world-hero .floating-img,
html body .main-wrapper .vf-world-hero .circle-2,
html body .main-wrapper .vf-world-hero .circle-3 {
  display: none !important;
}

html body .main-wrapper .vf-world-hero .container,
html body .main-wrapper .vf-world-hero .container-fluid {
  position: relative !important;
  z-index: 1 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 420px) !important;
  align-items: center !important;
  gap: 28px !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 172px;
  padding: 0 !important;
  text-align: left !important;
}

html body .main-wrapper .vf-world-hero .vf-events-hero-kicker,
html body .main-wrapper .vf-world-hero .vf-events-hero-kicker:first-child {
  justify-self: start !important;
  grid-column: 1 !important;
  margin: 0 0 14px !important;
  padding: 8px 12px !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  background: rgba(255, 255, 255, 0.14) !important;
  color: rgba(255, 255, 255, 0.92) !important;
  letter-spacing: 0.12em !important;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

html body .main-wrapper .vf-world-hero h2 {
  grid-column: 1 !important;
  margin: 0 !important;
  width: auto !important;
  color: #ffffff !important;
  font-size: 3.65rem !important;
  line-height: 0.96 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  text-shadow: 0 12px 34px rgba(0, 0, 0, 0.28);
}

html body .main-wrapper .vf-world-hero .vf-events-hero-subtitle,
html body .main-wrapper .vf-world-hero p.text-xlg.vf-events-hero-subtitle,
html body .main-wrapper .vf-world-hero .container p {
  grid-column: 1 !important;
  max-width: 680px !important;
  margin: 16px 0 0 !important;
  color: rgba(255, 255, 255, 0.86) !important;
  font-size: 1.04rem !important;
  line-height: 1.68 !important;
  text-align: left !important;
  letter-spacing: 0 !important;
  left: auto !important;
}

html body .main-wrapper .vf-world-hero .vf-events-hero-stats {
  grid-column: 2 !important;
  grid-row: 1 / span 4 !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  align-self: center !important;
  justify-self: stretch !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

html body .main-wrapper .vf-world-hero .vf-events-hero-stat {
  display: grid !important;
  grid-template-columns: auto 1fr !important;
  align-items: center !important;
  column-gap: 14px !important;
  min-height: 58px;
  padding: 12px 16px !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, 0.14) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

html body .main-wrapper .vf-world-hero .vf-events-hero-stat strong {
  grid-row: 1 / span 2;
  min-width: 46px;
  color: #ffffff !important;
  font-size: 1.25rem !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
}

html body .main-wrapper .vf-world-hero .vf-events-hero-stat span {
  margin: 0 !important;
  color: rgba(255, 255, 255, 0.9) !important;
  font-size: 0.78rem !important;
  line-height: 1.2 !important;
  letter-spacing: 0.08em !important;
}

html body .main-wrapper .vf-world-hero .vf-events-hero-stat em {
  margin-top: 3px !important;
  color: rgba(255, 255, 255, 0.7) !important;
}

html body .main-wrapper .vf-world-hero .vf-events-hero-search {
  grid-column: 2 !important;
  width: 100% !important;
  max-width: none !important;
  margin: 8px 0 0 !important;
}

html body .main-wrapper .vf-world-hero .vf-events-hero-search .row,
html body .main-wrapper .vf-world-hero .vf-events-hero-search [class*="col-"] {
  width: 100% !important;
}

html body .main-wrapper .vf-world-hero .vf-events-hero-search .mx-sm-auto {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

html body .main-wrapper .vf-world-hero .vf-events-hero-search .input-group {
  overflow: hidden !important;
  border: 1px solid rgba(255, 255, 255, 0.22) !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, 0.14) !important;
  box-shadow: none !important;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

html body .main-wrapper .vf-world-hero .vf-events-hero-search .form-control {
  min-height: 50px !important;
  border: 0 !important;
  background: transparent !important;
  color: #ffffff !important;
}

html body .main-wrapper .vf-world-hero .vf-events-hero-search .form-control::placeholder {
  color: rgba(255, 255, 255, 0.76) !important;
}

html body .main-wrapper .vf-world-hero .vf-events-hero-search .btn {
  min-height: 50px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: rgba(255, 255, 255, 0.18) !important;
  color: #ffffff !important;
  box-shadow: none !important;
}

html body .main-wrapper .vf-directory-shell,
html body .main-wrapper .vf-blogs-shell {
  margin-top: 0 !important;
}

@media (max-width: 991.98px) {
  html body .main-wrapper .vf-world-hero.page-header {
    width: min(100% - 28px, 720px) !important;
    min-height: 0;
    padding: 30px 22px 26px !important;
    border-radius: 22px !important;
  }

  html body .main-wrapper .vf-world-hero .container,
  html body .main-wrapper .vf-world-hero .container-fluid {
    display: block !important;
    min-height: 0;
  }

  html body .main-wrapper .vf-world-hero h2 {
    font-size: 2.55rem !important;
  }

  html body .main-wrapper .vf-world-hero .vf-events-hero-stats {
    display: flex !important;
    grid-column: auto !important;
    grid-row: auto !important;
    gap: 8px !important;
    margin-top: 20px !important;
    overflow-x: auto;
    padding-bottom: 2px;
  }

  html body .main-wrapper .vf-world-hero .vf-events-hero-stat {
    flex: 1 0 168px;
  }

  html body .main-wrapper .vf-world-hero .vf-events-hero-search {
    margin-top: 16px !important;
  }
}

@media (max-width: 575.98px) {
  html body .main-wrapper .vf-world-hero.page-header {
    width: calc(100% - 20px) !important;
    margin-top: 12px !important;
    padding: 26px 18px 22px !important;
  }

  html body .main-wrapper .vf-world-hero h2 {
    font-size: 2.25rem !important;
  }

  html body .main-wrapper .vf-world-hero .vf-events-hero-subtitle,
  html body .main-wrapper .vf-world-hero p.text-xlg.vf-events-hero-subtitle {
    font-size: 0.96rem !important;
    line-height: 1.55 !important;
  }
}

/* r65 final world hero cascade: photo-led, search no longer overlaps stats */
html body .main-wrapper .vf-world-hero.vf-world-hero-directory.page-header {
  background:
    linear-gradient(90deg, rgba(4, 12, 24, 0.74) 0%, rgba(10, 31, 52, 0.62) 48%, rgba(12, 43, 70, 0.42) 100%),
    url("/content/themes/modern/images/landing/vf-global-seoul.webp") center / cover no-repeat !important;
}

html body .main-wrapper .vf-world-hero.vf-world-hero-pages.page-header {
  background:
    linear-gradient(90deg, rgba(4, 12, 24, 0.74) 0%, rgba(14, 41, 61, 0.58) 48%, rgba(15, 61, 83, 0.38) 100%),
    url("/content/themes/modern/images/landing/vf-global-lisbon.webp") center / cover no-repeat !important;
}

html body .main-wrapper .vf-world-hero.vf-world-hero-groups.page-header {
  background:
    linear-gradient(90deg, rgba(4, 12, 24, 0.76) 0%, rgba(12, 48, 54, 0.58) 50%, rgba(11, 66, 74, 0.36) 100%),
    url("/content/themes/modern/images/landing/vf-global-nairobi.webp") center / cover no-repeat !important;
}

html body .main-wrapper .vf-world-hero.vf-world-hero-events.page-header {
  background:
    linear-gradient(90deg, rgba(4, 12, 24, 0.74) 0%, rgba(19, 40, 70, 0.58) 48%, rgba(14, 52, 82, 0.36) 100%),
    url("/content/themes/modern/images/landing/vf-global-seoul.webp") center / cover no-repeat !important;
}

html body .main-wrapper .vf-world-hero.vf-world-hero-blogs.page-header {
  background:
    linear-gradient(90deg, rgba(4, 12, 24, 0.76) 0%, rgba(12, 40, 62, 0.58) 48%, rgba(16, 62, 84, 0.36) 100%),
    url("/content/themes/modern/images/landing/vf-global-lisbon.webp") center / cover no-repeat !important;
}

html body .main-wrapper .vf-world-hero.page-header::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(circle at 82% 18%, rgba(255, 255, 255, 0.18), transparent 25%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0)) !important;
}

html body .main-wrapper .vf-world-hero .vf-events-hero-stats {
  grid-column: 2 !important;
  grid-row: 1 / span 5 !important;
  align-self: center !important;
}

html body .main-wrapper .vf-world-hero .vf-events-hero-search {
  grid-column: 1 !important;
  grid-row: auto !important;
  display: block !important;
  width: min(100%, 540px) !important;
  max-width: 540px !important;
  margin: 22px 0 0 !important;
  z-index: 2;
}

html body .main-wrapper .vf-world-hero .vf-events-hero-search [class*="col-"],
html body .main-wrapper .vf-world-hero .vf-events-hero-search .mx-sm-auto {
  width: 100% !important;
  max-width: 100% !important;
  padding-right: 0 !important;
  padding-left: 0 !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
}

@media (max-width: 991.98px) {
  html body .main-wrapper .vf-world-hero .vf-events-hero-search {
    width: 100% !important;
    max-width: none !important;
  }
}

/* r66 top navigation aesthetic polish */
html body:not(.night-mode) .main-wrapper .main-header {
  background:
    linear-gradient(90deg, rgba(9, 27, 48, 0.94) 0%, rgba(22, 70, 111, 0.9) 52%, rgba(21, 90, 133, 0.88) 100%) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
  box-shadow: 0 12px 34px rgba(6, 18, 34, 0.22) !important;
  backdrop-filter: blur(22px) saturate(125%) !important;
  -webkit-backdrop-filter: blur(22px) saturate(125%) !important;
}

html body:not(.night-mode) .main-wrapper .main-header::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 20% 0%, rgba(255, 255, 255, 0.08), transparent 30%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0));
}

html body .main-wrapper .main-header > .container,
html body .main-wrapper .main-header > .container-fluid {
  position: relative;
  z-index: 1;
}

html body:not(.night-mode) .main-wrapper .main-header .search-wrapper .form-control {
  border: 1px solid rgba(255, 255, 255, 0.24) !important;
  background: rgba(255, 255, 255, 0.16) !important;
  color: #f8fbff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

html body:not(.night-mode) .main-wrapper .main-header .search-wrapper .form-control::placeholder {
  color: rgba(255, 255, 255, 0.78) !important;
}

html body:not(.night-mode) .main-wrapper .main-header .search-wrapper .form-control:focus {
  border-color: rgba(255, 255, 255, 0.42) !important;
  background: rgba(255, 255, 255, 0.22) !important;
  box-shadow: 0 0 0 3px rgba(84, 214, 255, 0.18) !important;
}

html body:not(.night-mode) .main-wrapper .main-header .search-wrapper .search-input-icon,
html body:not(.night-mode) .main-wrapper .main-header .search-wrapper .search-input-icon .header-icon,
html body:not(.night-mode) .main-wrapper .main-header .search-wrapper .search-input-icon svg {
  color: rgba(255, 255, 255, 0.84) !important;
  fill: rgba(255, 255, 255, 0.84) !important;
}

html body:not(.night-mode) .main-wrapper .main-header .header-search-cluster .home-icon,
html body:not(.night-mode) .main-wrapper .main-header .navbar-wrapper > ul > li > a,
html body:not(.night-mode) .main-wrapper .main-header .navbar-wrapper > ul > li > .dropdown-toggle {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  min-height: 42px !important;
  padding: 0 !important;
  border: 1px solid rgba(255, 255, 255, 0.14) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.11) !important;
  color: #f8fbff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

html body:not(.night-mode) .main-wrapper .main-header .header-search-cluster .home-icon:hover,
html body:not(.night-mode) .main-wrapper .main-header .navbar-wrapper > ul > li > a:hover,
html body:not(.night-mode) .main-wrapper .main-header .navbar-wrapper > ul > li.dropdown.show > a,
html body:not(.night-mode) .main-wrapper .main-header .navbar-wrapper > ul > li > .dropdown-toggle:hover {
  background: rgba(255, 255, 255, 0.2) !important;
  border-color: rgba(255, 255, 255, 0.24) !important;
  transform: translateY(-1px);
}

html body:not(.night-mode) .main-wrapper .main-header .navbar-wrapper > ul > li > a .main-icon,
html body:not(.night-mode) .main-wrapper .main-header .navbar-wrapper > ul > li > a .header-icon,
html body:not(.night-mode) .main-wrapper .main-header .navbar-wrapper > ul > li > a svg,
html body:not(.night-mode) .main-wrapper .main-header .navbar-wrapper > ul > li > .dropdown-toggle .main-icon,
html body:not(.night-mode) .main-wrapper .main-header .navbar-wrapper > ul > li > .dropdown-toggle .header-icon,
html body:not(.night-mode) .main-wrapper .main-header .navbar-wrapper > ul > li > .dropdown-toggle svg {
  color: #f8fbff !important;
  fill: #f8fbff !important;
}

html body:not(.night-mode) .main-wrapper .main-header .navbar-wrapper .counter {
  top: 5px !important;
  right: 4px !important;
  border: 2px solid rgba(9, 27, 48, 0.92) !important;
  box-shadow: 0 6px 14px rgba(6, 18, 34, 0.22);
}

html body:not(.night-mode) .main-wrapper .main-header .navbar-wrapper > ul > li > .user-menu img {
  display: block;
  width: 34px !important;
  height: 34px !important;
  border: 1px solid rgba(255, 255, 255, 0.28) !important;
  border-radius: 50% !important;
  object-fit: cover;
}

html body:not(.night-mode) .main-wrapper .main-header .navbar-wrapper > ul > li > .user-menu.dropdown-toggle::after {
  color: rgba(255, 255, 255, 0.82) !important;
}

@media (max-width: 767.98px) {
  html body .main-wrapper .main-header .navbar-wrapper > ul > li.js_live-requests > a,
  html body .main-wrapper .main-header .navbar-wrapper > ul > li.js_live-messages > a,
  html body .main-wrapper .main-header .navbar-wrapper > ul > li.js_live-notifications > a,
  html body .main-wrapper .main-header .navbar-wrapper > ul > li.dropdown.js_live-requests > a,
  html body .main-wrapper .main-header .navbar-wrapper > ul > li.dropdown.js_live-messages > a,
  html body .main-wrapper .main-header .navbar-wrapper > ul > li.dropdown.js_live-notifications > a {
    flex: 0 0 42px !important;
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    max-width: 42px !important;
    max-height: 42px !important;
    padding: 0 !important;
    border-radius: 50% !important;
    aspect-ratio: 1 / 1 !important;
    overflow: hidden !important;
  }

  html body .main-wrapper .main-header .navbar-wrapper > ul > li.js_live-requests > a .header-icon,
  html body .main-wrapper .main-header .navbar-wrapper > ul > li.js_live-messages > a .header-icon,
  html body .main-wrapper .main-header .navbar-wrapper > ul > li.js_live-notifications > a .header-icon,
  html body .main-wrapper .main-header .navbar-wrapper > ul > li.js_live-requests > a svg,
  html body .main-wrapper .main-header .navbar-wrapper > ul > li.js_live-messages > a svg,
  html body .main-wrapper .main-header .navbar-wrapper > ul > li.js_live-notifications > a svg {
    flex: 0 0 24px !important;
    width: 24px !important;
    height: 24px !important;
    margin: 0 !important;
  }

  html body .main-wrapper .main-header .navbar-wrapper > ul > li > .user-menu > img,
  html body .main-wrapper .main-header .navbar-wrapper > ul > li > .user-menu img {
    border-radius: 50% !important;
    overflow: hidden !important;
    object-fit: cover !important;
  }
}

@media (max-width: 767.98px) {
  html body:not(.night-mode) .main-wrapper .main-header .header-search-cluster .home-icon,
  html body:not(.night-mode) .main-wrapper .main-header .navbar-wrapper > ul > li > a,
  html body:not(.night-mode) .main-wrapper .main-header .navbar-wrapper > ul > li > .dropdown-toggle {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
  }
}

@media (max-width: 767.98px) {
  html body .main-wrapper .main-header .header-search-cluster .home-icon,
  html body:not(.night-mode) .main-wrapper .main-header .header-search-cluster .home-icon,
  html body.night-mode .main-wrapper .main-header .header-search-cluster .home-icon {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
}

/* Keep the mobile and installed-app header in one 70px row. The desktop search
 * column otherwise becomes a full-width Bootstrap row and vertically centers
 * the logo against 134px of clipped content. */
@media (max-width: 767.98px) {
  html body .main-wrapper .main-header > .container > .row > .col-5,
  html body .main-wrapper .main-header > .container-fluid > .row > .col-5 {
    height: 70px !important;
    min-height: 70px !important;
  }

  html body .main-wrapper .main-header > .container > .row > .col-5 > .row,
  html body .main-wrapper .main-header > .container-fluid > .row > .col-5 > .row {
    display: flex !important;
    width: 100% !important;
    height: 70px !important;
    min-height: 70px !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    margin: 0 !important;
  }

  html body .main-wrapper .main-header > .container > .row > .col-5 > .row > .col-md-7,
  html body .main-wrapper .main-header > .container-fluid > .row > .col-5 > .row > .col-md-7 {
    display: none !important;
  }

  html body .main-wrapper .main-header > .container > .row > .col-5 > .row > .col-md-5,
  html body .main-wrapper .main-header > .container-fluid > .row > .col-5 > .row > .col-md-5 {
    display: flex !important;
    width: 100% !important;
    height: 70px !important;
    min-height: 70px !important;
    flex: 0 0 100% !important;
    align-items: center !important;
    justify-content: flex-end !important;
    padding: 0 !important;
  }
}

/* r69 header search alignment rollback and fix */
html body .main-wrapper .main-header .search-wrapper form {
  position: relative !important;
}

html body .main-wrapper .main-header .search-wrapper .form-control {
  min-height: 42px !important;
  height: 42px !important;
  padding-left: 48px !important;
  line-height: 42px !important;
}

html body .main-wrapper .main-header .search-wrapper form .search-input-icon,
html body:not(.night-mode) .main-wrapper .main-header .search-wrapper form .search-input-icon {
  position: absolute !important;
  top: 0 !important;
  bottom: 0 !important;
  left: 12px !important;
  right: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  height: 42px !important;
  margin: 0 !important;
  transform: none !important;
  line-height: 1 !important;
  pointer-events: none !important;
}

html body .main-wrapper .main-header .search-wrapper form .search-input-icon .header-icon,
html body .main-wrapper .main-header .search-wrapper form .search-input-icon svg,
html body .main-wrapper .main-header .search-wrapper form .search-input-icon i {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  font-size: 18px !important;
  line-height: 18px !important;
}

.birthday-widget .birthday-action,
.birthday-action-inline {
  border: 0;
  background: transparent;
  padding: 0;
  color: var(--bs-primary, #216FDB);
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  text-align: left;
}

.birthday-widget .birthday-action {
  display: inline-block;
  margin-top: 3px;
}

.birthday-action-inline {
  margin-top: 4px;
}

.vf-birthday-date-pill {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(33, 111, 219, 0.1);
  color: var(--bs-primary, #216FDB);
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}

body.night-mode .vf-birthday-date-pill {
  background: rgba(109, 141, 255, 0.16);
  color: #dbe6ff;
}

.birthday-widget .birthday-action:hover,
.birthday-widget .birthday-action:focus,
.birthday-action-inline:hover,
.birthday-action-inline:focus {
  text-decoration: underline;
}

.vf-collections-picker-list {
  display: grid;
  gap: 8px;
  margin-bottom: 16px;
  max-height: 260px;
  overflow-y: auto;
}

.vf-collections-picker-option {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  border: 1px solid #dfe7f1;
  border-radius: 8px;
  background: #fff;
  padding: 10px 12px;
  color: #1f2d3d;
  text-align: left;
}

.vf-collections-picker-option:hover,
.vf-collections-picker-option:focus {
  border-color: var(--bs-primary, #216FDB);
  box-shadow: 0 0 0 3px rgba(33, 111, 219, 0.1);
}

.vf-collections-picker-option-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 34px;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: rgba(33, 111, 219, 0.1);
  color: var(--bs-primary, #216FDB);
}

.vf-collections-picker-option-body {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.vf-collections-picker-option-body strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.vf-collections-picker-option-body small {
  color: #6f7f92;
}

.vf-collections-picker-create {
  padding-top: 14px;
  border-top: 1px solid #edf1f7;
}

body.night-mode .vf-collections-picker-option {
  border-color: #334052;
  background: #202833;
  color: #f4f6f8;
}

body.night-mode .vf-collections-picker-option-body small {
  color: #aeb9c7;
}

body.night-mode .vf-collections-picker-create {
  border-top-color: #334052;
}

.vf-album-cover {
  position: relative;
}

.vf-album-photo-count {
  position: absolute;
  right: 10px;
  bottom: 10px;
  display: inline-flex;
  align-items: center;
  max-width: calc(100% - 20px);
  min-height: 28px;
  padding: 5px 10px;
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.74);
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.22);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.vf-album-photo-count i {
  font-size: 11px;
}

body.night-mode .vf-album-photo-count {
  border-color: rgba(255, 255, 255, 0.2);
  background: rgba(0, 0, 0, 0.64);
}

.vf-album-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin-bottom: 14px;
}

.vf-album-actions .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  margin: 0 !important;
  font-weight: 700;
}

/* Keep album-management actions legible when Bootstrap changes their state. */
.vf-album-actions .btn.btn-outline-secondary {
  border-color: rgba(100, 116, 139, 0.42) !important;
  background: #f8fafc !important;
  color: #475569 !important;
}

.vf-album-actions .btn.btn-outline-secondary:hover,
.vf-album-actions .btn.btn-outline-secondary:focus {
  border-color: #475569 !important;
  background: #475569 !important;
  color: #ffffff !important;
}

.vf-album-actions .btn:disabled,
.vf-album-actions .btn.disabled {
  border-color: #d7dee8 !important;
  background: #f3f6fa !important;
  color: #718096 !important;
  opacity: 1 !important;
}

.vf-album-actions .btn i {
  color: inherit !important;
}

.vf-album-actions .btn:focus-visible {
  outline: 3px solid rgba(37, 99, 235, 0.25);
  outline-offset: 2px;
}

.vf-album-photo-bulk-tools {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin: 4px 0 12px;
}

.vf-album-photo-bulk-tools .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  font-weight: 750;
}

.vf-album-photo-bulk-tools .btn:disabled {
  border-color: #d7dee8 !important;
  background: #f3f6fa !important;
  color: #718096 !important;
  opacity: 1 !important;
}

.vf-album-meta-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.vf-album-meta-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 28px;
  padding: 5px 10px;
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 999px;
  background: #f8fafc;
  color: #52627b;
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
}

.vf-album-meta-pill i {
  color: var(--bs-primary, #216FDB);
}

body.night-mode .vf-album-meta-pill {
  border-color: #334052;
  background: #202833;
  color: #aeb9c7;
}

@media (max-width: 575.98px) {
  .vf-album-actions .btn {
    flex: 1 1 140px;
  }

  .vf-album-photo-bulk-tools .btn {
    flex: 1 1 140px;
  }

  .vf-album-meta-row {
    align-items: stretch;
    flex-direction: column;
  }

  .vf-album-meta-pill {
    justify-content: center;
    width: 100%;
  }
}

.vf-people-suggestion-reason {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  max-width: 100%;
  margin-top: 8px;
  color: #6f7f92;
  font-size: 12px;
  line-height: 1.3;
}

.vf-people-suggestion-reason-list {
  justify-content: flex-start;
  margin-top: 3px;
}

.vf-people-suggestion-reason i {
  color: var(--bs-primary, #216FDB);
  font-size: 11px;
}

body.night-mode .vf-people-suggestion-reason {
  color: #aeb9c7;
}

.vf-memory-share-prompt {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0 16px 12px;
  padding: 12px 14px;
  border: 1px solid rgba(33, 111, 219, 0.16);
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(33, 111, 219, 0.1), rgba(20, 184, 166, 0.1));
}

.vf-memory-share-copy {
  display: flex;
  flex-direction: column;
  min-width: 0;
  color: #24324a;
}

.vf-memory-share-eyebrow {
  color: var(--bs-primary, #216FDB);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.vf-memory-share-copy strong {
  font-size: 14px;
  line-height: 1.25;
}

.vf-memory-share-button {
  flex: 0 0 auto;
  border-radius: 999px;
  font-weight: 700;
  white-space: nowrap;
}

.vf-memory-share-modal-note {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 18px;
  padding: 12px 14px;
  border: 1px solid rgba(33, 111, 219, 0.16);
  border-radius: 12px;
  background: rgba(33, 111, 219, 0.08);
}

.vf-memory-share-modal-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--bs-primary, #216FDB);
  color: #fff;
}

.vf-memory-share-modal-note strong {
  display: block;
  color: #24324a;
  font-size: 14px;
  line-height: 1.25;
}

.vf-memory-share-modal-note p {
  margin: 2px 0 0;
  color: #6f7f92;
  font-size: 12px;
  line-height: 1.35;
}

body.night-mode .vf-memory-share-prompt,
body.night-mode .vf-memory-share-modal-note {
  border-color: rgba(109, 141, 255, 0.24);
  background: rgba(33, 111, 219, 0.14);
}

body.night-mode .vf-memory-share-copy,
body.night-mode .vf-memory-share-modal-note strong {
  color: #f4f6f8;
}

body.night-mode .vf-memory-share-modal-note p {
  color: #aeb9c7;
}

@media (max-width: 575.98px) {
  .vf-memory-share-prompt {
    align-items: stretch;
    flex-direction: column;
    margin-right: 12px;
    margin-left: 12px;
  }

  .vf-memory-share-button {
    width: 100%;
  }
}

.vf-story-archive-card {
  overflow: hidden;
}

.vf-story-archive-grid {
  display: grid;
  gap: 16px;
}

.vf-story-archive-entry {
  border: 1px solid rgba(148, 163, 184, 0.25);
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 250, 255, 0.96));
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
  overflow: hidden;
}

.vf-story-archive-entry-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.18);
}

.vf-story-archive-author {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.vf-story-archive-avatar {
  flex: 0 0 40px;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-position: center;
  background-size: cover;
  box-shadow: 0 6px 14px rgba(15, 23, 42, 0.14);
}

.vf-story-archive-author span:last-child {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.vf-story-archive-author strong {
  color: #24324a;
  font-size: 14px;
  line-height: 1.25;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.vf-story-archive-author small {
  color: #6f7f92;
  font-size: 12px;
}

.vf-story-archive-media-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
  padding: 14px;
}

.vf-story-archive-media {
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 12px;
  background: #fff;
  overflow: hidden;
}

.vf-story-archive-media img,
.vf-story-archive-media video {
  display: block;
  width: 100%;
  aspect-ratio: 9 / 16;
  max-height: 420px;
  object-fit: cover;
  background: #0f172a;
}

.vf-story-archive-caption {
  padding: 9px 10px;
  color: #52627b;
  font-size: 12px;
  line-height: 1.35;
}

.vf-story-archive-entry-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 14px;
  padding: 0 14px 14px;
  color: #6f7f92;
  font-size: 12px;
  font-weight: 700;
}

.vf-story-archive-entry-foot span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.vf-story-archive-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 220px;
  color: #6f7f92;
  text-align: center;
}

.vf-story-archive-empty-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: rgba(33, 111, 219, 0.1);
  color: var(--bs-primary, #216FDB);
  font-size: 22px;
}

.vf-story-archive-empty strong {
  color: #24324a;
  font-size: 18px;
}

body.night-mode .vf-story-archive-entry {
  border-color: #334052;
  background: linear-gradient(180deg, rgba(32, 40, 51, 0.98), rgba(24, 31, 42, 0.96));
}

body.night-mode .vf-story-archive-entry-head,
body.night-mode .vf-story-archive-media {
  border-color: #334052;
}

body.night-mode .vf-story-archive-media {
  background: #202833;
}

body.night-mode .vf-story-archive-author strong,
body.night-mode .vf-story-archive-empty strong {
  color: #f4f6f8;
}

body.night-mode .vf-story-archive-author small,
body.night-mode .vf-story-archive-caption,
body.night-mode .vf-story-archive-entry-foot,
body.night-mode .vf-story-archive-empty {
  color: #aeb9c7;
}

.vf-friend-requests-bulk {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 14px;
  padding: 12px 14px;
  border: 1px solid rgba(33, 111, 219, 0.16);
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(33, 111, 219, 0.09), rgba(20, 184, 166, 0.08));
}

.vf-friend-requests-bulk strong,
.vf-friend-requests-bulk span {
  display: block;
}

.vf-friend-requests-bulk strong {
  color: #24324a;
  font-size: 14px;
  line-height: 1.25;
}

.vf-friend-requests-bulk span {
  margin-top: 2px;
  color: #6f7f92;
  font-size: 12px;
  line-height: 1.35;
}

.vf-friend-requests-bulk-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
}

.vf-friend-requests-bulk-actions .btn {
  border-radius: 999px;
  font-weight: 700;
  white-space: nowrap;
}

body.night-mode .vf-friend-requests-bulk {
  border-color: rgba(109, 141, 255, 0.24);
  background: rgba(33, 111, 219, 0.14);
}

body.night-mode .vf-friend-requests-bulk strong {
  color: #f4f6f8;
}

body.night-mode .vf-friend-requests-bulk span {
  color: #aeb9c7;
}

.vf-friends-sent-preview {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid rgba(148, 163, 184, 0.18);
}

.vf-friends-sent-preview-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.vf-friends-sent-preview-head strong {
  color: #24324a;
  font-size: 13px;
  line-height: 1.25;
}

body.night-mode .vf-friends-sent-preview {
  border-top-color: #334052;
}

body.night-mode .vf-friends-sent-preview-head strong {
  color: #f4f6f8;
}

@media (max-width: 575.98px) {
  .vf-friend-requests-bulk {
    align-items: stretch;
    flex-direction: column;
  }

  .vf-friend-requests-bulk-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    width: 100%;
  }
}

.vf-mutual-friends-preview {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 4px;
}

.vf-mutual-friends-avatars {
  display: inline-flex;
  align-items: center;
  cursor: pointer;
}

.vf-mutual-friends-avatar {
  display: inline-block;
  width: 22px;
  height: 22px;
  border: 2px solid #fff;
  border-radius: 50%;
  background-position: center;
  background-size: cover;
  box-shadow: 0 4px 10px rgba(15, 23, 42, 0.16);
}

.vf-mutual-friends-avatar + .vf-mutual-friends-avatar {
  margin-left: -8px;
}

body.night-mode .vf-mutual-friends-avatar {
  border-color: #202833;
}

.vf-friends-stats {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
}

.vf-friends-stat {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  min-height: 82px;
  padding: 14px;
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 12px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 250, 255, 0.96));
  color: #24324a;
  text-decoration: none;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
}

.vf-friends-stat:hover {
  color: #24324a;
  text-decoration: none;
  border-color: rgba(33, 111, 219, 0.24);
}

.vf-friends-stat-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: rgba(33, 111, 219, 0.1);
  color: var(--bs-primary, #216FDB);
}

.vf-friends-stat span,
.vf-friends-stat strong {
  display: block;
}

.vf-friends-stat span {
  color: #6f7f92;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.25;
}

.vf-friends-stat strong {
  margin-top: 3px;
  color: #24324a;
  font-size: 24px;
  line-height: 1;
}

body.night-mode .vf-friends-stat {
  border-color: #334052;
  background: linear-gradient(180deg, rgba(32, 40, 51, 0.98), rgba(24, 31, 42, 0.96));
  color: #f4f6f8;
}

body.night-mode .vf-friends-stat:hover {
  color: #f4f6f8;
  border-color: rgba(109, 141, 255, 0.34);
}

body.night-mode .vf-friends-stat span {
  color: #aeb9c7;
}

body.night-mode .vf-friends-stat strong {
  color: #f4f6f8;
}

.vf-friends-search {
  position: relative;
}

.vf-directory-tools {
  display: flex;
  justify-content: flex-end;
}

.vf-directory-tools .vf-friends-search {
  width: min(100%, 420px);
}

.vf-search-results-tools {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 14px;
}

.vf-search-results-tools .vf-friends-search {
  flex: 1 1 280px;
  max-width: 420px;
}

.vf-search-results-summary {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  min-height: 42px;
  padding: 8px 13px;
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.84);
  color: #52627b;
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}

.vf-search-results-summary strong {
  color: #24324a;
  font-size: 16px;
}

body.night-mode .vf-search-results-summary {
  border-color: #334052;
  background: #202833;
  color: #aeb9c7;
}

body.night-mode .vf-search-results-summary strong {
  color: #f4f6f8;
}

.vf-dropdown-filter {
  padding: 10px 12px 6px;
}

.vf-dropdown-filter .vf-friends-search .form-control {
  height: 38px;
  font-size: 13px;
}

.vf-messages-thread-tabs {
  display: flex;
  gap: 8px;
  padding: 12px 12px 0;
}

.vf-messages-thread-tabs .btn {
  flex: 1 1 0;
  font-weight: 800;
}

.vf-messages-thread-search {
  padding: 12px 12px 8px;
}

.vf-messages-thread-empty {
  padding: 34px 18px;
}

.vf-messages-thread-empty p {
  max-width: 260px;
  margin-left: auto;
  margin-right: auto;
}

.vf-notifications-tools {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 14px;
}

.vf-notifications-tools .vf-friends-search {
  width: min(100%, 420px);
}

body.night-mode .vf-messages-thread-tabs .btn-light {
  border-color: #334052;
  background: #202833;
  color: #f4f6f8;
}

.vf-safety-dashboard {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.vf-safety-dashboard-item {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 58px;
  padding: 12px 14px;
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 8px;
  background: #f8fafc;
  color: #24324a;
  font-weight: 800;
}

.vf-safety-dashboard-item i {
  color: var(--bs-primary, #216FDB);
}

.vf-safety-dashboard-item:hover {
  border-color: rgba(33, 111, 219, 0.36);
  background: #fff;
  color: #1f5fbf;
}

.vf-privacy-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin: 18px 0 16px;
  padding-top: 18px;
  border-top: 1px solid rgba(148, 163, 184, 0.2);
}

.vf-safety-list-tools {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 14px;
}

.vf-safety-list-tools .vf-friends-search {
  width: min(100%, 420px);
}

.vf-admin-report-triage {
  display: grid;
  grid-template-columns: repeat(3, minmax(150px, 1fr)) minmax(240px, 1.3fr);
  gap: 10px;
  align-items: stretch;
}

.vf-admin-report-triage-item {
  min-height: 64px;
  padding: 12px 14px;
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 8px;
  background: #f8fafc;
}

.vf-admin-report-triage-item span {
  display: block;
  color: #52627b;
  font-size: 12px;
  font-weight: 800;
}

.vf-admin-report-triage-item strong {
  display: block;
  margin-top: 4px;
  color: #24324a;
  font-size: 24px;
  line-height: 1;
}

.vf-admin-report-filter {
  align-self: center;
}

body.night-mode .vf-safety-dashboard-item,
body.night-mode .vf-admin-report-triage-item {
  border-color: #334052;
  background: #202833;
  color: #f4f6f8;
}

body.night-mode .vf-admin-report-triage-item span {
  color: #aeb9c7;
}

body.night-mode .vf-admin-report-triage-item strong {
  color: #f4f6f8;
}

.vf-commerce-dashboard {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.vf-commerce-dashboard-item {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 58px;
  padding: 12px 14px;
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 8px;
  background: #f8fafc;
  color: #24324a;
  font-weight: 800;
}

.vf-commerce-dashboard-item i {
  color: var(--bs-primary, #216FDB);
}

.vf-commerce-dashboard-item:hover {
  border-color: rgba(33, 111, 219, 0.36);
  background: #fff;
  color: #1f5fbf;
}

.vf-commerce-table-tools {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 14px;
}

.vf-commerce-table-tools .vf-friends-search {
  width: min(100%, 420px);
}

body.night-mode .vf-commerce-dashboard-item {
  border-color: #334052;
  background: #202833;
  color: #f4f6f8;
}

.vf-growth-dashboard {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.vf-growth-dashboard-item {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 58px;
  padding: 12px 14px;
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 8px;
  background: #f8fafc;
  color: #24324a;
  font-weight: 800;
}

.vf-growth-dashboard-item i {
  color: var(--bs-primary, #216FDB);
}

.vf-growth-dashboard-item:hover {
  border-color: rgba(33, 111, 219, 0.36);
  background: #fff;
  color: #1f5fbf;
}

.vf-growth-table-tools {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 14px;
}

.vf-growth-table-tools .vf-friends-search {
  width: min(100%, 420px);
}

body.night-mode .vf-growth-dashboard-item {
  border-color: #334052;
  background: #202833;
  color: #f4f6f8;
}

.vf-platform-dashboard {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.vf-platform-dashboard-item {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 58px;
  padding: 12px 14px;
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 8px;
  background: #f8fafc;
  color: #24324a;
  font-weight: 800;
}

.vf-platform-dashboard-item i {
  color: var(--bs-primary, #216FDB);
}

.vf-platform-dashboard-item:hover {
  border-color: rgba(33, 111, 219, 0.36);
  background: #fff;
  color: #1f5fbf;
}

.vf-platform-table-tools {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 14px;
}

.vf-platform-table-tools .vf-friends-search {
  width: min(100%, 420px);
}

body.night-mode .vf-platform-dashboard-item {
  border-color: #334052;
  background: #202833;
  color: #f4f6f8;
}

.vf-admin-ops-dashboard,
.vf-admin-approval-summary {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}

.vf-admin-ops-dashboard {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.vf-admin-ops-dashboard-item,
.vf-admin-approval-summary-item {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 58px;
  padding: 12px 14px;
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 8px;
  background: #f8fafc;
  color: #24324a;
  font-weight: 800;
}

.vf-admin-approval-summary-item {
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
}

.vf-admin-ops-dashboard-item i {
  color: var(--bs-primary, #216FDB);
}

.vf-admin-approval-summary-item span {
  color: #6b7890;
  font-size: 0.78rem;
}

.vf-admin-approval-summary-item strong {
  color: #24324a;
  font-size: 1.35rem;
  line-height: 1.1;
}

.vf-admin-ops-dashboard-item:hover {
  border-color: rgba(33, 111, 219, 0.36);
  background: #fff;
  color: #1f5fbf;
}

.vf-admin-table-tools {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 14px;
}

.vf-admin-table-tools .vf-friends-search {
  width: min(100%, 420px);
}

.vf-admin-users-actions-heading,
.vf-admin-users-actions-cell {
  width: 124px;
  min-width: 124px;
  text-align: center;
  white-space: nowrap;
}

.vf-admin-users-actions {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  white-space: nowrap;
}

.vf-admin-users-actions .btn-icon {
  flex: 0 0 auto;
  margin: 0;
}

body.night-mode .vf-admin-ops-dashboard-item,
body.night-mode .vf-admin-approval-summary-item {
  border-color: #334052;
  background: #202833;
  color: #f4f6f8;
}

body.night-mode .vf-admin-approval-summary-item span {
  color: #b7c2d2;
}

body.night-mode .vf-admin-approval-summary-item strong {
  color: #f4f6f8;
}

.vf-skip-link {
  position: fixed;
  top: max(10px, env(safe-area-inset-top, 0px));
  left: 12px;
  z-index: 2147483647;
  transform: translateY(-160%);
  padding: 10px 14px;
  border-radius: 8px;
  background: #ffffff;
  color: #123052;
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.22);
  font-weight: 800;
  transition: transform 0.18s ease;
}

.vf-skip-link:focus,
.vf-skip-link:focus-visible {
  transform: translateY(0);
  color: #123052;
}

#vf-main-content:focus {
  outline: none;
}

a:focus-visible,
button:focus-visible,
[role="button"]:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.dropdown-item:focus-visible,
.footer-bottom-bar-links .link > a:focus-visible {
  outline: 3px solid rgba(33, 111, 219, 0.55) !important;
  outline-offset: 3px !important;
}

.main-header .navbar-wrapper > ul > li > a,
.main-header .home-icon,
.main-header .menu-icon,
.footer-bottom-bar-links .link > a,
.language-dropdown {
  touch-action: manipulation;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.001ms !important;
  }
}

@media (max-width: 575.98px) {
  .vf-search-results-tools {
    align-items: stretch;
    flex-direction: column;
  }

  .vf-search-results-tools .vf-friends-search {
    max-width: none;
  }

  .vf-safety-dashboard,
  .vf-admin-report-triage,
  .vf-commerce-dashboard,
  .vf-growth-dashboard,
  .vf-platform-dashboard,
  .vf-admin-ops-dashboard,
  .vf-admin-approval-summary {
    grid-template-columns: 1fr;
  }
}

.vf-profile-connections-tools,
.vf-profile-tab-tools {
  max-width: 420px;
}

.vf-profile-photo-tools {
  display: flex;
  max-width: 420px;
}

.vf-profile-photo-tools { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.vf-photo-manager-actions { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.vf-photo-manager-actions .js_vf-photo-destinations { width:auto; min-width:156px; max-width:220px; min-height:32px; padding-top:4px; padding-bottom:4px; }
.js_profile-photo-list > div, .vf-profile-photo-list > div, .js_vf-album-selection > [data-photo-id] { position:relative; isolation:isolate; }
/* Native checkboxes keep photo selection obvious and avoid the pin/delete overlays. */
.vf-photo-select { position:absolute !important; z-index:100 !important; right:auto !important; bottom:10px !important; left:10px !important; display:inline-flex !important; align-items:center !important; gap:6px !important; width:auto !important; height:32px !important; margin:0 !important; padding:0 10px 0 8px !important; border:1px solid rgba(255,255,255,.88) !important; border-radius:9px !important; background:rgba(10,24,45,.84) !important; color:#fff !important; box-shadow:0 4px 12px rgba(0,0,0,.3) !important; cursor:pointer !important; pointer-events:auto !important; }
.vf-photo-select input { position:static !important; display:block !important; width:16px !important; height:16px !important; margin:0 !important; opacity:1 !important; accent-color:#1677e8; cursor:pointer !important; }
.vf-photo-select-text { display:block !important; color:inherit !important; font-size:11px !important; font-weight:800 !important; line-height:1 !important; }
.vf-photo-select:hover { background:rgba(16,42,78,.96) !important; }
.vf-photo-select.is-selected, .vf-photo-select:has(input:checked) { border-color:#1677e8 !important; background:#1677e8 !important; }
.pg_photo-delete-btn { z-index:101 !important; right:8px !important; top:8px !important; }
.pg_photo-delete-btn .btn-close { position:relative !important; display:grid !important; place-items:center !important; width:30px !important; height:30px !important; padding:0 !important; border:1px solid rgba(255,255,255,.88) !important; border-radius:9px !important; background:#e5484d !important; background-image:none !important; opacity:1 !important; box-shadow:0 4px 12px rgba(127,29,29,.28) !important; }
.pg_photo-delete-btn .btn-close::before { color:#fff !important; content:'×' !important; font-size:23px !important; font-weight:500 !important; line-height:1 !important; }
.pg_photo-delete-btn .btn-close:hover { background:#c9373c !important; }
@media (max-width:575.98px) { .vf-photo-manager-actions { width:100%; } .vf-photo-manager-actions .js_vf-photo-destinations { flex:1 1 150px; } .vf-photo-manager-actions .btn { flex:1 1 auto; } }

/* Secure album management keeps controls visible without changing legacy grids. */
.vf-album-description { margin: .5rem 0 .85rem; color: var(--bs-secondary-color, #64748b); white-space: normal; }
.vf-photo-caption { padding: .75rem 0 .15rem; color: #31445d; line-height: 1.5; }
.vf-album-sortable { position: relative; cursor: grab; }
.vf-album-sortable.vf-dragging { cursor: grabbing; opacity: .45; }
.vf-album-photo-tools { position: absolute; z-index: 3; right: .55rem; bottom: .55rem; display: flex; gap: .35rem; }
.vf-album-photo-tools button { width: 30px; height: 30px; border: 0; border-radius: 9px; color: #fff; background: rgba(13, 36, 72, .78); box-shadow: 0 3px 10px rgba(15, 23, 42, .2); }
.vf-album-photo-tools button:hover { background: var(--vf-primary, #1677e8); }
.vf-album-setting-checks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem 1rem; }
.vf-album-setting-checks label { display: flex; align-items: center; gap: .45rem; font-size: .9rem; }
.vf-contributor-permissions { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .7rem; font-size: .8rem; }
.vf-contributor-permissions label { display: inline-flex; align-items: center; gap: .25rem; }
.vf-album-library-toolbar { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.vf-album-library-tabs { display: flex; flex-wrap: wrap; gap: .4rem; }
.vf-album-library-tabs a, .vf-album-counts span { padding: .4rem .65rem; border-radius: 999px; background: #f1f6fb; color: #486178; font-size: .82rem; font-weight: 700; text-decoration: none; }
.vf-album-library-tabs a.active,
.vf-album-library-tabs a.active:visited,
.vf-album-library-tabs a.active:hover,
.vf-album-library-tabs a.active:focus {
  background: var(--vf-primary, #1677e8) !important;
  color: #ffffff !important;
}
.vf-album-library-tabs a.active * { color: inherit !important; }
.vf-album-counts { display: flex; flex-wrap: wrap; gap: .4rem; }
@media (max-width: 575.98px) { .vf-album-setting-checks { grid-template-columns: 1fr; } .vf-album-photo-tools button { width: 36px; height: 36px; } }
@media (max-width: 575.98px) { .vf-album-library-toolbar { align-items: flex-start; flex-direction: column; } }

.vf-profile-photo-filters .btn {
  font-weight: 700;
}

.vf-profile-event-tools {
  display: flex;
  align-items: center;
  gap: 10px;
  max-width: 680px;
}

.vf-profile-event-tools .vf-friends-search {
  flex: 1 1 300px;
}

.vf-profile-event-filters {
  flex: 0 0 auto;
}

.vf-profile-event-filters .btn {
  font-weight: 700;
}

.vf-friends-search i {
  position: absolute;
  top: 50%;
  left: 14px;
  color: #6f7f92;
  transform: translateY(-50%);
  pointer-events: none;
}

.vf-friends-search .form-control {
  height: 44px;
  padding-left: 40px;
  border-color: rgba(148, 163, 184, 0.3);
  border-radius: 999px;
  background: #f8fafc;
  font-weight: 700;
}

.vf-friends-search .form-control:focus {
  border-color: rgba(33, 111, 219, 0.42);
  background: #fff;
  box-shadow: 0 0 0 0.2rem rgba(33, 111, 219, 0.12);
}

body.night-mode .vf-friends-search i {
  color: #aeb9c7;
}

body.night-mode .vf-friends-search .form-control {
  border-color: #334052;
  background: #202833;
  color: #f4f6f8;
}

body.night-mode .vf-friends-search .form-control:focus {
  border-color: rgba(109, 141, 255, 0.44);
  background: #1a2230;
}

body.vf-page-banned .banned-gradient-bg {
  background: #edf3f7 !important;
  background-image: none !important;
}

@media (max-width: 1199.98px) {
  .vf-friends-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 575.98px) {
  .vf-friends-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .vf-friends-stat {
    min-height: 76px;
    padding: 12px;
  }

  .vf-profile-event-tools {
    align-items: stretch;
    flex-direction: column;
  }

  .vf-profile-event-tools .vf-friends-search,
  .vf-profile-event-filters {
    width: 100%;
  }

  .vf-profile-photo-tools,
  .vf-profile-photo-filters {
    width: 100%;
  }

  .vf-profile-photo-filters .btn,
  .vf-profile-event-filters .btn {
    flex: 1 1 0;
  }
}

/* r118 feed filter responsive state */
@media (min-width: 768px) {
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter-mobile-sheet-enabled > .vf-posts-filter-mobile-trigger,
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter-mobile-backdrop,
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter-mobile-sheet {
    display: none !important;
  }
}

@media (max-width: 767.98px) {
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter-mobile-sheet-enabled > :not(.vf-posts-filter-mobile-trigger) {
    display: none !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter-mobile-sheet-enabled > .vf-posts-filter-mobile-trigger {
    display: inline-flex !important;
    width: 100% !important;
  }

  body.vf-page-index .vf-posts-filter-mobile-sheet.is-open {
    overflow-y: auto !important;
    overscroll-behavior-y: contain !important;
    -webkit-overflow-scrolling: touch !important;
    touch-action: pan-y !important;
  }

  body.vf-page-index .vf-posts-filter-mobile-sheet .dropdown-menu.show,
  body.vf-page-index .vf-posts-filter-mobile-sheet .dropdown-menu[data-bs-popper] {
    left: 14px !important;
    right: 14px !important;
    width: auto !important;
    transform: none !important;
    max-height: min(320px, calc(100dvh - 220px)) !important;
    overflow-y: auto !important;
    overscroll-behavior-y: contain !important;
    -webkit-overflow-scrolling: touch !important;
    touch-action: pan-y !important;
  }

  body.vf-page-index.vf-posts-filter-sheet-open {
    overscroll-behavior: none !important;
  }
}

/* r119 mobile composer quick actions */
@media (max-width: 767.98px) {
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .composer-launcher .card-body {
    overflow: visible !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 5px !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 10px !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
    min-width: 0 !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions::-webkit-scrollbar {
    display: none !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions button {
    flex: 1 1 0 !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 32px !important;
    padding: 0 4px !important;
    justify-content: center !important;
    gap: 3px !important;
    font-size: 0.66rem !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-align: center !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions button i {
    flex: 0 0 auto !important;
    font-size: 0.78rem !important;
  }
}

@media (max-width: 380px) {
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions {
    gap: 4px !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions button {
    min-height: 31px !important;
    padding: 0 3px !important;
    font-size: 0.61rem !important;
  }
}

/* r120 messages PWA foundation */
.vf-messages-pwa-shell {
  max-width: 1320px;
}

.vf-messages-pwa-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
  padding: 14px 16px;
  border: 1px solid rgba(135, 159, 177, 0.2);
  border-radius: 8px;
  background: rgba(248, 251, 252, 0.86);
  box-shadow: 0 8px 20px rgba(15, 38, 54, 0.05);
}

.vf-messages-pwa-copy {
  min-width: 0;
}

.vf-messages-pwa-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 3px;
  color: #286584;
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.vf-messages-pwa-hero h1 {
  margin: 0;
  color: #162334;
  font-size: 1.35rem;
  font-weight: 850;
  line-height: 1.15;
}

.vf-messages-pwa-hero p {
  max-width: 680px;
  margin: 4px 0 0;
  color: #5d6f83;
  font-size: 0.86rem;
  line-height: 1.38;
}

.vf-messages-pwa-actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
}

.vf-messages-pwa-actions .btn,
.vf-messages-pwa-status {
  flex: 0 0 auto;
  min-height: 34px;
  padding-right: 13px;
  padding-left: 13px;
  border-radius: 999px;
  font-size: 0.74rem;
  font-weight: 850;
  letter-spacing: 0.01em;
  box-shadow: none !important;
}

.vf-messages-pwa-actions .btn-light {
  border-color: rgba(35, 72, 92, 0.16);
  background: #ffffff;
  color: #23485c;
}

.vf-messages-pwa-status {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid rgba(46, 107, 134, 0.2);
  border-radius: 999px;
  color: #23485c;
  background: #ffffff;
  white-space: nowrap;
}

.vf-messages-pwa-status::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: #22c55e;
}

.vf-messages-pwa-status.is-offline::before {
  background: #f59e0b;
}

.vf-messages-install-gate {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  margin: 0 0 16px;
  padding: 12px;
  border: 1px solid rgba(46, 103, 136, 0.2);
  border-radius: 8px;
  background: #f8fbfc;
  box-shadow: 0 10px 24px rgba(15, 38, 54, 0.08);
}

.vf-messages-install-gate-icon {
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  color: #ffffff;
  background: #2e6788;
  font-size: 1rem;
}

.vf-messages-install-gate-copy {
  min-width: 0;
}

.vf-messages-install-gate-copy strong,
.vf-messages-install-gate-copy span {
  display: block;
}

.vf-messages-install-gate-copy strong {
  color: #162334;
  font-size: 0.94rem;
  font-weight: 850;
  line-height: 1.2;
}

.vf-messages-install-gate-copy span {
  margin-top: 3px;
  color: #5d6f83;
  font-size: 0.78rem;
  line-height: 1.3;
}

.vf-messages-floating-install {
  position: fixed !important;
  right: 18px;
  bottom: 92px;
  z-index: 1090;
  min-height: 44px;
  padding-right: 18px !important;
  padding-left: 18px !important;
  box-shadow: 0 14px 30px rgba(15, 38, 54, 0.24);
}

.vf-messages-ios-install {
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  display: none;
  align-items: flex-end;
  justify-content: center;
  padding: 16px;
}

.vf-messages-ios-install.is-visible {
  display: flex;
}

.vf-messages-ios-install-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(5, 12, 22, 0.66);
  backdrop-filter: blur(8px);
}

.vf-messages-ios-install-sheet {
  position: relative;
  width: min(100%, 430px);
  padding: 24px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 24px;
  background: #071321;
  color: #f8fafc;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.34);
}

.vf-messages-ios-install-close {
  position: absolute;
  top: 12px;
  right: 14px;
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.1);
  color: #f8fafc;
  font-size: 24px;
  line-height: 1;
}

.vf-messages-ios-install-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  margin-bottom: 14px;
  border-radius: 18px;
  background: #2e6788;
  color: #fff;
  font-size: 22px;
}

.vf-messages-ios-install h3 {
  margin: 0 34px 8px 0;
  color: #fff;
  font-size: 24px;
  font-weight: 800;
  letter-spacing: 0;
}

.vf-messages-ios-install p {
  margin: 0 0 18px;
  color: rgba(248, 250, 252, 0.76);
  font-size: 14px;
  line-height: 1.45;
}

.vf-messages-ios-install-steps {
  display: grid;
  gap: 10px;
  margin: 0 0 18px;
  padding: 0;
  list-style: none;
}

.vf-messages-ios-install-steps li {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 48px;
  padding: 10px 12px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.07);
}

.vf-messages-ios-install-steps span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: rgba(95, 221, 194, 0.16);
  color: #5fddc2;
  font-weight: 800;
}

.vf-messages-ios-install-steps strong {
  color: #f8fafc;
  font-size: 14px;
  line-height: 1.25;
}

.vf-messages-ios-install-actions {
  display: grid;
  gap: 10px;
}

.vf-messages-pwa-shell .row.h-100 {
  min-height: min(760px, calc(100vh - 210px));
}

.vf-messages-pwa-shell .sg-offcanvas-sidebar .card,
.vf-messages-pwa-shell .panel-messages,
.vf-messages-pwa-shell .card-messages {
  overflow: hidden;
  border: 1px solid rgba(135, 159, 177, 0.24);
  border-radius: 8px;
  box-shadow: 0 14px 30px rgba(15, 38, 54, 0.08);
}

.vf-messages-pwa-shell .sg-offcanvas-sidebar .card {
  height: 100%;
}

.vf-messages-pwa-shell .vf-messages-thread-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.vf-messages-pwa-shell .vf-messages-thread-title {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  font-size: 1rem;
  font-weight: 850;
}

.vf-messages-pwa-shell .vf-messages-thread-tabs {
  display: flex;
  gap: 8px;
  padding: 12px 14px;
  border-bottom: 1px solid rgba(135, 159, 177, 0.2);
}

.vf-messages-pwa-shell .vf-messages-thread-tabs .btn {
  flex: 1 1 0;
}

.vf-messages-pwa-shell .vf-messages-thread-search {
  padding: 0 12px 12px;
}

.vf-messages-pwa-shell .chat-conversations {
  overscroll-behavior: contain;
}

.vf-messages-pwa-shell .panel-messages .card-header {
  min-height: 62px;
  background: #ffffff;
}

.vf-messages-pwa-shell .panel-messages .card-body {
  display: flex;
  flex-direction: column;
  min-height: min(680px, calc(100vh - 295px));
}

.vf-messages-pwa-shell .panel-messages .chat-conversations {
  flex: 1 1 auto;
  min-height: 360px;
}

.vf-messages-pwa-shell .chat-form {
  flex: 0 0 auto;
}

body.night-mode .vf-messages-pwa-hero,
body.night-mode .vf-messages-install-gate,
body.night-mode .vf-messages-pwa-status,
body.night-mode .vf-messages-pwa-shell .panel-messages .card-header {
  border-color: rgba(99, 123, 160, 0.32);
  background: #142334;
}

body.night-mode .vf-messages-pwa-actions .btn-light {
  border-color: rgba(148, 163, 184, 0.28);
  background: #1a2b40;
  color: #e5edf7;
}

body.night-mode .vf-messages-pwa-hero h1,
body.night-mode .vf-messages-install-gate-copy strong,
body.night-mode .vf-messages-pwa-status {
  color: #f8fafc;
}

body.night-mode .vf-messages-pwa-hero p,
body.night-mode .vf-messages-install-gate-copy span {
  color: #b9c6d6;
}

@media (max-width: 991.98px) {
  .vf-messages-pwa-hero {
    align-items: flex-start;
    flex-direction: column;
  }

  .vf-messages-pwa-actions {
    width: 100%;
    justify-content: flex-start;
    flex-wrap: wrap;
  }
}

@media (max-width: 767.98px) {
  .vf-messages-pwa-shell {
    margin-top: 8px !important;
    padding-right: 10px;
    padding-left: 10px;
  }

  .vf-messages-pwa-hero {
    gap: 12px;
    margin-bottom: 10px;
    padding: 13px 14px;
    border-radius: 0;
    box-shadow: none;
  }

  .vf-messages-pwa-kicker {
    margin-bottom: 3px;
    font-size: 0.68rem;
  }

  .vf-messages-pwa-hero h1 {
    font-size: 1.2rem;
  }

  .vf-messages-pwa-hero p {
    display: none;
  }

  .vf-messages-pwa-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    width: 100%;
  }

  .vf-messages-pwa-actions .btn,
  .vf-messages-pwa-status {
    width: 100%;
    min-height: 36px;
    min-width: 0;
    padding-right: 10px;
    padding-left: 10px;
    justify-content: center;
    font-size: 0.76rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .vf-messages-pwa-status {
    grid-column: 1 / -1;
  }

  .vf-messages-install-gate {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .vf-messages-install-gate .btn {
    grid-column: 1 / -1;
    width: 100%;
  }

  .vf-messages-pwa-shell .row.h-100 {
    min-height: calc(100dvh - 205px);
  }

  .vf-messages-pwa-shell .panel-messages,
  .vf-messages-pwa-shell .card-messages {
    border-radius: 0;
    box-shadow: none;
  }

  .vf-messages-pwa-shell .panel-messages .card-header {
    position: sticky;
    top: 0;
    z-index: 5;
    min-height: 54px;
  }

  .vf-messages-pwa-shell .panel-messages .card-body {
    min-height: calc(100dvh - 250px);
    padding: 10px;
  }

  .vf-messages-pwa-shell .panel-messages .chat-conversations {
    min-height: calc(100dvh - 420px);
  }

  .vf-messages-pwa-shell .chat-form {
    position: sticky;
    bottom: 72px;
    z-index: 4;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 -8px 18px rgba(15, 38, 54, 0.08);
  }

  body.night-mode .vf-messages-pwa-shell .chat-form {
    background: #142334;
  }
}

/* r121 launch-day site cosmetics */
body:not(.night-mode) {
  background-color: #edf3f7 !important;
}

body:not(.night-mode) .main-wrapper {
  color: #172334;
}

body:not(.night-mode) .main-wrapper .card:not(.vf-promo-card):not(.bg-transparent):not(.bg-red):not(.bg-blue):not(.bg-green):not(.bg-purple):not(.bg-orange):not(.bg-black):not(.bg-primary):not(.bg-info):not(.bg-success):not(.bg-danger):not(.bg-warning):not(.bg-dark),
body:not(.night-mode) .main-wrapper .post {
  border-color: rgba(207, 219, 235, 0.84) !important;
  background: rgba(255, 255, 255, 0.97) !important;
  box-shadow: 0 12px 28px rgba(30, 51, 86, 0.08) !important;
  transform: none !important;
}

body:not(.night-mode) .main-wrapper .card:not(.vf-promo-card):not(.main-side-nav-card):not(.bg-transparent):not(.bg-red):not(.bg-blue):not(.bg-green):not(.bg-purple):not(.bg-orange):not(.bg-black):not(.bg-primary):not(.bg-info):not(.bg-success):not(.bg-danger):not(.bg-warning):not(.bg-dark)::before,
body:not(.night-mode) .main-wrapper .post::before {
  height: 3px !important;
  background: linear-gradient(90deg, #2f6dff 0%, #21bdd3 100%) !important;
}

body:not(.night-mode) .main-wrapper .card:not(.vf-promo-card):not(.bg-transparent):not(.bg-red):not(.bg-blue):not(.bg-green):not(.bg-purple):not(.bg-orange):not(.bg-black):not(.bg-primary):not(.bg-info):not(.bg-success):not(.bg-danger):not(.bg-warning):not(.bg-dark):hover,
body:not(.night-mode) .main-wrapper .post:hover {
  border-color: rgba(184, 202, 227, 0.96) !important;
  box-shadow: 0 16px 34px rgba(30, 51, 86, 0.11) !important;
  transform: translateY(-1px) !important;
}

body:not(.night-mode) .main-wrapper .card .card-header {
  min-width: 0;
  border-bottom-color: rgba(218, 228, 241, 0.86) !important;
  background: rgba(255, 255, 255, 0.93) !important;
}

.main-wrapper .btn:not(.btn-icon),
.main-wrapper button.btn:not(.btn-icon),
.main-wrapper a.btn:not(.btn-icon),
.main-wrapper .dropdown-item {
  align-items: center;
  min-width: 0;
  white-space: nowrap;
}

.main-wrapper .btn:not(.btn-icon),
.main-wrapper button.btn:not(.btn-icon),
.main-wrapper a.btn:not(.btn-icon) {
  display: inline-flex;
  justify-content: center;
  gap: 7px;
}

.main-wrapper .btn:not(.btn-icon) > i,
.main-wrapper .btn:not(.btn-icon) > svg,
.main-wrapper .dropdown-item > i,
.main-wrapper .dropdown-item > svg {
  flex: 0 0 auto;
}

.main-wrapper .btn:not(.btn-icon) > span,
.main-wrapper .dropdown-item > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.main-wrapper .btn-icon,
.main-wrapper .btn-rounded.btn-icon,
.main-wrapper .post-menu-toggle,
.main-wrapper .vf-carousel-control {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  aspect-ratio: 1 / 1;
  line-height: 1 !important;
}

.main-wrapper .post .post-actions,
.main-wrapper .post .post-stats {
  min-width: 0;
}

.main-wrapper .action-btn {
  min-width: 0;
}

.main-wrapper .action-btn .action-icon,
.main-wrapper .action-btn i,
.main-wrapper .action-btn svg {
  flex: 0 0 auto;
}

body.vf-page-index .vf-newsfeed-shell .vf-side-rail .card,
body.vf-page-index .vf-newsfeed-shell .vf-side-rail .sidebar-weather-board {
  border-radius: 14px !important;
}

body.vf-page-index .vf-newsfeed-shell .sidebar-weather-board {
  border-color: rgba(207, 219, 235, 0.6) !important;
  background:
    radial-gradient(circle at 82% 4%, rgba(95, 132, 255, 0.24), transparent 34%),
    var(--vf-header-aesthetic-bg-image, linear-gradient(135deg, #143153 0%, #203d79 100%)) !important;
  box-shadow: 0 14px 34px rgba(18, 38, 84, 0.16) !important;
}

.vf-messages-pwa-hero,
.vf-messages-install-gate,
.vf-messages-pwa-shell .sg-offcanvas-sidebar .card,
.vf-messages-pwa-shell .panel-messages,
.vf-messages-pwa-shell .card-messages {
  border-color: rgba(207, 219, 235, 0.84);
  box-shadow: 0 12px 28px rgba(30, 51, 86, 0.08);
}

.vf-messages-pwa-actions .btn,
.vf-messages-pwa-status {
  max-width: 100%;
}

@media (max-width: 767.98px) {
  body:not(.night-mode) {
    background-color: #edf3f7 !important;
  }

  .main-wrapper .card:not(.vf-promo-card),
  .main-wrapper .post {
    box-shadow: 0 8px 20px rgba(30, 51, 86, 0.07) !important;
  }

  .main-wrapper .dropdown-menu {
    max-width: calc(100vw - 24px);
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .composer-launcher {
    border-radius: 14px !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .composer-launcher-avatar {
    flex: 0 0 38px !important;
    width: 38px !important;
    height: 38px !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .composer-launcher-input {
    min-height: 42px !important;
    height: 42px !important;
    padding: 9px 12px !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions {
    align-items: stretch !important;
    gap: 6px !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions button {
    flex: 1 1 0 !important;
    min-height: 34px !important;
    border-radius: 999px !important;
    letter-spacing: 0 !important;
    text-overflow: ellipsis !important;
  }

  .main-wrapper .post .post-actions {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
  }

  .main-wrapper .post .post-actions .action-btn {
    justify-content: center;
    min-height: 36px;
    padding-right: 4px;
    padding-left: 4px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .vf-messages-pwa-hero,
  .vf-messages-install-gate {
    border-radius: 8px;
  }
}

@media (max-width: 420px) {
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions button {
    gap: 2px !important;
    padding: 0 5px !important;
    font-size: 0.67rem !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions button i {
    font-size: 0.75rem !important;
  }
}

@media (max-width: 360px) {
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions button {
    font-size: 0 !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions button i {
    margin: 0 !important;
    font-size: 0.9rem !important;
  }
}

/* r122 full-site readability cosmetics */
html body:not(.night-mode) {
  --vf-readable-text: #172334;
  --vf-readable-muted: #5f7188;
  --vf-readable-border: rgba(207, 219, 235, 0.86);
  --vf-readable-surface: rgba(255, 255, 255, 0.97);
  --vf-readable-shadow: 0 12px 28px rgba(30, 51, 86, 0.08);
}

html body:not(.night-mode) .main-wrapper .text-muted,
html body:not(.night-mode) .main-wrapper small,
html body:not(.night-mode) .main-wrapper .sub-text {
  color: var(--vf-readable-muted) !important;
}

html body .main-wrapper .vf-directory-hero.page-header,
html body .main-wrapper .vf-world-hero.page-header,
html body .main-wrapper .vf-blogs-hero.page-header,
html body.vf-page-stories_archive .main-wrapper .vf-events-hero.page-header {
  min-height: 0 !important;
  height: auto !important;
  margin-top: 18px !important;
  margin-bottom: 26px !important;
  overflow: hidden !important;
  border-radius: 24px !important;
}

html body .main-wrapper .vf-directory-hero .container,
html body .main-wrapper .vf-directory-hero .container-fluid,
html body .main-wrapper .vf-world-hero .container,
html body .main-wrapper .vf-world-hero .container-fluid,
html body .main-wrapper .vf-blogs-hero .container,
html body .main-wrapper .vf-blogs-hero .container-fluid,
html body.vf-page-stories_archive .main-wrapper .vf-events-hero .container,
html body.vf-page-stories_archive .main-wrapper .vf-events-hero .container-fluid {
  min-height: 0 !important;
  padding: 30px 34px !important;
}

html body .main-wrapper .vf-world-hero .container,
html body .main-wrapper .vf-world-hero .container-fluid,
html body .main-wrapper .vf-blogs-hero .container,
html body .main-wrapper .vf-blogs-hero .container-fluid {
  grid-template-columns: minmax(0, 1fr) minmax(280px, 400px) !important;
  gap: 24px !important;
}

html body .main-wrapper .vf-directory-hero h2,
html body .main-wrapper .vf-world-hero h2,
html body .main-wrapper .vf-blogs-hero h2,
html body.vf-page-stories_archive .main-wrapper .vf-events-hero h2 {
  max-width: 760px !important;
  font-size: clamp(2.15rem, 3.1vw, 3.15rem) !important;
  line-height: 1.04 !important;
  letter-spacing: 0 !important;
}

html body .main-wrapper .vf-directory-hero .vf-events-hero-subtitle,
html body .main-wrapper .vf-directory-hero p.text-xlg.vf-events-hero-subtitle,
html body .main-wrapper .vf-world-hero .vf-events-hero-subtitle,
html body .main-wrapper .vf-world-hero p.text-xlg.vf-events-hero-subtitle,
html body .main-wrapper .vf-blogs-hero .vf-events-hero-subtitle,
html body .main-wrapper .vf-blogs-hero p.text-xlg.vf-events-hero-subtitle,
html body.vf-page-stories_archive .main-wrapper .vf-events-hero .vf-events-hero-subtitle,
html body.vf-page-stories_archive .main-wrapper .vf-events-hero p.text-xlg.vf-events-hero-subtitle {
  max-width: 650px !important;
  margin-top: 12px !important;
  font-size: 1rem !important;
  line-height: 1.48 !important;
}

html body .main-wrapper .vf-directory-hero .vf-events-hero-stats,
html body .main-wrapper .vf-world-hero .vf-events-hero-stats,
html body .main-wrapper .vf-blogs-hero .vf-events-hero-stats {
  gap: 8px !important;
}

html body .main-wrapper .vf-directory-hero .vf-events-hero-stat,
html body .main-wrapper .vf-world-hero .vf-events-hero-stat,
html body .main-wrapper .vf-blogs-hero .vf-events-hero-stat {
  min-height: 52px !important;
  border-radius: 14px !important;
}

html body .main-wrapper .vf-directory-hero .vf-events-hero-search,
html body .main-wrapper .vf-world-hero .vf-events-hero-search,
html body .main-wrapper .vf-blogs-hero .vf-events-hero-search {
  max-width: 100% !important;
}

html body .main-wrapper .vf-directory-hero .vf-events-hero-search .input-group,
html body .main-wrapper .vf-world-hero .vf-events-hero-search .input-group,
html body .main-wrapper .vf-blogs-hero .vf-events-hero-search .input-group {
  align-items: stretch !important;
  min-height: 46px !important;
}

html body .main-wrapper .vf-directory-hero .vf-events-hero-search .form-control,
html body .main-wrapper .vf-world-hero .vf-events-hero-search .form-control,
html body .main-wrapper .vf-blogs-hero .vf-events-hero-search .form-control {
  min-width: 0 !important;
  min-height: 46px !important;
}

html body .main-wrapper .vf-directory-hero .vf-events-hero-search .btn,
html body .main-wrapper .vf-world-hero .vf-events-hero-search .btn,
html body .main-wrapper .vf-blogs-hero .vf-events-hero-search .btn {
  min-height: 46px !important;
  border-radius: 0 16px 16px 0 !important;
}

.vf-profile-shell .profile-name-wrapper > a:first-of-type,
.profile-header .profile-name-wrapper a {
  display: inline-block;
  max-width: 100%;
  line-height: 1.05 !important;
  letter-spacing: 0 !important;
  overflow-wrap: anywhere;
}

.vf-profile-shell .profile-header-meta,
.vf-profile-shell .profile-header-identity,
.vf-profile-shell .profile-header-social,
.vf-profile-shell .profile-buttons-wrapper {
  min-width: 0;
}

html body:not(.night-mode) .main-wrapper .card:not(.vf-promo-card) .card-header strong,
html body:not(.night-mode) .main-wrapper .card:not(.vf-promo-card) .card-header h5,
html body:not(.night-mode) .main-wrapper .card:not(.vf-promo-card) .card-header h6 {
  color: #1f2f46 !important;
  letter-spacing: 0 !important;
}

html body:not(.night-mode) .main-wrapper .card:not(.vf-promo-card) .card-body {
  color: var(--vf-readable-text);
}

html body .main-wrapper .vf-side-rail .vf-blog-carousel-card .post-media-meta .title,
html body .main-wrapper .vf-side-rail .vf-blog-carousel-card .post-media-meta .title a,
html body .main-wrapper .post-media-meta .title,
html body .main-wrapper .post-media-meta .title a {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-height: 1.24 !important;
}

html body .main-wrapper .post-media-meta .text,
html body .main-wrapper .post-media-meta .info {
  line-height: 1.35 !important;
}

html body:not(.night-mode) .main-wrapper .form-control,
html body:not(.night-mode) .main-wrapper .form-select,
html body:not(.night-mode) .main-wrapper select.form-control,
html body:not(.night-mode) .main-wrapper textarea.form-control {
  border-color: rgba(191, 207, 226, 0.9) !important;
  color: #172334 !important;
  background-color: #ffffff;
}

html body:not(.night-mode) .main-wrapper .form-control::placeholder {
  color: #7a8aa0 !important;
}

html body:not(.night-mode) .main-wrapper .main-header .form-control,
html body:not(.night-mode) .main-wrapper .main-header .vf-header-search-input {
  border-color: rgba(255, 255, 255, 0.16) !important;
  background: rgba(255, 255, 255, 0.16) !important;
  color: #f8fbff !important;
}

html body:not(.night-mode) .main-wrapper .main-header .form-control::placeholder,
html body:not(.night-mode) .main-wrapper .main-header .vf-header-search-input::placeholder {
  color: rgba(248, 251, 255, 0.76) !important;
}

html body:not(.night-mode) .main-wrapper .page-header .form-control {
  border-color: rgba(255, 255, 255, 0.22) !important;
  background: transparent !important;
  color: #ffffff !important;
}

html body:not(.night-mode) .main-wrapper .page-header .form-control::placeholder {
  color: rgba(255, 255, 255, 0.76) !important;
}

html body:not(.night-mode) .main-wrapper .dropdown-menu,
html body:not(.night-mode) .main-wrapper .dropdown-widget,
html body:not(.night-mode) .main-wrapper .action-dropdown-menu {
  border-color: rgba(207, 219, 235, 0.9) !important;
  background: rgba(255, 255, 255, 0.98) !important;
  box-shadow: 0 18px 42px rgba(30, 51, 86, 0.14) !important;
}

html body .main-wrapper .dropdown-item {
  min-height: 36px;
  border-radius: 8px;
}

@media (min-width: 1200px) {
  html body .main-wrapper .container:not(.vf-auth-container),
  html body .main-wrapper .container-fluid {
    scroll-margin-top: 86px;
  }
}

@media (max-width: 991.98px) {
  html body .main-wrapper .vf-world-hero .container,
  html body .main-wrapper .vf-world-hero .container-fluid,
  html body .main-wrapper .vf-blogs-hero .container,
  html body .main-wrapper .vf-blogs-hero .container-fluid {
    display: block !important;
  }
}

@media (max-width: 767.98px) {
  html body .main-wrapper .vf-directory-hero.page-header,
  html body .main-wrapper .vf-world-hero.page-header,
  html body .main-wrapper .vf-blogs-hero.page-header,
  html body.vf-page-stories_archive .main-wrapper .vf-events-hero.page-header {
    width: calc(100% - 20px) !important;
    max-width: calc(100% - 20px) !important;
    margin-top: 10px !important;
    margin-bottom: 14px !important;
    border-radius: 16px !important;
  }

  html body .main-wrapper .vf-directory-hero .container,
  html body .main-wrapper .vf-directory-hero .container-fluid,
  html body .main-wrapper .vf-world-hero .container,
  html body .main-wrapper .vf-world-hero .container-fluid,
  html body .main-wrapper .vf-blogs-hero .container,
  html body .main-wrapper .vf-blogs-hero .container-fluid,
  html body.vf-page-stories_archive .main-wrapper .vf-events-hero .container,
  html body.vf-page-stories_archive .main-wrapper .vf-events-hero .container-fluid {
    padding: 24px 18px !important;
  }

  html body .main-wrapper .vf-directory-hero h2,
  html body .main-wrapper .vf-world-hero h2,
  html body .main-wrapper .vf-blogs-hero h2,
  html body.vf-page-stories_archive .main-wrapper .vf-events-hero h2 {
    font-size: 2rem !important;
    line-height: 1.08 !important;
  }

  html body .main-wrapper .card .card-header {
    min-height: 48px;
    padding: 12px 14px !important;
  }

  html body .main-wrapper .card .card-body {
    padding: 14px !important;
  }

  .vf-profile-shell .profile-name-wrapper > a:first-of-type,
  .profile-header .profile-name-wrapper a {
    line-height: 1.08 !important;
  }
}

/* r123 modern shared brand color pass */
html body {
  --vf-modern-nav-bg: var(--vf-header-aesthetic-bg-image, var(--header-bg-color, linear-gradient(135deg, #071426 0%, #12395a 48%, #20748c 100%)));
  --vf-modern-nav-bg-soft: var(--vf-modal-header-bg, var(--vf-modern-nav-bg));
  --vf-modern-nav-border: var(--vf-header-aesthetic-border, rgba(105, 206, 224, 0.28));
  --vf-modern-nav-text: var(--vf-header-aesthetic-text, #f7fbff);
  --vf-modern-primary: var(--vf-accent, var(--link-color, #2563eb));
  --vf-modern-primary-hover: var(--vf-accent-hover, var(--vf-accent-strong, var(--vf-modern-primary)));
  --vf-modern-primary-border: var(--vf-accent-strong, var(--vf-modern-primary));
  --vf-modern-primary-shadow: 0 12px 24px rgba(37, 99, 235, 0.22);
}

html body:not(.night-mode) .main-wrapper .main-header,
html body:not(.night-mode).modal-open .main-wrapper .main-header,
html body:not(.night-mode).n_activated .main-wrapper .main-header,
html body:not(.night-mode).n_live .main-wrapper .main-header {
  background: var(--vf-modern-nav-bg) !important;
  background-color: var(--header-bg-color, #12395a) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 10px 26px rgba(7, 20, 38, 0.22) !important;
}

html body:not(.night-mode) .main-wrapper .main-header::before {
  background: var(--vf-header-aesthetic-overlay, none) !important;
  background-image: var(--vf-header-aesthetic-overlay, none) !important;
}

html body:not(.night-mode) .main-wrapper .main-header .logo,
html body:not(.night-mode) .main-wrapper .main-header .logo:hover,
html body:not(.night-mode) .main-wrapper .main-header .navbar-wrapper > ul > li > a,
html body:not(.night-mode) .main-wrapper .main-header .navbar-wrapper > ul > li > .dropdown-toggle,
html body:not(.night-mode) .main-wrapper .main-header .user-menu .title {
  color: var(--vf-modern-nav-text) !important;
}

html body:not(.night-mode) .main-wrapper .main-header .navbar-wrapper > ul > li > a,
html body:not(.night-mode) .main-wrapper .main-header .navbar-wrapper > ul > li > .dropdown-toggle,
html body:not(.night-mode) .main-wrapper .main-header .menu-icon,
html body:not(.night-mode) .main-wrapper .main-header .home-icon {
  border-color: var(--vf-header-aesthetic-border, rgba(255, 255, 255, 0.18)) !important;
  background: var(--vf-header-aesthetic-nav-bg, rgba(255, 255, 255, 0.08)) !important;
}

html body:not(.night-mode) .main-wrapper .main-header .navbar-wrapper > ul > li > a:hover,
html body:not(.night-mode) .main-wrapper .main-header .navbar-wrapper > ul > li.dropdown.show > a,
html body:not(.night-mode) .main-wrapper .main-header .navbar-wrapper > ul > li > .dropdown-toggle:hover,
html body:not(.night-mode) .main-wrapper .main-header .menu-icon:hover,
html body:not(.night-mode) .main-wrapper .main-header .home-icon:hover {
  background: rgba(255, 255, 255, 0.16) !important;
  border-color: rgba(105, 206, 224, 0.34) !important;
  color: #ffffff !important;
}

html body:not(.night-mode) .main-wrapper .main-header .header-icon,
html body:not(.night-mode) .main-wrapper .main-header .header-icon *,
html body:not(.night-mode) .main-wrapper .main-header .search-input-icon .header-icon,
html body:not(.night-mode) .main-wrapper .main-header .search-input-icon .header-icon * {
  color: #f7fbff !important;
  fill: #f7fbff !important;
  stroke: #f7fbff !important;
}

html body:not(.night-mode) .main-wrapper .main-header .counter {
  background: #2f6dff !important;
  color: #ffffff !important;
  box-shadow: 0 0 0 2px rgba(7, 20, 38, 0.58);
}

html body:not(.night-mode) .main-wrapper .main-header .search-wrapper .form-control,
html body:not(.night-mode) .main-wrapper .main-header .vf-header-search-input {
  border-color: rgba(255, 255, 255, 0.2) !important;
  background: rgba(255, 255, 255, 0.14) !important;
  color: #f8fbff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 10px 22px rgba(7, 20, 38, 0.14) !important;
}

html body:not(.night-mode) #modal .modal-header,
html body:not(.night-mode) .modal-header {
  background: var(--vf-modern-nav-bg-soft) !important;
  background-color: var(--header-bg-color, #12395a) !important;
  color: #f8fbff !important;
  border-bottom-color: var(--vf-modern-nav-border) !important;
}

html body:not(.night-mode) #modal .modal-header .modal-title,
html body:not(.night-mode) #modal .modal-header .btn-close,
html body:not(.night-mode) #modal .modal-header .nav-link,
html body:not(.night-mode) #modal .modal-header .text-link,
html body:not(.night-mode) .modal-header .modal-title,
html body:not(.night-mode) .modal-header .btn-close,
html body:not(.night-mode) .modal-header .nav-link,
html body:not(.night-mode) .modal-header .text-link {
  color: #f8fbff !important;
}

html body:not(.night-mode) .btn-primary,
html body:not(.night-mode) .btn-primary:focus,
html body:not(.night-mode) .btn-primary:hover,
html body:not(.night-mode) .main-wrapper .btn-primary,
html body:not(.night-mode) .main-wrapper .btn-primary:focus,
html body:not(.night-mode) .main-wrapper .btn-primary:hover {
  border-color: var(--vf-modern-primary-border) !important;
  background: var(--vf-modern-primary) !important;
  background-image: none !important;
  color: #ffffff !important;
  box-shadow: var(--vf-modern-primary-shadow) !important;
}

html body:not(.night-mode) .btn-primary:hover,
html body:not(.night-mode) .main-wrapper .btn-primary:hover {
  border-color: var(--vf-modern-primary-hover) !important;
  background: var(--vf-modern-primary-hover) !important;
  transform: translateY(-1px);
}

html body:not(.night-mode) .btn-outline-primary,
html body:not(.night-mode) .main-wrapper .btn-outline-primary {
  border-color: rgba(37, 99, 235, 0.38) !important;
  color: #1d4ed8 !important;
  background: rgba(37, 99, 235, 0.06) !important;
}

html body:not(.night-mode) .btn-outline-primary:hover,
html body:not(.night-mode) .main-wrapper .btn-outline-primary:hover {
  border-color: var(--vf-modern-primary-border) !important;
  color: #ffffff !important;
  background: var(--vf-modern-primary) !important;
}

html body:not(.night-mode) .footer-bottom-bar {
  background: var(--vf-modern-nav-bg) !important;
  background-color: var(--header-bg-color, #12395a) !important;
  border-top-color: rgba(255, 255, 255, 0.08) !important;
}

html body:not(.night-mode) .footer-bottom-bar-links .link.active > a,
html body:not(.night-mode) .footer-bottom-bar .footer-add-toggle {
  background: rgba(47, 109, 255, 0.88) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14) !important;
}

/* r124 Bootstrap modal header color parity */
html body:not(.night-mode) .modal .modal-header,
html body:not(.night-mode) .modal-dialog .modal-header,
html body:not(.night-mode) .modal-content > .modal-header,
html body:not(.night-mode) #modal .modal-header,
html body:not(.night-mode) #external-link-modal .modal-header,
html body:not(.night-mode) .modal-header.with-nav,
html body:not(.night-mode) .modal-header.bg-transparent,
html body:not(.night-mode) .vf-modal-confirm-header {
  background: var(--vf-modern-nav-bg) !important;
  background-color: var(--header-bg-color, #12395a) !important;
  color: var(--vf-modern-nav-text) !important;
  border-bottom: 1px solid var(--vf-modern-nav-border) !important;
}

html body:not(.night-mode) .modal .modal-header .modal-title,
html body:not(.night-mode) .modal .modal-header h1,
html body:not(.night-mode) .modal .modal-header h2,
html body:not(.night-mode) .modal .modal-header h3,
html body:not(.night-mode) .modal .modal-header h4,
html body:not(.night-mode) .modal .modal-header h5,
html body:not(.night-mode) .modal .modal-header h6,
html body:not(.night-mode) .modal .modal-header .nav-link,
html body:not(.night-mode) .modal .modal-header .text-link,
html body:not(.night-mode) .modal .modal-header a,
html body:not(.night-mode) #modal .modal-header .modal-title,
html body:not(.night-mode) #external-link-modal .modal-header .modal-title,
html body:not(.night-mode) .vf-modal-confirm-header .modal-title {
  color: var(--vf-modern-nav-text) !important;
}

html body:not(.night-mode) .modal .modal-header .btn-close,
html body:not(.night-mode) .modal .modal-header .close,
html body:not(.night-mode) #modal .modal-header .btn-close,
html body:not(.night-mode) #modal .modal-header .close,
html body:not(.night-mode) #external-link-modal .modal-header .btn-close,
html body:not(.night-mode) #external-link-modal .modal-header .close {
  color: var(--vf-modern-nav-text) !important;
  opacity: 0.92 !important;
  filter: invert(1) grayscale(1) brightness(1.8);
}

html body:not(.night-mode) .modal .modal-header .btn-close:hover,
html body:not(.night-mode) .modal .modal-header .close:hover,
html body:not(.night-mode) #modal .modal-header .btn-close:hover,
html body:not(.night-mode) #modal .modal-header .close:hover {
  opacity: 1 !important;
}

/* r125 night-mode surface parity */
html body.night-mode {
  --vf-night-page-bg: #0b1119;
  --vf-night-surface: #121b28;
  --vf-night-surface-soft: #172334;
  --vf-night-surface-raised: #192638;
  --vf-night-border: rgba(148, 163, 184, 0.22);
  --vf-night-border-strong: rgba(148, 163, 184, 0.34);
  --vf-night-text: #e5edf7;
  --vf-night-muted: #9fb0c6;
  --vf-night-primary: #4f8cff;
  --vf-night-primary-soft: rgba(79, 140, 255, 0.16);
}

html body.night-mode,
html body.night-mode .main-wrapper {
  background-color: var(--vf-night-page-bg) !important;
  color: var(--vf-night-text) !important;
}

html body.night-mode .main-wrapper .content-tabs,
html body.night-mode .main-wrapper .posts-filter,
html body.night-mode .main-wrapper .ui-box,
html body.night-mode .main-wrapper .card:not(.bg-transparent),
html body.night-mode .main-wrapper .post,
html body.night-mode .main-wrapper .composer-launcher,
html body.night-mode .main-wrapper .vf-messages-pwa-hero,
html body.night-mode .main-wrapper .vf-messages-install-gate,
html body.night-mode .main-wrapper .panel-messages,
html body.night-mode .main-wrapper .card-messages {
  border-color: var(--vf-night-border) !important;
  background: var(--vf-night-surface) !important;
  color: var(--vf-night-text) !important;
  box-shadow: 0 16px 34px rgba(0, 0, 0, 0.28) !important;
}

html body.night-mode .main-wrapper .content-tabs,
html body.night-mode .main-wrapper .card .card-header,
html body.night-mode .main-wrapper .ui-box .card-header,
html body.night-mode .main-wrapper .panel-messages .card-header {
  background: var(--vf-night-surface-soft) !important;
  border-color: var(--vf-night-border) !important;
  color: var(--vf-night-text) !important;
}

html body.night-mode .main-wrapper .content-tabs a,
html body.night-mode .main-wrapper .content-tabs .nav-link,
html body.night-mode .main-wrapper .card a:not(.btn),
html body.night-mode .main-wrapper .ui-box a:not(.btn) {
  color: var(--vf-night-text) !important;
}

html body.night-mode .main-wrapper .content-tabs a.active,
html body.night-mode .main-wrapper .content-tabs li.active a,
html body.night-mode .main-wrapper .content-tabs .active > a,
html body.night-mode .main-wrapper .side-nav li.active a,
html body.night-mode .main-wrapper .main-side-nav li.active a,
html body.night-mode .main-wrapper .vf-directory-shell .side-nav li.active a {
  background: var(--vf-night-primary-soft) !important;
  color: #dbeafe !important;
  border-color: rgba(79, 140, 255, 0.34) !important;
}

html body.night-mode .main-wrapper .text-muted,
html body.night-mode .main-wrapper small,
html body.night-mode .main-wrapper .sub-text,
html body.night-mode .main-wrapper .ui-box .text-muted {
  color: var(--vf-night-muted) !important;
}

html body.night-mode .main-wrapper .vf-page-card,
html body.night-mode .main-wrapper .vf-group-card,
html body.night-mode .main-wrapper article.ui-box,
html body.night-mode .main-wrapper .ui-box.vf-page-card,
html body.night-mode .main-wrapper .ui-box.vf-group-card {
  background: var(--vf-night-surface-raised) !important;
  border: 1px solid var(--vf-night-border) !important;
  color: var(--vf-night-text) !important;
}

html body.night-mode .main-wrapper .vf-page-card .vf-page-card-title,
html body.night-mode .main-wrapper .vf-group-card .vf-group-card-title,
html body.night-mode .main-wrapper .vf-page-card .vf-page-card-meta,
html body.night-mode .main-wrapper .vf-group-card .vf-group-card-meta {
  color: inherit !important;
}

html body.night-mode .main-wrapper .vf-page-card .text-muted,
html body.night-mode .main-wrapper .vf-group-card .text-muted,
html body.night-mode .main-wrapper article.ui-box .text-muted {
  color: var(--vf-night-muted) !important;
}

html body.night-mode .main-wrapper .vf-group-card-privacy {
  background: rgba(79, 140, 255, 0.16) !important;
  color: #dbeafe !important;
  border: 1px solid rgba(79, 140, 255, 0.28) !important;
}

html body.night-mode .main-wrapper .btn-primary,
html body.night-mode .main-wrapper .btn-success.btn-delete,
html body.night-mode .main-wrapper .js_unlike-page,
html body.night-mode .main-wrapper .js_leave-group {
  background: var(--vf-night-primary) !important;
  border-color: #6ea2ff !important;
  color: #ffffff !important;
  box-shadow: 0 12px 24px rgba(79, 140, 255, 0.18) !important;
}

html body.night-mode .main-wrapper .btn-light,
html body.night-mode .main-wrapper .btn-secondary,
html body.night-mode .main-wrapper .form-control,
html body.night-mode .main-wrapper .form-select,
html body.night-mode .main-wrapper textarea.form-control {
  background-color: var(--vf-night-surface-soft) !important;
  border-color: var(--vf-night-border) !important;
  color: var(--vf-night-text) !important;
}

html body.night-mode .main-wrapper .form-control::placeholder {
  color: #7f91aa !important;
}

html body.night-mode .dropdown-menu,
html body.night-mode .dropdown-widget,
html body.night-mode .action-dropdown-menu,
html body.night-mode .modal .modal-content,
html body.night-mode #modal .modal-content,
html body.night-mode #external-link-modal .modal-content {
  background: var(--vf-night-surface) !important;
  border-color: var(--vf-night-border) !important;
  color: var(--vf-night-text) !important;
}

html body.night-mode .dropdown-item,
html body.night-mode #modal .dropdown-item {
  color: var(--vf-night-text) !important;
}

html body.night-mode .dropdown-item:hover,
html body.night-mode .dropdown-item:focus,
html body.night-mode #modal .dropdown-item:hover,
html body.night-mode #modal .dropdown-item:focus {
  background: var(--vf-night-primary-soft) !important;
  color: #dbeafe !important;
}

html body.night-mode .main-wrapper .text-center.text-muted,
html body.night-mode .main-wrapper .vf-directory-shell .text-center.text-muted {
  background: rgba(18, 27, 40, 0.9) !important;
  border-color: var(--vf-night-border) !important;
  color: var(--vf-night-muted) !important;
}

/* r126 night-mode navigation and global menu parity */
html body.night-mode .main-wrapper .main-header,
html body.night-mode.modal-open .main-wrapper .main-header,
html body.night-mode.n_activated .main-wrapper .main-header,
html body.night-mode.n_live .main-wrapper .main-header {
  background: var(--vf-modern-nav-bg) !important;
  background-color: #0f2f4d !important;
  background-image: var(--vf-modern-nav-bg) !important;
  border-bottom: 1px solid rgba(105, 206, 224, 0.18) !important;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.34) !important;
  color: #f8fbff !important;
}

html body.night-mode .main-wrapper .main-header::before {
  background: linear-gradient(90deg, rgba(79, 140, 255, 0.75), rgba(33, 189, 211, 0.74)) !important;
}

html body.night-mode .main-wrapper .main-header .logo,
html body.night-mode .main-wrapper .main-header .logo:hover,
html body.night-mode .main-wrapper .main-header .user-menu .title,
html body.night-mode .main-wrapper .main-header .navbar-wrapper > ul > li > a,
html body.night-mode .main-wrapper .main-header .navbar-wrapper > ul > li > .dropdown-toggle {
  color: #f8fbff !important;
}

html body.night-mode .main-wrapper .main-header .navbar-wrapper > ul > li > a,
html body.night-mode .main-wrapper .main-header .navbar-wrapper > ul > li > .dropdown-toggle,
html body.night-mode .main-wrapper .main-header .menu-icon,
html body.night-mode .main-wrapper .main-header .home-icon {
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(255, 255, 255, 0.18) !important;
  color: #f8fbff !important;
}

html body.night-mode .main-wrapper .main-header .navbar-wrapper > ul > li > a:hover,
html body.night-mode .main-wrapper .main-header .navbar-wrapper > ul > li.dropdown.show > a,
html body.night-mode .main-wrapper .main-header .navbar-wrapper > ul > li > .dropdown-toggle:hover,
html body.night-mode .main-wrapper .main-header .menu-icon:hover,
html body.night-mode .main-wrapper .main-header .home-icon:hover {
  background: rgba(255, 255, 255, 0.16) !important;
  border-color: rgba(105, 206, 224, 0.34) !important;
  color: #ffffff !important;
}

html body.night-mode .main-wrapper .main-header .header-icon,
html body.night-mode .main-wrapper .main-header .header-icon *,
html body.night-mode .main-wrapper .main-header .search-input-icon .header-icon,
html body.night-mode .main-wrapper .main-header .search-input-icon .header-icon * {
  color: #f8fbff !important;
  fill: #f8fbff !important;
  stroke: #f8fbff !important;
}

html body.night-mode .main-wrapper .main-header .search-wrapper .form-control,
html body.night-mode .main-wrapper .main-header .vf-header-search-input {
  background: rgba(255, 255, 255, 0.12) !important;
  border-color: rgba(255, 255, 255, 0.22) !important;
  color: #f8fbff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.11), 0 10px 22px rgba(0, 0, 0, 0.14) !important;
}

html body.night-mode .main-wrapper .main-header .search-wrapper .form-control::placeholder,
html body.night-mode .main-wrapper .main-header .vf-header-search-input::placeholder {
  color: rgba(248, 251, 255, 0.72) !important;
}

html body.night-mode .dropdown-menu,
html body.night-mode .dropdown-widget,
html body.night-mode .dropdown-widget .dropdown-widget-header,
html body.night-mode .dropdown-widget .dropdown-widget-body,
html body.night-mode .dropdown-widget .dropdown-widget-footer,
html body.night-mode .dropdown-widget.dropdown-search {
  background: var(--vf-night-surface) !important;
  background-color: var(--vf-night-surface) !important;
  border-color: var(--vf-night-border) !important;
  color: var(--vf-night-text) !important;
}

html body.night-mode .dropdown-widget .dropdown-widget-header,
html body.night-mode .dropdown-widget .dropdown-widget-footer {
  background: var(--vf-night-surface-soft) !important;
}

html body.night-mode .dropdown-widget .title,
html body.night-mode .dropdown-widget .text,
html body.night-mode .dropdown-widget a:not(.btn),
html body.night-mode .dropdown-menu a:not(.btn),
html body.night-mode .dropdown-menu .dropdown-item {
  color: var(--vf-night-text) !important;
}

html body.night-mode .dropdown-widget .text-muted,
html body.night-mode .dropdown-menu .text-muted {
  color: var(--vf-night-muted) !important;
}

html body.night-mode .footer-bottom-bar {
  background: var(--vf-modern-nav-bg) !important;
  background-color: #0f2f4d !important;
  background-image: var(--vf-modern-nav-bg) !important;
  border-top-color: rgba(148, 163, 184, 0.18) !important;
  color: #e5edf7 !important;
}

html body.night-mode .footer-bottom-bar-links > .link > a,
html body.night-mode .footer-bottom-bar-links .link > a > .title,
html body.night-mode .footer-bottom-bar .footer-add-toggle,
html body.night-mode .footer-bottom-bar .user-menu,
html body.night-mode .footer-bottom-bar .user-menu .title {
  color: #e5edf7 !important;
}

html body.night-mode .footer-bottom-bar-links > .link > a svg,
html body.night-mode .footer-bottom-bar-links > .link > a i,
html body.night-mode .footer-bottom-bar .footer-add-toggle svg,
html body.night-mode .footer-bottom-bar .footer-add-toggle i {
  color: #e5edf7 !important;
  fill: #e5edf7 !important;
  stroke: #e5edf7 !important;
}

html body.night-mode .footer-bottom-bar-links > .link.active > a,
html body.night-mode .footer-bottom-bar .footer-add-toggle {
  background: rgba(79, 140, 255, 0.88) !important;
  color: #ffffff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14) !important;
}

/* r127 night-mode newsfeed final cascade cleanup */
html body.night-mode {
  --vf-night-nav-solid: #0b1624;
  --vf-night-nav-soft: #111f32;
  --vf-night-control: #1a273a;
  --vf-night-control-hover: #22324a;
}

html body.night-mode .main-wrapper .main-header,
html body.night-mode.vf-page-index .main-wrapper .main-header,
html body.night-mode.modal-open .main-wrapper .main-header,
html body.night-mode.n_activated .main-wrapper .main-header,
html body.night-mode.n_live .main-wrapper .main-header {
  background: var(--vf-night-nav-solid) !important;
  background-color: var(--vf-night-nav-solid) !important;
  background-image: none !important;
  border-bottom-color: rgba(148, 163, 184, 0.16) !important;
}

html body.night-mode .main-wrapper .main-header::before,
html body.night-mode.vf-page-index .main-wrapper .main-header::before {
  background: linear-gradient(90deg, rgba(79, 140, 255, 0.62), rgba(33, 189, 211, 0.58)) !important;
}

html body.night-mode .main-wrapper .main-header .search-wrapper .form-control,
html body.night-mode .main-wrapper .main-header .vf-header-search-input {
  background: var(--vf-night-control) !important;
  border-color: rgba(148, 163, 184, 0.28) !important;
  color: #f8fbff !important;
}

html body.night-mode .main-wrapper .main-header .navbar-wrapper > ul > li > a,
html body.night-mode .main-wrapper .main-header .navbar-wrapper > ul > li > .dropdown-toggle,
html body.night-mode .main-wrapper .main-header .menu-icon,
html body.night-mode .main-wrapper .main-header .home-icon {
  background: rgba(26, 39, 58, 0.82) !important;
  border-color: rgba(148, 163, 184, 0.22) !important;
}

html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .main-side-nav-card,
html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .main-side-nav-card .card-body,
html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-side-rail .card,
html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-sponsored-card,
html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-sponsored-card:not(.bg-transparent) .card-body {
  background: var(--vf-night-surface) !important;
  border-color: var(--vf-night-border) !important;
  color: var(--vf-night-text) !important;
}

html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .card .card-header,
html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-side-rail .card-header {
  background: var(--vf-night-surface-soft) !important;
  border-bottom-color: var(--vf-night-border) !important;
  color: var(--vf-night-text) !important;
}

html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .card .card-header strong,
html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .card .card-header h6,
html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-side-rail .card-header a,
html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-side-rail .card-header .float-end {
  color: var(--vf-night-text) !important;
}

html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .sidebar-section-block {
  border-bottom-color: var(--vf-night-border) !important;
}

html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .sidebar-section-title,
html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .sidebar-section-title span,
html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .sidebar-grid-item,
html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .sidebar-quick-item,
html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .sidebar-see-more {
  color: var(--vf-night-muted) !important;
}

html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .sidebar-grid-item:hover,
html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .sidebar-quick-item:hover,
html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .sidebar-see-more:hover {
  background: var(--vf-night-control-hover) !important;
  color: var(--vf-night-text) !important;
}

html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .sidebar-grid-item.is-active,
html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .main-side-nav > li.active > a {
  background: rgba(79, 140, 255, 0.18) !important;
  color: #dbeafe !important;
  box-shadow: inset 3px 0 0 #4f8cff !important;
}

html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-stories-card.vf-stories-card-empty .add-story,
html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-stories-card .story,
html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-stories-card .add-story {
  background: var(--vf-night-control) !important;
  border: 1px solid var(--vf-night-border) !important;
  color: var(--vf-night-text) !important;
}

html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-stories-card.vf-stories-card-empty .add-story::after,
html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-stories-card .add-story::after {
  color: var(--vf-night-text) !important;
}

html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-stories-card.vf-stories-card-empty .add-story::before,
html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-stories-card .add-story::before {
  color: var(--vf-night-muted) !important;
}

html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .composer-launcher,
html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .composer-launcher .card-body {
  background: var(--vf-night-surface) !important;
  border-color: var(--vf-night-border) !important;
  color: var(--vf-night-text) !important;
}

html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .composer-launcher-input {
  background: var(--vf-night-control) !important;
  border-color: var(--vf-night-border) !important;
  color: var(--vf-night-text) !important;
  box-shadow: none !important;
}

html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .composer-launcher-input .vf-composer-prompt,
html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .composer-launcher-input span {
  color: var(--vf-night-muted) !important;
}

html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions button,
html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter .btn,
html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter .countries-filter {
  background: var(--vf-night-control) !important;
  border-color: var(--vf-night-border) !important;
  color: var(--vf-night-text) !important;
  box-shadow: none !important;
}

html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions button:hover,
html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter .btn:hover,
html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter .countries-filter:hover {
  background: var(--vf-night-control-hover) !important;
  border-color: var(--vf-night-border-strong) !important;
  color: #ffffff !important;
}

html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions button i,
html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter .btn i,
html body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-posts-filter .countries-filter i {
  color: #7fb0ff !important;
}

/* r111 games dark-mode text contrast */
html body.night-mode.vf-page-games .main-wrapper .vf-sidebar-module-shell .card,
html body.night-mode.vf-page-games .main-wrapper .vf-sidebar-module-shell .game-card {
  background: var(--vf-night-surface, #101b2b) !important;
  border-color: var(--vf-night-border, rgba(137, 160, 190, 0.28)) !important;
  color: var(--vf-night-text, #e5edf7) !important;
}

html body.night-mode.vf-page-games .main-wrapper .vf-sidebar-module-shell .card-header,
html body.night-mode.vf-page-games .main-wrapper .vf-sidebar-module-shell .card .card-header {
  background: var(--vf-night-surface-strong, #152235) !important;
  border-color: var(--vf-night-border, rgba(137, 160, 190, 0.28)) !important;
  color: var(--vf-night-text, #e5edf7) !important;
}

html body.night-mode.vf-page-games .main-wrapper .vf-sidebar-module-shell .card h4,
html body.night-mode.vf-page-games .main-wrapper .vf-sidebar-module-shell .card h5,
html body.night-mode.vf-page-games .main-wrapper .vf-sidebar-module-shell .card h6,
html body.night-mode.vf-page-games .main-wrapper .vf-sidebar-module-shell .game-card h6,
html body.night-mode.vf-page-games .main-wrapper #featuredGamesCarousel h2,
html body.night-mode.vf-page-games .main-wrapper #featuredGamesCarousel p,
html body.night-mode.vf-page-games .main-wrapper #featuredGamesCarousel .ml-2,
html body.night-mode.vf-page-games .main-wrapper #featuredGamesCarousel [style*="color: #000"],
html body.night-mode.vf-page-games .main-wrapper #featuredGamesCarousel [style*="color:#000"],
html body.night-mode.vf-page-games .main-wrapper .game-card [style*="color: #64748b"],
html body.night-mode.vf-page-games .main-wrapper .game-card [style*="color:#64748b"],
html body.night-mode.vf-page-games .main-wrapper .data-content,
html body.night-mode.vf-page-games .main-wrapper .data-content a,
html body.night-mode.vf-page-games .main-wrapper .data-content .name,
html body.night-mode.vf-page-games .main-wrapper .data-content .name a {
  color: var(--vf-night-text, #e5edf7) !important;
}

html body.night-mode.vf-page-games .main-wrapper .vf-sidebar-module-shell .text,
html body.night-mode.vf-page-games .main-wrapper .vf-sidebar-module-shell .text-muted,
html body.night-mode.vf-page-games .main-wrapper .vf-sidebar-module-shell .js_directory-filter-empty,
html body.night-mode.vf-page-games .main-wrapper #featuredGamesCarousel p {
  color: var(--vf-night-muted, #a9bad0) !important;
}

html body.night-mode.vf-page-games .main-wrapper .vf-sidebar-module-shell .card-body.with-nav .badge,
html body.night-mode.vf-page-games .main-wrapper .vf-sidebar-module-shell .game-card [style*="background: rgba(17, 142, 213, 0.1)"],
html body.night-mode.vf-page-games .main-wrapper #featuredGamesCarousel .mb-3 .badge {
  background: rgba(79, 140, 255, 0.2) !important;
  border: 1px solid rgba(127, 176, 255, 0.28) !important;
  color: #cfe0ff !important;
}

html body.night-mode.vf-page-games .main-wrapper .vf-sidebar-module-shell .side-nav li a,
html body.night-mode.vf-page-games .main-wrapper .vf-sidebar-module-shell .side-nav li a span:not(.badge) {
  color: var(--vf-night-muted, #a9bad0) !important;
}

html body.night-mode.vf-page-games .main-wrapper .vf-sidebar-module-shell .side-nav li.active a,
html body.night-mode.vf-page-games .main-wrapper .vf-sidebar-module-shell .side-nav li a:hover,
html body.night-mode.vf-page-games .main-wrapper .vf-sidebar-module-shell .side-nav li.active a span:not(.badge),
html body.night-mode.vf-page-games .main-wrapper .vf-sidebar-module-shell .side-nav li a:hover span:not(.badge) {
  color: var(--vf-night-text, #e5edf7) !important;
}

html body.night-mode.vf-page-games .main-wrapper .js_admin-feature-game,
html body.night-mode.vf-page-games .main-wrapper .js_admin-feature-game .js_feature_text {
  color: #111827 !important;
}

html body.night-mode.vf-page-games .main-wrapper .js_admin-feature-game[data-featured="1"],
html body.night-mode.vf-page-games .main-wrapper .js_admin-feature-game[data-featured="1"] .js_feature_text {
  color: #ffffff !important;
}

/* r112 mobile footer selected-state glass cleanup */
@media (max-width: 767.98px) {
  html body .footer-bottom-bar-links > .link > a,
  html body .footer-bottom-bar-links .link > a,
  html.app-standalone body .footer-bottom-bar-links > .link > a,
  html body .footer-bottom-bar .footer-add-toggle {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
    color: rgba(255, 255, 255, 0.78) !important;
  }

  html body .footer-bottom-bar-links .link.active > a,
  html body .footer-bottom-bar-links .link.show > a,
  html body .footer-bottom-bar .footer-add-link.show .footer-add-toggle {
    background: rgba(255, 255, 255, 0.14) !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.12),
      0 10px 24px rgba(2, 8, 23, 0.18) !important;
    color: #ffffff !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
  }

  html body .footer-bottom-bar-links .link > a:hover {
    background: rgba(255, 255, 255, 0.08) !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
    box-shadow: none !important;
  }

  html body .footer-bottom-bar .footer-add-toggle .title,
  html body .footer-bottom-bar .footer-add-toggle .header-icon,
  html body .footer-bottom-bar .footer-add-toggle .header-icon *,
  html body .footer-bottom-bar-links .link > a .title,
  html body .footer-bottom-bar-links .link > a .header-icon,
  html body .footer-bottom-bar-links .link > a .header-icon * {
    color: rgba(255, 255, 255, 0.78) !important;
    fill: rgba(255, 255, 255, 0.78) !important;
  }

  html body .footer-bottom-bar-links .link.active > a .title,
  html body .footer-bottom-bar-links .link.active > a .header-icon,
  html body .footer-bottom-bar-links .link.active > a .header-icon *,
  html body .footer-bottom-bar-links .link.show > a .title,
  html body .footer-bottom-bar-links .link.show > a .header-icon,
  html body .footer-bottom-bar-links .link.show > a .header-icon *,
  html body .footer-bottom-bar .footer-add-link.show .footer-add-toggle .title,
  html body .footer-bottom-bar .footer-add-link.show .footer-add-toggle .header-icon,
  html body .footer-bottom-bar .footer-add-link.show .footer-add-toggle .header-icon * {
    color: #ffffff !important;
    fill: #ffffff !important;
  }
}

/* Launch polish: readable mobile hero headers for profiles/pages/groups/events */
@media (max-width: 767.98px) {
  html body .main-wrapper .sg-offcanvas-mainbar > .profile-header {
    height: auto !important;
    min-height: 0 !important;
    margin: 12px 0 8px !important;
    padding: 0 0 12px !important;
    overflow: visible !important;
    border-radius: 18px !important;
    border: 1px solid rgba(74, 113, 143, 0.22) !important;
    background: #15384f !important;
    box-shadow: 0 14px 30px rgba(15, 38, 54, 0.14) !important;
  }

  html body .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-cover-wrapper {
    height: clamp(170px, 44vw, 220px) !important;
    min-height: clamp(170px, 44vw, 220px) !important;
    border-radius: 18px 18px 0 0 !important;
    overflow: hidden !important;
    background: #102d43 !important;
  }

  html body .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-cover-wrapper::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(8, 24, 38, 0.08), rgba(8, 24, 38, 0.42));
  }

  html body .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-cover-wrapper img.js_position-cover-cropped,
  html body .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-cover-wrapper img.js_position-cover-full {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }

  html body .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-avatar-wrapper:not(.static),
  html body .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-avatar-wrapper {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    z-index: 4 !important;
    width: 96px !important;
    height: 96px !important;
    min-width: 96px !important;
    min-height: 96px !important;
    margin: -50px auto 0 !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    box-shadow: 0 12px 24px rgba(7, 16, 33, 0.22) !important;
    transform: none !important;
  }

  html body .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-avatar-wrapper > img {
    width: 88px !important;
    height: 88px !important;
    min-width: 88px !important;
    min-height: 88px !important;
    border-radius: 50% !important;
    object-fit: cover !important;
  }

  html body .main-wrapper .sg-offcanvas-mainbar > .profile-header.no-avatar .profle-date-wrapper {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    z-index: 4 !important;
    margin: -44px auto 0 !important;
  }

  html body .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-name-wrapper {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    z-index: 3 !important;
    width: auto !important;
    min-height: 0 !important;
    margin: 10px 12px 0 !important;
    padding: 14px 12px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    border-radius: 16px !important;
    border: 1px solid rgba(255, 255, 255, 0.16) !important;
    background: rgba(10, 31, 49, 0.94) !important;
    color: #f8fbff !important;
    text-align: center !important;
    box-shadow: none !important;
    transform: none !important;
  }

  html body .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-name-wrapper > a:first-of-type {
    max-width: 100% !important;
    margin: 0 !important;
    color: #ffffff !important;
    font-size: 1.48rem !important;
    line-height: 1.12 !important;
    text-align: center !important;
    overflow-wrap: anywhere;
    text-shadow: none !important;
  }

  html body .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-presence-badge {
    order: 2 !important;
    margin: 0 !important;
  }

  html body .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-meta,
  html body .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-identity,
  html body .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-social {
    width: 100% !important;
    margin: 0 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
  }

  html body .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-meta-item,
  html body .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-meta-link,
  html body .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-pronouns,
  html body .main-wrapper .sg-offcanvas-mainbar > .profile-header .profle-meta-wrapper {
    max-width: 100% !important;
    min-height: 28px !important;
    padding: 5px 9px !important;
    border-radius: 999px !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    background: rgba(255, 255, 255, 0.08) !important;
    color: #f8fbff !important;
    font-size: 0.82rem !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    text-decoration: none !important;
    text-shadow: none !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  html body .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-meta-item i,
  html body .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-pronouns i,
  html body .main-wrapper .sg-offcanvas-mainbar > .profile-header .profle-meta-wrapper i {
    color: #d8ecff !important;
  }

  html body .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-stats {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    z-index: 3 !important;
    width: auto !important;
    margin: 10px 12px 0 !important;
    padding: 8px 10px !important;
    border-radius: 14px !important;
  }

  html body .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-buttons-wrapper {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    z-index: 3 !important;
    width: auto !important;
    margin: 10px 12px 0 !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    justify-content: center !important;
    gap: 7px !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    scrollbar-width: none !important;
  }

  html body .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-buttons-wrapper::-webkit-scrollbar {
    display: none !important;
  }

  html body .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-buttons-wrapper .btn {
    flex: 0 0 auto !important;
    min-height: 36px !important;
    padding: 8px 12px !important;
    border-radius: 999px !important;
    white-space: nowrap !important;
  }

  html body .main-wrapper .sg-offcanvas-mainbar > .profile-tabs-wrapper,
  html body .main-wrapper .vf-profile-shell .profile-tabs-wrapper {
    margin: 10px 0 14px !important;
    padding: 4px !important;
    border-radius: 14px !important;
    border: 1px solid rgba(74, 113, 143, 0.18) !important;
    background: rgba(255, 255, 255, 0.96) !important;
    box-shadow: 0 10px 20px rgba(15, 38, 54, 0.08) !important;
    display: flex !important;
    justify-content: flex-start !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-snap-type: x proximity;
    scrollbar-width: none !important;
  }

  html body .main-wrapper .sg-offcanvas-mainbar > .profile-tabs-wrapper::-webkit-scrollbar,
  html body .main-wrapper .vf-profile-shell .profile-tabs-wrapper::-webkit-scrollbar {
    display: none !important;
  }

  html body .main-wrapper .sg-offcanvas-mainbar > .profile-tabs-wrapper > a,
  html body .main-wrapper .vf-profile-shell .profile-tabs-wrapper > a {
    flex: 0 0 auto !important;
    min-width: 92px !important;
    min-height: 40px !important;
    padding: 9px 10px !important;
    border-radius: 10px !important;
    color: #24445b !important;
    font-size: 0.78rem !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
    text-align: center !important;
    scroll-snap-align: start;
  }

  html body .main-wrapper .sg-offcanvas-mainbar > .profile-tabs-wrapper > a.active,
  html body .main-wrapper .vf-profile-shell .profile-tabs-wrapper > a.active {
    background: rgba(38, 96, 145, 0.12) !important;
    color: #102d43 !important;
  }

  body.night-mode .main-wrapper .sg-offcanvas-mainbar > .profile-header,
  body.night-mode .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-name-wrapper {
    background: rgba(12, 24, 38, 0.96) !important;
    border-color: rgba(118, 151, 178, 0.22) !important;
  }

  body.night-mode .main-wrapper .sg-offcanvas-mainbar > .profile-tabs-wrapper,
  body.night-mode .main-wrapper .vf-profile-shell .profile-tabs-wrapper {
    background: rgba(17, 30, 45, 0.96) !important;
    border-color: rgba(118, 151, 178, 0.22) !important;
  }

  body.night-mode .main-wrapper .sg-offcanvas-mainbar > .profile-tabs-wrapper > a,
  body.night-mode .main-wrapper .vf-profile-shell .profile-tabs-wrapper > a {
    color: #d8ecff !important;
  }
}

/* Launch polish follow-up: mobile profile hero spacing and social contrast */
@media (max-width: 767.98px) {
  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header {
    padding-bottom: 16px !important;
    background: #12364d !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-cover-wrapper {
    height: clamp(190px, 47vw, 225px) !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-name-wrapper {
    margin: 12px 12px 0 !important;
    padding: 14px 14px 12px !important;
    gap: 9px !important;
    border-radius: 14px !important;
    background: rgba(8, 28, 45, 0.9) !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-name-wrapper > a:first-of-type {
    font-size: 1.36rem !important;
    line-height: 1.08 !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .verified-badge,
  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .verified-badge .svg-container {
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    min-height: 28px !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .verified-badge svg {
    width: 28px !important;
    height: 28px !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-meta,
  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-identity {
    gap: 6px !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-meta-item,
  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-meta-link,
  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-pronouns {
    min-height: 26px !important;
    padding: 4px 9px !important;
    font-size: 0.78rem !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-social {
    margin-top: 2px !important;
    gap: 8px !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-social-link {
    width: 30px !important;
    height: 30px !important;
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.1) !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-social-link i,
  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-social-link svg,
  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-social-link * {
    color: #ffffff !important;
    fill: #ffffff !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-stats {
    margin: 11px 12px 0 !important;
    background: rgba(8, 28, 45, 0.82) !important;
  }

  html body.vf-page-profile .chat-sidebar,
  html body.vf-page-profile .vf-messages-floating-install,
  html body.vf-page-profile .vf-floating-actions {
    top: auto !important;
    right: 10px !important;
    bottom: max(86px, calc(78px + env(safe-area-inset-bottom, 0px))) !important;
    transform: none !important;
  }

  html body.vf-page-profile .profile-header ~ .chat-sidebar,
  html body.vf-page-profile .profile-header ~ .vf-messages-floating-install,
  html body.vf-page-profile .profile-header ~ .vf-floating-actions {
    display: none !important;
  }
}

/* Launch polish follow-up 2: remove empty mobile profile action strip */
@media (max-width: 767.98px) {
  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header {
    padding-bottom: 14px !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-name-wrapper {
    padding: 17px 15px 15px !important;
    gap: 10px !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-meta,
  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-identity {
    gap: 8px !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-social {
    margin-top: 5px !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-buttons-wrapper:has(> button[data-url*="events/import_ics.php"]):has(> a[href$="/settings/profile"]) {
    display: none !important;
    margin: 0 !important;
    padding: 0 !important;
    min-height: 0 !important;
  }

  html body.vf-page-profile .chat-sidebar,
  html body.vf-page-profile .chat-sidebar-shell,
  html body.vf-page-profile .chat-sidebar-footer,
  html body.vf-page-profile .vf-messages-floating-install,
  html body.vf-page-profile .vf-floating-actions {
    display: none !important;
  }
}

/* Launch polish follow-up 3: replace crowded dark mobile profile hero with clean card */
@media (max-width: 767.98px) {
  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header {
    margin: 12px 12px 10px !important;
    padding: 0 0 14px !important;
    border: 1px solid rgba(69, 99, 126, 0.16) !important;
    border-radius: 18px !important;
    background: #ffffff !important;
    box-shadow: 0 14px 28px rgba(15, 38, 54, 0.12) !important;
    overflow: hidden !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-cover-wrapper {
    height: 190px !important;
    min-height: 190px !important;
    border-radius: 18px 18px 0 0 !important;
    background: #15384f !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-cover-wrapper::after {
    background: linear-gradient(180deg, rgba(6, 20, 34, 0.04), rgba(6, 20, 34, 0.22)) !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-avatar-wrapper:not(.static),
  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-avatar-wrapper {
    width: 98px !important;
    height: 98px !important;
    min-width: 98px !important;
    min-height: 98px !important;
    margin: -52px auto 0 !important;
    background: #ffffff !important;
    border: 4px solid #ffffff !important;
    box-shadow: 0 8px 18px rgba(15, 38, 54, 0.18) !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-avatar-wrapper > img {
    width: 90px !important;
    height: 90px !important;
    min-width: 90px !important;
    min-height: 90px !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-name-wrapper {
    margin: 8px 14px 0 !important;
    padding: 0 !important;
    gap: 8px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #13293a !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-name-wrapper > a:first-of-type {
    color: #13293a !important;
    font-size: 1.48rem !important;
    font-weight: 850 !important;
    line-height: 1.1 !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .verified-badge,
  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .verified-badge .svg-container,
  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .verified-badge svg {
    width: 24px !important;
    height: 24px !important;
    min-width: 24px !important;
    min-height: 24px !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-meta,
  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-identity {
    gap: 6px !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-meta-item,
  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-meta-link,
  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-pronouns {
    min-height: 27px !important;
    padding: 5px 9px !important;
    border: 1px solid rgba(69, 99, 126, 0.16) !important;
    border-radius: 999px !important;
    background: #eef4f8 !important;
    color: #24445b !important;
    font-size: 0.78rem !important;
    font-weight: 800 !important;
    box-shadow: none !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-meta-item i,
  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-pronouns i {
    color: #31546b !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-name-flag {
    box-shadow: none !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-social {
    margin-top: 4px !important;
    gap: 9px !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-social-link {
    width: 31px !important;
    height: 31px !important;
    border-color: rgba(69, 99, 126, 0.2) !important;
    background: #46596a !important;
    color: #ffffff !important;
    box-shadow: none !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-social-link i,
  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-social-link svg,
  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-social-link * {
    color: #ffffff !important;
    fill: #ffffff !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-stats {
    margin: 12px 14px 0 !important;
    padding: 10px 8px !important;
    border: 1px solid rgba(69, 99, 126, 0.16) !important;
    border-radius: 14px !important;
    background: #f7fafc !important;
    box-shadow: none !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-stat,
  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-stat-link {
    color: #13293a !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-stat .stat-value {
    color: #13293a !important;
    font-size: 1rem !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-stat .stat-label {
    color: #5c7488 !important;
    font-size: 0.62rem !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-stats-grid .profile-header-stat:not(:last-child) {
    border-right-color: rgba(69, 99, 126, 0.16) !important;
  }

  html body.vf-page-profile .main-wrapper .vf-profile-shell .profile-tabs-wrapper {
    margin: 12px 12px 16px !important;
  }

  body.night-mode.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header {
    background: #111e2d !important;
    border-color: rgba(118, 151, 178, 0.22) !important;
  }

  body.night-mode.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-name-wrapper,
  body.night-mode.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-name-wrapper > a:first-of-type {
    color: #f8fbff !important;
  }

  body.night-mode.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-meta-item,
  body.night-mode.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-meta-link,
  body.night-mode.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-pronouns,
  body.night-mode.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-stats {
    background: #172a3d !important;
    border-color: rgba(118, 151, 178, 0.2) !important;
    color: #d8ecff !important;
  }
}

/* Launch polish follow-up 4: mobile profile chip rows and even stats */
@media (max-width: 767.98px) {
  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-name-wrapper {
    align-items: center !important;
    justify-content: center !important;
    column-gap: 5px !important;
    row-gap: 8px !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-name-wrapper > a:first-of-type {
    flex: 0 1 auto !important;
    max-width: calc(100% - 34px) !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .verified-badge {
    align-self: center !important;
    margin-left: 0 !important;
    transform: none !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-meta {
    flex-basis: 100% !important;
    justify-content: center !important;
    margin-top: 2px !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-identity {
    flex-basis: 100% !important;
    justify-content: center !important;
    margin-top: 0 !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-identity .profile-name-flag {
    margin: 0 3px !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-social {
    flex-basis: 100% !important;
    justify-content: center !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-stats {
    width: calc(100% - 28px) !important;
    margin: 12px 14px 0 !important;
    box-sizing: border-box !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-stats-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    width: 100% !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-stat,
  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-stat-link {
    min-width: 0 !important;
    width: 100% !important;
  }
}

/* Launch polish follow-up 5: lock verified badge to profile name and center social icons */
.vf-profile-shell .profile-header-title-row {
  order: 0;
  flex-basis: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: nowrap;
  gap: 6px;
  min-width: 0;
}

.vf-profile-shell .profile-header-title-row > a:first-child {
  min-width: 0;
  font-size: clamp(1.3rem, 1.8vw, 1.75rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.1;
  color: #0f172a;
  text-decoration: none !important;
}

.vf-profile-shell .profile-header-title-row .verified-badge,
.vf-profile-shell .profile-header-title-row .verified-badge .svg-container,
.vf-profile-shell .profile-header-title-row .verified-badge svg {
  flex: 0 0 auto;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  transform: none !important;
  line-height: 1 !important;
}

.vf-profile-shell .profile-header-social-link {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  line-height: 1 !important;
  text-align: center !important;
}

.vf-profile-shell .profile-header-social-link i,
.vf-profile-shell .profile-header-social-link svg {
  display: block !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
  line-height: 1 !important;
  text-align: center !important;
}

.vf-profile-shell .profile-header-social-link i::before {
  display: block !important;
  line-height: 1 !important;
}

body.night-mode .vf-profile-shell .profile-header-title-row > a:first-child {
  color: #f8fbff !important;
}

@media (max-width: 767.98px) {
  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-title-row {
    justify-content: center !important;
    flex-basis: 100% !important;
    max-width: 100% !important;
    order: 0 !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-title-row > a:first-child {
    flex: 0 1 auto !important;
    max-width: calc(100% - 34px) !important;
    color: #13293a !important;
    font-size: 1.48rem !important;
    font-weight: 850 !important;
    text-align: center !important;
    overflow-wrap: anywhere !important;
  }

  body.night-mode.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-title-row > a:first-child {
    color: #f8fbff !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-title-row .verified-badge,
  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-title-row .verified-badge .svg-container,
  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-title-row .verified-badge svg {
    width: 24px !important;
    height: 24px !important;
    min-width: 24px !important;
    min-height: 24px !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-social-link {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
  }
}

/* Launch polish follow-up 6: keep mobile profile title on one line */
@media (max-width: 767.98px) {
  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-title-row {
    width: 100% !important;
    gap: 6px !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-title-row > a:first-child {
    flex: 0 1 auto !important;
    width: auto !important;
    max-width: calc(100% - 34px) !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
  }

  html body.vf-page-profile .main-wrapper .sg-offcanvas-mainbar > .profile-header .profile-header-title-row .verified-badge {
    flex: 0 0 24px !important;
  }
}

/* Launch polish: semantic accent color without changing the core layout */
body.vf-page-index .main-wrapper .vf-newsfeed-shell {
  --vf-punch-coral: #ff6b4a;
  --vf-punch-coral-soft: rgba(255, 107, 74, 0.12);
  --vf-punch-amber: #f59e0b;
  --vf-punch-amber-soft: rgba(245, 158, 11, 0.14);
  --vf-punch-teal: #12b8a6;
  --vf-punch-teal-soft: rgba(18, 184, 166, 0.12);
  --vf-punch-cyan: #13a8d8;
  --vf-punch-cyan-soft: rgba(19, 168, 216, 0.12);
  --vf-punch-violet: #7c5cff;
  --vf-punch-violet-soft: rgba(124, 92, 255, 0.12);
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .composer-launcher {
  position: relative;
  overflow: hidden;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .composer-launcher::before {
  background: linear-gradient(90deg, #5b5fff 0%, #13a8d8 48%, #12b8a6 100%) !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .composer-launcher .vf-composer-prompt-icon {
  color: var(--vf-punch-amber) !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions button {
  transition: transform .18s ease, background-color .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions button:hover {
  transform: translateY(-1px);
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-action-photo {
  --vf-composer-action-color: #2f6dff;
  --vf-composer-action-soft: rgba(47, 109, 255, .1);
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-action-video {
  --vf-composer-action-color: #5b5fff;
  --vf-composer-action-soft: rgba(91, 95, 255, .11);
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-action-story {
  --vf-composer-action-color: var(--vf-punch-teal);
  --vf-composer-action-soft: var(--vf-punch-teal-soft);
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-action-reel {
  --vf-composer-action-color: var(--vf-punch-violet);
  --vf-composer-action-soft: var(--vf-punch-violet-soft);
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-action-mood {
  --vf-composer-action-color: var(--vf-punch-amber);
  --vf-composer-action-soft: var(--vf-punch-amber-soft);
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions .vf-composer-action-photo,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions .vf-composer-action-video,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions .vf-composer-action-story,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions .vf-composer-action-reel,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions .vf-composer-action-mood {
  border-color: color-mix(in srgb, var(--vf-composer-action-color) 22%, transparent) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.96), var(--vf-composer-action-soft)) !important;
  color: #253247 !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions .vf-composer-action-photo i,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions .vf-composer-action-video i,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions .vf-composer-action-story i,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions .vf-composer-action-reel i,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions .vf-composer-action-mood i {
  color: var(--vf-composer-action-color) !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions .vf-composer-action-photo:hover,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions .vf-composer-action-video:hover,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions .vf-composer-action-story:hover,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions .vf-composer-action-reel:hover,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions .vf-composer-action-mood:hover {
  border-color: color-mix(in srgb, var(--vf-composer-action-color) 42%, transparent) !important;
  box-shadow: 0 10px 22px color-mix(in srgb, var(--vf-composer-action-color) 16%, transparent);
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-actions .action-btn {
  transition: transform .18s ease, background-color .18s ease, color .18s ease, border-color .18s ease, box-shadow .18s ease;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-actions .vf-action-spark {
  --vf-action-color: var(--vf-punch-amber);
  --vf-action-soft: var(--vf-punch-amber-soft);
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-actions .vf-action-heat {
  --vf-action-color: var(--vf-punch-coral);
  --vf-action-soft: var(--vf-punch-coral-soft);
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-actions .vf-action-share {
  --vf-action-color: #2f6dff;
  --vf-action-soft: rgba(47, 109, 255, .12);
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-actions .vf-action-review {
  --vf-action-color: var(--vf-punch-violet);
  --vf-action-soft: var(--vf-punch-violet-soft);
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-actions .vf-action-tip {
  --vf-action-color: var(--vf-punch-teal);
  --vf-action-soft: var(--vf-punch-teal-soft);
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-actions .vf-action-spark:hover,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-actions .vf-action-heat:hover,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-actions .vf-action-share:hover,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-actions .vf-action-review:hover,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-actions .vf-action-tip:hover {
  border-color: color-mix(in srgb, var(--vf-action-color) 24%, transparent) !important;
  background: var(--vf-action-soft) !important;
  color: var(--vf-action-color) !important;
  box-shadow: 0 8px 18px color-mix(in srgb, var(--vf-action-color) 14%, transparent);
  transform: translateY(-1px);
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-actions .vf-action-spark:hover i,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-actions .vf-action-heat:hover i,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-actions .vf-action-share:hover i,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-actions .vf-action-review:hover i,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-actions .vf-action-tip:hover i,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-actions .vf-action-spark:hover svg,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-actions .vf-action-heat:hover svg,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-actions .vf-action-share:hover svg,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-actions .vf-action-review:hover svg,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-actions .vf-action-tip:hover svg,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-actions .vf-action-spark:hover svg *,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-actions .vf-action-heat:hover svg *,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-actions .vf-action-share:hover svg *,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-actions .vf-action-review:hover svg *,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .post .post-actions .vf-action-tip:hover svg * {
  color: var(--vf-action-color) !important;
  fill: var(--vf-action-color) !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-post-type-chip-row {
  display: flex;
  margin: 0 0 8px;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-post-type-chip {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 4px 10px;
  border: 1px solid rgba(47,109,255,.16);
  border-radius: 999px;
  background: rgba(47,109,255,.08);
  color: #2457d6;
  font-size: .7rem;
  font-weight: 900;
  letter-spacing: .04em;
  line-height: 1;
  text-transform: uppercase;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-post-type-blog,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-post-type-course {
  border-color: rgba(124,92,255,.2);
  background: var(--vf-punch-violet-soft);
  color: #6247d8;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-post-type-product,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-post-type-offer,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-post-type-funding {
  border-color: rgba(18,184,166,.22);
  background: var(--vf-punch-teal-soft);
  color: #0d8175;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-post-type-event,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-post-type-poll {
  border-color: rgba(245,158,11,.24);
  background: var(--vf-punch-amber-soft);
  color: #9a6200;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-post-type-reel,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-post-type-video,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-post-type-audio {
  border-color: rgba(19,168,216,.22);
  background: var(--vf-punch-cyan-soft);
  color: #08779d;
}

body:not(.night-mode).vf-page-index .main-wrapper .main-side-nav > li.active > a,
body:not(.night-mode).vf-page-index .main-wrapper .side-nav > li.active > a,
body:not(.night-mode).vf-page-index .main-wrapper .sidebar-layout-modern .sidebar-grid-item.is-active {
  background: linear-gradient(90deg, rgba(91,95,255,.16), rgba(19,168,216,.1)) !important;
  color: #233b8f !important;
  box-shadow: inset 0 0 0 1px rgba(91,95,255,.12), 0 8px 18px rgba(47,109,255,.08);
}

body:not(.night-mode).vf-page-index .main-wrapper .main-side-nav > li.active > a::before,
body:not(.night-mode).vf-page-index .main-wrapper .side-nav > li.active > a::before,
body:not(.night-mode).vf-page-index .main-wrapper .sidebar-layout-modern .sidebar-grid-item.is-active::before {
  background: linear-gradient(180deg, #5b5fff, #13a8d8) !important;
}

body.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-side-card .card-header,
body.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-sponsored-card .card-header,
body.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-blog-carousel-card .card-header {
  position: relative;
}

body.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-side-card .card-header::before,
body.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-sponsored-card .card-header::before,
body.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-blog-carousel-card .card-header::before {
  content: "";
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: -1px;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(91,95,255,.7), rgba(19,168,216,.62), rgba(255,107,74,.5));
}

body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions .vf-composer-action-photo,
body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions .vf-composer-action-video,
body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions .vf-composer-action-story,
body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions .vf-composer-action-reel,
body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions .vf-composer-action-mood {
  background: rgba(15, 23, 42, .4) !important;
  color: #e7eef8 !important;
}

body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-post-type-chip {
  border-color: rgba(148,163,184,.22);
  background: rgba(31,45,64,.72);
  color: #dce8f8;
}

/* Launch polish: Facebook-style desktop feed proportions */
@media (min-width: 1200px) {
  body.vf-page-index .main-wrapper > .vf-newsfeed-shell,
  body.vf-page-index .main-wrapper > .container.vf-newsfeed-shell,
  body.vf-page-index .main-wrapper > .container-fluid.vf-newsfeed-shell {
    --vf-fb-left-rail-width: 320px;
    --vf-fb-feed-width: 680px;
    --vf-fb-right-rail-width: 320px;
    --vf-fb-column-gap: 24px;
    width: min(100% - 32px, 1416px) !important;
    max-width: 1416px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell > .row {
    display: grid !important;
    grid-template-columns: var(--vf-fb-left-rail-width) minmax(0, calc(var(--vf-fb-feed-width) + var(--vf-fb-column-gap) + var(--vf-fb-right-rail-width)));
    gap: var(--vf-fb-column-gap) !important;
    align-items: start;
    justify-content: center;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell > .row > .sg-offcanvas-sidebar,
  body.vf-page-index .main-wrapper .vf-newsfeed-shell > .row > .sg-offcanvas-mainbar {
    flex: none !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .sg-offcanvas-mainbar > .row {
    display: grid !important;
    grid-template-columns: minmax(500px, var(--vf-fb-feed-width)) var(--vf-fb-right-rail-width) !important;
    gap: var(--vf-fb-column-gap) !important;
    align-items: start;
    justify-content: center;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .sg-offcanvas-mainbar > .row > .col-12.col-xl-9,
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .sg-offcanvas-mainbar > .row > .vf-side-rail {
    flex: none !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .sg-offcanvas-mainbar > .row > .col-12.col-xl-9 {
    max-width: var(--vf-fb-feed-width) !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-side-rail {
    display: block !important;
    width: var(--vf-fb-right-rail-width) !important;
    max-width: var(--vf-fb-right-rail-width) !important;
    min-width: var(--vf-fb-right-rail-width) !important;
  }
}

@media (min-width: 1200px) and (max-width: 1329.98px) {
  body.vf-page-index .main-wrapper > .vf-newsfeed-shell,
  body.vf-page-index .main-wrapper > .container.vf-newsfeed-shell,
  body.vf-page-index .main-wrapper > .container-fluid.vf-newsfeed-shell {
    --vf-fb-left-rail-width: 300px;
    --vf-fb-feed-width: 640px;
    --vf-fb-right-rail-width: 0px;
    width: min(100% - 24px, 988px) !important;
    max-width: 988px !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell > .row {
    grid-template-columns: var(--vf-fb-left-rail-width) minmax(0, var(--vf-fb-feed-width));
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .sg-offcanvas-mainbar > .row {
    grid-template-columns: minmax(500px, var(--vf-fb-feed-width)) !important;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-side-rail {
    display: none !important;
  }
}

/* Getting Started hero must escape the global card-surface override. */
html body.vf-page-getting_started .main-wrapper .vf-guide-page .vf-guide-hero {
  background:
    linear-gradient(90deg, rgba(5, 12, 24, 0.78) 0%, rgba(5, 12, 24, 0.54) 48%, rgba(5, 12, 24, 0.18) 100%),
    url("../images/landing/vf-hero-community-day.webp") center center / cover no-repeat !important;
  background-color: #071426 !important;
  color: #ffffff !important;
}

body.night-mode.vf-page-getting_started .main-wrapper .vf-guide-page .vf-guide-hero {
  background:
    linear-gradient(90deg, rgba(5, 12, 24, 0.84) 0%, rgba(5, 12, 24, 0.62) 48%, rgba(5, 12, 24, 0.24) 100%),
    url("../images/landing/vf-hero-community-night.webp") center center / cover no-repeat !important;
  background-color: #06101f !important;
}

/* Launch mobile QA pass: keep mobile app chrome quiet and readable. */
@media (max-width: 767.98px) {
  html body .footer-bottom-bar-links > .link > a,
  html body .footer-bottom-bar-links .link > a,
  html body:not(.night-mode) .footer-bottom-bar-links > .link > a,
  html body:not(.night-mode) .footer-bottom-bar-links .link > a,
  html body.night-mode .footer-bottom-bar-links > .link > a,
  html body.night-mode .footer-bottom-bar-links .link > a,
  html body .footer-bottom-bar .footer-add-toggle,
  html body:not(.night-mode) .footer-bottom-bar .footer-add-toggle,
  html body.night-mode .footer-bottom-bar .footer-add-toggle {
    background: transparent !important;
    background-image: none !important;
    border-color: transparent !important;
    box-shadow: none !important;
  }

  html body .footer-bottom-bar-links .link.active > a,
  html body:not(.night-mode) .footer-bottom-bar-links .link.active > a,
  html body.night-mode .footer-bottom-bar-links .link.active > a,
  html body .footer-bottom-bar-links .link.show > a,
  html body .footer-bottom-bar .footer-add-link.show .footer-add-toggle,
  html body:not(.night-mode) .footer-bottom-bar .footer-add-link.show .footer-add-toggle,
  html body.night-mode .footer-bottom-bar .footer-add-link.show .footer-add-toggle {
    background: rgba(255, 255, 255, 0.16) !important;
    background-image: none !important;
    border-color: rgba(255, 255, 255, 0.22) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14), 0 8px 18px rgba(2, 8, 23, 0.16) !important;
    color: #ffffff !important;
    backdrop-filter: blur(12px) saturate(1.08);
    -webkit-backdrop-filter: blur(12px) saturate(1.08);
  }

  html body .footer-bottom-bar .footer-add-link:not(.show) .footer-add-toggle {
    border-color: transparent !important;
    box-shadow: none !important;
  }

  html body .chat-sidebar {
    position: fixed !important;
    top: auto !important;
    right: max(12px, env(safe-area-inset-right, 0px)) !important;
    bottom: calc(88px + env(safe-area-inset-bottom, 0px)) !important;
    width: 48px !important;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    z-index: 1001 !important;
  }

  html body .chat-sidebar-shell,
  html body .chat-sidebar .chat-sidebar-shell .chat-sidebar-footer,
  html body .chat-sidebar-footer {
    width: 48px !important;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
  }

  html body .chat-sidebar .chat-sidebar-footer .btn-chat:not(.js_chat-new) {
    display: none !important;
  }

  html body .chat-sidebar .chat-sidebar-footer .js_chat-new.btn-chat {
    width: 48px !important;
    min-width: 48px !important;
    max-width: 48px !important;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    background: rgba(255, 255, 255, 0.96) !important;
  }

  html body .main-wrapper .vf-games-hero .vf-events-hero-search,
  html body .main-wrapper .vf-world-hero-events .vf-events-hero-search {
    margin-top: 18px !important;
  }

  html body .main-wrapper .vf-games-hero .vf-events-hero-search .input-group,
  html body .main-wrapper .vf-world-hero-events .vf-events-hero-search .input-group {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: stretch !important;
    overflow: hidden !important;
    min-height: 48px !important;
    border-radius: 16px !important;
    background: rgba(6, 18, 35, 0.68) !important;
  }

  html body .main-wrapper .vf-games-hero .vf-events-hero-search .form-control,
  html body .main-wrapper .vf-world-hero-events .vf-events-hero-search .form-control {
    display: block !important;
    min-width: 0 !important;
    width: 100% !important;
    height: 48px !important;
    min-height: 48px !important;
    padding: 0 14px !important;
    background: rgba(255, 255, 255, 0.12) !important;
    color: #ffffff !important;
    font-size: 0.92rem !important;
  }

  html body .main-wrapper .vf-games-hero .vf-events-hero-search .form-control::placeholder,
  html body .main-wrapper .vf-world-hero-events .vf-events-hero-search .form-control::placeholder {
    color: rgba(255, 255, 255, 0.84) !important;
    opacity: 1 !important;
  }

  html body .main-wrapper .vf-games-hero .vf-events-hero-search .btn,
  html body .main-wrapper .vf-world-hero-events .vf-events-hero-search .btn {
    width: auto !important;
    min-width: 58px !important;
    height: 48px !important;
    min-height: 48px !important;
    padding: 0 16px !important;
    border-radius: 0 !important;
  }

  html body .main-wrapper .vf-events-shell .content-tabs {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  html body .main-wrapper .vf-events-shell .content-tabs .vf-events-tab-actions {
    float: none !important;
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 8px !important;
    width: 100% !important;
    margin: 0 !important;
  }

  html body .main-wrapper .vf-events-shell .content-tabs .vf-events-tab-actions .btn {
    width: 100% !important;
    height: 42px !important;
    min-height: 42px !important;
    border-radius: 999px !important;
  }

  html body .main-wrapper .vf-local-hero.page-header,
  html body .main-wrapper .vf-local-hero.page-header > .container,
  html body .main-wrapper .vf-local-hero.page-header > .container-fluid {
    min-height: 0 !important;
  }

  html body .main-wrapper .vf-local-hero.page-header > .container,
  html body .main-wrapper .vf-local-hero.page-header > .container-fluid {
    padding: 28px 18px 30px !important;
  }

  html body .main-wrapper .vf-local-hero h2 {
    font-size: 2.15rem !important;
    line-height: 1.05 !important;
  }

  html body .main-wrapper .vf-local-hero .vf-events-hero-subtitle {
    max-width: 340px !important;
    margin-top: 10px !important;
    font-size: 0.94rem !important;
    line-height: 1.42 !important;
  }

  html body .main-wrapper .vf-local-hero .vf-local-search-card {
    margin-top: 16px !important;
    padding: 10px !important;
    border-radius: 16px !important;
  }

  html body .main-wrapper .vf-local-hero .vf-local-search-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 7px !important;
  }

  html body .main-wrapper .vf-local-hero .vf-local-search-field:nth-child(3),
  html body .main-wrapper .vf-local-hero .vf-local-search-submit {
    grid-column: 1 / -1 !important;
  }

  html body .main-wrapper .vf-local-hero .vf-local-search-card .form-label {
    margin-bottom: 3px !important;
    font-size: 0.58rem !important;
  }

  html body .main-wrapper .vf-local-hero .vf-local-search-card .form-control,
  html body .main-wrapper .vf-local-hero .vf-local-search-card .form-select {
    height: 34px !important;
    min-height: 34px !important;
    padding: 0 10px !important;
    font-size: 0.8rem !important;
  }

  html body .main-wrapper .vf-local-hero .vf-local-search-submit .btn {
    height: 36px !important;
    min-height: 36px !important;
  }

  html body.vf-page-getting_started .main-wrapper .vf-guide-page .vf-guide-hero h1 {
    max-width: 10ch !important;
    font-size: 2.18rem !important;
    line-height: 1.06 !important;
  }
}

/* Launch mobile QA follow-up: make Games feel designed for phones. */
@media (max-width: 767.98px) {
  html body .main-wrapper .vf-games-hero.page-header {
    width: calc(100% - 24px) !important;
    min-height: 0 !important;
    margin: 14px auto 12px !important;
    border-radius: 20px !important;
  }

  html body .main-wrapper .vf-games-hero.page-header > .container,
  html body .main-wrapper .vf-games-hero.page-header > .container-fluid {
    display: block !important;
    min-height: 0 !important;
    padding: 26px 18px 22px !important;
  }

  html body .main-wrapper .vf-games-hero .circle-2,
  html body .main-wrapper .vf-games-hero .circle-3 {
    display: none !important;
  }

  html body .main-wrapper .vf-games-hero .vf-events-hero-kicker {
    margin-bottom: 8px !important;
    font-size: 0.68rem !important;
  }

  html body .main-wrapper .vf-games-hero h2 {
    max-width: 100% !important;
    margin: 0 !important;
    font-size: 2.25rem !important;
    line-height: 1.05 !important;
  }

  html body .main-wrapper .vf-games-hero .vf-events-hero-subtitle {
    max-width: 100% !important;
    margin: 10px 0 0 !important;
    font-size: 0.94rem !important;
    line-height: 1.42 !important;
  }

  html body .main-wrapper .vf-games-hero .vf-events-hero-stats {
    display: none !important;
  }

  html body .main-wrapper .vf-games-hero .vf-events-hero-search {
    width: 100% !important;
    margin: 16px 0 0 !important;
  }

  html body .main-wrapper .vf-games-hero .vf-events-hero-search > [class*="col-"] {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    padding: 0 !important;
  }

  html body .main-wrapper .vf-games-hero .vf-events-hero-search .input-group {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 52px !important;
    min-height: 46px !important;
    border: 1px solid rgba(255, 255, 255, 0.24) !important;
    border-radius: 15px !important;
    background: rgba(8, 20, 36, 0.58) !important;
    box-shadow: 0 12px 24px rgba(2, 8, 23, 0.16) !important;
  }

  html body .main-wrapper .vf-games-hero .vf-events-hero-search .form-control {
    height: 46px !important;
    min-height: 46px !important;
    padding: 0 14px !important;
    border: 0 !important;
    background: transparent !important;
    color: #ffffff !important;
    font-size: 0.92rem !important;
    box-shadow: none !important;
  }

  html body .main-wrapper .vf-games-hero .vf-events-hero-search .btn {
    width: 52px !important;
    min-width: 52px !important;
    height: 46px !important;
    min-height: 46px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  html body .main-wrapper .vf-sidebar-module-shell {
    width: 100% !important;
    margin-top: 0 !important;
    padding-right: 12px !important;
    padding-left: 12px !important;
  }

  html body.vf-page-games .main-wrapper .vf-sidebar-module-shell .vf-games-tabs {
    margin: 0 0 12px !important;
    padding: 6px !important;
    border-radius: 16px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08) !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  html body.vf-page-games .main-wrapper .vf-sidebar-module-shell .vf-games-tabs::-webkit-scrollbar {
    display: none;
  }

  html body.vf-page-games .main-wrapper .vf-sidebar-module-shell .vf-games-tabs ul {
    display: flex !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    gap: 6px !important;
    width: max-content !important;
    min-width: 100% !important;
    min-height: 0 !important;
    padding: 0 !important;
  }

  html body.vf-page-games .main-wrapper .vf-sidebar-module-shell .vf-games-tabs li {
    flex: 0 0 auto !important;
    min-width: 0 !important;
    text-align: left !important;
  }

  html body.vf-page-games .main-wrapper .vf-sidebar-module-shell .vf-games-tabs li a {
    width: auto !important;
    min-height: 40px !important;
    padding: 0 12px !important;
    border-radius: 12px !important;
    font-size: 0.82rem !important;
    line-height: 1 !important;
  }

  html body.vf-page-games .main-wrapper .vf-platform-dashboard {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    margin: 12px 0 16px !important;
  }

  html body.vf-page-games .main-wrapper .vf-platform-dashboard-item {
    min-height: 54px !important;
    padding: 10px 12px !important;
    border-radius: 14px !important;
    gap: 8px !important;
    font-size: 0.82rem !important;
    line-height: 1.2 !important;
  }

  html body.vf-page-games .main-wrapper .vf-platform-dashboard-item i {
    flex: 0 0 auto !important;
  }

  html body.vf-page-games .main-wrapper .sg-offcanvas-sidebar {
    margin-bottom: 14px !important;
  }
}

/* Launch declutter: keep side tools available without dominating screenshots. */
@media (min-width: 1200px) and (pointer: fine) {
  html body .vf-share-slideout.js-vf-share-slideout {
    opacity: 0.42 !important;
    transition: opacity 0.18s ease, transform 0.18s ease !important;
  }

  html body .vf-share-slideout.js-vf-share-slideout:not(.is-open) {
    transform: translate(-34px, -50%) !important;
  }

  html body .vf-share-slideout.js-vf-share-slideout:hover,
  html body .vf-share-slideout.js-vf-share-slideout:focus-within,
  html body .vf-share-slideout.js-vf-share-slideout.is-open {
    opacity: 1 !important;
    transform: translate(0, -50%) !important;
  }

  html body .vf-share-slideout.js-vf-share-slideout .vf-share-tab {
    width: 42px !important;
    min-height: 86px !important;
    padding: 10px 5px !important;
    border-radius: 0 12px 12px 0 !important;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.16) !important;
  }

  html body .vf-share-slideout.js-vf-share-slideout .vf-share-tab__icon {
    width: 24px !important;
    height: 24px !important;
  }

  html body .vf-share-slideout.js-vf-share-slideout .vf-share-tab__text {
    font-size: 10px !important;
  }

  html body #vf-vibeguide-assistant.vf-assistant-left-tab,
  html body #vf-vibeguide-assistant.vf-assistant-mobile-tab {
    opacity: 0.42 !important;
    transition: opacity 0.18s ease, transform 0.18s ease !important;
  }

  html body #vf-vibeguide-assistant.vf-assistant-left-tab:not(.is-open),
  html body #vf-vibeguide-assistant.vf-assistant-mobile-tab:not(.is-open) {
    transform: translate(-34px, -50%) !important;
  }

  html body #vf-vibeguide-assistant.vf-assistant-left-tab:hover,
  html body #vf-vibeguide-assistant.vf-assistant-left-tab:focus-within,
  html body #vf-vibeguide-assistant.vf-assistant-left-tab.is-open,
  html body #vf-vibeguide-assistant.vf-assistant-mobile-tab:hover,
  html body #vf-vibeguide-assistant.vf-assistant-mobile-tab:focus-within,
  html body #vf-vibeguide-assistant.vf-assistant-mobile-tab.is-open {
    opacity: 1 !important;
    transform: translate(0, -50%) !important;
  }

  html body #vf-vibeguide-assistant .vf-assistant-panel {
    opacity: 1 !important;
  }
}

@media (max-width: 991.98px) {
  html body #vf-vibeguide-assistant.vf-assistant-left-tab,
  html body #vf-vibeguide-assistant.vf-assistant-mobile-tab,
  html body .vf-share-slideout.js-vf-share-slideout {
    display: none !important;
  }
}

/* r154 messages final cascade: keep the inbox aligned with the current launch UI. */
html body .vf-messages-shell.vf-messages-pwa-shell {
  --vf-message-panel-bg: rgba(255, 255, 255, 0.96);
  --vf-message-panel-border: rgba(148, 163, 184, 0.16);
  --vf-message-muted: #64748b;
}

html body .vf-messages-shell.vf-messages-pwa-shell .vf-messages-pwa-hero {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 18px !important;
  margin-bottom: 18px !important;
  padding: 18px 20px !important;
  border: 1px solid rgba(148, 163, 184, 0.16) !important;
  border-radius: 22px !important;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(241, 247, 255, 0.94)) !important;
  box-shadow: 0 16px 32px rgba(15, 23, 42, 0.08) !important;
}

html body .vf-messages-shell.vf-messages-pwa-shell .vf-messages-pwa-kicker {
  color: #216fdb !important;
}

html body .vf-messages-shell.vf-messages-pwa-shell .vf-messages-pwa-hero h1 {
  margin: 3px 0 4px !important;
  color: #16233a !important;
  font-size: 1.35rem !important;
  line-height: 1.2 !important;
}

html body .vf-messages-shell.vf-messages-pwa-shell .vf-messages-pwa-hero p {
  max-width: 560px !important;
  color: var(--vf-message-muted) !important;
  font-size: 0.9rem !important;
  line-height: 1.45 !important;
}

html body .vf-messages-shell.vf-messages-pwa-shell .vf-messages-pwa-actions {
  gap: 10px !important;
}

html body .vf-messages-shell.vf-messages-pwa-shell .vf-messages-pwa-actions .btn,
html body .vf-messages-shell.vf-messages-pwa-shell .vf-messages-pwa-status {
  min-height: 38px !important;
  padding-right: 16px !important;
  padding-left: 16px !important;
  font-size: 0.82rem !important;
  font-weight: 750 !important;
}

html body .vf-messages-shell.vf-messages-pwa-shell .vf-messages-pwa-status {
  border-color: rgba(148, 163, 184, 0.22) !important;
  background: rgba(255, 255, 255, 0.86) !important;
  color: #334155 !important;
}

html body .vf-messages-shell.vf-messages-pwa-shell .sg-offcanvas-sidebar .card,
html body .vf-messages-shell.vf-messages-pwa-shell .panel-messages,
html body .vf-messages-shell.vf-messages-pwa-shell .card-messages {
  overflow: hidden !important;
  border: 1px solid var(--vf-message-panel-border) !important;
  border-radius: 22px !important;
  background: var(--vf-message-panel-bg) !important;
  box-shadow: 0 16px 34px rgba(148, 163, 184, 0.12) !important;
}

html body .vf-messages-shell.vf-messages-pwa-shell .card-header.with-icon,
html body .vf-messages-shell.vf-messages-pwa-shell .panel-messages .card-header {
  border-bottom: 1px solid rgba(148, 163, 184, 0.14) !important;
  background: rgba(248, 250, 252, 0.88) !important;
}

html body .vf-messages-shell.vf-messages-pwa-shell .vf-messages-thread-title,
html body .vf-messages-shell.vf-messages-pwa-shell .feeds-item .name {
  color: #17233a !important;
  font-weight: 800 !important;
}

html body .vf-messages-shell.vf-messages-pwa-shell .js_directory-filter-list {
  margin: 0 !important;
  padding: 0 10px 10px !important;
  list-style: none !important;
}

html body .vf-messages-shell.vf-messages-pwa-shell .feeds-item {
  margin: 6px 0 !important;
  border: 0 !important;
  border-radius: 16px !important;
}

html body .vf-messages-shell.vf-messages-pwa-shell .feeds-item > .data-container {
  gap: 12px !important;
  padding: 10px !important;
  border-radius: 16px !important;
  color: #26364d !important;
  transition: background 0.18s ease, transform 0.18s ease !important;
}

html body .vf-messages-shell.vf-messages-pwa-shell .feeds-item > .data-container:hover {
  background: rgba(47, 111, 228, 0.07) !important;
  transform: translateY(-1px) !important;
}

html body .vf-messages-shell.vf-messages-pwa-shell .feeds-item.unread > .data-container {
  background: rgba(47, 111, 228, 0.1) !important;
}

html body .vf-messages-shell.vf-messages-pwa-shell .feeds-item .data-avatar,
html body .vf-messages-shell.vf-messages-pwa-shell .feeds-item .data-avatar img {
  width: 46px !important;
  height: 46px !important;
  border-radius: 16px !important;
}

html body .vf-messages-shell.vf-messages-pwa-shell .feeds-item .text,
html body .vf-messages-shell.vf-messages-pwa-shell .feeds-item .time {
  color: #64748b !important;
  font-size: 0.8rem !important;
  line-height: 1.35 !important;
}

html body .vf-messages-shell.vf-messages-pwa-shell .panel-messages .card-body {
  padding: 0 !important;
}

html body .vf-messages-shell.vf-messages-pwa-shell .panel-messages .chat-conversations {
  padding: 14px 16px !important;
  background: linear-gradient(180deg, rgba(248, 250, 252, 0.8), rgba(255, 255, 255, 0.98)) !important;
}

html body .vf-messages-shell.vf-messages-pwa-shell .chat-form {
  margin: 0 !important;
  border-top: 1px solid rgba(148, 163, 184, 0.14) !important;
  border-radius: 0 !important;
  background: rgba(255, 255, 255, 0.98) !important;
}

html body .vf-messages-shell.vf-messages-pwa-shell .chat-form-message textarea {
  min-height: 48px !important;
  color: #1f2a3a !important;
}

html body.night-mode .vf-messages-shell.vf-messages-pwa-shell {
  --vf-message-panel-bg: rgba(15, 23, 42, 0.9);
  --vf-message-panel-border: rgba(148, 163, 184, 0.16);
  --vf-message-muted: #9fb0c6;
}

html body.night-mode .vf-messages-shell.vf-messages-pwa-shell .vf-messages-pwa-hero {
  border-color: rgba(148, 163, 184, 0.16) !important;
  background: linear-gradient(135deg, rgba(15, 23, 42, 0.94), rgba(21, 32, 49, 0.9)) !important;
  box-shadow: 0 18px 36px rgba(2, 6, 23, 0.28) !important;
}

html body.night-mode .vf-messages-shell.vf-messages-pwa-shell .vf-messages-pwa-hero h1,
html body.night-mode .vf-messages-shell.vf-messages-pwa-shell .vf-messages-thread-title,
html body.night-mode .vf-messages-shell.vf-messages-pwa-shell .feeds-item .name {
  color: #f8fafc !important;
}

html body.night-mode .vf-messages-shell.vf-messages-pwa-shell .vf-messages-pwa-status {
  border-color: rgba(148, 163, 184, 0.18) !important;
  background: rgba(15, 23, 42, 0.72) !important;
  color: #dbe4f0 !important;
}

html body.night-mode .vf-messages-shell.vf-messages-pwa-shell .card-header.with-icon,
html body.night-mode .vf-messages-shell.vf-messages-pwa-shell .panel-messages .card-header {
  border-bottom-color: rgba(148, 163, 184, 0.14) !important;
  background: rgba(15, 23, 42, 0.68) !important;
}

html body.night-mode .vf-messages-shell.vf-messages-pwa-shell .feeds-item > .data-container {
  color: #dbe4f0 !important;
}

html body.night-mode .vf-messages-shell.vf-messages-pwa-shell .feeds-item > .data-container:hover,
html body.night-mode .vf-messages-shell.vf-messages-pwa-shell .feeds-item.unread > .data-container {
  background: rgba(47, 111, 228, 0.18) !important;
}

html body.night-mode .vf-messages-shell.vf-messages-pwa-shell .feeds-item .text,
html body.night-mode .vf-messages-shell.vf-messages-pwa-shell .feeds-item .time {
  color: #9fb0c6 !important;
}

html body.night-mode .vf-messages-shell.vf-messages-pwa-shell .panel-messages .chat-conversations {
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.78), rgba(11, 18, 32, 0.94)) !important;
}

html body.night-mode .vf-messages-shell.vf-messages-pwa-shell .chat-form {
  border-top-color: rgba(148, 163, 184, 0.14) !important;
  background: rgba(15, 23, 42, 0.92) !important;
}

html body.night-mode .vf-messages-shell.vf-messages-pwa-shell .chat-form-message textarea {
  color: #eef5ff !important;
}

@media (max-width: 767.98px) {
  html body .vf-messages-shell.vf-messages-pwa-shell .vf-messages-pwa-hero {
    align-items: stretch !important;
    flex-direction: column !important;
    padding: 16px !important;
    border-radius: 18px !important;
  }

  html body .vf-messages-shell.vf-messages-pwa-shell .vf-messages-pwa-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    justify-content: stretch !important;
  }

  html body .vf-messages-shell.vf-messages-pwa-shell .vf-messages-pwa-actions .btn,
  html body .vf-messages-shell.vf-messages-pwa-shell .vf-messages-pwa-status {
    width: 100% !important;
    justify-content: center !important;
  }

  html body .vf-messages-shell.vf-messages-pwa-shell .vf-messages-pwa-status {
    grid-column: 1 / -1 !important;
  }
}

/* r155: keep the fixed left rail below the main header on every page. */
@media (min-width: 768px) {
  html body .main-wrapper .main-header {
    position: relative;
    z-index: 2147483000 !important;
    isolation: isolate;
  }

  html body .main-wrapper .main-header .dropdown-menu,
  html body .main-wrapper .main-header .dropdown-widget {
    z-index: 2147483010 !important;
  }

  html body .main-wrapper .sg-offcanvas-sidebar.js_sticky-sidebar:has(.vf-left-rail-slideout),
  html body .main-wrapper .sg-offcanvas-sidebar.js_sticky-sidebar:has(.vf-left-rail-slideout) > .theiaStickySidebar,
  html body .main-wrapper .main-side-nav-card.vf-left-rail-slideout,
  html body .main-wrapper .main-side-nav-card.vf-left-rail-slideout .card-body {
    z-index: 900 !important;
  }

  html body .main-wrapper .main-side-nav-card.vf-left-rail-slideout {
    top: var(--vf-left-rail-top, calc(82px + env(safe-area-inset-top, 0px))) !important;
  }

  html body .main-wrapper .vf-left-rail-slideout .sidebar-layout-modern {
    max-height: max(260px, calc(100vh - var(--vf-left-rail-top, 82px) - 22px)) !important;
  }

  html body .main-wrapper .vf-left-rail-slideout .sidebar-section-panel,
  html body .main-wrapper .vf-left-rail-slideout .sidebar-section-block > .sidebar-grid,
  html body .main-wrapper .vf-left-rail-slideout .sidebar-section-block > .sidebar-quick-grid,
  html body .main-wrapper .vf-left-rail-slideout .sidebar-global-more {
    z-index: 950 !important;
  }

  html body.vf-page-local .main-wrapper .sg-offcanvas-sidebar.js_sticky-sidebar:has(.vf-left-rail-slideout),
  html body.vf-page-local .main-wrapper .sg-offcanvas-sidebar.js_sticky-sidebar:has(.vf-left-rail-slideout) > .theiaStickySidebar,
  html body.vf-page-local .main-wrapper .main-side-nav-card.vf-left-rail-slideout,
  html body.vf-page-local .main-wrapper .main-side-nav-card.vf-left-rail-slideout .card-body {
    z-index: 1 !important;
  }

  html body:not(.vf-page-index) .main-wrapper .sg-offcanvas-sidebar.js_sticky-sidebar:has(.vf-left-rail-slideout),
  html body:not(.vf-page-index) .main-wrapper .sg-offcanvas-sidebar.js_sticky-sidebar:has(.vf-left-rail-slideout) > .theiaStickySidebar {
    min-height: 0 !important;
    z-index: 900 !important;
    isolation: isolate !important;
    transform: none !important;
  }

  html body:not(.vf-page-index) .main-wrapper .main-side-nav-card.vf-left-rail-slideout {
    position: sticky !important;
    top: calc(82px + env(safe-area-inset-top, 0px)) !important;
    left: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    z-index: 900 !important;
    transform: none !important;
  }

  html body:not(.vf-page-index) .main-wrapper .vf-left-rail-slideout .sidebar-layout-modern {
    max-height: calc(100vh - 104px - env(safe-area-inset-top, 0px)) !important;
  }

  html body.vf-page-index:not(.vf-view-default) .main-wrapper .sg-offcanvas-sidebar.js_sticky-sidebar:has(.vf-left-rail-slideout),
  html body.vf-page-index:not(.vf-view-default) .main-wrapper .sg-offcanvas-sidebar.js_sticky-sidebar:has(.vf-left-rail-slideout) > .theiaStickySidebar {
    min-height: 0 !important;
    z-index: 900 !important;
    isolation: isolate !important;
    transform: none !important;
  }

  html body.vf-page-index:not(.vf-view-default) .main-wrapper .main-side-nav-card.vf-left-rail-slideout {
    position: sticky !important;
    top: calc(82px + env(safe-area-inset-top, 0px)) !important;
    left: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    z-index: 900 !important;
    transform: none !important;
  }

  html body.vf-page-index:not(.vf-view-default) .main-wrapper .vf-left-rail-slideout .sidebar-layout-modern {
    max-height: calc(100vh - 104px - env(safe-area-inset-top, 0px)) !important;
  }
}

/* r158 launch correction: keep publisher modal below fixed nav and preserve weather scene imagery. */
html body.modal-open #modal.js_modal-publisher {
  box-sizing: border-box !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  padding-top: clamp(76px, 9vh, 104px) !important;
  padding-bottom: 28px !important;
}

html body #modal.js_modal-publisher .modal-dialog,
html body #modal.js_modal-publisher .modal-dialog.modal-lg,
html body #modal.js_modal-publisher .modal-dialog.modal-xl,
html body #modal.js_modal-publisher .modal-dialog.modal-dialog-centered {
  min-height: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

html body .main-wrapper .sidebar-meta-widget[class*="is-weather-"] {
  overflow: hidden !important;
  background-color: #10233d !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  background-blend-mode: overlay !important;
  color: #ffffff !important;
}

html body .main-wrapper .sidebar-meta-widget[class*="is-weather-"] .sidebar-weather-board {
  border-color: rgba(255, 255, 255, 0.14) !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body .main-wrapper .sidebar-meta-widget[class*="is-weather-"] .sidebar-meta-datetime,
html body .main-wrapper .sidebar-meta-widget[class*="is-weather-"] .sidebar-weather-condition,
html body .main-wrapper .sidebar-meta-widget[class*="is-weather-"] .sidebar-weather-temp,
html body .main-wrapper .sidebar-meta-widget[class*="is-weather-"] .sidebar-weather-snark,
html body .main-wrapper .sidebar-meta-widget[class*="is-weather-"] .sidebar-weather-day {
  color: rgba(255, 255, 255, 0.9) !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-sun {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.26), rgba(6, 18, 34, 0.42)), url("/content/themes/modern/images/heroes/community-ocean.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-partly-cloudy {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.32), rgba(6, 18, 34, 0.5)), url("/content/themes/modern/images/heroes/community-desert.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-cloudy {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.36), rgba(6, 18, 34, 0.56)), url("/content/themes/modern/images/heroes/community-sky.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-fog {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.34), rgba(6, 18, 34, 0.58)), url("/content/themes/modern/images/heroes/community-city.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-drizzle {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.34), rgba(6, 18, 34, 0.58)), url("/content/themes/modern/images/heroes/community-waterfall.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-rain {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.38), rgba(6, 18, 34, 0.62)), url("/content/themes/modern/images/heroes/community-garden.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-snow {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.22), rgba(6, 18, 34, 0.46)), url("/content/themes/modern/images/heroes/community-snow.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-storm {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.4), rgba(6, 18, 34, 0.64)), url("/content/themes/modern/images/heroes/community-forest.webp") !important;
}
/* r159b weather board photos final cascade guard. */
html body .main-wrapper .sidebar-meta-widget[class*="is-weather-"] .sidebar-weather-board {
  overflow: hidden !important;
  min-height: 184px !important;
  padding: 16px !important;
  border-radius: 18px !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  background-blend-mode: overlay !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-sun .sidebar-weather-board {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.24), rgba(6, 18, 34, 0.46)), url("/content/themes/modern/images/heroes/community-ocean.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-partly-cloudy .sidebar-weather-board {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.3), rgba(6, 18, 34, 0.52)), url("/content/themes/modern/images/heroes/community-desert.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-cloudy .sidebar-weather-board {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.34), rgba(6, 18, 34, 0.58)), url("/content/themes/modern/images/heroes/community-sky.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-fog .sidebar-weather-board {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.32), rgba(6, 18, 34, 0.58)), url("/content/themes/modern/images/heroes/community-city.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-drizzle .sidebar-weather-board {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.34), rgba(6, 18, 34, 0.6)), url("/content/themes/modern/images/heroes/community-waterfall.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-rain .sidebar-weather-board {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.38), rgba(6, 18, 34, 0.64)), url("/content/themes/modern/images/heroes/community-garden.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-snow .sidebar-weather-board {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.22), rgba(6, 18, 34, 0.48)), url("/content/themes/modern/images/heroes/community-snow.webp") !important;
}

html body .main-wrapper .sidebar-meta-widget.is-weather-storm .sidebar-weather-board {
  background-image: linear-gradient(135deg, rgba(6, 18, 34, 0.42), rgba(6, 18, 34, 0.68)), url("/content/themes/modern/images/heroes/community-forest.webp") !important;
}
/* r161 final launch visual polish */
:root{--vf-launch-card-shadow:0 0 30px 0 rgb(82 63 105 / 5%);--vf-launch-card-border:rgba(207,219,235,.78);--vf-launch-soft-panel:rgba(248,251,255,.92);--vf-launch-ink:#172033;--vf-launch-muted:#66758b}
html body .main-wrapper .dropdown-menu{border:1px solid var(--vf-launch-card-border)!important;border-radius:18px!important;padding:8px!important;box-shadow:0 18px 44px rgba(15,23,42,.14)!important}
html body .main-wrapper .dropdown-menu .dropdown-item{display:flex;align-items:center;gap:10px;min-height:40px;padding:9px 10px!important;border-radius:12px;color:#23334a!important;font-weight:750}
html body .main-wrapper .dropdown-menu .dropdown-item:hover,html body .main-wrapper .dropdown-menu .dropdown-item:focus{background:rgba(47,109,255,.09)!important;color:#173c8c!important}
html body .main-wrapper .dropdown-menu .dropdown-divider{margin:8px 6px!important;border-top-color:rgba(148,163,184,.28)!important}
html body .main-wrapper .dropdown-menu .main-icon,html body .main-wrapper .dropdown-menu .fa,html body .main-wrapper .dropdown-menu i{flex:0 0 20px;width:20px;min-width:20px;color:#2f6dff;text-align:center}
body.night-mode .main-wrapper .dropdown-menu{border-color:rgba(96,121,155,.38)!important;background:rgba(18,28,42,.98)!important;box-shadow:0 20px 48px rgba(0,0,0,.38)!important}
body.night-mode .main-wrapper .dropdown-menu .dropdown-item{color:#e8f1ff!important}
body.night-mode .main-wrapper .dropdown-menu .dropdown-item:hover,body.night-mode .main-wrapper .dropdown-menu .dropdown-item:focus{background:rgba(96,165,250,.14)!important;color:#fff!important}
html body .main-wrapper .vf-left-rail-slideout{box-shadow:var(--vf-launch-card-shadow)!important}
html body .main-wrapper .vf-left-rail-slideout .sidebar-section-block{margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid rgba(220,229,241,.74)}
html body .main-wrapper .vf-left-rail-slideout .sidebar-section-block:last-child{border-bottom:0}
html body .main-wrapper .vf-left-rail-slideout .sidebar-section-title{min-height:34px;padding:4px 8px;color:#687992}
html body .main-wrapper .vf-left-rail-slideout .sidebar-section-title span{font-size:.7rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
html body .main-wrapper .vf-left-rail-slideout .sidebar-grid,html body .main-wrapper .vf-left-rail-slideout .sidebar-quick-grid{gap:8px!important}
html body .main-wrapper .vf-left-rail-slideout .sidebar-grid-item,html body .main-wrapper .vf-left-rail-slideout .sidebar-quick-item,html body .main-wrapper .vf-left-rail-slideout .sidebar-see-more{min-height:48px;border:1px solid rgba(207,219,235,.62);border-radius:14px!important;background:rgba(248,251,255,.78);box-shadow:none!important}
html body .main-wrapper .vf-left-rail-slideout .sidebar-grid-item:hover,html body .main-wrapper .vf-left-rail-slideout .sidebar-quick-item:hover,html body .main-wrapper .vf-left-rail-slideout .sidebar-see-more:hover{border-color:rgba(47,109,255,.26);background:#fff;transform:translateY(-1px)}
body.night-mode .main-wrapper .vf-left-rail-slideout .sidebar-section-block{border-bottom-color:rgba(96,121,155,.26)}
body.night-mode .main-wrapper .vf-left-rail-slideout .sidebar-grid-item,body.night-mode .main-wrapper .vf-left-rail-slideout .sidebar-quick-item,body.night-mode .main-wrapper .vf-left-rail-slideout .sidebar-see-more{border-color:rgba(96,121,155,.26);background:rgba(20,31,47,.76);color:#dce8f8!important}
html body .vf-side-rail .card,html body .vf-side-rail .vf-side-card,html body .vf-side-rail .sidebar-weather-board{border-radius:18px!important;box-shadow:var(--vf-launch-card-shadow)!important}
html body .vf-side-rail .card-header{min-height:46px;padding:12px 14px!important;border-bottom:1px solid rgba(220,229,241,.72)!important;background:linear-gradient(180deg,rgba(248,251,255,.96),rgba(255,255,255,.96))!important}
html body .vf-side-rail .card-header h6{color:#18304a!important;font-size:.83rem;font-weight:900;letter-spacing:.03em}
html body .vf-side-rail .post-media.list,html body .vf-side-rail .blog-container{border:1px solid rgba(220,229,241,.72);border-radius:14px;background:rgba(255,255,255,.72);box-shadow:none!important}
html body .vf-side-rail .post-media.list img,html body .vf-side-rail .blog-container img{border-radius:12px;object-fit:cover}
html body .vf-side-rail .post-media-meta .title,html body .vf-side-rail .blog-content h3{color:#172033!important;font-size:.86rem!important;line-height:1.28;font-weight:850!important}
body.night-mode .vf-side-rail .card-header{border-bottom-color:rgba(96,121,155,.28)!important;background:linear-gradient(180deg,rgba(20,31,47,.96),rgba(18,28,42,.96))!important}
body.night-mode .vf-side-rail .card-header h6,body.night-mode .vf-side-rail .post-media-meta .title,body.night-mode .vf-side-rail .blog-content h3{color:#edf5ff!important}
body.night-mode .vf-side-rail .post-media.list,body.night-mode .vf-side-rail .blog-container{border-color:rgba(96,121,155,.28);background:rgba(20,31,47,.76)}
html body.vf-page-games .main-wrapper .vf-sidebar-module-shell .vf-games-tabs{overflow:hidden!important}
html body.vf-page-games .main-wrapper .vf-sidebar-module-shell .vf-games-tabs ul{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(128px,1fr));gap:8px;min-width:0!important;padding:10px!important}
html body.vf-page-games .main-wrapper .vf-sidebar-module-shell .vf-games-tabs li{flex:none!important;min-width:0!important}
html body.vf-page-games .main-wrapper .vf-sidebar-module-shell .vf-games-tabs li a{min-height:44px;border-radius:12px;background:rgba(248,251,255,.78)}
@media(max-width:767.98px){html body.vf-page-games .main-wrapper .vf-sidebar-module-shell .vf-games-tabs ul{grid-template-columns:repeat(2,minmax(0,1fr))}}
html body .main-wrapper .no-data,html body .main-wrapper .empty-state,html body .main-wrapper .vf-podcast-empty-state,html body .main-wrapper .text-center.text-muted.mb20{border:1px solid rgba(220,229,241,.78);border-radius:18px;background:rgba(255,255,255,.78);color:var(--vf-launch-muted)!important;box-shadow:var(--vf-launch-card-shadow)}
body.night-mode .main-wrapper .no-data,body.night-mode .main-wrapper .empty-state,body.night-mode .main-wrapper .vf-podcast-empty-state,body.night-mode .main-wrapper .text-center.text-muted.mb20{border-color:rgba(96,121,155,.28);background:rgba(20,31,47,.72);color:#aebfd5!important}
html body .vf-unsplash-credit,html body .vf-hero-credit,html body .photo-credit{right:14px!important;bottom:12px!important;left:auto!important;max-width:min(70%,360px);border-radius:999px!important;background:rgba(6,18,34,.62)!important;color:#fff!important;text-align:right}

/* r162 keep simple confirm dialogs from inheriting publisher modal layout */
html body #modal:not(.js_modal-publisher):not(.js_modal-comment-publisher) .modal-dialog:has(.vf-modal-confirm-header){max-width:520px!important}
html body #modal:not(.js_modal-publisher):not(.js_modal-comment-publisher) .modal-content:has(.vf-modal-confirm-header){border-radius:20px!important;overflow:hidden!important}
html body #modal:not(.js_modal-publisher):not(.js_modal-comment-publisher) .vf-modal-confirm-header{display:flex!important;align-items:center!important;min-height:58px!important;padding:18px 24px 14px!important;border-bottom:1px solid rgba(220,229,241,.82)!important;background:#fff!important}
html body #modal:not(.js_modal-publisher):not(.js_modal-comment-publisher) .vf-modal-confirm-header .modal-title{margin:0!important;color:#172033!important;font-size:1rem!important;font-weight:850!important;line-height:1.25!important}
html body #modal:not(.js_modal-publisher):not(.js_modal-comment-publisher) .vf-modal-confirm-body{display:block!important;padding:16px 24px 4px!important}
html body #modal:not(.js_modal-publisher):not(.js_modal-comment-publisher) .vf-modal-confirm-message{margin:0!important;color:#52627b!important;font-size:.94rem!important;font-weight:650!important;line-height:1.45!important}
html body #modal:not(.js_modal-publisher):not(.js_modal-comment-publisher) .vf-modal-confirm-footer{display:flex!important;justify-content:flex-end!important;gap:10px!important;padding:18px 24px 22px!important;border-top:0!important}
html body #modal:not(.js_modal-publisher):not(.js_modal-comment-publisher) .vf-modal-confirm-footer .btn{min-width:104px!important;min-height:42px!important;border-radius:999px!important}
body.night-mode #modal:not(.js_modal-publisher):not(.js_modal-comment-publisher) .modal-content:has(.vf-modal-confirm-header),body.night-mode #modal:not(.js_modal-publisher):not(.js_modal-comment-publisher) .vf-modal-confirm-header{border-color:rgba(96,121,155,.34)!important;background:#121c2a!important}
body.night-mode #modal:not(.js_modal-publisher):not(.js_modal-comment-publisher) .vf-modal-confirm-header .modal-title{color:#f7faff!important}
body.night-mode #modal:not(.js_modal-publisher):not(.js_modal-comment-publisher) .vf-modal-confirm-message{color:#b7c6da!important}
@media(max-width:575.98px){html body #modal:not(.js_modal-publisher):not(.js_modal-comment-publisher) .modal-dialog:has(.vf-modal-confirm-header){max-width:calc(100vw - 28px)!important;margin:76px auto 24px!important}html body #modal:not(.js_modal-publisher):not(.js_modal-comment-publisher) .vf-modal-confirm-footer{flex-direction:column-reverse!important}html body #modal:not(.js_modal-publisher):not(.js_modal-comment-publisher) .vf-modal-confirm-footer .btn{width:100%!important}}

/* r163 keep standard modals clear of the fixed main navigation */
html body.modal-open #modal:not(.js_modal-publisher):not(.js_modal-comment-publisher){box-sizing:border-box!important;overflow-x:hidden!important;overflow-y:auto!important;padding-top:clamp(84px,10vh,116px)!important;padding-bottom:32px!important}
html body #modal:not(.js_modal-publisher):not(.js_modal-comment-publisher) .modal-dialog,html body #modal:not(.js_modal-publisher):not(.js_modal-comment-publisher) .modal-dialog.modal-sm,html body #modal:not(.js_modal-publisher):not(.js_modal-comment-publisher) .modal-dialog.modal-lg,html body #modal:not(.js_modal-publisher):not(.js_modal-comment-publisher) .modal-dialog.modal-xl,html body #modal:not(.js_modal-publisher):not(.js_modal-comment-publisher) .modal-dialog.modal-dialog-centered,html body #modal:not(.js_modal-publisher):not(.js_modal-comment-publisher) .modal-dialog:has(.vf-modal-confirm-header){min-height:0!important;margin-top:0!important;margin-bottom:0!important}
@media(max-width:575.98px){html body.modal-open #modal:not(.js_modal-publisher):not(.js_modal-comment-publisher){padding-top:calc(78px + env(safe-area-inset-top,0px))!important;padding-bottom:calc(24px + env(safe-area-inset-bottom,0px))!important}}

/* Messenger keeps the composer above the iOS keyboard in browser and installed PWA mode. */
@media (max-width: 767.98px) {
  html body.vf-page-messages .vf-messages-shell.active .panel-messages { min-height: calc(var(--vf-messenger-viewport, 100dvh) - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)); }
  html body.vf-page-messages .vf-messages-shell.active .panel-messages .card-body { display:flex; flex-direction:column; min-height:0; }
  html body.vf-page-messages .vf-messages-shell.active .panel-messages .chat-conversations { flex:1 1 auto; min-height:0; }
  html body.vf-page-messages .vf-messages-shell.active .panel-messages .vf-messenger-compose { position:sticky; bottom:0; z-index:4; padding-bottom:max(10px, env(safe-area-inset-bottom, 0px)); background:var(--card-bg, #fff); }
  html body.vf-page-messages .vf-messenger-message-actions { display:flex; gap:6px; margin:5px 0; }
  html body.vf-page-messages .vf-messenger-message-actions button { width:30px; height:30px; border:0; border-radius:9px; background:#eef4fb; color:#087af5; }
}

/* r164 weather forecast rows need fixed lanes for icon and temperatures */
html body .main-wrapper .sidebar-weather-days{gap:7px!important}
html body .main-wrapper .sidebar-weather-day{display:grid!important;grid-template-columns:minmax(34px,42px) 22px 34px 34px!important;align-items:center!important;column-gap:8px!important;min-width:0!important}
html body .main-wrapper .sidebar-weather-day-name{min-width:0!important;white-space:nowrap!important}
html body .main-wrapper .sidebar-weather-day-icon{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:22px!important;height:22px!important;min-width:22px!important;margin:0!important}
html body .main-wrapper .sidebar-weather-day-icon svg{display:block!important;width:19px!important;height:19px!important}
html body .main-wrapper .sidebar-weather-day-temps{display:contents!important;font-variant-numeric:tabular-nums!important}
html body .main-wrapper .sidebar-weather-day-temps .temp-low,html body .main-wrapper .sidebar-weather-day-temps .temp-high{display:block!important;min-width:34px!important;text-align:right!important;white-space:nowrap!important;font-size:11px!important;font-weight:800!important;line-height:1!important}
html body .main-wrapper .sidebar-weather-day-temps .temp-low{color:rgba(213,227,255,.76)!important}
html body .main-wrapper .sidebar-weather-day-temps .temp-high{color:rgba(255,255,255,.96)!important}

/* r165 hero max-width and weather temp overflow correction */
html body .main-wrapper .page-header:not(.mini):not(.bank-transfer):not(.vf-404-hero),
html body .main-wrapper .page-header[class*="-hero"]:not(.mini):not(.bank-transfer):not(.vf-404-hero),
html body .main-wrapper .vf-lifted-hero-wrap,
html body .main-wrapper .vf-feed-hero-wrap,
html body .main-wrapper .vf-dashboard-shell,
html body .main-wrapper .vf-podcasts-page,
html body .main-wrapper .vf-launchpad-shell .vf-launchpad-hero,
html body .main-wrapper .vf-foryou-hero-card,
html body .main-wrapper .profdash-hero{max-width:1384px!important;width:calc(100% - 32px)!important;margin-left:auto!important;margin-right:auto!important}
html body .main-wrapper .vf-lifted-hero-wrap > .page-header,
html body .main-wrapper .vf-lifted-hero-wrap > .card,
html body .main-wrapper .vf-feed-hero-wrap > .page-header{width:100%!important;max-width:100%!important}
html body .main-wrapper .sidebar-weather-day{grid-template-columns:minmax(30px,1fr) 20px max-content max-content!important;column-gap:6px!important;width:100%!important}
html body .main-wrapper .sidebar-weather-day-icon{width:20px!important;height:20px!important;min-width:20px!important}
html body .main-wrapper .sidebar-weather-day-icon svg{width:18px!important;height:18px!important}
html body .main-wrapper .sidebar-weather-day-temps .temp-low,html body .main-wrapper .sidebar-weather-day-temps .temp-high{min-width:0!important;width:auto!important;padding-left:1px!important;font-size:10.5px!important}

/* r166 align content containers below heroes to the hero width */
html body .main-wrapper .page-header:not(.mini):not(.bank-transfer):not(.vf-404-hero) + .container,
html body .main-wrapper .page-header:not(.mini):not(.bank-transfer):not(.vf-404-hero) + .container-fluid,
html body .main-wrapper .page-header[class*="-hero"]:not(.mini):not(.bank-transfer):not(.vf-404-hero) + .container,
html body .main-wrapper .page-header[class*="-hero"]:not(.mini):not(.bank-transfer):not(.vf-404-hero) + .container-fluid,
html body .main-wrapper .vf-lifted-hero-wrap + .container,
html body .main-wrapper .vf-lifted-hero-wrap + .container-fluid,
html body .main-wrapper .vf-feed-hero-wrap + .container,
html body .main-wrapper .vf-feed-hero-wrap + .container-fluid,
html body .main-wrapper .vf-dashboard-shell + .container,
html body .main-wrapper .vf-dashboard-shell + .container-fluid,
html body .main-wrapper .vf-podcasts-page + .container,
html body .main-wrapper .vf-podcasts-page + .container-fluid,
html body .main-wrapper .vf-for-you-shell.sg-offcanvas,
html body .main-wrapper .vf-directory-shell,
html body .main-wrapper .vf-sidebar-module-shell,
html body .main-wrapper .vf-local-page-content,
html body .main-wrapper .vf-world-directory-shell,
html body .main-wrapper .vf-search-hero + .sg-offcanvas,
html body .main-wrapper .vf-launchpad-shell,
html body .main-wrapper .vf-games-shell{max-width:1384px!important;width:calc(100% - 32px)!important;margin-left:auto!important;margin-right:auto!important;padding-left:0!important;padding-right:0!important}
@media(max-width:767.98px){html body .main-wrapper .page-header:not(.mini):not(.bank-transfer):not(.vf-404-hero) + .container,html body .main-wrapper .page-header:not(.mini):not(.bank-transfer):not(.vf-404-hero) + .container-fluid,html body .main-wrapper .page-header[class*="-hero"]:not(.mini):not(.bank-transfer):not(.vf-404-hero) + .container,html body .main-wrapper .page-header[class*="-hero"]:not(.mini):not(.bank-transfer):not(.vf-404-hero) + .container-fluid,html body .main-wrapper .vf-lifted-hero-wrap + .container,html body .main-wrapper .vf-lifted-hero-wrap + .container-fluid,html body .main-wrapper .vf-feed-hero-wrap + .container,html body .main-wrapper .vf-feed-hero-wrap + .container-fluid,html body .main-wrapper .vf-dashboard-shell + .container,html body .main-wrapper .vf-dashboard-shell + .container-fluid,html body .main-wrapper .vf-podcasts-page + .container,html body .main-wrapper .vf-podcasts-page + .container-fluid,html body .main-wrapper .vf-for-you-shell.sg-offcanvas,html body .main-wrapper .vf-directory-shell,html body .main-wrapper .vf-sidebar-module-shell,html body .main-wrapper .vf-local-page-content,html body .main-wrapper .vf-world-directory-shell,html body .main-wrapper .vf-search-hero + .sg-offcanvas,html body .main-wrapper .vf-launchpad-shell,html body .main-wrapper .vf-games-shell{width:calc(100% - 24px)!important}}

/* r167 right rail editorial widget normalization */
body.vf-page-index .vf-newsfeed-shell .vf-side-rail .card,
body.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-side-card,
body.vf-page-index .vf-newsfeed-shell .vf-side-rail .sidebar-meta-widget,
body.vf-page-index .vf-newsfeed-shell .vf-side-rail .sidebar-weather-board {
  margin-bottom: 18px !important;
  border: 1px solid rgba(207, 219, 235, 0.78) !important;
  border-radius: 18px !important;
  box-shadow: var(--vf-launch-card-shadow, 0 0 30px 0 rgb(82 63 105 / 5%)) !important;
}

body.vf-page-index .vf-newsfeed-shell .vf-side-rail .card-header,
body.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-blog-carousel-header {
  min-height: 46px !important;
  padding: 12px 14px !important;
  border-bottom: 1px solid rgba(220, 229, 241, 0.72) !important;
  background: linear-gradient(180deg, rgba(248, 251, 255, 0.96), rgba(255, 255, 255, 0.96)) !important;
}

body.vf-page-index .vf-newsfeed-shell .vf-side-rail .card-header h6,
body.vf-page-index .vf-newsfeed-shell .vf-side-rail .sidebar-widget-heading {
  color: #18304a !important;
  font-size: 0.83rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.03em !important;
  text-transform: none !important;
}

body.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-trending-card {
  overflow: hidden !important;
  background: linear-gradient(180deg, #ffffff 0%, #f7fbff 100%) !important;
}

body.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-trending-card .card-header {
  position: relative !important;
  padding-bottom: 12px !important;
}

body.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-trending-card .card-header::after {
  content: "";
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: 0;
  height: 3px;
  border-radius: 999px;
  background: linear-gradient(90deg, #2563eb, #14b8a6, #f59e0b);
}

body.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-trending-card h6 svg,
body.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-trending-card h6 svg * {
  fill: #2563eb !important;
}

body.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-trending-card .card-body {
  padding: 8px 12px 12px !important;
}

body.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-trending-card .trending-item {
  position: relative;
  display: grid !important;
  grid-template-columns: 30px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  margin-top: 7px;
  padding: 10px !important;
  border: 1px solid rgba(148, 163, 184, 0.16) !important;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.72) !important;
  box-shadow: none !important;
  text-decoration: none !important;
}

body.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-trending-card .trending-item:first-child {
  margin-top: 0;
}

body.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-trending-card .trending-item:hover {
  border-color: rgba(37, 99, 235, 0.22) !important;
  background: #ffffff !important;
  transform: translateY(-1px);
}

body.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-trending-card .trending-rank {
  width: 30px;
  height: 30px;
  display: inline-grid;
  place-items: center;
  border-radius: 10px;
  background: linear-gradient(135deg, #2563eb, #14b8a6);
  color: #ffffff;
  font-size: 0.72rem;
  font-weight: 950;
  line-height: 1;
}

body.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-trending-card .trending-copy {
  min-width: 0;
  text-align: left !important;
}

body.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-trending-card .trending-item .hash {
  display: block;
  overflow: hidden;
  color: #12375c !important;
  font-size: 0.9rem !important;
  font-weight: 900 !important;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-trending-card .trending-item .frequency {
  display: block;
  margin-top: 2px;
  color: #6b7f98 !important;
  font-size: 0.68rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

body.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-trending-card .trending-stat {
  display: block !important;
  flex: none !important;
}

body.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-trending-card .trending-stat-value {
  display: inline-flex;
  align-items: baseline;
  gap: 3px;
  min-width: 0;
  padding: 5px 8px;
  border: 1px solid rgba(20, 184, 166, 0.2);
  border-radius: 999px;
  background: rgba(20, 184, 166, 0.1);
  color: #0f766e;
  font-size: 0.78rem;
  font-weight: 950;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}

body.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-trending-card .trending-stat-value small {
  font-size: 0.58rem;
  font-weight: 900;
  text-transform: uppercase;
}

body.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-trending-card .trending-stat-meter {
  display: none !important;
}

body.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-blog-carousel-card .post-media.list {
  border-color: rgba(220, 229, 241, 0.72) !important;
  background: rgba(255, 255, 255, 0.76) !important;
  box-shadow: none !important;
}

body.night-mode.vf-page-index .vf-newsfeed-shell .vf-side-rail .card,
body.night-mode.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-side-card,
body.night-mode.vf-page-index .vf-newsfeed-shell .vf-side-rail .sidebar-meta-widget,
body.night-mode.vf-page-index .vf-newsfeed-shell .vf-side-rail .sidebar-weather-board {
  border-color: rgba(96, 121, 155, 0.28) !important;
  box-shadow: 0 0 30px 0 rgb(0 0 0 / 14%) !important;
}

body.night-mode.vf-page-index .vf-newsfeed-shell .vf-side-rail .card-header,
body.night-mode.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-blog-carousel-header {
  border-bottom-color: rgba(96, 121, 155, 0.28) !important;
  background: linear-gradient(180deg, rgba(20, 31, 47, 0.96), rgba(18, 28, 42, 0.96)) !important;
}

body.night-mode.vf-page-index .vf-newsfeed-shell .vf-side-rail .card-header h6,
body.night-mode.vf-page-index .vf-newsfeed-shell .vf-side-rail .sidebar-widget-heading,
body.night-mode.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-trending-card .trending-item .hash {
  color: #edf5ff !important;
}

body.night-mode.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-trending-card {
  background: linear-gradient(180deg, rgba(20, 33, 53, 0.98) 0%, rgba(15, 23, 42, 0.98) 100%) !important;
}

body.night-mode.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-trending-card .trending-item {
  border-color: rgba(148, 163, 184, 0.14) !important;
  background: rgba(15, 23, 42, 0.58) !important;
}

body.night-mode.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-trending-card .trending-item:hover {
  border-color: rgba(125, 211, 252, 0.22) !important;
  background: rgba(15, 23, 42, 0.8) !important;
}

body.night-mode.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-trending-card .trending-item .frequency {
  color: #91a5bd !important;
}

body.night-mode.vf-page-index .vf-newsfeed-shell .vf-side-rail .vf-trending-card .trending-stat-value {
  border-color: rgba(45, 212, 191, 0.22);
  background: rgba(20, 184, 166, 0.16);
  color: #99f6e4;
}

/* r168 left rail hierarchy and density polish */
html body .main-wrapper .vf-left-rail-slideout {
  border-color: rgba(207, 219, 235, 0.72) !important;
  background: rgba(255, 255, 255, 0.86) !important;
  backdrop-filter: blur(16px);
}

html body .main-wrapper .vf-left-rail-slideout .card-body.with-nav {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  padding: 12px 10px !important;
}

html body .main-wrapper .vf-left-rail-slideout .vf-rail-utility,
html body .main-wrapper .vf-left-rail-slideout .sidebar-section-block,
html body .main-wrapper .vf-left-rail-slideout .sidebar-see-more {
  margin: 0 !important;
}

html body .main-wrapper .vf-left-rail-slideout .vf-rail-quick-actions {
  padding: 10px !important;
  border: 1px solid rgba(207, 219, 235, 0.66) !important;
  border-radius: 16px !important;
  background: linear-gradient(180deg, rgba(248, 251, 255, 0.92), rgba(255, 255, 255, 0.78)) !important;
  box-shadow: none !important;
}

html body .main-wrapper .vf-left-rail-slideout .vf-rail-utility-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  margin-bottom: 8px !important;
}

html body .main-wrapper .vf-left-rail-slideout .vf-rail-utility-head span {
  color: #1d3048 !important;
  font-size: 0.76rem !important;
  font-weight: 950 !important;
  letter-spacing: 0.02em !important;
}

html body .main-wrapper .vf-left-rail-slideout .vf-rail-utility-head small {
  color: #718199 !important;
  font-size: 0.66rem !important;
  font-weight: 800 !important;
}

html body .main-wrapper .vf-left-rail-slideout .vf-rail-action-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 6px !important;
}

html body .main-wrapper .vf-left-rail-slideout .vf-rail-action {
  min-width: 0 !important;
  min-height: 48px !important;
  padding: 7px 5px !important;
  border: 1px solid rgba(207, 219, 235, 0.68) !important;
  border-radius: 13px !important;
  background: rgba(255, 255, 255, 0.8) !important;
  color: #31536b !important;
  box-shadow: none !important;
  font-size: 0.68rem !important;
  font-weight: 850 !important;
  line-height: 1.1 !important;
  text-align: center !important;
}

html body .main-wrapper .vf-left-rail-slideout .vf-rail-action i {
  display: grid !important;
  width: 24px !important;
  height: 24px !important;
  margin: 0 auto 4px !important;
  place-items: center !important;
  border-radius: 9px !important;
  background: rgba(47, 109, 255, 0.1) !important;
  color: #2f6dff !important;
  font-size: 0.78rem !important;
}

html body .main-wrapper .vf-left-rail-slideout .vf-rail-action-primary {
  border-color: rgba(47, 109, 255, 0.24) !important;
  background: linear-gradient(135deg, rgba(47, 109, 255, 0.12), rgba(20, 184, 166, 0.1)) !important;
  color: #173c8c !important;
}

html body .main-wrapper .vf-left-rail-slideout .sidebar-section-block {
  padding: 0 0 9px !important;
  border-bottom: 1px solid rgba(220, 229, 241, 0.62) !important;
}

html body .main-wrapper .vf-left-rail-slideout .sidebar-section-block:last-of-type {
  border-bottom: 0 !important;
}

html body .main-wrapper .vf-left-rail-slideout .sidebar-section-title,
html body .main-wrapper .vf-left-rail-slideout .sidebar-section-toggle {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  min-height: 38px !important;
  padding: 7px 8px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: transparent !important;
  color: #43546b !important;
  font-weight: 900 !important;
}

html body .main-wrapper .vf-left-rail-slideout .sidebar-section-title span,
html body .main-wrapper .vf-left-rail-slideout .sidebar-section-toggle span {
  color: inherit !important;
  font-size: 0.76rem !important;
  font-weight: 950 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
}

html body .main-wrapper .vf-left-rail-slideout .sidebar-section-title .sidebar-section-icon,
html body .main-wrapper .vf-left-rail-slideout .sidebar-section-toggle .sidebar-section-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 25px !important;
  height: 25px !important;
  min-width: 25px !important;
  margin-right: 8px !important;
  border-radius: 9px !important;
  background: rgba(47, 109, 255, 0.08) !important;
  color: #2f6dff !important;
}

html body .main-wrapper .vf-left-rail-slideout .sidebar-section-chevron,
html body .main-wrapper .vf-left-rail-slideout .sidebar-see-more-chevron {
  margin-left: auto !important;
  color: #8a9ab0 !important;
  font-size: 0.72rem !important;
  transition: transform 0.18s ease !important;
}

html body .main-wrapper .vf-left-rail-slideout .sidebar-slideout-open .sidebar-section-chevron,
html body .main-wrapper .vf-left-rail-slideout .sidebar-section-block.is-open .sidebar-section-chevron,
html body .main-wrapper .vf-left-rail-slideout .sidebar-see-more:not(.collapsed) .sidebar-see-more-chevron {
  transform: rotate(-90deg) !important;
  color: #fff !important;
}

html body .main-wrapper .vf-left-rail-slideout .sidebar-section-toggle[aria-expanded="true"] .sidebar-section-chevron,
html body .main-wrapper .vf-left-rail-slideout .sidebar-section-title[aria-expanded="true"] .sidebar-section-chevron {
  color: #fff !important;
}

html body .main-wrapper .vf-left-rail-slideout .sidebar-grid,
html body .main-wrapper .vf-left-rail-slideout .sidebar-quick-grid {
  display: grid !important;
  gap: 6px !important;
}

html body .main-wrapper .vf-left-rail-slideout .sidebar-grid-item,
html body .main-wrapper .vf-left-rail-slideout .sidebar-quick-item,
html body .main-wrapper .vf-left-rail-slideout .sidebar-see-more {
  min-height: 43px !important;
  padding: 8px 10px !important;
  border: 1px solid transparent !important;
  border-radius: 12px !important;
  background: transparent !important;
  color: #2f3f55 !important;
  box-shadow: none !important;
  font-weight: 820 !important;
}

html body .main-wrapper .vf-left-rail-slideout .sidebar-grid-item:hover,
html body .main-wrapper .vf-left-rail-slideout .sidebar-quick-item:hover,
html body .main-wrapper .vf-left-rail-slideout .sidebar-see-more:hover,
html body .main-wrapper .vf-left-rail-slideout .sidebar-section-title:hover {
  border-color: rgba(207, 219, 235, 0.7) !important;
  background: rgba(248, 251, 255, 0.96) !important;
  transform: none !important;
}

html body .main-wrapper .vf-left-rail-slideout .sidebar-grid-item.is-active,
html body .main-wrapper .vf-left-rail-slideout .sidebar-quick-item.is-active {
  border-color: rgba(47, 109, 255, 0.22) !important;
  background: linear-gradient(90deg, rgba(47, 109, 255, 0.13), rgba(20, 184, 166, 0.08)) !important;
  color: #173c8c !important;
  box-shadow: inset 3px 0 0 #2f6dff !important;
}

html body .main-wrapper .vf-left-rail-slideout .sidebar-grid-item .main-icon,
html body .main-wrapper .vf-left-rail-slideout .sidebar-quick-item .main-icon,
html body .main-wrapper .vf-left-rail-slideout .sidebar-see-more .main-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 22px !important;
  height: 22px !important;
  min-width: 22px !important;
  margin-right: 10px !important;
  color: #61728a !important;
}

html body .main-wrapper .vf-left-rail-slideout .sidebar-grid-item.is-active .main-icon,
html body .main-wrapper .vf-left-rail-slideout .sidebar-quick-item.is-active .main-icon {
  color: #2f6dff !important;
}

html body .main-wrapper .vf-left-rail-slideout .vf-rail-recent {
  margin-top: auto !important;
  padding: 10px !important;
  border: 1px solid rgba(207, 219, 235, 0.58) !important;
  border-radius: 16px !important;
  background: rgba(248, 251, 255, 0.72) !important;
  box-shadow: none !important;
}

html body .main-wrapper .vf-left-rail-slideout .vf-rail-shortcut-list {
  display: grid !important;
  gap: 6px !important;
}

html body .main-wrapper .vf-left-rail-slideout .vf-rail-shortcut,
html body .main-wrapper .vf-left-rail-slideout .vf-rail-empty-shortcuts {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 34px !important;
  padding: 6px !important;
  border-radius: 11px !important;
  color: #536680 !important;
  font-size: 0.76rem !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}

html body .main-wrapper .vf-left-rail-slideout .vf-rail-shortcut:hover {
  background: rgba(255, 255, 255, 0.88) !important;
  color: #173c8c !important;
}

html body .main-wrapper .vf-left-rail-slideout .vf-rail-shortcut img {
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  border-radius: 8px !important;
  object-fit: cover !important;
}

html body .main-wrapper .vf-left-rail-slideout .vf-sidebar-floating-panel {
  border-color: rgba(207, 219, 235, 0.72) !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, 0.98) !important;
  box-shadow: 0 22px 54px rgba(15, 23, 42, 0.18) !important;
}

body.night-mode .main-wrapper .vf-left-rail-slideout {
  border-color: rgba(96, 121, 155, 0.28) !important;
  background: rgba(15, 23, 42, 0.88) !important;
}

body.night-mode .main-wrapper .vf-left-rail-slideout .vf-rail-quick-actions,
body.night-mode .main-wrapper .vf-left-rail-slideout .vf-rail-recent {
  border-color: rgba(96, 121, 155, 0.24) !important;
  background: rgba(20, 31, 47, 0.58) !important;
}

body.night-mode .main-wrapper .vf-left-rail-slideout .vf-rail-utility-head span,
body.night-mode .main-wrapper .vf-left-rail-slideout .sidebar-section-title,
body.night-mode .main-wrapper .vf-left-rail-slideout .sidebar-grid-item,
body.night-mode .main-wrapper .vf-left-rail-slideout .sidebar-see-more {
  color: #e8f1ff !important;
}

body.night-mode .main-wrapper .vf-left-rail-slideout .vf-rail-utility-head small,
body.night-mode .main-wrapper .vf-left-rail-slideout .vf-rail-shortcut,
body.night-mode .main-wrapper .vf-left-rail-slideout .vf-rail-empty-shortcuts {
  color: #9fb3ca !important;
}

body.night-mode .main-wrapper .vf-left-rail-slideout .vf-rail-action,
body.night-mode .main-wrapper .vf-left-rail-slideout .sidebar-grid-item,
body.night-mode .main-wrapper .vf-left-rail-slideout .sidebar-quick-item,
body.night-mode .main-wrapper .vf-left-rail-slideout .sidebar-see-more {
  border-color: transparent !important;
  background: transparent !important;
}

body.night-mode .main-wrapper .vf-left-rail-slideout .vf-rail-action {
  border-color: rgba(96, 121, 155, 0.24) !important;
  background: rgba(15, 23, 42, 0.42) !important;
  color: #dce8f8 !important;
}

body.night-mode .main-wrapper .vf-left-rail-slideout .sidebar-grid-item:hover,
body.night-mode .main-wrapper .vf-left-rail-slideout .sidebar-quick-item:hover,
body.night-mode .main-wrapper .vf-left-rail-slideout .sidebar-see-more:hover,
body.night-mode .main-wrapper .vf-left-rail-slideout .sidebar-section-title:hover {
  border-color: rgba(96, 121, 155, 0.26) !important;
  background: rgba(30, 43, 63, 0.68) !important;
}

body.night-mode .main-wrapper .vf-left-rail-slideout .sidebar-grid-item.is-active,
body.night-mode .main-wrapper .vf-left-rail-slideout .sidebar-quick-item.is-active {
  border-color: rgba(96, 165, 250, 0.26) !important;
  background: linear-gradient(90deg, rgba(37, 99, 235, 0.24), rgba(20, 184, 166, 0.14)) !important;
  color: #f7fbff !important;
}

/* r169 account dropdown grouping and hierarchy */
html body .main-wrapper .main-header .vf-account-menu {
  min-width: 292px !important;
  padding: 10px !important;
}

html body .main-wrapper .main-header .vf-account-menu-profile {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-height: 58px !important;
  margin-bottom: 8px !important;
  padding: 9px !important;
  border: 1px solid rgba(207, 219, 235, 0.7) !important;
  border-radius: 14px !important;
  background: linear-gradient(135deg, rgba(47, 109, 255, 0.08), rgba(20, 184, 166, 0.07)) !important;
  color: #172033 !important;
  text-decoration: none !important;
}

html body .main-wrapper .main-header .vf-account-menu-profile:hover {
  border-color: rgba(47, 109, 255, 0.24) !important;
  background: linear-gradient(135deg, rgba(47, 109, 255, 0.12), rgba(20, 184, 166, 0.1)) !important;
}

html body .main-wrapper .main-header .vf-account-menu-profile img {
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  border-radius: 999px !important;
  object-fit: cover !important;
  box-shadow: 0 0 0 2px #ffffff, 0 8px 18px rgba(15, 23, 42, 0.1) !important;
}

html body .main-wrapper .main-header .vf-account-menu-profile span {
  min-width: 0 !important;
}

html body .main-wrapper .main-header .vf-account-menu-profile strong,
html body .main-wrapper .main-header .vf-account-menu-profile small {
  display: block !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html body .main-wrapper .main-header .vf-account-menu-profile strong {
  color: #172033 !important;
  font-size: 0.9rem !important;
  font-weight: 900 !important;
  line-height: 1.15 !important;
}

html body .main-wrapper .main-header .vf-account-menu-profile small {
  margin-top: 3px !important;
  color: #66758b !important;
  font-size: 0.72rem !important;
  font-weight: 750 !important;
  line-height: 1.1 !important;
}

html body .main-wrapper .main-header .vf-account-menu-section {
  padding: 8px 8px 4px !important;
  color: #718199 !important;
  font-size: 0.66rem !important;
  font-weight: 950 !important;
  letter-spacing: 0.08em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}

html body .main-wrapper .main-header .vf-account-menu .dropdown-divider {
  margin: 8px 4px 4px !important;
  border-top-color: rgba(220, 229, 241, 0.76) !important;
}

html body .main-wrapper .main-header .vf-account-menu .dropdown-item {
  min-height: 40px !important;
  padding: 9px 10px !important;
  border-radius: 12px !important;
  color: #26364d !important;
  font-size: 0.84rem !important;
  font-weight: 780 !important;
}

html body .main-wrapper .main-header .vf-account-menu .dropdown-item .badge {
  margin-left: auto !important;
  border: 1px solid rgba(47, 109, 255, 0.16) !important;
  border-radius: 999px !important;
  background: rgba(47, 109, 255, 0.08) !important;
  color: #2457d6 !important;
  font-size: 0.68rem !important;
  font-weight: 900 !important;
}

html body .main-wrapper .main-header .vf-account-menu .dropdown-item.vf-account-menu-danger {
  color: #9f2439 !important;
}

html body .main-wrapper .main-header .vf-account-menu .dropdown-item.vf-account-menu-danger .main-icon,
html body .main-wrapper .main-header .vf-account-menu .dropdown-item.vf-account-menu-danger svg,
html body .main-wrapper .main-header .vf-account-menu .dropdown-item.vf-account-menu-danger i {
  color: #e0485f !important;
  fill: #e0485f !important;
}

html body .main-wrapper .main-header .vf-account-menu .dropdown-item.vf-account-menu-danger:hover,
html body .main-wrapper .main-header .vf-account-menu .dropdown-item.vf-account-menu-danger:focus {
  background: rgba(224, 72, 95, 0.1) !important;
  color: #8f1f32 !important;
}

body.night-mode .main-wrapper .main-header .vf-account-menu-profile {
  border-color: rgba(96, 121, 155, 0.26) !important;
  background: linear-gradient(135deg, rgba(37, 99, 235, 0.18), rgba(20, 184, 166, 0.12)) !important;
  color: #edf5ff !important;
}

body.night-mode .main-wrapper .main-header .vf-account-menu-profile img {
  box-shadow: 0 0 0 2px rgba(15, 23, 42, 0.92), 0 8px 18px rgba(0, 0, 0, 0.24) !important;
}

body.night-mode .main-wrapper .main-header .vf-account-menu-profile strong {
  color: #f7fbff !important;
}

body.night-mode .main-wrapper .main-header .vf-account-menu-profile small,
body.night-mode .main-wrapper .main-header .vf-account-menu-section {
  color: #9fb3ca !important;
}

body.night-mode .main-wrapper .main-header .vf-account-menu .dropdown-divider {
  border-top-color: rgba(96, 121, 155, 0.26) !important;
}

body.night-mode .main-wrapper .main-header .vf-account-menu .dropdown-item .badge {
  border-color: rgba(96, 165, 250, 0.22) !important;
  background: rgba(37, 99, 235, 0.18) !important;
  color: #bfdbfe !important;
}

body.night-mode .main-wrapper .main-header .vf-account-menu .dropdown-item.vf-account-menu-danger {
  color: #fda4af !important;
}

/* r170 accent stripe restraint */
:root {
  --vf-subtle-section-line: rgba(47, 109, 255, 0.18);
}

html body .main-wrapper .card:not(.composer-launcher):not(.vf-stories-card):not(.main-side-nav-card):not(.vf-promo-card):not(.vf-foryou-hero-card):not(.profdash-hero):not(.page-header):not([class*="hero"])::before,
html body .main-wrapper .post::before,
html body.vf-page-index .main-wrapper .vf-newsfeed-shell .card:not(.composer-launcher):not(.vf-stories-card):not(.main-side-nav-card):not(.vf-promo-card):not(.vf-side-card):not(.sidebar-meta-widget):not(.vf-blog-carousel-card):not(.vf-foryou-hero-card):not(.profdash-hero):not(.page-header):not([class*="hero"])::before,
html body.vf-page-index .main-wrapper .vf-newsfeed-shell .post::before {
  display: none !important;
  content: none !important;
  background: none !important;
}

html body .main-wrapper .composer-launcher::before,
html body .main-wrapper .vf-stories-card::before,
html body .main-wrapper .page-header::before,
html body .main-wrapper .vf-foryou-hero-card::before,
html body .main-wrapper .profdash-hero::before,
html body .main-wrapper [class*="hero"]::before {
  display: block !important;
  content: "" !important;
}

html body .main-wrapper .vf-side-rail .card::before,
html body .main-wrapper .vf-side-rail .vf-side-card::before,
html body .main-wrapper .vf-side-rail .sidebar-meta-widget::before,
html body .main-wrapper .vf-side-rail .vf-blog-carousel-card::before,
html body .main-wrapper .vf-side-rail .vf-sponsored-card::before {
  display: none !important;
  content: none !important;
}

html body .main-wrapper .card .card-header,
html body .main-wrapper .vf-side-rail .card-header {
  border-top: 0 !important;
}

html body .main-wrapper .vf-side-rail .card-header::before,
html body .main-wrapper .vf-side-rail .vf-side-card .card-header::before,
html body .main-wrapper .vf-side-rail .vf-sponsored-card .card-header::before,
html body .main-wrapper .vf-side-rail .vf-blog-carousel-card .card-header::before {
  height: 1px !important;
  opacity: 0.55 !important;
  background: var(--vf-subtle-section-line) !important;
}

html body.night-mode .main-wrapper .vf-side-rail .card-header::before,
html body.night-mode .main-wrapper .vf-side-rail .vf-side-card .card-header::before,
html body.night-mode .main-wrapper .vf-side-rail .vf-sponsored-card .card-header::before,
html body.night-mode .main-wrapper .vf-side-rail .vf-blog-carousel-card .card-header::before {
  background: rgba(96, 165, 250, 0.22) !important;
}

/* r171 Vibeforge typography direction: Sora UI + IBM Plex Sans body */
:root {
  --vf-font-ui: "Sora", "IBM Plex Sans", Arial, sans-serif;
  --vf-font-body: "IBM Plex Sans", Arial, sans-serif;
}

html,
body,
.main-wrapper,
.modal,
.dropdown-menu,
.popover,
.tooltip,
.form-control,
textarea,
input,
select,
button {
  font-family: var(--vf-font-body) !important;
  letter-spacing: 0 !important;
}

.main-wrapper .main-header,
.main-wrapper .main-header .navbar,
.main-wrapper .main-header .navbar-wrapper,
.main-wrapper .main-header .navbar-wrapper a,
.main-wrapper .main-header .dropdown-item,
.main-wrapper .main-side-nav,
.main-wrapper .side-nav,
.main-wrapper .sidebar-layout-modern,
.main-wrapper .vf-left-rail-slideout,
.main-wrapper .vf-account-menu,
.main-wrapper .btn,
.main-wrapper .badge,
.main-wrapper .label,
.main-wrapper .nav,
.main-wrapper .nav-tabs,
.main-wrapper .dropdown-toggle,
.main-wrapper .card-header,
.main-wrapper .page-header,
.main-wrapper .publisher-tools-tabs,
.main-wrapper .post-actions,
.main-wrapper .post-stats,
.main-wrapper .vf-posts-filter,
.main-wrapper .vf-side-rail .card-header,
#modal .modal-title,
#modal .btn,
#modal .dropdown-toggle {
  font-family: var(--vf-font-ui) !important;
  letter-spacing: 0 !important;
}

.main-wrapper h1,
.main-wrapper h2,
.main-wrapper h3,
.main-wrapper h4,
.main-wrapper h5,
.main-wrapper h6,
.main-wrapper .h1,
.main-wrapper .h2,
.main-wrapper .h3,
.main-wrapper .h4,
.main-wrapper .h5,
.main-wrapper .h6,
.main-wrapper .post-author,
.main-wrapper .post-title,
.main-wrapper .profile-name,
.main-wrapper .page-title,
.main-wrapper .section-title {
  font-family: var(--vf-font-ui) !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
}

.main-wrapper .main-header,
.main-wrapper .main-side-nav,
.main-wrapper .side-nav,
.main-wrapper .sidebar-layout-modern,
.main-wrapper .vf-left-rail-slideout,
.main-wrapper .btn,
.main-wrapper .dropdown-item,
.main-wrapper .nav-link,
.main-wrapper .card-header,
.main-wrapper .vf-posts-filter,
.main-wrapper .post-actions,
.main-wrapper .post-stats,
#modal .btn {
  font-weight: 650 !important;
}

.main-wrapper p,
.main-wrapper .text-muted,
.main-wrapper .post-text,
.main-wrapper .post-text *:not(i):not(svg),
.main-wrapper .comment-text,
.main-wrapper .card-body,
.main-wrapper .publisher,
.main-wrapper .publisher textarea,
.main-wrapper .js_post-editor-quill-wrap,
.main-wrapper .js_post-editor-quill-wrap .ql-editor,
#modal .modal-body,
#modal .form-control,
#modal textarea,
#modal input,
#modal select {
  font-family: var(--vf-font-body) !important;
  font-weight: 400;
  letter-spacing: 0 !important;
}

.main-wrapper .main-header .navbar-wrapper > ul > li > a,
.main-wrapper .main-header .navbar-wrapper > ul > li > .dropdown-toggle,
.main-wrapper .vf-left-rail-slideout .sidebar-section-title span,
.main-wrapper .vf-account-menu-section,
.main-wrapper .card-header h6,
.main-wrapper .card-header strong,
.main-wrapper .vf-side-rail .card-header h6,
.main-wrapper .btn,
.main-wrapper .badge {
  font-weight: 700 !important;
}

.main-wrapper .post-text,
.main-wrapper .comment-text,
.main-wrapper .card-body,
.main-wrapper .modal-body {
  line-height: 1.52;
}

/* r172 unified launch empty-state pattern */
:root {
  --vf-empty-bg: rgba(255, 255, 255, 0.94);
  --vf-empty-border: rgba(207, 219, 235, 0.78);
  --vf-empty-icon-bg: rgba(47, 109, 255, 0.08);
  --vf-empty-icon-border: rgba(47, 109, 255, 0.14);
  --vf-empty-title: #18243a;
  --vf-empty-copy: #66758b;
}

html body .main-wrapper .vf-memories-empty,
html body .main-wrapper .vf-discover-empty,
html body .main-wrapper .vf-saved-empty,
html body .main-wrapper .vf-search-empty,
html body .main-wrapper .vf-support-empty,
html body .main-wrapper .vf-podcast-empty-state,
html body .main-wrapper .vf-story-archive-empty,
html body .main-wrapper .vf-messages-thread-empty,
html body .main-wrapper .vf-badge-award-empty,
html body .main-wrapper .empty-state,
html body .main-wrapper .no-data,
html body .main-wrapper .text-center.text-muted.mb20:has(.no-data) {
  display: grid !important;
  justify-items: center !important;
  gap: 12px !important;
  width: min(100%, 640px) !important;
  max-width: 640px !important;
  margin: 22px auto 28px !important;
  padding: clamp(28px, 4vw, 40px) clamp(22px, 4vw, 34px) !important;
  border: 1px solid var(--vf-empty-border) !important;
  border-radius: 20px !important;
  background: var(--vf-empty-bg) !important;
  box-shadow: var(--vf-launch-card-shadow, 0 0 30px rgba(82, 63, 105, 0.05)) !important;
  color: var(--vf-empty-copy) !important;
  text-align: center !important;
}

html body .main-wrapper .vf-support-empty {
  border-radius: 0 0 18px 18px !important;
  margin: 0 !important;
  max-width: none !important;
  width: 100% !important;
}

html body .main-wrapper .vf-memories-empty-icon,
html body .main-wrapper .vf-discover-empty-icon,
html body .main-wrapper .vf-saved-empty-icon,
html body .main-wrapper .vf-search-empty-icon,
html body .main-wrapper .vf-support-empty-icon,
html body .main-wrapper .vf-podcast-empty-state i,
html body .main-wrapper .vf-story-archive-empty-icon,
html body .main-wrapper .vf-badge-award-empty i,
html body .main-wrapper .empty-state i,
html body .main-wrapper .no-data svg,
html body .main-wrapper .text-center.text-muted.mb20:has(.no-data) svg {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 58px !important;
  height: 58px !important;
  min-width: 58px !important;
  margin: 0 auto 2px !important;
  border: 1px solid var(--vf-empty-icon-border) !important;
  border-radius: 18px !important;
  background: var(--vf-empty-icon-bg) !important;
  color: #315cff !important;
  font-size: 1.22rem !important;
  box-shadow: none !important;
}

html body .main-wrapper .no-data svg,
html body .main-wrapper .text-center.text-muted.mb20:has(.no-data) svg {
  padding: 14px !important;
}

html body .main-wrapper .vf-memories-empty-title,
html body .main-wrapper .vf-discover-empty-title,
html body .main-wrapper .vf-saved-empty-title,
html body .main-wrapper .vf-search-empty-title,
html body .main-wrapper .vf-support-empty-title,
html body .main-wrapper .vf-podcast-empty-state strong,
html body .main-wrapper .vf-story-archive-empty strong,
html body .main-wrapper .empty-state strong,
html body .main-wrapper .empty-state h3,
html body .main-wrapper .empty-state h4,
html body .main-wrapper .no-data strong {
  margin: 0 !important;
  color: var(--vf-empty-title) !important;
  font-family: var(--vf-font-ui, "Sora", Arial, sans-serif) !important;
  font-size: 1.02rem !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  letter-spacing: 0 !important;
}

html body .main-wrapper .vf-memories-empty-copy,
html body .main-wrapper .vf-discover-empty-copy,
html body .main-wrapper .vf-saved-empty-copy,
html body .main-wrapper .vf-search-empty-copy,
html body .main-wrapper .vf-support-empty-copy,
html body .main-wrapper .vf-podcast-empty-state span,
html body .main-wrapper .vf-story-archive-empty p,
html body .main-wrapper .empty-state p,
html body .main-wrapper .no-data,
html body .main-wrapper .text-center.text-muted.mb20:has(.no-data) {
  max-width: 500px !important;
  color: var(--vf-empty-copy) !important;
  font-family: var(--vf-font-body, "IBM Plex Sans", Arial, sans-serif) !important;
  font-size: 0.94rem !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
}

html body .main-wrapper .vf-memories-empty-action,
html body .main-wrapper .vf-discover-empty-action,
html body .main-wrapper .vf-saved-empty-action,
html body .main-wrapper .vf-support-empty-action,
html body .main-wrapper .empty-state .btn {
  min-height: 40px !important;
  margin-top: 4px !important;
  padding: 0 18px !important;
  border-radius: 999px !important;
  font-family: var(--vf-font-ui, "Sora", Arial, sans-serif) !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  line-height: 40px !important;
  text-transform: none !important;
}

body.night-mode .main-wrapper .vf-memories-empty,
body.night-mode .main-wrapper .vf-discover-empty,
body.night-mode .main-wrapper .vf-saved-empty,
body.night-mode .main-wrapper .vf-search-empty,
body.night-mode .main-wrapper .vf-support-empty,
body.night-mode .main-wrapper .vf-podcast-empty-state,
body.night-mode .main-wrapper .vf-story-archive-empty,
body.night-mode .main-wrapper .vf-messages-thread-empty,
body.night-mode .main-wrapper .vf-badge-award-empty,
body.night-mode .main-wrapper .empty-state,
body.night-mode .main-wrapper .no-data,
body.night-mode .main-wrapper .text-center.text-muted.mb20:has(.no-data) {
  border-color: rgba(96, 121, 155, 0.3) !important;
  background: rgba(18, 28, 42, 0.88) !important;
  box-shadow: var(--vf-launch-card-shadow, 0 0 30px rgba(0, 0, 0, 0.22)) !important;
  color: #aebfd5 !important;
}

body.night-mode .main-wrapper .vf-memories-empty-icon,
body.night-mode .main-wrapper .vf-discover-empty-icon,
body.night-mode .main-wrapper .vf-saved-empty-icon,
body.night-mode .main-wrapper .vf-search-empty-icon,
body.night-mode .main-wrapper .vf-support-empty-icon,
body.night-mode .main-wrapper .vf-podcast-empty-state i,
body.night-mode .main-wrapper .vf-story-archive-empty-icon,
body.night-mode .main-wrapper .vf-badge-award-empty i,
body.night-mode .main-wrapper .empty-state i,
body.night-mode .main-wrapper .no-data svg,
body.night-mode .main-wrapper .text-center.text-muted.mb20:has(.no-data) svg {
  border-color: rgba(96, 165, 250, 0.22) !important;
  background: rgba(37, 99, 235, 0.14) !important;
  color: #93c5fd !important;
}

body.night-mode .main-wrapper .vf-memories-empty-title,
body.night-mode .main-wrapper .vf-discover-empty-title,
body.night-mode .main-wrapper .vf-saved-empty-title,
body.night-mode .main-wrapper .vf-search-empty-title,
body.night-mode .main-wrapper .vf-support-empty-title,
body.night-mode .main-wrapper .vf-podcast-empty-state strong,
body.night-mode .main-wrapper .vf-story-archive-empty strong,
body.night-mode .main-wrapper .empty-state strong,
body.night-mode .main-wrapper .empty-state h3,
body.night-mode .main-wrapper .empty-state h4,
body.night-mode .main-wrapper .no-data strong {
  color: #f3f8ff !important;
}

body.night-mode .main-wrapper .vf-memories-empty-copy,
body.night-mode .main-wrapper .vf-discover-empty-copy,
body.night-mode .main-wrapper .vf-saved-empty-copy,
body.night-mode .main-wrapper .vf-search-empty-copy,
body.night-mode .main-wrapper .vf-support-empty-copy,
body.night-mode .main-wrapper .vf-podcast-empty-state span,
body.night-mode .main-wrapper .vf-story-archive-empty p,
body.night-mode .main-wrapper .empty-state p,
body.night-mode .main-wrapper .no-data,
body.night-mode .main-wrapper .text-center.text-muted.mb20:has(.no-data) {
  color: #aebfd5 !important;
}

@media (max-width: 575.98px) {
  html body .main-wrapper .vf-memories-empty,
  html body .main-wrapper .vf-discover-empty,
  html body .main-wrapper .vf-saved-empty,
  html body .main-wrapper .vf-search-empty,
  html body .main-wrapper .vf-support-empty,
  html body .main-wrapper .vf-podcast-empty-state,
  html body .main-wrapper .vf-story-archive-empty,
  html body .main-wrapper .vf-messages-thread-empty,
  html body .main-wrapper .vf-badge-award-empty,
  html body .main-wrapper .empty-state,
  html body .main-wrapper .no-data,
  html body .main-wrapper .text-center.text-muted.mb20:has(.no-data) {
    width: 100% !important;
    margin: 16px auto 22px !important;
    padding: 26px 18px !important;
    border-radius: 18px !important;
  }
}

/* r173 launch typography scale normalization */
:root {
  --vf-type-hero: clamp(2.05rem, 3.1vw, 3rem);
  --vf-type-page-title: clamp(1.42rem, 2vw, 1.82rem);
  --vf-type-section-title: 1rem;
  --vf-type-card-title: 0.94rem;
  --vf-type-body: 0.95rem;
  --vf-type-meta: 0.78rem;
  --vf-type-control: 0.8rem;
  --vf-type-micro: 0.7rem;
}

html body .main-wrapper .page-header h1,
html body .main-wrapper .page-header .h1,
html body .main-wrapper [class*="hero"] h1,
html body .main-wrapper [class*="hero"] .h1,
html body .main-wrapper .vf-events-hero-title,
html body .main-wrapper .vf-local-hero-title,
html body .main-wrapper .vf-games-hero-title,
html body .main-wrapper .vf-world-hero-title,
html body .main-wrapper .vf-foryou-hero-title,
html body .main-wrapper .profdash-hero-title {
  font-family: var(--vf-font-ui, "Sora", Arial, sans-serif) !important;
  font-size: var(--vf-type-hero) !important;
  font-weight: 700 !important;
  line-height: 1.08 !important;
  letter-spacing: 0 !important;
}

html body .main-wrapper .page-header h2,
html body .main-wrapper .page-header .h2,
html body .main-wrapper [class*="hero"] h2,
html body .main-wrapper [class*="hero"] .h2,
html body .main-wrapper .profile-name,
html body .main-wrapper .page-title {
  font-family: var(--vf-font-ui, "Sora", Arial, sans-serif) !important;
  font-size: var(--vf-type-page-title) !important;
  font-weight: 700 !important;
  line-height: 1.14 !important;
  letter-spacing: 0 !important;
}

html body .main-wrapper .page-header p,
html body .main-wrapper [class*="hero"] p,
html body .main-wrapper .vf-events-hero-subtitle,
html body .main-wrapper .vf-local-hero .vf-events-hero-subtitle,
html body .main-wrapper .vf-games-hero .vf-events-hero-subtitle,
html body .main-wrapper .profdash-hero-copy {
  font-family: var(--vf-font-body, "IBM Plex Sans", Arial, sans-serif) !important;
  font-size: clamp(0.94rem, 1.1vw, 1.05rem) !important;
  font-weight: 400 !important;
  line-height: 1.52 !important;
  letter-spacing: 0 !important;
}

html body .main-wrapper .card-header h5,
html body .main-wrapper .card-header h6,
html body .main-wrapper .card-header strong,
html body .main-wrapper .section-title,
html body .main-wrapper .sidebar-widget-heading,
html body .main-wrapper .vf-side-rail .card-header h6,
html body .main-wrapper .vf-blog-carousel-header h6,
html body .main-wrapper .modal-title {
  font-family: var(--vf-font-ui, "Sora", Arial, sans-serif) !important;
  font-size: var(--vf-type-section-title) !important;
  font-weight: 700 !important;
  line-height: 1.22 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

html body .main-wrapper .post-title,
html body .main-wrapper .post-author,
html body .main-wrapper .user-popover-name,
html body .main-wrapper .post-media-meta .title,
html body .main-wrapper .blog-content h3,
html body .main-wrapper .vf-page-card-title,
html body .main-wrapper .vf-group-card-title,
html body .main-wrapper .directory-card-title,
html body .main-wrapper .card-title {
  font-family: var(--vf-font-ui, "Sora", Arial, sans-serif) !important;
  font-size: var(--vf-type-card-title) !important;
  font-weight: 700 !important;
  line-height: 1.28 !important;
  letter-spacing: 0 !important;
}

html body .main-wrapper .post-text,
html body .main-wrapper .comment-text,
html body .main-wrapper .card-body,
html body .main-wrapper .card-body p,
html body .main-wrapper .publisher,
html body .main-wrapper .publisher textarea,
html body .main-wrapper .js_post-editor-quill-wrap .ql-editor,
html body #modal .modal-body,
html body #modal .modal-body p {
  font-family: var(--vf-font-body, "IBM Plex Sans", Arial, sans-serif) !important;
  font-size: var(--vf-type-body) !important;
  font-weight: 400 !important;
  line-height: 1.52 !important;
  letter-spacing: 0 !important;
}

html body .main-wrapper .text-muted,
html body .main-wrapper .post-time,
html body .main-wrapper .post-meta,
html body .main-wrapper .metadata,
html body .main-wrapper .meta,
html body .main-wrapper .profile-header-meta,
html body .main-wrapper .profile-header-meta-item,
html body .main-wrapper .profle-meta-wrapper,
html body .main-wrapper .vf-page-card-meta,
html body .main-wrapper .vf-group-card-meta,
html body .main-wrapper .trending-item .frequency,
html body .main-wrapper .sidebar-meta-datetime,
html body .main-wrapper .sidebar-weather-day,
html body .main-wrapper small {
  font-family: var(--vf-font-body, "IBM Plex Sans", Arial, sans-serif) !important;
  font-size: var(--vf-type-meta) !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
  letter-spacing: 0 !important;
}

html body .main-wrapper .btn,
html body .main-wrapper button.btn,
html body .main-wrapper a.btn,
html body .main-wrapper .dropdown-item,
html body .main-wrapper .dropdown-toggle,
html body .main-wrapper .nav-link,
html body .main-wrapper .vf-posts-filter .btn,
html body .main-wrapper .post-actions .action-btn,
html body #modal .btn,
html body #modal .dropdown-toggle {
  font-family: var(--vf-font-ui, "Sora", Arial, sans-serif) !important;
  font-size: var(--vf-type-control) !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

html body .main-wrapper .badge,
html body .main-wrapper .label,
html body .main-wrapper .vf-account-menu-section,
html body .main-wrapper .sidebar-section-title span,
html body .main-wrapper .vf-left-rail-slideout .sidebar-section-title span,
html body .main-wrapper .vf-events-hero-kicker,
html body .main-wrapper .vf-workspace-eyebrow,
html body .main-wrapper .vf-podcasts-page .vf-podcast-eyebrow,
html body .main-wrapper .vf-search-suggestions-kicker {
  font-family: var(--vf-font-ui, "Sora", Arial, sans-serif) !important;
  font-size: var(--vf-type-micro) !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: 0.02em !important;
  text-transform: none !important;
}

html body .main-wrapper .main-header .navbar-wrapper > ul > li > a,
html body .main-wrapper .main-header .navbar-wrapper > ul > li > .dropdown-toggle,
html body .main-wrapper .main-side-nav a,
html body .main-wrapper .side-nav a,
html body .main-wrapper .sidebar-layout-modern a,
html body .main-wrapper .vf-left-rail-slideout a {
  font-family: var(--vf-font-ui, "Sora", Arial, sans-serif) !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

@media (max-width: 575.98px) {
  :root {
    --vf-type-hero: clamp(1.72rem, 8vw, 2.18rem);
    --vf-type-page-title: clamp(1.24rem, 5.4vw, 1.52rem);
    --vf-type-section-title: 0.94rem;
    --vf-type-card-title: 0.9rem;
    --vf-type-body: 0.93rem;
    --vf-type-control: 0.74rem;
  }
}

/* r174 unified interaction and focus polish */
:root {
  --vf-focus-ring: 0 0 0 3px rgba(47, 109, 255, 0.22), 0 0 0 1px rgba(47, 109, 255, 0.42);
  --vf-focus-ring-strong: 0 0 0 4px rgba(47, 109, 255, 0.24), 0 0 0 1px rgba(47, 109, 255, 0.52);
  --vf-active-bg: rgba(47, 109, 255, 0.1);
  --vf-active-border: rgba(47, 109, 255, 0.26);
}

html body .main-wrapper a:focus-visible,
html body .main-wrapper button:focus-visible,
html body .main-wrapper [role="button"]:focus-visible,
html body .main-wrapper .btn:focus-visible,
html body .main-wrapper .dropdown-item:focus-visible,
html body .main-wrapper .nav-link:focus-visible,
html body .main-wrapper .form-control:focus-visible,
html body .main-wrapper .form-select:focus-visible,
html body .main-wrapper textarea:focus-visible,
html body #modal a:focus-visible,
html body #modal button:focus-visible,
html body #modal [role="button"]:focus-visible,
html body #modal .btn:focus-visible,
html body #modal .dropdown-item:focus-visible,
html body #modal .form-control:focus-visible,
html body #modal .form-select:focus-visible,
html body #modal textarea:focus-visible,
html body .footer-bottom-bar-links .link > a:focus-visible {
  outline: 0 !important;
  box-shadow: var(--vf-focus-ring) !important;
}

html body .main-wrapper .main-header a:focus-visible,
html body .main-wrapper .main-header button:focus-visible,
html body .main-wrapper .main-header .dropdown-toggle:focus-visible,
html body .main-wrapper .footer-bottom-bar-links .link > a:focus-visible,
html body .main-wrapper .post-actions .action-btn:focus-visible,
html body .main-wrapper .publisher-tools-quick button:focus-visible {
  box-shadow: var(--vf-focus-ring-strong) !important;
}

html body .main-wrapper .form-control:focus,
html body .main-wrapper .form-select:focus,
html body .main-wrapper textarea:focus,
html body #modal .form-control:focus,
html body #modal .form-select:focus,
html body #modal textarea:focus {
  border-color: rgba(47, 109, 255, 0.42) !important;
  box-shadow: var(--vf-focus-ring) !important;
}

html body .main-wrapper .dropdown-menu .dropdown-item:focus,
html body .main-wrapper .dropdown-menu .dropdown-item:hover,
html body #modal .dropdown-menu .dropdown-item:focus,
html body #modal .dropdown-menu .dropdown-item:hover {
  background: var(--vf-active-bg) !important;
  color: #173c8c !important;
}

html body .main-wrapper .nav-tabs .nav-link.active,
html body .main-wrapper .nav-pills .nav-link.active,
html body .main-wrapper .content-tabs li.active a,
html body .main-wrapper .content-tabs a.active,
html body .main-wrapper .side-nav li.active a,
html body .main-wrapper .main-side-nav li.active a,
html body .main-wrapper .sidebar-layout-modern .sidebar-grid-item.is-active,
html body .main-wrapper .sidebar-layout-modern .sidebar-quick-item.is-active,
html body .main-wrapper .vf-left-rail-slideout .sidebar-grid-item.is-active,
html body .main-wrapper .vf-left-rail-slideout .sidebar-quick-item.is-active,
html body .footer-bottom-bar-links .link.active > a {
  border-color: var(--vf-active-border) !important;
  background: var(--vf-active-bg) !important;
  color: #173c8c !important;
  font-weight: 700 !important;
}

html body .main-wrapper .btn:hover,
html body .main-wrapper .btn:focus-visible,
html body #modal .btn:hover,
html body #modal .btn:focus-visible,
html body .main-wrapper .post-actions .action-btn:hover,
html body .main-wrapper .post-actions .action-btn:focus-visible,
html body .main-wrapper .publisher-tools-quick button:hover,
html body .main-wrapper .publisher-tools-quick button:focus-visible {
  transform: translateY(-1px);
}

html body .main-wrapper .btn:active,
html body #modal .btn:active,
html body .main-wrapper .post-actions .action-btn:active,
html body .main-wrapper .publisher-tools-quick button:active,
html body .footer-bottom-bar-links .link > a:active {
  transform: translateY(0) scale(0.985) !important;
}

html body .main-wrapper .card:focus-within:not(.post):not(.composer-launcher):not(.vf-stories-card),
html body .main-wrapper .post:focus-within,
html body .main-wrapper .vf-side-rail .card:focus-within {
  border-color: rgba(47, 109, 255, 0.22) !important;
  box-shadow: var(--vf-launch-card-shadow, 0 0 30px rgba(82, 63, 105, 0.05)), 0 0 0 1px rgba(47, 109, 255, 0.12) !important;
}

body.night-mode {
  --vf-focus-ring: 0 0 0 3px rgba(96, 165, 250, 0.22), 0 0 0 1px rgba(147, 197, 253, 0.48);
  --vf-focus-ring-strong: 0 0 0 4px rgba(96, 165, 250, 0.24), 0 0 0 1px rgba(147, 197, 253, 0.58);
  --vf-active-bg: rgba(96, 165, 250, 0.14);
  --vf-active-border: rgba(96, 165, 250, 0.3);
}

body.night-mode .main-wrapper .dropdown-menu .dropdown-item:focus,
body.night-mode .main-wrapper .dropdown-menu .dropdown-item:hover,
body.night-mode #modal .dropdown-menu .dropdown-item:focus,
body.night-mode #modal .dropdown-menu .dropdown-item:hover {
  background: var(--vf-active-bg) !important;
  color: #f7fbff !important;
}

body.night-mode .main-wrapper .nav-tabs .nav-link.active,
body.night-mode .main-wrapper .nav-pills .nav-link.active,
body.night-mode .main-wrapper .content-tabs li.active a,
body.night-mode .main-wrapper .content-tabs a.active,
body.night-mode .main-wrapper .side-nav li.active a,
body.night-mode .main-wrapper .main-side-nav li.active a,
body.night-mode .main-wrapper .sidebar-layout-modern .sidebar-grid-item.is-active,
body.night-mode .main-wrapper .sidebar-layout-modern .sidebar-quick-item.is-active,
body.night-mode .main-wrapper .vf-left-rail-slideout .sidebar-grid-item.is-active,
body.night-mode .main-wrapper .vf-left-rail-slideout .sidebar-quick-item.is-active,
body.night-mode .footer-bottom-bar-links .link.active > a {
  border-color: var(--vf-active-border) !important;
  background: var(--vf-active-bg) !important;
  color: #f7fbff !important;
}

/* r175 hero image credit consistency */
:root {
  --vf-hero-credit-bg: rgba(5, 12, 24, 0.68);
  --vf-hero-credit-border: rgba(255, 255, 255, 0.24);
}

html body .main-wrapper .page-header,
html body .main-wrapper .page-header[class*="hero"],
html body .main-wrapper [class*="hero-card"],
html body .main-wrapper [class*="-hero"],
html body .main-wrapper .vf-lifted-hero-wrap,
html body .main-wrapper .vf-feed-hero-wrap {
  position: relative !important;
}

html body .main-wrapper .vf-unsplash-credit,
html body .main-wrapper .vf-unsplash-hero-credit,
html body .main-wrapper .vf-hero-credit,
html body .main-wrapper .vf-feed-hero-credit,
html body .main-wrapper .unsplash-credit,
html body .main-wrapper .photo-credit,
html body .main-wrapper [class*="credit"][class*="hero"] {
  position: absolute !important;
  top: auto !important;
  right: clamp(12px, 1.5vw, 20px) !important;
  bottom: clamp(10px, 1.4vw, 18px) !important;
  left: auto !important;
  z-index: 40 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  width: auto !important;
  max-width: min(420px, calc(100% - 32px)) !important;
  min-height: 24px !important;
  padding: 6px 10px !important;
  border: 1px solid var(--vf-hero-credit-border) !important;
  border-radius: 999px !important;
  background: var(--vf-hero-credit-bg) !important;
  color: #ffffff !important;
  font-family: var(--vf-font-body, "IBM Plex Sans", Arial, sans-serif) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  letter-spacing: 0 !important;
  text-align: right !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.22) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  transform: none !important;
  pointer-events: auto !important;
}

html body .main-wrapper .vf-unsplash-credit:hover,
html body .main-wrapper .vf-unsplash-hero-credit:hover,
html body .main-wrapper .vf-hero-credit:hover,
html body .main-wrapper .vf-feed-hero-credit:hover,
html body .main-wrapper .unsplash-credit:hover,
html body .main-wrapper .photo-credit:hover,
html body .main-wrapper [class*="credit"][class*="hero"]:hover {
  background: rgba(5, 12, 24, 0.78) !important;
  color: #ffffff !important;
  text-decoration: none !important;
}

html body.vf-page-for_you .main-wrapper .vf-foryou-hero-card .vf-unsplash-hero-credit,
html body.vf-page-for_you .main-wrapper .vf-foryou-hero-card .vf-unsplash-credit,
html body.vf-page-for_you .main-wrapper .vf-foryou-hero-card .vf-hero-credit,
html body.vf-page-for_you .main-wrapper .vf-foryou-hero-card .photo-credit {
  right: clamp(14px, 1.7vw, 22px) !important;
  bottom: clamp(12px, 1.7vw, 22px) !important;
  max-width: min(420px, calc(100% - 44px)) !important;
}

@media (max-width: 575.98px) {
  html body .main-wrapper .vf-unsplash-credit,
  html body .main-wrapper .vf-unsplash-hero-credit,
  html body .main-wrapper .vf-hero-credit,
  html body .main-wrapper .vf-feed-hero-credit,
  html body .main-wrapper .unsplash-credit,
  html body .main-wrapper .photo-credit,
  html body .main-wrapper [class*="credit"][class*="hero"] {
    right: 10px !important;
    bottom: 10px !important;
    max-width: calc(100% - 20px) !important;
    min-height: 22px !important;
    padding: 5px 8px !important;
    font-size: 10px !important;
  }
}

/* r176 restore default feed left rail top alignment */
@media (min-width: 768px) {
  html body.vf-page-index.vf-view-default .main-wrapper .main-side-nav-card.vf-left-rail-slideout {
    top: calc(82px + env(safe-area-inset-top, 0px)) !important;
  }

  html body.vf-page-index.vf-view-default .main-wrapper .vf-left-rail-slideout .sidebar-layout-modern {
    max-height: calc(100vh - 104px - env(safe-area-inset-top, 0px)) !important;
  }
}

/* r177 restrained page depth and surface polish */
:root {
  --vf-page-bg: #edf3f7;
  --vf-page-bg-dark: #07111f;
  --vf-surface-border: rgba(207, 219, 235, 0.82);
  --vf-surface-divider: rgba(220, 229, 241, 0.76);
  --vf-surface-shadow: 0 10px 28px rgba(30, 51, 86, 0.075);
  --vf-surface-shadow-hover: 0 14px 34px rgba(30, 51, 86, 0.095);
}

html body:not(.night-mode) {
  background-color: var(--vf-page-bg) !important;
}

html body:not(.night-mode) .main-wrapper {
  background-color: transparent !important;
}

html body:not(.night-mode) .main-wrapper .card:not(.bg-transparent):not(.bg-red):not(.bg-blue):not(.bg-green):not(.bg-purple):not(.bg-orange):not(.bg-black):not(.bg-primary):not(.bg-info):not(.bg-success):not(.bg-danger):not(.bg-warning):not(.bg-dark),
html body:not(.night-mode) .main-wrapper .post,
html body:not(.night-mode) .main-wrapper .ui-box,
html body:not(.night-mode) .main-wrapper .content-panel,
html body:not(.night-mode) .main-wrapper .vf-page-card,
html body:not(.night-mode) .main-wrapper .vf-group-card,
html body:not(.night-mode) .main-wrapper .vf-side-card,
html body:not(.night-mode) .main-wrapper .vf-sidebar-module-shell .card,
html body:not(.night-mode) .main-wrapper .vf-directory-shell .card,
html body:not(.night-mode) .main-wrapper .vf-games-shell .card,
html body:not(.night-mode) .main-wrapper .vf-local-page-content .card {
  border-color: var(--vf-surface-border) !important;
  box-shadow: var(--vf-surface-shadow) !important;
}

html body:not(.night-mode) .main-wrapper .card:not(.bg-transparent):not(.bg-red):not(.bg-blue):not(.bg-green):not(.bg-purple):not(.bg-orange):not(.bg-black):not(.bg-primary):not(.bg-info):not(.bg-success):not(.bg-danger):not(.bg-warning):not(.bg-dark):hover,
html body:not(.night-mode) .main-wrapper .post:hover,
html body:not(.night-mode) .main-wrapper .vf-page-card:hover,
html body:not(.night-mode) .main-wrapper .vf-group-card:hover {
  box-shadow: var(--vf-surface-shadow-hover) !important;
}

html body:not(.night-mode) .main-wrapper .card-header,
html body:not(.night-mode) .main-wrapper .card-footer,
html body:not(.night-mode) .main-wrapper .post-footer,
html body:not(.night-mode) .main-wrapper .comments,
html body:not(.night-mode) .main-wrapper .comment,
html body:not(.night-mode) .main-wrapper .content-tabs,
html body:not(.night-mode) .main-wrapper .vf-posts-filter,
html body:not(.night-mode) .main-wrapper .table thead th,
html body:not(.night-mode) .main-wrapper .table td,
html body:not(.night-mode) .main-wrapper .table th {
  border-color: var(--vf-surface-divider) !important;
}

html body:not(.night-mode) .main-wrapper .sg-offcanvas,
html body:not(.night-mode) .main-wrapper .vf-for-you-shell,
html body:not(.night-mode) .main-wrapper .vf-directory-shell,
html body:not(.night-mode) .main-wrapper .vf-sidebar-module-shell,
html body:not(.night-mode) .main-wrapper .vf-local-page-content,
html body:not(.night-mode) .main-wrapper .vf-world-directory-shell,
html body:not(.night-mode) .main-wrapper .vf-launchpad-shell,
html body:not(.night-mode) .main-wrapper .vf-games-shell,
html body:not(.night-mode) .main-wrapper .vf-dashboard-shell,
html body:not(.night-mode) .main-wrapper .vf-podcasts-page {
  border-color: rgba(207, 219, 235, 0.42) !important;
}

html body:not(.night-mode) .main-wrapper .publisher,
html body:not(.night-mode) .main-wrapper .composer-launcher,
html body:not(.night-mode) .main-wrapper .vf-stories-card,
html body:not(.night-mode) .main-wrapper .vf-left-rail-slideout,
html body:not(.night-mode) .main-wrapper .vf-side-rail .card,
html body:not(.night-mode) .main-wrapper .vf-side-rail .sidebar-weather-board {
  box-shadow: var(--vf-surface-shadow) !important;
}

body.night-mode {
  --vf-surface-border: rgba(96, 121, 155, 0.3);
  --vf-surface-divider: rgba(96, 121, 155, 0.24);
  --vf-surface-shadow: 0 14px 36px rgba(0, 0, 0, 0.24);
  --vf-surface-shadow-hover: 0 18px 42px rgba(0, 0, 0, 0.32);
  background-color: var(--vf-page-bg-dark) !important;
}

body.night-mode .main-wrapper {
  background-color: transparent !important;
}

body.night-mode .main-wrapper .card:not(.bg-transparent),
body.night-mode .main-wrapper .post,
body.night-mode .main-wrapper .ui-box,
body.night-mode .main-wrapper .content-panel,
body.night-mode .main-wrapper .vf-page-card,
body.night-mode .main-wrapper .vf-group-card,
body.night-mode .main-wrapper .vf-side-card,
body.night-mode .main-wrapper .vf-sidebar-module-shell .card,
body.night-mode .main-wrapper .vf-directory-shell .card,
body.night-mode .main-wrapper .vf-games-shell .card,
body.night-mode .main-wrapper .vf-local-page-content .card {
  border-color: var(--vf-surface-border) !important;
  box-shadow: var(--vf-surface-shadow) !important;
}

body.night-mode .main-wrapper .card-header,
body.night-mode .main-wrapper .card-footer,
body.night-mode .main-wrapper .post-footer,
body.night-mode .main-wrapper .comments,
body.night-mode .main-wrapper .comment,
body.night-mode .main-wrapper .content-tabs,
body.night-mode .main-wrapper .vf-posts-filter,
body.night-mode .main-wrapper .table thead th,
body.night-mode .main-wrapper .table td,
body.night-mode .main-wrapper .table th {
  border-color: var(--vf-surface-divider) !important;
}

/* r178 games page density and hierarchy polish */
html body.vf-page-games .main-wrapper .vf-sidebar-module-shell {
  margin-top: -18px !important;
}

html body.vf-page-games .main-wrapper .vf-sidebar-module-shell .vf-games-tabs {
  margin-bottom: 12px !important;
  border: 1px solid rgba(207, 219, 235, 0.82) !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, 0.92) !important;
  box-shadow: var(--vf-surface-shadow, 0 10px 28px rgba(30, 51, 86, 0.075)) !important;
}

html body.vf-page-games .main-wrapper .vf-sidebar-module-shell .vf-games-tabs ul {
  grid-template-columns: repeat(auto-fit, minmax(118px, 1fr)) !important;
  gap: 6px !important;
  padding: 8px !important;
}

html body.vf-page-games .main-wrapper .vf-sidebar-module-shell .vf-games-tabs li a {
  min-height: 40px !important;
  padding: 9px 10px !important;
  border: 1px solid transparent !important;
  border-radius: 12px !important;
  background: transparent !important;
  color: #42556f !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
}

html body.vf-page-games .main-wrapper .vf-sidebar-module-shell .vf-games-tabs li.active a,
html body.vf-page-games .main-wrapper .vf-sidebar-module-shell .vf-games-tabs li a:hover {
  border-color: rgba(47, 109, 255, 0.2) !important;
  background: rgba(47, 109, 255, 0.08) !important;
  color: #173c8c !important;
}

html body.vf-page-games .main-wrapper .vf-platform-dashboard {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin: 0 0 16px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body.vf-page-games .main-wrapper .vf-platform-dashboard-item {
  flex: 0 1 auto !important;
  min-width: 0 !important;
  min-height: 34px !important;
  padding: 8px 11px !important;
  border: 1px solid rgba(207, 219, 235, 0.74) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.72) !important;
  color: #43546b !important;
  box-shadow: none !important;
  font-size: 0.76rem !important;
  font-weight: 700 !important;
}

html body.vf-page-games .main-wrapper .vf-platform-dashboard-item i {
  width: auto !important;
  height: auto !important;
  margin: 0 6px 0 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #315cff !important;
  font-size: 0.82rem !important;
}

html body.vf-page-games .main-wrapper .vf-platform-dashboard-item:hover {
  border-color: rgba(47, 109, 255, 0.22) !important;
  background: rgba(255, 255, 255, 0.94) !important;
  color: #173c8c !important;
}

html body.vf-page-games .main-wrapper .vf-sidebar-module-shell > .row {
  row-gap: 18px !important;
}

html body.vf-page-games .main-wrapper .vf-sidebar-module-shell .sg-offcanvas-sidebar > .card,
html body.vf-page-games .main-wrapper .vf-sidebar-module-shell .sg-offcanvas-sidebar .card.shadow-sm {
  overflow: hidden !important;
  border-radius: 18px !important;
}

html body.vf-page-games .main-wrapper .vf-sidebar-module-shell .sg-offcanvas-sidebar .card-header[style] {
  background: rgba(18, 36, 64, 0.96) !important;
  color: #ffffff !important;
}

html body.vf-page-games .main-wrapper .vf-sidebar-module-shell .side-nav li a {
  min-height: 38px !important;
  padding: 9px 12px !important;
  color: #43546b !important;
  font-size: 0.78rem !important;
  font-weight: 650 !important;
}

html body.vf-page-games .main-wrapper .vf-sidebar-module-shell .side-nav li.active a,
html body.vf-page-games .main-wrapper .vf-sidebar-module-shell .side-nav li a:hover {
  background: rgba(47, 109, 255, 0.08) !important;
  color: #173c8c !important;
}

html body.vf-page-games .main-wrapper .vf-sidebar-module-shell .side-nav .badge,
html body.vf-page-games .main-wrapper .vf-sidebar-module-shell .side-nav [style*="background: rgba(17, 142, 213, 0.15)"] {
  min-width: 28px !important;
  padding: 3px 7px !important;
  border: 1px solid rgba(47, 109, 255, 0.14) !important;
  border-radius: 999px !important;
  background: rgba(47, 109, 255, 0.08) !important;
  color: #315cff !important;
  font-size: 0.68rem !important;
  font-weight: 700 !important;
}

html body.vf-page-games .main-wrapper .vf-sidebar-module-shell .game-card {
  overflow: hidden !important;
  border: 1px solid rgba(207, 219, 235, 0.8) !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, 0.94) !important;
  box-shadow: var(--vf-surface-shadow, 0 10px 28px rgba(30, 51, 86, 0.075)) !important;
}

html body.vf-page-games .main-wrapper .vf-sidebar-module-shell .game-card:hover {
  box-shadow: var(--vf-surface-shadow-hover, 0 14px 34px rgba(30, 51, 86, 0.095)) !important;
  transform: translateY(-1px) !important;
}

body.night-mode.vf-page-games .main-wrapper .vf-sidebar-module-shell .vf-games-tabs,
body.night-mode.vf-page-games .main-wrapper .vf-platform-dashboard-item,
body.night-mode.vf-page-games .main-wrapper .vf-sidebar-module-shell .game-card {
  border-color: rgba(96, 121, 155, 0.3) !important;
  background: rgba(18, 28, 42, 0.9) !important;
  color: #dce8f8 !important;
}

body.night-mode.vf-page-games .main-wrapper .vf-sidebar-module-shell .vf-games-tabs li a,
body.night-mode.vf-page-games .main-wrapper .vf-sidebar-module-shell .side-nav li a,
body.night-mode.vf-page-games .main-wrapper .vf-platform-dashboard-item {
  color: #dce8f8 !important;
}

body.night-mode.vf-page-games .main-wrapper .vf-sidebar-module-shell .vf-games-tabs li.active a,
body.night-mode.vf-page-games .main-wrapper .vf-sidebar-module-shell .vf-games-tabs li a:hover,
body.night-mode.vf-page-games .main-wrapper .vf-sidebar-module-shell .side-nav li.active a,
body.night-mode.vf-page-games .main-wrapper .vf-sidebar-module-shell .side-nav li a:hover {
  border-color: rgba(96, 165, 250, 0.24) !important;
  background: rgba(96, 165, 250, 0.14) !important;
  color: #f7fbff !important;
}

@media (min-width: 992px) {
  html body.vf-page-games .main-wrapper .vf-platform-dashboard {
    justify-content: flex-start !important;
  }
}

@media (max-width: 767.98px) {
  html body.vf-page-games .main-wrapper .vf-sidebar-module-shell {
    margin-top: -10px !important;
  }

  html body.vf-page-games .main-wrapper .vf-sidebar-module-shell .vf-games-tabs ul {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  html body.vf-page-games .main-wrapper .vf-platform-dashboard {
    overflow-x: auto !important;
    flex-wrap: nowrap !important;
    padding-bottom: 4px !important;
    scrollbar-width: none !important;
  }

  html body.vf-page-games .main-wrapper .vf-platform-dashboard::-webkit-scrollbar {
    display: none !important;
  }

  html body.vf-page-games .main-wrapper .vf-platform-dashboard-item {
    white-space: nowrap !important;
  }
}

/* r179 composer modal launch layout polish */
html body.modal-open #modal.js_modal-publisher {
  padding-top: calc(82px + env(safe-area-inset-top, 0px)) !important;
  padding-right: 16px !important;
  padding-bottom: calc(24px + env(safe-area-inset-bottom, 0px)) !important;
  padding-left: 16px !important;
}

html body #modal.js_modal-publisher .modal-dialog,
html body #modal.js_modal-publisher .modal-dialog.modal-lg,
html body #modal.js_modal-publisher .modal-dialog.modal-xl,
html body #modal.js_modal-publisher .modal-dialog.modal-dialog-centered {
  width: min(920px, calc(100vw - 32px)) !important;
  max-width: min(920px, calc(100vw - 32px)) !important;
  min-height: 0 !important;
  margin: 0 auto !important;
  transform: none !important;
}

html body #modal.js_modal-publisher .modal-content {
  overflow: hidden !important;
  max-height: calc(100vh - 112px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
  border: 1px solid rgba(203, 215, 232, 0.92) !important;
  border-radius: 22px !important;
  background: #ffffff !important;
  box-shadow: 0 22px 56px rgba(15, 34, 65, 0.24) !important;
}

html body #modal.js_modal-publisher .modal-body,
html body #modal.js_modal-publisher .js_modal-publisher-body {
  overflow-x: hidden !important;
  overflow-y: auto !important;
  max-height: inherit !important;
  background: #ffffff !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] {
  overflow: visible !important;
  display: flex !important;
  flex-direction: column !important;
  min-height: 0 !important;
  padding: 18px 18px 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-close {
  top: 12px !important;
  right: 12px !important;
  z-index: 120 !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 48px minmax(0, 1fr) 36px !important;
  align-items: flex-start !important;
  gap: 14px !important;
  min-height: 154px !important;
  margin: 0 !important;
  padding: 0 58px 18px 0 !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-avatar {
  width: 42px !important;
  height: 42px !important;
  margin: 0 !important;
  border: 2px solid rgba(203, 215, 232, 0.72) !important;
  border-radius: 50% !important;
  object-fit: cover !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message .colored-text-wrapper,
html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .js_post-editor-quill-wrap {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 126px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message textarea,
html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .js_post-editor-quill-wrap .ql-editor {
  width: 100% !important;
  min-height: 126px !important;
  max-height: 260px !important;
  padding: 10px 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #1f2a3d !important;
  font-size: 1.02rem !important;
  font-weight: 400 !important;
  line-height: 1.45 !important;
  box-shadow: none !important;
  resize: none !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .js_post-editor-quill-wrap .ql-toolbar.ql-snow {
  position: static !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
  width: fit-content !important;
  max-width: 100% !important;
  margin: 0 0 8px !important;
  padding: 4px 6px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: rgba(246, 248, 252, 0.96) !important;
  box-shadow: inset 0 0 0 1px rgba(203, 215, 232, 0.82) !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-emojis {
  grid-column: 3 !important;
  align-self: start !important;
  width: 36px !important;
  margin: 6px 0 0 !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-tools-quick {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 10px !important;
  margin: 0 -18px !important;
  padding: 16px 18px 18px !important;
  border-top: 1px solid rgba(228, 234, 243, 0.92) !important;
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%) !important;
  overflow-x: auto !important;
  scrollbar-width: none !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-tools-quick::-webkit-scrollbar {
  display: none !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-tools-quick .publisher-quick-action {
  flex: 0 0 52px !important;
  width: 52px !important;
  height: 52px !important;
  min-width: 52px !important;
  min-height: 52px !important;
  border: 1px solid rgba(220, 229, 241, 0.92) !important;
  border-radius: 16px !important;
  background: #ffffff !important;
  box-shadow: 0 8px 18px rgba(25, 44, 75, 0.055) !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-slider,
html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-footer-options,
html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-footer {
  margin-right: -18px !important;
  margin-left: -18px !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-footer {
  padding: 14px 18px !important;
  border-top: 1px solid rgba(228, 234, 243, 0.92) !important;
  background: #ffffff !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-footer-buttons,
html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-footer .d-flex {
  align-items: center !important;
  gap: 10px !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .js_publisher-btn,
html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-footer .btn-primary {
  min-width: 86px !important;
  min-height: 42px !important;
  border-radius: 999px !important;
}

body.night-mode #modal.js_modal-publisher .modal-content,
body.night-mode #modal.js_modal-publisher .modal-body,
body.night-mode #modal.js_modal-publisher .js_modal-publisher-body,
body.night-mode #modal.js_modal-publisher .publisher[data-modal-mode="true"],
body.night-mode #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-footer {
  border-color: rgba(96, 121, 155, 0.34) !important;
  background: #121c2a !important;
  color: #f7fbff !important;
}

body.night-mode #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-tools-quick {
  border-color: rgba(96, 121, 155, 0.26) !important;
  background: linear-gradient(180deg, #121c2a 0%, #0f1724 100%) !important;
}

body.night-mode #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-tools-quick .publisher-quick-action {
  border-color: rgba(96, 121, 155, 0.28) !important;
  background: rgba(23, 35, 52, 0.94) !important;
  box-shadow: none !important;
}

body.night-mode #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message textarea,
body.night-mode #modal.js_modal-publisher .publisher[data-modal-mode="true"] .js_post-editor-quill-wrap .ql-editor {
  color: #f4f8ff !important;
}

@media (max-width: 767.98px) {
  html body.modal-open #modal.js_modal-publisher {
    padding-top: calc(74px + env(safe-area-inset-top, 0px)) !important;
    padding-right: 10px !important;
    padding-left: 10px !important;
  }

  html body #modal.js_modal-publisher .modal-dialog,
  html body #modal.js_modal-publisher .modal-dialog.modal-lg,
  html body #modal.js_modal-publisher .modal-dialog.modal-xl,
  html body #modal.js_modal-publisher .modal-dialog.modal-dialog-centered {
    width: calc(100vw - 20px) !important;
    max-width: calc(100vw - 20px) !important;
  }

  html body #modal.js_modal-publisher .modal-content {
    max-height: calc(100vh - 96px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
    border-radius: 20px !important;
  }

  html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message {
    grid-template-columns: 40px minmax(0, 1fr) 34px !important;
    gap: 10px !important;
    min-height: 136px !important;
    padding-right: 44px !important;
  }

  html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-avatar {
    width: 36px !important;
    height: 36px !important;
  }

}

/* r182 composer modal final layering fix */
html body #modal.js_modal-publisher .modal-content,
html body #modal.js_modal-publisher .modal-body,
html body #modal.js_modal-publisher .js_modal-publisher-body,
html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] {
  overflow: visible !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) {
  position: relative !important;
  overflow: visible !important;
  z-index: 100 !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .colored-text-wrapper,
html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .js_post-editor-quill-wrap {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 112px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .js_post-editor-quill-toolbar,
html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .ql-toolbar.ql-snow {
  display: inline-flex !important;
  align-items: center !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: calc(100vw - 260px) !important;
  min-height: 28px !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .ql-toolbar.ql-snow button {
  width: 24px !important;
  height: 24px !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .ql-container.ql-snow,
html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .ql-editor {
  width: 100% !important;
  min-height: 74px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-emojis {
  position: relative !important;
  z-index: 5000 !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-emojis .position-relative {
  position: relative !important;
  z-index: 5000 !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-emojis .emoji-menu {
  position: absolute !important;
  right: 0 !important;
  bottom: calc(100% + 12px) !important;
  top: auto !important;
  z-index: 6000 !important;
  width: 248px !important;
  max-width: calc(100vw - 40px) !important;
  max-height: 242px !important;
  overflow: hidden !important;
  border: 1px solid rgba(203, 215, 232, 0.9) !important;
  border-radius: 16px !important;
  background: #ffffff !important;
  box-shadow: 0 20px 54px rgba(15, 34, 65, 0.28) !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-tools-quick,
html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-footer {
  position: relative !important;
  z-index: 1 !important;
}

body.night-mode #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .js_post-editor-quill-toolbar,
body.night-mode #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .ql-toolbar.ql-snow {
  background: transparent !important;
  box-shadow: none !important;
}

body.night-mode #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-emojis .emoji-menu {
  border-color: rgba(96, 121, 155, 0.36) !important;
  background: #121c2a !important;
}

@media (max-width: 767.98px) {
  html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .js_post-editor-quill-toolbar,
  html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .ql-toolbar.ql-snow {
    max-width: calc(100vw - 128px) !important;
  }

  html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-emojis .emoji-menu {
    right: -4px !important;
    width: 218px !important;
  }
}

/* r183 composer emoji dropdown direction fix */
html body #modal.js_modal-publisher,
html body #modal.js_modal-publisher .modal-dialog,
html body #modal.js_modal-publisher .modal-content,
html body #modal.js_modal-publisher .modal-body,
html body #modal.js_modal-publisher .js_modal-publisher-body,
html body #modal.js_modal-publisher .publisher[data-modal-mode="true"],
html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) {
  overflow: visible !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-emojis,
html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-emojis .position-relative {
  position: relative !important;
  z-index: 9000 !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-emojis .emoji-menu {
  position: absolute !important;
  top: calc(100% + 12px) !important;
  bottom: auto !important;
  right: 0 !important;
  left: auto !important;
  z-index: 9500 !important;
  width: 248px !important;
  max-width: calc(100vw - 40px) !important;
  max-height: 230px !important;
  overflow: hidden !important;
  border: 1px solid rgba(203, 215, 232, 0.92) !important;
  border-radius: 16px !important;
  background: #ffffff !important;
  box-shadow: 0 20px 54px rgba(15, 34, 65, 0.28) !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-emojis .emoji-menu .tab-content,
html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-emojis .emoji-menu .js_scroller {
  max-height: 174px !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-tools-quick,
html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-footer {
  position: relative !important;
  z-index: 1 !important;
}

body.night-mode #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-emojis .emoji-menu {
  border-color: rgba(96, 121, 155, 0.36) !important;
  background: #121c2a !important;
}

@media (max-width: 767.98px) {
  html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-emojis .emoji-menu {
    right: -4px !important;
    width: 218px !important;
    max-height: 214px !important;
  }
}

/* r184 composer emoji panel fit */
html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-emojis .emoji-menu {
  max-height: 184px !important;
  height: 184px !important;
  overflow: hidden !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-emojis .emoji-menu .tab-content {
  height: 136px !important;
  max-height: 136px !important;
  overflow: hidden !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-emojis .emoji-menu .js_scroller {
  height: 136px !important;
  max-height: 136px !important;
  overflow-y: auto !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-emojis .emoji-menu .nav-tabs {
  height: 48px !important;
  min-height: 48px !important;
}

@media (max-width: 767.98px) {
  html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-emojis .emoji-menu {
    max-height: 172px !important;
    height: 172px !important;
  }

  html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-emojis .emoji-menu .tab-content,
  html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-emojis .emoji-menu .js_scroller {
    height: 124px !important;
    max-height: 124px !important;
  }
}

/* r185 composer editor alignment reset */
html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) {
  display: grid !important;
  grid-template-columns: 44px minmax(0, 1fr) 34px !important;
  align-items: flex-start !important;
  column-gap: 12px !important;
  width: 100% !important;
  min-height: 136px !important;
  padding: 0 48px 16px 0 !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .publisher-avatar,
html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .avatar-wrapper {
  grid-column: 1 !important;
  justify-self: start !important;
  align-self: start !important;
  margin: 0 !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .colored-text-wrapper,
html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .js_post-editor-quill-wrap {
  grid-column: 2 !important;
  justify-self: stretch !important;
  align-self: stretch !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .js_post-editor-quill-toolbar,
html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .ql-toolbar.ql-snow {
  justify-content: flex-start !important;
  align-self: flex-start !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  text-align: left !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) textarea,
html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) .ql-editor {
  text-align: left !important;
}

html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-emojis {
  grid-column: 3 !important;
  justify-self: end !important;
  align-self: start !important;
  margin: 58px 0 0 !important;
}

@media (max-width: 767.98px) {
  html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:not(.colored) {
    grid-template-columns: 38px minmax(0, 1fr) 32px !important;
    column-gap: 10px !important;
    padding-right: 38px !important;
  }

  html body #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-emojis {
    margin-top: 54px !important;
  }
}

/* r186 scoped composer modal grid correction */
html body #modal.js_modal-publisher #publisher-box.publisher > .publisher-message:not(.colored) {
  grid-template-columns: 44px minmax(0, 1fr) 36px !important;
  column-gap: 14px !important;
  padding: 26px 32px 16px 28px !important;
}

html body #modal.js_modal-publisher #publisher-box.publisher > .publisher-message:not(.colored) .colored-text-wrapper,
html body #modal.js_modal-publisher #publisher-box.publisher > .publisher-message:not(.colored) .js_post-editor-quill-wrap,
html body #modal.js_modal-publisher #publisher-box.publisher > .publisher-message:not(.colored) .ql-container,
html body #modal.js_modal-publisher #publisher-box.publisher > .publisher-message:not(.colored) .ql-editor {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}

html body #modal.js_modal-publisher #publisher-box.publisher > .publisher-message:not(.colored) .ql-toolbar.ql-snow {
  justify-content: flex-start !important;
  margin: 0 0 12px !important;
}

html body #modal.js_modal-publisher #publisher-box.publisher > .publisher-message:not(.colored) > .publisher-emojis {
  margin: 58px 0 0 !important;
}

@media (max-width: 767.98px) {
  html body #modal.js_modal-publisher #publisher-box.publisher > .publisher-message:not(.colored) {
    grid-template-columns: 40px minmax(0, 1fr) 34px !important;
    column-gap: 10px !important;
    padding: 22px 18px 14px !important;
  }

  html body #modal.js_modal-publisher #publisher-box.publisher > .publisher-message:not(.colored) > .publisher-emojis {
    margin-top: 54px !important;
  }
}

/* r187 composer emoji top-layer escape */
html body #modal.js_modal-publisher .modal-dialog,
html body #modal.js_modal-publisher .modal-content,
html body #modal.js_modal-publisher #publisher-wapper-modal,
html body #modal.js_modal-publisher #publisher-box.publisher,
html body #modal.js_modal-publisher #publisher-box.publisher > .publisher-message:not(.colored) {
  overflow: visible !important;
}

html body #modal.js_modal-publisher #publisher-box.publisher > .publisher-message:not(.colored) > .publisher-emojis,
html body #modal.js_modal-publisher #publisher-box.publisher > .publisher-message:not(.colored) > .publisher-emojis .position-relative {
  position: relative !important;
  z-index: 2147483000 !important;
}

html body #modal.js_modal-publisher #publisher-box.publisher > .publisher-message:not(.colored) > .publisher-emojis .emoji-menu {
  position: absolute !important;
  top: calc(100% + 8px) !important;
  right: 0 !important;
  bottom: auto !important;
  left: auto !important;
  z-index: 2147483001 !important;
  transform: none !important;
}

html body #modal.js_modal-publisher #publisher-box.publisher .publisher-tools-quick,
html body #modal.js_modal-publisher #publisher-box.publisher .publisher-footer {
  position: relative !important;
  z-index: 1 !important;
}

/* r188 facebook-style detached composer emoji popover */
html body .emoji-menu.vf-detached-emoji-menu.vf-detached-publisher-emoji-menu {
  position: fixed !important;
  z-index: 2147483001 !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  max-width: calc(100vw - 16px) !important;
  max-height: min(320px, 72vh) !important;
  overflow: hidden !important;
  border: 1px solid rgba(203, 215, 232, 0.92) !important;
  border-radius: 16px !important;
  background: #ffffff !important;
  box-shadow: 0 24px 70px rgba(8, 17, 31, 0.32) !important;
}

html body .emoji-menu.vf-detached-emoji-menu.vf-detached-publisher-emoji-menu .tab-content {
  max-height: 240px !important;
  overflow: hidden !important;
}

html body .emoji-menu.vf-detached-emoji-menu.vf-detached-publisher-emoji-menu .js_scroller {
  max-height: 238px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

body.night-mode .emoji-menu.vf-detached-emoji-menu.vf-detached-publisher-emoji-menu {
  border-color: rgba(96, 121, 155, 0.36) !important;
  background: #121c2a !important;
}

/* r189 keep composer close button clickable above detached emoji popover */
html body #modal.js_modal-publisher .publisher-close,
html body #modal.js_modal-publisher .publisher-close .btn-close,
html body #modal.js_modal-publisher #publisher-box.publisher .publisher-close,
html body #modal.js_modal-publisher #publisher-box.publisher .publisher-close .btn-close {
  position: absolute !important;
  pointer-events: auto !important;
}

html body #modal.js_modal-publisher .publisher-close,
html body #modal.js_modal-publisher #publisher-box.publisher .publisher-close {
  z-index: 2147483002 !important;
}

html body #modal.js_modal-publisher .publisher-close .btn-close,
html body #modal.js_modal-publisher #publisher-box.publisher .publisher-close .btn-close {
  z-index: 2147483003 !important;
}

/* r190 dock composer emoji trigger into Quill toolbar */
html body #modal.js_modal-publisher #publisher-box.publisher > .publisher-message:not(.colored) {
  grid-template-columns: 44px minmax(0, 1fr) !important;
  padding-right: 28px !important;
}

html body #modal.js_modal-publisher #publisher-box.publisher > .publisher-message:not(.colored) .js_post-editor-quill-toolbar,
html body #modal.js_modal-publisher #publisher-box.publisher > .publisher-message:not(.colored) .ql-toolbar.ql-snow {
  display: inline-flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 2px !important;
}

html body #modal.js_modal-publisher #publisher-box.publisher .publisher-emojis.vf-toolbar-emoji-toggle {
  position: relative !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 0 0 2px !important;
  z-index: 1 !important;
}

html body #modal.js_modal-publisher #publisher-box.publisher .publisher-emojis.vf-toolbar-emoji-toggle .position-relative {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

html body #modal.js_modal-publisher #publisher-box.publisher .publisher-emojis.vf-toolbar-emoji-toggle .js_emoji-menu-toggle {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 6px !important;
  color: #172033 !important;
  font-size: 17px !important;
  line-height: 1 !important;
}

html body #modal.js_modal-publisher #publisher-box.publisher .publisher-emojis.vf-toolbar-emoji-toggle .js_emoji-menu-toggle:hover {
  background: rgba(47, 109, 255, 0.08) !important;
  color: #2f6dff !important;
}

@media (max-width: 767.98px) {
  html body #modal.js_modal-publisher #publisher-box.publisher > .publisher-message:not(.colored) {
    grid-template-columns: 40px minmax(0, 1fr) !important;
    padding-right: 18px !important;
  }
}
/* r195 colored composer canvas alignment correction */
#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message.colored,
#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) {
  display: block !important;
  position: relative !important;
  min-height: 360px !important;
  padding: 0 !important;
  overflow: hidden !important;
  background-position: center center !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
}

#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message.colored .publisher-avatar,
#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .publisher-avatar {
  display: none !important;
}

#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message.colored .colored-text-wrapper,
#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message.colored .js_post-editor-quill-wrap,
#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message.colored .ql-container,
#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message.colored .ql-editor,
#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .colored-text-wrapper,
#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .js_post-editor-quill-wrap,
#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .ql-container,
#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .ql-editor {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--vf-publisher-colored-text, #ffffff) !important;
  caret-color: var(--vf-publisher-colored-text, #ffffff) !important;
}

#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message.colored .colored-text-wrapper,
#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .colored-text-wrapper {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 360px !important;
  padding: 72px 54px 46px !important;
  overflow: hidden !important;
}

#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message.colored .js_post-editor-quill-wrap,
#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .js_post-editor-quill-wrap {
  display: block !important;
  position: static !important;
  width: 100% !important;
  min-height: 240px !important;
  margin: 0 !important;
  overflow: visible !important;
}

#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message.colored .ql-container,
#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .ql-container {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: auto !important;
  min-height: 240px !important;
  max-height: none !important;
  overflow: visible !important;
}

#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message.colored textarea,
#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message.colored .ql-editor,
#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) textarea,
#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .ql-editor {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 240px !important;
  max-height: none !important;
  padding: 0 !important;
  overflow: hidden !important;
  overflow-y: hidden !important;
  color: var(--vf-publisher-colored-text, #ffffff) !important;
  font-size: 2.35rem !important;
  font-weight: 800 !important;
  line-height: 1.14 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  text-shadow: 0 3px 22px rgba(0, 0, 0, 0.52), 0 1px 5px rgba(0, 0, 0, 0.38) !important;
}

#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message.colored .ql-editor p,
#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .ql-editor p {
  width: 100% !important;
  margin: 0 auto !important;
  background: transparent !important;
  color: inherit !important;
  text-align: center !important;
}

#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message.colored .ql-editor.ql-blank::before,
#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .ql-editor.ql-blank::before {
  inset: 0 !important;
  color: var(--vf-publisher-colored-text, #ffffff) !important;
  opacity: 0.92 !important;
  font-style: normal !important;
  text-align: center !important;
  text-shadow: 0 3px 22px rgba(0, 0, 0, 0.52), 0 1px 5px rgba(0, 0, 0, 0.38) !important;
}

#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message.colored .js_post-editor-quill-toolbar,
#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .js_post-editor-quill-toolbar {
  position: absolute !important;
  top: 20px !important;
  left: 24px !important;
  right: 72px !important;
  z-index: 4 !important;
  display: flex !important;
  justify-content: flex-start !important;
  width: auto !important;
  max-width: none !important;
  overflow: visible !important;
  transform: none !important;
}

#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message.colored .ql-toolbar.ql-snow,
#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .ql-toolbar.ql-snow {
  display: inline-flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-start !important;
  gap: 2px !important;
  padding: 8px 12px !important;
  border: 1px solid rgba(255, 255, 255, 0.52) !important;
  border-radius: 18px !important;
  background: rgba(248, 250, 252, 0.86) !important;
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.22) !important;
  backdrop-filter: blur(14px) saturate(1.12) !important;
  -webkit-backdrop-filter: blur(14px) saturate(1.12) !important;
}

#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message.colored .ql-toolbar.ql-snow button,
#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .ql-toolbar.ql-snow button {
  color: #172033 !important;
}

#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message.colored .ql-toolbar.ql-snow .ql-stroke,
#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .ql-toolbar.ql-snow .ql-stroke {
  stroke: #172033 !important;
}

#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message.colored .ql-toolbar.ql-snow .ql-fill,
#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .ql-toolbar.ql-snow .ql-fill {
  fill: #172033 !important;
}

#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message.colored + .publisher-tools-quick,
#modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message.colored ~ .publisher-tools-quick {
  margin-top: 16px !important;
}

@media (max-width: 767.98px) {
  #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message.colored {
    min-height: 300px !important;
  }

  #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message.colored .colored-text-wrapper,
  #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .colored-text-wrapper {
    min-height: 300px !important;
    padding: 66px 24px 34px !important;
  }

  #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message.colored textarea,
  #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message.colored .ql-editor,
  #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) textarea,
  #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .ql-editor {
    min-height: 190px !important;
    font-size: 1.85rem !important;
  }

  #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message.colored .js_post-editor-quill-toolbar,
  #modal.js_modal-publisher .publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .js_post-editor-quill-toolbar {
    top: 18px !important;
    left: 18px !important;
    right: 56px !important;
  }
}
/* r196 colored composer deployed-min safety override */
html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message.colored,
html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) {
  display: block !important;
  position: relative !important;
  min-height: 360px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background-position: center center !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
}

html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message.colored .publisher-avatar,
html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .publisher-avatar {
  display: none !important;
}

html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message.colored .colored-text-wrapper,
html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .colored-text-wrapper {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 360px !important;
  padding: 72px 54px 46px !important;
  overflow: hidden !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--vf-publisher-colored-text, #ffffff) !important;
  caret-color: var(--vf-publisher-colored-text, #ffffff) !important;
}

html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message.colored .js_post-editor-quill-wrap,
html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .js_post-editor-quill-wrap {
  display: block !important;
  position: static !important;
  width: 100% !important;
  min-height: 240px !important;
  margin: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message.colored .ql-container,
html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .ql-container {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: auto !important;
  min-height: 240px !important;
  max-height: none !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message.colored textarea,
html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message.colored .ql-editor,
html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) textarea,
html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .ql-editor {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 240px !important;
  max-height: none !important;
  padding: 0 !important;
  overflow: hidden !important;
  overflow-y: hidden !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--vf-publisher-colored-text, #ffffff) !important;
  caret-color: var(--vf-publisher-colored-text, #ffffff) !important;
  font-size: 2.35rem !important;
  font-weight: 800 !important;
  line-height: 1.14 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  text-shadow: 0 3px 22px rgba(0, 0, 0, 0.52), 0 1px 5px rgba(0, 0, 0, 0.38) !important;
}

html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message.colored .ql-editor p,
html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .ql-editor p {
  width: 100% !important;
  margin: 0 auto !important;
  background: transparent !important;
  color: inherit !important;
  text-align: center !important;
}

html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message.colored .js_post-editor-quill-toolbar,
html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .js_post-editor-quill-toolbar {
  position: absolute !important;
  top: 20px !important;
  left: 24px !important;
  right: 72px !important;
  z-index: 4 !important;
  display: flex !important;
  justify-content: flex-start !important;
  width: auto !important;
  max-width: none !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message.colored .ql-toolbar.ql-snow,
html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .ql-toolbar.ql-snow {
  display: inline-flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-start !important;
  gap: 2px !important;
  padding: 8px 12px !important;
  border: 1px solid rgba(255, 255, 255, 0.52) !important;
  border-radius: 18px !important;
  background: rgba(248, 250, 252, 0.86) !important;
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.22) !important;
  backdrop-filter: blur(14px) saturate(1.12) !important;
  -webkit-backdrop-filter: blur(14px) saturate(1.12) !important;
}

html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message.colored .ql-toolbar.ql-snow button,
html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .ql-toolbar.ql-snow button {
  color: #172033 !important;
}

html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message.colored .ql-toolbar.ql-snow .ql-stroke,
html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .ql-toolbar.ql-snow .ql-stroke {
  stroke: #172033 !important;
}

html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message.colored .ql-toolbar.ql-snow .ql-fill,
html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .ql-toolbar.ql-snow .ql-fill {
  fill: #172033 !important;
}

@media (max-width: 767.98px) {
  html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message.colored,
  html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) {
    min-height: 300px !important;
  }

  html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message.colored .colored-text-wrapper,
  html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .colored-text-wrapper {
    min-height: 300px !important;
    padding: 66px 24px 34px !important;
  }

  html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message.colored textarea,
  html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message.colored .ql-editor,
  html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) textarea,
  html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .ql-editor {
    min-height: 190px !important;
    font-size: 1.85rem !important;
  }

  html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message.colored .js_post-editor-quill-toolbar,
  html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .js_post-editor-quill-toolbar {
    top: 18px !important;
    left: 18px !important;
    right: 56px !important;
  }
}
/* r197 colored composer trim and option spacing */
html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message.colored textarea,
html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message.colored .ql-editor,
html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) textarea,
html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .ql-editor {
  font-size: 2.65rem !important;
  line-height: 1.12 !important;
}

html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message.colored .ql-editor *,
html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .ql-editor * {
  font-size: inherit !important;
  line-height: inherit !important;
  letter-spacing: 0 !important;
  color: inherit !important;
  text-shadow: inherit !important;
}

html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message.colored .ql-editor p,
html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .ql-editor p {
  display: block !important;
  width: 100% !important;
  margin: 0 auto !important;
  text-align: center !important;
}

html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-tools-quick,
html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-slider,
html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-footer-options,
html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-footer {
  box-sizing: border-box !important;
  width: 100% !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
  padding-right: 32px !important;
  padding-left: 32px !important;
  overflow: visible !important;
}

html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-tools-quick {
  padding-top: 18px !important;
  padding-bottom: 18px !important;
}

html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-slider,
html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-footer-options {
  padding-top: 18px !important;
  padding-bottom: 18px !important;
}

html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-footer {
  padding-top: 14px !important;
  padding-bottom: 16px !important;
}

html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-footer-options .form-table-row,
html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-footer-options .x-form-tools,
html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-footer-options .form-check,
html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-footer-options .form-group {
  max-width: 100% !important;
}

@media (max-width: 767.98px) {
  html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message.colored textarea,
  html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message.colored .ql-editor,
  html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) textarea,
  html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-message:has(.colored-text-wrapper[style*="background-image"]) .ql-editor {
    font-size: 2rem !important;
  }

  html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-tools-quick,
  html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-slider,
  html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-footer-options,
  html body #modal.js_modal-publisher #publisher-box.publisher[data-modal-mode="true"] .publisher-footer {
    padding-right: 18px !important;
    padding-left: 18px !important;
  }
}

/* r208: align the Tools rail trigger with the section labels above it */
html body .main-wrapper .vf-left-rail-slideout .sidebar-see-more {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  min-height: 38px !important;
  padding: 7px 8px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: transparent !important;
  text-align: left !important;
}

html body .main-wrapper .vf-left-rail-slideout .sidebar-see-more > .sidebar-section-icon,
html body .main-wrapper .vf-left-rail-slideout .sidebar-see-more > .main-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 25px !important;
  height: 25px !important;
  min-width: 25px !important;
  margin-right: 8px !important;
}

html body .main-wrapper .vf-left-rail-slideout .sidebar-see-more-text {
  color: inherit !important;
  font-size: 0.76rem !important;
  font-weight: 950 !important;
  letter-spacing: 0.04em !important;
}

/* r209: restore the newsfeed right rail on large tablets in landscape */
@media (min-width: 1100px) and (max-width: 1366.98px) and (orientation: landscape) and (pointer: coarse) {
  html body .main-wrapper .vf-newsfeed-shell {
    --vf-newsfeed-right-rail-width: clamp(270px, 24vw, 310px);
    width: calc(100vw - 24px) !important;
    max-width: calc(100vw - 24px) !important;
  }

  html body .main-wrapper .vf-newsfeed-shell .sg-offcanvas-mainbar > .row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) var(--vf-newsfeed-right-rail-width) !important;
    align-items: start !important;
  }

  html body .main-wrapper .vf-newsfeed-shell .sg-offcanvas-mainbar > .row > .col-12.col-xl-9 {
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
  }

  html body .main-wrapper .vf-newsfeed-shell .vf-side-rail {
    display: block !important;
    width: var(--vf-newsfeed-right-rail-width) !important;
    min-width: 0 !important;
    max-width: var(--vf-newsfeed-right-rail-width) !important;
  }

  html body .main-wrapper .vf-newsfeed-shell .vf-side-rail > .theiaStickySidebar {
    position: sticky !important;
    top: 78px !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    transform: none !important;
  }
}

/* r218 keep confirmation dialogs compact in the iOS installed PWA */
html.app-standalone body #modal .modal-dialog:has(.vf-modal-confirm-header),
html.app-standalone body #modal .modal-content:has(.vf-modal-confirm-header) {
  width: auto !important;
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
}

html.app-standalone body #modal .modal-dialog:has(.vf-modal-confirm-header) {
  max-width: min(520px, calc(100vw - 28px)) !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

html.app-standalone body #modal .modal-content:has(.vf-modal-confirm-header) {
  align-self: auto !important;
  border-radius: 20px !important;
}

/* r219: keep iOS header and bottom-nav menus inside the usable viewport */
@media (max-width: 767.98px) {
  html.app-standalone body .main-wrapper .main-header .navbar-wrapper > ul > li.dropdown.nav-widget-menu-open > .dropdown-menu,
  html.app-standalone body .main-wrapper .main-header .navbar-wrapper > ul > li.dropdown.nav-widget-menu-open > .dropdown-widget,
  html.app-standalone body .main-wrapper .main-header .navbar-wrapper > ul > li.dropdown.show > .dropdown-menu,
  html.app-standalone body .main-wrapper .main-header .navbar-wrapper > ul > li.dropdown.show > .dropdown-widget {
    position: fixed !important;
    top: calc(70px + env(safe-area-inset-top, 0px)) !important;
    right: 10px !important;
    bottom: auto !important;
    left: auto !important;
    width: min(390px, calc(100vw - 20px)) !important;
    min-width: 0 !important;
    max-width: calc(100vw - 20px) !important;
    max-height: calc(100dvh - 166px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
    margin: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    border-radius: 16px !important;
    box-sizing: border-box !important;
    transform: none !important;
    animation: none !important;
    transition: none !important;
    z-index: 1065 !important;
    -webkit-overflow-scrolling: touch;
  }

  html.app-standalone body .main-wrapper .main-header .dropdown-widget-body,
  html.app-standalone body .main-wrapper .main-header .dropdown-widget-body .js_scroller {
    max-height: none !important;
    overflow: visible !important;
  }

  html.app-standalone body .footer-bottom-bar .dropdown.show > .dropdown-menu,
  html.app-standalone body .footer-bottom-bar .dropdown.show > .dropdown-widget,
  html.app-standalone body .footer-bottom-bar .dropdown-menu.show,
  html.app-standalone body .footer-bottom-bar .dropdown-widget.show {
    position: fixed !important;
    top: auto !important;
    right: 10px !important;
    bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important;
    left: 10px !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    max-height: calc(100dvh - 166px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
    margin: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    border-radius: 16px !important;
    box-sizing: border-box !important;
    transform: none !important;
    animation: none !important;
    transition: none !important;
    z-index: 1065 !important;
    -webkit-overflow-scrolling: touch;
  }

  html.app-standalone body:has(.main-header .nav-widget-menu-open) .asw-menu-btn,
  html.app-standalone body:has(.main-header .dropdown.show) .asw-menu-btn,
html.app-standalone body:has(.footer-bottom-bar .dropdown.show) .asw-menu-btn {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
}

/* Mobile dialog and popup viewport safety (iOS Safari/PWA + Android Chrome) */
@media (max-width: 767.98px) {
  html body.modal-open {
    width: 100% !important;
    overflow: hidden !important;
    padding-right: 0 !important;
  }

  html body .modal.show {
    box-sizing: border-box !important;
    padding: calc(env(safe-area-inset-top, 0px) + 8px) 8px calc(env(safe-area-inset-bottom, 0px) + 8px) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }

  html body .modal.show > .modal-dialog,
  html body .modal.show > .modal-dialog.modal-sm,
  html body .modal.show > .modal-dialog.modal-lg,
  html body .modal.show > .modal-dialog.modal-xl,
  html body .modal.show > .modal-dialog.modal-dialog-centered {
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: calc(100vw - 16px) !important;
    min-height: calc(100vh - 16px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
    min-height: calc(100dvh - 16px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
    margin: 0 auto !important;
    transform: none !important;
  }

  html body .modal.show > .modal-dialog > .modal-content {
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    max-height: calc(100vh - 16px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
    max-height: calc(100dvh - 16px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
    overflow: hidden !important;
    border-radius: 18px !important;
  }

  html body .modal.show .modal-header,
  html body .modal.show .modal-footer {
    box-sizing: border-box !important;
    flex: 0 0 auto !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  html body .modal.show .modal-header {
    padding: 15px 16px !important;
  }

  html body .modal.show .modal-body {
    box-sizing: border-box !important;
    flex: 1 1 auto !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 0 !important;
    padding: 18px 16px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }

  html body .modal.show .modal-footer {
    flex-wrap: wrap !important;
    gap: 8px !important;
    padding: 12px 16px calc(14px + env(safe-area-inset-bottom, 0px)) !important;
  }

  html body .modal.show .modal-body > *,
  html body .modal.show form,
  html body .modal.show fieldset,
  html body .modal.show .form-group,
  html body .modal.show .input-group,
  html body .modal.show .row,
  html body .modal.show [class*="col-"] {
    min-width: 0 !important;
    max-width: 100%;
  }

  html body .modal.show input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  html body .modal.show select,
  html body .modal.show textarea {
    box-sizing: border-box !important;
    width: 100%;
    max-width: 100% !important;
    font-size: 16px !important;
  }

  html body .modal.show img,
  html body .modal.show video,
  html body .modal.show iframe,
  html body .modal.show table {
    max-width: 100% !important;
  }

  html body .modal.show .table-responsive {
    width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  html body .dropdown-menu.show,
  html body .dropdown-widget.show,
  html body .popover.show,
  html body .emoji-menu.show,
  html body .emoji-menu.vf-detached-emoji-menu {
    box-sizing: border-box !important;
    min-width: 0 !important;
    max-width: calc(100vw - 16px) !important;
    max-height: calc(100dvh - 24px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }
}

/* r220 launch-day visual polish
   Content surfaces only. Intentionally excludes the left navigation rail,
   its sticky container, flyouts, and all page-column geometry. */
:root {
  --vf-polish-border: rgba(203, 215, 232, 0.78);
  --vf-polish-border-soft: rgba(220, 229, 241, 0.76);
  --vf-polish-shadow: 0 10px 28px rgba(15, 34, 65, 0.08), 0 2px 6px rgba(15, 34, 65, 0.035);
  --vf-polish-shadow-hover: 0 14px 34px rgba(15, 34, 65, 0.115), 0 3px 8px rgba(15, 34, 65, 0.045);
  --vf-polish-radius: 16px;
  --vf-polish-control-radius: 12px;
}

/* Crisp hierarchy and readable measure across user-facing content. */
html body #vf-main-content .sg-offcanvas-mainbar :is(h1, h2, h3, h4, h5, h6),
html body #vf-main-content .vf-side-rail :is(h1, h2, h3, h4, h5, h6) {
  letter-spacing: 0 !important;
  text-wrap: balance;
}

html body #vf-main-content .sg-offcanvas-mainbar :is(p, .text, .description, .card-text),
html body #vf-main-content .vf-side-rail :is(p, .text, .description, .card-text) {
  line-height: 1.55;
}

/* Shared content cards: one border, radius, and shadow language. */
html body #vf-main-content .sg-offcanvas-mainbar > :is(.card, .vf-side-card),
html body #vf-main-content .sg-offcanvas-mainbar > .row > [class*="col-"] > :is(.card, .vf-side-card),
html body #vf-main-content .sg-offcanvas-mainbar :is(.vf-highlight-card, .vf-promo-card, .vf-library-card, .vf-settings-quick-card, .vf-help-quick-card, .vf-search-suggestion-card),
html body #vf-main-content .vf-side-rail > :is(.card, .vf-side-card, .sidebar-meta-widget, .vf-sponsored-card) {
  border-color: var(--vf-polish-border) !important;
  border-radius: var(--vf-polish-radius) !important;
  box-shadow: var(--vf-polish-shadow) !important;
}

html body #vf-main-content .vf-side-rail > :is(.card, .vf-side-card, .sidebar-meta-widget, .vf-sponsored-card) {
  margin-bottom: 18px !important;
  overflow: hidden;
}

html body #vf-main-content .sg-offcanvas-mainbar .card-header,
html body #vf-main-content .vf-side-rail .card-header {
  min-height: 48px;
  padding: 13px 16px !important;
  border-bottom-color: var(--vf-polish-border-soft) !important;
}

html body #vf-main-content .sg-offcanvas-mainbar .card-footer,
html body #vf-main-content .vf-side-rail .card-footer {
  padding: 12px 16px !important;
  border-top-color: var(--vf-polish-border-soft) !important;
}

/* Commands and fields align cleanly without changing their behavior. */
html body #vf-main-content .sg-offcanvas-mainbar :is(.btn, button.btn),
html body #vf-main-content .vf-side-rail :is(.btn, button.btn),
html body #modal :is(.btn, button.btn) {
  min-height: 40px;
  border-radius: 10px;
  font-weight: 700;
  letter-spacing: 0;
}

html body #vf-main-content .sg-offcanvas-mainbar :is(.form-control, .custom-select, select.form-control),
html body #vf-main-content .vf-side-rail :is(.form-control, .custom-select, select.form-control),
html body #modal :is(.form-control, .custom-select, select.form-control) {
  min-height: 44px;
  border-color: var(--vf-polish-border) !important;
  border-radius: var(--vf-polish-control-radius) !important;
  box-shadow: none;
}

html body #vf-main-content .sg-offcanvas-mainbar :is(.form-control, .custom-select, select.form-control):focus,
html body #vf-main-content .vf-side-rail :is(.form-control, .custom-select, select.form-control):focus,
html body #modal :is(.form-control, .custom-select, select.form-control):focus {
  border-color: color-mix(in srgb, var(--vf-ui-accent) 58%, #ffffff) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--vf-ui-accent) 14%, transparent) !important;
}

/* User-customizable right rail */
.vf-widgetkit-personalizer {
  display: grid;
  gap: 12px;
}

.vf-widgetkit-controls {
  overflow: hidden;
  border: 1px solid rgba(20, 121, 232, .16) !important;
  box-shadow: 0 8px 24px rgba(26, 50, 83, .08) !important;
}

.vf-widgetkit-customize {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 2px 10px;
  align-items: center;
  width: 100%;
  padding: 14px 16px;
  border: 0;
  background: linear-gradient(135deg, rgba(19, 126, 236, .08), rgba(18, 186, 176, .07));
  color: #172337;
  text-align: left;
  cursor: pointer;
}

.vf-widgetkit-customize > span {
  display: flex;
  gap: 9px;
  align-items: center;
}

.vf-widgetkit-customize > span > i { color: #147eea; }
.vf-widgetkit-customize small { grid-column: 1; color: #69778b; }
.vf-widgetkit-customize-chevron { display: none; }

.vf-widgetkit-picker {
  padding: 8px 12px 14px;
  border-top: 1px solid rgba(20, 121, 232, .12);
}

.vf-widgetkit-picker[hidden] { display: none !important; }
.vf-widgetkit-picker-intro { padding: 4px 2px 10px; color: #68768a; font-size: 12px; }
.vf-widgetkit-picker-list { display: grid; gap: 6px; max-height: 330px; overflow: auto; }

.vf-widgetkit-choice {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) 34px;
  gap: 9px;
  align-items: center;
  margin: 0;
  padding: 9px;
  border: 1px solid #e7edf5;
  border-radius: 12px;
  background: #fff;
  cursor: pointer;
}

.vf-widgetkit-choice-icon {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background: #eaf4ff;
  color: #147eea;
}

.vf-widgetkit-choice-copy { min-width: 0; }
.vf-widgetkit-choice-copy strong,
.vf-widgetkit-choice-copy small { display: block; }
.vf-widgetkit-choice-copy strong { color: #253247; font-size: 13px; }
.vf-widgetkit-choice-copy small { overflow: hidden; color: #788598; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.vf-widgetkit-choice input { position: absolute; opacity: 0; pointer-events: none; }

.vf-widgetkit-switch {
  position: relative;
  width: 34px;
  height: 20px;
  border-radius: 999px;
  background: #cfd7e3;
  transition: background .18s ease;
}

.vf-widgetkit-switch::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 4px rgba(20, 34, 55, .22);
  transition: transform .18s ease;
}

.vf-widgetkit-choice input:checked + .vf-widgetkit-switch { background: linear-gradient(135deg, #147eea, #11afa8); }
.vf-widgetkit-choice input:checked + .vf-widgetkit-switch::after { transform: translateX(14px); }
.vf-widgetkit-choice input:focus-visible + .vf-widgetkit-switch { outline: 3px solid rgba(20, 126, 234, .25); outline-offset: 2px; }
.vf-widgetkit-picker-actions { display: flex; gap: 10px; align-items: center; padding-top: 12px; }
.vf-widgetkit-save-status { color: #607086; font-size: 12px; }

.vf-widgetkit-drag-handle {
  display: none;
  flex: 0 0 auto;
  width: 28px;
  height: 36px;
  border: 1px solid #dbe5f1;
  border-radius: 9px;
  background: #f6f9fc;
  color: #718096;
  cursor: grab;
}

.vf-widgetkit-personalizer.is-editing .vf-widgetkit-drag-handle { display: inline-grid; place-items: center; }
.vf-widgetkit-personalizer.is-editing .vf-widgetkit-card { outline: 1px dashed rgba(20, 126, 234, .35); outline-offset: -1px; }
.vf-widgetkit-card.is-dragging { opacity: .58; transform: scale(.985); box-shadow: 0 16px 32px rgba(20, 70, 120, .18) !important; }

html body.night-mode .vf-widgetkit-customize { color: #edf5ff; background: linear-gradient(135deg, rgba(37, 139, 245, .18), rgba(18, 186, 176, .14)); }
html body.night-mode .vf-widgetkit-customize small,
html body.night-mode .vf-widgetkit-picker-intro,
html body.night-mode .vf-widgetkit-save-status { color: #a9b7ca; }
html body.night-mode .vf-widgetkit-choice { border-color: rgba(151, 178, 211, .18); background: #172337; }
html body.night-mode .vf-widgetkit-choice-copy strong { color: #eef5ff; }
html body.night-mode .vf-widgetkit-choice-copy small { color: #a9b7ca; }
html body.night-mode .vf-widgetkit-choice-icon { background: rgba(20, 126, 234, .18); }

/* Right-rail manager opens as an in-app workspace, never inside the narrow rail. */
body.vf-widgetkit-manager-open { overflow: hidden; }

.vf-widgetkit-manager {
  position: fixed;
  z-index: 2147483000;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 24px;
}

.vf-widgetkit-manager[hidden] { display: none !important; }

.vf-widgetkit-manager-backdrop {
  position: absolute;
  inset: 0;
  width: 100%;
  border: 0;
  background: rgba(10, 21, 39, .62);
  backdrop-filter: blur(5px);
}

.vf-widgetkit-manager-panel {
  position: relative;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  width: min(680px, 100%);
  max-height: min(760px, calc(100vh - 48px));
  overflow: hidden;
  border: 1px solid rgba(20, 126, 234, .18);
  border-radius: 22px;
  background: #f8fbff;
  box-shadow: 0 30px 80px rgba(5, 24, 50, .3);
}

.vf-widgetkit-manager-head {
  display: flex;
  gap: 20px;
  align-items: flex-start;
  justify-content: space-between;
  padding: 24px 26px 19px;
  border-bottom: 1px solid #e3ebf5;
  background: linear-gradient(135deg, #edf6ff, #effcf9);
}

.vf-widgetkit-manager-kicker { color: #147eea; font-size: 11px; font-weight: 800; letter-spacing: .1em; }
.vf-widgetkit-manager-head h3 { margin: 3px 0 4px; color: #172337; font-size: 23px; }
.vf-widgetkit-manager-head p { margin: 0; color: #68778b; font-size: 13px; }

.vf-widgetkit-manager-close {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 38px;
  height: 38px;
  border: 1px solid #d8e3ef;
  border-radius: 12px;
  background: #fff;
  color: #53647a;
}

.vf-widgetkit-manager .vf-widgetkit-picker-list {
  max-height: none;
  padding: 16px 20px;
  overflow-y: auto;
}

.vf-widgetkit-manager .vf-widgetkit-choice {
  grid-template-columns: 32px 40px minmax(0, 1fr) 76px;
  padding: 11px 12px;
  box-shadow: 0 3px 10px rgba(26, 50, 83, .04);
}

.vf-widgetkit-choice-handle {
  display: grid;
  place-items: center;
  width: 32px;
  height: 38px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: #8997aa;
  cursor: grab;
}

.vf-widgetkit-choice-handle:hover { background: #edf5ff; color: #147eea; }
.vf-widgetkit-choice.is-dragging { opacity: .48; border-color: #147eea; }
.vf-widgetkit-switch-label { display: flex; margin: 0; cursor: pointer; }
.vf-visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.vf-widgetkit-switch-label input { position: absolute; opacity: 0; pointer-events: none; }
.vf-widgetkit-switch-label .vf-widgetkit-switch {
  display: flex !important;
  flex: 0 0 64px;
  align-items: center;
  justify-content: center;
  width: 64px !important;
  min-width: 64px;
  height: 30px !important;
  overflow: visible;
  border: 1px solid #b8c2cf;
  border-radius: 9px;
  background: #e5e9ef;
  color: #465468;
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
  text-align: center;
  letter-spacing: .06em;
  box-shadow: none;
}
.vf-widgetkit-switch-label .vf-widgetkit-switch::before,
.vf-widgetkit-switch-label .vf-widgetkit-switch::after { display: none !important; content: none !important; }
.vf-widgetkit-switch-on { display: none; color: #fff; }
.vf-widgetkit-switch-off { display: block; }
.vf-widgetkit-switch-label input:checked + .vf-widgetkit-switch {
  border-color: #087af5;
  background: #087af5;
  color: #fff;
  box-shadow: 0 3px 9px rgba(8, 122, 245, .22);
}
.vf-widgetkit-switch-label input:checked + .vf-widgetkit-switch .vf-widgetkit-switch-off { display: none; }
.vf-widgetkit-switch-label input:checked + .vf-widgetkit-switch .vf-widgetkit-switch-on { display: block; }
.vf-widgetkit-switch-label input:focus-visible + .vf-widgetkit-switch { outline: 3px solid rgba(20, 126, 234, .25); outline-offset: 2px; }

.vf-widgetkit-manager-actions {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: flex-end;
  padding: 16px 20px;
  border-top: 1px solid #e3ebf5;
  background: #fff;
}

.vf-widgetkit-manager-actions .vf-widgetkit-save-status { margin-right: auto; }

html body.night-mode .vf-widgetkit-manager-panel { border-color: rgba(96, 138, 188, .3); background: #111c2e; }
html body.night-mode .vf-widgetkit-manager-head { border-color: rgba(96, 138, 188, .22); background: linear-gradient(135deg, #172a43, #143234); }
html body.night-mode .vf-widgetkit-manager-head h3 { color: #f2f7ff; }
html body.night-mode .vf-widgetkit-manager-head p { color: #a9b7ca; }
html body.night-mode .vf-widgetkit-manager-close,
html body.night-mode .vf-widgetkit-manager-actions { border-color: rgba(96, 138, 188, .22); background: #172337; color: #dce8f8; }
html body.night-mode .vf-widgetkit-switch-label .vf-widgetkit-switch { border-color: #65758a; background: #2a3546; color: #f0f5fb; }
html body.night-mode .vf-widgetkit-switch-label input:checked + .vf-widgetkit-switch { border-color: #48a5ff; background: #087af5; color: #fff; }

@media (max-width: 767.98px) {
  .vf-widgetkit-manager { padding: 0; place-items: end center; }
  .vf-widgetkit-manager-panel { width: 100%; max-height: 92vh; border-radius: 22px 22px 0 0; }
  .vf-widgetkit-manager-head { padding: 20px; }
}

html body #vf-main-content .sg-offcanvas-mainbar textarea.form-control,
html body #modal textarea.form-control {
  min-height: 112px;
  line-height: 1.5;
  resize: vertical;
}

/* Tabs and filter bars stay scannable and use a common selected state. */
html body #vf-main-content .sg-offcanvas-mainbar :is(.nav-tabs, .nav-pills, .content-tabs) {
  gap: 6px;
  min-width: 0;
}

html body #vf-main-content .sg-offcanvas-mainbar :is(.nav-tabs, .nav-pills, .content-tabs) :is(.nav-link, a) {
  min-height: 40px;
  border-radius: 10px !important;
  font-weight: 700;
  letter-spacing: 0;
}

html body #vf-main-content .sg-offcanvas-mainbar :is(.nav-tabs, .nav-pills, .content-tabs) :is(.nav-link.active, li.active > a, a.active) {
  box-shadow: 0 5px 14px color-mix(in srgb, var(--vf-ui-accent) 16%, transparent);
}

html body #vf-main-content .sg-offcanvas-mainbar :is(.vf-events-toolbar, .vf-dating-toolbar, .vf-library-toolbar, .vf-dos-toolbar, .filter-tabs, .filters-wrapper) {
  gap: 10px;
  padding-block: 10px;
}

/* Empty states feel purposeful rather than unfinished. */
html body #vf-main-content .sg-offcanvas-mainbar :is(.no-data, .empty-state, .vf-empty-state, [class*="-empty"]):not(input):not(textarea) {
  border-color: var(--vf-polish-border-soft) !important;
  border-radius: var(--vf-polish-radius) !important;
}

html body #vf-main-content .sg-offcanvas-mainbar :is(.no-data, .empty-state, .vf-empty-state) {
  padding: clamp(28px, 5vw, 56px) 22px !important;
  text-align: center;
}

/* Hero content polish without changing hero width, height, or page placement. */
html body #vf-main-content .main-wrapper :is(.page-header[class*="hero"], [class*="vf-"][class*="-hero"]):not(.vf-hero-credit):not(.vf-feed-hero-credit) {
  isolation: isolate;
}

html body #vf-main-content .main-wrapper :is(.page-header[class*="hero"], [class*="vf-"][class*="-hero"]):not(.vf-hero-credit):not(.vf-feed-hero-credit) :is(h1, .display-1, .display-2) {
  max-width: 18ch;
  margin-bottom: 12px;
  line-height: 1.06 !important;
  text-wrap: balance;
}

html body #vf-main-content .main-wrapper :is(.page-header[class*="hero"], [class*="vf-"][class*="-hero"]):not(.vf-hero-credit):not(.vf-feed-hero-credit) :is(p, .lead, [class*="subtitle"]) {
  max-width: 62ch;
  line-height: 1.5 !important;
}

/* Keep media and labels from producing incidental horizontal overflow. */
html body #vf-main-content .sg-offcanvas-mainbar :is(img, video, canvas, iframe) {
  max-width: 100%;
}

html body #vf-main-content .sg-offcanvas-mainbar :is(.badge, .label, [class*="-pill"]) {
  letter-spacing: 0;
}

/* Dark-mode parity for the polished surfaces. */
body.night-mode {
  --vf-polish-border: rgba(96, 121, 155, 0.32);
  --vf-polish-border-soft: rgba(96, 121, 155, 0.24);
  --vf-polish-shadow: 0 12px 30px rgba(0, 0, 0, 0.26), 0 2px 8px rgba(0, 0, 0, 0.16);
  --vf-polish-shadow-hover: 0 16px 38px rgba(0, 0, 0, 0.34), 0 3px 10px rgba(0, 0, 0, 0.2);
}

/* Mobile/PWA: compact, readable content with safe touch targets. */
@media (max-width: 767.98px) {
  html body #vf-main-content .sg-offcanvas-mainbar .card-header,
  html body #vf-main-content .vf-side-rail .card-header {
    min-height: 46px;
    padding: 12px 14px !important;
  }

  html body #vf-main-content .sg-offcanvas-mainbar .card-body {
    padding: 15px !important;
  }

  html body #vf-main-content .sg-offcanvas-mainbar :is(.btn, button.btn),
  html body #modal :is(.btn, button.btn) {
    min-height: 44px;
  }

  html body #vf-main-content .main-wrapper :is(.page-header[class*="hero"], [class*="vf-"][class*="-hero"]):not(.vf-hero-credit):not(.vf-feed-hero-credit) :is(h1, .display-1, .display-2) {
    max-width: 100%;
    margin-bottom: 10px;
    font-size: clamp(2rem, 10vw, 2.65rem) !important;
    line-height: 1.02 !important;
  }

  html body #vf-main-content .main-wrapper :is(.page-header[class*="hero"], [class*="vf-"][class*="-hero"]):not(.vf-hero-credit):not(.vf-feed-hero-credit) :is(p, .lead, [class*="subtitle"]) {
    max-width: 100%;
    font-size: 0.98rem !important;
    line-height: 1.45 !important;
  }

  html body #vf-main-content .sg-offcanvas-mainbar :is(.nav-tabs, .nav-pills, .content-tabs) {
    flex-wrap: wrap;
  }

  html body #vf-main-content .sg-offcanvas-mainbar :is(.nav-tabs, .nav-pills, .content-tabs) :is(.nav-link, a) {
    min-height: 44px;
  }

  html body #vf-main-content .vf-side-rail {
    display: none !important;
  }
}
/* Cover readability: preserve cover artwork while protecting overlaid identity text. */
.vf-profile-shell .profile-cover-wrapper::before,
.profile-header .profile-cover-wrapper::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(
    180deg,
    rgba(5, 14, 27, 0.04) 0%,
    rgba(5, 14, 27, 0.10) 38%,
    rgba(5, 14, 27, 0.46) 70%,
    rgba(5, 14, 27, 0.78) 100%
  );
}

.vf-profile-shell .profile-cover-wrapper > img,
.profile-header .profile-cover-wrapper > img {
  position: relative;
  z-index: 0;
}

.vf-profile-shell .profile-cover-buttons,
.vf-profile-shell .profile-cover-change,
.vf-profile-shell .profile-cover-crop,
.vf-profile-shell .profile-cover-position,
.vf-profile-shell .profile-cover-delete,
.vf-profile-shell .profile-cover-change-loader,
.vf-profile-shell .profile-cover-position-loader,
.vf-profile-shell .profile-cover-position-buttons,
.vf-profile-shell .profile-avatar-wrapper,
.vf-profile-shell .profile-name-wrapper,
.vf-profile-shell .profile-buttons-wrapper,
.vf-profile-shell .profile-header-stats {
  z-index: 3 !important;
}

.profile-header > .profile-avatar-wrapper {
  z-index: 3 !important;
}

.profile-header > .profile-name-wrapper,
.profile-header > .profile-buttons-wrapper {
  position: relative;
  z-index: 3 !important;
}

@media (min-width: 992px) {
  .profile-header > .profile-name-wrapper,
  .profile-header > .profile-buttons-wrapper {
    position: absolute;
  }
}

.vf-profile-shell .profile-name-wrapper > a:first-of-type,
.vf-profile-shell .profile-header-meta-item,
.vf-profile-shell .profile-header-pronouns {
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.72), 0 1px 3px rgba(0, 0, 0, 0.88);
}

/* Page headers do not use .vf-profile-shell; keep their overlay copy legible. */
html body .main-wrapper .profile-header .profile-name-wrapper > a:first-of-type,
html body .main-wrapper .profile-header .profile-name-wrapper > a:first-of-type:visited {
  color: #ffffff !important;
  text-shadow: 0 2px 14px rgba(0, 0, 0, 0.82), 0 1px 4px rgba(0, 0, 0, 0.96) !important;
}

html body .main-wrapper .profile-header .profile-header-meta-item,
html body .main-wrapper .profile-header .profile-header-meta-item > i,
html body .main-wrapper .profile-header .profile-header-meta-item > a,
html body .main-wrapper .profile-header .profile-header-pronouns {
  color: rgba(255, 255, 255, 0.94) !important;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.92), 0 1px 3px rgba(0, 0, 0, 1) !important;
}

/* Keep profile actions fully visible and interactive above the cover treatment. */
html body .main-wrapper .profile-header > .profile-buttons-wrapper,
html body .main-wrapper .vf-profile-shell .profile-header > .profile-buttons-wrapper {
  z-index: 6 !important;
  isolation: isolate;
}

/* The simplified navigation has its own native desktop rail, outside Theia. */
@media (min-width: 992px) {
  /* Keep the actual Bootstrap column in the grid.  Sticking the column rather
     than the tall card prevents feed updates from moving the rail or collapsing
     the gutter between navigation and feed. */
  html body .main-wrapper .sg-offcanvas-sidebar:has(.vf-simple-sidebar) {
    position: sticky !important;
    top: calc(82px + env(safe-area-inset-top, 0px)) !important;
    align-self: start !important;
    height: calc(100vh - 104px - env(safe-area-inset-top, 0px)) !important;
    overflow: visible !important;
    z-index: 900 !important;
  }

  /* New pages do not receive this wrapper; neutralize it on cached pages. */
  html body .main-wrapper .sg-offcanvas-sidebar:has(.vf-simple-sidebar) > .theiaStickySidebar {
    display: block !important;
    position: static !important;
    height: 100% !important;
    min-height: 0 !important;
    padding-top: 0 !important;
    transform: none !important;
  }

  html body .main-wrapper .sg-offcanvas-sidebar:has(.vf-simple-sidebar) .vf-simple-sidebar {
    position: static !important;
    height: 100% !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }

  html body .main-wrapper .sg-offcanvas-sidebar:has(.vf-simple-sidebar) .vf-simple-sidebar > .card-body {
    height: 100% !important;
    max-height: none !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    padding-right: 14px !important;
    scrollbar-width: thin;
    scrollbar-color: rgba(100, 116, 139, 0.42) transparent;
  }

  html body .main-wrapper .sg-offcanvas-sidebar:has(.vf-simple-sidebar) .vf-simple-sidebar > .card-body::-webkit-scrollbar {
    width: 6px;
  }

  html body .main-wrapper .sg-offcanvas-sidebar:has(.vf-simple-sidebar) .vf-simple-sidebar > .card-body::-webkit-scrollbar-track {
    background: transparent;
  }

  html body .main-wrapper .sg-offcanvas-sidebar:has(.vf-simple-sidebar) .vf-simple-sidebar > .card-body::-webkit-scrollbar-thumb {
    background: rgba(100, 116, 139, 0.38);
    border-radius: 999px;
  }

  html body .main-wrapper .sg-offcanvas-sidebar:has(.vf-simple-sidebar) .vf-simple-sidebar > .card-body::-webkit-scrollbar-thumb:hover {
    background: rgba(71, 85, 105, 0.58);
  }

  html body.modal-open .main-wrapper .sg-offcanvas-sidebar:has(.vf-simple-sidebar) {
    position: relative !important;
    top: auto !important;
    height: auto !important;
    z-index: 0 !important;
  }

  html body.modal-open .main-wrapper .sg-offcanvas-sidebar:has(.vf-simple-sidebar) .vf-simple-sidebar {
    height: auto !important;
    max-height: none !important;
  }
}

/* Mobile composer: retain a scrollable publishing sheet above browser and PWA safe areas. */
@media (max-width: 767.98px) {
  html body.modal-open #modal.js_modal-publisher.show {
    display: block !important;
    height: 100dvh !important;
    padding: calc(74px + env(safe-area-inset-top, 0px)) 10px calc(84px + env(safe-area-inset-bottom, 0px)) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  html body #modal.js_modal-publisher.show > .modal-dialog,
  html body #modal.js_modal-publisher.show > .modal-dialog.modal-lg,
  html body #modal.js_modal-publisher.show > .modal-dialog.modal-xl,
  html body #modal.js_modal-publisher.show > .modal-dialog.modal-dialog-centered {
    display: flex !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: calc(100vw - 20px) !important;
    min-height: 0 !important;
    max-height: calc(100dvh - 158px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
    margin: 0 auto !important;
  }

  html body #modal.js_modal-publisher.show .modal-content {
    display: flex !important;
    flex: 1 1 auto !important;
    flex-direction: column !important;
    min-height: 0 !important;
    max-height: calc(100dvh - 158px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
    overflow: hidden !important;
  }

  html body #modal.js_modal-publisher.show .modal-body,
  html body #modal.js_modal-publisher.show .js_modal-publisher-body {
    display: block !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding-bottom: calc(18px + env(safe-area-inset-bottom, 0px)) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }

  html body #modal.js_modal-publisher.show #publisher-box.publisher[data-modal-mode="true"] {
    min-height: 0 !important;
    padding-bottom: 16px !important;
  }

  html body #modal.js_modal-publisher.show #publisher-box.publisher[data-modal-mode="true"] .publisher-footer {
    padding-bottom: calc(16px + env(safe-area-inset-bottom, 0px)) !important;
  }

  /* The generic page composer may collapse its slider; a modal may not hide Publish. */
  html body #modal.js_modal-publisher.show #publisher-box.publisher[data-modal-mode="true"] .publisher-slider,
  html body #modal.js_modal-publisher.show #publisher-box.publisher[data-modal-mode="true"] .publisher-footer {
    display: block !important;
    height: auto !important;
  }

  html body #modal.js_modal-publisher.show #publisher-box.publisher[data-modal-mode="true"] .publisher-footer-buttons {
    display: flex !important;
  }

  /* Fit more composer tools above the publishing footer on phones. */
  html body #modal.js_modal-publisher.show #publisher-box.publisher[data-modal-mode="true"] .publisher-tools-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    gap: 7px !important;
  }

  html body #modal.js_modal-publisher.show #publisher-box.publisher[data-modal-mode="true"] .publisher-tools-tab {
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    border-radius: 12px !important;
  }
}

@media (max-width: 359.98px) {
  html body #modal.js_modal-publisher.show #publisher-box.publisher[data-modal-mode="true"] .publisher-tools-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  }
}

/* Local search for every emoji and sticker picker. */
.emoji-menu .vf-picker-search,
.emoji-menu .vf-picker-search-empty {
  display: none;
}

.emoji-menu.vf-picker-search-enabled .vf-picker-search {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 4px 4px 8px;
  padding: 0 10px;
  border: 1px solid rgba(105, 126, 159, 0.24);
  border-radius: 10px;
  background: rgba(247, 250, 255, 0.96);
}

.emoji-menu.vf-picker-search-enabled .vf-picker-search > i {
  color: #70819a;
  font-size: 12px;
}

.emoji-menu.vf-picker-search-enabled .js_picker-search {
  min-width: 0;
  height: 34px;
  padding: 0;
  color: #172033;
  font-size: 13px;
  background: transparent;
  border: 0;
  box-shadow: none;
}

.emoji-menu.vf-picker-search-enabled .js_picker-search:focus {
  box-shadow: none;
}

.emoji-menu.vf-picker-search-enabled .vf-picker-search-empty:not(.x-hidden) {
  display: block;
  padding: 18px 12px;
  color: #718198;
  font-size: 13px;
  text-align: center;
}

.emoji-menu.vf-picker-search-enabled .vf-picker-search-hidden {
  display: none !important;
}

.emoji-menu.vf-picker-search-enabled .vf-picker-search-match {
  display: block !important;
}

.emoji-menu.vf-picker-search-enabled .tab-content {
  max-height: 198px !important;
}

.emoji-menu.vf-picker-search-enabled .js_scroller {
  max-height: 196px !important;
}

body.night-mode .emoji-menu.vf-picker-search-enabled .vf-picker-search {
  border-color: rgba(133, 157, 193, 0.34);
  background: rgba(22, 34, 51, 0.92);
}

body.night-mode .emoji-menu.vf-picker-search-enabled .js_picker-search {
  color: #edf4ff;
}

@media (max-width: 767.98px) {
  .emoji-menu.vf-picker-search-enabled .tab-content,
  .emoji-menu.vf-picker-search-enabled .js_scroller {
    max-height: 156px !important;
  }
}

/* Keep the picker search above the popover chrome and fully keyboard-accessible. */
html body .emoji-menu.vf-picker-search-enabled,
html body .emoji-menu.vf-picker-search-enabled .vf-picker-search,
html body .emoji-menu.vf-picker-search-enabled .js_picker-search {
  pointer-events: auto !important;
}

html body .emoji-menu.vf-picker-search-enabled .vf-picker-search {
  position: relative !important;
  z-index: 2147483004 !important;
  isolation: isolate;
}

html body .emoji-menu.vf-picker-search-enabled .js_picker-search {
  position: relative !important;
  z-index: 1 !important;
  display: block !important;
  flex: 1 1 auto !important;
  width: 100% !important;
  user-select: text !important;
  -webkit-user-select: text !important;
  touch-action: manipulation;
}

/* Search adds a real row to the picker, so reserve space for it in composer popovers. */
html body .emoji-menu.vf-detached-emoji-menu.vf-picker-search-enabled {
  width: min(304px, calc(100vw - 24px)) !important;
  height: auto !important;
  max-height: min(286px, calc(100dvh - 32px)) !important;
  padding: 30px 10px 10px !important;
  border-radius: 14px !important;
}

html body .emoji-menu.vf-detached-emoji-menu.vf-picker-search-enabled .vf-picker-search {
  display: flex !important;
  align-items: center !important;
  min-height: 38px !important;
  margin: 0 34px 8px 0 !important;
  padding: 0 11px !important;
  gap: 8px !important;
  border: 1px solid rgba(115, 135, 165, 0.28) !important;
  border-radius: 10px !important;
  background: #f7f9fc !important;
  box-shadow: inset 0 1px 2px rgba(15, 34, 65, 0.05) !important;
}

html body .emoji-menu.vf-detached-emoji-menu.vf-picker-search-enabled .vf-picker-search > i {
  flex: 0 0 auto;
  color: #6c7d95 !important;
}

html body .emoji-menu.vf-detached-emoji-menu.vf-picker-search-enabled .js_picker-search {
  height: 36px !important;
  min-height: 36px !important;
  margin: 0 !important;
  padding: 0 4px 0 2px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #172033 !important;
  font-size: 13px !important;
  line-height: 36px !important;
  box-shadow: none !important;
  outline: 0 !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}

html body .emoji-menu.vf-detached-emoji-menu.vf-picker-search-enabled .js_picker-search:focus,
html body .emoji-menu.vf-detached-emoji-menu.vf-picker-search-enabled .js_picker-search:focus-visible {
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

html body .emoji-menu.vf-detached-emoji-menu.vf-picker-search-enabled .js_picker-search::placeholder {
  color: #8290a5 !important;
  opacity: 1;
}

html body .emoji-menu.vf-detached-emoji-menu.vf-picker-search-enabled .vf-picker-search:focus-within {
  border-color: rgba(47, 109, 255, 0.7) !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(47, 109, 255, 0.12) !important;
}

html body .emoji-menu.vf-detached-emoji-menu.vf-picker-search-enabled .tab-content,
html body .emoji-menu.vf-detached-emoji-menu.vf-picker-search-enabled .js_scroller {
  height: 146px !important;
  max-height: 146px !important;
}

html body .emoji-menu.vf-detached-emoji-menu.vf-picker-search-enabled .nav-tabs {
  height: 42px !important;
  min-height: 42px !important;
  margin-top: 6px !important;
  padding: 4px 0 0 !important;
}

body.night-mode .emoji-menu.vf-detached-emoji-menu.vf-picker-search-enabled .vf-picker-search {
  border-color: rgba(117, 145, 183, 0.38) !important;
  background: rgba(31, 43, 63, 0.96) !important;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2) !important;
}

body.night-mode .emoji-menu.vf-detached-emoji-menu.vf-picker-search-enabled .js_picker-search {
  color: #edf4ff !important;
}

/* Keep chat settings out of the legacy contact rail so it has an independent click target. */
@media (min-width: 1200px) {
  html body .vf-chat-settings-fab {
    position: fixed !important;
    right: 18px !important;
    bottom: 86px !important;
    left: auto !important;
    z-index: 2147483000 !important;
    display: block !important;
    width: 42px !important;
    height: 42px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    pointer-events: auto !important;
  }

  html body .vf-chat-settings-fab > summary {
    position: relative !important;
    z-index: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 42px !important;
    height: 42px !important;
    margin: 0 !important;
    padding: 0 !important;
    cursor: pointer !important;
    pointer-events: auto !important;
    left: -8px;
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.2) !important;
  }

  html body .vf-chat-settings-fab > summary::-webkit-details-marker {
    display: none !important;
  }

  html body .vf-chat-settings-fab[open] .js_chat-settings-menu {
    position: fixed !important;
    right: 72px !important;
    bottom: 74px !important;
    left: auto !important;
    z-index: 2147483001 !important;
    display: block !important;
    width: 236px !important;
    max-width: calc(100vw - 96px) !important;
    transform: none !important;
    pointer-events: auto !important;
  }
}

@media (max-width: 1199.98px) {
  html body .vf-chat-settings-fab {
    display: none !important;
  }
}

/* Final desktop rail edge alignment. This must follow the legacy rail variants above. */
@media (min-width: 1200px) {
  html:root body .chat-sidebar {
    position: fixed !important;
    top: var(--vf-chat-sidebar-top) !important;
    right: 0 !important;
    bottom: 0 !important;
    left: auto !important;
    width: 70px !important;
    height: calc(100vh - var(--vf-chat-sidebar-top)) !important;
    min-height: 0 !important;
    max-height: calc(100vh - var(--vf-chat-sidebar-top)) !important;
    margin: 0 !important;
    border-right: 0 !important;
    border-bottom: 0 !important;
  }

  /* The scrollbar gutter remains outside fixed content; match it to the rail instead of covering it. */
  html,
  body {
    scrollbar-color: rgba(93, 108, 129, 0.58) #ffffff;
  }

  html::-webkit-scrollbar,
  body::-webkit-scrollbar {
    width: 10px;
    height: 10px;
    background: #ffffff;
  }

  html::-webkit-scrollbar-track,
  body::-webkit-scrollbar-track,
  html::-webkit-scrollbar-corner,
  body::-webkit-scrollbar-corner {
    background: #ffffff;
  }

  /* Chat settings toggle */
  html body .vf-chat-settings-fab .js_chat-settings-toggle {
    top: 10px;
    right: -5px;
    left: auto;
  }

  /* Chat sidebar content */
  html body .chat-sidebar-shell .chat-sidebar-content {
    left: 12px !important;
  }
}

/* Action description */
.dropdown-item .action-desc {
  position: relative;
  left: 10px;
}
/* Home discovery and creator rail */
.vf-creative-discovery{display:flex;gap:8px;margin:0 0 16px;padding:10px;overflow-x:auto;scrollbar-width:none;border:1px solid rgba(139,92,246,.14);border-radius:18px;background:linear-gradient(135deg,rgba(255,255,255,.98),rgba(247,245,255,.96));box-shadow:0 10px 28px rgba(31,41,55,.06)}
.vf-creative-discovery::-webkit-scrollbar{display:none}.vf-creative-discovery a,.vf-creative-discovery button{display:inline-flex;flex:0 0 auto;align-items:center;gap:7px;min-height:40px;padding:0 13px;border:1px solid rgba(139,92,246,.12);border-radius:12px;background:#fff;color:#536076;font:inherit;font-size:.78rem;font-weight:750;text-decoration:none;cursor:pointer;transition:.18s ease}.vf-creative-discovery a:hover,.vf-creative-discovery button:hover,.vf-creative-discovery a.is-active,.vf-creative-discovery button.is-active{border-color:transparent;background:linear-gradient(135deg,#6d5dfc,#9b5de5);color:#fff;box-shadow:0 8px 18px rgba(109,93,252,.22);transform:translateY(-1px)}
.vf-creator-snapshot{overflow:hidden}.vf-creator-snapshot-head{display:flex;align-items:center;gap:11px;padding:16px;background:linear-gradient(145deg,rgba(109,93,252,.13),rgba(20,184,166,.08))}.vf-creator-snapshot-avatar{flex:0 0 52px;width:52px;height:52px;padding:3px;border-radius:50%;background:linear-gradient(135deg,#6d5dfc,#20c4a7)}.vf-creator-snapshot-avatar img{width:100%;height:100%;border:2px solid #fff;border-radius:50%;object-fit:cover}.vf-creator-snapshot-head div{min-width:0}.vf-creator-snapshot-head span,.vf-creator-snapshot-head small{display:block;color:#728096;font-size:.7rem}.vf-creator-snapshot-head strong{display:block;overflow:hidden;color:#1f2b3d;font-size:.94rem;text-overflow:ellipsis;white-space:nowrap}.vf-creator-snapshot-stats{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(139,92,246,.1);border-bottom:1px solid rgba(139,92,246,.1)}.vf-creator-snapshot-stats a{padding:12px 4px;color:#5c687b;text-align:center;text-decoration:none}.vf-creator-snapshot-stats a+a{border-left:1px solid rgba(139,92,246,.1)}.vf-creator-snapshot-stats strong,.vf-creator-snapshot-stats span{display:block}.vf-creator-snapshot-stats strong{color:#252f43;font-size:1rem}.vf-creator-snapshot-stats span{font-size:.65rem}.vf-creator-snapshot-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:12px}.vf-creator-snapshot-actions a{display:flex;align-items:center;justify-content:center;gap:6px;min-height:36px;border-radius:10px;background:#f2f0ff;color:#6254cf;font-size:.68rem;font-weight:800;text-decoration:none}.vf-creator-snapshot-actions a:last-child{background:#eef8f6;color:#178875}
.vf-fresh-clips-card .card-header{display:flex;align-items:center;justify-content:space-between}.vf-fresh-clips-card .card-header strong{display:flex;align-items:center;gap:7px}.vf-fresh-clips-card .card-header strong i{color:#7b61ff}.vf-fresh-clips-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.vf-fresh-clip{position:relative;aspect-ratio:9/14;overflow:hidden;border-radius:10px;background:#e9eaf1}.vf-fresh-clip img,.vf-fresh-clip-placeholder{display:flex;width:100%;height:100%;align-items:center;justify-content:center;object-fit:cover;color:#7467d8;background:linear-gradient(145deg,#eeebff,#e4f8f4)}.vf-fresh-clip::after{content:"";position:absolute;inset:40% 0 0;background:linear-gradient(transparent,rgba(11,18,31,.68))}.vf-fresh-clip-play{position:absolute;z-index:2;top:50%;left:50%;display:grid;width:28px;height:28px;place-items:center;border-radius:50%;background:rgba(255,255,255,.88);color:#6658d8;font-size:.65rem;transform:translate(-50%,-50%)}.vf-fresh-clip-views{position:absolute;z-index:2;right:5px;bottom:5px;color:#fff;font-size:.6rem;font-weight:700}.vf-fresh-clip-views i{margin-right:3px}
body.night-mode .vf-creative-discovery{border-color:rgba(139,92,246,.25);background:linear-gradient(135deg,rgba(24,32,48,.98),rgba(31,29,55,.96))}body.night-mode .vf-creative-discovery a,body.night-mode .vf-creative-discovery button{border-color:rgba(139,92,246,.22);background:#202b3d;color:#c7d1df}body.night-mode .vf-creator-snapshot-head strong,body.night-mode .vf-creator-snapshot-stats strong{color:#eef3fb}body.night-mode .vf-creator-snapshot-stats a{color:#aeb9ca}body.night-mode .vf-creator-snapshot-actions a{background:rgba(109,93,252,.2);color:#c8c0ff}body.night-mode .vf-creator-snapshot-actions a:last-child{background:rgba(20,184,166,.16);color:#79dac8}
@media(max-width:767.98px){.vf-creative-discovery{margin-right:-4px;margin-left:-4px;padding:8px;border-radius:15px}.vf-creative-discovery a,.vf-creative-discovery button{min-height:38px;padding:0 11px;font-size:.74rem}}

/* Hi24-inspired discovery tiles in VibeForge colours */
.vf-creative-discovery{gap:7px;padding:10px;border-color:#e6eaf0;background:#fff;box-shadow:0 8px 24px rgba(16,24,40,.07)}
.vf-creative-discovery a,.vf-creative-discovery button{min-width:82px;min-height:70px;padding:8px 10px;flex-direction:column;justify-content:center;gap:3px;border:0;border-radius:14px;background:#f4f6f9;color:#344054;box-shadow:none}
.vf-creative-discovery a>i,.vf-creative-discovery button>i{font-size:17px;color:#087af5}
.vf-creative-discovery a>span,.vf-creative-discovery button>span{display:flex;flex-direction:column;align-items:center;line-height:1.08}
.vf-creative-discovery strong{font-size:.78rem;font-weight:800;color:inherit}.vf-creative-discovery small{margin-top:3px;font-size:.64rem;font-weight:650;color:#98a2b3}
.vf-creative-discovery a:hover,.vf-creative-discovery button:hover{border-color:transparent;background:#eaf4ff;color:#075fc2;box-shadow:none;transform:translateY(-1px)}
.vf-creative-discovery a.is-active,.vf-creative-discovery button.is-active{background:linear-gradient(145deg,#087af5,#1769d2);color:#fff;box-shadow:0 8px 18px rgba(8,122,245,.24);transform:none}
.vf-creative-discovery a.is-active>i,.vf-creative-discovery button.is-active>i,.vf-creative-discovery a.is-active small,.vf-creative-discovery button.is-active small{color:#fff}
.vf-creative-discovery .vf-creative-discovery-next{position:sticky;right:0;z-index:2;align-self:center;min-width:34px;width:34px;min-height:34px;height:34px;padding:0;border-radius:50%;flex:0 0 34px;background:#087af5;color:#fff;box-shadow:0 6px 14px rgba(8,122,245,.25)}
.vf-creative-discovery .vf-creative-discovery-next>i{color:#fff;font-size:12px}
body.night-mode .vf-creative-discovery{border-color:#2a3140;background:#151922}body.night-mode .vf-creative-discovery a,body.night-mode .vf-creative-discovery button{background:#202734;color:#e4e7ec}body.night-mode .vf-creative-discovery small{color:#98a2b3}
.vf-creative-discovery a,.vf-creative-discovery button{width:86px;min-width:86px;max-width:86px}.vf-creative-discovery strong,.vf-creative-discovery small{max-width:72px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vf-creative-discovery .vf-creative-discovery-next{width:34px;min-width:34px;max-width:34px}
.vf-creative-discovery .vf-creative-discovery-prev{position:sticky;left:0;z-index:2;align-self:center;width:34px;min-width:34px;max-width:34px;min-height:34px;height:34px;padding:0;border-radius:50%;flex:0 0 34px;background:#087af5;color:#fff;box-shadow:0 6px 14px rgba(8,122,245,.25)}.vf-creative-discovery .vf-creative-discovery-prev>i{color:#fff;font-size:12px}.vf-creative-discovery .vf-creative-discovery-prev:disabled,.vf-creative-discovery .vf-creative-discovery-next:disabled{visibility:hidden;pointer-events:none}
.vf-creative-discovery-shell{position:relative;margin-bottom:16px}.vf-creative-discovery-shell .vf-creative-discovery{margin-bottom:0;padding-right:48px;padding-left:48px}.vf-creative-discovery-shell::before,.vf-creative-discovery-shell::after{content:"";position:absolute;z-index:2;top:1px;bottom:1px;width:50px;pointer-events:none}.vf-creative-discovery-shell::before{left:1px;border-radius:17px 0 0 17px;background:linear-gradient(90deg,#fff 55%,rgba(255,255,255,0))}.vf-creative-discovery-shell::after{right:1px;border-radius:0 17px 17px 0;background:linear-gradient(270deg,#fff 55%,rgba(255,255,255,0))}.vf-creative-discovery-arrow{position:absolute;z-index:4;top:50%;width:36px;height:36px;padding:0;border:1px solid #dbe4ef;border-radius:50%;display:grid;place-items:center;background:#087af5;color:#fff;box-shadow:0 7px 18px rgba(8,122,245,.28),0 2px 5px rgba(16,24,40,.12);transform:translateY(-50%);transition:opacity .18s ease,transform .18s ease,box-shadow .18s ease;cursor:pointer}.vf-creative-discovery-prev{left:8px}.vf-creative-discovery-next{right:8px}.vf-creative-discovery-arrow i{font-size:11px}.vf-creative-discovery-arrow:hover{background:#066bd7;box-shadow:0 9px 22px rgba(8,122,245,.34),0 2px 5px rgba(16,24,40,.14);transform:translateY(-50%) scale(1.04)}.vf-creative-discovery-arrow:focus-visible{outline:0;box-shadow:0 0 0 3px rgba(8,122,245,.2),0 7px 18px rgba(8,122,245,.28)}.vf-creative-discovery-arrow:disabled{opacity:0;pointer-events:none}.vf-creative-discovery-shell.is-at-start::before,.vf-creative-discovery-shell.is-at-end::after{opacity:.25}body.night-mode .vf-creative-discovery-shell::before{background:linear-gradient(90deg,#151922 55%,rgba(21,25,34,0))}body.night-mode .vf-creative-discovery-shell::after{background:linear-gradient(270deg,#151922 55%,rgba(21,25,34,0))}
@media(max-width:767.98px){.vf-creative-discovery a,.vf-creative-discovery button{min-width:76px;min-height:64px;padding:7px 9px}}

/* Discovery navigation remains permanently visible at both ends of the strip. */
.vf-creative-discovery-shell {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) 38px;
  align-items: center;
  gap: 4px;
  min-height: 90px;
  padding: 8px;
  overflow: hidden;
  border: 1px solid #e6eaf0;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(16, 24, 40, .07);
}

.vf-creative-discovery-shell .vf-creative-discovery {
  grid-column: 2;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.vf-creative-discovery-shell::before,
.vf-creative-discovery-shell::after { display: none; }

.vf-creative-discovery-arrow,
.vf-creative-discovery-prev,
.vf-creative-discovery-next {
  position: static !important;
  z-index: 1;
  display: grid !important;
  grid-row: 1;
  align-self: center;
  width: 36px !important;
  min-width: 36px !important;
  max-width: 36px !important;
  height: 36px;
  min-height: 36px !important;
  padding: 0 !important;
  border: 0;
  border-radius: 11px !important;
  background: #087af5 !important;
  color: #fff !important;
  box-shadow: 0 6px 14px rgba(8, 122, 245, .22) !important;
  transform: none !important;
}

.vf-creative-discovery-prev { grid-column: 1; }
.vf-creative-discovery-next { grid-column: 3; }
.vf-creative-discovery-arrow:disabled {
  display: grid !important;
  opacity: .44;
  pointer-events: none;
}

html body.night-mode .vf-creative-discovery-shell { border-color: #2a3140; background: #151922; }

@media(max-width:767.98px) {
  .vf-creative-discovery-shell { grid-template-columns: 34px minmax(0, 1fr) 34px; min-height: 80px; padding: 6px; border-radius: 15px; }
  .vf-creative-discovery-arrow,.vf-creative-discovery-prev,.vf-creative-discovery-next { width: 32px !important; min-width: 32px !important; max-width: 32px !important; height: 32px; min-height: 32px !important; border-radius: 10px !important; }
}

/* Active discovery tiles use the complete high-contrast set, including the subtitle. */
.vf-creative-discovery :is(a, button).is-active,
.vf-creative-discovery :is(a, button)[aria-pressed="true"] { color: #fff !important; }
.vf-creative-discovery :is(a, button).is-active :is(strong, small, i),
.vf-creative-discovery :is(a, button)[aria-pressed="true"] :is(strong, small, i) { color: #fff !important; }

html body .main-wrapper .vf-creative-discovery button.is-active small,
html body .main-wrapper .vf-creative-discovery button[aria-pressed="true"] small,
html body .main-wrapper .vf-creative-discovery a.is-active small {
  color: #fff !important;
  -webkit-text-fill-color: #fff;
  opacity: 1 !important;
}

/* Blog article experience: editorial card and utility rail inspired by the Hi24 reading layout. */
.vf-blogs-shell .vf-content-with-right-rail { align-items: flex-start; }
.vf-blog-breadcrumb {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
  margin: 0 0 14px;
  padding: 13px 16px;
  overflow: hidden;
  border: 1px solid #e2eaf3;
  border-radius: 14px;
  background: rgba(255, 255, 255, .88);
  color: #718096;
  box-shadow: 0 7px 20px rgba(31, 55, 89, .05);
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}
.vf-blog-breadcrumb a { color: #52708e; text-decoration: none; }
.vf-blog-breadcrumb a:hover { color: #087af5; }
.vf-blog-breadcrumb > i { color: #9dacbf; font-size: 9px; }
.vf-blog-breadcrumb > span { overflow: hidden; color: #2b3a50; text-overflow: ellipsis; }
.vf-blog-breadcrumb a:first-child i { margin-right: 5px; color: #087af5; }

.vf-blog-article .vf-blog-article-inner {
  overflow: hidden;
  border: 1px solid #e3eaf3;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 14px 34px rgba(31, 55, 89, .09);
}
.vf-blog-article .vf-blog-title {
  margin: 22px 24px 12px;
  color: #172b46;
  font-size: clamp(25px, 3vw, 35px);
  font-weight: 850;
  line-height: 1.12;
  letter-spacing: -.025em;
}
.vf-blog-article .vf-blog-kicker { margin: 0 24px 13px; }
.vf-blog-article .vf-blog-kicker-pill {
  display: inline-flex;
  align-items: center;
  min-height: 27px;
  padding: 0 10px;
  border: 0;
  border-radius: 8px;
  background: linear-gradient(135deg, #087af5, #14a9af);
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  text-decoration: none;
}
.vf-blog-article .vf-blog-kicker > i { color: #97a6b8; font-size: 9px; }
.vf-blog-article .vf-blog-byline { margin: 0 24px 20px; padding: 14px; border-radius: 14px; background: linear-gradient(135deg, #edf7ff, #eefcf9); }
.vf-blog-article .vf-blog-author-card,
.vf-blog-article .vf-blog-reading-meta { margin-bottom: 0 !important; }
.vf-blog-article .vf-blog-author-card .post-avatar-picture { width: 42px; height: 42px; border: 2px solid #fff; box-shadow: 0 3px 10px rgba(12, 83, 137, .14); }
.vf-blog-article .vf-blog-author-card .post-meta { padding-top: 1px; }
.vf-blog-article .vf-blog-author-card .post-meta a { color: #1d3655; font-weight: 800; }
.vf-blog-article .vf-blog-author-card .post-time { color: #6d8095; font-size: 12px; }
.vf-blog-article .vf-blog-reading-meta { display: flex; align-items: center; justify-content: flex-end; gap: 6px; color: #58718d; }
.vf-blog-article .blog-meta-counter { min-height: 30px; padding: 6px 9px; border-radius: 9px; background: rgba(255, 255, 255, .8); font-size: 12px; }
.vf-blog-cover { display: grid; place-items: center; margin: 0 24px 22px !important; overflow: hidden; border-radius: 15px; background: #eaf0f7; }
.vf-blog-cover img { display: block; width: auto; max-width: 100%; height: auto; max-height: min(72vh, 720px); object-fit: contain; object-position: center; }
/* Article copy should fill the article column; the surrounding shell controls
 * its responsive width rather than an additional, fixed reading-column cap. */
.blog-wrapper .blog-text,
.vf-blog-article .blog-text { width: 100%; max-width: 100%; margin: 0; padding: 0 24px 26px; color: #314158; font-size: 16px; line-height: 1.75; }
.vf-blog-article .blog-text :is(h2, h3, h4) { margin-top: 1.65em; color: #1c334f; font-weight: 850; line-height: 1.22; }
.vf-blog-article .blog-text a { color: #087af5; font-weight: 700; }
.vf-blog-article .blog-tags { padding: 0 24px 22px; }
.vf-blog-article .post-stats { margin: 0 24px; padding: 12px 0; border-top: 1px solid #e8eef5; }
.vf-blog-article .post-actions { margin: 0 !important; border-top: 1px solid #e8eef5; }

.vf-content-right-rail .vf-blog-sidebar-card {
  margin-bottom: 14px;
  padding: 0;
  border: 1px solid #e2eaf3;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 9px 24px rgba(31, 55, 89, .07);
}
.vf-content-right-rail .vf-blog-sidebar-card .blogs-widget-header { margin: 0; padding: 13px 16px; border: 0; border-bottom: 1px solid rgba(218, 228, 239, .82); background: linear-gradient(90deg, rgba(8, 122, 245, .067), rgba(18, 186, 176, .043)); }
/* One title treatment for every right-rail widget. This deliberately replaces
 * the legacy blog-widget all-caps title and its title-only underline. */
html body .main-wrapper :is(.vf-right-rail, .vf-side-rail, .vf-content-right-rail) :is(.blogs-widget-title, .sidebar-widget-heading, .card-header > strong, .vf-widgetkit-head-copy > strong) {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  color: #263952 !important;
  font-family: var(--vf-font-ui, "Sora", Arial, sans-serif) !important;
  font-size: 15px !important;
  font-weight: 750 !important;
  letter-spacing: 0 !important;
  line-height: 1.35 !important;
  text-transform: none !important;
}

html body .main-wrapper :is(.vf-right-rail, .vf-side-rail, .vf-content-right-rail) :is(.blogs-widget-title, .sidebar-widget-heading) > i,
html body .main-wrapper :is(.vf-right-rail, .vf-side-rail, .vf-content-right-rail) .sidebar-widget-icon {
  width: 18px;
  margin: 0 !important;
  color: #087af5 !important;
  font-size: 14px !important;
  line-height: 1 !important;
  text-align: center;
}

html body.night-mode .main-wrapper :is(.vf-right-rail, .vf-side-rail, .vf-content-right-rail) :is(.blogs-widget-title, .sidebar-widget-heading, .card-header > strong, .vf-widgetkit-head-copy > strong) {
  color: #edf5ff !important;
}
.vf-blog-sidebar-search > .mb10 { margin-right: 16px !important; margin-left: 16px !important; }
.vf-blog-sidebar-search > .mb10:first-child { margin-top: 14px !important; }
.vf-blog-sidebar-search > .blogs-widget-header + .mb10 { margin-top: 14px !important; margin-bottom: 16px !important; }
.vf-blog-sidebar-search .btn-success { border: 0; border-radius: 10px; background: linear-gradient(135deg, #087af5, #159ecb); font-weight: 800; box-shadow: 0 7px 14px rgba(8, 122, 245, .18); }
.vf-blog-sidebar-search .input-group { overflow: hidden; border: 1px solid #dfe8f2; border-radius: 10px; }
.vf-blog-sidebar-search .form-control { min-height: 40px; border: 0 !important; background: #f6f9fc; }
.vf-blog-sidebar-search .btn-secondary { border: 0; background: #edf4fb; color: #087af5; font-weight: 800; }
.vf-blog-sidebar-categories .blog-categories { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 14px 16px 16px; list-style: none; }
.vf-blog-sidebar-categories .blog-categories li { margin: 0; }
.vf-blog-sidebar-categories .blog-category { display: inline-flex; padding: 5px 8px; border-radius: 7px; background: #f1f5f9; color: #617187; font-size: 10px; font-weight: 800; text-decoration: none; text-transform: uppercase; }
.vf-blog-sidebar-categories .blog-category:hover { background: #e2f2ff; color: #087af5; }
.vf-blog-sidebar-related .post-media.list { margin: 0; padding: 9px 0; border: 0; border-top: 1px solid #edf1f6; box-shadow: none; }
.vf-blog-sidebar-related .post-media.list:first-of-type { border-top: 0; }
.vf-blog-sidebar-related .post-media-image { width: 52px; height: 52px; border-radius: 9px; overflow: hidden; }
.vf-blog-sidebar-related .post-media-meta .title { color: #32445b; font-size: 12px; font-weight: 800; }
.vf-blog-sidebar-related .post-media-meta .info { color: #8190a2; font-size: 10px; }
.vf-blog-sidebar-related .vf-blog-related-item { padding-right: 16px; padding-left: 16px; }

html body.night-mode .vf-blog-breadcrumb,
html body.night-mode .vf-blog-article .vf-blog-article-inner,
html body.night-mode .vf-content-right-rail .vf-blog-sidebar-card { border-color: #2b3b51; background: #162235; box-shadow: 0 14px 34px rgba(0, 0, 0, .2); }
html body.night-mode .vf-blog-breadcrumb > span,
html body.night-mode .vf-blog-article .vf-blog-title,
html body.night-mode .vf-blog-article .blog-text :is(h2, h3, h4),
html body.night-mode .vf-content-right-rail .vf-blog-sidebar-card .blogs-widget-title { color: #edf5ff; }
html body.night-mode .vf-blog-article .vf-blog-byline { background: linear-gradient(135deg, #19334d, #173b3b); }
html body.night-mode .vf-blog-article .blog-text { color: #cfdaea; }
html body.night-mode .vf-blog-sidebar-categories .blog-category { background: #26364b; color: #c2d1e0; }

@media (max-width: 991.98px) {
  .vf-blog-article .vf-blog-reading-meta { justify-content: flex-start; margin-top: 10px; }
}
@media (max-width: 575.98px) {
  .vf-blog-breadcrumb { margin-bottom: 10px; padding: 11px 13px; }
  .vf-blog-article .vf-blog-title { margin: 18px 16px 10px; font-size: 25px; }
  .vf-blog-article .vf-blog-kicker { margin-right: 16px; margin-left: 16px; }
  .vf-blog-article .vf-blog-byline { margin: 0 16px 16px; padding: 12px; }
  .vf-blog-cover { margin: 0 16px 18px !important; border-radius: 12px; }
  .vf-blog-article .blog-text { padding: 0 16px 22px; font-size: 15px; line-height: 1.68; }
}

/* Article pages favor focused reading: a wide article and its contextual
 * blog tools, without reserving space for the global feed navigation. */
@media (max-width: 1279.98px) {
  .vf-blog-article-shell .vf-blog-article-mainbar {
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
  }
}

@media (min-width: 1280px) {
  .vf-blog-article-shell {
    width: min(100% - 32px, 1600px) !important;
    max-width: 1600px !important;
    margin-right: auto !important;
    margin-left: auto !important;
    padding-right: 12px !important;
    padding-left: 12px !important;
  }
  .vf-blog-article-shell > .row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    margin-right: 0 !important;
    margin-left: 0 !important;
  }
  .vf-blog-article-shell > .row > .vf-blog-article-mainbar {
    flex: none !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
  }
  .vf-blog-article-shell .vf-content-with-right-rail {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 337px) !important;
    gap: 22px !important;
    align-items: start;
    margin-right: 0 !important;
    margin-left: 0 !important;
  }
  .vf-blog-article-shell .vf-content-main,
  .vf-blog-article-shell .vf-content-right-rail {
    flex: none !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
  }
  .vf-blog-article-shell .vf-content-right-rail {
    width: 337px !important;
    max-width: 337px !important;
  }
}

@media (min-width: 1440px) {
  .vf-blog-article-shell .vf-content-with-right-rail {
    grid-template-columns: minmax(0, 1fr) 337px !important;
    justify-content: stretch;
  }
}

/* Blog discovery navigation: a small, focused workspace header. */
.vf-blogs-toolbar {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  min-height: 66px;
  margin: 0 0 18px;
  overflow: hidden;
  border: 1px solid #e5ebf2;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(31, 55, 89, .07);
}
.vf-blogs-toolbar-tabs { display: flex; align-items: stretch; min-width: 0; }
.vf-blogs-toolbar-tab {
  position: relative;
  display: inline-flex;
  gap: 8px;
  align-items: center;
  min-height: 66px;
  padding: 0 24px;
  color: #65758a;
  font-size: 14px;
  font-weight: 800;
  text-decoration: none;
}
.vf-blogs-toolbar-tab i { color: #8a99ad; font-size: 13px; }
.vf-blogs-toolbar-tab::after {
  position: absolute;
  right: 18px;
  bottom: 0;
  left: 18px;
  height: 3px;
  border-radius: 3px 3px 0 0;
  background: transparent;
  content: "";
}
.vf-blogs-toolbar-tab:hover { color: #087af5; background: #f8fbff; }
.vf-blogs-toolbar-tab:hover i { color: #087af5; }
.vf-blogs-toolbar-tab.is-active { color: #087af5; }
.vf-blogs-toolbar-tab.is-active i { color: #087af5; }
.vf-blogs-toolbar-tab.is-active::after { background: linear-gradient(90deg, #087af5, #14a9af); }
.vf-blogs-toolbar-create {
  display: inline-flex;
  flex: 0 0 auto;
  gap: 8px;
  align-items: center;
  justify-content: center;
  min-width: 150px;
  margin: 9px;
  padding: 0 18px;
  border-radius: 9px;
  background: #087af5;
  color: #fff;
  box-shadow: 0 7px 16px rgba(8, 122, 245, .23);
  font-size: 13px;
  font-weight: 850;
  text-decoration: none;
}
.vf-blogs-toolbar-create:hover { background: #066bd7; color: #fff; transform: translateY(-1px); }
.vf-blogs-toolbar-create i { font-size: 12px; }
.vf-blogs-toolbar-create,
.vf-blogs-toolbar-create span,
.vf-blogs-toolbar-create i,
.vf-blogs-toolbar-create:hover,
.vf-blogs-toolbar-create:hover span,
.vf-blogs-toolbar-create:hover i { color: #fff !important; -webkit-text-fill-color: #fff; }
html body.night-mode .vf-blogs-toolbar { border-color: #2b3b51; background: #162235; box-shadow: 0 12px 28px rgba(0, 0, 0, .2); }
html body.night-mode .vf-blogs-toolbar-tab { color: #bdc9d7; }
html body.night-mode .vf-blogs-toolbar-tab:hover { background: #1c2c42; color: #5eafff; }

/* Marketplace category explorer: source taxonomy stays dynamic; imagery is a visual entry point. */
.vf-market-category-browser { margin: 0 0 22px; padding: 18px; border: 1px solid #e3eaf2; border-radius: 18px; background: #fff; box-shadow: 0 10px 28px rgba(31, 55, 89, .07); }
.vf-market-category-browser-head { display: flex; gap: 16px; align-items: flex-end; justify-content: space-between; margin: 0 0 14px; }
.vf-market-category-browser-kicker { display: block; margin-bottom: 2px; color: #087af5; font-size: 10px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.vf-market-category-browser h2 { margin: 0; color: #182c46; font-size: 20px; font-weight: 850; letter-spacing: -.015em; }
.vf-market-category-browser-skip { display: inline-flex; gap: 7px; align-items: center; color: #087af5; font-size: 12px; font-weight: 800; text-decoration: none; white-space: nowrap; }
.vf-market-category-browser-skip:hover { color: #066bd7; text-decoration: underline; }
.vf-market-category-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.vf-market-category-card { overflow: hidden; min-width: 0; border: 1px solid #e5ebf2; border-radius: 13px; background: #fff; transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.vf-market-category-card:hover { border-color: #b9d9fb; box-shadow: 0 12px 22px rgba(19, 92, 170, .12); transform: translateY(-2px); }
.vf-market-category-image { position: relative; display: block; height: 105px; overflow: hidden; background: center / cover no-repeat url('../images/market/vf-market-category-fallback.webp'); }
.vf-market-category-image-shade { position: absolute; inset: 0; background: linear-gradient(140deg, rgba(6, 32, 65, .05), rgba(7, 21, 39, .52)); transition: background .18s ease; }
.vf-market-category-card:hover .vf-market-category-image-shade { background: linear-gradient(140deg, rgba(8, 122, 245, .12), rgba(7, 21, 39, .4)); }
.vf-market-category-copy { min-height: 122px; padding: 11px 12px 12px; }
.vf-market-category-title { display: block; overflow: hidden; color: #1d3049; font-size: 14px; font-weight: 850; line-height: 1.2; text-decoration: none; text-overflow: ellipsis; white-space: nowrap; }
.vf-market-category-title:hover { color: #087af5; }
.vf-market-category-subcategories { display: flex; flex-wrap: wrap; gap: 4px 6px; min-height: 39px; margin: 7px 0 8px; }
.vf-market-category-subcategories a { overflow: hidden; max-width: 100%; color: #65758a; font-size: 10px; font-weight: 700; line-height: 1.35; text-decoration: none; text-overflow: ellipsis; white-space: nowrap; }
.vf-market-category-subcategories a:not(:last-child)::after { margin-left: 6px; color: #c1ccda; content: '•'; }
.vf-market-category-subcategories a:hover { color: #087af5; }
.vf-market-category-all { display: inline-flex; gap: 6px; align-items: center; color: #087af5; font-size: 11px; font-weight: 850; text-decoration: none; }
.vf-market-category-all:hover { color: #066bd7; text-decoration: underline; }
.vf-market-category-all i { font-size: 9px; }
.vf-market-listings-anchor { display: block; position: relative; top: -88px; visibility: hidden; }

/* Curated photographs for the marketplace's configured top-level taxonomy. */
.vf-market-category-card[data-category-id="1"] .vf-market-category-image { background-image: url('https://images.unsplash.com/photo-1529139574466-a303027c1d8b?auto=format&fit=crop&w=900&q=80'); }
.vf-market-category-card[data-category-id="2"] .vf-market-category-image { background-image: url('https://images.unsplash.com/photo-1492144534655-ae79c964c9d7?auto=format&fit=crop&w=900&q=80'); }
.vf-market-category-card[data-category-id="3"] .vf-market-category-image { background-image: url('https://images.unsplash.com/photo-1519689680058-324335c77eba?auto=format&fit=crop&w=900&q=80'); }
.vf-market-category-card[data-category-id="4"] .vf-market-category-image { background-image: url('https://images.unsplash.com/photo-1596462502278-27bfdc403348?auto=format&fit=crop&w=900&q=80'); }
.vf-market-category-card[data-category-id="5"] .vf-market-category-image { background-image: url('https://images.unsplash.com/photo-1517336714731-489689fd1ca8?auto=format&fit=crop&w=900&q=80'); }
.vf-market-category-card[data-category-id="6"] .vf-market-category-image { background-image: url('https://images.unsplash.com/photo-1523275335684-37898b6baf30?auto=format&fit=crop&w=900&q=80'); }
.vf-market-category-card[data-category-id="7"] .vf-market-category-image { background-image: url('https://images.unsplash.com/photo-1518199266791-5375a83190b7?auto=format&fit=crop&w=900&q=80'); }
.vf-market-category-card[data-category-id="8"] .vf-market-category-image { background-image: url('https://images.unsplash.com/photo-1554224155-8d04cb21cd6c?auto=format&fit=crop&w=900&q=80'); }
.vf-market-category-card[data-category-id="9"] .vf-market-category-image { background-image: url('https://images.unsplash.com/photo-1513885535751-8b9238bd345a?auto=format&fit=crop&w=900&q=80'); }
.vf-market-category-card[data-category-id="10"] .vf-market-category-image { background-image: url('https://images.unsplash.com/photo-1416879595882-3373a0480b5b?auto=format&fit=crop&w=900&q=80'); }
.vf-market-category-card[data-category-id="11"] .vf-market-category-image { background-image: url('https://images.unsplash.com/photo-1441986300917-64674bd600d8?auto=format&fit=crop&w=900&q=80'); }
.vf-market-category-card[data-category-id="12"] .vf-market-category-image, .vf-market-category-card[data-category-id="21"] .vf-market-category-image { background-image: url('https://images.unsplash.com/photo-1600585154340-be6161a56a0c?auto=format&fit=crop&w=900&q=80'); }
.vf-market-category-card[data-category-id="13"] .vf-market-category-image { background-image: url('https://images.unsplash.com/photo-1489599849927-2ee91cede3ba?auto=format&fit=crop&w=900&q=80'); }
.vf-market-category-card[data-category-id="14"] .vf-market-category-image { background-image: url('https://images.unsplash.com/photo-1587300003388-59208cc962cb?auto=format&fit=crop&w=900&q=80'); }
.vf-market-category-card[data-category-id="15"] .vf-market-category-image { background-image: url('https://images.unsplash.com/photo-1517836357463-d25dfeac3438?auto=format&fit=crop&w=900&q=80'); }
.vf-market-category-card[data-category-id="16"] .vf-market-category-image { background-image: url('https://images.unsplash.com/photo-1497366754035-f200968a6e72?auto=format&fit=crop&w=900&q=80'); }
.vf-market-category-card[data-category-id="17"] .vf-market-category-image { background-image: url('https://images.unsplash.com/photo-1521572163474-6864f9cf17ab?auto=format&fit=crop&w=900&q=80'); }
.vf-market-category-card[data-category-id="18"] .vf-market-category-image { background-image: url('https://images.unsplash.com/photo-1558060370-d644479cb6f7?auto=format&fit=crop&w=900&q=80'); }
.vf-market-category-card[data-category-id="19"] .vf-market-category-image { background-image: url('https://images.unsplash.com/photo-1513364776144-60967b0f800f?auto=format&fit=crop&w=900&q=80'); }
.vf-market-category-card[data-category-id="20"] .vf-market-category-image { background-image: url('https://images.unsplash.com/photo-1520523839897-bd0b52f945a0?auto=format&fit=crop&w=900&q=80'); }
html body.night-mode .vf-market-category-browser { border-color: #2b3b51; background: #162235; box-shadow: 0 12px 28px rgba(0, 0, 0, .2); }
html body.night-mode .vf-market-category-browser h2, html body.night-mode .vf-market-category-title { color: #edf5ff; }
html body.night-mode .vf-market-category-card { border-color: #2b3b51; background: #1a293d; }
html body.night-mode .vf-market-category-subcategories a { color: #aab9ca; }
@media (max-width: 991.98px) { .vf-market-category-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575.98px) { .vf-market-category-browser { padding: 14px; border-radius: 14px; } .vf-market-category-browser-head { align-items: flex-start; } .vf-market-category-browser h2 { font-size: 18px; } .vf-market-category-browser-skip { font-size: 11px; } .vf-market-category-grid { grid-template-columns: 1fr; gap: 9px; } .vf-market-category-card { display: grid; grid-template-columns: 116px minmax(0, 1fr); } .vf-market-category-image { height: auto; min-height: 128px; } .vf-market-category-copy { min-height: 128px; } }

@media (max-width: 575.98px) {
  .vf-blogs-toolbar { min-height: 58px; margin-bottom: 14px; border-radius: 13px; }
  .vf-blogs-toolbar-tab { min-height: 58px; padding: 0 15px; font-size: 13px; }
  .vf-blogs-toolbar-tab::after { right: 12px; left: 12px; }
  .vf-blogs-toolbar-create { min-width: 46px; margin: 7px; padding: 0; }
  .vf-blogs-toolbar-create span { display: none; }
}

.vf-blog-related-item {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  padding: 9px 0;
  border-top: 1px solid #edf1f6;
  color: inherit;
  text-decoration: none;
}
.vf-blog-related-item:first-of-type { border-top: 0; }
.vf-blog-related-thumb {
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  overflow: hidden;
  border-radius: 10px;
  background: linear-gradient(135deg, #e6f3ff, #e7faf6);
  color: #087af5;
}
.vf-blog-related-thumb img { width: 100%; height: 100%; object-fit: cover; }
.vf-blog-related-copy { min-width: 0; }
.vf-blog-related-copy strong {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  color: #30435b;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.28;
}
.vf-blog-related-copy small { display: block; margin-top: 4px; color: #8090a4; font-size: 10px; }
.vf-blog-related-copy small i { margin-right: 4px; color: #087af5; }
.vf-blog-related-item:hover .vf-blog-related-copy strong { color: #087af5; }
html body.night-mode .vf-blog-related-item { border-color: #27384d; }
html body.night-mode .vf-blog-related-copy strong { color: #e3edf8; }

/* Hi24-inspired Latest Reels card in VibeForge colours */
.vf-side-card.vf-fresh-clips-card{overflow:hidden;border:1px solid #e7ebf1;border-radius:20px;background:#fff;box-shadow:0 12px 30px rgba(16,24,40,.08)}
.vf-fresh-clips-card .card-header{min-height:58px;padding:16px 18px 10px;border:0}
.vf-fresh-clips-card .card-header strong{gap:9px;color:#172033;font-size:1rem;font-weight:850}
.vf-fresh-clips-card .card-header strong i{display:grid;width:16px;height:16px;place-items:center;color:#087af5;font-size:.72rem}
.vf-fresh-clips-card .card-header a{color:#087af5;font-size:.69rem;font-weight:800;text-decoration:none}
.vf-fresh-clips-card .card-body{padding:8px 16px 18px}
.vf-fresh-clips-grid{gap:5px}
.vf-fresh-clip{aspect-ratio:9/14;border-radius:8px;background:#e8edf4;box-shadow:inset 0 0 0 1px rgba(16,24,40,.05)}
.vf-fresh-clip::after{inset:48% 0 0;background:linear-gradient(transparent,rgba(7,15,28,.7))}
.vf-fresh-clip-play{top:7px;right:7px;left:auto;width:22px;height:22px;border:1px solid rgba(255,255,255,.75);background:rgba(16,24,40,.45);color:#fff;font-size:.55rem;transform:none;backdrop-filter:blur(3px)}
.vf-fresh-clip-views{right:auto;bottom:6px;left:6px;font-size:.61rem;text-shadow:0 1px 3px rgba(0,0,0,.55)}
body.night-mode .vf-side-card.vf-fresh-clips-card{border-color:#2a3140;background:#151922}body.night-mode .vf-fresh-clips-card .card-header strong{color:#eef2f7}
/* Keep the desktop legal-link row compact and on one readable line. */
@media (min-width: 769px) {
  .footer-links-shell .footer .links {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-end;
    white-space: nowrap;
    font-size: 0.9rem;
    letter-spacing: -0.01em;
  }

  .footer-links-shell .footer .links > a {
    flex: 0 0 auto;
  }

  .footer-links-shell .footer .links > a.pl10 {
    padding-left: 8px !important;
  }
}
/* Feed composer: integrated action dock, replacing the detached pastel pills. */
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  gap: 0 !important;
  margin-top: 12px !important;
  padding: 10px 0 0 !important;
  border-top: 1px solid rgba(218, 227, 239, 0.9) !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions button {
  position: relative;
  display: inline-flex !important;
  flex: 1 1 0;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  min-width: 0;
  min-height: 42px !important;
  padding: 0 10px !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #314158 !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  transform: none !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions button + button {
  border-left: 1px solid rgba(218, 227, 239, 0.9) !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions button:hover,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions button:focus-visible {
  background: rgba(8, 122, 245, 0.075) !important;
  box-shadow: none !important;
  transform: none !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions button:active {
  background: rgba(8, 122, 245, 0.12) !important;
  transform: scale(0.985) !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions .vf-composer-action-photo,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions .vf-composer-action-video,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions .vf-composer-action-story,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions .vf-composer-action-reel,
body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions .vf-composer-action-mood {
  border-color: transparent !important;
  background: transparent !important;
}

body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions i {
  font-size: 0.92rem !important;
}

body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions {
  border-top-color: rgba(148, 163, 184, 0.2) !important;
}

body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions button {
  color: #dbe7f6 !important;
}

body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions button + button {
  border-left-color: rgba(148, 163, 184, 0.2) !important;
}

body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions button:hover,
body.night-mode.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions button:focus-visible {
  background: rgba(96, 165, 250, 0.13) !important;
}

/* Blog cover helper: clear guidance and a compact, optional browser-side resize. */
.vf-blog-cover-assistant {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 9px 12px;
  max-width: 620px;
  margin-top: 12px;
  padding: 11px 13px;
  border: 1px solid #dbe7f2;
  border-radius: 12px;
  background: linear-gradient(135deg, #f7fbff 0%, #f2fbfa 100%);
}

.vf-blog-cover-assistant-copy {
  display: grid;
  flex: 1 1 310px;
  gap: 2px;
  min-width: 0;
  color: #52637a;
  font-size: 12px;
  line-height: 1.4;
}

.vf-blog-cover-assistant-copy strong { color: #23344c; font-size: 12px; }
.vf-blog-cover-optimize { position: relative; flex: 0 0 auto; color: #087af5; font-weight: 750; }
.vf-blog-cover-optimize input { position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; pointer-events: none; }
.vf-blog-cover-optimize-status { flex: 1 0 100%; color: #52708d; font-size: 12px; font-weight: 650; }
.vf-blog-cover-optimize-status:empty { display: none; }
.vf-blog-cover-optimize-status.is-error { color: #bd3c43; }

html body.night-mode .vf-blog-cover-assistant { border-color: #344962; background: linear-gradient(135deg, #172638 0%, #173431 100%); }
html body.night-mode .vf-blog-cover-assistant-copy { color: #b7c8da; }
html body.night-mode .vf-blog-cover-assistant-copy strong { color: #edf5ff; }
html body.night-mode .vf-blog-cover-optimize-status { color: #a9c6df; }

html body .main-wrapper .main-header .search-wrapper .form-control {
  min-height: 40px !important;
  height: 40px !important;
  line-height: 40px !important;
}

html body .main-wrapper .main-header .search-wrapper form .search-input-icon {
  height: 40px !important;
}

/* The logo is an identity mark, not an oversized header control. */
html body .main-wrapper .main-header .logo-wrapper {
  display: flex !important;
  align-items: center !important;
  min-height: 64px !important;
}

html body .main-wrapper .main-header .logo,
html body .main-wrapper .main-header .logo:hover,
html body .main-wrapper .main-header .logo picture {
  display: inline-flex !important;
  align-items: center !important;
  line-height: 1 !important;
}

html body .main-wrapper .main-header .logo-img,
html body .main-wrapper .main-header .logo img {
  display: block !important;
  width: auto !important;
  max-width: 100% !important;
  height: 60px !important;
  max-height: 60px !important;
  object-fit: contain !important;
  object-position: left center !important;
}

html body .main-wrapper .main-header > .container > .row,
html body .main-wrapper .main-header > .container-fluid > .row {
  min-height: 64px !important;
  align-items: center !important;
}

html body .main-wrapper .main-header .header-search-cluster,
html body .main-wrapper .main-header .header-right,
html body .main-wrapper .main-header .navbar-wrapper,
html body .main-wrapper .main-header .navbar-wrapper > ul {
  display: flex !important;
  align-items: center !important;
  min-height: 64px !important;
}

@media (max-width: 767.98px) {
  html body .main-wrapper .main-header .navbar-wrapper > ul {
    gap: 3px !important;
  }

  html body .main-wrapper .main-header .navbar-wrapper > ul > li > a:not(.user-menu),
  html body .main-wrapper .main-header .navbar-wrapper > ul > li > .dropdown-toggle:not(.user-menu) {
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    min-height: 36px !important;
    border-radius: 10px !important;
  }

  html body .main-wrapper .main-header .logo-img,
  html body .main-wrapper .main-header .logo img {
    height: 48px !important;
    max-height: 48px !important;
  }
}

@media (max-width: 575.98px) {
  .vf-blog-cover-assistant { align-items: stretch; }
  .vf-blog-cover-optimize { align-self: flex-start; }
}

/* Widget manager switches are buttons, isolated from global checkbox behavior. */
.vf-widgetkit-manager .vf-widgetkit-toggle {
  display: inline-flex;
  flex: 0 0 64px;
  align-items: center;
  justify-content: center;
  width: 64px;
  min-height: 32px;
  padding: 0;
  border: 1px solid #b9c5d4;
  border-radius: 999px;
  background: #eef2f7;
  color: #5d6d82;
  font-size: 10px;
  font-weight: 850;
  line-height: 1;
  letter-spacing: .06em;
  cursor: pointer;
}

.vf-widgetkit-toggle-on { display: none; }
.vf-widgetkit-toggle.is-on { border-color: #087af5; background: #087af5; color: #fff; box-shadow: 0 3px 9px rgba(8, 122, 245, .22); }
.vf-widgetkit-toggle.is-on .vf-widgetkit-toggle-off { display: none; }
.vf-widgetkit-toggle.is-on .vf-widgetkit-toggle-on { display: block; }
.vf-widgetkit-toggle:focus-visible { outline: 3px solid rgba(20, 126, 234, .25); outline-offset: 2px; }
html body.night-mode .vf-widgetkit-manager .vf-widgetkit-toggle { border-color: #65758a; background: #2a3546; color: #f0f5fb; }
html body.night-mode .vf-widgetkit-manager .vf-widgetkit-toggle.is-on { border-color: #48a5ff; background: #087af5; color: #fff; }

/* Profile navigation: distribute the available tabs across the full desktop strip. */
@media (min-width: 992px) {
  html body.vf-page-profile .main-wrapper .vf-profile-shell .profile-tabs-wrapper > a {
    flex: 1 1 0 !important;
    min-width: 0 !important;
  }
}

@media (max-width: 575.98px) {
  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions {
    padding-left: 0 !important;
    overflow-x: auto;
    scrollbar-width: none;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions::-webkit-scrollbar {
    display: none;
  }

  body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-composer-quick-actions button {
    flex: 0 0 auto;
    min-width: 88px;
  }
}

/* Final desktop chat dock: five people at a glance, with compact controls below. */
@media (min-width: 768px) {
  html body .chat-sidebar { position: fixed !important; top: auto !important; right: 16px !important; bottom: 100px !important; left: auto !important; z-index: 1035 !important; width: 56px !important; min-width: 56px !important; max-width: 56px !important; height: 306px !important; min-height: 0 !important; max-height: calc(100vh - 172px) !important; overflow: hidden !important; border: 1px solid rgba(214, 225, 238, .94) !important; border-radius: 18px !important; background: rgba(255, 255, 255, .96) !important; box-shadow: 0 14px 34px rgba(16, 37, 66, .16) !important; transition: width .2s ease !important; }
  html body .chat-sidebar:hover, html body .chat-sidebar:focus-within { width: 250px !important; max-width: 250px !important; }
  html body .chat-sidebar::before { display: none !important; }
  html body .chat-sidebar-shell { position: relative !important; display: block !important; width: 100% !important; height: 100% !important; overflow: hidden !important; }
  html body .chat-sidebar-content { position: absolute !important; top: 7px !important; right: 0 !important; bottom: 58px !important; left: 0 !important; display: block !important; overflow: hidden !important; }
  html body .chat-sidebar-content .js_scroller { height: 100% !important; overflow: hidden !important; }
  html body .chat-sidebar .chat-avatar-wrapper { display: flex !important; align-items: center !important; justify-content: center !important; gap: 10px !important; min-height: 47px !important; padding: 5px 9px !important; }
  html body .chat-sidebar .chat-avatar-wrapper:nth-of-type(n+6) { display: none !important; }
  html body .chat-sidebar .chat-avatar { flex: 0 0 38px !important; width: 38px !important; height: 38px !important; }
  html body .chat-sidebar .chat-contact-name, html body .chat-sidebar .last-seen, html body .chat-sidebar .pb10 { display: none !important; }
  html body .chat-sidebar:hover .chat-avatar-wrapper, html body .chat-sidebar:focus-within .chat-avatar-wrapper { justify-content: flex-start !important; }
  html body .chat-sidebar:hover .chat-contact-name, html body .chat-sidebar:focus-within .chat-contact-name { display: block !important; overflow: hidden !important; color: #22334b !important; font-size: .78rem !important; font-weight: 750 !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
  html body .chat-sidebar .chat-sidebar-footer, html body .chat-sidebar .chat-sidebar-shell .chat-sidebar-footer { position: absolute !important; right: 0 !important; bottom: 0 !important; left: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; width: auto !important; height: 58px !important; min-height: 58px !important; padding: 7px 0 !important; border-top: 1px solid rgba(214, 225, 238, .82) !important; background: #f7faff !important; }
  html body .chat-sidebar .chat-sidebar-footer::before { display: none !important; }
  html body .chat-sidebar .chat-sidebar-footer .js_chat-new.btn-chat { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 40px !important; min-width: 40px !important; max-width: 40px !important; height: 40px !important; min-height: 40px !important; margin: 0 !important; border: 0 !important; border-radius: 12px !important; background: #087af5 !important; box-shadow: 0 7px 16px rgba(8, 122, 245, .27) !important; }
  html body .chat-sidebar .chat-sidebar-footer .js_chat-new.btn-chat .main-icon, html body .chat-sidebar .chat-sidebar-footer .js_chat-new.btn-chat svg { display: block !important; color: #fff !important; fill: currentColor !important; }
  html body .chat-sidebar .vf-chat-settings-fab { position: relative !important; inset: auto !important; display: block !important; width: 34px !important; height: 34px !important; margin: 0 !important; }
  html body .chat-sidebar .vf-chat-settings-fab > summary { display: flex !important; align-items: center !important; justify-content: center !important; width: 34px !important; height: 34px !important; border: 1px solid rgba(202, 214, 229, .95) !important; border-radius: 10px !important; background: #fff !important; color: #53657c !important; box-shadow: none !important; }
  html body > .vf-chat-settings-fab { position: fixed !important; right: 26px !important; bottom: 50px !important; z-index: 1036 !important; }
}

/* The old sidebar is gone. This is the complete, self-contained VibeForge chat dock. */
@media (min-width: 768px) {
  html body .vf-chat-dock {
    position: fixed !important;
    top: auto !important;
    right: 16px !important;
    bottom: 94px !important;
    left: auto !important;
    z-index: 1035 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 56px !important;
    min-width: 56px !important;
    max-width: 56px !important;
    height: auto !important;
    max-height: none !important;
    padding: 8px 0 7px !important;
    overflow: visible !important;
    border: 1px solid rgba(214, 225, 238, .96) !important;
    border-radius: 18px !important;
    background: rgba(255, 255, 255, .97) !important;
    box-shadow: 0 14px 34px rgba(16, 37, 66, .16) !important;
  }

  html body .vf-chat-dock .vf-chat-dock-contacts {
    position: relative !important;
    inset: auto !important;
    display: block !important;
    width: 100% !important;
    max-height: 240px !important;
    overflow: hidden !important;
  }

  html body .vf-chat-dock .js_scroller,
  html body .vf-chat-dock .js_chat-contacts-online,
  html body .vf-chat-dock .js_chat-contacts-offline {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    overflow: hidden !important;
  }

  html body .vf-chat-dock .vf-chat-dock-avatar,
  html body .vf-chat-dock .chat-avatar-wrapper {
    position: relative !important;
    display: grid !important;
    flex: 0 0 42px !important;
    width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    margin: 2px 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    border: 2px solid #fff !important;
    border-radius: 50% !important;
    background: #eef4fb !important;
    box-shadow: 0 3px 9px rgba(16, 37, 66, .13) !important;
    cursor: pointer !important;
  }

  html body .vf-chat-dock .vf-chat-dock-avatar:nth-of-type(n+6),
  html body .vf-chat-dock .chat-avatar-wrapper:nth-of-type(n+6) { display: none !important; }
  html body .vf-chat-dock .vf-chat-dock-avatar img,
  html body .vf-chat-dock .chat-avatar,
  html body .vf-chat-dock .chat-avatar img { display: block !important; width: 100% !important; height: 100% !important; overflow: hidden !important; border-radius: inherit !important; object-fit: cover !important; }
  html body .vf-chat-dock .chat-contact-name,
  html body .vf-chat-dock .last-seen,
  html body .vf-chat-dock .pb10 { display: none !important; }
  html body .vf-chat-dock .online-status { position: absolute !important; right: -1px !important; bottom: -1px !important; z-index: 2 !important; font-size: 9px !important; text-shadow: 0 0 0 2px #fff !important; }
  html body .vf-chat-dock-compose { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 40px !important; height: 40px !important; margin: 8px 0 0 !important; border-radius: 12px !important; background: #087af5 !important; box-shadow: 0 7px 16px rgba(8, 122, 245, .27) !important; color: #fff !important; }
  html body .vf-chat-dock-compose .main-icon,
  html body .vf-chat-dock-compose svg { color: #fff !important; fill: currentColor !important; }
  html body .vf-chat-dock-settings { position: relative !important; display: block !important; width: 34px !important; height: 34px !important; margin-top: 7px !important; }
  html body .vf-chat-dock-settings > summary { display: flex !important; align-items: center !important; justify-content: center !important; width: 34px !important; height: 34px !important; border: 1px solid rgba(202, 214, 229, .95) !important; border-radius: 10px !important; background: #fff !important; color: #53657c !important; cursor: pointer !important; list-style: none !important; }
  html body .vf-chat-dock-settings > summary::-webkit-details-marker { display: none !important; }
html body .vf-chat-dock-settings[open] .js_chat-settings-menu { position: fixed !important; right: 82px !important; bottom: 94px !important; display: block !important; width: 236px !important; z-index: 1040 !important; }
}

/* Shared VibeForge system-status screens: access, activation, approval and account states. */
.vf-system-state { position:relative; display:grid; min-height:calc(100vh - 170px); padding:clamp(28px,6vw,82px) 20px; place-items:center; overflow:hidden; background:radial-gradient(circle at 18% 15%,rgba(25,190,210,.2),transparent 28%),radial-gradient(circle at 84% 86%,rgba(77,91,255,.18),transparent 30%),#eef5fb; }
.vf-system-state::before,.vf-system-state::after { content:""; position:absolute; width:36vmax; height:36vmax; border:1px solid rgba(50,110,200,.09); border-radius:50%; pointer-events:none; }
.vf-system-state::before { top:-22vmax; left:-16vmax; }
.vf-system-state::after { right:-21vmax; bottom:-25vmax; }
.vf-system-state-card { position:relative; width:min(100%,680px); padding:clamp(30px,6vw,58px); overflow:hidden; border:1px solid rgba(255,255,255,.92); border-radius:30px; background:rgba(255,255,255,.83); box-shadow:0 24px 66px rgba(23,48,85,.14); text-align:center; backdrop-filter:blur(20px) saturate(1.1); -webkit-backdrop-filter:blur(20px) saturate(1.1); }
.vf-system-state-card::before { content:""; position:absolute; top:0; right:clamp(26px,8vw,74px); left:clamp(26px,8vw,74px); height:4px; border-radius:0 0 99px 99px; background:linear-gradient(90deg,#087af5,#24c8bd,#a855f7); }
.vf-system-state-orbit { position:absolute; border:1px solid rgba(8,122,245,.12); border-radius:50%; pointer-events:none; }
.vf-system-state-orbit--one { top:-108px; right:-76px; width:220px; height:220px; }
.vf-system-state-orbit--two { bottom:-155px; left:-105px; width:280px; height:280px; border-color:rgba(36,200,189,.12); }
.vf-system-state-brand { position:relative; z-index:1; display:inline-flex; align-items:center; gap:9px; color:#10274c; font-size:.96rem; font-weight:850; letter-spacing:-.02em; }
.vf-system-state-mark { position:relative; display:inline-block; width:25px; height:28px; transform:skewY(-12deg); }
.vf-system-state-mark span { position:absolute; display:block; width:16px; height:16px; clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%); }
.vf-system-state-mark span:nth-child(1) { top:0; left:0; background:#087af5; }
.vf-system-state-mark span:nth-child(2) { top:7px; right:0; background:#16c6b8; }
.vf-system-state-mark span:nth-child(3) { bottom:0; left:5px; background:#7d52e8; }
.vf-system-state-icon { position:relative; z-index:1; display:grid; width:78px; height:78px; margin:30px auto 18px; place-items:center; border:1px solid rgba(8,122,245,.13); border-radius:25px; background:linear-gradient(145deg,#f4faff,#def7f3); box-shadow:0 14px 30px rgba(13,91,174,.13); color:#087af5; font-size:2rem; transform:rotate(-4deg); }
.vf-system-state--restricted .vf-system-state-icon { border-color:rgba(229,75,95,.14); background:linear-gradient(145deg,#fff6f8,#ffe9ed); color:#dd4861; }
.vf-system-state--approval .vf-system-state-icon { background:linear-gradient(145deg,#fff9e9,#fff0c9); color:#d99008; }
.vf-system-state-kicker { position:relative; z-index:1; margin:0; color:#087af5; font-size:.72rem; font-weight:900; letter-spacing:.12em; text-transform:uppercase; }
.vf-system-state h1 { position:relative; z-index:1; max-width:560px; margin:12px auto 0; color:#10274c; font-size:clamp(2rem,5vw,3.3rem); font-weight:900; letter-spacing:-.055em; line-height:1.02; }
.vf-system-state-message { position:relative; z-index:1; max-width:520px; margin:18px auto 0; color:#60758f; font-size:clamp(1rem,2vw,1.12rem); font-weight:600; line-height:1.6; }
.vf-system-state-hint,.vf-system-state-activation-copy { position:relative; z-index:1; max-width:540px; margin:20px auto 0; padding:13px 16px; border:1px solid rgba(119,151,185,.16); border-radius:14px; background:rgba(242,247,252,.8); color:#60758f; font-size:.88rem; font-weight:600; line-height:1.55; }
.vf-system-state-activation-copy strong { color:#163c71; word-break:break-word; }
.vf-system-state-actions { position:relative; z-index:1; display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin:26px auto 0; }
.vf-system-state-actions .btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:44px; padding:0 17px; border-radius:13px; font-size:.85rem; font-weight:800; transition:transform .18s ease,box-shadow .18s ease,background .18s ease; }
.vf-system-state-actions .btn:hover { transform:translateY(-2px); }
.vf-system-state-primary { border:0; background:linear-gradient(135deg,#087af5,#3869e8); box-shadow:0 11px 24px rgba(8,122,245,.24); color:#fff !important; }
.vf-system-state-primary:hover { background:linear-gradient(135deg,#087af5,#2b5fdd); box-shadow:0 14px 28px rgba(8,122,245,.3); }
.vf-system-state-secondary { border:1px solid rgba(92,124,160,.2); background:#fff; color:#38536f !important; box-shadow:0 7px 16px rgba(29,59,93,.06); }
.vf-system-state-secondary:hover { border-color:rgba(8,122,245,.28); background:#f7fbff; color:#087af5 !important; }
body.night-mode .vf-system-state { background:radial-gradient(circle at 18% 15%,rgba(25,190,210,.15),transparent 28%),radial-gradient(circle at 84% 86%,rgba(77,91,255,.16),transparent 30%),#0c1729; }
body.night-mode .vf-system-state-card { border-color:rgba(157,184,221,.13); background:rgba(20,34,55,.87); box-shadow:0 24px 66px rgba(0,0,0,.3); }
body.night-mode .vf-system-state-brand,body.night-mode .vf-system-state h1,body.night-mode .vf-system-state-activation-copy strong { color:#edf5ff; }
body.night-mode .vf-system-state-message,body.night-mode .vf-system-state-hint,body.night-mode .vf-system-state-activation-copy { color:#aebfd3; }
body.night-mode .vf-system-state-hint,body.night-mode .vf-system-state-activation-copy { border-color:rgba(148,180,217,.12); background:rgba(9,20,38,.46); }
body.night-mode .vf-system-state-secondary { border-color:rgba(148,180,217,.2); background:#1b2c45; color:#dce9f8 !important; }
@media (max-width:575.98px) { .vf-system-state { min-height:calc(100vh - 112px); padding:24px 14px; } .vf-system-state-card { padding:28px 20px; border-radius:24px; } .vf-system-state-icon { width:68px; height:68px; margin-top:24px; border-radius:22px; font-size:1.7rem; } .vf-system-state-actions { align-items:stretch; flex-direction:column; } .vf-system-state-actions .btn { width:100%; } }

/* Site-wide mobile/PWA hero contract. Desktop hero geometry remains untouched. */
@media (min-width: 768px) and (max-width: 991.98px) {
  html body .main-wrapper :is(
    .page-header:not(.mini):not(.bank-transfer),
    .contact-hero,
    .contest-page-header,
    .contest-detail-hero,
    .profdash-hero,
    .hc-hero-card,
    .vf-ai-hero,
    .vf-business-hero,
    .vf-feed-hero,
    .vf-foryou-hero-card,
    .vf-guide-hero,
    .vf-help-hero,
    .vf-install-hero,
    .vf-launchpad-hero,
    .vf-library-hero,
    .vf-podcast-hero,
    .vf-professional-hero,
    .vf-showcase-hero,
    .vf-workspace-hero,
    .vf-world-hero
  ) {
    min-height: 0 !important;
    height: clamp(220px, 30vw, 265px) !important;
    max-height: 265px !important;
  }

  html body .main-wrapper [class*="hero"] > :is(.container, .container-fluid, .inner, .card-body, [class$="-hero-body"], [class$="-hero-inner"]) {
    min-height: 0 !important;
    height: 100% !important;
    max-height: 265px !important;
    padding: 22px 22px 24px !important;
  }
}

@media (max-width: 767.98px) {
  html body .main-wrapper :is(
    .page-header:not(.mini):not(.bank-transfer),
    .contact-hero,
    .contest-page-header,
    .contest-detail-hero,
    .profdash-hero,
    .hc-hero-card,
    .vf-404-hero,
    .vf-ai-hero,
    .vf-business-hero,
    .vf-feed-hero,
    .vf-foryou-hero-card,
    .vf-guide-hero,
    .vf-help-hero,
    .vf-im-profile-hero,
    .vf-install-hero,
    .vf-launchpad-hero,
    .vf-library-hero,
    .vf-messages-pwa-hero,
    .vf-perf-hero,
    .vf-podcast-hero,
    .vf-podcast-episode-hero,
    .vf-podcast-show-hero,
    .vf-professional-hero,
    .vf-seo-hero,
    .vf-showcase-hero,
    .vf-workspace-hero,
    .vf-world-hero
  ) {
    position: relative !important;
    isolation: isolate !important;
    box-sizing: border-box !important;
    width: calc(100% - 24px) !important;
    max-width: calc(100% - 24px) !important;
    min-height: 0 !important;
    height: clamp(205px, 52vw, 250px) !important;
    max-height: 250px !important;
    margin: 10px auto 14px !important;
    overflow: hidden !important;
    border-radius: 18px !important;
    background-position: center center !important;
    background-size: cover !important;
  }

  html body .main-wrapper :is(
    .page-header:not(.mini):not(.bank-transfer),
    .contact-hero,
    .contest-page-header,
    .contest-detail-hero,
    .profdash-hero,
    .hc-hero-card,
    .vf-ai-hero,
    .vf-business-hero,
    .vf-feed-hero,
    .vf-foryou-hero-card,
    .vf-guide-hero,
    .vf-help-hero,
    .vf-install-hero,
    .vf-launchpad-hero,
    .vf-library-hero,
    .vf-perf-hero,
    .vf-podcast-hero,
    .vf-podcast-episode-hero,
    .vf-podcast-show-hero,
    .vf-professional-hero,
    .vf-seo-hero,
    .vf-showcase-hero,
    .vf-workspace-hero,
    .vf-world-hero
  )::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    pointer-events: none !important;
    background: linear-gradient(180deg, rgba(5, 12, 24, .18) 0%, rgba(5, 12, 24, .54) 58%, rgba(5, 12, 24, .82) 100%) !important;
  }

  html body .main-wrapper :is(
    .page-header:not(.mini):not(.bank-transfer),
    .contact-hero,
    .contest-detail-hero,
    .profdash-hero,
    .hc-hero-card,
    .vf-ai-hero,
    .vf-business-hero,
    .vf-feed-hero,
    .vf-foryou-hero-card,
    .vf-guide-hero,
    .vf-help-hero,
    .vf-install-hero,
    .vf-launchpad-hero,
    .vf-library-hero,
    .vf-perf-hero,
    .vf-podcast-hero,
    .vf-podcast-episode-hero,
    .vf-podcast-show-hero,
    .vf-professional-hero,
    .vf-seo-hero,
    .vf-showcase-hero,
    .vf-workspace-hero,
    .vf-world-hero
  ) > :is(.container, .container-fluid, .inner, .card-body, [class$="-hero-body"], [class$="-hero-inner"]) {
    position: relative !important;
    z-index: 1 !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-end !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 250px !important;
    overflow: hidden !important;
    padding: clamp(20px, 6vw, 26px) 18px 24px !important;
    text-align: left !important;
  }

  html body .main-wrapper :is(
    .vf-business-hero > *,
    .vf-library-hero > *,
    .vf-help-hero > .vf-help-hero-copy,
    .vf-showcase-hero > .vf-showcase-hero-content
  ) {
    position: relative !important;
    z-index: 1 !important;
  }

  html body .main-wrapper :is(
    .page-header:not(.mini):not(.bank-transfer),
    .contact-hero,
    .contest-page-header,
    .contest-detail-hero,
    .profdash-hero,
    .hc-hero-card,
    .vf-ai-hero,
    .vf-business-hero,
    .vf-feed-hero,
    .vf-foryou-hero-card,
    .vf-guide-hero,
    .vf-help-hero,
    .vf-im-profile-hero,
    .vf-install-hero,
    .vf-launchpad-hero,
    .vf-library-hero,
    .vf-messages-pwa-hero,
    .vf-perf-hero,
    .vf-podcast-hero,
    .vf-podcast-episode-hero,
    .vf-podcast-show-hero,
    .vf-professional-hero,
    .vf-seo-hero,
    .vf-showcase-hero,
    .vf-workspace-hero,
    .vf-world-hero
  ) :is(h1, h2, .h1, [class$="-hero-title"], [class$="-title"]) {
    width: 100% !important;
    max-width: 100% !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    font-size: clamp(1.55rem, 6.8vw, 1.9rem) !important;
    line-height: 1.08 !important;
    letter-spacing: -.035em !important;
    overflow-wrap: anywhere !important;
    text-align: left !important;
    text-wrap: balance;
  }

  html body .main-wrapper :is(
    .page-header:not(.mini):not(.bank-transfer),
    .contact-hero,
    .contest-page-header,
    .contest-detail-hero,
    .profdash-hero,
    .hc-hero-card,
    .vf-ai-hero,
    .vf-business-hero,
    .vf-feed-hero,
    .vf-foryou-hero-card,
    .vf-guide-hero,
    .vf-help-hero,
    .vf-im-profile-hero,
    .vf-install-hero,
    .vf-launchpad-hero,
    .vf-library-hero,
    .vf-messages-pwa-hero,
    .vf-perf-hero,
    .vf-podcast-hero,
    .vf-podcast-episode-hero,
    .vf-podcast-show-hero,
    .vf-professional-hero,
    .vf-seo-hero,
    .vf-showcase-hero,
    .vf-workspace-hero,
    .vf-world-hero
  ) :is(p, [class$="-hero-copy"], [class$="-hero-subtitle"]) {
    width: 100% !important;
    max-width: 38rem !important;
    font-size: .88rem !important;
    line-height: 1.42 !important;
    overflow-wrap: anywhere !important;
    text-align: left !important;
  }

  html body .main-wrapper :is([class$="-hero-kicker"], [class*="hero"] > .eyebrow, [class*="hero"] > .kicker) {
    max-width: 100% !important;
    white-space: normal !important;
  }

  html body .main-wrapper :is(
    .vf-events-hero-search,
    .vf-forums-hero-search,
    .vf-help-hero-search,
    .vf-local-search-card
  ) {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 12px 0 0 !important;
  }

  html body .main-wrapper :is(
    .vf-events-hero-search,
    .vf-forums-hero-search,
    .vf-help-hero-search,
    .vf-local-search-card
  ) :is(input, button, .btn) {
    min-height: 44px !important;
  }

  html body .main-wrapper :is(
    .vf-events-hero-stats,
    .vf-forums-hero-stats,
    .vf-world-hero-stats,
    .vf-podcast-hero-stats,
    .profdash-hero-stats,
    .vf-feed-hero-meta,
    .vf-watch-hero-meta,
    .vf-popular-hero-meta,
    .vf-memories-hero-meta,
    .vf-discover-hero-meta
  ) {
    display: none !important;
  }

  html body .main-wrapper :is(
    .vf-events-hero-stats,
    .vf-forums-hero-stats,
    .vf-world-hero-stats,
    .vf-podcast-hero-stats,
    .profdash-hero-stats,
    .vf-feed-hero-meta,
    .vf-watch-hero-meta,
    .vf-popular-hero-meta,
    .vf-memories-hero-meta,
    .vf-discover-hero-meta
  ) > * {
    flex: 1 1 104px !important;
    min-width: 0 !important;
    white-space: normal !important;
  }

  html body .main-wrapper :is(
    .vf-world-hero-actions,
    .vf-professional-hero-actions,
    .vf-podcast-hero-actions,
    .vf-reels-hero-actions,
    .vf-launchpad-actions,
    .vf-messages-pwa-actions,
    .hc-hero-actions,
    .profdash-hero-cta,
    .vf-foryou-hero-cta
  ) {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-top: 12px !important;
  }

  html body .main-wrapper :is(
    .vf-world-hero-actions,
    .vf-professional-hero-actions,
    .vf-podcast-hero-actions,
    .vf-reels-hero-actions,
    .vf-launchpad-actions,
    .vf-messages-pwa-actions,
    .hc-hero-actions,
    .profdash-hero-cta,
    .vf-foryou-hero-cta
  ) :is(.btn, button, a) {
    flex: 1 1 140px !important;
    max-width: 100% !important;
    min-height: 42px !important;
    white-space: normal !important;
  }

  html body .main-wrapper :is(
    .profdash-hero-art,
    .profdash-hero-orbit,
    .profdash-hero-spark,
    .vf-foryou-hero-art,
    .vf-foryou-hero-spark,
    .vf-guide-hero-art,
    .vf-world-hero-panel,
    .vf-world-hero-orbit,
    .vf-ai-hero-art
  ) {
    display: none !important;
  }

  html body .main-wrapper [class*="hero"] :is(img, video, iframe) {
    max-width: 100% !important;
  }

  html body .main-wrapper .vf-directory-hero.page-header {
    min-height: 0 !important;
    height: clamp(205px, 52vw, 250px) !important;
    max-height: 250px !important;
  }

  html body .main-wrapper .vf-directory-hero.page-header > :is(.container, .container-fluid, .inner) {
    min-height: 0 !important;
    height: 100% !important;
    max-height: 250px !important;
    padding: 20px 18px 24px !important;
    justify-content: flex-start !important;
    overflow: hidden !important;
  }

  html body .main-wrapper :is(.vf-unsplash-hero-credit, .vf-hero-credit, .vf-feed-hero-credit, .photo-credit) {
    top: 10px !important;
    right: 10px !important;
    bottom: auto !important;
    left: auto !important;
    z-index: 4 !important;
    max-width: calc(100% - 20px) !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
}

@media (max-width: 359.98px) {
  html body .main-wrapper :is(
    .page-header:not(.mini):not(.bank-transfer),
    .contact-hero,
    .contest-page-header,
    .contest-detail-hero,
    .profdash-hero,
    .hc-hero-card,
    .vf-404-hero,
    .vf-ai-hero,
    .vf-business-hero,
    .vf-feed-hero,
    .vf-foryou-hero-card,
    .vf-guide-hero,
    .vf-help-hero,
    .vf-im-profile-hero,
    .vf-install-hero,
    .vf-launchpad-hero,
    .vf-library-hero,
    .vf-messages-pwa-hero,
    .vf-perf-hero,
    .vf-podcast-hero,
    .vf-podcast-episode-hero,
    .vf-podcast-show-hero,
    .vf-professional-hero,
    .vf-seo-hero,
    .vf-showcase-hero,
    .vf-workspace-hero,
    .vf-world-hero
  ) {
    width: calc(100% - 16px) !important;
    max-width: calc(100% - 16px) !important;
    border-radius: 16px !important;
  }

  html body .main-wrapper [class*="hero"] > :is(.container, .container-fluid, .inner, .card-body, [class$="-hero-body"], [class$="-hero-inner"]) {
    padding-right: 16px !important;
    padding-left: 16px !important;
  }
}

@media (max-width: 767.98px) and (max-height: 520px) and (orientation: landscape) {
  html body .main-wrapper :is(
    .page-header:not(.mini):not(.bank-transfer),
    .contact-hero,
    .contest-page-header,
    .contest-detail-hero,
    .profdash-hero,
    .hc-hero-card,
    .vf-foryou-hero-card,
    .vf-guide-hero,
    .vf-help-hero,
    .vf-launchpad-hero,
    .vf-library-hero,
    .vf-podcast-hero,
    .vf-professional-hero,
    .vf-showcase-hero,
    .vf-workspace-hero,
    .vf-world-hero
  ) {
    min-height: 200px !important;
  }
}

/* Final site-wide PWA hero treatment. Kept below 992px so desktop remains unchanged. */
@media (max-width: 991.98px), (display-mode: standalone) and (max-device-width: 1024px) {
  html body .main-wrapper :is(
    .page-header:not(.mini):not(.bank-transfer), .contact-hero, .contest-page-header,
    .contest-detail-hero, .profdash-hero, .hc-hero-card, .vf-404-hero, .vf-ads-hero,
    .vf-ai-hero, .vf-broadcasting-hero, .vf-business-hero, .vf-contact-hero,
    .vf-courses-hero, .vf-developers-hero, .vf-events-calendar-hero, .vf-feed-hero,
    .vf-foryou-hero-card, .vf-funding-hero, .vf-guide-hero, .vf-guide-intro,
    .vf-help-hero, .vf-im-profile-hero, .vf-install-hero, .vf-landing-hero,
    .vf-launchpad-hero, .vf-library-hero, .vf-livestudio-hero, .vf-local-hero,
    .vf-market-hero, .vf-memories-hero, .vf-merits-hero, .vf-messages-pwa-hero,
    .vf-mobile-hero, .vf-packages-hero, .vf-perf-hero, .vf-podcast-hero,
    .vf-podcast-episode-hero, .vf-podcast-show-hero, .vf-popular-hero,
    .vf-professional-hero, .vf-reels-hero, .vf-search-hero, .vf-seo-hero,
    .vf-shared-hero, .vf-showcase-hero, .vf-wallet-hero, .vf-watch-hero,
    .vf-workspace-hero, .vf-world-hero
  ) {
    position: relative !important;
    isolation: isolate !important;
    box-sizing: border-box !important;
    height: clamp(220px, 30vw, 265px) !important;
    min-height: 0 !important;
    max-height: 265px !important;
    overflow: hidden !important;
    background-position: center center !important;
    background-size: cover !important;
  }

  html body .main-wrapper :is(
    .page-header:not(.mini):not(.bank-transfer), .contact-hero, .contest-page-header,
    .contest-detail-hero, .profdash-hero, .hc-hero-card, .vf-404-hero, .vf-ads-hero,
    .vf-ai-hero, .vf-broadcasting-hero, .vf-business-hero, .vf-contact-hero,
    .vf-courses-hero, .vf-developers-hero, .vf-events-calendar-hero, .vf-feed-hero,
    .vf-foryou-hero-card, .vf-funding-hero, .vf-guide-hero, .vf-guide-intro,
    .vf-help-hero, .vf-im-profile-hero, .vf-install-hero, .vf-landing-hero,
    .vf-launchpad-hero, .vf-library-hero, .vf-livestudio-hero, .vf-local-hero,
    .vf-market-hero, .vf-memories-hero, .vf-merits-hero, .vf-messages-pwa-hero,
    .vf-mobile-hero, .vf-packages-hero, .vf-perf-hero, .vf-podcast-hero,
    .vf-podcast-episode-hero, .vf-podcast-show-hero, .vf-popular-hero,
    .vf-professional-hero, .vf-reels-hero, .vf-search-hero, .vf-seo-hero,
    .vf-shared-hero, .vf-showcase-hero, .vf-wallet-hero, .vf-watch-hero,
    .vf-workspace-hero, .vf-world-hero
  ) > :is(.container, .container-fluid, .inner, .card-body, [class$="-hero-body"], [class$="-hero-inner"], .vf-showcase-hero-content, .vf-help-hero-copy) {
    box-sizing: border-box !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 265px !important;
    padding: 22px !important;
    overflow: hidden !important;
  }

  html body .main-wrapper :is(.page-header:not(.mini):not(.bank-transfer), [class$="-hero"], [class$="-hero-card"]) :is(h1, h2, h3, h4, .h1, .h2, .h3, [class$="-hero-title"]) {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    font-size: clamp(1.6rem, 4.8vw, 2rem) !important;
    line-height: 1.08 !important;
    letter-spacing: -.035em !important;
    text-wrap: balance;
  }

  html body .main-wrapper :is(.page-header:not(.mini):not(.bank-transfer), [class$="-hero"], [class$="-hero-card"]) :is(p, [class$="-hero-copy"], [class$="-hero-subtitle"]) {
    display: -webkit-box !important;
    margin-top: 7px !important;
    margin-bottom: 0 !important;
    overflow: hidden !important;
    font-size: .86rem !important;
    line-height: 1.38 !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  html body .main-wrapper :is(
    .vf-events-hero-stats, .vf-forums-hero-stats, .vf-world-hero-stats,
    .vf-podcast-hero-stats, .profdash-hero-stats, .profdash-hero-kpis,
    .vf-feed-hero-meta, .vf-watch-hero-meta, .vf-popular-hero-meta,
    .vf-memories-hero-meta, .vf-discover-hero-meta
  ) {
    display: none !important;
  }

  html body .main-wrapper :is(
    .vf-world-hero-actions, .vf-professional-hero-actions, .vf-podcast-hero-actions,
    .vf-reels-hero-actions, .vf-launchpad-actions, .vf-messages-pwa-actions,
    .hc-hero-actions, .profdash-hero-cta, .vf-foryou-hero-cta,
    .vf-events-hero-search, .vf-forums-hero-search, .vf-help-hero-search,
    .vf-local-search-card
  ) {
    margin-top: 12px !important;
  }

  html body .main-wrapper :is(.page-header:not(.mini):not(.bank-transfer), [class$="-hero"], [class$="-hero-card"]) :is(.btn, button, input, .form-control) {
    min-height: 40px !important;
    height: 40px !important;
    font-size: .82rem !important;
  }
}

@media (max-width: 767.98px), (display-mode: standalone) and (max-device-width: 767.98px) {
  html body .main-wrapper :is(
    .page-header:not(.mini):not(.bank-transfer), .contact-hero, .contest-page-header,
    .contest-detail-hero, .profdash-hero, .hc-hero-card, .vf-404-hero, .vf-ads-hero,
    .vf-ai-hero, .vf-broadcasting-hero, .vf-business-hero, .vf-contact-hero,
    .vf-courses-hero, .vf-developers-hero, .vf-events-calendar-hero, .vf-feed-hero,
    .vf-foryou-hero-card, .vf-funding-hero, .vf-guide-hero, .vf-guide-intro,
    .vf-help-hero, .vf-im-profile-hero, .vf-install-hero, .vf-landing-hero,
    .vf-launchpad-hero, .vf-library-hero, .vf-livestudio-hero, .vf-local-hero,
    .vf-market-hero, .vf-memories-hero, .vf-merits-hero, .vf-messages-pwa-hero,
    .vf-mobile-hero, .vf-packages-hero, .vf-perf-hero, .vf-podcast-hero,
    .vf-podcast-episode-hero, .vf-podcast-show-hero, .vf-popular-hero,
    .vf-professional-hero, .vf-reels-hero, .vf-search-hero, .vf-seo-hero,
    .vf-shared-hero, .vf-showcase-hero, .vf-wallet-hero, .vf-watch-hero,
    .vf-workspace-hero, .vf-world-hero
  ) {
    height: clamp(220px, 58vw, 250px) !important;
    min-height: 0 !important;
    max-height: 250px !important;
    border-radius: 18px !important;
  }

  html body .main-wrapper [class*="hero"] > :is(.container, .container-fluid, .inner, .card-body, [class$="-hero-body"], [class$="-hero-inner"]) {
    height: 100% !important;
    min-height: 0 !important;
    max-height: 250px !important;
    padding: 20px 18px !important;
  }
}

/* Marketplace installed-PWA finishing pass. */
html.app-standalone body .main-wrapper .vf-market-hero.page-header {
  height: 238px !important;
  min-height: 0 !important;
  max-height: 238px !important;
}

html.app-standalone body .main-wrapper .vf-market-hero.page-header > :is(.container, .container-fluid) {
  height: 100% !important;
  min-height: 0 !important;
  max-height: 238px !important;
  padding: 10px 18px 12px !important;
}

html.app-standalone body .main-wrapper .vf-market-hero.page-header .row:first-of-type p {
  box-sizing: border-box !important;
  width: min(100%, 300px) !important;
  max-width: 300px !important;
  margin-right: auto !important;
  margin-left: auto !important;
  padding-right: 0 !important;
  padding-left: 0 !important;
  white-space: normal !important;
  overflow-wrap: normal !important;
  text-align: center !important;
}

html.app-standalone body .main-wrapper .vf-sidebar-module-shell {
  margin-top: 12px !important;
}

html.app-standalone body .main-wrapper .vf-sidebar-module-shell .marketplace-tabs {
  min-height: 0 !important;
  padding: 8px !important;
}

html.app-standalone body .main-wrapper .vf-sidebar-module-shell .marketplace-tabs > ul {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 6px !important;
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

html.app-standalone body .main-wrapper .vf-sidebar-module-shell .marketplace-tabs > ul > li {
  float: none !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
}

html.app-standalone body .main-wrapper .vf-sidebar-module-shell .marketplace-tabs > ul > li > a {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-height: 42px !important;
  margin: 0 !important;
  padding: 0 8px !important;
  border-radius: 10px !important;
}

html.app-standalone body .main-wrapper .vf-sidebar-module-shell .marketplace-tabs > ul > li > a .main-icon {
  margin: 0 !important;
}

/* Forge control-panel titles: keep light card headers legible and comfortably sized. */
html body.vf-page-admin .main-wrapper .admin-shell .admin-sidebar .card > .card-header.block-title {
  color: #19324d !important;
  font-size: .82rem !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  letter-spacing: .065em !important;
  text-transform: uppercase !important;
}

html body.vf-page-admin .main-wrapper .admin-shell :is(.card-title, .panel-title) {
  color: #19324d !important;
  font-size: 1.05rem !important;
  font-weight: 750 !important;
  line-height: 1.3 !important;
}

html body.night-mode.vf-page-admin .main-wrapper .admin-shell .admin-sidebar .card > .card-header.block-title {
  color: #edf5ff !important;
}

html body.night-mode.vf-page-admin .main-wrapper .admin-shell :is(.card-title, .panel-title) {
  color: #edf5ff !important;
}

/* PWA Stories: keep portrait tiles readable and prevent flexbox width collapse. */
@media (max-width: 767.98px) {
  html body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-stories-card,
  html body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-stories-card .card-body,
  html body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-stories-card .stories-wrapper {
    height: auto !important;
    min-height: 214px !important;
  }

  html body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-stories-card #stories {
    display: flex !important;
    align-items: stretch !important;
    gap: 10px !important;
    height: 193px !important;
    min-height: 193px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
  }

  html body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-stories-card #stories :is(.story, .add-story) {
    flex: 0 0 clamp(112px, 28vw, 128px) !important;
    width: clamp(112px, 28vw, 128px) !important;
    min-width: clamp(112px, 28vw, 128px) !important;
    height: 184px !important;
    max-height: 184px !important;
    margin: 0 !important;
    overflow: hidden !important;
    border-radius: 14px !important;
    scroll-snap-align: start;
  }

  html body.vf-page-index .main-wrapper .vf-newsfeed-shell .vf-stories-card #stories .add-story :is(.vf-story-create-title, .vf-story-create-description) {
    overflow-wrap: normal !important;
    word-break: normal !important;
  }
}

html body :is(.vf-profile-sidebar > .panel-photos, .vf-profile-photo-widget) > .card-body { padding: 12px 16px !important; }
html body :is(.vf-profile-sidebar > .panel-photos, .vf-profile-photo-widget) > .card-body > .row { display: flex !important; flex-wrap: wrap; margin: -5px !important; }
html body :is(.vf-profile-sidebar > .panel-photos, .vf-profile-photo-widget) > .card-body > .row > [class*="col-"] { width: 33.333333% !important; padding: 5px !important; }
html body :is(.vf-profile-sidebar > .panel-photos, .vf-profile-photo-widget) .pg_photo { margin: 0 !important; border-radius: 10px !important; overflow: hidden; }
@media (max-width:420px) { html body :is(.vf-profile-sidebar > .panel-photos, .vf-profile-photo-widget) > .card-body { padding: 12px 14px !important; } html body :is(.vf-profile-sidebar > .panel-photos, .vf-profile-photo-widget) > .card-body > .row { margin: -4px !important; } html body :is(.vf-profile-sidebar > .panel-photos, .vf-profile-photo-widget) > .card-body > .row > [class*="col-"] { padding: 4px !important; } }
@media(min-width:768px){html body .main-wrapper .vf-directory-shell.vf-pages-shell>.row,html body .main-wrapper .vf-directory-shell.vf-groups-shell>.row{position:relative;isolation:isolate}html body .main-wrapper .vf-directory-shell.vf-pages-shell>.row>.sg-offcanvas-sidebar,html body .main-wrapper .vf-directory-shell.vf-groups-shell>.row>.sg-offcanvas-sidebar{position:relative;z-index:1;min-width:0}html body .main-wrapper .vf-directory-shell.vf-pages-shell>.row>.sg-offcanvas-mainbar,html body .main-wrapper .vf-directory-shell.vf-groups-shell>.row>.sg-offcanvas-mainbar{position:relative;z-index:2;min-width:0}}html body .main-wrapper .side-nav li.active>a[href*="/settings/verification"] :is(.main-icon,.svg-container,svg),html body .main-wrapper .side-nav li.active>a[href*="/settings/verification"] :is(.main-icon,.svg-container,svg) *{color:#2167c5!important;fill:currentColor!important;stroke:currentColor!important}html body .main-wrapper .js_readmore+[data-readmore-toggle]{display:inline-flex!important;align-items:center;gap:7px;width:auto!important;float:none!important;margin:12px 0 2px!important;padding:7px 11px!important;border:1px solid rgba(33,103,197,.28)!important;border-radius:999px!important;background:#eef5ff!important;color:#195ba9!important;font-size:.78rem;font-weight:800;line-height:1;text-decoration:none!important;box-shadow:0 4px 10px rgba(33,103,197,.1);transition:background-color 160ms ease,border-color 160ms ease,box-shadow 160ms ease,transform 160ms ease}html body .main-wrapper .js_readmore+[data-readmore-toggle]::after{content:"→";font-size:.95rem;line-height:1}html body .main-wrapper .js_readmore[aria-expanded="true"]+[data-readmore-toggle]::after{content:"↑"}html body .main-wrapper .js_readmore+[data-readmore-toggle]:hover,html body .main-wrapper .js_readmore+[data-readmore-toggle]:focus-visible{border-color:rgba(33,103,197,.48)!important;background:#deedff!important;color:#134b91!important;box-shadow:0 6px 14px rgba(33,103,197,.16);transform:translateY(-1px)}html body .main-wrapper .js_readmore+[data-readmore-toggle]:focus-visible{outline:3px solid rgba(33,103,197,.22);outline-offset:2px}body.night-mode .main-wrapper .js_readmore+[data-readmore-toggle]{border-color:rgba(124,177,255,.42)!important;background:rgba(33,103,197,.24)!important;color:#cfe4ff!important}
html body .main-wrapper .vf-profile-studio-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}html body .main-wrapper .vf-profile-studio-steps a{display:grid;grid-template-columns:28px minmax(0,1fr);column-gap:9px;align-items:center;min-height:66px;padding:10px 12px;border:1px solid rgba(76,111,255,.18);border-radius:14px;background:linear-gradient(145deg,#fff,#f6f9ff);color:#1f3550;text-decoration:none!important;box-shadow:0 5px 14px rgba(24,53,88,.05)}html body .main-wrapper .vf-profile-studio-steps a>span,html body .main-wrapper .vf-profile-studio-section-heading>span{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:#2563d8;color:#fff;font-size:.78rem;font-weight:850;line-height:1}html body .main-wrapper .vf-profile-studio-steps strong,html body .main-wrapper .vf-profile-studio-steps small{grid-column:2;min-width:0}html body .main-wrapper .vf-profile-studio-steps strong{align-self:end;color:inherit;font-size:.82rem;font-weight:850;line-height:1.2}html body .main-wrapper .vf-profile-studio-steps small{align-self:start;margin-top:2px;color:#64748b;font-size:.7rem;line-height:1.25}html body .main-wrapper .vf-profile-studio-steps a:hover,html body .main-wrapper .vf-profile-studio-steps a:focus-visible{border-color:rgba(37,99,216,.45);background:#eff5ff;color:#174caa;box-shadow:0 8px 18px rgba(37,99,216,.12)}html body .main-wrapper .vf-profile-studio-section-heading{display:flex;align-items:flex-start;gap:10px;margin:22px 0 12px}html body .main-wrapper .vf-profile-studio-section-heading>div{min-width:0}html body .main-wrapper .vf-profile-studio-section-heading h6{margin:1px 0 2px;color:#1f3550;font-size:.95rem;font-weight:850}html body .main-wrapper .vf-profile-studio-section-heading p{margin:0;color:#6b7b90;font-size:.78rem;line-height:1.4}html body .main-wrapper #vf-profile-theme-builder [aria-label="Profile theme presets"]>[class*="col-"]{display:flex}html body .main-wrapper #vf-profile-theme-builder .js-vf-profile-theme{display:grid!important;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:9px;min-height:52px;margin:0;padding:9px 10px!important;border-color:rgba(99,122,156,.2)!important;border-radius:12px!important;background:#fff!important;box-shadow:none!important}html body .main-wrapper #vf-profile-theme-builder .js-vf-profile-theme>span:first-child{display:flex!important;flex:0 0 auto;gap:4px!important;margin:0!important}html body .main-wrapper #vf-profile-theme-builder .js-vf-profile-theme>span:last-child{min-width:0;overflow:hidden;color:#34445a;font-size:.77rem;line-height:1.2;text-align:left;text-overflow:ellipsis;white-space:nowrap}html body .main-wrapper #vf-profile-theme-builder .js-vf-profile-theme.border-primary{border:2px solid #2563d8!important;background:#f0f6ff!important;box-shadow:0 6px 14px rgba(37,99,216,.14)!important}html body .main-wrapper #vf-profile-theme-builder .js-vf-profile-theme:hover,html body .main-wrapper #vf-profile-theme-builder .js-vf-profile-theme:focus-visible{border-color:rgba(37,99,216,.55)!important;background:#f6f9ff!important}body.night-mode .main-wrapper .vf-profile-studio-steps a,body.night-mode .main-wrapper #vf-profile-theme-builder .js-vf-profile-theme{border-color:rgba(117,160,230,.24)!important;background:#1a2738!important;color:#e4efff!important}body.night-mode .main-wrapper .vf-profile-studio-steps small,body.night-mode .main-wrapper .vf-profile-studio-section-heading p{color:#aebfd4}body.night-mode .main-wrapper .vf-profile-studio-section-heading h6,body.night-mode .main-wrapper #vf-profile-theme-builder .js-vf-profile-theme>span:last-child{color:#edf5ff}@media(max-width:767.98px){html body .main-wrapper .vf-profile-studio-steps{grid-template-columns:1fr}html body .main-wrapper .vf-profile-studio-steps a{min-height:58px}html body .main-wrapper #vf-profile-theme-builder .js-vf-profile-theme{min-height:48px;padding:8px!important}}

html body .main-wrapper .vf-profile-shell .profile-header .profile-name-wrapper .profile-header-title-row>a:first-child,html body .main-wrapper .vf-profile-shell .profile-header .profile-name-wrapper .profile-header-title-row>a:first-child:visited{color:#fff!important;text-shadow:0 2px 12px rgba(0,0,0,.72),0 1px 2px rgba(0,0,0,.9)!important}body.night-mode .main-wrapper .vf-profile-shell .profile-header .profile-name-wrapper .profile-header-title-row>a:first-child,body.night-mode .main-wrapper .vf-profile-shell .profile-header .profile-name-wrapper .profile-header-title-row>a:first-child:visited{color:#fff!important;text-shadow:0 2px 14px rgba(0,0,0,.84),0 1px 2px rgba(0,0,0,.96)!important}
