.home-layout {
            display: grid;
            grid-template-columns: 240px 1fr 300px;
            gap: 0;
            min-height: calc(100vh - 64px);
            }
            .betslip-drawer__head,.site-header__menu-btn{display:none!important;}
            .home-mobile-toggle { display: none; }
            .home-backdrop { display: none; }
            @media (max-width: 900px) {
            .home-layout { grid-template-columns: 1fr; }
            .home-left {
            position: fixed; top: 64px; left: 0; bottom: 0;
            width: 280px; max-width: 85vw;display:none;
            transform: translateX(-100%); transition: transform .25s ease;
            z-index: 70; height: auto;
            }
            .home-left--open { transform: translateX(0); box-shadow: 0 0 40px rgba(0,0,0,.5); }
            .home-backdrop { display: block; position: fixed; inset: 64px 0 0 0; background: rgba(0,0,0,.55); z-index: 65; }
            .home-mobile-toggle {
            display: inline-flex; align-items: center; gap: 8px;
            margin: 12px 14px 0; padding: 8px 14px; border-radius: 8px;
            background: var(--color-surface); border: 1px solid var(--color-surface-border);
            color: var(--color-text-main); font-size: 13px; font-weight: 700;
            }
            .home-mobile-toggle:hover { border-color: var(--color-gold); color: var(--color-gold); }
            .site-header__right .site-subnav__link{display:none;}.site-subnav__betslip { font-size: 0px;}.site-subnav__betslip >span { font-size: 15px;}
            .betslip-drawer{position:fixed;top:0;right:0;bottom:0;width:min(380px,100%);background:var(--color-base);border-left:1px solid var(--color-surface-border);transform:translate(100%);transition:transform .28s ease;z-index:80;display:flex;flex-direction:column;box-shadow:-10px 0 30px #0006}
            .betslip-drawer__head{display:flex!important;}
            .site-header__menu-btn{display:inline-flex!important;}
            }
            @media (max-width: 720px) {
            .home-center { padding: 12px 14px 24px !important; }
            }
            /* ---------- LEFT SIDEBAR ---------- */
            .home-left {
            border-right: 1px solid var(--color-surface-border);
            background: rgba(20, 10, 48, 0.6);
            padding: 12px 0 24px;
            position: sticky;
            top: 64px;
            height: calc(100vh - 64px);
            overflow-y: auto;
            }
            .home-left__search {
            margin: 4px 12px 10px;
            position: relative;
            }
            .home-left__search input {
            width: 100%;
            background: var(--color-base);
            border: 1px solid var(--color-surface-border);
            color: var(--color-text-main);
            font-size: 13px; font-weight: 600;
            padding: 9px 12px 9px 32px;
            border-radius: 8px;
            outline: none;
            }
            .home-left__search input:focus { border-color: var(--color-gold); }
            .home-left__search-icon {
            position: absolute; left: 10px; top: 50%; transform: translateY(-50%);
            font-size: 13px; color: var(--color-text-dim);
            pointer-events: none;
            }
            .home-left__row {
            display: flex; align-items: center; justify-content: space-between;
            width: 100%; padding: 11px 16px;
            font-size: 13px; font-weight: 700;
            color: var(--color-text-main);
            transition: background 0.15s;
            text-align: left;
            border-left: 3px solid transparent;
            }
            .home-left__row:hover { background: var(--color-surface-hover); border-left-color: var(--color-gold); }
            .home-left__row-left { display: flex; align-items: center; gap: 12px; min-width: 0; }
            .home-left__icon { font-size: 15px; width: 20px; text-align: center; flex-shrink: 0; }
            .home-left__chev {
            font-size: 10px; color: var(--color-text-dim);
            transition: transform 0.2s;
            }
            .home-left__chev--open { transform: rotate(90deg); color: var(--color-gold); }
            .home-left__sub {
            display: flex; flex-direction: column;
            background: rgba(0,0,0,0.18);
            border-top: 1px solid var(--color-surface-border);
            border-bottom: 1px solid var(--color-surface-border);
            }
            .home-left__sub-row {
            display: flex; align-items: center; gap: 12px;
            padding: 9px 16px 9px 36px;
            font-size: 12.5px; font-weight: 600;
            color: var(--color-text-muted);
            border-left: 3px solid transparent;
            transition: all 0.15s;
            }
            .home-left__sub-row:hover {
            color: var(--color-gold);
            border-left-color: var(--color-gold);
            background: var(--color-surface-hover);
            }
            .home-left__sub-icon { font-size: 14px; width: 18px; text-align: center; }
            /* ---------- CENTER CONTENT ---------- */
            .home-center { padding: 24px; min-width: 0; }
            .home-splash {
            background: linear-gradient(135deg, var(--color-surface), var(--color-surface-2));
            border: 1px solid var(--color-surface-border);
            border-radius: var(--radius-lg);
            padding: 28px 32px;
            display: flex; align-items: center; justify-content: space-between; gap: 24px;
            margin-bottom: 20px;
            position: relative; overflow: hidden;
            }
            .home-splash::after {
            content: ""; position: absolute; right: -60px; top: -60px;
            width: 240px; height: 240px; border-radius: 999px;
            background: radial-gradient(circle, var(--color-gold-glow), transparent 65%);
            pointer-events: none;
            }
            .home-splash__title { font-size: 24px; font-weight: 800; letter-spacing: -0.01em; }
            .home-splash__sub { color: var(--color-text-muted); font-size: 13px; margin-top: 4px; }
            .home-splash__cta {
            background: linear-gradient(135deg, var(--color-gold), var(--color-gold-2));
            color: var(--color-base);
            font-weight: 800; padding: 11px 20px; border-radius: var(--radius-sm);
            font-size: 13px; letter-spacing: 0.04em; text-transform: uppercase;
            z-index: 1; position: relative;
            }
            /* Promo strip cards */
            .home-promos {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 12px;
            margin-bottom: 22px;
            }
            @media (max-width: 700px) {
            .home-promos { grid-template-columns: 1fr; }
            }
            .home-promo {
            background: var(--color-surface);
            border: 1px solid var(--color-surface-border);
            border-radius: var(--radius-md);
            padding: 16px;
            transition: border-color 0.15s, transform 0.15s;
            cursor: pointer;
            }
            .home-promo:hover { border-color: var(--color-gold); transform: translateY(-2px); }
            .home-promo__tag {
            display: inline-block;
            background: var(--color-gold-dim); color: var(--color-gold);
            font-size: 10px; font-weight: 800;
            padding: 2px 8px; border-radius: 4px;
            text-transform: uppercase; letter-spacing: 0.06em;
            margin-bottom: 8px;
            }
            .home-promo__title { font-size: 15px; font-weight: 800; margin-bottom: 4px; }
            .home-promo__body { font-size: 12px; color: var(--color-text-muted); line-height: 1.5; }
            .home-tabs {
            display: flex; gap: 6px;
            background: var(--color-surface);
            border: 1px solid var(--color-surface-border);
            border-radius: var(--radius-md);
            padding: 4px; margin-bottom: 14px;
            width: fit-content;
            }
            .home-tab {
            font-size: 13px; font-weight: 700;
            color: var(--color-text-muted);
            padding: 8px 18px; border-radius: 6px;
            transition: all 0.15s;
            }
            .home-tab--active {
            background: linear-gradient(135deg, var(--color-gold), var(--color-gold-2));
            color: var(--color-base);
            }
            .home-list { display: flex; flex-direction: column; gap: 8px; }
            .home-row {
            display: grid;
            grid-template-columns: 80px 1fr auto;
            gap: 16px; align-items: center;
            background: var(--color-surface);
            border: 1px solid var(--color-surface-border);
            border-radius: var(--radius-md);
            padding: 12px 14px;
            transition: border-color 0.15s;
            }
            .home-row:hover { border-color: var(--color-gold); }
            .home-row__time {
            font-size: 14px; font-weight: 800;
            font-variant-numeric: tabular-nums;
            color: var(--color-gold);
            }
            .home-row__time--urgent { color: var(--color-live); animation: pulse 1.2s infinite; }
            .home-row__main { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
            .home-row__meta { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
            .home-row__venue {
            font-size: 11px; font-weight: 700; color: var(--color-text-muted);
            text-transform: uppercase; letter-spacing: 0.06em;
            }
            .home-row__race-no {
            background: var(--color-surface-hover);
            color: var(--color-gold);
            font-size: 10px; font-weight: 800;
            padding: 2px 7px; border-radius: 999px;
            letter-spacing: 0.04em;
            }
            .home-row__country {
            background: var(--color-base);
            color: var(--color-text-muted);
            font-size: 10px; font-weight: 700;
            padding: 2px 6px; border-radius: 4px;
            }
            .home-row__title { font-size: 14px; font-weight: 700; }
            .home-row__sub { font-size: 12px; color: var(--color-text-dim); }
            .home-row__odds { display: flex; gap: 6px; }
            .home-odd-btn {
            background: var(--color-base);
            border: 1px solid var(--color-surface-border);
            color: var(--color-text-main);
            font-weight: 800; font-size: 13px;
            padding: 9px 12px; border-radius: 6px;
            font-variant-numeric: tabular-nums;
            transition: all 0.15s;
            min-width: 60px;
            }
            .home-odd-btn:hover {
            border-color: var(--color-gold);
            color: var(--color-gold);
            background: var(--color-gold-dim);
            }
            .home-odd-btn small { display: block; font-size: 9px; color: var(--color-text-dim); font-weight: 600; margin-bottom: 2px; text-transform: uppercase; letter-spacing: 0.06em; }
            .home-live-pill {
            background: var(--color-live);
            color: #fff;
            font-size: 10px; font-weight: 800;
            padding: 2px 7px; border-radius: 4px;
            text-transform: uppercase; letter-spacing: 0.06em;
            }
            @keyframes pulse { 0%,100% { opacity: 1; } 50% { opacity: 0.55; } }
            /* ---------- NEXT TO GO STRIP ---------- */
            .ntg {
            background: var(--color-surface);
            border: 1px solid var(--color-surface-border);
            border-radius: var(--radius-md);
            margin-bottom: 18px;
            overflow: hidden;
            }
            .ntg__head {
            display: flex; align-items: center; justify-content: space-between;
            padding: 10px 14px;
            border-bottom: 1px solid var(--color-surface-border);
            background: rgba(0,0,0,0.18);
            }
            .ntg__title {
            display: flex; align-items: center; gap: 8px;
            font-size: 13px; font-weight: 800;
            text-transform: uppercase; letter-spacing: 0.08em;
            }
            .ntg__title::before {
            content: ""; width: 3px; height: 14px; background: var(--color-gold); border-radius: 2px;
            }
            .ntg__see {
            font-size: 11px; font-weight: 700; color: var(--color-gold);
            text-transform: uppercase; letter-spacing: 0.06em;
            }
            .ntg__scroll {
            display: flex; gap: 8px;
            padding: 10px;
            overflow-x: auto;
            scrollbar-width: thin;
            }
            .ntg__scroll::-webkit-scrollbar { height: 6px; }
            .ntg__scroll::-webkit-scrollbar-thumb { background: var(--color-surface-border); border-radius: 3px; }
            .ntg__card {
            flex: 0 0 140px;
            background: var(--color-base);
            border: 1px solid var(--color-surface-border);
            border-radius: 8px;
            padding: 10px 12px;
            display: flex; flex-direction: column; gap: 6px;
            cursor: pointer;
            transition: all 0.15s;
            }
            .ntg__card:hover { border-color: var(--color-gold); transform: translateY(-1px); }
            .ntg__card-top {
            display: flex; align-items: center; justify-content: space-between;
            font-size: 11px; font-weight: 700; color: var(--color-text-muted);
            text-transform: uppercase; letter-spacing: 0.04em;
            }
            .ntg__card-icon { font-size: 16px; }
            .ntg__card-venue { font-size: 13px; font-weight: 800; color: var(--color-text-main); }
            .ntg__card-bottom {
            display: flex; align-items: center; justify-content: space-between;
            margin-top: 2px;
            }
            .ntg__card-race {
            background: var(--color-surface-hover);
            color: var(--color-gold);
            font-size: 10px; font-weight: 800;
            padding: 2px 7px; border-radius: 999px;
            }
            .ntg__card-time {
            font-size: 13px; font-weight: 800;
            color: var(--color-gold);
            font-variant-numeric: tabular-nums;
            }
            .ntg__card-time--urgent { color: var(--color-live); animation: pulse 1.2s infinite; }
            /* ---------- HERO BANNER CAROUSEL ---------- */
            .hero-carousel {
            position: relative;
            border-radius: var(--radius-lg);
            overflow: hidden;
            margin-bottom: 18px;
            border: 1px solid var(--color-surface-border);
            aspect-ratio: 1620 / 320;
            max-height: 320px;
            }
            .hero-slide {
            position: absolute; inset: 0;
            display: flex; align-items: center;
            padding: 36px 44px;
            opacity: 0; transition: opacity 0.6s ease;
            pointer-events: none;
            }
            .hero-slide--active { opacity: 1; pointer-events: auto; }
            .hero-slide::after {
            content: ""; position: absolute; right: -80px; bottom: -80px;
            width: 320px; height: 320px; border-radius: 999px;
            background: radial-gradient(circle, rgba(255,255,255,0.18), transparent 65%);
            pointer-events: none;
            }
            .hero-slide__inner { position: relative; z-index: 2; max-width: 560px; }
            .hero-slide__tag {
            display: inline-block;
            background: rgba(0,0,0,0.35);
            backdrop-filter: blur(8px);
            color: #fff;
            font-size: 10px; font-weight: 800;
            padding: 4px 10px; border-radius: 999px;
            text-transform: uppercase; letter-spacing: 0.1em;
            margin-bottom: 12px;
            border: 1px solid rgba(255,255,255,0.2);
            }
            .hero-slide__title {
            font-size: 32px; font-weight: 800;
            color: #fff; line-height: 1.1;
            letter-spacing: -0.01em;
            text-shadow: 0 2px 12px rgba(0,0,0,0.4);
            }
            .hero-slide__sub {
            color: rgba(255,255,255,0.92);
            font-size: 14px; margin-top: 8px;
            max-width: 480px;
            text-shadow: 0 1px 6px rgba(0,0,0,0.3);
            }
            .hero-slide__cta {
            display: inline-block;
            margin-top: 18px;
            background: var(--color-gold);
            color: var(--color-base);
            font-weight: 800; font-size: 13px;
            padding: 11px 22px; border-radius: var(--radius-sm);
            text-transform: uppercase; letter-spacing: 0.06em;
            transition: transform 0.15s, box-shadow 0.15s;
            }
            .hero-slide__cta:hover {
            transform: translateY(-1px);
            box-shadow: 0 6px 20px rgba(0,0,0,0.35);
            }
            .hero-dots {
            position: absolute; left: 0; right: 0; bottom: 14px;
            display: flex; justify-content: center; gap: 8px;
            z-index: 3;
            }
            .hero-dot {
            width: 8px; height: 8px; border-radius: 999px;
            background: rgba(255,255,255,0.4);
            border: none; cursor: pointer;
            transition: all 0.2s;
            }
            .hero-dot--active { background: var(--color-gold); width: 22px; }
            @media (max-width: 700px) {
            .hero-carousel { aspect-ratio: 16 / 11; }
            .hero-slide { padding: 22px; }
            .hero-slide__title { font-size: 22px; }
            .hero-slide__sub { font-size: 12px; }
            }
            /* ---------- 3-COLUMN RACE GRID ---------- */
            .rc-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 0;
            background: var(--color-surface);
            border: 1px solid var(--color-surface-border);
            border-radius: var(--radius-md);
            overflow: hidden;
            margin-bottom: 18px;
            }
            @media (max-width: 900px) { .rc-grid { grid-template-columns: 1fr; } }
            .rc-col { border-right: 1px solid var(--color-surface-border); }
            .rc-col:last-child { border-right: 0; }
            .rc-col__head {
            display: flex; align-items: center; gap: 8px;
            padding: 12px 14px;
            font-size: 13px; font-weight: 800;
            background: var(--color-surface-2);
            border-bottom: 1px solid var(--color-surface-border);
            }
            .rc-col__bar { width: 3px; height: 14px; background: var(--color-gold); border-radius: 2px; }
            .rc-row {
            display: grid;
            grid-template-columns: 1fr auto 14px;
            gap: 10px; align-items: center;
            width: 100%; padding: 11px 14px;
            background: transparent; border: 0;
            border-bottom: 1px solid var(--color-surface-border);
            text-align: left; cursor: pointer;
            transition: background 0.15s;
            }
            .rc-row:last-child { border-bottom: 0; }
            .rc-row:hover { background: var(--color-surface-hover); }
            .rc-row__main { min-width: 0; }
            .rc-row__venue { font-size: 13px; font-weight: 700; color: var(--color-text-main); }
            .rc-row__race { font-size: 11px; color: var(--color-text-dim); margin-top: 2px; }
            .rc-row__time {
            font-size: 12px; font-weight: 800;
            font-variant-numeric: tabular-nums;
            color: var(--color-text-main);
            padding: 4px 8px; border-radius: 4px;
            }
            .rc-row__time--urgent {
            color: var(--color-gold);
            border: 1px solid var(--color-gold);
            background: var(--color-gold-dim);
            animation: pulse 1.2s infinite;
            }
            .rc-row__chev { color: var(--color-text-dim); font-size: 14px; }
            /* ---------- TRENDING SRM ---------- */
            .srm-card {
            background: var(--color-surface);
            border: 1px solid var(--color-surface-border);
            border-radius: var(--radius-md);
            margin-bottom: 18px;
            overflow: hidden;
            }
            .srm-card__head {
            display: flex; align-items: center; gap: 8px;
            padding: 12px 14px;
            font-size: 13px; font-weight: 800;
            background: var(--color-surface-2);
            border-bottom: 1px solid var(--color-surface-border);
            }
            .srm-card__icon { color: var(--color-gold); }
            .srm-grid {
            display: grid; grid-template-columns: 1fr 1fr; gap: 0;
            }
            @media (max-width: 800px) { .srm-grid { grid-template-columns: 1fr; } }
            .srm {
            padding: 14px;
            border-right: 1px solid var(--color-surface-border);
            }
            .srm:last-child { border-right: 0; }
            .srm__head {
            display: flex; align-items: center; justify-content: space-between;
            margin-bottom: 10px;
            }
            .srm__venue { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.04em; }
            .srm__meta { display: flex; align-items: center; gap: 8px; }
            .srm__tag {
            background: var(--color-gold-dim); color: var(--color-gold);
            font-size: 10px; font-weight: 800;
            padding: 2px 6px; border-radius: 4px;
            text-transform: uppercase; letter-spacing: 0.06em;
            }
            .srm__time { font-size: 12px; font-weight: 700; color: var(--color-text-muted); font-variant-numeric: tabular-nums; }
            .srm__leg {
            display: grid; grid-template-columns: 28px 1fr auto;
            gap: 10px; align-items: center;
            padding: 7px 0;
            border-bottom: 1px dashed var(--color-surface-border);
            }
            .srm__leg:last-of-type { border-bottom: 0; }
            .srm__silk {
            width: 24px; height: 24px; border-radius: 4px;
            color: #1a0e3a; font-size: 11px; font-weight: 800;
            display: flex; align-items: center; justify-content: center;
            }
            .srm__name { font-size: 12.5px; font-weight: 700; color: var(--color-text-main); }
            .srm__pick { font-size: 11px; font-weight: 700; color: var(--color-text-muted); }
            .srm__foot {
            display: flex; align-items: center; justify-content: space-between;
            margin-top: 12px;
            }
            .srm__price { font-size: 13px; font-weight: 800; color: var(--color-text-main); }
            .srm__bet {
            background: linear-gradient(135deg, var(--color-gold), var(--color-gold-2));
            color: var(--color-base);
            font-weight: 800; font-size: 12px;
            padding: 8px 16px; border-radius: 6px;
            text-transform: uppercase; letter-spacing: 0.04em;
            cursor: pointer; border: 0;
            }
            /* ---------- POPULAR RACING ---------- */
            .pop-card {
            background: var(--color-surface);
            border: 1px solid var(--color-surface-border);
            border-radius: var(--radius-md);
            overflow: hidden;
            margin-bottom: 24px;
            }
            .pop-card__head {
            display: flex; align-items: center; gap: 8px;
            padding: 12px 14px;
            font-size: 13px; font-weight: 800;
            background: var(--color-surface-2);
            border-bottom: 1px solid var(--color-surface-border);
            }
            .pop-card__bar { width: 3px; height: 14px; background: var(--color-gold); border-radius: 2px; }
            .pop-row {
            display: grid;
            grid-template-columns: 28px 1fr auto 14px;
            gap: 12px; align-items: center;
            width: 100%; padding: 13px 16px;
            background: transparent; border: 0;
            border-bottom: 1px solid var(--color-surface-border);
            text-align: left; cursor: pointer;
            transition: background 0.15s;
            }
            .pop-row:last-child { border-bottom: 0; }
            .pop-row:hover { background: var(--color-surface-hover); }
            .pop-row__icon { font-size: 16px; color: var(--color-gold); }
            .pop-row__venue { font-size: 13px; font-weight: 700; }
            .pop-row__race { font-size: 11px; color: var(--color-text-dim); margin-top: 2px; }
            .pop-row__time { font-size: 13px; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--color-text-main); }
            .pop-row__chev { color: var(--color-text-dim); font-size: 14px; }