*{box-sizing:border-box}
:root{color-scheme:dark}
html,body{margin:0;min-height:100%;background:#02050c;color:#fff;font-family:Arial,Helvetica,sans-serif}
body{background:radial-gradient(circle at 50% -10%,#063b88 0,#06172f 28%,#02050c 63%)}
a{color:inherit;text-decoration:none}
.page-shell{width:min(100%,720px);min-height:100vh;margin:auto;padding:18px 16px 36px}
.topbar{display:flex;align-items:center;gap:14px;padding:8px 0 18px}
.back{display:grid;place-items:center;width:46px;height:46px;border:1px solid rgba(56,181,255,.55);border-radius:15px;background:rgba(4,20,47,.82);box-shadow:0 0 18px rgba(0,126,255,.22);font-size:36px;line-height:1}
.eyebrow{display:block;color:#29b8ff;font-size:12px;font-weight:800;letter-spacing:.24em}
h1{margin:4px 0 0;font-size:27px;line-height:1.1}
.intro{padding:16px 18px;margin-bottom:15px;border:1px solid rgba(42,175,255,.28);border-radius:18px;background:rgba(4,17,38,.78)}
.intro p{margin:0;color:#cfeaff;line-height:1.5}
.bank-list{display:grid;gap:12px}
.bank-card{display:grid;grid-template-columns:60px 1fr 28px;align-items:center;gap:13px;min-height:84px;padding:11px 15px;border:1px solid rgba(43,180,255,.58);border-radius:22px;background:linear-gradient(100deg,rgba(2,8,19,.98),rgba(5,48,111,.86));box-shadow:inset 0 0 22px rgba(0,128,255,.16),0 0 18px rgba(0,93,255,.12)}
.bank-card:active{transform:scale(.985)}
.bank-icon{display:grid;place-items:center;width:56px;height:56px;border:2px solid #0ea5ff;border-radius:50%;background:#02060d;box-shadow:0 0 16px #006aff;color:#fff;font-size:22px;font-weight:900}
.bank-copy strong,.bank-copy small{display:block}
.bank-copy strong{font-size:19px}
.bank-copy small{margin-top:5px;color:#95d9ff;font-size:13px}
.arrow{font-size:38px;color:#42bfff;text-shadow:0 0 12px #007cff}
.featured{display:grid;grid-template-columns:36px 1fr 24px;align-items:center;gap:10px;margin-top:20px;padding:17px 18px;border:1px solid #32bfff;border-radius:20px;background:linear-gradient(95deg,#041126,#0750b1);box-shadow:0 0 24px rgba(0,114,255,.3)}
.featured strong{font-size:17px}
.notice{margin:18px 8px 0;text-align:center;color:#7891ae;font-size:12px;line-height:1.45}


/* Versão 18 — efeitos visuais */
.back,.bank-card,.featured{position:relative;overflow:hidden;transition:transform .18s ease,box-shadow .22s ease,filter .18s ease}
.back:hover,.bank-card:hover,.featured:hover{transform:translateY(-2px);filter:brightness(1.06);box-shadow:0 10px 26px rgba(0,136,255,.18),0 0 16px rgba(50,191,255,.14)}
.back:active,.bank-card:active,.featured:active{transform:scale(.988)}
.back::after,.bank-card::after,.featured::after{content:"";position:absolute;top:0;bottom:0;left:-30%;width:20%;background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.20),rgba(255,255,255,0));transform:skewX(-20deg);opacity:0}
.back:hover::after,.bank-card:hover::after,.featured:hover::after{opacity:1;animation:bankSheen .9s ease}
@keyframes bankSheen{0%{left:-30%;opacity:0}18%{opacity:1}100%{left:110%;opacity:0}}


/* V48 — logos oficiais nos botões das bancas */
.bank-card{grid-template-columns:96px 1fr 28px}
.bank-logo{display:flex;align-items:center;justify-content:center;width:92px;height:58px;padding:6px 7px;border:1px solid rgba(255,255,255,.92);border-radius:15px;background:#ffffff;box-shadow:0 0 16px rgba(0,98,255,.12), inset 0 0 0 1px rgba(0,0,0,.03);overflow:hidden}
.bank-logo img{display:block;width:100%;height:100%;object-fit:contain}
.bank-logo-paratodos img{transform:scale(1.12)}
.bank-logo-bicho img{transform:scale(1.02)}
.bank-logo-cowboy img{transform:scale(1.06)}
@media(max-width:480px){.bank-card{grid-template-columns:84px 1fr 24px;padding:10px 11px;gap:10px}.bank-logo{width:80px;height:54px;padding:5px}.bank-copy strong{font-size:17px}.bank-copy small{font-size:12px}}

/* V60 — bancas recomendadas e parceiras em páginas separadas */
.bank-logo-text{display:grid;place-items:center;text-align:center;font-weight:900;line-height:.9;letter-spacing:.04em;color:#071832;background:linear-gradient(145deg,#fff,#d9efff)}
.big-bicho-logo{font-size:18px;text-shadow:0 1px 0 #fff}
.mago-logo{font-size:34px;line-height:1}


/* V61 — logos Big Bicho e Mago da Sorte */
.bank-logo-bigbicho{background:#020202;border-color:rgba(255,205,68,.75);box-shadow:0 0 16px rgba(255,200,50,.18), inset 0 0 0 1px rgba(255,255,255,.06)}
.bank-logo-bigbicho img{object-fit:contain;image-rendering:auto}
.bank-logo-mago{background:linear-gradient(135deg,#2a0a39,#6b2393 62%,#c767ff);border-color:rgba(255,188,246,.9);box-shadow:0 0 16px rgba(197,98,255,.18), inset 0 0 0 1px rgba(255,255,255,.08)}
.bank-logo-mago img{object-fit:cover;object-position:center}


/* V62 — Big Bicho com fundo branco e Mago enquadrado */
.bank-logo-bigbicho{background:#ffffff;border-color:rgba(220,230,244,.96);box-shadow:0 0 16px rgba(0,98,255,.12), inset 0 0 0 1px rgba(0,0,0,.03)}
.bank-logo-bigbicho img{object-fit:contain;image-rendering:auto;transform:scale(1.05)}
.bank-logo-mago{padding:2px;background:linear-gradient(135deg,#2f0d42,#6d2aa0 62%,#d278ff);border-color:rgba(255,196,248,.96);box-shadow:0 0 16px rgba(197,98,255,.18), inset 0 0 0 1px rgba(255,255,255,.08)}
.bank-logo-mago img{width:100%;height:100%;object-fit:cover;object-position:center;border-radius:11px}


/* V63 — botão Paratodos 8000 com GIF bônus */
.bank-card-bonus{grid-template-columns:96px 1fr 88px;}
.bonus-badge{display:flex;align-items:center;justify-content:flex-end;width:78px;height:56px;overflow:visible}
.bonus-badge img{display:block;max-width:100%;max-height:52px;object-fit:contain;mix-blend-mode:screen;filter:drop-shadow(0 0 10px rgba(255,201,58,.22));}
@media(max-width:480px){.bank-card-bonus{grid-template-columns:84px 1fr 72px}.bonus-badge{width:64px;height:50px}.bonus-badge img{max-height:44px}}


/* V65 — GIF bônus com o dobro do tamanho */
.bank-card-bonus.bank-card-bonus-large{grid-template-columns:96px 1fr 196px;min-height:140px;align-items:center;}
.bank-card-bonus.bank-card-bonus-large .bonus-badge{width:184px;height:124px;justify-content:flex-end;}
.bank-card-bonus.bank-card-bonus-large .bonus-badge img{max-width:100%;max-height:124px;object-fit:contain;mix-blend-mode:screen;filter:drop-shadow(0 0 14px rgba(255,201,58,.32));}
@media(max-width:480px){
  .bank-card-bonus.bank-card-bonus-large{grid-template-columns:84px 1fr 160px;min-height:122px;}
  .bank-card-bonus.bank-card-bonus-large .bonus-badge{width:152px;height:104px;}
  .bank-card-bonus.bank-card-bonus-large .bonus-badge img{max-height:104px;}
}


/* V75 — bônus animado em WEBP, maior e sem fundo */
.bank-card-bonus.bank-card-bonus-large{
  grid-template-columns:96px 1fr 142px;
  min-height:84px;
  align-items:center;
  padding:6px 15px;
}
.bank-card-bonus.bank-card-bonus-large .bonus-badge{
  width:134px;
  height:80px;
  align-self:center;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  overflow:visible;
}
.bank-card-bonus.bank-card-bonus-large .bonus-badge img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  background:transparent;
  filter:drop-shadow(0 0 12px rgba(255,201,58,.22));
}
@media(max-width:480px){
  .bank-card-bonus.bank-card-bonus-large{
    grid-template-columns:84px 1fr 114px;
    min-height:82px;
    padding:6px 11px;
    gap:10px;
  }
  .bank-card-bonus.bank-card-bonus-large .bonus-badge{
    width:108px;
    height:66px;
  }
  .bank-card-bonus.bank-card-bonus-large .bonus-badge img{
    width:100%;
    height:100%;
  }
}


/* V82 — cabeçalho com avatar nas páginas de bancas */
.page-shell{padding-top:10px}
.avatar-header{display:flex;align-items:center;gap:14px;padding:12px 0 18px;margin-bottom:8px;border-bottom:1px solid rgba(64,166,255,.20)}
.avatar-back{display:grid;place-items:center;width:46px;height:46px;flex:0 0 46px;border:1px solid rgba(56,181,255,.55);border-radius:15px;background:rgba(4,20,47,.82);box-shadow:0 0 18px rgba(0,126,255,.22);font-size:34px;line-height:1}
.avatar-brand{display:flex;align-items:center;gap:14px;min-width:0;flex:1}
.avatar-brand img{width:72px;height:72px;border-radius:50%;object-fit:cover;border:2px solid #5bc0ff;box-shadow:0 0 0 4px rgba(14,97,255,.18),0 0 28px rgba(0,139,255,.48)}
.avatar-brand-copy{min-width:0}
.avatar-brand-copy strong{display:block;font-size:24px;line-height:1.08;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.avatar-brand-copy span{display:block;margin-top:7px;color:#65bfff;font-size:13px;font-weight:900;letter-spacing:.22em}
.avatar-date{min-width:66px;padding:9px 10px;border:1px solid rgba(91,192,255,.45);border-radius:18px;text-align:center;background:linear-gradient(145deg,rgba(10,42,82,.95),rgba(2,11,25,.95));box-shadow:0 0 20px rgba(0,128,255,.22)}
.avatar-date small{display:block;color:#7ccaff;font-size:10px;text-transform:uppercase}.avatar-date b{display:block;font-size:28px;margin-top:2px}
@media(max-width:480px){.avatar-header{gap:10px;padding:10px 0 15px}.avatar-back{width:42px;height:42px;flex-basis:42px;font-size:30px}.avatar-brand{gap:10px}.avatar-brand img{width:58px;height:58px}.avatar-brand-copy strong{font-size:18px}.avatar-brand-copy span{font-size:10px;letter-spacing:.16em}.avatar-date{min-width:58px;padding:8px 8px}.avatar-date b{font-size:24px}}
@media(max-width:380px){.avatar-date{display:none}}