/* Blockland · Aventura — HUD de los mundos (corazones, inventario, jefe). */
.wba-hud{position:absolute;inset:0;pointer-events:none;z-index:45;font-family:-apple-system,"Inter",system-ui,sans-serif;color:#fff}
.wba-hud[hidden]{display:none}
.wba-hud-top{position:absolute;top:calc(env(safe-area-inset-top,0px) + 10px);left:10px;display:flex;flex-direction:column;gap:6px;background:rgba(18,18,24,.62);backdrop-filter:blur(14px) saturate(1.4);-webkit-backdrop-filter:blur(14px) saturate(1.4);border:.5px solid rgba(255,255,255,.14);border-radius:14px;padding:8px 10px}
.wba-hearts{display:flex;gap:3px;flex-wrap:wrap;max-width:190px}
.wba-h{width:18px;height:16px;display:inline-block;image-rendering:pixelated;background-size:18px 16px;background-repeat:no-repeat}
.wba-h-2{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9 8' shape-rendering='crispEdges'%3E%3Cpath fill='%233a0d12' d='M1 0h3v1h1V0h3v1h1v4H8v1H7v1H6v1H3V7H2V6H1V5H0V1h1z'/%3E%3Cpath fill='%23ff4d5a' d='M1 1h2v1h1v1h1V2h1V1h2v4H7v1H6v1H3V6H2V5H1z'/%3E%3Cpath fill='%23ffb3b9' d='M2 2h1v1H2z'/%3E%3C/svg%3E")}
.wba-h-1{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9 8' shape-rendering='crispEdges'%3E%3Cpath fill='%233a0d12' d='M1 0h3v1h1V0h3v1h1v4H8v1H7v1H6v1H3V7H2V6H1V5H0V1h1z'/%3E%3Cpath fill='%23552028' d='M5 2h1V1h2v4H7v1H6v1H5z'/%3E%3Cpath fill='%23ff4d5a' d='M1 1h2v1h1v1h1v4H3V6H2V5H1z'/%3E%3C/svg%3E")}
.wba-h-0{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9 8' shape-rendering='crispEdges'%3E%3Cpath fill='%233a0d12' d='M1 0h3v1h1V0h3v1h1v4H8v1H7v1H6v1H3V7H2V6H1V5H0V1h1z'/%3E%3Cpath fill='%23552028' d='M1 1h2v1h1v1h1V2h1V1h2v4H7v1H6v1H3V6H2V5H1z'/%3E%3C/svg%3E")}
.wba-inv{display:flex;gap:6px;align-items:center}
.wba-chip{display:inline-flex;align-items:center;gap:4px;font-size:12px;font-variant-numeric:tabular-nums;color:#e9edf2}
.wba-chip[hidden]{display:none}
.wba-ico{width:14px;height:14px;display:inline-block;background-size:contain;background-repeat:no-repeat;image-rendering:pixelated}
.wba-ico-idea{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 7 9' shape-rendering='crispEdges'%3E%3Cpath fill='%23ffd84d' d='M2 0h3v1h1v1h1v3H6v1H5v1H2V6H1V5H0V2h1V1h1z'/%3E%3Cpath fill='%23fffbe0' d='M2 1h1v1H2z'/%3E%3Cpath fill='%239aa3ad' d='M2 7h3v1H2z'/%3E%3Cpath fill='%2355555f' d='M2 8h3v1H2z'/%3E%3C/svg%3E")}
.wba-ico-key{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 6 10' shape-rendering='crispEdges'%3E%3Cpath fill='%23f2c14e' d='M1 0h3v1h1v3H4v5h2v1H3V4H1V3H0V1h1zm0 1v2h3V1z'/%3E%3C/svg%3E")}
.wba-ico-bk{width:18px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' shape-rendering='crispEdges'%3E%3Cpath fill='%23e8262c' d='M1 1h3v4H1z'/%3E%3Cpath fill='%2338d26b' d='M4 1h4v4H4z'/%3E%3Cpath fill='%232b59ff' d='M8 1h3v4H8z'/%3E%3Cpath fill='%23f2c14e' d='M5 5h2v6H5zM7 8h3v1H7zM7 10h3v1H7z'/%3E%3C/svg%3E")}
.wba-room{position:absolute;left:50%;top:calc(env(safe-area-inset-top,0px) + 14px);transform:translateX(-50%);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.9);text-shadow:0 1px 3px rgba(0,0,0,.8);opacity:0;white-space:nowrap}
.wba-room.is-on{animation:wbaRoom 2.6s ease forwards}
@keyframes wbaRoom{0%{opacity:0;transform:translate(-50%,-6px)}12%{opacity:1;transform:translate(-50%,0)}75%{opacity:1}100%{opacity:0}}
.wba-boss{position:absolute;left:50%;bottom:calc(env(safe-area-inset-bottom,0px) + 22px);transform:translateX(-50%);width:min(420px,70vw);text-align:center;font-size:12px;font-weight:600;letter-spacing:.04em;text-shadow:0 1px 3px #000}
.wba-boss[hidden]{display:none}
.wba-boss-bar{margin-top:5px;height:10px;border-radius:6px;background:rgba(0,0,0,.6);border:1px solid rgba(255,255,255,.35);overflow:hidden}
.wba-boss-bar i{display:block;height:100%;background:linear-gradient(90deg,#fe4b4a,#ffb02e);transition:width .25s ease}
.wba-title{position:absolute;left:50%;top:30%;transform:translate(-50%,-50%);text-align:center;text-shadow:0 2px 12px rgba(0,0,0,.8);opacity:0}
.wba-title[hidden]{display:none}
.wba-title small{display:block;font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:#cfd6df;margin-bottom:6px}
.wba-title strong{display:block;font-size:clamp(26px,5vw,44px);font-weight:800;letter-spacing:-.01em}
.wba-title.is-on{animation:wbaTitle 3.1s ease forwards}
@keyframes wbaTitle{0%{opacity:0;transform:translate(-50%,-40%)}14%{opacity:1;transform:translate(-50%,-50%)}78%{opacity:1}100%{opacity:0}}
.wba-shout{position:absolute;left:50%;top:22%;transform:translateX(-50%);font-size:clamp(30px,7vw,64px);font-weight:900;letter-spacing:.02em;text-shadow:0 3px 0 #000,0 0 24px rgba(0,0,0,.6);white-space:nowrap}
.wba-shout[hidden]{display:none}
.wba-shout.is-red{color:#ff3b30}
.wba-shout.is-green{color:#7ed321}
.wba-over{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(10,4,8,.72);pointer-events:auto;padding:18px}
.wba-over[hidden]{display:none}
.wba-over-card{max-width:380px;background:rgba(22,20,28,.96);border:1px solid rgba(255,255,255,.14);border-radius:18px;padding:20px 20px 16px;text-align:center;box-shadow:0 30px 80px -20px #000}
.wba-over-card h3{margin:0 0 6px;font-size:20px}
.wba-over-card p{margin:0 0 14px;font-size:13.5px;line-height:1.45;color:#c2c9d3}
.wba-over-btns{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.wba-over-btns button{border:0;border-radius:11px;padding:11px 16px;font-size:14px;font-weight:600;cursor:pointer;background:#fe4b4a;color:#fff}
.wba-over-btns button.is-ghost{background:rgba(255,255,255,.08);color:#e3e7ec;border:1px solid rgba(255,255,255,.16)}
/* Dentro de un mundo sobran el botón de aspecto y el panel del pueblo */
body.wba-in-realm .wb-aspect,body.wba-in-realm .wb-missions{display:none!important}
/* Panel de misiones del pueblo: pie con rango y vida */
.wb-missions .wb-rank{margin-top:6px;padding-top:6px;border-top:.5px solid rgba(255,255,255,.12);font-size:10.5px;color:#aab3bf;display:flex;justify-content:space-between;gap:8px}
.wb-missions .wb-rank b{color:#fff;font-weight:600}
.wb-mission.is-locked{color:#6f7884}
.wb-mission .wb-dot{width:8px;height:8px;border-radius:2px;display:inline-block;margin-right:2px}
@media(max-width:640px){.wba-hud-top{padding:6px 8px}.wba-h{width:15px;height:13px;background-size:15px 13px}}
@media (prefers-reduced-motion:reduce){.wba-title.is-on,.wba-room.is-on{animation-duration:.01s}}
.wba-vig{position:absolute;inset:0;pointer-events:none;z-index:-1}

/* ── Táctil (revisión móvil) ──
   Las cajas de los clusters eran transparentes pero capturaban toques: se
   tragaban los botones de la derrota y la flecha → en pantallas de 375 px.
   Solo reciben toques los botones y la zona de la cruceta. */
#juego-wrap .game-hud-cluster,#juego-wrap .game-hud-actions{pointer-events:none}
#juego-wrap .ghud-btn,#juego-wrap .game-hud-dpad{pointer-events:auto}
#juego-wrap .game-hud,#juego-wrap .game-hud *{touch-action:none;-webkit-user-select:none;user-select:none}
html,body{overscroll-behavior:none}
@media (max-width:480px){#juego-wrap .game-hud[data-mode="touch"] .game-hud-cluster{padding:0}}
/* Derrota: la botonera se esconde (si no, quedaba por encima de la tarjeta) */
body.wba-dead #game-hud,body.wba-dead .wb-quick,body.wba-dead #ui-banner{visibility:hidden}
.wba-over{z-index:5}
/* Ayuda: texto según dispositivo */
#juego-wrap .wb-help-touch{display:none}
@media (pointer:coarse){#juego-wrap .wb-help-touch{display:block}#juego-wrap .wb-help-kbd{display:none}}
/* Botones rápidos (ayuda y sonido) en táctil, arriba en el centro */
.wb-quick{position:absolute;top:calc(env(safe-area-inset-top,0px) + 10px);left:50%;transform:translateX(-50%);z-index:41;display:flex;gap:6px}
.wb-quick button{width:34px;height:34px;border-radius:50%;border:.5px solid rgba(255,255,255,.2);background:rgba(22,24,28,.62);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);color:#fff;font:700 15px/1 -apple-system,system-ui,sans-serif;display:flex;align-items:center;justify-content:center;padding:0;cursor:pointer;touch-action:manipulation}
body.wba-in-realm .wba-room{top:calc(env(safe-area-inset-top,0px) + 52px)}
@media (pointer:coarse){.wba-room{top:calc(env(safe-area-inset-top,0px) + 52px)}}
/* Rótulo del mundo: a todo el ancho disponible (se encogía a media pantalla) */
.wba-title{width:max-content;max-width:92vw}
/* Horizontal y con poca altura: botonera compacta y banner entre los clusters */
@media (pointer:coarse) and (max-height:500px){
  #juego-wrap .game-hud[data-mode="touch"] .game-hud-actions{width:132px;height:150px}
  #juego-wrap .game-hud[data-mode="touch"] .ghud-interact{width:60px;height:60px}
  #juego-wrap .game-hud[data-mode="touch"] .ghud-jump{right:70px;bottom:78px;width:50px;height:50px}
  #juego-wrap .game-hud[data-mode="touch"] .ghud-run{right:2px;bottom:100px;width:44px;height:44px}
  #juego-wrap .game-hud[data-mode="touch"] .game-hud-dpad{grid-template-columns:46px 46px 46px;grid-template-rows:46px 46px 46px}
  #juego-wrap .game-hud[data-mode="touch"] .ghud-arrow{width:46px;height:46px}
  #juego-wrap .game-banner{bottom:calc(env(safe-area-inset-bottom,0px) + 18px);max-width:calc(100vw - 420px)}
  .wb-missions{display:none}
}

/* ── Tienda del estudio ── */
#juego-wrap .game-modal-card[data-mode="tienda"]{max-width:min(560px,94vw)}
#juego-wrap .game-modal-card[data-mode="tienda"] .game-modal-tab-content{max-height:min(62vh,560px);overflow:auto;padding:2px 2px 6px}
.wbs{font-family:-apple-system,"Inter",system-ui,sans-serif;color:inherit}
.wbs-head{margin:0 0 10px;font-size:13px;line-height:1.45;opacity:.85}
.wbs h4{margin:12px 0 6px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;opacity:.6;font-weight:600}
.wbs ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.wbs-item{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:12px;background:rgba(127,127,127,.09);border:.5px solid rgba(127,127,127,.18)}
.wbs-item.is-owned{opacity:.72}
.wbs-ico{font-size:22px;width:30px;text-align:center;flex:none}
.wbs-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;font-size:13.5px}
.wbs-txt small{font-size:12px;opacity:.72;line-height:1.35}
.wbs-count{font-size:11px;opacity:.6;margin-left:6px;font-variant-numeric:tabular-nums}
.wbs-txt b{display:inline}
.wbs-item button,.wbs-off{flex:none;border:0;border-radius:10px;padding:8px 12px;font:600 13px/1 -apple-system,system-ui,sans-serif;cursor:pointer;background:#2b59ff;color:#fff;min-width:84px;font-variant-numeric:tabular-nums}
.wbs-item button[disabled]{background:rgba(127,127,127,.25);color:inherit;cursor:default;opacity:.8}
.wbs-off{margin-top:10px;background:rgba(127,127,127,.18);color:inherit}
@media (pointer:coarse){.wbs-item button{min-height:40px}}

/* ══ Diálogos RPG (aventura-dialogo.js) ══ */
.wbd{position:absolute;left:0;right:0;bottom:calc(env(safe-area-inset-bottom,0px) + 18px);z-index:1100;display:flex;justify-content:center;padding:0 12px;pointer-events:none;font-family:'Pixelify Sans',ui-monospace,monospace;opacity:0;transform:translateY(14px);transition:opacity .16s ease,transform .2s cubic-bezier(.2,.9,.3,1)}
.wbd.is-on{opacity:1;transform:none}
.wbd[hidden]{display:none}
.wbd-box{pointer-events:auto;position:relative;display:flex;gap:14px;align-items:flex-start;width:min(760px,100%);min-height:118px;padding:16px 18px 16px 16px;background:linear-gradient(180deg,#232638,#181a27);color:#f3f1ea;border:3px solid #0b0c12;box-shadow:inset 0 0 0 2px #4b4f6b,inset 0 0 0 4px #0b0c12,0 14px 36px -10px rgba(0,0,0,.7);border-radius:6px;cursor:pointer;image-rendering:pixelated}
.wbd-pt{flex:none;width:96px;height:96px;border-radius:4px;background:radial-gradient(120% 120% at 30% 20%,color-mix(in srgb,var(--wbd-accent) 55%,#ffffff) ,var(--wbd-accent) 60%,color-mix(in srgb,var(--wbd-accent) 55%,#000000));box-shadow:inset 0 0 0 2px #0b0c12,inset 0 0 0 4px rgba(255,255,255,.25),0 0 0 2px #0b0c12;overflow:hidden;display:flex;align-items:flex-end;justify-content:center}
.wbd-pt[hidden]{display:none}
.wbd-pt canvas{width:96px;height:96px;image-rendering:pixelated}
.wbd-main{flex:1;min-width:0}
.wbd-name{position:absolute;top:-17px;left:14px;padding:4px 12px 5px;font-size:15px;font-weight:700;letter-spacing:.02em;background:var(--wbd-accent);color:#fff;border:3px solid #0b0c12;border-radius:4px;box-shadow:inset 0 2px 0 rgba(255,255,255,.3);text-shadow:0 1px 0 rgba(0,0,0,.45)}
.wbd-name[hidden]{display:none}
.wbd.is-narrator .wbd-name{background:#3a3e55}
.wbd-text{margin:6px 0 0;font-size:19px;line-height:1.38;letter-spacing:.01em;white-space:pre-wrap;min-height:2.8em}
.wbd-choices{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.wbd-choice{font:600 16px 'Pixelify Sans',ui-monospace,monospace;padding:7px 12px;border-radius:4px;border:2px solid #0b0c12;background:#2e3249;color:#e8e6df;cursor:pointer}
.wbd-choice.is-cta{background:#3a3f5c}
.wbd-choice.is-sel{background:var(--wbd-accent);color:#fff;box-shadow:inset 0 2px 0 rgba(255,255,255,.3)}
.wbd-next{position:absolute;right:14px;bottom:8px;font-size:14px;color:#f2c14e;animation:wbdBlink .8s steps(2) infinite}
.wbd-next[hidden]{display:none}
@keyframes wbdBlink{50%{transform:translateY(3px);opacity:.5}}
body.wbd-open #game-hud,body.wbd-open .wb-quick,body.wbd-open #ui-banner{visibility:hidden}
@media (max-width:560px){.wbd-box{padding:14px 12px 14px 10px;gap:10px;min-height:96px}.wbd-pt,.wbd-pt canvas{width:68px;height:68px}.wbd-text{font-size:16px}.wbd-name{font-size:13px}}

/* ══ Títulos ══ */
.wbt-plaque{position:absolute;left:50%;top:calc(env(safe-area-inset-top,0px) + 12px);z-index:60;transform:translate(-50%,-90px);transition:transform .32s cubic-bezier(.2,.9,.3,1);pointer-events:none;font-family:'Pixelify Sans',ui-monospace,monospace}
.wbt-plaque.is-on{transform:translate(-50%,0)}
.wbt-plaque-in{display:flex;flex-direction:column;align-items:center;padding:8px 22px 9px;background:linear-gradient(180deg,#5b3b23,#43291a);color:#fff3dc;border:3px solid #1d120a;border-radius:5px;box-shadow:inset 0 0 0 2px #8a5e38,0 10px 24px -8px rgba(0,0,0,.6)}
.wbt-plaque-in b{font-size:18px;font-weight:700;letter-spacing:.03em;text-shadow:0 2px 0 rgba(0,0,0,.4)}
.wbt-plaque-in small{font-size:12px;opacity:.85;margin-top:1px}
.wbt-cine{position:absolute;inset:0;z-index:70;pointer-events:none;font-family:'Pixelify Sans',ui-monospace,monospace}
.wbt-bar{position:absolute;left:0;right:0;height:11vh;background:#07070b;transition:transform .45s cubic-bezier(.2,.9,.3,1)}
.wbt-bar.t{top:0;transform:translateY(-100%)}.wbt-bar.b{bottom:0;transform:translateY(100%)}
.wbt-cine.is-on .wbt-bar{transform:none}
.wbt-cine.is-out .wbt-bar.t{transform:translateY(-100%)}.wbt-cine.is-out .wbt-bar.b{transform:translateY(100%)}
.wbt-cine-txt{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%);text-align:center;color:#fff;opacity:0;transition:opacity .4s ease .15s;width:max-content;max-width:92vw}
.wbt-cine.is-on .wbt-cine-txt{opacity:1}.wbt-cine.is-out .wbt-cine-txt{opacity:0;transition-delay:0s}
.wbt-cine-txt small{display:block;font-size:14px;letter-spacing:.3em;text-transform:uppercase;opacity:.8;margin-bottom:8px}
.wbt-cine-txt strong{display:block;font-size:clamp(32px,6vw,64px);font-weight:700;letter-spacing:.02em;text-shadow:0 4px 0 rgba(0,0,0,.55)}
.wbt-line{display:block;height:5px;margin:12px auto 0;width:0;background:var(--wbt-color);transition:width .7s cubic-bezier(.2,.9,.3,1) .3s}
.wbt-cine.is-on .wbt-line{width:70%}
.wbt-vs{position:absolute;inset:0;z-index:75;pointer-events:none;overflow:hidden;font-family:'Pixelify Sans',ui-monospace,monospace;background:rgba(5,5,10,0);transition:background .3s}
.wbt-vs.is-on{background:rgba(5,5,10,.55)}.wbt-vs.is-out{background:rgba(5,5,10,0)}
.wbt-vs-band{position:absolute;left:-10%;right:-10%;top:30%;height:40%;background:linear-gradient(90deg,var(--wbt-color),color-mix(in srgb,var(--wbt-color) 50%,#000));transform:skewY(-6deg) translateX(-120%);transition:transform .45s cubic-bezier(.2,.9,.3,1);box-shadow:0 0 0 4px #0b0c12}
.wbt-vs.is-on .wbt-vs-band{transform:skewY(-6deg) translateX(0)}.wbt-vs.is-out .wbt-vs-band{transform:skewY(-6deg) translateX(120%)}
.wbt-vs-pt{position:absolute;left:10%;top:50%;width:min(30vh,220px);height:min(30vh,220px);transform:translate(-160%,-50%);image-rendering:pixelated;transition:transform .5s cubic-bezier(.2,.9,.3,1) .1s;filter:drop-shadow(6px 6px 0 rgba(0,0,0,.45))}
.wbt-vs.is-on .wbt-vs-pt{transform:translate(0,-50%)}.wbt-vs.is-out .wbt-vs-pt{transform:translate(-160%,-50%)}
.wbt-vs-txt{position:absolute;left:calc(10% + min(30vh,220px) + 4%);right:6%;top:50%;transform:translate(60px,-50%);opacity:0;color:#fff;transition:all .45s ease .2s}
.wbt-vs.is-on .wbt-vs-txt{transform:translate(0,-50%);opacity:1}.wbt-vs.is-out .wbt-vs-txt{opacity:0}
.wbt-vs-txt small{display:block;font-size:clamp(13px,1.6vw,18px);letter-spacing:.25em;text-transform:uppercase;opacity:.9}
.wbt-vs-txt strong{display:block;font-size:clamp(40px,8vw,96px);line-height:1;font-weight:700;text-shadow:0 5px 0 rgba(0,0,0,.5)}
.wbt-vs-txt em{display:block;font-style:normal;font-size:clamp(14px,1.8vw,20px);margin-top:8px;opacity:.95}
@media (max-width:560px){.wbt-vs-pt{left:4%;width:120px;height:120px}.wbt-vs-txt{left:calc(4% + 130px)}}
@media (prefers-reduced-motion:reduce){.wbd,.wbt-plaque,.wbt-bar,.wbt-vs-band,.wbt-vs-pt,.wbt-vs-txt,.wbt-cine-txt,.wbt-line{transition-duration:.01s!important}}
