:root {
    --gold: #ffc629;
    --gold-2: #f59e0b;
    --ink: #090a0d;
    --charcoal: #17191f;
    --panel: #22252d;
    --panel-2: #2b2f39;
    --muted: #aeb4c2;
    --line: rgba(255, 255, 255, .1);
    --white: #ffffff;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }

body {
    margin: 0;
    color: var(--white);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    background: #07080a;
}

button, select, input { font: inherit; }

button {
    min-height: 44px;
    border: 0;
    border-radius: 12px;
    color: #111;
    background: linear-gradient(135deg, var(--gold), var(--gold-2));
    font-weight: 950;
    cursor: pointer;
}

button.ghost, .ghost {
    color: var(--gold);
    background: rgba(255, 198, 41, .1);
    border: 1px solid rgba(255, 198, 41, .28);
}

.small { min-height: 36px; padding: 0 12px; }

.app-shell {
    min-height: 100vh;
    padding-bottom: 82px;
    background:
        radial-gradient(circle at 15% 0, rgba(255, 198, 41, .2), transparent 30%),
        radial-gradient(circle at 90% 12%, rgba(255, 255, 255, .08), transparent 28%),
        linear-gradient(180deg, #14161b 0%, #07080a 100%);
}

.topbar {
    position: sticky;
    top: 0;
    z-index: 10;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
    padding: 12px 16px;
    background: rgba(7, 8, 10, .82);
    border-bottom: 1px solid var(--line);
    backdrop-filter: blur(18px);
}

.brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--white);
    text-decoration: none;
}

.brand-logo {
    width: 48px;
    height: 48px;
    object-fit: cover;
    border: 2px solid var(--gold);
    border-radius: 14px;
    background: #000;
}

.brand strong,
.brand small { display: block; }
.brand strong { color: var(--gold); font-size: 1.2rem; letter-spacing: .03em; text-transform: uppercase; }
.brand small { color: var(--muted); font-size: .72rem; }

.top-actions { display: inline-flex; align-items: center; gap: 10px; }
.icon-btn { width: 40px; min-height: 40px; border-radius: 50%; }
.lite-toggle { display: inline-flex; align-items: center; gap: 8px; color: var(--gold); font-weight: 850; }
.lite-toggle input { accent-color: var(--gold); }

main {
    width: min(1120px, 100%);
    margin: 0 auto;
    padding: 16px;
}

.view { display: none; gap: 16px; }
.view.active { display: grid; }

.auth-mode .topbar,
.auth-mode .bottom-nav { display: none; }

.auth-gateway {
    min-height: calc(100vh - 32px);
    display: grid;
    align-content: center;
    gap: 14px;
    width: min(500px, 100%);
    margin: 0 auto;
    padding: 22px;
    border: 1px solid rgba(255, 198, 41, .22);
    border-radius: 24px;
    background:
        linear-gradient(145deg, rgba(255, 198, 41, .14), rgba(255, 255, 255, .04)),
        #111319;
    box-shadow: 0 28px 80px rgba(0, 0, 0, .38);
}

.auth-logo {
    width: 74px;
    height: 74px;
    object-fit: cover;
    border: 2px solid var(--gold);
    border-radius: 22px;
    background: #000;
}

.auth-gateway h1 {
    max-width: 12ch;
    margin-bottom: 0;
    font-size: clamp(2rem, 10vw, 3.45rem);
}

.sandbox-bypass {
    width: 100%;
    min-height: 50px;
    padding: 0 14px;
    border: 1px solid rgba(255, 198, 41, .5);
    box-shadow: 0 18px 36px rgba(245, 158, 11, .18);
}

.auth-tabs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.auth-form {
    display: none !important;
    grid-template-columns: 1fr;
    gap: 13px;
}

.auth-form.active { display: grid !important; }

.auth-form label,
.phone-row label,
.withdrawal-panel label {
    display: grid;
    gap: 7px;
}

.auth-form label span,
.phone-row label span,
.withdrawal-panel label span {
    color: var(--muted);
    font-size: .82rem;
    font-weight: 850;
}

.auth-form input,
.auth-form select {
    display: block;
    width: 100%;
    min-height: 48px;
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 0 14px;
    color: var(--white);
    background: rgba(255, 255, 255, .07);
}

.password-control {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: rgba(255, 255, 255, .07);
    overflow: hidden;
}

.password-control input {
    border: 0;
    background: transparent;
}

.password-control button {
    min-height: 46px;
    padding: 0 14px;
    border-radius: 0;
    color: var(--gold);
    background: transparent;
    font-size: .82rem;
    font-weight: 950;
}

.phone-row {
    display: grid;
    grid-template-columns: minmax(104px, .35fr) 1fr;
    gap: 10px;
}

@media (max-width: 430px) {
    main { padding: 10px; }
    .auth-gateway {
        min-height: calc(100vh - 20px);
        padding: 18px;
        gap: 11px;
        border-radius: 18px;
    }
    .auth-logo {
        width: 62px;
        height: 62px;
        border-radius: 18px;
    }
    .auth-tabs,
    .phone-row {
        grid-template-columns: 1fr;
    }
    .auth-form input,
    .auth-form select {
        min-height: 46px;
    }
}

.auth-message {
    min-height: 20px;
    margin: 0;
    color: var(--gold);
    font-weight: 800;
}

.auth-message.error { color: #ff6b6b; }

.hero-panel,
.agent-section,
.board-section,
.wallet-deep-card,
.rail-grid article,
.profile-hero,
.challenge-card,
.notice-stack article {
    border: 1px solid var(--line);
    border-radius: 22px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .03)),
        var(--charcoal);
    box-shadow: 0 24px 60px rgba(0, 0, 0, .24);
}

.hero-panel {
    display: grid;
    gap: 14px;
    padding: 18px;
    overflow: hidden;
    position: relative;
}

.view[data-view="home"] {
    gap: 12px;
}

.view[data-view="home"] .hero-panel {
    min-height: 0;
}

.view[data-view="home"] .hero-panel h1 {
    max-width: 620px;
    font-size: clamp(1.65rem, 6vw, 3.25rem);
    line-height: 1.04;
}

.view[data-view="home"] .hero-copy {
    max-width: 620px;
    margin-bottom: 0;
}

.home-wallet-card {
    min-height: 0;
}

.hero-panel::after {
    content: "";
    position: absolute;
    right: -90px;
    top: -80px;
    width: 220px;
    height: 220px;
    border: 18px solid rgba(255, 198, 41, .16);
    transform: rotate(18deg);
}

.eyebrow {
    margin: 0 0 8px;
    color: var(--gold);
    font-size: .75rem;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

h1, h2, p { margin-top: 0; }
h1 { margin-bottom: 10px; font-size: clamp(1.85rem, 10vw, 4.2rem); line-height: .98; letter-spacing: 0; }
h2 { margin-bottom: 8px; font-size: 1.35rem; }

.hero-copy,
.game-card p,
.agent-section p,
.challenge-card p,
.wallet-deep-card p {
    color: var(--muted);
    line-height: 1.55;
}

.hero-actions,
.wallet-actions,
.quick-grid,
.agent-list,
.profile-strip,
.tier-row,
.filter-bar,
.rail-grid,
.notice-stack {
    display: grid;
    gap: 12px;
}

.hero-actions,
.wallet-actions {
    grid-template-columns: 1fr 1fr;
}

.wallet-card,
.game-card,
.metric-card,
.fixture-card {
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: var(--panel);
}

.wallet-card {
    display: grid;
    gap: 6px;
    border-color: rgba(255, 198, 41, .28);
    background: linear-gradient(145deg, rgba(255, 198, 41, .18), rgba(255, 255, 255, .05));
}

.wallet-card span,
.wallet-card small,
.fixture-card small,
.fixture-card span,
.profile-strip span,
.notice-stack span {
    color: var(--muted);
}

.wallet-card strong,
.wallet-deep-card strong,
.metric-card strong,
.profile-strip strong {
    color: var(--gold);
    font-size: 2.35rem;
    line-height: 1;
}

.ticker {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    overflow: hidden;
    padding: 10px 14px;
    border: 1px solid rgba(255, 198, 41, .2);
    border-radius: 999px;
    background: rgba(255, 198, 41, .08);
}

.ticker span {
    position: relative;
    z-index: 2;
    color: #111;
    background: var(--gold);
    border-radius: 999px;
    padding: 4px 9px;
    font-size: .72rem;
    font-weight: 950;
}

.ticker-track {
    min-width: 0;
    overflow: hidden;
}

.ticker p {
    margin: 0;
    display: inline-block;
    min-width: max-content;
    padding-left: 100%;
    width: max-content;
    color: #f7f2d8;
    white-space: nowrap;
    animation: ticker 22s linear infinite;
    will-change: transform;
}

@keyframes ticker {
    from { transform: translateX(0); }
    to { transform: translateX(-100%); }
}

.quick-grid { grid-template-columns: repeat(3, 1fr); }
.compact-stats-card {
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: rgba(255, 255, 255, .055);
}
.compact-stats-card .metric-card {
    padding: 10px 8px;
    border: 0;
    border-right: 1px solid rgba(255, 255, 255, .12);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}
.compact-stats-card .metric-card:last-child { border-right: 0; }
.metric-card { text-align: center; }
.metric-card strong { display: block; font-size: 1.55rem; }
.metric-card span { color: var(--muted); font-size: .8rem; }

.queue-stack,
.fixture-list,
.game-grid {
    display: grid;
    gap: 12px;
}

.queue-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto auto;
    gap: 10px;
    align-items: center;
    padding: 12px;
    color: var(--white);
    background: var(--panel-2);
    text-align: left;
}

.queue-row span {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.queue-row strong { color: var(--gold); }
.queue-row small { color: var(--muted); }
.queue-row b {
    min-width: 58px;
    padding: 8px 12px;
    border-radius: 10px;
    color: #111;
    background: var(--gold);
    font-size: .78rem;
    text-align: center;
}

.queue-filter {
    display: grid;
    gap: 4px;
    min-width: 118px;
}

.queue-filter span {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
}

.queue-filter select {
    min-height: 36px;
    padding: 0 32px 0 12px;
    border: 1px solid rgba(255, 198, 41, .28);
    border-radius: 12px;
    color: var(--gold);
    background: rgba(255, 198, 41, .1);
    font-size: .82rem;
    font-weight: 950;
}

.empty-queue {
    padding: 14px;
    border: 1px dashed rgba(255, 198, 41, .3);
    border-radius: 12px;
    color: var(--muted);
    background: rgba(255, 255, 255, .04);
}

.section-title {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: end;
}

.page-title {
    padding: 8px 2px;
}

.arcade-title h1 {
    margin-bottom: 6px;
    font-size: clamp(2rem, 9vw, 3.4rem);
}

.arcade-title p:last-child {
    color: var(--muted);
    font-size: .98rem;
    font-weight: 750;
    line-height: 1.35;
}

.arcade-screen { display: none; gap: 12px; }
.arcade-screen.active { display: grid; }

.game-card {
    display: grid;
    gap: 10px;
}

.gold-card { background: linear-gradient(145deg, rgba(255, 198, 41, .18), var(--panel)); }

.capacity-copy {
    width: max-content;
    padding: 5px 9px;
    border-radius: 999px;
    color: var(--gold);
    background: rgba(255, 198, 41, .09);
    font-weight: 850;
    font-size: .76rem;
}

.game-action-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.game-action-row button {
    min-height: 42px;
    padding: 0 10px;
    border-radius: 11px;
    font-size: .82rem;
    text-transform: uppercase;
}

.arcade-game-grid {
    grid-template-columns: 1fr;
}

.arcade-game-card {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(92px, .5fr);
    gap: 12px;
    overflow: hidden;
    padding: 14px;
    border: 1px solid rgba(255, 198, 41, .22);
    border-radius: 18px;
    background:
        radial-gradient(circle at 80% 30%, rgba(255, 198, 41, .16), transparent 28%),
        linear-gradient(145deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .025)),
        #15161a;
}

.arcade-game-copy {
    display: grid;
    align-content: start;
    gap: 6px;
    z-index: 1;
}

.arcade-game-copy h2 {
    margin: 0;
    font-size: 1.35rem;
}

.arcade-game-copy p {
    margin: 0;
    color: var(--muted);
    font-size: .82rem;
    line-height: 1.25;
}

.arcade-game-card .game-action-row {
    grid-column: 1 / -1;
}

.game-art {
    position: relative;
    min-height: 104px;
}

.game-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    margin-top: 2px;
}

.game-stats span {
    display: grid;
    gap: 2px;
    min-width: 0;
    padding: 7px 6px;
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 10px;
    color: var(--muted);
    background: rgba(0, 0, 0, .16);
    font-size: .64rem;
    line-height: 1.15;
    text-align: center;
}

.game-stats strong {
    color: var(--white);
    font-size: .9rem;
    line-height: 1;
}

.ludo-art::before {
    content: "";
    position: absolute;
    inset: 26px 4px 8px 6px;
    border-radius: 14px;
    background:
        linear-gradient(45deg, rgba(239, 68, 68, .8) 0 25%, rgba(34, 197, 94, .8) 25% 50%, rgba(59, 130, 246, .8) 50% 75%, rgba(234, 179, 8, .8) 75%),
        #1d1f25;
    transform: perspective(180px) rotateX(32deg) rotateZ(-8deg);
    box-shadow: 0 20px 40px rgba(0, 0, 0, .45), 0 0 35px rgba(255, 198, 41, .18);
}

.gold-die {
    position: absolute;
    left: 12px;
    top: 18px;
    z-index: 2;
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    border-radius: 13px;
    color: #111;
    background: linear-gradient(145deg, #ffe082, #c98911);
    font-size: 1.55rem;
    box-shadow: 0 14px 26px rgba(0, 0, 0, .38);
}

.gold-die.large { width: 70px; height: 70px; font-size: 2.15rem; }
.gold-die.small { left: 76px; top: 58px; width: 42px; height: 42px; font-size: 1.28rem; }

.peg {
    position: absolute;
    z-index: 3;
    width: 18px;
    height: 32px;
    border-radius: 999px 999px 10px 10px;
    box-shadow: 0 8px 14px rgba(0, 0, 0, .35);
}

.peg.red { right: 42px; top: 22px; background: linear-gradient(#ef4444, #991b1b); }
.peg.green { right: 10px; top: 34px; background: linear-gradient(#22c55e, #166534); }
.peg.blue { right: 18px; bottom: 22px; background: linear-gradient(#3b82f6, #1e40af); }
.peg.yellow { right: 58px; bottom: 28px; background: linear-gradient(#fde047, #ca8a04); }

.whot-art .card {
    position: absolute;
    top: 24px;
    width: 48px;
    height: 76px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    background: #f5f5f7;
    color: #111;
    font-weight: 950;
    font-size: 1.1rem;
    box-shadow: 0 16px 28px rgba(0, 0, 0, .32);
}

.whot-art .ace { left: 0; transform: rotate(-12deg); color: #111; }
.whot-art .two { left: 30px; transform: rotate(8deg); color: #dc2626; }
.whot-art .muscle {
    left: 60px;
    color: var(--gold);
    background: #111;
    border: 1px solid rgba(255, 198, 41, .5);
    transform: rotate(18deg);
}

.chips {
    position: absolute;
    right: 6px;
    bottom: 16px;
    width: 48px;
    height: 28px;
    border-radius: 50%;
    background: repeating-linear-gradient(180deg, #ffd65a 0 7px, #b7790f 7px 12px);
    box-shadow: 0 12px 20px rgba(0, 0, 0, .35);
}

.dice-art {
    display: grid;
    place-items: center;
}

.browse-hero {
    display: grid;
    grid-template-columns: 1fr 180px;
    gap: 12px;
    align-items: center;
}

.browse-hero h1 {
    font-size: clamp(2rem, 10vw, 3.4rem);
}

.browse-hero h1 span {
    color: var(--gold);
}

.game-art.compact { min-height: 116px; }

.browse-filters {
    display: grid;
    gap: 10px;
}

.browse-filters {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.browse-filters button {
    min-height: 64px;
    color: var(--white);
    background: #15161a;
    border: 1px solid rgba(255, 255, 255, .12);
}

.browse-filters button.active {
    color: #111;
    background: linear-gradient(135deg, var(--gold), var(--gold-2));
}

.browse-filters strong,
.browse-filters small {
    display: block;
}

.challenge-search {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    min-height: 58px;
    padding: 0 10px;
    border: 1px solid rgba(255, 198, 41, .5);
    border-radius: 14px;
    background: #111319;
}

.challenge-search span {
    color: var(--gold);
    font-size: 1.5rem;
}

.challenge-search input {
    border: 0;
    color: var(--white);
    background: transparent;
    min-height: 52px;
}

.challenge-search button {
    width: 48px;
    min-height: 44px;
    color: var(--gold);
    background: transparent;
    border-left: 1px solid rgba(255, 198, 41, .35);
    border-radius: 0;
}

.challenge-card-list {
    display: grid;
    gap: 12px;
}

.browse-challenge-card,
.create-own-card {
    border: 1px solid rgba(255, 198, 41, .45);
    border-radius: 18px;
    background: #101317;
}

.browse-challenge-card {
    overflow: hidden;
}

.challenge-main-row,
.challenge-bottom-row {
    display: grid;
    gap: 10px;
    align-items: center;
    padding: 14px;
}

.challenge-main-row {
    grid-template-columns: 64px 1fr auto;
}

.challenge-main-row b {
    grid-column: 3;
    font-size: 1.8rem;
}

.browse-avatar {
    display: grid;
    place-items: center;
    width: 58px;
    height: 58px;
    border-radius: 16px;
    color: #111;
    background: var(--gold);
    font-weight: 950;
    font-size: 1.35rem;
}

.challenge-main-row strong,
.challenge-main-row small,
.challenge-main-row em {
    display: block;
}

.challenge-main-row small {
    color: var(--muted);
}

.challenge-main-row em {
    width: max-content;
    margin-top: 8px;
    padding: 5px 10px;
    border-radius: 10px;
    background: rgba(255, 255, 255, .07);
    color: #e5e7eb;
    font-style: normal;
}

.challenge-status {
    justify-self: end;
    padding: 8px 12px;
    border-radius: 10px;
    font-weight: 950;
}

.challenge-status.live { color: #4ade80; background: rgba(34, 197, 94, .16); border: 1px solid rgba(34, 197, 94, .45); }
.challenge-status.waiting { color: #93c5fd; background: rgba(59, 130, 246, .12); border: 1px solid rgba(59, 130, 246, .35); }
.challenge-status.upcoming { color: #c084fc; background: rgba(168, 85, 247, .12); border: 1px solid rgba(168, 85, 247, .35); }

.challenge-bottom-row {
    grid-template-columns: 1fr 1fr auto;
    border-top: 1px solid rgba(255, 198, 41, .22);
}

.challenge-bottom-row span {
    color: var(--muted);
}

.challenge-bottom-row strong {
    color: var(--white);
}

.challenge-bottom-row button {
    min-width: 112px;
}

.create-own-card {
    display: grid;
    grid-template-columns: 54px 1fr auto;
    gap: 12px;
    align-items: center;
    min-height: 86px;
    padding: 12px;
    color: var(--white);
    background: #101317;
    text-align: left;
}

.create-own-card span,
.create-own-card em {
    color: var(--gold);
    font-size: 2rem;
    font-style: normal;
}

.create-own-card strong,
.create-own-card small {
    display: block;
}

.create-own-card small {
    color: var(--muted);
}

.arcade-create-modal {
    position: fixed;
    inset: 0;
    z-index: 65;
    display: grid;
    place-items: center;
    padding: 18px;
    background: rgba(0, 0, 0, .72);
    backdrop-filter: blur(10px);
}

.arcade-create-modal[hidden] { display: none; }

.arcade-create-card {
    position: relative;
    display: grid;
    gap: 14px;
    width: min(760px, 100%);
    max-height: 92vh;
    overflow: auto;
    padding: 22px;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 22px;
    background: #17191f;
}

.modal-x {
    position: absolute;
    right: 16px;
    top: 14px;
    width: 40px;
    min-height: 40px;
    color: #e5e7eb;
    background: transparent;
    font-size: 2rem;
}

.arcade-create-card h2 {
    margin: 0;
    text-align: center;
    font-size: 2rem;
}

.create-section,
.challenge-summary {
    display: grid;
    gap: 12px;
    padding: 16px;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 16px;
    background: rgba(255, 255, 255, .035);
}

.create-section h3,
.challenge-summary h3 {
    margin: 0;
}

.stake-input {
    display: grid;
    grid-template-columns: 1fr 130px;
    gap: 8px;
}

.stake-input input,
.stake-input select {
    min-height: 56px;
    padding: 0 14px;
    border: 1px solid rgba(255, 198, 41, .42);
    border-radius: 12px;
    color: var(--gold);
    background: #111319;
    font-size: 1.35rem;
    font-weight: 950;
}

.mode-grid,
.type-grid,
.submode-tabs {
    display: grid;
    gap: 10px;
}

.mode-grid {
    grid-template-columns: repeat(3, 1fr);
}

.type-grid {
    grid-template-columns: 1fr 1fr;
}

.submode-tabs {
    grid-template-columns: repeat(3, 1fr);
}

.mode-grid button,
.type-grid button,
.submode-tabs button {
    display: grid;
    gap: 7px;
    min-height: 86px;
    padding: 10px;
    color: #d7d8df;
    background: #111319;
    border: 1px solid rgba(255, 255, 255, .12);
}

.mode-grid button.active,
.type-grid button.active,
.submode-tabs button.active {
    color: var(--gold);
    border-color: rgba(255, 198, 41, .75);
    background: rgba(255, 198, 41, .08);
}

.mode-grid span,
.type-grid span {
    color: #c9ccd5;
    font-size: .82rem;
    font-weight: 650;
    line-height: 1.3;
}

#durationSlider {
    width: 100%;
    accent-color: var(--gold);
}

.duration-marks,
.challenge-summary div {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
}

.duration-marks span,
.challenge-summary span {
    color: var(--muted);
}

.challenge-summary strong {
    color: var(--white);
}

.game-icon {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    color: #111;
    background: var(--gold);
    border-radius: 14px;
    font-weight: 950;
}

.tier-row,
.filter-bar { grid-template-columns: repeat(3, 1fr); }

.privacy-panel {
    display: grid;
    gap: 10px;
    padding: 12px;
    border: 1px solid rgba(255, 198, 41, .2);
    border-radius: 18px;
    background: rgba(255, 198, 41, .07);
}

.privacy-panel label {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px;
    border-radius: 12px;
    background: rgba(255, 255, 255, .05);
}

.privacy-panel input { accent-color: var(--gold); }
.privacy-panel span { display: grid; gap: 3px; color: var(--white); font-weight: 900; }
.privacy-panel small { color: var(--muted); font-weight: 700; }

.challenge-launch-note {
    margin: 0;
    padding: 12px;
    border: 1px solid rgba(255, 198, 41, .25);
    border-radius: 14px;
    color: #f7f2d8;
    background: rgba(255, 198, 41, .07);
    font-size: .9rem;
    line-height: 1.45;
}

.filter-bar button {
    color: var(--muted);
    background: var(--panel);
}

.filter-bar .active {
    color: #111;
    background: var(--gold);
}

.fixture-card {
    display: grid;
    gap: 14px;
}

.fixture-card strong { display: block; }
.duel-stack { display: grid; gap: 8px; }
.duel-stack span { padding: 10px; border-radius: 10px; background: rgba(255, 255, 255, .05); }

.football-flow {
    display: none;
    gap: 16px;
}

.football-flow.active {
    display: grid;
}

.football-hero,
.football-page-head,
.football-panel,
.take-step-card {
    border: 1px solid var(--line);
    border-radius: 22px;
    background:
        radial-gradient(circle at 82% 12%, rgba(255, 198, 41, .16), transparent 28%),
        linear-gradient(145deg, rgba(255, 255, 255, .075), rgba(255, 255, 255, .025)),
        var(--charcoal);
    box-shadow: 0 24px 60px rgba(0, 0, 0, .24);
}

.football-hero {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 12px;
    align-items: center;
    padding: 18px;
}

.football-hero h1,
.football-page-head h1 {
    margin-bottom: 6px;
}

.football-hero p,
.football-page-head p {
    margin: 0;
    color: var(--muted);
    line-height: 1.45;
}

.football-page-head {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 12px;
    align-items: center;
    padding: 16px;
}

.football-page-head h1 span {
    color: var(--gold);
}

.football-back {
    width: 44px;
    min-height: 44px;
    border-radius: 50%;
    color: var(--gold);
    background: rgba(255, 198, 41, .08);
    border: 1px solid rgba(255, 198, 41, .28);
}

.football-ball {
    display: grid;
    place-items: center;
    width: 76px;
    height: 76px;
    border-radius: 50%;
    background: rgba(255, 198, 41, .1);
    font-size: 2.4rem;
}

.football-board-card {
    border-color: rgba(255, 198, 41, .26);
}

.football-board-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.football-panel,
.take-step-card {
    display: grid;
    gap: 14px;
    padding: 16px;
}

.football-section-title {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    padding-bottom: 8px;
    border-bottom: 1px solid rgba(255, 255, 255, .09);
}

.football-section-title.compact {
    padding-bottom: 0;
    border-bottom: 0;
}

.football-section-title strong {
    text-transform: uppercase;
    letter-spacing: .04em;
}

.football-section-title span,
.inline-link {
    color: var(--gold);
    font-size: .86rem;
    font-weight: 950;
}

.inline-link {
    min-height: auto;
    padding: 0;
    background: transparent;
}

.fixture-versus-card {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 12px;
    align-items: center;
    padding: 14px;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 16px;
    background: rgba(255, 255, 255, .035);
}

.fixture-team {
    display: grid;
    justify-items: center;
    gap: 8px;
    text-align: center;
}

.team-badge {
    display: grid;
    place-items: center;
    width: 58px;
    height: 58px;
    border-radius: 50%;
    color: #fff;
    border: 2px solid rgba(255, 255, 255, .55);
    font-size: .9rem;
    font-weight: 950;
}

.team-badge.arsenal {
    background: linear-gradient(145deg, #ef4444, #7f1d1d);
}

.team-badge.chelsea {
    background: linear-gradient(145deg, #2563eb, #172554);
}

.versus-text {
    color: var(--gold);
    font-weight: 950;
}

.fixture-meta {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    color: #e9e3cc;
    font-weight: 800;
}

.football-market-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
}

.football-market-card,
.football-option,
.player-chip,
.payment-method {
    color: var(--white);
    background: rgba(255, 255, 255, .035);
    border: 1px solid rgba(255, 255, 255, .12);
}

.football-market-card {
    display: grid;
    gap: 7px;
    align-content: center;
    min-height: 132px;
    padding: 12px;
    text-align: center;
}

.football-market-card span {
    color: var(--gold);
    font-size: 1.65rem;
    font-weight: 950;
}

.football-market-card small,
.football-option small {
    color: var(--muted);
    line-height: 1.35;
}

.football-market-card.active,
.football-option.active,
.player-chip.active,
.payment-method.active {
    border-color: rgba(255, 198, 41, .78);
    background: rgba(255, 198, 41, .09);
    box-shadow: inset 0 0 0 1px rgba(255, 198, 41, .16);
}

.football-option-grid {
    display: grid;
    gap: 10px;
}

.football-option-grid.two {
    grid-template-columns: 1fr 1fr;
}

.football-option {
    display: grid;
    gap: 5px;
    align-items: center;
    min-height: 58px;
    padding: 10px;
    text-align: left;
}

.football-option .team-badge {
    width: 34px;
    height: 34px;
    font-size: .62rem;
}

.football-option .team-badge + strong {
    display: inline-block;
}

.football-info,
.secure-note {
    padding: 12px;
    border: 1px solid rgba(255, 198, 41, .26);
    border-radius: 12px;
    color: #f8e7ad;
    background: rgba(255, 198, 41, .07);
    line-height: 1.45;
}

.football-field {
    display: grid;
    gap: 8px;
    color: var(--muted);
    font-weight: 850;
}

.football-field input,
.currency-field input,
.currency-field select,
.custom-odds-box input,
.score-picker input {
    width: 100%;
    min-height: 52px;
    padding: 0 12px;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 12px;
    color: var(--white);
    background: #111319;
}

.currency-field {
    display: grid;
    grid-template-columns: 1fr 104px;
    gap: 8px;
}

.custom-odds-box {
    display: grid;
    grid-template-columns: 1fr 1fr auto;
    gap: 10px;
    align-items: end;
    padding: 12px;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 14px;
    background: rgba(0, 0, 0, .2);
}

.custom-odds-box label,
.custom-odds-box div {
    display: grid;
    gap: 6px;
    color: var(--muted);
    font-size: .78rem;
    font-weight: 850;
}

.custom-odds-box strong {
    color: var(--gold);
    font-size: 1.6rem;
}

.custom-odds-box .potential-row {
    grid-column: 1 / -1;
    grid-template-columns: 1fr auto;
    align-items: center;
}

.custom-odds-box .potential-row strong,
.detail-row-list span strong:last-child,
.football-summary-grid span strong:last-child {
    color: #4ade80;
}

.score-picker {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.score-picker label {
    display: grid;
    gap: 8px;
    color: var(--muted);
    font-weight: 850;
}

.pool-info-grid {
    display: grid;
    grid-template-columns: .8fr .8fr 1fr;
    gap: 10px;
    padding: 12px;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 14px;
    color: var(--muted);
    background: rgba(255, 255, 255, .04);
}

.pool-info-grid strong {
    color: #4ade80;
}

.player-chip-row {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
}

.player-chip {
    display: grid;
    justify-items: center;
    gap: 4px;
    min-height: 92px;
    padding: 9px;
}

.player-chip span,
.creator-avatar {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    color: #111;
    background: var(--gold);
    font-weight: 950;
}

.player-chip small {
    color: var(--muted);
}

.invite-link-button {
    justify-self: stretch;
}

.football-summary-grid,
.detail-row-list {
    display: grid;
    gap: 0;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 14px;
}

.football-summary-grid {
    grid-template-columns: repeat(2, 1fr);
}

.football-summary-grid span,
.detail-row-list span {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 11px 12px;
    border-bottom: 1px solid rgba(255, 255, 255, .08);
    color: var(--muted);
    font-size: .88rem;
}

.football-summary-grid span {
    display: grid;
}

.football-summary-grid strong,
.detail-row-list strong {
    color: var(--white);
}

.football-action-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.football-action-row button {
    min-height: 56px;
    text-transform: uppercase;
}

.take-progress {
    display: grid;
    grid-template-columns: repeat(9, 1fr);
    gap: 5px;
}

.take-progress span {
    height: 5px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .14);
}

.take-progress span.active,
.take-progress span.done {
    background: var(--gold);
}

.creator-card {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 14px;
    align-items: center;
    padding: 12px;
    border: 1px solid rgba(255, 198, 41, .2);
    border-radius: 14px;
    background: rgba(255, 198, 41, .06);
}

.creator-card strong,
.creator-card small,
.creator-card span {
    display: block;
}

.creator-card small {
    color: var(--gold);
}

.creator-card span {
    color: var(--muted);
}

.creator-card b {
    float: right;
    color: #4ade80;
}

.your-side-card,
.final-confirm,
.success-panel {
    display: grid;
    justify-items: center;
    gap: 12px;
    padding: 18px;
    border: 1px solid rgba(255, 198, 41, .5);
    border-radius: 18px;
    background: radial-gradient(circle at 50% 0, rgba(255, 198, 41, .18), rgba(255, 255, 255, .035));
    text-align: center;
}

.your-side-card span {
    color: var(--muted);
}

.your-side-card strong {
    color: var(--gold);
    font-size: 1.8rem;
}

.rule-stack,
.payment-method-list {
    display: grid;
    gap: 10px;
}

.rule-stack span,
.confirm-row {
    padding: 12px;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 12px;
    color: #e5e7eb;
    background: rgba(255, 255, 255, .04);
}

.confirm-row {
    display: flex;
    gap: 10px;
    align-items: center;
    text-align: left;
}

.confirm-row input {
    accent-color: var(--gold);
}

.payment-method {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 4px;
    min-height: 64px;
    padding: 12px;
    text-align: left;
}

.payment-method strong,
.payment-method small {
    display: block;
}

.payment-method small {
    color: var(--muted);
}

.payment-method span {
    grid-row: 1 / span 2;
    grid-column: 2;
    width: 18px;
    height: 18px;
    border: 1px solid var(--muted);
    border-radius: 50%;
}

.payment-method.active span {
    border-color: var(--gold);
    background: var(--gold);
    box-shadow: inset 0 0 0 4px #111319;
}

.shield-illustration,
.success-ball {
    display: grid;
    place-items: center;
    width: 104px;
    height: 104px;
    border-radius: 50%;
    color: var(--gold);
    background: rgba(255, 198, 41, .08);
    font-size: 4rem;
}

.success-panel h2 {
    color: #4ade80;
}

.wallet-deep-card,
.rail-grid article,
.challenge-card,
.withdrawal-panel,
.transaction-history {
    padding: 18px;
}

.wallet-deep-card strong {
    display: block;
    margin: 4px 0;
    font-size: 2.65rem;
}

.wallet-action-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.wallet-action-row button {
    min-height: 64px;
    padding: 0 10px;
    border-radius: 12px;
    font-size: 1.05rem;
}

.wallet-flow {
    display: none;
    gap: 16px;
}

.wallet-flow.active {
    display: grid;
}

.wallet-back {
    justify-self: start;
    min-height: 48px;
    padding: 0 18px;
    color: #d8d8df;
    background: var(--panel-2);
}

.wallet-method-panel,
.crypto-deposit-panel,
.agent-withdraw-panel {
    display: grid;
    gap: 16px;
    padding: 22px;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: linear-gradient(145deg, rgba(255, 255, 255, .075), rgba(255, 255, 255, .025)), var(--charcoal);
}

.wallet-method-panel h2,
.crypto-deposit-panel h2,
.agent-withdraw-panel h2 {
    margin-bottom: 0;
    font-size: 1.75rem;
}

.deposit-helper {
    margin: 0;
    color: var(--muted);
    line-height: 1.45;
}

.wallet-method-card {
    display: grid;
    gap: 16px;
    padding: 18px;
    border: 1px solid rgba(255, 255, 255, .13);
    border-radius: 18px;
    background: rgba(255, 255, 255, .035);
}

.wallet-method-card h3 {
    margin: 0;
    font-size: 1.55rem;
}

.wallet-method-card p {
    margin: 0;
    color: #e5e7eb;
    line-height: 1.45;
}

.token-row,
.method-title-row,
.resend-row {
    display: flex;
    gap: 10px;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}

.token-row span,
.method-title-row span {
    color: #e5e7eb;
    font-weight: 900;
}

.deposit-amount {
    color: var(--white);
    font-size: 2.45rem;
    text-align: center;
}

.deposit-amount span {
    color: var(--muted);
    font-size: 1rem;
}

.wallet-warning {
    padding: 16px;
    border: 2px solid rgba(255, 198, 41, .7);
    border-radius: 14px;
    color: #fff7dc;
    background: rgba(120, 83, 10, .56);
}

.wallet-warning p {
    margin: 8px 0 0;
    line-height: 1.4;
}

.crypto-withdraw-modal {
    position: fixed;
    inset: 0;
    z-index: 60;
    display: grid;
    place-items: center;
    padding: 18px;
    background: rgba(0, 0, 0, .72);
    backdrop-filter: blur(10px);
}

.crypto-withdraw-modal[hidden] { display: none; }

.crypto-withdraw-card {
    position: relative;
    display: grid;
    gap: 14px;
    width: min(620px, 100%);
    padding: 22px;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 22px;
    background: #1a1a1e;
}

.crypto-withdraw-card h2 {
    margin: 0;
    font-size: 2rem;
}

.crypto-withdraw-card label,
.agent-withdraw-panel label,
.deposit-amount-field {
    display: grid;
    gap: 8px;
    color: var(--muted);
    font-weight: 850;
}

.crypto-withdraw-card input,
.crypto-withdraw-card select,
.agent-withdraw-panel input,
.deposit-amount-field input,
.deposit-amount-field select,
.agent-search-field {
    width: 100%;
    min-height: 54px;
    padding: 0 14px;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 12px;
    color: var(--white);
    background: #111319;
}

.nowpayments-panel {
    max-width: 760px;
    margin-inline: auto;
}

.nowpayments-summary {
    display: grid;
    gap: 8px;
    padding: 16px;
    border: 1px solid rgba(255, 198, 41, .3);
    border-radius: 16px;
    background: rgba(255, 184, 0, .08);
}

.nowpayments-summary span {
    color: #f8d996;
    font-size: .8rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.nowpayments-summary strong {
    color: var(--gold);
    font-size: clamp(2rem, 7vw, 3.2rem);
    line-height: 1;
}

.nowpayments-summary small {
    color: #f4f4f5;
    line-height: 1.4;
}

.crypto-withdraw-card small {
    color: var(--muted);
    font-size: .95rem;
}

.address-input div,
.agent-search-field {
    display: grid;
    grid-template-columns: 1fr auto auto;
    gap: 8px;
    align-items: center;
}

.address-input input,
.agent-search-field select {
    border: 0;
    background: transparent;
    color: var(--white);
    min-height: 48px;
}

.address-input button {
    min-height: 44px;
    padding: 0 12px;
}

.fee-summary {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 10px;
    align-items: center;
    color: var(--white);
    font-size: 1.15rem;
    font-weight: 950;
    text-transform: uppercase;
}

.verify-toggle {
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding: 4px;
    border-radius: 14px;
    background: #111319;
}

.verify-toggle button {
    color: var(--muted);
    background: transparent;
}

.verify-toggle button.active {
    color: var(--white);
    background: rgba(255, 255, 255, .12);
}

.otp-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 8px;
}

.otp-grid input {
    height: 58px;
    padding: 0;
    text-align: center;
    font-size: 1.25rem;
    background: #5b5d66;
}

.resend-row {
    justify-content: end;
    color: var(--muted);
}

.security-footnote {
    margin: 0;
    color: #f7f2d8;
    font-style: italic;
}

.withdrawal-panel {
    display: grid;
    gap: 12px;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: linear-gradient(145deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .03)), var(--charcoal);
}

.withdrawal-panel label,
.otp-panel {
    display: grid;
    gap: 7px;
}

.withdrawal-panel label span {
    color: var(--muted);
    font-size: .82rem;
    font-weight: 850;
}

.withdrawal-panel select,
.withdrawal-panel input {
    width: 100%;
    min-height: 46px;
    padding: 0 12px;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 12px;
    color: var(--white);
    background: #111319;
}

.withdrawal-result {
    min-height: 22px;
    margin: 0;
    color: #fef3c7;
    line-height: 1.45;
}

.transaction-history {
    display: grid;
    gap: 12px;
    min-height: 360px;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: linear-gradient(145deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .03)), var(--charcoal);
}

.transaction-list {
    display: grid;
    gap: 10px;
    max-height: 58vh;
    overflow: auto;
    padding-right: 4px;
}

.transaction-search {
    display: grid;
    gap: 6px;
}

.transaction-search span {
    color: var(--muted);
    font-size: .78rem;
    font-weight: 850;
}

.transaction-search input {
    width: 100%;
    min-height: 46px;
    padding: 0 12px;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 12px;
    color: var(--white);
    background: #111319;
}

.wallet-page-title {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 520px);
    align-items: end;
    gap: 18px;
}

.wallet-page-title span {
    display: block;
    max-width: 540px;
    color: var(--muted);
    line-height: 1.45;
}

.wallet-identity-card,
.wallet-balance-card,
.transaction-filter-grid,
.receipt-grid {
    display: grid;
    gap: 12px;
}

.wallet-identity-card {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: rgba(255, 255, 255, .055);
}

.wallet-identity-card div,
.wallet-metric-grid span,
.receipt-grid article,
.receipt-summary {
    border: 1px solid var(--line);
    border-radius: 16px;
    background: rgba(0, 0, 0, .18);
}

.wallet-identity-card div {
    position: relative;
    display: grid;
    gap: 5px;
    padding: 12px;
}

.wallet-identity-card span,
.wallet-metric-grid span small,
.transaction-filter-grid label span,
.receipt-grid small {
    color: var(--muted);
    font-size: .75rem;
    font-weight: 850;
}

.wallet-identity-card strong {
    overflow-wrap: anywhere;
}

.wallet-identity-card button,
.copy-inline {
    width: max-content;
    padding: 4px 8px;
    border: 1px solid rgba(251, 191, 36, .45);
    border-radius: 8px;
    color: var(--gold);
    background: rgba(251, 191, 36, .08);
    font-size: .68rem;
    font-weight: 900;
}

.wallet-balance-card {
    grid-template-columns: minmax(0, 1.1fr) minmax(260px, .9fr);
}

.wallet-metric-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.wallet-metric-grid span {
    display: grid;
    place-items: center;
    gap: 8px;
    min-height: 84px;
    color: var(--muted);
    text-align: center;
}

.wallet-metric-grid strong {
    color: var(--white);
    font-size: 1.05rem;
}

.transaction-filter-grid {
    grid-template-columns: minmax(220px, 1.4fr) minmax(140px, .55fr) repeat(2, minmax(120px, .45fr));
}

.transaction-filter-grid label {
    display: grid;
    gap: 6px;
}

.transaction-filter-grid select,
.transaction-filter-grid input {
    width: 100%;
    min-height: 46px;
    padding: 0 12px;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 12px;
    color: var(--white);
    background: #111319;
}

.transaction-card {
    display: grid;
    grid-template-columns: 36px 1fr auto;
    align-items: center;
    gap: 10px;
    padding: 12px;
    border: 1px solid var(--line);
    border-left: 4px solid #22c55e;
    border-radius: 14px;
    background: rgba(255, 255, 255, .055);
    cursor: pointer;
    transition: transform .18s ease, border-color .18s ease;
}

.transaction-card.pending { border-left-color: var(--gold); }
.transaction-card.failed { border-left-color: #ef4444; }
.transaction-card.expired { border-left-color: #94a3b8; }
.transaction-card.underpaid_review { border-left-color: #f59e0b; }
.transaction-card:hover,
.transaction-card:focus-visible {
    transform: translateY(-1px);
    border-color: rgba(251, 191, 36, .42);
    outline: none;
}

.transaction-icon {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border-radius: 12px;
    background: rgba(255, 255, 255, .08);
}

.transaction-card strong,
.transaction-card span,
.transaction-card em {
    display: block;
}

.transaction-card strong { font-size: .95rem; }
.transaction-card span { color: var(--muted); font-size: .78rem; }
.transaction-card small {
    display: block;
    color: #cbd5e1;
    font-size: .74rem;
    line-height: 1.35;
    overflow-wrap: anywhere;
}
.transaction-card em {
    margin-top: 4px;
    color: var(--muted);
    font-size: .7rem;
    font-style: normal;
    font-weight: 950;
    letter-spacing: .04em;
}

.transaction-card b {
    white-space: nowrap;
    font-size: .92rem;
    text-align: right;
}

.transaction-card b.credit { color: #4ade80; }
.transaction-card b.debit { color: #e5e7eb; }
.transaction-card b.failed-amount { color: #fca5a5; }

.wallet-toast {
    position: fixed;
    left: 50%;
    bottom: 104px;
    z-index: 80;
    display: grid;
    min-width: min(360px, calc(100vw - 36px));
    max-width: 420px;
    gap: 4px;
    padding: 16px 46px 16px 18px;
    border: 1px solid rgba(34, 197, 94, .45);
    border-radius: 18px;
    color: #dcfce7;
    background: linear-gradient(145deg, rgba(20, 83, 45, .95), rgba(15, 23, 42, .96));
    box-shadow: 0 18px 50px rgba(0, 0, 0, .42);
    transform: translateX(-50%);
}

.wallet-toast strong { color: #86efac; }
.wallet-toast span { color: #ecfdf5; }
.wallet-toast button {
    position: absolute;
    top: 10px;
    right: 12px;
    width: 28px;
    height: 28px;
    border: 0;
    border-radius: 999px;
    color: #ecfdf5;
    background: rgba(255, 255, 255, .12);
}

.receipt-modal {
    width: min(960px, calc(100vw - 24px));
    max-height: min(90vh, 920px);
    overflow: auto;
    padding: 22px;
    border: 1px solid rgba(251, 191, 36, .25);
    border-radius: 24px;
    background: linear-gradient(145deg, #070b12, #111827);
    box-shadow: 0 30px 80px rgba(0, 0, 0, .55);
}

.receipt-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 300px);
    gap: 16px;
    align-items: start;
    margin-bottom: 16px;
}

.receipt-header h2 {
    margin: 0 0 8px;
    font-size: clamp(1.7rem, 4vw, 2.6rem);
}

.receipt-header p,
.receipt-summary p {
    margin: 0;
    color: var(--muted);
    line-height: 1.5;
}

.receipt-status {
    display: grid;
    gap: 6px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: rgba(255, 255, 255, .05);
}

.receipt-status.successful strong { color: #4ade80; }
.receipt-status.underpaid_review strong,
.receipt-status.pending strong { color: var(--gold); }
.receipt-status.failed strong { color: #fca5a5; }

.receipt-grid {
    grid-template-columns: minmax(220px, .6fr) minmax(0, 1.4fr);
}

.receipt-grid article,
.receipt-summary {
    padding: 16px;
}

.receipt-grid h3,
.receipt-summary h3 {
    margin: 0 0 12px;
    color: var(--gold);
}

.receipt-grid article > span {
    display: grid;
    grid-template-columns: minmax(120px, .65fr) minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    padding: 10px 0;
    border-bottom: 1px solid rgba(255, 255, 255, .08);
}

.receipt-grid article > span:last-child {
    border-bottom: 0;
}

.receipt-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 16px;
}

.receipt-actions button {
    min-height: 50px;
    border: 1px solid rgba(251, 191, 36, .5);
    border-radius: 14px;
    color: #09090b;
    background: linear-gradient(135deg, #facc15, #f59e0b);
    font-weight: 950;
}

.agent-disclaimer {
    display: grid;
    gap: 8px;
    padding: 16px;
    border: 2px solid rgba(239, 68, 68, .6);
    border-radius: 18px;
    color: #fee2e2;
    background: linear-gradient(145deg, rgba(127, 29, 29, .72), rgba(69, 10, 10, .88));
}

.agent-disclaimer strong { color: #fff; font-size: 1rem; }
.agent-disclaimer p { margin: 0; color: #fecaca; line-height: 1.5; }

.agent-tools {
    display: grid;
    gap: 12px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: var(--panel);
}

.agent-country-hub,
.agent-directory-view {
    display: grid;
    gap: 14px;
}

.agent-country-hub[hidden],
.agent-directory-view[hidden] { display: none; }

.country-grid {
    display: grid;
    gap: 10px;
}

.country-card {
    display: grid;
    gap: 5px;
    min-height: 68px;
    padding: 12px 14px;
    border: 1px solid rgba(255, 198, 41, .22);
    border-radius: 16px;
    color: var(--white);
    background: linear-gradient(145deg, rgba(255, 198, 41, .12), rgba(255, 255, 255, .04)), var(--panel);
    text-align: left;
}

.country-card strong {
    color: var(--gold);
    font-size: 1rem;
}

.country-card span {
    color: var(--muted);
    font-size: .82rem;
}

.agent-tools label {
    display: grid;
    gap: 7px;
    color: var(--muted);
    font-size: .82rem;
    font-weight: 850;
}

.agent-tools select,
.agent-tools input {
    width: 100%;
    min-height: 46px;
    padding: 0 12px;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 12px;
    color: var(--white);
    background: #111319;
}

.agent-card {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: var(--panel);
}

.agent-summary {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
    width: 100%;
    min-height: 74px;
    padding: 14px;
    color: var(--white);
    background: transparent;
    text-align: left;
}

.agent-summary strong,
.agent-summary small,
.agent-summary em { display: block; }
.agent-summary strong { color: var(--gold); font-size: 1.05rem; }
.agent-summary small { color: var(--muted); margin-top: 3px; }
.agent-summary em {
    color: #fef3c7;
    font-size: .84rem;
    font-style: normal;
    font-weight: 850;
}

.agent-details {
    display: none;
    gap: 14px;
    padding: 0 14px 14px;
}

.agent-card.open .agent-details { display: grid; }
.agent-details p { margin: 0; color: var(--muted); line-height: 1.55; }

.agent-meta {
    display: grid;
    gap: 8px;
}

.agent-meta span {
    padding: 9px 10px;
    border-radius: 10px;
    color: #f5f6fa;
    background: rgba(255, 255, 255, .05);
}

.agent-actions,
.vote-box {
    display: grid;
    gap: 10px;
}

.agent-actions a {
    min-height: 44px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    color: #111;
    font-weight: 950;
    text-decoration: none;
}

.telegram-link { background: #facc15; }
.whatsapp-link { background: #ef4444; color: #fff !important; }
.facebook-link { background: #60a5fa; }

.vote-box {
    padding: 12px;
    border: 1px solid rgba(255, 198, 41, .2);
    border-radius: 14px;
    background: rgba(255, 198, 41, .07);
}

.vote-box span { color: #fef3c7; font-weight: 900; }
.agent-vote:disabled {
    opacity: .48;
    cursor: not-allowed;
}

.profile-hero {
    display: flex;
    gap: 16px;
    align-items: center;
    padding: 18px;
}

.profile-hero img {
    width: 92px;
    height: 92px;
    object-fit: cover;
    border: 2px solid var(--gold);
    border-radius: 22px;
}

.profile-strip {
    grid-template-columns: repeat(3, 1fr);
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: var(--panel);
    text-align: center;
}

.profile-strip strong { display: block; font-size: 1.5rem; }

.profile-dashboard,
.profile-settings-card,
.admin-reset-panel {
    border: 1px solid var(--line);
    border-radius: 22px;
    background: linear-gradient(145deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .03)), var(--charcoal);
}

.profile-dashboard {
    display: flex;
    gap: 16px;
    align-items: center;
    padding: 18px;
}

.profile-dashboard img {
    width: 76px;
    height: 76px;
    object-fit: cover;
    border: 2px solid var(--gold);
    border-radius: 20px;
    background: #000;
}

.profile-dashboard h2 {
    margin: 0 0 4px;
    font-size: 1.7rem;
}

.profile-dashboard span {
    color: var(--muted);
    font-weight: 800;
}

.profile-settings-form,
.profile-settings-card,
.password-panel {
    display: grid;
    gap: 12px;
}

.profile-settings-card {
    padding: 18px;
}

.profile-settings-card label,
.password-panel label {
    display: grid;
    gap: 7px;
}

.profile-settings-card label span,
.password-panel label span {
    color: var(--muted);
    font-size: .82rem;
    font-weight: 850;
}

.profile-settings-card input,
.profile-settings-card select,
.profile-settings-card textarea,
.password-panel input {
    width: 100%;
    min-height: 48px;
    padding: 0 12px;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 12px;
    color: var(--white);
    background: #111319;
}

.profile-settings-card textarea {
    padding: 12px;
    resize: vertical;
}

.profile-settings-card input[readonly] {
    color: var(--muted);
    background: rgba(255, 255, 255, .045);
}

.settings-toggle {
    display: flex !important;
    justify-content: space-between;
    align-items: center;
    padding: 12px;
    border-radius: 12px;
    background: rgba(255, 255, 255, .05);
}

.settings-toggle input {
    width: 22px;
    min-height: 22px;
    accent-color: var(--gold);
}

.password-panel {
    padding: 12px;
    border: 1px solid rgba(255, 198, 41, .2);
    border-radius: 14px;
    background: rgba(255, 198, 41, .06);
}

.password-panel summary {
    cursor: pointer;
    color: var(--gold);
    font-weight: 950;
}

#saveProfileButton:disabled {
    opacity: .45;
    cursor: not-allowed;
}

.profile-save-status {
    min-height: 22px;
    margin: 0;
    color: #f7f2d8;
}

.profile-save-status.error {
    color: #ff6b6b;
}

.wallet-return-notice {
    margin: 0;
    padding: 12px 14px;
    border: 1px solid rgba(34, 197, 94, .35);
    border-radius: 12px;
    color: #dcfce7;
    background: rgba(22, 101, 52, .28);
    font-weight: 850;
}

.admin-reset-panel,
.dev-reset-form,
.dev-reset-form fieldset {
    display: grid;
    gap: 14px;
}

.admin-reset-panel {
    padding: 18px;
}

.admin-danger-banner {
    padding: 16px;
    border: 1px solid rgba(239, 68, 68, .55);
    border-radius: 16px;
    color: #fee2e2;
    background: rgba(127, 29, 29, .44);
}

.admin-danger-banner strong {
    display: block;
    margin-bottom: 6px;
    font-size: 1.05rem;
}

.admin-danger-banner p {
    margin: 0;
    line-height: 1.45;
}

.dev-reset-form fieldset {
    margin: 0;
    padding: 0;
    border: 0;
}

.dev-reset-form legend {
    margin-bottom: 4px;
    color: var(--gold);
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.dev-reset-form label {
    display: flex;
    gap: 10px;
    align-items: center;
    padding: 12px;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 12px;
    background: rgba(255, 255, 255, .045);
    font-weight: 850;
}

.dev-reset-form input[type="checkbox"] {
    width: 18px;
    height: 18px;
    accent-color: var(--gold);
}

.dev-reset-form .confirmation-field {
    display: grid;
    align-items: stretch;
}

.confirmation-field span {
    color: var(--muted);
    font-size: .82rem;
}

.confirmation-field input {
    width: 100%;
    min-height: 50px;
    padding: 0 12px;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 12px;
    color: var(--white);
    background: #111319;
}

#devResetSubmit:disabled {
    opacity: .45;
    cursor: not-allowed;
}

.danger-modal {
    border-color: rgba(239, 68, 68, .55);
    background: linear-gradient(145deg, rgba(127, 29, 29, .42), rgba(255, 255, 255, .06)), var(--charcoal);
}

.payments-debug-panel {
    margin-top: 18px;
}

.payments-debug-list {
    display: grid;
    gap: 12px;
}

.debug-payment-card {
    display: grid;
    gap: 6px;
    padding: 14px;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 14px;
    background: rgba(255, 255, 255, .045);
}

.debug-payment-card strong {
    color: var(--white);
}

.debug-payment-card span {
    color: var(--muted);
    font-size: .86rem;
    overflow-wrap: anywhere;
}

.debug-payment-card.webhook-event {
    border-color: rgba(255, 198, 41, .28);
}

.debug-error {
    color: #ff6b6b !important;
}

.notice-stack article {
    display: grid;
    gap: 6px;
    padding: 16px;
}

.bottom-nav {
    position: fixed;
    right: 12px;
    bottom: 12px;
    left: 12px;
    z-index: 20;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
    gap: 4px;
    padding: 8px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: rgba(17, 18, 23, .94);
    backdrop-filter: blur(18px);
}

.bottom-nav a {
    color: var(--muted);
    font-size: .76rem;
    font-weight: 850;
    text-align: center;
    text-decoration: none;
    padding: 10px 4px;
    border-radius: 12px;
}

.bottom-nav a.active {
    color: #111;
    background: var(--gold);
}

.share-modal {
    position: fixed;
    inset: 0;
    z-index: 50;
    display: grid;
    place-items: center;
    padding: 16px;
    background: rgba(0, 0, 0, .68);
    backdrop-filter: blur(10px);
}

.share-modal[hidden] { display: none; }

.share-card {
    position: relative;
    display: grid;
    gap: 12px;
    width: min(460px, 100%);
    padding: 22px;
    border: 1px solid rgba(255, 198, 41, .32);
    border-radius: 22px;
    background: linear-gradient(145deg, rgba(255, 198, 41, .14), rgba(255, 255, 255, .06)), var(--charcoal);
    box-shadow: 0 30px 90px rgba(0, 0, 0, .45);
}

.share-card p { color: var(--muted); margin: 0; }
.share-card input {
    width: 100%;
    min-height: 46px;
    padding: 0 12px;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 12px;
    color: var(--white);
    background: #111319;
}

.share-actions {
    display: grid;
    gap: 10px;
}

.share-close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 34px;
    min-height: 34px;
    border-radius: 50%;
}

body.lite-mode {
    color: #1a1a1e;
    background: #f4f6f8;
}

body.lite-mode .app-shell {
    background:
        radial-gradient(circle at 8% 0, rgba(255, 184, 0, .12), transparent 30%),
        linear-gradient(180deg, #fafafa 0%, #f4f6f8 100%);
}
body.lite-mode .brand-logo { width: 40px; height: 40px; }

body.lite-mode .topbar {
    background: rgba(255, 255, 255, .92);
    border-bottom: 1px solid #e5e7eb;
    box-shadow: 0 8px 22px rgba(15, 23, 42, .06);
}

body.lite-mode .bottom-nav {
    background: rgba(255, 255, 255, .96);
    border: 1px solid #e5e7eb;
    box-shadow: 0 -8px 24px rgba(15, 23, 42, .08);
}

body.lite-mode .hero-panel,
body.lite-mode .agent-section,
body.lite-mode .board-section,
body.lite-mode .wallet-deep-card,
body.lite-mode .rail-grid article,
body.lite-mode .profile-hero,
body.lite-mode .profile-dashboard,
body.lite-mode .profile-settings-card,
body.lite-mode .challenge-card,
body.lite-mode .notice-stack article,
body.lite-mode .withdrawal-panel,
body.lite-mode .transaction-history,
body.lite-mode .game-card,
body.lite-mode .metric-card,
body.lite-mode .fixture-card,
body.lite-mode .agent-card,
body.lite-mode .transaction-card,
body.lite-mode .profile-strip,
body.lite-mode .wallet-method-panel,
body.lite-mode .crypto-deposit-panel,
body.lite-mode .agent-withdraw-panel,
body.lite-mode .wallet-method-card,
body.lite-mode .admin-reset-panel,
body.lite-mode .wallet-identity-card,
body.lite-mode .wallet-identity-card div,
body.lite-mode .wallet-metric-grid span,
body.lite-mode .receipt-modal,
body.lite-mode .receipt-grid article,
body.lite-mode .receipt-summary,
body.lite-mode .receipt-status {
    color: #1a1a1e;
    border-color: #e5e7eb;
    background: #ffffff;
    box-shadow: 0 8px 22px rgba(15, 23, 42, .055);
}

body.lite-mode .wallet-card {
    color: #1a1a1e;
    border-color: rgba(255, 184, 0, .38);
    background: linear-gradient(145deg, #ffffff, #fff7df);
    box-shadow: 0 10px 28px rgba(15, 23, 42, .075);
}

body.lite-mode .wallet-card strong,
body.lite-mode .wallet-deep-card strong,
body.lite-mode .metric-card strong,
body.lite-mode .queue-row strong {
    color: #b77900;
}

body.lite-mode .queue-row {
    color: #1a1a1e;
    border: 1px solid #e5e7eb;
    background: #f9fafb;
    box-shadow: 0 4px 10px rgba(15, 23, 42, .035);
}

body.lite-mode .queue-row + .queue-row {
    margin-top: 4px;
}

body.lite-mode .brand,
body.lite-mode .privacy-panel span,
body.lite-mode .transaction-card b.debit {
    color: #1a1a1e;
}

body.lite-mode .hero-copy,
body.lite-mode .game-card p,
body.lite-mode .agent-section p,
body.lite-mode .challenge-card p,
body.lite-mode .wallet-deep-card p,
body.lite-mode .wallet-card small,
body.lite-mode .wallet-card span,
body.lite-mode .queue-row small,
body.lite-mode .transaction-card span {
    color: #6b7280;
}

body.lite-mode .transaction-card small {
    color: #4b5563;
}

body.lite-mode .transaction-search span {
    color: #6b7280;
}

body.lite-mode .transaction-filter-grid select,
body.lite-mode .transaction-filter-grid input,
body.lite-mode .transaction-search input {
    color: #1a1a1e;
    border-color: #e5e7eb;
    background: #f9fafb;
}

body.lite-mode .wallet-page-title span,
body.lite-mode .wallet-identity-card span,
body.lite-mode .receipt-header p,
body.lite-mode .receipt-summary p,
body.lite-mode .receipt-grid small {
    color: #6b7280;
}

body.lite-mode .receipt-grid article > span {
    border-bottom-color: #e5e7eb;
}

body.lite-mode .deposit-helper,
body.lite-mode .wallet-method-card p,
body.lite-mode .nowpayments-summary small {
    color: #4b5563;
}

body.lite-mode .nowpayments-summary {
    border-color: rgba(255, 184, 0, .36);
    background: #fff8e1;
}

body.lite-mode .nowpayments-summary span {
    color: #92400e;
}

body.lite-mode .admin-danger-banner {
    color: #7f1d1d;
    border-color: rgba(239, 68, 68, .35);
    background: #fef2f2;
}

body.lite-mode .dev-reset-form label {
    color: #1a1a1e;
    border-color: #e5e7eb;
    background: #f9fafb;
}

body.lite-mode .confirmation-field span {
    color: #6b7280;
}

body.lite-mode .wallet-return-notice {
    color: #14532d;
    border-color: rgba(34, 197, 94, .32);
    background: #ecfdf5;
}

body.lite-mode .debug-payment-card {
    color: #1a1a1e;
    border-color: #e5e7eb;
    background: #f9fafb;
}

body.lite-mode .debug-payment-card strong {
    color: #1a1a1e;
}

body.lite-mode .debug-payment-card span {
    color: #4b5563;
}

body.lite-mode .ticker {
    border-color: rgba(255, 184, 0, .35);
    background: #fff8e1;
}

body.lite-mode .ticker p {
    color: #4b5563;
}

body.lite-mode .bottom-nav a {
    color: #6b7280;
}

body.lite-mode .bottom-nav a.active,
body.lite-mode button:not(.ghost):not(.icon-btn):not(.modal-x):not(.share-close) {
    color: #000000;
}

body.lite-mode input,
body.lite-mode select,
body.lite-mode textarea,
body.lite-mode .withdrawal-panel input,
body.lite-mode .withdrawal-panel select {
    color: #1a1a1e;
    background: #ffffff;
    border-color: #d1d5db;
}

body.lite-mode .game-card,
body.lite-mode .wallet-method-card,
body.lite-mode .football-panel,
body.lite-mode .arcade-game-card {
    border-color: #e5e7eb;
    background: #ffffff;
}

body.lite-mode .agent-summary,
body.lite-mode .agent-meta span,
body.lite-mode .duel-stack span {
    color: #1a1a1e;
    background: #f9fafb;
}

@media (min-width: 760px) {
    .hero-panel { grid-template-columns: 1.35fr .8fr; align-items: center; }
    .game-grid { grid-template-columns: repeat(3, 1fr); }
    .fixture-card { grid-template-columns: .75fr 1fr auto; align-items: center; }
    .rail-grid { grid-template-columns: 1fr 1fr; }
    .country-grid { grid-template-columns: repeat(4, 1fr); }
    .agent-tools { grid-template-columns: .42fr 1fr; }
    .agent-summary { grid-template-columns: 1fr auto; align-items: center; }
    .agent-actions { grid-template-columns: repeat(3, 1fr); }
    .vote-box { grid-template-columns: 1fr auto auto; align-items: center; }
    .privacy-panel,
    .share-actions { grid-template-columns: 1fr 1fr; }
    .football-market-grid { grid-template-columns: repeat(3, 1fr); }
    .football-summary-grid { grid-template-columns: repeat(3, 1fr); }
    .football-board-card { grid-template-columns: .75fr 1fr auto; align-items: center; }
    .football-board-actions { min-width: 260px; }
}

@media (max-width: 430px) {
    .app-shell { padding-bottom: 74px; }
    main { padding: 8px; }
    .topbar {
        gap: 8px;
        padding: 8px 10px;
    }
    .brand { gap: 7px; }
    .brand-logo {
        width: 42px;
        height: 42px;
        border-radius: 12px;
    }
    .brand strong { font-size: 1rem; }
    .brand small { display: none; }
    .top-actions { gap: 6px; }
    .lite-toggle {
        gap: 5px;
        font-size: .78rem;
    }
    .lite-toggle input {
        width: 14px;
        height: 14px;
    }
    .icon-btn {
        width: 34px;
        min-height: 34px;
        font-size: .9rem;
    }
    #logoutButton {
        min-height: 34px;
        padding: 0 10px;
        font-size: .78rem;
    }
    .view[data-view="home"] {
        gap: 8px;
    }
    .quick-grid { grid-template-columns: 1fr; }
    .hero-panel {
        gap: 6px;
        padding: 12px 14px;
        border-radius: 16px;
    }
    .hero-panel::after {
        right: -132px;
        top: -132px;
        width: 172px;
        height: 172px;
        border-width: 12px;
    }
    .hero-panel h1 {
        margin-bottom: 6px;
        max-width: 320px;
        font-size: clamp(1.45rem, 7.4vw, 2rem);
        line-height: 1.04;
    }
    .hero-copy {
        max-width: 290px;
        margin-bottom: 0;
        font-size: .76rem;
        line-height: 1.35;
    }
    .hero-actions {
        grid-template-columns: 1fr 1fr;
        gap: 8px;
    }
    .hero-actions button {
        min-height: 38px;
        padding: 0 10px;
        font-size: .78rem;
    }
    .wallet-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }
    .wallet-action-row { grid-template-columns: 1fr; }
    .wallet-card {
        gap: 3px;
        padding: 10px 12px;
        border-radius: 15px;
    }
    .wallet-card span,
    .wallet-card small {
        font-size: .72rem;
    }
    .wallet-card strong {
        font-size: 1.9rem;
    }
    .wallet-actions button {
        width: 100%;
        min-height: 38px;
        padding: 0 8px;
        font-size: .78rem;
    }
    .compact-stats-card {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 0;
        padding: 7px;
        border-radius: 14px;
    }
    .compact-stats-card .metric-card {
        min-width: 0;
        padding: 7px 4px;
    }
    .compact-stats-card .metric-card strong {
        font-size: 1.1rem;
    }
    .compact-stats-card .metric-card span {
        font-size: .64rem;
    }
    .ticker {
        gap: 7px;
        padding: 6px 8px;
        border-radius: 13px;
    }
    .ticker span {
        padding: 3px 7px;
        font-size: .62rem;
    }
    .ticker p {
        font-size: .74rem;
        animation-duration: 18s;
    }
    .board-section {
        padding: 10px;
        border-radius: 16px;
    }
    .section-title h2 {
        font-size: 1.05rem;
    }
    .queue-row {
        grid-template-columns: minmax(0, 1fr) auto auto auto;
        gap: 7px;
        padding: 8px 9px;
        border-radius: 12px;
    }
    .queue-row span,
    .queue-row strong {
        font-size: .82rem;
    }
    .queue-row small {
        font-size: .64rem;
    }
    .queue-row b {
        min-width: 50px;
        padding: 7px 9px;
        font-size: .72rem;
    }
    .wallet-page-title,
    .wallet-identity-card,
    .wallet-balance-card,
    .wallet-metric-grid,
    .transaction-filter-grid,
    .receipt-header,
    .receipt-grid,
    .receipt-actions {
        grid-template-columns: 1fr;
    }
    .receipt-modal {
        width: calc(100vw - 16px);
        padding: 16px;
        border-radius: 18px;
    }
    .receipt-grid article > span {
        grid-template-columns: 1fr;
    }
    .wallet-toast {
        bottom: 92px;
    }
    .section-title { align-items: center; }
    .queue-filter { min-width: 104px; }
    .arcade-game-card,
    .browse-hero,
    .challenge-main-row,
    .challenge-bottom-row,
    .stake-input,
    .type-grid,
    .football-hero,
    .football-page-head,
    .fixture-versus-card,
    .fixture-meta,
    .football-market-grid,
    .football-option-grid.two,
    .currency-field,
    .custom-odds-box,
    .score-picker,
    .pool-info-grid,
    .player-chip-row,
    .football-summary-grid,
    .football-action-row,
    .football-board-actions {
        grid-template-columns: 1fr;
    }
    .arcade-title {
        padding-top: 2px;
    }
    .arcade-title h1 {
        margin-bottom: 4px;
        font-size: 1.85rem;
    }
    .arcade-title p:last-child {
        margin-bottom: 0;
        font-size: .82rem;
        line-height: 1.3;
    }
    .arcade-screen {
        gap: 10px;
    }
    .arcade-game-grid {
        gap: 10px;
    }
    .arcade-game-card {
        grid-template-columns: minmax(0, 1fr) 86px;
        gap: 8px;
        padding: 10px;
        border-radius: 15px;
    }
    .arcade-game-copy {
        gap: 4px;
    }
    .arcade-game-copy h2 {
        font-size: 1.12rem;
    }
    .arcade-game-copy p {
        font-size: .72rem;
    }
    .capacity-copy {
        padding: 4px 7px;
        font-size: .66rem;
    }
    .game-art {
        min-height: 78px;
    }
    .game-stats {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 4px;
    }
    .game-stats span {
        padding: 5px 3px;
        font-size: .55rem;
        border-radius: 8px;
    }
    .game-stats strong {
        font-size: .72rem;
    }
    .arcade-game-card .game-action-row {
        gap: 6px;
    }
    .game-action-row button {
        min-height: 34px;
        border-radius: 9px;
        font-size: .66rem;
    }
    .ludo-art::before {
        inset: 20px 3px 7px 5px;
        border-radius: 11px;
    }
    .gold-die {
        left: 8px;
        top: 14px;
        width: 38px;
        height: 38px;
        border-radius: 10px;
        font-size: 1.18rem;
    }
    .gold-die.large {
        width: 54px;
        height: 54px;
        font-size: 1.65rem;
    }
    .gold-die.small {
        left: 52px;
        top: 42px;
        width: 32px;
        height: 32px;
        font-size: 1rem;
    }
    .peg {
        width: 14px;
        height: 25px;
    }
    .peg.red { right: 32px; top: 18px; }
    .peg.green { right: 7px; top: 26px; }
    .peg.blue { right: 14px; bottom: 18px; }
    .peg.yellow { right: 44px; bottom: 22px; }
    .whot-art .card {
        top: 18px;
        width: 38px;
        height: 60px;
        border-radius: 9px;
        font-size: .9rem;
    }
    .whot-art .two { left: 23px; }
    .whot-art .muscle { left: 46px; }
    .chips {
        right: 4px;
        bottom: 12px;
        width: 38px;
        height: 22px;
    }
    .football-hero,
    .football-page-head {
        align-items: start;
    }
    .football-ball {
        width: 58px;
        height: 58px;
        font-size: 1.8rem;
    }
    .football-market-card {
        min-height: 104px;
    }
    .fixture-meta {
        grid-column: auto;
    }
    .custom-odds-box .potential-row {
        grid-column: auto;
    }
    .browse-filters,
    .mode-grid,
    .submode-tabs,
    .duration-marks,
    .challenge-summary div {
        grid-template-columns: 1fr;
    }
    .challenge-main-row b,
    .challenge-status {
        grid-column: auto;
        justify-self: start;
    }
    .game-art {
        min-height: 180px;
    }
    .arcade-create-card {
        padding: 18px;
    }
    .transaction-card {
        grid-template-columns: 34px 1fr;
    }
    .transaction-card b {
        grid-column: 2;
        text-align: left;
    }
}