/* «Cómo se juega» de Supervivencia DGT: el bloque de reglas en texto vivo
   (games/survival/guia.js, 2-oct-2026). Va dentro de .vp-ggs-block.vp-ggs-html.
   Brasa y cromo como el juego; cada regla con su color: oro el reloj, naranja
   el nivel, rojo el fallo, azul el reto. Lectura ≥ 15 px. */
.vp-ggs-html { overflow: hidden; background: #07060a; flex-shrink: 0; }
.svg-reglas {
  padding: 16px 16px 18px; color: #fff7e6; text-align: left; font-family: 'DM Sans', 'Inter', system-ui, sans-serif;
  background: radial-gradient(120% 90% at 100% 0%, rgba(226, 60, 20, .18), transparent 60%), linear-gradient(180deg, #160b0c, #08060a);
  box-shadow: inset 0 0 0 2px rgba(255, 120, 50, .5);
}
.svg-reglas h3, .svg-reglas ul { margin: 0; }
.svg-h {
  font: 900 clamp(1.15rem, 5.4vw, 1.5rem)/1.1 'Syne', 'Archivo Black', system-ui, sans-serif;
  text-transform: uppercase; letter-spacing: .02em; color: #ffd24d; margin-bottom: 12px !important;
  text-shadow: 0 2px 0 #4a1405, 0 0 18px rgba(255, 120, 40, .5);
}
.svg-reglas ul { list-style: none; padding: 0; display: grid; gap: 10px; }
.svg-reglas li { --c: #ffd24d; position: relative; padding-left: 22px; font-size: clamp(15px, 4vw, 1.1rem); line-height: 1.38; }
.svg-reglas li b { color: var(--c); font-weight: 800; }
.svg-reglas li::before {
  content: ""; position: absolute; left: 0; top: .32em; width: 12px; height: 12px; border-radius: 50%;
  background: var(--c); box-shadow: 0 0 8px var(--c);
}
.svg-reglas li:nth-child(2) { --c: #ff9a3c; }
.svg-reglas li:nth-child(3) { --c: #ff5a5f; }
.svg-reglas li:nth-child(4) { --c: #5ec8ff; }