/* GENERATED by scripts/build/tailwind/build-tailwind.ts — edit frameworks/tailwind/Theme.css or a manifest, not this file. */
@import '../../../Prelude.generated.css';

@layer utilities {
  .arena-people-list__root {
    margin: 0px;
    display: grid;
    list-style-type: none;
    padding: 0px;
    font-family: var(--font-body);
  }
  .arena-people-list__row {
    display: flex;
    min-width: 0px;
    align-items: center;
    border-radius: var(--r-control);
  }
  .arena-people-list__rank {
    flex-shrink: 0;
    text-align: center;
    font-family: var(--font-mono);
    --tw-font-weight: var(--fw-bold);
    font-weight: var(--fw-bold);
    color: var(--ink-muted);
    @supports (color: color-mix(in lab, red, red)) {
      color: color-mix(in oklab, var(--ink-muted) var(--level-ink-muted), transparent);
    }
    --tw-numeric-spacing: tabular-nums;
    font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
  }
  .arena-people-list__text {
    display: grid;
    min-width: 0px;
    flex: 1;
  }
  .arena-people-list__name {
    min-width: 0px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    --tw-font-weight: var(--fw-medium);
    font-weight: var(--fw-medium);
    color: var(--ink-heading);
  }
  .arena-people-list__secondary {
    min-width: 0px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--ink-muted);
    @supports (color: color-mix(in lab, red, red)) {
      color: color-mix(in oklab, var(--ink-muted) var(--level-ink-muted), transparent);
    }
  }
  .arena-people-list__figure {
    flex-shrink: 0;
    font-family: var(--font-mono);
    color: var(--ink-muted);
    @supports (color: color-mix(in lab, red, red)) {
      color: color-mix(in oklab, var(--ink-muted) var(--level-ink-muted), transparent);
    }
    --tw-numeric-spacing: tabular-nums;
    font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
  }
  .arena-people-list__action {
    display: flex;
    flex-shrink: 0;
    align-items: center;
  }
  .arena-people-list__root--size-sm {
    gap: var(--sp-1);
  }
  .arena-people-list__row--size-sm {
    gap: var(--sp-2);
    padding-inline: calc(var(--sp-1) * 1.5);
    padding-block: var(--sp-1);
  }
  .arena-people-list__rank--size-sm {
    width: var(--sp-4);
    font-size: var(--dz-text-2xs);
  }
  .arena-people-list__name--size-sm {
    font-size: var(--dz-text-sm);
  }
  .arena-people-list__secondary--size-sm {
    font-size: var(--dz-text-2xs);
  }
  .arena-people-list__figure--size-sm {
    font-size: var(--dz-text-2xs);
  }
  .arena-people-list__root--size-md {
    gap: var(--sp-2);
  }
  .arena-people-list__row--size-md {
    gap: var(--sp-3);
    padding-inline: var(--sp-2);
    padding-block: var(--sp-2);
  }
  .arena-people-list__rank--size-md {
    width: var(--sp-6);
    font-size: var(--dz-text-xs);
  }
  .arena-people-list__name--size-md {
    font-size: var(--dz-text-md);
  }
  .arena-people-list__secondary--size-md {
    font-size: var(--dz-text-xs);
  }
  .arena-people-list__figure--size-md {
    font-size: var(--dz-text-sm);
  }
  .arena-people-list__root--size-lg {
    gap: var(--sp-3);
  }
  .arena-people-list__row--size-lg {
    gap: var(--sp-4);
    padding-inline: var(--sp-3);
    padding-block: var(--sp-3);
  }
  .arena-people-list__rank--size-lg {
    width: var(--sp-8);
    font-size: var(--dz-text-sm);
  }
  .arena-people-list__name--size-lg {
    font-size: var(--dz-text-lg);
  }
  .arena-people-list__secondary--size-lg {
    font-size: var(--dz-text-sm);
  }
  .arena-people-list__figure--size-lg {
    font-size: var(--dz-text-md);
  }
  .arena-people-list__row--current-true {
    background-color: var(--fill-surface-sunken);
  }
}