@font-face {
    font-family: "Raker";
    src: url("/assets/fonts/65c3864ffb684eb758b4c65f10afad59.eot");
    src: url("/assets/fonts/65c3864ffb684eb758b4c65f10afad59.eot?#iefix")format("embedded-opentype"),
        url("/assets/fonts/65c3864ffb684eb758b4c65f10afad59.woff")format("woff"),
        url("/assets/fonts/65c3864ffb684eb758b4c65f10afad59.woff2")format("woff2"),
        url("/assets/fonts/65c3864ffb684eb758b4c65f10afad59.ttf")format("truetype"),
        url("/assets/fonts/65c3864ffb684eb758b4c65f10afad59.svg#Raker")format("svg");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

:root {
    --accent-color: #FAFF64;
}


h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Raker", sans-serif;
    font-weight: 400;
    letter-spacing: unset;
    background: none;
    -webkit-background-clip: unset;
    -webkit-text-fill-color: unset;
}

h4 {
    font-size: 26px;
}

h5 {
    font-size: 22px;
}

body,
body > splash {
    background: #15151A;
}


body > bg {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
}

body > bg > img,
body > bg > video,
body > splash > img {
    position: relative;
    display: block;
    width: 100%;
    height: 100vh;
    margin: 0;
    padding: 0;
    -webkit-mask-image: linear-gradient(to bottom, #000000 50%, transparent 100%);
    mask-image: linear-gradient(to bottom, #000000 50%, transparent 100%);
    mask-repeat: no-repeat;
    object-fit: cover;
    object-position: center center;
}



gameprogressbar {
    background: rgba(255, 255, 255, .05);
}

gameprogressbar::after {
    display: none;
}

gameprogressbar,
*.axis gameprogressbar {
    clip-path: unset;
}

gameprogressbar > inner,
*.axis gameprogressbar > inner {
    clip-path: unset;
}

gameprogressbar > inner::after {
    position: absolute;
    right: 0;
    left: unset;
    top: 0;
    height: 100%;
    width: 4px;
    background: rgba(255, 255, 255, .9);
    mix-blend-mode: overlay;
    clip-path: unset !important;
}

.reverse gameprogressbar > inner::after {
    right: unset;
    left: 0;
}

*.allies > gameprogressbar > inner {
    background: linear-gradient(to right, #153a48, #4bcfff);
}

*.axis > gameprogressbar > inner {
    background: linear-gradient(to right, #3f1414, #ff4343);
}


body > menu {
    background: rgba(0, 0, 0, .2);
    -webkit-backdrop-filter: blur(24px) saturate(200%);
    backdrop-filter: blur(24px) saturate(200%);
    -webkit-mask-image: linear-gradient(black 64%, transparent 100%);
    mask-image: linear-gradient(black 64%, transparent 100%);
}

section > content > titlewrap {
    -webkit-filter: unset;
    filter: unset;
}

section > content > titlewrap > h2 span {
    color: #ffffff;
}

section > content > titlewrap > h1,
section > content > titlewrap > h2,
section > content > titlewrap > h3,
section > content > titlewrap > h4,
section > content > titlewrap > h5,
section > content > titlewrap > h6 {
    display: inline-block;
    background: rgba(0, 0, 0, .4);
    padding: 8px 12px;
    text-transform: uppercase;
    line-height: 1;
}

section > content > titlewrap > h1:not(:last-child),
section > content > titlewrap > h2:not(:last-child),
section > content > titlewrap > h3:not(:last-child),
section > content > titlewrap > h4:not(:last-child),
section > content > titlewrap > h5:not(:last-child),
section > content > titlewrap > h6:not(:last-child) {
    margin-bottom: 8px;
}

section > content > titlewrap > h1::before,
section > content > titlewrap > h2::before,
section > content > titlewrap > h3::before,
section > content > titlewrap > h4::before,
section > content > titlewrap > h5::before,
section > content > titlewrap > h6::before {
    position: absolute;
    left: -4px;
    top: -4px;
    width: 32px;
    height: 12px;
    border-top: 3px solid rgba(0, 0, 0, .6);
    border-left: 3px solid rgba(0, 0, 0, .6);
    content: '';
}

section > content > titlewrap > h1::after,
section > content > titlewrap > h2::after,
section > content > titlewrap > h3::after,
section > content > titlewrap > h4::after,
section > content > titlewrap > h5::after,
section > content > titlewrap > h6::after {
    position: absolute;
    left: 36px;
    top: -4px;
    width: 5%;
    height: 12px;
    border-top: 3px solid rgba(0, 0, 0, .6);
    content: '';
}


section > content > titlewrap > p {
    display: block;
    color: #f0f0f0;
    padding: 0 12px;
    flex: 0 0;
}

section > content > titlewrap > p::after {
    position: absolute;
    left: -4px;
    bottom: -8px;
    height: 16px;
    width: 60px;
    border-left: 3px solid rgba(0, 0, 0, .5);
    border-bottom: 3px solid rgba(0, 0, 0, .5);
    content: '';
}


section.active-match > content > columns > columnwrap > tile.details > content {
    -webkit-filter: none;
    filter: none;
    overflow: hidden;
}

section.active-match > content > columns > columnwrap > tile.details > content > titlewrap > h3 {
    font-weight: 500;
}

section.active-match > content > columns > columnwrap > tile.details > content > titlewrap > h3::before {
    position: absolute;
    left: -6px;
    top: -6px;
    width: 32px;
    height: 12px;
    border-top: 3px solid rgba(0, 0, 0, .4);
    border-left: 3px solid rgba(0, 0, 0, .4);
    content: '';
}

section.active-match > content > columns > columnwrap > tile.details > content > titlewrap > h3::after {
    position: absolute;
    right: -18px;
    bottom: -4px;
    width: 70px;
    height: 3px;
    background: rgba(0, 0, 0, .5);
    content: '';
}

section.active-match > content > columns > columnwrap > tile.details > content > score > entry > h6 {
    font-weight: 600;
    margin: 4px 16px 0 0;
    font-size: 19px;
    flex: 0 0 40px;
}

section.active-match > content > columns > columnwrap > tile.details > content > score > entry.w > h6,
matchcards > tile > content > score > mvp > p:first-of-type,
matchcards > tile > content > score > entry.w > h5 {
    color: #FFFF01;
    background: unset;
    -webkit-background-clip: unset;
    -webkit-text-fill-color: unset;
}

section.active-match > content > columns > columnwrap > tile.details livebadge {
    background: rgba(255, 255, 255, .05);
    box-shadow: unset;
    -webkit-backdrop-filter: blur(8px) saturate(150%);
    backdrop-filter: blur(8px) saturate(150%);
}

section.active-match > content > columns > columnwrap > tile.details livebadge > dot {
    background: #FFFF01;
}

section.active-match > content > columns > columnwrap > tile.details livebadge > p {
    color: #FFFF01;
}

section.active-match > content > columns > columnwrap > tile.scoreboard > titlewrap > h6 {
    margin: 0;
}

section.active-match > content > columns > columnwrap > tile.scoreboard.allies > titlewrap {
    background: rgba(81, 203, 255, 0.1);
}

section.active-match > content > columns > columnwrap > tile.scoreboard.allies > titlewrap > h6 {
    color: #4bcfff;
    font-weight: 500;
}

section.active-match > content > columns > columnwrap > tile.scoreboard.axis > titlewrap {
    background: rgba(255, 81, 81, 0.1);
}

section.active-match > content > columns > columnwrap > tile.scoreboard.axis > titlewrap > h6 {
    color: #ff4343;
    font-weight: 500;
}

section.active-match > content > columns > columnwrap > tile.scoreboard > titlewrap > stats > p {
    font-size: 16px;
    text-transform: uppercase;
    font-weight: 500;
    opacity: .9;
}

section.active-match > content > columns > columnwrap > tile.scoreboard > players > player:not(:last-of-type) {
    border-bottom-color: rgba(255, 255, 255, .2);
}

section.active-match > content > columns > columnwrap > tile.scoreboard > players > player > titlewrap > a {
    color: #ffffff;
}


section.active-match > content > columns > columnwrap > tile::before,
section.active-match > content > columns > columnwrap > matchevents > content > tile.axis::before,
section.active-match > content > columns > columnwrap > matchevents > content > tile.allies::before {
    background: rgba(0, 0, 0, .8);
    -webkit-backdrop-filter: blur(8px) saturate(120%);
    backdrop-filter: blur(8px) saturate(120%);
    clip-path: unset;
}

section.active-match > content > columns > columnwrap > tile::after,
section.active-match > content > columns > columnwrap > matchevents > content > tile.axis::after,
section.active-match > content > columns > columnwrap > matchevents > content > tile.allies::after {
    display: none;
}

section.active-match > content > columns > columnwrap > matchevents > content > tile.allies > textwrap > h5,
section.active-match > content > columns > columnwrap > matchevents > content > tile.axis > textwrap > h5 {
    font-weight: 500;
    margin: 0;
}

section.active-match > content > columns > columnwrap > matchevents > content > tile.allies::before {
    background: rgba(9, 27, 35, 0.8);
}

section.active-match > content > columns > columnwrap > matchevents > content > tile.allies > textwrap > h5 {
    color: #4bcfff;
}

section.active-match > content > columns > columnwrap > matchevents > content > tile.allies > glow {
    background: radial-gradient(closest-side, rgba(81, 203, 255, 0.1), transparent);
}

section.active-match > content > columns > columnwrap > matchevents > content > tile.axis::before {
    background: rgba(27, 8, 8, 0.8);
}

section.active-match > content > columns > columnwrap > matchevents > content > tile.axis > textwrap > h5 {
    color: #ff4343;
}

section.active-match > content > columns > columnwrap > matchevents > content > tile.axis > glow {
    background: radial-gradient(closest-side, rgba(255, 81, 81, 0.1), transparent);
}

section.active-match > content > columns > columnwrap > matchevents > content > tile {
    padding-left: 28px;
}

section.active-match > content > columns > columnwrap > matchevents > content > tile > img {
    width: 74px;
    height: 74px;
    flex: 0 0 74px;
    object-fit: contain;
    object-position: center center;
}


section.active-match > content > columns > columnwrap > tile.scoreboard > players > player > titlewrap > rank > img {
    object-fit: contain;
    object-position: center center;
}

section.active-match > content > columns > columnwrap > tile.scoreboard > players > player > titlewrap > rank > p {
    font-family: "Raker", sans-serif;
    font-size: 15px;
    line-height: 1;
    padding-top: 3px;
    -webkit-filter: drop-shadow(0px 0px 4px rgba(0, 0, 0, 1));
    filter: drop-shadow(0px 0px 4px rgba(0, 0, 0, 1));
    font-smooth: antialiased;
}


section.active-match > content > columns > columnwrap > tile.details > content > titlewrap > h3 {
    background: rgba(0, 0, 0, .5);
    padding: 4px 12px;
    margin-left: -12px;
    display: inline-block;
    font-size: 34px;
    font-weight: 400;

}

section.active-match > content > columns > columnwrap > tile.details > content > titlewrap > h3::before {
    position: absolute;
    left: unset;
    right: -4px;
    top: -4px;
    width: 32px;
    height: 12px;
    border-top: 3px solid rgba(0, 0, 0, .6);
    border-right: 3px solid rgba(0, 0, 0, .6);
    border-left: unset;
    content: '';
}



tile::before,
tile::after,
playercards > tile::before,
playercards > tile::after {
    clip-path: unset;
}

tile::after,
playercards > tile::after {
    display: none;
}

tile::before,
playercards > tile::before {
    background: rgba(0, 0, 0, .4);
}

playercards > tile > content > rank > h1 {
    font-weight: 300;
}

playercards > tile > img {
    left: -32px;
    top: -32px;
    height: 200px;
    width: auto;
}


matchcards > tile > content > h4 {
    background: rgba(0, 0, 0, .5);
    padding: 0 12px;
    margin-left: -12px;
    display: inline-block;
    font-size: 34px;
    font-weight: 400;
    -webkit-filter: none;
    filter: none;
}

matchcards > tile > content > h4::before {
    position: absolute;
    right: -4px;
    top: -4px;
    width: 32px;
    height: 12px;
    border-top: 3px solid rgba(0, 0, 0, .6);
    border-right: 3px solid rgba(0, 0, 0, .6);
    content: '';
}

matchcards > tile > content > p {
    color: #aaaaaa;
}

matchcards > tile > content > score > entry > h5 {
    font-size: 26px;
}




tile.player-card {
    clip-path: none !important;
    -webkit-backdrop-filter: blur(16px) saturate(200%);
    backdrop-filter: blur(16px) saturate(200%);
}

tile sidebarmenu > a.a {
    background: linear-gradient(to right, #FAFF64, #FCE15E);
    mask-image: unset;
    clip-path: unset;
}

tile sidebarmenu > a.a::before {
    position: absolute;
    left: 4px;
    top: 4px;
    bottom: 4px;
    width: 6px;
    background: #000000;
    content: '';
}

section.player-overview > content > columns > columnwrap > sidebar > tile.player-card > titlewrap > h5 > b {
    color: #f0f0f0;
}

section.player-overview > content > columns > columnwrap > sidebar > tile.player-card > quote {
    background: rgba(0, 0, 0, .2);
}

tile sidebarmenu > a > icon {
    color: #FAFF64;
}

section.player-overview > content > columns > columnwrap > activity > tile {
    -webkit-backdrop-filter: blur(16px) saturate(200%);
    backdrop-filter: blur(16px) saturate(200%);
}

section.player-overview > content > columns > columnwrap > activity > tile::before {
    background: rgba(0, 0, 0, .75);
}

section.player-overview > content > columns > columnwrap > activity > tile > *:not(:last-child):not(:first-child) {
    background: rgba(0, 0, 0, .5);
}

section.player-overview > content > columns > columnwrap > activity > tile > killstreak.special {
    background: linear-gradient(to right, #8d64ff, #cd61ff) !important;
}



tile.player-stats {
    -webkit-backdrop-filter: blur(16px) saturate(200%);
    backdrop-filter: blur(16px) saturate(200%);
}

tile.player-stats::before {
    background: rgba(0, 0, 0, .75);
}

section.player-overview > content > columns > columnwrap > titlewrap > h1,
section.player-overview > content > columns > columnwrap > titlewrap > h2,
section.player-overview > content > columns > columnwrap > titlewrap > h3,
section.player-overview > content > columns > columnwrap > titlewrap > h4 {
    display: inline-block;
    background: rgba(0, 0, 0, .4);
    padding: 8px 12px;
    text-transform: uppercase;
    line-height: 1;
}

section.player-overview > content > columns > columnwrap > titlewrap > h1::before,
section.player-overview > content > columns > columnwrap > titlewrap > h2::before,
section.player-overview > content > columns > columnwrap > titlewrap > h3::before,
section.player-overview > content > columns > columnwrap > titlewrap > h4::before {
    position: absolute;
    left: -4px;
    top: -4px;
    width: 32px;
    height: 12px;
    border-top: 3px solid rgba(0, 0, 0, .6);
    border-left: 3px solid rgba(0, 0, 0, .6);
    content: '';
}

section.player-overview > content > columns > columnwrap > titlewrap > h1::after,
section.player-overview > content > columns > columnwrap > titlewrap > h2::after,
section.player-overview > content > columns > columnwrap > titlewrap > h3::after,
section.player-overview > content > columns > columnwrap > titlewrap > h4::after {
    position: absolute;
    left: 36px;
    top: -4px;
    width: 5%;
    height: 12px;
    border-top: 3px solid rgba(0, 0, 0, .6);
    content: '';
}