@font-face{font-family:"Pixelify Sans";src:url("/fuentes/pixelify.woff2") format("woff2");
  font-display:swap;font-weight:400 700}
:root{
  --fondo:#0d1628;--panel:#17243f;--panel2:#1e2f52;--borde:#060b16;
  --oro:#f2c14e;--oro-sua:#8d6f24;--tinta:#e9eefb;--apag:#93a6cc;
  --display:"Pixelify Sans",ui-monospace,monospace;
  --texto:"Nunito","Segoe UI",system-ui,-apple-system,sans-serif;
}
*{box-sizing:border-box}
html{scroll-padding-top:4.5rem}
body{margin:0;background:var(--fondo);color:var(--tinta);font-family:var(--texto);
  font-size:17px;line-height:1.6;
  background-image:radial-gradient(circle at 18% -5%,#1b2d52 0%,transparent 55%)}
.envoltorio{max-width:54rem;margin:0 auto;padding:0 1.1rem 5rem}
.ico{vertical-align:-.15em;image-rendering:pixelated}

.caja{background:var(--panel);border:3px solid var(--borde);
  box-shadow:inset 0 0 0 1px var(--oro-sua);border-radius:6px;padding:1.3rem 1.4rem;margin:1.6rem 0}
.caja.destacada{background:var(--panel2);box-shadow:inset 0 0 0 1px var(--oro)}

header.sup{position:sticky;top:0;z-index:30;background:#0b1322ee;backdrop-filter:blur(6px);
  border-bottom:2px solid var(--borde)}
header.sup .envoltorio{display:flex;align-items:center;gap:1rem;padding:.7rem 1.1rem;flex-wrap:wrap}
.marca{font-family:var(--display);font-size:1.15rem;color:var(--oro);text-decoration:none}
nav a{color:var(--apag);text-decoration:none;font-size:.92rem;margin-right:.9rem}
nav a:hover,nav a:focus{color:var(--oro)}

h1{font-family:var(--display);font-size:clamp(1.9rem,5.5vw,3rem);line-height:1.12;
  margin:2.2rem 0 .6rem;color:#fff}
h2{font-family:var(--display);font-size:clamp(1.3rem,3.4vw,1.7rem);margin:2.4rem 0 .5rem;color:var(--oro)}
h3{font-size:1.05rem;margin:0;color:#fff}
.entradilla{font-size:1.13rem;color:#cdd8f2}
a{color:var(--oro)}

.chip{display:inline-flex;align-items:center;gap:.35rem;padding:.2rem .55rem;border-radius:4px;
  background:var(--tb);color:#fff;font-size:.85rem;text-decoration:none;white-space:nowrap;
  box-shadow:inset 0 0 0 1px var(--tc)}
.chip:hover,.chip:focus{background:var(--tc);color:#0d1628}
.chips{display:flex;flex-wrap:wrap;gap:.4rem;margin:.8rem 0}

.barras{margin:1.2rem 0;display:grid;gap:.3rem}
.fila{display:grid;grid-template-columns:7.5rem 1fr 2.2rem;align-items:center;gap:.6rem;
  text-decoration:none;color:inherit;padding:.1rem .2rem;border-radius:4px}
.fila:hover,.fila:focus{background:#ffffff0f}
.fila .et{font-size:.88rem;color:var(--apag);display:flex;align-items:center;gap:.35rem}
.fila .pista{background:#0a1121;border:1px solid var(--borde);height:1.2rem;border-radius:3px;overflow:hidden}
.fila .barra{height:100%;display:block;background:var(--tc)}
.fila .num{font-variant-numeric:tabular-nums;font-size:.9rem;text-align:right}
.fila.poco .barra{background:#9d3b3b}

.movs{display:grid;gap:.8rem;grid-template-columns:repeat(auto-fill,minmax(15.5rem,1fr));margin:1.2rem 0}
.mv{background:var(--panel);border:3px solid var(--borde);border-radius:6px;padding:.8rem .9rem;
  box-shadow:inset 0 0 0 1px var(--tb)}
.mv header{display:flex;align-items:center;gap:.5rem;margin-bottom:.2rem}
.mv .kind{margin:.1rem 0 .6rem;font-size:.84rem;color:var(--apag)}
.bar{display:grid;grid-template-columns:4.6rem 1fr 2.4rem;align-items:center;gap:.4rem;margin:.22rem 0}
.bar .bl{font-size:.76rem;color:var(--apag)}
.bar .bp{background:#0a1121;height:.6rem;border-radius:3px;overflow:hidden}
.bar .bp span{display:block;height:100%}
.bar .bv{font-size:.78rem;font-variant-numeric:tabular-nums;text-align:right}
.dps{font-size:.8rem;color:var(--apag);margin:.5rem 0 .3rem}
.evo{font-size:.8rem;margin:.2rem 0 0;color:var(--oro)}
.tags{margin:.3rem 0 0;display:flex;flex-wrap:wrap;gap:.3rem}
.tag{font-style:normal;font-size:.72rem;padding:.08rem .4rem;border-radius:3px;
  background:#0a1121;color:var(--apag);box-shadow:inset 0 0 0 1px #2b3c60}
.tg-pos{color:#d7a0f5}.tg-bur{color:#ffae77}.tg-slo{color:#9fd4ff}
.tg-stu{color:#ffe08a}.tg-dra{color:#9df5c0}.tg-pie{color:#c9c9e8}

.calor{border-collapse:collapse;font-size:.8rem}
.calor th,.calor td{border:1px solid #223354;padding:0;text-align:center}
.calor td{width:1.5rem;height:1.5rem;font-weight:700}
.calor th[scope=col]{padding:.2rem}
.calor th[scope=row]{padding:.1rem .4rem;text-align:left}
.igual{background:#131f36}
.mas{background:#1f5c38;color:#9df5c0}
.mas1{background:#1a4a32;color:#8fe0b0}
.menos{background:#5c2626;color:#ffb0b0}
.nulo{background:#3a1f1f;color:#ff8f8f}
.leyenda{font-size:.82rem;color:var(--apag)}
.leyenda b{padding:.05rem .35rem;border-radius:3px;margin:0 .15rem}

table{width:100%;border-collapse:collapse;margin:1.1rem 0;font-size:.95rem}
th,td{text-align:left;padding:.45rem .6rem;border-bottom:1px solid #27385c}
th{color:var(--oro);font-weight:600}
td.n{font-variant-numeric:tabular-nums}
.tabla-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}

.dato{font-variant-numeric:tabular-nums;color:#fff;font-weight:700}
.fuente{font-size:.84rem;color:var(--apag);margin-top:.5rem}
.fuente a{color:var(--apag)}
ul{padding-left:1.15rem}li{margin:.3rem 0}

.rejilla{display:grid;gap:.9rem;grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));margin:1.2rem 0}
.rejilla a{display:block;padding:.85rem 1rem;background:var(--panel);border:3px solid var(--borde);
  box-shadow:inset 0 0 0 1px var(--oro-sua);border-radius:6px;text-decoration:none;color:var(--tinta)}
.rejilla a:hover,.rejilla a:focus{box-shadow:inset 0 0 0 1px var(--oro)}
.rejilla b{display:block;font-family:var(--display);color:var(--oro);font-size:1rem;margin-bottom:.15rem}
.rejilla span{font-size:.88rem;color:var(--apag)}

.anuncio{min-height:280px;display:flex;align-items:center;justify-content:center;margin:2rem 0;
  border:1px dashed #33476f;border-radius:6px;color:#50648c;font-size:.8rem;
  background:repeating-linear-gradient(45deg,#101b31,#101b31 10px,#0d1628 10px,#0d1628 20px)}

footer{border-top:2px solid var(--borde);margin-top:3rem;padding-top:1.2rem;color:var(--apag);font-size:.88rem}
footer a{color:var(--apag)}
.aviso-marca{font-size:.8rem;color:#6f82a8;margin-top:.8rem;line-height:1.5}
:focus-visible{outline:2px solid var(--oro);outline-offset:2px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* escenario: dibujos propios, ningun recurso del juego */
body{background-image:url("/img/suelo.svg"),radial-gradient(circle at 18% -5%,#1b2d52 0%,transparent 55%);
  background-repeat:repeat,no-repeat;background-size:64px 64px,auto}
.escena{height:clamp(110px,22vw,190px);margin:0 0 -1px;
  background:url("/img/cabecera.svg") center bottom/cover no-repeat;
  border-bottom:3px solid var(--borde);position:relative}
.escena::after{content:"";position:absolute;inset:auto 0 0;height:45%;
  background:linear-gradient(to bottom,transparent,#0d1628)}
.bioma{font-size:.8rem;color:var(--apag);margin:.4rem 0 0;text-align:center}
.caja{background-color:var(--panel);background-image:url("/img/suelo.svg");
  background-size:64px 64px}

/* fichas de Pokemon */
.mons{display:grid;gap:.8rem;grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));margin:1rem 0 2rem}
.mon{background:var(--panel);border:3px solid var(--borde);border-radius:6px;padding:.8rem .9rem;
  box-shadow:inset 0 0 0 1px var(--tb)}
.mon header{display:flex;align-items:center;justify-content:space-between;gap:.5rem}
.mon .chips{margin:.4rem 0 .6rem}
.est{color:var(--oro);font-size:.8rem;letter-spacing:.05em;white-space:nowrap}
.est i{color:#3a4c72;font-style:normal}
.mvini{font-size:.82rem;margin:.55rem 0 .2rem;color:var(--tinta);
  display:flex;align-items:center;gap:.35rem}
h2 .chip{font-size:.95rem;vertical-align:.1em}
@media (max-width:560px){.mons{grid-template-columns:1fr}}
@media (max-width:560px){
  .fila{grid-template-columns:6.4rem 1fr 1.9rem}
  body{font-size:16px}
  .movs{grid-template-columns:1fr}
}