.match-statistics {
  --ms-text: #141413;
  --ms-muted: #8a8984;
  --ms-border: #e7e5df;
  --ms-panel: #f4f4f1;
  --ms-win: #22c55e;
  --ms-win-soft: #dcfce7;
  --ms-draw: #94a3b8;
  --ms-draw-soft: #edf0f4;
  --ms-loss: #ef4444;
  --ms-loss-soft: #fee2e2;
  --ms-blue: #2a78d6;
  --ms-orange: #eb6834;
  color: var(--ms-text);
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  margin-top: 34px;
  max-width: 100%;
  min-width: 0;
  width: 100%;
}
.match-statistics *, .match-statistics *::before, .match-statistics *::after { box-sizing: border-box; }
.match-statistics__section { margin: 0 0 38px; min-width: 0; }
.match-statistics__title { color: var(--ms-text); font-size: 24px; font-weight: 800; letter-spacing: -.025em; line-height: 1.25; margin: 0 0 18px; }
.match-statistics__card { border: 1px solid var(--ms-border); border-radius: 14px; overflow: hidden; padding: 24px; }
.match-statistics__intro { border-bottom: 1px solid #eceae5; color: var(--ms-muted); font-size: 14px; font-weight: 600; line-height: 1.5; margin: 0 0 20px; padding: 0 0 17px; }
.ms-team-block { min-width: 0; }
.ms-team-head { align-items: center; display: flex; gap: 16px; justify-content: space-between; margin-bottom: 16px; }
.ms-team-identity { align-items: center; display: flex; gap: 11px; min-width: 0; }
.ms-team-identity > strong { color: var(--ms-text); font-size: 18px; font-weight: 800; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ms-team-logo { align-items: center; background: #f1f4f8; border: 1px solid rgba(20,20,19,.07); border-radius: 50%; color: #28435f; display: inline-flex; flex: 0 0 42px; height: 42px; justify-content: center; overflow: hidden; }
.ms-team-logo img { display: block; height: 100%; object-fit: contain; width: 100%; }
.ms-team-logo b { font-size: 12px; font-weight: 800; }
.ms-team-logo--row { flex-basis: 22px; height: 22px; margin: 0 6px; }
.ms-team-logo--row b { font-size: 8px; }
.ms-team-logo--large { flex-basis: 64px; height: 64px; }
.ms-team-logo--large b { font-size: 18px; }
.ms-form-dots { display: inline-flex; flex: 0 0 auto; gap: 5px; }
.ms-form-dots i, .ms-result-legend i, .ms-average i { background: var(--ms-draw); border-radius: 50%; display: inline-block; height: 9px; width: 9px; }
.ms-form-dots i.is-win, .ms-result-legend i.is-win, .ms-average i.is-win { background: var(--ms-win); }
.ms-form-dots i.is-loss, .ms-result-legend i.is-loss, .ms-average i.is-loss { background: var(--ms-loss); }
.ms-segmented { background: #f1f2f4; border-radius: 12px; display: flex; flex: 0 0 auto; padding: 4px; }
.ms-segmented button, .ms-total-tabs button { background: transparent; border: 0; border-radius: 9px; color: #9aa0a9; font: inherit; font-size: 13px; font-weight: 750; min-height: 36px; padding: 8px 15px; transition: background-color .2s ease, box-shadow .2s ease, color .2s ease, transform .2s ease; }
.ms-segmented button:hover, .ms-total-tabs button:hover { color: #16a34a; transform: translateY(-1px); }
.ms-segmented button.is-active, .ms-total-tabs button.is-active { background: #fff; box-shadow: 0 3px 12px rgba(15,23,42,.08); color: #16a34a; }
.ms-match-list { border-top: 1px solid #eceff2; }
.ms-match-row { align-items: center; border-bottom: 1px solid #eceff2; display: grid; gap: 12px; grid-template-columns: minmax(115px, 132px) minmax(100px, 135px) minmax(0, 1fr); min-height: 56px; padding: 8px 8px; position: relative; transition: background-color .18s ease, transform .18s ease; }
.ms-match-row:hover { background: #f6f6f3; }
.ms-match-list--h2h .ms-match-row { grid-template-columns: minmax(115px, 132px) minmax(100px, 135px) minmax(0, 1fr) 50px; }
.ms-match-row__toggle { background: transparent; border: 0; bottom: 0; cursor: default; display: none; left: 0; padding: 0; position: absolute; right: 0; top: 0; width: 100%; z-index: 1; }
.ms-match-row__date { align-items: center; display: flex; gap: 10px; white-space: nowrap; }
.ms-match-row__date > i { background: var(--ms-draw); border-radius: 50%; flex: 0 0 8px; height: 8px; }
.ms-match-row.is-win .ms-match-row__date > i { background: var(--ms-win); }
.ms-match-row.is-loss .ms-match-row__date > i { background: var(--ms-loss); }
.ms-match-row__date span { display: flex; gap: 5px; min-width: 0; }
.ms-match-row__date b { color: #4c5564; font-size: 13px; font-weight: 750; }
.ms-match-row__date em { color: #b0b7c2; font-size: 13px; font-style: normal; font-weight: 650; }
.ms-match-row__competition { color: #a5adb8; cursor: help; font-size: 12px; font-weight: 650; overflow: hidden; position: relative; text-overflow: ellipsis; white-space: nowrap; z-index: 2; }
.ms-match-row__teams { align-items: center; display: grid; gap: 8px; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); min-width: 0; }
.ms-row-team { align-items: center; color: #525b68; display: flex; font-size: 13px; font-weight: 600; min-width: 0; }
.ms-row-team > span:not(.ms-team-logo), .ms-row-team > strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ms-row-team > strong { color: #1d2430; font-weight: 800; }
.ms-row-team--home { justify-content: flex-end; text-align: right; }
.ms-row-team--away { justify-content: flex-start; text-align: left; }
.ms-score { background: var(--ms-draw-soft); border-radius: 9px; color: #64748b; cursor: help; font-size: 13px; font-weight: 800; min-width: 54px; padding: 7px 8px; text-align: center; white-space: nowrap; }
.ms-score small { font-size: 9px; font-weight: 800; margin-left: 2px; }
.ms-score.is-win { background: var(--ms-win-soft); color: #16a34a; }
.ms-score.is-loss { background: var(--ms-loss-soft); color: #dc2626; }
.ms-row-total { background: var(--ms-draw-soft); border-radius: 8px; color: #64748b; font-size: 12px; font-weight: 800; padding: 7px 5px; text-align: center; transition: background-color .2s ease, color .2s ease; }
.ms-row-total.is-over { background: #dbeafe; color: #2563eb; }
.ms-row-total.is-under { background: #edf0f4; color: #64748b; }
.ms-match-row__details { color: #8590a0; display: none; font-size: 11px; grid-column: 1 / -1; line-height: 1.45; padding: 2px 8px 7px; }
.ms-empty { color: var(--ms-muted); font-size: 13px; padding: 18px 8px; text-align: center; }
.ms-load-more { align-items: center; background: #f4f5f7; border: 0; border-radius: 10px; color: #5c6470; display: flex; font: inherit; font-size: 12px; font-weight: 800; justify-content: center; letter-spacing: .12em; margin: 12px 0 18px; min-height: 43px; text-transform: uppercase; transition: background-color .2s ease, color .2s ease, transform .2s ease; width: 100%; }
.ms-load-more span { align-items: center; background: #e7e9ed; border-radius: 50%; display: inline-flex; height: 23px; justify-content: center; letter-spacing: 0; margin-left: 8px; width: 23px; }
.ms-load-more:hover { background: #eceef1; color: #252b35; transform: translateY(-1px); }
.ms-team-metrics { align-items: stretch; background: var(--ms-panel); border-radius: 13px; display: grid; gap: 18px; grid-template-columns: 1.15fr 1fr .8fr; margin-top: 18px; padding: 20px; }
.ms-result-summary { align-items: center; display: flex; gap: 14px; min-width: 0; }
.ms-donut { align-items: center; border-radius: 50%; display: flex; flex: 0 0 74px; height: 74px; justify-content: center; position: relative; transition: background .35s ease; }
.ms-donut::after { background: var(--ms-panel); border-radius: 50%; content: ""; height: 48px; position: absolute; width: 48px; }
.ms-donut span { color: #384152; font-size: 18px; font-weight: 800; position: relative; z-index: 1; }
.ms-result-legend { display: grid; gap: 7px; }
.ms-result-legend span, .ms-average span { align-items: center; color: #4f5866; display: flex; font-size: 12px; font-weight: 650; gap: 7px; }
.ms-result-legend b { color: #8b94a1; margin-left: auto; }
.ms-average, .ms-team-form { display: flex; flex-direction: column; justify-content: center; min-width: 0; }
.ms-average h4, .ms-team-form h4 { color: #939aa4; font-size: 12px; font-weight: 750; line-height: 1.35; margin: 0 0 10px; }
.ms-average span + span { margin-top: 7px; }
.ms-average b { color: #28303c; margin-left: auto; }
.ms-team-form strong { color: #16a34a; font-size: 26px; font-weight: 800; line-height: 1; }
.ms-team-form strong small { color: #aab1bb; font-size: 13px; }
.ms-team-form > div { background: #e2e5e9; border-radius: 6px; height: 6px; margin-top: 12px; overflow: hidden; }
.ms-team-form > div i { background: var(--ms-win); border-radius: inherit; display: block; height: 100%; transition: width .35s ease; }
.ms-team-divider { border-top: 1px solid #eceae5; margin: 28px 0; }
.ms-h2h-hero { align-items: start; display: grid; gap: 18px; grid-template-columns: minmax(110px, 1fr) minmax(190px, 1.8fr) minmax(110px, 1fr); margin-bottom: 22px; }
.ms-h2h-team { align-items: center; display: flex; flex-direction: column; gap: 10px; min-width: 0; text-align: center; }
.ms-h2h-team strong { font-size: 14px; font-weight: 800; line-height: 1.25; max-width: 100%; }
.ms-h2h-score { min-width: 0; text-align: center; }
.ms-h2h-score > div { align-items: center; display: flex; justify-content: space-around; }
.ms-h2h-score b { font-size: 35px; font-weight: 800; }
.ms-h2h-score span { color: #aeb5bf; display: flex; flex-direction: column; font-size: 25px; font-weight: 750; line-height: .8; }
.ms-h2h-score span small { font-size: 18px; }
.ms-h2h-score em { color: #9199a5; display: block; font-size: 11px; font-style: normal; font-weight: 650; margin-top: 12px; overflow-wrap: anywhere; }
.ms-h2h-scale { align-items: center; display: grid; gap: 10px; grid-column: 1 / -1; grid-template-columns: auto 1fr auto; }
.ms-h2h-scale b { font-size: 18px; font-weight: 800; }
.ms-h2h-scale > div { background: #cbd2dc; border-radius: 8px; height: 9px; overflow: hidden; }
.ms-h2h-scale > div i { background: var(--ms-win); display: block; height: 100%; transition: width .35s ease; }
.ms-h2h-scale span { color: #8c94a0; font-size: 11px; font-weight: 650; grid-column: 2; text-align: center; }
.ms-h2h-average { align-items: center; border-bottom: 1px solid #eceff2; border-top: 1px solid #eceff2; display: grid; gap: 15px; grid-column: 1 / -1; grid-template-columns: 80px minmax(0,1fr) 80px; margin-top: 2px; padding: 16px 0; text-align: center; }
.ms-h2h-average b { background: #edf3fb; border-radius: 9px; color: #2a65aa; font-size: 18px; padding: 9px 5px; }
.ms-h2h-average b:last-child { background: #fff0e9; color: #b94d22; }
.ms-h2h-average span { font-size: 14px; font-weight: 800; }
.ms-h2h-table-head { color: #a0a8b3; display: grid; font-size: 10px; font-weight: 750; gap: 12px; grid-template-columns: minmax(115px,132px) minmax(100px,135px) minmax(0,1fr) 50px; letter-spacing: .07em; padding: 0 8px 8px; text-transform: uppercase; }
.ms-h2h-table-head span:nth-child(3) { text-align: center; }
.ms-h2h-table-head span:last-child { text-align: center; }
.ms-total-section { border-top: 1px solid #eceae5; margin-top: 28px; padding-top: 24px; }
.ms-total-head { align-items: center; display: flex; gap: 20px; justify-content: space-between; }
.ms-total-head h3 { font-size: 19px; font-weight: 800; margin: 0 0 5px; }
.ms-total-head p { color: #969da7; font-size: 12px; margin: 0; }
.ms-total-tabs { background: #f1f2f4; border-radius: 11px; display: flex; padding: 4px; }
.ms-total-tabs button { min-height: 34px; min-width: 50px; padding: 6px 10px; }
.ms-total-chart { height: 225px; margin: 27px 4px 8px; padding: 0 0 30px; position: relative; }
.ms-total-bars { align-items: end; border-bottom: 1px solid #dfe3e8; bottom: 30px; display: flex; gap: 8px; height: calc(100% - 30px); justify-content: space-around; left: 0; position: absolute; right: 0; }
.ms-total-bar { cursor: help; flex: 1 1 0; height: 100%; max-width: 34px; position: relative; z-index: 2; }
.ms-total-bar__stack { bottom: 0; display: flex; flex-direction: column-reverse; height: 100%; left: 50%; position: absolute; transform: translateX(-50%); width: 21px; }
.ms-total-bar__stack i { animation: ms-bar-rise .45s ease both; background: var(--ms-blue); border-radius: 5px 5px 0 0; display: block; min-height: 1px; transform-origin: bottom; }
.ms-total-bar.is-b .ms-total-bar__stack i { background: var(--ms-orange); }
.ms-total-bar.is-draw .ms-total-bar__stack i { background: var(--ms-draw); }
.ms-total-bar__value { color: #5f6977; font-size: 10px; font-weight: 750; left: 50%; position: absolute; top: -16px; transform: translateX(-50%); }
.ms-total-bar > span { bottom: -24px; color: #98a0ab; font-size: 9px; left: 50%; position: absolute; transform: translateX(-50%); white-space: nowrap; }
.ms-total-line { border-top: 2px dashed #ef4444; left: 0; pointer-events: none; position: absolute; right: 0; transition: bottom .3s ease; z-index: 3; }
.ms-total-line span { background: #fff; border: 1px solid #fecaca; border-radius: 5px; color: #dc2626; font-size: 10px; font-weight: 800; padding: 2px 5px; position: absolute; right: 0; top: -12px; }
.ms-total-kpis { background: var(--ms-panel); border-radius: 13px; display: grid; gap: 8px; grid-template-columns: repeat(3, 1fr); padding: 17px; text-align: center; }
.ms-total-kpis > div { border-right: 1px solid #dde1e5; display: flex; flex-direction: column; min-width: 0; }
.ms-total-kpis > div:last-child { border-right: 0; }
.ms-total-kpis span { color: #8d95a0; font-size: 11px; font-weight: 700; }
.ms-total-kpis b { color: #27303c; font-size: 22px; margin: 3px 0; }
.ms-total-kpis em { color: #a5acb5; font-size: 10px; font-style: normal; }
.ms-tooltip { background: #0f172a; border-radius: 8px; box-shadow: 0 10px 30px rgba(15,23,42,.25); box-sizing: border-box; color: #fff; font-family: Inter, sans-serif; font-size: 12px; line-height: 1.45; opacity: 0; padding: 9px 11px; pointer-events: none; position: fixed; transform: translateY(3px); transition: opacity .14s ease, transform .14s ease; visibility: hidden; white-space: pre-line; z-index: 10050; }
.ms-tooltip.is-visible { opacity: 1; transform: translateY(0); visibility: visible; }
@keyframes ms-bar-rise { from { transform: scaleY(0); } to { transform: scaleY(1); } }

@media (max-width: 767px) {
  .match-statistics { margin-top: 28px; }
  .match-statistics__section { margin-bottom: 30px; }
  .match-statistics__title { font-size: 20px; line-height: 1.3; margin-bottom: 14px; }
  .match-statistics__card { padding: 20px 16px; }
  .match-statistics__intro { font-size: 13px; margin-bottom: 18px; }
  .ms-team-head { align-items: flex-start; flex-direction: column; gap: 12px; }
  .ms-team-identity { width: 100%; }
  .ms-team-identity > strong { font-size: 16px; }
  .ms-form-dots { margin-left: auto; }
  .ms-segmented { width: 100%; }
  .ms-segmented button { flex: 1; }
  .ms-match-row, .ms-match-list--h2h .ms-match-row { gap: 7px 10px; grid-template-columns: minmax(0,1fr) auto; min-height: 0; padding: 12px 5px; }
  .ms-match-row__toggle { cursor: pointer; display: block; }
  .ms-match-row__date, .ms-match-row__competition, .ms-match-row__teams, .ms-row-total { position: relative; z-index: 2; }
  .ms-match-row__competition { max-width: 125px; text-align: right; }
  .ms-match-row__teams { grid-column: 1 / -1; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); }
  .ms-match-list--h2h .ms-match-row__teams { grid-column: 1; }
  .ms-match-list--h2h .ms-row-total { grid-column: 2; grid-row: 2; min-width: 42px; }
  .ms-match-row__details { grid-row: 3; }
  .ms-match-row.is-open .ms-match-row__details { display: block; }
  .ms-match-row__date b, .ms-match-row__date em, .ms-row-team, .ms-score { font-size: 11px; }
  .ms-score { min-width: 46px; padding: 6px 5px; }
  .ms-team-logo--row { display: none; }
  .ms-team-metrics { gap: 16px; grid-template-columns: 1fr 1fr; padding: 16px; }
  .ms-team-metrics h4, .ms-total-kpis span { overflow-wrap: anywhere; }
  .ms-result-summary { gap: 10px; }
  .ms-donut { flex-basis: 65px; height: 65px; }
  .ms-donut::after { height: 42px; width: 42px; }
  .ms-result-legend span, .ms-average span { font-size: 11px; }
  .ms-team-form { border-top: 1px solid #dde1e5; grid-column: 1 / -1; padding-top: 14px; }
  .ms-team-divider { margin: 24px 0; }
  .ms-h2h-hero { gap: 11px; grid-template-columns: minmax(75px,1fr) minmax(120px,1.35fr) minmax(75px,1fr); }
  .ms-team-logo--large { flex-basis: 50px; height: 50px; }
  .ms-h2h-team strong { font-size: 11px; }
  .ms-h2h-score b { font-size: 28px; }
  .ms-h2h-score span { font-size: 21px; }
  .ms-h2h-score em { font-size: 9px; line-height: 1.4; }
  .ms-h2h-scale { gap: 7px; }
  .ms-h2h-scale b { font-size: 15px; }
  .ms-h2h-average { gap: 7px; grid-template-columns: 58px minmax(0,1fr) 58px; }
  .ms-h2h-average span { font-size: 11px; }
  .ms-h2h-average b { font-size: 15px; padding: 8px 3px; }
  .ms-h2h-table-head { display: none; }
  .ms-total-head { align-items: flex-start; flex-direction: column; }
  .ms-total-tabs { width: 100%; }
  .ms-total-tabs button { flex: 1; }
  .ms-total-chart { height: 205px; margin-left: 0; margin-right: 0; }
  .ms-total-bars { gap: 3px; }
  .ms-total-bar__stack { width: 14px; }
  .ms-total-bar__value { display: none; }
  .ms-total-bar > span { font-size: 8px; writing-mode: vertical-rl; }
  .ms-total-kpis { gap: 5px; padding: 13px 8px; }
  .ms-total-kpis span { font-size: 9px; }
  .ms-total-kpis b { font-size: 18px; }
}

@media (max-width: 380px) {
  .match-statistics__card { padding-left: 12px; padding-right: 12px; }
  .ms-team-identity > strong { max-width: 135px; }
  .ms-team-metrics { grid-template-columns: 1fr; }
  .ms-team-form { grid-column: 1; }
  .ms-h2h-score b { font-size: 24px; }
  .ms-h2h-score em { font-size: 8px; }
  .ms-total-kpis em { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .match-statistics *, .match-statistics *::before, .match-statistics *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}