@media (orientation: portrait) and (max-width: 576px) {
    .content:has(.home-page .chips-offer-banner) {
        overflow: hidden;
    }

    .home-page:has(.chips-offer-banner) {
        height: 100%;
        min-height: 0;
        align-items: stretch !important;
        padding: 6px 10px !important;
        overflow: hidden;
    }

    .home-page:has(.chips-offer-banner) .lobby {
        width: 100%;
        height: 100%;
        min-height: 0;
        display: flex;
        flex-direction: column;
        overflow: hidden;
    }

    .home-page:has(.chips-offer-banner) .chips-offer-banner {
        min-height: 0;
        height: clamp(64px, 11dvh, 76px);
        flex: 0 0 clamp(64px, 11dvh, 76px);
        grid-template-rows: minmax(0, 1fr) auto;
        row-gap: 2px;
        margin: 0 6px 8px;
        padding-block: 6px;
    }

    .home-page:has(.chips-offer-banner) .chips-offer-copy strong {
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .home-page:has(.chips-offer-banner) .chips-offer-copy small {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .home-page:has(.chips-offer-banner) .chips-offer-timer {
        min-height: 16px;
        padding-bottom: 1px;
        line-height: 1.2;
    }

    .home-page:has(.chips-offer-banner) .lobby > .row {
        min-height: 0;
        height: auto;
        flex: 1 1 0;
        align-content: stretch;
        row-gap: 8px;
        overflow: hidden;
    }

    .home-page:has(.chips-offer-banner) .lobby > .row > div {
        height: calc((100% - 16px) / 3);
        min-height: 0;
    }

    .home-page:has(.chips-offer-banner) .game-mode {
        gap: 4px;
        padding: clamp(8px, 1.5dvh, 12px) 10px 9px;
    }

    .home-page:has(.chips-offer-banner) .game-mode h3 {
        font-size: clamp(15px, 4.2vw, 18px);
    }

    .home-page:has(.chips-offer-banner) .lobby-dashboard {
        min-height: 0;
        height: clamp(108px, 22dvh, 158px);
        flex: 0 0 clamp(108px, 22dvh, 158px);
        grid-template-rows: repeat(2, minmax(0, 1fr));
        margin: 8px 6px 0;
    }

    .home-page:has(.chips-offer-banner) .lobby-quick-card {
        min-height: 0;
        padding-block: 6px;
    }
}

/* Unified game-card information hierarchy and colored actions. */
.arcade-mode-slider > .arcade-tile .arcade-tile-meta {
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:6px !important;
}
.arcade-mode-slider > .arcade-tile .arcade-tile-meta b:last-child {
    grid-column:1 / -1 !important;
    grid-row:1 !important;
}
.arcade-mode-slider > .arcade-tile .arcade-tile-meta b:first-child {
    grid-column:1 !important;
    grid-row:2 !important;
}
.arcade-mode-slider > .arcade-tile .arcade-tile-meta b:nth-child(2) {
    grid-column:2 !important;
    grid-row:2 !important;
}
.arcade-mode-slider > .arcade-tile .arcade-play-cta {
    display:inline-flex !important;
    align-items:center;
    justify-content:center;
    gap:8px;
    border-color:rgba(255,255,255,.22);
}
.arcade-mode-slider > .arcade-play-tile .arcade-play-cta { background:linear-gradient(180deg,#40d86b,#1ca44a); }
.arcade-mode-slider > .arcade-mode-5 .arcade-play-cta { background:linear-gradient(180deg,#45c7eb,#188dbb); box-shadow:inset 0 1px rgba(255,255,255,.25),0 7px 16px rgba(22,139,184,.24),0 3px 0 #126b90; }
.arcade-mode-slider > .arcade-mode-4 .arcade-play-cta { background:linear-gradient(180deg,#a67aef,#7145c5); box-shadow:inset 0 1px rgba(255,255,255,.25),0 7px 16px rgba(105,63,186,.24),0 3px 0 #543296; }
.arcade-mode-slider > .arcade-mode-6 .arcade-play-cta { background:linear-gradient(180deg,#f1a84a,#cf6f25); box-shadow:inset 0 1px rgba(255,255,255,.25),0 7px 16px rgba(194,96,28,.24),0 3px 0 #9e501b; }

/* Portrait lobby: vertical, center-snapping game carousel. */
@media (orientation:portrait) and (max-width:700px) {
    .arcade-lobby-board {
        display:grid !important;
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        grid-template-rows:minmax(0,1fr) auto auto !important;
        min-height:0 !important;
        overflow:hidden;
    }
    .arcade-mode-slider {
        grid-column:1 / -1;
        grid-row:1;
        min-height:0;
        padding:0 8px;
        display:flex !important;
        flex-direction:column;
        align-items:center;
        justify-content:flex-start;
        gap:14px;
        overflow-x:hidden;
        overflow-y:auto;
        scroll-snap-type:y mandatory;
        overscroll-behavior-y:contain;
        touch-action:pan-y;
        scrollbar-width:none;
    }
    .arcade-mode-slider::before,
    .arcade-mode-slider::after {
        content:"";
        flex:0 0 var(--lobby-carousel-edge-space,72px);
    }
    .arcade-mode-slider::-webkit-scrollbar { display:none; }
    .arcade-mode-slider > .arcade-tile,
    .arcade-mode-slider > .arcade-play-tile {
        position:relative !important;
        inset:auto !important;
        width:min(88vw,370px) !important;
        height:auto !important;
        min-height:265px;
        flex:0 0 auto !important;
        align-self:center;
        grid-column:auto !important;
        grid-row:auto !important;
        scroll-snap-align:center;
        scroll-snap-stop:always;
        transform:scale(.94);
        opacity:.48;
        filter:saturate(.6) brightness(.84);
        transition:transform .22s ease,opacity .22s ease,filter .22s ease;
    }
    .arcade-mode-slider > .arcade-mode-5 { order:1; }
    .arcade-mode-slider > .arcade-play-tile { order:2; }
    .arcade-mode-slider > .arcade-mode-4 { order:3; }
    .arcade-mode-slider > .arcade-mode-6 { order:4; }
    .arcade-mode-slider > .arcade-tile.lobby-carousel-active {
        z-index:2;
        transform:scale(1.02);
        opacity:1;
        filter:none;
    }
    .arcade-mode-slider > .arcade-tile .arcade-play-cta {
        width:min(100%,210px);
        min-height:40px;
        margin:7px auto 2px;
        font-size:14px;
    }
    .arcade-action-buttons { grid-column:1; grid-row:2; }
    .arcade-wheel-feature { grid-column:2; grid-row:2; }
    .arcade-info-strip { grid-column:1 / -1; grid-row:3; }
}

/* Match the portrait action and information-card polish on mobile landscape. */
@media (orientation: landscape) and (max-height: 600px) {
    .arcade-wheel-feature > strong,
    .arcade-shop-button > strong { padding-bottom: 5px; }

    .arcade-wheel-feature > .fa-chevron-right,
    .arcade-shop-button > .arcade-action-arrow { bottom: 12px; }

    .arcade-info-card {
        position: relative;
        grid-template-columns: 40px minmax(0, 1fr) 14px;
        grid-template-rows: 18px minmax(38px, auto);
        column-gap: 7px;
        row-gap: 3px;
        padding: 7px 8px 8px !important;
        align-items: center;
    }

    .arcade-info-card > div {
        grid-column: 2;
        grid-row: 2;
        gap: 2px;
        align-self: center;
    }

    .arcade-info-card > div > strong {
        position: absolute;
        top: 7px;
        left: 8px;
        right: 8px;
        width: auto;
        font-size: 12px;
        line-height: 1.05;
        text-align: center;
    }

    .arcade-info-card > span {
        grid-column: 1;
        grid-row: 2;
        width: 40px;
        height: 40px;
    }

    .arcade-info-card > span img {
        width: 36px !important;
        height: 36px !important;
        max-width: 36px;
        max-height: 36px;
        object-fit: contain;
    }

    .arcade-info-card b { font-size: 13px; }
    .arcade-info-card small {
        font-size: 10px;
        line-height: 1.1;
    }

    .arcade-tournament-info > .fa-chevron-right {
        display: block;
        grid-column: 3;
        grid-row: 2;
        justify-self: end;
        color: rgba(255, 255, 255, .72);
        font-size: 13px;
    }
}

/* Final lobby carousel rules; keep last so legacy responsive rules cannot override them. */
.arcade-mode-slider > .arcade-tile .arcade-tile-meta {
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:6px !important;
}
.arcade-mode-slider > .arcade-tile .arcade-tile-meta b:last-child { grid-column:1 / -1 !important;grid-row:1 !important; }
.arcade-mode-slider > .arcade-tile .arcade-tile-meta b:first-child { grid-column:1 !important;grid-row:2 !important; }
.arcade-mode-slider > .arcade-tile .arcade-tile-meta b:nth-child(2) { grid-column:2 !important;grid-row:2 !important; }
.arcade-mode-slider > .arcade-tile .arcade-play-cta { display:inline-flex !important;align-items:center;justify-content:center;gap:8px;border-color:rgba(255,255,255,.22); }
.arcade-mode-slider > .arcade-play-tile .arcade-play-cta { background:linear-gradient(180deg,#40d86b,#1ca44a); }
.arcade-mode-slider > .arcade-mode-5 .arcade-play-cta { background:linear-gradient(180deg,#45c7eb,#188dbb);box-shadow:inset 0 1px rgba(255,255,255,.25),0 7px 16px rgba(22,139,184,.24),0 3px 0 #126b90; }
.arcade-mode-slider > .arcade-mode-4 .arcade-play-cta { background:linear-gradient(180deg,#a67aef,#7145c5);box-shadow:inset 0 1px rgba(255,255,255,.25),0 7px 16px rgba(105,63,186,.24),0 3px 0 #543296; }
.arcade-mode-slider > .arcade-mode-6 .arcade-play-cta { background:linear-gradient(180deg,#f1a84a,#cf6f25);box-shadow:inset 0 1px rgba(255,255,255,.25),0 7px 16px rgba(194,96,28,.24),0 3px 0 #9e501b; }

@media (orientation:portrait) and (max-width:700px) {
    .arcade-lobby-board { display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr)) !important;grid-template-rows:minmax(0,1fr) auto auto !important;min-height:0 !important;overflow:hidden; }
    .arcade-mode-slider { grid-column:1 / -1;grid-row:1;min-height:0;padding:0 8px;display:flex !important;flex-direction:column;align-items:center;justify-content:flex-start;gap:14px;overflow-x:hidden;overflow-y:auto;scroll-snap-type:y mandatory;overscroll-behavior-y:contain;touch-action:pan-y;scrollbar-width:none; }
    .arcade-mode-slider::before,.arcade-mode-slider::after { content:"";flex:0 0 var(--lobby-carousel-edge-space,72px); }
    .arcade-mode-slider::-webkit-scrollbar { display:none; }
    .arcade-mode-slider > .arcade-tile,.arcade-mode-slider > .arcade-play-tile { position:relative !important;inset:auto !important;width:min(88vw,370px) !important;height:auto !important;min-height:265px;flex:0 0 auto !important;align-self:center;grid-column:auto !important;grid-row:auto !important;scroll-snap-align:center;scroll-snap-stop:always;transform:scale(.94) !important;opacity:.48 !important;filter:saturate(.6) brightness(.84) !important;transition:transform .22s ease,opacity .22s ease,filter .22s ease; }
    .arcade-mode-slider > .arcade-mode-5 { order:1; }
    .arcade-mode-slider > .arcade-play-tile { order:2; }
    .arcade-mode-slider > .arcade-mode-4 { order:3; }
    .arcade-mode-slider > .arcade-mode-6 { order:4; }
    .arcade-mode-slider > .arcade-tile.lobby-carousel-active { z-index:2;transform:scale(1.02) !important;opacity:1 !important;filter:none !important; }
    .arcade-mode-slider > .arcade-tile .arcade-play-cta { width:min(100%,210px);min-height:40px;margin:7px auto 2px;font-size:14px; }
    .arcade-action-buttons { grid-column:1;grid-row:2; }
    .arcade-wheel-feature { grid-column:2;grid-row:2; }
    .arcade-info-strip { grid-column:1 / -1;grid-row:3; }
}

@media (orientation: portrait) and (max-width: 576px) and (max-height: 700px) {
    .home-page:has(.chips-offer-banner) .chips-offer-banner {
        height: 64px;
        flex-basis: 64px;
    }

    .home-page:has(.chips-offer-banner) .lobby-dashboard {
        height: 108px;
        flex-basis: 108px;
    }

    .home-page:has(.chips-offer-banner) .mode-till {
        display: none;
    }

    .home-page:has(.chips-offer-banner) .lobby-quick-icon {
        flex-basis: 31px;
        width: 31px;
        height: 31px;
    }
}

/* Final landscape fit for the arcade lobby. Loaded after styles.css. */
.arcade-mode-slider {
    display: contents;
}

.lobby-tournament-title-desktop { display: none; }

.lobby-tournament-countdown {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

@media (min-width: 701px) and (min-height: 601px) {
    .arcade-tournament-info strong {
        white-space: normal;
        overflow: visible;
    }

    .arcade-tournament-info .lobby-tournament-title-desktop {
        display: block;
    }

    .arcade-tournament-info .lobby-tournament-title-full {
        display: block;
        margin-top: 4px;
        color: rgba(230, 242, 247, .72);
        font-size: .82em;
        line-height: 1.1;
    }

    .arcade-tournament-info .lobby-tournament-title-short { display: none; }
}

@media (orientation: landscape) and (max-height: 600px) {
    .arcade-lobby-board {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        grid-template-rows: minmax(0, 1fr) minmax(92px, .42fr);
        gap: 10px;
        overflow: hidden;
    }

    .arcade-mode-slider {
        grid-column: 1 / -1;
        grid-row: 1;
        min-width: 0;
        min-height: 0;
        padding: 1px 3px 5px;
        display: flex;
        gap: 12px;
        overflow-x: auto;
        overflow-y: hidden;
        scroll-snap-type: x mandatory;
        scroll-padding-inline: 3px;
        overscroll-behavior-x: contain;
        touch-action: pan-x;
        scrollbar-width: none;
    }

    .arcade-mode-slider::-webkit-scrollbar {
        display: none;
    }

    .arcade-mode-slider > .arcade-tile {
        position: relative;
        inset: auto;
        grid-column: auto;
        grid-row: auto;
        flex: 0 0 clamp(220px, 39vw, 350px);
        width: auto;
        height: 100%;
        min-width: 0;
        min-height: 0;
        scroll-snap-align: start;
        scroll-snap-stop: always;
    }

    .arcade-mode-slider > .arcade-play-tile {
        flex-basis: clamp(235px, 42vw, 375px);
        order: 2;
    }

    .arcade-mode-slider > .arcade-mode-5 { order: 1; }
    .arcade-mode-slider > .arcade-mode-4 { order: 3; }
    .arcade-mode-slider > .arcade-mode-6 { order: 4; }

    .arcade-action-buttons,
    .arcade-info-strip {
        display: contents !important;
    }

    .arcade-wheel-feature,
    .arcade-shop-button,
    .arcade-reward-info,
    .arcade-tournament-info {
        grid-row: 2;
        width: auto;
        height: auto;
        min-width: 0;
        min-height: 0;
    }

    .arcade-shop-button { grid-column: 1; }
    .arcade-wheel-feature { grid-column: 2; }
    .arcade-reward-info { grid-column: 3; }
    .arcade-tournament-info { grid-column: 4; }

    .arcade-play-tile {
        padding: 8px 10px !important;
        overflow: hidden;
    }

    .arcade-play-tile > strong {
        font-size: clamp(19px, 2.65vw, 27px);
        line-height: 1;
    }

    .arcade-play-icon {
        min-height: 0;
    }

    .arcade-play-icon img {
        width: min(67%, 108px) !important;
        max-height: 108px;
    }

    .arcade-play-cta {
        min-width: 108px;
        min-height: 31px;
        margin: 2px auto 0;
        padding: 5px 11px;
        font-size: 12px;
    }

    .arcade-wheel-feature,
    .arcade-shop-button {
        padding: 6px 8px !important;
        display: flex !important;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        overflow: hidden;
        text-align: center;
    }

    .arcade-wheel-feature > span,
    .arcade-shop-button > span {
        flex: 1;
        min-height: 0;
        width: 100%;
        display: grid;
        place-items: center;
    }

    .arcade-wheel-feature > span img,
    .arcade-wheel-feature .lobby-wheel-symbol,
    .arcade-shop-button > span img {
        width: 62px !important;
        height: 62px !important;
        max-width: 62px;
        max-height: 62px;
        object-fit: contain;
    }

    .arcade-wheel-feature > strong,
    .arcade-shop-button strong {
        order: 2;
        width: 100%;
        font-size: 11px;
        line-height: 1;
        text-align: center;
    }

    .arcade-info-card {
        padding: 7px 8px !important;
        display: grid;
        grid-template-columns: 38px minmax(0, 1fr) auto;
        gap: 6px;
        align-items: center;
        border: 1px solid rgba(255, 255, 255, .045) !important;
        border-radius: 13px !important;
        overflow: hidden;
    }

    .arcade-info-card > span {
        width: 38px;
        height: 100%;
        min-height: 0;
        display: grid;
        place-items: center;
    }

    .arcade-info-card strong { font-size: 10px; }
    .arcade-info-card b,
    .arcade-info-card small { font-size: 9px; }
}

/* Portrait polish: consistent margins, typography and information density. */
@media (orientation: portrait) and (max-width: 700px) {
    .lobby-tournament-countdown {
        flex-direction: column;
        justify-content: center;
        gap: 3px;
        text-align: center;
    }

    .lobby-tournament-countdown > i {
        font-size: 14px;
    }

    .arcade-lobby-page {
        padding-inline: 10px;
        padding-bottom: 10px;
    }

    .arcade-lobby-board {
        gap: 12px;
    }

    .arcade-play-tile {
        padding: 13px !important;
        padding-bottom: 17px !important;
        display: grid !important;
        grid-template-columns: 42% minmax(0, 1fr);
        grid-template-rows: auto minmax(0, 1fr) auto;
        column-gap: 10px;
        row-gap: 6px;
        align-items: center;
        text-align: center;
    }

    .arcade-play-tile > strong {
        grid-column: 2;
        grid-row: 1;
        width: 100%;
        font-size: clamp(18px, 5vw, 21px);
        line-height: 1.05;
        text-align: center;
    }

    .arcade-play-icon {
        grid-column: 1;
        grid-row: 1 / 3;
        width: 100%;
        height: 100%;
        min-height: 0;
        display: grid;
        place-items: center;
    }

    .arcade-play-icon img {
        width: min(94%, 112px) !important;
        height: min(96%, 108px);
        object-fit: contain;
    }

    .arcade-play-tile .arcade-tile-meta {
        grid-column: 2;
        grid-row: 2;
        width: min(100%, 168px);
        margin: 0 auto;
        display: flex;
        flex-direction: column;
        align-items: stretch;
        justify-content: center;
        gap: 5px;
    }

    .arcade-play-tile .arcade-tile-meta b {
        width: 100%;
        min-height: 25px;
        padding: 5px 8px;
        font-size: 11px;
    }

    .arcade-play-tile .arcade-tile-meta b:first-child { order: 1; }
    .arcade-play-tile .arcade-tile-meta b:last-child {
        order: 2;
        font-size: 13px;
    }
    .arcade-play-tile .arcade-tile-meta b:nth-child(2) { order: 3; }

    .arcade-play-tile .arcade-tile-meta b i {
        min-width: 14px;
    }

    .arcade-play-cta {
        grid-column: 1 / -1;
        grid-row: 3;
        width: min(100%, 242px);
        min-height: 40px;
        margin: 2px auto 3px;
    }

    .arcade-mode-tile {
        padding: 9px 11px !important;
        display: flex !important;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        text-align: center;
        overflow: hidden;
    }

    .arcade-mode-tile > strong {
        position: relative;
        z-index: 3;
        order: 1;
        align-self: center;
        width: 100%;
        font-size: clamp(16px, 4.5vw, 19px);
        line-height: 1.05;
        text-align: center;
    }

    .arcade-mode-tile .arcade-mode-icon {
        position: absolute;
        inset: 25% 8% 25%;
        width: auto;
        height: auto;
        display: grid;
        place-items: center;
    }

    .arcade-mode-tile .arcade-mode-icon img {
        width: min(72%, 82px) !important;
        height: min(88%, 72px) !important;
        max-width: 82px;
        max-height: 72px;
        object-fit: contain;
    }

    .arcade-mode-6 .arcade-mode-icon img {
        width: min(68%, 76px) !important;
        height: min(84%, 68px) !important;
        max-width: 76px;
        max-height: 68px;
    }

    .arcade-mode-tile .arcade-tile-meta {
        position: relative;
        z-index: 3;
        order: 3;
        width: min(100%, 250px);
        margin: auto auto 0;
    }

    .arcade-tile-meta {
        gap: 5px;
    }

    .arcade-info-strip {
        padding: 7px;
    }

    .arcade-info-card {
        gap: 7px;
        padding: 8px !important;
    }

    .arcade-info-card strong {
        font-size: 11px;
        line-height: 1.1;
    }

    .arcade-info-card b {
        font-size: 13px;
        line-height: 1.1;
    }

    .arcade-info-card small {
        font-size: 9px;
        line-height: 1.1;
    }
}

@media (orientation: portrait) and (max-width: 370px) {
    .arcade-lobby-page {
        padding-inline: 6px;
    }

    .arcade-lobby-board {
        gap: 10px;
    }
}

/* The wide Tournament card follows the filled portrait composition. */
@media (orientation: portrait) and (max-width: 700px) {
    .arcade-mode-6 {
        display: grid !important;
        grid-template-columns: 42% minmax(0, 1fr);
        grid-template-rows: auto minmax(0, 1fr);
        column-gap: 10px;
        align-items: center;
        text-align: center;
    }

    .arcade-mode-6 > strong {
        grid-column: 2;
        grid-row: 1;
        width: 100%;
        text-align: center;
    }

    .arcade-mode-6 .arcade-mode-icon {
        position: relative;
        inset: auto;
        grid-column: 1;
        grid-row: 1 / 3;
        width: 100%;
        height: 100%;
        display: grid;
        place-items: center;
    }

    .arcade-mode-6 .arcade-mode-icon img {
        width: min(86%, 88px) !important;
        height: min(90%, 82px) !important;
        max-width: 88px;
        max-height: 82px;
    }

    .arcade-mode-6 .arcade-tile-meta {
        grid-column: 2;
        grid-row: 2;
        width: min(100%, 168px);
        margin: 5px auto 0;
        display: flex;
        flex-direction: column;
        align-items: stretch;
        justify-content: center;
        gap: 4px;
    }

    .arcade-mode-6 .arcade-tile-meta b {
        width: 100%;
        min-height: 23px;
        padding: 4px 7px;
        font-size: 10px;
    }

    .arcade-mode-6 .arcade-tile-meta b:first-child { order: 1; }
    .arcade-mode-6 .arcade-tile-meta b:last-child {
        order: 2;
        font-size: 12px;
    }
    .arcade-mode-6 .arcade-tile-meta b:nth-child(2) { order: 3; }
}

/* Centered landscape carousel with balanced horizontal card content. */
@media (orientation: landscape) and (max-height: 600px) {
    .arcade-mode-slider {
        gap: 14px;
        padding-inline: calc((100% - clamp(250px, 44vw, 380px)) / 2);
        scroll-padding-inline: 0;
        scroll-snap-type: x mandatory !important;
        scroll-behavior: smooth;
    }

    .arcade-mode-slider > .arcade-tile,
    .arcade-mode-slider > .arcade-play-tile {
        flex-basis: clamp(250px, 44vw, 380px);
        scroll-snap-align: center;
        scroll-snap-stop: always;
        transform: scale(.92);
        opacity: .58;
        transition: transform .22s ease, opacity .22s ease, filter .22s ease;
        filter: saturate(.72);
    }

    .arcade-mode-slider > .arcade-tile.lobby-carousel-active {
        transform: scale(1);
        opacity: 1;
        filter: saturate(1);
    }

    .arcade-mode-slider > .arcade-mode-tile {
        padding: 12px 14px !important;
        display: grid !important;
        grid-template-columns: 43% minmax(0, 1fr);
        grid-template-rows: auto minmax(0, 1fr);
        column-gap: 12px;
        align-items: center;
        text-align: center;
    }

    .arcade-mode-slider > .arcade-mode-tile > strong {
        grid-column: 1 / -1;
        grid-row: 1;
        width: 100%;
        font-size: clamp(17px, 2.1vw, 22px);
        line-height: 1.05;
        text-align: center;
    }

    .arcade-mode-slider > .arcade-mode-tile .arcade-mode-icon {
        position: relative;
        inset: auto;
        grid-column: 1;
        grid-row: 2;
        width: 100%;
        height: 100%;
        display: grid;
        place-items: center;
    }

    .arcade-mode-slider > .arcade-mode-tile .arcade-mode-icon img,
    .arcade-mode-slider > .arcade-mode-6 .arcade-mode-icon img {
        width: min(90%, 122px) !important;
        height: min(88%, 112px) !important;
        max-width: 122px;
        max-height: 112px;
    }

    .arcade-mode-slider > .arcade-mode-tile .arcade-tile-meta {
        grid-column: 2;
        grid-row: 2;
        width: 100%;
        margin: 0;
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: repeat(3, auto);
        gap: 5px;
    }

    .arcade-mode-slider > .arcade-play-tile {
        padding: 12px 14px !important;
        display: grid !important;
        grid-template-columns: 43% minmax(0, 1fr);
        grid-template-rows: auto minmax(0, 1fr) auto;
        column-gap: 12px;
        align-items: center;
    }

    .arcade-mode-slider > .arcade-play-tile > strong {
        grid-column: 1 / -1;
        grid-row: 1;
        width: 100%;
        font-size: clamp(19px, 2.35vw, 25px);
        text-align: center;
    }

    .arcade-mode-slider > .arcade-play-tile .arcade-play-icon {
        grid-column: 1;
        grid-row: 2;
        width: 100%;
        height: 100%;
    }

    .arcade-mode-slider > .arcade-play-tile .arcade-play-icon img {
        width: min(94%, 142px) !important;
        height: min(92%, 132px);
        max-width: 142px;
        max-height: 132px;
    }

    .arcade-mode-slider > .arcade-play-tile .arcade-tile-meta {
        grid-column: 2;
        grid-row: 2;
        width: 100%;
        margin: 0;
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: repeat(3, auto);
        gap: 5px;
    }

    .arcade-mode-slider > .arcade-play-tile .arcade-play-cta {
        grid-column: 1 / -1;
        grid-row: 3;
        width: min(100%, 205px);
        margin: 3px auto 1px;
    }
}

/* Secondary modes: win and target together, prominent full-width bet below. */
@media (orientation: portrait) and (max-width: 700px) {
    .arcade-play-tile .arcade-tile-meta {
        width: 100%;
        max-width: none;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 5px;
    }

    .arcade-play-tile .arcade-tile-meta b:first-child {
        grid-column: 1;
        grid-row: 1;
    }

    .arcade-play-tile .arcade-tile-meta b:nth-child(2) {
        grid-column: 2;
        grid-row: 1;
    }

    .arcade-play-tile .arcade-tile-meta b:last-child {
        grid-column: 1 / -1;
        grid-row: 2;
        min-height: 27px;
        font-size: 14px;
    }

    .arcade-mode-tile .arcade-tile-meta,
    .arcade-mode-6 .arcade-tile-meta {
        width: 100%;
        max-width: none;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 4px 5px;
    }

    .arcade-mode-tile .arcade-tile-meta b,
    .arcade-mode-6 .arcade-tile-meta b {
        width: 100%;
        min-height: 21px;
        padding: 3px 5px;
        font-size: 10px;
    }

    .arcade-mode-tile .arcade-tile-meta b:first-child,
    .arcade-mode-6 .arcade-tile-meta b:first-child {
        grid-column: 1;
        grid-row: 1;
    }

    .arcade-mode-tile .arcade-tile-meta b:nth-child(2),
    .arcade-mode-6 .arcade-tile-meta b:nth-child(2) {
        grid-column: 2;
        grid-row: 1;
    }

    .arcade-mode-tile .arcade-tile-meta b:last-child,
    .arcade-mode-6 .arcade-tile-meta b:last-child {
        grid-column: 1 / -1;
        grid-row: 2;
        min-height: 25px;
        font-size: 14px;
    }

    .arcade-mode-5 .arcade-mode-icon img,
    .arcade-mode-4 .arcade-mode-icon img {
        max-width: 70px;
        max-height: 52px;
    }

    .arcade-mode-5 .arcade-mode-icon,
    .arcade-mode-4 .arcade-mode-icon {
        inset: 24% 8% 38%;
    }
}

@media (orientation: landscape) and (max-height: 600px) {
    .arcade-mode-slider > .arcade-play-tile .arcade-tile-meta {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 5px 6px;
    }

    .arcade-mode-slider > .arcade-play-tile .arcade-tile-meta b:first-child {
        grid-column: 1;
        grid-row: 1;
    }

    .arcade-mode-slider > .arcade-play-tile .arcade-tile-meta b:nth-child(2) {
        grid-column: 2;
        grid-row: 1;
    }

    .arcade-mode-slider > .arcade-play-tile .arcade-tile-meta b:last-child {
        grid-column: 1 / -1;
        grid-row: 2;
        min-height: 28px;
        font-size: 15px;
    }

    .arcade-mode-slider > .arcade-mode-tile .arcade-tile-meta {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 5px 6px;
    }

    .arcade-mode-slider > .arcade-mode-tile .arcade-tile-meta b:first-child {
        grid-column: 1;
        grid-row: 1;
    }

    .arcade-mode-slider > .arcade-mode-tile .arcade-tile-meta b:nth-child(2) {
        grid-column: 2;
        grid-row: 1;
    }

    .arcade-mode-slider > .arcade-mode-tile .arcade-tile-meta b:last-child {
        grid-column: 1 / -1;
        grid-row: 2;
        min-height: 28px;
        font-size: 15px;
    }
}

/* Training and Friends keep a compact one-line footer of all three values. */
@media (orientation: portrait) and (max-width: 700px) {
    .arcade-info-card {
        position: relative;
        grid-template-columns: 44px minmax(0, 1fr) 16px;
        grid-template-rows: 18px minmax(48px, 1fr);
        column-gap: 8px;
        row-gap: 4px;
        padding: 8px 10px !important;
        align-items: center;
    }

    .arcade-info-card > div {
        grid-column: 2;
        grid-row: 2;
        gap: 5px;
        align-self: center;
    }

    .arcade-info-card > div > strong {
        position: absolute;
        top: 8px;
        left: 10px;
        right: 10px;
        width: auto;
        font-size: 13px;
        line-height: 1.1;
        text-align: center;
    }

    .arcade-info-card > span {
        grid-column: 1;
        grid-row: 2;
        width: 44px;
        height: 44px;
    }

    .arcade-info-card > span img {
        width: 40px !important;
        height: 40px !important;
        max-width: 40px;
        max-height: 40px;
        padding: 0 !important;
        object-fit: contain;
    }

    .arcade-info-card b {
        font-size: 15px;
    }

    .arcade-info-card small {
        font-size: 11px;
        line-height: 1.2;
    }

    .arcade-tournament-info > .fa-chevron-right {
        display: block;
        grid-column: 3;
        grid-row: 2;
        justify-self: end;
        color: rgba(255, 255, 255, .72);
        font-size: 15px;
    }

    .arcade-wheel-feature > strong,
    .arcade-shop-button > strong {
        padding-bottom: 7px;
    }

    .arcade-wheel-feature > .fa-chevron-right,
    .arcade-shop-button > .arcade-action-arrow {
        bottom: 15px;
    }

    .arcade-play-tile,
    .arcade-mode-6 {
        padding-top: 17px !important;
    }

    .arcade-play-tile > strong,
    .arcade-mode-6 > strong {
        align-self: start;
        padding-top: 3px;
        margin-bottom: 5px;
    }

    .arcade-mode-slider .arcade-tile-meta {
        height: auto !important;
        min-height: 0;
        margin-top: 7px;
        margin-bottom: 5px;
        align-self: end;
        align-items: center;
    }

    .arcade-mode-slider .arcade-tile-meta b {
        height: auto !important;
        padding-block: 7px !important;
        align-self: center;
    }

    .arcade-play-tile .arcade-tile-meta,
    .arcade-mode-6 .arcade-tile-meta {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 4px;
    }

    .arcade-play-tile .arcade-tile-meta b,
    .arcade-mode-6 .arcade-tile-meta b,
    .arcade-play-tile .arcade-tile-meta b:first-child,
    .arcade-mode-6 .arcade-tile-meta b:first-child,
    .arcade-play-tile .arcade-tile-meta b:nth-child(2),
    .arcade-mode-6 .arcade-tile-meta b:nth-child(2),
    .arcade-play-tile .arcade-tile-meta b:last-child,
    .arcade-mode-6 .arcade-tile-meta b:last-child {
        grid-row: 1;
        min-width: 0;
        min-height: 24px;
        padding: 4px;
    }

    .arcade-play-tile .arcade-tile-meta b:first-child,
    .arcade-mode-6 .arcade-tile-meta b:first-child { grid-column: 1; }

    .arcade-play-tile .arcade-tile-meta b:nth-child(2),
    .arcade-mode-6 .arcade-tile-meta b:nth-child(2) { grid-column: 2; }

    .arcade-play-tile .arcade-tile-meta b:last-child,
    .arcade-mode-6 .arcade-tile-meta b:last-child {
        grid-column: 3;
        font-size: 14px;
    }

    .arcade-mode-5 .arcade-tile-meta,
    .arcade-mode-4 .arcade-tile-meta {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 4px;
        margin: 7px 0 5px;
    }

    .arcade-mode-5 .arcade-tile-meta b,
    .arcade-mode-4 .arcade-tile-meta b,
    .arcade-mode-5 .arcade-tile-meta b:first-child,
    .arcade-mode-4 .arcade-tile-meta b:first-child,
    .arcade-mode-5 .arcade-tile-meta b:nth-child(2),
    .arcade-mode-4 .arcade-tile-meta b:nth-child(2),
    .arcade-mode-5 .arcade-tile-meta b:last-child,
    .arcade-mode-4 .arcade-tile-meta b:last-child {
        grid-row: 1;
        min-width: 0;
        min-height: 23px;
        padding: 4px 3px;
        font-size: 10px;
    }

    .arcade-mode-5 .arcade-tile-meta b:first-child,
    .arcade-mode-4 .arcade-tile-meta b:first-child { grid-column: 1; }

    .arcade-mode-5 .arcade-tile-meta b:nth-child(2),
    .arcade-mode-4 .arcade-tile-meta b:nth-child(2) { grid-column: 2; }

    .arcade-mode-5 .arcade-tile-meta b:last-child,
    .arcade-mode-4 .arcade-tile-meta b:last-child {
        grid-column: 3;
        font-size: 12px;
    }
}

/* Final mobile-landscape action and information-card layout. */
@media (orientation: landscape) and (max-height: 600px) {
    .arcade-mode-slider > .arcade-tile:not(.lobby-carousel-active) {
        transform: scale(.86) !important;
        transform-origin: center;
        opacity: .5 !important;
        filter: saturate(.68) !important;
    }

    .arcade-mode-slider > .arcade-tile.lobby-carousel-active {
        transform: scale(1) !important;
        opacity: 1 !important;
        filter: saturate(1) !important;
    }

    .arcade-mode-slider > .arcade-mode-tile,
    .arcade-mode-slider > .arcade-play-tile {
        padding-top: 16px !important;
    }

    .arcade-mode-slider > .arcade-mode-tile > strong,
    .arcade-mode-slider > .arcade-play-tile > strong {
        padding-top: 3px;
        font-size: clamp(20px, 2.5vw, 26px);
    }

    .arcade-mode-slider > .arcade-mode-tile .arcade-tile-meta,
    .arcade-mode-slider > .arcade-play-tile .arcade-tile-meta {
        width: min(72%, 148px);
        justify-self: center;
    }

    .arcade-mode-slider > .arcade-mode-tile .arcade-tile-meta b,
    .arcade-mode-slider > .arcade-play-tile .arcade-tile-meta b {
        height: auto;
        padding-block: 7px;
    }

    .arcade-reward-info .lobby-reward-title-full,
    .arcade-tournament-info .lobby-tournament-title-full {
        display: inline !important;
    }

    .arcade-reward-info .lobby-reward-title-short,
    .arcade-tournament-info .lobby-tournament-title-short {
        display: none !important;
    }

    .arcade-wheel-feature > strong,
    .arcade-shop-button > strong { padding-bottom: 5px; }

    .arcade-wheel-feature > .fa-chevron-right,
    .arcade-shop-button > .arcade-action-arrow { bottom: 12px; }

    .arcade-info-card {
        position: relative;
        grid-template-columns: 40px minmax(0, 1fr) 14px;
        grid-template-rows: 25px minmax(38px, auto);
        column-gap: 7px;
        row-gap: 3px;
        padding: 14px 8px 8px !important;
        align-items: center;
    }

    .arcade-info-card > div {
        grid-column: 2;
        grid-row: 2;
        gap: 2px;
        align-self: center;
    }

    .arcade-info-card > div > strong {
        position: absolute;
        top: 15px;
        left: 8px;
        right: 8px;
        width: auto;
        font-size: 12px;
        line-height: 1.05;
        text-align: center;
    }

    .arcade-info-card > span {
        grid-column: 1;
        grid-row: 2;
        width: 40px;
        height: 40px;
    }

    .arcade-info-card > span img {
        width: 36px !important;
        height: 36px !important;
        max-width: 36px;
        max-height: 36px;
        object-fit: contain;
    }

    .arcade-info-card b { font-size: 13px; }
    .arcade-info-card small {
        font-size: 10px;
        line-height: 1.1;
    }

    .arcade-tournament-info > .fa-chevron-right {
        display: block;
        grid-column: 3;
        grid-row: 2;
        justify-self: end;
        color: rgba(255, 255, 255, .72);
        font-size: 13px;
    }
}
