.bwf-detail-page .match-title[data-bwf-match]:focus-visible { outline: 3px solid var(--main-color); outline-offset: -3px; }
.bwf-detail-page .match-title[data-bwf-match]:hover { background: #fff; }
.bwf-match-open-icon { flex: 0 0 28px; display: grid; place-items: center; height: 28px; border-radius: 8px; background: #fff; color: var(--main-color); }
.bwf-match-open-icon i { color: inherit; margin: 0; }
#bwf-match-dialog { --bwf-home: var(--main-color, #036444); --bwf-away: var(--main-highlight-color, #ed4408); --bwf-viewport-height: 100vh; --bwf-safe-top: max(24px, calc(env(safe-area-inset-top, 0px) + 12px)); --bwf-safe-bottom: max(24px, calc(env(safe-area-inset-bottom, 0px) + 12px)); box-sizing: border-box; position: fixed; top: var(--bwf-safe-top); bottom: var(--bwf-safe-bottom); width: min(720px, calc(100% - 24px)); max-width: none; max-height: calc(var(--bwf-viewport-height) - var(--bwf-safe-top) - var(--bwf-safe-bottom)); margin: auto; padding: 0; border: 0; border-radius: 20px; background: #fff; color: #203c33; box-shadow: 0 24px 80px #001d2466; overflow: hidden; }
@supports (height: 100dvh) { #bwf-match-dialog { --bwf-viewport-height: 100dvh; } }
#bwf-match-dialog[open] { display: flex; flex-direction: column; }
#bwf-match-dialog::backdrop { background: #071d20a6; }
#bwf-match-dialog * { box-sizing: border-box; }
#bwf-match-dialog button { margin: 0; box-shadow: none; transform: none; transition: none; letter-spacing: normal; font: inherit; cursor: pointer; }
#bwf-match-dialog button:focus-visible, #bwf-match-dialog a:focus-visible { outline: 2px solid var(--bwf-away); outline-offset: -2px; }
.bwf-match-dialog-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-shrink: 0; padding: 10px 16px 10px 22px; border-bottom: 1px solid #e3ece7; }
.bwf-match-dialog-header h2 { margin: 0; font-size: 18px; color: var(--bwf-home); }
#bwf-match-dialog [data-bwf-close] { flex: 0 0 44px; width: 44px; height: 44px; padding: 0; border-radius: 50%; background: #f0f6f2; color: var(--bwf-home); }
#bwf-match-dialog [data-bwf-close] i { margin: 0; color: inherit; font-size: 21px; }
#bwf-match-content { overflow-y: auto; overscroll-behavior: contain; min-height: 0; flex: 1 1 auto; }
.bwf-match-overview { padding: 22px 24px; background: linear-gradient(145deg, #edf7f0, #fff 70%, #fff3eb); }
.bwf-match-context { margin: 0; text-align: center; color: var(--bwf-home); font-size: 26px; line-height: 1.3; font-weight: 700; overflow-wrap: anywhere; }
.bwf-match-date { margin-top: 8px; text-align: center; font-size: 16px; color: #607169; }
.bwf-match-state { display: inline-block; padding: 5px 10px; border-radius: 20px; background: #deede2; color: var(--bwf-home); font-size: 12px; font-weight: 700; }
.bwf-match-state.is-live { background: #ffebe4; color: #ba3400; }
.bwf-match-versus { display: grid; grid-template-columns: minmax(0, 1fr) 150px minmax(0, 1fr); align-items: center; gap: 14px; margin-top: 24px; }
.bwf-match-team { display: grid; gap: 20px; min-width: 0; text-align: center; }
.bwf-match-player { min-width: 0; font-weight: 700; font-size: 15px; line-height: 1.4; overflow-wrap: anywhere; }
.bwf-match-portrait { position: relative; width: 128px; max-width: 100%; margin: 0 auto 10px; }
.bwf-match-avatar { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 50%; border: 3px solid var(--bwf-home); background: #fff; }
.bwf-match-team.is-winner .bwf-match-avatar { border-color: var(--bwf-away); }
.bwf-match-flag { position: absolute; left: -2px; bottom: -2px; width: 40px; height: 40px; border: 3px solid #fff; border-radius: 50%; object-fit: cover; background: #fff; box-shadow: 0 1px 4px #173b2d26; }
.bwf-match-player a { color: #173b2d; text-decoration: none; }
.bwf-match-player a:hover { text-decoration: underline; }
.bwf-match-serving { color: var(--bwf-away); padding-left: 4px; }
.bwf-match-center { min-width: 0; text-align: center; }
.bwf-match-event { font-size: 18px; font-weight: 700; line-height: 1.3; overflow-wrap: anywhere; }
.bwf-match-duration { margin-top: 8px; color: #53665e; font-size: 20px; font-weight: 600; font-variant-numeric: tabular-nums; }
.bwf-match-duration i { margin: 0; color: inherit; }
.bwf-match-games b span:first-child { color: var(--bwf-home); }
.bwf-match-games b span:last-child { color: var(--bwf-away); }
.bwf-match-games em { color: #9ba9a1; font-style: normal; font-weight: 400; }
.bwf-match-games { display: grid; gap: 8px; margin-top: 14px; }
.bwf-match-games > div { padding: 6px 8px; border: 1px solid #deebe2; border-radius: 10px; background: #ffffffc7; }
.bwf-match-games small { display: block; margin-bottom: 2px; color: #67766f; font-size: 11px; }
.bwf-match-games b { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 8px; font-size: 32px; line-height: 1.15; font-variant-numeric: tabular-nums; }
.bwf-match-statistics { padding: 0 24px 22px; }
.bwf-match-stat-row { padding: 12px 0; }
.bwf-match-stat-label { text-align: center; margin-bottom: 9px; color: #607169; font-size: 12px; }
.bwf-match-stat-values { display: grid; grid-template-columns: 36px minmax(0, 1fr) 36px; align-items: center; gap: 10px; }
.bwf-match-stat-values b { text-align: center; font-size: 16px; font-variant-numeric: tabular-nums; }
.bwf-match-stat-values b:first-child { color: var(--bwf-home); }
.bwf-match-stat-values b:last-child { color: var(--bwf-away); }
.bwf-match-stat-bar { height: 8px; overflow: hidden; border-radius: 20px; background: var(--bwf-away); }
.bwf-match-stat-bar span { display: block; height: 100%; background: var(--bwf-home); }
.bwf-match-stat-bar.is-empty, .bwf-match-stat-bar.is-empty span { background: #e3ebe6; }
.bwf-match-note, .bwf-match-empty { padding: 12px; margin: 0; text-align: center; color: #62736a; font-size: 13px; line-height: 1.6; }
.bwf-match-dialog-footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 18px; border-top: 1px solid #e3ece7; flex-shrink: 0; }
#bwf-match-dialog [data-bwf-reload], #bwf-match-dialog [data-bwf-retry] { padding: 8px 10px; border-radius: 8px; color: var(--bwf-home); background: #edf5ef; font-size: 12px; white-space: nowrap; }
#bwf-match-dialog [data-bwf-reload] i { color: inherit; margin: 0; }
#bwf-match-dialog button:disabled { opacity: .55; cursor: wait; }
.bwf-match-feedback { padding: 40px 22px; text-align: center; color: #617269; }
.bwf-match-feedback p { margin: 12px 0; }
@media (max-width: 480px) {
    #bwf-match-dialog { max-height: min(calc(var(--bwf-viewport-height) * .84), calc(var(--bwf-viewport-height) - var(--bwf-safe-top) - var(--bwf-safe-bottom))); border-radius: 16px; }
    .bwf-match-dialog-header { padding: 7px 10px 7px 14px; }
    .bwf-match-dialog-header h2 { font-size: 16px; }
    .bwf-match-overview { padding: 16px 12px; }
    .bwf-match-context { font-size: 22px; }
    .bwf-match-date { font-size: 15px; }
    .bwf-match-versus { grid-template-columns: minmax(0, 1fr) 100px minmax(0, 1fr); gap: 7px; margin-top: 20px; }
    .bwf-match-team { gap: 18px; }
    .bwf-match-portrait { width: 92px; }
    .bwf-match-avatar { border-width: 2px; }
    .bwf-match-flag { width: 32px; height: 32px; border-width: 2px; }
    .bwf-match-player { font-size: 12px; }
    .bwf-match-event { font-size: 15px; }
    .bwf-match-duration { font-size: 18px; }
    .bwf-match-games > div { padding: 5px; }
    .bwf-match-games b { font-size: 26px; gap: 4px; }
    .bwf-match-statistics { padding: 0 12px 16px; }
    .bwf-match-stat-values { gap: 5px; grid-template-columns: 30px minmax(0, 1fr) 30px; }
    .bwf-match-dialog-footer { padding: 8px 12px; }
}

.bwf-match-stats-title { margin: 0 0 12px; padding: 12px; border-radius: 10px; background: var(--bwf-home); color: #fff; text-align: center; font-size: 14px; line-height: 1.4; }