.game-race-widget,
    .game-race-desktop-widget,
    .game-race-mobile-pill,
    .game-race-modal-body {
        --race-accent: var(--color1, #2ee58f);
        --race-accent-2: var(--color3, var(--color1, #2ee58f));
        --race-text: var(--color2, #ffffff);
        --race-bg: var(--color4, #1f2328);

        --race-accent-soft: color-mix(in srgb, var(--race-accent) 14%, transparent 86%);
        --race-accent-border: color-mix(in srgb, var(--race-accent) 34%, transparent 66%);
        --race-accent-border-strong: color-mix(in srgb, var(--race-accent) 52%, transparent 48%);

        --race-text-soft: color-mix(in srgb, var(--race-text) 74%, transparent 26%);
        --race-text-muted: color-mix(in srgb, var(--race-text) 48%, transparent 52%);

        --race-bg-top: color-mix(in srgb, var(--race-bg) 88%, white 12%);
        --race-bg-bottom: color-mix(in srgb, var(--race-bg) 94%, black 6%);
        --race-bg-card: rgba(0, 0, 0, .16);
        --race-bg-card-2: rgba(255, 255, 255, .028);
        --race-bg-card-3: rgba(255, 255, 255, .042);

        --race-border: rgba(255, 255, 255, .06);

        --race-gold: color-mix(in srgb, #f0c24b 84%, white 16%);
        --race-silver: color-mix(in srgb, #c9d0db 92%, white 8%);
        --race-bronze: color-mix(in srgb, #c98a52 88%, white 12%);

        --race-shadow: 0 .5rem 1.5rem rgba(0, 0, 0, .14);
    }

    .game-stage {
        position: relative;
    }

    .game-race-widget {
        position: relative;
        margin-top: .85rem;
        border-radius: 1.05rem;
        overflow: hidden;
        border: 1px solid var(--race-border);
        background:
                radial-gradient(circle at top right, color-mix(in srgb, var(--race-accent) 10%, transparent 90%), transparent 28%),
                linear-gradient(180deg, rgba(255, 255, 255, .03), rgba(255, 255, 255, .015)),
                linear-gradient(180deg, var(--race-bg-top) 0%, var(--race-bg-bottom) 100%);
        box-shadow:
                inset 0 1px 0 rgba(255, 255, 255, .025),
                var(--race-shadow);
    }

    .game-race-widget-top {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(26rem, 38rem);
        grid-template-areas: "left right";
        gap: .9rem;
        align-items: start;
        padding: .95rem .95rem .9rem;
        border-bottom: 1px solid rgba(255, 255, 255, .05);
    }

    .game-race-widget-top.has-inline-join {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
        "left cta"
        "right right";
        column-gap: .9rem;
        row-gap: .8rem;
    }

    .game-race-widget-left {
        grid-area: left;
        min-width: 0;
    }

    .game-race-widget-kicker,
    .game-race-modal-kicker {
        display: inline-flex;
        align-items: center;
        gap: .42rem;
        margin-bottom: .42rem;
        color: var(--race-accent);
        font-size: .64rem;
        font-weight: 800;
        line-height: 1;
        letter-spacing: .11em;
        text-transform: uppercase;
    }

    .game-race-widget-title-row,
    .game-race-modal-title-row {
        display: flex;
        align-items: center;
        gap: .55rem;
        flex-wrap: wrap;
        margin-bottom: .32rem;
    }

    .game-race-widget-title,
    .game-race-modal-title {
        min-width: 0;
        color: var(--race-text);
        font-size: 1.04rem;
        font-weight: 800;
        line-height: 1.08;
        text-decoration: none !important;
    }

    .game-race-widget-title:hover,
    .game-race-modal-title:hover {
        color: var(--race-text);
        opacity: .94;
    }

    .game-race-widget-status,
    .game-race-modal-status {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 1.55rem;
        padding: 0 .68rem;
        border-radius: 999px;
        border: 1px solid rgba(255, 255, 255, .08);
        background: rgba(255, 255, 255, .05);
        color: var(--race-text-soft);
        font-size: .62rem;
        font-weight: 800;
        line-height: 1;
        white-space: nowrap;
        text-transform: uppercase;
        letter-spacing: .05em;
    }

    .game-race-widget-row.is-me,
    .game-race-modal-row.is-me {
        border-color: var(--race-accent-border-strong);
        background:
                linear-gradient(
                        180deg,
                        color-mix(in srgb, var(--race-accent) 12%, rgba(255,255,255,.04) 88%),
                        color-mix(in srgb, var(--race-accent) 6%, rgba(255,255,255,.02) 94%)
                );
        box-shadow:
                inset 0 0 0 1px color-mix(in srgb, var(--race-accent) 35%, transparent 65%),
                0 .4rem 1rem rgba(0,0,0,.18);
    }

    .game-race-widget-row.is-me::before,
    .game-race-modal-row.is-me::before {
        background: var(--race-accent) !important;
        width: .18rem;
    }

    .game-race-widget-row.is-me .game-race-widget-user,
    .game-race-modal-row.is-me .game-race-modal-user {
        color: var(--race-text);
        font-weight: 900;
    }

    .game-race-widget-row.is-me .game-race-widget-score,
    .game-race-modal-row.is-me .game-race-modal-score {
        color: color-mix(in srgb, var(--race-accent) 70%, white 30%);
    }

    .game-race-widget-row.is-me:hover {
        border-color: var(--race-accent);
    }

    .game-race-widget-status.status-in_course,
    .game-race-modal-status.status-in_course {
        background: var(--race-accent-soft);
        border-color: var(--race-accent-border);
        color: color-mix(in srgb, var(--race-accent) 78%, white 22%);
    }

    .game-race-widget-status.status-coming_soon,
    .game-race-modal-status.status-coming_soon {
        background: color-mix(in srgb, var(--race-accent-2) 14%, transparent 86%);
        border-color: color-mix(in srgb, var(--race-accent-2) 28%, transparent 72%);
        color: color-mix(in srgb, var(--race-accent-2) 72%, white 28%);
    }

    .game-race-widget-status.status-finished,
    .game-race-widget-status.status-paid,
    .game-race-widget-status.status-cancelled,
    .game-race-modal-status.status-finished,
    .game-race-modal-status.status-paid,
    .game-race-modal-status.status-cancelled {
        background: rgba(255, 255, 255, .08);
        border-color: rgba(255, 255, 255, .12);
        color: var(--race-text-soft);
    }

    .game-race-widget-meta {
        display: inline-flex;
        align-items: center;
        gap: .45rem;
        margin-top: .1rem;
        padding: .42rem .62rem;
        border-radius: 999px;
        background: color-mix(in srgb, var(--race-accent) 10%, rgba(255,255,255,.03) 90%);
        border: 1px solid color-mix(in srgb, var(--race-accent) 26%, transparent 74%);
        color: var(--race-text-soft);
        font-size: .78rem;
        font-weight: 700;
        line-height: 1.1;
    }

    .game-race-widget-meta strong {
        color: var(--race-text);
        font-size: .84rem;
        font-weight: 900;
    }

    .game-race-widget-cta {
        grid-area: cta;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .game-race-widget-top.has-inline-join .game-race-widget-cta {
        align-self: start;
        justify-self: end;
    }

    .game-race-join-btn,
    .game-race-modal-join-btn {
        appearance: none;
        -webkit-appearance: none;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: .5rem;
        min-height: 2.45rem;
        padding: 0 .92rem;
        border-radius: .84rem;
        border: 1px solid var(--race-accent-border);
        background:
                linear-gradient(
                        180deg,
                        color-mix(in srgb, var(--race-accent) 24%, rgba(255, 255, 255, .04) 76%),
                        color-mix(in srgb, var(--race-accent) 14%, rgba(255, 255, 255, .02) 86%)
                );
        color: var(--race-text) !important;
        font-size: .78rem;
        font-weight: 800;
        line-height: 1;
        text-decoration: none !important;
        white-space: nowrap;
        outline: none;
        cursor: pointer;
        transition: .16s ease;
        box-shadow:
                inset 0 1px 0 rgba(255, 255, 255, .08),
                0 .35rem .9rem rgba(0, 0, 0, .14);
    }

    .game-race-join-btn:hover,
    .game-race-modal-join-btn:hover {
        transform: translateY(-1px);
        border-color: var(--race-accent-border-strong);
        background:
                linear-gradient(
                        180deg,
                        color-mix(in srgb, var(--race-accent) 32%, rgba(255, 255, 255, .04) 68%),
                        color-mix(in srgb, var(--race-accent) 18%, rgba(255, 255, 255, .02) 82%)
                );
        color: var(--race-text) !important;
    }

    .game-race-widget-right {
        grid-area: right;
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(7rem, .82fr) minmax(8rem, .95fr) minmax(6rem, .72fr);
        gap: .5rem;
        align-items: stretch;
        width: 100%;
    }

    .game-race-widget-top.has-inline-join .game-race-widget-right {
        width: 100%;
        justify-content: stretch;
    }

    .game-race-widget-mybox,
    .game-race-modal-mybox {
        min-width: 0;
        min-height: 4rem;
        padding: .62rem .66rem;
        border-radius: .84rem;
        border: 1px solid rgba(255, 255, 255, .05);
        background: var(--race-bg-card);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .02);
        display: flex;
        flex-direction: column;
        justify-content: center;
        overflow: hidden;
    }

    .game-race-widget-mybox-empty {
        justify-content: center;
    }

    .game-race-widget-my-label,
    .game-race-modal-my-label {
        margin-bottom: .24rem;
        color: var(--race-text-muted);
        font-size: .54rem;
        font-weight: 800;
        line-height: 1.1;
        letter-spacing: .08em;
        text-transform: uppercase;
    }

    .game-race-widget-my-rank-row,
    .game-race-modal-my-value-row {
        display: flex;
        align-items: center;
        gap: .3rem;
        min-width: 0;
    }

    .game-race-widget-my-rank-icon {
        color: var(--race-accent);
        font-size: .88rem;
        flex: 0 0 auto;
    }

    .game-race-widget-my-rank,
    .game-race-widget-my-score,
    .game-race-modal-my-value {
        color: var(--race-text);
        font-size: .76rem;
        font-weight: 800;
        line-height: 1.06;
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    .game-race-widget-mybox-prize .game-race-widget-my-score,
    .game-race-modal-mybox-prize .game-race-modal-my-value {
        font-size: .71rem;
        line-height: 1.14;
        white-space: normal;
    }

    .game-race-widget-empty-state {
        color: var(--race-text-soft);
        font-size: .78rem;
        font-weight: 700;
        line-height: 1.15;
    }

    .game-race-rank-trend {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: .8rem;
        font-size: .74rem;
        font-weight: 900;
        color: rgba(255, 255, 255, .28);
        flex: 0 0 auto;
    }

    .game-race-rank-trend.up {
        color: #57e389;
    }

    .game-race-rank-trend.down {
        color: #ff6b6b;
    }

    .game-race-rank-trend.same {
        color: rgba(255, 255, 255, .24);
    }

    .game-race-widget-board {
        padding: .76rem .8rem .86rem;
    }

    .game-race-widget-board-head,
    .game-race-widget-row {
        display: grid;
        grid-template-columns: 3.55rem minmax(0, 1fr) minmax(7.2rem, 1fr) 5rem;
        gap: .68rem;
        align-items: center;
    }

    .game-race-widget-board-head {
        padding: 0 .75rem .42rem;
        color: var(--race-text-muted);
        font-size: .6rem;
        font-weight: 800;
        line-height: 1;
        letter-spacing: .08em;
        text-transform: uppercase;
    }

    .game-race-widget-board-head > div:nth-child(3),
    .game-race-widget-board-head > div:last-child {
        text-align: right;
    }

    .game-race-widget-row {
        position: relative;
        min-height: 3.1rem;
        padding: 0 .75rem;
        border-radius: .88rem;
        border: 1px solid rgba(255, 255, 255, .04);
        background: var(--race-bg-card-2);
        transition: background .16s ease, border-color .16s ease;
    }

    .game-race-widget-row + .game-race-widget-row {
        margin-top: .42rem;
    }

    .game-race-widget-row:hover {
        background: var(--race-bg-card-3);
        border-color: rgba(255, 255, 255, .06);
    }

    .game-race-widget-row::before,
    .game-race-modal-row::before {
        content: "";
        position: absolute;
        left: 0;
        top: .52rem;
        bottom: .52rem;
        width: .14rem;
        border-radius: 999px;
        background: rgba(255, 255, 255, .08);
    }

    .game-race-widget-board-body .game-race-widget-row:nth-child(1)::before,
    .game-race-modal-board-body .game-race-modal-row:nth-child(1)::before {
        background: var(--race-gold);
    }

    .game-race-widget-board-body .game-race-widget-row:nth-child(2)::before,
    .game-race-modal-board-body .game-race-modal-row:nth-child(2)::before {
        background: var(--race-silver);
    }

    .game-race-widget-board-body .game-race-widget-row:nth-child(3)::before,
    .game-race-modal-board-body .game-race-modal-row:nth-child(3)::before {
        background: var(--race-bronze);
    }

    .game-race-widget-rank,
    .game-race-modal-rank {
        color: var(--race-accent);
        font-size: 1rem;
        font-weight: 800;
        text-align: center;
    }

    .game-race-widget-user,
    .game-race-modal-user {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        color: var(--race-text);
        font-size: .92rem;
        font-weight: 700;
    }

    .game-race-widget-prize,
    .game-race-modal-prize-col {
        color: var(--race-text-soft);
        font-size: .76rem;
        font-weight: 700;
        line-height: 1.14;
        text-align: right;
        word-break: break-word;
        overflow-wrap: anywhere;
    }

    .game-race-widget-score,
    .game-race-modal-score {
        color: var(--race-text);
        font-size: .94rem;
        font-weight: 800;
        text-align: right;
        overflow-wrap: anywhere;
    }

    .game-race-widget-expand,
    .game-race-modal-expand-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: .45rem;
        width: 100%;
        height: 2.56rem;
        margin-top: .72rem;
        border-radius: .95rem;
        border: 1px solid rgba(255,255,255,.07);
        background:
                linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.02));
        color: var(--race-text);
        font-size: .79rem;
        font-weight: 800;
        transition: .18s ease;
    }

    .game-race-widget-expand:hover,
    .game-race-modal-expand-btn:hover {
        background:
                linear-gradient(180deg, color-mix(in srgb, var(--race-accent) 8%, rgba(255,255,255,.04) 92%), rgba(255,255,255,.03));
        border-color: color-mix(in srgb, var(--race-accent) 22%, rgba(255,255,255,.08) 78%);
        transform: translateY(-1px);
    }

    .game-race-desktop-widget {
        appearance: none;
        -webkit-appearance: none;
        position: absolute;
        top: .9rem;
        right: .9rem;
        z-index: 35;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 2.7rem;
        padding: 0;
        border: 1px solid rgba(255, 255, 255, .10);
        border-radius: 999px;
        background:
                radial-gradient(circle at top right, color-mix(in srgb, var(--race-accent) 14%, transparent 86%), transparent 30%),
                linear-gradient(
                        180deg,
                        color-mix(in srgb, var(--race-bg) 72%, black 28%),
                        color-mix(in srgb, var(--race-bg) 84%, black 16%)
                );
        box-shadow:
                0 .75rem 1.4rem rgba(0, 0, 0, .22),
                inset 0 1px 0 rgba(255, 255, 255, .03);
        backdrop-filter: blur(.8rem);
        cursor: pointer;
        transition: opacity .18s ease, transform .18s ease, border-color .18s ease, box-shadow .18s ease;
        color: var(--race-text);
        text-decoration: none;
        outline: none;
        user-select: none;
        opacity: 0;
        pointer-events: none;
        transform: translateY(-6px);
    }

    .game-race-desktop-widget:hover {
        transform: translateY(-7px) scale(1.03);
        border-color: rgba(255, 255, 255, .16);
        box-shadow:
                0 .9rem 1.7rem rgba(0, 0, 0, .26),
                inset 0 1px 0 rgba(255, 255, 255, .04);
    }

    .game-race-desktop-widget.is-visible {
        opacity: 1;
        pointer-events: auto;
        transform: translateY(0);
    }

    .game-race-desktop-widget-inner {
        display: inline-flex;
        align-items: center;
        gap: .5rem;
        padding: 0 .9rem 0 .74rem;
        min-height: 2.7rem;
        position: relative;
    }

    .game-race-desktop-widget-inner::before {
        content: "";
        width: .14rem;
        align-self: stretch;
        border-radius: 999px;
        background: linear-gradient(
                180deg,
                var(--race-accent) 0%,
                color-mix(in srgb, var(--race-accent) 25%, transparent 75%) 100%
        );
        flex: 0 0 auto;
    }

    .game-race-desktop-icon {
        color: var(--race-accent);
        font-size: .92rem;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
    }

    .game-race-desktop-label {
        display: none;
    }

    .game-race-desktop-rank {
        color: var(--race-text);
        font-size: 1rem;
        font-weight: 900;
        line-height: 1;
        white-space: nowrap;
    }

    .game-race-desktop-top,
    .game-race-desktop-title,
    .game-race-desktop-main,
    .game-race-desktop-rank-wrap,
    .game-race-desktop-score-wrap,
    .game-race-desktop-prize-wrap,
    .game-race-desktop-rank-label,
    .game-race-desktop-score-label,
    .game-race-desktop-prize-label,
    .game-race-desktop-score,
    .game-race-desktop-prize {
        display: none !important;
    }

    .game-race-mobile-pill {
        appearance: none;
        -webkit-appearance: none;
        position: fixed;
        top: 5.15rem;
        right: .7rem;
        z-index: 30000010;
        display: none;
        align-items: center;
        gap: .42rem;
        min-height: 2.25rem;
        padding: 0 .72rem 0 .64rem;
        border: 1px solid rgba(255, 255, 255, .10);
        border-radius: 999px;
        background:
                radial-gradient(circle at top right, color-mix(in srgb, var(--race-accent) 14%, transparent 86%), transparent 28%),
                linear-gradient(
                        180deg,
                        color-mix(in srgb, var(--race-bg) 70%, black 30%),
                        color-mix(in srgb, var(--race-bg) 82%, black 18%)
                );
        backdrop-filter: blur(.8rem);
        color: var(--race-text);
        box-shadow:
                0 .6rem 1.2rem rgba(0, 0, 0, .22),
                inset 0 1px 0 rgba(255, 255, 255, .03);
        outline: none;
        user-select: none;
        opacity: 0;
        pointer-events: none;
        transform: translateY(-6px);
        transition: opacity .18s ease, transform .18s ease, border-color .18s ease;
    }

    .game-race-mobile-pill::before {
        content: "";
        width: .14rem;
        align-self: stretch;
        border-radius: 999px;
        background: linear-gradient(
                180deg,
                var(--race-accent) 0%,
                color-mix(in srgb, var(--race-accent) 25%, transparent 75%) 100%
        );
        flex: 0 0 auto;
    }

    .game-race-mobile-pill.is-visible {
        opacity: 1;
        pointer-events: auto;
        transform: translateY(0);
    }

    .game-race-mobile-pill-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        color: var(--race-accent);
        font-size: .86rem;
        flex: 0 0 auto;
    }

    .game-race-mobile-pill-text {
        display: none;
    }

    .game-race-mobile-pill-rank {
        color: var(--race-text);
        font-size: .9rem;
        font-weight: 900;
        line-height: 1;
        letter-spacing: -.01em;
        white-space: nowrap;
    }

    .game-race-modal-body {
        min-height: 0;
        color: var(--race-text);
    }

    .game-race-modal-top {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: .82rem;
        align-items: start;
        margin-bottom: .95rem;
    }

    .game-race-modal-left {
        min-width: 0;
    }

    .game-race-modal-top-right {
        display: grid;
        grid-template-columns: minmax(6.4rem, 1fr) minmax(8rem, 1.18fr) minmax(5.4rem, .9fr);
        gap: .48rem;
        width: 100%;
    }

    .game-race-modal-join-row {
        margin: 0 0 .9rem 0;
    }

    .game-race-modal-join-btn {
        width: 100%;
        min-height: 2.7rem;
    }

    .game-race-modal-board-head,
    .game-race-modal-row {
        display: grid;
        grid-template-columns: 3.3rem minmax(0, 1fr) minmax(7rem, 1fr) 4.7rem;
        gap: .66rem;
        align-items: center;
    }

    .game-race-modal-board-head {
        padding: 0 .56rem .42rem;
        color: var(--race-text-muted);
        font-size: .61rem;
        font-weight: 800;
        line-height: 1;
        letter-spacing: .08em;
        text-transform: uppercase;
    }

    .game-race-modal-board-head > div:nth-child(3),
    .game-race-modal-board-head > div:last-child {
        text-align: right;
    }

    .game-race-modal-row {
        position: relative;
        min-height: 3.18rem;
        padding: 0 .56rem;
        border-radius: .88rem;
        border: 1px solid rgba(255, 255, 255, .04);
        background: rgba(255, 255, 255, .025);
    }

    #gameRaceModal .iziModal-wrap {
        border-radius: 1rem !important;
        overflow: hidden !important;
    }

    #gameRaceModal .iziModal-content {
        background:
                radial-gradient(circle at top right, color-mix(in srgb, var(--color1, #2ee58f) 12%, transparent 88%), transparent 24%),
                linear-gradient(180deg, rgba(255, 255, 255, .02), rgba(255, 255, 255, .01)),
                linear-gradient(
                        180deg,
                        color-mix(in srgb, var(--color4, #101820) 60%, black 40%) 0%,
                        color-mix(in srgb, var(--color4, #101820) 76%, black 24%) 100%
                ) !important;
        color: var(--color2, #fff) !important;
    }

    #gameRaceModal .iziModal-header {
        background:
                linear-gradient(
                        180deg,
                        color-mix(in srgb, var(--color1, #2ee58f) 24%, var(--color4, #101820) 76%),
                        color-mix(in srgb, var(--color1, #2ee58f) 12%, var(--color4, #101820) 88%)
                ) !important;
        border-bottom: 1px solid rgba(255, 255, 255, .06) !important;
    }

    #gameRaceModal .iziModal-header-title {
        color: var(--color2, #fff) !important;
        font-weight: 800 !important;
    }

    #gameRaceModal .iziModal-header-subtitle {
        color: color-mix(in srgb, var(--color2, #fff) 72%, transparent 28%) !important;
    }

    #gameRaceModal .iziModal-button-close {
        background: rgba(255, 255, 255, .08) !important;
        border-radius: 999px !important;
    }

    @media (min-width: 62rem) {
        .game-race-widget {
            border-radius: 1.15rem;
            background:
                    radial-gradient(circle at 88% 18%, color-mix(in srgb, var(--race-accent) 11%, transparent 89%), transparent 24%),
                    radial-gradient(circle at 14% -8%, rgba(255,255,255,.05), transparent 24%),
                    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015)),
                    linear-gradient(180deg, var(--race-bg-top) 0%, var(--race-bg-bottom) 100%);
            box-shadow:
                    inset 0 1px 0 rgba(255,255,255,.035),
                    0 1rem 2.2rem rgba(0,0,0,.18);
        }

        .game-race-widget-top {
            grid-template-columns: minmax(0, 1fr) minmax(28rem, 40rem);
            gap: 1rem;
            padding: 1.05rem 1.1rem .98rem;
        }

        .game-race-widget-top.has-inline-join {
            grid-template-columns: minmax(0, 1fr) auto;
            grid-template-areas:
            "left cta"
            "right right";
        }

        .game-race-widget-top.has-inline-join .game-race-widget-cta {
            align-self: start;
            justify-self: end;
        }

        .game-race-widget-top.has-inline-join .game-race-widget-right {
            width: 100%;
        }

        .game-race-widget-title {
            font-size: 1.12rem;
            line-height: 1.05;
            font-weight: 900;
        }

        .game-race-widget-meta {
            font-size: .86rem;
        }

        .game-race-widget-right {
            grid-template-columns: minmax(0, 1fr) minmax(7.1rem, .8fr) minmax(8.1rem, .95fr) minmax(6rem, .72fr);
            gap: .55rem;
        }

        .game-race-widget-mybox {
            min-height: 4.05rem;
            padding: .64rem .68rem;
            border-radius: .9rem;
            background:
                    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.018)),
                    rgba(0,0,0,.12);
            border: 1px solid rgba(255,255,255,.05);
            box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
        }
    }

    @media (min-width: 75rem) {
        .game-race-widget-top {
            grid-template-columns: minmax(0, 1fr) minmax(30rem, 42rem);
        }

        .game-race-widget-right {
            grid-template-columns: minmax(0, 1fr) minmax(7.3rem, .8fr) minmax(8.4rem, .95fr) minmax(6.2rem, .72fr);
        }
    }

    @media (max-width: 61.9375rem) {
        .game-race-desktop-widget {
            display: none !important;
        }

        .game-race-mobile-pill {
            display: inline-flex;
        }

        .game-race-widget {
            border-radius: 1rem;
        }

        .game-race-widget-top,
        .game-race-widget-top.has-inline-join {
            grid-template-columns: 1fr;
            grid-template-areas:
                "left"
                "cta"
                "right";
            gap: .72rem;
            padding: .86rem .82rem .82rem;
        }

        .game-race-widget-title-row {
            gap: .42rem;
            align-items: flex-start;
        }

        .game-race-widget-title {
            font-size: .96rem;
            line-height: 1.08;
        }

        .game-race-widget-status {
            min-height: 1.42rem;
            padding: 0 .56rem;
            font-size: .58rem;
        }

        .game-race-widget-meta {
            font-size: .78rem;
            line-height: 1.24;
        }

        .game-race-widget-cta {
            width: 100%;
            justify-content: stretch;
        }

        .game-race-join-btn {
            width: 100%;
            min-width: 0;
        }

        .game-race-widget-right {
            grid-template-columns: 1fr 1fr 1fr;
            gap: .4rem;
            width: 100%;
        }

        .game-race-widget-mybox,
        .game-race-modal-mybox {
            min-height: 3.7rem;
            padding: .58rem .52rem;
            border-radius: .78rem;
        }

        .game-race-widget-my-label,
        .game-race-modal-my-label {
            margin-bottom: .22rem;
            font-size: .48rem;
        }

        .game-race-widget-my-rank,
        .game-race-widget-my-score,
        .game-race-modal-my-value {
            font-size: .88rem;
            line-height: 1.08;
        }

        .game-race-widget-my-rank-icon {
            font-size: .8rem;
        }

        .game-race-widget-mybox-prize .game-race-widget-my-score,
        .game-race-modal-mybox-prize .game-race-modal-my-value {
            font-size: .64rem;
            line-height: 1.12;
        }

        .game-race-widget-board {
            padding: .68rem .72rem .78rem;
        }

        .game-race-widget-board-head,
        .game-race-widget-row {
            grid-template-columns: 2.85rem minmax(0, 1fr) minmax(5.8rem, .95fr) 4rem;
            gap: .52rem;
        }

        .game-race-widget-board-head {
            padding: 0 .58rem .38rem;
            font-size: .55rem;
        }

        .game-race-widget-row {
            min-height: 2.95rem;
            padding: 0 .58rem;
        }

        .game-race-widget-rank,
        .game-race-modal-rank {
            font-size: .96rem;
        }

        .game-race-widget-user,
        .game-race-modal-user {
            font-size: .86rem;
        }

        .game-race-widget-prize,
        .game-race-modal-prize-col {
            font-size: .68rem;
            line-height: 1.08;
        }

        .game-race-widget-score,
        .game-race-modal-score {
            font-size: .84rem;
        }

        .game-race-modal-top-right {
            grid-template-columns: 1fr 1fr 1fr;
            gap: .4rem;
            width: 100%;
        }

        .game-race-modal-board-head,
        .game-race-modal-row {
            grid-template-columns: 2.85rem minmax(0, 1fr) minmax(5.8rem, .95fr) 4rem;
            gap: .52rem;
        }

        .game-race-modal-board-head {
            font-size: .55rem;
        }

        .game-race-modal-row {
            min-height: 3rem;
        }
    }

    @media (max-width: 40rem) {
        .game-race-mobile-pill {
            top: 4.75rem;
            right: .55rem;
            min-height: 2.1rem;
            padding: 0 .64rem 0 .56rem;
            gap: .36rem;
        }

        .game-race-mobile-pill-rank {
            font-size: .84rem;
        }

        .game-race-mobile-pill-icon {
            font-size: .8rem;
        }

        .game-race-widget-top,
        .game-race-widget-top.has-inline-join {
            padding: .8rem .76rem .78rem;
            gap: .68rem;
        }

        .game-race-widget-kicker,
        .game-race-modal-kicker {
            font-size: .58rem;
        }

        .game-race-widget-title,
        .game-race-modal-title {
            font-size: .91rem;
        }

        .game-race-widget-meta,
        .game-race-modal-prize {
            font-size: .73rem;
        }

        .game-race-widget-right,
        .game-race-modal-top-right {
            grid-template-columns: 1fr 1fr 1fr;
            gap: .34rem;
        }

        .game-race-widget-mybox,
        .game-race-modal-mybox {
            min-height: 3.5rem;
            padding: .54rem .44rem;
        }

        .game-race-widget-my-label,
        .game-race-modal-my-label {
            font-size: .45rem;
        }

        .game-race-widget-my-rank,
        .game-race-widget-my-score,
        .game-race-modal-my-value {
            font-size: .8rem;
        }

        .game-race-widget-mybox-prize .game-race-widget-my-score,
        .game-race-modal-mybox-prize .game-race-modal-my-value {
            font-size: .58rem;
            line-height: 1.1;
        }

        .game-race-widget-board-head,
        .game-race-widget-row,
        .game-race-modal-board-head,
        .game-race-modal-row {
            grid-template-columns: 2.35rem minmax(0, 1fr) 4.6rem 3.6rem;
            gap: .42rem;
        }

        .game-race-widget-board-head,
        .game-race-modal-board-head {
            font-size: .51rem;
        }

        .game-race-widget-row,
        .game-race-modal-row {
            min-height: 2.82rem;
        }

        .game-race-widget-rank,
        .game-race-modal-rank {
            font-size: .88rem;
        }

        .game-race-widget-user,
        .game-race-modal-user {
            font-size: .8rem;
        }

        .game-race-widget-prize,
        .game-race-modal-prize-col {
            font-size: .61rem;
        }

        .game-race-widget-score,
        .game-race-modal-score {
            font-size: .76rem;
        }

        .game-race-widget-expand,
        .game-race-modal-expand-btn {
            height: 2.34rem;
            font-size: .74rem;
        }
    }

    @media (max-width: 22.5rem) {
        .game-race-widget-board-head,
        .game-race-modal-board-head {
            display: none;
        }

        .game-race-widget-row,
        .game-race-modal-row {
            grid-template-columns: 2.1rem minmax(0, 1fr) 4rem;
        }

        .game-race-widget-score,
        .game-race-modal-score {
            display: none;
        }

        .game-race-widget-mybox,
        .game-race-modal-mybox {
            padding: .5rem .38rem;
        }

        .game-race-widget-my-rank,
        .game-race-widget-my-score,
        .game-race-modal-my-value {
            font-size: .75rem;
        }

        .game-race-widget-mybox-prize .game-race-widget-my-score,
        .game-race-modal-mybox-prize .game-race-modal-my-value {
            font-size: .54rem;
        }
    }


    .game-race-widget-row.game-race-widget-row-empty {
        display: flex !important;
        align-items: center !important;
        width: 100% !important;
        min-height: 0 !important;
        padding: .78rem .9rem !important;
        border-radius: .88rem;
        border: 1px solid rgba(255,255,255,.05);
        background: rgba(255,255,255,.02);
    }

    .game-race-widget-row.game-race-widget-row-empty > div {
        display: block !important;
        width: 100% !important;
        grid-column: 1 / -1 !important;
        color: rgba(255,255,255,.82) !important;
        font-size: .98rem !important;
        font-weight: 700 !important;
        line-height: 1.45 !important;
        text-align: left !important;
        white-space: normal !important;
    }

    @media (max-width: 61.9375rem) {
        .game-race-widget-row.game-race-widget-row-empty {
            padding: .68rem .78rem !important;
            min-height: 0 !important;
        }

        .game-race-widget-row.game-race-widget-row-empty > div {
            font-size: .88rem !important;
            line-height: 1.4 !important;
        }
    }

    @media (max-width: 40rem) {
        .game-race-widget-row.game-race-widget-row-empty {
            padding: .62rem .72rem !important;
        }

        .game-race-widget-row.game-race-widget-row-empty > div {
            font-size: .82rem !important;
            line-height: 1.35 !important;
        }
    }
