/* CS2 statistics. Open editorial layout, figures only when they exist. */

.page-content.cs2-stats {
    padding-top: calc(var(--glhf-header-height) + 22px);
}

.cs2-stats {
    --cs-mark-h: 2.55rem;
    --cs2-rail: 168px;
    --cs2-rail-gap: 42px;
    --cs2-line: rgba(255, 255, 255, 0.08);
    --cs2-ink: #f4f6f8;
    --cs2-quiet: #8d97a3;
    --cs2-glhf: var(--glhf-accent);
    --cs2-glhf-rgb: var(--glhf-accent-rgb);
    --cs2-faceit: #ff5500;
    --cs2-faceit-rgb: 255, 85, 0;
    --cs2-premier: #b388ff;
    --cs2-premier-rgb: 179, 136, 255;
    --cs2-tourney: #e4c36a;
    --cs2-tourney-rgb: 228, 195, 106;
    --cs2-duel-left: #00ff64;
    --cs2-duel-right: #8cb4ff;
    --cs2-win-rgb: 0, 255, 100;
    --cs2-loss-rgb: 255, 86, 86;
    --cs2-tie-rgb: 156, 168, 180;
    --cs2-win-fill: rgba(0, 255, 100, 0.045);
    --cs2-win-line: rgba(0, 255, 100, 0.10);
    --cs2-win-hover: rgba(0, 255, 100, 0.07);
    --cs2-win-hover-line: rgba(0, 255, 100, 0.16);
    --cs2-loss-fill: rgba(255, 86, 86, 0.04);
    --cs2-loss-line: rgba(255, 86, 86, 0.10);
    --cs2-loss-hover: rgba(255, 86, 86, 0.065);
    --cs2-loss-hover-line: rgba(255, 86, 86, 0.16);
    --cs2-tie-fill: rgba(156, 168, 180, 0.055);
    --cs2-tie-line: rgba(156, 168, 180, 0.12);
    --cs2-tie-hover: rgba(156, 168, 180, 0.085);
    --cs2-tie-hover-line: rgba(156, 168, 180, 0.18);
    --cs2-ease: cubic-bezier(0.2, 0.7, 0.14, 1);
    --cs2-enter-ease: cubic-bezier(0.2, 0.68, 0.14, 1);
    --cs2-enter: 880ms;
    --cs2-enter-lead: 30ms;
    --cs2-enter-step: 130ms;
    --cs2-swap: 520ms;
    --cs2-nav-beat: 380ms;
    --cs2-swap-away: -12px;
    --cs2-swap-in: 22px;
    --cs2-fill: 1.4s;
    --cs2-fill-ease: cubic-bezier(0.16, 0.46, 0.08, 1);
    --cs2-fill-lead: 160ms;
    --cs2-fill-stagger: 90ms;
    --cs2-radar: 1200ms;
    --cs2-radar-tone: 0, 255, 100;
}

.cs2-stats-kicker {
    margin: 0 0 0.45rem;
    font-family: var(--glhf-font-heading);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--cs2-quiet);
}

.cs2-stats h1 {
    margin: 0;
    font-family: var(--glhf-font-heading);
    font-weight: 700;
    font-size: clamp(2.6rem, 6vw, 4.6rem);
    line-height: 0.9;
    letter-spacing: -0.035em;
    color: var(--cs2-ink);
}

.cs2-stats h2 {
    margin: 0 0 1rem;
    font-family: var(--glhf-font-heading);
    font-size: 1.15rem;
    font-weight: 650;
    letter-spacing: -0.02em;
    text-transform: none;
    color: var(--cs2-ink);
}

.cs2-stats-search {
    position: relative;
    max-width: 720px;
    margin: 0 0 2.75rem;
}

.cs2-stats-search-bar {
    display: flex;
    align-items: center;
    gap: 14px;
    min-height: 56px;
    padding: 0 18px 0 20px;
    background: rgba(12, 16, 20, 0.72);
    border: 1px solid var(--cs2-line);
    border-radius: 999px;
    backdrop-filter: blur(10px);
}

.cs2-stats-search-bar:focus-within {
    border-color: rgba(var(--glhf-accent-rgb), 0.55);
    box-shadow: 0 0 0 4px rgba(var(--glhf-accent-rgb), 0.08);
}

.cs2-stats-search-icon {
    flex: 0 0 auto;
    color: var(--cs2-quiet);
}

.cs2-stats-search-input {
    flex: 1;
    min-width: 0;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--cs2-ink);
    font: inherit;
    font-size: 1.02rem;
    padding: 16px 0;
}

.cs2-stats-search-input::placeholder {
    color: #66707a;
}

.cs2-stats-search-input::-webkit-search-decoration,
.cs2-stats-search-input::-webkit-search-cancel-button,
.cs2-stats-search-input::-webkit-search-results-button,
.cs2-stats-search-input::-webkit-search-results-decoration {
    -webkit-appearance: none;
    appearance: none;
    display: none;
}

.cs2-stats-search-input::-ms-clear {
    display: none;
    width: 0;
    height: 0;
}

.cs2-stats-search-clear {
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--glhf-accent);
    cursor: pointer;
    opacity: 0.78;
}

.cs2-stats-search-clear[hidden] {
    display: none;
}

.cs2-stats-search-clear:hover,
.cs2-stats-search-clear:focus-visible {
    opacity: 1;
}

.cs2-stats-search-clear:focus-visible {
    outline: 2px solid var(--glhf-accent);
    outline-offset: 2px;
    border-radius: 8px;
}

.cs2-stats-search-clear svg {
    display: block;
    width: auto;
    height: auto;
    max-width: 16px;
    max-height: 16px;
}

.cs2-stats-search-results {
    position: absolute;
    z-index: 40;
    top: calc(100% + 10px);
    left: 0;
    right: 0;
    max-height: 380px;
    overflow: auto;
    pointer-events: auto;
    background: #10161c;
    border: 1px solid var(--cs2-line);
    border-radius: 18px;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.45);
}

.cs2-stats-search.is-open {
    z-index: 20;
}

.cs2-stats-search-results .user-search-item {
    position: relative;
    z-index: 1;
    width: 100%;
    cursor: pointer;
}

.cs2-stats-search-results .user-search-item.is-active,
.cs2-stats-search-results .user-search-item:focus {
    background: rgba(var(--glhf-accent-rgb), 0.08);
}

.cs2-stats-search-hint {
    margin: 0;
    padding: 1.35rem 1rem;
    text-align: center;
    color: var(--cs2-quiet);
}

.cs2-stats-mast {
    margin: 0 0 2.4rem;
}

.cs2-stats-mast-plate {
    position: relative;
    isolation: isolate;
    z-index: 1;
    min-width: 0;
    overflow: visible;
    padding: 1.25rem 1.45rem 1.15rem;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 28px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.045), transparent 46%),
        #0c1116;
}

.cs2-stats-mast-glow {
    position: absolute;
    inset: 0;
    z-index: 0;
    border-radius: inherit;
    overflow: hidden;
    pointer-events: none;
    background:
        radial-gradient(ellipse 70% 90% at 6% 18%, rgba(0, 255, 100, 0.1), transparent 58%),
        radial-gradient(ellipse 46% 70% at 96% 0%, rgba(140, 180, 255, 0.08), transparent 52%);
}

.cs2-stats-mast-top,
.cs2-stats-mast-core,
.cs2-stats-mast-head,
.cs2-stats-mast-title,
.cs2-stats-mast-account,
.cs2-stats-search--mast {
    position: relative;
}

.cs2-stats-mast-head,
.cs2-stats-search--mast {
    z-index: 4;
}

.cs2-stats-mast-account {
    z-index: 1;
}

.cs2-stats-mast:has(.cs2-stats-search.is-open) .cs2-stats-mast-account {
    pointer-events: none;
}

.cs2-stats-mast:has(.cs2-stats-search.is-open) .cs2-stats-mast-plate {
    z-index: 8;
}

.cs2-stats-mast-top,
.cs2-stats-layout {
    display: grid;
    grid-template-columns: var(--cs2-rail) minmax(0, 1fr);
    column-gap: var(--cs2-rail-gap);
}

.cs2-stats-mast-top {
    z-index: 1;
    align-items: stretch;
}

.cs2-stats-mast-top:not(:has(.cs2-stats-mast-portrait)) {
    grid-template-columns: minmax(0, 1fr);
}

.cs2-stats-mast-portrait {
    display: flex;
    flex-direction: column;
    align-self: stretch;
    width: 100%;
    height: 100%;
    min-height: var(--cs2-rail);
    margin: 0;
    padding: 4px;
    overflow: hidden;
    border-radius: 24px;
    background:
        linear-gradient(165deg, rgba(255, 255, 255, 0.22), rgba(255, 255, 255, 0.03) 42%, rgba(0, 0, 0, 0.45)),
        #14191f;
    box-shadow:
        0 0 0 1px rgba(255, 255, 255, 0.06),
        0 16px 32px rgba(0, 0, 0, 0.38);
}

.cs2-stats-mast-portrait img,
.cs2-stats-mast-monogram {
    display: block;
    flex: 1 1 auto;
    width: 100%;
    height: 100%;
    min-height: 0;
    border-radius: 20px;
    object-fit: cover;
    background: #0a0d11;
}

.cs2-stats-mast-monogram {
    display: grid;
    place-items: center;
    color: var(--cs2-ink);
    font-family: var(--glhf-font-heading);
    font-size: 2.4rem;
    font-weight: 700;
    letter-spacing: -0.05em;
}

.cs2-stats-mast-core {
    min-width: 0;
}

.cs2-stats-mast-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.1rem 2rem;
}

.cs2-stats-mast-title {
    min-width: 0;
}

.cs2-stats-mast .cs2-stats-kicker {
    color: color-mix(in srgb, var(--glhf-accent) 70%, #8d97a3);
}

.cs2-stats-mast h1 {
    font-size: clamp(1.35rem, 2.7vw, 2.5rem);
    line-height: 0.94;
    letter-spacing: -0.03em;
}

.cs2-stats-mast-title h1::after {
    content: "";
    display: block;
    width: 28px;
    height: 2px;
    margin-top: 0.48rem;
    border-radius: 2px;
    background: var(--glhf-accent);
    transform-origin: left center;
}

.cs2-stats-mast-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.45rem 0.85rem;
    margin: 0.62rem 0 0;
}

.cs2-stats-search--mast {
    flex: 0 0 auto;
    width: min(300px, 100%);
    margin: 0.15rem 0 0;
    z-index: 5;
}

.cs2-stats-search--mast.is-open {
    z-index: 8;
}

.cs2-stats-search--mast .cs2-stats-search-bar {
    min-height: 48px;
}

.cs2-stats-search--gate {
    width: min(520px, 100%);
    margin-top: 1.35rem;
}

.cs2-stats-mast-note {
    margin: 1rem 0 0;
    color: var(--cs2-quiet);
}

.cs2-stats-auth {
    max-width: 34rem;
    padding: 2.6rem 0 5.5rem;
}

.cs2-stats-auth .cs2-stats-kicker {
    margin-bottom: 0.75rem;
}

.cs2-stats-auth h1 {
    font-size: clamp(2.4rem, 7vw, 4.2rem);
}

.cs2-stats-auth-copy {
    margin: 1.05rem 0 1.9rem;
    max-width: 26rem;
    color: var(--cs2-quiet);
    font-size: 1.06rem;
    line-height: 1.45;
}

.cs2-stats-auth .glhf-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
}

.cs2-stats-section > .cs2-stats-dossier:first-child,
.cs2-stats-section > .cs2-stats-tiles-head:first-child,
.cs2-stats-section > .cs2-stats-tiles:first-child,
.cs2-stats-section > .cs2-stats-tab-lead:first-child {
    margin-top: 0;
}

.cs2-stats-dossier.cs2-stats-surface {
    padding: 1.35rem 1.5rem 1.25rem;
}

.cs2-stats-style {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 0.7rem 1.8rem;
    margin: 0 0 1.15rem;
    padding: 0 0 1.05rem;
    border-bottom: 1px solid var(--cs2-line);
}

.cs2-stats-style-copy {
    min-width: 0;
    max-width: 38rem;
}

.cs2-stats-style-meta {
    margin: 0;
    color: var(--cs2-quiet);
    font-size: 0.82rem;
    line-height: 1.4;
    font-variant-numeric: tabular-nums;
    text-align: right;
}

.cs2-stats-mast-sign {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.15rem 0;
    margin: 0;
}

.cs2-stats-mast-pair {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
}

.cs2-stats-mast-sign > * + *::before,
.cs2-stats-mast-pair > * + *::before {
    content: "·";
    margin: 0 0.72rem;
    color: rgba(255, 255, 255, 0.28);
    font-weight: 600;
}

.cs2-stats-mast-sign .cs2-stats-tempo,
.cs2-stats-mast-role {
    font-family: var(--glhf-font-heading);
    font-size: clamp(1.35rem, 2vw, 1.7rem);
    font-weight: 700;
    letter-spacing: -0.03em;
    text-transform: none;
}

.cs2-stats-mast-role {
    color: var(--cs2-ink);
}

.cs2-stats-mast-arms {
    color: var(--cs2-quiet);
    font-size: 0.96rem;
}

.cs2-stats-dossier-body {
    display: grid;
    grid-template-columns: min-content minmax(0, 1fr);
    align-items: stretch;
    gap: 2.4rem 4.1rem;
    padding-left: 1.9rem;
}

.cs2-stats-overview-split {
    display: grid;
    grid-template-columns: minmax(240px, 0.82fr) minmax(300px, 1.18fr);
    gap: 1.35rem;
    align-items: start;
}

.cs2-stats-section > .cs2-stats-overview-split:first-child {
    margin-top: 0;
}

.cs2-stats-overview-split .cs2-stats-path {
    margin-top: 0;
}

.cs2-stats-dossier-radar {
    --cs2-radar-tone: 0, 255, 100;
    position: relative;
    isolation: isolate;
    height: 100%;
    max-height: 100%;
    width: auto;
    aspect-ratio: 1;
    outline: none;
}

.cs2-stats-dossier-radar::before {
    content: "";
    position: absolute;
    inset: 17%;
    border-radius: 50%;
    background:
        radial-gradient(circle at 50% 46%,
            rgba(var(--cs2-radar-tone), 0.22) 0%,
            rgba(var(--cs2-radar-tone), 0.07) 38%,
            transparent 70%);
    opacity: 0;
    transform: scale(0.58);
    pointer-events: none;
    z-index: 0;
}

.cs2-stats-dossier-radar.is-radar-fill::before {
    animation: cs2-radar-halo var(--cs2-radar) var(--cs2-fill-ease) both;
}

.cs2-stats-dossier-radar.is-radar-ready::before {
    opacity: 0.72;
    transform: none;
}

.cs2-stats-dossier-radar:focus-visible {
    outline: 1px solid rgba(255, 255, 255, 0.16);
    outline-offset: 6px;
    border-radius: 4px;
}

.cs2-stats-dossier-radar .cs2-stats-chart--radar-compact {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    max-width: none;
    z-index: 1;
}

.cs2-stats-dossier-radar .cs2-stats-chart canvas {
    width: 100% !important;
    height: 100% !important;
}

.cs2-stats-dossier-extra {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.15rem;
    min-width: 0;
}

.cs2-stats-dossier-extra .cs2-stats-rail {
    grid-template-columns: 8.2rem minmax(0, 1fr) minmax(3.2rem, auto);
}

.cs2-stats-figures {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem 1.2rem;
    margin: 0.95rem 0 0;
    padding: 0.95rem 0 0;
    border-top: 1px solid var(--cs2-line);
}

.cs2-stats-figure {
    min-width: 0;
}

.cs2-stats-figure.cs2-tip {
    cursor: help;
    outline: none;
}

.cs2-stats-figure dt {
    color: var(--cs2-quiet);
    font-family: var(--glhf-font-heading);
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.cs2-stats-standing {
    display: flex;
    align-items: baseline;
    gap: 0.7rem;
    width: 100%;
    margin: 1.15rem 0 0;
    padding: 1.05rem 0.05rem 0.08rem;
    border-top: 1px solid var(--cs2-line);
    color: inherit;
    text-decoration: none;
    transition: border-color 180ms ease;
}

.cs2-stats-standing.cs2-tip {
    cursor: help;
    outline: none;
}

.cs2-stats-standing.is-link {
    cursor: pointer;
}

.cs2-stats-standing.is-link:focus {
    outline: none;
}

.cs2-stats-standing.is-link:focus-visible {
    border-radius: 10px;
    box-shadow: 0 0 0 2px rgba(0, 255, 100, 0.32);
}

.cs2-stats-dossier-extra > .cs2-stats-standing:first-child {
    margin-top: 0;
    padding-top: 0.1rem;
    border-top: 0;
}

.cs2-stats-standing b {
    font-family: var(--glhf-font-heading);
    font-size: 2.05rem;
    font-weight: 700;
    line-height: 0.88;
    letter-spacing: -0.05em;
    font-variant-numeric: tabular-nums;
    color: var(--cs2-ink);
    transition: color 180ms ease;
}

.cs2-stats-standing-copy {
    color: var(--cs2-quiet);
    font-size: 0.94rem;
    letter-spacing: 0.01em;
    transition: color 180ms ease;
}

.cs2-stats-standing em {
    font-style: normal;
    font-family: var(--glhf-font-heading);
    font-size: 1.18rem;
    font-weight: 750;
    letter-spacing: 0.06em;
    line-height: 1;
    color: #00ff64;
    transition: text-shadow 180ms ease;
}

.cs2-stats-standing-go {
    flex: 0 0 auto;
    align-self: center;
    width: 0.52rem;
    height: 0.52rem;
    margin-left: auto;
    border-top: 2px solid #00ff64;
    border-right: 2px solid #00ff64;
    opacity: 0;
    transform: rotate(45deg) translateX(-0.28rem);
    transition: opacity 180ms ease, transform 180ms ease, border-color 180ms ease;
}

.cs2-stats-standing.is-link:is(:hover, :focus-visible) {
    border-top-color: rgba(0, 255, 100, 0.28);
}

.cs2-stats-standing.is-link:is(:hover, :focus-visible) .cs2-stats-standing-copy {
    color: var(--cs2-ink);
}

.cs2-stats-standing.is-link:is(:hover, :focus-visible) em {
    text-shadow: 0 0 18px rgba(0, 255, 100, 0.38);
}

.cs2-stats-standing.is-link:is(:hover, :focus-visible) .cs2-stats-standing-go {
    opacity: 1;
    transform: rotate(45deg) translateX(0);
}

.cs2-stats-standing[data-place="1"] b {
    color: #e4c36a;
}

.cs2-stats-standing[data-place="2"] b {
    color: #c8d0d8;
}

.cs2-stats-standing[data-place="3"] b {
    color: #d0a07a;
}

.cs2-stats-figure dd {
    margin: 0.22rem 0 0;
    font-family: var(--glhf-font-heading);
    font-size: 1.08rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    font-variant-numeric: tabular-nums;
    color: var(--cs2-ink);
    white-space: nowrap;
}

.cs2-stats-figure .cs2-stats-kda {
    font-size: 1.02rem;
}

.cs2-stats-rails {
    display: flex;
    flex-direction: column;
    gap: 0.62rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.cs2-stats-rail {
    display: grid;
    grid-template-columns: 5.6rem minmax(0, 1fr) minmax(3.1rem, auto);
    align-items: center;
    gap: 0.55rem 0.8rem;
}

.cs2-stats-rail.cs2-tip {
    cursor: help;
    outline: none;
}

.cs2-stats-rail-name {
    color: var(--cs2-quiet);
    font-family: var(--glhf-font-heading);
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.cs2-stats-rail-track {
    display: block;
    height: 5px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.055);
}

.cs2-stats-rail-track i {
    display: block;
    width: var(--fill, 0%);
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(0, 255, 100, 0.22), #00ff64);
    transform-origin: left center;
}

.cs2-stats-rail-val {
    font-family: var(--glhf-font-heading);
    font-size: 1.02rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    font-variant-numeric: tabular-nums;
    text-align: right;
    color: var(--cs2-ink);
}

.cs2-stats-dossier .cs2-stats-tiles {
    margin-top: 0;
    border-bottom: 0;
}

.cs2-stats-medallion {
    flex: 0 0 auto;
    width: 112px;
    height: 112px;
    padding: 3px;
    border-radius: 50%;
    background:
        radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.55), transparent 42%),
        conic-gradient(from 200deg, #00ff64, rgba(255, 255, 255, 0.28), rgba(0, 255, 100, 0.05), #00ff64);
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.04), 0 18px 40px rgba(0, 0, 0, 0.35);
}

.cs2-stats-medallion img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1;
    border-radius: 50%;
    object-fit: cover;
    background: #0c1014;
}

.cs2-stats-handle {
    display: inline-block;
    color: var(--cs2-quiet);
    font-size: 1rem;
    text-decoration: none;
}

.cs2-stats-handle:hover {
    color: var(--glhf-accent);
}

.cs2-stats-steam-one {
    color: var(--cs2-ink);
    font-family: var(--glhf-font-heading);
    font-size: 0.92rem;
}

.cs2-stats-steams {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 6px;
}

.cs2-stats-steam-chip {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 32px;
    padding: 2px 10px 2px 5px;
    border: 1px solid transparent;
    border-radius: 999px;
    background: transparent;
    color: var(--cs2-quiet);
    font: inherit;
    font-size: 0.84rem;
    cursor: pointer;
}

.cs2-stats-steam-chip img {
    width: 22px;
    height: auto;
    aspect-ratio: 1;
    border-radius: 50%;
    object-fit: cover;
}

.cs2-stats-steam-chip.is-active {
    color: var(--cs2-ink);
    border-color: rgba(var(--glhf-accent-rgb), 0.45);
    background: rgba(var(--glhf-accent-rgb), 0.08);
}

.cs2-stats-layout {
    align-items: start;
}

.cs2-stats-layout--solo {
    grid-template-columns: minmax(0, 1fr);
}

.cs2-stats-nav {
    position: sticky;
    top: calc(var(--glhf-header-height) + 18px);
    display: flex;
    flex-direction: column;
    gap: 2px;
    isolation: isolate;
}

.cs2-stats-nav-thumb {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 0;
    width: 0;
    height: 0;
    border-radius: 12px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.05), transparent 46%),
        rgba(var(--glhf-accent-rgb), 0.1);
    box-shadow: inset 2px 0 0 var(--glhf-accent);
    opacity: 0;
    pointer-events: none;
    transform: translate(0, 0);
    transition:
        transform var(--cs2-nav-beat) var(--cs2-ease),
        width var(--cs2-nav-beat) var(--cs2-ease),
        height var(--cs2-nav-beat) var(--cs2-ease),
        opacity 280ms var(--cs2-ease);
}

.cs2-stats-nav.is-armed .cs2-stats-nav-thumb {
    opacity: 1;
}

.cs2-stats-nav-btn {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 40px;
    padding: 0 0 0 14px;
    border: 0;
    border-radius: 12px;
    background: transparent;
    color: var(--cs2-quiet);
    font-family: var(--glhf-font-heading);
    font-size: 1rem;
    text-align: left;
    cursor: pointer;
    transition: color 220ms var(--cs2-ease), background-color 220ms ease;
}

.cs2-stats-nav-btn:hover {
    color: var(--cs2-ink);
    background: rgba(255, 255, 255, 0.035);
}

.cs2-stats-nav-btn.is-active,
.cs2-stats-nav-btn.is-active:hover {
    color: var(--cs2-ink);
    background: transparent;
}

.cs2-stats-role,
.cs2-stats-tempo {
    margin: 0;
}

.cs2-stats-role {
    font-family: var(--glhf-font-heading);
    font-size: clamp(1.7rem, 2.4vw, 2.2rem);
    font-weight: 700;
    letter-spacing: -0.03em;
    color: var(--cs2-ink);
}

.cs2-stats-role span {
    margin-left: 0.7rem;
    color: var(--cs2-quiet);
    font-size: 0.46em;
    font-weight: 600;
    letter-spacing: 0.04em;
}

.cs2-stats-tempo {
    font-family: var(--glhf-font-heading);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #d8d4c8;
}

.cs2-stats-tempo[data-tempo="aggressive"] {
    color: #ff6b6b;
}

.cs2-stats-tempo[data-tempo="balanced"] {
    color: #d8d4c8;
}

.cs2-stats-tempo[data-tempo="cautious"] {
    color: #8cb4ff;
}

.cs2-stats-tiles-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    margin: 1.35rem 0 0;
}

.cs2-stats-tiles-head h2,
.cs2-stats-tiles-head p {
    margin: 0;
}

.cs2-stats-tiles-head p {
    color: var(--cs2-quiet);
    font-size: 0.88rem;
}

.cs2-stats-ranks,
.cs2-stats-tiles {
    display: grid;
    grid-template-columns: repeat(var(--cols, 3), minmax(0, 1fr));
}

.cs2-stats-tiles {
    --cols: auto-fit;
    grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
    margin-top: 0.25rem;
    overflow: visible;
    border-bottom: 1px solid var(--cs2-line);
}

.cs2-stats-ranks {
    margin: 0 0 0.25rem;
    border-top: 1px solid var(--cs2-line);
    border-bottom: 1px solid var(--cs2-line);
}

.cs2-stats-ranks.cs2-stats-mast-medals {
    display: grid;
    grid-template-columns: repeat(var(--cols, 3), max-content) minmax(0, 1fr);
    align-items: stretch;
    justify-content: start;
    gap: 0;
    margin: 1.05rem 0 0;
    padding-top: 0.95rem;
    border-top: 1px solid var(--cs2-line);
    border-bottom: 0;
}

.cs2-stats-mast-medals .cs2-stats-rank {
    display: grid;
    grid-template-rows: 1rem var(--cs2-medal-well);
    align-items: center;
    row-gap: 0.62rem;
    min-width: 0;
    padding: 0 1.55rem 0 0;
    --cs2-medal-well: 3.25rem;
}

.cs2-stats-mast-medals .cs2-stats-rank + .cs2-stats-rank {
    padding-left: 1.55rem;
}

.cs2-stats-mast-medals .cs2-stats-rank + .cs2-stats-rank::before {
    top: 0;
    bottom: 0;
}

.cs2-stats-mast-medals .cs2-stats-kicker {
    margin: 0;
    line-height: 1;
    align-self: end;
}

.cs2-stats-mast-medals .cs2-stats-rank-badge {
    display: flex;
    align-items: center;
    height: var(--cs2-medal-well);
    margin: 0;
}

.cs2-stats-mast-medals .faceit-elo,
.cs2-stats-mast-medals .cs-rating-wrap,
.cs2-stats-mast-medals .cs-rating-link,
.cs2-stats-mast-medals .glr-mark {
    display: flex;
    align-items: center;
    height: 100%;
}

.cs2-stats-mast-medals .faceit-elo-level {
    width: auto;
    height: 3.25rem;
    max-width: none;
    max-height: 3.25rem;
}

.cs2-stats-mast-medals .glr-side b {
    font-size: 1.85rem;
    line-height: 1;
}

.cs2-stats-rank,
.cs2-stats-tile {
    position: relative;
    padding: 1.35rem 1.35rem 1.2rem 0;
    background: transparent;
}

.cs2-stats-rank[data-jump] {
    cursor: pointer;
}

.cs2-stats-rank[data-jump]:hover .cs2-stats-kicker {
    color: var(--glhf-accent);
}

.cs2-stats-rank + .cs2-stats-rank,
.cs2-stats-tile + .cs2-stats-tile {
    padding-left: 1.35rem;
}

.cs2-stats-rank + .cs2-stats-rank::before,
.cs2-stats-tile + .cs2-stats-tile::before {
    content: "";
    position: absolute;
    left: 0;
    top: 1.15rem;
    bottom: 1.15rem;
    width: 1px;
    background: var(--cs2-line);
}

.cs2-stats-rank-badge {
    margin-top: 0.85rem;
}

.cs2-stats-rank-badge .glr-mark {
    align-items: flex-end;
}

.cs2-stats-mast-medals .cs2-stats-rank-badge .glr-mark {
    align-items: center;
}

.cs2-stats-rank-badge .glr-side em {
    display: none;
}

.cs2-stats-rank-badge .glr-side b {
    font-size: 1.85rem;
}

.cs2-stats-rank-note {
    margin: 0.7rem 0 0;
    color: var(--cs2-quiet);
    font-size: 0.86rem;
}

.cs2-stats-mast-medals .cs2-stats-updated {
    grid-column: -1;
    align-self: end;
    justify-self: end;
    box-sizing: border-box;
    max-width: 100%;
    margin: 0;
    padding: 0 0 0.1rem 1.15rem;
    color: #6f7884;
    font-size: 0.7rem;
    font-weight: 500;
    letter-spacing: 0.02em;
    line-height: 1.25;
    font-variant-numeric: tabular-nums;
    text-align: right;
    white-space: nowrap;
}

.cs2-stats-glr {
    margin: 0.15rem 0 0;
    font-family: var(--glhf-font-heading);
    font-size: clamp(2.8rem, 5vw, 4rem);
    font-weight: 700;
    line-height: 0.85;
    letter-spacing: -0.045em;
    font-variant-numeric: tabular-nums;
    color: var(--cs2-ink);
}

.cs2-stats-glr span {
    margin-left: 0.25rem;
    font-size: 0.34em;
    letter-spacing: 0.12em;
    color: var(--cs2-quiet);
}

.cs2-stats-mast-medals .faceit-elo-value {
    font-size: 1.85rem;
}

.cs2-stats-mast-medals .cs-rating {
    height: var(--cs-mark-h);
}

.cs2-stats-mast-medals .cs-rating-k {
    font-size: 1.55rem;
}

.cs2-stats-mast-medals .cs-rating-sep,
.cs2-stats-mast-medals .cs-rating-rest {
    font-size: 1.05rem;
}

.cs2-stats-tile span {
    display: block;
    width: max-content;
    margin-bottom: 0.4rem;
    color: var(--cs2-quiet);
    font-family: var(--glhf-font-heading);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.cs2-stats-tile.cs2-tip {
    cursor: help;
    outline: none;
}

.cs2-stats-tile.cs2-tip span {
    border-bottom: 1px dotted rgba(255, 255, 255, 0.22);
}

.cs2-stats-tile.cs2-tip:hover,
.cs2-stats-tile.cs2-tip:focus-visible {
    z-index: 6;
}

.cs2-stats-tile.cs2-tip:hover span,
.cs2-stats-tile.cs2-tip:focus-visible span {
    color: #d7dee6;
    border-bottom-color: rgba(255, 255, 255, 0.4);
}

.cs2-stats-tile strong {
    font-family: var(--glhf-font-heading);
    font-size: clamp(1.6rem, 2vw, 2.1rem);
    font-weight: 700;
    letter-spacing: -0.03em;
    font-variant-numeric: tabular-nums;
    color: var(--cs2-ink);
    white-space: nowrap;
}

.cs2-stats-sheet {
    --cs2-sheet: var(--cs2-glhf);
    --cs2-sheet-rgb: var(--cs2-glhf-rgb);
    padding: 1.6rem 1.8rem 1.45rem;
}

.cs2-stats-sheet-head {
    margin: 0 0 1.35rem;
}

.cs2-stats-sheet-head .cs2-stats-kicker {
    margin: 0;
    color: var(--cs2-sheet);
}

.cs2-stats-sheet-head .cs2-stats-kicker::after {
    content: "";
    display: block;
    width: 28px;
    height: 2px;
    margin-top: 0.55rem;
    border-radius: 2px;
    background: var(--cs2-sheet);
}

.cs2-stats-sheet-head h2 {
    margin: 0.35rem 0 0;
}

.cs2-stats-sheet.is-glhf {
    --cs2-sheet: var(--cs2-glhf);
    --cs2-sheet-rgb: var(--cs2-glhf-rgb);
}

.cs2-stats-sheet.is-premier {
    --cs2-sheet: var(--cs2-premier);
    --cs2-sheet-rgb: var(--cs2-premier-rgb);
}

.cs2-stats-sheet.is-faceit {
    --cs2-sheet: var(--cs2-faceit);
    --cs2-sheet-rgb: var(--cs2-faceit-rgb);
}

.cs2-stats-sheet.is-tourney {
    --cs2-sheet: var(--cs2-tourney);
    --cs2-sheet-rgb: var(--cs2-tourney-rgb);
    padding: 1.8rem 1.95rem 1.55rem;
    border-color: rgba(var(--cs2-tourney-rgb), 0.22);
    background:
        linear-gradient(165deg, rgba(var(--cs2-tourney-rgb), 0.12), transparent 46%),
        rgba(14, 18, 24, 0.84);
}

.cs2-stats-sheet-lead {
    display: flex;
    align-items: flex-end;
    gap: 0;
}

.cs2-stats-sheet-marks {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    flex: 1 1 0;
    gap: 1.2rem 2rem;
    min-width: 0;
}

.cs2-stats-sheet-lead > .cs2-stats-sheet-marks + .cs2-stats-sheet-marks {
    padding-left: 2rem;
    border-left: 1px solid var(--cs2-line);
}

.cs2-stats-sheet-mark {
    min-width: 0;
}

.cs2-stats-sheet-mark.cs2-tip {
    cursor: help;
    outline: none;
}

.cs2-stats-sheet-mark strong {
    display: block;
    font-family: var(--glhf-font-heading);
    font-size: clamp(2.05rem, 3vw, 2.55rem);
    font-weight: 700;
    line-height: 0.88;
    letter-spacing: -0.045em;
    font-variant-numeric: tabular-nums;
    color: var(--cs2-ink);
}

.cs2-stats-sheet-mark.is-plus strong {
    color: #9ad4aa;
}

.cs2-stats-sheet-mark.is-minus strong {
    color: #d89a9a;
}

.cs2-stats-sheet-mark span,
.cs2-stats-sheet-band h3 {
    color: var(--cs2-sheet);
    font-family: var(--glhf-font-heading);
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.cs2-stats-sheet-mark span {
    display: block;
    margin-top: 0.42rem;
}

.cs2-stats-sheet-lead + .cs2-stats-sheet-band,
.cs2-stats-sheet-band + .cs2-stats-sheet-band {
    margin-top: 1.3rem;
    padding-top: 1.2rem;
    border-top: 1px solid var(--cs2-line);
}

.cs2-stats-sheet-band h3 {
    margin: 0 0 0.85rem;
}

.cs2-stats-sheet-band .cs2-stats-rails {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.78rem 2.6rem;
}

.cs2-stats-sheet-band .cs2-stats-figures {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 0;
    padding-top: 0;
    border-top: none;
}

.cs2-stats-sheet-foot .cs2-stats-figures {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 1.2rem;
}

.cs2-stats-sheet-foot .cs2-stats-figure dd {
    font-size: 1.28rem;
}

.cs2-stats-sheet .cs2-stats-rail {
    grid-template-columns: 8.8rem minmax(0, 1fr) minmax(3.2rem, auto);
}

.cs2-stats-sheet .cs2-stats-rail-track i {
    background: linear-gradient(90deg, rgba(var(--cs2-sheet-rgb), 0.22), var(--cs2-sheet));
}

.cs2-stats-sheet + .cs2-stats-grid,
.cs2-stats-sheet + .cs2-stats-panel,
.cs2-stats-sheet + .cs2-stats-cups,
.cs2-stats-sheet + .cs2-stats-cups-block,
.cs2-stats-tab-lead + .cs2-stats-cups,
.cs2-stats-tab-lead + .cs2-stats-cups-block,
.cs2-stats-section > .cs2-stats-cups,
.cs2-stats-section > .cs2-stats-cups-block {
    margin-top: 1.75rem;
}

.cs2-stats-split {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(260px, 0.85fr);
    gap: 28px 36px;
    margin-top: 1.75rem;
    align-items: stretch;
}

.cs2-stats-maplab-head,
.cs2-stats-maplab-body {
    display: flex;
    gap: 1rem;
}

.cs2-stats-maplab-head {
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.35rem;
}

.cs2-stats-maplab-head h2 { margin: 0; }

.cs2-stats-maplab-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.cs2-stats-maplab-tabs button {
    min-height: 32px;
    padding: 0 12px;
    border: 1px solid var(--cs2-line);
    border-radius: 999px;
    background: transparent;
    color: var(--cs2-quiet);
    font: inherit;
    font-size: 0.82rem;
    cursor: pointer;
}

.cs2-stats-maplab-tabs button.is-active {
    color: var(--cs2-ink);
    border-color: rgba(var(--glhf-accent-rgb), 0.5);
    background: rgba(var(--glhf-accent-rgb), 0.08);
}

.cs2-stats-maplab.is-glhf {
    --cs2-lab: var(--cs2-glhf);
    --cs2-lab-rgb: var(--cs2-glhf-rgb);
}

.cs2-stats-maplab.is-premier {
    --cs2-lab: var(--cs2-premier);
    --cs2-lab-rgb: var(--cs2-premier-rgb);
}

.cs2-stats-maplab.is-faceit {
    --cs2-lab: var(--cs2-faceit);
    --cs2-lab-rgb: var(--cs2-faceit-rgb);
}

.cs2-stats-maplab[data-tone] {
    --cs2-map-tone: var(--cs2-lab);
    border-color: rgba(var(--cs2-lab-rgb), 0.16);
    background:
        linear-gradient(180deg, rgba(var(--cs2-lab-rgb), 0.07), transparent 38%),
        rgba(14, 18, 24, 0.78);
}

.cs2-stats-maplab[data-tone] .cs2-stats-maplab-tabs button:hover {
    color: var(--cs2-ink);
    border-color: rgba(var(--cs2-lab-rgb), 0.34);
}

.cs2-stats-maplab[data-tone] .cs2-stats-maplab-tabs button.is-active {
    color: var(--cs2-ink);
    border-color: rgba(var(--cs2-lab-rgb), 0.55);
    background: rgba(var(--cs2-lab-rgb), 0.12);
}

.cs2-stats-maplab-body { align-items: center; }
.cs2-stats-maplab-body .cs2-stats-chart { flex: 1.15; min-width: 0; }

.cs2-stats-maplab-list {
    flex: 0.85;
    list-style: none;
    margin: 0;
    padding: 0;
}

.cs2-stats-maplab-list li {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    padding: 0.45rem 0;
}

.cs2-stats-map-meter {
    height: 6px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.06);
    overflow: hidden;
}

.cs2-stats-map-meter i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: var(--cs2-map-tone, var(--glhf-accent));
    transition:
        width var(--cs2-maplab-beat, 820ms) var(--cs2-fill-ease),
        background-color var(--cs2-maplab-beat, 820ms) var(--cs2-fill-ease);
}

.cs2-stats-map-readout {
    display: grid;
    justify-items: end;
    min-width: 3.4rem;
}

.cs2-stats-map-readout strong {
    grid-area: 1 / 1;
    margin: 0;
    text-align: right;
    font-variant-numeric: tabular-nums;
    opacity: 0;
    pointer-events: none;
    transition: opacity var(--cs2-maplab-beat, 820ms) var(--cs2-fill-ease);
}

.cs2-stats-map-readout strong.is-on {
    opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
    .cs2-stats-map-meter i,
    .cs2-stats-map-readout strong {
        transition: none;
    }
}

.cs2-stats-maplab-list li.is-empty {
    opacity: 0.42;
}

.cs2-stats-matches {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.cs2-stats-match {
    --cs2-match-rgb: 255, 255, 255;
    position: relative;
    z-index: 0;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    padding: 14px 16px 12px;
    overflow: visible;
    border: 1px solid rgba(var(--cs2-match-rgb), 0.08);
    border-radius: 16px;
    background: rgba(var(--cs2-match-rgb), 0.03);
    transition: background-color 160ms ease, border-color 160ms ease;
}

.cs2-stats-match:hover,
.cs2-stats-match:focus-within {
    z-index: 4;
}

.cs2-stats-match--win {
    --cs2-match-rgb: var(--cs2-win-rgb);
    background: var(--cs2-win-fill);
    border-color: var(--cs2-win-line);
}

.cs2-stats-match--loss {
    --cs2-match-rgb: var(--cs2-loss-rgb);
    background: var(--cs2-loss-fill);
    border-color: var(--cs2-loss-line);
}

.cs2-stats-match--tie {
    --cs2-match-rgb: var(--cs2-tie-rgb);
    background: var(--cs2-tie-fill);
    border-color: var(--cs2-tie-line);
}

.cs2-stats-match-map {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem 0.55rem;
    min-width: 0;
}

.cs2-stats-wl {
    display: inline-grid;
    place-items: center;
    min-width: 1.35rem;
    height: 1.35rem;
    padding: 0 0.28rem;
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.08);
    color: var(--cs2-quiet);
    font-family: var(--glhf-font-heading);
    font-size: 0.68rem;
    font-style: normal;
    font-weight: 800;
    letter-spacing: 0.06em;
}

.cs2-stats-match--win .cs2-stats-wl {
    background: rgba(0, 255, 100, 0.2);
    color: #7dffb0;
}

.cs2-stats-match--loss .cs2-stats-wl {
    background: rgba(255, 86, 86, 0.2);
    color: #ff9a9a;
}

.cs2-stats-match--tie .cs2-stats-wl {
    background: rgba(156, 168, 180, 0.16);
    color: #c5ced6;
}
.cs2-stats-match-map strong { font-family: var(--glhf-font-heading); font-size: 1.05rem; }
.cs2-stats-weapon p { margin: 0.28rem 0 0; color: var(--cs2-quiet); font-size: 0.8rem; }

.cs2-stats-match-lead {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem 1rem;
    min-width: 0;
}

.cs2-stats-score {
    display: block;
    flex: 0 0 auto;
    margin: 0;
    font-family: var(--glhf-font-heading);
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1;
    white-space: nowrap;
}

.cs2-stats-match-foot {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.7rem 1rem;
    min-width: 0;
}

.cs2-stats-match-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem 1rem;
    min-width: 0;
    margin: 0;
}

.cs2-stats-match-stats > div {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
}

.cs2-stats-match dt {
    display: flex;
    align-items: center;
    min-height: 1.15rem;
    color: var(--cs2-quiet);
    font-size: 0.66rem;
    letter-spacing: 0.1em;
    line-height: 1;
    text-transform: uppercase;
}

.cs2-stats-match dd {
    margin: 0.18rem 0 0;
    font-variant-numeric: tabular-nums;
}

.cs2-stats-match-aside {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: flex-start;
    gap: 0.42rem;
    flex: 0 0 auto;
    margin-left: auto;
    padding-top: 0;
}

.cs2-stats-kda {
    display: inline-flex;
    align-items: baseline;
    gap: 0.12em;
    font-family: var(--glhf-font-heading);
    font-weight: 700;
}

.cs2-stats-kda i {
    font-style: normal;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.28);
}

.cs2-stats-kda .is-k { color: #5dff9a; }
.cs2-stats-kda .is-d { color: #ff6b6b; }
.cs2-stats-kda .is-a { color: #ff9a3c; }

.cs2-stats-match-when {
    margin: 0;
    color: var(--cs2-quiet);
    font-size: 0.72rem;
    letter-spacing: 0.01em;
    line-height: 1.2;
    white-space: nowrap;
}

.cs2-stats-weapons {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px 28px;
}
.cs2-stats-weapon-top { display: flex; justify-content: space-between; gap: 12px; font-family: var(--glhf-font-heading); }
.cs2-stats-weapon-track { height: 8px; margin-top: 0.45rem; background: rgba(255,255,255,0.06); border-radius: 999px; overflow: hidden; }
.cs2-stats-weapon-track span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(0, 255, 100, 0.55), var(--glhf-accent));
    transform-origin: left center;
}

.cs2-stats-people-split {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
    margin-top: 1.35rem;
}

.cs2-stats-people-panel h2 {
    margin: 0 0 0.7rem;
    line-height: 1.25;
}

.cs2-stats-people {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.cs2-stats-person {
    position: relative;
    isolation: isolate;
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    min-height: 60px;
    padding: 8px 10px;
    border: 1px solid transparent;
    border-radius: 14px;
    color: var(--cs2-ink);
    text-decoration: none;
    transition: background 0.18s ease, border-color 0.18s ease;
}

.cs2-stats-person.is-link {
    cursor: pointer;
}

.cs2-stats-person.is-link:hover,
.cs2-stats-person.is-link:focus-within {
    color: var(--cs2-ink);
    background: rgba(255, 255, 255, 0.035);
    border-color: var(--cs2-line);
}

.cs2-stats-person-shot {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    overflow: hidden;
    border-radius: 50%;
    background:
        radial-gradient(circle at 30% 25%, rgba(255, 255, 255, 0.1), transparent 42%),
        rgba(255, 255, 255, 0.035);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);
}

.cs2-stats-person-shot img {
    width: 100%;
    height: auto;
    aspect-ratio: 1;
    object-fit: cover;
}

.cs2-stats-person-fallback {
    display: grid;
    place-items: center;
    width: 100%;
    height: 100%;
    color: var(--cs2-quiet);
    font-family: var(--glhf-font-heading);
    font-size: 0.95rem;
    font-weight: 650;
}

.cs2-stats-leaders {
    position: relative;
    overflow: hidden;
    scroll-margin-top: calc(var(--glhf-header-height) + 28px);
}

.cs2-stats-leaders::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 1px;
    background: linear-gradient(90deg, rgba(228, 195, 106, 0.58), rgba(228, 195, 106, 0.12) 46%, transparent 88%);
    pointer-events: none;
}

.cs2-stats-leaders-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.85rem 1.25rem;
    margin-bottom: 0.35rem;
}

.cs2-stats-leaders-head h2 {
    margin: 0;
}

.cs2-stats-leaders-count {
    margin: 0;
    color: var(--cs2-quiet);
    font-size: 0.72rem;
    font-weight: 650;
    letter-spacing: 0.12em;
    line-height: 1.2;
    text-transform: uppercase;
    white-space: nowrap;
}

.cs2-stats-leaders-list {
    list-style: none;
    margin: 0.55rem 0 0;
    padding: 0.2rem 0 0;
    border-top: 1px solid var(--cs2-line);
}

.cs2-stats-leader {
    --cs2-leader-wash: transparent;
    --cs2-leader-ring: transparent;
    position: relative;
    isolation: isolate;
    z-index: 0;
    display: grid;
    grid-template-columns: 2.55rem minmax(0, 1fr) auto;
    align-items: center;
    column-gap: 0.85rem;
    min-height: 3.35rem;
    margin: 0.08rem -0.28rem;
    padding: 0.46rem 0.68rem 0.46rem 0.42rem;
    border-bottom: 1px solid transparent;
    border-radius: 12px;
    background: transparent;
    box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.045);
    transition: color 180ms ease;
}

.cs2-stats-leader::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: var(--cs2-leader-wash);
    box-shadow: inset 0 0 0 1px var(--cs2-leader-ring);
    pointer-events: none;
    z-index: 0;
    transition: background 180ms ease, box-shadow 180ms ease;
}

.cs2-stats-leader[hidden] {
    display: none;
}

.cs2-stats-leader:last-child {
    box-shadow: none;
}

.cs2-stats-leader.is-podium-1 {
    background: linear-gradient(90deg, rgba(228, 195, 106, 0.09), transparent 58%);
}

.cs2-stats-leader.is-podium-2 {
    background: linear-gradient(90deg, rgba(200, 208, 216, 0.055), transparent 54%);
}

.cs2-stats-leader.is-podium-3 {
    background: linear-gradient(90deg, rgba(201, 137, 90, 0.08), transparent 54%);
}

.cs2-stats-leader.is-focus {
    background: linear-gradient(90deg, rgba(0, 255, 100, 0.1), rgba(0, 255, 100, 0.02) 48%, transparent 78%);
}

.cs2-stats-leader.is-focus::before {
    box-shadow: inset 2px 0 0 #00ff64, inset 0 0 0 1px var(--cs2-leader-ring);
}

.cs2-stats-leader.is-link {
    cursor: pointer;
}

.cs2-stats-leader.is-link:is(:hover, :focus-within) {
    --cs2-leader-wash: rgba(255, 255, 255, 0.05);
    --cs2-leader-ring: rgba(255, 255, 255, 0.1);
    z-index: 1;
    box-shadow: none;
}

.cs2-stats-leader.is-podium-1.is-link:is(:hover, :focus-within) {
    --cs2-leader-wash: linear-gradient(90deg, rgba(228, 195, 106, 0.16), rgba(228, 195, 106, 0.04) 52%, transparent 86%);
    --cs2-leader-ring: rgba(228, 195, 106, 0.3);
}

.cs2-stats-leader.is-podium-2.is-link:is(:hover, :focus-within) {
    --cs2-leader-wash: linear-gradient(90deg, rgba(214, 222, 230, 0.12), rgba(214, 222, 230, 0.03) 52%, transparent 86%);
    --cs2-leader-ring: rgba(214, 222, 230, 0.22);
}

.cs2-stats-leader.is-podium-3.is-link:is(:hover, :focus-within) {
    --cs2-leader-wash: linear-gradient(90deg, rgba(201, 137, 90, 0.15), rgba(201, 137, 90, 0.04) 52%, transparent 86%);
    --cs2-leader-ring: rgba(201, 137, 90, 0.28);
}

.cs2-stats-leader.is-focus.is-link:is(:hover, :focus-within),
.cs2-stats-leader.is-focus.is-arrive {
    --cs2-leader-wash: linear-gradient(90deg, rgba(0, 255, 100, 0.14), rgba(0, 255, 100, 0.04) 50%, transparent 82%);
    --cs2-leader-ring: rgba(0, 255, 100, 0.2);
}

.cs2-stats-leader.is-focus.is-arrive {
    --cs2-leader-wash: linear-gradient(90deg, rgba(0, 255, 100, 0.22), rgba(0, 255, 100, 0.06) 48%, transparent 82%);
    --cs2-leader-ring: rgba(0, 255, 100, 0.34);
}

.cs2-stats-leader-place {
    color: var(--cs2-quiet);
    font-family: var(--glhf-font-heading);
    font-size: 1.02rem;
    font-weight: 750;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.04em;
    line-height: 1;
    text-align: right;
    transition: color 180ms ease;
}

.cs2-stats-leader.is-podium-1 .cs2-stats-leader-place {
    color: #e4c36a;
    font-size: 1.22rem;
}

.cs2-stats-leader.is-podium-2 .cs2-stats-leader-place {
    color: #d7dee6;
    font-size: 1.12rem;
}

.cs2-stats-leader.is-podium-3 .cs2-stats-leader-place {
    color: #c9895a;
    font-size: 1.12rem;
}

.cs2-stats-leader.is-link:is(:hover, :focus-within) .cs2-stats-leader-place {
    color: var(--cs2-ink);
}

.cs2-stats-leader.is-podium-1.is-link:is(:hover, :focus-within) .cs2-stats-leader-place {
    color: #f3d78a;
}

.cs2-stats-leader.is-podium-2.is-link:is(:hover, :focus-within) .cs2-stats-leader-place {
    color: #f4f7fb;
}

.cs2-stats-leader.is-podium-3.is-link:is(:hover, :focus-within) .cs2-stats-leader-place {
    color: #e0a574;
}

.cs2-stats-leader.is-focus.is-link:is(:hover, :focus-within) .cs2-stats-leader-place {
    color: #b8ffd0;
}

.cs2-stats-leader-who {
    display: flex;
    align-items: center;
    gap: 0.72rem;
    min-width: 0;
}

.cs2-stats-leader-copy {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

.cs2-stats-leader-shot {
    display: grid;
    place-items: center;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    overflow: hidden;
    border-radius: 50%;
    background:
        radial-gradient(circle at 30% 25%, rgba(255, 255, 255, 0.1), transparent 42%),
        rgba(255, 255, 255, 0.035);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);
    transition: box-shadow 180ms ease, transform 180ms ease;
}

.cs2-stats-leader.is-link:is(:hover, :focus-within) .cs2-stats-leader-shot {
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.28);
    transform: scale(1.045);
}

.cs2-stats-leader.is-podium-1.is-link:is(:hover, :focus-within) .cs2-stats-leader-shot {
    box-shadow: inset 0 0 0 1px rgba(228, 195, 106, 0.55);
}

.cs2-stats-leader.is-podium-2.is-link:is(:hover, :focus-within) .cs2-stats-leader-shot {
    box-shadow: inset 0 0 0 1px rgba(214, 222, 230, 0.42);
}

.cs2-stats-leader.is-podium-3.is-link:is(:hover, :focus-within) .cs2-stats-leader-shot {
    box-shadow: inset 0 0 0 1px rgba(201, 137, 90, 0.5);
}

.cs2-stats-leader.is-focus.is-link:is(:hover, :focus-within) .cs2-stats-leader-shot {
    box-shadow: inset 0 0 0 1px rgba(0, 255, 100, 0.45);
}

.cs2-stats-leader-shot img {
    width: 100%;
    height: auto;
    aspect-ratio: 1;
    object-fit: cover;
}

.cs2-stats-leader-fallback {
    display: grid;
    place-items: center;
    width: 100%;
    height: 100%;
    color: var(--cs2-quiet);
    font-family: var(--glhf-font-heading);
    font-size: 0.92rem;
    font-weight: 650;
}

.cs2-stats-leader-name {
    min-width: 0;
    overflow: hidden;
    color: var(--cs2-ink);
    font-size: 1.02rem;
    font-weight: 650;
    letter-spacing: -0.02em;
    line-height: 1.2;
    text-decoration: none;
    text-overflow: ellipsis;
    white-space: nowrap;
    transition: color 180ms ease;
}

a.cs2-stats-leader-name:focus {
    outline: none;
}

a.cs2-stats-leader-name::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    border-radius: inherit;
}

.cs2-stats-leader.is-link:is(:hover, :focus-within) .cs2-stats-leader-name {
    color: #fff;
}

.cs2-stats-leader.is-focus .cs2-stats-leader-name {
    color: #fff;
}

.cs2-stats-leader-ranks {
    --cs-mark-h: 1.2rem;
    position: relative;
    z-index: 2;
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 0.38rem;
    height: 1.35rem;
}

.cs2-stats-leader-ranks .faceit-elo,
.cs2-stats-leader-ranks .cs-rating-wrap,
.cs2-stats-leader-ranks .cs-rating-link,
.cs2-stats-leader-ranks .glr-mark-wrap,
.cs2-stats-leader-ranks .glr-mark-link {
    display: inline-flex;
    align-items: center;
    min-height: 0;
    height: 1.35rem;
    text-decoration: none;
    color: inherit;
}

.cs2-stats-leader-ranks a:hover {
    opacity: 0.82;
}

.cs2-stats-leader-ranks .faceit-elo {
    gap: 0;
}

.cs2-stats-leader-ranks .faceit-elo-level {
    width: auto;
    height: 1.35rem;
    max-width: 1.35rem;
    max-height: 1.35rem;
}

.cs2-stats-leader-ranks .cs-rating {
    --cs-pip-w: 5px;
    height: var(--cs-mark-h);
    gap: 2px;
}

.cs2-stats-leader-ranks .cs-rating-plate {
    width: calc(var(--cs-pip-w) + 0.32rem);
    min-width: 0;
}

.cs2-stats-leader-ranks .glr-mark {
    --cs-mark-h: 1.2rem;
    gap: 0;
}

.cs2-stats-leader-ranks .glr-mark--icon .glr-side {
    display: none;
}

.cs2-stats-leader-ranks .glr-steps,
.cs2-stats-leader-ranks .glr-ico {
    width: auto;
    height: var(--cs-mark-h);
    max-width: none;
    max-height: var(--cs-mark-h);
}

.cs2-stats-leader-rating {
    color: var(--cs2-ink);
    font-family: var(--glhf-font-heading);
    font-size: 1.08rem;
    font-weight: 750;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.02em;
    line-height: 1;
    transition: color 180ms ease;
}

.cs2-stats-leader.is-link:is(:hover, :focus-within) .cs2-stats-leader-rating {
    color: #fff;
}

.cs2-stats-leader.is-podium-1.is-link:is(:hover, :focus-within) .cs2-stats-leader-rating {
    color: #f3d78a;
}

.cs2-stats-leader.is-focus .cs2-stats-leader-rating,
.cs2-stats-leader.is-focus.is-link:is(:hover, :focus-within) .cs2-stats-leader-rating {
    color: #00ff64;
}

.cs2-stats-leaders-pager {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    margin-top: 0.95rem;
    padding-top: 0.9rem;
    border-top: 1px solid var(--cs2-line);
}

.cs2-stats-leaders-pages {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 0.18rem;
}

.cs2-stats-leaders-pager button {
    min-width: 2.05rem;
    height: 2.05rem;
    padding: 0 0.42rem;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: var(--cs2-quiet);
    font-family: var(--glhf-font-heading);
    font-size: 0.86rem;
    font-weight: 650;
    font-variant-numeric: tabular-nums;
    line-height: 1;
    cursor: pointer;
}

.cs2-stats-leaders-pager button:hover:not(:disabled) {
    color: var(--cs2-ink);
    background: rgba(255, 255, 255, 0.045);
}

.cs2-stats-leaders-pager button.is-current {
    color: var(--cs2-ink);
    background: rgba(255, 255, 255, 0.07);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);
}

.cs2-stats-leaders-pager button:disabled {
    opacity: 0.28;
    cursor: default;
}

.cs2-stats-leaders-gap {
    width: 1.15rem;
    color: var(--cs2-quiet);
    font-size: 0.82rem;
    letter-spacing: 0.08em;
    text-align: center;
}

@media (hover: none) {
    .cs2-stats-leader.is-link:is(:hover, :focus-within) .cs2-stats-leader-shot {
        transform: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .cs2-stats-leader,
    .cs2-stats-leader::before,
    .cs2-stats-leader-place,
    .cs2-stats-leader-name,
    .cs2-stats-leader-rating,
    .cs2-stats-leader-shot {
        transition: none;
    }

    .cs2-stats-leader.is-link:is(:hover, :focus-within) .cs2-stats-leader-shot {
        transform: none;
    }
}

.cs2-stats-person-copy {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

.cs2-stats-person-name {
    flex: 0 1 auto;
    min-width: 0;
    overflow: hidden;
    color: var(--cs2-ink);
    font-size: 1.08rem;
    font-weight: 650;
    line-height: 1.2;
    letter-spacing: -0.02em;
    text-decoration: none;
    text-overflow: ellipsis;
    white-space: nowrap;
    transition: color 0.18s ease;
}

a.cs2-stats-person-name:focus {
    outline: none;
}

a.cs2-stats-person-name::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    border-radius: inherit;
}

.cs2-stats-person.is-link:is(:hover, :focus-within) .cs2-stats-person-name {
    color: #fff;
}

.cs2-stats-person-ranks {
    --cs-mark-h: 1.2rem;
    position: relative;
    z-index: 2;
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 0.42rem;
    height: 1.35rem;
}

.cs2-stats-person-ranks .faceit-elo,
.cs2-stats-person-ranks .cs-rating-wrap,
.cs2-stats-person-ranks .cs-rating-link,
.cs2-stats-person-ranks .glr-mark-wrap,
.cs2-stats-person-ranks .glr-mark-link {
    display: inline-flex;
    align-items: center;
    min-height: 0;
    height: 1.35rem;
    text-decoration: none;
    color: inherit;
}

.cs2-stats-person-ranks a:hover {
    opacity: 0.82;
}

.cs2-stats-person-ranks .faceit-elo {
    gap: 0;
}

.cs2-stats-person-ranks .faceit-elo-level {
    width: auto;
    height: 1.35rem;
    max-width: 1.35rem;
    max-height: 1.35rem;
}

.cs2-stats-person-ranks .cs-rating {
    --cs-pip-w: 5px;
    height: var(--cs-mark-h);
    gap: 2px;
}

.cs2-stats-person-ranks .cs-rating-plate {
    width: calc(var(--cs-pip-w) + 0.32rem);
    min-width: 0;
}

.cs2-stats-person-ranks .glr-mark {
    --cs-mark-h: 1.2rem;
    gap: 0;
}

.cs2-stats-person-ranks .glr-mark--icon .glr-side {
    display: none;
}

.cs2-stats-person-ranks .glr-steps,
.cs2-stats-person-ranks .glr-ico {
    width: auto;
    height: var(--cs-mark-h);
    max-width: none;
    max-height: var(--cs-mark-h);
}

.cs2-stats-person-tally {
    font-family: var(--glhf-font-heading);
    font-size: 1.18rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.03em;
    line-height: 1;
    color: var(--cs2-ink);
}
.cs2-stats-block-title { margin: 1.5rem 0 0.4rem; }

.cs2-stats-grid {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.2fr);
    gap: 28px 40px;
    margin-top: 1.75rem;
    align-items: start;
}

.cs2-stats-grid--one {
    grid-template-columns: minmax(0, 720px);
}

.cs2-stats-grid > .cs2-stats-panel {
    display: flex;
    flex-direction: column;
    min-width: 0;
    margin-top: 0;
}

.cs2-stats-grid > .cs2-stats-panel .cs2-stats-chart {
    flex: 0 0 auto;
}

.cs2-stats-grid .cs2-stats-chart--radar {
    max-width: none;
}

.cs2-stats-panel {
    min-width: 0;
}

.cs2-stats-surface {
    padding: 22px 24px 18px;
    border: 1px solid rgba(255, 255, 255, 0.07);
    border-radius: 22px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.04), transparent 38%),
        rgba(14, 18, 24, 0.78);
}

.cs2-stats-section > .cs2-stats-surface,
.cs2-stats-section > .cs2-stats-split {
    margin-top: 1.35rem;
}

.cs2-stats-chart {
    position: relative;
    min-height: 320px;
}

.cs2-stats-chart--radar {
    max-width: 460px;
}

.cs2-stats-chart--radar canvas {
    cursor: default;
}

.cs2-stats-chart canvas {
    width: 100% !important;
    height: 340px !important;
}

.cs2-stats-chart--radar-compact {
    min-height: 0;
    max-width: none;
}

.cs2-stats-chart--radar-compact canvas {
    width: 100% !important;
    height: 100% !important;
}

.cs2-stats-dossier + .cs2-stats-path {
    margin-top: 1.35rem;
}

.cs2-stats-tab-lead {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.65rem 1.4rem;
    margin: 0 0 0.1rem;
    padding: 0.1rem 0 0.95rem;
    border-bottom: 1px solid var(--cs2-line);
}

.cs2-stats-tab-lead-label {
    font-family: var(--glhf-font-heading);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--cs2-quiet);
}

.cs2-stats-tab-lead .cs2-stats-ext {
    color: var(--cs2-ink);
    font-family: var(--glhf-font-heading);
    font-size: 1.02rem;
    font-weight: 650;
    letter-spacing: -0.015em;
    text-decoration: none;
}

.cs2-stats-tab-lead .cs2-stats-ext:hover {
    color: var(--glhf-accent);
}

.cs2-stats-tab-lead .cs2-stats-form {
    margin-left: auto;
}

.cs2-stats-tab-lead:not(:has(.cs2-stats-ext)) {
    justify-content: flex-start;
    gap: 0.85rem 1rem;
}

.cs2-stats-tab-lead:not(:has(.cs2-stats-ext)) .cs2-stats-form {
    margin-left: 0;
}

.cs2-stats-form {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.cs2-stats-form li {
    display: grid;
    place-items: center;
    width: 1.35rem;
    height: 1.35rem;
    border-radius: 5px;
    font-family: var(--glhf-font-heading);
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.04em;
}

.cs2-stats-form .is-win {
    background: rgba(0, 255, 100, 0.14);
    color: #5dff9a;
}

.cs2-stats-form .is-loss {
    background: rgba(255, 82, 82, 0.14);
    color: #ff5252;
}

.cs2-stats-form .is-tie {
    background: rgba(156, 168, 180, 0.14);
    color: #c5ced6;
}

.cs2-stats-panel-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.cs2-stats-panel-head h2 {
    margin: 0;
}

.cs2-stats-panel-head p {
    margin: 0;
    color: var(--cs2-quiet);
    font-variant-numeric: tabular-nums;
}

.cs2-stats-elo-delta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: max-content;
    min-height: 1.15rem;
    margin: 0;
    padding: 0.12rem 0.4rem;
    border-radius: 999px;
    font-family: var(--glhf-font-heading);
    font-size: 0.72rem;
    font-weight: 800;
    font-style: normal;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.02em;
    line-height: 1;
    white-space: nowrap;
}

.cs2-tip {
    position: relative;
}

.cs2-stats-match dt.cs2-tip {
    width: max-content;
    cursor: help;
    border-bottom: 1px dotted rgba(255, 255, 255, 0.22);
}

.cs2-tip::after,
.cs2-tip::before {
    position: absolute;
    left: 50%;
    z-index: 8;
    opacity: 0;
    pointer-events: none;
    transform: translate(-50%, 4px);
    transition: opacity 140ms ease, transform 140ms ease;
}

.cs2-tip::after {
    bottom: calc(100% + 8px);
    width: max-content;
    max-width: 13.5rem;
    padding: 0.42rem 0.58rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 9px;
    background: rgba(10, 14, 18, 0.96);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.35);
    color: #e8eef4;
    content: attr(data-tip);
    font-family: var(--glhf-font-body, inherit);
    font-size: 0.72rem;
    font-weight: 500;
    font-style: normal;
    letter-spacing: 0.01em;
    line-height: 1.35;
    text-transform: none;
    text-align: left;
    white-space: normal;
}

.cs2-stats-tile.cs2-tip::after {
    max-width: 16.5rem;
}

.cs2-stats-rail.cs2-tip::after,
.cs2-stats-sheet-mark.cs2-tip::after {
    max-width: 22rem;
}

.cs2-tip::before {
    bottom: calc(100% + 3px);
    width: 8px;
    height: 8px;
    border-right: 1px solid rgba(255, 255, 255, 0.1);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(10, 14, 18, 0.96);
    content: "";
    transform: translate(-50%, 4px) rotate(45deg);
}

.cs2-tip[data-tip-align="start"]::after,
.cs2-stats-match-stats > div:first-child .cs2-tip::after {
    left: 0;
    transform: translate(0, 4px);
}

.cs2-tip[data-tip-align="start"]::before,
.cs2-stats-match-stats > div:first-child .cs2-tip::before {
    left: 12px;
    transform: translate(0, 4px) rotate(45deg);
}

.cs2-tip[data-tip-align="end"]::after,
.cs2-stats-match-stats > div:last-child .cs2-tip::after,
.cs2-stats-match-aside .cs2-tip::after {
    left: auto;
    right: 0;
    transform: translate(0, 4px);
}

.cs2-tip[data-tip-align="end"]::before,
.cs2-stats-match-stats > div:last-child .cs2-tip::before,
.cs2-stats-match-aside .cs2-tip::before {
    left: auto;
    right: 12px;
    transform: translate(0, 4px) rotate(45deg);
}

@media (hover: hover) and (pointer: fine) {
    .cs2-tip:hover::after,
    .cs2-tip:focus-visible::after {
        opacity: 1;
        transform: translate(-50%, 0);
    }

    .cs2-tip:hover::before,
    .cs2-tip:focus-visible::before {
        opacity: 1;
        transform: translate(-50%, 0) rotate(45deg);
    }

    .cs2-tip[data-tip-align="start"]:hover::after,
    .cs2-tip[data-tip-align="start"]:focus-visible::after,
    .cs2-tip[data-tip-align="end"]:hover::after,
    .cs2-tip[data-tip-align="end"]:focus-visible::after,
    .cs2-stats-match-stats > div:first-child .cs2-tip:hover::after,
    .cs2-stats-match-stats > div:first-child .cs2-tip:focus-visible::after,
    .cs2-stats-match-stats > div:last-child .cs2-tip:hover::after,
    .cs2-stats-match-stats > div:last-child .cs2-tip:focus-visible::after,
    .cs2-stats-match-aside .cs2-tip:hover::after,
    .cs2-stats-match-aside .cs2-tip:focus-visible::after {
        transform: translate(0, 0);
    }

    .cs2-tip[data-tip-align="start"]:hover::before,
    .cs2-tip[data-tip-align="start"]:focus-visible::before,
    .cs2-tip[data-tip-align="end"]:hover::before,
    .cs2-tip[data-tip-align="end"]:focus-visible::before,
    .cs2-stats-match-stats > div:first-child .cs2-tip:hover::before,
    .cs2-stats-match-stats > div:first-child .cs2-tip:focus-visible::before,
    .cs2-stats-match-stats > div:last-child .cs2-tip:hover::before,
    .cs2-stats-match-stats > div:last-child .cs2-tip:focus-visible::before,
    .cs2-stats-match-aside .cs2-tip:hover::before,
    .cs2-stats-match-aside .cs2-tip:focus-visible::before {
        transform: translate(0, 0) rotate(45deg);
    }
}

.cs2-stats-elo-delta.is-up {
    color: #7dffb0;
    background: rgba(0, 255, 100, 0.16);
}

.cs2-stats-elo-delta.is-down {
    color: #ff9a9a;
    background: rgba(255, 86, 86, 0.16);
}

.cs2-stats-elo-delta.is-flat {
    color: var(--cs2-quiet);
    background: rgba(255, 255, 255, 0.06);
}

a.cs2-stats-match {
    color: inherit;
    text-decoration: none;
}

a.cs2-stats-match:hover,
a.cs2-stats-match:focus-visible {
    background: rgba(255, 255, 255, 0.05);
    border-color: rgba(255, 255, 255, 0.12);
}

a.cs2-stats-match--win:hover,
a.cs2-stats-match--win:focus-visible {
    background: var(--cs2-win-hover);
    border-color: var(--cs2-win-hover-line);
}

a.cs2-stats-match--loss:hover,
a.cs2-stats-match--loss:focus-visible {
    background: var(--cs2-loss-hover);
    border-color: var(--cs2-loss-hover-line);
}

a.cs2-stats-match--tie:hover,
a.cs2-stats-match--tie:focus-visible {
    background: var(--cs2-tie-hover);
    border-color: var(--cs2-tie-hover-line);
}

a.cs2-stats-match:focus-visible {
    outline: 2px solid rgba(var(--cs2-match-rgb), 0.5);
    outline-offset: 2px;
}

.cs2-stats-tiles + .cs2-stats-grid,
.cs2-stats-tab-lead + .cs2-stats-grid,
.cs2-stats-tab-lead + .cs2-stats-surface {
    margin-top: 1.75rem;
}

.cs2-stats-trend-note {
    margin: 0 0 0.75rem;
    color: var(--cs2-quiet);
    font-variant-numeric: tabular-nums;
}

.cs2-stats-path {
    --cs2-path: #00ff64;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.cs2-stats-path-head {
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
    margin-bottom: 0.85rem;
}

.cs2-stats-path-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.85rem 1.25rem;
}

.cs2-stats-path-row h2 {
    margin: 0;
}

.cs2-stats-path-row--sub {
    align-items: center;
    min-height: 2rem;
}

.cs2-stats-path-tabs {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 3px;
    padding: 3px;
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.035);
}

.cs2-stats-path-tabs button {
    min-height: 30px;
    padding: 0 0.85rem;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--cs2-quiet);
    font: inherit;
    font-size: 0.78rem;
    letter-spacing: 0.01em;
    cursor: pointer;
}

.cs2-stats-path-tabs button.is-active {
    background: color-mix(in srgb, var(--cs2-path) 18%, rgba(255, 255, 255, 0.04));
    color: var(--cs2-ink);
}

.cs2-stats-path-now-row {
    display: flex;
    align-items: baseline;
    justify-content: flex-end;
    gap: 0.55rem;
}

.cs2-stats-path-now-row b {
    font-family: var(--glhf-font-heading);
    font-size: clamp(2.05rem, 3.6vw, 2.75rem);
    font-weight: 700;
    line-height: 0.9;
    letter-spacing: -0.045em;
    font-variant-numeric: tabular-nums;
    color: var(--cs2-ink);
}

.cs2-stats-path-meta {
    margin: 0;
    color: var(--cs2-quiet);
    font-size: 0.78rem;
    letter-spacing: 0.01em;
    font-variant-numeric: tabular-nums;
    text-align: right;
}

.cs2-stats-path-stage {
    position: relative;
    height: 228px;
    min-height: 228px;
    padding: 6px 4px 2px;
    border-radius: 16px;
    background:
        radial-gradient(120% 90% at 50% 0%, color-mix(in srgb, var(--cs2-path) 14%, transparent), transparent 58%),
        rgba(0, 0, 0, 0.2);
}

.cs2-stats-path-stage canvas {
    width: 100% !important;
    height: 216px !important;
}

.cs2-stats-path-bounds {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    margin: 0.85rem 0 0;
    padding-top: 0.75rem;
    border-top: 1px solid var(--cs2-line);
}

.cs2-stats-path-bounds div { min-width: 0; }
.cs2-stats-path-bounds dt {
    color: var(--cs2-quiet);
    font-size: 0.66rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}
.cs2-stats-path-bounds dd {
    margin: 0.15rem 0 0;
    font-family: var(--glhf-font-heading);
    font-size: 1.05rem;
    font-weight: 650;
    letter-spacing: -0.02em;
    font-variant-numeric: tabular-nums;
}

.cs2-stats-path-bounds div:last-child {
    text-align: right;
}

.cs2-stats-ext {
    color: var(--cs2-quiet);
    text-decoration: none;
}

.cs2-stats-ext:hover {
    color: var(--glhf-accent);
}

.cs2-stats-rank-badge--solo {
    margin: 0 0 1.25rem;
}

.cs2-stats-table-wrap {
    overflow-x: auto;
    margin-top: 1.5rem;
}

.cs2-stats-table {
    width: 100%;
    border-collapse: collapse;
    font-variant-numeric: tabular-nums;
}

.cs2-stats-table th,
.cs2-stats-table td {
    padding: 0.85rem 0.75rem 0.85rem 0;
    border-bottom: 1px solid var(--cs2-line);
    text-align: left;
    white-space: nowrap;
}

.cs2-stats-table th {
    color: var(--cs2-quiet);
    font-family: var(--glhf-font-heading);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.cs2-stats-table td:first-child {
    color: var(--cs2-ink);
}

.cs2-stats-section > .cs2-stats-surface + .cs2-stats-surface,
.cs2-stats-section > .cs2-stats-tiles + .cs2-stats-surface,
.cs2-stats-section > .cs2-stats-grid + .cs2-stats-surface,
.cs2-stats-section > .cs2-stats-surface + .cs2-stats-table-wrap,
.cs2-stats-tiles + .cs2-stats-panel,
.cs2-stats-panel + .cs2-stats-table-wrap {
    margin-top: 1.75rem;
}

.cs2-stats-rivals {
    list-style: none;
    margin: 0;
    padding: 0;
}

.cs2-stats-rivals li {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding: 0.8rem 0;
    border-bottom: 1px solid var(--cs2-line);
}

.cs2-stats-rivals strong {
    font-variant-numeric: tabular-nums;
}

.cs2-stats-cups-block > h2.cs2-stats-kicker {
    margin: 0 0 0.78rem;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--cs2-quiet);
}

.cs2-stats-cups {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(22rem, 100%), 1fr));
    gap: 0.85rem;
}

.cs2-stats-cups > .cs2-stats-cup:only-child {
    grid-column: 1 / -1;
    max-width: 34rem;
}

.cs2-stats-cup {
    --cs2-cup-rgb: 255, 255, 255;
    container-type: inline-size;
    container-name: cs2-cup;
    position: relative;
    z-index: 0;
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    min-width: 0;
    padding: 0.95rem 1.05rem 0.9rem;
    color: inherit;
    text-decoration: none;
    border: 1px solid rgba(var(--cs2-cup-rgb), 0.08);
    border-radius: 16px;
    background: rgba(var(--cs2-cup-rgb), 0.03);
    transition: border-color 160ms ease, background-color 160ms ease;
}

.cs2-stats-cup:hover,
.cs2-stats-cup:focus-visible {
    z-index: 4;
    border-color: rgba(var(--cs2-tourney-rgb), 0.32);
    background:
        linear-gradient(180deg, rgba(var(--cs2-tourney-rgb), 0.07), transparent 58%),
        rgba(14, 18, 24, 0.72);
}

.cs2-stats-cup:focus-visible {
    outline: 2px solid rgba(var(--cs2-tourney-rgb), 0.55);
    outline-offset: 2px;
}

.cs2-stats-cup.is-win {
    --cs2-cup-rgb: var(--cs2-win-rgb);
    background: var(--cs2-win-fill);
    border-color: var(--cs2-win-line);
}

.cs2-stats-cup.is-loss {
    --cs2-cup-rgb: var(--cs2-loss-rgb);
    background: var(--cs2-loss-fill);
    border-color: var(--cs2-loss-line);
}

.cs2-stats-cup.is-tie {
    --cs2-cup-rgb: var(--cs2-tie-rgb);
    background: var(--cs2-tie-fill);
    border-color: var(--cs2-tie-line);
}

.cs2-stats-cup-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    column-gap: 0.9rem;
    min-width: 0;
}

.cs2-stats-cup-copy {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    column-gap: 0.55rem;
    row-gap: 0.2rem;
    min-width: 0;
}

.cs2-stats-cup-copy > .cs2-stats-wl {
    grid-column: 1;
    grid-row: 1;
}

.cs2-stats-cup-copy > strong {
    overflow: hidden;
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
    color: var(--cs2-ink);
    font-family: var(--glhf-font-heading);
    font-size: 1.08rem;
    font-weight: 650;
    letter-spacing: -0.02em;
    line-height: 1.15;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cs2-stats-cup-copy > strong:first-child {
    grid-column: 1 / -1;
}

.cs2-stats-cup.is-win .cs2-stats-wl {
    background: rgba(0, 255, 100, 0.2);
    color: #7dffb0;
}

.cs2-stats-cup.is-loss .cs2-stats-wl {
    background: rgba(255, 86, 86, 0.2);
    color: #ff9a9a;
}

.cs2-stats-cup.is-tie .cs2-stats-wl {
    background: rgba(156, 168, 180, 0.16);
    color: #c5ced6;
}

.cs2-stats-cup-score {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.22rem;
    margin: 0;
    text-align: right;
}

.cs2-stats-cup-score strong {
    display: block;
    font-family: var(--glhf-font-heading);
    font-size: 2.05rem;
    font-weight: 700;
    line-height: 0.86;
    letter-spacing: -0.045em;
    font-variant-numeric: tabular-nums;
    color: var(--cs2-ink);
    white-space: nowrap;
}

.cs2-stats-cup-score.is-range strong {
    font-size: 1.62rem;
    letter-spacing: -0.03em;
}

.cs2-stats-cup-score span {
    color: var(--cs2-quiet);
    font-family: var(--glhf-font-heading);
    font-size: 0.58rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    line-height: 1;
    text-transform: uppercase;
}

.cs2-stats-cup.is-win .cs2-stats-cup-score strong {
    color: var(--cs2-tourney);
}

.cs2-stats-cup.is-win .cs2-stats-cup-score span {
    color: rgba(var(--cs2-tourney-rgb), 0.72);
}

.cs2-stats-cup.is-loss .cs2-stats-cup-score strong {
    color: #d89a9a;
}

.cs2-stats-cup.is-loss .cs2-stats-cup-score span {
    color: rgba(216, 154, 154, 0.72);
}

.cs2-stats-cup.is-tie .cs2-stats-cup-score strong {
    color: #c5ced6;
}

.cs2-stats-cup-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    grid-column: 1 / -1;
    gap: 0.18rem 0.7rem;
    min-width: 0;
    margin: 0;
    color: var(--cs2-quiet);
    font-size: 0.8rem;
    line-height: 1.3;
}

.cs2-stats-cup-meta span {
    overflow: hidden;
    min-width: 0;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cs2-stats-cup-meta time {
    flex: 0 0 auto;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.02em;
    white-space: nowrap;
}

.cs2-stats-cup-meta span + time {
    padding-left: 0.68rem;
    border-left: 1px solid rgba(255, 255, 255, 0.16);
}

.cs2-stats-cup-stats {
    display: grid;
    grid-template-columns: repeat(var(--cs2-cup-n, 4), minmax(0, 1fr));
    gap: 0;
    margin: 0;
    padding: 0.78rem 0 0;
    border-top: 1px solid var(--cs2-line);
}

.cs2-stats-cup-stats[data-n="5"] {
    --cs2-cup-n: 5;
    grid-template-columns: minmax(2.7rem, 0.76fr) minmax(4.4rem, 1.22fr) minmax(2.3rem, 0.76fr) minmax(2.3rem, 0.76fr) minmax(3.9rem, 1.16fr);
}

.cs2-stats-cup-stats[data-n="5"] > div {
    padding: 0 0.42rem;
}

.cs2-stats-cup-stats[data-n="5"] dt {
    font-size: 0.58rem;
    letter-spacing: 0.04em;
}

.cs2-stats-cup-stats[data-n="6"] {
    --cs2-cup-n: 6;
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

.cs2-stats-cup-stats[data-n="6"] > div {
    padding: 0 0.36rem;
}

.cs2-stats-cup-stats[data-n="6"] dt {
    font-size: 0.56rem;
    letter-spacing: 0.03em;
}

.cs2-stats-cup-stats > div {
    min-width: 0;
    padding: 0 0.7rem;
    border-left: 1px solid var(--cs2-line);
}

.cs2-stats-cup-stats > div:first-child {
    padding-left: 0;
    border-left: 0;
}

.cs2-stats-cup-stats > div:last-child {
    padding-right: 0;
}

.cs2-stats-cup-stats dt {
    overflow: hidden;
    color: var(--cs2-quiet);
    font-family: var(--glhf-font-heading);
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    line-height: 1;
    text-transform: uppercase;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cs2-stats-cup-stats dd {
    margin: 0.32rem 0 0;
    color: var(--cs2-ink);
    font-family: var(--glhf-font-heading);
    font-size: 1.16rem;
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}

.cs2-stats-cup-stats dd i {
    font-style: normal;
    font-weight: 600;
    margin: 0 0.04em;
    color: rgba(255, 255, 255, 0.28);
}

@container cs2-cup (max-width: 24rem) {
    .cs2-stats-cup-score strong {
        font-size: 1.82rem;
    }

    .cs2-stats-cup-score.is-range strong {
        font-size: 1.42rem;
    }

    .cs2-stats-cup-meta span + time {
        padding-left: 0;
        border-left: 0;
    }

    .cs2-stats-cup-stats > div,
    .cs2-stats-cup-stats[data-n="5"] > div,
    .cs2-stats-cup-stats[data-n="6"] > div {
        padding: 0 0.3rem;
    }

    .cs2-stats-cup-stats dt,
    .cs2-stats-cup-stats[data-n="5"] dt,
    .cs2-stats-cup-stats[data-n="6"] dt {
        font-size: 0.56rem;
        letter-spacing: 0.02em;
    }

    .cs2-stats-cup-stats dd {
        font-size: 1.06rem;
    }
}

.cs2-stats-cup-maps {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.cs2-stats-cup-maps li {
    padding: 0.18rem 0.52rem;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 999px;
    color: var(--cs2-quiet);
    font-family: var(--glhf-font-heading);
    font-size: 0.68rem;
    font-weight: 650;
    letter-spacing: 0.03em;
}

.cs2-stats-main,
.cs2-stats-account {
    position: relative;
    min-width: 0;
}

.cs2-stats-account {
    container-type: inline-size;
    container-name: cs2-account;
}

@container cs2-account (min-width: 42rem) {
    .cs2-stats-people-split:has(> :last-child:nth-child(2)) {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@container cs2-account (min-width: 60rem) {
    .cs2-stats-people-split:has(> :nth-child(3)) {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .cs2-stats-people-split:has(> :nth-child(3)) .cs2-stats-people-panel h2 {
        min-height: 2.55rem;
    }
}

.cs2-stats.is-swapping .cs2-stats-account {
    overflow: hidden;
}

.cs2-stats.is-swapping .cs2-stats-account > .cs2-stats-section:not(.is-leave):not(.is-arrive) {
    display: none;
}

.cs2-stats.is-boot .cs2-stats-mast-portrait,
.cs2-stats.is-boot .cs2-stats-mast-plate,
.cs2-stats.is-boot .cs2-stats-nav,
.cs2-stats.is-boot .cs2-stats-section:not([hidden]) > *,
.cs2-stats.is-boot .cs2-stats-overview-split > *,
.cs2-stats.is-boot .cs2-stats-grid > *,
.cs2-stats.is-boot .cs2-stats-split > *,
.cs2-stats.is-boot .cs2-stats-people-split > * {
    opacity: 0;
}

.cs2-stats.is-ready .cs2-stats-mast-portrait,
.cs2-stats.is-ready .cs2-stats-mast-plate,
.cs2-stats.is-ready .cs2-stats-nav,
.cs2-stats.is-ready .cs2-stats-section:not([hidden]) > *,
.cs2-stats.is-ready .cs2-stats-overview-split > *,
.cs2-stats.is-ready .cs2-stats-grid > *,
.cs2-stats.is-ready .cs2-stats-split > *,
.cs2-stats.is-ready .cs2-stats-people-split > * {
    opacity: 1;
    transform: none;
}

.cs2-stats.is-first .cs2-enter {
    will-change: transform, opacity;
}

.cs2-stats.is-ready.is-first .cs2-enter {
    animation: cs2-enter-block var(--cs2-enter) var(--cs2-enter-ease) both;
    animation-delay: calc(var(--cs2-enter-lead) + (var(--cs2-enter-i, 0) * var(--cs2-enter-step)));
}

.cs2-stats.is-ready.is-first .cs2-enter.cs2-stats-mast-portrait {
    animation-name: cs2-enter-portrait;
}

.cs2-stats.is-ready .cs2-stats-mast-glow {
    animation: cs2-enter-glow 1.35s var(--cs2-enter-ease) 140ms both;
}

.cs2-stats.is-ready .cs2-stats-mast-title h1::after {
    animation: cs2-enter-rule 820ms var(--cs2-enter-ease) 240ms both;
}

.cs2-stats-rail:nth-child(1) { --cs2-rail-i: 0; }
.cs2-stats-rail:nth-child(2) { --cs2-rail-i: 1; }
.cs2-stats-rail:nth-child(3) { --cs2-rail-i: 2; }
.cs2-stats-rail:nth-child(4) { --cs2-rail-i: 3; }
.cs2-stats-rail:nth-child(5) { --cs2-rail-i: 4; }
.cs2-stats-rail:nth-child(6) { --cs2-rail-i: 5; }
.cs2-stats-rail:nth-child(7) { --cs2-rail-i: 6; }
.cs2-stats-rail:nth-child(8) { --cs2-rail-i: 7; }

.cs2-stats-weapon:nth-child(1) { --cs2-rail-i: 0; }
.cs2-stats-weapon:nth-child(2) { --cs2-rail-i: 1; }
.cs2-stats-weapon:nth-child(3) { --cs2-rail-i: 2; }
.cs2-stats-weapon:nth-child(4) { --cs2-rail-i: 3; }
.cs2-stats-weapon:nth-child(5) { --cs2-rail-i: 4; }
.cs2-stats-weapon:nth-child(6) { --cs2-rail-i: 5; }
.cs2-stats-weapon:nth-child(7) { --cs2-rail-i: 6; }
.cs2-stats-weapon:nth-child(8) { --cs2-rail-i: 7; }
.cs2-stats-weapon:nth-child(9) { --cs2-rail-i: 8; }
.cs2-stats-weapon:nth-child(10) { --cs2-rail-i: 9; }

.cs2-stats-section.is-filling .cs2-stats-rail-track i,
.cs2-stats-section.is-filling .cs2-stats-weapon-track span {
    animation: cs2-rail-fill var(--cs2-fill) var(--cs2-fill-ease) both;
    animation-delay: calc(var(--cs2-fill-lead) + (var(--cs2-rail-i, 0) * var(--cs2-fill-stagger)));
}

.cs2-stats-auth {
    animation: cs2-enter-rise 760ms var(--cs2-ease) both;
}

.cs2-stats-section.is-leave,
.cs2-stats-section.is-arrive {
    will-change: transform, opacity;
}

.cs2-stats-section.is-leave {
    position: absolute;
    inset-inline: 0;
    top: 0;
    z-index: 1;
    pointer-events: none;
}

.cs2-stats-section.is-arrive {
    position: relative;
    z-index: 2;
}

.cs2-stats-section.is-leave[data-dir="fwd"] {
    animation: cs2-leave-fwd var(--cs2-swap) var(--cs2-ease) both;
}

.cs2-stats-section.is-leave[data-dir="back"] {
    animation: cs2-leave-back var(--cs2-swap) var(--cs2-ease) both;
}

.cs2-stats-section.is-arrive[data-dir="fwd"] {
    animation: cs2-arrive-fwd 540ms var(--cs2-ease) both;
}

.cs2-stats-section.is-arrive[data-dir="back"] {
    animation: cs2-arrive-back 540ms var(--cs2-ease) both;
}

@keyframes cs2-enter-portrait {
    from {
        opacity: 0;
        transform: translateY(18px) scale(0.97);
    }
    to {
        opacity: 1;
        transform: none;
    }
}

@keyframes cs2-enter-block {
    from {
        opacity: 0;
        transform: translateY(22px);
    }
    to {
        opacity: 1;
        transform: none;
    }
}

@keyframes cs2-enter-rise {
    from {
        opacity: 0;
        transform: translateY(16px);
    }
    to {
        opacity: 1;
        transform: none;
    }
}

@keyframes cs2-enter-glow {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes cs2-enter-rule {
    from {
        transform: scaleX(0);
        opacity: 0;
    }
    to {
        transform: none;
        opacity: 1;
    }
}

@keyframes cs2-radar-halo {
    from {
        opacity: 0;
        transform: scale(0.58);
    }
    to {
        opacity: 0.72;
        transform: none;
    }
}

@keyframes cs2-rail-fill {
    from { transform: scaleX(0); }
    to { transform: scaleX(1); }
}

@keyframes cs2-leave-fwd {
    from {
        opacity: 1;
        transform: none;
    }
    to {
        opacity: 0;
        transform: translateY(var(--cs2-swap-away)) scale(0.992);
    }
}

@keyframes cs2-leave-back {
    from {
        opacity: 1;
        transform: none;
    }
    to {
        opacity: 0;
        transform: translateY(12px) scale(0.992);
    }
}

@keyframes cs2-arrive-fwd {
    from {
        opacity: 0;
        transform: translateY(var(--cs2-swap-in));
    }
    to {
        opacity: 1;
        transform: none;
    }
}

@keyframes cs2-arrive-back {
    from {
        opacity: 0;
        transform: translateY(-16px);
    }
    to {
        opacity: 1;
        transform: none;
    }
}

@media (max-width: 900px) {
    .cs2-stats {
        --cs2-mast-face: 84px;
        --cs2-mast-inset: 1.15rem;
        --cs2-mast-gap: 0.9rem;
        --cs2-swap-away: -8px;
        --cs2-swap-in: 16px;
    }

    .page-content.cs2-stats {
        padding-top: calc(var(--glhf-header-height) + 16px);
    }

    .cs2-stats-mast {
        margin-bottom: 1.15rem;
    }

    .cs2-stats-mast-top {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 0;
    }

    .cs2-stats-mast-portrait,
    .cs2-stats-mast-plate {
        grid-area: 1 / 1;
    }

    .cs2-stats-mast-portrait {
        z-index: 2;
        align-self: start;
        justify-self: start;
        width: var(--cs2-mast-face);
        height: var(--cs2-mast-face);
        min-height: var(--cs2-mast-face);
        margin: var(--cs2-mast-inset) 0 0 var(--cs2-mast-inset);
        overflow: hidden;
        border-radius: 18px;
        box-shadow:
            0 0 0 1px rgba(255, 255, 255, 0.06),
            0 8px 18px rgba(0, 0, 0, 0.32);
    }

    .cs2-stats-mast-portrait img,
    .cs2-stats-mast-monogram {
        border-radius: 16px;
    }

    .cs2-stats-mast-plate {
        z-index: 1;
        min-height: calc(var(--cs2-mast-face) + (var(--cs2-mast-inset) * 2));
        padding: var(--cs2-mast-inset) 1.2rem 1.1rem calc(var(--cs2-mast-inset) + var(--cs2-mast-face) + var(--cs2-mast-gap));
        border-radius: 24px;
    }

    .cs2-stats-mast-plate:has(.cs2-stats-search.is-open) {
        z-index: 30;
    }

    .cs2-stats-mast-head {
        flex-direction: column;
        align-items: stretch;
        gap: 0.85rem;
    }

    .cs2-stats-mast-title {
        display: flex;
        flex-direction: column;
        justify-content: center;
        min-height: var(--cs2-mast-face);
    }

    .cs2-stats-mast h1 {
        font-size: clamp(1.45rem, 4.6vw, 2rem);
        overflow-wrap: anywhere;
    }

    .cs2-stats-search--mast,
    .cs2-stats-search--gate,
    .cs2-stats-mast-account {
        flex: 0 0 auto;
        width: calc(100% + var(--cs2-mast-face) + var(--cs2-mast-gap));
        max-width: none;
        margin-left: calc(-1 * (var(--cs2-mast-face) + var(--cs2-mast-gap)));
    }

    .cs2-stats-search--mast,
    .cs2-stats-search--gate {
        margin-top: 0;
    }

    .cs2-stats-ranks.cs2-stats-mast-medals {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 0;
        margin-top: 0.95rem;
        padding-top: 0.9rem;
    }

    .cs2-stats-mast-medals .cs2-stats-rank {
        min-width: 0;
        padding: 0 0.75rem 0 0;
        --cs2-medal-well: 2.7rem;
    }

    .cs2-stats-mast-medals .cs2-stats-rank + .cs2-stats-rank {
        padding-left: 0.75rem;
    }

    .cs2-stats-mast-medals .faceit-elo-value,
    .cs2-stats-mast-medals .glr-side b {
        font-size: 1.5rem;
    }

    .cs2-stats-mast-medals .faceit-elo-level {
        height: 2.7rem;
        max-height: 2.7rem;
    }

    .cs2-stats-mast-medals .cs2-stats-updated {
        grid-column: 1 / -1;
        grid-row: auto;
        align-self: start;
        justify-self: end;
        max-width: 100%;
        margin-top: 0.2rem;
        padding: 0.7rem 0 0;
        white-space: normal;
        text-align: right;
    }

    .cs2-stats-layout {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 0;
    }

    .cs2-stats-nav {
        position: sticky;
        top: calc(var(--glhf-header-height) + 8px);
        z-index: 20;
        flex-direction: row;
        flex-wrap: nowrap;
        gap: 2px;
        width: 100%;
        margin: 0 0 1.2rem;
        padding: 4px;
        overflow-x: auto;
        overscroll-behavior-x: contain;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        border: 1px solid rgba(255, 255, 255, 0.08);
        border-radius: 16px;
        background: rgba(8, 11, 15, 0.94);
        backdrop-filter: blur(18px);
        -webkit-backdrop-filter: blur(18px);
        box-shadow: 0 12px 28px rgba(0, 0, 0, 0.22);
    }

    .cs2-stats-nav::-webkit-scrollbar {
        display: none;
    }

    .cs2-stats-nav-btn {
        flex: 1 1 0;
        width: auto;
        min-width: 0;
        min-height: 42px;
        padding: 0 0.45rem;
        justify-content: center;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        text-align: center;
        border-radius: 12px;
        font-size: 0.86rem;
        letter-spacing: -0.015em;
    }

    .cs2-stats-nav-btn[hidden] {
        display: none;
    }

    .cs2-stats-nav-thumb {
        background:
            linear-gradient(180deg, rgba(255, 255, 255, 0.06), transparent 50%),
            rgba(255, 255, 255, 0.08);
        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06);
    }

    .cs2-stats-nav-btn.is-active,
    .cs2-stats-nav-btn.is-active:hover {
        color: var(--cs2-ink);
        background: transparent;
        box-shadow: none;
    }

    .cs2-stats-nav-btn:focus-visible {
        outline: 2px solid rgba(var(--glhf-accent-rgb), 0.5);
        outline-offset: 1px;
    }

    .cs2-stats-overview-split,
    .cs2-stats-ranks:not(.cs2-stats-mast-medals) {
        grid-template-columns: 1fr;
        display: grid;
    }

    .cs2-stats-grid,
    .cs2-stats-split {
        gap: 1.2rem 1.4rem;
    }

    .cs2-stats-dossier.cs2-stats-surface {
        padding: 1.15rem 1.1rem 1.05rem;
    }

    .cs2-stats-style {
        align-items: flex-start;
        gap: 0.45rem 1rem;
    }

    .cs2-stats-mast-sign {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.18rem;
    }

    .cs2-stats-mast-sign > * + *::before {
        content: none;
        margin: 0;
    }

    .cs2-stats-mast-sign .cs2-stats-tempo,
    .cs2-stats-mast-role {
        font-size: clamp(1.18rem, 3.2vw, 1.48rem);
    }

    .cs2-stats-style-meta {
        text-align: left;
    }

    .cs2-stats-dossier-body {
        grid-template-columns: 210px minmax(0, 1fr);
        align-items: start;
        gap: 1.1rem 1.45rem;
        padding-inline: 0;
    }

    .cs2-stats-dossier-radar {
        width: 210px;
        max-width: 100%;
        height: auto;
    }

    .cs2-stats-dossier-extra {
        width: 100%;
    }

    .cs2-stats-dossier-extra .cs2-stats-rail {
        grid-template-columns: max-content minmax(0, 1fr) minmax(2.7rem, auto);
        column-gap: 0.7rem;
    }

    .cs2-stats-maplab-head {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.7rem;
    }

    .cs2-stats-maplab-body {
        display: block;
    }

    .cs2-stats-maplab-body .cs2-stats-chart {
        margin-bottom: 0.4rem;
    }

    .cs2-stats-figure dd {
        white-space: normal;
    }

    .cs2-stats-standing {
        flex-wrap: wrap;
        align-items: center;
    }

    .cs2-stats-ranks:not(.cs2-stats-mast-medals) .cs2-stats-rank + .cs2-stats-rank,
    .cs2-stats-tile + .cs2-stats-tile {
        padding-left: 0;
        border-top: 1px solid var(--cs2-line);
    }

    .cs2-stats-ranks:not(.cs2-stats-mast-medals) .cs2-stats-rank + .cs2-stats-rank::before,
    .cs2-stats-tile + .cs2-stats-tile::before {
        display: none;
    }

    .cs2-stats-path-row,
    .cs2-stats-path-row--sub,
    .cs2-stats-path-now-row {
        flex-wrap: wrap;
    }

    .cs2-stats-path-meta,
    .cs2-stats-path-bounds div:last-child {
        text-align: left;
    }

    .cs2-stats-surface {
        padding: 1.2rem 1.15rem 1.05rem;
        border-radius: 20px;
    }
}

@media (max-width: 640px) {
    .cs2-stats {
        --cs2-mast-face: 68px;
        --cs2-mast-inset: 1rem;
        --cs2-mast-gap: 0.8rem;
        --cs-mark-h: 2.15rem;
    }

    .cs2-stats-mast-portrait {
        border-radius: 18px;
    }

    .cs2-stats-mast-portrait img,
    .cs2-stats-mast-monogram {
        border-radius: 14px;
    }

    .cs2-stats-mast-monogram {
        font-size: 1.85rem;
    }

    .cs2-stats-mast-plate {
        padding-right: 1rem;
        padding-bottom: 1rem;
    }

    .cs2-stats-mast-medals .cs2-stats-rank {
        padding-right: 0.55rem;
        --cs2-medal-well: 2.35rem;
    }

    .cs2-stats-mast-medals .cs2-stats-rank + .cs2-stats-rank {
        padding-left: 0.55rem;
    }

    .cs2-stats-mast-medals .faceit-elo-value,
    .cs2-stats-mast-medals .glr-side b {
        font-size: 1.28rem;
    }

    .cs2-stats-mast-medals .faceit-elo-level {
        height: 2.35rem;
        max-height: 2.35rem;
    }

    .cs2-stats-nav {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        top: calc(var(--glhf-header-height) + 6px);
        border-radius: 14px;
        margin-bottom: 1.05rem;
        overflow: visible;
    }

    .cs2-stats-nav-btn {
        flex: none;
        width: 100%;
        min-height: 38px;
        padding: 0 0.28rem;
        font-size: 0.78rem;
    }

    .cs2-stats-mast-pair {
        flex-direction: column;
        align-items: flex-start;
        flex-wrap: nowrap;
        gap: 0.08rem;
    }

    .cs2-stats-mast-pair > * + *::before {
        content: none;
        margin: 0;
    }

    .cs2-stats-mast-sign .cs2-stats-tempo,
    .cs2-stats-mast-role {
        font-size: clamp(1.22rem, 5.4vw, 1.45rem);
    }

    .cs2-stats-overview-split,
    .cs2-stats-grid,
    .cs2-stats-split,
    .cs2-stats-ranks:not(.cs2-stats-mast-medals) {
        grid-template-columns: 1fr;
        display: grid;
    }

    .cs2-stats-dossier-body {
        grid-template-columns: 1fr;
        justify-items: center;
        gap: 1.05rem;
    }

    .cs2-stats-dossier-radar {
        width: min(200px, 68vw);
    }

    .cs2-stats-dossier-extra .cs2-stats-rail {
        grid-template-columns: max-content minmax(0, 1fr) minmax(2.6rem, auto);
        column-gap: 0.65rem;
    }

    .cs2-stats-sheet-lead {
        flex-direction: column;
        align-items: stretch;
        gap: 1.1rem;
    }

    .cs2-stats-sheet-lead > .cs2-stats-sheet-marks + .cs2-stats-sheet-marks {
        padding: 1.05rem 0 0;
        border-left: 0;
        border-top: 1px solid var(--cs2-line);
    }

    .cs2-stats-sheet-mark strong {
        font-size: clamp(1.7rem, 8vw, 2.15rem);
    }

    .cs2-stats-sheet-band .cs2-stats-rails {
        grid-template-columns: 1fr;
    }

    .cs2-stats-sheet-band .cs2-stats-figures {
        grid-template-columns: 1fr 1fr;
    }

    .cs2-stats-sheet .cs2-stats-rail {
        grid-template-columns: max-content minmax(0, 1fr) minmax(2.7rem, auto);
        column-gap: 0.7rem;
    }

    .cs2-stats-sheet-foot .cs2-stats-figures {
        grid-template-columns: 1fr 1fr;
    }

    .cs2-stats-matches,
    .cs2-stats-weapons {
        grid-template-columns: 1fr;
    }

    .cs2-stats-leader {
        grid-template-columns: 2.15rem minmax(0, 1fr) auto;
        column-gap: 0.62rem;
        min-height: 3.05rem;
        margin-inline: -0.18rem;
        padding: 0.4rem 0.42rem 0.4rem 0.28rem;
        border-radius: 10px;
    }

    .cs2-stats-leader-shot {
        flex-basis: 36px;
        width: 36px;
        height: 36px;
    }

    .cs2-stats-leader-name {
        font-size: 0.96rem;
    }

    .cs2-stats-leader-rating {
        font-size: 0.98rem;
    }

    .cs2-stats-leaders-pager {
        gap: 0.28rem;
    }

    .cs2-stats-maplab-list li {
        grid-template-columns: 76px minmax(0, 1fr) auto;
        gap: 10px;
    }

    .cs2-stats-chart canvas {
        height: 220px !important;
    }

    .cs2-stats-chart {
        min-height: 200px;
    }

    .cs2-stats-medallion {
        width: 84px;
        height: 84px;
    }

    .cs2-stats-tiles {
        grid-template-columns: 1fr 1fr;
    }

    .cs2-stats-tab-lead {
        flex-direction: column;
        align-items: flex-start;
        padding-bottom: 0.85rem;
        gap: 0.5rem;
    }

    .cs2-stats-tab-lead .cs2-stats-form {
        width: 100%;
        min-width: 0;
        margin-left: 0;
    }

    .cs2-stats-panel-head {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.35rem;
    }
}

/* Compare */

.cs2-stats-compare-tools {
    position: relative;
    z-index: 8;
    display: grid;
    grid-template-columns: minmax(180px, 1fr) minmax(240px, 1.15fr) minmax(180px, 1fr);
    align-items: center;
    gap: 8px 20px;
    margin: 0 0 1.25rem;
    padding: 0 28px;
    overflow: visible;
}

.cs2-stats-search--tool,
.cs2-stats-search--stage {
    margin: 0;
    max-width: none;
}

.cs2-stats-search--tool {
    grid-column: 3;
    width: 100%;
}

.cs2-stats-search--stage {
    width: 100%;
    margin-top: 1.15rem;
}

.cs2-stats-compare-swap {
    grid-column: 2;
    justify-self: center;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--cs2-quiet);
    font-family: var(--glhf-font-heading);
    font-size: 0.88rem;
    letter-spacing: 0.04em;
    text-decoration: none;
}

.cs2-stats-compare-swap:hover {
    color: var(--cs2-ink);
}

.cs2-stats-arena {
    --cs-mark-h: 1.7rem;
    position: relative;
    display: grid;
    grid-template-columns: minmax(180px, 1fr) minmax(240px, 1.15fr) minmax(180px, 1fr);
    gap: 8px 20px;
    align-items: center;
    padding: 32px 28px 28px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 28px;
    background:
        radial-gradient(ellipse 42% 80% at 8% 50%, rgba(0, 255, 100, 0.1), transparent 70%),
        radial-gradient(ellipse 42% 80% at 92% 50%, rgba(140, 180, 255, 0.12), transparent 70%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.045), transparent 42%),
        #0c1116;
}

.cs2-stats-arena::before {
    content: "";
    position: absolute;
    inset: 18% 34%;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.06), transparent 68%);
    pointer-events: none;
}

.cs2-stats-arena.is-left {
    box-shadow: inset 3px 0 0 var(--cs2-duel-left);
}

.cs2-stats-arena.is-right {
    box-shadow: inset -3px 0 0 var(--cs2-duel-right);
}

.cs2-stats-arena.is-even {
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.04);
}

.cs2-stats-arena-side,
.cs2-stats-arena-call {
    position: relative;
    z-index: 1;
}

.cs2-stats-arena-side {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    min-width: 0;
    transition: opacity 0.25s ease;
}

.cs2-stats-arena-side.is-right {
    align-items: center;
}

.cs2-stats-arena-side.is-loser {
    opacity: 0.72;
}

.cs2-stats-arena-person {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 0;
}

.cs2-stats-arena-person h2 {
    margin: 0.95rem 0 0;
    font-size: clamp(1.35rem, 2vw, 1.85rem);
    line-height: 1.05;
}

.cs2-stats-arena-person h2 a {
    color: inherit;
    text-decoration: none;
}

.cs2-stats-arena-person h2 a:hover {
    color: var(--glhf-accent);
}

.cs2-stats-arena-person p {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 0.45rem 0.6rem;
    margin: 0.4rem 0 0;
    color: var(--cs2-quiet);
}

.cs2-stats-arena-person p a {
    color: inherit;
    text-decoration: none;
}

.cs2-stats-arena-person p a:hover {
    color: var(--cs2-ink);
}

.cs2-stats-arena .cs2-stats-medallion {
    width: 120px;
    height: 120px;
    text-decoration: none;
}

.cs2-stats-medallion--left {
    background:
        radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.55), transparent 42%),
        conic-gradient(from 200deg, #00ff64, rgba(255, 255, 255, 0.28), rgba(0, 255, 100, 0.05), #00ff64);
}

.cs2-stats-medallion--right {
    background:
        radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.5), transparent 42%),
        conic-gradient(from 200deg, #8cb4ff, rgba(255, 255, 255, 0.3), rgba(140, 180, 255, 0.08), #8cb4ff);
}

.cs2-stats-medallion--ghost {
    background: transparent;
    border: 1px dashed rgba(140, 180, 255, 0.45);
    box-shadow: none;
}

.cs2-stats-arena-side.is-winner .cs2-stats-medallion--left {
    box-shadow: 0 0 0 1px rgba(0, 255, 100, 0.28), 0 0 36px rgba(0, 255, 100, 0.28);
}

.cs2-stats-arena-side.is-winner .cs2-stats-medallion--right {
    box-shadow: 0 0 0 1px rgba(140, 180, 255, 0.35), 0 0 36px rgba(140, 180, 255, 0.28);
}

.cs2-stats-medallion-fallback {
    display: grid;
    place-items: center;
    width: 100%;
    aspect-ratio: 1;
    border-radius: 50%;
    background: #0c1014;
    color: var(--cs2-ink);
    font-family: var(--glhf-font-heading);
    font-size: 2.2rem;
}

.cs2-stats-arena-ranks {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 10px 14px;
    margin-top: 1rem;
}

.cs2-stats-arena-rank {
    display: flex;
    align-items: center;
    gap: 6px;
}

.cs2-stats-arena .faceit-elo-level {
    height: 2.05rem;
    max-height: 2.05rem;
}

.cs2-stats-arena .faceit-elo-value {
    font-size: 1.15rem;
}

.cs2-stats-arena .cs-rating {
    height: var(--cs-mark-h);
}

.cs2-stats-arena .cs-rating-k {
    font-size: 1.1rem;
}

.cs2-stats-arena-rank .glr-mark--compact .glr-side b {
    font-size: 1.15rem;
}

.cs2-stats-arena-call {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    min-width: 0;
    padding: 0 8px;
}

.cs2-stats-arena .cs2-stats-search {
    z-index: 8;
}

.cs2-stats-arena-call .cs2-stats-kicker {
    color: rgba(245, 246, 248, 0.55);
}

.cs2-stats-arena-title {
    margin: 0;
    font-family: var(--glhf-font-heading);
    font-size: clamp(1.7rem, 3.4vw, 3.1rem);
    font-weight: 700;
    line-height: 0.95;
    letter-spacing: -0.04em;
    color: var(--cs2-ink);
}

.cs2-stats-arena.is-left .cs2-stats-arena-title {
    color: var(--cs2-duel-left);
}

.cs2-stats-arena.is-right .cs2-stats-arena-title {
    color: var(--cs2-duel-right);
}

.cs2-stats-arena-score {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 0.35rem 0.55rem;
    margin: 1.05rem 0 0;
    font-family: var(--glhf-font-heading);
    font-variant-numeric: tabular-nums;
    line-height: 0.8;
}

.cs2-stats-arena-score b {
    font-size: clamp(3.2rem, 6vw, 5.2rem);
    font-weight: 700;
    letter-spacing: -0.05em;
}

.cs2-stats-arena-score span {
    color: var(--cs2-quiet);
    font-size: clamp(1.6rem, 3vw, 2.4rem);
}

.cs2-stats-arena-score .is-left {
    color: var(--cs2-duel-left);
}

.cs2-stats-arena-score .is-right {
    color: var(--cs2-duel-right);
}

.cs2-stats-arena.is-wait .cs2-stats-arena-score b,
.cs2-stats-arena.is-even .cs2-stats-arena-score b {
    color: var(--cs2-ink);
}

.cs2-stats-arena-bar {
    position: relative;
    width: min(100%, 340px);
    height: 6px;
    margin: 1.15rem 0 0;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(140, 180, 255, 0.55);
}

.cs2-stats-arena-bar i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: var(--cs2-duel-left);
    transform-origin: left center;
    animation: cs2-rail-fill var(--cs2-fill) var(--cs2-fill-ease) both;
}

.cs2-stats-arena-line {
    max-width: 28rem;
    margin: 0.95rem 0 0;
    color: var(--cs2-quiet);
    font-size: 0.95rem;
    line-height: 1.45;
}

.cs2-stats-arena.is-pick .cs2-stats-arena-title {
    color: var(--cs2-ink);
}

.cs2-stats-arena-side.is-ghost {
    opacity: 0.55;
}

.cs2-stats-compare-styles {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 28px;
    margin: 1.15rem 0 0;
}

.cs2-stats-compare-style {
    padding: 16px 18px 14px;
    border: 1px solid var(--cs2-line);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.025);
}

.cs2-stats-compare-style.is-left {
    box-shadow: inset 3px 0 0 var(--cs2-duel-left);
}

.cs2-stats-compare-style.is-right {
    box-shadow: inset 3px 0 0 var(--cs2-duel-right);
    text-align: right;
}

.cs2-stats-compare-style.is-empty {
    visibility: hidden;
}

.cs2-stats-compare-style .cs2-stats-role {
    font-size: clamp(1.35rem, 2vw, 1.7rem);
}

.cs2-stats-compare-style .cs2-stats-tempo {
    margin-top: 0.35rem;
}

.cs2-stats-compare-body {
    display: grid;
    grid-template-columns: minmax(280px, 0.95fr) minmax(0, 1.15fr);
    gap: 20px 28px;
    margin-top: 1.35rem;
    align-items: stretch;
}

.cs2-stats-compare-radar .cs2-stats-chart--radar {
    max-width: 560px;
    margin: 0 auto;
}

.cs2-stats-compare-radar .cs2-stats-chart canvas {
    height: 400px !important;
}

.cs2-stats-duel + .cs2-stats-duel {
    margin-top: 1rem;
    padding-top: 0.85rem;
    border-top: 1px solid var(--cs2-line);
}

.cs2-stats-duel-label {
    display: block;
    margin-bottom: 0.4rem;
    color: var(--cs2-quiet);
    font-family: var(--glhf-font-heading);
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    text-align: center;
}

.cs2-stats-duel-row,
.cs2-stats-compare-maps li {
    display: grid;
    align-items: center;
    gap: 12px;
}

.cs2-stats-duel-row {
    grid-template-columns: 4.5rem minmax(0, 1fr) 4.5rem;
}

.cs2-stats-duel-row strong,
.cs2-stats-compare-map-val {
    font-family: var(--glhf-font-heading);
    font-size: 1.05rem;
    font-variant-numeric: tabular-nums;
}

.cs2-stats-duel-row > .is-left,
.cs2-stats-compare-map-val.is-left {
    text-align: right;
}

.cs2-stats-duel-row > .is-right,
.cs2-stats-compare-map-val.is-right {
    text-align: left;
}

.cs2-stats-duel.is-left > .cs2-stats-duel-row > .is-left,
.cs2-stats-compare-maps li.is-left > .cs2-stats-compare-map-val.is-left {
    color: var(--cs2-duel-left);
}

.cs2-stats-duel.is-right > .cs2-stats-duel-row > .is-right,
.cs2-stats-compare-maps li.is-right > .cs2-stats-compare-map-val.is-right {
    color: var(--cs2-duel-right);
}

.cs2-stats-duel-tracks {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
    align-items: center;
}

.cs2-stats-duel-tracks span {
    height: 7px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.06);
}

.cs2-stats-duel-tracks span.is-left {
    direction: rtl;
}

.cs2-stats-duel-tracks i {
    display: block;
    height: 100%;
    border-radius: inherit;
}

.cs2-stats-duel-tracks .is-left i {
    background: linear-gradient(270deg, var(--cs2-duel-left), rgba(0, 255, 100, 0.35));
}

.cs2-stats-duel-tracks .is-right i {
    background: linear-gradient(90deg, var(--cs2-duel-right), rgba(140, 180, 255, 0.35));
}

.cs2-stats-compare-maps {
    margin-top: 1.35rem;
}

.cs2-stats-compare-maps ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.cs2-stats-compare-maps li {
    grid-template-columns: 7rem 4.75rem minmax(0, 1fr) 4.75rem;
    padding: 0.7rem 0;
    border-bottom: 1px solid var(--cs2-line);
    text-align: start;
}

.cs2-stats-compare-map-name {
    justify-self: start;
    min-width: 0;
    font-family: var(--glhf-font-heading);
    color: var(--cs2-ink);
    text-align: left;
    white-space: nowrap;
}

@keyframes cs2-arena-bar {
    from { transform: scaleX(0); }
    to { transform: scaleX(1); }
}

@media (prefers-reduced-motion: reduce) {
    .cs2-stats-arena-bar i {
        animation: none;
    }
}

@media (max-width: 900px) {
    .cs2-stats-compare-tools {
        grid-template-columns: minmax(0, auto) minmax(0, 1fr);
        padding: 0;
        gap: 10px 16px;
    }

    .cs2-stats-compare-swap {
        grid-column: 1;
        justify-self: start;
    }

    .cs2-stats-search--tool {
        grid-column: 2;
    }

    .cs2-stats-arena {
        grid-template-columns: 1fr 1fr;
        grid-template-areas:
            "left right"
            "call call";
        padding: 24px 18px 20px;
    }

    .cs2-stats-arena-side.is-left { grid-area: left; }
    .cs2-stats-arena-side.is-right { grid-area: right; }
    .cs2-stats-arena-call { grid-area: call; padding-top: 8px; }

    .cs2-stats-compare-body,
    .cs2-stats-compare-styles {
        grid-template-columns: 1fr;
    }

    .cs2-stats-compare-style.is-right {
        text-align: left;
    }

    .cs2-stats-arena .cs2-stats-medallion {
        width: 88px;
        height: 88px;
    }
}

@media (max-width: 640px) {
    .cs2-stats-compare-tools {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .cs2-stats-compare-swap,
    .cs2-stats-search--tool {
        grid-column: 1;
        justify-self: stretch;
        width: 100%;
    }

    .cs2-stats-compare-swap {
        justify-content: center;
        min-height: 40px;
        white-space: nowrap;
    }

    .cs2-stats-arena {
        padding: 1.15rem 1rem 1.05rem;
        gap: 8px 12px;
    }

    .cs2-stats-arena .cs2-stats-medallion {
        width: 76px;
        height: 76px;
    }

    .cs2-stats-compare-maps li {
        grid-template-columns: 5.5rem 4.25rem minmax(0, 1fr) 4.25rem;
        gap: 8px;
    }

    .cs2-stats-duel-row,
    .cs2-stats-compare-maps li {
        gap: 8px;
    }

    .cs2-stats-duel-row {
        grid-template-columns: 3.6rem minmax(0, 1fr) 3.6rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .cs2-stats.is-boot .cs2-stats-mast-portrait,
    .cs2-stats.is-boot .cs2-stats-mast-plate,
    .cs2-stats.is-boot .cs2-stats-nav,
    .cs2-stats.is-boot .cs2-stats-section:not([hidden]) > *,
    .cs2-stats.is-boot .cs2-stats-overview-split > *,
    .cs2-stats.is-boot .cs2-stats-grid > *,
    .cs2-stats.is-boot .cs2-stats-split > *,
    .cs2-stats.is-boot .cs2-stats-people-split > * {
        opacity: 1;
        transform: none;
    }

    .cs2-stats.is-ready .cs2-stats-mast-portrait,
    .cs2-stats.is-ready .cs2-stats-mast-plate,
    .cs2-stats.is-ready .cs2-stats-mast-glow,
    .cs2-stats.is-ready .cs2-stats-mast-title h1::after,
    .cs2-stats.is-ready .cs2-stats-nav,
    .cs2-stats.is-ready.is-first .cs2-enter,
    .cs2-stats-section.is-filling .cs2-stats-rail-track i,
    .cs2-stats-section.is-filling .cs2-stats-weapon-track span,
    .cs2-stats-auth,
    .cs2-stats-section.is-leave,
    .cs2-stats-section.is-arrive,
    .cs2-stats-dossier-radar.is-radar-fill::before {
        animation: none;
    }

    .cs2-stats-dossier-radar::before,
    .cs2-stats-dossier-radar.is-radar-ready::before {
        opacity: 0.72;
        transform: none;
    }

    .cs2-stats-nav-thumb {
        transition: none;
    }
}