/* Cassino10 (16/10/2026): home no molde da Blaze por cima da IG System.
   Tudo com prefixo c10-. A classe html.c10 e posta pelo JS; sem JS nada muda. */

/* ===== tema ===== */
html.c10{--color-surface:#10231A;--color-surface-2:#16301F;--color-border:#1C3A27;--color-text-muted:#8CA595;--c10-gold:#F5C21B;--c10-gold2:#FFD84D;--c10-bg:#07120C;--c10-panel:#10231A;--c10-panel2:#16301F;--c10-line:#1C3A27;--c10-line2:#27512F;--c10-muted:#8CA595;--c10-muted2:#5F7A69;--c10-green:#22C55E}
html.c10 body{background:var(--c10-bg)}
html.c10 header.sticky{background:rgba(7,18,12,.92) !important;border-bottom:1px solid var(--c10-line) !important}
html.c10 aside.fixed{background:#0B1A11 !important;border-right:1px solid var(--c10-line) !important}

/* so cassino: esconde o lado de esportes */
html.c10 a[href*="/esportes"]{display:none !important}

/* menu lateral: item ativo em pilula com filete dourado */
html.c10 aside nav a{border-radius:8px}
html.c10 aside nav a.bg-\[var\(--color-primary\)\],html.c10 aside nav a[class*="bg-[var(--color-primary)"]{background:var(--c10-panel2) !important;color:#fff !important;box-shadow:inset 3px 0 0 var(--c10-gold)}

/* main de largura cheia: a coluna "Maiores ganhos" vira ticker + feed */
@media(min-width:1024px){html.c10 main .lg\:pr-72{padding-right:0 !important}html.c10 main .lg\:mr-\[12px\]{margin-right:0 !important}}
html.c10 .c10-src-desk,html.c10 .c10-src-mob{display:none !important}
html.c10 .c10-hide{display:none !important}

/* cabecalhos de fileira no padrao Blaze */
html.c10 main section > div.flex.items-center h2{font-size:17px;font-weight:900;letter-spacing:-.01em}

/* ===== ticker de ganhos ===== */
.c10-tk{height:34px;margin:0 -1px;background:#0B1A11;border-bottom:1px solid var(--c10-line);display:flex;align-items:center;overflow:hidden;position:relative}
.c10-tk-lab{flex:none;height:100%;display:flex;align-items:center;gap:8px;padding:0 14px;background:var(--c10-panel);font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--c10-gold);border-right:1px solid var(--c10-line);z-index:1;white-space:nowrap}
.c10-tk-lab i{width:7px;height:7px;border-radius:50%;background:var(--c10-green);box-shadow:0 0 0 3px rgba(34,197,94,.2);animation:c10-pulse 1.6s infinite}
@keyframes c10-pulse{50%{box-shadow:0 0 0 6px rgba(34,197,94,0)}}
.c10-tk-track{display:flex;gap:28px;white-space:nowrap;animation:c10-tick var(--c10-dur,60s) linear infinite;padding-left:20px;will-change:transform}
.c10-tk-track:hover{animation-play-state:paused}
@keyframes c10-tick{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.c10-tk-track{animation:none}}
.c10-tk-it{display:inline-flex;align-items:center;gap:8px;font-size:12px;color:var(--c10-muted);text-decoration:none}
.c10-tk-it img{width:22px;height:22px;border-radius:5px;object-fit:cover}
.c10-tk-it b{color:#fff;font-weight:600}.c10-tk-it em{font-style:normal;color:var(--c10-gold);font-weight:800}

/* ===== banners: 3 lado a lado no desktop (o carrossel da IG vira grade) ===== */
@media(min-width:1024px){
  html.c10 main section.c10-bn > div.relative.rounded-xl{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;aspect-ratio:auto !important;overflow:visible;border-radius:0}
  html.c10 main section.c10-bn > div.relative.rounded-xl > div[x-show]{display:flex !important;position:relative !important;inset:auto !important;aspect-ratio:16/8.4;border-radius:12px;overflow:hidden;border:1px solid var(--c10-line);opacity:1 !important;transform:none !important;transition:none !important}
  html.c10 main section.c10-bn > div.relative.rounded-xl > div[x-show] > div{padding:18px 20px !important;max-width:none !important}
  html.c10 main section.c10-bn > div.relative.rounded-xl > div[x-show] .md\:text-5xl{font-size:24px !important;line-height:1.05 !important}
  html.c10 main section.c10-bn > div.relative.rounded-xl > div[x-show] .md\:text-2xl{font-size:13px !important}
  html.c10 main section.c10-bn > div.relative.rounded-xl > div[x-show] .md\:text-sm{font-size:10.5px !important}
  html.c10 main section.c10-bn > div.absolute,html.c10 main section.c10-bn button[aria-label]{display:none !important}
}
html.c10 main section.c10-bn > div.relative.rounded-xl > div[x-show]{background:radial-gradient(90% 120% at 100% 50%,rgba(245,194,27,.28),transparent 60%),linear-gradient(135deg,#0E2D1C,#07120C) !important}
html.c10 main section.c10-bn [class*="from-emerald"],html.c10 main section.c10-bn [class*="from-"]{--tw-gradient-from:transparent;--tw-gradient-to:transparent}

/* ===== Originals ===== */
.c10-og-row{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 7*12px)/8);gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding-bottom:4px;scrollbar-width:none}
.c10-og-row::-webkit-scrollbar{display:none}
@media(max-width:1200px){.c10-og-row{grid-auto-columns:calc((100% - 5*12px)/6)}}
@media(max-width:640px){.c10-og-row{grid-auto-columns:calc((100% - 2*10px)/3);gap:10px}}
.c10-og{position:relative;aspect-ratio:3/4;border-radius:10px;overflow:hidden;scroll-snap-align:start;border:1px solid var(--c10-line);display:flex;flex-direction:column;justify-content:flex-end;padding:12px;transition:.18s;isolation:isolate;text-decoration:none;color:#fff}
.c10-og:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(0,0,0,.45);border-color:var(--c10-line2)}
.c10-og b{font-size:18px;line-height:1;font-weight:900;letter-spacing:-.01em;color:#fff}
.c10-og small{font-size:10.5px;color:rgba(255,255,255,.72);margin-top:4px;font-weight:600;line-height:1.2}
.c10-og .mk{position:absolute;top:10px;left:10px;height:18px;padding:0 6px;border-radius:4px;background:rgba(0,0,0,.4);font-size:9px;letter-spacing:.14em;font-weight:800;color:var(--c10-gold);display:flex;align-items:center;gap:4px;text-transform:uppercase}
.c10-og .mk::before{content:"";width:10px;height:10px;border-radius:2px;background:var(--c10-gold)}
.c10-og .fx{position:absolute;inset:0;z-index:-1}
.c10-og-crash{background:linear-gradient(160deg,#0E2D1C,#07120C)}
.c10-og-crash .fx{background:linear-gradient(transparent 94%,rgba(255,255,255,.06) 94%) 0 0/100% 22px,linear-gradient(90deg,transparent 94%,rgba(255,255,255,.06) 94%) 0 0/22px 100%}
.c10-og-crash .fx::after{content:"";position:absolute;left:8%;bottom:28%;width:84%;height:52%;background:linear-gradient(to top right,transparent 49.3%,var(--c10-gold) 49.3%,var(--c10-gold) 51.5%,transparent 51.5%);clip-path:polygon(0 100%,100% 0,100% 100%);opacity:.9;filter:drop-shadow(0 0 10px rgba(245,194,27,.6))}
.c10-og-crash .fx::before{content:"2.47\00d7";position:absolute;right:12px;top:40px;font-size:22px;font-weight:900;color:var(--c10-gold)}
.c10-og-plinko{background:linear-gradient(160deg,#102A1B,#07120C)}
.c10-og-plinko .fx{background:radial-gradient(circle,#F5C21B 1.6px,transparent 2px) 0 0/18px 18px;-webkit-mask:linear-gradient(to bottom,transparent 12%,#000 20%,#000 65%,transparent 78%);mask:linear-gradient(to bottom,transparent 12%,#000 20%,#000 65%,transparent 78%)}
.c10-og-plinko .fx::after{content:"";position:absolute;left:50%;top:14%;width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:0 0 12px #fff;transform:translateX(-50%)}
.c10-og-dice{background:linear-gradient(160deg,#0E2D1C,#07120C)}
.c10-og-dice .fx::before{content:"";position:absolute;left:50%;top:38%;width:66px;height:66px;border-radius:14px;background:linear-gradient(145deg,#FFF,#D1D5DB);transform:translate(-50%,-50%) rotate(14deg);box-shadow:0 14px 30px rgba(0,0,0,.5)}
.c10-og-dice .fx::after{content:"";position:absolute;left:50%;top:38%;width:12px;height:12px;border-radius:50%;background:#07120C;transform:translate(-50%,-50%);box-shadow:-20px -20px 0 #07120C,20px 20px 0 #07120C,20px -20px 0 #07120C,-20px 20px 0 #07120C}
.c10-og-goal{background:linear-gradient(160deg,#0C3D1F,#07120C)}
.c10-og-goal .fx::before{content:"\26BD";position:absolute;left:50%;top:38%;transform:translate(-50%,-50%);font-size:58px;filter:drop-shadow(0 10px 20px rgba(0,0,0,.6))}
.c10-og-hilo{background:linear-gradient(160deg,#16301F,#07120C)}
.c10-og-hilo .fx::before,.c10-og-hilo .fx::after{content:"";position:absolute;width:48px;height:66px;border-radius:8px;top:30px;background:linear-gradient(145deg,#fff,#CBD5E1);box-shadow:0 10px 24px rgba(0,0,0,.5)}
.c10-og-hilo .fx::before{left:22px;transform:rotate(-12deg)}.c10-og-hilo .fx::after{left:62px;top:44px;transform:rotate(10deg);background:linear-gradient(145deg,#F87171,#B91C1C)}
.c10-og-keno{background:linear-gradient(160deg,#0E2D1C,#07120C)}
.c10-og-keno .fx{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;padding:34px 14px 70px}
.c10-og-keno .fx i{border-radius:6px;background:#1C3A27;border:1px solid #2A5438}
.c10-og-keno .fx i:nth-child(3),.c10-og-keno .fx i:nth-child(10){background:radial-gradient(circle at 40% 40%,#FFE27A,#B98D06);border-color:#F5C21B;box-shadow:0 0 14px rgba(245,194,27,.6)}
.c10-og-keno .fx i:nth-child(7){background:radial-gradient(circle at 40% 40%,#FCA5A5,#991B1B);border-color:#EF4444}
.c10-og-roleta{background:linear-gradient(160deg,#2A1E05,#07120C)}
.c10-og-roleta .fx::before{content:"";position:absolute;left:50%;top:40%;width:96px;height:96px;border-radius:50%;transform:translate(-50%,-50%);background:conic-gradient(var(--c10-gold) 0 25%,#EF4444 0 50%,var(--c10-gold) 0 75%,#0F172A 0);box-shadow:0 0 0 6px #07120C,0 0 0 8px #B98D06,0 16px 40px rgba(0,0,0,.6)}
.c10-og-roleta .fx::after{content:"";position:absolute;left:50%;top:40%;width:34px;height:34px;border-radius:50%;background:#07120C;transform:translate(-50%,-50%);border:3px solid var(--c10-gold)}
.c10-og-hotline{background:linear-gradient(160deg,#102A1B,#07120C)}
.c10-og-hotline .fx::before{content:"";position:absolute;left:50%;top:22%;width:4px;height:44%;background:linear-gradient(to top,var(--c10-gold),transparent);transform:translateX(-50%);box-shadow:0 0 14px rgba(245,194,27,.6)}
.c10-og-hotline .fx::after{content:"\1F680";position:absolute;left:50%;top:18%;transform:translateX(-50%);font-size:34px}

/* ===== feed "Ultimas apostas" ===== */
.c10-feed{border:1px solid var(--c10-line);border-radius:12px;background:#0B1A11;overflow:hidden}
.c10-feed-h{display:flex;align-items:center;gap:8px;padding:12px 14px;border-bottom:1px solid var(--c10-line)}
.c10-feed-h h2{font-size:15px;font-weight:900;margin:0 auto 0 0;display:flex;align-items:center;gap:10px}
.c10-feed-h h2 i{width:8px;height:8px;border-radius:50%;background:var(--c10-green);animation:c10-pulse 1.6s infinite}
.c10-feed table{width:100%;border-collapse:collapse;font-size:13px}
.c10-feed th{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--c10-muted2);text-align:left;font-weight:700;padding:10px 14px}
.c10-feed td{padding:11px 14px;border-top:1px solid var(--c10-line);white-space:nowrap}
.c10-feed tr:nth-child(even) td{background:rgba(255,255,255,.015)}
.c10-feed td.gm{display:flex;align-items:center;gap:10px;font-weight:600}.c10-feed td.gm img{width:30px;height:30px;border-radius:6px;object-fit:cover;object-position:top}
.c10-feed td.usr{color:var(--c10-muted)}.c10-feed td.win{text-align:right;color:var(--c10-green);font-weight:800;font-variant-numeric:tabular-nums}
.c10-feed td.gm a{color:inherit;text-decoration:none}
@media(max-width:640px){.c10-feed th:nth-child(2),.c10-feed td:nth-child(2){display:none}}

/* ===== anti-pisca: o lobby so aparece montado ===== */
html.c10-montando main{visibility:hidden}

/* b (16/10): o atalho Originals do menu herdava o fundo dourado do item ativo por uma regra da IG */
html.c10 aside nav a.c10-nav-og{background:transparent !important;color:var(--c10-muted) !important}
html.c10 aside nav a.c10-nav-og:hover{background:rgba(255,255,255,.05) !important;color:#fff !important}

/* ===== c (16/10): menu lateral no molde da Blaze (lista curta com icone de linha) ===== */
html.c10 aside nav.c10-nav{display:block;padding:14px 12px 24px}
.c10-seg{display:grid;grid-template-columns:1fr 1fr;background:var(--c10-panel);border-radius:999px;padding:4px;margin-bottom:14px}
.c10-seg a{height:38px;display:flex;align-items:center;justify-content:center;gap:8px;border-radius:999px;font-weight:800;font-size:13px;color:var(--c10-muted);text-decoration:none}
.c10-seg a.on{background:linear-gradient(180deg,var(--c10-gold2),var(--c10-gold));color:#1A1400}
.c10-seg a svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.c10-nav-t{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--c10-muted2);font-weight:800;padding:14px 12px 8px}
.c10-nav a.c10-it{display:flex;align-items:center;gap:12px;height:42px;padding:0 12px;border-radius:8px;color:var(--c10-muted);font-weight:600;font-size:13.5px;text-decoration:none;transition:.15s}
.c10-nav a.c10-it:hover{background:var(--c10-panel);color:#fff}
.c10-nav a.c10-it.on{background:var(--c10-panel2);color:#fff;box-shadow:inset 3px 0 0 var(--c10-gold)}
.c10-nav a.c10-it svg{width:20px;height:20px;flex:none;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.c10-nav a.c10-it .tag{margin-left:auto;font-size:9.5px;font-weight:800;letter-spacing:.08em;padding:3px 7px;border-radius:999px;background:#EF4444;color:#fff}
.c10-nav a.c10-it .tag.g{background:var(--c10-gold);color:#1A1400}
.c10-nav .c10-card{margin:14px 4px 0;padding:14px;border-radius:12px;background:linear-gradient(160deg,#153A22,#0C2416);border:1px solid var(--c10-line2)}
.c10-nav .c10-card b{display:block;font-size:13px;color:#fff}.c10-nav .c10-card p{margin:4px 0 10px;font-size:12px;color:var(--c10-muted);line-height:1.4}
.c10-nav .c10-card a{display:inline-flex;align-items:center;height:34px;padding:0 14px;border-radius:999px;background:linear-gradient(180deg,var(--c10-gold2),var(--c10-gold));color:#1A1400;font-weight:800;font-size:12.5px;text-decoration:none}

/* ===== d (16/10): area da conta no molde da Blaze (Minha conta, Depositar, Sacar, Extrato, Promocoes, Avisos) ===== */
html.c10.c10-conta main > div{max-width:980px !important}
.c10-ct{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:4px;margin:0 0 18px;background:var(--c10-panel);border:1px solid var(--c10-line);border-radius:10px}
.c10-ct::-webkit-scrollbar{display:none}
.c10-ct a{flex:none;display:flex;align-items:center;gap:8px;height:38px;padding:0 14px;border-radius:8px;font-size:13px;font-weight:700;color:var(--c10-muted);text-decoration:none;white-space:nowrap}
.c10-ct a svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.c10-ct a:hover{color:#fff;background:rgba(255,255,255,.04)}
.c10-ct a.on{background:var(--c10-panel2);color:#fff;box-shadow:inset 0 -2px 0 var(--c10-gold)}
/* cartoes da IG: cantos menores, borda e fundo da paleta */
html.c10.c10-conta main .rounded-2xl,html.c10.c10-conta main .rounded-xl{border-radius:8px !important}
html.c10.c10-conta main .bg-\[var\(--color-surface\)\]{background:#0B1A11 !important}
html.c10.c10-conta main h1{font-weight:900 !important;letter-spacing:-.01em}
/* botoes: principal dourado com texto escuro, secundario contorno */
html.c10.c10-conta main button[type=submit],html.c10.c10-conta main a.bg-\[var\(--color-primary\)\],html.c10.c10-conta main .bg-\[var\(--color-primary\)\]:not(input):not(div){background:linear-gradient(180deg,var(--c10-gold2),var(--c10-gold)) !important;color:#1A1400 !important;border-radius:8px !important;font-weight:800 !important}
html.c10.c10-conta main input[type=text],html.c10.c10-conta main input[type=email],html.c10.c10-conta main input[type=password],html.c10.c10-conta main input[type=tel],html.c10.c10-conta main input[type=number],html.c10.c10-conta main select{background:#10231A !important;border:1px solid #1C3A27 !important;border-radius:8px !important;color:#fff !important}
html.c10.c10-conta main input:focus{border-color:var(--c10-gold) !important;box-shadow:none !important;outline:0 !important}
/* chips de valor do deposito */
html.c10.c10-conta main form button[type=button]{border-radius:8px !important}
/* esconde a barra "aj-barra" e o Voltar da IG (a aba ja navega) */
html.c10.c10-conta main .aj-barra{display:none !important}

/* ===== e (16/10): cabecalho no molde da Blaze (saldo em pilula, Depositar dourado, sem Sacar no topo) ===== */
html.c10 header.sticky div.h-10.rounded-lg{background:#10231A !important;border:1px solid #1C3A27 !important;border-radius:999px !important;overflow:hidden}
html.c10 header.sticky div.h-10.rounded-lg > button{padding:0 12px 0 14px !important}
html.c10 header.sticky div.h-10.rounded-lg > button .uppercase{color:#8CA595 !important;letter-spacing:.12em}
html.c10 header.sticky div.h-10.rounded-lg > button .font-bold{color:#fff !important}
html.c10 header.sticky div.h-10.rounded-lg > a[href$="/depositar"]{background:linear-gradient(180deg,#FFD84D,#F5C21B) !important;color:#1A1400 !important;font-weight:800 !important;padding:0 14px !important;border-radius:999px !important;margin:3px !important;height:calc(100% - 6px) !important}
html.c10 header.sticky a.c10-sacar-topo{display:none !important}
html.c10 header.sticky > div > a[href$="/entrar"],html.c10 header.sticky > div > a[href$="/cadastrar"]{border-radius:999px !important;font-weight:800 !important}
html.c10 header.sticky > div > a[href$="/entrar"]{border:1px solid #27512F !important;background:transparent !important;color:#fff !important}
html.c10 header.sticky > div > a[href$="/cadastrar"]{background:linear-gradient(180deg,#FFD84D,#F5C21B) !important;color:#1A1400 !important}
html.c10 header.sticky .c10-avatar{box-shadow:0 0 0 2px #F5C21B}

/* ===== e: no celular a IG esconde o header nas telas de carteira (auth-janela) e deixa so a barra .aj-barra,
   que a gente tirou. Resultado: jogador sem menu nenhum. Header volta sempre. ===== */
html.c10.c10-conta header.sticky{display:block !important}
html.c10.c10-conta main .auth-janela{padding-top:8px !important}

/* ===== f (17/10): a regra da IG que esconde o header no celular e
   `@media(max-width:1023.98px) body:has(.auth-janela) header.sticky.top-0{display:none!important}` (0,3,2),
   empatava com a nossa e ganhava por vir depois. Aqui com especificidade maior. ===== */
@media(max-width:1023.98px){
  html.c10.c10-conta body:has(.auth-janela) header.sticky.top-0{display:block !important}
}

/* ===== g (17/10): a barra de baixo (nav.bb-mobile-bar) tambem sumia nas telas de carteira; volta junto com o header ===== */
@media(max-width:1023.98px){
  html.c10.c10-conta body:has(.auth-janela) nav.bb-mobile-bar{display:block !important}
  html.c10.c10-conta body:has(.auth-janela) main{padding-bottom:calc(84px + env(safe-area-inset-bottom)) !important}
}
