/* Minijuego "¿Jugamos?": home y Nosotros */
.juego { --lado:clamp(16px,4vw,56px); }
.juego .num { font:500 12px/1 ui-monospace, monospace; letter-spacing:.12em; opacity:.55; }
  .juego { padding:clamp(24px,4vh,48px) var(--lado) clamp(56px,8vh,96px); }
  .juego-cab { display:flex; align-items:end; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:18px; }
  .juego-cab h2 { font-weight:500; letter-spacing:-.035em; line-height:1.04; font-size:clamp(26px,2.8vw,40px); margin-top:10px; }
  .juego-cab .pista-j { font:500 11px ui-monospace, monospace; letter-spacing:.12em; opacity:.55; }
  .lienzo { position:relative; border-radius:14px; background:#fff; border:1px solid rgba(15,15,15,.08); overflow:hidden; }
  #juego { display:block; width:100%; height:clamp(240px,24vw,300px); touch-action:manipulation; cursor:pointer; -webkit-tap-highlight-color:transparent; }
  #juego:focus-visible { outline:3px solid var(--rosa); outline-offset:-3px; }
.juego .pista-j { display:inline-flex; align-items:center; gap:10px; }
/* la tecla espacio */
.tecla { display:inline-flex; align-items:flex-end; justify-content:center; width:54px; height:24px; padding-bottom:6px; border:1.5px solid currentColor; border-bottom-width:3.5px; border-radius:6px; }
.tecla span { display:block; width:20px; height:6px; border:1.5px solid currentColor; border-top:0; }
.juego .explica { margin-top:10px; font-size:16px; line-height:1.5; opacity:.75; max-width:40em; }
.juego .explica a { text-decoration:underline; text-underline-offset:3px; }
/* fin de partida: dos botones encima del juego */
.fin-juego { position:absolute; left:0; right:0; top:34%; display:flex; flex-direction:column; align-items:center; gap:12px; padding:0 12px; text-align:center; font-family:ui-monospace, monospace; }
.fin-juego[hidden] { display:none; }
.fin-juego p { font-size:13px; font-weight:600; letter-spacing:.04em; color:#535353; }
.fin-botones { display:flex; gap:10px; flex-wrap:wrap; justify-content:center; }
.j-btn { display:inline-flex; align-items:center; gap:8px; padding:10px 16px; border:2px solid #535353; border-radius:6px; background:#fff; color:#353535; font:700 13px ui-monospace, monospace; letter-spacing:.06em; text-transform:uppercase; cursor:pointer; text-decoration:none; box-shadow:0 3px 0 #535353; }
.j-btn:hover { transform:translateY(-1px); }
.j-btn:active { transform:translateY(2px); box-shadow:0 1px 0 #535353; }
.j-btn.coop { background:#d6106f; border-color:#8f0a4a; color:#fff; box-shadow:0 3px 0 #8f0a4a; }
.j-btn .tecla { width:40px; height:18px; padding-bottom:4px; border-width:1.5px; border-bottom-width:2.5px; border-radius:4px; }
.j-btn .tecla span { width:14px; height:4px; }
.j-btn:focus-visible { outline:3px solid #f03891; outline-offset:3px; }
@media (max-width:600px) { .fin-juego { top:26%; gap:8px; } .fin-juego p { font-size:11px; } .j-btn { padding:8px 11px; font-size:11px; } }
@media (max-width:400px) { .fin-botones { gap:6px; flex-wrap:nowrap; } .j-btn { padding:8px 8px; letter-spacing:0; gap:5px; } }