#leagueStandingsPage{
    --standings-table-width: 1072px;
    --standings-rank-width: 30px;
    /* The base is kept apart from the width in use so the pick-5 rule below can
       add to it without restating the number. */
    --standings-entry-base-width: 230px;
    --standings-entry-width: var(--standings-entry-base-width);
    /* Wide enough for the header and for a couple of week numbers; a longer
       run wraps rather than widening the table, which is sized in whole. */
    --standings-weeks-won-width: 56px;
    --standings-stat-width: 52px;
    --standings-divider-width: 40px;
}

/* Defined on the page (a common ancestor of both the table and the toolbar)
   so both inherit the same width. Keying it off the table's own class would
   only reach the table, not the sibling toolbar. */
#leagueStandingsPage.standingsPage--withoutCse{
    --standings-table-width: 1170px;
}

/* Pick-5 leagues drop the Weeks Won column. The table is sized as a whole, so
   that width would otherwise fall to the filler at the end of the row and read
   as a gap; it goes to the entry name instead, which is the column that always
   wants more. */
#leagueStandingsPage.standingsPage--noWeeksWon{
    --standings-entry-width: calc(var(--standings-entry-base-width) + var(--standings-weeks-won-width));
}

#leagueStandingsTable{
    font-size: var(--fs-body);
}

#leagueStandingsTable tbody tr:nth-child(odd){ /* this is odd because of the spacer row */
    background-color: var(--c-s3);
}

#leagueStandingsTable tbody tr:hover:nth-child(odd){ /*outline only works when clicked*/
    background-color: var(--c-s4);
}

#leagueStandingsTable tbody tr:hover{
    background-color: var(--c-s4);
}

#leagueStandingsTable tbody tr:hover .medalCount{
    color: var(--c1);
}

.standingsNumber{
    text-align: center;
    /*border-left: 1px solid #d3dade;
    border-right: 1px solid #d3dade;*/
}

#leagueStandingsTable{
    /*--standings-entry-max-width: 300px;*/
    /*--standings-entry-width: var(--standings-entry-max-width);*/
    width: var(--standings-table-width);
    table-layout: fixed;
}

.standingsToolbar{
    box-sizing: border-box;
    display: flex;
    align-items: center;
    gap: 12px;
    justify-content: space-between;
    margin: 0 auto 12px;
    width: var(--standings-table-width);
}

.standingsSearchBar{
    align-items: center;
    box-sizing: border-box;
    display: flex;
    /* Same gap the column controls beside it use, so a button sitting next to
       the search field is spaced like every other button in the toolbar. */
    gap: var(--g1);
    flex: 0 1 auto;
    justify-content: flex-start;
    min-width: 0;
}

.standingsColumnControls [data-standings-column-toggle]{
    transition: all 60ms linear;
}

.standingsColumnControls{
    border: 0;
    box-sizing: border-box;
    display: flex;
    flex: 1 1 auto;
    gap: var(--g1);
    justify-content: flex-end;
    margin: 0;
    min-width: 0;
    padding: 0;
}

/* Equal widths without measuring anything or hard-coding a number: under the
   row's max-content sizing each 1fr column resolves to the widest item's own
   contribution, so "Record Data" is padded out to match "Last Week" and the
   pair stays correct if either label ever changes. */
.standingsColumnSegments{
    display: inline-grid;
    grid-auto-flow: column;
    grid-auto-columns: 1fr;
    gap: var(--g1);
}

.standingsColumnSegments [data-standings-column-toggle]{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.standingsColumnHidden{
    display: none !important;
}

.topHeader{
    text-align: center;
}

.standingsEntryColumn{
    width: var(--standings-entry-width);
    padding-left: 6px;
    text-align: left;
}

.standingsRankColumn,
.standingsCol--rank{
    width: var(--standings-rank-width);
}

.standingsCol--entry{
    width: var(--standings-entry-width);
}

.standingsCol--weeksWon{
    width: var(--standings-weeks-won-width);
}

/* The cell holds the entry's medals (see $standingsMedalCellHtml in
   standings.php). It is positioned so it can be raised over the rows around it
   while its tooltip is showing, which stands outside the cell. */
.standingsWeeksWonCell{
    position: relative;
    white-space: nowrap;
}

.standingsWeeksWonCell:has(.standingsMedals:hover),
.standingsWeeksWonCell:has(.standingsMedals:focus-visible){
    z-index: 20;
}

/* The medals, one of each kind at most, the best in front: each after the
   first is drawn behind the one before it and overlapped by it, so the best
   finish shows whole and the lesser ones only in part.

   Each is drawn in a soft, neumorphic style rather than as a shiny coin: a
   disc lit from the upper left, raised off the row by a pale highlight above
   and a soft shadow below. Each metal sets three tones - light, base, and
   deep - and the rule below builds the disc and its shadow from them. The shadow cast on the
   right is what marks where one medal ends and the one behind it begins. */
.standingsMedals{
    --standings-medal-size: 18px;
    --standings-medal-overlap: 9px;

    cursor: default;
    display: inline-flex;
    padding: 2px;
    position: relative;
    vertical-align: middle;
}

.standingsMedals:focus{
    outline: none;
}

.standingsMedals:focus-visible{
    border-radius: 999px;
    outline: 2px solid rgba(30, 144, 255, 0.45);
    outline-offset: 2px;
}

.standingsMedalsStack{
    display: inline-flex;
}

.standingsMedal{
    background: linear-gradient(145deg, var(--standings-medal-light), var(--standings-medal-base) 70%);
    border-radius: 50%;
    box-shadow:
        2px 2px 4px rgba(20, 28, 45, 0.28),
        -1px -1px 3px rgba(255, 255, 255, 0.9),
        inset 1px 1px 1px rgba(255, 255, 255, 0.55),
        inset -1px -1px 1px var(--standings-medal-deep);
    box-sizing: border-box;
    display: block;
    flex: 0 0 auto;
    height: var(--standings-medal-size);
    position: relative;
    width: var(--standings-medal-size);
}

.standingsMedal + .standingsMedal{
    margin-left: calc(-1 * var(--standings-medal-overlap));
}

.standingsMedal:nth-child(1){ z-index: 4; }
.standingsMedal:nth-child(2){ z-index: 3; }
.standingsMedal:nth-child(3){ z-index: 2; }
.standingsMedal:nth-child(4){ z-index: 1; }

.standingsMedal--gold{
    --standings-medal-light: #fbe7a1;
    --standings-medal-base: #e0b43c;
    --standings-medal-deep: rgba(140, 100, 10, 0.55);
}

.standingsMedal--silver{
    --standings-medal-light: #fbfcfd;
    --standings-medal-base: #c7cdd5;
    --standings-medal-deep: rgba(100, 110, 125, 0.5);
}

.standingsMedal--bronze{
    --standings-medal-light: #f5d2b0;
    --standings-medal-base: #c9824a;
    --standings-medal-deep: rgba(120, 65, 25, 0.55);
}

/* Fourth place and below, where the league pays that far: a muted slate,
   darker than the silver and cooler than the bronze, so it reads as a finish
   in the money without claiming a metal - and is not mistaken for second. */
.standingsMedal--paid{
    --standings-medal-light: #b7c0cd;
    --standings-medal-base: #8a95a7;
    --standings-medal-deep: rgba(55, 65, 85, 0.55);
}

/* What the medals were for, above them while they are pointed at or focused:
   a small table with Place, Weeks, and Payout headers, a row for each place,
   and a total where there is more than one place. Payout appears only where
   the league has set the money. The rows are a grid so the columns line up
   across them. Drawn as the entry column's username tooltip is. */
.standingsMedalsTooltip{
    background: var(--c1);
    border-radius: var(--r2);
    bottom: calc(100% + 8px);
    color: var(--c-s1);
    display: grid;
    font-family: var(--ff1);
    font-size: 0.72rem;
    font-weight: var(--fw2);
    grid-template-columns: auto auto auto;
    left: 50%;
    line-height: 1.2;
    opacity: 0;
    padding: 5px 8px;
    pointer-events: none;
    position: absolute;
    text-align: left;
    transform: translateX(-50%);
    white-space: nowrap;
    z-index: 60;
}

/* Without money there are two columns, not three. */
.standingsMedalsTooltip--noMoney{
    grid-template-columns: auto auto;
}

.standingsMedalsTooltip::after{
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid var(--c1);
    content: "";
    height: 0;
    left: 50%;
    position: absolute;
    top: 100%;
    transform: translateX(-50%);
    width: 0;
}

.standingsMedals:hover .standingsMedalsTooltip,
.standingsMedals:focus-visible .standingsMedalsTooltip{
    opacity: 1;
}

.standingsMedalsTooltipLine{
    display: contents;
}

/* The cells carry the spacing rather than the grid's gaps, so the rules under
   the headers and over the total run unbroken across the columns. */
.standingsMedalsTooltipLine > *{
    padding: 2px 6px;
}

.standingsMedalsTooltipLine > :first-child{
    padding-left: 0;
}

.standingsMedalsTooltipLine > :last-child{
    padding-right: 0;
}

.standingsMedalsTooltipLine--head > *{
    border-bottom: 1px solid color-mix(in srgb, var(--c-s1) 40%, transparent);
    font-size: 0.62rem;
    font-weight: var(--fw3);
    letter-spacing: 0.04em;
    padding-bottom: 3px;
    text-transform: uppercase;
}

.standingsMedalsTooltipPlace{
    font-weight: var(--fw3);
}

.standingsMedalsTooltipMoney{
    font-variant-numeric: tabular-nums;
    text-align: right;
}

.standingsMedalsTooltipLine--total > *{
    border-top: 1px solid color-mix(in srgb, var(--c-s1) 40%, transparent);
    font-weight: var(--fw3);
    padding-top: 3px;
}

/* Centred, header and list alike, rather than on the right edge the number
   columns share: it is a list of weeks, not a figure whose places need to
   stack. The side padding is made even so the centre is the column's. The
   header is named by both its classes to outrank the right alignment every
   number header is given further down this file. */
#leagueStandingsTable.standingsType thead th.tableNumber.standingsWeeksWonHeader,
#leagueStandingsTable.standingsType tbody td.standingsWeeksWonCell{
    padding-left: 10px;
    padding-right: 10px;
    text-align: center;
}

.standingsCol--divider{
    width: var(--standings-divider-width);
}

.standingsCol--stat{
    width: var(--standings-stat-width);
}

/* The filler column is always present with an auto width. With table-layout:
   fixed it soaks up whatever width the fixed columns don't use, so the fixed
   column widths are never stretched and the table stays the same size when
   columns are toggled off (their freed space goes to the filler on the right,
   and the remaining columns stay packed to the left). */
.standingsCol--filler{
    box-sizing: border-box;
    display: table-column;
    padding-left: 0 !important;
    padding-right: 0 !important;
    width: auto;
}

.standingsFiller{
    box-sizing: border-box;
    display: table-cell;
    padding-left: 0 !important;
    padding-right: 0 !important;
    width: auto;
}

.standingsRankCell{
    box-sizing: border-box;
    padding-right: 4px;
    text-align: right;
}

.standingsEntryCell{
    overflow: visible;
    padding-left: 6px;
    position: relative;
    text-align: left;
}

.standingsEntryCell:has(.entryProfileLink:hover),
.standingsEntryCell:has(.entryProfileName:hover),
.standingsEntryCell:has(.entryProfileLink:focus-visible){
    z-index: 20;
}

.standingsEntryCell .entryProfileContent{
    max-width: 100%;
    width: 100%;
}

.standingsEntryText{
    display: block;
    max-width: 100%;
    min-width: 0;
    overflow: visible;
    width: 100%;
}

.standingsEntryText .entryProfileName{
    max-width: 100%;
}

.tableNumber.another{
    width: 10%;
    font-size: var(--fs-small1);
}

.tableNumber{
    text-align: center;
    scope: col;
    /*transform: rotate(-45deg);*/
    /*border-left: 1px solid #d3dade;
    border-right: 1px solid #d3dade;*/
}

#leagueStandingsSpacerRow{
    height: 12px;  
}

#leagueStandingsHeaderRow{
    border-bottom: 1px solid var(--c1);   
}

.standingsSortableHeader{
    cursor: pointer;
    position: relative;
    user-select: none;
}

.standingsSortableHeader:focus-visible{
    outline: 2px solid var(--c2);
    outline-offset: 2px;
}

.standingsSortLabel{
    align-items: center;
    backface-visibility: hidden;
    border-radius: var(--r2);
    display: inline-flex;
    justify-content: center;
    line-height: 1;
    margin: -.6em 0;
    padding: .4em .6em;
    transform-origin: 50% 50%;
    will-change: transform;
}

.standingsSortableHeader:hover .standingsSortLabel{
    background: var(--c1-a1);
}

.standingsSortableHeader.is-sorted .standingsSortLabel{
    background: var(--c1);
    color: var(--c-s1);
}

.standingsSortableHeader.is-sorted-inverted .standingsSortLabel{
    transform: translateY(0) rotate(180deg);
}

.standingsRankColumn .standingsSortLabel{
    padding-left: .35em;
    padding-right: .35em;
}

svg{
    z-index: 2;
}

#CNtopBorderContainer{
    height: auto;
    width: 100%;
    text-align: center;
    margin-top: -30px;
    margin-bottom: 60px;
    
    position: relative;
}

/*.CNfirst:hover{
    animation: slightSpin 800ms ease-in-out;
    animation-fill-mode: forwards;
}*/

.CNfirst:active{
    transform: scale(.9);
}

/*.CNsecond:active{
    animation: slightSpinRev 800ms ease-in-out;
    animation-fill-mode: forwards;
}*/

#timeStamp{
    position: absolute;
    top: 0;
    right: 0;
    font-family: var(--ff1);
    font-size: 8pt;
    padding: 5px 5px 0 0;
}

.medalCase{
}

.medalCount{
    font-family: var(--ff1);
    font-size: 8pt;
    font-weight: normal !important;
    display: inline-block;
    width: 15px;
    height: 15px;
    line-height: 15px;
    text-align: center;
    border: 1px solid var(--c1);
    border-radius: var(--r-round);
    background-color: var(--c-s1);
    vertical-align: middle;
    position: relative;
    cursor: default;
    visibility: hidden;
}

.medalTier--gold{
    margin-left: 0px;
    background-color: gold;
    visibility: visible;
}

.medalTier--silver{
    background-color: lightgrey;
}

.medalTier--bronze{
    background-color: tan;
}

.medalTier--sapphire{
    background-color: blue;
}

.medalTier--emerald{
    background-color: green;
}

.medalTooltip{
    position: absolute;
    margin: 0 auto;
    bottom: -200%;
    left: 120%;
    visibility: hidden;
    font-family: var(--ff1);
    font-size: 9pt;
    background-color: var(--c-s1);
    padding: 4px 5px 3px 5px;
    white-space: nowrap;
    overflow: hidden;
    z-index: 2;
    text-align: center;
    box-shadow: 1px 1px 2px 0 black;
    border: 1px solid var(--c1);
    line-height: 16px;
}

.medalCount:hover .medalTooltip{
    visibility: visible;
}

.medalTier--gold .medalTooltip{
    background-color: gold;
}

.medalTier--silver .medalTooltip{
    background-color: lightgrey;
}

.medalTier--bronze .medalTooltip{
    background-color: tan;
}

.medalTier--sapphire .medalTooltip{
    background-color: blue;
}

.medalTier--emerald .medalTooltip{
    background-color: green;
}

#editCN{
    position: absolute;
    bottom: 1px;
    right: 1px;
    font-size: 7pt;
    padding: 2px;
    cursor: pointer;
    
}

.editBox{
    width: 100%;
    height: 200px;
    background: transparent;
    font-family: var(--ff1);
    font-size: var(--fs-body);
}

#editSub{
    position: absolute;
    top: 90px;
    right: 10px;
    display: none;
}

.taContainer{
    display: none;
}

/* ==========================================================================
   The table's typography: colour, weight and capitals, then alignment,
   grouping and spacing. These began as a trial in a file of their own and
   were kept. Everything is scoped to .standingsType, which standings.php
   always puts on the table - it gives these rules the weight to override the
   ones above without restating them, so they are appended rather than merged.

   Three text tokens do the work that one near-black used to:

     ink-1  entry names and the columns people compare - season P, GB and PCT
     ink-2  a middle tier, held in reserve and pointed at nothing right now
     ink-3  everything else - the numbers, the rank, the column headers, the
            group labels, and the zeros and placeholder dashes

   What it does not touch, by instruction: the accent colour, and the row
   colours - the stripes, the hover shade and the current-user row all keep
   exactly the fills they had.

   Contrast, measured against the three grounds a cell can sit on - the white
   row, the striped row (--c-s3) and the hover shade (--c-s4):

     ink-1  16.1 : 1   14.2 : 1   11.3 : 1
     ink-2   4.3 : 1    3.8 : 1    3.0 : 1
     ink-3   3.8 : 1    3.3 : 1    2.6 : 1

   Only ink-1 clears 4.5 : 1 now. Both grays sit under it on every ground,
   including ink-3, which under the current assignment carries the numbers -
   this is a deliberate choice about how light the table should read. The
   accent colour from the same set of recommendations is deliberately not
   here. */

#leagueStandingsTable.standingsType {
    --standings-ink-1: #172136;
    --standings-ink-2: #6e7a90;
    --standings-ink-3: #79849a;
}

/* --- The header row --------------------------------------------------------
   Uppercased in CSS rather than in the markup, so a screen reader still hears
   "Entry" and the abbreviations keep their title attributes. Smaller and
   letter-spaced, which is what lets it read as a header at a heavier weight
   without shouting. */
#leagueStandingsTable.standingsType thead th {
    color: var(--standings-ink-3);
    font-size: var(--fs-small2);
    font-weight: 600;
    letter-spacing: var(--ls3);    text-transform: uppercase;
}

/* The group labels over the two sections are a tier above the column headers,
   so they take the same capitals at a lighter weight and a lighter colour.
   Matching the weight would merge the two rows into one. */
#leagueStandingsTable.standingsType thead th.topHeader {
    color: var(--standings-ink-3);
    font-weight: 500;
}

/* --- The body -------------------------------------------------------------- */
#leagueStandingsTable.standingsType tbody td {
    color: var(--standings-ink-3);
    font-weight: 400;
    padding: 4px 0;
}

/* The name is what a reader scans for, so it holds the primary colour and sits
   a step heavier than the numbers beside it. */
#leagueStandingsTable.standingsType tbody .standingsEntryCell {
    color: var(--standings-ink-1);
    font-weight: 500;
}

/* The rank is already told by the row's place in the list, so it recedes. */
#leagueStandingsTable.standingsType tbody .standingsRankCell {
    color: var(--standings-ink-3);
}

/* The season columns people actually compare. */
#leagueStandingsTable.standingsType tbody td[data-standings-stat="points"][data-standings-column-section="season"],
#leagueStandingsTable.standingsType tbody td[data-standings-stat="games-behind"],
#leagueStandingsTable.standingsType tbody td[data-standings-stat="pct"] {
    color: var(--standings-ink-1);
}

/* A zero or a dash is the absence of a result, not a result. At full strength
   the zeros in L and T read as loud as the numbers that matter. */
#leagueStandingsTable.standingsType tbody td.is-muted {
    color: var(--standings-ink-3);
}

/* The Delta column's rise or fall: a triangle after the number of places, up
   in green and down in red. Only the triangle takes the colour; the number
   stays in the column's ink. The column is right-aligned like the other
   number columns, so the triangles end on the same edge and stand in one line.

   The triangle is the Board's spread mark (.spreadFavoriteMark in
   week-tracker.css): Font Awesome's play glyph with sharp corners, at the same
   size, pointing right in its own grid and turned to point up or down. The
   points run a little past the box, so it does not clip them. */
#leagueStandingsTable .standingsDeltaMark {
    display: inline-block;
    font-size: 6px;
    height: 1em;
    margin-left: 4px;
    overflow: visible;
    vertical-align: middle;
    width: .75em;
}

/* Each is nudged 2px the way it points - up for a rise, down for a fall - as
   the Board nudges its own, a relative shift, so the number beside it does
   not move. */
#leagueStandingsTable .standingsDeltaMark--up {
    color: var(--c-green);
    position: relative;
    top: -4px;
    transform: rotate(-90deg);
}

#leagueStandingsTable .standingsDeltaMark--down {
    color: var(--c-red);
    position: relative;
    top: 1px;
    transform: rotate(90deg);
}

/* Your own row is found by its tint and its name, not by setting every number
   in it in bold - which, with tabular figures, thickens the strokes of a whole
   row and drags the eye off the columns. */
#leagueStandingsTable.standingsType tbody tr.user {
    font-weight: 400;
}

/* A navy line down the left edge of each of the viewer's own rows, as on the
   Board and in the Splits tables. */
#leagueStandingsTable.standingsType tbody tr.user > td:first-child {
    position: relative;
}

#leagueStandingsTable.standingsType tbody tr.user > td:first-child::before {
    background: var(--c1);
    bottom: 0;
    content: "";
    left: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 3px;
}

#leagueStandingsTable.standingsType tbody tr.user .standingsEntryCell {
    font-weight: 600;
}


/* --------------------------------------------------------------------------
   Alignment, grouping and spacing.
   -------------------------------------------------------------------------- */

/* --- Numbers in a column, not adrift in one ------------------------------
   Right-aligned so the digits stack and the decimals line up, with tabular
   figures so a 1 takes the width of a 4 and nothing shifts between rows. The
   headers follow their columns. */
#leagueStandingsTable.standingsType {
    font-variant-numeric: tabular-nums;
}

#leagueStandingsTable.standingsType tbody .standingsNumber,
#leagueStandingsTable.standingsType thead th.tableNumber {
    text-align: right;
    padding-right: 10px;
}

/* Each header's text sits inside a span that carries .6em of side padding (see
   .standingsSortLabel), so that the sort target is larger than the letter. That
   padding pushed the letter further in than the digits below it. Pulled back
   with a negative margin of the same size rather than by removing the padding,
   so the area you can click stays the size it is - change one and change the
   other with it. */
#leagueStandingsTable.standingsType thead th.tableNumber .standingsSortLabel {
    margin-right: -.6em;
}

/* --- The invisible tenth --------------------------------------------------
   standings.php writes a ".0" after every whole number in the three columns
   that can carry a tenth - points, CSE and games behind. visibility rather
   than display, which is the whole point: the span keeps the width it would
   have had, so 14 ends where the 5 of 13.5 ends and the ones digits stack. */
#leagueStandingsTable.standingsType .standingsDecimalPad {
    visibility: hidden;
}

/* The rank's header sits over digits that end at a common edge, so it ends
   there too. */
#leagueStandingsTable.standingsType thead th.standingsRankColumn {
    padding-right: 4px;
    text-align: right;
}

/* The rank's label has side padding of its own (.35em - see
   .standingsRankColumn .standingsSortLabel), taken back the same way, so "#"
   ends where the digits under it do: 4px in from the cell's edge, as the rank
   cells' padding below puts them. */
#leagueStandingsTable.standingsType thead th.standingsRankColumn .standingsSortLabel {
    margin-right: -.35em;
}

#leagueStandingsTable.standingsType tbody .standingsRankCell {
    padding-right: 4px;
}

/* "Entry" starts where the avatars start, rather than between the avatars and
   the names. */
#leagueStandingsTable.standingsType thead th.standingsEntryColumn {
    padding-left: 10px;
}

/* The same span padding described above, on the other side, and taken back by
   the same amount. Without this the label starts right of the avatars and the
   padding above does nothing. */
#leagueStandingsTable.standingsType thead th.standingsEntryColumn .standingsSortLabel {
    margin-left: -.6em;
}

#leagueStandingsTable.standingsType tbody .standingsEntryCell {
    padding-left: 10px;
}

/* --- The two groups over the columns --------------------------------------
   A rule under each label, spanning only the columns it covers and held off
   its own ends so the two never meet. Drawn on an inner span, since the cell
   itself is what the group spans. */
#leagueStandingsTable.standingsType thead th.topHeader {
    padding-bottom: 4px;
}

#leagueStandingsTable.standingsType thead th.topHeader::after {
    background: var(--standings-ink-3);
    content: "";
    display: block;
    height: 1px;
    margin: 3px 10px 0;
    opacity: .45;
}

/* --- The rules that open and close the table ------------------------------
   The header's rule was a full-strength near-black line, heavier than anything
   else here; it drops to the text colour at a fraction of its weight. The
   table gets a matching rule under its last row so it reads as finished. */
#leagueStandingsTable.standingsType #leagueStandingsHeaderRow {
    border-bottom: 1px solid rgba(23, 33, 54, .22);
}

#leagueStandingsTable.standingsType tbody tr:last-child > * {
    border-bottom: 1px solid rgba(23, 33, 54, .12);
}

/* --- Which column the table is sorted by ---------------------------------- */
#leagueStandingsTable.standingsType thead th[aria-sort="ascending"],
#leagueStandingsTable.standingsType thead th[aria-sort="descending"] {
    color: var(--standings-ink-1);
}

/* --- The avatars ----------------------------------------------------------
   Smaller, so they sit inside the row rather than filling it. Scoped to this
   table: the same avatar is used all over the site. */
#leagueStandingsTable.standingsType .standingsEntryCell .entryProfileLink {
    --size: 1.55rem;
}

/* The same gap on both sides of the avatar - it sat tighter to the rank than
   to the name. */
#leagueStandingsTable.standingsType .standingsEntryCell .entryProfileContent {
    gap: 10px;
}


/* --- The header's own band and the gap under it ---------------------------
   The column labels sat high in their band: a 12px bottom padding on every
   header cell (thead tr th in main.css) put twelve pixels between the letters
   and the rule and one above them. Balanced here instead, which is most of
   what made the header look detached from the table.

   The empty row that used to sit under the rule, matching that padding, is
   gone too. Losing it shifted which rows the stripes land on, since the stripe
   rule near the top of this file counts children and the spacer was the first,
   so the two rules below put the grey back on exactly the rows that had it. No
   colour changes: these are the same fills that rule sets. */
#leagueStandingsTable.standingsType thead tr th {
    padding-bottom: 4px;
    padding-top: 4px;
}

/* The column labels, between the group labels' rule above them and the
   header's rule below. Even padding set them 11.6px under the one and 8px over
   the other: the capitals ride high in their line, and the rule above sits 4px
   clear of its own cell. 1.8px of the top padding moves to the bottom, which
   puts the letters 9.8px from each rule and leaves the row its height. */
#leagueStandingsTable.standingsType #leagueStandingsHeaderRow th {
    padding-bottom: 5.8px;
    padding-top: 2.2px;
}

#leagueStandingsTable.standingsType tbody tr:nth-child(odd) {
    background-color: transparent;
}

#leagueStandingsTable.standingsType tbody tr:nth-child(even) {
    background-color: var(--c-s3);
}

/* Hover still wins over both, as it did before. */
#leagueStandingsTable.standingsType tbody tr:hover {
    background-color: var(--c-s4);
}