@charset "utf-8";

/* ZCOOL XiaoWei subset for the two-glyph Xinglan wordmark (SIL OFL 1.1). */
@font-face {
    font-family: "Xinglan Display";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("data:font/woff2;base64,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") format("woff2");
    unicode-range: U+661F, U+6F9C;
}

/* Noto Sans SC semibold subset for the four-glyph hero wordmark (SIL OFL 1.1). */
@font-face {
    font-family: "Xinglan Hero";
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url("data:font/woff;base64,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") format("woff");
    unicode-range: U+4E50, U+5A31, U+661F, U+6F9C;
}

:root {
    --xl-bet-bg: #ececec;
    --xl-bet-panel: #f6f6f6;
    --xl-bet-panel-strong: #ffffff;
    --xl-bet-line: #d8dcde;
    --xl-bet-line-dark: #a9b2b8;
    --xl-bet-text: #56616a;
    --xl-bet-title: #3f494f;
    --xl-bet-muted: #92999e;
    --xl-bet-green: #4f9d83;
    --xl-bet-green-dark: #397d68;
    --xl-bet-teal: #48b6ba;
    --xl-bet-coral: #eb896d;
    --xl-bet-gold: #e7bc59;
}

body.xl-bet-page {
    margin: 0;
    min-width: 1180px;
    min-height: 100vh;
    overflow-x: auto;
    color: var(--xl-bet-text);
    background: var(--xl-bet-bg);
    font-family: "Microsoft YaHei", "PingFang SC", Arial, sans-serif;
}

.xl-bet-page *,
.xl-bet-page *::before,
.xl-bet-page *::after {
    box-sizing: border-box;
}

.xl-bet-page .context,
.xl-bet-page #dock3,
.xl-bet-page #jinhu_menu {
    display: none !important;
}

.xl-bet-page a {
    color: inherit;
    text-decoration: none;
}

/* Shared compact account header used by the production template. */
.xl-bet-page .header.xl-compact-header {
    min-height: 46px;
    color: #6f777c;
    background: #f4f5f5;
    border-bottom: 1px solid #d9ddde;
}

.xl-bet-page .xl-compact-header .xl-shell {
    width: 1180px;
    min-height: 46px;
}

.xl-bet-page .xl-brand-cn {
    color: #2f6555;
    font-size: 25px;
}

.xl-bet-page .xl-brand-en {
    color: var(--xl-bet-green);
}

.xl-bet-page .xl-compact-account,
.xl-bet-page .xl-compact-account strong {
    color: #697278;
}

.xl-bet-page .xl-compact-account .xl-account-money {
    color: var(--xl-bet-green-dark);
}

.xl-bet-page .xl-compact-actions a,
.xl-bet-page .xl-compact-actions a:first-child {
    padding: 6px 10px;
    color: #647078;
    border: 0;
    border-radius: 4px;
    background: transparent;
}

.xl-bet-page .xl-compact-actions a:hover,
.xl-bet-page .xl-compact-actions a:first-child:hover {
    color: #fff;
    background: var(--xl-bet-green);
}

/* Production betting page: preserve all original IDs and runtime generated nodes. */
.xl-bet-page.detail_bg > .tz_content {
    width: 100%;
    margin: 0;
    padding: 18px 0 0;
    overflow: visible;
}

.xl-bet-page .part_content {
    width: 1180px;
    margin: 0 auto;
}

.xl-bet-page .gameBet {
    width: 100%;
    display: grid;
    grid-template-columns: 42px minmax(0, 808px) minmax(0, 310px);
    gap: 10px;
    align-items: start;
}

.xl-bet-page .xl-play-mode {
    padding-top: 126px;
}

.xl-bet-page .xl-play-mode a {
    min-height: 82px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 10px;
    padding: 8px 5px;
    border-radius: 6px;
    color: #66757a;
    background: #f9f9f9;
    font-size: 13px;
    line-height: 1.3;
    text-align: center;
    writing-mode: vertical-rl;
}

.xl-bet-page .xl-play-mode a.is-active {
    color: var(--xl-bet-green-dark);
    border-left: 2px solid var(--xl-bet-green);
}

.xl-bet-page .gameBet .gameBet_left,
.xl-bet-page .part_right {
    width: auto;
    min-width: 0;
    float: none;
    overflow: visible;
}

.xl-bet-page .gameBet .gameBet_left {
    min-height: 760px;
}

.xl-bet-page .part_right {
    height: auto;
}

.xl-bet-page .gameBet .g_Time_Section {
    width: 100%;
    height: 108px;
    display: flex;
    align-items: center;
    overflow: visible;
    border-radius: 10px;
    background: rgba(255, 255, 255, .74);
}

.xl-bet-page .part_top_game {
    width: 285px;
    height: 92px;
    display: flex;
    align-items: center;
    padding-left: 14px;
}

.xl-bet-page .part_icon {
    width: 220px;
    height: 80px;
    display: flex;
    align-items: center;
    margin: 0;
}

.xl-bet-page .part_icon img {
    max-width: 220px;
    max-height: 76px;
    object-fit: contain;
}

.xl-bet-page .icon_more {
    width: 22px;
    height: 22px;
    margin-left: 10px;
    border: 1px solid var(--xl-bet-line);
    border-radius: 50%;
    background: #fff !important;
}

.xl-bet-page .part_game_tcc {
    top: 90px;
    left: 0;
    background: #fff;
    border: 1px solid var(--xl-bet-line);
    box-shadow: 0 16px 40px rgba(48, 64, 69, .14);
}

.xl-bet-page .part_game_tcc dl dd p,
.xl-bet-page .part_game_tcc dl dd li,
.xl-bet-page .part_game_tcc dl dd li a {
    color: #59666c;
    border-color: var(--xl-bet-line);
}

.xl-bet-page .part_l_detail {
    width: calc(100% - 285px);
    height: 92px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    line-height: 1;
}

.xl-bet-page .part_l_detail ul {
    display: flex;
    align-items: center;
    justify-content: center;
}

.xl-bet-page .part_l_detail ul li {
    float: none;
    margin: 0 8px;
}

.xl-bet-page .part_issue {
    order: 1;
    margin-left: 0;
    color: var(--xl-bet-green-dark);
    font-size: 13px;
}

.xl-bet-page .j_lottery_time {
    order: 2;
}

.xl-bet-page .part_time {
    display: block;
    color: var(--xl-bet-green);
    font-size: 40px;
    font-weight: 500;
    letter-spacing: .08em;
    font-variant-numeric: tabular-nums;
}

.xl-bet-page .part_tws {
    order: 3;
    opacity: .6;
}

.xl-bet-page .g_Play_Section,
.xl-bet-page .gameBet_left .g_Number_Section,
.xl-bet-page .g_Panel_Section {
    background: var(--xl-bet-panel);
}

.xl-bet-page .g_Play_Section {
    margin-top: 10px;
    padding: 0 12px;
    border-radius: 10px 10px 0 0;
}

.xl-bet-page .play_select {
    padding-top: 6px;
}

.xl-bet-page .gameBet_left .play_select_tit {
    min-height: 34px;
    display: flex;
    align-items: flex-end;
    justify-content: space-around;
    border-bottom: 1px solid var(--xl-bet-line-dark);
}

.xl-bet-page .gameBet_left .play_select_tit li,
.xl-bet-page .gameBet_left .CzPlay_1000 .play_select_tit li {
    min-width: 80px;
    height: 34px;
    padding: 0 12px;
    line-height: 34px;
    text-align: center;
}

.xl-bet-page .gameBet_left .play_select_tit li:hover,
.xl-bet-page .gameBet_left .play_select_tit li.curr {
    color: var(--xl-bet-green-dark);
    background: transparent;
    border-bottom: 2px solid var(--xl-bet-green);
    border-radius: 0;
}

.xl-bet-page .gameBet_left .play_select_cont {
    margin-bottom: 0;
}

.xl-bet-page .gameBet_left .play_select_cont li.curr {
    padding: 8px 0 5px;
}

.xl-bet-page .gameBet_left .play_select_cont li dl {
    height: 31px;
    margin: 0;
}

.xl-bet-page .gameBet_left .play_select_cont li dl dt {
    width: 70px;
    height: 28px;
    padding: 0;
    color: #5f686e;
    border: 0;
    background: transparent;
    line-height: 28px;
}

.xl-bet-page .gameBet_left .play_select_cont li dl dd {
    min-width: 92px;
    margin-left: 6px;
    padding: 5px 10px;
    text-align: center;
}

.xl-bet-page .gameBet_left .play_select_cont li dl dd.curr,
.xl-bet-page .gameBet_left .play_select_cont li dl dd.curr:hover {
    color: #fff;
    background: var(--xl-bet-green);
    border-radius: 14px;
}

.xl-bet-page .gameBet_left .play_select_cont li dl dd:hover,
.xl-bet-page .gameBet_left .play_select_prompt .example_btn {
    color: var(--xl-bet-green-dark);
}

.xl-bet-page .gameBet_left .g_Number_Section {
    margin: 0;
    padding: 8px 12px 10px;
}

.xl-bet-page .gameBet_left .gn_main_cont {
    padding: 0;
}

.xl-bet-page .gameBet_left .gn_main_cont .ball_section .li_ball {
    min-height: 53px;
    display: flex;
    align-items: center;
    margin: 0;
}

.xl-bet-page .gameBet_left .ball_section .li_ball .ball_tit {
    width: 68px;
    flex: 0 0 68px;
    margin: 0 8px 0 0;
    padding: 0;
}

.xl-bet-page .gameBet_left .ball_section .li_ball .ball_tit strong {
    width: auto;
    height: 30px;
    color: #687177;
    background: transparent;
    font-size: 13px;
    line-height: 30px;
}

.xl-bet-page .gameBet_left .ball_section .li_ball .ball_cont {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0;
}

.xl-bet-page .gameBet_left .ball_section .li_ball .ball_cont > li {
    width: 36px;
    margin: 0 3px;
}

.xl-bet-page .gameBet_left .ball_section .li_ball .ball_cont > li > a {
    width: 34px;
    height: 34px;
    color: #3f484e;
    border: 0;
    background: #e0e2e3;
    font-size: 18px;
    font-weight: 700;
    line-height: 34px;
}

.xl-bet-page .gameBet_left .ball_section .li_ball .ball_cont > li:hover > a {
    width: 34px;
    height: 34px;
    color: #fff;
    background: #6db29b;
}

.xl-bet-page .gameBet_left .ball_section .li_ball .ball_cont > li > a.curr,
.xl-bet-page .gameBet_left .ball_section .li_ball .ball_cont > li > a.curr:hover {
    color: #fff;
    background: var(--xl-bet-coral);
}

.xl-bet-page .gameBet_left .ball_section .li_ball .ball_control {
    flex: 0 0 210px;
    margin: 0;
}

.xl-bet-page .gameBet_left .ball_section .li_ball .ball_control .control_hidden {
    display: flex;
    justify-content: flex-end;
    gap: 5px;
}

.xl-bet-page .gameBet_left .ball_section .li_ball .ball_control .control_hidden a {
    width: 28px;
    height: 30px;
    margin: 0;
    color: #56636d;
    border: 1px solid #c7cccf;
    background: #fafafa;
    line-height: 28px;
}

.xl-bet-page .gameBet_left .ball_section .li_ball .ball_control .control_hidden a:hover {
    color: var(--xl-bet-green-dark);
    border-color: var(--xl-bet-green);
}

.xl-bet-page .g_Panel_Section {
    width: 100%;
    height: 52px;
    margin: 0;
    padding: 8px 12px;
    border: 0;
    border-top: 1px solid var(--xl-bet-line);
    border-radius: 0 0 10px 10px;
}

.xl-bet-page .g_Panel_Section .choice_cound {
    margin: 0;
    line-height: 34px;
}

.xl-bet-page #choice_Multiple,
.xl-bet-page .g_Panel_Section .choice_cound select {
    height: 30px;
    border: 1px solid #b9c7d2;
    border-radius: 5px;
    box-shadow: none;
}

.xl-bet-page .g_Panel_Section .choice_comfire a {
    min-width: 122px;
    height: 52px;
    padding: 0 20px;
    border-radius: 0 0 10px 0;
    background: var(--xl-bet-green);
    font-size: 15px;
    line-height: 52px;
    text-align: center;
}

.xl-bet-page .c_open {
    min-height: 108px;
    margin: 0;
    padding: 10px 12px 8px;
    border: 0;
    border-radius: 10px;
    background: rgba(255, 255, 255, .74);
}

.xl-bet-page .part_r_top {
    color: #6d777d;
    font-size: 12px;
    text-align: center;
}

.xl-bet-page .part_r_top font {
    display: inline-block;
}

.xl-bet-page .part_r_top em {
    color: var(--xl-bet-green-dark);
    font-weight: 700;
}

.xl-bet-page .part_r_number {
    min-height: 58px;
}

.xl-bet-page .part_r_number ul,
.xl-bet-page #openNum_list {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.xl-bet-page .part_r_number li,
.xl-bet-page .part_r_number li .li_wrap,
.xl-bet-page .part_r_number li .li_wrap span {
    width: 42px;
    height: 42px;
    border: 0;
    border-radius: 50%;
    background: #dfe2e2;
    box-shadow: inset 0 -5px 0 #c9cdce;
    color: #334047;
    font-size: 20px;
    font-weight: 800;
    line-height: 42px;
    text-align: center;
}

.xl-bet-page .part_r_number li:nth-child(-n+2),
.xl-bet-page .part_r_number li:nth-child(-n+2) .li_wrap,
.xl-bet-page .part_r_number li:nth-child(-n+2) .li_wrap span {
    color: #fff;
    background: var(--xl-bet-green);
    box-shadow: inset 0 -5px 0 var(--xl-bet-green-dark);
}

.xl-bet-page .part_r_number li:nth-child(n+3),
.xl-bet-page .part_r_number li:nth-child(n+3) .li_wrap,
.xl-bet-page .part_r_number li:nth-child(n+3) .li_wrap span {
    color: #fff;
    background: var(--xl-bet-coral);
    box-shadow: inset 0 -5px 0 #bd6c57;
}

.xl-bet-page .part_r_agn {
    display: block;
}

.xl-bet-page .part_r_con {
    height: 676px;
    margin: 10px 0 0;
    padding: 10px 12px;
    border-radius: 10px;
    background: var(--xl-bet-panel);
}

.xl-bet-page .part_r_list {
    height: 38px;
    margin: 0 0 8px;
    border: 0;
    border-bottom: 1px solid var(--xl-bet-line-dark);
    border-radius: 0;
    background: transparent;
}

.xl-bet-page .part_r_list ul {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
}

.xl-bet-page .part_r_list ul li,
.xl-bet-page .part_r_list ul li:last-child {
    width: auto;
    height: 38px;
    border: 0;
    border-radius: 0;
    background: transparent;
    line-height: 38px;
    font-size: 12px;
}

.xl-bet-page .part_r_list ul li.part_blue {
    color: var(--xl-bet-green-dark);
    background: transparent;
    border-bottom: 2px solid var(--xl-bet-green);
}

.xl-bet-page .tab_box {
    height: 360px;
    overflow-y: auto;
}

.xl-bet-page .part_r_tab {
    height: auto;
}

.xl-bet-page .part_r_tab table th {
    color: #8b9296;
    border-color: var(--xl-bet-line);
    font-size: 11px;
}

.xl-bet-page .part_r_tab table td {
    height: 43px;
    padding: 6px 4px;
    border-bottom: 1px solid #e4e5e6;
    font-size: 11px;
}

.xl-bet-page .part_r_tab tbody tr:hover {
    background: #e7efec;
}

.xl-bet-page .part_r_tab tbody tr:hover td,
.xl-bet-page .part_r_tab tbody tr:hover td a {
    color: #526069;
}

.xl-bet-page .part_r_tab .c_org {
    color: var(--xl-bet-coral) !important;
}

.xl-bet-page .part_today {
    height: 102px;
    margin-top: 8px;
    padding-top: 0;
}

.xl-bet-page .part_today_l {
    width: 100%;
    height: 100px;
    margin: 0;
    background: #fff;
    border: 1px solid var(--xl-bet-line-dark);
    border-radius: 9px;
}

.xl-bet-page .part_Section {
    margin-top: 10px;
}

.xl-bet-page .part_today_c {
    height: 30px;
    margin: 4px 0;
    font-size: 12px;
    line-height: 30px;
}

.xl-bet-page .part_today_r,
.xl-bet-page .part_today_r ul {
    width: 150px;
}

.xl-bet-page .part_today_r ul li {
    width: 66px;
    margin-left: 7px;
    border: 1px solid #bfc6c9;
    background: #fff;
    font-size: 11px;
}

.xl-bet-page .part_r_fot {
    padding-top: 5px;
    font-size: 12px;
}

.xl-bet-page .part_btn_true a {
    min-width: 82px;
    display: inline-block;
    padding: 7px 12px;
    border: 0;
    border-radius: 16px;
    color: #fff;
    background: var(--xl-bet-green);
    text-align: center;
}

.xl-bet-page .part_btn_true a.cancel {
    display: none;
}

.xl-bet-page .additional,
.xl-bet-page .chase_list_cont {
    position: fixed;
    top: 50%;
    right: auto;
    bottom: auto;
    left: 50%;
    box-sizing: border-box;
    max-width: calc(100vw - 32px);
    max-height: calc(100vh - 32px);
    overflow: auto;
    transform: translate(-50%, -50%);
    z-index: 1200;
}

.xl-bet-page .additional {
    width: 518px;
    height: auto;
}

.xl-bet-page .chase_list_cont {
    width: 522px;
    min-height: 0;
}

.xl-bet-page .xl-record-panel {
    width: 1180px;
    min-height: 360px;
    margin: 20px auto 36px;
    padding: 0 16px;
    background: var(--xl-bet-panel);
}

.xl-bet-page .xl-record-tabs {
    min-height: 45px;
    display: grid;
    grid-template-columns: repeat(6, 112px) 1fr auto;
    align-items: center;
    border-bottom: 1px solid var(--xl-bet-line-dark);
}

.xl-bet-page .xl-record-tabs a {
    position: relative;
    padding: 14px 10px 12px;
    color: #68737a;
    font-size: 12px;
    text-align: center;
}

.xl-bet-page .xl-record-tabs a.is-active,
.xl-bet-page .xl-record-tabs a:hover {
    color: var(--xl-bet-green-dark);
}

.xl-bet-page .xl-record-tabs a.is-active::after {
    content: "";
    position: absolute;
    right: 24px;
    bottom: -1px;
    left: 24px;
    height: 2px;
    background: var(--xl-bet-green);
}

.xl-bet-page .xl-record-panel table {
    width: 100%;
    border-collapse: collapse;
}

.xl-bet-page .xl-record-panel th {
    height: 55px;
    color: #7c858a;
    border-bottom: 1px solid var(--xl-bet-line-dark);
    font-size: 12px;
    font-weight: 400;
}

.xl-bet-page .xl-record-panel td {
    height: 230px;
    color: #a2a7aa;
    text-align: center;
}

/* Standalone browser preview. */
.xl-bet-preview {
    min-width: 320px !important;
}

.xl-guest-landing[hidden],
.xl-game-experience[hidden] {
    display: none !important;
}

.xl-guest-landing {
    position: fixed;
    inset: 0;
    z-index: 1000;
    min-width: 320px;
    min-height: 100vh;
    min-height: 100dvh;
    overflow: hidden;
    color: #f6f3e9;
    background: #071c1d;
    isolation: isolate;
}

.xl-guest-landing::before {
    position: absolute;
    inset: 0;
    z-index: -1;
    content: "";
    background: rgba(4, 28, 28, .54);
}

.xl-guest-backdrop {
    position: absolute;
    inset: 0;
    z-index: -2;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 58%;
    opacity: .84;
    filter: sepia(.34) saturate(1.34) hue-rotate(108deg) contrast(1.08);
    transform: scale(1.01);
}

.xl-guest-header {
    position: relative;
    z-index: 2;
    width: min(1400px, calc(100% - 96px));
    height: 92px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid rgba(239, 216, 152, .2);
}

.xl-guest-header-brand {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    color: #fff;
}

.xl-guest-header-brand img {
    width: 38px;
    height: 38px;
    filter: drop-shadow(0 8px 18px rgba(0, 0, 0, .28));
}

.xl-guest-header-brand span {
    display: grid;
    gap: 2px;
}

.xl-guest-header-brand strong {
    font-family: "Xinglan Display", "Songti SC", STSong, serif;
    font-size: 24px;
    font-weight: 400;
    letter-spacing: .16em;
    line-height: 1;
}

.xl-guest-header-brand small {
    color: #d9b75e;
    font-family: Arial, sans-serif;
    font-size: 7px;
    font-weight: 700;
    letter-spacing: .32em;
    line-height: 1;
}

.xl-guest-header-actions {
    display: flex;
    align-items: center;
}

.xl-guest-header-actions button,
.xl-guest-login-button {
    border: 1px solid #d5af55;
    color: #142e2a;
    background: #e6c56e;
    font: inherit;
    font-weight: 700;
    letter-spacing: .08em;
    cursor: pointer;
    box-shadow: 0 12px 32px rgba(0, 0, 0, .2);
    transition: color .18s ease, background-color .18s ease, border-color .18s ease, transform .18s ease;
}

.xl-guest-header-actions button {
    min-width: 88px;
    height: 36px;
    border-radius: 18px;
    font-size: 12px;
}

.xl-guest-header-actions button:hover,
.xl-guest-login-button:hover {
    border-color: #f2d98f;
    background: #f2d98f;
    transform: translateY(-1px);
}

.xl-guest-header-actions button:focus-visible,
.xl-guest-login-button:focus-visible,
.xl-guest-header-brand:focus-visible {
    outline: 2px solid #fff0bb;
    outline-offset: 4px;
}

.xl-guest-header-actions button:disabled,
.xl-guest-login-button:disabled {
    opacity: .52;
    cursor: wait;
    transform: none;
}

.xl-guest-hero {
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 50%;
    width: min(620px, calc(100% - 40px));
    text-align: center;
    transform: translate(-50%, -47%);
}

.xl-guest-lockup {
    display: grid;
    justify-items: center;
    gap: 10px;
    margin-bottom: 24px;
}

.xl-guest-lockup img {
    width: 92px;
    height: 92px;
    filter: drop-shadow(0 20px 38px rgba(0, 0, 0, .38));
}

.xl-guest-lockup span {
    color: #ddbf6e;
    font-family: Arial, sans-serif;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .46em;
    text-indent: .46em;
}

.xl-guest-eyebrow {
    margin: 0 0 14px;
    color: rgba(235, 222, 178, .74);
    font-family: Arial, sans-serif;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .36em;
    text-indent: .36em;
}

.xl-guest-hero h1 {
    margin: 0;
    color: #f4e5b8;
    font-family:
        "Xinglan Hero",
        "Noto Sans CJK SC",
        "Source Han Sans SC",
        "PingFang SC",
        "Microsoft YaHei UI",
        "Microsoft YaHei",
        sans-serif;
    font-size: clamp(44px, 4.2vw, 62px);
    font-weight: 600;
    letter-spacing: .14em;
    line-height: 1.08;
    text-indent: .14em;
    text-shadow: 0 2px 14px rgba(0, 0, 0, .38);
    white-space: nowrap;
}

.xl-guest-login-button {
    width: 148px;
    height: 44px;
    margin-top: 30px;
    border-radius: 22px;
    font-size: 13px;
}

.xl-guest-status {
    min-height: 20px;
    margin: 16px 0 0;
    color: rgba(224, 238, 233, .62);
    font-size: 11px;
    line-height: 1.6;
}

.xl-guest-status.is-error {
    color: #ffc1ae;
}

.xl-guest-footer {
    position: absolute;
    right: 0;
    bottom: 28px;
    left: 0;
    color: rgba(226, 236, 232, .42);
    font-family: Arial, sans-serif;
    font-size: 10px;
    letter-spacing: .18em;
    text-align: center;
}

body.is-auth-pending .xl-guest-header,
body.is-auth-pending .xl-guest-hero,
body.is-auth-pending .xl-guest-footer {
    visibility: hidden;
    opacity: 0;
}

body.is-guest {
    overflow: hidden;
}

body.is-authenticated {
    overflow: auto;
}

.xl-preview-header {
    height: 46px;
    border-bottom: 1px solid #d8dcdd;
    background: #f3f4f4;
}

.xl-preview-shell {
    width: min(1180px, calc(100% - 28px));
    height: 100%;
    display: flex;
    align-items: center;
    margin: 0 auto;
}

.xl-preview-nav,
.xl-preview-account,
.xl-preview-gamebar,
.xl-game-selector,
.xl-draw-balls,
.xl-quick-buttons,
.xl-stake-row,
.xl-record-nav {
    display: flex;
    align-items: center;
}

.xl-preview-nav {
    gap: 30px;
}

.xl-preview-nav a,
.xl-preview-account a,
.xl-preview-account span {
    color: #6c7479;
    font-size: 13px;
}

.xl-preview-nav a.is-active,
.xl-preview-nav a:hover,
.xl-preview-account a:hover {
    color: var(--xl-bet-green-dark);
}

.xl-preview-logo {
    margin: 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-width: 112px;
    color: #1f6958;
    line-height: 1;
}

.xl-preview-logo .xl-brand-mark {
    width: 31px;
    height: 31px;
    flex: 0 0 auto;
    filter: drop-shadow(0 3px 5px rgba(21, 90, 75, .2));
}

.xl-brand-copy {
    display: grid;
    align-content: center;
    gap: 1px;
    min-width: 0;
}

.xl-brand-copy strong {
    color: #236e5c;
    font-family: "Xinglan Display", "Songti SC", STSong, serif;
    font-size: 23px;
    font-weight: 400;
    letter-spacing: .12em;
    line-height: .92;
    white-space: nowrap;
}

.xl-brand-copy small {
    color: #bd8c2e;
    font-family: Arial, sans-serif;
    font-size: 7px;
    font-weight: 700;
    letter-spacing: .28em;
    line-height: 1;
    white-space: nowrap;
}

.xl-preview-logo:hover .xl-brand-copy strong {
    color: #154f43;
}

.xl-preview-logo:focus-visible {
    outline: 2px solid rgba(35, 110, 92, .55);
    outline-offset: 4px;
    border-radius: 8px;
}

.xl-preview-account {
    gap: 12px;
}

.xl-preview-account strong {
    color: var(--xl-bet-green-dark);
}

.xl-preview-gamebar {
    width: min(1180px, calc(100% - 28px));
    height: 48px;
    gap: 12px;
    margin: 0 auto;
}

.xl-game-selector {
    position: relative;
}

.xl-game-selector > button,
.xl-current-game-chip {
    height: 28px;
    border: 0;
    color: #fff;
    background: var(--xl-bet-green);
    font: inherit;
    font-size: 12px;
    cursor: pointer;
}

.xl-game-selector > button {
    padding: 0 12px;
    color: var(--xl-bet-green-dark);
    background: transparent;
}

.xl-current-game-chip {
    min-width: 132px;
    padding: 0 18px;
    border-radius: 5px;
}

.xl-game-menu {
    position: absolute;
    top: 34px;
    left: 0;
    z-index: 50;
    width: 410px;
    display: none;
    grid-template-columns: repeat(2, 1fr);
    gap: 1px;
    padding: 8px;
    border: 1px solid var(--xl-bet-line);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 14px 34px rgba(42, 55, 60, .16);
}

.xl-game-selector.is-open .xl-game-menu {
    display: grid;
}

.xl-game-menu button {
    height: 34px;
    border: 0;
    color: #5e696f;
    background: #f3f4f4;
    font: inherit;
    font-size: 12px;
    text-align: left;
    cursor: pointer;
}

.xl-game-menu button:hover,
.xl-game-menu button.is-active {
    color: #fff;
    background: var(--xl-bet-green);
}

.xl-workbench {
    width: min(1180px, calc(100% - 28px));
    margin: 0 auto;
}

.xl-game-head {
    min-height: 94px;
    display: grid;
    grid-template-columns: 327px 430px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
}

.xl-game-brand,
.xl-countdown-card,
.xl-latest-card {
    min-width: 0;
}

.xl-game-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-left: 38px;
}

.xl-game-brand img {
    width: 70px;
    height: 70px;
    object-fit: contain;
}

.xl-game-brand h1 {
    margin: 0;
    color: #6d7477;
    font-size: 27px;
    font-weight: 400;
    letter-spacing: .08em;
}

.xl-game-brand p {
    margin: 4px 0 0;
    color: var(--xl-bet-green);
    font-size: 11px;
}

.xl-countdown-card {
    padding: 10px 20px 8px;
    border-radius: 10px;
    background: rgba(255,255,255,.62);
    text-align: center;
}

.xl-countdown-card p,
.xl-latest-card p {
    margin: 0 0 3px;
    color: #757d81;
    font-size: 12px;
}

.xl-countdown-card strong {
    color: var(--xl-bet-green);
    font-size: 39px;
    font-weight: 500;
    letter-spacing: .09em;
    font-variant-numeric: tabular-nums;
}

.xl-countdown-card em,
.xl-latest-card em {
    color: var(--xl-bet-green-dark);
    font-style: normal;
    font-weight: 700;
}

.xl-latest-card {
    text-align: center;
}

.xl-draw-balls {
    justify-content: center;
    gap: 9px;
    margin-top: 6px;
}

.xl-draw-ball {
    width: 43px;
    height: 43px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: #fff;
    background: var(--xl-bet-coral);
    box-shadow: inset 0 -6px 0 #be6a55;
    font-size: 20px;
    font-weight: 800;
}

.xl-draw-ball:nth-child(-n+2) {
    background: var(--xl-bet-green);
    box-shadow: inset 0 -6px 0 var(--xl-bet-green-dark);
}

.xl-bet-layout {
    display: grid;
    grid-template-columns: 32px minmax(0, 806px) minmax(0, 326px);
    gap: 8px;
    align-items: stretch;
}

.xl-preview-mode {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-top: 25px;
}

.xl-preview-mode button {
    min-height: 80px;
    padding: 8px 3px;
    border: 0;
    border-radius: 6px;
    color: #687379;
    background: #f9f9f9;
    font: inherit;
    font-size: 13px;
    line-height: 1.3;
    writing-mode: vertical-rl;
    cursor: pointer;
}

.xl-preview-mode button.is-active {
    color: var(--xl-bet-green-dark);
    border-left: 2px solid var(--xl-bet-green);
}

.xl-center-card,
.xl-history-card,
.xl-preview-records {
    border-radius: 10px;
    background: var(--xl-bet-panel);
}

.xl-center-card {
    min-width: 0;
    overflow: hidden;
}

.xl-family-tabs {
    height: 39px;
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    align-items: end;
    padding: 0 10px;
    border-bottom: 1px solid var(--xl-bet-line-dark);
}

.xl-family-tabs button {
    height: 39px;
    border: 0;
    color: #5d686f;
    background: transparent;
    font: inherit;
    font-size: 13px;
    cursor: pointer;
}

.xl-family-tabs button.is-active {
    color: var(--xl-bet-green-dark);
    border-bottom: 2px solid var(--xl-bet-green);
}

.xl-play-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 0;
    padding: 8px 12px 6px;
}

.xl-play-grid button {
    min-height: 31px;
    border: 0;
    border-radius: 16px;
    color: #777e82;
    background: transparent;
    font: inherit;
    font-size: 12px;
    cursor: pointer;
}

.xl-play-grid button.is-active,
.xl-play-grid button:hover {
    color: #fff;
    background: var(--xl-bet-green);
}

.xl-help-row {
    min-height: 34px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 0 14px;
    color: #69747a;
    border-top: 1px solid #e4e6e7;
    font-size: 12px;
}

.xl-help-row a {
    color: var(--xl-bet-green-dark);
}

.xl-number-board {
    padding: 4px 12px 8px;
}

.xl-number-row {
    min-height: 53px;
    display: grid;
    grid-template-columns: 70px 1fr 205px;
    align-items: center;
    gap: 8px;
}

.xl-number-row > span {
    color: #687278;
    font-size: 12px;
    text-align: center;
}

.xl-number-set {
    display: flex;
    align-items: center;
    gap: 7px;
}

.xl-number-set button {
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 50%;
    color: #3e474c;
    background: #dfe1e2;
    font: inherit;
    font-size: 17px;
    font-weight: 700;
    cursor: pointer;
}

.xl-number-set button:hover {
    color: #fff;
    background: #6db29b;
}

.xl-number-set button.is-selected {
    color: #fff;
    background: var(--xl-bet-coral);
}

.xl-position-row .xl-number-set button {
    width: 29px;
    height: 30px;
    border: 1px solid #c2c8cb;
    border-radius: 4px;
    color: #59666f;
    background: #fafafa;
    font-size: 12px;
    font-weight: 400;
}

.xl-position-row .xl-number-set button:hover,
.xl-position-row .xl-number-set button.is-selected {
    color: #fff;
    border-color: var(--xl-bet-green);
    background: var(--xl-bet-green);
}

.xl-quick-buttons {
    justify-content: flex-end;
    gap: 5px;
}

.xl-quick-buttons button {
    width: 29px;
    height: 30px;
    border: 1px solid #c2c8cb;
    border-radius: 4px;
    color: #59666f;
    background: #fafafa;
    font: inherit;
    font-size: 12px;
    cursor: pointer;
}

.xl-quick-buttons button:hover {
    color: var(--xl-bet-green-dark);
    border-color: var(--xl-bet-green);
}

.xl-stake-panel {
    padding: 9px 12px 8px;
    border-top: 1px solid var(--xl-bet-line);
}

.xl-stake-row {
    min-height: 37px;
    gap: 8px;
    color: #71797e;
    font-size: 12px;
}

.xl-stake-row label {
    width: 34px;
}

.xl-stake-row select,
.xl-stake-row input {
    height: 26px;
    border: 1px solid #b9c7d2;
    border-radius: 5px;
    color: #647078;
    background: #f4f4f4;
    font: inherit;
    font-size: 12px;
}

.xl-stake-row select {
    width: 140px;
    padding: 0 10px;
}

.xl-amount-modes,
.xl-multiple-modes,
.xl-model-modes {
    min-width: 0;
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    gap: 2px;
    height: 27px;
    padding: 2px;
    border: 1px solid #9eb4c9;
    border-radius: 6px;
}

.xl-amount-modes button,
.xl-multiple-modes button,
.xl-model-modes button {
    flex: 1 1 auto;
    min-width: 38px;
    height: 21px;
    border: 0;
    border-radius: 4px;
    color: #58636b;
    background: transparent;
    font: inherit;
    font-size: 11px;
    cursor: pointer;
}

.xl-bet-preview [aria-disabled="true"] {
    opacity: .55;
    cursor: not-allowed;
}

.xl-bet-preview .xl-position-row {
    display: none;
}

.xl-bet-preview button[aria-disabled="true"]:hover,
.xl-bet-preview a[aria-disabled="true"]:hover {
    filter: none;
    transform: none;
}

.xl-amount-modes button.is-active,
.xl-multiple-modes button.is-active,
.xl-model-modes button.is-active {
    color: #fff;
    background: var(--xl-bet-green);
}

.xl-stake-row input {
    width: 130px;
    padding: 0 12px;
}

.xl-bet-actions {
    display: grid;
    grid-template-columns: 1fr 120px 120px 120px;
    gap: 6px;
    align-items: center;
    padding-top: 5px;
    color: #747d82;
    font-size: 12px;
}

.xl-bet-actions strong {
    color: var(--xl-bet-coral);
}

.xl-bet-actions button,
.xl-order-summary button {
    height: 27px;
    border: 0;
    border-radius: 14px;
    color: #fff;
    background: var(--xl-bet-teal);
    font: inherit;
    font-size: 12px;
    cursor: pointer;
}

.xl-bet-actions button:nth-of-type(2),
.xl-order-summary button:nth-child(2) {
    background: var(--xl-bet-green);
}

.xl-bet-actions button:last-child {
    background: var(--xl-bet-gold);
}

.xl-order-area {
    display: grid;
    grid-template-columns: 1fr 176px;
    gap: 12px;
    padding: 9px 10px 14px;
}

.xl-order-table-wrap {
    height: 150px;
    overflow: auto;
    border: 1px solid var(--xl-bet-line-dark);
    border-radius: 9px;
    background: #fafafa;
}

.xl-order-table {
    width: 100%;
    border-collapse: collapse;
}

.xl-order-table th,
.xl-order-table td {
    height: 30px;
    padding: 0 8px;
    border-bottom: 1px solid #d6dadd;
    color: #727b80;
    font-size: 11px;
    font-weight: 400;
    text-align: center;
}

.xl-order-empty td {
    height: 112px;
    border: 0;
    color: #a0a4a7;
}

.xl-order-summary {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-content: center;
    gap: 10px;
    color: #777f83;
    font-size: 12px;
}

.xl-order-summary strong {
    color: var(--xl-bet-coral);
}

.xl-order-summary > span,
.xl-order-summary .xl-inline-status {
    grid-column: 1 / -1;
}

.xl-order-summary button[data-action="submit"] {
    grid-column: 1 / -1;
    min-height: 32px;
    height: auto;
    padding: 6px 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    line-height: 1.2;
    white-space: nowrap;
    background: var(--xl-bet-coral);
}

#xl-submit-countdown {
    display: inline-block;
    line-height: inherit;
    white-space: nowrap;
}

.xl-history-card {
    min-width: 0;
    height: 570px;
    padding: 10px 12px;
    overflow: hidden;
}

.xl-history-tabs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    border-bottom: 1px solid var(--xl-bet-line-dark);
}

.xl-history-tabs button {
    height: 38px;
    border: 0;
    color: #6e777c;
    background: transparent;
    font: inherit;
    font-size: 13px;
    cursor: pointer;
}

.xl-history-tabs button.is-active {
    color: var(--xl-bet-title);
    border-bottom: 2px solid var(--xl-bet-green);
}

.xl-history-list {
    height: 404px;
    overflow: auto;
}

.xl-history-item {
    padding: 8px 0;
    border-bottom: 1px solid #dfe1e2;
}

.xl-history-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    color: #8a9094;
    font-size: 11px;
}

.xl-history-meta strong {
    color: var(--xl-bet-green);
    font-weight: 700;
}

.xl-history-meta span:last-child {
    color: var(--xl-bet-coral);
}

.xl-history-numbers {
    display: flex;
    justify-content: space-between;
    gap: 5px;
    margin-top: 7px;
}

.xl-history-numbers span {
    width: 33px;
    height: 33px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: var(--xl-bet-coral);
    background: #e2e4e4;
    font-size: 15px;
}

.xl-history-numbers span:nth-child(-n+2) {
    color: var(--xl-bet-green);
}

.xl-history-footer {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    padding-top: 12px;
}

.xl-history-footer a {
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    color: #899095;
    background: rgba(255,255,255,.62);
    font-size: 13px;
}

.xl-preview-records {
    min-height: 350px;
    margin: 20px 0 36px;
    padding: 0 16px;
}

.xl-record-nav {
    min-height: 45px;
    border-bottom: 1px solid var(--xl-bet-line-dark);
}

.xl-record-nav button {
    min-width: 116px;
    height: 45px;
    border: 0;
    color: #69747a;
    background: transparent;
    font: inherit;
    font-size: 12px;
    cursor: pointer;
}

.xl-record-nav button.is-active {
    color: var(--xl-bet-green-dark);
    border-bottom: 2px solid var(--xl-bet-green);
}

.xl-record-nav a {
    margin-left: auto;
    color: var(--xl-bet-green-dark);
    font-size: 12px;
}

.xl-preview-records table {
    width: 100%;
    border-collapse: collapse;
}

.xl-preview-records th {
    height: 55px;
    color: #7a848a;
    border-bottom: 1px solid var(--xl-bet-line-dark);
    font-size: 12px;
    font-weight: 400;
}

.xl-preview-records td {
    height: 230px;
    color: #a1a6a9;
    text-align: center;
}

.xl-inline-status {
    min-height: 24px;
    padding-top: 4px;
    color: var(--xl-bet-green-dark);
    font-size: 11px;
    text-align: center;
}

.xl-bet-preview button:disabled,
.xl-bet-preview select:disabled {
    opacity: .55;
    cursor: not-allowed;
}

.xl-preview-records tbody tr:not(.xl-record-empty) td {
    height: 42px;
    padding: 7px 6px;
    border-bottom: 1px solid var(--xl-bet-line);
    color: #657178;
    font-size: 11px;
}

.xl-preview-records td.xl-record-positive {
    color: var(--xl-bet-green-dark);
}

.xl-preview-records td.xl-record-negative {
    color: var(--xl-bet-coral);
}

.xl-login-dialog {
    width: min(430px, calc(100vw - 32px));
    max-width: none;
    inset: 0;
    margin: auto;
    padding: 0;
    overflow: hidden;
    border: 1px solid rgba(231, 188, 89, .72);
    border-radius: 16px;
    color: #e9f3ef;
    background: #10352f;
    box-shadow: 0 24px 70px rgba(10, 39, 34, .42);
}

.xl-login-dialog:not([open]) {
    display: none;
}

.xl-login-dialog::backdrop {
    background: rgba(12, 28, 26, .64);
    backdrop-filter: blur(3px);
}

.xl-login-card {
    display: grid;
    gap: 9px;
    padding: 25px;
    background: linear-gradient(145deg, #17483e, #0d2e29);
}

.xl-login-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.xl-login-brand-area {
    min-width: 0;
}

.xl-login-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.xl-login-brand .xl-brand-mark {
    width: 36px;
    height: 36px;
    flex: 0 0 auto;
    filter: drop-shadow(0 5px 10px rgba(3, 22, 19, .36));
}

.xl-login-brand .xl-brand-copy strong {
    color: #fff;
    font-size: 27px;
    text-shadow: 0 2px 7px rgba(2, 25, 20, .32);
}

.xl-login-brand .xl-brand-copy small {
    color: #f0ca70;
    font-size: 7.5px;
}

.xl-login-heading h2 {
    margin: 10px 0 0;
    color: #c7d9d3;
    font-size: 15px;
    font-weight: 500;
    letter-spacing: .06em;
}

.xl-login-heading button {
    width: 30px;
    height: 30px;
    border: 1px solid rgba(255,255,255,.24);
    border-radius: 50%;
    color: #dce9e5;
    background: rgba(255,255,255,.07);
    font-size: 21px;
    line-height: 1;
    cursor: pointer;
}

.xl-login-card > p {
    margin: 0 0 4px;
    color: #b9cdc7;
    font-size: 12px;
    line-height: 1.6;
}

.xl-login-card code {
    color: #f0d387;
}

.xl-login-card label {
    color: #dceae6;
    font-size: 12px;
}

.xl-login-card input {
    width: 100%;
    height: 42px;
    padding: 0 13px;
    border: 1px solid rgba(255,255,255,.2);
    border-radius: 8px;
    outline: none;
    color: #fff;
    background: rgba(255,255,255,.08);
    font: inherit;
}

.xl-login-card input:focus {
    border-color: var(--xl-bet-gold);
    box-shadow: 0 0 0 3px rgba(231, 188, 89, .14);
}

.xl-login-status {
    min-height: 20px;
    color: #abc2bb;
    font-size: 11px;
    line-height: 1.5;
}

.xl-login-status.is-error {
    color: #ffb19d;
}

.xl-login-submit {
    height: 43px;
    border: 0;
    border-radius: 9px;
    color: #17352f;
    background: linear-gradient(90deg, #d9aa48, #f1d27c);
    font: inherit;
    font-weight: 700;
    cursor: pointer;
}

.xl-login-submit:disabled {
    opacity: .65;
}

@media (max-width: 900px) {
    body.xl-bet-preview {
        min-width: 320px !important;
    }

    .xl-guest-header {
        width: min(100% - 40px, 720px);
        height: 76px;
    }

    .xl-guest-hero {
        transform: translate(-50%, -44%);
    }

    .xl-guest-lockup img {
        width: 82px;
        height: 82px;
    }

    .xl-preview-header {
        height: auto;
    }

    .xl-preview-shell {
        min-height: 54px;
        flex-wrap: wrap;
        gap: 8px;
        padding: 8px 0;
    }

    .xl-preview-nav {
        gap: 12px;
        order: 3;
        width: 100%;
        overflow-x: auto;
    }

    .xl-preview-logo {
        margin-left: 0;
    }

    .xl-preview-account span,
    .xl-preview-account a:not(:last-child) {
        display: none;
    }

    .xl-preview-gamebar,
    .xl-workbench {
        width: min(100% - 20px, 760px);
    }

    .xl-game-head {
        grid-template-columns: 1fr;
        padding: 12px 0;
    }

    .xl-game-brand {
        justify-content: center;
    }

    .xl-bet-layout {
        grid-template-columns: 1fr;
    }

    .xl-preview-mode {
        flex-direction: row;
        gap: 6px;
        padding: 0;
        overflow-x: auto;
    }

    .xl-preview-mode button {
        min-width: 86px;
        min-height: 38px;
        writing-mode: horizontal-tb;
    }

    .xl-preview-mode button.is-active {
        border-left: 0;
        border-bottom: 2px solid var(--xl-bet-green);
    }

    .xl-history-card {
        height: auto;
    }

    .xl-history-list {
        height: 310px;
    }

    .xl-preview-records {
        margin-left: 0;
        overflow-x: auto;
    }
}

@media (max-width: 620px) {
    .xl-guest-backdrop {
        object-position: 54% center;
        transform: scale(1.08);
    }

    .xl-guest-header {
        width: calc(100% - 28px);
        height: 68px;
    }

    .xl-guest-header-brand {
        gap: 8px;
    }

    .xl-guest-header-brand img {
        width: 33px;
        height: 33px;
    }

    .xl-guest-header-brand strong {
        font-size: 21px;
    }

    .xl-guest-header-actions button {
        min-width: 72px;
        height: 34px;
    }

    .xl-guest-hero {
        width: calc(100% - 32px);
        transform: translate(-50%, -43%);
    }

    .xl-guest-lockup {
        gap: 8px;
        margin-bottom: 20px;
    }

    .xl-guest-lockup img {
        width: 72px;
        height: 72px;
    }

    .xl-guest-hero h1 {
        font-size: clamp(38px, 11vw, 44px);
        letter-spacing: .1em;
        text-indent: .1em;
    }

    .xl-guest-login-button {
        margin-top: 26px;
    }

    .xl-guest-footer {
        bottom: 20px;
    }

    .xl-game-menu {
        width: min(410px, calc(100vw - 20px));
    }

    .xl-game-brand img {
        width: 58px;
        height: 58px;
    }

    .xl-game-brand h1 {
        font-size: 22px;
    }

    .xl-countdown-card strong {
        font-size: 33px;
    }

    .xl-center-card {
        overflow-x: auto;
    }

    .xl-center-card > * {
        min-width: 760px;
    }

    .xl-preview-records table {
        min-width: 760px;
    }
}