.demos__round-nav {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    gap: 0.5rem;
    white-space: nowrap;
    color: var(--text-default);
    font-size: var(--font-size-s);
    font-weight: var(--font-weight-6);
    font-variant-numeric: tabular-nums;
}

.demos__rounds {
    flex-wrap: nowrap;
    overflow-x: auto;
    margin-block: 0 1rem;
    background-color: var(--transparent-2-w);
}

.demos__round {
    flex: 0 0 auto;
    min-width: 2.75rem;
    padding-inline: 0.5rem;
    font-variant-numeric: tabular-nums;
}

.demos__round--ct:not(.active) {
    color: var(--ct);
}

.demos__round--t:not(.active) {
    color: var(--t);
}

.demos__round--half {
    margin-left: 0.75rem;
}

.demos__round-facts {
    margin-bottom: 1rem;
}

.demos__round-facts span {
    background: var(--transparent-2-w);
    backdrop-filter: none;
}

.demos__round-facts .demos__side--ct svg {
    fill: var(--ct);
}

.demos__round-facts .demos__side--t svg {
    fill: var(--t);
}

.demos__kills th,
.demos__kills td {
    text-align: left;
}

.demos__kills th:first-child,
.demos__kills td:first-child {
    width: 4rem;
    color: var(--text-secondary);
    font-variant-numeric: tabular-nums;
}

.demos__kill-plus {
    margin-inline: 0.375rem;
    color: var(--text-secondary);
}

.demos__kill-gun {
    display: inline-flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    gap: 0.375rem;
    white-space: nowrap;
}

.demos__weapon {
    display: inline-block;
    flex-shrink: 0;
    height: 1.25rem;
    background-color: var(--text-default);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: left center;
    mask-position: left center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.demos__kill-gun svg {
    width: 1rem;
    height: 1rem;
    fill: var(--text-default);
}

.demos__side {
    font-weight: var(--font-weight-6);
}

.demos__side--ct {
    color: var(--ct);
}

.demos__side--t {
    color: var(--t);
}

.demos__nick {
    font-weight: var(--font-weight-6);
    text-decoration: none;
}

.demos__nick:not(.demos__side) {
    color: inherit;
}

a.demos__side--ct {
    color: var(--ct);
}

a.demos__side--t {
    color: var(--t);
}

.demos__nick:hover {
    text-decoration: underline;
    text-underline-offset: 2px;
}

.demos__chat {
    margin-top: 1rem;
}

.demos__chat-text {
    white-space: normal !important;
    overflow-wrap: anywhere;
}

.demos__chat-team {
    margin-right: 0.5rem;
    color: var(--text-secondary);
    font-size: var(--font-size-xs);
}

.demos__chunks {
    margin-bottom: 0.5rem;
}

#demosRoundPanel.is-loading {
    opacity: 0.5;
    transition: opacity var(--transition-duration);
}
