.participation-page { max-width: 1180px; }
.participation-heading { max-width: 860px; margin-inline: auto; }
.participation-kicker,
.participation-section-kicker { color: #8ee6ef; font-size: .72rem; font-weight: 800; letter-spacing: .16em; }
.participation-heading h1 { letter-spacing: -.045em; }
.participation-heading h1 span { color: #8ee6ef; }
.participation-heading .lead { max-width: 720px; font-size: 1rem; line-height: 1.7; }
.participation-global,
.activity-participation-card { border: 1px solid rgba(142, 230, 239, .15); border-radius: 22px; background: linear-gradient(145deg, rgba(18, 39, 57, .92), rgba(10, 19, 32, .95)); box-shadow: 0 22px 60px rgba(0, 0, 0, .22); }
.participation-section-kicker { display: block; margin-bottom: 8px; color: #ffca79; font-size: .64rem; }
.participation-total { display: inline-flex; align-items: center; gap: 7px; border: 1px solid rgba(142, 230, 239, .2); border-radius: 999px; padding: 8px 13px; color: #d5edf1; font-size: .75rem; }
.participation-total i { color: #8ee6ef; }
.participation-table { --bs-table-bg: transparent; --bs-table-color: #eaf4f7; --bs-table-border-color: rgba(255, 255, 255, .08); }
.participation-table thead th { color: #98afbc; font-size: .67rem; letter-spacing: .1em; text-transform: uppercase; }
.participation-table tbody th { font-weight: 700; }
.participation-rank { display: inline-grid; width: 32px; height: 32px; place-items: center; border: 1px solid rgba(142, 230, 239, .22); border-radius: 50%; color: #8ee6ef; font-size: .75rem; }
.participation-empty { color: #d5e6ec; }
.participation-empty > span { display: block; margin-bottom: 12px; color: #ffca79; font-size: 2rem; }
.participation-join { border: 1px solid rgba(142, 230, 239, .15); border-radius: 22px; background: linear-gradient(145deg, rgba(18, 39, 57, .92), rgba(10, 19, 32, .95)); box-shadow: 0 22px 60px rgba(0, 0, 0, .22); }
.participation-join-icon { margin-bottom: 10px; font-size: 2rem; }
.participation-join p { max-width: 620px; margin-inline: auto; }
.participation-join .btn-create-profile {
  min-height: 46px;
  border: 0;
  background: linear-gradient(135deg, #48cae4 0%, #00b4d8 100%);
  box-shadow: 0 4px 12px rgba(0, 180, 216, .4);
  color: #fff;
  font-weight: 700;
  transition: all .3s ease;
}
.participation-join .btn-create-profile:hover {
  transform: translateY(-2px);
  background: linear-gradient(135deg, #00b4d8 0%, #0096c7 100%);
  box-shadow: 0 6px 20px rgba(0, 180, 216, .6);
  color: #fff;
}
.activity-participation-card { display: flex; flex-direction: column; overflow: hidden; padding: 22px; }
.activity-card-heading { padding-bottom: 17px; border-bottom: 1px solid rgba(255, 255, 255, .08); }
.activity-period { display: inline-block; margin-bottom: 9px; color: #ffca79; font-size: .63rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.activity-card-heading h3 { margin: 0 0 11px; font-size: 1.28rem; font-weight: 800; }
.activity-participant-count { color: #a6c3cf; font-size: .72rem; }
.activity-participant-count i { margin-right: 4px; color: #8ee6ef; }
.activity-participant-list { display: grid; gap: 9px; margin: 0; padding: 17px 0; list-style: none; }
.activity-participant-list li { display: flex; align-items: center; gap: 8px; color: #e0edf2; font-size: .8rem; overflow-wrap: anywhere; }
.activity-participant-list li i { color: #8ee6ef; }
.activity-no-participants { padding: 18px 0; color: #9db0bb; font-size: .78rem; }
.activity-open-link { display: inline-flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: auto; border-top: 1px solid rgba(255, 255, 255, .08); padding-top: 15px; color: #8ee6ef; font-size: .76rem; font-weight: 700; text-decoration: none; }
.activity-open-link:hover { color: #fff; }
.participation-back .btn { min-height: 44px; }

@media (max-width: 575.98px) {
  .participation-page { padding-top: 2.5rem !important; }
  .participation-heading h1 { font-size: 2.5rem; }
  .participation-heading .lead { font-size: .88rem; }
  .participation-global { border-radius: 16px; padding: 18px !important; }
  .participation-join { border-radius: 16px; padding: 22px !important; }
  .participation-table { font-size: .82rem; }
  .participation-table thead th { font-size: .58rem; }
  .activity-participation-card { border-radius: 17px; padding: 18px; }
}