.page-community,
.page-analysis,
.page-music {
  --community-accent: #d9818f;
  --community-accent-strong: #b95f75;
  --community-glow: rgba(241, 155, 122, 0.16);
}

.page-community .group-page,
.page-analysis .pg,
.page-music .music-page {
  width: min(1120px, calc(100% - 32px));
  margin: 0 auto;
  padding-top: 104px;
}

.page-community .group-hero h1,
.page-community .announcement h2,
.page-community .msg-section h2,
.page-analysis h1,
.page-analysis .section-title,
.page-music .artist-info h1,
.page-music .player-section h2,
.page-music .songs-section h2 {
  color: var(--shell-ink);
  font-family: var(--font-display);
  letter-spacing: -0.02em;
}

.page-community .group-hero h1 {
  font-size: clamp(58px, 10vw, 126px);
}

.page-community .group-hero p,
.page-community .qr-panel p,
.page-community .section-note,
.page-analysis .sub,
.page-music .artist-role,
.page-music .artist-stats span {
  color: var(--shell-muted);
}

.page-community .group-badges span,
.page-community .qr-panel,
.page-community .announcement,
.page-community .join-note,
.page-community .msg-form,
.page-community .msg-item,
.page-community .group-music,
.page-analysis .stat-card,
.page-analysis table,
.page-analysis .detail-card,
.page-analysis .tag-cloud,
.page-music .aplayer-wrap,
.page-music .song-item,
.page-music .ext-link {
  border: 1px solid var(--shell-line);
  border-radius: var(--shell-radius);
  background:
    radial-gradient(circle at 84% 10%, var(--community-glow), transparent 220px),
    var(--shell-glass);
  box-shadow: var(--shell-shadow-soft), inset 0 1px 0 rgba(255, 255, 255, 0.52);
  -webkit-backdrop-filter: blur(24px) saturate(145%);
  backdrop-filter: blur(24px) saturate(145%);
}

.page-community .group-badges strong,
.page-community .qr-panel h2,
.page-community .msg-form label,
.page-community .msg-item p,
.page-analysis .detail-card h3,
.page-music .artist-stats strong,
.page-music .song-info strong,
.page-music .ext-title {
  color: var(--shell-ink);
  font-family: var(--font-body);
  font-weight: 650;
}

.page-community .primary-action,
.page-community .text-action,
.page-community .mini-btn,
.page-analysis .tab,
.page-analysis .csv-btn,
.page-music .primary-action,
.page-music .text-action,
.page-music .song-play-btn {
  min-height: 42px;
  border-color: var(--shell-line-soft);
  border-radius: 999px;
  background: var(--shell-glass);
  color: var(--shell-ink);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

.page-community .primary-action,
.page-analysis .tab.active,
.page-music .primary-action {
  border-color: rgba(255, 255, 255, 0.34);
  background: linear-gradient(125deg, var(--community-accent), var(--community-accent-strong));
  color: #fff;
  box-shadow: 0 12px 28px rgba(190, 102, 142, 0.24);
}

.page-community .qr-panel {
  padding: 18px;
}

.page-community .qr-panel img {
  border-radius: 20px;
}

.page-community .announcement,
.page-community .msg-section {
  border-color: var(--shell-line-soft);
}

.page-community .announcement article {
  color: var(--shell-ink);
  font-family: var(--font-body);
}

.page-community .msg-name,
.page-community .msg-form textarea {
  border-color: var(--shell-line-soft);
  border-radius: 15px;
  background: rgba(255, 255, 255, 0.26);
  color: var(--shell-ink);
}

html[data-theme="dark"] .page-community .msg-name,
html[data-theme="dark"] .page-community .msg-form textarea {
  background: rgba(3, 8, 18, 0.26);
}

.page-community .group-music {
  padding: 28px 24px 24px;
}

.page-community .group-music .aplayer,
.page-music .aplayer-wrap .aplayer {
  background: rgba(255, 255, 255, 0.58) !important;
  border-radius: 22px !important;
  color: var(--shell-ink) !important;
  font-family: var(--font-body) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
}

html[data-theme="dark"] .page-community .group-music .aplayer,
html[data-theme="dark"] .page-music .aplayer-wrap .aplayer {
  background: rgba(8, 15, 30, 0.68) !important;
}

/* Analysis */
.page-analysis > .site-header {
  display: none !important;
}

.page-analysis .pg {
  max-width: 1100px;
  padding-bottom: 100px;
}

.page-analysis h1 {
  font-size: clamp(40px, 6vw, 68px);
}

.page-analysis .stat-cards {
  gap: 14px;
}

.page-analysis .stat-card {
  padding: 22px;
}

.page-analysis .stat-card .val {
  color: var(--community-accent);
  font-family: var(--font-display);
}

.page-analysis .tabs {
  padding: 5px;
  border: 1px solid var(--shell-line);
  border-radius: 999px;
  background: var(--shell-glass);
  width: fit-content;
  box-shadow: var(--shell-shadow-soft);
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
}

.page-analysis .tab {
  border: 0;
  box-shadow: none;
}

.page-analysis #tab-leaderboard {
  max-width: 100%;
  overflow-x: auto;
  padding-bottom: 8px;
  border-radius: var(--shell-radius);
}

.page-analysis table {
  min-width: 760px;
  overflow: hidden;
}

.page-analysis td,
.page-analysis th {
  border-color: var(--shell-line-soft);
}

.page-analysis th {
  background: rgba(217, 129, 143, 0.11);
  color: var(--community-accent-strong);
}

.page-analysis select,
.page-analysis input[type="range"] {
  max-width: 100%;
  border-color: var(--shell-line-soft);
  border-radius: 999px;
  background: var(--shell-glass-strong);
  color: var(--shell-ink);
}

.page-analysis .tag-cloud {
  padding: 22px;
}

/* Music */
.page-music .music-page {
  padding-bottom: 88px;
}

.page-music .artist-hero {
  position: relative;
  padding: clamp(24px, 5vw, 46px);
  border: 1px solid var(--shell-line);
  border-radius: 38px;
  background: var(--shell-glass);
  box-shadow: var(--shell-shadow), inset 0 1px 0 rgba(255, 255, 255, 0.52);
  -webkit-backdrop-filter: blur(28px) saturate(150%);
  backdrop-filter: blur(28px) saturate(150%);
}

.page-music .artist-avatar {
  position: relative;
  border: 1px solid rgba(255, 255, 255, 0.55);
  background:
    radial-gradient(circle at 34% 28%, rgba(255, 255, 255, 0.72), transparent 18%),
    conic-gradient(from 45deg, #445d61, var(--community-accent), #233a42, var(--shell-cyan), var(--shell-peach), #445d61);
  box-shadow:
    inset 0 -18px 34px rgba(5, 10, 26, 0.3),
    0 22px 54px rgba(64, 78, 128, 0.24);
}

.page-music .artist-avatar::after {
  content: "";
  position: absolute;
  inset: 28%;
  border: 1px solid rgba(255, 255, 255, 0.36);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.14);
  box-shadow: inset 0 0 24px rgba(255, 255, 255, 0.2);
}

.page-music .artist-info h1 {
  font-size: clamp(42px, 6vw, 72px);
}

.page-community .group-hero h1,
.page-analysis h1,
.page-music .artist-info h1 {
  text-shadow: 0 12px 34px rgba(74, 94, 92, 0.12);
}

.page-music .aplayer-wrap {
  padding: 10px;
  overflow: hidden;
}

.page-music .external-links {
  gap: 14px;
}

.page-music .ext-link {
  padding: 24px;
}

.page-music .site-footer {
  border-color: var(--shell-line);
  border-radius: var(--shell-radius);
  background: var(--shell-glass);
  color: var(--shell-muted);
  -webkit-backdrop-filter: blur(22px);
  backdrop-filter: blur(22px);
}

@media (max-width: 860px) {
  .page-community .group-page,
  .page-analysis .pg,
  .page-music .music-page {
    width: min(100% - 20px, 1120px);
    padding-top: 52px;
  }

  .page-analysis .stat-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .page-analysis .tabs {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border-radius: 22px;
  }

  .page-analysis .tab {
    padding-inline: 8px;
  }
}

@media (max-width: 620px) {
  .page-community .group-hero h1 {
    font-size: clamp(62px, 22vw, 88px);
  }

  .page-community .announcement,
  .page-community .msg-form,
  .page-community .msg-item {
    padding: 20px;
  }

  .page-analysis .stat-card {
    min-width: 0;
    padding: 18px 14px;
  }

  .page-analysis .stat-card .val {
    font-size: clamp(24px, 8vw, 34px);
  }

  .page-analysis table {
    min-width: 680px;
  }

  .page-music .artist-hero {
    grid-template-columns: 1fr;
    text-align: center;
  }

  .page-music .artist-avatar {
    margin: 0 auto;
  }

  .page-music .artist-stats,
  .page-music .artist-actions {
    justify-content: center;
  }
}
