/* Mundo Aventuras Lu · marca.css · v1.0.0 (2026-10-12)
   Paleta REAL medida del logo (01_IDENTIDAD_VISUAL/logo/00_LEEME_LOGO.md §1).
   Tema claro único y deliberado: marca infantil pastel. Sin azul genérico (ADN §5). */
:root{
  --lila:#823EAA; --lila-aro:#954AC0; --lila-claro:#CD96FB; --lila-niebla:#F3E8FD;
  --rosa:#D63C88; --rosa-suave:#F7D3E4; --amarillo:#FDD653; --amarillo-suave:#FFF3C4;
  --crema:#FDF2E9; --blanco:#FFFFFF; --tinta:#2E1A3B; --tinta-suave:#6A5578; --linea:#E8D9F3;
  --ok:#2C8A57; --ok-suave:#E1F5E8; --error:#B8325F; --error-suave:#FCE6EE;
  --display:'Fredoka','Trebuchet MS','Segoe UI',sans-serif;
  --body:'Atkinson Hyperlegible','Segoe UI',Verdana,sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box}
html{background:var(--crema)}
body{margin:0;font-family:var(--body);font-size:17px;line-height:1.55;color:var(--tinta);background:var(--crema);
  padding-inline:16px;padding-block:0 48px;min-height:100%}
img{max-width:100%;height:auto}
h1,h2,h3{font-family:var(--display);font-weight:600;line-height:1.15;margin:0;text-wrap:balance}
p{margin:0}
a{color:var(--lila)}
button{font:inherit;cursor:pointer;color:inherit}
:focus-visible{outline:3px solid var(--rosa);outline-offset:2px}
.envoltura{max-width:1040px;margin:0 auto;display:flex;flex-direction:column;gap:28px}

/* Cabecera */
.cabecera{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-block:14px}
.marca{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--tinta)}
.marca img{width:46px;height:46px;border-radius:50%;box-shadow:0 0 0 3px var(--lila-claro)}
.marca b{font-family:var(--display);font-weight:700;font-size:1.25rem;color:var(--lila);line-height:1}
.marca small{display:block;font-size:.8rem;color:var(--tinta-suave)}
.menu{display:flex;gap:8px;flex-wrap:wrap;align-items:center}

/* Botones */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4em;font-family:var(--display);font-weight:600;font-size:1.02rem;
  border:0;border-radius:16px;padding:.65em 1.15em;background:var(--lila);color:var(--blanco);text-decoration:none;
  box-shadow:0 4px 0 #5B2A78;transition:transform .08s,box-shadow .08s;text-align:center}
.btn:active{transform:translateY(3px);box-shadow:0 1px 0 #5B2A78}
.btn.rosa{background:var(--rosa);box-shadow:0 4px 0 #9C2A62}
.btn.suave{background:var(--blanco);color:var(--lila);box-shadow:0 4px 0 var(--linea);outline:2px solid var(--linea);outline-offset:-2px}
.btn.peligro{background:var(--error);box-shadow:0 4px 0 #7E1F40}
.btn.chico{font-size:.92rem;padding:.45em .85em;border-radius:12px}
.btn:disabled{opacity:.45;cursor:not-allowed}

/* Tarjetas y bloques */
.tarjeta{background:var(--blanco);border:2px solid var(--linea);border-radius:24px;padding:20px;display:flex;flex-direction:column;gap:14px;min-width:0}
.ceja{font-family:var(--display);font-weight:600;font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:var(--rosa)}
.suave-txt{color:var(--tinta-suave)}
.chico-txt{font-size:.9rem}
.fila{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.rejilla{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}

/* Formularios */
.campo{display:flex;flex-direction:column;gap:6px}
.campo label{font-weight:700}
.campo input,.campo select{font:inherit;color:var(--tinta);background:var(--blanco);border:2px solid var(--linea);border-radius:14px;padding:.6em .8em;min-width:0;width:100%}
.campo input:focus{border-color:var(--lila-claro)}
.check-legal{display:flex;gap:10px;align-items:flex-start;font-size:.95rem}
.check-legal input{width:22px;height:22px;flex:none;margin-top:2px;accent-color:var(--lila)}
.mensaje{border-radius:14px;padding:10px 14px;font-weight:600}
.mensaje.error{background:var(--error-suave);color:var(--error)}
.mensaje.ok{background:var(--ok-suave);color:var(--ok)}
.mensaje.info{background:var(--lila-niebla);color:var(--lila)}

/* Avatares */
.avatares{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:8px}
.avatar-op{border:3px solid var(--linea);background:var(--blanco);border-radius:18px;font-size:2rem;padding:6px 0;line-height:1.2}
.avatar-op[aria-pressed="true"]{border-color:var(--lila);background:var(--lila-niebla)}

.aviso-prueba{background:var(--amarillo);color:var(--tinta);font-weight:700;text-align:center;padding:8px 12px;font-size:.9rem;margin-inline:-16px}
.pie{border-top:2px solid var(--linea);padding-top:18px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:.9rem;color:var(--tinta-suave)}
.pie nav{display:flex;gap:14px;flex-wrap:wrap}
[hidden]{display:none!important}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
