/* Screenshot feedback, 2026-11-02. Keep the existing page widths and assets. */
.spot-buddy {
  --readable-ink: #3e2f31;
  --readable-secondary: #62534b;
}

/* Goods, approval information and click ranking. */
.spot-buddy .commerce-main .section-heading p,
.spot-buddy .commerce-main .product-creator,
.spot-buddy .commerce-main .product-creator .approved,
.spot-buddy .commerce-main .product-price > span,
.spot-buddy .ranking-heading p,
.spot-buddy .ranking-note,
.spot-buddy .ranking-empty p,
.spot-buddy .product-rank-copy small,
.spot-buddy .product-rank-clicks {
  color: var(--readable-secondary);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.65;
}
.spot-buddy .commerce-main .product-info h3 { font-size: 17px; font-weight: 700; line-height: 1.55; }
.spot-buddy .commerce-main .product-price { gap: 8px; }
.spot-buddy .commerce-main .product-price strong { font-size: 24px; font-weight: 750; }
.spot-buddy .commerce-main .product-price strong small { font-size: 14px; font-weight: 600; }
.spot-buddy .commerce-main .trust-banner { padding: 20px; gap: 16px; }
.spot-buddy .commerce-main .trust-banner strong { color: var(--readable-ink); font-size: 17px; line-height: 1.6; }
.spot-buddy .commerce-main .trust-banner p { margin-top: 6px; color: var(--readable-secondary); font-size: 14px; font-weight: 500; line-height: 1.75; }
.spot-buddy .ranking-heading h2 { font-size: 22px; line-height: 1.5; }
.spot-buddy .ranking-kicker { color: var(--readable-secondary); font-size: 12px; }
.spot-buddy .product-rank-copy strong { color: var(--readable-ink); font-size: 15px; font-weight: 650; line-height: 1.6; }
.spot-buddy :is(.ranking-heading p,.product-rank-copy strong,.ranking-note) { word-break: keep-all; overflow-wrap: anywhere; }
.spot-buddy .product-rank-index { font-size: 18px; }
.spot-buddy .product-rank-clicks { align-self: flex-start; padding-top: 1px; }

/* Creator directory: channel audience and on-site members are distinct. */
.spot-buddy .room-card .room-open > p,
.spot-buddy .creator-size,
.spot-buddy .creator-size > span,
.spot-buddy .room-card-bottom,
.spot-buddy .room-card-bottom > span:last-child,
.spot-buddy .creator-total,
.spot-buddy .creator-favorites-note {
  color: var(--readable-secondary);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.65;
}
.spot-buddy .creator-size { flex-wrap: wrap; gap: 6px; }
.spot-buddy .creator-size > b { color: var(--readable-ink); font-weight: 700; }
.spot-buddy .room-card-bottom { gap: 12px; flex-wrap: wrap; }
.spot-buddy .room-card .room-open { padding-top: 20px; }
.spot-buddy .room-card .room-open > p { margin-top: 8px; }
.spot-buddy .room-card h3 { font-size: 20px; }
.spot-buddy .room-card .platform-badge { color: var(--readable-secondary); font-size: 14px; }
.spot-buddy .creator-directory .directory-intro p { color: var(--readable-secondary); font-size: 16px; line-height: 1.8; }
.spot-buddy .creator-directory :is(.platform-filters,.category-filters) button { color: var(--readable-secondary); font-size: 14px; }
.spot-buddy .creator-directory :is(.platform-filters,.category-filters) button.active { color: #93402e; }
.spot-buddy .creator-directory .search-form input { font-size: 16px; }

/* Fan identity stays text-only. Creator portraits in room links are retained. */
.spot-buddy .comm-article-author strong,
.spot-buddy .comm-reply strong { color: var(--readable-ink); font-size: 15px; font-weight: 650; }
.spot-buddy .comm-reply { display: block; }
.spot-buddy .comm-reply p { color: var(--readable-ink); font-size: 16px; line-height: 1.85; }
.spot-buddy .comm-reply time,
.spot-buddy .comm-article-author time,
.spot-buddy .comm-article-author a,
.spot-buddy .comm-replies > div > small,
.spot-buddy .comm-reply-note { color: var(--readable-secondary); font-size: 14px; line-height: 1.7; }
.spot-buddy .comm-reply strong { overflow-wrap: anywhere; }
.spot-buddy .comm-reply time { display: inline-block; }
.spot-buddy .comm-replies > div { flex-wrap: wrap; }
.spot-buddy .comm-side-card h2 { font-size: 18px; line-height: 1.6; }
.spot-buddy .comm-room-link > span { font-size: 15px; font-weight: 650; line-height: 1.6; }
.spot-buddy .comm-room-link small,
.spot-buddy .comm-guide p,
.spot-buddy .comm-side-card > .comm-text-link { color: var(--readable-secondary); font-size: 14px; font-weight: 500; line-height: 1.8; }
.spot-buddy .comm-room-link { padding-block: 16px; }

/* Creator profile: readable notices, post metadata and room information. */
.spot-buddy .creator-identity-platform,
.spot-buddy .creator-identity-platform > .platform-badge,
.spot-buddy .creator-identity-copy > p,
.spot-buddy .creator-identity-stats,
.spot-buddy .creator-identity-stats > small,
.spot-buddy .creator-post-heading,
.spot-buddy .creator-post-copy > small,
.spot-buddy .creator-post-meta,
.spot-buddy .creator-post-meta small,
.spot-buddy .creator-page-disclosure { color: var(--readable-secondary); font-size: 14px; font-weight: 500; line-height: 1.7; }
.spot-buddy .creator-identity-stats { gap: 10px 20px; }
.spot-buddy .creator-identity-stats b { color: var(--readable-ink); font-weight: 700; }
.spot-buddy .creator-identity-stats > small { flex-basis: 100%; }
.spot-buddy .creator-page-tabs button { font-size: 15px; min-height: 48px; color: var(--readable-secondary); }
.spot-buddy .creator-page-tabs button[aria-selected=true] { color: var(--creator-custom-ink,#93402e); }
.spot-buddy .creator-breadcrumb { color: var(--readable-secondary); font-size: 14px; }
.spot-buddy :is(.creator-sort select,.creator-board-search > label) { color: var(--readable-secondary); font-size: 14px; }
.spot-buddy .creator-write { color: #fff8ed; font-size: 14px; }
.spot-buddy .creator-board-search input { font-size: 16px; }
.spot-buddy .creator-post-copy > strong { color: var(--readable-ink); font-size: 17px; font-weight: 650; }
.spot-buddy .creator-post-copy > strong > b { font-size: 14px; color: #93402e; }
.spot-buddy .creator-post-copy > span { color: var(--readable-secondary); font-size: 14px; line-height: 1.75; }
.spot-buddy .creator-post-meta { flex-basis: 160px; }
.spot-buddy .creator-post-meta > b { color: var(--readable-ink); font-weight: 600; }
.spot-buddy .creator-pinned-notice { padding: 18px; gap: 14px; border: 1px solid #dfd4c5; border-left: 4px solid #b65d42; background: #fff; color: #93402e; }
.spot-buddy .creator-pinned-notice b { color: var(--readable-ink); font-size: 16px; font-weight: 700; }
.spot-buddy .creator-pinned-notice p { color: var(--readable-secondary); font-size: 14px; font-weight: 500; line-height: 1.8; }
.spot-buddy .creator-pinned-notice > span { flex-shrink: 0; padding: 4px 8px; border-radius: 4px; background: #f5e9d9; color: #6b3d24; font-size: 13px; font-weight: 650; }
.spot-buddy .creator-aside-card > p,
.spot-buddy .creator-welcome > div,
.spot-buddy .creator-other-rooms small,
.spot-buddy .creator-aside-product small { color: var(--readable-secondary); font-size: 14px; font-weight: 500; line-height: 1.8; }
.spot-buddy .creator-other-rooms b,
.spot-buddy .creator-aside-product strong { color: var(--readable-ink); font-size: 15px; font-weight: 650; line-height: 1.6; }
.spot-buddy .creator-aside-card h2 { font-size: 18px; line-height: 1.6; }
.spot-buddy .creator-aside-product b { font-size: 15px; color: #93402e; }

@media (max-width: 700px) {
  .spot-buddy .commerce-main .product-info h3 { font-size: 16px; }
  .spot-buddy .commerce-main .product-creator .approved,
  .spot-buddy .commerce-main .product-price > span { font-size: 13px; }
  .spot-buddy .commerce-main .product-price strong { font-size: 21px; }
  .spot-buddy .creator-size > span { margin-left: 0; flex-basis: 100%; }
  .spot-buddy .room-card-bottom > span:last-child { flex-basis: 100%; }
  .spot-buddy .creator-post-meta { flex-basis: auto; }
  .spot-buddy .creator-post-copy > strong { font-size: 16px; }
}


/* Creator imagery has its own size; fan replies continue to show nicknames only. */
.spot-buddy .avatar > .avatar-portrait {
  display: block; width: 100%; height: 100%; border-radius: 50%; object-fit: cover;
}
.spot-buddy.test-preview .room-card-top > .avatar {
  width: 72px; height: 72px; flex: 0 0 72px;
}
.spot-buddy .room-card-top > .avatar .online-dot {
  width: 14px; height: 14px; border: 2px solid #fffefb; right: 2px; bottom: 2px;
}
.spot-buddy .comm-room-link > .avatar {
  width: 48px; height: 48px; flex: 0 0 48px;
}
.spot-buddy .comm-article-author a[data-community-creator] > .avatar {
  width: 48px; height: 48px; flex: 0 0 48px;
}
.spot-buddy .comm-room-link,
.spot-buddy .comm-article-author a[data-community-creator] { gap: 12px; }
@media (max-width: 700px) {
  .spot-buddy.test-preview .room-card-top > .avatar {
    width: 56px; height: 56px; flex-basis: 56px;
  }
}
