:root{
    --mcc-green:#52d31d;
    --mcc-green-dark:#2cae16;
    --mcc-text:#121719;
    --mcc-muted:#747d82;
    --mcc-border:#dde3e6;
    --mcc-soft:#f6f8f9;
    --mcc-dark:#071014;
    --mcc-shell:1380px;
}

.mcc-league-root,
.mcc-league-root *{
    box-sizing:border-box;
}

.mcc-league-root{
    width:100vw;
    max-width:none!important;
    margin-left:calc(50% - 50vw);
    margin-right:calc(50% - 50vw);
    background:#fff;
    color:var(--mcc-text);
    font-family:Rajdhani,Arial,sans-serif;
}

.mcc-league-shell{
    width:min(
        var(--mcc-shell),
        calc(100% - 48px)
    );
    margin:0 auto;
}


/* HERO */

.mcc-league-hero{
    position:relative;
    overflow:hidden;
    color:#fff;
    background:
        radial-gradient(
            circle at 72% 35%,
            rgba(71,153,120,.13),
            transparent 38%
        ),
        linear-gradient(
            120deg,
            #071014,
            #0b181d
        );
}

.mcc-league-hero::after{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:
        linear-gradient(
            90deg,
            transparent 58%,
            rgba(255,255,255,.025)
        );
}

.mcc-league-breadcrumb{
    min-height:48px;
    display:flex;
    align-items:center;
    gap:8px;
    color:#96a1a7;
    font-size:13px;
}

.mcc-league-breadcrumb a{
    color:inherit!important;
    text-decoration:none!important;
}

.mcc-league-breadcrumb strong{
    color:#cbd2d5;
}

.mcc-league-hero-main{
    position:relative;
    z-index:1;
    min-height:160px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px;
    padding:12px 0 26px;
}

.mcc-league-brand{
    min-width:0;
    display:flex;
    align-items:center;
    gap:22px;
}

.mcc-league-logo{
    width:82px;
    height:82px;
    flex:0 0 82px;
    display:flex;
    align-items:center;
    justify-content:center;
}

.mcc-league-logo img{
    width:100%;
    height:100%;
    object-fit:contain;
}

.mcc-league-title h1{
    margin:0;
    color:#fff;
    font-size:34px;
    line-height:1;
    font-weight:700;
}

.mcc-league-country{
    margin-top:8px;
    display:flex;
    align-items:center;
    gap:7px;
    color:#aeb8bd;
    font-size:14px;
}

.mcc-league-country img{
    width:22px;
    height:15px;
    object-fit:cover;
}

.mcc-league-meta{
    margin-top:12px;
    display:flex;
    align-items:center;
    gap:10px;
}

.mcc-season-select select,
.mcc-league-type{
    height:34px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:5px;
    color:#fff;
    background:#111b20;
    font:700 12px Rajdhani,Arial,sans-serif;
}

.mcc-season-select select{
    min-width:150px;
    padding:0 30px 0 10px;
}

.mcc-league-type{
    display:inline-flex;
    align-items:center;
    padding:0 13px;
}

.mcc-league-actions{
    display:flex;
    flex-direction:column;
    align-items:flex-end;
    gap:40px;
}

.mcc-league-action{
    min-height:38px;
    padding:0 14px;
    border:1px solid #344048;
    border-radius:6px;
    color:#fff;
    background:rgba(5,11,14,.45);
    font-weight:700;
}


/* TABS */

.mcc-league-tabs{
    position:sticky;
    top:0;
    z-index:30;
    border-bottom:1px solid #253238;
    background:#091317;
}

.mcc-league-tabs .mcc-league-shell{
    display:flex;
    overflow-x:auto;
}

.mcc-league-tabs button{
    position:relative;
    min-width:max-content;
    height:56px;
    padding:0 24px;
    border:0;
    color:#e0e4e6;
    background:transparent;
    font-weight:700;
    font-size:13px;
}

.mcc-league-tabs button.is-active{
    color:var(--mcc-green);
}

.mcc-league-tabs button.is-active::after{
    content:"";
    position:absolute;
    left:14px;
    right:14px;
    bottom:0;
    height:3px;
    background:var(--mcc-green);
}


/* CONTENT */

.mcc-league-content{
    padding:24px 0 60px;
    background:#fff;
}


/* SUMMARY */

.mcc-summary-grid{
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:12px;
    margin-bottom:22px;
}

.mcc-summary-card{
    min-width:0;
    min-height:132px;
    padding:20px 20px;
    border:1px solid var(--mcc-border);
    border-radius:7px;
    background:#fff;
}

.mcc-summary-card small{
    display:block;
    color:#5f686d;
    font-size:12px;
    font-weight:600;
}

.mcc-summary-card>strong{
    display:block;
    margin-top:13px;
    color:#111719;
    font-size:30px;
    line-height:1;
    font-weight:700;
}

.mcc-summary-card>strong.is-small{
    font-size:24px;
}

.mcc-summary-card>span{
    display:block;
    margin-top:8px;
    color:#707a80;
    font-size:12px;
}

.mcc-card-values{
    margin-top:18px;
    display:flex;
    gap:30px;
}

.mcc-card-values span{
    display:flex;
    align-items:center;
    gap:7px;
}

.mcc-card-values i,
.mcc-card-legend i{
    width:13px;
    height:17px;
    display:inline-block;
    border-radius:2px;
}

.is-yellow{
    background:#ffc400;
}

.is-red{
    background:#e51c23;
}


/* DASHBOARD */

.mcc-dashboard-grid{
    display:grid;
    grid-template-columns:
        minmax(0,1.65fr)
        minmax(260px,.72fr)
        minmax(280px,.9fr);
    gap:16px;
    align-items:start;
}

.mcc-dashboard-center,
.mcc-dashboard-side{
    display:grid;
    gap:16px;
}

.mcc-panel{
    overflow:hidden;
    border:1px solid var(--mcc-border);
    border-radius:7px;
    background:#fff;
}

.mcc-panel-head{
    min-height:58px;
    display:flex;
    align-items:center;
    gap:10px;
    padding:0 18px;
    border-bottom:1px solid #e9edef;
}

.mcc-panel-head h2{
    margin:0;
    font-size:15px;
    font-weight:700;
}

.mcc-panel-head button{
    margin-left:auto;
    border:0;
    color:#289a1a;
    background:transparent;
    font-size:11px;
    font-weight:700;
}

.mcc-live-tag{
    padding:3px 7px;
    border-radius:9px;
    color:#269818;
    background:#ecf8e9;
    font-size:10px;
    font-weight:700;
}

.mcc-panel-empty{
    padding:40px 18px;
    color:#858e93;
    text-align:center;
}


/* NEXT MATCH */

.mcc-next-match{
    padding:16px 20px 20px;
    text-align:center;
}

.mcc-next-match>small{
    color:#69747a;
}

.mcc-next-match>time{
    display:block;
    margin-top:18px;
    font-size:17px;
    font-weight:700;
}

.mcc-next-teams{
    margin-top:24px;
    display:grid;
    grid-template-columns:1fr 30px 1fr;
    align-items:center;
    gap:8px;
}

.mcc-next-teams>div{
    min-width:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:8px;
}

.mcc-next-teams img{
    width:56px;
    height:56px;
    object-fit:contain;
}

.mcc-next-teams strong{
    max-width:110px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}


/* PERFORMANCE */

.mcc-season-performance{
    min-height:180px;
    display:grid;
    grid-template-columns:130px 1fr;
    align-items:center;
    gap:12px;
    padding:20px;
}

.mcc-donut{
    width:116px;
    height:116px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:
        radial-gradient(
            circle,
            #fff 0 53%,
            transparent 54%
        ),
        conic-gradient(
            #25a12a 0 var(--win),
            #c5c9cc var(--win)
                calc(var(--win) + var(--draw)),
            #e22525
                calc(var(--win) + var(--draw))
                100%
        );
}

.mcc-donut strong{
    font-size:24px;
}

.mcc-donut span{
    color:#727c81;
    font-size:11px;
}

.mcc-season-performance ul{
    margin:0;
    padding:0;
    list-style:none;
}

.mcc-season-performance li{
    min-height:30px;
    display:grid;
    grid-template-columns:10px 1fr auto;
    align-items:center;
    gap:7px;
    color:#5e686d;
    font-size:12px;
}

.mcc-season-performance li i{
    width:8px;
    height:8px;
    border-radius:50%;
}

.mcc-season-performance li i.is-win{
    background:#25a12a;
}

.mcc-season-performance li i.is-draw{
    background:#c5c9cc;
}

.mcc-season-performance li i.is-loss{
    background:#e22525;
}


/* CARDS */

.mcc-cards-chart{
    min-height:190px;
    display:grid;
    grid-template-columns:135px 1fr;
    align-items:center;
    gap:10px;
    padding:20px;
}

.mcc-card-donut{
    width:112px;
    height:112px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:
        radial-gradient(
            circle,
            #fff 0 55%,
            transparent 56%
        ),
        conic-gradient(
            #ffc400 0 94%,
            #e51c23 94% 100%
        );
}

.mcc-card-donut strong{
    font-size:23px;
}

.mcc-card-donut span{
    color:#788186;
    font-size:11px;
}

.mcc-card-legend{
    display:grid;
    gap:14px;
}

.mcc-card-legend span{
    display:grid;
    grid-template-columns:14px 1fr auto;
    align-items:center;
    gap:7px;
    font-size:11px;
}


/* MOBILE */

@media(max-width:1100px){

    .mcc-summary-grid{
        grid-template-columns:
            repeat(3,minmax(0,1fr));
    }

    .mcc-dashboard-grid{
        grid-template-columns:
            minmax(0,1.4fr)
            minmax(260px,.7fr);
    }

    .mcc-dashboard-side{
        grid-column:1/-1;
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }
}


@media(max-width:760px){

    .mcc-league-shell{
        width:calc(100% - 20px);
    }

    .mcc-league-breadcrumb{
        display:none;
    }

    .mcc-league-hero-main{
        min-height:160px;
        padding:24px 0;
    }

    .mcc-league-logo{
        width:62px;
        height:62px;
        flex-basis:62px;
    }

    .mcc-league-title h1{
        font-size:26px;
    }

    .mcc-league-actions{
        display:none;
    }

    .mcc-league-tabs .mcc-league-shell{
        width:100%;
    }

    .mcc-league-tabs button{
        height:52px;
        padding:0 16px;
        font-size:12px;
    }

    .mcc-summary-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
        gap:8px;
    }

    .mcc-summary-card{
        min-height:108px;
        padding:14px;
    }

    .mcc-dashboard-grid{
        grid-template-columns:1fr;
    }

    .mcc-dashboard-side{
        grid-column:auto;
        grid-template-columns:1fr;
    }

    .mcc-season-performance{
        grid-template-columns:120px 1fr;
    }
}


/* =========================================================
   REAL LEAGUE STANDING
   ========================================================= */

.mcc-standing-panel {
    overflow: hidden;
}

.mcc-panel-head {
    min-height: 68px;
    padding: 16px 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    border-bottom: 1px solid #edf0f2;
}

.mcc-panel-head h2 {
    margin: 2px 0 0;
    font-size: 15px;
    line-height: 1.2;
    font-weight: 600;
    letter-spacing: .02em;
    color: #12181c;
}

.mcc-panel-kicker {
    display: block;
    font-size: 9px;
    line-height: 1;
    font-weight: 600;
    letter-spacing: .12em;
    color: #929ba1;
}

.mcc-panel-season {
    padding: 5px 8px;
    border: 1px solid #e5e9eb;
    border-radius: 6px;
    background: #f7f9fa;
    font-size: 12px;
    line-height: 1;
    font-weight: 700;
    color: #6b747a;
}

.mcc-table-scroll {
    width: 100%;
    overflow-x: auto;
    scrollbar-width: thin;
}

.mcc-standing-table {
    width: 100%;
    min-width: 720px;
    border-collapse: collapse;
    table-layout: auto;
    margin: 0;
}

.mcc-standing-table th {
    height: 34px;
    padding: 0 7px;
    border-bottom: 1px solid #e9edef;
    background: #f8fafb;
    font-size: 11px;
    font-weight: 700;
    color: #929aa0;
    text-align: center;
    white-space: nowrap;
}

.mcc-standing-table td {
    height: 47px;
    padding: 0 7px;
    border-bottom: 1px solid #eff2f3;
    font-size: 13px;
    font-weight: 600;
    color: #50585d;
    text-align: center;
    white-space: nowrap;
}

.mcc-standing-table tbody tr:last-child td {
    border-bottom: 0;
}

.mcc-standing-table tbody tr:hover {
    background: #fafcfc;
}

.mcc-standing-table .mcc-col-pos {
    width: 34px;
    padding-left: 11px;
    padding-right: 5px;
}

.mcc-standing-table .mcc-col-team {
    min-width: 155px;
    text-align: left;
}

.mcc-standing-table .mcc-col-form {
    min-width: 122px;
}

.mcc-position {
    width: 21px;
    height: 21px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
    font-size: 12px;
    font-weight: 600;
    color: #586066;
}

.mcc-standing-table tr.is-ucl .mcc-position {
    background: #e9f1ff;
    color: #2869df;
}

.mcc-standing-table tr.is-europa .mcc-position {
    background: #fff1dc;
    color: #dd8511;
}

.mcc-standing-table tr.is-relegation .mcc-position {
    background: #ffebec;
    color: #e44b55;
}

.mcc-table-team {
    display: flex;
    align-items: center;
    gap: 8px;
}

.mcc-table-team img {
    width: 23px;
    height: 23px;
    flex: 0 0 23px;
    object-fit: contain;
}

.mcc-table-team span {
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 11px;
    font-weight: 700;
    color: #252b2f;
}

.mcc-standing-table .mcc-points {
    font-weight: 700;
    color: #171c20;
}

.mcc-form {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 3px;
}

.mcc-form span {
    width: 19px;
    height: 19px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 10px;
    line-height: 1;
    font-weight: 600;
    color: #fff;
}

.mcc-form .is-win {
    background: #1db477;
}

.mcc-form .is-draw {
    background: #a8afb4;
}

.mcc-form .is-loss {
    background: #ed5962;
}

.mcc-panel-more {
    width: 100%;
    min-height: 42px;
    border: 0;
    border-top: 1px solid #edf0f2;
    background: #fff;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .035em;
    color: #139b68;
    cursor: pointer;
}

.mcc-panel-more:hover {
    background: #f8fbfa;
}

.mcc-full-standing {
    border-top: 1px solid #edf0f2;
}

.mcc-standing-legend {
    padding: 11px 15px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 14px;
    border-top: 1px solid #edf0f2;
    background: #fbfcfc;
}

.mcc-standing-legend span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 9px;
    font-weight: 600;
    color: #7c858b;
}

.mcc-standing-legend i {
    width: 7px;
    height: 7px;
    display: block;
    border-radius: 2px;
}

.mcc-standing-legend i.is-ucl {
    background: #3c7ce8;
}

.mcc-standing-legend i.is-europa {
    background: #ed9c2d;
}

.mcc-standing-legend i.is-relegation {
    background: #ed5962;
}

@media (max-width: 767px) {

    .mcc-panel-head {
        min-height: 60px;
        padding: 13px 14px;
    }

    .mcc-standing-table {
        min-width: 670px;
    }

    .mcc-standing-table td {
        height: 44px;
    }

    .mcc-standing-legend {
        gap: 10px;
    }
}


/* =========================================================
   LEAGUE PLAYER RANKINGS
   ========================================================= */

.mcc-dashboard-side {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.mcc-ranking-panel,
.mcc-cards-panel {
    overflow: hidden;
}

.mcc-player-ranking {
    width: 100%;
}

.mcc-player-row {
    min-height: 60px;
    padding: 8px 14px;
    display: grid;
    grid-template-columns:
        22px
        38px
        minmax(0, 1fr)
        auto;
    align-items: center;
    gap: 8px;
    border-bottom: 1px solid #eff2f3;
}

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

.mcc-player-row:hover {
    background: #fafcfc;
}

.mcc-player-rank {
    width: 22px;
    height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    background: #f1f4f5;
    font-size: 9px;
    line-height: 1;
    font-weight: 700;
    color: #737c82;
}

.mcc-player-row:first-child
.mcc-player-rank {
    background: #dff7ed;
    color: #07955f;
}

.mcc-player-avatar {
    width: 38px;
    height: 38px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    overflow: hidden;
    border-radius: 50%;
    background:
        linear-gradient(
            145deg,
            #f3f5f6,
            #e8edef
        );
}

.mcc-player-avatar img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.mcc-player-copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.mcc-player-copy strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 11px;
    line-height: 1.2;
    font-weight: 600;
    color: #20262a;
}

.mcc-player-copy span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 9px;
    line-height: 1.2;
    font-weight: 600;
    color: #939ba0;
}

.mcc-player-value {
    min-width: 28px;
    text-align: right;
    font-size: 17px;
    line-height: 1;
    font-weight: 700;
    color: #11171a;
}

.mcc-ranking-panel:first-child
.mcc-player-row:first-child
.mcc-player-value {
    color: #08a66b;
}


/* =========================================================
   CARD SUMMARY
   ========================================================= */

.mcc-card-summary {
    padding: 15px;
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
    gap: 8px;
    border-bottom: 1px solid #edf0f2;
}

.mcc-card-stat {
    min-height: 70px;
    padding: 12px;
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid #e9edef;
    border-radius: 9px;
    background: #fafbfb;
}

.mcc-card-icon {
    width: 15px;
    height: 21px;
    display: block;
    flex: 0 0 auto;
    border-radius: 2px;
    transform: rotate(3deg);
    box-shadow:
        0 2px 5px
        rgba(0, 0, 0, .08);
}

.mcc-card-icon.is-yellow {
    background: #f5c842;
}

.mcc-card-icon.is-red {
    background: #e64d57;
}

.mcc-card-stat > div {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.mcc-card-stat strong {
    font-size: 18px;
    line-height: 1;
    font-weight: 700;
    color: #1a2024;
}

.mcc-card-stat div span {
    font-size: 9px;
    font-weight: 600;
    color: #92999e;
}

.mcc-card-ranking-title {
    min-height: 38px;
    padding: 0 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border-bottom: 1px solid #edf0f2;
    background: #fbfcfc;
}

.mcc-card-ranking-title > span {
    font-size: 8px;
    line-height: 1;
    font-weight: 600;
    letter-spacing: .06em;
    color: #8b9499;
}

.mcc-card-ranking-title > div {
    display: flex;
    align-items: center;
    gap: 8px;
}

.mcc-card-ranking-title i {
    width: 8px;
    height: 11px;
    display: block;
    border-radius: 1px;
}

.mcc-card-ranking-title i.is-yellow {
    background: #f5c842;
}

.mcc-card-ranking-title i.is-red {
    background: #e64d57;
}


/* =========================================================
   DASHBOARD RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .mcc-dashboard-side {
        display: grid;
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .mcc-cards-panel {
        grid-column: 1 / -1;
    }
}

@media (max-width: 700px) {

    .mcc-dashboard-side {
        display: flex;
    }

    .mcc-player-row {
        padding-left: 12px;
        padding-right: 12px;
    }
}


/* =========================================================
   SUMMARY PLAYER CARD
   ========================================================= */

.mcc-summary-player-main {
    margin-top: 6px;
    display: flex;
    align-items: center;
    gap: 9px;
}

.mcc-summary-player-main img {
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    object-fit: contain;
    border-radius: 50%;
    background: #f1f4f5;
}

.mcc-summary-player-main > div {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.mcc-summary-player
.mcc-summary-player-main strong {
    margin: 0;
    font-size: 22px;
    line-height: 1;
}

.mcc-summary-player
.mcc-summary-player-main span {
    max-width: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}


/* =========================================================
   LEAGUE ANALYTICS
   ========================================================= */

.mcc-league-analytics {
    margin-top: 16px;
    display: grid;
    grid-template-columns:
        minmax(0, 1.55fr)
        minmax(280px, .75fr);
    gap: 14px;
    align-items: start;
}

.mcc-analytics-stats {
    grid-column: 1 / 2;
}

.mcc-results-panel {
    grid-column: 2 / 3;
}

.mcc-team-leaders-panel {
    grid-column: 1 / -1;
}


/* statistics */

.mcc-stat-matrix {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));
}

.mcc-stat-cell {
    min-height: 105px;
    padding: 17px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-right: 1px solid #edf0f2;
    border-bottom: 1px solid #edf0f2;
}

.mcc-stat-cell:nth-child(4n) {
    border-right: 0;
}

.mcc-stat-cell:nth-last-child(-n + 4) {
    border-bottom: 0;
}

.mcc-stat-cell > span {
    margin-bottom: 8px;
    font-size: 8px;
    line-height: 1.25;
    font-weight: 600;
    letter-spacing: .055em;
    color: #929a9f;
}

.mcc-stat-cell > strong {
    font-size: 25px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: -.035em;
    color: #171c20;
}

.mcc-stat-cell > small {
    margin-top: 6px;
    font-size: 9px;
    font-weight: 600;
    color: #8a9398;
}


/* result donut */

.mcc-results-body {
    min-height: 228px;
    padding: 20px 18px;
    display: flex;
    align-items: center;
    gap: 22px;
}

.mcc-result-donut {
    --home: 0;
    --draw: 0;

    width: 126px;
    height: 126px;
    flex: 0 0 126px;
    position: relative;
    border-radius: 50%;

    background:
        conic-gradient(
            #14aa70
            0
            calc(var(--home) * 1%),

            #aeb6bb
            calc(var(--home) * 1%)
            calc(
                (
                    var(--home)
                    +
                    var(--draw)
                ) * 1%
            ),

            #242b30
            calc(
                (
                    var(--home)
                    +
                    var(--draw)
                ) * 1%
            )
            100%
        );
}

.mcc-result-donut::after {
    content: "";
    position: absolute;
    inset: 18px;
    border-radius: 50%;
    background: #fff;
}

.mcc-result-donut-center {
    position: absolute;
    z-index: 2;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.mcc-result-donut-center strong {
    font-size: 24px;
    line-height: 1;
    font-weight: 700;
    color: #171d20;
}

.mcc-result-donut-center span {
    margin-top: 4px;
    font-size: 9px;
    font-weight: 700;
    color: #939b9f;
}

.mcc-result-list {
    min-width: 0;
    flex: 1;
}

.mcc-result-row {
    min-height: 53px;
    display: grid;
    grid-template-columns:
        8px
        minmax(0, 1fr)
        auto;
    align-items: center;
    gap: 9px;
    border-bottom: 1px solid #eff2f3;
}

.mcc-result-row:last-child {
    border-bottom: 0;
}

.mcc-result-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
}

.mcc-result-row.is-home
.mcc-result-dot {
    background: #14aa70;
}

.mcc-result-row.is-draw
.mcc-result-dot {
    background: #aeb6bb;
}

.mcc-result-row.is-away
.mcc-result-dot {
    background: #242b30;
}

.mcc-result-row > div {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.mcc-result-row strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 10px;
    font-weight: 600;
    color: #30363a;
}

.mcc-result-row small {
    font-size: 8px;
    font-weight: 600;
    color: #969da1;
}

.mcc-result-row b {
    font-size: 11px;
    font-weight: 700;
    color: #252b2f;
}


/* team leaders */

.mcc-team-leaders-grid {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));
}

.mcc-team-leader {
    min-height: 92px;
    padding: 15px 17px;
    border-right: 1px solid #edf0f2;
    border-bottom: 1px solid #edf0f2;
}

.mcc-team-leader:nth-child(3n) {
    border-right: 0;
}

.mcc-team-leader:nth-last-child(-n + 3) {
    border-bottom: 0;
}

.mcc-team-leader-label {
    margin-bottom: 12px;
    font-size: 8px;
    line-height: 1;
    font-weight: 600;
    letter-spacing: .055em;
    color: #929a9f;
}

.mcc-team-leader-main {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.mcc-team-leader-team {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 9px;
}

.mcc-team-leader-team img {
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    object-fit: contain;
}

.mcc-team-leader-team strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 11px;
    font-weight: 600;
    color: #252b2f;
}

.mcc-team-leader-main > span {
    flex: 0 0 auto;
    font-size: 12px;
    font-weight: 700;
    color: #0c9e67;
}


/* responsive */

@media (max-width: 1050px) {

    .mcc-league-analytics {
        grid-template-columns: 1fr;
    }

    .mcc-analytics-stats,
    .mcc-results-panel,
    .mcc-team-leaders-panel {
        grid-column: 1;
    }

    .mcc-results-body {
        justify-content: center;
    }
}

@media (max-width: 720px) {

    .mcc-stat-matrix {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .mcc-stat-cell:nth-child(4n) {
        border-right:
            1px solid #edf0f2;
    }

    .mcc-stat-cell:nth-child(2n) {
        border-right: 0;
    }

    .mcc-stat-cell:nth-last-child(-n + 4) {
        border-bottom:
            1px solid #edf0f2;
    }

    .mcc-stat-cell:nth-last-child(-n + 2) {
        border-bottom: 0;
    }

    .mcc-results-body {
        flex-direction: column;
        align-items: stretch;
    }

    .mcc-result-donut {
        margin: 0 auto;
    }

    .mcc-team-leaders-grid {
        grid-template-columns: 1fr;
    }

    .mcc-team-leader,
    .mcc-team-leader:nth-child(3n) {
        border-right: 0;
        border-bottom:
            1px solid #edf0f2;
    }

    .mcc-team-leader:last-child {
        border-bottom: 0;
    }
}


/* =========================================================
   SEASON X-RAY
   ========================================================= */

.mcc-season-xray {
    grid-column: 1 / 3;
    min-width: 0;
    overflow: hidden;
}

.mcc-dashboard-side {
    grid-column: 3;
    grid-row: 1 / span 2;
}


/* header */

.mcc-xray-head-meta {
    display: flex;
    align-items: center;
    gap: 7px;
}

.mcc-xray-head-meta span,
.mcc-xray-head-meta strong {
    min-height: 24px;
    padding: 0 8px;
    display: inline-flex;
    align-items: center;
    border-radius: 6px;
    white-space: nowrap;
    font-size: 8px;
    font-weight: 600;
}

.mcc-xray-head-meta span {
    background: #f3f6f7;
    color: #727c81;
}

.mcc-xray-head-meta strong {
    background: #e5f8f0;
    color: #079765;
}


/* main grid */

.mcc-xray-grid {
    display: grid;
    grid-template-columns:
        minmax(0, 1.45fr)
        minmax(230px, .85fr);
}

.mcc-xray-block {
    min-width: 0;
    padding: 17px 18px 15px;
}

.mcc-xray-trend {
    border-right: 1px solid #edf0f2;
}

.mcc-xray-title {
    min-height: 32px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.mcc-xray-title > div {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.mcc-xray-title strong {
    font-size: 9px;
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: .035em;
    color: #242a2e;
}

.mcc-xray-title span {
    font-size: 8px;
    line-height: 1.2;
    font-weight: 600;
    color: #9aa1a5;
}


/* goals by round */

.mcc-xray-chart {
    height: 186px;
    margin-top: 12px;
    padding: 9px 5px 0;
    display: flex;
    align-items: stretch;
    gap: 7px;
    overflow-x: auto;
    border-bottom: 1px solid #e6ebed;
    scrollbar-width: thin;
}

.mcc-xray-bar-item {
    min-width: 31px;
    flex: 1 0 31px;
    height: 100%;
    display: grid;
    grid-template-rows:
        17px
        minmax(0, 1fr)
        24px;
    align-items: end;
    justify-items: center;
}

.mcc-xray-bar-value {
    font-size: 8px;
    line-height: 1;
    font-weight: 600;
    color: #687177;
}

.mcc-xray-bar-track {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.mcc-xray-bar-track i {
    width: min(18px, 72%);
    min-height: 5px;
    display: block;
    border-radius: 4px 4px 1px 1px;
    background:
        linear-gradient(
            180deg,
            #19b97b 0%,
            #079d67 100%
        );
    transition:
        height .25s ease;
}

.mcc-xray-bar-item:hover
.mcc-xray-bar-track i {
    opacity: .8;
}

.mcc-xray-bar-item small {
    height: 24px;
    padding-top: 7px;
    font-size: 7px;
    line-height: 1;
    font-weight: 700;
    color: #939ba0;
}


/* goals per match */

.mcc-goal-dist-list {
    margin-top: 13px;
    display: flex;
    flex-direction: column;
}

.mcc-goal-dist-row {
    min-height: 31px;
    display: grid;
    grid-template-columns:
        46px
        minmax(0, 1fr)
        24px;
    align-items: center;
    gap: 9px;
}

.mcc-goal-dist-row > span {
    font-size: 8px;
    font-weight: 700;
    color: #70797e;
}

.mcc-goal-dist-row > strong {
    text-align: right;
    font-size: 9px;
    font-weight: 700;
    color: #252b2f;
}

.mcc-goal-dist-track {
    height: 6px;
    overflow: hidden;
    border-radius: 999px;
    background: #eef2f3;
}

.mcc-goal-dist-track i {
    height: 100%;
    display: block;
    border-radius: inherit;
    background: #12aa70;
}


/* frequent scorelines */

.mcc-xray-scorelines {
    padding: 15px 18px 18px;
    border-top: 1px solid #edf0f2;
    background: #fbfcfc;
}

.mcc-scoreline-grid {
    margin-top: 12px;
    display: grid;
    grid-template-columns:
        repeat(5, minmax(0, 1fr));
    gap: 7px;
}

.mcc-scoreline-card {
    min-height: 73px;
    padding: 10px 9px;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border: 1px solid #e6ebed;
    border-radius: 8px;
    background: #fff;
}

.mcc-scoreline-card > span {
    position: absolute;
    top: 6px;
    left: 7px;
    font-size: 6px;
    line-height: 1;
    font-weight: 600;
    color: #b2b8bc;
}

.mcc-scoreline-card > strong {
    font-size: 18px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: -.03em;
    color: #1c2226;
}

.mcc-scoreline-card > small {
    margin-top: 5px;
    font-size: 7px;
    line-height: 1;
    font-weight: 700;
    color: #8e979c;
}

.mcc-scoreline-card:first-child {
    border-color: #bdebd9;
    background: #f5fcf9;
}

.mcc-scoreline-card:first-child > strong {
    color: #079d67;
}


/* empty */

.mcc-xray-empty {
    height: 170px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 9px;
    font-weight: 600;
    color: #9aa2a6;
}


/* responsive */

@media (max-width: 1100px) {

    .mcc-season-xray {
        grid-column: 1 / -1;
        grid-row: auto;
    }

    .mcc-dashboard-side {
        grid-column: 1 / -1;
        grid-row: auto;
    }
}

@media (max-width: 700px) {

    .mcc-xray-head-meta {
        display: none;
    }

    .mcc-xray-grid {
        grid-template-columns: 1fr;
    }

    .mcc-xray-trend {
        border-right: 0;
        border-bottom: 1px solid #edf0f2;
    }

    .mcc-xray-chart {
        height: 165px;
    }

    .mcc-scoreline-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .mcc-scoreline-card:last-child {
        grid-column: 1 / -1;
    }
}


/* =========================================================
   MCC LEAGUE — MULTICANAIS DESIGN SYSTEM ALIGNMENT
   Match Center / Home visual language
   ========================================================= */

.mcc-league-root{
    --mcc-green:#37ad24;
    --mcc-green-dark:#218d17;
    --mcc-red:#e5151b;

    --mcc-text:#111417;
    --mcc-muted:#697178;

    --mcc-border:#dde2e5;
    --mcc-border-soft:#edf0f2;
    --mcc-soft:#f6f7f8;

    --mcc-shell:1210px;

    width:100vw;
    max-width:none!important;

    margin-left:calc(50% - 50vw);
    margin-right:calc(50% - 50vw);

    background:#fff;

    color:var(--mcc-text);

    font-family:
        "Rajdhani",
        "Arial Narrow",
        Arial,
        sans-serif;

    font-size:14px;
    line-height:1.3;

    -webkit-font-smoothing:antialiased;
    text-rendering:geometricPrecision;
}

.mcc-league-root,
.mcc-league-root *{
    box-sizing:border-box;
}

.mcc-league-root h1,
.mcc-league-root h2,
.mcc-league-root h3,
.mcc-league-root strong,
.mcc-league-root b,
.mcc-league-root button{
    font-family:
        "Barlow Condensed",
        "Arial Narrow",
        Arial,
        sans-serif;
}

.mcc-league-shell{
    width:min(
        var(--mcc-shell),
        calc(100% - 44px)
    );

    margin-left:auto;
    margin-right:auto;
}


/* =========================================================
   CONTENT
   ========================================================= */

.mcc-league-content{
    background:#fff;
}

.mcc-league-content > .mcc-league-shell{
    padding-top:20px;
    padding-bottom:40px;
}


/* =========================================================
   GLOBAL CARDS
   ========================================================= */

.mcc-panel,
.mcc-summary-card{
    border:
        1px solid
        var(--mcc-border);

    border-radius:9px;

    background:#fff;

    box-shadow:
        0 2px 9px
        rgba(18,28,34,.025);
}


/* =========================================================
   SUMMARY
   ========================================================= */

.mcc-summary-grid{
    gap:10px;
    margin-bottom:18px;
}

.mcc-summary-card{
    min-height:106px;
    padding:16px 18px;
}

.mcc-summary-card > small{
    color:#626b70;

    font-size:10px;
    font-weight:600;

    letter-spacing:.25px;
}

.mcc-summary-card > strong{
    margin-top:10px;

    color:#111417;

    font-size:30px;
    line-height:1;

    font-weight:700;
}

.mcc-summary-card > span{
    margin-top:8px;

    color:#727a7f;

    font-size:11px;
    font-weight:600;
}

.mcc-summary-player
.mcc-summary-player-main strong{
    font-size:25px;
}


/* =========================================================
   MAIN DASHBOARD
   ========================================================= */

.mcc-dashboard-grid{
    gap:18px;
    align-items:start;
}

.mcc-dashboard-main,
.mcc-dashboard-center,
.mcc-dashboard-side{
    gap:16px;
}


/* =========================================================
   PANEL HEAD
   ========================================================= */

.mcc-panel-head{
    min-height:52px;

    padding:0 16px;

    border-bottom:
        1px solid
        var(--mcc-border);

    background:#fff;
}

.mcc-panel-kicker{
    margin-bottom:3px;

    color:#8b9398;

    font-size:8px;
    font-weight:700;

    letter-spacing:.65px;
}

.mcc-panel-head h2{
    color:#111417;

    font-size:17px;
    line-height:1;

    font-weight:700;

    letter-spacing:.12px;
}

.mcc-panel-season{
    padding:4px 8px;

    border:
        1px solid #dce2e5;

    border-radius:5px;

    background:#f7f8f8;

    color:#6d757a;

    font-size:9px;
    font-weight:700;
}


/* =========================================================
   STANDING
   ========================================================= */

.mcc-standing-table{
    min-width:700px;
}

.mcc-standing-table th{
    height:38px;

    padding:
        0
        8px;

    background:#f8f9fa;

    color:#858d92;

    font-size:9px;
    font-weight:700;
}

.mcc-standing-table td{
    height:48px;

    padding:
        0
        8px;

    color:#424a4f;

    font-size:11px;
    font-weight:600;
}

.mcc-standing-table
.mcc-col-team{
    min-width:175px;
}

.mcc-table-team{
    gap:9px;
}

.mcc-table-team img{
    width:25px;
    height:25px;

    flex-basis:25px;
}

.mcc-table-team span{
    color:#202529;

    font-size:12px;
    font-weight:700;
}

.mcc-standing-table
.mcc-points{
    color:#111417;

    font-size:12px;
    font-weight:700;
}

.mcc-position{
    width:23px;
    height:23px;

    border-radius:5px;

    font-size:10px;
}


/* =========================================================
   FORM
   ========================================================= */

.mcc-form{
    gap:4px;
}

.mcc-form span{
    width:20px;
    height:20px;

    font-size:8px;
    font-weight:600;
}


/* =========================================================
   RANKINGS
   ========================================================= */

.mcc-player-row{
    min-height:62px;

    padding:
        9px
        14px;

    grid-template-columns:
        24px
        40px
        minmax(0,1fr)
        auto;

    gap:9px;
}

.mcc-player-avatar{
    width:40px;
    height:40px;
}

.mcc-player-copy strong{
    color:#1b2023;

    font-size:12px;
    font-weight:700;
}

.mcc-player-copy span{
    color:#81898e;

    font-size:9px;
}

.mcc-player-value{
    color:#111417;

    font-size:19px;
    font-weight:700;
}


/* =========================================================
   NEXT MATCH
   ========================================================= */

.mcc-dashboard-center
.mcc-panel{
    border-color:var(--mcc-border);
}


/* =========================================================
   ANALYTICS
   ========================================================= */

.mcc-league-analytics{
    gap:18px;
    margin-top:18px;
}

.mcc-stat-cell{
    min-height:108px;

    padding:17px 18px;
}

.mcc-stat-cell > span{
    color:#858e93;

    font-size:9px;
    font-weight:700;
}

.mcc-stat-cell > strong{
    color:#111417;

    font-size:27px;
    font-weight:700;
}

.mcc-stat-cell > small{
    color:#81898e;

    font-size:10px;
}


/* =========================================================
   XRAY
   ========================================================= */

.mcc-season-xray{
    border-radius:9px;
}

.mcc-xray-block{
    padding:
        18px
        18px
        16px;
}

.mcc-xray-title strong{
    color:#1b2023;

    font-size:10px;
    font-weight:600;
}

.mcc-xray-title span{
    color:#8b9398;

    font-size:9px;
}

.mcc-xray-head-meta span,
.mcc-xray-head-meta strong{
    min-height:25px;

    font-size:9px;
}


/* =========================================================
   BUTTONS / FOOTERS
   ========================================================= */

.mcc-panel-more{
    min-height:42px;

    color:
        var(--mcc-green-dark);

    font-size:10px;
    font-weight:700;
}

.mcc-panel-more:hover{
    background:#f8fbf8;
}


/* =========================================================
   REMOVE OVER-STYLING
   ========================================================= */

.mcc-summary-card,
.mcc-panel,
.mcc-scoreline-card,
.mcc-card-stat{
    transition:
        border-color .15s ease,
        box-shadow .15s ease,
        background .15s ease;
}

.mcc-summary-card:hover,
.mcc-panel:hover{
    border-color:#d4dade;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:760px){

    .mcc-league-shell{
        width:calc(100% - 16px);
    }

    .mcc-league-content
    > .mcc-league-shell{
        padding-top:12px;
        padding-bottom:28px;
    }

    .mcc-summary-grid{
        gap:8px;
    }

    .mcc-summary-card{
        min-height:95px;

        padding:
            13px
            14px;
    }

    .mcc-summary-card > strong{
        font-size:26px;
    }

    .mcc-dashboard-grid,
    .mcc-dashboard-main,
    .mcc-dashboard-center,
    .mcc-dashboard-side,
    .mcc-league-analytics{
        gap:12px;
    }

    .mcc-panel-head{
        min-height:49px;

        padding:
            0
            14px;
    }

    .mcc-panel-head h2{
        font-size:15px;
    }

}


/* =========================================================
   FOTMOB-LIKE STANDING TABLE
   ========================================================= */

.mcc-standing-panel{
    overflow:hidden;
}

.mcc-standing-panel
.mcc-table-scroll{
    width:100%;
    overflow-x:auto;
    overflow-y:hidden;
    position:relative;

    scrollbar-width:thin;
    scrollbar-color:#b9c0c4 #f4f6f7;
}

.mcc-standing-fotmob{
    width:100%;
    min-width:690px;

    border-collapse:separate;
    border-spacing:0;

    table-layout:auto;
}


/* ---------------------------------------------------------
   HEAD
   --------------------------------------------------------- */

.mcc-standing-fotmob thead th{
    height:40px;

    padding:
        0
        8px;

    border-bottom:
        1px solid #e7ebed;

    background:#f8f9fa;

    color:#70797f;

    font-size:12px;
    line-height:1;

    font-weight:600;

    text-align:center;
    white-space:nowrap;
}

.mcc-standing-fotmob
thead
.mcc-col-team{
    text-align:left;
}


/* ---------------------------------------------------------
   ROW
   --------------------------------------------------------- */

.mcc-standing-fotmob tbody tr{
    --mcc-zone-color:transparent;

    position:relative;
}

.mcc-standing-fotmob tbody td{
    height:50px;

    padding:
        0
        8px;

    border-bottom:
        1px solid #edf0f2;

    background:#fff;

    color:#2b3236;

    font-size:11px;
    line-height:1;

    font-weight:600;

    text-align:center;

    white-space:nowrap;

    transition:
        background .12s ease;
}

.mcc-standing-fotmob tbody tr:hover td{
    background:#f8faf9;
}


/* ---------------------------------------------------------
   PROMOTION COLOR
   --------------------------------------------------------- */

.mcc-standing-fotmob
tbody
.mcc-col-pos{
    position:relative;
}

.mcc-standing-fotmob
tbody
.mcc-col-pos::before{
    content:"";

    width:2px;

    position:absolute;

    top:4px;
    bottom:4px;
    left:0;

    border-radius:
        0
        2px
        2px
        0;

    background:
        var(
            --mcc-zone-color,
            transparent
        );
}


/* ---------------------------------------------------------
   POSITION
   --------------------------------------------------------- */

.mcc-standing-fotmob
.mcc-col-pos{
    width:46px;
    min-width:46px;
}

.mcc-standing-fotmob
.mcc-position{
    width:auto;
    height:auto;

    padding:0;

    display:inline;

    border:0;
    border-radius:0;

    background:transparent;

    color:#171b1e;

    font-size:12px;
    line-height:1;

    font-weight:700;
}


/* ---------------------------------------------------------
   TEAM
   --------------------------------------------------------- */

.mcc-standing-fotmob
.mcc-col-team{
    width:auto;
    min-width:220px;

    text-align:left;
}

.mcc-standing-fotmob
.mcc-table-team{
    display:flex;
    align-items:center;

    gap:10px;

    min-width:0;
}

.mcc-standing-fotmob
.mcc-table-team img{
    width:24px;
    height:24px;

    flex:0 0 24px;

    object-fit:contain;
}

.mcc-standing-fotmob
.mcc-table-team span{
    overflow:hidden;

    color:#202529;

    font-size:14px;
    line-height:1.15;

    font-weight:700;

    text-overflow:ellipsis;
    white-space:nowrap;
}


/* ---------------------------------------------------------
   GOALS / POINTS
   --------------------------------------------------------- */

.mcc-standing-fotmob
.mcc-col-goals{
    min-width:48px;

    color:#2d3438;

    font-weight:700;
}

.mcc-standing-fotmob
.mcc-col-points{
    min-width:45px;
}

.mcc-standing-fotmob
.mcc-points{
    color:#111417;

    font-size:12px;
    font-weight:700;
}


/* ---------------------------------------------------------
   FORM
   --------------------------------------------------------- */

.mcc-standing-fotmob
.mcc-col-form{
    min-width:160px;

    padding-left:10px;
    padding-right:12px;
}

.mcc-fotmob-form{
    min-height:30px;

    display:flex;
    align-items:center;
    justify-content:flex-start;

    gap:5px;
}

.mcc-form-result{
    width:25px;
    height:25px;

    flex:0 0 25px;

    display:inline-flex;

    align-items:center;
    justify-content:center;

    border-radius:6px;

    color:#fff;

    font-family:
        "Barlow Condensed",
        "Arial Narrow",
        Arial,
        sans-serif;

    font-size:11px;
    line-height:1;

    font-weight:600;

    cursor:help;

    transition:
        transform .12s ease,
        opacity .12s ease;
}

.mcc-form-result:hover{
    transform:
        translateY(-1px);
}

.mcc-form-result.is-win{
    background:#05a773;
}

.mcc-form-result.is-draw{
    background:#9ca5aa;
}

.mcc-form-result.is-loss{
    background:#e63c45;
}


/* ---------------------------------------------------------
   NEXT OPPONENT
   --------------------------------------------------------- */

.mcc-next-opponent{
    width:27px;
    height:27px;

    margin-left:3px;

    flex:0 0 27px;

    display:inline-flex;

    align-items:center;
    justify-content:center;

    border:
        1px solid #e8ecee;

    border-radius:50%;

    background:#fff;

    cursor:help;
}

.mcc-next-opponent img{
    width:20px;
    height:20px;

    object-fit:contain;
}


/* ---------------------------------------------------------
   STICKY POSITION + TEAM
   --------------------------------------------------------- */

.mcc-standing-fotmob
.mcc-col-pos{
    position:sticky;
    left:0;
    z-index:4;

    background:#fff;
}

.mcc-standing-fotmob
.mcc-col-team{
    position:sticky;

    left:46px;

    z-index:3;

    background:#fff;

    box-shadow:
        5px 0 7px
        -7px
        rgba(18,28,34,.45);
}

.mcc-standing-fotmob thead
.mcc-col-pos,
.mcc-standing-fotmob thead
.mcc-col-team{
    z-index:7;

    background:#f8f9fa;
}

.mcc-standing-fotmob
tbody tr:hover
.mcc-col-pos,
.mcc-standing-fotmob
tbody tr:hover
.mcc-col-team{
    background:#f8faf9;
}


/* ---------------------------------------------------------
   SCROLLBAR
   --------------------------------------------------------- */

.mcc-standing-panel
.mcc-table-scroll::-webkit-scrollbar{
    height:7px;
}

.mcc-standing-panel
.mcc-table-scroll::-webkit-scrollbar-track{
    background:#f4f6f7;
}

.mcc-standing-panel
.mcc-table-scroll::-webkit-scrollbar-thumb{
    border-radius:999px;

    background:#b9c0c4;
}


/* ---------------------------------------------------------
   LEGEND
   --------------------------------------------------------- */

.mcc-standing-legend{
    min-height:45px;

    padding:
        0
        14px;

    display:flex;
    align-items:center;

    gap:16px;

    border-top:
        1px solid #edf0f2;

    background:#fff;
}

.mcc-standing-legend span{
    display:inline-flex;
    align-items:center;

    gap:5px;

    color:#747d82;

    font-size:9px;
    font-weight:600;
}

.mcc-standing-legend i{
    width:7px;
    height:7px;

    border-radius:2px;
}


/* ---------------------------------------------------------
   MOBILE
   --------------------------------------------------------- */

@media(max-width:700px){

    .mcc-standing-fotmob{
        min-width:670px;
    }

    .mcc-standing-fotmob
    .mcc-col-pos{
        width:40px;
        min-width:40px;
    }

    .mcc-standing-fotmob
    .mcc-col-team{
        left:40px;

        min-width:170px;
        max-width:170px;
    }

    .mcc-standing-fotmob
    .mcc-table-team span{
        max-width:125px;
    }

    .mcc-standing-fotmob
    tbody td{
        height:48px;
    }

    .mcc-standing-fotmob
    .mcc-col-form{
        min-width:150px;
    }

    .mcc-form-result{
        width:24px;
        height:24px;

        flex-basis:24px;
    }

}


/* =========================================================
   OVERVIEW STANDING — COMPACT SUMMARY MODE
   ========================================================= */

/*
 * Overview table is only a league summary.
 * Do not freeze position/team columns here.
 */

.mcc-standing-panel
.mcc-standing-fotmob
.mcc-col-pos,
.mcc-standing-panel
.mcc-standing-fotmob
.mcc-col-team{
    position:static!important;
    left:auto!important;
    z-index:auto!important;
    box-shadow:none!important;
}


/* ---------------------------------------------------------
   Make the overview table fit naturally inside the card
   --------------------------------------------------------- */

.mcc-standing-panel
.mcc-standing-fotmob{
    width:100%;
    min-width:0;
    table-layout:fixed;
}


/* position */

.mcc-standing-panel
.mcc-standing-fotmob
.mcc-col-pos{
    width:38px;
    min-width:38px;
}


/* team */

.mcc-standing-panel
.mcc-standing-fotmob
.mcc-col-team{
    width:210px;
    min-width:0;
}

.mcc-standing-panel
.mcc-standing-fotmob
.mcc-table-team span{
    max-width:160px;
}


/* numeric columns */

.mcc-standing-panel
.mcc-standing-fotmob th:not(.mcc-col-pos):not(.mcc-col-team):not(.mcc-col-form),
.mcc-standing-panel
.mcc-standing-fotmob td:not(.mcc-col-pos):not(.mcc-col-team):not(.mcc-col-form){
    width:42px;
}


/* goals */

.mcc-standing-panel
.mcc-standing-fotmob
.mcc-col-goals{
    width:52px;
}


/* points */

.mcc-standing-panel
.mcc-standing-fotmob
.mcc-col-points,
.mcc-standing-panel
.mcc-standing-fotmob
.mcc-points{
    width:45px;
}


/* form */

.mcc-standing-panel
.mcc-standing-fotmob
.mcc-col-form{
    width:145px;
    min-width:145px;
    padding-left:7px;
    padding-right:8px;
}

.mcc-standing-panel
.mcc-fotmob-form{
    gap:4px;
}


/* slightly smaller result pills in summary */

.mcc-standing-panel
.mcc-form-result{
    width:23px;
    height:23px;
    flex-basis:23px;

    border-radius:5px;

    font-size:10px;
}


/* next opponent */

.mcc-standing-panel
.mcc-next-opponent{
    width:25px;
    height:25px;
    flex-basis:25px;

    margin-left:2px;
}

.mcc-standing-panel
.mcc-next-opponent img{
    width:18px;
    height:18px;
}


/* row density */

.mcc-standing-panel
.mcc-standing-fotmob tbody td{
    height:49px;
}


/* Overview should not expose horizontal scroll visually */

.mcc-standing-panel
.mcc-table-scroll{
    overflow-x:hidden;
}


/* ---------------------------------------------------------
   Medium screens
   --------------------------------------------------------- */

@media(max-width:1100px){

    .mcc-standing-panel
    .mcc-standing-fotmob{
        min-width:650px;
        table-layout:auto;
    }

    .mcc-standing-panel
    .mcc-table-scroll{
        overflow-x:auto;
    }

    .mcc-standing-panel
    .mcc-standing-fotmob
    .mcc-col-team{
        min-width:180px;
    }

}


/* ---------------------------------------------------------
   Mobile
   --------------------------------------------------------- */

@media(max-width:700px){

    .mcc-standing-panel
    .mcc-standing-fotmob{
        min-width:640px;
    }

    .mcc-standing-panel
    .mcc-table-scroll{
        overflow-x:auto;
    }

    .mcc-standing-panel
    .mcc-standing-fotmob
    .mcc-col-team{
        min-width:165px;
    }

}


/* =========================================================
   STANDING — FORM + NEXT SEPARATION
   ========================================================= */

/*
 * Overview:
 *
 *   ... PTS | FORMA | PRÓX.
 *
 * Keep next opponent as its own final column.
 */

.mcc-standing-panel
.mcc-standing-fotmob
.mcc-col-form{
    width:92px;
    min-width:92px;

    padding-left:6px;
    padding-right:6px;

    text-align:center;
}

.mcc-standing-panel
.mcc-fotmob-form{
    display:flex;
    align-items:center;
    justify-content:center;

    gap:4px;
}


/* Next column */

.mcc-standing-fotmob
.mcc-col-next{
    width:52px;
    min-width:52px;

    padding-left:5px;
    padding-right:8px;

    text-align:center;
}

.mcc-standing-fotmob
thead
.mcc-col-next{
    color:#70797f;

    font-size:12px;
    font-weight:600;
}


/* opponent logo */

.mcc-standing-fotmob
.mcc-next-opponent{
    width:28px;
    height:28px;

    margin:0 auto;

    display:inline-flex;

    align-items:center;
    justify-content:center;

    border:0;
    border-radius:50%;

    background:transparent;

    cursor:help;
}

.mcc-standing-fotmob
.mcc-next-opponent img{
    width:23px;
    height:23px;

    display:block;

    object-fit:contain;
}

.mcc-standing-fotmob
.mcc-next-empty{
    color:#b6bdc1;

    font-size:11px;
}


/*
 * Result chips slightly closer to FotMob:
 * compact, but clearly separated.
 */

.mcc-standing-panel
.mcc-form-result{
    width:24px;
    height:24px;

    flex:0 0 24px;

    border-radius:6px;

    font-size:10px;
}


/*
 * No sticky columns in Overview.
 */

.mcc-standing-panel
.mcc-standing-fotmob
.mcc-col-pos,
.mcc-standing-panel
.mcc-standing-fotmob
.mcc-col-team{
    position:static!important;

    left:auto!important;

    z-index:auto!important;

    box-shadow:none!important;
}


/*
 * Desktop overview should fit without horizontal scrolling.
 */

@media(min-width:1101px){

    .mcc-standing-panel
    .mcc-standing-fotmob{
        width:100%;
        min-width:0;

        table-layout:fixed;
    }

    .mcc-standing-panel
    .mcc-table-scroll{
        overflow-x:hidden;
    }

}


/*
 * Smaller screens may scroll normally.
 */

@media(max-width:1100px){

    .mcc-standing-panel
    .mcc-standing-fotmob{
        min-width:700px;

        table-layout:auto;
    }

    .mcc-standing-panel
    .mcc-table-scroll{
        overflow-x:auto;
    }

}


/* =========================================================
   OVERVIEW STANDING — FINAL COMPACT LAYOUT
   Fit FORM + NEXT inside summary card
   ========================================================= */


/* ---------------------------------------------------------
   TABLE
   --------------------------------------------------------- */

.mcc-standing-panel
.mcc-table-scroll{
    width:100%;
    overflow-x:hidden;
}

.mcc-standing-panel
.mcc-standing-fotmob{
    width:100%;
    min-width:0!important;

    table-layout:fixed;
}


/* ---------------------------------------------------------
   POSITION
   --------------------------------------------------------- */

.mcc-standing-panel
.mcc-standing-fotmob
.mcc-col-pos{
    width:30px!important;
    min-width:30px!important;

    padding-left:5px;
    padding-right:3px;
}


/* ---------------------------------------------------------
   TEAM
   --------------------------------------------------------- */

.mcc-standing-panel
.mcc-standing-fotmob
.mcc-col-team{
    width:158px!important;
    min-width:0!important;

    padding-left:5px;
    padding-right:4px;
}

.mcc-standing-panel
.mcc-standing-fotmob
.mcc-table-team{
    gap:7px;
}

.mcc-standing-panel
.mcc-standing-fotmob
.mcc-table-team img{
    width:21px;
    height:21px;

    flex:0 0 21px;
}

.mcc-standing-panel
.mcc-standing-fotmob
.mcc-table-team span{
    max-width:123px;

    overflow:hidden;

    font-size:12px;

    text-overflow:ellipsis;
    white-space:nowrap;
}


/* ---------------------------------------------------------
   NORMAL NUMBER COLUMNS
   J / V / E / D
   --------------------------------------------------------- */

.mcc-standing-panel
.mcc-standing-fotmob
thead th:not(.mcc-col-pos):not(.mcc-col-team):not(.mcc-col-goals):not(.mcc-col-points):not(.mcc-col-form):not(.mcc-col-next),
.mcc-standing-panel
.mcc-standing-fotmob
tbody td:not(.mcc-col-pos):not(.mcc-col-team):not(.mcc-col-goals):not(.mcc-points):not(.mcc-col-form):not(.mcc-col-next){
    width:27px!important;

    padding-left:2px;
    padding-right:2px;
}


/* ---------------------------------------------------------
   GOALS
   --------------------------------------------------------- */

.mcc-standing-panel
.mcc-standing-fotmob
.mcc-col-goals{
    width:39px!important;
    min-width:39px!important;

    padding-left:2px;
    padding-right:2px;
}


/* ---------------------------------------------------------
   PTS
   --------------------------------------------------------- */

.mcc-standing-panel
.mcc-standing-fotmob
.mcc-col-points,
.mcc-standing-panel
.mcc-standing-fotmob
.mcc-points{
    width:34px!important;
    min-width:34px!important;
}


/* ---------------------------------------------------------
   FORM
   Latest result stays on the RIGHT
   --------------------------------------------------------- */

.mcc-standing-panel
.mcc-standing-fotmob
.mcc-col-form{
    width:66px!important;
    min-width:66px!important;

    padding-left:2px!important;
    padding-right:4px!important;

    text-align:right;
}

.mcc-standing-panel
.mcc-fotmob-form{
    width:100%;

    display:flex;
    align-items:center;
    justify-content:flex-end;

    gap:4px;
}


/*
 * Requested result colors
 */

.mcc-standing-panel
.mcc-form-result.is-win{
    background:#00985F!important;
}

.mcc-standing-panel
.mcc-form-result.is-loss{
    background:#DD3636!important;
}

.mcc-standing-panel
.mcc-form-result.is-draw{
    background:#8D9499!important;
}


.mcc-standing-panel
.mcc-form-result{
    width:22px;
    height:22px;

    flex:0 0 22px;

    border-radius:5px;

    font-size:9px;
}


/* ---------------------------------------------------------
   NEXT
   Always visible at far right
   --------------------------------------------------------- */

.mcc-standing-panel
.mcc-standing-fotmob
.mcc-col-next{
    width:38px!important;
    min-width:38px!important;

    padding-left:2px!important;
    padding-right:5px!important;

    text-align:center;
}

.mcc-standing-panel
.mcc-next-opponent{
    width:24px;
    height:24px;

    margin:0 auto;

    display:flex;
    align-items:center;
    justify-content:center;

    border:0;
    background:transparent;
}

.mcc-standing-panel
.mcc-next-opponent img{
    width:20px;
    height:20px;

    object-fit:contain;
}


/* ---------------------------------------------------------
   HEADER
   --------------------------------------------------------- */

.mcc-standing-panel
.mcc-standing-fotmob thead th{
    padding-left:2px;
    padding-right:2px;

    font-size:12px;
    letter-spacing:0;
}

.mcc-standing-panel
.mcc-standing-fotmob thead
.mcc-col-team{
    padding-left:5px;

    text-align:left;
}


/* ---------------------------------------------------------
   BODY
   --------------------------------------------------------- */

.mcc-standing-panel
.mcc-standing-fotmob tbody td{
    height:48px;

    font-size:12px;
}


/* ---------------------------------------------------------
   NO STICKY IN OVERVIEW
   --------------------------------------------------------- */

.mcc-standing-panel
.mcc-standing-fotmob
.mcc-col-pos,
.mcc-standing-panel
.mcc-standing-fotmob
.mcc-col-team{
    position:static!important;

    left:auto!important;
    right:auto!important;

    z-index:auto!important;

    box-shadow:none!important;
}


/* ---------------------------------------------------------
   MOBILE / SMALL SCREEN
   Full table may scroll there.
   --------------------------------------------------------- */

@media(max-width:760px){

    .mcc-standing-panel
    .mcc-standing-fotmob{
        min-width:620px!important;

        table-layout:auto;
    }

    .mcc-standing-panel
    .mcc-table-scroll{
        overflow-x:auto;
    }

    .mcc-standing-panel
    .mcc-standing-fotmob
    .mcc-col-team{
        min-width:150px!important;
    }

    .mcc-standing-panel
    .mcc-standing-fotmob
    .mcc-col-form{
        min-width:72px!important;
    }

    .mcc-standing-panel
    .mcc-standing-fotmob
    .mcc-col-next{
        min-width:42px!important;
    }
}


/* =========================================================
   LEAGUE GLOBAL ALIGNMENT
   Hero / tabs / dashboard share the same 1210px axis
   ========================================================= */

.mcc-league-root{
    --mcc-shell:1210px;
}


/* Hero */

.mcc-league-hero-main{
    width:min(
        var(--mcc-shell),
        calc(100% - 44px)
    )!important;

    margin-left:auto!important;
    margin-right:auto!important;

    padding-left:0!important;
    padding-right:0!important;
}


/* If hero has another inner wrapper, do not add
   another horizontal offset. */

.mcc-league-hero-main
.mcc-league-shell{
    width:100%!important;

    margin-left:0!important;
    margin-right:0!important;
}


/* Tabs */

.mcc-league-tabs-inner,
.mcc-league-tabs > .mcc-league-shell{
    width:min(
        var(--mcc-shell),
        calc(100% - 44px)
    )!important;

    margin-left:auto!important;
    margin-right:auto!important;
}


/* Main dashboard */

.mcc-league-content
> .mcc-league-shell{
    width:min(
        var(--mcc-shell),
        calc(100% - 44px)
    )!important;

    margin-left:auto!important;
    margin-right:auto!important;
}


/* Summary and dashboard start on the exact same line */

.mcc-summary-grid,
.mcc-dashboard-grid,
.mcc-league-analytics{
    width:100%;
    margin-left:0;
    margin-right:0;
}


/* Mobile */

@media(max-width:760px){

    .mcc-league-hero-main,
    .mcc-league-tabs-inner,
    .mcc-league-tabs > .mcc-league-shell,
    .mcc-league-content > .mcc-league-shell{
        width:calc(100% - 16px)!important;
    }

}


/* =========================================================
   SEASON RESULTS — VISUAL DONUT
   ========================================================= */

.mcc-season-results-panel{
    overflow:hidden;
}


/* Main visual area */

.mcc-season-results-panel
.mcc-season-performance{
    min-height:176px;

    padding:20px 18px;

    display:grid!important;

    grid-template-columns:
        112px
        minmax(0,1fr);

    align-items:center;

    gap:18px;
}


/* ---------------------------------------------------------
   DONUT
   --------------------------------------------------------- */

.mcc-season-results-panel
.mcc-season-performance-ring{
    --home:46.67;
    --draw:20;

    width:104px!important;
    height:104px!important;

    position:relative;

    display:flex!important;

    align-items:center;
    justify-content:center;

    border-radius:50%;

    background:
        conic-gradient(
            #00985F
                0
                calc(var(--home) * 1%),

            #8D9499
                calc(var(--home) * 1%)
                calc(
                    (
                        var(--home)
                        +
                        var(--draw)
                    )
                    * 1%
                ),

            #263238
                calc(
                    (
                        var(--home)
                        +
                        var(--draw)
                    )
                    * 1%
                )
                100%
        )!important;
}


/* White center */

.mcc-season-results-panel
.mcc-season-performance-ring::after{
    content:"";

    width:72px;
    height:72px;

    position:absolute;

    left:50%;
    top:50%;

    transform:
        translate(-50%,-50%);

    border-radius:50%;

    background:#fff;
}


/* Center text */

.mcc-season-results-panel
.mcc-season-performance-core{
    position:relative;

    z-index:2;

    display:flex;
    flex-direction:column;

    align-items:center;
    justify-content:center;

    text-align:center;
}

.mcc-season-results-panel
.mcc-season-performance-core strong{
    color:#111417;

    font-size:25px!important;
    line-height:1!important;

    font-weight:600;
}

.mcc-season-results-panel
.mcc-season-performance-core span{
    margin-top:5px;

    color:#7b8489;

    font-size:9px!important;
    line-height:1;

    font-weight:600;
}


/* ---------------------------------------------------------
   LEGEND
   --------------------------------------------------------- */

.mcc-season-results-panel
.mcc-season-performance-list{
    min-width:0;

    display:flex!important;
    flex-direction:column;

    gap:13px;
}

.mcc-season-results-panel
.mcc-season-performance-list > div{
    display:flex;

    align-items:center;
    justify-content:space-between;

    gap:12px;

    color:#596268;

    font-size:11px;
    font-weight:600;
}

.mcc-season-results-panel
.mcc-season-performance-list > div > span{
    min-width:0;

    display:flex;
    align-items:center;

    gap:7px;
}

.mcc-season-results-panel
.mcc-season-performance-list > div > strong{
    color:#111417;

    font-size:14px;
    line-height:1;

    font-weight:600;
}


/* legend dots */

.mcc-season-results-panel
.mcc-season-performance-list i{
    width:8px;
    height:8px;

    display:inline-block;

    flex:0 0 8px;

    border-radius:50%;
}

.mcc-season-results-panel
.is-home i{
    background:#00985F;
}

.mcc-season-results-panel
.is-draw i{
    background:#8D9499;
}

.mcc-season-results-panel
.is-away i{
    background:#263238;
}


/* ---------------------------------------------------------
   MOBILE
   --------------------------------------------------------- */

@media(max-width:760px){

    .mcc-season-results-panel
    .mcc-season-performance{
        grid-template-columns:
            96px
            minmax(0,1fr);

        gap:14px;

        min-height:155px;

        padding:
            16px
            14px;
    }

    .mcc-season-results-panel
    .mcc-season-performance-ring{
        width:90px!important;
        height:90px!important;
    }

    .mcc-season-results-panel
    .mcc-season-performance-ring::after{
        width:62px;
        height:62px;
    }

}


/* =========================================================
   RAIO-X DA TEMPORADA — VISUAL UPGRADE
   ========================================================= */

.mcc-season-xray{
    overflow:hidden;

    border:
        1px solid #dce3e6!important;

    border-radius:12px!important;

    background:#fff;

    box-shadow:
        0 3px 14px
        rgba(20,30,36,.035)!important;
}


/* =========================================================
   HEADER
   ========================================================= */

.mcc-season-xray
.mcc-panel-head{
    min-height:68px;

    padding:
        0
        18px;

    border-bottom:
        1px solid #e7ecee;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #fbfcfc 100%
        );
}

.mcc-season-xray
.mcc-panel-kicker{
    color:#879096;

    font-size:9px;
    font-weight:600;

    letter-spacing:.8px;
}

.mcc-season-xray
.mcc-panel-head h2{
    margin-top:4px;

    color:#111417;

    font-size:20px;
    line-height:1;

    font-weight:600;
}


/* Header metric badges */

.mcc-season-xray
.mcc-xray-head-meta{
    display:flex;
    align-items:center;

    gap:7px;
}

.mcc-season-xray
.mcc-xray-head-meta span,
.mcc-season-xray
.mcc-xray-head-meta strong{
    min-height:34px;

    padding:
        0
        12px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    border:
        1px solid #edf0f1;

    border-radius:8px;

    background:#f5f7f7;

    color:#364046;

    font-size:10px;
    font-weight:600;
}

.mcc-season-xray
.mcc-xray-head-meta strong{
    border-color:#d7f0e7;

    background:#eaf8f2;

    color:#08754c;
}


/* =========================================================
   MAIN ANALYTICS GRID
   ========================================================= */

.mcc-season-xray
.mcc-xray-grid{
    display:grid;

    grid-template-columns:
        minmax(0,1.58fr)
        minmax(290px,1fr);

    align-items:stretch;

    border-bottom:
        1px solid #e7ecee;
}


/* each analytics block */

.mcc-season-xray
.mcc-xray-block{
    min-width:0;

    padding:
        22px
        20px
        18px;
}

.mcc-season-xray
.mcc-xray-block + .mcc-xray-block{
    border-left:
        1px solid #e7ecee;
}


/* =========================================================
   TITLES
   ========================================================= */

.mcc-season-xray
.mcc-xray-title{
    margin-bottom:18px;

    display:flex;
    flex-direction:column;

    gap:4px;
}

.mcc-season-xray
.mcc-xray-title strong{
    color:#161b1e;

    font-size:14px;
    line-height:1;

    font-weight:600;
}

.mcc-season-xray
.mcc-xray-title span{
    color:#8a9398;

    font-size:10px;
    font-weight:600;
}


/* =========================================================
   GOALS BY DAY
   ========================================================= */

/*
 * Existing day bars get a more data-visual feel.
 */

.mcc-season-xray
.mcc-xray-day-chart{
    min-height:205px;

    padding:
        14px
        10px
        0;

    display:flex;
    align-items:flex-end;

    gap:16px;

    border-bottom:
        1px solid #e1e6e8;

    background:
        repeating-linear-gradient(
            to bottom,
            transparent 0,
            transparent 49px,
            #f0f3f4 50px
        );
}

.mcc-season-xray
.mcc-xray-day-item{
    min-width:0;
    height:100%;

    flex:1;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-end;
}

.mcc-season-xray
.mcc-xray-day-value{
    margin-bottom:7px;

    color:#1d2529;

    font-size:10px;
    font-weight:600;
}

.mcc-season-xray
.mcc-xray-day-bar{
    width:min(34px,70%);

    min-height:8px;

    border-radius:
        5px
        5px
        2px
        2px;

    background:
        linear-gradient(
            180deg,
            #19bd86 0%,
            #00985f 100%
        );

    box-shadow:
        inset 0 1px 0
        rgba(255,255,255,.25);
}

.mcc-season-xray
.mcc-xray-day-label{
    min-height:27px;

    margin-top:8px;

    color:#758086;

    font-size:9px;
    font-weight:700;
}


/* =========================================================
   GOALS PER MATCH
   ========================================================= */

.mcc-season-xray
.mcc-xray-goal-distribution{
    display:flex;
    flex-direction:column;

    gap:14px;
}

.mcc-season-xray
.mcc-xray-goal-row{
    display:grid;

    grid-template-columns:
        52px
        minmax(0,1fr)
        28px;

    align-items:center;

    gap:10px;
}

.mcc-season-xray
.mcc-xray-goal-row > span:first-child{
    color:#555f65;

    font-size:10px;
    font-weight:700;
}

.mcc-season-xray
.mcc-xray-goal-row > strong{
    color:#111417;

    font-size:11px;
    font-weight:700;

    text-align:right;
}

.mcc-season-xray
.mcc-xray-goal-track{
    height:7px;

    overflow:hidden;

    border-radius:999px;

    background:#e9edef;
}

.mcc-season-xray
.mcc-xray-goal-fill{
    height:100%;

    border-radius:inherit;

    background:
        linear-gradient(
            90deg,
            #00985f,
            #19b77f
        );
}


/* =========================================================
   FREQUENT SCORES
   ========================================================= */

.mcc-season-xray
.mcc-xray-scores{
    padding:
        20px
        18px
        18px;

    background:
        linear-gradient(
            180deg,
            #fff 0%,
            #fcfdfd 100%
        );
}

.mcc-season-xray
.mcc-xray-scores-title{
    margin-bottom:16px;
}

.mcc-season-xray
.mcc-xray-scores-title strong{
    display:block;

    color:#171c1f;

    font-size:14px;
    font-weight:600;
}

.mcc-season-xray
.mcc-xray-scores-title span{
    display:block;

    margin-top:4px;

    color:#8a9398;

    font-size:10px;
    font-weight:600;
}


/* score cards */

.mcc-season-xray
.mcc-xray-score-grid{
    display:grid;

    grid-template-columns:
        repeat(5,minmax(0,1fr));

    gap:10px;
}

.mcc-season-xray
.mcc-xray-score-card{
    min-height:104px;

    position:relative;

    padding:
        14px
        12px;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    border:
        1px solid #e0e5e7;

    border-radius:10px;

    background:#fff;

    transition:
        transform .14s ease,
        border-color .14s ease,
        box-shadow .14s ease;
}

.mcc-season-xray
.mcc-xray-score-card:hover{
    transform:
        translateY(-2px);

    border-color:#b9e7d6;

    box-shadow:
        0 7px 20px
        rgba(18,45,34,.07);
}


/* # rank badge */

.mcc-season-xray
.mcc-xray-score-card::before{
    content:
        attr(data-rank);

    min-width:25px;
    height:22px;

    position:absolute;

    top:9px;
    left:9px;

    padding:
        0
        6px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:6px;

    background:#f1f4f5;

    color:#7b858a;

    font-size:9px;
    font-weight:600;
}


/* first place */

.mcc-season-xray
.mcc-xray-score-card:first-child{
    border-color:#9ddfc7;

    background:
        linear-gradient(
            180deg,
            #f6fdfa 0%,
            #ffffff 100%
        );
}

.mcc-season-xray
.mcc-xray-score-card:first-child
.mcc-xray-score{
    color:#00985f;
}


/* score */

.mcc-season-xray
.mcc-xray-score{
    color:#121719;

    font-family:
        "Barlow Condensed",
        "Arial Narrow",
        Arial,
        sans-serif;

    font-size:27px;
    line-height:1;

    font-weight:600;
}

.mcc-season-xray
.mcc-xray-score-count{
    margin-top:6px;

    color:#747d82;

    font-size:10px;
    font-weight:600;
}


/* =========================================================
   DATA INSIGHT STRIP
   ========================================================= */

.mcc-season-xray::after{
    content:
        "Dados calculados a partir dos jogos concluídos da temporada";

    min-height:38px;

    padding:
        0
        18px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-top:
        1px solid #edf0f2;

    background:#fafbfb;

    color:#8b9499;

    font-size:11px;
    font-weight:600;

    text-align:center;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media(max-width:900px){

    .mcc-season-xray
    .mcc-xray-grid{
        grid-template-columns:1fr;
    }

    .mcc-season-xray
    .mcc-xray-block + .mcc-xray-block{
        border-left:0;

        border-top:
            1px solid #e7ecee;
    }

    .mcc-season-xray
    .mcc-xray-score-grid{
        grid-template-columns:
            repeat(3,minmax(0,1fr));
    }

}


@media(max-width:600px){

    .mcc-season-xray
    .mcc-xray-head-meta{
        flex-wrap:wrap;
    }

    .mcc-season-xray
    .mcc-xray-block{
        padding:
            17px
            14px;
    }

    .mcc-season-xray
    .mcc-xray-day-chart{
        gap:8px;
    }

    .mcc-season-xray
    .mcc-xray-score-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

}


/* =========================================================
   RAIO-X — FREQUENT SCORELINES
   ========================================================= */

.mcc-xray-scorelines{
    padding:
        22px
        20px
        20px;

    border-top:
        1px solid #e6ebed;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #fbfcfc 100%
        );
}


.mcc-xray-scorelines
.mcc-xray-title{
    margin-bottom:18px;
}


/* Grid */

.mcc-scoreline-grid{
    display:grid;

    grid-template-columns:
        repeat(5,minmax(0,1fr));

    gap:12px;
}


/* Card */

.mcc-scoreline-card{
    min-height:155px;

    position:relative;

    padding:
        14px
        10px
        16px;

    display:flex;

    flex-direction:column;

    align-items:center;
    justify-content:flex-end;

    border:
        1px solid #e1e6e8;

    border-radius:11px;

    background:#fff;

    transition:
        transform .14s ease,
        border-color .14s ease,
        box-shadow .14s ease;
}


.mcc-scoreline-card:hover{
    transform:
        translateY(-2px);

    border-color:#a9dfcd;

    box-shadow:
        0 8px 22px
        rgba(13,39,31,.06);
}


/* Rank */

.mcc-scoreline-rank{
    position:absolute;

    top:10px;
    left:10px;

    min-width:28px;
    height:23px;

    padding:
        0
        7px;

    display:inline-flex;

    align-items:center;
    justify-content:center;

    border-radius:6px;

    background:#f0f3f4;

    color:#778187;

    font-size:9px;
    font-weight:600;
}


/* Ring */

.mcc-scoreline-ring{
    width:58px;
    height:58px;

    margin-bottom:9px;

    position:relative;

    display:flex;

    align-items:center;
    justify-content:center;

    border-radius:50%;

    background:
        conic-gradient(
            #00985F
            calc(var(--score-pct) * 1%),

            #e9edef
            0
        );
}


.mcc-scoreline-ring::before{
    content:"";

    width:43px;
    height:43px;

    position:absolute;

    border-radius:50%;

    background:#fff;
}


.mcc-scoreline-ring > div{
    position:relative;

    z-index:2;

    color:#263036;

    font-size:11px;
    line-height:1;

    font-weight:600;
}


/* Score */

.mcc-scoreline-card > strong{
    color:#101518;

    font-size:25px!important;
    line-height:1!important;

    font-weight:600;
}


.mcc-scoreline-card > small{
    margin-top:6px;

    color:#778187;

    font-size:9px;

    font-weight:600;
}


/* #1 */

.mcc-scoreline-card:first-child{
    border-color:#93dbc2;

    background:
        linear-gradient(
            180deg,
            #f3fcf8 0%,
            #ffffff 100%
        );
}


.mcc-scoreline-card:first-child
.mcc-scoreline-rank{
    background:#daf4ea;

    color:#00784b;
}


.mcc-scoreline-card:first-child
> strong{
    color:#00985F;
}


/* Responsive */

@media(max-width:900px){

    .mcc-scoreline-grid{
        grid-template-columns:
            repeat(3,minmax(0,1fr));
    }

}


@media(max-width:560px){

    .mcc-scoreline-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .mcc-scoreline-card{
        min-height:145px;
    }

}


/* =========================================================
   RAIO-X — PREMIUM DATA VISUAL STYLE
   ========================================================= */

.mcc-season-xray{
    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #fbfdfc 100%
        )!important;

    border-color:#dce5e1!important;
}


/* subtle green atmosphere */

.mcc-season-xray
.mcc-xray-block:first-child{
    background:
        radial-gradient(
            circle at 65% 30%,
            rgba(0,152,95,.045),
            transparent 42%
        ),
        #fff;
}

.mcc-season-xray
.mcc-xray-block:last-child{
    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #fbfdfc 100%
        );
}


/* =========================================================
   INSIGHT CARDS
   ========================================================= */

.mcc-xray-insights{
    display:grid;

    grid-template-columns:
        repeat(4,minmax(0,1fr));

    border-top:
        1px solid #e7ece9;

    background:
        linear-gradient(
            180deg,
            #fbfdfc 0%,
            #f8fbf9 100%
        );
}

.mcc-xray-insights > div{
    min-height:92px;

    padding:
        14px
        12px;

    position:relative;

    display:grid;

    grid-template-columns:
        22px
        1fr;

    grid-template-areas:
        "icon value"
        "label label"
        "sub sub";

    align-items:center;

    border-right:
        1px solid #e4ebe7;
}

.mcc-xray-insights > div:last-child{
    border-right:0;
}

.mcc-xray-insights span{
    grid-area:icon;

    font-size:18px;
    font-weight:600;
}

.mcc-xray-insights strong{
    grid-area:value;

    font-size:19px;
    line-height:1;

    font-weight:700;
}

.mcc-xray-insights small{
    grid-area:label;

    margin-top:7px;

    color:#616c67;

    font-size:10px;
    font-weight:700;
}

.mcc-xray-insights em{
    grid-area:sub;

    margin-top:3px;

    color:#8a9490;

    font-size:9px;
    line-height:1.25;

    font-style:normal;
    font-weight:600;
}


/* semantic accent colors */

.mcc-xray-insights .is-max span,
.mcc-xray-insights .is-max strong{
    color:#00985F;
}

.mcc-xray-insights .is-average span,
.mcc-xray-insights .is-average strong{
    color:#E09A16;
}

.mcc-xray-insights .is-min span,
.mcc-xray-insights .is-min strong{
    color:#3987D8;
}

.mcc-xray-insights .is-trend span,
.mcc-xray-insights .is-trend strong{
    color:#8957D9;
}


/* =========================================================
   GREEN INSIGHT STRIP
   ========================================================= */

.mcc-xray-insight-strip{
    min-height:50px;

    margin:
        16px
        18px
        18px;

    padding:
        0
        15px;

    display:flex;

    align-items:center;

    gap:6px;

    border:
        1px solid #d7eee5;

    border-radius:9px;

    background:
        linear-gradient(
            90deg,
            #eefaf5 0%,
            #f7fcfa 100%
        );

    color:#437063;

    font-size:10px;
    font-weight:700;
}

.mcc-xray-insight-strip strong{
    color:#008c58;

    font-size:13px;
    font-weight:700;
}

.mcc-xray-insight-strip span{
    margin-left:auto;

    color:#8b9691;

    font-size:9px;
}


/* =========================================================
   GOAL DISTRIBUTION — richer bars
   ========================================================= */

.mcc-xray-goal-track{
    height:8px!important;

    background:#edf1ef!important;
}

.mcc-xray-goal-fill{
    position:relative;

    background:
        linear-gradient(
            90deg,
            #00985F 0%,
            #20B981 100%
        )!important;

    box-shadow:
        0 1px 3px
        rgba(0,152,95,.18);
}


/* =========================================================
   DAILY GOALS — depth
   ========================================================= */

.mcc-xray-day-bar{
    background:
        linear-gradient(
            180deg,
            #21C58D 0%,
            #00985F 100%
        )!important;

    box-shadow:
        0 5px 10px
        rgba(0,152,95,.13)!important;
}

.mcc-xray-day-value{
    color:#08784f!important;
}


/* =========================================================
   SCORELINE SECTION — stronger separation
   ========================================================= */

.mcc-xray-scorelines{
    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #f8fbf9 100%
        )!important;
}

.mcc-scoreline-card{
    border-color:#dce5e1!important;
}

.mcc-scoreline-card:first-child{
    border-color:#73d4b1!important;

    background:
        linear-gradient(
            180deg,
            #effbf6 0%,
            #ffffff 100%
        )!important;

    box-shadow:
        inset 0 0 0 1px
        rgba(0,152,95,.025);
}

.mcc-scoreline-ring{
    width:64px!important;
    height:64px!important;

    box-shadow:
        0 3px 12px
        rgba(0,152,95,.07);
}

.mcc-scoreline-ring::before{
    width:47px!important;
    height:47px!important;
}

.mcc-scoreline-ring > div{
    color:#26735b!important;

    font-size:12px!important;
    font-weight:700!important;
}


/* =========================================================
   Responsive
   ========================================================= */

@media(max-width:800px){

    .mcc-xray-insights{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .mcc-xray-insights > div:nth-child(2){
        border-right:0;
    }

    .mcc-xray-insights > div:nth-child(-n+2){
        border-bottom:
            1px solid #e4ebe7;
    }

}


@media(max-width:500px){

    .mcc-xray-insight-strip{
        align-items:flex-start;

        flex-wrap:wrap;

        padding:
            12px
            13px;
    }

    .mcc-xray-insight-strip span{
        width:100%;

        margin-left:0;
    }

}


/* =========================================================
   RAIO-X V4
   ISOLATED DESIGN — .mcc-rx-*
   ========================================================= */

.mcc-xray-v4{
    overflow:hidden;

    border:1px solid #dce5e1!important;
    border-radius:12px!important;

    background:#fff!important;

    box-shadow:
        0 5px 20px
        rgba(24,43,35,.035)!important;
}


/* =========================================================
   HEADER
   ========================================================= */

.mcc-rx-head{
    min-height:72px;

    padding:0 20px;

    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:20px;

    border-bottom:1px solid #e3eae6;

    background:
        linear-gradient(
            180deg,
            #ffffff,
            #fbfdfc
        );
}

.mcc-rx-kicker{
    display:block;

    color:#82908a;

    font-size:10px;
    line-height:1;

    font-weight:600;
    letter-spacing:.8px;
}

.mcc-rx-head h2{
    margin:5px 0 0!important;

    color:#101713;

    font-size:19px!important;
    line-height:1!important;

    font-weight:700!important;
}

.mcc-rx-head-stats{
    display:flex;
    align-items:center;

    gap:7px;
}

.mcc-rx-head-stats > *{
    min-height:34px;

    padding:0 12px;

    display:flex;
    align-items:center;
    justify-content:center;

    border:1px solid #edf1ef;
    border-radius:8px;

    background:#f4f7f5;

    color:#4c5953;

    font-size:9px;
    font-weight:600;
}

.mcc-rx-head-stats strong{
    border-color:#d3eee3;

    background:#e9f8f2;

    color:#008754;
}


/* =========================================================
   MAIN
   ========================================================= */

.mcc-rx-main{
    display:grid;

    grid-template-columns:
        minmax(0,1.6fr)
        minmax(300px,1fr);
}

.mcc-rx-trend,
.mcc-rx-distribution{
    min-width:0;

    padding:22px 20px 0;
}

.mcc-rx-distribution{
    border-left:1px solid #e3eae6;

    background:
        linear-gradient(
            180deg,
            #fff,
            #fbfdfc
        );
}


/* titles */

.mcc-rx-section-title{
    display:flex;
    flex-direction:column;

    gap:4px;
}

.mcc-rx-section-title > strong{
    color:#17201b;

    font-size:15px;
    line-height:1;

    font-weight:700;
}

.mcc-rx-section-title > span{
    color:#8a9690;

    font-size:11px;
    line-height:1;

    font-weight:600;
}


/* =========================================================
   CHART
   ========================================================= */

.mcc-rx-chart{
    height:220px;

    margin-top:18px;

    position:relative;

    overflow:hidden;

    border-bottom:1px solid #dfe7e3;
}

.mcc-rx-chart-grid{
    position:absolute;
    inset:0 0 27px;

    display:flex;
    flex-direction:column;
    justify-content:space-between;
}

.mcc-rx-chart-grid i{
    display:block;
    height:1px;

    background:#edf2ef;
}

.mcc-rx-bars{
    height:100%;

    padding:0 8px;

    display:flex;
    align-items:flex-end;

    gap:14px;

    position:relative;
    z-index:2;
}

.mcc-rx-bar{
    height:100%;

    min-width:0;

    flex:1;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-end;
}

.mcc-rx-bar > strong{
    margin-bottom:7px;

    color:#008d59;

    font-size:14px;
    font-weight:700;
}

.mcc-rx-bar > div{
    width:100%;
    height:150px;

    display:flex;
    align-items:flex-end;
    justify-content:center;
}

.mcc-rx-bar > div > i{
    width:min(34px,55%);

    display:block;

    border-radius:5px 5px 1px 1px;

    background:
        linear-gradient(
            180deg,
            #20c58b,
            #00985f
        );

    box-shadow:
        0 5px 13px
        rgba(0,152,95,.14);
}

.mcc-rx-bar > span{
    height:27px;

    padding-top:8px;

    color:#69766f;

    font-size:12px;

    font-weight:700;
}


/* SVG actual trend */

.mcc-rx-trend-svg{
    width:calc(100% - 42px);
    height:145px;

    position:absolute;

    left:21px;
    top:25px;

    z-index:3;

    overflow:visible;

    color:rgba(0,152,95,.48);

    pointer-events:none;
}


/* =========================================================
   INSIGHTS
   ========================================================= */

.mcc-rx-insights{
    min-height:96px;

    margin:
        17px
        -20px
        0;

    display:grid;

    grid-template-columns:
        repeat(4,minmax(0,1fr));

    border-top:1px solid #e4ebe7;

    background:
        linear-gradient(
            180deg,
            #fbfdfc,
            #f7faf8
        );
}

.mcc-rx-insights article{
    min-width:0;

    padding:15px 13px;

    display:grid;

    grid-template-columns:
        20px
        minmax(0,1fr);

    grid-template-areas:
        "icon value"
        "label label"
        "sub sub";

    align-content:center;

    border-right:1px solid #e5ebe8;
}

.mcc-rx-insights article:last-child{
    border-right:0;
}

.mcc-rx-insights svg{
    grid-area:icon;

    width:16px;
    height:16px;

    fill:none;

    stroke:currentColor;
    stroke-width:1.8;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.mcc-rx-insights strong{
    grid-area:value;

    font-size:18px!important;
    line-height:1!important;

    font-weight:700!important;
}

.mcc-rx-insights span{
    grid-area:label;

    margin-top:7px;

    color:#5c6862;

    font-size:12px;

    font-weight:700;
}

.mcc-rx-insights small{
    grid-area:sub;

    min-height:11px;

    margin-top:3px;

    color:#8b9690;

    font-size:11px;
    line-height:1.25;
}

.mcc-rx-insights .is-green{
    color:#00985F;
}

.mcc-rx-insights .is-orange{
    color:#E39918;
}

.mcc-rx-insights .is-blue{
    color:#3C89DB;
}

.mcc-rx-insights .is-purple{
    color:#8957DE;
}


/* =========================================================
   GOAL DISTRIBUTION
   ========================================================= */

.mcc-rx-dist-list{
    margin-top:20px;

    display:flex;
    flex-direction:column;

    gap:13px;
}

.mcc-rx-dist-row{
    display:grid;

    grid-template-columns:
        25px
        50px
        minmax(80px,1fr)
        20px
        32px;

    align-items:center;

    gap:7px;
}

.mcc-rx-ball{
    width:22px;
    height:22px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

    background:#f1f4f3;

    color:#66736d;
}

.mcc-rx-ball svg{
    width:15px;
    height:15px;

    fill:none;

    stroke:currentColor;
    stroke-width:1.45;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.mcc-rx-dist-label{
    color:#58655f;

    font-size:11px;

    font-weight:700;
}

.mcc-rx-track{
    height:7px;

    overflow:hidden;

    border-radius:999px;

    background:#e9efec;
}

.mcc-rx-track i{
    height:100%;

    display:block;

    border-radius:999px;

    background:
        linear-gradient(
            90deg,
            #00985F,
            #22BA84
        );

    box-shadow:
        0 1px 3px
        rgba(0,152,95,.15);
}

.mcc-rx-dist-row > strong{
    color:#17201b;

    font-size:11px!important;

    font-weight:700!important;

    text-align:right;
}

.mcc-rx-dist-row > small{
    color:#7d8983;

    font-size:10px;

    text-align:right;
}


/* =========================================================
   GREEN NOTE
   ========================================================= */

.mcc-rx-green-note{
    min-height:53px;

    margin:21px 0 18px;

    padding:0 14px;

    display:flex;
    align-items:center;

    gap:5px;

    border:1px solid #d5eee4;

    border-radius:8px;

    background:
        linear-gradient(
            90deg,
            #edf9f4,
            #f7fcfa
        );

    color:#497166;

    font-size:11px;

    font-weight:700;
}

.mcc-rx-green-note svg{
    width:15px;
    height:15px;

    flex:0 0 15px;

    fill:none;

    stroke:#00985F;
    stroke-width:1.7;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.mcc-rx-green-note strong{
    color:#008955;

    font-size:11px!important;

    font-weight:700!important;
}


/* =========================================================
   SCORELINES
   ========================================================= */

.mcc-rx-scorelines{
    padding:
        22px
        20px
        0;

    border-top:1px solid #e3eae6;

    background:
        linear-gradient(
            180deg,
            #ffffff,
            #f9fcfa
        );
}

.mcc-rx-score-grid{
    margin-top:17px;

    display:grid;

    grid-template-columns:
        repeat(5,minmax(0,1fr));

    gap:12px;
}

.mcc-rx-score-card{
    min-width:0;
    min-height:180px;

    position:relative;

    padding:
        13px
        10px
        12px;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-end;

    border:1px solid #dde5e1;

    border-radius:10px;

    background:#fff;

    transition:
        transform .14s ease,
        border-color .14s ease,
        box-shadow .14s ease;
}

.mcc-rx-score-card:hover{
    transform:translateY(-2px);

    border-color:#acdcca;

    box-shadow:
        0 8px 20px
        rgba(19,47,36,.06);
}

.mcc-rx-score-card.is-first{
    border-color:#71d3af;

    background:
        linear-gradient(
            180deg,
            #effbf6,
            #ffffff
        );
}

.mcc-rx-score-rank{
    min-width:28px;
    height:22px;

    position:absolute;

    top:10px;
    left:10px;

    padding:0 6px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:6px;

    background:#eff3f1;

    color:#7e8983;

    font-size:10px;

    font-weight:700;
}

.mcc-rx-score-card.is-first
.mcc-rx-score-rank{
    background:#daf4e9;
    color:#007b4c;
}


/* donut */

.mcc-rx-score-ring{
    width:65px;
    height:65px;

    margin-bottom:11px;

    position:relative;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

    background:
        conic-gradient(
            #00985F
            calc(var(--score-pct) * 1%),

            #e7eeea
            0
        );
}

.mcc-rx-score-ring::before{
    content:"";

    width:48px;
    height:48px;

    position:absolute;

    border-radius:50%;

    background:#fff;
}

.mcc-rx-score-ring strong{
    position:relative;

    z-index:2;

    color:#31715c;

    font-size:13px!important;

    font-weight:700!important;
}

.mcc-rx-score-card > b{
    color:#111713;

    font-size:25px;
    line-height:1;

    font-weight:700;
}

.mcc-rx-score-card.is-first > b{
    color:#00985F;
}

.mcc-rx-score-card > small{
    margin-top:5px;

    color:#78847e;

    font-size:10px;

    font-weight:700;
}


/* team logos */

.mcc-rx-score-teams{
    min-height:28px;

    margin-top:9px;

    display:flex;
    align-items:center;
    justify-content:center;

    gap:7px;
}

.mcc-rx-score-teams img{
    width:24px;
    height:24px;

    object-fit:contain;
}


/* footer */

.mcc-rx-footer{
    min-height:40px;

    margin:
        18px
        -20px
        0;

    display:flex;
    align-items:center;
    justify-content:center;

    border-top:1px solid #e6ece9;

    background:#f9fbfa;

    color:#909a95;

    font-size:11px;

    text-align:center;
}


/* =========================================================
   EMPTY
   ========================================================= */

.mcc-rx-empty{
    min-height:180px;

    display:flex;
    align-items:center;
    justify-content:center;

    color:#939d98;

    font-size:11px;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media(max-width:900px){

    .mcc-rx-main{
        grid-template-columns:1fr;
    }

    .mcc-rx-distribution{
        border-left:0;

        border-top:1px solid #e3eae6;
    }

    .mcc-rx-score-grid{
        grid-template-columns:
            repeat(3,minmax(0,1fr));
    }

}


@media(max-width:600px){

    .mcc-rx-head{
        padding:14px;

        align-items:flex-start;

        flex-direction:column;
    }

    .mcc-rx-head-stats{
        width:100%;
    }

    .mcc-rx-insights{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .mcc-rx-score-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .mcc-rx-dist-row{
        grid-template-columns:
            22px
            44px
            minmax(70px,1fr)
            18px
            28px;
    }

}


/* =========================================================
   RAIO-X V4 — Y AXIS / CHART FINAL TUNING
   ========================================================= */

.mcc-rx-chart{
    padding-left:34px;
}


/* Y axis */

.mcc-rx-yaxis{
    width:28px;

    position:absolute;

    top:0;
    bottom:27px;
    left:0;

    z-index:5;

    display:flex;
    flex-direction:column;

    align-items:flex-end;
    justify-content:space-between;

    padding-right:7px;

    pointer-events:none;
}

.mcc-rx-yaxis span{
    color:#8a9590;

    font-size:8px;
    line-height:1;

    font-weight:600;

    transform:translateY(50%);
}

.mcc-rx-yaxis span:first-child{
    transform:none;
}

.mcc-rx-yaxis span:last-child{
    transform:none;
}


/* Grid starts after Y axis */

.mcc-rx-chart-grid{
    left:34px;
}


/* Bars align with grid */

.mcc-rx-bars{
    padding-left:10px;
    padding-right:8px;
}


/* Trend line must start inside plot, not Y-axis */

.mcc-rx-trend-svg{
    width:calc(100% - 70px);

    left:47px;
}


/* A little more breathing room like the reference */

.mcc-rx-trend{
    padding-top:22px;
}

.mcc-rx-insights{
    margin-top:18px;
}


/* Insight row cleaner / closer to reference */

.mcc-rx-insights article{
    min-height:94px;

    padding:
        15px
        15px;
}

.mcc-rx-insights strong{
    font-size:17px!important;
}

.mcc-rx-insights span{
    margin-top:8px;

    font-size:12px;
}

.mcc-rx-insights small{
    margin-top:4px;
}


/* Distribution right side vertical rhythm */

.mcc-rx-dist-list{
    margin-top:22px;
}

.mcc-rx-green-note{
    margin-top:22px;
}


/* =========================================================
   LEAGUE HERO — META + ACTIONS FINAL ALIGNMENT
   ========================================================= */


/* ---------------------------------------------------------
   HERO MAIN
   Keep brand and actions vertically balanced
   --------------------------------------------------------- */

.mcc-league-hero-main{
    display:flex!important;

    align-items:center!important;
    justify-content:space-between!important;

    gap:30px;
}


/* =========================================================
   SEASON + TYPE
   ========================================================= */

.mcc-league-meta{
    margin-top:14px!important;

    display:flex!important;
    align-items:center!important;

    gap:10px!important;
}


/* Remove label-specific vertical differences */

.mcc-season-select{
    height:38px!important;

    margin:0!important;
    padding:0!important;

    display:flex!important;
    align-items:center!important;

    line-height:1!important;
}


/* Season dropdown */

.mcc-season-select select{
    height:38px!important;
    min-height:38px!important;

    margin:0!important;

    padding:
        0
        36px
        0
        13px!important;

    display:block;

    border:
        1px solid
        rgba(255,255,255,.18)!important;

    border-radius:5px!important;

    background-color:
        rgba(255,255,255,.025)!important;

    color:#fff!important;
        sans-serif!important;

    line-height:36px!important;

    text-transform:uppercase;

    box-shadow:none!important;
}


/* Liga badge — same exact geometry */

.mcc-league-meta
.mcc-league-type{
    width:auto!important;
    min-width:48px!important;

    height:38px!important;
    min-height:38px!important;

    margin:0!important;

    padding:
        0
        13px!important;

    display:inline-flex!important;

    align-items:center!important;
    justify-content:center!important;

    border:
        1px solid
        rgba(255,255,255,.18)!important;

    border-radius:5px!important;

    background:
        rgba(255,255,255,.025)!important;

    color:#fff!important;

        sans-serif!important;

    line-height:1!important;

    box-sizing:border-box!important;
}


/* =========================================================
   FAVORITE + SHARE
   ========================================================= */

.mcc-league-actions{
    display:flex!important;

    flex-direction:row!important;

    align-items:center!important;
    justify-content:flex-end!important;

    align-self:center!important;

    gap:10px!important;

    margin:0!important;
}


/* Common button */

.mcc-league-action{
    height:38px!important;
    min-height:38px!important;

    margin:0!important;

    padding:
        0
        14px!important;

    display:inline-flex!important;

    align-items:center!important;
    justify-content:center!important;

    gap:7px!important;

    border:
        1px solid
        rgba(255,255,255,.2)!important;

    border-radius:5px!important;

    background:
        rgba(255,255,255,.02)!important;

    color:#fff!important;

        sans-serif!important;

    line-height:1!important;

    white-space:nowrap;

    cursor:pointer;

    transition:
        background .15s ease,
        border-color .15s ease,
        transform .15s ease;
}


.mcc-league-action:hover{
    transform:translateY(-1px);

    border-color:
        rgba(255,255,255,.36)!important;

    background:
        rgba(255,255,255,.055)!important;
}


/* SVG common */

.mcc-league-action svg{
    width:15px;
    height:15px;

    flex:0 0 15px;

    fill:none;

    stroke:currentColor;
    stroke-width:1.8;

    stroke-linecap:round;
    stroke-linejoin:round;
}


/* Favourite */

.mcc-league-action.is-favorite{
    color:#fff!important;
}

.mcc-league-action.is-favorite svg{
    stroke:#fff;
}


/* Share */

.mcc-league-action.is-share svg{
    color:#32b94b;

    stroke:#32b94b;
}


/* Slightly different widths give the pair better balance */

.mcc-league-action.is-favorite{
    min-width:105px;
}

.mcc-league-action.is-share{
    min-width:118px;
}


/* =========================================================
   DESKTOP PLACEMENT
   ========================================================= */

@media(min-width:761px){

    .mcc-league-actions{
        margin-left:auto!important;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:760px){

    .mcc-league-hero-main{
        align-items:flex-start!important;

        flex-direction:column!important;

        gap:14px!important;
    }

    .mcc-league-actions{
        width:100%;

        justify-content:flex-start!important;
    }

    .mcc-league-meta{
        flex-wrap:wrap;
    }

}


/* =========================================================
   MOBILE LEAGUE OVERVIEW V1
   compact / no horizontal module scrolling
   ========================================================= */

@media(max-width:760px){

    /* =====================================================
       GLOBAL
       ===================================================== */

    .mcc-league-root,
    .mcc-league-content,
    .mcc-league-shell,
    .mcc-dashboard-grid,
    .mcc-dashboard-main,
    .mcc-dashboard-middle,
    .mcc-dashboard-side,
    .mcc-panel,
    .mcc-season-xray{
        width:100%!important;
        max-width:100%!important;
        min-width:0!important;

        box-sizing:border-box!important;
    }


    .mcc-league-content{
        overflow-x:hidden!important;
    }


    /* =====================================================
       HERO
       ===================================================== */

    .mcc-league-hero-main{
        width:calc(100% - 16px)!important;

        padding:
            18px
            12px
            16px!important;

        gap:12px!important;
    }


    /*
     * Keep league identity + logo compact.
     */

    .mcc-league-brand{
        width:100%;
        min-width:0;
    }


    /*
     * Season / Liga stay on one line.
     */

    .mcc-league-meta{
        width:100%;

        display:flex!important;
        align-items:center!important;

        gap:8px!important;

        flex-wrap:nowrap!important;
    }


    .mcc-season-select{
        min-width:0;
        flex:1 1 auto;
    }


    .mcc-season-select select{
        width:100%!important;
        min-width:0!important;

        height:38px!important;

        padding-left:11px!important;
        padding-right:28px!important;

        font-size:12px!important;
    }


    .mcc-league-meta
    .mcc-league-type{
        min-width:48px!important;

        flex:0 0 48px;

        height:38px!important;

        padding:0 8px!important;
    }


    /* =====================================================
       HERO ACTIONS — ICON ONLY
       ===================================================== */

    .mcc-league-actions{
        width:auto!important;

        margin-top:0!important;

        display:flex!important;
        align-items:center!important;

        gap:8px!important;
    }


    .mcc-league-action{
        width:40px!important;
        min-width:40px!important;
        height:40px!important;

        padding:0!important;

        border-radius:7px!important;
    }


    .mcc-league-action span{
        display:none!important;
    }


    .mcc-league-action svg{
        width:18px!important;
        height:18px!important;

        flex:0 0 18px!important;
    }


    .mcc-league-action.is-share svg{
        color:#32b94b!important;
        stroke:#32b94b!important;
    }


    /*
     * Actions directly below/right of meta instead
     * of occupying a wide full row.
     */

    .mcc-league-actions{
        align-self:flex-start!important;
    }


    /* =====================================================
       LEAGUE TABS
       ===================================================== */

    .mcc-league-tabs{
        overflow:hidden!important;
    }


    .mcc-league-tabs-inner{
        width:100%!important;

        padding:
            0
            8px!important;

        display:flex!important;
        flex-wrap:wrap!important;

        gap:0!important;

        overflow:visible!important;
    }


    .mcc-league-tab{
        min-width:25%;

        flex:
            0
            0
            25%;

        padding:
            14px
            4px!important;

        text-align:center;

        font-size:12px!important;
    }


    /* =====================================================
       DASHBOARD — ONE COLUMN
       ===================================================== */

    .mcc-dashboard-grid{
        display:block!important;
    }


    .mcc-dashboard-main,
    .mcc-dashboard-middle,
    .mcc-dashboard-side{
        display:block!important;

        width:100%!important;

        margin:0!important;
    }


    .mcc-dashboard-middle > *,
    .mcc-dashboard-side > *,
    .mcc-dashboard-main > *{
        width:100%!important;
        max-width:100%!important;

        margin-left:0!important;
        margin-right:0!important;
    }


    /* =====================================================
       STANDING — MOBILE OVERVIEW
       ONLY:
       # | TIME | J | PTS | FORMA
       ===================================================== */

    .mcc-standing-panel{
        overflow:hidden!important;
    }


    .mcc-standing-panel
    .mcc-table-scroll{
        width:100%!important;

        overflow-x:hidden!important;
        overflow-y:visible!important;
    }


    .mcc-standing-panel
    .mcc-standing-fotmob{
        width:100%!important;
        min-width:0!important;

        table-layout:fixed!important;
    }


    /*
     * Current columns:
     *
     * 1  #
     * 2  TIME
     * 3  J
     * 4  V
     * 5  E
     * 6  D
     * 7  G
     * 8  SG
     * 9  PTS
     * 10 FORMA
     * 11 PRÓX.
     *
     * Overview mobile does not need the full table.
     */

    .mcc-standing-panel
    .mcc-standing-fotmob
    th:nth-child(4),
    .mcc-standing-panel
    .mcc-standing-fotmob
    td:nth-child(4),

    .mcc-standing-panel
    .mcc-standing-fotmob
    th:nth-child(5),
    .mcc-standing-panel
    .mcc-standing-fotmob
    td:nth-child(5),

    .mcc-standing-panel
    .mcc-standing-fotmob
    th:nth-child(6),
    .mcc-standing-panel
    .mcc-standing-fotmob
    td:nth-child(6),

    .mcc-standing-panel
    .mcc-standing-fotmob
    th:nth-child(7),
    .mcc-standing-panel
    .mcc-standing-fotmob
    td:nth-child(7),

    .mcc-standing-panel
    .mcc-standing-fotmob
    th:nth-child(8),
    .mcc-standing-panel
    .mcc-standing-fotmob
    td:nth-child(8),

    .mcc-standing-panel
    .mcc-standing-fotmob
    th:nth-child(11),
    .mcc-standing-panel
    .mcc-standing-fotmob
    td:nth-child(11){
        display:none!important;
    }


    /* # */

    .mcc-standing-panel
    .mcc-standing-fotmob
    .mcc-col-pos{
        width:34px!important;
        min-width:34px!important;

        padding:
            0
            4px!important;
    }


    /* Team */

    .mcc-standing-panel
    .mcc-standing-fotmob
    .mcc-col-team{
        width:auto!important;
        min-width:0!important;

        padding:
            0
            5px!important;
    }


    .mcc-standing-panel
    .mcc-standing-fotmob
    .mcc-table-team{
        gap:7px!important;
    }


    .mcc-standing-panel
    .mcc-standing-fotmob
    .mcc-table-team img{
        width:22px!important;
        height:22px!important;

        flex:
            0
            0
            22px!important;
    }


    .mcc-standing-panel
    .mcc-standing-fotmob
    .mcc-table-team span{
        max-width:none!important;

        overflow:hidden;

        font-size:11px!important;

        text-overflow:ellipsis;
        white-space:nowrap;
    }


    /* J */

    .mcc-standing-panel
    .mcc-standing-fotmob
    th:nth-child(3),
    .mcc-standing-panel
    .mcc-standing-fotmob
    td:nth-child(3){
        width:32px!important;
    }


    /* PTS */

    .mcc-standing-panel
    .mcc-standing-fotmob
    th:nth-child(9),
    .mcc-standing-panel
    .mcc-standing-fotmob
    td:nth-child(9){
        width:38px!important;
    }


    /* Form */

    .mcc-standing-panel
    .mcc-standing-fotmob
    .mcc-col-form{
        width:66px!important;
        min-width:66px!important;

        padding:
            0
            5px!important;
    }


    .mcc-standing-panel
    .mcc-fotmob-form{
        width:100%;

        justify-content:flex-end!important;

        gap:3px!important;
    }


    .mcc-standing-panel
    .mcc-form-result{
        width:20px!important;
        height:20px!important;

        flex:
            0
            0
            20px!important;

        border-radius:5px!important;

        font-size:9px!important;
    }


    .mcc-standing-panel
    .mcc-standing-fotmob
    thead th{
        height:36px!important;

        padding:
            0
            3px!important;

        font-size:9px!important;
    }


    .mcc-standing-panel
    .mcc-standing-fotmob
    tbody td{
        height:48px!important;

        padding-top:0!important;
        padding-bottom:0!important;
    }


    /* =====================================================
       NEXT MATCH
       ===================================================== */

    .mcc-next-panel,
    .mcc-next-match,
    .mcc-next-match-card{
        width:100%!important;
        max-width:100%!important;

        overflow:hidden!important;
    }


    /* =====================================================
       SEASON RESULT DONUT
       ===================================================== */

    .mcc-season-results-panel
    .mcc-season-performance{
        width:100%!important;

        grid-template-columns:
            100px
            minmax(0,1fr)!important;

        gap:18px!important;

        padding:
            18px
            16px!important;
    }


    /* =====================================================
       RAIO-X
       ===================================================== */

    .mcc-xray-v4{
        width:100%!important;

        overflow:hidden!important;
    }


    .mcc-rx-head{
        width:100%!important;

        padding:
            15px
            14px!important;

        gap:12px!important;
    }


    .mcc-rx-head-stats{
        width:100%!important;

        display:grid!important;

        grid-template-columns:
            repeat(3,minmax(0,1fr));

        gap:7px!important;
    }


    .mcc-rx-head-stats > *{
        min-width:0!important;

        padding:
            0
            5px!important;
    }


    .mcc-rx-main{
        width:100%;

        display:block!important;
    }


    .mcc-rx-trend,
    .mcc-rx-distribution{
        width:100%!important;

        padding:
            20px
            14px
            0!important;

        border-left:0!important;
    }


    .mcc-rx-distribution{
        border-top:
            1px solid
            #e3eae6!important;
    }


    /*
     * Chart must fit viewport.
     */

    .mcc-rx-chart{
        width:100%!important;

        padding-left:27px!important;

        overflow:hidden!important;
    }


    .mcc-rx-bars{
        width:100%;

        gap:5px!important;

        padding:
            0
            3px!important;
    }


    .mcc-rx-bar > div > i{
        width:min(25px,65%)!important;
    }


    .mcc-rx-trend-svg{
        width:
            calc(
                100%
                -
                52px
            )!important;

        left:37px!important;
    }


    /*
     * 4 insights:
     * 2 x 2 on mobile.
     */

    .mcc-rx-insights{
        width:
            calc(
                100%
                +
                28px
            );

        margin:
            16px
            -14px
            0!important;

        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            )!important;
    }


    .mcc-rx-insights article{
        min-height:91px!important;

        padding:
            13px
            12px!important;
    }


    .mcc-rx-insights article:nth-child(2){
        border-right:0!important;
    }


    .mcc-rx-insights article:nth-child(-n+2){
        border-bottom:
            1px solid
            #e5ebe8;
    }


    /*
     * Goal distribution cannot overflow.
     */

    .mcc-rx-dist-row{
        width:100%;

        grid-template-columns:
            22px
            42px
            minmax(0,1fr)
            18px
            29px!important;

        gap:5px!important;
    }


    .mcc-rx-green-note{
        width:100%!important;

        box-sizing:border-box;
    }


    /* =====================================================
       FREQUENT SCORES
       ===================================================== */

    .mcc-rx-scorelines{
        width:100%!important;

        padding:
            20px
            14px
            0!important;

        overflow:hidden!important;
    }


    .mcc-rx-score-grid{
        width:100%!important;

        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            )!important;

        gap:10px!important;
    }


    .mcc-rx-score-card{
        width:100%!important;
        min-width:0!important;

        min-height:156px!important;
    }


    /*
     * Last odd item spans the row,
     * instead of leaving an awkward hole.
     */

    .mcc-rx-score-card:last-child:nth-child(odd){
        grid-column:
            1
            /
            -1;

        width:
            calc(
                50%
                -
                5px
            )!important;

        justify-self:start;
    }


    .mcc-rx-footer{
        white-space:normal!important;

        padding:
            10px
            14px;

        line-height:1.4;
    }


    /* =====================================================
       RANKINGS / CARDS
       ===================================================== */

    .mcc-ranking-panel,
    .mcc-cards-panel{
        width:100%!important;
        max-width:100%!important;

        overflow:hidden!important;
    }


    /*
     * prevent a single row / text from enlarging card
     */

    .mcc-player-row,
    .mcc-ranking-row{
        min-width:0!important;
    }


    /* =====================================================
       ABSOLUTELY NO PAGE-LEVEL HORIZONTAL SCROLL
       ===================================================== */

    .mcc-league-root *,
    .mcc-league-root *::before,
    .mcc-league-root *::after{
        box-sizing:border-box;
    }

}


/* =========================================================
   MOBILE LEAGUE OVERVIEW V2
   ========================================================= */

@media(max-width:760px){


    /* =====================================================
       1. HERO
       League title + action icons on same row
       ===================================================== */

    .mcc-league-brand{
        width:100%;
        min-width:0;

        position:relative;
    }


    /*
     * Leave room on the right side of title
     * for favourite/share actions.
     */

    .mcc-league-info{
        min-width:0;

        padding-right:94px;
    }


    .mcc-league-actions{
        width:auto!important;

        position:absolute!important;

        top:3px!important;
        right:0!important;

        margin:0!important;

        display:flex!important;
        flex-direction:row!important;
        align-items:center!important;

        gap:6px!important;
    }


    .mcc-league-action{
        width:38px!important;
        min-width:38px!important;

        height:38px!important;
        min-height:38px!important;

        padding:0!important;

        display:flex!important;
        align-items:center!important;
        justify-content:center!important;

        border-radius:7px!important;
    }


    .mcc-league-action span{
        display:none!important;
    }


    .mcc-league-action svg{
        width:17px!important;
        height:17px!important;

        flex:0 0 17px!important;
    }


    /*
     * Meta remains under league title.
     */

    .mcc-league-meta{
        width:auto!important;

        margin-top:13px!important;

        padding-right:0!important;
    }


    /* =====================================================
       2. MOBILE STANDING
       # | TIME | J | SG | PTS
       ===================================================== */

    .mcc-standing-panel
    .mcc-table-scroll{
        overflow-x:hidden!important;
    }


    .mcc-standing-panel
    .mcc-standing-fotmob{
        width:100%!important;
        min-width:0!important;

        table-layout:fixed!important;
    }


    /*
     * Existing columns:
     *
     * 1  #
     * 2  TIME
     * 3  J
     * 4  V
     * 5  E
     * 6  D
     * 7  G
     * 8  SG
     * 9  PTS
     * 10 FORMA
     * 11 PRÓX.
     *
     * Keep:
     * # / TIME / J / SG / PTS
     */

    .mcc-standing-panel
    .mcc-standing-fotmob
    th:nth-child(4),
    .mcc-standing-panel
    .mcc-standing-fotmob
    td:nth-child(4),

    .mcc-standing-panel
    .mcc-standing-fotmob
    th:nth-child(5),
    .mcc-standing-panel
    .mcc-standing-fotmob
    td:nth-child(5),

    .mcc-standing-panel
    .mcc-standing-fotmob
    th:nth-child(6),
    .mcc-standing-panel
    .mcc-standing-fotmob
    td:nth-child(6),

    .mcc-standing-panel
    .mcc-standing-fotmob
    th:nth-child(7),
    .mcc-standing-panel
    .mcc-standing-fotmob
    td:nth-child(7),

    .mcc-standing-panel
    .mcc-standing-fotmob
    th:nth-child(10),
    .mcc-standing-panel
    .mcc-standing-fotmob
    td:nth-child(10),

    .mcc-standing-panel
    .mcc-standing-fotmob
    th:nth-child(11),
    .mcc-standing-panel
    .mcc-standing-fotmob
    td:nth-child(11){
        display:none!important;
    }


    /*
     * Position
     */

    .mcc-standing-panel
    .mcc-standing-fotmob
    .mcc-col-pos{
        width:34px!important;
        min-width:34px!important;
    }


    /*
     * Team gets most of the width.
     */

    .mcc-standing-panel
    .mcc-standing-fotmob
    .mcc-col-team{
        width:auto!important;
        min-width:0!important;

        padding-left:5px!important;
        padding-right:5px!important;
    }


    .mcc-standing-panel
    .mcc-standing-fotmob
    .mcc-table-team{
        gap:7px!important;
    }


    .mcc-standing-panel
    .mcc-standing-fotmob
    .mcc-table-team img{
        width:22px!important;
        height:22px!important;

        flex:0 0 22px!important;
    }


    .mcc-standing-panel
    .mcc-standing-fotmob
    .mcc-table-team span{
        max-width:none!important;

        overflow:hidden;

        text-overflow:ellipsis;
        white-space:nowrap;

        font-size:11px!important;
    }


    /*
     * J
     */

    .mcc-standing-panel
    .mcc-standing-fotmob
    th:nth-child(3),
    .mcc-standing-panel
    .mcc-standing-fotmob
    td:nth-child(3){
        width:38px!important;

        text-align:center;
    }


    /*
     * SG
     */

    .mcc-standing-panel
    .mcc-standing-fotmob
    th:nth-child(8),
    .mcc-standing-panel
    .mcc-standing-fotmob
    td:nth-child(8){
        width:42px!important;

        text-align:center;
    }


    /*
     * PTS
     */

    .mcc-standing-panel
    .mcc-standing-fotmob
    th:nth-child(9),
    .mcc-standing-panel
    .mcc-standing-fotmob
    td:nth-child(9){
        width:42px!important;

        text-align:center;
    }


    .mcc-standing-panel
    .mcc-standing-fotmob
    td:nth-child(9){
        font-weight:700!important;
    }


    /*
     * Header / rows.
     */

    .mcc-standing-panel
    .mcc-standing-fotmob
    thead th{
        height:38px!important;

        font-size:9px!important;
    }


    .mcc-standing-panel
    .mcc-standing-fotmob
    tbody td{
        height:49px!important;
    }


    /* =====================================================
       3. SECTION SPACING
       ===================================================== */

    /*
     * Main overview blocks should feel like
     * individual cards instead of one long sheet.
     */

    .mcc-dashboard-main > *,
    .mcc-dashboard-middle > *,
    .mcc-dashboard-side > *{
        margin-top:0!important;
        margin-bottom:12px!important;
    }


    /*
     * The 3 dashboard columns become one stream.
     */

    .mcc-dashboard-grid{
        display:block!important;
    }


    .mcc-dashboard-main,
    .mcc-dashboard-middle,
    .mcc-dashboard-side{
        width:100%!important;

        display:block!important;

        margin:0!important;
    }


    /*
     * Specifically separate standing from next game.
     */

    .mcc-standing-panel{
        margin-bottom:12px!important;
    }


    .mcc-next-panel,
    .mcc-season-results-panel{
        margin-top:0!important;
        margin-bottom:12px!important;
    }


    /*
     * X-Ray.
     */

    .mcc-xray-v4{
        margin-top:12px!important;
        margin-bottom:12px!important;
    }


    /*
     * Rankings.
     */

    .mcc-ranking-panel{
        margin-top:0!important;
        margin-bottom:12px!important;
    }


    /*
     * Cards.
     */

    .mcc-cards-panel{
        margin-top:0!important;
        margin-bottom:12px!important;
    }


    /* =====================================================
       SUMMARY GRID SPACING
       ===================================================== */

    .mcc-summary-grid{
        margin-bottom:12px!important;

        gap:8px!important;
    }


    /* =====================================================
       CONTENT GAP
       ===================================================== */

    .mcc-league-content
    > .mcc-league-shell{
        padding-top:12px!important;
        padding-bottom:16px!important;
    }


    /* =====================================================
       CARD BORDER / SEPARATION
       ===================================================== */

    .mcc-standing-panel,
    .mcc-next-panel,
    .mcc-season-results-panel,
    .mcc-xray-v4,
    .mcc-ranking-panel,
    .mcc-cards-panel{
        border-radius:9px!important;

        overflow:hidden!important;
    }


    /* =====================================================
       Remove accidental empty strips / inherited grid gap
       ===================================================== */

    .mcc-dashboard-grid,
    .mcc-dashboard-main,
    .mcc-dashboard-middle,
    .mcc-dashboard-side{
        row-gap:0!important;
        column-gap:0!important;
    }


    /* =====================================================
       No module-level horizontal scrolling
       ===================================================== */

    .mcc-standing-panel,
    .mcc-next-panel,
    .mcc-season-results-panel,
    .mcc-xray-v4,
    .mcc-ranking-panel,
    .mcc-cards-panel{
        max-width:100%!important;
        min-width:0!important;
    }

}


/* =========================================================
   MOBILE LEAGUE OVERVIEW V3
   Hero actions / GD / Match VS
   ========================================================= */

@media(max-width:760px){


    /* =====================================================
       1. HERO ACTIONS
       Align actions with league title
       ===================================================== */

    .mcc-league-actions{
        top:20px!important;
        right:0!important;

        align-items:center!important;
    }


    /* =====================================================
       2. STANDING
       # | TIME | J | GD | PTS
       ===================================================== */

    /*
     * Restore goal difference column.
     * Existing table column 8 = SG / GD.
     */

    .mcc-standing-panel
    .mcc-standing-fotmob
    th:nth-child(8),
    .mcc-standing-panel
    .mcc-standing-fotmob
    td:nth-child(8){
        display:table-cell!important;

        width:40px!important;
        min-width:40px!important;
        max-width:40px!important;

        padding-left:2px!important;
        padding-right:2px!important;

        text-align:center!important;
    }


    /*
     * Keep J compact.
     */

    .mcc-standing-panel
    .mcc-standing-fotmob
    th:nth-child(3),
    .mcc-standing-panel
    .mcc-standing-fotmob
    td:nth-child(3){
        width:34px!important;
        min-width:34px!important;
        max-width:34px!important;
    }


    /*
     * Points.
     */

    .mcc-standing-panel
    .mcc-standing-fotmob
    th:nth-child(9),
    .mcc-standing-panel
    .mcc-standing-fotmob
    td:nth-child(9){
        width:38px!important;
        min-width:38px!important;
        max-width:38px!important;

        padding-left:2px!important;
        padding-right:6px!important;

        text-align:center!important;
    }


    /*
     * Rename SG visually to GD on mobile.
     */

    .mcc-standing-panel
    .mcc-standing-fotmob
    thead th:nth-child(8){
        font-size:0!important;
    }

    .mcc-standing-panel
    .mcc-standing-fotmob
    thead th:nth-child(8)::after{
        content:"GD";

        font-size:9px;
        line-height:1;

        font-weight:600;

        color:inherit;
    }


    /* =====================================================
       3. NEXT MATCH VS
       ===================================================== */

    /*
     * Support the common separators already used
     * in the next-match component.
     */

    .mcc-next-vs,
    .mcc-next-match-vs,
    .mcc-match-vs{
        display:flex!important;

        width:34px!important;
        min-width:34px!important;
        height:34px!important;

        align-items:center!important;
        justify-content:center!important;

        font-size:0!important;

        font-weight:700!important;
    }


    .mcc-next-vs::after,
    .mcc-next-match-vs::after,
    .mcc-match-vs::after{
        content:"×";

        display:block;

        font-size:24px!important;
        line-height:1!important;

        font-weight:700!important;

        color:#111827;
    }

}


/* =========================================================
   NEXT MATCH VS — FINAL
   ========================================================= */

.mcc-next-teams > b{
    width:38px;
    height:38px;

    display:flex;
    align-items:center;
    justify-content:center;

    flex:0 0 38px;

    color:#111827;

    font-size:25px!important;
    line-height:1!important;

    font-weight:700!important;

    text-align:center;
}


/* Mobile a little stronger */

@media(max-width:760px){

    .mcc-next-teams > b{
        width:42px!important;
        height:42px!important;

        flex-basis:42px!important;

        font-size:28px!important;
    }

}


/* =========================================================
   MOBILE LEAGUE STICKY HEADER
   ========================================================= */

.mcc-mobile-league-sticky{
    display:none;
}


@media(max-width:760px){

    :root{
        --mcc-mobile-header-offset:70px;
    }


    .mcc-mobile-league-sticky{
        width:100%;

        position:fixed;

        top:
            var(
                --mcc-mobile-header-offset
            );

        left:0;

        z-index:9990;

        display:block;

        opacity:0;

        visibility:hidden;

        pointer-events:none;

        transform:
            translateY(-12px);

        background:#081518;

        border-bottom:
            1px solid
            rgba(255,255,255,.09);

        box-shadow:
            0 7px 18px
            rgba(0,0,0,.14);

        transition:
            opacity .16s ease,
            transform .16s ease,
            visibility .16s ease;
    }


    .mcc-mobile-league-sticky.is-visible{
        opacity:1;

        visibility:visible;

        pointer-events:auto;

        transform:none;
    }


    /* =====================================================
       MAIN ROW
       ===================================================== */

    .mcc-mobile-league-sticky-main{
        height:54px;

        padding:
            0
            10px;

        display:flex;

        align-items:center;

        gap:8px;
    }


    /* Back */

    .mcc-mobile-league-back{
        width:40px;
        height:40px;

        flex:0 0 40px;

        display:flex;

        align-items:center;
        justify-content:center;

        color:#fff;

        text-decoration:none;

        border-radius:7px;
    }


    .mcc-mobile-league-back svg{
        width:23px;
        height:23px;

        fill:none;

        stroke:currentColor;

        stroke-width:1.8;

        stroke-linecap:round;
        stroke-linejoin:round;
    }


    /* =====================================================
       LEAGUE IDENTITY
       ===================================================== */

    .mcc-mobile-league-identity{
        min-width:0;

        flex:1;

        display:flex;

        align-items:center;

        gap:9px;
    }


    .mcc-mobile-league-identity img{
        width:30px;
        height:30px;

        flex:0 0 30px;

        object-fit:contain;
    }


    .mcc-mobile-league-identity strong{
        min-width:0;

        overflow:hidden;

        color:#fff;

        font-size:15px;

        line-height:1;

        font-weight:600;

        text-overflow:ellipsis;

        white-space:nowrap;
    }


    /* =====================================================
       ACTIONS
       ===================================================== */

    .mcc-mobile-league-icon{
        width:38px;
        height:38px;

        flex:0 0 38px;

        padding:0;

        display:flex;

        align-items:center;
        justify-content:center;

        border:0;

        border-radius:7px;

        background:transparent;

        color:#fff;

        cursor:pointer;
    }


    .mcc-mobile-league-icon svg{
        width:20px;
        height:20px;

        fill:none;

        stroke:currentColor;

        stroke-width:1.8;

        stroke-linecap:round;
        stroke-linejoin:round;
    }


    .mcc-mobile-league-icon.is-share{
        color:#20ba68;
    }


    /* =====================================================
       TABS
       ===================================================== */

    .mcc-mobile-league-sticky-tabs{
        height:44px;

        display:flex;

        align-items:stretch;

        overflow-x:auto;

        overflow-y:hidden;

        scrollbar-width:none;

        border-top:
            1px solid
            rgba(255,255,255,.055);

        background:#081316;
    }


    .mcc-mobile-league-sticky-tabs::-webkit-scrollbar{
        display:none;
    }


    .mcc-mobile-league-sticky-tabs
    .mcc-league-tab{
        min-width:max-content;

        height:44px;

        flex:
            0
            0
            auto;

        padding:
            0
            18px!important;

        position:relative;

        display:flex!important;

        align-items:center;
        justify-content:center;

        border:0!important;

        background:transparent!important;

        color:
            rgba(
                255,
                255,
                255,
                .58
            )!important;

        font-size:12px!important;

        line-height:1!important;

        font-weight:700!important;

        text-decoration:none!important;

        white-space:nowrap;
    }


    .mcc-mobile-league-sticky-tabs
    .mcc-league-tab.is-active{
        color:#34c759!important;
    }


    .mcc-mobile-league-sticky-tabs
    .mcc-league-tab.is-active::after{
        content:"";

        height:3px;

        position:absolute;

        left:14px;
        right:14px;
        bottom:0;

        border-radius:
            3px
            3px
            0
            0;

        background:#34c759;
    }


    /*
     * The original full tabs remain where they are.
     * Sticky clone only appears after scrolling.
     */

}


/* =========================================================
   MOBILE STICKY HEADER — ACTION ALIGNMENT FINAL
   ========================================================= */

@media(max-width:760px){

    .mcc-mobile-league-sticky-main{
        align-items:center!important;
    }


    .mcc-mobile-league-identity{
        align-items:center!important;
    }


    /*
     * Remove inherited button margins.
     */

    .mcc-mobile-league-icon{
        margin:0!important;

        width:38px!important;
        min-width:38px!important;
        max-width:38px!important;

        height:38px!important;
        min-height:38px!important;
        max-height:38px!important;

        padding:0!important;

        align-self:center!important;

        line-height:1!important;

        box-sizing:border-box!important;
    }


    /*
     * Ensure SVG is perfectly centered.
     */

    .mcc-mobile-league-icon svg{
        display:block!important;

        margin:0!important;

        width:19px!important;
        height:19px!important;

        flex:0 0 19px!important;
    }


    /*
     * Keep actions tight and centered with league name.
     */

    .mcc-mobile-league-sticky-main
    > .mcc-mobile-league-icon:first-of-type{
        margin-left:auto!important;
    }


    /*
     * Identity text line.
     */

    .mcc-mobile-league-identity strong{
        display:flex;

        align-items:center;

        min-height:38px;

        line-height:1!important;
    }

}


/* =========================================================
   CLASSIFICATION PAGE V1
   ========================================================= */

.mcc-classification-page{
    background:#f8faf9;
}


/* =========================================================
   SUMMARY
   ========================================================= */

.mcc-cls-summary{
    display:grid;

    grid-template-columns:
        repeat(
            5,
            minmax(0,1fr)
        );

    gap:12px;

    margin-bottom:14px;
}


.mcc-cls-summary article{
    min-height:96px;

    padding:
        15px
        16px;

    display:flex;

    flex-direction:column;

    justify-content:center;

    border:
        1px solid
        #dfe6e2;

    border-radius:9px;

    background:#fff;
}


.mcc-cls-summary small{
    color:#718078;

    font-size:9px;

    font-weight:600;
}


.mcc-cls-summary strong{
    margin-top:7px;

    color:#101613;

    font-size:30px;

    line-height:1;

    font-weight:700;
}


.mcc-cls-summary span{
    margin-top:7px;

    color:#718078;

    font-size:10px;
}


/* =========================================================
   LAYOUT
   ========================================================= */

.mcc-cls-layout{
    display:grid;

    grid-template-columns:
        minmax(0,1.62fr)
        minmax(310px,.92fr);

    gap:14px;

    align-items:start;
}


.mcc-cls-side{
    min-width:0;

    display:flex;

    flex-direction:column;

    gap:14px;
}


/* =========================================================
   STANDING
   ========================================================= */

.mcc-cls-standing{
    overflow:hidden;
}


.mcc-cls-head{
    min-height:66px;

    padding:
        0
        16px;

    display:flex;

    align-items:center;

    justify-content:space-between;

    border-bottom:
        1px solid
        #e3e9e6;
}


.mcc-cls-head > div{
    display:flex;

    flex-direction:column;

    gap:4px;
}


.mcc-cls-head span{
    color:#87928d;

    font-size:8px;

    font-weight:600;

    letter-spacing:.7px;
}


.mcc-cls-head h1{
    margin:0!important;

    font-size:18px!important;

    line-height:1!important;

    font-weight:700!important;
}


.mcc-cls-season{
    padding:
        5px
        8px;

    border:
        1px solid
        #dfe5e2;

    border-radius:5px;

    background:#f7f9f8;
}


/* filters */

.mcc-cls-modes{
    padding:
        12px
        14px;

    display:flex;

    align-items:center;

    gap:8px;

    border-bottom:
        1px solid
        #e5ebe8;
}


.mcc-cls-modes a{
    min-width:70px;

    height:32px;

    padding:
        0
        14px;

    display:inline-flex;

    align-items:center;

    justify-content:center;

    border:
        1px solid
        #dce4e0;

    border-radius:5px;

    background:#fff;

    color:#4f5b55;

    font-size:9px;

    font-weight:700;

    text-decoration:none;
}


.mcc-cls-modes a.is-active{
    border-color:#27a844;

    background:#27a844;

    color:#fff;
}


/* =========================================================
   HISTORY
   ========================================================= */

.mcc-cls-history{
    overflow:hidden;
}


.mcc-cls-history-team{
    min-height:54px;

    padding:
        0
        16px;

    display:flex;

    align-items:center;

    gap:9px;

    border-bottom:
        1px solid
        #edf1ef;
}


.mcc-cls-history-team img{
    width:26px;

    height:26px;

    object-fit:contain;
}


.mcc-cls-history-team strong{
    font-size:12px;

    font-weight:700;
}


.mcc-cls-chart-wrap{
    padding:
        14px
        12px
        6px;
}


.mcc-cls-history-svg{
    width:100%;

    height:auto;

    display:block;
}


.mcc-cls-grid-line{
    stroke:#e6ece9;

    stroke-width:1;
}


.mcc-cls-axis-label{
    fill:#7d8983;

    font-size:8px;

    font-family:
        "Rajdhani",
        Arial,
        sans-serif;
}


.mcc-cls-history-line{
    fill:none;

    stroke:#27b443;

    stroke-width:2.4;

    stroke-linecap:round;

    stroke-linejoin:round;
}


.mcc-cls-history-point{
    fill:#fff;

    stroke:#27b443;

    stroke-width:2;
}


.mcc-cls-history-foot{
    min-height:44px;

    padding:
        0
        14px;

    display:flex;

    align-items:center;

    justify-content:space-between;

    border-top:
        1px solid
        #edf1ef;

    color:#748079;

    font-size:9px;
}


.mcc-cls-history-foot strong{
    color:#151b18;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:760px){

    .mcc-cls-summary{
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );

        gap:8px;
    }


    .mcc-cls-summary article{
        min-height:90px;

        padding:
            13px
            14px;
    }


    .mcc-cls-summary article:last-child{
        grid-column:
            1
            /
            -1;
    }


    .mcc-cls-layout{
        display:block;
    }


    .mcc-cls-standing{
        margin-bottom:12px;
    }


    .mcc-cls-side{
        display:block;
    }


    .mcc-cls-side > *{
        margin-bottom:12px;
    }


    .mcc-cls-modes{
        overflow-x:auto;

        scrollbar-width:none;
    }


    .mcc-cls-modes::-webkit-scrollbar{
        display:none;
    }

}


/* =========================================================
   LEAGUE ROUTE TABS
   ========================================================= */

.mcc-league-tabs
> .mcc-league-shell
> .mcc-league-tab{
    appearance:none;
    -webkit-appearance:none;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    flex:0 0 auto;

    min-height:46px;

    padding:0 14px;

    border:0;
    border-bottom:2px solid transparent;

    background:transparent;

    color:inherit;

    font:inherit;
    font-size:14px;
    font-weight:600;

    text-decoration:none!important;

    white-space:nowrap;

    cursor:pointer;
}


.mcc-league-tabs
> .mcc-league-shell
> .mcc-league-tab:hover{
    color:#1c9f42;
}


.mcc-league-tabs
> .mcc-league-shell
> .mcc-league-tab.is-active{
    color:#159c38;

    border-bottom-color:#20a844;
}


@media(max-width:760px){

    .mcc-league-tabs
    > .mcc-league-shell
    > .mcc-league-tab{
        min-height:42px;

        padding:0 12px;

        font-size:14px;
    }

}


/* =========================================================
   CLASSIFICATION — RIGHT ANALYTICS
   ========================================================= */

.mcc-cls-focus-team{
    min-height:61px;
    padding:10px 15px;

    display:flex;
    align-items:center;
    gap:10px;

    border-bottom:1px solid #edf1ef;
}

.mcc-cls-focus-team img{
    width:32px;
    height:32px;
    object-fit:contain;
}

.mcc-cls-focus-team > div{
    min-width:0;
    display:flex;
    flex-direction:column;
}

.mcc-cls-focus-team strong{
    color:#151a17;
    font-size:12px;
    font-weight:700;
}

.mcc-cls-focus-team span{
    margin-top:2px;
    color:#7a857f;
    font-size:9px;
}


/* form */

.mcc-cls-form-results{
    min-height:70px;

    padding:14px;

    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
}

.mcc-cls-form-result{
    width:34px;
    height:34px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

    color:#fff;

    font-size:11px;
    font-weight:700;
}

.mcc-cls-form-result.is-win{
    background:#20a447;
}

.mcc-cls-form-result.is-draw{
    background:#9ba49f;
}

.mcc-cls-form-result.is-loss{
    background:#df4d4d;
}

.mcc-cls-form-stats{
    display:grid;
    grid-template-columns:repeat(4,1fr);

    border-top:1px solid #edf1ef;
}

.mcc-cls-form-stats > div{
    min-height:59px;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    border-left:1px solid #edf1ef;
}

.mcc-cls-form-stats > div:first-child{
    border-left:0;
}

.mcc-cls-form-stats strong{
    color:#111713;
    font-size:17px;
    line-height:1;
    font-weight:700;
}

.mcc-cls-form-stats span{
    margin-top:5px;
    color:#7b8680;
    font-size:8px;
    font-weight:700;
}


/* radar */

.mcc-cls-radar{
    padding:8px 12px 0;
}

.mcc-cls-radar svg{
    display:block;
    width:100%;
    height:auto;
}

.mcc-cls-radar-grid{
    fill:none;
    stroke:#e1e8e4;
    stroke-width:1;
}

.mcc-cls-radar-axis{
    stroke:#e4eae7;
    stroke-width:1;
}

.mcc-cls-radar-data{
    fill:rgba(32,164,71,.16);
    stroke:#20a447;
    stroke-width:2;
    stroke-linejoin:round;
}

.mcc-cls-radar-label{
    fill:#647169;
    font-size:8px;
    font-weight:700;
}

.mcc-cls-performance-values{
    display:grid;
    grid-template-columns:repeat(5,1fr);

    border-top:1px solid #edf1ef;
}

.mcc-cls-performance-values > div{
    min-height:52px;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    border-left:1px solid #edf1ef;
}

.mcc-cls-performance-values > div:first-child{
    border-left:0;
}

.mcc-cls-performance-values span{
    color:#78847d;
    font-size:9px;
    font-weight:700;
}

.mcc-cls-performance-values strong{
    margin-top:4px;

    color:#172019;

    font-size:13px;
    font-weight:700;
}


@media(max-width:760px){

    .mcc-cls-form-result{
        width:32px;
        height:32px;
    }

    .mcc-cls-performance-values{
        overflow-x:auto;
    }

    .mcc-cls-performance-values > div{
        min-width:70px;
    }

}


/* =========================================================
   LEAGUE TABS — DARK HERO COLOR FIX
   ========================================================= */

.mcc-league-tabs
> .mcc-league-shell
> .mcc-league-tab{
    color:rgba(255,255,255,.68) !important;
}

.mcc-league-tabs
> .mcc-league-shell
> .mcc-league-tab:hover{
    color:#ffffff !important;
}

.mcc-league-tabs
> .mcc-league-shell
> .mcc-league-tab.is-active{
    color:#20c55a !important;
}


/* cloned mobile sticky tabs */

.mcc-mobile-sticky-tabs
.mcc-league-tab{
    color:#68736d !important;
}

.mcc-mobile-sticky-tabs
.mcc-league-tab:hover{
    color:#151a17 !important;
}

.mcc-mobile-sticky-tabs
.mcc-league-tab.is-active{
    color:#159c3d !important;
}


/* =========================================================
   LEAGUE TABS — RESTORE ORIGINAL SPACING
   ========================================================= */

.mcc-league-tabs
> .mcc-league-shell{
    display:flex !important;
    align-items:center !important;
    gap:0 !important;
}

.mcc-league-tabs
> .mcc-league-shell
> .mcc-league-tab{
    padding-left:20px !important;
    padding-right:20px !important;
}

/* 第一个 tab 跟页面内容左边缘对齐 */
.mcc-league-tabs
> .mcc-league-shell
> .mcc-league-tab:first-child{
    padding-left:10px !important;
}

/* 手机维持紧凑一点，避免 tab 变得太宽 */
@media (max-width:760px){
    .mcc-league-tabs
    > .mcc-league-shell
    > .mcc-league-tab{
        padding-left:14px !important;
        padding-right:14px !important;
    }

    .mcc-league-tabs
    > .mcc-league-shell
    > .mcc-league-tab:first-child{
        padding-left:8px !important;
    }
}


/* =========================================================
   LEAGUE TABS — EXACT ORIGINAL SPACING
   ========================================================= */

@media(min-width:761px){

    .mcc-league-tabs
    > .mcc-league-shell{
        display:flex!important;
        align-items:stretch!important;
        justify-content:flex-start!important;

        gap:0!important;
    }


    .mcc-league-tabs
    > .mcc-league-shell
    > .mcc-league-tab{

        position:relative!important;

        width:auto!important;
        min-width:max-content!important;

        height:56px!important;
        min-height:56px!important;

        flex:
            0
            0
            auto!important;

        padding:
            0
            24px!important;

        display:inline-flex!important;

        align-items:center!important;
        justify-content:center!important;

        font-size:13px!important;
        line-height:1!important;

        white-space:nowrap!important;
    }


    /*
     * First item uses the SAME spacing.
     * No special compression.
     */

    .mcc-league-tabs
    > .mcc-league-shell
    > .mcc-league-tab:first-child{
        padding-left:24px!important;
        padding-right:24px!important;
    }

}


/* =========================================================
   CLASSIFICATION — HISTORY WIDE
   ========================================================= */

.mcc-cls-history-wide{
    width:100%;

    margin-top:16px;
}

.mcc-cls-history-wide
.mcc-cls-history{
    width:100%;
}

.mcc-cls-history-wide
.mcc-cls-chart-wrap{
    min-height:310px;

    padding:
        20px
        22px
        8px;
}

.mcc-cls-history-wide
.mcc-cls-history-svg{
    width:100%;

    height:290px;
}


/*
 * Ranking axis:
 * 1 at TOP, lowest place at bottom.
 */

.mcc-cls-history-wide
.mcc-cls-grid-line{
    stroke:#dfe6e2;

    stroke-width:1;

    stroke-dasharray:4 5;
}

.mcc-cls-history-wide
.mcc-cls-history-line{
    stroke-width:2.2;
}

.mcc-cls-history-wide
.mcc-cls-history-point{
    r:4;
}


@media(max-width:760px){

    .mcc-cls-history-wide{
        margin-top:12px;
    }

    .mcc-cls-history-wide
    .mcc-cls-chart-wrap{
        min-height:240px;

        overflow-x:auto;
    }

    .mcc-cls-history-wide
    .mcc-cls-history-svg{
        min-width:650px;

        height:240px;
    }

}


/* =========================================================
   CLASSIFICACAO — RECENT ROUND / SURPRISE FORM
   ========================================================= */

.mcc-cls-round-form {
    overflow: hidden;
}

.mcc-cls-round-form-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
}

.mcc-cls-round-form-tools {
    display: flex;
    align-items: center;
    gap: 8px;
}

.mcc-cls-round-badge {
    display: inline-flex;
    align-items: center;
    min-height: 26px;
    padding: 0 10px;
    border: 1px solid rgba(15, 23, 42, .09);
    border-radius: 999px;
    background: #f8fafc;
    color: #64748b;
    font-size: 10px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: .07em;
    white-space: nowrap;
}

.mcc-cls-form-info {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    min-width: 26px;
    padding: 0;
    border: 1px solid rgba(15, 23, 42, .12);
    border-radius: 50%;
    background: #fff;
    color: #64748b;
    font-family: Georgia, serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    cursor: help;
}

.mcc-cls-round-chart {
    position: relative;
    display: grid;
    grid-template-columns: repeat(10, minmax(34px, 1fr));
    align-items: end;
    gap: 7px;
    min-height: 148px;
    margin-top: 18px;
    padding: 0 4px;
}

.mcc-cls-round-baseline {
    position: absolute;
    z-index: 0;
    right: 4px;
    bottom: 45px;
    left: 4px;
    height: 1px;
    background: #e2e8f0;
}

.mcc-cls-round-item {
    position: relative;
    z-index: 1;
    display: flex;
    min-width: 0;
    flex-direction: column;
    align-items: center;
}

.mcc-cls-round-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    margin-bottom: 7px;
}

.mcc-cls-round-logo img {
    display: block;
    width: 28px;
    height: 28px;
    object-fit: contain;
}

.mcc-cls-round-logo span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #f1f5f9;
    color: #64748b;
    font-size: 11px;
    font-weight: 900;
}

.mcc-cls-round-bar-zone {
    display: flex;
    width: 100%;
    height: 72px;
    align-items: flex-end;
    justify-content: center;
}

.mcc-cls-round-bar {
    display: block;
    width: min(22px, 72%);
    min-height: 8px;
    border-radius: 6px 6px 2px 2px;
    background: #94a3b8;
    box-shadow: inset 0 0 0 1px rgba(15, 23, 42, .05);
}

.mcc-cls-round-item.is-win .mcc-cls-round-bar {
    background: #22c55e;
}

.mcc-cls-round-item.is-draw .mcc-cls-round-bar {
    background: #94a3b8;
}

.mcc-cls-round-item.is-loss .mcc-cls-round-bar {
    background: #ef4444;
}

.mcc-cls-round-item.is-no-odds .mcc-cls-round-bar {
    opacity: .28;
}

.mcc-cls-round-result {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    margin-top: 6px;
    border-radius: 6px;
    background: #f1f5f9;
    color: #64748b;
    font-size: 10px;
    font-weight: 950;
    line-height: 1;
}

.mcc-cls-round-item.is-win .mcc-cls-round-result {
    background: #dcfce7;
    color: #15803d;
}

.mcc-cls-round-item.is-loss .mcc-cls-round-result {
    background: #fee2e2;
    color: #dc2626;
}

.mcc-cls-round-probability {
    margin-top: 5px;
    color: #94a3b8;
    font-size: 9px;
    font-weight: 800;
    line-height: 1;
}

.mcc-cls-round-legend {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 16px;
    margin-top: 17px;
    padding-top: 14px;
    border-top: 1px solid #eef2f7;
}

.mcc-cls-round-legend span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #64748b;
    font-size: 10px;
    font-weight: 800;
}

.mcc-cls-round-legend i {
    display: block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #94a3b8;
}

.mcc-cls-round-legend .is-win i {
    background: #22c55e;
}

.mcc-cls-round-legend .is-loss i {
    background: #ef4444;
}

.mcc-cls-round-note {
    margin: 10px 0 0;
    color: #94a3b8;
    font-size: 10px;
    line-height: 1.45;
}

.mcc-cls-round-empty {
    padding: 32px 10px 20px;
    color: #94a3b8;
    text-align: center;
    font-size: 12px;
    font-weight: 700;
}


@media (max-width: 767px) {

    .mcc-cls-round-chart {
        grid-template-columns: repeat(10, minmax(30px, 1fr));
        gap: 4px;
        overflow-x: auto;
        min-height: 142px;
        padding-bottom: 3px;
    }

    .mcc-cls-round-item {
        min-width: 30px;
    }

    .mcc-cls-round-logo {
        width: 26px;
        height: 26px;
    }

    .mcc-cls-round-logo img,
    .mcc-cls-round-logo span {
        width: 24px;
        height: 24px;
    }

    .mcc-cls-round-bar {
        width: 18px;
    }

    .mcc-cls-round-badge {
        padding: 0 8px;
        font-size: 9px;
    }

    .mcc-cls-round-legend {
        gap: 8px 12px;
    }
}


/* =========================================================
   FORMA RECENTE V2 — REFERENCE STYLE
   ========================================================= */

.mcc-cls-round-form {
    padding: 20px 22px 22px;
    border-radius: 16px;
}

.mcc-cls-round-form .mcc-panel-kicker {
    display: none;
}

.mcc-cls-round-form .mcc-panel-head {
    padding: 0;
    margin: 0 0 20px;
    border: 0;
}

.mcc-cls-round-form .mcc-panel-head h2 {
    margin: 0;
    font-size: 16px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: 0;
    text-transform: none;
}

.mcc-cls-round-badge {
    display: none;
}

.mcc-cls-form-info {
    width: 21px;
    height: 21px;
    min-width: 21px;
    border: 2px solid #20252b;
    color: #20252b;
    font-family: Arial, sans-serif;
    font-size: 12px;
    font-weight: 900;
}


/*
 * Chart
 */

.mcc-cls-round-chart {
    position: relative;
    display: grid;
    grid-template-columns: repeat(10, minmax(28px, 1fr));
    align-items: stretch;
    gap: 8px;

    height: 136px;
    min-height: 136px;
    margin: 0;
    padding: 0;

    overflow: visible;
}


/*
 * The zero line sits around 64% down the graph.
 * Enough room above for green bars and below for losses.
 */

.mcc-cls-round-baseline {
    position: absolute;
    z-index: 0;

    top: 91px;
    right: 0;
    bottom: auto;
    left: 0;

    height: 1px;
    background: #dfe5eb;
}


/*
 * Every match column:
 *
 * logo
 * positive/negative plot
 */

.mcc-cls-round-item {
    position: relative;
    z-index: 1;

    display: grid;
    grid-template-rows:
        30px
        99px;

    align-items: start;
    justify-items: center;

    min-width: 0;
}


/*
 * Logos
 */

.mcc-cls-round-logo {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 27px;
    height: 27px;
    margin: 0;
}

.mcc-cls-round-logo img {
    width: 25px;
    height: 25px;
    object-fit: contain;
}

.mcc-cls-round-logo span {
    width: 25px;
    height: 25px;
}


/*
 * Plot area.
 *
 * Baseline relative to this area:
 * 61px from its top.
 */

.mcc-cls-round-bar-zone {
    position: relative;

    display: block;

    width: 100%;
    height: 99px;

    margin: 0;
}


/*
 * Common bar
 */

.mcc-cls-round-bar {
    position: absolute;
    left: 50%;

    display: block;

    width: min(37px, 84%);
    min-height: 5px;

    margin: 0;

    transform: translateX(-50%);

    border: 0;
    border-radius: 0;

    box-shadow: none;
}


/*
 * WIN
 *
 * Baseline = 61px from bar-zone top.
 * Height grows UP.
 */

.mcc-cls-round-item.is-win
.mcc-cls-round-bar {
    bottom: 38px;
    background: #16b866;
}


/*
 * LOSS
 *
 * Same calculated surprise height,
 * but grow DOWN from zero line.
 */

.mcc-cls-round-item.is-loss
.mcc-cls-round-bar {
    top: 61px;
    bottom: auto;

    background: #d83a26;
}


/*
 * DRAW
 *
 * Neutral gray, visually centered
 * close to the zero line.
 */

.mcc-cls-round-item.is-draw
.mcc-cls-round-bar {
    bottom: 38px;
    background: #aeb5bd;
}


/*
 * Remove old UI completely.
 */

.mcc-cls-round-result,
.mcc-cls-round-probability,
.mcc-cls-round-legend,
.mcc-cls-round-note {
    display: none !important;
}


/*
 * Missing odds:
 * don't pretend we know surprise.
 */

.mcc-cls-round-item.is-no-odds
.mcc-cls-round-bar {
    height: 5px !important;
    opacity: .35;
}


/*
 * Hover
 */

.mcc-cls-round-item {
    cursor: help;
}

.mcc-cls-round-item:hover
.mcc-cls-round-logo {
    transform: translateY(-2px);
}

.mcc-cls-round-logo {
    transition: transform .16s ease;
}


@media (max-width: 767px) {

    .mcc-cls-round-form {
        padding: 18px 16px 20px;
    }

    .mcc-cls-round-chart {
        grid-template-columns:
            repeat(10, minmax(34px, 1fr));

        gap: 5px;

        overflow-x: auto;
        overflow-y: hidden;

        height: 136px;
        min-height: 136px;
    }

    .mcc-cls-round-item {
        min-width: 34px;
    }

    .mcc-cls-round-bar {
        width: 30px;
    }
}


/* =========================================================
   FORMA RECENTE V3 — SVG CHART
   ========================================================= */

.mcc-cls-svg-form {
    position: relative;
    overflow: hidden;
    padding: 18px 20px 22px;
    border-radius: 16px;
}

.mcc-cls-svg-form-head {
    position: relative;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    min-height: 48px;
    margin: 0 0 8px;
}

.mcc-cls-svg-form-heading {
    min-width: 0;
    text-align: center;
}

.mcc-cls-svg-form-heading h2 {
    margin: 0;
    color: #101418;
    font-size: 16px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: 0;
    text-transform: none;
}

.mcc-cls-svg-form-heading p {
    margin: 9px 0 0;
    color: #8b929a;
    font-size: 11px;
    font-weight: 500;
    line-height: 1.35;
}


/* INFO ICON */

.mcc-cls-svg-info {
    position: absolute;
    top: 0;
    right: 0;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 21px;
    height: 21px;
    min-width: 21px;
    padding: 0;

    border: 2px solid #1f2429;
    border-radius: 50%;

    background: transparent;
    color: #1f2429;

    font-family: Arial, sans-serif;
    font-size: 12px;
    font-weight: 900;
    line-height: 1;

    cursor: pointer;
}


/* WHOLE CHART */

.mcc-cls-svg-chart-wrap {
    width: 100%;
    margin-top: 7px;
}


/* LOGOS */

.mcc-cls-svg-logos {
    display: grid;
    grid-template-columns: repeat(10, minmax(0, 1fr));
    align-items: center;
    gap: 0;

    min-width: 0;

    margin: 0 0 4px;
}

.mcc-cls-svg-logo {
    display: flex;
    align-items: center;
    justify-content: center;

    min-width: 0;
    height: 30px;
}

.mcc-cls-svg-logo img {
    display: block;
    width: 26px;
    height: 26px;
    object-fit: contain;
}

.mcc-cls-svg-logo span {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 25px;
    height: 25px;

    border-radius: 50%;
    background: #eef2f5;

    color: #68717a;
    font-size: 10px;
    font-weight: 900;
}


/* SVG STAGE */

.mcc-cls-svg-stage {
    position: relative;
    width: 100%;
    height: 100px;
}

.mcc-cls-form-svg {
    display: block;
    width: 100%;
    height: 100px;
    overflow: visible;
}


/*
 * Keep baseline very subtle.
 * Reference essentially has no heavy axis.
 */

.mcc-cls-svg-zero {
    stroke: #e2e6e9;
    stroke-width: 1;
    vector-effect: non-scaling-stroke;
}


/* FAT SVG BARS */

.mcc-cls-svg-bar {
    cursor: help;

    shape-rendering: geometricPrecision;

    transition:
        opacity .14s ease,
        filter .14s ease;
}

.mcc-cls-svg-bar.is-win {
    fill: #15b168;
}

.mcc-cls-svg-bar.is-loss {
    fill: #d43b26;
}

.mcc-cls-svg-bar.is-draw {
    fill: #aeb4ba;
}

.mcc-cls-svg-bar.is-no-odds {
    opacity: .35;
}

.mcc-cls-svg-bar:hover {
    opacity: .84;
    filter: brightness(.97);
}


/* =========================================================
   INFO MODAL
   ========================================================= */

.mcc-cls-form-dialog {
    width: min(305px, calc(100vw - 34px));
    max-width: 305px;

    padding: 0;

    border: 0;
    border-radius: 17px;

    background: #fff;

    box-shadow:
        0 12px 34px rgba(15, 23, 42, .24);
}

.mcc-cls-form-dialog::backdrop {
    background: rgba(17, 24, 39, .55);
}

.mcc-cls-form-dialog-inner {
    padding: 19px 18px 17px;
}

.mcc-cls-form-dialog h3 {
    margin: 0 0 17px;

    color: #24272c;

    font-size: 18px;
    font-weight: 700;
    line-height: 1.2;
}

.mcc-cls-form-dialog p {
    margin: 0;

    color: #30343a;

    font-size: 14px;
    font-weight: 400;
    line-height: 1.34;
}

.mcc-cls-form-dialog button {
    display: block;

    margin: 23px 0 0 auto;
    padding: 4px 0;

    border: 0;
    background: transparent;

    color: #4054e8;

    font-size: 13px;
    font-weight: 800;

    cursor: pointer;
}


/* =========================================================
   DISABLE PREVIOUS FORM VERSIONS
   ========================================================= */

.mcc-cls-svg-form
.mcc-cls-round-legend,

.mcc-cls-svg-form
.mcc-cls-round-note,

.mcc-cls-svg-form
.mcc-cls-round-result,

.mcc-cls-svg-form
.mcc-cls-round-probability,

.mcc-cls-svg-form
.mcc-cls-round-badge {
    display: none !important;
}


/* MOBILE */

@media (max-width: 767px) {

    .mcc-cls-svg-form {
        padding:
            16px
            13px
            18px;
    }

    .mcc-cls-svg-form-head {
        min-height: 53px;
        margin-bottom: 4px;
    }

    .mcc-cls-svg-form-heading h2 {
        font-size: 16px;
    }

    .mcc-cls-svg-form-heading p {
        margin-top: 9px;
        font-size: 11px;
    }

    .mcc-cls-svg-chart-wrap {
        overflow-x: auto;
        overflow-y: hidden;
        margin-top: 5px;

        scrollbar-width: none;
    }

    .mcc-cls-svg-chart-wrap::-webkit-scrollbar {
        display: none;
    }

    /*
     * 10 clubs still visible around the same
     * density as the reference.
     */
    .mcc-cls-svg-logos,
    .mcc-cls-svg-stage {
        min-width: 380px;
    }

    .mcc-cls-svg-logo img {
        width: 24px;
        height: 24px;
    }

    .mcc-cls-svg-logo {
        height: 28px;
    }

    .mcc-cls-svg-stage,
    .mcc-cls-form-svg {
        height: 96px;
    }
}


/* =========================================================
   FORMA RECENTE — INFO + HOVER RESULT FIX
   ========================================================= */

.mcc-cls-svg-form
button.mcc-cls-svg-info {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 24px !important;
    min-width: 24px !important;
    max-width: 24px !important;

    height: 24px !important;
    min-height: 24px !important;
    max-height: 24px !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-radius: 50% !important;

    background: transparent !important;
    background-image: none !important;

    color: #202428 !important;

    box-shadow: none !important;
    outline: none;

    transform: none !important;

    line-height: 1 !important;

    cursor: pointer;
}

.mcc-cls-svg-form
button.mcc-cls-svg-info:hover,
.mcc-cls-svg-form
button.mcc-cls-svg-info:focus,
.mcc-cls-svg-form
button.mcc-cls-svg-info:active {
    background: transparent !important;
    background-image: none !important;

    color: #202428 !important;

    box-shadow: none !important;
    transform: none !important;
}

.mcc-cls-svg-info svg {
    display: block !important;

    width: 22px !important;
    height: 22px !important;

    overflow: visible;

    fill: none;

    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;

    pointer-events: none;
}

.mcc-cls-svg-info
.mcc-cls-svg-info-dot {
    fill: currentColor;
    stroke: none;
}


/* Hover result */

.mcc-cls-form-hover-result {
    min-height: 16px;

    margin: 8px 0 0 !important;

    color: #9299a2;

    font-size: 11px;
    font-weight: 500;
    line-height: 16px;

    white-space: nowrap;

    transition:
        color .12s ease,
        font-weight .12s ease;
}

.mcc-cls-form-hover-result.is-active {
    color: #30343a;
    font-weight: 600;
}


/*
 * Don't show browser's old-style interaction feel.
 */

.mcc-cls-svg-bar {
    pointer-events: all;
}



/* =========================================================
   FORMA RECENTE V4 — COMPACT REFERENCE GEOMETRY
   ========================================================= */

.mcc-cls-svg-form {
    padding: 15px 18px 16px !important;
    min-height: 0 !important;
}


/* Header */

.mcc-cls-svg-form-head {
    min-height: 43px !important;
    margin: 0 0 2px !important;
}

.mcc-cls-svg-form-heading h2 {
    font-size: 16px !important;
    line-height: 19px !important;
}

.mcc-cls-form-hover-result,
.mcc-cls-svg-form-heading p {
    min-height: 15px !important;
    margin: 5px 0 0 !important;

    font-size: 11px !important;
    line-height: 15px !important;
}


/* Chart closer to title */

.mcc-cls-svg-chart-wrap {
    margin-top: 3px !important;
}


/* Logos */

.mcc-cls-svg-logos {
    height: 29px !important;
    margin: 0 !important;
}

.mcc-cls-svg-logo {
    height: 29px !important;
    cursor: pointer;
    transition:
        opacity .14s ease,
        transform .14s ease;
}

.mcc-cls-svg-logo img {
    width: 25px !important;
    height: 25px !important;
}


/* SVG chart itself */

.mcc-cls-svg-stage {
    height: 88px !important;
}

.mcc-cls-form-svg {
    width: 100% !important;
    height: 88px !important;
}


/*
 * Reference bars are chunky.
 */

.mcc-cls-svg-bar {
    transition:
        opacity .14s ease,
        filter .14s ease;
}


/* Dim non-hovered items */

.mcc-cls-svg-form.is-form-hovering
.mcc-cls-svg-bar:not(.is-active) {
    opacity: .38;
}

.mcc-cls-svg-form.is-form-hovering
.mcc-cls-svg-logo:not(.is-active) {
    opacity: .42;
}

.mcc-cls-svg-bar.is-active {
    opacity: 1 !important;
    filter: brightness(.92);
}

.mcc-cls-svg-logo.is-active {
    opacity: 1 !important;
    transform: translateY(-2px) scale(1.08);
}


/* Active score */

.mcc-cls-form-hover-result.is-active {
    color: #23272c !important;
    font-weight: 700 !important;
}


/* Info icon exact size */

.mcc-cls-svg-form
button.mcc-cls-svg-info {
    top: -1px !important;
    right: 0 !important;

    width: 22px !important;
    min-width: 22px !important;
    max-width: 22px !important;

    height: 22px !important;
    min-height: 22px !important;
    max-height: 22px !important;
}

.mcc-cls-svg-form
button.mcc-cls-svg-info svg {
    width: 21px !important;
    height: 21px !important;
}


/* Mobile */

@media (max-width: 767px) {

    .mcc-cls-svg-form {
        padding:
            14px
            12px
            15px
            !important;
    }

    .mcc-cls-svg-form-head {
        min-height: 44px !important;
    }

    .mcc-cls-svg-logos,
    .mcc-cls-svg-stage {
        min-width: 365px !important;
    }

    .mcc-cls-svg-stage,
    .mcc-cls-form-svg {
        height: 86px !important;
    }

    .mcc-cls-svg-logo img {
        width: 23px !important;
        height: 23px !important;
    }
}


/* =========================================================
   CLASSIFICATION HISTORY — RIGHT SIDEBAR
   ========================================================= */

.mcc-cls-side .mcc-cls-history-wide {
    display: block !important;

    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    grid-column: auto !important;
    grid-row: auto !important;
}

.mcc-cls-side .mcc-cls-history {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
}


/*
 * History graph should fill sidebar,
 * rather than retain full-width geometry.
 */

.mcc-cls-side .mcc-cls-chart-wrap {
    width: 100% !important;
    padding:
        16px
        18px
        12px
        !important;
}

.mcc-cls-side .mcc-cls-history-svg {
    display: block;

    width: 100% !important;
    height: auto !important;

    max-width: none !important;
}


/*
 * Keep sidebar cards evenly separated.
 */

.mcc-cls-side > .mcc-panel,
.mcc-cls-side > .mcc-cls-history-wide {
    margin-bottom: 14px !important;
}

.mcc-cls-side > :last-child {
    margin-bottom: 0 !important;
}


/* Mobile */

@media (max-width: 767px) {

    .mcc-cls-side .mcc-cls-history-wide {
        width: 100% !important;
    }

    .mcc-cls-side .mcc-cls-chart-wrap {
        padding:
            14px
            12px
            10px
            !important;
    }
}


/* =========================================================
   CLASSIFICATION — CHAMPIONSHIP HIGHLIGHTS
   ========================================================= */

.mcc-cls-highlights {
    overflow: hidden;
}

.mcc-cls-highlights-list {
    display: flex;
    flex-direction: column;
}

.mcc-cls-highlight-row {
    display: grid;
    grid-template-columns:
        36px
        minmax(0, 1fr)
        auto;

    align-items: center;
    gap: 11px;

    min-height: 67px;

    padding: 11px 15px;

    border-top: 1px solid #edf1f4;
}

.mcc-cls-highlight-row:first-child {
    border-top: 0;
}

.mcc-cls-highlight-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 34px;
    height: 34px;

    border-radius: 10px;

    background: #f2f7f4;
    color: #16a765;

    font-size: 18px;
    font-weight: 900;
    line-height: 1;
}

.mcc-cls-highlight-copy {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 3px;
}

.mcc-cls-highlight-copy > span {
    color: #8a929b;

    font-size: 9px;
    font-weight: 800;
    line-height: 1.2;

    text-transform: uppercase;
    letter-spacing: .045em;
}

.mcc-cls-highlight-copy > strong {
    overflow: hidden;

    color: #20252a;

    font-size: 12px;
    font-weight: 900;
    line-height: 1.25;

    text-overflow: ellipsis;
    white-space: nowrap;
}

.mcc-cls-highlight-copy small {
    overflow: hidden;

    margin-top: 1px;

    color: #9aa1a8;

    font-size: 9px;
    font-weight: 500;
    line-height: 1.25;

    text-overflow: ellipsis;
    white-space: nowrap;
}

.mcc-cls-highlight-value {
    display: flex;
    min-width: 44px;
    flex-direction: column;
    align-items: flex-end;
    gap: 1px;

    text-align: right;
}

.mcc-cls-highlight-value strong {
    color: #161a1e;

    font-size: 18px;
    font-weight: 950;
    line-height: 1;
}

.mcc-cls-highlight-value span {
    color: #9aa1a8;

    font-size: 8px;
    font-weight: 700;
    line-height: 1.2;
}

.mcc-cls-highlight-row.is-surprise
.mcc-cls-highlight-icon {
    background: #fff5e8;
    color: #f59e0b;
}

.mcc-cls-highlight-row.is-surprise
.mcc-cls-highlight-value strong {
    color: #e98a08;
}


/* =========================================================
   HISTORY BACK TO FULL WIDTH
   ========================================================= */

.mcc-cls-history-wide {
    display: block !important;

    width: 100% !important;
    max-width: none !important;

    margin-top: 16px !important;

    grid-column: 1 / -1 !important;
}

.mcc-cls-main + .mcc-cls-history-wide,
.mcc-cls-history-wide .mcc-cls-history {
    width: 100% !important;
    max-width: none !important;
}


/*
 * Undo sidebar-specific rules from the previous experiment.
 */

.mcc-cls-side + .mcc-cls-history-wide {
    width: 100% !important;
}


/* Mobile */

@media (max-width: 767px) {

    .mcc-cls-highlight-row {
        min-height: 63px;
        padding: 10px 13px;
    }

    .mcc-cls-highlight-value strong {
        font-size: 17px;
    }

    .mcc-cls-history-wide {
        margin-top: 12px !important;
    }
}


/* =========================================================
   DESTAQUES DO CAMPEONATO V2
   ========================================================= */

.mcc-cls-highlights {
    overflow: hidden;
}

.mcc-cls-highlights .mcc-panel-head {
    margin-bottom: 0;
}

.mcc-cls-highlights-list {
    display: flex;
    flex-direction: column;
}

.mcc-cls-highlight-row {
    display: grid;
    grid-template-columns:
        38px
        minmax(0, 1fr)
        auto;

    align-items: center;
    gap: 11px;

    min-height: 68px;
    padding: 11px 15px;

    border-top:
        1px solid
        #edf1f4;
}

.mcc-cls-highlight-row:first-child {
    border-top: 0;
}


/* icon */

.mcc-cls-highlight-mark {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 36px;
    height: 36px;

    border-radius: 10px;

    background: #eef8f3;
    color: #16a765;
}

.mcc-cls-highlight-mark span {
    font-size: 17px;
    font-weight: 900;
    line-height: 1;
}

.mcc-cls-highlight-mark.is-defense {
    background: #edf5ff;
    color: #3283d5;
}

.mcc-cls-highlight-mark.is-streak {
    background: #f1efff;
    color: #7357d6;
}

.mcc-cls-highlight-mark.is-surprise {
    background: #fff4e5;
    color: #e99a13;
}


/* copy */

.mcc-cls-highlight-copy {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 3px;
}

.mcc-cls-highlight-copy > span {
    color: #9299a1;

    font-size: 9px;
    font-weight: 800;
    line-height: 1.2;

    letter-spacing: .04em;
    text-transform: uppercase;
}

.mcc-cls-highlight-copy > strong {
    overflow: hidden;

    color: #22272b;

    font-size: 12px;
    font-weight: 900;
    line-height: 1.3;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.mcc-cls-highlight-copy > small {
    overflow: hidden;

    color: #9ca3aa;

    font-size: 9px;
    font-weight: 500;
    line-height: 1.3;

    white-space: nowrap;
    text-overflow: ellipsis;
}


/* right value */

.mcc-cls-highlight-value {
    display: flex;
    min-width: 48px;
    flex-direction: column;
    align-items: flex-end;
    gap: 2px;

    text-align: right;
}

.mcc-cls-highlight-value strong {
    color: #171b1f;

    font-size: 19px;
    font-weight: 950;
    line-height: 1;
}

.mcc-cls-highlight-value span {
    color: #9ca3aa;

    font-size: 8px;
    font-weight: 700;
    line-height: 1.1;
}

.mcc-cls-highlight-row.is-surprise
.mcc-cls-highlight-value strong {
    color: #e8930b;
}


/* =========================================================
   HISTORY — FULL WIDTH AGAIN
   ========================================================= */

.mcc-cls-history-wide {
    display: block !important;

    width: 100% !important;
    max-width: none !important;

    margin:
        16px 0 0
        !important;

    padding: 0 !important;

    grid-column:
        1 / -1
        !important;
}

.mcc-cls-history-wide
.mcc-cls-history {
    width: 100% !important;
    max-width: none !important;
}


/*
 * It is no longer a sidebar widget.
 */

.mcc-cls-history-wide
.mcc-cls-chart-wrap {
    width: 100% !important;

    padding:
        18px
        24px
        14px
        !important;
}

.mcc-cls-history-wide
.mcc-cls-history-svg {
    display: block;

    width: 100% !important;
    height: auto !important;

    max-width: none !important;
}


/* Mobile */

@media (max-width: 767px) {

    .mcc-cls-highlight-row {
        grid-template-columns:
            36px
            minmax(0, 1fr)
            auto;

        min-height: 64px;

        padding:
            10px
            13px;
    }

    .mcc-cls-highlight-mark {
        width: 34px;
        height: 34px;
    }

    .mcc-cls-highlight-value strong {
        font-size: 17px;
    }

    .mcc-cls-history-wide {
        margin-top:
            12px
            !important;
    }

    .mcc-cls-history-wide
    .mcc-cls-chart-wrap {
        padding:
            14px
            12px
            10px
            !important;
    }
}


/* =========================================================
   HISTORY — COMPACT FULL-WIDTH SIZE
   ========================================================= */

.mcc-cls-history-wide {
    width: 100% !important;
    margin-top: 16px !important;
}

.mcc-cls-history-wide .mcc-cls-history {
    width: 100% !important;
    min-height: 0 !important;
}


/*
 * IMPORTANT:
 * do NOT let SVG keep its intrinsic 360:245 ratio
 * when stretched to the full classification width.
 */

.mcc-cls-history-wide .mcc-cls-chart-wrap {
    width: 100% !important;

    height: 185px !important;
    min-height: 185px !important;
    max-height: 185px !important;

    padding:
        10px
        22px
        8px
        !important;

    overflow: hidden !important;
}

.mcc-cls-history-wide .mcc-cls-history-svg {
    display: block !important;

    width: 100% !important;

    height: 165px !important;
    min-height: 165px !important;
    max-height: 165px !important;

    aspect-ratio: auto !important;

    margin: 0 !important;
}


/*
 * Compact team row/header as well.
 */

.mcc-cls-history-wide .mcc-cls-history-team {
    min-height: 42px !important;
    padding:
        8px
        14px
        !important;
}

.mcc-cls-history-wide .mcc-cls-history-team img {
    width: 24px !important;
    height: 24px !important;
}

.mcc-cls-history-wide .mcc-cls-history-foot {
    min-height: 34px !important;

    padding:
        7px
        14px
        !important;
}


@media (max-width: 767px) {

    .mcc-cls-history-wide .mcc-cls-chart-wrap {
        height: 175px !important;
        min-height: 175px !important;
        max-height: 175px !important;

        padding:
            8px
            10px
            6px
            !important;
    }

    .mcc-cls-history-wide .mcc-cls-history-svg {
        height: 158px !important;
        min-height: 158px !important;
        max-height: 158px !important;
    }
}


/* =========================================================
   DESTAQUES — SVG ICONS V3
   ========================================================= */

.mcc-cls-highlight-mark {
    border-radius: 11px !important;
}

.mcc-cls-highlight-mark svg {
    display: block;

    width: 20px;
    height: 20px;

    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.mcc-cls-highlight-mark.is-attack {
    background: #ecf9f2 !important;
    color: #139e60 !important;
}

.mcc-cls-highlight-mark.is-defense {
    background: #edf5ff !important;
    color: #347fd1 !important;
}

.mcc-cls-highlight-mark.is-streak {
    background: #f2efff !important;
    color: #7555d8 !important;
}

.mcc-cls-highlight-mark.is-surprise {
    background: #fff4e5 !important;
    color: #e99912 !important;
}


/*
 * Slightly cleaner rows.
 */

.mcc-cls-highlight-row {
    min-height: 66px !important;
}

.mcc-cls-highlight-copy > strong {
    font-size: 13px !important;
}

.mcc-cls-highlight-value strong {
    font-size: 19px !important;
}


/* =========================================================
   HISTORY V5 — SAME WIDTH AS STANDINGS COLUMN
   ========================================================= */

.mcc-cls-history-wide {
    display: block !important;

    width: 100% !important;
    max-width: 100% !important;

    margin:
        14px 0 0
        !important;

    padding: 0 !important;

    grid-column: auto !important;
}


/*
 * Compact card.
 */

.mcc-cls-history-wide
.mcc-cls-history {
    width: 100% !important;
    max-width: 100% !important;

    min-height: 0 !important;
}


/*
 * We want roughly the red-box size,
 * not the giant proportional SVG.
 */

.mcc-cls-history-wide
.mcc-cls-chart-wrap {
    box-sizing: border-box !important;

    width: 100% !important;

    height: 176px !important;
    min-height: 176px !important;
    max-height: 176px !important;

    padding:
        8px
        18px
        6px
        !important;

    overflow: hidden !important;
}

.mcc-cls-history-wide
.mcc-cls-history-svg {
    display: block !important;

    width: 100% !important;

    height: 160px !important;
    min-height: 160px !important;
    max-height: 160px !important;

    margin: 0 !important;

    aspect-ratio: auto !important;

    preserve-aspect-ratio: none;
}


/* Team strip */

.mcc-cls-history-wide
.mcc-cls-history-team {
    min-height: 40px !important;

    padding:
        7px
        13px
        !important;
}

.mcc-cls-history-wide
.mcc-cls-history-team img {
    width: 23px !important;
    height: 23px !important;
}


/* Footer */

.mcc-cls-history-wide
.mcc-cls-history-foot {
    min-height: 32px !important;

    padding:
        6px
        13px
        !important;
}


@media (max-width: 767px) {

    .mcc-cls-history-wide {
        width: 100% !important;
        margin-top: 12px !important;
    }

    .mcc-cls-history-wide
    .mcc-cls-chart-wrap {
        height: 170px !important;
        min-height: 170px !important;
        max-height: 170px !important;

        padding:
            8px
            9px
            6px
            !important;
    }

    .mcc-cls-history-wide
    .mcc-cls-history-svg {
        height: 154px !important;
        min-height: 154px !important;
        max-height: 154px !important;
    }
}


/* =========================================================
   HISTORY V6 — BELOW STANDINGS, SAME COLUMN WIDTH
   ========================================================= */

.mcc-cls-history-wide {
    display: block !important;

    box-sizing: border-box !important;

    width: 100% !important;
    max-width: 100% !important;

    margin:
        14px 0 0
        !important;

    padding: 0 !important;

    grid-column: auto !important;
    grid-row: auto !important;
}


/* Card */

.mcc-cls-history-wide
.mcc-cls-history {
    box-sizing: border-box !important;

    width: 100% !important;
    max-width: 100% !important;

    margin: 0 !important;

    min-height: 0 !important;
}


/* Compact graph */

.mcc-cls-history-wide
.mcc-cls-chart-wrap {
    box-sizing: border-box !important;

    width: 100% !important;

    height: 170px !important;
    min-height: 170px !important;
    max-height: 170px !important;

    padding:
        8px
        18px
        6px
        !important;

    overflow: hidden !important;
}


.mcc-cls-history-wide
.mcc-cls-history-svg {
    display: block !important;

    width: 100% !important;

    height: 156px !important;
    min-height: 156px !important;
    max-height: 156px !important;

    margin: 0 !important;

    aspect-ratio: auto !important;
}


/* Team strip */

.mcc-cls-history-wide
.mcc-cls-history-team {
    box-sizing: border-box !important;

    min-height: 39px !important;

    padding:
        7px
        13px
        !important;
}


/* Footer */

.mcc-cls-history-wide
.mcc-cls-history-foot {
    min-height: 31px !important;

    padding:
        6px
        13px
        !important;
}


@media (max-width: 767px) {

    .mcc-cls-history-wide {
        margin-top:
            12px
            !important;
    }

    .mcc-cls-history-wide
    .mcc-cls-chart-wrap {
        height: 165px !important;
        min-height: 165px !important;
        max-height: 165px !important;

        padding:
            8px
            9px
            6px
            !important;
    }

    .mcc-cls-history-wide
    .mcc-cls-history-svg {
        height: 150px !important;
        min-height: 150px !important;
        max-height: 150px !important;
    }
}


/* =========================================================
   CLASSIFICATION — REAL TWO COLUMN STRUCTURE
   ========================================================= */

.mcc-cls-layout {
    align-items: start !important;
}

.mcc-cls-layout > .mcc-cls-main-column {
    display: flex !important;
    flex-direction: column !important;

    width: 100% !important;
    min-width: 0 !important;

    gap: 14px !important;
}

.mcc-cls-layout > .mcc-cls-main-column
> .mcc-cls-standing,

.mcc-cls-layout > .mcc-cls-main-column
> .mcc-cls-history-wide {
    width: 100% !important;
    max-width: 100% !important;

    margin: 0 !important;
}

.mcc-cls-layout > .mcc-cls-side {
    width: 100% !important;
    min-width: 0 !important;
}


/*
 * Histórico must behave as a normal left-column card.
 */

.mcc-cls-main-column
.mcc-cls-history-wide {
    display: block !important;

    grid-column: auto !important;
    grid-row: auto !important;

    padding: 0 !important;
}


/* Mobile */

@media (max-width: 767px) {

    .mcc-cls-layout > .mcc-cls-main-column {
        gap: 12px !important;
    }

}


/* =========================================================
   HISTORICO DAS CLASSIFICACOES V2
   ========================================================= */

.mcc-cls-history-v2 {
    overflow: hidden;
    width: 100%;
    background: #fff;
}


/* header */

.mcc-cls-history-v2-head {
    position: relative;

    display: flex;
    align-items: center;
    justify-content: center;

    min-height: 58px;

    padding: 12px 54px 10px;

    border-bottom: 1px solid #edf0f2;
}

.mcc-cls-history-v2-title {
    text-align: center;
}

.mcc-cls-history-v2-title > span {
    display: none;
}

.mcc-cls-history-v2-title h2 {
    margin: 0;

    color: #161a1e;

    font-size: 17px;
    font-weight: 850;
    line-height: 1.2;

    text-transform: none;
    letter-spacing: 0;
}


/* info */

.mcc-cls-history-v2
button.mcc-cls-history-info {
    position: absolute !important;
    top: 17px !important;
    right: 18px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 23px !important;
    min-width: 23px !important;
    max-width: 23px !important;

    height: 23px !important;
    min-height: 23px !important;
    max-height: 23px !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-radius: 50% !important;

    background: transparent !important;
    box-shadow: none !important;

    color: #202428 !important;
}

.mcc-cls-history-info svg {
    display: block;

    width: 22px;
    height: 22px;

    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
}

.mcc-cls-history-info-dot {
    fill: currentColor;
    stroke: none;
}


/* chart */

.mcc-cls-history-v2-chart {
    box-sizing: border-box;

    width: 100%;
    height: 225px;

    padding: 12px 16px 0;

    overflow: hidden;
}

.mcc-cls-history-v2-svg {
    display: block;

    width: 100%;
    height: 210px;
}


/* grid */

.mcc-cls-history-v2-grid {
    stroke: #dfe4e8;
    stroke-width: 1;
    stroke-dasharray: 4 5;

    vector-effect: non-scaling-stroke;
}

.mcc-cls-history-v2-y,
.mcc-cls-history-v2-x {
    fill: #626b73;

    font-size: 9px;
    font-weight: 600;
}


/* series 1 */

.mcc-cls-history-series.is-series-one {
    color: #16ad61;
}

.mcc-cls-history-series.is-series-one
.mcc-cls-history-v2-line {
    stroke: #16ad61;
}

.mcc-cls-history-series.is-series-one
.mcc-cls-history-v2-point {
    fill: #fff;
    stroke: #16ad61;
}


/* series 2 */

.mcc-cls-history-series.is-series-two {
    color: #4963ff;
}

.mcc-cls-history-series.is-series-two
.mcc-cls-history-v2-line {
    stroke: #4963ff;
}

.mcc-cls-history-series.is-series-two
.mcc-cls-history-v2-point {
    fill: #fff;
    stroke: #4963ff;
}


/* lines */

.mcc-cls-history-v2-line {
    fill: none;

    stroke-width: 2;

    stroke-linecap: round;
    stroke-linejoin: round;

    vector-effect: non-scaling-stroke;
}


/* points */

.mcc-cls-history-v2-point {
    stroke-width: 2;

    vector-effect: non-scaling-stroke;

    cursor: pointer;

    transition:
        r .12s ease,
        opacity .12s ease;
}

.mcc-cls-history-v2-point:hover {
    r: 6;
}


/* tooltip */

.mcc-cls-history-tooltip rect {
    fill: #161b20;

    opacity: .96;
}

.mcc-cls-history-tooltip text {
    fill: #fff;

    font-size: 10px;
}

.mcc-cls-history-tooltip
[data-history-tooltip-team] {
    font-weight: 800;
}

.mcc-cls-history-tooltip
[data-history-tooltip-value] {
    fill: #cbd2d7;
}


/* round navigator */

.mcc-cls-history-round {
    display: grid;

    grid-template-columns:
        36px
        minmax(0, 1fr)
        36px;

    align-items: center;

    min-height: 48px;

    padding: 4px 14px;

    border-top: 1px solid #edf0f2;
}

.mcc-cls-history-round > div {
    display: flex;

    align-items: baseline;
    justify-content: center;

    gap: 6px;
}

.mcc-cls-history-round strong {
    color: #181c20;

    font-size: 19px;
    font-weight: 900;
}

.mcc-cls-history-round span {
    color: #929aa2;

    font-size: 10px;
    font-weight: 500;
}

.mcc-cls-history-arrow {
    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    width: 30px !important;
    height: 30px !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;

    color: #4963ff !important;

    font-size: 29px !important;
    font-weight: 400 !important;

    cursor: pointer;
}


/* selectors */

.mcc-cls-history-selectors {
    display: grid;

    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );

    gap: 10px;

    padding:
        10px
        14px
        8px;

    border-top: 1px solid #f0f2f4;
}

.mcc-cls-history-select-wrap {
    position: relative;
}

.mcc-cls-history-select-wrap::before {
    content: "";

    position: absolute;
    top: 0;
    right: 0;
    left: 0;

    height: 3px;

    border-radius: 3px 3px 0 0;
}

.mcc-cls-history-select-wrap.is-one::before {
    background: #16ad61;
}

.mcc-cls-history-select-wrap.is-two::before {
    background: #4963ff;
}

.mcc-cls-history-select {
    box-sizing: border-box;

    display: block;

    width: 100%;
    height: 39px;

    padding:
        0
        34px
        0
        12px;

    border: 1px solid #dce1e5;
    border-radius: 8px;

    background: #fff;

    color: #22272b;

    font-size: 11px;
    font-weight: 700;

    outline: none;
}


/* status */

.mcc-cls-history-status {
    display: grid;

    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );

    gap: 10px;

    padding:
        0
        14px
        14px;
}

.mcc-cls-history-status article {
    display: grid;

    grid-template-columns:
        auto
        minmax(0, 1fr);

    grid-template-rows:
        auto
        auto;

    align-items: center;

    min-height: 52px;

    padding: 8px 11px;

    border-radius: 8px;

    background: #f5f7f8;
}

.mcc-cls-history-status article::before {
    content: "";

    grid-row:
        1 / 3;

    width: 3px;
    height: 32px;

    margin-right: 9px;

    border-radius: 999px;
}

.mcc-cls-history-status article.is-one::before {
    background: #16ad61;
}

.mcc-cls-history-status article.is-two::before {
    background: #4963ff;
}

.mcc-cls-history-status span {
    color: #9199a1;

    font-size: 8px;
    font-weight: 700;

    text-transform: uppercase;
}

.mcc-cls-history-status strong {
    color: #171b1f;

    font-size: 16px;
    font-weight: 900;
}

.mcc-cls-history-status small {
    grid-column: 2;

    overflow: hidden;

    color: #687179;

    font-size: 10px;
    font-weight: 600;

    white-space: nowrap;
    text-overflow: ellipsis;
}


/* dialog */

.mcc-cls-history-dialog {
    width:
        min(
            330px,
            calc(
                100vw - 34px
            )
        );

    padding: 0;

    border: 0;
    border-radius: 16px;

    background: #fff;

    box-shadow:
        0
        14px
        40px
        rgba(
            15,
            23,
            42,
            .25
        );
}

.mcc-cls-history-dialog::backdrop {
    background:
        rgba(
            15,
            23,
            42,
            .55
        );
}

.mcc-cls-history-dialog > div {
    padding: 20px 19px 17px;
}

.mcc-cls-history-dialog h3 {
    margin: 0 0 14px;

    color: #24282c;

    font-size: 17px;
    font-weight: 800;
}

.mcc-cls-history-dialog p {
    margin:
        0 0 10px;

    color: #444b52;

    font-size: 13px;
    line-height: 1.45;
}

.mcc-cls-history-dialog button {
    display: block;

    margin:
        17px
        0
        0
        auto;

    padding: 3px 0;

    border: 0;

    background: transparent;

    color: #4963ff;

    font-size: 12px;
    font-weight: 850;

    cursor: pointer;
}


/* mobile */

@media (max-width: 767px) {

    .mcc-cls-history-v2-head {
        min-height: 54px;

        padding:
            11px
            46px
            9px;
    }

    .mcc-cls-history-v2-title h2 {
        font-size: 15px;
    }

    .mcc-cls-history-v2-chart {
        height: 205px;

        padding:
            10px
            8px
            0;

        overflow-x: auto;
        overflow-y: hidden;
    }

    .mcc-cls-history-v2-svg {
        min-width: 650px;
        height: 192px;
    }

    .mcc-cls-history-selectors,
    .mcc-cls-history-status {
        gap: 7px;

        padding-right: 10px;
        padding-left: 10px;
    }

}


/* =========================================================
   HISTORY V3 — 4 TEAM REFERENCE LAYOUT
   ========================================================= */

.mcc-cls-history-v3 {
    width: 100%;
    overflow: hidden;
    background: #fff;
}


/* HEADER */

.mcc-cls-history-v3-head {
    position: relative;

    display: flex;
    align-items: center;
    justify-content: center;

    min-height: 54px;

    padding:
        12px
        48px
        8px;
}

.mcc-cls-history-v3-head h2 {
    margin: 0;

    color: #15191d;

    font-size: 17px;
    font-weight: 800;
    line-height: 1.25;

    text-transform: none;
    letter-spacing: 0;
}


/* INFO */

.mcc-cls-history-v3
button.mcc-cls-history-v3-info {
    position: absolute !important;

    top: 15px !important;
    right: 16px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 23px !important;
    min-width: 23px !important;
    max-width: 23px !important;

    height: 23px !important;
    min-height: 23px !important;
    max-height: 23px !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-radius: 50% !important;

    background: transparent !important;
    box-shadow: none !important;

    color: #202428 !important;
}

.mcc-cls-history-v3-info svg {
    display: block;

    width: 22px;
    height: 22px;

    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
}

.mcc-cls-history-v3-info-dot {
    fill: currentColor;
    stroke: none;
}


/* CHART */

.mcc-cls-history-v3-chart {
    width: 100%;
    height: 245px;

    padding:
        4px
        10px
        0;

    box-sizing: border-box;

    overflow: hidden;
}

.mcc-cls-history-v3-svg {
    display: block;

    width: 100%;
    height: 235px;
}


/* GRID */

.mcc-cls-history-v3-grid {
    stroke: #d6dde2;
    stroke-width: 1;
    stroke-dasharray: 4 5;

    vector-effect:
        non-scaling-stroke;
}

.mcc-cls-history-v3-y,
.mcc-cls-history-v3-x {
    fill: #4f5961;

    font-size: 9px;
    font-weight: 600;
}


/* CURRENT ROUND LINE */

.mcc-cls-history-v3-current {
    stroke: #aeb6bd;
    stroke-width: 1;

    vector-effect:
        non-scaling-stroke;
}


/* SERIES */

.mcc-cls-history-v3-line {
    fill: none;

    stroke-width: 2.1;

    stroke-linecap: round;
    stroke-linejoin: round;

    vector-effect:
        non-scaling-stroke;
}

.mcc-cls-history-v3-point {
    fill: #fff;

    stroke-width: 2;

    vector-effect:
        non-scaling-stroke;

    cursor: pointer;
}


/* GREEN */

.mcc-cls-history-v3-series.is-slot-1
.mcc-cls-history-v3-line,
.mcc-cls-history-v3-series.is-slot-1
.mcc-cls-history-v3-point {
    stroke: #10ac4b;
}


/* BLUE */

.mcc-cls-history-v3-series.is-slot-2
.mcc-cls-history-v3-line,
.mcc-cls-history-v3-series.is-slot-2
.mcc-cls-history-v3-point {
    stroke: #4057ff;
}


/* ORANGE */

.mcc-cls-history-v3-series.is-slot-3
.mcc-cls-history-v3-line,
.mcc-cls-history-v3-series.is-slot-3
.mcc-cls-history-v3-point {
    stroke: #ec9200;
}


/* GOLD */

.mcc-cls-history-v3-series.is-slot-4
.mcc-cls-history-v3-line,
.mcc-cls-history-v3-series.is-slot-4
.mcc-cls-history-v3-point {
    stroke: #b8aa55;
}


/* TOOLTIP */

.mcc-cls-history-v3-tooltip rect {
    fill: #151a1f;
    opacity: .96;
}

.mcc-cls-history-v3-tooltip text {
    fill: #fff;
    font-size: 10px;
}

.mcc-cls-history-v3-tooltip
[data-history-tooltip-team] {
    font-weight: 800;
}

.mcc-cls-history-v3-tooltip
[data-history-tooltip-value] {
    fill: #c8cfd4;
}


/* ROUND NAV */

.mcc-cls-history-v3-round {
    display: grid;

    grid-template-columns:
        38px
        minmax(0, 1fr)
        38px;

    align-items: center;

    min-height: 52px;

    padding:
        2px
        9px;

    border-top:
        1px solid #edf0f2;
}

.mcc-cls-history-v3-round > div {
    display: flex;

    justify-content: center;
    align-items: baseline;

    gap: 6px;
}

.mcc-cls-history-v3-round strong {
    color: #13171b;

    font-size: 19px;
    font-weight: 900;
}

.mcc-cls-history-v3-round span {
    color: #929aa1;

    font-size: 10px;
    font-weight: 500;
}

.mcc-cls-history-v3-round em {
    font-style: normal;
}


.mcc-cls-history-v3-arrow {
    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    width: 30px !important;
    height: 30px !important;

    padding: 0 !important;

    border: 0 !important;

    background: transparent !important;

    color: #4057ff !important;

    box-shadow: none !important;

    font-size: 30px !important;
    font-weight: 400 !important;

    cursor: pointer;
}


/* FOUR SELECTORS */

.mcc-cls-history-v3-selectors {
    display: grid;

    grid-template-columns:
        repeat(
            4,
            minmax(0, 1fr)
        );

    gap: 8px;

    padding:
        8px
        9px
        7px;
}

.mcc-cls-history-v3-select {
    position: relative;
}

.mcc-cls-history-v3-select::before {
    content: "";

    position: absolute;

    right: 0;
    bottom: -5px;
    left: 0;

    height: 3px;

    border-radius: 999px;
}

.mcc-cls-history-v3-select.is-slot-1::before {
    background: #10ac4b;
}

.mcc-cls-history-v3-select.is-slot-2::before {
    background: #4057ff;
}

.mcc-cls-history-v3-select.is-slot-3::before {
    background: #ec9200;
}

.mcc-cls-history-v3-select.is-slot-4::before {
    background: #b8aa55;
}

.mcc-cls-history-v3-select select {
    box-sizing: border-box;

    display: block;

    width: 100%;
    height: 38px;

    padding:
        0
        28px
        0
        9px;

    border:
        1px solid #d8dee3;

    border-radius: 7px;

    background: #fff;

    color: #1f2429;

    font-size: 11px;
    font-weight: 700;

    outline: none;
}


/* FOUR MATCH CARDS */

.mcc-cls-history-v3-cards {
    display: grid;

    grid-template-columns:
        repeat(
            4,
            minmax(0, 1fr)
        );

    gap: 8px;

    padding:
        4px
        9px
        12px;
}

.mcc-cls-history-v3-card {
    position: relative;

    min-height: 78px;

    padding:
        8px
        8px
        9px;

    box-sizing: border-box;

    border-radius: 4px;

    background: #f5f7f8;

    text-align: center;
}

.mcc-cls-history-v3-card::before {
    content: "";

    position: absolute;

    top: 0;
    right: 0;
    left: 0;

    height: 3px;

    border-radius:
        4px
        4px
        0
        0;
}

.mcc-cls-history-v3-card.is-slot-1::before {
    background: #10ac4b;
}

.mcc-cls-history-v3-card.is-slot-2::before {
    background: #4057ff;
}

.mcc-cls-history-v3-card.is-slot-3::before {
    background: #ec9200;
}

.mcc-cls-history-v3-card.is-slot-4::before {
    background: #b8aa55;
}


/* POSITION */

.mcc-cls-history-v3-position {
    display: flex;

    justify-content: center;
    align-items: baseline;

    gap: 3px;

    min-height: 25px;
}

.mcc-cls-history-v3-position span {
    color: #969da4;

    font-size: 10px;
    font-weight: 500;
}

.mcc-cls-history-v3-position strong {
    color: #161a1e;

    font-size: 15px;
    font-weight: 900;
}


/* RESULT */

.mcc-cls-history-v3-result {
    display: flex;

    align-items: center;
    justify-content: center;

    min-height: 38px;

    color: #7d858c;

    font-size: 10px;
    font-weight: 500;
    line-height: 1.3;
}

.mcc-cls-history-match-result {
    display: flex;

    align-items: center;
    justify-content: center;

    gap: 9px;

    width: 100%;
}

.mcc-cls-history-match-result
.is-team {
    display: flex;

    align-items: center;
    justify-content: center;

    width: 25px;
    height: 25px;
}

.mcc-cls-history-match-result img {
    display: block;

    width: 23px;
    height: 23px;

    object-fit: contain;
}

.mcc-cls-history-match-result strong {
    color: #363c42;

    font-size: 15px;
    font-weight: 800;
}

.mcc-cls-history-no-game {
    display: block;

    max-width: 120px;

    margin: auto;
}


/* DIALOG */

.mcc-cls-history-v3-dialog {
    width:
        min(
            330px,
            calc(
                100vw - 34px
            )
        );

    padding: 0;

    border: 0;
    border-radius: 16px;

    background: #fff;

    box-shadow:
        0
        14px
        38px
        rgba(
            15,
            23,
            42,
            .26
        );
}

.mcc-cls-history-v3-dialog::backdrop {
    background:
        rgba(
            15,
            23,
            42,
            .55
        );
}

.mcc-cls-history-v3-dialog > div {
    padding:
        19px
        18px
        17px;
}

.mcc-cls-history-v3-dialog h3 {
    margin:
        0
        0
        14px;

    font-size: 17px;
    font-weight: 800;
}

.mcc-cls-history-v3-dialog p {
    margin:
        0
        0
        9px;

    color: #444b52;

    font-size: 13px;
    line-height: 1.45;
}

.mcc-cls-history-v3-dialog button {
    display: block;

    margin:
        17px
        0
        0
        auto;

    padding: 3px 0;

    border: 0;

    background: transparent;

    color: #4057ff;

    font-size: 12px;
    font-weight: 850;
}


/* MOBILE */

@media (max-width: 767px) {

    .mcc-cls-history-v3-chart {
        overflow-x: auto;
        overflow-y: hidden;

        height: 225px;
    }

    .mcc-cls-history-v3-svg {
        min-width: 690px;

        height: 215px;
    }

    .mcc-cls-history-v3-selectors,
    .mcc-cls-history-v3-cards {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );

        gap: 7px;
    }

    .mcc-cls-history-v3-round span {
        font-size: 9px;
    }
}


/* =========================================================
   HISTORY V3 — 4 TEAM REFERENCE LAYOUT
   ========================================================= */

.mcc-cls-history-v3 {
    width: 100%;
    overflow: hidden;
    background: #fff;
}


/* HEADER */

.mcc-cls-history-v3-head {
    position: relative;

    display: flex;
    align-items: center;
    justify-content: center;

    min-height: 54px;

    padding:
        12px
        48px
        8px;
}

.mcc-cls-history-v3-head h2 {
    margin: 0;

    color: #15191d;

    font-size: 17px;
    font-weight: 800;
    line-height: 1.25;

    text-transform: none;
    letter-spacing: 0;
}


/* INFO */

.mcc-cls-history-v3
button.mcc-cls-history-v3-info {
    position: absolute !important;

    top: 15px !important;
    right: 16px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 23px !important;
    min-width: 23px !important;
    max-width: 23px !important;

    height: 23px !important;
    min-height: 23px !important;
    max-height: 23px !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-radius: 50% !important;

    background: transparent !important;
    box-shadow: none !important;

    color: #202428 !important;
}

.mcc-cls-history-v3-info svg {
    display: block;

    width: 22px;
    height: 22px;

    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
}

.mcc-cls-history-v3-info-dot {
    fill: currentColor;
    stroke: none;
}


/* CHART */

.mcc-cls-history-v3-chart {
    width: 100%;
    height: 245px;

    padding:
        4px
        10px
        0;

    box-sizing: border-box;

    overflow: hidden;
}

.mcc-cls-history-v3-svg {
    display: block;

    width: 100%;
    height: 235px;
}


/* GRID */

.mcc-cls-history-v3-grid {
    stroke: #d6dde2;
    stroke-width: 1;
    stroke-dasharray: 4 5;

    vector-effect:
        non-scaling-stroke;
}

.mcc-cls-history-v3-y,
.mcc-cls-history-v3-x {
    fill: #4f5961;

    font-size: 9px;
    font-weight: 600;
}


/* CURRENT ROUND LINE */

.mcc-cls-history-v3-current {
    stroke: #aeb6bd;
    stroke-width: 1;

    vector-effect:
        non-scaling-stroke;
}


/* SERIES */

.mcc-cls-history-v3-line {
    fill: none;

    stroke-width: 2.1;

    stroke-linecap: round;
    stroke-linejoin: round;

    vector-effect:
        non-scaling-stroke;
}

.mcc-cls-history-v3-point {
    fill: #fff;

    stroke-width: 2;

    vector-effect:
        non-scaling-stroke;

    cursor: pointer;
}


/* GREEN */

.mcc-cls-history-v3-series.is-slot-1
.mcc-cls-history-v3-line,
.mcc-cls-history-v3-series.is-slot-1
.mcc-cls-history-v3-point {
    stroke: #10ac4b;
}


/* BLUE */

.mcc-cls-history-v3-series.is-slot-2
.mcc-cls-history-v3-line,
.mcc-cls-history-v3-series.is-slot-2
.mcc-cls-history-v3-point {
    stroke: #4057ff;
}


/* ORANGE */

.mcc-cls-history-v3-series.is-slot-3
.mcc-cls-history-v3-line,
.mcc-cls-history-v3-series.is-slot-3
.mcc-cls-history-v3-point {
    stroke: #ec9200;
}


/* GOLD */

.mcc-cls-history-v3-series.is-slot-4
.mcc-cls-history-v3-line,
.mcc-cls-history-v3-series.is-slot-4
.mcc-cls-history-v3-point {
    stroke: #b8aa55;
}


/* TOOLTIP */

.mcc-cls-history-v3-tooltip rect {
    fill: #151a1f;
    opacity: .96;
}

.mcc-cls-history-v3-tooltip text {
    fill: #fff;
    font-size: 10px;
}

.mcc-cls-history-v3-tooltip
[data-history-tooltip-team] {
    font-weight: 800;
}

.mcc-cls-history-v3-tooltip
[data-history-tooltip-value] {
    fill: #c8cfd4;
}


/* ROUND NAV */

.mcc-cls-history-v3-round {
    display: grid;

    grid-template-columns:
        38px
        minmax(0, 1fr)
        38px;

    align-items: center;

    min-height: 52px;

    padding:
        2px
        9px;

    border-top:
        1px solid #edf0f2;
}

.mcc-cls-history-v3-round > div {
    display: flex;

    justify-content: center;
    align-items: baseline;

    gap: 6px;
}

.mcc-cls-history-v3-round strong {
    color: #13171b;

    font-size: 19px;
    font-weight: 900;
}

.mcc-cls-history-v3-round span {
    color: #929aa1;

    font-size: 10px;
    font-weight: 500;
}

.mcc-cls-history-v3-round em {
    font-style: normal;
}


.mcc-cls-history-v3-arrow {
    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    width: 30px !important;
    height: 30px !important;

    padding: 0 !important;

    border: 0 !important;

    background: transparent !important;

    color: #4057ff !important;

    box-shadow: none !important;

    font-size: 30px !important;
    font-weight: 400 !important;

    cursor: pointer;
}


/* FOUR SELECTORS */

.mcc-cls-history-v3-selectors {
    display: grid;

    grid-template-columns:
        repeat(
            4,
            minmax(0, 1fr)
        );

    gap: 8px;

    padding:
        8px
        9px
        7px;
}

.mcc-cls-history-v3-select {
    position: relative;
}

.mcc-cls-history-v3-select::before {
    content: "";

    position: absolute;

    right: 0;
    bottom: -5px;
    left: 0;

    height: 3px;

    border-radius: 999px;
}

.mcc-cls-history-v3-select.is-slot-1::before {
    background: #10ac4b;
}

.mcc-cls-history-v3-select.is-slot-2::before {
    background: #4057ff;
}

.mcc-cls-history-v3-select.is-slot-3::before {
    background: #ec9200;
}

.mcc-cls-history-v3-select.is-slot-4::before {
    background: #b8aa55;
}

.mcc-cls-history-v3-select select {
    box-sizing: border-box;

    display: block;

    width: 100%;
    height: 38px;

    padding:
        0
        28px
        0
        9px;

    border:
        1px solid #d8dee3;

    border-radius: 7px;

    background: #fff;

    color: #1f2429;

    font-size: 11px;
    font-weight: 700;

    outline: none;
}


/* FOUR MATCH CARDS */

.mcc-cls-history-v3-cards {
    display: grid;

    grid-template-columns:
        repeat(
            4,
            minmax(0, 1fr)
        );

    gap: 8px;

    padding:
        4px
        9px
        12px;
}

.mcc-cls-history-v3-card {
    position: relative;

    min-height: 78px;

    padding:
        8px
        8px
        9px;

    box-sizing: border-box;

    border-radius: 4px;

    background: #f5f7f8;

    text-align: center;
}

.mcc-cls-history-v3-card::before {
    content: "";

    position: absolute;

    top: 0;
    right: 0;
    left: 0;

    height: 3px;

    border-radius:
        4px
        4px
        0
        0;
}

.mcc-cls-history-v3-card.is-slot-1::before {
    background: #10ac4b;
}

.mcc-cls-history-v3-card.is-slot-2::before {
    background: #4057ff;
}

.mcc-cls-history-v3-card.is-slot-3::before {
    background: #ec9200;
}

.mcc-cls-history-v3-card.is-slot-4::before {
    background: #b8aa55;
}


/* POSITION */

.mcc-cls-history-v3-position {
    display: flex;

    justify-content: center;
    align-items: baseline;

    gap: 3px;

    min-height: 25px;
}

.mcc-cls-history-v3-position span {
    color: #969da4;

    font-size: 10px;
    font-weight: 500;
}

.mcc-cls-history-v3-position strong {
    color: #161a1e;

    font-size: 15px;
    font-weight: 900;
}


/* RESULT */

.mcc-cls-history-v3-result {
    display: flex;

    align-items: center;
    justify-content: center;

    min-height: 38px;

    color: #7d858c;

    font-size: 10px;
    font-weight: 500;
    line-height: 1.3;
}

.mcc-cls-history-match-result {
    display: flex;

    align-items: center;
    justify-content: center;

    gap: 9px;

    width: 100%;
}

.mcc-cls-history-match-result
.is-team {
    display: flex;

    align-items: center;
    justify-content: center;

    width: 25px;
    height: 25px;
}

.mcc-cls-history-match-result img {
    display: block;

    width: 23px;
    height: 23px;

    object-fit: contain;
}

.mcc-cls-history-match-result strong {
    color: #363c42;

    font-size: 15px;
    font-weight: 800;
}

.mcc-cls-history-no-game {
    display: block;

    max-width: 120px;

    margin: auto;
}


/* DIALOG */

.mcc-cls-history-v3-dialog {
    width:
        min(
            330px,
            calc(
                100vw - 34px
            )
        );

    padding: 0;

    border: 0;
    border-radius: 16px;

    background: #fff;

    box-shadow:
        0
        14px
        38px
        rgba(
            15,
            23,
            42,
            .26
        );
}

.mcc-cls-history-v3-dialog::backdrop {
    background:
        rgba(
            15,
            23,
            42,
            .55
        );
}

.mcc-cls-history-v3-dialog > div {
    padding:
        19px
        18px
        17px;
}

.mcc-cls-history-v3-dialog h3 {
    margin:
        0
        0
        14px;

    font-size: 17px;
    font-weight: 800;
}

.mcc-cls-history-v3-dialog p {
    margin:
        0
        0
        9px;

    color: #444b52;

    font-size: 13px;
    line-height: 1.45;
}

.mcc-cls-history-v3-dialog button {
    display: block;

    margin:
        17px
        0
        0
        auto;

    padding: 3px 0;

    border: 0;

    background: transparent;

    color: #4057ff;

    font-size: 12px;
    font-weight: 850;
}


/* MOBILE */

@media (max-width: 767px) {

    .mcc-cls-history-v3-chart {
        overflow-x: auto;
        overflow-y: hidden;

        height: 225px;
    }

    .mcc-cls-history-v3-svg {
        min-width: 690px;

        height: 215px;
    }

    .mcc-cls-history-v3-selectors,
    .mcc-cls-history-v3-cards {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );

        gap: 7px;
    }

    .mcc-cls-history-v3-round span {
        font-size: 9px;
    }
}


/* =========================================================
   HISTORY V3 — DYNAMIC 2 / 3 / 4 TEAMS
   ========================================================= */

.mcc-cls-history-v3-controls {
    display: flex;
    align-items: center;
    gap: 8px;

    padding:
        8px
        9px
        7px;
}

.mcc-cls-history-v3-controls
.mcc-cls-history-v3-selectors {
    flex: 1;

    padding: 0;
}

.mcc-cls-history-v3.has-2-teams
.mcc-cls-history-v3-selectors,

.mcc-cls-history-v3.has-2-teams
.mcc-cls-history-v3-cards {
    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        ) !important;
}

.mcc-cls-history-v3.has-3-teams
.mcc-cls-history-v3-selectors,

.mcc-cls-history-v3.has-3-teams
.mcc-cls-history-v3-cards {
    grid-template-columns:
        repeat(
            3,
            minmax(0, 1fr)
        ) !important;
}

.mcc-cls-history-v3.has-4-teams
.mcc-cls-history-v3-selectors,

.mcc-cls-history-v3.has-4-teams
.mcc-cls-history-v3-cards {
    grid-template-columns:
        repeat(
            4,
            minmax(0, 1fr)
        ) !important;
}


/* hidden slot */

.mcc-cls-history-v3-select.is-hidden,
.mcc-cls-history-v3-card.is-hidden {
    display: none !important;
}


/* controls */

.mcc-cls-history-v3-actions {
    display: flex;
    align-items: center;
    gap: 5px;
}

.mcc-cls-history-v3-add,
.mcc-cls-history-v3-remove {
    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    width: 34px !important;
    min-width: 34px !important;
    height: 34px !important;

    padding: 0 !important;

    border: 0 !important;
    border-radius: 50% !important;

    box-shadow: none !important;

    font-size: 25px !important;
    line-height: 1 !important;

    cursor: pointer;
}

.mcc-cls-history-v3-add {
    background: #4057ff !important;
    color: #fff !important;
}

.mcc-cls-history-v3-remove {
    background: transparent !important;
    color: #4057ff !important;
}

.mcc-cls-history-v3-add[hidden],
.mcc-cls-history-v3-remove[hidden] {
    display: none !important;
}


/* cards need same horizontal padding as controls */

.mcc-cls-history-v3-cards {
    padding-top: 4px !important;
}


/* mobile */

@media (max-width: 767px) {

    .mcc-cls-history-v3-controls {
        align-items: flex-start;
    }

    .mcc-cls-history-v3.has-3-teams
    .mcc-cls-history-v3-selectors,

    .mcc-cls-history-v3.has-3-teams
    .mcc-cls-history-v3-cards,

    .mcc-cls-history-v3.has-4-teams
    .mcc-cls-history-v3-selectors,

    .mcc-cls-history-v3.has-4-teams
    .mcc-cls-history-v3-cards {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            ) !important;
    }
}


/* =========================================================
   HISTORY V4 — FINAL REFERENCE DESIGN
   ========================================================= */

/*
 * Entire card
 */

.mcc-cls-main-column
.mcc-cls-history-wide {
    margin-top: 14px !important;
}

.mcc-cls-history-v3 {
    box-sizing: border-box !important;

    overflow: hidden !important;

    width: 100% !important;

    border-radius: 10px !important;

    background: #fff !important;
}


/* =========================================================
   HEADER
   ========================================================= */

.mcc-cls-history-v3-head {
    position: relative !important;

    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    height: 52px !important;
    min-height: 52px !important;

    margin: 0 !important;

    padding:
        0
        48px
        !important;

    border: 0 !important;
}

.mcc-cls-history-v3-head h2 {
    margin: 0 !important;

    color: #171a1d !important;

    font-size: 16px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;

    letter-spacing: 0 !important;
    text-transform: none !important;
}


/* =========================================================
   INFO ICON — KILL FLATSOME BUTTON CSS
   ========================================================= */

.mcc-cls-history-v3
button.mcc-cls-history-v3-info {
    position: absolute !important;

    top: 14px !important;
    right: 14px !important;

    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    box-sizing: border-box !important;

    width: 22px !important;
    min-width: 22px !important;
    max-width: 22px !important;

    height: 22px !important;
    min-height: 22px !important;
    max-height: 22px !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-radius: 50% !important;

    background: transparent !important;
    background-image: none !important;

    box-shadow: none !important;

    color: #24282c !important;

    line-height: 1 !important;

    transform: none !important;
}

.mcc-cls-history-v3
button.mcc-cls-history-v3-info svg {
    display: block !important;

    width: 21px !important;
    height: 21px !important;
}


/* =========================================================
   CHART
   ========================================================= */

.mcc-cls-history-v3-chart {
    box-sizing: border-box !important;

    width: 100% !important;

    height: 220px !important;
    min-height: 220px !important;
    max-height: 220px !important;

    margin: 0 !important;

    padding:
        6px
        12px
        0
        !important;

    overflow: hidden !important;
}

.mcc-cls-history-v3-svg {
    display: block !important;

    width: 100% !important;

    height: 210px !important;
    min-height: 210px !important;
    max-height: 210px !important;

    margin: 0 !important;
}


/*
 * Reference-style subtle grid
 */

.mcc-cls-history-v3-grid {
    stroke: #b9c1c8 !important;

    stroke-width: .8 !important;

    stroke-dasharray:
        3
        5
        !important;

    opacity: .8;
}

.mcc-cls-history-v3-y,
.mcc-cls-history-v3-x {
    fill: #1f252a !important;

    font-size: 9px !important;
    font-weight: 500 !important;
}


/*
 * Current round marker
 */

.mcc-cls-history-v3-current {
    stroke: #aeb5bb !important;

    stroke-width: 1 !important;

    opacity: .85;
}


/* Lines */

.mcc-cls-history-v3-line {
    fill: none !important;

    stroke-width: 2 !important;

    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}


/*
 * Points normally invisible.
 * Appear on hover.
 */

.mcc-cls-history-v3-point {
    fill: #fff !important;

    stroke-width: 2 !important;

    opacity: 0;

    transition:
        opacity .12s ease;
}

.mcc-cls-history-v3-point:hover {
    opacity: 1;
}


/* =========================================================
   ROUND NAV
   ========================================================= */

.mcc-cls-history-v3-round {
    display: grid !important;

    grid-template-columns:
        34px
        minmax(0, 1fr)
        34px
        !important;

    align-items: center !important;

    box-sizing: border-box !important;

    width: 100% !important;

    height: 50px !important;
    min-height: 50px !important;
    max-height: 50px !important;

    margin: 0 !important;

    padding:
        0
        10px
        !important;

    border-top:
        1px solid
        #eef1f3
        !important;
}

.mcc-cls-history-v3-round > div {
    display: flex !important;

    align-items: baseline !important;
    justify-content: center !important;

    gap: 5px !important;
}

.mcc-cls-history-v3-round strong {
    color: #15191d !important;

    font-size: 20px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
}

.mcc-cls-history-v3-round span {
    color: #969da4 !important;

    font-size: 10px !important;
    font-weight: 500 !important;
}


/*
 * arrows
 */

.mcc-cls-history-v3
button.mcc-cls-history-v3-arrow {
    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    box-sizing: border-box !important;

    width: 28px !important;
    min-width: 28px !important;
    max-width: 28px !important;

    height: 28px !important;
    min-height: 28px !important;
    max-height: 28px !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;

    background: transparent !important;
    background-image: none !important;

    box-shadow: none !important;

    color: #4057ff !important;

    font-family: Arial, sans-serif !important;

    font-size: 27px !important;
    font-weight: 400 !important;
    line-height: 1 !important;

    transform: none !important;
}


/* =========================================================
   SELECTOR ROW
   ========================================================= */

.mcc-cls-history-v3-controls {
    display: flex !important;

    align-items: center !important;

    box-sizing: border-box !important;

    width: 100% !important;

    min-height: 48px !important;

    margin: 0 !important;

    padding:
        5px
        10px
        4px
        !important;

    gap: 8px !important;
}

.mcc-cls-history-v3-controls
.mcc-cls-history-v3-selectors {
    display: grid !important;

    flex: 1 1 auto !important;

    gap: 8px !important;

    margin: 0 !important;
    padding: 0 !important;
}


/*
 * 2 / 3 / 4 responsive widths
 */

.mcc-cls-history-v3.has-2-teams
.mcc-cls-history-v3-selectors {
    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        )
        !important;
}

.mcc-cls-history-v3.has-3-teams
.mcc-cls-history-v3-selectors {
    grid-template-columns:
        repeat(
            3,
            minmax(0, 1fr)
        )
        !important;
}

.mcc-cls-history-v3.has-4-teams
.mcc-cls-history-v3-selectors {
    grid-template-columns:
        repeat(
            4,
            minmax(0, 1fr)
        )
        !important;
}


/*
 * Selector cell
 */

.mcc-cls-history-v3-select {
    position: relative !important;

    display: flex !important;

    align-items: center !important;

    box-sizing: border-box !important;

    min-width: 0 !important;

    height: 38px !important;

    margin: 0 !important;

    border:
        1px solid
        #d7dde2
        !important;

    border-radius: 7px !important;

    background: #fff !important;
}


/*
 * Remove previous colored line under select.
 * Card below already owns the color.
 */

.mcc-cls-history-v3-select::before {
    display: none !important;
}


/*
 * Team logo inside selector
 */

.mcc-cls-history-team-select-logo {
    position: absolute !important;

    z-index: 2;

    top: 50% !important;
    left: 8px !important;

    display: block;

    width: 24px !important;
    height: 24px !important;

    object-fit: contain;

    transform:
        translateY(-50%);

    pointer-events: none;
}


/*
 * Native select
 */

.mcc-cls-history-v3-select select {
    box-sizing: border-box !important;

    display: block !important;

    width: 100% !important;
    height: 36px !important;

    margin: 0 !important;

    padding:
        0
        28px
        0
        39px
        !important;

    border: 0 !important;
    border-radius: 7px !important;

    background: transparent !important;

    box-shadow: none !important;

    color: #1d2226 !important;

    font-size: 12px !important;
    font-weight: 600 !important;

    outline: none !important;
}


/* =========================================================
   ACTIONS
   ========================================================= */

.mcc-cls-history-v3-actions {
    display: flex !important;

    flex: 0 0 auto !important;

    align-items: center !important;

    gap: 4px !important;

    height: 38px !important;
}


/*
 * REMOVE
 */

.mcc-cls-history-v3
button.mcc-cls-history-v3-remove {
    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    box-sizing: border-box !important;

    width: 28px !important;
    min-width: 28px !important;
    max-width: 28px !important;

    height: 38px !important;
    min-height: 38px !important;
    max-height: 38px !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;

    background: transparent !important;
    background-image: none !important;

    color: #4057ff !important;

    box-shadow: none !important;

    font-family: Arial, sans-serif !important;

    font-size: 27px !important;
    font-weight: 300 !important;
    line-height: 1 !important;

    transform: none !important;
}


/*
 * ADD
 *
 * THIS kills the Flatsome 62px monster.
 */

.mcc-cls-history-v3
button.mcc-cls-history-v3-add {
    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    box-sizing: border-box !important;

    width: 38px !important;
    min-width: 38px !important;
    max-width: 38px !important;

    height: 38px !important;
    min-height: 38px !important;
    max-height: 38px !important;

    margin: 0 !important;
    padding: 0 0 2px !important;

    border: 0 !important;
    border-radius: 50% !important;

    background: #4057ff !important;
    background-image: none !important;

    color: #fff !important;

    box-shadow: none !important;

    font-family: Arial, sans-serif !important;

    font-size: 25px !important;
    font-weight: 300 !important;
    line-height: 1 !important;

    transform: none !important;
}

.mcc-cls-history-v3
button.mcc-cls-history-v3-add:hover {
    background: #3349ec !important;

    transform: none !important;
}

.mcc-cls-history-v3-add[hidden],
.mcc-cls-history-v3-remove[hidden] {
    display: none !important;
}


/* =========================================================
   RESULT CARDS
   ========================================================= */

.mcc-cls-history-v3-cards {
    display: grid !important;

    box-sizing: border-box !important;

    width: 100% !important;

    gap: 8px !important;

    margin: 0 !important;

    padding:
        0
        10px
        12px
        !important;
}

.mcc-cls-history-v3.has-2-teams
.mcc-cls-history-v3-cards {
    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        )
        !important;
}

.mcc-cls-history-v3.has-3-teams
.mcc-cls-history-v3-cards {
    grid-template-columns:
        repeat(
            3,
            minmax(0, 1fr)
        )
        !important;
}

.mcc-cls-history-v3.has-4-teams
.mcc-cls-history-v3-cards {
    grid-template-columns:
        repeat(
            4,
            minmax(0, 1fr)
        )
        !important;
}


/*
 * Card
 */

.mcc-cls-history-v3-card {
    position: relative !important;

    box-sizing: border-box !important;

    min-width: 0 !important;

    height: 76px !important;
    min-height: 76px !important;
    max-height: 76px !important;

    margin: 0 !important;

    padding:
        7px
        8px
        8px
        !important;

    border: 0 !important;
    border-radius: 3px !important;

    background: #f4f6f8 !important;

    text-align: center !important;
}


/*
 * top line
 */

.mcc-cls-history-v3-card::before {
    content: "" !important;

    position: absolute !important;

    top: 0 !important;
    right: 0 !important;
    left: 0 !important;

    display: block !important;

    height: 3px !important;

    border-radius:
        3px
        3px
        0
        0
        !important;
}

.mcc-cls-history-v3-card.is-slot-1::before {
    background: #0daf4c !important;
}

.mcc-cls-history-v3-card.is-slot-2::before {
    background: #4057ff !important;
}

.mcc-cls-history-v3-card.is-slot-3::before {
    background: #ed9200 !important;
}

.mcc-cls-history-v3-card.is-slot-4::before {
    background: #b9aa55 !important;
}


/* position */

.mcc-cls-history-v3-position {
    display: flex !important;

    align-items: baseline !important;
    justify-content: center !important;

    min-height: 23px !important;

    gap: 3px !important;
}

.mcc-cls-history-v3-position span {
    color: #90979e !important;

    font-size: 10px !important;
    font-weight: 500 !important;
}

.mcc-cls-history-v3-position strong {
    color: #161a1e !important;

    font-size: 15px !important;
    font-weight: 900 !important;
}


/* score */

.mcc-cls-history-v3-result {
    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    min-height: 39px !important;

    color: #858d94 !important;

    font-size: 10px !important;
    line-height: 1.3 !important;
}

.mcc-cls-history-match-result {
    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    gap: 8px !important;
}

.mcc-cls-history-match-result
.is-team {
    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    width: 24px !important;
    height: 24px !important;
}

.mcc-cls-history-match-result img {
    display: block !important;

    width: 23px !important;
    height: 23px !important;

    object-fit: contain !important;
}

.mcc-cls-history-match-result strong {
    color: #343a40 !important;

    font-size: 15px !important;
    font-weight: 700 !important;
}

.mcc-cls-history-no-game {
    max-width: 120px !important;

    margin: auto !important;
}


/* =========================================================
   HIDDEN
   ========================================================= */

.mcc-cls-history-v3-select.is-hidden,
.mcc-cls-history-v3-card.is-hidden {
    display: none !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

    .mcc-cls-history-v3-chart {
        height: 205px !important;

        overflow-x: auto !important;
        overflow-y: hidden !important;
    }

    .mcc-cls-history-v3-svg {
        min-width: 690px !important;

        height: 195px !important;
        min-height: 195px !important;
        max-height: 195px !important;
    }

    .mcc-cls-history-v3.has-3-teams
    .mcc-cls-history-v3-selectors,

    .mcc-cls-history-v3.has-4-teams
    .mcc-cls-history-v3-selectors,

    .mcc-cls-history-v3.has-3-teams
    .mcc-cls-history-v3-cards,

    .mcc-cls-history-v3.has-4-teams
    .mcc-cls-history-v3-cards {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            )
            !important;
    }
}


/* =========================================================
   HISTORY V5 — REFERENCE LAYOUT HARD RESET
   ========================================================= */

.mcc-cls-history-v3 {
    box-sizing: border-box !important;
    width: 100% !important;
    overflow: hidden !important;
    background: #fff !important;
}


/* =========================================================
   1. HEADER — CENTER LIKE REFERENCE
   ========================================================= */

.mcc-cls-history-v3-head {
    position: relative !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;
    height: 54px !important;
    min-height: 54px !important;

    margin: 0 !important;
    padding: 0 52px !important;

    border: 0 !important;

    text-align: center !important;
}

.mcc-cls-history-v3-head h2 {
    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #15191d !important;

    font-size: 16px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;

    text-align: center !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}


/* info */

.mcc-cls-history-v3
button.mcc-cls-history-v3-info {
    position: absolute !important;

    top: 16px !important;
    right: 16px !important;
    left: auto !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 22px !important;
    min-width: 22px !important;
    max-width: 22px !important;

    height: 22px !important;
    min-height: 22px !important;
    max-height: 22px !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-radius: 50% !important;

    background: transparent !important;
    background-image: none !important;

    box-shadow: none !important;
    transform: none !important;
}


/* =========================================================
   2. CHART — MATCH REFERENCE PROPORTIONS
   ========================================================= */

.mcc-cls-history-v3-chart {
    box-sizing: border-box !important;

    width: 100% !important;

    height: 214px !important;
    min-height: 214px !important;
    max-height: 214px !important;

    margin: 0 !important;

    padding:
        10px
        20px
        0
        !important;

    overflow: hidden !important;
}

.mcc-cls-history-v3-svg {
    display: block !important;

    width: 100% !important;

    height: 202px !important;
    min-height: 202px !important;
    max-height: 202px !important;

    margin: 0 !important;
}


/* grid lines */

.mcc-cls-history-v3-grid {
    stroke: #b9c1c7 !important;
    stroke-width: .8 !important;
    stroke-dasharray: 3 5 !important;

    opacity: .75 !important;
}

.mcc-cls-history-v3-y,
.mcc-cls-history-v3-x {
    fill: #161b20 !important;

    font-size: 8.5px !important;
    font-weight: 500 !important;
}


/* lines */

.mcc-cls-history-v3-line {
    fill: none !important;

    stroke-width: 2 !important;

    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}


/* hide point dots unless hovered */

.mcc-cls-history-v3-point {
    opacity: 0 !important;

    fill: #fff !important;
    stroke-width: 2 !important;
}

.mcc-cls-history-v3-point:hover {
    opacity: 1 !important;
}


/* =========================================================
   3. ROUND NAV — COMPACT
   ========================================================= */

.mcc-cls-history-v3-round {
    box-sizing: border-box !important;

    display: grid !important;
    grid-template-columns:
        32px
        minmax(0, 1fr)
        32px
        !important;

    align-items: center !important;

    width: 100% !important;

    height: 50px !important;
    min-height: 50px !important;
    max-height: 50px !important;

    margin: 0 !important;
    padding: 0 13px !important;

    border-top: 1px solid #edf0f2 !important;
}

.mcc-cls-history-v3-round > div {
    display: flex !important;

    align-items: baseline !important;
    justify-content: center !important;

    gap: 5px !important;

    text-align: center !important;
}

.mcc-cls-history-v3-round strong {
    color: #14181c !important;

    font-size: 20px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
}

.mcc-cls-history-v3-round span {
    color: #969da4 !important;

    font-size: 10px !important;
    font-weight: 500 !important;
}


/* arrows */

.mcc-cls-history-v3
button.mcc-cls-history-v3-arrow {
    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    width: 28px !important;
    min-width: 28px !important;
    max-width: 28px !important;

    height: 28px !important;
    min-height: 28px !important;
    max-height: 28px !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;

    background: transparent !important;
    background-image: none !important;

    color: #4057ff !important;

    box-shadow: none !important;
    transform: none !important;

    font-family: Arial, sans-serif !important;
    font-size: 27px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
}


/* =========================================================
   4. CONTROLS — THIS IS THE BIG BROKEN PART
   ========================================================= */

.mcc-cls-history-v3-controls {
    box-sizing: border-box !important;

    display: grid !important;

    /*
     * Selectors take ALL available width.
     * Actions stay directly beside them.
     */
    grid-template-columns:
        minmax(0, 1fr)
        auto
        !important;

    align-items: center !important;

    width: 100% !important;

    min-height: 48px !important;

    margin: 0 !important;

    padding:
        5px
        12px
        4px
        !important;

    gap: 7px !important;
}


/*
 * Kill all old width/flex rules.
 */

.mcc-cls-history-v3-controls
.mcc-cls-history-v3-selectors {
    display: grid !important;

    box-sizing: border-box !important;

    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    gap: 8px !important;

    flex: none !important;
}


/* DEFAULT TWO TEAMS */

.mcc-cls-history-v3.has-2-teams
.mcc-cls-history-v3-selectors {
    grid-template-columns:
        repeat(2, minmax(0, 1fr))
        !important;
}


/* THREE */

.mcc-cls-history-v3.has-3-teams
.mcc-cls-history-v3-selectors {
    grid-template-columns:
        repeat(3, minmax(0, 1fr))
        !important;
}


/* FOUR */

.mcc-cls-history-v3.has-4-teams
.mcc-cls-history-v3-selectors {
    grid-template-columns:
        repeat(4, minmax(0, 1fr))
        !important;
}


/* =========================================================
   SELECT
   ========================================================= */

.mcc-cls-history-v3-select {
    position: relative !important;

    box-sizing: border-box !important;

    display: flex !important;
    align-items: center !important;

    width: 100% !important;
    min-width: 0 !important;

    height: 38px !important;

    margin: 0 !important;

    border: 1px solid #d6dce1 !important;
    border-radius: 7px !important;

    background: #fff !important;
}

.mcc-cls-history-v3-select::before {
    display: none !important;
}


/* team logo */

.mcc-cls-history-team-select-logo {
    position: absolute !important;

    z-index: 3 !important;

    top: 50% !important;
    left: 8px !important;

    display: block !important;

    width: 23px !important;
    height: 23px !important;

    margin: 0 !important;

    object-fit: contain !important;

    transform: translateY(-50%) !important;

    pointer-events: none !important;
}

.mcc-cls-history-team-select-logo[hidden] {
    display: none !important;
}


/* select */

.mcc-cls-history-v3-select select {
    box-sizing: border-box !important;

    display: block !important;

    width: 100% !important;
    min-width: 0 !important;

    height: 36px !important;

    margin: 0 !important;

    /*
     * logo at left
     */
    padding:
        0
        29px
        0
        39px
        !important;

    border: 0 !important;
    border-radius: 7px !important;

    background-color: transparent !important;

    box-shadow: none !important;

    color: #1b2024 !important;

    font-size: 12px !important;
    font-weight: 600 !important;

    outline: 0 !important;
}


/* =========================================================
   5. + / × MUST STAY NEXT TO SELECTORS
   ========================================================= */

.mcc-cls-history-v3-actions {
    display: flex !important;

    align-items: center !important;
    justify-content: flex-end !important;

    width: auto !important;
    min-width: 38px !important;

    height: 38px !important;

    margin: 0 !important;
    padding: 0 !important;

    gap: 4px !important;
}


/* REMOVE */

.mcc-cls-history-v3
button.mcc-cls-history-v3-remove {
    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    box-sizing: border-box !important;

    width: 28px !important;
    min-width: 28px !important;
    max-width: 28px !important;

    height: 38px !important;
    min-height: 38px !important;
    max-height: 38px !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-radius: 0 !important;

    background: transparent !important;
    background-image: none !important;

    color: #4057ff !important;

    box-shadow: none !important;
    transform: none !important;

    font-family: Arial, sans-serif !important;
    font-size: 26px !important;
    font-weight: 300 !important;
    line-height: 1 !important;
}


/* ADD */

.mcc-cls-history-v3
button.mcc-cls-history-v3-add {
    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    box-sizing: border-box !important;

    width: 38px !important;
    min-width: 38px !important;
    max-width: 38px !important;

    height: 38px !important;
    min-height: 38px !important;
    max-height: 38px !important;

    margin: 0 !important;
    padding: 0 0 2px !important;

    border: 0 !important;
    border-radius: 50% !important;

    background: #4057ff !important;
    background-image: none !important;

    color: #fff !important;

    box-shadow: none !important;

    transform: none !important;

    font-family: Arial, sans-serif !important;
    font-size: 24px !important;
    font-weight: 300 !important;
    line-height: 1 !important;
}

.mcc-cls-history-v3
button.mcc-cls-history-v3-add:hover,
.mcc-cls-history-v3
button.mcc-cls-history-v3-add:focus {
    background: #344bea !important;

    transform: none !important;
}


/* hidden really hidden */

.mcc-cls-history-v3-add[hidden],
.mcc-cls-history-v3-remove[hidden],
.mcc-cls-history-v3-select.is-hidden,
.mcc-cls-history-v3-card.is-hidden {
    display: none !important;
}


/* =========================================================
   6. RESULT CARDS — ALIGN EXACTLY UNDER SELECTORS
   ========================================================= */

.mcc-cls-history-v3-cards {
    box-sizing: border-box !important;

    display: grid !important;

    width: 100% !important;

    margin: 0 !important;

    /*
     * Right padding reserves action-button width,
     * so cards line up with selectors.
     */
    padding:
        1px
        57px
        12px
        12px
        !important;

    gap: 8px !important;
}


.mcc-cls-history-v3.has-2-teams
.mcc-cls-history-v3-cards {
    grid-template-columns:
        repeat(2, minmax(0, 1fr))
        !important;
}


.mcc-cls-history-v3.has-3-teams
.mcc-cls-history-v3-cards {
    grid-template-columns:
        repeat(3, minmax(0, 1fr))
        !important;
}


.mcc-cls-history-v3.has-4-teams
.mcc-cls-history-v3-cards {
    grid-template-columns:
        repeat(4, minmax(0, 1fr))
        !important;
}


/* card */

.mcc-cls-history-v3-card {
    position: relative !important;

    box-sizing: border-box !important;

    width: 100% !important;
    min-width: 0 !important;

    height: 76px !important;
    min-height: 76px !important;
    max-height: 76px !important;

    margin: 0 !important;

    padding:
        8px
        8px
        7px
        !important;

    border: 0 !important;
    border-radius: 3px !important;

    background: #f3f5f7 !important;
}


/* color top */

.mcc-cls-history-v3-card::before {
    content: "" !important;

    position: absolute !important;

    top: 0 !important;
    right: 0 !important;
    left: 0 !important;

    display: block !important;

    height: 3px !important;
}

.mcc-cls-history-v3-card.is-slot-1::before {
    background: #0daf4c !important;
}

.mcc-cls-history-v3-card.is-slot-2::before {
    background: #4057ff !important;
}

.mcc-cls-history-v3-card.is-slot-3::before {
    background: #ed9200 !important;
}

.mcc-cls-history-v3-card.is-slot-4::before {
    background: #b9aa55 !important;
}


/* position */

.mcc-cls-history-v3-position {
    display: flex !important;

    align-items: baseline !important;
    justify-content: center !important;

    gap: 3px !important;

    height: 23px !important;
    min-height: 23px !important;
}

.mcc-cls-history-v3-position span {
    color: #9299a0 !important;

    font-size: 10px !important;
    font-weight: 500 !important;
}

.mcc-cls-history-v3-position strong {
    color: #15191d !important;

    font-size: 15px !important;
    font-weight: 900 !important;
}


/* result */

.mcc-cls-history-v3-result {
    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    height: 40px !important;
    min-height: 40px !important;

    color: #80888f !important;

    font-size: 10px !important;
    font-weight: 500 !important;
    line-height: 1.3 !important;

    text-align: center !important;
}

.mcc-cls-history-match-result {
    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    gap: 8px !important;
}

.mcc-cls-history-match-result img {
    display: block !important;

    width: 23px !important;
    height: 23px !important;

    object-fit: contain !important;
}

.mcc-cls-history-match-result strong {
    color: #363b40 !important;

    font-size: 15px !important;
    font-weight: 700 !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

    .mcc-cls-history-v3-chart {
        height: 205px !important;

        overflow-x: auto !important;
        overflow-y: hidden !important;
    }

    .mcc-cls-history-v3-svg {
        min-width: 680px !important;

        height: 195px !important;
        min-height: 195px !important;
        max-height: 195px !important;
    }

    .mcc-cls-history-v3.has-3-teams
    .mcc-cls-history-v3-selectors,

    .mcc-cls-history-v3.has-4-teams
    .mcc-cls-history-v3-selectors,

    .mcc-cls-history-v3.has-3-teams
    .mcc-cls-history-v3-cards,

    .mcc-cls-history-v3.has-4-teams
    .mcc-cls-history-v3-cards {
        grid-template-columns:
            repeat(2, minmax(0, 1fr))
            !important;
    }
}


/* =========================================================
   HISTORY V6
   SELECTORS + RESULTS EXACT GRID
   ========================================================= */


/* ---------------------------------------------------------
   CARD
   --------------------------------------------------------- */

.mcc-cls-history-v3 {
    width: 100% !important;
    box-sizing: border-box !important;
    background: #fff !important;
    border: 1px solid #dce2e8 !important;
    border-radius: 12px !important;
    overflow: hidden !important;
}


/* ---------------------------------------------------------
   HEADER
   --------------------------------------------------------- */

.mcc-cls-history-v3-head {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-height: 58px !important;
    padding: 0 54px !important;
    border-bottom: 0 !important;
}

.mcc-cls-history-v3-head h2 {
    margin: 0 !important;
    font-size: 18px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
    text-transform: none !important;
}

.mcc-cls-history-v3-info {
    position: absolute !important;
    top: 50% !important;
    right: 20px !important;
    transform: translateY(-50%) !important;

    width: 28px !important;
    height: 28px !important;
    padding: 3px !important;
    margin: 0 !important;

    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.mcc-cls-history-v3-info svg {
    width: 22px !important;
    height: 22px !important;
}


/* ---------------------------------------------------------
   CHART
   --------------------------------------------------------- */

.mcc-cls-history-v3-chart {
    padding: 4px 22px 0 !important;
}

.mcc-cls-history-v3-svg {
    display: block !important;
    width: 100% !important;
    height: 235px !important;
}


/* ---------------------------------------------------------
   ROUND
   --------------------------------------------------------- */

.mcc-cls-history-v3-round {
    display: grid !important;
    grid-template-columns: 42px 1fr 42px !important;
    align-items: center !important;

    min-height: 62px !important;
    padding: 0 12px !important;
    margin: 0 !important;
    border: 0 !important;
}

.mcc-cls-history-v3-round > div {
    display: flex !important;
    align-items: baseline !important;
    justify-content: center !important;
    gap: 5px !important;
}

.mcc-cls-history-v3-round strong {
    font-size: 23px !important;
    line-height: 1 !important;
    font-weight: 700 !important;
}

.mcc-cls-history-v3-round span {
    font-size: 13px !important;
    color: #9aa3ad !important;
}

.mcc-cls-history-v3-round em {
    font-style: normal !important;
    margin-left: 3px !important;
}

.mcc-cls-history-v3-arrow {
    width: 34px !important;
    height: 42px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;

    color: #4057ff !important;
    font-size: 34px !important;
    line-height: 1 !important;
}


/* =========================================================
   CONTROLS
   IMPORTANT:
   entire row is ALWAYS 100% width.
   ========================================================= */

.mcc-cls-history-v3-controls {
    display: grid !important;
    align-items: stretch !important;
    gap: 10px !important;

    width: 100% !important;
    padding: 0 18px !important;
    margin: 0 !important;

    box-sizing: border-box !important;
}


/*
 * 2 teams:
 *
 * TEAM | TEAM | X | +
 *
 * Team columns consume all remaining width.
 */

.mcc-cls-history-v3-controls[data-active-slots="2"] {
    grid-template-columns:
        minmax(0, 1fr)
        minmax(0, 1fr)
        34px
        48px !important;
}


/*
 * 3 teams:
 *
 * TEAM | TEAM | TEAM | X | +
 */

.mcc-cls-history-v3-controls[data-active-slots="3"] {
    grid-template-columns:
        minmax(0, 1fr)
        minmax(0, 1fr)
        minmax(0, 1fr)
        34px
        48px !important;
}


/*
 * 4 teams:
 *
 * TEAM | TEAM | TEAM | TEAM | X
 */

.mcc-cls-history-v3-controls[data-active-slots="4"] {
    grid-template-columns:
        minmax(0, 1fr)
        minmax(0, 1fr)
        minmax(0, 1fr)
        minmax(0, 1fr)
        34px !important;
}


/*
 * Flatten selector wrapper so each selector
 * participates directly in controls grid.
 */

.mcc-cls-history-v3-selectors {
    display: contents !important;
}


/* ---------------------------------------------------------
   SELECTOR
   --------------------------------------------------------- */

.mcc-cls-history-v3-select {
    position: relative !important;

    display: flex !important;
    align-items: center !important;

    min-width: 0 !important;
    height: 46px !important;

    padding: 0 !important;
    margin: 0 !important;

    background: #fff !important;
    border: 1px solid #d7dde4 !important;
    border-radius: 8px !important;

    overflow: hidden !important;
    box-sizing: border-box !important;
}


/*
 * Colored line under selector.
 */

.mcc-cls-history-v3-select::after {
    content: "" !important;

    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: -7px !important;

    height: 4px !important;
    border-radius: 3px !important;
}

.mcc-cls-history-v3-select.is-slot-1::after {
    background: #12b84f !important;
}

.mcc-cls-history-v3-select.is-slot-2::after {
    background: #4057ff !important;
}

.mcc-cls-history-v3-select.is-slot-3::after {
    background: #f29a00 !important;
}

.mcc-cls-history-v3-select.is-slot-4::after {
    background: #cdbf78 !important;
}


/* ---------------------------------------------------------
   TEAM LOGO
   --------------------------------------------------------- */

.mcc-cls-history-v3-select-logo {
    flex: 0 0 38px !important;

    width: 38px !important;
    height: 44px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    padding-left: 7px !important;

    pointer-events: none !important;
    box-sizing: border-box !important;
}

.mcc-cls-history-v3-select-logo img {
    display: block !important;
    width: 25px !important;
    height: 25px !important;
    object-fit: contain !important;
}


/* ---------------------------------------------------------
   REAL SELECT
   --------------------------------------------------------- */

.mcc-cls-history-v3-select select {
    flex: 1 1 auto !important;

    width: 100% !important;
    min-width: 0 !important;
    height: 44px !important;

    margin: 0 !important;
    padding: 0 34px 0 5px !important;

    border: 0 !important;
    border-radius: 0 !important;

    background-color: transparent !important;

    color: #111827 !important;
    font-size: 15px !important;
    font-weight: 500 !important;

    box-shadow: none !important;
    outline: none !important;
}


/* ---------------------------------------------------------
   ACTIONS
   --------------------------------------------------------- */

.mcc-cls-history-v3-actions {
    display: contents !important;
}

.mcc-cls-history-v3-remove,
.mcc-cls-history-v3-add {
    align-self: center !important;
    justify-self: center !important;

    padding: 0 !important;
    margin: 0 !important;

    border: 0 !important;
    box-shadow: none !important;
}

.mcc-cls-history-v3-remove {
    width: 34px !important;
    height: 46px !important;

    background: transparent !important;
    color: #4057ff !important;

    font-family: Arial, sans-serif !important;
    font-size: 34px !important;
    font-weight: 300 !important;
    line-height: 46px !important;
}

.mcc-cls-history-v3-add {
    width: 48px !important;
    height: 48px !important;

    border-radius: 50% !important;
    background: #4057ff !important;
    color: #fff !important;

    font-family: Arial, sans-serif !important;
    font-size: 30px !important;
    font-weight: 400 !important;
    line-height: 48px !important;
}


/*
 * Four teams = no add button.
 */

.mcc-cls-history-v3[data-active-slots="4"]
.mcc-cls-history-v3-add {
    display: none !important;
}


/* =========================================================
   RESULT CARDS
   EXACT SAME TEAM COLUMN WIDTHS
   ========================================================= */

.mcc-cls-history-v3-cards {
    display: grid !important;
    gap: 10px !important;

    width: 100% !important;

    padding:
        14px
        100px
        16px
        18px !important;

    box-sizing: border-box !important;
}


/*
 * The right padding reserves:
 *
 * gap + X + gap + PLUS
 *
 * 10 + 34 + 10 + 48 = 102px
 *
 * This makes result columns line up exactly
 * underneath team selectors.
 */

.mcc-cls-history-v3-cards[data-active-slots="2"],
.mcc-cls-history-v3-cards[data-active-slots="3"] {
    padding-right: 112px !important;
}

.mcc-cls-history-v3-cards[data-active-slots="2"] {
    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        ) !important;
}

.mcc-cls-history-v3-cards[data-active-slots="3"] {
    grid-template-columns:
        repeat(
            3,
            minmax(0, 1fr)
        ) !important;
}


/*
 * Four teams:
 * only X remains on the right.
 */

.mcc-cls-history-v3-cards[data-active-slots="4"] {
    grid-template-columns:
        repeat(
            4,
            minmax(0, 1fr)
        ) !important;

    padding-right: 62px !important;
}


/* ---------------------------------------------------------
   RESULT CARD
   --------------------------------------------------------- */

.mcc-cls-history-v3-card {
    min-width: 0 !important;
    min-height: 94px !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;

    padding: 10px 8px 12px !important;

    background: #f4f6f8 !important;
    border: 0 !important;
    border-radius: 4px !important;

    box-sizing: border-box !important;
}

.mcc-cls-history-v3-card.is-slot-1 {
    border-top: 4px solid #12b84f !important;
}

.mcc-cls-history-v3-card.is-slot-2 {
    border-top: 4px solid #4057ff !important;
}

.mcc-cls-history-v3-card.is-slot-3 {
    border-top: 4px solid #f29a00 !important;
}

.mcc-cls-history-v3-card.is-slot-4 {
    border-top: 4px solid #cdbf78 !important;
}


/* ---------------------------------------------------------
   POSITION
   --------------------------------------------------------- */

.mcc-cls-history-v3-position {
    display: flex !important;
    align-items: baseline !important;
    justify-content: center !important;
    gap: 4px !important;

    min-height: 23px !important;
}

.mcc-cls-history-v3-position span {
    color: #8c96a3 !important;
    font-size: 13px !important;
}

.mcc-cls-history-v3-position strong {
    color: #111827 !important;
    font-size: 17px !important;
    font-weight: 700 !important;
}


/* ---------------------------------------------------------
   RESULT
   --------------------------------------------------------- */

.mcc-cls-history-v3-result {
    flex: 1 1 auto !important;

    width: 100% !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;

    color: #7f8996 !important;
    font-size: 14px !important;
    text-align: center !important;
}

.mcc-cls-history-v3-result img {
    width: 25px !important;
    height: 25px !important;
    object-fit: contain !important;
}

.mcc-cls-history-v3-result strong {
    color: #111827 !important;
    font-size: 17px !important;
    font-weight: 700 !important;
}


/* ---------------------------------------------------------
   VISIBILITY
   --------------------------------------------------------- */

.mcc-cls-history-v3-select.is-hidden,
.mcc-cls-history-v3-card.is-hidden {
    display: none !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

    .mcc-cls-history-v3-chart {
        padding-left: 8px !important;
        padding-right: 8px !important;
        overflow-x: auto !important;
    }

    .mcc-cls-history-v3-svg {
        min-width: 680px !important;
    }

    .mcc-cls-history-v3-controls {
        gap: 6px !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    .mcc-cls-history-v3-controls[data-active-slots="2"] {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(0, 1fr)
            28px
            42px !important;
    }

    .mcc-cls-history-v3-controls[data-active-slots="3"] {
        grid-template-columns:
            repeat(3, minmax(0, 1fr))
            28px
            42px !important;
    }

    .mcc-cls-history-v3-controls[data-active-slots="4"] {
        grid-template-columns:
            repeat(4, minmax(0, 1fr))
            28px !important;
    }

    .mcc-cls-history-v3-select-logo {
        flex-basis: 30px !important;
        width: 30px !important;
        padding-left: 4px !important;
    }

    .mcc-cls-history-v3-select-logo img {
        width: 21px !important;
        height: 21px !important;
    }

    .mcc-cls-history-v3-select select {
        font-size: 12px !important;
        padding-left: 2px !important;
    }

    .mcc-cls-history-v3-cards[data-active-slots="2"],
    .mcc-cls-history-v3-cards[data-active-slots="3"] {
        padding:
            12px
            98px
            14px
            10px !important;
    }

    .mcc-cls-history-v3-cards[data-active-slots="4"] {
        padding:
            12px
            50px
            14px
            10px !important;
    }

    .mcc-cls-history-v3-card {
        min-height: 82px !important;
        padding-left: 4px !important;
        padding-right: 4px !important;
    }
}



/* =========================================================
   HISTORY REFERENCE UI
   图2-图5风格
   ========================================================= */


/* =========================================================
   COMPARE AREA
   ========================================================= */

.mcc-history-ref-compare {
    --history-action-width: 82px;

    display: grid !important;
    grid-template-columns:
        minmax(0, 1fr)
        var(--history-action-width)
        !important;

    align-items: start !important;
    gap: 10px !important;

    width: 100% !important;

    box-sizing: border-box !important;

    margin: 0 !important;
    padding:
        0
        14px
        16px
        !important;
}


/* =========================================================
   TEAMS
   ========================================================= */

.mcc-history-ref-teams {
    display: grid !important;

    width: 100% !important;
    min-width: 0 !important;

    gap: 9px !important;
}


.mcc-history-ref-compare[data-active-slots="2"]
.mcc-history-ref-teams {
    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        )
        !important;
}


.mcc-history-ref-compare[data-active-slots="3"]
.mcc-history-ref-teams {
    grid-template-columns:
        repeat(
            3,
            minmax(0, 1fr)
        )
        !important;
}


.mcc-history-ref-compare[data-active-slots="4"]
.mcc-history-ref-teams {
    grid-template-columns:
        repeat(
            4,
            minmax(0, 1fr)
        )
        !important;
}


/*
 * THIS is what guarantees perfect alignment:
 *
 * selector
 * result
 *
 * are inside the SAME team column.
 */

.mcc-history-ref-team {
    display: grid !important;

    grid-template-rows:
        40px
        72px
        !important;

    gap: 6px !important;

    min-width: 0 !important;
}


.mcc-history-ref-team.is-hidden {
    display: none !important;
}


/* =========================================================
   SELECTOR
   ========================================================= */

.mcc-history-ref-select {
    position: relative !important;

    display: flex !important;
    align-items: center !important;

    box-sizing: border-box !important;

    width: 100% !important;
    min-width: 0 !important;

    height: 40px !important;

    margin: 0 !important;
    padding: 0 !important;

    border:
        1px solid
        #d5dbe1
        !important;

    border-radius: 8px !important;

    background: #fff !important;

    overflow: hidden !important;
}


/* logo */

.mcc-history-ref-select-logo {
    position: absolute !important;

    z-index: 2 !important;

    top: 50% !important;
    left: 8px !important;

    display: block !important;

    width: 24px !important;
    height: 24px !important;

    object-fit: contain !important;

    transform:
        translateY(-50%)
        !important;

    pointer-events: none !important;
}


.mcc-history-ref-select-logo[hidden] {
    display: none !important;
}


/* native select */

.mcc-history-ref-select select {
    appearance: none !important;
    -webkit-appearance: none !important;

    box-sizing: border-box !important;

    display: block !important;

    width: 100% !important;
    min-width: 0 !important;

    height: 38px !important;

    margin: 0 !important;

    padding:
        0
        37px
        0
        39px
        !important;

    border: 0 !important;

    background:
        transparent
        !important;

    box-shadow:
        none
        !important;

    color: #15191d !important;

    font-size: 13px !important;
    font-weight: 600 !important;

    line-height: 38px !important;

    outline: none !important;

    cursor: pointer !important;
}


/* custom arrow square */

.mcc-history-ref-chevron {
    position: absolute !important;

    top: 5px !important;
    right: 5px !important;

    z-index: 3 !important;

    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    width: 29px !important;
    height: 29px !important;

    border-radius: 5px !important;

    background:
        #f1f3f5
        !important;

    pointer-events: none !important;
}


.mcc-history-ref-chevron svg {
    width: 11px !important;
    height: 7px !important;

    fill: none !important;

    stroke:
        #20252a
        !important;

    stroke-width:
        1.8
        !important;

    stroke-linecap:
        round
        !important;

    stroke-linejoin:
        round
        !important;
}


/* =========================================================
   SLOT COLOR
   ========================================================= */

.mcc-history-ref-team {
    --slot-color:
        #12b84f;
}


.mcc-history-ref-team.is-slot-1 {
    --slot-color:
        #12b84f;
}


.mcc-history-ref-team.is-slot-2 {
    --slot-color:
        #4057ff;
}


.mcc-history-ref-team.is-slot-3 {
    --slot-color:
        #ec9200;
}


.mcc-history-ref-team.is-slot-4 {
    --slot-color:
        #b9aa55;
}


/* =========================================================
   RESULT CARD
   ========================================================= */

.mcc-history-ref-result-card {
    position: relative !important;

    box-sizing: border-box !important;

    display: flex !important;

    flex-direction: column !important;

    align-items: center !important;
    justify-content: flex-start !important;

    width: 100% !important;
    min-width: 0 !important;

    height: 72px !important;

    margin: 0 !important;

    padding:
        8px
        7px
        7px
        !important;

    border: 0 !important;
    border-radius: 3px !important;

    background:
        #f2f4f6
        !important;

    overflow: hidden !important;
}


/*
 * colored line EXACTLY same width as selector
 */

.mcc-history-ref-result-card::before {
    content: "" !important;

    position: absolute !important;

    top: 0 !important;
    right: 0 !important;
    left: 0 !important;

    height: 4px !important;

    background:
        var(--slot-color)
        !important;
}


/* position */

.mcc-history-ref-position {
    display: flex !important;

    align-items: baseline !important;
    justify-content: center !important;

    gap: 3px !important;

    width: 100% !important;

    margin-top: 2px !important;
}


.mcc-history-ref-position span {
    color:
        #9199a1
        !important;

    font-size:
        10px
        !important;

    font-weight:
        500
        !important;
}


.mcc-history-ref-position strong {
    color:
        #181c20
        !important;

    font-size:
        14px
        !important;

    font-weight:
        800
        !important;
}


/* result */

.mcc-history-ref-result {
    display: flex !important;

    flex: 1 1 auto !important;

    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;

    color:
        #7f8891
        !important;

    font-size:
        10px
        !important;

    text-align:
        center
        !important;
}


/* actual score */

.mcc-history-ref-result
.mcc-cls-history-match-result {
    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    gap: 8px !important;
}


.mcc-history-ref-result
.mcc-cls-history-match-result
.is-team {
    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    width: 23px !important;
    height: 23px !important;
}


.mcc-history-ref-result
.mcc-cls-history-match-result
img {
    display: block !important;

    width: 22px !important;
    height: 22px !important;

    object-fit:
        contain
        !important;
}


.mcc-history-ref-result
.mcc-cls-history-match-result
strong {
    color:
        #4c555e
        !important;

    font-size:
        14px
        !important;

    font-weight:
        700
        !important;
}


/* =========================================================
   ACTIONS
   ========================================================= */

.mcc-history-ref-actions {
    display: flex !important;

    align-items: flex-start !important;
    justify-content: flex-end !important;

    gap: 5px !important;

    width:
        var(--history-action-width)
        !important;

    padding-top: 0 !important;
}


/* absolutely kill theme button styling */

.mcc-history-ref-actions
button {
    position: static !important;

    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    box-sizing:
        border-box
        !important;

    margin: 0 !important;
    padding: 0 !important;

    border:
        0
        !important;

    box-shadow:
        none
        !important;

    transform:
        none
        !important;

    line-height:
        1
        !important;
}


/* X */

.mcc-history-ref-remove {
    width: 29px !important;
    min-width: 29px !important;
    max-width: 29px !important;

    height: 40px !important;
    min-height: 40px !important;
    max-height: 40px !important;

    background:
        transparent
        !important;

    color:
        #4057ff
        !important;
}


.mcc-history-ref-remove svg {
    width: 18px !important;
    height: 18px !important;

    fill: none !important;

    stroke:
        currentColor
        !important;

    stroke-width:
        2
        !important;

    stroke-linecap:
        round
        !important;
}


/* + */

.mcc-history-ref-add {
    width: 40px !important;
    min-width: 40px !important;
    max-width: 40px !important;

    height: 40px !important;
    min-height: 40px !important;
    max-height: 40px !important;

    border-radius:
        50%
        !important;

    background:
        #4057ff
        !important;

    color:
        #fff
        !important;
}


.mcc-history-ref-add svg {
    width: 19px !important;
    height: 19px !important;

    fill: none !important;

    stroke:
        currentColor
        !important;

    stroke-width:
        2
        !important;

    stroke-linecap:
        round
        !important;
}


/*
 * Four teams:
 * + disappears.
 *
 * Actions automatically becomes only X.
 */

.mcc-history-ref-compare[data-active-slots="4"]
.mcc-history-ref-add {
    display: none !important;
}


/* =========================================================
   4 TEAMS: shrink reserved action area
   ========================================================= */

.mcc-history-ref-compare[data-active-slots="4"] {
    --history-action-width:
        31px;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

    .mcc-history-ref-compare {
        --history-action-width:
            70px;

        gap:
            6px
            !important;

        padding:
            0
            8px
            12px
            !important;
    }


    .mcc-history-ref-teams {
        gap:
            6px
            !important;
    }


    .mcc-history-ref-select {
        height:
            38px
            !important;
    }


    .mcc-history-ref-select select {
        height:
            36px
            !important;

        padding-left:
            31px
            !important;

        padding-right:
            31px
            !important;

        font-size:
            11px
            !important;
    }


    .mcc-history-ref-select-logo {
        left:
            5px
            !important;

        width:
            20px
            !important;

        height:
            20px
            !important;
    }


    .mcc-history-ref-chevron {
        top:
            5px
            !important;

        right:
            4px
            !important;

        width:
            27px
            !important;

        height:
            27px
            !important;
    }


    .mcc-history-ref-team {
        grid-template-rows:
            38px
            68px
            !important;
    }


    .mcc-history-ref-result-card {
        height:
            68px
            !important;
    }


    .mcc-history-ref-add {
        width:
            36px
            !important;

        min-width:
            36px
            !important;

        max-width:
            36px
            !important;

        height:
            36px
            !important;

        min-height:
            36px
            !important;

        max-height:
            36px
            !important;
    }


    .mcc-history-ref-remove {
        width:
            26px
            !important;

        min-width:
            26px
            !important;

        max-width:
            26px
            !important;

        height:
            36px
            !important;
    }


    /*
     * 4 teams may be tight on phone.
     * Still stay one row, horizontal scroll if necessary.
     */

    .mcc-history-ref-compare[data-active-slots="4"]
    .mcc-history-ref-teams {
        min-width:
            570px
            !important;
    }


    .mcc-history-ref-compare[data-active-slots="4"] {
        overflow-x:
            auto
            !important;
    }
}



/* =========================================================
   HISTORY FINAL CONTROL STATE
   ========================================================= */

.mcc-history-ref-remove {
    transition:
        opacity .15s ease
        !important;
}

.mcc-history-ref-remove.is-disabled {
    opacity: .42 !important;
    cursor: default !important;
}


/*
 * Ensure hidden 3rd / 4th team columns really disappear.
 */

.mcc-history-ref-team.is-hidden {
    display: none !important;
}


/*
 * The action area stays beside team columns.
 */

.mcc-history-ref-compare[data-active-slots="2"],
.mcc-history-ref-compare[data-active-slots="3"] {
    --history-action-width: 82px !important;
}

.mcc-history-ref-compare[data-active-slots="4"] {
    --history-action-width: 34px !important;
}



/* =========================================================
   HISTORY — 2 / 3 / 4 TEAM FINAL GRID
   ========================================================= */

.mcc-cls-history-v3 {
    --history-action-width: 76px;
}


/*
 * Selector + action row
 */

.mcc-cls-history-v3
.mcc-history-ref-compare {
    display: grid !important;
    grid-template-columns:
        minmax(0, 1fr)
        var(--history-action-width)
        !important;
    gap: 10px !important;
    align-items: center !important;
    width: 100% !important;
}


.mcc-cls-history-v3
.mcc-history-ref-teams {
    display: grid !important;
    gap: 10px !important;
    min-width: 0 !important;
    width: 100% !important;
}


/* 2 teams */

.mcc-cls-history-v3[data-history-slots="2"]
.mcc-history-ref-teams {
    grid-template-columns:
        repeat(2, minmax(0, 1fr))
        !important;
}


/* 3 teams */

.mcc-cls-history-v3[data-history-slots="3"]
.mcc-history-ref-teams {
    grid-template-columns:
        repeat(3, minmax(0, 1fr))
        !important;
}


/* 4 teams */

.mcc-cls-history-v3[data-history-slots="4"]
.mcc-history-ref-teams {
    grid-template-columns:
        repeat(4, minmax(0, 1fr))
        !important;
}


/*
 * Team selector itself
 */

.mcc-cls-history-v3
.mcc-history-ref-team {
    display: block !important;
    min-width: 0 !important;
    width: 100% !important;
}


.mcc-cls-history-v3
.mcc-history-ref-team[hidden],
.mcc-cls-history-v3
.mcc-history-ref-team.is-hidden {
    display: none !important;
}


.mcc-cls-history-v3
.mcc-history-ref-select {
    width: 100% !important;
    min-width: 0 !important;
}


/*
 * X / + area
 */

.mcc-cls-history-v3
.mcc-cls-history-v3-actions,
.mcc-cls-history-v3
.mcc-history-ref-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 8px !important;
    width: var(--history-action-width) !important;
    min-width: var(--history-action-width) !important;
}


.mcc-cls-history-v3
[data-history-add][hidden] {
    display: none !important;
}


/*
 * Result cards:
 * MUST line up exactly under selectors.
 *
 * Reserve the same action-column width.
 */

.mcc-cls-history-v3
.mcc-cls-history-v3-cards {
    display: grid !important;
    gap: 10px !important;
    width:
        calc(
            100% - var(--history-action-width) - 10px
        )
        !important;
}


/* 2 result cards */

.mcc-cls-history-v3[data-history-slots="2"]
.mcc-cls-history-v3-cards {
    grid-template-columns:
        repeat(2, minmax(0, 1fr))
        !important;
}


/* 3 result cards */

.mcc-cls-history-v3[data-history-slots="3"]
.mcc-cls-history-v3-cards {
    grid-template-columns:
        repeat(3, minmax(0, 1fr))
        !important;
}


/* 4 result cards */

.mcc-cls-history-v3[data-history-slots="4"]
.mcc-cls-history-v3-cards {
    grid-template-columns:
        repeat(4, minmax(0, 1fr))
        !important;
}


.mcc-cls-history-v3
[data-history-card][hidden],
.mcc-cls-history-v3
[data-history-card].is-hidden {
    display: none !important;
}


/*
 * At 4 teams only X remains.
 * Still reserve action column so selectors/results stay aligned.
 */

.mcc-cls-history-v3[data-history-slots="4"]
[data-history-add] {
    display: none !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 760px) {

    .mcc-cls-history-v3 {
        --history-action-width: 68px;
    }

    .mcc-cls-history-v3
    .mcc-history-ref-teams,

    .mcc-cls-history-v3
    .mcc-cls-history-v3-cards {
        gap: 7px !important;
    }

    .mcc-cls-history-v3
    .mcc-history-ref-compare {
        gap: 7px !important;
    }

}



/* =========================================================
   CLASSIFICATION V2 — REAL REDESIGN
   SofaScore × FotMob
   ========================================================= */


/* Card becomes flatter / cleaner */

.mcc-cls-standing{
    border:
        1px solid #e8ebee !important;

    border-radius:
        14px !important;

    background:
        #fff !important;

    box-shadow:
        0 1px 2px
        rgba(15,23,42,.025) !important;
}


/* =========================================================
   REMOVE OLD TOP "TABELA" BAR
   ========================================================= */

.mcc-cls-standing
.mcc-cls-head{
    position:absolute !important;

    width:auto !important;
    height:auto !important;
    min-height:0 !important;

    top:18px !important;
    right:18px !important;

    padding:0 !important;

    border:0 !important;

    background:
        transparent !important;

    z-index:3 !important;
}


.mcc-cls-standing
.mcc-cls-head > div{
    display:none !important;
}


.mcc-cls-standing
.mcc-cls-season{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;

    height:30px !important;

    padding:
        0 10px !important;

    border:
        1px solid #e2e5e8 !important;

    border-radius:
        8px !important;

    background:
        #f8f9fa !important;

    color:
        #727a80 !important;

    font-size:
        10px !important;

    font-weight:
        700 !important;
}


/* =========================================================
   MODES
   ========================================================= */

.mcc-cls-standing
.mcc-cls-modes{
    min-height:
        66px !important;

    padding:
        16px 120px
        16px 18px !important;

    gap:
        8px !important;

    border-bottom:
        1px solid #eef0f2 !important;

    background:
        #fff !important;
}


/* Reference image = dark selected pill */

.mcc-cls-standing
.mcc-cls-modes a{
    min-width:
        auto !important;

    height:
        34px !important;

    padding:
        0 19px !important;

    border:
        1px solid #e3e6e9 !important;

    border-radius:
        999px !important;

    background:
        #fff !important;

    color:
        #171a1c !important;

    font-size:
        11px !important;

    font-weight:
        700 !important;
}


.mcc-cls-standing
.mcc-cls-modes a.is-active{
    border-color:
        #1e2022 !important;

    background:
        #1e2022 !important;

    color:
        #fff !important;
}


/* AJAX loading */

.mcc-cls-standing.is-mode-loading
.mcc-table-scroll{
    opacity:.38 !important;

    pointer-events:none !important;

    transition:
        opacity .12s ease !important;
}


/* =========================================================
   TABLE — MAJOR VISUAL CHANGE
   ========================================================= */

.mcc-cls-standing
.mcc-standing-fotmob{
    width:100% !important;

    border-collapse:
        separate !important;

    border-spacing:
        0 !important;

    background:#fff !important;
}


/* Header much lighter */

.mcc-cls-standing
.mcc-standing-fotmob thead th{
    height:
        40px !important;

    border:0 !important;

    background:
        #fff !important;

    color:
        #868d92 !important;

    font-size:
        10px !important;

    font-weight:
        500 !important;

    text-transform:
        none !important;
}


/* Rows = open layout, no traditional grid */

.mcc-cls-standing
.mcc-standing-fotmob tbody td{
    height:
        43px !important;

    border:
        0 !important;

    background:
        transparent !important;

    font-size:
        11px !important;
}


/*
 * Absolutely remove the old horizontal
 * spreadsheet appearance.
 */

.mcc-cls-standing
.mcc-standing-fotmob tbody tr td{
    border-bottom:
        0 !important;
}


/* Sofascore-style hover */

.mcc-cls-standing
.mcc-standing-fotmob tbody tr{
    border-radius:
        8px !important;
}


.mcc-cls-standing
.mcc-standing-fotmob tbody tr:hover{
    background:
        #f3f4f5 !important;
}


/*
 * Every row gets breathing room visually.
 */

.mcc-cls-standing
.mcc-standing-fotmob tbody tr:hover td{
    background:
        transparent !important;
}


/* =========================================================
   NO STICKY AT ALL
   ========================================================= */

.mcc-cls-standing
.mcc-standing-fotmob
.mcc-col-pos,

.mcc-cls-standing
.mcc-standing-fotmob
.mcc-col-team{
    position:
        static !important;

    inset:
        auto !important;

    z-index:
        auto !important;

    box-shadow:
        none !important;

    background:
        transparent !important;
}


/* =========================================================
   POSITION
   ========================================================= */

.mcc-cls-standing
.mcc-standing-fotmob
.mcc-col-pos{
    width:
        42px !important;

    padding-left:
        15px !important;

    color:
        #15191c !important;

    font-weight:
        700 !important;
}


/* =========================================================
   QUALIFICATION SIDE MARK
   Much closer to reference image
   ========================================================= */

.mcc-cls-standing
.mcc-standing-fotmob
tbody tr.is-ucl
.mcc-col-pos{
    border-left:
        2px solid
        #0fc878 !important;
}


.mcc-cls-standing
.mcc-standing-fotmob
tbody tr.is-europa
.mcc-col-pos{
    border-left:
        2px solid
        #1779e8 !important;
}


.mcc-cls-standing
.mcc-standing-fotmob
tbody tr.is-relegation
.mcc-col-pos{
    border-left:
        2px solid
        #ef3e49 !important;
}


/* =========================================================
   TEAM — biggest visual difference
   ========================================================= */

.mcc-cls-standing
.mcc-standing-fotmob
.mcc-col-team{
    width:
        250px !important;

    padding:
        0 14px 0 7px !important;
}


.mcc-cls-standing
.mcc-standing-fotmob
.mcc-table-team{
    gap:
        10px !important;
}


.mcc-cls-standing
.mcc-standing-fotmob
.mcc-table-team img{
    width:
        24px !important;

    height:
        24px !important;

    flex:
        0 0 24px !important;
}


.mcc-cls-standing
.mcc-standing-fotmob
.mcc-table-team span{
    color:
        #111517 !important;

    font-size:
        12px !important;

    font-weight:
        600 !important;
}


/* =========================================================
   NUMBERS
   ========================================================= */

.mcc-cls-standing
.mcc-standing-fotmob tbody td:not(.mcc-col-team){
    color:
        #14181b !important;

    font-weight:
        600 !important;
}


.mcc-cls-standing
.mcc-standing-fotmob
.mcc-points{
    font-weight:
        600 !important;
}


/* =========================================================
   FORM — reference colors
   ========================================================= */

.mcc-cls-standing
.mcc-fotmob-form{
    gap:
        3px !important;
}


.mcc-cls-standing
.mcc-form-result{
    width:
        22px !important;

    height:
        22px !important;

    flex:
        0 0 22px !important;

    border-radius:
        6px !important;

    color:
        #fff !important;

    font-size:
        9px !important;

    font-weight:
        800 !important;
}


/* Vitória */

.mcc-cls-standing
.mcc-form-result.is-win{
    background:
        #00A878 !important;
}


/* Empate */

.mcc-cls-standing
.mcc-form-result.is-draw{
    background:
        #A1A9AE !important;
}


/* Derrota */

.mcc-cls-standing
.mcc-form-result.is-loss{
    background:
        #EF3E49 !important;
}


/* =========================================================
   NEXT
   ========================================================= */

.mcc-cls-standing
.mcc-next-opponent{
    border:0 !important;

    background:
        transparent !important;
}


.mcc-cls-standing
.mcc-next-opponent img{
    width:
        21px !important;

    height:
        21px !important;
}


/* =========================================================
   DESKTOP
   ========================================================= */

@media(min-width:1101px){

    .mcc-cls-standing
    .mcc-standing-fotmob{
        min-width:
            0 !important;
    }


    .mcc-cls-standing
    .mcc-table-scroll{
        overflow-x:
            hidden !important;
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:760px){

    .mcc-cls-standing
    .mcc-cls-head{
        top:
            14px !important;

        right:
            12px !important;
    }


    .mcc-cls-standing
    .mcc-cls-modes{
        padding:
            12px 100px
            12px 12px !important;
    }


    .mcc-cls-standing
    .mcc-standing-fotmob{
        min-width:
            680px !important;
    }


    .mcc-cls-standing
    .mcc-standing-fotmob
    .mcc-col-pos,

    .mcc-cls-standing
    .mcc-standing-fotmob
    .mcc-col-team{
        position:
            static !important;

        left:
            auto !important;

        box-shadow:
            none !important;
    }
}



/* ==========================================================
   MCC CLASSIFICATION V4
   Clean standings + real promotion zones
   ========================================================== */

.mcc-cls-standing{
    overflow:hidden;
    background:#fff;
    border:1px solid #edf0f3;
    border-radius:16px;
    box-shadow:none;
}


/* Header */

.mcc-cls-standing .mcc-cls-head{
    padding:20px 22px 14px;
    border-bottom:0;
}

.mcc-cls-standing .mcc-cls-head > div > span{
    display:none;
}

.mcc-cls-standing .mcc-cls-head h1{
    margin:0;
    color:#15171a;
    font-size:18px;
    font-weight:600;
    letter-spacing:-.02em;
}

.mcc-cls-standing .mcc-cls-season{
    padding:6px 10px;
    background:#f4f5f7;
    border:0;
    border-radius:8px;
    color:#70757d;
    font-size:11px;
    font-weight:700;
}


/* Todos / Casa / Fora */

.mcc-cls-standing .mcc-cls-modes{
    display:flex;
    width:max-content;
    gap:4px;
    margin:0 22px 18px;
    padding:4px;
    background:#f3f4f6;
    border:0;
    border-radius:10px;
}

.mcc-cls-standing .mcc-cls-modes a{
    min-width:68px;
    padding:8px 15px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:0!important;
    border-radius:8px;
    background:transparent;
    color:#737982;
    font-size:12px;
    font-weight:750;
    line-height:1;
    text-decoration:none!important;
    transition:
        background .16s ease,
        color .16s ease,
        box-shadow .16s ease;
}

.mcc-cls-standing .mcc-cls-modes a:hover{
    color:#191b1f;
}

.mcc-cls-standing .mcc-cls-modes a.is-active{
    background:#17191d!important;
    color:#fff!important;
    box-shadow:0 2px 5px rgba(0,0,0,.12);
}


/* AJAX loading */

.mcc-cls-standing .mcc-table-scroll{
    width:100%;
    overflow-x:auto;
    overflow-y:visible;
    transition:
        opacity .16s ease,
        transform .16s ease;
}

.mcc-cls-standing.is-mode-loading .mcc-table-scroll{
    opacity:.42;
    transform:translateY(2px);
    pointer-events:none;
}


/* Table */

.mcc-cls-standing .mcc-standing-fotmob{
    width:100%!important;
    min-width:680px!important;
    margin:0!important;
    border:0!important;
    border-collapse:collapse!important;
    border-spacing:0!important;
    table-layout:auto!important;
    background:#fff!important;
}


/* Table header */

.mcc-cls-standing
.mcc-standing-fotmob
thead th{
    height:36px!important;
    padding-top:0!important;
    padding-bottom:0!important;
    background:#fafbfc!important;
    border:0!important;
    border-bottom:1px solid #eef0f2!important;
    color:#969ba3!important;
    font-size:10px!important;
    font-weight:750!important;
    letter-spacing:.035em!important;
    vertical-align:middle!important;
}


/* Normal rows */

.mcc-cls-standing
.mcc-standing-fotmob
tbody tr:not(.mcc-promotion-heading){
    height:48px;
}

.mcc-cls-standing
.mcc-standing-fotmob
tbody tr:not(.mcc-promotion-heading) td{
    height:48px!important;
    padding-top:0!important;
    padding-bottom:0!important;
    background:#fff!important;
    border:0!important;
    border-bottom:1px solid #f0f1f3!important;
    color:#35393f;
    font-size:12px;
    font-weight:600;
    vertical-align:middle!important;
}

.mcc-cls-standing
.mcc-standing-fotmob
tbody tr:not(.mcc-promotion-heading):hover td{
    background:#fafbfc!important;
}


/* Team column must never be sticky */

.mcc-cls-standing
.mcc-standing-fotmob
.mcc-col-team{
    position:static!important;
    left:auto!important;
    z-index:auto!important;
    background:inherit!important;
    box-shadow:none!important;
}


/* Position */

.mcc-cls-standing
.mcc-standing-fotmob
.mcc-col-pos{
    position:relative!important;
    width:42px!important;
    min-width:42px!important;
    padding-left:15px!important;
    padding-right:5px!important;
    text-align:center;
}

.mcc-cls-standing
.mcc-standing-fotmob
.mcc-position{
    width:auto!important;
    height:auto!important;
    display:inline!important;
    padding:0!important;
    background:transparent!important;
    border:0!important;
    border-radius:0!important;
    color:#60656d!important;
    font-size:12px!important;
    font-weight:750!important;
}


/* Team */

.mcc-cls-standing
.mcc-standing-fotmob
.mcc-col-team{
    width:auto!important;
    min-width:180px!important;
    padding-left:7px!important;
    padding-right:12px!important;
}

.mcc-cls-standing
.mcc-standing-fotmob
.mcc-table-team{
    display:flex!important;
    align-items:center!important;
    gap:9px!important;
}

.mcc-cls-standing
.mcc-standing-fotmob
.mcc-table-team img{
    width:25px!important;
    height:25px!important;
    flex:0 0 25px!important;
    object-fit:contain;
}

.mcc-cls-standing
.mcc-standing-fotmob
.mcc-table-team span{
    max-width:180px!important;
    overflow:hidden;
    color:#24272c!important;
    font-size:12px!important;
    font-weight:700!important;
    text-overflow:ellipsis;
    white-space:nowrap;
}


/* Points */

.mcc-cls-standing
.mcc-standing-fotmob
.mcc-points{
    color:#15171a!important;
    font-weight:650!important;
}


/* Promotion heading */

.mcc-cls-standing
.mcc-standing-fotmob
.mcc-promotion-heading{
    height:35px!important;
}

.mcc-cls-standing
.mcc-standing-fotmob
.mcc-promotion-heading td{
    height:35px!important;
    padding:10px 14px 5px!important;
    background:#fff!important;
    border:0!important;
}

.mcc-promotion-heading-inner{
    display:flex;
    align-items:center;
    gap:7px;
    color:#6e747c;
    font-size:10px;
    font-weight:600;
    line-height:1.2;
    letter-spacing:.025em;
}

.mcc-promotion-heading-mark{
    width:8px;
    height:8px;
    display:block;
    flex:0 0 8px;
    border-radius:3px;
    background:var(--mcc-zone-color,#777);
}


/* Promotion bracket */

.mcc-cls-standing
.mcc-standing-fotmob
tr.has-promotion-zone
td.mcc-col-pos::before{
    content:"";
    position:absolute;
    left:7px;
    top:0;
    bottom:0;
    width:2px;
    background:var(--mcc-zone-color,#777);
}

.mcc-cls-standing
.mcc-standing-fotmob
tr.has-promotion-zone
td.mcc-col-pos::after{
    content:"";
    position:absolute;
    left:7px;
    top:50%;
    width:7px;
    height:2px;
    background:var(--mcc-zone-color,#777);
    transform:translateY(-50%);
}

.mcc-cls-standing
.mcc-standing-fotmob
tr.is-zone-start
td.mcc-col-pos::before{
    top:50%;
}

.mcc-cls-standing
.mcc-standing-fotmob
tr.is-zone-end
td.mcc-col-pos::before{
    bottom:50%;
}

.mcc-cls-standing
.mcc-standing-fotmob
tr.is-zone-start.is-zone-end
td.mcc-col-pos::before{
    top:50%;
    bottom:auto;
    height:2px;
}


/* Form */

.mcc-cls-standing
.mcc-standing-fotmob
.mcc-col-form{
    min-width:96px!important;
    width:96px!important;
    padding-left:8px!important;
    padding-right:8px!important;
    text-align:center!important;
}

.mcc-cls-standing
.mcc-fotmob-form{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:4px!important;
    width:auto!important;
}

.mcc-cls-standing
.mcc-form-result{
    width:22px!important;
    height:22px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    flex:0 0 22px!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:6px!important;
    color:#fff!important;
    font-size:11px!important;
    font-weight:450!important;
    line-height:22px!important;
}

.mcc-cls-standing
.mcc-form-result.is-win{
    background:#00985F!important;
}

.mcc-cls-standing
.mcc-form-result.is-draw{
    background:#8D9499!important;
}

.mcc-cls-standing
.mcc-form-result.is-loss{
    background:#DD3636!important;
}


/* Next */

.mcc-cls-standing
.mcc-standing-fotmob
.mcc-col-next{
    width:52px!important;
    min-width:52px!important;
    text-align:center!important;
}


/* Mobile */

@media (max-width:767px){

    .mcc-cls-standing{
        border-radius:13px;
    }

    .mcc-cls-standing .mcc-cls-head{
        padding:17px 15px 12px;
    }

    .mcc-cls-standing .mcc-cls-modes{
        margin:0 15px 14px;
    }

    .mcc-cls-standing .mcc-cls-modes a{
        min-width:62px;
        padding:8px 12px;
    }

    .mcc-cls-standing .mcc-standing-fotmob{
        min-width:650px!important;
    }

    .mcc-cls-standing
    .mcc-standing-fotmob
    .mcc-col-team{
        min-width:150px!important;
    }

    .mcc-cls-standing
    .mcc-standing-fotmob
    .mcc-table-team span{
        max-width:120px!important;
    }
}


/* =========================================================
   MOBILE OVERVIEW STANDING — SINGLE FINAL
   ========================================================= */

@media only screen and (max-width:767px){

    /*
     * ONLY the overview table.
     * Do not affect the full standing below.
     */
    .mcc-standing-panel
    > .mcc-table-scroll{
        width:100%!important;
        min-width:0!important;
        max-width:100%!important;

        overflow:hidden!important;
    }


    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob{
        display:block!important;

        width:100%!important;
        min-width:0!important;
        max-width:100%!important;

        table-layout:auto!important;
    }


    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > thead,

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > tbody{
        display:block!important;

        width:100%!important;
        min-width:0!important;
    }


    /*
     * =====================================================
     * GRID STRUCTURE
     *
     * # | TEAM | J | SG | PTS
     * =====================================================
     */

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > thead
    > tr,

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > tbody
    > tr:not(.mcc-promotion-heading){

        display:grid!important;

        grid-template-columns:
            34px
            minmax(0,1fr)
            32px
            38px
            40px!important;

        width:100%!important;

        /*
         * THIS is the important part.
         *
         * Grid cells stretch to row height.
         * Their flex content is centered inside.
         */
        align-items:stretch!important;
    }


    /*
     * Header height
     */
    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > thead
    > tr{
        height:38px!important;
        min-height:38px!important;
    }


    /*
     * Match/team row height
     */
    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > tbody
    > tr:not(.mcc-promotion-heading){

        height:50px!important;
        min-height:50px!important;
    }


    /*
     * =====================================================
     * HIDE DESKTOP COLUMNS
     *
     * 4 V
     * 5 E
     * 6 D
     * 7 G
     * 10 FORMA
     * 11 PRÓX
     * =====================================================
     */

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > thead
    > tr
    > :nth-child(4),

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > tbody
    > tr:not(.mcc-promotion-heading)
    > :nth-child(4),

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > thead
    > tr
    > :nth-child(5),

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > tbody
    > tr:not(.mcc-promotion-heading)
    > :nth-child(5),

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > thead
    > tr
    > :nth-child(6),

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > tbody
    > tr:not(.mcc-promotion-heading)
    > :nth-child(6),

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > thead
    > tr
    > :nth-child(7),

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > tbody
    > tr:not(.mcc-promotion-heading)
    > :nth-child(7),

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > thead
    > tr
    > :nth-child(10),

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > tbody
    > tr:not(.mcc-promotion-heading)
    > :nth-child(10),

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > thead
    > tr
    > :nth-child(11),

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > tbody
    > tr:not(.mcc-promotion-heading)
    > :nth-child(11){

        display:none!important;
    }


    /*
     * =====================================================
     * ALL FIVE VISIBLE CELLS
     *
     * Same structure.
     * Same vertical centering.
     * No top / transform hacks.
     * =====================================================
     */

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > thead
    > tr
    > :nth-child(1),

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > thead
    > tr
    > :nth-child(2),

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > thead
    > tr
    > :nth-child(3),

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > thead
    > tr
    > :nth-child(8),

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > thead
    > tr
    > :nth-child(9),

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > tbody
    > tr:not(.mcc-promotion-heading)
    > :nth-child(1),

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > tbody
    > tr:not(.mcc-promotion-heading)
    > :nth-child(2),

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > tbody
    > tr:not(.mcc-promotion-heading)
    > :nth-child(3),

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > tbody
    > tr:not(.mcc-promotion-heading)
    > :nth-child(8),

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > tbody
    > tr:not(.mcc-promotion-heading)
    > :nth-child(9){

        display:flex!important;

        /*
         * ACTUAL VERTICAL CENTER
         */
        align-items:center!important;

        min-width:0!important;
        width:auto!important;
        max-width:none!important;

        height:auto!important;
        min-height:0!important;

        margin:0!important;

        padding-top:0!important;
        padding-bottom:0!important;

        position:static!important;
        inset:auto!important;

        transform:none!important;

        box-sizing:border-box!important;
    }


    /*
     * # POSITION
     */
    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > :is(thead,tbody)
    > tr:not(.mcc-promotion-heading)
    > :nth-child(1){

        grid-column:1!important;

        justify-content:center!important;

        padding-left:4px!important;
        padding-right:4px!important;
    }


    /*
     * TEAM
     */
    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > :is(thead,tbody)
    > tr:not(.mcc-promotion-heading)
    > :nth-child(2){

        grid-column:2!important;

        justify-content:flex-start!important;

        padding-left:5px!important;
        padding-right:5px!important;
    }


    /*
     * J
     */
    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > :is(thead,tbody)
    > tr:not(.mcc-promotion-heading)
    > :nth-child(3){

        grid-column:3!important;

        justify-content:center!important;

        padding-left:2px!important;
        padding-right:2px!important;
    }


    /*
     * SG
     */
    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > :is(thead,tbody)
    > tr:not(.mcc-promotion-heading)
    > :nth-child(8){

        grid-column:4!important;

        justify-content:center!important;

        padding-left:2px!important;
        padding-right:2px!important;
    }


    /*
     * PTS
     */
    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > :is(thead,tbody)
    > tr:not(.mcc-promotion-heading)
    > :nth-child(9){

        grid-column:5!important;

        justify-content:center!important;

        padding-left:2px!important;
        padding-right:5px!important;
    }


    /*
     * Team wrapper does NOT control row height.
     */
    .mcc-standing-panel
    > .mcc-table-scroll
    .mcc-table-team{

        display:flex!important;

        width:100%!important;
        min-width:0!important;

        height:auto!important;

        align-items:center!important;
        justify-content:flex-start!important;

        gap:8px!important;

        margin:0!important;
    }


    .mcc-standing-panel
    > .mcc-table-scroll
    .mcc-table-team img{

        width:23px!important;
        height:23px!important;

        flex:0 0 23px!important;

        object-fit:contain!important;
    }


    .mcc-standing-panel
    > .mcc-table-scroll
    .mcc-table-team span{

        min-width:0!important;

        overflow:hidden!important;

        text-overflow:ellipsis!important;
        white-space:nowrap!important;
    }


    /*
     * Promotion rows:
     * Liga dos Campeões / Liga Europa
     */
    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > tbody
    > tr.mcc-promotion-heading{

        display:block!important;

        width:100%!important;
    }


    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > tbody
    > tr.mcc-promotion-heading
    > td{

        display:block!important;

        width:100%!important;
        min-width:0!important;
        max-width:100%!important;
    }

}



/* =========================================================
   MOBILE STANDING — HEADER + ZONE ALIGNMENT
   ========================================================= */

@media only screen and (max-width:767px){

    /* =====================================================
       HEADER
       # | TIME | J | GD | PTS
       ===================================================== */

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > thead
    > tr{
        height:38px!important;
        min-height:38px!important;

        align-items:stretch!important;
    }


    /*
     * Every visible TH uses exactly the same centering.
     * Remove old native-table visual leftovers.
     */
    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > thead
    > tr
    > th:nth-child(1),

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > thead
    > tr
    > th:nth-child(2),

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > thead
    > tr
    > th:nth-child(3),

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > thead
    > tr
    > th:nth-child(8),

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > thead
    > tr
    > th:nth-child(9){

        height:38px!important;
        min-height:38px!important;

        display:flex!important;
        align-items:center!important;

        padding-top:0!important;
        padding-bottom:0!important;

        margin:0!important;

        border-left:0!important;
        border-right:0!important;

        line-height:1!important;

        position:static!important;
        top:auto!important;
        transform:none!important;
    }


    /* # */
    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > thead
    > tr
    > th:nth-child(1){

        justify-content:center!important;
    }


    /* TIME */
    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > thead
    > tr
    > th:nth-child(2){

        justify-content:flex-start!important;
    }


    /* J / GD / PTS */
    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > thead
    > tr
    > th:nth-child(3),

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > thead
    > tr
    > th:nth-child(8),

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > thead
    > tr
    > th:nth-child(9){

        justify-content:center!important;
        text-align:center!important;
    }


    /*
     * GD pseudo text
     */
    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > thead
    > tr
    > th:nth-child(8)::after{

        display:block!important;

        margin:0!important;
        padding:0!important;

        line-height:1!important;
    }


    /* =====================================================
       PROMOTION HEADING
       Liga dos Campeões / Liga Europa
       ===================================================== */

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > tbody
    > tr.mcc-promotion-heading{

        display:block!important;

        height:48px!important;
        min-height:48px!important;

        width:100%!important;
    }


    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > tbody
    > tr.mcc-promotion-heading
    > td{

        display:flex!important;

        width:100%!important;
        height:48px!important;
        min-height:48px!important;

        align-items:center!important;

        margin:0!important;
        padding:0!important;

        border-bottom:1px solid #edf0f2!important;
    }


    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    .mcc-promotion-heading-inner{

        width:100%!important;
        height:48px!important;

        display:flex!important;
        align-items:center!important;

        margin:0!important;

        padding:
            0
            0!important;

        line-height:1!important;
    }

}


/* =========================================================
   MOBILE STANDING — COMPACT HEADER COLUMNS
   ========================================================= */

@media only screen and (max-width:767px){

    /*
     * # | TIME | J | GD | PTS
     *
     * Make right-side columns compact and connected.
     */
    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > thead
    > tr,

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > tbody
    > tr:not(.mcc-promotion-heading){

        grid-template-columns:
            34px
            minmax(0,1fr)
            24px
            30px
            32px!important;

        column-gap:0!important;
    }


    /*
     * Remove unnecessary horizontal padding
     * from J / GD / PTS.
     */
    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > :is(thead,tbody)
    > tr:not(.mcc-promotion-heading)
    > :nth-child(3),

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > :is(thead,tbody)
    > tr:not(.mcc-promotion-heading)
    > :nth-child(8),

    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > :is(thead,tbody)
    > tr:not(.mcc-promotion-heading)
    > :nth-child(9){

        padding-left:0!important;
        padding-right:0!important;

        justify-content:center!important;
    }


    /*
     * No box-like separators around header cells.
     */
    .mcc-standing-panel
    > .mcc-table-scroll
    > .mcc-standing-fotmob
    > thead
    > tr
    > th{

        border-left:0!important;
        border-right:0!important;
        box-shadow:none!important;
    }

}


/* =========================================================
   SEASON SELECT — NATIVE OPTION FIX
   ========================================================= */

.mcc-season-select select{
    color:#fff!important;
}

/*
 * Native dropdown popup is white in Chrome/Android/desktop,
 * therefore options must use dark text.
 */
.mcc-season-select select option{
    color:#111417!important;
    background:#fff!important;

    font-family:
        "Rajdhani",
        "Arial Narrow",
        Arial,
        sans-serif!important;

    font-size:12px!important;
    font-weight:600!important;
}

/* Current selected option inside popup */
.mcc-season-select select option:checked{
    color:#111417!important;
    background:#eef2f3!important;
}


/* =========================================================
   LEAGUE TABS — FONT FAMILY FIX
   Prevent theme/Flatsome Lato inheritance
   ========================================================= */

.mcc-league-root
.mcc-league-tabs
.mcc-league-tab{
    font-family:
        "Rajdhani",
        "Arial Narrow",
        Arial,
        sans-serif!important;
}


/* =========================================================
   MOBILE — HIDE DUPLICATED SEASON BADGE
   ========================================================= */
@media (max-width:760px){
    .mcc-cls-season{
        display:none!important;
    }
}


/* =========================================================
   MOBILE — HIDE CLASSIFICACAO SEASON BADGE FINAL
   ========================================================= */
@media (max-width:760px){

    .mcc-league-root
    .mcc-cls-standing
    .mcc-cls-season{
        display:none!important;
    }

}

/* MCC_MOBILE_SOFASCORE_STANDING_START */

@media only screen and (max-width:767px){

    /* =====================================================
       CARD
       ===================================================== */

    .mcc-classification-page
    .mcc-cls-standing{
        width:100%!important;
        min-width:0!important;
        max-width:100%!important;

        position:relative!important;

        margin:0!important;

        overflow:visible!important;

        border:
            1px solid
            #e7e9ed!important;

        border-radius:
            14px!important;

        background:
            #fff!important;

        box-shadow:
            none!important;
    }


    /* old classification title / duplicated season */
    .mcc-classification-page
    .mcc-cls-standing
    .mcc-cls-head{
        display:none!important;
    }


    /* =====================================================
       TODOS / CASA / FORA
       ===================================================== */

    .mcc-classification-page
    .mcc-cls-standing
    .mcc-cls-modes{
        width:100%!important;
        max-width:none!important;

        min-height:54px!important;

        margin:0!important;

        padding:
            8px
            56px
            8px
            8px!important;

        display:flex!important;

        align-items:center!important;

        gap:7px!important;

        overflow:visible!important;

        border:0!important;
        border-bottom:
            1px solid
            #e6e9ed!important;

        border-radius:
            14px
            14px
            0
            0!important;

        background:
            #fff!important;
    }


    .mcc-classification-page
    .mcc-cls-standing
    .mcc-cls-modes a{
        width:auto!important;
        min-width:0!important;

        height:34px!important;

        padding:
            0
            14px!important;

        display:flex!important;

        flex:
            0
            0
            auto!important;

        align-items:center!important;
        justify-content:center!important;

        border:0!important;

        border-radius:
            999px!important;

        background:
            #f1f3f6!important;

        color:
            #1c2025!important;

        font-family:
            "Rajdhani",
            "Arial Narrow",
            Arial,
            sans-serif!important;

        font-size:
            12px!important;

        font-weight:
            700!important;

        line-height:
            1!important;

        box-shadow:
            none!important;
    }


    .mcc-classification-page
    .mcc-cls-standing
    .mcc-cls-modes
    a.is-active{
        background:
            #202226!important;

        color:
            #fff!important;
    }


    /* =====================================================
       DISPLAY MENU BUTTON
       ===================================================== */

    .mcc-mobile-standing-actions{
        position:absolute;

        top:8px;
        right:8px;

        z-index:30;
    }


    .mcc-mobile-standing-layout{
        width:38px;
        height:38px;

        margin:0;
        padding:8px;

        display:flex;

        flex-direction:column;

        align-items:stretch;
        justify-content:center;

        gap:4px;

        position:relative;

        border:
            1px solid
            #dde1e6;

        border-radius:
            9px;

        background:
            #f6f7f9;

        box-shadow:
            none;

        cursor:pointer;
    }


    .mcc-mobile-standing-layout span{
        display:block;

        width:100%;
        height:2px;

        border-radius:
            99px;

        background:
            #24282d;
    }


    .mcc-mobile-standing-layout i{
        width:0;
        height:0;

        position:absolute;

        right:5px;
        bottom:5px;

        border-left:
            4px solid transparent;

        border-right:
            4px solid transparent;

        border-top:
            5px solid #24282d;
    }


    /* =====================================================
       MENU
       ===================================================== */

    .mcc-mobile-standing-menu{
        width:180px;

        position:absolute;

        top:46px;
        right:0;

        overflow:hidden;

        border:
            1px solid
            #e5e7ea;

        border-radius:
            9px;

        background:
            #fff;

        box-shadow:
            0 8px 24px
            rgba(15,23,42,.13);

        z-index:999;
    }


    .mcc-mobile-standing-menu[hidden]{
        display:none!important;
    }


    .mcc-mobile-standing-menu-title{
        min-height:42px;

        padding:
            0
            15px;

        display:flex;

        align-items:center;

        border-bottom:
            1px solid
            #ededf0;

        color:
            #979ca3;

        font-size:
            12px;

        font-weight:
            500;
    }


    .mcc-mobile-standing-menu button{
        width:100%;
        height:48px;

        margin:0;
        padding:
            0
            15px;

        display:flex;

        align-items:center;
        justify-content:flex-start;

        border:0;

        background:
            #fff;

        color:
            #26292d;

        font-family:
            "Rajdhani",
            "Arial Narrow",
            Arial,
            sans-serif;

        font-size:
            14px;

        font-weight:
            600;

        text-align:left;

        cursor:pointer;
    }


    .mcc-mobile-standing-menu
    button.is-active{
        background:
            #f2f3f6;

        color:
            #4057ff;
    }


    /* =====================================================
       GRAPH BUTTON
       ===================================================== */

    .mcc-mobile-standing-graph-row{
        min-height:48px;

        padding:
            7px
            8px
            5px;

        display:flex;

        align-items:center;
        justify-content:flex-end;

        background:
            #fff;
    }


    .mcc-mobile-standing-graph{
        height:30px;

        padding:
            0
            12px;

        display:inline-flex;

        align-items:center;
        justify-content:center;

        gap:4px;

        border:0;

        border-radius:
            999px;

        background:
            #4057ff;

        color:
            #fff;

        font-family:
            "Rajdhani",
            Arial,
            sans-serif;

        font-size:
            12px;

        font-weight:
            700;

        cursor:pointer;
    }


    .mcc-mobile-standing-graph span{
        font-size:
            17px;

        line-height:
            1;
    }


    /* =====================================================
       TABLE BASE
       ===================================================== */

    .mcc-classification-page
    .mcc-cls-standing
    .mcc-table-scroll{
        width:100%!important;
        min-width:0!important;
        max-width:100%!important;

        overflow:hidden!important;
    }


    .mcc-classification-page
    .mcc-cls-standing
    .mcc-standing-fotmob{
        display:block!important;

        width:100%!important;
        min-width:0!important;
        max-width:100%!important;

        margin:0!important;

        border:0!important;

        border-collapse:
            separate!important;

        border-spacing:
            0!important;

        table-layout:
            auto!important;

        background:
            #fff!important;
    }


    .mcc-classification-page
    .mcc-cls-standing
    .mcc-standing-fotmob
    thead,

    .mcc-classification-page
    .mcc-cls-standing
    .mcc-standing-fotmob
    tbody{
        display:block!important;

        width:100%!important;
    }


    /* =====================================================
       COMMON ROW
       ===================================================== */

    .mcc-classification-page
    .mcc-cls-standing
    .mcc-standing-fotmob
    tbody
    tr:not(.mcc-promotion-heading){
        min-height:
            42px!important;

        border:
            0!important;

        background:
            #fff!important;
    }


    .mcc-classification-page
    .mcc-cls-standing
    .mcc-standing-fotmob
    td,

    .mcc-classification-page
    .mcc-cls-standing
    .mcc-standing-fotmob
    th{
        box-sizing:
            border-box!important;
    }


    .mcc-classification-page
    .mcc-cls-standing
    .mcc-standing-fotmob
    tbody td{
        border:
            0!important;

        background:
            transparent!important;

        color:
            #15181c!important;

        font-family:
            "Rajdhani",
            "Arial Narrow",
            Arial,
            sans-serif!important;

        font-size:
            12px!important;

        vertical-align:
            middle!important;
    }


    /* =====================================================
       SUMMARY
       # TEAM | P | DIFF | PTS
       ===================================================== */

    .mcc-cls-standing[
        data-mobile-view="summary"
    ]
    .mcc-standing-fotmob
    thead tr,

    .mcc-cls-standing[
        data-mobile-view="summary"
    ]
    .mcc-standing-fotmob
    tbody
    tr:not(.mcc-promotion-heading){
        display:grid!important;

        grid-template-columns:
            30px
            minmax(0,1fr)
            32px
            46px
            38px!important;

        padding:
            0
            9px!important;

        align-items:
            stretch!important;
    }


    /*
     * Hide everything except:
     * 1 #, 2 Team, 3 J, 8 SG, 9 PTS
     */
    .mcc-cls-standing[
        data-mobile-view="summary"
    ]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :nth-child(4),

    .mcc-cls-standing[
        data-mobile-view="summary"
    ]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :nth-child(5),

    .mcc-cls-standing[
        data-mobile-view="summary"
    ]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :nth-child(6),

    .mcc-cls-standing[
        data-mobile-view="summary"
    ]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :nth-child(7),

    .mcc-cls-standing[
        data-mobile-view="summary"
    ]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :nth-child(10),

    .mcc-cls-standing[
        data-mobile-view="summary"
    ]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :nth-child(11){
        display:none!important;
    }


    .mcc-cls-standing[
        data-mobile-view="summary"
    ]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :nth-child(1){
        grid-column:1;
    }

    .mcc-cls-standing[
        data-mobile-view="summary"
    ]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :nth-child(2){
        grid-column:2;
    }

    .mcc-cls-standing[
        data-mobile-view="summary"
    ]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :nth-child(3){
        grid-column:3;
    }

    .mcc-cls-standing[
        data-mobile-view="summary"
    ]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :nth-child(8){
        grid-column:4;
    }

    .mcc-cls-standing[
        data-mobile-view="summary"
    ]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :nth-child(9){
        grid-column:5;
    }


    /* =====================================================
       VISIBLE SUMMARY CELLS
       ===================================================== */

    .mcc-cls-standing[
        data-mobile-view="summary"
    ]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :is(
        :nth-child(1),
        :nth-child(2),
        :nth-child(3),
        :nth-child(8),
        :nth-child(9)
    ){
        display:flex!important;

        width:auto!important;
        min-width:0!important;
        max-width:none!important;

        height:42px!important;

        padding:0!important;

        align-items:center!important;
    }


    .mcc-cls-standing[
        data-mobile-view="summary"
    ]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :is(
        :nth-child(1),
        :nth-child(3),
        :nth-child(8),
        :nth-child(9)
    ){
        justify-content:center!important;
    }


    .mcc-cls-standing[
        data-mobile-view="summary"
    ]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :nth-child(2){
        justify-content:flex-start!important;
    }


    /* Header aliases */

    .mcc-cls-standing[
        data-mobile-view="summary"
    ]
    thead th:nth-child(3){
        font-size:0!important;
    }

    .mcc-cls-standing[
        data-mobile-view="summary"
    ]
    thead th:nth-child(3)::after{
        content:"P";

        font-size:10px;
    }


    .mcc-cls-standing[
        data-mobile-view="summary"
    ]
    thead th:nth-child(8){
        font-size:0!important;
    }

    .mcc-cls-standing[
        data-mobile-view="summary"
    ]
    thead th:nth-child(8)::before{
        content:"DIFF";

        font-size:10px;
    }

    .mcc-cls-standing[
        data-mobile-view="summary"
    ]
    thead th:nth-child(8)::after{
        display:none!important;
    }


    /* =====================================================
       COMPLETE
       # TEAM P V E D G DIFF PTS
       ===================================================== */

    .mcc-cls-standing[
        data-mobile-view="complete"
    ]
    .mcc-table-scroll{
        overflow-x:auto!important;
    }


    .mcc-cls-standing[
        data-mobile-view="complete"
    ]
    .mcc-standing-fotmob{
        display:table!important;

        width:100%!important;
        min-width:520px!important;

        table-layout:
            fixed!important;
    }


    .mcc-cls-standing[
        data-mobile-view="complete"
    ]
    .mcc-standing-fotmob
    thead{
        display:table-header-group!important;
    }


    .mcc-cls-standing[
        data-mobile-view="complete"
    ]
    .mcc-standing-fotmob
    tbody{
        display:table-row-group!important;
    }


    .mcc-cls-standing[
        data-mobile-view="complete"
    ]
    .mcc-standing-fotmob
    tr{
        display:table-row!important;
    }


    .mcc-cls-standing[
        data-mobile-view="complete"
    ]
    .mcc-standing-fotmob
    th,

    .mcc-cls-standing[
        data-mobile-view="complete"
    ]
    .mcc-standing-fotmob
    td{
        display:table-cell!important;

        height:42px!important;

        padding:
            0
            4px!important;

        text-align:center!important;
    }


    .mcc-cls-standing[
        data-mobile-view="complete"
    ]
    .mcc-standing-fotmob
    :is(
        th:nth-child(10),
        td:nth-child(10),
        th:nth-child(11),
        td:nth-child(11)
    ){
        display:none!important;
    }


    .mcc-cls-standing[
        data-mobile-view="complete"
    ]
    .mcc-standing-fotmob
    :is(
        th:nth-child(1),
        td:nth-child(1)
    ){
        width:30px!important;
    }


    .mcc-cls-standing[
        data-mobile-view="complete"
    ]
    .mcc-standing-fotmob
    :is(
        th:nth-child(2),
        td:nth-child(2)
    ){
        width:140px!important;

        text-align:left!important;
    }


    .mcc-cls-standing[
        data-mobile-view="complete"
    ]
    .mcc-standing-fotmob
    :is(
        th:nth-child(3),
        td:nth-child(3),
        th:nth-child(4),
        td:nth-child(4),
        th:nth-child(5),
        td:nth-child(5),
        th:nth-child(6),
        td:nth-child(6)
    ){
        width:34px!important;
    }


    .mcc-cls-standing[
        data-mobile-view="complete"
    ]
    .mcc-standing-fotmob
    :is(
        th:nth-child(7),
        td:nth-child(7),
        th:nth-child(8),
        td:nth-child(8),
        th:nth-child(9),
        td:nth-child(9)
    ){
        width:46px!important;
    }


    /* =====================================================
       FORM
       # TEAM | Últimos 5
       ===================================================== */

    .mcc-cls-standing[
        data-mobile-view="form"
    ]
    .mcc-standing-fotmob
    thead tr,

    .mcc-cls-standing[
        data-mobile-view="form"
    ]
    .mcc-standing-fotmob
    tbody
    tr:not(.mcc-promotion-heading){
        display:grid!important;

        grid-template-columns:
            30px
            minmax(0,1fr)
            145px!important;

        padding:
            0
            9px!important;

        align-items:
            stretch!important;
    }


    .mcc-cls-standing[
        data-mobile-view="form"
    ]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :not(
        :nth-child(1)
    ):not(
        :nth-child(2)
    ):not(
        :nth-child(10)
    ){
        display:none!important;
    }


    .mcc-cls-standing[
        data-mobile-view="form"
    ]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :nth-child(1){
        grid-column:1;
    }


    .mcc-cls-standing[
        data-mobile-view="form"
    ]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :nth-child(2){
        grid-column:2;
    }


    .mcc-cls-standing[
        data-mobile-view="form"
    ]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :nth-child(10){
        grid-column:3;
    }


    .mcc-cls-standing[
        data-mobile-view="form"
    ]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :is(
        :nth-child(1),
        :nth-child(2),
        :nth-child(10)
    ){
        display:flex!important;

        width:auto!important;
        min-width:0!important;
        max-width:none!important;

        height:42px!important;

        padding:0!important;

        align-items:center!important;
    }


    .mcc-cls-standing[
        data-mobile-view="form"
    ]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :nth-child(1){
        justify-content:center!important;
    }


    .mcc-cls-standing[
        data-mobile-view="form"
    ]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :nth-child(2){
        justify-content:flex-start!important;
    }


    .mcc-cls-standing[
        data-mobile-view="form"
    ]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :nth-child(10){
        justify-content:flex-end!important;
    }


    .mcc-cls-standing[
        data-mobile-view="form"
    ]
    thead th:nth-child(10){
        justify-content:flex-end!important;

        color:#9298a0!important;

        font-size:0!important;
    }


    .mcc-cls-standing[
        data-mobile-view="form"
    ]
    thead th:nth-child(10)::after{
        content:"Últimos 5";

        font-size:11px;
    }


    /* =====================================================
       COMMON TEAM
       ===================================================== */

    .mcc-classification-page
    .mcc-cls-standing
    .mcc-table-team{
        display:flex!important;

        width:100%!important;
        min-width:0!important;

        align-items:center!important;

        gap:
            8px!important;
    }


    .mcc-classification-page
    .mcc-cls-standing
    .mcc-table-team img{
        width:23px!important;
        height:23px!important;

        min-width:23px!important;

        flex:
            0
            0
            23px!important;

        object-fit:
            contain!important;
    }


    .mcc-classification-page
    .mcc-cls-standing
    .mcc-table-team span{
        min-width:0!important;

        overflow:hidden!important;

        color:#14171b!important;

        font-size:
            12px!important;

        font-weight:
            600!important;

        white-space:
            nowrap!important;

        text-overflow:
            ellipsis!important;
    }


    .mcc-classification-page
    .mcc-cls-standing
    .mcc-position{
        width:auto!important;
        height:auto!important;

        padding:0!important;

        background:
            transparent!important;

        color:
            #16191d!important;

        font-size:
            12px!important;

        font-weight:
            700!important;
    }


    /* =====================================================
       PROMOTION HEADINGS
       ===================================================== */

    .mcc-classification-page
    .mcc-cls-standing
    .mcc-promotion-heading{
        display:block!important;

        width:100%!important;

        min-height:
            38px!important;

        padding:
            0
            9px!important;

        background:
            #fff!important;
    }


    .mcc-classification-page
    .mcc-cls-standing
    .mcc-promotion-heading
    > td{
        display:flex!important;

        width:100%!important;
        height:38px!important;

        padding:0!important;

        align-items:center!important;

        border:0!important;
    }


    .mcc-classification-page
    .mcc-cls-standing
    .mcc-promotion-heading-inner{
        display:flex!important;

        width:100%!important;
        height:38px!important;

        align-items:center!important;

        gap:
            7px!important;

        color:
            #979da5!important;

        font-size:
            11px!important;

        font-weight:
            500!important;
    }


    /* =====================================================
       EXISTING FORM CHIPS
       ===================================================== */

    .mcc-cls-standing[
        data-mobile-view="form"
    ]
    .mcc-fotmob-form{
        display:flex!important;

        align-items:center!important;

        gap:
            2px!important;

        padding:
            2px
            7px!important;

        border-radius:
            999px!important;

        background:
            #f0f2f5!important;
    }


    .mcc-cls-standing[
        data-mobile-view="form"
    ]
    .mcc-form-result{
        width:20px!important;
        height:18px!important;

        display:flex!important;

        align-items:center!important;
        justify-content:center!important;

        border-radius:
            2px!important;

        color:#fff!important;

        font-size:
            10px!important;

        font-weight:
            700!important;
    }


    /* =====================================================
       HISTORY ORIGINAL POSITION
       Hide it below table on mobile.
       It will appear only inside sheet.
       ===================================================== */

    .mcc-classification-page
    .mcc-cls-history-wide{
        display:none!important;
    }


    .mcc-mobile-history-content
    .mcc-cls-history-wide,

    .mcc-mobile-history-content
    .mcc-cls-history-v3{
        display:block!important;
    }


    /* =====================================================
       BOTTOM SHEET
       ===================================================== */

    html.mcc-history-sheet-open,
    body.mcc-history-sheet-open{
        overflow:hidden!important;
    }


    .mcc-mobile-history-overlay{
        position:fixed;

        inset:0;

        z-index:
            999999;

        pointer-events:none;
    }


    .mcc-mobile-history-overlay[hidden]{
        display:none!important;
    }


    .mcc-mobile-history-overlay.is-open{
        pointer-events:auto;
    }


    .mcc-mobile-history-backdrop{
        position:absolute;

        inset:0;

        background:
            rgba(
                8,
                12,
                18,
                .52
            );

        opacity:0;

        transition:
            opacity
            .18s
            ease;
    }


    .mcc-mobile-history-overlay.is-open
    .mcc-mobile-history-backdrop{
        opacity:1;
    }


    .mcc-mobile-history-sheet{
        width:100%;

        height:
            min(
                67vh,
                620px
            );

        position:absolute;

        left:0;
        right:0;
        bottom:0;

        overflow-y:auto;
        overflow-x:hidden;

        padding:
            25px
            8px
            calc(
                12px
                +
                env(
                    safe-area-inset-bottom
                )
            );

        border-radius:
            17px
            17px
            0
            0;

        background:
            #fff;

        box-shadow:
            0
            -8px
            30px
            rgba(
                0,
                0,
                0,
                .15
            );

        transform:
            translateY(
                102%
            );

        transition:
            transform
            .2s
            cubic-bezier(
                .2,
                .8,
                .2,
                1
            );
    }


    .mcc-mobile-history-overlay.is-open
    .mcc-mobile-history-sheet{
        transform:
            translateY(
                0
            );
    }


    .mcc-mobile-history-handle{
        width:54px;
        height:4px;

        position:absolute;

        top:7px;
        left:50%;

        transform:
            translateX(
                -50%
            );

        border-radius:
            99px;

        background:
            #a5abb4;
    }


    .mcc-mobile-history-close{
        width:38px;
        height:38px;

        position:absolute;

        top:8px;
        right:8px;

        z-index:10;

        margin:0;
        padding:0;

        display:flex;

        align-items:center;
        justify-content:center;

        border:0;

        background:
            transparent;

        color:
            #4057ff;

        font-family:
            Arial,
            sans-serif;

        font-size:
            30px;

        font-weight:
            300;

        line-height:
            1;

        cursor:pointer;
    }


    .mcc-mobile-history-content{
        width:100%;

        margin-top:
            9px;
    }


    /*
     * Existing history card turns into a flat sheet.
     */
    .mcc-mobile-history-content
    .mcc-cls-history-v3{
        width:100%!important;

        margin:0!important;

        border:0!important;

        border-radius:
            0!important;

        box-shadow:
            none!important;

        background:
            #fff!important;

        overflow:
            visible!important;
    }


    .mcc-mobile-history-content
    .mcc-cls-history-v3-head{
        display:none!important;
    }


    .mcc-mobile-history-content
    .mcc-cls-history-v3-chart{
        margin-top:
            18px!important;

        overflow-x:auto!important;
        overflow-y:hidden!important;
    }


    .mcc-mobile-history-about{
        width:100%;
        height:42px;

        margin:
            14px
            0
            0;

        padding:
            0
            10px;

        display:flex;

        align-items:center;
        justify-content:space-between;

        border:0;

        border-radius:
            8px;

        background:
            #eff1f4;

        color:
            #22262b;

        font-family:
            "Rajdhani",
            Arial,
            sans-serif;

        font-size:
            14px;

        text-align:left;

        cursor:pointer;
    }


    .mcc-mobile-history-about strong{
        font-weight:
            700;
    }


    .mcc-mobile-history-about span{
        font-size:
            20px;
    }

}

/* MCC_MOBILE_SOFASCORE_STANDING_END */


/* =========================================================
   MOBILE CLASSIFICATION — POLISH V2
   ========================================================= */

@media only screen and (max-width:767px){

    /* =====================================================
       1. PROMOTION BRACKET
       Move line away from position number
       ===================================================== */

    .mcc-classification-page
    .mcc-cls-standing
    .mcc-standing-fotmob
    tr.has-promotion-zone
    td.mcc-col-pos{
        position:relative!important;
    }


    .mcc-classification-page
    .mcc-cls-standing
    .mcc-standing-fotmob
    tr.has-promotion-zone
    td.mcc-col-pos::before{
        left:1px!important;

        width:2px!important;
    }


    .mcc-classification-page
    .mcc-cls-standing
    .mcc-standing-fotmob
    tr.has-promotion-zone
    td.mcc-col-pos::after{
        left:1px!important;

        width:6px!important;
    }


    /*
     * Give rank number a little more breathing room.
     */
    .mcc-cls-standing[data-mobile-view="summary"]
    .mcc-standing-fotmob
    thead tr,

    .mcc-cls-standing[data-mobile-view="summary"]
    .mcc-standing-fotmob
    tbody
    tr:not(.mcc-promotion-heading){
        grid-template-columns:
            36px
            minmax(0,1fr)
            32px
            46px
            38px!important;
    }


    .mcc-cls-standing[data-mobile-view="form"]
    .mcc-standing-fotmob
    thead tr,

    .mcc-cls-standing[data-mobile-view="form"]
    .mcc-standing-fotmob
    tbody
    tr:not(.mcc-promotion-heading){
        grid-template-columns:
            36px
            minmax(0,1fr)
            142px!important;
    }


    .mcc-classification-page
    .mcc-cls-standing
    .mcc-standing-fotmob
    td.mcc-col-pos{
        padding-left:8px!important;
        padding-right:2px!important;
    }


    /* =====================================================
       2. COMPLETE VIEW
       Sofascore-like:
       # TEAM P W D L DIFF GLS PTS
       ===================================================== */

    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-standing-fotmob{
        min-width:610px!important;
    }


    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-standing-fotmob
    :is(
        th:nth-child(1),
        td:nth-child(1)
    ){
        width:34px!important;
    }


    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-standing-fotmob
    :is(
        th:nth-child(2),
        td:nth-child(2)
    ){
        width:162px!important;
    }


    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-standing-fotmob
    :is(
        th:nth-child(3),
        td:nth-child(3),
        th:nth-child(4),
        td:nth-child(4),
        th:nth-child(5),
        td:nth-child(5),
        th:nth-child(6),
        td:nth-child(6)
    ){
        width:38px!important;
    }


    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-standing-fotmob
    :is(
        th:nth-child(7),
        td:nth-child(7)
    ){
        width:58px!important;
    }


    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-standing-fotmob
    :is(
        th:nth-child(8),
        td:nth-child(8)
    ){
        width:50px!important;
    }


    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-standing-fotmob
    :is(
        th:nth-child(9),
        td:nth-child(9)
    ){
        width:44px!important;
    }


    /*
     * Restore team logo in complete mode.
     */
    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-table-team{
        display:flex!important;

        align-items:center!important;

        gap:7px!important;
    }


    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-table-team img{
        display:block!important;

        width:20px!important;
        height:20px!important;

        min-width:20px!important;

        flex:0 0 20px!important;
    }


    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-table-team span{
        display:block!important;

        min-width:0!important;

        overflow:hidden!important;

        white-space:nowrap!important;

        text-overflow:ellipsis!important;
    }


    /*
     * Portuguese labels.
     *
     * J = jogos
     * V = vitórias
     * E = empates
     * D = derrotas
     */
    .mcc-cls-standing[data-mobile-view="complete"]
    thead th:nth-child(3){
        font-size:0!important;
    }

    .mcc-cls-standing[data-mobile-view="complete"]
    thead th:nth-child(3)::after{
        content:"J";

        font-size:10px;
    }


    .mcc-cls-standing[data-mobile-view="complete"]
    thead th:nth-child(4){
        font-size:0!important;
    }

    .mcc-cls-standing[data-mobile-view="complete"]
    thead th:nth-child(4)::after{
        content:"V";

        font-size:10px;
    }


    .mcc-cls-standing[data-mobile-view="complete"]
    thead th:nth-child(5){
        font-size:0!important;
    }

    .mcc-cls-standing[data-mobile-view="complete"]
    thead th:nth-child(5)::after{
        content:"E";

        font-size:10px;
    }


    .mcc-cls-standing[data-mobile-view="complete"]
    thead th:nth-child(6){
        font-size:0!important;
    }

    .mcc-cls-standing[data-mobile-view="complete"]
    thead th:nth-child(6)::after{
        content:"D";

        font-size:10px;
    }


    .mcc-cls-standing[data-mobile-view="complete"]
    thead th:nth-child(7){
        font-size:0!important;
    }

    .mcc-cls-standing[data-mobile-view="complete"]
    thead th:nth-child(7)::after{
        content:"GOLS";

        font-size:9px;
    }


    .mcc-cls-standing[data-mobile-view="complete"]
    thead th:nth-child(8){
        font-size:0!important;
    }

    .mcc-cls-standing[data-mobile-view="complete"]
    thead th:nth-child(8)::after{
        content:"SG";

        font-size:10px;
    }


    /* =====================================================
       3. FORM VIEW
       Sofascore-like recent form track
       ===================================================== */

    .mcc-cls-standing[data-mobile-view="form"]
    .mcc-fotmob-form{
        width:124px!important;
        height:24px!important;

        min-width:124px!important;

        padding:
            3px
            5px!important;

        display:flex!important;

        align-items:center!important;
        justify-content:flex-start!important;

        gap:3px!important;

        position:relative!important;

        overflow:hidden!important;

        border-radius:
            999px!important;

        background:
            #eef1f5!important;

        box-sizing:
            border-box!important;
    }


    /*
     * Individual W/D/L blocks.
     */
    .mcc-cls-standing[data-mobile-view="form"]
    .mcc-fotmob-form
    .mcc-form-result{
        width:19px!important;
        height:18px!important;

        min-width:19px!important;

        flex:
            0
            0
            19px!important;

        margin:0!important;
        padding:0!important;

        display:flex!important;

        align-items:center!important;
        justify-content:center!important;

        border:0!important;

        border-radius:
            2px!important;

        color:
            #fff!important;

        font-size:
            10px!important;

        font-weight:
            800!important;

        line-height:
            18px!important;

        box-shadow:
            none!important;
    }


    /*
     * Win
     */
    .mcc-cls-standing[data-mobile-view="form"]
    .mcc-form-result.is-win,

    .mcc-cls-standing[data-mobile-view="form"]
    .mcc-form-result.win,

    .mcc-cls-standing[data-mobile-view="form"]
    .mcc-form-result[data-result="W"],

    .mcc-cls-standing[data-mobile-view="form"]
    .mcc-form-result[data-result="V"]{
        background:
            #0eaa70!important;
    }


    /*
     * Draw
     */
    .mcc-cls-standing[data-mobile-view="form"]
    .mcc-form-result.is-draw,

    .mcc-cls-standing[data-mobile-view="form"]
    .mcc-form-result.draw,

    .mcc-cls-standing[data-mobile-view="form"]
    .mcc-form-result[data-result="D"],

    .mcc-cls-standing[data-mobile-view="form"]
    .mcc-form-result[data-result="E"]{
        background:
            #a5abb3!important;
    }


    /*
     * Loss
     */
    .mcc-cls-standing[data-mobile-view="form"]
    .mcc-form-result.is-loss,

    .mcc-cls-standing[data-mobile-view="form"]
    .mcc-form-result.loss,

    .mcc-cls-standing[data-mobile-view="form"]
    .mcc-form-result[data-result="L"]{
        background:
            #e1483f!important;
    }


    /*
     * Form column itself aligned like reference.
     */
    .mcc-cls-standing[data-mobile-view="form"]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :nth-child(10){
        padding-right:3px!important;

        justify-content:flex-end!important;
    }


    .mcc-cls-standing[data-mobile-view="form"]
    thead
    th:nth-child(10)::after{
        content:"Últimos 5"!important;

        color:
            #9399a2!important;

        font-size:
            11px!important;

        font-weight:
            500!important;
    }

}



/* =========================================================
   MOBILE CLASSIFICATION — COMPLETE + FORM FINAL
   ========================================================= */

@media only screen and (max-width:767px){

    /* =====================================================
       COMPLETE
       # TIME J V E D G SG PTS
       ALL FIT INSIDE MOBILE
       ===================================================== */

    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-table-scroll{
        overflow-x:hidden!important;
    }

    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-standing-fotmob{
        display:block!important;

        width:100%!important;
        min-width:0!important;
        max-width:100%!important;

        table-layout:auto!important;
    }

    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-standing-fotmob thead,

    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-standing-fotmob tbody{
        display:block!important;
        width:100%!important;
    }


    /*
     * 1 #      26
     * 2 TIME   flexible
     * 3 J      23
     * 4 V      23
     * 5 E      23
     * 6 D      23
     * 7 G      31
     * 8 SG     31
     * 9 PTS    32
     */
    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-standing-fotmob thead tr,

    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-standing-fotmob tbody
    tr:not(.mcc-promotion-heading){

        display:grid!important;

        grid-template-columns:
            26px
            minmax(0,1fr)
            23px
            23px
            23px
            23px
            31px
            31px
            32px!important;

        width:100%!important;

        padding:
            0
            8px!important;

        column-gap:0!important;

        align-items:stretch!important;
    }


    /*
     * Hide only FORM + NEXT.
     */
    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :nth-child(10),

    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :nth-child(11){

        display:none!important;
    }


    /*
     * Reset all 9 visible cells.
     */
    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :nth-child(-n+9){

        display:flex!important;

        width:auto!important;
        min-width:0!important;
        max-width:none!important;

        height:43px!important;

        margin:0!important;
        padding:0!important;

        align-items:center!important;
        justify-content:center!important;

        border:0!important;

        position:static!important;
        transform:none!important;
    }


    /* # */
    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :nth-child(1){
        grid-column:1!important;
    }

    /* TIME */
    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :nth-child(2){
        grid-column:2!important;

        justify-content:flex-start!important;

        padding-left:3px!important;
    }

    /* J */
    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :nth-child(3){
        grid-column:3!important;
    }

    /* V */
    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :nth-child(4){
        grid-column:4!important;
    }

    /* E */
    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :nth-child(5){
        grid-column:5!important;
    }

    /* D */
    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :nth-child(6){
        grid-column:6!important;
    }

    /* G */
    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :nth-child(7){
        grid-column:7!important;
    }

    /* SG */
    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :nth-child(8){
        grid-column:8!important;
    }

    /* PTS */
    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :nth-child(9){
        grid-column:9!important;

        font-weight:600!important;
    }


    /*
     * Complete header
     */
    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-standing-fotmob thead tr{
        height:38px!important;
        min-height:38px!important;
    }

    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-standing-fotmob thead th{
        height:38px!important;

        color:#969ca4!important;

        font-size:9px!important;
        font-weight:600!important;

        line-height:1!important;
    }


    /*
     * Keep team logo compact.
     */
    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-table-team{
        display:flex!important;

        width:100%!important;
        min-width:0!important;

        align-items:center!important;

        gap:6px!important;
    }

    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-table-team img{
        width:20px!important;
        height:20px!important;

        min-width:20px!important;

        flex:0 0 20px!important;
    }

    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-table-team span{
        min-width:0!important;

        overflow:hidden!important;

        white-space:nowrap!important;
        text-overflow:ellipsis!important;

        font-size:11px!important;
    }


    /* =====================================================
       FORM / ÚLTIMOS 5
       Reference style:
       W W D L W
       No big grey pill.
       ===================================================== */

    .mcc-cls-standing[data-mobile-view="form"]
    .mcc-fotmob-form{

        width:auto!important;
        min-width:0!important;
        height:auto!important;

        padding:0!important;
        margin:0!important;

        display:flex!important;

        align-items:center!important;
        justify-content:flex-end!important;

        gap:4px!important;

        overflow:visible!important;

        border:0!important;
        border-radius:0!important;

        background:transparent!important;

        box-shadow:none!important;
    }


    .mcc-cls-standing[data-mobile-view="form"]
    .mcc-form-result{

        width:23px!important;
        height:23px!important;

        min-width:23px!important;

        flex:
            0
            0
            23px!important;

        margin:0!important;
        padding:0!important;

        display:flex!important;

        align-items:center!important;
        justify-content:center!important;

        border:0!important;

        border-radius:
            5px!important;

        color:#fff!important;

        font-family:
            Arial,
            sans-serif!important;

        font-size:
            11px!important;

        font-weight:
            800!important;

        line-height:
            23px!important;

        box-shadow:
            none!important;
    }


    /*
     * WIN
     */
    .mcc-cls-standing[data-mobile-view="form"]
    .mcc-form-result.is-win,

    .mcc-cls-standing[data-mobile-view="form"]
    .mcc-form-result.win,

    .mcc-cls-standing[data-mobile-view="form"]
    .mcc-form-result[data-result="V"],

    .mcc-cls-standing[data-mobile-view="form"]
    .mcc-form-result[data-result="W"]{
        background:#009b69!important;
    }


    /*
     * DRAW
     */
    .mcc-cls-standing[data-mobile-view="form"]
    .mcc-form-result.is-draw,

    .mcc-cls-standing[data-mobile-view="form"]
    .mcc-form-result.draw,

    .mcc-cls-standing[data-mobile-view="form"]
    .mcc-form-result[data-result="E"]{
        background:#a7adb5!important;
    }


    /*
     * LOSS
     */
    .mcc-cls-standing[data-mobile-view="form"]
    .mcc-form-result.is-loss,

    .mcc-cls-standing[data-mobile-view="form"]
    .mcc-form-result.loss,

    .mcc-cls-standing[data-mobile-view="form"]
    .mcc-form-result[data-result="D"],

    .mcc-cls-standing[data-mobile-view="form"]
    .mcc-form-result[data-result="L"]{
        background:#df3f3f!important;
    }


    /*
     * Give Últimos 5 enough room.
     */
    .mcc-cls-standing[data-mobile-view="form"]
    .mcc-standing-fotmob thead tr,

    .mcc-cls-standing[data-mobile-view="form"]
    .mcc-standing-fotmob tbody
    tr:not(.mcc-promotion-heading){

        grid-template-columns:
            32px
            minmax(0,1fr)
            139px!important;
    }


    .mcc-cls-standing[data-mobile-view="form"]
    .mcc-standing-fotmob
    tr:not(.mcc-promotion-heading)
    > :nth-child(10){

        padding-right:2px!important;

        justify-content:flex-end!important;
    }

}


/* =========================================================
   MOBILE COMPLETE — HEADER FINAL FIX
   ========================================================= */

@media only screen and (max-width:767px){

    /*
     * Kill old generated labels first.
     */
    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-standing-fotmob
    thead th::before,

    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-standing-fotmob
    thead th::after{
        content:none!important;
        display:none!important;
    }


    /*
     * Restore the real TH text.
     */
    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-standing-fotmob
    thead th{
        font-size:9px!important;
        line-height:1!important;
        letter-spacing:0!important;

        white-space:nowrap!important;

        overflow:visible!important;

        text-align:center!important;
        justify-content:center!important;
    }


    /*
     * Final header names:
     * # TIME J V E D G SG PTS
     */

    .mcc-cls-standing[data-mobile-view="complete"]
    .mcc-standing-fotmob
    thead th:nth-child(2){
        justify-content:flex-start!important;
        text-align:left!important;
    }

}


/* =========================================================
   MOBILE HISTORY SHEET — TITLE
   ========================================================= */

@media only screen and (max-width:767px){

    .mcc-mobile-history-title{
        min-height:34px;

        padding:
            0
            48px
            0
            12px;

        display:flex;

        align-items:center;

        color:#171a1f;

        font-family:
            "Rajdhani",
            "Arial Narrow",
            Arial,
            sans-serif;

        font-size:17px;

        font-weight:600;

        line-height:1;
    }


    .mcc-mobile-history-content{
        margin-top:4px!important;
    }

}



/* =========================================================
   MOBILE HISTORY — ABOUT GRAPH CARD + MODAL
   ========================================================= */

@media only screen and (max-width:767px){

    /* =====================================================
       ABOUT GRAPH CARD
       ===================================================== */

    .mcc-mobile-history-about{

        width:100%!important;
        min-height:76px!important;

        margin:
            18px
            0
            4px!important;

        padding:
            12px
            12px
            12px
            16px!important;

        display:flex!important;

        align-items:flex-start!important;
        justify-content:space-between!important;

        gap:12px!important;

        border:
            1px solid
            #e0e4e8!important;

        border-radius:
            12px!important;

        background:
            #fff!important;

        color:
            #16191d!important;

        box-shadow:
            none!important;

        text-align:left!important;

        cursor:pointer!important;
    }


    .mcc-history-about-copy{

        flex:
            1
            1
            auto;

        min-width:0;

        display:flex;

        flex-direction:column;

        align-items:center;

        gap:7px;
    }


    .mcc-history-about-copy strong{

        color:#16191d;

        font-family:
            "Barlow Condensed",
            "Arial Narrow",
            Arial,
            sans-serif;

        font-size:17px;

        line-height:1;

        font-weight:600;

        text-transform:none;

        text-align:center;
    }


    .mcc-history-about-copy span{

        color:#9aa1aa;

        font-family:
            "Rajdhani",
            "Arial Narrow",
            Arial,
            sans-serif;

        font-size:11px;

        line-height:1.25;

        font-weight:500;

        text-align:center;
    }


    /*
     * Info icon
     */
    .mcc-history-about-info{

        width:28px;
        height:28px;

        min-width:28px;

        flex:
            0
            0
            28px;

        display:flex;

        align-items:center;
        justify-content:center;

        border:
            2px solid
            #171a1f;

        border-radius:
            50%;

        color:#171a1f;

        background:#fff;

        font-family:
            Georgia,
            serif;

        font-size:17px;

        font-style:normal;

        font-weight:700;

        line-height:1;
    }


    /* =====================================================
       ABOUT MODAL OVERLAY
       ===================================================== */

    .mcc-history-about-modal{

        position:fixed;

        inset:0;

        z-index:
            1000001;

        display:flex;

        align-items:center;
        justify-content:center;

        padding:
            22px;

        pointer-events:none;
    }


    .mcc-history-about-modal[hidden]{
        display:none!important;
    }


    .mcc-history-about-modal.is-open{
        pointer-events:auto;
    }


    .mcc-history-about-modal-backdrop{

        position:absolute;

        inset:0;

        background:
            rgba(
                17,
                24,
                39,
                .56
            );

        opacity:0;

        transition:
            opacity
            .16s
            ease;
    }


    .mcc-history-about-modal.is-open
    .mcc-history-about-modal-backdrop{

        opacity:1;
    }


    /* =====================================================
       DIALOG
       ===================================================== */

    .mcc-history-about-dialog{

        width:
            min(
                306px,
                calc(
                    100vw
                    -
                    44px
                )
            );

        position:relative;

        z-index:2;

        padding:
            22px
            18px
            18px;

        border-radius:
            17px;

        background:#fff;

        box-shadow:
            0
            18px
            50px
            rgba(
                0,
                0,
                0,
                .18
            );

        opacity:0;

        transform:
            translateY(
                8px
            )
            scale(
                .98
            );

        transition:
            opacity
            .16s
            ease,
            transform
            .16s
            ease;
    }


    .mcc-history-about-modal.is-open
    .mcc-history-about-dialog{

        opacity:1;

        transform:
            translateY(
                0
            )
            scale(
                1
            );
    }


    .mcc-history-about-dialog h3{

        margin:
            0
            0
            17px!important;

        padding:0!important;

        color:#24282d!important;

        font-family:
            "Barlow Condensed",
            "Arial Narrow",
            Arial,
            sans-serif!important;

        font-size:
            18px!important;

        line-height:
            1.1!important;

        font-weight:
            800!important;

        text-transform:none!important;
    }


    .mcc-history-about-dialog p{

        margin:
            0
            0
            10px!important;

        color:#626973!important;

        font-family:
            "Rajdhani",
            "Arial Narrow",
            Arial,
            sans-serif!important;

        font-size:
            14px!important;

        line-height:
            1.4!important;

        font-weight:
            500!important;
    }


    /*
     * FECHAR
     */
    .mcc-history-about-close{

        min-width:auto!important;
        height:32px!important;

        margin:
            11px
            0
            0
            auto!important;

        padding:
            0
            2px!important;

        display:flex!important;

        align-items:center!important;
        justify-content:center!important;

        border:
            0!important;

        background:
            transparent!important;

        color:
            #4656ff!important;

        font-family:
            "Barlow Condensed",
            "Arial Narrow",
            Arial,
            sans-serif!important;

        font-size:
            14px!important;

        font-weight:
            800!important;

        line-height:
            1!important;

        text-transform:
            uppercase!important;

        box-shadow:
            none!important;

        cursor:pointer!important;
    }

}


/* MCC Competition Favorite */
.mcc-league-action.is-favorite.is-active svg path {
    fill: #F5C542;
    stroke: #F5C542;
}

.mcc-league-action.is-favorite.is-loading {
    opacity: .65;
    pointer-events: none;
}

/* Mobile sticky competition favorite */
.mcc-mobile-league-sticky
.mcc-mobile-league-icon.is-active
svg path {
    fill: #F5C542;
    stroke: #F5C542;
}


/* =========================================================
   RX GOALS TREND — RESPONSIVE DATE LABELS
   ========================================================= */

.mcc-rx-bars
.mcc-rx-date-label {
    visibility: hidden;
    white-space: nowrap;
}

.mcc-rx-bars
.mcc-rx-date-label.is-desktop-visible {
    visibility: visible;
}


/*
 * Mobile:
 * keep only ~6 evenly distributed date labels.
 */
@media (max-width: 600px) {

    .mcc-rx-bars
    .mcc-rx-date-label.is-desktop-visible {
        visibility: hidden;
    }

    .mcc-rx-bars
    .mcc-rx-date-label.is-mobile-visible {
        visibility: visible;
    }

    .mcc-rx-bars
    .mcc-rx-date-label {
        font-size: 8px;
        line-height: 1;
    }
}