:root{
  --preto:#000;--preto-2:#0a0a0a;--preto-3:#141414;--preto-4:#1c1c1c;--preto-5:#2a2a2a;
  --prata:#b8b8b8;--prata-claro:#d4d4d4;--prata-muito-claro:#ececec;--prata-escura:#707070;
  --cinza:#9ca3af;--erro:#ef4444;--sucesso:#22c55e;--texto:#f5f5f5;--texto-forte:#fff;--borda:#2a2a2a;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;font-family:'Inter',system-ui,sans-serif;color:var(--texto);background:var(--preto);-webkit-font-smoothing:antialiased}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
input,select,textarea{font-family:inherit;font-size:16px}
a{color:var(--prata-claro);text-decoration:none}

.app{max-width:480px;margin:0 auto;min-height:100vh;background:var(--preto-2);position:relative;box-shadow:0 0 60px rgba(184,184,184,.05)}
@media(min-width:768px) and (max-width:1023px){body{background:radial-gradient(ellipse at top,#111 0%,#000 60%);background-attachment:fixed}.app{margin-top:24px;margin-bottom:24px;min-height:calc(100vh - 48px);border-radius:24px;overflow:hidden;border:1px solid var(--preto-5)}}

/* ============ DESKTOP LAYOUT (1024px+) ============ */
@media(min-width:1024px){
  body{background:radial-gradient(ellipse at top,#0a0a0a 0%,#000 60%);background-attachment:fixed}
  .app{max-width:1400px;display:grid;grid-template-columns:260px 1fr;min-height:100vh;box-shadow:none;background:transparent;padding:0}
  .app.splash-only{grid-template-columns:1fr;max-width:100%}

  .header{display:none !important}
  .tabbar{display:none !important}

  /* Sidebar (gerada automaticamente via JS) */
  .desktop-sidebar{position:sticky;top:0;height:100vh;background:linear-gradient(180deg,#0a0a0a,#000);border-right:1px solid rgba(184,184,184,.15);padding:28px 20px;display:flex;flex-direction:column;gap:4px;overflow-y:auto}
  .desktop-sidebar .logo-wrap{display:flex;flex-direction:column;align-items:center;gap:10px;padding-bottom:20px;border-bottom:1px solid var(--preto-5);margin-bottom:14px}
  .desktop-sidebar .logo-wrap img{width:80px;filter:drop-shadow(0 0 20px rgba(212,212,212,.15))}
  .desktop-sidebar .logo-wrap .nome{font-weight:800;font-size:12px;color:var(--prata-muito-claro);letter-spacing:2px;text-align:center}
  .desktop-sidebar .logo-wrap .carisma{font-size:10px;color:var(--prata);font-style:italic;text-align:center;line-height:1.4;margin-top:4px}

  .desktop-sidebar .secao{font-size:10px;text-transform:uppercase;letter-spacing:1.5px;color:var(--prata-escura);padding:14px 12px 6px;font-weight:700}
  .desktop-sidebar a{display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:10px;color:#b0b0b0;font-weight:500;font-size:14px;transition:all .15s}
  .desktop-sidebar a:hover{background:rgba(184,184,184,.06);color:var(--prata-muito-claro)}
  .desktop-sidebar a.ativo{background:linear-gradient(135deg,rgba(212,212,212,.18),rgba(212,212,212,.04));color:var(--prata-muito-claro);border-left:3px solid var(--prata);padding-left:11px}
  .desktop-sidebar a .icone{font-size:18px;width:24px;text-align:center}
  .desktop-sidebar .perfil-footer{margin-top:auto;padding-top:14px;border-top:1px solid var(--preto-5);display:flex;align-items:center;gap:10px}
  .desktop-sidebar .perfil-footer .avatar-mini{width:36px;height:36px;border-radius:50%;background:var(--preto-4);border:1px solid var(--prata);display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--prata-muito-claro);overflow:hidden}
  .desktop-sidebar .perfil-footer .avatar-mini img{width:100%;height:100%;object-fit:cover}
  .desktop-sidebar .perfil-footer .nome-mini{flex:1;font-size:12px;color:var(--texto);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

  .main-desktop{padding:36px 48px;max-width:1100px}
  .main-desktop .tela{display:block !important;padding:0;animation:none}

  /* Em desktop, esconder splash mobile e usar versão ampla */
  .splash{min-height:calc(100vh - 40px);max-width:720px;margin:0 auto}

  /* Grids desktop pra algumas telas */
  .opcoes-lista{grid-template-columns:repeat(4,1fr) !important;gap:14px !important}
  .stats-grid{grid-template-columns:repeat(5,1fr) !important}
  .admin-stats{grid-template-columns:repeat(4,1fr)}
  .memoria-grid{grid-template-columns:repeat(4,1fr);max-width:480px;margin:0 auto 16px}

  /* Cards maiores */
  .card{padding:18px}
  .pedido, .oracao-card, .evento-card, .jogo-card{max-width:800px}

  /* Modal centralizado */
  .modal-overlay{align-items:center}
  .modal{max-width:560px;border-radius:20px}
}

@media(min-width:1280px){
  .main-desktop{padding:44px 64px}
}

.header{background:linear-gradient(180deg,#141414,#0a0a0a);color:#fff;padding:20px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:10;border-bottom:1px solid rgba(184,184,184,.2)}
.header .voltar{color:var(--prata-claro);background:rgba(184,184,184,.08);border:1px solid rgba(184,184,184,.25);width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:20px}
.header h1{font-size:17px;font-weight:600;letter-spacing:.2px;color:var(--prata-muito-claro)}
.header .acao{font-size:14px;color:var(--prata-claro);opacity:.9}
.header .mini-logo{height:30px;width:auto;opacity:.95}

.tela{display:none;padding:24px 20px 100px;animation:fade .35s ease}
.tela.ativa{display:block}
@keyframes fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

.splash{min-height:100vh;background:radial-gradient(ellipse at center top,#111 0%,#000 55%);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 24px;text-align:center;gap:20px;position:relative;overflow:hidden}
.splash::before{content:"";position:absolute;top:-100px;left:50%;transform:translateX(-50%);width:600px;height:600px;background:radial-gradient(circle,rgba(212,212,212,.12) 0%,rgba(212,212,212,.04) 40%,transparent 70%);pointer-events:none}
.splash .logo{width:190px;display:flex;align-items:center;justify-content:center;position:relative;z-index:1;filter:drop-shadow(0 0 24px rgba(212,212,212,.2))}
.splash .logo img{width:100%;height:auto;display:block}
.splash h1,.splash .sub,.splash .versiculo,.splash .botoes,.splash .carisma{position:relative;z-index:1}
.splash h1{color:var(--prata-muito-claro);font-size:26px;font-weight:800;letter-spacing:1px}
.splash .sub{color:#ccc;font-size:15px;max-width:320px;line-height:1.5}
.splash .versiculo{font-style:italic;opacity:.7;font-size:13px;margin-top:8px;max-width:320px}
.splash .botoes{width:100%;max-width:320px;display:flex;flex-direction:column;gap:12px;margin-top:20px}

.btn{width:100%;padding:15px;border-radius:14px;font-size:16px;font-weight:600;transition:all .2s;display:flex;align-items:center;justify-content:center;gap:8px}
.btn-primario{background:linear-gradient(135deg,var(--prata-claro),var(--prata));color:#000;font-weight:700}
.btn-primario:hover{transform:translateY(-1px);box-shadow:0 8px 24px rgba(212,212,212,.25)}
.btn-branco{background:var(--prata-claro);color:#000;font-weight:700}
.btn-outline{background:transparent;color:var(--prata-claro);border:2px solid var(--prata)}
.btn-outline:hover{background:rgba(184,184,184,.08)}
.btn-secundario{background:var(--preto-4);color:var(--texto);border:1px solid var(--preto-5)}
.btn-secundario:hover{background:var(--preto-5)}
.link-admin{display:block;text-align:center;color:#999;font-size:13px;margin-top:10px;padding:8px}
.link-admin:hover{color:var(--prata-claro)}

.form-grupo{margin-bottom:18px}
.form-grupo label{display:block;font-size:13px;font-weight:600;color:var(--prata);margin-bottom:6px;text-transform:uppercase;letter-spacing:.5px}
.form-grupo input,.form-grupo select,.form-grupo textarea{width:100%;padding:14px 16px;border:1px solid var(--preto-5);border-radius:12px;background:var(--preto-3);color:var(--texto);transition:border-color .2s}
.form-grupo input::placeholder{color:#555}
.form-grupo input:focus,.form-grupo select:focus,.form-grupo textarea:focus{outline:none;border-color:var(--prata);background:var(--preto-4)}
.form-grupo .dica{font-size:12px;color:var(--cinza);margin-top:4px}
.form-grupo code{background:var(--preto-4);padding:2px 6px;border-radius:4px;color:var(--prata-claro);font-size:12px}

.stepper{display:flex;gap:8px;margin-bottom:18px}
.stepper .passo{flex:1;height:6px;background:var(--preto-5);border-radius:3px}
.stepper .passo.ativo{background:var(--prata);box-shadow:0 0 10px rgba(184,184,184,.5)}
.stepper .passo.concluido{background:var(--sucesso)}
.stepper-info{font-size:13px;color:var(--cinza);margin-bottom:18px;font-weight:500}

.titulo-secao{font-size:22px;font-weight:700;margin-bottom:6px;color:var(--texto-forte)}
.sub-secao{color:var(--cinza);font-size:14px;margin-bottom:24px;line-height:1.5}

.card{background:var(--preto-3);border:1px solid var(--preto-5);border-radius:16px;padding:16px;margin-bottom:12px;transition:all .2s}
.card.clicavel:hover{border-color:var(--prata);transform:translateY(-1px)}
.card-titulo{font-weight:600;font-size:15px;margin-bottom:4px;color:var(--texto-forte)}
.card-sub{font-size:13px;color:var(--cinza)}
.card-stats{display:flex;gap:16px;margin-top:10px;font-size:12px;color:var(--cinza)}
.card-stats span strong{color:var(--prata-claro)}

.opcoes-lista{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:18px}
.opcao{border:1px solid var(--preto-5);border-radius:12px;padding:14px 12px;text-align:center;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s;background:var(--preto-3);color:var(--texto)}
.opcao:hover{border-color:var(--prata);background:var(--preto-4)}
.opcao.selecionada{border-color:var(--prata-claro);background:linear-gradient(135deg,rgba(212,212,212,.15),rgba(212,212,212,.04));color:var(--prata-muito-claro);font-weight:700;box-shadow:0 0 20px rgba(184,184,184,.15)}
.opcao-icone{font-size:22px;display:block;margin-bottom:4px}

.chip{display:inline-flex;gap:4px;padding:4px 10px;border-radius:20px;background:rgba(184,184,184,.1);color:var(--prata-claro);border:1px solid rgba(184,184,184,.3);font-size:12px;font-weight:500}

.email-card{text-align:center;padding:28px 20px;background:linear-gradient(135deg,var(--preto-3),var(--preto-4));border-radius:20px;margin-bottom:18px;border:1px solid rgba(184,184,184,.2)}
.email-card .icone{font-size:56px;margin-bottom:10px}
.email-card h2{font-size:20px;margin-bottom:8px;color:var(--prata-muito-claro)}
.email-card p{color:var(--cinza);line-height:1.5;font-size:14px}
.email-card strong{color:var(--prata-claro)}

.carisma-banner{background:linear-gradient(135deg,var(--preto-3),var(--preto-4));border:1px solid var(--preto-5);border-left:3px solid var(--prata);border-radius:14px;padding:14px 16px;margin-bottom:16px;position:relative}
.carisma-banner .et{font-size:10px;text-transform:uppercase;letter-spacing:1.5px;color:var(--prata);font-weight:700;margin-bottom:4px}
.carisma-banner .tx{font-style:italic;font-size:13px;color:var(--prata-muito-claro);line-height:1.5;font-weight:500}

.admin-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:20px}
.stat{background:linear-gradient(135deg,#141414,#000);border:1px solid rgba(184,184,184,.25);color:#fff;padding:16px;border-radius:14px}
.stat-valor{font-size:26px;font-weight:700;color:var(--prata-muito-claro)}
.stat-rotulo{font-size:12px;opacity:.9;text-transform:uppercase;letter-spacing:.5px;color:var(--prata)}

.busca{position:relative;margin-bottom:14px}
.busca input{width:100%;padding:12px 16px 12px 42px;border:1px solid var(--preto-5);border-radius:12px;background:var(--preto-3);color:var(--texto)}
.busca input::placeholder{color:#555}
.busca::before{content:"🔍";position:absolute;left:14px;top:50%;transform:translateY(-50%);font-size:16px;opacity:.7}

.membro{display:flex;align-items:center;gap:12px;padding:12px;border-radius:12px;cursor:pointer;transition:background .15s;border-bottom:1px solid var(--preto-5)}
.membro:hover{background:var(--preto-3)}
.avatar{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,var(--preto-5),var(--prata-escura));color:var(--prata-muito-claro);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:16px;flex-shrink:0;border:1px solid rgba(184,184,184,.3)}
.membro-info{flex:1;min-width:0}
.membro-nome{font-weight:600;font-size:14px;margin-bottom:2px;color:var(--texto-forte);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.membro-meta{font-size:12px;color:var(--cinza);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.tabbar{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:480px;background:rgba(10,10,10,.95);border-top:1px solid rgba(184,184,184,.2);display:flex;padding:8px 0;z-index:10;backdrop-filter:blur(12px)}
@media(min-width:768px){.tabbar{bottom:24px;border-radius:0 0 24px 24px}}
.tab{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 4px;color:#777;font-size:11px;font-weight:500;cursor:pointer}
.tab.ativo{color:var(--prata-claro)}
.tab-icone{font-size:22px}

/* ====== NOME BRILHANDO (completou orações do dia) ====== */
.nome-brilhando{background:linear-gradient(90deg,#d4d4d4,#ffffff,#d4d4d4,#ffffff,#d4d4d4);background-size:200% auto;-webkit-background-clip:text;background-clip:text;color:transparent;animation:brilho-slide 3s linear infinite;text-shadow:0 0 12px rgba(255,255,255,.5)}
@keyframes brilho-slide{0%{background-position:0% center}100%{background-position:200% center}}

/* ====== NOME DOURADO (completou a semana) ====== */
.nome-dourado{background:linear-gradient(90deg,#d4af37,#f5e7a0,#d4af37,#fff7c2,#d4af37);background-size:200% auto;-webkit-background-clip:text;background-clip:text;color:transparent;animation:brilho-slide 2.5s linear infinite;text-shadow:0 0 18px rgba(212,175,55,.7);font-weight:800 !important}

.toast{position:fixed;bottom:100px;left:50%;transform:translateX(-50%);background:var(--preto-3);color:var(--prata-muito-claro);padding:12px 20px;border:1px solid rgba(184,184,184,.3);border-radius:30px;font-size:14px;font-weight:500;box-shadow:0 10px 30px rgba(0,0,0,.6);z-index:100;opacity:0;pointer-events:none;transition:all .3s}
.toast.visivel{opacity:1;transform:translate(-50%,-8px)}
.toast.sucesso{background:var(--sucesso);color:#fff;border-color:var(--sucesso)}
.toast.erro{background:var(--erro);color:#fff;border-color:var(--erro)}

.perfil-header{text-align:center;padding:20px 0}
.perfil-header .avatar{width:80px;height:80px;font-size:28px;margin:0 auto 10px}
.perfil-header h2{font-size:20px;margin-bottom:2px;color:var(--prata-muito-claro)}
.perfil-header .email{color:var(--cinza);font-size:13px}
.info-linha{display:flex;justify-content:space-between;align-items:center;padding:14px 0;border-bottom:1px solid var(--preto-5)}
.info-linha .rotulo{color:var(--cinza);font-size:14px}
.info-linha .valor{font-weight:600;font-size:14px;color:var(--prata-muito-claro)}
.divisor{height:1px;background:var(--preto-5);margin:16px 0}

.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.7);display:none;align-items:flex-end;justify-content:center;z-index:50}
.modal-overlay.ativo{display:flex}
@media(min-width:768px){.modal-overlay{align-items:center;padding:20px}}
.modal{background:var(--preto-2);width:100%;max-width:480px;border-radius:24px 24px 0 0;padding:24px 20px 28px;border-top:1px solid rgba(184,184,184,.3);animation:slideUp .3s}
@media(min-width:768px){.modal{border-radius:20px}}
@keyframes slideUp{from{transform:translateY(100%)}to{transform:none}}
.modal h3{font-size:18px;margin-bottom:6px;color:var(--prata-muito-claro)}
.modal p{color:var(--cinza);font-size:14px;line-height:1.5;margin-bottom:16px}
.email-mock{background:var(--preto-3);border:1px solid var(--preto-5);border-radius:12px;padding:16px;margin-bottom:16px;font-size:13px;color:var(--texto)}
.email-mock .de{color:var(--cinza);margin-bottom:6px}
.email-mock .assunto{font-weight:600;margin-bottom:10px;color:var(--prata-claro)}

.aviso-admin{background:linear-gradient(135deg,var(--preto-3),var(--preto-4));border:1px solid var(--prata);border-left:3px solid var(--prata);border-radius:12px;padding:12px 14px;margin-bottom:16px;font-size:13px;color:var(--prata-muito-claro);line-height:1.5}
.aviso-admin strong{color:var(--prata-claro)}

.demo-banner{position:fixed;top:0;left:50%;transform:translateX(-50%);background:var(--prata);color:#000;padding:6px 16px;font-size:11px;font-weight:700;border-radius:0 0 10px 10px;z-index:99;letter-spacing:.5px;text-transform:uppercase}

/* ====== RPG / JORNADA ====== */
.rpg-hero{background:linear-gradient(135deg,#000 0%,#161616 60%,#2a2a2a 100%);color:#fff;border-radius:20px;padding:22px 20px;margin-bottom:18px;position:relative;overflow:hidden;border:1px solid rgba(184,184,184,.3)}
.rpg-hero::after{content:"";position:absolute;top:-60px;right:-60px;width:200px;height:200px;background:radial-gradient(circle,rgba(212,212,212,.2),transparent 65%)}
.rpg-avatar{width:70px;height:70px;border-radius:50%;background:radial-gradient(circle,rgba(212,212,212,.2),rgba(0,0,0,.5) 80%);border:2px solid var(--prata);display:flex;align-items:center;justify-content:center;font-size:32px;margin-bottom:10px;position:relative;z-index:1;box-shadow:0 0 30px rgba(184,184,184,.2)}
.rpg-nome{font-size:18px;font-weight:700;position:relative;z-index:1;color:var(--prata-muito-claro)}
.rpg-titulo{font-size:12px;text-transform:uppercase;letter-spacing:1.5px;margin-top:2px;position:relative;z-index:1;color:var(--prata)}
.rpg-nivel{display:flex;align-items:center;gap:12px;margin-top:16px;position:relative;z-index:1}
.rpg-nivel-num{background:var(--prata-claro);color:#000;font-weight:800;padding:4px 10px;border-radius:8px;font-size:14px;box-shadow:0 0 12px rgba(212,212,212,.4)}
.rpg-xp-barra{flex:1;height:10px;background:rgba(0,0,0,.5);border:1px solid rgba(184,184,184,.3);border-radius:5px;overflow:hidden}
.rpg-xp-preenchido{height:100%;background:linear-gradient(90deg,var(--prata-muito-claro),var(--prata));border-radius:5px;transition:width .5s ease;box-shadow:0 0 8px rgba(212,212,212,.4)}
.rpg-xp-texto{font-size:11px;opacity:.95;margin-top:4px;text-align:right;position:relative;z-index:1;color:var(--prata-claro)}

.stats-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin-bottom:18px}
.stat-atr{background:var(--preto-3);border:1px solid var(--preto-5);border-radius:12px;padding:10px 6px;text-align:center}
.stat-atr-icone{font-size:22px}
.stat-atr-valor{font-size:16px;font-weight:700;color:var(--prata-claro);margin-top:2px}
.stat-atr-nome{font-size:10px;color:var(--cinza);text-transform:uppercase;letter-spacing:.5px;margin-top:2px}

.missao{display:flex;align-items:center;gap:12px;padding:12px 14px;background:var(--preto-3);border:1px solid var(--preto-5);border-radius:14px;margin-bottom:8px;transition:all .2s;cursor:pointer}
.missao:hover{border-color:var(--prata);background:var(--preto-4)}
.missao.feita{background:rgba(34,197,94,.08);border-color:rgba(34,197,94,.4)}
.missao.feita .missao-nome{text-decoration:line-through;color:var(--cinza)}
.missao-icone{font-size:22px;width:36px;height:36px;background:rgba(184,184,184,.1);border:1px solid rgba(184,184,184,.25);border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.missao.feita .missao-icone{background:rgba(34,197,94,.15);border-color:rgba(34,197,94,.4)}
.missao-info{flex:1;min-width:0}
.missao-nome{font-size:14px;font-weight:600;color:var(--texto-forte)}
.missao-xp{font-size:11px;color:var(--prata-claro);font-weight:700;text-transform:uppercase;letter-spacing:.5px}
.missao-check{width:26px;height:26px;border-radius:50%;border:2px solid var(--preto-5);display:flex;align-items:center;justify-content:center;color:#fff;background:var(--preto-3);flex-shrink:0}
.missao.feita .missao-check{background:var(--sucesso);border-color:var(--sucesso)}

.medalhas-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:18px}
.medalha{aspect-ratio:1;background:var(--preto-3);border:1px solid var(--preto-5);border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:6px;text-align:center;font-size:10px;color:var(--cinza);cursor:pointer}
.medalha.ganha{background:linear-gradient(135deg,rgba(212,212,212,.15),rgba(212,212,212,.04));border-color:var(--prata);color:var(--prata-muito-claro)}
.medalha-icone{font-size:26px;margin-bottom:2px}
.medalha.travada{opacity:.25;filter:grayscale(.9)}
.medalha-nome{font-weight:600;line-height:1.1}

.rank-item{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;margin-bottom:6px;background:var(--preto-3);border:1px solid var(--preto-5)}
.rank-item.eu{background:linear-gradient(135deg,rgba(212,212,212,.18),rgba(212,212,212,.04));border-color:var(--prata)}
.rank-pos{font-weight:800;font-size:16px;color:var(--prata-claro);width:28px;text-align:center}
.rank-pos.top{font-size:22px}
.rank-xp{font-weight:700;color:var(--prata-claro);font-size:13px}

.jogo-card{background:var(--preto-3);border:1px solid var(--preto-5);border-radius:16px;padding:16px;margin-bottom:10px;display:flex;align-items:center;gap:14px;cursor:pointer;transition:all .2s}
.jogo-card:hover{border-color:var(--prata);transform:translateY(-2px)}
.jogo-icone{width:56px;height:56px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:30px;flex-shrink:0;background:linear-gradient(135deg,#2a2a2a,#404040);border:1px solid var(--prata)}
.jogo-nome{font-weight:700;font-size:15px;color:var(--texto-forte)}
.jogo-desc{font-size:12px;color:var(--cinza)}
.jogo-badge{background:rgba(184,184,184,.1);color:var(--prata-claro);border:1px solid rgba(184,184,184,.3);padding:3px 8px;border-radius:20px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;margin-top:4px;display:inline-block}

.quiz-progresso{display:flex;gap:4px;margin-bottom:16px}
.quiz-progresso .q{flex:1;height:6px;background:var(--preto-5);border-radius:3px}
.quiz-progresso .q.ativo{background:var(--prata)}
.quiz-progresso .q.ok{background:var(--sucesso)}
.quiz-pergunta{background:var(--preto-3);border:1px solid var(--preto-5);border-radius:16px;padding:18px;margin-bottom:14px}
.quiz-pergunta h3{font-size:16px;line-height:1.4;margin-bottom:10px;color:var(--texto-forte)}
.quiz-pergunta .versiculo{font-size:12px;color:var(--prata);font-style:italic}
.quiz-opcao{display:block;width:100%;text-align:left;padding:14px 16px;background:var(--preto-3);border:1px solid var(--preto-5);color:var(--texto);border-radius:12px;margin-bottom:8px;font-size:14px;font-weight:500;cursor:pointer}
.quiz-opcao:hover{border-color:var(--prata);background:var(--preto-4)}
.quiz-opcao.correta{background:rgba(34,197,94,.15);border-color:var(--sucesso);color:#86efac}
.quiz-opcao.errada{background:rgba(239,68,68,.15);border-color:var(--erro);color:#fca5a5}
.quiz-opcao.desativado{pointer-events:none;opacity:.65}

.forca-palavra{font-family:'Courier New',monospace;font-size:28px;font-weight:800;letter-spacing:10px;text-align:center;padding:20px;background:var(--preto-3);border:1px solid rgba(184,184,184,.3);border-radius:14px;margin-bottom:14px;color:var(--prata-muito-claro)}
.forca-dica{text-align:center;color:var(--cinza);font-size:13px;font-style:italic;margin-bottom:14px}
.forca-figura{text-align:center;font-size:56px;margin-bottom:8px}
.forca-teclado{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-bottom:12px}
.forca-tecla{aspect-ratio:1;background:var(--preto-3);border:1px solid var(--preto-5);color:var(--texto);border-radius:8px;font-weight:700;font-size:14px;cursor:pointer}
.forca-tecla:hover{background:var(--prata);color:#000;border-color:var(--prata)}
.forca-tecla.acertada{background:var(--sucesso);color:#fff;border-color:var(--sucesso);pointer-events:none}
.forca-tecla.errada{background:var(--preto-2);color:#444;pointer-events:none;opacity:.5}
.forca-erros{text-align:center;margin-bottom:10px;font-size:13px;color:var(--cinza)}

.memoria-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:16px}
.memoria-carta{aspect-ratio:1;background:linear-gradient(135deg,var(--preto-4),var(--preto-5));border:1px solid rgba(184,184,184,.25);border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:28px;cursor:pointer;color:var(--prata-claro);font-weight:800}
.memoria-carta.virada{background:var(--preto-2);border-color:var(--prata)}
.memoria-carta.acertada{background:linear-gradient(135deg,rgba(34,197,94,.2),rgba(34,197,94,.1));border-color:var(--sucesso)}
.memoria-placar{display:flex;justify-content:space-between;margin-bottom:14px;font-size:14px}
.memoria-placar span{font-weight:700;color:var(--prata-claro)}

.xp-float{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:linear-gradient(135deg,var(--prata-muito-claro),var(--prata));color:#000;padding:20px 30px;border-radius:20px;font-size:24px;font-weight:800;box-shadow:0 20px 50px rgba(0,0,0,.6),0 0 40px rgba(212,212,212,.3);z-index:200;opacity:0;pointer-events:none;transition:all .4s;text-align:center;border:1px solid rgba(212,212,212,.5)}
.xp-float.visivel{opacity:1;transform:translate(-50%,-60%) scale(1.1)}
.xp-float .et{font-size:12px;opacity:.85;text-transform:uppercase;letter-spacing:1px;margin-bottom:4px}
</style>