.race-tabs-pill {
    background: var(--color-glass-bg);
    backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    border-radius: 22px;
    border: 1px solid var(--color-glass-border);
    box-shadow: 0 2px 16px var(--color-shadow-soft);
    padding: 6px 4px;
    display: flex;
  }
  .race-tabs-pill .nav { gap: 2px; flex-wrap: nowrap; width: 100%; }
  .race-tabs-pill .nav-item { flex: 1; }
  .race-tab-btn {
    width: 100%; display: flex; flex-direction: column; align-items: center;
    gap: 4px; padding: 6px 12px 5px; border: none; border-radius: 16px;
    background: none; color: var(--color-text-faint); text-decoration: none;
    transition: color .15s, background .15s;
  }
  .race-tab-btn:hover { color: var(--color-text-secondary); }
  .race-tab-btn.active {
    color: var(--color-text-primary); background: var(--color-white);
    box-shadow: 0 2px 8px var(--color-shadow-medium), 0 1px 2px var(--color-shadow-light);
  }
  .race-tab-icon-wrap { position: relative; display: inline-flex; }
  .race-tab-icon-bg {
    width: 46px; height: 46px; border-radius: 14px;
    display: flex; align-items: center; justify-content: center; font-size: 22px;
    transition: background .18s, color .18s, transform .15s;
  }
  .race-tab-btn:hover .race-tab-icon-bg { transform: scale(1.06); }
  .race-tab--cup .race-tab-icon-bg      { background: var(--color-cup-tint); color: var(--color-cup); }
  .race-tab--cup.active .race-tab-icon-bg,
  .race-tab--cup:hover  .race-tab-icon-bg { background: var(--color-cup); color: var(--color-white); }
  .race-tab--athletes .race-tab-icon-bg  { background: var(--color-feed-tint); color: var(--color-feed); }
  .race-tab--athletes.active .race-tab-icon-bg,
  .race-tab--athletes:hover  .race-tab-icon-bg { background: var(--color-feed); color: var(--color-white); }
  .race-tab--clubs .race-tab-icon-bg     { background: var(--color-clubs-tint); color: var(--color-clubs); }
  .race-tab--clubs.active .race-tab-icon-bg,
  .race-tab--clubs:hover  .race-tab-icon-bg { background: var(--color-clubs); color: var(--color-white); }
  .race-tab--races .race-tab-icon-bg     { background: var(--color-calendar-tint); color: var(--color-calendar); }
  .race-tab--races.active .race-tab-icon-bg,
  .race-tab--races:hover  .race-tab-icon-bg { background: var(--color-calendar); color: var(--color-white); }
  .race-tab-label {
    font-size: 11px; font-weight: 500; line-height: 1;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 80px;
    transition: font-weight .15s;
  }
  .race-tab-btn.active .race-tab-label { font-weight: 700; }

  /* Toolbar: segmented gender filter on the left, list heading + count on the right
     (the heading alone sits on the left when a tab has no filter). */
  .list-toolbar {
    display: flex; align-items: center; justify-content: space-between;
    gap: 12px 16px; margin: 0 0 16px; padding-top: 16px; flex-wrap: wrap;
  }
  .seg {
    display: inline-flex; gap: 2px; padding: 4px;
    background: var(--color-surface-muted); border: 1px solid var(--color-border);
    border-radius: var(--radius-pill);
  }
  .seg-item {
    padding: 7px 22px; border-radius: var(--radius-pill);
    font-size: 15px; font-weight: 500; line-height: 1.2; color: var(--color-text-muted);
    text-decoration: none; transition: color .12s, background .12s, box-shadow .12s;
  }
  .seg-item:hover { color: var(--color-text-primary); }
  .seg-item.active {
    background: var(--color-white); color: var(--color-text-primary);
    box-shadow: 0 1px 3px var(--color-shadow-medium), 0 0 0 1px var(--color-shadow-light);
  }
  .list-heading { display: flex; align-items: baseline; gap: 12px; min-width: 0; }
  .list-heading .list-title {
    font-family: var(--font-family-display); font-weight: 700; font-size: 20px;
    letter-spacing: -0.02em; line-height: 1.2; margin: 0;
  }
  .list-count { font-size: 15px; color: var(--color-text-muted); white-space: nowrap; }

  .standings-table {
    border: 1px solid var(--color-panel-border); border-radius: var(--radius-card);
    background: var(--color-panel); overflow: hidden;
  }
  .srow {
    display: grid; grid-template-columns: 64px minmax(0, 1fr) 90px 110px;
    align-items: center; padding: 0 24px; column-gap: 12px;
  }
  .srow.shead {
    padding: 18px 24px 16px; border-bottom: 1px solid var(--color-border-strong);
    font-family: var(--font-family-mono); font-size: 11.5px; font-weight: 600;
    letter-spacing: 0.14em; text-transform: uppercase; color: var(--color-text-muted);
  }
  .shead span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .srow.sdata { padding: 16px 24px; transition: background .12s; }
  .srow.sdata + .srow.sdata { border-top: 1px solid var(--color-panel-border); }
  a.srow.sdata { color: inherit; text-decoration: none; }
  a.srow.sdata:hover { background: var(--color-panel-active); color: inherit; }
  .col-num { text-align: right; font-size: 17px; }
  .shead .col-num { font-size: inherit; }

  .rank {
    width: 32px; height: 32px; border-radius: 9px;
    display: flex; align-items: center; justify-content: center;
    font-size: 16px; font-weight: 600; color: var(--color-text-secondary);
  }
  .rank.top-1 { background: var(--color-rank-gold-tint); color: var(--color-rank-gold); }
  .rank.top-2 { background: var(--color-rank-silver-tint); color: var(--color-rank-silver); }
  .rank.top-3 { background: var(--color-rank-bronze-tint); color: var(--color-rank-bronze); }

  .row-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
  .row-title {
    font-size: 17px; font-weight: 500; letter-spacing: -0.01em; line-height: 1.25;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  }
  .row-sub { font-size: 14px; color: var(--color-text-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .rating-value { font-family: var(--font-family-mono); font-weight: 700; }

  .clubs-row.is-unpaid { opacity: .55; filter: grayscale(1); }
  .club-badge {
    align-self: flex-start;
    font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: var(--radius-pill);
    background: rgba(220,38,38,.12); color: var(--color-danger); white-space: nowrap;
  }

  .reg-banner {
    display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap;
    border: 1px solid var(--color-panel-border); border-radius: var(--radius-card);
    background: var(--color-panel);
    padding: 16px 20px; margin-bottom: 16px;
  }
  .reg-banner-text { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
  .reg-banner-title { font-size: 14.5px; font-weight: 600; letter-spacing: -0.01em; }
  .reg-banner-note { font-size: 12.5px; color: var(--color-text-muted); }

  @media (max-width: 640px) {
    .seg-item { padding: 7px 14px; }
    .list-heading { width: 100%; }
    .srow { grid-template-columns: 36px minmax(0, 1fr) 56px 64px; column-gap: 8px; }
    .srow.shead { padding: 14px 14px 12px; font-size: 10.5px; letter-spacing: 0.06em; }
    .srow.sdata { padding: 12px 14px; }
    .row-title, .col-num { font-size: 15px; }
    .row-sub { display: none; }
  }