/**
 * Soi Cầu Xổ Số All-in-One - Frontend Styles
 * Strict Compliance: High-Density Compact Table, System Radius 5px, No Shadow, No Border, Gradient Buttons, Fluid 14-16px, Arial Font
 *
 * @package SoiCau_XoSo_AllInOne
 */

:root {
    --scx-radius: 5px;
    --scx-primary: #1a56db;
    --scx-primary-dark: #1e429f;
    --scx-primary-gradient: linear-gradient(135deg, #1a56db 0%, #1e429f 100%);
    --scx-accent: #0e9f6e;
    --scx-accent-gradient: linear-gradient(135deg, #0e9f6e 0%, #057a55 100%);
    --scx-live: #e02424;
    --scx-live-gradient: linear-gradient(135deg, #e02424 0%, #9b1c1c 100%);
    --scx-speed-gradient: linear-gradient(135deg, #d97706 0%, #b45309 100%);
    --scx-btn-secondary: linear-gradient(135deg, #4b5563 0%, #374151 100%);
    
    --scx-bg: #ffffff;
    --scx-bg-card: #f9fafb;
    --scx-bg-alt: #f3f4f6;
    --scx-bg-hover: #e5e7eb;
    --scx-bg-highlight: #fef2f2;
    --scx-bg-table-head: #1e429f;
    --scx-bg-digit: #e1effe;
    
    --scx-text: #1f2a37;
    --scx-text-muted: #6b7280;
    --scx-text-light: #ffffff;
    --scx-text-gold: #b45309;

    --scx-table-max-height: none;
    font-size: 16px !important;
}

/* Component Container - Fit 100% & Minimal Spacing */
.scx-component {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
    font-family: Arial, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif !important;
    font-size: 16px !important;
    color: var(--scx-text);
    background-color: var(--scx-bg);
    border-radius: var(--scx-radius) !important;
    box-shadow: none !important;
    text-shadow: none !important;
    border: none !important;
    padding: 8px;
    margin-bottom: 16px;
    line-height: 1.4;
}

.scx-component * {
    box-sizing: border-box;
    box-shadow: none !important;
    text-shadow: none !important;
}

/* Minimal Clutter-Free Header */
.scx-block-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 6px 10px;
    background: var(--scx-bg-alt);
    margin-bottom: 8px;
    border-radius: var(--scx-radius) !important;
}

.scx-block-title {
    margin: 0;
    padding: 0;
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--scx-primary-dark);
    letter-spacing: -0.2px;
}

.scx-block-subtitle {
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--scx-text-muted);
}

.scx-badge-date {
    display: inline-block;
    padding: 2px 8px;
    background: var(--scx-bg-hover);
    color: var(--scx-text);
    font-size: 0.85rem;
    font-weight: 700;
    border-radius: var(--scx-radius) !important;
}

/* Buttons - Gradient & 5px Radius Only on Buttons */
.scx-btn,
.scx-tab-btn,
.scx-pill-btn,
.scx-boso-btn,
.scx-num-btn,
.scx-thongke-tab-btn,
.scx-btn-today,
.scx-btn-nav-cal {
    font-family: Arial, -apple-system, BlinkMacSystemFont, sans-serif;
    border: none !important;
    border-radius: var(--scx-radius) !important;
    box-shadow: none !important;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: filter 0.15s ease, transform 0.1s ease;
}

.scx-btn:hover,
.scx-tab-btn:hover,
.scx-pill-btn:hover,
.scx-boso-btn:hover,
.scx-num-btn:hover,
.scx-thongke-tab-btn:hover {
    filter: brightness(1.08);
}

.scx-btn:active,
.scx-tab-btn:active {
    transform: translateY(1px);
}

.scx-btn-primary {
    background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%) !important;
    color: #ffffff !important;
    font-weight: 800;
    padding: 8px 16px;
    font-size: 0.95rem;
}

.scx-btn-secondary {
    background: #4b5563 !important;
    color: #ffffff !important;
    font-weight: 700;
    padding: 8px 14px;
    font-size: 0.9rem;
}

.scx-btn-speed {
    background: linear-gradient(135deg, #f97316 0%, #ea580c 100%) !important;
    color: #ffffff !important;
    font-weight: 700;
    padding: 8px 14px;
    font-size: 0.9rem;
}

.scx-btn-copy {
    background: linear-gradient(135deg, #0e9f6e 0%, #057a55 100%) !important;
    color: #ffffff !important;
    font-weight: 800;
    padding: 6px 14px;
    font-size: 0.85rem;
}

.scx-btn-filter {
    background: #ffffff !important;
    color: #0029ad !important;
    border: 1px solid #dddfe2 !important;
    font-weight: 700;
    padding: 6px 12px;
    font-size: 0.85rem;
}

.scx-btn-filter:hover,
.scx-btn-filter.active {
    background: #dc2626 !important;
    color: #ffffff !important;
    border-color: #dc2626 !important;
}

.scx-icon {
    display: inline-block;
    vertical-align: middle;
    flex-shrink: 0;
}

/* ==========================================================================
   Thanh Tabs Điều Hướng (Miền Nam | Thứ 2..CN)
   ========================================================================== */
.scx-tabs-container {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 8px;
    width: 100% !important;
}

.scx-tab-short,
.scx-txt-short {
    display: none !important;
}

.scx-tab-full,
.scx-txt-full {
    display: inline !important;
}

.scx-show-mobile {
    display: none !important;
}

.scx-hide-mobile,
th.scx-hide-mobile,
td.scx-hide-mobile {
    display: table-cell;
}

.ul-tabs-link.scx-weekday-nav {
    display: flex !important;
    flex: 1 1 auto !important;
    align-items: stretch !important;
    gap: 0 !important;
    background: #ffffff !important;
    border: 1px solid #d1d5db !important;
    border-radius: var(--scx-radius) !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
}

.ul-tabs-link .scx-tab-btn {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    height: 38px !important;
    padding: 0 4px !important;
    font-size: 0.88rem !important;
    font-weight: 600 !important;
    text-align: center !important;
    border: none !important;
    border-right: 1px solid #d1d5db !important;
    background: #ffffff !important;
    color: #003399 !important;
    cursor: pointer !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    white-space: nowrap !important;
    text-decoration: none !important;
    transition: background 0.15s ease, color 0.15s ease !important;
}

.ul-tabs-link .scx-tab-btn:last-child {
    border-right: none !important;
}

.ul-tabs-link .scx-tab-btn:hover {
    background: #f8fafc !important;
    color: #e02424 !important;
}

/* Region Tab (Cột Miền Đầu Tiên): Luôn Nền Đỏ Chữ Trắng Chuẩn UI */
.ul-tabs-link .scx-tab-region {
    font-weight: 700 !important;
    flex: 1.25 1 0 !important;
    background: #e02424 !important;
    color: #ffffff !important;
    border-right: 1px solid #d1d5db !important;
}

.ul-tabs-link .scx-tab-region:hover {
    background: #c81e1e !important;
    color: #ffffff !important;
}

/* Tab Thứ Đang Chọn (Active): Nền Đỏ Chữ Trắng Như Trong Ảnh Mẫu */
.ul-tabs-link .scx-tab-btn.scx-tab-btn-active,
.ul-tabs-link .scx-tab-btn.active {
    background: #e02424 !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    border-right: 1px solid #d1d5db !important;
}

.ul-tabs-link .scx-tab-btn.scx-tab-btn-active:hover,
.ul-tabs-link .scx-tab-btn.active:hover {
    background: #c81e1e !important;
    color: #ffffff !important;
}

.scx-date-picker-wrap {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
}

.scx-date-input {
    border: 1px solid #d1d5db !important;
    background: #ffffff !important;
    color: #0f172a !important;
    padding: 0 10px !important;
    font-size: 0.85rem !important;
    font-family: inherit !important;
    font-weight: 600 !important;
    border-radius: var(--scx-radius) !important;
    box-shadow: none !important;
    height: 38px !important;
    line-height: 38px !important;
    outline: none !important;
    cursor: pointer !important;
    box-sizing: border-box !important;
}

.scx-table-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
    overflow-x: hidden !important;
    background: var(--scx-bg);
    margin-bottom: 8px;
    border-radius: var(--scx-radius) !important;
    box-shadow: none !important;
    border: none !important;
    box-sizing: border-box !important;
}

/* ==========================================================================
   Header Bảng Vàng Nhạt Đặc Trưng (Đồng Bộ Mọi Shortcode)
   ========================================================================== */
.section-header.scx-kqxs-header-panel,
.scx-block-header {
    background-color: #ffeca0 !important;
    border: 1px solid #dddfe2 !important;
    border-radius: var(--scx-radius) !important;
    padding: 8px 12px !important;
    text-align: center !important;
    box-shadow: none !important;
    margin: 0 0 8px 0 !important;
}

.scx-table-wrapper > .section-header.scx-kqxs-header-panel {
    border-bottom: none !important;
    border-radius: var(--scx-radius) var(--scx-radius) 0 0 !important;
    margin-bottom: 0 !important;
}

.scx-kqxs-panel-title,
.scx-block-title {
    margin: 0 0 4px 0 !important;
    padding: 0 !important;
    font-size: 1.22rem !important;
    font-weight: 800 !important;
    color: #000000 !important;
    line-height: 1.35 !important;
    letter-spacing: -0.2px !important;
    text-align: center !important;
}

.site-link.scx-kqxs-panel-meta,
.scx-block-subtitle {
    font-size: 0.88rem !important;
    font-weight: 600 !important;
    color: #0029ad !important;
    line-height: 1.35 !important;
    text-align: center !important;
    margin: 0 !important;
}

.scx-meta-link,
.site-link a,
.scx-block-subtitle a {
    color: #0029ad !important;
    text-decoration: underline !important;
    cursor: pointer !important;
}

/* ==========================================================================
   Bảng Kết Quả Xổ Số Chuẩn Cao Cấp
   ========================================================================== */
.table-result,
.scx-table,
.scx-table-classic {
    width: 100% !important;
    border-collapse: collapse !important;
    border-spacing: 0 !important;
    border: 1px solid #dddfe2 !important;
    border-radius: 0 !important;
    font-size: 0.95rem !important;
    line-height: 1.4 !important;
    text-align: center !important;
    background-color: #ffffff !important;
}

.table-result th,
.table-result td,
.scx-table th,
.scx-table td,
.scx-table-classic th,
.scx-table-classic td {
    border: 1px solid #dddfe2 !important;
    padding: 5px 6px !important;
    vertical-align: middle !important;
    box-sizing: border-box !important;
    border-radius: 0 !important;
}

.table-result thead th,
.scx-table thead th,
.scx-table-classic thead th {
    background: #ffffff !important;
    color: #000000 !important;
    font-weight: 700 !important;
    font-size: 1rem !important;
    padding: 7px 4px !important;
}

.table-result thead th h3 {
    margin: 0 !important;
    padding: 0 !important;
    font-size: 1.15rem !important;
    font-weight: 800 !important;
}

.table-result thead th a,
.scx-table thead th a {
    color: #0029ad !important;
    text-decoration: underline !important;
    font-weight: 800 !important;
}

/* Cột tên giải G, 8, 7, 6, 5, 4, 3, 2, 1, ĐB */
.table-result th.name-prize,
.table-result tbody th,
.scx-table-classic th.name-prize,
.scx-table th.name-prize,
.scx-table-classic .scx-cell-prize,
.scx-table .scx-cell-prize {
    width: 44px !important;
    min-width: 44px !important;
    max-width: 44px !important;
    font-weight: 700 !important;
    font-size: 1.05rem !important;
    color: #000000 !important;
    text-align: center !important;
    background: #ffffff !important;
    padding: 5px 4px !important;
}

.table-result tbody td,
.scx-table tbody td,
.scx-table-classic tbody td {
    background: #ffffff !important;
}

/* Chữ số Giải 8: ĐỎ TO ĐẬM */
.table-result .color_red,
.scx-table .color_red,
.scx-number-red {
    color: #ed1c25 !important;
    font-size: 1.75rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.5px !important;
    line-height: 1.25 !important;
}

.xs_prize1 {
    display: inline-block;
    font-size: 1.4rem;
    font-weight: 800;
    color: #000000;
    line-height: 1.35;
    letter-spacing: 0.5px;
    font-variant-numeric: tabular-nums;
}

/* Các giải nhiều số xếp theo CỘT DỌC (mỗi số 1 dòng) */
.scx-num-col {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 3px !important;
    width: 100% !important;
}

.scx-num-col .xs_prize1 {
    display: block !important;
    font-size: 1.35rem !important;
    font-weight: 800 !important;
    color: #000000 !important;
    line-height: 1.4 !important;
    padding: 1px 0 !important;
}

/* Chữ số Giải Đặc Biệt: ĐỎ TO NHẤT */
.table-result .prize_db,
.table-result .special-prize,
.scx-number-db {
    color: #ed1c25 !important;
    font-size: 1.95rem !important;
    font-weight: 800 !important;
    letter-spacing: 1px !important;
    line-height: 1.25 !important;
}

/* Miền Bắc Grid numbers */
.prize1, .scx-number-g1 { font-size: 1.45rem !important; font-weight: 800 !important; color: #000000 !important; }
.prize2, .prize3, .prize4, .prize5, .prize6, .scx-num-item, .scx-number-dark { font-size: 1.35rem !important; font-weight: 700 !important; color: #000000 !important; }
.prize7 { font-size: 1.45rem !important; font-weight: 800 !important; color: #ed1c25 !important; }

/* Dòng Ký hiệu vé trúng Đặc biệt (Draw Code) - Giảm kích thước tinh gọn */
.scx-row-drawcode td,
.scx-row-drawcode th {
    padding: 2px 4px !important;
    height: auto !important;
    min-height: 0 !important;
    line-height: 1.15 !important;
    background: #fafafa !important;
}

.scx-drawcode-grid {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: space-around !important;
    gap: 2px 8px !important;
    padding: 0 !important;
}

.code-DB6, .scx-drawcode-item {
    color: #dc2626 !important;
    font-weight: 700 !important;
    font-size: 0.85rem !important;
    letter-spacing: 0.3px !important;
    line-height: 1.2 !important;
    display: inline-block !important;
}

.scx-num-grid {
    display: grid !important;
    width: 100% !important;
    align-items: center !important;
    justify-items: center !important;
    text-align: center !important;
}

.scx-num-grid-2 { grid-template-columns: repeat(2, 1fr) !important; gap: 4px 10px !important; }
.scx-num-grid-3 { grid-template-columns: repeat(3, 1fr) !important; gap: 5px 8px !important; }
.scx-num-grid-4 { grid-template-columns: repeat(4, 1fr) !important; gap: 4px 6px !important; }

/* ==========================================================================
   Thanh Filter Bar Lô Tô (div-table)
   ========================================================================== */
.div-table.scx-config-bar {
    display: flex !important;
    width: 100% !important;
    border: 1px solid #dddfe2 !important;
    border-top: none !important;
    border-radius: 0 0 var(--scx-radius) var(--scx-radius) !important;
    background: #f2f2f2 !important;
    margin-bottom: 12px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}

.div-table .config-item {
    padding: 7px 12px !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    text-align: center !important;
    border-right: 1px solid #dddfe2 !important;
    background: #f2f2f2 !important;
    color: #222222 !important;
    transition: all 0.15s ease !important;
    user-select: none !important;
    white-space: nowrap !important;
    border-radius: 0 !important;
}

.div-table .config-item:hover {
    background: #c80505 !important;
    color: #ffffff !important;
}

.div-table .config-item.active {
    background: #c80505 !important;
    color: #ffffff !important;
    font-weight: 700 !important;
}

.div-table .number-config {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    padding: 7px 0 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    text-align: center !important;
    border-right: 1px solid #dddfe2 !important;
    background: #f2f2f2 !important;
    color: #222222 !important;
    transition: all 0.15s ease !important;
    user-select: none !important;
    border-radius: 0 !important;
}

.div-table .number-config:last-child {
    border-right: none !important;
}

.div-table .number-config:hover,
.div-table .number-config.active {
    background: #F88825 !important;
    color: #ffffff !important;
}

/* Badge Highlight số theo lọc đuôi (xs-bong) */
.xs-bong {
    font-weight: 800 !important;
    background: #F88825 !important;
    color: #ffffff !important;
    border-radius: 4px !important;
    padding: 1px 4px !important;
    display: inline-block !important;
}

/* ==========================================================================
   Bảng Loto Đầu - Đuôi (table-loto)
   ========================================================================== */
.site-link2.scx-loto-subtitle {
    font-size: 1rem !important;
    font-weight: 700 !important;
    color: #000000 !important;
    margin: 12px 0 6px 0 !important;
    padding: 4px 2px !important;
}

.site-link2.scx-loto-subtitle a {
    color: #0029ad !important;
    text-decoration: underline !important;
}

.table-loto,
.scx-table-loto {
    width: 100% !important;
    border-collapse: collapse !important;
    border: 1px solid #dddfe2 !important;
    border-radius: var(--scx-radius) !important;
    overflow: hidden !important;
    text-align: center !important;
    background: #ffffff !important;
}

.table-loto th,
.table-loto td {
    border: 1px solid #dddfe2 !important;
    padding: 4px 6px !important;
    box-sizing: border-box !important;
    border-radius: 0 !important;
}

.table-loto thead th {
    background: #f0f8ff !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #000000 !important;
    padding: 6px 4px !important;
}

.table-loto .loto-name,
.table-loto th.scx-digit-badge {
    width: 44px !important;
    min-width: 44px !important;
    max-width: 44px !important;
    color: #ed1c25 !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    text-align: center !important;
    background: inherit !important;
}

.table-loto .loto-col a {
    color: #0029ad !important;
    text-decoration: underline !important;
    font-weight: 700 !important;
    font-size: 14px !important;
}

.table-loto tr:nth-of-type(2n) {
    background-color: #f0f8ff !important;
}

.table-loto .red,
.table-loto .color_red {
    color: #ed1c25 !important;
    font-weight: 800 !important;
}

.table-loto .scx-cell-dauduoi-data {
    text-align: left !important;
    padding-left: 10px !important;
    font-size: 0.95rem !important;
    font-weight: 600 !important;
    color: #111827 !important;
    letter-spacing: 0.5px !important;
}

.scx-muted {
    color: var(--scx-text-muted);
}

/* Multi-Station MT / MN */
.scx-multi-station-wrap th.scx-col-station {
    background: #f1f5f9 !important;
    color: #1e429f !important;
    font-weight: 800 !important;
    font-size: 0.95rem !important;
}

/* ----------------- Quay Thử Synchronized Styles ----------------- */
.scx-quaythu-region-switch {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    margin-bottom: 8px !important;
    flex-wrap: wrap !important;
}

.scx-quaythu-reg-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 6px 14px !important;
    font-size: 0.85rem !important;
    font-weight: 700 !important;
    color: #334155 !important;
    background: #f1f5f9 !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: var(--scx-radius) !important;
    text-decoration: none !important;
    cursor: pointer !important;
    transition: all 0.15s ease !important;
}

.scx-quaythu-reg-btn:hover {
    background: #e2e8f0 !important;
    color: #0f172a !important;
}

.scx-quaythu-reg-btn.active {
    background: linear-gradient(135deg, #e02424 0%, #b91c1c 100%) !important;
    color: #ffffff !important;
    border-color: #dc2626 !important;
}

/* Thanh Công Cụ Tiện Ích Gọn Nhẹ (Compact Toolbar) */
.scx-quaythu-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    background: #f8fafc;
    border: 1px solid #e2e8f0 !important;
    border-radius: var(--scx-radius) !important;
    padding: 6px 10px;
    margin-bottom: 8px;
    box-shadow: none !important;
}

.scx-toolbar-left {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1 1 auto;
    min-width: 0;
}

.scx-station-picker {
    display: flex;
    align-items: center;
    gap: 6px;
}

.scx-station-label {
    font-size: 0.84rem;
    font-weight: 600;
    color: #475569;
    white-space: nowrap;
}

.scx-select-wrap {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.scx-quaythu-toolbar .scx-select {
    appearance: none;
    -webkit-appearance: none;
    background: #ffffff;
    border: 1px solid #cbd5e1 !important;
    border-radius: var(--scx-radius) !important;
    padding: 5px 28px 5px 10px;
    font-size: 0.84rem;
    font-weight: 600;
    font-family: inherit;
    color: #0f172a;
    cursor: pointer;
    line-height: 1.3;
    box-shadow: none !important;
}

.scx-select-arrow {
    position: absolute;
    right: 8px;
    pointer-events: none;
    color: #64748b;
}

.scx-station-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: var(--scx-radius) !important;
    padding: 5px 10px;
    font-size: 0.84rem;
    font-weight: 700;
    color: #1e293b;
}

.scx-station-icon {
    color: #0284c7;
    flex-shrink: 0;
}

.scx-toolbar-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 0 0 auto;
}

.scx-btn-start-quay {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: linear-gradient(135deg, #e02424 0%, #b91c1c 100%) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: var(--scx-radius) !important;
    padding: 6px 14px;
    font-size: 0.85rem;
    font-weight: 800;
    letter-spacing: 0.3px;
    cursor: pointer;
    box-shadow: none !important;
    transition: opacity 0.15s ease;
}

.scx-btn-start-quay:hover:not(:disabled) {
    opacity: 0.92;
    color: #ffffff !important;
}

.scx-btn-start-quay:disabled {
    opacity: 0.65;
    cursor: not-allowed;
}

.scx-btn-speed-toggle {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #ffffff !important;
    color: #334155 !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: var(--scx-radius) !important;
    padding: 6px 12px;
    font-size: 0.84rem;
    font-weight: 700;
    cursor: pointer;
    box-shadow: none !important;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.scx-btn-speed-toggle:hover {
    background: #f1f5f9 !important;
    color: #0f172a !important;
}

.scx-btn-speed-toggle[data-speed="fast"] {
    background: #eff6ff !important;
    color: #1d4ed8 !important;
    border-color: #93c5fd !important;
}

.scx-quaythu-board {
    display: grid !important;
    grid-template-columns: minmax(0, 1.62fr) minmax(320px, 1.08fr) !important;
    gap: 8px !important;
    align-items: stretch !important;
    width: 100% !important;
    margin-bottom: 8px !important;
}

@media (max-width: 768px) {
    .scx-quaythu-board {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }
}

/* Riêng bảng quay thử Miền Trung & Miền Nam: Bảng kết quả rộng FULL 100%, Thống kê đầu đuôi phía dưới */
.scx-quaythu-board.scx-quaythu-board-stacked,
.scx-quaythu-container[data-region="mt"] .scx-quaythu-board,
.scx-quaythu-container[data-region="mn"] .scx-quaythu-board {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    width: 100% !important;
    max-width: 100% !important;
    gap: 12px !important;
}

.scx-quaythu-board.scx-quaythu-board-stacked .scx-prize-table-wrap,
.scx-quaythu-container[data-region="mt"] .scx-quaythu-board .scx-prize-table-wrap,
.scx-quaythu-container[data-region="mn"] .scx-quaythu-board .scx-prize-table-wrap {
    width: 100% !important;
    max-width: 100% !important;
    flex: 1 1 100% !important;
    height: auto !important;
    min-height: auto !important;
}

.scx-quaythu-board.scx-quaythu-board-stacked .scx-dauduoi-table-wrap,
.scx-quaythu-container[data-region="mt"] .scx-quaythu-board .scx-dauduoi-table-wrap,
.scx-quaythu-container[data-region="mn"] .scx-quaythu-board .scx-dauduoi-table-wrap {
    width: 100% !important;
    max-width: 100% !important;
    flex: 1 1 100% !important;
    height: auto !important;
    min-height: auto !important;
}

.scx-quaythu-board.scx-quaythu-board-stacked .scx-table-prizes,
.scx-quaythu-container[data-region="mt"] .scx-quaythu-board .scx-table-prizes,
.scx-quaythu-container[data-region="mn"] .scx-quaythu-board .scx-table-prizes {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
}

.scx-quaythu-board.scx-quaythu-board-stacked .scx-num-col,
.scx-quaythu-container[data-region="mt"] .scx-quaythu-board .scx-num-col,
.scx-quaythu-container[data-region="mn"] .scx-quaythu-board .scx-num-col {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 3px !important;
    width: 100% !important;
    margin: 2px 0 !important;
}

.scx-quaythu-board.scx-quaythu-board-stacked .scx-table-dauduoi tbody tr,
.scx-quaythu-container[data-region="mt"] .scx-quaythu-board .scx-table-dauduoi tbody tr,
.scx-quaythu-container[data-region="mn"] .scx-quaythu-board .scx-table-dauduoi tbody tr {
    height: auto !important;
    min-height: 30px !important;
}

.scx-quaythu-board.scx-quaythu-board-stacked .scx-table-dauduoi .scx-cell-dauduoi-data,
.scx-quaythu-container[data-region="mt"] .scx-quaythu-board .scx-table-dauduoi .scx-cell-dauduoi-data,
.scx-quaythu-container[data-region="mn"] .scx-quaythu-board .scx-table-dauduoi .scx-cell-dauduoi-data {
    white-space: normal !important;
    word-break: break-word !important;
    height: auto !important;
    min-height: 30px !important;
    line-height: 1.4 !important;
    padding: 4px 8px !important;
}

/* ==========================================================================
   Thanh Trạng Thái Lồng Cầu Vi Khối (Micro Status Bar)
   ========================================================================== */
.scx-quaythu-status-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 5px 10px;
    margin-bottom: 8px;
    background: #f8fafc;
    border: 1px solid #e2e8f0 !important;
    border-radius: var(--scx-radius) !important;
    box-shadow: none !important;
    min-height: 28px;
    transition: background 0.25s ease, border-color 0.25s ease;
}

.scx-status-indicator {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
}

/* Viên bóng cầu số đẹp 3D */
.scx-lottery-ball {
    width: 22px;
    height: 22px;
    border-radius: 50% !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background: conic-gradient(from 0deg, #ef4444 0%, #f59e0b 14%, #10b981 28%, #06b6d4 42%, #3b82f6 57%, #8b5cf6 71%, #ec4899 85%, #ef4444 100%);
    box-shadow: inset -2px -2px 4px rgba(0, 0, 0, 0.4), inset 2px 2px 4px rgba(255, 255, 255, 0.8) !important;
    transition: transform 0.25s ease, filter 0.25s ease;
    animation: scxBallIdle 2.5s ease-in-out infinite alternate;
}

.scx-ball-core {
    width: 11px;
    height: 11px;
    background: #ffffff;
    border-radius: 50% !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.25) !important;
}

.scx-ball-num {
    font-size: 7.5px;
    font-weight: 900;
    color: #dc2626;
    font-family: Arial, sans-serif;
    line-height: 1;
    text-align: center;
    display: block;
    user-select: none;
}

/* Khi ĐANG QUAY: Hiệu ứng quay tít & nhiều màu biến đổi liên tục */
.scx-status-live .scx-lottery-ball {
    animation: scxBallSpin 0.75s linear infinite, scxBallColorShift 1.8s linear infinite !important;
}

/* Khi quay Giải ĐẶC BIỆT: Tăng tốc cực nhanh & đổi màu rực lửa */
.scx-status-db .scx-lottery-ball {
    animation: scxBallSpin 0.35s linear infinite, scxBallColorShift 0.8s linear infinite, scxBallPulse 0.4s ease-in-out infinite alternate !important;
}

/* Khi HOÀN THÀNH: Dừng quay, bóng chuyển sang sắc xanh ngọc may mắn */
.scx-status-complete .scx-lottery-ball {
    animation: none !important;
    background: radial-gradient(circle at 35% 30%, #34d399, #059669) !important;
    box-shadow: inset -1px -1px 3px rgba(0,0,0,0.35), inset 2px 2px 3px rgba(255,255,255,0.8) !important;
}

.scx-status-complete .scx-ball-num {
    color: #059669 !important;
    font-size: 8px !important;
}

@keyframes scxBallIdle {
    0% { transform: scale(0.96); }
    100% { transform: scale(1.04); }
}

@keyframes scxBallSpin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

@keyframes scxBallColorShift {
    0% { filter: hue-rotate(0deg) saturate(1.3); }
    50% { filter: hue-rotate(180deg) saturate(1.6); }
    100% { filter: hue-rotate(360deg) saturate(1.3); }
}

@keyframes scxBallPulse {
    0% { transform: scale(0.95); }
    100% { transform: scale(1.2); }
}

.scx-status-dot {
    display: none !important;
}

.scx-status-content {
    flex: 1;
    min-width: 0;
}

.scx-status-text {
    font-size: 0.82rem;
    font-weight: 600;
    line-height: 1.35;
    color: #334155;
}

.scx-status-live {
    background: #eff6ff !important;
    border-color: #bfdbfe !important;
}

.scx-status-live .scx-status-text {
    color: #1e40af !important;
    font-weight: 700;
}

.scx-status-db {
    background: #fef2f2 !important;
    border-color: #fecaca !important;
}

.scx-status-db .scx-status-text {
    color: #b91c1c !important;
    font-weight: 800;
}

.scx-status-complete {
    background: #f0fdf4 !important;
    border-color: #bbf7d0 !important;
}

.scx-status-complete .scx-status-text {
    color: #15803d !important;
    font-weight: 700;
}

/* ==========================================================================
   Bảng Kết Quả Quay Thử - Đồng Bộ Hoàn Hảo Thiết Kế KQXS
   ========================================================================== */
.scx-quaythu-board .scx-loto-subtitle {
    display: none !important;
}

.scx-quaythu-board .scx-table-wrapper,
.scx-quaythu-board .scx-prize-table-wrap,
.scx-quaythu-board .scx-dauduoi-table-wrap {
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    height: 100% !important;
    min-height: 100% !important;
    background: #ffffff !important;
    border: 1px solid #dddfe2 !important;
    border-radius: var(--scx-radius) !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
}

.scx-quaythu-board thead th {
    height: 36px !important;
    min-height: 36px !important;
    max-height: 36px !important;
    background: #ffffff !important;
    border: none !important;
    border-bottom: 1px solid #dddfe2 !important;
    border-right: 1px solid #dddfe2 !important;
    padding: 0 4px !important;
    line-height: 36px !important;
    font-size: 0.92rem !important;
    font-weight: 700 !important;
    color: #111827 !important;
    text-align: center !important;
    vertical-align: middle !important;
    box-sizing: border-box !important;
}

.scx-quaythu-board thead th:last-child {
    border-right: none !important;
}

.scx-quaythu-board thead th h3 {
    margin: 0 !important;
    padding: 0 !important;
    font-size: 0.95rem !important;
    font-weight: 800 !important;
    line-height: 36px !important;
}

.scx-quaythu-board thead th a {
    color: #0029ad !important;
    text-decoration: underline !important;
}

.scx-quaythu-board .scx-table-prizes {
    display: table !important;
    table-layout: fixed !important;
    width: 100% !important;
    flex: 1 1 auto !important;
    height: 100% !important;
    border: none !important;
    margin: 0 !important;
}

.scx-quaythu-board .scx-table-prizes tbody tr {
    height: 35px !important;
}

.scx-quaythu-board .scx-table-prizes tbody tr.scx-row-db {
    height: 45px !important;
}

.scx-quaythu-board .scx-table-prizes tbody tr.scx-row-g1 {
    height: 38px !important;
}

.scx-quaythu-board .scx-table-prizes tbody td {
    padding: 2px 4px !important;
    vertical-align: middle !important;
    border: none !important;
    border-bottom: 1px solid #dddfe2 !important;
    box-sizing: border-box !important;
}

.scx-quaythu-board .scx-col-prize,
.scx-quaythu-board .scx-cell-prize {
    width: 46px !important;
    min-width: 46px !important;
    max-width: 46px !important;
    white-space: nowrap !important;
    border: none !important;
    border-bottom: 1px solid #dddfe2 !important;
    border-right: 1px solid #dddfe2 !important;
    text-align: center !important;
    font-weight: 700 !important;
}

.scx-quaythu-board .scx-table-prizes tbody tr:last-child td,
.scx-quaythu-board .scx-table-prizes tbody tr:last-child th {
    border-bottom: none !important;
}

.scx-slot {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 28px !important;
    min-height: 28px !important;
    max-height: 28px !important;
    line-height: 28px !important;
    box-sizing: border-box !important;
    vertical-align: middle !important;
    margin: 1px auto !important;
    padding: 0 4px !important;
    border-radius: var(--scx-radius) !important;
    font-variant-numeric: tabular-nums !important;
    font-feature-settings: "tnum" !important;
    text-align: center !important;
    flex-shrink: 0 !important;
    border: none !important;
    box-shadow: none !important;
    background: #f8fafc;
    transition: background 0.15s ease, color 0.15s ease;
}

/* Cố định chiều rộng chính xác theo từng loại giải để không bao giờ xê dịch ngang */
.scx-slot[data-len="2"] { width: 44px !important; min-width: 44px !important; max-width: 44px !important; }
.scx-slot[data-len="3"] { width: 56px !important; min-width: 56px !important; max-width: 56px !important; }
.scx-slot[data-len="4"] { width: 72px !important; min-width: 72px !important; max-width: 72px !important; }
.scx-slot[data-len="5"] { width: 88px !important; min-width: 88px !important; max-width: 88px !important; }
.scx-slot[data-len="6"] { width: 104px !important; min-width: 104px !important; max-width: 104px !important; }

/* Slot Giải Đặc Biệt */
.scx-cell-db .scx-slot,
.scx-slot.scx-slot-db {
    height: 38px !important;
    min-height: 38px !important;
    max-height: 38px !important;
    line-height: 38px !important;
    width: 120px !important;
    min-width: 120px !important;
    max-width: 120px !important;
}

/* Slot Giải Nhất */
.scx-cell-g1 .scx-slot {
    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    line-height: 32px !important;
    width: 100px !important;
    min-width: 100px !important;
    max-width: 100px !important;
}

/* Placeholder Chấm Digital Đều Nhau (Thay thế toàn bộ 27 loading.gif cũ) */
.scx-slot-placeholder {
    display: inline-block !important;
    font-size: 1.05rem !important;
    font-weight: 700 !important;
    letter-spacing: 2px !important;
    color: #94a3b8 !important;
    line-height: inherit !important;
    user-select: none !important;
}

.scx-cell-db .scx-slot-placeholder,
.scx-slot-db .scx-slot-placeholder {
    color: #f87171 !important;
    font-size: 1.35rem !important;
    font-weight: 800 !important;
    letter-spacing: 2.5px !important;
}

/* Trạng thái đang quay lồng cầu: Random bi số xoay tít, nền gradient đỏ */
.scx-slot-active-spin {
    background: linear-gradient(135deg, #e02424 0%, #b91c1c 100%) !important;
    color: #ffffff !important;
    border-radius: var(--scx-radius) !important;
}

.scx-slot-spin-num {
    font-weight: 800 !important;
    font-size: 1.05rem !important;
    letter-spacing: 0.5px !important;
    color: #ffffff !important;
    line-height: inherit !important;
    display: inline-block !important;
}

.scx-cell-db .scx-slot-spin-num {
    font-size: 1.45rem !important;
    letter-spacing: 1.5px !important;
}

.scx-cell-g1 .scx-slot-spin-num {
    font-size: 1.25rem !important;
}

/* Trạng thái dừng số chính thức: Chuẩn phân cấp thị giác KQXS */
.scx-slot-revealed {
    background: transparent !important;
}

.scx-slot-revealed .scx-num-val {
    display: inline-block !important;
    line-height: inherit !important;
    font-variant-numeric: tabular-nums !important;
}

.scx-slot-revealed .scx-number-dark {
    color: #0f172a !important;
    font-weight: 700 !important;
    font-size: 1.05rem !important;
}

.scx-cell-g1 .scx-slot-revealed .scx-number-dark {
    font-size: 1.15rem !important;
    font-weight: 800 !important;
}

.scx-slot-revealed .color_red {
    color: #dc2626 !important;
    font-weight: 800 !important;
    font-size: 1.15rem !important;
}

.scx-slot-revealed .scx-number-db {
    color: #dc2626 !important;
    font-weight: 800 !important;
    font-size: 1.45rem !important;
    letter-spacing: 1.5px !important;
}

/* ==========================================================================
   Bảng Đầu - Đuôi Lô Tô Khung Quay Thử (Khớp Tuyệt Đối Với Bảng Giải)
   ========================================================================== */
.scx-quaythu-board .scx-table-dauduoi {
    display: table !important;
    table-layout: fixed !important;
    width: 100% !important;
    flex: 1 1 auto !important;
    height: 100% !important;
    border: none !important;
    margin: 0 !important;
}

.scx-quaythu-board .scx-table-dauduoi tbody tr {
    height: 30px !important;
}

.scx-quaythu-board .scx-table-dauduoi tbody tr:nth-of-type(2n) {
    background-color: #f0f8ff !important;
}

.scx-quaythu-board .scx-table-dauduoi tbody tr:last-child td,
.scx-quaythu-board .scx-table-dauduoi tbody tr:last-child th {
    border-bottom: none !important;
}

.scx-quaythu-board .scx-table-dauduoi .scx-col-digit,
.scx-quaythu-board .scx-table-dauduoi .scx-digit-badge {
    width: 38px !important;
    min-width: 38px !important;
    max-width: 38px !important;
    text-align: center !important;
    font-weight: 700 !important;
    color: #ed1c25 !important;
    background: inherit !important;
    border: none !important;
    border-bottom: 1px solid #dddfe2 !important;
    border-right: 1px solid #dddfe2 !important;
    padding: 0 !important;
    height: 30px !important;
    line-height: 30px !important;
    box-sizing: border-box !important;
}

.scx-quaythu-board .scx-table-dauduoi .scx-col-tails,
.scx-quaythu-board .scx-table-dauduoi .scx-cell-dauduoi-data {
    width: calc(50% - 38px) !important;
    text-align: left !important;
    padding: 2px 8px !important;
    font-size: 0.92rem !important;
    font-weight: 600 !important;
    color: #111827 !important;
    border: none !important;
    border-bottom: 1px solid #dddfe2 !important;
    border-right: 1px solid #dddfe2 !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    height: 30px !important;
    line-height: 26px !important;
}

.scx-quaythu-board .scx-table-dauduoi td:last-child,
.scx-quaythu-board .scx-table-dauduoi th:last-child {
    border-right: none !important;
}

/* Thanh chân bảng (Bottom Bar) đồng bộ 100% giữa 2 cột: cao 36px, viền trên 1px */
.scx-quaythu-board .div-table.scx-config-bar,
.scx-quaythu-board .div-table.scx-dauduoi-bottom-bar {
    display: flex !important;
    align-items: stretch !important;
    width: 100% !important;
    height: 36px !important;
    min-height: 36px !important;
    max-height: 36px !important;
    background: #f2f2f2 !important;
    border: none !important;
    border-top: 1px solid #dddfe2 !important;
    border-radius: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    flex-shrink: 0 !important;
}

.scx-quaythu-board .div-table.scx-dauduoi-bottom-bar {
    align-items: center !important;
    justify-content: center !important;
    background: #f8fafc !important;
}

.scx-quaythu-board .scx-dauduoi-bar-title {
    font-size: 0.82rem !important;
    font-weight: 700 !important;
    color: #475569 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.4px !important;
    text-align: center !important;
}

/* Flash cập nhật dữ liệu vào bảng Đầu/Đuôi Lô Tô real-time */
.scx-cell-flash {
    background-color: rgba(254, 240, 138, 0.9) !important;
    color: #854d0e !important;
    transition: background-color 0.4s ease;
}

/* ----------------- Tạo Dàn Đề All In One ----------------- */
.scx-quick-sets-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 5px;
    padding: 6px 8px;
    background: #f2f2f2 !important;
    border: 1px solid #dddfe2 !important;
    margin-bottom: 8px;
    border-radius: var(--scx-radius) !important;
}

.scx-quick-label {
    font-size: 0.85rem;
    font-weight: 700;
    color: #000000 !important;
}

.scx-pill-btn {
    padding: 4px 8px;
    font-size: 0.82rem;
    font-weight: 600;
    background: #ffffff !important;
    color: #222222 !important;
    border: 1px solid #dddfe2 !important;
    border-radius: var(--scx-radius) !important;
    cursor: pointer;
    transition: all 0.15s ease;
}

.scx-pill-btn:hover {
    background: #c80505 !important;
    color: #ffffff !important;
}

.scx-pill-btn.scx-selected,
.scx-pill-btn.active {
    background: #c80505 !important;
    color: #ffffff !important;
    border-color: #c80505 !important;
    font-weight: 700 !important;
}

.scx-filter-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 8px;
    margin-bottom: 8px;
}

.scx-filter-box {
    background: #ffffff !important;
    border: 1px solid #dddfe2 !important;
    padding: 8px;
    border-radius: var(--scx-radius) !important;
}

.scx-box-full {
    width: 100%;
    margin-bottom: 8px;
}

.scx-filter-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: -8px -8px 8px -8px;
    background: #f0f8ff !important;
    border-bottom: 1px solid #dddfe2 !important;
    padding: 5px 8px;
    border-radius: var(--scx-radius) var(--scx-radius) 0 0 !important;
}

.scx-filter-title {
    font-size: 0.85rem;
    font-weight: 800;
    color: #000000 !important;
}

.scx-btn-text-sm {
    border: none;
    background: none;
    font-size: 0.78rem;
    color: #0029ad !important;
    cursor: pointer;
    font-weight: 600;
    padding: 0;
    text-decoration: underline;
    border-radius: 0 !important;
}

.scx-btn-text-sm:hover {
    color: #dc2626 !important;
}

.scx-digit-buttons {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 4px;
}

.scx-num-btn {
    padding: 6px 0;
    font-size: 0.95rem;
    font-weight: 700;
    background: #ffffff !important;
    color: #000000 !important;
    border: 1px solid #dddfe2 !important;
    text-align: center;
    border-radius: var(--scx-radius) !important;
    cursor: pointer;
    transition: all 0.15s ease;
}

.scx-num-btn:hover {
    background: #f0f8ff !important;
    color: #0029ad !important;
}

.scx-num-btn.scx-selected {
    background: #dc2626 !important;
    color: #ffffff !important;
    border-color: #dc2626 !important;
}

.scx-boso-buttons {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(90px, 1fr));
    gap: 4px;
}

.scx-boso-btn {
    padding: 5px 4px;
    font-size: 0.82rem;
    font-weight: 600;
    background: #ffffff !important;
    color: #0029ad !important;
    border: 1px solid #dddfe2 !important;
    border-radius: var(--scx-radius) !important;
    cursor: pointer;
    transition: all 0.15s ease;
}

.scx-boso-btn:hover {
    background: #f0f8ff !important;
}

.scx-boso-btn.scx-selected {
    background: #dc2626 !important;
    color: #ffffff !important;
    border-color: #dc2626 !important;
    font-weight: 700 !important;
}

.scx-help-text {
    font-size: 0.8rem;
    color: var(--scx-text-muted);
    margin: 2px 0 6px;
}

.scx-actions-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    padding: 8px;
    background: #f2f2f2 !important;
    border: 1px solid #dddfe2 !important;
    margin-bottom: 8px;
    border-radius: var(--scx-radius) !important;
}

.scx-separator-type {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-left: auto;
}

.scx-label-inline {
    font-size: 0.85rem;
    font-weight: 600;
    color: #000000;
}

.scx-select-sm {
    padding: 4px 6px;
    font-size: 0.85rem;
    font-family: inherit;
    background: #ffffff !important;
    border: 1px solid #dddfe2 !important;
    border-radius: var(--scx-radius) !important;
}

.scx-result-box {
    background: #ffffff !important;
    border: 1px solid #dddfe2 !important;
    padding: 8px;
    margin-bottom: 8px;
    border-radius: var(--scx-radius) !important;
}

.scx-result-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 6px;
}

.scx-result-title {
    font-size: 0.9rem;
    font-weight: 800;
    color: #000000 !important;
}

.scx-badge-count {
    display: inline-block;
    padding: 2px 8px;
    background: #dc2626 !important;
    color: #ffffff !important;
    font-size: 0.85rem;
    font-weight: 800;
    margin-left: 6px;
    border-radius: var(--scx-radius) !important;
}

.scx-textarea {
    width: 100% !important;
    padding: 6px 8px;
    font-size: 0.95rem;
    font-family: Arial, monospace;
    font-weight: 600;
    line-height: 1.5;
    background: #ffffff !important;
    color: #111827 !important;
    border: 1px solid #dddfe2 !important;
    border-radius: var(--scx-radius) !important;
    resize: vertical;
}

/* Compare 2 sets */
.scx-compare-box {
    border-radius: var(--scx-radius) !important;
}

.scx-compare-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin-top: 6px;
}

@media (max-width: 600px) {
    .scx-compare-grid {
        grid-template-columns: 1fr;
    }
}

.scx-compare-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 8px;
}

/* ----------------- Thống Kê Xổ Số Chuyên Sâu VIP ----------------- */
.scx-thongke-tabs {
    display: flex !important;
    align-items: center !important;
    gap: 3px !important;
    width: 100% !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: var(--scx-radius) !important;
    overflow: hidden !important;
    background: #f1f5f9 !important;
    padding: 3px !important;
    margin-bottom: 8px !important;
}

.scx-thongke-tab-btn {
    flex: 1 1 0 !important;
    padding: 7px 8px !important;
    font-size: 0.85rem !important;
    font-weight: 600 !important;
    background: #ffffff !important;
    color: #334155 !important;
    border: none !important;
    border-radius: var(--scx-radius) !important;
    box-shadow: none !important;
    text-align: center !important;
    cursor: pointer !important;
    white-space: nowrap !important;
    transition: all 0.15s ease !important;
}

.scx-thongke-tab-btn:hover {
    background: #e2e8f0 !important;
    color: var(--scx-primary) !important;
}

.scx-thongke-tab-btn.scx-tab-btn-active,
.scx-thongke-tab-btn.active {
    background: var(--scx-primary-gradient) !important;
    color: #ffffff !important;
    font-weight: 700 !important;
}

.scx-tab-panel {
    display: none;
}

.scx-tab-panel.scx-panel-active {
    display: block;
}

.scx-digit-highlight {
    font-size: 1.05rem;
    font-weight: 800;
    color: var(--scx-primary-dark);
}

.scx-val-bold {
    font-weight: 700;
}

.scx-badge-danger {
    padding: 2px 6px;
    background: var(--scx-live);
    color: var(--scx-text-light);
    font-size: 0.78rem;
    font-weight: 700;
    border-radius: var(--scx-radius) !important;
}

.scx-badge-success {
    padding: 2px 6px;
    background: var(--scx-accent);
    color: var(--scx-text-light);
    font-size: 0.78rem;
    font-weight: 700;
    border-radius: var(--scx-radius) !important;
}

.scx-badge-normal {
    padding: 2px 6px;
    background: var(--scx-bg-alt);
    color: var(--scx-text-muted);
    font-size: 0.78rem;
    border-radius: var(--scx-radius) !important;
}

.scx-gan-danger {
    color: var(--scx-live);
    font-weight: 800;
}

.scx-rank-badge {
    display: inline-block;
    width: 22px;
    height: 22px;
    line-height: 22px;
    text-align: center;
    background: var(--scx-bg-alt);
    color: var(--scx-text);
    font-weight: 800;
    font-size: 0.8rem;
    border-radius: var(--scx-radius) !important;
}

.scx-grid-headtail {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

@media (max-width: 600px) {
    .scx-grid-headtail {
        grid-template-columns: 1fr;
    }
}

.scx-table-compact th,
.scx-table-compact td {
    padding: 5px 6px !important;
    font-size: 0.88rem !important;
    line-height: 1.35 !important;
}

.scx-table-striped tbody tr:nth-child(even) {
    background-color: #f8fafc !important;
}

.scx-table-striped tbody tr:nth-child(odd) {
    background-color: #ffffff !important;
}

.scx-table-striped tbody tr:hover {
    background-color: #f1f5f9 !important;
}

.scx-bridge-title {
    display: inline-block;
    color: var(--scx-text);
}

.scx-bridge-subpos {
    font-size: 0.76rem;
    color: #64748b;
    margin-top: 2px;
    line-height: 1.25;
    font-weight: 500;
}

/* ----------------- Gợi Ý 3 Miền VIP ----------------- */
.scx-goiy-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 8px;
}

.scx-goiy-card {
    background: #ffffff !important;
    border: 1px solid #dddfe2 !important;
    padding: 0;
    border-radius: var(--scx-radius) !important;
    overflow: hidden;
}

.scx-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 12px !important;
    border-radius: 0 !important;
}

.scx-header-mb { background: #dc2626 !important; color: #ffffff !important; }
.scx-header-mt { background: #1a56db !important; color: #ffffff !important; }
.scx-header-mn { background: #ea580c !important; color: #ffffff !important; }

.scx-card-title {
    margin: 0;
    font-size: 1.02rem !important;
    font-weight: 800 !important;
    color: #ffffff !important;
}

.scx-badge-station {
    font-size: 0.82rem !important;
    font-weight: 600 !important;
    color: #ffffff !important;
    opacity: 0.95;
}

.scx-card-body {
    padding: 6px 10px !important;
    background: #ffffff !important;
}

.scx-suggest-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 6px 4px !important;
    border-bottom: 1px solid #dddfe2 !important;
    font-size: 0.9rem !important;
    border-radius: 0 !important;
}

.scx-suggest-block {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}

.scx-suggest-label {
    font-weight: 600;
    color: var(--scx-text-muted);
}

.scx-big-num {
    font-size: 1.45rem !important;
    color: #ed1c25 !important;
    font-weight: 800 !important;
}

.scx-digit-bold {
    font-weight: 800 !important;
    color: #000000 !important;
    font-size: 1.15rem !important;
}

.scx-text-gold {
    color: #b45309 !important;
    font-weight: 800 !important;
    font-size: 1.1rem !important;
}

.scx-dande-pills {
    width: 100%;
    background: #f0f8ff !important;
    border: 1px solid #dddfe2 !important;
    padding: 6px 8px !important;
    font-size: 0.9rem !important;
    font-weight: 700 !important;
    color: #0029ad !important;
    word-break: break-word;
    border-radius: var(--scx-radius) !important;
}

/* ----------------- Lịch Âm AJAX Tra Cứu ----------------- */
.scx-licham-layout {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 8px;
}

@media (max-width: 768px) {
    .scx-licham-layout {
        grid-template-columns: 1fr;
    }
}

.scx-licham-calendar-wrap {
    background: #ffffff !important;
    border: 1px solid #dddfe2 !important;
    padding: 0 !important;
    border-radius: var(--scx-radius) !important;
    overflow: hidden !important;
}

.scx-calendar-nav-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 10px !important;
    background: #ffeca0 !important;
    border-bottom: 1px solid #dddfe2 !important;
    border-radius: 0 !important;
    margin-bottom: 0 !important;
}

.scx-cal-month-title {
    margin: 0;
    font-size: 1.1rem !important;
    font-weight: 800 !important;
    color: #000000 !important;
}

.scx-btn-nav-cal {
    border: 1px solid #dddfe2 !important;
    background: #ffffff !important;
    color: #000000 !important;
    padding: 4px 8px;
    cursor: pointer;
    border-radius: var(--scx-radius) !important;
}

.scx-btn-today {
    background: #dc2626 !important;
    color: #ffffff !important;
    padding: 4px 10px;
    font-size: 0.82rem;
    font-weight: 700 !important;
    border: none !important;
    border-radius: var(--scx-radius) !important;
}

.scx-cal-grid-header {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    text-align: center;
    font-weight: 700;
    font-size: 0.85rem;
    padding: 6px 0;
    background: #f0f8ff !important;
    color: #000000 !important;
    border-bottom: 1px solid #dddfe2 !important;
    border-radius: 0 !important;
}

.scx-sun-col {
    color: #ed1c25 !important;
}

.scx-cal-grid-body {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 1px;
    background: #dddfe2 !important;
    border-radius: 0 !important;
    overflow: hidden;
}

/* Individual calendar cells */
.scx-cal-cell {
    background: #ffffff !important;
    padding: 5px 2px;
    text-align: center;
    cursor: pointer;
    min-height: 48px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    transition: background 0.15s ease;
    border-radius: 0 !important;
}

.scx-cal-cell:hover {
    background: #f0f8ff !important;
}

.scx-cal-cell.scx-other-month {
    opacity: 0.35;
}

.scx-cal-cell.scx-cell-today {
    background: #e1effe !important;
}

.scx-cal-cell.scx-cell-selected {
    background: #dc2626 !important;
}

.scx-cal-cell.scx-cell-selected .scx-solar-num,
.scx-cal-cell.scx-cell-selected .scx-lunar-num {
    color: #ffffff !important;
}

.scx-solar-num {
    font-size: 0.95rem;
    font-weight: 700;
    color: #000000;
    line-height: 1.1;
}

.scx-lunar-num {
    font-size: 0.72rem;
    color: var(--scx-text-muted);
    font-weight: 500;
    line-height: 1.1;
}

.scx-hd-dot {
    width: 4px;
    height: 4px;
    border-radius: 50% !important;
    background: var(--scx-accent);
    margin-top: 2px;
}

/* Lịch Âm Details Panel */
.scx-licham-details-panel {
    background: #ffffff !important;
    border: 1px solid #dddfe2 !important;
    padding: 10px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    border-radius: var(--scx-radius) !important;
}

.scx-details-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    background: #ffeca0 !important;
    border-bottom: 1px solid #dddfe2 !important;
    padding: 8px 10px !important;
    margin: -10px -10px 4px -10px !important;
    border-radius: var(--scx-radius) var(--scx-radius) 0 0 !important;
}

.scx-solar-date-title {
    font-size: 0.95rem;
    font-weight: 800;
    color: #000000 !important;
}

.scx-badge-hd {
    padding: 2px 8px;
    font-size: 0.78rem;
    font-weight: 700;
    border-radius: var(--scx-radius) !important;
}

.scx-hd-good {
    background: var(--scx-accent);
    color: #ffffff;
}

.scx-hd-normal {
    background: #dddfe2;
    color: #4b5563;
}

.scx-lunar-big-highlight {
    background: #f0f8ff !important;
    border: 1px solid #dddfe2 !important;
    padding: 6px 10px;
    font-size: 0.92rem;
    border-radius: var(--scx-radius) !important;
}

.scx-lunar-label {
    font-size: 0.8rem;
    font-weight: 700;
    color: #0029ad !important;
    margin-right: 4px;
}

.scx-lunar-val {
    color: #ed1c25 !important;
    font-weight: 800;
}

.scx-det-info-list {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.scx-info-row {
    display: flex;
    justify-content: space-between;
    padding: 4px 0;
    border-bottom: 1px dashed #dddfe2;
    font-size: 0.85rem;
    border-radius: 0 !important;
}

.scx-info-label {
    color: var(--scx-text-muted);
    font-weight: 500;
}

.scx-info-val {
    font-weight: 700;
    text-align: right;
    color: #111827;
}

.scx-val-small {
    font-size: 0.8rem;
    max-width: 60%;
}

.scx-lucky-box {
    background: #ffffff !important;
    border: 1px solid #dddfe2 !important;
    padding: 8px;
    margin-top: 4px;
    border-radius: var(--scx-radius) !important;
}

.scx-lucky-title {
    margin: 0 0 6px 0;
    font-size: 0.85rem;
    font-weight: 800;
    color: #000000 !important;
    text-align: center;
}

.scx-lucky-numbers-row {
    display: flex;
    align-items: center;
    justify-content: space-around;
    gap: 6px;
}

.scx-lucky-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
}

.scx-lucky-label {
    font-size: 0.75rem;
    color: var(--scx-text-muted);
}

.scx-lucky-ball {
    display: inline-block;
    padding: 2px 8px;
    background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%) !important;
    color: #ffffff !important;
    font-weight: 800;
    font-size: 1.1rem;
    border-radius: var(--scx-radius) !important;
}

.scx-lucky-text {
    font-weight: 800;
    color: #ed1c25 !important;
    font-size: 0.95rem;
}

/* ==========================================================================
   Credit: Dữ liệu bởi MaNguon.Net (Nhỏ mờ, tinh tế)
   ========================================================================== */
.scx-table-credit {
    margin-top: 6px;
    margin-bottom: 2px;
    font-size: 0.72rem;
    line-height: 1.4;
    color: var(--scx-text-muted);
    opacity: 0.75;
    text-align: right;
    font-weight: 400;
    letter-spacing: 0.2px;
    border: none !important;
    box-shadow: none !important;
}

.scx-table-credit a {
    color: inherit;
    text-decoration: none;
    font-weight: 600;
    transition: opacity 0.2s ease, color 0.2s ease;
}

.scx-table-credit a:hover {
    color: var(--scx-primary);
    opacity: 1;
    text-decoration: underline;
}

@media (max-width: 480px) {
    .scx-table-credit {
        font-size: 0.68rem;
        text-align: right;
        padding: 0 2px;
    }
}

/* ==========================================================================
   Tối Ưu Toàn Diện Trên Mọi Thiết Bị (Zero Horizontal Scroll, Zero Shift)
   ========================================================================== */

/* 1. Header Tinh Gọn Trên Mobile */
@media (max-width: 640px) {
    .section-header.scx-kqxs-header-panel,
    .scx-block-header {
        padding: 6px 8px !important;
        margin: 0 0 6px 0 !important;
    }
    .scx-kqxs-panel-title,
    .scx-block-title {
        font-size: 1.05rem !important;
        line-height: 1.25 !important;
        margin-bottom: 2px !important;
    }
    .site-link.scx-kqxs-panel-meta,
    .scx-block-subtitle {
        font-size: 0.8rem !important;
        line-height: 1.2 !important;
    }
}

/* 2. Thanh Filter Bar Lô Tô (2 hàng đều đẹp, không tràn, không cắt chữ) */
@media (max-width: 640px) {
    .scx-row-drawcode td,
    .scx-row-drawcode th {
        padding: 2px 2px !important;
    }
    .scx-drawcode-grid {
        gap: 2px 4px !important;
    }
    .code-DB6, .scx-drawcode-item {
        font-size: 0.76rem !important;
        letter-spacing: 0.2px !important;
    }
    .div-table.scx-config-bar {
        flex-wrap: wrap !important;
        margin-bottom: 8px !important;
    }
    .div-table .config-item {
        flex: 1 1 33.33% !important;
        padding: 7px 4px !important;
        font-size: 13px !important;
        border-bottom: 1px solid #dddfe2 !important;
    }
    .div-table .number-config {
        flex: 1 1 10% !important;
        min-width: 0 !important;
        padding: 6px 0 !important;
        font-size: 13px !important;
    }
}

@media (max-width: 380px) {
    .div-table .config-item {
        font-size: 12px !important;
        padding: 6px 2px !important;
    }
    .div-table .number-config {
        font-size: 12px !important;
        padding: 5px 0 !important;
    }
}

/* 3. Bảng Multi-Station MT / MN (Fit 100% không tràn màn hình) */
@media (max-width: 768px) {
    .scx-multi-station-wrap table.table-xsmn,
    .scx-multi-station-wrap table.table-xsmt {
        table-layout: fixed !important;
        width: 100% !important;
    }
    .scx-multi-station-wrap th.name-prize,
    .scx-multi-station-wrap td.name-prize {
        width: 26px !important;
        min-width: 26px !important;
        max-width: 26px !important;
        padding: 3px 1px !important;
        font-size: 0.82rem !important;
    }
    .scx-multi-station-wrap th.prize-col {
        padding: 4px 1px !important;
    }
    .scx-multi-station-wrap th.prize-col h3 {
        font-size: 0.8rem !important;
        line-height: 1.2 !important;
        margin: 0 !important;
    }
    .scx-multi-station-wrap td {
        padding: 3px 1px !important;
    }
    .scx-multi-station-wrap .xs_prize1,
    .scx-multi-station-wrap .scx-num-col .xs_prize1 {
        font-size: 0.95rem !important;
        letter-spacing: -0.3px !important;
        font-variant-numeric: tabular-nums !important;
        white-space: nowrap !important;
    }
    .scx-multi-station-wrap .color_red {
        font-size: 1.1rem !important;
        white-space: nowrap !important;
    }
    .scx-multi-station-wrap .prize_db,
    .scx-multi-station-wrap .special-prize,
    .scx-multi-station-wrap .scx-number-db {
        font-size: 1.22rem !important;
        letter-spacing: -0.4px !important;
        white-space: nowrap !important;
    }
}

@media (max-width: 480px) {
    /* Bảng 3 đài */
    .table-city3 th.name-prize,
    .table-city3 td.name-prize {
        width: 26px !important;
        min-width: 26px !important;
        max-width: 26px !important;
        font-size: 0.8rem !important;
    }
    .table-city3 .xs_prize1,
    .table-city3 .scx-num-col .xs_prize1 {
        font-size: 0.92rem !important;
        letter-spacing: -0.3px !important;
        white-space: nowrap !important;
    }
    .table-city3 .prize_db,
    .table-city3 .special-prize,
    .table-city3 .scx-number-db {
        font-size: 1.15rem !important;
        letter-spacing: -0.4px !important;
        white-space: nowrap !important;
    }

    /* Bảng 4 đài */
    .table-city4 th.name-prize,
    .table-city4 td.name-prize {
        width: 24px !important;
        min-width: 24px !important;
        max-width: 24px !important;
        font-size: 0.78rem !important;
        padding: 2px 0 !important;
    }
    .table-city4 th.prize-col h3 {
        font-size: 0.74rem !important;
    }
    .table-city4 .xs_prize1,
    .table-city4 .scx-num-col .xs_prize1 {
        font-size: 0.86rem !important;
        letter-spacing: -0.5px !important;
        white-space: nowrap !important;
    }
    .table-city4 .color_red {
        font-size: 1rem !important;
        white-space: nowrap !important;
    }
    .table-city4 .prize_db,
    .table-city4 .special-prize,
    .table-city4 .scx-number-db {
        font-size: 1.08rem !important;
        letter-spacing: -0.5px !important;
        white-space: nowrap !important;
    }
    /* Quay thử ô số 4 đài */
    .table-city4 .scx-slot[data-len="2"] { width: 32px !important; min-width: 32px !important; max-width: 32px !important; font-size: 0.88rem !important; }
    .table-city4 .scx-slot[data-len="3"] { width: 40px !important; min-width: 40px !important; max-width: 40px !important; font-size: 0.86rem !important; }
    .table-city4 .scx-slot[data-len="4"] { width: 48px !important; min-width: 48px !important; max-width: 48px !important; font-size: 0.84rem !important; }
    .table-city4 .scx-slot[data-len="5"] { width: 56px !important; min-width: 56px !important; max-width: 56px !important; font-size: 0.84rem !important; }
    .table-city4 .scx-slot[data-len="6"] { width: 66px !important; min-width: 66px !important; max-width: 66px !important; font-size: 0.95rem !important; letter-spacing: -0.5px !important; }
}

/* 4. Bảng Miền Bắc Single-Station */
@media (max-width: 600px) {
    .table-xsmb th.name-prize {
        width: 36px !important;
        min-width: 36px !important;
        max-width: 36px !important;
        padding: 3px 2px !important;
        font-size: 0.85rem !important;
    }
    .table-xsmb .scx-num-grid-3 .xs_prize1 {
        font-size: 1.15rem !important;
    }
    .table-xsmb .scx-num-grid-4 .xs_prize1 {
        font-size: 1.15rem !important;
    }
    .table-xsmb .prize_db,
    .table-xsmb .special-prize,
    .table-xsmb .scx-number-db {
        font-size: 1.6rem !important;
    }
    .table-xsmb .scx-slot[data-len="5"] {
        width: 76px !important;
        min-width: 76px !important;
        max-width: 76px !important;
        font-size: 1.15rem !important;
    }
    .table-xsmb .scx-slot-db {
        width: 96px !important;
        min-width: 96px !important;
        max-width: 96px !important;
        font-size: 1.45rem !important;
    }
}

@media (max-width: 380px) {
    .table-xsmb th.name-prize {
        width: 30px !important;
        min-width: 30px !important;
        max-width: 30px !important;
        font-size: 0.8rem !important;
        padding: 2px 1px !important;
    }
    .table-xsmb .scx-num-grid-3 .xs_prize1 {
        font-size: 1.02rem !important;
    }
    .table-xsmb .scx-num-grid-4 .xs_prize1 {
        font-size: 1.02rem !important;
    }
    .table-xsmb .prize_db,
    .table-xsmb .special-prize,
    .table-xsmb .scx-number-db {
        font-size: 1.4rem !important;
        letter-spacing: 0 !important;
    }
}

/* 5. Bảng Loto Đầu - Đuôi */
@media (max-width: 600px) {
    .table-loto .loto-name,
    .table-loto th.scx-digit-badge {
        width: 30px !important;
        min-width: 30px !important;
        max-width: 30px !important;
        font-size: 13.5px !important;
        padding: 3px 0 !important;
    }
    .table-loto .scx-cell-dauduoi-data {
        padding-left: 6px !important;
        font-size: 0.84rem !important;
        letter-spacing: 0 !important;
    }
}


/* ==========================================================================
   8. Tối Ưu scx-tabs-container Trên Thiết Bị Di Động (Mobile)
   ========================================================================== */
@media (max-width: 768px) {
    .scx-tabs-container {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 6px !important;
        width: 100% !important;
        margin-bottom: 8px !important;
    }

    .scx-tab-full,
    .scx-txt-full {
        display: none !important;
    }

    .scx-tab-short,
    .scx-txt-short {
        display: inline !important;
        font-weight: 700 !important;
    }

    .scx-show-mobile {
        display: block !important;
    }

    .scx-hide-mobile,
    th.scx-hide-mobile,
    td.scx-hide-mobile {
        display: none !important;
    }

    .ul-tabs-link.scx-weekday-nav {
        display: grid !important;
        grid-template-columns: repeat(8, 1fr) !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden !important;
        overflow-x: hidden !important;
        scrollbar-width: none !important;
        gap: 0 !important;
        padding: 0 !important;
        background: #ffffff !important;
        border: 1px solid #d1d5db !important;
        border-radius: var(--scx-radius) !important;
        box-shadow: none !important;
        box-sizing: border-box !important;
    }

    .ul-tabs-link.scx-weekday-nav::-webkit-scrollbar {
        display: none !important;
        width: 0 !important;
        height: 0 !important;
    }

    .ul-tabs-link.scx-weekday-nav .scx-tab-btn {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: 36px !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
        font-size: 0.82rem !important;
        font-weight: 600 !important;
        border: none !important;
        border-right: 1px solid #d1d5db !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        background: #ffffff !important;
        color: #003399 !important;
        line-height: 1 !important;
        box-sizing: border-box !important;
        white-space: nowrap !important;
    }

    .ul-tabs-link.scx-weekday-nav .scx-tab-btn:last-child {
        border-right: none !important;
    }

    .ul-tabs-link.scx-weekday-nav .scx-tab-region {
        font-weight: 700 !important;
        padding: 0 !important;
        background: #e02424 !important;
        color: #ffffff !important;
    }

    .ul-tabs-link.scx-weekday-nav .scx-tab-btn.scx-tab-btn-active,
    .ul-tabs-link.scx-weekday-nav .scx-tab-btn.active {
        background: #e02424 !important;
        color: #ffffff !important;
        font-weight: 700 !important;
    }

    .scx-thongke-tabs {
        display: grid !important;
        grid-template-columns: repeat(5, 1fr) !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
        overflow-x: hidden !important;
        scrollbar-width: none !important;
        gap: 2px !important;
        padding: 2px !important;
        background: #f1f5f9 !important;
        border-radius: var(--scx-radius) !important;
        border: none !important;
        box-shadow: none !important;
        margin-bottom: 8px !important;
    }

    .scx-thongke-tabs::-webkit-scrollbar {
        display: none !important;
        width: 0 !important;
        height: 0 !important;
    }

    .scx-thongke-tab-btn {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 34px !important;
        padding: 4px 1px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
        font-size: clamp(10px, 2.7vw, 12px) !important;
        font-weight: 700 !important;
        border-radius: var(--scx-radius) !important;
        border: none !important;
        box-shadow: none !important;
        box-sizing: border-box !important;
        white-space: normal !important;
        word-break: break-word !important;
        line-height: 1.15 !important;
        color: #334155 !important;
        background: #ffffff !important;
    }

    .scx-thongke-tab-btn.scx-tab-btn-active,
    .scx-thongke-tab-btn.active {
        background: var(--scx-primary-gradient) !important;
        color: #ffffff !important;
        font-weight: 700 !important;
    }

    /* Bảng dữ liệu thống kê gọn gàng Bongdalu trên mobile */
    .scx-table-compact {
        table-layout: auto !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    .scx-table-compact th,
    .scx-table-compact td {
        padding: 4px 3px !important;
        font-size: clamp(11px, 2.8vw, 13px) !important;
        line-height: 1.25 !important;
        white-space: normal !important;
        box-sizing: border-box !important;
    }

    .scx-table-compact thead th {
        padding: 5px 2px !important;
        font-size: clamp(10.5px, 2.7vw, 12px) !important;
        font-weight: 700 !important;
    }

    .scx-digit-highlight {
        font-size: 0.95rem !important;
        font-weight: 800 !important;
    }

    .scx-badge-danger,
    .scx-badge-success,
    .scx-badge-normal {
        padding: 2px 4px !important;
        font-size: 0.72rem !important;
        white-space: nowrap !important;
    }

    .scx-bridge-subpos {
        font-size: 0.72rem !important;
        color: #64748b !important;
        margin-top: 2px !important;
        line-height: 1.2 !important;
    }

    .scx-date-picker-wrap {
        width: 100% !important;
        display: flex !important;
        margin: 0 !important;
    }

    .scx-date-input {
        width: 100% !important;
        height: 36px !important;
        border: none !important;
        background: #f1f5f9 !important;
        color: var(--scx-text) !important;
        font-size: 0.88rem !important;
        font-weight: 600 !important;
        text-align: center !important;
        border-radius: var(--scx-radius) !important;
        outline: none !important;
        box-shadow: none !important;
    }

    /* 9. Quay Thử Xổ Số Mobile Zero-Scroll & Chống Vỡ Khung */
    .scx-quaythu-board {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
        max-width: 100% !important;
        gap: 8px !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
    }

    .scx-quaythu-board .scx-table-wrapper,
    .scx-quaythu-board .scx-prize-table-wrap,
    .scx-quaythu-board .scx-dauduoi-table-wrap {
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
        margin-bottom: 0 !important;
    }

    .scx-quaythu-toolbar {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 6px !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 6px 8px !important;
        box-sizing: border-box !important;
    }

    .scx-toolbar-left {
        width: 100% !important;
        justify-content: center !important;
    }

    .scx-station-picker,
    .scx-station-badge {
        width: 100% !important;
        justify-content: center !important;
    }

    .scx-station-badge {
        padding: 4px 8px !important;
        font-size: 0.8rem !important;
    }

    .scx-toolbar-actions {
        width: 100% !important;
        display: flex !important;
        gap: 6px !important;
    }

    .scx-btn-start-quay,
    .scx-btn-speed-toggle {
        flex: 1 1 50% !important;
        padding: 7px 4px !important;
        font-size: 0.82rem !important;
        justify-content: center !important;
        text-align: center !important;
    }

    .scx-quaythu-status-bar {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        padding: 4px 8px !important;
        gap: 6px !important;
    }

    .scx-status-text {
        font-size: 0.8rem !important;
        line-height: 1.3 !important;
    }

    /* Bảng giải thưởng Quay Thử Mobile */
    .scx-quaythu-board .scx-col-prize,
    .scx-quaythu-board .scx-cell-prize {
        width: 32px !important;
        min-width: 32px !important;
        max-width: 32px !important;
        padding: 3px 1px !important;
        font-size: 0.82rem !important;
    }

    .scx-quaythu-board .scx-num-grid-2 {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 3px 6px !important;
    }

    .scx-quaythu-board .scx-num-grid-3 {
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 3px 4px !important;
    }

    .scx-quaythu-board .scx-num-grid-4 {
        grid-template-columns: repeat(4, 1fr) !important;
        gap: 2px 3px !important;
    }

    .scx-quaythu-board .scx-slot {
        width: 100% !important;
        min-width: 0 !important;
        height: 26px !important;
        line-height: 26px !important;
        padding: 0 2px !important;
    }

    .scx-quaythu-board .scx-slot[data-len="2"] {
        max-width: 44px !important;
        font-size: 0.92rem !important;
    }

    .scx-quaythu-board .scx-slot[data-len="3"] {
        max-width: 52px !important;
        font-size: 0.88rem !important;
    }

    .scx-quaythu-board .scx-slot[data-len="4"] {
        max-width: 58px !important;
        font-size: 0.82rem !important;
    }

    .scx-quaythu-board .scx-slot[data-len="5"] {
        max-width: 70px !important;
        font-size: 0.82rem !important;
    }

    .scx-quaythu-board .scx-slot.scx-slot-db,
    .scx-quaythu-board .scx-cell-db .scx-slot {
        max-width: 100px !important;
        height: 32px !important;
        line-height: 32px !important;
        font-size: 1.18rem !important;
    }

    .scx-quaythu-board .scx-cell-g1 .scx-slot {
        max-width: 82px !important;
        height: 28px !important;
        line-height: 28px !important;
        font-size: 0.95rem !important;
    }

    .scx-quaythu-board .scx-slot-placeholder {
        letter-spacing: 1px !important;
        font-size: 0.88rem !important;
    }

    .scx-quaythu-board .scx-cell-db .scx-slot-placeholder,
    .scx-quaythu-board .scx-slot-db .scx-slot-placeholder {
        letter-spacing: 1.5px !important;
        font-size: 1.15rem !important;
    }

    .scx-quaythu-board .scx-slot-spin-num {
        font-size: 0.85rem !important;
        letter-spacing: 0.2px !important;
    }

    .scx-quaythu-board .scx-cell-db .scx-slot-spin-num {
        font-size: 1.15rem !important;
    }

    .scx-quaythu-board .scx-cell-g1 .scx-slot-spin-num {
        font-size: 0.98rem !important;
    }

    .scx-quaythu-board .scx-slot-revealed .scx-number-dark {
        font-size: 0.85rem !important;
    }

    .scx-quaythu-board .scx-slot-revealed .color_red {
        font-size: 0.88rem !important;
    }

    .scx-quaythu-board .scx-cell-db .scx-slot-revealed .scx-number-db {
        font-size: 1.15rem !important;
    }

    .scx-quaythu-board .scx-cell-g1 .scx-slot-revealed .scx-number-dark {
        font-size: 0.95rem !important;
    }

    /* Bảng Lô Tô Đầu - Đuôi Quay Thử Mobile */
    .scx-quaythu-board .scx-table-dauduoi {
        width: 100% !important;
        max-width: 100% !important;
    }

    .scx-quaythu-board .scx-table-dauduoi .scx-col-digit,
    .scx-quaythu-board .scx-table-dauduoi .scx-digit-badge {
        width: 32px !important;
        min-width: 32px !important;
        max-width: 32px !important;
        padding: 3px 0 !important;
        font-size: 0.85rem !important;
    }

    .scx-quaythu-board .scx-table-dauduoi .scx-cell-dauduoi-data {
        padding: 3px 6px !important;
        font-size: 0.85rem !important;
        letter-spacing: 0.3px !important;
        white-space: normal !important;
        word-break: break-all !important;
    }

    .scx-quaythu-board .div-table.scx-config-bar,
    .scx-quaythu-board .div-table.scx-dauduoi-bottom-bar {
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden !important;
        display: flex !important;
        flex-wrap: nowrap !important;
    }

    .scx-quaythu-board .div-table.scx-config-bar .item {
        padding: 4px 2px !important;
        font-size: 10.5px !important;
        min-width: 0 !important;
        flex: 1 1 0 !important;
        text-align: center !important;
        white-space: nowrap !important;
    }

    .scx-quaythu-board .div-table.scx-config-bar .item label {
        font-size: 10.5px !important;
    }
}

/* 10. Tối Ưu Cho Màn Hình Siêu Nhỏ (<= 380px) */
@media (max-width: 380px) {
    .scx-quaythu-board .scx-col-prize,
    .scx-quaythu-board .scx-cell-prize {
        width: 28px !important;
        min-width: 28px !important;
        max-width: 28px !important;
        font-size: 0.78rem !important;
    }
    .scx-quaythu-board .scx-slot[data-len="4"] {
        max-width: 54px !important;
        font-size: 0.78rem !important;
    }
    .scx-quaythu-board .scx-slot[data-len="5"] {
        max-width: 65px !important;
        font-size: 0.78rem !important;
    }
    .scx-quaythu-board .scx-slot.scx-slot-db,
    .scx-quaythu-board .scx-cell-db .scx-slot {
        max-width: 90px !important;
        font-size: 1.05rem !important;
    }
    .scx-quaythu-board .scx-table-dauduoi .scx-col-digit,
    .scx-quaythu-board .scx-table-dauduoi .scx-digit-badge {
        width: 28px !important;
        min-width: 28px !important;
        max-width: 28px !important;
        font-size: 0.8rem !important;
    }
    .scx-quaythu-board .div-table.scx-config-bar .item {
        font-size: 9.5px !important;
        padding: 3px 1px !important;
    }
}

/* ==========================================================================
   11. Bảo Vệ Toàn Diện Chống Cuộn Ngang (Zero Horizontal Scroll Safeguard)
   ========================================================================== */
.scx-component {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
}

.scx-component * {
    box-sizing: border-box !important;
}

/* ==========================================================================
   12. Thông Báo Trạng Thái Mở Thưởng & Chờ Quay (Pending & Notice States)
   ========================================================================== */
.scx-kqxs-pending-notice {
    background: #fff8e6 !important;
    border-radius: var(--scx-radius, 5px) !important;
    padding: 10px 14px !important;
    margin-bottom: 12px !important;
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 8px 12px !important;
    box-shadow: none !important;
    border: none !important;
    width: 100% !important;
    max-width: 100% !important;
}

.scx-pending-badge {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: linear-gradient(135deg, #d97706, #b45309) !important;
    color: #ffffff !important;
    font-size: 0.75rem !important;
    font-weight: 800 !important;
    padding: 3px 8px !important;
    border-radius: var(--scx-radius, 5px) !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
}

.scx-pending-desc {
    margin: 0 !important;
    font-size: 0.88rem !important;
    color: #78350f !important;
    line-height: 1.4 !important;
    flex: 1 1 200px !important;
}

.scx-pending-desc strong {
    font-weight: 700 !important;
    color: #92400e !important;
}

.scx-notice-info {
    background: #eff6ff !important;
    color: #1e40af !important;
    border-radius: var(--scx-radius, 5px) !important;
    padding: 8px 12px !important;
    margin-bottom: 10px !important;
    font-size: 0.84rem !important;
    line-height: 1.4 !important;
    box-shadow: none !important;
    border: none !important;
    width: 100% !important;
    max-width: 100% !important;
}

.scx-notice-info strong {
    font-weight: 700 !important;
    color: #1e3a8a !important;
}