/*
 * HOJA DE LAS PÁGINAS LEGALES DEL JUEGO.
 *
 * Autocontenida a propósito: las copias del sitio del estudio usan
 * `_base-legal.css`, que vive en OTRO proyecto. Depender de él dejaría estas
 * páginas sin estilo si ese sitio cambia o se retira, y son las URLs que
 * Google Play tiene registradas en la ficha: si un día devuelven una página
 * rota o un 404, la app se retira.
 *
 * Sin tipografías externas por el mismo motivo — y porque estas páginas las
 * abre gente desde la ficha de Play, a menudo con mala conexión.
 */
:root{
  --bg:#05070F; --panel:#0C1120; --line:#1E2740;
  --tx:#E6ECF7; --tx-dim:#93A2BE; --neon:#39FF88; --acc:#FFD34E;
}
*{ box-sizing:border-box; }
body{
  margin:0; background:var(--bg); color:var(--tx);
  font:16px/1.65 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  padding:24px 16px 56px;
}
.wrap{ max-width:760px; margin:0 auto; }
header.top{
  display:flex; align-items:center; justify-content:space-between;
  gap:12px; margin-bottom:22px; flex-wrap:wrap;
}
.logo{ font-weight:800; letter-spacing:.5px; color:var(--tx); text-decoration:none; font-size:18px; }
.logo span{ color:var(--neon); }
.volver{ color:var(--tx-dim); text-decoration:none; font-size:14px; }
.volver:hover{ color:var(--tx); }

.frame{
  background:var(--panel); border:1px solid var(--line);
  border-radius:16px; padding:26px 22px;
}
h1{ margin:0 0 6px; font-size:26px; line-height:1.25; }
.sub{ margin:0 0 20px; color:var(--tx-dim); font-size:14px; }
h2{ margin:26px 0 8px; font-size:18px; color:var(--acc); }
p, li{ color:var(--tx); }
ul{ padding-left:20px; }
li{ margin:4px 0; }
a{ color:var(--neon); }
strong{ color:#FFF; }

.aviso{
  background:rgba(57,255,136,.08); border:1px solid rgba(57,255,136,.35);
  border-radius:12px; padding:14px 16px; margin:18px 0;
}
.aviso.rojo{ background:rgba(255,77,109,.08); border-color:rgba(255,77,109,.4); }

.pasos{ counter-reset:paso; list-style:none; padding:0; }
.pasos li{
  counter-increment:paso; position:relative; padding:10px 0 10px 42px;
  border-bottom:1px solid var(--line);
}
.pasos li:last-child{ border-bottom:0; }
.pasos li::before{
  content:counter(paso); position:absolute; left:0; top:10px;
  width:26px; height:26px; border-radius:50%;
  background:var(--neon); color:#04220F; font-weight:800;
  display:grid; place-items:center; font-size:14px;
}

.pie{
  margin-top:28px; padding-top:16px; border-top:1px solid var(--line);
  display:flex; gap:16px; flex-wrap:wrap; align-items:center;
  color:var(--tx-dim); font-size:14px;
}
.pie a{ color:var(--tx-dim); text-decoration:none; }
.pie a:hover{ color:var(--neon); }