:root { color-scheme: light; --surface-0:#f4f3f0; --surface-1:#fcfcfb; --text-primary:#0b0b0b; --text-secondary:#52514e; --text-muted:#6b6a64;
  --rule:#e3e2dd; --grid:#ebeae6; --ref:#a9a8a2; --series-1:#2a78d6; --hl:#0b0b0b; --row-hover:#f0efeb; }
@media (prefers-color-scheme: dark) { :root:where(:not([data-theme="light"])) { color-scheme: dark; --surface-0:#121211; --surface-1:#1a1a19; --text-primary:#f0efec;
  --text-secondary:#c3c2b7; --text-muted:#9a998f; --rule:#33322f; --grid:#2a2a28; --ref:#6d6c66; --series-1:#3987e5; --hl:#f0efec; --row-hover:#242422; } }
:root[data-theme="dark"] { color-scheme: dark; --surface-0:#121211; --surface-1:#1a1a19; --text-primary:#f0efec; --text-secondary:#c3c2b7; --text-muted:#9a998f;
  --rule:#33322f; --grid:#2a2a28; --ref:#6d6c66; --series-1:#3987e5; --hl:#f0efec; --row-hover:#242422; }
* { box-sizing: border-box; }
body { margin: 0; background: var(--surface-0); color: var(--text-primary); font: 15px/1.45 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
main { max-width: 1180px; margin: 0 auto; padding: 14px 16px 48px; }
nav { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 14px; margin: 0 0 14px; padding-bottom: 8px; border-bottom: 1px solid var(--rule); }
nav a:first-child { font-weight: 700; color: var(--text-primary); }
nav a { color: var(--text-secondary); text-decoration: none; padding: 2px 0; }
nav a.here { color: var(--text-primary); font-weight: 600; border-bottom: 2px solid var(--series-1); }
h1 { font-size: 24px; margin: 0 0 4px; letter-spacing: -0.01em; }
.sub { color: var(--text-secondary); margin: 0 0 16px; max-width: 780px; }
.controls { display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center; margin: 0 0 14px; }
.controls label { color: var(--text-secondary); font-size: 14px; display: flex; gap: 6px; align-items: center; }
select { font: inherit; color: var(--text-primary); background: var(--surface-1); border: 1px solid var(--rule); border-radius: 6px; padding: 4px 8px; }
.card { background: var(--surface-1); border: 1px solid var(--rule); border-radius: 10px; padding: 14px 14px 10px; margin: 0 0 16px; }
.card h2 { font-size: 15px; margin: 0 0 2px; }
.card .note { color: var(--text-muted); font-size: 13px; margin: 0 0 6px; }
.chart { width: 100%; height: auto; display: block; touch-action: manipulation; }
.chart text { font: 12px system-ui, sans-serif; fill: var(--text-secondary); }
.chart .lbl { fill: var(--text-primary); }
#tip { position: fixed; pointer-events: none; background: var(--surface-1); color: var(--text-primary); border: 1px solid var(--rule); border-radius: 8px;
  padding: 8px 10px; font-size: 13px; box-shadow: 0 4px 14px rgba(0,0,0,.15); display: none; z-index: 10; max-width: 270px; }
#tip b { display: block; margin-bottom: 2px; } #tip .k { color: var(--text-secondary); }
.tablewrap { overflow-x: auto; -webkit-overflow-scrolling: touch; } .tablewrap:focus-visible { outline: 2px solid var(--series-1); outline-offset: 2px; }
table { border-collapse: collapse; width: 100%; font-variant-numeric: tabular-nums; font-size: 14px; }
th, td { padding: 6px 8px; text-align: right; white-space: nowrap; border-bottom: 1px solid var(--grid); }
th { position: sticky; top: 0; background: var(--surface-1); color: var(--text-secondary); font-weight: 600; font-size: 12.5px; cursor: pointer; user-select: none; vertical-align: bottom; }
th.sorted { color: var(--text-primary); }
th.sorted::after { content: " \2193"; } th.sorted.asc::after { content: " \2191"; }
.name { text-align: left; position: sticky; left: 0; background: var(--surface-1); } td.name { font-weight: 600; } td a { color: inherit; text-decoration: underline; text-decoration-color: var(--rule); text-underline-offset: 3px; } td a:hover { text-decoration-color: currentColor; }
.txt { text-align: left; } td.txt { color: var(--text-secondary); }
tbody tr:hover td { background: var(--row-hover); }
td .se { color: var(--text-muted); font-size: 12px; margin-left: 3px; }
.muted { color: var(--text-muted); }
details { margin-top: 8px; color: var(--text-secondary); font-size: 14px; }
details summary { cursor: pointer; color: var(--text-primary); }
details li { margin: 3px 0; }
footer { color: var(--text-muted); font-size: 12.5px; margin-top: 18px; }
.tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; }
.tiles a { display: block; background: var(--surface-1); border: 1px solid var(--rule); border-radius: 10px; padding: 14px; color: var(--text-primary); text-decoration: none; }
.tiles a span { display: block; color: var(--text-secondary); font-size: 14px; margin-top: 4px; }

@font-face { font-family: "Barlow Condensed"; src: url("fonts/barlow-condensed-latin-600-normal.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Barlow Condensed"; src: url("fonts/barlow-condensed-latin-700-normal.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }
:root { color-scheme: light; --surface-0:#f5f6f8; --surface-1:#ffffff; --text-primary:#0e1726; --text-secondary:#4a5466; --text-muted:#5c6576;
  --rule:#dfe4eb; --grid:#e9edf2; --ref:#a3abb8; --series-1:#2a78d6; --hl:#0e1726; --row-hover:#f0f3f7;
  --navy:#0f2a44; --navy-2:#173a5e; --navy-ink:#dfe7f2; --accent:#c8412c; --accent-ink:#b8392a; --accent-on-navy:#ff7b61; --dot-edge:#ffffff; --shadow:0 1px 2px rgba(14,23,38,.06), 0 4px 14px rgba(14,23,38,.05); }
@media (prefers-color-scheme: dark) { :root:where(:not([data-theme="light"])) { color-scheme: dark; --surface-0:#0b1220; --surface-1:#111a2b; --text-primary:#e8edf5;
  --text-secondary:#b5c0d0; --text-muted:#8e9aad; --rule:#23304a; --grid:#1c2740; --ref:#5b6b85; --series-1:#3987e5; --hl:#e8edf5; --row-hover:#16223a;
  --navy:#0a1730; --navy-2:#13254a; --accent-ink:#ff8a70; --dot-edge:#a9b4c4; --shadow:none; } }
:root[data-theme="dark"] { color-scheme: dark; --surface-0:#0b1220; --surface-1:#111a2b; --text-primary:#e8edf5; --text-secondary:#b5c0d0; --text-muted:#8e9aad;
  --rule:#23304a; --grid:#1c2740; --ref:#5b6b85; --series-1:#3987e5; --hl:#e8edf5; --row-hover:#16223a; --navy:#0a1730; --navy-2:#13254a; --accent-ink:#ff8a70; --dot-edge:#a9b4c4; --shadow:none; }
h1, h2, .wm, .hero h1, .fbrand b { font-family: "Barlow Condensed", "Arial Narrow", system-ui, sans-serif; }
h1 { font-size: 34px; font-weight: 700; letter-spacing: .01em; margin: 6px 0 4px; }
.card h2, h2 { font-size: 19px; font-weight: 600; letter-spacing: .02em; }
.card { border-radius: 12px; box-shadow: var(--shadow); }
main { padding-top: 22px; }
a { color: var(--accent-ink); }
/* header */
header.site { background: var(--navy); color: #fff; position: sticky; top: 0; z-index: 30; box-shadow: 0 1px 0 rgba(255,255,255,.06); }
header.site .bar { max-width: 1180px; margin: 0 auto; padding: 8px 16px; display: flex; align-items: center; gap: 18px; min-height: 58px; }
a.brand { display: inline-flex; align-items: center; gap: 10px; color: #fff; text-decoration: none; flex: none; }
a.brand .logo { display: block; border-radius: 9px; }
.wm { font-size: 24px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; line-height: 1; white-space: nowrap; }
.wm b { color: var(--accent-on-navy); font-weight: 700; }
nav.sitenav { display: flex; align-items: center; gap: 4px; margin: 0 0 0 auto; padding: 0; border: 0; font-size: 15px; flex-wrap: nowrap; }
nav.sitenav a, nav.sitenav .dd-btn { color: var(--navy-ink); text-decoration: none; font: inherit; font-weight: 500; background: none; border: 0; padding: 8px 10px; border-radius: 8px; cursor: pointer; }
nav.sitenav a:hover, nav.sitenav .dd-btn:hover, nav.sitenav .grp.open > .dd-btn { background: var(--navy-2); color: #fff; }
nav.sitenav a.here, nav.sitenav .dd-btn.here { color: #fff; box-shadow: inset 0 -3px 0 var(--accent-on-navy); border-radius: 8px 8px 0 0; }
nav.sitenav a:first-child { font-weight: 500; }
.grp { position: relative; }
.dd-btn::after { content: ""; display: inline-block; margin-left: 6px; border: 4px solid transparent; border-top-color: currentColor; transform: translateY(2px); }
.dd { display: none; position: absolute; top: calc(100% + 6px); left: 0; min-width: 210px; background: var(--surface-1); border: 1px solid var(--rule); border-radius: 10px;
  box-shadow: 0 10px 30px rgba(0,0,0,.18); padding: 6px; }
.grp.open .dd { display: block; }
nav.sitenav .dd a { display: block; color: var(--text-primary); padding: 8px 10px; }
nav.sitenav .dd a:hover { background: var(--row-hover); color: var(--text-primary); }
nav.sitenav .dd a.here { box-shadow: inset 3px 0 0 var(--accent); border-radius: 6px; }
.menu-btn { display: none; margin-left: auto; background: none; border: 1px solid rgba(255,255,255,.35); color: #fff; border-radius: 8px; padding: 6px 10px; font: inherit; cursor: pointer; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media (max-width: 860px) {
  .menu-btn { display: inline-flex; align-items: center; gap: 6px; }
  .wm { font-size: 21px; }
  nav.sitenav { display: none; position: absolute; left: 0; right: 0; top: 100%; background: var(--navy); flex-direction: column; align-items: stretch; gap: 0;
    padding: 6px 12px 14px; box-shadow: 0 12px 24px rgba(0,0,0,.25); }
  header.site.open nav.sitenav { display: flex; }
  nav.sitenav > a, nav.sitenav .dd-btn { padding: 12px 10px; font-size: 17px; text-align: left; width: 100%; }
  nav.sitenav .dd-btn::after { display: none; }
  nav.sitenav .dd-btn { color: #b9c7da; font-size: 13px; text-transform: uppercase; letter-spacing: .08em; padding: 14px 10px 4px; cursor: default; }
  nav.sitenav .dd { display: block; position: static; background: none; border: 0; box-shadow: none; padding: 0 0 0 8px; min-width: 0; }
  nav.sitenav .dd a { color: var(--navy-ink); font-size: 17px; padding: 10px; }
  nav.sitenav .dd a:hover { background: var(--navy-2); color: #fff; }
  nav.sitenav a.here { box-shadow: inset 3px 0 0 var(--accent-on-navy); border-radius: 0; }
}
/* footer */
footer.site { background: var(--navy); color: var(--navy-ink); margin-top: 36px; font-size: 14px; }
footer.site .fin { max-width: 1180px; margin: 0 auto; padding: 28px 16px 30px; display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 24px; }
footer.site a { color: #fff; text-decoration: none; } footer.site a:hover { text-decoration: underline; }
footer.site h2.fh { font-family: inherit; font-size: 12px; text-transform: uppercase; letter-spacing: .1em; color: #b9c7da; margin: 0 0 8px; font-weight: 600; }
footer.site ul { list-style: none; padding: 0; margin: 0; columns: 2; } footer.site li { margin: 0 0 6px; }
.fbrand { display: flex; gap: 12px; align-items: flex-start; } .fbrand b { display: block; font-size: 22px; letter-spacing: .05em; text-transform: uppercase; color: #fff; }
.fbrand p { margin: 4px 0 0; color: #c7d3e3; max-width: 360px; }
footer.site .fine { color: #b9c7da; font-size: 13px; margin: 0 0 6px; }
@media (max-width: 760px) { footer.site .fin { grid-template-columns: 1fr; gap: 18px; } }
/* hero (landing page) */
.hero { background: var(--navy); color: #fff; position: relative; overflow: hidden; }
.hero::before { content: ""; position: absolute; inset: 0; opacity: .09; pointer-events: none;
  background: repeating-linear-gradient(90deg, #fff 0 2px, transparent 2px 96px); }
.hero::after { content: ""; position: absolute; top: 0; bottom: 0; right: 0; width: 18%; background: linear-gradient(90deg, rgba(217,88,63,0), rgba(217,88,63,.28)); pointer-events: none; }
.hero .in { position: relative; z-index: 1; max-width: 1180px; margin: 0 auto; padding: 46px 16px 44px; display: grid; grid-template-columns: auto 1fr; gap: 28px; align-items: center; }
.hero h1 { font-size: clamp(44px, 8vw, 84px); line-height: .92; text-transform: uppercase; letter-spacing: .03em; margin: 0; color: #fff; }
.hero h1 b { color: var(--accent-on-navy); }
.hero .tag { font-size: clamp(16px, 2.2vw, 20px); color: #dfe7f2; margin: 12px 0 20px; max-width: 640px; }
.hero .logo { width: clamp(84px, 14vw, 150px); height: auto; border-radius: 22px; box-shadow: 0 10px 30px rgba(0,0,0,.35); }
.btns { display: flex; flex-wrap: wrap; gap: 10px; }
.btn { display: inline-block; padding: 11px 18px; border-radius: 9px; font-weight: 700; text-decoration: none; font-size: 15px; }
.btn.pri { background: var(--accent); color: #fff; } .btn.pri:hover { filter: brightness(1.08); }
.btn.sec { color: #fff; box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.55); } .btn.sec:hover { background: rgba(255,255,255,.08); }
@media (max-width: 640px) { .hero .in { grid-template-columns: 1fr; gap: 16px; padding: 30px 16px 32px; } }
/* team colour chips and badges */
.chart .bt { font-family: "Barlow Condensed", "Arial Narrow", system-ui, sans-serif; font-weight: 700; font-size: 11.5px; letter-spacing: .02em; pointer-events: none; }
@media (max-width: 600px) { .chart .bt { font-size: 8.5px; letter-spacing: 0; } }
.chart .halo { pointer-events: none; }
#tbar { height: 8px; max-width: 360px; border-radius: 4px; margin: 6px 0 12px; background: var(--rule); }
.chart text.bt.k { fill: #000; } .chart text.bt.w { fill: #fff; }
.tchip { display: inline-block; width: 11px; height: 11px; border-radius: 3px; margin-right: 6px; vertical-align: -1px; box-shadow: inset 0 0 0 2px var(--tc2, transparent); background: var(--tc1, var(--text-muted)); }

.ent .crumbs { font-size: 14px; color: var(--text-secondary); margin: 0 0 4px; }
.ent .bio { color: var(--text-secondary); margin: 0 0 14px; max-width: 860px; }
.ent .bio b { color: var(--text-primary); font-weight: 600; }
.ent tr.tot td { font-weight: 600; border-top: 2px solid var(--rule); }
.ent tr.po td { color: var(--text-secondary); }
.ent th { cursor: default; }
.ent td .se { color: var(--text-muted); font-size: 12px; margin-left: 4px; }
.ent details.log { margin: 0 0 16px; }
.ent details.log > summary { font-weight: 600; margin: 4px 0 8px; }
.ent .chart.arc { max-width: 720px; }
.ent .chart text { font: 12px system-ui, sans-serif; fill: var(--text-secondary); }
.ent .facts { display: flex; flex-wrap: wrap; gap: 8px 22px; margin: 0 0 14px; }
.ent .facts div { min-width: 120px; } .ent .facts b { display: block; font-size: 20px; } .ent .facts span { color: var(--text-secondary); font-size: 13px; }
.ent .dir input { font: inherit; padding: 6px 10px; border: 1px solid var(--rule); border-radius: 8px; background: var(--surface-1); color: var(--text-primary); min-width: 240px; }