/* Maparaguay: cada seccion con su icono, marca de agua, sombra y entrada suave.
   Va DESPUES de estilo.css. Se puede borrar este archivo (y su <link>) sin romper nada. */

.bloque { position:relative; isolation:isolate; scroll-margin-top:76px;
  box-shadow:0 1px 2px rgba(15,35,60,.06), 0 10px 28px -12px rgba(15,35,60,.22); }

/* El desplegable de monedas (en Cotizaciones) puede sobresalir sobre la seccion de abajo */
#cambios { z-index:3; }

/* Icono al inicio del titulo */
.bloque > h2 { display:flex; align-items:center; gap:.55em; }
.bloque > h2::before { content:""; flex:none; width:1.55em; height:1.55em; border-radius:10px;
  background:var(--acc) var(--ico) center/62% no-repeat;
  box-shadow:0 2px 6px -1px rgba(15,35,60,.35); transition:transform .25s ease; }
.bloque:hover > h2::before { transform:rotate(-6deg) scale(1.06); }

/* Marca de agua: el mismo icono, grande y muy tenue, arriba a la derecha */
.bloque::after { content:""; position:absolute; z-index:-1; top:10px; right:10px; width:112px; height:112px;
  background:var(--acc); opacity:.10; pointer-events:none;
  -webkit-mask:var(--ico) center/contain no-repeat; mask:var(--ico) center/contain no-repeat; }

#clima { --ico:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%222%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M12 2v2M4.93 4.93l1.41 1.41M20 12h2M19.07 4.93l-1.41 1.41M15.947 12.65a4 4 0 00-5.925-4.128M13 22H7a5 5 0 114.9-6H13a3 3 0 010 6z%22/%3E%3C/svg%3E"); --acc:#4f7fae; }
#cambios { --ico:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%222%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M8 3 4 7l4 4M4 7h16m-4 14 4-4-4-4m4 4H4%22/%3E%3C/svg%3E"); --acc:#a8843f; }
#cripto { --ico:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%222%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M11.767 19.089c4.924.868 6.14-6.025 1.216-6.894m-1.216 6.894L5.86 18.047m5.908 1.042-.347 1.97m1.563-8.864c4.924.869 6.14-6.025 1.215-6.893m-1.215 6.893-3.94-.694m5.155-6.2L8.29 4.26m5.908 1.042.348-1.97M7.48 20.364l3.126-17.727%22/%3E%3C/svg%3E"); --acc:#7b6fa3; }
#noticias, #noti-corto { --ico:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%222%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M15 18h-5M18 14h-8M4 22h16a2 2 0 002-2V4a2 2 0 00-2-2H8a2 2 0 00-2 2v16a2 2 0 01-4 0v-9a2 2 0 012-2h2M10 6h8v4h-8V6z%22/%3E%3C/svg%3E"); --acc:#64748b; }
#rios { --ico:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%222%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M2 6c.6.5 1.2 1 2.5 1C7 7 7 5 9.5 5c2.6 0 2.4 2 5 2 2.5 0 2.5-2 5-2 1.3 0 1.9.5 2.5 1M2 12c.6.5 1.2 1 2.5 1 2.5 0 2.5-2 5-2 2.6 0 2.4 2 5 2 2.5 0 2.5-2 5-2 1.3 0 1.9.5 2.5 1M2 18c.6.5 1.2 1 2.5 1 2.5 0 2.5-2 5-2 2.6 0 2.4 2 5 2 2.5 0 2.5-2 5-2 1.3 0 1.9.5 2.5 1%22/%3E%3C/svg%3E"); --acc:#4e968d; }
#juego { --ico-oscuro:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%230b3a6b%22 stroke-width=%222%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M6 11h4M8 9v4M15 12h.01M18 10h.01M17.32 5H6.68a4 4 0 00-3.978 3.59c-.006.052-.01.101-.017.152C2.604 9.416 2 14.456 2 16a3 3 0 003 3c1 0 1.5-.5 2-1l1.414-1.414A2 2 0 019.828 16h4.344a2 2 0 011.414.586L17 18c.5.5 1 1 2 1a3 3 0 003-3c0-1.545-.604-6.584-.685-7.258-.007-.05-.011-.1-.017-.151A4 4 0 0017.32 5z%22/%3E%3C/svg%3E"); --ico:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%222%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M6 11h4M8 9v4M15 12h.01M18 10h.01M17.32 5H6.68a4 4 0 00-3.978 3.59c-.006.052-.01.101-.017.152C2.604 9.416 2 14.456 2 16a3 3 0 003 3c1 0 1.5-.5 2-1l1.414-1.414A2 2 0 019.828 16h4.344a2 2 0 011.414.586L17 18c.5.5 1 1 2 1a3 3 0 003-3c0-1.545-.604-6.584-.685-7.258-.007-.05-.011-.1-.017-.151A4 4 0 0017.32 5z%22/%3E%3C/svg%3E"); --acc:#0b4f8a; }

/* ---------- Paraguay en juego: se ve como un tablero aparte ---------- */
#juego { --tint:#0b4f8a; border-top:0; color:#fff; border-radius:16px; padding-top:22px;
  background:
    linear-gradient(90deg,#d52b1e 33.34%,#fff 33.34% 66.67%,#0038a8 66.67%) top/100% 6px no-repeat,
    radial-gradient(circle at 12% 0%,rgba(255,255,255,.14),transparent 45%),
    linear-gradient(145deg,#0f5da3,#0b3a6b);
  box-shadow:0 14px 34px -10px rgba(11,58,107,.55); }
#juego > h2 { color:#fff; }
#juego > h2::before { background-color:#ffd166; background-image:var(--ico-oscuro); box-shadow:0 2px 8px rgba(0,0,0,.3); }
#juego > .meta { color:rgba(255,255,255,.82); }
#juego::after { background:#fff; opacity:.12; }
#juego-app { background:#f9f6f3; color:var(--tx); border-radius:14px; padding:14px; box-shadow:inset 0 0 0 1px rgba(255,255,255,.4), 0 6px 18px -8px rgba(0,0,0,.45); }
#juego .j-btn { animation:mp-pulso 2.6s ease-in-out infinite; }
@keyframes mp-pulso { 0%,100% { box-shadow:0 0 0 0 rgba(11,79,138,.45); } 50% { box-shadow:0 0 0 9px rgba(11,79,138,0); } }


/* ---------- Juegos Top y Mas de Maparaguay: tarjetas ---------- */
#juegos { --ico:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%222%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M6 9H4.5a2.5 2.5 0 010-5H6M18 9h1.5a2.5 2.5 0 000-5H18M4 22h16M10 14.66V17c0 .55-.47.98-1.97 1.5C7.2 18.8 6.5 19.8 6.5 21M14 14.66V17c0 .55.47.98 1.97 1.5 .83.3 1.53 1.3 1.53 2.5M18 2H6v7a6 6 0 0012 0V2z%22/%3E%3C/svg%3E"); --acc:#c2410c; }
#mas { --ico:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%222%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M3 6l6-3 6 3 6-3v15l-6 3-6-3-6 3zM9 3v15M15 6v15%22/%3E%3C/svg%3E"); --acc:#0f766e; }
.tarjetas { display:grid; gap:12px; margin-top:12px; }
@media (min-width:640px) { #mas .tarjetas { grid-template-columns:1fr 1fr; } }
.tarjeta { position:relative; display:grid; grid-template-columns:auto 1fr; gap:6px 14px; align-items:center; padding:14px; border-radius:14px;
  text-decoration:none; color:var(--tx); background:#fff; box-shadow:inset 0 0 0 1px rgba(15,35,60,.1), 0 6px 16px -10px rgba(15,35,60,.35);
  transition:transform .2s ease, box-shadow .2s ease; }
.tarjeta:hover, .tarjeta:focus-visible { transform:translateY(-2px); box-shadow:inset 0 0 0 1px rgba(15,35,60,.18), 0 12px 22px -12px rgba(15,35,60,.45); }
.tj-pic { grid-row:1 / span 2; width:74px; height:74px; border-radius:14px; display:flex; align-items:center; justify-content:center; font-size:34px; background:#e8f1f0; overflow:hidden; position:relative; }
.tj-txt { display:flex; flex-direction:column; gap:3px; }
.tj-txt strong { font-size:1.05rem; }
.tj-txt small { color:#5b6878; line-height:1.4; font-size:.86rem; }
.tj-dia { align-self:flex-start; margin-top:3px; font-size:.7rem; font-weight:700; padding:3px 9px; border-radius:999px; background:#fff1d6; color:#9a5200; white-space:nowrap; }
.tj-go { justify-self:start; font-weight:700; font-size:.88rem; color:var(--acc); }
.tj-zonas .tj-pic { background:#e3edf8; } .tj-aprende .tj-pic { background:#e6f2ea; }
/* Enduro: mini escena de ruta con una linea central que corre */
.tj-enduro { background:linear-gradient(135deg,#fff,#fff3e8); }
.tj-enduro .tj-pic { background:linear-gradient(#3f93cf 0 38%,#2f8d3c 38%); }
.tj-enduro .tj-pic i { position:absolute; left:50%; bottom:-2px; width:46px; height:36px; margin-left:-23px; background:#6a6d73; clip-path:polygon(40% 0,60% 0,100% 100%,0 100%); }
.tj-enduro .tj-pic b { position:absolute; left:50%; bottom:6px; width:14px; height:8px; margin-left:-7px; border-radius:3px; background:#ebbc28; box-shadow:0 -4px 0 -1px #b88a10; animation:mp-ruta 1.4s ease-in-out infinite; }
@keyframes mp-ruta { 0%,100% { transform:translateX(-5px); } 50% { transform:translateX(5px); } }
@media (prefers-reduced-motion:reduce) { .tj-enduro .tj-pic b { animation:none; } .tarjeta { transition:none; } }

/* Autopista: ruta recta de cinco carriles vista desde atras, con un auto rojo */
.tj-autopista { background:linear-gradient(135deg,#fff,#eef3fb); }
.tj-autopista .tj-pic { background:linear-gradient(#5aa7e8 0 36%,#d1b074 36%); }
.tj-autopista .tj-pic i { position:absolute; left:50%; bottom:0; width:92px; height:50px; margin-left:-46px; background:repeating-linear-gradient(90deg,transparent 0 17px,rgba(255,255,255,.75) 17px 19px),#4a4d55; clip-path:polygon(44% 0,56% 0,100% 100%,0 100%); }
.tj-autopista .tj-pic b { position:absolute; left:50%; bottom:5px; width:18px; height:10px; margin-left:-9px; border-radius:3px 3px 2px 2px; background:#e0262a; box-shadow:0 -5px 0 -2px #8f1215, -5px 3px 0 -3px #111, 5px 3px 0 -3px #111; animation:mp-auto 1.8s ease-in-out infinite; }
@keyframes mp-auto { 0%,100% { transform:translateX(-14px); } 50% { transform:translateX(14px); } }
@media (prefers-reduced-motion:reduce) { .tj-autopista .tj-pic b { animation:none; } }

/* Mapy Bird: pajarito con camiseta albirroja que sube y baja */
@media (min-width:640px) { #juegos .tarjetas { grid-template-columns:repeat(auto-fit,minmax(270px,1fr)); } }
.tj-zombis { background:linear-gradient(135deg,#fff,#eef6e6); }
.tj-zombis .tj-pic { background:linear-gradient(#3b2b72,#c5578a 58%,#2a4a2a 58%); }
.tj-zombis .tj-pic i { position:absolute; left:50%; top:20%; width:26px; height:26px; margin-left:-13px; border-radius:50%; background:#8fb35b; border:2px solid #20380f; box-shadow:-5px -1px 0 -9px #fff, inset 5px 1px 0 -2px #f4f0d0, inset -5px 1px 0 -3px #f4f0d0; animation:mp-zom 2.4s ease-in-out infinite; }
.tj-zombis .tj-pic b { position:absolute; left:50%; bottom:3px; width:70px; height:30px; margin-left:-35px; border-radius:50% 50% 30% 30%; background:radial-gradient(circle at 30% 40%,#3b8f42 0 16px,transparent 17px),radial-gradient(circle at 68% 35%,#2a6a33 0 18px,transparent 19px),#24662f; }
@keyframes mp-zom { 0%,100% { transform:translateY(22px); } 35%,65% { transform:translateY(0); } }
@media (prefers-reduced-motion:reduce) { .tj-zombis .tj-pic i { animation:none; transform:none; } }
.tj-vibora { background:linear-gradient(135deg,#fff,#ecf7e8); }
.tj-vibora .tj-pic { background:repeating-conic-gradient(#1b2d1c 0 25%,#203523 0 50%) 0 0/20px 20px; }
.tj-vibora .tj-pic b { position:absolute; left:14%; bottom:30%; width:52%; height:12px; border-radius:8px; background:#4fb86a; box-shadow:0 0 0 2px #2f8f4c; animation:mp-vib 1.6s ease-in-out infinite alternate; }
.tj-vibora .tj-pic i { position:absolute; right:16%; top:26%; width:20px; height:20px; border-radius:50%; background:radial-gradient(circle at 35% 35%,#ffd36b,#f2a81d 55%,#e2472a); box-shadow:0 0 8px rgba(242,168,29,.7); }
@keyframes mp-vib { from { transform:translateX(-4px); } to { transform:translateX(12px); } }
@media (prefers-reduced-motion:reduce) { .tj-vibora .tj-pic b { animation:none; } }
.tj-catarata { background:linear-gradient(135deg,#fff,#e6f3fb); }
.tj-catarata .tj-pic { background:repeating-linear-gradient(180deg,rgba(255,255,255,.0) 0 9px,rgba(255,255,255,.35) 9px 11px),linear-gradient(#1a6fb8,#8fd9ff); }
.tj-catarata .tj-pic i { position:absolute; left:50%; top:18%; width:16px; height:22px; margin-left:-8px; border-radius:50% 50% 50% 50% / 62% 62% 38% 38%; background:radial-gradient(circle at 35% 55%,#fff 0 3px,#4fc3f7 4px,#0a5ea8); border:2px solid #fff; animation:mp-cat 2.2s ease-in-out infinite; }
.tj-catarata .tj-pic b { position:absolute; left:0; bottom:0; width:34px; height:20px; background:linear-gradient(135deg,#8e9aa3,#4a545c); clip-path:polygon(0 0,100% 18%,82% 60%,100% 100%,0 100%); }
@keyframes mp-cat { 0%,100% { transform:translateX(-18px); } 50% { transform:translateX(18px); } }
@media (prefers-reduced-motion:reduce) { .tj-catarata .tj-pic i { animation:none; } }
.tj-smapy { background:linear-gradient(135deg,#fff,#fdeeea); }
.tj-smapy .tj-pic { background:linear-gradient(#7fc3e6 0 58%,#4a4e57 58% 72%,#7a5233 72%); overflow:hidden; }
.tj-smapy .tj-pic i { position:absolute; left:28%; bottom:28%; width:14px; height:22px; border-radius:4px 4px 2px 2px; border:2px solid #3a1b0e; background:repeating-linear-gradient(90deg,#d52b1e 0 3px,#fff 3px 6px); animation:mp-salto 1s ease-in-out infinite; }
.tj-smapy .tj-pic b { position:absolute; right:14%; bottom:0; width:26px; height:14px; background:#17130f; }
@keyframes mp-salto { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-16px); } }
@media (prefers-reduced-motion:reduce) { .tj-smapy .tj-pic i { animation:none; } }
.tj-bird { background:linear-gradient(135deg,#fff,#eaf5fb); }
.tj-bird .tj-pic { background:linear-gradient(#4fa9d0,#d4f1e2); }
.tj-bird .tj-pic i { position:absolute; left:50%; top:50%; width:34px; height:30px; margin:-15px 0 0 -19px; border-radius:50%; border:2px solid #3a1b0e; background:repeating-linear-gradient(90deg,#d52b1e 0 7px,#fff 7px 14px); animation:mp-vuelo 1.3s ease-in-out infinite; }
.tj-bird .tj-pic b { position:absolute; left:50%; top:50%; width:0; height:0; margin:-9px 0 0 12px; border-left:12px solid #f26b1d; border-top:5px solid transparent; border-bottom:5px solid transparent; animation:mp-vuelo 1.3s ease-in-out infinite; }
@keyframes mp-vuelo { 0%,100% { transform:translateY(-6px); } 50% { transform:translateY(6px); } }
@media (prefers-reduced-motion:reduce) { .tj-bird .tj-pic i, .tj-bird .tj-pic b { animation:none; } }

/* Sudoku: mini tablero 3x3 */
.tj-sudoku { background:linear-gradient(135deg,#fff,#fdf6e3); }
.tj-sudoku .tj-pic { background:#fff6e6; }
.tj-sudoku .tj-pic i { position:absolute; inset:9px; border:2px solid #12263a; background:
  linear-gradient(#12263a,#12263a) 33.3% 0/2px 100% no-repeat, linear-gradient(#12263a,#12263a) 66.6% 0/2px 100% no-repeat,
  linear-gradient(#12263a,#12263a) 0 33.3%/100% 2px no-repeat, linear-gradient(#12263a,#12263a) 0 66.6%/100% 2px no-repeat; }
.tj-sudoku .tj-pic b { position:absolute; left:50%; top:50%; margin:-13px 0 0 -7px; font:800 24px/1 system-ui,sans-serif; color:#0038a8; animation:mp-num 2.4s steps(1) infinite; }
.tj-sudoku .tj-pic b::before { content:"7"; }
@keyframes mp-num { 0%{ color:#0038a8; } 50%{ color:#d52b1e; } }
@media (prefers-reduced-motion:reduce) { .tj-sudoku .tj-pic b { animation:none; } }

/* Trazo: cuadricula con un camino que se dibuja */
.tj-trazo { background:linear-gradient(135deg,#fff,#fdeeee); }
.tj-trazo .tj-pic { background:#fff6e6; }
.tj-trazo .tj-pic i { position:absolute; inset:10px; border:2px solid #c9b99b; border-radius:6px; background:
  linear-gradient(#c9b99b,#c9b99b) 33.3% 0/1px 100% no-repeat, linear-gradient(#c9b99b,#c9b99b) 66.6% 0/1px 100% no-repeat,
  linear-gradient(#c9b99b,#c9b99b) 0 33.3%/100% 1px no-repeat, linear-gradient(#c9b99b,#c9b99b) 0 66.6%/100% 1px no-repeat; }
.tj-trazo .tj-pic b { position:absolute; left:17px; top:17px; width:40px; height:40px; border:7px solid #d52b1e; border-right-color:transparent; border-bottom-color:transparent; border-radius:14px; clip-path:inset(0 0 100% 0); animation:mp-trazo 3.2s ease-in-out infinite; }
@keyframes mp-trazo { 0% { clip-path:inset(0 100% 100% 0); } 50%,100% { clip-path:inset(0 0 0 0); } }
@media (prefers-reduced-motion:reduce) { .tj-trazo .tj-pic b { animation:none; clip-path:none; } }

/* Escape: bloque rojo que sale del tablero */
.tj-escape { background:linear-gradient(135deg,#fff,#fdeee6); }
.tj-escape .tj-pic { background:#2a211e; }
.tj-escape .tj-pic i { position:absolute; left:8px; top:27px; width:34px; height:17px; border-radius:4px; background:#d6402e; box-shadow:inset 0 5px 0 rgba(255,255,255,.18); animation:mp-esc 3s ease-in-out infinite; }
.tj-escape .tj-pic b { position:absolute; left:42px; top:8px; width:17px; height:34px; border-radius:4px; background:#3b82f6; box-shadow:inset 0 5px 0 rgba(255,255,255,.2); animation:mp-esc2 3s ease-in-out infinite; }
@keyframes mp-esc { 0%,35% { transform:translateX(0); } 70%,100% { transform:translateX(30px); } }
@keyframes mp-esc2 { 0%,10% { transform:translateY(0); } 35%,100% { transform:translateY(-22px); } }
@media (prefers-reduced-motion:reduce) { .tj-escape .tj-pic i, .tj-escape .tj-pic b { animation:none; } }

/* Tangram: dos piezas triangulares que se acomodan formando un cuadrado */
.tj-tangram { background:linear-gradient(135deg,#fff,#eef0ff); }
.tj-tangram .tj-pic { background:#fff6e6; }
.tj-tangram .tj-pic i, .tj-tangram .tj-pic b { position:absolute; left:50%; top:50%; width:34px; height:34px; margin:-17px 0 0 -17px; animation:mp-tan 3.2s ease-in-out infinite; }
.tj-tangram .tj-pic i { background:#d52b1e; clip-path:polygon(0 0,100% 0,0 100%); }
.tj-tangram .tj-pic b { background:#0038a8; clip-path:polygon(100% 0,100% 100%,0 100%); animation-name:mp-tan2; }
@keyframes mp-tan { 0%,100% { transform:translate(-11px,-9px) rotate(-14deg); } 45%,70% { transform:none; } }
@keyframes mp-tan2 { 0%,100% { transform:translate(11px,9px) rotate(16deg); } 45%,70% { transform:none; } }
@media (prefers-reduced-motion:reduce) { .tj-tangram .tj-pic i, .tj-tangram .tj-pic b { animation:none; } }

/* Celular y tablet: el orden es clima, cotizaciones, cripto, Paraguay en juego, Juegos Top y Mas de Maparaguay (sin "order" una seccion se iba arriba de todo) */
@media (max-width: 1099px) { #juegos { order:5; } #mas { order:6; } }

/* ---------- Entrada suave al hacer scroll (la activa secciones.js) ---------- */
.mp-rv .bloque.mp-oculto { opacity:0; transform:translateY(22px); }
.mp-rv .bloque { transition:opacity .6s ease, transform .6s cubic-bezier(.2,.7,.2,1); }
.mp-rv .bloque.mp-visto { opacity:1; transform:none; }

@media (prefers-reduced-motion: reduce) {
  .mp-rv .bloque, .mp-rv .bloque.mp-oculto { opacity:1; transform:none; transition:none; }
  #juego .j-btn { animation:none; }
  .bloque > h2::before { transition:none; }
}
@media (max-width:520px) { .bloque::after { width:84px; height:84px; top:8px; right:8px; } }

.tj-solitario { background:linear-gradient(135deg,#fff,#eefaf3); }
.tj-solitario .tj-pic { background:#e6f6ec; }
.tj-solitario .tj-pic i, .tj-solitario .tj-pic b { position:absolute; left:50%; top:50%; width:26px; height:36px; margin:-18px 0 0 -13px; border-radius:5px; background:#fff; border:1px solid #cfd8d2; box-shadow:0 1px 3px rgba(0,0,0,.25); font-style:normal; font-weight:700; font-size:20px; line-height:36px; text-align:center; animation:mp-sol 3.2s ease-in-out infinite; }
.tj-solitario .tj-pic i { color:#1a1a22; transform:translateX(-7px) rotate(-10deg); }
.tj-solitario .tj-pic b { color:#d6334a; animation-name:mp-sol2; }
@keyframes mp-sol { 0%,100% { transform:translateX(-7px) rotate(-10deg); } 50% { transform:translateX(-12px) rotate(-18deg); } }
@keyframes mp-sol2 { 0%,100% { transform:translateX(7px) rotate(10deg); } 50% { transform:translateX(12px) rotate(18deg); } }
@media (prefers-reduced-motion:reduce) { .tj-solitario .tj-pic i, .tj-solitario .tj-pic b { animation:none; } }

.tj-fusion { background:linear-gradient(135deg,#fff,#fff4e6); }
.tj-fusion .tj-pic { background:#ffeccc; }
.tj-fusion .tj-pic i, .tj-fusion .tj-pic b { position:absolute; top:50%; width:26px; height:26px; margin-top:-13px; border-radius:50%; border:3px solid #b97a16; box-sizing:border-box; }
.tj-fusion .tj-pic i { left:50%; margin-left:-27px; background:#f2b84b; animation:mp-fu 3s ease-in-out infinite; }
.tj-fusion .tj-pic b { left:50%; margin-left:1px; background:#f2b84b; animation:mp-fu2 3s ease-in-out infinite; }
@keyframes mp-fu { 0%,15% { transform:translateX(-4px); } 50%,70% { transform:translateX(13px) scale(1.5); } 100% { transform:translateX(-4px); } }
@keyframes mp-fu2 { 0%,15% { transform:translateX(4px); opacity:1; } 45% { transform:translateX(-13px); opacity:1; } 50%,70% { opacity:0; } 100% { transform:translateX(4px); opacity:1; } }
@media (prefers-reduced-motion:reduce) { .tj-fusion .tj-pic i, .tj-fusion .tj-pic b { animation:none; } }


/* ---------- Cotizaciones: cada moneda con los colores de su bandera ---------- */
#cambios[data-tema] { border-top:0; padding-top:22px;
  background:linear-gradient(90deg,var(--b1) 33.34%,var(--b2) 33.34% 66.67%,var(--b3) 66.67%) top/100% 7px no-repeat, var(--tint);
  box-shadow:0 1px 2px rgba(15,35,60,.06), 0 10px 28px -12px rgba(15,35,60,.22), inset 0 0 0 1px rgba(15,35,60,.05); }
/* velo de color de la bandera (esquina superior derecha e inferior izquierda) */
#cambios[data-tema]::before { content:""; position:absolute; inset:0; z-index:-1; border-radius:inherit; pointer-events:none; opacity:.16;
  background:radial-gradient(circle at 100% 0%,var(--b1),transparent 48%), radial-gradient(circle at 0% 100%,var(--b3),transparent 46%); }
#cambios.tema-in[data-tema]::before { animation:cb-tema .7s ease-out; }
@keyframes cb-tema { from { opacity:0; } to { opacity:.16; } }
#cambios[data-tema] .tab.act { background:var(--acc); border-color:var(--acc); }
#cambios[data-tema] .tab { transition:background .25s, border-color .25s, color .25s; }
@media (prefers-reduced-motion:reduce) { #cambios.tema-in[data-tema]::before { animation:none; } }

/* Ahorcado Mapy */
.tj-ahorcado { background:linear-gradient(135deg,#fff,#eef2fb); }
.tj-ahorcado .tj-pic { background:#16213a; display:flex; align-items:flex-end; justify-content:center; padding-bottom:10px; overflow:hidden; }
.tj-ahorcado .tj-pic i { position:static; font:800 12px/1 system-ui,sans-serif; letter-spacing:.04em; color:#ffd24a; border-bottom:2px solid #5b72a6; padding-bottom:3px; }
.tj-ahorcado .tj-pic b { position:absolute; right:9px; top:7px; width:16px; height:22px; border-top:3px solid #b98b5a; border-right:3px solid #b98b5a; border-radius:0 3px 0 0; }
.tj-ahorcado .tj-pic b::after { content:""; position:absolute; right:-5px; top:3px; width:7px; height:7px; border-radius:50%; border:2px solid #fff; }
.tj-ahorcado .tj-pic b::after { transform-origin:50% -3px; animation:mp-ah-sw 2.2s ease-in-out infinite; }
.tj-ahorcado .tj-pic i { position:relative; }
.tj-ahorcado .tj-pic i::after { content:"PARAGU"; font:inherit; letter-spacing:inherit; color:#ffd24a; position:absolute; left:0; top:0; background:#16213a; border-bottom:2px solid #38d39f; padding-bottom:3px; animation:mp-ah-let 3.6s steps(1) infinite; }
@keyframes mp-ah-sw { 0%,100% { transform:rotate(14deg); } 50% { transform:rotate(-14deg); } }
@keyframes mp-ah-let { 0%,45% { opacity:0; } 50%,95% { opacity:1; } 100% { opacity:0; } }
@media (prefers-reduced-motion:reduce) { .tj-ahorcado .tj-pic b::after, .tj-ahorcado .tj-pic i::after { animation:none; } }

/* Crucigrama Mapy */
.tj-crucigrama { background:linear-gradient(135deg,#fff,#eef2fb); }
.tj-crucigrama .tj-pic { background:#16213a; }
.tj-crucigrama .tj-pic i { position:absolute; left:11px; top:13px; width:12px; height:12px; border-radius:2px; background:#eef2fb;
  box-shadow:14px 0 #eef2fb, 28px 0 #eef2fb, 42px 0 #eef2fb, 28px 14px #eef2fb, 28px 28px #eef2fb, 28px 42px #eef2fb, 14px 28px #eef2fb, 42px 28px #eef2fb, 0 42px #eef2fb, 14px 42px #eef2fb; }
.tj-crucigrama .tj-pic b { position:absolute; left:39px; top:13px; width:12px; height:12px; border-radius:2px; background:#ffd24a; animation:mp-cr-p 2.4s ease-in-out infinite; }
@keyframes mp-cr-p { 0%,100% { background:#ffd24a; } 50% { background:#38d39f; } }
@media (prefers-reduced-motion:reduce) { .tj-crucigrama .tj-pic b { animation:none; } }

/* Herramientas y Productividad (portada) */
@media (max-width: 1099px) { #recursos { order:6; } }
#recursos { --tint:#f3f7f4; --acc:#2f8f6b; --ico:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%222%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M14.7 6.3a1 1 0 000 1.4l1.6 1.6a1 1 0 001.4 0l3.77-3.77a6 6 0 01-7.94 7.94l-6.91 6.91a2.12 2.12 0 01-3-3l6.91-6.91a6 6 0 017.94-7.94l-3.76 3.76z%22/%3E%3C/svg%3E"); }
.tj-herr { background:linear-gradient(135deg,#fff,#eef4fb); } .tj-prod { background:linear-gradient(135deg,#fff,#eef8f1); }
.tj-herr .tj-pic { background:#e3edf8; } .tj-prod .tj-pic { background:#e3f1ea; }
.tj-herr .tj-pic i, .tj-prod .tj-pic i { font-style:normal; font-size:34px; animation:mp-rec 2.6s ease-in-out infinite; }
.tj-prod .tj-pic i { animation-name:mp-rec2; }
@keyframes mp-rec { 0%,100% { transform:rotate(-8deg) scale(1); } 50% { transform:rotate(8deg) scale(1.1); } }
@keyframes mp-rec2 { 0%,100% { transform:translateY(3px); } 50% { transform:translateY(-6px); } }
@media (prefers-reduced-motion:reduce) { .tj-herr .tj-pic i, .tj-prod .tj-pic i { animation:none; } }

/* Apartado "TV en vivo" de la portada */
#tv-corto { --ico:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%222%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%222%22 y=%227%22 width=%2220%22 height=%2214%22 rx=%222%22/%3E%3Cpath d=%22M8 3l4 4 4-4%22/%3E%3C/svg%3E"); }

/* Celular y tablet: las últimas noticias van como 3.er bloque (clima, cotizaciones, noticias, cripto, juegos, herramientas, TV) */
@media (max-width: 1099px) {
  #noti-corto { order:3; } #cripto { order:4; } #juego { order:5; } #juegos { order:6; } #recursos { order:7; } #tv-corto { order:8; }
}


/* Aviso del caso Ueno Bank en el inicio */
.ueno-aviso { display: flex; align-items: center; gap: 12px; margin: 0 0 12px; padding: 12px 16px; background: #000; color: #02D09C; border-radius: 12px; text-decoration: none; border: 1px solid #02D09C; }
.ueno-aviso:hover, .ueno-aviso:focus-visible { background: #07110e; }
.ueno-punto { flex: none; width: 10px; height: 10px; border-radius: 50%; background: #02D09C; box-shadow: 0 0 0 0 rgba(2, 208, 156, .6); animation: ueno-pulso 1.8s ease-out infinite; }
.ueno-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
.ueno-txt strong { font-size: 1.05rem; color: #02D09C; }
.ueno-txt small { font-size: .82rem; color: #7fe8cb; }
.ueno-ver { flex: none; font-weight: 700; color: #02D09C; }
@keyframes ueno-pulso { 70% { box-shadow: 0 0 0 9px rgba(2, 208, 156, 0); } 100% { box-shadow: 0 0 0 0 rgba(2, 208, 156, 0); } }
@media (prefers-reduced-motion: reduce) { .ueno-punto { animation: none; } }
