:root {
  --ink:#172033;
  --muted:#667085;
  --line:#c9ced6;
  --head:#e8edf3;
  --panel:#fff;
  --page:#f4f6f8;
  --accent:#a82432;
  --accent-soft:#fff0c7;
  --focus:#ffe38a;
  --rowcol:#f6edcf;
}
* { box-sizing:border-box; }
body {
  margin:0;
  font-family:Arial,Helvetica,sans-serif;
  color:var(--ink);
  background:var(--page);
}
main { max-width:1500px; margin:auto; padding:18px; }
.archive-header {
  display:flex;
  justify-content:space-between;
  gap:18px;
  align-items:end;
  flex-wrap:wrap;
}
h1 { margin:0 0 4px; font-size:1.65rem; }
.subtitle { margin:0 0 14px; color:var(--muted); }
.selectors { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:14px; }
.selectors label { display:grid; gap:4px; color:var(--muted); font-size:.82rem; }
.selectors select {
  min-width:155px;
  border:1px solid var(--line);
  border-radius:6px;
  background:#fff;
  padding:7px 9px;
  color:var(--ink);
}
.toolbar {
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
  margin:0 0 10px;
}
.small-button, .match-nav button {
  border:1px solid var(--line);
  background:#fff;
  border-radius:6px;
  padding:7px 11px;
  cursor:pointer;
}
.small-button:hover, .match-nav button:hover:not(:disabled) { background:#f8fafc; }
.hint { font-size:.92rem; color:var(--muted); }
.team-focus-banner {
  display:none;
  color:#6b4c00;
  background:#fff7d6;
  border:1px solid #e3c04d;
  border-radius:999px;
  padding:6px 10px;
  font-size:13px;
}
.team-focus-banner.show { display:inline-block; }
.panel {
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:8px;
  overflow:hidden;
}
.table-wrap { overflow-x:auto; }
table { border-collapse:collapse; width:100%; }
#crossTable { min-width:760px; }
th, td { border:1px solid var(--line); padding:7px; text-align:center; }
thead th { background:var(--head); font-weight:700; }
.team-name { text-align:left; white-space:nowrap; }
.team-button {
  border:0;
  background:transparent;
  width:100%;
  text-align:left;
  padding:2px;
  color:inherit;
  font:inherit;
  font-weight:700;
  cursor:pointer;
}
.team-button:hover { text-decoration:underline; }
.cross-score {
  border:0;
  background:transparent;
  color:#0645ad;
  cursor:pointer;
  width:100%;
  min-width:64px;
  padding:4px;
  border-radius:5px;
}
.cross-score .date {
  display:block;
  color:var(--muted);
  font-size:.76rem;
  margin-bottom:2px;
}
.cross-score .score { font-size:1rem; font-weight:700; }
.cross-score:hover { background:#edf4ff; }
.diagonal { font-size:1.2rem; background:#fafafa; color:#64748b; }
.guide-cell { background:var(--rowcol); }
.cross-score.is-selected {
  background:var(--focus);
  outline:3px solid var(--accent);
  outline-offset:-3px;
  color:#7a3d00;
}
.cross-score.is-selected .date { color:#7a3d00; }
.selected-team-label { background:#fff7d6 !important; }

.content-grid {
  display:grid;
  grid-template-columns:minmax(330px,.85fr) minmax(560px,1.5fr);
  gap:16px;
  margin-top:16px;
  align-items:start;
}
.panel > h2, .match-panel-heading {
  margin:0;
  padding:12px 14px;
  background:var(--head);
  border-bottom:1px solid var(--line);
}
.panel > h2 { font-size:1.1rem; }
.match-panel-heading {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.match-panel-heading h2 { margin:0; font-size:1.1rem; }
.match-nav { display:flex; align-items:center; gap:8px; }
.match-nav button { padding:5px 9px; }
.match-nav button:disabled { opacity:.35; cursor:default; }

.fixture-list { display:grid; }
.fixture-row {
  display:grid;
  grid-template-columns:65px 1fr;
  border:0;
  border-bottom:1px solid #e4e7ec;
  background:#fff;
  text-align:left;
  padding:9px 10px;
  cursor:pointer;
  color:inherit;
}
.fixture-row:hover { background:#f8fafc; }
.fixture-row.is-selected {
  background:var(--focus);
  box-shadow:inset 4px 0 var(--accent);
}
.fixture-row.is-faded { opacity:.18; }
.fixture-row.is-team-match { opacity:1; }
.fixture-date { color:var(--muted); font-size:.85rem; padding-top:2px; }
.fixture-teams {
  display:grid;
  grid-template-columns:1fr auto 1fr;
  gap:8px;
  align-items:center;
}
.fixture-teams strong:last-child { text-align:right; }

.match-card { padding:14px; }
.match-title {
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:flex-start;
  flex-wrap:wrap;
  margin-bottom:12px;
}
.match-title h3 { margin:0; font-size:1.25rem; }
.match-meta { color:var(--muted); font-size:.9rem; margin-top:2px; }
.score-badge {
  font-size:1.25rem;
  font-weight:700;
  background:var(--accent-soft);
  padding:6px 10px;
  border-radius:6px;
}
.card-table { width:100%; min-width:760px; border-collapse:collapse; }
.card-scroll { overflow-x:auto; }
.card-table th, .card-table td { padding:7px; border:1px solid var(--line); }
.card-table th { background:var(--head); }
.card-table td.name { text-align:left; }
.card-table td.rating, .card-table td.ecf { font-size:.86rem; color:#475467; }
.card-table td.result { font-weight:700; white-space:nowrap; }
.colour-dot {
  display:inline-block;
  width:13px;
  height:13px;
  border-radius:50%;
  border:1px solid #222;
  vertical-align:-2px;
}
.colour-dot.W { background:#fff; }
.colour-dot.B { background:#222; }
.card-note { margin:10px 0 0; color:var(--muted); font-size:.88rem; }
.status { padding:18px; color:var(--muted); }

@media(max-width:980px) {
  .content-grid { grid-template-columns:1fr; }
}
@media(max-width:600px) {
  main { padding:10px; }
  h1 { font-size:1.35rem; }
  .fixture-teams { font-size:.9rem; }
}


/* v2.0 knockout bracket */
.cup-overview{overflow-x:auto;padding:18px;background:#fafbfc}.cup-bracket{display:grid;grid-template-columns:repeat(var(--round-count,4),minmax(220px,1fr));gap:34px;align-items:stretch;min-width:900px}.cup-round{display:flex;flex-direction:column;min-width:220px}.cup-round h3{margin:0 0 12px;padding:9px 12px;text-align:center;border-radius:7px;background:var(--head);border:1px solid var(--line);font-size:1rem}.cup-round-ties{flex:1;display:flex;flex-direction:column;justify-content:space-around;gap:18px}.cup-tie{position:relative;display:block;width:100%;border:1px solid #aeb7c4;border-radius:8px;background:#fff;padding:0;color:inherit;text-align:left;overflow:hidden}.cup-tie[data-fixture-id]{cursor:pointer;font:inherit}.cup-tie[data-fixture-id]:hover{border-color:#718096;box-shadow:0 3px 12px rgba(23,32,51,.12)}.cup-team{display:grid;grid-template-columns:1fr auto;gap:8px;padding:9px 10px;align-items:center}.cup-team+.cup-team{border-top:1px solid #d9dee6}.cup-team strong{min-width:28px;text-align:right}.cup-team-winner{font-weight:700;background:#f7fafc}.cup-date{display:block;border-top:1px solid #e4e7ec;padding:5px 10px;color:var(--muted);font-size:.78rem;text-align:center}.cup-bye{min-height:78px;display:grid;align-content:center}.cup-bye-label{padding:7px 10px;color:var(--muted);font-style:italic;text-align:center;border-top:1px solid #e4e7ec}.cup-missing{min-height:65px;display:grid;align-content:center;border-style:dashed}.cup-tie.is-selected{background:var(--focus);border-color:var(--accent);box-shadow:0 0 0 3px var(--accent)}.cup-tie.is-faded{opacity:.18}.cup-tie.is-team-match{opacity:1}.cup-champion{align-self:center;background:#fff7d6;border:2px solid #d6a800;border-radius:10px;padding:18px 14px;text-align:center;box-shadow:0 4px 14px rgba(23,32,51,.10)}.cup-champion span{display:block;color:#7a5a00;font-size:.82rem;text-transform:uppercase;letter-spacing:.08em;margin-bottom:5px}.cup-champion strong{font-size:1.15rem}