/* A little more editorial polish for player and match detail pages. */
.back-link {
    margin-top: 24px;
    padding: 8px 11px;
    border: 1px solid #dfddd8;
    border-radius: 999px;
    background: rgba(255, 255, 255, .72);
    transition: border-color .18s, color .18s, background .18s;
}
.back-link:hover { border-color: rgba(227, 6, 19, .45); background: #fff; }
.suggestion-inline { margin-top: 10px; }
.suggestion-inline a {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 0 12px;
    border: 1px solid #ead8d8;
    border-radius: 999px;
    background: #fff;
    font-size: 11px;
}

.player-hero,
.match-hero {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 12px;
    background:
        radial-gradient(ellipse at 84% 115%, rgba(227, 6, 19, .28), transparent 44%),
        linear-gradient(115deg, #17181b 0%, #111214 70%, #1b1517 100%);
    box-shadow: 0 16px 38px rgba(18, 18, 21, .12);
}
.player-hero::after {
    position: absolute;
    z-index: -1;
    right: 28%;
    bottom: -125px;
    color: rgba(255, 255, 255, .035);
    content: "F";
    font: 800 300px/1 Manrope, sans-serif;
    pointer-events: none;
}
.player-hero > div:first-child { position: relative; z-index: 1; }
.player-hero h1 { max-width: 760px; overflow-wrap: anywhere; }
.player-stat-grid { position: relative; z-index: 1; gap: 8px; border: 0; background: transparent; }
.player-stat-grid div {
    min-width: 122px;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 8px;
    background: rgba(255, 255, 255, .055);
}
.player-stat-grid strong { font-variant-numeric: tabular-nums; }

.player-photo-strip {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin: -8px 0 20px;
}
.player-photo-strip figure,
.photo-grid figure {
    border: 1px solid rgba(21, 21, 24, .08);
    border-radius: 9px;
    box-shadow: 0 5px 16px rgba(18, 18, 21, .045);
    transition: transform .2s ease, box-shadow .2s ease;
}
.player-photo-strip figure:hover,
.photo-grid figure:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(18, 18, 21, .1); }
.player-photo-strip img { height: 190px; }
.player-photo-strip .legacy-player-photo { min-height: 150px; }

.detail-section { padding: 34px 0 42px; }
.detail-section + .detail-section { border-top: 1px solid rgba(21, 21, 24, .08); }
.detail-section > .section-heading { margin-bottom: 17px; }
.detail-section > .section-heading h2 { letter-spacing: -.04em; }
.detail-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
    gap: 10px;
    margin-top: 18px;
    border: 0;
    background: transparent;
}
.detail-grid div {
    min-height: 82px;
    border: 1px solid var(--line);
    border-radius: 9px;
    box-shadow: 0 3px 12px rgba(18, 18, 21, .025);
}
.detail-grid dt { margin-bottom: 8px; }
.detail-grid dd { line-height: 1.55; overflow-wrap: anywhere; }
.player-bio-grid { margin-bottom: 18px; }
.data-note { max-width: 900px; line-height: 1.65; }

.match-hero { margin-top: 22px; padding: clamp(30px, 5vw, 54px); }
.match-hero::after { right: 4%; bottom: -152px; color: rgba(227, 6, 19, .09); }
.match-hero h1 { max-width: 900px; font-size: clamp(34px, 5vw, 54px); }
.match-meta { color: #d0cdd0; }
.match-meta .eyebrow { color: #f3c4c8; }
.scoreboard { max-width: 900px; gap: clamp(14px, 3vw, 32px); }
.team-name { min-width: 0; color: #f0eff0; font-size: clamp(13px, 1.5vw, 16px); }
.team-name > span { overflow-wrap: anywhere; }
.scoreboard-logo { width: 54px; height: 54px; padding: 5px; border-radius: 9px; }
.big-score { padding: 5px 0 9px; font-size: clamp(42px, 7vw, 66px); font-variant-numeric: tabular-nums; }
.badge-row { gap: 8px; margin-top: 28px; }
.badge { border-radius: 999px; background: rgba(255, 255, 255, .07); }

.player-columns { gap: 14px; }
.player-card {
    padding: clamp(18px, 2.5vw, 28px);
    border: 1px solid #e5e3df;
    border-radius: 10px;
    box-shadow: 0 7px 22px rgba(18, 18, 21, .035);
}
.player-card h3 { display: flex; align-items: center; gap: 10px; margin-bottom: 18px; }
.player-card h3::before { width: 4px; height: 22px; border-radius: 3px; background: var(--red); content: ""; }
.player-card h4 { margin-top: 22px; }
.opponent-card h3::before { background: #28282c; }
.lineup-status { border-radius: 0 7px 7px 0; }
.match-pitch { min-height: 350px; border-radius: 12px; }
.match-pitch-player { padding: 6px 11px; font-size: 11px; }

.match-story {
    padding: clamp(18px, 3vw, 30px);
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 7px 22px rgba(18, 18, 21, .03);
}
.match-story p { max-width: 880px; font-size: 14px; line-height: 1.85; }
.match-story h3 { margin-bottom: 12px; font: 800 18px/1.3 Manrope, sans-serif; }
.photo-grid { gap: 14px; }
.photo-grid img { border-radius: 8px 8px 0 0; }
.stats-table { overflow: hidden; border: 1px solid var(--line); border-radius: 9px; background: #fff; }
.stats-table-head { background: #f0efec; }

.player-results .results-heading,
.teammate-grid { position: relative; }
.teammate-card { border: 1px solid var(--line); border-radius: 8px; background: #fff; transition: border-color .18s, transform .18s, box-shadow .18s; }
.teammate-card:hover { border-color: rgba(227, 6, 19, .38); box-shadow: 0 8px 22px rgba(18, 18, 21, .06); transform: translateY(-2px); }

@media (max-width: 900px) {
    .player-photo-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .match-hero { padding: 34px 28px; }
}
@media (max-width: 680px) {
    .back-link { margin-top: 18px; }
    .player-hero,
    .match-hero { border-radius: 10px; box-shadow: 0 10px 25px rgba(18, 18, 21, .1); }
    .player-hero { padding: 26px 21px; }
    .player-hero::after { right: -5%; bottom: -110px; font-size: 250px; }
    .player-stat-grid { width: 100%; }
    .player-stat-grid div { flex: 1; min-width: 0; padding: 12px; }
    .player-photo-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
    .player-photo-strip img { height: 145px; }
    .player-photo-strip .legacy-player-photo { min-height: 125px; }
    .detail-section { padding: 25px 0 31px; }
    .detail-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
    .detail-grid div { min-height: 74px; padding: 13px; border-radius: 8px; }
    .match-hero { padding: 29px 19px; }
    .match-hero h1 { font-size: clamp(29px, 8vw, 37px); }
    .scoreboard { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 7px; }
    .team-name { flex-direction: column; gap: 5px; font-size: 10px; text-align: center; }
    .team-name:last-child { justify-content: center; text-align: center; }
    .scoreboard-logo { width: 39px; height: 39px; }
    .big-score { font-size: clamp(31px, 9vw, 42px); }
    .match-pitch { min-height: 310px; padding-inline: 8px; }
    .match-pitch-player { padding: 5px 8px; font-size: 9px; }
    .match-story p { font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) {
    .player-photo-strip figure,
    .photo-grid figure,
    .teammate-card { transition: none; }
}