/* =========================
   FEED ITEMS
========================= */

.feed-item {
  background: #0f172a;
  border-radius: 8px;
  padding: 12px;
  margin-bottom: 12px;
  color: #e5e7eb;
}

.feed-news-banner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 12px;
  border: 1px solid rgba(99, 102, 241, 0.25);
  background: rgba(99, 102, 241, 0.1);
  color: #e5e7eb;
  font-size: 14px;
  text-align: center;
}

.feed-news-banner i {
  color: #a5b4fc;
}

.feed-posts {
  display: block;
  width: 100%;
}

.feed-page .feed-center {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  overflow: visible;
  padding-top: 0 !important;
}

@media (min-width: 901px) and (any-hover: hover) and (any-pointer: fine) {
  html:has(> body.soshix-feed-body),
  body.soshix-feed-body {
    height: 100%;
    overflow: hidden;
  }

  .home-layout.feed-page {
    align-items: flex-start;
    height: calc(100vh - 61px);
    min-height: 0;
    overflow: hidden;
  }

  .feed-page > .column-left,
  .feed-page > .column-right {
    position: sticky;
    top: 61px;
    height: calc(100vh - 61px);
    min-height: 0;
    overflow-y: auto;
    scrollbar-width: none;
  }

  .feed-page > .column-center.feed-center {
    height: calc(100vh - 61px);
    min-height: 0;
    overflow: hidden;
  }

  .feed-page > .column-center.feed-center > .feed-scroll-region {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding-right: 2px;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  .feed-page > .column-left::-webkit-scrollbar,
  .feed-page > .column-right::-webkit-scrollbar,
  .feed-page > .column-center.feed-center > .feed-scroll-region::-webkit-scrollbar,
  .feed-page > .column-left:hover::-webkit-scrollbar,
  .feed-page > .column-right:hover::-webkit-scrollbar,
  .feed-page > .column-center.feed-center > .feed-scroll-region:hover::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
  }
}

.feed-page .feed-filter-tabs,
.feed-page .pulse-create-hub,
.feed-page .create-post,
.feed-page .soshix-aura-action-panel,
.feed-page .soshix-canvas-action-panel,
.feed-page .soshix-flux-action-panel,
.feed-page .soshix-vox-composer {
  flex: 0 0 auto;
}

.feed-page [data-soshix-composer-panel][hidden],
.feed-page .soshix-vox-composer[hidden],
.feed-page .create-post[hidden] {
  display: none !important;
}

.feed-page .soshix-vox-composer {
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 10px;
  margin-bottom: 10px;
  padding: 10px 12px;
}

.feed-page .soshix-vox-composer::after {
  display: none;
}

.feed-page .soshix-vox-composer .vox-avatar {
  width: 38px;
  height: 38px;
  font-size: 14px;
}

.feed-page .soshix-vox-composer .vox-composer-audience {
  margin-bottom: 2px;
}

.feed-page .soshix-vox-composer .vox-composer-audience > button {
  min-height: 28px;
  gap: 6px;
  font-size: 12px;
  padding: 0 10px;
}

.feed-page .soshix-vox-composer textarea {
  min-height: 42px;
  max-height: 120px;
  font-size: 16px;
  line-height: 1.35;
  padding-top: 2px;
}

.feed-page .soshix-vox-composer .vox-media-preview {
  grid-template-columns: minmax(0, 1fr);
  gap: 6px;
  margin: 6px 0 8px;
}

.feed-page .soshix-vox-composer .vox-media-preview-item {
  min-height: 96px;
  max-height: 150px;
  border-radius: 10px;
}

.feed-page .soshix-vox-composer .vox-composer-tools {
  align-items: center;
  padding-top: 7px;
}

.feed-page .soshix-vox-composer .vox-composer-tools::before {
  left: -48px;
}

.feed-page .soshix-vox-composer .vox-composer-tools > div {
  gap: 5px;
}

.feed-page .soshix-vox-composer .vox-composer-tools button,
.feed-page .soshix-vox-composer .vox-tool-button {
  width: 30px;
  height: 30px;
  font-size: 16px;
}

.feed-page .soshix-vox-composer .vox-composer-submit {
  gap: 8px;
}

.feed-page .soshix-vox-composer .vox-composer-submit span {
  font-size: 12px;
}

.feed-page .soshix-vox-composer .vox-composer-submit .vox-composer-error {
  max-width: min(220px, 38vw);
}

.feed-page .soshix-vox-composer .vox-post-btn {
  min-width: 70px;
  min-height: 32px;
  padding: 0 14px;
}

.feed-scroll-region {
  --feed-scrollbar-color: var(--soshix-platform-soshix);
  --feed-scrollbar-canvas-color: var(--soshix-platform-canvas);
  flex: 0 0 auto;
  min-height: auto;
  overflow: visible;
  padding-top: 12px;
}

.feed-scroll-region[data-feed-scroll-theme="soshix"] {
  --feed-scrollbar-color: var(--soshix-platform-soshix);
}

.feed-scroll-region[data-feed-scroll-theme="aura"] {
  --feed-scrollbar-color: var(--soshix-platform-aura);
}

.feed-scroll-region[data-feed-scroll-theme="vox"] {
  --feed-scrollbar-color: var(--soshix-platform-vox);
}

.feed-scroll-region[data-feed-scroll-theme="canvas"] {
  --feed-scrollbar-color: var(--feed-scrollbar-canvas-color);
}

.feed-scroll-region[data-feed-scroll-theme="flux"] {
  --feed-scrollbar-color: var(--soshix-platform-flux);
}

.feed-scroll-region[data-feed-scroll-theme="pulse"] {
  --feed-scrollbar-color: var(--soshix-platform-pulse);
}

.feed-back-top {
  position: fixed;
  right: calc(20vw + 24px);
  bottom: 24px;
  z-index: 900;
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--soshix-platform-soshix) 48%, rgba(255, 255, 255, 0.14));
  border-radius: 999px;
  background:
    radial-gradient(circle at 30% 20%, color-mix(in srgb, var(--soshix-platform-soshix) 28%, transparent), transparent 46%),
    rgba(15, 23, 42, 0.88);
  color: #f8fafc;
  box-shadow:
    0 14px 34px rgba(0, 0, 0, 0.34),
    0 0 18px color-mix(in srgb, var(--soshix-platform-soshix) 18%, transparent);
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  transform: translateY(10px) scale(0.96);
  transition:
    opacity 0.18s ease,
    transform 0.18s ease,
    border-color 0.18s ease,
    background 0.18s ease;
  backdrop-filter: blur(14px);
}

.feed-back-top.is-visible {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0) scale(1);
}

.feed-back-top:hover,
.feed-back-top:focus-visible {
  border-color: color-mix(in srgb, var(--soshix-platform-soshix) 70%, rgba(255, 255, 255, 0.16));
  background:
    radial-gradient(circle at 30% 20%, color-mix(in srgb, var(--soshix-platform-soshix) 36%, transparent), transparent 46%),
    rgba(30, 41, 59, 0.94);
  outline: none;
  transform: translateY(-2px) scale(1.02);
}

.feed-back-top i {
  font-size: 20px;
  line-height: 1;
}

@media (min-width: 901px) {
  .feed-scroll-region[data-feed-scroll-theme="flux"] {
    scroll-behavior: smooth;
    scroll-padding-top: 12px;
    scroll-snap-type: y mandatory;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-clip-card {
    scroll-snap-align: start;
    scroll-snap-stop: always;
  }
}

@media (max-width: 900px) {
  .feed-back-top {
    right: 16px;
    bottom: calc(var(--soshix-feed-mobile-bottom-space, 72px) + 18px);
    width: 46px;
    height: 46px;
    z-index: 940;
  }
}

@media (prefers-reduced-motion: reduce) {
  .feed-back-top {
    transition: none;
  }
}

.feed-pagination-status {
  padding: 12px 8px 18px;
  color: #94a3b8;
  font-size: 13px;
  font-weight: 700;
  text-align: center;
}

.feed-pagination-status.is-pulse-loading-more {
  color: #cbd5e1;
  letter-spacing: 0;
}

.feed-pagination-status[hidden] {
  display: none;
}

.pulse-show-more-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  min-width: 132px;
  border: 1px solid rgba(245, 158, 11, 0.5);
  border-radius: 999px;
  background:
    linear-gradient(135deg, rgba(245, 158, 11, 0.18), rgba(34, 197, 94, 0.12)),
    rgba(15, 23, 42, 0.86);
  color: #f8fafc;
  cursor: pointer;
  font: inherit;
  font-size: 14px;
  font-weight: 800;
  padding: 0 20px;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, color 0.16s ease, opacity 0.16s ease;
}

.pulse-show-more-btn:hover,
.pulse-show-more-btn:focus-visible {
  border-color: rgba(245, 158, 11, 0.82);
  box-shadow: 0 12px 32px rgba(245, 158, 11, 0.18);
  color: #fff7ed;
  outline: none;
}

.pulse-show-more-btn:disabled {
  cursor: wait;
  opacity: 0.68;
}

.feed-filter-tabs {
  position: relative;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 6px;
  margin-top: 16px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  overflow: visible;
}

.feed-filter-tabs::before {
  display: none;
}

.feed-filter-tabs button {
  position: relative;
  min-height: 42px;
  border: 1px solid transparent;
  border-radius: 999px;
  background: rgba(34, 197, 94, 0.08);
  color: var(--feed-tab-color, var(--soshix-platform-soshix));
  background: color-mix(in srgb, var(--feed-tab-color, var(--soshix-platform-soshix)) 8%, transparent);
  color: color-mix(in srgb, var(--feed-tab-color, var(--soshix-platform-soshix)) 72%, #ffffff);
  cursor: pointer;
  font: inherit;
  font-weight: 800;
  transition:
    background 0.15s ease,
    border-color 0.15s ease,
    box-shadow 0.15s ease,
    color 0.15s ease,
    transform 0.15s ease;
}

.feed-filter-tabs button::before {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 6px;
  width: 18px;
  height: 3px;
  border-radius: 999px;
  background: var(--feed-tab-color, var(--soshix-platform-soshix));
  opacity: 0.74;
  transform: translateX(-50%);
  transition:
    bottom 0.15s ease,
    opacity 0.15s ease,
    width 0.15s ease;
}

.feed-filter-tabs button:hover {
  background: rgba(34, 197, 94, 0.15);
  border-color: color-mix(in srgb, var(--feed-tab-color, var(--soshix-platform-soshix)) 34%, transparent);
  background: color-mix(in srgb, var(--feed-tab-color, var(--soshix-platform-soshix)) 15%, rgba(15, 23, 42, 0.92));
  color: #fff;
  transform: translateY(-1px);
}

.feed-filter-tabs button:hover::before {
  bottom: 5px;
  opacity: 1;
  width: 24px;
}

.feed-filter-tabs button.is-active {
  background: var(--feed-tab-color, var(--soshix-platform-soshix));
  border-color: color-mix(in srgb, var(--feed-tab-color, var(--soshix-platform-soshix)) 52%, rgba(255, 255, 255, 0.18));
  background: var(--feed-tab-color, var(--soshix-platform-soshix));
  color: #fff;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.14),
    0 12px 26px color-mix(in srgb, var(--feed-tab-color, var(--soshix-platform-soshix)) 34%, transparent);
  transform: none;
}

.feed-filter-tabs button.is-active::before {
  bottom: 4px;
  width: 28px;
  background: rgba(255, 255, 255, 0.78);
  opacity: 0.9;
}

.feed-filter-tabs [data-soshix-feed-tab="all"] {
  --feed-tab-color: var(--soshix-platform-pulse);
}

.feed-filter-tabs [data-soshix-feed-tab="soshix"] {
  --feed-tab-color: var(--soshix-platform-soshix);
}

.feed-filter-tabs [data-soshix-feed-tab="aura"] {
  --feed-tab-color: var(--soshix-platform-aura);
}

.feed-filter-tabs [data-soshix-feed-tab="vox"] {
  --feed-tab-color: var(--soshix-platform-vox);
}

.feed-filter-tabs [data-soshix-feed-tab="canvas"] {
  --feed-tab-color: var(--soshix-platform-canvas);
}

.feed-filter-tabs [data-soshix-feed-tab="flux"] {
  --feed-tab-color: var(--soshix-platform-flux);
}

.feed-filter-tabs .feed-filter-pulse {
  font-weight: 900;
}

.feed-filter-tabs .feed-filter-pulse::after {
  content: "";
  position: absolute;
  top: 8px;
  right: -4px;
  bottom: 8px;
  width: 1px;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.28);
  pointer-events: none;
}

.feed-filter-tabs button:active {
  transform: scale(0.98);
}

@media (min-width: 901px) {
  .feed-filter-tabs {
    gap: 8px;
  }

  .feed-filter-tabs button {
    min-height: 44px;
    padding: 6px 10px 12px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: color-mix(in srgb, var(--feed-tab-color, var(--soshix-platform-soshix)) 62%, #ffffff);
    box-shadow: none;
    font-weight: 700;
    transform: none;
  }

  .feed-filter-tabs button::before {
    left: 50%;
    right: auto;
    bottom: 5px;
    width: 18px;
    height: 2px;
    background: var(--feed-tab-color, var(--soshix-platform-soshix));
    opacity: 0;
    transform: translateX(-50%);
  }

  .feed-filter-tabs button:hover {
    background: color-mix(in srgb, var(--feed-tab-color, var(--soshix-platform-soshix)) 7%, transparent);
    border-color: transparent;
    color: color-mix(in srgb, var(--feed-tab-color, var(--soshix-platform-soshix)) 82%, #ffffff);
    transform: none;
  }

  .feed-filter-tabs button:hover::before {
    bottom: 5px;
    width: 22px;
    opacity: 0.56;
  }

  .feed-filter-tabs button:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--feed-tab-color, var(--soshix-platform-soshix)) 72%, #ffffff);
    outline-offset: 4px;
    border-radius: 6px;
  }

  .feed-filter-tabs button.is-active {
    background: transparent;
    border-color: transparent;
    color: var(--feed-tab-color, var(--soshix-platform-soshix));
    box-shadow: none;
    font-weight: 800;
  }

  .feed-filter-tabs button.is-active::before {
    left: 50%;
    right: auto;
    bottom: 5px;
    width: 30px;
    height: 3px;
    background: var(--feed-tab-color, var(--soshix-platform-soshix));
    opacity: 1;
    transform: translateX(-50%);
  }

  .feed-filter-tabs .feed-filter-pulse::after {
    display: none;
  }

  .feed-filter-tabs button:active {
    transform: none;
  }
}

.feed-filter-panel[hidden] {
  display: none;
}

.pulse-feed-item {
  position: relative;
  --pulse-accent: rgba(34, 197, 94, 0.75);
}

.pulse-feed-item::before {
  content: "";
  position: absolute;
  top: 12px;
  bottom: 12px;
  left: 0;
  width: 3px;
  border-radius: 999px;
  background: var(--pulse-accent);
  opacity: 0.9;
}

.pulse-platform-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  width: max-content;
  min-width: 82px;
  height: 26px;
  margin-bottom: 8px;
  padding: 0 9px 0 7px;
  border: 1px solid color-mix(in srgb, var(--pulse-accent) 40%, transparent);
  border-radius: 999px;
  background: color-mix(in srgb, var(--pulse-accent) 13%, rgba(15, 23, 42, 0.92));
  color: color-mix(in srgb, var(--pulse-accent) 78%, #ffffff);
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0.01em;
  box-shadow: 0 6px 16px rgba(15, 23, 42, 0.18);
}

.pulse-feed-item:not(.feed-item) {
  padding-top: 12px;
}

.pulse-feed-item:not(.feed-item) > .pulse-platform-badge {
  margin-left: 12px;
}

.pulse-create-hub {
  display: grid;
  gap: 14px;
  border: 1px solid rgba(245, 158, 11, 0.18);
  background:
    radial-gradient(circle at 18% 0%, rgba(245, 158, 11, 0.16), transparent 34%),
    linear-gradient(135deg, rgba(34, 197, 94, 0.08), rgba(168, 85, 247, 0.06)),
    #0f172a;
  box-shadow: 0 16px 36px rgba(2, 6, 23, 0.22);
}

.pulse-create-hub-header {
  display: flex;
  align-items: center;
  gap: 12px;
}

.pulse-create-hub-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 12px;
  background: linear-gradient(135deg, #f59e0b, #22c55e);
  color: #fff;
  box-shadow: 0 12px 24px rgba(245, 158, 11, 0.2);
}

.pulse-create-hub h2 {
  margin: 0;
  color: #f8fafc;
  font-size: 18px;
  font-weight: 900;
  line-height: 1.2;
}

.pulse-create-hub p {
  margin: 3px 0 0;
  color: #cbd5e1;
  font-size: 13px;
  font-weight: 650;
}

.pulse-create-options {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}

.pulse-create-options[hidden],
.pulse-create-hub[hidden],
.pulse-create-placeholder[hidden] {
  display: none !important;
}

.pulse-create-option {
  --pulse-create-color: #22c55e;
  min-width: 0;
  min-height: 88px;
  display: grid;
  align-content: start;
  gap: 9px;
  border: 1px solid color-mix(in srgb, var(--pulse-create-color) 28%, rgba(148, 163, 184, 0.12));
  border-radius: 8px;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--pulse-create-color) 11%, transparent), rgba(15, 23, 42, 0.34)),
    rgba(2, 6, 23, 0.24);
  color: #f8fafc;
  cursor: pointer;
  font: inherit;
  padding: 10px;
  text-align: left;
  transition:
    background 0.16s ease,
    border-color 0.16s ease,
    box-shadow 0.16s ease,
    transform 0.16s ease;
}

.pulse-create-option:hover,
.pulse-create-option:focus-visible {
  border-color: color-mix(in srgb, var(--pulse-create-color) 56%, rgba(255, 255, 255, 0.12));
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--pulse-create-color) 18%, transparent), rgba(15, 23, 42, 0.44)),
    rgba(2, 6, 23, 0.28);
  box-shadow: 0 14px 30px color-mix(in srgb, var(--pulse-create-color) 20%, transparent);
  outline: none;
  transform: translateY(-2px);
}

.pulse-create-logo {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--pulse-create-color) 34%, rgba(255, 255, 255, 0.12));
  border-radius: 10px;
  background: rgba(15, 23, 42, 0.72);
}

.pulse-create-logo img {
  width: 24px;
  height: 24px;
  display: block;
  object-fit: contain;
}

.pulse-create-option strong,
.pulse-create-option em {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
}

.pulse-create-option strong {
  color: color-mix(in srgb, var(--pulse-create-color) 76%, #ffffff);
  font-size: 14px;
  font-weight: 900;
  line-height: 1.2;
}

.pulse-create-option em {
  margin-top: 2px;
  color: #cbd5e1;
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
  line-height: 1.25;
}

.pulse-create-soshix {
  --pulse-create-color: #22c55e;
}

.pulse-create-aura {
  --pulse-create-color: #a855f7;
}

.pulse-create-vox {
  --pulse-create-color: #1d9bf0;
}

.pulse-create-canvas {
  --pulse-create-color: #ef4444;
}

.pulse-create-flux {
  --pulse-create-color: #ec4899;
}

.pulse-create-placeholder {
  --pulse-create-color: #f59e0b;
  display: grid;
  gap: 12px;
}

.pulse-create-shell[data-pulse-create-active="soshix"] .pulse-create-placeholder {
  --pulse-create-color: #22c55e;
}

.pulse-create-shell[data-pulse-create-active="aura"] .pulse-create-placeholder {
  --pulse-create-color: #a855f7;
}

.pulse-create-shell[data-pulse-create-active="vox"] .pulse-create-placeholder {
  --pulse-create-color: #1d9bf0;
}

.pulse-create-shell[data-pulse-create-active="canvas"] .pulse-create-placeholder {
  --pulse-create-color: #ef4444;
}

.pulse-create-shell[data-pulse-create-active="flux"] .pulse-create-placeholder {
  --pulse-create-color: #ec4899;
}

.pulse-create-back {
  width: fit-content;
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid color-mix(in srgb, var(--pulse-create-color) 32%, rgba(148, 163, 184, 0.16));
  border-radius: 999px;
  background: color-mix(in srgb, var(--pulse-create-color) 10%, rgba(15, 23, 42, 0.74));
  color: color-mix(in srgb, var(--pulse-create-color) 70%, #ffffff);
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  font-weight: 850;
  padding: 0 12px;
  transition:
    background 0.16s ease,
    border-color 0.16s ease,
    color 0.16s ease,
    transform 0.16s ease;
}

.pulse-create-back:hover,
.pulse-create-back:focus-visible {
  border-color: color-mix(in srgb, var(--pulse-create-color) 54%, rgba(255, 255, 255, 0.16));
  background: color-mix(in srgb, var(--pulse-create-color) 16%, rgba(15, 23, 42, 0.86));
  color: #fff;
  outline: none;
  transform: translateY(-1px);
}

.pulse-create-placeholder-body {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 92px;
  border: 1px solid color-mix(in srgb, var(--pulse-create-color) 24%, rgba(148, 163, 184, 0.12));
  border-radius: 10px;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--pulse-create-color) 13%, transparent), rgba(2, 6, 23, 0.22)),
    rgba(2, 6, 23, 0.22);
  padding: 14px;
}

.pulse-create-placeholder.has-real-composer .pulse-create-placeholder-body {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  align-items: start;
}

.pulse-create-placeholder.has-aura-actions .pulse-create-placeholder-body {
  grid-template-columns: 44px minmax(0, 1fr);
  min-height: 0;
}

.pulse-create-composer-slot {
  grid-column: 1 / -1;
}

.pulse-create-composer-slot[hidden] {
  display: none !important;
}

.pulse-create-composer-slot .create-post {
  margin: 0;
}

.pulse-create-composer-slot .create-post.is-pulse-embedded {
  border-color: color-mix(in srgb, var(--pulse-create-color) 24%, rgba(148, 163, 184, 0.12));
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--pulse-create-color) 9%, transparent), rgba(15, 23, 42, 0.5)),
    #0f172a;
}

.pulse-create-composer-slot .soshix-aura-action-row.is-pulse-embedded {
  margin: 0;
}

.pulse-create-composer-slot .soshix-vox-composer.is-pulse-embedded {
  margin: 0;
  border: 1px solid color-mix(in srgb, var(--pulse-create-color) 30%, rgba(148, 163, 184, 0.12));
  background:
    radial-gradient(circle at 14% 0%, color-mix(in srgb, var(--pulse-create-color) 18%, transparent), transparent 38%),
    linear-gradient(135deg, color-mix(in srgb, var(--pulse-create-color) 10%, transparent), rgba(15, 23, 42, 0.58)),
    #0f172a;
  box-shadow: 0 14px 34px rgba(2, 6, 23, 0.26);
}

.pulse-create-composer-slot .soshix-vox-composer.is-pulse-embedded .soshix-vox-feed-tabs {
  display: none;
}

.pulse-create-composer-slot .soshix-vox-composer.is-pulse-embedded .vox-avatar {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--pulse-create-color) 22%, transparent);
}

.pulse-create-composer-slot .soshix-vox-composer.is-pulse-embedded .vox-composer-audience > button {
  border-color: color-mix(in srgb, var(--pulse-create-color) 34%, rgba(148, 163, 184, 0.16));
  background: color-mix(in srgb, var(--pulse-create-color) 10%, rgba(15, 23, 42, 0.78));
  color: color-mix(in srgb, var(--pulse-create-color) 66%, #ffffff);
}

.pulse-create-composer-slot .soshix-vox-composer.is-pulse-embedded textarea {
  color: #f8fafc;
}

.pulse-create-composer-slot .soshix-vox-composer.is-pulse-embedded .vox-composer-tools {
  border-top-color: color-mix(in srgb, var(--pulse-create-color) 22%, rgba(148, 163, 184, 0.12));
}

.pulse-create-composer-slot .soshix-vox-composer.is-pulse-embedded .vox-composer-tools button,
.pulse-create-composer-slot .soshix-vox-composer.is-pulse-embedded .vox-tool-button {
  color: color-mix(in srgb, var(--pulse-create-color) 76%, #ffffff);
}

.pulse-create-composer-slot .soshix-vox-composer.is-pulse-embedded .vox-composer-tools button:hover,
.pulse-create-composer-slot .soshix-vox-composer.is-pulse-embedded .vox-composer-tools button:focus-visible,
.pulse-create-composer-slot .soshix-vox-composer.is-pulse-embedded .vox-tool-button:hover,
.pulse-create-composer-slot .soshix-vox-composer.is-pulse-embedded .vox-tool-button:focus-visible {
  background: color-mix(in srgb, var(--pulse-create-color) 15%, rgba(15, 23, 42, 0.74));
  color: #fff;
}

.pulse-create-composer-slot .soshix-vox-composer.is-pulse-embedded .vox-post-btn {
  background: linear-gradient(135deg, var(--pulse-create-color), #38bdf8);
  box-shadow: 0 10px 24px color-mix(in srgb, var(--pulse-create-color) 24%, transparent);
}

.pulse-create-composer-slot .soshix-canvas-action.is-pulse-embedded {
  margin: 0;
}

.pulse-create-composer-slot .soshix-flux-action.is-pulse-embedded {
  margin: 0;
}

.pulse-create-placeholder-icon {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--pulse-create-color) 36%, rgba(255, 255, 255, 0.12));
  border-radius: 12px;
  background: rgba(15, 23, 42, 0.72);
}

.pulse-create-placeholder-icon img {
  width: 30px;
  height: 30px;
  display: block;
  object-fit: contain;
}

.pulse-create-placeholder h3 {
  margin: 0;
  color: color-mix(in srgb, var(--pulse-create-color) 72%, #ffffff);
  font-size: 18px;
  font-weight: 900;
}

.pulse-create-placeholder p {
  margin: 4px 0 0;
  color: #cbd5e1;
  font-size: 14px;
  font-weight: 650;
}

.pulse-platform-badge i {
  pointer-events: none;
}

.pulse-platform-badge img {
  display: block;
  width: 18px;
  height: 18px;
  max-width: 18px;
  max-height: 18px;
  object-fit: contain;
  object-position: center;
}

.pulse-platform-soshix img {
  width: 18px;
  height: 18px;
}

.pulse-platform-badge .pulse-platform-label {
  position: static;
  width: auto;
  height: auto;
  padding: 0;
  margin: 0;
  overflow: visible;
  clip: auto;
  white-space: nowrap;
  border: 0;
}

.feed-item.pulse-feed-item.soshix-pulse-ad-item {
  --pulse-accent: rgba(111, 78, 55, 0.95);
  padding: 0;
  overflow: hidden;
  border: 2px solid rgba(151, 116, 86, 0.74);
  background-color: #261915;
  background:
    linear-gradient(180deg, rgba(111, 78, 55, 0.3), rgba(38, 25, 21, 0.98) 46%),
    #261915;
  box-shadow:
    inset 5px 0 0 rgba(151, 116, 86, 0.9),
    0 18px 42px rgba(2, 6, 23, 0.28);
}

.pulse-platform-sponsored {
  min-width: 0;
  margin: 0;
  border-color: rgba(199, 168, 137, 0.68);
  background: rgba(111, 78, 55, 0.26);
  color: #ead7c3;
}

.soshix-pulse-ad-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  padding: 14px 14px 10px;
  border-bottom: 1px solid rgba(151, 116, 86, 0.3);
}

.soshix-pulse-ad-label-row {
  display: flex;
  align-items: center;
  gap: 8px;
  justify-content: flex-start;
  grid-column: 1;
}

.soshix-pulse-ad-identity {
  display: flex;
  align-items: center;
  gap: 10px;
  grid-column: 1;
  min-width: 0;
}

.soshix-pulse-ad-options {
  display: inline-grid;
  place-items: center;
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: start;
  width: 34px;
  height: 34px;
  border: 1px solid rgba(199, 168, 137, 0.34);
  border-radius: 999px;
  background: rgba(111, 78, 55, 0.2);
  color: #ead7c3;
  cursor: default;
  font-size: 18px;
  line-height: 1;
}

.soshix-pulse-ad-options:hover,
.soshix-pulse-ad-options:focus-visible {
  border-color: rgba(220, 194, 169, 0.62);
  background: rgba(111, 78, 55, 0.34);
  color: #fff8f1;
  outline: none;
}

.soshix-pulse-ad-avatar {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(199, 168, 137, 0.38);
  border-radius: 50%;
  background: rgba(111, 78, 55, 0.26);
  color: #ead7c3;
  font-size: 16px;
  font-weight: 800;
  flex: 0 0 auto;
}

.soshix-pulse-ad-meta {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.soshix-pulse-ad-business {
  color: #f8fafc;
  font-size: 15px;
  font-weight: 800;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.soshix-pulse-ad-message {
  margin: 0;
  padding: 12px 14px 0;
  color: #efe4da;
  font-size: 15px;
  line-height: 1.5;
  white-space: pre-wrap;
}

.soshix-pulse-ad-media {
  display: block;
  width: calc(100% - 28px);
  margin: 14px 14px 0;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 10px;
  background: rgba(2, 6, 23, 0.52);
}

.soshix-pulse-ad-media img,
.soshix-pulse-ad-media video {
  display: block;
  width: 100%;
  max-height: 460px;
  object-fit: contain;
  background: rgba(2, 6, 23, 0.52);
}

.soshix-pulse-ad-footer {
  display: flex;
  align-items: center;
  gap: 12px;
  justify-content: flex-end;
  padding: 14px;
}

.soshix-pulse-ad-stats {
  display: flex;
  align-items: center;
  flex: 1 1 auto;
  min-width: 0;
  gap: 24px;
  color: rgba(239, 228, 218, 0.82);
  font-size: 13px;
  font-weight: 800;
}

.soshix-pulse-ad-stat {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
  white-space: nowrap;
}

.soshix-pulse-ad-like {
  appearance: none;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: inherit;
  cursor: pointer;
  font: inherit;
  font-weight: 800;
  min-height: 32px;
  margin: -6px;
  padding: 6px;
}

.soshix-pulse-ad-like:hover,
.soshix-pulse-ad-like:focus-visible {
  background: rgba(248, 239, 230, 0.1);
  color: #fff8f1;
  outline: none;
}

.soshix-pulse-ad-stat i {
  color: #dcc2a9;
  font-size: 15px;
  line-height: 1;
}

.soshix-pulse-ad-like.is-liked,
.soshix-pulse-ad-like.is-liked i {
  color: #ef4444;
}

.soshix-pulse-ad-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 0 16px;
  border: 1px solid rgba(199, 168, 137, 0.54);
  border-radius: 8px;
  background: #6f4e37;
  color: #f8efe6;
  font-size: 13px;
  font-weight: 900;
  text-decoration: none;
  flex: 0 0 auto;
}

.soshix-pulse-ad-action:hover,
.soshix-pulse-ad-action:focus-visible {
  border-color: rgba(220, 194, 169, 0.78);
  background: #7e5d45;
  color: #fff8f1;
  outline: none;
}

@media (prefers-color-scheme: light) {
  .feed-item.pulse-feed-item.soshix-pulse-ad-item {
    border-color: rgba(151, 116, 86, 0.72);
    background-color: #3a2922;
    background:
      linear-gradient(180deg, rgba(111, 78, 55, 0.34), rgba(58, 41, 34, 0.98) 48%),
      #3a2922;
    color: #f8fafc;
    box-shadow:
      inset 5px 0 0 rgba(151, 116, 86, 0.86),
      0 14px 30px rgba(15, 23, 42, 0.16);
  }

  .feed-item.pulse-feed-item.soshix-pulse-ad-item .pulse-platform-sponsored {
    border-color: rgba(199, 168, 137, 0.62);
    background: rgba(111, 78, 55, 0.24);
    color: #ead7c3;
  }

  .feed-item.pulse-feed-item.soshix-pulse-ad-item .soshix-pulse-ad-business {
    color: #f8fafc;
  }

  .feed-item.pulse-feed-item.soshix-pulse-ad-item .soshix-pulse-ad-message {
    color: #efe4da;
  }
}

.pulse-platform-detail {
  color: rgba(203, 213, 225, 0.72);
  font-weight: 700;
}

.pulse-platform-soshix {
  --pulse-accent: #22c55e;
}

.pulse-platform-aura {
  --pulse-accent: #a855f7;
}

.pulse-platform-vox {
  --pulse-accent: #1d9bf0;
}

.pulse-platform-canvas {
  --pulse-accent: #ef4444;
}

.pulse-platform-flux {
  --pulse-accent: #ec4899;
}

.pulse-soshix-item {
  --pulse-accent: #22c55e;
}

.pulse-aura-item {
  --pulse-accent: #a855f7;
}

.pulse-vox-item {
  --pulse-accent: #1d9bf0;
}

.pulse-canvas-item {
  --pulse-accent: #ef4444;
}

.pulse-flux-item {
  --pulse-accent: #ec4899;
}

.pulse-feed[data-flux-disable-reel-scroll="1"] .pulse-flux-item .flux-clip {
  scroll-snap-align: none;
  scroll-snap-stop: normal;
}

.pulse-flux-item > .soshix-flux-clip-card {
  position: relative;
  width: min(410px, 100%);
  justify-self: center;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  margin-bottom: 12px;
  padding: 12px;
  border-color: rgba(236, 72, 153, 0.26);
  background:
    radial-gradient(circle at 50% 0%, rgba(236, 72, 153, 0.18), transparent 38%),
    linear-gradient(180deg, rgba(15, 23, 42, 0.94), rgba(2, 6, 23, 0.96));
}

.pulse-flux-item .soshix-flux-video {
  width: min(280px, 100%);
  max-height: min(68vh, 520px);
  min-height: 430px;
  justify-self: center;
  border: 1px solid rgba(236, 72, 153, 0.24);
  box-shadow:
    0 18px 42px rgba(2, 6, 23, 0.38),
    0 0 0 1px rgba(255, 255, 255, 0.04) inset;
}

.pulse-flux-item .soshix-flux-info {
  align-content: start;
  gap: 7px;
  padding: 2px 2px 0;
}

.pulse-flux-item .soshix-flux-creator {
  width: 100%;
}

.pulse-flux-item .soshix-flux-avatar {
  width: 30px;
  height: 30px;
  background: linear-gradient(135deg, #ec4899, #f472b6);
  color: #fff;
}

.pulse-flux-item .soshix-flux-creator strong {
  font-size: 14px;
}

.pulse-flux-item .soshix-flux-creator em,
.pulse-flux-item .soshix-flux-sound,
.pulse-flux-item .soshix-flux-stats {
  font-size: 12px;
}

.pulse-flux-item .soshix-flux-info p {
  display: -webkit-box;
  overflow: hidden;
  color: #f8fafc;
  font-size: 13px;
  line-height: 1.4;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.pulse-flux-item .soshix-flux-sound {
  color: #f9a8d4;
}

.pulse-flux-item .soshix-flux-sound a {
  color: #f9a8d4;
}

.pulse-flux-item .soshix-flux-stats {
  justify-content: space-between;
  gap: 8px;
  padding-top: 4px;
  color: #cbd5e1;
}

.pulse-flux-item .soshix-flux-stats span {
  padding: 5px 8px;
  border-radius: 999px;
  background: rgba(236, 72, 153, 0.1);
}

.pulse-vox-item > .vox-post-card {
  margin-bottom: 12px;
}

.pulse-vox-item .vox-post-media-item.is-inline-playing {
  cursor: default;
}

.pulse-vox-item .vox-post-media-item.is-inline-playing video {
  object-fit: contain;
}

.pulse-vox-item .vox-post-media-item.is-inline-playing > i {
  display: none;
}

.soshix-aura-action-panel[hidden] {
  display: none;
}

.soshix-aura-action-panel {
  display: grid;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid rgba(236, 72, 153, 0.16);
  background: linear-gradient(135deg, rgba(236, 72, 153, 0.12), rgba(124, 58, 237, 0.08)), #0f172a;
}

.soshix-aura-action-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.soshix-aura-action {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid rgba(244, 114, 182, 0.34);
  border-radius: 999px;
  background: linear-gradient(135deg, #ec4899, #8b5cf6);
  box-shadow: 0 10px 24px rgba(236, 72, 153, 0.18);
  color: #fff;
  cursor: pointer;
  font: inherit;
  font-size: 14px;
  font-weight: 800;
  padding: 7px 14px;
  text-decoration: none;
  transition:
    background 0.16s ease,
    border-color 0.16s ease,
    box-shadow 0.16s ease,
    color 0.16s ease,
    transform 0.16s ease;
}

.soshix-aura-action:nth-child(2) {
  background: linear-gradient(135deg, #8b5cf6, #06b6d4);
  border-color: rgba(139, 92, 246, 0.38);
  box-shadow: 0 10px 24px rgba(139, 92, 246, 0.16);
}

.soshix-aura-action i {
  color: #fff;
  font-size: 15px;
}

.soshix-aura-action:hover,
.soshix-aura-action:focus-visible {
  border-color: rgba(255, 255, 255, 0.32);
  box-shadow: 0 12px 28px rgba(236, 72, 153, 0.24);
  color: #fff;
  outline: none;
  transform: translateY(-1px);
}

.soshix-aura-action:nth-child(2):hover,
.soshix-aura-action:nth-child(2):focus-visible {
  box-shadow: 0 12px 28px rgba(139, 92, 246, 0.24);
}

.soshix-aura-feed-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px;
  padding: 4px;
  border: 1px solid rgba(216, 180, 254, 0.18);
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.78);
}

.soshix-aura-feed-tabs button {
  min-height: 32px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #d8b4fe;
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  padding: 6px 12px;
  transition:
    background 0.16s ease,
    box-shadow 0.16s ease,
    color 0.16s ease,
    transform 0.16s ease;
}

.soshix-aura-feed-tabs button:hover,
.soshix-aura-feed-tabs button:focus-visible {
  background: rgba(168, 85, 247, 0.16);
  color: #fff;
  outline: none;
}

.soshix-aura-feed-tabs button.is-active {
  background: linear-gradient(135deg, #ec4899, #8b5cf6);
  box-shadow: 0 8px 20px rgba(168, 85, 247, 0.18);
  color: #fff;
}

.soshix-aura-view-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  width: 100%;
  gap: 0;
  margin: 12px 0 0;
  padding: 0;
  border: 1px solid rgba(216, 180, 254, 0.18);
  border-bottom-color: rgba(168, 85, 247, 0.32);
  border-radius: 0;
  background:
    linear-gradient(180deg, rgba(168, 85, 247, 0.08), rgba(15, 23, 42, 0.46)),
    rgba(15, 23, 42, 0.72);
  backdrop-filter: blur(16px);
  box-shadow: inset 0 -1px 0 rgba(168, 85, 247, 0.12);
  overflow: hidden;
}

.soshix-aura-view-tabs button {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 100%;
  min-width: 0;
  min-height: 42px;
  border-radius: 0;
  color: #c4b5fd;
  font-size: 14px;
  font-weight: 800;
  padding: 9px 12px 11px;
  text-align: center;
  white-space: nowrap;
}

.soshix-aura-view-tabs button + button {
  border-left: 1px solid rgba(216, 180, 254, 0.18);
}

.soshix-aura-view-tabs button::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 3px;
  border-radius: 0;
  background: transparent;
  transition:
    background 0.16s ease,
    box-shadow 0.16s ease;
}

.soshix-aura-view-tabs button:hover,
.soshix-aura-view-tabs button:focus-visible {
  background: rgba(168, 85, 247, 0.12);
  color: #f5f3ff;
}

.soshix-aura-view-tabs button.is-active {
  background:
    linear-gradient(180deg, rgba(168, 85, 247, 0.18), rgba(236, 72, 153, 0.08)),
    rgba(15, 23, 42, 0.72);
  box-shadow: none;
  color: #fff;
}

.soshix-aura-view-tabs button.is-active::after {
  background: linear-gradient(90deg, #ec4899, #8b5cf6);
  box-shadow: 0 0 16px rgba(168, 85, 247, 0.42);
}

.soshix-vox-view-tabs {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  width: 100%;
  gap: 0;
  margin: 12px 0 0;
  padding: 0;
  border: 1px solid rgba(96, 165, 250, 0.2);
  border-bottom-color: rgba(29, 155, 240, 0.36);
  border-radius: 0;
  background:
    linear-gradient(180deg, rgba(29, 155, 240, 0.08), rgba(15, 23, 42, 0.46)),
    rgba(15, 23, 42, 0.72);
  backdrop-filter: blur(16px);
  box-shadow: inset 0 -1px 0 rgba(29, 155, 240, 0.14);
  overflow: hidden;
}

.soshix-vox-view-tabs button {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 100%;
  min-width: 0;
  min-height: 42px;
  border-radius: 0;
  color: #bfdbfe;
  font-size: 14px;
  font-weight: 800;
  padding: 9px 12px 11px;
  text-align: center;
  white-space: nowrap;
}

.soshix-vox-view-tabs button + button {
  border-left: 1px solid rgba(96, 165, 250, 0.18);
}

.soshix-vox-view-tabs button::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 3px;
  background: transparent;
  transition:
    background 0.16s ease,
    box-shadow 0.16s ease;
}

.soshix-vox-view-tabs button:hover,
.soshix-vox-view-tabs button:focus-visible {
  background: rgba(29, 155, 240, 0.12);
  color: #eff6ff;
}

.soshix-vox-view-tabs button.is-active {
  background:
    linear-gradient(180deg, rgba(29, 155, 240, 0.18), rgba(37, 99, 235, 0.08)),
    rgba(15, 23, 42, 0.72);
  box-shadow: none;
  color: #fff;
}

.soshix-vox-view-tabs button.is-active::after {
  background: linear-gradient(90deg, #38bdf8, #1d9bf0);
  box-shadow: 0 0 16px rgba(29, 155, 240, 0.42);
}

.soshix-canvas-action-panel[hidden] {
  display: none;
}

.soshix-canvas-action-panel {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid rgba(239, 68, 68, 0.16);
  background:
    linear-gradient(135deg, rgba(239, 68, 68, 0.12), rgba(124, 58, 237, 0.08)),
    #0f172a;
}

.soshix-canvas-action-panel .soshix-canvas-action {
  align-self: flex-start;
}

.soshix-canvas-feed-tabs {
  width: 100%;
  border-color: rgba(248, 113, 113, 0.2);
}

.soshix-canvas-feed-tabs button {
  color: #fecaca;
}

.soshix-canvas-feed-tabs button:hover,
.soshix-canvas-feed-tabs button:focus-visible {
  background: rgba(239, 68, 68, 0.14);
}

.soshix-canvas-feed-tabs button.is-active {
  background: linear-gradient(135deg, #ef4444, #7c3aed);
  box-shadow: 0 8px 20px rgba(239, 68, 68, 0.18);
}

.soshix-canvas-view-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  width: 100%;
  gap: 0;
  margin: 12px 0 0;
  padding: 0;
  border: 1px solid rgba(248, 113, 113, 0.22);
  border-bottom-color: rgba(239, 68, 68, 0.38);
  border-radius: 0;
  background:
    linear-gradient(180deg, rgba(239, 68, 68, 0.08), rgba(15, 23, 42, 0.46)),
    rgba(15, 23, 42, 0.72);
  backdrop-filter: blur(16px);
  box-shadow: inset 0 -1px 0 rgba(239, 68, 68, 0.14);
  overflow: hidden;
}

.soshix-canvas-view-tabs button {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 100%;
  min-width: 0;
  min-height: 42px;
  border-radius: 0;
  color: #fecaca;
  font-size: 14px;
  font-weight: 800;
  padding: 9px 12px 11px;
  text-align: center;
  white-space: nowrap;
}

.soshix-canvas-view-tabs button + button {
  border-left: 1px solid rgba(248, 113, 113, 0.18);
}

.soshix-canvas-view-tabs button::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 3px;
  background: transparent;
  transition:
    background 0.16s ease,
    box-shadow 0.16s ease;
}

.soshix-canvas-view-tabs button:hover,
.soshix-canvas-view-tabs button:focus-visible {
  background: rgba(239, 68, 68, 0.12);
  color: #fff1f2;
}

.soshix-canvas-view-tabs button.is-active {
  background:
    linear-gradient(180deg, rgba(239, 68, 68, 0.18), rgba(124, 58, 237, 0.08)),
    rgba(15, 23, 42, 0.72);
  box-shadow: none;
  color: #fff;
}

.soshix-canvas-view-tabs button.is-active::after {
  background: linear-gradient(90deg, #f87171, #ef4444);
  box-shadow: 0 0 16px rgba(239, 68, 68, 0.42);
}

.soshix-canvas-action {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid rgba(248, 113, 113, 0.36);
  border-radius: 999px;
  background: linear-gradient(135deg, #ef4444, #7c3aed);
  box-shadow: 0 10px 24px rgba(239, 68, 68, 0.18);
  color: #fff;
  cursor: pointer;
  font: inherit;
  font-size: 14px;
  font-weight: 850;
  padding: 7px 14px;
  text-decoration: none;
  transition:
    border-color 0.16s ease,
    color 0.16s ease,
    box-shadow 0.16s ease,
    transform 0.16s ease;
}

.soshix-canvas-action i {
  color: #fff;
  font-size: 15px;
}

.soshix-canvas-action:hover,
.soshix-canvas-action:focus-visible {
  border-color: rgba(255, 255, 255, 0.34);
  box-shadow: 0 12px 28px rgba(239, 68, 68, 0.24);
  color: #fff;
  outline: none;
  transform: translateY(-1px);
}

body.soshix-canvas-upload-open {
  overflow: hidden;
}

.soshix-canvas-upload-modal {
  position: fixed;
  inset: 0;
  z-index: 5000;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.soshix-canvas-upload-modal.is-open {
  display: flex;
}

.soshix-canvas-upload-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(2, 6, 23, 0.76);
  backdrop-filter: blur(12px);
}

.soshix-canvas-upload-dialog {
  position: relative;
  z-index: 1;
  width: min(900px, 96vw);
  height: min(760px, 92vh);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid rgba(239, 68, 68, 0.24);
  border-radius: 16px;
  background: #020617;
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.48);
}

.soshix-canvas-upload-header {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 50px;
  padding: 10px 14px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.14);
  background:
    linear-gradient(135deg, rgba(239, 68, 68, 0.14), rgba(124, 58, 237, 0.08)),
    #0f172a;
  color: #f8fafc;
}

.soshix-canvas-upload-header strong {
  font-size: 15px;
  font-weight: 900;
}

.soshix-canvas-upload-header button {
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 50%;
  background: rgba(15, 23, 42, 0.78);
  color: #e5e7eb;
  cursor: pointer;
  transition:
    background 0.16s ease,
    border-color 0.16s ease,
    color 0.16s ease,
    transform 0.16s ease;
}

.soshix-canvas-upload-header button:hover,
.soshix-canvas-upload-header button:focus-visible {
  border-color: rgba(239, 68, 68, 0.46);
  background: rgba(239, 68, 68, 0.14);
  color: #fff;
  outline: none;
  transform: translateY(-1px);
}

.soshix-canvas-upload-dialog iframe {
  flex: 1 1 auto;
  width: 100%;
  min-height: 0;
  border: 0;
  background: #050816;
}

.soshix-flux-action-panel[hidden] {
  display: none;
}

.soshix-flux-action-panel {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid rgba(250, 204, 21, 0.18);
  background:
    linear-gradient(135deg, rgba(250, 204, 21, 0.12), rgba(236, 72, 153, 0.08)),
    #0f172a;
}

.soshix-flux-action-panel .soshix-flux-action {
  align-self: flex-start;
}

.soshix-flux-upload-label-mobile {
  display: none;
}

.soshix-flux-feed-tabs {
  width: 100%;
  border-color: rgba(236, 72, 153, 0.22);
}

.soshix-flux-feed-tabs button {
  color: #fbcfe8;
}

.soshix-flux-feed-tabs button:hover,
.soshix-flux-feed-tabs button:focus-visible {
  background: rgba(236, 72, 153, 0.14);
}

.soshix-flux-feed-tabs button.is-active {
  background: linear-gradient(135deg, #ec4899, #facc15);
  box-shadow: 0 8px 20px rgba(236, 72, 153, 0.2);
}

.soshix-flux-view-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  width: 100%;
  gap: 0;
  margin: 12px 0 0;
  padding: 0;
  border: 1px solid rgba(236, 72, 153, 0.24);
  border-bottom-color: rgba(236, 72, 153, 0.4);
  border-radius: 0;
  background:
    linear-gradient(180deg, rgba(236, 72, 153, 0.08), rgba(15, 23, 42, 0.46)),
    rgba(15, 23, 42, 0.72);
  backdrop-filter: blur(16px);
  box-shadow: inset 0 -1px 0 rgba(236, 72, 153, 0.16);
  overflow: hidden;
}

.soshix-flux-view-tabs button {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 100%;
  min-width: 0;
  min-height: 42px;
  border-radius: 0;
  color: #fbcfe8;
  font-size: 14px;
  font-weight: 800;
  padding: 9px 12px 11px;
  text-align: center;
  white-space: nowrap;
}

.soshix-flux-view-tabs button + button {
  border-left: 1px solid rgba(236, 72, 153, 0.18);
}

.soshix-flux-view-tabs button::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 3px;
  background: transparent;
  transition:
    background 0.16s ease,
    box-shadow 0.16s ease;
}

.soshix-flux-view-tabs button:hover,
.soshix-flux-view-tabs button:focus-visible {
  background: rgba(236, 72, 153, 0.12);
  color: #fdf2f8;
}

.soshix-flux-view-tabs button.is-active {
  background:
    linear-gradient(180deg, rgba(236, 72, 153, 0.18), rgba(250, 204, 21, 0.08)),
    rgba(15, 23, 42, 0.72);
  box-shadow: none;
  color: #fff;
}

.soshix-flux-view-tabs button.is-active::after {
  background: linear-gradient(90deg, #f472b6, #ec4899);
  box-shadow: 0 0 16px rgba(236, 72, 153, 0.44);
}

.soshix-flux-action {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid rgba(250, 204, 21, 0.38);
  border-radius: 999px;
  background: linear-gradient(135deg, #facc15, #ec4899);
  box-shadow: 0 10px 24px rgba(250, 204, 21, 0.16);
  color: #111827;
  cursor: pointer;
  font: inherit;
  font-size: 14px;
  font-weight: 900;
  padding: 7px 14px;
  transition:
    border-color 0.16s ease,
    box-shadow 0.16s ease,
    transform 0.16s ease;
}

.soshix-flux-action i {
  color: #111827;
  font-size: 15px;
}

.soshix-flux-action:hover,
.soshix-flux-action:focus-visible {
  border-color: rgba(255, 255, 255, 0.36);
  box-shadow: 0 12px 28px rgba(236, 72, 153, 0.24);
  outline: none;
  transform: translateY(-1px);
}

body.soshix-flux-upload-open {
  overflow: hidden;
}

.soshix-flux-upload-modal {
  position: fixed;
  inset: 0;
  z-index: 5000;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.soshix-flux-upload-modal.is-open {
  display: flex;
}

.soshix-flux-upload-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(2, 6, 23, 0.76);
  backdrop-filter: blur(12px);
}

.soshix-flux-upload-dialog {
  position: relative;
  z-index: 1;
  width: min(1120px, 96vw);
  height: min(820px, 92vh);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid rgba(250, 204, 21, 0.22);
  border-radius: 16px;
  background: #020617;
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.48);
}

.soshix-flux-upload-header {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 50px;
  padding: 10px 14px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.14);
  background:
    linear-gradient(135deg, rgba(250, 204, 21, 0.12), rgba(236, 72, 153, 0.08)),
    #0f172a;
  color: #f8fafc;
}

.soshix-flux-upload-header strong {
  font-size: 15px;
  font-weight: 900;
}

.soshix-flux-upload-header button {
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 50%;
  background: rgba(15, 23, 42, 0.78);
  color: #e5e7eb;
  cursor: pointer;
  transition:
    background 0.16s ease,
    border-color 0.16s ease,
    color 0.16s ease,
    transform 0.16s ease;
}

.soshix-flux-upload-header button:hover,
.soshix-flux-upload-header button:focus-visible {
  border-color: rgba(250, 204, 21, 0.42);
  background: rgba(250, 204, 21, 0.14);
  color: #fff;
  outline: none;
  transform: translateY(-1px);
}

.soshix-flux-upload-dialog iframe {
  flex: 1 1 auto;
  width: 100%;
  min-height: 0;
  border: 0;
  background: #020617;
}

.platform-preview-card {
  display: grid;
  gap: 10px;
  overflow: hidden;
  border: 1px solid rgba(148, 163, 184, 0.12);
}

.platform-preview-card > span {
  width: fit-content;
  border-radius: 999px;
  background: rgba(59, 130, 246, 0.14);
  color: #bfdbfe;
  font-size: 12px;
  font-weight: 800;
  padding: 4px 9px;
}

.platform-preview-card strong {
  color: #f8fafc;
  font-size: 17px;
}

.platform-preview-card p {
  margin: 0;
  color: #cbd5e1;
  font-size: 14px;
  line-height: 1.45;
}

.aura-preview {
  background:
    radial-gradient(circle at 16% 0%, rgba(236, 72, 153, 0.18), transparent 34%),
    #0f172a;
}

.vox-preview {
  background:
    radial-gradient(circle at 16% 0%, rgba(29, 155, 240, 0.18), transparent 34%),
    #0f172a;
}

.canvas-preview {
  background:
    radial-gradient(circle at 16% 0%, rgba(239, 68, 68, 0.18), transparent 34%),
    #0f172a;
}

.flux-preview {
  background:
    radial-gradient(circle at 16% 0%, rgba(250, 204, 21, 0.16), transparent 34%),
    #0f172a;
}

.soshix-canvas-feed {
  display: grid;
  gap: 12px;
}

.soshix-canvas-feed[hidden] {
  display: none !important;
}

.soshix-canvas-video-card {
  display: grid;
  grid-template-columns: minmax(160px, 220px) minmax(0, 1fr);
  gap: 12px;
  border: 1px solid rgba(239, 68, 68, 0.14);
  background:
    radial-gradient(circle at 10% -10%, rgba(239, 68, 68, 0.16), transparent 34%),
    #0f172a;
}

[data-soshix-feed-panel="canvas"] .soshix-canvas-video-card {
  position: relative;
}

.soshix-canvas-thumb {
  position: relative;
  display: block;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: 8px;
  background: #020617;
  color: #fff;
  text-decoration: none;
}

.soshix-canvas-thumb img,
.soshix-canvas-thumb-placeholder {
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  object-fit: cover;
}

.soshix-canvas-thumb-placeholder {
  background:
    linear-gradient(135deg, rgba(239, 68, 68, 0.34), rgba(15, 23, 42, 0.82)),
    #020617;
  font-size: 34px;
}

.soshix-canvas-play {
  position: absolute;
  inset: 50% auto auto 50%;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(2, 6, 23, 0.72);
  color: #fff;
  transform: translate(-50%, -50%);
  transition:
    background 0.15s ease,
    transform 0.15s ease;
}

.soshix-canvas-thumb:hover .soshix-canvas-play {
  background: rgba(239, 68, 68, 0.9);
  transform: translate(-50%, -50%) scale(1.06);
}

.soshix-canvas-video-meta {
  min-width: 0;
  display: grid;
  align-content: center;
  gap: 6px;
}

.soshix-canvas-title {
  justify-self: start;
  width: fit-content;
  max-width: 100%;
  color: #f8fafc;
  font-size: 16px;
  font-weight: 850;
  line-height: 1.3;
  text-decoration: none;
}

.soshix-canvas-title:hover,
.soshix-canvas-channel:hover {
  text-decoration: underline;
}

.soshix-canvas-channel {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  width: fit-content;
  max-width: 100%;
  overflow: hidden;
  color: #cbd5e1;
  font-size: 14px;
  font-weight: 750;
  text-decoration: none;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.soshix-canvas-channel-avatar {
  width: 22px;
  height: 22px;
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  overflow: hidden;
  border-radius: 50%;
  background: linear-gradient(135deg, #ef4444, #7c3aed);
  color: #fff;
  font-size: 11px;
  font-weight: 850;
}

.soshix-canvas-channel-avatar img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.soshix-canvas-video-meta span {
  color: #94a3b8;
  font-size: 13px;
  font-weight: 700;
}

.soshix-canvas-actions {
  grid-column: 2;
  display: flex;
  align-items: center;
  gap: 18px;
  justify-content: flex-start;
  margin-top: 8px;
}

.soshix-canvas-actions .vox-action {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  padding: 7px 9px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #94a3b8;
  cursor: default;
  font: inherit;
  font-size: 13px;
  font-weight: 750;
  line-height: 1;
  transition:
    background 0.18s ease,
    color 0.18s ease,
    transform 0.18s ease;
  transform-origin: center;
}

.soshix-canvas-actions .vox-action i {
  transition: transform 0.18s ease;
}

.soshix-canvas-actions .vox-action:hover {
  transform: translateY(-1px);
}

.soshix-canvas-actions .vox-action:hover i {
  transform: scale(1.12);
}

.soshix-canvas-actions .vox-action-like:hover,
.soshix-canvas-actions .vox-action-like.is-active {
  background: rgba(244, 63, 94, 0.1);
  color: #f43f5e;
}

.soshix-canvas-actions .vox-action-views {
  cursor: default;
}

.soshix-canvas-actions .vox-action-views:hover {
  background: rgba(29, 155, 240, 0.1);
  color: #38bdf8;
}

.pulse-canvas-item > .soshix-canvas-video-card {
  position: relative;
  display: flex;
  flex-direction: column;
  grid-template-columns: minmax(0, 1fr);
  gap: 11px;
  margin-bottom: 12px;
  padding: 14px;
  border-color: rgba(239, 68, 68, 0.24);
  background:
    radial-gradient(circle at 50% 0%, rgba(239, 68, 68, 0.16), transparent 42%),
    linear-gradient(180deg, rgba(15, 23, 42, 0.96), rgba(2, 6, 23, 0.94));
}

.pulse-canvas-item .soshix-pulse-canvas-menu-shell,
[data-soshix-feed-panel="canvas"] .soshix-canvas-video-card .soshix-pulse-canvas-menu-shell {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 12;
}

.pulse-canvas-item .soshix-pulse-canvas-menu,
[data-soshix-feed-panel="canvas"] .soshix-canvas-video-card .soshix-pulse-canvas-menu {
  width: 34px;
  height: 34px;
  display: inline-grid;
  place-items: center;
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.76);
  color: #cbd5e1;
  cursor: pointer;
  font: inherit;
  font-size: 20px;
  line-height: 1;
  padding: 0;
  transition:
    background 0.18s ease,
    border-color 0.18s ease,
    color 0.18s ease;
}

.pulse-canvas-item .soshix-pulse-canvas-menu:hover,
.pulse-canvas-item .soshix-pulse-canvas-menu:focus-visible,
[data-soshix-feed-panel="canvas"] .soshix-canvas-video-card .soshix-pulse-canvas-menu:hover,
[data-soshix-feed-panel="canvas"] .soshix-canvas-video-card .soshix-pulse-canvas-menu:focus-visible {
  border-color: rgba(239, 68, 68, 0.38);
  background: rgba(30, 41, 59, 0.92);
  color: #fff;
  outline: none;
}

.pulse-canvas-item .soshix-pulse-canvas-menu-dropdown,
[data-soshix-feed-panel="canvas"] .soshix-canvas-video-card .soshix-pulse-canvas-menu-dropdown {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 13;
  min-width: 150px;
  overflow: hidden;
  border: 1px solid rgba(148, 163, 184, 0.16);
  border-radius: 8px;
  background: #020617;
  box-shadow: 0 18px 36px rgba(2, 6, 23, 0.36);
}

.pulse-canvas-item .soshix-pulse-canvas-menu-dropdown[hidden],
[data-soshix-feed-panel="canvas"] .soshix-canvas-video-card .soshix-pulse-canvas-menu-dropdown[hidden] {
  display: none !important;
}

.pulse-canvas-item .soshix-pulse-canvas-menu-dropdown button,
[data-soshix-feed-panel="canvas"] .soshix-canvas-video-card .soshix-pulse-canvas-menu-dropdown button {
  width: 100%;
  display: block;
  padding: 10px 12px;
  border: 0;
  background: transparent;
  color: #e5e7eb;
  cursor: pointer;
  font: inherit;
  font-size: 14px;
  font-weight: 750;
  text-align: left;
}

.pulse-canvas-item .soshix-pulse-canvas-menu-dropdown button:hover,
.pulse-canvas-item .soshix-pulse-canvas-menu-dropdown button:focus-visible,
[data-soshix-feed-panel="canvas"] .soshix-canvas-video-card .soshix-pulse-canvas-menu-dropdown button:hover,
[data-soshix-feed-panel="canvas"] .soshix-canvas-video-card .soshix-pulse-canvas-menu-dropdown button:focus-visible {
  background: #1e293b;
  outline: none;
}

.pulse-canvas-item .soshix-pulse-canvas-menu-dropdown button.is-danger,
[data-soshix-feed-panel="canvas"] .soshix-canvas-video-card .soshix-pulse-canvas-menu-dropdown button.is-danger {
  color: #ef4444;
}

.pulse-canvas-item .soshix-canvas-thumb {
  order: 3;
  width: 100%;
  align-self: stretch;
  aspect-ratio: 16 / 9;
  border: 1px solid rgba(239, 68, 68, 0.2);
  border-radius: 10px;
  box-shadow: 0 18px 42px rgba(2, 6, 23, 0.32);
}

.pulse-canvas-item .soshix-canvas-thumb video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
  background: #020617;
}

.pulse-canvas-item .soshix-canvas-thumb.is-inline-playing img,
.pulse-canvas-item .soshix-canvas-thumb.is-inline-playing .soshix-canvas-thumb-placeholder,
.pulse-canvas-item .soshix-canvas-thumb.is-inline-playing .soshix-canvas-play {
  display: none;
}

.pulse-canvas-item .soshix-canvas-play {
  width: 54px;
  height: 54px;
  font-size: 22px;
}

.pulse-canvas-item .soshix-canvas-video-meta {
  display: contents;
}

.pulse-canvas-item .soshix-canvas-title {
  order: 1;
  display: inline-block;
  max-width: calc(100% - 48px);
  font-size: 18px;
  line-height: 1.28;
}

.pulse-canvas-item .soshix-canvas-channel {
  order: 2;
  color: #f8fafc;
}

.pulse-canvas-item .soshix-canvas-channel-text {
  min-width: 0;
}

.pulse-canvas-item .soshix-canvas-channel-name,
.pulse-canvas-item .soshix-canvas-channel-time {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pulse-canvas-item .soshix-canvas-channel-avatar {
  width: 30px;
  height: 30px;
  box-shadow: 0 0 0 2px rgba(239, 68, 68, 0.16);
}

.pulse-canvas-item .soshix-canvas-video-meta > span {
  order: 4;
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  padding: 5px 9px;
  border-radius: 999px;
  background: rgba(239, 68, 68, 0.1);
  color: #cbd5e1;
}

.pulse-canvas-item .soshix-canvas-actions {
  order: 5;
  width: 100%;
  justify-content: flex-start;
}

.soshix-flux-feed {
  display: grid;
  gap: 12px;
}

.soshix-flux-feed[hidden] {
  display: none !important;
}

.soshix-flux-clip-card {
  display: grid;
  grid-template-columns: minmax(130px, 180px) minmax(0, 1fr);
  gap: 12px;
  border: 1px solid rgba(250, 204, 21, 0.14);
  background:
    radial-gradient(circle at 10% -10%, rgba(250, 204, 21, 0.14), transparent 34%),
    #0f172a;
}

.soshix-flux-video {
  position: relative;
  display: block;
  aspect-ratio: 9 / 16;
  max-height: 320px;
  overflow: hidden;
  border-radius: 8px;
  background: #020617;
  color: #fff;
  text-decoration: none;
}

.soshix-flux-video video,
.soshix-flux-video > span:first-child {
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  object-fit: cover;
}

.soshix-flux-video > span:first-child {
  background: linear-gradient(135deg, rgba(250, 204, 21, 0.28), rgba(236, 72, 153, 0.32)), #020617;
  font-size: 34px;
}

.soshix-flux-play {
  position: absolute;
  inset: 50% auto auto 50%;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(2, 6, 23, 0.72);
  color: #fff;
  transform: translate(-50%, -50%);
  transition:
    background 0.15s ease,
    transform 0.15s ease;
}

.soshix-flux-mute,
.soshix-flux-menu {
  display: none;
}

.soshix-flux-video:hover .soshix-flux-play {
  background: rgba(236, 72, 153, 0.9);
  transform: translate(-50%, -50%) scale(1.06);
}

.pulse-flux-item .is-pulse-flux-fullscreen .soshix-flux-mute,
.pulse-flux-item .is-pulse-flux-fullscreen .flux-mute-action {
  display: none;
}

.pulse-flux-item .is-pulse-flux-fullscreen .pulse-flux-fullscreen-close {
  position: absolute;
  top: max(14px, env(safe-area-inset-top));
  right: max(14px, env(safe-area-inset-right));
  z-index: 20;
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.24);
  border-radius: 999px;
  background: rgba(2, 6, 23, 0.72);
  color: #ffffff;
  cursor: pointer;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.32);
}

.pulse-flux-item .is-pulse-flux-fullscreen .pulse-flux-fullscreen-close:hover,
.pulse-flux-item .is-pulse-flux-fullscreen .pulse-flux-fullscreen-close:focus-visible {
  background: rgba(15, 23, 42, 0.92);
  border-color: rgba(255, 255, 255, 0.42);
}

.pulse-flux-item .is-pulse-flux-fullscreen .pulse-flux-fullscreen-close[hidden] {
  display: none;
}

.pulse-flux-item .is-pulse-flux-fullscreen:fullscreen,
.pulse-flux-item .is-pulse-flux-fullscreen:-webkit-full-screen {
  --pulse-flux-viewer-aspect-ratio: 0.5625;
  --pulse-flux-viewer-max-width: 520px;
  --pulse-flux-viewer-caption-offset: 0px;
  --pulse-flux-viewer-column-width: min(calc(100vw - 36px), calc((100vh - 190px) * var(--pulse-flux-viewer-aspect-ratio)), var(--pulse-flux-viewer-max-width));
  --pulse-flux-viewer-video-height: calc(var(--pulse-flux-viewer-column-width) / var(--pulse-flux-viewer-aspect-ratio));
  width: 100vw;
  height: 100vh;
  max-height: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0;
  border-radius: 0;
  background: #000000;
  overflow: hidden;
}

.pulse-flux-item .is-pulse-flux-fullscreen:fullscreen video,
.pulse-flux-item .is-pulse-flux-fullscreen:-webkit-full-screen video {
  position: relative;
  inset: auto;
  width: var(--pulse-flux-viewer-column-width);
  max-width: calc(100vw - 36px);
  height: var(--pulse-flux-viewer-video-height);
  max-height: 100%;
  align-self: center;
  object-fit: contain;
  min-height: 0;
}

.pulse-flux-item .is-pulse-flux-fullscreen:fullscreen .flux-caption,
.pulse-flux-item .is-pulse-flux-fullscreen:-webkit-full-screen .flux-caption {
  position: relative;
  left: auto;
  right: auto;
  bottom: auto;
  z-index: 4;
  width: var(--pulse-flux-viewer-column-width);
  max-width: calc(100vw - 36px);
  max-height: min(26vh, 190px);
  overflow-y: auto;
  margin: 0;
  padding: 14px;
  border-radius: 0;
  background: linear-gradient(180deg, rgba(2, 6, 23, 0.88), rgba(2, 6, 23, 0.96));
  opacity: 1;
  transform: none;
}

.pulse-flux-item .is-pulse-flux-fullscreen:fullscreen .flux-video-glow,
.pulse-flux-item .is-pulse-flux-fullscreen:-webkit-full-screen .flux-video-glow {
  display: none;
}

.pulse-flux-item .is-pulse-flux-fullscreen:fullscreen .flux-creator,
.pulse-flux-item .is-pulse-flux-fullscreen:-webkit-full-screen .flux-creator {
  max-width: 100%;
}

.pulse-flux-item .is-pulse-flux-fullscreen:fullscreen .flux-caption p,
.pulse-flux-item .is-pulse-flux-fullscreen:-webkit-full-screen .flux-caption p {
  margin: 0;
  overflow-wrap: anywhere;
}

@media (hover: hover) and (pointer: fine) and (min-width: 901px) {
  .pulse-flux-item .is-pulse-flux-fullscreen:fullscreen .soshix-flux-stats.flux-actions,
  .pulse-flux-item .is-pulse-flux-fullscreen:-webkit-full-screen .soshix-flux-stats.flux-actions {
    position: absolute;
    top: calc(50vh - var(--pulse-flux-viewer-caption-offset));
    right: max(16px, calc((100vw - var(--pulse-flux-viewer-column-width)) / 2 + 12px), env(safe-area-inset-right));
    z-index: 12;
    display: grid;
    grid-auto-flow: row;
    gap: 12px;
    justify-items: center;
    align-self: auto;
    justify-self: auto;
    padding: 0;
    opacity: 0;
    pointer-events: none;
    transform: translate(8px, -50%);
    transition:
      opacity 180ms ease,
      transform 180ms ease;
  }

  .pulse-flux-item .is-pulse-flux-fullscreen:fullscreen .soshix-flux-mute.flux-mute-action,
  .pulse-flux-item .is-pulse-flux-fullscreen:-webkit-full-screen .soshix-flux-mute.flux-mute-action {
    top: max(16px, env(safe-area-inset-top));
    right: max(16px, calc((100vw - var(--pulse-flux-viewer-column-width)) / 2 + 12px), env(safe-area-inset-right));
    z-index: 13;
    display: grid;
    opacity: 0;
    pointer-events: none;
    transform: translateY(-8px);
    transition:
      opacity 180ms ease,
      transform 180ms ease;
  }

  .pulse-flux-item .is-pulse-flux-fullscreen:fullscreen:hover .soshix-flux-stats.flux-actions,
  .pulse-flux-item .is-pulse-flux-fullscreen:fullscreen:focus-within .soshix-flux-stats.flux-actions,
  .pulse-flux-item .is-pulse-flux-fullscreen:-webkit-full-screen:hover .soshix-flux-stats.flux-actions,
  .pulse-flux-item .is-pulse-flux-fullscreen:-webkit-full-screen:focus-within .soshix-flux-stats.flux-actions {
    opacity: 1;
    pointer-events: auto;
    transform: translate(0, -50%);
  }

  .pulse-flux-item .is-pulse-flux-fullscreen:fullscreen:hover .soshix-flux-mute.flux-mute-action,
  .pulse-flux-item .is-pulse-flux-fullscreen:fullscreen:focus-within .soshix-flux-mute.flux-mute-action,
  .pulse-flux-item .is-pulse-flux-fullscreen:-webkit-full-screen:hover .soshix-flux-mute.flux-mute-action,
  .pulse-flux-item .is-pulse-flux-fullscreen:-webkit-full-screen:focus-within .soshix-flux-mute.flux-mute-action {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
  }

  .pulse-flux-item .is-pulse-flux-fullscreen:fullscreen .soshix-flux-stats > span,
  .pulse-flux-item .is-pulse-flux-fullscreen:fullscreen .soshix-flux-stats .soshix-flux-action-count,
  .pulse-flux-item .is-pulse-flux-fullscreen:fullscreen .soshix-flux-stats .soshix-flux-mobile-action,
  .pulse-flux-item .is-pulse-flux-fullscreen:-webkit-full-screen .soshix-flux-stats > span,
  .pulse-flux-item .is-pulse-flux-fullscreen:-webkit-full-screen .soshix-flux-stats .soshix-flux-action-count,
  .pulse-flux-item .is-pulse-flux-fullscreen:-webkit-full-screen .soshix-flux-stats .soshix-flux-mobile-action {
    min-width: 56px;
    min-height: 58px;
    display: grid;
    justify-items: center;
    gap: 5px;
    color: #f8fafc;
    text-decoration: none;
  }
}

@media (max-width: 900px) {
  .pulse-flux-item .is-pulse-flux-fullscreen:fullscreen .flux-caption,
  .pulse-flux-item .is-pulse-flux-fullscreen:-webkit-full-screen .flux-caption {
    max-height: min(30dvh, 170px);
    padding-block: 12px max(12px, env(safe-area-inset-bottom));
  }

  .pulse-flux-item .is-pulse-flux-fullscreen:fullscreen,
  .pulse-flux-item .is-pulse-flux-fullscreen:-webkit-full-screen {
    --pulse-flux-viewer-column-width: min(calc(100vw - 24px), calc((100dvh - 170px) * var(--pulse-flux-viewer-aspect-ratio)), var(--pulse-flux-viewer-max-width));
    --pulse-flux-viewer-video-height: calc(var(--pulse-flux-viewer-column-width) / var(--pulse-flux-viewer-aspect-ratio));
  }
}

@media (max-height: 520px) and (orientation: landscape) {
  .pulse-flux-item .is-pulse-flux-fullscreen:fullscreen,
  .pulse-flux-item .is-pulse-flux-fullscreen:-webkit-full-screen {
    --pulse-flux-viewer-column-width: min(calc(100vw - 32px), calc((100vh - 118px) * var(--pulse-flux-viewer-aspect-ratio)), var(--pulse-flux-viewer-max-width));
    --pulse-flux-viewer-video-height: calc(var(--pulse-flux-viewer-column-width) / var(--pulse-flux-viewer-aspect-ratio));
  }

  .pulse-flux-item .is-pulse-flux-fullscreen:fullscreen .flux-caption,
  .pulse-flux-item .is-pulse-flux-fullscreen:-webkit-full-screen .flux-caption {
    max-height: 34vh;
    gap: 6px;
    padding-block: 9px max(9px, env(safe-area-inset-bottom));
  }
}

.soshix-flux-info {
  min-width: 0;
  display: grid;
  align-content: center;
  gap: 8px;
}

.soshix-flux-meta {
  display: contents;
}

.soshix-flux-creator {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  width: fit-content;
  max-width: 100%;
  color: #f8fafc;
  text-decoration: none;
}

@media (min-width: 901px) {
  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-feed:not([hidden]) {
    width: 100%;
    max-width: none;
    margin-inline: 0;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-clip-card {
    position: relative;
    width: 100%;
    max-width: none;
    grid-template-columns: minmax(0, 1fr) 72px;
    align-items: center;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-video {
    width: 100%;
    max-width: none;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-play {
    opacity: 0;
    pointer-events: none;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-video.is-paused .soshix-flux-play {
    opacity: 1;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-meta {
    position: absolute;
    left: 12px;
    right: 12px;
    bottom: 12px;
    z-index: 4;
    display: grid;
    gap: 6px;
    padding: 10px;
    border-radius: 12px;
    background: linear-gradient(180deg, rgba(2, 6, 23, 0.08), rgba(2, 6, 23, 0.62));
    color: #fff;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-meta .soshix-flux-creator {
    width: 100%;
    min-width: 0;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-meta .soshix-flux-creator > span:last-child {
    width: auto !important;
    height: auto !important;
    min-width: 0;
    display: grid;
    gap: 2px;
    place-items: initial !important;
    overflow: hidden;
    border-radius: 0 !important;
    background: transparent !important;
    color: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-meta p {
    display: -webkit-box;
    max-height: 3.9em;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-mute.flux-mute-action {
    top: 16px;
    right: 16px;
    display: grid;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-mute.flux-mute-action > span {
    display: none;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-mute.flux-mute-action::before,
  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-mute.flux-mute-action::after {
    display: none;
    content: none;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-video video::-webkit-media-controls-mute-button,
  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-video video::-webkit-media-controls-volume-slider,
  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-video video::-webkit-media-controls-volume-control-container {
    display: none !important;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-pause-indicator {
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 6;
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    background: rgba(2, 6, 23, 0.68);
    color: #fff;
    font-size: 22px;
    font-weight: 900;
    letter-spacing: 1px;
    opacity: 0;
    pointer-events: none;
    transform: translate(-50%, -50%) scale(0.92);
    transition: opacity 180ms ease, transform 180ms ease;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-pause-indicator.is-visible {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-menu {
    display: none !important;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-info.flux-caption {
    position: static;
    inset: auto;
    z-index: auto;
    display: grid;
    align-content: center;
    justify-items: center;
    padding: 0;
    background: transparent;
    opacity: 1;
    transform: none;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats.flux-actions {
    position: relative;
    inset: auto;
    z-index: 5;
    display: grid;
    grid-auto-flow: row;
    gap: 12px;
    justify-items: center;
    align-self: center;
    justify-self: center;
    padding: 0;
    opacity: 1;
    pointer-events: auto;
    transform: none;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats > span,
  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .soshix-flux-action-count,
  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .soshix-flux-mobile-action {
    min-width: 56px;
    min-height: 58px;
    display: grid;
    justify-items: center;
    gap: 5px;
    color: #f8fafc;
    text-decoration: none;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .soshix-flux-state-icon-inactive {
    display: grid !important;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .soshix-flux-state-icon-active {
    display: none !important;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .is-liked .soshix-flux-state-icon-inactive,
  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .is-commented .soshix-flux-state-icon-inactive,
  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .is-shared .soshix-flux-state-icon-inactive,
  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .is-dueted .soshix-flux-state-icon-inactive,
  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .is-saved .soshix-flux-state-icon-inactive {
    display: none !important;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .is-liked .soshix-flux-state-icon-active,
  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .is-commented .soshix-flux-state-icon-active,
  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .is-shared .soshix-flux-state-icon-active,
  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .is-dueted .soshix-flux-state-icon-active,
  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .is-saved .soshix-flux-state-icon-active {
    display: grid !important;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .soshix-flux-like.is-liked {
    color: #fb7185;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .soshix-flux-like.is-liked i {
    background: rgba(244, 63, 94, 0.18);
    color: #fb7185;
    box-shadow: 0 0 0 1px rgba(244, 63, 94, 0.28), 0 12px 28px rgba(244, 63, 94, 0.2);
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .soshix-flux-comment.is-commented,
  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .soshix-flux-share.is-shared,
  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .soshix-flux-duet.is-dueted {
    color: #fb7185;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .soshix-flux-comment.is-commented i,
  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .soshix-flux-share.is-shared i,
  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .soshix-flux-duet.is-dueted i {
    background: rgba(244, 63, 94, 0.18);
    color: #fb7185;
    box-shadow: 0 0 0 1px rgba(244, 63, 94, 0.28), 0 12px 28px rgba(244, 63, 94, 0.2);
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .soshix-flux-save.is-saved {
    color: #a78bfa;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .soshix-flux-save.is-saved i {
    background: rgba(139, 92, 246, 0.18);
    color: #c4b5fd;
    box-shadow: 0 0 0 1px rgba(139, 92, 246, 0.28), 0 12px 28px rgba(139, 92, 246, 0.18);
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-mobile-action {
    display: grid;
  }
}

.soshix-flux-avatar {
  width: 34px;
  height: 34px;
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  overflow: hidden;
  border-radius: 50%;
  background: linear-gradient(135deg, #facc15, #ec4899);
  color: #111827;
  font-size: 13px;
  font-weight: 900;
}

.soshix-flux-avatar img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.soshix-flux-creator strong,
.soshix-flux-creator em {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.soshix-flux-creator strong {
  font-size: 15px;
}

.soshix-flux-creator em {
  color: #94a3b8;
  font-size: 13px;
  font-style: normal;
}

.soshix-flux-info p {
  margin: 0;
  color: #e5e7eb;
  font-size: 14px;
  line-height: 1.45;
}

.soshix-flux-info p a,
.soshix-flux-sound a {
  color: #fde68a;
  text-decoration: none;
}

.soshix-flux-info p a:hover,
.soshix-flux-sound a:hover,
.soshix-flux-creator:hover {
  text-decoration: underline;
}

.soshix-flux-sound {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: fit-content;
  max-width: 100%;
  overflow: hidden;
  color: #cbd5e1;
  font-size: 13px;
  font-weight: 750;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.soshix-flux-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  color: #94a3b8;
  font-size: 13px;
  font-weight: 800;
}

.soshix-flux-stats span,
.soshix-flux-action-count {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.soshix-flux-action-count {
  border: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
  font: inherit;
  padding: 0;
}

.soshix-flux-state-icon-inactive {
  display: none !important;
}

.soshix-flux-stats i {
  color: #f472b6;
}

.soshix-flux-mobile-action {
  display: none;
}

.platform-photo-grid {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr 0.8fr;
  gap: 8px;
  min-height: 150px;
}

.platform-photo-grid i,
.platform-video-frame,
.platform-short-frame {
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: rgba(2, 6, 23, 0.72);
}

.platform-photo-grid i:first-child {
  background: linear-gradient(135deg, rgba(236, 72, 153, 0.5), rgba(59, 130, 246, 0.38));
}

.platform-photo-grid i:nth-child(2) {
  background: linear-gradient(135deg, rgba(249, 115, 22, 0.48), rgba(236, 72, 153, 0.32));
}

.platform-photo-grid i:nth-child(3) {
  background: linear-gradient(135deg, rgba(20, 184, 166, 0.42), rgba(59, 130, 246, 0.34));
}

.platform-video-frame {
  min-height: 170px;
  color: #fecaca;
  font-size: 42px;
}

.platform-short-frame {
  width: min(210px, 100%);
  min-height: 260px;
  justify-self: center;
  color: #fde68a;
  font-size: 38px;
}

.feed-loading,
.feed-empty-state {
  color: #94a3b8;
  text-align: center;
}

.feed-loading {
  padding: 18px;
}

.feed-empty-state {
  display: grid;
  gap: 4px;
}

.feed-empty-state strong {
  color: #e5e7eb;
}

.soshix-aura-feed {
  display: grid;
  gap: 12px;
}

.soshix-aura-feed[hidden] {
  display: none !important;
}

.feed-filter-panel[data-soshix-feed-panel="soshix"] .feed-posts > .post-card {
  position: relative;
  border: 1px solid rgba(34, 197, 94, 0.18);
  border-radius: 12px;
  background:
    radial-gradient(circle at 14% 0%, rgba(34, 197, 94, 0.15), transparent 34%),
    linear-gradient(180deg, rgba(15, 23, 42, 0.96), rgba(2, 6, 23, 0.94));
  box-shadow: 0 14px 34px rgba(2, 6, 23, 0.24);
}

.feed-filter-panel[data-soshix-feed-panel="soshix"] .feed-posts > .post-card::before {
  display: none;
}

.feed-filter-panel[data-soshix-feed-panel="soshix"] .feed-posts > .post-card::after {
  content: "";
  position: absolute;
  top: 12px;
  bottom: 12px;
  left: 0;
  width: 3px;
  border-radius: 999px;
  background: #22c55e;
  opacity: 0.92;
  pointer-events: none;
}

.feed-filter-panel[data-soshix-feed-panel="soshix"] .feed-posts > .post-card:hover {
  border-color: rgba(34, 197, 94, 0.32);
  background:
    radial-gradient(circle at 14% 0%, rgba(34, 197, 94, 0.2), transparent 34%),
    linear-gradient(180deg, rgba(15, 23, 42, 0.98), rgba(2, 6, 23, 0.96));
  box-shadow:
    inset 3px 0 0 rgba(34, 197, 94, 0.54),
    0 16px 38px rgba(2, 6, 23, 0.28);
}

.soshix-vox-feed[hidden] {
  display: none !important;
}

.soshix-vox-feed > .vox-post-card {
  position: relative;
  margin-bottom: 12px;
  overflow: hidden;
  border: 1px solid rgba(29, 155, 240, 0.18);
  border-radius: 12px;
  background:
    radial-gradient(circle at 14% 0%, rgba(29, 155, 240, 0.15), transparent 34%),
    linear-gradient(180deg, rgba(15, 23, 42, 0.96), rgba(2, 6, 23, 0.94));
  box-shadow: 0 14px 34px rgba(2, 6, 23, 0.24);
}

.soshix-vox-feed > .vox-post-card::before {
  display: none;
}

.soshix-vox-feed > .vox-post-card::after {
  content: "";
  position: absolute;
  top: 12px;
  bottom: 12px;
  left: 0;
  width: 3px;
  border-radius: 999px;
  background: #1d9bf0;
  opacity: 0.92;
  pointer-events: none;
}

.soshix-vox-feed > .vox-post-card:hover {
  border-color: rgba(29, 155, 240, 0.32);
  background:
    radial-gradient(circle at 14% 0%, rgba(29, 155, 240, 0.2), transparent 34%),
    linear-gradient(180deg, rgba(15, 23, 42, 0.98), rgba(2, 6, 23, 0.96));
  box-shadow:
    inset 3px 0 0 rgba(29, 155, 240, 0.54),
    0 16px 38px rgba(2, 6, 23, 0.28);
}

.soshix-vox-feed > .vox-post-card.has-open-menu {
  overflow: visible;
  z-index: 120;
}

.soshix-aura-card {
  position: relative;
  display: grid;
  gap: 12px;
  overflow: hidden;
  border: 1px solid rgba(236, 72, 153, 0.16);
  border-radius: 12px;
  background:
    radial-gradient(circle at 14% 0%, rgba(168, 85, 247, 0.16), transparent 34%),
    linear-gradient(180deg, rgba(15, 23, 42, 0.96), rgba(2, 6, 23, 0.94));
  box-shadow: 0 14px 34px rgba(2, 6, 23, 0.24);
}

.soshix-aura-feed > .soshix-aura-card::before {
  display: none;
}

.soshix-aura-feed > .soshix-aura-card::after {
  content: "";
  position: absolute;
  top: 12px;
  bottom: 12px;
  left: 0;
  width: 3px;
  border-radius: 999px;
  background: #a855f7;
  opacity: 0.92;
  pointer-events: none;
}

.soshix-aura-feed > .soshix-aura-card:hover {
  border-color: rgba(168, 85, 247, 0.34);
  background:
    radial-gradient(circle at 14% 0%, rgba(168, 85, 247, 0.22), transparent 34%),
    linear-gradient(180deg, rgba(15, 23, 42, 0.98), rgba(2, 6, 23, 0.96));
  box-shadow:
    inset 3px 0 0 rgba(168, 85, 247, 0.54),
    0 16px 38px rgba(2, 6, 23, 0.28);
}

.soshix-aura-card-header {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
}

.pulse-aura-item .soshix-aura-card-header {
  grid-template-columns: auto minmax(0, 1fr) auto auto;
}

.pulse-aura-item .soshix-pulse-aura-menu,
[data-soshix-feed-panel="aura"] .soshix-aura-card .soshix-pulse-aura-menu,
.pulse-soshix-item .post-menu .soshix-pulse-aura-menu,
body.soshix-feed-body .feed-page .post-card:not(.pulse-soshix-item) .post-menu .soshix-pulse-aura-menu,
.pulse-vox-item .vox-post-menu > .soshix-pulse-aura-menu,
[data-soshix-feed-panel="vox"] .vox-post-card .vox-post-menu > .soshix-pulse-aura-menu,
.pulse-flux-item .soshix-pulse-aura-menu,
[data-soshix-feed-panel="flux"] .soshix-flux-stats .soshix-pulse-aura-menu {
  width: 34px;
  height: 34px;
  box-sizing: border-box;
  display: inline-grid;
  place-items: center;
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.72);
  color: #cbd5e1;
  cursor: pointer;
  font: inherit;
  font-size: 20px;
  line-height: 1;
  padding: 0;
  text-decoration: none;
  transition:
    background 0.18s ease,
    border-color 0.18s ease,
    color 0.18s ease;
}

.pulse-soshix-item .post-menu {
  display: flex;
  align-items: center;
  margin-left: auto;
}

body.soshix-feed-body .feed-page .post-card:not(.pulse-soshix-item) .post-menu {
  display: flex;
  align-items: center;
  margin-left: auto;
}

.pulse-vox-item .vox-post-menu {
  position: relative;
  z-index: 20;
}

[data-soshix-feed-panel="vox"] .vox-post-card .vox-post-menu {
  position: relative;
  z-index: 20;
}

[data-soshix-feed-panel="vox"] .vox-post-card.has-open-menu .vox-post-menu {
  z-index: 121;
}

.pulse-flux-item > .soshix-pulse-flux-menu-shell {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 120;
}

.pulse-flux-item > .soshix-pulse-flux-menu-shell > .soshix-pulse-flux-menu {
  pointer-events: auto;
}

[data-soshix-feed-panel="flux"] .soshix-flux-stats .soshix-pulse-flux-menu-shell {
  position: relative;
  z-index: 24;
  display: inline-grid;
  place-items: center;
}

.pulse-aura-item .aura-post-header .soshix-pulse-aura-menu {
  flex: 0 0 auto;
  margin-left: auto;
}

.pulse-aura-item .soshix-pulse-aura-menu-shell {
  position: relative;
  z-index: 20;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: auto;
}

.feed-filter-panel[data-soshix-feed-panel="aura"] .soshix-aura-card .soshix-pulse-aura-menu-shell {
  position: relative;
  z-index: 20;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: auto;
}

.pulse-aura-item .soshix-pulse-aura-menu-dropdown {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 21;
  min-width: 150px;
  overflow: hidden;
  border: 1px solid rgba(148, 163, 184, 0.16);
  border-radius: 8px;
  background: #020617;
  box-shadow: 0 18px 36px rgba(2, 6, 23, 0.36);
}

.feed-filter-panel[data-soshix-feed-panel="aura"] .soshix-aura-card .soshix-pulse-aura-menu-dropdown {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 21;
  min-width: 150px;
  overflow: hidden;
  border: 1px solid rgba(148, 163, 184, 0.16);
  border-radius: 8px;
  background: #020617;
  box-shadow: 0 18px 36px rgba(2, 6, 23, 0.36);
}

.pulse-aura-item .soshix-pulse-aura-menu-dropdown[hidden] {
  display: none !important;
}

.feed-filter-panel[data-soshix-feed-panel="aura"] .soshix-aura-card .soshix-pulse-aura-menu-dropdown[hidden] {
  display: none !important;
}

.pulse-aura-item .soshix-pulse-aura-menu-dropdown button {
  width: 100%;
  display: block;
  padding: 10px 12px;
  border: 0;
  background: transparent;
  color: #e5e7eb;
  cursor: pointer;
  font: inherit;
  font-size: 14px;
  font-weight: 750;
  text-align: left;
}

.feed-filter-panel[data-soshix-feed-panel="aura"] .soshix-aura-card .soshix-pulse-aura-menu-dropdown button {
  width: 100%;
  display: block;
  padding: 10px 12px;
  border: 0;
  background: transparent;
  color: #e5e7eb;
  cursor: pointer;
  font: inherit;
  font-size: 14px;
  font-weight: 750;
  text-align: left;
}

.pulse-aura-item .soshix-pulse-aura-menu-dropdown button:hover,
.pulse-aura-item .soshix-pulse-aura-menu-dropdown button:focus-visible {
  background: #1e293b;
  outline: none;
}

.feed-filter-panel[data-soshix-feed-panel="aura"] .soshix-aura-card .soshix-pulse-aura-menu-dropdown button:hover,
.feed-filter-panel[data-soshix-feed-panel="aura"] .soshix-aura-card .soshix-pulse-aura-menu-dropdown button:focus-visible {
  background: #1e293b;
  outline: none;
}

.pulse-aura-item .soshix-pulse-aura-menu-dropdown button.is-danger {
  color: #ef4444;
}

.feed-filter-panel[data-soshix-feed-panel="aura"] .soshix-aura-card .soshix-pulse-aura-menu-dropdown button.is-danger {
  color: #ef4444;
}

.pulse-vox-item .soshix-pulse-vox-menu-dropdown {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 21;
  min-width: 150px;
  overflow: hidden;
  border: 1px solid rgba(148, 163, 184, 0.16);
  border-radius: 8px;
  background: #020617;
  box-shadow: 0 18px 36px rgba(2, 6, 23, 0.36);
}

[data-soshix-feed-panel="vox"] .vox-post-card .soshix-pulse-vox-menu-dropdown {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 122;
  min-width: 150px;
  overflow: hidden;
  border: 1px solid rgba(148, 163, 184, 0.16);
  border-radius: 8px;
  background: #020617;
  box-shadow: 0 18px 36px rgba(2, 6, 23, 0.36);
}

.pulse-vox-item .soshix-pulse-vox-menu-dropdown[hidden] {
  display: none !important;
}

[data-soshix-feed-panel="vox"] .vox-post-card .soshix-pulse-vox-menu-dropdown[hidden] {
  display: none !important;
}

.pulse-vox-item .soshix-pulse-vox-menu-dropdown button {
  width: 100%;
  display: block;
  padding: 10px 12px;
  border: 0;
  background: transparent;
  color: #e5e7eb;
  cursor: pointer;
  font: inherit;
  font-size: 14px;
  font-weight: 750;
  text-align: left;
}

[data-soshix-feed-panel="vox"] .vox-post-card .soshix-pulse-vox-menu-dropdown button {
  width: 100%;
  display: block;
  padding: 10px 12px;
  border: 0;
  background: transparent;
  color: #e5e7eb;
  cursor: pointer;
  font: inherit;
  font-size: 14px;
  font-weight: 750;
  text-align: left;
}

.pulse-vox-item .soshix-pulse-vox-menu-dropdown button:hover,
.pulse-vox-item .soshix-pulse-vox-menu-dropdown button:focus-visible {
  background: #1e293b;
  outline: none;
}

[data-soshix-feed-panel="vox"] .vox-post-card .soshix-pulse-vox-menu-dropdown button:hover,
[data-soshix-feed-panel="vox"] .vox-post-card .soshix-pulse-vox-menu-dropdown button:focus-visible {
  background: #1e293b;
  outline: none;
}

.pulse-vox-item .soshix-pulse-vox-menu-dropdown button.is-danger {
  color: #ef4444;
}

[data-soshix-feed-panel="vox"] .vox-post-card .soshix-pulse-vox-menu-dropdown button.is-danger {
  color: #ef4444;
}

.pulse-flux-item .soshix-pulse-flux-menu-dropdown {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 121;
  min-width: 150px;
  overflow: hidden;
  border: 1px solid rgba(148, 163, 184, 0.16);
  border-radius: 8px;
  background: #020617;
  box-shadow: 0 18px 36px rgba(2, 6, 23, 0.36);
}

[data-soshix-feed-panel="flux"] .soshix-flux-stats .soshix-pulse-flux-menu-dropdown {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 25;
  min-width: 150px;
  overflow: hidden;
  border: 1px solid rgba(148, 163, 184, 0.16);
  border-radius: 8px;
  background: #020617;
  box-shadow: 0 18px 36px rgba(2, 6, 23, 0.36);
}

.pulse-flux-item .soshix-pulse-flux-menu-dropdown[hidden],
[data-soshix-feed-panel="flux"] .soshix-flux-stats .soshix-pulse-flux-menu-dropdown[hidden] {
  display: none !important;
}

.pulse-flux-item .soshix-pulse-flux-menu-dropdown button,
[data-soshix-feed-panel="flux"] .soshix-flux-stats .soshix-pulse-flux-menu-dropdown button {
  width: 100%;
  display: block;
  padding: 10px 12px;
  border: 0;
  background: transparent;
  color: #e5e7eb;
  cursor: pointer;
  font: inherit;
  font-size: 14px;
  font-weight: 750;
  text-align: left;
}

.pulse-flux-item .soshix-pulse-flux-menu-dropdown button:hover,
.pulse-flux-item .soshix-pulse-flux-menu-dropdown button:focus-visible,
[data-soshix-feed-panel="flux"] .soshix-flux-stats .soshix-pulse-flux-menu-dropdown button:hover,
[data-soshix-feed-panel="flux"] .soshix-flux-stats .soshix-pulse-flux-menu-dropdown button:focus-visible {
  background: #1e293b;
  outline: none;
}

.pulse-flux-item .soshix-pulse-flux-menu-dropdown button.is-danger,
[data-soshix-feed-panel="flux"] .soshix-flux-stats .soshix-pulse-flux-menu-dropdown button.is-danger {
  color: #ef4444;
}

.feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-clip-card[data-soshix-flux-clip-card] {
  overflow: visible;
}

.feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-clip-card[data-soshix-flux-clip-card] .soshix-flux-info.flux-caption {
  z-index: 30;
}

.feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-clip-card[data-soshix-flux-clip-card] .soshix-flux-stats.flux-actions {
  z-index: 32;
}

.feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-clip-card[data-soshix-flux-clip-card] .soshix-flux-stats .soshix-pulse-flux-menu-shell {
  z-index: 80;
}

.feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-clip-card[data-soshix-flux-clip-card] .soshix-flux-stats .soshix-pulse-flux-menu-dropdown {
  z-index: 81;
}

.pulse-aura-item .soshix-pulse-aura-menu:hover,
.pulse-aura-item .soshix-pulse-aura-menu:focus-visible,
[data-soshix-feed-panel="aura"] .soshix-aura-card .soshix-pulse-aura-menu:hover,
[data-soshix-feed-panel="aura"] .soshix-aura-card .soshix-pulse-aura-menu:focus-visible,
.pulse-soshix-item .post-menu .soshix-pulse-aura-menu:hover,
.pulse-soshix-item .post-menu .soshix-pulse-aura-menu:focus-visible,
body.soshix-feed-body .feed-page .post-card:not(.pulse-soshix-item) .post-menu .soshix-pulse-aura-menu:hover,
body.soshix-feed-body .feed-page .post-card:not(.pulse-soshix-item) .post-menu .soshix-pulse-aura-menu:focus-visible,
.pulse-vox-item .vox-post-menu > .soshix-pulse-aura-menu:hover,
.pulse-vox-item .vox-post-menu > .soshix-pulse-aura-menu:focus-visible,
[data-soshix-feed-panel="vox"] .vox-post-card .vox-post-menu > .soshix-pulse-aura-menu:hover,
[data-soshix-feed-panel="vox"] .vox-post-card .vox-post-menu > .soshix-pulse-aura-menu:focus-visible,
.pulse-flux-item .soshix-pulse-aura-menu:hover,
.pulse-flux-item .soshix-pulse-aura-menu:focus-visible,
[data-soshix-feed-panel="flux"] .soshix-flux-stats .soshix-pulse-aura-menu:hover,
[data-soshix-feed-panel="flux"] .soshix-flux-stats .soshix-pulse-aura-menu:focus-visible {
  border-color: rgba(168, 85, 247, 0.42);
  background: rgba(30, 41, 59, 0.9);
  color: #fff;
  outline: none;
}

.soshix-aura-avatar {
  display: block;
  width: 44px;
  height: 44px;
  overflow: hidden;
  border-radius: 50%;
  background: linear-gradient(135deg, #ec4899, #6366f1);
  color: #fff;
  text-decoration: none;
  flex: 0 0 auto;
}

.soshix-aura-avatar img,
.soshix-aura-avatar span {
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  object-fit: cover;
  font-weight: 800;
}

.soshix-aura-author {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.soshix-aura-author a {
  width: fit-content;
  max-width: 100%;
  color: #f8fafc;
  font-size: 15px;
  font-weight: 800;
  overflow: hidden;
  text-overflow: ellipsis;
  text-decoration: none;
  white-space: nowrap;
}

.soshix-aura-author a:hover {
  text-decoration: underline;
}

.soshix-aura-author span {
  color: #94a3b8;
  font-size: 13px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.soshix-aura-author span a {
  color: inherit;
  font-size: inherit;
  font-weight: 400;
  text-transform: none;
}

.soshix-aura-open {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  color: #cbd5e1;
  text-decoration: none;
  transition:
    background 0.15s ease,
    color 0.15s ease;
}

.soshix-aura-open:hover {
  background: rgba(148, 163, 184, 0.12);
  color: #fff;
}

.soshix-aura-media {
  display: grid;
  gap: 4px;
  min-height: 0;
  overflow: hidden;
  border-radius: 8px;
  background: #020617;
  text-decoration: none;
}

.soshix-aura-media.is-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  min-height: 340px;
}

.soshix-aura-media-item {
  position: relative;
  display: block;
  min-height: 180px;
  overflow: hidden;
  background: #020617;
}

.soshix-aura-media:not(.is-grid) .soshix-aura-media-item {
  min-height: 0;
  max-height: min(560px, 72vh);
}

.soshix-aura-media-item img,
.soshix-aura-media-item video,
.soshix-aura-reel-preview img,
.soshix-aura-reel-preview video,
.pulse-feed-item .soshix-pulse-video-thumbnail {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.soshix-aura-media:not(.is-grid) .soshix-aura-media-item img,
.soshix-aura-media:not(.is-grid) .soshix-aura-media-item video {
  height: auto;
  max-height: min(560px, 72vh);
  object-fit: contain;
  background: #020617;
}

.soshix-aura-video-thumbnail.is-generating,
.soshix-aura-video-thumbnail.is-unavailable {
  background:
    radial-gradient(circle at 50% 42%, rgba(168, 85, 247, 0.26), transparent 34%),
    linear-gradient(135deg, rgba(236, 72, 153, 0.18), rgba(99, 102, 241, 0.2)),
    #020617;
}

.soshix-aura-video-thumbnail.is-generating:not([src]),
.soshix-aura-video-thumbnail.is-unavailable:not([src]) {
  min-height: inherit;
}

.soshix-aura-media-item i,
.soshix-aura-reel-preview > i,
.pulse-feed-item .soshix-pulse-video-play {
  position: absolute;
  inset: 50% auto auto 50%;
  transform: translate(-50%, -50%);
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: rgba(15, 23, 42, 0.72);
  color: #fff;
  font-size: 26px;
}

.pulse-feed-item .soshix-flux-video,
.pulse-feed-item .vox-post-media-item,
.pulse-feed-item .soshix-canvas-thumb {
  position: relative;
}

.soshix-aura-media-item b {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  background: rgba(2, 6, 23, 0.62);
  color: #fff;
  font-size: 28px;
}

.soshix-aura-reel-preview {
  position: relative;
  display: block;
  width: min(260px, 100%);
  min-height: 390px;
  justify-self: center;
  overflow: hidden;
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(236, 72, 153, 0.22), rgba(99, 102, 241, 0.22)),
    #020617;
  text-decoration: none;
}

.soshix-aura-reel-badge {
  position: absolute;
  top: 10px;
  left: 10px;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.76);
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  padding: 5px 9px;
}

.pulse-video-sound-toggle {
  position: absolute;
  right: 10px;
  bottom: 10px;
  z-index: 3;
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border: 1px solid rgba(255, 255, 255, 0.24);
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.78);
  color: #fff;
  cursor: pointer;
  font-size: 18px;
  line-height: 1;
  box-shadow: 0 10px 24px rgba(2, 6, 23, 0.26);
  transition:
    background 0.16s ease,
    border-color 0.16s ease,
    transform 0.16s ease;
}

.pulse-video-sound-toggle:hover,
.pulse-video-sound-toggle:focus-visible {
  border-color: rgba(255, 255, 255, 0.42);
  background: rgba(15, 23, 42, 0.92);
  outline: none;
  transform: translateY(-1px);
}

.pulse-video-sound-toggle.is-unmuted {
  border-color: rgba(236, 72, 153, 0.58);
  background: rgba(131, 24, 67, 0.86);
}

.soshix-aura-caption {
  margin: 0;
  color: #e5e7eb;
  font-size: 15px;
  line-height: 1.5;
}

.soshix-aura-actions {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  align-items: center;
  max-width: 470px;
  margin-top: 14px;
  color: #94a3b8;
  font-size: 13px;
}

.soshix-aura-actions i {
  color: currentColor;
}

.soshix-aura-feed-actions {
  display: flex;
  justify-content: space-around;
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px solid #1e293b;
}

.soshix-aura-feed-action-btn {
  min-height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 6px 10px;
  border: 0;
  border-radius: 6px;
  background: none;
  color: #cbd5f5;
  cursor: pointer;
  font: inherit;
  font-size: 14px;
  transition:
    background 0.15s ease,
    color 0.15s ease;
}

.soshix-aura-feed-action-btn:hover,
.soshix-aura-feed-action-btn:focus-visible {
  background: #1e293b;
  color: #f8fafc;
  outline: none;
}

.soshix-aura-feed-action-btn i {
  color: currentColor;
}

.soshix-aura-feed-like-btn.liked {
  color: var(--soshix-platform-aura, #a855f7);
  font-weight: 600;
}

  .soshix-aura-share-topline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
    position: relative;
    z-index: 22;
  }

  .soshix-aura-share-topline .pulse-platform-badge {
    margin-bottom: 0;
  }

  .soshix-aura-share-topline .soshix-pulse-aura-menu-shell {
    margin-left: auto;
  }

  .soshix-aura-share-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 2px 0 6px;
    min-width: 0;
  }

  .soshix-aura-share-avatar {
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    border-radius: 50%;
    overflow: hidden;
    background: linear-gradient(135deg, #ec4899, #8b5cf6);
    color: #ffffff;
    text-decoration: none;
  }

  .soshix-aura-share-avatar img,
  .soshix-aura-share-avatar span {
    display: flex;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center;
    object-fit: cover;
    font-size: 14px;
    font-weight: 800;
  }

  .soshix-aura-share-meta {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
  }

  .soshix-aura-share-author {
    min-width: 0;
    color: #cbd5e1;
    font-size: 14px;
    line-height: 1.25;
  }

  .soshix-aura-share-author a {
    color: #f8fafc;
    font-weight: 700;
    text-decoration: none;
  }

  .soshix-aura-share-author a:hover {
    text-decoration: underline;
  }

  .soshix-aura-share-time {
    color: #94a3b8;
    font-size: 12px;
    line-height: 1.25;
  }

  .soshix-aura-repost-caption {
    margin: 0 0 12px;
    color: #f8fafc;
    font-size: 15px;
    line-height: 1.45;
    white-space: pre-wrap;
  }

  .soshix-aura-shared-original {
    margin-top: 0;
  }

  .pulse-platform-badge .pulse-platform-detail {
    color: color-mix(in srgb, var(--pulse-accent) 68%, #ffffff);
    font-weight: 700;
  }

.soshix-aura-action-btn,
.soshix-aura-view-count {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #94a3b8;
  cursor: default;
  font: inherit;
  font-size: 13px;
  font-weight: 750;
  line-height: 1;
  padding: 7px 9px;
  transform-origin: center;
}

.pulse-aura-item .soshix-aura-actions .soshix-aura-action-btn,
.pulse-aura-item .soshix-aura-actions .soshix-aura-view-count {
  color: color-mix(in srgb, var(--soshix-platform-aura, #a855f7) 78%, #e9d5ff);
  cursor: default;
  transition:
    color 0.16s ease,
    opacity 0.16s ease,
    text-shadow 0.16s ease,
    transform 0.16s ease;
}

.pulse-aura-item .soshix-aura-actions .soshix-aura-action-btn:hover,
.pulse-aura-item .soshix-aura-actions .soshix-aura-view-count:hover {
  color: color-mix(in srgb, var(--soshix-platform-aura, #a855f7) 72%, #e9d5ff);
  transform: scale(1.05);
  text-shadow:
    0 0 2px color-mix(in srgb, var(--soshix-platform-aura, #a855f7) 86%, #e9d5ff),
    0 0 8px color-mix(in srgb, var(--soshix-platform-aura, #a855f7) 96%, #e9d5ff),
    0 0 18px color-mix(in srgb, var(--soshix-platform-aura, #a855f7) 88%, transparent),
    0 0 34px color-mix(in srgb, var(--soshix-platform-aura, #a855f7) 72%, transparent),
    0 0 54px color-mix(in srgb, var(--soshix-platform-aura, #a855f7) 56%, transparent);
}

.soshix-aura-view-count {
  cursor: default;
}

.soshix-aura-action-btn.is-active {
  outline: none;
}

.pulse-aura-item .soshix-aura-actions .soshix-aura-action-btn.is-active {
  background: transparent;
  color: color-mix(in srgb, var(--soshix-platform-aura, #a855f7) 78%, #e9d5ff);
}

button.soshix-aura-action-btn:active {
  transform: scale(0.96);
}

@media (max-width: 900px) {
  .soshix-aura-actions {
    max-width: none;
    margin-top: 12px;
  }

  .soshix-aura-action-btn,
  .soshix-aura-view-count {
    min-width: 42px;
    min-height: 38px;
    justify-content: center;
    padding: 7px 8px;
    touch-action: manipulation;
  }
}

.soshix-aura-share-modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 1160;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 18px;
  background: rgba(2, 6, 23, 0.72);
  backdrop-filter: blur(12px);
}

.soshix-aura-share-modal-overlay.is-open {
  display: flex;
}

.soshix-aura-share-modal {
  width: min(520px, 100%);
  max-height: min(720px, calc(100dvh - 36px));
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid rgba(244, 114, 182, 0.2);
  border-radius: 24px;
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.98), rgba(30, 41, 59, 0.98));
  color: #f8fafc;
  box-shadow: 0 28px 80px rgba(15, 23, 42, 0.45);
}

.soshix-aura-share-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 20px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.16);
}

.soshix-aura-share-modal-header h2 {
  margin: 0;
  font-size: 20px;
  line-height: 1.2;
}

.soshix-aura-share-modal-header button {
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.14);
  color: #e2e8f0;
  cursor: pointer;
}

.soshix-aura-share-form {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 18px 20px 20px;
  overflow-y: auto;
}

.soshix-aura-share-form label {
  display: flex;
  flex-direction: column;
  gap: 8px;
  color: #cbd5e1;
  font-size: 13px;
  font-weight: 800;
}

.soshix-aura-share-form textarea {
  width: 100%;
  min-height: 104px;
  resize: vertical;
  border: 1px solid rgba(244, 114, 182, 0.22);
  border-radius: 16px;
  background: rgba(15, 23, 42, 0.78);
  color: #f8fafc;
  font: inherit;
  line-height: 1.45;
  padding: 12px 14px;
  outline: none;
}

.soshix-aura-share-form textarea:focus {
  border-color: rgba(244, 114, 182, 0.58);
  box-shadow: 0 0 0 3px rgba(244, 114, 182, 0.12);
}

.soshix-aura-share-preview {
  overflow: hidden;
  border: 1px solid rgba(148, 163, 184, 0.16);
  border-radius: 18px;
  background: rgba(15, 23, 42, 0.48);
}

.soshix-aura-share-preview header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px;
}

.soshix-aura-share-preview-avatar {
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: 50%;
  background: linear-gradient(135deg, #f472b6, #a855f7);
  color: #fff;
  font-weight: 900;
}

.soshix-aura-share-preview-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.soshix-aura-share-preview header div {
  min-width: 0;
}

.soshix-aura-share-preview header strong,
.soshix-aura-share-preview header span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.soshix-aura-share-preview header strong {
  color: #f8fafc;
  font-size: 14px;
}

.soshix-aura-share-preview header span {
  color: #94a3b8;
  font-size: 12px;
}

.soshix-aura-share-preview p {
  margin: 0;
  padding: 0 12px 12px;
  color: #e2e8f0;
  font-size: 13px;
  line-height: 1.45;
}

.soshix-aura-share-preview-media {
  display: flex;
  align-items: center;
  justify-content: center;
  max-height: 220px;
  overflow: hidden;
  background: #020617;
}

.soshix-aura-share-preview-media img {
  width: auto;
  max-width: 100%;
  max-height: 220px;
  display: block;
  object-fit: contain;
}

.soshix-aura-share-preview-media video {
  width: 100%;
  max-height: 220px;
  display: block;
  object-fit: cover;
}

.soshix-aura-share-status {
  min-height: 18px;
  margin: 0;
  color: #86efac;
  font-size: 13px;
  font-weight: 700;
}

.soshix-aura-share-status.is-error {
  color: #fca5a5;
}

.soshix-aura-share-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.soshix-aura-share-actions button {
  min-height: 40px;
  border: 0;
  border-radius: 999px;
  padding: 10px 16px;
  font-weight: 900;
  cursor: pointer;
}

.soshix-aura-share-actions .secondary {
  background: rgba(148, 163, 184, 0.14);
  color: #e2e8f0;
}

.soshix-aura-share-actions .primary {
  background: linear-gradient(135deg, #f472b6, #a855f7);
  color: #fff;
}

.soshix-aura-share-actions button:disabled {
  cursor: not-allowed;
  opacity: 0.58;
}

.soshix-aura-edit-post-overlay {
  z-index: 1160;
}

.soshix-aura-edit-post-overlay .post-modal {
  --soshix-platform-soshix: var(--soshix-platform-aura, #a855f7);
  overflow-y: auto;
  scrollbar-color: var(--soshix-platform-soshix) rgba(2, 6, 23, 0.42);
  scrollbar-width: thin;
}

.soshix-aura-edit-post-overlay .post-modal::-webkit-scrollbar {
  width: 10px;
}

.soshix-aura-edit-post-overlay .post-modal::-webkit-scrollbar-track {
  background: rgba(2, 6, 23, 0.42);
  border-radius: 999px;
}

.soshix-aura-edit-post-overlay .post-modal::-webkit-scrollbar-thumb {
  background: color-mix(in srgb, var(--soshix-platform-soshix) 72%, #0f172a);
  border: 2px solid rgba(2, 6, 23, 0.82);
  border-radius: 999px;
}

.soshix-aura-edit-post-overlay .post-modal::-webkit-scrollbar-thumb:hover {
  background: var(--soshix-platform-soshix);
}

.soshix-aura-edit-post-status {
  min-height: 18px;
  margin: 10px 0 0;
  color: #86efac;
  font-size: 13px;
  font-weight: 700;
}

.soshix-aura-edit-post-status.is-error {
  color: #fca5a5;
}

.soshix-aura-edit-post-overlay .share-preview {
  max-height: none;
  overflow: visible;
}

.soshix-aura-edit-post-preview-card {
  overflow: hidden;
  border: 1px solid #1f2937;
  border-radius: 10px;
  background: #020617;
}

.soshix-aura-edit-post-preview-card .shared-post-header {
  padding: 10px;
  margin-bottom: 0;
}

.soshix-aura-edit-post-preview-card .shared-avatar img,
.soshix-aura-edit-post-preview-card .shared-avatar span {
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  object-fit: cover;
  background: linear-gradient(135deg, #f472b6, var(--soshix-platform-aura, #a855f7));
  color: #fff;
  font-weight: 700;
}

.soshix-aura-edit-post-preview-card .shared-author {
  color: #e5e7eb;
  font-size: 14px;
  font-weight: 600;
}

.soshix-aura-edit-post-preview-card .shared-content p {
  margin: 0;
  padding: 0 10px 10px;
}

.soshix-aura-edit-post-preview-media .soshix-aura-media {
  margin-top: 0;
}

.soshix-aura-edit-post-preview-media .soshix-aura-media:not(.is-grid) .soshix-aura-media-item img,
.soshix-aura-edit-post-preview-media .soshix-aura-media:not(.is-grid) .soshix-aura-media-item video {
  max-height: 420px;
}

.soshix-aura-edit-post-footer {
  gap: 10px;
}

.soshix-aura-comments-overlay {
  position: fixed;
  inset: 0;
  z-index: 1100;
  display: none;
  align-items: center;
  justify-content: center;
  background: rgba(2, 6, 23, 0.72);
  backdrop-filter: blur(10px);
  padding: 16px;
}

.soshix-aura-comments-overlay.is-open {
  display: flex;
}

.soshix-aura-comments-drawer {
  --soshix-aura-comments-accent: var(--soshix-platform-aura, #a855f7);
  width: min(640px, 100%);
  height: min(640px, calc(100vh - 40px));
  height: min(640px, calc(100dvh - 40px));
  max-height: min(720px, calc(100vh - 40px));
  max-height: min(720px, calc(100dvh - 40px));
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  overflow: hidden;
  border: 2px solid color-mix(in srgb, var(--soshix-aura-comments-accent) 42%, rgba(255, 255, 255, 0.16));
  border-radius: 16px;
  background:
    radial-gradient(circle at 20% 0%, color-mix(in srgb, var(--soshix-aura-comments-accent) 18%, transparent), transparent 42%),
    linear-gradient(180deg, #172033 0%, #0f172a 48%, #0b1120 100%);
  color: #e5e7eb;
  box-shadow:
    0 0 0 6px color-mix(in srgb, var(--soshix-aura-comments-accent) 10%, transparent),
    0 0 42px color-mix(in srgb, var(--soshix-aura-comments-accent) 30%, transparent),
    0 34px 90px rgba(0, 0, 0, 0.68);
}

.soshix-aura-comments-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.14);
}

.soshix-aura-comments-header h2 {
  margin: 0;
  color: #fff;
  font-size: 17px;
}

.soshix-aura-comments-header span {
  color: #94a3b8;
  font-size: 13px;
}

.soshix-aura-comments-close {
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 50%;
  background: rgba(148, 163, 184, 0.12);
  color: #e5e7eb;
  cursor: pointer;
}

.soshix-aura-comments-list {
  display: grid;
  align-content: start;
  gap: 10px;
  min-height: 0;
  overflow-y: auto;
  padding: 14px 16px;
}

.soshix-aura-comment {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
}

.soshix-aura-comment-avatar {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border-radius: 50%;
  background: linear-gradient(135deg, #ec4899, #6366f1);
  color: #fff;
  font-size: 13px;
  font-weight: 800;
}

.soshix-aura-comment-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.soshix-aura-comment-bubble {
  display: grid;
  gap: 3px;
  padding: 9px 11px;
  border-radius: 10px;
  background: rgba(2, 6, 23, 0.56);
}

.soshix-aura-comment-body {
  min-width: 0;
}

.soshix-aura-comment-meta {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
}

.soshix-aura-comment-meta > div {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.soshix-aura-comment-delete {
  width: 30px;
  height: 30px;
  flex: 0 0 auto;
  display: inline-grid;
  place-items: center;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #f87171;
  cursor: pointer;
}

.soshix-aura-comment-delete:hover,
.soshix-aura-comment-delete:focus-visible {
  background: rgba(248, 113, 113, 0.14);
  color: #fecaca;
  outline: none;
}

.soshix-aura-comment-delete:disabled {
  cursor: wait;
  opacity: 0.55;
}

.soshix-aura-comment-delete-confirm-overlay {
  position: fixed;
  inset: 0;
  z-index: 1120;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 18px;
  background: rgba(2, 6, 23, 0.48);
  backdrop-filter: blur(6px);
}

.soshix-aura-comment-delete-confirm-overlay.is-open {
  display: flex;
}

.soshix-aura-comment-delete-confirm {
  width: min(360px, 100%);
  display: grid;
  gap: 14px;
  padding: 18px;
  border: 1px solid rgba(248, 113, 113, 0.28);
  border-radius: 14px;
  background:
    radial-gradient(circle at 15% 0%, rgba(168, 85, 247, 0.16), transparent 38%),
    linear-gradient(180deg, #172033 0%, #0f172a 100%);
  color: #e5e7eb;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.62);
}

.soshix-aura-comment-delete-confirm header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.soshix-aura-comment-delete-confirm h2,
.soshix-aura-comment-delete-confirm p {
  margin: 0;
}

.soshix-aura-comment-delete-confirm h2 {
  color: #fff;
  font-size: 18px;
}

.soshix-aura-comment-delete-confirm p {
  color: #cbd5e1;
  font-size: 14px;
  line-height: 1.45;
}

.soshix-aura-comment-delete-confirm header button {
  width: 32px;
  height: 32px;
  display: inline-grid;
  place-items: center;
  border: 0;
  border-radius: 50%;
  background: rgba(148, 163, 184, 0.12);
  color: #e5e7eb;
  cursor: pointer;
}

.soshix-aura-comment-delete-confirm-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.soshix-aura-comment-delete-confirm-actions button {
  min-height: 40px;
  padding: 0 16px;
  border: 0;
  border-radius: 10px;
  font-weight: 800;
  cursor: pointer;
}

.soshix-aura-comment-delete-confirm-actions .secondary {
  background: rgba(148, 163, 184, 0.14);
  color: #e5e7eb;
}

.soshix-aura-comment-delete-confirm-actions .danger {
  background: #dc2626;
  color: #fff;
  box-shadow: 0 14px 28px rgba(220, 38, 38, 0.24);
}

.soshix-aura-comment-bubble strong {
  color: #f8fafc;
  font-size: 14px;
}

.soshix-aura-comment-bubble span {
  color: #94a3b8;
  font-size: 12px;
}

.soshix-aura-comment-bubble p {
  margin: 2px 0 0;
  color: #e5e7eb;
  font-size: 14px;
  line-height: 1.4;
}

.soshix-aura-comment-empty {
  display: grid;
  place-items: center;
  gap: 6px;
  min-height: 150px;
  color: #94a3b8;
  text-align: center;
}

.soshix-aura-comment-empty strong {
  color: #e5e7eb;
}

.soshix-aura-comments-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  padding: 12px 16px;
  border-top: 1px solid color-mix(in srgb, var(--soshix-aura-comments-accent, var(--soshix-platform-aura, #a855f7)) 28%, rgba(148, 163, 184, 0.14));
  background:
    linear-gradient(180deg, rgba(15, 23, 42, 0.96), rgba(2, 6, 23, 0.98));
  box-shadow: 0 -18px 34px rgba(2, 6, 23, 0.36);
}

.soshix-aura-comments-form textarea {
  min-height: 42px;
  max-height: 120px;
  resize: vertical;
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 10px;
  background: #020617;
  color: #e5e7eb;
  font: inherit;
  padding: 10px 12px;
}

.soshix-aura-comments-form button {
  align-self: end;
  min-height: 42px;
  border: 0;
  border-radius: 999px;
  background: linear-gradient(135deg, #ec4899, #14b8a6);
  color: #fff;
  cursor: pointer;
  font: inherit;
  font-weight: 900;
  padding: 0 16px;
}

.soshix-aura-comments-form button:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}

@media (max-width: 900px) {
  .soshix-aura-comments-overlay {
    align-items: center;
    padding: 12px 12px calc(var(--soshix-feed-mobile-bottom-space, calc(72px + env(safe-area-inset-bottom, 0px))) + 12px);
  }

  .soshix-aura-comments-drawer {
    height: calc(100dvh - var(--soshix-feed-mobile-bottom-space, calc(72px + env(safe-area-inset-bottom, 0px))) - 24px);
    max-height: calc(100dvh - var(--soshix-feed-mobile-bottom-space, calc(72px + env(safe-area-inset-bottom, 0px))) - 24px);
    border-radius: 18px;
  }

  .soshix-aura-comments-list {
    padding-bottom: 18px;
  }

  .soshix-aura-comments-form {
    padding-bottom: max(14px, env(safe-area-inset-bottom, 0px));
  }
}

.soshix-vox-reply-panel {
  display: grid;
  gap: 10px;
  margin-top: 12px;
  padding: 12px;
  border: 1px solid rgba(29, 155, 240, 0.18);
  border-radius: 10px;
  background: rgba(15, 23, 42, 0.78);
}

.soshix-vox-reply-panel[hidden] {
  display: none !important;
}

.soshix-vox-reply-panel textarea {
  width: 100%;
  min-height: 84px;
  resize: vertical;
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 10px;
  background: #020617;
  color: #f8fafc;
  font: inherit;
  line-height: 1.45;
  outline: none;
  padding: 10px 12px;
}

.soshix-vox-reply-panel textarea:focus {
  border-color: rgba(56, 189, 248, 0.62);
  box-shadow: 0 0 0 3px rgba(56, 189, 248, 0.12);
}

.soshix-vox-reply-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.soshix-vox-reply-actions span {
  margin-right: auto;
  color: #fca5a5;
  font-size: 13px;
  font-weight: 700;
}

.soshix-vox-reply-actions button {
  min-height: 34px;
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 999px;
  background: rgba(30, 41, 59, 0.72);
  color: #e2e8f0;
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  padding: 0 13px;
}

.soshix-vox-reply-actions button[type="submit"] {
  border-color: rgba(29, 155, 240, 0.62);
  background: #1d9bf0;
  color: #fff;
}

.soshix-vox-reply-actions button:disabled {
  cursor: not-allowed;
  opacity: 0.52;
}

@media (max-width: 900px) {
  .feed-page .feed-center {
    height: auto !important;
    overflow: visible !important;
  }

  .feed-page .feed-scroll-region {
    flex: 0 0 auto;
    min-height: auto;
    padding-top: 0;
    overflow: visible;
    -webkit-overflow-scrolling: touch;
  }

  .feed-filter-tabs {
    position: static;
    flex: 0 0 auto;
    align-self: stretch;
    margin-top: 12px;
    top: auto;
    z-index: auto;
  }

  .soshix-canvas-video-card {
    grid-template-columns: 1fr;
  }

  .soshix-canvas-actions {
    grid-column: 1;
  }

  .pulse-create-options {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pulse-create-option {
    min-height: 74px;
  }

  .pulse-canvas-item .soshix-canvas-thumb {
    width: 100%;
  }

  .soshix-flux-clip-card {
    grid-template-columns: 1fr;
  }

  .soshix-flux-video {
    width: min(260px, 100%);
    justify-self: center;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] {
    scroll-behavior: smooth;
    scroll-snap-type: y mandatory;
    scroll-padding-top: 0;
    overscroll-behavior-y: contain;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .feed-filter-panel[data-soshix-feed-panel="flux"].is-active {
    display: grid;
    gap: 12px;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-feed:not([hidden]) {
    display: grid;
    gap: 14px;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-clip-card {
    position: relative;
    min-height: calc(100dvh - var(--soshix-feed-mobile-header-height, 58px) - var(--soshix-feed-mobile-bottom-space, 0px) - 104px);
    grid-template-columns: 1fr;
    grid-template-rows: minmax(0, 1fr) auto;
    align-content: stretch;
    scroll-snap-align: start;
    scroll-snap-stop: always;
    overflow: hidden;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-video {
    width: min(430px, 100%);
    height: min(68vh, 620px);
    max-height: none;
    min-height: 0;
    align-self: center;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-info {
    position: absolute;
    left: 10px;
    right: 72px;
    bottom: calc(76px + env(safe-area-inset-bottom));
    z-index: 5;
    align-content: start;
    gap: 8px;
    padding: 12px;
    border-radius: 16px;
    background: linear-gradient(180deg, rgba(2, 6, 23, 0.08), rgba(2, 6, 23, 0.52));
    color: #fff;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-creator {
    width: 100%;
    min-width: 0;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-creator > span:last-child {
    width: auto !important;
    height: auto !important;
    min-width: 0;
    display: grid;
    gap: 2px;
    place-items: initial !important;
    overflow: hidden;
    border-radius: 0 !important;
    background: transparent !important;
    color: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-creator strong,
  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-creator em {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-play {
    display: none;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-mute,
  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-menu {
    position: absolute;
    right: 12px;
    z-index: 8;
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.62);
    color: #f8fafc;
    cursor: pointer;
    box-shadow: 0 14px 32px rgba(2, 6, 23, 0.34);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    transition: background 0.18s ease, transform 0.18s ease;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-mute {
    top: max(12px, env(safe-area-inset-top));
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-menu {
    bottom: calc(58px + env(safe-area-inset-bottom));
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-action-dock {
    position: absolute;
    right: 12px;
    bottom: calc(58px + env(safe-area-inset-bottom));
    z-index: 8;
    width: 42px;
    height: 42px;
    display: block;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-action-dock .soshix-flux-menu {
    position: relative;
    right: auto;
    bottom: auto;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-mute > span,
  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-menu > span {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-mute i,
  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-menu i {
    font-size: 21px;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-mute:hover,
  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-mute:focus-visible,
  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-menu:hover,
  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-menu:focus-visible,
  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-clip-card.is-actions-open .soshix-flux-menu {
    background: rgba(236, 72, 153, 0.84);
    outline: none;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats {
    position: absolute;
    right: -7px;
    bottom: calc(100% + 14px);
    z-index: 7;
    display: grid;
    gap: 10px;
    width: auto;
    padding: 10px 6px;
    border-radius: 999px;
    background: rgba(2, 6, 23, 0.42);
    opacity: 0;
    pointer-events: none;
    transform: translateX(18px);
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
    transition: opacity 260ms ease, transform 260ms ease;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-clip-card.is-actions-open .soshix-flux-stats {
    opacity: 1;
    pointer-events: auto;
    transform: translateX(0);
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats > span,
  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .soshix-flux-action-count,
  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .soshix-flux-mobile-action {
    min-width: 52px;
    min-height: 58px;
    display: grid;
    place-items: center;
    justify-items: center;
    gap: 4px;
    border: 0;
    background: transparent;
    color: #f8fafc;
    cursor: pointer;
    font-weight: 700;
    padding: 0;
    text-decoration: none;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .soshix-flux-like.is-liked {
    color: #fb7185;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .soshix-flux-like.is-liked i {
    background: rgba(244, 63, 94, 0.18);
    color: #fb7185;
    box-shadow: 0 0 0 1px rgba(244, 63, 94, 0.28), 0 12px 28px rgba(244, 63, 94, 0.2);
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .soshix-flux-save.is-saved {
    color: #a78bfa;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .soshix-flux-save.is-saved i {
    background: rgba(139, 92, 246, 0.18);
    color: #c4b5fd;
    box-shadow: 0 0 0 1px rgba(139, 92, 246, 0.28), 0 12px 28px rgba(139, 92, 246, 0.18);
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats i {
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: #111827;
    color: #f8fafc;
    font-size: 18px;
    line-height: 1;
    margin: 0;
    padding: 0;
    text-align: center;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .soshix-flux-duet,
  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .soshix-flux-save {
    gap: 2px;
  }

  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .soshix-flux-duet span,
  .feed-scroll-region[data-feed-scroll-theme="flux"] .soshix-flux-stats .soshix-flux-save span {
    display: block;
    min-width: 0;
    min-height: 0;
    font-size: 10px;
    line-height: 1.1;
  }

  .soshix-flux-action-panel {
    position: relative;
    display: block;
    padding: 8px 10px;
  }

  .soshix-flux-action-panel .soshix-flux-action {
    position: absolute;
    right: 14px;
    top: 50%;
    z-index: 2;
    min-height: 32px;
    gap: 5px;
    padding: 6px 10px;
    font-size: 12px;
    transform: translateY(-50%);
  }

  .soshix-flux-action-panel .soshix-flux-action:hover,
  .soshix-flux-action-panel .soshix-flux-action:focus-visible {
    transform: translateY(calc(-50% - 1px));
  }

  .soshix-flux-action-panel .soshix-flux-action i,
  .soshix-flux-upload-label-full {
    display: none;
  }

  .soshix-flux-upload-label-mobile {
    display: inline;
  }

  .soshix-flux-view-tabs {
    margin: 0;
  }

  .soshix-flux-view-tabs button {
    font-size: 11px;
    padding-inline: 4px;
  }
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* =========================
   CREATE POST (SIDE BY SIDE)
========================= */

.create-post-inner {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
}

.create-post-avatar {
  flex: 0 0 auto;
  border: 0;
  padding: 0;
  background: transparent;
  cursor: pointer;
}

.create-post-avatar img,
.avatar-fallback {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  object-fit: cover;
}

.avatar-fallback {
  background: #334155;
  color: #e5e7eb;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
}

/* =========================
   INPUT
========================= */

.create-post-input {
  flex: 1;
}

.create-post-input input {
  width: 100%;
  height: 40px;
  padding: 0 14px;
  border-radius: 20px;
  border: none;
  background: #020617;
  color: #e5e7eb;
  cursor: pointer;
  outline: none;
}

/* =========================
   ICONS
========================= */

.create-post-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 0 0 auto;
}

.post-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  font-size: 30px;
  line-height: 1;
  cursor: pointer;
  opacity: 0.9;
  transition:
    transform 0.15s ease,
    opacity 0.15s ease;
}

.post-icon[title="Add Photo"] {
  color: #22c55e;
}

.post-icon[title="Add Video"] {
  color: #ef4444;
}

.post-icon:hover {
  opacity: 1;
  transform: scale(1.06);
}

/* =========================
   POST CARDS
========================= */

.post-card {
  padding: 14px;
}

.post-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.post-header-left {
  display: flex;
  align-items: center;
  gap: 10px;
}

.post-avatar img {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  object-fit: cover;
}

.post-meta {
  display: flex;
  flex-direction: column;
}

.post-author {
  font-weight: 600;
}

.shared-action-text {
  color: #9ca3af;
  font-weight: 500;
}

.share-recipient-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 180px;
  margin-left: 2px;
  padding: 3px 8px 3px 4px;
  border: 1px solid rgba(59, 130, 246, 0.35);
  border-radius: 999px;
  background: rgba(37, 99, 235, 0.14);
  color: #dbeafe;
  text-decoration: none;
  vertical-align: middle;
}

.share-recipient-chip:hover {
  background: rgba(37, 99, 235, 0.22);
  text-decoration: none;
}

.share-recipient-chip img,
.share-recipient-chip .avatar-fallback {
  width: 22px;
  height: 22px;
  border-radius: 999px;
  flex: 0 0 auto;
  font-size: 11px;
}

.share-recipient-chip span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.post-time {
  font-size: 12px;
  color: #9ca3af;
}

.post-content {
  margin-top: 10px;
  font-size: 15px;
  line-height: 1.5;
}

/* =========================
   FEED POST MEDIA
========================= */

.media-placeholder {
  height: 220px;
  background: #020617;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #64748b;
  font-size: 14px;
}

/* =========================
   POST ACTIONS (LIKE / COMMENT / SHARE)
========================= */

.post-actions {
  display: flex;
  justify-content: space-around;
  margin-top: 12px;
  padding-top: 8px;
  border-top: 1px solid #1e293b;
}

.post-action-btn {
  background: none;
  border: none;
  color: #cbd5f5;
  font-size: 14px;
  cursor: pointer;
  display: flex;
  gap: 6px;
  align-items: center;
  padding: 6px 10px;
  border-radius: 6px;
  transition:
    background 0.15s ease,
    color 0.15s ease;
}

.post-action-btn:hover {
  background: #1e293b;
}

/* LIKE STATES */
.post-action-btn.like-btn {
  color: #cbd5f5;
}

.post-action-btn.like-btn.liked {
  color: #1877f2;
  font-weight: 600;
}

.post-action-btn.like-btn .like-count {
  font-size: 13px;
}

/* =========================
   POST MENU
========================= */

.post-menu {
  position: relative;
}

.post-menu-btn {
  background: none;
  border: none;
  color: #9ca3af;
  font-size: 22px;
  cursor: pointer;
  padding: 4px 6px;
}

.post-menu-dropdown {
  position: absolute;
  right: 0;
  top: 28px;
  background: #020617;
  border-radius: 6px;
  min-width: 140px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4);
  display: none;
  z-index: 10;
}

.post-menu-item {
  padding: 10px 12px;
  font-size: 14px;
  color: #e5e7eb;
  cursor: pointer;
}

.post-menu-item:hover {
  background: #1e293b;
}

.post-menu-item.danger {
  color: #ef4444;
}

/* =========================
   FEED CONFIRM DIALOG
========================= */

.feed-confirm-overlay {
  position: fixed;
  inset: 0;
  z-index: 24000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 18px;
  background: rgba(2, 6, 23, 0.72);
  opacity: 0;
  pointer-events: none;
  backdrop-filter: blur(8px);
  transition: opacity 0.16s ease;
}

.feed-confirm-overlay.is-visible {
  opacity: 1;
  pointer-events: auto;
}

.feed-confirm-dialog {
  position: relative;
  width: min(390px, 100%);
  padding: 22px;
  border: 1px solid rgba(248, 113, 113, 0.22);
  border-radius: 8px;
  background:
    radial-gradient(circle at top left, rgba(239, 68, 68, 0.18), transparent 36%),
    #0f172a;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.52);
  color: #e5e7eb;
  transform: translateY(10px) scale(0.98);
  transition:
    transform 0.16s ease,
    opacity 0.16s ease;
}

.feed-confirm-overlay.is-visible .feed-confirm-dialog {
  transform: translateY(0) scale(1);
}

.feed-confirm-close {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.12);
  color: #cbd5e1;
  cursor: pointer;
  font-size: 22px;
  line-height: 1;
}

.feed-confirm-close:hover {
  background: rgba(148, 163, 184, 0.2);
  color: #fff;
}

.feed-confirm-icon {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  margin-bottom: 14px;
  border-radius: 999px;
  background: rgba(239, 68, 68, 0.16);
  color: #f87171;
  font-size: 20px;
}

.feed-confirm-dialog h2 {
  margin: 0;
  color: #fff;
  font-size: 21px;
  line-height: 1.2;
}

.feed-confirm-dialog p {
  margin: 10px 0 0;
  color: #cbd5e1;
  font-size: 14px;
  line-height: 1.45;
}

.feed-confirm-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 22px;
}

.feed-confirm-actions button {
  min-height: 40px;
  border: 0;
  border-radius: 8px;
  padding: 0 14px;
  font-weight: 700;
  cursor: pointer;
}

.feed-confirm-cancel {
  background: rgba(148, 163, 184, 0.14);
  color: #e5e7eb;
}

.feed-confirm-cancel:hover {
  background: rgba(148, 163, 184, 0.22);
}

.feed-confirm-delete {
  background: #dc2626;
  color: #fff;
}

.feed-confirm-delete:hover {
  background: #ef4444;
}

@media (max-width: 520px) {
  .feed-filter-tabs {
    grid-template-columns: repeat(6, minmax(58px, 1fr));
    gap: 4px;
    overflow-x: auto;
  }

  .feed-filter-tabs button {
    min-height: 38px;
    font-size: 13px;
  }

  .feed-filter-tabs .feed-filter-pulse::after {
    right: -3px;
  }

  .feed-page .feed-center {
    height: auto !important;
  }

  .pulse-create-hub {
    gap: 12px;
    padding: 12px;
  }

  .pulse-create-hub-header {
    align-items: flex-start;
  }

  .pulse-create-hub-icon {
    width: 38px;
    height: 38px;
    border-radius: 10px;
  }

  .pulse-create-hub h2 {
    font-size: 16px;
  }

  .pulse-create-options {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 5px;
    overflow: visible;
    white-space: normal;
  }

  .pulse-create-option {
    min-width: 0;
    min-height: 58px;
    grid-template-columns: 1fr;
    align-content: center;
    align-items: center;
    justify-items: center;
    gap: 5px;
    padding: 7px 3px;
    text-align: center;
  }

  .pulse-create-logo {
    width: 26px;
    height: 26px;
    border-radius: 8px;
  }

  .pulse-create-logo img {
    width: 19px;
    height: 19px;
  }

  .pulse-create-option strong {
    font-size: 11px;
    line-height: 1.1;
    overflow-wrap: normal;
    white-space: nowrap;
  }

  .pulse-create-option em {
    display: none;
  }

  .pulse-create-placeholder-body {
    align-items: flex-start;
    min-height: 82px;
    padding: 12px;
  }

  .platform-photo-grid {
    min-height: 120px;
  }

  .soshix-aura-action-panel {
    gap: 8px;
  }

  .soshix-aura-action {
    flex: 1 1 140px;
  }

  .soshix-aura-action-row {
    gap: 8px;
  }

  .soshix-aura-feed-tabs button {
    font-size: 12px;
    padding-inline: 8px;
  }

  .soshix-aura-view-tabs button {
    font-size: 11px;
    padding-inline: 4px;
  }

  .soshix-vox-view-tabs button {
    font-size: 11px;
    padding-inline: 4px;
  }

  .soshix-canvas-view-tabs button {
    font-size: 11px;
    padding-inline: 4px;
  }

  .soshix-aura-card-header {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .soshix-aura-open {
    display: none;
  }

  .soshix-aura-media.is-grid {
    grid-template-columns: 1fr;
    min-height: 260px;
  }

  .soshix-aura-media.is-grid .soshix-aura-media-item {
    min-height: 240px;
  }

  .soshix-aura-reel-preview {
    min-height: 360px;
  }

  .feed-confirm-overlay {
    align-items: flex-end;
    padding:
      14px
      14px
      calc(14px + env(safe-area-inset-bottom, 0px));
  }

  .feed-confirm-dialog {
    width: 100%;
  }

  .feed-confirm-actions {
    flex-direction: column-reverse;
  }

  .feed-confirm-actions button {
    width: 100%;
  }

  .soshix-flux-upload-modal {
    padding: 10px;
  }

  .soshix-canvas-upload-modal {
    padding: 10px;
  }

  .soshix-canvas-upload-dialog {
    width: 100%;
    height: calc(100vh - 20px);
    border-radius: 12px;
  }

  .soshix-canvas-upload-header {
    min-height: 46px;
    padding: 8px 10px;
  }

  .soshix-flux-upload-dialog {
    width: 100%;
    height: calc(100vh - 20px);
    border-radius: 12px;
  }

  .soshix-flux-upload-header {
    min-height: 46px;
    padding: 8px 10px;
  }
}

/* =========================
   CREATE POST MODAL
========================= */

.post-modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(2, 6, 23, 0.85);
  display: none;
  align-items: center;
  justify-content: center;
  padding: 16px;
  overflow-y: auto;
  z-index: 1000;
}

.post-modal-overlay.show {
  display: flex;
}

.mobile-post-composer-overlay {
  display: none;
}

.post-modal {
  width: 100%;
  max-width: 520px;
  background:
    radial-gradient(circle at 50% -10%, color-mix(in srgb, var(--soshix-platform-soshix) 18%, transparent), transparent 42%),
    linear-gradient(180deg, #1e2b45 0%, #142138 56%, #101b2f 100%);
  border: 2px solid color-mix(in srgb, var(--soshix-platform-soshix) 58%, rgba(255, 255, 255, 0.2));
  border-radius: 18px;
  padding: 16px;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.1) inset,
    0 0 0 6px color-mix(in srgb, var(--soshix-platform-soshix) 9%, transparent),
    0 0 48px color-mix(in srgb, var(--soshix-platform-soshix) 44%, transparent),
    0 34px 90px rgba(0, 0, 0, 0.86),
    0 70px 140px rgba(0, 0, 0, 0.72);

  max-height: calc(100vh - 32px);
  overflow: visible;
}

#postModal .post-modal {
  scrollbar-color: var(--soshix-platform-soshix) rgba(2, 6, 23, 0.42);
  scrollbar-width: thin;
  overflow-y: auto;
}

#postModal .post-modal::-webkit-scrollbar {
  width: 10px;
}

#postModal .post-modal::-webkit-scrollbar-track {
  background: rgba(2, 6, 23, 0.42);
  border-radius: 999px;
}

#postModal .post-modal::-webkit-scrollbar-thumb {
  background: color-mix(in srgb, var(--soshix-platform-soshix) 72%, #0f172a);
  border: 2px solid rgba(2, 6, 23, 0.82);
  border-radius: 999px;
}

#postModal .post-modal::-webkit-scrollbar-thumb:hover {
  background: var(--soshix-platform-soshix);
}

/* HEADER */
.post-modal-header {
  position: relative;
  text-align: center;
  padding-bottom: 8px;
}

.post-modal-header h3 {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
}

.close-modal {
  position: absolute;
  right: 0;
  top: 0;
  background: none;
  border: none;
  font-size: 26px;
  color: #9ca3af;
  cursor: pointer;
}

.close-share-modal {
  position: absolute;
  right: 0;
  top: 0;
  background: none;
  border: none;
  font-size: 26px;
  color: #9ca3af;
  cursor: pointer;
}

.close-share-modal:hover {
  color: #fff;
}

/* DIVIDER */
.post-modal-divider {
  border: none;
  border-top: 1px solid #1e293b;
  margin: 10px 0 14px;
}

/* USER ROW */
.post-modal-user {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}

.post-modal-avatar img,
.post-modal-avatar .avatar-fallback {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  object-fit: cover;
}

.post-modal-name {
  font-weight: 600;
  font-size: 14px;
  color: #e5e7eb;
}

.share-user-row {
  align-items: center;
}

.share-destination-wrap {
  margin-left: auto;
}

.share-destination-wrap select {
  min-height: 34px;
  padding: 6px 10px;
  border: 1px solid #1f2937;
  border-radius: 8px;
  background: #020617;
  color: #e5e7eb;
}

.share-friend-picker {
  margin-bottom: 12px;
}

.share-friend-picker input {
  width: 100%;
  min-height: 40px;
  padding: 9px 12px;
  border: 1px solid #1f2937;
  border-radius: 10px;
  background: #020617;
  color: #e5e7eb;
  outline: none;
}

.share-friend-picker input:focus {
  border-color: #3b82f6;
}

.share-friend-list {
  display: grid;
  gap: 6px;
  max-height: 220px;
  overflow-y: auto;
  margin-top: 8px;
}

.share-friend-option {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 8px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: #111827;
  color: #e5e7eb;
  cursor: pointer;
  text-align: left;
}

.share-friend-option:hover,
.share-friend-option.selected {
  border-color: #3b82f6;
  background: #172554;
}

.share-friend-option img,
.share-friend-option .avatar-fallback {
  width: 34px;
  height: 34px;
  flex: 0 0 auto;
}

.share-friend-empty {
  padding: 12px;
  color: #9ca3af;
  text-align: center;
}

.share-preview {
  max-height: 320px;
  overflow-y: auto;
  border: 1px solid #1f2937;
  border-radius: 10px;
  padding: 10px;
  margin-top: 12px;
  background: #020617;
}

#postModal .share-preview {
  max-height: none;
  overflow: visible;
}

/* TEXTAREA */
.post-modal textarea {
  width: 100%;
  min-height: 120px;
  background: #020617;
  color: #e5e7eb;
  border: none;
  border-radius: 8px;
  padding: 12px;
  resize: none;
  outline: none;
  font-size: 15px;
}

.post-emoji-wrap {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  margin-top: 8px;
}

.post-emoji-toggle {
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #1f2937;
  border-radius: 999px;
  background: #020617;
  color: #facc15;
  cursor: pointer;
  font-size: 18px;
}

.post-emoji-toggle:hover,
.post-emoji-toggle:focus-visible {
  background: #111827;
  border-color: #334155;
  outline: none;
}

.post-emoji-picker {
  position: absolute;
  right: 0;
  top: auto;
  bottom: 42px;
  z-index: 80;
  display: none;
  grid-template-columns: repeat(8, 1fr);
  gap: 6px;
  width: 340px;
  max-width: calc(100vw - 32px);
  max-height: min(320px, 48vh);
  overflow-y: auto;
  padding: 10px;
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 12px;
  background: #020617;
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.55);
}

.post-emoji-picker.is-open {
  display: grid;
}

.post-emoji-picker button {
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  cursor: pointer;
  font-size: 18px;
  line-height: 1;
}

.post-emoji-picker button:hover,
.post-emoji-picker button:focus-visible {
  background: #1f2937;
  outline: none;
}

/* FOOTER */
.post-modal-footer {
  display: flex;
  justify-content: flex-end;
  margin-top: 14px;
}

.post-btn {
  background: #2563eb;
  color: #fff;
  border: none;
  padding: 8px 16px;
  border-radius: 6px;
  cursor: pointer;
}

.post-btn.disabled,
.post-btn:disabled {
  background: #1e293b;
  color: #64748b;
  cursor: not-allowed;
  opacity: 0.8;
}

.post-like-count {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 0;
  margin-left: 0;
  color: #facc15;
  font-size: 14px;
  position: relative;
  cursor: pointer;
}

.post-like-count i {
  font-size: 16px;
}

/* =========================
   LIKE HOVER TOOLTIP
========================= */

.like-tooltip {
  position: absolute;
  bottom: 130%;
  left: 0;
  background: #020617;
  color: #e5e7eb;
  border-radius: 6px;
  padding: 8px 10px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.6);
  font-size: 13px;
  min-width: 140px;
  z-index: 50;
}

.like-tooltip ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.like-tooltip li {
  padding: 3px 0;
  white-space: nowrap;
}

.like-tooltip.hidden {
  display: none;
}

.post-like-count span {
  pointer-events: none;
}

.post-edited {
  color: #94a3b8;
  font-size: 12px;
  margin-left: 4px;
}

/* =========================
   COMMENT MODAL
========================= */

#commentModal {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.55);
  z-index: 9999;
  align-items: center;
  justify-content: center;
}

#commentModal .post-modal {
  width: 100%;
  max-width: 520px;
  max-height: calc(100vh - 32px);
  background: #0b1020;
  border-radius: 12px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.6);
  overflow: visible;
}

/* Header */
#commentModal .post-modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 16px;
}

#commentModal h3 {
  font-size: 16px;
  font-weight: 600;
  color: #e5e7eb;
}

.close-comment-modal {
  background: none;
  border: none;
  font-size: 22px;
  color: #9ca3af;
  cursor: pointer;
}

.close-comment-modal:hover {
  color: #fff;
}

/* Post context (what you're commenting on) */
.comment-post-context {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 12px 16px;
  background: #0f172a;
  border-radius: 8px;
  margin: 0 16px;
  margin-bottom: 12px;
}

.comment-post-author {
  font-size: 13px;
  font-weight: 600;
  color: #e5e7eb;
  margin-bottom: 4px;
}

.comment-post-content {
  font-size: 14px;
  color: #d1d5db;
  margin-top: 4px;
}

/* Comments list */
.comment-list {
  padding: 12px 16px;
  max-height: 260px;
  overflow-y: auto;
}

/* Individual comment */
.comment-item {
  margin-bottom: 12px;
}

.comment-author {
  font-size: 13px;
  font-weight: 600;
  color: #e5e7eb;
}

.comment-body {
  font-size: 14px;
  color: #e5e7eb;
  background: #111827;
  padding: 8px 10px;
  border-radius: 10px;
  margin-top: 2px;
  display: inline-block;
  max-width: 100%;
}

.comment-time {
  font-size: 12px;
  color: #9ca3af;
  margin-top: 2px;
  margin-left: 6px;
}

/* Empty / loading states */
.comment-loading,
.comment-empty,
.comment-error {
  font-size: 14px;
  color: #9ca3af;
  text-align: center;
  padding: 20px 0;
}

/* Comment form */
#commentForm {
  border-top: 1px solid #1f2937;
  padding: 12px 16px;
}

#commentForm textarea {
  width: 100%;
  min-height: 60px;
  resize: none;
  background: #111827;
  color: #e5e7eb;
  border: 1px solid #1f2937;
  border-radius: 10px;
  padding: 10px 12px;
  font-size: 14px;
}

#commentForm textarea:focus {
  outline: none;
  border-color: #3b82f6;
}

#commentForm .post-btn {
  margin-top: 8px;
  width: 100%;
}

#commentForm .comment-emoji-picker {
  right: 0;
}

.post-comment-count {
  margin-left: auto;
  cursor: pointer;
}

.comment-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
}

.comment-avatar img,
.comment-avatar .avatar-fallback {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  object-fit: cover;
}

.comment-avatar .avatar-fallback {
  background: #334155;
  color: #e5e7eb;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  font-size: 14px;
}

.comment-author {
  font-size: 13px;
  font-weight: 600;
  color: #e5e7eb;
}

/* =========================
   POST IMAGE UPLOAD ICON
========================= */

.post-media-upload {
  margin-top: 0;
}

.media-upload-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  cursor: pointer;
  font-size: 20px;
  color: #65676b;
  transition:
    background-color 0.2s ease,
    color 0.2s ease;
}

.media-upload-btn i {
  font-size: 1.3rem;
}

.media-upload-btn:hover {
  background-color: #f0f2f5;
  color: #1877f2;
}

.selected-image-name {
  font-size: 0.85rem;
  color: #555;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* =========================
   CREATE POST IMAGE PREVIEW (MULTI)
========================= */

.image-preview {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(90px, 1fr));
  gap: 8px;
  margin-top: 10px;
}

.image-preview.hidden {
  display: none;
}

.image-preview .preview-item {
  position: relative;
  width: 90px;
  height: 90px;
}

.image-preview .preview-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 8px;
  border: 1px solid #ddd;
}

/* Remove (X) button */
.image-preview .remove-image {
  position: absolute;
  top: 4px;
  right: 4px;
  z-index: 2;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: none;
  background: rgba(0, 0, 0, 0.7);
  color: #fff;
  font-size: 14px;
  line-height: 20px;
  cursor: pointer;
  padding: 0;
}

.image-preview .remove-image:hover {
  background: #e41e3f;
}

.video-preview {
  flex: 1 1 100%;
  margin-top: 10px;
}

.video-preview.hidden {
  display: none;
}

.video-preview-item {
  position: relative;
  width: 100%;
}

.video-preview-item video {
  display: block;
  width: 100%;
  max-height: 360px;
  border-radius: 8px;
  background: #020617;
}

.video-preview .remove-video {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 2;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  border: none;
  background: rgba(0, 0, 0, 0.72);
  color: #fff;
  font-size: 20px;
  line-height: 26px;
  cursor: pointer;
  padding: 0;
}

.video-preview .remove-video:hover {
  background: #e41e3f;
}

.hidden {
  display: none !important;
}

.post-media-grid {
  display: grid;
  gap: 4px;
  margin-top: 8px;
  border-radius: 8px;
  overflow: hidden;
  max-height: 420px;
}

.post-media-grid img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ===== LAYOUTS BY COUNT ===== */

.post-media-grid.count-1 {
  grid-template-columns: 1fr;
  aspect-ratio: auto;
  max-height: none;
}

.post-media-grid.count-2 {
  grid-template-columns: repeat(2, 1fr);
}

.post-media-grid.count-3 {
  grid-template-columns: 2fr 1fr;
}

.post-media-grid.count-3 .media-item:nth-child(1) {
  grid-row: span 2;
}

.post-media-grid.count-4,
.post-media-grid.count-5 {
  grid-template-columns: repeat(2, 1fr);
}

/* ===== MEDIA ITEM ===== */

.media-item {
  position: relative;
  aspect-ratio: 1 / 1;
  overflow: hidden;
}

/* ===== +1 OVERLAY (5 IMAGES) ===== */

.media-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
  color: #fff;
  font-size: 32px;
  font-weight: bold;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ===== SINGLE IMAGE (FULL HERO) ===== */

.post-media-grid.count-1 .media-item {
  aspect-ratio: auto;
}

.post-media-grid.count-1 img {
  width: 100%;
  height: auto;
  max-height: 70vh;
  object-fit: contain;
  background: #000;
}

/* CREATE-POST PREVIEW SIZE */
.post-modal .image-preview img {
  width: 100% !important;
  height: 90px !important;
  max-height: 90px !important;
  object-fit: cover !important;
}

/* =========================
   FEED VIDEO POSTS
========================= */

.post-media-grid video {
  width: 100%;
  max-height: 480px;
  border-radius: 8px;
  background: #000;
  object-fit: contain;
  display: block;
}

/* Ensure video never stretches grid weirdly */
.post-media-grid .media-item {
  overflow: hidden;
  border-radius: 8px;
}

/* Mobile safety */
@media (max-width: 768px) {
  .post-media-grid video {
    max-height: 300px;
  }
}

.video-wrapper {
  position: relative;
  width: 100%;
  max-height: 480px;
  overflow: hidden;
  border-radius: 8px;
  background: #000;
}

.video-thumb {
  width: 100%;
  display: block;
  border-radius: 8px;
}

.video-play-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.35);
  cursor: pointer;
}

.video-play-overlay i {
  font-size: 64px;
  color: #fff;
}

/* =========================
   SINGLE IMAGE OVERRIDES
========================= */

/* =========================
   COMMENT MODAL POST CONTEXT
========================= */

.comment-post-avatar {
  width: 44px;
  height: 44px;
  flex-shrink: 0;
  border-radius: 50%;
  overflow: hidden;
  background: #1f2937; /* matches your dark UI */
  display: flex;
  align-items: center;
  justify-content: center;
}

.comment-post-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.comment-post-avatar .avatar-fallback {
  color: #fff;
  font-weight: 600;
  font-size: 16px;
}

.comment-post-meta {
  display: flex;
  flex-direction: column;
}

.comment-delete-btn {
  margin-left: auto;
  background: none;
  border: none;
  padding: 4px 6px;

  font-size: 12px;
  font-weight: 500;
  color: #8a8d91;

  cursor: pointer;
  border-radius: 4px;

  opacity: 0.6;
  transition:
    opacity 0.15s ease,
    background-color 0.15s ease,
    color 0.15s ease;
}

.comment-delete-btn:hover {
  opacity: 1;
  background-color: #f0f2f5;
  color: #e41e3f;
}

.comment-delete-btn:active {
  background-color: #e4e6eb;
}

.post-count-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 8px;
  width: 100%;
}

.post-count-left {
  display: flex;
  align-items: center;
  gap: 6px;
}

.post-count-right {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  color: #9ca3af;
  cursor: pointer;
  margin-right: 4px;
}

/* =========================
   SUGGESTED FRIENDS
========================= */

.suggested-users {
  padding: 12px;
}

.suggested-header h3 {
  font-size: 16px;
  margin-bottom: 10px;
}

.suggested-row {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  scroll-behavior: smooth;
  padding-bottom: 4px;
}

.suggested-row::-webkit-scrollbar {
  height: 6px;
}

.suggested-row::-webkit-scrollbar-thumb {
  background: #374151;
  border-radius: 999px;
}

/* CARD */

.suggested-card {
  min-width: 120px;
  background: #1f2937;
  border-radius: 10px;
  padding: 10px;
  text-align: center;
  flex-shrink: 0;
}

.suggested-avatar img,
.suggested-avatar .avatar-fallback {
  width: 100%;
  height: 120px;
  object-fit: cover;
  margin-bottom: 0;
}

.suggested-name {
  font-size: 13px;
  color: #e5e7eb;
}

.suggested-add-btn {
  margin-top: 6px;
  padding: 6px;
  width: 100%;
  border: none;
  border-radius: 6px;
  background: #3b82f6;
  color: #fff;
  font-size: 13px;
  cursor: pointer;
}

.suggested-add-btn:hover {
  background: #2563eb;
}

.suggested-add-btn.cancel-request {
  background: #f59e0b;
  color: #111827;
}

.suggested-add-btn.cancel-request:hover {
  background: #d97706;
}

.suggested-add-btn.accept-request {
  background: #10b981;
  color: #ffffff;
}

.suggested-add-btn.accept-request:hover,
.suggested-add-btn.accept-request:focus-visible {
  background: #059669;
}

/* =========================
   SUGGESTED FRIENDS ARROWS
========================= */

.suggested-wrapper {
  position: relative;
  display: flex;
  align-items: center;
}

.suggested-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: none;
  background: rgba(31, 41, 55, 0.9);
  color: #fff;
  font-size: 22px;
  cursor: pointer;
  z-index: 2;

  display: flex;
  align-items: center;
  justify-content: center;

  transition:
    background 0.2s ease,
    transform 0.2s ease;
}

/* LEFT */
.suggested-arrow.left {
  left: -10px;
}

/* RIGHT */
.suggested-arrow.right {
  right: -10px;
}

/* HOVER */
.suggested-arrow:hover {
  background: #374151;
  transform: translateY(-50%) scale(1.1);
}

.group-avatar {
  width: 48px;
  height: 48px;
  border-radius: 8px; /* 🔥 NOT A CIRCLE */
  overflow: hidden;
}

.group-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.post-meta {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.post-author {
  font-weight: 600;
  font-size: 15px;
}

.post-subline {
  font-size: 13px;
  color: #9ca3af;
}

.feed-header {
  margin-bottom: 12px;
  padding: 0 4px;
}

.feed-header h2 {
  font-size: 20px;
  font-weight: 600;
  color: #fff;
}

.group-feed-container .group-avatar-fallback {
  width: 52px;
  height: 52px;
  border-radius: 10px;
  background: #374151;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  color: #fff;
  font-size: 18px;
}

.group-feed-container .post-avatar img {
  border-radius: 10px !important;
}

.group-link {
  color: inherit;
  text-decoration: none;
}

.group-link:hover {
  text-decoration: underline;
}

.post-subline {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: #9ca3af;
}

/* small avatar */
.sub-avatar {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  object-fit: cover;
}

/* fallback */
.sub-avatar-fallback {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #374151;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  color: #fff;
}

/* username */
.sub-username {
  color: #d1d5db;
  text-decoration: none;
  font-weight: 500;
}

.sub-username:hover {
  text-decoration: underline;
}

/* =========================
   SHARED POST
========================= */

.shared-post-embed {
  border: 1px solid #1f2937;
  border-radius: 10px;
  padding: 10px;
  margin-top: 10px;
  background: #020617;
}

/* HEADER */
.shared-post-header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}

/* AVATAR */
.shared-avatar img,
.shared-avatar .avatar-fallback {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  object-fit: cover;
}

/* META (name + time stacked) */
.shared-meta {
  display: flex;
  flex-direction: column;
}

/* NAME */
.shared-author a {
  font-weight: 600;
  font-size: 14px;
  color: #e5e7eb;
  text-decoration: none;
}

.shared-author a:hover {
  text-decoration: underline;
}

/* TIME */
.shared-time {
  font-size: 12px;
  color: #9ca3af;
}

/* CONTENT */
.shared-content p {
  margin: 6px 0 10px;
  font-size: 14px;
  color: #e5e7eb;
}

.post-action-btn.disabled {
  opacity: 0.5;
  cursor: not-allowed;
}