/* ===== style block 001 ===== */

:root{
 --hudH: 70px;
 --panelTop: calc(var(--hudH) + 18px);
 --gameW: 1200px;
 --uiScale: 1;
 --glass: rgba(20,20,20,.55);
 --stroke: rgba(255,255,255,.10);
 --text: #f3f3f3;
 --muted:#cfcfcf;
 --gold:#f6d56a;
 --red:#ff2e2e;
 --shadow: 0 10px 30px rgba(0,0,0,.45);

 --cSTR:#8b5a2b;
 --cINT:#ffd24a;
 --cVIT:#ff4b4b;
 --cDUR:#4aa3ff;
 --cDEF:#1abc9c;
 --cDMG: var(--gold);
 --cAGI:#52d66a;
 --cBLESS:#ff9f2e;
 }
 *{box-sizing:border-box}
 body{
 margin:0;
 font-family: system-ui,Segoe UI,Arial;
 color:var(--text);
 background:#000;
 overflow:hidden;
 user-select:none;
 }

 #uiRoot{
 position:fixed; inset:0;
 transform-origin: top left;
 }

 .screen{position:fixed;inset:0;display:none;background:transparent;}
 .screen.active{display:block;}

 #hud{
 position:fixed;top:0;left:0;right:0;height:var(--hudH);
 z-index:50;
 background:linear-gradient(180deg, rgba(0,0,0,.78), rgba(0,0,0,.35));
 backdrop-filter: blur(10px);
 border-bottom:1px solid rgba(255,255,255,.08);
 display:flex;align-items:center;
 padding:10px 26px;gap: 6px;
 }
 #hud .left{display:flex;align-items:center;gap:10px;flex:0 0 auto; margin-left: max(18px, calc((100vw - var(--gameW))/2 + 18px));}
 .hudProfile{
 display:flex;align-items:center;gap:10px;
 padding:8px 10px;border-radius:18px;
 background:rgba(255,255,255,.06);
 border:1px solid rgba(255,255,255,.10);
 box-shadow: 0 10px 26px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.08);
 backdrop-filter: blur(10px);
 min-width: 190px;
 }
 .hudProfile .avatar{box-shadow:none;}
 .hudProfile:hover{border-color: rgba(246,213,106,.22);}

 #hud .avatar{
 width:52px;height:52px;border-radius:12px;overflow:hidden;
 background:rgba(255,255,255,.08);
 border:1px solid rgba(255,255,255,.12);
 box-shadow:var(--shadow);
 cursor:pointer;
 flex:0 0 auto;
 }
 #hud .avatar:hover{outline:2px solid rgba(255,255,255,.18)}
 #hud .avatar img{width:100%;height:100%;object-fit: contain}

 #hud .namebox{line-height:1.1}
 #hud .namebox b{display:block;font-size:14px}
 #hud .namebox .lvl{
 display:inline-block;margin-top:4px;
 font-size:12px;font-weight:900;letter-spacing:.6px;
 font-family: "Cinzel","Trajan Pro","Georgia",serif;
 padding:3px 8px;border-radius:10px;
 background:rgba(255,255,255,.06);
 border:1px solid rgba(255,255,255,.10);
 }

 #hud .mid{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;justify-content: center;align-items:center;pointer-events:none;}
 #hud .mid > *{pointer-events:auto;}
 .midPill{
 display:flex;gap: 6px;align-items:center;
 padding:0;border-radius:0;
 background:transparent;
 border:none;
 box-shadow:none;
 font-size:12px;color:var(--muted);
 justify-content: center;
 min-width:0;
 }
 .money{
 display:flex;align-items:center;gap:10px;
 padding:6px 12px;border-radius:14px;
 background:transparent;
 border:1px solid rgba(255,255,255,.14);
 box-shadow:
 inset 0 1px 0 rgba(255,255,255,.10),
 0 10px 26px rgba(0,0,0,.35);
 color:#fff;font-weight:900;
 text-shadow: 0 2px 10px rgba(0,0,0,.55);
 position:relative;
 }
 .money:before{
 content:"";
 position:absolute;inset:-1px;
 border-radius:14px;
 padding:1px;
 background:linear-gradient(135deg, rgba(246,213,106,.40), rgba(76,163,255,.30), rgba(255,255,255,.10));
 -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
 -webkit-mask-composite: xor;
 mask-composite: exclude;
 pointer-events:none;
 opacity:.85;
 }
 #hudGold{ color: var(--gold); font-family: "Cinzel","Trajan Pro","Georgia",serif; font-weight:900; font-size:16px; letter-spacing:.2px; }
 #hudGems{ color: #55b9ff; font-family: "Cinzel","Trajan Pro","Georgia",serif; font-weight:900; font-size:16px; letter-spacing:.2px; }

 .coinIcon{
 width:18px;height:18px;border-radius:50%;
 background:radial-gradient(circle at 35% 30%, #fff2b0, #f6d56a 55%, #b07a00 100%);
 border:1px solid rgba(255,255,255,.25);
 box-shadow:0 0 10px rgba(246,213,106,.25);
 position:relative;
 }
 .coinIcon::after{
 content:"";position:absolute;inset:4px;border-radius:50%;
 border:1px dashed rgba(0,0,0,.25);opacity:.7;
 }
 .crysIcon{
 width:18px;height:18px;border-radius:6px;
 background:linear-gradient(180deg, rgba(120,220,255,1), rgba(40,140,255,1));
 border:1px solid rgba(255,255,255,.25);
 box-shadow:0 0 12px rgba(80,170,255,.30);
 transform: rotate(10deg);
 position:relative;
 }

 .moneyIcon{width:18px !important;height:18px !important;vertical-align:middle;}

 .xpHud{
 display:flex; flex-direction:column;
 gap:4px;
 min-width:160px;
 padding:7px 10px;border-radius:12px;
 background:rgba(0,0,0,.22);
 border:1px solid rgba(255,255,255,.10);
 }
 .xpBar{
 height:10px;border-radius:999px;
 background:rgba(255,255,255,.10);
 overflow:hidden;
 border:1px solid rgba(255,255,255,.10);
 }
 .xpFill{
 height:100%; width:0%;
 background:linear-gradient(90deg, rgba(120,220,255,1), rgba(40,140,255,1));
 box-shadow:0 0 12px rgba(80,180,255,.6);
 transition: width .25s ease;
 }
 .xpTxt{
 font-size:12px; font-weight:900;
 color:rgba(235,245,255,.95);
 text-shadow:0 2px 6px rgba(0,0,0,.55);
 line-height:1;
 text-align:center;
 }
.crysIcon::after{
 content:"";position:absolute;left:4px;top:4px;right:4px;bottom:4px;
 border-radius:4px;background:linear-gradient(180deg, rgba(255,255,255,.55), rgba(255,255,255,0));
 opacity:.55;
 }

 #hud .right{display:flex;align-items:center;gap:10px;justify-content:flex-end;flex:1;}
 .iconBtn{
 width:42px;height:42px;border-radius:12px;
 border:1px solid rgba(255,255,255,.10);
 background:rgba(255,255,255,.06);
 display:grid;place-items:center;cursor:pointer;box-shadow:var(--shadow);
 }
 .iconBtn:hover{background:rgba(255,255,255,.10)}

 .colMenu{
 position:absolute; inset:0;
 display:flex; flex-direction:column;
 justify-content:flex-start;
 padding:22px;
 pointer-events:auto;
 }
 .colHead{
 display:flex; align-items:center; justify-content:space-between;
 gap:12px; margin:0 auto; max-width:980px; width:100%;
 }
 .colTitle{
 font-size:28px; font-weight:900; letter-spacing:.3px;
 color:#fff; text-shadow:0 6px 18px rgba(0,0,0,.65);
 }
 .colCards{
 margin:18px auto 0; max-width:980px; width:100%;
 display:grid; grid-template-columns:1fr 1fr; gap:16px;
 }
 .colCard{
 background:rgba(0,0,0,.55);
 border:1px solid rgba(255,255,255,.10);
 border-radius:18px;
 padding:16px 16px 18px;
 box-shadow:var(--shadow);
 backdrop-filter: blur(6px);
 }
 .colCard h3{margin:0 0 8px;font-size:20px;}
 .smallTxt{color:#cfd3ff; opacity:.95; font-size:13px; line-height:1.25}

 .dunWrap{
 position:absolute; inset:0;
 display:flex; flex-direction:column;
 padding:18px 22px;
 pointer-events:auto;
 }
 .dunTop{
 display:flex; align-items:center; justify-content:space-between; gap:12px;
 max-width:1100px; width:100%; margin:0 auto;
 }
 .dunTitle{
 font-size: 36px; font-weight:900; color:#fff;
 text-shadow:0 6px 18px rgba(0,0,0,.65);
 }
 .dunRight{display:flex; gap:10px; align-items:center;}
 .dunBody{
 max-width:1100px; width:100%; margin:14px auto 0;
 background:rgba(0,0,0,.50);
 border:1px solid rgba(255,255,255,.10);
 border-radius:18px;
 padding:14px;
 box-shadow:var(--shadow);
 backdrop-filter: blur(6px);
 }
 .dunInfo{color:#e8e8ff; font-weight:700; margin-bottom:10px; text-shadow:0 2px 10px rgba(0,0,0,.6)}
 .bossGrid{
 display:grid; grid-template-columns:repeat(8, 1fr);
 gap:10px;
 align-items:stretch;
 }
 .bossTile{
 position:relative;
border-radius:14px;
 border:1px solid rgba(255,255,255,.14);
 background:rgba(255,255,255,.06);
 box-shadow:inset 0 0 0 1px rgba(0,0,0,.25);
 padding:8px;
 display:flex; flex-direction:column; align-items:center; gap:6px;
 cursor:pointer;
 min-height: 128px;
 }
 .bossTile.locked{opacity:.35; cursor:not-allowed; filter:grayscale(1);}
 .bossTile.done{opacity:.65;}

 .bossTile.done::before,
 .bossTile.done::after{
 content:"";
 position:absolute;
 width:74px;
 height:4px;
 left:50%;
 top:34px;
 background: rgba(255,40,40,.92);
 box-shadow: 0 0 12px rgba(255,40,40,.35);
 border-radius: 4px;
 transform-origin:center;
 pointer-events:none;
 }
 .bossTile.done::before{ transform: translateX(-50%) rotate(32deg); }
 .bossTile.done::after{ transform: translateX(-50%) rotate(-32deg); }

.bossTile img{width:54px;height:54px;object-fit:contain; filter: drop-shadow(0 6px 10px rgba(0,0,0,.6));}
 .bossTile b{color:#fff; font-size:12px; text-shadow:0 2px 6px rgba(0,0,0,.7)}
 .bossTile .tag{font-size:11px;color:#d3d7ff}
 .dunActions{display:flex; justify-content: center; margin-top:12px;}

 .bgWrap{
 position:absolute;top:var(--hudH);left:0;right:0;bottom:0;
 display:flex;align-items:center;justify-content: center;background:#000;
 overflow:hidden;
 }

 .bg{
 position:relative;z-index:1;
 height: calc(100vh - var(--hudH));
 width: min(var(--gameW), 100vw);
 display:flex;align-items:center;justify-content: center;
 }
 .bg img{
 width:100%;
 height:auto;
 max-height:100%;
}
#city2Screen .bgWrap{
 padding-left: 250px;
}
#city2Screen .bg{
 width: calc(min(var(--gameW), 100vw) - 250px);
 justify-content: center;
}
#city2Screen .bg img{
 width:100%;
 height:100%;
 max-height:100%;
 object-fit:contain;
 object-position:center center;
}

 .hotspot{position:absolute;cursor:pointer;border-radius:14px;z-index:5;}
 .tooltip{
 position:absolute;left:50%;top:0;transform:translate(-50%,-130%);
 padding:6px 10px;font-size:12px;white-space:nowrap;
 background:rgba(0,0,0,.78);
 border:1px solid rgba(255,255,255,.10);
 border-radius:10px;box-shadow:var(--shadow);
 opacity:0;transition:.12s;pointer-events:none;
 }
 .hotspot:hover .tooltip{opacity:1;}

 .cityTravelArrow{
 display:flex;
 align-items:center;
 justify-content:center;
 border-radius:999px;
 background:radial-gradient(circle at 35% 35%, rgba(255,235,170,.22), rgba(120,70,20,.78) 62%, rgba(45,25,10,.92) 100%);
 border:1px solid rgba(255,210,120,.42);
 box-shadow:
 0 12px 24px rgba(0,0,0,.45),
 0 0 18px rgba(255,190,90,.18),
 inset 0 1px 0 rgba(255,255,255,.10);
 backdrop-filter: blur(4px);
 animation: cityArrowPulse 1.8s ease-in-out infinite;
 }
 .cityTravelArrow:hover{
 filter:brightness(1.08);
 box-shadow:
 0 14px 28px rgba(0,0,0,.52),
 0 0 24px rgba(255,205,120,.28),
 inset 0 1px 0 rgba(255,255,255,.14);
 }
 .cityTravelArrow .travelGlyph{
 font-size:30px;
 line-height:1;
 color:#ffe5b3;
 text-shadow:
 0 2px 8px rgba(0,0,0,.75),
 0 0 14px rgba(255,210,120,.28);
 transform: translateX(1px);
 pointer-events:none;
 user-select:none;
 }
 @keyframes cityArrowPulse{
 0%,100%{
 transform: scale(1);
 box-shadow:
 0 12px 24px rgba(0,0,0,.45),
 0 0 18px rgba(255,190,90,.18),
 inset 0 1px 0 rgba(255,255,255,.10);
 }
 50%{
 transform: scale(1.04);
 box-shadow:
 0 14px 28px rgba(0,0,0,.52),
 0 0 26px rgba(255,210,120,.32),
 inset 0 1px 0 rgba(255,255,255,.14);
 }
 }
 .city2BackBtn{
 position:absolute;
 left:20px;
 top:20px;
 z-index:8;
 }
 .city2BackArrow{
 position:absolute;
 left:6.2%;
 top:47.2%;
 width:5.8%;
 height:8.4%;
 z-index:8;
 }
 .city2BackArrow .travelGlyph{
 transform: translateX(-1px) scaleX(-1);
 }

 .btn{
 padding:10px 12px;border-radius:12px;
 border:1px solid rgba(255,255,255,.12);
 background:rgba(255,255,255,.06);
 color:#fff;cursor:pointer;
 }
 .btn:hover{background:rgba(255,255,255,.10)}
 .btn.primary{
 background:linear-gradient(180deg, rgba(70,170,255,.35), rgba(70,170,255,.12));
 border-color:rgba(70,170,255,.35);
 }
 .btn.danger{
 background:linear-gradient(180deg, rgba(255,70,70,.35), rgba(255,70,70,.12));
 border-color:rgba(255,70,70,.35);
 }

 #createPanel{
 position:absolute;inset:0;top:var(--hudH);
 display:flex;align-items:center;justify-content: center;padding:20px;
 z-index:2;
 }
 .panel{
 width:min(860px,96vw);
 background:rgba(0,0,0,.55);
 border:1px solid rgba(255,255,255,.12);
 border-radius:18px;box-shadow:var(--shadow);
 padding:16px;backdrop-filter: blur(8px);
 display:grid;grid-template-columns: 1.2fr 1fr;gap: 6px;
 }
 .panel h2{margin:0 0 8px}
 .panel input{
 width:100%;padding:10px 12px;border-radius:12px;
 border:1px solid rgba(255,255,255,.12);
 background:rgba(255,255,255,.06);color:#fff;outline:none;
 }
 .statRow{
 display:flex;align-items:center;justify-content:space-between;
 padding:8px 10px;border-radius:12px;
 border:1px solid rgba(255,255,255,.08);
 background:rgba(255,255,255,.04);
 margin-top:8px;
 }
 .statRow b{font-size:13px}
 .statRow .btns{display:flex;gap:10px;align-items:center}

 .shopLayout{
 position:absolute;inset:0;
 top:0;
 z-index:6;
 display:grid;
 grid-template-columns: 420px 1fr 320px;
 gap: 6px;
 padding:14px;
 pointer-events:auto;
 }
 .shopTop{
 position:absolute;left:50%;top: calc(var(--hudH) + 12px);
 transform:translateX(-50%);
 z-index:12;
 display:flex;gap:10px;
 pointer-events:auto;
 }
 .shopTop .btn{
 background: linear-gradient(180deg, rgba(255,255,255,.10), rgba(0,0,0,.25));
 border:1px solid rgba(255,255,255,.16);
 box-shadow: 0 10px 26px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.10);
 }

 .rerollCost{ display:inline-flex; align-items:center; gap:6px; margin-left:6px; font-weight:900; color:var(--gold); }
 .rerollCost .moneyIcon{ width:16px; height:16px; }
 .shopCountdown{
 position:absolute; left:50%;
 top: calc(var(--hudH) + 56px);
 transform:translateX(-50%);
 z-index:12;
 padding:6px 12px;
 border-radius:14px;
 background: var(--glass);
 border: 1px solid var(--stroke);
 box-shadow: var(--shadow);
 font-size:12px;
 color: var(--muted);
 backdrop-filter: blur(10px);
 pointer-events:none;
 white-space:nowrap;
 }

 .shopTop .btn:hover{
 background: linear-gradient(180deg, rgba(255,255,255,.14), rgba(0,0,0,.28));
 }
 .pane{
 background:rgba(0,0,0,.55);
 border:1px solid rgba(255,255,255,.12);
 border-radius:18px;box-shadow:var(--shadow);
 backdrop-filter: blur(10px);
 padding:12px;
 overflow:hidden;
 }
 .pane h3{margin:0 0 10px;font-size:15px}

 .bagGrid{
 display:grid;
 grid-template-columns: repeat(5, 66px);
 gap:6px;
 align-content:start;
 }
 .slot{
 width:66px;height:66px;border-radius:12px;
 background:rgba(255,255,255,.06);
 border:1px solid rgba(255,255,255,.12);
 display:grid;place-items:center;
 overflow:hidden;
 cursor:pointer;
 position:relative;
 }
 .slot.slot-epic{
 border-color:rgba(184,107,255,.65);
 box-shadow:0 0 0 1px rgba(184,107,255,.30), 0 0 18px rgba(184,107,255,.28);
 }
 .slot.slot-legendary{
 border-color:rgba(255,204,67,.70);
 box-shadow:0 0 0 1px rgba(255,204,67,.28), 0 0 18px rgba(255,204,67,.26);
 }
 .slot.slot-epic img{ filter: drop-shadow(0 0 10px rgba(184,107,255,.28)); }
 .slot.slot-legendary img{ filter: drop-shadow(0 0 12px rgba(255,204,67,.24)); }

 .slot.slot-common{
 border-color:rgba(82,214,106,.55);
 box-shadow:0 0 0 1px rgba(82,214,106,.22), 0 0 16px rgba(82,214,106,.18);
 }
 .slot.slot-common img{ filter: drop-shadow(0 0 10px rgba(82,214,106,.18)); }

 .rarity-common{ color: rgba(82,214,106,.95); font-weight:900; }
 .stat-str{ color: var(--cSTR); font-weight:900; }
 .stat-int{ color: var(--cINT); font-weight:900; }
 .stat-vit{ color: var(--cVIT); font-weight:900; }
 .stat-dur{ color: var(--cDUR); font-weight:900; }
 .stat-agi{ color: var(--cAGI); font-weight:900; }
 .stat-bless{ color: var(--cBLESS); font-weight:900; }
 .stat-def{ color: var(--cDEF); font-weight:900; }
 .stat-dmg{ color: var(--cDMG); font-weight:900; }
 .stat-req{ color:#aaa; font-weight:700; }
 .stat-dmg{ color: var(--gold); font-weight:900; }
 .stat-def{ color: var(--cDUR); font-weight:900; }

 .slot img{width:100%;height:100%;object-fit:contain;pointer-events:none}
 .slot.dragOver{outline:2px solid rgba(70,170,255,.55)}

 .invAvatar{
 position:absolute;left:50%;top:50%;
 transform:translate(-50%,-50%);
 width:240px;height:240px;
 object-fit:contain;
 opacity:.98;
 pointer-events:none;
 filter: drop-shadow(0 18px 22px rgba(0,0,0,.55));
 }
 .equipWrap{position:relative;height:clamp(360px, 40vh, 520px);max-width:980px;width:100%;margin-top:-6px;}

 .equipTitleRow{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;}
 .equipSpecLine{color:#cfcfcf;font-size:12px;opacity:.9;}

 .equipSlot{
 position:absolute;
 width:72px;height:72px;border-radius:14px;
 background:rgba(0,0,0,.35);
 border:1px solid rgba(255,255,255,.16);
 display:grid;place-items:center;
 overflow:hidden;
 cursor:pointer;
 pointer-events:auto;
 }
 .equipSlot.slot-epic{
 border-color:rgba(184,107,255,.65);
 box-shadow:0 0 0 1px rgba(184,107,255,.30), 0 0 18px rgba(184,107,255,.28);
 }
 .equipSlot.slot-legendary{
 border-color:rgba(255,204,67,.70);
 box-shadow:0 0 0 1px rgba(255,204,67,.28), 0 0 18px rgba(255,204,67,.26);
 }

 .equipSlot img{width:100%;height:100%;object-fit:contain;pointer-events:none}
 .equipSlot.dragOver{outline:2px solid rgba(255,215,0,.55)}

 .detailBox{
 font-size:12px;color:var(--muted);line-height:1.35;
 border:1px solid rgba(255,255,255,.10);
 background:rgba(255,255,255,.04);
 border-radius:14px;padding:10px;
 height:170px;
 overflow:auto;
 }

 .invTooltip{
 position:fixed;z-index:9001;
 min-width:220px;max-width:320px;
 background:rgba(0,0,0,.88);
 border:1px solid rgba(255,255,255,.14);
 border-radius:12px;
 padding:10px 12px;
 color:#e9e9e9;
 box-shadow:0 14px 30px rgba(0,0,0,.55);
 pointer-events:none;
 display:none;
 }
 .invTooltip .ttTitle{font-weight:800;font-size:14px;margin-bottom:6px;}
 .invTooltip .ttSub{color:#bdbdbd;font-size:12px;margin-top:6px;}

.detailBox b{color:#fff}
 .detailActions{display:flex;gap:10px;margin-top:10px;}
 .sellBtn{
 flex:1;
 padding:10px 12px;border-radius:12px;
 border:1px solid rgba(255,255,255,.14);
 background:linear-gradient(180deg, rgba(255,215,0,.18), rgba(255,215,0,.08));
 font-weight:900;color:#fff;cursor:pointer;
 }
 .sellBtn:hover{background:linear-gradient(180deg, rgba(255,215,0,.28), rgba(255,215,0,.10))}

 .shopCenter{
 display:flex;flex-direction:column;gap:10px;
 justify-content:flex-end;
 padding-bottom:72px;
 align-items:center;
 }
 .offersGrid{
 width:min(980px, 96%);
 display:grid;
 grid-template-columns: repeat(2, minmax(340px, 1fr));
 gap: 6px;
 justify-items:center;
 }
 .itemCard{
 width:100%;
 background:rgba(0,0,0,.45);
 border:1px solid rgba(255,255,255,.14);
 border-radius:18px;
 box-shadow:var(--shadow);
 padding:12px;
 backdrop-filter: blur(8px);
 display:grid;
 grid-template-columns: 120px 1fr;
 gap:12px;
 align-items:center;
 min-height:128px;
 }
 .itemIcon{
 width:120px;height:120px;border-radius:18px;
 background:rgba(255,255,255,.08);
 border:1px solid rgba(255,255,255,.14);
 display:grid;place-items:center;
 overflow:hidden;
 }
 .itemIcon img{width:100%;height:100%;object-fit:contain}
 .itemInfo b{display:block;font-size:14px;line-height:1.1}
 .itemInfo small{display:block;color:var(--muted);font-size:12px;margin-top:6px;line-height:1.2}
 .buyRow{display:flex;justify-content:space-between;align-items:center;margin-top:8px}
 .price{color:var(--gold);font-weight:900;font-size:13px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
 .pricePart{display:inline-flex;align-items:center;gap:6px;color:var(--gold);font-weight:900}
 .pricePart:nth-child(2){color:#4db6ff}
 .priceIcon{width:18px;height:18px;object-fit:contain;filter: drop-shadow(0 2px 4px rgba(0,0,0,.55));}
 .priceGap{display:inline-block;width:10px}

 .cur{display:inline-flex;align-items:center;gap:6px;font-weight:900;line-height:1}
.curIcon{width:18px;height:18px;flex:0 0 18px;filter: drop-shadow(0 2px 4px rgba(0,0,0,.55));}
 .curNum{font-weight:900}
 .curGold{color:var(--gold)}
 .curCry{color:#4db6ff}

 .buyBtn{
 padding:10px 14px;border-radius:12px;
 border:1px solid rgba(255,255,255,.18);
 background:linear-gradient(180deg, rgba(255,235,120,.95), rgba(255,170,0,.85));
 cursor:pointer;font-weight:1000;
 color:#2b1a00;
 box-shadow: 0 10px 20px rgba(0,0,0,.35), 0 0 18px rgba(255,200,0,.35);
 }
 .buyBtn:hover{
 background:linear-gradient(180deg, rgba(255,245,160,1), rgba(255,190,30,.92));
 box-shadow: 0 10px 22px rgba(0,0,0,.35), 0 0 22px rgba(255,210,0,.45);
 }

 .invWrap{
 position:absolute;inset:0;
 top:calc(var(--hudH) - 28px);
 display:flex;flex-direction:column;align-items:center;
 gap:8px;padding:4px 10px 10px;z-index:2;
 overflow:auto;
 height:calc(100vh - (var(--hudH) - 28px));
 box-sizing:border-box;
 }
 .invPanel{
 background:rgba(0,0,0,.55);
 border:1px solid rgba(255,255,255,.12);
 border-radius:18px;box-shadow:var(--shadow);
 backdrop-filter: blur(10px);
 padding:12px;
 overflow:visible;
 position:relative;
 width:min(980px, 92vw);
 }

 .invTitleRow{
 display:flex;align-items:center;justify-content:space-between;
 gap:10px;margin-bottom:8px;
 }
 .invPager{display:flex;align-items:center;gap:8px;font-weight:700;color:rgba(255,255,255,.85);}
 .invPagerBtn{
 width:30px;height:30px;border-radius:10px;
 border:1px solid rgba(255,255,255,.14);
 background:rgba(0,0,0,.25);
 color:var(--text);
 cursor:pointer;
 }
 .invPagerBtn:hover{border-color: rgba(246,213,106,.35);}

.invTitle{margin:0 0 10px;font-size:16px}

 .invStatsRow{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px;}
 .invStatsRow .invStatsBox{flex:1;min-width:180px;}

 .invStatsBox{
 border:1px solid rgba(255,255,255,.10);
 background:rgba(255,255,255,.04);
 border-radius:14px;
 padding:8px;
 margin-top:0;
 font-size:11px;
 color:var(--muted);
 }
 .invStatsBox .row{display:flex;justify-content:space-between;align-items:center;padding:3px 0}
 .invStatsBox .row b{color:#fff;font-weight:900}

 .statKey{font-weight:900;letter-spacing:.2px;}
 .statKey.str{color:var(--cSTR)}
 .statKey.int{color:var(--cINT)}
 .statKey.vit{color:var(--cVIT)}
 .statKey.dur{color:var(--cDUR)}
 .statKey.agi{color:var(--cAGI)}
 .statKey.bless{color:var(--cBLESS)}
 .statVal{font-weight:900;color:#fff;min-width:18px;text-align:right;}
 .plusBtn{
 padding:6px 10px;border-radius:10px;
 border:1px solid rgba(255,255,255,.14);
 background:rgba(255,255,255,.06);
 cursor:pointer;font-weight:900;color:#fff;
 }
 .plusBtn:hover{background:rgba(255,255,255,.10)}
 .plusBtn:disabled{opacity:.35;cursor:not-allowed}

 .arenaLayer{
 position:absolute;inset:0;top:var(--hudH);
 z-index:3;
 pointer-events:auto;
 }
 .arenaBoard{
 position:absolute;left:50%;top:50%;
 transform:translate(-50%,-50%);
 width:min(980px, 96vw);
 height:min(520px, 70vh);
 border-radius:22px;
 background:rgba(0,0,0,.28);
 border:1px solid rgba(255,255,255,.10);
 box-shadow:var(--shadow);
 backdrop-filter: blur(8px);
 overflow:hidden;
 }
 .arenaCols{
 position:absolute;inset:0;
 display:grid;
 grid-template-columns: 1fr 1fr;
 padding:22px 26px 120px 26px;
 gap:26px;
 align-items:center;
 }
 .fighterCard{
 display:flex;
 flex-direction:column;
 align-items:center;
 gap:10px;
 position:relative;
 }
 .hpMini{
 width:320px;
 background:rgba(255,255,255,.06);
 border:1px solid rgba(255,255,255,.12);
 border-radius:16px;
 padding:10px 12px;
 box-shadow:var(--shadow);
 }
 .hpMiniTop{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);margin-bottom:8px}
 .hpMiniTop b{color:#fff;font-weight:1000}
 .bar{
 height:14px;border-radius:999px;overflow:hidden;
 background:rgba(0,0,0,.45);
 border:1px solid rgba(255,255,255,.10);
 position:relative;
 }
 .bar > i{
 display:block;height:100%;width:50%;
 border-radius:999px;
 background:linear-gradient(90deg, rgba(255,50,50,1), rgba(255,205,205,1));
 box-shadow:0 0 18px rgba(255,60,60,.40);
 }

 .bigAvatar{
 width:160px;height:160px;border-radius:18px;
 background:rgba(255,255,255,.08);
 border:1px solid rgba(255,255,255,.14);
 box-shadow:var(--shadow);
 overflow:hidden;
 position:relative;
 }
 .bigAvatar img{width:100%;height:100%;object-fit: contain}

 .atkLeft{animation: atkLeft .28s ease-out}
 .atkRight{animation: atkRight .28s ease-out}
 @keyframes atkLeft{
 0%{transform:translateX(0)}
 45%{transform:translateX(54px) scale(1.06)}
 100%{transform:translateX(0)}
 }
 @keyframes atkRight{
 0%{transform:translateX(0)}
 45%{transform:translateX(-54px) scale(1.06)}
 100%{transform:translateX(0)}
 }
 .shake{animation:shake .35s}
 @keyframes shake{
 0%{transform:translateX(0)}
 25%{transform:translateX(-10px)}
 50%{transform:translateX(10px)}
 75%{transform:translateX(-8px)}
 100%{transform:translateX(0)}
 }

 .statsPanel{
 width:320px;
 border-radius:16px;
 padding:12px 12px;
 background:linear-gradient(180deg, rgba(0,0,0,.45), rgba(0,0,0,.25));
 border:1px solid rgba(255,255,255,.12);
 box-shadow:var(--shadow);
 font-size:12px;
 color:var(--muted);
 }
 .statsPanel .row{display:flex;justify-content:space-between;padding:2px 0}
 .statsPanel b{color:#fff;font-weight:1000}

 .dmgFloat{
 position:absolute;color:var(--red);
 font-weight:1000;
 text-shadow:0 6px 14px rgba(0,0,0,.85), 0 0 18px rgba(255,60,60,.35);
 animation: floatUp .95s ease-out forwards;
 pointer-events:none;z-index:20;
 font-size: 36px;letter-spacing:.5px;
 transform: translate(-50%,0);
 }
 .dmgFloat.critDmg{
 font-size:44px;
 text-shadow:0 10px 20px rgba(0,0,0,.9), 0 0 28px rgba(255,60,60,.60);
 }

 .poisonDmg{
 color:#5e8f2a;
 text-shadow:
 0 0 6px rgba(120,180,60,.55),
 0 0 14px rgba(80,140,40,.45),
 0 10px 20px rgba(0,0,0,.9);
 animation: plaguePulse 1.4s ease-in-out infinite alternate;
 }
 @keyframes plaguePulse{
 0%{ filter:brightness(.95) saturate(.9); }
 100%{ filter:brightness(1.10) saturate(1.10); }
 }

.healDmg{
 color:#6aff9c;
 text-shadow:
 0 10px 20px rgba(0,0,0,.9),
 0 0 22px rgba(100,255,170,.65);
}

.combatActorProc{
 position:fixed;
 transform:translate(-50%,-50%);
 z-index:2147482750;
 pointer-events:none;
 white-space:nowrap;
 font-size:clamp(28px,3vw,42px);
 line-height:1;
 font-weight:1000;
 letter-spacing:1px;
 animation:combatActorProcCenter .9s ease-out forwards;
}
.combatActorProc.overload{
 color:#d9c5ff;
 text-shadow:0 3px 10px #000,0 0 12px #763dff,0 0 28px rgba(92,173,255,.95);
}
@keyframes combatActorProcCenter{
 0%{opacity:0;transform:translate(-50%,-50%) scale(.72);}
 15%,62%{opacity:1;transform:translate(-50%,-50%) scale(1.06);}
 100%{opacity:0;transform:translate(-50%,-68%) scale(1);}
}

.poisonPuff{
 position:fixed;
 width:64px; height:64px;
 border-radius:50%;
 pointer-events:none;
 background:
 radial-gradient(circle at 35% 40%, rgba(150,220,90,.55), rgba(90,150,50,.15) 55%, rgba(0,0,0,0) 70%),
 radial-gradient(circle at 70% 65%, rgba(90,170,60,.35), rgba(0,0,0,0) 65%);
 filter: blur(1.5px);
 opacity:0;
 transform: translate(-50%,-50%) scale(.7);
 animation: poisonPuff 900ms ease-out forwards;
 z-index: 9999;
 }
 @keyframes poisonPuff{
 0%{ opacity:0; transform: translate(-50%,-50%) scale(.7); }
 15%{ opacity:.85; }
 100%{ opacity:0; transform: translate(-50%,-58%) scale(1.45); }
 }
 @keyframes floatUp{
 0%{transform:translate(-50%, 0); opacity:1}
 100%{transform:translate(-50%, -96px); opacity:0}
 }

 .statusPop, .poisonPop, .ragePop{
 position:absolute;
 top:-22px; left:50%;
 transform:translateX(-50%);
 padding:4px 10px;
 border-radius:999px;
 font-weight:900;
 font-size:12px;
 letter-spacing:.4px;
 color:#fff;
 background:rgba(0,0,0,.55);
 border:1px solid rgba(255,255,255,.18);
 text-shadow:0 2px 6px rgba(0,0,0,.7);
 animation: popUp .85s ease forwards;
 pointer-events:none;
 }
 .poisonPop{ background:rgba(20,120,40,.55); border-color:rgba(80,255,140,.25); }
 .ragePop{ background:rgba(200,40,40,.55); border-color:rgba(255,120,120,.25); }
.critPop{
 position:absolute;left:50%; top:22%;
 transform:translate(-50%,-50%);
 font-weight:1000;font-size:38px;
 color:#fff;letter-spacing:1px;
 text-shadow:0 10px 22px rgba(0,0,0,.85), 0 0 26px rgba(255,60,60,.65);
 animation: critPop .65s ease-out forwards;
 pointer-events:none;z-index:25;
 }
 @keyframes critPop{
 0%{transform:translate(-50%,-50%) scale(.6); opacity:0}
 20%{transform:translate(-50%,-50%) scale(1.25); opacity:1}
 100%{transform:translate(-50%,-110%) scale(1); opacity:0}
 }

 .escapeBtn{
 position:absolute;left:14px;top: calc(var(--hudH) + 14px);
 z-index:10;pointer-events:auto;
 display:none;
 }
 .arenaAtkCenter{
 position:absolute;left:50%;bottom:6px;transform:translateX(-50%);
 z-index:16;
 display:flex;align-items:center;justify-content:center;gap:10px;
 width:auto;max-width:none;
 pointer-events:auto;
 }
 #btnSkipFight{
 min-width:148px;
 min-height:32px;
 padding:6px 14px;
 font-size:12px;
 font-weight:1000;
 letter-spacing:.15px;
 box-shadow: 0 8px 18px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.08);
 border-radius:12px;
 white-space:nowrap;
 display:inline-flex;
 align-items:center;
 justify-content:center;
 gap:7px;
 }
 #btnSkipFight .skipIco{
 font-size:13px;
 line-height:1;
 opacity:.98;
 filter: drop-shadow(0 2px 4px rgba(0,0,0,.45));
 }
 .arenaLeftBtns{
 position:absolute;left:28px;bottom:18px;
 display:flex;gap:10px;z-index:12;
 }

 #settingsModal{z-index:120;display:none;background:rgba(0,0,0,.55);backdrop-filter: blur(10px);}

#createModal .createRight{ overflow:hidden; }
#createModal .createRight

#createAvatarMain{
 width: 100%;
 max-width: 420px;
 height: 190px;
 display:block;
 margin: 0 auto 12px;
 border-radius: 16px;
 object-fit: contain;
 border: 1px solid rgba(255,255,255,.14);
 box-shadow: 0 10px 28px rgba(0,0,0,.35);
 background: rgba(255,255,255,.06);
}
#createPanel .createAvatarGrid{
 display:grid;
 grid-template-columns: repeat(3, 1fr);
 gap: 10px;
 width: 100%;
 max-width: 420px;
 margin: 0 auto;
}
#createPanel .avatarPick{
 width: 100%;
 aspect-ratio: 1 / 1;
 height: auto;
 display:block;
 border-radius: 14px;
 object-fit: contain;
 border: 1px solid rgba(255,255,255,.14);
 background: rgba(255,255,255,.06);
 cursor: pointer;
 transition: transform .12s ease, box-shadow .12s ease, outline-color .12s ease;
}
#createPanel .avatarPick:hover{
 transform: translateY(-1px);
 box-shadow: 0 8px 18px rgba(0,0,0,.35);
}
#createPanel .avatarPick.selected{
 outline: 3px solid rgba(255, 214, 106, .95);
 box-shadow: 0 0 0 4px rgba(255, 214, 106, .20), 0 10px 22px rgba(0,0,0,.35);
}
#createModal .createRight .avatarPick img{
 width:100%;
 height:100%;
 object-fit: contain;
 display:block;
}

 .rarity-common{color:#56e06f;font-weight:900;text-shadow:0 2px 8px rgba(0,0,0,.65);}

 .rarity-epic{color:#b86bff;font-weight:900;text-shadow:0 2px 12px rgba(0,0,0,.75);}
 .itemCard.epicGlow{
 border-color: rgba(184,107,255,.55);
 box-shadow:
 0 0 0 2px rgba(184,107,255,.22),
 0 0 18px rgba(184,107,255,.18),
 var(--shadow);
 animation: epicPulse 2.2s ease-in-out infinite;
 }
 @keyframes epicPulse{
 0%,100%{ filter: brightness(1); }
 50%{ filter: brightness(1.08); }
 }

 .rarity-common{color:rgba(82,214,106,.95);font-weight:900;text-shadow:0 2px 12px rgba(0,0,0,.75);}
 .itemCard.commonGlow{
 border-color: rgba(82,214,106,.55);
 box-shadow:
 0 0 0 2px rgba(82,214,106,.18),
 0 0 18px rgba(82,214,106,.16),
 var(--shadow);
 }
.rarity-legendary{color:#ffcc43;font-weight:900;text-shadow:0 2px 14px rgba(0,0,0,.80);}
 .itemCard.legendaryGlow{
 box-shadow:0 0 0 4px rgba(255, 204, 67, .18), 0 0 26px rgba(255, 204, 67, .22), 0 14px 28px rgba(0,0,0,.45);
 animation: legendaryPulse 2.2s ease-in-out infinite;
 }
 @keyframes legendaryPulse{
 0%,100%{ box-shadow:0 0 0 4px rgba(255, 204, 67, .14), 0 0 20px rgba(255, 204, 67, .18), 0 14px 28px rgba(0,0,0,.45);}
 50%{ box-shadow:0 0 0 4px rgba(255, 204, 67, .22), 0 0 34px rgba(255, 204, 67, .30), 0 18px 34px rgba(0,0,0,.55);}
 }

 #rewardModal{
 position:fixed; inset:0; display:none; align-items:center; justify-content: center;
 background:rgba(0,0,0,.55); z-index:9001;
 }
 #rewardModal.show{ display:flex; }
 #rewardCard{
 width:min(520px, 92vw);
 background:linear-gradient(180deg, rgba(30,30,40,.92), rgba(15,15,20,.92));
 border:1px solid rgba(255,255,255,.12);
 border-radius:18px;
 box-shadow:0 22px 70px rgba(0,0,0,.65);
 padding:18px 18px 14px;
 backdrop-filter: blur(10px);
 transform:translateY(34px);
 animation: rewardIn .22s ease-out forwards;
 }
 @keyframes rewardIn{ to{ transform:translateY(0);} }
 #rewardTitle{
 font-weight:1000; font-size:22px; letter-spacing:.4px;
 text-shadow:0 10px 22px rgba(0,0,0,.75);
 margin:0 0 10px;
 }
 #rewardRows{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:10px;}
 .rewardPill{
 display:flex; align-items:center; gap:8px;
 padding:8px 10px; border-radius:999px;
 background:rgba(255,255,255,.06);
 border:1px solid rgba(255,255,255,.10);
 font-weight:900;
 }
 .rewardPill img{ width:18px; height:18px; }
 #rewardItem{
 display:flex; gap:12px; align-items:center;
 background:rgba(0,0,0,.22);
 border:1px solid rgba(255,255,255,.10);
 border-radius:14px;
 padding:10px 12px;
 margin-bottom:12px;
 }
 #rewardItem img{ width:54px; height:54px; object-fit:contain; filter:drop-shadow(0 10px 18px rgba(0,0,0,.55));}
 #rewardItemName{ font-weight:1000; }
 #btnRewardOk{ width:100%; }
#btnRewardAlt{ width:100%; display:none; margin-top:10px; }

 .rarityBadge{
 display:inline-flex;align-items:center;justify-content: center;
 padding:3px 8px;border-radius:999px;
 font-size:11px;font-weight:1000;letter-spacing:.6px;
 border:1px solid rgba(255,255,255,.14);
 background:rgba(255,255,255,.06);
 text-transform:uppercase;
 }
 .rarityBadge.epic{
 color:#d6b2ff;
 box-shadow:0 0 18px rgba(184,107,255,.18);
 }
 .rarityBadge.legendary{
 color:#ffdc66;
 box-shadow:0 0 20px rgba(255,204,67,.22);
 }

 #rewardCard::before{
 content:"";
 position:absolute; inset:-2px;
 border-radius:20px;
 background:radial-gradient(circle at 15% 20%, rgba(255,255,255,.14), transparent 35%),
 radial-gradient(circle at 85% 30%, rgba(255,204,67,.14), transparent 40%),
 radial-gradient(circle at 30% 85%, rgba(184,107,255,.12), transparent 45%);
 opacity:.9;
 pointer-events:none;
 filter: blur(0.2px);
 animation: sparkleMove 3.2s ease-in-out infinite;
 z-index:-1;
 }
 @keyframes sparkleMove{
 0%,100%{ transform:translateY(0); opacity:.85; }
 50%{ transform:translateY(-6px); opacity:1; }
 }
 #rewardCard{ position:relative; overflow:hidden; }

 .btn.btnRpg{
 display:inline-flex;align-items:center;gap:8px;
 padding:10px 14px;border-radius:14px;
 background:linear-gradient(180deg, rgba(60,50,25,.55), rgba(15,15,15,.55));
 border:1px solid rgba(246,213,106,.35);
 box-shadow: 0 10px 24px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.08);
 color:#f7f2e6;
 backdrop-filter: blur(8px);
 }
 .btn.btnRpg:hover{
 border-color: rgba(246,213,106,.55);
 box-shadow: 0 12px 30px rgba(0,0,0,.45), 0 0 18px rgba(246,213,106,.18), inset 0 1px 0 rgba(255,255,255,.10);
 transform: translateY(-1px);
 }
 .btn.btnRpg:active{transform: translateY(0px);}

 .btnIco{
 width:20px;height:20px;display:inline-flex;align-items:center;justify-content: center;
 color: rgba(246,213,106,.95);
 filter: drop-shadow(0 2px 6px rgba(0,0,0,.55));
 flex:0 0 auto;
 }
 .btnIco svg{width:20px;height:20px;display:block;}
 .btnTxt{font-weight:800;letter-spacing:.2px;}

 .rerollCost{
 display:inline-flex;align-items:center;gap:6px;
 padding:6px 10px;border-radius:999px;
 background: rgba(0,0,0,.35);
 border:1px solid rgba(255,255,255,.10);
 margin-left:6px;
 }
 .moneyIconBig{width:22px;height:22px;}
 .goldNum{color: var(--gold); font-weight:900;}

 #hud .money{
 display:inline-flex;align-items:center;gap:8px;
 padding:8px 12px;border-radius:999px;
 background: rgba(0,0,0,.25);
 border:1px solid rgba(255,255,255,.10);
 }
 #hud .moneyIcon{
 width:18px;height:18px;
 filter: drop-shadow(0 2px 8px rgba(0,0,0,.65));
 }
 #hud #hudGold, #hud #hudGems{
 font-family: "Cinzel", "Trajan Pro", "Georgia", "Times New Roman", serif;
 font-weight: 900;
 letter-spacing: .4px;
 font-size: 18px;
 text-shadow: 0 2px 10px rgba(0,0,0,.65);
 }
 #hud #hudGold{color: var(--gold);}
 #hud #hudGems{color: #58b6ff;}

#eAvatarBox.poisoned img{ filter: none; }
#eAvatarBox.poisoned::before{
 content:"";
 position:absolute;
 inset:-8px;
 border-radius:22px;
 pointer-events:none;
 background:
 radial-gradient(circle at 30% 40%, rgba(90,160,40,.35), transparent 60%),
 radial-gradient(circle at 70% 60%, rgba(60,120,30,.25), transparent 65%);
 filter: blur(12px);
 animation: plagueFog 2.4s ease-in-out infinite alternate;
 z-index:3;
}
@keyframes plagueFog{
 0%{ opacity:.6; transform:scale(1); }
 100%{ opacity:.9; transform:scale(1.05); }
}
#eAvatarBox.stunned::after{
 content:"Zzz";
 position:absolute;
 top:-10px; right:8px;
 font-weight:900;
 letter-spacing:.5px;
 color:#d7d7ff;
 text-shadow:0 2px 10px rgba(0,0,0,.45);
 transform: rotate(-12deg);
 pointer-events:none;
}

#hud{
 padding:12px 26px !important;
 gap:18px !important;
 background:
 radial-gradient(var(--gameW) 120px at 50% 0%, rgba(246,213,106,.18), rgba(0,0,0,0) 60%),
 linear-gradient(180deg, rgba(35,22,10,.92), rgba(10,10,10,.55)) !important;
 border-bottom:1px solid rgba(246,213,106,.28) !important;
}
#hud::before{
 content:"";
 position:absolute; inset:0;
 pointer-events:none;
 background:
 repeating-linear-gradient(90deg, rgba(255,255,255,.04) 0 1px, rgba(0,0,0,0) 1px 10px);
 opacity:.12;
}
#hud .left{ margin-left:22px !important; }
.hudProfile{
 background:linear-gradient(180deg, rgba(90,58,22,.55), rgba(15,15,15,.60)) !important;
 border:1px solid rgba(246,213,106,.40) !important;
 box-shadow: 0 12px 28px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.10) !important;
}
#hud .avatar{
 width:56px !important; height:56px !important;
 border-radius:14px !important;
 border:1px solid rgba(246,213,106,.28) !important;
}
#hud .namebox b{ font-family:"Cinzel","Trajan Pro","Georgia",serif !important; letter-spacing:.3px; }
#hud .namebox .lvl{
 display:inline-flex; align-items:center; justify-content: center;
 padding:2px 8px; border-radius:999px;
 background:rgba(0,0,0,.35);
 border:1px solid rgba(246,213,106,.25);
 color:#f7e8b3;
 margin-top:4px;
}
.midPill{
 background:linear-gradient(180deg, rgba(90,58,22,.45), rgba(15,15,15,.55)) !important;
 border:none !important;
 box-shadow: 0 14px 30px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.08) !important;
}
#hud .money{
 gap:10px !important;
}
#hud .moneyIcon{
 width:18px !important;
 height:18px !important;
 filter: drop-shadow(0 6px 10px rgba(0,0,0,.55));
}
#hud #hudGold{ font-size:18px !important; text-shadow: 0 2px 10px rgba(0,0,0,.65); }
#hud #hudGems{ font-size:18px !important; text-shadow: 0 2px 10px rgba(0,0,0,.65); }
#hud .xpHud{
 background:rgba(0,0,0,.35) !important;
 border:1px solid rgba(246,213,106,.18) !important;
}

.midRow{
 display:flex;
 align-items:center;
 gap: 0px;
 pointer-events:auto;
}

.currencyFrame{
 position:relative;
 width: 420px;
 height: 128px;
 background-repeat:no-repeat;
 background-position:center;
 background-size:contain;
 display:flex;
 align-items:center;
 justify-content:center;

 box-sizing:border-box;
 position:relative;
 filter: drop-shadow(0 6px 10px rgba(0,0,0,.55));
}

.goldFrame{ --bar-center: 62%;
 background-image:url("img/ram_gold.png"); }
.gemFrame{ --bar-center: 63%;
 background-image:url("img/ram_krystal.png"); margin-left: -160px;
}

.currencyValue{
 position:absolute;
 left: var(--bar-center, 62%);
 top: 50%;
 transform: translate(-50%, -50%);
 width: 60%;
 text-align: center;
 font-family: "Cinzel", "Trajan Pro", "Georgia", serif;
 font-size: 36px;
 font-weight: 800;
 letter-spacing: .5px;
 user-select:none;
 pointer-events:none;
}

.goldText{
 color:#ffd36a;
 text-shadow: 0 0 10px rgba(255,196,74,.55), 0 2px 2px rgba(0,0,0,.65);
}
.gemText{
 color:#7ad7ff;
 text-shadow: 0 0 10px rgba(90,190,255,.6), 0 2px 2px rgba(0,0,0,.65);
}

.goldFrame{
 animation: goldPulse 2.6s ease-in-out infinite;
}
@keyframes goldPulse{
 0%,100%{ filter: drop-shadow(0 6px 10px rgba(0,0,0,.55)) drop-shadow(0 0 0 rgba(255,196,74,0)); }
 50%{ filter: drop-shadow(0 6px 10px rgba(0,0,0,.55)) drop-shadow(0 0 14px rgba(255,196,74,.32)); }
}

.gemFrame{
 animation: gemPulse 2.6s ease-in-out infinite;
 margin-left: -160px;
}
@keyframes gemPulse{
 0%,100%{ filter: drop-shadow(0 6px 10px rgba(0,0,0,.55)) drop-shadow(0 0 0 rgba(80,180,255,0)); }
 50%{ filter: drop-shadow(0 6px 10px rgba(0,0,0,.55)) drop-shadow(0 0 12px rgba(90,190,255,.35)); }
}

 #deathFlash{
 position:fixed; inset:0;
 background:rgba(255,0,0,.22);
 opacity:0;
 pointer-events:none;
 z-index:999998;
 transition: opacity .12s ease;
 }
 #deathFlash.show{ opacity:1; }

 #rewardCard.defeat{
 border-color: rgba(255,80,80,.38) !important;
 box-shadow: 0 16px 42px rgba(0,0,0,.55), 0 0 28px rgba(255,60,60,.12);
 }
 #rewardCard.defeat #rewardTitle{ color: #ffb0b0; text-shadow: 0 0 16px rgba(255,80,80,.25); }

.plusTag{
 display:inline-block;
 padding:2px 6px;
 border-radius:999px;
 font-weight:900;
 font-size:12px;
 margin-left:6px;
 color:#ffd66b;
 background:rgba(0,0,0,.35);
 border:1px solid rgba(255,214,107,.35);
 text-shadow:0 0 8px rgba(255,214,107,.35);
}

.upCorner{
 position:absolute;
 top:4px;
 left:4px;
 z-index:5;
 padding:1px 6px;
 border-radius:10px;
 font-weight:1000;
 font-size:11px;
 line-height:1.2;
 color:#ffd66b;
 background:rgba(0,0,0,.50);
 border:1px solid rgba(255,214,107,.38);
 text-shadow:0 0 10px rgba(255,214,107,.35);
 pointer-events:none;
}

.slot-plus5, .itemPlus5{
 animation: forgePulse 1.8s infinite ease-in-out;
}
@keyframes forgePulse{
 0%{ box-shadow:0 0 10px rgba(255,200,60,.35), 0 0 0 rgba(255,200,60,0); }
 50%{ box-shadow:0 0 26px rgba(255,200,60,.85), 0 0 16px rgba(255,200,60,.35); }
 100%{ box-shadow:0 0 10px rgba(255,200,60,.35), 0 0 0 rgba(255,200,60,0); }
}

.shardPill{
 display:flex;
 align-items:center;
 gap:8px;
 padding:10px 14px;
 border-radius:14px;
 background:rgba(0,0,0,.18);
 border:1px solid rgba(255,255,255,.12);
 box-shadow: 0 10px 24px rgba(0,0,0,.35) inset;
 font-weight:900;
 color:#d6d6d6;
 min-width:110px;
 justify-content:center;
}

.upgTag{display:inline-block;margin-left:6px;font-weight:1000;color:#ffd36a;text-shadow:0 0 10px rgba(255,205,90,.35);}

#leftHudMenu{
 position:absolute;
 left:18px;
 top: calc(var(--hudH) + 28px);
 width:220px;
 padding:16px 14px 14px;
 border-radius:20px;
 background: transparent;
 border: none;
 box-shadow: none;
 backdrop-filter: blur(6px);
 z-index:9100;
 display:block;
}
#leftHudMenu::before{
 content:"";
 position:absolute; inset:0;
 border-radius:20px;
 pointer-events:none;
 box-shadow: inset 0 0 28px rgba(255,180,80,.08);
 opacity:.95;
}

#leftHudMenu{
 z-index: 200000 !important;
 pointer-events: auto !important;
}
#leftHudMenu *{
 pointer-events: auto !important;
}
.cityOverlay,
#inventoryScreen.overlayOnCity,
.screen.active .bgWrap,
.screen.active .bg,
.bgWrap,
.bg{
 pointer-events: none;
}
.cityOverlay .coHeader,
.cityOverlay .coBody,
.cityOverlay .coTabs,
.cityOverlay .coTab,
.cityOverlay .coClose,
#inventoryScreen.overlayOnCity .invWrap,
#inventoryScreen.overlayOnCity .invPanel,
#inventoryScreen.overlayOnCity .slot,
#inventoryScreen.overlayOnCity .equipSlot,
#inventoryScreen.overlayOnCity button,
#inventoryScreen.overlayOnCity input,
#inventoryScreen.overlayOnCity select,
#inventoryScreen.overlayOnCity textarea,
#inventoryScreen.overlayOnCity .invPagerBtn,
.shopLayout,
.shopLayout *,
.colMenu,
.colMenu *,
.dunWrap,
.dunWrap *,
.arenaLayer,
.arenaLayer *{
 pointer-events: auto;
}
#leftHudMenu .lhTitle{
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-weight:1000;
 letter-spacing:.6px;
 margin-bottom:12px;
 color:#f2e2c5;
 text-shadow:0 10px 22px rgba(0,0,0,.75);
}
.lhBtn{
 width:100%;
 display:flex;
 align-items:center;
 justify-content:flex-start;
 gap:10px;
 padding:12px 12px;
 margin:10px 0;
 border-radius:14px;
 border:1px solid rgba(255,200,120,.18);
 background:linear-gradient(180deg, rgba(48,44,38,.92), rgba(20,18,16,.92));
 color:#d8c7a3;
 font-weight:1000;
 letter-spacing:.2px;
 cursor:pointer;
 box-shadow: 0 12px 26px rgba(0,0,0,.50), inset 0 1px 0 rgba(255,255,255,.06);
}
.lhBtn:hover{
 filter:brightness(1.06);
 box-shadow: 0 14px 30px rgba(0,0,0,.55), 0 0 18px rgba(255,200,80,.12), inset 0 1px 0 rgba(255,255,255,.08);
}
.lhBtn.active{
 background:linear-gradient(180deg, rgba(90,70,30,.92), rgba(40,30,14,.92));
 border-color: rgba(255,210,120,.38);
 color:#fff3c9;
 box-shadow: 0 14px 32px rgba(0,0,0,.55), 0 0 22px rgba(255,210,80,.24), inset 0 1px 0 rgba(255,255,255,.10);
}

#leftHudMenu .lhBtn.imgBtn{
 position:relative;
 height:56px;
 padding:0;
 border:none;
 background:transparent;
 box-shadow:none;
 justify-content:center;
}
#leftHudMenu .lhBtn.imgBtn::before{
 content:"";
 position:absolute;
 inset:0;
 background-image: var(--btn-img);
 background-repeat:no-repeat;
 background-position:center;
 background-size: 100% 100%;
 image-rendering: crisp-edges;
 image-rendering: -webkit-optimize-contrast;
 filter:none;
 content:"";
 position:absolute;
 inset:0;
 background-image: var(--btn-img);
 background-repeat:no-repeat;
 background-position:center;
 background-size: contain;
 filter: drop-shadow(0 10px 18px rgba(0,0,0,.55));
}
#leftHudMenu .lhBtn.imgBtn:hover::before{ transform: scale(1.02); }
#leftHudMenu .lhBtn.imgBtn.active::before{ filter: drop-shadow(0 14px 26px rgba(0,0,0,.70)) brightness(1.08); }
#leftHudMenu .lhBtn.imgBtn .txt{
 position:relative;
 z-index:2;
 opacity:0;
 pointer-events:none;
}

.cityOverlay{
 position:absolute;
 left:332px;
 overflow:visible;
 right:18px;
 top:96px;
 bottom:18px;
 display:none;
 flex-direction:column;
 border-radius:22px;
 background:
 radial-gradient(circle at 10% 0%, rgba(255,200,120,.08), rgba(0,0,0,0) 55%),
 linear-gradient(180deg, rgba(18,18,22,.86), rgba(10,10,12,.86));
 border:1px solid rgba(255,255,255,.12);
 box-shadow:0 26px 80px rgba(0,0,0,.75);
 backdrop-filter: blur(10px);
 z-index:9050;
}
.cityOverlay.show{ display:flex; }
.coHeader{
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:10px;
 padding:12px 12px 10px;
 border-bottom:1px solid rgba(255,255,255,.10);
}
.coTabs{ display:flex; gap:8px; flex-wrap:wrap; }
.coTab{
 padding:9px 12px;
 border-radius:14px;
 border:1px solid rgba(255,255,255,.10);
 background:linear-gradient(180deg, rgba(60,50,25,.45), rgba(15,15,15,.55));
 color:#f7f1e5;
 font-weight:1000;
 cursor:pointer;
}
.coTab:hover{ filter:brightness(1.05); }
.coTab.active{ outline:2px solid rgba(255,210,120,.35); }
.coClose{
 width:42px;height:38px;
 border-radius:14px;
 border:1px solid rgba(255,255,255,.10);
 background:rgba(0,0,0,.35);
 color:#fff;
 font-weight:1000;
 cursor:pointer;
}
.coBody{
 padding:14px;
 overflow:auto;
 height:100%;
}

#inventoryScreen.overlayOnCity{
 position:absolute;
 left:258px;
 right:18px;
 top: var(--panelTop) !important;
 bottom:18px;
 z-index:9055;
 display:block !important;
 pointer-events:auto;
}
#inventoryScreen.overlayOnCity .bgWrap{ background:none !important; }
#inventoryScreen.overlayOnCity .bg{ background:none !important; }
#inventoryScreen.overlayOnCity .invWrap{ top:0 !important; padding:14px !important; height:100%; }

.attrGrid{
 display:grid;
 grid-template-columns: repeat(2, minmax(260px, 1fr));
 gap:12px;
}
.statCard{
 border:1px solid rgba(255,200,120,.16);
 border-radius:18px;
 padding:14px;
 background:rgba(0,0,0,.28);
 box-shadow: 0 14px 34px rgba(0,0,0,.55);
}
.statCard:hover{
 box-shadow: 0 16px 42px rgba(0,0,0,.60), 0 0 26px rgba(255,200,80,.10);
}
.statHead{ display:flex; align-items:center; gap:12px; }
.statIco{
 width:42px;height:42px;border-radius:14px;
 display:grid;place-items:center;
 background:rgba(255,255,255,.06);
 border:1px solid rgba(255,255,255,.10);
 box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
 font-size:22px;
}
.statName{
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-weight:1000;
 letter-spacing:.4px;
 font-size:18px;
 color:#f3e1b5;
}
.statDesc{ font-size:12px; opacity:.78; color:#e6e6e6; margin-top:2px; }
.statMeta{ display:flex; justify-content:space-between; gap:10px; margin-top:10px; }
.statMeta .pill{
 padding:6px 10px;border-radius:999px;
 background:rgba(0,0,0,.28);
 border:1px solid rgba(255,255,255,.10);
 font-weight:900;font-size:12px;color:#f1f1f1;
}
.statBuyRow{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:12px; }
.statBuyBtn{
 min-width:140px;
 padding:10px 12px;border-radius:14px;
 border:1px solid rgba(255,255,255,.18);
 background:linear-gradient(180deg, rgba(255,235,120,.95), rgba(255,170,0,.85));
 cursor:pointer;font-weight:1000;
 color:#2b1a00;
 box-shadow: 0 10px 20px rgba(0,0,0,.35), 0 0 18px rgba(255,200,0,.28);
}
.statBuyBtn:hover{ filter:brightness(1.05); }
.statBuyBtn:active{ transform: translateY(1px); }
.statBuyBtn.pulse{
 animation: buyPulse .55s ease;
}
@keyframes buyPulse{
 0%{ filter:brightness(1); }
 50%{ filter:brightness(1.12); }
 100%{ filter:brightness(1); }
}
.plusFloat{
 position:absolute;
 left:50%;
 top:18px;
 transform:translateX(-50%);
 font-weight:1000;
 color:#ffd36a;
 text-shadow:0 8px 20px rgba(0,0,0,.85), 0 0 18px rgba(255,210,80,.35);
 animation: plusUp .85s ease forwards;
 pointer-events:none;
}
@keyframes plusUp{
 0%{ transform:translate(-50%,0); opacity:0; }
 10%{ opacity:1; }
 100%{ transform:translate(-50%,-40px); opacity:0; }
}

 body.charselect-active #cityClickBlocker{ display:none !important; }
#cityClickBlocker{
 position:fixed;
 left:0;
 top:0;
 right:0;
 bottom:0;
 z-index:9000;
 display:none;
 background:rgba(0,0,0,0);
 pointer-events:auto;
 }
 #cityClickBlocker.show{ display:block; }

 #inventoryScreen.overlayOnCity .invCloseBtn{
 position:absolute;
 top:10px;
 right:10px;
 width:44px;
 height:40px;
 border-radius:14px;
 border:1px solid rgba(255,255,255,.12);
 background:rgba(0,0,0,.35);
 color:#fff;
 font-weight:1000;
 cursor:pointer;
 z-index:9060;
 display:flex;
 align-items:center;
 justify-content:center;
 box-shadow:0 14px 40px rgba(0,0,0,.6);
 }

 .statPlusBtn, .btnStatPlus, .statIncBtn, .invStatPlus{ display:none !important; }

 .statRow .btns button[data-add]{ display:none !important; }

 .invPager{ position:relative; z-index:99999; }
 .invPagerBtn{ position:relative; z-index:99999; }

 .topBar{
 display:none !important;
 align-items:center;
 justify-content:space-between;
 gap:10px;
 padding:10px 12px;
 border-radius:16px;
 border:1px solid rgba(255,255,255,.10);
 background:rgba(0,0,0,.35);
 box-shadow:0 14px 40px rgba(0,0,0,.6);
 margin: 10px 10px 14px;
 }
 .topTitle{
 font-weight:1000;
 font-size:18px;
 color:#f2e2c5;
 white-space:nowrap;
 }
 .topClose{
 width:44px;height:40px;
 border-radius:14px;
 border:1px solid rgba(255,255,255,.12);
 background:rgba(0,0,0,.35);
 color:#fff;
 font-weight:1000;
 cursor:pointer;
 flex:0 0 auto;
 }
 .topTabs{ display:flex; gap:8px; align-items:center; justify-content:center; flex:1; }
 .tabIco{
 width:42px; height:36px;
 border-radius:12px;
 border:1px solid rgba(255,255,255,.12);
 background:rgba(0,0,0,.25);
 cursor:pointer;
 font-size:18px;
 line-height:1;
 display:flex;
 align-items:center;
 justify-content:center;
 box-shadow:0 12px 30px rgba(0,0,0,.5);
 }
 .tabIco:hover{ filter:brightness(1.12); }
 .tabIco.active{ outline:2px solid rgba(255,210,120,.45); }

 .panelBody{
 margin: 0 10px 10px;
 border-radius:18px;
 border:1px solid rgba(255,255,255,.10);
 background: rgba(0,0,0,.25);
 box-shadow: 0 18px 55px rgba(0,0,0,.65);
 padding: 14px;
 height: calc(100% - 110px);
 overflow:auto;
 }

 .panelBody::-webkit-scrollbar{ width:10px; height:10px; }
 .panelBody::-webkit-scrollbar-track{ background: rgba(0,0,0,.25); border-radius: 999px; }
 .panelBody::-webkit-scrollbar-thumb{
 background: linear-gradient(180deg, rgba(255,210,120,.55), rgba(120,70,10,.55));
 border: 2px solid rgba(0,0,0,.25);
 border-radius: 999px;
 }
 .panelBody{ scrollbar-color: rgba(255,210,120,.55) rgba(0,0,0,.25); scrollbar-width: thin; }

 #attrScreen .panelBody,
 #achScreen .panelBody,
 #dealScreen .panelBody,
 #statsScreen .panelBody{
 margin-top: var(--panelTop) !important;
 height: calc(100% - var(--panelTop) - 18px) !important;
 }

 #inventoryScreen .bgWrap{ padding-top:86px; }

 .invPager, .invPagerBtn, .invPageArrow, .invArrow{ position:relative; z-index:99999 !important; }

 .tooltip, #tooltip{ pointer-events:none !important; }

 #staticCityBG{
 position:fixed;
 inset:0;
 display:none;
 z-index:1;
 background: url("img/city_static.png") center/cover no-repeat;
 filter: saturate(0.95) contrast(1.05);
 }

 #inventoryScreen, #attrScreen, #achScreen, #dealScreen, #statsScreen{
 background: transparent !important;
 z-index:10;
 }

 #inventoryScreen::before, #attrScreen::before, #achScreen::before, #dealScreen::before, #statsScreen::before{
 content:"";
 position:fixed;
 inset:0;
 background: rgba(0,0,0,.35);
 z-index:-1;
 pointer-events:none;
 }

 #inventoryScreen .topBar,
 #attrScreen .topBar, #achScreen .topBar, #dealScreen .topBar,
 #attrScreen .panelBody, #achScreen .panelBody, #dealScreen .panelBody, #statsScreen .panelBody{
 max-width: 1080px;
 margin-left:auto;
 margin-right:auto;
 }

 #statsScreen .statsWindow{
 position:absolute;
 left: 260px;
 top: 96px;
 right: 28px;
 bottom: 28px;

 width: min(980px, calc(100vw - 300px));
 height: min(640px, calc(100vh - 140px));
 margin: auto;

 display:flex;
 flex-direction:column;

 border-radius: 22px;
 overflow:hidden;

 box-shadow: 0 18px 48px rgba(0,0,0,.65);
 border: 1px solid rgba(255,255,255,.10);
 }

 #statsScreen .statsBody{
 background: url("img/background.png") center/cover no-repeat;
 min-height: 0;
 }

 #statsScreen .statsGrid{
 display:grid;
 grid-template-columns: repeat(2, minmax(0, 1fr));
 gap: 12px;
 margin-top: 6px;
 }
 @media (max-width: 980px){
 #statsScreen .statsWindow{ left: 240px; width: calc(100vw - 270px); }
 #statsScreen .statsGrid{ grid-template-columns: 1fr; }
 }
 #statsScreen .statCard{
 background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(0,0,0,.35));
 backdrop-filter: blur(6px);
 border: 1px solid rgba(255,255,255,.10);
 border-radius: 16px;
 padding: 12px 12px;
 box-shadow: inset 0 0 0 1px rgba(0,0,0,.25);
 }
 #statsScreen .statK{ font-size:12px; opacity:.85; margin-bottom:4px; }
 #statsScreen .statV{ font-size:22px; font-weight:1000; letter-spacing:.2px; }
 #statsScreen .statS{ font-size:12px; opacity:.75; margin-top:4px; }

 #inventoryScreen .bgWrap{
 max-width: 1080px;
 margin-left:auto;
 margin-right:auto;
 border-radius: 18px;
 overflow:hidden;
 border:1px solid rgba(255,255,255,.10);
 box-shadow: 0 18px 55px rgba(0,0,0,.65);
 }

 #attrScreen .panelBody{
 background:
 linear-gradient(rgba(0,0,0,.70), rgba(0,0,0,.70)),
 url("img/background.png") center/cover no-repeat;
 }
 #achScreen .panelBody{
 background:
 linear-gradient(rgba(0,0,0,.70), rgba(0,0,0,.70)),
 url("img/background.png") center/cover no-repeat;
 }
 #dealScreen .panelBody{
 background:
 linear-gradient(rgba(0,0,0,.70), rgba(0,0,0,.70)),
 url("img/background.png") center/cover no-repeat;
 }

 #inventoryScreen .bgWrap{
 background:
 linear-gradient(rgba(0,0,0,.55), rgba(0,0,0,.55)),
 url("img/background.png") center/cover no-repeat;
 }

 .invPager, .invPagerBtn, .invPageArrow, .invArrow{ position:relative; z-index:99999 !important; }

 #globalLeftMenu{
 position: fixed;
 left: 18px;
 top: 110px;
 width: 210px;
 z-index: 99999;
 display: block;
 pointer-events: auto;
 }
#globalLeftMenu .lhTitle{
 font-weight:1000;
 font-size:14px;
 letter-spacing:.06em;
 opacity:.85;
 margin: 0 0 10px 6px;
 }
 #globalLeftMenu .lhSep{
 height:1px;
 background: rgba(255,255,255,.10);
 margin: 10px 6px;
 }
 #globalLeftMenu .lhBtn{
 width:100%;
 text-align:left;
 padding: 10px 12px;
 border-radius: 14px;
 border:1px solid rgba(255,255,255,.10);
 background: rgba(0,0,0,.30);
 color:#fff;
 font-weight:900;
 cursor:pointer;
 margin-bottom: 8px;
 }
 #globalLeftMenu .lhBtn:hover{ filter: brightness(1.12); }
 #globalLeftMenu .lhBtn.active{ outline:2px solid rgba(255,210,120,.45); }
 #globalLeftMenu .lhBtnCity{ background: rgba(0,0,0,.18); }

 #inventoryScreen, #attrScreen, #achScreen, #dealScreen, #statsScreen{
 padding-left: 250px;
 }

 #globalLeftMenu{
 display:flex !important;
 flex-direction:column;
 gap:10px;
 }
 #globalLeftMenu .lhBtn{
 display:flex !important;
 align-items:center;
 gap:10px;
 min-height:44px;
 line-height:1.2;
 white-space:nowrap;
 box-sizing:border-box;
 margin:0 !important;
 }

 #leftHudMenu{ display:none !important; }

 #globalLeftMenu{
 position: fixed;
 left: 18px;
 top: 110px;
 width: 238px;
 padding: 18px 14px;
 border-radius: 22px;

 background:
 radial-gradient(circle at 20% 10%, rgba(120,180,255,.16), transparent 60%),
 radial-gradient(circle at 90% 30%, rgba(120,80,255,.10), transparent 55%),
 linear-gradient(180deg, rgba(18,22,38,.96), rgba(8,10,18,.96));

 border: 1px solid rgba(160,200,255,.38);

 box-shadow:
 0 0 38px rgba(80,140,255,.26),
 0 20px 60px rgba(0,0,0,.82),
 inset 0 0 28px rgba(80,140,255,.13);

 display:flex !important;
 flex-direction:column;
 gap:14px;
 z-index:99999;
 pointer-events:auto;

 animation: arcanePanelPulse 4.2s ease-in-out infinite;
 backdrop-filter: blur(2px);
 }

 @keyframes arcanePanelPulse{
 0%,100%{ box-shadow: 0 0 34px rgba(80,140,255,.22), 0 20px 60px rgba(0,0,0,.82), inset 0 0 28px rgba(80,140,255,.12); }
 50%{ box-shadow: 0 0 46px rgba(120,180,255,.30), 0 22px 66px rgba(0,0,0,.86), inset 0 0 34px rgba(120,180,255,.16); }
 }

 #globalLeftMenu .lhTitle{
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-weight:1000;
 font-size:16px;
 letter-spacing:.11em;
 color:#9fd0ff;
 text-shadow:0 0 12px rgba(120,180,255,.65);
 margin: 0 0 8px 6px;
 user-select:none;
 }

 #globalLeftMenu .lhSep{
 height:1px;
 background: linear-gradient(90deg, transparent, rgba(160,200,255,.22), transparent);
 margin: 10px 6px;
 box-shadow: 0 0 12px rgba(120,180,255,.16);
 }

 #globalLeftMenu .lhBtn{
 position:relative;
 display:flex !important;
 align-items:center;
 gap:10px;
 min-height:46px;
 padding: 12px 14px;
 border-radius:16px;
 box-sizing:border-box;
 margin:0 !important;

 background: rgba(40,52,86,.58);
 border:1px solid rgba(120,160,255,.26);

 color:#d8e9ff;
 font-weight:900;
 letter-spacing:.03em;

 cursor:pointer;
 transition: transform .22s ease, filter .22s ease, box-shadow .22s ease, background .22s ease, border-color .22s ease;

 box-shadow:
 0 6px 18px rgba(0,0,0,.62),
 inset 0 0 12px rgba(120,160,255,.09);
 overflow:hidden;
 }

 #globalLeftMenu .lhBtn::after{
 content:"";
 position:absolute;
 inset:-40% -60%;
 background: radial-gradient(circle at 30% 40%, rgba(140,210,255,.14), transparent 55%),
 radial-gradient(circle at 70% 60%, rgba(160,120,255,.10), transparent 60%);
 transform: translateX(-20%);
 opacity:.55;
 pointer-events:none;
 animation: arcaneMist 6.5s ease-in-out infinite;
 }
 @keyframes arcaneMist{
 0%,100%{ transform: translateX(-18%) translateY(0%); opacity:.45; }
 50%{ transform: translateX(10%) translateY(-6%); opacity:.70; }
 }

 #globalLeftMenu .lhBtn:hover{

 filter: brightness(1.08);
 box-shadow:
 0 0 26px rgba(100,170,255,.34),
 0 12px 30px rgba(0,0,0,.74);
 border-color: rgba(160,200,255,.40);
 }

 #globalLeftMenu .lhBtn.active{
 background: linear-gradient(90deg, rgba(60,96,175,.86), rgba(40,64,132,.86));
 border-color: rgba(170,210,255,.66);
 color:#ffffff;

 box-shadow:
 0 0 34px rgba(120,180,255,.52),
 0 0 10px rgba(210,230,255,.36) inset;

 animation: arcaneActivePulse 1.8s ease-in-out infinite;
 }
 @keyframes arcaneActivePulse{
 0%,100%{ box-shadow: 0 0 26px rgba(120,180,255,.44), 0 0 10px rgba(210,230,255,.32) inset; }
 50%{ box-shadow: 0 0 40px rgba(140,210,255,.62), 0 0 14px rgba(220,240,255,.40) inset; }
 }

 #globalLeftMenu .lhBtn.active::before{
 content:"";
 position:absolute;
 left:0;
 top:12%;
 bottom:12%;
 width:4px;
 border-radius:4px;
 background: linear-gradient(180deg, #b8e5ff, #4da6ff);
 box-shadow: 0 0 14px rgba(140,210,255,.9);
 pointer-events:none;
 z-index:2;
 }

 #globalLeftMenu .lhBtn.active span,
 #globalLeftMenu .lhBtn.active{
 position:relative;
 }
 #globalLeftMenu .lhBtn.active .shimmer{
 display:none;
 }
 #globalLeftMenu .lhBtn.active::marker{ content:""; }

 #globalLeftMenu .lhBtn.active .txt{ position:relative; z-index:3; }
 #globalLeftMenu .lhBtn.active::after{

 opacity:.70;
 }
 #globalLeftMenu .lhBtn.active .sweep{
 display:none;
 }
 #globalLeftMenu .lhBtn.active::before{ z-index:4; }
 #globalLeftMenu .lhBtn.active::after{ z-index:1; }

 #globalLeftMenu .lhBtn.active .shine{
 display:none;
 }

 #globalLeftMenu .lhBtn.active::before{}
 #globalLeftMenu .lhBtn.active::after{}

 #globalLeftMenu .lhBtn.active::before{}

 #globalLeftMenu .lhBtn.active .arcSweep{
 display:none;
 }

 #globalLeftMenu .lhBtnCity{
 background: rgba(20,28,50,.42);
 border-color: rgba(120,160,255,.18);
 box-shadow: 0 6px 18px rgba(0,0,0,.55), inset 0 0 10px rgba(120,160,255,.06);
 }

 #globalLeftMenu .lhBtn.active .txt::after{
 content:"";
 position:absolute;
 top:-10px; bottom:-10px;
 left:-60%;
 width:50%;
 background: linear-gradient(90deg, transparent, rgba(200,240,255,.38), transparent);
 transform: skewX(-18deg);
 filter: blur(0.2px);
 animation: arcaneSweep 1.9s ease-in-out infinite;
 pointer-events:none;
 z-index:2;
 }
 @keyframes arcaneSweep{
 0%{ left:-70%; opacity:0; }
 20%{ opacity:.18; }
 55%{ opacity:.42; }
 100%{ left:130%; opacity:0; }
 }

 #globalLeftMenu{
 overflow:hidden;
 }

 50%{ opacity:.65; }
 100%{ transform: rotate(360deg); opacity:.45; }
 }

 #globalLeftMenu::before{
 content:"";
 position:absolute;
 inset:-40px;
 background:
 radial-gradient(circle, rgba(200,240,255,.28) 0 2px, transparent 3px) 0 0 / 70px 70px,
 radial-gradient(circle, rgba(140,210,255,.22) 0 1.5px, transparent 3px) 20px 30px / 90px 90px,
 radial-gradient(circle, rgba(170,130,255,.18) 0 1.8px, transparent 3px) 10px 10px / 110px 110px;
 opacity:.22;
 pointer-events:none;
 animation: arcaneParticles 8.5s ease-in-out infinite;
 filter: blur(.15px);
 }
 @keyframes arcaneParticles{
 0%,100%{ transform: translate3d(-10px, 6px, 0) scale(1); opacity:.18; }
 50%{ transform: translate3d(14px, -10px, 0) scale(1.03); opacity:.30; }
 }

 #globalLeftMenu .lhBtn:hover{
 transform: scale(1.055) translateY(-1px);
 }

 #globalLeftMenu .lhBtn{
 will-change: transform;
 }
 #globalLeftMenu .lhBtn:active{
 transform: scale(1.02);
 filter: brightness(1.12);
 }

 #globalLeftMenu .lhBtn.active .txt::before{
 content:"";
 position:absolute;
 inset:-12px -18px;
 background:
 radial-gradient(circle at 15% 40%, rgba(200,240,255,.20), transparent 55%),
 radial-gradient(circle at 80% 30%, rgba(160,120,255,.14), transparent 60%);
 opacity:.55;
 pointer-events:none;
 animation: arcaneSparkleBreath 2.2s ease-in-out infinite;
 z-index:1;
 }
 @keyframes arcaneSparkleBreath{
 0%,100%{ opacity:.30; transform: scale(1); }
 50%{ opacity:.62; transform: scale(1.03); }
 }

#globalLeftMenu{
 background:
 radial-gradient(circle at 20% 10%, rgba(255,200,120,.10), transparent 60%),
 radial-gradient(circle at 80% 30%, rgba(180,120,60,.08), transparent 60%),
 linear-gradient(180deg, rgba(40,28,18,.96), rgba(22,14,8,.96));

 border:1px solid rgba(220,170,90,.35);

 box-shadow:
 0 0 30px rgba(200,150,70,.25),
 0 20px 60px rgba(0,0,0,.85),
 inset 0 0 25px rgba(180,120,60,.18);

 animation: brownPanelPulse 4s ease-in-out infinite;
}

@keyframes brownPanelPulse{
 0%,100%{ box-shadow:0 0 25px rgba(200,150,70,.20), 0 20px 60px rgba(0,0,0,.85), inset 0 0 25px rgba(180,120,60,.15); }
 50%{ box-shadow:0 0 40px rgba(230,180,90,.35), 0 22px 65px rgba(0,0,0,.9), inset 0 0 35px rgba(220,160,80,.22); }
}

#globalLeftMenu .lhTitle{
 color:#f1d3a1;
 text-shadow:0 0 10px rgba(220,170,90,.6);
}

#globalLeftMenu .lhBtn{
 background:rgba(70,45,25,.55);
 border:1px solid rgba(200,150,80,.25);
 color:#f5e4c8;

 box-shadow:
 0 6px 18px rgba(0,0,0,.65),
 inset 0 0 12px rgba(200,150,80,.12);
}

#globalLeftMenu .lhBtn:hover{
 transform:scale(1.05);
 box-shadow:
 0 0 25px rgba(230,180,90,.35),
 0 12px 30px rgba(0,0,0,.8);
 border-color:rgba(230,180,90,.5);
}

#globalLeftMenu .lhBtn.active{
 background:linear-gradient(90deg, rgba(150,95,40,.9), rgba(110,70,30,.9));
 border-color:rgba(255,200,120,.6);
 color:#fff6e6;

 box-shadow:
 0 0 35px rgba(240,190,100,.5),
 inset 0 0 12px rgba(255,220,160,.35);

 animation:brownActivePulse 2s ease-in-out infinite;
}

@keyframes brownActivePulse{
 0%,100%{ box-shadow:0 0 28px rgba(240,190,100,.4), inset 0 0 10px rgba(255,220,160,.25); }
 50%{ box-shadow:0 0 45px rgba(255,210,120,.6), inset 0 0 18px rgba(255,230,180,.4); }
}

#globalLeftMenu .lhBtn.active::before{
 background:linear-gradient(180deg,#ffe2b3,#d49b45);
 box-shadow:0 0 12px rgba(255,200,120,.8);
}

#globalLeftMenu .lhBtnCity,
#globalLeftMenu .lhBtnCity.active{
 animation: none !important;
 box-shadow: 0 6px 14px rgba(0,0,0,.6) !important;
 background: rgba(90,60,30,.55) !important;
 border-color: rgba(200,150,80,.25) !important;
}

#globalLeftMenu .lhBtnCity::before,
#globalLeftMenu .lhBtnCity.active::before{
 display:none !important;
}

#globalLeftMenu .lhBtnCity:hover{
 box-shadow: 0 8px 18px rgba(0,0,0,.75) !important;
 filter: brightness(1.05);
}

body.shop-active #globalLeftMenu{
 display:none !important;
}

body.create-active #globalLeftMenu{
 display:none !important;
}
body.arena-active #globalLeftMenu{
 display:none !important;
}

#globalLeftMenu .lhBtnCity::after,
#globalLeftMenu .lhBtnCity:hover::after,
#globalLeftMenu .lhBtnCity.active::after{
 display:none !important;
 content:none !important;
}

#globalLeftMenu .lhBtnCity{
 background-image:none !important;
}

#globalLeftMenu .lhBtnCity:hover{
 background-image:none !important;
}

.cityTravelArrowUp{
 left:47.0% !important;
 top:2.0% !important;
 width:6.0% !important;
 height:8.2% !important;
}
.cityTravelArrowUp .travelGlyph{
 transform: rotate(-90deg) !important;
}
#city3Screen .city3BackArrow{
 left:46.8% !important;
 top:89.4% !important;
 width:6.0% !important;
 height:8.4% !important;
}
#city3Screen .city3BackArrow .travelGlyph{
 transform: rotate(90deg) !important;
}
#city3Screen .city3Poi{
 border-radius:18px;
 background: rgba(255,255,255,0);
 z-index:7;
}
#city3Screen .city3Poi:hover{
 box-shadow: inset 0 0 0 2px rgba(255,230,160,.38), 0 0 22px rgba(255,210,120,.18);
}
.companionPanel{
 position:fixed;
 left:260px;
 right:18px;
 top:calc(var(--hudH) + 16px);
 bottom:18px;
 display:none;
 align-items:center;
 justify-content:center;
 padding:14px 0;
 background:rgba(0,0,0,.42);
 backdrop-filter: blur(10px);
 z-index:260000;
 overflow:auto;
}
.companionPanel.show{ display:flex; }
.companionCardWrap{
 width:min(1120px, calc(100vw - 330px));
 max-width:100%;
 max-height:calc(100vh - var(--hudH) - 72px);
 overflow:auto;
 margin:auto 0;
 border-radius:24px;
 border:1px solid rgba(255,255,255,.12);
 box-shadow:0 30px 80px rgba(0,0,0,.7);
 background:
 radial-gradient(circle at 15% 10%, rgba(255,210,120,.12), transparent 40%),
 radial-gradient(circle at 90% 20%, rgba(160,110,255,.10), transparent 35%),
 linear-gradient(180deg, rgba(28,20,14,.98), rgba(10,10,12,.98));
 padding:20px;
}
.companionCardWrap::-webkit-scrollbar,.companionPanel::-webkit-scrollbar{ width:10px; height:10px; }
.companionCardWrap::-webkit-scrollbar-thumb,.companionPanel::-webkit-scrollbar-thumb{ background:rgba(246,213,106,.35); border-radius:999px; }
.companionHead{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:18px; }
.companionEyebrow{ color:#f6d56a; font-weight:900; letter-spacing:.12em; text-transform:uppercase; font-size:12px; }
.companionTitle{ font-family:"Cinzel","Georgia",serif; font-size:34px; font-weight:1000; color:#fff2d5; }
.companionSub{ color:#d8d0c4; max-width:720px; line-height:1.4; }
.companionClose{ width:46px; height:42px; border-radius:14px; border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.06); color:#fff; font-size:20px; cursor:pointer; }
.companionClose:hover{ background:rgba(255,255,255,.10); }
.companionLocked{ min-height:420px; display:grid; place-items:center; text-align:center; gap:12px; border-radius:20px; border:1px solid rgba(255,255,255,.10); background:rgba(255,255,255,.04); padding:20px; }
.companionLockIcon{ font-size:56px; }
.companionLockTitle{ font-size:28px; font-weight:1000; color:#fff; }
.companionLockText{ max-width:620px; color:#d7d0c7; line-height:1.5; }
.companionLockReq{ display:inline-flex; padding:10px 14px; border-radius:999px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.10); font-weight:900; color:#f6d56a; }
.companionTopStats{ display:flex; flex-wrap:wrap; gap:10px; margin-bottom:16px; }
.companionTopPill{ display:inline-flex; align-items:center; gap:8px; padding:10px 14px; border-radius:999px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.10); color:#ddd6ca; }
.companionTopPill b{ color:#fff; }
.companionLayout{ display:grid; grid-template-columns:320px 1fr; gap:16px; }
.companionList{ display:flex; flex-direction:column; gap:10px; }
.companionListItem{ width:100%; display:grid; grid-template-columns:60px 1fr auto; align-items:center; gap:12px; padding:12px; border-radius:18px; border:1px solid rgba(255,255,255,.10); background:rgba(255,255,255,.04); color:#fff; cursor:pointer; text-align:left; }
.companionListItem:hover{ background:rgba(255,255,255,.07); }
.companionListItem.active{ border-color:rgba(246,213,106,.42); box-shadow:0 0 0 1px rgba(246,213,106,.18), 0 0 22px rgba(246,213,106,.12); }
.companionListIcon{ width:60px; height:60px; border-radius:16px; display:grid; place-items:center; font-size:30px; background:rgba(0,0,0,.28); border:1px solid rgba(255,255,255,.10); }
.companionListName{ font-weight:1000; font-size:16px; }
.companionListMeta{ color:#cfc7bb; font-size:12px; margin-top:3px; }
.companionListTag{ font-size:12px; font-weight:900; color:#f6d56a; }
.companionDetail{ border-radius:20px; border:1px solid rgba(255,255,255,.10); background:rgba(255,255,255,.04); padding:16px; }
.companionHero{ display:flex; align-items:center; gap:16px; margin-bottom:16px; }
.companionPortrait{ width:94px; height:94px; border-radius:22px; display:grid; place-items:center; font-size:46px; background:linear-gradient(180deg, rgba(80,55,25,.8), rgba(20,16,12,.9)); border:1px solid rgba(246,213,106,.22); box-shadow:0 12px 28px rgba(0,0,0,.45); }
.companionPortraitInner,.companionListIconInner,.companionBattleInner{ width:100%; height:100%; position:relative; display:grid; place-items:center; }
.companionPortraitImg,.companionListImg,.companionBattleImg{ width:100%; height:100%; object-fit:contain; object-position:center center; display:block; border-radius:inherit; margin:auto; }
.companionPortraitFallback,.companionListFallback,.companionBattleFallback{ position:absolute; inset:0; display:grid; place-items:center; }
.companionListIcon{ overflow:hidden; position:relative; }
.companionPortrait{ overflow:hidden; position:relative; }
.companionPortrait,.companionListIcon,.companionBattleFrame{ isolation:isolate; }
.companionPortrait::after,.companionListIcon::after,.companionBattleFrame::after{
 content:"";
 position:absolute; inset:-1px; border-radius:inherit; pointer-events:none;
}
.companionPortrait.evo-0,.companionListIcon.evo-0{ border-color:rgba(246,213,106,.28); box-shadow:0 12px 28px rgba(0,0,0,.45), 0 0 18px rgba(246,213,106,.16); }
.companionPortrait.evo-1,.companionListIcon.evo-1{ border-color:rgba(120,220,255,.52); box-shadow:0 12px 28px rgba(0,0,0,.45), 0 0 22px rgba(120,220,255,.24); }
.companionPortrait.evo-2,.companionListIcon.evo-2{ border-color:rgba(186,120,255,.56); box-shadow:0 12px 28px rgba(0,0,0,.45), 0 0 24px rgba(186,120,255,.28); }
.companionPortrait.evo-3,.companionListIcon.evo-3{ border-color:rgba(255,132,76,.58); box-shadow:0 12px 28px rgba(0,0,0,.45), 0 0 26px rgba(255,132,76,.32); }
.companionPortrait.evo-4,.companionListIcon.evo-4{
 border-color:rgba(255,205,110,1);
 background:
 linear-gradient(180deg, rgba(70,18,0,.96), rgba(26,8,0,.98));
 box-shadow:
 0 12px 28px rgba(0,0,0,.52),
 0 0 24px rgba(255,90,0,.75),
 0 0 52px rgba(255,140,30,.62),
 0 0 96px rgba(255,210,90,.46);
 overflow:visible;
}
.companionPortrait.evo-4 .companionPortraitInner,
.companionListIcon.evo-4 .companionListIconInner,
.companionBattleFrame.evo-4 .companionBattleInner{
 position:absolute;
 inset:0;
 border-radius:inherit;
 overflow:hidden;
 background:transparent;
 box-shadow:none;
 z-index:1;
 display:flex;
 align-items:center;
 justify-content:center;
}
.companionPortrait.evo-4::before,.companionListIcon.evo-4::before,.companionBattleFrame.evo-4::before{
 content:"";
 position:absolute;
 inset:-6px;
 border-radius:inherit;
 padding:8px;
 pointer-events:none;
 z-index:0;
 background:
 conic-gradient(from 0deg,
 rgba(255,234,170,0) 0deg,
 rgba(255,212,120,.98) 24deg,
 rgba(255,124,24,1) 56deg,
 rgba(255,80,0,.98) 88deg,
 rgba(255,222,140,.25) 118deg,
 rgba(255,234,170,0) 150deg,
 rgba(255,234,170,0) 210deg,
 rgba(255,212,120,.98) 248deg,
 rgba(255,124,24,1) 286deg,
 rgba(255,80,0,.98) 318deg,
 rgba(255,234,170,0) 360deg) border-box;
 -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
 -webkit-mask-composite: xor;
 mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
 mask-composite: exclude;
 filter: saturate(1.35) blur(.25px);
 animation:companionFireSpin 2.2s linear infinite, companionFirePulse 1.15s ease-in-out infinite;
}
.companionPortrait.evo-4::after,.companionListIcon.evo-4::after,.companionBattleFrame.evo-4::after{
 content:"";
 position:absolute;
 inset:-10px;
 border-radius:inherit;
 pointer-events:none;
 z-index:0;
 background:
 radial-gradient(circle at 14% 18%, rgba(255,250,220,.92) 0 4%, rgba(255,250,220,0) 10%),
 radial-gradient(circle at 82% 16%, rgba(255,190,90,.85) 0 4%, rgba(255,190,90,0) 11%),
 radial-gradient(circle at 18% 86%, rgba(255,120,30,.9) 0 5%, rgba(255,120,30,0) 13%),
 radial-gradient(circle at 84% 82%, rgba(255,230,150,.82) 0 4%, rgba(255,230,150,0) 11%),
 radial-gradient(circle at 50% 118%, rgba(255,90,0,.98) 0%, rgba(255,90,0,.8) 18%, rgba(255,90,0,0) 44%),
 radial-gradient(circle at 18% 106%, rgba(255,210,120,.95) 0%, rgba(255,210,120,.65) 14%, rgba(255,210,120,0) 34%),
 radial-gradient(circle at 82% 106%, rgba(255,150,40,.95) 0%, rgba(255,150,40,.62) 14%, rgba(255,150,40,0) 34%);
 box-shadow:
 0 0 0 2px rgba(255,138,28,.95),
 0 0 16px rgba(255,92,0,.92),
 0 0 30px rgba(255,178,74,.72),
 0 0 54px rgba(255,220,120,.46);
 animation:companionFlameFlicker .45s steps(3,end) infinite;
}
@keyframes companionFireSpin{
 0%{ transform:rotate(-40deg); }
 100%{ transform:rotate(360deg); }
}
@keyframes companionFirePulse{
 0%,100%{ opacity:.92; transform:scale(1); }
 50%{ opacity:1; transform:scale(1.06); }
}
@keyframes companionFlameFlicker{
 0%,100%{ opacity:.95; transform:translateY(0) scale(1); }
 50%{ opacity:1; transform:translateY(-1px) scale(1.03); }
}
.avatarWithCompanion{ position:relative; display:inline-flex; align-items:flex-end; justify-content:center; }
.companionBattleFrame{
 position:absolute;
 left:-78px;
 top:34px;
 width:62px;
 height:62px;
 border-radius:16px;
 display:none;
 place-items:center;
 background:linear-gradient(180deg, rgba(80,55,25,.92), rgba(20,16,12,.96));
 border:1px solid rgba(246,213,106,.28);
 box-shadow:0 12px 24px rgba(0,0,0,.52), 0 0 18px rgba(246,213,106,.16);
 overflow:hidden;
}
.companionBattleFrame.show{ display:grid; }
.companionBattleFrame::before{
 content:"";
 position:absolute; inset:0;
 border-radius:inherit;
 box-shadow: inset 0 0 0 1px rgba(255,255,255,.08);
 pointer-events:none;
}
.companionBattleFrame.evo-0{ border-color:rgba(246,213,106,.28); box-shadow:0 12px 24px rgba(0,0,0,.52), 0 0 18px rgba(246,213,106,.16); }
.companionBattleFrame.evo-1{ border-color:rgba(120,220,255,.52); box-shadow:0 12px 24px rgba(0,0,0,.52), 0 0 22px rgba(120,220,255,.28); }
.companionBattleFrame.evo-2{ border-color:rgba(186,120,255,.56); box-shadow:0 12px 24px rgba(0,0,0,.52), 0 0 24px rgba(186,120,255,.30); }
.companionBattleFrame.evo-3{ border-color:rgba(255,132,76,.58); box-shadow:0 12px 24px rgba(0,0,0,.52), 0 0 26px rgba(255,132,76,.32); }
.companionBattleFrame.evo-4{
 border-color:rgba(255,205,110,1);
 background:linear-gradient(180deg, rgba(70,18,0,.96), rgba(26,8,0,.98));
 box-shadow:
 0 12px 24px rgba(0,0,0,.58),
 0 0 24px rgba(255,90,0,.82),
 0 0 54px rgba(255,140,30,.68),
 0 0 98px rgba(255,220,120,.50);
 overflow:visible;
}
.companionBattleFrame.evo-1::after,.companionBattleFrame.evo-2::after,.companionBattleFrame.evo-3::after,.companionBattleFrame.evo-4::after{
 content:"";
 position:absolute;
 inset:-1px;
 border-radius:inherit;
 pointer-events:none;
}
.companionBattleFrame.evo-1::after{ box-shadow: inset 0 0 0 1px rgba(120,220,255,.28); }
.companionBattleFrame.evo-2::after{ box-shadow: inset 0 0 0 1px rgba(186,120,255,.30); }
.companionBattleFrame.evo-3::after{ box-shadow: inset 0 0 0 1px rgba(255,132,76,.34); }
.companionBattleFrame.evo-4::after{ box-shadow:none; background:none; }
.companionBattleImg{ border-radius:10px; }
.companionBattleFallback{ font-size:24px; }
.companionBattleLvl{
 position:absolute;
 left:50%;
 right:auto;
 top:auto;
 bottom:4px;
 transform:translateX(-50%);
 min-width:24px;
 padding:3px 6px;
 border-radius:999px;
 font-size:10px;
 font-weight:1000;
 color:#ffe9b7;
 background:rgba(0,0,0,.72);
 border:1px solid rgba(255,255,255,.12);
 box-shadow:0 4px 10px rgba(0,0,0,.35);
 line-height:1;
 text-align:center;
 z-index:6;
}
.companionAbilityMeter{
 position:absolute;
 left:50%;
 top:calc(100% + 10px);
 transform:translateX(-50%);
 width:148px;
 padding:6px 8px;
 border:1px solid rgba(246,213,106,.24);
 border-radius:10px;
 background:rgba(18,12,8,.88);
 box-shadow:0 8px 18px rgba(0,0,0,.34);
 z-index:8;
 pointer-events:none;
}
.companionAbilityMeterTop{ display:flex; align-items:center; justify-content:space-between; gap:8px; color:#e8ddc9; font-size:10px; line-height:1.15; }
.companionAbilityMeterTop b{ color:#f6d56a; font-size:11px; }
.companionAbilityBar{ height:5px; margin-top:5px; overflow:hidden; border-radius:999px; background:rgba(255,255,255,.12); }
.companionAbilityBar i{ display:block; width:0; height:100%; border-radius:inherit; background:linear-gradient(90deg,#a875ff,#f6d56a); transition:width .18s ease; }
.companionAbilityMeter[data-companion-ability="wolf"]{ border-color:rgba(255,176,74,.58); }
.companionAbilityMeter[data-companion-ability="wolf"] .companionAbilityBar i{ background:linear-gradient(90deg,#ff8d36,#ffe08b); }
.companionAbilityMeter[data-companion-ability="golem"]{ border-color:rgba(120,220,255,.52); }
.companionAbilityMeter[data-companion-ability="golem"] .companionAbilityBar i{ background:linear-gradient(90deg,#4d9cff,#b8efff); }
.companionAbilityMeter[data-companion-ability="deer"]{ border-color:rgba(108,231,143,.58); }
.companionAbilityMeter[data-companion-ability="deer"] .companionAbilityBar i{ background:linear-gradient(90deg,#38bf68,#b7ffb1); }
@keyframes companionAbilitySwordFlash{ 0%{ box-shadow:0 0 0 rgba(255,175,66,0); } 35%{ box-shadow:0 0 28px 8px rgba(255,175,66,.88), inset 0 0 20px rgba(255,235,165,.55); } 100%{ box-shadow:0 0 0 rgba(255,175,66,0); } }
@keyframes companionAbilityShieldFlash{ 0%{ box-shadow:0 0 0 rgba(104,208,255,0); } 35%{ box-shadow:0 0 28px 8px rgba(104,208,255,.82), inset 0 0 18px rgba(188,242,255,.48); } 100%{ box-shadow:0 0 0 rgba(104,208,255,0); } }
@keyframes companionAbilityHpFlash{ 0%,100%{ filter:none; } 35%{ filter:brightness(1.8) saturate(1.45); box-shadow:0 0 16px rgba(104,239,130,.95); } }
.bigAvatar.companionAbilityWolf{ animation:companionAbilitySwordFlash .65s ease-out; }
.bigAvatar.companionAbilityWolf::after{ content:"⚔"; position:absolute; inset:0; display:grid; place-items:center; color:#ffe7a5; font-size:38px; text-shadow:0 0 12px #ff8f28; pointer-events:none; animation:companionAbilitySwordFlash .65s ease-out; }
.bigAvatar.companionAbilityGolem{ animation:companionAbilityShieldFlash .65s ease-out; }
.bigAvatar.companionAbilityGolem::after{ content:"🛡️"; position:absolute; inset:0; display:grid; place-items:center; font-size:34px; filter:drop-shadow(0 0 9px #79dcff); pointer-events:none; animation:companionAbilityShieldFlash .65s ease-out; }
#pHpBar.companionAbilityDeer{ animation:companionAbilityHpFlash .8s ease-out; }
.companionAbilityPop{ color:#fff4c8 !important; font-weight:1000; text-shadow:0 0 10px rgba(255,194,80,.9); }
.companionAbilityPop.golem{ color:#c9f4ff !important; text-shadow:0 0 10px rgba(111,211,255,.9); }
.companionAbilityPop.deer{ color:#baffc2 !important; text-shadow:0 0 10px rgba(75,232,117,.9); }
.companionBuffFloat{
 position:fixed;
 transform:translate(-50%,-50%);
 z-index:2147482700;
 pointer-events:none;
 white-space:nowrap;
 padding:8px 13px;
 border-radius:10px;
 border:1px solid currentColor;
 background:rgba(10,8,6,.88);
 font-size:clamp(21px,2.3vw,31px);
 line-height:1;
 font-weight:1000;
 letter-spacing:.6px;
 animation:companionBuffCenter 1.1s ease-out forwards;
}
.companionBuffFloat.wolf{
 color:#ffd27a;
 box-shadow:0 0 24px rgba(255,143,40,.72),inset 0 0 14px rgba(255,174,62,.18);
 text-shadow:0 2px 8px #000,0 0 14px rgba(255,137,37,.95);
}
.companionBuffFloat.golem{
 color:#c9f4ff;
 box-shadow:0 0 24px rgba(79,190,255,.72),inset 0 0 14px rgba(132,220,255,.18);
 text-shadow:0 2px 8px #000,0 0 14px rgba(91,203,255,.95);
}
@keyframes companionBuffCenter{
 0%{opacity:0;transform:translate(-50%,-50%) scale(.72);}
 14%,68%{opacity:1;transform:translate(-50%,-50%) scale(1);}
 100%{opacity:0;transform:translate(-50%,-64%) scale(1.08);}
}
@keyframes companionBuffWolfRound{
 0%,100%{border-color:rgba(255,171,70,.72);box-shadow:0 0 18px rgba(255,132,35,.54),inset 0 0 18px rgba(255,170,60,.18);filter:brightness(1.04);}
 50%{border-color:#ffe0a0;box-shadow:0 0 34px 8px rgba(255,132,35,.78),inset 0 0 28px rgba(255,198,95,.30);filter:brightness(1.18) saturate(1.15);}
}
@keyframes companionBuffGolemRound{
 0%,100%{border-color:rgba(111,215,255,.72);box-shadow:0 0 18px rgba(66,174,255,.54),inset 0 0 18px rgba(106,211,255,.18);filter:brightness(1.04);}
 50%{border-color:#d5f7ff;box-shadow:0 0 34px 8px rgba(66,174,255,.78),inset 0 0 28px rgba(137,225,255,.30);filter:brightness(1.16) saturate(1.12);}
}
.bigAvatar.companionBuffRoundWolf{animation:companionBuffWolfRound .52s ease-in-out 2;}
.bigAvatar.companionBuffRoundGolem{animation:companionBuffGolemRound .52s ease-in-out 2;}
@media (max-width: 1220px){
 .companionBattleFrame{ left:-70px; top:38px; width:56px; height:56px; }
}
@media (max-width: 920px){
 .companionBattleFrame{ left:-16px; top:-14px; width:52px; height:52px; }
}
.companionHeroName{ font-size:28px; font-weight:1000; color:#fff; }
.companionHeroMeta{ color:#d2cabf; margin-top:4px; }
.companionXpBox,.companionEvoBox{ border-radius:18px; border:1px solid rgba(255,255,255,.10); background:rgba(0,0,0,.20); padding:14px; margin-bottom:16px; }
.companionXpTop{ display:flex; justify-content:space-between; gap:10px; margin-bottom:8px; color:#ded7cb; }
.companionXpTop b{ color:#fff; }
.companionXpBar{ height:14px; border-radius:999px; overflow:hidden; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.10); }
.companionXpBar i{ display:block; height:100%; background:linear-gradient(90deg, rgba(246,213,106,1), rgba(255,163,68,1)); box-shadow:0 0 18px rgba(246,213,106,.32); }
.companionTiny{ margin-top:8px; color:#bcb4a7; font-size:12px; line-height:1.35; }
.companionBonusGrid{ display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:12px; margin-bottom:16px; }
.companionBonusCard{ border-radius:18px; border:1px solid rgba(255,255,255,.10); background:rgba(0,0,0,.22); padding:14px; }
.companionBonusK{ color:#beb6aa; font-size:12px; text-transform:uppercase; letter-spacing:.08em; }
.companionBonusV{ color:#fff; font-size:24px; font-weight:1000; margin-top:6px; }
.companionBonusS{ color:#d7cfc2; margin-top:4px; font-size:12px; line-height:1.35; }
.companionSectionTitle{ color:#fff; font-size:18px; font-weight:1000; margin-bottom:10px; }
.companionMilestones{ display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:10px; }
.companionMilestone{ border-radius:16px; border:1px solid rgba(255,255,255,.10); background:rgba(255,255,255,.04); padding:12px; }
.companionMilestone.done{ border-color:rgba(246,213,106,.42); box-shadow:0 0 0 1px rgba(246,213,106,.18); }
.companionMilestoneLvl{ color:#f6d56a; font-size:12px; font-weight:900; text-transform:uppercase; }
.companionMilestoneTitle{ font-size:16px; font-weight:1000; color:#fff; margin-top:4px; }
.companionMilestoneDesc{ margin-top:6px; color:#d8d0c4; font-size:12px; line-height:1.35; }
.companionActions{ display:flex; flex-wrap:wrap; gap:10px; }
.companionActions button:disabled{ opacity:.55; cursor:not-allowed; }
@media (max-width: 1220px){
 .companionPanel{ left:240px; right:12px; }
 .companionCardWrap{ width:min(1040px, calc(100vw - 280px)); }
 .companionMilestones{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 920px){
 .companionPanel{ left:12px; right:12px; top:calc(var(--hudH) + 12px); bottom:12px; }
 .companionLayout{ grid-template-columns:1fr; }
 .companionBonusGrid, .companionMilestones{ grid-template-columns:1fr; }
}

.kovarCard{
 background:
 radial-gradient(120% 140% at 30% 20%, rgba(255,210,140,.12), rgba(0,0,0,0) 55%),
 radial-gradient(140% 160% at 70% 80%, rgba(120,80,40,.18), rgba(0,0,0,0) 60%),
 linear-gradient(180deg, rgba(55,40,22,.72), rgba(25,18,10,.78));
 border: 1px solid rgba(210,160,90,.22) !important;
 box-shadow:
 0 16px 34px rgba(0,0,0,.55),
 inset 0 1px 0 rgba(255,255,255,.06),
 inset 0 0 0 1px rgba(0,0,0,.22);
 position: relative;
 overflow: hidden;
}

.kovarCard::before{
 content:"";
 position:absolute;
 inset:0;
 background:
 radial-gradient(1px 1px at 12% 18%, rgba(255,255,255,.18) 0 60%, rgba(0,0,0,0) 62%),
 radial-gradient(1px 1px at 76% 34%, rgba(255,255,255,.12) 0 60%, rgba(0,0,0,0) 62%),
 radial-gradient(1px 1px at 44% 72%, rgba(255,255,255,.10) 0 60%, rgba(0,0,0,0) 62%);
 opacity:.55;
 pointer-events:none;
}

.kovarCard::after{
 content:"";
 position:absolute;
 left:-40%;
 top:-60%;
 width:140%;
 height:180%;
 background: linear-gradient(115deg, rgba(255,215,140,0) 35%, rgba(255,215,140,.08) 50%, rgba(255,215,140,0) 65%);
 transform: rotate(8deg);
 opacity:.7;
 pointer-events:none;
}

.kovarCard:hover{
 border-color: rgba(230,180,105,.30) !important;
 box-shadow:
 0 18px 38px rgba(0,0,0,.62),
 inset 0 1px 0 rgba(255,255,255,.07),
 inset 0 0 0 1px rgba(0,0,0,.22);
}

.kovarCard .btnGold,
.kovarCard button.btnGold,
#btnUpgrade.btnGold,
#btnReforge.btnGold{
 background: linear-gradient(180deg, rgba(210,165,95,.92), rgba(145,95,35,.92)) !important;
 color: #201208 !important;
 border: 1px solid rgba(255,220,150,.28) !important;
 box-shadow:
 0 10px 18px rgba(0,0,0,.45),
 inset 0 1px 0 rgba(255,255,255,.22),
 inset 0 -10px 18px rgba(0,0,0,.25);
 text-shadow: none !important;
}

.kovarCard .btnGold:hover,
#btnUpgrade:hover,
#btnReforge:hover{
 filter: brightness(1.05);
 box-shadow:
 0 12px 22px rgba(0,0,0,.55),
 inset 0 1px 0 rgba(255,255,255,.24),
 inset 0 -12px 20px rgba(0,0,0,.28);
}

.kovarCard .btnGold:disabled,
#btnUpgrade:disabled,
#btnReforge:disabled{
 filter: grayscale(.25) brightness(.85);
 opacity:.65;
 cursor:not-allowed;
}

.kovarCard .smallTxt{ opacity:.9 !important; }

.sejdirCard{
 background:
 radial-gradient(120% 140% at 30% 20%, rgba(255,210,140,.10), rgba(0,0,0,0) 55%),
 linear-gradient(180deg, rgba(55,40,22,.75), rgba(25,18,10,.85));
 border: 1px solid rgba(210,160,90,.22) !important;
 box-shadow:
 0 16px 34px rgba(0,0,0,.55),
 inset 0 1px 0 rgba(255,255,255,.06);
 position: relative;
 overflow: hidden;
}

.sejdirChests{
 display:flex;
 justify-content:center;
 gap:40px;
 margin:20px 0 30px 0;
}

.sejdirChestImg{
 width:120px;
 height:auto;
 transition: transform .25s ease, filter .25s ease;
 filter: drop-shadow(0 8px 14px rgba(0,0,0,.6));
}

.sejdirChestImg:hover{
 transform: scale(1.08);
 filter: drop-shadow(0 10px 20px rgba(0,0,0,.8)) brightness(1.05);
}

#brightnessOverlayDark, #brightnessOverlayLight{
 position:fixed;
 inset:0;
 pointer-events:none;
 z-index:999999;
 opacity:0;
}
#brightnessOverlayDark{ background:#000; }
#brightnessOverlayLight{ background:#fff; mix-blend-mode:screen; }

.faceBuilderWrap{
 width:100%;
 border:1px solid rgba(255,255,255,.10);
 background:rgba(255,255,255,.04);
 border-radius:14px;
 padding:10px;
}
.faceBuilderHead{
 display:flex; align-items:center; justify-content:space-between; gap:10px;
 margin-bottom:8px;
}
.facePreviewRow{ display:flex; align-items:center; justify-content:center; }
.facePreview{
 width:168px; height:168px;
 border-radius:16px;
 border:1px solid rgba(255,255,255,.14);
 background:rgba(0,0,0,.18);
 display:flex; align-items:center; justify-content:center;
 overflow:hidden;
}
.facePreview img{ width:100%; height:100%; object-fit:contain; }
.faceCtrl{
 display:flex; align-items:center; justify-content:space-between; gap:10px;
 padding:6px 8px;
 border-radius:12px;
 border:1px solid rgba(255,255,255,.08);
 background:rgba(255,255,255,.03);
 margin-top:8px;
 font-size:12px;
}
.faceCtrl .btnMini{
 padding:6px 10px;
 border-radius:12px;
 border:1px solid rgba(255,255,255,.16);
 background:rgba(0,0,0,.22);
 color:#fff;
 cursor:pointer;
}
.faceCtrl .val{ opacity:.85; min-width:90px; text-align:right; font-weight:800; }

#createScreen .createStats,
#createScreen .createStat,
#createScreen .statRow,
#createScreen .statRows,
#createScreen .statHint,
#createScreen .createStatRow,
#createScreen .createStatGrid,
#createScreen [data-create-stats],
#createScreen .allocStats,
#createScreen .statAlloc,
#createScreen .statsAlloc { display:none !important; }

#createScreen #avatarPickGrid,
#createScreen .createAvatarGrid,
#createScreen .avatarPick,
#createScreen .avatarPickRow,
#createScreen .avatarPickWrap,
#createScreen .avatarPicker,
#createScreen .avatarPresetWrap,
#createScreen .avatarPresets { display:none !important; }

#createScreen #chkUseFace,
#createScreen label[for="chkUseFace"],
#createScreen .faceUseRow,
#createScreen .faceToggle,
#createScreen .useFaceRow { display:none !important; }

#createScreen .createAvatarPreview,
#createScreen .avatarPreview,
#createScreen .createRightCol,
#createScreen .createAvatarMainWrap,
#createScreen #createAvatarMainWrap,
#createScreen #createAvatarMain,
#createScreen .avatarPreviewWrap {
 display:none !important;
}

body.menuForceHidden #globalLeftMenu{ display:none !important; }

#globalLeftMenu, #leftHudMenu{ display:none !important; pointer-events:none !important; }
body.cityMenuOn #globalLeftMenu, body.cityMenuOn #leftHudMenu{ display:block !important; pointer-events:auto !important; }

#leftHudMenu{ display:none !important; pointer-events:none !important; }
body.cityMenuOn #leftHudMenu{ display:none !important; }

#globalLeftMenu {
 width: 240px !important;
}
#globalLeftMenu .lhBtn {
 height: 74px !important;
 padding: 0 !important;
 margin-bottom: 10px !important;
 border: none !important;
 background: transparent !important;
 box-shadow: none !important;
 border-radius: 18px !important;
 overflow: visible !important;
 position: relative !important;
}
#globalLeftMenu .lhBtn .txt {
 opacity: 0 !important;
 pointer-events: none !important;
}
#globalLeftMenu .lhBtn::before {
 content:"";
 position:absolute;
 inset:0;
 border-radius:18px;
 background: center/contain no-repeat;
 filter: drop-shadow(0 14px 26px rgba(0,0,0,.65));
 transition: transform .10s ease, filter .10s ease;
}
#globalLeftMenu .lhBtn:hover::before {
 transform: translateY(-1px);
 filter: drop-shadow(0 16px 30px rgba(0,0,0,.75));
}
#globalLeftMenu .lhBtn:active::before {
 transform: translateY(0px) scale(.995);
}
#globalLeftMenu .lhBtn.active::before {
 filter:
 drop-shadow(0 18px 34px rgba(0,0,0,.80))
 drop-shadow(0 0 16px rgba(255,190,90,.20));
}
#globalLeftMenu .lhBtn[data-panel="inv"]::before { background-image:url("img/btn_inventar.png"); }
#globalLeftMenu .lhBtn[data-panel="attr"]::before { background-image:url("img/btn_background.png"); }
#globalLeftMenu .lhBtn[data-panel="ach"]::before { background-image:url("img/btn_achievementy.png"); }
#globalLeftMenu .lhBtn[data-panel="deal"]::before { background-image:url("img/btn_background.png"); }
#globalLeftMenu .lhBtn[data-panel="city"]::before { background-image:url("img/btn_zpet.png"); }

#globalLeftMenu .lhBtnCity.active::before {
 filter: drop-shadow(0 14px 26px rgba(0,0,0,.75)) !important;
}

.colIconGrid{ display:flex; gap:18px; justify-content:center; align-items:stretch; padding:6px 4px 0; }
.colIconBtn{ flex:1; max-width:420px; min-width:240px; border:1px solid rgba(255,255,255,.10); border-radius:16px; background:rgba(0,0,0,.22); box-shadow:0 18px 40px rgba(0,0,0,.28); cursor:pointer; padding:14px 14px 12px; text-align:center; }
.colIconBtn:hover{ transform:translateY(-1px); box-shadow:0 20px 46px rgba(0,0,0,.34); border-color:rgba(255,255,255,.18); }
.colIconImg{ width:100%; height:auto; max-height:260px; object-fit:contain; display:block; margin:0 auto 10px; }
.colIconLabel{ font-weight:800; letter-spacing:.4px; font-size:18px; margin-top:2px; }
.colIconSub{ font-size:12px; opacity:.86; margin-top:3px; }
@media (max-width: 980px){ .colIconGrid{ flex-direction:column; } .colIconBtn{ max-width:unset; } }

#facePreviewStack{ position:relative; width:220px; height:220px; }
#facePreviewStack img{
 position:absolute; inset:0;
 width:100%; height:100%;
 object-fit:contain;
 pointer-events:none;
}

#createFaceBg{
 width: 240px;
 height: 240px;
 position: relative;
 border-radius: 18px;
 overflow: hidden;
 background:
 radial-gradient(120px 120px at 50% 38%, rgba(255,210,120,0.10), rgba(0,0,0,0.0) 60%),
 linear-gradient(180deg, rgba(25,16,12,0.92), rgba(10,8,7,0.92));
 box-shadow: 0 20px 55px rgba(0,0,0,0.70);
 border: 1px solid rgba(255,205,120,0.22);
}
#createFaceBg::before{
 content:"";
 position:absolute;
 inset:0;
 background-image: url("img/create_face_bg.png");
 background-size: cover;
 background-position: center;
 opacity: 0.95;
 pointer-events:none;
 mix-blend-mode: overlay;
}
#createFaceBg::after{
 content:"";
 position:absolute;
 inset:0;
 background:
 radial-gradient(160px 160px at 50% 35%, rgba(0,0,0,0.0), rgba(0,0,0,0.65)),
 linear-gradient(180deg, rgba(0,0,0,0.15), rgba(0,0,0,0.55));
 pointer-events:none;
}
#facePreviewStack{
 width: 100% !important;
 height: 100% !important;
 margin: 0 auto;
 position: relative;
 z-index: 2;
}

#globalLeftMenu .lhBtn.imgBtn{
 position: relative !important;
 padding: 0 !important;
 border: 0 !important;
 background: transparent !important;
 box-shadow: none !important;
 overflow: visible !important;
}
#globalLeftMenu .lhBtn.imgBtn::before{
 background-image: var(--btn-img) !important;
}
#globalLeftMenu .lhBtn.imgBtn .txt{
 opacity: 0 !important;
}
#globalLeftMenu .lhBtn.imgBtn:hover::before{
 transform: translateY(-1px) scale(1.01);
 filter: drop-shadow(0 16px 28px rgba(0,0,0,.72));
}
#globalLeftMenu .lhBtn.imgBtn:active::before{
 transform: translateY(0px) scale(0.995);
 filter: drop-shadow(0 12px 22px rgba(0,0,0,.60));
}

#leftHudMenu .lhBtn.imgBtn{
 background: none !important;
 background-color: transparent !important;
 border: 0 !important;
 box-shadow: none !important;
 padding: 0 !important;
 height: 56px !important;
 min-height: 56px !important;
 width: 100% !important;
 display: flex !important;
 align-items: center !important;
 justify-content: center !important;
 position: relative !important;
 overflow: visible !important;
}
#leftHudMenu .lhBtn.imgBtn::before{
 content:"";
 position:absolute;
 inset:0;
 background-image: var(--btn-img);
 background-repeat:no-repeat;
 background-position:center;
 background-size: 100% 100%;
 image-rendering: crisp-edges;
 image-rendering: -webkit-optimize-contrast;
 filter:none;
 content:"" !important;
 position:absolute !important;
 inset: 0 !important;
 z-index: 1 !important;
 background-image: var(--btn-img) !important;
 background-repeat:no-repeat !important;
 background-position:center !important;
 background-size: contain !important;
 pointer-events:none !important;
 filter: drop-shadow(0 10px 18px rgba(0,0,0,.55)) !important;
}
#leftHudMenu .lhBtn.imgBtn .txt{
 opacity: 0 !important;
}

#leftHudMenu{
 width: 300px !important;
}

.cityOverlay{
 left: 300px !important;
}

#leftHudMenu .lhBtn.imgBtn{
 background: none !important;
 background-color: transparent !important;
 border: 0 !important;
 box-shadow: none !important;
 padding: 0 !important;
 height: 88px !important;
 min-height: 88px !important;
 width: 100% !important;
 display: flex !important;
 align-items: center !important;
 justify-content: center !important;
 position: relative !important;
 overflow: visible !important;
}

#leftHudMenu .lhBtn.imgBtn::before{
 content:"";
 position:absolute;
 inset:0;
 background-image: var(--btn-img);
 background-repeat:no-repeat;
 background-position:center;
 background-size: 100% 100%;
 image-rendering: crisp-edges;
 image-rendering: -webkit-optimize-contrast;
 filter:none;
 content:"" !important;
 position:absolute !important;
 inset: 0 !important;
 z-index: 1 !important;
 background-image: var(--btn-img) !important;
 background-repeat:no-repeat !important;
 background-position:center !important;
 background-size: 95% !important;
 pointer-events:none !important;
 transition: transform .15s ease, filter .15s ease;
 filter: drop-shadow(0 12px 22px rgba(0,0,0,.6)) !important;
}

#leftHudMenu .lhBtn.imgBtn:hover{
 background: none !important;
}

#leftHudMenu .lhBtn.imgBtn:hover::before{
 transform: scale(1.05);
 filter: drop-shadow(0 16px 30px rgba(0,0,0,.7)) brightness(1.08);
}

#leftHudMenu .lhBtn.imgBtn:active::before{
 transform: scale(0.97);
}

#leftHudMenu .lhBtn.imgBtn .txt{
 opacity: 0 !important;
}

#leftHudMenu{
 width: 300px !important;
}

.cityOverlay{
 left: 300px !important;
}

#leftHudMenu .lhBtn{
 background: none !important;
 background-color: transparent !important;
 box-shadow: none !important;
}

#leftHudMenu .lhBtn::after{
 display: none !important;
}

#leftHudMenu .lhBtn.imgBtn{
 border: 0 !important;
 padding: 0 !important;
 height: 90px !important;
 min-height: 90px !important;
 width: 100% !important;
 display: flex !important;
 align-items: center !important;
 justify-content: center !important;
 position: relative !important;
 overflow: visible !important;
}

#leftHudMenu .lhBtn.imgBtn::before{
 content:"";
 position:absolute;
 inset:0;
 background-image: var(--btn-img);
 background-repeat:no-repeat;
 background-position:center;
 background-size: 100% 100%;
 image-rendering: crisp-edges;
 image-rendering: -webkit-optimize-contrast;
 filter:none;
 content:"" !important;
 position:absolute !important;
 inset: 0 !important;
 z-index: 1 !important;
 background-image: var(--btn-img) !important;
 background-repeat:no-repeat !important;
 background-position:center !important;
 background-size: 100% !important;
 pointer-events:none !important;
 transition: transform .15s ease, filter .15s ease;
 filter: drop-shadow(0 14px 26px rgba(0,0,0,.65)) !important;
}

#leftHudMenu .lhBtn.imgBtn:hover::before{
 transform: scale(1.05);
 filter: drop-shadow(0 18px 34px rgba(0,0,0,.8)) brightness(1.08) !important;
}

#leftHudMenu .lhBtn.imgBtn.active{
 background: none !important;
 box-shadow: none !important;
}

#leftHudMenu .lhBtn.imgBtn.active::before{
 filter: drop-shadow(0 22px 40px rgba(0,0,0,.9)) brightness(1.12) !important;
}

#leftHudMenu .lhBtn.imgBtn .txt{
 opacity: 0 !important;
}

#globalLeftMenu .lhBtn.imgBtn{
 position: relative !important;
 overflow: visible !important;
 padding: 0 !important;
 height: 90px !important;
 min-height: 90px !important;
 border: 0 !important;
 background: none !important;
 background-color: transparent !important;
 box-shadow: none !important;
}

#globalLeftMenu .lhBtn.imgBtn::after{
 content:"" !important;
 position:absolute !important;
 inset: 0 !important;
 z-index: 1 !important;
 background-image: var(--btn-img) !important;
 background-repeat:no-repeat !important;
 background-position:center !important;
 background-size: 100% !important;
 pointer-events:none !important;
 transition: transform .15s ease, filter .15s ease;
 filter: drop-shadow(0 14px 26px rgba(0,0,0,.65)) !important;
}

#globalLeftMenu .lhBtn:not(.imgBtn)::after{
 display: none !important;
}

#globalLeftMenu .lhBtn.imgBtn .txt{
 position: relative !important;
 z-index: 3 !important;
 opacity: 0 !important;
}

#globalLeftMenu .lhBtn.imgBtn:hover::after{
 transform: scale(1.05);
 filter: drop-shadow(0 18px 34px rgba(0,0,0,.8)) brightness(1.08) !important;
}

#globalLeftMenu .lhBtn.imgBtn.active{
 outline: none !important;
}

#globalLeftMenu .lhBtn.imgBtn.active::after{
 filter: drop-shadow(0 22px 40px rgba(0,0,0,.9)) brightness(1.12) !important;
}

#globalLeftMenu .lhBtn,
#globalLeftMenu .lhBtn:hover,
#globalLeftMenu .lhBtn:active,
#globalLeftMenu .lhBtn.active{
 background: transparent !important;
 background-color: transparent !important;
 border: 0 !important;
 outline: 0 !important;
 box-shadow: none !important;
 filter: none !important;
}

#globalLeftMenu .lhBtn::before,
#globalLeftMenu .lhBtn::after{
 border: 0 !important;
 box-shadow: none !important;
}

#globalLeftMenu .lhBtn.active::before{
 content: none !important;
 display: none !important;
 background: none !important;
}

#globalLeftMenu .lhBtn:not(.imgBtn)::before,
#globalLeftMenu .lhBtn:not(.imgBtn)::after{
 content: none !important;
 display: none !important;
}

#globalLeftMenu .lhBtn.imgBtn::after{
 content:"" !important;
 display:block !important;
 position:absolute !important;
 inset:0 !important;
 z-index: 2 !important;
 background-image: var(--btn-img) !important;
 background-repeat:no-repeat !important;
 background-position:center !important;
 background-size: 100% !important;
 pointer-events:none !important;
 box-shadow:none !important;
}

#globalLeftMenu .lhBtn.imgBtn .txt{ display:none !important; }

/* Achievement hall */
body #achScreen .panelBody#achBody{
 width:min(1360px, calc(100vw - 310px)) !important;
 max-width:min(1360px, calc(100vw - 310px)) !important;
 height:min(860px, calc(100vh - 38px)) !important;
 margin-top:18px !important;
 margin-bottom:18px !important;
 padding:0 !important;
 overflow:hidden !important;
 color:#d8cbb5;
 border:1px solid #77603b !important;
 border-radius:4px !important;
 background:
  linear-gradient(90deg, rgba(5,8,8,.96), rgba(11,14,13,.92) 48%, rgba(6,8,8,.96)),
  url("../img/backgrounds/achiev.png") center 38% / cover no-repeat !important;
 box-shadow:
  0 0 0 3px #17130e,
  0 0 0 4px rgba(155,118,62,.45),
  0 24px 80px rgba(0,0,0,.82),
  inset 0 0 70px rgba(0,0,0,.8) !important;
 font-family:Georgia, "Times New Roman", serif;
}

/* === Public player and guild profile halls v481 === */
#guildMemberDetailPanel.leaderboardProfileModal,
#guildGuildDetailPanel.leaderboardProfileModal{
  width:min(1480px,96vw)!important;
  height:min(900px,94vh)!important;
  max-width:none!important;
  max-height:none!important;
  padding:0!important;
  overflow:hidden!important;
  border:1px solid #725023!important;
  border-radius:2px!important;
  background:linear-gradient(110deg,#080c0a,#0d120f 55%,#080b09)!important;
  box-shadow:0 0 0 3px #080a08,0 0 0 4px rgba(194,139,54,.52),0 24px 90px rgba(0,0,0,.92),inset 0 0 60px #000!important;
  font-family:Georgia,"Times New Roman",serif;
}
#guildMemberDetailPanel.leaderboardProfileModal::before,
#guildMemberDetailPanel.leaderboardProfileModal::after,
#guildGuildDetailPanel.leaderboardProfileModal::before,
#guildGuildDetailPanel.leaderboardProfileModal::after{
  content:"◆";position:absolute;z-index:4;color:#c08834;font-size:13px;text-shadow:0 0 9px #e0a447;pointer-events:none;
}
#guildMemberDetailPanel.leaderboardProfileModal::before,
#guildGuildDetailPanel.leaderboardProfileModal::before{left:8px;top:7px;}
#guildMemberDetailPanel.leaderboardProfileModal::after,
#guildGuildDetailPanel.leaderboardProfileModal::after{right:8px;bottom:7px;}
.leaderboardProfileModal > .guildPanelHead{
  height:86px;margin:0!important;padding:0 22px 0 70px;justify-content:center;box-sizing:border-box;
  border-bottom:1px solid #66461f;background:linear-gradient(180deg,rgba(26,29,24,.99),rgba(9,13,11,.98));
  box-shadow:inset 0 -3px 0 rgba(0,0,0,.6),0 1px 0 rgba(211,155,64,.16);
}
.leaderboardProfileModal > .guildPanelHead::before,
.leaderboardProfileModal > .guildPanelHead::after{content:"❧";margin:0 25px;color:#a87836;font-size:33px;transform:rotate(-18deg);opacity:.85;}
.leaderboardProfileModal > .guildPanelHead::after{transform:scaleX(-1) rotate(-18deg);}
.leaderboardProfileModal > .guildPanelHead .guildPanelTitle{
  color:#e8d2a7;font-size:37px;font-weight:500;line-height:1;text-transform:uppercase;letter-spacing:.07em;text-shadow:0 2px #4d2d0e,0 0 18px rgba(224,166,69,.15);
}
.leaderboardProfileModal > .guildPanelHead .guildCloseBtn{
  position:absolute;right:17px;top:13px;width:56px;height:56px;min-width:0;min-height:0;padding:0!important;border:1px solid #9c6429!important;border-radius:2px!important;
  background:linear-gradient(#6c2415,#2c0f0b)!important;color:#f5d9a4!important;font-size:27px!important;box-shadow:inset 0 0 0 3px #1c0d08,0 0 10px #000!important;
}
.leaderboardProfileModal > .guildPanelHead .guildCloseBtn:hover{filter:brightness(1.25);}
#guildMemberDetailBody,#guildGuildDetailBody{height:calc(100% - 86px);min-height:0;overflow:hidden;box-sizing:border-box;}
.leaderboardProfileLoading,.leaderboardProfileError{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;color:#ad9e83;font-size:16px;}
.leaderboardProfileLoading > span{font-size:66px;color:#c38b38;animation:leaderboardLoadingGlow 1.4s ease-in-out infinite;}
.leaderboardProfileError{height:auto;margin:24px;padding:25px;border:1px solid #503b22;background:#0c100e;color:#d2b993;}

.leaderboardPlayerProfile{height:100%;min-width:0;min-height:0;display:grid;grid-template-columns:300px minmax(480px,1fr) 310px;color:#cbbda4;}
.leaderboardProfileIdentity,.leaderboardProfileStats{min-width:0;min-height:0;padding:18px 17px;box-sizing:border-box;background:linear-gradient(90deg,#090d0b,#0e1311);overflow:auto;scrollbar-width:thin;scrollbar-color:#78572c #090c0a;}
.leaderboardProfileIdentity{border-right:1px solid #4d381f;}
.leaderboardProfilePortrait{position:relative;width:126px;height:126px;margin:0 auto 14px;border:1px solid #a16f2d;background:radial-gradient(circle,#28312a,#090d0b 70%);box-shadow:inset 0 0 0 3px #080b09,0 0 18px rgba(202,139,42,.16);}
.leaderboardProfilePortrait img{position:static!important;width:100%!important;height:100%!important;transform:none!important;object-fit:cover!important;filter:none!important;border-radius:0!important;}
.leaderboardProfilePortrait > .oaiInlineAvatarArtHost{display:block!important;width:100%!important;height:100%!important;margin:0!important;border-radius:0!important;line-height:normal!important;}
.leaderboardProfilePortrait > .oaiInlineAvatarArtHost > img{width:100%!important;height:100%!important;object-fit:cover!important;}
.leaderboardProfilePortrait > span{position:absolute;right:-9px;bottom:-9px;width:39px;height:39px;display:grid;place-items:center;border:1px solid #c38a34;background:linear-gradient(#4a3218,#171108);color:#f1d08c;font-size:20px;box-shadow:inset 0 0 0 2px #080a08;}
.leaderboardPlayerProfile .guildInspectMeta{margin:0 0 10px!important;text-align:center;}
.leaderboardPlayerProfile .guildInspectMeta b{display:block;color:#ebcf91;font-size:26px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.leaderboardPlayerProfile .guildInspectMeta small{display:block;margin-top:5px;color:#9e8d72;font-size:14px;}
.leaderboardProfileGuildLink,.leaderboardProfileNoGuild{width:100%;height:40px;display:flex;align-items:center;justify-content:center;gap:9px;border:1px solid #543c21;background:linear-gradient(#151a16,#090c0a);color:#c6954a;font:500 15px Georgia,serif;box-sizing:border-box;}
.leaderboardProfileGuildLink{cursor:pointer;}.leaderboardProfileGuildLink:hover{border-color:#bd8635;color:#f1cf8e;}
.leaderboardProfileGuildLink span{font-size:20px;}
.leaderboardProfileNoGuild{color:#777064;}
.leaderboardProfileLevel{margin:16px 0 10px;padding:12px 11px;border:1px solid #49371f;background:#0b0f0d;}
.leaderboardProfileLevel > span,.leaderboardProfileLevel > small{display:flex;align-items:center;justify-content:space-between;}
.leaderboardProfileLevel > span{color:#a78f68;text-transform:uppercase;font-size:13px;}.leaderboardProfileLevel > span b{color:#e7c46f;font-size:22px;}
.leaderboardProfileLevel > small{margin:7px 0;color:#867c69;font:11px Arial,sans-serif;}
.leaderboardProfileLevel > i{display:block;height:7px;border:1px solid #62481f;background:#050706;box-shadow:inset 0 1px 2px #000;}
.leaderboardProfileLevel > i span{display:block;height:100%;background:linear-gradient(90deg,#a96b16,#efb74a);box-shadow:0 0 8px rgba(223,154,47,.35);}
.leaderboardProfileFacts{border:1px solid #44331f;background:#090d0b;}
.leaderboardProfileFacts > div{display:flex;justify-content:space-between;gap:10px;padding:9px 11px;border-bottom:1px solid #2f291f;font-size:13px;}.leaderboardProfileFacts > div:last-child{border-bottom:0;}
.leaderboardProfileFacts span{color:#8f816b;}.leaderboardProfileFacts b{color:#d5c3a1;font-weight:500;text-align:right;}
.leaderboardProfileProgress{margin-top:12px;border:1px solid #49361f;background:#090d0b;}
.leaderboardProfileProgress h3,.leaderboardProfileStats h3,.leaderboardGuildStory h3{margin:0;padding:10px 12px;border-bottom:1px solid #4b361d;color:#c39145;font-size:15px;font-weight:500;text-align:center;text-transform:uppercase;letter-spacing:.05em;}
.leaderboardProfileProgress > div{display:grid;grid-template-columns:30px 1fr auto;align-items:center;gap:7px;padding:9px 11px;border-bottom:1px solid #2f291f;}.leaderboardProfileProgress > div:last-child{border-bottom:0;}
.leaderboardProfileProgress > div span{color:#c28d3f;font-size:19px;}.leaderboardProfileProgress > div small{color:#938670;font-size:12px;}.leaderboardProfileProgress > div b{color:#e4c681;font-size:16px;font-weight:500;}

.leaderboardProfileEquipment{min-width:0;min-height:0;display:grid;grid-template-rows:70px minmax(0,1fr) 75px;background:radial-gradient(circle at 50% 39%,rgba(45,61,55,.62),rgba(7,11,9,.98) 66%),linear-gradient(#111712,#070a08);}
.leaderboardProfileEquipment > header{display:flex;align-items:center;justify-content:center;gap:14px;border-bottom:1px solid #4d371d;background:rgba(7,10,8,.64);}
.leaderboardProfileEquipment > header small{color:#9d8d71;font-size:15px;}.leaderboardProfileEquipment > header b{color:#e7b950;font-size:27px;font-weight:500;}
.leaderboardProfileLoadout{min-width:0;min-height:0;display:grid;grid-template-columns:88px minmax(230px,1fr) 88px;gap:10px;padding:14px 16px;box-sizing:border-box;overflow:hidden;}
.leaderboardProfileSlotColumn{min-height:0;display:grid;grid-template-rows:repeat(4,minmax(66px,1fr));gap:11px;align-content:center;}
.leaderboardProfileItem.guildEqSlot{position:relative!important;inset:auto!important;width:100%!important;height:auto!important;min-height:66px;border-radius:2px;background:linear-gradient(145deg,#171b17,#080b09);box-shadow:inset 0 0 0 3px #080a08;}
.leaderboardProfileItem.guildEqSlot.hasItem{cursor:help;}
.leaderboardProfileItem.guildEqSlot img{width:100%;height:100%;object-fit:contain;}
.leaderboardProfileItem .guildEqLabel{left:2px;right:2px;bottom:3px;font-size:9px;text-transform:uppercase;}
.leaderboardProfileItem .guildEqEmpty{display:flex;flex-direction:column;align-items:center;gap:4px;color:#726956;font-size:9px;text-transform:uppercase;}.leaderboardProfileItem .guildEqEmpty span{font-size:22px;}
.leaderboardProfileItem .itemPlus{position:absolute;right:3px;top:2px;z-index:2;color:#f2cc70;font-size:12px;text-shadow:0 1px 3px #000;}
.leaderboardProfileHeroStage{position:relative;min-width:0;min-height:0;display:flex;align-items:center;justify-content:center;overflow:hidden;border:1px solid rgba(104,75,38,.48);background:radial-gradient(ellipse at 50% 60%,rgba(57,82,74,.48),rgba(5,8,7,.88) 64%);}
.leaderboardProfileHeroStage::after{content:"";position:absolute;left:14%;right:14%;bottom:41px;height:27px;border-radius:50%;background:radial-gradient(ellipse,rgba(212,158,70,.24),rgba(0,0,0,.68) 68%,transparent 70%);}
.leaderboardProfileClassCrest{position:absolute;width:92%;height:92%;object-fit:contain;opacity:.16;filter:saturate(.8);}
.leaderboardProfileHeroAvatar{position:relative;z-index:1;width:min(70%,250px);max-height:58%;object-fit:contain;border:1px solid #8f642d;box-shadow:0 0 0 4px #080b09,0 12px 35px #000;background:#0c100e;}
.leaderboardProfileHeroStage > div{position:absolute;z-index:3;left:18px;right:18px;bottom:15px;text-align:center;}.leaderboardProfileHeroStage > div b{display:block;color:#e6ca8f;font-size:22px;font-weight:500;}.leaderboardProfileHeroStage > div small{display:block;margin-top:3px;color:#91846e;font-size:12px;}
.leaderboardProfileArenaSummary{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #4f391e;background:rgba(7,10,8,.78);}
.leaderboardProfileArenaSummary > div{display:flex;flex-direction:column;align-items:center;justify-content:center;border-right:1px solid #392e20;}.leaderboardProfileArenaSummary > div:last-child{border-right:0;}
.leaderboardProfileArenaSummary span{color:#867b69;font-size:11px;text-transform:uppercase;}.leaderboardProfileArenaSummary b{margin-top:5px;color:#dbb866;font-size:18px;font-weight:500;}
.leaderboardProfileStats{border-left:1px solid #4d381f;background:linear-gradient(270deg,#090d0b,#0e1311);}
.leaderboardProfileStats.guildStatsPanel{border-radius:0!important;}
.leaderboardProfileStats h3{margin:-1px -1px 9px!important;padding:12px!important;}.leaderboardProfileStats h3.secondary{margin-top:14px!important;}
.leaderboardProfileStat{display:grid;grid-template-columns:29px 1fr auto;align-items:center;gap:8px;padding:8px 6px;border-bottom:1px solid #29261f;}
.leaderboardProfileStat i{color:#c38d3e;font-size:19px;font-style:normal;text-align:center;}.leaderboardProfileStat:first-of-type i{color:#c7503e;}.leaderboardProfileStat span{color:#a99b83;font-size:14px;}.leaderboardProfileStat b{color:#e1d0ac;font-size:15px;font-weight:500;text-align:right;}
.leaderboardProfileAttributes{display:grid;grid-template-columns:1fr 1fr;gap:6px;}.leaderboardProfileAttributes > div{display:flex;justify-content:space-between;gap:8px;padding:9px;border:1px solid #342d20;background:#090d0b;font-size:12px;}.leaderboardProfileAttributes span{color:#8e826e;}.leaderboardProfileAttributes b{color:#dfbd70;}
.leaderboardProfileStats .profileMailBtnRow{margin-top:15px!important;}.leaderboardProfileStats .profileMailBtn{width:100%;height:42px;border-radius:1px!important;border-color:#755329!important;background:linear-gradient(#25323b,#10181d)!important;color:#dec89b!important;}
body.leaderboardPublicProfileOpen #oaiStableWindowCloseX_v126{display:none!important;pointer-events:none!important;}

.leaderboardGuildProfile{height:100%;min-height:0;display:grid;grid-template-rows:180px 100px minmax(0,1fr);color:#cbbda4;background:radial-gradient(circle at 50% 0,rgba(50,58,48,.36),transparent 48%);}
.leaderboardGuildIdentity{display:grid;grid-template-columns:145px minmax(0,1fr) 145px;align-items:center;gap:24px;padding:18px 55px;border-bottom:1px solid #4b361e;background:linear-gradient(90deg,rgba(8,12,10,.96),rgba(18,24,19,.82),rgba(8,12,10,.96));box-sizing:border-box;}
.leaderboardGuildBanner{width:126px;height:126px;display:grid;place-items:center;border:1px solid #8f642c;background:radial-gradient(circle,#263027,#080b09 72%);box-shadow:inset 0 0 0 4px #080b09,0 0 22px rgba(198,136,42,.17);overflow:hidden;}
.leaderboardGuildBanner .oaiGuildBanner{width:100%;height:100%;}.leaderboardGuildBanner svg,.leaderboardGuildBanner img{max-width:100%;max-height:100%;}.leaderboardGuildInitials{color:#e0bd72;font-size:32px;}
.leaderboardGuildIdentity > div:nth-child(2) small{color:#a07f4c;font-size:13px;text-transform:uppercase;letter-spacing:.12em;}.leaderboardGuildIdentity h2{margin:5px 0 7px;color:#ead29e;font-size:34px;font-weight:500;}.leaderboardGuildIdentity p{margin:0 0 7px;color:#9e927d;font-size:15px;}.leaderboardGuildIdentity p b{color:#ddbc75;font-weight:500;}.leaderboardGuildIdentity > div:nth-child(2) > span{color:#716b60;font-size:12px;}
.leaderboardGuildLevel{width:120px;height:120px;display:flex;flex-direction:column;align-items:center;justify-content:center;clip-path:polygon(50% 0,92% 19%,84% 76%,50% 100%,16% 76%,8% 19%);background:linear-gradient(145deg,#a06f34,#152a35 21%,#102532 68%,#7b5328);}.leaderboardGuildLevel span{color:#a7a08e;font-size:11px;text-transform:uppercase;}.leaderboardGuildLevel b{margin-top:5px;color:#69bde9;font-size:39px;font-weight:500;text-shadow:0 2px #000;}
.leaderboardGuildMetrics{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid #4a361e;background:#090d0b;}.leaderboardGuildMetrics > div{display:grid;grid-template-columns:42px 1fr;grid-template-rows:1fr 1fr;align-items:end;padding:13px 28px;border-right:1px solid #352d20;box-sizing:border-box;}.leaderboardGuildMetrics > div:last-child{border-right:0;}.leaderboardGuildMetrics span{grid-row:1/3;color:#c08a3c;font-size:29px;align-self:center;}.leaderboardGuildMetrics small{color:#877d6c;font-size:11px;text-transform:uppercase;}.leaderboardGuildMetrics b{align-self:start;color:#e0bd70;font-size:22px;font-weight:500;}
.leaderboardGuildContent{min-width:0;min-height:0;display:grid;grid-template-columns:36% minmax(0,1fr);gap:12px;padding:13px;box-sizing:border-box;}
.leaderboardGuildStory,.leaderboardGuildRoster{min-width:0;min-height:0;border:1px solid #48351f;background:linear-gradient(#0f1411,#080c0a);overflow:hidden;}
.leaderboardGuildStory{overflow:auto;scrollbar-width:thin;scrollbar-color:#78572c #090c0a;}.leaderboardGuildStory > p{min-height:72px;margin:0;padding:16px;color:#b7aa94;font-size:14px;line-height:1.5;white-space:pre-wrap;}
.leaderboardGuildBonuses{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;padding:13px;}.leaderboardGuildBonuses > div{display:flex;min-height:94px;flex-direction:column;align-items:center;justify-content:center;border:1px solid #40331f;background:#090d0b;}.leaderboardGuildBonuses span{color:#c58f3e;font-size:25px;}.leaderboardGuildBonuses small{margin-top:5px;color:#8a806e;font-size:10px;text-transform:uppercase;}.leaderboardGuildBonuses b{margin-top:5px;color:#ddbc6c;font-size:17px;font-weight:500;}
.leaderboardGuildRoster{display:grid;grid-template-rows:56px minmax(0,1fr);}.leaderboardGuildRoster > header{display:flex;align-items:center;justify-content:space-between;padding:0 17px;border-bottom:1px solid #4b361e;background:#101512;}.leaderboardGuildRoster h3{margin:0;color:#c89548;font-size:16px;font-weight:500;text-transform:uppercase;letter-spacing:.04em;}.leaderboardGuildRoster header small{color:#746f64;font:11px Arial,sans-serif;}.leaderboardGuildRoster header > b{width:34px;height:34px;display:grid;place-items:center;border:1px solid #7b582b;border-radius:50%;color:#d7b368;font-weight:500;}
.leaderboardGuildMembers{min-height:0;overflow:auto;padding:7px;scrollbar-width:thin;scrollbar-color:#78572c #090c0a;}
.leaderboardGuildMember{width:100%;min-height:66px;display:grid;grid-template-columns:49px minmax(130px,1fr) 65px 90px 95px 20px;align-items:center;gap:10px;padding:7px 10px;border:0;border-bottom:1px solid #322b20;background:linear-gradient(90deg,rgba(18,23,20,.82),rgba(8,12,10,.9));color:inherit;text-align:left;font:inherit;cursor:pointer;}.leaderboardGuildMember:hover{background:linear-gradient(90deg,rgba(66,45,23,.72),rgba(14,16,12,.94));}.leaderboardGuildMember.leader{box-shadow:inset 3px 0 #c6913f;}
.leaderboardGuildMemberAvatar{width:46px;height:46px;border:1px solid #805a2b;background:#090c0a;overflow:hidden;}.leaderboardGuildMemberAvatar img{width:100%;height:100%;object-fit:cover;}.leaderboardGuildMemberName{min-width:0;display:flex;flex-direction:column;gap:3px;}.leaderboardGuildMemberName b{color:#d9c6a1;font-size:16px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}.leaderboardGuildMemberName small{color:#80786a;font-size:11px;}.leaderboardGuildMemberLevel{display:flex;flex-direction:column;text-align:center;}.leaderboardGuildMemberLevel small{color:#746e62;font-size:9px;text-transform:uppercase;}.leaderboardGuildMemberLevel b{color:#d8b467;font-size:17px;font-weight:500;}.leaderboardGuildMemberRole{color:#ad956c;font-size:12px;text-align:center;}.leaderboardGuildMemberDate{color:#716b60;font-size:11px;text-align:right;}.leaderboardGuildMember > i{color:#b07c36;font-size:26px;font-style:normal;}
@media(max-width:1180px){
 #guildMemberDetailPanel.leaderboardProfileModal,#guildGuildDetailPanel.leaderboardProfileModal{width:calc(100vw - 20px)!important;height:calc(100dvh - 20px)!important;}
 .leaderboardPlayerProfile{grid-template-columns:245px minmax(420px,1fr) 265px;}.leaderboardProfileIdentity,.leaderboardProfileStats{padding:12px 10px;}.leaderboardProfileLoadout{grid-template-columns:72px minmax(200px,1fr) 72px;padding:10px;}
 .leaderboardGuildIdentity{padding-left:30px;padding-right:30px;}.leaderboardGuildMetrics > div{padding-left:14px;padding-right:14px;}
}
@media(max-width:900px){
 #guildMemberDetailBody,#guildGuildDetailBody{overflow:auto;}
 .leaderboardPlayerProfile{height:auto;min-height:100%;grid-template-columns:1fr;}.leaderboardProfileIdentity{border-right:0;border-bottom:1px solid #4d381f;}.leaderboardProfileEquipment{min-height:600px;}.leaderboardProfileStats{border-left:0;border-top:1px solid #4d381f;}
 .leaderboardGuildProfile{height:auto;min-height:100%;grid-template-rows:auto auto auto;}.leaderboardGuildIdentity{grid-template-columns:100px 1fr 100px;padding:15px;}.leaderboardGuildBanner{width:90px;height:90px;}.leaderboardGuildLevel{width:90px;height:90px;}.leaderboardGuildMetrics{grid-template-columns:1fr 1fr;}.leaderboardGuildContent{grid-template-columns:1fr;}.leaderboardGuildStory,.leaderboardGuildRoster{min-height:300px;}
}

/* === Server leaderboard hall v480 === */
#lbBody .leaderboardHall{
  --lb-gold:#c89238;
  --lb-gold-soft:#8b642c;
  --lb-ink:#070b09;
  --lb-panel:#0d1210;
  width:100%;
  height:100%;
  position:relative;
  min-width:0;
  min-height:0;
  display:grid;
  grid-template-rows:102px minmax(0,1fr);
  color:#d8c7a7;
  overflow:hidden;
  box-sizing:border-box;
  background:
    linear-gradient(90deg,rgba(6,10,8,.98),rgba(11,16,13,.96) 48%,rgba(5,8,7,.99)),
    radial-gradient(circle at 50% -20%,rgba(181,126,39,.16),transparent 52%);
  border:1px solid #5d421f;
  box-shadow:inset 0 0 0 3px #0b0e0c,inset 0 0 0 4px rgba(180,126,46,.48),inset 0 0 42px #000,0 10px 35px rgba(0,0,0,.72);
  font-family:Georgia,"Times New Roman",serif;
}
#lbBody .leaderboardHall::before,
#lbBody .leaderboardHall::after{
  content:"◆";
  position:absolute;
  z-index:3;
  color:#b98131;
  font-size:13px;
  text-shadow:0 0 9px #d99832;
  pointer-events:none;
}
#lbBody .leaderboardHall::before{left:9px;top:8px;}
#lbBody .leaderboardHall::after{right:9px;bottom:8px;}
#lbBody .leaderboardHallHeader{
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:30px;
  text-align:center;
  border-bottom:1px solid #68471f;
  background:linear-gradient(180deg,rgba(27,29,24,.97),rgba(9,13,11,.96));
  box-shadow:inset 0 -3px 0 rgba(0,0,0,.55),0 1px 0 rgba(203,148,57,.16);
}
#lbBody .leaderboardHallHeader h2{
  margin:0;
  color:#eddbb5;
  font-size:clamp(34px,3.1vw,52px);
  line-height:.9;
  font-weight:500;
  letter-spacing:.08em;
  text-shadow:0 2px 0 #4d2d0e,0 0 20px rgba(230,178,88,.18);
}
#lbBody .leaderboardHallHeader p{
  margin:7px 0 0;
  color:#a99575;
  font-size:16px;
  letter-spacing:.04em;
}
#lbBody .leaderboardHeaderFlourish{
  color:#ad7932;
  font-size:35px;
  transform:rotate(-18deg);
  opacity:.85;
}
#lbBody .leaderboardHeaderFlourish.mirror{transform:scaleX(-1) rotate(-18deg);}
#lbBody .leaderboardHallGrid{
  min-width:0;
  min-height:0;
  display:grid;
  grid-template-columns:210px minmax(510px,1fr) 270px;
}
#lbBody .leaderboardModes{
  min-height:0;
  display:flex;
  flex-direction:column;
  gap:7px;
  padding:24px 14px 16px;
  border-right:1px solid #49351e;
  background:linear-gradient(90deg,#090d0b,#0e1311 80%,#0a0e0c);
  box-sizing:border-box;
}
#lbBody .leaderboardModeBtn,
#lbBody .leaderboardMyPositionBtn{
  position:relative;
  width:100%;
  min-height:67px;
  display:flex;
  align-items:center;
  gap:15px;
  padding:0 17px;
  border:1px solid rgba(117,83,39,.34);
  background:linear-gradient(180deg,rgba(17,22,19,.96),rgba(9,13,11,.96));
  color:#c6b28d;
  font:500 18px/1 Georgia,"Times New Roman",serif;
  text-transform:uppercase;
  letter-spacing:.025em;
  cursor:pointer;
  box-sizing:border-box;
}
#lbBody .leaderboardModeBtn > span,
#lbBody .leaderboardMyPositionBtn > span{width:31px;color:#a77a39;font-size:25px;text-align:center;}
#lbBody .leaderboardModeBtn:hover,
#lbBody .leaderboardMyPositionBtn:hover{border-color:#a97934;color:#f0dba9;background:linear-gradient(180deg,#211a10,#100e0a);}
#lbBody .leaderboardModeBtn.active{
  color:#f4d99d;
  border-color:#d39a3c;
  background:linear-gradient(100deg,#5b3515,#2b1d10 72%,#16110b);
  box-shadow:inset 4px 0 #e2a33c,inset 0 0 22px rgba(210,135,38,.18),0 0 12px rgba(208,137,44,.12);
}
#lbBody .leaderboardModeBtn.active::after{
  content:"";
  position:absolute;
  right:-9px;
  width:15px;
  height:15px;
  background:#3f2813;
  border-top:1px solid #c08735;
  border-right:1px solid #c08735;
  transform:rotate(45deg);
}
#lbBody .leaderboardModeSpacer{flex:1;}
#lbBody .leaderboardMyPositionBtn{min-height:56px;font-size:15px;border-color:#76552b;background:linear-gradient(#211c13,#11130f);}
#lbBody .leaderboardMain{
  min-width:0;
  min-height:0;
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
  padding:16px 14px 14px;
  box-sizing:border-box;
}
#lbBody .leaderboardCategoryBar{
  min-height:54px;
  display:flex;
  align-items:stretch;
  gap:8px;
  padding-bottom:10px;
  border-bottom:1px solid rgba(111,77,34,.45);
}
#lbBody .leaderboardCategoryBtn{
  min-width:0;
  flex:1;
  padding:5px 9px;
  border:1px solid #4b3923;
  background:linear-gradient(#171b17,#0b0f0d);
  color:#bba783;
  font:500 15px/1.1 Georgia,"Times New Roman",serif;
  cursor:pointer;
  box-shadow:inset 0 0 0 2px #090c0a;
}
#lbBody .leaderboardCategoryBtn:hover{border-color:#9d7133;color:#efd59f;}
#lbBody .leaderboardCategoryBtn.active{
  color:#f5deb0;
  border-color:#c78c32;
  background:linear-gradient(#5b3717,#24180d);
  box-shadow:inset 0 0 0 2px #15100a,inset 0 0 16px rgba(220,151,49,.18);
}
#lbBody .leaderboardContextTitle{
  width:100%;display:grid;grid-template-columns:42px auto 1fr;align-items:center;column-gap:10px;padding:0 14px;
  border:1px solid #4b3923;background:linear-gradient(#171b17,#0b0f0d);box-sizing:border-box;
}
#lbBody .leaderboardContextTitle > span{font-size:27px;color:#c28b36;text-align:center;}
#lbBody .leaderboardContextTitle > b{font-size:18px;color:#e4c995;text-transform:uppercase;letter-spacing:.04em;}
#lbBody .leaderboardContextTitle > small{justify-self:end;color:#887f6d;font:12px Arial,sans-serif;}
#lbBody .leaderboardTablePanel{min-width:0;min-height:0;display:grid;grid-template-rows:40px minmax(0,1fr) auto;}
#lbBody .leaderboardTableTitle{display:flex;align-items:center;justify-content:space-between;padding:0 9px;color:#c69a52;text-transform:uppercase;letter-spacing:.045em;}
#lbBody .leaderboardTableTitle b{font-size:16px;font-weight:500;}
#lbBody .leaderboardTableTitle span{font:11px Arial,sans-serif;color:#847a68;text-transform:none;letter-spacing:0;}
#lbBody .leaderboardTableScroll{
  min-width:0;
  min-height:0;
  overflow:auto;
  scrollbar-width:thin;
  scrollbar-color:#7c592d #090c0a;
  border:1px solid #3f311e;
  background:rgba(4,7,6,.72);
}
#lbBody .leaderboardServerTable{width:100%;border-collapse:collapse;table-layout:fixed;}
#lbBody .leaderboardServerTable th{
  position:sticky;
  top:0;
  z-index:2;
  height:38px;
  padding:0 10px;
  color:#a99068;
  background:#101512;
  border-bottom:1px solid #5d4324;
  font:500 12px/1 Georgia,"Times New Roman",serif;
  text-align:left;
  text-transform:uppercase;
  letter-spacing:.04em;
}
#lbBody .leaderboardServerTable td{
  height:65px;
  padding:4px 10px;
  border-bottom:1px solid rgba(95,73,43,.52);
  color:#c9bea8;
  box-sizing:border-box;
  font-size:15px;
}
#lbBody .leaderboardServerTable tbody tr{background:linear-gradient(90deg,rgba(17,22,19,.84),rgba(9,13,11,.9));transition:.16s ease;}
#lbBody .leaderboardServerTable tbody tr:nth-child(even){background:linear-gradient(90deg,rgba(13,17,15,.84),rgba(6,9,8,.92));}
#lbBody .leaderboardServerTable tbody tr:hover{background:linear-gradient(90deg,rgba(54,39,21,.78),rgba(17,18,13,.93));}
#lbBody .leaderboardServerTable tbody tr.isCurrent{
  background:linear-gradient(90deg,rgba(22,57,76,.75),rgba(10,28,38,.85));
  box-shadow:inset 3px 0 #56a9d7,inset 0 0 16px rgba(52,141,196,.13);
}
#lbBody .leaderboardServerTable tbody tr.pulse{animation:leaderboardRowPulse .9s ease;}
@keyframes leaderboardRowPulse{50%{filter:brightness(1.75);}}
#lbBody .leaderboardServerTable th:first-child,
#lbBody .leaderboardServerTable td:first-child{width:94px;text-align:center;}
#lbBody .leaderboardServerTable th:nth-child(2){width:36%;}
#lbBody .leaderboardServerTable th.c,#lbBody .leaderboardServerTable td.c{text-align:center;}
#lbBody .leaderboardServerTable th.r,#lbBody .leaderboardServerTable td.r{text-align:right;}
#lbBody .leaderboardRankCell{padding-left:5px!important;padding-right:5px!important;}
#lbBody .leaderboardRankMark{display:inline-flex;align-items:center;justify-content:center;gap:5px;font-size:19px;}
#lbBody .leaderboardRankMark span{font-size:27px;line-height:1;}
#lbBody .leaderboardRankMark.rank1{color:#f1bd4e;text-shadow:0 0 10px rgba(240,177,50,.38);}
#lbBody .leaderboardRankMark.rank2{color:#c7d0d5;}
#lbBody .leaderboardRankMark.rank3{color:#c77b3d;}
#lbBody .leaderboardRankNumber{color:#aa9e86;font-size:18px;}
#lbBody .leaderboardHeroLink,
#lbBody .leaderboardGuildHero{
  width:100%;display:flex;align-items:center;gap:10px;padding:0;border:0;background:none;color:inherit;text-align:left;cursor:pointer;font:inherit;
}
#lbBody .leaderboardHeroLink:hover b,
#lbBody .leaderboardGuildHero:hover b{color:#f2c66f;}
#lbBody .leaderboardAvatar,
#lbBody .leaderboardGuildEmblem{
  width:48px;height:48px;flex:0 0 48px;display:grid;place-items:center;overflow:hidden;box-sizing:border-box;
  border:1px solid #90652d;background:#111713;box-shadow:inset 0 0 0 2px #080b09,0 0 0 1px #21190e;
}
#lbBody .leaderboardAvatar img{width:100%;height:100%;object-fit:cover;}
#lbBody .leaderboardGuildEmblem{color:#d4ae69;font-size:17px;background:radial-gradient(circle,#263028,#0b0e0c 70%);}
#lbBody .leaderboardHeroIdentity,
#lbBody .leaderboardGuildHero > span:last-child{min-width:0;display:flex;flex-direction:column;gap:4px;}
#lbBody .leaderboardHeroIdentity b,
#lbBody .leaderboardGuildHero b{overflow:hidden;color:#ddd0b5;font-size:17px;font-weight:500;white-space:nowrap;text-overflow:ellipsis;}
#lbBody .leaderboardHeroIdentity b em,
#lbBody .leaderboardGuildHero b em{color:#62b8eb;font-size:12px;font-style:normal;}
#lbBody .leaderboardHeroIdentity small,
#lbBody .leaderboardGuildHero small{color:#837b6c;font:11px Arial,sans-serif;}
#lbBody .leaderboardClassBadge{display:inline-flex;align-items:center;gap:7px;color:#cfc2aa;white-space:nowrap;}
#lbBody .leaderboardClassBadge i{width:29px;height:29px;display:grid;place-items:center;border:1px solid #74512a;border-radius:50%;font-style:normal;background:#241810;}
#lbBody .leaderboardClassBadge.archer i{color:#8cbb59;background:#17230f;}
#lbBody .leaderboardClassBadge.mage i{color:#b784e4;background:#25142d;}
#lbBody .leaderboardClassBadge.warrior i{color:#da7757;background:#2b130e;}
#lbBody .leaderboardMainValue{color:#e2b65f!important;font-size:18px!important;}
#lbBody .leaderboardEmpty{text-align:center!important;color:#877d69!important;}
#lbBody .leaderboardOwnStrip{
  min-height:53px;display:grid;grid-template-columns:70px minmax(130px,1fr) auto auto;align-items:center;gap:16px;padding:0 20px;
  border:1px solid #5e4728;border-top-color:#a17436;background:linear-gradient(90deg,#122733,#0b171d 55%,#111812);box-sizing:border-box;color:#9fcbe4;
}
#lbBody .leaderboardOwnRank{font-size:25px;color:#62baf0;}
#lbBody .leaderboardOwnName{font-size:17px;color:#addcf6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
#lbBody .leaderboardOwnStrip > span:nth-child(3){color:#8b9da5;font:12px Arial,sans-serif;}
#lbBody .leaderboardOwnStrip b{font-size:20px;color:#70c2f0;}
#lbBody .leaderboardSummary{
  min-width:0;min-height:0;padding:16px 13px;display:flex;flex-direction:column;gap:10px;border-left:1px solid #49351e;
  background:linear-gradient(270deg,#090d0b,#0e1311 80%,#0a0e0c);box-sizing:border-box;
}
#lbBody .leaderboardSummaryCard{border:1px solid #49361f;background:linear-gradient(180deg,rgba(16,21,18,.96),rgba(7,11,9,.98));box-shadow:inset 0 0 20px rgba(0,0,0,.35);}
#lbBody .leaderboardSummaryCard h3{height:39px;margin:0;display:grid;place-items:center;border-bottom:1px solid #47331d;color:#c99549;font-size:16px;font-weight:500;text-transform:uppercase;letter-spacing:.05em;}
#lbBody .leaderboardSummaryCard.position{display:flex;flex-direction:column;align-items:center;padding-bottom:17px;text-align:center;}
#lbBody .leaderboardSummaryCard.position h3{width:100%;}
#lbBody .leaderboardPositionCrest{
  position:relative;
  width:113px;height:105px;margin:13px 0 2px;display:grid;place-items:center;clip-path:polygon(50% 0,91% 18%,84% 76%,50% 100%,16% 76%,9% 18%);
  background:linear-gradient(145deg,#9f7439,#1b2630 20%,#132939 64%,#805929);filter:drop-shadow(0 5px 5px #000);
}
#lbBody .leaderboardPositionCrest::before{content:"";position:absolute;width:96px;height:88px;clip-path:inherit;background:radial-gradient(circle at 50% 35%,#174967,#0a1922 68%);}
#lbBody .leaderboardPositionCrest span{position:relative;z-index:1;color:#6fc5f5;font-size:43px;text-shadow:0 2px 0 #071016,0 0 11px rgba(67,176,236,.35);}
#lbBody .leaderboardSummaryLabel{margin-top:5px;color:#9b8e77;font-size:14px;}
#lbBody .leaderboardSummaryValue{margin-top:5px;color:#6fc5f5;font-size:23px;font-weight:500;}
#lbBody .leaderboardSummaryCard.position small{margin-top:8px;color:#86ad52;font:12px Arial,sans-serif;}
#lbBody .leaderboardSummaryCard.info{margin-top:auto;padding-bottom:8px;}
#lbBody .leaderboardSummaryCard.info p{display:grid;grid-template-columns:27px 1fr;align-items:start;gap:7px;margin:13px 13px;color:#a9a08e;font-size:13px;line-height:1.35;}
#lbBody .leaderboardSummaryCard.info p span{color:#bd893b;font-size:19px;text-align:center;}
#lbBody .leaderboardLoadingBody{display:flex;grid-column:1/-1;flex-direction:column;align-items:center;justify-content:center;gap:15px;color:#9d8d72;font-size:16px;}
#lbBody .leaderboardLoadingCrest{color:#cb9645;font-size:64px;animation:leaderboardLoadingGlow 1.4s ease-in-out infinite;}
@keyframes leaderboardLoadingGlow{50%{filter:brightness(1.5);text-shadow:0 0 22px #a96b19;}}
@media (max-width:1280px){
  #lbBody .leaderboardHallGrid{grid-template-columns:176px minmax(455px,1fr) 225px;}
  #lbBody .leaderboardModeBtn{padding:0 11px;gap:8px;font-size:15px;}
  #lbBody .leaderboardSummary{padding-left:8px;padding-right:8px;}
  #lbBody .leaderboardServerTable th,#lbBody .leaderboardServerTable td{padding-left:7px;padding-right:7px;}
  #lbBody .leaderboardClassBadge span{display:none;}
  #lbBody .leaderboardCategoryBtn{font-size:13px;}
}
@media (max-width:980px){
  #lbBody .leaderboardHallGrid{grid-template-columns:145px minmax(0,1fr);}
  #lbBody .leaderboardSummary{display:none;}
  #lbBody .leaderboardModeBtn{font-size:13px;}
  #lbBody .leaderboardModeBtn > span{width:24px;font-size:20px;}
}
.achievementVault{
 position:relative;
 height:100%;
 min-height:0;
 display:flex;
 flex-direction:column;
 isolation:isolate;
 background:
  radial-gradient(circle at 62% 0, rgba(151,112,51,.09), transparent 42%),
  linear-gradient(180deg, rgba(8,12,12,.92), rgba(4,7,7,.97));
}
.achievementVault::before,
.achievementVault::after{
 content:"";
 position:absolute;
 z-index:5;
 pointer-events:none;
 inset:7px;
 border:1px solid rgba(145,109,59,.28);
}
.achievementVault::after{
 inset:2px;
 border-color:rgba(28,20,12,.9);
 box-shadow:inset 0 0 0 1px rgba(205,157,78,.12);
}
.achievementVaultHeader{
 position:relative;
 z-index:1;
 flex:0 0 78px;
 display:flex;
 align-items:center;
 justify-content:center;
 gap:22px;
 border-bottom:1px solid #584426;
 background:linear-gradient(180deg, rgba(23,27,25,.98), rgba(8,12,12,.98));
 box-shadow:0 8px 24px rgba(0,0,0,.38), inset 0 -1px rgba(209,161,82,.12);
}
.achievementVaultHeader::after{
 content:"◆";
 position:absolute;
 left:50%;
 bottom:-10px;
 transform:translateX(-50%) rotate(45deg);
 width:16px;
 height:16px;
 display:grid;
 place-items:center;
 color:#9f7538;
 font-size:8px;
 border:1px solid #806032;
 background:#111412;
}
.achievementVaultHeader h1{
 margin:0;
 color:#e1d2b8;
 font-size:clamp(27px, 3vw, 43px);
 font-weight:500;
 letter-spacing:.045em;
 line-height:1;
 text-transform:uppercase;
 text-shadow:0 2px 1px #000, 0 0 18px rgba(221,169,84,.16);
}
.achievementHeaderFlourish{
 color:#8f7045;
 font-size:32px;
 line-height:1;
 filter:drop-shadow(0 2px 1px #000);
}
.achievementHeaderFlourish.isMirrored{ transform:scaleX(-1); }
.achievementVaultLayout{
 position:relative;
 z-index:1;
 flex:1;
 min-height:0;
 display:grid;
 grid-template-columns:260px minmax(0,1fr);
}
.achievementCategoryRail{
 min-height:0;
 display:flex;
 flex-direction:column;
 padding:20px 14px 16px;
 border-right:1px solid rgba(140,103,54,.45);
 background:linear-gradient(90deg, rgba(10,14,13,.98), rgba(14,18,17,.92));
 box-shadow:8px 0 24px rgba(0,0,0,.25);
}
.achievementCategoryList{
 display:flex;
 flex-direction:column;
 gap:4px;
}
.achievementCategoryBtn,
.achievementStatsBtn{
 position:relative;
 min-height:56px;
 display:flex;
 align-items:center;
 gap:16px;
 padding:10px 18px;
 border:1px solid transparent;
 border-radius:2px;
 color:#bca784;
 background:transparent;
 font:500 17px/1 Georgia, "Times New Roman", serif;
 letter-spacing:.025em;
 text-align:left;
 text-transform:uppercase;
 cursor:pointer;
 transition:color .16s ease, filter .16s ease, border-color .16s ease;
}
.achievementCategoryBtn:hover,
.achievementStatsBtn:hover{
 color:#efd196;
 filter:brightness(1.1);
}
.achievementCategoryBtn.isActive{
 color:#f0d5a3;
 border-color:#87612e;
 background:
  linear-gradient(90deg, rgba(145,87,25,.62), rgba(65,43,22,.7) 70%, rgba(29,23,17,.82)),
  radial-gradient(circle at 18% 50%, rgba(255,190,76,.3), transparent 42%);
 box-shadow:inset 3px 0 #e2a342, inset 0 0 22px rgba(219,151,52,.12), 0 7px 16px rgba(0,0,0,.32);
}
.achievementCategoryBtn.isActive::after{
 content:"◆";
 position:absolute;
 right:10px;
 color:#9f7134;
 font-size:10px;
}
.achievementCategoryIcon{
 flex:0 0 27px;
 width:27px;
 color:#9b7c4e;
 font-size:25px;
 line-height:1;
 text-align:center;
 text-shadow:0 2px 2px #000;
}
.achievementCategoryBtn.isActive .achievementCategoryIcon{ color:#f2be61; }
.achievementStatsBtn{
 margin-top:auto;
 min-height:50px;
 justify-content:center;
 border-color:#745936;
 color:#d7bd8d;
 background:linear-gradient(180deg, rgba(39,38,32,.86), rgba(11,15,15,.94));
 box-shadow:inset 0 0 0 2px rgba(0,0,0,.45), 0 7px 16px rgba(0,0,0,.34);
}
.achievementVaultMain{
 min-width:0;
 min-height:0;
 display:flex;
 flex-direction:column;
 padding:16px 18px 16px;
 background:linear-gradient(110deg, rgba(17,21,20,.78), rgba(5,9,9,.85));
}
.achievementSummary{
 flex:0 0 154px;
 display:grid;
 grid-template-columns:minmax(370px,1.25fr) minmax(180px,.55fr) minmax(300px,.95fr);
 align-items:center;
 border-bottom:1px solid rgba(126,99,60,.32);
}
.achievementSummaryProgress,
.achievementSummaryPoints,
.achievementSummaryLatest{
 min-width:0;
 min-height:104px;
 display:flex;
 align-items:center;
 padding:10px 24px;
}
.achievementSummaryPoints,
.achievementSummaryLatest{ border-left:1px solid rgba(126,99,60,.35); }
.achievementSummaryCrest{
 flex:0 0 106px;
 width:106px;
 height:106px;
 margin-right:22px;
 border-radius:50%;
 background:radial-gradient(circle, rgba(161,113,44,.2), transparent 70%);
 filter:drop-shadow(0 10px 12px rgba(0,0,0,.55));
}
.achievementSummaryCrest img{
 width:100%;
 height:100%;
 object-fit:cover;
 border-radius:50%;
 clip-path:circle(47% at 50% 50%);
}
.achievementSummaryCopy{ flex:1; min-width:0; }
.achievementEyebrow{
 display:block;
 margin-bottom:8px;
 color:#aa8a5b;
 font-size:15px;
 letter-spacing:.04em;
 text-transform:uppercase;
}
.achievementSummaryCopy > strong{
 display:block;
 color:#dfd0b7;
 font-size:42px;
 font-weight:500;
 line-height:1;
 text-shadow:0 2px 1px #000;
}
.achievementSummaryCopy > strong small{ font-size:24px; font-weight:400; }
.achievementOverallProgress{
 display:grid;
 grid-template-columns:1fr auto;
 align-items:center;
 gap:12px;
 margin-top:14px;
 color:#d4b77f;
 font-size:14px;
}
.achievementProgressTrack{
 height:10px;
 overflow:hidden;
 border:1px solid #654d2e;
 border-radius:7px;
 background:#090c0b;
 box-shadow:inset 0 2px 4px rgba(0,0,0,.8);
}
.achievementProgressTrack i{
 display:block;
 width:0;
 height:100%;
 border-radius:5px;
 background:linear-gradient(90deg, #b66e19, #eab759 70%, #ffd885);
 box-shadow:inset 0 1px rgba(255,238,178,.42), 0 0 10px rgba(223,148,44,.22);
 transition:width .25s ease;
}
.achievementSummaryPoints{
 flex-direction:column;
 align-items:flex-start;
 justify-content:center;
}
.achievementSummaryPoints strong{
 display:flex;
 align-items:center;
 gap:10px;
 color:#dbc7a4;
 font-size:34px;
 font-weight:500;
 line-height:1;
}
.achievementSummaryPoints strong span{ font-size:28px; }
.achievementSummaryPoints small{
 margin-top:8px;
 color:#81796d;
 font-size:12px;
}
.achievementSummaryLatest{
 flex-direction:column;
 align-items:stretch;
 justify-content:center;
}
.achievementLatestEntry{
 display:grid;
 grid-template-columns:66px 1fr;
 align-items:center;
 gap:14px;
 min-width:0;
}
.achievementLatestEntry img{
 width:64px;
 height:64px;
 object-fit:cover;
 border:1px solid #9a7037;
 box-shadow:0 0 0 3px #16130f, 0 5px 12px rgba(0,0,0,.45);
}
.achievementLatestEntry div{ min-width:0; }
.achievementLatestEntry strong,
.achievementLatestEntry span,
.achievementLatestEntry small,
.achievementLatestEmpty strong,
.achievementLatestEmpty span{ display:block; }
.achievementLatestEntry strong{
 overflow:hidden;
 color:#dfd0b7;
 font-size:18px;
 font-weight:500;
 text-overflow:ellipsis;
 white-space:nowrap;
}
.achievementLatestEntry span,
.achievementLatestEmpty span{
 margin-top:4px;
 overflow:hidden;
 color:#989088;
 font:13px/1.2 Arial, sans-serif;
 text-overflow:ellipsis;
 white-space:nowrap;
}
.achievementLatestEntry small{ margin-top:5px; color:#9e9486; font-size:12px; }
.achievementLatestEmpty strong{ color:#c7b697; font-size:18px; font-weight:500; }
.achievementCollection{
 flex:1;
 min-height:0;
 display:flex;
 flex-direction:column;
 padding-top:10px;
}
.achievementCollectionHeader{
 flex:0 0 48px;
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:18px;
 padding:0 10px;
}
.achievementCollectionHeader h2{
 margin:0;
 color:#af9367;
 font-size:17px;
 font-weight:500;
 letter-spacing:.04em;
 text-transform:uppercase;
}
.achievementFilter{
 width:210px;
 height:38px;
 padding:0 14px;
 border:1px solid #554a36;
 border-radius:5px;
 color:#bda984;
 background:#101514;
 box-shadow:inset 0 0 0 2px rgba(0,0,0,.35);
 font:14px Georgia, "Times New Roman", serif;
 cursor:pointer;
}
.achievementRows{
 flex:1;
 min-height:0;
 overflow:auto;
 padding:0 6px 2px;
 scrollbar-color:#68563a #101312;
 scrollbar-width:thin;
}
.achievementRows::-webkit-scrollbar{ width:10px; }
.achievementRows::-webkit-scrollbar-track{ background:#101312; }
.achievementRows::-webkit-scrollbar-thumb{ border:2px solid #101312; border-radius:8px; background:#68563a; }
.achievementRow{
 min-height:88px;
 display:grid;
 grid-template-columns:72px minmax(190px,1.35fr) minmax(180px,.8fr) 78px 112px;
 align-items:center;
 gap:14px;
 margin-bottom:6px;
 padding:9px 18px;
 border:1px solid rgba(111,94,65,.34);
 border-radius:4px;
 background:linear-gradient(100deg, rgba(27,32,30,.9), rgba(12,17,16,.92));
 box-shadow:inset 0 0 18px rgba(0,0,0,.25), 0 2px 5px rgba(0,0,0,.28);
}
.achievementRow.isUnlocked{ border-color:rgba(133,103,61,.48); }
.achievementRow.isLocked{
 color:#817e76;
 background:linear-gradient(100deg, rgba(20,24,23,.82), rgba(10,13,13,.9));
}
.achievementBadge{
 position:relative;
 width:62px;
 height:62px;
 padding:2px;
 border:1px solid #8f6938;
 background:#15130f;
 box-shadow:0 0 0 2px #090b0b, 0 5px 10px rgba(0,0,0,.38);
}
.achievementBadge img{ width:100%; height:100%; object-fit:cover; display:block; }
.achievementBadge.isLocked img{ filter:grayscale(1) brightness(.32); }
.achievementBadge.isLocked::after{
 content:"🔒";
 position:absolute;
 inset:0;
 display:grid;
 place-items:center;
 color:#b4afa3;
 background:rgba(5,7,7,.24);
 font-size:24px;
 filter:grayscale(1);
 text-shadow:0 2px 4px #000;
}
.achievementCopy{ min-width:0; }
.achievementCopy h3{
 margin:0 0 6px;
 color:#d8cbb5;
 font-size:20px;
 font-weight:500;
 line-height:1.1;
}
.achievementRow.isLocked .achievementCopy h3{ color:#8f8c85; }
.achievementCopy p{
 margin:0;
 color:#9e9690;
 font:14px/1.3 Arial, sans-serif;
}
.achievementRowProgress > span{
 display:block;
 margin-bottom:7px;
 color:#b6aa98;
 font:13px Arial, sans-serif;
 text-align:center;
}
.achievementRow.isUnlocked .achievementRowProgress > span{ color:#b6945d; }
.achievementRowProgress .achievementProgressTrack{ height:8px; }
.achievementPoints{
 display:flex;
 align-items:center;
 gap:6px;
 color:#d89a36;
 font-size:20px;
 white-space:nowrap;
}
.achievementPoints span{ font-size:20px; }
.achievementDate{
 color:#aaa197;
 font-size:13px;
 line-height:1.25;
 text-align:center;
}
.achievementRow.isLocked .achievementDate{ color:#686963; }
.achievementEmptyState{
 margin:20px 6px;
 padding:34px;
 border:1px dashed rgba(154,121,70,.35);
 color:#928675;
 text-align:center;
}
@media (max-width:1180px){
 body #achScreen .panelBody#achBody{
  width:calc(100vw - 270px) !important;
  max-width:calc(100vw - 270px) !important;
 }
 .achievementVaultLayout{ grid-template-columns:205px minmax(0,1fr); }
 .achievementCategoryBtn{ padding-left:12px; font-size:14px; }
 .achievementSummary{ grid-template-columns:minmax(330px,1.2fr) minmax(155px,.55fr); }
 .achievementSummaryLatest{ display:none; }
 .achievementRow{ grid-template-columns:58px minmax(130px,1fr) minmax(100px,.65fr) 60px; gap:10px; padding-inline:10px; }
 .achievementDate{ display:none; }
}
@media (max-width:1050px){
 .achievementSummary{ grid-template-columns:1fr; }
 .achievementSummaryPoints{ display:none; }
}
@media (max-width:900px){
 body #achScreen .panelBody#achBody{
  width:calc(100vw - 24px) !important;
  max-width:calc(100vw - 24px) !important;
  transform:none !important;
 }
 .achievementVaultHeader{ flex-basis:64px; }
 .achievementVaultLayout{ display:flex; flex-direction:column; }
 .achievementCategoryRail{ flex:0 0 auto; padding:8px 10px; border-right:0; border-bottom:1px solid rgba(140,103,54,.45); }
 .achievementCategoryList{ flex-direction:row; overflow-x:auto; }
 .achievementCategoryBtn{ min-height:40px; flex:0 0 auto; gap:8px; padding:7px 12px; }
 .achievementCategoryIcon{ width:20px; flex-basis:20px; font-size:19px; }
 .achievementStatsBtn{ display:none; }
 .achievementVaultMain{ padding:8px 10px 10px; }
 .achievementSummary{ flex-basis:112px; grid-template-columns:minmax(270px,1fr) 150px; }
 .achievementSummaryProgress,.achievementSummaryPoints{ min-height:88px; padding:8px 14px; }
 .achievementSummaryCrest{ width:74px; height:74px; flex-basis:74px; margin-right:14px; }
 .achievementSummaryCopy > strong{ font-size:31px; }
 .achievementRow{ grid-template-columns:58px minmax(170px,1fr) minmax(125px,.7fr) 62px; min-height:76px; gap:10px; padding:7px 10px; }
 .achievementBadge{ width:52px; height:52px; }
 .achievementDate{ display:none; }
 .achievementCopy h3{ font-size:17px; }
 .achievementCopy p{ font-size:12px; }
}
@media (max-width:640px){
 .achievementHeaderFlourish{ display:none; }
 .achievementVaultHeader h1{ font-size:25px; }
 .achievementSummary{ grid-template-columns:1fr; flex-basis:auto; padding:4px 0; }
 .achievementSummaryPoints{ display:none; }
 .achievementSummaryProgress{ min-height:82px; }
 .achievementCollectionHeader{ padding:0 4px; }
 .achievementCollectionHeader h2{ font-size:14px; }
 .achievementFilter{ width:135px; }
 .achievementRow{ grid-template-columns:50px minmax(0,1fr) 58px; }
 .achievementBadge{ width:45px; height:45px; }
 .achievementRowProgress{ grid-column:2 / -1; display:grid; grid-template-columns:70px 1fr; align-items:center; gap:8px; }
 .achievementRowProgress > span{ margin:0; text-align:left; }
 .achievementPoints{ grid-column:3; grid-row:1; font-size:17px; }
 .achievementDate{ display:none; }
}
.achToast{
 position: fixed;
 right: 18px;
 bottom: 18px;
 width: 340px;
 display:flex;
 gap:12px;
 padding: 12px;
 border-radius: 14px;
 background: rgba(10,10,10,.92);
 border: 1px solid rgba(255,215,120,.22);
 box-shadow: 0 18px 50px rgba(0,0,0,.65);
 transform: translateY(34px);
 opacity: 0;
 pointer-events:none;
 transition: transform .22s ease, opacity .22s ease;
 z-index:999998;
}
.achToast.show{ transform: translateY(0); opacity: 1; }
.achToastIco{ width:54px; height:54px; border-radius: 14px; overflow:hidden; background: rgba(0,0,0,.35); border:1px solid rgba(255,255,255,.06); display:flex; align-items:center; justify-content:center; }
.achToastIco img{ width:44px; height:44px; object-fit:contain; }
.achToastTitle{ font-weight:1000; font-size:12px; opacity:.9; }
.achToastName{ font-weight:1000; font-size:15px; margin-top:2px; }
.achToastDesc{ font-size:12px; opacity:.85; margin-top:2px; }

#statsScreen .topBar{ display:none !important; }
#statsScreen .statsWindow{ padding-top:0 !important; }
#statsScreen .panelBody.statsBody{ border-top-left-radius:18px; border-top-right-radius:18px; }

 body{
 margin:0;
 background:
 radial-gradient(1200px 700px at 50% -250px, rgba(110,160,255,.10), transparent 70%),
 radial-gradient(900px 500px at 20% 10%, rgba(140,60,255,.10), transparent 60%),
 radial-gradient(900px 500px at 80% 20%, rgba(0,220,255,.07), transparent 55%),
 linear-gradient(180deg, #070914 0%, #05060c 100%);
 background-attachment: fixed;
 background-size: cover;
 background-position: center;
 }

 #bgFX{
 position:fixed;
 inset:0;
 z-index:0;
 pointer-events:none;

 background:
 radial-gradient(circle at 50% 50%, rgba(0,0,0,0) 55%, rgba(0,0,0,.55) 100%),
 repeating-radial-gradient(circle at 50% 45%,
 rgba(120,180,255,.07) 0 2px,
 rgba(0,0,0,0) 2px 26px);
 mix-blend-mode: normal;
 }

 #bgFX::before,
 #bgFX::after{
 content:"";
 position:absolute;
 inset:-15%;
 background-repeat: repeat;
 opacity:.55;
 filter: blur(2px);
 will-change: transform;
 }

 #bgFX::before{
 background-image:
 radial-gradient(closest-side at 20% 30%, rgba(90,170,255,.14), transparent 65%),
 radial-gradient(closest-side at 60% 40%, rgba(170,80,255,.12), transparent 68%),
 radial-gradient(closest-side at 80% 70%, rgba(0,240,255,.10), transparent 66%),
 radial-gradient(closest-side at 30% 80%, rgba(40,120,255,.10), transparent 70%);
 animation: fogDrift1 22s linear infinite;
 transform: translate3d(0,0,0) scale(1.05);
 }

 #bgFX::after{
 background-image:
 radial-gradient(closest-side at 10% 60%, rgba(120,210,255,.10), transparent 72%),
 radial-gradient(closest-side at 45% 20%, rgba(210,120,255,.10), transparent 72%),
 radial-gradient(closest-side at 85% 45%, rgba(60,210,255,.08), transparent 74%),
 radial-gradient(closest-side at 55% 85%, rgba(140,120,255,.08), transparent 74%);
 animation: fogDrift2 14s linear infinite;
 opacity:.40;
 transform: translate3d(0,0,0) scale(1.12);
 }

 @keyframes fogDrift1{
 0% { transform: translate3d(-3%, -2%, 0) scale(1.05); }
 50% { transform: translate3d(3%, 2%, 0) scale(1.08); }
 100% { transform: translate3d(-3%, -2%, 0) scale(1.05); }
 }
 @keyframes fogDrift2{
 0% { transform: translate3d(4%, 1%, 0) scale(1.12); }
 50% { transform: translate3d(-4%, -1%, 0) scale(1.16); }
 100% { transform: translate3d(4%, 1%, 0) scale(1.12); }
 }

 #bgFX .sparkles{ display:none; }

.classPickBtn{
 border:0 !important;
 outline:0 !important;
 background:transparent !important;
 box-shadow:none !important;
}

.classPickBtn img{
 display:block;
 width:96px;
 height:96px;
 object-fit:contain;
 cursor:pointer;
 user-select:none;
 pointer-events:none;
 transition: transform .2s ease, filter .2s ease;
 filter: drop-shadow(0 8px 18px rgba(0,0,0,.55));
}

.classPickBtn:hover img{
 transform: translateY(-2px) scale(1.05);
}

.classPickBtn.selected img{
 transform: scale(1.08);
 animation: classPulse 1.8s ease-in-out infinite;
}

.classPickBtn.flash img{
 animation: classFlash .32s ease;
}

@keyframes classFlash{
 0%{
 transform: scale(1.12);
 filter:
 brightness(1.35)
 drop-shadow(0 0 26px rgba(255,255,255,.75))
 drop-shadow(0 10px 22px rgba(0,0,0,.55));
 }
 100%{
 transform: scale(1.08);
 filter: drop-shadow(0 8px 18px rgba(0,0,0,.55));
 }
}

@keyframes classPulse{
 0%,100%{ opacity:1; }
 50%{ opacity:.92; }
}

.classPickBtn.selected.warriorGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 26px rgba(255,70,70,.55));
}

.classPickBtn.selected.archerGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 26px rgba(80,255,140,.50));
}

.classPickBtn.selected.mageGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 28px rgba(130,130,255,.55));
}

.classPickBtn,
.classPickBtn.selected{
 border: none !important;
 outline: none !important;
 background: transparent !important;
 box-shadow: none !important;
}

.classPickBtn::before,
.classPickBtn::after{
 display:none !important;
}

#createClassRow{
 position:absolute !important;
 right:120px !important;
 top:170px !important;
 display:flex !important;
 flex-direction:column !important;
 gap:36px !important;
 align-items:center !important;
}

html, body{ overflow-x:hidden; }

#createClassRow{
 position:absolute !important;
 right:120px !important;
 top:170px !important;
 display:flex !important;
 flex-direction:column !important;
 gap:36px !important;
 align-items:center !important;
}

.classPickBtn img{
 width:150px !important;
 height:150px !important;
}

#classPickerTitle{
 position:static !important;
 right:auto !important;
 top:auto !important;

 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:30px;
 font-weight:900;
 letter-spacing:1px;
 color:#7ad7ff;
 text-align:center;
 margin-bottom:10px;

 text-shadow:
 0 0 14px rgba(90,190,255,.7),
 0 4px 14px rgba(0,0,0,.85);
 pointer-events:none;
}

#classHoverTip{
 position:fixed;
 z-index:999999;
 padding:8px 12px;
 border-radius:10px;
 background:rgba(10,14,22,.88);
 color:#d7f4ff;
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:16px;
 font-weight:800;
 letter-spacing:.5px;
 text-shadow:0 2px 10px rgba(0,0,0,.85);
 box-shadow:
 0 0 18px rgba(90,190,255,.35),
 0 10px 30px rgba(0,0,0,.55);
 opacity:0;
 transform:translateY(6px);
 transition:opacity .12s ease, transform .12s ease;
 pointer-events:none;
 user-select:none;
 white-space:nowrap;
}

#classHoverTip.show{
 opacity:1;
 transform:translateY(0);
}

body.mode-create .createClassTitle,
body.mode-create .createClassHint{ display:none !important; }

body.mode-create #hud,
body.mode-create #leftHudMenu{ display:none !important; }

html, body{ margin:0; padding:0; }

.statKey.is-main, .statLbl.is-main{ font-weight:1000 !important; font-size:1.08em; }
.statKey.is-shared, .statLbl.is-shared{ font-weight:900 !important; font-size:1.05em; }

#shopScreen .statsPanel, #shopScreen #pStats, #shopScreen #eStats{ display:none !important; }

#shopINT,#shopVIT,#shopDUR,#shopAGI,#shopDMG,#shopDEF,#shopCRIT,#shopSTR{ display:none !important; }

#arenaFXLayer{
 position: fixed;
 left:0; top:0;
 width:100vw; height:100vh;
 pointer-events:none;
 z-index: 99999;
 overflow: visible;
}
.fxProjectile{
 position:absolute;
 width:18px; height:6px;
 border-radius:999px;
 filter: drop-shadow(0 0 10px rgba(255,255,255,.35));
 transform-origin: center;
}
.fxArrow{
 width:86px; height:8px;
 background: linear-gradient(90deg,
 rgba(165,120,70,1) 0%,
 rgba(185,140,85,1) 70%,
 rgba(240,240,240,1) 70%,
 rgba(240,240,240,1) 100%);
 border-radius:3px;
 position:relative;
}
.fxArrow::before{
 content:"";
 position:absolute;
 right:-8px; top:-3px;
 width:0; height:0;
 border-left:10px solid rgba(240,240,240,1);
 border-top:6px solid transparent;
 border-bottom:6px solid transparent;
 filter: drop-shadow(0 0 6px rgba(255,255,255,.25));
}
.fxArrow::after{
 content:"";
 position:absolute;
 left:-10px; top:-2px;
 width:12px; height:10px;
 background: linear-gradient(90deg, rgba(220,220,220,.0), rgba(220,220,220,.9));
 clip-path: polygon(0 50%, 100% 0, 85% 50%, 100% 100%);
 opacity:.9;
}
.fxBoltArcane{
 width:22px; height:8px;
 border-radius:999px;
 background: radial-gradient(circle at 30% 50%, rgba(180,210,255,1), rgba(120,160,255,0.1));
}
.fxBoltIce{
 width:10px; height:26px;
 border-radius:4px;
 background: linear-gradient(180deg, rgba(200,240,255,1), rgba(120,200,255,0.25));
}
.fxFireball{
 width:22px; height:22px;
 border-radius:50%;
 background: radial-gradient(circle at 35% 35%, rgba(255,240,180,1), rgba(255,120,40,1) 55%, rgba(140,30,10,0.2));
}
.fxSlash{
 position:absolute;
 width:180px; height:14px;
 border-radius:999px;
 background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.95), rgba(255,255,255,0));
 filter: drop-shadow(0 0 18px rgba(255,255,255,.28));
 transform: rotate(-20deg);
 opacity:1;
}
.fxScar{
 position:absolute;
 width:90px; height:6px;
 border-radius:999px;
 background: linear-gradient(90deg, rgba(180,20,20,0), rgba(220,40,40,.95), rgba(180,20,20,0));
 filter: drop-shadow(0 0 10px rgba(220,40,40,.25));
 opacity:.95;
}

.fxSprite{
 position:absolute;
 width:56px;
 height:auto;
 transform: translate(-50%,-50%);
 pointer-events:none;
 user-select:none;
 image-rendering: auto;
 filter: drop-shadow(0 0 12px rgba(0,0,0,.35));
}
.fxSprite.small{ width:42px; }
.fxSprite.tiny{ width:32px; }
.fxSprite.weapon{ width:220px; }
.fxSprite.enemyWeaponThrow,
.fxSprite.warriorWeaponThrow{ width:130px; height:130px; }

.fxSprite.arrowBig{ width:140px; }

.fxSprite.worldBossProjectile{
 width:210px;
 height:150px;
 object-fit:contain;
 z-index:28;
 filter:drop-shadow(0 0 10px rgba(var(--wb-projectile-color,255,120,55),.86)) drop-shadow(0 0 24px rgba(var(--wb-projectile-color,255,120,55),.42));
}

#arenaWrap.worldBossArena{
 --bg:url('../img/world_boss_map_v1.png') !important;
}
#arenaScreen .bgWrap.worldBossArena{
 --bg:url('../img/world_boss_map_v1.png') !important;
}
.fxSprite.wbProjectileGorath{ --wb-projectile-color:255,116,35; width:240px; height:145px; }
.fxSprite.wbProjectileIgnivar{ --wb-projectile-color:255,91,20; width:205px; }
.fxSprite.wbProjectileThalassor{ --wb-projectile-color:73,201,255; width:215px; }
.fxSprite.wbProjectileVoltraxis{ --wb-projectile-color:74,162,255; width:230px; height:145px; }
.fxSprite.wbProjectileMorvanna{ --wb-projectile-color:136,255,54; width:220px; }
.fxSprite.wbProjectileAurelion{ --wb-projectile-color:255,220,77; width:225px; }
.fxSprite.wbProjectileNoxar{ --wb-projectile-color:181,69,255; width:220px; }

.worldBossImpact{
 --wb-impact-color:255,120,55;
 position:absolute;
 z-index:29;
 width:150px;
 height:150px;
 border-radius:50%;
 pointer-events:none;
 transform:translate(-50%,-50%) scale(.12);
 background:radial-gradient(circle, rgba(255,255,255,.98) 0 6%, rgba(var(--wb-impact-color),.86) 7% 20%, rgba(var(--wb-impact-color),.26) 38%, transparent 69%);
 box-shadow:0 0 30px rgba(var(--wb-impact-color),.92), 0 0 64px rgba(var(--wb-impact-color),.48);
 animation:worldBossImpactBurst .72s cubic-bezier(.12,.72,.24,1) forwards;
}
.worldBossImpact::before,
.worldBossImpact::after{
 content:"";
 position:absolute;
 inset:18%;
 border:3px solid rgba(var(--wb-impact-color),.86);
 border-radius:inherit;
 box-shadow:0 0 18px rgba(var(--wb-impact-color),.7), inset 0 0 16px rgba(var(--wb-impact-color),.5);
 animation:worldBossImpactRing .68s ease-out forwards;
}
.worldBossImpact::after{
 inset:32%;
 border-width:6px;
 animation-delay:.05s;
}
.worldBossImpact-gorath{ --wb-impact-color:255,116,35; border-radius:18%; transform:translate(-50%,-50%) rotate(45deg) scale(.12); }
.worldBossImpact-gorath::before{ border-radius:12%; border-style:dashed; }
.worldBossImpact-ignivar{ --wb-impact-color:255,82,18; }
.worldBossImpact-thalassor{ --wb-impact-color:50,199,255; }
.worldBossImpact-thalassor::before{ border-style:double; }
.worldBossImpact-voltraxis{ --wb-impact-color:67,145,255; border-radius:18%; }
.worldBossImpact-voltraxis::before{ transform:rotate(45deg); border-radius:8%; }
.worldBossImpact-morvanna{ --wb-impact-color:126,247,48; }
.worldBossImpact-morvanna::after{ border-style:dotted; }
.worldBossImpact-aurelion{ --wb-impact-color:255,215,68; }
.worldBossImpact-aurelion::before{ border-width:7px; }
.worldBossImpact-noxar{ --wb-impact-color:173,58,255; background:radial-gradient(circle, #030006 0 15%, rgba(72,0,105,.95) 18% 28%, rgba(var(--wb-impact-color),.72) 31%, transparent 67%); }

@keyframes worldBossImpactBurst{
 0%{ opacity:0; transform:translate(-50%,-50%) scale(.12); }
 28%{ opacity:1; transform:translate(-50%,-50%) scale(.9); }
 100%{ opacity:0; transform:translate(-50%,-50%) scale(1.55); }
}
@keyframes worldBossImpactRing{
 0%{ opacity:1; transform:scale(.35) rotate(0deg); }
 100%{ opacity:0; transform:scale(1.75) rotate(95deg); }
}

@keyframes arrowWobble {
 0%{ transform: translate(-50%,-50%) rotate(var(--ang)) }
 30%{ transform: translate(-50%,-50%) rotate(calc(var(--ang) + 1.8deg)) }
 60%{ transform: translate(-50%,-50%) rotate(calc(var(--ang) - 1.2deg)) }
 100%{ transform: translate(-50%,-50%) rotate(var(--ang)) }
}
.fxSprite.wobble{
 animation: arrowWobble 0.22s linear infinite;
}
@keyframes hitFlash {
 0%{ filter:none; }
 40%{ filter: brightness(1.35) contrast(1.12) drop-shadow(0 0 18px rgba(255,120,60,.35)); }
 100%{ filter:none; }
}
.hitFlash{
 animation: hitFlash 0.22s ease-out 1;
}

.fxSprite.trailGhost{
 opacity: .35;
 filter: blur(1.6px) drop-shadow(0 0 10px rgba(255,255,255,.12));
 mix-blend-mode: screen;
}
.fxSprite.auraFire{
 filter: drop-shadow(0 0 10px rgba(255,140,60,.55)) drop-shadow(0 0 20px rgba(255,80,20,.25));
 animation: auraPulseFire .22s ease-in-out infinite alternate;
}
@keyframes auraPulseFire{
 from{ filter: drop-shadow(0 0 9px rgba(255,150,70,.50)) drop-shadow(0 0 18px rgba(255,90,30,.22)); }
 to{ filter: drop-shadow(0 0 15px rgba(255,170,90,.62)) drop-shadow(0 0 26px rgba(255,90,30,.30)); }
}
.fxSprite.auraFrost{
 filter: drop-shadow(0 0 10px rgba(120,220,255,.55)) drop-shadow(0 0 20px rgba(160,240,255,.22));
 animation: auraPulseFrost .26s ease-in-out infinite alternate;
}
@keyframes auraPulseFrost{
 from{ filter: drop-shadow(0 0 9px rgba(130,225,255,.50)) drop-shadow(0 0 18px rgba(170,245,255,.20)); }
 to{ filter: drop-shadow(0 0 15px rgba(160,245,255,.65)) drop-shadow(0 0 28px rgba(190,255,255,.28)); }
}
.fxSprite.auraArcane{
 filter: drop-shadow(0 0 10px rgba(160,120,255,.55)) drop-shadow(0 0 20px rgba(90,160,255,.25));
 animation: auraPulseArcane .18s ease-in-out infinite alternate;
}
@keyframes auraPulseArcane{
 from{ filter: drop-shadow(0 0 8px rgba(170,130,255,.48)) drop-shadow(0 0 16px rgba(90,170,255,.22)); }
 to{ filter: drop-shadow(0 0 16px rgba(190,150,255,.68)) drop-shadow(0 0 30px rgba(110,190,255,.32)); }
}

#cityScreen .bg{
 width: calc(100vw - var(--sideW)) !important;
 margin-left: var(--sideW) !important;
 justify-content: center;
}
#cityScreen #cityBG{
 background-image: url("img/city.png");
 background-size: cover;
 background-position: center;
 background-repeat: no-repeat;

 position: relative;
}

.talWrap{ max-width: 860px; margin: 0 auto; }
.talHdr{ display:flex; align-items:flex-end; justify-content:space-between; gap:12px; margin-bottom:12px; }
.talTree{ position:relative; display:flex; flex-direction:column; align-items:center; gap:18px; padding: 8px 0 18px; }
.talNode{ width:100%; max-width: 640px; position:relative; }
.talNode::before{
 content:"";
 position:absolute;
 left: 40px;
 top: -18px;
 width: 2px;
 height: 18px;
 background: rgba(255,255,255,.18);
}
.talNode:first-child::before{ display:none; }

.talCardTree{
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap: 12px;
 padding: 12px 12px;
 border-radius: 18px;
 border:1px solid rgba(255,255,255,.10);
 background: rgba(0,0,0,.28);
 box-shadow: 0 14px 40px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.06);
}

.talLeft{ display:flex; align-items:center; gap:12px; min-width: 0; }
.talIcon{
 width: 56px; height: 56px;
 border-radius: 16px;
 display:flex; align-items:center; justify-content:center;
 background: rgba(255,255,255,.08);
 border:1px solid rgba(255,255,255,.14);
 box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
 flex:0 0 auto;
}
.talIcon svg{ width: 30px; height: 30px; opacity:.95; }
.talTxt{ min-width:0; }
.talName{ font-weight: 1000; font-size: 16px; line-height:1.15; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.talDesc{ margin-top:2px; opacity:.85; font-size: 12.5px; line-height:1.25; }

.talRight{ display:flex; align-items:center; gap:10px; }
.talRank{ font-weight: 1000; opacity:.9; }

.talLocked .talCardTree{
 opacity:.45;
 filter: grayscale(.35);
}
.talLocked .talIcon{ opacity:.7; }

@media (max-width: 980px){
 .talWrap{ max-width: 92vw; }
 .talNode{ max-width: 92vw; }
}

.talV2Wrap{max-width: 980px; margin: 0 auto; padding: 10px 10px 18px;}
.talV2Header{display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px;}
.talV2Title{font-family:var(--titleFont, inherit); font-size:20px; letter-spacing:.5px;}
.talV2Meta{display:flex; gap:10px; align-items:center; opacity:.9; font-size:13px;}
.talV2Pill{padding:6px 10px; border-radius:999px; background: rgba(0,0,0,.35); border:1px solid rgba(255,255,255,.10);}
.talV2Board{display:grid; grid-template-columns: 1fr 1fr; gap:14px;}
.talV2Board.single{grid-template-columns:1fr; max-width: 520px; margin: 0 auto;}
@media (max-width: 980px){ .talV2Board{grid-template-columns:1fr;} }
.talV2Spec{position:relative; border-radius:16px; background: rgba(0,0,0,.28); border:1px solid rgba(255,255,255,.10); overflow:hidden;}
.talV2SpecHead{display:flex; align-items:center; justify-content:space-between; padding:10px 12px; border-bottom:1px solid rgba(255,255,255,.08);}
.talV2SpecName{font-weight:700; letter-spacing:.3px; opacity:.95;}
.talV2Hint{font-size:12px; opacity:.65;}
.talV2Canvas{position:relative; height: 520px; padding:10px;}
@media (max-height: 820px){ .talV2Canvas{height: 460px;} }
.talV2Lines{position:absolute; inset:0; width:100%; height:100%; pointer-events:none; opacity:.85;}
.talV2Node{
 position:absolute;
 width: 58px; height: 58px;
 border-radius: 999px;
 display:flex; align-items:center; justify-content:center;
 background: radial-gradient(circle at 30% 25%, rgba(255,255,255,.18), rgba(0,0,0,.45) 55%, rgba(0,0,0,.65));
 border: 1px solid rgba(255,255,255,.18);
 box-shadow: 0 10px 24px rgba(0,0,0,.35);
 transform: translate(-50%, -50%);
 cursor:pointer;
}
.talV2Node:hover{filter:brightness(1.08);}
.talV2Node.locked{opacity:.30; cursor:not-allowed; filter:grayscale(0.6);}
.talV2Node.maxed{outline:2px solid rgba(120,220,140,.55);}
.talV2Icon{width:28px; height:28px; display:block;}
.talV2Rank{
 position:absolute; right:-6px; bottom:-6px;
 width:24px; height:24px;
 border-radius:999px;
 display:flex; align-items:center; justify-content:center;
 font-size:12px; font-weight:800;
 background: rgba(0,0,0,.65);
 border:1px solid rgba(255,255,255,.18);
}
.talV2Plus{
 position:absolute; left:-8px; bottom:-8px;
 width:24px; height:24px;
 border-radius:999px;
 display:flex; align-items:center; justify-content:center;
 font-size:14px; font-weight:900;
 background: rgba(0,0,0,.65);
 border:1px solid rgba(255,255,255,.18);
 opacity:.9;
}
.talV2Node.locked .talV2Plus{display:none;}
.talV2Node.maxed .talV2Plus{display:none;}
.talV2Tooltip{
 position:absolute;
 min-width: 220px;
 max-width: 280px;
 padding:10px 10px;
 border-radius:12px;
 background: rgba(0,0,0,.78);
 border:1px solid rgba(255,255,255,.14);
 box-shadow: 0 18px 40px rgba(0,0,0,.55);
 transform: translate(-50%, calc(-100% - 12px));
 left:50%; top:0;
 pointer-events:none;
 opacity:0; transition:opacity .12s ease;
 z-index: 20;
}
.talV2Node:hover .talV2Tooltip{opacity:1;}
.talV2TName{font-weight:800; margin-bottom:4px;}
.talV2TDesc{font-size:12px; opacity:.85; line-height:1.25;}
.talV2TReq{margin-top:6px; font-size:11px; opacity:.65;}

.talSpecPickWrap{display:flex; flex-direction:column; gap:12px;}
.talSpecPickGrid{display:grid; grid-template-columns: repeat(3, 1fr); gap:12px;}
.talSpecCard{
 padding:12px 12px; border-radius:16px;
 background: rgba(0,0,0,.28);
 border:1px solid rgba(255,255,255,.12);
 box-shadow: 0 14px 30px rgba(0,0,0,.35);
 cursor:pointer;
 transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.talSpecCard:hover{
 transform: translateY(-2px);
 border-color: rgba(246,213,106,.35);
 box-shadow: 0 18px 38px rgba(0,0,0,.45), 0 0 18px rgba(246,213,106,.10);
}
.talSpecCard:active{ transform: translateY(0px); }
.talSpecName{font-weight:900; letter-spacing:.2px; margin-bottom:6px;}
.talSpecBonus{font-size:12px; opacity:.85; line-height:1.25;}
.talSpecTag{display:inline-flex; align-items:center; gap:6px; margin-top:10px; font-size:11px; opacity:.75;}
.talSpecDot{width:8px; height:8px; border-radius:999px; background: rgba(246,213,106,.85); box-shadow:0 0 10px rgba(246,213,106,.25);}

#talentPointsBar.talentPointsBar{
 text-align:center;
 font-weight:900;
 font-size:18px;
 margin:10px 0 14px;
 letter-spacing:.3px;
}
#talentPointsBar.tpGreen{
 color:#3cff3c;
 text-shadow:0 0 10px rgba(60,255,60,.55);
}
#talentPointsBar.tpRed{
 color:#ff4d4d;
 text-shadow:0 0 8px rgba(255,77,77,.35);
}

 #bagPanel .sellBtn,
 #bagPanel #btnUsePotion{ display:none !important; }
 #bagPanel .invActions{ display:none !important; }

 #bagPanel{
 display:grid;
 grid-template-columns: 440px 1fr;
 gap:18px;
 align-items:start;
 }

 #bagPanel .bagGrid{
 grid-column:1;
 grid-row:1;
 }

 #bagPanel .invStatsRow{
 grid-column:2;
 grid-row:1;
 margin-top:0;
 display:flex;
 flex-wrap:wrap;
 gap:10px;
 align-content:flex-start;
 align-items:flex-start;
 }

 #bagPanel .invStatsBox{
 flex:1;
 min-width:220px;
 max-width:100%;
 box-sizing:border-box;
 font-size:11px;
 padding:8px;
 overflow:hidden;
 }
 #bagPanel .invStatsBox *{
 box-sizing:border-box;
 max-width:100%;
 }

 #invStatsPanel .invStatsRow{
 flex-direction:column !important;
 gap:0 !important;
 }

 #invStatsPanel .invStatsRow .invStatsBox:first-child{
 border:none !important;
 background:transparent !important;
 padding:0 !important;
 margin:0 !important;
 }

 #invStatsPanel .invStatsBox{
 width:100% !important;
 box-sizing:border-box;
 }

#invStatsPanel .invStatsRow{
 flex-direction: column !important;
}

#invStatsPanel .invStatsBox{
 width: 100% !important;
}

#invStatsPanel .attrContainer,
#invStatsPanel .attrRow{
 position: relative !important;
 width: 100% !important;
 display: block !important;
 margin-top: 10px !important;
}

#invStatsPanel .attrContainer{
 background: transparent !important;
 border: none !important;
}

#invStatsPanel .invStatsBox .statKey{white-space:nowrap;}
#invStatsPanel .invStatsBox .row{display:flex; justify-content:space-between; gap:12px;}
#invStatsPanel .invStatsBox .row + .row{margin-top:6px;}
#invStatsPanel .invStatsBox .row.attrDivider{margin-top:10px; padding-top:8px; border-top:1px solid rgba(255,255,255,0.08);}

#invStatsPanel .invStatsBox,
#invStatsPanel,
.invSlot,
.equipSlot,
#equipPanel,
#inventoryPanel {
 position: relative;
 border: 2px solid rgba(212,175,55,0.7);
 border-radius: 12px;
 box-shadow:
 0 0 0 1px rgba(255,215,120,0.3) inset,
 0 0 18px rgba(212,175,55,0.15),
 0 6px 18px rgba(0,0,0,0.6);
 background-clip: padding-box;
}

#invStatsPanel .invStatsBox::before,
.invSlot::before,
.equipSlot::before {
 content: "";
 position: absolute;
 inset: 0;
 border-radius: 12px;
 pointer-events: none;
 background:
 radial-gradient(circle at top left, rgba(255,220,120,0.25), transparent 40%),
 radial-gradient(circle at bottom right, rgba(255,200,80,0.2), transparent 40%);
 mix-blend-mode: screen;
}

.invSlot:hover,
.equipSlot:hover {
 border-color: #ffd700;
 box-shadow:
 0 0 12px rgba(255,215,0,0.6),
 0 0 25px rgba(255,180,0,0.3),
 0 6px 18px rgba(0,0,0,0.6);
}

#invStatsPanel .invStatsBox,
#inventoryPanel {
 background: linear-gradient(145deg, rgba(40,20,10,0.65), rgba(15,10,8,0.8));
}

#equipPanel {
 border: 2px solid rgba(255,190,90,0.9);
 box-shadow:
 0 0 22px rgba(255,190,90,0.25),
 0 8px 25px rgba(0,0,0,0.7);
}

#equipPanel, #bagPanel, #invStatsPanel, #inventoryPanel,
.invSlot, .equipSlot, .slot,
#inventoryScreen .panel, #inventoryScreen .window, #inventoryScreen .box {
 box-sizing: border-box !important;
}

#equipPanel, #bagPanel, #invStatsPanel, #inventoryPanel{
 border: 0 !important;
 outline: 2px solid rgba(212,175,55,0.55) !important;
 outline-offset: -2px !important;
 border-radius: 14px !important;
 box-shadow:
 0 0 0 1px rgba(255,215,120,0.18) inset,
 0 10px 26px rgba(0,0,0,0.65) !important;
 background:
 linear-gradient(145deg, rgba(35,20,12,0.62), rgba(12,10,10,0.80)) !important;
}

#equipPanel::after, #bagPanel::after, #invStatsPanel::after, #inventoryPanel::after{
 content:"";
 position:absolute;
 inset:0;
 border-radius:14px;
 pointer-events:none;

 background:
 linear-gradient(90deg, rgba(255,255,255,0.06), rgba(0,0,0,0.10), rgba(255,255,255,0.05)),
 repeating-linear-gradient(135deg,
 rgba(255,255,255,0.04) 0px,
 rgba(255,255,255,0.00) 6px,
 rgba(0,0,0,0.05) 12px);
 mix-blend-mode: overlay;
 opacity: .55;
}

.invSlot, .equipSlot, .slot{
 border: 0 !important;
 outline: 2px solid rgba(190,160,85,0.55) !important;
 outline-offset: -2px !important;
 border-radius: 10px !important;
 box-shadow:
 0 0 0 1px rgba(255,230,160,0.12) inset,
 0 2px 10px rgba(0,0,0,0.55) !important;
 background:
 radial-gradient(circle at 30% 20%, rgba(255,215,140,0.08), transparent 55%),
 linear-gradient(145deg, rgba(28,18,12,0.55), rgba(10,10,10,0.78)) !important;

}

.invSlot, .slot{ position: relative; }
.equipSlot{ position: absolute !important; }

.invSlot::after, .equipSlot::after, .slot::after{
 content:"";
 position:absolute;
 inset:0;
 border-radius:10px;
 pointer-events:none;
 background:
 radial-gradient(circle at 0% 0%, rgba(255,215,120,0.22), transparent 38%),
 radial-gradient(circle at 100% 0%, rgba(255,215,120,0.16), transparent 38%),
 radial-gradient(circle at 0% 100%, rgba(255,215,120,0.14), transparent 38%),
 radial-gradient(circle at 100% 100%, rgba(255,215,120,0.20), transparent 38%);
 opacity:.55;
}

.invSlot:hover, .equipSlot:hover, .slot:hover{
 outline-color: rgba(255,220,120,0.95) !important;
 box-shadow:
 0 0 14px rgba(255,215,120,0.40),
 0 0 0 1px rgba(255,230,160,0.22) inset,
 0 2px 10px rgba(0,0,0,0.55) !important;
}

.slot.slot-common{ outline-color: rgba(82,214,106,0.75) !important; box-shadow: 0 0 18px rgba(82,214,106,0.22), 0 0 0 1px rgba(82,214,106,0.18) inset, 0 2px 10px rgba(0,0,0,0.55) !important; }
.slot.slot-rare{ outline-color: rgba(92,170,255,0.75) !important; box-shadow: 0 0 18px rgba(92,170,255,0.22), 0 0 0 1px rgba(92,170,255,0.18) inset, 0 2px 10px rgba(0,0,0,0.55) !important; }
.slot.slot-epic{ outline-color: rgba(184,107,255,0.75) !important; box-shadow: 0 0 18px rgba(184,107,255,0.22), 0 0 0 1px rgba(184,107,255,0.18) inset, 0 2px 10px rgba(0,0,0,0.55) !important; }
.slot.slot-legendary{ outline-color: rgba(255,204,67,0.85) !important; box-shadow: 0 0 22px rgba(255,204,67,0.26), 0 0 0 1px rgba(255,204,67,0.20) inset, 0 2px 10px rgba(0,0,0,0.55) !important; }

#invStatsPanel{ overflow:hidden !important; }

.fxSprite.bowDraw{ width:110px;
 height:auto;
 pointer-events:none;
 transform-origin: 25% 55%;
 filter: drop-shadow(0 10px 16px rgba(0,0,0,.55));
}
.fxSprite.bowDraw.drawAnim{
 animation: bowDrawAnim .16s ease-out forwards;
}
@keyframes bowDrawAnim{
 0% { transform: translate(-50%,-50%) rotate(-4deg) scaleX(var(--bow-flip-x, 1)) scale(.86); opacity:0; }
 100% { transform: translate(-50%,-50%) rotate(0deg) scaleX(var(--bow-flip-x, 1)) scale(1); opacity:1; }
}

.fxSprite.staffCast{
 width:120px;
 height:auto;
 pointer-events:none;
 transform-origin: 25% 60%;
 filter: drop-shadow(0 10px 16px rgba(0,0,0,.55));
}
.fxSprite.staffCast.castAnim{
 animation: staffCastAnim .18s ease-out forwards;
}
@keyframes staffCastAnim{
 0% { transform: translate(-50%,-50%) rotate(-14deg) scale(.86); opacity:0; }
 60% { transform: translate(-50%,-50%) rotate(-4deg) scale(1.02); opacity:1; }
 100% { transform: translate(-50%,-50%) rotate(-40deg) scale(1); opacity:1; }
}

#dfMenu{
 background:
 linear-gradient(180deg, rgba(66,42,20,.97) 0%, rgba(48,30,14,.98) 55%, rgba(31,19,10,.99) 100%) !important;
 border:1px solid rgba(200,162,74,.34) !important;
 box-shadow:
 inset 0 1px 0 rgba(255,225,145,.10),
 inset 0 0 0 1px rgba(77,48,22,.55),
 0 18px 34px rgba(0,0,0,.34) !important;
}
#dfMenu::before,
#dfMenu::after{
 background:none !important;
}
.dfSep{
 background:linear-gradient(90deg, transparent, rgba(208,171,92,.36), transparent) !important;
}
.dfBtn,
#dfMenu .lhBtn{
 background:linear-gradient(180deg, rgba(128,90,40,.96) 0%, rgba(88,57,25,.98) 52%, rgba(55,34,16,.99) 100%) !important;
 border:1px solid rgba(209,174,94,.58) !important;
 box-shadow:
 inset 0 1px 0 rgba(255,226,150,.15),
 inset 0 -8px 14px rgba(24,14,7,.24),
 0 8px 16px rgba(0,0,0,.22) !important;
 color:#f2deb0 !important;
}
.dfBtn:hover,
#dfMenu .lhBtn:hover{
 background:linear-gradient(180deg, rgba(145,103,46,.98) 0%, rgba(103,67,30,.99) 52%, rgba(64,40,18,1) 100%) !important;
 border-color: rgba(232,196,110,.74) !important;
 box-shadow:
 inset 0 1px 0 rgba(255,234,171,.23),
 0 10px 18px rgba(0,0,0,.28),
 0 0 0 1px rgba(221,184,96,.14) !important;
 filter:none !important;
}
.dfBtn.active,
#dfMenu .lhBtn.active{
 background:linear-gradient(180deg, rgba(161,117,57,.99) 0%, rgba(114,74,34,1) 50%, rgba(73,46,21,1) 100%) !important;
 border-color: rgba(240,205,118,.88) !important;
 box-shadow:
 inset 0 1px 0 rgba(255,240,188,.28),
 0 0 0 1px rgba(241,206,120,.24),
 0 10px 20px rgba(0,0,0,.30) !important;
}
.dfBtn:active,
#dfMenu .lhBtn:active{
 transform:translateY(1px) !important;
}
.dfIco,
.dfLbl,
#dfMenu .lhBtn .dfIco,
#dfMenu .lhBtn .dfLbl{
 color:#f0dfb0 !important;
 text-shadow:0 1px 0 rgba(34,20,10,.75), 0 0 10px rgba(0,0,0,.18) !important;
}
#hud{
 background:linear-gradient(180deg, rgba(59,37,18,.96) 0%, rgba(40,24,12,.97) 100%) !important;
 border-bottom:1px solid rgba(205,170,92,.30) !important;
 box-shadow: 0 10px 24px rgba(0,0,0,.22) !important;
}
#hud::before{
 background:linear-gradient(180deg, rgba(255,224,148,.09), rgba(255,224,148,0)) !important;
}
.hudProfile{
 background:linear-gradient(180deg, rgba(84,55,27,.90), rgba(46,29,14,.92)) !important;
 border-color: rgba(204,169,91,.26) !important;
}
#hud .namebox b,
#hud .namebox .lvl,
#hudGold,
#hudGems,
 text-shadow:0 1px 0 rgba(28,17,9,.75), 0 0 10px rgba(0,0,0,.16) !important;
}

body.charselect-active #cityClickBlocker{ display:none !important; }
#cityClickBlocker{
 left:300px !important;
}

#shopScreen .shopLayout{
 grid-template-columns: 340px minmax(0,1fr) 210px !important;
 gap: 10px !important;
 padding: 12px !important;
}
#shopScreen .pane{
 padding: 10px !important;
}
#shopScreen .bagGrid{
 grid-template-columns: repeat(5, 56px) !important;
 gap: 5px !important;
}
#shopScreen .slot{
 width:56px !important;
 height:56px !important;
 border-radius:10px !important;
}
#shopScreen .slot.upg::before{
 font-size:10px !important;
}
#shopScreen .equipWrap{
 height: clamp(300px, 34vh, 430px) !important;
 max-width: 100% !important;
 margin-top: 0 !important;
}
#shopScreen .equipSlot{
 width:62px !important;
 height:62px !important;
 border-radius:12px !important;
}
#shopScreen .invAvatar{
 width:210px !important;
 height:210px !important;
}
#shopScreen .detailBox{
 height: 142px !important;
 font-size: 11px !important;
}
#shopScreen .sellBtn{
 padding: 9px 10px !important;
}
#shopScreen .shopCenter{
 padding-bottom: 16px !important;
 justify-content: flex-end !important;
}
#shopScreen .offersGrid{
 width: 100% !important;
 max-width: 760px !important;
 grid-template-columns: repeat(2, minmax(250px, 1fr)) !important;
 gap: 10px !important;
}
#shopScreen .shopCard,
#shopScreen .kovarCard{
 padding: 12px !important;
 border-radius: 14px !important;
}
#shopScreen .shopTop{
 top: 10px !important;
}
#shopScreen .shopCountdown{
 top: 56px !important;
}
#shopScreen .shopCenter img,
#shopScreen .shopCard img{
 max-width: 78px !important;
 max-height: 78px !important;
}
#shopScreen .row, #shopScreen .shopCardRow{
 gap: 8px !important;
}
@media (max-width: 1400px){
 #shopScreen .shopLayout{
 grid-template-columns: 320px minmax(0,1fr) 190px !important;
 }
 #shopScreen .offersGrid{
 grid-template-columns: repeat(2, minmax(220px, 1fr)) !important;
 }
}

.slot.slot-plus5,
.equipSlot.slot-plus5{
 border-color: rgba(255, 214, 107, .98) !important;
 box-shadow:
 0 0 0 2px rgba(255,214,107,.52),
 0 0 18px rgba(255,214,107,.55),
 0 0 34px rgba(255,170,40,.42),
 inset 0 0 12px rgba(255,214,107,.22) !important;
 animation: forgePulseStrong 1.7s infinite ease-in-out !important;
}
.slot.slot-plus5 img,
.equipSlot.slot-plus5 img{
 filter: drop-shadow(0 0 10px rgba(255,214,107,.62)) drop-shadow(0 0 20px rgba(255,170,40,.38)) !important;
}
@keyframes forgePulseStrong{
 0%,100%{
 box-shadow:
 0 0 0 2px rgba(255,214,107,.36),
 0 0 12px rgba(255,214,107,.34),
 0 0 24px rgba(255,170,40,.20),
 inset 0 0 8px rgba(255,214,107,.16);
 filter: brightness(1);
 }
 50%{
 box-shadow:
 0 0 0 2px rgba(255,214,107,.66),
 0 0 24px rgba(255,214,107,.70),
 0 0 44px rgba(255,170,40,.45),
 inset 0 0 14px rgba(255,214,107,.28);
 filter: brightness(1.08);
 }
}

#globalLeftMenu{
 background: transparent !important;
 border: none !important;
 box-shadow: none !important;
 overflow: visible !important;
 backdrop-filter: none !important;
}
#globalLeftMenu::before,
#globalLeftMenu::after{
 display:none !important;
 content:none !important;
}
#globalLeftMenu .lhTitle,
#globalLeftMenu .lhSep{
 display:none !important;
}

.questPanel{
 position:fixed;
 left:calc(50% - (var(--stageW, 100vw) / 2) + var(--menuStageW, 340px));
 top:var(--stagePad, 4px);
 transform:none;
 width:var(--cityStageW, calc(100vw - 340px));
 height:var(--cityStageH, calc(100vh - 8px));
 z-index:250000;
 display:none;
 border-radius:4px;
 overflow:hidden;
 color:#d7c9b2;
 border:1px solid #75572f;
 background:#090d0c;
 box-shadow:0 0 0 3px #17120c, 0 0 0 4px rgba(163,119,55,.48), 0 24px 80px rgba(0,0,0,.86);
 font-family:Georgia, "Times New Roman", serif;
}
.questPanel.show{ display:block; }
.questPanelWrap{
 position:absolute;
 inset:0;
 padding:0;
 overflow:hidden;
}
.questPanelLoading{
 height:100%;
 display:grid;
 place-items:center;
 color:#ae9368;
 background:#090d0c;
 font-size:18px;
}
.questVault{
 position:relative;
 height:100%;
 min-height:0;
 display:flex;
 flex-direction:column;
 isolation:isolate;
 background:
  radial-gradient(circle at 54% 0, rgba(151,104,44,.08), transparent 40%),
  linear-gradient(180deg, rgba(12,16,15,.98), rgba(5,8,8,.99));
}
.questVault::before,
.questVault::after{
 content:"";
 position:absolute;
 z-index:10;
 pointer-events:none;
 inset:7px;
 border:1px solid rgba(149,108,57,.3);
}
.questVault::after{
 inset:2px;
 border-color:rgba(33,23,13,.95);
 box-shadow:inset 0 0 0 1px rgba(210,157,74,.11);
}
.questVaultHeader{
 position:relative;
 z-index:1;
 flex:0 0 78px;
 display:flex;
 align-items:center;
 justify-content:center;
 gap:28px;
 padding:0 72px;
 border-bottom:1px solid #664820;
 background:linear-gradient(180deg, rgba(25,28,25,.98), rgba(8,12,11,.99));
 box-shadow:0 7px 20px rgba(0,0,0,.35), inset 0 -1px rgba(224,167,76,.12);
}
.questVaultHeader h1{
 margin:0;
 color:#e9d1a4;
 font-size:clamp(31px,3vw,46px);
 font-weight:500;
 line-height:1;
 letter-spacing:.07em;
 text-transform:uppercase;
 text-shadow:0 2px 1px #000, 0 0 16px rgba(229,167,71,.18);
}
.questVaultHeader > span{
 color:#98703a;
 font-size:28px;
 filter:drop-shadow(0 2px 1px #000);
}
.questVaultHeader > span:last-child{ transform:scaleX(-1); }
.questVaultTabs{
 position:relative;
 z-index:2;
 flex:0 0 68px;
 display:flex;
 gap:8px;
 padding:10px 22px;
 border-bottom:1px solid rgba(125,91,45,.52);
 background:linear-gradient(180deg, rgba(15,19,18,.99), rgba(8,12,11,.99));
 overflow-x:auto;
 scrollbar-width:none;
}
.questVaultTabs::-webkit-scrollbar{ display:none; }
.questVaultTab{
 position:relative;
 flex:1 1 0;
 min-width:150px;
 display:grid;
 grid-template-columns:34px 1fr 26px;
 align-items:center;
 gap:9px;
 padding:8px 12px;
 border:1px solid #564329;
 border-radius:3px;
 color:#bba582;
 background:linear-gradient(180deg, rgba(28,31,28,.94), rgba(9,13,12,.98));
 box-shadow:inset 0 0 0 2px rgba(0,0,0,.36), 0 3px 9px rgba(0,0,0,.32);
 font-family:Georgia,"Times New Roman",serif;
 text-align:left;
 cursor:pointer;
 transition:filter .16s ease,color .16s ease,border-color .16s ease;
}
.questVaultTab:hover{ color:#ead0a0; filter:brightness(1.1); }
.questVaultTab.isActive{
 color:#f0d9ad;
 border-color:#b17d34;
 background:linear-gradient(110deg, rgba(116,72,26,.88), rgba(42,31,20,.96));
 box-shadow:inset 0 0 0 2px rgba(0,0,0,.4), inset 0 -2px #dda64c, 0 0 17px rgba(213,142,44,.14);
}
.questVaultTab.isActive::after{
 content:"◆";
 position:absolute;
 left:50%;
 bottom:-9px;
 transform:translateX(-50%) rotate(45deg);
 color:#c8923e;
 font-size:10px;
}
.questVaultTabIcon{
 width:30px;
 height:30px;
 display:block;
 overflow:hidden;
 border:1px solid rgba(142,103,54,.55);
 background:#0b0e0d;
 text-align:center;
}
.questVaultTabIcon img{ width:100%;height:100%;display:block;object-fit:cover; }
.questVaultTabCopy{ min-width:0; display:flex; flex-direction:column; }
.questVaultTabCopy strong{ font-size:15px; font-weight:500; line-height:1.1; text-transform:uppercase; }
.questVaultTabCopy small{ margin-top:3px; color:#91816b; font-size:11px; }
.questVaultTabCount{
 width:24px;
 height:24px;
 display:grid;
 place-items:center;
 border:1px solid #806039;
 border-radius:50%;
 color:#dab779;
 background:#161713;
 font-size:12px;
}
.questVaultWorkspace{
 flex:1;
 min-height:0;
 display:grid;
 grid-template-columns:minmax(430px,48%) minmax(0,52%);
}
.questJournal{
 min-width:0;
 min-height:0;
 display:flex;
 flex-direction:column;
 border-right:1px solid rgba(137,98,49,.58);
 background:linear-gradient(90deg, rgba(13,17,16,.98), rgba(17,21,19,.95));
 box-shadow:8px 0 25px rgba(0,0,0,.24);
}
.questJournalSummary{
 flex:0 0 42px;
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:14px;
 padding:0 22px;
 border-bottom:1px solid rgba(113,87,50,.3);
 color:#8f806c;
 font:12px Arial,sans-serif;
}
.questJournalSummary b{ color:#bf9451; font-weight:500; }
.questJournalScroll{
 flex:1;
 min-height:0;
 overflow:auto;
 padding:12px 16px 18px 20px;
 scrollbar-color:#705737 #101311;
 scrollbar-width:thin;
}
.questJournalScroll::-webkit-scrollbar{ width:9px; }
.questJournalScroll::-webkit-scrollbar-track{ background:#101311; }
.questJournalScroll::-webkit-scrollbar-thumb{ border:2px solid #101311; border-radius:7px; background:#705737; }
.questJournalGroup{ margin-bottom:13px; }
.questJournalGroup h2{
 display:flex;
 align-items:center;
 gap:9px;
 margin:0 0 8px;
 color:#a98b5e;
 font-size:15px;
 font-weight:500;
 letter-spacing:.05em;
 text-transform:uppercase;
}
.questJournalGroup h2 span{ color:#a07840; font-size:15px; }
.questJournalGroup h2 i{ flex:1; height:1px; background:linear-gradient(90deg,rgba(134,96,48,.55),transparent); }
.questJournalEntry{
 position:relative;
 width:100%;
 min-height:80px;
 display:grid;
 grid-template-columns:62px minmax(0,1fr) 92px;
 align-items:center;
 gap:12px;
 margin-bottom:7px;
 padding:8px 14px 8px 9px;
 border:1px solid rgba(102,86,61,.52);
 border-radius:3px;
 color:#bdb3a4;
 background:linear-gradient(100deg,rgba(29,33,30,.92),rgba(10,14,13,.94));
 box-shadow:inset 0 0 15px rgba(0,0,0,.25),0 2px 5px rgba(0,0,0,.28);
 font-family:Georgia,"Times New Roman",serif;
 text-align:left;
 cursor:pointer;
 transition:border-color .14s ease,filter .14s ease,background .14s ease;
}
.questJournalEntry:hover{ filter:brightness(1.1); border-color:#8d6a3d; }
.questJournalEntry.isSelected{
 border-color:#c18a38;
 background:linear-gradient(100deg,rgba(103,65,26,.7),rgba(35,28,20,.93) 72%,rgba(13,16,14,.96));
 box-shadow:inset 3px 0 #e5ae50,inset 0 0 22px rgba(216,148,49,.1),0 0 15px rgba(209,138,39,.12);
}
.questJournalEntry.isClaimed{ filter:saturate(.55); }
.questJournalIcon{
 width:58px;
 height:58px;
 overflow:hidden;
 border:1px solid #795b35;
 background:#0c0f0e;
 box-shadow:0 0 0 2px #12100c,0 4px 9px rgba(0,0,0,.42);
}
.questJournalIcon img{ width:100%;height:100%;display:block;object-fit:cover; }
.questJournalCopy{ min-width:0; display:flex; flex-direction:column; }
.questJournalCopy strong{
 overflow:hidden;
 color:#d4c5ac;
 font-size:18px;
 font-weight:500;
 line-height:1.12;
 text-overflow:ellipsis;
 white-space:nowrap;
}
.questJournalCopy small{
 margin-top:6px;
 overflow:hidden;
 color:#918b83;
 font:12px/1.2 Arial,sans-serif;
 text-overflow:ellipsis;
 white-space:nowrap;
}
.questJournalProgress{ display:flex;flex-direction:column;gap:7px; }
.questJournalProgress b{ color:#9bb9d3;font:12px Arial,sans-serif;text-align:center; }
.questMiniTrack,
.questObjectiveTrack{
 height:7px;
 overflow:hidden;
 border:1px solid #5f492d;
 border-radius:7px;
 background:#090b0a;
 box-shadow:inset 0 2px 4px rgba(0,0,0,.8);
}
.questMiniTrack i,
.questObjectiveTrack i{
 display:block;
 width:0;
 height:100%;
 border-radius:5px;
 background:linear-gradient(90deg,#8c611f,#d39a3e 68%,#f1c374);
 box-shadow:inset 0 1px rgba(255,238,178,.34),0 0 8px rgba(221,154,55,.2);
 transition:width .2s ease;
}
.questJournalState{
 position:absolute;
 top:-6px;
 right:-5px;
 width:22px;
 height:22px;
 display:grid;
 place-items:center;
 border-radius:50%;
 font:bold 14px Arial,sans-serif;
}
.questJournalState.isReady{ color:#251400;border:1px solid #ffc45d;background:#dc941f; }
.questJournalState.isClaimed{ color:#102000;border:1px solid #8fc755;background:#568c20; }
.questJournalEmpty{
 min-height:250px;
 display:flex;
 flex-direction:column;
 align-items:center;
 justify-content:center;
 color:#887d6c;
 text-align:center;
}
.questJournalEmpty img{ width:100px;height:100px;object-fit:cover;filter:grayscale(.5) brightness(.7); }
.questJournalEmpty strong{ margin-top:12px;color:#b3a184;font-size:19px;font-weight:500; }
.questJournalEmpty span{ margin-top:5px;font:13px Arial,sans-serif; }
.questDetailPane{ min-width:0;min-height:0;background:#070a09; }
.questDetail{
 height:100%;
 min-height:0;
 display:flex;
 flex-direction:column;
 background:linear-gradient(180deg,rgba(7,10,9,.35),rgba(5,8,7,.98));
}
.questDetailHero{
 position:relative;
 flex:0 0 235px;
 display:flex;
 align-items:flex-end;
 gap:20px;
 padding:30px 38px 28px;
 overflow:hidden;
 border-bottom:1px solid rgba(142,101,51,.52);
 background-position:center;
 background-size:cover;
}
.questDetail[data-quest-scene="arena"] .questDetailHero{
 background-image:linear-gradient(180deg,rgba(5,7,7,.2),rgba(5,8,7,.94)),url("../img/backgrounds/arena.png");
}
.questDetail[data-quest-scene="temple"] .questDetailHero,
.questDetail[data-quest-scene="wilderness"] .questDetailHero{
 background-image:linear-gradient(180deg,rgba(5,7,7,.2),rgba(5,8,7,.94)),url("../img/pve_panels/temple_panel_v1.png");
}
.questDetail[data-quest-scene="city"] .questDetailHero{
 background-image:linear-gradient(180deg,rgba(5,7,7,.25),rgba(5,8,7,.94)),url("../img/backgrounds/city.png");
}
.questDetail[data-quest-scene="forge"] .questDetailHero{
 background-image:linear-gradient(180deg,rgba(5,7,7,.25),rgba(5,8,7,.94)),url("../img/backgrounds/kovar.png");
}
.questDetail[data-quest-scene="dungeon"] .questDetailHero,
.questDetail[data-quest-scene="boss"] .questDetailHero{
 background-image:linear-gradient(180deg,rgba(5,7,7,.2),rgba(5,8,7,.94)),url("../img/pve_panels/dungeon_panel_v1.png");
}
.questDetailShade{
 position:absolute;
 inset:0;
 background:linear-gradient(90deg,rgba(3,5,5,.72),transparent 75%),radial-gradient(circle at 72% 5%,transparent,rgba(2,4,4,.28));
 pointer-events:none;
}
.questDetailEmblem{
 position:relative;
 z-index:1;
 flex:0 0 128px;
 width:128px;
 height:128px;
 object-fit:cover;
 border:1px solid #a97937;
 box-shadow:0 0 0 4px rgba(10,10,8,.9),0 10px 24px rgba(0,0,0,.62);
}
.questDetailHeading{ position:relative;z-index:1;min-width:0;padding-bottom:9px; }
.questDetailHeading > span{ color:#c4964f;font-size:14px;letter-spacing:.05em;text-transform:uppercase; }
.questDetailHeading h2{
 margin:8px 0 7px;
 color:#ebd5ad;
 font-size:clamp(24px,2.2vw,34px);
 font-weight:500;
 line-height:1.08;
 text-transform:uppercase;
 text-shadow:0 2px 2px #000;
}
.questDetailHeading small{ color:#b9a278;font-size:14px; }
.questDetailBody{
 flex:1;
 min-height:0;
 overflow:auto;
 padding:22px 38px 24px;
 scrollbar-color:#705737 #101311;
 scrollbar-width:thin;
}
.questDetailDescription{ margin:0;color:#b6ada0;font:16px/1.5 Arial,sans-serif; }
.questOrnamentTitle{
 display:flex;
 align-items:center;
 gap:14px;
 margin:24px 0 14px;
 color:#c39a5c;
 font-size:16px;
 letter-spacing:.06em;
 text-transform:uppercase;
}
.questOrnamentTitle i{ flex:1;height:1px;background:linear-gradient(90deg,transparent,#75542c,transparent); }
.questObjective{
 min-height:64px;
 display:grid;
 grid-template-columns:40px minmax(0,1fr) 65px;
 align-items:center;
 gap:14px;
 padding:10px 14px;
 border:1px solid rgba(103,87,61,.58);
 border-radius:3px;
 background:linear-gradient(100deg,rgba(24,28,26,.9),rgba(9,13,12,.94));
}
.questObjectiveState{
 width:34px;
 height:34px;
 display:grid;
 place-items:center;
 border:2px solid #6c593c;
 border-radius:50%;
 color:#172100;
 font:bold 23px Arial,sans-serif;
 background:#0c0f0e;
}
.questObjective.isComplete .questObjectiveState{ border-color:#75a92d;background:#4f8316;color:#d9ff9b;box-shadow:0 0 10px rgba(110,174,36,.25); }
.questObjective > div{ min-width:0;display:flex;flex-direction:column;gap:10px; }
.questObjective > div strong{ color:#c4b9a8;font:14px/1.25 Arial,sans-serif; }
.questObjective > b{ color:#74b7e5;font:14px Arial,sans-serif;text-align:center; }
.questRewardGrid{ display:flex;justify-content:center;gap:16px;flex-wrap:wrap; }
.questRewardCard{
 width:112px;
 min-height:126px;
 display:flex;
 flex-direction:column;
 align-items:center;
 justify-content:center;
 padding:8px;
 border:1px solid #6f5331;
 background:linear-gradient(180deg,rgba(31,33,29,.95),rgba(9,12,11,.98));
 box-shadow:inset 0 0 0 3px rgba(0,0,0,.42),0 5px 14px rgba(0,0,0,.4);
}
.questRewardCard img{ width:62px;height:62px;object-fit:contain;filter:drop-shadow(0 4px 5px rgba(0,0,0,.55)); }
.questRewardCard strong{ margin-top:5px;color:#e0c89f;font-size:17px;font-weight:500; }
.questRewardCard span{ margin-top:3px;color:#887d6c;font:11px Arial,sans-serif;text-transform:uppercase; }
.questDetailFooter{ display:flex;flex-direction:column;align-items:center;margin-top:24px; }
.questDetailAction{
 min-width:330px;
 min-height:54px;
 padding:11px 28px;
 border:1px solid #735d3c;
 border-radius:3px;
 color:#a89b87;
 background:linear-gradient(180deg,#202a30,#11181b);
 box-shadow:inset 0 0 0 3px rgba(0,0,0,.4),0 7px 16px rgba(0,0,0,.42);
 font:500 17px Georgia,"Times New Roman",serif;
 letter-spacing:.04em;
 text-transform:uppercase;
}
.questDetailAction.isReady{
 color:#f0d9ad;
 border-color:#a47532;
 background:linear-gradient(180deg,#394c59,#17242a);
 cursor:pointer;
}
.questDetailAction.isReady:hover{ filter:brightness(1.13); }
.questDetailAction.isDone{ color:#9caf7e;border-color:#596746;background:linear-gradient(180deg,#243023,#111812); }
.questDetailAction[disabled]{ cursor:not-allowed; }
.questResetNote{ margin-top:14px;color:#827a6f;font:12px Arial,sans-serif; }
.questResetNote span{ margin-right:7px;color:#b78b49; }
.questDetailEmpty{
 height:100%;
 display:flex;
 flex-direction:column;
 align-items:center;
 justify-content:center;
 text-align:center;
 background:linear-gradient(rgba(5,8,7,.78),rgba(5,8,7,.97)),url("../img/pve_panels/dungeon_panel_v1.png") center/cover;
}
.questDetailEmpty img{ width:140px;height:140px;object-fit:cover;filter:grayscale(.4) brightness(.75); }
.questDetailEmpty h2{ margin:18px 0 5px;color:#c6b18c;font-size:24px;font-weight:500; }
.questDetailEmpty p{ margin:0;color:#827b70;font:13px Arial,sans-serif; }
@media(max-height:780px) and (min-width:821px){
 .questVaultHeader{ flex-basis:60px; }
 .questVaultHeader h1{ font-size:34px; }
 .questVaultTabs{ flex-basis:58px;padding-block:7px; }
 .questVaultTab{ padding-block:5px; }
 .questDetailHero{ flex-basis:168px;padding:18px 30px; }
 .questDetailEmblem{ width:96px;height:96px;flex-basis:96px; }
 .questDetailHeading h2{ margin-block:5px;font-size:27px; }
 .questDetailBody{ padding:14px 30px 17px; }
 .questDetailDescription{ font-size:14px; }
 .questOrnamentTitle{ margin:15px 0 9px; }
 .questRewardCard{ width:92px;min-height:94px; }
 .questRewardCard img{ width:45px;height:45px; }
 .questDetailFooter{ margin-top:16px; }
 .questDetailAction{ min-height:46px; }
}
@media(max-width:1100px){
 .questVaultWorkspace{ grid-template-columns:minmax(360px,44%) minmax(0,56%); }
 .questVaultTab{ min-width:128px;grid-template-columns:26px 1fr 22px;padding-inline:8px; }
 .questVaultTabIcon{ width:25px;height:25px; }
 .questJournalEntry{ grid-template-columns:54px minmax(0,1fr) 74px;padding-right:9px; }
 .questJournalIcon{ width:50px;height:50px; }
 .questJournalCopy strong{ font-size:16px; }
 .questDetailHero{ flex-basis:205px;padding:24px 26px 23px; }
 .questDetailEmblem{ width:105px;height:105px;flex-basis:105px; }
 .questDetailBody{ padding:18px 26px 22px; }
 .questRewardCard{ width:96px;min-height:112px; }
}
@media(max-width:820px){
 .questVaultHeader{ flex-basis:62px; }
 .questVaultHeader h1{ font-size:28px; }
 .questVaultTabs{ flex-basis:60px;padding:8px; }
 .questVaultTab{ min-width:118px; }
 .questVaultWorkspace{ grid-template-columns:1fr;grid-template-rows:minmax(225px,42%) minmax(0,58%); }
 .questJournal{ border-right:0;border-bottom:1px solid rgba(137,98,49,.58); }
 .questJournalSummary{ display:none; }
 .questJournalScroll{ padding:9px 10px 12px; }
 .questJournalGroup h2{ font-size:13px; }
 .questJournalEntry{ min-height:67px;grid-template-columns:49px minmax(0,1fr) 72px;margin-bottom:5px; }
 .questJournalIcon{ width:45px;height:45px; }
 .questJournalCopy small{ margin-top:3px; }
 .questDetailHero{ flex-basis:130px;padding:14px 22px; }
 .questDetailEmblem{ width:82px;height:82px;flex-basis:82px; }
 .questDetailHeading h2{ margin-block:4px;font-size:22px; }
 .questDetailBody{ padding:14px 22px 18px; }
 .questDetailDescription{ font-size:13px; }
 .questOrnamentTitle{ margin:15px 0 9px;font-size:13px; }
 .questRewardCard{ min-height:94px;width:84px; }
 .questRewardCard img{ width:45px;height:45px; }
 .questDetailAction{ min-width:min(330px,100%);min-height:45px;font-size:14px; }
}
@media(max-width:540px){
 .questVaultHeader > span{ display:none; }
 .questVaultTab{ min-width:91px;grid-template-columns:22px 1fr; }
 .questVaultTabCount{ display:none; }
 .questVaultTabCopy strong{ font-size:12px; }
 .questVaultTabCopy small{ font-size:9px; }
 .questJournalEntry{ grid-template-columns:47px minmax(0,1fr) 52px;gap:7px; }
 .questJournalCopy small{ display:none; }
 .questJournalProgress{ gap:4px; }
 .questDetailHero{ gap:12px;padding-inline:14px; }
 .questDetailEmblem{ width:68px;height:68px;flex-basis:68px; }
 .questDetailHeading > span,.questDetailHeading small{ font-size:11px; }
 .questDetailHeading h2{ font-size:18px; }
 .questDetailBody{ padding-inline:14px; }
 .questObjective{ grid-template-columns:34px minmax(0,1fr) 50px;gap:8px;padding-inline:8px; }
 .questObjectiveState{ width:29px;height:29px; }
 .questRewardGrid{ gap:7px; }
 .questRewardCard{ width:72px; }
}

.cavePanel{
 position:fixed;
 left:calc(50% + 128px);
 top:50%;
 transform:translate(-50%,-50%);
 width:min(900px, calc(100vw - 320px));
 height:min(640px, calc(100vh - 120px));
 z-index:250000;
 display:none;
 border-radius:24px;
 overflow:hidden;
 background:
 radial-gradient(circle at 20% 10%, rgba(120,170,255,.08), transparent 55%),
 radial-gradient(circle at 80% 20%, rgba(255,205,120,.08), transparent 60%),
 linear-gradient(180deg, rgba(14,16,22,.97), rgba(8,9,13,.98));
 border:1px solid rgba(255,255,255,.12);
 box-shadow:0 24px 70px rgba(0,0,0,.78);
}
.cavePanel.show{ display:block; }
.cavePanelWrap{ position:absolute; inset:0; padding:18px; display:flex; flex-direction:column; gap:14px; }
.caveHeadBar{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.caveHeadTitle{
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:30px; font-weight:1000; color:#dfe9ff;
 text-shadow:0 0 12px rgba(120,180,255,.18);
}
.caveCloseBtn{
 width:46px; height:42px; border-radius:14px;
 border:1px solid rgba(255,255,255,.12);
 background:rgba(0,0,0,.35);
 color:#fff; font-weight:1000; cursor:pointer;
}
.caveBody{
 flex:1;
 display:grid;
 grid-template-columns: minmax(280px, 360px) 1fr;
 gap:16px;
 min-height:0;
}
.caveInfoCard, .caveRulesCard{
 border:1px solid rgba(255,255,255,.10);
 border-radius:20px;
 background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(0,0,0,.22));
 box-shadow:0 10px 28px rgba(0,0,0,.35);
}
.caveInfoCard{ padding:16px; display:flex; flex-direction:column; gap:12px; }
.caveRulesCard{ padding:16px; overflow:auto; }
.caveLead{
 color:#cfd9ee;
 font-size:13px;
 line-height:1.45;
}
.caveStatRow{
 display:flex; align-items:center; justify-content:space-between; gap:10px;
 padding:10px 12px;
 border-radius:14px;
 background:rgba(255,255,255,.04);
 border:1px solid rgba(255,255,255,.08);
}
.caveStatLabel{ color:#d0d7e8; font-weight:800; }
.caveStatValue{ color:#fff1c9; font-weight:1000; }
.caveRewardPills{
 display:flex; flex-wrap:wrap; gap:8px;
}
.caveRewardPill{
 padding:7px 10px; border-radius:999px;
 background:rgba(0,0,0,.28);
 border:1px solid rgba(255,255,255,.10);
 font-size:12px; font-weight:900; color:#f1f1f1;
}
.caveFightBtn{
 margin-top:auto;
 padding:14px 16px;
 border-radius:16px;
 border:1px solid rgba(255,255,255,.18);
 background:linear-gradient(180deg, rgba(120,220,255,.95), rgba(45,130,255,.85));
 color:#071320;
 font-size:15px;
 font-weight:1000;
 cursor:pointer;
 box-shadow:0 12px 22px rgba(0,0,0,.35), 0 0 18px rgba(80,170,255,.20);
}
.caveFightBtn[disabled]{ opacity:.45; cursor:not-allowed; }
.caveSectionTitle{
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:20px; font-weight:1000; color:#f3e4c3; margin-bottom:8px;
}
.caveList{ display:flex; flex-direction:column; gap:10px; }
.caveListItem{
 padding:12px 14px;
 border-radius:14px;
 border:1px solid rgba(255,255,255,.08);
 background:rgba(255,255,255,.04);
 color:#d4d9e8;
 font-size:13px;
 line-height:1.4;
}
.caveSub{ color:#96a9d6; font-size:12px; margin-top:4px; }
.caveCooldownTxt{
 font-size:12px; color:#a9c7ff; font-weight:800;
 min-height:18px;
}
@media (max-width: 1200px){
 .caveBody{ grid-template-columns:1fr; }
}

#arenaComingSoon{
 position:fixed;
 left:50%;
 top:50%;
 transform:translate(-50%,-50%);
 width:min(920px, calc(100vw - 320px));
 height:min(620px, calc(100vh - 120px));
 display:none;
 z-index:260000;
 border-radius:24px;
 overflow:hidden;
 background:
 radial-gradient(circle at 20% 10%, rgba(255,205,120,.10), transparent 60%),
 radial-gradient(circle at 80% 20%, rgba(120,180,255,.08), transparent 55%),
 linear-gradient(180deg, rgba(24,16,10,.97), rgba(10,8,6,.98));
 border:1px solid rgba(255,255,255,.12);
 box-shadow:0 24px 70px rgba(0,0,0,.78);
}
#arenaComingSoon.show{ display:block; }
.acsWrap{
 position:absolute; inset:0;
 display:flex; flex-direction:column; align-items:center; justify-content:center;
 text-align:center;
 padding:28px;
 gap:18px;
}
.acsTitle{
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:44px;
 font-weight:1000;
 color:#f6ddaf;
 letter-spacing:.5px;
 text-shadow:0 0 14px rgba(255,210,120,.22);
}
.acsSub{
 max-width:620px;
 color:#d8c7a3;
 font-size:16px;
 line-height:1.55;
}
.acsBadgeRow{
 display:flex;
 flex-wrap:wrap;
 gap:10px;
 justify-content:center;
}
.acsBadge{
 padding:9px 12px;
 border-radius:999px;
 background:rgba(0,0,0,.28);
 border:1px solid rgba(255,255,255,.10);
 color:#f3e6c9;
 font-weight:900;
 font-size:12px;
}
.acsBtnRow{
 display:flex;
 gap:12px;
 flex-wrap:wrap;
 justify-content:center;
}
.acsBtn{
 min-width:190px;
 padding:14px 18px;
 border-radius:16px;
 border:1px solid rgba(255,255,255,.18);
 background:linear-gradient(180deg, rgba(255,235,120,.95), rgba(255,170,0,.85));
 color:#2b1a00;
 font-weight:1000;
 cursor:pointer;
 box-shadow:0 12px 22px rgba(0,0,0,.35), 0 0 18px rgba(255,200,0,.20);
}
.acsBtn.secondary{
 background:linear-gradient(180deg, rgba(120,180,255,.92), rgba(55,120,220,.85));
 color:#081527;
}

#arenaComingSoon{
 background:
 linear-gradient(rgba(0,0,0,.54), rgba(0,0,0,.66)),
 url("img/dungeon.png") center/cover no-repeat !important;
}
#arenaComingSoon::before{
 content:"";
 position:absolute; inset:0;
 pointer-events:none;
 background:
 radial-gradient(circle at 50% 18%, rgba(255,215,120,.12), transparent 45%),
 linear-gradient(180deg, rgba(35,22,10,.10), rgba(0,0,0,.18));
}
#btnArenaSoonBackCity{
 display:inline-flex !important;
 align-items:center;
 justify-content:center;
}

#colosseumScreen .colMenu{
 padding:28px 24px;
}
#colosseumScreen .colHead{
 max-width:980px;
}
#colosseumScreen .colTitle{
 font-size:34px;
}
#colosseumScreen .pvpOnlyWrap{
 margin:18px auto 0;
 width:100%;
 max-width:980px;
 display:grid;
 grid-template-columns:minmax(300px, 420px) 1fr;
 gap:16px;
}
#colosseumScreen .pvpOnlyCard,
#colosseumScreen .pvpInfoCard{
 background:rgba(0,0,0,.55);
 border:1px solid rgba(255,255,255,.10);
 border-radius:20px;
 box-shadow:0 16px 40px rgba(0,0,0,.55);
 backdrop-filter: blur(8px);
}
#colosseumScreen .pvpOnlyCard{
 padding:18px;
 display:flex;
 flex-direction:column;
 gap:14px;
}
#colosseumScreen .pvpInfoCard{
 padding:18px;
}
#colosseumScreen .pvpBigTitle{
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:26px;
 font-weight:1000;
 color:#f6ddaf;
 text-shadow:0 0 12px rgba(255,210,120,.16);
}
#colosseumScreen .pvpLead{
 color:#d9d2c3;
 font-size:14px;
 line-height:1.55;
}
#colosseumScreen .pvpBadgeRow{
 display:flex;
 flex-wrap:wrap;
 gap:8px;
}
#colosseumScreen .pvpBadge{
 padding:8px 10px;
 border-radius:999px;
 background:rgba(255,255,255,.06);
 border:1px solid rgba(255,255,255,.10);
 color:#f3e6c9;
 font-size:12px;
 font-weight:900;
}
#colosseumScreen .pvpStartBtn{
 margin-top:auto;
 padding:14px 16px;
 border-radius:16px;
 border:1px solid rgba(255,255,255,.18);
 background:linear-gradient(180deg, rgba(255,235,120,.95), rgba(255,170,0,.85));
 color:#2b1a00;
 font-size:15px;
 font-weight:1000;
 cursor:pointer;
 box-shadow:0 12px 22px rgba(0,0,0,.35), 0 0 18px rgba(255,200,0,.20);
}
#colosseumScreen .pvpInfoTitle{
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:20px;
 font-weight:1000;
 color:#f3e4c3;
 margin-bottom:10px;
}
#colosseumScreen .pvpInfoList{
 display:flex;
 flex-direction:column;
 gap:10px;
}
#colosseumScreen .pvpInfoItem{
 padding:12px 14px;
 border-radius:14px;
 background:rgba(255,255,255,.04);
 border:1px solid rgba(255,255,255,.08);
 color:#d4d9e8;
 font-size:13px;
 line-height:1.45;
}
#colosseumScreen .pvpInfoSub{
 color:#9db3e1;
 font-size:12px;
 margin-top:4px;
}
@media (max-width: 1100px){
 #colosseumScreen .pvpOnlyWrap{
 grid-template-columns:1fr;
 }
}

.templePanel{
 position:fixed;
 left:calc(50% + 128px);
 top:50%;
 transform:translate(-50%,-50%);
 width:min(920px, calc(100vw - 320px));
 height:min(660px, calc(100vh - 120px));
 z-index:250000;
 display:none;
 border-radius:24px;
 overflow:hidden;
 background:
 radial-gradient(circle at 20% 10%, rgba(255,205,120,.12), transparent 60%),
 radial-gradient(circle at 80% 20%, rgba(140,110,255,.08), transparent 55%),
 linear-gradient(180deg, rgba(24,16,10,.97), rgba(10,8,6,.98));
 border:1px solid rgba(255,255,255,.12);
 box-shadow:0 24px 70px rgba(0,0,0,.78);
}
.templePanel.show{ display:block; }
.templeWrap{ position:absolute; inset:0; padding:18px; display:flex; flex-direction:column; gap:14px; }
.templeHead{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.templeTitle{ font-family:"Cinzel","Trajan Pro","Georgia",serif; font-size:30px; font-weight:1000; color:#f6ddaf; }
.templeCloseBtn{
 width:46px; height:42px; border-radius:14px; border:1px solid rgba(255,255,255,.12);
 background:rgba(0,0,0,.35); color:#fff; font-weight:1000; cursor:pointer;
}
.templeBody{ flex:1; display:grid; grid-template-columns:minmax(300px, 390px) 1fr; gap:16px; min-height:0; }
.templeInfoCard,.templeRuleCard{
 border:1px solid rgba(255,255,255,.10);
 border-radius:20px;
 background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(0,0,0,.22));
 box-shadow:0 10px 28px rgba(0,0,0,.35);
}
.templeInfoCard{ padding:16px; display:flex; flex-direction:column; gap:12px; }
.templeRuleCard{ padding:16px; overflow:auto; }
.templeLead{ color:#d9d2c3; font-size:14px; line-height:1.55; }
.templeStat{
 display:flex; align-items:center; justify-content:space-between; gap:12px;
 padding:10px 12px; border-radius:14px;
 background:rgba(255,255,255,.04);
 border:1px solid rgba(255,255,255,.08);
}
.templeStatLabel{ color:#d0d7e8; font-weight:800; }
.templeStatVal{ color:#fff1c9; font-weight:1000; }
.templeStartBtn{
 margin-top:auto;
 padding:14px 16px; border-radius:16px; border:1px solid rgba(255,255,255,.18);
 background:linear-gradient(180deg, rgba(255,235,120,.95), rgba(255,170,0,.85));
 color:#2b1a00; font-size:15px; font-weight:1000; cursor:pointer;
 box-shadow:0 12px 22px rgba(0,0,0,.35), 0 0 18px rgba(255,200,0,.20);
}
.templeStartBtn[disabled]{ opacity:.45; cursor:not-allowed; }
.templeRuleTitle{ font-family:"Cinzel","Trajan Pro","Georgia",serif; font-size:20px; font-weight:1000; color:#f3e4c3; margin-bottom:10px; }
.templeList{ display:flex; flex-direction:column; gap:10px; }
.templeItem{ padding:12px 14px; border-radius:14px; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08); color:#d4d9e8; font-size:13px; line-height:1.45; }
.templeSub{ color:#9db3e1; font-size:12px; margin-top:4px; }
.templeHint{ color:#a9c7ff; font-size:12px; min-height:18px; font-weight:800; }
@media (max-width: 1100px){
 .templeBody{ grid-template-columns:1fr; }
}

#templeContinueModal{
 position:fixed;
 inset:0;
 display:none;
 align-items:center;
 justify-content:center;
 background:rgba(0,0,0,.62);
 z-index:280000;
}
#templeContinueModal.show{ display:flex; }
.templeContinueCard{
 width:min(520px, 92vw);
 border-radius:22px;
 border:1px solid rgba(255,255,255,.12);
 box-shadow:0 22px 70px rgba(0,0,0,.72);
 padding:20px;
 background:
 radial-gradient(circle at 20% 10%, rgba(255,205,120,.10), transparent 60%),
 linear-gradient(180deg, rgba(24,16,10,.97), rgba(10,8,6,.98));
}
.templeContinueTitle{
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:28px;
 font-weight:1000;
 color:#f6ddaf;
 margin-bottom:10px;
}
.templeContinueText{
 color:#d8c7a3;
 font-size:15px;
 line-height:1.55;
 margin-bottom:18px;
}
.templeContinueBtns{
 display:flex !important;
 gap:12px;
 flex-wrap:wrap;

 display:flex;
 gap:12px;
 flex-wrap:wrap;
}
.templeContinueBtn{
 display:inline-flex !important;
 align-items:center;
 justify-content:center;

 flex:1 1 220px;
 padding:14px 16px;
 border-radius:16px;
 border:1px solid rgba(255,255,255,.18);
 background:linear-gradient(180deg, rgba(255,235,120,.95), rgba(255,170,0,.85));
 color:#2b1a00;
 font-size:15px;
 font-weight:1000;
 cursor:pointer;
 box-shadow:0 12px 22px rgba(0,0,0,.35), 0 0 18px rgba(255,200,0,.20);
}
.templeContinueBtn.secondary{
 background:linear-gradient(180deg, rgba(120,180,255,.92), rgba(55,120,220,.85));
 color:#081527;
}

#charselectScreen{
 position:fixed;
 inset:0;
 display:none;
 z-index:99999;
 background:
 radial-gradient(circle at 50% 8%, rgba(255,210,120,.12), transparent 35%),
 linear-gradient(180deg, rgba(10,10,12,.98), rgba(22,14,8,.98));
}
#charselectScreen.active{ display:block !important; }
#charselectScreen .bgWrap{
 position:absolute; inset:0;
 display:flex; align-items:center; justify-content:center;
 background:transparent;
}
#charselectPanel{
 width:min(980px, 94vw);
 max-height:calc(100vh - 120px);
 overflow:auto;
 padding:24px;
 border-radius:24px;
 border:1px solid rgba(255,255,255,.12);
 background:
 radial-gradient(circle at 20% 10%, rgba(255,205,120,.10), transparent 60%),
 linear-gradient(180deg, rgba(24,16,10,.96), rgba(10,8,6,.98));
 box-shadow:0 24px 70px rgba(0,0,0,.75);
}
.charTitle{
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:36px; font-weight:1000; color:#f6ddaf; text-align:center;
 margin-bottom:10px;
}
.charSub{
 color:#d8c7a3; text-align:center; margin-bottom:20px; font-size:14px;
}
.charSlots{
 display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:16px;
}
.charCard{
 border:1px solid rgba(255,255,255,.10);
 border-radius:20px;
 background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(0,0,0,.20));
 box-shadow:0 10px 28px rgba(0,0,0,.35);
 padding:18px; display:flex; flex-direction:column; gap:12px; min-height:300px;
}
.charSlotName{
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 color:#fff3d6; font-size:22px; font-weight:1000;
}
.charMeta{ color:#d5d5d5; font-size:13px; line-height:1.45; }
.charAvatar{
 width:118px; height:118px; border-radius:18px; margin:6px auto 0; overflow:hidden;
 border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.06);
 display:grid; place-items:center;
}
.charAvatar img{ width:100%; height:100%; object-fit:cover; }
.charBtns{ display:flex; flex-direction:column; gap:10px; margin-top:auto; }
.charBtn{
 padding:12px 14px; border-radius:14px; border:1px solid rgba(255,255,255,.16);
 background:linear-gradient(180deg, rgba(255,235,120,.95), rgba(255,170,0,.85));
 color:#2b1a00; font-weight:1000; cursor:pointer;
 box-shadow:0 10px 20px rgba(0,0,0,.35), 0 0 18px rgba(255,200,0,.25);
}
.charBtn.secondary{
 background:linear-gradient(180deg, rgba(120,180,255,.92), rgba(55,120,220,.85));
 color:#081527;
}
.charBtn.danger{
 background:linear-gradient(180deg, rgba(255,110,110,.92), rgba(180,55,55,.85));
 color:#fff4f4;
}
.charEmpty{ color:#c9b79a; font-size:14px; text-align:center; margin-top:22px; }
#createBackToSlots{
 position:fixed; left:20px; top:calc(var(--hudH) + 18px); z-index:100000; display:none;
}
body.create-active #createBackToSlots{ display:inline-flex; }
@media (max-width: 980px){ .charSlots{ grid-template-columns:1fr; } }

body.charselect-active #globalLeftMenu,
body.charselect-active #leftHudMenu,
body.charselect-active .cityOverlay,
body.charselect-active #inventoryScreen,
body.charselect-active #attrScreen,
body.charselect-active #achScreen,
body.charselect-active #dealScreen,
body.charselect-active #statsScreen{
 display:none !important;
}
body.charselect-active #hud{
 pointer-events:none !important;
}
body.charselect-active #charselectScreen,
body.charselect-active #charselectScreen *{
 pointer-events:auto !important;
}
#charselectScreen{
 z-index: 2147483000 !important;
}
#charselectPanel{
 position:relative;
 z-index:2147483001 !important;
}

body:not(.charselect-active) #charselectScreen{
 display:none !important;
 pointer-events:none !important;
}
body:not(.charselect-active) #charselectScreen *{
 pointer-events:none !important;
}

#settingsModal{
 position:fixed;
 inset:0;
 display:none;
 align-items:center;
 justify-content:center;
 background:rgba(0,0,0,.60);
 backdrop-filter: blur(8px);
 z-index:2147483600;
}
#settingsModal.show{ display:flex; }
#settingsCard{
 width:min(520px, 92vw);
 border-radius:22px;
 border:1px solid rgba(255,255,255,.12);
 box-shadow:0 24px 70px rgba(0,0,0,.72);
 padding:20px;
 background:
 radial-gradient(circle at 20% 10%, rgba(255,205,120,.10), transparent 60%),
 linear-gradient(180deg, rgba(24,16,10,.97), rgba(10,8,6,.98));
}
#settingsCardTitle{
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:30px;
 font-weight:1000;
 color:#f6ddaf;
 margin-bottom:8px;
}
#settingsCardSub{
 color:#d8c7a3;
 font-size:14px;
 line-height:1.5;
 margin-bottom:16px;
}
.settingsBtnCol{
 display:flex;
 flex-direction:column;
 gap:12px;
}
.settingsBigBtn{
 width:100%;
 padding:14px 16px;
 border-radius:16px;
 border:1px solid rgba(255,255,255,.18);
 background:linear-gradient(180deg, rgba(255,235,120,.95), rgba(255,170,0,.85));
 color:#2b1a00;
 font-size:15px;
 font-weight:1000;
 cursor:pointer;
 box-shadow:0 10px 20px rgba(0,0,0,.35), 0 0 18px rgba(255,200,0,.25);
}
.settingsBigBtn.secondary{
 background:linear-gradient(180deg, rgba(120,180,255,.92), rgba(55,120,220,.85));
 color:#081527;
}

#btnOpenSettingsFixed{
 position:fixed;
 right:18px;
 top:calc(var(--hudH) + 18px);
 z-index:2147483601;
 display:inline-flex;
 align-items:center;
 gap:8px;
 padding:12px 14px;
 border-radius:16px;
 border:1px solid rgba(255,255,255,.16);
 background:linear-gradient(180deg, rgba(60,50,25,.88), rgba(15,15,15,.88));
 color:#f7f2e6;
 font-weight:1000;
 cursor:pointer;
 box-shadow:0 10px 24px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.08);
}
#btnOpenSettingsFixed:hover{
 border-color: rgba(246,213,106,.55);
 box-shadow: 0 12px 30px rgba(0,0,0,.45), 0 0 18px rgba(246,213,106,.18), inset 0 1px 0 rgba(255,255,255,.10);
}
body.charselect-active #btnOpenSettingsFixed{ display:none !important; }
body.create-active #btnOpenSettingsFixed{ display:none !important; }

#btnOpenSettingsReal{
 position:fixed;
 right:18px;
 top:calc(var(--hudH) + 18px);
 z-index:2147483601;
 display:inline-flex;
 align-items:center;
 gap:8px;
 padding:12px 14px;
 border-radius:16px;
 border:1px solid rgba(255,255,255,.16);
 background:linear-gradient(180deg, rgba(60,50,25,.88), rgba(15,15,15,.88));
 color:#f7f2e6;
 font-weight:1000;
 cursor:pointer;
 box-shadow:0 10px 24px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.08);
}
#btnOpenSettingsReal:hover{
 border-color: rgba(246,213,106,.55);
 box-shadow: 0 12px 30px rgba(0,0,0,.45), 0 0 18px rgba(246,213,106,.18), inset 0 1px 0 rgba(255,255,255,.10);
}
body.charselect-active #btnOpenSettingsReal{ display:none !important; }
#realSettingsModal{
 position:fixed;
 inset:0;
 display:none;
 align-items:center;
 justify-content:center;
 background:rgba(0,0,0,.60);
 backdrop-filter: blur(8px);
 z-index:2147483602;
}
#realSettingsModal.show{ display:flex; }
#realSettingsCard{
 width:min(520px, 92vw);
 border-radius:22px;
 border:1px solid rgba(255,255,255,.12);
 box-shadow:0 24px 70px rgba(0,0,0,.72);
 padding:20px;
 background:
 radial-gradient(circle at 20% 10%, rgba(255,205,120,.10), transparent 60%),
 linear-gradient(180deg, rgba(24,16,10,.97), rgba(10,8,6,.98));
}
.realSettingsTitle{
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:30px;
 font-weight:1000;
 color:#f6ddaf;
 margin-bottom:8px;
}
.realSettingsSub{
 color:#d8c7a3;
 font-size:14px;
 line-height:1.5;
 margin-bottom:16px;
}
.realSettingsCol{
 display:flex;
 flex-direction:column;
 gap:12px;
}
.realSettingsBtn{
 width:100%;
 padding:14px 16px;
 border-radius:16px;
 border:1px solid rgba(255,255,255,.18);
 background:linear-gradient(180deg, rgba(255,235,120,.95), rgba(255,170,0,.85));
 color:#2b1a00;
 font-size:15px;
 font-weight:1000;
 cursor:pointer;
 box-shadow:0 10px 20px rgba(0,0,0,.35), 0 0 18px rgba(255,200,0,.25);
}
.realSettingsBtn.secondary{
 background:linear-gradient(180deg, rgba(120,180,255,.92), rgba(55,120,220,.85));
 color:#081527;
}
.dealerCodeBox{
 margin-top:16px;
 padding:14px;
 border-radius:18px;
 border:1px solid rgba(255,255,255,.10);
 background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(0,0,0,.20));
 box-shadow:0 10px 28px rgba(0,0,0,.35);
}
.dealerCodeTitle{
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:18px;
 font-weight:1000;
 color:#f6ddaf;
 margin-bottom:8px;
}
.dealerCodeSub{
 color:#d8c7a3;
 font-size:13px;
 line-height:1.45;
 margin-bottom:10px;
}
.dealerCodeRow{
 display:flex;
 gap:10px;
 flex-wrap:wrap;
}
.dealerCodeInput{
 flex:1 1 260px;
 padding:12px 14px;
 border-radius:14px;
 border:1px solid rgba(255,255,255,.14);
 background:rgba(0,0,0,.28);
 color:#fff;
 outline:none;
}
.dealerCodeBtn{
 padding:12px 14px;
 border-radius:14px;
 border:1px solid rgba(255,255,255,.16);
 background:linear-gradient(180deg, rgba(120,180,255,.92), rgba(55,120,220,.85));
 color:#081527;
 font-weight:1000;
 cursor:pointer;
 box-shadow:0 10px 20px rgba(0,0,0,.35), 0 0 18px rgba(80,160,255,.22);
}
.dealerCodeHint{
 margin-top:8px;
 color:#cfcfcf;
 font-size:12px;
}

#rewardKey{
 display:none;
 gap:12px;
 align-items:center;
 background:rgba(0,0,0,.22);
 border:1px solid rgba(255,255,255,.10);
 border-radius:14px;
 padding:10px 12px;
 margin-bottom:12px;
}
#rewardKey img{
 width:54px;
 height:54px;
 object-fit:contain;
 filter:drop-shadow(0 10px 18px rgba(0,0,0,.55));
}
#rewardKeyName{ font-weight:1000; }
.keyBadge{
 display:inline-flex;align-items:center;justify-content:center;
 padding:3px 8px;border-radius:999px;
 font-size:11px;font-weight:1000;letter-spacing:.6px;
 border:1px solid rgba(255,255,255,.14);
 background:rgba(255,255,255,.06);
 text-transform:uppercase;
 color:#ffe59c;
 box-shadow:0 0 18px rgba(255,210,80,.18);
}

#mob2Screen{
 position: fixed !important;
 inset: 0 !important;
 background: transparent !important;
 padding-left: 0 !important;
}
#mob2Screen .bgWrap{
 position: fixed !important;
 top: var(--stagePad) !important;
 left: calc(50% - (var(--stageW) / 2) + var(--menuStageW)) !important;
 width: var(--cityStageW) !important;
 height: var(--cityStageH) !important;
 max-width: none !important;
 margin: 0 !important;
 padding: 0 !important;
 background: transparent !important;
 background-image: none !important;
 overflow: visible !important;
}
#mob2Screen .bg,
#mob2Screen #mob2BG{
 width: 100% !important;
 height: 100% !important;
 margin: 0 !important;
 display: block !important;
 position: relative !important;
 overflow: hidden !important;
 border-radius: var(--stageFrameRadius) !important;
 border: 1px solid rgba(255,255,255,.12) !important;
 box-shadow: 0 0 0 1px rgba(255,255,255,.04), 0 18px 48px rgba(0,0,0,.55) !important;
 background: #000 !important;
}
#mob2Screen .bg > img,
#mob2Screen #mob2Img{
 display: block !important;
 width: 100% !important;
 height: 100% !important;
 object-fit: contain !important;
 object-position: center center !important;
}
#mob2Screen .mob2Poi{ border-radius:18px; background:rgba(255,255,255,0); z-index:7; }
#mob2Screen .mob2Poi:hover{ box-shadow: inset 0 0 0 2px rgba(255,230,160,.38), 0 0 24px rgba(255,210,120,.18); }

.mob2TravelArrow{
 left:47.2% !important;
 top:3.0% !important;
 width:6.0% !important;
 height:8.8% !important;
}
.mob2TravelArrow .travelGlyph{ transform: translateY(-1px) !important; }

#mob2Screen .mob2BackArrow{
 left:46.8% !important;
 top:89.4% !important;
 width:6.0% !important;
 height:8.4% !important;
}
#mob2Screen .mob2BackArrow .travelGlyph{
 transform: rotate(90deg) !important;
}

.regionPanel{
 position:fixed; inset:0;
 display:none;
 align-items:center; justify-content:center;
 background:rgba(0,0,0,.55);
 z-index:9105;
}
.regionPanel.show{ display:flex; }
.regionWrap{
 width:min(760px, 92vw);
 border-radius:22px;
 background:
 radial-gradient(circle at 20% 10%, rgba(255,200,120,.10), transparent 60%),
 linear-gradient(180deg, rgba(18,18,22,.92), rgba(10,10,12,.92));
 border:1px solid rgba(255,255,255,.12);
 box-shadow:0 26px 80px rgba(0,0,0,.75);
 backdrop-filter: blur(10px);
 overflow:hidden;
}
.regionHead{
 display:flex; align-items:center; justify-content:space-between;
 gap:10px; padding:14px 16px;
 border-bottom:1px solid rgba(255,255,255,.10);
}
.regionTitle{
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:28px; font-weight:1000; color:#f3e1b5;
}
.regionCloseBtn{
 width:42px;height:38px;border-radius:14px;
 border:1px solid rgba(255,255,255,.10);background:rgba(0,0,0,.35);color:#fff;cursor:pointer;
}
.regionBody{ padding:16px; }
.regionStatGrid{
 display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap:12px; margin-bottom:14px;
}
.regionStatCard{
 border:1px solid rgba(255,255,255,.10); border-radius:18px; padding:12px;
 background:rgba(255,255,255,.04); box-shadow:0 12px 30px rgba(0,0,0,.45);
}
.regionStatLabel{ font-size:12px; opacity:.78; margin-bottom:6px; }
.regionStatVal{ font-size:20px; font-weight:1000; color:#fff; }
.regionLead{ color:#e9e0ce; line-height:1.45; margin-bottom:14px; }
.regionBtnRow{ display:flex; gap:10px; flex-wrap:wrap; justify-content:center; align-items:center; }
.regionBtn{
 padding:12px 14px; border-radius:14px; border:1px solid rgba(255,255,255,.18);
 background:linear-gradient(180deg, rgba(255,235,120,.95), rgba(255,170,0,.85));
 cursor:pointer; font-weight:1000; color:#2b1a00;
 box-shadow:0 10px 20px rgba(0,0,0,.35), 0 0 18px rgba(255,200,0,.28);
}
.regionBtn.secondary{
 background:linear-gradient(180deg, rgba(255,255,255,.10), rgba(0,0,0,.20));
 color:#fff; border-color:rgba(255,255,255,.14);
}

#towerContinueModal{
 position:fixed; inset:0; display:none; align-items:center; justify-content:center;
 background:rgba(0,0,0,.55); z-index:9200;
}
#towerContinueModal.show{ display:flex; }


.guildLogCard.accept{ border-left:4px solid #45b36b !important; }
.guildLogCard.kick{ border-left:4px solid #d94a4a !important; }
.guildLogCard.promote{ border-left:4px solid #4c8dff !important; }
.guildLogCard.demote{ border-left:4px solid #d94a4a !important; }


/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 002 ===== */

body{
 font-family: "Trebuchet MS","Segoe UI",Arial,sans-serif !important;
}
.topTitle, .menuTitle, .panelTitle, .modalTitle{
 font-family: Georgia,"Times New Roman",serif !important;
 letter-spacing: .6px;
}

.row.lvlRow{
 font-family: Georgia,"Times New Roman",serif !important;
 font-weight: 800;
 color: #f5d27a;
 font-size: 15px;
}
.lvlSep{
 height: 1px;
 background: rgba(245,210,122,0.35);
 margin: 6px 0 8px 0;
}

.classPickBtn{
 border:0 !important;
 outline:0 !important;
 background:transparent !important;
 box-shadow:none !important;
}

.classPickBtn img{
 display:block;
 width:96px;
 height:96px;
 object-fit:contain;
 cursor:pointer;
 user-select:none;
 pointer-events:none;
 transition: transform .2s ease, filter .2s ease;
 filter: drop-shadow(0 8px 18px rgba(0,0,0,.55));
}

.classPickBtn:hover img{
 transform: translateY(-2px) scale(1.05);
}

.classPickBtn.selected img{
 transform: scale(1.08);
 animation: classPulse 1.8s ease-in-out infinite;
}

.classPickBtn.flash img{
 animation: classFlash .32s ease;
}

@keyframes classFlash{
 0%{
 transform: scale(1.12);
 filter:
 brightness(1.35)
 drop-shadow(0 0 26px rgba(255,255,255,.75))
 drop-shadow(0 10px 22px rgba(0,0,0,.55));
 }
 100%{
 transform: scale(1.08);
 filter: drop-shadow(0 8px 18px rgba(0,0,0,.55));
 }
}

@keyframes classPulse{
 0%,100%{ opacity:1; }
 50%{ opacity:.92; }
}

.classPickBtn.selected.warriorGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 26px rgba(255,70,70,.55));
}

.classPickBtn.selected.archerGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 26px rgba(80,255,140,.50));
}

.classPickBtn.selected.mageGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 28px rgba(130,130,255,.55));
}

.classPickBtn,
.classPickBtn.selected{
 border: none !important;
 outline: none !important;
 background: transparent !important;
 box-shadow: none !important;
}

.classPickBtn::before,
.classPickBtn::after{
 display:none !important;
}

#createClassRow{
 position:absolute !important;
 right:120px !important;
 top:170px !important;
 display:flex !important;
 flex-direction:column !important;
 gap:36px !important;
 align-items:center !important;
}

html, body{ overflow-x:hidden; }

#createClassRow{
 position:absolute !important;
 right:120px !important;
 top:170px !important;
 display:flex !important;
 flex-direction:column !important;
 gap:36px !important;
 align-items:center !important;
}

.classPickBtn img{
 width:150px !important;
 height:150px !important;
}

#classPickerTitle{
 position:static !important;
 right:auto !important;
 top:auto !important;

 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:30px;
 font-weight:900;
 letter-spacing:1px;
 color:#7ad7ff;
 text-align:center;
 margin-bottom:10px;

 text-shadow:
 0 0 14px rgba(90,190,255,.7),
 0 4px 14px rgba(0,0,0,.85);
 pointer-events:none;
}

#classHoverTip{
 position:fixed;
 z-index:999999;
 padding:8px 12px;
 border-radius:10px;
 background:rgba(10,14,22,.88);
 color:#d7f4ff;
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:16px;
 font-weight:800;
 letter-spacing:.5px;
 text-shadow:0 2px 10px rgba(0,0,0,.85);
 box-shadow:
 0 0 18px rgba(90,190,255,.35),
 0 10px 30px rgba(0,0,0,.55);
 opacity:0;
 transform:translateY(6px);
 transition:opacity .12s ease, transform .12s ease;
 pointer-events:none;
 user-select:none;
 white-space:nowrap;
}

#classHoverTip.show{
 opacity:1;
 transform:translateY(0);
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 003 ===== */

#globalLeftMenu{
 background: none !important;
 background-image: none !important;
 border: none !important;
 box-shadow: none !important;
 backdrop-filter: none !important;
}
#globalLeftMenu::before,
#globalLeftMenu::after{
 display:none !important;
 content:none !important;
}

.classPickBtn{
 border:0 !important;
 outline:0 !important;
 background:transparent !important;
 box-shadow:none !important;
}

.classPickBtn img{
 display:block;
 width:96px;
 height:96px;
 object-fit:contain;
 cursor:pointer;
 user-select:none;
 pointer-events:none;
 transition: transform .2s ease, filter .2s ease;
 filter: drop-shadow(0 8px 18px rgba(0,0,0,.55));
}

.classPickBtn:hover img{
 transform: translateY(-2px) scale(1.05);
}

.classPickBtn.selected img{
 transform: scale(1.08);
 animation: classPulse 1.8s ease-in-out infinite;
}

.classPickBtn.flash img{
 animation: classFlash .32s ease;
}

@keyframes classFlash{
 0%{
 transform: scale(1.12);
 filter:
 brightness(1.35)
 drop-shadow(0 0 26px rgba(255,255,255,.75))
 drop-shadow(0 10px 22px rgba(0,0,0,.55));
 }
 100%{
 transform: scale(1.08);
 filter: drop-shadow(0 8px 18px rgba(0,0,0,.55));
 }
}

@keyframes classPulse{
 0%,100%{ opacity:1; }
 50%{ opacity:.92; }
}

.classPickBtn.selected.warriorGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 26px rgba(255,70,70,.55));
}

.classPickBtn.selected.archerGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 26px rgba(80,255,140,.50));
}

.classPickBtn.selected.mageGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 28px rgba(130,130,255,.55));
}

.classPickBtn,
.classPickBtn.selected{
 border: none !important;
 outline: none !important;
 background: transparent !important;
 box-shadow: none !important;
}

.classPickBtn::before,
.classPickBtn::after{
 display:none !important;
}

#createClassRow{
 position:absolute !important;
 right:120px !important;
 top:170px !important;
 display:flex !important;
 flex-direction:column !important;
 gap:36px !important;
 align-items:center !important;
}

html, body{ overflow-x:hidden; }

#createClassRow{
 position:absolute !important;
 right:120px !important;
 top:170px !important;
 display:flex !important;
 flex-direction:column !important;
 gap:36px !important;
 align-items:center !important;
}

.classPickBtn img{
 width:150px !important;
 height:150px !important;
}

#classPickerTitle{
 position:static !important;
 right:auto !important;
 top:auto !important;

 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:30px;
 font-weight:900;
 letter-spacing:1px;
 color:#7ad7ff;
 text-align:center;
 margin-bottom:10px;

 text-shadow:
 0 0 14px rgba(90,190,255,.7),
 0 4px 14px rgba(0,0,0,.85);
 pointer-events:none;
}

#classHoverTip{
 position:fixed;
 z-index:999999;
 padding:8px 12px;
 border-radius:10px;
 background:rgba(10,14,22,.88);
 color:#d7f4ff;
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:16px;
 font-weight:800;
 letter-spacing:.5px;
 text-shadow:0 2px 10px rgba(0,0,0,.85);
 box-shadow:
 0 0 18px rgba(90,190,255,.35),
 0 10px 30px rgba(0,0,0,.55);
 opacity:0;
 transform:translateY(6px);
 transition:opacity .12s ease, transform .12s ease;
 pointer-events:none;
 user-select:none;
 white-space:nowrap;
}

#classHoverTip.show{
 opacity:1;
 transform:translateY(0);
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 004 ===== */

#globalLeftMenu{
 animation: none !important;
 filter: none !important;
}

#globalLeftMenu *{
 animation: none !important;
}

#globalLeftMenu::before,
#globalLeftMenu::after{
 animation: none !important;
 box-shadow: none !important;
 filter: none !important;
}

.classPickBtn{
 border:0 !important;
 outline:0 !important;
 background:transparent !important;
 box-shadow:none !important;
}

.classPickBtn img{
 display:block;
 width:96px;
 height:96px;
 object-fit:contain;
 cursor:pointer;
 user-select:none;
 pointer-events:none;
 transition: transform .2s ease, filter .2s ease;
 filter: drop-shadow(0 8px 18px rgba(0,0,0,.55));
}

.classPickBtn:hover img{
 transform: translateY(-2px) scale(1.05);
}

.classPickBtn.selected img{
 transform: scale(1.08);
 animation: classPulse 1.8s ease-in-out infinite;
}

.classPickBtn.flash img{
 animation: classFlash .32s ease;
}

@keyframes classFlash{
 0%{
 transform: scale(1.12);
 filter:
 brightness(1.35)
 drop-shadow(0 0 26px rgba(255,255,255,.75))
 drop-shadow(0 10px 22px rgba(0,0,0,.55));
 }
 100%{
 transform: scale(1.08);
 filter: drop-shadow(0 8px 18px rgba(0,0,0,.55));
 }
}

@keyframes classPulse{
 0%,100%{ opacity:1; }
 50%{ opacity:.92; }
}

.classPickBtn.selected.warriorGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 26px rgba(255,70,70,.55));
}

.classPickBtn.selected.archerGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 26px rgba(80,255,140,.50));
}

.classPickBtn.selected.mageGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 28px rgba(130,130,255,.55));
}

.classPickBtn,
.classPickBtn.selected{
 border: none !important;
 outline: none !important;
 background: transparent !important;
 box-shadow: none !important;
}

.classPickBtn::before,
.classPickBtn::after{
 display:none !important;
}

#createClassRow{
 position:absolute !important;
 right:120px !important;
 top:170px !important;
 display:flex !important;
 flex-direction:column !important;
 gap:36px !important;
 align-items:center !important;
}

html, body{ overflow-x:hidden; }

#createClassRow{
 position:absolute !important;
 right:120px !important;
 top:170px !important;
 display:flex !important;
 flex-direction:column !important;
 gap:36px !important;
 align-items:center !important;
}

.classPickBtn img{
 width:150px !important;
 height:150px !important;
}

#classPickerTitle{
 position:static !important;
 right:auto !important;
 top:auto !important;

 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:30px;
 font-weight:900;
 letter-spacing:1px;
 color:#7ad7ff;
 text-align:center;
 margin-bottom:10px;

 text-shadow:
 0 0 14px rgba(90,190,255,.7),
 0 4px 14px rgba(0,0,0,.85);
 pointer-events:none;
}

#classHoverTip{
 position:fixed;
 z-index:999999;
 padding:8px 12px;
 border-radius:10px;
 background:rgba(10,14,22,.88);
 color:#d7f4ff;
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:16px;
 font-weight:800;
 letter-spacing:.5px;
 text-shadow:0 2px 10px rgba(0,0,0,.85);
 box-shadow:
 0 0 18px rgba(90,190,255,.35),
 0 10px 30px rgba(0,0,0,.55);
 opacity:0;
 transform:translateY(6px);
 transition:opacity .12s ease, transform .12s ease;
 pointer-events:none;
 user-select:none;
 white-space:nowrap;
}

#classHoverTip.show{
 opacity:1;
 transform:translateY(0);
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 005 ===== */

#globalLeftMenu{
 animation:none !important;
 filter:none !important;
}

#globalLeftMenu::before{
 animation:none !important;
 opacity:0 !important;
 filter:none !important;
}

#globalLeftMenu::after{
 animation:none !important;
 opacity:0 !important;
 filter:none !important;
}

#globalLeftMenu .lhBtn.active{
 animation:none !important;
}

#globalLeftMenu .lhBtn.active .txt::after{
 animation:none !important;
 opacity:0 !important;
}

#globalLeftMenu .lhBtn,
#globalLeftMenu .lhBtn *{
 animation:none !important;
}

.classPickBtn{
 border:0 !important;
 outline:0 !important;
 background:transparent !important;
 box-shadow:none !important;
}

.classPickBtn img{
 display:block;
 width:96px;
 height:96px;
 object-fit:contain;
 cursor:pointer;
 user-select:none;
 pointer-events:none;
 transition: transform .2s ease, filter .2s ease;
 filter: drop-shadow(0 8px 18px rgba(0,0,0,.55));
}

.classPickBtn:hover img{
 transform: translateY(-2px) scale(1.05);
}

.classPickBtn.selected img{
 transform: scale(1.08);
 animation: classPulse 1.8s ease-in-out infinite;
}

.classPickBtn.flash img{
 animation: classFlash .32s ease;
}

@keyframes classFlash{
 0%{
 transform: scale(1.12);
 filter:
 brightness(1.35)
 drop-shadow(0 0 26px rgba(255,255,255,.75))
 drop-shadow(0 10px 22px rgba(0,0,0,.55));
 }
 100%{
 transform: scale(1.08);
 filter: drop-shadow(0 8px 18px rgba(0,0,0,.55));
 }
}

@keyframes classPulse{
 0%,100%{ opacity:1; }
 50%{ opacity:.92; }
}

.classPickBtn.selected.warriorGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 26px rgba(255,70,70,.55));
}

.classPickBtn.selected.archerGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 26px rgba(80,255,140,.50));
}

.classPickBtn.selected.mageGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 28px rgba(130,130,255,.55));
}

.classPickBtn,
.classPickBtn.selected{
 border: none !important;
 outline: none !important;
 background: transparent !important;
 box-shadow: none !important;
}

.classPickBtn::before,
.classPickBtn::after{
 display:none !important;
}

#createClassRow{
 position:absolute !important;
 right:120px !important;
 top:170px !important;
 display:flex !important;
 flex-direction:column !important;
 gap:36px !important;
 align-items:center !important;
}

html, body{ overflow-x:hidden; }

#createClassRow{
 position:absolute !important;
 right:120px !important;
 top:170px !important;
 display:flex !important;
 flex-direction:column !important;
 gap:36px !important;
 align-items:center !important;
}

.classPickBtn img{
 width:150px !important;
 height:150px !important;
}

#classPickerTitle{
 position:static !important;
 right:auto !important;
 top:auto !important;

 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:30px;
 font-weight:900;
 letter-spacing:1px;
 color:#7ad7ff;
 text-align:center;
 margin-bottom:10px;

 text-shadow:
 0 0 14px rgba(90,190,255,.7),
 0 4px 14px rgba(0,0,0,.85);
 pointer-events:none;
}

#classHoverTip{
 position:fixed;
 z-index:999999;
 padding:8px 12px;
 border-radius:10px;
 background:rgba(10,14,22,.88);
 color:#d7f4ff;
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:16px;
 font-weight:800;
 letter-spacing:.5px;
 text-shadow:0 2px 10px rgba(0,0,0,.85);
 box-shadow:
 0 0 18px rgba(90,190,255,.35),
 0 10px 30px rgba(0,0,0,.55);
 opacity:0;
 transform:translateY(6px);
 transition:opacity .12s ease, transform .12s ease;
 pointer-events:none;
 user-select:none;
 white-space:nowrap;
}

#classHoverTip.show{
 opacity:1;
 transform:translateY(0);
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 006 ===== */

.bgWrap{
 background-image: none !important;
 background-color: transparent !important;
}
.bg{
 box-shadow: 0 20px 80px rgba(0,0,0,.75);
 background: transparent !important;
}

.classPickBtn{
 border:0 !important;
 outline:0 !important;
 background:transparent !important;
 box-shadow:none !important;
}

.classPickBtn img{
 display:block;
 width:96px;
 height:96px;
 object-fit:contain;
 cursor:pointer;
 user-select:none;
 pointer-events:none;
 transition: transform .2s ease, filter .2s ease;
 filter: drop-shadow(0 8px 18px rgba(0,0,0,.55));
}

.classPickBtn:hover img{
 transform: translateY(-2px) scale(1.05);
}

.classPickBtn.selected img{
 transform: scale(1.08);
 animation: classPulse 1.8s ease-in-out infinite;
}

.classPickBtn.flash img{
 animation: classFlash .32s ease;
}

@keyframes classFlash{
 0%{
 transform: scale(1.12);
 filter:
 brightness(1.35)
 drop-shadow(0 0 26px rgba(255,255,255,.75))
 drop-shadow(0 10px 22px rgba(0,0,0,.55));
 }
 100%{
 transform: scale(1.08);
 filter: drop-shadow(0 8px 18px rgba(0,0,0,.55));
 }
}

@keyframes classPulse{
 0%,100%{ opacity:1; }
 50%{ opacity:.92; }
}

.classPickBtn.selected.warriorGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 26px rgba(255,70,70,.55));
}

.classPickBtn.selected.archerGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 26px rgba(80,255,140,.50));
}

.classPickBtn.selected.mageGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 28px rgba(130,130,255,.55));
}

.classPickBtn,
.classPickBtn.selected{
 border: none !important;
 outline: none !important;
 background: transparent !important;
 box-shadow: none !important;
}

.classPickBtn::before,
.classPickBtn::after{
 display:none !important;
}

#createClassRow{
 position:absolute !important;
 right:120px !important;
 top:170px !important;
 display:flex !important;
 flex-direction:column !important;
 gap:36px !important;
 align-items:center !important;
}

html, body{ overflow-x:hidden; }

#createClassRow{
 position:absolute !important;
 right:120px !important;
 top:170px !important;
 display:flex !important;
 flex-direction:column !important;
 gap:36px !important;
 align-items:center !important;
}

.classPickBtn img{
 width:150px !important;
 height:150px !important;
}

#classPickerTitle{
 position:static !important;
 right:auto !important;
 top:auto !important;

 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:30px;
 font-weight:900;
 letter-spacing:1px;
 color:#7ad7ff;
 text-align:center;
 margin-bottom:10px;

 text-shadow:
 0 0 14px rgba(90,190,255,.7),
 0 4px 14px rgba(0,0,0,.85);
 pointer-events:none;
}

#classHoverTip{
 position:fixed;
 z-index:999999;
 padding:8px 12px;
 border-radius:10px;
 background:rgba(10,14,22,.88);
 color:#d7f4ff;
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:16px;
 font-weight:800;
 letter-spacing:.5px;
 text-shadow:0 2px 10px rgba(0,0,0,.85);
 box-shadow:
 0 0 18px rgba(90,190,255,.35),
 0 10px 30px rgba(0,0,0,.55);
 opacity:0;
 transform:translateY(6px);
 transition:opacity .12s ease, transform .12s ease;
 pointer-events:none;
 user-select:none;
 white-space:nowrap;
}

#classHoverTip.show{
 opacity:1;
 transform:translateY(0);
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 007 ===== */

#globalLeftMenu .lhBtn:not(.lhBtnCity){
 position: relative !important;
 overflow: hidden !important;
 border-radius: 14px !important;
 border: 1px solid rgba(90,60,30,.55) !important;

 background:
 radial-gradient(120% 150% at 20% 20%, rgba(255,110,30,.18), rgba(0,0,0,0) 55%),
 radial-gradient(140% 160% at 80% 80%, rgba(255,60,0,.14), rgba(0,0,0,0) 60%),
 linear-gradient(180deg, rgba(24,18,14,.92), rgba(10,8,7,.92)) !important;

 box-shadow:
 0 10px 22px rgba(0,0,0,.62),
 inset 0 1px 0 rgba(255,255,255,.06),
 inset 0 0 0 1px rgba(0,0,0,.28),
 inset 0 0 10px rgba(255,80,0,.16) !important;

 transition: transform .22s ease, box-shadow .22s ease, filter .22s ease, border-color .22s ease !important;
}

#globalLeftMenu .lhBtn:not(.lhBtnCity) .txt{
 color: #ffd2a1 !important;
 font-weight: 900 !important;
 text-shadow: 0 1px 0 rgba(0,0,0,.65);
}

#globalLeftMenu .lhBtn:not(.lhBtnCity)::before{
 content:"" !important;
 position:absolute !important;
 inset:-2px !important;
 pointer-events:none !important;

 background:
 radial-gradient(circle at 18% 35%, rgba(255,140,40,.65), transparent 42%),
 radial-gradient(circle at 72% 55%, rgba(255,70,0,.55), transparent 45%),
 radial-gradient(circle at 45% 75%, rgba(255,190,70,.25), transparent 55%),
 repeating-linear-gradient(115deg,
 rgba(255,120,40,.18) 0px, rgba(255,120,40,.18) 2px,
 rgba(0,0,0,0) 10px, rgba(0,0,0,0) 18px
 );

 mix-blend-mode: screen !important;
 opacity: .55 !important;
 filter: blur(.15px);
 animation: lavaGlow 2.2s ease-in-out infinite;
}

#globalLeftMenu .lhBtn:not(.lhBtnCity)::after{
 content:"" !important;
 position:absolute !important;
 inset:0 !important;
 pointer-events:none !important;
 background:
 radial-gradient(circle at 20% 40%, rgba(255,140,50,.35), transparent 26%),
 radial-gradient(circle at 60% 35%, rgba(255,80,0,.25), transparent 24%),
 radial-gradient(circle at 80% 70%, rgba(255,200,90,.20), transparent 26%);
 opacity:.20 !important;
}

@keyframes lavaGlow{
 0%{ opacity:.45; filter: brightness(1); }
 50%{ opacity:.95; filter: brightness(1.35); }
 100%{ opacity:.55; filter: brightness(1.05); }
}

#globalLeftMenu .lhBtn:not(.lhBtnCity):hover{
 transform: translateY(-1px) !important;
 border-color: rgba(255,90,15,.55) !important;
 filter: brightness(1.08) !important;
 box-shadow:
 0 14px 28px rgba(0,0,0,.70),
 inset 0 0 16px rgba(255,80,0,.38) !important;
}
#globalLeftMenu .lhBtn:not(.lhBtnCity):hover::before{
 opacity: 1 !important;
}

#globalLeftMenu .lhBtn:not(.lhBtnCity).active{
 border-color: rgba(255,120,35,.75) !important;
 box-shadow:
 0 14px 30px rgba(0,0,0,.74),
 0 0 18px rgba(255,80,0,.35),
 inset 0 0 18px rgba(255,90,10,.55) !important;
}
#globalLeftMenu .lhBtn:not(.lhBtnCity).active::before{
 opacity: 1 !important;
 filter: brightness(1.55);
 animation: lavaGlow 1.6s ease-in-out infinite;
}

#globalLeftMenu .lhBtn:not(.lhBtnCity):active{
 transform: translateY(1px) !important;
 filter: brightness(.98) !important;
}

.classPickBtn{
 border:0 !important;
 outline:0 !important;
 background:transparent !important;
 box-shadow:none !important;
}

.classPickBtn img{
 display:block;
 width:96px;
 height:96px;
 object-fit:contain;
 cursor:pointer;
 user-select:none;
 pointer-events:none;
 transition: transform .2s ease, filter .2s ease;
 filter: drop-shadow(0 8px 18px rgba(0,0,0,.55));
}

.classPickBtn:hover img{
 transform: translateY(-2px) scale(1.05);
}

.classPickBtn.selected img{
 transform: scale(1.08);
 animation: classPulse 1.8s ease-in-out infinite;
}

.classPickBtn.flash img{
 animation: classFlash .32s ease;
}

@keyframes classFlash{
 0%{
 transform: scale(1.12);
 filter:
 brightness(1.35)
 drop-shadow(0 0 26px rgba(255,255,255,.75))
 drop-shadow(0 10px 22px rgba(0,0,0,.55));
 }
 100%{
 transform: scale(1.08);
 filter: drop-shadow(0 8px 18px rgba(0,0,0,.55));
 }
}

@keyframes classPulse{
 0%,100%{ opacity:1; }
 50%{ opacity:.92; }
}

.classPickBtn.selected.warriorGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 26px rgba(255,70,70,.55));
}

.classPickBtn.selected.archerGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 26px rgba(80,255,140,.50));
}

.classPickBtn.selected.mageGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 28px rgba(130,130,255,.55));
}

.classPickBtn,
.classPickBtn.selected{
 border: none !important;
 outline: none !important;
 background: transparent !important;
 box-shadow: none !important;
}

.classPickBtn::before,
.classPickBtn::after{
 display:none !important;
}

#createClassRow{
 position:absolute !important;
 right:120px !important;
 top:170px !important;
 display:flex !important;
 flex-direction:column !important;
 gap:36px !important;
 align-items:center !important;
}

html, body{ overflow-x:hidden; }

#createClassRow{
 position:absolute !important;
 right:120px !important;
 top:170px !important;
 display:flex !important;
 flex-direction:column !important;
 gap:36px !important;
 align-items:center !important;
}

.classPickBtn img{
 width:150px !important;
 height:150px !important;
}

#classPickerTitle{
 position:static !important;
 right:auto !important;
 top:auto !important;

 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:30px;
 font-weight:900;
 letter-spacing:1px;
 color:#7ad7ff;
 text-align:center;
 margin-bottom:10px;

 text-shadow:
 0 0 14px rgba(90,190,255,.7),
 0 4px 14px rgba(0,0,0,.85);
 pointer-events:none;
}

#classHoverTip{
 position:fixed;
 z-index:999999;
 padding:8px 12px;
 border-radius:10px;
 background:rgba(10,14,22,.88);
 color:#d7f4ff;
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:16px;
 font-weight:800;
 letter-spacing:.5px;
 text-shadow:0 2px 10px rgba(0,0,0,.85);
 box-shadow:
 0 0 18px rgba(90,190,255,.35),
 0 10px 30px rgba(0,0,0,.55);
 opacity:0;
 transform:translateY(6px);
 transition:opacity .12s ease, transform .12s ease;
 pointer-events:none;
 user-select:none;
 white-space:nowrap;
}

#classHoverTip.show{
 opacity:1;
 transform:translateY(0);
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 008 ===== */

#globalLeftMenu .lhBtn .txt{
 position: relative !important;
 z-index: 5 !important;

 background: linear-gradient(180deg, #fff6d5 0%, #ffd76a 35%, #ffb300 60%, #b87300 100%);
 -webkit-background-clip: text;
 -webkit-text-fill-color: transparent;

 font-weight: 900 !important;
 letter-spacing: .7px;

 text-shadow:
 0 2px 0 rgba(0,0,0,.9),
 0 0 6px rgba(255,190,80,.45),
 0 0 12px rgba(255,140,0,.25);
}

#globalLeftMenu .lhBtn::before{ z-index:1 !important; }
#globalLeftMenu .lhBtn::after{ z-index:2 !important; }

.classPickBtn{
 border:0 !important;
 outline:0 !important;
 background:transparent !important;
 box-shadow:none !important;
}

.classPickBtn img{
 display:block;
 width:96px;
 height:96px;
 object-fit:contain;
 cursor:pointer;
 user-select:none;
 pointer-events:none;
 transition: transform .2s ease, filter .2s ease;
 filter: drop-shadow(0 8px 18px rgba(0,0,0,.55));
}

.classPickBtn:hover img{
 transform: translateY(-2px) scale(1.05);
}

.classPickBtn.selected img{
 transform: scale(1.08);
 animation: classPulse 1.8s ease-in-out infinite;
}

.classPickBtn.flash img{
 animation: classFlash .32s ease;
}

@keyframes classFlash{
 0%{
 transform: scale(1.12);
 filter:
 brightness(1.35)
 drop-shadow(0 0 26px rgba(255,255,255,.75))
 drop-shadow(0 10px 22px rgba(0,0,0,.55));
 }
 100%{
 transform: scale(1.08);
 filter: drop-shadow(0 8px 18px rgba(0,0,0,.55));
 }
}

@keyframes classPulse{
 0%,100%{ opacity:1; }
 50%{ opacity:.92; }
}

.classPickBtn.selected.warriorGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 26px rgba(255,70,70,.55));
}

.classPickBtn.selected.archerGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 26px rgba(80,255,140,.50));
}

.classPickBtn.selected.mageGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 28px rgba(130,130,255,.55));
}

.classPickBtn,
.classPickBtn.selected{
 border: none !important;
 outline: none !important;
 background: transparent !important;
 box-shadow: none !important;
}

.classPickBtn::before,
.classPickBtn::after{
 display:none !important;
}

#createClassRow{
 position:absolute !important;
 right:120px !important;
 top:170px !important;
 display:flex !important;
 flex-direction:column !important;
 gap:36px !important;
 align-items:center !important;
}

html, body{ overflow-x:hidden; }

#createClassRow{
 position:absolute !important;
 right:120px !important;
 top:170px !important;
 display:flex !important;
 flex-direction:column !important;
 gap:36px !important;
 align-items:center !important;
}

.classPickBtn img{
 width:150px !important;
 height:150px !important;
}

#classPickerTitle{
 position:static !important;
 right:auto !important;
 top:auto !important;

 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:30px;
 font-weight:900;
 letter-spacing:1px;
 color:#7ad7ff;
 text-align:center;
 margin-bottom:10px;

 text-shadow:
 0 0 14px rgba(90,190,255,.7),
 0 4px 14px rgba(0,0,0,.85);
 pointer-events:none;
}

#classHoverTip{
 position:fixed;
 z-index:999999;
 padding:8px 12px;
 border-radius:10px;
 background:rgba(10,14,22,.88);
 color:#d7f4ff;
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:16px;
 font-weight:800;
 letter-spacing:.5px;
 text-shadow:0 2px 10px rgba(0,0,0,.85);
 box-shadow:
 0 0 18px rgba(90,190,255,.35),
 0 10px 30px rgba(0,0,0,.55);
 opacity:0;
 transform:translateY(6px);
 transition:opacity .12s ease, transform .12s ease;
 pointer-events:none;
 user-select:none;
 white-space:nowrap;
}

#classHoverTip.show{
 opacity:1;
 transform:translateY(0);
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 009 ===== */

#globalLeftMenu .lhBtn .txt{
 opacity: 1 !important;
 pointer-events: auto !important;
 display: inline-block !important;
}

.classPickBtn{
 border:0 !important;
 outline:0 !important;
 background:transparent !important;
 box-shadow:none !important;
}

.classPickBtn img{
 display:block;
 width:96px;
 height:96px;
 object-fit:contain;
 cursor:pointer;
 user-select:none;
 pointer-events:none;
 transition: transform .2s ease, filter .2s ease;
 filter: drop-shadow(0 8px 18px rgba(0,0,0,.55));
}

.classPickBtn:hover img{
 transform: translateY(-2px) scale(1.05);
}

.classPickBtn.selected img{
 transform: scale(1.08);
 animation: classPulse 1.8s ease-in-out infinite;
}

.classPickBtn.flash img{
 animation: classFlash .32s ease;
}

@keyframes classFlash{
 0%{
 transform: scale(1.12);
 filter:
 brightness(1.35)
 drop-shadow(0 0 26px rgba(255,255,255,.75))
 drop-shadow(0 10px 22px rgba(0,0,0,.55));
 }
 100%{
 transform: scale(1.08);
 filter: drop-shadow(0 8px 18px rgba(0,0,0,.55));
 }
}

@keyframes classPulse{
 0%,100%{ opacity:1; }
 50%{ opacity:.92; }
}

.classPickBtn.selected.warriorGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 26px rgba(255,70,70,.55));
}

.classPickBtn.selected.archerGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 26px rgba(80,255,140,.50));
}

.classPickBtn.selected.mageGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 28px rgba(130,130,255,.55));
}

.classPickBtn,
.classPickBtn.selected{
 border: none !important;
 outline: none !important;
 background: transparent !important;
 box-shadow: none !important;
}

.classPickBtn::before,
.classPickBtn::after{
 display:none !important;
}

#createClassRow{
 position:absolute !important;
 right:120px !important;
 top:170px !important;
 display:flex !important;
 flex-direction:column !important;
 gap:36px !important;
 align-items:center !important;
}

html, body{ overflow-x:hidden; }

#createClassRow{
 position:absolute !important;
 right:120px !important;
 top:170px !important;
 display:flex !important;
 flex-direction:column !important;
 gap:36px !important;
 align-items:center !important;
}

.classPickBtn img{
 width:150px !important;
 height:150px !important;
}

#classPickerTitle{
 position:static !important;
 right:auto !important;
 top:auto !important;

 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:30px;
 font-weight:900;
 letter-spacing:1px;
 color:#7ad7ff;
 text-align:center;
 margin-bottom:10px;

 text-shadow:
 0 0 14px rgba(90,190,255,.7),
 0 4px 14px rgba(0,0,0,.85);
 pointer-events:none;
}

#classHoverTip{
 position:fixed;
 z-index:999999;
 padding:8px 12px;
 border-radius:10px;
 background:rgba(10,14,22,.88);
 color:#d7f4ff;
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:16px;
 font-weight:800;
 letter-spacing:.5px;
 text-shadow:0 2px 10px rgba(0,0,0,.85);
 box-shadow:
 0 0 18px rgba(90,190,255,.35),
 0 10px 30px rgba(0,0,0,.55);
 opacity:0;
 transform:translateY(6px);
 transition:opacity .12s ease, transform .12s ease;
 pointer-events:none;
 user-select:none;
 white-space:nowrap;
}

#classHoverTip.show{
 opacity:1;
 transform:translateY(0);
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 010 ===== */

#globalLeftMenu .lhBtn .txt{
 opacity: 1 !important;
 display: inline-block !important;
 position: relative !important;
 z-index: 10 !important;

 background: none !important;
 -webkit-background-clip: initial !important;
 -webkit-text-fill-color: initial !important;

 color: #ffcc33 !important;
 font-weight: 900 !important;
 letter-spacing: .8px !important;

 text-shadow:
 0 2px 0 #000,
 0 0 6px rgba(0,0,0,.9),
 0 0 12px rgba(0,0,0,.8),
 0 0 18px rgba(0,0,0,.6);
}

#globalLeftMenu .lhBtn.imgBtn{
 transform: none !important;
 transition: none !important;
}
#globalLeftMenu .lhBtn.imgBtn:hover{
 transform: none !important;
 filter: none !important;
 box-shadow: none !important;
}

#globalLeftMenu .lhBtn.imgBtn::after{
 animation: none !important;
 transform: none !important;
 background-position: center !important;
}

#globalLeftMenu .lhBtn.imgBtn .txt::after{
 content: none !important;
 animation: none !important;
}
#globalLeftMenu .lhBtn.imgBtn::before{
 content: none !important;
 display: none !important;
}

.classPickBtn{
 border:0 !important;
 outline:0 !important;
 background:transparent !important;
 box-shadow:none !important;
}

.classPickBtn img{
 display:block;
 width:96px;
 height:96px;
 object-fit:contain;
 cursor:pointer;
 user-select:none;
 pointer-events:none;
 transition: transform .2s ease, filter .2s ease;
 filter: drop-shadow(0 8px 18px rgba(0,0,0,.55));
}

.classPickBtn:hover img{
 transform: translateY(-2px) scale(1.05);
}

.classPickBtn.selected img{
 transform: scale(1.08);
 animation: classPulse 1.8s ease-in-out infinite;
}

.classPickBtn.flash img{
 animation: classFlash .32s ease;
}

@keyframes classFlash{
 0%{
 transform: scale(1.12);
 filter:
 brightness(1.35)
 drop-shadow(0 0 26px rgba(255,255,255,.75))
 drop-shadow(0 10px 22px rgba(0,0,0,.55));
 }
 100%{
 transform: scale(1.08);
 filter: drop-shadow(0 8px 18px rgba(0,0,0,.55));
 }
}

@keyframes classPulse{
 0%,100%{ opacity:1; }
 50%{ opacity:.92; }
}

.classPickBtn.selected.warriorGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 26px rgba(255,70,70,.55));
}

.classPickBtn.selected.archerGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 26px rgba(80,255,140,.50));
}

.classPickBtn.selected.mageGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 28px rgba(130,130,255,.55));
}

.classPickBtn,
.classPickBtn.selected{
 border: none !important;
 outline: none !important;
 background: transparent !important;
 box-shadow: none !important;
}

.classPickBtn::before,
.classPickBtn::after{
 display:none !important;
}

#createClassRow{
 position:absolute !important;
 right:120px !important;
 top:170px !important;
 display:flex !important;
 flex-direction:column !important;
 gap:36px !important;
 align-items:center !important;
}

html, body{ overflow-x:hidden; }

#createClassRow{
 position:absolute !important;
 right:120px !important;
 top:170px !important;
 display:flex !important;
 flex-direction:column !important;
 gap:36px !important;
 align-items:center !important;
}

.classPickBtn img{
 width:150px !important;
 height:150px !important;
}

#classPickerTitle{
 position:static !important;
 right:auto !important;
 top:auto !important;

 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:30px;
 font-weight:900;
 letter-spacing:1px;
 color:#7ad7ff;
 text-align:center;
 margin-bottom:10px;

 text-shadow:
 0 0 14px rgba(90,190,255,.7),
 0 4px 14px rgba(0,0,0,.85);
 pointer-events:none;
}

#classHoverTip{
 position:fixed;
 z-index:999999;
 padding:8px 12px;
 border-radius:10px;
 background:rgba(10,14,22,.88);
 color:#d7f4ff;
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:16px;
 font-weight:800;
 letter-spacing:.5px;
 text-shadow:0 2px 10px rgba(0,0,0,.85);
 box-shadow:
 0 0 18px rgba(90,190,255,.35),
 0 10px 30px rgba(0,0,0,.55);
 opacity:0;
 transform:translateY(6px);
 transition:opacity .12s ease, transform .12s ease;
 pointer-events:none;
 user-select:none;
 white-space:nowrap;
}

#classHoverTip.show{
 opacity:1;
 transform:translateY(0);
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 011 ===== */

.lhBtn{
 transition: transform 0.15s ease;
}

.lhBtn:hover{
 transform: scale(1.03);
}

.leftMenu{
 overflow: visible;
}

.classPickBtn{
 border:0 !important;
 outline:0 !important;
 background:transparent !important;
 box-shadow:none !important;
}

.classPickBtn img{
 display:block;
 width:96px;
 height:96px;
 object-fit:contain;
 cursor:pointer;
 user-select:none;
 pointer-events:none;
 transition: transform .2s ease, filter .2s ease;
 filter: drop-shadow(0 8px 18px rgba(0,0,0,.55));
}

.classPickBtn:hover img{
 transform: translateY(-2px) scale(1.05);
}

.classPickBtn.selected img{
 transform: scale(1.08);
 animation: classPulse 1.8s ease-in-out infinite;
}

.classPickBtn.flash img{
 animation: classFlash .32s ease;
}

@keyframes classFlash{
 0%{
 transform: scale(1.12);
 filter:
 brightness(1.35)
 drop-shadow(0 0 26px rgba(255,255,255,.75))
 drop-shadow(0 10px 22px rgba(0,0,0,.55));
 }
 100%{
 transform: scale(1.08);
 filter: drop-shadow(0 8px 18px rgba(0,0,0,.55));
 }
}

@keyframes classPulse{
 0%,100%{ opacity:1; }
 50%{ opacity:.92; }
}

.classPickBtn.selected.warriorGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 26px rgba(255,70,70,.55));
}

.classPickBtn.selected.archerGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 26px rgba(80,255,140,.50));
}

.classPickBtn.selected.mageGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 28px rgba(130,130,255,.55));
}

.classPickBtn,
.classPickBtn.selected{
 border: none !important;
 outline: none !important;
 background: transparent !important;
 box-shadow: none !important;
}

.classPickBtn::before,
.classPickBtn::after{
 display:none !important;
}

#createClassRow{
 position:absolute !important;
 right:120px !important;
 top:170px !important;
 display:flex !important;
 flex-direction:column !important;
 gap:36px !important;
 align-items:center !important;
}

html, body{ overflow-x:hidden; }

#createClassRow{
 position:absolute !important;
 right:120px !important;
 top:170px !important;
 display:flex !important;
 flex-direction:column !important;
 gap:36px !important;
 align-items:center !important;
}

.classPickBtn img{
 width:150px !important;
 height:150px !important;
}

#classPickerTitle{
 position:static !important;
 right:auto !important;
 top:auto !important;

 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:30px;
 font-weight:900;
 letter-spacing:1px;
 color:#7ad7ff;
 text-align:center;
 margin-bottom:10px;

 text-shadow:
 0 0 14px rgba(90,190,255,.7),
 0 4px 14px rgba(0,0,0,.85);
 pointer-events:none;
}

#classHoverTip{
 position:fixed;
 z-index:999999;
 padding:8px 12px;
 border-radius:10px;
 background:rgba(10,14,22,.88);
 color:#d7f4ff;
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:16px;
 font-weight:800;
 letter-spacing:.5px;
 text-shadow:0 2px 10px rgba(0,0,0,.85);
 box-shadow:
 0 0 18px rgba(90,190,255,.35),
 0 10px 30px rgba(0,0,0,.55);
 opacity:0;
 transform:translateY(6px);
 transition:opacity .12s ease, transform .12s ease;
 pointer-events:none;
 user-select:none;
 white-space:nowrap;
}

#classHoverTip.show{
 opacity:1;
 transform:translateY(0);
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 012 ===== */

.leftMenu button,
.lhBtn{
 background: transparent !important;
 background-image: none !important;
 border: 0 !important;
 box-shadow: none !important;
 outline: none !important;
}

.leftMenu .menuItem,
.leftMenu .btnWrapper,
.leftMenu .btnContainer{
 background: transparent !important;
 border: 0 !important;
 box-shadow: none !important;
}

.leftMenu button::before,
.leftMenu button::after,
.lhBtn::before,
.lhBtn::after{
 display: none !important;
 content: none !important;
}

.leftMenu button:hover{
 background: transparent !important;
 box-shadow: none !important;
}

.classPickBtn{
 border:0 !important;
 outline:0 !important;
 background:transparent !important;
 box-shadow:none !important;
}

.classPickBtn img{
 display:block;
 width:96px;
 height:96px;
 object-fit:contain;
 cursor:pointer;
 user-select:none;
 pointer-events:none;
 transition: transform .2s ease, filter .2s ease;
 filter: drop-shadow(0 8px 18px rgba(0,0,0,.55));
}

.classPickBtn:hover img{
 transform: translateY(-2px) scale(1.05);
}

.classPickBtn.selected img{
 transform: scale(1.08);
 animation: classPulse 1.8s ease-in-out infinite;
}

.classPickBtn.flash img{
 animation: classFlash .32s ease;
}

@keyframes classFlash{
 0%{
 transform: scale(1.12);
 filter:
 brightness(1.35)
 drop-shadow(0 0 26px rgba(255,255,255,.75))
 drop-shadow(0 10px 22px rgba(0,0,0,.55));
 }
 100%{
 transform: scale(1.08);
 filter: drop-shadow(0 8px 18px rgba(0,0,0,.55));
 }
}

@keyframes classPulse{
 0%,100%{ opacity:1; }
 50%{ opacity:.92; }
}

.classPickBtn.selected.warriorGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 26px rgba(255,70,70,.55));
}

.classPickBtn.selected.archerGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 26px rgba(80,255,140,.50));
}

.classPickBtn.selected.mageGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 28px rgba(130,130,255,.55));
}

.classPickBtn,
.classPickBtn.selected{
 border: none !important;
 outline: none !important;
 background: transparent !important;
 box-shadow: none !important;
}

.classPickBtn::before,
.classPickBtn::after{
 display:none !important;
}

#createClassRow{
 position:absolute !important;
 right:120px !important;
 top:170px !important;
 display:flex !important;
 flex-direction:column !important;
 gap:36px !important;
 align-items:center !important;
}

html, body{ overflow-x:hidden; }

#createClassRow{
 position:absolute !important;
 right:120px !important;
 top:170px !important;
 display:flex !important;
 flex-direction:column !important;
 gap:36px !important;
 align-items:center !important;
}

.classPickBtn img{
 width:150px !important;
 height:150px !important;
}

#classPickerTitle{
 position:static !important;
 right:auto !important;
 top:auto !important;

 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:30px;
 font-weight:900;
 letter-spacing:1px;
 color:#7ad7ff;
 text-align:center;
 margin-bottom:10px;

 text-shadow:
 0 0 14px rgba(90,190,255,.7),
 0 4px 14px rgba(0,0,0,.85);
 pointer-events:none;
}

#classHoverTip{
 position:fixed;
 z-index:999999;
 padding:8px 12px;
 border-radius:10px;
 background:rgba(10,14,22,.88);
 color:#d7f4ff;
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:16px;
 font-weight:800;
 letter-spacing:.5px;
 text-shadow:0 2px 10px rgba(0,0,0,.85);
 box-shadow:
 0 0 18px rgba(90,190,255,.35),
 0 10px 30px rgba(0,0,0,.55);
 opacity:0;
 transform:translateY(6px);
 transition:opacity .12s ease, transform .12s ease;
 pointer-events:none;
 user-select:none;
 white-space:nowrap;
}

#classHoverTip.show{
 opacity:1;
 transform:translateY(0);
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 013 ===== */

.bigMage{
 width: 96px !important;
 height: 96px !important;
 transform: scale(1);
 transform-origin:center center;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 014 ===== */

:root{
 --leftMenuBtnH: 70px !important;
 --leftMenuGap: 0px !important;
 --leftMenuBtnShiftX: 0px !important;
}

#globalLeftMenu{
 width: 180px !important;
 padding: 0 !important;
 margin: 0 !important;
 display: block !important;
 gap: 0 !important;
}

#globalLeftMenu .lhTitle{
 margin: 0 0 6px 6px !important;
}

#globalLeftMenu .lhSep{
 display:none !important;
 height:0 !important;
 margin:0 !important;
 padding:0 !important;
}

#globalLeftMenu .lhBtn.imgBtn{
 height: var(--leftMenuBtnH) !important;
 min-height: var(--leftMenuBtnH) !important;
 margin: 0 !important;
 padding: 0 !important;
 line-height: 0 !important;
 transform: none !important;
}

#globalLeftMenu .lhBtn.imgBtn:hover{
 transform: none !important;
}

#globalLeftMenu .lhBtn.imgBtn + .lhBtn.imgBtn{
 margin-top: var(--leftMenuGap) !important;
}

#globalLeftMenu .lhBtn.imgBtn::after{
 background-size: 100% 100% !important;
 background-position: center !important;
}

#globalLeftMenu .lhBtn.imgBtn .txt{
 display:none !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 015 ===== */

#lbScreen{ z-index: 50; }
#lbScreen .lbPanel{

 margin-top: 86px !important;
 margin-left: clamp(170px, 16vw, 240px) !important;
 margin-right: 18px !important;
 margin-bottom: 18px !important;
 height: calc(100% - 110px) !important;
 max-width: 1280px;
}
#lbScreen .lbHeaderRow{
 display:flex;
 align-items:flex-start;
 justify-content:space-between;
 gap:12px;
 margin-bottom: 12px;
}
#lbScreen .lbTitle{
 font-weight: 1000;
 font-size: 20px;
 letter-spacing: .2px;
 margin-bottom: 4px;
}
#lbScreen .lbSub{ max-width: 980px; }
#lbScreen .lbClose{
 width: 42px;
 height: 42px;
 border-radius: 14px;
 border:1px solid rgba(255,255,255,.12);
 background: rgba(0,0,0,.25);
 color: #fff;
 font-weight: 1000;
 cursor: pointer;
}
#lbScreen .lbClose:hover{ background: rgba(255,255,255,.06); }

#lbScreen .lbTableWrap{
 border:1px solid rgba(255,255,255,.10);
 border-radius: 14px;
 overflow:auto;
 max-height: calc(100% - 120px);
 background: rgba(0,0,0,.18);
}
#lbScreen .lbTable{
 width: 100%;
 min-width: 860px;
 border-collapse: collapse;
}
#lbScreen .lbTable thead th{
 position: sticky;
 top: 0;
 background: rgba(0,0,0,.65);
 padding: 10px 10px;
 text-align:left;
 font-size: 13px;
 letter-spacing: .3px;
 border-bottom: 1px solid rgba(255,255,255,.10);
}
#lbScreen .lbTable td{
 padding: 10px 10px;
 border-bottom: 1px solid rgba(255,255,255,.06);
}
#lbScreen .lbTable th.c, #lbScreen .lbTable td.c{ text-align:center; }
#lbScreen .lbTable th.r, #lbScreen .lbTable td.r{ text-align:right; }

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 016 ===== */

#globalLeftMenu{ display:none !important; }
#hud{ display:none !important; }
:root{ --hudH: 0px !important; }

#leftHudMenu{
 position:fixed !important;
 left:0 !important; top:0 !important; bottom:0 !important;
 width:360px !important;
 z-index:100000 !important;
 padding:14px 12px 14px !important;
 border-radius:0 !important;
 background:
 radial-gradient(1200px 900px at 40% -10%, rgba(120,180,255,.22), rgba(0,0,0,0) 55%),
 radial-gradient(900px 700px at 110% 30%, rgba(255,120,180,.10), rgba(0,0,0,0) 55%),
 linear-gradient(180deg, rgba(10,22,30,.92), rgba(6,12,18,.92));
 border-right:1px solid rgba(255,255,255,.10) !important;
 box-shadow: 0 18px 40px rgba(0,0,0,.55), inset -10px 0 20px rgba(0,0,0,.35) !important;
 backdrop-filter: blur(6px);
 overflow:auto !important;
}
#leftHudMenu::-webkit-scrollbar{ width:10px; }
#leftHudMenu::-webkit-scrollbar-thumb{ background:rgba(255,255,255,.12); border-radius:10px; }

.dfTop{
 border-radius:18px;
 padding:12px;
 background:
 radial-gradient(900px 240px at 50% 0%, rgba(255,220,150,.14), rgba(0,0,0,0) 60%),
 linear-gradient(180deg, rgba(18,38,52,.92), rgba(9,18,26,.92));
 border:1px solid rgba(255,255,255,.10);
 box-shadow: 0 12px 26px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.06);
}
.dfRow{ display:flex; gap:12px; align-items:center; }
.dfAvatar{
 width:66px; height:66px; border-radius:16px; overflow:hidden;
 border:1px solid rgba(255,255,255,.14);
 background:rgba(0,0,0,.22);
 box-shadow: inset 0 0 0 1px rgba(0,0,0,.35);
 flex:0 0 auto;
}
.dfAvatar img{ width:100%; height:100%; object-fit:cover; }
.dfMeta{ flex:1; min-width:0; }
.dfName{ display:flex; justify-content:space-between; gap:8px; align-items:center; }
.dfName b{ font-weight:1000; letter-spacing:.02em; text-shadow:0 2px 10px rgba(0,0,0,.55); }
.dfLvl{ font-weight:1000; opacity:.9; }

.dfPills{ display:flex; gap:8px; flex-wrap:wrap; margin-top:10px; }
.dfPill{
 display:flex; gap:6px; align-items:center;
 padding:6px 10px;
 border-radius:999px;
 border:1px solid rgba(255,255,255,.10);
 background: rgba(0,0,0,.22);
 box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
 font-weight:1000;
 font-variant-numeric: tabular-nums;
}
.dfPill .ico{ filter: drop-shadow(0 2px 2px rgba(0,0,0,.45)); }

.dfXp{ margin-top:10px; }
.dfXpBar{
 height:12px; border-radius:999px;
 background: rgba(0,0,0,.22);
 border:1px solid rgba(255,255,255,.10);
 overflow:hidden;
 box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
}
.dfXpFill{ height:100%; width:0%; background: linear-gradient(90deg, rgba(70,210,255,.95), rgba(120,255,200,.95)); }
.dfXpTxt{ text-align:center; margin-top:6px; font-size:12px; opacity:.85; font-weight:900; }

.dfSep{ height:1px; background:rgba(255,255,255,.10); margin:14px 6px; }

#leftHudMenu .lhBtn{
 width:100%;
 display:flex; align-items:center; gap:12px;
 padding:14px 14px;
 border-radius:18px;
 border:1px solid rgba(255,255,255,.12);
 background: linear-gradient(180deg, rgba(25,55,75,.82), rgba(10,25,38,.82));
 box-shadow: 0 14px 22px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.07), inset 0 -10px 20px rgba(0,0,0,.22);
 cursor:pointer;
 user-select:none;
 margin:10px 0;
 color:#fff;
}
#leftHudMenu .lhBtn:hover{ filter:brightness(1.06); }
#leftHudMenu .lhBtn:active{ transform: translateY(1px); filter:brightness(1.03); }

.dfIco{
 width:44px; height:44px;
 border-radius:16px;
 display:grid; place-items:center;
 background: rgba(0,0,0,.24);
 border:1px solid rgba(255,255,255,.10);
 box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
 flex:0 0 auto;
 font-size:20px;
}
.dfLbl{
 flex:1;
 text-align:center;
 font-weight:1000;
 letter-spacing:.06em;
 color:#f4d27a;
 text-shadow: 0 2px 0 rgba(0,0,0,.60);
 text-transform: uppercase;
}

#cityScreen{ padding-left:360px !important; }
#cityScreen .bgWrap{ width: calc(100vw - 360px) !important; height:100vh !important; max-width:none !important; }
#cityImg{ width:100% !important; height:100% !important; object-fit:contain !important; }
.hotspot{ z-index:50 !important; pointer-events:auto !important; }
#bgFX, #deathFlash{ pointer-events:none !important; }

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 017 ===== */

#hud{ display:none !important; }

#dfMenu{ display:none; }
body.cityMenuOn #dfMenu{ display:block; }

#dfMenu{
 position:fixed;
 left:0; top:0; bottom:0;
 width:360px;
 z-index:100000;
 padding:14px 12px 14px;
 background:
 radial-gradient(1200px 900px at 40% -10%, rgba(120,180,255,.22), rgba(0,0,0,0) 55%),
 radial-gradient(900px 700px at 110% 30%, rgba(255,120,180,.10), rgba(0,0,0,0) 55%),
 linear-gradient(180deg, rgba(10,22,30,.92), rgba(6,12,18,.92));
 border-right:1px solid rgba(255,255,255,.10);
 box-shadow: 0 18px 40px rgba(0,0,0,.55), inset -10px 0 20px rgba(0,0,0,.35);
 backdrop-filter: blur(6px);
 overflow:auto;
}
#dfMenu::-webkit-scrollbar{ width:10px; }
#dfMenu::-webkit-scrollbar-thumb{ background:rgba(255,255,255,.12); border-radius:10px; }

.dfTop{
 border-radius:18px;
 padding:12px;
 background:
 radial-gradient(900px 240px at 50% 0%, rgba(255,220,150,.14), rgba(0,0,0,0) 60%),
 linear-gradient(180deg, rgba(18,38,52,.92), rgba(9,18,26,.92));
 border:1px solid rgba(255,255,255,.10);
 box-shadow: 0 12px 26px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.06);
}
.dfRow{ display:flex; gap:12px; align-items:center; }
.dfAvatar{
 width:66px; height:66px; border-radius:16px; overflow:hidden;
 border:1px solid rgba(255,255,255,.14);
 background:rgba(0,0,0,.22);
 box-shadow: inset 0 0 0 1px rgba(0,0,0,.35);
 flex:0 0 auto;
}
.dfAvatar img{ width:100%; height:100%; object-fit:cover; }
.dfMeta{ flex:1; min-width:0; }
.dfName{ display:flex; justify-content:space-between; gap:8px; align-items:center; }
.dfName b{ font-weight:1000; letter-spacing:.02em; text-shadow:0 2px 10px rgba(0,0,0,.55); }
.dfLvl{ font-weight:1000; opacity:.9; }

.dfPills{ display:flex; gap:8px; flex-wrap:wrap; margin-top:10px; }
.dfPill{
 display:flex; gap:6px; align-items:center;
 padding:6px 10px;
 border-radius:999px;
 border:1px solid rgba(255,255,255,.10);
 background: rgba(0,0,0,.22);
 box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
 font-weight:1000;
 font-variant-numeric: tabular-nums;
}
.dfPill .ico{ filter: drop-shadow(0 2px 2px rgba(0,0,0,.45)); }

.dfXp{ margin-top:10px; }
.dfXpBar{
 height:12px;
 border-radius:999px;
 background: rgba(0,0,0,.22);
 border:1px solid rgba(255,255,255,.10);
 overflow:hidden;
 box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
}
.dfXpFill{ height:100%; width:0%; background: linear-gradient(90deg, rgba(70,210,255,.95), rgba(120,255,200,.95)); }
.dfXpTxt{ text-align:center; margin-top:6px; font-size:12px; opacity:.85; font-weight:900; }

.dfSep{ height:1px; background:rgba(255,255,255,.10); margin:14px 6px; }

.dfBtn, #dfMenu .lhBtn{
 width:100%;
 display:flex; align-items:center; gap:12px;
 padding:14px 14px;
 border-radius:18px;
 border:1px solid rgba(255,255,255,.12);
 background: linear-gradient(180deg, rgba(25,55,75,.82), rgba(10,25,38,.82));
 box-shadow: 0 14px 22px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.07), inset 0 -10px 20px rgba(0,0,0,.22);
 cursor:pointer;
 user-select:none;
 margin:10px 0;
 color:#fff;
}
.dfBtn:hover, #dfMenu .lhBtn:hover{ filter:brightness(1.06); }
.dfBtn:active, #dfMenu .lhBtn:active{ transform: translateY(1px); filter:brightness(1.03); }
.dfIco{
 width:44px; height:44px; border-radius:16px;
 display:grid; place-items:center;
 background: rgba(0,0,0,.24);
 border:1px solid rgba(255,255,255,.10);
 box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
 flex:0 0 auto;
 font-size:20px;
}
.dfLbl{
 flex:1;
 text-align:center;
 font-weight:1000;
 letter-spacing:.06em;
 color:#f4d27a;
 text-shadow: 0 2px 0 rgba(0,0,0,.60);
 text-transform: uppercase;
}

#cityBG.bg{ background:#000 !important; }
#cityImg{ width:100% !important; height:100% !important; object-fit:contain !important; }

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 018 ===== */

:root{ --menuW:360px; }
#dfMenu{ background: linear-gradient(180deg, rgba(10,22,30,.98), rgba(6,12,18,.98)) !important; }
body.cityMenuOn #cityScreen,
body.cityMenuOn #staticCityBG{
 margin-left: var(--menuW) !important;
 width: calc(100% - var(--menuW)) !important;
}
body.cityMenuOn #staticCityBG{ left: var(--menuW) !important; right: 0 !important; }
.topTabs{ display:none !important; }

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 019 ===== */

#leftHudMenu{ display:none !important; }

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 020 ===== */

#staticCityBG{ z-index:2 !important; pointer-events:none !important; }
.screen{ z-index:10 !important; }
#cityScreen{ z-index:0 !important; }

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 021 ===== */

#cityOverlay, .cityOverlay{
 background: transparent !important;
 border: none !important;
 box-shadow: none !important;
}

#cityOverlay{ pointer-events: auto !important; }

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 022 ===== */

:root{
 --stagePad: 24px;
 --menuStageW: 320px;
 --cityStageH: calc(100vh - (var(--stagePad) * 2));
 --cityStageW: calc(var(--cityStageH) * 1.5);
 --stageW: calc(var(--menuStageW) + var(--cityStageW));
}

html, body{
 background:#000 !important;
}

body.cityMenuOn #dfMenu{
 position: fixed !important;
 top: var(--stagePad) !important;
 left: calc(50% - (var(--stageW) / 2)) !important;
 width: var(--menuStageW) !important;
 height: var(--cityStageH) !important;
 margin: 0 !important;
 border-radius: 0 !important;
 border: none !important;
 border-right: 1px solid rgba(255,255,255,.08) !important;
 box-shadow: none !important;
 overflow: auto !important;
}

body.cityMenuOn #cityScreen,
body.cityMenuOn #staticCityBG{
 margin-left: 0 !important;
 width: 100% !important;
}

#cityScreen{
 padding-left: 0 !important;
 position: fixed !important;
 inset: 0 !important;
 background: transparent !important;
}

#cityScreen .bgWrap{
 position: fixed !important;
 top: var(--stagePad) !important;
 left: calc(50% - (var(--stageW) / 2) + var(--menuStageW)) !important;
 width: var(--cityStageW) !important;
 height: var(--cityStageH) !important;
 max-width: none !important;
 margin: 0 !important;
 padding: 0 !important;
 background: transparent !important;
 background-image: none !important;
}

#cityScreen .bg,
#cityScreen #cityBG{
 width: 100% !important;
 height: 100% !important;
 margin: 0 !important;
 display: block !important;
 position: relative !important;
 overflow: hidden !important;
 border-radius: 10px !important;
 border: 1px solid rgba(255,255,255,.12) !important;
 box-shadow: 0 0 0 1px rgba(255,255,255,.04), 0 18px 48px rgba(0,0,0,.55) !important;
 background: #000 !important;
}

#cityImg{
 display: block !important;
 width: 100% !important;
 height: 100% !important;
 object-fit: fill !important;
}

#cityOverlay, .cityOverlay{
 inset: 0 !important;
}

#leftHudMenu{
 display: none !important;
}

#cityScreen .hotspot{
 z-index: 60 !important;
}

@media (max-aspect-ratio: 1.9/1){
 :root{
 --stagePad: 14px;
 --menuStageW: 290px;
 --cityStageH: calc(100vh - (var(--stagePad) * 2));
 --cityStageW: calc(var(--cityStageH) * 1.5);
 --stageW: calc(var(--menuStageW) + var(--cityStageW));
 }
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 023 ===== */

#attrScreen .panelBody,
#achScreen .panelBody,
#dealScreen .panelBody,
#statsScreen .panelBody,
#talScreen .panelBody,
#lbScreen .panelBody,
#inventoryScreen.overlayOnCity .invWrap{
 transform: translateX(-78px) !important;
}
#inventoryScreen.overlayOnCity .invWrap{
 margin-left: auto !important;
 margin-right: auto !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 024 ===== */

#talScreen .panelBody{
 transform: translateX(-34px) !important;
 width: min(1120px, calc(100% - 36px)) !important;
 max-width: min(1120px, calc(100% - 36px)) !important;
 margin-left: auto !important;
 margin-right: auto !important;
}
#talentPointsBar.talentPointsBar{
 transform: translateX(-34px) !important;
 width: fit-content !important;
 max-width: calc(100% - 36px) !important;
 margin-left: auto !important;
 margin-right: auto !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 025 ===== */

#inventoryScreen.overlayOnCity .invWrap{
 top:0 !important;
 padding:24px 14px 14px !important;
 box-sizing:border-box !important;
 justify-content:flex-start !important;
 overflow:auto !important;
}
#inventoryScreen.overlayOnCity #equipPanel{
 margin-top:0 !important;
}
#inventoryScreen.overlayOnCity #equipPanel .equipWrap{
 margin-top:14px !important;
}
#inventoryScreen.overlayOnCity #bagPanel{
 margin-top:8px !important;
}

#invTooltip.invTooltip{
 position:fixed !important;
 z-index:999999 !important;
 display:none;
 pointer-events:none !important;
 min-width:240px;
 max-width:360px;
 background:linear-gradient(180deg, rgba(10,8,6,.97), rgba(22,12,8,.95)) !important;
 border:1px solid rgba(255,215,120,.26) !important;
 box-shadow:0 18px 40px rgba(0,0,0,.72), 0 0 18px rgba(255,200,80,.10) !important;
}
#invTooltip .ttTitle{font-weight:900;font-size:14px;margin-bottom:6px;}
#invTooltip .ttSub{color:#bdbdbd;font-size:12px;margin-top:8px;}
#invTooltip .ttStats{line-height:1.38;}
#invTooltip .ttWeaponDamage{
 width:max-content;
 max-width:100%;
 margin:0 0 6px;
 color:#f4e5c0;
 font-size:15px;
 font-weight:900;
 text-shadow:0 1px 2px rgba(0,0,0,.75);
}
#invTooltip .ttWeaponDamage .stat-dmg{
 color:#ffd66b;
 text-shadow:0 0 7px rgba(246,213,106,.22);
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 026 ===== */

#inventoryScreen.overlayOnCity #equipPanel{
 margin-top: 26px !important;
}
#inventoryScreen.overlayOnCity #bagPanel{
 margin-top: 12px !important;
}
#inventoryScreen.overlayOnCity .invWrap{
 padding-top: 14px !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 027 ===== */

#inventoryScreen.overlayOnCity .invWrap{
 padding-top: 52px !important;
 padding-bottom: 18px !important;
 justify-content: flex-start !important;
 align-items: center !important;
}
#inventoryScreen.overlayOnCity #equipPanel{
 margin-top: 0 !important;
}
#inventoryScreen.overlayOnCity #bagPanel{
 margin-top: 6px !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 028 ===== */

#cityOverlay .coBody{
 overflow:auto !important;
 padding: 0 !important;
}
#cityOverlay .invWrap{
 position: relative !important;
 inset: auto !important;
 top: auto !important;
 left: auto !important;
 right: auto !important;
 bottom: auto !important;
 width: 100% !important;
 height: auto !important;
 min-height: 100% !important;
 box-sizing: border-box !important;
 display: flex !important;
 flex-direction: column !important;
 align-items: center !important;
 justify-content: flex-start !important;
 gap: 8px !important;
 padding: 34px 14px 18px !important;
 overflow: visible !important;
 transform: none !important;
}
#cityOverlay #equipPanel{
 margin-top: 18px !important;
}
#cityOverlay #equipPanel .equipWrap{
 margin-top: 10px !important;
}
#cityOverlay #bagPanel{
 margin-top: 8px !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 029 ===== */

#inventoryScreen.asOverlayPanel{
 background: transparent !important;
}
#inventoryScreen.asOverlayPanel .bgWrap{
 padding-top: 18px !important;
 overflow: visible !important;
}
#inventoryScreen.asOverlayPanel .bg{
 overflow: visible !important;
}
#inventoryScreen.asOverlayPanel .invWrap{
 position: relative !important;
 inset: auto !important;
 top: 0 !important;
 left: auto !important;
 right: auto !important;
 bottom: auto !important;
 height: auto !important;
 min-height: 0 !important;
 padding: 28px 10px 18px !important;
 overflow: visible !important;
}
#inventoryScreen.asOverlayPanel #equipPanel{
 margin-top: 22px !important;
}
#inventoryScreen.asOverlayPanel #equipPanel .equipWrap{
 margin-top: 10px !important;
}
#inventoryScreen.asOverlayPanel #bagPanel{
 margin-top: 10px !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 030 ===== */

:root{
 --stageFrameRadius: 10px;
}

body:not(.create-active) #dfMenu{
 display:block !important;
 position: fixed !important;
 top: var(--stagePad) !important;
 left: calc(50% - (var(--stageW) / 2)) !important;
 width: var(--menuStageW) !important;
 height: var(--cityStageH) !important;
 margin: 0 !important;
 overflow: auto !important;
 z-index: 9200 !important;
}

#cityScreen .bgWrap,
#colosseumScreen .bgWrap,
#dungeonScreen .bgWrap,
#shopScreen .bgWrap,
#arenaScreen .bgWrap{
 position: fixed !important;
 top: var(--stagePad) !important;
 left: calc(50% - (var(--stageW) / 2) + var(--menuStageW)) !important;
 width: var(--cityStageW) !important;
 height: var(--cityStageH) !important;
 max-width: none !important;
 margin: 0 !important;
 padding: 0 !important;
 background: transparent !important;
 background-image: none !important;
 overflow: visible !important;
}

#colosseumScreen .bg,
#dungeonScreen .bg,
#shopScreen .bg,
#arenaScreen .bg{
 width: 100% !important;
 height: 100% !important;
 margin: 0 !important;
 display: block !important;
 position: relative !important;
 overflow: hidden !important;
 border-radius: var(--stageFrameRadius) !important;
 border: 1px solid rgba(255,255,255,.12) !important;
 box-shadow: 0 0 0 1px rgba(255,255,255,.04), 0 18px 48px rgba(0,0,0,.55) !important;
 background: #000 !important;
}

#colosseumScreen .bg > img,
#dungeonScreen .bg > img,
#shopScreen .bg > img,
#arenaScreen .bg > img{
 display: block !important;
 width: 100% !important;
 height: 100% !important;
 object-fit: fill !important;
}

#shopScreen .shopTop{
 top: 12px !important;
}
#shopScreen .shopCountdown{
 top: 56px !important;
}
#arenaScreen .escapeBtn{
 top: 14px !important;
}
#arenaScreen .arenaLayer{
 top: 0 !important;
}
#inventoryScreen.overlayOnCity{
 left: calc(50% - (var(--stageW) / 2) + var(--menuStageW)) !important;
 right: auto !important;
 top: var(--stagePad) !important;
 width: var(--cityStageW) !important;
 height: var(--cityStageH) !important;
 bottom: auto !important;
}

#staticCityBG{
 position: fixed !important;
 top: var(--stagePad) !important;
 left: calc(50% - (var(--stageW) / 2) + var(--menuStageW)) !important;
 width: var(--cityStageW) !important;
 height: var(--cityStageH) !important;
 inset: auto !important;
 border-radius: var(--stageFrameRadius) !important;
 overflow: hidden !important;
}

html, body{
 background:#000 !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 031 ===== */

#leftHudMenu, #globalLeftMenu{
 z-index: 12000 !important;
 pointer-events:auto !important;
 isolation:isolate;
}
#leftHudMenu *, #globalLeftMenu *{ pointer-events:auto !important; }
.cityOverlay{ pointer-events:none !important; }
.cityOverlay .coHeader, .cityOverlay .coBody, .cityOverlay .coTabs, .cityOverlay .coClose, .cityOverlay .coTab{ pointer-events:auto !important; }

#legendaryDropFX{
 position:fixed; inset:0; display:none; align-items:center; justify-content:center;
 z-index: 9500; pointer-events:none; overflow:hidden;
 background: radial-gradient(circle at center, rgba(255,210,80,.10), rgba(0,0,0,0) 45%);
}
#legendaryDropFX.show{ display:flex; }
#legendaryDropFX .ldfxBurst{
 position:absolute; width:760px; height:760px; border-radius:50%;
 background:
 radial-gradient(circle, rgba(255,230,150,.42) 0%, rgba(255,188,40,.22) 22%, rgba(255,140,0,.10) 38%, rgba(0,0,0,0) 60%);
 filter: blur(3px);
 animation: ldfxPulse 1.8s ease-out forwards;
}
#legendaryDropFX .ldfxRays{
 position:absolute; width:900px; height:900px; border-radius:50%;
 background: repeating-conic-gradient(from 0deg, rgba(255,220,120,.28) 0deg 7deg, rgba(255,255,255,0) 7deg 18deg);
 mask: radial-gradient(circle, transparent 0 24%, #000 42%, transparent 78%);
 animation: ldfxSpin 7s linear infinite;
 opacity:.9;
}
#legendaryDropFX .ldfxWrap{ position:relative; width:360px; text-align:center; }
#legendaryDropFX .ldfxIcon{
 width:170px; height:170px; object-fit:contain; position:relative; z-index:2;
 filter: drop-shadow(0 0 18px rgba(255,215,80,.85)) drop-shadow(0 0 42px rgba(255,170,0,.45));
 animation: ldfxIcon 1.7s ease-out forwards;
}
#legendaryDropFX .ldfxTitle{
 margin-top:18px; font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:46px; font-weight:1000; letter-spacing:1.2px; color:#ffdd74;
 text-shadow:0 0 18px rgba(255,195,40,.7), 0 10px 30px rgba(0,0,0,.75);
 animation: ldfxText 1.8s ease-out forwards;
}
#legendaryDropFX .ldfxName{
 margin-top:8px; font-size:22px; font-weight:900; color:#fff6d2;
 text-shadow:0 8px 22px rgba(0,0,0,.8), 0 0 16px rgba(255,210,80,.35);
 animation: ldfxText 1.8s ease-out forwards;
}
@keyframes ldfxPulse{ 0%{transform:scale(.35);opacity:0;} 22%{opacity:1;} 100%{transform:scale(1.08);opacity:0;} }
@keyframes ldfxSpin{ from{transform:rotate(-40deg);} to{transform:rotate(360deg);} }
@keyframes ldfxIcon{ 0%{transform:scale(.2) rotate(-18deg); opacity:0;} 25%{transform:scale(1.2) rotate(6deg); opacity:1;} 100%{transform:scale(1) rotate(-40deg); opacity:1;} }
@keyframes ldfxText{ 0%{transform:translateY(34px); opacity:0;} 20%{opacity:1;} 100%{transform:translateY(0); opacity:1;} }

#levelUpModal{
 position:fixed; inset:0; display:none; align-items:center; justify-content:center;
 z-index: 9600; background:rgba(0,0,0,.38); backdrop-filter: blur(6px);
}
#levelUpModal.show{ display:flex; }
#levelUpCard{
 position:relative; width:min(540px, 92vw); padding:28px 24px 24px; text-align:center;
 border-radius:26px;
 background:linear-gradient(180deg, rgba(72,44,12,.95), rgba(22,14,8,.94));
 border:1px solid rgba(255,214,107,.44);
 box-shadow:0 24px 70px rgba(0,0,0,.65), 0 0 28px rgba(255,200,70,.20);
 overflow:hidden;
 animation: levelCardIn .28s ease-out forwards, levelPulse 1.2s ease-in-out infinite 0.28s;
}
#levelUpCard::before{
 content:""; position:absolute; inset:-20%; pointer-events:none;
 background:conic-gradient(from 0deg, rgba(255,220,120,.0), rgba(255,220,120,.24), rgba(255,220,120,.0) 35%, rgba(255,220,120,.18), rgba(255,220,120,.0));
 filter: blur(10px); animation: levelSweep 6s linear infinite;
}
#levelUpTitle{
 position:relative; z-index:1;
 font-family:"Cinzel","Trajan Pro","Georgia",serif; font-size:48px; font-weight:1000; letter-spacing:2px;
 color:#ffdf82; text-shadow:0 0 18px rgba(255,210,80,.55), 0 10px 30px rgba(0,0,0,.8);
}
#levelUpSub{ position:relative; z-index:1; margin-top:10px; font-size:18px; color:#f5ecd0; opacity:.92; }
#levelUpLevel{
 position:relative; z-index:1; margin:16px auto 0; width:150px; height:150px; border-radius:50%;
 display:flex; align-items:center; justify-content:center; flex-direction:column;
 background:radial-gradient(circle, rgba(255,214,107,.24), rgba(0,0,0,.18));
 border:2px solid rgba(255,214,107,.44);
 box-shadow:0 0 26px rgba(255,214,107,.28), inset 0 0 22px rgba(255,214,107,.16);
}
#levelUpLevel b{ font-family:"Cinzel","Trajan Pro","Georgia",serif; font-size:56px; color:#fff6cf; line-height:1; }
#levelUpLevel span{ margin-top:6px; font-size:13px; letter-spacing:1px; color:#ffdf82; font-weight:900; }
#levelUpHint{ position:relative; z-index:1; margin-top:16px; font-size:13px; color:rgba(255,245,210,.78); }
@keyframes levelCardIn{ from{transform:scale(.78); opacity:0;} to{transform:scale(1); opacity:1;} }
@keyframes levelPulse{ 0%,100%{ transform:scale(1);} 50%{ transform:scale(1.03);} }
@keyframes levelSweep{ from{transform:rotate(-40deg);} to{transform:rotate(360deg);} }

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 032 ===== */

body.charselect-active #cityClickBlocker{ display:none !important; }
#cityClickBlocker{
 display:none !important;
 pointer-events:none !important;
 background: transparent !important;
 opacity:0 !important;
}
body.cityMenuOn #globalLeftMenu,
body.cityMenuOn #leftHudMenu{
 isolation:isolate;
 z-index:2147483000 !important;
}
#globalLeftMenu::before,
#globalLeftMenu::after,
#leftHudMenu::before,
#leftHudMenu::after{
 pointer-events:none !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 033 ===== */

#globalLeftMenu,
#leftHudMenu,
#dfMenu,
#dfMenu .dfTop,
#dfMenu .dfBottom{
 background: transparent !important;
 background-color: transparent !important;
 border: 0 !important;
 box-shadow: none !important;
 backdrop-filter: none !important;
}
#globalLeftMenu::before,
#globalLeftMenu::after,
#leftHudMenu::before,
#leftHudMenu::after,
#dfMenu::before,
#dfMenu::after,
#dfMenu .dfTop::before,
#dfMenu .dfTop::after,
#dfMenu .dfBottom::before,
#dfMenu .dfBottom::after{
 content: none !important;
 display: none !important;
 background: none !important;
 box-shadow: none !important;
 border: 0 !important;
}

#globalLeftMenu .lhBtn,
#leftHudMenu .lhBtn{
 background: transparent !important;
 background-color: transparent !important;
 box-shadow: none !important;
 border-color: transparent !important;
 isolation: isolate !important;
}
#globalLeftMenu .lhBtn::before,
#leftHudMenu .lhBtn::before{
 content: none !important;
 display: none !important;
 background: none !important;
 box-shadow: none !important;
 border: 0 !important;
}
#globalLeftMenu .lhBtn::after,
#leftHudMenu .lhBtn::after{
 opacity: 1 !important;
 mix-blend-mode: normal !important;
}

#cityClickBlocker,
#cityOverlayBackdrop{
 pointer-events: none !important;
}
#cityOverlayBackdrop{
 left: 300px !important;
 right: 18px !important;
 top: 96px !important;
 bottom: 18px !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 034 ===== */

#cityOverlayBackdrop,
#cityOverlayBackdropFinal,
body.charselect-active #cityClickBlocker{ display:none !important; }
#cityClickBlocker{
 position: fixed !important;
 left: calc(50% - (var(--stageW) / 2) + var(--menuStageW)) !important;
 top: var(--stagePad) !important;
 width: var(--cityStageW) !important;
 height: var(--cityStageH) !important;
 right: auto !important;
 bottom: auto !important;
 inset: auto !important;
 border-radius: var(--stageFrameRadius) !important;
 pointer-events: none !important;
}
#cityOverlayBackdrop,
#cityOverlayBackdropFinal{
 display: none !important;
 opacity: 0 !important;
}

#dfMenu,
#dfMenu .dfTop,
#dfMenu .dfBottom,
#dfMenu .dfRow,
#dfMenu .dfMeta,
#dfMenu .dfActions,
#leftHudMenu,
#globalLeftMenu{
 background: transparent !important;
 background-color: transparent !important;
 box-shadow: none !important;
 backdrop-filter: none !important;
 border-color: transparent !important;
}
#dfMenu::before,
#dfMenu::after,
#dfMenu .dfTop::before,
#dfMenu .dfTop::after,
#dfMenu .dfBottom::before,
#dfMenu .dfBottom::after,
#dfMenu .dfRow::before,
#dfMenu .dfRow::after,
#leftHudMenu::before,
#leftHudMenu::after,
#globalLeftMenu::before,
#globalLeftMenu::after{
 content: none !important;
 display: none !important;
 background: none !important;
 box-shadow: none !important;
 border: 0 !important;
}

#dfMenu .dfTop{
 padding-left: 0 !important;
 padding-right: 0 !important;
}
#dfMenu .dfBottom{
 padding-left: 0 !important;
 padding-right: 0 !important;
}
#dfMenu .dfRow{
 border: 0 !important;
}

#dfMenu, #leftHudMenu, #globalLeftMenu{
 position: relative !important;
 z-index: 2147483646 !important;
 isolation: isolate !important;
}
#dfMenu *, #leftHudMenu *, #globalLeftMenu *{
 pointer-events: auto !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 035 ===== */

.hudProfile{
 min-width: 214px !important;
 padding: 10px 14px !important;
}
#hud .avatar{
 width: 60px !important;
 height: 60px !important;
}
#hud .left{
 gap: 12px !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 036 ===== */

#createScreen,
#createScreen .bgWrap,
#createScreen .bg,
#createScreen #createPanel,
#createScreen #createPanel *,
#createScreen .panel,
#createScreen .panel *{
 pointer-events: auto !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 037 ===== */


 #city2Screen .guildHotspot{
 position:absolute;
 left:20.8%;
 top:32.4%;
 width:16.5%;
 height:21.5%;
 z-index:60;
 cursor:pointer;
 pointer-events:auto;
 border-radius:18px;
 background:rgba(255,255,255,0);
 }
 #city2Screen .guildHotspot:hover{
 box-shadow: inset 0 0 0 2px rgba(255,220,140,.35), 0 0 22px rgba(255,200,120,.18);
 }

 #guildHallScreen{
 position:fixed;
 inset:0;
 display:none;
 background:#000;
 z-index:999950;
 }
 #guildHallScreen.active{ display:block; }

 #guildHallScreen .guildHallWrap{
 position:absolute;
 left:250px;
 right:0;
 top:var(--hudH);
 bottom:0;
 background:#000;
 overflow:hidden;
 }

 #guildHallScreen .guildHallImg{
 width:100%;
 height:100%;
 object-fit:cover;
 object-position:center center;
 display:block;
 }

 #guildHallScreen .guildHallBack{
 position:absolute;
 left:20px;
 top:20px;
 z-index:5;
 }

 #guildHallScreen, #guildHallScreen *{
 pointer-events:auto;
 }
 #guildHallScreen .guildHallImg{
 pointer-events:none;
 }

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 038 ===== */


 #guildHallScreen{
 position: fixed !important;
 inset: 0 !important;
 background: transparent !important;
 padding-left: 0 !important;
 }

 #guildHallScreen .guildHallWrap{
 position: fixed !important;
 top: var(--stagePad) !important;
 left: calc(50% - (var(--stageW) / 2) + var(--menuStageW)) !important;
 width: var(--cityStageW) !important;
 height: var(--cityStageH) !important;
 max-width: none !important;
 margin: 0 !important;
 padding: 0 !important;
 background: transparent !important;
 overflow: visible !important;
 }

 #guildHallScreen .guildHallFrame{
 width: 100% !important;
 height: 100% !important;
 margin: 0 !important;
 display: block !important;
 position: relative !important;
 overflow: hidden !important;
 border-radius: var(--stageFrameRadius) !important;
 border: 1px solid rgba(255,255,255,.12) !important;
 box-shadow: 0 0 0 1px rgba(255,255,255,.04), 0 18px 48px rgba(0,0,0,.55) !important;
 background: #000 !important;
 }

 #guildHallScreen .guildHallImg{
 display:block !important;
 width:100% !important;
 height:100% !important;
 object-fit: contain !important;
 object-position:center center !important;
 background:#000 !important;
 }

 #guildHallScreen .guildHallBack{
 position:absolute !important;
 left: 14px !important;
 top: 14px !important;
 z-index: 10 !important;
 }

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 039 ===== */

#guildHallScreen .guildBackHotspot{
 position:absolute;
 left:2%;
 top:3%;
 width:10%;
 height:10%;
 z-index:20;
 cursor:pointer;
}
#guildHallScreen .guildChestHotspot{
 position:absolute;
 left:22%;
 top:54%;
 width:18%;
 height:25%;
 cursor:pointer;
 z-index:20;
}
#guildHallScreen .guildBackHotspot:hover,
#guildHallScreen .guildChestHotspot:hover{
 box-shadow: inset 0 0 0 2px rgba(255,220,140,.35), 0 0 20px rgba(255,200,120,.2);
 border-radius:12px;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 040 ===== */

 #guildGatePanel{
 display:none;
 position:absolute;
 left:50%;
 top:50%;
 transform:translate(-50%,-50%);
 width:440px;
 background:
 radial-gradient(circle at 20% 10%, rgba(255,200,120,.10), transparent 60%),
 linear-gradient(180deg, rgba(40,28,18,.96), rgba(22,14,8,.96));
 border:1px solid rgba(220,170,90,.35);
 border-radius:18px;
 padding:22px;
 z-index:100;
 box-shadow:
 0 0 30px rgba(200,150,70,.18),
 0 20px 60px rgba(0,0,0,.75),
 inset 0 0 25px rgba(180,120,60,.12);
 }
 #guildGatePanel h3{
 margin:0 0 12px 0;
 color:#f1d3a1;
 text-shadow:0 0 10px rgba(220,170,90,.35);
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:24px;
 }
 #guildGatePanel .guildHint{
 color:#d8c7a3;
 opacity:.92;
 margin-bottom:12px;
 font-size:13px;
 }
 #guildNameInput{
 width:100%;
 padding:12px 14px;
 border-radius:12px;
 border:1px solid rgba(200,150,80,.28);
 background:rgba(20,12,6,.95);
 color:#ffd27a;
 font-weight:700;
 box-shadow: inset 0 0 12px rgba(0,0,0,.28);
 outline:none;
 }
 #guildNameInput::placeholder{ color:rgba(255,210,122,.55); }
 .guildBtnRow{
 margin-top:14px;
 display:flex;
 gap:10px;
 }
 .guildBtn{
 flex:1;
 padding:11px 16px;
 border-radius:12px;
 border:1px solid rgba(200,150,80,.28);
 background:linear-gradient(180deg, rgba(106,67,23,.96), rgba(59,36,13,.96));
 color:#ffd27a;
 font-weight:900;
 letter-spacing:.2px;
 cursor:pointer;
 box-shadow:0 10px 22px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.08);
 }
 .guildBtn:hover{
 filter:brightness(1.06);
 box-shadow:0 12px 26px rgba(0,0,0,.42), 0 0 18px rgba(255,200,90,.12);
 }
 .guildBtn.secondary{
 background:linear-gradient(180deg, rgba(63,43,26,.95), rgba(36,23,12,.95));
 }

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 041 ===== */

.guildFindPanel{
 margin-top:14px;
 border:1px solid rgba(220,170,90,.28);
 border-radius:16px;
 background:rgba(20,12,6,.78);
 padding:12px;
}
.guildFindTitle{
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-weight:900;
 color:#f1d3a1;
 margin:0 0 10px 0;
}
.guildFindEmpty{
 color:#d8c7a3;
 opacity:.9;
 font-size:13px;
}
.guildFindList{ display:flex; flex-direction:column; gap:10px; }
.guildFindItem{
 display:flex; align-items:center; justify-content:space-between; gap:10px;
 padding:10px 12px; border-radius:12px;
 border:1px solid rgba(200,150,80,.18); background:rgba(70,45,25,.28);
}
.guildFindMeta{ display:flex; flex-direction:column; gap:2px; }
.guildFindMeta b{ color:#ffd27a; }
.guildFindMeta span{ color:#d8c7a3; font-size:12px; }
.lbSection{ margin-top:16px; }
.lbSectionTitle{
 font-family:"Cinzel","Trajan Pro","Georgia",serif; font-weight:1000;
 color:#f1d3a1; font-size:20px; margin:0 0 10px 0;
}
.lbMiniNote{ color:#d8c7a3; opacity:.85; margin-bottom:10px; font-size:12px; }
.lbCard{
 border:1px solid rgba(220,170,90,.18); background:rgba(20,12,6,.55);
 border-radius:16px; overflow:hidden; box-shadow:0 12px 28px rgba(0,0,0,.35);
}
.lbCard + .lbCard{ margin-top:14px; }
.lbCardHeader{
 padding:10px 12px; font-weight:900; color:#ffd27a;
 border-bottom:1px solid rgba(255,255,255,.08);
 background:linear-gradient(180deg, rgba(70,45,25,.55), rgba(36,22,12,.55));
}
.lbTableLocal{ width:100%; border-collapse:collapse; table-layout:fixed; }
.lbTableLocal th, .lbTableLocal td{ padding:10px 8px; border-bottom:1px solid rgba(255,255,255,.06); text-align:center; vertical-align:middle; }
.lbTableLocal th{
 color:#f3e1b5; font-size:12px; text-transform:uppercase; letter-spacing:.04em;
 background:rgba(255,255,255,.03);
}
.lbTableLocal td{ color:#f1f1f1; font-size:13px; }
.lbTableLocal th:nth-child(2), .lbTableLocal td:nth-child(2), .lbTableLocal th:nth-child(5), .lbTableLocal td:nth-child(5){ text-align:center; }
.lbTableLocal .leaderboardNameLink, .lbTableLocal .leaderboardGuildLink{ margin:0 auto; }
.lbTableLocal tr.meRow{ background:rgba(120,200,255,.10); }
.lbTableLocal td.r, .lbTableLocal th.r{ text-align:center; }
.lbTableLocal td.c, .lbTableLocal th.c{ text-align:center; }
.lbMedal{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:999px;font-size:16px;line-height:1;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.10);box-shadow:0 6px 16px rgba(0,0,0,.25);}
.lbMedal.gold{box-shadow:0 0 18px rgba(255,215,90,.25), 0 6px 16px rgba(0,0,0,.25);}
.lbMedal.silver{box-shadow:0 0 18px rgba(220,220,235,.18), 0 6px 16px rgba(0,0,0,.25);}
.lbMedal.bronze{box-shadow:0 0 18px rgba(205,140,90,.18), 0 6px 16px rgba(0,0,0,.25);}
.lbTabs{ display:flex; gap:10px; margin:14px 0 12px; flex-wrap:wrap; }
.lbTabBtn{
 padding:10px 14px; border-radius:12px; border:1px solid rgba(200,150,80,.25);
 background:rgba(70,45,25,.55); color:#f5e4c8; font-weight:1000; cursor:pointer;
}
.lbTabBtn.active{
 background:linear-gradient(180deg, rgba(150,95,40,.9), rgba(110,70,30,.9));
 border-color:rgba(255,200,120,.6); color:#fff6e6; box-shadow:0 0 20px rgba(240,190,100,.25);
}
.lbPane{ display:none; }
.lbPane.active{ display:block; }
.leaderboardNameLink, .leaderboardGuildLink{
 appearance:none; border:none; background:none; padding:0; margin:0; cursor:pointer;
 color:#ffd27a; font-weight:1000; font-size:14px; text-align:center; width:100%; display:inline-flex; align-items:center; justify-content:center;
}
.leaderboardNameLink:hover, .leaderboardGuildLink:hover{ text-decoration:underline; }
.classBadge{ display:inline-flex; align-items:center; gap:6px; }
.classIcon{
 display:inline-flex; align-items:center; justify-content:center;
 width:22px; height:22px; border-radius:999px;
 background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12);
 font-size:12px; line-height:1;
}
.guildStatRow .k, .guildStatRow .v{ font-weight:900; }
.guildStatRow .k.str, .guildStatRow .v.str{ color:var(--cSTR); }
.guildStatRow .k.int, .guildStatRow .v.int{ color:var(--cINT); }
.guildStatRow .k.agi, .guildStatRow .v.agi{ color:var(--cAGI); }
.guildStatRow .k.vit, .guildStatRow .v.vit{ color:var(--cVIT); }
.guildStatRow .k.bless, .guildStatRow .v.bless{ color:var(--cBLESS); }
.guildStatRow .k.dur, .guildStatRow .v.dur{ color:var(--cDUR); }

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 042 ===== */

.guildChestPanelWide{ width: 520px !important; }
.guildChestDivider{
 height:1px;
 background:linear-gradient(90deg, transparent, rgba(220,170,90,.28), transparent);
 margin:14px 0;
}
.guildChestGrid{
 display:grid;
 grid-template-columns: repeat(3, minmax(0,1fr));
 gap:10px;
 margin-top:14px;
}
.guildBonusCard{
 border:1px solid rgba(220,170,90,.22);
 background:rgba(20,12,6,.72);
 border-radius:14px;
 padding:12px;
 box-shadow: inset 0 0 14px rgba(0,0,0,.18);
}
.guildBonusCard b{
 display:block;
 color:#ffd27a;
 margin-bottom:6px;
}
.guildBonusMeta{
 color:#d8c7a3;
 font-size:12px;
 line-height:1.35;
 min-height:50px;
}
.guildBonusValue{
 margin-top:8px;
 font-weight:900;
 color:#fff3c9;
}
.guildBonusCost{
 margin-top:6px;
 font-size:12px;
 color:#f1d3a1;
}
@media (max-width: 900px){
 .guildChestPanelWide{ width:min(92vw, 560px) !important; }
 .guildChestGrid{ grid-template-columns: 1fr; }
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 043 ===== */

#inventoryScreen.overlayOnCity .invWrap,
#inventoryScreen.asOverlayPanel .invWrap{
 display:grid !important;
 grid-template-columns: minmax(620px, 1fr) 230px !important;
 grid-template-areas:
 "equip stats"
 "bag stats" !important;
 justify-content:center !important;
 align-content:start !important;
 align-items:start !important;
 gap:14px 18px !important;
 width:min(900px, calc(100% - 28px)) !important;
 margin:0 auto !important;
 padding:22px 10px 16px !important;
 transform:none !important;
}

#inventoryScreen.overlayOnCity #equipPanel,
#inventoryScreen.asOverlayPanel #equipPanel{ grid-area:equip !important; margin:0 !important; }
#inventoryScreen.overlayOnCity #bagPanel,
#inventoryScreen.asOverlayPanel #bagPanel{ grid-area:bag !important; margin:0 !important; }

#inventoryScreen #invStatsPanel,
#inventoryScreen #equipPanel,
#inventoryScreen #bagPanel{
 background:linear-gradient(180deg, rgba(32,18,10,.92), rgba(18,10,6,.94)) !important;
 border:1px solid rgba(255,214,120,.18) !important;
 border-radius:18px !important;
 box-shadow:0 18px 40px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.05) !important;
}

#inventoryScreen #invStatsPanel{
 grid-area:stats !important;
 display:block !important;
 margin:0 !important;
 padding:18px 22px !important;
 min-height:382px !important;
}
#inventoryScreen #invStatsPanel .invStatsTitle{ display:none !important; }

#inventoryScreen #equipPanel{ padding:16px 18px 10px !important; box-shadow:0 18px 40px rgba(0,0,0,.45) !important; }
#inventoryScreen #bagPanel{ padding:12px 16px 14px !important; }

#inventoryScreen .equipTitleRow h3,
#inventoryScreen #bagPanel .invTitle{ display:none !important; }
#inventoryScreen .equipTitleRow,
#inventoryScreen #bagPanel .invTitleRow{ min-height:0 !important; margin:0 !important; }

#inventoryScreen #equipPanel .equipWrap{ margin-top:0 !important; height:330px !important; }
#inventoryScreen #equipPanel .invAvatar{
 width:190px !important; height:190px !important;
 left:50% !important; top:44% !important;
 transform:translate(-50%,-50%) !important;
}

#inventoryScreen #equipPanel .equipSlot{
 width:56px !important; height:56px !important;
 border-radius:14px !important;
 background:rgba(0,0,0,.18) !important;
 border:1px solid rgba(231,190,96,.72) !important;
 box-shadow: inset 0 0 0 1px rgba(0,0,0,.18) !important;
 overflow:visible !important;
}
#inventoryScreen #equipPanel .equipSlot::after{ display:none !important; }
#inventoryScreen #equipPanel .equipSlot[data-slot="helm"]{left:12% !important; top:16% !important;}
#inventoryScreen #equipPanel .equipSlot[data-slot="armor"]{left:12% !important; top:40% !important;}
#inventoryScreen #equipPanel .equipSlot[data-slot="weapon"]{left:12% !important; top:64% !important;}
#inventoryScreen #equipPanel .equipSlot[data-slot="amulet_future"]{left:38% !important; top:88% !important;}
#inventoryScreen #equipPanel .equipSlot[data-slot="ring_future"]{left:62% !important; top:88% !important;}
#inventoryScreen #equipPanel .equipSlot[data-slot="boots"]{left:88% !important; top:16% !important;}
#inventoryScreen #equipPanel .equipSlot[data-slot="gloves"]{left:88% !important; top:40% !important;}
#inventoryScreen #equipPanel .equipSlot[data-slot="offhand_future"]{left:88% !important; top:64% !important;}

#inventoryScreen #equipPanel .equipSlot[data-slot="helm"]::before{content:"Helma";}
#inventoryScreen #equipPanel .equipSlot[data-slot="armor"]::before{content:"Brnění";}
#inventoryScreen #equipPanel .equipSlot[data-slot="weapon"]::before{content:"Zbraň";}
#inventoryScreen #equipPanel .equipSlot[data-slot="amulet_future"]::before{content:"Amulet";}
#inventoryScreen #equipPanel .equipSlot[data-slot="ring_future"]::before{content:"Prsten";}
#inventoryScreen #equipPanel .equipSlot[data-slot="boots"]::before{content:"Boty";}
#inventoryScreen #equipPanel .equipSlot[data-slot="gloves"]::before{content:"Rukavice";}
#inventoryScreen #equipPanel .equipSlot[data-slot="offhand_future"]::before{content:"Off-hand";}

#inventoryScreen #equipPanel .equipSlot::before{
 position:absolute;
 left:50%;
 top:-18px;
 transform:translateX(-50%);
 font-size:11px;
 font-weight:700;
 color:rgba(233,216,184,.82);
 white-space:nowrap;
 pointer-events:none;
 text-shadow:0 2px 8px rgba(0,0,0,.8);
}
#inventoryScreen .futureEquipSlot{
 opacity:.78;
 border-style:dashed !important;
 border-color:rgba(255,214,120,.24) !important;
 background:rgba(255,255,255,.03) !important;
 pointer-events:none !important;
}

#inventoryScreen #bagPanel{
 display:grid !important;
 grid-template-columns: 1fr 230px !important;
 grid-template-areas:
 "bag ."
 "pager mats" !important;
 align-items:start !important;
 column-gap:18px !important;
 row-gap:14px !important;
}
#inventoryScreen #bagGrid{ grid-area:bag !important; }
#inventoryScreen #bagPanel .invTitleRow{
 grid-area:pager !important;
 justify-content:flex-start !important;
 align-self:start !important;
 padding:0 !important;
}
#inventoryScreen .invPager{ margin:0 !important; }
#inventoryScreen .invPagerBtn{ width:32px !important; height:32px !important; }

#inventoryScreen #materialsPanel{
 grid-area:mats !important;
 display:block !important;
 min-height:140px !important;
 margin:0 !important;
 padding:0 !important;
 background:none !important;
 border:none !important;
 box-shadow:none !important;
 align-self:start !important;
}
#inventoryScreen #materialsPanel::before{
 content:"Materiály";
 display:block;
 margin:2px 0 10px;
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-weight:900;
 color:#f4d79a;
 letter-spacing:.4px;
}
#inventoryScreen .materialsList{ display:flex; flex-direction:column; gap:8px; }
#inventoryScreen .matRow{
 display:flex; align-items:center; justify-content:space-between;
 gap:12px; padding:8px 10px;
 border-radius:12px;
 background:rgba(255,255,255,.04);
 border:1px solid rgba(255,214,120,.12);
 font-size:13px;
}
#inventoryScreen .matRow b{ color:#f8e2a6; font-weight:900; }
#inventoryScreen .matName{ color:#e8dcc1; font-weight:700; }
#inventoryScreen .matRow.future{ opacity:.75; }

#inventoryScreen #bagPanel .detailActions,
#inventoryScreen #bagPanel .invStatsRow,
#inventoryScreen #bagPanel #btnInvBack{ display:none !important; }

#inventoryScreen .bagGrid{grid-template-columns:repeat(5, 54px) !important; gap:8px !important;}
#inventoryScreen .slot{
 width:54px !important; height:54px !important;
 border-radius:12px !important;
 background:rgba(0,0,0,.20) !important;
 border:1px solid rgba(231,190,96,.72) !important;
}

#inventoryScreen #invStatsPanel .statDivider{
 margin:10px 0 !important;
 border-top:1px solid rgba(255,214,120,.16) !important;
}
#inventoryScreen #invStatsPanel .row{
 display:flex !important;
 justify-content:space-between !important;
 gap:18px !important;
 padding:4px 0 !important;
}
#inventoryScreen #invStatsPanel .row b,
#inventoryScreen #invStatsPanel .statVal{
 min-width:34px !important;
 text-align:right !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 044 ===== */

#cityOverlay .coBody:has(.talV2Wrap){ overflow:auto !important; }
#cityOverlay .talV2Wrap{ max-width: 1000px !important; }
@media (max-width: 1200px){
 #cityOverlay .talV2Header{ flex-wrap: wrap; }
 #cityOverlay .talV2Meta{ flex-wrap: wrap; }
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 045 ===== */

#chestModal{ position:fixed; inset:0; display:none; align-items:center; justify-content:center; background:rgba(0,0,0,.72); z-index:9001;}
 #chestBox{ width:min(820px,92vw); padding:18px 18px 16px; border-radius:14px; background:rgba(20,18,14,.92);
 border:1px solid rgba(255,214,106,.22); box-shadow: 0 20px 70px rgba(0,0,0,.55); color:#f4f4f4;
 }
 #chestBox h2{ margin:6px 0 14px; font-size:20px; letter-spacing:.5px; }
 .rollViewport{ position:relative; height:92px; overflow:hidden; border-radius:12px;
 background:rgba(0,0,0,.35); border:1px solid rgba(255,255,255,.10);
 }
 .rollInner{ position:absolute; left:0; top:0; width:100%; }
 .rollItem{ height:76px; margin:8px 10px; border-radius:14px; display:flex; align-items:center; gap:12px;
 padding:10px 14px; background: rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.10);
 }
 .rollItem .riIcon{ width:56px; height:56px; border-radius:12px; background: rgba(0,0,0,.25); display:flex; align-items:center; justify-content:center; }
 .rollItem .riIcon img{ width:52px; height:52px; object-fit:contain; filter: drop-shadow(0 0 10px rgba(0,0,0,.35)); }
 .rollItem .riMeta{ flex:1; text-align:left; }
 .rollItem .riName{ font-weight:900; letter-spacing:.3px; }
 .rollItem .riSub{ opacity:.88; font-size:12px; margin-top:2px; }

 .rollItem.common{ border-color: rgba(82,214,106,.55); box-shadow: 0 0 0 1px rgba(82,214,106,.25), 0 0 18px rgba(82,214,106,.18); }
 .rollItem.epic{ border-color: rgba(178,107,255,.65); box-shadow: 0 0 0 1px rgba(178,107,255,.30), 0 0 22px rgba(178,107,255,.22); }
 .rollItem.legendary{ border-color: rgba(255,214,106,.70); box-shadow: 0 0 0 1px rgba(255,214,106,.30), 0 0 26px rgba(255,214,106,.20); }

 .rollMarker{
 position:absolute; top:0; bottom:0; left:50%; transform:translateX(-50%);
 width:4px; background: linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,214,106,.9), rgba(255,255,255,0));
 opacity:.9;
 pointer-events:none;
 }

 .chestActions{ display:flex; justify-content:space-between; gap:10px; align-items:center; margin-top:14px; }
 .chestActions .leftInfo{ font-size:13px; opacity:.9;}
 .chestActions button{ padding:10px 14px; border-radius:10px; border:1px solid rgba(255,255,255,.14);
 background: rgba(255,255,255,.08); color:#fff; font-weight:900; cursor:pointer;
 }
 .chestActions button:hover{ background: rgba(255,255,255,.12); }

.upgTag{display:inline-block;margin-left:6px;font-weight:1000;color:#ffd36a;text-shadow:0 0 10px rgba(255,205,90,.35);}

.classPickBtn{
 border:0 !important;
 outline:0 !important;
 background:transparent !important;
 box-shadow:none !important;
}

.classPickBtn img{
 display:block;
 width:96px;
 height:96px;
 object-fit:contain;
 cursor:pointer;
 user-select:none;
 pointer-events:none;
 transition: transform .2s ease, filter .2s ease;
 filter: drop-shadow(0 8px 18px rgba(0,0,0,.55));
}

.classPickBtn:hover img{
 transform: translateY(-2px) scale(1.05);
}

.classPickBtn.selected img{
 transform: scale(1.08);
 animation: classPulse 1.8s ease-in-out infinite;
}

.classPickBtn.flash img{
 animation: classFlash .32s ease;
}

@keyframes classFlash{
 0%{
 transform: scale(1.12);
 filter:
 brightness(1.35)
 drop-shadow(0 0 26px rgba(255,255,255,.75))
 drop-shadow(0 10px 22px rgba(0,0,0,.55));
 }
 100%{
 transform: scale(1.08);
 filter: drop-shadow(0 8px 18px rgba(0,0,0,.55));
 }
}

@keyframes classPulse{
 0%,100%{ opacity:1; }
 50%{ opacity:.92; }
}

.classPickBtn.selected.warriorGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 26px rgba(255,70,70,.55));
}

.classPickBtn.selected.archerGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 26px rgba(80,255,140,.50));
}

.classPickBtn.selected.mageGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 28px rgba(130,130,255,.55));
}

.classPickBtn,
.classPickBtn.selected{
 border: none !important;
 outline: none !important;
 background: transparent !important;
 box-shadow: none !important;
}

.classPickBtn::before,
.classPickBtn::after{
 display:none !important;
}

#createClassRow{
 position:absolute !important;
 right:120px !important;
 top:170px !important;
 display:flex !important;
 flex-direction:column !important;
 gap:36px !important;
 align-items:center !important;
}

html, body{ overflow-x:hidden; }

#createClassRow{
 position:absolute !important;
 right:120px !important;
 top:170px !important;
 display:flex !important;
 flex-direction:column !important;
 gap:36px !important;
 align-items:center !important;
}

.classPickBtn img{
 width:150px !important;
 height:150px !important;
}

#classPickerTitle{
 position:static !important;
 right:auto !important;
 top:auto !important;

 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:30px;
 font-weight:900;
 letter-spacing:1px;
 color:#7ad7ff;
 text-align:center;
 margin-bottom:10px;

 text-shadow:
 0 0 14px rgba(90,190,255,.7),
 0 4px 14px rgba(0,0,0,.85);
 pointer-events:none;
}

#classHoverTip{
 position:fixed;
 z-index:999999;
 padding:8px 12px;
 border-radius:10px;
 background:rgba(10,14,22,.88);
 color:#d7f4ff;
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:16px;
 font-weight:800;
 letter-spacing:.5px;
 text-shadow:0 2px 10px rgba(0,0,0,.85);
 box-shadow:
 0 0 18px rgba(90,190,255,.35),
 0 10px 30px rgba(0,0,0,.55);
 opacity:0;
 transform:translateY(6px);
 transition:opacity .12s ease, transform .12s ease;
 pointer-events:none;
 user-select:none;
 white-space:nowrap;
}

#classHoverTip.show{
 opacity:1;
 transform:translateY(0);
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 046 ===== */

body.create-mode #hud{ display:none !important; }
body.create-mode{ --hudH:0px !important; }

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 047 ===== */

#cityScreen .imgButtons, #cityScreen .imgBtn, .imgBtn{ display:none !important; }
 .topTabs, #topTabs, #topTabsRow{ display:none !important; }

 #cityOverlayBackdrop{
 position:fixed; inset:0;
 background: rgba(0,0,0,.45);
 backdrop-filter: blur(6px);
 z-index: 9000;
 display:none;
 }
 #cityOverlayBackdrop.show{ display:block; }

 #cityOverlay{
 position:fixed !important;
 left: var(--overlayLeft, 360px) !important;
 right: 18px !important;
 top: var(--overlayTop, 96px) !important;
 bottom: 18px !important;
 display:none;
 z-index:9001;
 }
 #cityOverlay[aria-hidden="false"]{ display:flex !important; }

 #cityOverlay, #cityOverlay *{ pointer-events:auto; }

 #cityOverlay .coBody{ height:100%; }

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 048 ===== */

.topTabs{ display:none !important; }

 #cityOverlayBackdropFinal{
 position:fixed; inset:0;
 background: rgba(0,0,0,.45);
 z-index: 99980;
 display:none;
 }
 #cityOverlayFinal{
 --overlay-left: 280px;
 position:fixed;
 left: var(--overlay-left);
 right: 18px;
 top: 70px;
 bottom: 40px;
 z-index: 99990;
 display:none;
 align-items:center;
 justify-content:center;
 pointer-events:none;
 }
 #cityOverlayFinal .coPanel{
 pointer-events:auto;
 width:min(1100px, calc(100vw - var(--overlay-left) - 36px));
 max-width: calc(100vw - var(--overlay-left) - 36px);
 max-height: calc(100vh - 110px);
 border-radius: 18px;
 background: rgba(10,14,18,.82);
 border: 1px solid rgba(255,255,255,.10);
 box-shadow: 0 24px 80px rgba(0,0,0,.55);
 overflow:hidden;
 }
 #cityOverlayFinal .coInner{
 max-height: calc(100vh - 110px);
 overflow:auto;
 }
 .asOverlayPanel{
 position: static !important;
 inset: auto !important;
 width: auto !important;
 height: auto !important;
 display:block !important;
 background: transparent !important;
 box-shadow:none !important;
 }
 .asOverlayPanel > .topBar{ display:none !important; }

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 049 ===== */

#cityOverlayFinal .coPanel{
 background: transparent !important;
 border: none !important;
 box-shadow: none !important;
 backdrop-filter: none !important;
 overflow: visible !important;
}
#cityOverlayFinal .coInner{
 height: 100% !important;
}
.asOverlayPanel::before{
 display: none !important;
}
.asOverlayPanel .panelBody,
.asOverlayPanel .bgWrap,
#attrScreen .panelBody,
#achScreen .panelBody,
#dealScreen .panelBody,
#statsScreen .statsWindow,
#talScreen .panelBody,
#leaderboardScreen .panelBody{
 border: 1px solid rgba(255,255,255,.10) !important;
 box-shadow: 0 18px 55px rgba(0,0,0,.65), inset 0 1px 0 rgba(255,255,255,.06) !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 050 ===== */

#talScreen{ background: transparent !important; z-index:10; }
#talScreen::before{
 content:"";
 position:fixed;
 inset:0;
 background: rgba(0,0,0,.35);
 z-index:-1;
 pointer-events:none;
}
#talentPointsBar.talentPointsBar,
#talScreen .panelBody{
 max-width: 1080px;
 margin-left: auto !important;
 margin-right: auto !important;
}
#talentPointsBar.talentPointsBar{
 margin-top: var(--panelTop) !important;
 margin-bottom: 12px !important;
}
#talScreen .panelBody{
 margin-top: 0 !important;
 height: calc(100% - var(--panelTop) - 56px) !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 051 ===== */

#talScreen{
 overflow: visible !important;
}
#talentPointsBar.talentPointsBar{
 width: min(920px, calc(100% - 40px)) !important;
 max-width: min(920px, calc(100% - 40px)) !important;
 margin-left: auto !important;
 margin-right: auto !important;
}
#talScreen .panelBody{
 width: min(960px, calc(100% - 28px)) !important;
 max-width: min(960px, calc(100% - 28px)) !important;
 margin-left: auto !important;
 margin-right: auto !important;
 overflow: visible !important;
 padding-left: 12px !important;
 padding-right: 12px !important;
}
#talScreen .talV2Wrap{
 width: 100% !important;
 max-width: 920px !important;
 margin: 0 auto !important;
 padding: 10px 6px 18px !important;
}
#talScreen .talV2Header{
 flex-wrap: wrap !important;
 align-items: flex-start !important;
}
#talScreen .talV2Meta{
 flex-wrap: wrap !important;
 justify-content: flex-start !important;
 row-gap: 6px !important;
}
#talScreen .talV2Board{
 width: 100% !important;
}
#talScreen .talV2Board.single{
 max-width: 920px !important;
 margin: 0 auto !important;
}
#talScreen .talV2CanvasWrap,
#talScreen .talV2Canvas{
 width: 100% !important;
 max-width: 920px !important;
 margin: 0 auto !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 052 ===== */

#attrScreen .panelBody,
#achScreen .panelBody,
#dealScreen .panelBody,
#statsScreen .statsBody,
#talScreen .panelBody,
#lbScreen .lbPanel{
 background:
 linear-gradient(rgba(0,0,0,.70), rgba(0,0,0,.70)),
 url("img/background.png") center/cover no-repeat !important;
}

#statsScreen .statCard{
 background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(0,0,0,.28)) !important;
}

#lbScreen .lbTableWrap{
 background: rgba(0,0,0,.18) !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 053 ===== */

#dfMenu .dfTop{
 background: linear-gradient(180deg, rgba(86,56,26,.96), rgba(46,28,14,.98)) !important;
 border: 1px solid rgba(207,167,86,.42) !important;
 box-shadow: 0 14px 32px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,235,180,.08), inset 0 0 22px rgba(186,124,52,.18) !important;
}
#dfMenu .dfAvatar{
 background: linear-gradient(180deg, rgba(56,35,17,.95), rgba(30,18,9,.98)) !important;
 border: 1px solid rgba(205,168,90,.45) !important;
 box-shadow: inset 0 0 12px rgba(255,220,140,.08), 0 6px 14px rgba(0,0,0,.28) !important;
}
#dfMenu .dfName b,
#dfMenu .dfLvl,
#dfMenu #dfGold,
#dfMenu #dfGems,
#dfMenu #dfShards,
#dfMenu #dfXpTxt{
 color:#f4deb0 !important;
 text-shadow:0 1px 0 rgba(34,20,10,.82), 0 0 10px rgba(0,0,0,.22) !important;
}
#dfMenu .dfPill{
 background: linear-gradient(180deg, rgba(49,31,16,.92), rgba(28,18,10,.96)) !important;
 border: 1px solid rgba(205,168,90,.34) !important;
 box-shadow: inset 0 1px 0 rgba(255,240,200,.05) !important;
}
#dfMenu .dfXpBar{
 background: rgba(20,12,6,.62) !important;
 border: 1px solid rgba(205,168,90,.24) !important;
}
#dfMenu .dfXpFill{
 background: linear-gradient(90deg, rgba(212,155,68,.98), rgba(246,214,120,.95)) !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 054 ===== */

#cityOverlayBackdropFinal{
 left: 280px !important;
 inset: 0 0 0 280px !important;
}
#cityOverlayFinal{
 --overlay-left: 280px;
}

.shopLayout{
 display:grid !important;
 grid-template-columns: 320px minmax(0, 1fr) !important;
 grid-template-rows: auto 1fr !important;
 grid-template-areas:
 "equip offers"
 "inventory offers" !important;
 gap: 10px !important;
 padding: 14px !important;
 align-items: start !important;
}

.shopLayout > .pane:first-child{
 grid-area: inventory !important;
 min-width: 0 !important;
}

.shopLayout > .shopCenter{
 grid-area: offers !important;
 min-width: 0 !important;
 width: 100% !important;
 align-self: stretch !important;
 justify-content: flex-start !important;
 padding-bottom: 0 !important;
 padding-top: 76px !important;
}

.shopLayout > .pane:last-child{
 grid-area: equip !important;
 min-width: 0 !important;
 align-self: start !important;
}

.shopLayout > .pane:last-child .equipWrap{
 height: 300px !important;
 max-width: 100% !important;
 margin-top: 0 !important;
}
.shopLayout > .pane:last-child .paperMan{
 position: absolute !important;
 left: 50% !important;
 top: 56% !important;
 transform: translate(-50%, -50%) !important;
 width: 170px !important;
 height: 230px !important;
 object-fit: contain !important;
 opacity: .96 !important;
 filter: drop-shadow(0 12px 18px rgba(0,0,0,.55)) !important;
 pointer-events: none !important;
}
.shopLayout > .pane:last-child .equipSlot{
 width: 58px !important;
 height: 58px !important;
 border-radius: 12px !important;
}
.shopLayout > .pane:last-child .invStatsBox{
 margin-top: 4px !important;
 padding: 6px !important;
 font-size: 10px !important;
}

.shopLayout > .pane:first-child{
 display:flex !important;
 flex-direction: column !important;
}
#shopBagGrid{
 grid-template-columns: repeat(4, 1fr) !important;
 gap: 6px !important;
}
#shopBagGrid .slot,
#shopBagGrid .invSlot,
#shopBagGrid > div{
 width: 100% !important;
 aspect-ratio: 1 / 1 !important;
 min-width: 0 !important;
 height: auto !important;
}
.shopLayout > .pane:first-child .detailBox{
 height: 108px !important;
}
.shopLayout > .pane:first-child .detailActions{
 margin-top: 8px !important;
}
.shopLayout > .pane:first-child h3,
.shopLayout > .pane:last-child h3{
 margin-bottom: 8px !important;
}

.shopCenter .offersGrid{
 width: 100% !important;
 max-width: none !important;
 grid-template-columns: repeat(2, minmax(260px, 1fr)) !important;
 gap: 10px !important;
}
.shopCenter .itemCard{
 min-height: 118px !important;
 grid-template-columns: 92px 1fr !important;
 gap: 10px !important;
 padding: 10px !important;
}
.shopCenter .itemIcon{
 width: 92px !important;
 height: 92px !important;
 border-radius: 14px !important;
}
.shopCenter .buyRow{
 margin-top: 8px !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 055 ===== */

#eAvatarBox{
 will-change: transform;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 056 ===== */

#eAvatarBox{ will-change: transform; transform: translateZ(0); }

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 057 ===== */

.hudProfile{
 padding: 12px 16px !important;
 gap: 12px !important;
}
#hud .namebox{
 padding-left: 2px !important;
 padding-right: 4px !important;
}
#hud .namebox b{
 margin-right: 6px !important;
}
#hud .namebox .lvl{
 margin-right: 4px !important;
}
#hud .avatar{
 margin-left: 2px !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 058 ===== */

#hud .hudProfile{
 width:100% !important;
 box-sizing:border-box;
 padding:14px 18px !important;
 display:flex;
 align-items:center;
 justify-content:space-between;
}

#hud .hudProfile .left{
 display:flex;
 align-items:center;
 gap:12px;
}

#hud .hudProfile img,
#hud .hudProfile .avatar{
 margin-left:4px !important;
}

#hud .hudProfile .namebox{
 padding-left:6px !important;
}

#hud .hudProfile .lvl{
 margin-left:8px !important;
 margin-right:6px !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 059 ===== */

#leftHudMenu{width:246px !important;padding:16px 16px 14px !important;box-sizing:border-box !important;}
#leftHudMenu .hudProfile{width:100% !important;min-width:0 !important;padding:14px 16px !important;border-radius:18px !important;display:grid !important;grid-template-columns:58px 1fr auto !important;grid-template-rows:auto auto auto !important;column-gap:12px !important;row-gap:8px !important;align-items:center !important;box-sizing:border-box !important;}
#leftHudMenu .hudProfile .avatar,#leftHudMenu .hudProfile img.avatar,#leftHudMenu .hudProfile > .avatar{grid-column:1 !important;grid-row:1 / span 2 !important;margin:0 !important;width:58px !important;height:58px !important;}
#leftHudMenu .hudProfile .namebox{grid-column:2 !important;grid-row:1 !important;align-self:end !important;padding:0 !important;min-width:0 !important;}
#leftHudMenu .hudProfile .namebox b{margin:0 !important;line-height:1.1 !important;}
#leftHudMenu .hudProfile .lvl{grid-column:3 !important;grid-row:1 !important;align-self:start !important;justify-self:end !important;margin:0 !important;white-space:nowrap !important;padding:3px 10px !important;}
#leftHudMenu .hudProfile .mid,#leftHudMenu .hudProfile .midPill,#leftHudMenu .hudProfile .moneyRow,#leftHudMenu .hudProfile .statsRow{grid-column:2 / 4 !important;grid-row:2 !important;position:static !important;transform:none !important;left:auto !important;top:auto !important;width:100% !important;justify-content:flex-start !important;}
#leftHudMenu .hudProfile .xpHud,#leftHudMenu .hudProfile .xpWrap,#leftHudMenu .hudProfile .xpBox{grid-column:1 / 4 !important;grid-row:3 !important;width:100% !important;min-width:0 !important;margin:0 !important;}
#leftHudMenu .xpFill,#hud .xpFill{transition:width .7s cubic-bezier(.22,.8,.2,1) !important;}
.xpFill.oaiXpPulse{animation:oaiXpPulse .7s ease-out;}
@keyframes oaiXpPulse{0%{box-shadow:0 0 0 rgba(80,180,255,0);filter:brightness(1);}45%{box-shadow:0 0 18px rgba(80,180,255,.75);filter:brightness(1.15);}100%{box-shadow:0 0 12px rgba(80,180,255,.45);filter:brightness(1);}}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 060 ===== */

#leftHudMenu{
 width: 266px !important;
 padding: 16px 18px 16px !important;
}
#leftHudMenu .hudProfile{
 width: 100% !important;
 min-width: 0 !important;
 padding: 16px 18px !important;
 border-radius: 20px !important;
 display: grid !important;
 grid-template-columns: 64px 1fr auto !important;
 grid-template-rows: auto auto auto !important;
 column-gap: 14px !important;
 row-gap: 10px !important;
 align-items: center !important;
}
#leftHudMenu .hudProfile .avatar,
#leftHudMenu .hudProfile > .avatar,
#leftHudMenu .hudProfile .avatar img{
 width: 64px !important;
 height: 64px !important;
 margin: 0 !important;
}
#leftHudMenu .hudProfile .avatar{
 grid-column: 1 !important;
 grid-row: 1 / span 2 !important;
}
#leftHudMenu .hudProfile .namebox{
 grid-column: 2 !important;
 grid-row: 1 !important;
 padding: 0 !important;
 margin: 0 !important;
}
#leftHudMenu .hudProfile .namebox b{
 font-size: 15px !important;
 margin: 0 !important;
}
#leftHudMenu .hudProfile .lvl{
 grid-column: 3 !important;
 grid-row: 1 !important;
 justify-self: end !important;
 margin: 0 !important;
 padding: 4px 10px !important;
}
#leftHudMenu .hudProfile .mid,
#leftHudMenu .hudProfile .midPill,
#leftHudMenu .hudProfile .moneyRow,
#leftHudMenu .hudProfile .statsRow{
 grid-column: 2 / 4 !important;
 grid-row: 2 !important;
 position: static !important;
 transform: none !important;
 left: auto !important;
 top: auto !important;
 width: 100% !important;
 justify-content: flex-start !important;
 gap: 8px !important;
}
#leftHudMenu .hudProfile .xpHud,
#leftHudMenu .hudProfile .xpWrap,
#leftHudMenu .hudProfile .xpBox{
 grid-column: 1 / 4 !important;
 grid-row: 3 !important;
 width: 100% !important;
 margin: 0 !important;
}

.enemyArrowFixed{
 transform-origin: center center !important;
 filter: drop-shadow(0 3px 6px rgba(0,0,0,.55));
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 061 ===== */

#inventoryScreen,
#inventoryScreen .invWrap,
#inventoryScreen .invPanel,
#inventoryScreen .bagGrid,
#inventoryScreen .slot,
#inventoryScreen .equipSlot,
#inventoryScreen .invPagerBtn,
#inventoryScreen button{
 pointer-events:auto !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 062 ===== */


#city2Screen{
 position: fixed !important;
 inset: 0 !important;
 background: transparent !important;
 padding-left: 0 !important;
}

#city2Screen .bgWrap{
 position: fixed !important;
 top: var(--stagePad) !important;
 left: calc(50% - (var(--stageW) / 2) + var(--menuStageW)) !important;
 width: var(--cityStageW) !important;
 height: var(--cityStageH) !important;
 max-width: none !important;
 margin: 0 !important;
 padding: 0 !important;
 background: transparent !important;
 background-image: none !important;
 overflow: visible !important;
}

#city2Screen .bg,
#city2Screen #city2BG{
 width: 100% !important;
 height: 100% !important;
 margin: 0 !important;
 display: block !important;
 position: relative !important;
 overflow: hidden !important;
 border-radius: var(--stageFrameRadius) !important;
 border: 1px solid rgba(255,255,255,.12) !important;
 box-shadow: 0 0 0 1px rgba(255,255,255,.04), 0 18px 48px rgba(0,0,0,.55) !important;
 background: #000 !important;
}

#city2Screen .bg > img,
#city2Screen #city2Img{
 display: block !important;
 width: 100% !important;
 height: 100% !important;
 object-fit: contain !important;
 object-position: center center !important;
}

#city2Screen .city2BackArrow{
 left: 6.2% !important;
 top: 47.2% !important;
 width: 5.8% !important;
 height: 8.4% !important;
 z-index: 8 !important;
}
#city2Screen .city2BackArrow .travelGlyph{
 transform: rotate(-90deg) !important;
}

#city3Screen{
 position: fixed !important;
 inset: 0 !important;
 background: transparent !important;
 padding-left: 0 !important;
}
#city3Screen .bgWrap{
 position: fixed !important;
 top: var(--stagePad) !important;
 left: calc(50% - (var(--stageW) / 2) + var(--menuStageW)) !important;
 width: var(--cityStageW) !important;
 height: var(--cityStageH) !important;
 max-width: none !important;
 margin: 0 !important;
 padding: 0 !important;
 background: transparent !important;
 background-image: none !important;
 overflow: visible !important;
}
#city3Screen .bg,
#city3Screen #city3BG{
 width: 100% !important;
 height: 100% !important;
 margin: 0 !important;
 display: block !important;
 position: relative !important;
 overflow: hidden !important;
 border-radius: var(--stageFrameRadius) !important;
 border: 1px solid rgba(255,255,255,.12) !important;
 box-shadow: 0 0 0 1px rgba(255,255,255,.04), 0 18px 48px rgba(0,0,0,.55) !important;
 background: #000 !important;
}
#city3Screen .bg > img,
#city3Screen #city3Img{
 display: block !important;
 width: 100% !important;
 height: 100% !important;
 object-fit: contain !important;
 object-position: center center !important;
}
#city3Screen .city3BackArrow{
 left: 46.9% !important;
 top: 84.2% !important;
 width: 6.0% !important;
 height: 8.5% !important;
 z-index: 8 !important;
}
.cityTravelArrowUp .travelGlyph{
 transform: translateY(-1px) !important;
}
#mapFadeOverlay{
 position: fixed;
 inset: 0;
 pointer-events: none;
 z-index: 250000;
 opacity: 0;
 transition: opacity .22s ease;
 background:
 radial-gradient(circle at 50% 50%, rgba(255,210,120,.08), rgba(0,0,0,.0) 30%),
 rgba(0,0,0,.92);
}
#mapFadeOverlay.show{
 opacity: 1;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 063 ===== */

.regionBtnRow{
 justify-content:center !important;
 align-items:center !important;
}
.cityTravelArrowUp{
 left:47.0% !important;
 top:2.0% !important;
 width:6.0% !important;
 height:8.2% !important;
}
.cityTravelArrowUp .travelGlyph{
 transform: rotate(-90deg) !important;
}
#city3Screen .city3BackArrow,
#mob2Screen .mob2BackArrow{
 left:46.8% !important;
 top:89.4% !important;
 width:6.0% !important;
 height:8.4% !important;
}
#city3Screen .city3BackArrow .travelGlyph,
#mob2Screen .mob2BackArrow .travelGlyph{
 transform: rotate(90deg) !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 064 ===== */

#createScreen #createPanel .panel{
 width:min(980px,94vw) !important;
 max-width:980px !important;
 min-height:520px !important;
 grid-template-columns: 1.05fr 0.95fr !important;
 gap:24px !important;
 padding:22px !important;
 align-items:stretch !important;
}
#createScreen .oaiCreateLeft, #createScreen .oaiCreateRight{min-width:0;}
#createScreen .oaiCreateLeft{display:flex; flex-direction:column; gap:14px;}
#createScreen .oaiCreateRight{display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px;}
#createScreen .oaiLabel{font-size:12px;color:var(--muted);margin-bottom:6px;display:block;}
#createScreen .oaiAvatarCard{
 border:1px solid rgba(255,255,255,.10);
 background:rgba(255,255,255,.04);
 border-radius:18px;
 padding:14px;
 display:flex;
 flex-direction:column;
 gap:12px;
}
#createScreen .oaiAvatarPreview{
 width:240px;
 height:240px;
 margin:0 auto;
 border-radius:18px;
 border:1px solid rgba(255,255,255,.14);
 background:rgba(0,0,0,.28);
 display:flex;
 align-items:center;
 justify-content:center;
 overflow:hidden;
 box-shadow:0 14px 30px rgba(0,0,0,.35);
}
#createScreen #createAvatarMain{
 width:100% !important;
 height:100% !important;
 object-fit:contain !important;
 object-position:center center !important;
 display:block !important;
}
#createScreen #btnPickAvatar{
 width:100%;
}
#createScreen .oaiClassTitle{
 text-align:center;
 font-size:20px;
 font-weight:1000;
 letter-spacing:.8px;
 color:#78c8ff;
 text-shadow:0 0 14px rgba(120,200,255,.45);
 margin-bottom:8px;
}
#createScreen #createClassRow{
 display:flex !important;
 flex-direction:column !important;
 align-items:center !important;
 justify-content:center !important;
 gap:18px !important;
 width:auto !important;
 margin:0 auto !important;
}
#createScreen #createClassRow .classPickBtn{
 width:90px !important;
 height:90px !important;
 border-radius:18px !important;
 display:flex !important;
 align-items:center !important;
 justify-content:center !important;
 background:rgba(255,255,255,.04) !important;
 border:1px solid rgba(255,255,255,.10) !important;
}
#createScreen #createClassRow .classPickBtn img{
 width:76px !important;
 height:76px !important;
 object-fit:contain !important;
}
#createScreen #createClassRow .classPickBtn.selected,
#createScreen #createClassRow .classPickBtn.active{
 box-shadow:0 0 0 2px rgba(120,200,255,.35), 0 0 24px rgba(120,200,255,.24) !important;
 border-color:rgba(120,200,255,.45) !important;
}
#avatarPickerModal{
 position:fixed;
 inset:0;
 background:rgba(0,0,0,.68);
 z-index:95000;
 display:none;
 align-items:center;
 justify-content:center;
 backdrop-filter:blur(8px);
}
#avatarPickerModal.show{display:flex;}
#avatarPickerCard{
 width:min(760px,92vw);
 background:linear-gradient(180deg, rgba(25,18,12,.96), rgba(10,10,10,.96));
 border:1px solid rgba(255,255,255,.12);
 border-radius:20px;
 box-shadow:0 24px 70px rgba(0,0,0,.65);
 padding:18px;
}
#avatarPickerHead{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;}
#avatarPickerTitle{font-size:22px;font-weight:1000;color:#fff;}
#avatarPickerClose{width:42px;height:42px;border-radius:14px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.06);color:#fff;cursor:pointer;}
#avatarPickerGrid{
 display:grid;
 grid-template-columns:repeat(5, minmax(0,1fr));
 gap:12px;
}
.avatarModalPick{
 aspect-ratio:1/1;
 width:100%;
 border-radius:16px;
 border:1px solid rgba(255,255,255,.12);
 background:rgba(255,255,255,.05);
 overflow:hidden;
 cursor:pointer;
 box-shadow:0 10px 22px rgba(0,0,0,.28);
}
.avatarModalPick:hover{transform:translateY(-1px);filter:brightness(1.05);}
.avatarModalPick.selected{outline:3px solid rgba(255,214,106,.95);box-shadow:0 0 0 4px rgba(255,214,106,.18),0 12px 24px rgba(0,0,0,.35);}
.avatarModalPick img{width:100%;height:100%;display:block;object-fit:cover;}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 065 ===== */

#guildChestPanel{
 position:fixed;
 left:50%;
 top:50%;
 transform:translate(-50%,-50%);
 width:420px;
 background:linear-gradient(180deg,#2a1b0f,#1a1109);
 border:1px solid rgba(255,255,255,.15);
 border-radius:14px;
 box-shadow:0 20px 60px rgba(0,0,0,.6);
 padding:20px;
 z-index:500100;
 display:none;
 pointer-events:auto;
}
#guildChestPanel h3{
 margin-top:0;
}
#guildChestPanel .row{
 display:flex;
 justify-content:space-between;
 margin-top:10px;
}
#guildChestPanel button{
 margin-top:12px;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 066 ===== */

 #guildHallScreen .guildHallFrame{
 position: relative !important;
 }
 #guildHallScreen #guildHallContent,
 #guildHallScreen #guildGatePanel,
 #guildHallScreen #guildBoardPanel,
 #guildHallScreen #guildMemberDetailPanel{
 position: absolute;
 }
 #guildHallScreen #guildHallContent{
 inset: 0;
 z-index: 30;
 pointer-events: none;
 }
 #guildHallScreen #guildHallContent > *{
 pointer-events: auto;
 }
 #guildHallScreen #guildGatePanel{
 z-index: 80;
 }
 #guildHallScreen #guildBoardPanel,
 #guildHallScreen #guildMemberDetailPanel{
 z-index: 90;
 }

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 067 ===== */

#guildHallScreen .guildChestHotspot{
 position:absolute; left:15%; top:53%; width:17%; height:25%;
 z-index:20; border-radius:16px; background:rgba(255,255,255,0);
}
#guildHallScreen .guildBoardHotspot{
 position:absolute; left:77%; top:22%; width:19%; height:56%;
 z-index:20; border-radius:16px; background:rgba(255,255,255,0);
}
#guildHallScreen .guildBackHotspot:hover,
#guildHallScreen .guildChestHotspot:hover,
#guildHallScreen .guildBoardHotspot:hover{
 box-shadow: inset 0 0 0 2px rgba(255,220,140,.35), 0 0 20px rgba(255,200,120,.18);
}
#guildBoardPanel, #guildMemberDetailPanel, #guildGuildDetailPanel{
 position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
 background:
 radial-gradient(circle at 20% 10%, rgba(255,200,120,.10), transparent 60%),
 linear-gradient(180deg, rgba(40,28,18,.97), rgba(22,14,8,.97));
 border:1px solid rgba(220,170,90,.35);
 border-radius:18px;
 box-shadow: 0 0 30px rgba(200,150,70,.18), 0 20px 60px rgba(0,0,0,.75), inset 0 0 25px rgba(180,120,60,.12);
 padding:18px;
 z-index:120;
 display:none;
}
#guildBoardPanel{ width:min(880px, 92vw); height:min(620px, 82vh); }
#guildMemberDetailPanel{ position:fixed; width:min(900px, 94vw); height:min(650px, 84vh); overflow:auto; z-index:200200; }
#guildGuildDetailPanel{ position:fixed; width:min(900px, 94vw); height:min(700px, 86vh); overflow:auto; z-index:200150; }

.guildPanelHead{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:12px; }
.guildPanelTitle{
 font-family:"Cinzel","Trajan Pro","Georgia",serif; font-weight:1000; font-size:24px;
 color:#f1d3a1; text-shadow:0 0 10px rgba(220,170,90,.35);
}
.guildCloseBtn{ min-width:44px; min-height:40px; }
.guildBoardTabs{ display:flex; gap:10px; margin-bottom:12px; }
.guildBoardTab{
 padding:10px 14px; border-radius:12px; border:1px solid rgba(200,150,80,.25);
 background:rgba(70,45,25,.55); color:#f5e4c8; font-weight:1000; cursor:pointer;
}
.guildBoardTab.active{
 background:linear-gradient(180deg, rgba(150,95,40,.9), rgba(110,70,30,.9));
 border-color:rgba(255,200,120,.6); color:#fff6e6; box-shadow:0 0 20px rgba(240,190,100,.25);
}
.guildBoardBody{ height:calc(100% - 96px); overflow:auto; }
.guildLogList{ display:flex; flex-direction:column; gap:10px; }
.guildLogCard{
 padding:10px 12px;
 border-radius:12px;
 border:1px solid rgba(255,255,255,.10);
 background:linear-gradient(180deg, rgba(55,36,18,.90), rgba(28,18,10,.92));
 color:#f1e4c7;
 line-height:1.35;
 font-size:14px;
 box-shadow:0 8px 20px rgba(0,0,0,.25);
}
.guildLogCard .time{
 color:#ffd67a;
 font-weight:1000;
 margin-right:6px;
}

.guildBoardSectionNote{ color:#d8c7a3; font-size:13px; opacity:.92; margin-bottom:12px; }
.guildRowList{ display:flex; flex-direction:column; gap:10px; }
.guildRowCard{
 display:grid; grid-template-columns: 1fr auto; gap:12px; align-items:center;
 padding:12px 14px; border-radius:14px; border:1px solid rgba(220,170,90,.18);
 background:rgba(20,12,6,.60);
}
.guildRowMain{ display:flex; flex-direction:column; gap:4px; }
.guildRowTitle{ font-weight:1000; color:#ffd27a; }
.guildRowMeta{ color:#d8c7a3; font-size:12px; }
.guildRowActions{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.guildMiniBtn{
 padding:8px 12px; border-radius:10px; border:1px solid rgba(200,150,80,.25);
 background:rgba(70,45,25,.55); color:#f5e4c8; font-weight:900; cursor:pointer;
}
.guildMiniBtn:hover{ filter:brightness(1.06); }
.guildMiniBtn.accept{
 background:linear-gradient(180deg, rgba(70,140,80,.9), rgba(35,85,40,.9));
 border-color:rgba(120,220,140,.38);
}
.guildMiniBtn.danger{
 background:linear-gradient(180deg, rgba(150,70,60,.9), rgba(95,35,30,.9));
 border-color:rgba(255,140,120,.30);
}
.guildEmptyState{
 padding:18px; border-radius:14px; border:1px dashed rgba(220,170,90,.22);
 color:#d8c7a3; background:rgba(20,12,6,.35);
}
.guildInspectMeta{ color:#d8c7a3; font-size:13px; margin-bottom:10px; }
.guildInspectLayout{
 display:grid; grid-template-columns: 420px 1fr; gap:14px;
}
.guildInventoryLike{
 border:1px solid rgba(220,170,90,.18);
 background:rgba(20,12,6,.60);
 border-radius:16px; padding:14px; position:relative; min-height:500px;
}
.guildInspectAvatar{
 position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
 width:220px; height:220px; object-fit:contain; pointer-events:none;
 filter: drop-shadow(0 18px 22px rgba(0,0,0,.55));
}
.guildEqSlot{
 position:absolute; width:66px; height:66px; border-radius:12px;
 background:rgba(0,0,0,.35); border:1px solid rgba(255,255,255,.16);
 display:grid; place-items:center; overflow:hidden;
}
.guildEqSlot img{ width:100%; height:100%; object-fit:contain; }
.guildEqSlot.slot-common{
 border-color:rgba(82,214,106,.55);
 box-shadow:0 0 0 1px rgba(82,214,106,.22), 0 0 16px rgba(82,214,106,.18);
}
.guildEqSlot.slot-epic{
 border-color:rgba(184,107,255,.65);
 box-shadow:0 0 0 1px rgba(184,107,255,.30), 0 0 18px rgba(184,107,255,.28);
}
.guildEqSlot.slot-legendary{
 border-color:rgba(255,204,67,.70);
 box-shadow:0 0 0 1px rgba(255,204,67,.28), 0 0 18px rgba(255,204,67,.26);
}
.guildEqSlot.slot-plus5{
 animation: forgePulse 1.8s infinite ease-in-out;
}
.guildEqLabel{position:absolute;left:6px;right:6px;bottom:6px;font-size:11px;line-height:1.1;color:#f3e7cf;text-shadow:0 2px 6px rgba(0,0,0,.8);text-align:center;pointer-events:none;}
.guildEqEmpty{ opacity:.35; font-size:11px; text-align:center; color:#d8c7a3; }
.guildStatsPanel{
 border:1px solid rgba(220,170,90,.18);
 background:rgba(20,12,6,.60);
 border-radius:16px; padding:14px;
}
.guildStatsPanel h4{ margin:0 0 10px 0; color:#ffd27a; }
.guildStatRow{
 display:flex; justify-content:space-between; gap:12px;
 padding:5px 0; color:#f2eadc; font-size:13px;
}

.guildDescCard, .guildPreviewCard{
 border:1px solid rgba(220,170,90,.18);
 background:rgba(20,12,6,.60);
 border-radius:16px;
 padding:14px;
 margin-bottom:14px;
}
.guildDescHead{
 display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:10px; flex-wrap:wrap;
}
.guildDescTitle{ color:#ffd27a; font-weight:1000; font-size:18px; }
.guildDescText{ color:#f2eadc; font-size:13px; line-height:1.55; white-space:pre-wrap; }
.guildDescMuted{ color:#d8c7a3; font-size:12px; opacity:.82; }
.guildDescTextarea{
 width:100%; min-height:120px; resize:vertical;
 border-radius:12px; padding:12px;
 border:1px solid rgba(220,170,90,.22);
 background:rgba(0,0,0,.28); color:#f2eadc;
 font:inherit;
}
.guildDescActions{ display:flex; justify-content:flex-end; gap:10px; margin-top:10px; }
.guildEmblemBox{
 width:96px; height:96px; border-radius:18px; flex:0 0 96px;
 display:flex; align-items:center; justify-content:center;
 background:linear-gradient(180deg, rgba(85,52,26,.88), rgba(34,20,10,.88));
 border:1px solid rgba(220,170,90,.32);
 box-shadow: inset 0 0 18px rgba(255,220,160,.08), 0 8px 20px rgba(0,0,0,.35);
 color:#f3d39f; font-size:26px; font-weight:1000; text-align:center; padding:8px;
}
.guildPreviewTop{ display:flex; gap:14px; align-items:flex-start; margin-bottom:14px; }
.guildPreviewMain{ flex:1; min-width:0; }
.guildPreviewTitle{ color:#ffd27a; font-weight:1000; font-size:24px; margin-bottom:6px; }
.guildPreviewMeta{ color:#d8c7a3; font-size:13px; line-height:1.45; }
.guildNameLink{
 appearance:none; border:none; background:none; padding:0; margin:0; cursor:pointer;
 color:#ffd27a; font-weight:1000; font-size:16px; text-align:left;
}
.guildNameLink:hover{ text-decoration:underline; }
.guildMemberMiniList{ display:flex; flex-direction:column; gap:10px; }

@media (max-width: 900px){
 .guildInspectLayout{ grid-template-columns:1fr; }
 #guildMemberDetailPanel{ height:min(720px, 88vh); }
 #guildGuildDetailPanel{ height:min(760px, 90vh); }
 .guildPreviewTop{ flex-direction:column; }
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 068 ===== */

 #guildMemberDetailPanel,
 #guildGuildDetailPanel{
 position:fixed !important;
 left:50% !important;
 top:50% !important;
 transform:translate(-50%,-50%) !important;
 }
 #guildMemberDetailPanel{ z-index: 300100 !important; }
 #guildGuildDetailPanel{ z-index: 300050 !important; }

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 069 ===== */

#inventoryScreen::before{display:none !important;}
#inventoryScreen,
#inventoryScreen.asOverlayPanel,
#inventoryScreen.overlayOnCity{
 background:transparent !important;
 box-shadow:none !important;
}
#inventoryScreen .bgWrap,
#inventoryScreen.asOverlayPanel .bgWrap,
#inventoryScreen.overlayOnCity .bgWrap,
#inventoryScreen .bg,
#inventoryScreen.asOverlayPanel .bg,
#inventoryScreen.overlayOnCity .bg{
 background:none !important;
 border:none !important;
 box-shadow:none !important;
 border-radius:0 !important;
 overflow:visible !important;
 max-width:none !important;
}
#inventoryScreen .invWrap,
#inventoryScreen.asOverlayPanel .invWrap,
#inventoryScreen.overlayOnCity .invWrap{
 position:relative !important;
 top:14px !important;
 width:760px !important;
 min-height:640px !important;
 margin:0 auto !important;
 padding:18px !important;
 display:block !important;
 overflow:visible !important;
 background:linear-gradient(rgba(24,14,8,.86), rgba(24,14,8,.86)), url("img/background.png") center/cover no-repeat !important;
 border:1px solid rgba(222,178,91,.78) !important;
 border-radius:26px !important;
 box-shadow:0 18px 44px rgba(0,0,0,.52) !important;
}
#inventoryScreen .invPanel{
 background:transparent !important;
 border:none !important;
 box-shadow:none !important;
 backdrop-filter:none !important;
 padding:0 !important;
}
#inventoryScreen #equipPanel{
 position:absolute !important;
 left:18px !important;
 top:18px !important;
 width:470px !important;
 height:380px !important;
}
#inventoryScreen #invStatsPanel{
 position:absolute !important;
 left:515px !important;
 top:22px !important;
 width:205px !important;
 min-height:320px !important;
}
#inventoryScreen #bagPanel{
 position:absolute !important;
 left:18px !important;
 top:430px !important;
 width:705px !important;
 min-height:150px !important;
}
#inventoryScreen #bagPanel::before,
#inventoryScreen #invStatsPanel::before{
 content:"";
 position:absolute;
 inset:0;
 border-radius:18px;
 border:1px solid rgba(222,178,91,.28);
 pointer-events:none;
}
#inventoryScreen #equipPanel .equipTitleRow,
#inventoryScreen #bagPanel .invTitleRow,
#inventoryScreen #invStatsPanel .invStatsTitleRow{margin-bottom:10px !important;}
#inventoryScreen .invTitle,
#inventoryScreen #invStatsPanel .invStatsTitle{
 margin:0 !important;
 font-family:"Cinzel","Trajan Pro","Georgia",serif !important;
 font-size:18px !important;
 color:#f3dfb0 !important;
 letter-spacing:.4px;
}
#inventoryScreen #equipPanel .equipWrap{
 position:relative !important;
 width:100% !important;
 height:328px !important;
 max-width:none !important;
 margin:0 !important;
}
#inventoryScreen #equipPanel .invAvatar{
 width:190px !important;
 height:190px !important;
 left:50% !important;
 top:54% !important;
 transform:translate(-50%,-50%) !important;
}
#inventoryScreen #equipPanel .equipSlot{
 width:56px !important;
 height:56px !important;
 border-radius:14px !important;
 background:rgba(0,0,0,.18) !important;
 border:1px solid rgba(231,190,96,.72) !important;
 box-shadow: inset 0 0 0 1px rgba(0,0,0,.18) !important;
}

#inventoryScreen #bagPanel .detailActions,
#inventoryScreen #bagPanel .invStatsRow,
#inventoryScreen #bagPanel .btn#btnInvBack{display:none !important;}
#inventoryScreen #invStatsPanel .statGroup{padding:0 !important;}
#inventoryScreen #invStatsPanel .statDivider{
 height:1px;
 margin:12px 0 12px;
 background:linear-gradient(90deg, rgba(222,178,91,.08), rgba(222,178,91,.52), rgba(222,178,91,.08));
}
#inventoryScreen #invStatsPanel .row{
 display:flex;
 justify-content:space-between;
 align-items:center;
 gap:12px;
 padding:5px 0 !important;
 border:none !important;
 background:none !important;
}
#inventoryScreen #invStatsPanel .row b,
#inventoryScreen #invStatsPanel .row .statVal{color:#fff !important;}
#inventoryScreen #invStatsPanel .row .statKey.str{color:var(--cSTR) !important;}
#inventoryScreen #invStatsPanel .row .statKey.int{color:var(--cINT) !important;}
#inventoryScreen #invStatsPanel .row .statKey.agi{color:var(--cAGI) !important;}
#inventoryScreen #invStatsPanel .row .statKey.vit{color:var(--cVIT) !important;}
#inventoryScreen #invStatsPanel .row .statKey.bless{color:var(--cBLESS) !important;}
#inventoryScreen #invStatsPanel .row .statKey.dur{color:var(--cDUR) !important;}
#inventoryScreen #invStatsPanel .attrDivider{display:none !important;}
#inventoryScreen.overlayOnCity{
 position:absolute !important;
 left:258px !important;
 right:18px !important;
 top:var(--panelTop) !important;
 bottom:18px !important;
 display:block !important;
 pointer-events:auto !important;
}
#inventoryScreen.overlayOnCity .invWrap{top:0 !important;}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 070 ===== */

#inventoryScreen #invStatsPanel .invStatsTitle,
#inventoryScreen #invStatsPanel .invStatsTitleRow{display:none !important;}

#inventoryScreen #equipPanel,
#inventoryScreen #invStatsPanel,
#inventoryScreen #bagPanel{
 box-shadow: 0 18px 40px rgba(0,0,0,.45) !important;
}

#inventoryScreen #equipPanel .invAvatar{
 top: 41% !important;
}

#inventoryScreen #bagPanel{
 position:absolute !important;
 left:18px !important;
 top:430px !important;
 width:705px !important;
 min-height:220px !important;
 display:block !important;
}

#inventoryScreen #bagGrid{
 position:absolute !important;
 left:12px !important;
 top:12px !important;
}

#inventoryScreen #bagPanel .invTitleRow{
 position:absolute !important;
 left:12px !important;
 top:172px !important;
 margin:0 !important;
 padding:0 !important;
 z-index:3 !important;
}

#inventoryScreen #materialsPanel{
 position:absolute !important;
 left:380px !important;
 top:170px !important;
 width:290px !important;
 margin:0 !important;
 padding:0 !important;
 background:none !important;
 border:none !important;
 box-shadow:none !important;
}

#inventoryScreen #materialsPanel::before{
 content:"Materiály";
 display:block;
 margin:0 0 8px;
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-weight:900;
 color:#f4d79a;
 letter-spacing:.4px;
}

#inventoryScreen #materialsPanel .materialsList{
 display:flex !important;
 flex-direction:column !important;
 gap:8px !important;
}

#inventoryScreen #materialsPanel .matRow{
 display:flex !important;
 align-items:center !important;
 justify-content:space-between !important;
 gap:10px !important;
 padding:8px 10px !important;
 border-radius:12px !important;
 background:rgba(255,255,255,.04) !important;
 border:1px solid rgba(255,214,120,.12) !important;
 font-size:13px !important;
}

#inventoryScreen #equipPanel .equipSpecLine{display:none !important;}
#inventoryScreen #equipPanel{box-shadow:none !important;}
#inventoryScreen #equipPanel::before,
#inventoryScreen #equipPanel::after{box-shadow:none !important;filter:none !important;}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 071 ===== */


#inventoryScreen .invWrap,
#inventoryScreen.asOverlayPanel .invWrap,
#inventoryScreen.overlayOnCity .invWrap{
 width: 920px !important;
 min-height: 760px !important;
 padding: 18px !important;
}

#inventoryScreen #equipPanel{
 left: 18px !important;
 top: 18px !important;
 width: 560px !important;
 height: 400px !important;
}

#inventoryScreen #equipPanel .equipWrap{
 height: 350px !important;
}

#inventoryScreen #equipPanel .invAvatar{
 width: 210px !important;
 height: 210px !important;
 top: 46% !important;
}

#inventoryScreen #invStatsPanel{
 left: 610px !important;
 top: 22px !important;
 width: 250px !important;
 min-height: 300px !important;
}

#inventoryScreen #materialsPanel{
 position: absolute !important;
 left: 610px !important;
 top: 470px !important;
 width: 250px !important;
 min-height: 150px !important;
 margin: 0 !important;
 padding: 0 !important;
 background: none !important;
 border: none !important;
 box-shadow: none !important;
 display: block !important;
 z-index: 4 !important;
}

#inventoryScreen #materialsPanel::before{
 content: "Materiály" !important;
 display: block !important;
 margin: 0 0 10px 0 !important;
 font-family: "Cinzel","Trajan Pro","Georgia",serif !important;
 font-weight: 900 !important;
 color: #f4d79a !important;
 letter-spacing: .4px !important;
}

#inventoryScreen #materialsPanel .materialsList{
 display: flex !important;
 flex-direction: column !important;
 gap: 8px !important;
}

#inventoryScreen #materialsPanel .matRow{
 display: flex !important;
 align-items: center !important;
 justify-content: space-between !important;
 gap: 12px !important;
 padding: 8px 10px !important;
 border-radius: 12px !important;
 background: rgba(255,255,255,.04) !important;
 border: 1px solid rgba(255,214,120,.12) !important;
 font-size: 13px !important;
}

#inventoryScreen #materialsPanel .matName{ color:#e8dcc1 !important; font-weight:700 !important; }
#inventoryScreen #materialsPanel .matRow b{ color:#f8e2a6 !important; font-weight:900 !important; }

#inventoryScreen #bagPanel{
 left: 18px !important;
 top: 445px !important;
 width: 560px !important;
 min-height: 220px !important;
 border: none !important;
 outline: none !important;
 box-shadow: none !important;
 background: transparent !important;
}

#inventoryScreen #bagPanel::before,
#inventoryScreen #bagPanel::after{
 display: none !important;
 content: none !important;
}

#inventoryScreen #bagPanel .invTitleRow{
 margin: 0 0 10px 0 !important;
 padding: 0 !important;
}

#inventoryScreen #bagPanel .bagGrid{
 grid-template-columns: repeat(5, 64px) !important;
 gap: 10px !important;
}

#inventoryScreen #bagPanel .slot{
 width: 64px !important;
 height: 64px !important;
}

#inventoryScreen #bagPanel.invPanel,
#inventoryScreen .invPanel#bagPanel{
 border: none !important;
 outline: none !important;
 box-shadow: none !important;
 background: transparent !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 072 ===== */

#inventoryScreen #bagPanel .bagPager,
#inventoryScreen #bagPanel .bagPageControls,
#inventoryScreen #bagPanel .invPager{
 margin-top: 14px !important;
 transform: translateY(34px) !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 073 ===== */

#inventoryScreen #bagPanel .bagGrid{
 margin-bottom: 12px !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 074 ===== */

#inventoryScreen #bagPanel .bagPager,
#inventoryScreen #bagPanel .bagPageControls,
#inventoryScreen #bagPanel .invPager{
 margin-top: 22px !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 075 ===== */

#inventoryScreen #equipPanel .invAvatar{
 top: 46% !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 076 ===== */

#inventoryScreen #equipPanel .slot,
#inventoryScreen #equipPanel .equipSlot,
#inventoryScreen #equipPanel .gearSlot{
 box-shadow: none !important;
 filter: none !important;
 background: transparent !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 077 ===== */


#inventoryScreen #equipPanel .slot::before,
#inventoryScreen #equipPanel .slot::after,
#inventoryScreen #equipPanel .equipSlot::before,
#inventoryScreen #equipPanel .equipSlot::after{
 display:none !important;
 content:none !important;
}

#inventoryScreen #equipPanel .slot,
#inventoryScreen #equipPanel .equipSlot,
#inventoryScreen #equipPanel .gearSlot{
 background: transparent !important;
 filter: none !important;
}

#inventoryScreen #equipPanel .slot:not(.slot-common):not(.slot-epic):not(.slot-legendary),
#inventoryScreen #equipPanel .equipSlot:not(.slot-common):not(.slot-epic):not(.slot-legendary){
 border:1px solid rgba(255,214,120,.38) !important;
 box-shadow:none !important;
}

#inventoryScreen #equipPanel .slot.slot-common,
#inventoryScreen #equipPanel .equipSlot.slot-common{
 border:1px solid rgba(82,214,106,.70) !important;
 box-shadow:0 0 0 1px rgba(82,214,106,.24), 0 0 14px rgba(82,214,106,.18) !important;
}

#inventoryScreen #equipPanel .slot.slot-epic,
#inventoryScreen #equipPanel .equipSlot.slot-epic{
 border:1px solid rgba(184,107,255,.78) !important;
 box-shadow:0 0 0 1px rgba(184,107,255,.28), 0 0 18px rgba(184,107,255,.26) !important;
}

#inventoryScreen #equipPanel .slot.slot-legendary,
#inventoryScreen #equipPanel .equipSlot.slot-legendary{
 border:1px solid rgba(255,204,67,.82) !important;
 box-shadow:0 0 0 1px rgba(255,204,67,.30), 0 0 20px rgba(255,204,67,.28) !important;
}

#inventoryScreen #equipPanel .slot.slot-plus5,
#inventoryScreen #equipPanel .equipSlot.slot-plus5,
#inventoryScreen #equipPanel .slot.itemPlus5,
#inventoryScreen #equipPanel .equipSlot.itemPlus5{
 animation: forgePulse 1.8s infinite ease-in-out !important;
}

#inventoryScreen #equipPanel .slot.slot-plus5.slot-common,
#inventoryScreen #equipPanel .equipSlot.slot-plus5.slot-common{
 box-shadow:0 0 0 1px rgba(82,214,106,.26), 0 0 16px rgba(82,214,106,.18), 0 0 24px rgba(255,200,60,.36) !important;
}
#inventoryScreen #equipPanel .slot.slot-plus5.slot-epic,
#inventoryScreen #equipPanel .equipSlot.slot-plus5.slot-epic{
 box-shadow:0 0 0 1px rgba(184,107,255,.30), 0 0 18px rgba(184,107,255,.24), 0 0 26px rgba(255,200,60,.40) !important;
}
#inventoryScreen #equipPanel .slot.slot-plus5.slot-legendary,
#inventoryScreen #equipPanel .equipSlot.slot-plus5.slot-legendary{
 box-shadow:0 0 0 1px rgba(255,204,67,.34), 0 0 22px rgba(255,204,67,.30), 0 0 30px rgba(255,200,60,.46) !important;
}

#inventoryScreen #equipPanel .slot img,
#inventoryScreen #equipPanel .equipSlot img{
 filter: inherit !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 078 ===== */

#inventoryScreen #materialsPanel .matName,
#inventoryScreen #materialsPanel .materialsLabel{
 display:inline-flex;
 align-items:center;
 gap:6px;
}
#inventoryScreen #materialsPanel .matIcon{
 display:inline-block;
 align-items:center;
 justify-content:center;
 width:28px;
 height:28px;
 flex:0 0 28px;
 font-size:14px;
 object-fit:contain;
 vertical-align:middle;
 filter:drop-shadow(0 3px 5px rgba(0,0,0,.65));
}
#inventoryScreen #materialsPanel .matIcon.shard{ color:#d9d9d9; }
#inventoryScreen #materialsPanel .matIcon.essence{ color:#7fd3ff; }
#inventoryScreen #materialsPanel .matIcon.other{ color:#ffd37a; }
#inventoryScreen #materialsPanel img.matIcon.shard{
 content:url("../img/ui/combat_result/reward_forge_shard_v1.png") !important;
}
#inventoryScreen #materialsPanel img.matIcon.essence{
 content:url("../img/ui/combat_result/reward_essence_v1.png") !important;
}
.materialCurrencyIcon{
 display:inline-block;
 width:28px;
 height:28px;
 flex:0 0 28px;
 object-fit:contain;
 vertical-align:middle;
 filter:drop-shadow(0 3px 5px rgba(0,0,0,.65));
}
.materialCurrencyIcon.small{
 width:20px;
 height:20px;
 flex-basis:20px;
}
.materialCurrencyIcon.shard{
 content:url("../img/ui/combat_result/reward_forge_shard_v1.png") !important;
}
.materialCurrencyIcon.essence{
 content:url("../img/ui/combat_result/reward_essence_v1.png") !important;
}
.companionMaterialLabel{
 display:inline-flex;
 align-items:center;
 gap:7px;
}
#shopScreen .kovarHeaderLine .materialCurrencyIcon.shard,
#shopScreen #shopUI > div > div .materialCurrencyIcon.shard:not(.small){
 width:20px !important;
 height:20px !important;
 max-width:20px !important;
 max-height:20px !important;
 flex:0 0 20px !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 079 ===== */


#inventoryScreen #equipPanel .slot.slot-common,
#inventoryScreen #equipPanel .equipSlot.slot-common{
 border-color: rgba(82,214,106,.72) !important;
 box-shadow:
 0 0 0 2px rgba(82,214,106,.18),
 0 0 18px rgba(82,214,106,.20) !important;
}

#inventoryScreen #equipPanel .slot.slot-epic,
#inventoryScreen #equipPanel .equipSlot.slot-epic{
 border-color: rgba(184,107,255,.78) !important;
 box-shadow:
 0 0 0 2px rgba(184,107,255,.22),
 0 0 22px rgba(184,107,255,.24) !important;
 animation: epicPulse 2.2s ease-in-out infinite !important;
}

#inventoryScreen #equipPanel .slot.slot-legendary,
#inventoryScreen #equipPanel .equipSlot.slot-legendary{
 border-color: rgba(255,204,67,.82) !important;
 box-shadow:
 0 0 0 3px rgba(255,204,67,.20),
 0 0 26px rgba(255,204,67,.26),
 0 12px 24px rgba(0,0,0,.20) !important;
 animation: legendaryPulse 2.2s ease-in-out infinite !important;
}

#inventoryScreen #equipPanel .slot.slot-plus5,
#inventoryScreen #equipPanel .equipSlot.slot-plus5{
 animation: forgePulse 1.8s ease-in-out infinite !important;
}
#inventoryScreen #equipPanel .slot.slot-plus5.slot-common,
#inventoryScreen #equipPanel .equipSlot.slot-plus5.slot-common{
 box-shadow:
 0 0 0 2px rgba(82,214,106,.20),
 0 0 18px rgba(82,214,106,.20),
 0 0 26px rgba(255,200,60,.34) !important;
}
#inventoryScreen #equipPanel .slot.slot-plus5.slot-epic,
#inventoryScreen #equipPanel .equipSlot.slot-plus5.slot-epic{
 box-shadow:
 0 0 0 2px rgba(184,107,255,.24),
 0 0 22px rgba(184,107,255,.24),
 0 0 30px rgba(255,200,60,.38) !important;
 animation: epicPulse 2.2s ease-in-out infinite, forgePulse 1.8s ease-in-out infinite !important;
}
#inventoryScreen #equipPanel .slot.slot-plus5.slot-legendary,
#inventoryScreen #equipPanel .equipSlot.slot-plus5.slot-legendary{
 box-shadow:
 0 0 0 3px rgba(255,204,67,.22),
 0 0 28px rgba(255,204,67,.28),
 0 0 34px rgba(255,200,60,.44) !important;
 animation: legendaryPulse 2.2s ease-in-out infinite, forgePulse 1.8s ease-in-out infinite !important;
}

#inventoryScreen #equipPanel .slot.slot-common:hover,
#inventoryScreen #equipPanel .equipSlot.slot-common:hover{
 filter: brightness(1.05);
 box-shadow:
 0 0 0 2px rgba(82,214,106,.26),
 0 0 24px rgba(82,214,106,.30) !important;
}
#inventoryScreen #equipPanel .slot.slot-epic:hover,
#inventoryScreen #equipPanel .equipSlot.slot-epic:hover{
 filter: brightness(1.08);
 box-shadow:
 0 0 0 2px rgba(184,107,255,.30),
 0 0 30px rgba(184,107,255,.36) !important;
}
#inventoryScreen #equipPanel .slot.slot-legendary:hover,
#inventoryScreen #equipPanel .equipSlot.slot-legendary:hover{
 filter: brightness(1.10);
 box-shadow:
 0 0 0 3px rgba(255,204,67,.28),
 0 0 34px rgba(255,204,67,.42),
 0 14px 28px rgba(0,0,0,.24) !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 080 ===== */


#inventoryScreen .equipSlot.slot-plus5,
#inventoryScreen .slot.slot-plus5{
 animation: oaiForgePulseStrong 1.55s ease-in-out infinite !important;
}

#inventoryScreen .equipSlot.slot-plus5.slot-common,
#inventoryScreen .slot.slot-plus5.slot-common{
 box-shadow:
 0 0 0 2px rgba(82,214,106,.28),
 0 0 18px rgba(82,214,106,.22),
 0 0 28px rgba(255,200,60,.34) !important;
}
#inventoryScreen .equipSlot.slot-plus5.slot-epic,
#inventoryScreen .slot.slot-plus5.slot-epic{
 box-shadow:
 0 0 0 2px rgba(184,107,255,.32),
 0 0 22px rgba(184,107,255,.28),
 0 0 34px rgba(255,200,60,.40) !important;
}
#inventoryScreen .equipSlot.slot-plus5.slot-legendary,
#inventoryScreen .slot.slot-plus5.slot-legendary{
 box-shadow:
 0 0 0 3px rgba(255,204,67,.36),
 0 0 28px rgba(255,204,67,.34),
 0 0 40px rgba(255,200,60,.52) !important;
}

#inventoryScreen .equipSlot.slot-plus5:not(.slot-common):not(.slot-epic):not(.slot-legendary),
#inventoryScreen .slot.slot-plus5:not(.slot-common):not(.slot-epic):not(.slot-legendary){
 box-shadow:
 0 0 0 2px rgba(255,214,107,.32),
 0 0 22px rgba(255,214,107,.28),
 0 0 36px rgba(255,200,60,.48) !important;
}

@keyframes oaiForgePulseStrong{
 0%,100%{
 box-shadow:
 0 0 0 1px rgba(255,200,60,.28),
 0 0 14px rgba(255,200,60,.32),
 0 0 0 rgba(255,200,60,0);
 filter: brightness(1);
 }
 50%{
 box-shadow:
 0 0 0 2px rgba(255,220,120,.46),
 0 0 30px rgba(255,200,60,.92),
 0 0 46px rgba(255,180,50,.62);
 filter: brightness(1.12);
 }
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 081 ===== */


.dfPills .dfPill:has(#dfShards){
 display: none !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 082 ===== */


#inventoryScreen .equipSlot{
 position:absolute;
}
#inventoryScreen .equipSlot::after{
 position:absolute;
 left:50%;
 top:50%;
 transform:translate(-50%,-50%);
 width:88%;
 text-align:center;
 font-size:10px;
 line-height:1.05;
 color:#d8c7a3;
 text-shadow:0 2px 6px rgba(0,0,0,.85);
 pointer-events:none;
 white-space:normal;
 opacity:.95;
}

#inventoryScreen .equipSlot:not(:has(img))::after{
 content:"";
}
#inventoryScreen .equipSlot:has(img)::after{
 content:none !important;
 display:none !important;
}

#inventoryScreen .equipWrap .equipSlot:nth-of-type(1):not(:has(img))::after{ content:"Helma"; }
#inventoryScreen .equipWrap .equipSlot:nth-of-type(2):not(:has(img))::after{ content:"Brnění"; }
#inventoryScreen .equipWrap .equipSlot:nth-of-type(3):not(:has(img))::after{ content:"Zbraň"; }

#inventoryScreen .equipWrap .equipSlot:nth-of-type(4):not(:has(img))::after{ content:"Boty"; }
#inventoryScreen .equipWrap .equipSlot:nth-of-type(5):not(:has(img))::after{ content:"Rukavice"; }
#inventoryScreen .equipWrap .equipSlot:nth-of-type(6):not(:has(img))::after{ content:"Off-hand"; }

#inventoryScreen .equipWrap .equipSlot:nth-of-type(7):not(:has(img))::after{ content:"Amulet"; }
#inventoryScreen .equipWrap .equipSlot:nth-of-type(8):not(:has(img))::after{ content:"Prsten"; }

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 083 ===== */

.guildMiniBtn.guildMiniIcon{
  width:38px; min-width:38px; padding:0; text-align:center; font-size:15px;
}
.guildUiModalOverlay{
  position:fixed !important; inset:0 !important;
  display:none; align-items:center; justify-content:center;
  background:rgba(0,0,0,.72);
  backdrop-filter: blur(8px);
  z-index:2147483647 !important;
}
.guildUiModal{
  width:min(470px, 92vw);
  border-radius:18px;
  background:
    radial-gradient(circle at 20% 10%, rgba(255,200,120,.10), transparent 60%),
    linear-gradient(180deg, rgba(40,28,18,.98), rgba(18,12,8,.98));
  border:1px solid rgba(220,170,90,.35);
  box-shadow:0 22px 70px rgba(0,0,0,.72), inset 0 0 22px rgba(180,120,60,.10);
  padding:18px;
  color:#f6e8d2;
}
.guildUiModalTitle{
  font-family:"Cinzel","Trajan Pro","Georgia",serif;
  font-size:24px; font-weight:1000; color:#f2d39c; margin-bottom:10px;
}
.guildUiModalText{ color:#eadfcd; line-height:1.45; margin-bottom:16px; }
.guildUiModalActions{ display:flex; gap:10px; justify-content:flex-end; flex-wrap:wrap; }
.guildUiModalBtn{
  padding:10px 14px; border-radius:12px; cursor:pointer; color:#fff; font-weight:900;
  border:1px solid rgba(255,255,255,.14); background:rgba(255,255,255,.06);
}
.guildUiModalBtn:hover{ filter:brightness(1.06); }
.guildUiModalBtn.danger{ background:linear-gradient(180deg, rgba(160,44,44,.92), rgba(95,18,18,.92)); border-color:rgba(255,120,120,.35); }
.guildUiModalBtn.promote{ background:linear-gradient(180deg, rgba(70,110,220,.92), rgba(35,55,120,.92)); border-color:rgba(150,190,255,.35); }
.guildUiModalBtn.leader{ background:linear-gradient(180deg, rgba(185,140,50,.92), rgba(110,75,22,.92)); border-color:rgba(255,220,150,.35); }

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 084 ===== */

.guildOnlineDot{
 display:inline-block;
 width:10px;
 height:10px;
 border-radius:50%;
 margin-right:7px;
 vertical-align:middle;
 background:#38d66b;
 box-shadow:0 0 8px rgba(56,214,107,.55);
}
.guildOnlineDot.offline{
 background:#d94a4a;
 box-shadow:0 0 8px rgba(217,74,74,.55);
}
.guildNameWithDot{
 display:inline-flex;
 align-items:center;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 085 ===== */

.guildWarHallSpot{
 position:absolute; left:44.2%; top:18.0%; width:12.2%; height:21.5%;
 z-index:8; border-radius:18px; cursor:pointer; background:rgba(255,255,255,0);
}
.guildWarHallSpot:hover{
 box-shadow: inset 0 0 0 2px rgba(255,220,140,.35), 0 0 22px rgba(255,200,120,.18);
}
.guildWarModal{
 position:fixed; left:50%; top:50%; transform:translate(-50%,-50%);
 width:min(980px, 92vw); max-height:min(760px, 88vh); overflow:hidden;
 border-radius:22px; border:1px solid rgba(220,170,90,.28);
 background:
 radial-gradient(circle at 12% 0%, rgba(255,210,120,.09), rgba(0,0,0,0) 42%),
 linear-gradient(180deg, rgba(30,18,10,.96), rgba(12,8,6,.98));
 box-shadow:0 30px 90px rgba(0,0,0,.78); z-index:999997; display:none;
}
.guildWarModal.show{ display:block; }
.guildWarHead{
 display:flex; align-items:center; justify-content:space-between; gap:12px;
 padding:14px 16px; border-bottom:1px solid rgba(255,255,255,.08);
}
.guildWarTitle{ font-family:"Cinzel","Trajan Pro","Georgia",serif; font-size:26px; font-weight:1000; color:#ffd27a; }
.guildWarClose{
 width:44px;height:40px;border-radius:14px;border:1px solid rgba(255,255,255,.10);
 background:rgba(0,0,0,.35); color:#fff; font-weight:1000; cursor:pointer;
}
.guildWarBody{
 padding:16px; display:grid; grid-template-columns: 1.05fr .95fr; gap:16px;
 max-height:calc(88vh - 72px); overflow:auto;
}
.guildWarCard{
 border:1px solid rgba(220,170,90,.18); background:rgba(20,12,6,.58);
 border-radius:18px; padding:14px; box-shadow: inset 0 0 16px rgba(0,0,0,.18);
}
.guildWarCard + .guildWarCard{ margin-top:14px; }
.guildWarCard h3{ margin:0 0 10px 0; color:#f3e1b5; font-size:18px; }
.guildWarMuted{ color:#d8c7a3; font-size:13px; line-height:1.45; }
.guildWarGrid2{ display:grid; grid-template-columns: 1fr 1fr; gap:10px; }
.guildWarStat{
 border:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.03);
 border-radius:14px; padding:10px 12px;
}
.guildWarStat b{ display:block; color:#ffd27a; margin-bottom:4px; }
.guildWarSelect{
 width:100%; padding:11px 12px; border-radius:14px; border:1px solid rgba(255,255,255,.12);
 background:rgba(255,255,255,.06); color:#fff; outline:none;
}
.guildWarBtnRow{ display:flex; gap:10px; flex-wrap:wrap; margin-top:12px; }
.guildWarBtn{
 padding:11px 14px; border-radius:14px; border:1px solid rgba(255,255,255,.14);
 background:linear-gradient(180deg, rgba(70,45,25,.88), rgba(28,16,10,.92));
 color:#fff4de; font-weight:1000; cursor:pointer;
}
.guildWarBtn:hover{ filter:brightness(1.05); }
.guildWarBtn.primary{ background:linear-gradient(180deg, rgba(170,110,40,.95), rgba(105,62,24,.95)); border-color:rgba(255,210,120,.42); }
.guildWarBtn.secondary{ background:linear-gradient(180deg, rgba(44,44,50,.85), rgba(18,18,22,.92)); }
.guildWarBtn:disabled{ opacity:.45; cursor:not-allowed; }
.guildWarReplayBox{
 min-height:190px; max-height:300px; overflow:auto; border:1px solid rgba(255,255,255,.08);
 background:rgba(0,0,0,.22); border-radius:16px; padding:12px;
}
.guildWarReplayLine{
 padding:8px 10px; border-bottom:1px solid rgba(255,255,255,.06);
 color:#efe3c8; font-size:13px;
}
.guildWarReplayLine:last-child{ border-bottom:none; }
.guildWarResultWin{ color:#56e06f; font-weight:1000; }
.guildWarResultLose{ color:#ff7b7b; font-weight:1000; }
.guildWarAnnounce{ color:#ffd27a; font-weight:1000; }
.guildWarGuildList{ display:flex; flex-direction:column; gap:8px; margin-top:10px; }
.guildWarGuildRow{
 display:flex; align-items:center; justify-content:space-between; gap:10px;
 padding:10px 12px; border-radius:14px; border:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.03);
}
.guildWarSmall{ font-size:12px; color:#d8c7a3; }
.guildWarSmall b{ color:#fff3c9; }
.guildWarBadge{
 display:inline-flex; align-items:center; gap:6px; padding:5px 9px; border-radius:999px;
 background:rgba(0,0,0,.25); border:1px solid rgba(255,255,255,.08); font-size:12px; font-weight:900;
}
.guildWarFame{ color:#7cc9ff; }
.guildWarGold{ color:#ffd27a; }
.guildWarNote{
 margin-top:10px; padding:10px 12px; border-radius:14px; border:1px dashed rgba(255,255,255,.10);
 background:rgba(255,255,255,.03); color:#d8c7a3; font-size:12px; line-height:1.45;
}
.guildWarLbTag{
 display:inline-flex; align-items:center; gap:6px; margin-left:8px; padding:3px 8px; border-radius:999px;
 background:rgba(100,180,255,.10); border:1px solid rgba(120,200,255,.18); color:#8fd2ff; font-size:11px; font-weight:1000;
}
.guildWarBattleOverlay{
 position:fixed; inset:0; display:none; align-items:center; justify-content:center;
 background:rgba(0,0,0,.68); z-index:999998;
}
.guildWarBattleOverlay.show{ display:flex; }
.guildWarBattleCard{
 width:min(1280px, 98vw); max-height:90vh; overflow:auto; border-radius:22px;
 border:1px solid rgba(220,170,90,.28);
 background:
 radial-gradient(circle at 12% 0%, rgba(255,210,120,.08), rgba(0,0,0,0) 42%),
 linear-gradient(180deg, rgba(30,18,10,.96), rgba(12,8,6,.98));
 box-shadow:0 30px 90px rgba(0,0,0,.78); padding:16px;
}
.guildWarBattleTitle{ font-family:"Cinzel","Georgia",serif; font-size:24px; font-weight:1000; color:#ffd27a; margin-bottom:12px; }
.guildWarBattleStage{
 display:grid; grid-template-columns:minmax(0, 1fr) 240px; gap:18px; align-items:start;
}
.guildWarBattleArena{
 border:1px solid rgba(255,255,255,.08);
 border-radius:18px;
 padding:16px;
 background:
 radial-gradient(circle at 50% 20%, rgba(255,220,150,.06), rgba(0,0,0,0) 42%),
 linear-gradient(180deg, rgba(18,12,9,.92), rgba(10,8,7,.96));
 box-shadow: inset 0 0 24px rgba(255,210,120,.06);
}
.guildWarBattleTopline{
 display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom:12px;
 color:#ead9c0; font-size:13px;
}
.guildWarBattleBadge{
 display:inline-flex; align-items:center; gap:8px; padding:6px 10px; border-radius:999px;
 border:1px solid rgba(255,255,255,.10); background:rgba(255,255,255,.05); font-weight:900;
}
.guildWarBattleVs{
 display:grid; grid-template-columns:minmax(0, 1fr) 140px minmax(0, 1fr); gap:22px; align-items:center; margin-bottom:14px;
}
.guildWarBattleFighter{
 position:relative;
 border:1px solid rgba(255,255,255,.10);
 border-radius:18px;
 padding:16px 18px 20px;
 background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(0,0,0,.16));
 min-height:320px;
 overflow:hidden;
}
.guildWarBattleFighter.left{ box-shadow: inset 0 0 22px rgba(90,170,255,.08); }
.guildWarBattleFighter.right{ box-shadow: inset 0 0 22px rgba(255,90,90,.08); }
.guildWarBattlePortrait{
 width:170px; height:170px; margin:0 auto 12px; border-radius:18px; overflow:hidden;
 background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.10); box-shadow:0 18px 34px rgba(0,0,0,.38);
 position:relative;
}
.guildWarBattlePortrait img{ width:100%; height:100%; object-fit:contain; display:block; }
.guildWarBattlePortrait.avatarWithCompanion{ display:flex; align-items:center; justify-content:center; overflow:visible; }
.guildWarBattlePortrait .companionBattleFrame.guildWarCompanionFrame{
 left:-70px;
 top:38px;
 width:56px;
 height:56px;
 z-index:5;
}
.guildWarBattlePortrait.rightPortrait .companionBattleFrame.guildWarCompanionFrame{
 left:auto;
 right:-70px;
}
.guildWarBattleName{ text-align:center; font-size:20px; font-weight:1000; color:#fff2d6; margin-bottom:4px; }
.guildWarBattleMeta{ text-align:center; color:#cdbba1; font-size:12px; margin-bottom:10px; }
.guildWarBattleHp{
 height:18px; border-radius:999px; overflow:hidden; border:1px solid rgba(255,255,255,.10);
 background:rgba(0,0,0,.40); margin-bottom:10px; position:relative;
}
.guildWarBattleHp > i{
 display:block; height:100%; width:100%;
 background:linear-gradient(90deg, rgba(255,60,60,1), rgba(255,215,215,1));
 box-shadow:0 0 18px rgba(255,60,60,.28);
 transition:width .32s ease;
}
.guildWarBattleHpLabel{
 text-align:center; color:#f7efe1; font-weight:900; font-size:12px; margin-bottom:10px;
}
.guildWarBattleStats{
 border:1px solid rgba(255,255,255,.08); border-radius:14px; padding:10px;
 background:rgba(0,0,0,.22); font-size:12px; color:#d9cfbf;
}
.guildWarBattleStats .row{ display:flex; justify-content:space-between; gap:10px; padding:2px 0; }
.guildWarBattleStats b{ color:#fff; }
.guildWarBattleCenter{
 display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px;
}
.guildWarBattleCenter .vs{
 font-family:"Cinzel","Georgia",serif; font-size:38px; font-weight:1000; color:#ffd27a;
 text-shadow:0 8px 20px rgba(0,0,0,.55);
}
.guildWarBattleCenter .duelNo{ display:none;

 padding:8px 12px; border-radius:999px; background:rgba(255,255,255,.05);
 border:1px solid rgba(255,255,255,.10); color:#f3e4c2; font-weight:900; text-align:center;
}
.guildWarBattleQueue{
 border:1px solid rgba(255,255,255,.08); border-radius:18px; background:rgba(0,0,0,.18); padding:12px;
}
.guildWarQueueTitle{ font-size:14px; font-weight:1000; color:#f6dca8; margin-bottom:10px; }
.guildWarQueueList{ display:flex; flex-direction:column; gap:8px; max-height:260px; overflow:auto; }
.guildWarQueueItem{
 padding:10px 12px; border-radius:14px; border:1px solid rgba(255,255,255,.08);
 background:rgba(255,255,255,.04); color:#ddd0bc; font-size:12px;
}
.guildWarQueueItem.active{ border-color:rgba(255,210,120,.36); box-shadow:0 0 0 1px rgba(255,210,120,.16), 0 0 18px rgba(255,210,120,.10); color:#fff2d8; }
.guildWarQueueItem.done{ opacity:.62; }
.guildWarBattleLog{
 min-height:170px; max-height:220px; overflow:auto; border-radius:16px;
 border:1px solid rgba(255,255,255,.08); background:rgba(0,0,0,.22); padding:12px; margin-top:14px;
}
.guildWarBattleActions{ display:flex; justify-content:flex-end; gap:10px; margin:12px 0; position:sticky; top:0; z-index:6; }
.guildWarBattleFloat{
 position:absolute; left:50%; top:38%;
 transform:translate(-50%,0); font-weight:1000; font-size:34px; color:#ff6666;
 text-shadow:0 10px 22px rgba(0,0,0,.85), 0 0 22px rgba(255,60,60,.25);
 pointer-events:none; animation: guildWarFloat .85s ease-out forwards; z-index:20;
}
.guildWarBattleFloat.crit{ font-size:42px; color:#fff; text-shadow:0 10px 26px rgba(0,0,0,.9), 0 0 30px rgba(255,120,90,.55); }
.guildWarBattleFloat.heal{ color:#7cffb0; }
.guildWarBattlePop{
 position:absolute; top:10px; left:50%; transform:translateX(-50%);
 padding:5px 12px; border-radius:999px; background:rgba(0,0,0,.55); border:1px solid rgba(255,255,255,.16);
 color:#fff; font-weight:1000; font-size:12px; animation:guildWarPop .85s ease forwards; pointer-events:none; z-index:21;
}
.guildWarBattleSummary{
 margin-top:12px; padding:10px 12px; border-radius:14px; border:1px solid rgba(255,255,255,.08);
 background:rgba(255,255,255,.04); color:#ebdfcb; font-size:13px;
}
.guildWarBattleCounts{
 display:flex; gap:10px; flex-wrap:wrap; margin-top:12px;
}
.guildWarBattleCount{
 flex:1 1 0; min-width:180px; padding:10px 12px; border-radius:14px;
 border:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.04); color:#ebdfcb; font-size:13px;
}
.guildWarBattleCount b{ color:#fff; }
.guildWarBattleCount .alive{ color:#56e06f; font-weight:1000; }
.guildWarBattleCount .total{ color:#cbbda6; }
.guildWarBattleBanner{
 display:none; margin-top:12px; padding:14px 16px; border-radius:16px; text-align:center;
 border:1px solid rgba(255,210,120,.22);
 background:linear-gradient(180deg, rgba(130,90,28,.24), rgba(30,18,8,.34));
 color:#fff0cb; box-shadow:0 0 24px rgba(255,210,120,.12);
}
.guildWarBattleBanner.show{ display:block; }
.guildWarBattleBanner .eyebrow{ font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:#f6dca8; opacity:.9; }
.guildWarBattleBanner .name{ margin-top:4px; font-family:"Cinzel","Georgia",serif; font-size:28px; font-weight:1000; color:#fff6df; }
.guildWarNameWin{ color:#56e06f; font-weight:1000; }
.guildWarNameLose{ color:#ff6b6b; font-weight:1000; }
@keyframes guildWarFloat{
 0%{ transform:translate(-50%,0); opacity:1; }
 100%{ transform:translate(-50%,-70px); opacity:0; }
}
@keyframes guildWarPop{
 0%{ transform:translateX(-50%) scale(.75); opacity:0; }
 15%{ opacity:1; }
 100%{ transform:translate(-50%,-24px) scale(1); opacity:0; }
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 086 ===== */

/* guild war battle overlay should use its own battlefield scene */
#guildWarBattleOverlay{
 background:
  linear-gradient(rgba(0,0,0,.18), rgba(0,0,0,.28)),
  url("img/guildy_battle.png") center center / cover no-repeat !important;
}
#guildWarBattleOverlay .guildWarBattleCard{
 background:
  radial-gradient(circle at 12% 0%, rgba(255,210,120,.08), rgba(0,0,0,0) 42%),
  linear-gradient(180deg, rgba(30,18,10,.78), rgba(12,8,6,.82)) !important;
}


/* ===== style block 087 ===== */

.guildWarBattleArena{ position:relative; }
.guildWarFxLayer{ position:absolute; inset:0; pointer-events:none; overflow:hidden; z-index:6; }
.guildWarBattlePortrait{ z-index:2; }
.guildWarBattlePortrait.gwLungeLeft{ animation: atkLeft .58s ease-out; }
.guildWarBattlePortrait.gwLungeRight{ animation: atkRight .58s ease-out; }
.guildWarBattleFighter.gwHit{ animation: shake .30s ease-out; }
.guildWarProjectile{
 position:absolute; pointer-events:none; z-index:8; object-fit:contain;
 filter: drop-shadow(0 6px 10px rgba(0,0,0,.55));
 transform-origin:center center;
}
.guildWarProjectile.arrow{ width:516px; height:120px; }
.guildWarProjectile.magic{ width:90px; height:90px; }
.guildWarProjectile.weapon{ width:130px; height:130px; }
.guildWarImpactScar{
 position:absolute; width:56px; height:10px; border-radius:999px; pointer-events:none; z-index:9;
 background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,70,70,.95), rgba(255,255,255,0));
 box-shadow: 0 0 14px rgba(255,70,70,.35);
}
.guildWarMeleeSlash{
 position:absolute; width:130px; height:130px; border-radius:50%; pointer-events:none; z-index:8;
 border-top: 4px solid rgba(255,240,210,.95); border-right: 4px solid rgba(255,120,120,.55);
 border-left: 4px solid transparent; border-bottom: 4px solid transparent;
 filter: drop-shadow(0 0 12px rgba(255,180,120,.28));
}
.guildWarMagicBurst{
 position:absolute; width:68px; height:68px; border-radius:50%; pointer-events:none; z-index:8;
 background: radial-gradient(circle at 35% 35%, rgba(255,255,255,.95), rgba(255,190,120,.55) 35%, rgba(120,170,255,.22) 58%, rgba(0,0,0,0) 75%);
}
.guildWarBattlePortrait.gwCastGlow::after{
 content:""; position:absolute; inset:-8px; border-radius:24px; pointer-events:none;
 background: radial-gradient(circle, rgba(120,180,255,.35), rgba(120,180,255,0) 68%);
 animation: gwCastPulse .28s ease-out;
}
@keyframes gwCastPulse{ from{ opacity:.2; transform:scale(.85);} to{ opacity:1; transform:scale(1.08);} }


/* ===== style block 088 ===== */

#guildHallScreen .guildBossHotspot{
 position:absolute;
 left:24%;
 top:62%;
 width:52%;
 height:26%;
 z-index:21;
 border-radius:18px;
 background:rgba(255,255,255,0);
}
#guildHallScreen .guildBackHotspot:hover,
#guildHallScreen .guildChestHotspot:hover,
#guildHallScreen .guildBoardHotspot:hover,
#guildHallScreen .guildBossHotspot:hover{
 box-shadow: inset 0 0 0 2px rgba(255,220,140,.35), 0 0 20px rgba(255,200,120,.18);
}
#guildBossPanel{
 position:fixed;
 left:50%;
 top:50%;
 transform:translate(-50%,-50%);
 width:min(980px, 94vw);
 height:min(760px, 90vh);
 background:
 radial-gradient(circle at 20% 10%, rgba(255,200,120,.10), transparent 60%),
 linear-gradient(180deg, rgba(40,28,18,.97), rgba(22,14,8,.97));
 border:1px solid rgba(220,170,90,.35);
 border-radius:18px;
 box-shadow: 0 0 30px rgba(200,150,70,.18), 0 20px 60px rgba(0,0,0,.75), inset 0 0 25px rgba(180,120,60,.12);
 padding:18px;
 z-index:300200;
 display:none;
 overflow:hidden;
}
#guildBossPanel.show{ display:block; }
#guildBossPanel .guildBossHead{
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:12px;
 margin-bottom:12px;
}
#guildBossPanel .guildBossBody{
 height:calc(100% - 58px);
 overflow:auto;
 padding-right:4px;
}
.guildBossTopGrid{
 display:grid;
 grid-template-columns: minmax(300px, 1.2fr) minmax(260px, .8fr);
 gap:14px;
 margin-bottom:14px;
}
.guildBossCard{
 border:1px solid rgba(220,170,90,.18);
 background:rgba(20,12,6,.60);
 border-radius:16px;
 padding:14px;
}
.guildBossName{
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:24px;
 font-weight:1000;
 color:#ffd27a;
 margin-bottom:6px;
}
.guildBossMeta{
 color:#d8c7a3;
 font-size:13px;
 line-height:1.5;
}
.guildBossBarWrap{
 margin-top:12px;
}
.guildBossBar{
 height:18px;
 border-radius:999px;
 overflow:hidden;
 background:rgba(0,0,0,.45);
 border:1px solid rgba(255,255,255,.10);
}
.guildBossBarFill{
 height:100%;
 width:0%;
 background:linear-gradient(90deg, rgba(255,60,60,1), rgba(255,180,120,1));
 box-shadow:0 0 18px rgba(255,60,60,.30);
}
.guildBossHpText{
 margin-top:8px;
 font-weight:1000;
 color:#fff2d7;
}
.guildBossActionRow{
 display:flex;
 gap:10px;
 flex-wrap:wrap;
 margin-top:14px;
}
.guildBossActionRow .guildBtn{
 min-width:180px;
}
.guildBossStatList{
 display:grid;
 grid-template-columns:repeat(2, minmax(0,1fr));
 gap:8px;
 margin-top:10px;
}
.guildBossStatPill{
 padding:9px 10px;
 border-radius:12px;
 border:1px solid rgba(220,170,90,.18);
 background:rgba(0,0,0,.22);
 color:#f3e7cf;
 font-size:13px;
 font-weight:900;
}
.guildBossProgressGrid{
 display:grid;
 grid-template-columns:repeat(5, minmax(0,1fr));
 gap:10px;
 margin-top:14px;
}
.guildBossMini{
 border:1px solid rgba(220,170,90,.18);
 background:rgba(20,12,6,.55);
 border-radius:14px;
 padding:10px;
 min-height:110px;
 position:relative;
}
.guildBossMini.done{
 opacity:.65;
 box-shadow: inset 0 0 0 1px rgba(120,220,140,.18), 0 0 18px rgba(120,220,140,.08);
}
.guildBossMini.active{
 box-shadow: 0 0 0 1px rgba(255,210,120,.22), 0 0 20px rgba(255,210,120,.12);
}
.guildBossMiniNum{
 font-size:12px;
 color:#d8c7a3;
 margin-bottom:6px;
}
.guildBossMiniName{
 color:#ffd27a;
 font-weight:1000;
 font-size:14px;
 line-height:1.2;
}
.guildBossMiniHp{
 margin-top:8px;
 color:#f2eadc;
 font-size:12px;
}
.guildBossMiniReward{
 margin-top:6px;
 color:#9fe39f;
 font-size:12px;
 font-weight:900;
}
.guildBossRaidLog{
 display:flex;
 flex-direction:column;
 gap:10px;
 margin-top:14px;
}
.guildBossRaidEntry{
 padding:10px 12px;
 border-radius:12px;
 border:1px solid rgba(255,255,255,.10);
 background:linear-gradient(180deg, rgba(55,36,18,.90), rgba(28,18,10,.92));
 color:#f1e4c7;
 line-height:1.35;
 font-size:14px;
}
.guildBossRaidEntry b{ color:#ffd67a; }
.guildBossMuted{
 color:#d8c7a3;
 font-size:13px;
}
.guildBossCompleted{
 padding:16px;
 border-radius:16px;
 border:1px solid rgba(120,220,140,.26);
 background:rgba(18,38,18,.35);
 color:#e9ffe9;
}
@media (max-width: 900px){
 .guildBossTopGrid{ grid-template-columns:1fr; }
 .guildBossProgressGrid{ grid-template-columns:repeat(2, minmax(0,1fr)); }
 .guildBossStatList{ grid-template-columns:1fr; }
}


/* ===== style block 089 ===== */

#guildHallScreen .ghHotspotHiddenByModal{
 display:none !important;
 pointer-events:none !important;
 visibility:hidden !important;
 opacity:0 !important;
}


/* ===== style block 090 ===== */

/* Bigger proc texts directly over guild war avatars */
#guildWarBattleOverlay .critPop,
#guildWarBattleOverlay .statusPop,
#guildWarBattleOverlay .poisonPop,
#guildWarBattleOverlay .ragePop{
  left:50% !important;
  top:28% !important;
  transform:translate(-50%,-50%) !important;
  font-size:44px !important;
  font-weight:1000 !important;
  padding:6px 14px !important;
  border-radius:16px !important;
  letter-spacing:1px !important;
  line-height:1 !important;
  z-index:40 !important;
  box-shadow:0 12px 28px rgba(0,0,0,.55);
}

#guildWarBattleOverlay .statusPop{
  background:rgba(0,0,0,.52) !important;
  border:1px solid rgba(255,255,255,.18) !important;
  color:#ffffff !important;
  text-shadow:0 10px 22px rgba(0,0,0,.85), 0 0 20px rgba(255,255,255,.18) !important;
}

#guildWarBattleOverlay .poisonPop{
  background:rgba(30,110,40,.62) !important;
  border:1px solid rgba(120,255,170,.26) !important;
  color:#d8ffd8 !important;
  text-shadow:0 10px 22px rgba(0,0,0,.85), 0 0 20px rgba(120,255,170,.20) !important;
}

#guildWarBattleOverlay .ragePop{
  background:rgba(120,40,10,.62) !important;
  border:1px solid rgba(255,190,120,.26) !important;
  color:#ffe2b8 !important;
  text-shadow:0 10px 22px rgba(0,0,0,.85), 0 0 20px rgba(255,190,120,.20) !important;
}

/* make standard proc pop animation bigger and centered */
#guildWarBattleOverlay .critPop{
  font-size:52px !important;
}

/* ensure avatar cards allow centered proc text nicely */
#guildWarBattleOverlay .fighterCard,
#guildWarBattleOverlay .bigAvatar{
  overflow:visible !important;
}


/* ===== style block 091 ===== */

#guildWarBattleOverlay .guildWarPop,
#guildWarBattleOverlay .critPop,
#guildWarBattleOverlay .statusPop,
#guildWarBattleOverlay .poisonPop,
#guildWarBattleOverlay .ragePop,
#guildWarBattleOverlay .popText{
  position:absolute !important;
  left:50% !important;
  top:45% !important;
  transform:translate(-50%,-50%) !important;
  font-size:64px !important;
  font-weight:900 !important;
  color:#ffffff !important;
  text-shadow:0 0 18px #000,0 0 30px #000 !important;
  pointer-events:none;
  z-index:9999 !important;
}


/* ===== style block 092 ===== */

#guildWarBattleOverlay .oaiProcBig{
  position:absolute;
  left:50%;
  top:48%;
  transform:translate(-50%,-50%);
  font-size:56px;
  font-weight:1000;
  letter-spacing:1px;
  line-height:1;
  color:#fff;
  text-shadow:0 0 14px rgba(0,0,0,.98), 0 0 28px rgba(0,0,0,.92), 0 8px 22px rgba(0,0,0,.95);
  pointer-events:none;
  z-index:999999;
  animation:oaiProcBigFade 850ms ease-out forwards;
  white-space:nowrap;
}
@keyframes oaiProcBigFade{
  0%{opacity:0; transform:translate(-50%,-50%) scale(.78);}
  15%{opacity:1; transform:translate(-50%,-50%) scale(1.08);}
  100%{opacity:0; transform:translate(-50%,-78%) scale(1);}
}
#guildWarBattleOverlay .fighterCard,
#guildWarBattleOverlay .bigAvatar{
  overflow:visible !important;
}


/* ===== style block 093 ===== */

/* Hide old tiny proc pills in guild war completely */
#guildWarBattleOverlay .statusPop,
#guildWarBattleOverlay .poisonPop,
#guildWarBattleOverlay .ragePop,
#guildWarBattleOverlay .critPop{
  display:none !important;
}

#guildWarBattleOverlay .oaiProcBig{
  position:absolute;
  left:50%;
  top:46%;
  transform:translate(-50%,-50%);
  font-size:48px;
  font-weight:1000;
  letter-spacing:1px;
  line-height:1;
  color:#fff;
  text-shadow:
    0 0 12px rgba(0,0,0,.98),
    0 0 28px rgba(0,0,0,.96),
    0 10px 24px rgba(0,0,0,.96);
  pointer-events:none;
  z-index:999999;
  white-space:nowrap;
  animation:oaiProcBigFade 900ms ease-out forwards;
}
@keyframes oaiProcBigFade{
  0%{ opacity:0; transform:translate(-50%,-50%) scale(.76); }
  15%{ opacity:1; transform:translate(-50%,-50%) scale(1.08); }
  100%{ opacity:0; transform:translate(-50%,-78%) scale(1); }
}
#guildWarBattleOverlay .fighterCard,
#guildWarBattleOverlay .bigAvatar{
  overflow:visible !important;
}


/* ===== style block 094 ===== */

#guildWarBattleOverlay .guildWarBattlePop,
#guildWarBattleOverlay .statusPop,
#guildWarBattleOverlay .poisonPop,
#guildWarBattleOverlay .ragePop,
#guildWarBattleOverlay .critPop{
  display:none !important;
}
#guildWarBattleOverlay .gwBigProc{
  position:absolute;
  left:50%;
  top:48%;
  transform:translate(-50%,-50%);
  font-size:48px;
  font-weight:1000;
  line-height:1;
  letter-spacing:1px;
  color:#fff;
  text-shadow:0 0 12px rgba(0,0,0,.98), 0 0 28px rgba(0,0,0,.96), 0 10px 24px rgba(0,0,0,.96);
  pointer-events:none;
  z-index:999999 !important;
  white-space:nowrap;
  animation:gwBigProcFade .9s ease-out forwards;
}
@keyframes gwBigProcFade{
  0%{opacity:0; transform:translate(-50%,-50%) scale(.76);}
  15%{opacity:1; transform:translate(-50%,-50%) scale(1.08);}
  100%{opacity:0; transform:translate(-50%,-78%) scale(1);}
}
#guildWarBattleOverlay .fighterCard,
#guildWarBattleOverlay .bigAvatar{ overflow:visible !important; }


/* ===== style block 095 ===== */

.reforge-cost img{
 width:18px !important;
 height:18px !important;
 vertical-align:middle;
}

.upgTag{display:inline-block;margin-left:6px;font-weight:1000;color:#ffd36a;text-shadow:0 0 10px rgba(255,205,90,.35);}

#globalLeftMenu .lhBtn,
#globalLeftMenu .lhBtn:hover,
#globalLeftMenu .lhBtn:active,
#globalLeftMenu .lhBtn:focus,
#globalLeftMenu .lhBtn:focus-visible,
#globalLeftMenu .lhBtn.active{
 border: 0 !important;
 background: transparent !important;
 background-image: none !important;
 background-color: transparent !important;
 box-shadow: none !important;
 outline: 0 !important;
 filter: none !important;
}

#globalLeftMenu .lhBtn:not(.lhBtnCity)::before{
 content: none !important;
 display: none !important;
 background: none !important;
 box-shadow: none !important;
}

#globalLeftMenu .lhBtn:not(.lhBtnCity):not(.imgBtn)::after{
 content: none !important;
 display: none !important;
 background: none !important;
 box-shadow: none !important;
}

#globalLeftMenu .lhBtn.imgBtn{
 position: relative !important;
 padding: 0 !important;
 height: 90px !important;
 min-height: 90px !important;
 overflow: visible !important;
}

#globalLeftMenu .lhBtn.imgBtn::after{
 content: "" !important;
 display: block !important;
 position: absolute !important;
 inset: 0 !important;
 z-index: 2 !important;
 background-image: var(--btn-img) !important;
 background-repeat: no-repeat !important;
 background-position: center !important;
 background-size: 100% 100% !important;
 pointer-events: none !important;
 filter: drop-shadow(0 14px 26px rgba(0,0,0,.65)) !important;
 box-shadow: none !important;
}

#globalLeftMenu .lhBtn.imgBtn .txt{
 opacity: 0 !important;
 pointer-events: none !important;
}

#globalLeftMenu{
 background: transparent !important;
 backdrop-filter: none !important;
 -webkit-backdrop-filter: none !important;
}
#globalLeftMenu::before,
#globalLeftMenu::after{
 content: none !important;
 display: none !important;
 background: none !important;
 box-shadow: none !important;
}

#globalLeftMenu .lhBtn{
 border: 0 !important;
 background: transparent !important;
 background-image: none !important;
 background-color: transparent !important;
 box-shadow: none !important;
 outline: 0 !important;
 filter: none !important;
 opacity: 1 !important;
}

#globalLeftMenu .lhBtn.imgBtn,
#globalLeftMenu .lhBtn.imgBtn::after{
 opacity: 1 !important;
 filter: none !important;
 mix-blend-mode: normal !important;
}

#globalLeftMenu .lhBtn.imgBtn::after{
 background-size: contain !important;
 box-shadow: none !important;
}

#globalLeftMenu .lhBtn .txt{
 display: none !important;
}

#globalLeftMenu .lhBtn:not(.lhBtnCity),
#globalLeftMenu .lhBtn:not(.lhBtnCity):hover,
#globalLeftMenu .lhBtn:not(.lhBtnCity):active,
#globalLeftMenu .lhBtn:not(.lhBtnCity):focus,
#globalLeftMenu .lhBtn:not(.lhBtnCity):focus-visible,
#globalLeftMenu .lhBtn:not(.lhBtnCity).active{
 border: 0 !important;
 background: transparent !important;
 background-image: none !important;
 background-color: transparent !important;
 box-shadow: none !important;
 outline: 0 !important;
 filter: none !important;
}

#globalLeftMenu .lhBtn:not(.lhBtnCity)::before{
 content: none !important;
 display: none !important;
 background: none !important;
 box-shadow: none !important;
 opacity: 0 !important;
}

#globalLeftMenu .lhBtn:not(.lhBtnCity):not(.imgBtn)::after{
 content: none !important;
 display: none !important;
 background: none !important;
 box-shadow: none !important;
 opacity: 0 !important;
}

#globalLeftMenu .lhBtn.imgBtn::after{
 z-index: 10 !important;
 opacity: 1 !important;
}

#globalLeftMenu .lhBtnCity,
#globalLeftMenu .lhBtnCity:hover,
#globalLeftMenu .lhBtnCity:active,
#globalLeftMenu .lhBtnCity:focus,
#globalLeftMenu .lhBtnCity:focus-visible,
#globalLeftMenu .lhBtnCity.active{
 border: 0 !important;
 background: transparent !important;
 background-image: none !important;
 background-color: transparent !important;
 box-shadow: none !important;
 outline: 0 !important;
 filter: none !important;
}

#globalLeftMenu .lhBtn.imgBtn::after{

}

#globalLeftMenu .lhBtn.imgBtn{
 height: 100px !important;
 min-height: 100px !important;
}

#globalLeftMenu .lhBtn.imgBtn::after{

 transition: transform 0.18s ease, filter 0.18s ease !important;
}

#globalLeftMenu .lhBtn.imgBtn{
 transition: transform 0.18s ease !important;
}

#globalLeftMenu .lhBtn.imgBtn:hover{
 transform: scale(1.03) !important;
}

#globalLeftMenu .lhBtn.imgBtn:hover::after{

}

#globalLeftMenu .lhBtn.imgBtn{
 height: 155px !important;
 min-height: 155px !important;
 transition: transform 0.18s ease !important;
}

#globalLeftMenu .lhBtn.imgBtn::after{
 background-size: contain !important;
 image-rendering: auto !important;
 filter: none !important;
 transition: transform 0.18s ease !important;
}

#globalLeftMenu .lhBtn.imgBtn:hover{
 transform: scale(1.03) !important;
}

#globalLeftMenu{
 padding-top: 10px !important;
 gap: 0 !important;
}

#globalLeftMenu .lhBtn{
 margin: 0 !important;
}

#globalLeftMenu .lhBtn + .lhBtn{
 margin-top: 6px !important;
}

#globalLeftMenu{
 display: flex !important;
 flex-direction: column !important;
 justify-content: flex-start !important;
 align-items: flex-start !important;
 gap: 0 !important;
 padding-top: 20px !important;
}

#globalLeftMenu .lhBtn{
 margin: 0 !important;
}

#globalLeftMenu .lhBtn + .lhBtn{
 margin-top: 4px !important;
}

#globalLeftMenu .lhBtn.imgBtn{
 height: 120px !important;
 min-height: 120px !important;
 padding: 0 !important;
 line-height: 0 !important;
 margin: 0 !important;
}

#globalLeftMenu .lhBtn.imgBtn + .lhBtn.imgBtn{
 margin-top: 4px !important;
}

#globalLeftMenu .lhBtn.imgBtn::after{
 background-size: contain !important;
 background-position: center !important;
}

#globalLeftMenu .lhBtn.imgBtn{
 height: 140px !important;
 min-height: 140px !important;
 margin: 0 !important;
}
#globalLeftMenu .lhBtn.imgBtn + .lhBtn.imgBtn{
 margin-top: 4px !important;
}
#globalLeftMenu .lhBtn.imgBtn::after{
 background-size: contain !important;
 filter: none !important;
 image-rendering: auto !important;
}

#globalLeftMenu .lhBtn.imgBtn{
 height: 95px !important;
 min-height: 95px !important;
 padding: 0 !important;
 margin: 0 0 6px 0 !important;
 overflow: visible !important;
}

#globalLeftMenu .lhBtn.imgBtn::after{
 background-size: contain !important;
 background-position: left center !important;
 filter: none !important;
}

#globalLeftMenu{
 display:block !important;
 padding: 0 !important;
 gap: 0 !important;
}

#globalLeftMenu .lhSep{ margin: 6px 6px !important; }

#globalLeftMenu .lhBtn.imgBtn{
 height: 155px !important;
 min-height: 155px !important;
 padding: 0 !important;
 margin: 0 !important;
 line-height: 0 !important;
 border: 0 !important;
 background: transparent !important;
 box-shadow: none !important;
 overflow: visible !important;
}

#globalLeftMenu .lhBtn.imgBtn + .lhBtn.imgBtn{
 margin-top: 2px !important;
}

#globalLeftMenu .lhBtn.imgBtn::after{
 background-size: auto 100% !important;
 background-position: left center !important;
 filter: none !important;
}

#globalLeftMenu{ display:none !important; pointer-events:none !important; }
body.cityMenuOn #globalLeftMenu{ display:block !important; pointer-events:auto !important; }

body.colosseum-active #globalLeftMenu,
body.dungeon-active #globalLeftMenu{
 display:none !important;
 pointer-events:none !important;
}

:root{
 --leftMenuBtnH: 150px;
 --leftMenuGap: 0px;
}

#globalLeftMenu{
 padding: 0 !important;
 margin: 0 !important;
}

#globalLeftMenu .lhSep{
 display: none !important;
 height: 0 !important;
 margin: 0 !important;
 padding: 0 !important;
}

#globalLeftMenu .lhBtn.imgBtn{
 display: block !important;
 height: var(--leftMenuBtnH) !important;
 min-height: var(--leftMenuBtnH) !important;
 margin: 0 !important;
 padding: 0 !important;
 line-height: 0 !important;
 border: 0 !important;
 background: transparent !important;
 box-shadow: none !important;
 outline: 0 !important;
 overflow: visible !important;
 transition: transform 0.18s ease !important;
}

#globalLeftMenu .lhBtn.imgBtn + .lhBtn.imgBtn{
 margin-top: var(--leftMenuGap) !important;
}

#globalLeftMenu .lhBtn.imgBtn::after{
 background-size: 100% 100% !important;
 background-position: left center !important;
 filter: none !important;
 image-rendering: auto !important;
 transition: transform 0.18s ease !important;
}

#globalLeftMenu .lhBtn.imgBtn:hover{
 transform: scale(1.03) !important;
}

:root{
 --leftMenuBtnH: 120px;
 --leftMenuGap: 0px;
}

#globalLeftMenu .lhBtn.imgBtn{
 height: var(--leftMenuBtnH) !important;
 min-height: var(--leftMenuBtnH) !important;
}

#globalLeftMenu .lhBtn.imgBtn::after{
 background-size: 100% auto !important;
 background-position: left center !important;
}

:root{
 --leftMenuBtnShiftX: 20px;
}

#globalLeftMenu .lhBtn.imgBtn{
 transform: translateX(var(--leftMenuBtnShiftX));
}

#globalLeftMenu .lhBtn.imgBtn:hover{
 transform: translateX(var(--leftMenuBtnShiftX)) scale(1.03);
}

#globalLeftMenu .lhBtn.btnBack{
 display:none !important;
}

body.citySubScreenActive #globalLeftMenu .lhBtn.btnBack{
 display:block !important;
}

#globalLeftMenu .lhBtn.lhBtnCity{
 display:none !important;
}
body.citySubScreenActive #globalLeftMenu .lhBtn.lhBtnCity{
 display:block !important;
}

#globalLeftMenu .lhBtn.lhBtnCity{ display:block !important; }

#globalLeftMenu .lhBtn.lhBtnCity{
 display:none !important;
}
body.citySubScreenActive #globalLeftMenu .lhBtn.lhBtnCity{
 display:block !important;
}

:root{
 --invTopOffset: calc(var(--hudH) + 6px);
 --invBottomPad: 70px;
}

#inventoryScreen.overlayOnCity{
 top: var(--invTopOffset) !important;
 bottom: var(--invBottomPad) !important;
}

#inventoryScreen.overlayOnCity .invWrap{
 height: 100% !important;
 max-height: 100% !important;
}

#inventoryScreen.overlayOnCity{
 position:absolute !important;
 top: var(--hudH) !important;
 height: calc(100vh - var(--hudH) - 80px) !important;
 bottom:auto !important;
}

#inventoryScreen.overlayOnCity .invWrap{
 height:100% !important;
 max-height:100% !important;
}

.createClassBlock{ margin-top:10px; }
.createClassTitle{ font-size:12px; color:var(--muted); margin-bottom:6px; }
.createClassHint{ font-size:11px; color:var(--muted); margin-top:6px; opacity:.95; }
.createClassRow{ display:flex; gap:10px; align-items:center; justify-content:flex-start; flex-wrap:wrap; }

.classPickBtn{
 width: 96px;
 height: 96px;
 border: 0 !important;
 background: transparent !important;
 padding: 0 !important;
 margin: 0 !important;
 cursor: pointer;
 border-radius: 14px;
 outline: none !important;
 box-shadow: none !important;
 position: relative;
}
.classPickBtn img{
 width:100%;
 height:100%;
 object-fit: contain;
 display:block;
 pointer-events:none;
 user-select:none;
}
.classPickBtn::after{
 content:"";
 position:absolute;
 inset:-4px;
 border-radius: 16px;
 border: 2px solid transparent;
 opacity: .9;
}
.classPickBtn.selected::after{
 border-color: rgba(255,255,255,0.55);
 box-shadow: 0 0 0 2px rgba(0,0,0,0.35);
}
.classPickBtn:hover{ transform: translateY(-1px); }
.classPickBtn:active{ transform: translateY(0px) scale(0.99); }

.classPickBtn{
 border:0 !important;
 outline:0 !important;
 background:transparent !important;
 box-shadow:none !important;
}

.classPickBtn img{
 display:block;
 width:96px;
 height:96px;
 object-fit:contain;
 cursor:pointer;
 user-select:none;
 pointer-events:none;
 transition: transform .2s ease, filter .2s ease;
 filter: drop-shadow(0 8px 18px rgba(0,0,0,.55));
}

.classPickBtn:hover img{
 transform: translateY(-2px) scale(1.05);
}

.classPickBtn.selected img{
 transform: scale(1.08);
 animation: classPulse 1.8s ease-in-out infinite;
}

.classPickBtn.flash img{
 animation: classFlash .32s ease;
}

@keyframes classFlash{
 0%{
 transform: scale(1.12);
 filter:
 brightness(1.35)
 drop-shadow(0 0 26px rgba(255,255,255,.75))
 drop-shadow(0 10px 22px rgba(0,0,0,.55));
 }
 100%{
 transform: scale(1.08);
 filter: drop-shadow(0 8px 18px rgba(0,0,0,.55));
 }
}

@keyframes classPulse{
 0%,100%{ opacity:1; }
 50%{ opacity:.92; }
}

.classPickBtn.selected.warriorGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 26px rgba(255,70,70,.55));
}

.classPickBtn.selected.archerGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 26px rgba(80,255,140,.50));
}

.classPickBtn.selected.mageGlow img{
 filter:
 drop-shadow(0 10px 22px rgba(0,0,0,.65))
 drop-shadow(0 0 28px rgba(130,130,255,.55));
}

.classPickBtn,
.classPickBtn.selected{
 border: none !important;
 outline: none !important;
 background: transparent !important;
 box-shadow: none !important;
}

.classPickBtn::before,
.classPickBtn::after{
 display:none !important;
}

#createClassRow{
 position:absolute !important;
 right:120px !important;
 top:170px !important;
 display:flex !important;
 flex-direction:column !important;
 gap:36px !important;
 align-items:center !important;
}

html, body{ overflow-x:hidden; }

#createClassRow{
 position:absolute !important;
 right:120px !important;
 top:170px !important;
 display:flex !important;
 flex-direction:column !important;
 gap:36px !important;
 align-items:center !important;
}

.classPickBtn img{
 width:150px !important;
 height:150px !important;
}

#classPickerTitle{
 position:static !important;
 right:auto !important;
 top:auto !important;

 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:30px;
 font-weight:900;
 letter-spacing:1px;
 color:#7ad7ff;
 text-align:center;
 margin-bottom:10px;

 text-shadow:
 0 0 14px rgba(90,190,255,.7),
 0 4px 14px rgba(0,0,0,.85);
 pointer-events:none;
}

#classHoverTip{
 position:fixed;
 z-index:999999;
 padding:8px 12px;
 border-radius:10px;
 background:rgba(10,14,22,.88);
 color:#d7f4ff;
 font-family:"Cinzel","Trajan Pro","Georgia",serif;
 font-size:16px;
 font-weight:800;
 letter-spacing:.5px;
 text-shadow:0 2px 10px rgba(0,0,0,.85);
 box-shadow:
 0 0 18px rgba(90,190,255,.35),
 0 10px 30px rgba(0,0,0,.55);
 opacity:0;
 transform:translateY(6px);
 transition:opacity .12s ease, transform .12s ease;
 pointer-events:none;
 user-select:none;
 white-space:nowrap;
}

#classHoverTip.show{
 opacity:1;
 transform:translateY(0);
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 096 ===== */

#cityOverlay.cityOverlay{
 background: transparent !important;
 border: none !important;
 box-shadow: none !important;
 padding: 0 !important;
}

#cityOverlay.cityOverlay{
 filter:none !important;
}

#cityOverlay{ z-index: 99990 !important; }

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 097 ===== */

#dfMenu{
 background: linear-gradient(180deg, rgba(36,22,12,.98), rgba(20,12,7,.985)) !important;
 border:1px solid rgba(204,160,86,.32) !important;
 box-shadow: 0 18px 42px rgba(0,0,0,.72), inset 0 0 28px rgba(170,110,48,.10) !important;
}
#dfMenu::before,
#dfMenu::after{ display:none !important; }
#dfMenu .dfTop{
 background: linear-gradient(180deg, rgba(98,63,28,.96), rgba(54,32,16,.98)) !important;
 border: 1px solid rgba(214,171,92,.48) !important;
 box-shadow: 0 14px 30px rgba(0,0,0,.46), inset 0 1px 0 rgba(255,233,180,.10), inset 0 0 18px rgba(180,110,40,.18) !important;
}
#dfMenu .dfAvatar{
 background: linear-gradient(180deg, rgba(62,38,18,.95), rgba(30,18,9,.98)) !important;
 border: 1px solid rgba(214,171,92,.48) !important;
 box-shadow: inset 0 0 12px rgba(255,220,140,.08), 0 6px 14px rgba(0,0,0,.28) !important;
}
#dfMenu .dfName b,
#dfMenu .dfLvl,
#dfMenu #dfGold,
#dfMenu #dfGems,
#dfMenu #dfShards,
#dfMenu #dfXpTxt{
 color:#f4deb0 !important;
 text-shadow:0 1px 0 rgba(34,20,10,.82), 0 0 10px rgba(0,0,0,.22) !important;
}
#dfMenu .dfPill{
 background: linear-gradient(180deg, rgba(70,43,20,.92), rgba(34,21,11,.96)) !important;
 border: 1px solid rgba(214,171,92,.34) !important;
 box-shadow: inset 0 1px 0 rgba(255,240,200,.05) !important;
}
#dfMenu .dfXpBar{
 background: rgba(28,17,9,.72) !important;
 border: 1px solid rgba(214,171,92,.28) !important;
}
#dfMenu .dfXpFill{
 background: linear-gradient(90deg, rgba(212,155,68,.98), rgba(246,214,120,.95)) !important;
}

#shopUI > div[style*="left:58%"][style*="top:62%"]{ pointer-events:none !important; }
#shopUI > div[style*="left:58%"][style*="top:62%"] .kovarCard,
#shopUI > div[style*="left:58%"][style*="top:62%"] button{ pointer-events:auto !important; }
#shopScreen #shopBagGrid,
#shopScreen #shopBagGrid .slot,
#shopScreen #shopInvPrevBtn,
#shopScreen #shopInvNextBtn,
#shopScreen #shopInvPageTxt,
#shopScreen .invPager,
#shopScreen .invPagerBtn{ position:relative; z-index:100000 !important; pointer-events:auto !important; }

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 098 ===== */

#cityClickBlocker, .cityClickBlocker{display:none !important; pointer-events:none !important; background:transparent !important; opacity:0 !important;}
.bgWrap::before, .bgWrap::before{display:none !important; content:none !important;}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* ===== style block 099 ===== */

#createScreen .oaiClassTitle{
 margin-bottom:24px !important;
 transform: translateY(-8px);
}
#createScreen #createClassRow{
 margin-top:8px !important;
}

/* hide duel counter badge */
.duelCounter, .soubojCounter, .battleCounter{
display:none !important;
}

/* guild war battlefield background */
body{
background:url("img/guildy_battle.png") center center / cover no-repeat fixed;
}



/* === whole-window background fix === */
.cityOverlay{
  background-image:
    linear-gradient(180deg, rgba(18,18,22,.86), rgba(10,10,12,.86)),
    url("img/backround.png");
  background-size: auto, cover;
  background-position: center center, center center;
  background-repeat: no-repeat, no-repeat;
  background-blend-mode: normal, soft-light;
}

.panelBody,
#inventoryScreen.overlayOnCity .invPanel,
#inventoryScreen .invPanel,
.colCard,
.dunBody{
  background-image:
    linear-gradient(180deg, rgba(18,18,22,.82), rgba(10,10,12,.82)),
    url("img/backround.png");
  background-size: auto, cover;
  background-position: center center, center center;
  background-repeat: no-repeat, no-repeat;
  background-blend-mode: normal, soft-light;
}

.statCard,
.itemCard,
.coTab,
.detailBox,
.statsPanel{
  background-image: none !important;
}

/* ===== PVE LOCATION BACKGROUNDS V424 ===== */
.cavePanel[data-pve-location],
.templePanel[data-pve-location]{
  background-image:
    linear-gradient(180deg, rgba(7,9,14,.48), rgba(4,5,8,.72)),
    var(--pve-panel-bg) !important;
  background-size:cover !important;
  background-position:center !important;
  background-repeat:no-repeat !important;
}

.cavePanel[data-pve-location] .cavePanelWrap,
.templePanel[data-pve-location] .templeWrap{
  background:
    radial-gradient(circle at 50% 42%, rgba(9,11,16,.12), rgba(4,5,8,.46) 92%);
}

#worldBossInfoPanel[data-pve-location] .regionWrap{
  background-image:
    linear-gradient(180deg, rgba(12,11,16,.74), rgba(6,7,11,.90)),
    var(--pve-panel-bg) !important;
  background-size:cover !important;
  background-position:center !important;
  background-repeat:no-repeat !important;
}

#dungeonScreen[data-pve-location] .dunWrap{
  background:linear-gradient(180deg, rgba(3,5,8,.08), rgba(3,4,7,.34));
}

/* ===== EXACT IMAGE STYLE LEFT MENU ===== */
#leftHudMenu{
  position:absolute !important;
  left:16px !important;
  top:calc(var(--hudH) + 14px) !important;
  width:214px !important;
  padding:14px 12px 12px !important;
  border-radius:24px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,218,140,.10), rgba(0,0,0,0) 42%),
    linear-gradient(180deg, rgba(73,42,16,.98) 0%, rgba(39,19,7,.985) 58%, rgba(19,8,2,.99) 100%) !important;
  border:1px solid rgba(201,151,67,.58) !important;
  box-shadow:
    0 24px 44px rgba(0,0,0,.66),
    inset 0 1px 0 rgba(255,230,170,.18),
    inset 0 0 0 1px rgba(87,48,18,.90),
    inset 0 -18px 36px rgba(0,0,0,.36) !important;
  overflow: hidden !important;
}

#leftHudMenu::before{
  content:"" !important;
  position:absolute !important;
  inset:7px !important;
  border-radius:18px !important;
  pointer-events:none !important;
  border:1px solid rgba(171,121,50,.22) !important;
  box-shadow:
    inset 0 0 22px rgba(255,196,90,.05),
    inset 0 0 0 1px rgba(255,214,120,.04) !important;
}

#leftHudMenu::after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  pointer-events:none !important;
  background:
    linear-gradient(90deg, rgba(255,208,120,.04), rgba(0,0,0,0) 22%, rgba(0,0,0,0) 78%, rgba(255,208,120,.03)),
    linear-gradient(180deg, rgba(255,235,190,.04), rgba(0,0,0,0) 18%, rgba(0,0,0,0) 82%, rgba(255,180,80,.02)) !important;
}

#leftHudMenu .dfTop{
  position:relative !important;
  padding:10px 10px 9px !important;
  margin-bottom:12px !important;
  border-radius:18px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,225,150,.12), rgba(0,0,0,0) 42%),
    linear-gradient(180deg, rgba(98,58,24,.96) 0%, rgba(59,31,12,.97) 58%, rgba(35,17,7,.985) 100%) !important;
  border:1px solid rgba(217,164,76,.40) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,233,173,.18),
    inset 0 -10px 20px rgba(0,0,0,.25),
    0 8px 16px rgba(0,0,0,.44) !important;
}

#leftHudMenu .dfRow{
  gap:9px !important;
  align-items:flex-start !important;
}

#leftHudMenu .dfAvatar{
  width:48px !important;
  height:48px !important;
  border-radius:12px !important;
  border:1px solid rgba(200,150,74,.35) !important;
  box-shadow:
    inset 0 0 0 1px rgba(0,0,0,.45),
    0 3px 8px rgba(0,0,0,.35) !important;
}

#leftHudMenu .dfAvatar img{
  object-fit:cover !important;
}

#leftHudMenu .dfMeta{
  min-width:0 !important;
}

#leftHudMenu .dfName{
  display:flex !important;
  justify-content:space-between !important;
  align-items:center !important;
  gap:8px !important;
}

#leftHudMenu .dfName b{
  max-width:92px !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  color:#f6e0b1 !important;
  font-family:"Cinzel","Trajan Pro","Georgia",serif !important;
  font-size:11px !important;
  font-weight:800 !important;
  letter-spacing:.01em !important;
  text-shadow:0 1px 0 rgba(30,15,6,.9), 0 3px 8px rgba(0,0,0,.45) !important;
}

#leftHudMenu .dfLvl{
  color:#f4e5bf !important;
  font-family:"Cinzel","Trajan Pro","Georgia",serif !important;
  font-size:11px !important;
  font-weight:800 !important;
  white-space:nowrap !important;
  text-shadow:0 1px 0 rgba(30,15,6,.85), 0 3px 8px rgba(0,0,0,.42) !important;
}

#leftHudMenu .dfPills{
  display:flex !important;
  gap:6px !important;
  flex-wrap:wrap !important;
  margin-top:8px !important;
}

#leftHudMenu .dfPill{
  padding:4px 8px !important;
  min-height:0 !important;
  border-radius:999px !important;
  background:linear-gradient(180deg, rgba(55,28,11,.88), rgba(28,12,4,.92)) !important;
  border:1px solid rgba(198,149,72,.22) !important;
  color:#f1dcae !important;
  font-size:11px !important;
  font-weight:800 !important;
  box-shadow:inset 0 1px 0 rgba(255,230,170,.06) !important;
}

#leftHudMenu .dfXp{
  margin-top:8px !important;
}

#leftHudMenu .dfXpBar{
  height:11px !important;
  border-radius:999px !important;
  background:rgba(37,16,6,.78) !important;
  border:1px solid rgba(201,150,69,.24) !important;
  overflow:hidden !important;
}

#leftHudMenu .dfXpFill{
  background:linear-gradient(90deg, rgba(243,202,113,.96), rgba(255,222,142,.98)) !important;
  box-shadow:0 0 10px rgba(255,214,120,.25) !important;
}

#leftHudMenu .dfXpTxt{
  margin-top:5px !important;
  color:#e9d7b0 !important;
  font-size:11px !important;
  font-weight:800 !important;
  text-align:center !important;
  text-shadow:0 1px 0 rgba(29,14,5,.9) !important;
}

#leftHudMenu .dfSep{
  height:1px !important;
  margin:10px 4px !important;
  background:linear-gradient(90deg, rgba(0,0,0,0), rgba(198,150,74,.44), rgba(0,0,0,0)) !important;
  opacity:1 !important;
}

#leftHudMenu .lhBtn{
  position:relative !important;
  width:100% !important;
  min-height:0 !important;
  margin:8px 0 !important;
  padding:0 14px 0 16px !important;
  height:58px !important;
  border-radius:16px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:12px !important;
  overflow:hidden !important;

  font-family:"Cinzel","Trajan Pro","Georgia",serif !important;
  font-weight:800 !important;
  letter-spacing:.035em !important;
  text-transform:uppercase !important;
  color:#f5deb0 !important;

  background:
    radial-gradient(circle at 50% 0%, rgba(255,230,170,.16), rgba(0,0,0,0) 46%),
    linear-gradient(180deg, rgba(159,107,39,.98) 0%, rgba(118,73,28,.99) 44%, rgba(78,44,16,1) 70%, rgba(55,28,10,1) 100%) !important;

  border:1px solid rgba(228,175,84,.55) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,241,196,.30),
    inset 0 -12px 18px rgba(39,18,5,.28),
    0 10px 18px rgba(0,0,0,.40),
    0 0 0 1px rgba(81,44,15,.65) !important;

  transform:none !important;
}

#leftHudMenu .lhBtn::before{
  content:"" !important;
  position:absolute !important;
  left:11px !important;
  top:50% !important;
  width:34px !important;
  height:34px !important;
  transform:translateY(-50%) !important;
  border-radius:999px !important;
  background:
    radial-gradient(circle at 35% 30%, rgba(255,225,158,.34), rgba(0,0,0,0) 34%),
    linear-gradient(180deg, rgba(76,42,15,.98), rgba(32,15,5,.98)) !important;
  border:1px solid rgba(126,77,30,.90) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,237,191,.12),
    inset 0 -6px 10px rgba(0,0,0,.30),
    0 3px 6px rgba(0,0,0,.28) !important;
  z-index:0 !important;
}

#leftHudMenu .lhBtn:hover{
  background:
    radial-gradient(circle at 50% 0%, rgba(255,232,176,.19), rgba(0,0,0,0) 46%),
    linear-gradient(180deg, rgba(171,118,47,.99) 0%, rgba(129,81,32,1) 44%, rgba(88,51,19,1) 70%, rgba(63,32,11,1) 100%) !important;
  border-color:rgba(238,188,99,.72) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,244,205,.33),
    inset 0 -12px 18px rgba(39,18,5,.24),
    0 12px 20px rgba(0,0,0,.42),
    0 0 18px rgba(255,198,94,.10),
    0 0 0 1px rgba(89,50,18,.72) !important;
}

#leftHudMenu .lhBtn:active{
  transform:translateY(1px) !important;
}

#leftHudMenu .lhBtn.active{
  background:
    radial-gradient(circle at 50% 0%, rgba(255,235,186,.22), rgba(0,0,0,0) 48%),
    linear-gradient(180deg, rgba(183,130,58,1) 0%, rgba(140,90,37,1) 42%, rgba(97,57,22,1) 70%, rgba(70,36,13,1) 100%) !important;
  color:#fff0cb !important;
  border-color:rgba(245,198,112,.86) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,247,217,.40),
    inset 0 -12px 18px rgba(39,18,5,.22),
    0 12px 22px rgba(0,0,0,.46),
    0 0 16px rgba(255,203,97,.18),
    0 0 0 1px rgba(98,55,19,.74) !important;
}

#leftHudMenu .lhBtn .dfIco{
  position:relative !important;
  z-index:2 !important;
  width:34px !important;
  min-width:34px !important;
  text-align:center !important;
  font-size:18px !important;
  line-height:1 !important;
  filter:drop-shadow(0 1px 0 rgba(0,0,0,.55)) !important;
}

#leftHudMenu .lhBtn .dfLbl{
  position:relative !important;
  z-index:2 !important;
  flex:1 !important;
  display:block !important;
  text-align:center !important;
  padding-right:18px !important;
  font-size:11px !important;
  line-height:1.08 !important;
  letter-spacing:.065em !important;
  text-shadow:0 1px 0 rgba(31,16,7,.9), 0 2px 8px rgba(0,0,0,.28) !important;
}

#leftHudMenu .lhBtn[data-panel="city"]{
  display:none !important;
}
#leftHudMenu.show-back .lhBtn[data-panel="city"]{
  display:flex !important;
}

#cityScreen .cityOverlay{
  left:248px !important;
  right:16px !important;
  top:96px !important;
}

#cityClickBlocker{
  left:226px !important;
}

/* v114: defeat modal alignment - center over combat stage, not over left menu */
#rewardCard.defeat{
  margin-left: clamp(70px, 8vw, 170px);
}
@media (max-width: 900px){
  #rewardCard.defeat{
    margin-left: 0;
  }
}

/* v116 Pošta */
.mailLeftBtn{position:relative;}
.mailLeftBtn .mailBadge{position:absolute;right:9px;top:7px;min-width:18px;height:18px;border-radius:999px;background:#c53030;color:#fff;font-weight:900;font-size:11px;align-items:center;justify-content:center;padding:0 5px;box-shadow:0 0 10px rgba(255,0,0,.45);}
#mailPanel{position:fixed;inset:0;z-index:999999;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.35);backdrop-filter:blur(2px);}
#mailPanel.open{display:flex;}
.mailWindow{width:min(860px,82vw);height:min(560px,76vh);border:1px solid rgba(212,159,74,.55);border-radius:18px;background:linear-gradient(180deg,rgba(35,19,9,.96),rgba(13,8,5,.97));box-shadow:0 24px 80px rgba(0,0,0,.75),inset 0 0 30px rgba(212,159,74,.08);color:#f4dfb4;overflow:hidden;}
.mailHead{display:flex;justify-content:space-between;align-items:center;padding:16px 18px;border-bottom:1px solid rgba(212,159,74,.25);background:rgba(110,62,18,.35);}
.mailTitle{font-size:24px;font-weight:900;color:#ffd37a;text-shadow:0 0 10px rgba(255,190,80,.35);}
.mailSub{font-size:12px;opacity:.78;margin-top:3px;}
.mailClose{width:36px;height:36px;border-radius:10px;border:1px solid rgba(255,190,100,.45);background:rgba(50,20,10,.9);color:#ffd37a;font-weight:900;cursor:pointer;}
.mailTabs{display:flex;gap:8px;padding:10px 14px;border-bottom:1px solid rgba(212,159,74,.18);}
.mailTab{border:1px solid rgba(212,159,74,.35);border-radius:12px;background:rgba(80,43,14,.55);color:#e9c98c;padding:8px 16px;font-weight:800;cursor:pointer;}
.mailTab.active{background:linear-gradient(180deg,#99652a,#55300f);color:#fff3c8;box-shadow:0 0 12px rgba(255,174,61,.25);}
.mailBody{display:grid;grid-template-columns:330px 1fr;height:calc(100% - 118px);}
.mailList{border-right:1px solid rgba(212,159,74,.18);overflow:auto;padding:12px;}
.mailDetail{overflow:auto;padding:18px;}
.mailRow{width:100%;text-align:left;margin-bottom:9px;border:1px solid rgba(212,159,74,.25);border-radius:14px;background:rgba(28,14,7,.78);color:#f0d8a7;padding:11px;cursor:pointer;}
.mailRow.unread{border-color:rgba(255,205,99,.7);box-shadow:0 0 10px rgba(255,205,99,.12);}
.mailRow.active{background:rgba(98,54,18,.82);}
.mailRowTop{display:flex;justify-content:space-between;gap:12px;font-size:13px;}
.mailRowTop span{font-size:10px;opacity:.65;white-space:nowrap;}
.mailRowFrom,.mailRowReward{font-size:12px;opacity:.8;margin-top:5px;}
.mailDetailTitle{font-size:22px;font-weight:900;color:#ffd37a;margin-bottom:8px;}
.mailMeta{font-size:12px;opacity:.75;margin-bottom:16px;}
.mailText{line-height:1.45;color:#f3dfb7;margin-bottom:16px;}
.mailRewardsBox{border:1px solid rgba(212,159,74,.35);border-radius:16px;background:rgba(0,0,0,.22);padding:14px;margin:14px 0;}
.mailRewardsTitle{font-weight:900;color:#ffd37a;margin-bottom:8px;}
.mailRewardsLine{font-weight:800;margin-bottom:8px;}
.mailItemReward{display:flex;gap:8px;align-items:center;padding:7px 8px;border-radius:10px;background:rgba(255,255,255,.05);margin-top:6px;}
.mailItemReward small{opacity:.65;margin-left:auto;}
.mailClaimBtn,.mailDeleteBtn{border:1px solid rgba(212,159,74,.45);border-radius:12px;background:linear-gradient(180deg,#2f6fa0,#18405e);color:#fff;padding:10px 14px;font-weight:900;cursor:pointer;margin-top:10px;}
.mailClaimBtn:disabled{filter:grayscale(1);opacity:.65;cursor:default;}
.mailDeleteBtn{background:linear-gradient(180deg,#713020,#35120c);}
.mailEmpty,.mailPlaceholder{opacity:.7;padding:18px;text-align:center;}
@media(max-width:900px){.mailWindow{width:94vw;height:82vh}.mailBody{grid-template-columns:1fr}.mailDetail{border-top:1px solid rgba(212,159,74,.18)}}

/* v117 mail safe button fix */
.mailLeftBtn{position:relative!important;}
.mailLeftBtn .mailBadge{position:absolute;right:8px;top:6px;min-width:18px;height:18px;border-radius:999px;background:#c53030;color:#fff;font-weight:900;font-size:11px;align-items:center;justify-content:center;padding:0 5px;box-shadow:0 0 10px rgba(255,0,0,.45);z-index:5;}
#dfMenu .mailLeftBtn .mailBadge{right:10px;top:8px;}
#globalLeftMenu .mailLeftBtn .mailBadge,#leftHudMenu .mailLeftBtn .mailBadge{right:9px;top:7px;}

/* v118 mail compose */
.mailComposeBox{display:flex;flex-direction:column;gap:9px;max-width:520px;}
.mailComposeBox label{font-weight:900;color:#ffd37a;margin-top:4px;}
.mailComposeBox label small{font-weight:600;opacity:.65;color:#f4dfb4;}
.mailInput,.mailTextarea{width:100%;box-sizing:border-box;border:1px solid rgba(212,159,74,.35);border-radius:12px;background:rgba(0,0,0,.32);color:#f6dfb1;padding:11px 12px;outline:none;font-weight:700;}
.mailTextarea{min-height:150px;resize:vertical;line-height:1.4;font-weight:600;}
.mailInput:focus,.mailTextarea:focus{border-color:rgba(255,210,110,.75);box-shadow:0 0 12px rgba(255,190,80,.16);}
.mailComposeNote{font-size:12px;opacity:.72;line-height:1.35;margin-top:4px;}
.mailSendBtn{align-self:flex-start;border:1px solid rgba(212,159,74,.45);border-radius:12px;background:linear-gradient(180deg,#2f6fa0,#18405e);color:#fff;padding:10px 18px;font-weight:900;cursor:pointer;margin-top:8px;}
.mailSendBtn:hover{filter:brightness(1.08);}

/* v119 - profile mail button */
.profileMailBtnRow{display:flex;gap:8px;align-items:center;justify-content:center;}
.profileMailBtn{width:100%;}

/* === v129 direct fix: smaller left menu buttons === */
body.cityMenuOn #globalLeftMenu .lhBtn,
body #globalLeftMenu .lhBtn{
  height:58px !important;
  min-height:58px !important;
  max-height:58px !important;
  margin-bottom:7px !important;
  border-radius:15px !important;
}
body #globalLeftMenu{ width:220px !important; }
body #globalLeftMenu .lhBtn::before{ border-radius:15px !important; background-size:100% 100% !important; }
body #globalLeftMenu .lhBtn .txt{ font-size:11px !important; letter-spacing:.45px !important; line-height:1 !important; }

/* ===== v142 - Inventory unified RPG window polish =====
   Inventory now uses the same dark/gold RPG-window feeling as the other left-menu panels.
   CSS-only patch: does not touch character/save logic.
*/
#inventoryScreen.overlayOnCity,
#inventoryScreen.asOverlayPanel{
  background: rgba(0,0,0,.38) !important;
}

#inventoryScreen.overlayOnCity .bgWrap,
#inventoryScreen.asOverlayPanel .bgWrap,
#inventoryScreen.overlayOnCity .bg,
#inventoryScreen.asOverlayPanel .bg{
  background: transparent !important;
}

#inventoryScreen.overlayOnCity .invWrap,
#inventoryScreen.asOverlayPanel .invWrap,
#inventoryScreen .invWrap{
  position: relative !important;
  overflow: visible !important;
  background:
    linear-gradient(180deg, rgba(10,6,4,.00), rgba(4,3,3,.06)),
    radial-gradient(ellipse at 50% 0%, rgba(220,150,66,.08), transparent 42%),
    radial-gradient(ellipse at 22% 30%, rgba(255,206,112,.04), transparent 34%),
    radial-gradient(ellipse at 86% 78%, rgba(106,72,34,.08), transparent 36%),
    url("../img/inventory_armory_bg_bright.png"),
    linear-gradient(135deg, rgba(42,27,15,.98), rgba(18,12,9,.985) 48%, rgba(7,6,5,.99)) !important;
  background-size: cover, auto, auto, auto, cover, auto !important;
  background-position: center, center, center, center, center, center !important;
  border: 1px solid rgba(236,190,88,.78) !important;
  border-radius: 18px !important;
  box-shadow:
    0 24px 70px rgba(0,0,0,.78),
    inset 0 0 0 1px rgba(255,238,180,.09),
    inset 0 0 48px rgba(0,0,0,.58) !important;
  backdrop-filter: blur(5px) saturate(1.08) !important;
}

#inventoryScreen.overlayOnCity .invWrap::before,
#inventoryScreen.asOverlayPanel .invWrap::before,
#inventoryScreen .invWrap::before{
  content:"";
  position:absolute;
  inset:8px;
  border-radius:14px;
  border:1px solid rgba(255,220,140,.12);
  box-shadow: inset 0 0 28px rgba(255,172,54,.05);
  pointer-events:none;
  z-index:0;
}

#inventoryScreen.overlayOnCity .invWrap::after,
#inventoryScreen.asOverlayPanel .invWrap::after,
#inventoryScreen .invWrap::after{
  content:"INVENTÁŘ";
  position:absolute;
  left:22px;
  top:10px;
  height:26px;
  display:flex;
  align-items:center;
  padding:0 12px;
  border-radius:10px;
  background: linear-gradient(180deg, rgba(80,42,18,.88), rgba(29,15,8,.92));
  border:1px solid rgba(233,184,80,.34);
  color:#f3d48a;
  font-weight:800;
  font-size:12px;
  letter-spacing:.9px;
  text-shadow:0 2px 4px rgba(0,0,0,.7);
  pointer-events:none;
  z-index:4;
}

#inventoryScreen .invWrap > *{
  position: relative;
  z-index: 1;
}

#inventoryScreen #equipPanel,
#inventoryScreen #bagPanel,
#inventoryScreen #invStatsPanel{
  background:
    radial-gradient(ellipse at 50% 0%, rgba(255,204,105,.035), transparent 44%),
    linear-gradient(180deg, rgba(7,6,5,.58), rgba(2,2,2,.70)) !important;
  border: 1px solid rgba(221,174,75,.38) !important;
  border-radius: 14px !important;
  box-shadow:
    0 16px 36px rgba(0,0,0,.42),
    inset 0 0 20px rgba(0,0,0,.28) !important;
}

#inventoryScreen #btnInvClose.oaiInvCloseInside_v129,
#inventoryScreen .topClose,
#inventoryScreen .window-close{
  z-index: 80 !important;
}

/* Keep content clear of the new title strip where possible. */
#inventoryScreen.overlayOnCity .invWrap,
#inventoryScreen.asOverlayPanel .invWrap{
  padding-top: 42px !important;
}

/* ===== v143 - Inventory ghost frame + polish final =====
   Removes the leftover transparent/old inventory wrapper behind the new RPG window,
   tightens the top spacing, improves equipment slot readability and darkens stats panel.
*/
#inventoryScreen.overlayOnCity .bgWrap,
#inventoryScreen.asOverlayPanel .bgWrap,
#inventoryScreen .bgWrap,
#inventoryScreen.overlayOnCity .bg,
#inventoryScreen.asOverlayPanel .bg,
#inventoryScreen .bg,
#inventoryScreen #inventoryPanel,
#inventoryScreen .inventory-panel-bg,
#inventoryScreen .inventory-bg,
#inventoryScreen .inventory-wrapper,
#inventoryScreen .oldInventoryFrame,
#inventoryScreen .legacyInventoryFrame{
  background: transparent !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

/* Keep only the new main RPG frame on .invWrap. */
#inventoryScreen.overlayOnCity .invWrap,
#inventoryScreen.asOverlayPanel .invWrap,
#inventoryScreen .invWrap{
  margin-top: 0 !important;
  padding-top: 34px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(208,132,46,.16), transparent 40%),
    radial-gradient(circle at 18% 35%, rgba(255,198,91,.055), transparent 30%),
    linear-gradient(180deg, rgba(39,20,9,.96), rgba(13,7,4,.97)) !important;
  border: 1px solid rgba(236,190,88,.78) !important;
  box-shadow:
    0 24px 70px rgba(0,0,0,.78),
    inset 0 0 0 1px rgba(255,238,180,.09),
    inset 0 0 48px rgba(0,0,0,.58) !important;
}

#inventoryScreen.overlayOnCity .invWrap::after,
#inventoryScreen.asOverlayPanel .invWrap::after,
#inventoryScreen .invWrap::after{
  top: 8px !important;
  height: 24px !important;
}

#inventoryScreen #equipPanel{
  padding-top: 12px !important;
}

#inventoryScreen #invStatsPanel{
  background:
    radial-gradient(circle at 50% 0%, rgba(255,191,84,.06), transparent 42%),
    linear-gradient(180deg, rgba(15,7,3,.88), rgba(7,4,2,.94)) !important;
  border-left: 1px solid rgba(255,180,80,.22) !important;
}

#inventoryScreen #equipPanel .equipSlot,
#inventoryScreen .equipSlot{
  border: 1px solid rgba(255,190,85,.34) !important;
  background: rgba(0,0,0,.22) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255,226,150,.045),
    0 0 10px rgba(0,0,0,.32) !important;
}

#inventoryScreen #equipPanel .equipSlot:hover,
#inventoryScreen .equipSlot:hover{
  border-color: rgba(255,216,110,.72) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255,226,150,.08),
    0 0 14px rgba(255,182,65,.18) !important;
}

#inventoryScreen #bagPanel .invSlot,
#inventoryScreen .invSlot{
  background: rgba(0,0,0,.20) !important;
  border-color: rgba(255,190,85,.26) !important;
}


/* ===== SHOP LAYOUT v167: širší levý panel + 6 nabídek ===== */
#shopScreen .shopLayout{
  grid-template-columns: 420px minmax(0, 1fr) !important;
  grid-template-areas:
    "equip offers"
    "inventory offers" !important;
  gap: 14px !important;
  padding: 14px 18px 14px 18px !important;
  align-items: start !important;
}

#shopScreen .shopLayout > .pane:first-child,
#shopScreen .shopLayout > .pane:last-child{
  width: 420px !important;
  box-sizing: border-box !important;
}

#shopScreen .shopLayout > .pane:last-child .equipWrap,
#shopScreen .shopEquipWrap{
  height: 342px !important;
  min-height: 342px !important;
}

#shopScreen .shopLayout > .pane:last-child .paperMan,
#shopScreen #shopAvatarImg.invAvatar{
  width: 225px !important;
  height: 245px !important;
  max-width: 225px !important;
  max-height: 245px !important;
}

#shopScreen .shopLayout > .pane:last-child .equipSlot{
  width: 66px !important;
  height: 66px !important;
}

#shopScreen #shopBagGrid{
  grid-template-columns: repeat(5, 1fr) !important;
  gap: 8px !important;
}

#shopScreen .shopLayout > .pane:first-child .detailBox{
  height: 120px !important;
}

#shopScreen .shopLayout > .shopCenter{
  padding-top: 86px !important;
  padding-left: 28px !important;
  padding-right: 10px !important;
  justify-content: flex-start !important;
  align-items: flex-end !important;
}

#shopScreen .shopCenter .offersGrid,
#shopScreen .offersGrid{
  width: min(780px, 100%) !important;
  max-width: 780px !important;
  margin-left: auto !important;
  margin-right: 0 !important;
  grid-template-columns: repeat(2, minmax(300px, 1fr)) !important;
  gap: 12px !important;
}

#shopScreen .shopCenter .itemCard,
#shopScreen .shopCard,
#shopScreen .kovarCard{
  min-height: 112px !important;
}

@media (max-width: 1400px){
  #shopScreen .shopLayout{
    grid-template-columns: 385px minmax(0, 1fr) !important;
  }
  #shopScreen .shopLayout > .pane:first-child,
  #shopScreen .shopLayout > .pane:last-child{
    width: 385px !important;
  }
  #shopScreen .shopLayout > .shopCenter{
    padding-left: 14px !important;
  }
  #shopScreen .shopCenter .offersGrid,
  #shopScreen .offersGrid{
    grid-template-columns: repeat(2, minmax(250px, 1fr)) !important;
  }
}

/* v202: game-style shop dragging, no browser drag preview */
#shopScreen .itemCard,
#shopScreen .slot,
#shopScreen .equipSlot,
#shopScreen img{
  -webkit-user-drag: none !important;
  user-select: none !important;
}
#shopScreen .gameDraggable{ cursor: grab; }
#shopScreen .gameDraggable:active{ cursor: grabbing; }
body.gameDragging,
body.gameDragging *{
  cursor: grabbing !important;
  user-select: none !important;
}
.gameDragGhost{
  position: fixed;
  z-index: 999999;
  width: 68px;
  height: 68px;
  pointer-events: none;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px solid rgba(255,215,90,.9);
  border-radius: 12px;
  background: radial-gradient(circle at 50% 35%, rgba(255,225,120,.22), rgba(25,12,4,.82));
  box-shadow: 0 0 18px rgba(255,210,70,.65), inset 0 0 18px rgba(0,0,0,.55);
}
.gameDragGhost img{
  max-width: 58px;
  max-height: 58px;
  object-fit: contain;
  pointer-events: none;
  -webkit-user-drag: none;
}
#shopScreen .isDraggingSource{
  opacity: .55;
  filter: brightness(1.15);
}


/* v219 tighter shop equipment spacing */
.shop-character-panel .equipment-grid,
.shop-avatar-panel .equipment-grid,
.shop-equipment-slots {
    gap: 4px !important;
}

.shop-character-panel .equipment-slot,
.shop-avatar-panel .equipment-slot {
    margin: 1px !important;
}

/* kovar frame */
.kovarPanel,.kovar-panel,.reforge-panel,.upgrade-panel{background:rgba(18,14,10,.92)!important;border:2px solid #b58a45!important;border-radius:18px!important;box-shadow:0 0 20px rgba(0,0,0,.45)!important;}


/* ===== build275: kovar frame only + shop inventory/layout restore ===== */
/* Kovář: neprůhledné okno s jedním vnějším rámem, bez vnitřního tenkého rámečku. */
#shopScreen .kovarCard{
  position: relative !important;
  overflow: hidden !important;
  background:
    linear-gradient(180deg, rgba(58,33,14,.98), rgba(22,11,5,.99)) !important;
  border: 2px solid rgba(214,166,75,.88) !important;
  border-radius: 18px !important;
  box-shadow:
    0 18px 42px rgba(0,0,0,.72),
    inset 0 0 34px rgba(0,0,0,.52),
    0 0 22px rgba(213,145,42,.16) !important;
  backdrop-filter: none !important;
}
#shopScreen .kovarCard::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  border:0 !important;
  border-radius:18px !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,191,83,.10), transparent 45%),
    repeating-linear-gradient(135deg, rgba(255,255,255,.022) 0 1px, transparent 1px 8px) !important;
  box-shadow:none !important;
  pointer-events:none !important;
  opacity:1 !important;
}
#shopScreen .kovarCard::after{
  content:none !important;
  display:none !important;
  border:0 !important;
  box-shadow:none !important;
  background:none !important;
}
#shopScreen .kovarCard > *{
  position:relative !important;
  z-index:1 !important;
}
/* Kovář/šejdíř: zprávu o obnovení nabídky opravdu schovat i při překreslení UI. */
#shopScreen:has(#shopUI.oaiKovarTabsV255) .shopCountdown,
#shopScreen.oaiNoShopCountdown .shopCountdown{
  display:none !important;
}
/* Vrácení inventáře v obchodech/kováři na normální velikost po build274. */
#shopScreen .shopLayout{
  min-width:0 !important;
  contain:none !important;
}
#shopScreen #shopBagGrid{
  height:auto !important;
  min-height:0 !important;
  contain:none !important;
}
#shopScreen .shopLayout > .pane:first-child{
  min-height:0 !important;
  height:auto !important;
}
/* Normální obchody: pevnější karta při nákupu, aby se nabídka při rerenderu nezmenšila a neroztáhla. */
#shopScreen:not(:has(#shopUI.oaiKovarTabsV255)) .offersGrid{
  grid-auto-rows:112px !important;
  align-items:stretch !important;
}
#shopScreen:not(:has(#shopUI.oaiKovarTabsV255)) .shopCard:not(.kovarCard),
#shopScreen:not(:has(#shopUI.oaiKovarTabsV255)) .itemCard{
  height:112px !important;
  min-height:112px !important;
  max-height:112px !important;
  box-sizing:border-box !important;
  overflow:hidden !important;
  transform:none !important;
  transition:border-color .12s ease, box-shadow .12s ease, filter .12s ease !important;
}
#shopScreen .itemCard.soldOut{
  position:relative !important;
  border-color:rgba(226,82,82,.85) !important;
  background:linear-gradient(135deg, rgba(70,18,18,.78), rgba(0,0,0,.52)) !important;
  filter:saturate(.55) !important;
  opacity:.82 !important;
  cursor:not-allowed !important;
}
#shopScreen .itemCard.soldOut::after{
  content:"VYPRODÁNO";
  position:absolute;
  top:10px;
  right:10px;
  z-index:3;
  padding:4px 7px;
  border:1px solid rgba(255,150,150,.8);
  border-radius:6px;
  background:rgba(125,20,20,.92);
  color:#ffe4e4;
  font-size:10px;
  font-weight:1000;
  letter-spacing:.06em;
  text-shadow:0 1px 3px rgba(0,0,0,.7);
  pointer-events:none;
}
#shopScreen .itemCard.soldOut .dragHint{
  color:#ff9a9a !important;
  font-weight:1000;
}

/* ===== build297: Warehouse / Sklad ===== */
#city2Screen .warehouseHotspot{
  position:absolute;
  left:73.8%;
  top:52.2%;
  width:17.2%;
  height:28.2%;
  z-index:62;
  cursor:pointer;
  pointer-events:auto;
  border-radius:16px;
  background:rgba(255,255,255,0);
  transform:translateZ(0);
  will-change:auto;
}
#city2Screen .warehouseHotspot:hover{
  box-shadow:inset 0 0 0 2px rgba(255,220,140,.34),0 0 22px rgba(255,200,120,.18);
}
#warehouseOverlay{position:fixed;inset:0;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.48);z-index:2147482500;color:#f8e7bd;pointer-events:auto;}
#warehouseOverlay.active{display:flex;}
.warehouseWin{width:min(1280px,94vw);height:min(820px,90vh);background:linear-gradient(180deg,rgba(42,22,8,.98),rgba(16,8,4,.98));border:2px solid rgba(205,143,45,.75);border-radius:18px;box-shadow:0 24px 90px rgba(0,0,0,.82),inset 0 0 42px rgba(255,183,58,.09);position:relative;padding:16px;overflow:hidden;}
.warehouseWin:before{content:"";position:absolute;inset:8px;border:1px solid rgba(255,206,115,.20);border-radius:14px;pointer-events:none;}
.warehouseClose{position:absolute;right:18px;top:14px;z-index:2;width:34px;height:34px;border-radius:999px;border:1px solid rgba(255,215,130,.45);background:rgba(70,35,9,.95);color:#ffe0a0;font-weight:900;cursor:pointer;}
.warehouseHead{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;padding:4px 46px 12px 4px;border-bottom:1px solid rgba(255,214,127,.16);}
.warehouseHead h2{margin:0;color:#ffd782;text-transform:uppercase;letter-spacing:.08em;text-shadow:0 2px 8px #000;font-size:24px;}
.warehouseHead p{margin:5px 0 0;color:#d8c29a;font-size:13px;}
.warehouseCurrency{display:flex;gap:8px;align-items:center;background:rgba(0,0,0,.28);border:1px solid rgba(255,210,120,.22);border-radius:12px;padding:8px 12px;font-weight:900;}
.warehouseBody{display:grid;grid-template-columns:420px 1fr;gap:14px;height:calc(100% - 75px);padding-top:14px;position:relative;z-index:1;}
.warehousePanel{background:linear-gradient(180deg,rgba(39,19,6,.92),rgba(20,9,3,.92));border:1px solid rgba(197,132,42,.55);border-radius:14px;box-shadow:inset 0 0 22px rgba(0,0,0,.34);padding:12px;min-height:0;overflow:hidden;position:relative;}
.warehousePanelTop{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;}
.warehousePanelTop h3{margin:0;color:#ffd782;text-transform:uppercase;letter-spacing:.06em;font-size:15px;}
.warehouseMiniBtn,.warehousePageBtn,#warehouseUnlockBtn{border:1px solid rgba(255,210,120,.35);background:linear-gradient(#8b5619,#4d2808);color:#ffe1a3;border-radius:9px;padding:6px 10px;font-weight:900;cursor:pointer;}
.warehouseMiniBtn:hover,.warehousePageBtn:hover,#warehouseUnlockBtn:hover{filter:brightness(1.12);}
.warehouseEquip{display:grid;grid-template-columns:repeat(4,64px);gap:9px;justify-content:center;margin-bottom:14px;padding:10px;background:rgba(0,0,0,.18);border-radius:12px;border:1px solid rgba(255,210,120,.10);}
.warehouseAllPagesLabel{color:#d8c29a;font-size:11px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;}
.warehouseBag{display:grid;grid-template-columns:repeat(6,54px);grid-auto-rows:54px;gap:8px;justify-content:center;align-content:start;max-height:calc(100% - 40px);overflow:auto;padding:4px 4px 10px;}
.warehouseGrid{display:grid;grid-template-columns:repeat(8,60px);grid-auto-rows:60px;gap:9px;justify-content:center;align-content:start;max-height:calc(100% - 48px);overflow:auto;padding:4px 4px 10px;}
.whSlot{width:100%;height:100%;border-radius:9px;border:1px solid rgba(213,164,64,.74);background:linear-gradient(180deg,rgba(63,36,10,.66),rgba(19,11,4,.76));box-shadow:inset 0 0 12px rgba(0,0,0,.42);display:grid;place-items:center;position:relative;user-select:none;-webkit-user-drag:none;}
.whSlot img{max-width:86%;max-height:86%;object-fit:contain;pointer-events:none;-webkit-user-drag:none;filter:drop-shadow(0 4px 6px rgba(0,0,0,.6));}
.whSlot span{font-size:10px;color:rgba(248,225,168,.56);font-weight:800;text-align:center;padding:2px;}
.whSlot.slot-common{box-shadow:inset 0 0 12px rgba(0,0,0,.42),0 0 0 1px rgba(61,255,100,.45);}
.whSlot.slot-epic{box-shadow:inset 0 0 12px rgba(0,0,0,.42),0 0 0 1px rgba(185,86,255,.55),0 0 12px rgba(162,71,255,.20);}
.whSlot.slot-legendary{box-shadow:inset 0 0 12px rgba(0,0,0,.42),0 0 0 1px rgba(255,197,59,.72),0 0 16px rgba(255,180,48,.26);}
.whSlot.slot-plus5:after{content:"";position:absolute;inset:-3px;border-radius:12px;box-shadow:0 0 14px rgba(255,213,90,.55);pointer-events:none;}
.whSlot.dragOver{outline:2px solid rgba(255,226,130,.95);outline-offset:2px;background:rgba(118,77,20,.72);}
.warehouseDraggingSource{opacity:.35;}
.warehouseDragGhost{position:fixed;z-index:2147483000;width:58px;height:58px;pointer-events:none;border-radius:10px;display:grid;place-items:center;background:rgba(45,24,8,.92);border:1px solid rgba(255,214,120,.55);box-shadow:0 12px 32px rgba(0,0,0,.7);}
.warehouseDragGhost img{max-width:88%;max-height:88%;object-fit:contain;}
.warehousePageBtn{min-width:54px;margin-left:6px;position:relative;}
.warehousePageBtn.active{outline:2px solid rgba(255,226,130,.72);}
.warehousePageBtn.locked{filter:grayscale(.15) brightness(.78);}
.warehousePageBtn small{display:block;font-size:10px;color:#dff2ff;margin-top:2px;}
.warehouseLocked{position:absolute;inset:54px 12px 12px 12px;display:none;align-items:center;justify-content:center;text-align:center;border-radius:12px;background:rgba(0,0,0,.58);z-index:3;border:1px solid rgba(255,210,120,.18);}
.warehouseLocked b{font-size:18px;color:#ffd782;}.warehouseLocked p{color:#d8c29a;}
@media(max-width:1050px){.warehouseBody{grid-template-columns:1fr;overflow:auto}.warehouseWin{height:92vh}.warehouseGrid{grid-template-columns:repeat(8,52px);grid-auto-rows:52px}.warehouseBag{grid-template-columns:repeat(6,50px);grid-auto-rows:50px}}

/* ===== create screen visual refresh ===== */
#createScreen .bgWrap,
#createScreen .bg{
  background:
    radial-gradient(circle at 50% 44%, rgba(214,143,54,.12), transparent 36%),
    linear-gradient(90deg, rgba(0,0,0,.82), rgba(0,0,0,.22) 28%, rgba(0,0,0,.22) 72%, rgba(0,0,0,.82)) !important;
}

#createScreen .bg > img{
  opacity:.78 !important;
  filter:saturate(.98) contrast(1.08) brightness(.84) !important;
}

#createScreen #createPanel{
  top:0 !important;
  padding:clamp(18px, 4vh, 54px) clamp(18px, 5vw, 76px) !important;
  align-items:center !important;
}

#createScreen #createPanel .panel{
  width:min(1120px, 88vw) !important;
  max-width:1120px !important;
  min-height:0 !important;
  display:grid !important;
  grid-template-columns:minmax(330px, .92fr) minmax(320px, .72fr) !important;
  gap:34px !important;
  align-items:stretch !important;
  padding:28px !important;
  border-radius:22px !important;
  background:
    linear-gradient(120deg, rgba(34,19,10,.92), rgba(10,8,7,.88) 52%, rgba(7,5,5,.94)),
    radial-gradient(circle at 35% 20%, rgba(255,193,93,.14), transparent 42%) !important;
  border:1px solid rgba(236,185,107,.22) !important;
  box-shadow:
    0 26px 80px rgba(0,0,0,.72),
    inset 0 1px 0 rgba(255,255,255,.10),
    inset 0 0 70px rgba(0,0,0,.38) !important;
  backdrop-filter:blur(10px) saturate(1.08) !important;
  position:relative !important;
  overflow:hidden !important;
}

#createScreen #createPanel .panel:before{
  content:"";
  position:absolute;
  inset:10px;
  border:1px solid rgba(255,220,151,.09);
  border-radius:17px;
  pointer-events:none;
}

#createScreen #createPanel .panel:after{
  content:"";
  position:absolute;
  left:51%;
  top:28px;
  bottom:28px;
  width:1px;
  background:linear-gradient(180deg, transparent, rgba(255,219,151,.22), transparent);
  pointer-events:none;
}

#createScreen .oaiCreateLeft,
#createScreen .oaiCreateRight{
  position:relative !important;
  z-index:1 !important;
  min-width:0 !important;
}

#createScreen .oaiCreateLeft{
  display:grid !important;
  grid-template-rows:auto 1fr auto !important;
  gap:16px !important;
}

#createScreen .oaiCreateLeft h2{
  margin:0 0 12px !important;
  font-family:"Cinzel","Georgia",serif !important;
  font-size:clamp(25px, 2.1vw, 34px) !important;
  line-height:1 !important;
  color:#ffe6bd !important;
  text-shadow:0 4px 18px rgba(0,0,0,.75), 0 0 18px rgba(231,149,61,.28) !important;
}

#createScreen .oaiLabel{
  display:block !important;
  margin:0 0 7px !important;
  color:#cfb894 !important;
  font-size:12px !important;
  font-weight:800 !important;
  text-transform:uppercase !important;
}

#createScreen #nameInput{
  height:44px !important;
  border-radius:12px !important;
  padding:0 14px !important;
  background:rgba(12,8,6,.62) !important;
  border:1px solid rgba(255,221,167,.20) !important;
  color:#fff4dd !important;
  font-weight:800 !important;
  box-shadow:inset 0 1px 10px rgba(0,0,0,.35) !important;
}

#createScreen #nameInput:focus{
  border-color:rgba(120,203,255,.62) !important;
  box-shadow:0 0 0 3px rgba(80,170,255,.13), inset 0 1px 10px rgba(0,0,0,.35) !important;
}

#createScreen .oaiAvatarCard{
  min-height:0 !important;
  padding:14px !important;
  gap:12px !important;
  border-radius:18px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(0,0,0,.16)),
    radial-gradient(circle at 50% 0%, rgba(255,197,105,.10), transparent 52%) !important;
  border:1px solid rgba(255,225,171,.15) !important;
  box-shadow:inset 0 0 24px rgba(0,0,0,.24) !important;
}

#createScreen .oaiAvatarPreview{
  width:100% !important;
  height:auto !important;
  aspect-ratio:1.18 / 1 !important;
  max-height:340px !important;
  border-radius:18px !important;
  border:1px solid rgba(255,227,177,.22) !important;
  background:
    radial-gradient(circle at 50% 18%, rgba(255,204,125,.18), transparent 44%),
    linear-gradient(180deg, rgba(10,6,4,.40), rgba(0,0,0,.42)) !important;
  box-shadow:0 18px 44px rgba(0,0,0,.50), inset 0 0 30px rgba(0,0,0,.26) !important;
}

#createScreen #createAvatarMain{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center 18% !important;
  border:0 !important;
  border-radius:17px !important;
  background:transparent !important;
  box-shadow:none !important;
}

#createScreen #btnPickAvatar,
#createScreen #btnStart{
  height:44px !important;
  border-radius:12px !important;
  font-weight:900 !important;
  letter-spacing:0 !important;
}

#createScreen #btnPickAvatar{
  color:#ffe6bc !important;
  background:linear-gradient(180deg, rgba(125,83,40,.56), rgba(34,20,11,.70)) !important;
  border:1px solid rgba(255,216,155,.22) !important;
}

#createScreen #btnStart{
  margin-top:0 !important;
  color:#f7fbff !important;
  background:linear-gradient(180deg, rgba(48,155,225,.78), rgba(18,72,120,.86)) !important;
  border:1px solid rgba(121,211,255,.55) !important;
  box-shadow:0 12px 28px rgba(0,0,0,.36), 0 0 22px rgba(56,164,240,.18) !important;
}

#createScreen .oaiCreateRight{
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  align-items:stretch !important;
  gap:20px !important;
  padding:18px 10px !important;
}

#createScreen .oaiClassTitle{
  margin:0 !important;
  font-family:"Cinzel","Georgia",serif !important;
  font-size:clamp(24px, 2vw, 32px) !important;
  font-weight:900 !important;
  letter-spacing:0 !important;
  text-align:center !important;
  color:#8edcff !important;
  text-shadow:0 0 18px rgba(80,184,255,.50), 0 4px 16px rgba(0,0,0,.82) !important;
}

#createScreen #classPickerTitle{
  display:none !important;
}

#createScreen #createClassRow{
  position:static !important;
  width:100% !important;
  margin:0 !important;
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:13px !important;
  align-items:stretch !important;
  justify-content:stretch !important;
}

#createScreen #createClassRow .classPickBtn{
  width:100% !important;
  height:auto !important;
  min-height:150px !important;
  padding:14px 10px 34px !important;
  border-radius:16px !important;
  border:1px solid rgba(255,223,170,.14) !important;
  background:
    radial-gradient(circle at 50% 24%, rgba(255,255,255,.11), transparent 42%),
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(0,0,0,.24)) !important;
  box-shadow:inset 0 0 26px rgba(0,0,0,.28), 0 12px 28px rgba(0,0,0,.25) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  transform:none !important;
  transition:transform .16s ease, border-color .16s ease, box-shadow .16s ease, filter .16s ease !important;
}

#createScreen #createClassRow .classPickBtn:hover{
  transform:translateY(-2px) !important;
  border-color:rgba(142,220,255,.36) !important;
}

#createScreen #createClassRow .classPickBtn img{
  width:96px !important;
  height:96px !important;
  object-fit:contain !important;
  filter:drop-shadow(0 12px 18px rgba(0,0,0,.64)) !important;
  transform:none !important;
}

#createScreen #createClassRow .classPickBtn:after{
  content:"Class" !important;
  display:block !important;
  position:absolute !important;
  top:auto !important;
  left:10px !important;
  right:10px !important;
  bottom:10px !important;
  height:auto !important;
  color:#e8d1a9 !important;
  font-size:12px !important;
  font-weight:900 !important;
  text-align:center !important;
  text-transform:uppercase !important;
  letter-spacing:0 !important;
  border:0 !important;
  box-shadow:none !important;
  opacity:.92 !important;
}

#createScreen #createClassRow .classPickBtn[data-pclass="warrior"]:after{ content:"Bojovník" !important; }
#createScreen #createClassRow .classPickBtn[data-pclass="archer"]:after{ content:"Lučištník" !important; }
#createScreen #createClassRow .classPickBtn[data-pclass="mage"]:after{ content:"Mág" !important; }

#createScreen #createClassRow .classPickBtn.selected,
#createScreen #createClassRow .classPickBtn.active{
  border-color:rgba(126,211,255,.70) !important;
  box-shadow:
    inset 0 0 28px rgba(83,180,255,.12),
    0 0 0 2px rgba(126,211,255,.17),
    0 18px 40px rgba(0,0,0,.36),
    0 0 30px rgba(80,184,255,.22) !important;
}

#createScreen #createClassRow .classPickBtn.selected img,
#createScreen #createClassRow .classPickBtn.active img{
  animation:none !important;
  transform:scale(1.06) !important;
}

#createScreen .faceBuilderWrap,
#createScreen .createAvatarGrid,
#createScreen #avatarPickGrid,
#createScreen .statRow,
#createScreen .createClassHint,
#createScreen .createClassTitle{
  display:none !important;
}

#avatarPickerCard{
  background:linear-gradient(180deg, rgba(40,24,13,.98), rgba(9,7,6,.98)) !important;
  border-color:rgba(255,220,150,.24) !important;
}

@media (max-width: 980px){
  #createScreen{
    overflow:auto !important;
  }

  #createScreen #createPanel{
    position:absolute !important;
    min-height:100vh !important;
    padding:18px !important;
  }

  #createScreen #createPanel .panel{
    width:min(560px, 94vw) !important;
    grid-template-columns:1fr !important;
    gap:18px !important;
    padding:20px !important;
  }

  #createScreen #createPanel .panel:after{
    display:none !important;
  }

  #createScreen .oaiCreateRight{
    padding:6px 0 0 !important;
  }

  #createScreen #createClassRow{
    grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  }

  #createScreen #createClassRow .classPickBtn{
    min-height:122px !important;
    padding-bottom:30px !important;
  }

  #createScreen #createClassRow .classPickBtn img{
    width:74px !important;
    height:74px !important;
  }
}

@media (max-height: 760px) and (min-width: 981px){
  #createScreen #createPanel .panel{
    width:min(1040px, 88vw) !important;
    padding:22px !important;
    gap:26px !important;
  }

  #createScreen .oaiAvatarPreview{
    max-height:270px !important;
  }

  #createScreen #createClassRow .classPickBtn{
    min-height:126px !important;
  }

  #createScreen #createClassRow .classPickBtn img{
    width:78px !important;
    height:78px !important;
  }
}

/* ===== create screen class carousel ===== */
#createScreen .oaiClassCarousel{
  display:grid !important;
  grid-template-columns:48px minmax(210px, 260px) 48px !important;
  gap:14px !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
}

#createScreen .classArrow{
  width:48px !important;
  height:56px !important;
  border-radius:14px !important;
  border:1px solid rgba(142,220,255,.28) !important;
  background:
    radial-gradient(circle at 50% 25%, rgba(142,220,255,.15), transparent 48%),
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(0,0,0,.30)) !important;
  color:#aee6ff !important;
  font-size:34px !important;
  line-height:1 !important;
  font-weight:900 !important;
  cursor:pointer !important;
  box-shadow:0 12px 28px rgba(0,0,0,.34), inset 0 0 18px rgba(0,0,0,.28) !important;
  transition:transform .14s ease, border-color .14s ease, filter .14s ease !important;
}

#createScreen .classArrow:hover{
  transform:translateY(-1px) !important;
  border-color:rgba(142,220,255,.60) !important;
  filter:brightness(1.12) !important;
}

#createScreen .classArrow:active{
  transform:translateY(0) scale(.98) !important;
}

#createScreen #createClassRow{
  display:grid !important;
  grid-template-columns:1fr !important;
  width:100% !important;
  min-width:0 !important;
}

#createScreen #createClassRow .classPickBtn{
  display:none !important;
}

#createScreen #createClassRow .classPickBtn.selected,
#createScreen #createClassRow .classPickBtn.active{
  display:flex !important;
  width:100% !important;
  min-height:210px !important;
  padding:22px 16px 44px !important;
  border-radius:20px !important;
}

#createScreen #createClassRow .classPickBtn img{
  width:128px !important;
  height:128px !important;
}

#createScreen #createClassRow .classPickBtn:after{
  bottom:16px !important;
  font-size:15px !important;
  color:#ffe3ad !important;
}

#createScreen .oaiClassInfo{
  width:min(390px, 100%) !important;
  margin:0 auto !important;
  padding:16px 18px !important;
  border-radius:18px !important;
  border:1px solid rgba(255,223,170,.16) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(142,220,255,.10), transparent 50%),
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(0,0,0,.20)) !important;
  box-shadow:inset 0 0 22px rgba(0,0,0,.26), 0 12px 30px rgba(0,0,0,.24) !important;
  color:#ead8b8 !important;
  text-align:left !important;
}

#createScreen .oaiClassName{
  font-family:"Cinzel","Georgia",serif !important;
  font-size:22px !important;
  font-weight:900 !important;
  color:#ffe6bd !important;
  text-align:center !important;
  margin-bottom:4px !important;
}

#createScreen .oaiClassTag{
  color:#8edcff !important;
  text-align:center !important;
  font-size:13px !important;
  font-weight:900 !important;
  margin-bottom:10px !important;
}

#createScreen .oaiClassInfo p{
  margin:0 0 12px !important;
  color:#e6d8c3 !important;
  font-size:13px !important;
  line-height:1.45 !important;
}

#createScreen .oaiClassSpecial{
  margin:0 0 10px !important;
  padding:9px 10px !important;
  border-radius:12px !important;
  border:1px solid rgba(142,220,255,.18) !important;
  background:rgba(80,184,255,.075) !important;
  color:#bfeaff !important;
  font-size:12px !important;
  line-height:1.35 !important;
  font-weight:900 !important;
  text-align:center !important;
}

#createScreen .oaiClassLine{
  margin-top:8px !important;
  padding-top:8px !important;
  border-top:1px solid rgba(255,223,170,.11) !important;
  color:#d6c09d !important;
  font-size:12px !important;
  line-height:1.35 !important;
  font-weight:800 !important;
}

#createScreen .oaiCreateRight[data-class="warrior"] #createClassRow .classPickBtn.selected,
#createScreen .oaiCreateRight[data-class="warrior"] #createClassRow .classPickBtn.active{
  border-color:rgba(255,95,82,.54) !important;
  box-shadow:inset 0 0 30px rgba(255,95,82,.10), 0 0 34px rgba(255,95,82,.20), 0 18px 40px rgba(0,0,0,.34) !important;
}

#createScreen .oaiCreateRight[data-class="archer"] #createClassRow .classPickBtn.selected,
#createScreen .oaiCreateRight[data-class="archer"] #createClassRow .classPickBtn.active{
  border-color:rgba(110,255,154,.50) !important;
  box-shadow:inset 0 0 30px rgba(110,255,154,.08), 0 0 34px rgba(110,255,154,.17), 0 18px 40px rgba(0,0,0,.34) !important;
}

#createScreen .oaiCreateRight[data-class="mage"] #createClassRow .classPickBtn.selected,
#createScreen .oaiCreateRight[data-class="mage"] #createClassRow .classPickBtn.active{
  border-color:rgba(103,160,255,.58) !important;
  box-shadow:inset 0 0 30px rgba(103,160,255,.12), 0 0 34px rgba(103,160,255,.22), 0 18px 40px rgba(0,0,0,.34) !important;
}

@media (max-width: 980px){
  #createScreen .oaiClassCarousel{
    grid-template-columns:42px minmax(180px, 1fr) 42px !important;
    gap:10px !important;
  }

  #createScreen .classArrow{
    width:42px !important;
    height:50px !important;
    font-size:30px !important;
  }

  #createScreen #createClassRow .classPickBtn.selected,
  #createScreen #createClassRow .classPickBtn.active{
    min-height:160px !important;
  }

  #createScreen #createClassRow .classPickBtn img{
    width:100px !important;
    height:100px !important;
  }
}

@media (max-height: 760px) and (min-width: 981px){
  #createScreen #createClassRow .classPickBtn.selected,
  #createScreen #createClassRow .classPickBtn.active{
    min-height:160px !important;
  }

  #createScreen #createClassRow .classPickBtn img{
    width:100px !important;
    height:100px !important;
  }

  #createScreen .oaiClassInfo{
    padding:12px 14px !important;
  }
}

/* ===== avatar picker gender tabs ===== */
#avatarPickerTabs{
  display:flex !important;
  gap:10px !important;
  margin:0 0 14px !important;
}

.avatarPickerTab{
  flex:1 1 0 !important;
  height:42px !important;
  border-radius:12px !important;
  border:1px solid rgba(255,223,170,.18) !important;
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(0,0,0,.22)) !important;
  color:#dec8a6 !important;
  font-weight:900 !important;
  line-height:1 !important;
  cursor:pointer !important;
  display:grid !important;
  place-items:center !important;
}

.avatarPickerTab.active{
  color:#f8fbff !important;
  border-color:rgba(126,211,255,.55) !important;
  background:linear-gradient(180deg, rgba(64,160,225,.38), rgba(16,62,104,.42)) !important;
  box-shadow:0 0 0 2px rgba(126,211,255,.12), 0 12px 26px rgba(0,0,0,.28) !important;
}

.avatarGenderIcon{
  position:relative !important;
  width:28px !important;
  height:30px !important;
  display:block !important;
  color:#dec8a6 !important;
  filter:drop-shadow(0 4px 8px rgba(0,0,0,.45)) !important;
}

.avatarPickerTab.active .avatarGenderIcon{
  color:#f8fbff !important;
  filter:drop-shadow(0 0 10px rgba(126,211,255,.38)) drop-shadow(0 4px 8px rgba(0,0,0,.45)) !important;
}

.avatarGenderIcon:before{
  content:"" !important;
  position:absolute !important;
  left:50% !important;
  top:1px !important;
  width:10px !important;
  height:10px !important;
  border-radius:50% !important;
  background:currentColor !important;
  transform:translateX(-50%) !important;
}

.avatarGenderIcon.male:after{
  content:"" !important;
  position:absolute !important;
  left:50% !important;
  top:14px !important;
  width:22px !important;
  height:14px !important;
  border-radius:12px 12px 5px 5px !important;
  background:currentColor !important;
  transform:translateX(-50%) !important;
  clip-path:polygon(18% 0, 82% 0, 100% 100%, 0 100%) !important;
}

.avatarGenderIcon.female:after{
  content:"" !important;
  position:absolute !important;
  left:50% !important;
  top:14px !important;
  width:24px !important;
  height:15px !important;
  background:currentColor !important;
  transform:translateX(-50%) !important;
  clip-path:polygon(50% 0, 94% 100%, 6% 100%) !important;
}

#avatarPickerGrid{
  display:block !important;
}

.avatarPickerGroup{
  display:none !important;
}

.avatarPickerGroup.active{
  display:grid !important;
  grid-template-columns:repeat(5, minmax(0,1fr)) !important;
  gap:12px !important;
}

.avatarModalPick{
  position:relative !important;
  overflow:hidden !important;
}

.avatarMissing{
  cursor:default !important;
  filter:grayscale(.25) brightness(.70) !important;
}

.avatarMissing img{
  opacity:.16 !important;
}

.avatarMissingText{
  display:none !important;
}

.avatarMissing .avatarMissingText{
  display:grid !important;
  place-items:center !important;
  position:absolute !important;
  inset:8px !important;
  border-radius:12px !important;
  border:1px dashed rgba(255,223,170,.26) !important;
  color:#d9c39e !important;
  font-size:11px !important;
  font-weight:900 !important;
  text-align:center !important;
  background:rgba(0,0,0,.25) !important;
}

@media (max-width: 720px){
  .avatarPickerGroup.active{
    grid-template-columns:repeat(3, minmax(0,1fr)) !important;
  }
}

/* ===== inventory equipment paper doll refresh ===== */
#inventoryScreen #equipPanel .equipWrap{
  height:324px !important;
  max-width:504px !important;
  margin:4px auto 0 !important;
  border-radius:12px !important;
  background:
    linear-gradient(180deg, rgba(5,5,5,.58), rgba(0,0,0,.70)) !important;
  border:0 !important;
  box-shadow:inset 0 0 42px rgba(0,0,0,.62), 0 12px 26px rgba(0,0,0,.18) !important;
}

#inventoryScreen #equipPanel .equipWrap::before{
  content:none !important;
  display:none !important;
}

#inventoryScreen #equipPanel .invAvatar{
  width:150px !important;
  height:150px !important;
  top:43% !important;
  border-radius:18px !important;
  border:0 !important;
  box-shadow:0 18px 42px rgba(0,0,0,.46) !important;
  z-index:2 !important;
}

#inventoryScreen #equipPanel .equipSlot{
  width:68px !important;
  height:68px !important;
  min-width:68px !important;
  min-height:68px !important;
  max-width:68px !important;
  max-height:68px !important;
  border-radius:14px !important;
  z-index:3 !important;
  transform:translate(-50%,-50%) !important;
  background:
    linear-gradient(135deg, rgba(42,36,28,.88), rgba(14,13,12,.96)) !important;
  border:1px solid rgba(138,116,76,.58) !important;
  outline:1px solid rgba(255,255,255,.045) !important;
  outline-offset:-4px !important;
  box-shadow:
    inset 0 0 18px rgba(0,0,0,.34),
    0 10px 24px rgba(0,0,0,.30) !important;
}

#inventoryScreen #equipPanel .equipSlot:hover{
  border-color:rgba(185,160,105,.76) !important;
  outline-color:rgba(255,255,255,.075) !important;
  box-shadow:
    inset 0 0 18px rgba(0,0,0,.30),
    0 14px 30px rgba(0,0,0,.36) !important;
}

#inventoryScreen #equipPanel .equipSlot[data-slot="helm"]{ left:17% !important; top:18% !important; }
#inventoryScreen #equipPanel .equipSlot[data-slot="armor"]{ left:17% !important; top:50% !important; }
#inventoryScreen #equipPanel .equipSlot[data-slot="weapon"]{ left:17% !important; top:82% !important; }
#inventoryScreen #equipPanel .equipSlot[data-slot="boots"]{ left:83% !important; top:18% !important; }
#inventoryScreen #equipPanel .equipSlot[data-slot="gloves"]{ left:83% !important; top:50% !important; }
#inventoryScreen #equipPanel .equipSlot[data-slot="offhand_future"]{ left:83% !important; top:82% !important; }
#inventoryScreen #equipPanel .equipSlot[data-slot="amulet_future"]{ left:41.5% !important; top:82% !important; width:68px !important; height:68px !important; min-width:68px !important; min-height:68px !important; max-width:68px !important; max-height:68px !important; }
#inventoryScreen #equipPanel .equipSlot[data-slot="ring_future"]{ left:58.5% !important; top:82% !important; width:68px !important; height:68px !important; min-width:68px !important; min-height:68px !important; max-width:68px !important; max-height:68px !important; }

#inventoryScreen #bagPanel{
  position:relative !important;
  padding-top:14px !important;
  padding-bottom:30px !important;
  min-height:338px !important;
}

#inventoryScreen #bagPanel .oaiBagPagerDock{
  position:absolute !important;
  left:50% !important;
  top:-38px !important;
  right:auto !important;
  bottom:auto !important;
  width:auto !important;
  height:30px !important;
  margin:0 !important;
  transform:translateX(-50%) !important;
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
  z-index:40 !important;
}

#inventoryScreen #equipPanel .equipSlot::before{
  content:none !important;
  display:none !important;
}

#inventoryScreen #equipPanel .equipSlot::after{
  background:none !important;
  box-shadow:none !important;
  border:0 !important;
  opacity:1 !important;
}

#inventoryScreen #equipPanel .equipSlot:not(:has(img))::after{
  display:block !important;
  content:"" !important;
  position:absolute !important;
  left:50% !important;
  top:50% !important;
  transform:translate(-50%,-50%) !important;
  width:calc(100% - 10px) !important;
  height:auto !important;
  right:auto !important;
  bottom:auto !important;
  background:none !important;
  box-shadow:none !important;
  border:0 !important;
  opacity:1 !important;
  color:rgba(239,214,174,.76) !important;
  font-size:9px !important;
  line-height:1.1 !important;
  font-family:"Cinzel","Georgia",serif !important;
  font-weight:900 !important;
  letter-spacing:0 !important;
  text-align:center !important;
  text-transform:uppercase !important;
  text-shadow:0 2px 7px rgba(0,0,0,.75) !important;
  pointer-events:none !important;
}

#inventoryScreen #equipPanel .equipSlot[data-slot="helm"]:not(:has(img))::after{ content:"Helma" !important; }
#inventoryScreen #equipPanel .equipSlot[data-slot="armor"]:not(:has(img))::after{ content:"Brnění" !important; }
#inventoryScreen #equipPanel .equipSlot[data-slot="weapon"]:not(:has(img))::after{ content:"Zbraň" !important; }
#inventoryScreen #equipPanel .equipSlot[data-slot="boots"]:not(:has(img))::after{ content:"Boty" !important; }
#inventoryScreen #equipPanel .equipSlot[data-slot="gloves"]:not(:has(img))::after{ content:"Rukavice" !important; }
#inventoryScreen #equipPanel .equipSlot[data-slot="offhand_future"]:not(:has(img))::after{ content:"Offhand" !important; }
#inventoryScreen #equipPanel .equipSlot[data-slot="amulet_future"]:not(:has(img))::after{ content:"Náhrdelník" !important; font-size:8px !important; }
#inventoryScreen #equipPanel .equipSlot[data-slot="ring_future"]:not(:has(img))::after{ content:"Prsten" !important; font-size:8px !important; }

#inventoryScreen #bagGrid .slot,
#inventoryScreen #bagPanel .bagGrid .slot,
#inventoryScreen .bagGrid#bagGrid .slot{
  background:
    radial-gradient(circle at 50% 18%, rgba(255,218,130,.08), transparent 42%),
    linear-gradient(150deg, rgba(121,24,28,.56), rgba(32,5,8,.74)) !important;
  border:1px solid rgba(205,154,57,.58) !important;
  box-shadow:
    inset 0 0 18px rgba(0,0,0,.60),
    0 8px 18px rgba(0,0,0,.30) !important;
}

#inventoryScreen.overlayOnCity .invWrap,
#inventoryScreen.asOverlayPanel .invWrap,
#inventoryScreen .invWrap{
  min-height:790px !important;
  padding-bottom:44px !important;
}

/* ===== Inventory background loaded before the UI scripts =====
   Keeping the artwork on the existing .bgWrap prevents the former armory
   background from flashing while the inventory layout is being arranged. */
#inventoryScreen > .bgWrap,
#inventoryScreen.overlayOnCity > .bgWrap,
#inventoryScreen.asOverlayPanel > .bgWrap,
#cityOverlayFinalBody > #inventoryScreen.asOverlayPanel > .bgWrap{
  background-color:#120907 !important;
  background-image:
    linear-gradient(rgba(0,0,0,.43), rgba(0,0,0,.43)),
    url("../img/ui/inventory_burgundy_landscape_v1.png?v=311bg6") !important;
  background-position:center center, center center !important;
  background-size:100% 100%, 100% 100% !important;
  background-repeat:no-repeat, no-repeat !important;
  background-blend-mode:normal, normal !important;
}

#inventoryScreen > .bgWrap > .bg,
#inventoryScreen.overlayOnCity > .bgWrap > .bg,
#inventoryScreen.asOverlayPanel > .bgWrap > .bg,
#cityOverlayFinalBody > #inventoryScreen.asOverlayPanel > .bgWrap > .bg,
#inventoryScreen .invPanel,
#inventoryScreen.overlayOnCity .invPanel,
#inventoryScreen.asOverlayPanel .invPanel{
  background:transparent !important;
  background-image:none !important;
}

#inventoryScreen .invWrap,
#inventoryScreen.overlayOnCity .invWrap,
#inventoryScreen.asOverlayPanel .invWrap{
  background-color:#120907 !important;
  background-image:
    linear-gradient(rgba(0,0,0,.34), rgba(0,0,0,.34)),
    url("../img/ui/inventory_burgundy_landscape_v1.png?v=311bg7") !important;
  background-position:center center, center center !important;
  background-size:100% 100%, 100% 100% !important;
  background-repeat:no-repeat, no-repeat !important;
}

/* ===== v395: equipped items use the same crisp icon surface as shop offers ===== */
html body #shopScreen .shopLayout .shopEquipWrap > .equipSlot[data-slot],
html body #inventoryScreen #equipPanel .equipWrap > .equipSlot[data-slot]{
  background:#151312 !important;
  background-color:#151312 !important;
  background-image:none !important;
  border:1px solid rgba(112,108,100,.72) !important;
  outline:0 !important;
  outline-offset:0 !important;
  box-shadow:inset 0 0 20px rgba(0,0,0,.68),0 3px 8px rgba(0,0,0,.30) !important;
  filter:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  animation:none !important;
}
html body #shopScreen .shopLayout .shopEquipWrap > .equipSlot[data-slot]::before,
html body #shopScreen .shopLayout .shopEquipWrap > .equipSlot[data-slot]::after,
html body #inventoryScreen #equipPanel .equipWrap > .equipSlot[data-slot]::before,
html body #inventoryScreen #equipPanel .equipWrap > .equipSlot[data-slot]::after{
  content:none !important;
  display:none !important;
  background:none !important;
  background-image:none !important;
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  filter:none !important;
  opacity:0 !important;
}
html body #shopScreen .shopLayout .shopEquipWrap > .equipSlot.slot-common,
html body #inventoryScreen #equipPanel .equipWrap > .equipSlot.slot-common{border-color:rgba(82,214,106,.72) !important;}
html body #shopScreen .shopLayout .shopEquipWrap > .equipSlot.slot-epic,
html body #inventoryScreen #equipPanel .equipWrap > .equipSlot.slot-epic{border-color:rgba(184,107,255,.80) !important;}
html body #shopScreen .shopLayout .shopEquipWrap > .equipSlot.slot-legendary,
html body #inventoryScreen #equipPanel .equipWrap > .equipSlot.slot-legendary{border-color:rgba(232,187,72,.90) !important;}
html body #shopScreen .shopLayout .shopEquipWrap > .equipSlot[data-slot] > .oaiEquippedItemIcon,
html body #inventoryScreen #equipPanel .equipWrap > .equipSlot[data-slot] > .oaiEquippedItemIcon{
  width:79px !important;
  height:79px !important;
  min-width:0 !important;
  min-height:0 !important;
  max-width:79px !important;
  max-height:79px !important;
  margin:auto !important;
  padding:0 !important;
  position:static !important;
  inset:auto !important;
  display:grid !important;
  place-items:center !important;
  overflow:visible !important;
  transform:none !important;
  scale:none !important;
  translate:none !important;
  rotate:none !important;
  filter:none !important;
  opacity:1 !important;
  background:none !important;
  border:0 !important;
  box-shadow:none !important;
  will-change:auto !important;
}
html body #shopScreen .shopLayout .shopEquipWrap > .equipSlot[data-slot] > .oaiEquippedItemIcon > img,
html body #inventoryScreen #equipPanel .equipWrap > .equipSlot[data-slot] > .oaiEquippedItemIcon > img{
  width:79px !important;
  height:79px !important;
  min-width:0 !important;
  min-height:0 !important;
  max-width:79px !important;
  max-height:79px !important;
  margin:auto !important;
  padding:0 !important;
  position:static !important;
  inset:auto !important;
  display:block !important;
  object-fit:contain !important;
  object-position:center !important;
  transform:none !important;
  scale:none !important;
  translate:none !important;
  rotate:none !important;
  filter:none !important;
  opacity:1 !important;
  image-rendering:auto !important;
  image-rendering:-webkit-optimize-contrast !important;
  will-change:auto !important;
  backface-visibility:visible !important;
}

/* COMBAT RESULT POPUPS V431 */
#rewardModal{
  left:calc(50% - (var(--stageW) / 2) + var(--menuStageW));
  right:auto;
  width:var(--cityStageW);
  padding:16px;
  overflow:auto;
  background:rgba(0,0,0,.72);
  backdrop-filter:blur(5px);
}
#rewardModal #rewardCard{
  box-sizing:border-box;
  width:min(720px, calc(100vw - 32px));
  max-width:calc(100% - 32px);
  min-height:480px;
  max-height:calc(100vh - 32px);
  margin:0 !important;
  padding:66px 72px 52px;
  overflow:auto;
  isolation:isolate;
  display:flex;
  flex-direction:column;
  color:#f5e7c8;
  border:0;
  border-radius:0;
  background-color:transparent;
  background-image:url("../img/ui/combat_result/result_victory_frame_v1.png");
  background-position:center;
  background-repeat:no-repeat;
  background-size:100% 100%;
  box-shadow:none;
  backdrop-filter:none;
  scrollbar-width:thin;
  scrollbar-color:rgba(219,163,56,.62) rgba(0,0,0,.18);
}
#rewardModal #rewardCard.defeat{
  margin:0 !important;
  border:0 !important;
  background-image:url("../img/ui/combat_result/result_defeat_frame_v1.png");
  box-shadow:none !important;
}
#rewardModal #rewardCard::before{
  display:none !important;
}
#rewardModal #rewardTitle{
  position:relative;
  top:10px;
  margin:0;
  min-height:50px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#f6d77c;
  font-family:"Cinzel","Trajan Pro",Georgia,serif;
  font-size:clamp(28px, 4vw, 40px);
  font-weight:1000;
  line-height:1.05;
  letter-spacing:.045em;
  text-align:center;
  text-transform:uppercase;
  text-shadow:0 3px 0 #56320d, 0 0 22px rgba(255,183,55,.42), 0 8px 22px rgba(0,0,0,.88);
}
#rewardModal #rewardCard.defeat #rewardTitle{
  color:#d7cbc4;
  text-shadow:0 3px 0 #3b1010, 0 0 20px rgba(198,43,43,.34), 0 8px 22px rgba(0,0,0,.9);
}
#rewardSubtitle{
  margin:7px auto 12px;
  color:#d9bd79;
  font-family:"Cinzel","Trajan Pro",Georgia,serif;
  font-size:13px;
  font-weight:1000;
  letter-spacing:.16em;
  text-align:center;
  text-transform:uppercase;
}
#rewardCard.defeat #rewardSubtitle{ color:#b98782; }
#rewardModal #rewardRows{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
  margin:0 0 12px;
}
#rewardModal #rewardRows .rewardTile{
  box-sizing:border-box;
  min-width:0;
  min-height:126px;
  padding:8px 5px 9px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-end;
  gap:1px;
  border:1px solid rgba(217,170,77,.2);
  border-radius:9px;
  background:linear-gradient(180deg,rgba(15,8,5,.08),rgba(0,0,0,.34));
  box-shadow:inset 0 0 18px rgba(0,0,0,.32);
}
#rewardModal #rewardRows .rewardTile img{
  width:70px;
  height:70px;
  margin:-4px 0 0;
  object-fit:contain;
  filter:drop-shadow(0 6px 8px rgba(0,0,0,.72));
}
#rewardModal #rewardGoldRow img{ content:url("../img/ui/combat_result/reward_gold_v1.png"); }
#rewardModal #rewardXpRow img{ content:url("../img/ui/combat_result/reward_xp_v1.png"); }
#rewardModal #rewardEssenceRow img{ content:url("../img/ui/combat_result/reward_essence_v1.png"); }
#rewardModal #rewardShardRow img{ content:url("../img/ui/combat_result/reward_forge_shard_v1.png"); }
#rewardModal .rewardTileLabel{
  color:#cbb889;
  font-family:"Cinzel",Georgia,serif;
  font-size:10px;
  font-weight:900;
  line-height:1.05;
  letter-spacing:.05em;
  text-align:center;
  text-transform:uppercase;
}
#rewardModal .rewardTile strong{
  color:#fff0c3;
  font-family:"Cinzel",Georgia,serif;
  font-size:17px;
  line-height:1.12;
  text-shadow:0 2px 8px rgba(0,0,0,.9);
}
#rewardDefeatBlock{
  display:none;
  grid-template-columns:128px minmax(0,1fr);
  align-items:center;
  gap:18px;
  margin:0 28px 8px;
}
#rewardCard.defeat #rewardDefeatBlock{ display:grid; }
#rewardCard.defeat:not(.has-enemy-hp) #rewardDefeatBlock{
  display:flex;
  justify-content:center;
}
#rewardDefeatEmblem{
  width:128px;
  height:128px;
  object-fit:contain;
  filter:drop-shadow(0 9px 14px rgba(0,0,0,.7)) drop-shadow(0 0 12px rgba(155,26,26,.22));
}
#rewardModal #rewardEnemyHpBox{
  display:none;
  margin:0;
  padding:12px 14px;
  border:1px solid rgba(184,75,68,.34);
  border-radius:9px;
  background:rgba(0,0,0,.3);
  box-shadow:inset 0 0 18px rgba(0,0,0,.32);
}
#rewardEnemyHpName{
  margin-bottom:8px;
  color:#d99a93;
  font-family:"Cinzel",Georgia,serif;
  font-size:14px;
  font-weight:1000;
  text-align:center;
}
.rewardEnemyHpTrack{
  height:13px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  background:rgba(20,0,0,.72);
  box-shadow:inset 0 2px 6px rgba(0,0,0,.75);
}
#rewardEnemyHpFill{
  height:100%;
  width:0;
  background:linear-gradient(90deg,#681010,#b52020,#df554b);
  box-shadow:0 0 12px rgba(221,53,53,.38);
}
#rewardEnemyHpText{
  margin-top:6px;
  color:#e0c6c0;
  font-family:"Cinzel",Georgia,serif;
  font-weight:900;
  text-align:center;
}
#rewardModal #rewardMsg{
  margin:6px 8px 12px !important;
  min-height:0;
  color:#d8cbb4;
  font-size:13px;
  line-height:1.35;
  text-align:center;
}
#rewardModal #rewardItem,
#rewardModal #rewardKey{
  border-color:rgba(214,164,70,.28) !important;
  border-radius:9px !important;
  background:rgba(0,0,0,.38) !important;
  box-shadow:inset 0 0 18px rgba(0,0,0,.28);
}
#rewardModal #rewardItem{ margin-bottom:10px; }
#rewardModal #rewardItem img,
#rewardModal #rewardKey img{ width:48px !important; height:48px !important; }
#rewardModal #btnRewardOk,
#rewardModal #btnRewardAlt{
  min-height:42px;
  border:1px solid rgba(239,190,82,.68);
  border-radius:8px;
  color:#211204;
  background:linear-gradient(180deg,#f4d87b,#c78b16 58%,#98600b);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 8px 18px rgba(0,0,0,.48);
  font-family:"Cinzel",Georgia,serif;
  font-size:14px;
  font-weight:1000;
  letter-spacing:.04em;
  text-transform:uppercase;
}
#rewardModal #btnRewardOk{
  width:min(340px, calc(100% - 90px)) !important;
  min-width:220px;
  align-self:center;
  flex:0 0 auto;
  margin:auto auto 18px;
}
#rewardModal #btnRewardAlt{
  margin-top:7px;
  color:#ead9bf;
  border-color:rgba(187,135,68,.45);
  background:linear-gradient(180deg,rgba(76,45,20,.95),rgba(35,18,9,.98));
}
#rewardModal #rewardCard.defeat #btnRewardOk{
  color:#ead9d4;
  border-color:rgba(174,76,67,.7);
  background:linear-gradient(180deg,#6b302d,#431817 58%,#290c0c);
}
#rewardModal #btnRewardOk:hover,
#rewardModal #btnRewardAlt:hover{ filter:brightness(1.12); }
@media (max-width:700px){
  #rewardModal{ padding:8px; }
  #rewardModal #rewardCard{
    width:min(620px, calc(100vw - 16px));
    max-width:calc(100% - 16px);
    min-height:min(600px, calc(100vh - 16px));
    max-height:calc(100vh - 16px);
    padding:58px 44px 44px;
  }
  #rewardModal #rewardRows{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  #rewardModal #rewardRows .rewardTile{ min-height:104px; }
  #rewardModal #rewardRows .rewardTile img{ width:56px; height:56px; }
  #rewardDefeatBlock{ grid-template-columns:94px minmax(0,1fr); margin:0 6px 8px; gap:10px; }
  #rewardDefeatEmblem{ width:94px; height:94px; }
}
@media (max-width:430px){
  #rewardModal #rewardCard{ padding:54px 34px 40px; }
  #rewardModal #rewardTitle{ font-size:25px; }
  #rewardSubtitle{ margin-bottom:8px; font-size:11px; }
  #rewardDefeatBlock{ grid-template-columns:1fr; justify-items:center; }
  #rewardModal #rewardEnemyHpBox{ width:100%; box-sizing:border-box; }
  #rewardModal #btnRewardOk{
    width:min(300px, calc(100% - 24px)) !important;
    min-width:0;
    margin-bottom:12px;
  }
}

/* ===== GUILD BOSS CURRENT PANEL V441 ===== */
#guildBossPanel{
  width:min(1040px, 95vw);
  height:min(820px, 92vh);
  padding:18px 20px 20px;
  background:
    linear-gradient(180deg,rgba(8,9,14,.84),rgba(7,7,10,.95)),
    url("../img/guildboss_bck.png") center/cover no-repeat;
  border-color:rgba(218,156,62,.48);
  box-shadow:0 24px 80px rgba(0,0,0,.85),inset 0 0 55px rgba(0,0,0,.5),0 0 28px rgba(211,142,43,.16);
}
#guildBossPanel .guildBossHead{
  min-height:46px;
  margin-bottom:10px;
  border-bottom:1px solid rgba(255,255,255,.1);
}
#guildBossPanel .guildPanelTitle{
  color:#f5e8c2;
  font-family:"Cinzel","Trajan Pro",Georgia,serif;
  font-size:clamp(25px,3vw,36px);
  font-weight:900;
  letter-spacing:.01em;
  text-shadow:0 3px 12px #000;
}
#guildBossPanel .guildBossBody{
  height:calc(100% - 58px);
  padding:4px 6px 8px 0;
  scrollbar-color:rgba(218,156,62,.5) rgba(0,0,0,.28);
}
.guildBossCurrentShell{
  --guild-boss-accent:217,157,55;
  --guild-boss-hp:100%;
  display:grid;
  gap:14px;
}
.guildBossCurrentHero{
  position:relative;
  display:grid;
  grid-template-columns:minmax(230px,34%) minmax(0,1fr);
  min-height:320px;
  overflow:hidden;
  border:1px solid rgba(var(--guild-boss-accent),.62);
  border-radius:11px;
  background:
    radial-gradient(circle at 18% 50%,rgba(var(--guild-boss-accent),.19),transparent 39%),
    linear-gradient(100deg,rgba(5,6,10,.88),rgba(10,9,12,.68));
  box-shadow:inset 0 0 50px rgba(0,0,0,.56),0 12px 32px rgba(0,0,0,.28);
}
.guildBossCurrentHero::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(115deg,transparent 25%,rgba(255,255,255,.025) 48%,transparent 68%);
}
.guildBossCurrentPortrait{
  position:relative;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  min-height:320px;
  overflow:hidden;
}
.guildBossCurrentAura{
  position:absolute;
  left:50%;
  bottom:8%;
  width:82%;
  aspect-ratio:1;
  transform:translateX(-50%);
  border-radius:50%;
  background:radial-gradient(circle,rgba(var(--guild-boss-accent),.28),rgba(var(--guild-boss-accent),.07) 46%,transparent 70%);
  filter:blur(10px);
}
.guildBossCurrentArt{
  position:relative;
  z-index:1;
  width:100%;
  height:318px;
  object-fit:contain;
  object-position:center bottom;
  filter:drop-shadow(0 14px 14px rgba(0,0,0,.82));
  transform:scale(1.04);
}
.guildBossCurrentInfo{
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:28px 30px 24px 12px;
}
.guildBossCurrentKicker{
  color:rgb(var(--guild-boss-accent));
  font-size:13px;
  font-weight:1000;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.guildBossCurrentDescription{
  max-width:660px;
  margin:14px 0 0;
  color:#e5ddcf;
  font-size:15px;
  font-weight:650;
  line-height:1.48;
}
.guildBossCurrentHpBlock{
  margin-top:20px;
}
.guildBossCurrentHpLabel{
  display:flex;
  justify-content:space-between;
  gap:16px;
  margin-bottom:7px;
  color:#f3e7d3;
  font-size:14px;
}
.guildBossCurrentHpLabel span{
  color:#ffb1a7;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.guildBossCurrentHpBar{
  height:22px;
  overflow:hidden;
  border:1px solid rgba(255,180,125,.42);
  border-radius:999px;
  background:rgba(10,4,4,.82);
  box-shadow:inset 0 2px 8px rgba(0,0,0,.9);
}
.guildBossCurrentHpFill{
  width:var(--guild-boss-hp);
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,#7e0508,#df271d 68%,#ff7b40);
  box-shadow:inset 0 1px rgba(255,255,255,.22),0 0 18px rgba(235,43,28,.48);
  transition:width .32s ease;
}
.guildBossCurrentHpPercent{
  margin-top:5px;
  color:#c7bba8;
  font-size:12px;
  text-align:right;
}
.guildBossCurrentLower{
  display:grid;
  grid-template-columns:1.08fr .92fr;
  gap:14px;
}
.guildBossCurrentCard{
  border:1px solid rgba(var(--guild-boss-accent),.38);
  border-radius:10px;
  padding:14px 16px;
  background:linear-gradient(145deg,rgba(24,18,20,.9),rgba(8,9,13,.88));
  box-shadow:inset 0 0 22px rgba(0,0,0,.32);
}
.guildBossCurrentCardTitle{
  margin-bottom:10px;
  color:#f2dfb4;
  font-family:"Cinzel","Trajan Pro",Georgia,serif;
  font-size:18px;
  font-weight:900;
}
.guildBossCurrentStats{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}
.guildBossCurrentStats>div,
.guildBossCurrentReward{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  min-height:36px;
  padding:0 11px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:7px;
  background:rgba(0,0,0,.28);
  color:#cfc4b4;
  font-size:13px;
}
.guildBossCurrentStats b,
.guildBossCurrentReward b{
  color:#fff0cf;
  white-space:nowrap;
}
.guildBossCurrentReward+.guildBossCurrentReward{margin-top:8px;}
.guildBossCurrentReward b{color:#9fe3a8;}
.guildBossCurrentDefeated{
  margin-top:9px;
  color:#bdb2a2;
  font-size:12px;
}
.guildBossCurrentActions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
#guildBossPanel .guildBossCurrentActions .guildBtn{
  min-height:48px;
  border-radius:10px;
  font-family:"Cinzel","Trajan Pro",Georgia,serif;
  font-size:15px;
  font-weight:1000;
  letter-spacing:.04em;
}
#guildBossPanel .guildBossCurrentAttack{
  border-color:#a63b27;
  background:linear-gradient(#8e2d21,#4b1313);
  color:#fff3e5;
  box-shadow:inset 0 1px rgba(255,255,255,.14),0 7px 16px rgba(76,7,7,.32);
}
#guildBossPanel .guildBossCurrentRefresh{
  border-color:#3f668d;
  background:linear-gradient(#365e86,#182c47);
  color:#edf5ff;
  box-shadow:inset 0 1px rgba(255,255,255,.14),0 7px 16px rgba(4,24,50,.3);
}
.guildBossCurrentLog{
  border:1px solid rgba(255,255,255,.09);
  border-radius:9px;
  padding:10px 13px;
  background:rgba(4,5,8,.58);
  color:#d7c9b2;
}
.guildBossCurrentLog summary{
  cursor:pointer;
  color:#e8d8b9;
  font-weight:900;
}
.guildBossCurrentLog .guildBossRaidLog{
  max-height:190px;
  overflow:auto;
}
@media (max-width:760px){
  #guildBossPanel{padding:14px;width:96vw;height:94vh;}
  .guildBossCurrentHero{grid-template-columns:1fr;}
  .guildBossCurrentPortrait{min-height:225px;}
  .guildBossCurrentArt{height:245px;}
  .guildBossCurrentInfo{padding:8px 18px 20px;}
  .guildBossCurrentLower{grid-template-columns:1fr;}
}
@media (max-width:500px){
  #guildBossPanel .guildPanelTitle{font-size:23px;}
  .guildBossCurrentStats{grid-template-columns:1fr;}
  .guildBossCurrentActions{grid-template-columns:1fr;}
  .guildBossCurrentDescription{font-size:14px;}
  .guildBossCurrentHpLabel{align-items:flex-start;flex-direction:column;gap:3px;}
}

/* ===== Trainer forge v1 ===== */
#attrBody .trainerForge{
 --trainer-gold:#d5a14a;
 --trainer-gold-light:#f4d89b;
 --trainer-line:rgba(184,126,43,.48);
 --trainer-panel:rgba(10,13,12,.94);
 position:relative;
 width:100%;
 height:100%;
 min-height:0;
 display:flex;
 flex-direction:column;
 overflow:hidden;
 color:#d8c9af;
 background:
  radial-gradient(circle at 50% -18%,rgba(140,89,30,.2),transparent 38%),
  linear-gradient(135deg,rgba(24,25,21,.97),rgba(5,8,7,.99) 48%,rgba(10,12,10,.98));
 border:1px solid rgba(211,151,59,.62);
 box-shadow:inset 0 0 0 4px rgba(20,16,10,.96),inset 0 0 0 5px rgba(157,105,35,.38),inset 0 0 50px rgba(0,0,0,.72);
 box-sizing:border-box;
}
#attrBody .trainerForge::before,
#attrBody .trainerForge::after{
 content:"◆";
 position:absolute;
 z-index:4;
 color:#9b6b2e;
 font-size:19px;
 line-height:1;
 text-shadow:0 0 8px rgba(240,174,67,.22);
 pointer-events:none;
}
#attrBody .trainerForge::before{top:8px;left:9px;}
#attrBody .trainerForge::after{right:9px;bottom:8px;transform:rotate(180deg);}
.trainerForgeHeader{
 position:relative;
 flex:0 0 124px;
 display:flex;
 align-items:flex-start;
 justify-content:center;
 border-bottom:1px solid var(--trainer-line);
 background:linear-gradient(180deg,rgba(24,26,23,.96),rgba(11,15,13,.94));
 box-shadow:inset 0 -1px rgba(0,0,0,.85),0 5px 20px rgba(0,0,0,.28);
 padding-top:7px;
 box-sizing:border-box;
}
.trainerForgeTitle{
 display:flex;
 align-items:center;
 justify-content:center;
 gap:17px;
 text-align:center;
 font-family:"Cinzel","Trajan Pro",Georgia,serif;
}
.trainerForgeTitle>span{color:#b17a34;font-size:18px;}
.trainerForgeTitle h1{
 margin:0;
 color:#f2dfb7;
 font-family:inherit;
 font-size:clamp(30px,3vw,42px);
 line-height:1;
 font-weight:700;
 letter-spacing:.07em;
 text-shadow:0 2px #000,0 0 18px rgba(207,150,66,.15);
}
.trainerForgeTitle p{
 margin:1px 0 0;
 color:#bcae98;
 font:12px/1.1 Georgia,serif;
 letter-spacing:.025em;
}
.trainerCoin{
 display:inline-grid;
 place-items:center;
 width:18px;
 height:18px;
 border:2px solid #8f5d17;
 border-radius:50%;
 color:#f8c957;
 background:radial-gradient(circle at 38% 34%,#ffd96f,#c98218 62%,#72420c);
 box-shadow:inset 0 0 0 2px rgba(255,227,138,.25),0 0 8px rgba(229,153,35,.2);
 font-size:0;
 box-sizing:border-box;
 vertical-align:-2px;
}
.trainerCoin::after{content:"";width:5px;height:8px;border:1px solid rgba(95,48,4,.7);border-radius:50%;}
.trainerWorkspace{
 min-height:0;
 flex:1 1 auto;
 display:grid;
 grid-template-columns:minmax(225px,.82fr) minmax(390px,1.45fr) minmax(225px,.8fr);
 overflow:hidden;
}
.trainerWorkspace>aside,
.trainerWorkspace>main{min-width:0;min-height:0;box-sizing:border-box;}
.trainerAttributePanel,
.trainerStatsPanel{
 background:linear-gradient(180deg,rgba(17,21,19,.92),rgba(7,10,9,.97));
}
.trainerAttributePanel{display:flex;flex-direction:column;border-right:1px solid var(--trainer-line);padding:13px 12px 12px;}
.trainerStatsPanel{border-left:1px solid var(--trainer-line);padding:13px 12px;overflow:auto;}
.trainerAttributePanel h2,
.trainerStatsPanel>h2{
 flex:0 0 auto;
 margin:0 0 10px;
 padding-bottom:9px;
 border-bottom:1px solid rgba(181,125,47,.32);
 color:#d8b679;
 text-align:center;
 font:700 16px/1 "Cinzel","Trajan Pro",Georgia,serif;
 letter-spacing:.05em;
}
.trainerAttributeList{display:flex;flex:1 1 auto;min-height:0;flex-direction:column;gap:7px;}
.trainerAttribute{
 position:relative;
 min-height:0;
 flex:1 1 0;
 display:grid;
 grid-template-columns:58px minmax(0,1fr) auto;
 align-items:center;
 gap:9px;
 padding:6px 9px 6px 7px;
 border:1px solid rgba(138,101,54,.36);
 border-radius:3px;
 color:#cdbfa7;
 background:linear-gradient(100deg,rgba(35,31,23,.88),rgba(10,13,12,.88));
 box-shadow:inset 0 1px rgba(255,255,255,.035);
 cursor:pointer;
 text-align:left;
 transition:border-color .16s ease,filter .16s ease,background .16s ease;
}
.trainerAttribute:hover{filter:brightness(1.12);border-color:rgba(222,164,72,.55);}
.trainerAttribute.active{
 border-color:#c58d36;
 color:#f0dfbd;
 background:linear-gradient(100deg,rgba(82,52,22,.95),rgba(26,21,15,.92));
 box-shadow:inset 3px 0 #e0a64b,inset 0 0 24px rgba(195,124,30,.13),0 0 12px rgba(199,135,40,.1);
}
.trainerAttribute.active::after{
 content:"";
 position:absolute;
 right:-6px;
 width:10px;
 height:10px;
 transform:rotate(45deg);
 border-top:1px solid #d29842;
 border-right:1px solid #d29842;
 background:#1b160e;
}
.trainerAttribute img{width:54px;height:54px;object-fit:cover;border:1px solid rgba(210,150,56,.46);box-shadow:0 3px 9px rgba(0,0,0,.55);}
.trainerAttributeCopy{min-width:0;display:block;}
.trainerAttributeCopy b{display:block;color:inherit;font:700 15px/1.15 "Cinzel","Trajan Pro",Georgia,serif;}
.trainerAttributeCopy small{display:block;margin-top:4px;color:#978d7d;font:10px/1.25 Arial,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.trainerAttribute>strong{color:#efc166;font:700 20px/1 Georgia,serif;}
.trainerPoints{
 flex:0 0 auto;
 margin-top:9px;
 padding:9px 12px;
 display:flex;
 align-items:center;
 justify-content:space-between;
 border:1px solid rgba(157,111,49,.4);
 background:rgba(0,0,0,.27);
 color:#bda98a;
 font:700 12px/1 "Cinzel","Trajan Pro",Georgia,serif;
}
.trainerPoints strong{color:#f0cd83;font-size:19px;}
.trainerFocusPanel{
 padding:15px 17px 12px;
 display:flex;
 flex-direction:column;
 gap:10px;
 overflow:auto;
 background:radial-gradient(circle at 50% 4%,rgba(112,69,22,.13),transparent 33%),rgba(5,8,7,.88);
}
.trainerFocusHero{
 flex:0 0 auto;
 display:grid;
 grid-template-columns:112px minmax(0,1fr);
 align-items:center;
 gap:17px;
 min-height:112px;
 padding:4px 8px 9px;
 border-bottom:1px solid rgba(177,121,44,.28);
}
.trainerFocusHero img{width:108px;height:108px;object-fit:cover;border:1px solid #9b6827;box-shadow:0 7px 20px rgba(0,0,0,.62),0 0 16px rgba(191,127,36,.08);}
.trainerEyebrow{color:#b8873d;font:700 11px/1 "Cinzel","Trajan Pro",Georgia,serif;letter-spacing:.07em;}
.trainerFocusHero h2{margin:4px 0 5px;color:#f0d6a1;font:700 clamp(25px,2.5vw,37px)/1 "Cinzel","Trajan Pro",Georgia,serif;letter-spacing:.035em;}
.trainerFocusHero p{max-width:560px;margin:0;color:#a99f90;font:12px/1.42 Arial,sans-serif;}
.trainerCurrentCard{
 flex:0 0 auto;
 display:grid;
 grid-template-columns:repeat(3,minmax(0,1fr));
 border:1px solid rgba(159,111,46,.42);
 background:linear-gradient(180deg,rgba(27,29,25,.86),rgba(12,14,12,.94));
 box-shadow:inset 0 0 22px rgba(0,0,0,.27);
}
.trainerCurrentCard>div{padding:9px 11px;border-right:1px solid rgba(161,111,43,.24);}
.trainerCurrentCard>div:nth-child(3){border-right:0;}
.trainerCurrentCard span{display:block;color:#9e927f;font:10px/1.2 Arial,sans-serif;text-transform:uppercase;}
.trainerCurrentCard strong{display:block;margin-top:4px;color:#e7c984;font:700 19px/1 Georgia,serif;}
.trainerCurrentCard .trainerNextCost{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;padding:8px 12px;border-top:1px solid rgba(161,111,43,.26);border-right:0;}
.trainerCurrentCard .trainerNextCost strong{display:flex;align-items:center;gap:8px;margin:0;color:#f2c55f;}
.trainerPurchaseSection{flex:0 0 auto;min-height:0;display:flex;flex-direction:column;text-align:center;}
.trainerSectionHeading{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:11px;}
.trainerSectionHeading span{height:1px;background:linear-gradient(90deg,transparent,rgba(182,124,45,.56));}
.trainerSectionHeading span:last-child{background:linear-gradient(90deg,rgba(182,124,45,.56),transparent);}
.trainerSectionHeading h3{margin:2px 0;color:#d7b473;font:700 18px/1 "Cinzel","Trajan Pro",Georgia,serif;letter-spacing:.05em;}
.trainerPurchaseSection>p{margin:6px 0 10px;color:#948a7b;font:11px/1.2 Arial,sans-serif;}
.trainerPurchaseGrid{
 flex:0 0 auto;
 width:min(100%,550px);
 height:210px;
 align-self:center;
 display:grid;
 grid-template-columns:repeat(3,minmax(0,1fr));
 gap:9px;
}
.trainerPurchaseCard{
 min-height:0;
 padding:12px 8px 9px;
 display:flex;
 flex-direction:column;
 align-items:center;
 justify-content:space-between;
 border:1px solid rgba(178,126,56,.48);
 border-radius:3px;
 color:#d5c3a3;
 background:linear-gradient(180deg,rgba(35,34,27,.96),rgba(12,14,13,.98));
 box-shadow:inset 0 1px rgba(255,255,255,.04),0 5px 12px rgba(0,0,0,.24);
 cursor:pointer;
}
.trainerPurchaseCard.max{background:linear-gradient(180deg,rgba(52,29,55,.95),rgba(19,12,23,.98));border-color:rgba(154,88,160,.6);}
.trainerPurchaseCard:not(:disabled):hover{filter:brightness(1.17);border-color:#e0a74e;}
.trainerPurchaseCard:disabled{cursor:not-allowed;filter:grayscale(.75);opacity:.48;}
.trainerPurchaseAmount{color:#f0d79f;font:700 clamp(24px,2.4vw,34px)/1 Georgia,serif;}
.trainerPurchaseCaption{color:#9d9280;font:11px/1.15 Arial,sans-serif;}
.trainerPurchaseCost{display:flex;align-items:center;gap:7px;color:#edc05d;font:700 15px/1 Georgia,serif;}
.trainerPurchaseCard>b{width:100%;padding:8px 4px;border:1px solid rgba(217,157,63,.5);background:linear-gradient(#5d421d,#2a1d0d);color:#f1d398;font:700 12px/1 "Cinzel","Trajan Pro",Georgia,serif;box-sizing:border-box;}
.trainerPurchaseCard.max>b{border-color:rgba(166,94,173,.62);background:linear-gradient(#4b2551,#26122b);}
.trainerServerNote{flex:0 0 auto;margin:2px 0 0;text-align:center;color:#82796c;font:10px/1.2 Arial,sans-serif;}
.trainerStatsPanel section{margin-bottom:10px;border:1px solid rgba(142,101,47,.36);background:rgba(0,0,0,.24);}
.trainerStatsPanel h3{margin:0;padding:8px 9px;border-bottom:1px solid rgba(145,99,40,.3);color:#c39855;font:700 12px/1 "Cinzel","Trajan Pro",Georgia,serif;letter-spacing:.03em;}
.trainerStatsPanel dl{margin:0;padding:5px 9px;}
.trainerStatsPanel dl>div{display:flex;align-items:center;justify-content:space-between;gap:7px;padding:6px 0;color:#baae9a;font:12px/1.1 Arial,sans-serif;}
.trainerStatsPanel dt{min-width:0;}
.trainerStatsPanel dd{margin:0;color:#ead8b6;font:700 13px/1 Georgia,serif;white-space:nowrap;}
.trainerSelectedSummary{padding-bottom:10px;text-align:center;}
.trainerSelectedSummary strong{display:block;margin-top:9px;color:#efc769;font:700 30px/1 Georgia,serif;}
.trainerSelectedSummary p{margin:7px 12px 0;color:#8f8679;font:10px/1.35 Arial,sans-serif;}

@media (max-width:1050px){
 .trainerWorkspace{grid-template-columns:minmax(215px,34%) minmax(0,1fr);}
 .trainerStatsPanel{display:none;}
 .trainerFocusPanel{padding-left:14px;padding-right:14px;}
 .trainerPurchaseGrid{height:198px;}
}
@media (max-width:720px){
 .trainerForgeHeader{flex-basis:120px;}
 .trainerForgeTitle{transform:none;}
 .trainerForgeTitle p{display:none;}
 .trainerWorkspace{display:block;overflow:auto;}
 .trainerAttributePanel{min-height:430px;border-right:0;border-bottom:1px solid var(--trainer-line);}
 .trainerFocusPanel{min-height:560px;overflow:visible;}
}

/* ===== Inventory obsidian-gold visual skin v483 =====
   Visual-only pass inspired by the dark engraved inventory reference.
   Existing panel geometry, equipment positions and inventory behaviour stay intact. */
#inventoryScreen{
 --inv-obsidian:#050908;
 --inv-obsidian-soft:#0b0f0e;
 --inv-gold:#9b7a42;
 --inv-gold-bright:#d4b171;
 --inv-gold-muted:rgba(157,126,72,.58);
 --inv-ink:rgba(2,5,5,.93);
 color:#d8ccb4;
}

#inventoryScreen.overlayOnCity,
#inventoryScreen.asOverlayPanel{
 background:rgba(0,0,0,.58) !important;
}

#inventoryScreen > .bgWrap,
#inventoryScreen.overlayOnCity > .bgWrap,
#inventoryScreen.asOverlayPanel > .bgWrap,
#cityOverlayFinalBody > #inventoryScreen.asOverlayPanel > .bgWrap,
#inventoryScreen .invWrap,
#inventoryScreen.overlayOnCity .invWrap,
#inventoryScreen.asOverlayPanel .invWrap{
 background-color:#070b09 !important;
 background-image:
  linear-gradient(90deg,rgba(6,10,8,.98),rgba(11,16,13,.96) 48%,rgba(5,8,7,.99)),
  radial-gradient(circle at 50% -20%,rgba(181,126,39,.16),transparent 52%) !important;
 background-position:center,center !important;
 background-size:100% 100%,100% 100% !important;
 background-repeat:no-repeat,no-repeat !important;
 background-blend-mode:normal,normal !important;
}

#inventoryScreen .invWrap,
#inventoryScreen.overlayOnCity .invWrap,
#inventoryScreen.asOverlayPanel .invWrap{
 border:1px solid rgba(146,113,61,.82) !important;
 border-radius:5px !important;
 box-shadow:
  0 24px 70px rgba(0,0,0,.84),
  inset 0 0 0 3px rgba(3,6,6,.96),
  inset 0 0 0 4px rgba(134,103,56,.34),
  inset 0 0 58px rgba(0,0,0,.74) !important;
 backdrop-filter:none !important;
}

#inventoryScreen .invWrap::before,
#inventoryScreen.overlayOnCity .invWrap::before,
#inventoryScreen.asOverlayPanel .invWrap::before{
 content:none !important;
 display:none !important;
 background:none !important;
 box-shadow:none !important;
}

#inventoryScreen .invWrap::after,
#inventoryScreen.overlayOnCity .invWrap::after,
#inventoryScreen.asOverlayPanel .invWrap::after{
 background:linear-gradient(180deg,rgba(35,29,20,.96),rgba(8,10,9,.98)) !important;
 border:1px solid rgba(151,117,61,.72) !important;
 border-radius:2px !important;
 color:#d7bc83 !important;
 font-family:"Cinzel","Trajan Pro",Georgia,serif !important;
 font-weight:700 !important;
 letter-spacing:1.2px !important;
 text-shadow:0 2px 5px #000 !important;
 box-shadow:inset 0 0 0 1px rgba(236,200,128,.07),0 4px 12px rgba(0,0,0,.42) !important;
}

#inventoryScreen #equipPanel,
#inventoryScreen #bagPanel,
#inventoryScreen #invStatsPanel,
#inventoryScreen #materialsPanel{
 background:
  radial-gradient(ellipse at 50% 0%,rgba(161,126,67,.045),transparent 44%),
  linear-gradient(180deg,rgba(8,13,12,.88),rgba(2,6,6,.95)) !important;
 border-color:rgba(126,101,60,.62) !important;
 border-radius:3px !important;
 box-shadow:
  inset 0 0 0 1px rgba(213,175,104,.035),
  inset 0 0 32px rgba(0,0,0,.52),
  0 12px 30px rgba(0,0,0,.34) !important;
}

#inventoryScreen #equipPanel{
 background:transparent !important;
 border:0 !important;
 border-radius:0 !important;
 outline:0 !important;
 box-shadow:none !important;
}

#inventoryScreen #invStatsPanel{
 background:transparent !important;
 border:0 !important;
 outline:0 !important;
 box-shadow:none !important;
}

#inventoryScreen .invTitle,
#inventoryScreen .invStatsTitle,
#inventoryScreen .materialsLabel,
#inventoryScreen #materialsPanel::before{
 color:#c8a96e !important;
 font-family:"Cinzel","Trajan Pro",Georgia,serif !important;
 font-weight:700 !important;
 letter-spacing:.8px !important;
 text-shadow:0 2px 5px #000 !important;
}

#inventoryScreen #equipPanel .equipWrap{
 background:transparent !important;
 border:0 !important;
 border-radius:0 !important;
 outline:0 !important;
 box-shadow:none !important;
}

#inventoryScreen #equipPanel .invAvatar{
 border:1px solid rgba(142,110,61,.68) !important;
 border-radius:3px !important;
 background:#050807 !important;
 box-shadow:
  0 16px 36px rgba(0,0,0,.56),
  inset 0 0 0 3px rgba(2,5,5,.72),
  0 0 0 1px rgba(211,173,102,.08) !important;
}

html body #inventoryScreen #equipPanel .equipWrap > .equipSlot[data-slot]{
 background:
  radial-gradient(circle at 50% 30%,rgba(112,91,56,.09),transparent 43%),
  linear-gradient(145deg,rgba(15,20,18,.98),rgba(4,7,7,.99)) !important;
 border:1px solid rgba(144,116,68,.78) !important;
 border-radius:4px !important;
 outline:1px solid rgba(219,180,106,.12) !important;
 outline-offset:-4px !important;
 box-shadow:
  inset 0 0 18px rgba(0,0,0,.72),
  0 6px 15px rgba(0,0,0,.46) !important;
}

html body #inventoryScreen #equipPanel .equipWrap > .equipSlot[data-slot]:hover{
 border-color:rgba(210,174,101,.88) !important;
 outline-color:rgba(239,205,137,.22) !important;
 box-shadow:inset 0 0 18px rgba(0,0,0,.62),0 0 13px rgba(183,136,61,.18) !important;
}

html body #inventoryScreen #equipPanel .equipWrap > .equipSlot.slot-common{border-color:rgba(82,214,106,.72) !important;}
html body #inventoryScreen #equipPanel .equipWrap > .equipSlot.slot-epic{border-color:rgba(184,107,255,.80) !important;}
html body #inventoryScreen #equipPanel .equipWrap > .equipSlot.slot-legendary{border-color:rgba(232,187,72,.90) !important;}

html body #inventoryScreen #equipPanel .equipWrap > .equipSlot[data-slot]:not(:has(img))::after{
 display:block !important;
 content:attr(title) !important;
 position:absolute !important;
 inset:50% auto auto 50% !important;
 width:calc(100% - 10px) !important;
 height:auto !important;
 transform:translate(-50%,-50%) !important;
 opacity:1 !important;
 color:rgba(205,180,132,.72) !important;
 background:none !important;
 border:0 !important;
 box-shadow:none !important;
 font:700 8px/1.15 "Cinzel","Trajan Pro",Georgia,serif !important;
 letter-spacing:.25px !important;
 text-align:center !important;
 text-transform:uppercase !important;
 text-shadow:0 2px 5px #000 !important;
 pointer-events:none !important;
}

#inventoryScreen #bagGrid .slot,
#inventoryScreen #bagPanel .bagGrid .slot,
#inventoryScreen .bagGrid#bagGrid .slot{
 background:
  radial-gradient(circle at 50% 34%,rgba(137,107,61,.055),transparent 43%),
  linear-gradient(145deg,rgba(13,18,16,.98),rgba(3,6,6,.99)) !important;
 border:1px solid rgba(132,107,65,.72) !important;
 border-radius:4px !important;
 outline:1px solid rgba(221,184,111,.08) !important;
 outline-offset:-4px !important;
 box-shadow:inset 0 0 18px rgba(0,0,0,.72),0 6px 14px rgba(0,0,0,.38) !important;
}

#inventoryScreen #bagGrid .slot:hover,
#inventoryScreen #bagPanel .bagGrid .slot:hover{
 border-color:rgba(208,171,98,.86) !important;
 outline-color:rgba(232,197,130,.18) !important;
 box-shadow:inset 0 0 18px rgba(0,0,0,.62),0 0 12px rgba(183,136,61,.16) !important;
}

#inventoryScreen #bagGrid .slot.slot-common{border-color:rgba(82,214,106,.72) !important;}
#inventoryScreen #bagGrid .slot.slot-epic{border-color:rgba(184,107,255,.80) !important;}
#inventoryScreen #bagGrid .slot.slot-legendary{border-color:rgba(232,187,72,.90) !important;}

#inventoryScreen .invPagerBtn,
#inventoryScreen #btnInvClose.oaiInvCloseInside_v129,
#inventoryScreen .topClose,
#inventoryScreen .window-close{
 color:#e4c98e !important;
 background:linear-gradient(145deg,#4b1716,#190a0a) !important;
 border:1px solid rgba(157,119,62,.78) !important;
 border-radius:3px !important;
 box-shadow:inset 0 0 0 2px rgba(8,5,4,.72),0 5px 14px rgba(0,0,0,.48) !important;
 text-shadow:0 2px 4px #000 !important;
}

#inventoryScreen .invPagerBtn:hover,
#inventoryScreen #btnInvClose.oaiInvCloseInside_v129:hover,
#inventoryScreen .topClose:hover,
#inventoryScreen .window-close:hover{
 color:#f4dfad !important;
 border-color:rgba(218,173,93,.92) !important;
 filter:brightness(1.12) !important;
}

#inventoryScreen #invPageTxt{
 color:#d6b978 !important;
 font-family:"Cinzel","Trajan Pro",Georgia,serif !important;
 font-weight:700 !important;
 text-shadow:0 2px 4px #000 !important;
}

#inventoryScreen #invStatsPanel .row,
#inventoryScreen #materialsPanel .matRow{
 background:linear-gradient(180deg,rgba(12,17,15,.92),rgba(4,8,7,.96)) !important;
 border-color:rgba(116,94,57,.52) !important;
 border-radius:3px !important;
 box-shadow:inset 0 0 12px rgba(0,0,0,.32) !important;
}

#inventoryScreen #invStatsPanel .row b,
#inventoryScreen #invStatsPanel .row .statVal{
 color:#e2d5bb !important;
 text-shadow:0 1px 3px #000 !important;
}

#inventoryScreen #materialsPanel .matName{color:#d4c5aa !important;}
#inventoryScreen #materialsPanel .matRow b{color:#d9b971 !important;}

#inventoryScreen .invTooltip{
 background:linear-gradient(180deg,rgba(10,15,13,.98),rgba(2,5,5,.99)) !important;
 border-color:rgba(154,122,68,.78) !important;
 border-radius:3px !important;
 box-shadow:inset 0 0 0 2px rgba(213,174,101,.05),0 14px 34px rgba(0,0,0,.72) !important;
}