/* Guías v8: mismo mundo violeta que portada, Progresión y Mi Granja. Se carga después del estilo propio de cada guía. */
:root{--bg:#24163b;--surface:#302047;--surface-2:#3b2857;--linea:#d9c3ff2e;--texto:#f3ecfb;--apagado:#cec1df;--primario:#a98aff;--primario-suave:#a98aff26;--oro:#ffd583;--vivo:#ff7ab0;--edge:#e6ccff38}
html{background:#24163b}
body{background:radial-gradient(ellipse at 85% 0,#99449655,transparent 45%),radial-gradient(ellipse at 0 40%,#744ac244,transparent 45%),radial-gradient(ellipse at 90% 95%,#286e7744,transparent 45%),linear-gradient(160deg,#301b54,#24163b 55%,#2c1a40);background-attachment:fixed;min-height:100vh}
.nav-outer{background:rgba(35,21,57,.92)}
article .caja,.flujo div,.rar-strip figure,.jugar,.escalon,.trucos div,.tabla-mini,.cta-fin{border-width:2px;border-color:var(--edge);box-shadow:inset 0 1px 0 #ffffff14,0 4px 0 #13082055}
.caja.dato{background:#a98aff1f}.caja.pro{background:#ffd5831a;border-color:#ffd58355}
.jugar input,.jugar select{background:#1a0f2c}
.chip{background:#ff7ab022;color:#ffb3d1}
.intro{color:#ddd0ee}
.cta-fin .btn{background:var(--oro);color:#2d1743;box-shadow:0 3px 0 #c98f2e}
@media(max-width:760px){.nav-links{background:rgba(35,21,57,.97)}}
/* Captura real del juego dentro de una guía (docs/CAPTURAS-GUIAS.md). */
.captura{margin:1.2rem auto;max-width:640px;text-align:center}.captura img{width:100%;height:auto;border-radius:16px;border:2px solid #ffd58355;box-shadow:0 8px 24px #0006;background:#1a0f2c}.captura figcaption{margin-top:.5rem;font-size:.85rem;color:var(--apagado)}

/* Granjero del tutorial del juego (img/juego/personajes) asomando por encima del cierre de cada guía. */
.cta-fin{position:relative;margin-top:4rem}
.cta-fin .mascota{display:block;width:110px;height:110px;object-fit:contain;margin:-5.2rem auto .3rem;filter:drop-shadow(0 4px 0 #13082066)}
.ico-juego{display:inline-block;width:22px;height:19px;object-fit:contain;vertical-align:-4px;margin-right:.3rem}
/* Iconos del juego en los títulos de sección (si no hay icono equivalente se queda el emoji). */
h2 .ic img{width:26px;height:26px;object-fit:contain;display:block}
/* Ilustración del juego junto al texto (p. ej. el Cropper): a la derecha en pantallas anchas, centrada en el móvil. */
.ilus-lado{float:right;width:min(45%,280px);height:auto;margin:.2rem 0 .8rem 1rem;filter:drop-shadow(0 8px 12px #0006)}@media(max-width:640px){.ilus-lado{float:none;display:block;width:min(80%,280px);margin:.4rem auto .8rem}}
h2{clear:both}
/* Molde de guía con capturas (fase 3, 20/10): resumen de 30 segundos, captura junto al texto, tira de pasos, pareja de capturas, «Pruébalo» y detalle plegable. */
.g-30s{background:linear-gradient(180deg,#ffd5831a,var(--surface));border:2px solid #ffd58355;border-radius:16px;padding:1rem 1.2rem;margin:0 0 1.8rem}
.g-30s h2{margin:0 0 .5rem;font-size:1rem;color:var(--oro)}.g-30s ul{margin:0 0 0 1.1rem!important}.g-30s li{margin-bottom:.35rem}
.g-paso{display:grid;grid-template-columns:1fr 230px;gap:1.4rem;align-items:start;margin:1rem 0}.g-paso>div>:last-child{margin-bottom:0}
.g-paso .captura,.g-par .captura,.g-caja .captura{margin:0}
.captura img{border-radius:18px}.captura a{display:block}
.g-tira{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem;margin:1rem auto 1.4rem!important;max-width:540px;padding:0;list-style:none}
.g-tira li{margin:0}.g-tira figcaption{font-size:.8rem;line-height:1.4}.g-tira figcaption b{display:block;color:var(--oro);font-family:'JetBrains Mono',monospace;font-size:.7rem}
.g-par{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1.2rem auto;max-width:520px}
.g-caja{display:grid;grid-template-columns:120px 1fr;gap:1rem;align-items:center}.g-caja p{margin:0 0 .5rem!important}.g-caja p:last-child{margin:0!important}
.g-prueba{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;background:var(--surface);border:2px dashed #8ef0a866;border-radius:16px;padding:1rem 1.2rem;margin:1.4rem 0}
.g-prueba p{margin:0!important;flex:1 1 15rem}.g-prueba p b{color:#8ef0a8}.g-prueba .btn{background:#8ef0a8;color:#16301f;box-shadow:0 3px 0 #4caf6e}
.g-mas{background:var(--surface);border:1px solid var(--linea);border-radius:14px;margin:1rem 0;padding:0 1.1rem}.g-mas summary{cursor:pointer;padding:.85rem 0;font-weight:600}.g-mas[open]{padding-bottom:.6rem}
@media(max-width:640px){.g-paso{grid-template-columns:1fr}.g-paso .captura{max-width:270px;margin:0 auto}.g-par{grid-template-columns:1fr 1fr;gap:.6rem}.g-par figcaption{font-size:.76rem}.g-tira{gap:.45rem}.g-caja{grid-template-columns:90px 1fr;gap:.8rem}}
.g-h3{font-family:"Unbounded",sans-serif;font-weight:500;font-size:1.05rem;margin:2rem 0 .7rem}