:root { --ev-azul: #0b1b3d; --ev-azul2: #12306b; --ev-vidro: rgba(11, 27, 61, .84); --ev-borda: rgba(244, 180, 0, .55); --ev-amarelo: #f4b400; --ev-texto: #f6f3ea; --ev-suave: #aebbd6; --ev-verde: #1f9d55; }
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; background: #0b1b3d; color: var(--ev-texto); font-family: Barlow, system-ui, sans-serif; overflow: hidden; }
#cena { position: fixed; inset: 0; width: 100%; height: 100%; display: block; touch-action: none; }
.ev-topo, .resultados, .presentes, .ev-rodape, .hora, .ev-dica { position: fixed; z-index: 3; }
.ev-topo { z-index: 9; top: max(10px, env(safe-area-inset-top)); left: 10px; right: 10px; display: flex; align-items: center; gap: 12px; pointer-events: none; }
.ev-topo > * { pointer-events: auto; }
.ev-marca { position: relative; display: flex; align-items: center; gap: 10px; padding: 6px 14px 6px 8px; background: var(--ev-vidro); border: 2px solid var(--ev-borda); border-radius: 14px; color: inherit; backdrop-filter: blur(6px); }
.ev-logo { padding: 0; border: 0; background: none; cursor: pointer; display: block; line-height: 0; }
.ev-marca img { border-radius: 9px; }
.ev-insta { color: inherit; text-decoration: none; }
.ev-marca b { display: block; font: 700 20px/1 'Barlow Condensed', sans-serif; letter-spacing: .02em; }
.ev-marca small { color: var(--ev-suave); font-size: 12px; }
.contagem { margin: 0 auto; padding: 8px 20px; text-align: center; background: var(--ev-vidro); border: 2px solid var(--ev-borda); border-radius: 16px; backdrop-filter: blur(6px); }
.contagem small { display: block; color: var(--ev-suave); font-size: 13px; }
.relogio { display: flex; align-items: baseline; justify-content: center; gap: 4px; font-family: 'Barlow Condensed', sans-serif; }
.relogio span { font-weight: 700; font-size: 38px; line-height: 1.05; min-width: 1.2ch; text-align: right; color: var(--ev-amarelo); font-variant-numeric: tabular-nums; }
.relogio i { font-style: normal; font-size: 15px; color: var(--ev-suave); margin-right: 8px; }
.contagem.ao-vivo .relogio { display: none; }
.placar { display: none; }
.contagem.ao-vivo #contagem-rot { color: var(--ev-amarelo); font: 700 24px/1.1 'Barlow Condensed', sans-serif; letter-spacing: .04em; }
.res-ensaio button { margin-left: 8px; padding: 3px 10px; border: 0; border-radius: 8px; background: var(--ev-amarelo); color: #1a1a1a; font: 700 12.5px Barlow, sans-serif; cursor: pointer; }
.faixa-fogos { position: fixed; z-index: 4; left: 50%; top: 40%; transform: translate(-50%, -50%) scale(.9); padding: 14px 30px; background: rgba(11, 27, 61, .9); border: 3px solid var(--ev-amarelo); border-radius: 20px; font: 600 28px 'Barlow Condensed', sans-serif; letter-spacing: .03em; text-align: center; opacity: 0; transition: opacity .6s, transform .6s; pointer-events: none; }
.faixa-fogos b { color: var(--ev-amarelo); font-size: 56px; margin-right: 8px; }
.faixa-fogos.mostra { opacity: 1; transform: translate(-50%, -50%) scale(1); }

.resultados { right: 10px; top: 112px; width: min(340px, calc(100vw - 20px)); max-height: calc(100vh - 190px); display: flex; flex-direction: column; background: var(--ev-vidro); border: 2px solid var(--ev-borda); border-radius: 16px; backdrop-filter: blur(6px); overflow: hidden; }
.res-cab { display: flex; justify-content: space-between; align-items: center; padding: 11px 14px; background: linear-gradient(90deg, var(--ev-azul2), #1a438f); font: 700 19px 'Barlow Condensed', sans-serif; letter-spacing: .02em; }
.res-cab span { font-size: 14px; color: var(--ev-amarelo); }
.res-ensaio { padding: 7px 12px; background: #7a2a1a; font-size: 12.5px; font-weight: 600; }
.res-corpo { padding: 6px 14px 4px; overflow: auto; }
.res-vazio { margin: 12px 0; color: var(--ev-suave); font-size: 14px; line-height: 1.45; }
.cand { display: grid; grid-template-columns: 52px 1fr; gap: 10px; align-items: center; padding: 10px 0; border-bottom: 1px solid rgba(255, 255, 255, .09); }
.cand:last-child { border-bottom: 0; }
.cand img { width: 52px; height: 62px; object-fit: cover; border-radius: 8px; background: #22325a; border: 2px solid var(--cor, var(--ev-amarelo)); }
.cand .l1 { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.cand .nome { font: 700 17px 'Barlow Condensed', sans-serif; letter-spacing: .02em; }
.cand .nome small { font: 500 12px Barlow, sans-serif; color: var(--ev-suave); margin-left: 4px; }
.cand .pct { font: 700 28px 'Barlow Condensed', sans-serif; color: var(--cor, var(--ev-amarelo)); font-variant-numeric: tabular-nums; }
.cand .barra { height: 9px; background: rgba(255, 255, 255, .1); border-radius: 5px; overflow: hidden; margin: 3px 0 4px; }
.cand .barra i { display: block; height: 100%; background: var(--cor, var(--ev-amarelo)); border-radius: 5px; transition: width .8s ease; }
.cand .votos { font-size: 12.5px; color: var(--ev-suave); display: flex; justify-content: space-between; }
.cand .eleito { color: #fff; background: var(--ev-verde); font-weight: 700; padding: 0 7px; border-radius: 6px; }
.res-rodape { display: flex; flex-wrap: wrap; gap: 2px 12px; padding: 8px 14px 10px; border-top: 1px solid rgba(255, 255, 255, .09); font-size: 12.5px; color: var(--ev-suave); }
.res-rodape small { flex-basis: 100%; font-size: 11.5px; }

.presentes { left: 10px; bottom: 44px; width: min(320px, calc(100vw - 20px)); padding: 10px 12px; background: var(--ev-vidro); border: 2px solid var(--ev-borda); border-radius: 16px; backdrop-filter: blur(6px); }
.chamar-amigo { width: 100%; margin-bottom: 8px; padding: 10px 14px; border: 0; border-radius: 12px; background: var(--ev-amarelo); color: #1a1a1a; font: 700 20px 'Barlow Condensed', sans-serif; letter-spacing: .03em; cursor: pointer; }
.chamar-amigo:hover { background: #ffd24a; }
#achar { display: flex; gap: 6px; }
#achar input { flex: 1; min-width: 0; padding: 9px 11px; border-radius: 10px; border: 2px solid rgba(255, 255, 255, .2); background: rgba(255, 255, 255, .08); color: var(--ev-texto); font: inherit; }
#achar button { padding: 0 14px; border-radius: 10px; border: 0; background: var(--ev-amarelo); color: #1a1a1a; font-weight: 700; cursor: pointer; }
.achar-msg { margin: 6px 0 0; min-height: 1.1em; font-size: 13px; color: var(--ev-amarelo); }
.ev-dica { padding: 5px 10px; background: rgba(8, 16, 36, .92); border: 1px solid var(--ev-borda); border-radius: 8px; font-size: 13px; font-weight: 600; pointer-events: none; transform: translate(12px, -34px); white-space: nowrap; }
.hora { right: 10px; bottom: 44px; width: 44px; height: 44px; border-radius: 12px; border: 2px solid var(--ev-borda); background: var(--ev-vidro); color: var(--ev-texto); font-size: 22px; cursor: pointer; }
.ev-rodape { left: 0; right: 0; bottom: 0; display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; padding: 8px 12px calc(8px + env(safe-area-inset-bottom)); background: linear-gradient(transparent, rgba(8, 16, 36, .85)); font-size: 12.5px; color: var(--ev-suave); }
.ev-rodape a { color: var(--ev-amarelo); }
.ev-carregando { position: fixed; inset: 0; z-index: 10; display: grid; place-content: center; justify-items: center; gap: 14px; background: #0b1b3d; transition: opacity .5s; font: 600 17px Barlow, sans-serif; }
.ev-carregando.fim { opacity: 0; pointer-events: none; }
.ev-carregando .ev-casa { width: 54px; height: 44px; background: var(--ev-amarelo); clip-path: polygon(50% 0, 100% 46%, 86% 46%, 86% 100%, 14% 100%, 14% 46%, 0 46%); animation: pula 1s ease-in-out infinite; }
@keyframes pula { 50% { transform: translateY(-9px); } }
.ev-semjs { position: fixed; inset: 40% 10% auto; z-index: 11; text-align: center; }

@media (max-width: 860px) {
  .ev-topo { gap: 8px; align-items: flex-start; flex-wrap: wrap; justify-content: space-between; }
  .ev-marca { padding: 3px; border-radius: 14px; gap: 0; }
  .ev-marca img { width: 38px; height: 38px; }
  .ev-insta { display: none; padding: 0 10px 0 8px; }
  .ev-marca.aberto { gap: 2px; } .ev-marca.aberto .ev-insta { display: block; } .ev-marca b { font-size: 16px; } .ev-marca small { font-size: 12px; }
  .ev-marca, .menu-jogo { z-index: 2; }
  .faixa-fogos { font-size: 20px; padding: 10px 20px; } .faixa-fogos b { font-size: 38px; }
  .contagem { order: 3; flex: 1 1 100%; margin: 0; padding: 5px 10px 7px; border-radius: 14px; }
  .contagem small { font-size: 13px; } #contagem-rot { font-weight: 600; color: var(--ev-texto); letter-spacing: .02em; }
  .relogio { gap: 3px; } .relogio span { font-size: 34px; } .relogio i { font-size: 18px; font-weight: 600; color: #dbe4f7; margin-right: 9px; }
  .contagem.ao-vivo #contagem-rot, .contagem.ao-vivo #contagem-sub { display: none; }
  .contagem.ao-vivo { padding: 6px 8px; }
  .placar { display: grid; grid-template-columns: 50px minmax(0, 1fr) 50px; align-items: center; gap: 6px; }
  .placar[hidden] { display: none; }
  .placar img { width: 50px; height: 60px; object-fit: cover; border-radius: 10px; background: #22325a; border: 2px solid var(--ev-amarelo); }
  .placar-linha { display: flex; align-items: baseline; justify-content: center; gap: 4px; font-family: 'Barlow Condensed', sans-serif; white-space: nowrap; }
  .placar-linha b { font-size: 15px; color: var(--ev-texto); } .placar-linha strong { font-size: 25px; line-height: 1; color: var(--ev-amarelo); font-variant-numeric: tabular-nums; } .placar-linha em { font-style: normal; font-size: 16px; color: var(--ev-suave); }
  .placar-meio { text-align: center; min-width: 0; }
  .placar-meio small { display: block; margin-top: 2px; font-size: 11.5px; color: var(--ev-suave); }
  .resultados { display: none; }
  .presentes { left: 8px; bottom: 52px; width: calc(100vw - 16px); display: flex; align-items: center; gap: 10px; padding: 7px 10px; }
  .chamar-amigo { width: auto; margin: 0; padding: 9px 14px; font-size: 18px; white-space: nowrap; }
  #achar { flex: 1; } #achar input { padding: 7px 9px; font-size: 14px; } .achar-msg { position: absolute; left: 12px; bottom: 100%; margin: 0 0 4px; background: rgba(8, 16, 36, .9); padding: 3px 8px; border-radius: 8px; }
  .achar-msg:empty { display: none; }
  .ev-rodape { gap: 10px; font-size: 11.5px; } .ev-rodape span:not(.fig) { display: none; } .ev-rodape .fig { flex-basis: 100%; text-align: center; }
}

/* ---------- jogo: abertura, participar, HUD, joystick, login ---------- */
.btn-participar { position: fixed; z-index: 6; left: 50%; bottom: 120px; transform: translateX(-50%); padding: 16px 46px; border: 3px solid #fff; border-radius: 18px; background: var(--ev-amarelo); color: #1a1a1a; font: 700 34px 'Barlow Condensed', sans-serif; letter-spacing: .04em; cursor: pointer; box-shadow: 0 8px 0 rgba(0, 0, 0, .35), 0 0 40px rgba(244, 180, 0, .55); animation: participar 1.6s ease-in-out infinite; }
.btn-participar:hover { background: #ffd24a; }
@keyframes participar { 50% { transform: translateX(-50%) translateY(-6px); box-shadow: 0 14px 0 rgba(0, 0, 0, .25), 0 0 60px rgba(244, 180, 0, .8); } }
.btn-pular { position: fixed; z-index: 6; right: 14px; bottom: 54px; padding: 9px 16px; border: 2px solid var(--ev-borda); border-radius: 12px; background: var(--ev-vidro); color: var(--ev-texto); font: 600 15px Barlow, sans-serif; cursor: pointer; backdrop-filter: blur(6px); }
body:has(#btn-pular:not([hidden])) .presentes, body:has(#btn-pular:not([hidden])) .resultados { opacity: .0; pointer-events: none; transition: opacity .6s; }
.hud-jogo { position: fixed; z-index: 5; left: 50%; bottom: 40px; transform: translateX(-50%); display: flex; align-items: center; gap: 14px; padding: 8px 12px; background: var(--ev-vidro); border: 2px solid var(--ev-borda); border-radius: 16px; backdrop-filter: blur(6px); max-width: calc(100vw - 20px); }
.hud-dica { color: var(--ev-suave); font-size: 13px; }
.hud-dica kbd { padding: 1px 6px; border: 1px solid var(--ev-suave); border-radius: 5px; font: 600 12px Barlow, sans-serif; color: var(--ev-texto); }
.hud-botoes { display: flex; gap: 6px; }
.hud-botoes button { padding: 8px 14px; border: 0; border-radius: 10px; background: var(--ev-amarelo); color: #1a1a1a; font: 700 14px Barlow, sans-serif; cursor: pointer; white-space: nowrap; }
.hud-botoes button.sec { background: rgba(255, 255, 255, .14); color: var(--ev-texto); }
.meu-nome { position: fixed; z-index: 4; left: 0; top: 0; padding: 2px 9px; border-radius: 8px; background: rgba(8, 16, 36, .88); border: 1px solid var(--ev-amarelo); color: var(--ev-amarelo); font: 700 13px Barlow, sans-serif; pointer-events: none; white-space: nowrap; }
.joy { position: fixed; z-index: 5; right: 22px; bottom: 110px; width: 128px; height: 128px; border-radius: 50%; background: rgba(11, 27, 61, .55); border: 3px solid var(--ev-borda); touch-action: none; display: none; }
.joy-botao { position: absolute; left: 50%; top: 50%; width: 54px; height: 54px; margin: -27px 0 0 -27px; border-radius: 50%; background: var(--ev-amarelo); box-shadow: 0 3px 0 rgba(0, 0, 0, .4); }
@media (pointer: coarse) { .joy:not([hidden]) { display: block; } .hud-dica { display: none; } }
body.jogando .presentes { display: none; }
body.jogando .resultados { top: 100px; max-height: 38vh; }
.dlg { position: fixed; inset: 0; z-index: 80; display: grid; place-items: center; padding: 16px; }
.dlg-fundo { position: absolute; inset: 0; background: rgba(5, 10, 26, .75); backdrop-filter: blur(3px); }
.dlg-caixa { position: relative; width: min(440px, 100%); padding: 22px; border-radius: 16px; background: #f6f3ea; color: #0d1b3a; border: 3px solid #123a7a; box-shadow: 0 10px 0 rgba(0, 0, 0, .3); }
.dlg-caixa h2 { margin: 0 0 8px; font: 700 28px 'Barlow Condensed', sans-serif; }
.dlg-demo { margin: 0 0 14px; padding: 9px 11px; border-radius: 9px; background: #fff3c4; font-size: 14px; line-height: 1.4; }
.dlg-caixa label { display: block; font: 600 14px Barlow, sans-serif; }
.dlg-caixa input { display: block; width: 100%; margin-top: 5px; padding: 11px 12px; border: 2px solid #123a7a; border-radius: 10px; font: 500 17px Barlow, sans-serif; }
.dlg-botoes { display: flex; justify-content: flex-end; gap: 8px; margin-top: 16px; }
.dlg-botoes button { padding: 11px 16px; border-radius: 10px; border: 2px solid #123a7a; background: #fff; color: #0d1b3a; font: 700 15px Barlow, sans-serif; cursor: pointer; }
.dlg-botoes .google { display: inline-flex; align-items: center; gap: 8px; background: #fff; border-color: #dadce0; box-shadow: 0 1px 3px rgba(0, 0, 0, .3); }
.dlg-botoes .google .g { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: conic-gradient(#ea4335 0 25%, #fbbc05 0 50%, #34a853 0 75%, #4285f4 0); color: #fff; font: 700 13px Arial, sans-serif; }
@media (max-width: 860px) {
  .btn-participar { bottom: 150px; font-size: 28px; padding: 13px 34px; }
  .hud-jogo { bottom: 52px; flex-wrap: wrap; justify-content: center; }
  .hud-botoes button { padding: 8px 11px; font-size: 13px; }
}


/* ---------- menu de três linhas (hora do dia, foto, privacidade, excluir conta, créditos, sair) ---------- */
.menu-jogo { position: relative; margin-left: auto; z-index: 4; }
.menu-btn { display: grid; align-content: center; justify-items: center; gap: 5px; width: 48px; height: 48px; border: 2px solid var(--ev-borda); border-radius: 14px; background: var(--ev-vidro); backdrop-filter: blur(6px); cursor: pointer; }
.menu-btn span { display: block; width: 24px; height: 3px; border-radius: 2px; background: var(--ev-amarelo); transition: transform .2s, opacity .2s; }
.menu-btn[aria-expanded="true"] span:nth-child(1) { transform: translateY(8px) rotate(45deg); } .menu-btn[aria-expanded="true"] span:nth-child(2) { opacity: 0; } .menu-btn[aria-expanded="true"] span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }
.menu-painel { position: absolute; top: 56px; right: 0; width: 250px; padding: 10px; display: flex; flex-direction: column; gap: 6px; background: var(--ev-azul); border: 2px solid var(--ev-borda); border-radius: 16px; box-shadow: 0 12px 30px rgba(0, 0, 0, .45); }
.menu-rot { margin: 2px 4px 0; color: var(--ev-suave); font: 600 12px Barlow, sans-serif; text-transform: uppercase; letter-spacing: .08em; }
.ceu-op { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-bottom: 4px; }
.ceu-op button { padding: 10px 8px; border: 0; border-radius: 10px; background: rgba(255, 255, 255, .08); color: var(--ev-texto); font: 600 14px Barlow, sans-serif; cursor: pointer; white-space: nowrap; }
.ceu-op button:hover { background: rgba(255, 255, 255, .16); } .ceu-op button.sel { background: var(--ev-amarelo); color: #1a1a1a; }
.menu-item { padding: 12px 14px; border: 0; border-radius: 10px; background: transparent; color: var(--ev-texto); font: 600 16px Barlow, sans-serif; text-align: left; cursor: pointer; }
.menu-item:hover { background: rgba(255, 255, 255, .1); }
.menu-sair { margin-top: 4px; background: rgba(200, 32, 58, .25); color: #ffd3d9; } .menu-sair:hover { background: rgba(200, 32, 58, .45); }

/* ---------- janelas (privacidade, créditos, excluir conta, foto) ---------- */
.modal { position: fixed; inset: 0; z-index: 60; display: grid; place-items: center; padding: 14px; }
.modal-fundo { position: absolute; inset: 0; background: rgba(5, 10, 26, .78); backdrop-filter: blur(3px); }
.modal-caixa { position: relative; display: flex; flex-direction: column; width: min(720px, 100%); max-height: min(88vh, 760px); background: #f6f3ea; color: #0d1b3a; border: 3px solid #123a7a; border-radius: 16px; overflow: hidden; box-shadow: 0 10px 0 rgba(0, 0, 0, .3); }
.modal-caixa header { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 12px 10px 18px; background: #123a7a; color: #fff; }
.modal-caixa h2 { margin: 0; font: 700 24px 'Barlow Condensed', sans-serif; }
.modal-x { width: 40px; height: 40px; border: 0; border-radius: 10px; background: rgba(255, 255, 255, .16); color: #fff; font-size: 26px; line-height: 1; cursor: pointer; }
.modal-corpo { padding: 14px 18px 18px; overflow: auto; line-height: 1.5; }
.modal-corpo iframe { display: block; width: 100%; height: min(66vh, 560px); border: 0; background: #fff; }
.modal-corpo p { margin: 0 0 10px; }
.modal-acoes { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.modal-acoes button { padding: 12px 16px; border-radius: 12px; border: 2px solid #123a7a; background: #fff; color: #0d1b3a; font: 700 16px Barlow, sans-serif; cursor: pointer; }
.modal-acoes .g { display: inline-grid; place-items: center; width: 22px; height: 22px; margin-right: 6px; border-radius: 50%; background: conic-gradient(#ea4335 0 25%, #fbbc05 0 50%, #34a853 0 75%, #4285f4 0); color: #fff; font: 700 13px Arial, sans-serif; }
.modal-acoes .perigo { background: #c8203a; border-color: #8e1428; color: #fff; } .modal-acoes .primario { background: #123a7a; color: #fff; }
.modal-acoes button[disabled] { opacity: .45; cursor: not-allowed; }
.modal-aviso { padding: 10px 12px; border-radius: 10px; background: #fff3c4; font-size: 14px; }
.foto-previa { display: block; width: 100%; max-height: 56vh; object-fit: contain; border-radius: 10px; background: #0b1b3d; }

/* ---------- modo foto ---------- */
body.modo-foto .ev-topo, body.modo-foto .presentes, body.modo-foto .resultados, body.modo-foto .ev-rodape, body.modo-foto .hud-jogo, body.modo-foto .joy, body.modo-foto .amigo-joy, body.modo-foto .btn-participar, body.modo-foto .meu-nome { display: none !important; }
.foto-barra { position: fixed; z-index: 30; left: 0; right: 0; bottom: 0; display: grid; justify-items: center; gap: 6px; padding: 12px 16px calc(16px + env(safe-area-inset-bottom)); background: linear-gradient(transparent, rgba(8, 16, 36, .75)); }
.foto-obturador { width: 78px; height: 78px; border-radius: 50%; border: 5px solid #fff; background: rgba(255, 255, 255, .18); cursor: pointer; display: grid; place-items: center; }
.foto-obturador span { display: block; width: 56px; height: 56px; border-radius: 50%; background: #fff; transition: transform .1s; } .foto-obturador:active span { transform: scale(.88); }
.foto-fechar { position: absolute; left: 16px; bottom: calc(28px + env(safe-area-inset-bottom)); width: 48px; height: 48px; border: 0; border-radius: 50%; background: rgba(8, 16, 36, .85); color: #fff; font-size: 28px; cursor: pointer; }
.foto-dica { color: #fff; font: 600 14px Barlow, sans-serif; text-shadow: 0 1px 3px #000; }

/* ---------- botões chamativos: personalizar e chamar amigo ---------- */
@keyframes brilho { 0% { box-shadow: 0 6px 0 #a64b00, 0 0 0 0 rgba(255, 190, 40, .7); } 70% { box-shadow: 0 6px 0 #a64b00, 0 0 0 14px rgba(255, 190, 40, 0); } 100% { box-shadow: 0 6px 0 #a64b00, 0 0 0 0 rgba(255, 190, 40, 0); } }
.chamar-amigo { display: flex; align-items: center; justify-content: center; gap: 10px; background: linear-gradient(180deg, #ffd24a, #f48c06) !important; color: #3a1d00 !important; border: 3px solid #fff3c4 !important; box-shadow: 0 6px 0 #a64b00; animation: brilho 2.2s ease-out infinite; text-shadow: 0 1px 0 rgba(255, 255, 255, .5); }
.chamar-amigo:active { transform: translateY(3px); box-shadow: 0 3px 0 #a64b00; }
.hud-botoes .btn-visual { display: inline-flex; align-items: center; gap: 8px; padding: 12px 20px; border: 3px solid #fff !important; border-radius: 14px !important; background: linear-gradient(135deg, #7c3aed, #ec4899 60%, #f59e0b) !important; color: #fff !important; font: 700 19px 'Barlow Condensed', sans-serif !important; letter-spacing: .04em; box-shadow: 0 6px 0 #4c1d95, 0 0 22px rgba(236, 72, 153, .6); animation: balanca 3s ease-in-out infinite; }
.hud-botoes .btn-visual .ico { font-size: 22px; } .hud-botoes .btn-visual:active { transform: translateY(3px); box-shadow: 0 3px 0 #4c1d95; }
@keyframes balanca { 0%, 88%, 100% { transform: rotate(0); } 92% { transform: rotate(-3deg) scale(1.04); } 96% { transform: rotate(3deg) scale(1.04); } }
.amigo-joy { position: fixed; z-index: 5; right: 18px; bottom: 258px; display: none; align-items: center; gap: 8px; padding: 11px 16px; border: 3px solid #123a7a; border-radius: 999px; background: #fff; color: #123a7a; font: 700 17px 'Barlow Condensed', sans-serif; letter-spacing: .03em; box-shadow: 0 5px 0 rgba(0, 0, 0, .3), 0 0 18px rgba(255, 255, 255, .4); cursor: pointer; }
.amigo-joy:active { transform: translateY(2px); }
@media (pointer: coarse), (max-width: 860px) { body.jogando .amigo-joy:not([hidden]) { display: inline-flex; } }
@media (prefers-reduced-motion: reduce) { .chamar-amigo, .hud-botoes .btn-visual { animation: none; } }

[hidden] { display: none !important; }