.llx-qzone-page,
.llx-qzone-compose-page,
.llx-qzone-placeholder-page {
  min-height: 100%;
  background: #f3f6fb;
  color: #111827;
}

.app-view-panel__body--linglongxia .llx-qzone-page,
.app-view-panel__body--linglongxia .llx-qzone-compose-page,
.app-view-panel__body--linglongxia .llx-qzone-placeholder-page {
  margin: 0;
}

.llx-qzone-topbar {
  position: sticky;
  top: 0;
  z-index: 12;
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) 80px;
  align-items: center;
  gap: 8px;
  min-height: 58px;
  padding: 8px 14px 0;
  background: transparent;
}

.llx-qzone-topbar__back {
  width: 40px;
  height: 40px;
  border: none;
  border-radius: 999px;
  padding: 0;
  background: rgba(148, 163, 184, 0.22);
  color: #ffffff;
  font-size: 28px;
  line-height: 1;
  display: grid;
  place-items: center;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  box-shadow: none;
}

.llx-qzone-topbar__title-group {
  min-width: 0;
  text-align: center;
  pointer-events: none;
}

.llx-qzone-topbar__title-group strong {
  display: block;
  font-size: 18px;
  line-height: 1.25;
  font-weight: 800;
  color: #111111;
}

.llx-qzone-topbar__title-group span {
  display: block;
  margin-top: 2px;
  font-size: 11px;
  line-height: 1.4;
  color: rgba(17, 24, 39, 0.72);
  font-weight: 600;
}

.llx-qzone-topbar__right {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

.llx-qzone-topbar__spacer {
  width: 44px;
  height: 1px;
}

.qzone-page-content {
  position: relative;
  padding: 0 0 20px;
  background:
    radial-gradient(circle at 82% 7%, rgba(191, 219, 254, 0.22), transparent 20%),
    linear-gradient(180deg, #fbfdff 0%, #f2f6ff 18%, #ffffff 40%, #ffffff 100%);
}

.qzone-page-content::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(
      180deg,
      rgba(219, 234, 254, 0.12) 0%,
      rgba(219, 234, 254, 0.06) 16%,
      rgba(255, 255, 255, 0) 34%
    ),
    radial-gradient(circle at 16% 7%, rgba(255, 255, 255, 0.82), transparent 16%);
}

.qzone-cover-card,
.qzone-quick-nav-card,
.qzone-compose-card,
.qzone-feed-card {
  position: relative;
  z-index: 1;
  margin-left: 0;
  margin-right: 0;
  border: none;
  background: transparent;
  box-shadow: none;
}

.qzone-cover-card {
  padding: 0;
}

.qzone-cover-image {
  position: relative;
  min-height: 228px;
  padding: 86px 18px 12px;
  overflow: hidden;
  background-color: #f3f7ff;
  background-image: var(--qzone-cover-bg, none);
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
}

.qzone-cover-photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center bottom;
  display: block;
  z-index: 0;
  -webkit-mask-image: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 1) 48%,
    rgba(0, 0, 0, 0.96) 60%,
    rgba(0, 0, 0, 0.82) 72%,
    rgba(0, 0, 0, 0.56) 84%,
    rgba(0, 0, 0, 0.22) 94%,
    rgba(0, 0, 0, 0) 100%
  );
  mask-image: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 1) 48%,
    rgba(0, 0, 0, 0.96) 60%,
    rgba(0, 0, 0, 0.82) 72%,
    rgba(0, 0, 0, 0.56) 84%,
    rgba(0, 0, 0, 0.22) 94%,
    rgba(0, 0, 0, 0) 100%
  );
}

.qzone-cover-image::before,
.qzone-cover-image::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
}

.qzone-cover-image::before {
  width: 520px;
  height: 180px;
  left: -150px;
  top: -14px;
  background: radial-gradient(
    circle,
    rgba(255, 255, 255, 0.88) 0%,
    rgba(255, 255, 255, 0.06) 62%,
    transparent 100%
  );
}

.qzone-cover-image::after {
  width: 500px;
  height: 170px;
  right: -170px;
  top: -36px;
  background: radial-gradient(
    circle,
    rgba(191, 219, 254, 0.28) 0%,
    rgba(191, 219, 254, 0.05) 60%,
    transparent 100%
  );
}

.qzone-cover-image.has-custom-cover::before,
.qzone-cover-image.has-custom-cover::after {
  opacity: 0;
}

.qzone-cover-edit-hitarea {
  position: absolute;
  inset: 0;
  z-index: 1;
  border: none;
  padding: 0;
  background: transparent;
  box-shadow: none;
}

.qzone-cover-overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.02) 0%,
      rgba(255, 255, 255, 0.04) 18%,
      rgba(255, 255, 255, 0.08) 42%,
      rgba(255, 255, 255, 0.12) 68%,
      rgba(255, 255, 255, 0.18) 92%,
      rgba(255, 255, 255, 0.22) 100%
    ),
    radial-gradient(circle at 34% 22%, rgba(255, 255, 255, 0.14), transparent 20%);
}

.qzone-cover-image.has-custom-cover .qzone-cover-overlay {
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.qzone-profile-panel {
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 10px;
  z-index: 5;
  display: flex;
  align-items: center;
  gap: 14px;
  pointer-events: none;
}

.qzone-avatar {
  width: 88px;
  height: 88px;
  border-radius: 50%;
  object-fit: cover;
  background: transparent;
  box-shadow: 0 8px 20px rgba(148, 163, 184, 0.14);
}

.qzone-profile-info {
  flex: 1;
  min-width: 0;
}

.qzone-profile-topline {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-wrap: wrap;
}

.qzone-profile-topline strong {
  font-size: 24px;
  line-height: 1.2;
  color: #111827;
  font-weight: 800;
}

.qzone-vip-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 25px;
  padding: 0;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 136 92' fill='none'><path d='M33 24 40 15l6 9H33Zm17-8 7-12 7 12H50Zm18 0 7-12 7 12H68Zm18 0 7-12 7 12H86Zm17 8 6-9 7 9h-13Z' fill='%23FFA611'/><path d='M20 34 35 22h66l15 12-13 1.5-8 10.5H41l-8-10.5L20 34Z' fill='%23FFC126'/><path d='M35 22h66l-11 12H46L35 22Z' fill='%23FFE789'/><path d='M28 28 35 22l11 12-18-6Z' fill='%23FFB41A'/><path d='M108 28 101 22 90 34l18-6Z' fill='%23FFB41A'/><path d='M46 34h44L68 57 46 34Z' fill='%23F4C126'/><path d='M28 28h18l22 29-40-29Z' fill='%23FFD34E'/><path d='M108 28H90L68 57l40-29Z' fill='%23FFD34E'/><path d='M38 40h60' stroke='%23EA9A00' stroke-width='2.6' opacity='.45'/><text x='68' y='78' text-anchor='middle' font-family='Arial,Microsoft YaHei,sans-serif' font-size='21' font-weight='900' font-style='italic' fill='white' stroke='%23FF8A2A' stroke-width='3.8' paint-order='stroke fill'>年LV9</text></svg>");
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  color: transparent;
  font-size: 0;
  line-height: 1;
  transform: translateY(-1px);
}

.qzone-profile-info p,
.qzone-profile-signature {
  display: block;
  margin: 4px 0 2px;
  max-width: 100%;
  overflow: hidden;
  color: #374151;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.qzone-visitor-count {
  display: inline-block;
  font-size: 14px;
  color: #111827;
  font-weight: 700;
}

.qzone-header-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.qzone-icon-btn {
  width: 42px;
  height: 42px;
  border: none;
  border-radius: 999px;
  padding: 0;
  display: grid;
  place-items: center;
  background: rgba(148, 163, 184, 0.22);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

.qzone-icon {
  position: relative;
  display: block;
  width: 20px;
  height: 20px;
}

.qzone-icon-bell {
  background-position: center;
  background-repeat: no-repeat;
  background-size: 20px 20px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'><path d='M10 3.2c-2.5 0-4.5 2-4.5 4.5v2.1c0 .8-.2 1.6-.7 2.3l-.9 1.4h12.2l-.9-1.4c-.5-.7-.7-1.5-.7-2.3V7.7c0-2.5-2-4.5-4.5-4.5Z' stroke='%23ffffff' stroke-width='1.9' stroke-linejoin='round'/><path d='M7.6 14.5c.3 1.4 1.3 2.1 2.4 2.1 1.1 0 2.1-.7 2.4-2.1' stroke='%23ffffff' stroke-width='1.9' stroke-linecap='round'/></svg>");
}

.qzone-icon-gear::before,
.qzone-icon-gear::after {
  content: "";
  position: absolute;
  inset: 0;
  margin: auto;
  border-radius: 50%;
}

.qzone-icon-gear::before {
  width: 18px;
  height: 18px;
  background:
    radial-gradient(circle, transparent 0 4px, #ffffff 4px 6px, transparent 6px),
    conic-gradient(
      from 0deg,
      #ffffff 0deg 18deg,
      transparent 18deg 45deg,
      #ffffff 45deg 63deg,
      transparent 63deg 90deg,
      #ffffff 90deg 108deg,
      transparent 108deg 135deg,
      #ffffff 135deg 153deg,
      transparent 153deg 180deg,
      #ffffff 180deg 198deg,
      transparent 198deg 225deg,
      #ffffff 225deg 243deg,
      transparent 243deg 270deg,
      #ffffff 270deg 288deg,
      transparent 288deg 315deg,
      #ffffff 315deg 333deg,
      transparent 333deg 360deg
    );
}

.qzone-icon-gear::after {
  width: 6px;
  height: 6px;
  background: #ffffff;
}

.qzone-quick-nav-card {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0;
  margin-top: -32px;
  transform: translateY(-4px);
  padding: 38px 8px 6px;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.18) 18px,
    rgba(255, 255, 255, 0.68) 42px,
    rgba(255, 255, 255, 0.92) 64px,
    #ffffff 84px,
    #ffffff 100%
  );
}

.qzone-nav-item {
  border: none;
  background: transparent;
  box-shadow: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 8px 0;
  color: #111111;
  font-size: 12px;
  font-weight: 700;
}

.qzone-nav-icon {
  position: relative;
  width: 34px;
  height: 34px;
  display: block;
}

.qzone-nav-talk,
.qzone-nav-log,
.qzone-nav-photo,
.qzone-nav-message,
.qzone-nav-more {
  background-position: center;
  background-repeat: no-repeat;
  background-size: 28px 28px;
}

.qzone-nav-talk {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none'><path d='M6.2 6.8h12.9c2.3 0 4.1 1.8 4.1 4.1v5.5c0 2.3-1.8 4.1-4.1 4.1h-7.1l-3.8 3.2c-.5.4-1.2 0-.9-.7l1.1-2.5H6.2c-2.3 0-4.1-1.8-4.1-4.1v-5.5c0-2.3 1.8-4.1 4.1-4.1Z' stroke='%23111111' stroke-width='2.1' stroke-linejoin='round'/><circle cx='9.5' cy='13.7' r='1.1' fill='%23111111'/><circle cx='14' cy='13.7' r='1.1' fill='%23111111'/><circle cx='18.5' cy='13.7' r='1.1' fill='%23111111'/></svg>");
}

.qzone-nav-log {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none'><path d='M8.4 4.5h11.2c1.8 0 3.2 1.4 3.2 3.2v12.1c0 2-2.3 3-3.8 1.7L14 17.2l-5 4.3c-1.5 1.3-3.8.3-3.8-1.7V7.7c0-1.8 1.4-3.2 3.2-3.2Z' stroke='%23111111' stroke-width='2.1' stroke-linejoin='round'/><path d='M14 5.8v9.4' stroke='%23111111' stroke-width='2.1' stroke-linecap='round'/></svg>");
}

.qzone-nav-photo {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none'><rect x='3.3' y='5.6' width='21.4' height='16.8' rx='4.2' stroke='%23111111' stroke-width='2.1'/><circle cx='10.2' cy='11.6' r='2.3' stroke='%23111111' stroke-width='2.1'/><path d='M6.8 19.2l4.8-4.7 3.4 3.1 2.5-2.3 3.7 3.9' stroke='%23111111' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'/></svg>");
}

.qzone-nav-message {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none'><path d='M8.1 7.2h11.8c1.9 0 3.4 1.5 3.4 3.4v8.1c0 1.9-1.5 3.4-3.4 3.4H8.1c-1.9 0-3.4-1.5-3.4-3.4v-8.1c0-1.9 1.5-3.4 3.4-3.4Z' stroke='%23111111' stroke-width='2.1' stroke-linejoin='round'/><path d='M10.4 7.2V5.6c0-1.2 1-2.2 2.2-2.2h2.8c1.2 0 2.2 1 2.2 2.2v1.6' stroke='%23111111' stroke-width='2.1' stroke-linecap='round'/><path d='M10.6 14h6.8' stroke='%23111111' stroke-width='2.1' stroke-linecap='round'/></svg>");
}

.qzone-nav-more {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28' fill='none'><path d='M4.5 7.5h19' stroke='%23111111' stroke-width='2.2' stroke-linecap='round'/><path d='M4.5 14h19' stroke='%23111111' stroke-width='2.2' stroke-linecap='round'/><path d='M4.5 20.5h19' stroke='%23111111' stroke-width='2.2' stroke-linecap='round'/></svg>");
}

.qzone-compose-card {
  margin: 2px 16px 10px;
  min-height: 52px;
  padding: 0 116px 0 16px;
  border-radius: 18px;
  background: #ffffff;
  border: 1px solid #d9dee8;
  overflow: hidden;
}

.qzone-compose-link {
  width: 100%;
  border: none;
  padding: 0;
  display: block;
  color: inherit;
  text-align: left;
  background: transparent;
  box-shadow: none;
}

.qzone-compose-head {
  display: block;
}

.qzone-compose-input {
  width: 100%;
  height: 50px;
  border: none;
  padding: 0;
  font-size: 15px;
  color: #111827;
  background: transparent;
}

.qzone-compose-input-display {
  display: flex;
  align-items: center;
  color: #b0b7c3;
  font-weight: 600;
}

.qzone-compose-actions {
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
}

.qzone-compose-action {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 24px;
  padding: 0 8px;
  font-size: 11px;
  color: #4b5563;
  font-weight: 700;
}

.qzone-compose-action + .qzone-compose-action {
  border-left: 1px solid #e5e7eb;
}

.qzone-compose-icon {
  position: relative;
  width: 16px;
  height: 16px;
  display: inline-block;
}

.qzone-compose-icon-photo,
.qzone-compose-icon-star {
  background-position: center;
  background-repeat: no-repeat;
  background-size: 16px 16px;
}

.qzone-compose-icon-photo {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'><rect x='1.5' y='2' width='13' height='12' rx='3' stroke='%234b5563' stroke-width='1.6'/><circle cx='5.4' cy='6' r='1.4' stroke='%234b5563' stroke-width='1.6'/><path d='M3.3 11.3l2.9-2.8 2 1.9 1.7-1.6 2.7 2.8' stroke='%234b5563' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/></svg>");
}

.qzone-compose-icon-star {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'><path d='M8 1.7 9.7 5.2l3.8.5-2.8 2.6.7 3.8L8 10.3 4.6 12.1l.7-3.8-2.8-2.6 3.8-.5L8 1.7Z' fill='%234b5563'/></svg>");
}

.qzone-feed-card {
  margin: 0 0 16px;
  padding: 0;
}

.qzone-feed-list {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.qzone-post-card {
  padding: 16px;
  background: #ffffff;
  border-top: 1px solid #eef2f7;
}

.qzone-post-head {
  display: flex;
  align-items: center;
  gap: 12px;
}

.qzone-post-avatar {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  object-fit: cover;
  background: #f8fafc;
}

.qzone-post-meta {
  flex: 1;
  min-width: 0;
}

.qzone-post-meta strong {
  font-size: 16px;
  line-height: 1.3;
  color: #284c97;
  font-weight: 800;
}

.qzone-post-more-wrap {
  position: relative;
  display: flex;
  align-items: center;
}

.qzone-post-more-btn {
  border: none;
  background: transparent;
  box-shadow: none;
  padding: 2px 0 0;
  color: #111827;
  font-size: 22px;
  line-height: 1;
}

.qzone-post-action-menu {
  position: absolute;
  top: 50%;
  right: calc(100% + 8px);
  transform: translateY(-50%);
  z-index: 3;
}

.qzone-post-menu-btn {
  min-width: 56px;
  height: 32px;
  padding: 0 14px;
  border: 1px solid rgba(226, 232, 240, 0.95);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
  color: #ef4444;
  font-size: 13px;
  font-weight: 700;
}

.qzone-post-content {
  margin-top: 12px;
  font-size: 18px;
  line-height: 1.8;
  color: #111111;
  white-space: pre-wrap;
  word-break: break-word;
}

.qzone-post-mention {
  color: #4a72d8;
  font-weight: 700;
}

.qzone-post-gallery {
  margin-top: 12px;
  display: grid;
  gap: 6px;
}

.qzone-post-gallery.is-1 {
  width: 164px;
  grid-template-columns: 164px;
}

.qzone-post-gallery.is-2,
.qzone-post-gallery.is-4 {
  width: 232px;
  grid-template-columns: repeat(2, 113px);
}

.qzone-post-gallery.is-9 {
  width: 100%;
  max-width: 348px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.qzone-post-image {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 10px;
  background: linear-gradient(180deg, #dbeafe, #f8fafc);
}

.qzone-post-gallery.is-1 .qzone-post-image {
  width: 164px;
  height: 164px;
}

.qzone-post-tag-bar {
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.qzone-post-tag-chip {
  min-height: 28px;
  padding: 0 12px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #f3f4f6;
  color: #6b7280;
  font-size: 12px;
  font-weight: 700;
}

.qzone-post-interact {
  margin-top: 12px;
}

.qzone-post-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 6px;
}

.qzone-post-stats {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}

.qzone-post-time-inline,
.qzone-post-location-inline,
.qzone-post-visible-row {
  font-size: 12px;
  line-height: 1.5;
  color: #9ca3af;
  font-weight: 600;
}

.qzone-post-visible-row {
  margin-bottom: 8px;
}

.qzone-post-likes {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  line-height: 1.6;
  color: #325aab;
}

.qzone-post-like-inline-icon {
  width: 16px;
  height: 16px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 16px 16px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'><path d='M9.3 10.2V19.1H6.2c-.9 0-1.7-.8-1.7-1.7v-5.5c0-.9.8-1.7 1.7-1.7h3.1Z' stroke='%23111827' stroke-width='2' stroke-linejoin='round'/><path d='M9.3 10.2 12 4.8c.4-.9 1.5-1.2 2.3-.6.7.5 1 1.4.8 2.2l-.6 3h3.1c1.1 0 1.9 1 1.6 2.1l-1.2 5.6c-.2.8-.9 1.4-1.8 1.4H9.3' stroke='%23111827' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>");
}

.qzone-post-comments {
  margin-top: 4px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.qzone-post-comment {
  font-size: 13px;
  line-height: 1.6;
  color: #374151;
}

.qzone-post-comment strong {
  color: #325aab;
}

.qzone-post-comment-input-row {
  margin-top: 12px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 16px;
  background: #f8fafc;
}

.qzone-post-comment-input-avatar {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  object-fit: cover;
}

.qzone-post-comment-input {
  flex: 1;
  min-width: 0;
  height: 24px;
  border: none;
  padding: 0;
  background: transparent;
  color: #111827;
  font-size: 14px;
  line-height: 24px;
  outline: none;
}

.qzone-post-comment-input::placeholder {
  color: #9ca3af;
}

.qzone-post-actions {
  display: flex;
  align-items: center;
  gap: 14px;
}

.qzone-post-action-btn {
  border: none;
  background: transparent;
  box-shadow: none;
  padding: 0;
  width: 26px;
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.qzone-post-action-icon {
  width: 24px;
  height: 24px;
  display: inline-block;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 24px 24px;
}

.qzone-post-action-like .qzone-post-action-icon {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'><path d='M9.3 10.2V19.1H6.2c-.9 0-1.7-.8-1.7-1.7v-5.5c0-.9.8-1.7 1.7-1.7h3.1Z' stroke='%23111827' stroke-width='2' stroke-linejoin='round'/><path d='M9.3 10.2 12 4.8c.4-.9 1.5-1.2 2.3-.6.7.5 1 1.4.8 2.2l-.6 3h3.1c1.1 0 1.9 1 1.6 2.1l-1.2 5.6c-.2.8-.9 1.4-1.8 1.4H9.3' stroke='%23111827' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>");
}

.qzone-post-action-comment .qzone-post-action-icon {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'><path d='M12 4.8c-4.1 0-7.4 2.7-7.4 6.2 0 1.7.8 3.2 2.1 4.3l-.8 3.2 3.5-1.7c.8.2 1.7.4 2.6.4 4.1 0 7.4-2.7 7.4-6.2S16.1 4.8 12 4.8Z' stroke='%23111827' stroke-width='2' stroke-linejoin='round'/></svg>");
}

.qzone-post-action-repost .qzone-post-action-icon {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'><path d='M14.2 6.2 19 11l-4.8 4.8' stroke='%23111827' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/><path d='M18.4 11H10.7c-2.7 0-4.9 2.2-4.9 4.9V17.8' stroke='%23111827' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>");
}

.qzone-repost-modal-card {
  width: min(100%, 360px);
}

.qzone-repost-modal-body {
  gap: 14px;
}

.qzone-repost-textarea {
  min-height: 108px;
  resize: none;
  padding-top: 12px;
  padding-bottom: 12px;
  line-height: 1.6;
}

.qzone-repost-preview-box {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.qzone-repost-preview-label {
  font-size: 13px;
  color: #6b7280;
  font-weight: 700;
}

.qzone-repost-preview-card,
.qzone-repost-preview-card-inner,
.qzone-post-repost-card {
  border-radius: 14px;
  background: #f3f4f6;
}

.qzone-repost-preview-card-inner,
.qzone-post-repost-card {
  padding: 12px 12px 10px;
}

.qzone-post-repost-card {
  margin-top: 12px;
}

.qzone-post-repost-author {
  font-size: 14px;
  line-height: 1.5;
  color: #4b5563;
  font-weight: 700;
}

.qzone-post-repost-content {
  margin-top: 4px;
  font-size: 15px;
  line-height: 1.7;
  color: #374151;
  white-space: pre-wrap;
  word-break: break-word;
}

.qzone-post-repost-card .qzone-post-gallery,
.qzone-repost-preview-card-inner .qzone-post-gallery {
  margin-top: 10px;
}

.qzone-post-repost-meta {
  margin-top: 8px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  font-size: 12px;
  line-height: 1.5;
  color: #9ca3af;
  font-weight: 600;
}

.qzone-cover-top-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.llx-qzone-placeholder-page {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  background: linear-gradient(180deg, #f5f8ff 0%, #eef4ff 100%);
}

.llx-qzone-placeholder-card {
  width: calc(100% - 32px);
  margin: 36px auto 0;
  padding: 28px 22px;
  border-radius: 28px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 20px 40px rgba(84, 98, 130, 0.12);
  text-align: center;
}

.llx-qzone-placeholder-icon {
  width: 68px;
  height: 68px;
  margin: 0 auto 16px;
  border-radius: 20px;
  display: grid;
  place-items: center;
  background: #eef4ff;
  color: #7a92c2;
  font-size: 30px;
  font-weight: 700;
}

.llx-qzone-placeholder-card strong {
  display: block;
  font-size: 22px;
  line-height: 1.35;
  color: #1f2937;
  font-weight: 800;
}

.llx-qzone-placeholder-card p {
  margin: 12px 0 0;
  font-size: 14px;
  line-height: 1.8;
  color: #6b7280;
}

.llx-qzone-placeholder-back {
  min-width: 132px;
  min-height: 42px;
  margin-top: 22px;
  border: none;
  border-radius: 999px;
  padding: 0 18px;
  background: #111827;
  color: #ffffff;
  font-size: 14px;
  font-weight: 700;
}

@media (max-width: 480px) {
  .llx-qzone-topbar {
    grid-template-columns: 40px minmax(0, 1fr) 72px;
    min-height: 54px;
    padding: 8px 12px 0;
  }

  .llx-qzone-topbar__back,
  .qzone-icon-btn {
    width: 38px;
    height: 38px;
  }

  .qzone-cover-image {
    min-height: 214px;
    padding: 82px 14px 12px;
  }

  .qzone-profile-panel {
    left: 14px;
    right: 14px;
    bottom: 8px;
    gap: 12px;
  }

  .qzone-avatar {
    width: 82px;
    height: 82px;
  }

  .qzone-profile-topline strong {
    font-size: 22px;
  }

  .qzone-profile-info p,
  .qzone-visitor-count {
    font-size: 13px;
  }

  .qzone-quick-nav-card {
    margin-top: -28px;
    transform: translateY(-3px);
    padding: 34px 4px 6px;
  }

  .qzone-nav-item {
    gap: 8px;
  }

  .qzone-nav-icon {
    width: 32px;
    height: 32px;
  }

  .qzone-compose-card {
    margin: 2px 12px 10px;
    min-height: 48px;
    padding: 0 104px 0 14px;
    border-radius: 16px;
  }

  .qzone-compose-input {
    height: 46px;
    font-size: 14px;
  }

  .qzone-compose-actions {
    right: 6px;
  }

  .qzone-compose-action {
    gap: 3px;
    padding: 0 7px;
    font-size: 10px;
    height: 22px;
  }

  .qzone-post-card {
    padding: 14px 12px;
  }

  .qzone-post-avatar {
    width: 42px;
    height: 42px;
  }

  .qzone-post-meta strong {
    font-size: 15px;
  }

  .qzone-post-content {
    font-size: 16px;
    line-height: 1.75;
  }

  .qzone-post-gallery.is-1 {
    width: 136px;
    grid-template-columns: 136px;
  }

  .qzone-post-gallery.is-2,
  .qzone-post-gallery.is-4 {
    width: 208px;
    grid-template-columns: repeat(2, 101px);
  }

  .qzone-post-gallery.is-9 {
    max-width: 312px;
  }

  .qzone-post-gallery.is-1 .qzone-post-image {
    width: 136px;
    height: 136px;
  }

  .llx-qzone-placeholder-card {
    width: calc(100% - 24px);
    margin-top: 28px;
    padding: 24px 18px;
    border-radius: 24px;
  }

  .llx-qzone-placeholder-card strong {
    font-size: 20px;
  }
}