.gamebadge {
    --badge-bg:     transparent;
    --badge-inset:  transparent;
    --badge-glow-1: rgba(255,255,255,.8);
    --badge-glow-2: rgba(255,255,255,.25);
    --badge-glow-3: rgba(255,255,255,1);
    --badge-icon-w: 28px;
    --badge-icon-h: 28px;
    background: var(--badge-bg);
    box-shadow:
        0 -4px 6px 0 var(--badge-inset) inset,
        0  2px 3px 0 rgba(255,255,255,.62) inset,
        0  4px 6px 0 rgba(0,0,0,.25);
}

/* Fallback text glow — overridden per-badge by explicit span rules in skin CSS */
.gamebadge span {
    text-shadow:
        0 0 14px var(--badge-glow-1),
        0 0  8px var(--badge-glow-2),
        0 0 24px var(--badge-glow-3);
}

[data-theme="lonestar"] {

    --bp-red-bg:     linear-gradient(180deg, rgba(110,0,2,.70) 28%, rgba(248,0,4,.70) 100%);
    --bp-red-inset:  rgba(255,0,4,.71);
    --bp-red-glow:   rgba(255,31,35,.8);

    --bp-crimson-bg:     linear-gradient(180deg, rgba(110,0,35,.70) 28%, rgba(248,0,91,.70) 100%);
    --bp-crimson-inset:  rgba(255,31,240,.71);
    --bp-crimson-glow:   rgba(255,31,251,.8);

    --bp-indigo-bg:     linear-gradient(180deg, rgba(50,0,110,.70) 28%, rgba(120,0,248,.70) 100%);
    --bp-indigo-inset:  rgba(124,31,255,.71);
    --bp-indigo-glow:   rgba(171,44,255,.8);

    --bp-violet-bg:     linear-gradient(180deg, rgba(50,0,110,.70) 28%, rgba(149,74,255,.70) 100%);
    --bp-violet-inset:  rgba(218,31,255,.71);

    --bp-indigo-violet-bg:     linear-gradient(180deg, rgba(0,9,110,.70) 28%, rgba(155,72,255,.70) 100%);
    --bp-indigo-violet-inset:  rgba(179,162,255,.71);

    --bp-magenta-bg:     linear-gradient(180deg, rgba(108,0,110,.70) 28%, rgba(255,72,243,.70) 100%);
    --bp-magenta-inset:  rgba(255,0,225,.71);

    --bp-crimson-pink-bg:     linear-gradient(180deg, rgba(110,0,53,.70) 28%, rgba(255,23,78,.70) 100%);
    --bp-crimson-pink-inset:  rgba(255,93,134,.71);

    --bp-green-bg:     linear-gradient(180deg, rgba(6,110,0,.70) 28%, rgba(72,255,133,.70) 100%);
    --bp-green-inset:  rgba(162,255,190,.71);

    --bp-emerald-bg:     linear-gradient(180deg, rgba(0,101,53,.70) 28%, rgba(0,238,126,.70) 100%);
    --bp-emerald-inset:  rgba(31,255,80,.71);

    --bp-gold-bg:     linear-gradient(180deg, rgba(110,81,0,.70) 28%, rgba(255,230,39,.70) 100%);
    --bp-gold-inset:  rgba(255,217,0,.71);

    --bp-navy-bg:     linear-gradient(180deg, rgba(0,6,110,.70) 28%, rgba(45,0,248,.70) 100%);
    --bp-navy-inset:  rgba(31,42,255,.71);

    --bp-royal-bg:     linear-gradient(180deg, rgba(10,0,152,.70) 28%, rgba(48,40,255,.70) 100%);
    --bp-royal-inset:  rgba(31,121,255,.71);

    --bp-teal-bg:     linear-gradient(180deg, rgba(0,75,110,.70) 28%, rgba(0,223,248,.70) 100%);
    --bp-teal-inset:  rgba(31,240,255,.71);


    --bp-orange-bg:     linear-gradient(180deg, rgba(255,174,88,.85) 28%, rgba(255,63,66,.85) 100%);
    --bp-orange-inset:  rgba(255,248,31,.71);

    .gamebadge-img:not(img) {
        width: var(--badge-icon-w);
        height: var(--badge-icon-h);
        flex-shrink: 0;
    }


    .gameboxbigimg .gamebadge {
        --badge-icon-w: 44px;
        --badge-icon-h: 44px;
    }

   
    .gamebadge-sprite {
        position:            absolute;
        left:                calc(-1 * var(--badge-icon-w) / 2);
        top:                 50%;
        transform:           translateY(-50%);
        background-image:    url('/img/150/badge-icons/badge-sprite.png');
        background-repeat:   no-repeat;
        background-size:     calc(5 * var(--badge-icon-w)) calc(5 * var(--badge-icon-h));
        background-position: calc(var(--spr-x, 0) * -1 * var(--badge-icon-w))
                             calc(var(--spr-y, 0) * -1 * var(--badge-icon-h));
    }


    .gamebadge-live-event::before,
    .gamebadge-live-promo::before {
        content: '';
        display: inline-block;
        width: 7px;
        height: 7px;
        border-radius: 50%;
        background: #fff;
        margin-right: 5px;
        flex-shrink: 0;
        box-shadow: 0 0 8px rgba(255,31,35,.9), 0 0 14px rgba(255,31,34,1);
    }
}