/* R40R67B13 — mobile UI cleanup, combo modal fit/scroll, joystick and symbolic combat actions. */

/* The legacy/local cache loader still runs, but it is never presented to the player. */
html.r40r67b13 #pack196ExternalCacheLoader,
html.r40r67b13 body.pack196-loading #pack196ExternalCacheLoader{
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}

/* Pack197 is superseded by the working Pack185 SELECT action button. */
html.r40r67b13 #pack197SelectBackButton,
html.r40r67b13 #pack197SelectFooterBackHit{
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
  width:0!important;
  height:0!important;
}

/* Never reveal the legacy combat overlay during boot, MENU or SELECT. */
html.r40r67b13.pack196-preload #mobileControls,
html.r40r67b13 body.pack196-loading #mobileControls,
html.r40r67b13 body.pack187-preboot #mobileControls,
html.r40r67b13 body.pack187-booting #mobileControls,
html.r40r67b13 body.pack185-overlay-active #mobileControls,
html.r40r67b13 body.touch-ui-enabled:not(.sk-scene-fight):not(.sk-scene-pause) #mobileControls{
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}
html.r40r67b13 body.touch-ui-enabled.sk-scene-fight #mobileControls,
html.r40r67b13 body.touch-ui-enabled.sk-scene-pause #mobileControls{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
}

/* F4 remains available from keyboard/graphics settings; the mobile debug chip is removed. */
html.r40r67b13 #mobileF4{
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}

/* Combo list: short landscape viewports keep two columns and a real scroll surface. */
html.r40r67b13 #pack145ComboOverlay{
  padding:max(3px,env(safe-area-inset-top)) max(3px,env(safe-area-inset-right)) max(3px,env(safe-area-inset-bottom)) max(3px,env(safe-area-inset-left))!important;
  overscroll-behavior:contain!important;
}
html.r40r67b13 #pack145ComboOverlay .p145-card{
  width:min(1180px,calc(100vw - 6px))!important;
  height:min(760px,calc(100dvh - 6px))!important;
  max-height:calc(100dvh - 6px)!important;
  min-height:0!important;
  overflow:hidden!important;
}
html.r40r67b13 #pack145ComboOverlay .p145-head{
  flex:0 0 auto!important;
}
html.r40r67b13 #pack145ComboOverlay .p145-body{
  flex:1 1 0!important;
  min-height:0!important;
  max-height:none!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch!important;
  touch-action:pan-y!important;
  overscroll-behavior:contain!important;
  scrollbar-gutter:stable!important;
}
html.r40r67b13 #pack145ComboOverlay .p145-body::-webkit-scrollbar{width:10px!important;}
html.r40r67b13 #pack145ComboOverlay .p145-body::-webkit-scrollbar-track{background:rgba(2,8,18,.76)!important;}
html.r40r67b13 #pack145ComboOverlay .p145-body::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,#27d8ff,#ff3f91)!important;
  border:2px solid rgba(2,8,18,.76)!important;
  border-radius:999px!important;
}
@media (orientation:landscape) and (min-width:680px){
  html.r40r67b13 #pack145ComboOverlay .p145-cols{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    gap:8px!important;
  }
}
@media (orientation:landscape) and (max-height:620px){
  html.r40r67b13 #pack145ComboOverlay .p145-head{padding:5px 8px 4px 14px!important;}
  html.r40r67b13 #pack145ComboOverlay .p145-title{font-size:13px!important;}
  html.r40r67b13 #pack145ComboOverlay .p145-sub,
  html.r40r67b13 #pack145ComboOverlay .p145-tip{display:none!important;}
  html.r40r67b13 #pack145ComboOverlay .p145-body{padding:5px 8px 8px 12px!important;}
  html.r40r67b13 #pack145ComboOverlay .p145-col{padding:5px!important;}
  html.r40r67b13 #pack145ComboOverlay .p145-coltitle{font-size:10px!important;margin-bottom:4px!important;}
  html.r40r67b13 #pack145ComboOverlay .p145-combo{
    grid-template-columns:minmax(92px,1.05fr) minmax(92px,.9fr) 48px!important;
    gap:5px!important;
    margin-bottom:4px!important;
    padding:4px 6px!important;
  }
  html.r40r67b13 #pack145ComboOverlay .p145-name{font-size:10px!important;}
  html.r40r67b13 #pack145ComboOverlay .p145-desc{font-size:8px!important;line-height:1.08!important;}
  html.r40r67b13 #pack145ComboOverlay .p145-seq{font-size:9.5px!important;}
  html.r40r67b13 #pack145ComboOverlay .p145-cost{font-size:8px!important;min-width:44px!important;padding:3px!important;}
  html.r40r67b13 #pack145ComboOverlay .p145-footer{font-size:8px!important;margin-top:4px!important;}
}

/* Mobile movement: replace the four separate arrows with a left-edge analog-style stick. */
html.r40r67b13 body.touch-ui-enabled.sk-scene-fight.sk-player-mode .mobile-left{
  left:calc(-10px + env(safe-area-inset-left))!important;
  bottom:calc(2px + env(safe-area-inset-bottom))!important;
  width:178px!important;
  height:178px!important;
  transform:scale(.86)!important;
  transform-origin:left bottom!important;
  opacity:.82!important;
  filter:none!important;
  justify-content:flex-start!important;
}
html.r40r67b13 body.touch-ui-enabled.sk-scene-fight.sk-player-mode .mobile-left .dpad{
  display:none!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
#b13MoveJoystick{
  position:relative;
  width:166px;
  height:166px;
  border-radius:50%;
  pointer-events:auto;
  touch-action:none;
  user-select:none;
  -webkit-user-select:none;
  background:
    radial-gradient(circle at 50% 50%,rgba(10,26,48,.34) 0 42%,rgba(2,8,18,.58) 43% 62%,rgba(20,35,58,.32) 63% 100%);
  border:2px solid rgba(250,204,21,.40);
  box-shadow:inset 0 0 22px rgba(0,0,0,.72),0 8px 24px rgba(0,0,0,.38),0 0 18px rgba(56,189,248,.12);
  backdrop-filter:blur(3px);
  -webkit-backdrop-filter:blur(3px);
}
#b13MoveJoystick::before,
#b13MoveJoystick::after{
  content:'';
  position:absolute;
  pointer-events:none;
  opacity:.23;
  background:rgba(186,230,253,.72);
}
#b13MoveJoystick::before{left:50%;top:18px;bottom:18px;width:1px;}
#b13MoveJoystick::after{top:50%;left:18px;right:18px;height:1px;}
#b13MoveJoystick .b13-joystick-knob{
  position:absolute;
  left:50%;
  top:50%;
  width:76px;
  height:76px;
  margin:-38px 0 0 -38px;
  border-radius:50%;
  transform:translate3d(0,0,0);
  background:radial-gradient(circle at 36% 30%,rgba(255,255,255,.20),rgba(14,30,52,.86) 38%,rgba(2,8,18,.96) 100%);
  border:2px solid rgba(125,211,252,.58);
  box-shadow:inset 0 0 15px rgba(0,0,0,.58),0 7px 17px rgba(0,0,0,.50),0 0 13px rgba(56,189,248,.18);
  will-change:transform;
  pointer-events:none;
}
#b13MoveJoystick.b13-active{
  opacity:1!important;
  border-color:rgba(250,204,21,.72);
  box-shadow:inset 0 0 22px rgba(0,0,0,.72),0 8px 24px rgba(0,0,0,.42),0 0 24px rgba(250,204,21,.22);
}

/* Symbolic action controls; small key tags preserve combo readability. */
html.r40r67b13 body.touch-ui-enabled.sk-scene-fight.sk-player-mode .mobile-right{
  right:calc(-4px + env(safe-area-inset-right))!important;
  bottom:calc(4px + env(safe-area-inset-bottom))!important;
  width:300px!important;
  height:188px!important;
  transform:scale(.76)!important;
  transform-origin:right bottom!important;
  opacity:.84!important;
  filter:none!important;
}
html.r40r67b13 body.touch-ui-enabled.sk-scene-fight.sk-player-mode .mobile-right .touch-btn.b13-symbolic-action{
  position:relative!important;
  overflow:hidden!important;
  font-size:0!important;
  color:#f8fafc!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:4px!important;
  border-color:rgba(250,204,21,.47)!important;
  background:linear-gradient(180deg,rgba(15,23,42,.47),rgba(2,6,23,.58))!important;
}
html.r40r67b13 .b13-action-icon{
  display:block;
  width:34px;
  height:34px;
  color:rgba(248,250,252,.95);
  filter:drop-shadow(0 2px 3px rgba(0,0,0,.70));
  pointer-events:none;
}
html.r40r67b13 .attack-heavy .b13-action-icon{width:39px;height:39px;color:#ffd166;}
html.r40r67b13 .kick-heavy .b13-action-icon{width:38px;height:38px;color:#ffb454;}
html.r40r67b13 .block-btn .b13-action-icon{width:42px;height:42px;color:#8dd8ff;}
html.r40r67b13 .special-btn .b13-action-icon{width:44px;height:44px;color:#fff0a8;}
html.r40r67b13 .b13-key-tag{
  position:absolute;
  right:5px;
  bottom:3px;
  min-width:15px;
  height:15px;
  padding:0 3px;
  border-radius:5px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:rgba(226,232,240,.82);
  background:rgba(0,0,0,.36);
  border:1px solid rgba(255,255,255,.13);
  font:900 9px/1 Arial,Helvetica,sans-serif;
  pointer-events:none;
}
html.r40r67b13 body.touch-ui-enabled.sk-scene-fight.sk-player-mode .block-btn{
  min-height:108px!important;
  background:linear-gradient(180deg,rgba(17,67,132,.62),rgba(2,15,38,.68))!important;
}
html.r40r67b13 body.touch-ui-enabled.sk-scene-fight.sk-player-mode .special-btn{
  font-size:0!important;
  background:linear-gradient(180deg,rgba(185,28,28,.70),rgba(69,10,10,.76))!important;
}
html.r40r67b13 body.touch-ui-enabled.sk-scene-fight.sk-player-mode .touch-btn.b13-symbolic-action:active,
html.r40r67b13 body.touch-ui-enabled.sk-scene-fight.sk-player-mode .touch-btn.b13-symbolic-action.active{
  filter:brightness(1.24)!important;
  opacity:1!important;
  transform:scale(.94)!important;
}

@media (max-height:470px){
  html.r40r67b13 body.touch-ui-enabled.sk-scene-fight.sk-player-mode .mobile-left{transform:scale(.74)!important;}
  html.r40r67b13 body.touch-ui-enabled.sk-scene-fight.sk-player-mode .mobile-right{transform:scale(.68)!important;}
}