.scrim-hub {
    --scrim-panel-background: #171718;
    --scrim-card-background: #111112;
    --scrim-yellow: #FFDF00;
    display: grid;
    gap: 1rem;
    color: #f7f7f7;
}

.scrim-heading,
.scrim-panel {
    border: 1px solid #2d2f35;
    border-radius: 16px;
    background: var(--scrim-panel-background);
}

.scrim-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.25rem;
}

.scrim-heading h2,
.scrim-panel h3,
.scrim-card h4 {
    margin: 0;
}

.scrim-heading p,
.scrim-muted,
.scrim-card p,
.scrim-card time {
    color: #a7a9b0;
}

.scrim-kicker {
    display: block;
    margin-bottom: .35rem;
    color: var(--scrim-yellow);
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .08em;
}

.scrim-panel {
    padding: 1.25rem;
}

.scrim-panel-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.scrim-primary-link,
.scrim-button {
    border: 1px solid #3a3c42;
    border-radius: 10px;
    background: #191a1f;
    color: #fff;
    padding: .7rem 1rem;
    font-weight: 700;
    text-decoration: none;
}

.scrim-button--primary,
.scrim-primary-link {
    border-color: var(--scrim-yellow);
    background: var(--scrim-yellow);
    color: #090909;
}

.scrim-button--accept {
    border-color: #3f8f56;
    color: #73df91;
}

.scrim-button--reject {
    border-color: #9c3f48;
    color: #ff7d87;
}

.scrim-calendar {
    display: grid;
    grid-template-columns: repeat(7, minmax(130px, 1fr));
    gap: .75rem;
    overflow-x: auto;
    padding-bottom: .5rem;
}

.scrim-calendar-day {
    min-width: 130px;
    padding: .85rem;
    border: 1px solid #292b31;
    border-radius: 12px;
    background: var(--scrim-card-background);
}

.scrim-calendar-day h4 {
    margin: 0;
    color: var(--scrim-yellow);
}

.scrim-calendar-day>span {
    color: #92949b;
    font-size: .8rem;
}

.scrim-slots {
    display: grid;
    gap: .45rem;
    margin-top: .8rem;
}

.scrim-slot {
    border: 1px solid #315f3d;
    border-radius: 8px;
    background: #122419;
    color: #77df92;
    padding: .55rem;
}

.scrim-slot small {
    display: block;
    font-size: .65rem;
}

.scrim-slot--booked {
    border-color: #63333a;
    background: #281519;
    color: #ff7d87;
}

.scrim-form {
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr auto;
    align-items: end;
    gap: .75rem;
}

.scrim-counter {
    display: grid;
    grid-template-columns: 2fr 1fr auto;
    align-items: end;
    gap: .75rem;
}

.scrim-form label {
    display: grid;
    gap: .35rem;
    font-weight: 700;
}

.scrim-form input,
.scrim-form select,
.scrim-counter input,
.scrim-counter select {
    width: 100%;
    min-height: 44px;
    border: 1px solid #34363d;
    border-radius: 9px;
    background: #090a0d;
    color: #fff;
    padding: .65rem;
}

.scrim-form--availability p {
    margin: 0;
}

.scrim-window-list,
.scrim-card-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
    margin-top: 1rem;
}

.scrim-window,
.scrim-card {
    border: 1px solid #292b31;
    border-radius: 12px;
    background: var(--scrim-card-background);
    padding: 1rem;
}

.scrim-window {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.scrim-window button {
    border: 0;
    background: transparent;
    color: #ff707a;
}

.scrim-status {
    display: inline-block;
    margin-bottom: .65rem;
    border-radius: 20px;
    background: #302b10;
    color: #ffdf00;
    padding: .3rem .6rem;
    font-size: .7rem;
    font-weight: 800;
}

.scrim-status--scheduled {
    background: #132a1a;
    color: #70df8e;
}

.scrim-actions {
    display: flex;
    gap: .5rem;
    margin: .9rem 0;
}

.scrim-empty {
    grid-column: 1 / -1;
    padding: 2rem;
    text-align: center;
    color: #92949b;
}

.scrim-legend {
    display: flex;
    gap: .75rem;
    color: #a7a9b0;
    font-size: .8rem;
}

.scrim-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
}

.scrim-dot--free {
    background: #70df8e;
}

.scrim-dot--booked {
    background: #ff707a;
}

.scrim-message {
    border: 1px solid #514a17;
    border-radius: 10px;
    background: #28230d;
    color: #ffdf00;
    padding: .8rem 1rem;
}

.scrim-overview-schedule {
    display: grid;
    gap: .5rem;
    margin-top: .5rem;
}

.scrim-overview-window {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: .65rem .75rem;
    border: 1px solid #303239;
    border-radius: 9px;
    background: #0c0d10;
}

.scrim-overview-window small {
    display: block;
    color: #8f929a;
}

.scrim-overview-window button {
    border: 0;
    background: transparent;
    color: #ff707a;
}

.scrim-overview-editor {
    margin-top: .75rem;
}

.scrim-overview-editor summary {
    cursor: pointer;
    color: #ffdf00;
    font-weight: 700;
}

.scrim-overview-editor form {
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr auto;
    align-items: end;
    gap: .65rem;
    margin-top: .75rem;
}

.scrim-overview-editor label {
    display: grid;
    gap: .3rem;
}

.scrim-detected-timezone {
    display: grid;
    gap: .25rem;
}

.scrim-detected-timezone span {
    font-weight: 700;
}

.scrim-detected-timezone strong {
    min-height: 44px;
    display: flex;
    align-items: center;
    color: #ffdf00;
}

.scrim-detected-timezone small {
    color: #8f929a;
}

.scrim-scheduled-grid {
    grid-template-columns: repeat(auto-fit,
            minmax(280px, 380px));
}

.scrim-scheduled-card {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 380px;
    min-height: 310px;
    padding: .8rem;
}

.scrim-scheduled-card .scrim-status {
    align-self: center;
    margin-bottom: .25rem;
    padding: .22rem .5rem;
    font-size: .62rem;
}

.scrim-scheduled-matchup {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 100px minmax(0, 1fr);
    align-items: center;
    gap: .5rem;
    flex: 1;
    padding: .55rem 0 .75rem;
}

.scrim-scheduled-team {
    display: grid;
    justify-items: center;
    gap: .35rem;
    min-width: 0;
    text-align: center;
}

.scrim-scheduled-team strong {
    width: 100%;
    overflow: hidden;
    font-size: .78rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.scrim-scheduled-logo {
    display: grid;
    width: 54px;
    height: 54px;
    place-items: center;
    overflow: hidden;
    border: 1px solid #5d5308;
    border-radius: 10px;
    background: #15150c;
    color: #ffdf00;
    font-size: 1.35rem;
}

.scrim-scheduled-logo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.scrim-scheduled-time {
    display: grid;
    justify-items: center;
    gap: .1rem;
    color: #a7a9b0;
    text-align: center;
}

.scrim-scheduled-time span {
    font-size: .65rem;
    white-space: nowrap;
}

.scrim-scheduled-time strong {
    color: #fff;
    font-size: 1.15rem;
}

.scrim-scheduled-time small {
    color: #ffdf00;
    font-size: .7rem;
    font-weight: 800;
}

.scrim-scheduled-change-fields {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 95px;
    gap: .4rem;
}

.scrim-scheduled-change-fields input,
.scrim-scheduled-change-fields select {
    min-width: 0;
    min-height: 34px;
    border: 1px solid #34363d;
    border-radius: 7px;
    background: #090a0d;
    color: #fff;
    padding: .35rem .5rem;
    font-size: .72rem;
}

.scrim-scheduled-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .4rem;
    margin-top: .4rem;
}

.scrim-scheduled-actions .scrim-button {
    width: 100%;
    min-height: 36px;
    padding: .4rem .55rem;
    font-size: .75rem;
}

/* Compact scheduled scrim cards */
.scrim-scheduled-grid {
    grid-template-columns: repeat(auto-fit,
            minmax(260px, 320px));
}

.scrim-scheduled-card {
    max-width: 320px;
    min-height: 0;
    padding: .65rem;
}

.scrim-scheduled-matchup {
    grid-template-columns:
        minmax(0, 1fr) 82px minmax(0, 1fr);
    flex: none;
    gap: .35rem;
    padding: .65rem 0 .35rem;
}

.scrim-scheduled-logo {
    width: 44px;
    height: 44px;
    border-radius: 8px;
    font-size: 1.1rem;
}

.scrim-scheduled-team {
    gap: .25rem;
}

.scrim-scheduled-team strong {
    font-size: .68rem;
}

.scrim-scheduled-time span {
    font-size: .58rem;
}

.scrim-scheduled-time strong {
    font-size: 1rem;
}

.scrim-scheduled-time small {
    font-size: .62rem;
}

.scrim-slot {
    min-height: 60px;
}

.scrim-slot--booked {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 16px minmax(0, 1fr);
    align-items: center;
    gap: .2rem;
    padding: .3rem .4rem;
}

.scrim-booked-time,
.scrim-booked-opponent {
    display: grid;
    justify-items: center;
    gap: .1rem;
    min-width: 0;
}

.scrim-booked-time strong {
    color: #ff707a;
    font-size: .85rem;
    line-height: 1;
}

.scrim-booked-time small {
    color: #ff707a;
    font-size: .52rem;
}

.scrim-booked-vs {
    color: #8f929a;
    font-size: .55rem;
    font-weight: 800;
    text-transform: uppercase;
}

.scrim-slot--linked {
    cursor: pointer;
}

.scrim-slot--linked .scrim-booked-vs::after {
    position: absolute;
    inset: 0;
    content: "";
}

.scrim-slot--linked:hover,
.scrim-slot--linked:has(.scrim-booked-vs:focus-visible) {
    border-color: #ff6570;
}

.scrim-booked-logo {
    display: grid;
    width: 26px;
    height: 26px;
    place-items: center;
    overflow: hidden;
    border: 1px solid #685c0a;
    border-radius: 6px;
    background: #18170b;
    color: #ffdf00;
    font-size: .7rem;
}

.scrim-booked-logo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.scrim-booked-opponent>small {
    display: block;
    width: 100%;
    overflow: hidden;
    color: #fff;
    font-size: .48rem;
    line-height: 1.1;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.scrim-booked-opponent {
    position: relative;
    z-index: 1;
}


.scrim-slot--booked {
    grid-template-columns:
        minmax(0, .9fr) 14px minmax(0, 1.1fr);
    min-height: 64px;
    padding: .3rem;
}

.scrim-booked-time strong {
    font-size: .9rem;
}

.scrim-booked-time small {
    font-size: .56rem;
}

.scrim-booked-logo {
    width: 34px;
    height: 34px;
    font-size: .85rem;
}

.scrim-booked-opponent {
    color: inherit;
    text-decoration: none;
}

.scrim-booked-opponent>small {
    color: #fff;
    font-size: .58rem;
    font-weight: 700;
}

.scrim-booked-opponent:hover>small {
    color: #ffdf00;
}

.scrim-booked-opponent:hover .scrim-booked-logo {
    border-color: #ffdf00;
}

.scrim-booked-opponent {
    width: 100%;
    justify-self: center;
    justify-items: center;
    align-content: center;
    text-align: center;
}

.scrim-booked-opponent>small {
    width: 100%;
    text-align: center;
}

.scrim-scheduled-team--link {
    color: inherit;
    text-decoration: none;
}

.scrim-scheduled-team--link:hover strong {
    color: #ffdf00;
}

.scrim-scheduled-team--link:hover .scrim-scheduled-logo {
    border-color: #ffdf00;
}

.scrim-scheduled-actions .scrim-button {
    cursor: pointer;
    transition:
        color .18s ease,
        background-color .18s ease,
        border-color .18s ease,
        box-shadow .18s ease,
        transform .18s ease;
}

/* Propose Change */
.scrim-scheduled-actions .scrim-button:not(.scrim-button--reject):hover {
    border-color: #ffdf00;
    background: rgba(255, 223, 0, .1);
    color: #ffdf00;
    box-shadow: 0 0 14px rgba(255, 223, 0, .12);
    transform: translateY(-1px);
}

/* Cancel Scrim */
.scrim-scheduled-actions .scrim-button--reject:hover {
    border-color: #ff6570;
    background: rgba(255, 80, 92, .14);
    color: #ff7d87;
    box-shadow: 0 0 14px rgba(255, 80, 92, .12);
    transform: translateY(-1px);
}

.scrim-scheduled-actions .scrim-button:active {
    transform: translateY(0);
}

.scrim-scheduled-actions .scrim-button:focus-visible {
    outline: 2px solid #ffdf00;
    outline-offset: 2px;
}

.scrim-recurrence-note {
    grid-column: 1 / -1;
    margin: 0;
    color: #8f929a;
    font-size: .75rem;
}



.scrim-match-page {
    display: grid;
    gap: 1rem;
    max-width: 1180px;
    margin: 0 auto 3rem;
}

.scrim-match-back {
    color: #a7a9b0;
    text-decoration: none;
}

.scrim-match-header,
.scrim-match-scoreboard {
    padding: 1.25rem;
    border: 1px solid #2d2f35;
    border-radius: 16px;
    background: #111216;
}

.scrim-match-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.scrim-match-header h1 {
    margin: 0;
}

.scrim-match-header time {
    color: #a7a9b0;
}

.scrim-match-scoreboard {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 1rem;
}

.scrim-match-team {
    display: grid;
    justify-items: center;
    color: #fff;
    text-align: center;
    text-decoration: none;
}

.scrim-match-logo {
    display: grid;
    width: 90px;
    height: 90px;
    place-items: center;
    overflow: hidden;
    border: 1px solid #685c0a;
    border-radius: 14px;
    color: #ffdf00;
    font-size: 2rem;
}

.scrim-match-logo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.scrim-match-versus {
    color: #ffdf00;
}

.scrim-match-grid,
.scrim-match-lineups {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.scrim-muted {
    color: #8f929a;
}

.scrim-lineup-heading,
.scrim-team-lineup>header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
}

.scrim-lineup-ready,
.scrim-lineup-locked,
.scrim-lineup-waiting {
    border-radius: 20px;
    padding: .3rem .6rem;
    font-size: .68rem;
    font-weight: 800;
}

.scrim-lineup-ready,
.scrim-lineup-locked {
    background: #132a1a;
    color: #70df8e;
}

.scrim-lineup-waiting {
    background: #302b10;
    color: #ffdf00;
}

.scrim-team-lineup {
    padding: .85rem;
    border: 1px solid #292b31;
    border-radius: 10px;
    background: #0b0c0f;
}

.scrim-locked-players,
.scrim-player-options {
    display: grid;
    gap: .45rem;
    margin-top: .75rem;
}

.scrim-locked-player,
.scrim-player-option {
    display: flex;
    align-items: center;
    gap: .65rem;
    min-width: 0;
    padding: .55rem;
    border: 1px solid #292b31;
    border-radius: 8px;
    background: #111216;
    color: #fff;
    text-decoration: none;
}

.scrim-locked-player img {
    width: 34px;
    height: 34px;
    border-radius: 7px;
    object-fit: cover;
}

.scrim-lineup-selector {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid #292b31;
}

.scrim-player-options {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-bottom: .75rem;
}

.scrim-player-option {
    cursor: pointer;
}

.scrim-player-option:has(input:checked) {
    border-color: #ffdf00;
    background: rgba(255, 223, 0, .08);
    color: #ffdf00;
}

.scrim-lineup-confirmation {
    margin: 1rem 0 0;
    color: #70df8e;
}


.scrim-party-code {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .65rem;
    margin-top: 1rem;
}

.scrim-party-code input {
    width: 100%;
    min-width: 0;
    min-height: 44px;
    border: 1px solid #34363d;
    border-radius: 9px;
    background: #090a0d;
    color: #ffdf00;
    padding: .65rem;
    font-weight: 800;
}


.scrim-veto-panel {
    overflow: hidden;
}

.scrim-veto-state {
    color: #a7a9b0;
    font-size: .8rem;
    font-weight: 700;
}

.scrim-veto-selected,
.scrim-veto-turn,
.scrim-veto-readiness {
    margin-bottom: 1rem;
    padding: .85rem;
    border: 1px solid #514a17;
    border-radius: 10px;
    background: rgba(255, 223, 0, .07);
}

.scrim-veto-selected {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.scrim-veto-selected strong,
.scrim-veto-turn strong {
    color: #ffdf00;
    font-size: 1.15rem;
}

.scrim-veto-turn {
    display: grid;
    justify-items: center;
    text-align: center;
}

.scrim-veto-readiness {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
}

.scrim-veto-readiness>div {
    display: flex;
    justify-content: space-between;
    gap: .5rem;
}

.scrim-veto-readiness strong {
    color: #ffdf00;
}

.scrim-veto-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit,
            minmax(170px, 1fr));
    gap: .75rem;
    margin-top: 1rem;
}

.scrim-veto-card {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 145px;
    overflow: hidden;
    padding: .8rem;
    border: 1px solid #303239;
    border-radius: 10px;
    background:
        linear-gradient(rgba(10, 10, 12, .72),
            rgba(10, 10, 12, .92)),
        var(--scrim-map-image) center / cover;
}

.scrim-veto-card.is-banned {
    border-color: #81353d;
    background:
        linear-gradient(rgba(54, 12, 17, .84),
            rgba(35, 9, 12, .94)),
        var(--scrim-map-image) center / cover;
}

.scrim-veto-card.is-picked {
    border-color: #ffdf00;
    background:
        linear-gradient(rgba(35, 32, 4, .58),
            rgba(15, 14, 3, .9)),
        var(--scrim-map-image) center / cover;
}

.scrim-veto-card-head {
    display: flex;
    justify-content: space-between;
    gap: .5rem;
}

.scrim-veto-card-head span {
    color: #a7a9b0;
    font-size: .62rem;
    font-weight: 800;
    text-transform: uppercase;
}

.scrim-veto-card.is-banned .scrim-veto-card-head span {
    color: #ff7d87;
}

.scrim-veto-card.is-picked .scrim-veto-card-head span {
    color: #ffdf00;
}

.scrim-veto-card p {
    margin: 1.5rem 0 0;
    color: #b4b6bc;
    font-size: .72rem;
}

.scrim-veto-ban {
    width: 100%;
    margin-top: 1.5rem;
    border: 1px solid #9c3f48;
    border-radius: 8px;
    background: rgba(70, 15, 21, .82);
    color: #ff7d87;
    padding: .5rem;
    font-weight: 800;
}

.scrim-veto-ban:hover {
    border-color: #ff6570;
    background: rgba(110, 20, 28, .9);
    color: #fff;
}


.scrim-results {
    margin-top: 1.5rem;
}

.scrim-results-heading,
.scrim-result-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.scrim-results-heading {
    margin-bottom: 1rem;
}

.scrim-results-heading h3 {
    margin: .2rem 0 0;
}

.scrim-result-card {
    overflow: hidden;
    border: 1px solid #30333a;
    border-radius: 12px;
    background: #0b0c0f;
}

.scrim-result-meta {
    padding: 1rem;
    border-bottom: 1px solid #292c32;
}

.scrim-result-meta div {
    min-width: 0;
}

.scrim-result-meta span,
.scrim-result-summary span {
    display: block;
    color: #969ba7;
    font-size: .75rem;
    font-weight: 700;
    text-transform: uppercase;
}

.scrim-result-meta strong {
    display: block;
    overflow-wrap: anywhere;
}

.scrim-confidence {
    flex: 0 0 auto;
    border-radius: 999px;
    padding: .4rem .65rem;
    font-size: .72rem;
    font-weight: 800;
}

.scrim-confidence--high {
    background: rgba(48, 190, 91, .14);
    color: #58df7d;
}

.scrim-confidence--medium {
    background: rgba(255, 223, 0, .14);
    color: #ffdf00;
}

.scrim-confidence--low {
    background: rgba(255, 91, 104, .14);
    color: #ff727d;
}

.scrim-result-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .75rem;
    padding: 1rem;
}

.scrim-result-summary>div {
    min-width: 0;
    border-radius: 9px;
    background: #111216;
    padding: .85rem;
}

.scrim-result-summary strong {
    display: block;
    margin-top: .3rem;
    overflow-wrap: anywhere;
}

.scrim-final-score {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    gap: 1rem;
    margin: 0 1rem 1rem;
    border-radius: 10px;
    background: #111216;
    padding: 1rem;
}

.scrim-final-score>div:not(.scrim-final-score__center) {
    display: flex;
    align-items: center;
    gap: .75rem;
}

.scrim-final-score>div:last-child {
    justify-content: flex-end;
}

.scrim-final-score strong {
    color: #ffdf00;
    font-size: 1.65rem;
}

.scrim-final-score__center {
    text-align: center;
}

.scrim-final-score__center small,
.scrim-final-score__center span {
    display: block;
}

.scrim-final-score__center span {
    color: #969ba7;
    font-size: .8rem;
}

.scrim-scoreboard-wrap {
    overflow-x: auto;
    border-top: 1px solid #292c32;
}

.scrim-scoreboard {
    width: 100%;
    min-width: 850px;
    border-collapse: collapse;
}

.scrim-scoreboard th,
.scrim-scoreboard td {
    border-bottom: 1px solid #24272d;
    padding: .8rem;
    text-align: center;
    white-space: nowrap;
}

.scrim-scoreboard th:first-child,
.scrim-scoreboard td:first-child {
    text-align: left;
}

.scrim-scoreboard__team th {
    background: rgba(255, 223, 0, .08);
    color: #ffdf00;
}

.scrim-scoreboard__player {
    display: flex;
    align-items: center;
    gap: .65rem;
}

.scrim-scoreboard__player img {
    width: 42px;
    height: 42px;
    border-radius: 7px;
    object-fit: cover;
}

.scrim-scoreboard__player span,
.scrim-scoreboard__player small {
    display: block;
}

.scrim-scoreboard__player small {
    color: #969ba7;
}

.scrim-result-state {
    padding: .8rem 1rem;
    color: #58df7d;
    font-weight: 700;
}

.scrim-result-review {
    display: grid;
    grid-template-columns:
        minmax(180px, .7fr) minmax(240px, 1fr) auto;
    align-items: end;
    gap: .75rem;
    border-top: 1px solid #292c32;
    padding: 1rem;
}

.scrim-result-review label {
    display: grid;
    gap: .4rem;
    color: #c8cad0;
    font-weight: 700;
}

.scrim-result-review select,
.scrim-result-review textarea {
    width: 100%;
    border: 1px solid #343740;
    border-radius: 8px;
    background: #090a0d;
    color: #fff;
    padding: .7rem;
}

.scrim-result-review textarea {
    min-height: 44px;
    resize: vertical;
}

.scrim-result-disputed {
    color: #ff727d;
}

.scrim-dispute-form {
    display: grid;
    grid-template-columns:
        minmax(180px, .6fr) minmax(280px, 1fr) auto;
    align-items: end;
    gap: 1rem;
    margin-top: 1rem;
    border: 1px solid #673039;
    border-radius: 10px;
    background: rgba(74, 18, 25, .2);
    padding: 1rem;
}

.scrim-dispute-form h4,
.scrim-dispute-form p {
    margin-bottom: 0;
}

.scrim-dispute-form textarea {
    width: 100%;
    min-height: 72px;
    border: 1px solid #493038;
    border-radius: 8px;
    background: #090a0d;
    color: #fff;
    padding: .75rem;
    resize: vertical;
}

.scrim-button--danger {
    border: 1px solid #9c3f48;
    background: rgba(70, 15, 21, .82);
    color: #ff7d87;
}

.scrim-button--danger:hover {
    border-color: #ff6570;
    background: #ff6570;
    color: #090a0d;
}

.scrim-riot-manual {
    display: grid;
    grid-template-columns: minmax(200px, .7fr) minmax(300px, 1fr);
    align-items: end;
    gap: 1rem;
    margin-top: 1rem;
    border-top: 1px solid #30333a;
    padding-top: 1rem;
}

.scrim-riot-manual h4,
.scrim-riot-manual p {
    margin-bottom: 0;
}

.scrim-riot-manual form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .75rem;
}

.scrim-riot-manual input {
    width: 100%;
    min-width: 0;
    border: 1px solid #343740;
    border-radius: 8px;
    background: #090a0d;
    color: #fff;
    padding: .75rem;
}

.scrim-riot-manual input:focus {
    border-color: #ffdf00;
    outline: none;
}


.scrim-audit {
    margin-top: 1.5rem;
}

.scrim-audit-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.scrim-audit-heading h3 {
    margin: .2rem 0 0;
}

.scrim-audit-list {
    display: grid;
    gap: .65rem;
}

.scrim-audit-item {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: .8rem;
    border: 1px solid #292c32;
    border-radius: 9px;
    background: #0b0c0f;
    padding: .8rem;
}

.scrim-audit-icon {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border: 1px solid rgba(255, 223, 0, .35);
    border-radius: 8px;
    background: rgba(255, 223, 0, .08);
    color: #ffdf00;
}

.scrim-audit-content {
    min-width: 0;
}

.scrim-audit-content strong,
.scrim-audit-content small {
    display: block;
}

.scrim-audit-content p {
    margin: .3rem 0;
    color: #c7c9ce;
    overflow-wrap: anywhere;
}

.scrim-audit-content small {
    margin-top: .25rem;
    color: #8f949f;
}

.scrim-results-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .75rem;
}

.scrim-results-actions form {
    margin: 0;
}

.scrim-veto-sides {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
    margin: 1rem 0;
}

.scrim-veto-sides>div {
    border: 1px solid #343740;
    border-radius: 9px;
    background: #0b0c0f;
    padding: .9rem;
}

.scrim-veto-sides span,
.scrim-veto-sides strong {
    display: block;
}

.scrim-veto-sides span {
    color: #969ba7;
    font-size: .75rem;
    text-transform: uppercase;
}

.scrim-veto-sides strong {
    margin-top: .25rem;
    color: #ffdf00;
}

.scrim-side-choice {
    margin: 1rem 0;
    border: 1px solid rgba(255, 223, 0, .3);
    border-radius: 10px;
    background: rgba(255, 223, 0, .05);
    padding: 1rem;
}

.scrim-side-choice>div {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
}

.scrim-side-choice button {
    border-radius: 8px;
    padding: .8rem;
    font-weight: 800;
}

.scrim-side-choice__attack {
    border: 1px solid #b64c55;
    background: rgba(100, 22, 29, .8);
    color: #ff8790;
}

.scrim-side-choice__defense {
    border: 1px solid #3977b8;
    background: rgba(22, 54, 91, .8);
    color: #79baff;
}


.scrim-open-match {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    width: 100%;
    margin-top: .75rem;
    border: 1px solid rgba(255, 223, 0, .45);
    border-radius: 8px;
    background: rgba(255, 223, 0, .07);
    color: #ffdf00;
    padding: .7rem;
    font-weight: 800;
    text-decoration: none;
}

.scrim-open-match:hover {
    border-color: #ffdf00;
    background: #ffdf00;
    color: #090a0d;
}

/* Scheduled scrims: responsive card layout */
.scrim-scheduled-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .75rem;
}

.scrim-scheduled-card {
    width: 100%;
    max-width: none;
    min-width: 0;
}

@media (max-width: 1199.98px) {
    .scrim-scheduled-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 899.98px) {
    .scrim-scheduled-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {

    .scrim-overview-editor form,
    .scrim-riot-manual,
    .scrim-riot-manual form,
    .scrim-dispute-form,
    .scrim-result-review,
    .scrim-match-grid,
    .scrim-match-lineups,
    .scrim-form,
    .scrim-counter,
    .scrim-window-list,
    .scrim-card-grid {
        grid-template-columns: 1fr;
    }

    .scrim-heading,
    .scrim-panel-heading,
    .scrim-match-header {
        align-items: stretch;
        flex-direction: column;
    }

    .scrim-match-header {
        gap: .75rem;
    }

    .scrim-match-logo {
        width: 64px;
        height: 64px;
    }

    .scrim-primary-link,
    .scrim-button {
        text-align: center;
    }

    .scrim-calendar {
        grid-template-columns: repeat(7, 150px);
    }

    .scrim-result-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .scrim-final-score {
        gap: .5rem;
        padding: .8rem;
    }

    .scrim-final-score span {
        overflow: hidden;
        font-size: .78rem;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}

@media (max-width: 575.98px) {

    .scrim-scheduled-grid,
    .scrim-veto-sides,
    .scrim-side-choice>div,
    .scrim-veto-readiness,
    .scrim-party-code,
    .scrim-player-options {
        grid-template-columns: 1fr;
    }

    .scrim-scheduled-card {
        max-width: 100%;
        min-height: 290px;
    }

    .scrim-scheduled-matchup {
        grid-template-columns: minmax(0, 1fr) 90px minmax(0, 1fr);
    }

    .scrim-scheduled-logo {
        width: 48px;
        height: 48px;
    }

    .scrim-scheduled-change-fields {
        grid-template-columns: minmax(0, 1fr) 90px;
    }

    .scrim-results-actions {
        width: 100%;
        align-items: stretch;
        flex-direction: column;
    }

    .scrim-results-actions .scrim-button {
        width: 100%;
    }

    .scrim-audit-heading,
    .scrim-results-heading,
    .scrim-result-meta {
        align-items: flex-start;
        flex-direction: column;
    }

    .scrim-final-score strong {
        font-size: 1.3rem;
    }

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

    .scrim-veto-card {
        min-height: 130px;
    }
}

@media (max-width: 430px) {
    .scrim-scheduled-matchup {
        grid-template-columns: minmax(0, 1fr) 72px minmax(0, 1fr);
    }

    .scrim-scheduled-change-fields {
        grid-template-columns: 1fr;
    }

    .scrim-scheduled-actions {
        grid-template-columns: 1fr;
    }

    .scrim-veto-grid,
    .scrim-result-summary {
        grid-template-columns: 1fr;
    }
}


/* Scrims tab responsive cleanup */
.scrim-hub,
.scrim-hub * {
  box-sizing: border-box;
}

.scrim-hub,
.scrim-panel,
.scrim-card-grid,
.scrim-scheduled-grid,
.scrim-scheduled-card {
  min-width: 0;
  max-width: 100%;
}

.scrim-panel {
  overflow: hidden;
}

.scrim-panel-heading {
  flex-wrap: wrap;
}

.scrim-calendar {
  grid-template-columns: repeat(auto-fit, minmax(150px, 180px));
  justify-content: start;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
}

.scrim-calendar-day {
  width: 100%;
  min-width: 0;
}

.scrim-slot {
  width: 100%;
}

.scrim-card-grid,
.scrim-scheduled-grid {
  width: 100%;
}

.scrim-scheduled-grid {
  grid-template-columns: repeat(auto-fit, minmax(260px, 320px));
  justify-content: start;
}

.scrim-scheduled-card {
  width: 100%;
}

.scrim-open-match {
  min-width: 0;
  white-space: normal;
  text-align: center;
}

.scrim-scheduled-change-fields input,
.scrim-scheduled-change-fields select,
.scrim-scheduled-actions form,
.scrim-scheduled-actions button {
  min-width: 0;
  max-width: 100%;
}

@media (max-width: 991.98px) {
  .scrim-calendar {
    grid-auto-flow: column;
    grid-auto-columns: minmax(150px, 170px);
    grid-template-columns: none;
  }

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

@media (max-width: 575.98px) {
  .scrim-panel {
    padding: 1rem;
    border-radius: 14px;
  }

  .scrim-panel-heading {
    align-items: flex-start;
  }

  .scrim-legend {
    flex-wrap: wrap;
  }

  .scrim-calendar {
    grid-auto-columns: minmax(150px, 155px);
    padding-bottom: .65rem;
  }

  .scrim-scheduled-grid {
    grid-template-columns: 1fr;
  }

  .scrim-scheduled-card {
    min-height: 0;
  }

  .scrim-scheduled-matchup {
    grid-template-columns: minmax(0, 1fr) 74px minmax(0, 1fr);
    gap: .4rem;
  }

  .scrim-scheduled-logo {
    width: 42px;
    height: 42px;
  }

  .scrim-scheduled-team strong {
    font-size: .72rem;
  }

  .scrim-scheduled-time span {
    white-space: normal;
  }

  .scrim-scheduled-change-fields,
  .scrim-scheduled-actions {
    grid-template-columns: 1fr;
  }

  .scrim-button,
  .scrim-open-match {
    width: 100%;
  }
}