/* "Aprende primero": teoría antes de practicar */
.teoria-card{display:grid;gap:14px;text-align:left;max-width:760px;margin:0 auto}
.teoria-nav{display:flex;flex-wrap:wrap;gap:6px}
.teoria-nav span{padding:6px 12px;border-radius:99px;background:#eef3f8;color:#526b7f;font-weight:800;font-size:14px}
.teoria-nav span.on{background:#2166ee;color:#fff}.teoria-nav span.ok{background:#d9f7ea;color:#0d7a55}
.teoria-card h3{margin:4px 0 0;color:#08294c;font-size:20px}
.teoria-idea{margin:0;padding:12px 14px;border-radius:14px;background:#fff8e6;color:#4a3a12;font-size:17px;line-height:1.5}
.teoria-signos{display:grid;gap:10px}
.teoria-signo{display:grid;grid-template-columns:88px 1fr auto;gap:14px;align-items:start;padding:14px;border:2px solid #dce8f3;border-radius:18px;background:#fff}
.teoria-signo-s{display:grid;place-items:center;min-height:76px;border-radius:16px;background:#eaf3ff;color:#2166ee;font-size:40px;font-weight:1000;line-height:1}
.teoria-signo h4{margin:0 0 6px;color:#08294c;font-size:18px}
.teoria-signo p{margin:3px 0;color:#30475e;line-height:1.45}
.teoria-dibujo{font-size:22px;letter-spacing:1px}
.teoria-ej{font-weight:900;color:#0d7a55!important}
.teoria-oir{border:0;border-radius:12px;background:#eef3f8;font-size:20px;min-width:44px;min-height:44px;cursor:pointer}
.teoria-ejemplo{padding:14px;border-radius:14px;background:#f1fbf6;border:2px dashed #35d4a4;color:#08294c;font-size:19px;font-weight:800;line-height:1.5}
.teoria-pasos{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.teoria-pasos li{display:none;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:#fff;border:1px solid #dce8f3;font-size:17px;color:#30475e}
.teoria-pasos li.visible{display:flex;animation:teoria-in .3s ease}
.teoria-pasos li span{display:grid;place-items:center;flex:none;width:30px;height:30px;border-radius:50%;background:#2166ee;color:#fff;font-weight:900}
.teoria-mas{justify-self:start;border:0;border-radius:12px;padding:10px 14px;background:#eaf3ff;color:#2166ee;font:inherit;font-weight:900;cursor:pointer}
.teoria-preg{display:flex;align-items:center;gap:14px}.teoria-preg .teoria-signo-s{width:88px}
.teoria-preg p{margin:0;font-size:19px;color:#08294c}
.teoria-opciones{display:grid;gap:8px}
.teoria-opciones button{min-height:52px;border:2px solid #dce8f3;border-radius:14px;background:#fff;color:#08294c;font:inherit;font-size:17px;font-weight:800;text-align:left;padding:10px 14px;cursor:pointer}
.teoria-opciones button.bien{border-color:#35d4a4;background:#e6faf2}.teoria-opciones button.mal{border-color:#ff9db0;background:#fff1f3;opacity:.7}
.teoria-res{margin:0;font-weight:800;color:#08294c;min-height:24px}
.teoria-sin-signos{color:#526b7f}
.teoria-salto{background:#eef3f8!important;color:#08294c!important}
#verTeoria{border:0;border-radius:12px;padding:8px 12px;background:#eaf3ff;color:#2166ee;font:inherit;font-weight:900;cursor:pointer}
.teoria-modal{position:fixed;inset:0;z-index:150;display:grid;place-items:center;padding:16px;background:#08294c99;overflow:auto}
.teoria-modal[hidden]{display:none}
.teoria-modal>.teoria-card{width:min(760px,100%);max-height:90vh;overflow:auto;padding:20px;border-radius:22px;background:#fff}
.teoria-modal h4{margin:6px 0 0;color:#08294c}
.teoria-cerrar{min-height:50px;border:0;border-radius:14px;background:#2166ee;color:#fff;font:inherit;font-weight:900;cursor:pointer}
@keyframes teoria-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
@media (max-width:560px){.teoria-signo{grid-template-columns:64px 1fr}.teoria-signo .teoria-oir{grid-column:2;justify-self:start}.teoria-signo-s{min-height:60px;font-size:30px}}
body.apoyo-calma .teoria-pasos li.visible{animation:none}
/* Ley de los signos (6.º y 7.º) */
.teoria-ley{display:grid;gap:8px;padding:14px;border:2px solid #f4bd3f;border-radius:18px;background:#fffaf0}
.teoria-ley-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.teoria-ley h4{margin:0;color:#08294c;font-size:18px}
.teoria-ley p{margin:2px 0;color:#30475e;line-height:1.45}
.ley-tabla{border-collapse:collapse;width:100%;font-size:18px}
.ley-tabla td{padding:8px 6px;border-bottom:1px solid #f0dfb5;color:#30475e}
.ley-tabla td:last-child{font-size:15px}
.ley-mas,.ley-menos{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;color:#fff;font-weight:1000}
.ley-mas{background:#16a37a}.ley-menos{background:#e34955}
.ley-caso{padding:10px 12px;border-radius:12px;background:#fff;border:1px solid #f0dfb5}
.ley-caso h5{margin:0 0 4px;font-size:16px;color:#08294c}
.ley-truco{padding:8px 10px;border-radius:10px;background:#eef8ff;color:#08294c!important}
.teoria-bloque{display:grid;gap:8px;padding-bottom:10px;border-bottom:1px dashed #dce8f3}