/* Squad-sheet stylesheet.  Source of truth: TfM styles/ (served copy: Public/Sheets/).
   Rationale, history and engine lessons: sheets-css.md, by section name. */

/** Base table **/

table.playerSeason {
    font-family: "Courier New", Courier, monospace;
    font-weight: normal;
    color: #404040;
    text-align:center;
    white-space: nowrap;
    vertical-align: middle;
    border-collapse:collapse;
    box-sizing: border-box;
    }

/* zebra rows */
table.playerSeason  tbody tr:nth-child(odd) {
    background-color: #d9d9d9;
    }
table.playerSeason  tbody tr:nth-child(even) {
    background-color: #f2f2f2;
    }

tr.player {height:24px; }

table.playerSeason a:link {
  color: inherit;
  text-decoration: none;
}
table.playerSeason a:visited {color: inherit; }
table.playerSeason a:hover {color: blue;}

td.lastSeason {
    color:black;
    height:50px;
    text-align:left;
    font-weight:bold;
  }
td.nextSeason {
    color:black;
    height:50px;
    text-align:right;
    font-weight:bold;
  }
/* printable-PDF link (peer row, or a row of its own); no height on purpose -- sheets-css.md */
td.pdfLink {
    color:black;
    text-align:right;
    font-weight:bold;
  }
/* cross-competition link (league <-> club-cup scope): div.xmid rules
   in the frozen-block section below */

/** Event colors (tier variables) **/

:root {
  --card_red: red;
  --yellow: rgb(247, 247, 21);

  /* opaque floor under every body tint (generated block) */
  --tint-base: #fff;

  /* drawn-match score cells */
  --draw: rgba(142, 150, 163, 0.3);

  /* event tiers (1 / 2 / 3 / X = 1 / 2 / 3 / 4+ events): OPAQUE, one hue per event,
     pale -> darker and more saturated; ramps and history in sheets-css.md */
  /* goals */
  --g1: hsl(211, 85%, 80%);
  --g2: hsl(211, 80%, 68%);
  --g3: hsl(211, 78%, 60%);
  --gX: hsl(211, 85%, 50%);

  /* assists */
  --a1: hsl(136, 72%, 74%);
  --a2: hsl(136, 65%, 62%);
  --a3: hsl(136, 60%, 50%);
  --aX: hsl(136, 65%, 39%);

  /* own goals, solo cells */
  --o1: hsl(353, 76%, 87%);
  --o2: hsl(352, 78%, 79%);
  --o3: hsl(352, 77%, 74%);
  --oX: hsl(352, 77%, 63%);

  /* own-goal tiers, split cells: deeper, so the wedge reads at 1/2-1/3 width */
  --o1s: hsl(352, 78%, 84%);
  --o2s: hsl(352, 77%, 63%);
  --o3s: hsl(352, 77%, 55%);
  --oXs: hsl(352, 85%, 47%);
}

/** Hover echo: row header + hovered cell **/
/* score-grids model (2026-09-04): NO row highlight; one shade on the row header,
   the column header and the cell (lighter).  Stroke, never bold.  sheets-css.md */
table.playerSeason {
  --echo-rgb: 64, 64, 64;   /* the one shade, over any background */
  --echo-alpha: 0.25;       /* row + column header */
  --echo-cell-alpha: 0.1;   /* the hovered cell: light, its colour class stays readable */
  --echo-stroke: 0.7px;
}

/* row header: the row's frozen name cell, for ANY non-blank hovered cell
   (single-level :has() only; last-cell blemish -- see sheets-css.md) */
table.playerSeason tbody tr:has(> td:hover:not(:empty)) > td.name {
  box-shadow: inset 0 0 0 999px rgba(var(--echo-rgb), var(--echo-alpha));
  -webkit-text-stroke-width: var(--echo-stroke);
}
/* a hovering pointer: blank cells drive the row header too (and the column header,
   its section); the cell itself stays unshaded.  Touch keeps blank taps inert */
@media (hover: hover) and (pointer: fine) {
  table.playerSeason tbody tr:has(> td:hover:empty) > td.name {
    box-shadow: inset 0 0 0 999px rgba(var(--echo-rgb), var(--echo-alpha));
    -webkit-text-stroke-width: var(--echo-stroke);
  }
}

/* the hovered cell: owner shade, NO z-index (it must slide under the frozen block), no dotted frame when untitled */
table.playerSeason td[title]:hover,
table.playerSeason tbody td:hover:not(:empty):not([title]) {
  box-shadow: inset 0 0 0 999px rgba(var(--echo-rgb), var(--echo-cell-alpha));
}
/* cells whose own mark is a box-shadow: keep the mark under the shade */
table.playerSeason td.y2[title]:hover {
  box-shadow: inset 0 0 0 999px rgba(var(--echo-rgb), var(--echo-cell-alpha)),
              0 0 0 4px var(--yellow) inset;
}
table.playerSeason td.yr[title]:hover {
  box-shadow: inset 0 0 0 999px rgba(var(--echo-rgb), var(--echo-cell-alpha)),
              0 0 0 5px var(--yellow) inset;
}
/* thead score cells: the band (a child) would cover the inset shade -- the shade rides on the
   dotted-frame ::before, lifted over the band.  NEVER ::after: that is the touch bubble */
table.playerSeason thead td.score[title]:hover { box-shadow: none; }
table.playerSeason thead td.score[title]:hover::before {
  background-color: rgba(var(--echo-rgb), var(--echo-cell-alpha));
  z-index: 1;
}

tr.separator {
    color: gray;
    height: 3px;
    background-color: #808080;
    background: linear-gradient(to bottom, #606060, #909090);
    }

/** Column-header echo **/

/* the hovered body cell's column, on every header row; the generated :has()
   rules only FLAG (--echo), the static rules after them paint */
/* begin programmatically generated css (tools/make_colecho_css.py) */
/* body column K -> header column K-1, K = 3..64: flag only, under two complementary
   gates -- a hovering pointer: every body cell drives, blank ones too, and so does the
   column's opponent cell; touch (a tap sets :hover): blank cells drive nothing */
@media (hover: hover) and (pointer: fine) {
  table.playerSeason:has(tbody > tr > td:nth-child(3):hover, thead > tr.header > td.fixt:nth-child(2):hover) thead > tr.header > td:nth-child(2):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(4):hover, thead > tr.header > td.fixt:nth-child(3):hover) thead > tr.header > td:nth-child(3):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(5):hover, thead > tr.header > td.fixt:nth-child(4):hover) thead > tr.header > td:nth-child(4):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(6):hover, thead > tr.header > td.fixt:nth-child(5):hover) thead > tr.header > td:nth-child(5):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(7):hover, thead > tr.header > td.fixt:nth-child(6):hover) thead > tr.header > td:nth-child(6):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(8):hover, thead > tr.header > td.fixt:nth-child(7):hover) thead > tr.header > td:nth-child(7):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(9):hover, thead > tr.header > td.fixt:nth-child(8):hover) thead > tr.header > td:nth-child(8):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(10):hover, thead > tr.header > td.fixt:nth-child(9):hover) thead > tr.header > td:nth-child(9):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(11):hover, thead > tr.header > td.fixt:nth-child(10):hover) thead > tr.header > td:nth-child(10):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(12):hover, thead > tr.header > td.fixt:nth-child(11):hover) thead > tr.header > td:nth-child(11):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(13):hover, thead > tr.header > td.fixt:nth-child(12):hover) thead > tr.header > td:nth-child(12):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(14):hover, thead > tr.header > td.fixt:nth-child(13):hover) thead > tr.header > td:nth-child(13):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(15):hover, thead > tr.header > td.fixt:nth-child(14):hover) thead > tr.header > td:nth-child(14):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(16):hover, thead > tr.header > td.fixt:nth-child(15):hover) thead > tr.header > td:nth-child(15):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(17):hover, thead > tr.header > td.fixt:nth-child(16):hover) thead > tr.header > td:nth-child(16):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(18):hover, thead > tr.header > td.fixt:nth-child(17):hover) thead > tr.header > td:nth-child(17):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(19):hover, thead > tr.header > td.fixt:nth-child(18):hover) thead > tr.header > td:nth-child(18):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(20):hover, thead > tr.header > td.fixt:nth-child(19):hover) thead > tr.header > td:nth-child(19):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(21):hover, thead > tr.header > td.fixt:nth-child(20):hover) thead > tr.header > td:nth-child(20):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(22):hover, thead > tr.header > td.fixt:nth-child(21):hover) thead > tr.header > td:nth-child(21):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(23):hover, thead > tr.header > td.fixt:nth-child(22):hover) thead > tr.header > td:nth-child(22):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(24):hover, thead > tr.header > td.fixt:nth-child(23):hover) thead > tr.header > td:nth-child(23):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(25):hover, thead > tr.header > td.fixt:nth-child(24):hover) thead > tr.header > td:nth-child(24):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(26):hover, thead > tr.header > td.fixt:nth-child(25):hover) thead > tr.header > td:nth-child(25):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(27):hover, thead > tr.header > td.fixt:nth-child(26):hover) thead > tr.header > td:nth-child(26):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(28):hover, thead > tr.header > td.fixt:nth-child(27):hover) thead > tr.header > td:nth-child(27):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(29):hover, thead > tr.header > td.fixt:nth-child(28):hover) thead > tr.header > td:nth-child(28):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(30):hover, thead > tr.header > td.fixt:nth-child(29):hover) thead > tr.header > td:nth-child(29):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(31):hover, thead > tr.header > td.fixt:nth-child(30):hover) thead > tr.header > td:nth-child(30):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(32):hover, thead > tr.header > td.fixt:nth-child(31):hover) thead > tr.header > td:nth-child(31):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(33):hover, thead > tr.header > td.fixt:nth-child(32):hover) thead > tr.header > td:nth-child(32):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(34):hover, thead > tr.header > td.fixt:nth-child(33):hover) thead > tr.header > td:nth-child(33):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(35):hover, thead > tr.header > td.fixt:nth-child(34):hover) thead > tr.header > td:nth-child(34):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(36):hover, thead > tr.header > td.fixt:nth-child(35):hover) thead > tr.header > td:nth-child(35):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(37):hover, thead > tr.header > td.fixt:nth-child(36):hover) thead > tr.header > td:nth-child(36):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(38):hover, thead > tr.header > td.fixt:nth-child(37):hover) thead > tr.header > td:nth-child(37):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(39):hover, thead > tr.header > td.fixt:nth-child(38):hover) thead > tr.header > td:nth-child(38):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(40):hover, thead > tr.header > td.fixt:nth-child(39):hover) thead > tr.header > td:nth-child(39):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(41):hover, thead > tr.header > td.fixt:nth-child(40):hover) thead > tr.header > td:nth-child(40):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(42):hover, thead > tr.header > td.fixt:nth-child(41):hover) thead > tr.header > td:nth-child(41):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(43):hover, thead > tr.header > td.fixt:nth-child(42):hover) thead > tr.header > td:nth-child(42):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(44):hover, thead > tr.header > td.fixt:nth-child(43):hover) thead > tr.header > td:nth-child(43):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(45):hover, thead > tr.header > td.fixt:nth-child(44):hover) thead > tr.header > td:nth-child(44):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(46):hover, thead > tr.header > td.fixt:nth-child(45):hover) thead > tr.header > td:nth-child(45):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(47):hover, thead > tr.header > td.fixt:nth-child(46):hover) thead > tr.header > td:nth-child(46):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(48):hover, thead > tr.header > td.fixt:nth-child(47):hover) thead > tr.header > td:nth-child(47):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(49):hover, thead > tr.header > td.fixt:nth-child(48):hover) thead > tr.header > td:nth-child(48):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(50):hover, thead > tr.header > td.fixt:nth-child(49):hover) thead > tr.header > td:nth-child(49):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(51):hover, thead > tr.header > td.fixt:nth-child(50):hover) thead > tr.header > td:nth-child(50):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(52):hover, thead > tr.header > td.fixt:nth-child(51):hover) thead > tr.header > td:nth-child(51):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(53):hover, thead > tr.header > td.fixt:nth-child(52):hover) thead > tr.header > td:nth-child(52):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(54):hover, thead > tr.header > td.fixt:nth-child(53):hover) thead > tr.header > td:nth-child(53):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(55):hover, thead > tr.header > td.fixt:nth-child(54):hover) thead > tr.header > td:nth-child(54):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(56):hover, thead > tr.header > td.fixt:nth-child(55):hover) thead > tr.header > td:nth-child(55):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(57):hover, thead > tr.header > td.fixt:nth-child(56):hover) thead > tr.header > td:nth-child(56):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(58):hover, thead > tr.header > td.fixt:nth-child(57):hover) thead > tr.header > td:nth-child(57):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(59):hover, thead > tr.header > td.fixt:nth-child(58):hover) thead > tr.header > td:nth-child(58):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(60):hover, thead > tr.header > td.fixt:nth-child(59):hover) thead > tr.header > td:nth-child(59):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(61):hover, thead > tr.header > td.fixt:nth-child(60):hover) thead > tr.header > td:nth-child(60):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(62):hover, thead > tr.header > td.fixt:nth-child(61):hover) thead > tr.header > td:nth-child(61):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(63):hover, thead > tr.header > td.fixt:nth-child(62):hover) thead > tr.header > td:nth-child(62):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(64):hover, thead > tr.header > td.fixt:nth-child(63):hover) thead > tr.header > td:nth-child(63):not(.main) { --echo: 1; }
}
@media not all and (hover: hover) and (pointer: fine) {
  table.playerSeason:has(tbody > tr > td:nth-child(3):hover:not(:empty)) thead > tr.header > td:nth-child(2):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(4):hover:not(:empty)) thead > tr.header > td:nth-child(3):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(5):hover:not(:empty)) thead > tr.header > td:nth-child(4):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(6):hover:not(:empty)) thead > tr.header > td:nth-child(5):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(7):hover:not(:empty)) thead > tr.header > td:nth-child(6):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(8):hover:not(:empty)) thead > tr.header > td:nth-child(7):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(9):hover:not(:empty)) thead > tr.header > td:nth-child(8):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(10):hover:not(:empty)) thead > tr.header > td:nth-child(9):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(11):hover:not(:empty)) thead > tr.header > td:nth-child(10):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(12):hover:not(:empty)) thead > tr.header > td:nth-child(11):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(13):hover:not(:empty)) thead > tr.header > td:nth-child(12):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(14):hover:not(:empty)) thead > tr.header > td:nth-child(13):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(15):hover:not(:empty)) thead > tr.header > td:nth-child(14):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(16):hover:not(:empty)) thead > tr.header > td:nth-child(15):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(17):hover:not(:empty)) thead > tr.header > td:nth-child(16):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(18):hover:not(:empty)) thead > tr.header > td:nth-child(17):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(19):hover:not(:empty)) thead > tr.header > td:nth-child(18):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(20):hover:not(:empty)) thead > tr.header > td:nth-child(19):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(21):hover:not(:empty)) thead > tr.header > td:nth-child(20):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(22):hover:not(:empty)) thead > tr.header > td:nth-child(21):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(23):hover:not(:empty)) thead > tr.header > td:nth-child(22):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(24):hover:not(:empty)) thead > tr.header > td:nth-child(23):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(25):hover:not(:empty)) thead > tr.header > td:nth-child(24):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(26):hover:not(:empty)) thead > tr.header > td:nth-child(25):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(27):hover:not(:empty)) thead > tr.header > td:nth-child(26):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(28):hover:not(:empty)) thead > tr.header > td:nth-child(27):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(29):hover:not(:empty)) thead > tr.header > td:nth-child(28):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(30):hover:not(:empty)) thead > tr.header > td:nth-child(29):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(31):hover:not(:empty)) thead > tr.header > td:nth-child(30):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(32):hover:not(:empty)) thead > tr.header > td:nth-child(31):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(33):hover:not(:empty)) thead > tr.header > td:nth-child(32):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(34):hover:not(:empty)) thead > tr.header > td:nth-child(33):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(35):hover:not(:empty)) thead > tr.header > td:nth-child(34):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(36):hover:not(:empty)) thead > tr.header > td:nth-child(35):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(37):hover:not(:empty)) thead > tr.header > td:nth-child(36):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(38):hover:not(:empty)) thead > tr.header > td:nth-child(37):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(39):hover:not(:empty)) thead > tr.header > td:nth-child(38):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(40):hover:not(:empty)) thead > tr.header > td:nth-child(39):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(41):hover:not(:empty)) thead > tr.header > td:nth-child(40):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(42):hover:not(:empty)) thead > tr.header > td:nth-child(41):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(43):hover:not(:empty)) thead > tr.header > td:nth-child(42):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(44):hover:not(:empty)) thead > tr.header > td:nth-child(43):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(45):hover:not(:empty)) thead > tr.header > td:nth-child(44):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(46):hover:not(:empty)) thead > tr.header > td:nth-child(45):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(47):hover:not(:empty)) thead > tr.header > td:nth-child(46):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(48):hover:not(:empty)) thead > tr.header > td:nth-child(47):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(49):hover:not(:empty)) thead > tr.header > td:nth-child(48):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(50):hover:not(:empty)) thead > tr.header > td:nth-child(49):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(51):hover:not(:empty)) thead > tr.header > td:nth-child(50):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(52):hover:not(:empty)) thead > tr.header > td:nth-child(51):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(53):hover:not(:empty)) thead > tr.header > td:nth-child(52):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(54):hover:not(:empty)) thead > tr.header > td:nth-child(53):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(55):hover:not(:empty)) thead > tr.header > td:nth-child(54):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(56):hover:not(:empty)) thead > tr.header > td:nth-child(55):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(57):hover:not(:empty)) thead > tr.header > td:nth-child(56):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(58):hover:not(:empty)) thead > tr.header > td:nth-child(57):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(59):hover:not(:empty)) thead > tr.header > td:nth-child(58):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(60):hover:not(:empty)) thead > tr.header > td:nth-child(59):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(61):hover:not(:empty)) thead > tr.header > td:nth-child(60):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(62):hover:not(:empty)) thead > tr.header > td:nth-child(61):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(63):hover:not(:empty)) thead > tr.header > td:nth-child(62):not(.main) { --echo: 1; }
  table.playerSeason:has(tbody > tr > td:nth-child(64):hover:not(:empty)) thead > tr.header > td:nth-child(63):not(.main) { --echo: 1; }
}
/* end of programmatically generated css */

/* the look, from the flag: background alpha (not box-shadow: a tapped header cell
   keeps its owner shade) and stroke width (not bold: it shifted the table) */
thead > tr.header > td:not(.main) {
  background-color: rgba(var(--echo-rgb), calc(var(--echo, 0) * var(--echo-alpha)));
  -webkit-text-stroke-width: calc(var(--echo, 0) * var(--echo-stroke));
}
/* a populated score cell keeps its result band (the band covers the td) */
thead > tr.header > td.score:has(> div.vertical:not(:empty)) {
  background-color: transparent;
}
/* a hovering pointer anywhere in an opponent cell: its link reads as hovered */
@media (hover: hover) and (pointer: fine) {
  thead td.fixt:hover > a { color: blue; }
}

/** Frame lines and cell basics **/

/* dv = stage divider (qualifiers | finals), same look as lb */
td.lb, td.dv {border-left: 2px solid gray;
  padding-left: 3px;}
td.rb {border-right: 2px solid gray;
  padding-right: 3px;}

/* thead bookends of the lb/rb frame lines (score row only) */
thead td:first-child + td.score {border-left: 2px solid gray;}
thead td.score:last-child {border-right: 2px solid gray;}

/** Crest cell **/

td.img {
  vertical-align: bottom;
  padding: 0px 5px;
}

img.crest {
    min-width:120px;
    max-width:150px;
    max-height:200px;
    vertical-align: bottom;
    padding:2px;
}

/** Header cells **/

td.main {max-width:240px;
  font-weight: bold;
  font-size: 105%;
  text-align:center;
  padding: 3px;}

/* THEAD-scoped wrap release (tfoot A/B-peer rows also use td.main); fixes
   name overflow AND colspan stat-stretch -- see sheets-css.md */
thead td.main { white-space: normal; }

/* cap below min-content: the longest-word floor sizes the block, title wraps */
thead td.main:not(:first-child) { max-width: 130px; }

td.name {color:black;
  max-width:275px;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align:left;
  position: relative;}

td.name:hover {
  overflow: visible;
  white-space: nowrap;
  z-index: 100;
  background-color: rgba(255, 255, 255, 0.95);
}

td.man {border-left: 2px solid gray;
  padding-left: 3px;
  font-weight: bold;}

td.cman {border-left: 2px solid gray;
  padding-left: 1px;}

/* opaque only on NAMED cells: a newer spell hides older spill-over from its
   own boundary on -- see sheets-css.md */
td.man[title], td.cman[title] {
  position: relative;
  background-color: white;}

div.overflow-hack {
  max-width: 20px;
  display: block;
  box-sizing: border-box;
  overflow: visible;
  white-space: nowrap;
}

div.vertical {
  white-space: nowrap;
  writing-mode: vertical-rl;
  transform: rotate(-180deg);
  padding: 2px 5px 2px 5px;

  /* inline-block, NOT block: WebKit mis-places orthogonal-flow block
     children of a td (see sheets-css.md) */
  display: inline-block;
  vertical-align: bottom;
  line-height: normal;
}

/* rotated-only header cells: no line-box slack around the inline-block */
td.fixt, td.ha, td.score, td.date, td.stat-header { line-height: 0; }

/* minimal-stats sheets emit bare horizontal stat headers: restore their line box */
td.stat-header:not(:has(div.vertical)) { line-height: normal; }

td.fixt {
  font-size: 100%;
  color: black;
  white-space: nowrap;
  padding: 0px 0px 3px 0px;
  vertical-align: bottom;
}

td.ha {
  color: black;
  font-size: 100%;
  text-align: center;
  white-space: nowrap;
  padding: 3px 0px;
  vertical-align: bottom;
}

td.date {
  color:black;
  font-size: 90%;
  white-space: nowrap;
  padding: 2px 0px;
  vertical-align: bottom;
}

td.score {
  /* the rotated div's real width: WebKit under-measures it (see sheets-css.md) */
  min-width: 28px;
  height: 20px;
  font-size: 100%;
  color: black;
  text-align: center;
  white-space: nowrap;
  /* former 2px vertical padding lives on the div (see Score-color height cap) */
  padding: 0;
  vertical-align: bottom;
}

td.stat-header {min-width: 25px;
  vertical-align: bottom;}

td.stat {
  color:black;
}

/* W/D/L result marks */
td.draw {background-color: var(--draw); --c: var(--draw);}

/* pso rings as outlines, not inset shadows (pinch-zoom raster sliver, 2026-07-24) */
td.psoW {
    outline: solid 5px rgba(18, 115, 219, 0.3);
    outline-offset: -5px;
    padding: 4px;
}

td.psoL {
    outline: solid 5px rgba(224, 18, 45, 0.3);
    outline-offset: -5px;
    padding: 4px;
}

/* minutes */
td.m {width: 20px;}

/* starter */
td.s {font-weight: bold;}

/* cards */
td.y, td.y2, td.yr, td.r {
    position: relative;
    padding: 4px;
}

td.y {
    outline: solid 4px var(--yellow);
    outline-offset: -4px;
}

td.y2 {
    outline: dashed 4px var(--card_red);
    outline-offset: -4px;
    box-shadow: 0 0 0 4px var(--yellow) inset;
}

td.yr {
    outline: solid 3px var(--card_red);
    outline-offset: -3px;
    box-shadow: 0 0 0 5px var(--yellow) inset;
}

td.r {
    outline: solid 3px var(--card_red);
    outline-offset: -3px;
}

/* captaincy */
td.c {
    position: relative;
}

td.c::before {
    content: "C";
    position: absolute;
    top: 0px;
    right: 0px;
    font-size: 8px;
    color: #000000;
    font-weight: bold;
    background-color: transparent;
    padding: 1px 3px;
    text-shadow: 0 0 2px rgba(255, 255, 255, 0.8);
}

/** Goals, assists, own goals **/
/* tints as background IMAGES over the opaque --tint-base floor: a tier reads the same
   on both zebra parities; thead score cells are blanked below -- sheets-css.md */
/* begin programmatically generated css (tools/make_event_css.py) */
/* one-color backgrounds */

td.g1 {background: linear-gradient(var(--g1), var(--g1)) var(--tint-base); --c: var(--g1);}
td.g2 {background: linear-gradient(var(--g2), var(--g2)) var(--tint-base); --c: var(--g2);}
td.g3 {background: linear-gradient(var(--g3), var(--g3)) var(--tint-base); --c: var(--g3);}
td.gX {background: linear-gradient(var(--gX), var(--gX)) var(--tint-base); --c: var(--gX);}

td.a1 {background: linear-gradient(var(--a1), var(--a1)) var(--tint-base); --c: var(--a1);}
td.a2 {background: linear-gradient(var(--a2), var(--a2)) var(--tint-base); --c: var(--a2);}
td.a3 {background: linear-gradient(var(--a3), var(--a3)) var(--tint-base); --c: var(--a3);}
td.aX {background: linear-gradient(var(--aX), var(--aX)) var(--tint-base); --c: var(--aX);}

td.o1 {background: linear-gradient(var(--o1), var(--o1)) var(--tint-base); --c: var(--o1);}
td.o2 {background: linear-gradient(var(--o2), var(--o2)) var(--tint-base); --c: var(--o2);}
td.o3 {background: linear-gradient(var(--o3), var(--o3)) var(--tint-base); --c: var(--o3);}
td.oX {background: linear-gradient(var(--oX), var(--oX)) var(--tint-base); --c: var(--oX);}

/* two-color backgrounds */

td.g1a1 {background: linear-gradient(to top right, var(--g1) 50%, var(--a1) 50%) var(--tint-base);}
td.g1a2 {background: linear-gradient(to top right, var(--g1) 50%, var(--a2) 50%) var(--tint-base);}
td.g1a3 {background: linear-gradient(to top right, var(--g1) 50%, var(--a3) 50%) var(--tint-base);}
td.g1aX {background: linear-gradient(to top right, var(--g1) 50%, var(--aX) 50%) var(--tint-base);}
td.g2a1 {background: linear-gradient(to top right, var(--g2) 50%, var(--a1) 50%) var(--tint-base);}
td.g2a2 {background: linear-gradient(to top right, var(--g2) 50%, var(--a2) 50%) var(--tint-base);}
td.g2a3 {background: linear-gradient(to top right, var(--g2) 50%, var(--a3) 50%) var(--tint-base);}
td.g2aX {background: linear-gradient(to top right, var(--g2) 50%, var(--aX) 50%) var(--tint-base);}
td.g3a1 {background: linear-gradient(to top right, var(--g3) 50%, var(--a1) 50%) var(--tint-base);}
td.g3a2 {background: linear-gradient(to top right, var(--g3) 50%, var(--a2) 50%) var(--tint-base);}
td.g3a3 {background: linear-gradient(to top right, var(--g3) 50%, var(--a3) 50%) var(--tint-base);}
td.g3aX {background: linear-gradient(to top right, var(--g3) 50%, var(--aX) 50%) var(--tint-base);}
td.gXa1 {background: linear-gradient(to top right, var(--gX) 50%, var(--a1) 50%) var(--tint-base);}
td.gXa2 {background: linear-gradient(to top right, var(--gX) 50%, var(--a2) 50%) var(--tint-base);}
td.gXa3 {background: linear-gradient(to top right, var(--gX) 50%, var(--a3) 50%) var(--tint-base);}
td.gXaX {background: linear-gradient(to top right, var(--gX) 50%, var(--aX) 50%) var(--tint-base);}

td.g1o1 {background: linear-gradient(to top right, var(--g1) 50%, var(--o1s) 50%) var(--tint-base);}
td.g1o2 {background: linear-gradient(to top right, var(--g1) 50%, var(--o2s) 50%) var(--tint-base);}
td.g1o3 {background: linear-gradient(to top right, var(--g1) 50%, var(--o3s) 50%) var(--tint-base);}
td.g1oX {background: linear-gradient(to top right, var(--g1) 50%, var(--oXs) 50%) var(--tint-base);}
td.g2o1 {background: linear-gradient(to top right, var(--g2) 50%, var(--o1s) 50%) var(--tint-base);}
td.g2o2 {background: linear-gradient(to top right, var(--g2) 50%, var(--o2s) 50%) var(--tint-base);}
td.g2o3 {background: linear-gradient(to top right, var(--g2) 50%, var(--o3s) 50%) var(--tint-base);}
td.g2oX {background: linear-gradient(to top right, var(--g2) 50%, var(--oXs) 50%) var(--tint-base);}
td.g3o1 {background: linear-gradient(to top right, var(--g3) 50%, var(--o1s) 50%) var(--tint-base);}
td.g3o2 {background: linear-gradient(to top right, var(--g3) 50%, var(--o2s) 50%) var(--tint-base);}
td.g3o3 {background: linear-gradient(to top right, var(--g3) 50%, var(--o3s) 50%) var(--tint-base);}
td.g3oX {background: linear-gradient(to top right, var(--g3) 50%, var(--oXs) 50%) var(--tint-base);}
td.gXo1 {background: linear-gradient(to top right, var(--gX) 50%, var(--o1s) 50%) var(--tint-base);}
td.gXo2 {background: linear-gradient(to top right, var(--gX) 50%, var(--o2s) 50%) var(--tint-base);}
td.gXo3 {background: linear-gradient(to top right, var(--gX) 50%, var(--o3s) 50%) var(--tint-base);}
td.gXoX {background: linear-gradient(to top right, var(--gX) 50%, var(--oXs) 50%) var(--tint-base);}

td.a1o1 {background: linear-gradient(to top right, var(--a1) 50%, var(--o1s) 50%) var(--tint-base);}
td.a1o2 {background: linear-gradient(to top right, var(--a1) 50%, var(--o2s) 50%) var(--tint-base);}
td.a1o3 {background: linear-gradient(to top right, var(--a1) 50%, var(--o3s) 50%) var(--tint-base);}
td.a1oX {background: linear-gradient(to top right, var(--a1) 50%, var(--oXs) 50%) var(--tint-base);}
td.a2o1 {background: linear-gradient(to top right, var(--a2) 50%, var(--o1s) 50%) var(--tint-base);}
td.a2o2 {background: linear-gradient(to top right, var(--a2) 50%, var(--o2s) 50%) var(--tint-base);}
td.a2o3 {background: linear-gradient(to top right, var(--a2) 50%, var(--o3s) 50%) var(--tint-base);}
td.a2oX {background: linear-gradient(to top right, var(--a2) 50%, var(--oXs) 50%) var(--tint-base);}
td.a3o1 {background: linear-gradient(to top right, var(--a3) 50%, var(--o1s) 50%) var(--tint-base);}
td.a3o2 {background: linear-gradient(to top right, var(--a3) 50%, var(--o2s) 50%) var(--tint-base);}
td.a3o3 {background: linear-gradient(to top right, var(--a3) 50%, var(--o3s) 50%) var(--tint-base);}
td.a3oX {background: linear-gradient(to top right, var(--a3) 50%, var(--oXs) 50%) var(--tint-base);}
td.aXo1 {background: linear-gradient(to top right, var(--aX) 50%, var(--o1s) 50%) var(--tint-base);}
td.aXo2 {background: linear-gradient(to top right, var(--aX) 50%, var(--o2s) 50%) var(--tint-base);}
td.aXo3 {background: linear-gradient(to top right, var(--aX) 50%, var(--o3s) 50%) var(--tint-base);}
td.aXoX {background: linear-gradient(to top right, var(--aX) 50%, var(--oXs) 50%) var(--tint-base);}

/* three-color backgrounds */

td.g1a1o1 {background: linear-gradient(to top right, var(--g1) 33%, var(--a1) 33%, var(--a1) 66%, var(--o1s) 66%) var(--tint-base);}
td.g1a1o2 {background: linear-gradient(to top right, var(--g1) 33%, var(--a1) 33%, var(--a1) 66%, var(--o2s) 66%) var(--tint-base);}
td.g1a1o3 {background: linear-gradient(to top right, var(--g1) 33%, var(--a1) 33%, var(--a1) 66%, var(--o3s) 66%) var(--tint-base);}
td.g1a1oX {background: linear-gradient(to top right, var(--g1) 33%, var(--a1) 33%, var(--a1) 66%, var(--oXs) 66%) var(--tint-base);}
td.g1a2o1 {background: linear-gradient(to top right, var(--g1) 33%, var(--a2) 33%, var(--a2) 66%, var(--o1s) 66%) var(--tint-base);}
td.g1a2o2 {background: linear-gradient(to top right, var(--g1) 33%, var(--a2) 33%, var(--a2) 66%, var(--o2s) 66%) var(--tint-base);}
td.g1a2o3 {background: linear-gradient(to top right, var(--g1) 33%, var(--a2) 33%, var(--a2) 66%, var(--o3s) 66%) var(--tint-base);}
td.g1a2oX {background: linear-gradient(to top right, var(--g1) 33%, var(--a2) 33%, var(--a2) 66%, var(--oXs) 66%) var(--tint-base);}
td.g1a3o1 {background: linear-gradient(to top right, var(--g1) 33%, var(--a3) 33%, var(--a3) 66%, var(--o1s) 66%) var(--tint-base);}
td.g1a3o2 {background: linear-gradient(to top right, var(--g1) 33%, var(--a3) 33%, var(--a3) 66%, var(--o2s) 66%) var(--tint-base);}
td.g1a3o3 {background: linear-gradient(to top right, var(--g1) 33%, var(--a3) 33%, var(--a3) 66%, var(--o3s) 66%) var(--tint-base);}
td.g1a3oX {background: linear-gradient(to top right, var(--g1) 33%, var(--a3) 33%, var(--a3) 66%, var(--oXs) 66%) var(--tint-base);}
td.g1aXo1 {background: linear-gradient(to top right, var(--g1) 33%, var(--aX) 33%, var(--aX) 66%, var(--o1s) 66%) var(--tint-base);}
td.g1aXo2 {background: linear-gradient(to top right, var(--g1) 33%, var(--aX) 33%, var(--aX) 66%, var(--o2s) 66%) var(--tint-base);}
td.g1aXo3 {background: linear-gradient(to top right, var(--g1) 33%, var(--aX) 33%, var(--aX) 66%, var(--o3s) 66%) var(--tint-base);}
td.g1aXoX {background: linear-gradient(to top right, var(--g1) 33%, var(--aX) 33%, var(--aX) 66%, var(--oXs) 66%) var(--tint-base);}
td.g2a1o1 {background: linear-gradient(to top right, var(--g2) 33%, var(--a1) 33%, var(--a1) 66%, var(--o1s) 66%) var(--tint-base);}
td.g2a1o2 {background: linear-gradient(to top right, var(--g2) 33%, var(--a1) 33%, var(--a1) 66%, var(--o2s) 66%) var(--tint-base);}
td.g2a1o3 {background: linear-gradient(to top right, var(--g2) 33%, var(--a1) 33%, var(--a1) 66%, var(--o3s) 66%) var(--tint-base);}
td.g2a1oX {background: linear-gradient(to top right, var(--g2) 33%, var(--a1) 33%, var(--a1) 66%, var(--oXs) 66%) var(--tint-base);}
td.g2a2o1 {background: linear-gradient(to top right, var(--g2) 33%, var(--a2) 33%, var(--a2) 66%, var(--o1s) 66%) var(--tint-base);}
td.g2a2o2 {background: linear-gradient(to top right, var(--g2) 33%, var(--a2) 33%, var(--a2) 66%, var(--o2s) 66%) var(--tint-base);}
td.g2a2o3 {background: linear-gradient(to top right, var(--g2) 33%, var(--a2) 33%, var(--a2) 66%, var(--o3s) 66%) var(--tint-base);}
td.g2a2oX {background: linear-gradient(to top right, var(--g2) 33%, var(--a2) 33%, var(--a2) 66%, var(--oXs) 66%) var(--tint-base);}
td.g2a3o1 {background: linear-gradient(to top right, var(--g2) 33%, var(--a3) 33%, var(--a3) 66%, var(--o1s) 66%) var(--tint-base);}
td.g2a3o2 {background: linear-gradient(to top right, var(--g2) 33%, var(--a3) 33%, var(--a3) 66%, var(--o2s) 66%) var(--tint-base);}
td.g2a3o3 {background: linear-gradient(to top right, var(--g2) 33%, var(--a3) 33%, var(--a3) 66%, var(--o3s) 66%) var(--tint-base);}
td.g2a3oX {background: linear-gradient(to top right, var(--g2) 33%, var(--a3) 33%, var(--a3) 66%, var(--oXs) 66%) var(--tint-base);}
td.g2aXo1 {background: linear-gradient(to top right, var(--g2) 33%, var(--aX) 33%, var(--aX) 66%, var(--o1s) 66%) var(--tint-base);}
td.g2aXo2 {background: linear-gradient(to top right, var(--g2) 33%, var(--aX) 33%, var(--aX) 66%, var(--o2s) 66%) var(--tint-base);}
td.g2aXo3 {background: linear-gradient(to top right, var(--g2) 33%, var(--aX) 33%, var(--aX) 66%, var(--o3s) 66%) var(--tint-base);}
td.g2aXoX {background: linear-gradient(to top right, var(--g2) 33%, var(--aX) 33%, var(--aX) 66%, var(--oXs) 66%) var(--tint-base);}
td.g3a1o1 {background: linear-gradient(to top right, var(--g3) 33%, var(--a1) 33%, var(--a1) 66%, var(--o1s) 66%) var(--tint-base);}
td.g3a1o2 {background: linear-gradient(to top right, var(--g3) 33%, var(--a1) 33%, var(--a1) 66%, var(--o2s) 66%) var(--tint-base);}
td.g3a1o3 {background: linear-gradient(to top right, var(--g3) 33%, var(--a1) 33%, var(--a1) 66%, var(--o3s) 66%) var(--tint-base);}
td.g3a1oX {background: linear-gradient(to top right, var(--g3) 33%, var(--a1) 33%, var(--a1) 66%, var(--oXs) 66%) var(--tint-base);}
td.g3a2o1 {background: linear-gradient(to top right, var(--g3) 33%, var(--a2) 33%, var(--a2) 66%, var(--o1s) 66%) var(--tint-base);}
td.g3a2o2 {background: linear-gradient(to top right, var(--g3) 33%, var(--a2) 33%, var(--a2) 66%, var(--o2s) 66%) var(--tint-base);}
td.g3a2o3 {background: linear-gradient(to top right, var(--g3) 33%, var(--a2) 33%, var(--a2) 66%, var(--o3s) 66%) var(--tint-base);}
td.g3a2oX {background: linear-gradient(to top right, var(--g3) 33%, var(--a2) 33%, var(--a2) 66%, var(--oXs) 66%) var(--tint-base);}
td.g3a3o1 {background: linear-gradient(to top right, var(--g3) 33%, var(--a3) 33%, var(--a3) 66%, var(--o1s) 66%) var(--tint-base);}
td.g3a3o2 {background: linear-gradient(to top right, var(--g3) 33%, var(--a3) 33%, var(--a3) 66%, var(--o2s) 66%) var(--tint-base);}
td.g3a3o3 {background: linear-gradient(to top right, var(--g3) 33%, var(--a3) 33%, var(--a3) 66%, var(--o3s) 66%) var(--tint-base);}
td.g3a3oX {background: linear-gradient(to top right, var(--g3) 33%, var(--a3) 33%, var(--a3) 66%, var(--oXs) 66%) var(--tint-base);}
td.g3aXo1 {background: linear-gradient(to top right, var(--g3) 33%, var(--aX) 33%, var(--aX) 66%, var(--o1s) 66%) var(--tint-base);}
td.g3aXo2 {background: linear-gradient(to top right, var(--g3) 33%, var(--aX) 33%, var(--aX) 66%, var(--o2s) 66%) var(--tint-base);}
td.g3aXo3 {background: linear-gradient(to top right, var(--g3) 33%, var(--aX) 33%, var(--aX) 66%, var(--o3s) 66%) var(--tint-base);}
td.g3aXoX {background: linear-gradient(to top right, var(--g3) 33%, var(--aX) 33%, var(--aX) 66%, var(--oXs) 66%) var(--tint-base);}
td.gXa1o1 {background: linear-gradient(to top right, var(--gX) 33%, var(--a1) 33%, var(--a1) 66%, var(--o1s) 66%) var(--tint-base);}
td.gXa1o2 {background: linear-gradient(to top right, var(--gX) 33%, var(--a1) 33%, var(--a1) 66%, var(--o2s) 66%) var(--tint-base);}
td.gXa1o3 {background: linear-gradient(to top right, var(--gX) 33%, var(--a1) 33%, var(--a1) 66%, var(--o3s) 66%) var(--tint-base);}
td.gXa1oX {background: linear-gradient(to top right, var(--gX) 33%, var(--a1) 33%, var(--a1) 66%, var(--oXs) 66%) var(--tint-base);}
td.gXa2o1 {background: linear-gradient(to top right, var(--gX) 33%, var(--a2) 33%, var(--a2) 66%, var(--o1s) 66%) var(--tint-base);}
td.gXa2o2 {background: linear-gradient(to top right, var(--gX) 33%, var(--a2) 33%, var(--a2) 66%, var(--o2s) 66%) var(--tint-base);}
td.gXa2o3 {background: linear-gradient(to top right, var(--gX) 33%, var(--a2) 33%, var(--a2) 66%, var(--o3s) 66%) var(--tint-base);}
td.gXa2oX {background: linear-gradient(to top right, var(--gX) 33%, var(--a2) 33%, var(--a2) 66%, var(--oXs) 66%) var(--tint-base);}
td.gXa3o1 {background: linear-gradient(to top right, var(--gX) 33%, var(--a3) 33%, var(--a3) 66%, var(--o1s) 66%) var(--tint-base);}
td.gXa3o2 {background: linear-gradient(to top right, var(--gX) 33%, var(--a3) 33%, var(--a3) 66%, var(--o2s) 66%) var(--tint-base);}
td.gXa3o3 {background: linear-gradient(to top right, var(--gX) 33%, var(--a3) 33%, var(--a3) 66%, var(--o3s) 66%) var(--tint-base);}
td.gXa3oX {background: linear-gradient(to top right, var(--gX) 33%, var(--a3) 33%, var(--a3) 66%, var(--oXs) 66%) var(--tint-base);}
td.gXaXo1 {background: linear-gradient(to top right, var(--gX) 33%, var(--aX) 33%, var(--aX) 66%, var(--o1s) 66%) var(--tint-base);}
td.gXaXo2 {background: linear-gradient(to top right, var(--gX) 33%, var(--aX) 33%, var(--aX) 66%, var(--o2s) 66%) var(--tint-base);}
td.gXaXo3 {background: linear-gradient(to top right, var(--gX) 33%, var(--aX) 33%, var(--aX) 66%, var(--o3s) 66%) var(--tint-base);}
td.gXaXoX {background: linear-gradient(to top right, var(--gX) 33%, var(--aX) 33%, var(--aX) 66%, var(--oXs) 66%) var(--tint-base);}
/* end of programmatically generated css */

/** Score-color height cap **/

/* paint the rotated div (--c from the tier rules), not the cell: color
   hugs each scoreline in a double-digit-stretched row */
thead td.score { background: none; overflow: hidden; }
/* the band: div-height, bled sideways, clipped by the cell (the transformed div contains it) */
td.score > div.vertical::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: -100px;
  right: -100px;
  background: var(--c, transparent);
  z-index: -1;
}
/* td.score's former 2px vertical padding, doubled onto the div; pso
   cells keep td 4px + div 2px (ring inset geometry) */
td.score:not(.psoW):not(.psoL) > div.vertical {
  padding-top: 4px;
  padding-bottom: 4px;
}
/* pso rows: level the band tops by the 4px ring padding; bottom:-4px is the SCREEN-TOP (rotated) */
thead tr:has(> td.psoW, > td.psoL) > td.score > div.vertical::before { bottom: -4px; }
thead :is(td.psoW, td.psoL) > div.vertical::before {
  top: -4px;
  bottom: -4px;
}

/** Scroll wrapper + frozen left block **/
/* (must precede the touch gates: their internal resets win by source order;
   companion in-page scripts set .measured/--name-w -- see sheets-css.md) */

/* Pane model (2026-09-05): a viewport-high pane scrolling in BOTH axes; the page
   never scrolls (8 + pane + 16 = viewport).  sheets-css.md "Pane model" */
div.sheetwrap {
  height: calc(100vh - 16px);
  height: calc(100dvh - 16px);
  box-sizing: border-box;
  overflow: auto;
}
div.sheetwrap:focus { outline: none; }

/* frozen header block: sticky on the THEAD element (per-cell sticky fails under
   border-collapse); z 101 sits between the hover lift (100) and the bubbles (200) */
thead {
  position: sticky;
  top: 0;
  z-index: 101;
  background-color: white;
}

/* short viewports: rotated opponent names capped at 20 characters (+1px of rounding
   slack), ellipsis at the visual top -- sheets-css.md "Opponent-name ellipsis" */
@media (max-height: 900px) {
  thead td.fixt div.vertical {
    max-height: calc(20ch + 1px);
    overflow: hidden;
    text-overflow: ellipsis;
  }
}

/* rb freeze keys on .measured: never pin at a bogus offset without the
   measure script */
div.sheetwrap tbody td.name { position: sticky; left: 0; z-index: 2; }
div.sheetwrap.measured tbody td.rb { position: sticky; left: var(--name-w); z-index: 2; }

/* Name-column pin (sheets.js --name-pin) -- sheets-css.md */
div.sheetwrap.name-pinned tbody td.name:not([colspan]) {
  box-sizing: border-box;
  width: var(--name-pin, auto);
  max-width: var(--name-pin, 275px);
}

/* collapsed borders do NOT follow sticky cells: color off; the line is the
   ::after strip in the frozen-edge separator section below */
div.sheetwrap.measured tbody td.rb {
  border-right-color: transparent;
}

/* long-name hover expansion keeps its lift over the DOM-later frozen rb */
div.sheetwrap tbody td.name:hover { z-index: 100; }

/* sticky cells need their own opaque backgrounds (zebra does not follow a
   displaced cell); td.name :not(:hover) keeps the expansion on top */
div.sheetwrap tbody tr:nth-child(odd) td.name:not(:hover),
div.sheetwrap tbody tr:nth-child(odd) td.rb { background-color: #d9d9d9; }
div.sheetwrap tbody tr:nth-child(even) td.name:not(:hover),
div.sheetwrap tbody tr:nth-child(even) td.rb { background-color: #f2f2f2; }

/* on hover the parity paints stay: the row-header echo is an inset
   box-shadow over them (Hover echo section), nothing repaints */

/* every header/footer row leads with a colspan-2 cell; freeze them all */
div.sheetwrap :is(thead, tfoot) td[colspan="2"]:first-child {
  position: sticky;
  left: 0;
  z-index: 2;
  background-color: white;
}

/* dual-inset sticky pins the next-season link on-screen across the whole
   scroll range */
div.sheetwrap tfoot td > span.footpin {
  display: inline-block;
  position: sticky;
  left: 0;
  right: 0;
}

/* manager-name pin, in-cell form (legacy rows): the name holds at the block edge
   until its colspan runs out; left = name col + rb col, mismatches overshoot only */
div.sheetwrap.measured tfoot :is(td.man, td.cman) > div.overflow-hack {
  position: sticky;
  left: calc(var(--name-w) + 1ch + 9px);
}

/* manager pin, CELL form (split rows, 2026-09-05): the cell is sticky, the visuals
   are an absolute box inside it (iOS ignores in-cell sticky during a pan) */
div.sheetwrap.measured tfoot tr:has(> td.manfill) :is(td.man, td.cman):has(> div.overflow-hack) {
  position: sticky;
  left: calc(var(--name-w) + 1ch + 4px);   /* text pin (+9px) - 2px border - 3px padding */
  border-left-color: transparent;
  background-color: transparent;
}
div.sheetwrap.measured tfoot tr:has(> td.manfill) td.cman:has(> div.overflow-hack) {
  left: calc(var(--name-w) + 1ch + 6px);   /* 1px padding */
}
div.sheetwrap.measured tfoot tr:has(> td.manfill) :is(td.man, td.cman) > div.overflow-hack {
  position: absolute;
  left: -2px;
  top: 0;
  bottom: 0;
  max-width: none;
  width: max-content;
  box-sizing: content-box;
  border-left: 2px solid gray;
  padding: 0 200px 0 3px;
  background-color: white;
  white-space: nowrap;
}
div.sheetwrap.measured tfoot tr:has(> td.manfill) td.cman > div.overflow-hack { padding-left: 1px; }
div.sheetwrap.measured tfoot tr:has(> td.manfill) :is(td.man, td.cman):not(:has(> div.overflow-hack)) { position: relative; }
tfoot td.manfill { border-left: none; padding: 0; }

/* Spell as one focus area (sheets.js --spell-w) -- sheets-css.md */
div.sheetwrap.snap-js tfoot tr:has(> td.manfill) :is(td.man, td.cman) > div.overflow-hack {
  box-sizing: border-box;
  width: calc(var(--spell-w) + 2px);   /* + the left border */
  padding-right: 0;
  text-align: left;                    /* a spell-wide box would centre the name */
}
/* the cell's own frame would be the one-column sliver, under the box */
div.sheetwrap.snap-js tfoot tr:has(> td.manfill) :is(td.man, td.cman)[title]:hover::before { content: none; }
div.sheetwrap.snap-js tfoot tr:has(> td.manfill) :is(td.man, td.cman)[title]:hover > div.overflow-hack {
  background-image: linear-gradient(rgba(var(--echo-rgb), var(--echo-cell-alpha)),
                                    rgba(var(--echo-rgb), var(--echo-cell-alpha)));
  background-repeat: no-repeat;
  background-position: 2px 0;                  /* past the border */
  background-size: calc(100% - 2px) 100%;      /* a background: under the text */
}
div.sheetwrap.snap-js tfoot tr:has(> td.manfill) :is(td.man, td.cman)[title]:hover > div.overflow-hack::before {
  content: "";
  position: absolute;
  inset: 0 0 0 2px;
  border: 2px dotted black;
  box-sizing: border-box;
  pointer-events: none;
}

/* long-name hover backing: span.nm (generator, 2026-09-05) hides what is under the expanded name */
div.sheetwrap tbody td.name:hover > span.nm {
  background-color: rgb(207, 207, 207);
  background-color: color-mix(in srgb, rgb(var(--echo-rgb)) calc(var(--echo-alpha) * 100%), #fff);
  padding: 3px 5px 3px 0;
}

/* cross-competition link: an absolute strip in the full-width next-season cell,
   clamped to the fixture columns by the measured --fixt-w (unmeasured: full cell) */
div.sheetwrap tfoot td.nextSeason { position: relative; }
div.sheetwrap tfoot td.nextSeason > div.xmid {
  position: absolute;
  left: 0;
  right: 0;
  width: var(--fixt-w, auto);
  top: 50%;
  transform: translateY(-50%);
  text-align: center;
  white-space: nowrap;
}

/* the cross link slides like the manager names: dual-inset sticky, clear of the footpin; .measured only */
div.sheetwrap.measured tfoot td.nextSeason div.xmid > span.xpin {
  display: inline-block;
  position: sticky;
  left: calc(var(--name-w) + 1ch + 9px);
  right: 8em;
}

/* opaque footpin: it may pass over a static (unmeasured) cross link */
div.sheetwrap tfoot td.nextSeason > span.footpin { background-color: white; }

/** Touch gates: tap tooltips **/
/* TWO copies of the same content -- @supports = iOS/iPadOS, the media query = other
   touch devices -- KEEP THEM IN SYNC.  Second gate: PRIMARY pointer on purpose (sheets-css.md) */

@supports (-webkit-touch-callout: none) {
  table.playerSeason { touch-action: manipulation; }
  table.playerSeason td[title] {
    position: relative;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    -webkit-user-select: none;
    user-select: none;
  }

  /* (owner shade + echo: Hover echo section, all devices since 2026-09-04) */
  table.playerSeason td[title]:hover::after {
    content: attr(title);
    position: absolute;
    top: 100%; left: auto; right: 0;
    z-index: 200;
    pointer-events: none;
    background: #2e2e2e;
    color: #fff;
    border: 1px solid #555;
    padding: 4px 7px;
    font: normal 13px/1.4 -apple-system, "Segoe UI", sans-serif;
    text-align: left;
    text-shadow: none;
    white-space: pre-wrap;
    width: max-content;
    max-width: 320px;
  }

  /* pinned at the frozen edge: right-anchored, the bubble opens under the block */
  div.sheetwrap tfoot :is(td.man, td.cman)[title]:hover::after { left: 0; right: auto; }

  /* bubble open: release the score band's clip (it would swallow the bubble), pull the bleed home */
  thead td.score[title]:hover { overflow: visible; }
  thead td.score[title]:hover > div.vertical::before { left: 0; right: 0; }
  div.sheetwrap.measured thead td:first-child + td.score[title]:hover,
  div.sheetwrap.snap-js thead td.score[title]:hover { clip-path: none; }

  /* permanent bubble landing room, a block INSIDE the pane; sheets.js shrinks --landing for the end fit */
  div.sheetwrap { padding-bottom: 0; }
  div.sheetwrap::after { content: ""; display: block; height: var(--landing, 100px); }
}
/* -- second gate: same content as above, keep in sync.  Primary-pointer
      form, NOT any-pointer -- see the header comment above. -- */
@media (hover: none) and (pointer: coarse) {
  table.playerSeason { touch-action: manipulation; }
  table.playerSeason td[title] {
    position: relative;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    -webkit-user-select: none;
    user-select: none;
  }

  /* (owner shade + echo: Hover echo section, all devices since 2026-09-04) */
  table.playerSeason td[title]:hover::after {
    content: attr(title);
    position: absolute;
    top: 100%; left: auto; right: 0;
    z-index: 200;
    pointer-events: none;
    background: #2e2e2e;
    color: #fff;
    border: 1px solid #555;
    padding: 4px 7px;
    font: normal 13px/1.4 -apple-system, "Segoe UI", sans-serif;
    text-align: left;
    text-shadow: none;
    white-space: pre-wrap;
    width: max-content;
    max-width: 320px;
  }

  /* pinned at the frozen edge: right-anchored, the bubble opens under the block */
  div.sheetwrap tfoot :is(td.man, td.cman)[title]:hover::after { left: 0; right: auto; }

  /* bubble open: release the score band's clip (it would swallow the bubble), pull the bleed home */
  thead td.score[title]:hover { overflow: visible; }
  thead td.score[title]:hover > div.vertical::before { left: 0; right: 0; }
  div.sheetwrap.measured thead td:first-child + td.score[title]:hover,
  div.sheetwrap.snap-js thead td.score[title]:hover { clip-path: none; }

  /* permanent bubble landing room, a block INSIDE the pane; sheets.js shrinks --landing for the end fit */
  div.sheetwrap { padding-bottom: 0; }
  div.sheetwrap::after { content: ""; display: block; height: var(--landing, 100px); }
}

/* owner-cell dotted frame: ALL devices (desktop affordance too) */
table.playerSeason td[title] { position: relative; }
table.playerSeason td[title]:hover::before {
  content: "";
  position: absolute;
  inset: 0;
  border: 2px dotted black;
  box-sizing: border-box;
  pointer-events: none;
}

/* captain cells use ::before for the C: keep it, inside the frame */
table.playerSeason td.c[title]:hover::before {
  content: "C";
  font-size: 8px;
  font-weight: bold;
  color: #000000;
  text-align: right;
  padding: 1px 3px;
  text-shadow: 0 0 2px rgba(255, 255, 255, 0.8);
}

/** Crest sink + centering **/
/* script-driven (--crest-sink/--crest-shift, crestMeasureScript);
   see sheets-css.md.  z-index 3: overhang paints over the z-2 spacers */
div.sheetwrap thead td.img[colspan="2"] { z-index: 3; }
/* block img ignores text-align: auto margins re-center */
div.sheetwrap.crest-measured thead td.img img.crest {
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: calc(-1 * var(--crest-sink, 0px));
  transform: translateY(var(--crest-shift, 0px));
}

/** Frozen-edge separator **/
/* one ::after strip per frozen cell, aligned by symmetry -- see
   sheets-css.md for why shadows and collapsed borders both failed */

/* own transparent border equalizes box accounting (layout-neutral); td.name's overflow would clip the strip */
div.sheetwrap.measured thead tr:has(> td.score) > td[colspan="2"]:first-child,
div.sheetwrap.measured tfoot tr:has(> td.man) > td[colspan="2"]:first-child {
  border-right: 2px solid transparent;

  overflow: visible;
}

/* right:-1px lands the strip on the grid line, replacing the blanked
   collapsed borders */
div.sheetwrap.measured tbody td.rb::after,
div.sheetwrap.measured thead tr:has(> td.score) > td[colspan="2"]:first-child::after,
div.sheetwrap.measured tfoot tr:has(> td.man) > td[colspan="2"]:first-child::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: -1px;
  width: 2px;
  background: gray;
}
div.sheetwrap.measured thead td:first-child + td.score { border-left-color: transparent; }
div.sheetwrap.measured tfoot td[colspan="2"]:first-child + :is(td.man, td.cman) { border-left-color: transparent; }

/* the score band must reach left under the strip; without geometry-box clip-path a 1px gap stays */
@supports (clip-path: inset(0 0 0 -3px) padding-box) {
  div.sheetwrap.measured thead td:first-child + td.score {
    overflow: visible;
    clip-path: inset(0 0 0 -3px) padding-box;
  }
}

/* Blink leaves the blanked border's outer half unpainted in player
   rows: rb's spare pseudo repaints it with the row background */
div.sheetwrap.measured tbody td.rb::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: -2px;
  width: 1px;
  background: inherit;
}

/** Header frame lines **/
/* strips under .snap-js; borders kept but transparent (a removed one moves the column) */
div.sheetwrap.snap-js thead td.dv, div.sheetwrap.snap-js thead td:first-child + td.score { border-left-color: transparent; }
div.sheetwrap.snap-js thead td.score:last-child { border-right-color: transparent; }

/* left bookend: the lead strip in two background layers -- ONE pseudo, a second stalls Chromium key scrolling */
div.sheetwrap.measured.snap-js thead tr:has(> td.score) > td[colspan="2"]:first-child::after {
  right: -2px;
  width: 3px;
  background:
    linear-gradient(white, white) top / 3px calc(100% - max(var(--band-l), 3ch + 8px)) no-repeat,
    linear-gradient(to right, gray 2px, transparent 0) bottom / 3px max(var(--band-l), 3ch + 8px) no-repeat;
}
div.sheetwrap.measured.snap-js thead tr:has(> td.psoW, > td.psoL) > td[colspan="2"]:first-child::after {
  background:
    linear-gradient(white, white) top / 3px calc(100% - max(var(--band-l), 3ch + 12px)) no-repeat,
    linear-gradient(to right, gray 2px, transparent 0) bottom / 3px max(var(--band-l), 3ch + 12px) no-repeat;
}

/* right bookend and dv line: strips of the separator cell -- NO z-index, it makes Chromium key scrolling fragile */
div.sheetwrap.snap-js thead tr.separator > td { position: relative; }
div.sheetwrap.snap-js thead tr.separator > td::before,
div.sheetwrap.snap-js thead tr.separator > td::after {
  position: absolute;
  width: 2px;
  background: gray;
  top: calc(3px - var(--hdr-h));
  bottom: 3px;
}
div.sheetwrap.snap-js thead tr.separator > td::after {
  content: "";
  left: calc(var(--x-last) - 1px);
  background: linear-gradient(to top, gray max(var(--band-r), 3ch + 8px), white 0);
}
div.sheetwrap.snap-js thead:has(td.psoW, td.psoL) tr.separator > td::after { background: linear-gradient(to top, gray max(var(--band-r), 3ch + 12px), white 0); }
div.sheetwrap.snap-js thead:has(td.fixt.dv) tr.separator > td::before { content: ""; left: calc(var(--x-dv) - 1px); }

/* the bands reach 1px under the strips, like the first cell's under the lead strip (Frozen-edge
   separator): no seam at a fractional column edge.  The hover gates release these clips too */
@supports (clip-path: inset(0 -1px 0 0) padding-box) {
  div.sheetwrap.snap-js thead td.score:last-child,
  div.sheetwrap.snap-js thead td.score:has(+ td.dv) { overflow: visible; clip-path: inset(0 -1px 0 0) padding-box; }
  div.sheetwrap.snap-js thead td.score.dv { overflow: visible; clip-path: inset(0 0 0 -1px) padding-box; }
  div.sheetwrap.measured.snap-js thead td:first-child + td.score:is(:last-child, :has(+ td.dv)) { clip-path: inset(0 -1px 0 -3px) padding-box; }
}

/** Browser print **/
/* release the pane, static header, no landing room, no pins; sheets-print.css (PDF driver) has the same and more */
@media print {
  div.sheetwrap { height: auto; overflow: visible; }
  /* the name-column pin is a screen measurement (sheets.js): print sizes the column itself */
  div.sheetwrap.name-pinned tbody td.name:not([colspan]) { box-sizing: content-box; width: auto; max-width: 275px; }
  div.sheetwrap::after { content: none; }
  thead { position: static; }
  /* relative still honours the pin's left offset: the cell would sit 246px into its spell */
  div.sheetwrap.measured tfoot tr:has(> td.manfill) :is(td.man, td.cman):has(> div.overflow-hack) { position: relative; left: auto; }
  /* header frame lines (script state): a static header paints its collapsed borders again;
     strips off, colours back */
  div.sheetwrap.snap-js thead tr.separator > td::before, div.sheetwrap.snap-js thead tr.separator > td::after { content: none; }
  div.sheetwrap.measured.snap-js thead tr:has(> td.score) > td[colspan="2"]:first-child::after { right: -1px; width: 2px; background: gray; }
  div.sheetwrap.snap-js thead td.dv { border-left-color: gray; }
  div.sheetwrap.snap-js thead td.score:last-child { border-right-color: gray; }
}
