:root {
    --brand-yellow: #ffd230;
    --ink: #151515;
    --muted-ink: #5f6368;
    --surface: #ffffff;
    --soft-surface: #f2f2f2;
    --border: #d7d7d7;
    --maximum-width: 1120px;
}

* {
    box-sizing: border-box;
}

html {
    font-family:
        Arial,
        Helvetica,
        sans-serif;
    color: var(--ink);
    background: var(--surface);
}

body {
    margin: 0;
    min-height: 100vh;
}

a {
    color: inherit;
}

.container {
    width: min(
        calc(100% - 2rem),
        var(--maximum-width)
    );
    margin-inline: auto;
}

.site-header {
    background: var(--brand-yellow);
}

.header-bar {
    width: min(
        calc(100% - 2rem),
        var(--maximum-width)
    );
    margin-inline: auto;
    padding: 1.25rem 0 0.85rem;
}

.brand {
    display: inline-block;
    color: var(--ink);
    font-size: clamp(1.6rem, 4vw, 2.5rem);
    font-weight: 900;
    letter-spacing: -0.055em;
    text-decoration: none;
}

.main-navigation {
    display: flex;
    gap: 0;
    width: min(
        calc(100% - 2rem),
        var(--maximum-width)
    );
    margin-inline: auto;
    overflow-x: auto;
    border-top: 1px solid rgba(0, 0, 0, 0.18);
}

.main-navigation a {
    padding: 0.8rem 1rem;
    border-left: 1px solid rgba(0, 0, 0, 0.18);
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
}

.main-navigation a:last-child {
    border-right: 1px solid rgba(0, 0, 0, 0.18);
}

.main-navigation a:hover,
.main-navigation a:focus-visible {
    background: rgba(255, 255, 255, 0.35);
}

.score-hero {
    padding: 2.5rem 0;
    color: #ffffff;
    background: #181818;
}

.match-meta,
.match-status {
    margin: 0;
    color: #bdbdbd;
    text-align: center;
}

.scoreboard {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: clamp(1rem, 5vw, 4rem);
    align-items: center;
    margin: 1.75rem auto 0.75rem;
    max-width: 780px;
}

.team:first-child {
    text-align: right;
}

.team:last-child {
    text-align: left;
}

.team-name {
    font-size: clamp(1.2rem, 4vw, 2rem);
    font-weight: 800;
}

.score {
    position: relative;
    display: flex;
    gap: 0.75rem;
    align-items: center;
    padding-bottom: 1.5rem;
    font-size: clamp(2.5rem, 8vw, 5rem);
    font-weight: 800;
    line-height: 1;
}

.score-divider {
    color: #8f8f8f;
    font-weight: 400;
}

.score small {
    position: absolute;
    bottom: 0;
    left: 50%;
    color: var(--brand-yellow);
    font-size: 0.75rem;
    letter-spacing: 0.1em;
    transform: translateX(-50%);
}

.featured-report {
    padding: 3.5rem 0;
    border-bottom: 1px solid var(--border);
}

.section-label,
.card-category {
    color: #4b4b4b;
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.featured-report h1 {
    max-width: 850px;
    margin: 0.65rem 0 1rem;
    font-size: clamp(2rem, 6vw, 4.25rem);
    letter-spacing: -0.045em;
    line-height: 1;
}

.report-introduction {
    max-width: 730px;
    color: var(--muted-ink);
    font-size: 1.15rem;
    line-height: 1.7;
}

.dashboard-section {
    padding: 3rem 0 4rem;
    background: var(--soft-surface);
}

.dashboard-section h2 {
    margin-top: 0;
    font-size: 2rem;
}

.card-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
}

.content-card {
    min-height: 220px;
    padding: 1.5rem;
    border-top: 5px solid var(--brand-yellow);
    background: var(--surface);
}

.content-card h3 {
    margin: 1rem 0 0.75rem;
    font-size: 1.4rem;
}

.content-card p {
    color: var(--muted-ink);
    line-height: 1.6;
}

.site-footer {
    padding: 2.5rem 0;
    color: #ffffff;
    background: var(--ink);
}

.site-footer p {
    margin-bottom: 0;
    color: #bdbdbd;
}

.penalty-result {
    grid-column: 1 / -1;
    width: 100%;
    margin: 0;
    color: #ffffff;
    font-size: 1rem;
    font-weight: 800;
    line-height: 1.4;
    text-align: center;
    justify-self: stretch;
}
.penalty-result + .match-status {
    margin-top: 0.45rem;
}

.page-hero {
    padding: 3.5rem 0;
    color: #ffffff;
    background: var(--ink);
}

.page-hero .section-label {
    color: var(--brand-yellow);
}

.page-hero h1 {
    margin: 0.5rem 0 0.75rem;
    font-size: clamp(2.75rem, 8vw, 5rem);
    letter-spacing: -0.05em;
    line-height: 0.95;
}

.page-hero p:last-child {
    max-width: 650px;
    margin-bottom: 0;
    color: #c8c8c8;
    font-size: 1.1rem;
    line-height: 1.6;
}

.players-section {
    min-height: 420px;
    padding: 3rem 0 4rem;
    background: var(--soft-surface);
}

.players-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.player-card {
    overflow: hidden;
    border-top: 5px solid var(--brand-yellow);
    background: var(--surface);
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08);
}

.player-card-header {
    display: flex;
    gap: 1rem;
    align-items: center;
    padding: 1.5rem;
    border-bottom: 1px solid var(--border);
}

.player-avatar {
    display: grid;
    flex: 0 0 60px;
    width: 60px;
    height: 60px;
    place-items: center;
    border-radius: 50%;
    color: var(--ink);
    background: var(--brand-yellow);
    font-size: 1.25rem;
    font-weight: 900;
}

.player-label {
    margin: 0 0 0.25rem;
    color: var(--muted-ink);
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.player-card h2 {
    margin: 0;
    font-size: 1.4rem;
}

.player-stat-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    margin: 0;
}

.player-stat-grid div {
    padding: 1.25rem 0.5rem;
    text-align: center;
    border-right: 1px solid var(--border);
}

.player-stat-grid div:last-child {
    border-right: 0;
}

.player-stat-grid dt {
    color: var(--muted-ink);
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.player-stat-grid dd {
    margin: 0.3rem 0 0;
    font-size: 1.65rem;
    font-weight: 900;
}

.player-rate {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    color: #ffffff;
    background: var(--ink);
}

.player-rate span {
    color: #c8c8c8;
}

.empty-state {
    padding: 4rem 2rem;
    border-top: 5px solid var(--brand-yellow);
    text-align: center;
    background: var(--surface);
}

.empty-state h2 {
    margin-top: 0;
}

.empty-state p {
    margin-bottom: 0;
    color: var(--muted-ink);
}

.main-navigation a[aria-current="page"] {
    background: rgba(255, 255, 255, 0.4);
}

.player-card-link {
    display: flex;
    justify-content: space-between;
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--border);
    font-weight: 800;
    text-decoration: none;
}

.player-card-link:hover,
.player-card-link:focus-visible {
    background: var(--brand-yellow);
}

.player-profile-hero {
    padding: 3.5rem 0;
    color: #ffffff;
    background: var(--ink);
}

.player-profile-heading {
    display: flex;
    gap: 1.5rem;
    align-items: center;
}

.player-profile-avatar {
    display: grid;
    flex: 0 0 110px;
    width: 110px;
    height: 110px;
    place-items: center;
    border-radius: 50%;
    color: var(--ink);
    background: var(--brand-yellow);
    font-size: 2rem;
    font-weight: 900;
}

.profile-eyebrow {
    margin: 0;
    color: var(--brand-yellow);
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.player-profile-heading h1 {
    margin: 0.4rem 0;
    font-size: clamp(2.5rem, 7vw, 4.75rem);
    letter-spacing: -0.05em;
    line-height: 1;
}

.player-profile-heading p:last-child {
    margin-bottom: 0;
    color: #c8c8c8;
}

.profile-statistics {
    padding: 3rem 0;
    background: var(--soft-surface);
}

.format-stat-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.format-stat-card {
    border-top: 5px solid var(--brand-yellow);
    background: #ffffff;
}

.format-stat-card h2 {
    margin: 0;
    padding: 1.25rem;
    border-bottom: 1px solid var(--border);
}

.format-stat-card dl {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    margin: 0;
}

.format-stat-card dl div {
    padding: 1.25rem 0.5rem;
    text-align: center;
    border-right: 1px solid var(--border);
}

.format-stat-card dl div:last-child {
    border-right: 0;
}

.format-stat-card dt {
    color: var(--muted-ink);
    font-size: 0.7rem;
    font-weight: 800;
    text-transform: uppercase;
}

.format-stat-card dd {
    margin: 0.3rem 0 0;
    font-size: 1.65rem;
    font-weight: 900;
}

.format-stat-rate {
    display: flex;
    justify-content: space-between;
    margin: 0;
    padding: 1rem 1.25rem;
    color: #ffffff;
    background: var(--ink);
}

.format-stat-rate span {
    color: #c8c8c8;
}

.player-match-history {
    padding: 3rem 0 4rem;
}

.player-match-history h2 {
    font-size: 2rem;
}

.match-history-table-wrapper {
    overflow-x: auto;
}

.match-history-table {
    width: 100%;
    border-collapse: collapse;
    background: #ffffff;
}

.match-history-table th,
.match-history-table td {
    padding: 1rem;
    border-bottom: 1px solid var(--border);
    text-align: left;
}

.match-history-table th {
    color: #ffffff;
    background: var(--ink);
    font-size: 0.75rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.match-history-table small {
    display: block;
    margin-top: 0.2rem;
    color: var(--muted-ink);
}

.outcome {
    display: inline-grid;
    width: 1.75rem;
    height: 1.75rem;
    margin-right: 0.5rem;
    place-items: center;
    font-size: 0.75rem;
    font-weight: 900;
}

.outcome-w {
    background: #b9e4b4;
}

.outcome-d {
    background: #dddddd;
}

.outcome-l {
    background: #efb4b4;
}

.featured-headline-link {
    text-decoration: none;
}

.featured-headline-link:hover,
.featured-headline-link:focus-visible {
    text-decoration: underline;
    text-decoration-color: var(--brand-yellow);
    text-decoration-thickness: 0.12em;
}

.matches-section {
    min-height: 420px;
    padding: 3rem 0 4rem;
    background: var(--soft-surface);
}

.match-list {
    display: grid;
    gap: 1rem;
}

.match-list-card {
    display: block;
    padding: 1.5rem;
    border-top: 5px solid var(--brand-yellow);
    background: #ffffff;
    text-decoration: none;
}

.match-list-card:hover,
.match-list-card:focus-visible {
    transform: translateY(-2px);
    box-shadow: 0 5px 18px rgba(0, 0, 0, 0.1);
}

.match-list-header {
    display: flex;
    justify-content: space-between;
    color: var(--muted-ink);
    font-size: 0.8rem;
    font-weight: 800;
    text-transform: uppercase;
}

.match-list-score {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 1rem;
    align-items: center;
    max-width: 680px;
    margin: 1.5rem auto;
    text-align: center;
}

.match-list-score span:first-child {
    text-align: right;
}

.match-list-score span:last-child {
    text-align: left;
}

.match-list-score span {
    font-weight: 900;
}

.match-list-score strong {
    font-size: clamp(2rem, 7vw, 4rem);
    letter-spacing: -0.05em;
}

.match-list-penalties {
    margin: -0.75rem 0 1rem;
    font-weight: 800;
    text-align: center;
}

.match-list-card h2 {
    margin: 1rem 0;
    font-size: clamp(1.4rem, 4vw, 2.25rem);
}

.match-list-link {
    font-weight: 800;
}

.match-report {
    padding: 3.5rem 0;
}

.match-report-container {
    max-width: 850px;
}

.match-report h1 {
    margin: 0.5rem 0 1rem;
    font-size: clamp(2.25rem, 6vw, 4.5rem);
    letter-spacing: -0.05em;
    line-height: 1;
}

.match-report-meta {
    padding-bottom: 1.5rem;
    border-bottom: 1px solid var(--border);
    color: var(--muted-ink);
}

.match-report-copy {
    font-size: 1.1rem;
    line-height: 1.8;
}

.team-sheets-section {
    padding: 3rem 0 4rem;
    background: var(--soft-surface);
}

.team-sheets-section > .container > h2 {
    font-size: 2rem;
}

.team-sheet-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.team-sheet {
    border-top: 5px solid var(--brand-yellow);
    background: #ffffff;
}

.team-sheet header {
    padding: 1.5rem;
    color: #ffffff;
    background: var(--ink);
}

.team-sheet h3 {
    margin: 0;
    font-size: 1.75rem;
}

.team-sheet header p {
    margin: 0.4rem 0 0;
    color: #c8c8c8;
}

.team-sheet ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.team-sheet li {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid var(--border);
}

.team-sheet li:last-child {
    border-bottom: 0;
}

.team-sheet li a {
    font-weight: 800;
    text-decoration: none;
}

.team-sheet li a:hover,
.team-sheet li a:focus-visible {
    text-decoration: underline;
}

.team-sheet li span:last-child {
    white-space: nowrap;
}

.unattributed-goals {
    color: var(--muted-ink);
    background: var(--soft-surface);
}

.history-match-link {
    color: inherit;
    font-weight: 800;
    text-decoration: none;
}

.history-match-link:hover,
.history-match-link:focus-visible {
    text-decoration: underline;
}

.admin-auth-section {
    min-height: 680px;
    padding: 4rem 0;
    background: var(--soft-surface);
}

.admin-auth-card {
    width: min(100%, 620px);
    margin-inline: auto;
    padding: clamp(1.5rem, 5vw, 3rem);
    border-top: 6px solid var(--brand-yellow);
    background: #ffffff;
}

.admin-auth-card h1 {
    margin: 0.5rem 0 1rem;
    font-size: clamp(2.25rem, 6vw, 4rem);
    letter-spacing: -0.05em;
    line-height: 1;
}

.admin-auth-introduction {
    margin-bottom: 2rem;
    color: var(--muted-ink);
    line-height: 1.6;
}

.admin-form {
    display: grid;
    gap: 1.25rem;
}

.form-field {
    display: grid;
    gap: 0.45rem;
}

.form-field label {
    font-weight: 800;
}

.form-field input {
    width: 100%;
    padding: 0.9rem 1rem;
    border: 2px solid var(--border);
    border-radius: 0;
    background: #ffffff;
    font: inherit;
}

.form-field input:focus {
    border-color: var(--ink);
    outline: 3px solid var(--brand-yellow);
    outline-offset: 1px;
}

.form-field small {
    color: var(--muted-ink);
}

.form-alert {
    margin-bottom: 1.5rem;
    padding: 1rem;
    border-left: 5px solid;
}

.form-alert-error {
    border-color: #b42318;
    color: #7a1710;
    background: #fee4e2;
}

.form-alert ul {
    margin-bottom: 0;
}

.admin-primary-button,
.admin-secondary-button {
    padding: 0.95rem 1.25rem;
    border: 0;
    font: inherit;
    font-weight: 900;
    cursor: pointer;
}

.admin-primary-button {
    color: var(--ink);
    background: var(--brand-yellow);
}

.admin-primary-button:hover,
.admin-primary-button:focus-visible {
    background: #f4c000;
}

.admin-secondary-button {
    color: #ffffff;
    background: var(--ink);
}

.admin-dashboard-hero {
    padding: 3.5rem 0;
    color: #ffffff;
    background: var(--ink);
}

.admin-dashboard-hero .section-label {
    color: var(--brand-yellow);
}

.admin-dashboard-hero h1 {
    margin: 0.5rem 0;
    font-size: clamp(2.5rem, 7vw, 4.75rem);
    letter-spacing: -0.05em;
    line-height: 1;
}

.admin-dashboard-hero p:last-child {
    color: #c8c8c8;
}

.admin-dashboard-section {
    min-height: 500px;
    padding: 3rem 0 4rem;
    background: var(--soft-surface);
}

.admin-action-grid {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.admin-action-card {
    padding: 1.5rem;
    border-top: 5px solid var(--brand-yellow);
    background: #ffffff;
}

.admin-action-card > span:first-child {
    color: var(--muted-ink);
    font-size: 0.75rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.admin-action-card h2 {
    margin: 0.75rem 0;
    font-size: 1.75rem;
}

.admin-action-card p {
    color: var(--muted-ink);
    line-height: 1.6;
}

.coming-soon-label {
    display: inline-block;
    margin-top: 1rem;
    padding: 0.45rem 0.65rem;
    color: var(--ink);
    background: var(--brand-yellow);
    font-size: 0.75rem;
    font-weight: 900;
    text-transform: uppercase;
}

.logout-form {
    margin-top: 2rem;
}

.admin-match-section {
    padding: 3rem 0 5rem;
    background: var(--soft-surface);
}

.admin-match-form {
    display: grid;
    gap: 1.5rem;
}

.admin-form-panel {
    overflow: hidden;
    border-top: 5px solid var(--brand-yellow);
    background: #ffffff;
}

.admin-form-panel-header {
    display: flex;
    gap: 1rem;
    align-items: center;
    padding: 1.5rem;
    color: #ffffff;
    background: var(--ink);
}

.admin-form-panel-header > span {
    display: grid;
    flex: 0 0 2.5rem;
    width: 2.5rem;
    height: 2.5rem;
    place-items: center;
    color: var(--ink);
    background: var(--brand-yellow);
    font-weight: 900;
}

.admin-form-panel-header h2 {
    margin: 0;
    font-size: 1.6rem;
}

.admin-form-panel-header p {
    margin: 0.3rem 0 0;
    color: #c8c8c8;
}

.admin-form-panel > .admin-form-grid,
.admin-form-panel > .form-field,
.admin-form-panel > .score-entry-grid,
.admin-form-panel > .penalty-entry-panel {
    margin: 1.5rem;
}

.admin-form-grid {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
    gap: 1.25rem;
}

.form-field-wide {
    grid-column: 1 / -1;
}

.form-field select,
.form-field textarea {
    width: 100%;
    padding: 0.9rem 1rem;
    border: 2px solid var(--border);
    border-radius: 0;
    background: #ffffff;
    font: inherit;
}

.form-field textarea {
    resize: vertical;
    line-height: 1.6;
}

.form-field select:focus,
.form-field textarea:focus {
    border-color: var(--ink);
    outline: 3px solid var(--brand-yellow);
    outline-offset: 1px;
}

.score-entry-grid {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 1rem;
    align-items: end;
    max-width: 520px;
    margin-inline: auto !important;
}

.score-entry-grid > span {
    padding-bottom: 0.65rem;
    font-size: 2rem;
    font-weight: 900;
}

.score-entry-team {
    display: grid;
    gap: 0.5rem;
    text-align: center;
}

.score-entry-team label {
    font-weight: 900;
}

.score-entry-team input {
    width: 100%;
    padding: 0.6rem;
    border: 2px solid var(--border);
    font: inherit;
    font-size: 2.5rem;
    font-weight: 900;
    text-align: center;
}

.penalty-entry-panel {
    padding: 1.25rem;
    border: 2px solid var(--brand-yellow);
    background: #fff9dc;
}

.penalty-entry-panel[hidden] {
    display: none;
}

.penalty-entry-panel h3 {
    margin-top: 0;
    text-align: center;
}

.lineup-summary {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
    gap: 1px;
    margin: 0;
    color: #ffffff;
    background: #444444;
}

.lineup-summary div {
    padding: 1rem 1.5rem;
    background: var(--ink);
}

.lineup-summary strong {
    margin-right: 0.5rem;
    color: var(--brand-yellow);
}

.player-assignment-list {
    display: grid;
}

.player-award-clear {
    display: flex;
    gap: 0.65rem;
    align-items: center;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid var(--border);
    background: #ffffff;
    font-weight: 800;
}

.player-award-clear input {
    width: 1.25rem;
    height: 1.25rem;
    accent-color: var(--brand-yellow);
}

.player-assignment-row {
    display: grid;
    grid-template-columns:
        minmax(180px, 2fr)
        minmax(150px, 1fr)
        minmax(130px, 1fr)
        100px
        100px
        100px
        70px;
    gap: 1rem;
    align-items: end;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid var(--border);
}

.player-award-field {
    align-content: end;
    justify-items: center;
}

.player-award-field input[type="radio"] {
    width: 1.25rem;
    height: 1.25rem;
    margin: 0.65rem 0;
    padding: 0;
    border: 0;
    accent-color: var(--brand-yellow);
    cursor: pointer;
}

.player-assignment-row:last-child {
    border-bottom: 0;
}

.player-assignment-row.is-selected {
    background: #fff9dc;
}

.player-assignment-row[data-team="bibs"] {
    border-left: 5px solid var(--brand-yellow);
}

.player-assignment-row[data-team="non_bibs"] {
    border-left: 5px solid var(--ink);
}

.player-assignment-name {
    align-self: center;
}

.player-assignment-row .form-field {
    gap: 0.25rem;
}

.player-assignment-row label {
    color: var(--muted-ink);
    font-size: 0.7rem;
    text-transform: uppercase;
}

.player-assignment-row input,
.player-assignment-row select {
    padding: 0.65rem;
}

.admin-form-actions {
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
    align-items: center;
    padding: 1.5rem;
    background: #ffffff;
}

.admin-cancel-link {
    padding: 0.95rem 1.25rem;
    font-weight: 800;
    text-decoration: none;
}

.admin-action-link {
    display: block;
    color: inherit;
    text-decoration: none;
}

.admin-action-link:hover,
.admin-action-link:focus-visible {
    transform: translateY(-2px);
    box-shadow: 0 5px 18px rgba(0, 0, 0, 0.1);
}

.admin-nav-link {
    margin-left: auto;
    color: #ffffff;
    background: var(--ink);
}

.admin-nav-link:hover,
.admin-nav-link:focus-visible,
.admin-nav-link[aria-current="page"] {
    color: var(--ink);
    background: #ffffff;
}

.leaderboards-section {
    padding: 3rem 0 5rem;
    background: var(--soft-surface);
}

.leaderboard-format-section {
    margin-bottom: 3.5rem;
}

.leaderboard-format-section:last-child {
    margin-bottom: 0;
}

.leaderboard-format-header {
    margin-bottom: 1.25rem;
}

.leaderboard-format-header h2 {
    margin: 0.35rem 0 0;
    font-size: clamp(2rem, 5vw, 3.25rem);
    letter-spacing: -0.045em;
}

.leaderboard-grid {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.leaderboard-card {
    overflow: hidden;
    border-top: 5px solid var(--brand-yellow);
    background: #ffffff;
}

.leaderboard-card > header {
    padding: 1.25rem 1.5rem;
    color: #ffffff;
    background: var(--ink);
}

.leaderboard-card h3 {
    margin: 0;
    font-size: 1.4rem;
}

.leaderboard-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.leaderboard-list li {
    display: grid;
    grid-template-columns: 2.25rem 1fr auto;
    gap: 0.8rem;
    align-items: center;
    min-height: 74px;
    padding: 0.85rem 1rem;
    border-bottom: 1px solid var(--border);
}

.leaderboard-list li:last-child {
    border-bottom: 0;
}

.leaderboard-list li:first-child {
    background: #fff9dc;
}

.leaderboard-rank {
    display: grid;
    width: 2rem;
    height: 2rem;
    place-items: center;
    color: var(--ink);
    background: var(--brand-yellow);
    font-weight: 900;
}

.leaderboard-player {
    font-weight: 800;
    text-decoration: none;
}

.leaderboard-player:hover,
.leaderboard-player:focus-visible {
    text-decoration: underline;
    text-decoration-color: var(--brand-yellow);
    text-decoration-thickness: 0.15em;
}

.leaderboard-values {
    min-width: 72px;
    text-align: right;
}

.leaderboard-values strong {
    display: block;
    font-size: 1.55rem;
    line-height: 1;
}

.leaderboard-values span {
    display: block;
    color: var(--muted-ink);
    font-size: 0.7rem;
    font-weight: 800;
    text-transform: uppercase;
}

.leaderboard-values small {
    display: block;
    margin-top: 0.25rem;
    color: var(--muted-ink);
}

.leaderboard-empty {
    margin: 0;
    padding: 2rem 1.5rem;
    color: var(--muted-ink);
}

.leaderboard-details > summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--border);
    color: var(--ink);
    background: #ffffff;
    font-weight: 900;
    list-style: none;
    text-decoration: underline;
    text-decoration-color: var(--brand-yellow);
    text-decoration-thickness: 0.15em;
    cursor: pointer;
}

.leaderboard-details > summary::-webkit-details-marker {
    display: none;
}

.leaderboard-details > summary::after {
    content: '+';
    font-size: 1.4rem;
    line-height: 1;
}

.leaderboard-details[open] > summary::after {
    content: '−';
}

.leaderboard-details > summary:hover,
.leaderboard-details > summary:focus-visible {
    background: var(--brand-yellow);
}

.leaderboard-summary-expanded {
    display: none;
}

.leaderboard-details[open] .leaderboard-summary-collapsed {
    display: none;
}

.leaderboard-details[open] .leaderboard-summary-expanded {
    display: inline;
}

.leaderboard-list-continuation li:first-child {
    background: #ffffff;
}

/* BibBets */
.bibbets-hero {
    padding: clamp(3rem, 7vw, 5.5rem) 0;
    color: var(--surface);
}

.bibbets-hero .section-label {
    color: var(--brand-yellow);
}

.bibbets-hero h1 {
    margin: 0.35rem 0 0.75rem;
    color: var(--surface);
    font-size: clamp(3.5rem, 10vw, 7.5rem);
    letter-spacing: -0.065em;
    line-height: 0.85;
}

.bibbets-hero p:last-child {
    max-width: 38rem;
    margin-bottom: 0;
    color: #c8c8c8;
    font-size: 1.1rem;
    line-height: 1.6;
}

.bibbets-section {
    padding: 3rem 0 5rem;
    background-color: var(--soft-surface);
    background-image: linear-gradient(
        rgba(21, 21, 21, 0.025) 1px,
        transparent 1px
    );
    background-size: 100% 5rem;
}

.bibbets-stoddy {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    gap: clamp(1.25rem, 4vw, 3rem);
    align-items: center;
    margin-bottom: 3rem;
    padding: clamp(1.5rem, 4vw, 2.5rem);
    overflow: hidden;
    border: 4px double var(--brand-yellow);
    color: var(--surface);
    background:
        linear-gradient(
            135deg,
            rgba(255, 255, 255, 0.035) 25%,
            transparent 25% 50%,
            rgba(255, 255, 255, 0.035) 50% 75%,
            transparent 75%
        ),
        #123d2b;
    background-size: 28px 28px;
    box-shadow:
        0 8px 0 var(--ink),
        inset 0 0 0 5px #123d2b,
        inset 0 0 0 7px rgba(255, 210, 48, 0.45);
}

.bibbets-stoddy::before,
.bibbets-stoddy::after {
    position: absolute;
    color: rgba(255, 210, 48, 0.13);
    font-size: 8rem;
    line-height: 1;
}

.bibbets-stoddy::before {
    top: -1.75rem;
    left: -1rem;
    content: '♠';
}

.bibbets-stoddy::after {
    right: -1rem;
    bottom: -2rem;
    color: rgba(214, 62, 62, 0.16);
    content: '♥';
}

.bibbets-stoddy-intro,
.bibbets-stoddy-verdict {
    position: relative;
    z-index: 1;
}

.bibbets-stoddy .section-label {
    color: var(--brand-yellow);
}

.bibbets-stoddy-intro h2 {
    margin: 0.35rem 0 0.5rem;
    font-size: clamp(2rem, 5vw, 3.4rem);
    letter-spacing: -0.05em;
    line-height: 0.95;
}

.bibbets-stoddy-intro > p:last-child {
    margin: 0;
    color: #d6e3dc;
    font-weight: 800;
}

.bibbets-stoddy-portrait {
    position: relative;
    z-index: 1;
    width: clamp(12rem, 22vw, 17rem);
    margin: 0;
    border: 5px solid var(--ink);
    outline: 3px solid var(--brand-yellow);
    outline-offset: 3px;
    background: var(--brand-yellow);
    box-shadow:
        9px 9px 0 rgba(0, 0, 0, 0.45),
        0 0 0 7px var(--ink);
    transform: rotate(-2deg);
}

.bibbets-stoddy-portrait img {
    display: block;
    width: 100%;
    height: auto;
}

.bibbets-stoddy-portrait figcaption {
    position: absolute;
    right: 0.7rem;
    bottom: 0.7rem;
    left: 0.7rem;
    padding: 0.45rem 0.6rem;
    color: var(--brand-yellow);
    background: var(--ink);
    font-size: 0.7rem;
    font-weight: 900;
    letter-spacing: 0.14em;
    text-align: center;
    text-transform: uppercase;
}

.bibbets-stoddy-verdict {
    padding: 1rem;
    border: 2px solid rgba(255, 210, 48, 0.65);
    background: rgba(0, 0, 0, 0.22);
}

.bibbets-stoddy-verdict > span {
    display: block;
    color: #d6e3dc;
    font-size: 0.65rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.bibbets-stoddy-verdict strong {
    display: block;
    margin-top: 0.3rem;
    color: var(--brand-yellow);
    font-size: 1.2rem;
    text-transform: uppercase;
}

.bibbets-stoddy-verdict p {
    margin: 0.65rem 0 0;
    color: #e3ebe6;
    font-size: 0.83rem;
    line-height: 1.5;
}

.bibbets-section-header {
    margin-bottom: 1.5rem;
}

.bibbets-section-header h2,
.bibbets-market-rules h2 {
    margin: 0.35rem 0 0;
    font-size: clamp(2rem, 5vw, 3.25rem);
    letter-spacing: -0.045em;
}

.bibbets-section-header > p:last-child {
    margin: 0.65rem 0 0;
    color: var(--muted-ink);
}

.bibbets-market-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    align-items: start;
}

.bibbets-market {
    min-width: 0;
    overflow: hidden;
    border-top: 5px solid var(--brand-yellow);
    background: var(--surface);
    box-shadow: 0 1px 0 var(--border);
}

.bibbets-market-featured {
    grid-column: 1 / -1;
}

.bibbets-market > header {
    position: relative;
    padding: 1.25rem 1.5rem;
    overflow: hidden;
    color: var(--surface);
    background: var(--ink);
}

.bibbets-market > header::after {
    position: absolute;
    right: 0.75rem;
    bottom: -1rem;
    color: rgba(255, 210, 48, 0.16);
    font-size: 5rem;
    line-height: 1;
    content: '♠';
}

.bibbets-market:nth-child(2) > header::after {
    color: rgba(214, 62, 62, 0.22);
    content: '♦';
}

.bibbets-market:nth-child(3) > header::after {
    content: '♣';
}

.bibbets-market:nth-child(4) > header::after {
    color: rgba(214, 62, 62, 0.22);
    content: '♥';
}

.bibbets-market:nth-child(5) > header::after {
    content: '♠';
}

.bibbets-market:nth-child(6) > header::after {
    color: rgba(214, 62, 62, 0.22);
    content: '♦';
}

.bibbets-market > header > span {
    position: relative;
    z-index: 1;
    color: var(--brand-yellow);
    font-size: 0.7rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.bibbets-market h3 {
    position: relative;
    z-index: 1;
    margin: 0.45rem 0 0;
    font-size: 1.45rem;
}

.bibbets-market sup {
    color: var(--brand-yellow);
    font-size: 0.58em;
    vertical-align: super;
}

.bibbets-price-table {
    width: 100%;
    border-collapse: collapse;
}

.bibbets-price-table caption {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.bibbets-price-table th,
.bibbets-price-table td {
    padding: 0.8rem 1.25rem;
    border-bottom: 1px solid var(--border);
}

.bibbets-price-table thead th {
    color: var(--muted-ink);
    background: #f7f7f7;
    font-size: 0.68rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-align: left;
    text-transform: uppercase;
}

.bibbets-price-table th:last-child,
.bibbets-price-table td:last-child {
    text-align: right;
}

.bibbets-price-table tbody th {
    font-size: 0.95rem;
    text-align: left;
}

.bibbets-player-link {
    color: inherit;
    text-decoration-color: var(--brand-yellow);
    text-decoration-thickness: 0.12em;
    text-underline-offset: 0.16em;
}

.bibbets-player-link:hover,
.bibbets-player-link:focus-visible {
    color: #5f4a00;
    text-decoration-thickness: 0.2em;
}

.bibbets-price-table td strong {
    display: inline-block;
    min-width: 3.75rem;
    padding: 0.4rem 0.55rem;
    color: var(--ink);
    background: var(--brand-yellow);
    box-shadow: 3px 3px 0 var(--ink);
    font-size: 1.05rem;
    text-align: center;
}

.bibbets-market-featured .bibbets-price-table tbody {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.bibbets-market-featured .bibbets-price-table tbody tr {
    display: grid;
    grid-template-columns: 1fr auto;
}

.bibbets-request-note {
    margin: 0;
    padding: 1rem 1.25rem;
    color: var(--muted-ink);
    font-size: 0.82rem;
    font-weight: 800;
}

.bibbets-market-rules {
    margin-top: 2rem;
    padding: clamp(1.5rem, 4vw, 2.25rem);
    border-left: 6px solid var(--brand-yellow);
    color: var(--surface);
    background: var(--ink);
}

.bibbets-market-rules .section-label {
    color: var(--brand-yellow);
}

.bibbets-market-rules dl {
    display: grid;
    gap: 0.8rem;
    margin: 1.5rem 0 0;
}

.bibbets-market-rules dl div {
    display: grid;
    grid-template-columns: 2.5rem 1fr;
    gap: 0.75rem;
}

.bibbets-market-rules dt {
    color: var(--brand-yellow);
    font-weight: 900;
}

.bibbets-market-rules dd {
    margin: 0;
    color: #d7d7d7;
    line-height: 1.5;
}

.bibbets-disclaimer {
    margin: 0.9rem 0 0;
    color: var(--muted-ink);
    font-size: 0.62rem;
    line-height: 1.4;
    text-align: center;
}

@media (max-width: 900px) {
    .bibbets-stoddy {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .bibbets-stoddy-portrait {
        margin-inline: auto;
        grid-row: 1;
    }

    .bibbets-market-grid {
        grid-template-columns: 1fr;
    }

    .bibbets-market-featured {
        grid-column: auto;
    }
}

@media (max-width: 600px) {
    .bibbets-market-featured .bibbets-price-table tbody {
        display: table-row-group;
    }

    .bibbets-market-featured .bibbets-price-table tbody tr {
        display: table-row;
    }
}

.player-of-match {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    margin: 1.5rem 0;
    padding: 1rem 1.25rem;
    border-left: 5px solid var(--brand-yellow);
    color: #ffffff;
    background: var(--ink);
    text-decoration: none;
}

.player-of-match span {
    color: var(--brand-yellow);
    font-size: 0.75rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.player-of-match strong {
    font-size: 1.1rem;
}

.player-of-match:hover strong,
.player-of-match:focus-visible strong {
    text-decoration: underline;
}

.player-award-count {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: center;
    padding: 0.85rem 1.5rem;
    border-top: 1px solid var(--border);
    color: var(--ink);
    background: #fff9dc;
    font-weight: 800;
}

.player-award-star {
    margin-right: 0.35rem;
    color: #b88600;
}

.player-award-count strong {
    font-size: 1.35rem;
    font-weight: 900;
}

@media (max-width: 950px) {
    .leaderboard-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 650px) {
    .admin-nav-link {
        margin-left: 0;
    }
}

@media (max-width: 760px) {
    .admin-form-grid,
    .lineup-summary {
        grid-template-columns: 1fr;
    }

    .player-assignment-row {
        grid-template-columns:
            repeat(3, minmax(0, 1fr));
    }

    .player-assignment-name {
        grid-column: 1 / -1;
    }
}

@media (max-width: 500px) {
    .player-assignment-row {
        grid-template-columns: 1fr;
    }

    .player-assignment-name {
        grid-column: auto;
    }

    .admin-form-actions {
        align-items: stretch;
        flex-direction: column-reverse;
    }

    .admin-form-actions > * {
        width: 100%;
        text-align: center;
    }
}

@media (max-width: 700px) {
    .admin-action-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 700px) {
    .team-sheet-grid {
        grid-template-columns: 1fr;
    }

    .match-list-score {
        gap: 0.5rem;
    }
}

@media (max-width: 900px) {
    .format-stat-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 650px) {
    .player-profile-heading {
        align-items: flex-start;
    }

    .player-profile-avatar {
        flex-basis: 75px;
        width: 75px;
        height: 75px;
        font-size: 1.4rem;
    }
}

@media (max-width: 900px) {
    .players-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 650px) {
    .players-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 700px) {
    .scoreboard {
        gap: 0.75rem;
    }

    .team-name {
        font-size: 1rem;
    }

    .card-grid {
        grid-template-columns: 1fr;
    }
}

.own-goal-badge {
    color: var(--ink);
    white-space: nowrap;
}

.own-goal-summary-section {
    padding: 2rem 0;
    background: var(--soft-surface);
}

.own-goal-summary-list {
    display: grid;
    gap: 0.5rem;
    margin: 1rem 0 0;
    padding: 0;
    list-style: none;
}

.own-goal-summary-list li {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: space-between;
    padding: 0.75rem;
    background: #ffffff;
    border-left: 4px solid var(--brand-yellow);
}

/* Newsroom */
.news-article-header {
    padding: 3rem 0;
    border-bottom: 4px solid var(--brand-yellow);
    background: var(--ink);
    color: #ffffff;
}

.news-article-header .section-label {
    color: var(--brand-yellow);
}

.news-article-header .news-byline {
    color: #d8d8d8;
}

.news-archive,
.article-body,
.news-article-footer {
    padding: 2.5rem 0;
}

.news-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.25rem;
}

.news-card,
.news-management-card {
    padding: 1.25rem;
    border-top: 4px solid var(--brand-yellow);
    background: #ffffff;
}

.news-card-meta,
.news-byline {
    color: var(--muted-ink);
    font-size: 0.8rem;
    font-weight: 700;
}

.power-ranking-badge {
    display: inline-block;
    padding: 0.25rem 0.45rem;
    color: var(--ink);
    background: var(--brand-yellow);
    font-size: 0.7rem;
    font-weight: 900;
    text-transform: uppercase;
}

.news-standfirst {
    max-width: 48rem;
    font-size: 1.25rem;
}

.article-body {
    line-height: 1.75;
}

.power-ranking-board {
    max-width: 1050px;
    margin: 0 auto 3rem;
    padding: 1.5rem;
    background: var(--soft-surface);
}

.power-ranking-controls {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin: 1rem 0;
}

.power-ranking-controls button[aria-pressed="true"] {
    background: var(--brand-yellow);
}

.power-ranking-tier {
    margin-top: 1rem;
    border-top: 4px solid var(--brand-yellow);
    background: #ffffff;
}

.power-ranking-tier-header,
.power-ranking-player-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: space-between;
    align-items: center;
    padding: 1rem;
}

.power-ranking-player-list {
    justify-content: flex-start;
    margin: 0;
    list-style: none;
}

.power-ranking-player {
    padding: 0.55rem 0.75rem;
    border: 1px solid var(--border);
    font-weight: 800;
}

.news-management-list,
.admin-ranking-controls,
.admin-ranking-preview {
    display: grid;
    gap: 1rem;
}

.news-management-card {
    display: flex;
    gap: 1rem;
    justify-content: space-between;
}

.admin-ranking-editor {
    margin-top: 1rem;
}

.admin-ranking-controls {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ranking-player-control {
    display: grid;
    gap: 0.35rem;
}

.admin-ranking-preview-tier {
    padding: 0.75rem 1rem;
    border-left: 4px solid var(--brand-yellow);
    background: var(--soft-surface);
}

@media (max-width: 720px) {
    .news-grid,
    .admin-ranking-controls {
        grid-template-columns: 1fr;
    }

    .news-management-card {
        display: block;
    }
}

/* Private matchday squad selector */
.squad-selector-section { margin-bottom: 1.5rem; }
.selection-mode-explanations { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-top: 1rem; }
.selection-mode-explanations p, .admin-only-note { margin: 0; padding: 1rem; background: var(--soft-surface); }
.available-player-tools { display: flex; align-items: end; flex-wrap: wrap; gap: .75rem; margin-bottom: 1rem; }
.available-player-tools .form-field { flex: 1 1 15rem; }
.available-player-list { display: grid; gap: .65rem; }
.available-player-row { display: grid; grid-template-columns: minmax(12rem, 1fr) auto minmax(13rem, .8fr); gap: 1rem; align-items: center; padding: .8rem; border: 1px solid var(--border); background: var(--surface); }
.available-player-row > label { font-weight: 800; }
.player-tier-badge { display: inline-block; width: fit-content; padding: .3rem .5rem; background: var(--soft-surface); color: var(--ink); font-size: .75rem; font-weight: 800; }
.manual-assignment-field { display: none; }
.is-manual-mode .manual-assignment-field { display: block; }
.team-strength-summary, .team-selection-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.team-strength-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.team-strength-summary > div, .team-selection-card { padding: 1.25rem; border-top: 5px solid var(--brand-yellow); background: var(--soft-surface); }
.team-strength-summary h3, .team-selection-card h2, .team-selection-card h3 { margin-top: 0; }
.team-selection-card ol { margin: 0 0 1.25rem; padding-left: 1.4rem; }
.team-selection-card li { margin: .5rem 0; }
.team-selection-card li span { display: block; color: var(--muted-ink); font-size: .78rem; }
.balance-status { margin: 1rem 0; padding: .8rem 1rem; border-left: 6px solid var(--ink); background: var(--soft-surface); font-weight: 900; }
.balance-status-balanced { border-left-color: #287d3c; }
.balance-status-warning { border-left-color: var(--brand-yellow); }
.saved-selection-list { display: grid; gap: 1rem; }
.saved-selection-card { display: flex; justify-content: space-between; gap: 1rem; padding: 1.25rem; border-top: 5px solid var(--brand-yellow); background: var(--soft-surface); }
.saved-selection-card h2 { margin: .25rem 0; }
.visually-hidden-copy-source { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.copy-status { min-height: 1.25rem; font-weight: 800; }

@media (max-width: 800px) {
    .available-player-row, .team-strength-summary { grid-template-columns: 1fr; }
    .selection-mode-explanations, .team-selection-grid { grid-template-columns: 1fr; }
    .saved-selection-card { flex-direction: column; }
}

/* Editorial homepage */
.homepage-editorial-section { padding: 3rem 0; overflow: hidden; border-bottom: 1px solid var(--border); }
.homepage-editorial-section:nth-of-type(even) { background: var(--soft-surface); }
.homepage-section-header { display: flex; justify-content: space-between; gap: 1.5rem; align-items: end; margin-bottom: 1.25rem; }
.homepage-section-header h2 { margin: .2rem 0 0; font-size: clamp(1.7rem, 4vw, 2.4rem); }
.homepage-section-header p:not(.section-label) { max-width: 42rem; margin: .45rem 0 0; color: var(--muted-ink); }
.homepage-section-header > a { padding: .65rem 0; font-weight: 900; white-space: nowrap; }
.homepage-reel-shell { position: relative; min-width: 0; }
.homepage-reel { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(260px, calc((100% - 2rem) / 3)); gap: 1rem; overflow-x: auto; overscroll-behavior-inline: contain; scroll-snap-type: x mandatory; scrollbar-width: thin; scrollbar-color: var(--ink) var(--border); padding: .25rem 0 1rem; }
.homepage-reel:focus-visible { outline: 3px solid var(--brand-yellow); outline-offset: 4px; }
.homepage-reel-card { display: flex; flex-direction: column; min-width: 0; min-height: 21rem; overflow: hidden; scroll-snap-align: start; border-top: 5px solid var(--brand-yellow); background: var(--surface); box-shadow: 0 1px 0 var(--border); }
.homepage-reel-card > :not(.media-thumbnail) { margin-inline: 1.15rem; }
.reel-card-meta { margin-block: 1rem .35rem; color: var(--muted-ink); font-size: .78rem; font-weight: 800; text-transform: uppercase; }
.homepage-reel-card h3 { display: -webkit-box; margin-block: .9rem .6rem; overflow: hidden; font-size: 1.2rem; line-height: 1.25; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.reel-card-cta { margin-top: auto; padding-block: 1rem; border-top: 1px solid var(--border); font-weight: 900; text-decoration: none; }
.reel-card-cta:hover, .reel-card-cta:focus-visible { text-decoration: underline; }
.reel-score { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: .6rem; padding: 1rem 1.15rem; color: var(--surface); background: var(--ink); text-align: center; }
.reel-score > span { font-size: .76rem; font-weight: 900; }
.reel-score strong { display: inline-flex; align-items: center; gap: .12em; color: var(--brand-yellow); font-size: 2rem; letter-spacing: -.05em; }
.reel-penalty { color: var(--muted-ink); font-size: .8rem; font-weight: 800; }
.reel-card-details { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin-top: auto; }
.reel-card-details p { margin: 0; font-size: .85rem; }
.media-badge, .preview-status-badge { display: inline-block; width: fit-content; padding: .3rem .5rem; color: var(--ink); background: var(--brand-yellow); font-size: .7rem; font-weight: 900; text-transform: uppercase; }
.preview-status-badge { margin-top: 1rem; }
.reel-fixture { display: grid; grid-template-columns: 1fr auto 1fr; gap: .75rem; align-items: center; margin-block: .8rem; padding: 1rem; color: var(--surface); background: var(--ink); text-align: center; }
.reel-fixture span { color: var(--brand-yellow); font-weight: 900; }
.reel-arrow { display: none; position: absolute; z-index: 2; top: 50%; width: 2.75rem; height: 2.75rem; border: 0; border-radius: 50%; color: var(--surface); background: var(--ink); font-size: 1.8rem; cursor: pointer; transform: translateY(-50%); }
.has-reel-controls .reel-arrow { display: block; }
.reel-arrow-previous { left: -1.15rem; }
.reel-arrow-next { right: -1.15rem; }
.reel-arrow:disabled { opacity: .25; cursor: default; }
.reel-arrow:focus-visible { outline: 3px solid var(--brand-yellow); outline-offset: 2px; }
.homepage-editorial-section.golden-boot-section { background: var(--ink); color: var(--surface); }
.golden-boot-section .section-label, .golden-boot-section .homepage-section-header > a { color: var(--brand-yellow); }
.golden-boot-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin: 0; padding: 0; list-style: none; }
.golden-boot-list li { display: grid; grid-template-columns: auto 1fr auto; gap: .8rem; align-items: center; min-width: 0; padding: 1.25rem; border: 1px solid #444; background: #222; }
.golden-boot-list li:first-child { border-top: 5px solid var(--brand-yellow); }
.golden-boot-rank { color: var(--brand-yellow); font-size: 1.8rem; font-weight: 900; }
.golden-boot-list a { font-weight: 900; }
.golden-boot-list small { display: block; margin-top: .25rem; color: #c8c8c8; }
.golden-boot-list li > strong { color: var(--brand-yellow); font-size: 1.8rem; text-align: right; }
.golden-boot-list li > strong span { display: block; font-size: .65rem; text-transform: uppercase; }
.homepage-empty-state { padding: 1.25rem; border-left: 5px solid var(--brand-yellow); background: #222; }
.homepage-editorial-section.homepage-media-section { background: var(--ink); color: var(--surface); }
.homepage-media-section .homepage-section-header p { color: #c8c8c8; }
.media-reel-card { color: var(--ink); }
.media-thumbnail { position: relative; aspect-ratio: 16 / 9; overflow: hidden; color: var(--brand-yellow); background: #050505; }
.media-thumbnail img { width: 100%; height: 100%; object-fit: cover; }
.media-play-symbol { position: absolute; inset: 50% auto auto 50%; display: grid; place-items: center; width: 3rem; height: 3rem; border-radius: 50%; color: var(--ink); background: var(--brand-yellow); transform: translate(-50%, -50%); }
.thumbnail-unavailable::before { content: 'Video'; position: absolute; inset: 1rem auto auto 1rem; color: var(--surface); font-weight: 900; }
.media-caption, .media-match-headline { color: var(--muted-ink); font-size: .88rem; }
.media-match-headline { font-weight: 800; }
.homepage-explore { background: var(--surface); }
.homepage-navigation-card { display: block; color: inherit; text-decoration: none; }
.homepage-navigation-card:hover h3, .homepage-navigation-card:focus-visible h3 { text-decoration: underline; }

@media (max-width: 900px) {
    .homepage-reel { grid-auto-columns: minmax(260px, calc((100% - 1rem) / 2)); }
    .golden-boot-list { grid-template-columns: 1fr; }
}

@media (max-width: 600px) {
    .homepage-editorial-section { padding: 2.25rem 0; }
    .homepage-section-header { align-items: flex-start; flex-direction: column; gap: .5rem; }
    .homepage-reel { grid-auto-columns: minmax(250px, 84vw); }
    .reel-arrow { display: none !important; }
}

@media (prefers-reduced-motion: reduce) {
    .homepage-reel { scroll-behavior: auto; }
}

/* Match previews */
.preview-hero,
.preview-detail-hero {
    padding: 3.5rem 0;
    color: #ffffff;
    background: var(--ink);
}

.preview-hero .section-label,
.preview-detail-hero .section-label {
    color: var(--brand-yellow);
}

.preview-hero-container {
    text-align: center;
}

.preview-fixture {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: clamp(1rem, 5vw, 4rem);
    align-items: center;
    max-width: 760px;
    margin: 1.5rem auto;
    font-size: clamp(1.5rem, 5vw, 3.5rem);
    font-weight: 900;
}

.preview-fixture strong:first-child { text-align: right; }
.preview-fixture strong:last-child { text-align: left; }
.preview-fixture span { color: var(--brand-yellow); }
.preview-kickoff { margin-bottom: 0.5rem; font-size: 1.15rem; font-weight: 800; }
.preview-read-link { display: inline-block; margin-top: 0.5rem; font-weight: 900; }
.featured-preview { border-top: 6px solid var(--brand-yellow); }

.preview-detail-hero h1 {
    margin: 0.5rem 0 2rem;
    font-size: clamp(2.25rem, 6vw, 4.5rem);
    letter-spacing: -0.05em;
    line-height: 1;
}

.preview-fixture-detail { margin-inline: 0; }
.fixture-details { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; margin: 2rem 0 0; background: #555555; }
.fixture-details div { padding: 1rem; background: #292929; }
.fixture-details dt { color: var(--brand-yellow); font-size: 0.72rem; font-weight: 900; text-transform: uppercase; }
.fixture-details dd { margin: 0.35rem 0 0; font-weight: 800; }

.admin-preview-section { min-height: 500px; padding: 3rem 0 5rem; background: var(--soft-surface); }
.admin-list-heading { display: flex; justify-content: space-between; gap: 1rem; align-items: center; margin-bottom: 1.5rem; }
.admin-button-link { display: inline-block; text-decoration: none; }
.preview-management-list { display: grid; gap: 1rem; }
.preview-management-card { display: flex; justify-content: space-between; gap: 2rem; align-items: center; padding: 1.5rem; border-top: 5px solid var(--brand-yellow); background: #ffffff; }
.preview-management-card h2 { margin: 0.75rem 0 0.4rem; }
.preview-management-card p { margin: 0; color: var(--muted-ink); }
.preview-status-row { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.status-badge, .timing-badge { padding: 0.35rem 0.55rem; font-size: 0.7rem; font-weight: 900; text-transform: uppercase; }
.status-published, .is-upcoming { background: #b9e4b4; }
.status-draft { background: #eeeeee; }
.is-passed { color: #7a1710; background: #fee4e2; }
.preview-management-actions { display: flex; gap: 0.75rem; align-items: center; }
.preview-management-actions form { margin: 0; }
.admin-danger-button { padding: 0.95rem 1.25rem; border: 0; color: #ffffff; background: #b42318; font: inherit; font-weight: 900; cursor: pointer; }
.admin-empty-state { padding: 2rem; border-top: 5px solid var(--brand-yellow); background: #ffffff; }
.form-alert-success { border-color: #278221; color: #174d14; background: #dff4dc; }

/* Admin match management */
.admin-match-management-section {
    min-height: 500px;
    padding: 3rem 0 5rem;
    background: var(--soft-surface);
}

.admin-match-list {
    display: grid;
    gap: 1rem;
}

.admin-match-card {
    display: flex;
    justify-content: space-between;
    gap: 2rem;
    align-items: center;
    padding: 1.5rem;
    border-top: 5px solid var(--brand-yellow);
    background: #ffffff;
}

.admin-match-card-content {
    min-width: 0;
}

.admin-match-card h2 {
    margin: 1rem 0 0;
    font-size: clamp(1.3rem, 3vw, 2rem);
}

.admin-match-meta {
    margin: 0.8rem 0;
    color: var(--muted-ink);
    font-size: 0.85rem;
    font-weight: 800;
}

.admin-match-score {
    display: flex;
    gap: 1rem;
    align-items: center;
}

.admin-match-score span {
    font-size: 0.8rem;
    font-weight: 900;
}

.admin-match-score strong {
    font-size: 2rem;
}

.admin-match-penalties {
    margin: 0.35rem 0 0;
    font-size: 0.85rem;
    font-weight: 800;
}

.penalty-badge {
    padding: 0.35rem 0.55rem;
    color: var(--ink);
    background: var(--brand-yellow);
    font-size: 0.7rem;
    font-weight: 900;
    text-transform: uppercase;
}

/* Admin squad management */
.admin-player-section {
    min-height: 500px;
    padding: 3rem 0 5rem;
    background: var(--soft-surface);
}

.squad-counts {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1px;
    margin: 0 0 1.5rem;
    color: #ffffff;
    background: #444444;
}

.squad-counts div {
    padding: 1rem 1.5rem;
    background: var(--ink);
}

.squad-counts dt {
    color: var(--brand-yellow);
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.squad-counts dd {
    margin: 0.25rem 0 0;
    font-size: 1.8rem;
    font-weight: 900;
}

.admin-player-filters {
    display: grid;
    grid-template-columns: 2fr 1fr auto;
    gap: 1rem;
    align-items: end;
    margin-bottom: 1.5rem;
    padding: 1.5rem;
    border-top: 5px solid var(--brand-yellow);
    background: #ffffff;
}

.admin-player-list {
    display: grid;
    gap: 1rem;
}

.admin-player-card {
    display: grid;
    grid-template-columns: minmax(180px, 1.5fr) minmax(280px, 2fr) auto;
    gap: 1.5rem;
    align-items: center;
    padding: 1.5rem;
    border-top: 5px solid var(--brand-yellow);
    background: #ffffff;
}

.admin-player-identity h2 {
    margin: 0.65rem 0 0.25rem;
}

.admin-player-identity p {
    margin: 0;
    color: var(--muted-ink);
    word-break: break-word;
}

.status-active {
    background: #b9e4b4;
}

.status-inactive {
    color: var(--muted-ink);
    background: #eeeeee;
}

.admin-player-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 0;
}

.admin-player-stats div {
    padding: 0.5rem;
    border-left: 1px solid var(--border);
    text-align: center;
}

.admin-player-stats dt {
    color: var(--muted-ink);
    font-size: 0.68rem;
    font-weight: 900;
    text-transform: uppercase;
}

.admin-player-stats dd {
    margin: 0.25rem 0 0;
    font-size: 1.45rem;
    font-weight: 900;
}

.admin-player-actions {
    display: grid;
    gap: 0.6rem;
    min-width: 140px;
}

.admin-player-actions form,
.admin-player-actions button {
    width: 100%;
    margin: 0;
}

.admin-status-button {
    padding: 0.95rem 1.25rem;
    border: 2px solid var(--ink);
    color: var(--ink);
    background: #ffffff;
    font: inherit;
    font-weight: 900;
    cursor: pointer;
}

.admin-player-form {
    display: grid;
    gap: 1.5rem;
}

.form-checkbox {
    display: flex;
    gap: 0.65rem;
    align-items: center;
}

.form-checkbox input {
    width: 1.2rem;
    height: 1.2rem;
    accent-color: var(--brand-yellow);
}

.form-checkbox label,
.player-current-status {
    font-weight: 800;
}

.inactive-player-label {
    display: inline-block;
    margin-left: 0.4rem;
    padding: 0.2rem 0.4rem;
    color: var(--muted-ink);
    background: #eeeeee;
    font-size: 0.65rem;
    font-weight: 900;
    text-transform: uppercase;
}

/* Matchday YouTube media */
.match-video-editor {
    display: grid;
    gap: 1rem;
    padding: 1.5rem;
}

.match-video-editor-row {
    border: 1px solid var(--border);
    background: var(--soft-surface);
}

.match-video-editor-row > header {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: center;
    padding: 1rem 1.25rem;
    color: #ffffff;
    background: var(--ink);
}

.match-video-editor-row h3 {
    margin: 0;
}

.match-video-editor-row > .admin-form-grid {
    padding: 1.25rem;
}

.match-video-row-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.match-video-row-actions button {
    padding: 0.45rem 0.65rem;
    border: 1px solid #ffffff;
    color: #ffffff;
    background: transparent;
    font: inherit;
    font-size: 0.75rem;
    font-weight: 800;
    cursor: pointer;
}

.match-video-row-actions button:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

.match-media-section {
    padding: 3rem 0 4rem;
    background: var(--soft-surface);
}

.match-media-section h2 {
    margin-top: 0.35rem;
    font-size: clamp(2rem, 5vw, 3rem);
}

.match-media-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.match-media-grid-single {
    grid-template-columns: 1fr;
}

.match-video-card {
    padding: 1.25rem;
    border-top: 5px solid var(--brand-yellow);
    background: #ffffff;
}

.match-video-card h3 {
    margin: 0 0 1rem;
    font-size: 1.4rem;
}

.match-video-card figure {
    margin: 0;
}

.match-video-frame {
    overflow: hidden;
    aspect-ratio: 16 / 9;
    background: #000000;
}

.match-video-frame iframe {
    width: 100%;
    height: 100%;
    border: 0;
}

.match-video-caption {
    margin-top: 1rem;
    color: var(--muted-ink);
    line-height: 1.6;
}

.match-video-watch-link {
    display: inline-block;
    margin-top: 1rem;
    font-weight: 900;
}

/* Player performance charts */
.player-performance-section {
    padding: 3rem 0 4rem;
    background: var(--soft-surface);
}

.player-performance-heading {
    max-width: 850px;
    margin-bottom: 1.5rem;
}

.player-performance-heading h2 {
    margin: 0.35rem 0 0.75rem;
    font-size: clamp(2rem, 5vw, 3.25rem);
    letter-spacing: -0.045em;
}

.player-performance-heading p:last-child {
    color: var(--muted-ink);
    line-height: 1.6;
}

.player-chart-grid {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(260px, 1fr);
    gap: 1rem;
    margin-top: 1rem;
}

.player-chart-card {
    min-width: 0;
    border-top: 5px solid var(--brand-yellow);
    background: var(--surface);
}

.player-chart-card-wide {
    width: 100%;
}

.player-chart-header {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: flex-start;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--border);
}

.team-sheet-group { padding: 1rem 1.25rem 0; }
.team-sheet-group + .team-sheet-group { margin-top: .5rem; border-top: 1px solid var(--border); }
.team-sheet-group-heading { margin: 0 0 .65rem; color: var(--ink); font-size: .78rem; letter-spacing: .04em; text-transform: uppercase; }
.team-sheet-substitutes { padding-bottom: .25rem; background: var(--soft-surface); }
.team-sheet-group ul, .team-sheet-unattributed { margin: 0; padding: 0; list-style: none; }
.substitute-label { margin-left: .4rem; padding: .15rem .35rem; background: var(--brand-yellow); font-size: .65rem; }
.predicted-lineup-group { padding-bottom: .25rem; }

.player-chart-header h3 {
    margin: 0;
    font-size: 1.5rem;
}

.player-chart-header p {
    margin: 0.35rem 0 0;
    color: var(--muted-ink);
}

.player-chart-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 0.75rem;
    font-weight: 800;
}

.player-chart-legend li {
    display: flex;
    gap: 0.35rem;
    align-items: center;
}

.player-chart-legend span {
    display: inline-block;
    width: 1.25rem;
    height: 0.3rem;
}

.legend-total,
.legend-goals {
    background: var(--brand-yellow);
}

.legend-assists {
    border-top: 3px dashed var(--ink);
}

.player-chart-container {
    width: 100%;
    min-height: 280px;
    padding: 0.75rem;
}

.player-chart-container svg {
    display: block;
    width: 100%;
    height: auto;
    max-height: 380px;
    overflow: visible;
}

.player-chart-fallback {
    margin: 0;
    padding: 0 1.5rem 1.25rem;
    color: var(--muted-ink);
}

.player-chart-container.is-rendered + .player-chart-fallback {
    display: none;
}

.chart-grid-line {
    stroke: var(--border);
    stroke-width: 1;
}

.chart-axis-label,
.chart-axis-title {
    fill: var(--muted-ink);
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
}

.chart-axis-title {
    font-weight: 800;
}

.chart-line {
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.chart-line-total {
    stroke: var(--brand-yellow);
    stroke-width: 6;
}

.chart-line-goals {
    stroke: var(--ink);
    stroke-width: 3;
}

.chart-line-assists {
    stroke: var(--muted-ink);
    stroke-width: 3;
    stroke-dasharray: 8 6;
}

.chart-point {
    fill: var(--ink);
    stroke: var(--surface);
    stroke-width: 2;
}

.chart-point-award {
    fill: var(--brand-yellow);
    stroke: var(--ink);
}

.chart-award-marker {
    fill: var(--ink);
    font-size: 13px;
}

.chart-bar-goals {
    fill: var(--brand-yellow);
    stroke: var(--ink);
    stroke-width: 1;
}

.chart-bar-assists {
    fill: var(--ink);
}

.chart-bar-zero {
    fill: var(--border);
}

.player-chart-data-table {
    margin: 0 1.5rem 1.5rem;
}

.player-chart-data-table summary {
    font-weight: 800;
    cursor: pointer;
}

.player-chart-data-table .match-history-table-wrapper {
    margin-top: 1rem;
}

.player-chart-empty,
.player-chart-empty-inline {
    padding: 1.5rem;
    border-top: 5px solid var(--brand-yellow);
    background: var(--surface);
}

.player-chart-empty h3 {
    margin-top: 0;
}

.contribution-split-card {
    padding-bottom: 1.25rem;
}

.contribution-split {
    display: block;
    width: calc(100% - 3rem);
    height: 2.25rem;
    margin: 1.5rem;
}

.contribution-split::-webkit-meter-bar {
    border: 0;
    background: var(--ink);
}

.contribution-split::-webkit-meter-optimum-value {
    background: var(--brand-yellow);
}

.contribution-split::-moz-meter-bar {
    background: var(--brand-yellow);
}

.contribution-split-values {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    margin: 0 1.5rem;
}

.contribution-split-values div {
    padding: 1rem;
    border: 1px solid var(--border);
    text-align: center;
}

.contribution-split-values dt {
    color: var(--muted-ink);
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.contribution-split-values dd {
    margin: 0.25rem 0 0;
    font-size: 1.75rem;
    font-weight: 900;
}

@media (max-width: 700px) {
    .fixture-details { grid-template-columns: 1fr; }
    .preview-management-card { align-items: stretch; flex-direction: column; }
    .preview-management-actions { align-items: stretch; flex-direction: column; }
    .preview-management-actions > *, .preview-management-actions button { width: 100%; text-align: center; }
    .admin-list-heading { align-items: stretch; flex-direction: column; }
    .admin-list-heading > * { text-align: center; }

    .admin-match-card {
        align-items: stretch;
        flex-direction: column;
    }

    .admin-match-card > .admin-button-link {
        width: 100%;
        text-align: center;
    }

    .admin-match-score {
        flex-wrap: wrap;
    }

    .squad-counts,
    .admin-player-filters,
    .admin-player-card {
        grid-template-columns: 1fr;
    }

    .admin-player-stats div:first-child {
        border-left: 0;
    }

    .match-media-grid {
        grid-template-columns: 1fr;
    }

    .match-video-editor-row > header {
        align-items: stretch;
        flex-direction: column;
    }

    .player-chart-grid {
        grid-template-columns: 1fr;
    }

    .player-chart-header {
        flex-direction: column;
    }

    .player-chart-container {
        min-height: 220px;
        padding-inline: 0.25rem;
    }
}

/* Shared dotted marquee treatment for site heroes */
.admin-page-hero {
    padding: 3.5rem 0;
}

.admin-page-hero h1,
.news-article-header h1 {
    margin: 0.5rem 0 0.75rem;
    font-size: clamp(2.5rem, 7vw, 4.75rem);
    letter-spacing: -0.05em;
    line-height: 1;
}

.admin-page-hero .container > p:not(.section-label) {
    color: #c8c8c8;
}

:is(
    .page-hero,
    .score-hero,
    .player-profile-hero,
    .preview-hero,
    .preview-detail-hero,
    .news-article-header,
    .admin-dashboard-hero,
    .admin-page-hero,
    .bibbets-hero
) {
    position: relative;
    overflow: hidden;
    border-bottom: 0;
    color: var(--surface);
    background-color: var(--ink);
    background-image:
        radial-gradient(
            circle,
            rgba(255, 210, 48, 0.12) 0 2px,
            transparent 2.5px
        );
    background-size: 32px 32px;
}

:is(
    .page-hero,
    .score-hero,
    .player-profile-hero,
    .preview-hero,
    .preview-detail-hero,
    .news-article-header,
    .admin-dashboard-hero,
    .admin-page-hero,
    .bibbets-hero
)::after {
    position: absolute;
    z-index: 0;
    right: 0;
    bottom: 0;
    left: 0;
    height: 6px;
    background: repeating-linear-gradient(
        90deg,
        var(--brand-yellow) 0 10px,
        transparent 10px 19px
    );
    content: '';
    pointer-events: none;
}

:is(
    .page-hero,
    .score-hero,
    .player-profile-hero,
    .preview-hero,
    .preview-detail-hero,
    .news-article-header,
    .admin-dashboard-hero,
    .admin-page-hero,
    .bibbets-hero
) > .container {
    position: relative;
    z-index: 1;
}

:is(
    .page-hero,
    .player-profile-hero,
    .preview-hero,
    .preview-detail-hero,
    .news-article-header,
    .admin-dashboard-hero,
    .admin-page-hero,
    .bibbets-hero
) h1 {
    color: var(--surface);
}

:is(
    .page-hero,
    .preview-hero,
    .preview-detail-hero,
    .news-article-header,
    .admin-dashboard-hero,
    .admin-page-hero,
    .bibbets-hero
) .section-label,
.player-profile-hero .profile-eyebrow {
    color: var(--brand-yellow);
}
