/* Identidad Kencha Games (24–25/10/2026): la pegatina coral de los Kencha. Lo común a todas las páginas: letras, colores, barra y pie.
   Fuentes servidas desde el propio sitio (licencias en /fonts/): ninguna petición a terceros, así la política de privacidad
   ("no cookies, no third parties on the web") sigue siendo cierta. */
@font-face { font-family:"Luckiest Guy"; src:url("/fonts/LuckiestGuy-Regular.woff2") format("woff2"); font-display:swap; }
@font-face { font-family:"Fredoka"; src:url("/fonts/Fredoka-Variable.woff2") format("woff2"); font-weight:300 700; font-display:swap; }
:root {
  color-scheme: light;
  --coral:#FF7062; --tinta:#1F3A52; --crema:#FFF6E4; --papel:#FFFCF6; --blanco:#FFFFFF;
  --ambar:#ECA83E; --agua:#46AAD7; --verde:#58B278; --marino:#294D6B; --tenue:#4F6577; --linea:#E9DCC4;
  --display:"Luckiest Guy","Arial Black",system-ui,sans-serif;
  --texto:"Fredoka","Avenir Next","Segoe UI",system-ui,sans-serif;
}
* { box-sizing:border-box; }
body { margin:0; color:var(--tinta); background:var(--crema); font:18px/1.55 var(--texto); }
.ancho { max-width:1060px; margin:0 auto; padding-left:max(16px, env(safe-area-inset-left, 0px)); padding-right:max(16px, env(safe-area-inset-right, 0px)); }
a { color:inherit; }
:focus-visible { outline:3px solid var(--tinta); outline-offset:3px; border-radius:6px; }
.oculto { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

/* títulos de pegatina: crema con contorno marino y sombra hacia abajo */
.pegatina { font-family:var(--display); font-weight:400; letter-spacing:.01em; line-height:1.05; color:var(--crema);
            -webkit-text-stroke:2.5px var(--tinta); paint-order:stroke fill; text-shadow:0 4px 0 var(--tinta); text-wrap:balance; }

/* la barra: coral, como el splash del juego */
.cielo { background:var(--coral); border-bottom:4px solid var(--tinta); }
nav { display:flex; align-items:center; justify-content:space-between; gap:16px; padding-block:18px; }
nav .marca img { height:44px; width:auto; display:block; }
nav ul { display:flex; gap:10px; list-style:none; margin:0; padding:0; flex-wrap:wrap; justify-content:flex-end; }
nav a.n { font-weight:600; text-decoration:none; background:var(--crema); border:3px solid var(--tinta); border-radius:999px; padding:6px 16px; box-shadow:0 4px 0 var(--tinta); font-size:16px; display:inline-block; }
nav a.n:hover { transform:translateY(-1px); }
nav a.n[aria-current] { background:var(--tinta); color:var(--crema); }

/* botón grueso, como el "Row!" del juego */
.jugar { display:inline-flex; align-items:center; gap:12px; text-decoration:none; font-family:var(--display); font-size:26px; letter-spacing:.03em;
         color:var(--crema); background:var(--coral); border:4px solid var(--tinta); border-radius:999px; padding:10px 30px 8px; box-shadow:0 6px 0 var(--tinta);
         -webkit-text-stroke:1.5px var(--tinta); paint-order:stroke fill; transition:transform .12s, box-shadow .12s; }
.jugar:hover { transform:translateY(-2px); box-shadow:0 8px 0 var(--tinta); }
.jugar:active { transform:translateY(4px); box-shadow:0 2px 0 var(--tinta); }
.jugar svg { width:18px; height:18px; }

footer { border-top:4px solid var(--tinta); background:var(--tinta); color:var(--crema); }
footer .ancho { display:flex; flex-wrap:wrap; gap:8px 18px; justify-content:space-between; align-items:center; padding-block:22px; font-size:15px; }
footer a { color:var(--crema); }
footer .k { height:28px; width:auto; display:block; }

@media (max-width:560px) { nav { flex-wrap:wrap; justify-content:center; } nav ul { justify-content:center; } }
@media (prefers-reduced-motion:reduce) { * { transition:none !important; } }
