/* Admin Membership tab (membership.js). Builds on theme.css and the dashboard's inline styles. */
.ms-nav { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0 22px; }
.ms-pill { background: rgba(10, 18, 34, .5); border: 1px solid var(--line); color: var(--dim); font: inherit; font-size: .85rem; padding: 7px 14px; border-radius: 99px; cursor: pointer; transition: color .2s, border-color .2s, background-color .2s; }
.ms-pill:hover { color: var(--text); border-color: var(--accent); }
.ms-pill[aria-current="true"] { color: var(--accent-ink); background: var(--accent); border-color: var(--accent); }
.ms-panel .hint { margin: 0 0 16px; }

.ms-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 14px; }
.ms-stat b { display: block; font-family: var(--mono); font-size: 1.9rem; font-weight: 500; color: var(--accent); margin-top: 8px; letter-spacing: -.02em; }
.ms-stat small { display: block; color: var(--dim); font-size: .82rem; margin-top: 4px; }
.ms-bar { margin: 16px 0 6px; height: 8px; }
.ms-panel h3.hud-label { display: block; margin: 28px 0 12px; font-weight: normal; font-size: .78rem; }

.ms-panel td .progress { width: 120px; margin-top: 6px; }
tr.ms-past td { opacity: .6; }
tr.ms-current td { background: var(--accent-soft); }
.ms-inline { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 14px; align-items: end; }

.ms-form { margin-bottom: 18px; }
.ms-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px 18px; margin: 14px 0; align-items: end; }
.ms-field { display: block; color: var(--dim); font-size: .85rem; }
.ms-field small { color: #6c7386; }
.ms-field .hud { margin-top: 6px; }
.ms-form .hud-label.sub { display: block; margin-top: 22px; }
.ms-code { font-family: var(--mono); color: var(--accent); letter-spacing: .06em; }
.ms-panel .a { color: var(--dim); font-size: .82rem; }
.status.ms-test { color: #c9a0f0; border-color: #4a3a5e; }

.ms-newgroup .hud { flex: 0 1 220px; }
.ms-newgroup .hud.grow { flex: 1 1 260px; }
.ms-groups { display: grid; gap: 14px; }
.ms-group strong { font-size: 1.02rem; }
.ms-group .hint { margin: 4px 0 0; font-size: .86rem; }
.ms-members ul { margin: 14px 0 0; padding-left: 18px; columns: 2 260px; color: var(--text); }
.ms-members li { margin: 3px 0; break-inside: avoid; }
.ms-members small { color: var(--dim); }

@media (max-width: 600px) {
  .ms-stat b { font-size: 1.5rem; }
  .ms-panel td .progress { width: 80px; }
}