/* BRONC3 V23 - compact menu and mobile controls, desktop combat layout untouched */
#vloTower{display:none!important}
.vlo-more-shortcuts{display:none!important}
.vlo-more-tile{min-width:0;width:100%;padding:8px 2px 7px;background:linear-gradient(#304838,#162820);border:1px solid #977a48;border-radius:10px;color:#f2dea5;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;cursor:pointer;box-sizing:border-box}
.vlo-more-icon{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;font-size:25px;line-height:1;background:#435c47;color:#f0d48e}
.vlo-more-tile small{font:500 10px/1.25 system-ui,sans-serif;max-width:100%;white-space:nowrap}
body.vlo-moba-on #battle{isolation:isolate}
body.vlo-moba-on #vloMobaJoy{width:var(--vlo22-joy,100px)!important;height:var(--vlo22-joy,100px)!important;left:8px!important;bottom:calc(8px + env(safe-area-inset-bottom,0px))!important;z-index:112!important}
body.vlo-moba-on #pad{width:205px!important;height:178px!important;right:6px!important;bottom:calc(8px + env(safe-area-inset-bottom,0px))!important;transform:scale(var(--vlo22-scale,1))!important;transform-origin:bottom right!important;z-index:113!important}
body.vlo-moba-on #vloRecoveryActions{left:8px!important;right:auto!important;top:9px!important;bottom:auto!important;max-width:56px!important;display:flex!important;flex-direction:column!important;z-index:115!important}
body.vlo-moba-on #vloRecoveryActions #vloQG{position:relative!important;margin:0!important;width:44px!important;height:44px!important}
body.vlo-moba-on #vlo-mp-status{bottom:auto!important;top:8px!important;left:auto!important;right:7px!important;max-width:32vw!important}
body.vlo-moba-on #townBar{max-width:100%!important;overflow-x:auto!important}
body.vlo-moba-on #topCtl{top:58px!important;right:6px!important;left:auto!important;max-width:calc(100% - 75px)!important}
@media(max-width:350px){body.vlo-moba-on #vloRecoveryActions{top:54px!important}body.vlo-moba-on #topCtl{top:106px!important}}
@media(orientation:landscape) and (max-height:520px){body.vlo-moba-on #vloRecoveryActions{top:5px!important;bottom:auto!important}body.vlo-moba-on #topCtl{top:8px!important;right:60px!important}body.vlo-moba-on #pad{bottom:3px!important}body.vlo-moba-on #vloMobaJoy{bottom:3px!important}}

/* V23: same icon bar shown at the lower right on PC and mobile. */
#u20menu #vloDockTower{position:relative!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;box-sizing:border-box!important;min-width:0!important;padding:1px!important;gap:0!important;background-image:none!important;overflow:hidden!important;color:#f7d48c!important;cursor:pointer!important;}
#u20menu #vloDockTower .vlo-dock-tower-icon{display:block;font:bold 22px/1 sans-serif;color:#f4d48d;text-shadow:0 1px 2px #000;pointer-events:none}
#u20menu #vloDockTower small{display:block;max-width:100%;font:600 9px/1.05 Arial,sans-serif;white-space:nowrap;color:#f4d48d;pointer-events:none}
#u20menu #vloDockTower:focus-visible{outline:2px solid #f1d688;outline-offset:-2px}
#vloMoreTower{display:none!important}

/* BRONC3 V24: Mobile portrait/landscape collision-free HUD bands.
   Dock at bottom, combat band above dock, mode above joystick. PC untouched. */
@media (pointer:coarse), (any-pointer:coarse) {
 body.vlo-moba-on { --v24-dock-h:64px; --v24-joy:100px; --v24-combat-scale:1; }
 body.vlo-moba-on #u20menu{
  position:fixed!important;top:auto!important;left:4px!important;right:4px!important;
  bottom:calc(3px + env(safe-area-inset-bottom,0px))!important;
  max-width:calc(100vw - 8px)!important;width:max-content!important;min-width:0!important;
  display:flex!important;flex-wrap:nowrap!important;overflow-x:auto!important;overflow-y:hidden!important;
  scrollbar-width:thin;z-index:160!important;box-sizing:border-box!important;
  -webkit-overflow-scrolling:touch;touch-action:pan-x;
 }
 body.vlo-moba-on #u20menu .u20mi{flex:0 0 auto!important;min-width:32px!important;max-width:48px!important}
 body.vlo-moba-on #vloMobaJoy{
  position:fixed!important;left:10px!important;top:auto!important;right:auto!important;
  bottom:calc(var(--v24-dock-h) + 13px + env(safe-area-inset-bottom,0px))!important;
  width:var(--v24-joy)!important;height:var(--v24-joy)!important;
  transform:none!important;z-index:145!important;
 }
 body.vlo-moba-on #pad{
  position:fixed!important;left:auto!important;right:6px!important;top:auto!important;
  bottom:calc(var(--v24-dock-h) + 13px + env(safe-area-inset-bottom,0px))!important;
  width:205px!important;height:178px!important;
  transform:scale(var(--v24-combat-scale))!important;transform-origin:bottom right!important;
  z-index:146!important;
 }
 body.vlo-moba-on #modeSw{
  position:fixed!important;left:8px!important;right:auto!important;top:auto!important;
  bottom:calc(var(--v24-dock-h) + var(--v24-joy) + 24px + env(safe-area-inset-bottom,0px))!important;
  transform:none!important;z-index:147!important;max-width:136px!important;
 }
 body.vlo-moba-on #mswBtn{max-width:136px!important;font-size:11px!important;padding:6px 7px!important;min-height:32px!important;white-space:nowrap!important}
 body.vlo-moba-on #mswMenu{max-height:35vh!important;overflow-y:auto!important;max-width:190px!important}
 body.vlo-moba-on #vloRecoveryActions{
  position:fixed!important;left:auto!important;right:10px!important;top:auto!important;
  bottom:calc(var(--v24-dock-h) + 204px + env(safe-area-inset-bottom,0px))!important;
  z-index:147!important;display:flex!important;max-width:65px!important;pointer-events:none!important;
 }
 body.vlo-moba-on #vloRecoveryActions #vloQG{pointer-events:auto!important;width:48px!important;height:48px!important;position:relative!important}
 body.vlo-moba-on #topCtl{
  position:fixed!important;left:8px!important;right:auto!important;top:calc(88px + env(safe-area-inset-top,0px))!important;
  bottom:auto!important;transform:none!important;max-width:calc(100vw - 18px)!important;
  z-index:139!important;display:flex!important;flex-wrap:wrap!important;gap:5px!important;
 }
 body.vlo-moba-on #topCtl .chip{font-size:11px!important;min-height:30px!important;padding:4px 6px!important}
 body.vlo-moba-on #vlo-mp-status{position:fixed!important;top:calc(48px + env(safe-area-inset-top,0px))!important;right:8px!important;bottom:auto!important;max-width:27vw!important}
 body.vlo-moba-on #townBar{max-width:100vw!important;overflow-x:auto!important}
}
@media (pointer:coarse) and (max-width:390px), (any-pointer:coarse) and (max-width:390px){
 body.vlo-moba-on #u20menu .u20mi{max-width:42px!important}
 body.vlo-moba-on #modeSw{max-width:125px!important}
}
@media (orientation:landscape) and (max-height:540px) and (pointer:coarse), (orientation:landscape) and (max-height:540px) and (any-pointer:coarse){
 body.vlo-moba-on #u20menu{left:auto!important;right:4px!important;max-width:60vw!important}
 body.vlo-moba-on #modeSw{left:calc(var(--v24-joy) + 19px)!important;bottom:calc(var(--v24-dock-h) + 10px)!important}
 body.vlo-moba-on #topCtl{top:40px!important;left:8px!important}
 body.vlo-moba-on #vloRecoveryActions{bottom:calc(var(--v24-dock-h) + 155px)!important}
}


/* BRONC3 V25 - portrait uses top-right expansion instead of bottom dock; landscape refined. */
@media (pointer:coarse), (any-pointer:coarse) {
 body.vlo-moba-on.vlo-mobile-portrait #u20menu{
  display:none!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #vloMobaJoy{
  left:12px!important;
  bottom:calc(14px + env(safe-area-inset-bottom,0px))!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #modeSw{
  left:10px!important;
  bottom:calc(var(--v24-joy) + 26px + env(safe-area-inset-bottom,0px))!important;
  max-width:158px!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #pad{
  right:6px!important;
  bottom:calc(12px + env(safe-area-inset-bottom,0px))!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #vloRecoveryActions{
  right:8px!important;
  bottom:calc(186px + env(safe-area-inset-bottom,0px))!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #topCtl{
  left:10px!important;
  top:calc(96px + env(safe-area-inset-top,0px))!important;
  max-width:210px!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #topCtl .chip{
  min-height:28px!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #townBar,
 body.vlo-moba-on.vlo-mobile-portrait #taskTrack,
 body.vlo-moba-on.vlo-mobile-portrait #questTrack{
  max-width:46vw!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #miniMap,
 body.vlo-moba-on.vlo-mobile-portrait #mapUI{
  right:6px!important;
 }
 body.vlo-moba-on.vlo-mobile-landscape #u20menu{
  left:auto!important;
  right:6px!important;
  bottom:calc(3px + env(safe-area-inset-bottom,0px))!important;
  max-width:48vw!important;
 }
 body.vlo-moba-on.vlo-mobile-landscape #vloMobaJoy{
  left:10px!important;
  bottom:calc(10px + env(safe-area-inset-bottom,0px))!important;
 }
 body.vlo-moba-on.vlo-mobile-landscape #modeSw{
  left:calc(var(--v24-joy) + 20px)!important;
  bottom:calc(10px + env(safe-area-inset-bottom,0px))!important;
  max-width:150px!important;
 }
 body.vlo-moba-on.vlo-mobile-landscape #pad{
  right:8px!important;
  bottom:calc(var(--v24-dock-h) + 8px + env(safe-area-inset-bottom,0px))!important;
 }
 body.vlo-moba-on.vlo-mobile-landscape #vloRecoveryActions{
  right:8px!important;
  bottom:calc(var(--v24-dock-h) + 148px + env(safe-area-inset-bottom,0px))!important;
 }
 body.vlo-moba-on.vlo-mobile-landscape #topCtl{
  left:8px!important;
  top:calc(42px + env(safe-area-inset-top,0px))!important;
  max-width:190px!important;
 }
}
@media (orientation:portrait) and (pointer:coarse), (orientation:portrait) and (any-pointer:coarse) {
 body.vlo-moba-on #u20menu{display:none!important}
}

/* V26 stabilization: do not add a second bottom function dock on any mobile orientation. */
@media (pointer:coarse), (any-pointer:coarse) {
 body.vlo-moba-on #u20menu{display:none!important}
 body.vlo-moba-on #pad{z-index:146!important;pointer-events:auto!important}
 body.vlo-moba-on #vloMobaJoy{z-index:145!important;touch-action:none!important}
 body.vlo-moba-on #modeSw{z-index:147!important;max-width:145px!important}
 body.vlo-moba-on #topCtl{z-index:139!important}
 body.vlo-moba-on #vloRecoveryActions{z-index:147!important}
}
@media (orientation:landscape) and (max-height:550px) and (pointer:coarse), (orientation:landscape) and (max-height:550px) and (any-pointer:coarse){
 body.vlo-moba-on #pad{bottom:calc(8px + env(safe-area-inset-bottom,0px))!important;right:8px!important}
 body.vlo-moba-on #vloMobaJoy{bottom:calc(9px + env(safe-area-inset-bottom,0px))!important;left:10px!important}
 body.vlo-moba-on #modeSw{left:calc(var(--v24-joy) + 17px)!important;bottom:calc(10px + env(safe-area-inset-bottom,0px))!important}
 body.vlo-moba-on #vloRecoveryActions{bottom:calc(160px + env(safe-area-inset-bottom,0px))!important;right:7px!important}
}


/* BRONC3 V27 - mobile portrait pass 1 per user request */
@media (orientation:portrait) and (pointer:coarse), (orientation:portrait) and (any-pointer:coarse){
 body.vlo-moba-on.vlo-mobile-portrait #topCtl{
  left:12px!important;
  right:auto!important;
  top:auto!important;
  bottom:calc(var(--v24-joy) + 74px + env(safe-area-inset-bottom,0px))!important;
  max-width:190px!important;
  display:flex!important;
  flex-wrap:wrap!important;
  gap:6px!important;
  align-items:center!important;
  z-index:148!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #topCtl .chip,
 body.vlo-moba-on.vlo-mobile-portrait #topCtl button,
 body.vlo-moba-on.vlo-mobile-portrait #topCtl a{
  min-height:32px!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #modeSw{
  left:12px!important;
  right:auto!important;
  top:auto!important;
  bottom:calc(var(--v24-joy) + 20px + env(safe-area-inset-bottom,0px))!important;
  max-width:166px!important;
  z-index:147!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #vlo-mp-status{
  position:fixed!important;
  right:8px!important;
  left:auto!important;
  top:50%!important;
  bottom:auto!important;
  transform:translateY(-50%)!important;
  max-width:none!important;
  z-index:150!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #pad{
  right:8px!important;
  bottom:calc(10px + env(safe-area-inset-bottom,0px))!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitMountSlot{
  position:absolute!important;
  left:6px!important;
  bottom:8px!important;
  width:60px!important;
  height:60px!important;
  z-index:5!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  pointer-events:none!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitMountSlot .vlo-portrait-mount-btn{
  pointer-events:auto!important;
  width:60px!important;
  height:60px!important;
  border-radius:50%!important;
  border:2px solid #b08a4c!important;
  background:radial-gradient(circle at 35% 30%, #28493f 0%, #102720 68%, #081510 100%)!important;
  color:#f2d690!important;
  font:700 10px/1.12 Arial,sans-serif!important;
  text-align:center!important;
  padding:6px 4px!important;
  box-shadow:0 0 0 1px rgba(0,0,0,.65), inset 0 0 0 1px rgba(255,225,150,.18)!important;
  white-space:normal!important;
  overflow:hidden!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #topCtl .vlo-portrait-mount-btn{display:none!important}
}


/* BRONC3 V28 - horse icon button for mobile portrait */
@media (orientation:portrait) and (pointer:coarse), (orientation:portrait) and (any-pointer:coarse){
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitMountSlot .vlo-portrait-mount-btn{
  font-size:0!important;
  line-height:0!important;
  color:transparent!important;
  text-indent:-9999px!important;
  position:relative!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitMountSlot .vlo-portrait-mount-btn::before{
  content:'🐎';
  position:absolute!important;
  inset:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  font-size:30px!important;
  line-height:1!important;
  text-indent:0!important;
  color:#f3d58f!important;
  text-shadow:0 1px 2px rgba(0,0,0,.75)!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitMountSlot .vlo-portrait-mount-btn[data-mount-state='down']::after{
  content:'ON';
  position:absolute!important;
  right:4px!important;
  bottom:4px!important;
  min-width:18px!important;
  height:12px!important;
  padding:0 3px!important;
  border-radius:8px!important;
  background:rgba(15,38,30,.92)!important;
  border:1px solid #b08a4c!important;
  color:#f2d690!important;
  font:700 8px/12px Arial,sans-serif!important;
  text-indent:0!important;
  letter-spacing:.2px!important;
 }
}

/* V28 placement correction: horse button ABOVE qinggong on portrait mobile.
   Slot is mounted on body so the scaled #pad cannot shift it. */
@media (orientation:portrait) and (pointer:coarse), (orientation:portrait) and (any-pointer:coarse) {
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitMountSlot {
  position:fixed!important;
  left:auto!important;
  right:8px!important;
  top:auto!important;
  bottom:calc(246px + env(safe-area-inset-bottom,0px))!important;
  width:60px!important;
  height:60px!important;
  z-index:151!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  pointer-events:none!important;
  transform:none!important;
 }
}

/* BRONC3 V29 - portrait mobile combat cluster refined like MOBA controls.
   Goal: right-side combat buttons look more uniform (Liên Quân feel), with clear big attack
   button and evenly sized skill buttons. Desktop and landscape untouched. */
@media (orientation:portrait) and (pointer:coarse), (orientation:portrait) and (any-pointer:coarse){
 body.vlo-moba-on.vlo-mobile-portrait #pad{
  position:fixed!important;
  right:8px!important;
  bottom:calc(8px + env(safe-area-inset-bottom,0px))!important;
  width:232px!important;
  height:228px!important;
  transform:none!important;
  z-index:146!important;
  pointer-events:none!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #pad .hb{
  position:absolute!important;
  inset:auto!important;
  margin:0!important;
  padding:0!important;
  pointer-events:none!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #pad .hb:first-child{
  left:10px!important;
  bottom:4px!important;
  width:48px!important;
  display:flex!important;
  flex-direction:column!important;
  gap:8px!important;
  align-items:center!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #pad .hb:nth-child(2){
  right:2px!important;
  bottom:0!important;
  width:86px!important;
  height:86px!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #pad .hb:nth-child(3){
  right:2px!important;
  bottom:0!important;
  width:170px!important;
  height:170px!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #pad .pbtn{
  position:absolute!important;
  margin:0!important;
  pointer-events:auto!important;
  border-radius:50%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
  box-shadow:0 0 0 1px rgba(0,0,0,.6), 0 3px 8px rgba(0,0,0,.35), inset 0 0 0 1px rgba(255,226,160,.12)!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #pad #bMain{
  width:82px!important;
  height:82px!important;
  right:0!important;
  bottom:0!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #pad .sk{
  width:58px!important;
  height:58px!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #pad .hb:nth-child(3) .sk[data-i="0"]{
  right:98px!important;
  bottom:22px!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #pad .hb:nth-child(3) .sk[data-i="1"]{
  right:62px!important;
  bottom:96px!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #pad .hb:nth-child(3) .sk[data-i="2"]{
  right:0!important;
  bottom:110px!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #pad .hb:nth-child(3) .sk[data-i="3"]{
  right:110px!important;
  bottom:96px!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #pad .pot{
  position:relative!important;
  width:46px!important;
  height:46px!important;
  inset:auto!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #pad .pot.tp{
  width:50px!important;
  height:50px!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #pad .pbtn i{
  width:70%!important;
  height:70%!important;
  background-size:contain!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #pad #bMain i{
  width:78%!important;
  height:78%!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #pad .sk i{
  width:72%!important;
  height:72%!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #pad .pbtn b,
 body.vlo-moba-on.vlo-mobile-portrait #pad .pbtn u{
  position:absolute!important;
  right:3px!important;
  bottom:2px!important;
  min-width:14px!important;
  height:14px!important;
  padding:0 3px!important;
  border-radius:8px!important;
  font:700 8px/14px Arial,sans-serif!important;
  text-align:center!important;
  color:#f2d690!important;
  background:rgba(10,20,18,.88)!important;
  box-shadow:0 0 0 1px rgba(0,0,0,.55)!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #pad .pbtn .pk{
  top:1px!important;
  right:2px!important;
  width:14px!important;
  height:14px!important;
  border-radius:50%!important;
  font:700 10px/14px Arial,sans-serif!important;
  background:rgba(10,20,18,.82)!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #pad .pbtn em{
  left:50%!important;
  bottom:3px!important;
  transform:translateX(-50%)!important;
  max-width:80%!important;
  font-size:8px!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #pad .pbtn .cd{
  border-radius:50%!important;
 }
}

/* BRONC3 V30 - exact 10-button portrait layout based on user-supplied V29 JSON. */
@media (orientation:portrait) and (pointer:coarse), (orientation:portrait) and (any-pointer:coarse) {
 body.vlo-moba-on.vlo-mobile-portrait #pad {
  position:fixed!important;inset:0!important;width:100vw!important;height:100dvh!important;
  margin:0!important;padding:0!important;transform:none!important;overflow:visible!important;
  pointer-events:none!important;z-index:146!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #pad .hb {
  display:contents!important;pointer-events:none!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #pad .pbtn {
  position:fixed!important;right:auto!important;bottom:auto!important;
  margin:0!important;padding:0!important;border-radius:50%!important;
  transform:translate(-50%,-50%)!important;pointer-events:auto!important;
  box-sizing:border-box!important;touch-action:manipulation!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #pad #bMain {left:82.1vw!important;top:94.3dvh!important;width:82px!important;height:82px!important;}
 body.vlo-moba-on.vlo-mobile-portrait #pad .sk[data-i="0"] {left:59.4vw!important;top:96.5dvh!important;width:58px!important;height:58px!important;}
 body.vlo-moba-on.vlo-mobile-portrait #pad .sk[data-i="1"] {left:62.5vw!important;top:88.3dvh!important;width:58px!important;height:58px!important;}
 body.vlo-moba-on.vlo-mobile-portrait #pad .sk[data-i="2"] {left:92.2vw!important;top:85.5dvh!important;width:58px!important;height:58px!important;}
 body.vlo-moba-on.vlo-mobile-portrait #pad .sk[data-i="3"] {left:75.4vw!important;top:83.3dvh!important;width:58px!important;height:58px!important;}
 body.vlo-moba-on.vlo-mobile-portrait #pad #bHp {left:42.1vw!important;top:95.9dvh!important;width:45px!important;height:45px!important;}
 body.vlo-moba-on.vlo-mobile-portrait #pad #bMp {left:42.1vw!important;top:89.9dvh!important;width:45px!important;height:45px!important;}
 body.vlo-moba-on.vlo-mobile-portrait #pad #bTp {left:42.6vw!important;top:84dvh!important;width:45px!important;height:45px!important;}
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitMountSlot {position:fixed!important;left:91.7vw!important;top:69.4dvh!important;right:auto!important;bottom:auto!important;width:50px!important;height:50px!important;transform:translate(-50%,-50%)!important;z-index:151!important;}
 body.vlo-moba-on.vlo-mobile-portrait #vloRecoveryActions {position:fixed!important;left:91.5vw!important;top:77.3dvh!important;right:auto!important;bottom:auto!important;width:47px!important;height:47px!important;transform:translate(-50%,-50%)!important;z-index:151!important;}
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitMountSlot .vlo-portrait-mount-btn {width:50px!important;height:50px!important;}
 body.vlo-moba-on.vlo-mobile-portrait #vloRecoveryActions #vloQG {width:47px!important;height:47px!important;}
}

/* V31 - #pad is portaled to body on mobile portrait. Its positions must
   be viewport-rooted, not relative to a scaled/translated #battle. */
@media (orientation:portrait) and (pointer:coarse), (orientation:portrait) and (any-pointer:coarse) {
 body.vlo-moba-on.vlo-mobile-portrait > #pad {
  position:fixed!important; inset:0!important;
  width:100vw!important; height:100dvh!important;
  transform:none!important; overflow:visible!important;
  z-index:146!important; pointer-events:none!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait > #pad .hb {display:contents!important;}
}


/* BRONC3 V32: landscape-only fullscreen affordance; portrait and desktop untouched. */
#vloLandscapeFullscreen[hidden]{display:none!important}
#vloLandscapeFullscreen{display:none!important}
@media (orientation:landscape) and (pointer:coarse), (orientation:landscape) and (any-pointer:coarse){
 body.vlo-moba-on #vloLandscapeFullscreen:not([hidden]){
  display:flex!important;position:fixed!important;right:10px!important;
  top:calc(6px + env(safe-area-inset-top,0px))!important;
  z-index:180!important;align-items:center!important;justify-content:center!important;
  min-height:38px!important;padding:7px 12px!important;border-radius:20px!important;
  border:1px solid #c29f60!important;color:#ffecb4!important;
  background:rgba(18,40,31,.94)!important;font:600 12px/1.2 system-ui,sans-serif!important;
  box-shadow:0 2px 10px rgba(0,0,0,.45)!important;touch-action:manipulation!important;
 }
 body.vlo-moba-on:fullscreen,body.vlo-moba-on:-webkit-full-screen{
  width:100vw!important;height:100dvh!important;overflow:hidden!important;
 }
 body.vlo-moba-on.vlo-mobile-landscape #vloMobaJoy{left:calc(10px + env(safe-area-inset-left,0px))!important}
 body.vlo-moba-on.vlo-mobile-landscape #pad{right:calc(8px + env(safe-area-inset-right,0px))!important}
}


/* BRONC3 V33: LANDSCAPE MOBILE ONLY. Restore lower quick dock and keep quest
   tracking on the left, away from the minimap / action controls. */
@media (orientation:landscape) and (pointer:coarse), (orientation:landscape) and (any-pointer:coarse){
 body.vlo-moba-on.vlo-mobile-landscape #u20menu{
  display:flex!important;
  position:fixed!important;
  top:auto!important;
  bottom:calc(4px + env(safe-area-inset-bottom,0px))!important;
  left:50%!important;
  right:auto!important;
  transform:translateX(-50%)!important;
  width:max-content!important;
  min-width:0!important;
  max-width:min(45vw,430px)!important;
  max-height:52px!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  flex-wrap:nowrap!important;
  align-items:center!important;
  box-sizing:border-box!important;
  z-index:155!important;
  pointer-events:auto!important;
 }
 body.vlo-moba-on.vlo-mobile-landscape #u20menu .u20mi{
  flex:0 0 auto!important;
  min-width:30px!important;
  max-width:43px!important;
 }
 body.vlo-moba-on.vlo-mobile-landscape .vlo-v33-landscape-quest{
  position:fixed!important;
  top:calc(116px + env(safe-area-inset-top,0px))!important;
  left:calc(12px + env(safe-area-inset-left,0px))!important;
  right:auto!important;
  bottom:auto!important;
  max-width:min(260px,26vw)!important;
  width:clamp(155px,23vw,260px)!important;
  max-height:38vh!important;
  overflow-y:auto!important;
  z-index:143!important;
 }
}
@media (orientation:landscape) and (max-height:460px) and (pointer:coarse), (orientation:landscape) and (max-height:460px) and (any-pointer:coarse){
 body.vlo-moba-on.vlo-mobile-landscape .vlo-v33-landscape-quest{
  top:calc(78px + env(safe-area-inset-top,0px))!important;
  max-height:40vh!important;
 }
 body.vlo-moba-on.vlo-mobile-landscape #u20menu{max-height:42px!important}
}


/* BRONC3 V34 - exact quest-tracker fix for mobile landscape only.
   Tracker #u20trk is portaled to body to bypass the right UI container. */
@media (orientation:landscape) and (pointer:coarse), (orientation:landscape) and (any-pointer:coarse){
 body.vlo-moba-on.vlo-mobile-landscape > #u20trk.vlo-v34-landscape-quest{
  position:fixed!important;
  left:calc(12px + env(safe-area-inset-left,0px))!important;
  right:auto!important;
  top:calc(145px + env(safe-area-inset-top,0px))!important;
  bottom:auto!important;
  transform:none!important;
  box-sizing:border-box!important;
  width:min(245px,27vw)!important;
  max-width:min(245px,27vw)!important;
  min-width:145px!important;
  max-height:36vh!important;
  overflow:auto!important;
  z-index:153!important;
  margin:0!important;
 }
}
@media (orientation:landscape) and (max-height:440px) and (pointer:coarse), (orientation:landscape) and (max-height:440px) and (any-pointer:coarse){
 body.vlo-moba-on.vlo-mobile-landscape > #u20trk.vlo-v34-landscape-quest{
  top:calc(96px + env(safe-area-inset-top,0px))!important;
  max-height:36vh!important;
 }
}


/* BRONC3 V35: mobile portrait non-fullscreen shortcuts and world-chat area. */
#vloPortraitTowerTab,#vloPortraitChat{display:none!important}
@media (orientation:portrait) and (pointer:coarse), (orientation:portrait) and (any-pointer:coarse){
 body.vlo-moba-on.vlo-mobile-portrait #tabs #vloPortraitTowerTab{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  flex:0 0 auto!important;padding:4px 9px!important;font-size:11px!important;
  white-space:nowrap!important;color:#efd8a1!important;cursor:pointer!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #tabs{
  overflow-x:auto!important;flex-wrap:nowrap!important;-webkit-overflow-scrolling:touch;
 }
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitChat{
  display:flex!important;flex-direction:column!important;
  position:fixed!important;box-sizing:border-box!important;
  top:59.3dvh!important;bottom:auto!important;left:10px!important;
  width:min(63vw,268px)!important;height:min(18dvh,150px)!important;
  z-index:143!important;border:1px solid #967d4f!important;border-radius:6px!important;
  background:rgba(10,16,15,.84)!important;color:#e5ddc6!important;
  font:11px/1.4 Arial,sans-serif!important;overflow:hidden!important;
  pointer-events:auto!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitChat.collapsed{height:30px!important}
 body.vlo-moba-on.vlo-mobile-portrait .vlo-chat-head{display:flex;gap:4px;align-items:center;min-height:28px;padding:3px 6px;background:rgba(47,59,43,.95)}
 body.vlo-moba-on.vlo-mobile-portrait .vlo-chat-head strong{white-space:nowrap;font-size:11px}
 body.vlo-moba-on.vlo-mobile-portrait #vloChatState{font-size:9px;opacity:.76;flex:1;text-align:right}
 body.vlo-moba-on.vlo-mobile-portrait #vloChatCollapse{background:#334536;border:1px solid #917d50;border-radius:4px;color:#eed7a6;min-width:22px;min-height:22px}
 body.vlo-moba-on.vlo-mobile-portrait .vlo-chat-lines{flex:1;overflow-y:auto;padding:4px 7px;min-height:0}
 body.vlo-moba-on.vlo-mobile-portrait .vlo-chat-entry{margin-bottom:3px;overflow-wrap:anywhere}
 body.vlo-moba-on.vlo-mobile-portrait .vlo-chat-entry b{color:#e8c278}
 body.vlo-moba-on.vlo-mobile-portrait #vloMobileChatForm{display:flex;min-height:30px;border-top:1px solid #776640}
 body.vlo-moba-on.vlo-mobile-portrait #vloMobileChatText{flex:1;min-width:0;color:#eee;background:#141e1a;border:0;font-size:11px;padding:3px 6px}
 body.vlo-moba-on.vlo-mobile-portrait #vloMobileChatForm button{background:#465a3e;color:#e9d6a6;border:0;padding:4px 7px}
 body.vlo-moba-on.vlo-mobile-portrait #vloMobileChatForm button:disabled{opacity:.55}
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitChat.collapsed .vlo-chat-lines,
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitChat.collapsed #vloMobileChatForm{display:none!important}
}


/* BRONC3 V36: mobile-only interactive chat, modal zone, online close. */
#vloV36ChatLauncher{display:none!important}
#vloPortraitChat[hidden]{display:none!important}
@media (pointer:coarse),(any-pointer:coarse){
 body.vlo-moba-on #vloV36ChatLauncher{
  display:grid!important;position:fixed!important;place-items:center!important;
  left:calc(9px + env(safe-area-inset-left,0px))!important;
  top:57dvh!important;width:38px!important;height:38px!important;
  z-index:181!important;border-radius:50%!important;
  background:rgba(20,42,33,.95)!important;border:1px solid #c2a264!important;
  color:#f1d7a4!important;font-size:20px!important;box-shadow:0 2px 8px #0009!important;
  pointer-events:auto!important;touch-action:manipulation!important;
 }
 body.vlo-moba-on #vloPortraitChat:not([hidden]){
  display:flex!important;flex-direction:column!important;position:fixed!important;
  box-sizing:border-box!important;z-index:180!important;overflow:hidden!important;
  left:calc(10px + env(safe-area-inset-left,0px))!important;
  width:min(66vw,285px)!important;
  top:calc(57dvh - 160px)!important;height:min(28dvh,164px)!important;
  background:rgba(12,23,20,.95)!important;border:1px solid #ad8a51!important;
  border-radius:9px!important;color:#eee2c9!important;pointer-events:auto!important;
  font:11px/1.35 system-ui,sans-serif!important;
 }
 body.vlo-moba-on #vloPortraitChat .vlo-chat-head{display:flex!important;align-items:center!important;gap:6px!important;padding:4px 7px!important;min-height:30px!important;background:#344a38!important}
 body.vlo-moba-on #vloChatState{font-size:10px!important;flex:1!important;text-align:right!important}
 body.vlo-moba-on #vloChatCollapse{width:27px!important;height:25px!important;min-width:27px!important;background:#1f3328!important;color:#f8dfab!important;border:1px solid #aa8a52!important;border-radius:5px!important}
 body.vlo-moba-on #vloPortraitChat .vlo-chat-lines{flex:1!important;min-height:0!important;overflow:auto!important;padding:5px 7px!important}
 body.vlo-moba-on #vloMobileChatForm{display:flex!important;min-height:30px!important}
 body.vlo-moba-on #vloMobileChatText{flex:1!important;min-width:0!important;background:#16241d!important;color:#fff!important;border:0!important;padding:5px!important}
 body.vlo-moba-on #vloMobileChatForm button{background:#456044!important;color:#ffe0a0!important;border:0!important;padding:5px 9px!important}
 body.vlo-moba-on .vlo-v36-online-panel{position:relative!important;max-height:60dvh!important;overflow-y:auto!important}
 body.vlo-moba-on .vlo-v36-online-close{position:sticky!important;float:right!important;top:0!important;right:0!important;z-index:10!important;min-width:32px!important;min-height:32px!important;background:#3c4d3c!important;color:#ffe7b3!important;border:1px solid #aa8a52!important;border-radius:6px!important}
}
@media (orientation:portrait) and (pointer:coarse),(orientation:portrait) and (any-pointer:coarse){
 body.vlo-moba-on.vlo-mobile-portrait #vloV36ChatLauncher{top:57dvh!important}
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitChat:not([hidden]){
  top:calc(57dvh - 176px)!important;height:min(25dvh,169px)!important;
  width:min(69vw,275px)!important;
 }
 /* Modal actions share a central upper pane, away from portrait combat HUD. */
 body.vlo-moba-on.vlo-mobile-portrait #modal:not(.hidden) .mbox{
  position:relative!important;width:min(92vw,560px)!important;
  max-height:55dvh!important;overflow:auto!important;margin:auto!important;
 }
}
@media (orientation:landscape) and (pointer:coarse),(orientation:landscape) and (any-pointer:coarse){
 body.vlo-moba-on.vlo-mobile-landscape #vloV36ChatLauncher{
  top:calc(66px + env(safe-area-inset-top,0px))!important;
  left:calc(8px + env(safe-area-inset-left,0px))!important;
  width:35px!important;height:35px!important;
 }
 body.vlo-moba-on.vlo-mobile-landscape #vloPortraitChat:not([hidden]){
  left:calc(8px + env(safe-area-inset-left,0px))!important;
  top:calc(105px + env(safe-area-inset-top,0px))!important;
  width:min(34vw,300px)!important;
  height:min(44dvh,175px)!important;
 }
 /* Combat pad moved to viewport root by JS: no scaled ancestors. */
 body.vlo-moba-on.vlo-mobile-landscape > #pad{
  position:fixed!important;inset:0!important;width:100vw!important;height:100dvh!important;
  transform:none!important;z-index:146!important;overflow:visible!important;
  pointer-events:none!important;
 }
 body.vlo-moba-on.vlo-mobile-landscape > #pad .hb{display:contents!important;pointer-events:none!important}
 body.vlo-moba-on.vlo-mobile-landscape > #pad .pbtn{
  position:fixed!important;left:auto!important;top:auto!important;margin:0!important;
  transform:none!important;pointer-events:auto!important;box-sizing:border-box!important;
  border-radius:50%!important;touch-action:manipulation!important;
 }
 body.vlo-moba-on.vlo-mobile-landscape #pad #bMain{right:calc(12px + env(safe-area-inset-right,0px))!important;bottom:calc(12px + env(safe-area-inset-bottom,0px))!important;width:clamp(54px,16dvh,74px)!important;height:clamp(54px,16dvh,74px)!important}
 body.vlo-moba-on.vlo-mobile-landscape #pad .sk{width:clamp(37px,11dvh,48px)!important;height:clamp(37px,11dvh,48px)!important}
 body.vlo-moba-on.vlo-mobile-landscape #pad .sk[data-i="0"]{right:calc(174px + env(safe-area-inset-right,0px))!important;bottom:calc(10px + env(safe-area-inset-bottom,0px))!important}
 body.vlo-moba-on.vlo-mobile-landscape #pad .sk[data-i="1"]{right:calc(174px + env(safe-area-inset-right,0px))!important;bottom:calc(61px + env(safe-area-inset-bottom,0px))!important}
 body.vlo-moba-on.vlo-mobile-landscape #pad .sk[data-i="2"]{right:calc(121px + env(safe-area-inset-right,0px))!important;bottom:calc(90px + env(safe-area-inset-bottom,0px))!important}
 body.vlo-moba-on.vlo-mobile-landscape #pad .sk[data-i="3"]{right:calc(68px + env(safe-area-inset-right,0px))!important;bottom:calc(100px + env(safe-area-inset-bottom,0px))!important}
 body.vlo-moba-on.vlo-mobile-landscape #pad .pot{width:34px!important;height:34px!important}
 body.vlo-moba-on.vlo-mobile-landscape #pad #bHp{right:calc(244px + env(safe-area-inset-right,0px))!important;bottom:calc(12px + env(safe-area-inset-bottom,0px))!important}
 body.vlo-moba-on.vlo-mobile-landscape #pad #bMp{right:calc(244px + env(safe-area-inset-right,0px))!important;bottom:calc(53px + env(safe-area-inset-bottom,0px))!important}
 body.vlo-moba-on.vlo-mobile-landscape #pad #bTp{right:calc(244px + env(safe-area-inset-right,0px))!important;bottom:calc(94px + env(safe-area-inset-bottom,0px))!important}
 body.vlo-moba-on.vlo-mobile-landscape #vloRecoveryActions{
  position:fixed!important;right:calc(16px + env(safe-area-inset-right,0px))!important;
  left:auto!important;top:calc(97px + env(safe-area-inset-top,0px))!important;
  bottom:auto!important;max-width:43px!important;z-index:149!important;
 }
 body.vlo-moba-on.vlo-mobile-landscape #vloRecoveryActions #vloQG{width:40px!important;height:40px!important}
 body.vlo-moba-on.vlo-mobile-landscape #topCtl{max-width:30vw!important}
}

/* BRONC3 WORLD CHAT DESKTOP (mobile reuses V36 chat shell) */
#vlo-cloud-chat-launch,#vlo-cloud-chat-desktop{display:none}
@media (pointer:fine) and (min-width:700px){
 #vlo-cloud-chat-launch{display:block;position:fixed;left:12px;bottom:85px;z-index:280;border:1px solid #b3a16b;border-radius:50%;background:#23392c;color:#fff;width:44px;height:44px;cursor:pointer}
 #vlo-cloud-chat-desktop:not([hidden]){display:flex;position:fixed;left:12px;bottom:135px;z-index:280;flex-direction:column;width:min(340px,90vw);height:280px;background:#1a2921;color:#fff;border:1px solid #ad935a;border-radius:8px;overflow:hidden}
 #vlo-cloud-chat-desktop header{display:flex;justify-content:space-between;background:#2b4835;padding:7px}
 #vlo-cloud-chat-log{flex:1;overflow:auto;padding:7px;font-size:13px}
 #vlo-cloud-chat-form{display:flex;gap:4px;padding:6px}
 #vlo-cloud-chat-form input{flex:1;min-width:0}
}

/* BRONC3 VLO WORLD CHAT V2: tabs, unread and system channel. */
.vlo-chat-channels{display:flex!important;flex:0 0 auto;gap:3px;padding:3px 5px;background:#23392f;border-bottom:1px solid #72603c;z-index:2}
.vlo-chat-channels button{flex:1;min-height:25px;font:600 11px/1.2 system-ui,sans-serif;color:#d3c9a9;background:#31483b;border:1px solid transparent;border-radius:4px;cursor:pointer;touch-action:manipulation}
.vlo-chat-channels button.active{background:#5c5837;color:#fff0ba;border-color:#a99256}
.vlo-chat-system{color:#f1d9a2!important;overflow-wrap:anywhere;padding:3px 2px;border-bottom:1px solid #ffffff15;line-height:1.3}
.vlo-v2-unread:not([hidden]){position:absolute;top:-7px;right:-7px;display:grid;place-items:center;min-width:18px;height:18px;padding:0 3px;border-radius:14px;background:#b62c31;color:#fff;font:bold 10px/1 Arial;box-shadow:0 1px 4px #0009;pointer-events:none}
#vloMobileChatForm[hidden],#vlo-cloud-chat-form[hidden]{display:none!important}
body.vlo-moba-on #vloPortraitChat:not([hidden]){min-height:148px!important}
body.vlo-moba-on #vloV36ChatLauncher{overflow:visible!important}
#vlo-cloud-chat-launch{overflow:visible}
@media (orientation:landscape) and (pointer:coarse),(orientation:landscape) and (any-pointer:coarse){body.vlo-moba-on #vloPortraitChat:not([hidden]){height:min(51dvh,198px)!important;min-height:125px!important}}


/* BRONC3 VLO PC CHAT TABS V4: only desktop; original game system log remains intact. */
@media (min-width: 900px) and (pointer: fine) {
 body:not(.vlo-moba-on) #vlo-cloud-chat-desktop,
 body:not(.vlo-moba-on) #vlo-cloud-chat-launch {display:none!important;}
 body:not(.vlo-moba-on) #t-log {position:relative;min-width:0;}
 body:not(.vlo-moba-on) #vloPcChatTabs {display:flex;gap:3px;position:relative;z-index:5;align-items:center;margin:2px 0 5px;}
 body:not(.vlo-moba-on) #vloPcChatTabs button {border:1px solid #7b663c;border-radius:3px;background:#29372b;color:#ddd0a4;padding:4px 12px;font-size:12px;cursor:pointer;}
 body:not(.vlo-moba-on) #vloPcChatTabs button.active {background:#67592e;color:#ffe6a1;border-color:#c9ab62;}
 body:not(.vlo-moba-on) #vloPcWorldPane {display:none;flex-direction:column;min-height:120px;height:min(240px,32vh);background:rgba(12,25,18,.93);border:1px solid #5f6647;border-radius:4px;}
 body:not(.vlo-moba-on) #t-log.vlo-pc-world-selected #vloPcWorldPane {display:flex;}
 body:not(.vlo-moba-on) #t-log.vlo-pc-world-selected > :not(#vloPcChatTabs):not(#vloPcWorldPane) {display:none!important;}
 body:not(.vlo-moba-on) #vloPcWorldLog {flex:1;overflow:auto;overflow-wrap:anywhere;color:#e4e5d5;font-size:12px;padding:6px;}
 body:not(.vlo-moba-on) #vloPcWorldLog .vlo-pc-chat-entry {margin:0 0 3px;}
 body:not(.vlo-moba-on) #vloPcWorldLog b {color:#a4d6fa;}
 body:not(.vlo-moba-on) #vloPcWorldForm {display:flex;gap:3px;padding:4px;border-top:1px solid #646448;}
 body:not(.vlo-moba-on) #vloPcWorldInput {flex:1;min-width:0;background:#192a21;color:#fff;border:1px solid #87774a;font-size:12px;padding:5px;}
 body:not(.vlo-moba-on) #vloPcWorldForm button {background:#67592e;color:#fff0c2;border:1px solid #bba26b;cursor:pointer;}
 body:not(.vlo-moba-on) .vlo-pc-chat-error {color:#ffa7a7;}
}


/* BRONC3 VLO PC CHAT V5: compact single launcher, two tabs inside popover. */
@media (min-width:900px) and (pointer:fine){
 body:not(.vlo-moba-on) #t-log.vlo-pc-chat-v5-panel{
  position:fixed!important;left:12px!important;bottom:76px!important;top:auto!important;
  width:min(360px,calc(100vw - 24px))!important;height:min(310px,55vh)!important;
  max-width:calc(100vw - 24px)!important;max-height:55vh!important;
  z-index:290!important;background:rgba(12,24,18,.97)!important;
  border:1px solid #a89056!important;border-radius:8px!important;
  padding:0 6px 6px!important;box-sizing:border-box!important;
  overflow:auto!important;visibility:visible!important;opacity:1!important;
  pointer-events:auto!important;color:#f0e9d3!important;
 }
 body:not(.vlo-moba-on) #t-log.vlo-pc-chat-v5-panel.vlo-pc-chat-closed{
  display:none!important;visibility:hidden!important;pointer-events:none!important;
 }
 body:not(.vlo-moba-on) #vloPcChatV5Header{
  display:flex!important;align-items:center!important;justify-content:space-between!important;
  position:sticky!important;top:0!important;z-index:20!important;
  padding:6px 2px!important;background:#263e30!important;color:#f1dca6!important;
 }
 body:not(.vlo-moba-on) #vloPcChatV5Close{
  width:25px!important;height:25px!important;border:1px solid #9f8b57!important;
  border-radius:5px!important;color:#f1dca6!important;background:#1a3024!important;
  cursor:pointer!important;
 }
 body:not(.vlo-moba-on) #vloPcChatV5Launcher{
  position:fixed!important;left:12px!important;bottom:17px!important;
  z-index:291!important;display:grid!important;place-items:center!important;
  width:43px!important;height:43px!important;border:1px solid #b5a271!important;
  border-radius:50%!important;background:#263e31!important;color:#ffe7aa!important;
  font:24px/1 Arial,sans-serif!important;cursor:pointer!important;
  box-shadow:0 2px 9px #0009!important;
 }
 body:not(.vlo-moba-on) #vloPcChatV5Launcher.vlo-pc-chat-open{background:#516642!important}
 body:not(.vlo-moba-on) #tabs [data-t="log"],
 body:not(.vlo-moba-on) #vloChatMenuBtn{display:none!important}
 body:not(.vlo-moba-on) #t-log.vlo-pc-chat-v5-panel #vloPcChatTabs{flex:0 0 auto!important}
 body:not(.vlo-moba-on) #t-log.vlo-pc-chat-v5-panel #vloPcWorldPane{height:auto!important;min-height:160px!important;flex:1!important}
}
@media (max-width:899px), (pointer:coarse){#vloPcChatV5Launcher{display:none!important}}


/* BRONC3 PC CHAT V6: hide old fixed log AND legacy tabs until new launcher is activated. */
@media (min-width:900px) and (pointer:fine){
 body.vlo-pc-chat-v6-active #t-log.vlo-pc-chat-v6-panel{
  position:fixed!important;left:12px!important;bottom:72px!important;right:auto!important;top:auto!important;
  width:min(370px,calc(100vw - 24px))!important;height:min(320px,55vh)!important;
  z-index:900!important;box-sizing:border-box!important;overflow:auto!important;
  background:rgba(12,23,18,.97)!important;border:1px solid #ae955f!important;
  border-radius:8px!important;padding:4px 7px!important;color:#f4e5bd!important;
 }
 body.vlo-pc-chat-v6-active:not(.vlo-pc-chat-v6-open) #t-log.vlo-pc-chat-v6-panel{
  display:none!important;visibility:hidden!important;pointer-events:none!important;
 }
 body.vlo-pc-chat-v6-active.vlo-pc-chat-v6-open #t-log.vlo-pc-chat-v6-panel{
  display:block!important;visibility:visible!important;pointer-events:auto!important;
 }
 body.vlo-pc-chat-v6-active #vloPcChatV6Header{
  position:sticky!important;top:0!important;z-index:5!important;display:flex!important;
  justify-content:space-between!important;align-items:center!important;
  padding:5px!important;background:#203b2b!important;color:#f8dc99!important;
 }
 body.vlo-pc-chat-v6-active #vloPcChatV6Close{
  background:#183023!important;border:1px solid #ad955a!important;border-radius:4px!important;
  width:26px!important;height:26px!important;color:#ffdf9d!important;cursor:pointer!important;
 }
 body.vlo-pc-chat-v6-active #vloPcChatV6Launcher{
  display:grid!important;place-items:center!important;position:fixed!important;
  left:12px!important;bottom:14px!important;width:45px!important;height:45px!important;
  border-radius:50%!important;border:1px solid #d2b874!important;background:#243f32!important;
  color:#f7e6ba!important;font:23px Arial,sans-serif!important;cursor:pointer!important;
  z-index:901!important;pointer-events:auto!important;touch-action:manipulation!important;
 }
 body.vlo-pc-chat-v6-active #tabs [data-t="log"],
 body.vlo-pc-chat-v6-active #vloChatMenuBtn,
 body.vlo-pc-chat-v6-active #vloPcChatV5Launcher,
 body.vlo-pc-chat-v6-active #vlo-cloud-chat-launch,
 body.vlo-pc-chat-v6-active #vlo-cloud-chat-desktop{display:none!important}
}
@media (max-width:899px),(pointer:coarse){#vloPcChatV6Launcher{display:none!important}}
@media (min-width:900px) and (pointer:fine){
 body.vlo-pc-chat-v6-active #t-log.vlo-pc-world-selected > #vloPcChatV6Header{display:flex!important}
}


/* BRONC3 PC CHAT V7 - native battle notifications ONLY inside opened System tab */
@media (min-width:900px) and (pointer:fine){
 /* Hide the independent u20 log until it is moved inside the PC Chat panel. */
 body:not(.vlo-moba-on)>#u20log{display:none!important;visibility:hidden!important;pointer-events:none!important}
 body:not(.vlo-moba-on) #t-log #u20log.vlo-pc-chat-v7-syslog{
  display:block!important;position:relative!important;left:auto!important;right:auto!important;
  top:auto!important;bottom:auto!important;width:100%!important;max-width:100%!important;
  height:auto!important;min-height:0!important;max-height:none!important;z-index:auto!important;
  margin:0!important;padding:0!important;background:none!important;border:0!important;
  pointer-events:auto!important;transform:none!important;
 }
 body:not(.vlo-moba-on) #t-log #u20log.vlo-pc-chat-v7-syslog #u20ct{display:none!important}
 body:not(.vlo-moba-on) #t-log #u20log.vlo-pc-chat-v7-syslog #u20lines{
  display:block!important;max-height:245px!important;height:auto!important;overflow-y:auto!important;
  overflow-x:hidden!important;padding:5px 3px!important;background:transparent!important;
  color:#eee3c8!important;font-size:12px!important;line-height:1.5!important;
 }
 body:not(.vlo-moba-on) #t-log #u20log.vlo-pc-chat-v7-syslog #u20lines>div{
  white-space:normal!important;overflow-wrap:anywhere!important;text-overflow:clip!important;
 }
 body:not(.vlo-moba-on) #t-log.vlo-pc-world-selected #u20log.vlo-pc-chat-v7-syslog{
  display:none!important;
 }
 /* Native system stream replaces the old duplicated/empty pane when open. */
 body:not(.vlo-moba-on) #t-log.vlo-pc-chat-v6-panel:not(.vlo-pc-world-selected) #u20log.vlo-pc-chat-v7-syslog{
  display:block!important;
 }
}


/* BRONC3 Mobile Portrait UI V8: screenshot-matched Chat + Tower; no PC/landscape changes. */
#vloPortraitQuickActionsV8{display:none!important}
@media (orientation:portrait) and (pointer:coarse),(orientation:portrait) and (any-pointer:coarse){
 body.vlo-moba-on.vlo-mobile-portrait.vlo-portrait-ui-v8 #vloPortraitQuickActionsV8{
   display:flex!important;position:fixed!important;align-items:center!important;gap:9px!important;
   z-index:202!important;pointer-events:auto!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitQuickActionsV8>button{
   display:grid!important;place-items:center!important;position:relative!important;
   width:46px!important;height:46px!important;padding:0!important;
   font:26px/1 Arial,sans-serif!important;color:#f7dc99!important;
   background:linear-gradient(150deg,#2d382c,#101e18)!important;
   border:2px solid #aa9058!important;border-radius:6px!important;
   box-shadow:0 2px 8px #000a!important;cursor:pointer!important;
   touch-action:manipulation!important;pointer-events:auto!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitQuickActionsV8>button:active{
   background:#5a5531!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #vloV36ChatLauncher,
 body.vlo-moba-on.vlo-mobile-portrait #tabs #vloPortraitTowerTab,
 body.vlo-moba-on.vlo-mobile-portrait #vloDockTower {display:none!important;}
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitChat:not([hidden]){
   position:fixed!important;
   left:3vw!important;top:var(--vlo-v8-chat-top,29dvh)!important;
   right:auto!important;bottom:auto!important;
   width:79vw!important;max-width:430px!important;
   height:min(37dvh,390px)!important;min-height:210px!important;
   padding:0!important;display:flex!important;flex-direction:column!important;
   z-index:201!important;overflow:hidden!important;box-sizing:border-box!important;
   border:2px solid #dab66b!important;border-radius:10px!important;
   background:rgba(12,19,17,.96)!important;color:#f7e6c4!important;
   box-shadow:0 5px 25px #000c, inset 0 0 12px #9b77302b!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitChat .vlo-chat-head{
   display:flex!important;flex:0 0 42px!important;align-items:center!important;
   padding:5px 12px!important;gap:8px!important;
   background:linear-gradient(90deg,#20291f,#111915)!important;
   border-bottom:1px solid #8b774a!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitChat .vlo-chat-head strong{
   font:700 17px/1.2 system-ui,sans-serif!important;color:#f5d68f!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #vloChatState{
   font-size:9px!important;color:#b9c2b2!important;
   max-width:35%!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #vloChatCollapse{
   flex:0 0 31px!important;width:31px!important;height:30px!important;
   font-size:20px!important;border:1px solid #b79c60!important;
   color:#f8dda0!important;background:#172019!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitChat .vlo-chat-channels{
   display:flex!important;flex:0 0 38px!important;gap:5px!important;
   padding:5px 10px!important;background:transparent!important;
   border-bottom:1px solid #5f523b!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitChat .vlo-chat-channels button{
   display:block!important;min-height:29px!important;border-radius:5px!important;
   background:#1e211f!important;border:1px solid #615c4d!important;
   color:#dad3bf!important;font-size:12px!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitChat .vlo-chat-channels button.active{
   background:linear-gradient(#86632a,#49381d)!important;
   border:1px solid #f0c16a!important;color:#fff0bb!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitChat #vloMobileChatLines{
   display:block!important;flex:1 1 auto!important;min-height:0!important;
   overflow-y:auto!important;overscroll-behavior:contain!important;
   padding:8px!important;font:12px/1.55 system-ui,sans-serif!important;
   background:rgba(7,15,13,.35)!important;color:#f1eee4!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitChat #vloMobileChatLines .vlo-chat-entry{
   padding:5px 2px!important;border-bottom:1px solid #ffffff19!important;
   overflow-wrap:anywhere!important;white-space:normal!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitChat #vloMobileChatForm:not([hidden]){
   display:flex!important;flex:0 0 44px!important;min-height:44px!important;
   gap:6px!important;padding:6px!important;box-sizing:border-box!important;
   border-top:1px solid #655537!important;background:#162019!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitChat #vloMobileChatText{
   flex:1!important;min-width:0!important;min-height:30px!important;
   font-size:12px!important;border:1px solid #665944!important;
   border-radius:5px!important;padding:4px 8px!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitChat #vloMobileChatForm button{
   border-radius:5px!important;background:linear-gradient(#937133,#5f481f)!important;
   border:1px solid #c9a665!important;color:#fff0bc!important;
   min-width:50px!important;font-weight:600!important;
 }
 /* Only when the portrait Tower quick action is used, constrain the existing modal's card. */
 body.vlo-moba-on.vlo-mobile-portrait.vlo-portrait-tower-v8-open #modal:not(.hidden){
   position:fixed!important;z-index:205!important;pointer-events:none!important;
   background:transparent!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait.vlo-portrait-tower-v8-open #modal:not(.hidden) .mbox{
   position:absolute!important;left:3vw!important;top:29dvh!important;
   margin:0!important;transform:none!important;pointer-events:auto!important;
   width:min(79vw,430px)!important;max-height:42dvh!important;overflow-y:auto!important;
   border:2px solid #dab66b!important;border-radius:9px!important;
 }
}



/* BRONC3 V12 - replaced V9/V10/V11 layout with one genuine flex portrait.
   Original #pad/#tabs remain live DOM nodes under #app; no viewport portals.
   Non-portrait screens retain all their previous CSS. */
@media (orientation:portrait) and (pointer:coarse), (orientation:portrait) and (any-pointer:coarse) {
 body.vlo-moba-on.vlo-mobile-portrait{
  --v12-skills:clamp(48px,6.4dvh,66px);
  --v12-menu:clamp(60px,8.1dvh,73px);
  --v12-safe:env(safe-area-inset-bottom,0px);
 }
 body.vlo-moba-on.vlo-mobile-portrait #app{
  display:flex!important;flex-direction:column!important;
  position:relative!important;width:100vw!important;min-width:0!important;
  max-width:100vw!important;height:100dvh!important;min-height:0!important;
  max-height:100dvh!important;padding:0!important;margin:0!important;
  transform:none!important;zoom:1!important;overflow:hidden!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #top{
  position:relative!important;flex:0 0 auto!important;min-height:0!important;
  width:100%!important;max-width:100%!important;overflow:hidden!important;
  z-index:10!important;gap:clamp(2px,1vw,6px)!important;padding:5px 5px 4px!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #top .gold{
  white-space:nowrap!important;flex-wrap:nowrap!important;flex-shrink:1!important;
  font-size:clamp(10px,3vw,13px)!important;gap:3px!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #top .gold>*{white-space:nowrap!important;flex-shrink:0!important}
 body.vlo-moba-on.vlo-mobile-portrait #top .topmid{min-width:0!important;max-width:17vw!important}
 body.vlo-moba-on.vlo-mobile-portrait #top #heroName{display:block!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
 body.vlo-moba-on.vlo-mobile-portrait #top #stageLbl{display:none!important}
 body.vlo-moba-on.vlo-mobile-portrait #top #ktcBtn,
 body.vlo-moba-on.vlo-mobile-portrait #top #actBtn,
 body.vlo-moba-on.vlo-mobile-portrait #top #giftBtn,
 body.vlo-moba-on.vlo-mobile-portrait #top #compactBtn{flex:0 1 35px!important;min-width:30px!important;max-width:35px!important}
 body.vlo-moba-on.vlo-mobile-portrait #battle{
  position:relative!important;display:block!important;inset:auto!important;
  left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;
  flex:1 1 0%!important;min-width:0!important;min-height:0!important;
  width:100%!important;height:auto!important;max-height:none!important;
  padding:0!important;margin:0!important;transform:none!important;overflow:hidden!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #bg,
 body.vlo-moba-on.vlo-mobile-portrait #arena{position:absolute!important;inset:0!important;width:100%!important;height:100%!important}
 /* The default journal is hidden, but native function panels can open as overlays. */
 body.vlo-moba-on.vlo-mobile-portrait #panel{
  display:block!important;position:fixed!important;
  left:3vw!important;right:3vw!important;top:clamp(95px,13dvh,125px)!important;
  bottom:calc(var(--v12-menu) + var(--v12-skills) + var(--v12-safe) + 9px)!important;
  width:auto!important;height:auto!important;max-width:94vw!important;
  max-height:none!important;min-height:0!important;flex:none!important;
  overflow:auto!important;zoom:1!important;z-index:320!important;
  background:rgba(18,24,20,.98)!important;border:1px solid #ae925c!important;
  border-radius:8px!important;box-shadow:0 6px 24px #000b!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #panel.vlo-panel-closed{display:none!important}
 body.vlo-moba-on.vlo-mobile-portrait #panel .tab{height:100%!important;overflow-y:auto!important;padding:36px 8px 12px!important}
 body.vlo-moba-on.vlo-mobile-portrait #vloV12PanelClose{
  position:sticky!important;float:right!important;top:5px!important;right:5px!important;
  display:block!important;width:32px!important;height:30px!important;
  border:1px solid #bea56b!important;border-radius:5px!important;
  background:#25362b!important;color:#f6dfad!important;font:700 17px/1 Arial,sans-serif!important;
  z-index:9!important;touch-action:manipulation!important;
 }
 /* The only portrait combat bar, occupying normal flex-flow space above nav. */
 body.vlo-moba-on.vlo-mobile-portrait #app>#pad{
  display:grid!important;position:relative!important;
  inset:auto!important;top:auto!important;right:auto!important;bottom:auto!important;left:auto!important;
  flex:0 0 var(--v12-skills)!important;
  grid-template-columns:repeat(8,minmax(0,1fr))!important;
  grid-template-rows:minmax(0,1fr)!important;
  justify-items:stretch!important;align-items:stretch!important;
  width:100%!important;max-width:100%!important;height:var(--v12-skills)!important;
  max-height:var(--v12-skills)!important;min-height:0!important;
  gap:2px!important;padding:3px 4px!important;margin:0!important;
  background:linear-gradient(#26362b,#0d1912)!important;border:0!important;
  border-top:1px solid #a38a54!important;box-shadow:none!important;
  overflow:hidden!important;transform:none!important;transform-origin:center!important;
  box-sizing:border-box!important;z-index:230!important;pointer-events:none!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #app>#pad>.hb{
  display:contents!important;position:static!important;inset:auto!important;
  width:auto!important;height:auto!important;margin:0!important;padding:0!important;
  border:0!important;box-shadow:none!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #app>#pad .pbtn{
  display:block!important;position:relative!important;inset:auto!important;
  left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;
  grid-row:1!important;margin:0!important;padding:0!important;
  width:100%!important;max-width:none!important;min-width:0!important;
  height:100%!important;min-height:0!important;max-height:none!important;
  transform:none!important;zoom:1!important;transform-origin:center!important;
  border-radius:5px!important;border:1px solid #a99260!important;
  background:radial-gradient(circle at 40% 38%,#32483a,#111d16)!important;
  box-shadow:inset 0 0 0 1px #0009!important;
  overflow:hidden!important;visibility:visible!important;opacity:1!important;
  pointer-events:auto!important;touch-action:manipulation!important;box-sizing:border-box!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #app>#pad .pbtn i{
  position:absolute!important;inset:3px!important;width:auto!important;height:auto!important;
  max-width:none!important;max-height:none!important;
  background-position:center!important;background-repeat:no-repeat!important;background-size:contain!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #app>#pad #bMain{grid-column:4!important;grid-row:1!important;border:2px solid #e7cb84!important}
 body.vlo-moba-on.vlo-mobile-portrait #app>#pad #bHp{background:radial-gradient(#7f3429,#1b1410)!important}
 body.vlo-moba-on.vlo-mobile-portrait #app>#pad #bMp{background:radial-gradient(#3f628f,#141c2c)!important}
 body.vlo-moba-on.vlo-mobile-portrait #app>#pad #bTp{background:radial-gradient(#8a6b2c,#221d12)!important}
 body.vlo-moba-on.vlo-mobile-portrait #app>#pad #bHp{grid-column:1!important;grid-row:1!important}
 body.vlo-moba-on.vlo-mobile-portrait #app>#pad #bMp{grid-column:2!important;grid-row:1!important}
 body.vlo-moba-on.vlo-mobile-portrait #app>#pad #bTp{grid-column:3!important;grid-row:1!important}
 body.vlo-moba-on.vlo-mobile-portrait #app>#pad .sk[data-i="0"]{grid-column:5!important;grid-row:1!important}
 body.vlo-moba-on.vlo-mobile-portrait #app>#pad .sk[data-i="1"]{grid-column:6!important;grid-row:1!important}
 body.vlo-moba-on.vlo-mobile-portrait #app>#pad .sk[data-i="2"]{grid-column:7!important;grid-row:1!important}
 body.vlo-moba-on.vlo-mobile-portrait #app>#pad .sk[data-i="3"]{grid-column:8!important;grid-row:1!important}
 body.vlo-moba-on.vlo-mobile-portrait #app>#pad .pbtn b{
  display:block!important;position:absolute!important;left:2px!important;right:auto!important;
  bottom:1px!important;top:auto!important;z-index:3!important;
  font:700 clamp(9px,2.55vw,12px)/1 Arial,sans-serif!important;
  background:rgba(8,13,11,.82)!important;color:#fbe2a4!important;
  min-width:13px!important;border-radius:3px!important;padding:2px!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #app>#pad .pbtn .pk{right:0!important;top:0!important;left:auto!important;bottom:auto!important}
 /* One nav row; preserve all seven live features including mount. */
 body.vlo-moba-on.vlo-mobile-portrait #app>#tabs{
  display:flex!important;position:relative!important;inset:auto!important;
  left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;
  flex:0 0 calc(var(--v12-menu) + var(--v12-safe))!important;
  flex-direction:row!important;flex-wrap:nowrap!important;
  justify-content:space-between!important;align-items:stretch!important;
  gap:0!important;padding:2px 2px var(--v12-safe)!important;margin:0!important;
  width:100%!important;height:calc(var(--v12-menu) + var(--v12-safe))!important;
  max-width:100%!important;min-width:0!important;min-height:0!important;
  overflow:hidden!important;transform:none!important;zoom:1!important;
  background:linear-gradient(#403c2d,#181d16)!important;border-top:1px solid #a18e5b!important;
  box-sizing:border-box!important;z-index:231!important;touch-action:manipulation!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #app>#tabs>button{
  display:block!important;position:relative!important;
  flex:1 1 0!important;width:0!important;min-width:0!important;max-width:none!important;
  height:100%!important;min-height:0!important;max-height:none!important;
  padding:34px 1px 3px!important;margin:0!important;
  overflow:hidden!important;text-overflow:clip!important;
  font:500 clamp(8px,2.25vw,11px)/1.08 Arial,sans-serif!important;
  letter-spacing:-.25px!important;white-space:normal!important;text-align:center!important;
  color:#dfd6b8!important;word-break:normal!important;
  box-sizing:border-box!important;touch-action:manipulation!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #app>#tabs>button::before{
  position:absolute!important;left:50%!important;top:3px!important;
  width:29px!important;height:29px!important;margin-left:-14.5px!important;
  background-size:auto 100%!important;background-position:0 0!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #app>#tabs>button[data-t="log"],
 body.vlo-moba-on.vlo-mobile-portrait #app>#tabs>#vloChatMenuBtn,
 body.vlo-moba-on.vlo-mobile-portrait #app>#tabs>#vloPortraitTowerTab{display:none!important}
 body.vlo-moba-on.vlo-mobile-portrait #app>#tabs>button.on{color:#ffe4a3!important}
 /* No joystick; the native canvas tap-to-move remains available. */
 body.vlo-moba-on.vlo-mobile-portrait #vloMobaJoy,
 body.vlo-moba-on.vlo-mobile-portrait #joy,
 body.vlo-moba-on.vlo-mobile-portrait #joystick,
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitMountSlot,
 body.vlo-moba-on.vlo-mobile-portrait #vloRecoveryActions,
 body.vlo-moba-on.vlo-mobile-portrait #u20menu{display:none!important;pointer-events:none!important}
 body.vlo-moba-on.vlo-mobile-portrait #modeSw{
  position:fixed!important;left:8px!important;right:auto!important;
  top:clamp(148px,22dvh,185px)!important;bottom:auto!important;
  width:auto!important;max-width:min(49vw,205px)!important;
  transform:none!important;z-index:170!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #mswBtn{max-width:100%!important;min-height:33px!important;white-space:nowrap!important}
 body.vlo-moba-on.vlo-mobile-portrait #topCtl{
  position:fixed!important;left:auto!important;right:5px!important;
  top:clamp(107px,17dvh,138px)!important;bottom:auto!important;
  max-width:66vw!important;transform:none!important;
  display:flex!important;flex-wrap:nowrap!important;gap:4px!important;z-index:158!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #topCtl #rideBtn{display:none!important}
 body.vlo-moba-on.vlo-mobile-portrait #topCtl .chip{font-size:clamp(10px,2.8vw,12px)!important;min-height:30px!important;padding:4px!important}
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitQuickActionsV8{
  display:flex!important;position:fixed!important;gap:7px!important;z-index:210!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitQuickActionsV8>button{
  width:clamp(35px,10vw,41px)!important;height:clamp(35px,10vw,41px)!important;
  border-radius:5px!important;font-size:clamp(19px,5.4vw,23px)!important;
 }
 /* Critical: old portrait rules forced display:flex even while [hidden]. */
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitChat[hidden],
 body.vlo-moba-on.vlo-mobile-portrait #vlo-chat-window,
 body.vlo-moba-on.vlo-mobile-portrait #vlo-cloud-chat-desktop,
 body.vlo-moba-on.vlo-mobile-portrait #vloV36ChatLauncher{display:none!important;visibility:hidden!important;pointer-events:none!important}
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitChat:not([hidden]){
  display:flex!important;position:fixed!important;
  left:3vw!important;right:auto!important;bottom:auto!important;
  top:clamp(220px,var(--vlo-v8-chat-top,30dvh),43dvh)!important;
  width:min(91vw,420px)!important;height:min(40dvh,350px)!important;
  max-height:calc(100dvh - var(--v12-menu) - var(--v12-skills) - 235px)!important;
  min-height:155px!important;transform:none!important;
  box-sizing:border-box!important;overflow:hidden!important;z-index:310!important;
  border:2px solid #d9b66c!important;border-radius:9px!important;
  background:rgba(12,19,17,.98)!important;box-shadow:0 5px 25px #000b!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitChat .vlo-chat-head{
  flex:0 0 42px!important;min-height:42px!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitChat #vloMobileChatLines{flex:1 1 auto!important;min-height:0!important;overflow:auto!important}
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitChat #vloMobileChatForm:not([hidden]){
  display:flex!important;flex:0 0 44px!important;min-height:44px!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #vloPortraitChat #vloMobileChatForm[hidden]{display:none!important}
 body.vlo-moba-on.vlo-mobile-portrait #vlo-mp-status{
  position:fixed!important;left:auto!important;right:8px!important;
  top:auto!important;bottom:calc(var(--v12-skills) + var(--v12-menu) + var(--v12-safe) + 12px)!important;
  transform:none!important;z-index:275!important;min-width:57px!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #vlo-online-detail{
  position:fixed!important;left:auto!important;right:8px!important;top:auto!important;
  bottom:calc(var(--v12-skills) + var(--v12-menu) + var(--v12-safe) + 55px)!important;
  max-height:min(45dvh,320px)!important;max-width:min(300px,90vw)!important;
  z-index:9500!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait #modal:not(.hidden){position:fixed!important;z-index:500!important;pointer-events:auto!important;background:#000b!important}
 body.vlo-moba-on.vlo-mobile-portrait #modal:not(.hidden) .mbox{
  position:relative!important;left:auto!important;top:auto!important;right:auto!important;bottom:auto!important;
  transform:none!important;width:min(92vw,520px)!important;
  max-height:calc(100dvh - var(--v12-menu) - var(--v12-skills) - 40px)!important;
  margin:auto!important;overflow:auto!important;pointer-events:auto!important;
 }
 body.vlo-moba-on.vlo-mobile-portrait:has(#vloMobileChatText:focus) #vloPortraitChat:not([hidden]){
  top:clamp(95px,17dvh,185px)!important;
  max-height:calc(100dvh - 215px)!important;
 }
}
/* V12 Online list header works on PC, portrait, and landscape alike. */
#vlo-online-detail .vlo-v12-online-header{
 display:flex;position:sticky;top:-12px;z-index:1;align-items:center;justify-content:space-between;
 gap:8px;margin:-12px -12px 6px;padding:7px 8px 7px 12px;
 background:#23372d;border-bottom:1px solid #816d43;
}
#vlo-online-detail .vlo-v12-online-header strong{font-size:13px;color:#ffdf9c}
#vlo-online-detail .vlo-v12-online-close{
 flex:0 0 30px;display:grid;place-items:center;width:30px;height:30px;
 border:1px solid #b49c65;border-radius:5px;background:#263d30;
 color:#ffe1ab;font:bold 18px/1 Arial,sans-serif;cursor:pointer;
}
#vlo-online-detail .vlo-v12-online-note{font-size:11px;color:#d8c594}
#vlo-online-detail .vlo-v12-online-users{max-height:260px;overflow-y:auto}
#vlo-online-detail .vlo-v12-online-users>div{padding:3px;border-top:1px solid #ffffff1a}
@media(orientation:portrait) and (max-width:430px){
 body.vlo-moba-on.vlo-mobile-portrait #top .topmid{display:none!important}
 body.vlo-moba-on.vlo-mobile-portrait #top{gap:3px!important}
 body.vlo-moba-on.vlo-mobile-portrait #top .gold{min-width:0!important}
}


/* BRONC3 V12.2: portrait reconciliation after stale V10 portal/state. */
@media (orientation: portrait) and (pointer: coarse), (orientation: portrait) and (any-pointer: coarse) {
  body.vlo-moba-on.vlo-mobile-portrait #app > #pad {
    visibility:visible!important;opacity:1!important;
    content-visibility:visible!important;contain:none!important;
  }
  body.vlo-moba-on.vlo-mobile-portrait #app > #pad .pbtn {
    visibility:visible!important;opacity:1!important;
  }
  /* No old floating Chat menu / Tower tab: only the two quick icons under Luyện Công. */
  body.vlo-moba-on.vlo-mobile-portrait #vloPortraitTowerTab,
  body.vlo-moba-on.vlo-mobile-portrait #vloChatMenuBtn { display:none!important; }
  body.vlo-moba-on.vlo-mobile-portrait #vloPortraitChat[hidden] {display:none!important;}
  body.vlo-moba-on.vlo-mobile-portrait #app > #tabs > button:not([data-t="log"]):not(#vloChatMenuBtn):not(#vloPortraitTowerTab) {
    overflow:visible!important;
    text-overflow:clip!important;
    white-space:normal!important;
  }
}


/* BRONC3 V12.3 - portrait: keep toggle chips clear of the minimap;
   reuse the existing khinh cong button alongside Tower/Chat. */
@media (orientation:portrait) and (pointer:coarse),
       (orientation:portrait) and (any-pointer:coarse) {
  body.vlo-moba-on.vlo-mobile-portrait #topCtl {
    position:fixed!important;
    top:var(--vlo-v123-switch-top,calc(clamp(148px,22dvh,185px) + 102px))!important;
    left:8px!important;
    right:auto!important;
    bottom:auto!important;
    width:max-content!important;
    max-width:min(62vw,220px)!important;
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    gap:5px!important;
    z-index:169!important;
    transform:none!important;
    pointer-events:auto!important;
  }
  body.vlo-moba-on.vlo-mobile-portrait #topCtl #rotBtn,
  body.vlo-moba-on.vlo-mobile-portrait #topCtl #ctrlBtn {
    display:inline-flex!important;
    position:relative!important;
    inset:auto!important;
    left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;
    flex:0 0 auto!important;
    margin:0!important;
    padding:5px 6px!important;
    min-height:30px!important;
    max-width:none!important;
    width:auto!important;
    white-space:nowrap!important;
    text-align:center!important;
    align-items:center!important;
    justify-content:center!important;
    font:600 clamp(10px,2.8vw,12px)/1.2 Arial,sans-serif!important;
    transform:none!important;
    pointer-events:auto!important;
  }
  body.vlo-moba-on.vlo-mobile-portrait #vloPortraitQuickActionsV8 > #vloQG {
    display:grid!important;
    position:relative!important;
    inset:auto!important;
    align-items:center!important;
    justify-content:center!important;
    flex:none!important;
    width:clamp(35px,10vw,41px)!important;
    height:clamp(35px,10vw,41px)!important;
    max-width:none!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    font:700 24px/1 Arial,sans-serif!important;
    background:linear-gradient(150deg,#254738,#102720)!important;
    border:2px solid #bfa66e!important;
    border-radius:5px!important;
    box-shadow:0 2px 8px #000a!important;
    color:#f8e5b0!important;
    visibility:visible!important;
    opacity:1!important;
    pointer-events:auto!important;
    touch-action:manipulation!important;
  }
  body.vlo-moba-on.vlo-mobile-portrait #vloPortraitQuickActionsV8 > #vloQG span {
    display:block!important;
    font-size:23px!important;
    line-height:1!important;
    pointer-events:none!important;
  }
  body.vlo-moba-on.vlo-mobile-portrait #vloPortraitQuickActionsV8 > #vloQG:disabled {
    opacity:.5!important;
  }
}


/* BRONC3 V12.4 - mobile landscape mode switch must sit ABOVE the lower tab bar.
   The previous left/bottom placement put #mswBtn underneath #tabs. */
@media (orientation:landscape) and (pointer:coarse), (orientation:landscape) and (any-pointer:coarse) {
 body.vlo-moba-on.vlo-mobile-landscape #modeSw {
  position:fixed!important;
  top:auto!important;
  left:calc(var(--v24-joy,100px) + 18px)!important;
  right:auto!important;
  bottom:calc(var(--v24-joy,100px) + 17px + env(safe-area-inset-bottom,0px))!important;
  z-index:265!important;
  pointer-events:auto!important;
 }
 body.vlo-moba-on.vlo-mobile-landscape #mswBtn {
  min-height:32px!important;
  touch-action:manipulation!important;
 }
}