#pageScreen.commanderPage{
  position:fixed !important;
  inset:0 !important;
  display:block !important;
  overflow:hidden !important;
  z-index:120 !important;
  background:#050b12 !important;
}
#pageScreen.commanderPage .commander-page{
  position:absolute !important;
  inset:0 !important;
  display:block !important;
  overflow:hidden !important;
  background:radial-gradient(circle at 50% 22%, rgba(44,58,72,.25), rgba(5,11,18,.92) 72%) !important;
}
#pageScreen.commanderPage .commander-canvas{
  position:absolute !important;
  left:0 !important;
  top:0 !important;
  width:1280px !important;
  height:720px !important;
  overflow:hidden !important;
  transform-origin:0 0 !important;
  will-change:transform !important;
  background:#050b12 !important;
}
#pageScreen.commanderPage .commander-bg,
#pageScreen.commanderPage .commander-dim{
  display:none !important;
}
#pageScreen.commanderPage .commander-top{
  position:absolute !important;
  inset:0 0 auto 0 !important;
  height:68px !important;
  z-index:7 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  pointer-events:none !important;
}
#pageScreen.commanderPage .commander-back{
  position:absolute !important;
  left:18px !important;
  top:16px !important;
  width:42px !important;
  height:42px !important;
  border-radius:50% !important;
  pointer-events:auto !important;
}
#pageScreen.commanderPage .commander-title{
  font-size:24px !important;
  letter-spacing:.04em !important;
}
#pageScreen.commanderPage .commander-left{
  position:absolute !important;
  left:16px !important;
  top:92px !important;
  bottom:20px !important;
  width:86px !important;
  display:flex !important;
  flex-direction:column !important;
  gap:12px !important;
  align-items:center !important;
  overflow:auto !important;
  z-index:8 !important;
}
#pageScreen.commanderPage .commander-left::-webkit-scrollbar{display:none !important;}
#pageScreen.commanderPage .commander-center{
  position:absolute !important;
  inset:0 !important;
  z-index:1 !important;
  pointer-events:none !important;
}
#pageScreen.commanderPage .commander-stage{
  position:absolute !important;
  inset:0 !important;
  overflow:hidden !important;
  background:transparent !important;
  pointer-events:none !important;
}
#pageScreen.commanderPage .commander-stage::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg, rgba(7,12,18,.78) 0%, rgba(7,12,18,.18) 26%, rgba(7,12,18,.14) 74%, rgba(7,12,18,.70) 100%);
}
#pageScreen.commanderPage .commander-stage video,
#pageScreen.commanderPage .commander-stage > img{
  position:absolute !important;
  left:var(--cmd-video-left) !important;
  top:var(--cmd-video-top) !important;
  width:var(--cmd-video-width) !important;
  height:var(--cmd-video-height) !important;
  max-width:none !important;
  max-height:none !important;
  display:block !important;
  object-fit:cover !important;
  object-position:var(--cmd-video-object-x) var(--cmd-video-object-y) !important;
  transform:translate(-50%, -50%) scale(var(--cmd-video-scale)) !important;
  transform-origin:center center !important;
  opacity:var(--cmd-bg-video-opacity) !important;
  border-radius:0 !important;
  filter:none !important;
}
#pageScreen.commanderPage .commander-stage .stage-fallback{display:none !important;}
#pageScreen.commanderPage .commander-right{
  position:absolute !important;
  top:86px !important;
  right:76px !important;
  bottom:18px !important;
  width:296px !important;
  display:flex !important;
  flex-direction:column !important;
  z-index:9 !important;
  background:transparent !important;
}
#pageScreen.commanderPage #commanderPanel{
  position:relative !important;
  flex:1 1 auto !important;
  min-height:0 !important;
}
#pageScreen.commanderPage .commander-side-tabs{
  position:absolute !important;
  right:-60px !important;
  top:12px !important;
  display:flex !important;
  flex-direction:column !important;
  gap:10px !important;
  z-index:12 !important;
}
#pageScreen.commanderPage .commander-vtab{
  width:48px !important;
  min-height:76px !important;
  padding:8px 4px !important;
  border:none !important;
  background:transparent !important;
  color:#ebddb7 !important;
}
#pageScreen.commanderPage .commander-vtab.active{color:#f0d37a !important;}
#pageScreen.commanderPage .commander-card,
#pageScreen.commanderPage .commander-right .panel,
#pageScreen.commanderPage .commander-mid-sep,
#pageScreen.commanderPage .equipment-grid,
#pageScreen.commanderPage .equip-slot{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
}
#pageScreen.commanderPage .commander-card{
  position:relative !important;
  padding:0 !important;
  overflow:visible !important;
}
#pageScreen.commanderPage .commander-header-row{padding-right:0 !important;}
#pageScreen.commanderPage .commander-name{font-size:26px !important;}
#pageScreen.commanderPage .commander-role{font-size:13px !important;}
#pageScreen.commanderPage .commander-small-portrait{width:36px !important; height:36px !important; border:none !important; box-shadow:none !important;}
#pageScreen.commanderPage .commander-respect-num{font-size:34px !important;}
#pageScreen.commanderPage .commander-progress{height:7px !important; background:rgba(255,255,255,.12) !important;}
#pageScreen.commanderPage .commander-progress > div{background:linear-gradient(90deg,#ffda82,#b98c34) !important;}
#pageScreen.commanderPage .commander-stamina-label{color:#f0d995 !important;}
#pageScreen.commanderPage .commander-stats{display:grid !important; grid-template-columns:repeat(4,1fr) !important; gap:4px !important; margin-top:10px !important;}
#pageScreen.commanderPage .commander-stat{background:transparent !important; border:none !important; box-shadow:none !important;}
#pageScreen.commanderPage .commander-stat .v{font-size:15px !important;}
#pageScreen.commanderPage .commander-stat .l{font-size:9px !important;}
#pageScreen.commanderPage .equipment-grid{gap:6px !important; margin-top:6px !important;}
#pageScreen.commanderPage .equip-slot{min-height:72px !important; color:#ead7ab !important; font-size:9px !important;}
#pageScreen.commanderPage .equip-slot .only-plus{font-size:24px !important; line-height:1 !important; margin-bottom:6px !important;}
#pageScreen.commanderPage .skills-overlay{
  position:absolute !important;
  left:-690px !important;
  top:72px !important;
  width:1000px !important;
  height:560px !important;
  padding:0 !important;
  overflow:visible !important;
  pointer-events:none !important;
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
}
#pageScreen.commanderPage .skills-wrap,
#pageScreen.commanderPage .skill-tree{
  position:relative !important;
  width:100% !important;
  height:100% !important;
  overflow:visible !important;
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
}
#pageScreen.commanderPage .skill-tree-svg{position:absolute !important; inset:0 !important; width:100% !important; height:100% !important; overflow:visible !important; pointer-events:none !important;}
#pageScreen.commanderPage .skill-col-tag{top:14px !important; font:700 16px Georgia,serif !important; color:#d9b86c !important;}
#pageScreen.commanderPage .skill-col-tag.r0{left:126px !important;}
#pageScreen.commanderPage .skill-col-tag.r3{left:354px !important;}
#pageScreen.commanderPage .skill-col-tag.r5{left:534px !important;}
#pageScreen.commanderPage .skill-node{
  position:absolute !important;
  width:82px !important;
  height:82px !important;
  transform:translate(-50%, -50%) !important;
  border-radius:50% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  pointer-events:auto !important;
}
#pageScreen.commanderPage .skill-node.unlocked.main{background:radial-gradient(circle at 35% 30%, rgba(255,243,198,.95), rgba(216,176,76,.95) 55%, rgba(122,86,20,.96) 100%) !important; box-shadow:0 0 0 2px rgba(255,220,138,.85), 0 0 22px rgba(221,173,58,.35) !important;}
#pageScreen.commanderPage .skill-node.unlocked.sub{width:58px !important; height:58px !important; background:radial-gradient(circle at 35% 30%, rgba(233,248,255,.96), rgba(143,211,255,.98) 55%, rgba(42,84,136,.98) 100%) !important; box-shadow:0 0 0 2px rgba(185,233,255,.78), 0 0 18px rgba(88,176,255,.22) !important;}
#pageScreen.commanderPage .skill-node.locked{width:72px !important; height:72px !important; background:radial-gradient(circle at 35% 30%, rgba(33,36,42,.96), rgba(8,10,14,.98) 70%) !important; box-shadow:0 0 0 2px rgba(118,125,142,.48), inset 0 0 12px rgba(255,255,255,.03) !important; cursor:default !important;}
#pageScreen.commanderPage .skill-node.locked::after{content:attr(data-lock); position:absolute; bottom:-24px; left:50%; transform:translateX(-50%); font:700 12px Georgia,serif; color:#d7c79f; white-space:nowrap;}
#pageScreen.commanderPage .skill-node img{width:62% !important; height:62% !important; object-fit:contain !important; pointer-events:none !important;}
#pageScreen.commanderPage .skill-node.sub img{width:60% !important; height:60% !important;}
#pageScreen.commanderPage .skill-node .lvl{position:absolute !important; inset:auto auto 6px 50% !important; transform:translateX(-50%) !important; font:700 11px Arial,sans-serif !important; color:#fff4c9 !important; white-space:nowrap !important;}
#pageScreen.commanderPage .skill-node .name{position:absolute !important; top:calc(100% + 6px) !important; left:50% !important; transform:translateX(-50%) !important; width:88px !important; text-align:center !important; font:700 10px Georgia,serif !important; color:#e7d9b5 !important;}
#pageScreen.commanderPage .skill-node.sub .name{width:66px !important; font-size:8px !important; top:calc(100% + 4px) !important;}
#pageScreen.commanderPage .skill-node.active::before{content:""; position:absolute; inset:-8px; border-radius:50%; box-shadow:0 0 0 2px rgba(255,244,187,.9), 0 0 22px rgba(255,219,102,.58);}
#pageScreen.commanderPage .skill-info-inline{position:absolute !important; width:176px !important; min-height:112px !important; background:linear-gradient(180deg, rgba(16,37,78,.92), rgba(10,26,56,.92)) !important; border:1px solid rgba(121,173,255,.28) !important; border-radius:14px !important; padding:10px 12px 12px !important; color:#f4e8c2 !important; z-index:20 !important; pointer-events:none !important; box-shadow:0 10px 24px rgba(0,0,0,.36) !important;}
#pageScreen.commanderPage .skill-info-inline .title{font:700 14px Georgia,serif !important; color:#f4dd98 !important; margin-bottom:4px !important;}
#pageScreen.commanderPage .skill-info-inline .rank{font:700 11px Arial,sans-serif !important; color:#d7e8ff !important; margin-bottom:6px !important;}
#pageScreen.commanderPage .skill-info-inline .desc,
#pageScreen.commanderPage .skill-info-inline .max{font:700 11px/1.25 Georgia,serif !important;}
#pageScreen.commanderPage .skill-info-inline .max{margin-top:8px !important; color:#f4dd98 !important;}
#pageScreen.commanderPage .commander-page *,
#pageScreen.commanderPage .commander-page *::before,
#pageScreen.commanderPage .commander-page *::after{
  text-shadow:0 1px 1px rgba(0,0,0,.95), 0 0 3px rgba(0,0,0,.95), 0 0 6px rgba(0,0,0,.70) !important;
}


/* v225 hard lock: commander page uses its own fixed logical canvas only */
#pageScreen.commanderPage{
  position:fixed !important;
  inset:0 !important;
  display:block !important;
  overflow:hidden !important;
  background:#000 !important;
}
#pageScreen.commanderPage .commander-page{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  overflow:hidden !important;
  contain:layout paint style !important;
}
#pageScreen.commanderPage .commander-canvas{
  position:absolute !important;
  width:1280px !important;
  height:720px !important;
  left:0 !important;
  top:0 !important;
  transform-origin:top left !important;
  will-change:transform !important;
  overflow:hidden !important;
}
#pageScreen.commanderPage .commander-center,
#pageScreen.commanderPage .commander-stage{
  position:absolute !important;
  inset:0 !important;
}
#pageScreen.commanderPage .commander-stage{
  isolation:isolate !important;
}
#pageScreen.commanderPage .commander-stage > img,
#pageScreen.commanderPage .commander-stage > .commander-stage-poster,
#pageScreen.commanderPage .commander-stage.video-missing > video{
  display:none !important;
}
#pageScreen.commanderPage .commander-stage.video-missing > .commander-stage-poster{
  display:block !important;
}
#pageScreen.commanderPage .commander-stage video,
#pageScreen.commanderPage .commander-stage .commander-stage-poster{
  z-index:0 !important;
}
#pageScreen.commanderPage .commander-left,
#pageScreen.commanderPage .commander-top,
#pageScreen.commanderPage .commander-right,
#pageScreen.commanderPage .commander-side-tabs,
#pageScreen.commanderPage .skills-overlay,
#pageScreen.commanderPage .skill-info-inline{
  z-index:10 !important;
}