/* Base dos jogos dos Passatempos da Delza de Oliveira (24/10/2026): barra, avisos, botões, caixas e o balão do memoji.
   O Buraco tem o próprio estilo (buraco/buraco.css); Memória, Dominó, Damas e Cruzadinha usam este. */
:root{
  --vermelho:#ae0100; --verde:#006b03; --verde-esc:#023a03; --verde-mesa:#0b5a24; --ouro:#ffc302; --laranja:#ff7402;
  --creme:#fff8f0; --tinta:#1f1a1c;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;height:100%;background:var(--verde-esc);color:#fff;font-family:Nunito,system-ui,sans-serif;overscroll-behavior:none}
button{font:inherit;cursor:pointer}
.app{display:flex;flex-direction:column;min-height:100svh;max-width:900px;margin:0 auto;
  background:radial-gradient(120% 70% at 50% 40%,#137a32 0%,var(--verde-mesa) 55%,#063d17 100%)}

.barra{display:flex;align-items:center;gap:10px;padding:calc(8px + env(safe-area-inset-top,0px)) 10px 8px;background:var(--verde-esc)}
.voltar{color:#fff;text-decoration:none;font-size:2rem;line-height:1;width:40px;height:40px;flex:none;display:grid;place-items:center;border-radius:50%;background:rgba(255,255,255,.1)}
.titulo{display:flex;flex-direction:column;line-height:1.05;flex:1;min-width:0}
.titulo b{font-family:"Baloo 2",Nunito,sans-serif;font-size:1.35rem;color:var(--ouro)}
.titulo span{font-size:.75rem;opacity:.8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.placar{display:flex;gap:6px;font-size:.82rem;font-weight:800}
.placar span{background:rgba(255,255,255,.12);border-radius:999px;padding:4px 10px;white-space:nowrap}
.placar b{color:var(--ouro);font-size:1rem}
.mais{width:40px;height:40px;flex:none;border-radius:50%;border:0;background:rgba(255,255,255,.12);color:#fff;font-size:1.4rem;line-height:1}

.aviso{margin:0;padding:8px 12px;min-height:2.4em;text-align:center;font-weight:800;font-size:.98rem;background:rgba(0,0,0,.25)}
.aviso.erro{color:#ffd7d2}
.acoes{display:flex;gap:8px;padding:8px 10px calc(10px + env(safe-area-inset-bottom,0px))}
.acoes button{flex:1;border:0;border-radius:999px;padding:12px 6px;font-weight:900;font-size:.98rem;background:#fff;color:var(--verde-esc);
  display:flex;align-items:center;justify-content:center;gap:6px;min-height:48px}
.acoes button.forte{background:var(--ouro);color:var(--tinta)}
.acoes button.leve{background:rgba(255,255,255,.18);color:#fff}
.acoes button img{width:26px;height:26px}
.acoes button:disabled{opacity:.38;cursor:default}

.toast{pointer-events:none;position:fixed;left:50%;top:9%;transform:translateX(-50%);z-index:20;background:#fff;color:var(--tinta);border-radius:22px;
  padding:12px 18px 12px 12px;display:flex;align-items:center;gap:12px;font-weight:900;font-size:1.05rem;box-shadow:0 18px 40px rgba(0,0,0,.4);
  animation:pula .45s cubic-bezier(.2,.9,.3,1.4);max-width:92vw}
.toast[hidden]{display:none}
/* fala da Delza de Oliveira: balão de conversa, com pontinha saindo do memoji */
.toast.fala{border-radius:22px 22px 22px 6px;border:3px solid var(--ouro);font-size:1rem;max-width:min(92vw,360px)}
.toast.fala img{width:58px;height:58px}
@keyframes pula{from{transform:translate(-50%,20px) scale(.8);opacity:0}}

.caixa{border:0;border-radius:24px;padding:22px 20px;max-width:min(440px,92vw);width:100%;background:var(--creme);color:var(--tinta);text-align:center}
.caixa::backdrop{background:rgba(2,30,8,.7)}
.caixa h2{font-family:"Baloo 2",Nunito,sans-serif;color:var(--vermelho);margin:0 0 12px;font-size:1.5rem;line-height:1.1}
.caixa p{margin:0 0 10px}
.caixa button{display:block;width:100%;margin:8px 0 0;border:0;border-radius:999px;padding:14px;font-weight:900;font-size:1rem;background:var(--verde);color:#fff}
.caixa button.forte{background:var(--ouro);color:var(--tinta)}
.caixa button.leve{background:transparent;color:var(--verde-esc);border:2px solid #d9cbb8}
.caixa table{width:100%;border-collapse:collapse;margin:6px 0 10px;font-size:.95rem}
.caixa th,.caixa td{padding:6px 4px;border-bottom:1px solid #eadfd2}
.caixa th:first-child,.caixa td:first-child{text-align:left}
.caixa tr.total td{font-weight:900;border-bottom:0}
.caixa img.emoji{margin:-4px auto 4px;display:block}
.regras{text-align:left}
.regras ul{padding-left:18px;margin:0 0 6px}
.regras li{margin:0 0 8px;line-height:1.45}
.niveis{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;padding:8px 10px 0}
.niveis button{border:2px solid rgba(255,255,255,.35);background:transparent;color:#fff;border-radius:999px;padding:7px 14px;font-weight:800}
.niveis button.on{background:var(--ouro);border-color:var(--ouro);color:var(--tinta)}

/* convite para compartilhar a vitória */
.caixa .partilha{background:#fff3c4;border:2px dashed var(--ouro);border-radius:16px;padding:10px 12px 12px;margin:10px 0 2px}
.caixa .partilha p{margin:0 0 6px;font-weight:800;color:var(--tinta)}
.caixa .partilha button{margin:0;background:var(--vermelho)}
.caixa .partilha small{display:block;margin-top:6px;color:var(--verde-esc);font-weight:700}