/* GOMICRAZY v2.4.148.1 — Arena Gomi responsive + economía.
   Todo mantiene su relación de aspecto. No se estiran nodos, logos ni botones. */
#pantalla-ruta{
  padding:0!important;overflow:hidden!important;background:#09051b!important;
}
#pantalla-ruta>.arena-gomi-shell{
  position:absolute;inset:0;display:grid;place-items:center;overflow:hidden;isolation:isolate;
  padding:max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));
  color:#fff;font-family:Arial,Helvetica,sans-serif;
}
.ag-screen-bg{position:absolute;inset:0;z-index:-3;overflow:hidden}
.ag-screen-bg img{width:100%;height:100%;display:block;object-fit:cover;object-position:center;filter:saturate(1.08) brightness(.62);transform:scale(1.03)}
.arena-gomi-shell::after{content:'';position:absolute;inset:0;z-index:-2;background:radial-gradient(circle at 50% 42%,rgba(33,20,95,.08) 0 35%,rgba(4,2,20,.42) 78%,rgba(2,1,12,.72) 100%);pointer-events:none}

.ag-map-stage{
  position:relative;overflow:hidden;isolation:isolate;
  width:min(96vw,calc((var(--ag-vh,100vh) - 22px)*1.7777778));
  aspect-ratio:16/9;max-height:calc(var(--ag-vh,100vh) - 18px);
  border-radius:clamp(20px,2.1vw,38px);
  border:clamp(2px,.25vw,4px) solid rgba(126,220,255,.82);
  box-shadow:0 0 0 4px rgba(112,36,244,.52),0 0 40px rgba(38,173,255,.32),0 24px 70px rgba(0,0,0,.55);
  background:#180a3a;
}
.ag-terrain{position:absolute;inset:0;z-index:-3;overflow:hidden}
.ag-terrain img{width:100%;height:100%;display:block;object-fit:cover;object-position:center;user-select:none;-webkit-user-drag:none;pointer-events:none}
.ag-stage-shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(180deg,rgba(5,2,36,.08),rgba(33,2,54,.02) 55%,rgba(5,1,25,.22));pointer-events:none}

.ag-arena-logo{
  position:absolute;z-index:4;left:3.2%;top:2.0%;width:min(27%,360px);height:auto;object-fit:contain;
  filter:drop-shadow(0 8px 12px rgba(23,0,44,.48));pointer-events:none;user-select:none;
}
.ag-back,.ag-gems,.ag-coins,.ag-level,.ag-play-only{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.ag-back{
  position:absolute;z-index:15;left:1.25%;top:1.5%;width:clamp(38px,4vw,58px);aspect-ratio:1;border:2px solid #8eeaff;border-radius:16px;
  background:linear-gradient(180deg,rgba(13,65,142,.96),rgba(12,31,92,.96));color:#fff;font:1000 clamp(30px,3.2vw,48px)/.8 Arial;cursor:pointer;
  box-shadow:0 4px 0 #07163b,0 0 18px rgba(42,213,255,.38)
}
.ag-wallet{position:absolute;z-index:15;right:1.4%;top:1.65%;display:flex;gap:clamp(5px,.55vw,9px);align-items:center}
.ag-gems,.ag-coins{min-width:clamp(92px,9vw,138px);height:clamp(38px,4vw,56px);padding:0 8px;border:2px solid rgba(130,235,255,.85);border-radius:999px;display:flex;align-items:center;justify-content:center;gap:clamp(5px,.6vw,9px);background:linear-gradient(180deg,rgba(19,46,114,.97),rgba(6,18,62,.97));color:#fff;cursor:pointer;box-shadow:0 4px 0 #071331,0 0 16px rgba(31,209,255,.25)}
.ag-gems img,.ag-coins img{width:clamp(20px,2.1vw,31px);height:clamp(20px,2.1vw,31px);object-fit:contain}.ag-gems b,.ag-coins b{font-size:clamp(13px,1.45vw,21px)}.ag-gems span,.ag-coins span{display:grid;place-items:center;width:clamp(20px,2vw,29px);aspect-ratio:1;border-radius:50%;background:#55e637;color:#082b07;font-weight:1000;font-size:clamp(15px,1.7vw,23px)}


.ag-route-svg{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none;overflow:visible}
.ag-route-portrait{display:none}
.ag-route-shadow,.ag-route-line{fill:none;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.ag-route-shadow{stroke:rgba(255,105,0,.72);stroke-width:clamp(18px,2.1vw,34px);filter:drop-shadow(0 0 10px rgba(255,101,0,.85))}
.ag-route-line{stroke:#ffd94a;stroke-width:clamp(11px,1.25vw,22px);filter:drop-shadow(0 0 8px rgba(255,247,127,.95))}

.ag-levels{position:absolute;inset:0;z-index:6}
.ag-level{
  position:absolute;left:var(--x);top:var(--y);width:var(--s);aspect-ratio:1.12/1;transform:translate(-50%,-50%);border:0;background:transparent;padding:0;cursor:pointer;
  transition:transform .14s ease,filter .14s ease;filter:drop-shadow(0 9px 12px rgba(11,0,28,.50));
}
.ag-level:hover:not(.locked),.ag-level:focus-visible:not(.locked){transform:translate(-50%,-50%) scale(1.065);filter:drop-shadow(0 0 17px rgba(255,224,76,.80)) drop-shadow(0 11px 12px rgba(11,0,28,.52));outline:none}
.ag-level:active:not(.locked){transform:translate(-50%,-50%) scale(.96)}
.ag-level-art{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:contain;pointer-events:none;user-select:none;-webkit-user-drag:none}
.ag-level-number{
  position:absolute;z-index:2;left:50%;top:47%;transform:translate(-50%,-50%);min-width:28%;padding:.08em .2em;border-radius:.35em;color:#fff;text-align:center;
  font:1000 clamp(14px,1.8vw,30px)/1 Arial;text-shadow:0 2px 0 #06152c,0 0 8px rgba(61,224,255,.9);pointer-events:none
}
.ag-level-stars{position:absolute;z-index:3;left:50%;top:68%;transform:translateX(-50%);color:#ffd43b;font:1000 clamp(10px,1.15vw,19px)/1 Arial;letter-spacing:.07em;text-shadow:0 2px 0 #6e3500,0 0 8px rgba(255,213,54,.8);white-space:nowrap;pointer-events:none}
.ag-level-lock{display:none;position:absolute;z-index:5;left:50%;top:50%;transform:translate(-50%,-50%);font-size:clamp(20px,2.4vw,38px);filter:drop-shadow(0 4px 6px #000);pointer-events:none}
.ag-level.locked{cursor:not-allowed;filter:grayscale(.72) brightness(.62) drop-shadow(0 7px 9px rgba(0,0,0,.55))}.ag-level.locked .ag-level-lock{display:block}.ag-level.locked .ag-level-number{opacity:.45}
.ag-level-cost{position:absolute;z-index:6;right:2%;bottom:5%;display:flex;align-items:center;gap:2px;padding:2px 5px;border-radius:999px;background:rgba(11,8,43,.92);border:1px solid rgba(255,214,72,.88);color:#fff;font:1000 clamp(8px,.85vw,13px)/1 Arial;box-shadow:0 2px 5px rgba(0,0,0,.45);pointer-events:none}.ag-level-cost[hidden]{display:none}.ag-level-cost img{width:1.22em;height:1.22em;object-fit:contain}
.ag-level.current:not(.locked)::after{content:'';position:absolute;left:50%;top:50%;width:78%;height:61%;transform:translate(-50%,-45%);border-radius:50%;border:clamp(2px,.25vw,4px) solid #8cff67;box-shadow:0 0 0 4px rgba(78,255,68,.25),0 0 22px #4dff4c;animation:agCurrentPulse 1.25s ease-in-out infinite;pointer-events:none}
@keyframes agCurrentPulse{50%{transform:translate(-50%,-45%) scale(1.06);opacity:.7}}

.ag-play-only{
  position:absolute;z-index:12;left:6.2%;bottom:4.0%;width:clamp(88px,10.6vw,164px);aspect-ratio:405/350;border:0;background:transparent;padding:0;cursor:pointer;filter:drop-shadow(0 8px 12px rgba(0,34,10,.50));transition:transform .13s ease,filter .13s ease;
}
.ag-play-only img{width:100%;height:100%;display:block;object-fit:contain;pointer-events:none;user-select:none;-webkit-user-drag:none}
.ag-play-only:hover,.ag-play-only:focus-visible{transform:scale(1.065);filter:drop-shadow(0 0 18px rgba(67,255,94,.88));outline:none}.ag-play-only:active{transform:scale(.95)}

.ag-status{position:fixed;left:50%;bottom:max(18px,env(safe-area-inset-bottom));z-index:50;transform:translate(-50%,12px);opacity:0;pointer-events:none;max-width:min(88vw,680px);padding:10px 18px;border:1px solid rgba(255,255,255,.18);border-radius:999px;background:rgba(7,5,27,.92);color:#fff;text-align:center;font-weight:900;font-size:clamp(12px,1.1vw,15px);transition:.18s ease}.ag-status.on{opacity:1;transform:translate(-50%,0)}

/* Vertical: el mapa ocupa el alto y los mismos assets se reorganizan sin estirarse. */
.arena-gomi-shell[data-layout="portrait"] .ag-map-stage{
  width:min(96vw,calc((var(--ag-vh,100vh) - 16px)*.5625));height:min(calc(var(--ag-vh,100vh) - 16px),calc(96vw*1.7777778));max-height:none;aspect-ratio:9/16;border-radius:clamp(20px,5vw,34px)
}
.arena-gomi-shell[data-layout="portrait"] .ag-terrain img{object-position:center top}
.arena-gomi-shell[data-layout="portrait"] .ag-stage-shade{background:linear-gradient(180deg,rgba(5,2,36,.04),rgba(13,1,32,.03) 70%,rgba(2,1,16,.18))}
.arena-gomi-shell[data-layout="portrait"] .ag-arena-logo{left:50%;top:3.3%;transform:translateX(-50%);width:68%;max-width:none}
.arena-gomi-shell[data-layout="portrait"] .ag-back{left:2.2%;top:1.5%;width:clamp(36px,10vw,54px);border-radius:14px}
.arena-gomi-shell[data-layout="portrait"] .ag-wallet{right:1.5%;top:1.4%;flex-direction:column;gap:4px}.arena-gomi-shell[data-layout="portrait"] .ag-gems,.arena-gomi-shell[data-layout="portrait"] .ag-coins{height:clamp(32px,8.2vw,44px);min-width:clamp(78px,22vw,112px);padding:0 5px}.arena-gomi-shell[data-layout="portrait"] .ag-arena-logo{width:61%}
.arena-gomi-shell[data-layout="portrait"] .ag-route-landscape{display:none}.arena-gomi-shell[data-layout="portrait"] .ag-route-portrait{display:block}
.arena-gomi-shell[data-layout="portrait"] .ag-route-shadow{stroke-width:clamp(15px,4.2vw,26px)}.arena-gomi-shell[data-layout="portrait"] .ag-route-line{stroke-width:clamp(9px,2.7vw,17px)}
.arena-gomi-shell[data-layout="portrait"] .ag-level-number{font-size:clamp(15px,4.2vw,25px);top:47%}.arena-gomi-shell[data-layout="portrait"] .ag-level-stars{font-size:clamp(9px,2.5vw,15px);top:68%}
.arena-gomi-shell[data-layout="portrait"] .ag-play-only{left:48%;bottom:4.1%;width:clamp(82px,25vw,130px)}

/* Teléfonos muy bajos o navegador con barras grandes: siempre cabe completo. */
@media (orientation:landscape) and (max-height:560px){
  .ag-map-stage{width:min(97vw,calc((var(--ag-vh,100vh) - 10px)*1.7777778));border-radius:18px}.ag-arena-logo{width:24%;top:1%}.ag-back{top:1%;left:1%}.ag-wallet{top:1%;right:1%}.ag-play-only{bottom:2.5%;width:clamp(74px,9.5vw,120px)}
}
@media (prefers-reduced-motion:reduce){.ag-level,.ag-play-only,.ag-level.current:not(.locked)::after{transition:none!important;animation:none!important}}
