/* ===== Bolão — tema estilo Betano ===== */
:root{
  --orange:#ff5000; --orange-600:#ff6a00; --orange-700:#e04400; --orange-soft:#2a1708;
  --bg:#0e1014; --bg2:#11131a; --panel:#171a22; --panel2:#1c2029; --panel3:#222733;
  --line:#262b37; --line2:#2f3542;
  --txt:#eceef3; --muted:#8b93a4; --muted2:#6b7280;
  --green:#36d39a; --green-2:#27c08a; --red:#ff5468; --blue:#4a9eff;
  --radius:12px; --radius-lg:16px;
  --topbar-h:60px; --rail-w:280px; --slip-w:340px;
  --shadow:0 10px 30px rgba(0,0,0,.35);
  --light-bg:#eef1f8; --light-card:#fff; --light-line:#e4e8f0; --light-txt:#1a1f2b; --light-muted:#6b7686;
  font-synthesis:none;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Inter,Helvetica,Arial,sans-serif;
  background:var(--bg); color:var(--txt); -webkit-font-smoothing:antialiased;
  min-height:100dvh;
}
a{color:inherit;text-decoration:none}
button{font-family:inherit}
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-thumb{background:#2a2f3c;border-radius:10px}
::-webkit-scrollbar-track{background:transparent}

/* ===== Top bar ===== */
.topbar{position:sticky;top:0;z-index:50;height:var(--topbar-h);display:flex;align-items:center;gap:18px;
  padding:0 18px;background:linear-gradient(90deg,var(--orange),var(--orange-700));color:#fff;
  box-shadow:0 2px 14px rgba(0,0,0,.3)}
.logo{display:flex;align-items:center;gap:9px;font-weight:900;font-size:21px;letter-spacing:-.5px;cursor:pointer}
.logo .mark{width:30px;height:30px;border-radius:8px;background:#fff;color:var(--orange);display:grid;place-items:center;font-weight:900}
.topnav{display:flex;gap:4px;margin-left:8px}
.topnav a{padding:8px 14px;border-radius:8px;font-weight:700;font-size:14px;opacity:.92;white-space:nowrap}
.topnav a:hover{background:rgba(255,255,255,.16)}
.topnav a.active{background:rgba(0,0,0,.18)}
.topbar .spacer{flex:1}
.balance-pill{display:flex;align-items:center;gap:10px;background:rgba(0,0,0,.2);border-radius:999px;padding:6px 6px 6px 16px;font-weight:800}
.balance-pill .bal{font-size:15px}
.balance-pill .bal small{display:block;font-size:10px;font-weight:600;opacity:.8;margin-top:-2px}
.btn-deposit{background:#1db36a;color:#fff;border:0;border-radius:999px;padding:9px 18px;font-weight:800;font-size:13px;cursor:pointer;box-shadow:0 4px 14px rgba(29,179,106,.4)}
.btn-deposit:hover{background:#17a35f}
.user-chip{display:flex;align-items:center;gap:8px;cursor:pointer;padding:6px 10px;border-radius:999px}
.user-chip:hover{background:rgba(255,255,255,.14)}
.avatar{width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.22);display:grid;place-items:center;font-weight:800;font-size:13px}

/* ===== Layout ===== */
.app{display:grid;grid-template-columns:var(--rail-w) 1fr var(--slip-w);gap:14px;max-width:1500px;margin:0 auto;padding:14px;align-items:start}
.rail,.slip{position:sticky;top:calc(var(--topbar-h) + 14px)}
.center{min-width:0}

/* ===== Cards / panels ===== */
.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden}
.panel-h{padding:13px 16px;font-weight:800;font-size:13px;letter-spacing:.3px;text-transform:uppercase;color:var(--muted);
  display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
.panel-h .live-dot{display:inline-flex;align-items:center;gap:7px;color:var(--txt);text-transform:none;font-size:15px}
.live-dot .pulse{width:9px;height:9px;border-radius:50%;background:var(--orange);box-shadow:0 0 0 0 rgba(255,80,0,.6);animation:pulse 1.6s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(255,80,0,.55)}70%{box-shadow:0 0 0 7px rgba(255,80,0,0)}100%{box-shadow:0 0 0 0 rgba(255,80,0,0)}}

/* ===== Rail ===== */
.rail .panel+.panel{margin-top:14px}
.navlist a{display:flex;align-items:center;gap:12px;padding:11px 16px;font-size:14px;font-weight:600;color:var(--txt);border-bottom:1px solid rgba(255,255,255,.03);cursor:pointer}
.navlist a:hover{background:var(--panel2)}
.navlist a .ico{width:22px;text-align:center;opacity:.9}
.navlist a .cnt{margin-left:auto;font-size:12px;color:var(--muted)}
.navlist a.on{color:var(--orange-600)}

.railgame{padding:10px 14px;border-bottom:1px solid rgba(255,255,255,.04);cursor:pointer}
.railgame:hover{background:var(--panel2)}
.railgame .lg{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--muted);margin-bottom:7px}
.railgame .min{color:var(--orange-600);font-weight:800;display:inline-flex;gap:5px;align-items:center}
.railgame .min .bolt{color:var(--orange)}
.railgame .teams{display:flex;justify-content:space-between;font-size:13px;margin:3px 0}
.railgame .teams .sc{font-weight:800}
.railgame .odds3{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:9px}

/* odds button */
.odd{background:var(--panel3);border:1px solid var(--line2);border-radius:9px;padding:9px 6px;text-align:center;cursor:pointer;
  display:flex;flex-direction:column;gap:2px;transition:.12s;min-width:0}
.odd:hover{border-color:var(--orange);background:#20242f}
.odd .k{font-size:11px;color:var(--muted)}
.odd .v{font-size:14px;font-weight:800;color:var(--green)}
.odd.on{background:linear-gradient(135deg,var(--orange),var(--orange-700));border-color:var(--orange)}
.odd.on .k,.odd.on .v{color:#fff}

/* ===== Center: filtros + lista de jogos ===== */
.toolbar{display:flex;gap:8px;align-items:center;margin-bottom:14px;flex-wrap:wrap}
.chip{background:var(--panel);border:1px solid var(--line);color:var(--txt);border-radius:999px;padding:9px 16px;font-size:13px;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;gap:7px}
.chip:hover{border-color:var(--line2)}
.chip.on{background:#fff;color:#11131a;border-color:#fff}
.page-title{font-size:22px;font-weight:900;margin:2px 0 14px;letter-spacing:-.4px}

.gamecard{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;padding:14px 16px;border-bottom:1px solid var(--line)}
.gamecard:last-child{border-bottom:0}
.gamecard:hover{background:var(--panel2)}
.gmeta{display:flex;align-items:center;gap:10px;font-size:11px;color:var(--muted);margin-bottom:9px}
.gmeta .flag{width:16px;height:12px;border-radius:2px;background:var(--panel3);display:inline-block}
.badge-live{color:var(--orange-600);font-weight:800;display:inline-flex;gap:5px;align-items:center}
.gteams{cursor:pointer}
.gteam{display:flex;align-items:center;gap:9px;font-size:15px;font-weight:600;padding:2px 0}
.gteam .sc{margin-left:auto;font-weight:800;color:var(--txt);min-width:22px;text-align:center}
.g-odds{display:grid;grid-template-columns:repeat(3,64px);gap:8px}
@media(max-width:1100px){.g-odds{grid-template-columns:repeat(3,56px)}}

/* ===== Event detail ===== */
.event-h{background:linear-gradient(180deg,var(--panel2),var(--panel));border:1px solid var(--line);border-radius:var(--radius-lg);padding:20px;margin-bottom:14px}
.event-top{display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:12px;margin-bottom:14px}
.scoreline{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:14px;text-align:center}
.scoreline .tm{font-size:17px;font-weight:800}
.scoreline .sc{font-size:34px;font-weight:900}
.scoreline .clk{font-size:12px;color:var(--orange-600);font-weight:800;margin-top:4px}
.market{margin-top:14px}
.market .mk-h{padding:12px 16px;font-weight:800;font-size:14px;display:flex;justify-content:space-between;cursor:pointer}
.market .sels{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px;padding:0 14px 14px}
.selbtn{background:var(--panel3);border:1px solid var(--line2);border-radius:10px;padding:12px 14px;display:flex;justify-content:space-between;align-items:center;cursor:pointer;transition:.12s;font-size:14px}
.selbtn:hover{border-color:var(--orange);background:#20242f}
.selbtn .v{font-weight:800;color:var(--green)}
.selbtn.on{background:linear-gradient(135deg,var(--orange),var(--orange-700));border-color:var(--orange);color:#fff}
.selbtn.on .v{color:#fff}

/* ===== Betslip ===== */
.slipbox{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden}
.slip-h{background:linear-gradient(135deg,var(--orange),var(--orange-700));color:#fff;padding:13px 16px;font-weight:800;display:flex;align-items:center;justify-content:space-between}
.slip-h .cnt{background:rgba(0,0,0,.25);border-radius:999px;min-width:24px;height:24px;display:grid;place-items:center;font-size:13px}
.slip-empty{padding:34px 20px;text-align:center;color:var(--muted);font-size:14px}
.slip-empty .big{font-size:34px;margin-bottom:10px;opacity:.5}
.slip-item{padding:13px 16px;border-bottom:1px solid var(--line)}
.slip-item .r1{display:flex;justify-content:space-between;gap:8px;font-weight:700;font-size:14px}
.slip-item .r1 .od{color:var(--green)}
.slip-item .mk{font-size:12px;color:var(--muted);margin-top:3px}
.slip-item .gm{font-size:11px;color:var(--muted2);margin-top:2px}
.slip-item .rm{color:var(--muted);cursor:pointer;font-size:16px;line-height:1}
.slip-foot{padding:14px 16px}
.stake-row{display:flex;gap:8px;align-items:center;margin-bottom:10px}
.stake-input{flex:1;background:var(--bg);border:1px solid var(--line2);border-radius:10px;padding:12px 14px;color:var(--txt);font-size:16px;font-weight:700;outline:none}
.stake-input:focus{border-color:var(--orange)}
.quick{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-bottom:12px}
.quick button{background:var(--panel3);border:1px solid var(--line2);color:var(--txt);border-radius:9px;padding:9px 0;font-size:12px;font-weight:700;cursor:pointer}
.quick button:hover{border-color:var(--orange)}
.slip-sum{display:flex;justify-content:space-between;font-size:13px;color:var(--muted);margin:6px 0}
.slip-sum.total{color:var(--txt);font-weight:800;font-size:16px;margin-top:8px}
.slip-sum.total .g{color:var(--green)}
.btn-primary{width:100%;background:linear-gradient(135deg,var(--orange),var(--orange-700));color:#fff;border:0;border-radius:11px;padding:15px;font-size:15px;font-weight:800;cursor:pointer;margin-top:10px;box-shadow:0 8px 22px rgba(255,80,0,.32)}
.btn-primary:hover{filter:brightness(1.06)}
.btn-primary:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}
.btn-ghost{width:100%;background:var(--panel3);color:var(--txt);border:1px solid var(--line2);border-radius:11px;padding:13px;font-weight:700;cursor:pointer;margin-top:8px}

/* ===== Auth ===== */
.auth-wrap{min-height:calc(100dvh - var(--topbar-h));display:grid;place-items:center;padding:20px;
  background:radial-gradient(900px 500px at 70% -10%,#241403 0%,transparent 55%),var(--bg)}
.auth-card{width:100%;max-width:400px;background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:26px;box-shadow:var(--shadow)}
.auth-card h2{margin:0 0 4px;font-size:22px}
.auth-card .sub{color:var(--muted);font-size:14px;margin-bottom:18px}
.tabs{display:flex;background:var(--bg);border-radius:10px;padding:4px;margin-bottom:18px}
.tabs button{flex:1;background:transparent;border:0;color:var(--muted);padding:10px;border-radius:8px;font-weight:700;cursor:pointer}
.tabs button.on{background:var(--panel3);color:var(--txt)}
label{display:block;font-size:12px;color:var(--muted);margin:12px 0 6px;font-weight:600}
input,select{width:100%;background:var(--bg);border:1px solid var(--line2);border-radius:10px;padding:13px 14px;color:var(--txt);font-size:15px;outline:none}
input:focus,select:focus{border-color:var(--orange)}
.hint{font-size:12px;color:var(--muted);margin-top:14px;line-height:1.7}
.err{background:#2a1115;border:1px solid #5a2027;color:#ffb3bd;padding:11px 13px;border-radius:10px;font-size:13px;margin-top:12px}
.ok{background:#0f2a20;border:1px solid #1f5a44;color:#9ff0cf;padding:11px 13px;border-radius:10px;font-size:13px;margin-top:12px}

/* ===== Account (light) pages ===== */
.account{display:grid;grid-template-columns:260px 1fr;gap:20px;max-width:1200px;margin:0 auto;padding:22px;min-height:calc(100dvh - var(--topbar-h));color:var(--light-txt)}
.acc-side{background:var(--light-card);border-radius:16px;padding:14px;height:fit-content;box-shadow:0 6px 20px rgba(20,30,60,.08)}
.acc-side .grp{font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--light-muted);font-weight:800;padding:14px 12px 6px}
.acc-side a{display:flex;align-items:center;gap:11px;padding:12px 14px;border-radius:11px;font-weight:700;font-size:14px;color:var(--light-txt);cursor:pointer}
.acc-side a:hover{background:#f3f5fb}
.acc-side a.on{background:linear-gradient(135deg,var(--orange),var(--orange-700));color:#fff}
.acc-side a .ico{width:20px;text-align:center}
.acc-main .acc-title{font-size:24px;font-weight:900;margin:4px 0 20px}
.acc-grid{display:grid;grid-template-columns:1fr 340px;gap:20px;align-items:start}
@media(max-width:900px){.acc-grid{grid-template-columns:1fr}}
.lcard{background:var(--light-card);border-radius:16px;padding:22px;box-shadow:0 6px 20px rgba(20,30,60,.08)}
.bal-card .brow{display:flex;justify-content:space-between;align-items:center;padding:6px 0}
.bal-card .brow.top{font-size:15px;font-weight:800;margin-bottom:6px}
.bal-card .brow.top .amt{font-size:22px}
.bal-card .brow.sub{color:var(--light-muted);font-size:14px;border-top:1px solid var(--light-line);padding-top:12px;margin-top:4px}
.bal-card .refresh{display:flex;align-items:center;justify-content:center;gap:8px;color:var(--orange);font-weight:700;cursor:pointer;margin-top:14px;font-size:14px}
.field-light input,.field-light select{background:#f6f8fc;border:1px solid var(--light-line);color:var(--light-txt)}
.field-light label{color:var(--light-muted)}
.amount-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:14px 0}
.amount-grid button{background:#f6f8fc;border:1px solid var(--light-line);border-radius:10px;padding:14px 0;font-weight:800;cursor:pointer;color:var(--light-txt)}
.amount-grid button.on,.amount-grid button:hover{background:var(--orange-soft);border-color:var(--orange);color:var(--orange-700)}
.btn-pay{width:100%;background:linear-gradient(135deg,var(--orange),var(--orange-700));color:#fff;border:0;border-radius:12px;padding:16px;font-size:16px;font-weight:800;cursor:pointer;margin-top:8px}
.btn-pay:disabled{opacity:.5}
.pix-box{text-align:center}
.pix-box img{width:220px;height:220px;border-radius:12px;background:#fff;padding:8px;border:1px solid var(--light-line)}
.copy-field{display:flex;gap:8px;margin-top:14px}
.copy-field input{font-size:12px;background:#f6f8fc;border:1px solid var(--light-line);color:var(--light-txt)}
.copy-field button{background:var(--orange);color:#fff;border:0;border-radius:10px;padding:0 18px;font-weight:800;cursor:pointer;white-space:nowrap}
.status-wait{display:inline-flex;align-items:center;gap:9px;color:var(--orange-700);font-weight:700;margin-top:16px}
.spin{width:16px;height:16px;border:2px solid var(--orange);border-top-color:transparent;border-radius:50%;animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.tx-table{width:100%;border-collapse:collapse;font-size:14px}
.tx-table th{text-align:left;color:var(--light-muted);font-size:12px;font-weight:700;padding:10px 8px;border-bottom:1px solid var(--light-line)}
.tx-table td{padding:12px 8px;border-bottom:1px solid var(--light-line)}
.pill-s{font-size:11px;padding:3px 9px;border-radius:999px;font-weight:800}
.pill-s.PAID,.pill-s.WON{background:#dcfce7;color:#15803d}
.pill-s.PENDING_PAYMENT,.pill-s.OPEN,.pill-s.PROCESSING{background:#fff0dc;color:#b45309}
.pill-s.LOST,.pill-s.FAILED{background:#fee2e2;color:#b91c1c}

/* ===== dark history (bets) ===== */
.bet-h-card{padding:14px 16px;border-bottom:1px solid var(--line)}
.bet-h-card .top{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);margin-bottom:6px}
.bet-h-card .leg{font-size:13px;margin:3px 0}
.state{font-size:11px;padding:3px 9px;border-radius:999px;font-weight:800}
.state.WON{background:#0f2a20;color:var(--green)}
.state.OPEN{background:#2a2410;color:#f2b84b}
.state.LOST{background:#2a1115;color:var(--red)}

/* ===== toast ===== */
.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);background:#171a22;border:1px solid var(--line2);
  color:var(--txt);padding:13px 20px;border-radius:12px;box-shadow:var(--shadow);z-index:200;font-size:14px;font-weight:600;opacity:0;pointer-events:none;transition:.25s}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.toast.ok{border-color:#1f5a44} .toast.err{border-color:#5a2027}

/* ===== mobile ===== */
.mobile-slip-btn{display:none}
@media(max-width:1024px){
  .app{grid-template-columns:1fr}
  .rail{display:none}
  .slip{display:none;position:fixed;inset:auto 0 0 0;top:auto;max-height:80dvh;overflow:auto;z-index:120;border-radius:18px 18px 0 0}
  .slip.open{display:block}
  .mobile-slip-btn{display:flex;position:fixed;bottom:16px;left:50%;transform:translateX(-50%);z-index:110;
    background:linear-gradient(135deg,var(--orange),var(--orange-700));color:#fff;border:0;border-radius:999px;
    padding:14px 26px;font-weight:800;box-shadow:0 10px 26px rgba(255,80,0,.4);align-items:center;gap:10px;cursor:pointer}
  .account{grid-template-columns:1fr}
  .acc-side{display:flex;flex-wrap:wrap;gap:6px}
  .acc-side .grp{width:100%}
}
@media(max-width:560px){
  .topnav{display:none}
  .page-title{font-size:19px}
  .g-odds{grid-template-columns:repeat(3,52px)}
  .balance-pill{padding:6px 6px 6px 12px}
}

/* ===== Convite (landing) ===== */
.invite-page{min-height:100dvh;background:
  radial-gradient(1000px 600px at 85% -10%,#3a1e02 0%,transparent 55%),
  radial-gradient(800px 500px at -10% 110%,#2a1405 0%,transparent 50%),var(--bg);
  display:flex;flex-direction:column;align-items:center;padding:28px 18px 60px}
.invite-hero{max-width:560px;width:100%;text-align:center;padding:14px 0 6px}
.invite-logo{display:inline-flex;align-items:center;gap:10px;font-size:24px;font-weight:900;color:#fff;margin-bottom:26px}
.invite-logo .mark{width:40px;height:40px;border-radius:11px;background:linear-gradient(135deg,var(--orange),#ff3d00);display:grid;place-items:center;color:#fff;box-shadow:0 8px 24px rgba(255,80,0,.5)}
.invite-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(255,80,0,.14);border:1px solid rgba(255,80,0,.35);color:var(--orange-600);font-weight:800;font-size:13px;padding:7px 16px;border-radius:999px;margin-bottom:18px}
.invite-hero h1{font-size:34px;line-height:1.1;margin:0 0 12px;font-weight:900;letter-spacing:-.8px;background:linear-gradient(120deg,#fff,#ffd9bf);-webkit-background-clip:text;background-clip:text;color:transparent}
.invite-hero .who{color:var(--orange-600);font-weight:900}
.invite-hero p{color:var(--muted);font-size:16px;margin:0 auto 22px;max-width:440px;line-height:1.5}
.invite-benes{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-bottom:26px}
.bene{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:14px 16px;min-width:140px;flex:1;max-width:170px}
.bene .ic{font-size:22px}
.bene .t{font-weight:800;font-size:14px;margin-top:6px}
.bene .d{color:var(--muted);font-size:12px;margin-top:2px}
.invite-form{max-width:440px;width:100%;background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:24px;box-shadow:var(--shadow);text-align:left}
.invite-form h3{margin:0 0 4px;font-size:19px;text-align:center}
.invite-form .sub{color:var(--muted);font-size:13px;text-align:center;margin-bottom:16px}
.invite-expired{max-width:440px;background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:34px 24px;text-align:center}
.invite-foot{color:var(--muted2);font-size:12px;margin-top:26px;text-align:center}
.form-grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:480px){.form-grid2{grid-template-columns:1fr}.invite-hero h1{font-size:27px}}

/* ===== Compartilhar convite (share) ===== */
.share-card{background:linear-gradient(135deg,#1c1205,#241404);border:1px solid #3a2411;border-radius:20px;padding:28px;text-align:center;position:relative;overflow:hidden}
.share-card::before{content:"";position:absolute;inset:-40% -20% auto auto;width:260px;height:260px;background:radial-gradient(circle,rgba(255,80,0,.35),transparent 65%);filter:blur(10px)}
.share-card .sc-logo{display:inline-flex;align-items:center;gap:9px;font-weight:900;font-size:20px;color:#fff;position:relative}
.share-card .sc-logo .mark{width:34px;height:34px;border-radius:9px;background:linear-gradient(135deg,var(--orange),#ff3d00);display:grid;place-items:center}
.share-card h2{position:relative;font-size:26px;margin:18px 0 8px;color:#fff;font-weight:900;letter-spacing:-.5px}
.share-card p{position:relative;color:#f0c9ad;font-size:14px;margin:0 auto 18px;max-width:320px}
.share-code{position:relative;display:inline-block;background:rgba(0,0,0,.35);border:1px dashed rgba(255,120,40,.5);border-radius:12px;padding:12px 22px;font-family:ui-monospace,Menlo,monospace;font-size:20px;font-weight:800;color:#fff;letter-spacing:2px}
.share-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}
@media(max-width:480px){.share-actions{grid-template-columns:1fr}}
.btn-wa{background:#25d366;color:#07351b;border:0;border-radius:12px;padding:14px;font-weight:800;font-size:15px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px}
.btn-wa:hover{filter:brightness(1.05)}
.btn-copy2{background:var(--panel3);color:var(--txt);border:1px solid var(--line2);border-radius:12px;padding:14px;font-weight:800;cursor:pointer}
.btn-copy2:hover{border-color:var(--orange)}
.pending-row{display:flex;align-items:center;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--line)}
.pending-row .nm{font-weight:700;font-size:14px}
.pending-row .em{color:var(--muted);font-size:12px}
.btn-approve{background:var(--green-2);color:#042b1c;border:0;border-radius:9px;padding:8px 16px;font-weight:800;font-size:13px;cursor:pointer}

/* ===== TEMA CLARO (toggle) ===== */
html[data-theme="light"]{
  --bg:#eef1f8; --bg2:#ffffff; --panel:#ffffff; --panel2:#f6f8fc; --panel3:#eef1f8;
  --line:#e4e8f0; --line2:#d8deea; --txt:#17202e; --muted:#67728a; --muted2:#95a0b5;
  --shadow:0 10px 30px rgba(30,45,80,.12);
}
html[data-theme="light"] body{background:
  radial-gradient(900px 500px at 85% -10%,#ffe9da 0%,transparent 55%),var(--bg)}
html[data-theme="light"] .odd,html[data-theme="light"] .selbtn,html[data-theme="light"] .chip{box-shadow:0 1px 2px rgba(30,45,80,.05)}
html[data-theme="light"] .stake-input,html[data-theme="light"] input,html[data-theme="light"] select{background:#f6f8fc}

/* ===== User menu ===== */
.umenu{position:relative}
.umenu-pop{position:absolute;right:0;top:46px;background:var(--panel);border:1px solid var(--line);border-radius:14px;
  min-width:220px;box-shadow:var(--shadow);overflow:hidden;z-index:80;color:var(--txt)}
.umenu-pop .uhead{padding:14px 16px;border-bottom:1px solid var(--line)}
.umenu-pop .uhead .nm{font-weight:800}
.umenu-pop .uhead .em{font-size:12px;color:var(--muted)}
.umenu-pop a{display:flex;align-items:center;gap:11px;padding:12px 16px;font-size:14px;font-weight:600;cursor:pointer}
.umenu-pop a:hover{background:var(--panel2)}
.umenu-pop a .ico{width:20px;text-align:center}
.umenu-pop .sep{height:1px;background:var(--line)}
.theme-switch{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;font-size:14px;font-weight:600}
.switch{width:44px;height:24px;border-radius:999px;background:var(--panel3);border:1px solid var(--line2);position:relative;cursor:pointer;transition:.2s}
.switch .knob{position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:var(--orange);transition:.2s}
.switch.on{background:var(--orange)}
.switch.on .knob{left:22px;background:#fff}

/* ===== LIVE badge forte + card ao vivo ===== */
.gamecard.live{background:linear-gradient(90deg,rgba(255,80,0,.08),transparent 60%);border-left:3px solid var(--orange)}
.badge-live-strong{display:inline-flex;align-items:center;gap:6px;background:var(--orange);color:#fff;font-weight:900;
  font-size:11px;padding:3px 9px;border-radius:6px;letter-spacing:.5px;animation:livePulse 1.8s infinite}
@keyframes livePulse{0%,100%{box-shadow:0 0 0 0 rgba(255,80,0,.5)}50%{box-shadow:0 0 0 5px rgba(255,80,0,0)}}
.badge-live-strong .d{width:6px;height:6px;border-radius:50%;background:#fff;animation:blink 1s infinite}
@keyframes blink{50%{opacity:.3}}
.lance-flash{display:inline-flex;align-items:center;gap:5px;background:rgba(255,80,0,.16);color:var(--orange-600);font-weight:800;font-size:11px;padding:2px 8px;border-radius:6px;margin-left:6px}

/* suspensão (jogo com lance) */
.g-odds.susp,.sels.susp{position:relative;opacity:.5;pointer-events:none}
.susp-overlay{display:flex;align-items:center;justify-content:center;gap:8px;background:rgba(255,80,0,.12);
  border:1px dashed rgba(255,80,0,.5);border-radius:10px;padding:10px;color:var(--orange-600);font-weight:800;font-size:13px;margin:8px 0}
.lock{font-size:15px}

/* ===== Market tabs (evento) ===== */
.mkt-tabs{display:flex;gap:8px;overflow-x:auto;padding:4px 0 12px;-webkit-overflow-scrolling:touch}
.mkt-tabs::-webkit-scrollbar{display:none}
.mkt-tab{background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:9px 16px;font-size:13px;font-weight:700;white-space:nowrap;cursor:pointer;color:var(--txt)}
.mkt-tab.on{background:var(--orange);border-color:var(--orange);color:#fff}

/* ===== botão + na odd ===== */
.selbtn .addp{width:22px;height:22px;border-radius:7px;background:var(--panel);border:1px solid var(--line2);display:grid;place-items:center;font-weight:900;color:var(--orange-600);font-size:15px;margin-left:8px}
.selbtn.on .addp{background:rgba(255,255,255,.25);color:#fff;border-color:transparent}

/* ===== betslip tabs ===== */
.slip-tabs{display:flex;background:var(--bg);padding:4px;margin:12px 14px 0;border-radius:10px}
.slip-tabs button{flex:1;background:transparent;border:0;color:var(--muted);padding:9px;border-radius:8px;font-weight:700;font-size:13px;cursor:pointer}
.slip-tabs button.on{background:var(--panel3);color:var(--txt)}

/* ===== modal ===== */
.modal-bg{position:fixed;inset:0;background:rgba(0,0,0,.6);display:grid;place-items:center;z-index:300;padding:18px}
.modal{background:var(--panel);border:1px solid var(--line);border-radius:18px;max-width:440px;width:100%;padding:24px;color:var(--txt);box-shadow:var(--shadow)}
.modal h3{margin:0 0 6px;font-size:19px}
.modal .mc{color:var(--muted);font-size:13px;margin-bottom:14px}
.modal textarea{width:100%;min-height:110px;background:var(--bg);border:1px solid var(--line2);border-radius:10px;padding:12px;color:var(--txt);font-family:inherit;font-size:14px;resize:vertical;outline:none}
.modal textarea:focus{border-color:var(--orange)}
.modal-x{float:right;cursor:pointer;color:var(--muted);font-size:20px;line-height:1}

/* admin reports */
.rep-row{padding:13px 0;border-bottom:1px solid var(--light-line)}
.rep-row .rh{display:flex;justify-content:space-between;font-size:12px;color:var(--light-muted);margin-bottom:5px}
.rep-row .rm{font-size:14px}
.rep-cat{font-size:10px;padding:2px 8px;border-radius:6px;background:#eef1f8;color:#475569;font-weight:800;text-transform:uppercase}

/* ===== escudos / bandeiras / relógio ===== */
.team-badge{width:22px;height:22px;border-radius:50%;display:inline-grid;place-items:center;color:#fff;font-size:9px;font-weight:800;flex:none;box-shadow:inset 0 0 0 1px rgba(255,255,255,.15)}
.team-badge.lg{width:30px;height:30px;font-size:12px}
.gteam{display:flex;align-items:center;gap:8px}
.lg-badge{font-size:14px;line-height:1;margin-right:1px}
.live-clock{font-variant-numeric:tabular-nums;font-weight:900}
.scoreline .tm{display:flex;flex-direction:column;align-items:center;gap:8px}
.half-tag{background:#334155;color:#fff;font-weight:800;font-size:11px;padding:3px 9px;border-radius:6px}

/* ===== cupom agrupado (Criar Aposta) ===== */
.slip-group{border-bottom:1px solid var(--line)}
.slip-group:last-child{border-bottom:0}
.slip-game{padding:11px 16px 4px;font-size:12px;color:var(--muted);font-weight:700;display:flex;align-items:center;gap:7px}
.slip-game .cria{background:rgba(255,80,0,.15);color:var(--orange-600);font-weight:800;font-size:10px;padding:2px 8px;border-radius:6px}
.slip-group .slip-item{border-bottom:0;padding:6px 16px 12px}

/* ===== brasões reais ===== */
.team-badge.logo{background:#fff;overflow:hidden}
.team-badge .tlogo{width:100%;height:100%;object-fit:contain;display:block}
.team-badge.lg.logo{padding:2px}
/* tile grande (cabeçalho do evento, estilo print) */
.team-tile{width:72px;height:72px;border-radius:16px;background:#fff;display:grid;place-items:center;padding:10px;
  box-shadow:0 6px 18px rgba(0,0,0,.18);border:1px solid rgba(255,255,255,.06)}
.team-tile img{width:100%;height:100%;object-fit:contain}
.team-tile.mono{background:var(--mg,#444);color:#fff;font-weight:900;font-size:24px;padding:0}
html[data-theme="light"] .team-tile{box-shadow:0 6px 18px rgba(30,45,80,.12);border-color:var(--line)}
@media(max-width:560px){.team-tile{width:56px;height:56px;border-radius:13px}}

/* ===== movimento de odds (↑↓) ===== */
.odd .v,.selbtn .v{position:relative;transition:color .3s}
.v.up{color:var(--green)!important;animation:oddflash-up 1.2s ease-out}
.v.down{color:var(--red)!important;animation:oddflash-down 1.2s ease-out}
.v .arr{font-size:9px;margin-left:3px;vertical-align:middle}
@keyframes oddflash-up{0%{background:rgba(54,211,154,.25)}100%{background:transparent}}
@keyframes oddflash-down{0%{background:rgba(255,84,104,.25)}100%{background:transparent}}
.odd .v.up,.odd .v.down{border-radius:4px;padding:0 2px}

/* ============ MOBILE estilo Betano ============ */
@media(max-width:1024px){
  :root{--topbar-h:56px}
  body{padding-bottom:calc(64px + env(safe-area-inset-bottom))}
  .app{padding:10px 12px}
  .mobile-slip-btn{display:none!important}

  /* top bar compacto */
  .topbar{padding:0 12px;gap:10px}
  .logo{font-size:18px} .logo .mark{width:28px;height:28px}
  .balance-pill{padding:5px 5px 5px 12px;gap:8px}
  .balance-pill .bal{font-size:13px}
  .btn-deposit{padding:8px 14px;font-size:12px}

  /* categorias com ícone (scroller) */
  .catscroll{display:flex;gap:4px;overflow-x:auto;padding:10px 2px 6px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .catscroll::-webkit-scrollbar{display:none}
  .cat{flex:none;display:flex;flex-direction:column;align-items:center;gap:5px;min-width:68px;padding:8px 6px;border-radius:12px;cursor:pointer;color:var(--muted);font-size:12px;font-weight:700}
  .cat .ci{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--panel2);font-size:16px}
  .cat.on{color:var(--txt)} .cat.on .ci{background:var(--orange);color:#fff}
  .cat.dis{opacity:.4}

  /* card de jogo empilhado + odds full-width */
  .gamecard{grid-template-columns:1fr;gap:12px;padding:14px}
  .g-odds{grid-template-columns:repeat(3,1fr);gap:8px}
  .odd{padding:11px 6px}
  .gteam{font-size:15px}

  /* cupom como bottom sheet */
  .slip{inset:auto 0 calc(64px + env(safe-area-inset-bottom)) 0;max-height:72dvh;border-radius:18px 18px 0 0;border:1px solid var(--line);border-bottom:0}
  .slip-h{position:relative;padding-right:44px}
  .slip-h .sheet-x{position:absolute;right:14px;top:12px;cursor:pointer;font-size:18px}
  .slip .btn-primary{position:sticky;bottom:0}

  /* cupom peek (barra que aparece quando tem seleção) */
  .cupom-peek{position:fixed;left:0;right:0;bottom:calc(64px + env(safe-area-inset-bottom));z-index:115;
    background:linear-gradient(135deg,var(--orange),var(--orange-700));color:#fff;display:none;align-items:center;justify-content:space-between;
    padding:12px 18px;box-shadow:0 -6px 20px rgba(0,0,0,.25);cursor:pointer;font-weight:800}
  .cupom-peek.show{display:flex}
  .cupom-peek .cp-n{background:rgba(0,0,0,.22);border-radius:999px;min-width:24px;height:24px;display:inline-grid;place-items:center;margin-right:8px}
  .cupom-peek .cp-go{background:#fff;color:var(--orange-700);border-radius:999px;padding:7px 16px;font-size:13px}
}
/* bottom tab bar (só mobile) */
.bottomnav{display:none}
@media(max-width:1024px){
  .bottomnav{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:120;background:var(--bg2);
    border-top:1px solid var(--line);padding:6px 4px calc(6px + env(safe-area-inset-bottom));justify-content:space-around}
  html[data-theme="dark"] .bottomnav,:root:not([data-theme="light"]) .bottomnav{background:#0b0d12}
  .bn-item{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 2px;color:var(--muted);font-size:10.5px;font-weight:700;cursor:pointer;position:relative}
  .bn-item .bi{font-size:20px;line-height:1}
  .bn-item.on{color:var(--orange-600)}
  .bn-item .bn-badge{position:absolute;top:0;right:28%;background:var(--orange);color:#fff;border-radius:999px;min-width:16px;height:16px;font-size:10px;display:grid;place-items:center;font-weight:800}
}

.catscroll{display:none}

/* ============ POLISH v2 (ícones + conta seguindo tema) ============ */
.ic-svg{display:inline-block;vertical-align:middle;flex:none}
.topicons{display:flex;gap:4px;margin-right:4px}
.icbtn{background:rgba(255,255,255,.14);border:0;color:#fff;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;cursor:pointer}
.icbtn:hover{background:rgba(255,255,255,.24)}
@media(max-width:700px){.topicons{display:none}}

/* conta segue o TEMA (corrige branco no escuro + título invisível) */
.account{color:var(--txt)}
.acc-side{background:var(--panel);border:1px solid var(--line);box-shadow:none}
.acc-side .grp{color:var(--muted)}
.acc-side a{color:var(--txt)} .acc-side a:hover{background:var(--panel2)}
.acc-side a.on{background:linear-gradient(135deg,var(--orange),var(--orange-700));color:#fff}
.acc-side a .ico{display:inline-flex;align-items:center}
.lcard{background:var(--panel);border:1px solid var(--line);box-shadow:var(--shadow)}
.bal-card .brow.sub{color:var(--muted);border-top:1px solid var(--line)}
.bal-card .refresh{color:var(--orange-600);display:inline-flex;align-items:center;gap:6px}
.acc-title{color:var(--txt)}
.field-light input,.field-light select{background:var(--bg);border:1px solid var(--line2);color:var(--txt)}
.field-light label{color:var(--muted)}
.amount-grid button{background:var(--panel3);border:1px solid var(--line2);color:var(--txt)}
.amount-grid button.on,.amount-grid button:hover{background:var(--orange-soft);border-color:var(--orange);color:var(--orange-600)}
.pix-box img{background:#fff}
.copy-field input{background:var(--bg);border:1px solid var(--line2);color:var(--txt)}
.tx-table th{color:var(--muted);border-bottom:1px solid var(--line)}
.tx-table td{border-bottom:1px solid var(--line)}
.rep-row{border-bottom:1px solid var(--line)}
.rep-cat{background:var(--panel3);color:var(--muted)}
.status-wait{color:var(--orange-600)}
.muted,.acc-main p{color:var(--muted)}

/* grid de conta: conteúdo esq, saldo dir (desktop) */
.acc-grid{grid-template-columns:1fr 340px}
#accmain{order:1;min-width:0}
.bal-card{order:2;position:sticky;top:calc(var(--topbar-h) + 16px)}
.acc-mhead,.acc-subtabs{display:none}

@media(max-width:1024px){
  .account{grid-template-columns:1fr;padding:12px 12px 20px;gap:0}
  .acc-side{display:none}
  .acc-mhead{display:flex;align-items:center;gap:12px;margin:2px 0 14px}
  .acc-back{background:var(--panel);border:1px solid var(--line);color:var(--txt);width:40px;height:40px;border-radius:11px;display:grid;place-items:center;cursor:pointer;flex:none}
  .acc-mhead .acc-title{font-size:21px;margin:0}
  .acc-subtabs{display:flex;gap:8px;overflow-x:auto;padding-bottom:14px;scrollbar-width:none}
  .acc-subtabs::-webkit-scrollbar{display:none}
  .acc-tab{flex:none;display:flex;align-items:center;gap:7px;padding:10px 15px;border-radius:999px;background:var(--panel);border:1px solid var(--line);font-size:13px;font-weight:700;color:var(--txt);white-space:nowrap;cursor:pointer}
  .acc-tab.on{background:var(--orange);border-color:var(--orange);color:#fff}
  .acc-grid{grid-template-columns:1fr;gap:14px}
  .bal-card{order:-1;position:static}
  .bal-card .brow.top .amt{font-size:24px}
}

/* ===== odds grandes legíveis ===== */
.odd .v,.selbtn .v{white-space:nowrap}