*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
–bpw-blue: #1114c5;
–bpw-green: #0aac38;
–bpw-red: #f60e0e;
–bpw-dark: #0d0f1a;
–bpw-mid: #1a1d2e;
–bpw-card: #1e2235;
–bpw-border: rgba(255,255,255,0.08);
–bpw-text: #e8eaf0;
–bpw-muted: #8890aa;
–bpw-accent: #4a90e2;
–gold: #f5c842;
}

body {
font-family: ‘Barlow’, sans-serif;
background: var(–bpw-dark);
color: var(–bpw-text);
line-height: 1.6;
font-size: 16px;
}

/* ── HERO ── */
.hero {
position: relative;
background: var(–bpw-mid);
border-bottom: 3px solid var(–bpw-blue);
padding: 3rem 2rem 2.5rem;
text-align: center;
overflow: hidden;
}
.hero::before {
content: ”;
position: absolute;
inset: 0;
background: repeating-linear-gradient(
-45deg,
transparent,
transparent 18px,
rgba(17,20,197,0.04) 18px,
rgba(17,20,197,0.04) 36px
);
}
.hero-badge {
display: inline-block;
background: var(–bpw-blue);
color: #fff;
font-family: ‘Barlow Condensed’, sans-serif;
font-weight: 700;
font-size: 12px;
letter-spacing: 2px;
text-transform: uppercase;
padding: 4px 14px;
border-radius: 3px;
margin-bottom: 1rem;
}
.hero h1 {
font-family: ‘Barlow Condensed’, sans-serif;
font-weight: 900;
font-size: clamp(2.4rem, 6vw, 4.2rem);
line-height: 1.0;
color: #fff;
text-transform: uppercase;
letter-spacing: -1px;
margin-bottom: 0.4rem;
}
.hero h1 span { color: var(–bpw-blue); }
.hero-sub {
font-family: ‘Barlow Condensed’, sans-serif;
font-size: 1.25rem;
font-weight: 600;
color: var(–bpw-muted);
letter-spacing: 1px;
text-transform: uppercase;
margin-bottom: 0.5rem;
}
.hero-season {
font-size: 0.9rem;
color: var(–bpw-muted);
}

/* ── WRAPPER ── */
.wrapper {
max-width: 900px;
margin: 0 auto;
padding: 0 1.25rem;
}

/* ── SECTION TITLES ── */
.section-title {
font-family: ‘Barlow Condensed’, sans-serif;
font-weight: 800;
font-size: 1.5rem;
text-transform: uppercase;
letter-spacing: 1px;
color: #fff;
padding: 2.5rem 0 1rem;
border-bottom: 2px solid var(–bpw-blue);
margin-bottom: 1.5rem;
}
.section-title span {
color: var(–bpw-blue);
}

/* ── STAT GRID ── */
.stat-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
gap: 12px;
margin-bottom: 2rem;
}
.stat-card {
background: var(–bpw-card);
border: 1px solid var(–bpw-border);
border-radius: 8px;
padding: 1rem 1rem 0.8rem;
text-align: center;
}
.stat-card .val {
font-family: ‘Barlow Condensed’, sans-serif;
font-size: 2.4rem;
font-weight: 900;
line-height: 1;
color: #fff;
margin-bottom: 4px;
}
.stat-card .val.blue { color: var(–bpw-accent); }
.stat-card .val.green { color: var(–bpw-green); }
.stat-card .val.red { color: #f06060; }
.stat-card .val.gold { color: var(–gold); }
.stat-card .lbl {
font-size: 11px;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 1px;
color: var(–bpw-muted);
}

/* ── FORM STRIP ── */
.form-strip {
background: var(–bpw-card);
border: 1px solid var(–bpw-border);
border-radius: 8px;
padding: 1rem 1.25rem;
margin-bottom: 2rem;
}
.form-strip-label {
font-size: 11px;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 1px;
color: var(–bpw-muted);
margin-bottom: 0.6rem;
}
.form-dots {
display: flex;
flex-wrap: wrap;
gap: 5px;
}
.form-dot {
width: 28px;
height: 28px;
border-radius: 4px;
font-family: ‘Barlow Condensed’, sans-serif;
font-size: 12px;
font-weight: 700;
display: flex;
align-items: center;
justify-content: center;
color: #fff;
}
.form-dot.w { background: var(–bpw-green); }
.form-dot.l { background: #c0392b; }
.form-dot.d { background: #666; }

/* ── CHART WRAPPER ── */
.chart-wrap {
background: var(–bpw-card);
border: 1px solid var(–bpw-border);
border-radius: 8px;
padding: 1.25rem;
margin-bottom: 2rem;
}
.chart-title {
font-family: ‘Barlow Condensed’, sans-serif;
font-weight: 700;
font-size: 1rem;
text-transform: uppercase;
letter-spacing: 1px;
color: var(–bpw-muted);
margin-bottom: 1rem;
}

/* ── SCORER LEGEND ── */
.scorer-legend {
display: flex;
flex-wrap: wrap;
gap: 8px 14px;
margin-bottom: 1rem;
font-size: 12px;
}
.scorer-legend-item {
display: flex;
align-items: center;
gap: 5px;
color: var(–bpw-muted);
}
.legend-swatch {
width: 10px;
height: 10px;
border-radius: 2px;
flex-shrink: 0;
}

/* ── GOLDEN BOOT TABLE ── */
.scorers-table {
width: 100%;
border-collapse: collapse;
font-size: 15px;
margin-bottom: 2rem;
}
.scorers-table thead th {
font-family: ‘Barlow Condensed’, sans-serif;
font-weight: 700;
font-size: 11px;
text-transform: uppercase;
letter-spacing: 1px;
color: var(–bpw-muted);
padding: 0.5rem 0.75rem;
border-bottom: 1px solid var(–bpw-border);
text-align: left;
}
.scorers-table tbody tr {
border-bottom: 1px solid var(–bpw-border);
transition: background 0.15s;
}
.scorers-table tbody tr:hover { background: rgba(255,255,255,0.04); }
.scorers-table tbody td {
padding: 0.65rem 0.75rem;
vertical-align: middle;
}
.rank-badge {
font-family: ‘Barlow Condensed’, sans-serif;
font-weight: 800;
font-size: 1rem;
width: 28px;
text-align: center;
color: var(–bpw-muted);
}
.rank-badge.top1 { color: #f5c842; }
.rank-badge.top2 { color: #b0b8c8; }
.rank-badge.top3 { color: #cd7f32; }
.player-name {
font-weight: 600;
color: #fff;
}
.goals-bar-wrap {
display: flex;
align-items: center;
gap: 10px;
}
.goals-bar-bg {
flex: 1;
height: 6px;
background: rgba(255,255,255,0.08);
border-radius: 3px;
overflow: hidden;
}
.goals-bar-fill {
height: 100%;
border-radius: 3px;
background: var(–bpw-blue);
}
.goals-val {
font-family: ‘Barlow Condensed’, sans-serif;
font-weight: 800;
font-size: 1.1rem;
color: #fff;
min-width: 20px;
text-align: right;
}

/* ── MATCH RESULTS ── */
.match-grid {
display: grid;
grid-template-columns: 1fr;
gap: 10px;
margin-bottom: 2rem;
}
.match-card {
background: var(–bpw-card);
border: 1px solid var(–bpw-border);
border-radius: 8px;
padding: 0.85rem 1rem;
display: grid;
grid-template-columns: auto 1fr auto;
align-items: center;
gap: 1rem;
}
.match-card.win { border-left: 3px solid var(–bpw-green); }
.match-card.loss { border-left: 3px solid #c0392b; }
.match-card.draw { border-left: 3px solid #888; }
.match-card.forfeit { border-left: 3px solid var(–bpw-green); }
.match-date {
font-family: ‘Barlow Condensed’, sans-serif;
font-weight: 700;
font-size: 0.8rem;
text-transform: uppercase;
letter-spacing: 0.5px;
color: var(–bpw-muted);
min-width: 80px;
line-height: 1.3;
}
.match-date .comp-tag {
display: inline-block;
font-size: 9px;
letter-spacing: 1px;
padding: 1px 5px;
border-radius: 2px;
margin-top: 3px;
background: rgba(255,255,255,0.08);
color: var(–bpw-muted);
}
.match-detail .opponent {
font-weight: 600;
color: #fff;
font-size: 0.95rem;
}
.match-detail .scorers {
font-size: 0.8rem;
color: var(–bpw-muted);
margin-top: 2px;
}
.match-result {
text-align: right;
}
.score-badge {
font-family: ‘Barlow Condensed’, sans-serif;
font-weight: 900;
font-size: 1.2rem;
color: #fff;
white-space: nowrap;
}
.result-pill {
display: inline-block;
font-family: ‘Barlow Condensed’, sans-serif;
font-size: 11px;
font-weight: 700;
letter-spacing: 1px;
padding: 2px 7px;
border-radius: 3px;
margin-top: 3px;
}
.result-pill.win { background: rgba(10,172,56,0.2); color: #4ecf72; }
.result-pill.loss { background: rgba(192,57,43,0.2); color: #e07070; }
.result-pill.draw { background: rgba(136,136,136,0.2); color: #aaa; }

/* ── PLAYER PROFILES ── */
.profiles-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
gap: 14px;
margin-bottom: 2rem;
}
.profile-card {
background: var(–bpw-card);
border: 1px solid var(–bpw-border);
border-radius: 8px;
padding: 1rem 1.1rem;
}
.profile-header {
display: flex;
align-items: center;
gap: 10px;
margin-bottom: 0.6rem;
}
.profile-avatar {
width: 40px;
height: 40px;
border-radius: 50%;
background: var(–bpw-blue);
display: flex;
align-items: center;
justify-content: center;
font-family: ‘Barlow Condensed’, sans-serif;
font-weight: 800;
font-size: 14px;
color: #fff;
flex-shrink: 0;
}
.profile-name {
font-family: ‘Barlow Condensed’, sans-serif;
font-weight: 800;
font-size: 1.1rem;
color: #fff;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.profile-goals {
font-size: 12px;
color: var(–gold);
font-weight: 600;
}
.profile-bio {
font-size: 0.85rem;
color: var(–bpw-muted);
line-height: 1.55;
}

/* ── COACHING STAFF ── */
.staff-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
gap: 12px;
margin-bottom: 2rem;
}
.staff-card {
background: var(–bpw-card);
border: 1px solid var(–bpw-border);
border-radius: 8px;
padding: 1rem;
text-align: center;
}
.staff-avatar {
width: 52px;
height: 52px;
border-radius: 50%;
background: rgba(17,20,197,0.3);
border: 2px solid var(–bpw-blue);
margin: 0 auto 0.6rem;
display: flex;
align-items: center;
justify-content: center;
font-family: ‘Barlow Condensed’, sans-serif;
font-weight: 800;
font-size: 16px;
color: var(–bpw-accent);
}
.staff-name {
font-family: ‘Barlow Condensed’, sans-serif;
font-weight: 800;
font-size: 1.05rem;
color: #fff;
text-transform: uppercase;
}
.staff-role {
font-size: 11px;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 1px;
color: var(–bpw-muted);
margin-top: 2px;
}

/* ── LEAGUE TABLE ── */
.league-table-wrap {
background: var(–bpw-card);
border: 1px solid var(–bpw-border);
border-radius: 8px;
overflow: hidden;
margin-bottom: 2rem;
}
.league-table {
width: 100%;
border-collapse: collapse;
font-size: 14px;
}
.league-table thead th {
font-family: ‘Barlow Condensed’, sans-serif;
font-weight: 700;
font-size: 11px;
text-transform: uppercase;
letter-spacing: 1px;
color: var(–bpw-muted);
padding: 0.6rem 0.75rem;
border-bottom: 1px solid var(–bpw-border);
text-align: left;
}
.league-table thead th:not(:nth-child(2)) { text-align: center; }
.league-table tbody tr {
border-bottom: 1px solid var(–bpw-border);
transition: background 0.15s;
}
.league-table tbody tr:last-child { border-bottom: none; }
.league-table tbody tr:hover { background: rgba(255,255,255,0.03); }
.league-table tbody td {
padding: 0.6rem 0.75rem;
color: var(–bpw-muted);
text-align: center;
}
.league-table tbody td:nth-child(2) { text-align: left; color: var(–bpw-text); }
.pos-num {
font-family: ‘Barlow Condensed’, sans-serif;
font-weight: 700;
font-size: 1rem;
color: var(–bpw-muted);
}
.pts {
font-family: ‘Barlow Condensed’, sans-serif;
font-weight: 800;
font-size: 1rem;
color: #fff;
}
.bpw-row { background: rgba(17,20,197,0.12) !important; }
.bpw-row td { color: var(–bpw-text) !important; }
.bpw-pos { color: #f5c842 !important; }
.bpw-pts { color: #f5c842 !important; }

/* ── FOOTER ── */
.footer {
text-align: center;
padding: 2rem 1rem;
border-top: 1px solid var(–bpw-border);
color: var(–bpw-muted);
font-size: 13px;
margin-top: 2rem;
}
.bpw-season {
font-family: ‘Barlow’, sans-serif;
color: #e8eaf0;
line-height: 1.6;
font-size: 16px;
background: #0d0f1a;
}
.bpw-season .bpw-hero,
.bpw-season .bpw-footer {
margin-left: calc(-50vw + 50%);
margin-right: calc(-50vw + 50%);
padding-left: max(1.25rem, calc(50vw – 450px));
padding-right: max(1.25rem, calc(50vw – 450px));
}

https://cdnjs.cloudflare.com/ajax/libs/Chart.js/4.4.1/chart.umd.js

document.addEventListener(‘DOMContentLoaded’, function() {
/* ── DATA ── */
const matches = [
{ date:’7 Sep 2025′, comp:’League’, opp:’AFC R&D Scorpions’, h:’H’, score:’2-0′, result:’W’, scorers:{Mika:1, Skeggs:1} },
{ date:’14 Sep 2025′, comp:’County Cup’, opp:’Wittering Harriers U16′, h:’H’, score:’4-0′, result:’W’, scorers:{Llewnard:1, Archie:1, Mika:1, Harley:1} },
{ date:’21 Sep 2025′, comp:’League’, opp:’Old Grammarians Eagles’, h:’A’, score:’2-1′, result:’L’, scorers:{Mani:1} },
{ date:’28 Sep 2025′, comp:’League Cup’, opp:’Stanwick Rovers’, h:’A’, score:’6-2′, result:’W’, scorers:{Mani:2, Harley:1, Toby:1, ‘Alex B’:1, Daren:1} },
{ date:’5 Oct 2025′, comp:’League’, opp:’Higham Town Lancaster’, h:’A’, score:’3-2′, result:’W’, scorers:{Mika:2, Colsey:1} },
{ date:’19 Oct 2025′, comp:’County Cup’, opp:’Wellingborough Whitworth’, h:’A’, score:’0-10′, result:’L’, scorers:{} },
{ date:’26 Oct 2025′, comp:’League Cup’, opp:’Corby Kingswood Stripes’, h:’H’, score:’1-2′, result:’L’, scorers:{Mani:1} },
{ date:’2 Nov 2025′, comp:’League’, opp:’Orchard Park Kestrels’, h:’A’, score:’0-1′, result:’L’, scorers:{} },
{ date:’30 Nov 2025′, comp:’League’, opp:’AFC R&D Scorpions’, h:’A’, score:’2-1′, result:’W’, scorers:{Harley:1, Nish:1} },
{ date:’14 Dec 2025′, comp:’League’, opp:’Corby Kingswood Stripes’, h:’H’, score:’2-1′, result:’W’, scorers:{Llewnard:1, Daren:1} },
{ date:’21 Dec 2025′, comp:’League’, opp:’FC Aztec Phoenix’, h:’A’, score:’4-5′, result:’L’, scorers:{Toby:3, Harley:1} },
{ date:’4 Jan 2026′, comp:’League’, opp:’Higham Town Lancaster’, h:’H’, score:’4-0′, result:’W’, scorers:{Mani:2, Daren:1, Mika:1} },
{ date:’11 Jan 2026′, comp:’League’, opp:’Isle Lodge All Stars’, h:’A’, score:’2-4′, result:’L’, scorers:{Mika:1, Daren:1} },
{ date:’18 Jan 2026′, comp:’League’, opp:’NN29 Titans’, h:’H’, score:’8-1′, result:’W’, scorers:{Daren:5, ‘Alex B’:1, Colsey:1, Toby:1} },
{ date:’8 Mar 2026′, comp:’League’, opp:’Ise Lodge All Stars’, h:’H’, score:’0-1′, result:’L’, scorers:{} },
{ date:’15 Mar 2026′, comp:’League’, opp:’NN29 Titans (forfeit)’, h:’A’, score:’—’, result:’W’, scorers:{}, note:’Forfeited by Titans’ },
{ date:’22 Mar 2026′, comp:’League’, opp:’Stanwick Rovers’, h:’A’, score:’4-0′, result:’W’, scorers:{Daren:1, Nish:2, Toby:1} },
{ date:’29 Mar 2026′, comp:’League’, opp:’Stanwick Rovers’, h:’H’, score:’4-0′, result:’W’, scorers:{Llewnard:1, Mani:3} },
{ date:’12 Apr 2026′, comp:’League’, opp:’Old Grammarians Eagles’, h:’H’, score:’1-2′, result:’L’, scorers:{Harley:1} },
{ date:’19 Apr 2026′, comp:’League’, opp:’FC Aztec Phoenix’, h:’H’, score:’2-2′, result:’D’, scorers:{Llewnard:1, Daren:1} },
{ date:’21 Apr 2026′, comp:’League’, opp:’Orchard Park Kestrels’, h:’H’, score:’0-1′, result:’L’, scorers:{} },
{ date:’26 Apr 2026′, comp:’League’, opp:’Corby Kingswood Stripes’, h:’A’, score:’3-1′, result:’W’, scorers:{Daren:1} },
];

const playerProfiles = [
{ name:’Daren’, pos:’Striker’, goals:11, bio:”The team’s standout striker and top scorer for the season. Daren’s hat-trick against Stanwick Rovers and remarkable five-goal haul vs NN29 Titans underlined his quality in front of goal. A constant threat and real match-winner.” },
{ name:’Mani’, pos:’Striker’, goals:9, bio:”A relentless presence up front all season. His brace in the 4-0 win vs Higham Town in January and a superb hat-trick against Stanwick in March showed real development and devastating end-of-season form.” },
{ name:’Mika’, pos:’Midfielder’, goals:6, bio:”An early-season star who got the team off the mark in game one. Mika’s double in the October win at Higham Town was a highlight, and his runs from midfield contributed important goals across all competitions.” },
{ name:’Toby’, pos:’Winger’, goals:6, bio:”Toby saved his best for the Christmas fixture — a stunning hat-trick away at FC Aztec was one of the moments of the season. Dangerous down the flank all year with an eye for goal that belied his wide position.” },
{ name:’Harley’, pos:’Striker’, goals:4, bio:”A striker who chipped in across all three competitions, including a vital effort in the November win over AFC R&D Scorpions. Harley led the line with energy and was a constant handful for opposition defenders.” },
{ name:’Llewnard’, pos:’Winger’, goals:4, bio:”Contributed important goals at key moments — the county cup opener, the December win against Kingswood, and both the March and April fixtures. Pace and directness on the wing that was often decisive when margins were tight.” },
{ name:’Nish’, pos:’Winger’, goals:3, bio:”A winger who takes his chances when they arrive. Nish’s brace vs Stanwick in March was part of a fine away win, and his earlier goal in the November comeback showed real composure when cutting in from the flank.” },
{ name:’Alex B’, pos:’Midfielder’, goals:2, bio:”Contributed a pair of goals from midfield, including one in the big League Cup away win at Stanwick and a crucial effort in the January rout of NN29 Titans. A creative and determined presence in the engine room.” },
{ name:’Colsey’, pos:’Midfielder’, goals:2, bio:”Chipped in with important goals including a finish in the October win at Higham Town. A versatile and hardworking midfielder who made his mark on the score sheet when it mattered most.” },
{ name:’Skeggs’, pos:’Goalkeeper’, goals:1, bio:”Opened his account on the very first day of the season with a goal in the 2-0 home win over AFC R&D Scorpions — remarkable for a goalkeeper. Between the sticks, Skeggs was commanding and reliable all season.” },
{ name:’Archie’, pos:’Midfielder’, goals:1, bio:”Got on the scoresheet in the County Cup win over Wittering Harriers in September. A committed and energetic midfielder throughout the season, Archie was a key part of the squad dynamic.” },
{ name:’Milo’, pos:’Defender’, goals:0, bio:”A committed defender whose organisation and work rate set standards for those around him. Milo was part of several clean sheets and was a no-nonsense, dependable presence at the back all season.” },
{ name:’Thomas’, pos:’Defender’, goals:0, bio:”Solid and dependable at the back. Thomas was a popular member of the dressing room who brought defensive resilience on matchdays and real energy to training sessions throughout the campaign.” },
{ name:’Charlie’, pos:’Defender’, goals:0, bio:”A defender who gave everything every time he pulled on the shirt. Charlie’s willingness to play wherever asked made him invaluable to Johnny and the coaching staff as the season progressed.” },
{ name:’Isaac’, pos:’Defender’, goals:0, bio:”Dependable and coachable, Isaac developed well across the campaign. Part of several strong defensive displays, he grew in confidence as the season went on and was a quiet but effective presence.” },
{ name:’Harry’, pos:’Defender’, goals:0, bio:”Harry brought physicality and commitment every time he played. A strong competitor who relished the defensive battle and helped set the tone in training and on matchdays throughout the season.” },
{ name:’Alex K’, pos:’Winger’, goals:0, bio:”A pacy and direct winger who provided width and energy throughout the campaign. Alex K was a lively option on the flank and a positive squad presence whenever called upon.” },
{ name:’Kai’, pos:’Defender’, goals:0, bio:”Kai was part of the squad during the opening months of the season before departing in mid-January. A dependable defender during his time with the group — we thank him for his contribution and wish him well.” },
];

/* ── GOAL COLOURS per player ── */
const COLOURS = [
‘#4a90e2′,’#e74c3c’,’#2ecc71′,’#f39c12′,’#9b59b6′,
‘#1abc9c’,’#e67e22′,’#3498db’,’#e91e63′,’#00bcd4′,’#ff5722′
];

/* ── BUILD scorer totals from match data (ground truth) ── */
const scorerOrder = [‘Daren’,’Mani’,’Mika’,’Toby’,’Harley’,’Llewnard’,’Nish’,’Alex B’,’Colsey’,’Skeggs’,’Archie’];
const colourMap = {};
scorerOrder.forEach((p,i) => colourMap[p] = COLOURS[i]);

/* ── TREND CHART: cumulative goals per game ── */
const labels = matches.map((m,i) => {
const d = m.date.split(‘ ‘);
return d[0]+’ ‘+d[1].slice(0,3);
});

const datasets = scorerOrder.map((player, idx) => {
let running = 0;
const data = matches.map(m => {
running += (m.scorers[player] || 0);
return running;
});
return {
label: player,
data,
borderColor: COLOURS[idx],
backgroundColor: COLOURS[idx] + ’22’,
borderWidth: 2,
pointRadius: 3,
pointHoverRadius: 5,
tension: 0.35,
fill: false,
};
});

/* build legend */
const legend = document.getElementById(‘scorerLegend’);
scorerOrder.forEach((p,i) => {
const item = document.createElement(‘span’);
item.className = ‘scorer-legend-item’;
item.innerHTML = `${p}`;
legend.appendChild(item);
});

new Chart(document.getElementById(‘trendChart’), {
type: ‘line’,
data: { labels, datasets },
options: {
responsive: true,
maintainAspectRatio: false,
interaction: { mode: ‘index’, intersect: false },
plugins: {
legend: { display: false },
tooltip: {
backgroundColor: ‘#1a1d2e’,
borderColor: ‘rgba(255,255,255,0.1)’,
borderWidth: 1,
titleColor: ‘#fff’,
bodyColor: ‘#8890aa’,
callbacks: {
label: ctx => ` ${ctx.dataset.label}: ${ctx.parsed.y} goal${ctx.parsed.y !== 1 ? ‘s’ : ”}`
}
}
},
scales: {
x: {
ticks: { color: ‘#8890aa’, font: { size: 10 }, maxRotation: 45 },
grid: { color: ‘rgba(255,255,255,0.05)’ }
},
y: {
ticks: { color: ‘#8890aa’, stepSize: 1 },
grid: { color: ‘rgba(255,255,255,0.05)’ },
title: { display: true, text: ‘Cumulative Goals’, color: ‘#8890aa’, font: { size: 11 } }
}
}
}
});

/* ── PER GAME CHART ── */
const perGameGoals = matches.map(m => Object.values(m.scorers).reduce((a,b)=>a+b,0));
const barColours = matches.map(m => m.result === ‘W’ ? ‘#0aac38’ : m.result === ‘D’ ? ‘#888’ : ‘#c0392b’);

new Chart(document.getElementById(‘perGameChart’), {
type: ‘bar’,
data: {
labels,
datasets: [{
label: ‘Goals scored’,
data: perGameGoals,
backgroundColor: barColours,
borderRadius: 3,
}]
},
options: {
responsive: true,
maintainAspectRatio: false,
plugins: {
legend: { display: false },
tooltip: {
backgroundColor: ‘#1a1d2e’,
borderColor: ‘rgba(255,255,255,0.1)’,
borderWidth: 1,
titleColor: ‘#fff’,
bodyColor: ‘#8890aa’,
callbacks: {
label: ctx => ` ${ctx.parsed.y} goal${ctx.parsed.y !== 1 ? ‘s’ : ”} (${matches[ctx.dataIndex].result})`
}
}
},
scales: {
x: {
ticks: { color: ‘#8890aa’, font: { size: 10 }, maxRotation: 45 },
grid: { color: ‘rgba(255,255,255,0.05)’ }
},
y: {
ticks: { color: ‘#8890aa’, stepSize: 1 },
grid: { color: ‘rgba(255,255,255,0.05)’ }
}
}
}
});

/* ── GOLDEN BOOT TABLE ── */
const maxGoals = Math.max(…playerProfiles.filter(p=>p.goals>0).map(p=>p.goals));
const tbody = document.getElementById(‘scorerTableBody’);
const scorers = playerProfiles.filter(p => p.goals > 0).sort((a,b) => b.goals – a.goals);
scorers.forEach((p, idx) => {
const rankClass = idx === 0 ? ‘top1’ : idx === 1 ? ‘top2’ : idx === 2 ? ‘top3’ : ”;
const pct = Math.round((p.goals / maxGoals) * 100);
const colour = colourMap[p.name] || ‘#4a90e2’;
const tr = document.createElement(‘tr’);
tr.innerHTML = `

`;
tbody.appendChild(tr);
});

/* ── MATCH GRID ── */
const mg = document.getElementById(‘matchGrid’);
matches.forEach(m => {
const cls = m.result === ‘W’ ? ‘win’ : m.result === ‘L’ ? ‘loss’ : ‘draw’;
const pillCls = m.result === ‘W’ ? ‘win’ : m.result === ‘L’ ? ‘loss’ : ‘draw’;
const pillTxt = m.result === ‘W’ ? ‘WIN’ : m.result === ‘L’ ? ‘LOSS’ : ‘DRAW’;
const scorerStr = Object.entries(m.scorers).map(([p,g]) => g > 1 ? `${p} (${g})` : p).join(‘, ‘);
const card = document.createElement(‘div’);
card.className = ‘match-card ‘ + cls;
card.innerHTML = `

`;
mg.appendChild(card);
});

/* ── PLAYER PROFILES ── */
const pg = document.getElementById(‘profilesGrid’);
playerProfiles.forEach(p => {
const initials = p.name.slice(0,2).toUpperCase();
const colour = colourMap[p.name] || ‘#444’;
const card = document.createElement(‘div’);
card.className = ‘profile-card’;
const posBg = {Goalkeeper:’#1114c5′,Striker:’#c0392b’,Midfielder:’#0aac38′,Winger:’#8e44ad’,Defender:’#555e70′}[p.pos] || ‘#444’;
card.innerHTML = `

`;
pg.appendChild(card);
});
});