/* Modo do perfil ativo, via body[data-modo]. "medio" = padrão (sem regras). */

/* Pequenos: menos interface, alvos maiores. */
body[data-modo="pequenos"] .drawer-busca,
body[data-modo="pequenos"] .drawer-chips-scroll,
body[data-modo="pequenos"] .drawer-ver-todos,
body[data-modo="pequenos"] #arvore,
body[data-modo="pequenos"] #eras {
  display: none;
}

body[data-modo="pequenos"] .peca {
  padding: 12px 14px;
}
body[data-modo="pequenos"] .peca .peca-icone { font-size: 40px; }
body[data-modo="pequenos"] .peca .peca-nome { font-size: 15px; }

body[data-modo="pequenos"] .drawer-grade {
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}
body[data-modo="pequenos"] .drawer-card { padding: 14px 10px; }
/* a orbe da gaveta (rodada anterior) tinha tamanho fixo de 40px — grande
   o bastante pro emoji "normal", mas pequeno demais pro emoji ampliado dos
   Pequenos, que estourava a bolha. Corrige só isso, sem tocar no resto. */
body[data-modo="pequenos"] .orbe-gaveta { --orbe-tam: 64px; }
body[data-modo="pequenos"] .orbe-gaveta .card-icone { font-size: 30px; }
body[data-modo="pequenos"] .drawer-card .card-nome { font-size: 14px; }

/* quique mais suave (menos "erro" na cara) */
body[data-modo="pequenos"] .peca.quique { animation-duration: 200ms; }

/* bob um tiquinho mais brincalhão pros pequenos */
body[data-modo="pequenos"] .peca .peca-icone,
body[data-modo="pequenos"] .drawer-card .card-icone {
  animation-name: icone-bob-grande;
}
@keyframes icone-bob-grande {
  from { transform: translateY(1px) scale(1); }
  to   { transform: translateY(-4px) scale(1.04); }
}