/*
 * Lion2 Signal — artwork second polish, immutable revision 9.
 *
 * This is the final post-bundle presentation layer. It only refines geometry,
 * material, typography and motion. Routes, administrator content, live text,
 * canvas behavior and application state remain owned by the existing modules.
 */

/* Lion2 second-polish final checkpoint: 2026-08-29 compact-drawer-v3, CDN-safe filename */

/* --------------------------------------------------------------------------
 * Page-title lintel: one real nine-slice frame with route-aware live artwork.
 * ----------------------------------------------------------------------- */

body.lion2-skin.lion-skin[data-lion-heading-ready='true'][data-lion-family]
    #ajax-content#ajax-content#ajax-content
    .signal-page-heading {
    box-sizing: border-box !important;
    min-height: 92px !important;
    padding: 17px 34px 15px 42px !important;
    overflow: hidden !important;
    border: 18px solid transparent !important;
    border-width: 16px 22px !important;
    border-image-source: url('/skin/lion2_main/images/signal/parts-v2/frames/signal-page-lintel-9s-v1.webp') !important;
    border-image-slice: 52 84 !important;
    border-image-width: 16px 22px !important;
    border-image-outset: 0 !important;
    border-image-repeat: stretch !important;
    background:
        linear-gradient(90deg, rgb(5 7 8 / 92%) 0 34%, rgb(5 7 8 / 62%) 68%, rgb(5 7 8 / 28%)),
        url('/skin/lion2_main/images/signal/signal-background-1920-v1.webp') center 44% / cover no-repeat !important;
    box-shadow: 0 10px 24px rgb(0 0 0 / 34%) !important;
}

body.lion2-skin.lion-skin[data-lion-heading-ready='true'][data-lion-family]
    #ajax-content#ajax-content#ajax-content
    .signal-page-heading > .signal-page-heading__surface {
    z-index: 0 !important;
    inset: 0 !important;
    background:
        linear-gradient(90deg, rgb(5 7 8 / 94%) 0 36%, rgb(5 7 8 / 60%) 68%, rgb(5 7 8 / 22%)),
        url('/skin/lion2_main/images/signal/signal-background-1920-v1.webp') center 44% / cover no-repeat !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
}

body.lion2-skin.lion-skin[data-lion-heading-ready='true'][data-lion-family]
    #ajax-content#ajax-content#ajax-content
    .signal-page-heading > :not(.signal-page-heading__surface) {
    position: relative !important;
    z-index: 2 !important;
}

body.lion2-skin.lion-skin[data-lion-heading-ready='true'][data-lion-family][data-lion-route='ranking']
    #ajax-content#ajax-content#ajax-content .w_tournament_ranking .signal-page-heading > .signal-page-heading__surface,
body.lion2-skin.lion-skin[data-lion-heading-ready='true'][data-lion-family][data-lion-route='rolling-king']
    #ajax-content#ajax-content#ajax-content .w_honor_ranking .signal-page-heading > .signal-page-heading__surface,
body.lion2-skin.lion-skin[data-lion-heading-ready='true'][data-lion-family][data-lion-route='hall-of-fame']
    #ajax-content#ajax-content#ajax-content .w_honor_ranking .signal-page-heading > .signal-page-heading__surface {
    background:
        linear-gradient(90deg, rgb(4 8 10 / 95%) 0 32%, rgb(4 8 10 / 58%) 64%, rgb(4 8 10 / 16%)),
        url('/skin/lion2_main/images/campaign/families/lion2-family-ranking-v2.webp') 72% center / cover no-repeat !important;
}

body.lion2-skin.lion-skin[data-lion-heading-ready='true'][data-lion-family][data-lion-route='point']
    #ajax-content#ajax-content#ajax-content .w_point .signal-page-heading > .signal-page-heading__surface {
    background:
        linear-gradient(90deg, rgb(5 8 13 / 95%) 0 40%, rgb(5 8 13 / 52%) 70%, rgb(5 8 13 / 14%)),
        url('/skin/lion2_main/images/campaign/families/lion2-family-point-v2.webp') center / cover no-repeat !important;
}

body.lion2-skin.lion-skin[data-lion-heading-ready='true'][data-lion-family][data-lion-route='join']
    #ajax-content#ajax-content#ajax-content .w_join .signal-page-heading > .signal-page-heading__surface,
body.lion2-skin.lion-skin[data-lion-heading-ready='true'][data-lion-family][data-lion-route='recommend']
    #ajax-content#ajax-content#ajax-content .w_recommend .signal-page-heading > .signal-page-heading__surface {
    background:
        linear-gradient(90deg, rgb(7 8 12 / 95%) 0 40%, rgb(7 8 12 / 52%) 70%, rgb(7 8 12 / 12%)),
        url('/skin/lion2_main/images/campaign/families/lion2-family-join-v2.webp') center / cover no-repeat !important;
}

body.lion2-skin.lion-skin[data-lion-heading-ready='true'][data-lion-family][data-lion-route='roulette']
    #ajax-content#ajax-content#ajax-content .w_roulette .signal-page-heading > .signal-page-heading__surface {
    background:
        linear-gradient(90deg, rgb(8 8 9 / 94%) 0 36%, rgb(8 8 9 / 50%) 68%, rgb(8 8 9 / 12%)),
        url('/skin/lion2_main/images/campaign/families/lion2-family-roulette-v2.webp') center 42% / cover no-repeat !important;
}

/* The production edge keeps immutable CSS bodies aggressively. Repeat the
 * semantic family connections in this new filename so every rendered hero
 * advances atomically with the title lintel. */
body.lion2-skin.lion-skin #ajax-content#ajax-content#ajax-content .page.w_honor_ranking :is(
    .honor-hero,
    .honor-empty-stage
) {
    background:
        linear-gradient(90deg, rgb(4 8 10 / 95%) 0 34%, rgb(4 8 10 / 60%) 64%, rgb(4 8 10 / 18%)),
        url('/skin/lion2_main/images/campaign/families/lion2-family-ranking-v2.webp') 72% center / cover no-repeat !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content#ajax-content .page.w_point
    #point_treasury .point-treasury__balance {
    background:
        linear-gradient(90deg, rgb(5 9 14 / 93%) 0 40%, rgb(5 9 14 / 58%) 72%, rgb(5 9 14 / 20%)),
        url('/skin/lion2_main/images/campaign/families/lion2-family-point-v2.webp') 66% center / cover no-repeat !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content#ajax-content .page.w_join .join-placeholder-stage {
    background:
        linear-gradient(90deg, rgb(7 10 12 / 93%) 0 38%, rgb(7 10 12 / 54%) 68%, rgb(7 10 12 / 16%)),
        url('/skin/lion2_main/images/campaign/families/lion2-family-join-v2.webp') center / cover no-repeat,
        #101416 !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content#ajax-content .page.w_recommend .recommend-hero-visual {
    background:
        linear-gradient(90deg, rgb(7 10 12 / 20%), rgb(7 10 12 / 58%)),
        url('/skin/lion2_main/images/campaign/families/lion2-family-join-v2.webp') 62% center / cover no-repeat,
        #101416 !important;
}

/* --------------------------------------------------------------------------
 * Layout-critical sportsbook and shell typography corrections.
 * ----------------------------------------------------------------------- */

@media screen and (min-width: 981px) {
    body.lion2-skin.lion-skin #ajax-content#ajax-content .w_europe
        .sports-list .game_list li :is(.home_odd, .away_odd) {
        display: inline-flex !important;
        width: auto !important;
        min-width: 44px !important;
        flex: 0 0 44px !important;
        align-items: center !important;
        justify-content: center !important;
        padding-inline: 5px !important;
        line-height: 1.2 !important;
        overflow-wrap: normal !important;
        white-space: nowrap !important;
        word-break: keep-all !important;
    }

    body.lion2-skin.lion-skin #ajax-content#ajax-content .w_special
        .sports-list .game_list :is(li.l_time, .cross-time-row .l_time) {
        width: 112px !important;
        min-width: 112px !important;
        max-width: 112px !important;
        flex: 0 0 112px !important;
        padding-inline: 7px !important;
        overflow: hidden !important;
        line-height: 1.25 !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        word-break: keep-all !important;
    }

    body.lion2-skin .left_content .leftMenu .menu > a,
    body.lion2-skin #sidebar .leftMenu .menu > a {
        font-size: clamp(12px, .68vw, 14px) !important;
        line-height: 1.15 !important;
    }

    body.lion2-skin .right_content .lion-level-name,
    body.lion2-skin #sidebar-right .lion-level-name {
        font-size: 12px !important;
        line-height: 1 !important;
    }

    body.lion2-skin .right_content .signal-quick-label,
    body.lion2-skin #sidebar-right .signal-quick-label {
        font-size: 11px !important;
        line-height: 1.1 !important;
    }

    body.lion2-skin .right_content .signal-service-banner small,
    body.lion2-skin #sidebar-right .signal-service-banner small {
        font-size: 11px !important;
        line-height: 1.35 !important;
    }

    body.lion2-skin[data-lion-page='home'] #ajax-content .signal-hero-market-panel > span > b {
        font-size: clamp(12px, .74vw, 15px) !important;
        line-height: 1 !important;
    }

    body.lion2-skin[data-lion-page='home'] #ajax-content .signal-hero-market-panel > span > small {
        font-size: clamp(10px, .58vw, 12px) !important;
        line-height: 1 !important;
        letter-spacing: .08em !important;
    }
}

/* --------------------------------------------------------------------------
 * Home composition: stronger live type, equal board wells and fixed cards.
 * ----------------------------------------------------------------------- */

@media screen and (min-width: 981px) {
    body.lion2-skin.lion-skin[data-lion-page='home'] #ajax-content#ajax-content#ajax-content
        .signal-main-slide-copy {
        width: min(590px, 62%) !important;
        padding: clamp(17px, 1.7vw, 28px) clamp(23px, 2.4vw, 38px) !important;
        border-left-width: clamp(6px, .55vw, 9px) !important;
        background: linear-gradient(90deg, rgb(3 5 6 / 92%), rgb(3 5 6 / 66%) 68%, transparent) !important;
    }

    body.lion2-skin.lion-skin[data-lion-page='home'] #ajax-content#ajax-content#ajax-content
        .signal-main-slide-copy strong,
    body.lion2-skin.lion-skin[data-lion-page='home'] #ajax-content#ajax-content#ajax-content
        .signal-hero-copy strong {
        font-size: clamp(34px, 2.85vw, 54px) !important;
        line-height: 1.02 !important;
        letter-spacing: -.055em !important;
    }

    body.lion2-skin.lion-skin[data-lion-page='home'] #ajax-content#ajax-content#ajax-content
        .signal-main-slide-copy > span,
    body.lion2-skin.lion-skin[data-lion-page='home'] #ajax-content#ajax-content#ajax-content
        .signal-hero-subtitle {
        margin-top: 12px !important;
        font-size: clamp(15px, 1.05vw, 19px) !important;
        line-height: 1.35 !important;
    }
}

body.lion2-skin.lion-skin[data-lion-page='home'] #ajax-content#ajax-content#ajax-content
    .main_notice_area {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    align-items: stretch !important;
}

body.lion2-skin.lion-skin[data-lion-page='home'] #ajax-content#ajax-content#ajax-content
    .main_notice_area .notice_box,
body.lion2-skin.lion-skin[data-lion-page='home'] #ajax-content#ajax-content#ajax-content
    .main_notice_area .notice_box .inn {
    height: 214px !important;
    min-height: 214px !important;
}

body.lion2-skin.lion-skin[data-lion-page='home'] #ajax-content#ajax-content#ajax-content
    .main_notice_area .notice_box .inn {
    grid-template-rows: 46px minmax(0, 1fr) !important;
}

body.lion2-skin.lion-skin[data-lion-page='home'] #ajax-content#ajax-content#ajax-content
    .main_notice_area .notice_box h1 {
    box-sizing: border-box !important;
    height: 46px !important;
    min-height: 46px !important;
    padding-inline: 12px !important;
    border: 8px solid transparent !important;
    border-width: 7px 12px !important;
    border-image-source: url('/skin/lion2_main/images/signal/parts-v2/frames/signal-page-lintel-9s-v1.webp') !important;
    border-image-slice: 52 84 !important;
    border-image-width: 7px 12px !important;
    border-image-repeat: stretch !important;
    background:
        linear-gradient(180deg, #d2d1cb 0%, #aaa9a3 48%, #7f8281 100%) !important;
}

body.lion2-skin.lion-skin[data-lion-page='home'] #ajax-content#ajax-content#ajax-content
    .main_notice_area .notice_box .table_wrap {
    height: 168px !important;
    min-height: 168px !important;
}

body.lion2-skin.lion-skin[data-lion-page='home'] #ajax-content#ajax-content#ajax-content .mpmenu1 {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 8px !important;
    align-items: stretch !important;
}

body.lion2-skin.lion-skin[data-lion-page='home'] #ajax-content#ajax-content#ajax-content
    .mpmenu1 > a:not(.mobile) {
    position: relative !important;
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    aspect-ratio: 4 / 3 !important;
    overflow: hidden !important;
    border: 9px solid transparent !important;
    border-image-source: url('/skin/lion2_main/images/signal/parts-v2/frames/signal-part-frame-heavy-9s-v1.webp') !important;
    border-image-slice: 72 fill !important;
    border-image-width: 9px !important;
    background-position: center !important;
    background-size: cover !important;
    box-shadow: 0 7px 16px rgb(0 0 0 / 34%) !important;
    transition: filter .18s ease, box-shadow .18s ease !important;
}

body.lion2-skin.lion-skin[data-lion-page='home'] #ajax-content#ajax-content#ajax-content
    .mpmenu1 > a:not(.mobile):is(:hover, :focus-visible) {
    filter: brightness(1.08) contrast(1.04) !important;
    box-shadow: 0 9px 22px rgb(0 0 0 / 46%), inset 0 0 0 2px rgb(255 212 0 / 42%) !important;
}

/* --------------------------------------------------------------------------
 * Roulette: retain the live canvas while giving it a coherent instrument bay.
 * ----------------------------------------------------------------------- */

body.lion2-skin.lion-skin #ajax-content#ajax-content#ajax-content .page.w_roulette .roulette_wrap {
    isolation: isolate !important;
    min-height: 760px !important;
    padding: 22px 20px 24px !important;
    overflow: hidden !important;
    border: 12px solid transparent !important;
    border-image-source: url('/skin/lion2_main/images/signal/parts-v2/frames/signal-part-frame-heavy-9s-v1.webp') !important;
    border-image-slice: 72 fill !important;
    border-image-width: 12px !important;
    background:
        radial-gradient(circle at 50% 36%, rgb(255 212 0 / 12%), transparent 29%),
        linear-gradient(180deg, rgb(5 8 9 / 24%) 0 52%, rgb(5 8 9 / 88%) 86%),
        url('/skin/lion2_main/images/campaign/families/lion2-family-roulette-v2.webp') center 40% / cover no-repeat,
        url('/skin/lion2_main/images/signal/signal-background-1920-v1.webp') center / cover no-repeat !important;
    box-shadow: inset 0 0 80px rgb(0 0 0 / 48%), 0 12px 28px rgb(0 0 0 / 38%) !important;
}

body.lion2-skin.lion-skin #ajax-content .w_roulette .roulette_circle {
    filter: saturate(.72) contrast(1.16) brightness(.86) drop-shadow(0 16px 24px rgb(0 0 0 / 56%)) !important;
}

body.lion2-skin.lion-skin #ajax-content .w_roulette .roulette_canvas {
    isolation: isolate !important;
    border-radius: 50% !important;
    filter: drop-shadow(0 14px 20px rgb(0 0 0 / 48%)) !important;
}

body.lion2-skin.lion-skin #ajax-content .w_roulette .roulette_canvas::before,
body.lion2-skin.lion-skin #ajax-content .w_roulette .roulette_canvas::after {
    position: absolute !important;
    z-index: 4 !important;
    border-radius: 50% !important;
    content: '' !important;
    pointer-events: none !important;
}

body.lion2-skin.lion-skin #ajax-content .w_roulette .roulette_canvas::before {
    inset: 1.5% !important;
    border: clamp(3px, .45vw, 7px) solid #4e5354 !important;
    box-shadow:
        inset 0 0 0 2px #111415,
        inset 0 0 22px rgb(0 0 0 / 58%),
        0 0 0 2px rgb(255 212 0 / 34%) !important;
}

body.lion2-skin.lion-skin #ajax-content .w_roulette .roulette_canvas::after {
    inset: 8.5% !important;
    border: 1px solid rgb(255 212 0 / 48%) !important;
    box-shadow: inset 0 0 18px rgb(0 0 0 / 42%) !important;
}

body.lion2-skin.lion-skin #ajax-content .w_roulette .roulette_canvas canvas {
    border-radius: 50% !important;
    filter: saturate(.22) sepia(.3) contrast(1.23) brightness(.8) !important;
}

body.lion2-skin.lion-skin #ajax-content .w_roulette .roulette_btn {
    overflow: hidden !important;
    border: 7px solid #34393a !important;
    border-radius: 50% !important;
    background:
        radial-gradient(circle at 44% 36%, #fff3a0 0 5%, #ffd400 28%, #b89000 68%, #171a1b 70%) !important;
    box-shadow: inset 0 0 0 3px #0a0c0d, 0 7px 20px rgb(0 0 0 / 60%) !important;
}

body.lion2-skin.lion-skin #ajax-content .w_roulette .roulette_btn #roulette_start {
    transition: color .16s ease, text-shadow .16s ease !important;
}

body.lion2-skin.lion-skin #ajax-content .w_roulette .roulette_btn #roulette_start:is(:hover, :focus-visible) {
    color: #000 !important;
    text-shadow: 0 1px 0 rgb(255 255 255 / 48%) !important;
}

/* --------------------------------------------------------------------------
 * Sparse boards and finance columns: deliberate composition, not dead space.
 * ----------------------------------------------------------------------- */

body.lion2-skin #ajax-content .w_notice .notice-card-list:has(> :only-child),
body.lion2-skin #ajax-content .w_notice .notice-card-list:has(> :nth-child(2):last-child) {
    box-sizing: border-box !important;
    min-height: clamp(320px, 45vh, 540px) !important;
    align-content: start !important;
    padding: clamp(12px, 2vw, 24px) !important;
    border: 1px solid #4d5456 !important;
    border-bottom: 5px solid #ffd400 !important;
    background:
        linear-gradient(90deg, rgb(7 10 11 / 52%), rgb(7 10 11 / 28%)),
        url('/skin/lion2_main/images/signal/signal-background-1920-v1.webp') center 58% / cover no-repeat !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content#ajax-content
    .page.w_notice #notice_list_wrap {
    background-color: transparent !important;
    background-image: none !important;
}

body.lion2-skin #ajax-content .w_notice .notice-card-list:has(> :only-child) {
    grid-template-columns: minmax(0, 720px) !important;
}

body.lion2-skin #ajax-content .w_notice .notice-card-list:has(> :nth-child(2):last-child) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

body.lion2-skin #ajax-content .w_notice .notice-card-list > .notice-card {
    align-self: start !important;
    background: #151a1c !important;
    box-shadow: 0 8px 20px rgb(0 0 0 / 34%) !important;
    transition: border-color .18s ease, box-shadow .18s ease, filter .18s ease !important;
}

body.lion2-skin #ajax-content .w_notice .notice-card-list > .notice-card:is(:hover, :focus-within) {
    border-color: #ffd400 !important;
    filter: brightness(1.04) !important;
    box-shadow: 0 10px 24px rgb(0 0 0 / 44%) !important;
}

@media screen and (min-width: 981px) {
    body.lion2-skin #ajax-content :is(.w_deposit, .w_withdraw) .forColumn {
        grid-template-columns: minmax(0, 1.14fr) minmax(330px, .86fr) !important;
        align-items: stretch !important;
        gap: 16px !important;
    }

    body.lion2-skin #ajax-content :is(.w_deposit, .w_withdraw) .forColumn > :is(.col.m1, .col.m2) {
        align-self: stretch !important;
    }

    body.lion2-skin #ajax-content :is(.w_deposit, .w_withdraw)
        .forColumn > .col.m1 > .rectBox {
        height: 100% !important;
        min-height: 100% !important;
    }

    body.lion2-skin #ajax-content :is(.w_deposit, .w_withdraw) .forColumn > .col.m2 {
        align-self: start !important;
    }

    body.lion2-skin #ajax-content :is(.w_deposit, .w_withdraw)
        .forColumn > .col.m2 > .rectBox {
        position: sticky !important;
        top: 12px !important;
        height: auto !important;
        min-height: 0 !important;
        background:
            linear-gradient(180deg, rgb(12 16 17 / 86%), rgb(7 10 11 / 96%)),
            url('/skin/lion2_main/images/signal/signal-background-1920-v1.webp') 70% center / cover no-repeat !important;
    }

    body.lion2-skin #ajax-content :is(.w_deposit, .w_withdraw)
        .forColumn > .col.m2 .payment_method {
        display: flex !important;
        min-height: 0 !important;
        flex-direction: column !important;
        gap: 14px !important;
    }

    body.lion2-skin #ajax-content :is(.w_deposit, .w_withdraw)
        .forColumn > .col.m2 .payment_method > .row {
        min-height: 0 !important;
        align-items: start !important;
        flex: 0 0 auto !important;
    }
}

/* --------------------------------------------------------------------------
 * Attendance and betting history: tactile states and stable numeric tracks.
 * ----------------------------------------------------------------------- */

body.lion2-skin #ajax-content .w_attendance .attendance-header-card {
    background:
        linear-gradient(90deg, rgb(15 19 20 / 94%), rgb(15 19 20 / 74%)),
        url('/skin/lion2_main/images/signal/signal-background-1920-v1.webp') center 36% / cover no-repeat !important;
    box-shadow: inset 0 0 0 1px rgb(255 255 255 / 4%), 0 8px 18px rgb(0 0 0 / 28%) !important;
}

body.lion2-skin #ajax-content .w_attendance .attendance-calendar-card {
    background:
        linear-gradient(rgb(8 11 12 / 90%), rgb(8 11 12 / 96%)),
        url('/skin/lion2_main/images/signal/signal-background-1920-v1.webp') center / cover no-repeat !important;
}

body.lion2-skin #ajax-content .w_attendance #date_list :is(
    .wd14.day,
    .bg-attendance-blue2,
    .bg-attendance-none-blue2
) {
    position: relative !important;
    min-height: clamp(76px, 6.8vw, 104px) !important;
    background-color: rgb(15 20 21 / 92%) !important;
    box-shadow: inset 0 0 0 1px rgb(255 255 255 / 3%) !important;
}

body.lion2-skin #ajax-content .w_attendance #date_list .bg-attendance-blue2 {
    border: 2px solid #ffd400 !important;
    background:
        linear-gradient(135deg, rgb(255 212 0 / 13%), transparent 52%),
        #111718 !important;
}

body.lion2-skin #ajax-content .w_attendance #date_list .bg-attendance-none-blue2 {
    border: 1px solid #444b4d !important;
    opacity: .72 !important;
}

body.lion2-skin #ajax-content .w_attendance .attendance-day-empty::before {
    width: 34px !important;
    height: 34px !important;
    border: 1px solid rgb(255 212 0 / 34%) !important;
    border-radius: 0 !important;
    background:
        repeating-linear-gradient(135deg, rgb(255 212 0 / 10%) 0 4px, transparent 4px 8px),
        #0b0f10 !important;
    box-shadow: inset 0 0 0 4px rgb(0 0 0 / 28%) !important;
    transform: rotate(45deg) !important;
}

@media screen and (min-width: 981px) {
    body.lion2-skin #ajax-content .w_mybet .betting_content > :is(.gscore, .gdate, .gresult),
    body.lion2-skin #ajax-content .w_mybet .betting_content > :is(.gscore, .gdate, .gresult) * {
        overflow-wrap: normal !important;
        white-space: nowrap !important;
        word-break: keep-all !important;
    }

    body.lion2-skin #ajax-content .w_mybet .betting_content > .gscore {
        min-width: 0 !important;
    }

    body.lion2-skin #ajax-content .w_mybet .betting_content > .gdate {
        min-width: 0 !important;
    }

    body.lion2-skin #ajax-content .w_mybet .betting_content > .gresult {
        min-width: 0 !important;
    }

    body.lion2-skin #ajax-content .w_mybet .betting_content > .gresult .bet-badge {
        box-sizing: border-box !important;
        width: 100% !important;
        min-width: 0 !important;
        padding-inline: 4px !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }
}

body.lion2-skin #ajax-content .w_mybet .mybet-bulk-actions > .mybet-delete-selected {
    border: 1px solid #d85e58 !important;
    background: #171a1b !important;
    color: #ff8b84 !important;
    box-shadow: inset 4px 0 0 #d85e58 !important;
    transition: background-color .16s ease, color .16s ease, border-color .16s ease !important;
}

body.lion2-skin #ajax-content .w_mybet .mybet-bulk-actions > .mybet-delete-selected:is(:hover, :focus-visible) {
    border-color: #ff8b84 !important;
    background: #2a1718 !important;
    color: #fff !important;
}

/* --------------------------------------------------------------------------
 * Provider/game cards and empty stages: one chassis, source color preserved.
 * ----------------------------------------------------------------------- */

body.lion2-skin #ajax-content :is(
    #provider_list,
    #favorite_list,
    #mini_game_list,
    #lotus_game_list,
    #tokengame_list,
    #mingo_list
) .live-game-cont {
    position: relative !important;
    isolation: isolate !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    border: 8px solid transparent !important;
    border-image-source: url('/skin/lion2_main/images/signal/parts-v2/frames/signal-part-frame-heavy-9s-v1.webp') !important;
    border-image-slice: 72 fill !important;
    border-image-width: 8px !important;
    background: #101415 !important;
    box-shadow: 0 7px 16px rgb(0 0 0 / 34%) !important;
    transition: transform .18s ease, filter .18s ease, box-shadow .18s ease !important;
}

body.lion2-skin #ajax-content :is(
    #provider_list,
    #favorite_list,
    #mini_game_list,
    #lotus_game_list,
    #tokengame_list,
    #mingo_list
) .live-game-cont:is(:hover, :focus-within) {
    filter: brightness(1.05) contrast(1.03) !important;
    box-shadow: 0 11px 24px rgb(0 0 0 / 46%), inset 0 0 0 1px rgb(255 212 0 / 34%) !important;
    transform: translateY(-2px) !important;
}

body.lion2-skin #ajax-content :is(
    #provider_list,
    #favorite_list,
    #mini_game_list,
    #lotus_game_list,
    #tokengame_list,
    #mingo_list
) .live-game-cont > .el-row {
    position: relative !important;
    display: block !important;
    overflow: hidden !important;
    background:
        linear-gradient(180deg, rgb(255 255 255 / 3%), transparent 28%),
        #101415 !important;
}

body.lion2-skin #ajax-content :is(
    #provider_list,
    #favorite_list,
    #mini_game_list,
    #lotus_game_list,
    #tokengame_list,
    #mingo_list
) .live-game-cont > .el-row > img:first-child:not(.live-play) {
    object-position: center 34% !important;
    filter: saturate(.88) contrast(1.08) brightness(.94) !important;
    transition: filter .18s ease, transform .28s cubic-bezier(.2, .7, .2, 1) !important;
}

body.lion2-skin #ajax-content :is(
    #provider_list,
    #favorite_list,
    #mini_game_list,
    #lotus_game_list,
    #tokengame_list,
    #mingo_list
) .live-game-cont:is(:hover, :focus-within) > .el-row > img:first-child:not(.live-play) {
    filter: saturate(.98) contrast(1.1) brightness(1.02) !important;
    transform: scale(1.025) !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content #mingo_list
    .live-game-cont > .el-row::after {
    display: none !important;
    content: none !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content #provider_list
    .live-game-cont > .el-row > img[src*='/images/game-cards/virtual/'] {
    width: 100% !important;
    aspect-ratio: 4 / 3 !important;
    object-fit: cover !important;
    object-position: center !important;
}

body.lion2-skin #ajax-content :is(
    .signal-game-empty,
    .signal-realtime-empty,
    .coupon-empty-state,
    .customer-empty-state,
    .esport-launch-shell
) {
    position: relative !important;
    isolation: isolate !important;
    overflow: hidden !important;
    border: 10px solid transparent !important;
    border-image-source: url('/skin/lion2_main/images/signal/parts-v2/frames/signal-part-frame-heavy-9s-v1.webp') !important;
    border-image-slice: 72 fill !important;
    border-image-width: 10px !important;
    background:
        linear-gradient(90deg, rgb(7 10 11 / 93%) 0 42%, rgb(7 10 11 / 70%) 72%, rgb(7 10 11 / 50%)),
        url('/skin/lion2_main/images/signal/signal-background-1920-v1.webp') center / cover no-repeat !important;
    box-shadow: inset 0 0 50px rgb(0 0 0 / 34%), 0 10px 24px rgb(0 0 0 / 30%) !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content#ajax-content
    .page.w_coupon .coupon-empty-state {
    position: relative !important;
    isolation: isolate !important;
    min-height: clamp(290px, 42vh, 460px) !important;
    align-content: end !important;
    overflow: hidden !important;
    padding: clamp(18px, 3vw, 38px) !important;
    border: 10px solid transparent !important;
    border-image-source: url('/skin/lion2_main/images/signal/parts-v2/frames/signal-part-frame-heavy-9s-v1.webp') !important;
    border-image-slice: 72 fill !important;
    border-image-width: 10px !important;
    background:
        linear-gradient(180deg, rgb(5 8 9 / 12%) 0 40%, rgb(5 8 9 / 94%) 82%),
        url('/skin/lion2_main/images/campaign/families/lion2-family-point-v2.webp') center 56% / cover no-repeat !important;
    color: #f2f0e9 !important;
    box-shadow: inset 0 0 68px rgb(0 0 0 / 38%), 0 10px 24px rgb(0 0 0 / 32%) !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content#ajax-content
    .page.w_coupon .coupon-empty-state > :is(.coupon-empty-state__title, .coupon-empty-state__body) {
    position: relative !important;
    z-index: 2 !important;
    box-sizing: border-box !important;
    width: min(560px, 100%) !important;
    margin-inline: 0 !important;
    text-align: left !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content#ajax-content
    .page.w_coupon .coupon-empty-state__title {
    padding: 18px 22px 7px 26px !important;
    border-top: 1px solid #535b5d !important;
    border-right: 1px solid #535b5d !important;
    border-left: 7px solid #ffd400 !important;
    background: rgb(8 11 12 / 94%) !important;
    color: #f2f0e9 !important;
    font-family: var(--signal-font-display) !important;
    font-size: clamp(21px, 2vw, 30px) !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content#ajax-content
    .page.w_coupon .coupon-empty-state__body {
    padding: 5px 22px 18px 26px !important;
    border-right: 1px solid #535b5d !important;
    border-bottom: 1px solid #535b5d !important;
    border-left: 7px solid #ffd400 !important;
    background: rgb(8 11 12 / 94%) !important;
    color: #bfc5c5 !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content#ajax-content
    .page.w_questions .bbsl_wrap:has(> .bbsl_item_container--empty:only-child) {
    display: grid !important;
    min-height: clamp(340px, 48vh, 520px) !important;
    align-items: end !important;
    padding: clamp(16px, 3vw, 38px) !important;
    overflow: hidden !important;
    border: 10px solid transparent !important;
    border-image-source: url('/skin/lion2_main/images/signal/parts-v2/frames/signal-part-frame-heavy-9s-v1.webp') !important;
    border-image-slice: 72 fill !important;
    border-image-width: 10px !important;
    background-color: #080b0c !important;
    background-image:
        linear-gradient(180deg, rgb(5 8 9 / 8%) 0 38%, rgb(5 8 9 / 94%) 84%),
        url('/skin/lion2_main/images/signal/signal-background-1920-v1.webp') !important;
    background-position: center, center 58% !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    box-shadow: inset 0 0 74px rgb(0 0 0 / 42%), 0 10px 24px rgb(0 0 0 / 32%) !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content#ajax-content
    .page.w_questions .bbsl_item_container.bbsl_item_container--empty {
    position: relative !important;
    box-sizing: border-box !important;
    width: min(580px, 100%) !important;
    min-height: 112px !important;
    align-items: center !important;
    justify-content: flex-start !important;
    padding: 22px 24px 22px 28px !important;
    border: 1px solid #535b5d !important;
    border-left: 7px solid #ffd400 !important;
    background: rgb(8 11 12 / 94%) !important;
    color: #f2f0e9 !important;
    font-family: var(--signal-font-display) !important;
    font-size: clamp(18px, 1.7vw, 25px) !important;
    font-weight: 800 !important;
    text-align: left !important;
    box-shadow: 10px 12px 0 rgb(0 0 0 / 30%) !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content#ajax-content
    .page.w_questions .bbsl_item_container--empty::before {
    display: block !important;
    width: 44px !important;
    height: 44px !important;
    margin-right: 15px !important;
    border: 1px solid #75630a !important;
    background:
        repeating-linear-gradient(135deg, rgb(255 212 0 / 24%) 0 4px, transparent 4px 8px),
        #171a1b !important;
    box-shadow: inset 0 0 0 4px #090b0c !important;
    content: '' !important;
}

body.lion2-skin #ajax-content .signal-game-empty {
    min-height: clamp(250px, 38vh, 440px) !important;
}

/* Ranking, realtime and external-service empty states must still feel like
 * occupied rooms in the same venue. Live copy stays in the DOM; these layers
 * only provide a route-appropriate environment and a readable quiet field. */
body.lion2-skin.lion-skin #ajax-content#ajax-content#ajax-content
    .page.w_tournament_ranking #ranking-event-list:has(> .ranking-empty) {
    position: relative !important;
    display: grid !important;
    min-height: clamp(360px, 48vh, 520px) !important;
    align-items: center !important;
    overflow: hidden !important;
    padding: clamp(22px, 3vw, 44px) !important;
    border: 10px solid transparent !important;
    border-image-source: url('/skin/lion2_main/images/signal/parts-v2/frames/signal-part-frame-heavy-9s-v1.webp') !important;
    border-image-slice: 72 fill !important;
    border-image-width: 10px !important;
    background:
        linear-gradient(90deg, rgb(5 8 9 / 96%) 0 36%, rgb(5 8 9 / 72%) 54%, rgb(5 8 9 / 14%) 78%),
        url('/skin/lion2_main/images/campaign/families/lion2-family-ranking-v2.webp') 72% center / cover no-repeat !important;
    box-shadow: inset 0 0 64px rgb(0 0 0 / 42%), 0 10px 24px rgb(0 0 0 / 32%) !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content#ajax-content
    .page.w_tournament_ranking #ranking-event-list > .ranking-empty {
    box-sizing: border-box !important;
    width: min(520px, 52%) !important;
    min-height: 118px !important;
    align-content: center !important;
    justify-self: start !important;
    padding: 24px 26px 24px 30px !important;
    border: 1px solid #535b5d !important;
    border-left: 7px solid #ffd400 !important;
    background: linear-gradient(90deg, rgb(8 11 12 / 97%), rgb(8 11 12 / 88%)) !important;
    color: #f2f0e9 !important;
    font-family: var(--signal-font-display) !important;
    font-size: clamp(19px, 1.55vw, 25px) !important;
    font-weight: 800 !important;
    line-height: 1.35 !important;
    text-align: left !important;
    box-shadow: 10px 12px 0 rgb(0 0 0 / 30%) !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content#ajax-content
    .w_realtime .signal-realtime-empty,
body.lion2-skin.lion-skin #ajax-content#ajax-content#ajax-content
    .w_realtime #realtime_list > .width-full.display-center:has(.p-t-24) {
    background-color: #080b0c !important;
    background-image:
        linear-gradient(90deg, rgb(5 8 9 / 38%), rgb(5 8 9 / 8%) 50%, rgb(5 8 9 / 38%)),
        linear-gradient(180deg, rgb(5 8 9 / 8%) 0 46%, rgb(5 8 9 / 58%) 100%),
        url('/skin/lion2_main/images/signal/signal-background-1920-v1.webp') !important;
    background-position: center, center, center 58% !important;
    background-repeat: no-repeat !important;
    background-size: cover, cover, cover !important;
    box-shadow: inset 0 0 78px rgb(0 0 0 / 42%) !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content#ajax-content
    .w_realtime .signal-realtime-empty > :is(.signal-realtime-empty__beacon, h2, p) {
    position: relative !important;
    z-index: 2 !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content#ajax-content .esport-launch-shell {
    min-height: clamp(430px, 52vh, 590px) !important;
    padding: 10px !important;
    border: 10px solid transparent !important;
    border-image-source: url('/skin/lion2_main/images/signal/parts-v2/frames/signal-part-frame-heavy-9s-v1.webp') !important;
    border-image-slice: 72 fill !important;
    border-image-width: 10px !important;
    background: #080b0c !important;
    box-shadow: inset 0 0 60px rgb(0 0 0 / 36%), 0 10px 24px rgb(0 0 0 / 30%) !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content#ajax-content
    .esport-launch-shell > #esport-loading.esport-status {
    min-height: clamp(400px, 49vh, 550px) !important;
    place-content: center start !important;
    padding: clamp(28px, 5vw, 70px) !important;
    border: 0 !important;
    background-color: #080b0c !important;
    background-image:
        linear-gradient(90deg, rgb(5 8 9 / 92%) 0 34%, rgb(5 8 9 / 48%) 55%, rgb(5 8 9 / 8%) 78%),
        linear-gradient(180deg, rgb(5 8 9 / 8%), rgb(5 8 9 / 52%)),
        url('/skin/lion2_main/images/signal/signal-background-1920-v1.webp') !important;
    background-position: center, center, center 58% !important;
    background-repeat: no-repeat !important;
    background-size: cover, cover, cover !important;
    color: #f2f0e9 !important;
    text-align: left !important;
    box-shadow: inset 0 0 78px rgb(0 0 0 / 40%) !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content#ajax-content
    .esport-launch-shell > #esport-loading.esport-status > p {
    box-sizing: border-box !important;
    width: min(560px, 54%) !important;
    margin: 0 !important;
    padding: 22px 24px 22px 28px !important;
    border: 1px solid #535b5d !important;
    border-left: 7px solid #ffd400 !important;
    background: linear-gradient(90deg, rgb(8 11 12 / 97%), rgb(8 11 12 / 88%)) !important;
    color: #f2f0e9 !important;
    font-family: var(--signal-font-display) !important;
    font-size: clamp(17px, 1.35vw, 22px) !important;
    font-weight: 800 !important;
    line-height: 1.5 !important;
    text-align: left !important;
    box-shadow: 10px 12px 0 rgb(0 0 0 / 30%) !important;
}

/* --------------------------------------------------------------------------
 * Mobile: keep the compact shell, separate counts from sport medallions.
 * ----------------------------------------------------------------------- */

@media screen and (min-width: 1366px) and (max-width: 1413px) {
    body.lion2-skin.lion-skin #sidebar#sidebar .leftMenu .sports-left-search__form {
        grid-template-columns: minmax(0, 1fr) 36px !important;
    }

    body.lion2-skin.lion-skin #sidebar#sidebar .leftMenu .sports-left-search__button {
        box-sizing: border-box !important;
        width: 36px !important;
        min-width: 36px !important;
    }
}

@media screen and (min-width: 481px) and (max-width: 980px) {
    body.lion2-skin.lion-skin[data-lion-page='home'] #ajax-content#ajax-content#ajax-content
        .mpmenu1 {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}

@media screen and (max-width: 480px) {
    body.lion2-skin.lion-skin[data-lion-page='home'] #ajax-content#ajax-content#ajax-content
        .mpmenu1 {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media screen and (max-width: 980px) {
    body.lion2-skin.lion-skin[data-lion-heading-ready='true'][data-lion-family]
        #ajax-content#ajax-content#ajax-content
        .signal-page-heading {
        min-height: 76px !important;
        padding: 9px 13px 8px 18px !important;
        border-width: 11px 14px !important;
        border-image-width: 11px 14px !important;
    }

    body.lion2-skin.lion-skin[data-lion-page='home'] #ajax-content#ajax-content#ajax-content
        .main_notice_area {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 8px !important;
    }

    body.lion2-skin.lion-skin[data-lion-page='home'] #ajax-content#ajax-content#ajax-content
        .main_notice_area .notice_box,
    body.lion2-skin.lion-skin[data-lion-page='home'] #ajax-content#ajax-content#ajax-content
        .main_notice_area .notice_box .inn {
        height: auto !important;
        min-height: 208px !important;
    }

    body.lion2-skin #ajax-content .w_notice .notice-card-list:has(> :only-child),
    body.lion2-skin #ajax-content .w_notice .notice-card-list:has(> :nth-child(2):last-child) {
        min-height: 0 !important;
        grid-template-columns: minmax(0, 1fr) !important;
        padding: 9px !important;
    }

    body.lion2-skin #ajax-content :is(.w_cross, .w_special, .w_realtime, .w_europe, .w_inplay)
        .spo_jong .sports-type {
        position: relative !important;
    }

    body.lion2-skin #ajax-content :is(.w_cross, .w_special, .w_realtime, .w_europe, .w_inplay)
        .spo_jong .sports-type > small {
        position: absolute !important;
        z-index: 3 !important;
        top: 3px !important;
        right: 3px !important;
        display: inline-flex !important;
        width: auto !important;
        min-width: 22px !important;
        height: 18px !important;
        align-items: center !important;
        justify-content: center !important;
        padding-inline: 4px !important;
        border: 1px solid rgb(255 212 0 / 62%) !important;
        border-radius: 0 !important;
        background: rgb(5 7 8 / 92%) !important;
        color: #ffd400 !important;
        font-size: 10px !important;
        line-height: 1 !important;
        pointer-events: none !important;
    }

    body.lion2-skin.lion-skin #ajax-content#ajax-content .w_realtime .spo-scroll-wrap {
        position: relative !important;
        box-sizing: border-box !important;
        padding-inline: 44px !important;
        overflow: hidden !important;
        border: 1px solid #4e5557 !important;
        border-bottom: 4px solid #ffd400 !important;
        background: #0b0e0f !important;
    }

    body.lion2-skin.lion-skin #ajax-content#ajax-content .w_realtime
        .spo-scroll-wrap > .spo_jong {
        box-sizing: border-box !important;
        width: 100% !important;
        min-width: 0 !important;
        border: 0 !important;
    }

    body.lion2-skin.lion-skin #ajax-content#ajax-content .w_realtime
        .spo-scroll-wrap > :is(.spo-arrow-left, .spo-arrow-right) {
        position: absolute !important;
        z-index: 8 !important;
        top: 0 !important;
        bottom: 0 !important;
        display: inline-flex !important;
        box-sizing: border-box !important;
        width: 44px !important;
        min-width: 44px !important;
        height: auto !important;
        min-height: 44px !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background:
            repeating-linear-gradient(135deg, rgb(255 212 0 / 10%) 0 4px, transparent 4px 8px),
            #15191a !important;
        color: #ffd400 !important;
        font-size: 31px !important;
        line-height: 1 !important;
        opacity: 1 !important;
        transform: none !important;
        transition: opacity .16s ease, color .16s ease, background-color .16s ease !important;
    }

    body.lion2-skin.lion-skin #ajax-content#ajax-content .w_realtime
        .spo-scroll-wrap > .spo-arrow-left {
        right: auto !important;
        left: 0 !important;
        border-right: 1px solid #4e5557 !important;
    }

    body.lion2-skin.lion-skin #ajax-content#ajax-content .w_realtime
        .spo-scroll-wrap > .spo-arrow-right {
        right: 0 !important;
        left: auto !important;
        border-left: 1px solid #4e5557 !important;
    }

    body.lion2-skin.lion-skin #ajax-content#ajax-content .w_realtime
        .spo-scroll-wrap > :is(.spo-arrow-left, .spo-arrow-right):is(:hover, :focus-visible) {
        background-color: #ffd400 !important;
        color: #080a0b !important;
        outline: 2px solid #fff3a0 !important;
        outline-offset: -3px !important;
    }

    body.lion2-skin.lion-skin #ajax-content#ajax-content .w_realtime
        .spo-scroll-wrap > :is(.spo-arrow-left, .spo-arrow-right).is-hidden {
        opacity: 0 !important;
        pointer-events: none !important;
    }

    body.lion2-skin.lion-skin #ajax-content#ajax-content .w_realtime
        .spo-scroll-wrap.no-scroll > :is(.spo-arrow-left, .spo-arrow-right) {
        display: none !important;
    }

    body.lion2-skin.lion-skin #ajax-content#ajax-content .w_realtime
        .spo-scroll-wrap.no-scroll {
        padding-inline: 0 !important;
    }

    body.lion2-skin.lion-skin #ajax-content#ajax-content#ajax-content .page.w_roulette .roulette_wrap {
        min-height: clamp(560px, 150vw, 720px) !important;
        padding: 10px 8px 16px !important;
        border-width: 8px !important;
        border-image-width: 8px !important;
    }

    body.lion2-skin #ajax-content .w_attendance #date_list :is(
        .wd14.day,
        .bg-attendance-blue2,
        .bg-attendance-none-blue2
    ) {
        min-height: 58px !important;
    }

    body.lion2-skin #ajax-content .w_attendance .attendance-day-empty::before {
        width: 22px !important;
        height: 22px !important;
    }

    body.lion2-skin #ajax-content :is(
        #provider_list,
        #favorite_list,
        #mini_game_list,
        #lotus_game_list,
        #tokengame_list,
        #mingo_list
    ) .live-game-cont {
        border-width: 6px !important;
        border-image-width: 6px !important;
    }

    body.lion2-skin.lion-skin #ajax-content#ajax-content#ajax-content
        .page.w_tournament_ranking #ranking-event-list:has(> .ranking-empty) {
        min-height: 330px !important;
        align-items: end !important;
        padding: 12px !important;
        border-width: 7px !important;
        border-image-width: 7px !important;
        background:
            linear-gradient(180deg, rgb(5 8 9 / 10%) 0 38%, rgb(5 8 9 / 94%) 78%),
            url('/skin/lion2_main/images/campaign/families/lion2-family-ranking-v2.webp') 69% center / cover no-repeat !important;
    }

    body.lion2-skin.lion-skin #ajax-content#ajax-content#ajax-content
        .page.w_tournament_ranking #ranking-event-list > .ranking-empty,
    body.lion2-skin.lion-skin #ajax-content#ajax-content#ajax-content
        .esport-launch-shell > #esport-loading.esport-status > p {
        width: 100% !important;
        min-height: 0 !important;
        padding: 16px 17px !important;
        border-left-width: 5px !important;
        font-size: 17px !important;
    }

    body.lion2-skin.lion-skin #ajax-content#ajax-content#ajax-content
        .w_realtime .signal-realtime-empty,
    body.lion2-skin.lion-skin #ajax-content#ajax-content#ajax-content
        .w_realtime #realtime_list > .width-full.display-center:has(.p-t-24) {
        min-height: 420px !important;
        background-position: 56% center !important;
    }

    body.lion2-skin.lion-skin #ajax-content#ajax-content#ajax-content .esport-launch-shell {
        min-height: 390px !important;
        border-width: 7px !important;
        border-image-width: 7px !important;
    }

    body.lion2-skin.lion-skin #ajax-content#ajax-content#ajax-content
        .esport-launch-shell > #esport-loading.esport-status {
        min-height: 360px !important;
        place-content: end stretch !important;
        padding: 12px !important;
        background-image:
            linear-gradient(180deg, rgb(5 8 9 / 8%) 0 36%, rgb(5 8 9 / 94%) 82%),
            url('/skin/lion2_main/images/signal/signal-background-1920-v1.webp') !important;
        background-position: center, 58% center !important;
        background-repeat: no-repeat !important;
        background-size: cover, cover !important;
    }
}

/* --------------------------------------------------------------------------
 * Compact desktop account access: the continuous rail is not yet wide enough
 * at 981–1237px, so expose the canonical right panel as an accessible drawer.
 * ----------------------------------------------------------------------- */

@layer lion2-signal-shell {
@media screen and (min-width: 981px) and (max-width: 1237px) {
    html.side-panel-open,
    body.lion2-skin.side-panel-open {
        overflow: hidden !important;
    }

    body.lion2-skin.lion-skin[data-lion-page] .top_wrap .userm_wrap ul.submenu {
        box-sizing: border-box !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        margin-right: 52px !important;
        justify-self: stretch !important;
        transform: none !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
    }

    body.lion2-skin.lion-skin .top_wrap .m_menu_pc_btn {
        position: absolute !important;
        z-index: 1803 !important;
        top: clamp(17px, 1.55vw, 21px) !important;
        right: clamp(8px, .84vw, 12px) !important;
        bottom: auto !important;
        left: auto !important;
        display: inline-flex !important;
        box-sizing: border-box !important;
        width: 44px !important;
        min-width: 44px !important;
        height: 48px !important;
        min-height: 44px !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 0 !important;
        border: 1px solid #5d6263 !important;
        border-bottom: 3px solid var(--signal-yellow-hot, #ffd316) !important;
        border-radius: 0 !important;
        background:
            var(--signal-part-key-dark) center / 100% 100% no-repeat,
            #151819 !important;
        color: var(--signal-yellow-hot, #ffd316) !important;
        box-shadow:
            inset 0 0 0 2px #070809,
            inset 0 1px rgb(255 255 255 / 16%),
            0 3px 9px rgb(0 0 0 / 42%) !important;
        clip-path: none !important;
        cursor: pointer !important;
        filter: none !important;
        opacity: 1 !important;
        pointer-events: auto !important;
        visibility: visible !important;
    }

    body.lion2-skin.lion-skin .top_wrap .m_menu_pc_btn > span {
        display: block !important;
        width: auto !important;
        height: auto !important;
        color: inherit !important;
        font-size: 0 !important;
        line-height: 1 !important;
        opacity: 1 !important;
        visibility: visible !important;
    }

    body.lion2-skin.lion-skin .top_wrap .m_menu_pc_btn > span::before {
        display: block !important;
        color: inherit !important;
        content: '\25a4' !important;
        font-family: Arial, sans-serif !important;
        font-size: 20px !important;
        font-weight: 900 !important;
        line-height: 1 !important;
    }

    body.lion2-skin.lion-skin .top_wrap .m_menu_pc_btn:is(:hover, :focus-visible),
    body.lion2-skin.lion-skin .top_wrap .m_menu_pc_btn[aria-expanded='true'] {
        border-color: var(--signal-yellow-hot, #ffd316) !important;
        background:
            var(--signal-part-key-yellow) center / 100% 100% no-repeat,
            #d8ac00 !important;
        color: #080a0b !important;
        filter: none !important;
        transform: none !important;
    }

    body.lion2-skin.lion-skin .top_wrap .m_menu_pc_btn:focus-visible {
        outline: 2px solid var(--signal-yellow-hot, #ffd316) !important;
        outline-offset: 2px !important;
    }

    body.lion2-skin.lion-skin .right_content#sidebar-right#sidebar-right.active {
        position: fixed !important;
        z-index: 1802 !important;
        top: var(--lion-desktop-header-height, 126px) !important;
        right: 0 !important;
        bottom: auto !important;
        left: auto !important;
        display: block !important;
        box-sizing: border-box !important;
        width: min(390px, calc(100vw - 24px)) !important;
        min-width: 0 !important;
        max-width: calc(100vw - 24px) !important;
        height: calc(100dvh - var(--lion-desktop-header-height, 126px)) !important;
        min-height: 0 !important;
        max-height: calc(100dvh - var(--lion-desktop-header-height, 126px)) !important;
        padding: 10px !important;
        overflow: hidden !important;
        border: 8px solid transparent !important;
        border-image:
            var(--signal-part-frame-heavy)
            var(--signal-slice-frame-heavy) / 8px / 0 stretch !important;
        background-color: #07090a !important;
        background-image:
            linear-gradient(270deg, rgb(202 201 193 / 10%), transparent 42%),
            var(--signal-part-rail-right-top),
            var(--signal-part-rail-right-bottom),
            var(--signal-part-rail-right-mid),
            var(--signal-part-concrete) !important;
        background-position: center, right top, right bottom, right top, center !important;
        background-repeat: no-repeat, no-repeat, no-repeat, repeat-y, repeat !important;
        background-size: cover, 100% auto, 100% auto, 100% auto, 192px 192px !important;
        box-shadow: 0 0 30px rgb(0 0 0 / 76%) !important;
        opacity: 1 !important;
        overscroll-behavior: contain;
        pointer-events: auto !important;
        transform: none !important;
        visibility: visible !important;
    }

    body.lion2-skin.lion-skin .right_content#sidebar-right#sidebar-right.active > .scrollFrame {
        display: block !important;
        box-sizing: border-box !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: 100% !important;
        min-height: 0 !important;
        max-height: 100% !important;
        padding: 0 !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        background: transparent !important;
        overscroll-behavior: contain;
        scrollbar-color: #727674 #111415;
        scrollbar-width: thin;
    }

    body.lion2-skin.lion-skin .right_content#sidebar-right#sidebar-right.active .rightMenu,
    body.lion2-skin.lion-skin .right_content#sidebar-right#sidebar-right.active .rightMenu
        > :is(.login_box, .user_body, .r_banner) {
        box-sizing: border-box !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }

    body.lion2-skin.lion-skin .lion-side-panel-backdrop {
        position: fixed !important;
        z-index: 1800 !important;
        inset: var(--lion-desktop-header-height, 126px) 0 0 !important;
        display: none !important;
        background: rgb(0 0 0 / 62%) !important;
        pointer-events: none !important;
        touch-action: none;
    }

    body.lion2-skin.lion-skin .lion-side-panel-backdrop.active {
        display: block !important;
        pointer-events: auto !important;
    }
}
}

@media (prefers-reduced-motion: reduce) {
    body.lion2-skin.lion-skin[data-lion-page='home'] #ajax-content .signal-main-slide-copy,
    body.lion2-skin #ajax-content .w_roulette :is(.roulette_circle, .roulette_canvas, .roulette_btn),
    body.lion2-skin #ajax-content .w_notice .notice-card-list > .notice-card,
    body.lion2-skin #ajax-content .w_mybet .mybet-bulk-actions > .mybet-delete-selected,
    body.lion2-skin #ajax-content :is(
        #provider_list,
        #favorite_list,
        #mini_game_list,
        #lotus_game_list,
        #tokengame_list,
        #mingo_list
    ) .live-game-cont,
    body.lion2-skin #ajax-content :is(
        #provider_list,
        #favorite_list,
        #mini_game_list,
        #lotus_game_list,
        #tokengame_list,
        #mingo_list
    ) .live-game-cont > .el-row > img:first-child:not(.live-play) {
        animation: none !important;
        scroll-behavior: auto !important;
        transition: none !important;
    }
}