/* All overrides require both desktop and the VNG switch. Native art: tools/build-pc-ui-art.cjs. */
#pc-vng{display:none}
html body.pc-vng:not(.mob){--vng-art:'img/original/ui/pc/';font-family:Tahoma,Arial,sans-serif;color:#e7e4bf}
html body.pc-vng:not(.mob) #pc-vng{display:block;position:fixed;inset:0;z-index:45;pointer-events:none;font:12px Tahoma,Arial,sans-serif;text-shadow:1px 1px #000}
html body.pc-vng:not(.mob) #pc-vng button{box-sizing:border-box;pointer-events:auto;cursor:pointer;color:#e7e4bf;font:11px Tahoma,Arial,sans-serif;border-radius:0;text-shadow:1px 1px #000;box-shadow:none;min-width:0;min-height:0;touch-action:none}
html body.pc-vng:not(.mob) #pc-vng button:hover{filter:brightness(1.3)}
html body.pc-vng:not(.mob) #pc-vng button:focus-visible{outline:1px solid #f3df81;outline-offset:2px}
html body.pc-vng:not(.mob) :is(#vli-pc-v24,#pc23-shell,#top,#hud,#topCtl,#u20menu,#u20r,#u20gold,#u20rc,#u20rank,#u20side,#u20zone-tools,#tabs,#pad,#modeSw,#mainSk,#vli-arc-sw,#vli-arc,#vli-pet-menu,#vli-port-toprow,#vli-pk-quick){display:none!important}
html body.pc-vng:not(.mob) :is(#app,#battle){position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important;max-width:none!important;padding:0!important;margin:0!important;border:0!important;border-radius:0!important;background:none!important;transform:none!important;overflow:hidden!important}
html body.pc-vng:not(.mob) #arena{width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;transform:none!important}
html body.pc-vng:not(.mob) #vng-status{position:absolute;left:8px;top:8px;width:324px;height:114px;box-sizing:border-box;padding:8px 8px 8px 82px;border:4px solid transparent;border-image:url('img/original/ui/pc/skill-panel.png') 4 stretch;background:#111b16d9}
html body.pc-vng:not(.mob) #vng-avatar{position:absolute;left:4px;top:4px;width:70px;height:70px;padding:0;border:2px solid #6f7864;background:#141e17}
html body.pc-vng:not(.mob) #vng-avatar img{width:100%;height:100%;object-fit:cover;image-rendering:pixelated}
html body.pc-vng:not(.mob) #vng-name{height:23px;color:#f2e8ac;font-weight:bold;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html body.pc-vng:not(.mob) #vng-money{position:absolute;left:7px;bottom:5px;right:4px;text-align:center;font-size:11px;color:#d7cf9d}
html body.pc-vng:not(.mob) .vng-bar{position:relative;height:17px;margin-bottom:2px;border:2px solid transparent;border-image:url('img/original/ui/pc/status-strip.png') 2 2 2 2 stretch;background:#071b13;box-sizing:border-box;overflow:hidden}
html body.pc-vng:not(.mob) .vng-bar>i{position:absolute;inset:0 auto 0 0;max-width:100%;background:url('img/original/ui/pc/life.png') left center/100% 100% no-repeat}
html body.pc-vng:not(.mob) .vng-bar.mp>i{background-image:url('img/original/ui/pc/mana.png')}
html body.pc-vng:not(.mob) .vng-bar.xp>i{background-image:url('img/original/ui/pc/exp.png')}
html body.pc-vng:not(.mob) .vng-bar>span{position:absolute;inset:0;text-align:center;font-size:10px;line-height:13px;color:#fff5d6}
html body.pc-vng:not(.mob) #vng-minimap{position:absolute;right:10px;top:10px;width:132px;height:158px;box-sizing:border-box;border:1px solid #6b6f51;pointer-events:none}
html body.pc-vng:not(.mob) #vng-mapname{position:absolute;top:0;left:0;width:130px;height:20px;padding:1px 3px;border:0;background:#151e11c9;color:#62ff62;z-index:2;font-size:11px;white-space:nowrap;overflow:hidden}
html body.pc-vng:not(.mob) .vng-map-space{height:130px}
html body.pc-vng:not(.mob) .vng-maptools{display:flex;gap:1px;align-items:center;height:25px;background:#151e11c9}
html body.pc-vng:not(.mob) .vng-maptools button{width:14px;height:14px;border:0;padding:0;background:none}
html body.pc-vng:not(.mob) .vng-maptools img{width:14px;height:14px;image-rendering:pixelated}
html body.pc-vng:not(.mob) #vng-coords{flex:1;font-size:9px;color:#62ff62;text-align:center}
html body.pc-vng:not(.mob) #vng-utilities{position:absolute;right:154px;top:12px;display:flex;gap:8px}
html body.pc-vng:not(.mob) #vng-utilities button{width:58px;height:54px;border:0;padding:0;background:none;display:flex;flex-direction:column;align-items:center;gap:3px}
html body.pc-vng:not(.mob) #vng-utilities i{display:block;width:32px;height:32px;background:var(--vng-icon) center/contain no-repeat;image-rendering:pixelated}
html body.pc-vng:not(.mob) #vng-utilities span{font-size:10px;white-space:nowrap}
html body.pc-vng:not(.mob) #vng-quick{position:absolute;bottom:5px;left:50%;transform:translateX(-50%);width:440px;height:112px;pointer-events:auto}
html body.pc-vng:not(.mob) #vng-slots{position:absolute;left:0;bottom:7px;display:flex;width:346px;height:44px;padding:2px 4px;box-sizing:border-box;background:url('img/original/ui/pc/hotbar.png') center/100% 100% no-repeat}
html body.pc-vng:not(.mob) :is(#vng-slots,#vng-hands) button{position:relative;flex:1;padding:0;border:0;background:none;width:38px;height:38px;overflow:hidden}
html body.pc-vng:not(.mob) :is(#vng-slots,#vng-hands) i{display:block;position:absolute;inset:3px 3px 7px;background:center/contain no-repeat;image-rendering:pixelated;pointer-events:none}
html body.pc-vng:not(.mob) :is(#vng-slots,#vng-hands) b{position:absolute;left:2px;bottom:1px;font:10px Tahoma;color:#e1dfa8;pointer-events:none}
html body.pc-vng:not(.mob) .vng-extra small{position:absolute;left:0;right:0;bottom:10px;font-size:8px}
html body.pc-vng:not(.mob) .vng-extra[data-vng-action="tp"] i{background-image:url('img/original/items/tdp.png')!important}
html body.pc-vng:not(.mob) .vng-extra[data-vng-action="auto"] i{background-image:url('img/original/ui/pc/run.png')!important}
html body.pc-vng:not(.mob) #vng-hands{position:absolute;left:147px;top:0;width:105px;height:57px;padding:21px 13px 0;display:flex;gap:3px;box-sizing:border-box;background:url('img/original/ui/pc/hands.png') top/105px 92px no-repeat}
html body.pc-vng:not(.mob) #vng-hands button{width:36px;height:36px;flex:none}
html body.pc-vng:not(.mob) #vng-potions{position:absolute;right:0;bottom:6px;width:90px;display:flex;gap:1px}
html body.pc-vng:not(.mob) #vng-potions button{position:relative;width:30px;height:42px;padding:1px;border:2px solid transparent;border-image:url('img/original/ui/pc/skill-panel.png') 4 stretch;background:#111d15}
html body.pc-vng:not(.mob) #vng-potions i{position:absolute;inset:1px 0 10px;background:center/contain no-repeat;image-rendering:pixelated}
html body.pc-vng:not(.mob) #vng-potions span{position:absolute;bottom:1px;left:0;right:0;font-size:7px;white-space:nowrap}
html body.pc-vng:not(.mob) .vng-cd{position:absolute;right:1px;top:1px;font-size:10px;color:#ffe77f;font-style:normal}
html body.pc-vng:not(.mob) #vng-menu{position:absolute;right:8px;bottom:3px;width:337px;height:62px;display:flex;align-items:flex-end;justify-content:center;gap:5px;padding:0 6px 5px;box-sizing:border-box;background:url('img/original/ui/pc/toolbar.png') center/100% 100% no-repeat}
html body.pc-vng:not(.mob) #vng-menu button{position:relative;width:35px;height:40px;border:0;background:none;padding:0}
html body.pc-vng:not(.mob) #vng-menu i{position:absolute;left:3px;top:0;width:28px;height:28px;background:var(--vng-icon) center/contain no-repeat;image-rendering:pixelated}
html body.pc-vng:not(.mob) #vng-menu span{position:absolute;bottom:0;left:-5px;right:-5px;white-space:nowrap;font-size:8px}
html body.pc-vng:not(.mob) #vng-menu button[aria-pressed="true"]{filter:brightness(1.6)}
html body.pc-vng:not(.mob) #u20log{display:flex!important;position:fixed!important;left:7px!important;bottom:8px!important;top:auto!important;width:324px!important;height:172px!important;max-width:324px!important;padding:0 0 0 15px!important;margin:0!important;transform:none!important;z-index:46!important;background:#07140bab!important;border:0!important;box-shadow:none!important;pointer-events:auto!important;border-radius:0!important;flex-direction:column!important}
html body.pc-vng:not(.mob) #u20log::before{content:'';position:absolute;left:0;top:0;bottom:24px;width:15px;background:url('img/original/ui/pc/chat-top.png') top/15px 17px no-repeat,url('img/original/ui/pc/chat-bottom.png') bottom/15px 16px no-repeat,url('img/original/ui/pc/chat-side.png') center/12px calc(100% - 33px) no-repeat;pointer-events:none}
html body.pc-vng:not(.mob) #u20ct{display:flex!important;order:0!important;flex:none!important;gap:2px!important;height:24px!important;padding:0!important;border:0!important;background:none!important;box-shadow:none!important}
html body.pc-vng:not(.mob) #u20ct button{height:21px!important;min-height:0!important;font:10px Tahoma!important;padding:1px 5px!important;border:1px solid #6a7055!important;border-radius:0!important;background:#192b1b!important;color:#deddb1!important;box-shadow:none!important}
html body.pc-vng:not(.mob) #u20ct button.on{background:#354930!important;color:#faff9e!important}
html body.pc-vng:not(.mob) #u20lines{order:1!important;flex:1!important;min-height:0!important;height:auto!important;max-height:none!important;padding:3px!important;font:11px/1.5 Tahoma!important;border:0!important;background:none!important;overflow:auto!important}
html body.pc-vng:not(.mob) #u20in{order:2!important;display:flex!important;position:relative!important;flex:none!important;height:28px!important;min-height:28px!important;gap:2px!important;margin:0!important;padding:3px 4px!important;border:0!important;background:url('img/original/ui/pc/chat-input.png') center/100% 100% no-repeat!important}
html body.pc-vng:not(.mob) #u20txt{width:0!important;flex:1!important;font:11px Tahoma!important;color:#f7edae!important;background:none!important;border:0!important;padding:0!important;min-width:0!important;height:22px!important}
html body.pc-vng:not(.mob) :is(#u20ch,#u20go){min-width:20px!important;height:20px!important;padding:0!important;background:none!important;border:0!important;font:10px Tahoma!important}
html body.pc-vng:not(.mob) #u20go{font-size:0!important;background:url('img/original/ui/pc/send.png') center/contain no-repeat!important}
html body.pc-vng:not(.mob) #u20log>:is(#u20ct,#u20lines,#u20in){width:100%!important;max-width:none!important;box-sizing:border-box!important}
html body.pc-vng.u20logoff:not(.mob) #u20log{height:52px!important}
html body.pc-vng:not(.mob) #u20zone{position:fixed!important;top:171px!important;right:10px!important;left:auto!important;width:132px!important;z-index:47!important;background:none!important}
html body.pc-vng:not(.mob) #u20zb{display:none!important}
html body.pc-vng:not(.mob) #u20zl{max-height:calc(100vh - 235px)!important;overflow:auto!important}
html body.pc-vng:not(.mob) #panel{display:none!important}
html body.pc-vng.u20win:not(.mob) #panel{display:flex!important;flex-direction:column!important;position:fixed!important;inset:124px 162px 86px auto!important;width:480px!important;min-width:0!important;max-width:calc(100vw - 180px)!important;height:auto!important;max-height:none!important;transform:none!important;box-sizing:border-box!important;padding:0!important;margin:0!important;border:4px solid transparent!important;border-image:url('img/original/ui/pc/skill-panel.png') 4 stretch!important;border-radius:0!important;background:#141d14!important;box-shadow:4px 5px 12px #0009!important;z-index:9500!important;overflow:hidden!important;color:#e0dfb6!important;font:12px Tahoma!important}
html body.pc-vng:not(.mob) #u20wh{display:flex!important;position:relative!important;flex:none!important;height:34px!important;padding:0 8px!important;align-items:center!important;border:0!important;border-bottom:2px solid #343b29!important;background:url('img/original/ui/pc/stone.png') repeat!important;color:#10291e!important;text-shadow:0 1px #c1c3a6!important;font:700 15px Tahoma!important}
html body.pc-vng:not(.mob) #u20wx{position:static!important;transform:none!important;margin:0 0 0 auto!important;width:25px!important;height:25px!important;min-width:0!important;padding:0!important;border:1px solid #2e4031!important;border-radius:0!important;background:#304631!important;color:#f1e9af!important;font-size:17px!important}
html body.pc-vng:not(.mob) #panel>.tab:not(.hidden){flex:1!important;min-height:0!important;overflow:auto!important;padding:8px!important;max-height:none!important;background:#172016e8!important}
html body.pc-vng:not(.mob) #panel>:is(#jxc-wh,#jxc-wf){display:none!important}
html body.pc-vng:not(.mob) #panel .btn{border-radius:0!important;font-family:Tahoma!important;font-size:11px!important;min-height:25px!important;color:#e5e1b4!important;background:#293c27 url('img/original/ui/pc/stone.png') center!important;text-shadow:1px 1px #000!important;border:1px solid #666f50!important;box-shadow:none!important}
html body.pc-vng:not(.mob) #vng-setting{padding:6px 0 10px}
html body.pc-vng:not(.mob) #modal .mbox{border:4px solid transparent!important;border-image:url('img/original/ui/pc/skill-panel.png') 4 stretch!important;border-radius:0!important;background:#152316!important;color:#e5e1b4!important;font-family:Tahoma!important;box-shadow:3px 4px 12px #0009!important}
html body.pc-vng:not(.mob) #modal .modal-closebar{background:url('img/original/ui/pc/title-stone.png') repeat!important;border-bottom:2px solid #343b29!important}
html body.pc-vng:not(.mob) #modal :is(.skill-choice,.shoprow){background:#12251a!important;border:1px solid #657356!important;border-radius:0!important;padding:6px 8px!important;min-height:54px!important;text-align:left!important;color:#e2e4ba!important;box-shadow:none!important}
html body.pc-vng:not(.mob) #modal :is(.skill-choice,.shoprow):hover{background:#263f28!important}
html body.pc-vng:not(.mob) #modal :is(.skill-choice,.shoprow) small{color:#acb89c!important;text-shadow:none!important}
html body.pc-vng:not(.mob) #modal #vli-skill-picker h3{background:url('img/original/ui/pc/title-stone.png') repeat!important;color:#173222!important;text-shadow:0 1px #b8b99d!important;padding:5px!important}
/* Keep the existing skill renderer and its original five-column SPR cells. */
html body.pc-vng.u20win:not(.mob) #panel:has(#t-skill:not(.hidden)>.original-skill-frame){inset:124px 162px 86px auto!important;width:310px!important;max-width:none!important;transform:none!important}
html body.pc-vng:not(.mob) #panel>#t-skill:has(>.original-skill-frame){padding:0!important}
html body.pc-vng:not(.mob) #t-skill .original-skill-frame{border:0!important}
html body.pc-vng:not(.mob) #t-skill .original-skill-header{background:url('img/original/ui/pc/stone.png') repeat!important}
html body.pc-vng:not(.mob) #u20wh{background:url('img/original/ui/pc/title-stone.png') repeat!important;inset:auto!important;margin:0!important;width:100%!important;max-width:none!important;min-height:34px!important;box-sizing:border-box!important}
html body.pc-vng:not(.mob) #u20wt{display:block!important;position:static!important;flex:1!important;font:700 14px Tahoma!important;color:#173222!important;text-shadow:0 1px #b8b99d!important;text-align:center!important}
html body.pc-vng:not(.mob) #panel:has(#t-skill:not(.hidden)>.original-skill-frame)>#u20wh{display:none!important}
html body.pc-vng:not(.mob) #vli-tdp{position:fixed!important;left:92px!important;top:123px!important;right:auto!important;bottom:auto!important;width:62px!important;height:22px!important;transform:none!important;border:1px solid #617456!important;border-radius:0!important;background:#172a18!important;display:flex!important;align-items:center!important;gap:2px!important;padding:0 3px!important;box-shadow:none!important}
html body.pc-vng:not(.mob) #vli-tdp .original-spr-icon{width:18px!important;height:20px!important}
html body.pc-vng:not(.mob) #vli-tdp small{font:8px Tahoma!important;color:#e3dfb0!important}
html body.pc-vng:not(.mob) #vlm-online-badge{position:fixed!important;left:13px!important;top:123px!important;right:auto!important;font:10px Tahoma!important;background:#172a18!important;border:1px solid #617456!important;border-radius:0!important;padding:2px 5px!important;height:18px!important;min-height:0!important;box-sizing:border-box!important}
html body.pc-vng:not(.mob) #vli120Bar{position:fixed!important;top:78px!important;right:154px!important;left:auto!important;bottom:auto!important;transform:none!important;width:auto!important;display:flex!important;gap:4px!important;background:none!important;z-index:46!important}
html body.pc-vng:not(.mob) #vli120Bar[hidden]{display:none!important}
html body.pc-vng:not(.mob) .vli120-cast{background:#13271bc9!important;border:1px solid #68775c!important;border-radius:0!important;padding:4px 8px!important;min-height:28px!important;color:#ece3b7!important;font:11px Tahoma!important}
/* Override the fixed V23 character geometry as one self-contained window. */
html body.pc-vng:not(.mob) #t-char .u2char{display:grid!important;grid-template-columns:minmax(0,1fr) 204px!important;gap:10px!important;position:relative!important;width:100%!important;height:auto!important;min-height:405px!important;padding:0!important}
html body.pc-vng:not(.mob) #t-char .u2info{position:static!important;order:0!important;inset:auto!important;width:auto!important;height:auto!important;min-width:0!important;max-height:none!important;overflow:visible!important;background:none!important;padding:0!important;font:11px Tahoma!important}
html body.pc-vng:not(.mob) #t-char .u2dollw{position:relative!important;order:1!important;inset:auto!important;width:204px!important;height:405px!important;min-width:0!important}
html body.pc-vng:not(.mob) #t-char .u2doll{left:0!important;top:27px!important;transform:scale(.79)!important}
html body.pc-vng:not(.mob) #t-char .u2dollw .u2btns{position:absolute!important;bottom:0!important;left:0!important;width:204px!important;max-width:204px!important;display:flex!important;flex-wrap:wrap!important;gap:3px!important}
html body.pc-vng:not(.mob) #t-char .u2dollw .u2btns button{flex:1 1 46%!important;width:auto!important;font-size:10px!important;white-space:normal!important;padding:3px!important}
html body.pc-vng:not(.mob) #t-char .u2kv{grid-template-columns:85px minmax(0,1fr)!important;gap:4px!important;font:11px Tahoma!important}
html body.pc-vng:not(.mob) #t-char .u2kv b{white-space:normal!important;overflow-wrap:anywhere!important;font-size:11px!important}
html body.pc-vng:not(.mob) #t-char .u2a{display:grid!important;grid-template-columns:minmax(0,1fr) 40px 22px 22px!important;gap:2px!important;align-items:center!important}
html body.pc-vng:not(.mob) #t-char .u2a :is(span,b){width:auto!important;min-width:0!important;font-size:11px!important}
html body.pc-vng:not(.mob) #t-char .u2st{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:4px!important;font:10px Tahoma!important}
html body.pc-vng:not(.mob) #t-char .u2nm{width:204px!important;box-sizing:border-box!important;font-size:12px!important}
html body.pc-vng:not(.mob) .pc23-charfoot{position:static!important;inset:auto!important;width:100%!important;height:auto!important;display:flex!important;gap:4px!important;padding-top:8px!important}
html body.pc-vng:not(.mob) .pc23-charfoot button{flex:1!important}
html body.pc-vng.u20win:not(.mob)[data-u2t="inv"] #panel{width:270px!important}
html body.pc-vng:not(.mob) #t-inv .u2bagrow{display:block!important;width:100%!important;padding:0!important;margin:0!important}
html body.pc-vng:not(.mob) #t-inv .u2bag{margin:0 auto!important}
html body.pc-vng:not(.mob) #t-inv .u2bag{background:url('img/original/ui/pc/inv-panel.png') left top/223px 474px no-repeat!important;height:474px!important}
html body.pc-vng:not(.mob) #t-inv .u2bag>.invgrid{top:75px!important;left:26px!important}
html body.pc-vng:not(.mob) #t-inv .u2bh{top:355px!important}
html body.pc-vng:not(.mob) #t-inv .u2money{top:382px!important}
html body.pc-vng.u20.u20win:not(.mob) #panel:not(.hidden):has(#t-skill:not(.hidden)>.original-skill-frame){inset:124px 162px 86px auto!important;width:310px!important;max-width:none!important;height:auto!important;max-height:none!important;transform:none!important}
html body.pc-vng.u20win:not(.mob)[data-u2t="more"] #panel{width:400px!important}
@media (max-width:1199px){
 html body.pc-vng:not(.mob) #vng-quick{left:336px;transform:none;width:365px}
 html body.pc-vng:not(.mob) #vng-slots{width:292px}
 html body.pc-vng:not(.mob) #vng-potions{width:70px}
 html body.pc-vng:not(.mob) #vng-menu{width:292px;right:4px;gap:0}
 html body.pc-vng:not(.mob) #vng-menu button{width:34px}
 html body.pc-vng:not(.mob) #vng-utilities{gap:0}
}
