/* Activity cards share the homepage colour tokens and page width. */
.activity-page-list { display: grid; gap: 24px; width: calc(100% - 48px); max-width: 1140px; margin: 0 auto; padding: 8px 0 24px; }
.activity-page-empty { padding: 48px 24px; text-align: center; color: var(--home-muted); }
.activity-page-image-frame { display: flex; align-items: center; min-height: 360px; border: 1px solid var(--home-line); border-radius: 16px; overflow: hidden; background: var(--home-panel); }
.activity-page-card { position: relative; overflow: hidden; border: 1px solid var(--home-line); border-radius: 22px; background: var(--home-panel); box-shadow: 0 14px 40px rgba(65, 48, 128, .09), inset 0 1px 0 rgba(255,255,255,.35); }
.activity-page-card::before { content: ""; position: absolute; top: 0; left: 24px; right: 24px; height: 2px; background: linear-gradient(90deg, transparent, var(--home-primary), var(--home-accent), transparent); opacity: .6; }
.activity-page-card-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 10px 24px; border-bottom: 1px solid var(--home-line); background: linear-gradient(110deg, color-mix(in srgb, var(--home-primary) 7%, transparent), transparent); }
.activity-page-title-group { display: flex; align-items: center; gap: 12px; min-width: 0; }
.activity-page-number { display: grid; place-items: center; flex-shrink: 0; width: 38px; height: 38px; border-radius: 12px; background: linear-gradient(135deg, var(--home-primary), color-mix(in srgb, var(--home-primary) 60%, var(--home-accent))); color: #fff; font-size: 15px; font-weight: 800; box-shadow: 0 4px 12px color-mix(in srgb, var(--home-primary) 22%, transparent); }
.activity-page-card-heading h1 { margin: 0; color: var(--home-text); font-size: 21px; font-weight: 750; line-height: 1.4; letter-spacing: .5px; }
.activity-page-status { display: inline-flex; align-items: center; gap: 7px; flex-shrink: 0; padding: 5px 11px; border: 1px solid var(--home-line); border-radius: 30px; color: var(--home-muted); background: var(--home-solid); font-size: 12px; }
.activity-page-status i { width: 6px; height: 6px; border-radius: 50%; background: var(--home-primary); opacity: .7; }
.activity-page-card-body { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: 80px; align-items: stretch; padding: 24px; }
.activity-page-card-body > section { min-width: 0; }
.activity-page-card-body h2 { display: flex; align-items: center; gap: 8px; margin: 0 0 14px; color: var(--home-text); font-size: 14px; font-weight: 700; }
.activity-page-card-body h2::before { content: ""; width: 3px; height: 13px; border-radius: 2px; background: var(--home-primary); }
.activity-page-image-placeholder { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 360px; gap: 16px; border: 1px dashed var(--home-line); border-radius: 16px; color: var(--home-muted); background: radial-gradient(ellipse at 15% 10%, color-mix(in srgb, var(--home-primary) 10%, transparent), transparent 65%), linear-gradient(135deg, var(--home-solid), color-mix(in srgb, var(--home-accent) 4%, var(--home-solid))); }
.activity-page-image-placeholder svg { box-sizing: content-box; padding: 16px; border: 1px solid var(--home-line); border-radius: 20px; color: var(--home-primary); background: var(--home-panel); box-shadow: 0 6px 16px rgba(65,48,128,.05); }
.activity-page-image-placeholder p { margin: 0; font-size: 13px; }
.activity-page-image img { display: block; width: 100%; height: auto; border-radius: 14px; }
.activity-page-content { position: relative; margin: 0; }
.activity-page-content::before { content: ""; position: absolute; top: 0; bottom: 0; left: -40px; width: 1px; background: var(--home-line); }
.activity-page-description { min-height: 360px; padding: 20px; border: 1px solid color-mix(in srgb, var(--home-line) 65%, transparent); border-radius: 16px; background: color-mix(in srgb, var(--home-solid) 55%, transparent); }
.activity-page-content p { margin: 0; color: var(--home-muted); line-height: 1.8; overflow-wrap: anywhere; white-space: pre-line; }
@media (max-width: 768px) {
  .activity-page-list { width: calc(100% - 28px); }
}
@media (max-width: 600px) {
  .activity-page-card { border-radius: 16px; }
  .activity-page-card-heading { padding: 8px 16px; }
  .activity-page-card-heading h1 { font-size: 18px; overflow-wrap: anywhere; }
  .activity-page-title-group { gap: 8px; }
  .activity-page-card-body { grid-template-columns: minmax(0, 1fr); padding: 16px; gap: 24px; }
  .activity-page-content::before { display: none; }
  .activity-page-image-placeholder { min-height: 260px; }
  .activity-page-image-frame { min-height: 0; }
  .activity-page-description { min-height: 0; padding: 16px; }
  .activity-page-image-placeholder svg { width: 32px; height: 32px; padding: 12px; }
}
