/* ======== Giao dien JX1 v2: nut / the / tieu de / thanh trang thai cat tu client (Spr\Ui3\道具, 技能, 主界面) ========
   - The (dtabs): thanh hoa van nhu "Vo cong chieu thuc / Ky nang song" cua bang Vo cong JX1.
   - Thanh trang thai duoi san dau: khung "新血条面板" voi thanh Sinh luc / Noi luc kieu JX1. */
:root{--jxtxt:#0d1714;--jxglow:#9fe6d2}
/* (nut bam: giu kieu jx1ui.css) */
/* ---- the trong bang (nhu bang Vo cong JX1) ---- */
.dtabs{gap:0!important;border:1px solid #000;box-shadow:0 0 0 1px #5a5850;background:#000}
.dtabs button{flex:1;border:0!important;border-radius:0!important;padding:5px 6px!important;margin:0;background:url(ui/jx1/flor.png) center/auto 100% repeat-x!important;
  color:#e8f6e6!important;font-weight:700;font-size:12px;text-shadow:0 0 2px #000,0 0 2px #000,0 1px 1px #000!important;border-right:1px solid #1d1d1a!important;filter:brightness(.78)}
.dtabs button:last-child{border-right:0!important}
.dtabs button.on{filter:none;color:#fff8d8!important;text-shadow:0 0 3px #0b3a30,0 0 2px #000,0 0 1px #000!important;box-shadow:inset 0 -2px 0 #e6c67a}
/* ---- tieu de muc (h3) trong bang: thanh hoa van nho ---- */
.tab h3,.mbox h3{background:url(ui/jx1/flor.png) center/auto 100% repeat-x;margin:12px -2px 8px;padding:4px 10px;border:1px solid #000;box-shadow:0 0 0 1px #5a5850;
  color:var(--jxtxt)!important;font-weight:700;text-shadow:0 0 2px var(--jxglow),0 0 2px var(--jxglow);border-bottom:1px solid #000}
.tab h3 small,.mbox h3 small{color:#1a2622;text-shadow:0 0 2px #cfe9df;font-weight:400}
.mbox h3:first-child{margin-top:0}
/* ---- o thong tin (card) nhu o "Ngan luong" cua bang Do vat ---- */
.card,.skl{background:#0b0b0a!important;border:1px solid #000!important;box-shadow:inset 0 0 0 1px #43413b,0 0 0 1px #24231f!important}
/* ---- thanh trang thai tren cung kieu JX1 (新血条面板): Cap | Sinh luc | Noi luc | Kinh nghiem | Luc chien ---- */
#hud{position:absolute;top:0!important;left:0!important;right:0!important;bottom:auto!important;transform:none!important;width:auto!important;z-index:5;
  display:grid!important;grid-template-columns:auto 1fr 1fr 1fr auto!important;gap:0 3px!important;align-items:center;padding:2px 4px!important;
  background:linear-gradient(#123224,#0a1d15)!important;border-bottom:1px solid #000;box-shadow:0 1px 0 #2f5a48,inset 0 1px 0 #2f5a48!important;pointer-events:none}
#hud .jxs{display:flex;align-items:center;gap:3px;font-size:11px;color:#e8dcb0;text-shadow:0 0 2px #000;white-space:nowrap}
#hud .jxs b{min-width:24px;padding:0 4px;height:15px;line-height:15px;text-align:center;background:#1d4a38;border:1px solid #000;box-shadow:inset 0 0 0 1px #3f7a62;color:#fff3c0;font-size:10.5px}
#hud .bar{height:15px!important;border:1px solid #000!important;box-shadow:inset 0 0 0 1px #3f6a58!important;border-radius:0!important;background:linear-gradient(#202020,#3a3a3a 45%,#151515)!important;padding:0!important}
#hud .bar i{inset:2px!important;width:0}
#hud .bar.hp i{background:url(ui/jx1/sbar_hp.png) 0 0/100% 100%!important} #hud .bar.mp i{background:url(ui/jx1/sbar_mp.png) 0 0/100% 100%!important}
#hud .bar.xp i{background:url(ui/jx1/sbar_xp.png) 0 0/100% 100%!important}
#hud .bar span{font-size:9.5px;line-height:15px;color:#fff;text-shadow:0 0 2px #000,0 0 2px #000,0 0 1px #000}
#mainSk{display:none}
#ctrlBtn{top:26px!important}
#skBuffs{top:54px!important}

/* ---- khung hop thoai: hoa van bac tren + duoi nhu bang Do vat ---- */
.mbox::before{background:url(ui/jx1/ornt2.png) center bottom/auto 100% no-repeat!important;top:-22px!important;height:30px!important}
.mbox{box-shadow:0 0 0 1px #000,0 0 0 2px #797369,0 0 0 4px #252320,0 0 0 5px #000,0 0 24px #000!important;background:#252320!important}
.mbox::after{content:"";position:sticky;display:block;bottom:-14px;height:20px;margin:10px -14px -14px;background:url(ui/jx1/ornb2.png) center top/auto 100% no-repeat;pointer-events:none}
/* ---- o do: o den vien xam nhu luoi Do vat JX1 ---- */
.it{background:#020202!important;border:1px solid #3c3a35!important;box-shadow:inset 0 0 0 1px #000,0 0 0 1px #000!important}
.invgrid{background:#252320!important;border:1px solid #000!important;box-shadow:0 0 0 1px #797369}
.dktbl{width:100%;border-collapse:collapse;margin:6px 0}.dktbl td,.dktbl th{border:1px solid #3c3a35;padding:3px 6px;text-align:left}.dktbl th{color:#e8dcb0}
/* ---- Chat the gioi (goc duoi trai san dau, nhu khung chat JX1) ---- */
#chatBox{position:absolute;left:6px;bottom:8px;width:min(58%,340px);z-index:6;display:flex;flex-direction:column;align-items:flex-start;pointer-events:none;font-size:11.5px}
#chatHead,#chatIn{display:none}
#chatLines{width:100%;max-height:86px;overflow:hidden;-webkit-mask-image:linear-gradient(transparent,#000 22px);mask-image:linear-gradient(transparent,#000 22px);display:flex;flex-direction:column;justify-content:flex-end;margin-bottom:4px}
#chatLines .cl{color:#f2ecd0;text-shadow:0 0 2px #000,0 0 2px #000,0 1px 1px #000;line-height:1.35;word-break:break-word}
#chatLines .cl i{font-style:normal;color:#9a9480} #chatLines .cl b{color:#ffd76a;font-weight:400} #chatLines .cl small{color:#8fc9b0}
#chatLines .cl.me b{color:#7fe0ff} #chatLines .cl.sys{color:#a9a39a;font-style:italic}
#chatBtn{pointer-events:auto;position:relative;width:34px;height:30px;border:1px solid #000;box-shadow:inset 0 0 0 1px #3f7a62;background:linear-gradient(#1d4a38,#0a1d15);color:#fff;font-size:15px;cursor:pointer}
#chatBtn b{position:absolute;top:-6px;right:-8px;min-width:16px;padding:0 3px;background:#c0392b;color:#fff;border-radius:8px;font-size:10px;line-height:16px;font-weight:400}
#chatBtn b:empty{display:none}
#chatBox.quiet #chatLines{display:none}
#chatBox.open{width:min(92%,420px);top:30px;bottom:8px;background:rgba(8,14,11,.92);border:1px solid #000;box-shadow:0 0 0 1px #5a5850,0 0 12px #000;pointer-events:auto;padding:0}
#chatBox.open #chatHead{display:flex;align-items:center;gap:4px;width:100%;padding:3px 6px;background:url(ui/jx1/flor.png) center/auto 100% repeat-x;border-bottom:1px solid #000;color:#0d1714;text-shadow:0 0 2px #9fe6d2}
#chatBox.open #chatHead small{color:#1a2622;flex:1} #chatX{background:none;border:0;font-size:14px;cursor:pointer;color:#0d1714}
#chatBox.open #chatLines{-webkit-mask-image:none;mask-image:none;flex:1;max-height:none;overflow-y:auto;justify-content:flex-start;padding:4px 6px;margin:0}
#chatBox.open #chatIn{display:flex;gap:4px;width:100%;padding:4px;border-top:1px solid #2b2a26}
#chatTxt{flex:1;min-width:0;background:#020202;border:1px solid #3c3a35;color:#f2ecd0;padding:4px 6px;font:inherit}
#chatBox.open #chatBtn{display:none}
@media (orientation:landscape){#chatBox{bottom:52px}}
/* ---- Nut Luyen cong / Nhiem vu goc duoi trai san dau (canh nut chat) ---- */
#modeSw{position:absolute;left:46px;bottom:8px;z-index:5;display:flex;border:1px solid #000;box-shadow:0 0 0 1px #5a5850}
#modeSw button{height:30px;padding:0 9px;border:0;background:linear-gradient(#26332d,#121a16);color:#cfc6a4;font:inherit;font-size:12px;cursor:pointer;white-space:nowrap}
#modeSw button+button{border-left:1px solid #000}
#modeSw button.on{background:linear-gradient(#6b5320,#3a2c0e);color:#fff3c0;box-shadow:inset 0 -2px 0 #e6c67a}
@media (orientation:landscape){#modeSw{bottom:52px}}