/* _content/LiveEventBingo.Shared/Pages/Common/Pages/HomePage/HeroDeviceBoard.razor.rz.scp.css */


.hero-device[b-ordsaxw8gg] {
    container-type: inline-size;
    inline-size: 100%;
}


.hero-device__body[b-ordsaxw8gg] {
    position: relative;
    box-sizing: border-box;
    padding: 3cqw;
    background: var(--meb-border-default);
    border-radius: 13cqw;
    box-shadow: 0 0 0 0.9cqw var(--meb-border-pagination-item), var(--meb-shadow-lg);
}

.hero-device__body[b-ordsaxw8gg]::before,
.hero-device__body[b-ordsaxw8gg]::after {
    content: "";
    position: absolute;
    inline-size: 1.4cqw;
    background: var(--meb-border-pagination-item);
}

.hero-device__body[b-ordsaxw8gg]::before {
    inset-inline-end: -2cqw;
    inset-block-start: 30cqw;
    block-size: 12cqw;
    border-radius: 0 0.8cqw 0.8cqw 0;
}

.hero-device__body[b-ordsaxw8gg]::after {
    inset-inline-start: -2cqw;
    inset-block-start: 24cqw;
    block-size: 20cqw;
    border-radius: 0.8cqw 0 0 0.8cqw;
}


.hero-device__screen[b-ordsaxw8gg] {
    container-type: inline-size;
    position: relative;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    inline-size: 100%;
    aspect-ratio: 423 / 800;
    padding-inline: 4.7cqw;
    overflow: hidden;
    background: var(--meb-surface-section-startplaying-media);
    border-radius: 10cqw;
    color: var(--meb-text-default);
    font-family: var(--meb-font-family-primary);
}



.hero-device__status[b-ordsaxw8gg] {
    position: absolute;
    inset: 0 0 auto 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    block-size: 8cqw;
    padding-inline: 5cqw;
    background: var(--meb-surface-input-filled);
    color: var(--meb-text-muted);
    font-size: 3.8cqw;
    font-weight: var(--meb-font-weight-semibold);
}

.hero-device__camera[b-ordsaxw8gg] {
    position: absolute;
    inset-inline-start: 50%;
    inset-block-start: 50%;
    inline-size: 3cqw;
    block-size: 3cqw;
    transform: translate(-50%, -50%);
    background: var(--meb-border-default);
    border-radius: var(--meb-border-radius-full);
}

.hero-device__sys[b-ordsaxw8gg] {
    display: flex;
    align-items: center;
    gap: 2cqw;
}

.hero-device__wifi[b-ordsaxw8gg] {
    inline-size: 3.6cqw;
    block-size: 3cqw;
    background: var(--meb-text-muted);
    clip-path: polygon(50% 100%, 0 25%, 50% 0, 100% 25%);
}

.hero-device__signal[b-ordsaxw8gg] {
    inline-size: 3.4cqw;
    block-size: 3.2cqw;
    background: var(--meb-border-muted);
    clip-path: polygon(0 100%, 100% 100%, 100% 0);
}

.hero-device__battery[b-ordsaxw8gg] {
    padding: 0.3cqw 1.6cqw;
    background: var(--meb-text-muted);
    border-radius: 2cqw;
    color: var(--meb-text-inverse);
    font-size: 3.2cqw;
    font-weight: var(--meb-font-weight-bold);
    line-height: 1.3;
}



.hero-device__top[b-ordsaxw8gg] {
    flex: none;
    display: flex;
    align-items: center;
    gap: 3.2cqw;
    margin-block-start: 11cqw;
}

.hero-device__avatar[b-ordsaxw8gg] {
    flex: none;
    display: block;
    box-sizing: border-box;
    inline-size: 10.4cqw;
    block-size: 10.4cqw;
    padding: 1cqw;
    background: var(--meb-surface-card);
    border: 0.5cqw solid var(--meb-border-inverse);
    border-radius: var(--meb-border-radius-full);
    object-fit: contain;
}

.hero-device__title[b-ordsaxw8gg] {
    flex: 1;
    font-size: 7.2cqw;
    font-weight: var(--meb-font-weight-bold);
    line-height: 1;
}

.hero-device__share[b-ordsaxw8gg] {
    flex: none;
    display: grid;
    place-items: center;
    inline-size: 18cqw;
    block-size: 12cqw;
    background: var(--meb-surface-button-qrprimary);
    border: 0.6cqw solid var(--meb-border-default);
    border-radius: 5cqw;
    box-shadow: 0.9cqw 1cqw 0 0 var(--meb-border-default);
    color: var(--meb-border-default);
}

.hero-device__share svg[b-ordsaxw8gg] {
    inline-size: 6.4cqw;
    block-size: 6.4cqw;
}



.hero-device__card[b-ordsaxw8gg] {
    flex: none;
    box-sizing: border-box;
    margin-block-start: 6cqw;
    padding: 2.8cqw;
    background: var(--meb-surface-card);
    border: 0.5cqw solid var(--meb-border-default);
    border-radius: 7.5cqw;
}

.hero-device__letters[b-ordsaxw8gg] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    align-items: center;
    margin-block-end: 2.4cqw;
    background: var(--meb-surface-disabled);
    border-radius: var(--meb-border-radius-full);
}

.hero-device__letter[b-ordsaxw8gg] {
    display: grid;
    place-items: center;
    block-size: 19.5cqw;
    font-size: 8.8cqw;
    font-weight: var(--meb-font-weight-extrabold);
    line-height: 1;
}

.hero-device__letter--lead[b-ordsaxw8gg] {
    background: var(--meb-surface-section-startplaying-media);
    border-radius: var(--meb-border-radius-full);
    color: var(--meb-text-inverse);
}



.hero-device__grid[b-ordsaxw8gg] {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.hero-device__square[b-ordsaxw8gg] {
    position: relative;
    display: grid;
    place-items: center;
    aspect-ratio: 1 / 1;
    padding: 0.8cqw;
    border-block-end: 0.5cqw solid var(--meb-border-subtle);
    border-inline-end: 0.5cqw solid var(--meb-border-subtle);
}

.hero-device__square:nth-child(5n)[b-ordsaxw8gg] {
    border-inline-end: 0;
}

.hero-device__square:nth-last-child(-n + 5)[b-ordsaxw8gg] {
    border-block-end: 0;
}

.hero-device__square--r1[b-ordsaxw8gg] {
    --mark-rotate: 112deg;
}

.hero-device__square--r2[b-ordsaxw8gg] {
    --mark-rotate: 5deg;
}


.hero-device__splat[b-ordsaxw8gg],
.hero-device__splat-color[b-ordsaxw8gg] {
    position: absolute;
    inset: -6%;
    inline-size: 112%;
    block-size: 112%;
    transform: rotate(var(--mark-rotate, 0deg));
    pointer-events: none;
}

.hero-device__splat[b-ordsaxw8gg] {
    object-fit: cover;
    opacity: 0.12;
}

.hero-device__splat-color[b-ordsaxw8gg] {
    background: var(--meb-surface-section-startplaying-media);
    -webkit-mask-image: url('/_content/LiveEventBingo.Shared/css/assets/images/logos/G4.png');
    -webkit-mask-size: cover;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-image: url('/_content/LiveEventBingo.Shared/css/assets/images/logos/G4.png');
    mask-size: cover;
    mask-position: center;
    mask-repeat: no-repeat;
    mask-mode: alpha;
    mix-blend-mode: multiply;
    opacity: 0.55;
}

.hero-device__label[b-ordsaxw8gg] {
    position: relative;
    z-index: 1;
    font-size: 3.5cqw;
    font-weight: var(--meb-font-weight-bold);
    line-height: 1.15;
    text-align: center;
    hyphens: manual;
}



.hero-device__tabs[b-ordsaxw8gg] {
    flex: none;
    box-sizing: border-box;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    align-items: center;
    margin-block-start: 5.5cqw;
    padding: 2cqw;
    background: var(--meb-surface-card);
    border: 0.5cqw solid var(--meb-border-default);
    border-radius: 7.5cqw;
    box-shadow: 1.2cqw 1.2cqw 0 0 var(--meb-border-default);
    font-size: 3.9cqw;
    font-weight: var(--meb-font-weight-medium);
    line-height: 1;
    text-align: center;
}

.hero-device__tab[b-ordsaxw8gg] {
    display: grid;
    place-items: center;
    block-size: 10cqw;
}

.hero-device__tab--active[b-ordsaxw8gg] {
    background: var(--meb-surface-section-startplaying-media);
    border-radius: var(--meb-border-radius-full);
    color: var(--meb-text-inverse);
    font-weight: var(--meb-font-weight-semibold);
}



.hero-device__chrome[b-ordsaxw8gg] {
    flex: none;
    margin-block-start: auto;
    
    margin-inline: -5cqw;
    padding-block: 1.6cqw 1.4cqw;
    background: var(--meb-surface-card);
    color: var(--meb-text-muted);
}

.hero-device__addr[b-ordsaxw8gg] {
    display: flex;
    align-items: center;
    gap: 4cqw;
    margin-inline: 3cqw;
    block-size: 9cqw;
}

.hero-device__pill[b-ordsaxw8gg] {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 3cqw;
    block-size: 100%;
    padding-inline: 4cqw;
    overflow: hidden;
    background: var(--meb-surface-disabled);
    border-radius: var(--meb-border-radius-full);
    font-size: 4.2cqw;
    font-weight: var(--meb-font-weight-medium);
    white-space: nowrap;
}

.hero-device__shield[b-ordsaxw8gg] {
    flex: none;
    inline-size: 4.2cqw;
    block-size: 4.8cqw;
    border: 0.5cqw solid currentColor;
    border-radius: 0.6cqw 0.6cqw 2.2cqw 2.2cqw;
}

.hero-device__plus[b-ordsaxw8gg] {
    font-size: 7cqw;
    line-height: 1;
}

.hero-device__count[b-ordsaxw8gg] {
    display: grid;
    place-items: center;
    inline-size: 5.2cqw;
    block-size: 5.2cqw;
    border: 0.5cqw solid currentColor;
    border-radius: 1.1cqw;
    font-size: 2.8cqw;
    font-weight: var(--meb-font-weight-bold);
}

.hero-device__more[b-ordsaxw8gg] {
    font-size: 5.4cqw;
    font-weight: var(--meb-font-weight-bold);
    line-height: 1;
}

.hero-device__nav[b-ordsaxw8gg] {
    display: flex;
    align-items: center;
    justify-content: space-around;
    block-size: 7cqw;
    padding-inline: 14cqw;
}

.hero-device__nav-a[b-ordsaxw8gg] {
    font-size: 4.4cqw;
    font-weight: var(--meb-font-weight-bold);
    letter-spacing: 0.3cqw;
    line-height: 1;
}

.hero-device__nav-b[b-ordsaxw8gg] {
    inline-size: 4.4cqw;
    block-size: 4.4cqw;
    border: 0.5cqw solid currentColor;
    border-radius: var(--meb-border-radius-full);
}

.hero-device__nav-c[b-ordsaxw8gg] {
    inline-size: 3.2cqw;
    block-size: 3.2cqw;
    border-block-end: 0.5cqw solid currentColor;
    border-inline-start: 0.5cqw solid currentColor;
    transform: rotate(45deg);
}
/* _content/LiveEventBingo.Shared/Pages/Common/Pages/HomePage/HomepageDesktop.razor.rz.scp.css */




[b-3h4f88f3jq] .homepage-desktop {
    width: 100%;
}




[b-3h4f88f3jq] .hp-section {
    padding-block: var(--meb-space-stack-none);
}
    
    [b-3h4f88f3jq] .hp-section > .ui-container > * {
        padding-left: var(--meb-space-container-xl);
        padding-right: var(--meb-space-container-xl);
    }
[b-3h4f88f3jq] .hp-hero {
    background: var(--meb-surface-hero-background);
}

[b-3h4f88f3jq] .hp-hero-panel {
    position: relative;
    overflow: hidden;
}

[b-3h4f88f3jq] .hp-hero-copy-shell {
    box-sizing: border-box;
    width: 100%;
    padding-inline: var(--meb-space-container-lg);
}

[b-3h4f88f3jq] .hp-hero-copy-wrap {
    width: 100%;
    max-width: 520px;
}

[b-3h4f88f3jq] .hp-hero-title {
    margin: var(--meb-space-stack-none);
    max-inline-size: 520px;
    color: var(--meb-text-inverse);
    font-family: var(--meb-font-family-accent);
    font-size: var(--meb-font-size-display-desktop);
    font-weight: var(--meb-font-weight-regular);
    line-height: var(--meb-font-lineheight-display);
}

[b-3h4f88f3jq] .hp-hero-body {
    margin: var(--meb-space-stack-none);
    max-inline-size: 500px;
    color: var(--meb-text-inverse);
    font-family: var(--meb-font-family-primary);
    font-size: var(--meb-font-size-body-desktop);
    font-weight: var(--meb-font-weight-regular);
    line-height: var(--meb-font-lineheight-body);
}

[b-3h4f88f3jq] .hp-hero-art-stage {
    position: relative;
    min-block-size: 38rem;
    overflow: hidden;
}

[b-3h4f88f3jq] .hp-hero-dots-wrap {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 906px;
    height: 827px;
    transform: rotate(12deg);
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
}

[b-3h4f88f3jq] .hp-hero-dots.decorative-svg {
    inline-size: 100%;
    block-size: auto;
}


[b-3h4f88f3jq] .hp-hero-board-wrap {
    position: absolute;
    inset-block-end: 1rem;
    inset-inline-end: 12%;
    inline-size: min(18.75rem, 70%);
    z-index: 1;
    transform: rotate(6deg);
    transform-origin: bottom center;
}




[b-3h4f88f3jq] .hp-hero-rotator-link {
    --hp-rotator-row: 56px;
    display: flex;
    
    flex-wrap: wrap;
    align-items: center;
    
    gap: var(--meb-space-inline-sm);
    
    padding-block-end: var(--meb-space-stack-xs);
    text-decoration: none;
}

[b-3h4f88f3jq] .hp-hero-rotator-label {
    color: var(--meb-text-inverse);
    font-family: var(--meb-font-family-primary);
    font-size: var(--meb-font-size-h3-mobile);
    font-weight: var(--meb-font-weight-semibold);
    white-space: nowrap;
}

[b-3h4f88f3jq] .hp-hero-rotator-window {
    display: block;
    
    block-size: calc(var(--hp-rotator-row) + 2 * var(--meb-border-width-medium));
    overflow: hidden;
    background: var(--meb-surface-card);
    border: var(--meb-border-width-medium) solid var(--meb-border-default);
    border-radius: var(--meb-border-radius-sm);
    box-shadow: var(--meb-shadow-surface-comic);
    transition: box-shadow var(--meb-motion-fast);
}

[b-3h4f88f3jq] .hp-hero-rotator-link:hover .hp-hero-rotator-window {
    box-shadow: var(--meb-shadow-surface-comic-sm);
}


[b-3h4f88f3jq] .hp-hero-rotator-link:hover .hp-hero-rotator-track,
[b-3h4f88f3jq] .hp-hero-rotator-link:focus-within .hp-hero-rotator-track {
    animation-play-state: paused;
}

[b-3h4f88f3jq] .hp-hero-rotator-track {
    display: flex;
    flex-direction: column;
    animation: hp-hero-rotator-b-3h4f88f3jq 12.6s cubic-bezier(.5, 0, .15, 1) infinite;
}

[b-3h4f88f3jq] .hp-hero-rotator-item {
    display: flex;
    align-items: center;
    block-size: var(--hp-rotator-row);
    
    padding-inline: var(--meb-space-inline-md);
    color: var(--meb-text-default);
    font-family: var(--meb-font-family-accent);
    font-size: var(--meb-font-size-h3-desktop);
    white-space: nowrap;
    
    text-decoration: none;
}

[b-3h4f88f3jq] .hp-hero-rotator-more {
    color: var(--meb-accent-secondary);
    font-family: var(--meb-font-family-primary);
    font-size: var(--meb-font-size-body-desktop);
    font-weight: var(--meb-font-weight-semibold);
    text-decoration: underline;
    text-underline-offset: 4px;
    white-space: nowrap;
}


@keyframes hp-hero-rotator-b-3h4f88f3jq {
    0%, 11.9%       { transform: translateY(0)                                rotate(0deg); }
    14.29%, 26.19%  { transform: translateY(calc(var(--hp-rotator-row) * -1))  rotate(-1.5deg); }
    28.57%, 40.48%  { transform: translateY(calc(var(--hp-rotator-row) * -2))  rotate(1.5deg); }
    42.86%, 54.76%  { transform: translateY(calc(var(--hp-rotator-row) * -3))  rotate(-1deg); }
    57.14%, 69.05%  { transform: translateY(calc(var(--hp-rotator-row) * -4))  rotate(1deg); }
    71.43%, 83.33%  { transform: translateY(calc(var(--hp-rotator-row) * -5))  rotate(-1.5deg); }
    85.71%, 97.62%  { transform: translateY(calc(var(--hp-rotator-row) * -6))  rotate(1.5deg); }
    100%            { transform: translateY(calc(var(--hp-rotator-row) * -7))  rotate(0deg); }
}

@media (prefers-reduced-motion: reduce) {
    [b-3h4f88f3jq] .hp-hero-rotator-track {
        animation: none;
    }
}



[b-3h4f88f3jq] .hp-promo {
    background: var(--meb-surface-section-freecta);
    color: var(--meb-text-inverse);
}



[b-3h4f88f3jq] .hp-start-playing-section {
    background: var(--meb-surface-card);
}


[b-3h4f88f3jq] .hp-start-playing-copy {
    flex: 1;
}


[b-3h4f88f3jq] .hp-game-types {
    background: var(--meb-surface-section-popularcases);
}



[b-3h4f88f3jq] .hp-faq {
    background: var(--meb-surface-section-faq);
}



[b-3h4f88f3jq] .hp-how-it-works {
    padding-block: var(--meb-space-stack-none);
    background: var(--meb-surface-section-howtoplay);
}

[b-3h4f88f3jq] .hp-how-panel {
    position: relative;
    min-block-size: 25rem;
    overflow: hidden;
}

[b-3h4f88f3jq] .hp-how-content {
    position: relative;
    z-index: 1;
    width: 100%;
}

[b-3h4f88f3jq] .hp-how-steps {
    inline-size: 100%;
}

[b-3h4f88f3jq] .hp-how-step-row {
    inline-size: 100%;
}

[b-3h4f88f3jq] .hp-how-step-badge {
    display: inline-flex;
    
    flex: 0 0 auto;
    position: relative;
    z-index: 1;
    align-items: center;
    justify-content: center;
    inline-size: 2.75rem;
    block-size: 2.75rem;
    border: var(--meb-border-width-sm) solid var(--meb-border-pagination-item);
    border-radius: var(--meb-radius-pill);
    background-color: var(--meb-surface-card);
    color: var(--meb-border-pagination-item);
    font-size: var(--meb-font-size-body-desktop);
    font-weight: var(--meb-font-weight-regular);
}

[b-3h4f88f3jq] .hp-how-step-copy {
    
    flex: 1 1 0;
    min-inline-size: 0;
}

[b-3h4f88f3jq] .hp-how-step-copy .hp-body {
    max-width: none;
}

[b-3h4f88f3jq] .hp-how-dots-wrap {
    position: absolute;
    inset-inline-start: 0;
    inset-block-end: 0;
    inline-size: clamp(24rem, 34vw, 34rem);
    transform: translate(-28%, 18%) rotate(14deg);
    transform-origin: bottom left;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
}

[b-3h4f88f3jq] .hp-how-dots.decorative-svg {
    display: block;
    inline-size: 100%;
    block-size: auto;
}

[b-3h4f88f3jq] .hp-how-it-works .hp-heading {
    color: var(--meb-text-pagination-item);
}

[b-3h4f88f3jq] .hp-how-it-works h2.hp-heading {
    font-size: var(--meb-font-size-h1-desktop);
}



[b-3h4f88f3jq] .hp-value-strip-section {
    padding-block: var(--meb-space-stack-none);
    background: var(--meb-surface-section-valueprops);
}

[b-3h4f88f3jq] .hp-value-strip {
    padding-block: var(--meb-space-stack-md);
}

[b-3h4f88f3jq] .hp-value-strip-item {
    width: 100%;
    margin: var(--meb-space-stack-none);
    padding-block: var(--meb-space-stack-xs);
    text-align: center;
    font-family: var(--meb-font-family-primary);
    font-size: var(--meb-font-size-h3-desktop);
    font-weight: var(--meb-font-weight-bold);
    line-height: var(--meb-font-lineheight-heading);
}

[b-3h4f88f3jq] .hp-value-strip-item--downloads {
    color: var(--meb-text-valueprops-downloads);
}

[b-3h4f88f3jq] .hp-value-strip-item--printing {
    color: var(--meb-text-valueprops-printing);
}

[b-3h4f88f3jq] .hp-value-strip-item--paper {
    color: var(--meb-text-valueprops-paper);
}

[b-3h4f88f3jq] .hp-value-strip-item--mess {
    color: var(--meb-text-valueprops-mess);
}



[b-3h4f88f3jq] .hp-split-section {
    
}

[b-3h4f88f3jq] .hp-split-grid {
    overflow: hidden;
}

[b-3h4f88f3jq] .hp-split-panel {
    
    min-block-size: var(--meb-layout-homepage-split-panel-height);
    color: var(--meb-text-default);
}

.hp-split-panel[b-3h4f88f3jq]  .ui-card-wrapper {
    block-size: 100%;
    padding: var(--meb-space-stack-none);
    border-radius: var(--meb-border-radius-none);
    box-shadow: none;
    color: inherit;
}

.hp-split-panel--creator[b-3h4f88f3jq]  .ui-card-wrapper {
    background: var(--meb-surface-section-creator);
}

.hp-split-panel--player[b-3h4f88f3jq]  .ui-card-wrapper {
    background: var(--meb-surface-section-player);
}

[b-3h4f88f3jq] .hp-split-panel-shell,
[b-3h4f88f3jq] .hp-split-panel-layout,
[b-3h4f88f3jq] .hp-split-content {
    block-size: 100%;
}

[b-3h4f88f3jq] .hp-split-content,
[b-3h4f88f3jq] .hp-split-lines {
    inline-size: min(100%, var(--meb-layout-homepage-split-panel-content-width));
}

[b-3h4f88f3jq] .hp-split-cta {
    inline-size: min(100%, var(--meb-layout-homepage-split-panel-content-width));
    max-inline-size: var(--meb-layout-homepage-split-panel-content-width);
    
    justify-content: center;
    --button-background: var(--meb-surface-card);
    --button-foreground: var(--meb-text-pagination-item);
    --button-border: var(--meb-border-default);
    --button-shadow: var(--meb-button-secondary-shadow);
    --meb-button-secondary-hover-background: var(--meb-surface-card);
    --meb-button-secondary-hover-shadow: var(--meb-button-secondary-shadow);
    --meb-button-secondary-active-background: var(--meb-surface-card);
    --meb-button-secondary-active-shadow: var(--meb-button-secondary-shadow);
}

[b-3h4f88f3jq] .hp-split-panel-layout {
    inline-size: 100%;
}

[b-3h4f88f3jq] .hp-split-title {
    margin: var(--meb-space-stack-none);
    color: var(--meb-text-pagination-item);
    font-family: var(--meb-font-family-primary);
    font-size: var(--meb-font-size-h1-desktop);
    font-weight: var(--meb-font-weight-bold);
    line-height: var(--meb-font-lineheight-heading);
    text-align: left;
}

[b-3h4f88f3jq] .hp-split-line {
    margin: var(--meb-space-stack-none);
    color: var(--meb-text-default);
    font-family: var(--meb-font-family-primary);
    font-size: var(--meb-font-size-body-desktop);
    font-weight: var(--meb-font-weight-semibold);
    line-height: var(--meb-font-lineheight-body);
    text-align: left;
}





[b-3h4f88f3jq] .hp-label {
    display: inline-block;
    font-size: var(--meb-font-size-body-sm-desktop);
    font-weight: var(--meb-font-weight-semibold);
    text-transform: uppercase;
    opacity: var(--meb-opacity-muted);
}



[b-3h4f88f3jq] .hp-heading {
    margin: var(--meb-space-stack-none);
    font-family: var(--meb-font-family-primary);
    font-weight: var(--meb-font-weight-bold);
    line-height: var(--meb-font-lineheight-heading);
}

[b-3h4f88f3jq] h1.hp-heading {
    font-size: var(--meb-font-size-h1-desktop);
}

[b-3h4f88f3jq] h2.hp-heading {
    font-size: var(--meb-font-size-h2-desktop);
}




[b-3h4f88f3jq] .hp-body {
    margin: var(--meb-space-stack-none);
    max-width: 60ch;
    font-family: var(--meb-font-family-primary);
    font-size: var(--meb-font-size-body-desktop);
    font-weight: var(--meb-font-weight-regular);
    line-height: var(--meb-font-lineheight-body);
}











.hp-glance-list[b-3h4f88f3jq] {
    margin: var(--meb-space-stack-none);
    padding-inline-start: 1.25em;
    max-width: none;
    list-style: disc;
    color: var(--meb-text-default);
    font-family: var(--meb-font-family-primary);
    font-size: var(--meb-font-size-body-desktop);
    font-weight: var(--meb-font-weight-regular);
    line-height: var(--meb-font-lineheight-body);
}

.hp-glance-list li + li[b-3h4f88f3jq] {
    margin-block-start: var(--meb-space-2);
}





[b-3h4f88f3jq] .hp-game-card-shell.ui-card-wrapper {
    position: relative;
    min-height: 254px;
    width: 100%;
    padding: var(--meb-space-stack-none);
    overflow: hidden;
    border: var(--meb-border-width-sm) solid var(--meb-border-default);
    border-radius: var(--meb-radius-pagination);
    background: var(--meb-surface-card);
}

.hp-game-card[b-3h4f88f3jq] {
    position: relative;
    min-height: 254px;
    height: 254px;
    max-height: 254px;
    box-sizing: border-box;
    overflow: clip;
}

.hp-game-card__title-region[b-3h4f88f3jq] {
    position: absolute;
    top: 24px;
    left: 24px;
    right: 112px;
    z-index: 2;
}

.hp-game-card__tag-region[b-3h4f88f3jq] {
    position: absolute;
    left: 24px;
    right: 146px;
    bottom: 22px;
    z-index: 2;
}

.hp-game-card__title[b-3h4f88f3jq] {
    margin: var(--meb-space-stack-none);
    color: var(--meb-text-pagination-item);
    font-family: var(--meb-font-family-primary);
    font-size: var(--meb-font-size-h3-desktop);
    font-weight: var(--meb-font-weight-bold);
    line-height: var(--meb-font-lineheight-heading);
}

.hp-game-card__tags[b-3h4f88f3jq] {
    max-width: 100%;
}

.hp-game-card__art[b-3h4f88f3jq] {
    position: absolute;
    right: var(--meb-space-stack-none);
    bottom: var(--meb-space-stack-none);
    z-index: 1;
    overflow: visible;
    isolation: isolate;
    background: transparent;
    pointer-events: none;
}

.hp-game-card__art-stage[b-3h4f88f3jq] {
    position: relative;
    width: 100%;
    height: 100%;
}

[b-3h4f88f3jq] .hp-game-card__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: right bottom;
}

[b-3h4f88f3jq] .hp-game-card__image--gift,
[b-3h4f88f3jq] .hp-game-card__image--baby,
[b-3h4f88f3jq] .hp-game-card__image--park {
    transform-origin: right bottom;
}

.hp-game-card--gift .hp-game-card__art[b-3h4f88f3jq] {
    width: 196px;
    height: 166px;
}

[b-3h4f88f3jq] .hp-game-card__image--gift {
    transform: translate(14px, 10px) rotate(-6deg) scale(1.12);
}

.hp-game-card--baby .hp-game-card__art[b-3h4f88f3jq] {
    width: 178px;
    height: 154px;
}

[b-3h4f88f3jq] .hp-game-card__image--baby {
    transform: translate(12px, 12px) rotate(4deg) scale(1.09);
}

.hp-game-card--park .hp-game-card__art[b-3h4f88f3jq] {
    width: 158px;
    height: 138px;
}

[b-3h4f88f3jq] .hp-game-card__image--park {
    transform: translate(10px, 10px) rotate(-2deg) scale(1.01);
}

[b-3h4f88f3jq] .hp-game-card__link {
    
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    right: 18px;
    bottom: 18px;
    z-index: 3;
    width: var(--meb-size-touch-target);
    height: var(--meb-size-touch-target);
    min-width: var(--meb-size-touch-target);
    min-height: var(--meb-size-touch-target);
    border: var(--meb-border-width-sm) solid var(--meb-border-default);
    border-radius: var(--meb-border-radius-full);
    background: var(--meb-surface-card);
    color: var(--meb-text-default);
    font-family: var(--meb-font-family-primary);
    font-size: var(--meb-font-size-h3-desktop);
    font-weight: var(--meb-font-weight-bold);
    line-height: var(--meb-font-lineheight-tight);
    text-decoration: none;
    box-sizing: border-box;
    cursor: pointer;
}

[b-3h4f88f3jq] .hp-game-card__link:hover,
[b-3h4f88f3jq] .hp-game-card__link:focus-visible {
    background: var(--meb-surface-card);
    color: var(--meb-text-default);
}




[b-3h4f88f3jq] .hp-start-playing-art {
    flex: 1;
    align-self: stretch;
    overflow: hidden;
    background: var(--meb-surface-section-startplaying-media);
    margin-inline-end: calc(-2.1 * var(--container-padding, var(--meb-space-container-lg)));
    margin-block: calc(-1 * var(--container-padding-block, var(--meb-space-container-lg)));
}


[b-3h4f88f3jq] .hp-start-playing-img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}



[b-3h4f88f3jq] .hp-promo-title {
    font-family: var(--meb-font-family-accent);
    font-size: var(--meb-font-size-display-desktop);
    font-weight: var(--meb-font-weight-regular);
    line-height: var(--meb-font-lineheight-display);
}



[b-3h4f88f3jq] .hp-promo .hp-body {
    max-width: none;
}



[b-3h4f88f3jq] .hp-game-types .hp-heading,
[b-3h4f88f3jq] .hp-faq .hp-heading,
[b-3h4f88f3jq] .hp-start-playing-section .hp-heading {
    color: var(--meb-text-pagination-item);
}



.hp-at-a-glance .hp-heading[b-3h4f88f3jq] {
    color: var(--meb-text-pagination-item);
}




[b-3h4f88f3jq] .hp-faq .ui-accordion {
    --accordion-border: var(--meb-border-default);
}
/* _content/LiveEventBingo.Shared/Pages/Common/Pages/HomePage/HomepageMobile.razor.rz.scp.css */




[b-rrmjohpxpb] .homepage-mobile {
    width: 100%;
}




[b-rrmjohpxpb] .hp-section {
    padding-block: var(--meb-space-stack-none);
}

    [b-rrmjohpxpb] .hp-section > .ui-container {
        padding-left: var(--meb-space-container-md);
        padding-right: var(--meb-space-container-md);
    }

[b-rrmjohpxpb] .hp-hero {
    padding-block: var(--meb-space-stack-xl);
    background: var(--meb-surface-hero-background);
}

[b-rrmjohpxpb] .hp-hero-panel {
    position: relative;
    overflow: hidden;
}

[b-rrmjohpxpb] .hp-hero-title {
    margin: var(--meb-space-stack-none);
    max-inline-size: 12ch;
    text-align: left;
    color: var(--meb-text-inverse);
    font-family: var(--meb-font-family-accent);
    font-size: var(--meb-font-size-display-mobile);
    font-weight: var(--meb-font-weight-regular);
    line-height: var(--meb-font-lineheight-display);
}

[b-rrmjohpxpb] .hp-hero-body {
    margin: var(--meb-space-stack-none);
    max-inline-size: 28ch;
    text-align: left;
    color: var(--meb-text-inverse);
    font-family: var(--meb-font-family-primary);
    font-size: var(--meb-font-size-body-mobile);
    font-weight: var(--meb-font-weight-regular);
    line-height: var(--meb-font-lineheight-body);
}


[b-rrmjohpxpb] .hp-hero-art-stage {
    position: relative;
    box-sizing: border-box;
    margin-inline: calc(-1 * var(--meb-space-container-md));
    inline-size: calc(100% + 2 * var(--meb-space-container-md));
    min-block-size: 17rem;
    padding-block-start: var(--meb-space-stack-md);
    padding-inline: var(--meb-space-container-md);
    overflow: hidden;
}


[b-rrmjohpxpb] .hp-hero-dots-wrap {
    --hp-dots-art: 600px;
    --hp-dots-sheet-w: calc(var(--hp-dots-art) * 816 / 853);
    --hp-dots-sheet-h: calc(var(--hp-dots-art) * 624 / 853);
    position: absolute;
    top: 50%;
    left: 50%;
    display: grid;
    grid-template-columns: repeat(2, var(--hp-dots-sheet-w));
    grid-auto-rows: var(--hp-dots-sheet-h);
    transform: translate(-50%, -50%) rotate(12deg);
    z-index: 0;
    pointer-events: none;
}

[b-rrmjohpxpb] .hp-hero-dots-sheet {
    overflow: hidden;
}

[b-rrmjohpxpb] .hp-hero-dots.decorative-svg {
    block-size: auto;
}


[b-rrmjohpxpb] .hp-hero-board-wrap {
    position: relative;
    inline-size: min(15rem, 70%);
    margin-inline: auto;
    z-index: 2;
    transform: rotate(5deg);
    transform-origin: bottom center;
}




[b-rrmjohpxpb] .hp-hero-rotator-link {
    --hp-rotator-row: 48px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--meb-space-inline-sm);
    text-decoration: none;
}

[b-rrmjohpxpb] .hp-hero-rotator-label {
    color: var(--meb-text-inverse);
    font-family: var(--meb-font-family-primary);
    font-size: var(--meb-font-size-h3-mobile);
    font-weight: var(--meb-font-weight-semibold);
    white-space: nowrap;
}

[b-rrmjohpxpb] .hp-hero-rotator-window {
    display: block;
    
    block-size: calc(var(--hp-rotator-row) + 2 * var(--meb-border-width-medium));
    overflow: hidden;
    background: var(--meb-surface-card);
    border: var(--meb-border-width-medium) solid var(--meb-border-default);
    border-radius: var(--meb-border-radius-sm);
    box-shadow: var(--meb-shadow-surface-comic);
    transition: box-shadow var(--meb-motion-fast);
}

[b-rrmjohpxpb] .hp-hero-rotator-link:hover .hp-hero-rotator-window {
    box-shadow: var(--meb-shadow-surface-comic-sm);
}

[b-rrmjohpxpb] .hp-hero-rotator-track {
    display: flex;
    flex-direction: column;
    animation: hp-hero-rotator-b-rrmjohpxpb 12.6s cubic-bezier(.5, 0, .15, 1) infinite;
}

[b-rrmjohpxpb] .hp-hero-rotator-item {
    display: flex;
    align-items: center;
    block-size: var(--hp-rotator-row);
    padding-inline: var(--meb-space-inline-md);
    color: var(--meb-text-default);
    font-family: var(--meb-font-family-accent);
    font-size: var(--meb-font-size-h3-mobile);
    white-space: nowrap;
    
    text-decoration: none;
}


[b-rrmjohpxpb] .hp-hero-rotator-link:hover .hp-hero-rotator-track,
[b-rrmjohpxpb] .hp-hero-rotator-link:focus-within .hp-hero-rotator-track {
    animation-play-state: paused;
}


[b-rrmjohpxpb] .hp-hero-rotator-more {
    margin-inline-start: var(--meb-space-inline-sm);
    color: var(--meb-accent-secondary);
    font-family: var(--meb-font-family-primary);
    font-size: var(--meb-font-size-body-mobile);
    font-weight: var(--meb-font-weight-semibold);
    text-decoration: underline;
    text-underline-offset: 4px;
    white-space: nowrap;
}


@keyframes hp-hero-rotator-b-rrmjohpxpb {
    0%, 11.9%       { transform: translateY(0)                                rotate(0deg); }
    14.29%, 26.19%  { transform: translateY(calc(var(--hp-rotator-row) * -1))  rotate(-1.5deg); }
    28.57%, 40.48%  { transform: translateY(calc(var(--hp-rotator-row) * -2))  rotate(1.5deg); }
    42.86%, 54.76%  { transform: translateY(calc(var(--hp-rotator-row) * -3))  rotate(-1deg); }
    57.14%, 69.05%  { transform: translateY(calc(var(--hp-rotator-row) * -4))  rotate(1deg); }
    71.43%, 83.33%  { transform: translateY(calc(var(--hp-rotator-row) * -5))  rotate(-1.5deg); }
    85.71%, 97.62%  { transform: translateY(calc(var(--hp-rotator-row) * -6))  rotate(1.5deg); }
    100%            { transform: translateY(calc(var(--hp-rotator-row) * -7))  rotate(0deg); }
}

@media (prefers-reduced-motion: reduce) {
    [b-rrmjohpxpb] .hp-hero-rotator-track {
        animation: none;
    }
}



[b-rrmjohpxpb] .hp-promo {
    background: var(--meb-surface-section-freecta);
    color: var(--meb-text-inverse);
}



[b-rrmjohpxpb] .hp-start-playing-section {
    background: var(--meb-surface-card);
}



[b-rrmjohpxpb] .hp-game-types {
    background: var(--meb-surface-section-popularcases);
}



[b-rrmjohpxpb] .hp-game-type-tag {
    background: var(--meb-surface-tag-popularcase);
    border-radius: var(--meb-radius-pill);
    padding-block: var(--meb-space-stack-xs);
    padding-inline: var(--meb-space-stack-sm);
    font-family: var(--meb-font-family-primary);
    font-size: var(--meb-font-size-body-mobile);
    font-weight: var(--meb-font-weight-medium);
    color: var(--meb-text-default);
}



[b-rrmjohpxpb] .hp-faq {
    background: var(--meb-surface-section-faq);
}



[b-rrmjohpxpb] .hp-how-it-works {
    position: relative;
    overflow: hidden;
    padding-block: var(--meb-space-stack-none);
    background: var(--meb-surface-section-howtoplay);
}

[b-rrmjohpxpb] .hp-how-content {
    position: relative;
    z-index: 1;
}

[b-rrmjohpxpb] .hp-how-content .hp-label,
[b-rrmjohpxpb] .hp-how-content .hp-heading,
[b-rrmjohpxpb] .hp-how-content .hp-body {
    text-align: left;
}

[b-rrmjohpxpb] .hp-how-steps {
    inline-size: 100%;
}

[b-rrmjohpxpb] .hp-how-step-row {
    inline-size: 100%;
}

[b-rrmjohpxpb] .hp-how-step-badge {
    display: inline-flex;
    
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    inline-size: 2.5rem;
    block-size: 2.5rem;
    border: var(--meb-border-width-sm) solid var(--meb-border-pagination-item);
    border-radius: var(--meb-radius-pill);
    background: var(--meb-surface-card);
    color: var(--meb-border-pagination-item);
    font-size: var(--meb-font-size-body-mobile);
    font-weight: var(--meb-font-weight-regular);
}

[b-rrmjohpxpb] .hp-how-step-copy {
    
    flex: 1 1 0;
    min-inline-size: 0;
}

[b-rrmjohpxpb] .hp-how-dots-wrap {
    position: absolute;
    inset-inline-start: 0;
    inset-block-end: 0;
    inline-size: clamp(18rem, 82vw, 24rem);
    transform: translate(-34%, 18%);
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
}

[b-rrmjohpxpb] .hp-how-dots.decorative-svg {
    display: block;
    inline-size: 100%;
    block-size: auto;
}

[b-rrmjohpxpb] .hp-how-it-works .hp-heading {
    color: var(--meb-text-pagination-item);
}

[b-rrmjohpxpb] .hp-how-it-works h2.hp-heading {
    font-size: var(--meb-font-size-h1-mobile);
}



[b-rrmjohpxpb] .hp-value-strip-section {
    padding-block: var(--meb-space-stack-none);
    background: var(--meb-surface-section-valueprops);
}

[b-rrmjohpxpb] .hp-value-strip {
    padding-block: var(--meb-space-stack-md);
}

[b-rrmjohpxpb] .hp-value-strip-item {
    width: 100%;
    margin: var(--meb-space-stack-none);
    padding-block: var(--meb-space-stack-sm);
    text-align: center;
    font-family: var(--meb-font-family-primary);
    font-size: var(--meb-font-size-h3-mobile);
    font-weight: var(--meb-font-weight-bold);
    line-height: var(--meb-font-lineheight-heading);
}

[b-rrmjohpxpb] .hp-value-strip-item--downloads {
    color: var(--meb-text-valueprops-downloads);
}

[b-rrmjohpxpb] .hp-value-strip-item--printing {
    color: var(--meb-text-valueprops-printing);
}

[b-rrmjohpxpb] .hp-value-strip-item--paper {
    color: var(--meb-text-valueprops-paper);
}

[b-rrmjohpxpb] .hp-value-strip-item--mess {
    color: var(--meb-text-valueprops-mess);
}



[b-rrmjohpxpb] .hp-split-section {
    padding-block-start: var(--meb-space-stack-none);
}

[b-rrmjohpxpb] .hp-split-stack {
    inline-size: 100%;
}

[b-rrmjohpxpb] .hp-split-panel {
    color: var(--meb-text-default);
}
[b-rrmjohpxpb] .hp-split-card {
    border-radius: var(--meb-space-stack-none);
}

.hp-split-panel[b-rrmjohpxpb]  .ui-card-wrapper {
    block-size: 100%;
    padding: var(--meb-space-stack-none);
    box-shadow: none;
    color: inherit;
}

.hp-split-panel--creator[b-rrmjohpxpb]  .ui-card-wrapper {
    background: var(--meb-surface-section-creator);
}

.hp-split-panel--player[b-rrmjohpxpb]  .ui-card-wrapper {
    background: var(--meb-surface-section-player);
}

[b-rrmjohpxpb] .hp-split-panel-shell,
[b-rrmjohpxpb] .hp-split-panel-layout,
[b-rrmjohpxpb] .hp-split-content {
    block-size: 100%;
}

[b-rrmjohpxpb] .hp-split-content,
[b-rrmjohpxpb] .hp-split-lines {
    inline-size: min(100%, var(--meb-layout-homepage-split-panel-content-width));
}


[b-rrmjohpxpb] .hp-split-cta {
    inline-size: min(100%, var(--meb-layout-homepage-split-panel-content-width));
    max-inline-size: var(--meb-layout-homepage-split-panel-content-width);
    justify-content: center;
    --button-background: var(--meb-surface-card);
    --button-foreground: var(--meb-text-pagination-item);
    --button-border: var(--meb-border-default);
    --button-shadow: var(--meb-button-secondary-shadow);
    --meb-button-secondary-hover-background: var(--meb-surface-card);
    --meb-button-secondary-hover-shadow: var(--meb-button-secondary-shadow);
    --meb-button-secondary-active-background: var(--meb-surface-card);
    --meb-button-secondary-active-shadow: var(--meb-button-secondary-shadow);
}

[b-rrmjohpxpb] .hp-split-panel-layout {
    min-block-size: 13rem;
    inline-size: 100%;
}

[b-rrmjohpxpb] .hp-split-title {
    margin: var(--meb-space-stack-none);
    color: var(--meb-text-pagination-item);
    text-align: left;
    font-family: var(--meb-font-family-primary);
    font-size: var(--meb-font-size-h2-mobile);
    font-weight: var(--meb-font-weight-bold);
    line-height: var(--meb-font-lineheight-heading);
}

[b-rrmjohpxpb] .hp-split-line {
    margin: var(--meb-space-stack-none);
    color: var(--meb-text-default);
    text-align: left;
    font-family: var(--meb-font-family-primary);
    font-size: var(--meb-font-size-body-mobile);
    font-weight: var(--meb-font-weight-semibold);
    line-height: var(--meb-font-lineheight-body);
}




[b-rrmjohpxpb] .hp-label {
    display: inline-block;
    font-size: var(--meb-font-size-body-sm-mobile);
    font-weight: var(--meb-font-weight-semibold);
    text-transform: uppercase;
    opacity: var(--meb-opacity-muted);
}



[b-rrmjohpxpb] .hp-heading {
    margin: var(--meb-space-stack-none);
    text-align: center;
    font-family: var(--meb-font-family-primary);
    font-weight: var(--meb-font-weight-bold);
    line-height: var(--meb-font-lineheight-heading);
}

[b-rrmjohpxpb] h1.hp-heading {
    font-size: var(--meb-font-size-h1-mobile);
}

[b-rrmjohpxpb] h2.hp-heading {
    font-size: var(--meb-font-size-h2-mobile);
}







.hp-glance-list[b-rrmjohpxpb] {
    margin: var(--meb-space-stack-none);
    padding-inline-start: 1.25em;
    list-style: disc;
    text-align: start;
    color: var(--meb-text-default);
    font-family: var(--meb-font-family-primary);
    font-size: var(--meb-font-size-body-mobile);
    font-weight: var(--meb-font-weight-regular);
    line-height: var(--meb-font-lineheight-body);
}

.hp-glance-list li + li[b-rrmjohpxpb] {
    margin-block-start: var(--meb-space-2);
}



[b-rrmjohpxpb] .hp-body {
    margin: var(--meb-space-stack-none);
    text-align: center;
    font-family: var(--meb-font-family-primary);
    font-size: var(--meb-font-size-body-mobile);
    font-weight: var(--meb-font-weight-regular);
    line-height: var(--meb-font-lineheight-body);
}





[b-rrmjohpxpb] .hp-game-card-shell.ui-card-wrapper {
    position: relative;
    min-height: 200px;
    width: 100%;
    padding: var(--meb-space-stack-none);
    overflow: hidden;
    border: var(--meb-border-width-sm) solid var(--meb-border-default);
    border-radius: var(--meb-radius-pagination);
    background: var(--meb-surface-card);
}

.hp-game-card[b-rrmjohpxpb] {
    position: relative;
    min-height: 200px;
    height: 200px;
    max-height: 200px;
    box-sizing: border-box;
    overflow: clip;
}

.hp-game-card__title-region[b-rrmjohpxpb] {
    position: absolute;
    top: 20px;
    left: 20px;
    right: 96px;
    z-index: 2;
}

.hp-game-card__tag-region[b-rrmjohpxpb] {
    position: absolute;
    left: 20px;
    right: 120px;
    bottom: 18px;
    z-index: 2;
}

.hp-game-card__title[b-rrmjohpxpb] {
    margin: var(--meb-space-stack-none);
    color: var(--meb-text-pagination-item);
    font-family: var(--meb-font-family-primary);
    font-size: var(--meb-font-size-body-mobile);
    font-weight: var(--meb-font-weight-bold);
    line-height: var(--meb-font-lineheight-heading);
}

.hp-game-card__tags[b-rrmjohpxpb] {
    max-width: 100%;
}

.hp-game-card__art[b-rrmjohpxpb] {
    position: absolute;
    right: var(--meb-space-stack-none);
    bottom: var(--meb-space-stack-none);
    z-index: 1;
    overflow: visible;
    isolation: isolate;
    background: transparent;
    pointer-events: none;
}

.hp-game-card__art-stage[b-rrmjohpxpb] {
    position: relative;
    width: 100%;
    height: 100%;
}

[b-rrmjohpxpb] .hp-game-card__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: right bottom;
}

[b-rrmjohpxpb] .hp-game-card__image--gift,
[b-rrmjohpxpb] .hp-game-card__image--baby,
[b-rrmjohpxpb] .hp-game-card__image--park {
    transform-origin: right bottom;
}

.hp-game-card--gift .hp-game-card__art[b-rrmjohpxpb] {
    width: 160px;
    height: 134px;
}

[b-rrmjohpxpb] .hp-game-card__image--gift {
    transform: translate(10px, 8px) rotate(-6deg) scale(1.12);
}

.hp-game-card--baby .hp-game-card__art[b-rrmjohpxpb] {
    width: 144px;
    height: 124px;
}

[b-rrmjohpxpb] .hp-game-card__image--baby {
    transform: translate(8px, 10px) rotate(4deg) scale(1.09);
}

.hp-game-card--park .hp-game-card__art[b-rrmjohpxpb] {
    width: 128px;
    height: 112px;
}

[b-rrmjohpxpb] .hp-game-card__image--park {
    transform: translate(8px, 8px) rotate(-2deg) scale(1.01);
}

[b-rrmjohpxpb] .hp-game-card__link {
    
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    right: 14px;
    bottom: 14px;
    z-index: 3;
    width: var(--meb-size-touch-target);
    height: var(--meb-size-touch-target);
    min-width: var(--meb-size-touch-target);
    min-height: var(--meb-size-touch-target);
    border: var(--meb-border-width-sm) solid var(--meb-border-default);
    border-radius: var(--meb-border-radius-full);
    background: var(--meb-surface-card);
    color: var(--meb-text-default);
    font-family: var(--meb-font-family-primary);
    font-size: var(--meb-font-size-body-mobile);
    font-weight: var(--meb-font-weight-bold);
    line-height: var(--meb-font-lineheight-tight);
    text-decoration: none;
    box-sizing: border-box;
    cursor: pointer;
}

[b-rrmjohpxpb] .hp-game-card__link:hover,
[b-rrmjohpxpb] .hp-game-card__link:focus-visible {
    background: var(--meb-surface-card);
    color: var(--meb-text-default);
}




[b-rrmjohpxpb] .hp-start-playing-art {
    overflow: hidden;
    border-radius: var(--meb-border-radius-lg);
    width: 100%;
    background: var(--meb-surface-section-startplaying-media);
    aspect-ratio: 4 / 3;
}


[b-rrmjohpxpb] .hp-start-playing-img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}



[b-rrmjohpxpb] .hp-promo-title {
    font-family: var(--meb-font-family-accent);
    font-size: var(--meb-font-size-display-mobile);
    font-weight: var(--meb-font-weight-regular);
    line-height: var(--meb-font-lineheight-display);
}





[b-rrmjohpxpb] .hp-start-playing-section .hp-heading,
[b-rrmjohpxpb] .hp-start-playing-section .hp-body {
    text-align: left;
}



[b-rrmjohpxpb] .hp-game-types .hp-heading,
[b-rrmjohpxpb] .hp-faq .hp-heading {
    text-align: left;
}



.hp-at-a-glance .hp-heading[b-rrmjohpxpb] {
    text-align: left;
    color: var(--meb-text-pagination-item);
}



[b-rrmjohpxpb] .hp-game-types .hp-heading,
[b-rrmjohpxpb] .hp-faq .hp-heading,
[b-rrmjohpxpb] .hp-start-playing-section .hp-heading {
    color: var(--meb-text-pagination-item);
}




[b-rrmjohpxpb] .hp-faq .ui-accordion {
    --accordion-border: var(--meb-border-default);
}
/* _content/LiveEventBingo.Shared/Pages/Common/Pages/HomePage/OldHomePage.razor.rz.scp.css */


.step-1[b-5ddclw8nej] {
    background: var(--meb-accent-primary);
}

.warning-banner[b-5ddclw8nej] {
    background: #ff4040;
    color: var(--meb-text-inverse);
    font-weight: bold;
    font-size: 1rem;
    border-radius: 18px;
    padding: 1.2rem 1.5rem;
    margin-bottom: 0.5rem;
    box-shadow: 4px 6px 0 #222;
    font-family: 'Fredoka', 'Arial Rounded MT Bold', Arial, sans-serif;
    letter-spacing: 0.4px;
    text-shadow: 0 1px 0 #b22;
}

@media (max-width: 600px) {
    .warning-banner[b-5ddclw8nej] {
        font-size: .8rem;
        padding: 0.8rem 0.7rem;
    }
}

.button-icon[b-5ddclw8nej] {
    aspect-ratio: 1;
    object-fit: contain;
    width: 36px;
}

.new-game[b-5ddclw8nej] {
    background-color: #FCF340;
    box-shadow: 4px 4px 0 #FFD034;
    color: #433B25;
}

.game-list[b-5ddclw8nej] {
    background-color: #A8FF2E;
    box-shadow: 5px 5px 0 #698E66;
    color: #254335;
}

.responsive-svg[b-5ddclw8nej] {
    width: 100%;
    height: auto;
    max-width: 500px;
}

.hero-section[b-5ddclw8nej] {
    margin-bottom: 1rem;
}

.hero-content[b-5ddclw8nej] {
    max-width: 750px;
    background-color: rgba(255, 255, 255, 0.9);
    box-shadow: 0 8px 24px rgba(0,0,0,0.12);
    border-radius: var(--meb-border-radius-xxl);
}

.page-container[b-5ddclw8nej] {
    display: flex;
    flex-direction: column; 
}


[b-5ddclw8nej] .k-svg-icon {
    width: 36px;
    height: 36px;
}


[b-5ddclw8nej] .action-btn {
    padding: var(--meb-space-stack-10) 20px;
    font-size: 1.1rem;
    border-radius: var(--meb-radius-md);
    transition: transform 0.3s ease;
    margin: var(--meb-space-stack-none);
    align-items: center;
    gap: 1.5rem;
    justify-content: flex-start;
}

[b-5ddclw8nej] .action-btn:hover {
    transform: translate(2px, 2px);
}

.how-it-works-card[b-5ddclw8nej] {
    box-shadow: 0 8px 24px rgba(0,0,0,0.12) !important;
    background-color: rgba(255, 255, 255, 0.9);
}

.step-icon[b-5ddclw8nej] {
    flex: 0 0 60px; 
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    color: var(--meb-text-inverse);
}