/* =========================================================
   Layout mobile inspirado no visual da referência enviada
   Tema: cassino floresta / verde neon / dourado
   ========================================================= */
:root{
  --sp7-bg:#001f16;
  --sp7-bg-2:#003522;
  --sp7-panel:#063b27;
  --sp7-panel-2:#0b5d36;
  --sp7-green:#49ff27;
  --sp7-green-2:#16c75b;
  --sp7-gold:#ffd537;
  --sp7-orange:#ff9b18;
  --sp7-text:#fff9d8;
  --sp7-muted:#b9d8bd;
  --sp7-shadow:0 12px 30px rgba(0,0,0,.48);
}
html,body{
  min-height:100%;
  background:
    radial-gradient(circle at 50% -10%, rgba(73,255,39,.25), transparent 22%),
    linear-gradient(180deg,#00150f 0%,#003522 42%,#00150f 100%)!important;
  color:var(--sp7-text)!important;
  overflow-x:hidden;
}
body:before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;
  background:linear-gradient(180deg,rgba(0,0,0,.05),rgba(0,0,0,.36)),
             radial-gradient(circle at 15% 20%,rgba(255,213,55,.18),transparent 18%),
             radial-gradient(circle at 82% 12%,rgba(73,255,39,.14),transparent 20%);
}
#app,.app,.page,.layout,main,[class*=Layout],[class*=layout]{background:transparent!important;}
/* Container mobile */
@media(max-width:768px){
  body{max-width:430px;margin:0 auto!important;background-color:#00150f!important;}
  #app{min-height:100vh;box-shadow:0 0 45px rgba(0,0,0,.55);}
}
/* Topo */
[class*=header], [class*=Header], [class*=top], [class*=Top], .navbar{
  background:linear-gradient(180deg,rgba(0,33,22,.94),rgba(0,33,22,.72))!important;
  backdrop-filter:blur(12px)!important;
  border-bottom:1px solid rgba(73,255,39,.28)!important;
  box-shadow:0 6px 20px rgba(0,0,0,.35)!important;
}
/* Botões Entrar / Registro */
button,.btn,[class*=button],[class*=Button]{
  border-radius:14px!important;font-weight:900!important;letter-spacing:.2px!important;
}
button:not([disabled]),.btn:not([disabled]){box-shadow:0 0 16px rgba(73,255,39,.16)!important;}
[class*=login],[class*=Login],[class*=entrar],[class*=Entrar]{
  border:1.5px solid var(--sp7-green)!important;color:var(--sp7-green)!important;
  background:rgba(0,34,21,.74)!important;
}
[class*=register],[class*=Register],[class*=registro],[class*=Registro],
[class*=primary],[class*=Primary]{
  background:linear-gradient(180deg,#7dff3d,#33e33b)!important;color:#00240e!important;
  border:1px solid #baff4d!important;text-shadow:0 1px 0 rgba(255,255,255,.24)!important;
}
/* Banner / hero */
[class*=banner],[class*=Banner],[class*=swiper],[class*=carousel],[class*=Carousel]{
  border-radius:0 0 22px 22px!important;overflow:hidden!important;
  box-shadow:var(--sp7-shadow)!important;
}
[class*=banner] img,[class*=Banner] img,[class*=swiper] img,[class*=carousel] img{object-fit:cover!important;}
/* Barras, cards e painéis */
[class*=card],[class*=Card],[class*=panel],[class*=Panel],[class*=box],[class*=Box],
[class*=section],[class*=Section],[class*=notice],[class*=Notice]{
  border-radius:16px!important;
  background:linear-gradient(180deg,rgba(12,83,48,.94),rgba(2,40,26,.96))!important;
  border:1px solid rgba(255,213,55,.3)!important;
  box-shadow:var(--sp7-shadow)!important;
}
/* Categorias verdes */
[class*=platform],[class*=Platform],[class*=category],[class*=Category],[class*=tab],[class*=Tab]{
  border-radius:14px!important;
}
[class*=platform-icon], [class*=category] img, [class*=tab] img{
  filter:drop-shadow(0 4px 8px rgba(0,0,0,.45));
}
[class*=platform], [class*=category], [class*=tab]{
  color:var(--sp7-text)!important;
}
[class*=active], .active{
  color:#fff!important;
  text-shadow:0 0 10px rgba(73,255,39,.55)!important;
}
/* Título Popular / seções */
[class*=title],[class*=Title],[class*=Popular],[class*=popular]{
  color:#fff7d0!important;font-weight:900!important;text-shadow:0 3px 10px rgba(0,0,0,.45)!important;
}
/* Grade de jogos */
.game-card,[class*=game-card],[class*=GameCard],[class*=gameItem],[class*=GameItem]{
  border-radius:14px!important;overflow:hidden!important;background:#06291c!important;
  border:1px solid rgba(255,213,55,.16)!important;box-shadow:0 8px 18px rgba(0,0,0,.42)!important;
  transform:translateZ(0);transition:transform .18s ease, box-shadow .18s ease!important;
}
.game-card:active,[class*=game-card]:active,[class*=GameCard]:active{transform:scale(.97)!important;}
.game-img,[class*=game-img],[class*=GameImg], [class*=game] img{
  border-radius:14px!important;object-fit:cover!important;
}
/* Notificação estilo barra verde com borda amarela */
[class*=notice],[class*=Notice],[class*=marquee],[class*=Marquee]{
  background:linear-gradient(90deg,#052c1c,#074b2f,#052c1c)!important;
  border:1.5px solid var(--sp7-gold)!important;color:#fff8cf!important;
}
/* Menu inferior fixo */
[class*=tabbar],[class*=Tabbar],[class*=tab-bar],[class*=bottom-nav],[class*=BottomNav],[class*=footer]{
  background:linear-gradient(180deg,rgba(3,55,34,.92),rgba(0,24,16,.98))!important;
  border-top:1px solid rgba(255,213,55,.45)!important;
  box-shadow:0 -12px 28px rgba(0,0,0,.48)!important;backdrop-filter:blur(14px)!important;
}
[class*=tabbar] [class*=active], [class*=footer] [class*=active]{
  color:#fff!important;background:linear-gradient(180deg,#1bff56,#05bb52)!important;
  border-radius:18px 18px 6px 6px!important;box-shadow:0 0 22px rgba(73,255,39,.48)!important;
}
/* Ícones flutuantes de suporte */
.support,[class*=support],[class*=customer],[class*=Customer],[class*=telegram],[class*=Telegram]{
  filter:drop-shadow(0 10px 18px rgba(0,0,0,.42));
}
/* Inputs e modais */
input,select,textarea{
  border-radius:14px!important;background:rgba(0,25,17,.72)!important;color:#fff!important;
  border:1px solid rgba(73,255,39,.32)!important;outline:none!important;
}
input:focus,select:focus,textarea:focus{box-shadow:0 0 0 3px rgba(73,255,39,.16)!important;}
[class*=modal],[class*=Modal],[class*=popup],[class*=Popup],.van-popup{
  background:linear-gradient(180deg,#063b27,#001a12)!important;border:1px solid rgba(255,213,55,.34)!important;
}
/* Pequeno refinamento para telas menores */
@media(max-width:480px){
  [class*=game-card],[class*=GameCard]{border-radius:12px!important;}
  [class*=header],[class*=Header]{min-height:56px!important;}
}
