@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');

:root {
    --green: #82cf00;
    --green-dark: #62a800;
    --green-soft: #effbdc;
    --ink: #12191d;
    --muted: #67757c;
    --muted-2: #94a1a7;
    --bg: #edf3f6;
    --card: #fff;
    --soft: #eaf0f3;
    --line: #dce5e9;
    --danger: #e8535d;
    --warning: #f5a623;
    --blue: #38a7b6;
    --shadow: 0 14px 40px rgba(29, 48, 58, .08);
    --radius: 22px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--bg); font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: 15px; line-height: 1.45; }
a { color: inherit; text-decoration: none; }
button, input, select { font: inherit; }
button { color: inherit; }
img { display: block; max-width: 100%; }
[hidden] { display: none !important; }
.ui-icon { display: block; width: 1em; height: 1em; overflow: visible; }

.app-shell { width: min(1680px, 100%); min-height: 100vh; margin: 0 auto; display: grid; grid-template-columns: 238px minmax(520px, 1fr) 330px; gap: 18px; padding: 18px; }
.desktop-sidebar, .desktop-betslip { position: sticky; top: 18px; height: calc(100vh - 36px); border-radius: 24px; background: var(--card); box-shadow: var(--shadow); }
.desktop-sidebar { display: flex; flex-direction: column; overflow: hidden; padding: 24px 15px 16px; }
.brand { display: inline-flex; align-items: center; font-size: 30px; line-height: 1; font-weight: 950; letter-spacing: -2.4px; font-style: italic; white-space: nowrap; }
.brand span { color: var(--green); }
.desktop-brand { margin: 4px 12px 30px; }
.side-nav { display: grid; gap: 5px; }
.side-nav a { display: flex; align-items: center; gap: 13px; min-height: 47px; padding: 0 14px; border-radius: 14px; color: #506067; font-weight: 700; }
.side-nav a i { width: 27px; height: 27px; display: grid; place-items: center; color: #738189; font-size: 22px; font-style: normal; }
.side-nav a i .ui-icon { width: 23px; height: 23px; }
.side-nav a:hover { background: #f4f8f9; color: var(--ink); }
.side-nav a.active { color: #386900; background: var(--green-soft); }
.side-nav a.active i { color: var(--green-dark); }
.side-label { color: var(--muted-2); font-size: 10px; font-weight: 900; letter-spacing: 1.4px; margin: 25px 15px 8px; }
.sidebar-account { margin-top: auto; padding: 14px 7px 0; border-top: 1px solid var(--line); display: grid; gap: 9px; }
.wallet-summary { border-radius: 15px; padding: 12px 13px; background: #182126; color: white; display: grid; }
.wallet-summary small { color: #9eacb2; font-size: 11px; }
.wallet-summary strong { font-size: 18px; }
.user-row { display: flex; align-items: center; gap: 10px; margin-top: 4px; }
.avatar { width: 37px; height: 37px; border-radius: 50%; display: grid; place-items: center; background: var(--green); font-weight: 900; }
.user-row div { min-width: 0; display: grid; }
.user-row strong, .user-row small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.user-row small { color: var(--muted); font-size: 11px; }
.text-button { padding: 5px 0; border: 0; background: transparent; color: var(--muted); cursor: pointer; font-size: 12px; }

.main-content { min-width: 0; padding-bottom: 30px; }
.desktop-head { min-height: 74px; border-radius: 20px; background: white; box-shadow: var(--shadow); margin-bottom: 16px; padding: 13px 18px 13px 22px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.desktop-head > div:first-child { display: grid; }
.desktop-head strong { font-size: 17px; }
.desktop-head small { color: var(--muted); }
.desktop-head-actions { display: flex; gap: 9px; align-items: center; }
.btn { min-height: 43px; padding: 0 18px; border-radius: 13px; border: 0; display: inline-flex; align-items: center; justify-content: center; font-weight: 800; cursor: pointer; transition: transform .15s, filter .15s; }
.btn:hover { filter: brightness(.97); transform: translateY(-1px); }
.btn.primary { background: var(--green); color: #173000; }
.btn.ghost { background: #edf3f5; color: #405057; }
.btn.wide { width: 100%; }
.balance-pill { display: inline-flex; align-items: center; gap: 8px; min-height: 42px; padding: 5px 14px 5px 6px; border-radius: 999px; background: #edf2f4; font-weight: 900; white-space: nowrap; }
.balance-pill b { width: 33px; height: 33px; border-radius: 50%; background: var(--green); display: grid; place-items: center; font-size: 22px; font-weight: 600; }
.mobile-topbar, .mobile-bottom-nav, .mobile-auth-actions { display: none; }

.flash { border-radius: 15px; margin: 0 0 14px; padding: 13px 16px; font-weight: 700; }
.flash.success { background: #ebf9d8; color: #356400; border: 1px solid #cceca0; }
.flash.error { background: #fff0f1; color: #a12c35; border: 1px solid #f4c5c9; }

.desktop-betslip { overflow: auto; padding: 18px; }
.betslip-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.betslip-head div { display: grid; }
.betslip-head small { font-size: 10px; color: var(--muted); letter-spacing: 1.2px; font-weight: 900; }
.betslip-head strong { font-size: 17px; }
.betslip-head button { border: 0; background: transparent; color: var(--danger); font-size: 12px; cursor: pointer; }
.slip-empty { min-height: 330px; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; color: var(--muted); }
.slip-empty > span { width: 66px; height: 66px; border-radius: 50%; display: grid; place-items: center; background: var(--green-soft); color: var(--green-dark); font-size: 30px; margin-bottom: 14px; }
.slip-empty strong { color: var(--ink); }
.slip-empty p { margin: 5px 0 14px; font-size: 13px; }
.slip-items { display: grid; gap: 10px; margin: 14px 0; }
.slip-item { position: relative; border: 1px solid var(--line); border-radius: 15px; padding: 12px 34px 12px 12px; background: #fbfcfc; display: grid; gap: 5px; }
.slip-item > button { position: absolute; top: 8px; right: 9px; border: 0; background: transparent; color: var(--muted); cursor: pointer; font-size: 17px; }
.slip-item strong { font-size: 13px; }
.slip-item small { color: var(--muted); font-size: 11px; }
.slip-item div { display: flex; justify-content: space-between; gap: 10px; font-size: 12px; }
.slip-item div b { color: var(--green-dark); }
.slip-checkout { display: grid; gap: 11px; border-top: 1px solid var(--line); padding-top: 14px; }
.slip-checkout label { border-radius: 13px; border: 1px solid var(--line); background: #f7fafb; padding: 9px 12px; display: grid; grid-template-columns: 1fr auto; gap: 2px 8px; color: var(--muted); font-size: 11px; }
.slip-checkout label span { text-align: right; }
.slip-checkout input { grid-column: 1/-1; width: 100%; border: 0; background: transparent; outline: none; font-size: 20px; font-weight: 900; color: var(--ink); }
.slip-checkout > div { display: flex; align-items: center; justify-content: space-between; }
.slip-checkout > div span { color: var(--muted); }
.slip-checkout > div strong { font-size: 17px; }
.slip-message { margin: 0; min-height: 18px; text-align: center; color: var(--danger); font-size: 12px; }

.sport-shortcuts { display: grid; grid-template-columns: repeat(6, minmax(74px, 1fr)); gap: 12px; border-radius: var(--radius); padding: 17px 15px; margin-bottom: 15px; background: white; box-shadow: var(--shadow); }
.sport-shortcuts a { display: grid; place-items: center; gap: 7px; text-align: center; font-size: 12px; font-weight: 650; }
.sport-shortcuts i { width: 53px; height: 53px; display: grid; place-items: center; border-radius: 50%; background: #f0f5f7; color: #708087; font-size: 23px; font-style: normal; transition: .2s; }
.sport-shortcuts a.active i, .sport-shortcuts a:hover i { background: var(--green); color: white; transform: translateY(-2px); }

.promo-scroller, .game-scroller, .filter-scroller { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; gap: 14px; padding-bottom: 2px; }
.promo-scroller::-webkit-scrollbar, .game-scroller::-webkit-scrollbar, .filter-scroller::-webkit-scrollbar { display: none; }
.promo-card { scroll-snap-align: start; position: relative; min-width: min(580px, 77%); min-height: 230px; overflow: hidden; border-radius: 25px; color: white; padding: 30px; background: #111; }
.promo-card::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(circle at 80% 25%, rgba(130,207,0,.35), transparent 40%); }
.football-promo { background: linear-gradient(115deg,#0c1113 15%,#1b2d20 65%,#598e00); }
.casino-promo { background: linear-gradient(125deg,#111333,#48206c 60%,#eb4765); }
.promo-card small { position: relative; color: var(--green); letter-spacing: 1.5px; font-weight: 900; }
.promo-card h1, .promo-card h2 { position: relative; margin: 8px 0; font-size: clamp(28px, 4vw, 43px); line-height: 1.02; letter-spacing: -1.5px; }
.promo-card p { position: relative; color: #cbd5d8; max-width: 350px; margin: 0 0 18px; }
.promo-card a { position: relative; display: inline-flex; border-radius: 999px; background: var(--green); color: #1a3000; padding: 9px 15px; font-weight: 850; }
.promo-ball, .promo-rocket { position: absolute; right: 35px; bottom: 17px; font-size: 112px; filter: drop-shadow(0 15px 20px rgba(0,0,0,.45)); transform: rotate(-9deg); }
.promo-rocket { font-size: 150px; color: #ff8a2b; font-weight: 900; }

.section-block, .detail-panel, .admin-card { background: white; border-radius: var(--radius); padding: 20px; margin-top: 15px; box-shadow: var(--shadow); }
.section-heading { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 14px; }
.section-heading h2 { margin: 0; font-size: 22px; letter-spacing: -.6px; }
.section-heading h2 em { display: inline-flex; padding: 3px 9px; border: 2px solid var(--blue); border-radius: 10px; color: var(--blue); font-style: normal; font-size: 13px; vertical-align: middle; }
.section-heading > a { padding: 8px 14px; border-radius: 12px; background: white; color: var(--green-dark); font-weight: 800; font-size: 12px; }
.section-heading > small { color: var(--muted); }
.game-zone { padding-left: 0; padding-right: 0; box-shadow: none; background: transparent; }
.game-zone .section-heading { padding: 0 10px; }
.game-card { flex: 0 0 220px; height: 142px; position: relative; overflow: hidden; border-radius: 21px; padding: 16px; color: white; display: flex; flex-direction: column; justify-content: flex-end; }
.game-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(transparent 35%,rgba(0,0,0,.72)); }
.game-card strong, .game-card small { position: relative; z-index: 2; }
.game-card strong { font-size: 18px; }
.game-card small { color: #d5dde0; }
.game-art { position: absolute; z-index: 1; right: 14px; top: 4px; font-size: 76px; transform: rotate(-10deg); filter: drop-shadow(0 12px 12px #0008); }
.game-1 { background: linear-gradient(135deg,#40184d,#c22c5f,#ff9441); }
.game-2 { background: linear-gradient(135deg,#062a2b,#087e78,#39d2ac); }
.game-3 { background: linear-gradient(135deg,#0c2551,#3451a0,#8a42bb); }
.game-4 { background: linear-gradient(135deg,#1d2230,#676d8c,#d16f56); }

.event-tabs { position: sticky; top: 0; z-index: 15; margin: 15px 0; padding: 7px; display: flex; gap: 6px; border-radius: 18px; background: rgba(255,255,255,.95); box-shadow: var(--shadow); backdrop-filter: blur(12px); overflow-x: auto; scrollbar-width: none; }
.event-tabs a { flex: 1; min-width: 115px; min-height: 45px; border-radius: 13px; display: flex; align-items: center; justify-content: center; gap: 8px; color: #66767d; font-size: 12px; font-weight: 850; }
.event-tabs i { font-size: 19px; font-style: normal; }
.event-tabs a.active { color: var(--green-dark); background: var(--green-soft); }
.matches-section { margin-top: 14px; }
.matches-section > .section-heading { padding: 0 5px; }
.live-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: var(--danger); box-shadow: 0 0 0 5px rgba(232,83,93,.14); margin-right: 5px; animation: pulse 1.7s infinite; }
@keyframes pulse { 50% { box-shadow: 0 0 0 9px rgba(232,83,93,0); } }

.match-card { margin-bottom: 13px; padding: 15px 17px 17px; border-radius: 25px; background: white; box-shadow: 0 8px 28px rgba(23,42,51,.055); }
.match-meta { min-height: 34px; display: flex; align-items: center; justify-content: space-between; gap: 10px; color: var(--muted); }
.match-meta > a { min-width: 0; display: flex; align-items: center; gap: 8px; }
.match-meta > a span:last-child { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ball-icon { font-size: 22px; color: #728188; }
.match-meta > div { display: flex; gap: 7px; }
.match-meta button { width: 34px; height: 34px; border-radius: 50%; border: 0; background: #eff4f6; color: var(--green-dark); font-size: 20px; cursor: pointer; }
.match-scoreboard { min-height: 90px; display: grid; grid-template-columns: 1fr 94px 1fr; align-items: center; gap: 11px; padding: 9px 4px 4px; }
.team { min-width: 0; display: flex; align-items: center; gap: 10px; font-size: 16px; font-weight: 750; }
.team.home { justify-content: flex-end; text-align: right; }
.team.away { justify-content: flex-start; }
.team img, .team i { flex: 0 0 44px; width: 44px; height: 44px; object-fit: contain; }
.team i { display: grid; place-items: center; border-radius: 50%; background: var(--soft); color: var(--muted); font-style: normal; font-size: 12px; }
.score { display: grid; place-items: center; text-align: center; }
.score strong { font-size: 29px; letter-spacing: -1px; white-space: nowrap; }
.score span { font-size: 11px; color: var(--muted); font-weight: 700; }
.score .live-text { color: var(--danger); }
.match-state { text-align: center; color: var(--muted); margin: 2px 0 12px; font-size: 13px; }
.market-title { display: flex; justify-content: space-between; align-items: center; margin: 0 1px 8px; }
.market-title strong { font-size: 17px; }
.market-title small { color: var(--muted-2); }
.odds-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.odd-button { min-height: 54px; border-radius: 15px; border: 1px solid transparent; background: #eaf0f3; padding: 6px 13px; display: flex; align-items: center; justify-content: space-between; gap: 8px; cursor: pointer; transition: .15s; }
.odd-button:hover { border-color: var(--green); transform: translateY(-1px); }
.odd-button.selected { color: #274d00; background: var(--green-soft); border-color: var(--green); }
.odd-button span { color: var(--muted); font-size: 13px; text-align: left; }
.odd-button.selected span { color: #4f780f; }
.odd-button strong { font-size: 17px; }
.odd-button.disabled { cursor: not-allowed; opacity: .5; }
.markets-unavailable { min-height: 49px; border-radius: 14px; padding: 0 14px; display: flex; align-items: center; justify-content: space-between; color: var(--muted); background: #f2f6f7; }

.empty-state { min-height: 185px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; border-radius: var(--radius); background: white; padding: 28px; color: var(--muted); }
.empty-state.large { min-height: 360px; }
.empty-state > i { width: 55px; height: 55px; border-radius: 50%; display: grid; place-items: center; background: var(--green-soft); color: var(--green-dark); font-size: 25px; font-style: normal; margin-bottom: 12px; }
.empty-state strong { color: var(--ink); font-size: 17px; }
.empty-state p { max-width: 420px; margin: 5px 0 15px; }
.league-pills { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.league-pills a { min-height: 67px; display: grid; grid-template-columns: 38px 1fr auto; align-items: center; gap: 9px; padding: 10px; border: 1px solid var(--line); border-radius: 15px; }
.league-pills img, .league-pills > a > span { width: 36px; height: 36px; object-fit: contain; display: grid; place-items: center; }
.league-pills b { font-size: 12px; }
.league-pills small { width: 25px; height: 25px; display: grid; place-items: center; border-radius: 50%; background: var(--soft); color: var(--muted); font-size: 10px; }

.page-hero { min-height: 210px; border-radius: 25px; padding: 30px; background: linear-gradient(125deg,#11191d,#283b2e 70%,#75b800); color: white; display: flex; align-items: center; justify-content: space-between; overflow: hidden; box-shadow: var(--shadow); }
.page-hero.compact { min-height: 170px; }
.eyebrow { color: var(--green); letter-spacing: 1.6px; font-size: 11px; font-weight: 900; }
.page-hero h1, .admin-heading h1 { margin: 7px 0 5px; font-size: clamp(29px, 4vw, 42px); line-height: 1.05; letter-spacing: -1.5px; }
.page-hero p { color: #c8d2d6; margin: 0; max-width: 500px; }
.page-hero > i { font-size: 100px; font-style: normal; filter: drop-shadow(0 18px 22px #0008); }
.filter-scroller { margin: 14px 0; }
.filter-scroller a { flex: 0 0 auto; min-height: 42px; display: flex; align-items: center; gap: 7px; padding: 0 14px; border-radius: 13px; background: white; color: var(--muted); font-weight: 750; box-shadow: 0 5px 15px #24353e09; }
.filter-scroller a.active { color: #315b00; background: var(--green-soft); }
.filter-scroller img { width: 23px; height: 23px; object-fit: contain; }
.filter-scroller small { padding: 2px 6px; border-radius: 999px; background: var(--soft); }

.back-link { display: inline-flex; margin: 2px 0 10px; color: var(--muted); font-weight: 750; }
.match-detail-hero { border-radius: 26px; padding: 22px; background: linear-gradient(135deg,#fff,#f7fafb); box-shadow: var(--shadow); }
.match-detail-hero.is-live { background: linear-gradient(135deg,#162027,#273a2d); color: white; }
.detail-league { display: flex; align-items: center; gap: 10px; }
.detail-league img { width: 35px; height: 35px; object-fit: contain; }
.detail-league > span, .detail-league > a { display: grid; font-weight: 750; }
.detail-league small { color: var(--muted); font-weight: 500; }
.is-live .detail-league small { color: #aebbc0; }
.detail-league b { margin-left: auto; padding: 4px 9px; border-radius: 999px; background: var(--danger); font-size: 10px; letter-spacing: 1px; }
.detail-scoreboard { display: grid; grid-template-columns: 1fr 150px 1fr; align-items: center; gap: 20px; padding: 30px 20px 18px; }
.detail-scoreboard > div { min-width: 0; display: grid; place-items: center; text-align: center; gap: 9px; }
.detail-scoreboard img, .detail-scoreboard > div i { width: 75px; height: 75px; object-fit: contain; }
.detail-scoreboard > div i { display: grid; place-items: center; border-radius: 50%; background: var(--soft); color: var(--muted); font-style: normal; }
.detail-scoreboard > div strong { font-size: 17px; }
.detail-scoreboard section { display: grid; place-items: center; }
.detail-scoreboard section > span { color: var(--danger); font-weight: 800; }
.detail-scoreboard section b { font-size: 42px; letter-spacing: -2px; white-space: nowrap; }
.detail-scoreboard section small { color: var(--muted); text-align: center; }
.is-live .detail-scoreboard section small { color: #aebbc0; }
.detail-sync { text-align: center; }
.detail-sync button { border: 0; border-radius: 12px; padding: 9px 13px; background: rgba(130,207,0,.14); color: var(--green-dark); font-size: 12px; cursor: pointer; }
.is-live .detail-sync button { color: var(--green); }
.detail-tabs { display: flex; gap: 7px; margin: 14px 0; background: white; padding: 6px; border-radius: 16px; box-shadow: var(--shadow); }
.detail-tabs a { flex: 1; text-align: center; padding: 11px; border-radius: 11px; color: var(--muted); font-weight: 750; }
.detail-tabs a.active { color: #315b00; background: var(--green-soft); }
.markets-list { display: grid; gap: 11px; }
.market-card { border-radius: 19px; background: white; box-shadow: 0 8px 25px #1a303a0a; overflow: hidden; }
.market-card header { min-height: 60px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 17px; border-bottom: 1px solid var(--line); }
.market-card header div { display: grid; }
.market-card header small { color: var(--muted); }
.market-odds { display: grid; grid-template-columns: repeat(auto-fit,minmax(145px,1fr)); gap: 9px; padding: 13px; }
.detail-odd { min-height: 56px; }
.detail-panel { scroll-margin-top: 80px; }
.timeline { display: grid; }
.timeline > div { display: grid; grid-template-columns: 45px 30px 1fr; align-items: center; min-height: 55px; border-bottom: 1px solid var(--line); }
.timeline > div:last-child { border: 0; }
.timeline time { font-weight: 900; }
.timeline i { font-style: normal; }
.timeline p { margin: 0; display: grid; }
.timeline p span, .muted { color: var(--muted); }
.info-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 10px; margin: 0; }
.info-grid div { padding: 12px; border-radius: 13px; background: #f5f8f9; }
.info-grid dt { color: var(--muted); font-size: 11px; }
.info-grid dd { margin: 3px 0 0; font-weight: 750; }

.auth-shell { min-height: calc(100vh - 130px); border-radius: 26px; overflow: hidden; display: grid; grid-template-columns: 1fr 1fr; background: white; box-shadow: var(--shadow); }
.auth-copy { padding: 55px 45px; color: white; background: linear-gradient(145deg,#11191d,#223328 70%,#6fac00); }
.auth-copy h1 { font-size: clamp(34px,4vw,55px); line-height: .98; letter-spacing: -2px; margin: 12px 0; }
.auth-copy > p { color: #c7d0d4; max-width: 440px; }
.auth-benefits { display: grid; gap: 10px; margin-top: 35px; }
.auth-benefits span { color: #e1e9eb; }
.form-card { align-self: center; padding: 45px; display: grid; gap: 15px; }
.form-card h2 { margin: 0 0 6px; font-size: 28px; }
.form-card > p { margin: 4px 0 0; text-align: center; color: var(--muted); }
.form-card a { color: var(--green-dark); font-weight: 800; }
.form-card label, .payment-panel label, .settings-grid label { display: grid; gap: 7px; color: #4f5d63; font-size: 12px; font-weight: 750; }
.form-card input, .payment-panel input, .payment-panel select, .settings-grid input { width: 100%; height: 48px; border: 1px solid var(--line); border-radius: 13px; padding: 0 13px; outline: none; background: #fbfcfc; color: var(--ink); }
.form-card input:focus, .payment-panel input:focus, .payment-panel select:focus, .settings-grid input:focus { border-color: var(--green); box-shadow: 0 0 0 3px rgba(130,207,0,.14); }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; }
.check-line { grid-template-columns: auto 1fr !important; align-items: start; }
.check-line input { width: 17px; height: 17px; }
.form-errors { display: grid; gap: 4px; padding: 12px; border-radius: 13px; background: #fff0f1; color: #a12c35; font-size: 12px; }

.mobile-slip-page { max-width: 650px; margin: 14px auto 0; border-radius: var(--radius); background: white; box-shadow: var(--shadow); padding: 18px; }
.mobile-slip-page .slip-empty { min-height: 280px; }
.mobile-slip-page .slip-checkout { max-width: 430px; margin-left: auto; }
.bet-list { display: grid; gap: 10px; margin-top: 14px; }
.bet-row { min-height: 90px; border-radius: 18px; padding: 13px 17px; background: white; box-shadow: 0 6px 22px #21343d0a; display: grid; grid-template-columns: 1fr auto 20px; align-items: center; gap: 15px; }
.bet-row > div:first-child { display: grid; justify-items: start; gap: 3px; }
.bet-row small { color: var(--muted); }
.status { display: inline-flex; padding: 3px 7px; border-radius: 999px; background: #edf2f4; color: var(--muted); font-size: 9px; font-weight: 900; letter-spacing: .6px; }
.status-won, .status-success, .status-active { color: #396b00; background: var(--green-soft); }
.status-lost, .status-failed, .status-blocked { color: #a12c35; background: #fff0f1; }
.status-pending, .status-running, .status-under_review { color: #916000; background: #fff6d8; }
.status-void, .status-cancelled { color: #526168; background: #edf2f4; }
.bet-row dl { display: flex; gap: 20px; margin: 0; }
.bet-row dl div { display: grid; text-align: right; }
.bet-row dt { color: var(--muted); font-size: 10px; }
.bet-row dd { margin: 0; font-weight: 800; }
.ticket-detail { max-width: 750px; margin: auto; border-radius: 25px; overflow: hidden; background: white; box-shadow: var(--shadow); }
.ticket-detail > header { padding: 25px; background: #182126; color: white; display: flex; justify-content: space-between; align-items: center; }
.ticket-detail h1 { margin: 5px 0 0; }
.ticket-detail header small { color: #aab7bc; }
.ticket-detail header > i { width: 54px; height: 54px; border-radius: 50%; display: grid; place-items: center; background: var(--green); color: #1b3300; font-size: 25px; font-style: normal; }
.ticket-selections { padding: 10px 20px; }
.ticket-selections article { min-height: 65px; border-bottom: 1px dashed var(--line); display: grid; grid-template-columns: 12px 1fr auto; align-items: center; gap: 10px; }
.status-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--muted-2); }
.result-won { background: var(--green); }.result-lost { background: var(--danger); }.result-void { background: var(--warning); }
.ticket-selections article div { display: grid; }
.ticket-selections small { color: var(--muted); }
.ticket-totals { margin: 0; padding: 20px; background: #f5f8f9; display: grid; gap: 8px; }
.ticket-totals div { display: flex; justify-content: space-between; }
.ticket-totals dt { color: var(--muted); }.ticket-totals dd { margin: 0; font-weight: 850; }.ticket-totals .highlight { padding-top: 11px; border-top: 1px solid var(--line); color: var(--green-dark); }

.wallet-hero { min-height: 190px; border-radius: 26px; padding: 31px; color: white; background: linear-gradient(125deg,#142027,#263b2d 68%,#78bc00); display: flex; align-items: center; justify-content: space-between; box-shadow: var(--shadow); overflow: hidden; }
.wallet-hero div { display: grid; }.wallet-hero span, .wallet-hero small { color: #cbd5d8; }.wallet-hero strong { font-size: clamp(34px,5vw,54px); letter-spacing: -2px; }.wallet-hero > i { font-size: 100px; color: var(--green); font-style: normal; }
.wallet-actions { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; margin-top: 14px; }
.wallet-actions button, .wallet-actions a { border: 0; border-radius: 17px; min-height: 82px; background: white; box-shadow: 0 5px 18px #243a4409; cursor: pointer; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; font-weight: 750; }
.wallet-actions i { color: var(--green-dark); font-size: 23px; font-style: normal; }
.payment-panel { margin-top: 14px; border-radius: var(--radius); background: white; box-shadow: var(--shadow); padding: 20px; }
.payment-panel .section-heading button { width: 34px; height: 34px; border: 0; border-radius: 50%; background: var(--soft); cursor: pointer; }
.payment-panel form { display: grid; grid-template-columns: repeat(2,1fr); gap: 13px; }
.transaction-list { display: grid; }
.transaction-list article { min-height: 64px; display: grid; grid-template-columns: 42px 1fr auto; align-items: center; gap: 11px; border-bottom: 1px solid var(--line); }
.transaction-list article:last-child { border: 0; }
.tx-icon { width: 37px; height: 37px; display: grid; place-items: center; border-radius: 50%; font-style: normal; }
.tx-icon.credit { background: var(--green-soft); color: var(--green-dark); }.tx-icon.debit { background: #fff0f1; color: var(--danger); }
.transaction-list article div { display: grid; }.transaction-list small { color: var(--muted); }.transaction-list article > b.credit { color: var(--green-dark); }.transaction-list article > b.debit { color: var(--danger); }

.casino-hero { min-height: 290px; border-radius: 27px; padding: 37px; overflow: hidden; color: white; background: radial-gradient(circle at 78% 30%,#7828a9,transparent 28%),linear-gradient(125deg,#141224,#242047 55%,#c54a86); display: flex; align-items: center; justify-content: space-between; box-shadow: var(--shadow); }
.casino-hero h1 { margin: 8px 0; font-size: clamp(38px,6vw,68px); line-height: .92; letter-spacing: -3px; }.casino-hero p { color: #d1cfdf; max-width: 520px; }.casino-symbol { font-size: 150px; color: #ff6aa5; text-shadow: 0 20px 30px #0008; transform: rotate(20deg); }
.category-tabs { display: flex; gap: 8px; overflow-x: auto; padding: 14px 0 5px; }.category-tabs button { border: 0; border-radius: 999px; background: white; padding: 9px 16px; color: var(--muted); font-weight: 750; }.category-tabs button.active { background: var(--green); color: #1b3300; }
.casino-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 13px; margin-top: 10px; }
.casino-tile { aspect-ratio: 1.18; min-height: 190px; position: relative; overflow: hidden; border-radius: 22px; padding: 17px; color: white; display: flex; flex-direction: column; justify-content: flex-end; box-shadow: 0 10px 25px #1a26304a; }
.casino-tile::after { content:""; position:absolute; inset:0; background:linear-gradient(transparent 20%,rgba(0,0,0,.8)); }.casino-tile > span { position: absolute; right: 15px; top: 2px; font-size: 84px; transform: rotate(-7deg); filter: drop-shadow(0 15px 12px #0008); }.casino-tile div,.casino-tile b { position:relative;z-index:2; }.casino-tile div { display:grid; }.casino-tile div strong { font-size: 19px; }.casino-tile div small { color:#ced7da; }.casino-tile > b { align-self:flex-start;margin-top:10px;padding:5px 9px;border-radius:999px;background:var(--green);color:#1a3100;font-size:10px; }
.casino-tile-1{background:linear-gradient(135deg,#3e163c,#d93459,#ff9d42)}.casino-tile-2{background:linear-gradient(135deg,#072a32,#087b83,#36d0af)}.casino-tile-3{background:linear-gradient(135deg,#162252,#6441a3,#d43d8e)}.casino-tile-4{background:linear-gradient(135deg,#202331,#636a82,#d67a53)}.casino-tile-5{background:linear-gradient(135deg,#17321b,#347b34,#b1d633)}.casino-tile-6{background:linear-gradient(135deg,#2d1738,#8e3a8f,#eb6f71)}
.responsible-note { margin-top:14px;border-radius:18px;padding:16px;background:white;display:flex;align-items:center;gap:13px; }.responsible-note > i { width:43px;height:43px;border-radius:50%;display:grid;place-items:center;background:#fff0f1;color:var(--danger);font-weight:900;font-style:normal; }.responsible-note p { margin:2px 0 0;color:var(--muted); }

.admin-heading { min-height: 130px; border-radius: 24px; padding: 25px; background: white; box-shadow: var(--shadow); display:flex;align-items:center;justify-content:space-between;gap:20px; }.admin-heading h1 { font-size: 34px; }.admin-heading p { margin:0;color:var(--muted); }
.metric-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:14px; }.metric-grid article { min-height:125px;border-radius:19px;padding:16px;background:white;box-shadow:0 6px 20px #20343e0b;display:grid;grid-template-columns:42px 1fr;align-items:center; }.metric-grid i { grid-row:1/3;width:37px;height:37px;border-radius:12px;display:grid;place-items:center;background:var(--green-soft);color:var(--green-dark);font-style:normal;font-size:19px; }.metric-grid span{color:var(--muted);font-size:12px}.metric-grid strong{font-size:26px;letter-spacing:-1px}
.table-wrap { overflow-x:auto; }.table-wrap table { width:100%;border-collapse:collapse;min-width:650px; }.table-wrap th,.table-wrap td { text-align:left;padding:11px 9px;border-bottom:1px solid var(--line);font-size:12px; }.table-wrap th { color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.7px; }.table-wrap tr:last-child td{border:0}.table-error{display:block;color:var(--danger);max-width:250px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sync-actions { display:grid;grid-template-columns:repeat(3,1fr);gap:10px; }.sync-actions button { width:100%;min-height:70px;border:1px solid var(--line);border-radius:15px;background:#f9fbfb;cursor:pointer;display:flex;align-items:center;gap:10px;padding:11px;text-align:left;font-weight:750; }.sync-actions button:hover{border-color:var(--green)}.sync-actions i{width:33px;height:33px;border-radius:11px;background:var(--green-soft);color:var(--green-dark);display:grid;place-items:center;font-style:normal;font-size:19px}.admin-hint{margin:12px 0 0;color:var(--muted);font-size:12px}
.settings-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:11px;margin-bottom:20px; }.admin-card h3{margin:10px 0}.league-admin-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.league-admin-grid label{min-height:58px;border:1px solid var(--line);border-radius:13px;padding:8px;display:grid;grid-template-columns:auto 34px 1fr;align-items:center;gap:8px;cursor:pointer}.league-admin-grid img,.league-admin-grid label>i{width:32px;height:32px;object-fit:contain;display:grid;place-items:center;font-style:normal}.league-admin-grid span{display:grid}.league-admin-grid small{color:var(--muted);font-size:10px}
.league-mini-inputs{display:grid!important;grid-template-columns:1fr 1fr;gap:5px;margin-top:5px}.league-mini-inputs input{width:100%;height:29px;border:1px solid var(--line);border-radius:8px;padding:0 6px;font-size:11px;background:#f7fafb}
.error-page { min-height: 65vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:white;border-radius:25px;box-shadow:var(--shadow);padding:30px}.error-page>span{font-size:90px;font-weight:950;color:var(--green);letter-spacing:-6px}.error-page h1{margin:0;font-size:31px}.error-page p{color:var(--muted)}
.league-hero-logo{width:105px;height:105px;object-fit:contain;filter:drop-shadow(0 15px 18px #0006)}.standing-team{display:flex;align-items:center;gap:8px;min-width:170px}.standing-team img{width:27px;height:27px;object-fit:contain}

.mobile-drawer { position:fixed;inset:0;z-index:80;background:rgba(10,17,20,.55);backdrop-filter:blur(4px);padding:80px 15px 90px;display:flex;align-items:flex-end; }.drawer-card{width:100%;max-width:480px;margin:auto;background:white;border-radius:24px;padding:16px;display:grid;gap:6px}.drawer-head{display:flex;justify-content:space-between;align-items:center;padding:3px 7px 10px}.drawer-head button{width:34px;height:34px;border:0;border-radius:50%;background:var(--soft);font-size:22px}.drawer-card>a{padding:13px;border-radius:12px;background:#f6f9fa;font-weight:700;display:flex;align-items:center;gap:10px}.drawer-card>a .ui-icon{width:23px;height:23px;flex:0 0 23px}

@media (max-width: 1220px) {
    .app-shell { grid-template-columns: 210px minmax(480px,1fr) 300px; gap: 12px; padding: 12px; }
    .desktop-sidebar,.desktop-betslip { top:12px;height:calc(100vh - 24px); }
    .league-pills,.casino-grid { grid-template-columns:repeat(2,1fr); }
    .team { font-size:14px; }.team img,.team i{width:38px;height:38px;flex-basis:38px}.match-scoreboard{grid-template-columns:1fr 80px 1fr}
}

@media (max-width: 980px) {
    body { padding-bottom: 77px; }
    .app-shell { display:block; padding:0; min-height:auto; }
    .desktop-sidebar,.desktop-betslip,.desktop-head { display:none; }
    .main-content { padding: 12px 14px 20px; }
    .mobile-topbar { position:sticky;top:0;z-index:50;height:72px;padding:0 18px;display:flex;align-items:center;justify-content:space-between;background:white;border-bottom:1px solid var(--line); }
    .mobile-topbar .brand { font-size:29px; }
    .topbar-actions { display:flex;align-items:center;gap:9px;min-width:0; }.topbar-actions .balance-pill{max-width:170px;overflow:hidden;text-overflow:ellipsis;font-size:13px}.icon-button{border:0;background:transparent;color:#526067;font-size:38px;line-height:1;cursor:pointer}
    .mobile-auth-actions { display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px; }.mobile-auth-actions .btn{font-size:16px}
    .mobile-bottom-nav { position:fixed;z-index:60;left:0;right:0;bottom:0;height:77px;padding:4px max(10px,env(safe-area-inset-right)) max(4px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));display:grid;grid-template-columns:repeat(5,1fr);background:white;border-top:1px solid var(--line);box-shadow:0 -8px 25px rgba(25,42,50,.08); }
    .mobile-bottom-nav>a,.mobile-bottom-nav>button{min-width:0;border:0;background:transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;color:#64737a;font-weight:700;font-size:11px;cursor:pointer}.mobile-bottom-nav i{position:relative;font-size:25px;font-style:normal;line-height:1.15}.mobile-bottom-nav .active{color:var(--green-dark)}.mobile-bottom-nav .coupon-nav{position:relative}.mobile-bottom-nav .coupon-nav i{width:57px;height:57px;margin-top:-29px;border-radius:50%;background:var(--green);color:white;display:grid;place-items:center;border:5px solid white;font-size:17px}.mobile-bottom-nav .coupon-nav b{font-style:italic}.mobile-bottom-nav .coupon-nav em{position:absolute;right:-3px;top:-4px;min-width:18px;height:18px;padding:0 4px;border-radius:999px;background:var(--danger);color:white;display:grid;place-items:center;font-size:9px;font-style:normal;border:2px solid white}.mobile-bottom-nav .coupon-nav span{margin-top:2px}
    .sport-shortcuts { margin:-1px -14px 13px;padding:14px 14px;border-radius:0;box-shadow:none;display:flex;overflow-x:auto;scrollbar-width:none; }.sport-shortcuts a{flex:0 0 72px}.sport-shortcuts i{width:57px;height:57px}
    .promo-scroller { margin:0 -14px;padding:0 14px; }.promo-card{min-width:83%;min-height:205px;padding:23px}.promo-card h1,.promo-card h2{font-size:31px}.promo-ball,.promo-rocket{font-size:85px;right:16px}
    .game-scroller{margin:0 -14px;padding:0 14px}.game-card{flex-basis:190px;height:128px}.game-art{font-size:64px}
    .event-tabs{top:75px;margin-left:-5px;margin-right:-5px}
    .auth-shell { min-height:auto;grid-template-columns:1fr; }.auth-copy{display:none}.form-card{padding:28px 20px}
    .admin-heading{padding:20px}.metric-grid{grid-template-columns:repeat(2,1fr)}.settings-grid,.league-admin-grid{grid-template-columns:repeat(2,1fr)}
}

@media (max-width: 620px) {
    .main-content { padding: 10px 14px 18px; }
    .mobile-topbar { height:68px; }.mobile-topbar .brand{font-size:27px}.balance-pill{min-height:39px;padding-right:10px}.balance-pill b{width:30px;height:30px}
    .promo-card{min-width:91%;min-height:190px}.promo-card p{font-size:12px;max-width:70%}.promo-card a{font-size:12px}.promo-ball,.promo-rocket{opacity:.78}
    .section-heading h2{font-size:21px}.game-card{flex-basis:178px;height:120px}
    .event-tabs{top:71px;border-radius:15px}.event-tabs a{min-width:75px;font-size:0}.event-tabs a i{font-size:23px}.event-tabs a.active{font-size:11px;min-width:145px}
    .match-card{margin-left:0;margin-right:0;border-radius:22px;padding:12px 14px 15px}.match-meta{font-size:13px}.match-meta button{width:31px;height:31px;font-size:18px}.match-scoreboard{grid-template-columns:1fr 66px 1fr;gap:5px;min-height:86px}.team{font-size:13px;gap:6px}.team img,.team i{width:36px;height:36px;flex-basis:36px}.score strong{font-size:24px}.match-state{font-size:12px}.odd-button{min-height:51px;padding:6px 10px}.odd-button strong{font-size:16px}
    .league-pills{grid-template-columns:1fr}.page-hero.compact{min-height:140px;padding:22px}.page-hero>i{font-size:68px}.page-hero h1{font-size:28px}.page-hero p{font-size:12px;max-width:75%}
    .detail-scoreboard{grid-template-columns:1fr 92px 1fr;gap:7px;padding:25px 0 12px}.detail-scoreboard img,.detail-scoreboard>div i{width:55px;height:55px}.detail-scoreboard>div strong{font-size:12px}.detail-scoreboard section b{font-size:31px}.match-detail-hero{padding:16px}.market-odds{grid-template-columns:repeat(2,1fr)}
    .form-grid{grid-template-columns:1fr}.form-card{padding:24px 17px}.mobile-slip-page{margin:12px -2px 0;padding:15px}
    .bet-row{grid-template-columns:1fr 15px}.bet-row dl{grid-column:1/-1;justify-content:space-between;padding-top:8px;border-top:1px solid var(--line)}.bet-row>b{grid-column:2;grid-row:1}.info-grid{grid-template-columns:1fr}
    .wallet-hero{min-height:160px;padding:23px}.wallet-hero>i{font-size:70px}.wallet-actions{gap:8px}.wallet-actions button,.wallet-actions a{min-height:72px;font-size:12px}.payment-panel form{grid-template-columns:1fr}.transaction-list article{grid-template-columns:39px 1fr}.transaction-list article>b{grid-column:2;text-align:left;font-size:12px}
    .casino-hero{min-height:230px;padding:24px}.casino-hero h1{font-size:39px}.casino-hero p{font-size:12px;max-width:75%}.casino-symbol{font-size:90px}.casino-grid{grid-template-columns:repeat(2,1fr);gap:9px}.casino-tile{min-height:155px;padding:12px}.casino-tile>span{font-size:62px}.casino-tile div strong{font-size:14px}.casino-tile div small{font-size:10px}
    .admin-heading{display:grid}.admin-heading h1{font-size:28px}.metric-grid{gap:8px}.metric-grid article{min-height:100px;padding:11px;grid-template-columns:36px 1fr}.metric-grid strong{font-size:21px}.sync-actions{grid-template-columns:1fr 1fr}.settings-grid,.league-admin-grid{grid-template-columns:1fr}.admin-card{padding:15px}
}

@media (max-width: 370px) {
    .main-content{padding-left:10px;padding-right:10px}.mobile-topbar{padding:0 12px}.mobile-topbar .brand{font-size:24px}.topbar-actions .balance-pill{font-size:11px}.sport-shortcuts{margin-left:-10px;margin-right:-10px}.team{font-size:11px}.team img,.team i{width:31px;height:31px;flex-basis:31px}.match-scoreboard{grid-template-columns:1fr 58px 1fr}.odds-grid{gap:6px}.odd-button{padding:5px 7px}.casino-grid{grid-template-columns:1fr 1fr}
}

/* Homepage compact visual pass — v1.1 */
.icon-button .ui-icon { width: 32px; height: 32px; }
.sport-shortcuts { gap: 8px; padding: 12px; margin-bottom: 11px; border-radius: 18px; }
.sport-shortcuts a { gap: 5px; font-size: 11px; }
.sport-shortcuts i { width: 47px; height: 47px; padding: 7px; overflow: hidden; line-height: 0; background: #f3f7f9; box-shadow: inset 0 0 0 1px rgba(80,103,114,.04); }
.sport-shortcuts i > .ui-icon { width: 32px; height: 32px; min-width: 32px; min-height: 32px; max-width: 32px; max-height: 32px; }
.sport-shortcuts a.active i,
.sport-shortcuts a:hover i { color: inherit; background: #f1fbdf; box-shadow: inset 0 0 0 2px rgba(114,205,0,.3), 0 6px 15px rgba(77,128,0,.1); transform: translateY(-1px); }

.promo-scroller { gap: 10px; }
.promo-card { min-width: min(500px, 72%); min-height: 184px; border-radius: 20px; padding: 21px 22px; }
.promo-card small,
.promo-card h1,
.promo-card h2,
.promo-card p,
.promo-card a { z-index: 2; }
.promo-card small { font-size: 10px; letter-spacing: 1.25px; }
.promo-card h1,
.promo-card h2 { margin: 6px 0; font-size: clamp(25px, 3.3vw, 35px); letter-spacing: -1.1px; }
.promo-card p { max-width: 310px; margin-bottom: 13px; font-size: 13px; }
.promo-card a { padding: 7px 12px; font-size: 12px; gap: 5px; }
.promo-card a b { font-size: 15px; line-height: 1; }
.promo-art { position: absolute; z-index: 1; right: 23px; bottom: 14px; width: 105px; height: 105px; filter: drop-shadow(0 12px 16px rgba(0,0,0,.34)); transform: rotate(-7deg); }
.promo-art .ui-icon { width: 100%; height: 100%; }
.promo-rocket { width: 112px; height: 112px; color: inherit; font-size: inherit; transform: rotate(3deg); }

.home-page .section-block { margin-top: 11px; }
.home-page .section-heading { margin-bottom: 9px; }
.home-page .section-heading h2 { font-size: 19px; letter-spacing: -.45px; }
.home-page .section-heading h2 em { padding: 2px 7px; border-width: 1.5px; border-radius: 8px; font-size: 11px; }
.home-page .section-heading > a { padding: 6px 11px; border-radius: 10px; font-size: 11px; }
.game-zone .section-heading { padding: 0 5px; }
.game-scroller { gap: 9px; }
.game-card { flex-basis: 180px; height: 108px; border-radius: 17px; padding: 12px; }
.game-card strong { font-size: 15px; line-height: 1.15; }
.game-card small { font-size: 10px; }
.game-art { right: 9px; top: 3px; width: 58px; height: 58px; font-size: inherit; transform: rotate(-7deg); }
.game-art .ui-icon { width: 100%; height: 100%; }

.event-tabs { margin: 11px 0; padding: 5px; gap: 4px; border-radius: 14px; }
.event-tabs a { min-width: 92px; min-height: 39px; border-radius: 10px; gap: 6px; font-size: 10px; }
.event-tabs i { width: 22px; height: 22px; font-size: inherit; display: grid; place-items: center; }
.event-tabs i .ui-icon { width: 22px; height: 22px; }

.home-page .matches-section { margin-top: 10px; }
.home-page .matches-section > .section-heading { padding: 0 3px; }
.home-page .match-card { margin-bottom: 8px; padding: 9px 11px 11px; border-radius: 17px; box-shadow: 0 5px 18px rgba(23,42,51,.05); }
.home-page .match-meta { min-height: 28px; gap: 7px; font-size: 11px; }
.home-page .match-meta > a { gap: 6px; }
.home-page .ball-icon { width: 20px; height: 20px; flex: 0 0 20px; font-size: inherit; }
.home-page .ball-icon .ui-icon { width: 20px; height: 20px; }
.home-page .match-meta > div { gap: 4px; }
.home-page .match-meta button { width: 27px; height: 27px; padding: 5px; }
.home-page .match-meta button .ui-icon { width: 17px; height: 17px; }
.home-page .match-scoreboard { min-height: 68px; grid-template-columns: 1fr 62px 1fr; gap: 6px; padding: 5px 2px 2px; }
.home-page .team { gap: 6px; font-size: 12px; }
.home-page .team img,
.home-page .team i { width: 32px; height: 32px; flex-basis: 32px; }
.home-page .score strong { font-size: 21px; }
.home-page .score span { font-size: 9px; }
.home-page .match-state { margin: 0 0 7px; font-size: 10.5px; }
.home-page .market-title { margin-bottom: 5px; }
.home-page .market-title strong { font-size: 14px; }
.home-page .market-title small { font-size: 9px; }
.home-page .odds-grid { gap: 6px; }
.home-page .odd-button { min-height: 40px; padding: 4px 8px; border-radius: 10px; }
.home-page .odd-button span { font-size: 11px; }
.home-page .odd-button strong { font-size: 14px; }
.home-page .markets-unavailable { min-height: 39px; border-radius: 10px; font-size: 11px; }
.home-page .empty-state { min-height: 136px; padding: 19px; border-radius: 17px; }
.home-page .empty-state > i { width: 45px; height: 45px; padding: 8px; margin-bottom: 8px; }
.home-page .empty-state > i .ui-icon { width: 100%; height: 100%; }
.home-page .empty-state strong { font-size: 15px; }
.home-page .empty-state p { margin: 3px 0 8px; font-size: 11px; }
.home-page .leagues-block { padding: 14px; }
.home-page .league-pills { gap: 7px; }
.home-page .league-pills a { min-height: 56px; grid-template-columns: 31px 1fr auto; gap: 7px; padding: 8px; border-radius: 12px; }
.home-page .league-pills img,
.home-page .league-pills > a > span { width: 29px; height: 29px; }
.home-page .league-pills .ui-icon { width: 29px; height: 29px; }

@media (max-width: 980px) {
    body { padding-bottom: calc(65px + env(safe-area-inset-bottom)); }
    .mobile-topbar { height: 62px; padding: 0 14px; }
    .mobile-topbar .brand { font-size: 25px; }
    .topbar-actions { gap: 6px; }
    .topbar-actions .balance-pill { min-height: 36px; padding: 4px 10px 4px 5px; font-size: 12px; }
    .topbar-actions .balance-pill b { width: 28px; height: 28px; font-size: 19px; }
    .icon-button { padding: 3px; }
    .icon-button .ui-icon { width: 29px; height: 29px; }
    .main-content { padding: 8px 12px 16px; }
    .mobile-auth-actions { gap: 8px; margin-bottom: 9px; }
    .mobile-auth-actions .btn { min-height: 38px; font-size: 13px; }
    .mobile-bottom-nav { height: calc(65px + env(safe-area-inset-bottom)); padding-top: 3px; }
    .mobile-bottom-nav > a,
    .mobile-bottom-nav > button { gap: 0; font-size: 10px; }
    .mobile-bottom-nav i { width: 23px; height: 23px; font-size: inherit; }
    .mobile-bottom-nav i > .ui-icon { width: 23px; height: 23px; }
    .mobile-bottom-nav .coupon-nav i { width: 49px; height: 49px; margin-top: -23px; border-width: 4px; font-size: 15px; }
    .mobile-bottom-nav .coupon-nav span { margin-top: 1px; }
    .mobile-bottom-nav .coupon-nav em { right: -3px; top: -3px; }

    .sport-shortcuts { margin: -1px -12px 9px; padding: 9px 10px 8px; gap: 5px; }
    .sport-shortcuts a { flex: 0 0 61px; gap: 4px; font-size: 10px; }
    .sport-shortcuts i { width: 44px; height: 44px; padding: 6px; }
    .sport-shortcuts i > .ui-icon { width: 30px; height: 30px; min-width: 30px; min-height: 30px; max-width: 30px; max-height: 30px; }
    .promo-scroller { margin: 0 -12px; padding: 0 12px; gap: 9px; }
    .promo-card { min-width: 78%; min-height: 152px; padding: 16px 17px; border-radius: 18px; }
    .promo-card h1,
    .promo-card h2 { margin: 5px 0; font-size: 25px; }
    .promo-card p { max-width: 65%; margin-bottom: 10px; font-size: 11px; line-height: 1.35; }
    .promo-card a { padding: 6px 10px; font-size: 11px; }
    .promo-art { right: 13px; bottom: 12px; width: 78px; height: 78px; }
    .promo-rocket { width: 84px; height: 84px; }
    .game-scroller { margin: 0 -12px; padding: 0 12px; }
    .game-card { flex-basis: 160px; height: 98px; }
    .game-art { width: 52px; height: 52px; }
    .event-tabs { top: 64px; margin: 9px -2px; }
}

@media (max-width: 620px) {
    .mobile-topbar { height: 60px; }
    .main-content { padding: 7px 12px 14px; }
    .sport-shortcuts { margin-left: -12px; margin-right: -12px; }
    .promo-card { min-width: 82%; min-height: 148px; }
    .promo-card small { font-size: 8.5px; }
    .promo-card h1,
    .promo-card h2 { font-size: 23px; }
    .home-page .section-heading h2 { font-size: 18px; }
    .event-tabs { top: 62px; }
    .event-tabs a { min-width: 54px; min-height: 37px; font-size: 0; }
    .event-tabs a.active { min-width: 105px; font-size: 9px; }
    .event-tabs i,
    .event-tabs i .ui-icon { width: 21px; height: 21px; }
    .home-page .match-card { padding: 9px 10px 10px; border-radius: 16px; }
    .home-page .match-scoreboard { grid-template-columns: 1fr 57px 1fr; min-height: 65px; }
    .home-page .team { font-size: 11.5px; }
    .home-page .team img,
    .home-page .team i { width: 30px; height: 30px; flex-basis: 30px; }
}

@media (max-width: 370px) {
    .main-content { padding-left: 9px; padding-right: 9px; }
    .sport-shortcuts { margin-left: -9px; margin-right: -9px; }
    .sport-shortcuts a { flex-basis: 58px; }
    .promo-scroller,
    .game-scroller { margin-left: -9px; margin-right: -9px; padding-left: 9px; padding-right: 9px; }
    .promo-card { min-width: 86%; }
    .game-card { flex-basis: 151px; }
    .home-page .team { font-size: 10.5px; }
    .home-page .team img,
    .home-page .team i { width: 28px; height: 28px; flex-basis: 28px; }
}

/* Compact, complete navigation — v1.2 */
body.drawer-open { overflow: hidden; }

@media (min-width: 981px) {
    .app-shell {
        grid-template-columns: 206px minmax(480px, 1fr) 310px;
        gap: 14px;
        padding: 14px;
        transition: grid-template-columns .22s ease;
    }
    .desktop-sidebar,
    .desktop-betslip { top: 14px; height: calc(100vh - 28px); }
    .desktop-sidebar {
        padding: 14px 10px 12px;
        border-radius: 20px;
        overflow: hidden;
        transition: padding .22s ease;
    }
    .sidebar-brand-row {
        min-height: 43px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 6px;
        padding: 0 3px;
        margin-bottom: 5px;
        flex: 0 0 auto;
    }
    .desktop-brand {
        min-width: 0;
        margin: 0;
        font-size: 25px;
        letter-spacing: -2px;
    }
    .desktop-brand b { color: var(--ink); font: inherit; }
    .desktop-brand em {
        display: none;
        width: 40px;
        height: 40px;
        place-items: center;
        border-radius: 13px;
        color: #193400;
        background: var(--green);
        font-size: 16px;
        font-weight: 950;
        letter-spacing: -.8px;
    }
    .sidebar-collapse-toggle {
        width: 31px;
        height: 31px;
        padding: 0;
        flex: 0 0 31px;
        border: 0;
        border-radius: 50%;
        background: transparent;
        cursor: pointer;
    }
    .sidebar-collapse-toggle .ui-icon { width: 31px; height: 31px; transition: transform .22s ease; }
    .sidebar-scroll {
        min-height: 0;
        flex: 1 1 auto;
        overflow-y: auto;
        overflow-x: hidden;
        padding: 0 1px 5px 0;
        scrollbar-width: thin;
        scrollbar-color: #d6e0e4 transparent;
    }
    .side-group { margin: 0; }
    .side-label {
        margin: 9px 10px 4px;
        color: #9aa8ae;
        font-size: 8.5px;
        line-height: 1.2;
        letter-spacing: 1.15px;
    }
    .side-group:first-child .side-label { margin-top: 3px; }
    .side-nav { gap: 3px; }
    .side-nav a {
        min-height: 39px;
        gap: 9px;
        padding: 0 9px;
        border-radius: 11px;
        font-size: 12px;
        white-space: nowrap;
    }
    .side-nav a > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
    .side-nav a i { width: 25px; height: 25px; flex: 0 0 25px; }
    .side-nav a i .ui-icon { width: 23px; height: 23px; }
    .side-nav a.active { box-shadow: inset 3px 0 0 var(--green); }
    .sidebar-account {
        margin-top: 8px;
        padding: 9px 2px 0;
        gap: 6px;
        flex: 0 0 auto;
    }
    .wallet-summary {
        min-height: 49px;
        grid-template-columns: 28px minmax(0, 1fr);
        align-items: center;
        gap: 7px;
        padding: 7px 9px;
        border-radius: 12px;
    }
    .wallet-summary > i { width: 27px; height: 27px; display: grid; place-items: center; }
    .wallet-summary > i .ui-icon { width: 25px; height: 25px; }
    .wallet-summary > span { min-width: 0; display: grid; }
    .wallet-summary small { font-size: 8.5px; }
    .wallet-summary strong { overflow: hidden; text-overflow: ellipsis; font-size: 12px; white-space: nowrap; }
    .user-row { gap: 7px; margin: 0; padding: 2px 5px; }
    .avatar { width: 34px; height: 34px; flex: 0 0 34px; }
    .user-row strong { font-size: 11px; }
    .user-row small { font-size: 8.5px; }
    .sidebar-action,
    .sidebar-auth-link {
        width: 100%;
        min-height: 38px;
        padding: 0 9px;
        border: 0;
        border-radius: 11px;
        display: flex;
        align-items: center;
        gap: 9px;
        color: #53636a;
        background: #f2f6f7;
        font-size: 11px;
        font-weight: 800;
        cursor: pointer;
    }
    .sidebar-auth-link.register { color: #2f5e00; background: var(--green-soft); }
    .sidebar-action i,
    .sidebar-auth-link i { width: 24px; height: 24px; flex: 0 0 24px; font-style: normal; }
    .sidebar-action .ui-icon,
    .sidebar-auth-link .ui-icon { width: 24px; height: 24px; }
    .sidebar-action span,
    .sidebar-auth-link span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

    html.sidebar-collapsed .app-shell { grid-template-columns: 72px minmax(480px, 1fr) 310px; }
    html.sidebar-collapsed .desktop-sidebar { padding-left: 7px; padding-right: 7px; }
    html.sidebar-collapsed .sidebar-brand-row { flex-direction: column; justify-content: flex-start; gap: 5px; min-height: 77px; padding: 0; }
    html.sidebar-collapsed .desktop-brand span,
    html.sidebar-collapsed .desktop-brand b { display: none; }
    html.sidebar-collapsed .desktop-brand em { display: grid; }
    html.sidebar-collapsed .sidebar-collapse-toggle .ui-icon { transform: rotate(180deg); }
    html.sidebar-collapsed .side-label {
        width: 30px;
        height: 1px;
        margin: 7px auto 5px;
        overflow: hidden;
        color: transparent;
        background: var(--line);
    }
    html.sidebar-collapsed .side-nav a {
        width: 44px;
        min-height: 40px;
        margin: 0 auto;
        padding: 0;
        justify-content: center;
    }
    html.sidebar-collapsed .side-nav a > span { display: none; }
    html.sidebar-collapsed .side-nav a i { width: 27px; height: 27px; }
    html.sidebar-collapsed .side-nav a i .ui-icon { width: 25px; height: 25px; }
    html.sidebar-collapsed .side-nav a.active { box-shadow: inset 2px 0 0 var(--green); }
    html.sidebar-collapsed .sidebar-account { padding-left: 0; padding-right: 0; }
    html.sidebar-collapsed .wallet-summary,
    html.sidebar-collapsed .sidebar-action,
    html.sidebar-collapsed .sidebar-auth-link {
        width: 44px;
        min-height: 42px;
        height: 42px;
        margin: 0 auto;
        padding: 0;
        display: grid;
        place-items: center;
    }
    html.sidebar-collapsed .wallet-summary { grid-template-columns: 1fr; }
    html.sidebar-collapsed .wallet-summary > span,
    html.sidebar-collapsed .sidebar-action span,
    html.sidebar-collapsed .sidebar-auth-link span,
    html.sidebar-collapsed .user-row > div { display: none; }
    html.sidebar-collapsed .user-row { justify-content: center; padding: 0; }
}

@media (min-width: 981px) and (max-width: 1220px) {
    .app-shell { grid-template-columns: 190px minmax(440px, 1fr) 280px; gap: 12px; padding: 12px; }
    .desktop-sidebar,
    .desktop-betslip { top: 12px; height: calc(100vh - 24px); }
    .desktop-brand { font-size: 23px; }
    html.sidebar-collapsed .app-shell { grid-template-columns: 70px minmax(440px, 1fr) 280px; }
}

@media (max-width: 980px) {
    .mobile-topbar .menu-toggle { display: grid; place-items: center; }
    .topbar-actions .balance-pill { max-width: 125px; }
    .mobile-drawer {
        position: fixed;
        inset: 0;
        z-index: 90;
        display: block;
        padding: 0;
        overflow: hidden;
        background: transparent;
        backdrop-filter: none;
    }
    .drawer-backdrop {
        position: absolute;
        inset: 0;
        z-index: 0;
        width: 100%;
        height: 100%;
        padding: 0;
        border: 0;
        background: rgba(8, 16, 20, .58);
        opacity: 0;
        cursor: pointer;
        transition: opacity .22s ease;
    }
    .drawer-card {
        position: absolute;
        z-index: 1;
        inset: 0 auto 0 0;
        width: min(84vw, 292px);
        max-width: none;
        height: 100%;
        margin: 0;
        padding: max(11px, env(safe-area-inset-top)) 10px calc(10px + env(safe-area-inset-bottom));
        border-radius: 0 20px 20px 0;
        display: flex;
        flex-direction: column;
        gap: 0;
        overflow: hidden;
        background: #fff;
        box-shadow: 18px 0 44px rgba(8, 20, 26, .22);
        transform: translateX(-104%);
        transition: transform .22s ease;
        will-change: transform;
    }
    .mobile-drawer.is-open .drawer-backdrop { opacity: 1; }
    .mobile-drawer.is-open .drawer-card { transform: translateX(0); }
    .drawer-card:focus { outline: none; }
    .drawer-head {
        min-height: 45px;
        padding: 0 2px 8px 5px;
        border-bottom: 1px solid var(--line);
        flex: 0 0 auto;
    }
    .drawer-brand { font-size: 23px; letter-spacing: -1.8px; }
    .drawer-close {
        width: 34px;
        height: 34px;
        border: 0;
        border-radius: 11px;
        display: grid;
        place-items: center;
        color: #526067;
        background: #edf3f5;
        font-size: 24px;
        line-height: 1;
        cursor: pointer;
    }
    .drawer-card > .drawer-user-card {
        min-height: 58px;
        margin: 8px 1px 5px;
        padding: 7px 8px;
        border-radius: 13px;
        display: grid;
        grid-template-columns: 34px minmax(0, 1fr);
        align-items: center;
        gap: 7px;
        color: #fff;
        background: linear-gradient(135deg, #172126, #294233);
        flex: 0 0 auto;
    }
    .drawer-card > .drawer-user-card > span:nth-child(2) { min-width: 0; display: grid; }
    .drawer-card > .drawer-user-card strong,
    .drawer-card > .drawer-user-card small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .drawer-card > .drawer-user-card strong { font-size: 11px; }
    .drawer-card > .drawer-user-card small { color: #b7c3c7; font-size: 8.5px; }
    .drawer-card > .drawer-user-card > b { grid-column: 1 / -1; padding-left: 41px; color: #aeea52; font-size: 11px; }
    .drawer-auth-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 6px;
        margin: 8px 1px 5px;
        flex: 0 0 auto;
    }
    .drawer-auth-grid a {
        min-height: 40px;
        padding: 0 8px;
        border-radius: 11px;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        background: #eef3f5;
        color: #45545b;
        font-size: 10px;
        font-weight: 850;
    }
    .drawer-auth-grid a.register { color: #2d5c00; background: var(--green-soft); }
    .drawer-auth-grid i,
    .drawer-auth-grid .ui-icon { width: 23px; height: 23px; flex: 0 0 23px; }
    .drawer-scroll {
        min-height: 0;
        flex: 1 1 auto;
        overflow-y: auto;
        overflow-x: hidden;
        overscroll-behavior: contain;
        padding: 0 2px 6px 1px;
        scrollbar-width: thin;
        scrollbar-color: #d7e0e4 transparent;
    }
    .drawer-group { margin: 0; }
    .drawer-label {
        margin: 8px 8px 4px;
        color: #9aa6ac;
        font-size: 8px;
        font-weight: 900;
        letter-spacing: 1.15px;
        text-transform: uppercase;
    }
    .drawer-nav { display: grid; gap: 2px; }
    .drawer-nav a {
        min-height: 39px;
        padding: 0 8px;
        border: 1px solid transparent;
        border-radius: 10px;
        display: grid;
        grid-template-columns: 27px minmax(0, 1fr) auto;
        align-items: center;
        gap: 8px;
        color: #53636a;
        background: #f8fafb;
        font-size: 11px;
        font-weight: 800;
    }
    .drawer-nav a i,
    .drawer-nav a i .ui-icon { width: 25px; height: 25px; }
    .drawer-nav a i { display: grid; place-items: center; font-style: normal; }
    .drawer-nav a > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .drawer-nav a > b { color: #a1adb2; font-size: 17px; font-weight: 500; }
    .drawer-nav a.active {
        border-color: #d6edb2;
        color: #326200;
        background: var(--green-soft);
        box-shadow: inset 3px 0 0 var(--green);
    }
    .drawer-footer {
        padding: 7px 2px 0;
        border-top: 1px solid var(--line);
        display: grid;
        gap: 5px;
        flex: 0 0 auto;
    }
    .drawer-footer form { margin: 0; }
    .drawer-footer button {
        width: 100%;
        min-height: 37px;
        padding: 0 9px;
        border: 0;
        border-radius: 10px;
        display: flex;
        align-items: center;
        gap: 8px;
        color: #a13b43;
        background: #fff0f1;
        font-size: 10px;
        font-weight: 850;
        cursor: pointer;
    }
    .drawer-footer button i,
    .drawer-footer button .ui-icon { width: 23px; height: 23px; }
    .drawer-footer > small { color: #9aa6ac; text-align: center; font-size: 8px; }
}

@media (max-width: 370px) {
    .topbar-actions .balance-pill { max-width: 92px; }
    .mobile-topbar .menu-toggle .ui-icon,
    .mobile-topbar .search-toggle .ui-icon { width: 26px; height: 26px; }
    .drawer-card { width: min(86vw, 278px); }
}

@media (prefers-reduced-motion: reduce) {
    .app-shell,
    .sidebar-collapse-toggle .ui-icon,
    .drawer-backdrop,
    .drawer-card { transition: none !important; }
}

.sidebar-collapse-toggle:focus-visible,
.drawer-close:focus-visible,
.drawer-nav a:focus-visible,
.drawer-auth-grid a:focus-visible,
.sidebar-action:focus-visible,
.sidebar-auth-link:focus-visible {
    outline: 3px solid rgba(130, 207, 0, .45);
    outline-offset: 2px;
}

/* Full menu architecture and system updater — v1.3 */
.admin-heading-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.btn:disabled { opacity: .52; cursor: not-allowed; transform: none; }

.module-hero {
    min-height: 185px;
    padding: 27px;
    border-radius: 24px;
    display: flex;
    align-items: center;
    gap: 22px;
    color: #fff;
    background: radial-gradient(circle at 86% 18%, rgba(130,207,0,.32), transparent 30%), linear-gradient(130deg,#10191d,#24372d 72%,#5d9300);
    box-shadow: var(--shadow);
}
.module-hero > i {
    width: 82px;
    height: 82px;
    padding: 14px;
    border-radius: 23px;
    display: grid;
    place-items: center;
    flex: 0 0 82px;
    background: rgba(255,255,255,.94);
    box-shadow: 0 15px 28px rgba(0,0,0,.22);
    font-style: normal;
}
.module-hero > i .ui-icon { width: 100%; height: 100%; }
.module-hero h1 { margin: 5px 0 6px; font-size: clamp(28px,4vw,40px); line-height: 1; letter-spacing: -1.4px; }
.module-hero p { max-width: 620px; margin: 0; color: #cad6d1; }
.module-coming-card {
    margin-top: 14px;
    padding: 24px;
    border-radius: 21px;
    background: #fff;
    box-shadow: var(--shadow);
}
.module-coming-card h2 { margin: 10px 0 4px; font-size: 21px; }
.module-coming-card p { max-width: 720px; margin: 0 0 16px; color: var(--muted); }
.module-status { display: inline-flex; align-items: center; gap: 7px; color: #477c06; font-size: 10px; font-weight: 900; letter-spacing: .7px; text-transform: uppercase; }
.module-status i { width: 8px; height: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 4px rgba(130,207,0,.16); }

.update-status-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; margin-top: 14px; }
.update-status-grid article {
    min-height: 96px;
    padding: 13px;
    border-radius: 18px;
    display: grid;
    grid-template-columns: 38px 1fr;
    align-content: center;
    align-items: center;
    gap: 2px 10px;
    background: #fff;
    box-shadow: 0 7px 22px rgba(24,44,54,.06);
}
.update-status-grid i { grid-row: 1 / 3; width: 38px; height: 38px; display: grid; place-items: center; font-style: normal; }
.update-status-grid i .ui-icon { width: 36px; height: 36px; }
.update-status-grid span { color: var(--muted); font-size: 10px; }
.update-status-grid strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; font-size: 14px; white-space: nowrap; }
.update-upload-card form { display: grid; gap: 12px; }
.update-dropzone {
    min-height: 150px;
    padding: 20px;
    border: 2px dashed #cfdcdf;
    border-radius: 18px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    text-align: center;
    background: #f8fbfb;
    cursor: pointer;
}
.update-dropzone:hover { border-color: var(--green); background: #fbfff5; }
.update-dropzone > i { width: 47px; height: 47px; display: grid; place-items: center; font-style: normal; }
.update-dropzone > i .ui-icon { width: 45px; height: 45px; }
.update-dropzone strong { font-size: 15px; }
.update-dropzone span { color: var(--muted); font-size: 10px; }
.update-dropzone input { max-width: 100%; margin-top: 8px; font-size: 11px; }
.update-confirm { display: flex; align-items: flex-start; gap: 9px; color: #4e5d64; font-size: 11px; }
.update-confirm input { width: 17px; height: 17px; margin: 0; flex: 0 0 17px; accent-color: var(--green); }
.update-warning { margin-bottom: 12px; padding: 11px 13px; border: 1px solid #f0cf80; border-radius: 12px; display: grid; color: #755100; background: #fff7dc; font-size: 11px; }
.table-subline { display: block; color: var(--muted); font-size: 9px; font-weight: 500; }
.table-download { color: var(--green-dark); font-size: 11px; font-weight: 850; }

@media (max-width: 980px) {
    .mobile-topbar .icon-button { display: grid; place-items: center; }
    .drawer-menu-filter {
        min-height: 40px;
        margin: 7px 1px 3px;
        padding: 0 9px;
        border: 1px solid var(--line);
        border-radius: 11px;
        display: grid;
        grid-template-columns: 24px 1fr;
        align-items: center;
        gap: 7px;
        background: #f7fafb;
        flex: 0 0 auto;
    }
    .drawer-menu-filter i,
    .drawer-menu-filter .ui-icon { width: 23px; height: 23px; }
    .drawer-menu-filter input { min-width: 0; width: 100%; padding: 0; border: 0; outline: 0; color: var(--ink); background: transparent; font-size: 10.5px; }
    .drawer-menu-filter input::placeholder { color: #94a2a8; }
    .module-hero { min-height: 142px; padding: 18px; gap: 14px; border-radius: 18px; }
    .module-hero > i { width: 58px; height: 58px; padding: 10px; border-radius: 17px; flex-basis: 58px; }
    .module-hero h1 { margin: 3px 0 4px; font-size: 24px; }
    .module-hero p { font-size: 10.5px; }
    .module-coming-card { margin-top: 10px; padding: 17px; border-radius: 17px; }
    .module-coming-card h2 { font-size: 17px; }
    .module-coming-card p { font-size: 11px; }
    .update-status-grid { margin-top: 10px; }
    .update-status-grid article { min-height: 78px; padding: 10px; grid-template-columns: 31px 1fr; gap: 1px 7px; }
    .update-status-grid i,
    .update-status-grid i .ui-icon { width: 30px; height: 30px; }
    .update-status-grid strong { font-size: 11px; }
    .update-dropzone { min-height: 128px; padding: 15px; }
}

@media (max-width: 620px) {
    .admin-heading-actions { width: 100%; justify-content: stretch; }
    .admin-heading-actions .btn { flex: 1; min-width: 0; padding: 0 10px; font-size: 10px; }
    .update-status-grid { grid-template-columns: 1fr; gap: 6px; }
    .update-status-grid article { min-height: 62px; }
    .module-hero { align-items: flex-start; }
}

/* Real football discovery modules — v1.4 */
.match-meta-action,
.favorite-toggle {
    width: 34px;
    height: 34px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    display: grid;
    place-items: center;
    color: var(--green-dark);
    background: #eff4f6;
    cursor: pointer;
    transition: transform .16s, color .16s, background .16s;
}
.match-meta-action .ui-icon,
.favorite-toggle .ui-icon { width: 20px; height: 20px; }
.match-meta-action:hover,
.favorite-toggle:hover { transform: translateY(-1px); background: var(--green-soft); }
.favorite-toggle.is-active { color: #d58a00; background: #fff2ca; box-shadow: inset 0 0 0 1px #f3d684; }
.favorite-toggle:disabled { opacity: .52; cursor: wait; transform: none; }
.result-detail-link {
    min-height: 48px;
    padding: 0 14px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    color: #526168;
    background: #f2f6f7;
    font-size: 12px;
}
.result-detail-link strong { color: var(--green-dark); }
.detail-favorite { margin-left: auto; flex: 0 0 34px; }
.detail-league > b { margin-left: 0; }

.football-discovery-hero { min-height: 158px; }
.football-summary-grid,
.statistics-kpi-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 10px;
    margin-top: 12px;
}
.football-summary-grid article {
    min-height: 82px;
    padding: 12px 14px;
    border-radius: 17px;
    display: grid;
    grid-template-columns: 38px 1fr auto;
    align-items: center;
    gap: 2px 10px;
    background: #fff;
    box-shadow: 0 7px 22px rgba(24,44,54,.055);
}
.football-summary-grid i { grid-row: 1 / 3; width: 38px; height: 38px; padding: 8px; border-radius: 12px; color: var(--green-dark); background: var(--green-soft); }
.football-summary-grid i .ui-icon { width: 100%; height: 100%; }
.football-summary-grid span { color: var(--muted); font-size: 11px; }
.football-summary-grid strong { grid-row: 1 / 3; grid-column: 3; font-size: 24px; }

.football-filter-card,
.football-search-form,
.statistics-header-card,
.result-day,
.search-result-count {
    margin-top: 12px;
    border-radius: 19px;
    background: #fff;
    box-shadow: 0 7px 24px rgba(24,44,54,.055);
}
.football-filter-card { padding: 14px; }
.range-shortcuts { display: flex; gap: 7px; overflow-x: auto; padding-bottom: 9px; scrollbar-width: none; }
.range-shortcuts::-webkit-scrollbar { display: none; }
.range-shortcuts a { flex: 0 0 auto; padding: 7px 11px; border-radius: 999px; color: #4e5d64; background: #eef3f5; font-size: 11px; font-weight: 800; }
.range-shortcuts a:hover { color: #365f00; background: var(--green-soft); }
.football-filter-form { display: grid; grid-template-columns: 1fr 1fr 1.4fr auto; gap: 9px; align-items: end; }
.football-filter-form label { min-width: 0; display: grid; gap: 4px; }
.football-filter-form label > span { color: var(--muted); font-size: 10px; font-weight: 750; }
.football-filter-form input,
.football-filter-form select {
    min-width: 0;
    width: 100%;
    height: 42px;
    padding: 0 10px;
    border: 1px solid var(--line);
    border-radius: 11px;
    outline: 0;
    color: var(--ink);
    background: #f8fafb;
    font-size: 12px;
}
.football-filter-form input:focus,
.football-filter-form select:focus,
.football-search-form input:focus { border-color: var(--green); box-shadow: 0 0 0 3px rgba(130,207,0,.12); }

.result-day { padding: 15px; }
.result-day > .section-heading { margin-bottom: 10px; }
.result-day > .section-heading h2 { font-size: 16px; }
.result-list { display: grid; gap: 7px; }
.result-card { position: relative; min-height: 91px; padding: 10px 48px 10px 12px; border: 1px solid #e7edef; border-radius: 15px; background: #fbfcfc; }
.result-meta { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: var(--muted); font-size: 9px; }
.result-meta span { min-width: 0; display: flex; align-items: center; gap: 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.result-meta img { width: 15px; height: 15px; object-fit: contain; }
.result-meta b { padding: 2px 6px; border-radius: 999px; color: #426a0a; background: var(--green-soft); font-size: 8px; }
.result-card > a { min-height: 56px; display: grid; grid-template-columns: 1fr 75px 1fr; align-items: center; gap: 8px; }
.result-team { min-width: 0; display: flex; align-items: center; justify-content: flex-end; gap: 7px; text-align: right; font-size: 12px; font-weight: 750; }
.result-team.away { justify-content: flex-start; text-align: left; }
.result-team span { overflow: hidden; text-overflow: ellipsis; }
.result-team img { width: 29px; height: 29px; flex: 0 0 29px; object-fit: contain; }
.result-score { display: grid; place-items: center; }
.result-score strong { font-size: 20px; white-space: nowrap; }
.result-score small { color: var(--muted); font-size: 9px; }
.result-favorite { position: absolute; right: 9px; top: 50%; width: 30px; height: 30px; transform: translateY(-50%); }
.result-favorite:hover { transform: translateY(calc(-50% - 1px)); }

.football-search-form { min-height: 65px; padding: 10px; display: grid; grid-template-columns: 34px 1fr auto; align-items: center; gap: 8px; }
.football-search-form > i { width: 34px; height: 34px; padding: 7px; color: var(--green-dark); }
.football-search-form > i .ui-icon { width: 100%; height: 100%; }
.football-search-form input { min-width: 0; height: 43px; padding: 0 12px; border: 1px solid var(--line); border-radius: 11px; outline: 0; background: #f8fafb; }
.search-prompt { margin-top: 12px; }
.search-result-count { padding: 10px 14px; display: flex; align-items: baseline; gap: 7px; color: var(--muted); font-size: 11px; }
.search-result-count strong { color: var(--green-dark); font-size: 18px; }
.football-entity-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.football-entity-card { min-width: 0; min-height: 63px; padding: 9px 11px; border: 1px solid var(--line); border-radius: 14px; display: grid; grid-template-columns: 39px 1fr auto; align-items: center; gap: 9px; }
.football-entity-card > img,
.football-entity-card > i { width: 38px; height: 38px; object-fit: contain; }
.football-entity-card > i { padding: 7px; color: var(--green-dark); }
.football-entity-card > i .ui-icon { width: 100%; height: 100%; }
.football-entity-card > span { min-width: 0; display: grid; }
.football-entity-card strong,
.football-entity-card small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.football-entity-card strong { font-size: 12px; }
.football-entity-card small { color: var(--muted); font-size: 9px; }
.football-entity-card > b { color: var(--green-dark); }

.statistics-league-filter { margin-top: 12px; }
.statistics-header-card { min-height: 82px; padding: 12px 15px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.statistics-header-card > div { min-width: 0; display: flex; align-items: center; gap: 11px; }
.statistics-header-card img { width: 48px; height: 48px; object-fit: contain; }
.statistics-header-card span { min-width: 0; display: grid; }
.statistics-header-card small,
.statistics-header-card em { color: var(--muted); font-size: 9px; font-style: normal; }
.statistics-header-card strong { font-size: 17px; }
.statistics-header-card > a { flex: 0 0 auto; color: var(--green-dark); font-size: 11px; font-weight: 800; }
.statistics-kpi-grid { grid-template-columns: repeat(4,minmax(0,1fr)); }
.statistics-kpi-grid article { min-height: 91px; padding: 13px; border-radius: 17px; display: grid; background: #fff; box-shadow: 0 7px 22px rgba(24,44,54,.055); }
.statistics-kpi-grid span { color: var(--muted); font-size: 10px; }
.statistics-kpi-grid strong { font-size: 25px; }
.statistics-kpi-grid small { color: var(--muted-2); font-size: 8px; }
.compact-standings { padding: 15px; }
.statistics-results .section-heading > a { color: var(--green-dark); font-size: 10px; font-weight: 800; }
.mini-result-list { display: grid; gap: 5px; }
.mini-result-list a { min-height: 44px; padding: 6px 9px; border-radius: 11px; display: grid; grid-template-columns: 1fr 52px 1fr 34px; align-items: center; gap: 7px; background: #f5f8f9; font-size: 10px; }
.mini-result-list a span:first-child { text-align: right; }
.mini-result-list strong { text-align: center; font-size: 14px; }
.mini-result-list small { color: var(--muted); text-align: right; }

@media (max-width: 760px) {
    .football-discovery-hero { min-height: 126px; }
    .football-summary-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; }
    .football-summary-grid article { min-height: 66px; padding: 8px; grid-template-columns: 27px 1fr; gap: 1px 6px; }
    .football-summary-grid i { width: 27px; height: 27px; padding: 5px; }
    .football-summary-grid span { font-size: 8px; }
    .football-summary-grid strong { grid-row: 2; grid-column: 2; font-size: 17px; }
    .football-filter-form { grid-template-columns: 1fr 1fr; }
    .football-filter-form label:nth-child(3) { grid-column: 1 / -1; }
    .football-filter-form .btn { grid-column: 1 / -1; min-height: 40px; }
    .football-entity-grid { grid-template-columns: 1fr; }
    .statistics-kpi-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 6px; }
    .statistics-kpi-grid article { min-height: 74px; padding: 10px; }
    .statistics-kpi-grid strong { font-size: 21px; }
}

@media (max-width: 520px) {
    .match-meta-action,
    .favorite-toggle { width: 30px; height: 30px; }
    .match-meta-action .ui-icon,
    .favorite-toggle .ui-icon { width: 17px; height: 17px; }
    .football-search-form { min-height: 58px; padding: 7px; grid-template-columns: 29px 1fr auto; gap: 5px; }
    .football-search-form > i { width: 29px; height: 29px; padding: 6px; }
    .football-search-form input { height: 39px; padding: 0 8px; font-size: 10px; }
    .football-search-form .btn { min-height: 39px; padding: 0 10px; font-size: 10px; }
    .result-day { padding: 10px; }
    .result-card { min-height: 80px; padding: 8px 39px 8px 9px; }
    .result-card > a { grid-template-columns: 1fr 55px 1fr; gap: 4px; }
    .result-team { gap: 4px; font-size: 9px; }
    .result-team img { width: 23px; height: 23px; flex-basis: 23px; }
    .result-score strong { font-size: 17px; }
    .result-favorite { right: 5px; width: 27px; height: 27px; }
    .statistics-header-card { padding: 10px; }
    .statistics-header-card img { width: 39px; height: 39px; }
    .statistics-header-card strong { font-size: 13px; }
    .statistics-header-card > a { font-size: 9px; }
    .mini-result-list a { grid-template-columns: 1fr 43px 1fr; }
    .mini-result-list small { display: none; }
}

/* Betting tools — v1.5 */
.betting-tools-hero { min-height: 152px; }
.bet-calculator-shell {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(270px, .8fr);
    gap: 12px;
    margin-top: 12px;
    align-items: start;
}
.calculator-main-card,
.calculator-result-card,
.cashout-history-card {
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 7px 24px rgba(24,44,54,.06);
}
.calculator-main-card { padding: 16px; }
.calculator-heading { margin-bottom: 13px; }
.compact-btn { min-height: 38px; gap: 6px; }
.compact-btn .ui-icon { width: 17px; height: 17px; }
.calculator-stake-row { margin-bottom: 12px; }
.calculator-stake-row > label { max-width: 330px; display: grid; gap: 5px; }
.calculator-stake-row label > span,
.calculator-selection label > span { color: var(--muted); font-size: 9px; font-weight: 800; }
.calculator-stake-row small { color: var(--muted-2); font-size: 8px; }
.money-input { height: 44px; padding: 0 11px; border: 1px solid var(--line); border-radius: 12px; display: grid; grid-template-columns: 1fr auto; align-items: center; background: #f8fafb; }
.money-input:focus-within { border-color: var(--green); box-shadow: 0 0 0 3px rgba(130,207,0,.12); }
.money-input input { min-width: 0; width: 100%; border: 0; outline: 0; background: transparent; font-size: 14px; font-weight: 800; }
.money-input b { color: var(--green-dark); font-size: 10px; }
.calculator-selections { display: grid; gap: 7px; }
.calculator-selection {
    min-height: 66px;
    padding: 8px;
    border: 1px solid #e6edef;
    border-radius: 15px;
    display: grid;
    grid-template-columns: 31px minmax(0,1fr) minmax(115px, .34fr) 31px;
    align-items: end;
    gap: 8px;
    background: #fbfcfc;
}
.selection-number { width: 31px; height: 31px; margin-bottom: 3px; border-radius: 10px; display: grid; place-items: center; color: #365f00; background: var(--green-soft); font-size: 11px; font-weight: 900; }
.calculator-selection label { min-width: 0; display: grid; gap: 4px; }
.calculator-selection input { min-width: 0; width: 100%; height: 39px; padding: 0 10px; border: 1px solid var(--line); border-radius: 10px; outline: 0; color: var(--ink); background: #fff; font-size: 11px; }
.calculator-selection input:focus { border-color: var(--green); box-shadow: 0 0 0 3px rgba(130,207,0,.1); }
.calculator-remove { width: 31px; height: 31px; margin-bottom: 3px; border: 0; border-radius: 10px; color: #9e3f3f; background: #fff0f0; cursor: pointer; font-size: 18px; }
.calculator-remove:disabled { opacity: .35; cursor: not-allowed; }
.calculator-actions { margin-top: 10px; display: flex; flex-wrap: wrap; gap: 7px; }
.calculator-note { margin: 10px 0 0; color: var(--muted); font-size: 9px; }
.calculator-note.is-warning { color: #8a5d00; }
.calculator-result-card { position: sticky; top: 82px; padding: 16px; }
.calculator-result-label { color: var(--green-dark); font-size: 9px; font-weight: 900; letter-spacing: .8px; }
.calculator-result-type { margin: 9px 0 12px; padding: 11px; border-radius: 14px; display: grid; grid-template-columns: 36px 1fr; align-items: center; gap: 9px; background: #f4f8f8; }
.calculator-result-type > i { width: 36px; height: 36px; padding: 7px; color: var(--green-dark); }
.calculator-result-type > i .ui-icon { width: 100%; height: 100%; }
.calculator-result-type span { min-width: 0; display: grid; }
.calculator-result-type small { color: var(--muted); font-size: 8px; }
.calculator-result-type strong { font-size: 12px; }
.calculator-result-card dl { margin: 0; display: grid; gap: 6px; }
.calculator-result-card dl > div { min-height: 42px; padding: 8px 10px; border-radius: 11px; display: flex; align-items: center; justify-content: space-between; gap: 12px; background: #f8fafb; }
.calculator-result-card dt { color: var(--muted); font-size: 9px; }
.calculator-result-card dd { margin: 0; font-size: 12px; font-weight: 900; text-align: right; }
.calculator-result-card dl > .highlight { color: #315700; background: var(--green-soft); }
.calculator-result-card dl > .highlight dd { font-size: 16px; }
.calculator-cap { display: block; margin: 9px 0 12px; color: var(--muted-2); font-size: 8px; }
.calculator-coupon-link { width: 100%; }

.cashout-summary-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; margin-top: 12px; }
.cashout-summary-grid article { min-height: 82px; padding: 11px 13px; border-radius: 17px; display: grid; grid-template-columns: 37px 1fr; align-content: center; gap: 1px 9px; background: #fff; box-shadow: 0 7px 22px rgba(24,44,54,.055); }
.cashout-summary-grid i { grid-row: 1 / 3; width: 37px; height: 37px; padding: 7px; border-radius: 11px; color: var(--green-dark); background: var(--green-soft); }
.cashout-summary-grid i .ui-icon { width: 100%; height: 100%; }
.cashout-summary-grid span { color: var(--muted); font-size: 9px; }
.cashout-summary-grid strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 15px; }
.cashout-history-card { margin-top: 12px; padding: 15px; }
.cashout-history-card .section-heading > a { color: var(--green-dark); font-size: 10px; font-weight: 800; }
.cashout-list { display: grid; gap: 7px; }
.cashout-row { min-height: 78px; padding: 9px 10px; border: 1px solid #e7edef; border-radius: 14px; display: grid; grid-template-columns: 38px minmax(0,1fr) minmax(280px,.8fr) 16px; align-items: center; gap: 9px; background: #fbfcfc; }
.cashout-row-icon { width: 38px; height: 38px; padding: 8px; border-radius: 12px; color: var(--green-dark); background: var(--green-soft); }
.cashout-row-icon .ui-icon { width: 100%; height: 100%; }
.cashout-row-main { min-width: 0; display: grid; justify-items: start; gap: 2px; }
.cashout-row-main strong,
.cashout-row-main small { max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cashout-row-main strong { font-size: 12px; }
.cashout-row-main small { color: var(--muted); font-size: 8px; }
.cashout-row dl { margin: 0; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 5px; }
.cashout-row dl div { min-width: 0; padding: 6px 7px; border-radius: 9px; display: grid; gap: 1px; background: #f2f6f7; }
.cashout-row dt { color: var(--muted); font-size: 7px; }
.cashout-row dd { margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 9px; font-weight: 850; }
.cashout-row dl .highlight { color: #315700; background: var(--green-soft); }
.cashout-empty > i { width: 54px; height: 54px; padding: 10px; }
.cashout-empty > i .ui-icon { width: 100%; height: 100%; }
.status-cashout { color: #315700; background: var(--green-soft); }

@media (max-width: 900px) {
    .bet-calculator-shell { grid-template-columns: 1fr; }
    .calculator-result-card { position: static; }
    .cashout-row { grid-template-columns: 36px minmax(0,1fr) 16px; }
    .cashout-row dl { grid-column: 2 / 4; }
}
@media (max-width: 620px) {
    .betting-tools-hero { min-height: 126px; }
    .calculator-main-card,
    .calculator-result-card,
    .cashout-history-card { padding: 11px; border-radius: 16px; }
    .calculator-heading { align-items: flex-start; gap: 8px; }
    .compact-btn { min-height: 34px; padding: 0 9px; font-size: 9px; }
    .calculator-selection { min-height: 0; grid-template-columns: 27px minmax(0,1fr) 27px; align-items: end; gap: 6px; }
    .calculator-selection .odd-field { grid-column: 2; }
    .selection-number,
    .calculator-remove { width: 27px; height: 27px; }
    .calculator-remove { grid-row: 1; grid-column: 3; align-self: end; }
    .calculator-selection input { height: 36px; font-size: 10px; }
    .cashout-summary-grid { grid-template-columns: 1fr; gap: 6px; }
    .cashout-summary-grid article { min-height: 61px; padding: 8px 10px; }
    .cashout-summary-grid strong { font-size: 13px; }
    .cashout-row { padding: 8px; grid-template-columns: 32px minmax(0,1fr) 12px; gap: 6px; }
    .cashout-row-icon { width: 32px; height: 32px; padding: 6px; }
    .cashout-row dl { grid-template-columns: 1fr; gap: 3px; }
    .cashout-row dl div { display: flex; align-items: center; justify-content: space-between; }
}


/* Cashout Engine — v1.6 */
.cashout-panel { margin-top: 18px; padding: 16px; border: 1px solid rgba(85,148,0,.18); border-radius: 18px; background: linear-gradient(145deg,#fbfff5,#f4faee); box-shadow: 0 8px 26px rgba(38,72,33,.07); }
.cashout-panel-head { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.cashout-panel-head h2 { margin:3px 0 0; font-size:18px; }
.cashout-panel-head > i { width:42px; height:42px; display:grid; place-items:center; border-radius:13px; background:#e5f6ce; color:#4b8700; }
.cashout-panel-head .ui-icon { width:22px; height:22px; }
.cashout-offer { margin:14px 0 10px; padding:13px 14px; border-radius:15px; background:#fff; border:1px solid #e6ece2; display:grid; grid-template-columns:1fr auto; gap:3px 12px; align-items:center; }
.cashout-offer span { color:var(--muted); font-size:12px; font-weight:700; }
.cashout-offer strong { grid-row:1 / 3; grid-column:2; font-size:22px; color:#315d00; }
.cashout-offer small { color:#7a8880; font-size:10px; }
.cashout-message { margin:8px 0 12px; color:#56655d; font-size:12px; line-height:1.5; }
.cashout-message.is-error { color:#b02c2c; }
.cashout-message.is-success { color:#397200; }
.cashout-accept[disabled] { opacity:.55; cursor:not-allowed; }
.cashout-disclaimer { display:block; margin-top:9px; color:#7b887f; line-height:1.45; }
.cashout-panel.is-complete { background:#f6fbef; }
.cashout-admin-settings { margin:18px 0; padding:14px; border-radius:16px; background:#f7faf5; border:1px solid #e6ece2; }
.cashout-admin-settings .section-heading { margin-bottom:10px; }
.cashout-admin-settings .section-heading p { margin:4px 0 0; color:var(--muted); font-size:12px; }
.settings-grid select { width:100%; min-height:42px; border:1px solid #dce5df; border-radius:11px; background:#fff; padding:9px 10px; color:inherit; }
@media (max-width: 640px) { .cashout-offer { grid-template-columns:1fr; } .cashout-offer strong { grid-row:auto; grid-column:auto; margin-top:4px; } }

/* Professional wallet + dynamic payment methods — v1.7 */
.payment-grid-panel { padding: 20px; }
.payment-grid-panel form { display: block; }
.payment-heading { align-items: center; }
.payment-heading > div { display: grid; gap: 1px; }
.payment-heading .eyebrow,
.payment-methods-hero .eyebrow,
.payment-admin-hero .eyebrow { color: var(--green-dark); font-size: 10px; font-weight: 900; letter-spacing: 1.25px; text-transform: uppercase; }
.payment-close { width: 36px; height: 36px; border: 0; border-radius: 50%; background: var(--soft); font-size: 22px; line-height: 1; cursor: pointer; }
.payment-action-tabs { display: inline-grid; grid-template-columns: repeat(2,minmax(110px,1fr)); gap: 4px; padding: 4px; margin-bottom: 15px; border-radius: 14px; background: #edf2f4; }
.payment-action-tabs button { min-height: 39px; padding: 0 18px; border: 0; border-radius: 11px; background: transparent; color: var(--muted); font-weight: 850; cursor: pointer; }
.payment-action-tabs button.active { background: white; color: #315e00; box-shadow: 0 4px 13px rgba(29,48,58,.08); }

.payment-method-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 11px; }
.payment-method-card { position: relative; min-width: 0; min-height: 126px; padding: 14px; border: 1px solid var(--line); border-radius: 18px; background: #fff; text-align: left; box-shadow: 0 5px 18px rgba(29,48,58,.035); overflow: hidden; }
button.payment-method-card { cursor: pointer; transition: border-color .16s, box-shadow .16s, transform .16s; }
button.payment-method-card:hover { border-color: #bfd58f; transform: translateY(-1px); }
button.payment-method-card.selected { border-color: var(--green); box-shadow: 0 0 0 3px rgba(130,207,0,.13), 0 9px 20px rgba(29,48,58,.07); }
.payment-brand-icon { width: 48px; height: 48px; border-radius: 14px; padding: 6px; display: grid; place-items: center; overflow: hidden; flex: 0 0 auto; background: #f2f6f7; color: #43545b; font-size: 13px; font-weight: 950; letter-spacing: -.3px; }
.payment-brand-icon img { width: 100%; height: 100%; object-fit: contain; border-radius: 8px; }
.payment-brand-icon > span { width: 100%; height: 100%; display: grid; place-items: center; }
.payment-method-card[data-payment-tone="lumicash"] .payment-brand-icon { background: #ffdf00; color: #0671be; }
.payment-method-card[data-payment-tone="bancobu"] .payment-brand-icon,
.payment-method-card[data-payment-tone="bancobu-encore"] .payment-brand-icon { background: #eff8ec; color: #177f34; }
.payment-method-card[data-payment-tone="usdt"] .payment-brand-icon,
.payment-method-card[data-payment-tone="usdt-trc20"] .payment-brand-icon { background: #e5faf6; color: #009393; }
.payment-method-card[data-payment-tone="tron"] .payment-brand-icon { background: #fff0f0; color: #e11d2e; }
.payment-method-card[data-payment-tone="bnb"] .payment-brand-icon { background: #fff8da; color: #9b7500; }
.payment-method-main { margin-top: 9px; display: grid; gap: 1px; min-width: 0; }
.payment-method-main strong { font-size: 13px; font-weight: 900; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.payment-method-main small { color: var(--muted); font-size: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.payment-method-limit { display: block; margin-top: 8px; color: #5c6c72; font-size: 10px; font-weight: 750; }
.payment-method-check { position: absolute; top: 11px; right: 11px; width: 23px; height: 23px; border-radius: 50%; display: grid; place-items: center; background: #edf2f4; color: transparent; font-size: 12px; font-weight: 950; }
.payment-method-card.selected .payment-method-check { background: var(--green); color: #173000; }

.payment-selected-details { margin-top: 14px; padding: 15px; border: 1px solid #dbe8c8; border-radius: 17px; background: #f8fdef; }
.payment-selected-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.payment-selected-head > div { display: grid; gap: 2px; }
.payment-selected-head span { color: var(--muted); font-size: 10px; font-weight: 800; }
.payment-selected-head strong { font-size: 14px; }
.payment-selected-head > span { padding: 5px 8px; border-radius: 999px; background: white; color: #48600e; }
.payment-selected-details > p { margin: 10px 0 0; color: #5f6f54; font-size: 11px; }
.payment-account-box { position: relative; margin-top: 12px; padding: 12px 86px 12px 13px; border-radius: 13px; background: white; border: 1px solid #dce6d0; display: grid; gap: 3px; }
.payment-account-box small { color: var(--muted); font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .7px; }
.payment-account-box strong { overflow-wrap: anywhere; font-size: 12px; }
.payment-account-box button { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); min-height: 34px; padding: 0 10px; border: 0; border-radius: 9px; background: #edf3f5; color: #3d4e55; font-size: 10px; font-weight: 850; cursor: pointer; }
.payment-request-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; margin-top: 13px; }
.payment-request-fields label { display: grid; gap: 6px; }
.payment-request-fields label > span { font-size: 11px; color: #506067; font-weight: 800; }
.payment-request-fields input { width: 100%; height: 46px; border: 1px solid var(--line); border-radius: 12px; padding: 0 12px; outline: none; background: #fbfcfc; }
.payment-request-fields input:focus { border-color: var(--green); box-shadow: 0 0 0 3px rgba(130,207,0,.12); }
.payment-form-message { min-height: 18px; margin: 10px 0; color: var(--muted); font-size: 10px; }
.payment-form-message.is-error { color: var(--danger); }
.payment-grid-panel .btn.wide { margin-top: 1px; }
.payment-grid-panel .btn:disabled { opacity: .45; cursor: not-allowed; transform: none; }

.wallet-method-preview { margin-top: 14px; }
.public-payment-grid .static-card { display: grid; grid-template-columns: 48px minmax(0,1fr); grid-template-rows: auto auto auto; gap: 0 10px; }
.public-payment-grid .static-card .payment-brand-icon { grid-row: 1 / span 2; }
.public-payment-grid .static-card .payment-method-main { margin-top: 3px; align-self: center; }
.payment-capabilities { grid-column: 2; display: flex; flex-wrap: wrap; gap: 5px; margin-top: 5px; }
.method-badge { padding: 4px 7px; border-radius: 999px; font-size: 9px; font-weight: 850; }
.method-badge.deposit { color: #356400; background: #eef9dd; }
.method-badge.withdrawal { color: #23536a; background: #e5f4fb; }
.public-payment-grid .static-card > p { grid-column: 1 / -1; margin: 10px 0 0; color: var(--muted); font-size: 10px; }
.payment-card-action { grid-column: 1 / -1; margin-top: 11px; min-height: 36px; border-radius: 10px; display: flex; align-items: center; justify-content: center; background: #edf4f6; color: #40545b; font-size: 10px; font-weight: 850; }
.compact-grid .static-card { min-height: 100px; }
.payment-methods-hero { display: flex; justify-content: space-between; align-items: center; gap: 18px; }
.payment-methods-hero > div { max-width: 680px; }
.payment-methods-hero h1, .payment-admin-hero h1 { margin: 4px 0; }
.payment-methods-hero p, .payment-admin-hero p { margin: 0; color: var(--muted); }

/* Admin payment catalogue */
.payment-admin-hero { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 14px; padding: 20px; border-radius: var(--radius); background: white; box-shadow: var(--shadow); }
.payment-admin-hero > div { max-width: 720px; }
.admin-payment-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.admin-payment-card { padding: 14px; border: 1px solid var(--line); border-radius: 17px; background: #fff; }
.admin-payment-card.is-disabled { background: #f7f9fa; opacity: .78; }
.admin-payment-card-head { display: grid; grid-template-columns: 48px minmax(0,1fr) auto; align-items: center; gap: 10px; }
.admin-payment-card-head > div:nth-child(2) { min-width: 0; display: grid; gap: 2px; }
.admin-payment-card-head strong { font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.admin-payment-card-head small { color: var(--muted); font-size: 9px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.status-pill { padding: 5px 8px; border-radius: 999px; font-size: 9px; font-weight: 850; }
.status-pill.success { color: #356400; background: #eaf8d7; }
.status-pill.muted { color: #65737a; background: #e7edef; }
.admin-method-facts { display: grid; grid-template-columns: repeat(3,1fr); gap: 6px; margin: 12px 0; }
.admin-method-facts span { padding: 8px; border-radius: 10px; background: #f4f7f8; color: var(--muted); font-size: 9px; display: grid; gap: 2px; }
.admin-method-facts b { color: var(--ink); font-size: 10px; }
.admin-payment-actions { display: flex; gap: 7px; }
.admin-payment-actions form { display: contents; }
.admin-payment-actions .btn { min-height: 35px; flex: 1; padding: 0 10px; font-size: 10px; }
.btn.danger-soft { background: #fff0f1; color: #a12c35; }
.btn.success-soft { background: #ebf9d8; color: #356400; }
.admin-method-editor { margin-top: 14px; }
.admin-form-grid.payment-method-form { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.admin-form-grid.payment-method-form label { display: grid; align-content: start; gap: 6px; color: #4f5d63; font-size: 10px; font-weight: 800; }
.admin-form-grid.payment-method-form input,
.admin-form-grid.payment-method-form select,
.admin-form-grid.payment-method-form textarea { width: 100%; border: 1px solid var(--line); border-radius: 12px; background: #fbfcfc; color: var(--ink); outline: none; }
.admin-form-grid.payment-method-form input,
.admin-form-grid.payment-method-form select { height: 44px; padding: 0 12px; }
.admin-form-grid.payment-method-form textarea { padding: 11px 12px; resize: vertical; min-height: 98px; }
.admin-form-grid.payment-method-form input:focus,
.admin-form-grid.payment-method-form select:focus,
.admin-form-grid.payment-method-form textarea:focus { border-color: var(--green); box-shadow: 0 0 0 3px rgba(130,207,0,.12); }
.admin-form-grid.payment-method-form label > small { color: var(--muted); font-weight: 500; }
.admin-form-grid.payment-method-form .span-2 { grid-column: 1 / -1; }
.admin-method-switches { display: flex; flex-wrap: wrap; gap: 8px; }
.admin-method-switches .switch-row { min-height: 42px; padding: 0 12px; border: 1px solid var(--line); border-radius: 12px; display: flex; flex-direction: row; align-items: center; gap: 8px; background: #fafcfc; }
.admin-method-switches .switch-row input { width: 17px; height: 17px; box-shadow: none; }
.form-actions { display: flex; flex-wrap: wrap; gap: 8px; }

@media (max-width: 1180px) {
    .payment-method-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 720px) {
    .payment-grid-panel { padding: 14px; }
    .payment-action-tabs { display: grid; width: 100%; }
    .payment-method-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
    .payment-method-card { min-height: 112px; padding: 11px; border-radius: 15px; }
    .payment-brand-icon { width: 41px; height: 41px; border-radius: 12px; }
    .payment-method-main strong { font-size: 11px; }
    .payment-method-main small, .payment-method-limit { font-size: 9px; }
    .payment-method-check { top: 8px; right: 8px; width: 20px; height: 20px; }
    .payment-request-fields { grid-template-columns: 1fr; }
    .payment-selected-head { align-items: flex-start; }
    .payment-selected-head > span { max-width: 46%; text-align: right; }
    .payment-account-box { padding-right: 72px; }
    .wallet-method-preview .payment-method-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .public-payment-grid .static-card { grid-template-columns: 41px minmax(0,1fr); min-height: 95px; }
    .payment-capabilities { gap: 3px; }
    .method-badge { padding: 3px 5px; font-size: 8px; }
    .payment-methods-hero, .payment-admin-hero { align-items: flex-start; flex-direction: column; padding: 15px; }
    .payment-methods-hero .btn, .payment-admin-hero .btn { width: 100%; }
    .admin-payment-grid { grid-template-columns: 1fr; }
    .admin-form-grid.payment-method-form { grid-template-columns: 1fr; }
    .admin-form-grid.payment-method-form .span-2 { grid-column: 1; }
}

@media (max-width: 390px) {
    .payment-method-grid,
    .wallet-method-preview .payment-method-grid { grid-template-columns: 1fr 1fr; gap: 7px; }
    .payment-method-card { padding: 10px; }
    .payment-brand-icon { width: 38px; height: 38px; }
    .payment-method-main strong { font-size: 10px; }
    .admin-payment-card-head { grid-template-columns: 42px minmax(0,1fr); }
    .admin-payment-card-head .status-pill { grid-column: 2; justify-self: start; }
}

/* Payment-method cards + field overlay — v1.7.1 */
.payment-grid-hint { margin: 0 0 11px; color: var(--muted); font-size: 10px; }
.payment-method-only-grid { align-items: stretch; }
.payment-method-visual-card { min-height: 154px; padding: 0; display: flex; flex-direction: column; background: #fff; }
.payment-method-visual-card .payment-brand-art { position: relative; width: 100%; height: 94px; display: grid; place-items: center; overflow: hidden; background: #f2f6f7; }
.payment-method-visual-card .payment-brand-art img { width: 100%; height: 100%; object-fit: contain; padding: 8px; display: block; }
.payment-method-visual-card .payment-brand-art > span { width: 100%; height: 100%; display: grid; place-items: center; font-size: 20px; font-weight: 950; }
.payment-method-visual-card[data-payment-tone="lumicash"] .payment-brand-art { background: #ffdf00; color: #0671be; }
.payment-method-visual-card[data-payment-tone="bancobu"] .payment-brand-art,
.payment-method-visual-card[data-payment-tone="bancobu-encore"] .payment-brand-art { background: #eff8ec; color: #177f34; }
.payment-method-visual-card[data-payment-tone="usdt"] .payment-brand-art,
.payment-method-visual-card[data-payment-tone="usdt-trc20"] .payment-brand-art { background: #e5faf6; color: #009393; }
.payment-method-visual-card[data-payment-tone="tron"] .payment-brand-art { background: #fff0f0; color: #e11d2e; }
.payment-method-visual-card[data-payment-tone="bnb"] .payment-brand-art { background: #fff8da; color: #9b7500; }
.payment-method-visual-card .payment-card-meta { padding: 10px 11px 11px; display: grid; gap: 4px; min-width: 0; flex: 1; }
.payment-method-visual-card .payment-method-main { margin: 0; }
.payment-method-visual-card .payment-method-limit { margin-top: 2px; }
.payment-method-visual-card .payment-method-check { top: 8px; right: 8px; background: rgba(255,255,255,.92); box-shadow: 0 2px 8px rgba(15,34,43,.12); }
.payment-method-visual-card.selected .payment-method-check { background: var(--green); }
.payment-method-visual-card.selected .payment-brand-art { box-shadow: inset 0 0 0 2px rgba(130,207,0,.22); }

.payment-method-overlay[hidden] { display: none !important; }
.payment-method-overlay { position: fixed; inset: 0; z-index: 1700; display: flex; align-items: flex-end; justify-content: center; padding: 18px 18px 0; }
.payment-method-overlay-backdrop { position: absolute; inset: 0; background: rgba(14,24,29,.56); backdrop-filter: blur(2px); }
.payment-method-sheet { position: relative; z-index: 1; width: min(560px,100%); max-height: 88dvh; overflow-y: auto; padding: 18px 18px calc(18px + env(safe-area-inset-bottom)); border-radius: 24px 24px 0 0; background: #fff; box-shadow: 0 -16px 48px rgba(11,28,35,.24); }
.payment-sheet-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 12px; }
.payment-sheet-head > div { min-width: 0; display: grid; gap: 2px; }
.payment-sheet-head h3 { margin: 0; font-size: 20px; line-height: 1.1; overflow-wrap: anywhere; }
.payment-sheet-close { width: 38px; height: 38px; flex: 0 0 38px; display: grid; place-items: center; border: 0; border-radius: 50%; background: #edf2f4; color: var(--ink); font-size: 24px; cursor: pointer; }
.payment-method-sheet .payment-selected-details { margin-top: 0; }
.payment-method-sheet .payment-request-fields { margin-top: 13px; }
body.payment-overlay-open { overflow: hidden; }

.deposit-proof-field { display: grid; gap: 7px; margin-top: 13px; }
.deposit-proof-field > span:first-child { color: #506067; font-size: 11px; font-weight: 800; }
.deposit-proof-dropzone { position: relative; min-height: 86px; display: flex; align-items: center; gap: 11px; padding: 13px; border: 1.5px dashed #b9c8ce; border-radius: 14px; background: #f8fafb; overflow: hidden; cursor: pointer; }
.deposit-proof-dropzone:hover { border-color: var(--green); background: #fbfff5; }
.deposit-proof-icon { width: 42px; height: 42px; flex: 0 0 42px; display: grid; place-items: center; border-radius: 50%; background: #e9eff1; color: #587078; font-size: 24px; font-weight: 900; }
.deposit-proof-copy { min-width: 0; display: grid; gap: 2px; }
.deposit-proof-copy strong { max-width: 100%; color: #394d55; font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.deposit-proof-copy small { color: var(--muted); font-size: 9px; }
.deposit-proof-dropzone input[type="file"] { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }

@media (min-width: 720px) {
    .payment-method-overlay { align-items: center; padding: 24px; }
    .payment-method-sheet { border-radius: 24px; padding-bottom: 18px; }
}

@media (max-width: 640px) {
    .payment-grid-panel { padding: 15px; }
    .payment-method-visual-card { min-height: 136px; }
    .payment-method-visual-card .payment-brand-art { height: 80px; }
    .payment-method-visual-card .payment-brand-art img { padding: 6px; }
    .payment-method-visual-card .payment-card-meta { padding: 8px 9px 9px; }
    .payment-method-sheet { padding: 16px 14px calc(16px + env(safe-area-inset-bottom)); max-height: 91dvh; }
}

@media (max-width: 390px) {
    .payment-method-only-grid { gap: 7px; }
    .payment-method-visual-card { min-height: 128px; }
    .payment-method-visual-card .payment-brand-art { height: 74px; }
    .payment-method-visual-card .payment-method-main strong { font-size: 10px; }
    .payment-method-visual-card .payment-method-main small,
    .payment-method-visual-card .payment-method-limit { font-size: 8.5px; }
}

/* Wallet payment grid + compact centered modal — v1.7.3 */
.payment-method-only-grid {
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 9px;
}
.payment-method-visual-card {
    min-height: 112px;
    border-radius: 15px;
    background: #fff;
}
.payment-method-visual-card .payment-brand-art {
    height: 76px;
    background: #f8fafb;
}
.payment-method-visual-card .payment-brand-art img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 9px 12px;
}
.payment-method-visual-card[data-payment-tone="lumicash"] .payment-brand-art { background: #ffdf00; }
.payment-method-visual-card[data-payment-tone="bancobu"] .payment-brand-art,
.payment-method-visual-card[data-payment-tone="bancobu-encore"] .payment-brand-art { background: #fff; }
.payment-method-visual-card[data-payment-tone="usdt"] .payment-brand-art,
.payment-method-visual-card[data-payment-tone="usdt-trc20"] .payment-brand-art { background: #f3fbfa; }
.payment-method-visual-card[data-payment-tone="tron"] .payment-brand-art { background: #fff; }
.payment-method-visual-card[data-payment-tone="bnb"] .payment-brand-art { background: #fff; }
.payment-card-compact-meta {
    min-height: 36px;
    padding: 8px 9px 9px !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.payment-card-compact-meta strong {
    display: block;
    max-width: 100%;
    color: var(--ink);
    font-size: 11px;
    font-weight: 900;
    line-height: 1.15;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.payment-method-visual-card .payment-method-check {
    width: 23px;
    height: 23px;
    top: 7px;
    right: 7px;
    font-size: 12px;
}

.payment-method-overlay {
    align-items: center;
    justify-content: center;
    padding: 16px;
}
.payment-method-overlay-backdrop {
    background: rgba(8,17,22,.62);
    backdrop-filter: blur(2.5px);
}
.payment-method-sheet {
    width: min(420px,100%);
    max-height: min(88dvh,720px);
    overflow-y: auto;
    border-radius: 20px;
    padding: 14px;
    box-shadow: 0 22px 60px rgba(7,22,29,.28);
}
.payment-sheet-head-compact {
    min-height: 30px;
    margin-bottom: 4px;
}
.payment-sheet-head-compact .eyebrow {
    font-size: 9px;
    letter-spacing: 1.2px;
}
.payment-sheet-close {
    width: 34px;
    height: 34px;
    flex-basis: 34px;
    font-size: 22px;
}
.payment-modal-brand {
    display: grid;
    justify-items: center;
    gap: 4px;
    text-align: center;
    padding: 0 8px 8px;
}
.payment-modal-logo {
    width: min(230px,76%);
    height: 86px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border: 1px solid #e7edef;
    border-radius: 14px;
    background: #fff;
}
.payment-modal-logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 8px 12px;
}
.payment-modal-logo > span {
    font-size: 24px;
    font-weight: 950;
    color: var(--ink);
}
.payment-modal-brand h3 {
    margin: 3px 0 0;
    color: var(--ink);
    font-size: 21px;
    line-height: 1.08;
}
.payment-modal-subtitle {
    margin: 0;
    color: var(--muted);
    font-size: 10px;
}
.payment-modal-subtitle strong { color: #4e5f66; }
.payment-modal-network {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    padding: 3px 8px;
    border-radius: 999px;
    background: #f0f5f6;
    color: #62737a;
    font-size: 9px;
    font-weight: 850;
}
.payment-selected-details-compact {
    margin-top: 4px !important;
    padding: 0;
    border: 0;
    background: transparent;
}
.payment-account-box-compact {
    margin-top: 0;
    padding: 9px 72px 9px 10px;
    border-radius: 11px;
    background: #f8fbf4;
    border-color: #dfe8d3;
}
.payment-account-box-compact strong { font-size: 11px; }
.payment-account-box-compact button {
    min-height: 30px;
    right: 7px;
    padding: 0 9px;
    font-size: 9px;
}
.payment-instructions-compact {
    margin: 6px 2px 0 !important;
    max-height: 32px;
    overflow: hidden;
    color: var(--muted) !important;
    font-size: 9px !important;
    line-height: 1.35;
}
.payment-request-fields-compact {
    grid-template-columns: 1fr;
    gap: 9px;
    margin-top: 10px !important;
}
.payment-request-fields-compact label { gap: 4px; }
.payment-request-fields-compact label > span { font-size: 10px; }
.payment-request-fields-compact input {
    height: 42px;
    border-radius: 10px;
    padding: 0 11px;
    font-size: 13px;
    background: #fff;
}
.deposit-proof-field { gap: 5px; margin-top: 9px; }
.deposit-proof-field > span:first-child { font-size: 10px; }
.deposit-proof-dropzone-compact {
    min-height: 60px;
    padding: 8px 10px;
    gap: 9px;
    border-radius: 11px;
}
.deposit-proof-dropzone-compact .deposit-proof-icon {
    width: 34px;
    height: 34px;
    flex-basis: 34px;
    font-size: 18px;
}
.deposit-proof-dropzone-compact .deposit-proof-copy strong { font-size: 10px; }
.deposit-proof-dropzone-compact .deposit-proof-copy small { font-size: 8px; }
.payment-form-message {
    min-height: 13px;
    margin: 6px 0;
    font-size: 9px;
}
.payment-confirm-button {
    min-height: 43px;
    border-radius: 11px;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

@media (max-width: 640px) {
    .payment-grid-panel { padding: 14px; }
    .payment-method-only-grid { gap: 8px; }
    .payment-method-visual-card { min-height: 103px; }
    .payment-method-visual-card .payment-brand-art { height: 68px; }
    .payment-method-visual-card .payment-brand-art img { padding: 7px 10px; }
    .payment-card-compact-meta { min-height: 34px; padding: 7px 8px 8px !important; }
    .payment-card-compact-meta strong { font-size: 10.5px; }
    .payment-method-overlay { padding: 13px; }
    .payment-method-sheet {
        width: min(390px,100%);
        max-height: 90dvh;
        padding: 12px;
        border-radius: 18px;
    }
    .payment-modal-logo { width: min(210px,74%); height: 78px; }
    .payment-modal-brand h3 { font-size: 19px; }
}

@media (max-width: 390px) {
    .payment-method-only-grid { gap: 7px; }
    .payment-method-visual-card { min-height: 96px; }
    .payment-method-visual-card .payment-brand-art { height: 62px; }
    .payment-card-compact-meta { min-height: 32px; }
    .payment-card-compact-meta strong { font-size: 10px; }
    .payment-modal-logo { height: 70px; }
    .payment-method-sheet { max-height: 92dvh; }
}