.detail-hero { position: relative; margin: -12px -16px 12px; }
.detail-cover-wrap { max-height: 220px; overflow: hidden; }
.detail-cover-wrap .media-cover { min-height: 200px; }
.detail-cover { width: 100%; max-height: 220px; object-fit: cover; }
.detail-hero-info { padding: 12px 16px; background: #fff; }
.detail-hero-info h1 { font-size: 1.2rem; }
.fav-btn { margin-top: 8px; border: 1px solid #cbd5e1; background: #fff; border-radius: 999px; padding: 6px 14px; cursor: pointer; }
.fav-btn.active { color: #eab308; border-color: #eab308; }
.detail-tabs { display: flex; gap: 4px; margin-bottom: 12px; border-bottom: 1px solid #e2e8f0; }
.detail-tab {
  flex: 1; border: none; background: none; padding: 10px 4px; cursor: pointer;
  border-bottom: 2px solid transparent; font-size: 0.85rem;
}
.detail-tab.active { border-bottom-color: var(--color-primary); color: var(--color-primary); font-weight: 600; }
.detail-content { background: #fff; border-radius: var(--radius); padding: 16px; min-height: 120px; }
.rich-text p { margin-bottom: 8px; }
.moments-tab { display: flex; flex-wrap: wrap; gap: 8px; }
.moment-thumb-wrap { width: calc(50% - 4px); cursor: pointer; aspect-ratio: 1; }
.moment-thumb { width: calc(50% - 4px); display: inline-block; margin: 2px; border-radius: 8px; cursor: pointer; }
.award-item { padding: 8px 0; border-bottom: 1px solid #f1f5f9; }
.participant-tag {
  display: inline-block; background: #f1f5f9; border-radius: 999px; padding: 4px 10px;
  font-size: 0.75rem; margin: 4px 4px 0 0;
}
.detail-actions { display: flex; gap: 8px; margin: 16px 0; }