/* The event results leaderboard.
   One component, used by completed Stableford events and by the printed rounds
   in club history. Every colour, radius and font below comes from the design
   tokens declared at the top of styles.css; none is redefined here.
   Selectors are prefixed .lb so the superseded .results-list, .result-row and
   .archive-results rules in styles.css cannot reach this markup. */
.lb {
  --lb-rank: 70px;
  --lb-gap: 18px;
  --lb-pad: 24px;
  /* Fallbacks. Each board sets its own tracks through a shape class below. */
  --lb-tail: 104px;
  --lb-tail-sm: 46px;
  margin-top: 22px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--paper);
  /* clip, not hidden: an overflow of hidden would stop the heading row
     sticking on a phone. */
  overflow: clip;
}
.lb-head {
  padding: 24px var(--lb-pad) 20px;
  background: linear-gradient(180deg, var(--sand), var(--paper));
  border-bottom: 1px solid var(--line);
}
.lb-kicker {
  margin: 0 0 7px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.3px;
  text-transform: uppercase;
  color: var(--brown);
}
.lb-title {
  margin: 0;
  font-family: Montserrat;
  font-weight: 800;
  font-size: 27px;
  line-height: 1.15;
  color: var(--green);
}
.lb-meta {
  margin: 7px 0 0;
  font-size: 15.5px;
  color: var(--muted);
}
.lb-headrow {
  display: grid;
  grid-template-columns: var(--lb-rank) minmax(0, 1fr) var(--lb-tail);
  column-gap: var(--lb-gap);
  align-items: center;
  padding: 13px var(--lb-pad);
  background: var(--sage);
  color: var(--green);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.9px;
  text-transform: uppercase;
}
.lb-h-rank {
  text-align: center;
}
.lb-h-num {
  text-align: right;
}
.lb-group {
  display: grid;
  grid-template-columns: var(--lb-rank) minmax(0, 1fr);
  column-gap: var(--lb-gap);
  padding: 0 var(--lb-pad);
  border-bottom: 1px solid var(--line);
  break-inside: avoid;
}
.lb-group:last-child {
  border-bottom: 0;
}
/* The rank block spans its tied rows, so T2 is stated once beside the two
   players who share second place. */
/* Column tracks per board shape.
   These were once written as an inline style attribute on the section, which
   the production CSP (style-src 'self', no unsafe-inline) silently refuses, so
   the grid collapsed to one column on the server while looking correct on the
   local PHP server that sends no CSP. They are classes now. */
.lb--points {
  --lb-tail: 104px;
  --lb-tail-sm: 46px;
}

.lb--hcp-points {
  --lb-tail: 96px 104px;
  --lb-tail-sm: 58px 46px;
}

.lb--points-record {
  --lb-tail: 100px 108px;
  --lb-tail-sm: 56px;
}

.lb--gross-nett-record {
  --lb-tail: 76px 76px 108px;
  --lb-tail-sm: 52px 52px;
}

.lb-rank {
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: stretch;
  margin: 12px 0;
  border-radius: 12px;
  background: var(--sage);
  color: var(--green);
  font-family: Montserrat;
  font-weight: 700;
  font-size: 21px;
  font-variant-numeric: tabular-nums;
}
.lb-rank.is-blank {
  background: none;
}
.lb-group.is-leader {
  background: linear-gradient(
    90deg,
    rgba(232, 236, 223, 0.6),
    rgba(255, 254, 249, 0)
  );
}
.lb-group.is-leader .lb-rank {
  background: var(--green);
  color: var(--cream);
  font-size: 28px;
}
.lb-entries {
  min-width: 0;
}
.lb-tag {
  margin: 14px 0 0;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  color: var(--brown);
}
.lb-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) var(--lb-tail);
  column-gap: var(--lb-gap);
  align-items: center;
  min-height: 68px;
  padding: 15px 0;
  border-top: 1px solid var(--line);
}
.lb-entries > .lb-row:first-child,
.lb-tag + .lb-row {
  border-top: 0;
}
.lb-player {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
}
.lb-name {
  min-width: 0;
}
.lb-name a,
.lb-name strong {
  font-size: 17px;
  font-weight: 650;
  color: var(--ink);
  text-decoration: none;
}
.lb-name a:hover {
  text-decoration: underline;
  text-underline-offset: 4px;
}
.lb-name small {
  display: block;
  margin-top: 3px;
  font-size: 13.5px;
  color: var(--muted);
}
.lb-num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.lb-used {
  font-size: 16px;
  color: var(--muted);
}
.lb-score {
  font-family: Montserrat;
  font-weight: 700;
  font-size: 25px;
  color: var(--green);
}
/* The leader is set apart: a taller row, a larger name and a larger score. */
.lb-group.is-leader .lb-row {
  min-height: 92px;
  padding: 22px 0;
}
.lb-group.is-leader .lb-name a,
.lb-group.is-leader .lb-name strong {
  font-size: 21px;
}
.lb-group.is-leader .lb-score {
  font-size: 34px;
  color: var(--brown);
}
.lb-group.is-leader .lb-used {
  font-size: 17px;
}
.lb-group.is-leader .avatar {
  width: 52px;
  height: 52px;
  font-size: 15px;
  background: var(--sand);
}
.lb-link {
  text-align: right;
  font-size: 14px;
}
.lb-link a {
  font-weight: 600;
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
}
@media (max-width: 1000px) {
  .lb {
    --lb-rank: 62px;
    --lb-gap: 14px;
    --lb-pad: 20px;
  }
  .lb-title {
    font-size: 24px;
  }
}
@media (max-width: 760px) {
  .lb {
    --lb-rank: 48px;
    --lb-gap: 12px;
    --lb-pad: 14px;
  }
  /* The source link is too wide for a column here, so it takes its own line
     under the player. The heading loses that column with it. */
  .lb-headrow {
    grid-template-columns: var(--lb-rank) minmax(0, 1fr) var(--lb-tail-sm);
    padding: 11px var(--lb-pad);
    font-size: 12px;
    letter-spacing: 0;
    position: sticky;
    top: 0;
    z-index: 2;
  }
  .lb-row {
    grid-template-columns: minmax(0, 1fr) var(--lb-tail-sm);
    min-height: 62px;
  }
  .lb-h-link {
    display: none;
  }
  .lb-link {
    grid-column: 1 / -1;
    text-align: left;
    margin-top: 2px;
  }
  .lb-head {
    padding: 18px var(--lb-pad) 16px;
  }
  .lb-title {
    font-size: 21px;
  }
  .lb-meta {
    font-size: 14.5px;
  }
  .lb-rank {
    font-size: 18px;
    margin: 10px 0;
    border-radius: 10px;
  }
  .lb-group.is-leader .lb-rank {
    font-size: 22px;
  }
  .lb-score {
    font-size: 21px;
  }
  .lb-group.is-leader .lb-score {
    font-size: 27px;
  }
  .lb-name a,
  .lb-name strong {
    font-size: 16px;
  }
  .lb-group.is-leader .lb-name a,
  .lb-group.is-leader .lb-name strong {
    font-size: 19px;
  }
  .lb-used {
    font-size: 15px;
  }
}
@media (max-width: 480px) {
  .lb {
    --lb-rank: 40px;
    --lb-gap: 10px;
    --lb-pad: 10px;
  }
  /* Initials are dropped rather than let a 390px row overflow sideways. */
  .lb .avatar,
  .lb-group.is-leader .avatar {
    display: none;
  }
  .lb-player {
    gap: 0;
  }
  .lb-rank {
    font-size: 16px;
  }
  .lb-group.is-leader .lb-rank {
    font-size: 19px;
  }
  .lb-score {
    font-size: 19px;
  }
  .lb-group.is-leader .lb-score {
    font-size: 22px;
  }
  .lb-name a,
  .lb-name strong {
    font-size: 15.5px;
  }
  .lb-group.is-leader .lb-name a,
  .lb-group.is-leader .lb-name strong {
    font-size: 17.5px;
  }
  .lb-name small {
    font-size: 12.5px;
  }
  .lb-used {
    font-size: 14px;
  }
  .lb-row {
    min-height: 58px;
    padding: 13px 0;
  }
  .lb-group.is-leader .lb-row {
    min-height: 74px;
    padding: 17px 0;
  }
}
@media print {
  .lb {
    break-inside: auto;
  }
  .lb-headrow {
    position: static;
  }
  .lb-link {
    display: none;
  }
}