/* ==========================================================================
   match.php — the modern skin (1 Oct 2026)
   --------------------------------------------------------------------------
   Printed by mb_open_match_shell() in match.php, after the theme stylesheet,
   and scoped to .benfica-layout.mm-page so it never reaches another page.

   Hands off, on purpose (Bruno's earlier calls):
     - the match hero (themes/default/components/hero.php .mh-themed),
     - the Tactical Formation pitch + Show Substitutions toggle (#match-tactical),
     - the Opening Squads rows, event icons and team tabs (#match-lineups).
   Nothing below selects inside those three.

   Same vocabulary as this week's redesigns (transfers.php .trf-tile,
   honours/record book): borderless cards, soft shadows, tinted icon chips,
   count-up numbers via bn-motion.js. Colours are theme tokens only.
   ========================================================================== */

.benfica-layout.mm-page {
    --mm-our: var(--theme-primary);
    --mm-our-rgb: var(--theme-primary-rgb);
    --mm-opp: color-mix(in oklab, var(--theme-ink-muted) 80%, var(--theme-ink));
    --mm-card-bg: var(--theme-surface);
    --mm-row-bg: var(--theme-surface-2);
    --mm-row-hover: color-mix(in oklab, var(--theme-primary) 5%, var(--theme-surface-2));
    --mm-soft-shadow: var(--elev-2);
    --mm-lift-shadow: var(--elev-3);
    --mm-radius: var(--theme-radius, 1rem);
}
/* Dark: the same neutral surface the sidebar panels use (.bn-panel → --bs-tertiary-bg),
   so the main column and the aside read as one set of cards. */
[data-bs-theme="dark"] .benfica-layout.mm-page {
    --mm-card-bg: var(--bs-tertiary-bg, var(--theme-surface-2));
    --mm-row-bg: color-mix(in oklab, var(--theme-ink) 7%, var(--mm-card-bg));
    --mm-row-hover: color-mix(in oklab, var(--theme-ink) 11%, var(--mm-card-bg));
}

/* ---- Shared: empty state ------------------------------------------------ */
.benfica-layout.mm-page .mm-empty {
    display: flex; align-items: center; gap: .7rem;
    padding: .8rem 1rem; border-radius: var(--mm-radius);
    background: var(--mm-card-bg); box-shadow: var(--mm-soft-shadow);
    color: var(--theme-ink-muted); font-size: .86rem; font-weight: 600;
}
.benfica-layout.mm-page .mm-empty-ico {
    flex: 0 0 auto; width: 2.2rem; height: 2.2rem; border-radius: .75rem;
    display: inline-flex; align-items: center; justify-content: center;
    background: rgba(var(--theme-accent-rgb), .16); color: var(--theme-accent-700, var(--theme-accent));
}
[data-bs-theme="dark"] .benfica-layout.mm-page .mm-empty-ico { color: var(--theme-accent); }

/* ---- Status banner (postponed / abandoned / awarded / walkover) ---------
   The Bootstrap alert becomes a soft tinted card with an icon chip. The
   wording still comes from bnMatchStatusNotice() alone. */
.benfica-layout.mm-page .bn-match-status-banner {
    border: 0; border-radius: var(--mm-radius); padding: .75rem 1rem;
    box-shadow: var(--mm-soft-shadow); font-size: .9rem;
}
.benfica-layout.mm-page .bn-match-status-banner > i {
    flex: 0 0 auto; width: 2.2rem; height: 2.2rem; border-radius: .75rem;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 1rem; background: color-mix(in oklab, currentColor 12%, transparent);
}

/* ---- Notices inside the tabs (login required, no votes yet, …) ----------- */
.benfica-layout.mm-page #match-tab-panel .alert {
    border: 0; border-radius: .9rem; box-shadow: none;
    border-left: 3px solid currentColor; font-size: .88rem;
}

/* ---- Goal Scorers -------------------------------------------------------
   Still no box around the section (Bruno, 27 Sep: "remove the wrap"); each
   team column gets a clean head with its count, every goal a soft row with
   the minute as a pill on the right. The phone team tabs are untouched. */
.benfica-layout.mm-page #match-goal-scorers .mm-gs-head {
    display: flex; align-items: center; gap: .5rem;
    margin: 0 0 .5rem; padding: .15rem .1rem .45rem;
    border-bottom: 1px solid var(--theme-border);
    font-size: .9rem; font-weight: 800; color: var(--theme-ink);
}
.benfica-layout.mm-page #match-goal-scorers .mm-gs-dot {
    flex: 0 0 auto; width: .6rem; height: .6rem; border-radius: 50%; background: var(--mm-opp);
}
.benfica-layout.mm-page #match-goal-scorers .mm-gs-dot--our {
    background: linear-gradient(135deg, var(--theme-gradient-start, var(--theme-primary)), var(--theme-gradient-end, var(--theme-primary)));
}
.benfica-layout.mm-page #match-goal-scorers .mm-gs-name { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.benfica-layout.mm-page #match-goal-scorers .mm-gs-count {
    flex: 0 0 auto; min-width: 1.6rem; height: 1.6rem; padding: 0 .4rem; border-radius: .5rem;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: .85rem; font-weight: 900; font-variant-numeric: tabular-nums;
    background: rgba(var(--theme-success-rgb), .14); color: var(--theme-success-strong, var(--theme-success));
}
.benfica-layout.mm-page #match-goal-scorers .mm-gs-count.is-zero { background: var(--mm-row-bg); color: var(--theme-ink-faint); }
[data-bs-theme="dark"] .benfica-layout.mm-page #match-goal-scorers .mm-gs-count:not(.is-zero) { color: color-mix(in oklab, var(--theme-success) 70%, var(--theme-ink)); }

.benfica-layout.mm-page #match-goal-scorers .player-goal-list { display: grid; gap: .35rem; }
.benfica-layout.mm-page #match-goal-scorers .player-goal-list > li {
    display: flex; align-items: center; gap: .5rem; margin: 0 !important;
    padding: .4rem .55rem; border-radius: .75rem;
    background: var(--mm-row-bg); font-size: .9rem; font-weight: 600;
    transition: background-color var(--dur-base, .24s) ease;
}
.benfica-layout.mm-page #match-goal-scorers .player-goal-list > li:hover { background: var(--mm-row-hover); }
.benfica-layout.mm-page #match-goal-scorers .player-goal-list > li > .player-face-bubble { margin-right: 0 !important; flex: 0 0 auto; }
.benfica-layout.mm-page #match-goal-scorers .player-goal-list > li > span:not(.player-face-bubble):not(.mm-goal-min) { min-width: 0; }
.benfica-layout.mm-page #match-goal-scorers .player-goal-list a { color: var(--theme-ink); }
.benfica-layout.mm-page #match-goal-scorers .player-goal-list a:hover { color: var(--theme-link); }
.benfica-layout.mm-page #match-goal-scorers .player-goal-list .badge { font-size: .62rem; border-radius: .25rem; vertical-align: .1em; }
.benfica-layout.mm-page #match-goal-scorers .mm-goal-min {
    margin-left: auto; flex: 0 0 auto;
    display: inline-flex; align-items: center; gap: .3rem;
    padding: .15rem .5rem; border-radius: 999px;
    font-size: .78rem; font-weight: 800; font-variant-numeric: tabular-nums;
    background: var(--mm-card-bg); color: var(--theme-ink-muted);
    box-shadow: var(--elev-1);
}
.benfica-layout.mm-page #match-goal-scorers .mm-goal-min::before {
    content: "\f1e3"; font-family: "Font Awesome 7 Free", "Font Awesome 6 Free"; font-weight: 900;
    font-size: .72rem; color: var(--theme-success);
}
.benfica-layout.mm-page #match-goal-scorers .player-goal-list > li.mm-gs-none {
    background: transparent; color: var(--theme-ink-faint); font-weight: 600; font-size: .84rem; padding-left: .2rem;
}
.benfica-layout.mm-page #match-goal-scorers .player-goal-list > li.mm-gs-none:hover { background: transparent; }

/* ---- Statistics ---------------------------------------------------------
   The dual bars keep their markup, script and count-up; the card loses its
   border, the rows breathe, the leader chip reads at a glance. */
.benfica-layout.mm-page #match-statistics .card { border: 0; box-shadow: var(--mm-soft-shadow); background: var(--mm-card-bg); }
.benfica-layout.mm-page #match-statistics .mss-stats-bars { padding: 1rem 1.1rem .8rem; }
.benfica-layout.mm-page #match-statistics .mss-stats-teams { font-size: .9rem; margin-bottom: .9rem; }
.benfica-layout.mm-page #match-statistics .mss-team-dot { width: .7rem; height: .7rem; }
.benfica-layout.mm-page #match-statistics .mss-pos { margin-bottom: 1.1rem; }
.benfica-layout.mm-page #match-statistics .mss-pos-track { height: 1.9rem; background: var(--mm-row-bg); }
.benfica-layout.mm-page #match-statistics .mss-pos-track .mss-pos-fill b { font-size: .82rem; }
.benfica-layout.mm-page #match-statistics .mss-pos-label { margin-top: .4rem; }
.benfica-layout.mm-page #match-statistics .mss-stat-row {
    gap: .7rem; margin: 0; padding: .42rem .4rem; border-radius: .7rem;
    transition: background-color var(--dur-base, .24s) ease;
}
.benfica-layout.mm-page #match-statistics .mss-stat-row:hover { background: var(--mm-row-bg); }
.benfica-layout.mm-page #match-statistics .mss-stat-value { min-width: 2.6rem; padding: .18rem .45rem; border-radius: .5rem; font-size: .84rem; }
.benfica-layout.mm-page #match-statistics .mss-stat-value:not(.mss-lead) { background: var(--mm-row-bg); }
/* The leader's chip keeps its team colour in both modes (the section's own dark rule
   came later in the cascade and greyed it out). */
.benfica-layout.mm-page #match-statistics .mss-stat-value.mss-lead { color: var(--theme-on-primary, #fff); background: linear-gradient(135deg, var(--theme-gradient-start, var(--theme-primary)), var(--theme-gradient-end, var(--theme-primary))); }
.benfica-layout.mm-page #match-statistics .mss-stat-value.mss-lead.mss-lead-opp { background: color-mix(in oklab, var(--theme-ink) 62%, var(--theme-draw)); }
[data-bs-theme="dark"] .benfica-layout.mm-page #match-statistics .mss-stat-value.mss-lead.mss-lead-opp { background: color-mix(in oklab, var(--theme-ink-faint) 75%, var(--theme-canvas)); }
.benfica-layout.mm-page #match-statistics .mss-stat-label { font-size: .68rem; color: var(--theme-ink-muted); }
.benfica-layout.mm-page #match-statistics .mss-stat-bar { height: .5rem; background: var(--mm-row-bg); }
.benfica-layout.mm-page #match-statistics .mss-stat-row:hover .mss-stat-bar { background: var(--mm-card-bg); }
@media (max-width: 575.98px) {
    .benfica-layout.mm-page #match-statistics .mss-stats-bars { padding: .8rem .6rem .6rem; }
    .benfica-layout.mm-page #match-statistics .mss-stat-row { gap: .4rem; padding: .36rem .15rem; }
    .benfica-layout.mm-page #match-statistics .mss-stat-value { min-width: 2.2rem; font-size: .78rem; }
}

/* ---- Tiles (Head-to-Head) ------------------------------------------------
   transfers.php's .trf-tile idiom: --c is an "r,g,b" triplet from the tokens. */
.benfica-layout.mm-page .mm-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; padding: .1rem 0 .25rem; }
@media (max-width: 1199.98px) { .benfica-layout.mm-page .mm-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.benfica-layout.mm-page .mm-tile {
    --c: var(--theme-primary-rgb);
    position: relative; min-width: 0; display: flex; align-items: center; gap: .75rem;
    padding: .85rem .95rem; border-radius: var(--mm-radius); overflow: hidden;
    background: radial-gradient(120% 120% at 0% 0%, rgba(var(--c), .10), transparent 60%), var(--mm-card-bg);
    box-shadow: var(--mm-soft-shadow);
    transition: transform var(--dur-base, .24s) ease, box-shadow var(--dur-base, .24s) ease;
}
@media (hover: hover) { .benfica-layout.mm-page .mm-tile:hover { transform: translateY(-3px); box-shadow: var(--mm-lift-shadow); } }
[data-bs-theme="dark"] .benfica-layout.mm-page .mm-tile { background: radial-gradient(120% 120% at 0% 0%, rgba(var(--c), .18), transparent 60%), var(--mm-card-bg); }
.benfica-layout.mm-page .mm-tile--neutral { --c: var(--theme-draw-rgb); }
.benfica-layout.mm-page .mm-tile--neutral .mm-tile-num { color: var(--theme-ink); }
.benfica-layout.mm-page .mm-tile--neutral .mm-tile-ico { color: var(--theme-ink-muted); background: rgba(var(--c), .35); }
.benfica-layout.mm-page .mm-tile--win { --c: var(--theme-success-rgb); }
.benfica-layout.mm-page .mm-tile--goals { --c: var(--theme-accent-rgb); }
.benfica-layout.mm-page .mm-tile--form { --c: var(--theme-info-rgb); }
.benfica-layout.mm-page .mm-tile--form .mm-tile-ico { color: var(--theme-info-strong, rgb(var(--c))); }
[data-bs-theme="dark"] .benfica-layout.mm-page .mm-tile--form .mm-tile-ico { color: rgb(var(--c)); }
.benfica-layout.mm-page .mm-tile-ico {
    flex: 0 0 auto; width: 2.6rem; height: 2.6rem; border-radius: .8rem;
    display: inline-flex; align-items: center; justify-content: center;
    background: rgba(var(--c), .14); color: rgb(var(--c)); font-size: 1.05rem;
}
.benfica-layout.mm-page .mm-tile-body { min-width: 0; flex: 1 1 auto; display: flex; flex-direction: column; }
.benfica-layout.mm-page .mm-tile-num {
    font-size: 1.6rem; font-weight: 900; line-height: 1; color: rgb(var(--c));
    font-variant-numeric: tabular-nums; white-space: nowrap;
}
.benfica-layout.mm-page .mm-tile--goals .mm-tile-num { color: var(--theme-ink); }
.benfica-layout.mm-page .mm-tile-num small { font-size: .62em; font-weight: 800; color: var(--theme-ink-muted); margin-left: .1rem; }
.benfica-layout.mm-page .mm-tile-lbl {
    font-size: .7rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em;
    color: var(--theme-ink-muted); margin-top: .3rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.benfica-layout.mm-page .mm-wdl { display: inline-flex; align-items: baseline; gap: .12rem; }
.benfica-layout.mm-page .mm-wdl i { font-style: normal; font-size: .7em; color: var(--theme-ink-faint); }
.benfica-layout.mm-page .mm-wdl .mm-w { color: var(--theme-success); }
.benfica-layout.mm-page .mm-wdl .mm-d { color: var(--theme-ink-muted); }
.benfica-layout.mm-page .mm-wdl .mm-l { color: var(--theme-danger); }
.benfica-layout.mm-page .mm-split {
    display: flex; gap: 2px; height: 6px; margin-top: .45rem; border-radius: 99px; overflow: hidden;
    background: var(--mm-row-bg);
}
.benfica-layout.mm-page .mm-split i { display: block; height: 100%; min-width: 0; transition: width 1s cubic-bezier(.22, 1, .36, 1); }
.benfica-layout.mm-page .mm-split-w { background: var(--theme-success); }
.benfica-layout.mm-page .mm-split-d { background: var(--theme-draw); }
.benfica-layout.mm-page .mm-split-l { background: var(--theme-danger); }
/* The last-five chips: squared letters, as everywhere on the site. */
.benfica-layout.mm-page .mm-h2h-form { display: flex; align-items: center; gap: .25rem; min-height: 1.6rem; }
.benfica-layout.mm-page .mm-h2h-form .badge {
    width: 1.5rem; height: 1.5rem; padding: 0; border-radius: .25rem;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: .72rem; font-weight: 800; transition: transform var(--dur-fast, .12s) ease;
}
.benfica-layout.mm-page .mm-h2h-form .badge:hover { transform: translateY(-2px); }
.benfica-layout.mm-page .mm-h2h-form .badge.bg-secondary { background: var(--theme-draw) !important; color: var(--theme-draw-ink, var(--theme-ink)) !important; }
.benfica-layout.mm-page .mm-h2h-form .badge.border-warning { box-shadow: 0 0 0 2px var(--theme-accent); border: 0 !important; }
/* Phones: Played + Goals side by side, then the record and the last five full width. */
@media (max-width: 575.98px) {
    .benfica-layout.mm-page .mm-tile--neutral { order: 1; }
    .benfica-layout.mm-page .mm-tile--goals { order: 2; }
    .benfica-layout.mm-page .mm-tile--win { order: 3; grid-column: 1 / -1; }
    .benfica-layout.mm-page .mm-tile--form { order: 4; grid-column: 1 / -1; }
}
@media (max-width: 380px) {
    .benfica-layout.mm-page .mm-tiles { gap: .5rem; }
    .benfica-layout.mm-page .mm-tile { padding: .7rem .65rem; gap: .5rem; }
    .benfica-layout.mm-page .mm-tile-ico { width: 2.1rem; height: 2.1rem; border-radius: .65rem; font-size: .9rem; }
    .benfica-layout.mm-page .mm-tile-num { font-size: 1.3rem; }
    .benfica-layout.mm-page .mm-h2h-form .badge { width: 1.3rem; height: 1.3rem; font-size: .66rem; }
}

/* ---- Match Facts / Build-Up ------------------------------------------------
   includes/match_facts_functions.php owns the cards; here they lose the
   hairline border for a soft shadow, with a rounder icon chip. */
.benfica-layout.mm-page :is(#match-facts, #match-buildup) .mf-grid,
.benfica-layout.mm-page :is(#match-facts, #match-buildup) .mf-wrap { gap: .6rem; }
.benfica-layout.mm-page :is(#match-facts, #match-buildup) .mf-card {
    border: 0; border-radius: .9rem; padding: .6rem .8rem .6rem .9rem;
    background: var(--mm-card-bg); box-shadow: var(--mm-soft-shadow);
}
.benfica-layout.mm-page :is(#match-facts, #match-buildup) .mf-card.mf-lead {
    background: linear-gradient(100deg, color-mix(in oklab, var(--mf-tone, var(--theme-ink-faint)) 13%, var(--mm-card-bg)) 0%, var(--mm-card-bg) 70%);
}
@media (hover: hover) {
    .benfica-layout.mm-page :is(#match-facts, #match-buildup) .mf-card:hover { transform: translateY(-2px); box-shadow: var(--mm-lift-shadow); }
}
.benfica-layout.mm-page :is(#match-facts, #match-buildup) .mf-chip { width: 2rem; height: 2rem; border-radius: .65rem; font-size: .85rem; }
.benfica-layout.mm-page :is(#match-facts, #match-buildup) .mf-body { font-size: .85rem; }
.benfica-layout.mm-page :is(#match-facts, #match-buildup) .mf-lead .mf-body { font-size: .95rem; }

/* ---- Fan Attendance --------------------------------------------------------- */
.benfica-layout.mm-page #match-attendance-wall .card { border: 0; box-shadow: var(--mm-soft-shadow); background: var(--mm-card-bg); }
.benfica-layout.mm-page #match-attendance-wall .card-body > p.text-muted:only-child {
    display: flex; align-items: center; gap: .7rem; font-size: .86rem !important; font-weight: 600;
}
.benfica-layout.mm-page #match-attendance-wall .card-body > p.text-muted:only-child > i {
    flex: 0 0 auto; width: 2.2rem; height: 2.2rem; margin: 0 !important; border-radius: .75rem;
    display: inline-flex; align-items: center; justify-content: center;
    background: rgba(var(--theme-accent-rgb), .16); color: var(--theme-accent-700, var(--theme-accent));
}
[data-bs-theme="dark"] .benfica-layout.mm-page #match-attendance-wall .card-body > p.text-muted:only-child > i { color: var(--theme-accent); }

/* ---- Report, news, other plain section cards ------------------------------ */
.benfica-layout.mm-page :is(#match-report, #match-news, #match-shootout) > .card { border: 0; box-shadow: var(--mm-soft-shadow); background: var(--mm-card-bg); }
.benfica-layout.mm-page #match-report .match-report { font-size: .98rem; line-height: 1.7; }
.benfica-layout.mm-page #match-report .match-report img { border-radius: .8rem; }

/* ---- Commentary: the events timeline ----------------------------------------
   The renderer in match.php (initLiveTab) is untouched; this turns its rows
   into a rail: one line through the minute column, a pill per minute, the
   arrow reduced to a connector, and borderless cards with an edge in the
   event's colour (read from the minute badge's theme class via :has()). */
.benfica-layout.mm-page #public-live-center-root .public-live-timeline { position: relative; gap: .6rem; }
.benfica-layout.mm-page #public-live-center-root .public-live-timeline:not(:empty)::before {
    content: ""; position: absolute; top: .6rem; bottom: .6rem; left: 28px; width: 2px; border-radius: 2px;
    background: linear-gradient(180deg, var(--theme-border-strong), var(--theme-border) 85%, transparent);
    z-index: 0;
}
.benfica-layout.mm-page #public-live-center-root .public-live-item-row { grid-template-columns: 58px 14px minmax(0, 1fr); gap: .3rem; }
.benfica-layout.mm-page #public-live-center-root .public-live-minute-col { position: relative; z-index: 1; gap: .3rem; }
.benfica-layout.mm-page #public-live-center-root .public-live-minute-badge {
    min-width: 46px; padding: .3rem .45rem; border: 0 !important; border-radius: 999px;
    font-size: .74rem; font-weight: 800; font-variant-numeric: tabular-nums;
    box-shadow: 0 0 0 3px var(--mm-card-bg);
}
.benfica-layout.mm-page #public-live-center-root .public-live-minute-col > span:last-child {
    width: 30px; height: 30px; border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--mm-card-bg); box-shadow: 0 0 0 3px var(--mm-card-bg), var(--elev-1);
}
.benfica-layout.mm-page #public-live-center-root .public-live-minute-col > span:last-child .public-live-event-team-chip img { width: 22px; height: 22px; object-fit: contain; }
.benfica-layout.mm-page #public-live-center-root .public-live-minute-col > span.public-live-minute-icon { font-size: 1rem; min-height: 30px; }
.benfica-layout.mm-page #public-live-center-root .public-live-feed-arrow { width: 14px; height: 2px; margin-top: .85rem; opacity: .55; border-radius: 2px; }
.benfica-layout.mm-page #public-live-center-root .public-live-feed-arrow::after { display: none; }

.benfica-layout.mm-page #public-live-center-root .public-live-event-card {
    --ev: var(--theme-ink-faint);
    position: relative; overflow: hidden;
    border: 0; border-radius: .9rem; padding: .6rem .8rem .6rem .95rem;
    background: var(--mm-card-bg); box-shadow: var(--mm-soft-shadow);
    transition: transform var(--dur-base, .24s) ease, box-shadow var(--dur-base, .24s) ease;
}
.benfica-layout.mm-page #public-live-center-root .public-live-event-card::before {
    content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--ev);
}
@media (hover: hover) {
    .benfica-layout.mm-page #public-live-center-root .public-live-event-card:hover { transform: translateX(2px); box-shadow: var(--mm-lift-shadow); }
}
.benfica-layout.mm-page #public-live-center-root .public-live-event-card .event-title-theme-default { font-size: .72rem; font-weight: 800; letter-spacing: .06em; }
.benfica-layout.mm-page #public-live-center-root .public-live-event-card .text-muted.small { color: var(--theme-ink) !important; font-size: .86rem; margin-top: .15rem; }

/* Event colours for the card edge and tint. */
.benfica-layout.mm-page #public-live-center-root .public-live-item-row:has(.minute-theme-goal) .public-live-event-card {
    --ev: var(--theme-success);
    background: linear-gradient(100deg, color-mix(in oklab, var(--theme-success) 10%, var(--mm-card-bg)) 0%, var(--mm-card-bg) 65%);
}
.benfica-layout.mm-page #public-live-center-root .public-live-item-row:has(.minute-theme-goal) .public-live-event-card .text-muted.small { font-weight: 700; }
.benfica-layout.mm-page #public-live-center-root .public-live-item-row:has(:is(.minute-theme-yellow_card, .minute-theme-double_yellow)) .public-live-event-card { --ev: var(--theme-warning); }
.benfica-layout.mm-page #public-live-center-root .public-live-item-row:has(.minute-theme-red_card) .public-live-event-card {
    --ev: var(--theme-danger);
    background: linear-gradient(100deg, color-mix(in oklab, var(--theme-danger) 8%, var(--mm-card-bg)) 0%, var(--mm-card-bg) 65%);
}
.benfica-layout.mm-page #public-live-center-root .public-live-item-row:has(.minute-theme-substitution_in) .public-live-event-card { --ev: var(--theme-info); }
.benfica-layout.mm-page #public-live-center-root .public-live-item-row:has(.minute-theme-assist) .public-live-event-card { --ev: var(--theme-primary); }
.benfica-layout.mm-page #public-live-center-root .public-live-item-row:has(:is(.minute-theme-penalty_missed, .minute-theme-penalty_save)) .public-live-event-card { --ev: var(--theme-ink-muted); }
/* Kick-off, half-time, full time: quiet silver milestones, not more red under the hero. */
.benfica-layout.mm-page #public-live-center-root .public-live-timeline-item.public-live-system-event .public-live-event-card {
    --ev: var(--theme-ink-faint);
    border: 0; background: linear-gradient(100deg, rgba(var(--theme-draw-rgb), .38) 0%, var(--mm-card-bg) 75%);
}
.benfica-layout.mm-page #public-live-center-root .public-live-timeline-item.public-live-system-event .event-title-theme-system { color: var(--theme-ink); }
.benfica-layout.mm-page #public-live-center-root .public-live-timeline-item.public-live-system-event .text-muted.small { font-weight: 700; }

/* Minute pills: the theme tints made opaque (mixed into the card colour), so the
   rail never shows through them. */
.benfica-layout.mm-page #public-live-center-root .public-live-minute-badge { --mt: var(--theme-ink-muted); background: color-mix(in oklab, var(--mt) 16%, var(--mm-card-bg)) !important; color: color-mix(in oklab, var(--mt) 80%, var(--theme-ink)) !important; }
.benfica-layout.mm-page #public-live-center-root .public-live-minute-badge.minute-theme-goal { --mt: var(--theme-success); }
.benfica-layout.mm-page #public-live-center-root .public-live-minute-badge.minute-theme-assist { --mt: var(--theme-primary); }
.benfica-layout.mm-page #public-live-center-root .public-live-minute-badge:is(.minute-theme-yellow_card, .minute-theme-double_yellow) { --mt: var(--theme-warning); }
.benfica-layout.mm-page #public-live-center-root .public-live-minute-badge.minute-theme-red_card { --mt: var(--theme-danger); }
.benfica-layout.mm-page #public-live-center-root .public-live-minute-badge.minute-theme-substitution_in { --mt: var(--theme-info); }
.benfica-layout.mm-page #public-live-center-root .public-live-minute-badge.minute-theme-system { --mt: var(--theme-ink); }
[data-bs-theme="dark"] .benfica-layout.mm-page #public-live-center-root .public-live-minute-badge { background: color-mix(in oklab, var(--mt) 26%, var(--mm-card-bg)) !important; color: color-mix(in oklab, var(--mt) 55%, var(--theme-ink)) !important; }

/* The newest event (the feed is newest first) gets a soft entrance. */
@keyframes mmEvIn { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
.benfica-layout.mm-page #public-live-center-root .public-live-timeline-item:first-child .public-live-event-card { animation: mmEvIn .45s var(--ease-out, ease) both; }

/* Panels above the feed: alerts, filters, replay. */
.benfica-layout.mm-page #public-live-center-root .public-live-reminder-panel,
.benfica-layout.mm-page #public-live-center-root .public-live-replay {
    border: 0; border-radius: .9rem; padding: .6rem .8rem !important; box-shadow: var(--mm-soft-shadow);
}
.benfica-layout.mm-page #public-live-center-root .public-live-reminder-panel { background: linear-gradient(100deg, rgba(var(--theme-warning-rgb), .14), var(--mm-card-bg) 75%); }
.benfica-layout.mm-page #public-live-center-root .public-live-replay { background: linear-gradient(100deg, rgba(var(--theme-primary-rgb), .08), var(--mm-card-bg) 75%); }
.benfica-layout.mm-page #public-live-center-root .public-live-filter-bar .form-select { border-radius: 999px; background-color: var(--mm-row-bg); border-color: transparent; font-weight: 600; }
.benfica-layout.mm-page #public-live-center-root .public-live-filter-bar .btn,
.benfica-layout.mm-page #public-live-center-root .public-live-replay .btn,
.benfica-layout.mm-page #public-live-center-root .public-live-reminder-panel .btn { border-radius: 999px; font-weight: 700; }

@media (max-width: 575.98px) {
    .benfica-layout.mm-page #public-live-center-root .public-live-item-row { grid-template-columns: 50px 8px minmax(0, 1fr); gap: .25rem; }
    .benfica-layout.mm-page #public-live-center-root .public-live-timeline:not(:empty)::before { left: 24px; }
    .benfica-layout.mm-page #public-live-center-root .public-live-minute-badge { min-width: 42px; font-size: .7rem; padding: .26rem .35rem; }
    .benfica-layout.mm-page #public-live-center-root .public-live-feed-arrow { width: 8px; }
    .benfica-layout.mm-page #public-live-center-root .public-live-event-card { padding: .5rem .65rem .5rem .8rem; }
}

/* ---- Sidebar: Match Info + Match Stats ------------------------------------
   The facts' icons become small tinted chips (the transfers sidebar look);
   the comparison bars use the same team colours as the Statistics section:
   club red for us, slate for the opponent. */
.benfica-layout.mm-page .bn-aside .mi-info-panel .bn-facts { gap: .45rem; }
.benfica-layout.mm-page .bn-aside .mi-info-panel .mm-fi {
    flex: 0 0 auto; width: 1.7rem; height: 1.7rem; border-radius: .55rem;
    display: inline-flex; align-items: center; justify-content: center; font-size: .8rem;
    background: rgba(var(--theme-accent-rgb), .14); color: var(--theme-accent);
}
.benfica-layout.mm-page .bn-aside .bn-vs-bar { height: 8px; gap: 2px; background: transparent; }
.benfica-layout.mm-page .bn-aside .bn-vs-bar > span { border-radius: 99px; }
.benfica-layout.mm-page .bn-aside .bn-vs-bar .bn-vs-a { background: linear-gradient(90deg, var(--theme-gradient-start, var(--theme-primary)), var(--theme-gradient-end, var(--theme-primary))); }
.benfica-layout.mm-page .bn-aside .bn-vs-bar .bn-vs-b { background: var(--mm-opp); opacity: .55; }

/* Stadium + Referee panels (includes/matchday_sidebar_functions.php, shared with the
   matchday hub, inline-styled): on this page only, their bordered figure boxes become
   soft tiles. Matched on the inline border they carry, so nothing else is reached. */
.benfica-layout.mm-page .bn-aside .bn-panel .d-flex.flex-wrap[style*="gap:2px"] { gap: .4rem !important; margin: .25rem 0 0 !important; }
.benfica-layout.mm-page .bn-aside .bn-panel .d-flex.flex-wrap > .flex-fill[style*="border:1px solid"] {
    border: 0 !important; border-radius: .75rem !important; padding: .5rem .4rem !important;
    background: var(--mm-row-bg);
}
.benfica-layout.mm-page .bn-aside .bn-panel .d-flex.flex-wrap > .flex-fill[style*="border:1px solid"] .fw-bold { font-weight: 900 !important; font-variant-numeric: tabular-nums; }
.benfica-layout.mm-page .bn-aside .bn-panel .d-flex.flex-wrap > .flex-fill[style*="border:1px solid"] .text-uppercase { font-size: .66rem !important; font-weight: 800; }

@media (prefers-reduced-motion: reduce) {
    .benfica-layout.mm-page .mm-tile,
    .benfica-layout.mm-page .mm-split i,
    .benfica-layout.mm-page #public-live-center-root .public-live-event-card { transition: none !important; animation: none !important; }
}

/* Goal Scorers: on desktop the team switch is hidden, so its wrapper and the extra top
   padding left a gap twice the size of every other section's (Bruno, 1 Oct 2026). */
@media (min-width: 768px) {
    .benfica-layout.mm-page #match-goal-scorers .card-body > .px-2.pt-2 { display: none; }
    .benfica-layout.mm-page #match-goal-scorers .card-body { padding-top: 0 !important; }
    .benfica-layout.mm-page #match-goal-scorers .mss-pane { padding-top: 0 !important; }
}

/* ---- Opening Squads & Match Events (#match-lineups) ------------------------
   The CONTAINER only (owner's request, 1 Oct 2026). The rows are exactly as they
   were: same players, order, shirt numbers, names, captain marks, stars, event icons
   and minutes, unused subs dimmed as before. No team-colour cards, no dashed boxes
   (both rejected 27 Sep). Each team is one soft neutral card like the rest of the
   page; heads read like the Goal Scorers heads (team dot + formation pill); a hovered
   row gets the same soft fill as a goal row. Phone team tabs and the ≥768px two
   columns are untouched. */
@media (min-width: 768px) {
    .benfica-layout.mm-page #match-lineups .mss-panes { --bs-gutter-x: 1rem; }
}
/* The card is drawn by an inner box so the Bootstrap gutter stays a gutter. */
.benfica-layout.mm-page #match-lineups .mss-panes > .mss-pane {
    position: relative; padding-top: .9rem; padding-bottom: .8rem;
}
.benfica-layout.mm-page #match-lineups .mss-panes > .mss-pane::after {
    content: ""; position: absolute; z-index: 0; pointer-events: none;
    top: 0; bottom: 0; left: calc(var(--bs-gutter-x, 1rem) * .5); right: calc(var(--bs-gutter-x, 1rem) * .5);
    border-radius: var(--mm-radius); background: var(--mm-card-bg); box-shadow: var(--mm-soft-shadow);
}
.benfica-layout.mm-page #match-lineups .mss-panes > .mss-pane > * { position: relative; z-index: 1; margin-left: .8rem !important; margin-right: .8rem !important; }

/* Heads: XI head = team dot + name + formation pill; bench/manager heads quieter. */
.benfica-layout.mm-page #match-lineups .mss-squad-head {
    border-bottom: 1px solid var(--theme-border) !important;
    padding-bottom: .45rem !important; margin-bottom: .45rem !important;
    font-size: .9rem; font-weight: 800 !important; color: var(--theme-ink);
}
.benfica-layout.mm-page #match-lineups .mss-squad-head .fw-semibold { font-weight: 800 !important; }
.benfica-layout.mm-page #match-lineups .mss-pane > .mss-squad-head:first-child > div:first-child { display: inline-flex; align-items: center; gap: .5rem; min-width: 0; }
.benfica-layout.mm-page #match-lineups .mss-pane > .mss-squad-head:first-child > div:first-child > i { display: none; }
.benfica-layout.mm-page #match-lineups .mss-pane > .mss-squad-head:first-child > div:first-child::before {
    content: ""; flex: 0 0 auto; width: .6rem; height: .6rem; border-radius: 50%; background: var(--mm-opp);
}
.benfica-layout.mm-page #match-lineups .mss-pane[data-team="our"] > .mss-squad-head:first-child > div:first-child::before {
    background: linear-gradient(135deg, var(--theme-gradient-start, var(--theme-primary)), var(--theme-gradient-end, var(--theme-primary)));
}
.benfica-layout.mm-page #match-lineups .mss-squad-head .badge.text-bg-secondary {
    border-radius: 999px; padding: .28em .7em; font-weight: 800; letter-spacing: .02em;
    background: var(--mm-row-bg) !important; color: var(--theme-ink) !important;
}
.benfica-layout.mm-page #match-lineups :is(.mss-pane-subs, .mss-pane-mgr) { margin-top: .9rem !important; }
.benfica-layout.mm-page #match-lineups :is(.mss-pane-subs, .mss-pane-mgr) > .mss-squad-head {
    font-size: .78rem; font-weight: 800; letter-spacing: .02em; color: var(--theme-ink-muted);
}
.benfica-layout.mm-page #match-lineups :is(.mss-pane-subs, .mss-pane-mgr) > .mss-squad-head .fw-semibold { color: var(--theme-ink-muted); }
.benfica-layout.mm-page #match-lineups :is(.mss-pane-subs, .mss-pane-mgr) > .mss-squad-head > i { color: var(--theme-accent); }
.benfica-layout.mm-page #match-lineups .mss-pane > .mss-pane-mgr:first-child { margin-top: 0 !important; }

/* Rows: unchanged content; a soft fill on hover, like the goal rows above. */
.benfica-layout.mm-page #match-lineups .player-list { display: grid; gap: 1px; }
.benfica-layout.mm-page #match-lineups .player-item,
.benfica-layout.mm-page #match-lineups .mss-pane-mgr > p {
    margin: 0 -.45rem !important; padding: .22rem .45rem; border-radius: .6rem;
    transition: background-color var(--dur-base, .24s) ease;
}
.benfica-layout.mm-page #match-lineups .player-item:hover,
.benfica-layout.mm-page #match-lineups .mss-pane-mgr > p:hover { background: var(--mm-row-bg); }
.benfica-layout.mm-page #match-lineups .mss-pane > p.text-muted,
.benfica-layout.mm-page #match-lineups .player-list > p.text-muted { font-size: .86rem; color: var(--theme-ink-faint) !important; }

/* Empty line-ups: one calm line (markup from match.php), same as the goals one. */
.benfica-layout.mm-page #match-lineups .mm-lu-note { margin-bottom: .9rem; }
.benfica-layout.mm-page #match-lineups .mm-lu-pane-note { box-shadow: none; padding: .55rem .2rem; background: transparent; }
@media (max-width: 767.98px) {
    .benfica-layout.mm-page #match-lineups .mss-team-tabs { margin-bottom: .6rem; }
}

/* Opening Squads cards: flush with the section edges (like the tabs and heads above)
   and exactly 1rem apart (Bruno, 1 Oct 2026). The cards were drawn half a gutter in
   from each column, so they sat 8px inside the section on both sides. */
.benfica-layout.mm-page #match-lineups .card-body { padding-left: 0 !important; padding-right: 0 !important; }
.benfica-layout.mm-page #match-lineups .mss-panes { margin-left: 0; margin-right: 0; }
.benfica-layout.mm-page #match-lineups .mss-panes > .mss-pane { padding-left: 0; padding-right: 0; }
.benfica-layout.mm-page #match-lineups .mss-panes > .mss-pane::after { left: 0; right: 0; }
@media (min-width: 768px) {
    .benfica-layout.mm-page #match-lineups .mss-panes > .mss-pane:first-child { padding-right: .5rem; }
    .benfica-layout.mm-page #match-lineups .mss-panes > .mss-pane:first-child::after { right: .5rem; }
    .benfica-layout.mm-page #match-lineups .mss-panes > .mss-pane:last-child { padding-left: .5rem; }
    .benfica-layout.mm-page #match-lineups .mss-panes > .mss-pane:last-child::after { left: .5rem; }
}

/* Statistics: the rows sat 1.5rem in from the card edge (1.1rem + the row's own .4rem);
   every other card keeps its content .8rem in. Same .8rem here on wider screens, the
   row keeping its .4rem so the hover fill still has room (Bruno, 1 Oct 2026). */
@media (min-width: 576px) {
    .benfica-layout.mm-page #match-statistics .mss-stats-bars { padding-left: .4rem; padding-right: .4rem; }
    .benfica-layout.mm-page #match-statistics :is(.mss-stats-teams, .mss-pos) { padding-left: .4rem !important; padding-right: .4rem !important; }
}

/* Goal Scorers: each team in the same soft card as Opening Squads below (flush with the
   section edges, 1rem apart, content .8rem in), so the section reads like the rest
   (Bruno, 1 Oct 2026). Upcoming/empty states keep their own .mm-empty card. */
.benfica-layout.mm-page #match-goal-scorers .mss-panes { margin: 0 !important; --bs-gutter-x: 1rem; }
.benfica-layout.mm-page #match-goal-scorers .mss-panes > .mss-pane {
    position: relative; margin-top: 0 !important; padding: .9rem 0 .8rem !important;
}
.benfica-layout.mm-page #match-goal-scorers .mss-panes > .mss-pane::after {
    content: ""; position: absolute; z-index: 0; pointer-events: none; top: 0; bottom: 0; left: 0; right: 0;
    border-radius: var(--mm-radius); background: var(--mm-card-bg); box-shadow: var(--mm-soft-shadow);
}
.benfica-layout.mm-page #match-goal-scorers .mss-panes > .mss-pane > * { position: relative; z-index: 1; margin-left: .8rem !important; margin-right: .8rem !important; }
@media (min-width: 768px) {
    .benfica-layout.mm-page #match-goal-scorers .mss-panes > .mss-pane:first-child { padding-right: .5rem !important; }
    .benfica-layout.mm-page #match-goal-scorers .mss-panes > .mss-pane:first-child::after { right: .5rem; }
    .benfica-layout.mm-page #match-goal-scorers .mss-panes > .mss-pane:last-child { padding-left: .5rem !important; }
    .benfica-layout.mm-page #match-goal-scorers .mss-panes > .mss-pane:last-child::after { left: .5rem; }
}
.benfica-layout.mm-page #match-goal-scorers .card-body { padding-left: 0 !important; padding-right: 0 !important; }
.benfica-layout.mm-page #match-goal-scorers .card-body > .px-2.pt-2 { padding-left: 0 !important; padding-right: 0 !important; }
.benfica-layout.mm-page #match-lineups .card-body { padding-top: 0 !important; }
/* The outer .card clips (overflow:hidden): with the team cards flush to its edges their
   shadows were cut off on the outer sides, top and bottom. Let them show. */
.benfica-layout.mm-page :is(#match-goal-scorers, #match-lineups) > .card { overflow: visible; background: transparent; border: 0; box-shadow: none; }

/* Statistics, compact (Bruno, 1 Oct 2026): rows ~28px instead of ~39px, a slimmer
   possession bar and tighter spacing around the team names. */
.benfica-layout.mm-page #match-statistics .mss-stats-bars { padding-top: .75rem !important; padding-bottom: .55rem !important; }
.benfica-layout.mm-page #match-statistics .mss-stats-teams { margin-bottom: .55rem; }
.benfica-layout.mm-page #match-statistics .mss-pos { margin-bottom: .6rem; }
.benfica-layout.mm-page #match-statistics .mss-pos-track { height: 1.45rem; }
.benfica-layout.mm-page #match-statistics .mss-pos-label { margin-top: .25rem; }
.benfica-layout.mm-page #match-statistics .mss-stat-row { padding-top: .2rem !important; padding-bottom: .2rem !important; }
.benfica-layout.mm-page #match-statistics .mss-stat-value { padding-top: .08rem; padding-bottom: .08rem; }
.benfica-layout.mm-page #match-statistics .mss-stat-bar { height: .42rem; }

/* Head-to-Head, compact (Bruno, 1 Oct 2026): shorter tiles, smaller chips and figures. */
.benfica-layout.mm-page .mm-tiles--h2h { gap: .55rem; padding: 0; }
.benfica-layout.mm-page .mm-tiles--h2h .mm-tile { padding: .55rem .75rem; gap: .6rem; }
.benfica-layout.mm-page .mm-tiles--h2h .mm-tile-ico { width: 2.1rem; height: 2.1rem; border-radius: .65rem; font-size: .9rem; }
.benfica-layout.mm-page .mm-tiles--h2h .mm-tile-num { font-size: 1.3rem; }
.benfica-layout.mm-page .mm-tiles--h2h .mm-tile-lbl { font-size: .64rem; margin-top: .18rem; }
.benfica-layout.mm-page .mm-tiles--h2h .mm-split { height: 5px; margin-top: .3rem; }
.benfica-layout.mm-page .mm-tiles--h2h .mm-h2h-form { min-height: 1.3rem; gap: .2rem; }
.benfica-layout.mm-page .mm-tiles--h2h .mm-h2h-form .badge { width: 1.3rem; height: 1.3rem; font-size: .66rem; }

/* No shadows on the match page's sections (Bruno, 1 Oct 2026): cards, team cards,
   facts, head-to-head tiles (hover lift too) and the sidebar panels. The tab strip and
   the pitch drawing keep theirs. */
.benfica-layout.mm-page { --mm-soft-shadow: none; --mm-lift-shadow: none; }
.benfica-layout.mm-page :is(.bn-section .card, .bn-panel, .mf-card, .mm-tile, .mm-empty),
.benfica-layout.mm-page .mm-tile:hover,
.benfica-layout.mm-page :is(#match-goal-scorers, #match-lineups) .mss-panes > .mss-pane::after { box-shadow: none !important; }
.benfica-layout.mm-page #match-tactical .card { box-shadow: none !important; }

/* Section cards wear the sidebar panels' border instead of a shadow (Bruno, 1 Oct 2026):
   the same 1px line and radius as .bn-panel (style.css), lighter line in dark mode. */
.benfica-layout.mm-page { --mm-panel-border: 1px solid rgba(0, 0, 0, .07); --mm-panel-radius: var(--theme-radius-lg, 1.1rem); }
[data-bs-theme="dark"] .benfica-layout.mm-page { --mm-panel-border: 1px solid rgba(255, 255, 255, .08); }
.benfica-layout.mm-page :is(#match-statistics .card, #match-attendance-wall .card, #match-tactical > .card, .mf-card, .mm-tile, .mm-empty),
.benfica-layout.mm-page :is(#match-goal-scorers, #match-lineups) .mss-panes > .mss-pane::after {
    border: var(--mm-panel-border) !important; border-radius: var(--mm-panel-radius) !important;
}

/* Cards as on the forum, the site's normal (Bruno, 1 Oct 2026): the .bn-panel border
   above AND the theme's soft drop shadow, like the player, manager and club pages.
   Overrides the shadow-free pass above. */
.benfica-layout.mm-page { --mm-soft-shadow: var(--theme-shadow, 0 10px 30px rgba(0, 0, 0, .06)); --mm-lift-shadow: var(--theme-shadow, 0 10px 30px rgba(0, 0, 0, .06)); }
.benfica-layout.mm-page :is(#match-statistics .card, #match-attendance-wall .card, #match-tactical > .card, .bn-panel, .mf-card, .mm-tile, .mm-tile:hover, .mm-empty),
.benfica-layout.mm-page :is(#match-goal-scorers, #match-lineups) .mss-panes > .mss-pane::after {
    box-shadow: var(--theme-shadow, 0 10px 30px rgba(0, 0, 0, .06)) !important;
}

/* Goal Scorers on phones: the team switch sat 28px under the heading (the card's 4px and
   its wrapper's 8px on top); now 16px like every other section (Bruno, 2 Oct 2026). */
.benfica-layout.mm-page #match-goal-scorers .card-body { padding-top: 0 !important; }
.benfica-layout.mm-page #match-goal-scorers .card-body > .px-2.pt-2 { padding-top: 0 !important; }

/* ---- Hero top row on phones (the owner, 4 Oct 2026) --------------------------
   The competition and the matchday read as ONE two-line block, its logo as tall as
   the two lines, and the action buttons sit on its right instead of a centred row
   of their own. Only when the competition has a logo; otherwise style.css's
   centred layout stays. The first pill (the competition link) becomes
   display: contents so its logo and name are grid items of the block; its text
   is still inside the link, so the name stays clickable. */
@media (max-width: 575.98px) {
    .hero-match .hero-match-top:has(.hero-comp-logo) {
        flex-wrap: nowrap;
        justify-content: space-between;
        align-items: center;
        column-gap: 10px;
    }
    .hero-match .hero-match-comp:has(.hero-comp-logo) {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        grid-template-rows: auto auto;
        column-gap: 8px; row-gap: 1px;
        align-items: center;
        flex: 1 1 auto; min-width: 0;
        padding: 5px 12px 5px 6px;
        border-radius: 14px;
        background: rgba(255, 255, 255, 0.15);
        border: 1px solid rgba(var(--benfica-gold-rgb), 0.35);
        color: #fff;
        font-size: .8rem; font-weight: 700; line-height: 1.15;
    }
    .hero-header.mh-themed .hero-match .hero-match-comp:has(.hero-comp-logo) {
        background: rgba(255, 255, 255, 0.12);
        border-color: rgba(255, 255, 255, 0.22);
        -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
    }
    .hero-match .hero-match-comp:has(.hero-comp-logo) > a.hero-match-pill { display: contents; color: #fff; }
    .hero-match .hero-match-comp:has(.hero-comp-logo) .hero-comp-logo {
        grid-column: 1; grid-row: 1 / span 2;
        width: 1.85rem !important; height: 1.85rem !important;
        margin: 0 !important;
        border-radius: 6px;
    }
    .hero-match .hero-match-comp:has(.hero-comp-logo) > span.hero-match-pill {
        grid-column: 2; grid-row: 2;
        display: block;
        padding: 0; border: 0; border-radius: 0; background: none;
        font-size: .7rem; font-weight: 600; opacity: .85;
    }
    .hero-match .hero-match-comp:has(.hero-comp-logo) > span.hero-match-pill > i { display: none; }
    .hero-match .hero-match-top:has(.hero-comp-logo) .hero-match-actions {
        flex: 0 0 auto;
        justify-content: flex-end;
    }
}
/* More compact (the owner, 4 Oct 2026), and the matchday line without a pill: the themed
   hero gives every .hero-match-pill a background and border at higher specificity. */
@media (max-width: 575.98px) {
    .hero-match .hero-match-top:has(.hero-comp-logo) { margin-bottom: 8px; column-gap: 8px; }
    .hero-match .hero-match-comp:has(.hero-comp-logo) {
        padding: 3px 10px 3px 4px; column-gap: 7px; row-gap: 0;
        border-radius: 11px;
        font-size: .76rem; line-height: 1.1;
    }
    .hero-match .hero-match-comp:has(.hero-comp-logo) .hero-comp-logo {
        width: 1.6rem !important; height: 1.6rem !important; border-radius: 5px;
    }
    .hero-header .hero-match .hero-match-comp:has(.hero-comp-logo) > span.hero-match-pill,
    .hero-header.mh-themed .hero-match .hero-match-comp:has(.hero-comp-logo) > span.hero-match-pill {
        background: none !important; border: 0 !important;
        -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
        padding: 0 !important; border-radius: 0;
        font-size: .66rem; line-height: 1.1;
        transition: none; /* the pill's .2s background fade would flash on load */
    }
}
/* The box is only as wide as its text, and the buttons always sit at the far right
   (the owner, 4 Oct 2026). It may still shrink (and wrap the name) on a narrow phone. */
@media (max-width: 575.98px) {
    .hero-match .hero-match-comp:has(.hero-comp-logo) { flex: 0 1 auto; width: auto; }
    .hero-match .hero-match-top:has(.hero-comp-logo) .hero-match-actions { margin-left: auto !important; }
}


/* matchday.php: the match's links as one compact pill bar, the look of the other pages' link
   bars (white pill, hairline border, soft shadow, red icons). Scrolls sideways when it runs out
   of room; the Follow star is gold when on. Keeps .btn / .follow-btn for follow-buttons.js. */
.benfica-layout .md-linkbar {
    display: flex; flex-wrap: nowrap; align-items: center; gap: .15rem;
    margin: 0 0 1rem; padding: .3rem;
    border: 1px solid rgba(0, 0, 0, .07); border-radius: 999px;
    background: var(--bs-body-bg); box-shadow: var(--theme-shadow, 0 10px 30px rgba(0, 0, 0, .06));
    overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none;
}
[data-bs-theme="dark"] .benfica-layout .md-linkbar { background: var(--bs-tertiary-bg, #1e1e1e); border-color: rgba(255, 255, 255, .08); }
.benfica-layout .md-linkbar::-webkit-scrollbar { display: none; }
.benfica-layout .md-linkbar > .btn {
    flex: 0 0 auto; display: inline-flex; align-items: center; gap: .4rem;
    padding: .38rem .8rem !important; margin: 0 !important;
    border: 0 !important; border-radius: 999px !important;
    background: transparent !important; color: var(--theme-ink, var(--bs-body-color)) !important;
    font-size: .82rem !important; font-weight: 700; line-height: 1.2; white-space: nowrap; box-shadow: none !important;
}
.benfica-layout .md-linkbar > .btn i { margin: 0 !important; color: var(--theme-primary-ink, var(--theme-primary, #C8102E)); font-size: .85em; }
.benfica-layout .md-linkbar > .btn:hover { background: var(--theme-surface-2, rgba(0, 0, 0, .04)) !important; }
.benfica-layout .md-linkbar > .follow-btn i { color: var(--slb-gold, #F4B223); }
.benfica-layout .md-linkbar > .follow-btn.btn-warning { background: var(--slb-gold, #F4B223) !important; color: #1b1b1b !important; }
.benfica-layout .md-linkbar > .follow-btn.btn-warning i { color: #1b1b1b; }
@media (max-width: 575.98px) {
    .benfica-layout .md-linkbar { padding: .25rem; }
    .benfica-layout .md-linkbar > .btn { padding: .32rem .65rem !important; font-size: .78rem !important; }
}