/*
 * Mega Stake complete rebrand layer.
 * The visual language follows the supplied rebrand.html reference: bright
 * yellow command areas, pale app surfaces, dense mobile sportsbook cards.
 */
:root,
html[data-theme="dark"],
html[data-theme="light"] {
    --bb-yellow: #ffdf00;
    --bb-yellow-deep: #f4ce00;
    --bb-ink: #292a33;
    --bb-muted: #6a6f7a;
    --bb-page: #f2f3f5;
    --bb-card: #ffffff;
    --bb-line: #e5e7eb;
    --bb-green: #10a310;
    --bb-green-soft: #dff5d5;
    --bb-red: #ff5252;
    --bg-main: var(--bb-page);
    --bg-card: var(--bb-card);
    --bg-card2: #f7f8fa;
    --accent: var(--bb-yellow);
    --accent-mid: var(--bb-yellow-deep);
    --text-main: var(--bb-ink);
    --text-dim: var(--bb-muted);
    --border: var(--bb-line);
    --shadow: none;
    --btn-text: #111111;
}

html,
body {
    background: var(--bb-page) !important;
    color: var(--bb-ink) !important;
}

body {
    padding-bottom: calc(76px + env(safe-area-inset-bottom, 0px)) !important;
}

a { color: inherit; }

.ow-header {
    position: sticky;
    top: 0;
    z-index: 1100;
    background: var(--bb-yellow) !important;
    border: 0 !important;
    box-shadow: none !important;
}

.ow-header-inner {
    max-width: 742px;
    min-height: 70px;
    padding: 0 15px !important;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    position: relative;
}

.ow-logo {
    color: #1b1b1b !important;
    text-decoration: none;
    display: flex;
    align-items: center;
    min-width: 0;
}

.ow-logo > * { display: none !important; }

.ow-logo::before {
    content: "MEGA STAKE";
    color: #242532;
    font-size: 28px;
    font-weight: 1000;
    letter-spacing: -1.7px;
    line-height: 1;
}

.ow-logo::after {
    content: "";
    width: 30px;
    height: 30px;
    margin-left: 3px;
    background: #02bd31;
    clip-path: polygon(25% 0, 75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%);
}

.ow-header-inner::after {
    content: "Sports / Casino";
    position: absolute;
    left: 50%;
    top: 20px;
    transform: translateX(-50%);
    color: #1f2030;
    font-size: 27px;
    font-weight: 420;
    white-space: nowrap;
}

.ow-header-inner::before {
    content: "";
    position: absolute;
    left: calc(50% - 56px);
    top: 59px;
    width: 39px;
    height: 5px;
    border-radius: 99px;
    background: #202232;
    z-index: 1;
}

.ow-header-inner .ow-logo {
    z-index: 2;
}

.ow-right,
.ow-guest-btns {
    display: flex;
    align-items: center;
    gap: 6px;
    z-index: 2;
}

.ow-guest-btn,
.hdr-btn {
    min-height: 48px;
    border: 0 !important;
    border-radius: 99px !important;
    box-shadow: none !important;
    font-size: 20px !important;
    font-weight: 850 !important;
    text-decoration: none;
}

.ow-guest-login,
.hdr-search-btn {
    background: #292a33 !important;
    color: var(--bb-yellow) !important;
}

.hdr-search-btn {
    width: 48px !important;
    padding: 0 !important;
    border-radius: 50% !important;
}

.hdr-mybets-btn,
.hdr-profile-pill,
.hdr-toggle,
.ow-right > a { display: none !important; }

.ow-right::after {
    content: "Join / Login";
    height: 54px;
    display: inline-flex;
    align-items: center;
    padding: 0 18px;
    border-radius: 999px;
    background: #292a33;
    color: var(--bb-yellow);
    font-size: 19px;
    font-weight: 950;
    white-space: nowrap;
}

.ow-guest-btns {
    gap: 8px;
}

.ow-guest-btn {
    height: 56px;
    display: inline-flex;
    align-items: center;
    padding: 0 17px !important;
    background: #292a33 !important;
    color: var(--bb-yellow) !important;
}

.sportsbook-nav {
    display: none !important;
}

.sportsbook-nav::-webkit-scrollbar { display: none; }

.sportsbook-nav a {
    flex: 0 0 auto;
    min-width: 76px;
    height: 42px;
    display: grid;
    place-items: center;
    padding: 0 13px;
    color: rgba(255,255,255,.78) !important;
    font-size: 12px;
    font-weight: 760;
    text-decoration: none;
    border-bottom: 3px solid transparent;
}

.sportsbook-nav a.active {
    color: #fff !important;
    border-bottom-color: var(--bb-yellow);
}

.bb-shell {
    max-width: 742px;
    margin: 0 auto;
    min-height: 100vh;
    background: var(--bb-page);
}

.bb-app-strip,
.ticker-wrap { display: none !important; }

.ticker {
    height: 30px;
    align-items: center;
    animation-duration: 18s !important;
}

.ticker__item {
    color: var(--bb-yellow) !important;
    font-size: 10px !important;
    padding: 0 14px !important;
}

.ticker__item span { color: #fff !important; }

.bb-home-top {
    background: var(--bb-yellow);
    border-radius: 0 0 24px 24px;
    padding: 0 14px 14px;
}

.bb-category-menu {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 5px;
    padding: 0 0 13px;
}

.bb-category {
    position: relative;
    min-width: 0;
    color: #141522;
    text-decoration: none;
    border: 0;
    background: transparent;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 7px;
    font: inherit;
    cursor: pointer;
}

.bb-category-icon {
    width: 55px;
    height: 55px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: rgba(213, 188, 0, .24);
    color: #242532;
    font-size: 0;
}

.bb-category-icon img {
    width: 32px;
    height: 32px;
    object-fit: contain;
    display: block;
}

.bb-category-grid {
    background: transparent;
}

.bb-category span:last-child {
    font-size: 21px;
    font-weight: 430;
    line-height: 1;
    white-space: nowrap;
}

.bb-category-badge {
    position: absolute;
    top: -10px;
    left: 50%;
    transform: translateX(-6%);
    z-index: 2;
    padding: 2px 9px;
    border-radius: 7px;
    background: #ff7474;
    color: #fff;
    font-size: 18px !important;
    font-weight: 850 !important;
    line-height: 1.25 !important;
}

.bb-hero {
    margin: 0;
    padding: 0;
}

.banner-slider {
    border: 0 !important;
    border-radius: 20px !important;
    box-shadow: none !important;
    margin: 0 !important;
    background: #12440f;
}

.promo-banner {
    height: 132px !important;
    background: linear-gradient(120deg, #092c09, #3d7d16) !important;
}

.promo-content {
    left: 40px !important;
    right: 30px !important;
    bottom: 18px !important;
    width: auto !important;
}

.promo-banner::after {
    display: none !important;
}

.promo-content { display: none !important; }

.banner-dots .dot,
.dot {
    width: 6px !important;
    height: 6px !important;
    border-radius: 99px !important;
    background: rgba(255,255,255,.45) !important;
}

.banner-dots .dot.active,
.dot.active {
    width: 16px !important;
    background: var(--bb-yellow) !important;
}

.bb-quick-tabs {
    display: flex;
    gap: 14px;
    overflow-x: auto;
    scrollbar-width: none;
    padding: 20px 14px 14px;
    margin-top: -1px;
    background: var(--bb-page);
}

.bb-quick-tabs::-webkit-scrollbar { display: none; }

.bb-quick-tab {
    flex: 0 0 auto;
    height: 72px;
    min-width: 172px;
    padding: 0 17px;
    border: 0;
    border-radius: 14px;
    background: #fff;
    color: #2d2e37;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    font-size: 23px;
    font-weight: 850;
    white-space: nowrap;
}

.bb-quick-tab img {
    width: 24px;
    height: 24px;
    object-fit: contain;
    display: block;
}

.dash-wrap {
    max-width: none !important;
    padding: 0 8px 12px !important;
    margin: 0 !important;
}

.bb-section,
.sports-panel,
.sportsbook-live {
    background: var(--bb-card) !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    margin: 8px 0 !important;
    padding: 0 !important;
    overflow: hidden;
}

.panel-heading,
.match-list-heading {
    min-height: 38px;
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 0 10px !important;
    border-bottom: 1px solid var(--bb-line);
    background: #fff;
}

.panel-heading h2,
.panel-heading h3,
.section-title {
    margin: 0 !important;
    color: var(--bb-ink) !important;
    font-size: 14px !important;
    font-weight: 900 !important;
}

.panel-heading a,
.panel-live-note {
    color: var(--bb-muted) !important;
    font-size: 11px;
    font-weight: 750;
    text-decoration: none;
}

.casino-rail,
.h-scroll {
    display: flex !important;
    gap: 8px !important;
    padding: 10px !important;
    overflow-x: auto;
    scrollbar-width: none;
}

.casino-rail::-webkit-scrollbar,
.h-scroll::-webkit-scrollbar { display: none; }

.casino-tile,
.game-show-card {
    flex: 0 0 116px !important;
    height: 92px !important;
    border-radius: 6px !important;
    overflow: hidden;
    background: #292a33 !important;
    border: 0 !important;
    color: #fff !important;
    position: relative;
    text-decoration: none;
}

.casino-tile-wide { flex-basis: 148px !important; }
.casino-tile img,
.game-show-thumb { width: 100%; height: 100%; object-fit: cover; opacity: .9; }
.casino-game-name,
.game-show-name {
    position: absolute;
    left: 8px;
    bottom: 8px;
    color: #fff !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    text-shadow: 0 1px 4px rgba(0,0,0,.8);
}

.casino-online,
.game-online,
.game-show-kicker,
.game-show-desc { display: none !important; }

.live-sports-tabs,
.market-tabs,
.league-tabs {
    display: flex !important;
    gap: 0 !important;
    padding: 0 !important;
    overflow-x: auto;
    scrollbar-width: none;
    background: #fff !important;
    border-bottom: 1px solid var(--bb-line);
}

.live-sports-tabs::-webkit-scrollbar,
.market-tabs::-webkit-scrollbar,
.league-tabs::-webkit-scrollbar { display: none; }

.live-sports-tabs strong,
.live-sports-tabs button,
.market-tabs button,
.league-tab {
    flex: 0 0 auto;
    min-width: 74px;
    height: 38px;
    padding: 0 10px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: var(--bb-muted) !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    box-shadow: none !important;
}

.live-sports-tabs strong,
.live-sports-tabs button.active,
.market-tabs button.active,
.league-tab.active {
    color: var(--bb-ink) !important;
    border-bottom: 3px solid var(--bb-yellow) !important;
}

.fixture-feed {
    background: var(--bb-page);
    padding-bottom: 4px;
}

.fixture-group {
    background: #fff;
    margin-top: 8px;
}

.fixture-league-row {
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 10px;
    border-bottom: 1px solid var(--bb-line);
}

.fixture-league-left {
    display: flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
}

.fixture-league-icon { font-size: 15px; }
.fixture-league-name {
    color: var(--bb-ink);
    font-size: 12px;
    font-weight: 850;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.fixture-date-head {
    height: 28px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 156px;
    align-items: center;
    padding: 0 10px;
    background: #f7f8fa;
    color: var(--bb-muted);
    font-size: 11px;
    font-weight: 750;
}

.fixture-market-cols,
.market-columns {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr);
    gap: 4px;
    text-align: center;
}

.fixture-group-list {
    display: flex;
    flex-direction: column;
}

.match-card-wrap {
    display: block;
    color: inherit;
    text-decoration: none;
}

.today-card,
.admin-live-card {
    min-height: 86px;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 156px;
    gap: 8px;
    padding: 8px 10px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--bb-line) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: #fff !important;
}

.today-meta,
.admin-live-head {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--bb-muted) !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    margin-bottom: 6px;
}

.today-teams {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.today-team {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    color: var(--bb-ink);
    font-size: 12px;
    font-weight: 850;
}

.today-team-name {
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.today-score {
    font-size: 13px;
    font-weight: 950;
}

.today-extra-row,
.today-market-icon,
.best-odds-badge {
    display: none !important;
}

.odds-row,
.today-odds {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr);
    gap: 4px !important;
    align-items: stretch;
}

.odd-btn {
    min-width: 0;
    height: 54px !important;
    border: 0 !important;
    border-radius: 3px !important;
    background: var(--bb-green-soft) !important;
    color: var(--bb-green) !important;
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    box-shadow: none !important;
    padding: 4px !important;
}

.odd-label {
    color: var(--bb-muted) !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    line-height: 1;
}

.odd-value {
    color: var(--bb-green) !important;
    font-size: 13px !important;
    font-weight: 950 !important;
}

.odd-btn.selected {
    background: var(--bb-yellow) !important;
    color: var(--bb-ink) !important;
}

.odd-btn.selected .odd-value,
.odd-btn.selected .odd-label { color: var(--bb-ink) !important; }

.popular-card {
    width: 220px;
    min-height: 122px;
    padding: 9px !important;
    border: 1px solid var(--bb-line) !important;
    border-radius: 6px !important;
    background: #fff !important;
    box-shadow: none !important;
}

.match-card-wrap.h-scroll-item {
    flex: 0 0 220px !important;
    width: 220px !important;
}

.featured-best-label {
    display: inline-flex;
    align-items: center;
    height: 18px;
    padding: 0 6px;
    border-radius: 2px;
    background: var(--bb-yellow);
    color: var(--bb-ink);
    font-size: 10px;
    font-weight: 900;
    margin-bottom: 7px;
}

.featured-match-body {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 8px;
}

.featured-team-line {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 6px;
    color: var(--bb-ink);
    font-size: 12px;
    font-weight: 850;
}

.popular-card,
.popular-card *,
.featured-team-line,
.featured-team-line span,
.featured-timebox,
.featured-timebox strong {
    opacity: 1 !important;
}

.featured-team-line span {
    color: var(--bb-ink) !important;
}

.featured-timebox span {
    color: var(--bb-muted) !important;
}

.popular-logo,
.avatar-wrap,
.admin-team-logo {
    width: 22px !important;
    height: 22px !important;
    border-radius: 50%;
    overflow: hidden;
    background: #f2f3f5;
    flex-shrink: 0;
}

.popular-logo img,
.avatar-wrap img,
.admin-team-logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.featured-timebox {
    text-align: right;
    color: var(--bb-muted);
    font-size: 10px;
}

.featured-timebox strong {
    display: block;
    color: var(--bb-ink);
    font-size: 12px;
    font-weight: 950;
}

.state-msg,
.skeleton {
    margin: 10px !important;
    padding: 18px !important;
    background: #fff !important;
    color: var(--bb-muted) !important;
    border: 1px solid var(--bb-line);
    border-radius: 4px !important;
}

.nav-wrapper {
    min-height: calc(58px + env(safe-area-inset-bottom, 0px)) !important;
    height: calc(58px + env(safe-area-inset-bottom, 0px)) !important;
    background: #fff !important;
    border-top: 1px solid var(--bb-line) !important;
    box-shadow: 0 -2px 8px rgba(0,0,0,.08) !important;
    padding: 4px 2px calc(4px + env(safe-area-inset-bottom, 0px)) !important;
}

.nav-item {
    height: 48px !important;
    color: var(--bb-muted) !important;
}

.nav-icon,
.nav-label {
    color: var(--bb-muted) !important;
    opacity: 1 !important;
}

.nav-item.active .nav-icon,
.nav-item.active .nav-label {
    color: var(--bb-ink) !important;
    filter: none !important;
}

.nav-item.active::after {
    content: "";
    width: 18px;
    height: 3px;
    border-radius: 9px;
    background: var(--bb-yellow);
    position: absolute;
    bottom: 2px;
}

#bs-footer,
.bs-sheet,
.betslip-nav-container {
    z-index: 1200;
}

.guest-banner {
    background: #292a33 !important;
    color: #fff !important;
    border-top: 0 !important;
    display: none !important;
}

.gb-register,
.gap-primary {
    background: var(--bb-yellow) !important;
    color: #111 !important;
}

@media (min-width: 721px) {
    body {
        background: #d9dbe0 !important;
    }
    .bb-shell {
        width: 720px;
        max-width: 720px;
        margin-left: auto;
        margin-right: auto;
    }
    .ow-header,
    .sportsbook-nav,
    .nav-wrapper {
        max-width: 720px;
        left: 50% !important;
        right: auto !important;
        transform: translateX(-50%) !important;
        width: 720px !important;
    }
}

@media (max-width: 420px) {
    .today-card,
    .admin-live-card {
        grid-template-columns: minmax(0, 1fr) 144px;
    }
    .fixture-date-head {
        grid-template-columns: minmax(0, 1fr) 144px;
    }
    .odd-btn { height: 50px !important; }
    .action-tab {
        flex-basis: 64px !important;
        min-width: 64px !important;
    }
}

@media (max-width: 620px) {
    .ow-header-inner {
        min-height: 68px;
        padding: 0 14px !important;
    }
    .ow-logo::before {
        font-size: 21px;
        letter-spacing: -1.1px;
    }
    .ow-logo::after {
        width: 24px;
        height: 24px;
    }
    .ow-header-inner::after {
        left: 156px;
        top: 22px;
        transform: none;
        font-size: 20px;
    }
    .ow-header-inner::before {
        left: 156px;
        top: 52px;
        width: 35px;
    }
    .hdr-search-btn {
        width: 40px !important;
        min-height: 40px !important;
        height: 40px !important;
        font-size: 17px !important;
    }
    .ow-right::after {
        height: 46px;
        padding: 0 13px;
        font-size: 17px;
    }
    .bb-home-top {
        padding: 0 14px 10px;
        border-radius: 0 0 22px 22px;
    }
    .bb-category-menu {
        gap: 4px;
        padding-bottom: 10px;
    }
    .bb-category { gap: 6px; }
    .bb-category-icon {
        width: 48px;
        height: 48px;
        font-size: 0;
    }
    .bb-category-icon img {
        width: 28px;
        height: 28px;
    }
    .bb-category span:last-child {
        font-size: 18px;
        letter-spacing: -.4px;
    }
    .bb-category-badge {
        top: -9px;
        font-size: 15px !important;
        padding: 2px 7px;
    }
    .promo-banner {
        height: 132px !important;
        border-radius: 18px !important;
    }
    .bb-quick-tabs {
        gap: 12px;
        padding: 14px 14px 11px;
    }
    .bb-quick-tab {
        min-width: 158px;
        height: 58px;
        font-size: 20px;
        border-radius: 12px;
    }
    .bb-quick-tab img {
        width: 22px;
        height: 22px;
    }
}

/* Pixel-scale dashboard rebuild: Mega Stake uses a 375px mobile canvas. */
html,
body {
    font-family: Arial, Helvetica, sans-serif !important;
    letter-spacing: 0 !important;
}

body {
    padding-bottom: calc(66px + env(safe-area-inset-bottom, 0px)) !important;
}

.ow-header,
.bb-shell,
.nav-wrapper {
    width: 100% !important;
    max-width: 480px !important;
}

.ow-header {
    left: auto !important;
    right: auto !important;
    margin-left: auto !important;
    margin-right: auto !important;
    transform: none !important;
}

.ow-header-inner {
    min-height: 46px !important;
    height: 46px !important;
    padding: 0 10px !important;
    gap: 4px !important;
}

.ow-logo::before {
    font-size: 16px !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
}

.ow-logo::after {
    display: none !important;
}

.ow-header-inner::after {
    display: none !important;
}

.ow-header-inner::before {
    left: 143px !important;
    top: 34px !important;
    width: 20px !important;
    height: 2px !important;
}

.bb-header-switch {
    position: absolute;
    left: 128px;
    top: 12px;
    display: flex;
    align-items: baseline;
    gap: 3px;
    color: #20212d;
    white-space: nowrap;
    line-height: 1;
}

.bb-header-switch strong { font-size: 15px; font-weight: 900; }
.bb-header-switch span { font-size: 14px; font-weight: 400; }

.ow-right {
    margin-left: auto !important;
    gap: 7px !important;
}

.hdr-search-btn {
    width: 28px !important;
    min-width: 28px !important;
    height: 30px !important;
    min-height: 30px !important;
    padding: 0 !important;
    background: transparent !important;
    color: #252632 !important;
    font-size: 19px !important;
}

.ow-right::after { display: none !important; }

.ow-right > a.bb-auth-pill {
    height: 30px;
    display: inline-flex !important;
    align-items: center;
    padding: 0 10px;
    border-radius: 999px;
    background: #292a33;
    color: var(--bb-yellow) !important;
    text-decoration: none;
    font-size: 11px;
    font-weight: 850;
    white-space: nowrap;
}

.ow-right .hdr-profile-pill {
    display: inline-flex !important;
    width: auto !important;
    min-width: 76px !important;
    height: 30px !important;
    min-height: 30px !important;
    padding: 0 9px !important;
    justify-content: center;
    background: #292a33 !important;
    color: var(--bb-yellow) !important;
    border-radius: 999px !important;
    font-size: 11px !important;
}

.ow-right .hdr-profile-pill .hdr-balance-sym,
.ow-right .hdr-profile-pill .hdr-balance-val { color: var(--bb-yellow) !important; }

.bb-shell {
    min-height: 100vh;
    margin: 0 auto !important;
    overflow: hidden;
}

.bb-home-top {
    padding: 0 10px 9px !important;
    border-radius: 0 0 16px 16px !important;
}

.bb-category-menu {
    height: 78px;
    gap: 0 !important;
    padding: 4px 0 6px !important;
    align-items: start;
}

.bb-category {
    gap: 6px !important;
    padding-top: 2px;
}

.bb-category-icon {
    width: 36px !important;
    height: 36px !important;
}

.bb-category-icon img {
    width: 22px !important;
    height: 22px !important;
}

.bb-category span:last-child {
    font-size: 12px !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
}

.bb-category-badge {
    top: -4px !important;
    left: 52% !important;
    padding: 1px 5px !important;
    border-radius: 4px !important;
    font-size: 10px !important;
    line-height: 14px !important;
}

.banner-slider,
.promo-banner,
.promo-real-banner img {
    height: 67px !important;
    border-radius: 12px !important;
}

.banner-slider { background: #0c661b !important; }
.promo-real-banner img { object-fit: cover !important; }

.banner-dots {
    left: 50% !important;
    right: auto !important;
    bottom: 3px !important;
    transform: translateX(-50%);
    gap: 3px !important;
}

.banner-dots .dot,
.dot {
    width: 4px !important;
    height: 4px !important;
}

.banner-dots .dot.active,
.dot.active { width: 12px !important; }

.bb-quick-tabs {
    gap: 7px !important;
    height: 48px;
    padding: 6px 10px 5px !important;
}

.bb-quick-tab {
    min-width: 87px !important;
    height: 36px !important;
    padding: 0 9px !important;
    gap: 6px !important;
    border-radius: 8px !important;
    font-size: 12px !important;
    font-weight: 750 !important;
}

.bb-quick-tab:nth-child(2) { min-width: 136px !important; }
.bb-quick-tab:nth-child(3) { min-width: 105px !important; }

.bb-quick-tab img {
    width: 15px !important;
    height: 15px !important;
}

.dash-wrap {
    padding: 0 10px 16px !important;
    overflow: visible !important;
}

.featured-panel {
    height: 220px;
    margin: 5px 0 9px !important;
    padding: 0 0 10px !important;
    border-radius: 12px !important;
    background: #d8f5cf !important;
    overflow: hidden;
}

.bb-section-tabs,
.bb-highlight-tabs {
    height: 45px;
    display: flex;
    align-items: stretch;
    overflow-x: auto;
    scrollbar-width: none;
}

.bb-section-tabs::-webkit-scrollbar,
.bb-highlight-tabs::-webkit-scrollbar { display: none; }

.bb-section-tabs button,
.bb-highlight-tabs button,
.bb-highlight-tabs strong {
    flex: 0 0 auto;
    position: relative;
    border: 0;
    background: transparent;
    color: #292a33;
    padding: 0 10px;
    font: inherit;
    font-size: 14px;
    font-weight: 400;
    white-space: nowrap;
}

.bb-section-tabs button:first-child,
.bb-highlight-tabs strong {
    color: #08a81b;
    font-size: 15px;
    font-weight: 850;
}

.bb-section-tabs button.active::after,
.bb-highlight-tabs strong::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 4px;
    width: 24px;
    height: 3px;
    transform: translateX(-50%);
    border-radius: 99px;
    background: #08a81b;
}

.league-tabs {
    height: 42px;
    padding: 2px 8px 4px !important;
    gap: 8px !important;
    border: 0 !important;
    background: transparent !important;
}

.league-tab {
    width: 112px !important;
    min-width: 112px !important;
    height: 32px !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 0 14px !important;
    border: 1px solid #e2e5e9 !important;
    border-radius: 18px !important;
    background: #fff !important;
    color: #626873 !important;
    font-size: 14px !important;
    box-shadow: 0 2px 5px rgba(25, 32, 44, .08) !important;
    transition: color .18s ease, border-color .18s ease, background-color .18s ease, box-shadow .18s ease !important;
}

.league-tab.active {
    color: #08a81b !important;
    border: 1px solid #08a81b !important;
    background: #effbea !important;
    box-shadow: 0 2px 7px rgba(8, 168, 27, .14) !important;
}

.league-tab-jackpot {
    position: relative;
    font-size: 0 !important;
}

.league-tab-jackpot::before {
    content: "Jackpot";
    position: absolute;
    top: -12px;
    left: -2px;
    z-index: 2;
    padding: 2px 5px;
    border-radius: 4px;
    background: #16bd0b;
    color: #fff;
    font-size: 10px;
}

.featured-panel .h-scroll {
    height: 127px;
    gap: 8px !important;
    padding: 0 8px 7px !important;
    scroll-snap-type: x mandatory;
}

.match-card-wrap.h-scroll-item {
    flex: 0 0 285px !important;
    width: 285px !important;
    max-width: 285px !important;
}

.popular-card {
    width: 285px !important;
    height: 127px !important;
    min-height: 127px !important;
    padding: 8px !important;
    border: 0 !important;
    border-radius: 10px !important;
}

.featured-card-head {
    height: 19px;
    display: grid;
    grid-template-columns: 70px 1fr 18px;
    align-items: center;
    gap: 4px;
    color: var(--bb-muted);
}

.featured-hot,
.highlight-best {
    justify-self: start;
    padding: 1px 5px;
    border-radius: 2px;
    background: #ff6865;
    color: #fff;
    font-size: 10px;
    font-style: italic;
    white-space: nowrap;
}

.featured-league {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: center;
    font-size: 10px;
}

.featured-card-head i { color: #737985; font-size: 12px; }

.featured-scoreboard {
    height: 60px;
    display: grid;
    grid-template-columns: 1fr 72px 1fr;
    align-items: center;
    gap: 4px;
}

.featured-side {
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    text-align: center;
}

.featured-side .popular-logo {
    width: 30px !important;
    height: 30px !important;
    background: transparent !important;
}

.featured-side strong {
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #292a33;
    font-size: 11px;
    font-weight: 800;
}

.featured-center {
    display: flex;
    flex-direction: column;
    align-items: center;
    line-height: 1.15;
}

.featured-center b { color: #ff515b; font-size: 16px; }
.featured-center span { color: #ff515b; font-size: 11px; }
.featured-center small { color: #686d78; font-size: 9px; margin-top: 2px; }

.featured-panel .odds-row {
    height: 33px;
    padding: 0 !important;
    gap: 2px !important;
}

.featured-panel .odd-btn {
    height: 33px !important;
    min-height: 33px !important;
    flex-direction: row !important;
    justify-content: space-between !important;
    padding: 0 8px !important;
    border-radius: 6px !important;
}

.featured-panel .odd-label {
    display: inline !important;
    color: #08a81b !important;
    font-size: 10px !important;
}

.featured-panel .odd-value { font-size: 13px !important; }
.featured-panel .odd-btn.locked { background: #e5e7eb !important; }

.bb-jackpot-strip {
    height: 59px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin-bottom: 9px;
}

.bb-jackpot-card {
    position: relative;
    min-width: 0;
    padding: 10px;
    border-radius: 12px;
    background: linear-gradient(115deg, #fff 45%, #f1fff0 100%);
    color: #292a33;
    text-decoration: none;
    overflow: visible;
}

.bb-jackpot-card.casino { background: linear-gradient(115deg, #fff 45%, #f6ebff 100%); }
.bb-jackpot-card strong { display: block; font-size: 12px; font-weight: 850; }
.bb-jackpot-card small { position: absolute; top: 12px; right: 5px; color: #b349ff; font-size: 9px; }
.bb-jackpot-card > span { display: flex; align-items: center; margin-top: 5px; font-size: 11px; }
.bb-jackpot-card em { padding: 2px 7px; border-radius: 10px 0 0 10px; background: #d8f5cf; color: #08a81b; font-style: normal; }
.bb-jackpot-card b { padding: 2px 7px 2px 2px; border-radius: 0 10px 10px 0; background: #13bf0d; color: #fff; white-space: nowrap; }
.bb-jackpot-card.casino em { background: #f1dfff; color: #ad44ff; }
.bb-jackpot-card.casino b { background: #b400ff; }
.bb-jackpot-bolt { position: absolute; top: -4px; right: -4px; width: 18px; height: 18px; display: grid; place-items: center; border: 2px solid #fff; border-radius: 50%; background: #a84aff; color: #fff; font-size: 9px; }

.sportsbook-live,
.highlights-panel {
    margin: 0 0 9px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 14px !important;
    background: #fff !important;
    overflow: hidden;
}

.sportsbook-live { height: 123px; }

.live-sports-tabs {
    height: 53px;
    padding: 0 10px !important;
    border: 0 !important;
    gap: 0 !important;
}

.live-sports-tabs strong,
.live-sports-tabs button {
    position: relative;
    min-width: auto !important;
    height: 43px !important;
    padding: 0 10px !important;
    color: #292a33 !important;
    font-size: 14px !important;
    font-weight: 400 !important;
}

.live-sports-tabs strong {
    padding-left: 0 !important;
    font-size: 24px !important;
    font-weight: 850 !important;
    border-right: 1px solid #e6e7e9 !important;
    border-bottom: 0 !important;
}

.live-sports-tabs button.active {
    color: #08a81b !important;
    font-weight: 800 !important;
    border: 0 !important;
}

.live-sports-tabs button.active::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 24px;
    height: 3px;
    transform: translateX(-50%);
    border-radius: 99px;
    background: #08a81b;
}

.market-tabs {
    height: 43px;
    padding: 5px 10px 7px !important;
    gap: 8px !important;
    border: 0 !important;
}

.market-tabs button {
    min-width: auto !important;
    height: 27px !important;
    padding: 0 11px !important;
    border: 0 !important;
    border-radius: 15px !important;
    background: #f0f1f3 !important;
    color: #6d727d !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    white-space: nowrap;
}

.market-tabs button.active {
    background: var(--bb-yellow) !important;
    color: #161616 !important;
    border: 0 !important;
}

.market-tabs button i { font-size: 8px; }

.bb-market-columns {
    height: 27px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    align-items: center;
    margin-left: 0;
    padding: 0 8px 0 198px;
    background: #f7f8fa;
    color: #69707d;
    text-align: center;
    font-size: 11px;
}

.highlights-panel { border-radius: 0 !important; margin-bottom: 0 !important; }
.bb-highlight-tabs { height: 49px; padding: 0 0 0 0; }
.bb-highlight-tabs strong { display: flex; align-items: center; padding-left: 10px; }
.bb-highlight-tabs button { font-size: 14px; padding: 0 10px; color: #6d727d; }
.bb-highlight-tabs strong:not(.active) { color: #6d727d; font-weight: 400; }
.bb-highlight-tabs strong:not(.active)::after { display: none; }
.bb-highlight-tabs button.active { color: #08a81b; font-weight: 800; }
.bb-highlight-tabs button.active::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 4px;
    width: 24px;
    height: 3px;
    transform: translateX(-50%);
    border-radius: 99px;
    background: #08a81b;
}
.highlights-market-tabs { border-bottom: 0 !important; }
.highlights-panel > .bb-market-columns { margin-left: 0; padding-left: 184px; }

.highlights-feed { background: #fff; }
.highlights-feed .match-card-wrap { border-bottom: 1px solid #eff0f1; }

.highlight-card {
    min-height: 116px !important;
    display: block !important;
    padding: 8px 10px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: linear-gradient(100deg, #fff8c9 0%, #fffce4 46%, #ffffff 100%) !important;
}

.highlight-main {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 177px;
    gap: 6px;
}

.highlight-card .today-meta {
    height: 21px;
    margin: 0 0 3px !important;
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 5px;
}

.highlight-card .highlight-best { font-size: 9px; }
.highlight-card .today-league { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; font-weight: 400; color: #6c727e; }
.highlight-card .today-meta i { color: #6d727d; font-size: 12px; }

.highlight-card .today-teams { gap: 2px; }
.highlight-card .today-team { justify-content: flex-start; gap: 5px; }
.today-team-logo { width: 14px; height: 14px; flex: 0 0 14px; display: grid; place-items: center; overflow: hidden; border-radius: 50%; }
.today-team-logo img { width: 100%; height: 100%; object-fit: contain; }
.highlight-card .today-team-name { font-size: 13px; font-weight: 800; }

.highlight-card .odds-row {
    align-self: end;
    height: 41px;
    padding: 0 !important;
    gap: 3px !important;
}

.highlight-card .odd-btn {
    height: 41px !important;
    min-height: 41px !important;
    border-radius: 6px !important;
}

.highlight-card .odd-label { display: none !important; }
.highlight-card .odd-value { font-size: 15px !important; }

.highlight-footer {
    height: 22px;
    display: flex;
    align-items: end;
    gap: 9px;
    color: #6d727d;
    font-size: 11px;
    white-space: nowrap;
}

.skeleton { height: 100px !important; }

.nav-wrapper {
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    grid-template-columns: repeat(5, 1fr) !important;
    height: calc(61px + env(safe-area-inset-bottom, 0px)) !important;
    min-height: calc(61px + env(safe-area-inset-bottom, 0px)) !important;
    padding: 4px 0 calc(3px + env(safe-area-inset-bottom, 0px)) !important;
}

.nav-item {
    position: relative;
    height: 53px !important;
    min-height: 53px !important;
}

.nav-icon {
    width: 24px !important;
    height: 24px !important;
    margin: 0 0 2px !important;
    font-size: 20px !important;
    line-height: 24px !important;
}

.nav-icon-wrap {
    position: relative;
    width: 32px;
    height: 26px;
    display: grid;
    place-items: center;
}

.nav-icon-wrap .nav-icon { margin: 0 !important; }

.nav-live-badge {
    position: absolute;
    top: -5px;
    right: -10px;
    min-width: 21px;
    height: 15px;
    padding: 0 3px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    background: #ff6d62;
    color: #fff;
    font-size: 8px;
    font-weight: 800;
}

.nav-label {
    font-size: 11px !important;
    line-height: 13px !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
}

.nav-item.active .nav-icon,
.nav-item.active .nav-label { color: #08a81b !important; }
.nav-item.active::after { display: none !important; }

#floating-betslip { display: none !important; }

#alpha-betslip-float {
    right: max(calc((100vw - 480px) / 2), 0px) !important;
    bottom: calc(66px + env(safe-area-inset-bottom, 0px)) !important;
    width: 48px !important;
    min-height: 48px !important;
    height: 48px !important;
    border: 0 !important;
    border-radius: 12px 0 0 0 !important;
    background: var(--bb-yellow) !important;
    color: #292a33 !important;
    box-shadow: none !important;
    gap: 0 !important;
}

#alpha-betslip-float i { display: none !important; }
#alpha-betslip-float strong { width: 24px; height: 24px; margin-top: -8px; display: grid; place-items: center; border-radius: 50%; background: #292a33; color: #fff; font-size: 12px !important; line-height: 1 !important; letter-spacing: 0 !important; }
#alpha-betslip-float span { font-size: 10px !important; font-weight: 400 !important; }

@media (min-width: 376px) {
    body { background: #e5e6e8 !important; }
}

@media (max-width: 350px) {
    .bb-header-switch { left: 105px; }
    .ow-header-inner::before { left: 118px !important; }
    .ow-logo::before { font-size: 14px !important; }
    .ow-logo::after { width: 17px !important; height: 17px !important; }
    .ow-right { gap: 4px !important; }
    .ow-right .hdr-profile-pill { min-width: 68px !important; padding: 0 7px !important; }
    .bb-section-tabs button { padding: 0 7px; font-size: 13px; }
    .bb-section-tabs button:first-child { font-size: 14px; }
    .ow-right::after { padding: 0 7px !important; font-size: 10px !important; }
    .bb-category span:last-child { font-size: 11px !important; }
    .highlight-main { grid-template-columns: minmax(0, 1fr) 155px; }
}

/* Compact Mega Stake brand header. */
.ow-header-inner {
    min-width:0;
    justify-content:space-between !important;
}
.ow-header-inner::before,.ow-header-inner::after,.bb-header-switch { display:none !important; }
.ow-logo.ms-brand {
    flex:0 1 auto;
    min-width:0;
    max-width:118px;
    display:flex !important;
    align-items:center;
    gap:6px !important;
    text-decoration:none;
}
.ow-logo.ms-brand::before,.ow-logo.ms-brand::after { display:none !important; }
.ow-logo.ms-brand > * { display:flex !important; }
.ms-brand-mark {
    position:relative;
    width:29px;
    height:29px;
    flex:0 0 29px;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    clip-path:polygon(22% 0,78% 0,100% 22%,100% 78%,78% 100%,22% 100%,0 78%,0 22%);
    background:linear-gradient(145deg,#292b35 0%,#111319 65%,#08ae1a 66%,#08ae1a 100%);
    box-shadow:0 2px 7px rgba(24,31,39,.22);
}
.ms-brand-mark::before {
    content:'';
    position:absolute;
    inset:3px;
    border:1px solid rgba(255,232,23,.62);
    clip-path:inherit;
}
.ms-brand-mark b {
    position:relative;
    z-index:1;
    color:#ffdf00;
    font-size:17px;
    font-weight:950;
    font-style:italic;
    line-height:1;
}
.ms-brand-copy {
    min-width:0;
    flex-direction:column;
    justify-content:center;
    gap:0;
    line-height:.84;
    transform:skewX(-6deg);
}
.ms-brand-copy strong,.ms-brand-copy b {
    display:block;
    letter-spacing:0;
    white-space:nowrap;
}
.ms-brand-copy strong { color:#292b35; font-size:12px; font-weight:950; }
.ms-brand-copy b { color:#08a918; font-size:11px; font-weight:950; }
.ow-right { flex:0 0 auto; min-width:0; gap:5px !important; }
.ow-right > a.hdr-balance-compact {
    width:auto;
    min-width:56px;
    max-width:82px;
    height:30px;
    display:inline-flex !important;
    align-items:center;
    justify-content:center;
    gap:3px;
    overflow:hidden;
    padding:0 8px;
    border:1.5px solid #08ae1a;
    border-radius:999px;
    background:rgba(255,255,255,.42);
    color:#078f16 !important;
    text-decoration:none;
    box-sizing:border-box;
}
.hdr-balance-compact span {
    flex:0 0 auto;
    color:#078f16 !important;
    font-size:9px;
    font-weight:800;
}
.hdr-balance-compact strong {
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:#078f16 !important;
    font-size:11px;
    font-weight:850;
}
.ow-right .hdr-profile-pill.hdr-deposit-btn {
    min-width:58px !important;
    width:auto !important;
    padding:0 10px !important;
    background:#292b35 !important;
    color:#ffdf00 !important;
    font-size:10px !important;
}
@media (max-width:350px) {
    .ow-logo.ms-brand { max-width:92px; gap:4px !important; }
    .ms-brand-mark { width:26px; height:26px; flex-basis:26px; }
    .ms-brand-copy strong { font-size:10px; }
    .ms-brand-copy b { font-size:9px; }
    .ow-right > a.hdr-balance-compact { min-width:50px; max-width:67px; padding:0 6px; }
    .ow-right .hdr-profile-pill.hdr-deposit-btn { min-width:52px !important; padding:0 7px !important; }
}