@layer screens {
  .rtg-ranking__filters {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--space-4);
  }
  .rtg-ranking__body {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 320px);
    align-items: start;
    gap: var(--space-6);
  }
  .rtg-ranking__me { display: grid; gap: var(--space-5); }
  .rtg-ranking__scroll { overflow-x: auto; }
  .rtg-ranking__table { width: 100%; border-collapse: collapse; }
  .rtg-ranking__table th {
    text-align: left;
    color: var(--text-muted);
    font-size: var(--fs-xs);
    font-weight: 500;
  }
  .rtg-ranking__table th, .rtg-ranking__table td {
    padding: var(--space-4);
    border-bottom: var(--stroke-hairline) solid var(--border-hairline);
  }
  .rtg-ranking__table .data-row { white-space: nowrap; }
  .rtg-ranking__table .is-me { background: var(--state-selected); }
  .rtg-ranking__pages {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: var(--space-3);
    padding: var(--space-4);
  }
  .rtg-ranking__notice { padding: var(--space-5); }
  @media (max-width: 1100px) {
    .rtg-ranking__body { grid-template-columns: minmax(0, 1fr); }
    .rtg-ranking__me { grid-row: 1; }
    .rtg-ranking__filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }
  @media (max-width: 560px) {
    .rtg-ranking__filters { grid-template-columns: minmax(0, 1fr); }
  }
}