/* ================= A Aldeia (jogo de grupo) — estilos próprios =================
   Pensado para pessoas mais velhas: letra grande, botões grandes com texto, alto contraste.
   Usa as variáveis de css/style.css (claro/escuro). Cabe em ecrãs de 320 px. Prefixo: ald-. */
.ald-pagina { overflow-x: hidden; --ald-noite: #1f2a44; --ald-noite2: #2c3a5c; --ald-lobo: #8c1d18; --ald-aldeia: #1f6e3d; --ald-raposa: #b45309; }
.ald { font-size: 1.15rem; line-height: 1.45; max-width: 560px; padding: 14px 14px 24px; }
.ald *, .ald *::before, .ald *::after { min-width: 0; }
.ald h2 { font-size: 1.45rem; line-height: 1.2; margin: 0 0 12px; }
.ald h3 { font-size: 1.2rem; margin: 0 0 10px; }
.ald-texto { margin: 0 0 12px; color: var(--tinta); }
.ald-nota { margin: 8px 0 0; font-size: 1.02rem; color: var(--tinta2); }
.ald-centro { text-align: center; }
.ald-emoji { font-size: 3rem; margin: 0 0 4px; line-height: 1.1; text-align: center; }
.ald-ou { text-align: center; font-weight: 700; color: var(--tinta2); margin: 6px 0; }
.ald-aviso { color: #8a4b00; font-weight: 700; }
.ald-aviso-caixa { background: #fff3c4; color: #5a4600; border: 2px solid #d6a62a; border-radius: 12px; padding: 10px 14px; margin: 0 0 14px; font-weight: 700; }

.ald-cartao { background: var(--bg2); border: 2px solid var(--linha); border-radius: 18px; padding: 18px 16px; margin: 0 0 14px; box-shadow: var(--sombra); overflow-wrap: anywhere; }
.ald-rotulo { display: block; font-weight: 800; font-size: 1.1rem; margin: 14px 0 8px; }
.ald-cartao > .ald-rotulo:first-child, .ald-config > .ald-rotulo:first-child { margin-top: 0; }

/* Início */
.ald-intro { text-align: center; padding: 6px 4px 8px; }
.ald-intro h2 { font-size: 1.8rem; }
.ald-intro-emoji { font-size: 3rem; margin: 0; line-height: 1.1; }
.ald-modo-grande { display: flex; align-items: center; gap: 14px; width: 100%; margin: 0 0 14px; padding: 18px; border-radius: 18px; border: 3px solid var(--tinta); background: var(--bg2); color: var(--tinta); font: inherit; text-align: left; cursor: pointer; box-shadow: var(--sombra); overflow-wrap: anywhere; touch-action: manipulation; }
.ald-modo-grande.ald-destaque { border-width: 4px; background: color-mix(in srgb, var(--ald-aldeia) 10%, var(--bg2)); }
.ald-modo-ico { font-size: 2rem; line-height: 1; flex: none; }
.ald-modo-txt { display: flex; flex-direction: column; gap: 4px; }
.ald-modo-txt b { font-size: 1.35rem; line-height: 1.2; }
.ald-modo-txt span { font-size: 1.05rem; color: var(--tinta2); }
.ald-modo-grande:active { transform: translateY(1px); }
.ald-topo-modo { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 10px; margin: 0 0 10px; }
.ald-modo-etq { font-weight: 800; color: var(--tinta2); font-size: 1rem; }
.ald-voltar { margin: 0 !important; padding-left: 0 !important; }

/* Campos */
.ald-input { display: block; width: 100%; font: inherit; font-size: 1.3rem; padding: 12px 14px; min-height: 58px; border: 3px solid var(--tinta2); border-radius: 14px; background: var(--bg2); color: var(--tinta); margin: 0 0 12px; }
.ald-input:focus { border-color: #2d6cdf; outline: 3px solid color-mix(in srgb, #2d6cdf 35%, transparent); outline-offset: 1px; }
.ald-input[aria-invalid="true"] { border-color: #b3261e; }
.ald-input-cod { font-size: 2.2rem; font-weight: 800; letter-spacing: .35em; text-align: center; font-variant-numeric: tabular-nums; padding-left: .35em; }
.ald-select { font-size: 1.15rem; appearance: auto; }
.ald-erro { background: #fde7e5; color: #8c1d18; border: 2px solid #b3261e; border-radius: 12px; padding: 10px 14px; margin: 0 0 12px; font-weight: 700; }
.ald-erro[hidden] { display: none; }
.ald-juntar { display: flex; gap: 8px; align-items: stretch; }
.ald-juntar .ald-input { flex: 1; margin: 0; }
.ald-juntar .ald-btn { width: auto; flex: none; margin: 0; padding: 10px 16px; }
.ald-juntar + .ald-erro { margin-top: 10px; }
.ald-nomes { list-style: none; counter-reset: n; padding: 0; margin: 12px 0 0; display: grid; gap: 6px; }
.ald-nomes li { counter-increment: n; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 6px 6px 6px 14px; border-radius: 12px; background: color-mix(in srgb, var(--tinta) 6%, var(--bg2)); font-weight: 700; font-size: 1.15rem; }
.ald-nomes li span::before { content: counter(n) ". "; color: var(--tinta2); font-weight: 600; }
.ald-remover { flex: none; width: 48px; height: 48px; border-radius: 12px; border: 2px solid var(--tinta2); background: var(--bg2); color: var(--tinta); font-size: 1.2rem; cursor: pointer; }

/* Botões */
.ald-btn { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 60px; padding: 14px 18px; border-radius: 16px; border: 3px solid var(--tinta); font: inherit; font-size: 1.2rem; font-weight: 800; line-height: 1.2; text-align: center; text-decoration: none; cursor: pointer; margin: 0 0 10px; touch-action: manipulation; }
.ald-primario { background: var(--tinta); color: var(--bg); }
.ald-secundario { background: var(--bg2); color: var(--tinta); }
.ald-grande { min-height: 72px; font-size: 1.32rem; }
.ald-btn:disabled { opacity: .5; cursor: default; }
.ald-btn:active:not(:disabled) { transform: translateY(1px); filter: brightness(.95); }
.ald-link { background: transparent; border: 0; text-decoration: underline; min-height: 48px; font-weight: 700; color: var(--tinta); width: auto; margin: 6px auto 0; }
.ald-mini { width: auto; min-height: 44px; padding: 6px 12px; font: inherit; font-size: 1rem; font-weight: 800; border: 2px solid var(--tinta); margin: 0; border-radius: 12px; background: var(--bg2); color: var(--tinta); cursor: pointer; }
.ald-linha-btns { display: grid; gap: 0; margin-top: 12px; }
.ald-btn, .ald-alvo, .ald-modo-grande, .ald-opcao, .ald-extra { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }

/* Configuração */
.ald-opcoes { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ald-opcao { min-height: 60px; border-radius: 14px; border: 3px solid var(--tinta2); background: var(--bg2); color: var(--tinta); font: inherit; font-size: 1.25rem; font-weight: 800; cursor: pointer; }
.ald-opcao.ativa { background: var(--tinta); color: var(--bg); border-color: var(--tinta); }
.ald-opcao.ativa::before { content: "✓ "; }
.ald-extras { display: grid; gap: 8px; }
.ald-extra { display: flex; align-items: center; gap: 12px; min-height: 64px; padding: 10px 14px; border-radius: 14px; border: 3px solid var(--tinta2); background: var(--bg2); cursor: pointer; }
.ald-extra.ativo { border-color: var(--ald-aldeia); background: color-mix(in srgb, var(--ald-aldeia) 10%, var(--bg2)); }
.ald-extra input { width: 28px; height: 28px; flex: none; margin: 0; accent-color: var(--ald-aldeia); }
.ald-extra-ico { font-size: 1.7rem; flex: none; }
.ald-extra-txt { display: flex; flex-direction: column; }
.ald-extra-txt b { font-size: 1.2rem; }
.ald-extra-txt small { font-size: 1rem; color: var(--tinta2); }

/* Sala */
.ald-codigo { display: flex; justify-content: center; gap: 8px; margin: 4px 0 12px; }
.ald-codigo span { display: grid; place-items: center; width: 62px; height: 76px; border-radius: 14px; background: var(--tinta); color: var(--bg); font-size: 2.8rem; font-weight: 900; font-variant-numeric: tabular-nums; }
@media (max-width: 340px) { .ald-codigo span { width: 54px; height: 68px; font-size: 2.4rem; } }
.ald-qr { display: block; width: min(200px, 66%); height: auto; margin: 4px auto 12px; border-radius: 8px; border: 2px solid var(--linha); background: #fff; }
.ald-pessoas { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; }
.ald-pessoas li { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 10px; padding: 10px 14px; border-radius: 12px; background: color-mix(in srgb, var(--tinta) 6%, var(--bg2)); font-weight: 700; font-size: 1.18rem; }
.ald-pessoas li.desligado { opacity: .7; }
.ald-p-nome small { font-weight: 600; color: var(--tinta2); font-size: .95rem; }
.ald-p-info { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.ald-etq { font-size: .92rem; font-weight: 800; padding: 3px 10px; border-radius: 999px; }
.ald-etq-narr { background: #ffe9a8; color: #4a3800; }
.ald-etq-off { background: #e7e9ee; color: #333b47; }
.ald-espera { font-size: 1.2rem; font-weight: 700; margin: 0 0 8px; }
.ald-ligacao { position: sticky; top: var(--altura-topo, 57px); z-index: 9; background: #ffe066; color: #1d2733; text-align: center; font-weight: 800; padding: 10px 14px; font-size: 1.05rem; }
.ald-ligacao[hidden] { display: none; }
.ald-mais { margin: 4px 0 14px; }
.ald-mais summary, .ald-registar summary, .ald-meu-papel summary { cursor: pointer; font-weight: 800; min-height: 48px; display: flex; align-items: center; padding: 6px 4px; }
.ald-mais[open] summary { margin-bottom: 8px; }

/* Cartão do papel */
.ald-papel { text-align: center; border-radius: 18px; padding: 18px 14px; margin: 6px 0 12px; border: 4px solid var(--cor-papel); background: color-mix(in srgb, var(--cor-papel) 9%, var(--bg2)); }
.ald-papel-lobo { --cor-papel: var(--ald-lobo); }
.ald-papel-aldeia { --cor-papel: var(--ald-aldeia); }
.ald-papel-raposa { --cor-papel: var(--ald-raposa); }
.ald-papel-emoji { font-size: 4rem; line-height: 1.1; margin: 0; }
.ald-papel-rot { margin: 6px 0 0; color: var(--tinta2); font-weight: 700; }
.ald .ald-papel-nome { font-size: 2.1rem; margin: 0 0 4px; color: var(--cor-papel); }
@media (prefers-color-scheme: dark) { .ald .ald-papel-nome { color: var(--tinta); } }
.ald-papel-equipa { display: inline-block; margin: 0 0 10px; padding: 3px 12px; border-radius: 999px; background: var(--cor-papel); color: #fff; font-weight: 800; font-size: 1rem; }
.ald-papel-texto { margin: 0; font-size: 1.15rem; }
.ald-papel-lobos { margin: 12px 0 0; font-weight: 800; font-size: 1.2rem; }
.ald-passe-nome { text-align: center; font-size: 2.2rem; font-weight: 900; margin: 4px 0 10px; line-height: 1.15; }
.ald-progresso { text-align: center; color: var(--tinta2); font-weight: 700; margin: 0 0 8px; }
.ald-meu-papel { background: var(--bg2); border: 2px solid var(--linha); border-radius: 18px; padding: 6px 14px; margin: 0 0 14px; }

/* Noite */
.ald-noite { background: var(--ald-noite); color: #f3f5fb; border-color: var(--ald-noite2); }
.ald-noite h2, .ald-noite .ald-texto { color: #f3f5fb; }
.ald-noite .ald-nota { color: #c9d1e6; }
.ald-noite-espera { text-align: center; padding: 30px 16px; }
.ald-alvos { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 8px; margin: 4px 0 12px; }
.ald-alvo { min-height: 60px; padding: 10px 8px; border-radius: 14px; border: 3px solid var(--tinta2); background: var(--bg2); color: var(--tinta); font: inherit; font-size: 1.15rem; font-weight: 800; cursor: pointer; overflow-wrap: anywhere; touch-action: manipulation; }
.ald-alvo.escolhido { background: #ffe066; color: #1d2733; border-color: #1d2733; }
.ald-noite .ald-alvo { background: var(--ald-noite2); color: #fff; border-color: #8090b8; }
.ald-noite .ald-alvo.escolhido { background: #ffe066; color: #1d2733; border-color: #fff; }
.ald-noite .ald-secundario { background: var(--ald-noite2); color: #fff; border-color: #8090b8; }
.ald-ninguem.escolhido { background: #ffe066 !important; color: #1d2733 !important; }
.ald-confirmado { margin: 6px 0 0; padding: 10px 12px; border-radius: 12px; background: #ffe066; color: #1d2733; font-weight: 800; }
.ald-estado-passo { margin: 6px 0 10px; }
.ald-estado-passo p { margin: 0 0 4px; }
.ald-estado-grande { font-size: 1.25rem; font-weight: 800; margin: 6px 0 8px; }

/* Ecrã do narrador */
.ald-narr-topo { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 4px 10px; padding: 10px 14px; border-radius: 14px; margin: 0 0 12px; background: #ffe9a8; color: #4a3800; font-weight: 800; }
.ald-narr-topo.ald-noite { background: var(--ald-noite); color: #f3f5fb; }
.ald-narr-fase { font-size: 1.1rem; }
.ald-passos { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; padding: 0; margin: 0 0 12px; }
.ald-passos li { padding: 4px 10px; border-radius: 999px; background: color-mix(in srgb, var(--tinta) 8%, var(--bg2)); color: var(--tinta2); font-weight: 700; font-size: .95rem; }
.ald-passos li.feito { background: color-mix(in srgb, var(--ald-aldeia) 18%, var(--bg2)); color: var(--tinta); }
.ald-passos li.atual { background: var(--ald-noite); color: #fff; }
.ald-quem { font-weight: 800; margin: -4px 0 10px; }
.ald-diga { border-left: 6px solid #d6a62a; background: color-mix(in srgb, #ffe066 22%, var(--bg2)); border-radius: 0 12px 12px 0; padding: 10px 14px; margin: 0 0 12px; }
.ald-diga-rot { display: block; font-size: .95rem; font-weight: 800; color: var(--tinta2); margin-bottom: 2px; }
.ald-diga p { margin: 2px 0; font-size: 1.22rem; font-weight: 700; font-style: italic; }
.ald-so-narrador { border: 2px dashed var(--tinta2); border-radius: 12px; padding: 8px 14px; margin: 0 0 12px; }
.ald-so-narrador p { margin: 2px 0; }
.ald-so-rot { font-weight: 800; }
.ald-pergunta { font-weight: 800; margin-top: 6px; }
.ald-registar { border: 2px solid var(--linha); border-radius: 12px; padding: 4px 10px; margin: 0 0 12px; }
.ald-registar[open] { padding-bottom: 10px; }
.ald-contagem { list-style: none; padding: 0; margin: 6px 0 10px; display: grid; gap: 6px; }
.ald-contagem li { display: flex; justify-content: space-between; gap: 10px; padding: 8px 12px; border-radius: 10px; background: color-mix(in srgb, var(--tinta) 6%, var(--bg2)); }
.ald-contagem li.maioria { background: #ffe066; color: #1d2733; font-weight: 800; }
.ald-lista-papeis { list-style: none; padding: 0; margin: 0; display: grid; gap: 6px; }
.ald-lista-papeis li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2px 10px; padding: 8px 12px; border-radius: 10px; background: color-mix(in srgb, var(--tinta) 5%, var(--bg2)); }
.ald-lista-papeis li.morto { opacity: .65; }
.ald-lista-papeis li.morto .ald-lp-nome { text-decoration: line-through; }
.ald-lp-nome { font-weight: 800; }
.ald-lp-papel { color: var(--tinta2); }
.ald-quem-e-quem h3 { color: var(--tinta2); font-size: 1.05rem; }

/* Dia, resultado, fim */
.ald-anuncio { font-size: 1.3rem; font-weight: 700; margin: 0 0 8px; }
.ald-revelado { font-size: 1.25rem; font-weight: 800; margin: 0 0 8px; }
.ald-fora { border-color: #b3261e; }
.ald-fim { text-align: center; border-width: 4px; }
.ald-fim-aldeia { border-color: var(--ald-aldeia); }
.ald-fim-lobos { border-color: var(--ald-lobo); }
.ald-fim-raposa { border-color: var(--ald-raposa); }
.ald-fim-emoji { font-size: 4rem; margin: 0; line-height: 1.1; }
.ald-fim h2 { font-size: 1.9rem; }
.ald-fim-eu { font-size: 1.3rem; font-weight: 800; margin: 0; }

/* Regras (janela) */
.ald-regras { font-size: 1.1rem; line-height: 1.45; }
.ald-regras h3 { margin: 18px 0 6px; font-size: 1.2rem; text-transform: none; letter-spacing: 0; color: var(--tinta); }
.ald-regras p { margin: 0 0 10px; }
.ald-regras .ald-lista-regras { padding-left: 0; list-style: none; margin: 0 0 10px; display: grid; gap: 8px; }
.ald-lista-regras li { padding-left: 0; }
.ald-regra-papel { display: flex; gap: 10px; align-items: flex-start; }
.ald-regra-ico { font-size: 1.6rem; line-height: 1.2; flex: none; }
