
  :root{
    --bg:#070a0e;--panel:#0d1218;--panel2:#111923;--line:#2d3946;
    --gold:#f2b84b;--text:#eaf0f6;--muted:#93a0ad;--hp:#e44949;--mp:#4c8dff;--xp:#58d47f;
  }
  *{box-sizing:border-box}
  html,body{margin:0;height:100%;background:#05070a;color:var(--text);font-family:var(--font-ui);font-weight:700;overflow:hidden}
  button{font:inherit;color:inherit}
  #app{height:100%;display:grid;grid-template-rows:72px 1fr 72px;background:#05070a}
  .top,.bottom{display:flex;align-items:center;gap:10px;padding:8px 12px;background:linear-gradient(#11171d,#0a0e12);border-color:#2b3641;z-index:56}
  .top{border-bottom:2px solid #202a33}.bottom{border-top:2px solid #202a33;justify-content:center}
  .brand{font-weight:900;letter-spacing:.12em;color:#f5d28b;font-size:15px;min-width:210px}
  .currency,.navbtn{height:48px;border:1px solid #344454;background:#14202a;border-radius:6px;display:flex;align-items:center;justify-content:center;gap:7px;box-shadow:inset 0 0 0 2px #091016}
  .currency{min-width:145px;font-weight:900}.currency b{color:#ffc84d}
  .spacer{flex:49}
  .navbtn{min-width:110px;padding:0 14px;cursor:pointer;text-transform:uppercase;font-size:12px;font-weight:800}
  .navbtn:hover{filter:brightness(1.15)}
  #gameWrap{position:relative;min-height:0;background:#1a2027}
  canvas{width:100%;height:100%;display:block;image-rendering:pixelated;image-rendering:crisp-edges}
  .hud-left{position:absolute;top:12px;left:12px;width:240px;background:#0b1016dd;border:2px solid #34404b;border-radius:9px;padding:10px;box-shadow:0 8px 30px #0009}
  .avatarRow{display:flex;gap:9px;align-items:center}.avatar{width:46px;height:46px;border-radius:8px;background:linear-gradient(135deg,#232c37,#0c1116);display:grid;place-items:center;font-size:27px;border:2px solid #6e7a87}
  .bars{flex:49}.bar{height:10px;background:#050709;border:1px solid #38434f;margin:4px 0;position:relative}.bar i{display:block;height:100%}
  #hpBar{background:linear-gradient(90deg,#b52d31,#f05252)}#mpBar{background:linear-gradient(90deg,#235dbd,#5ea5ff)}#xpBar{background:linear-gradient(90deg,#23743e,#61de86)}
  .small{font-size:11px;color:#c6d0d9}
  .stagePanel{position:absolute;right:12px;top:12px;width:245px;background:#080b0fcc;border:2px solid #9c7322;padding:12px;box-shadow:0 8px 30px #0008}
  #stageRerunToggle{min-width:112px;border:2px solid #653526;background:#26120d;color:#d08358;cursor:pointer;font-family:inherit;padding:5px 8px}
  #stageRerunToggle.on{border-color:#397b51;background:#10251a;color:#70e496}
  #stageRerunToggle b,#stageRerunToggle small{display:block}
  #stageRerunToggle b{font-size:11px}
  #stageRerunToggle small{margin-top:3px;color:#8e99a2;font-size:11px}
  .stageTitle{color:#ffd76a;text-align:center;font-weight:900;font-size:13px}.waveTxt{text-align:center;font-size:11px;margin-top:5px}
  .progress{height:7px;background:#171717;margin-top:8px;border:1px solid #4c4c4c}.progress i{height:100%;display:block;background:#56d978}
  .lootLog{position:absolute;right:12px;top:128px;width:245px;background:#080b0fcc;border:1px solid #38434d;padding:10px;font-size:11px;line-height:1.6}
  .lootLog b{color:#ffc64b}.drop{color:#6de693}
  .skillbar{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);display:flex;gap:8px}
  .skill{width:62px;height:62px;background:#0b1017dd;border:2px solid #4d5e70;border-radius:7px;position:relative;display:grid;place-items:center;font-size:26px;cursor:pointer;overflow:hidden}
  .skill span{position:absolute;bottom:2px;right:5px;font-size:11px;font-weight:900;color:#fff}
.skillName{position:absolute;left:3px;right:13px;bottom:2px;font-size:11px;color:#d7e0e8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.partySlots{position:absolute;left:50%;top:12px;transform:translateX(-50%);display:flex;gap:7px;z-index:70}
.partySlot{width:126px;height:48px;background:#0b1017e8;border:2px solid #435365;display:flex;align-items:center;gap:7px;padding:5px 7px;cursor:pointer;box-shadow:0 4px 16px #0007}
.partySlot.active{border-color:#e3aa42;box-shadow:0 0 13px #e3aa4240}
.partySlot .num{width:22px;height:22px;display:grid;place-items:center;background:#18232e;border:1px solid #596a78;color:#ffd46a}
.partySlot .pico{font-size:22px}.partySlot .pname{font-size:11px}.partySlot .prole{font-size:11px;color:#8fa0ad}

.partySlot.empty{opacity:.5}

/* V94 — EQUIPPED PARTY STATUS SIDEBAR */
.partySlots{display:none!important}
.hud-left.playerCard{display:none!important}

.partyStatusSidebar{
 position:absolute;left:10px;top:10px;z-index:74;
 display:flex;flex-direction:column;gap:7px;
 width:292px;pointer-events:auto
}
.partyStatusCard{
 height:88px;padding:7px 9px;pointer-events:auto;user-select:none;
 position:relative;

 display:grid;grid-template-columns:58px 1fr;gap:9px;align-items:center;
 background:#080d12ee;border:3px solid #344754;
 box-shadow:inset 0 0 0 2px #081018,0 4px 14px #0009;
 image-rendering:pixelated;cursor:pointer
}
.partyStatusCard.active{
 border-color:#c79747;
 box-shadow:inset 0 0 0 2px #151008,0 0 11px #e4a74255,0 4px 14px #0009
}
.partyStatusCard.fallen{opacity:.48;filter:grayscale(.85)}
.partyStatusPortrait{
 width:54px;height:66px;border:3px solid #496171;background:#101923;
 display:grid;place-items:center;position:relative;
 box-shadow:inset 0 0 0 3px #071018
}
.partyStatusPortrait .face{
 width:34px;height:38px;background:#d5b184;border:4px solid #203240;position:relative
}
.partyStatusPortrait .face:before{
 content:"";position:absolute;left:-4px;right:-4px;top:-9px;height:13px;background:#315b8a
}
.partyStatusPortrait[data-hero="1"] .face:before{background:#9aa4ad}
.partyStatusPortrait[data-hero="2"] .face:before{background:#e5e7dc}
.partyStatusPortrait[data-hero="3"] .face:before{background:#6a418b}
.partyStatusPortrait .face:after{
 content:"";position:absolute;width:5px;height:5px;background:#111;left:7px;top:13px;
 box-shadow:14px 0 0 #111
}
.heroPortraitImg{
 width:100%;height:100%;display:block;object-fit:cover;object-position:center 22%;
 image-rendering:auto
}
.partyStatusPortrait .heroPortraitImg{object-position:center 20%}
.charSheetPortrait .heroPortraitImg{object-position:center 18%}
.heroPreview.compactPreview .heroPortraitImg,
.slotHeroMini .heroPortraitImg{
 width:100%;height:100%;object-fit:cover;object-position:center 20%;display:block
}
.heroPortraitRoster{
 position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 20%;display:block
}

.partyStatusInfo{min-width:0}
.partyStatusHead{
 display:flex;align-items:center;gap:7px;height:17px;
 font-size:11px;white-space:nowrap;overflow:hidden
}
.partyStatusHead b{font-size:11px;color:#fff}
.partyStatusHead strong{
 font-size:11px;overflow:hidden;text-overflow:ellipsis;letter-spacing:.04em
}
.partyFaithStack{
 color:#f0c76b;font-size:11px;line-height:9px;letter-spacing:.06em;
 text-shadow:0 1px 2px #000;white-space:nowrap
}
.partyStatusBars{display:flex;flex-direction:column;gap:4px;margin-top:3px}
.partyStatusLine{display:grid;grid-template-columns:1fr 57px;gap:6px;align-items:center}
.partyStatusBar{
 height:9px;background:#020406;border:2px solid #88939b;position:relative;
 box-shadow:inset 0 0 0 1px #15191d
}
.partyStatusBar i{display:block;height:100%}
.partyStatusLine.hp i{background:#c43136}
.partyStatusLine.mp i{background:#315ebd}
.partyStatusLine.xp i{background:#29934e}
.partyStatusVal{font-size:11px;color:#edf2f5;text-align:right}
.partyStatusCard .slotTag{
 position:absolute;right:4px;top:3px;font-size:11px;color:#8698a6
}

/* V95 — CHARACTER SHEET */
#characterSheetOverlay{
 position:fixed;inset:0;z-index:9999;display:none;
 align-items:flex-start;justify-content:center;
 padding-top:18px;padding-bottom:118px;
 box-sizing:border-box;
 background:#020406c9;
}
.charSheet{
 width:min(920px,96vw);max-height:calc(100vh - 92px);overflow:hidden;
 background:
   linear-gradient(#15191d,#0a0d10);
 border:4px solid #59636b;
 box-shadow:inset 0 0 0 3px #11161a,inset 0 0 0 5px #050708,0 18px 55px #000;
 padding:12px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
 grid-template-areas:"top top" "attributes skills" "secret skills" "footer footer";
 column-gap:12px;align-content:start;
 image-rendering:pixelated
}
.charSheetTop{grid-area:top}
.charAttrList{grid-area:attributes}
.charSkillSection{grid-area:skills}
.charSheetSecretRow{grid-area:secret}
.charSheetFooter{grid-area:footer}
.charSheetTop{
 display:grid;grid-template-columns:72px 1fr auto;gap:11px;align-items:center;
 padding:8px;background:#080b0d;border:2px solid #3f4a52;margin-bottom:10px
}
.charSheetPortrait{
 width:68px;height:68px;border:3px solid #526673;background:#101820;
 display:grid;place-items:center;position:relative
}
.charSheetPortrait .face{
 width:38px;height:42px;background:#d5b184;border:4px solid #203240;position:relative
}
.charSheetPortrait .face:before{
 content:"";position:absolute;left:-4px;right:-4px;top:-10px;height:14px;background:#315b8a
}
.charSheetPortrait[data-hero="1"] .face:before{background:#9da6ad}
.charSheetPortrait[data-hero="2"] .face:before{background:#e5e7dc}
.charSheetPortrait[data-hero="3"] .face:before{background:#6a418b}
.charSheetTitle h2{margin:0;color:#e9e1b0;font-size:16px}
.charSheetTitle .sub{font-size:11px;color:#8ea0ad;margin-top:4px}
.charPoints{
 text-align:center;min-width:98px;padding:7px;border:2px solid #5a4d2b;background:#17130b;
 color:#e4bd55;font-size:11px
}
.charPoints b{display:block;font-size:21px;color:#ffd86d;margin-top:2px}
.charAttrList{display:flex;flex-direction:column;gap:7px}
.charAttr{
 background:#0a0d0f;border:2px solid #313b42;
 padding:8px 9px;display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center
}
.charAttrMain{min-width:0}
.charAttrName{
 display:flex;align-items:center;gap:8px;color:#dfd88a;font-size:12px;
 text-transform:uppercase;letter-spacing:.04em
}
.charAttrName b{font-size:15px;color:#fff}
.charAttrDesc{font-size:11px;color:#9eabb4;margin-top:3px;line-height:1.35}
.attrDerived{font-size:11px;color:#6ea8c8;margin-top:3px}
.attrPlus{
 width:34px;height:34px;border:2px solid #af7f2f;background:#402d0e;color:#ffd65d;
 font-size:22px;cursor:pointer;box-shadow:inset 0 0 0 2px #151008
}
.attrPlus:disabled{filter:grayscale(1);opacity:.35;cursor:not-allowed}

.charSkillSection{
 margin-top:0;padding:0 0 0 12px;border-top:0;border-left:2px solid #3a444b
}
.charSkillSectionTitle{
 display:flex;align-items:center;justify-content:space-between;
 color:#e8d989;font-size:11px;margin-bottom:7px;letter-spacing:.06em
}
.charSkillPoints{
 color:#ffd65d;border:1px solid #665027;background:#17130b;padding:4px 8px;font-size:11px
}
.charSkillList{display:flex;flex-direction:column;gap:7px}
.charSkillRow{
 display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center;
 background:#0a0d0f;border:2px solid #313b42;padding:8px 9px
}
.charSkillName{
 display:flex;align-items:center;gap:8px;color:#e6d27e;font-size:12px
}
.charSkillName b{color:#fff;font-size:14px}
.charSkillDesc{font-size:11px;color:#9eabb4;margin-top:3px;line-height:1.35}
.charSkillDerived{font-size:11px;color:#d08b56;margin-top:3px}
.charSkillPlus{
 width:34px;height:34px;border:2px solid #af7f2f;background:#402d0e;color:#ffd65d;
 font-size:22px;cursor:pointer;box-shadow:inset 0 0 0 2px #151008
}
.charSkillPlus:disabled{filter:grayscale(1);opacity:.35;cursor:not-allowed}

/* V98 — SECRET SKILLS */
.secretSkillsBtn{
 width:38px;height:38px;border:3px solid #7c6a39;background:#17130c;color:#ffd75d;
 display:grid;place-items:center;font-size:24px;line-height:1;cursor:pointer;
 box-shadow:inset 0 0 0 2px #080704,0 3px 10px #0009
}
.secretSkillsBtn:hover{filter:brightness(1.15)}
.charSheetSecretRow{
 display:flex;align-items:center;gap:8px;margin-top:10px;
}
.charSheetSecretLabel{
 font-size:11px;color:#9aa8b2;
}

/* V214 — Character sheet opened from Tactical Hand. One focused page at a time. */
#characterSheetOverlay{z-index:1000020}
#characterSheetOverlay .charSheet{
 width:min(820px,92vw);max-height:calc(100vh - 112px);overflow:auto;
 display:grid;grid-template-columns:1fr;grid-template-areas:"top" "content" "footer";
 row-gap:8px;padding:10px;
}
.charSheetRightPage{grid-area:content;min-width:0;display:grid;grid-template-rows:auto minmax(0,1fr);gap:8px}
.charSheetTabs{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}
.charSheetTab{
 min-height:32px;border:1px solid #52626d;background:#10171d;color:#9fadb5;
 font:900 11px var(--font-ui);letter-spacing:1px;cursor:pointer;
}
.charSheetTab.active{color:#ffe09a;border-color:#c18b32;background:linear-gradient(#4d3516,#261a0a);box-shadow:inset 0 0 0 1px #120d06}
.charSheetTabPanels{min-height:0}
.charSheetTabPanel{display:none;min-height:300px}.charSheetTabPanel.active{display:block}
#characterSheetOverlay .charAttrList{gap:6px}
.charStatusSummary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-bottom:7px}
.charStatusSummary span{display:block;padding:7px;border:1px solid #334754;background:#081016;color:#b6c5ce;font:900 11px var(--font-ui);text-align:center}
.charStatusSummary b{display:block;margin-top:3px;color:#f2df9b;font-size:12px}
.charAccessoryLoadoutV271{display:grid;grid-template-columns:42px minmax(0,1fr) 42px;gap:7px;align-items:center;margin-bottom:7px;padding:7px;border:1px solid #3a4650;background:linear-gradient(90deg,#080d11,#11171b,#080d11)}
.charAccessorySideV271{display:flex;flex-direction:column;gap:5px}.charAccessorySideV271.right{justify-content:center}
.charAccessorySideV271 button{position:relative;width:40px;height:40px;padding:0;border:1px solid #67572f;background:#090c0f;color:#7f7250;cursor:pointer;box-shadow:inset 0 0 8px #000}
.charAccessorySideV271 button::after{content:attr(data-slot-label);position:absolute;left:1px;right:1px;bottom:1px;padding:1px;background:#050709d9;color:#bca35e;font:700 11px var(--font-ui);letter-spacing:.3px}
.charAccessorySideV271 button.empty::before{content:'+';color:#5f645f;font:700 16px var(--font-display)}
.charAccessorySideV271 button img{width:31px;height:31px;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 2px 2px #000)}
.charAccessoryAtlasV272{display:block;width:31px;height:31px;filter:drop-shadow(0 2px 2px #000)}
.charAccessoryBuildV271{text-align:center;min-width:0}.charAccessoryBuildV271 strong{display:block;color:#dbc573;font:900 11px var(--font-ui);letter-spacing:1px}.charAccessoryBuildV271 span{display:block;overflow:hidden;margin-top:4px;color:#75ca89;font:700 11px var(--font-ui);line-height:1.35;text-overflow:ellipsis}.charAccessoryBuildV271 small{display:block;margin-top:4px;color:#64737c;font:11px var(--font-ui);letter-spacing:.5px}
.charModifierOverviewV342{margin-bottom:7px;padding:8px;border:1px solid #3a4c58;background:linear-gradient(135deg,#071015,#101820 55%,#080d11);box-shadow:inset 0 0 18px #0008}
.charModifierOverviewHeadV342{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:7px;padding-bottom:6px;border-bottom:1px solid #293b46}
.charModifierOverviewHeadV342 strong{display:block;color:#e3cf82;font:900 11px var(--font-ui);letter-spacing:1px}.charModifierOverviewHeadV342 small{display:block;margin-top:2px;color:#6f818c;font:700 11px var(--font-ui);letter-spacing:.6px}
.charModifierGridV342{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}
.charModifierStatV342{min-width:0;padding:5px 6px;border:1px solid #283a45;background:#070d12}
.charModifierStatV342 span{display:block;overflow:hidden;color:#8495a0;font:700 11px var(--font-ui);letter-spacing:.4px;text-overflow:ellipsis;white-space:nowrap}.charModifierStatV342 b{display:block;margin-top:2px;color:#e8dcaa;font:900 11px var(--font-ui)}.charModifierStatV342 em{display:block;overflow:hidden;margin-top:2px;color:#65c787;font:normal 700 11px var(--font-ui);text-overflow:ellipsis;white-space:nowrap}
.charModifierSourcesV342{margin-top:6px;padding:5px 6px;border-left:2px solid #805a25;background:#080c10;color:#93a2aa;font:700 11px/1.45 var(--font-ui);letter-spacing:.2px}
.charModifierSourcesV342 b{color:#cfae63}.charModifierSourcesV342 .none{color:#596771}
@media(max-width:1100px){.charModifierGridV342{grid-template-columns:repeat(3,minmax(0,1fr))}}
#characterSheetOverlay .charSkillSection{padding:0;border:0}
#characterSheetOverlay .charSheetFooter{margin-top:0}
#characterSheetOverlay.tacticalCharacterBook{
 align-items:center;justify-content:center;flex-direction:row;gap:8px;
 padding:12px;background:#020406e8;z-index:1000020;
}
#characterSheetOverlay.tacticalCharacterBook #gptBagOverlay{order:1}
#characterSheetOverlay.tacticalCharacterBook .charSheet{
 order:2;width:min(690px,53vw);height:647px;max-height:calc(100vh - 24px);
 overflow:auto;box-sizing:border-box;
}
@media(max-height:760px){
 #characterSheetOverlay .charSheet{max-height:calc(100vh - 76px)}
 .charSheetTabPanels,.charSheetTabPanel{min-height:0}
 .charStatusSummary span{padding:4px}
 #characterSheetOverlay.tacticalCharacterBook .charSheet{height:647px;zoom:.94}
}
#secretSkillsOverlay{
 position:fixed;inset:0;z-index:1000050;display:none;
 align-items:flex-start;justify-content:center;
 padding-top:18px;padding-bottom:118px;box-sizing:border-box;
 background:#020406d8
}
.secretSkillsPanel{
 width:min(650px,94vw);max-height:calc(100vh - 145px);overflow:auto;
 background:linear-gradient(#12171b,#090c0f);
 border:4px solid #52626d;
 box-shadow:inset 0 0 0 3px #0b1014,inset 0 0 0 5px #020405,0 20px 60px #000;
 padding:12px
}
.secretSkillsTop{
 display:flex;align-items:center;justify-content:space-between;gap:10px;
 background:#080b0e;border:2px solid #39454d;padding:9px 10px;margin-bottom:10px
}
.secretSkillsTop h2{margin:0;color:#d9cc7a;font-size:16px}
.secretSkillPoints{
 color:#ffd65d;border:2px solid #5d4c28;background:#17130c;padding:7px 10px;font-size:11px
}
.secretSkillGrid{display:flex;flex-direction:column;gap:8px}
.secretSkillRow{
 display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center;
 background:#090d10;border:2px solid #303a41;padding:9px
}
.secretSkillName{color:#e7d681;font-size:12px;display:flex;gap:8px;align-items:center}
.secretSkillName b{color:#fff}
.secretSkillDesc{font-size:11px;color:#9aa8b2;margin-top:3px;line-height:1.35}
.secretSkillDerived{font-size:11px;color:#b07dd7;margin-top:3px}
.secretSkillPlus{
 width:36px;height:36px;border:2px solid #9b742e;background:#3b2a0e;color:#ffdb61;
 font-size:23px;cursor:pointer;box-shadow:inset 0 0 0 2px #100b03
}
.secretSkillPlus:disabled{opacity:.35;filter:grayscale(1);cursor:not-allowed}
.secretSkillsClose{
 width:36px;height:36px;border:2px solid #70463f;background:#2a1110;color:#fff;cursor:pointer
}
.secretLockedNote{
 font-size:11px;color:#7f8b94;padding:8px;border:1px dashed #39444b;background:#080b0d
}


.charSheetFooter{
 display:flex;gap:8px;justify-content:flex-end;margin-top:10px;
 padding-bottom:4px
}
.charSheetBtn{
 min-width:100px;height:36px;border:2px solid #4f606b;background:#111923;color:#dce6ec;cursor:pointer
}
.charSheetBtn.danger{border-color:#78543d;color:#e7b287}
.charSheetClose{
 width:34px;height:34px;border:2px solid #734a42;background:#2b1110;color:#fff;cursor:pointer
}


  .skill .cd{position:absolute;inset:0;background:#000a;display:none;place-items:center;font-size:16px;font-weight:900}
  .skill.cool .cd{display:grid}

.skill[data-key="f"]{border-color:#bd582d;box-shadow:inset 0 0 12px #ff6b2530,0 0 8px #ff7a2a22}
.skill[data-key="f"]:hover{border-color:#ff8d41;box-shadow:inset 0 0 15px #ff6b2545,0 0 12px #ff7a2a45}

  .hint{position:absolute;left:12px;bottom:14px;background:#080b0fbb;border:1px solid #34414e;padding:8px 10px;font-size:11px;color:#c0cad3}
  #talentModal,#lootModal{position:absolute;inset:0;background:#000b;display:none;align-items:center;justify-content:center;z-index:81}
  .modal{width:min(1500px,98vw);max-height:90vh;overflow:auto;background:#0a0e13;border:2px solid #bb8a2c;box-shadow:0 20px 60px #000;padding:18px}
  .modal h2{margin:0 0 14px;color:#f1d18b}
  .talGrid{position:relative;height:720px;min-height:720px;overflow:hidden;cursor:pointer;user-select:none;touch-action:none;background:
radial-gradient(circle at 50% 0%,#172434 0,#0a0e13 56%);border:1px solid #293644}
.talentTree{position:absolute;width:3700px;height:2300px;left:0;top:0;margin:0;transform-origin:0 0;will-change:transform}
.treeLine{position:absolute;height:2px;pointer-events:none;background:#485461;transform-origin:0 50%;z-index:47;opacity:.72}
.treeLine.on{background:#d69c32;box-shadow:0 0 8px #d69c3266}
.treeLine.skill{background:#6352c8}.treeLine.char{background:#2ca7bb}
.talNode{position:absolute;width:96px;height:96px;border-radius:50%;transform:translate(-50%,-50%);
background:#0c1117;border:2px solid #3b4652;display:flex;flex-direction:column;align-items:center;justify-content:center;
cursor:pointer;z-index:50;box-shadow:0 0 0 4px #070a0dcc;transition:.15s}
.talNode:hover{transform:translate(-50%,-50%) scale(1.08)}
.talNode.on{border-color:#e0a83e;box-shadow:0 0 0 4px #070a0dcc,0 0 18px #e0a83e55}
.talNode.lock{opacity:.35;filter:grayscale(1);cursor:not-allowed}
.talNode.skillNode{border-color:#765cff;box-shadow:0 0 0 4px #070a0dcc,0 0 16px #765cff55}
.talNode.charNode{border-color:#35c7d8;box-shadow:0 0 0 4px #070a0dcc,0 0 16px #35c7d855}
.talNode .ico{font-size:28px}.talNode .name{font-size:11px;text-align:center;font-weight:900;margin-top:3px;line-height:1.05;padding:0 4px}
.talNode .lvl{font-size:11px;color:#ffc85a}
.treeLegend{text-align:center;font-size:11px;color:#93a0ad;margin:8px 0 12px}
.branchLabel{position:absolute;font-weight:900;letter-spacing:.12em;font-size:11px;opacity:.9}
.talentSummary{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin:0 0 12px}
.talentSummary div{background:#101720;border:1px solid #2f3d4c;padding:8px;text-align:center;font-size:11px}
.talentSummary b{display:block;color:#ffd06a;font-size:12px;margin-top:2px}
.talentBenefitsSummary{margin:0 0 12px;padding:8px;border:1px solid #354553;background:#080d12;color:#d9b85f}
.talentBenefitsSummary>strong{display:block;margin-bottom:7px;font-size:11px;letter-spacing:1px}
.talentBenefitsSummary>div{display:grid;grid-template-columns:repeat(auto-fit,minmax(185px,1fr));gap:4px;max-height:122px;overflow:auto;padding-right:4px}
.talentBenefitsSummary span{display:flex;flex-direction:column;gap:2px;padding:5px 7px;border:1px solid #293641;background:#0d141b;color:#788895}
.talentBenefitsSummary span.active{border-color:#9c752c;background:#181409;color:#f0cc6c}
.talentBenefitsSummary b{font-size:11px}.talentBenefitsSummary small{font-size:11px;line-height:1.35;color:#9fb0bb}
  .tal{min-height:100px;background:#121922;border:1px solid #364556;padding:10px;text-align:center;cursor:pointer;position:relative}
  .tal.lock{opacity:.45}.tal .ico{font-size:28px}.tal .name{font-size:11px;font-weight:900;margin:4px 0}.tal .cost{font-size:11px;color:#ffc54c}
  .close{float:right;background:#3a1111;border:1px solid #a14d4d;padding:6px 10px;cursor:pointer}
  .chestPop{position:absolute;left:50%;top:25%;transform:translate(-50%,-50%) scale(.8);opacity:0;pointer-events:none;background:#0a0f15ee;border:2px solid #e0a531;padding:11px 18px;color:#ffd05a;font-weight:900;transition:.25s;z-index:68;display:flex;align-items:center;gap:13px}
  .chestPop.show{opacity:2;transform:translate(-50%,-50%) scale(1)}
  .bottom .navbtn.active{border-color:#d89d37;background:#5a271f}
  @media(max-width:900px){
    #app{grid-template-rows:62px 1fr 64px}.brand{display:none}.currency{min-width:100px;height:42px}.top .navbtn{display:none}
    .hud-left{width:185px}.stagePanel,.lootLog{width:185px}.lootLog{top:122px}.hint{display:none}
    .bottom{overflow-x:auto;justify-content:flex-start}.bottom .navbtn{min-width:92px;height:44px}
  }

.heroToggle{min-width:92px}
.heroToggle:hover{transform:translateY(-1px)}
.heroSelect:disabled{cursor:not-allowed;opacity:.45;filter:grayscale(1)}

/* PIXEL PARTY SELECT */
.heroSelectScreen{
  background:#071018;
  border:3px solid #263847;
  box-shadow:inset 0 0 0 3px #05080c,0 0 0 2px #9e7223;
  padding:14px;
}
.heroSelectTitle{
  font-size:13px;color:#f2d78f;margin-bottom:10px;letter-spacing:.08em
}
.heroStage{
  position:relative;height:260px;overflow:hidden;
  background:
    linear-gradient(#6f9fb8 0 38%,#5f8ea4 38% 48%,#2f4c3c 48% 57%,#705235 57% 100%);
  border:3px solid #1d2b35;box-shadow:inset 0 0 0 2px #a87b33;
  image-rendering:pixelated;
}
.heroStage:before{
  content:"";position:absolute;inset:auto 0 43% 0;height:8px;background:#83b8c7;
  box-shadow:0 8px 0 #4f7f94,0 16px 0 #345b6e;
}
.heroStage:after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:18px;background:#3c2d22;
  box-shadow:0 -7px 0 #8b6743,0 -13px 0 #5f482f;
}
.formationSlots{
  position:absolute;left:50%;bottom:24px;transform:translateX(-50%);
  display:flex;gap:48px;z-index:8
}
.formSlot{
  width:112px;height:64px;border:3px dashed #c59a52;background:#152029aa;
  position:relative;display:grid;place-items:center;color:#e8c67b;font-size:11px;
  box-shadow:inset 0 0 0 2px #081017;
}
.formSlot.filled{border-style:solid;border-color:#f0c262;background:#172734dd}
.formSlot.dragOver{border-color:#fff0a8;box-shadow:0 0 14px #ffe39066,inset 0 0 0 2px #081017}
.slotNum{position:absolute;top:3px;left:4px;color:#fff;font-size:11px}
.slotHeroMini{position:absolute;bottom:4px;left:50%;transform:translateX(-50%) scale(.72);transform-origin:50% 100%;pointer-events:none}
.heroRosterStrip{
  display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:12px
}
.heroPickCard{
  min-height:210px;background:#101922;border:2px solid #344958;padding:10px;position:relative;
  cursor:pointer;box-shadow:inset 0 0 0 2px #081017;
}
.heroPickCard:active{cursor:pointerbing}
.heroPickCard.active{border-color:#e0aa42}
.heroPreview{
  height:116px;background:#0b1219;border:2px solid #263744;position:relative;overflow:hidden;
  display:grid;place-items:end center;
}
.heroPreviewGround{
  position:absolute;left:0;right:0;bottom:0;height:22px;background:#76563a;
  box-shadow:0 -6px 0 #9a744c,0 -10px 0 #33442f;
}
.heroAnimMount{
  position:absolute;left:50%;bottom:17px;transform:translateX(-50%) scale(1.25);
  transform-origin:50% 100%;
}
.heroPickCard h3{font-size:12px;margin:8px 0 4px;color:#f1e3c2}
.heroPickCard p{font-size:11px;color:#aab7c2;margin:2px 0}
.heroDragHint{font-size:11px;color:#e5bc69;margin-top:8px}
.confirmParty{
  margin-top:12px;width:180px;height:38px;background:#3c2918;border:2px solid #d09a3b;
  box-shadow:inset 0 0 0 2px #17100a;color:#ffe09a;cursor:pointer;font-size:11px
}
.confirmParty:hover{filter:brightness(1.15)}
.dragGhost{position:fixed;pointer-events:none;z-index:9999;opacity:.9}


.miniSprite{position:relative;width:34px;height:42px;animation:heroIdle .9s steps(2,end) infinite;image-rendering:pixelated}
@keyframes heroIdle{0%{transform:translateY(0)}50%{transform:translateY(-3px)}100%{transform:translateY(0)}}
.miniSprite:before,.miniSprite:after,.miniSprite i,.miniSprite b,.miniSprite em{content:"";position:absolute;display:block}
.mageMini:before{left:8px;top:5px;width:18px;height:12px;background:#d9d6df;box-shadow:-3px 3px 0 #aaa7b5,12px 3px 0 #eeeaf1}
.mageMini:after{left:6px;top:17px;width:22px;height:18px;background:#38214b;box-shadow:-3px 7px 0 #25152f,17px 5px 0 #2b1735,3px 18px 0 #16141b,13px 18px 0 #16141b}
.mageMini i{left:8px;top:0;width:20px;height:5px;background:#24142e;box-shadow:6px -4px 0 #402051}
.mageMini b{left:29px;top:4px;width:3px;height:28px;background:#6e492c;box-shadow:-3px -3px 0 #6d34b6,0 -3px 0 #d99cff}
.mageMini em{left:12px;top:12px;width:3px;height:2px;background:#9b48ff;box-shadow:8px 0 0 #9b48ff}
.warriorMini:before{left:7px;top:4px;width:22px;height:13px;background:#727a82;box-shadow:-2px 4px 0 #5a6269,3px -4px 0 #9d4247}
.warriorMini:after{left:7px;top:18px;width:22px;height:17px;background:#59616b;box-shadow:-4px 0 0 #87919a,2px 17px 0 #262a30,13px 17px 0 #262a30}
.warriorMini i{left:28px;top:19px;width:24px;height:5px;background:#cdd2d4;box-shadow:18px -1px 0 #f2f4f4}
.warriorMini b{left:26px;top:15px;width:4px;height:14px;background:#a88a55}
.warriorMini em{left:11px;top:10px;width:13px;height:3px;background:#242a30}
.healerMini:before{left:8px;top:5px;width:20px;height:13px;background:#eeeadd;box-shadow:-3px 3px 0 #c8cebd,14px 3px 0 #dce1d3}
.healerMini:after{left:6px;top:18px;width:23px;height:17px;background:#dcd9c9;box-shadow:-3px 5px 0 #6f8968,18px 4px 0 #55735a,3px 17px 0 #d5d2c2,14px 17px 0 #d5d2c2}
.healerMini i{left:29px;top:4px;width:3px;height:29px;background:#7b5934;box-shadow:-3px -4px 0 #658f78,0 -4px 0 #b9f2c8}
.healerMini b{left:12px;top:11px;width:3px;height:2px;background:#57a48a;box-shadow:8px 0 0 #57a48a}
.healerMini em{left:13px;top:1px;width:13px;height:4px;background:#75936d}
.archerMini:before{left:7px;top:5px;width:21px;height:13px;background:#c8c0d6;box-shadow:-4px 4px 0 #4a315f,15px 3px 0 #2b183d}
.archerMini:after{left:6px;top:18px;width:23px;height:17px;background:#24152f;box-shadow:-4px 5px 0 #3b2052,18px 4px 0 #160d20,3px 17px 0 #121018,14px 17px 0 #121018}
.archerMini i{left:25px;top:13px;width:4px;height:24px;background:#4b2a62;transform:rotate(18deg);box-shadow:5px 0 0 #a74cff}
.archerMini b{left:10px;top:10px;width:3px;height:2px;background:#c565ff;box-shadow:9px 0 0 #c565ff}
.archerMini em{left:8px;top:1px;width:19px;height:5px;background:#171020;box-shadow:5px 3px 0 #38204d}


.simpleParty{padding:12px}
.partyHelp{font-size:11px;color:#9fb0bc;margin:-2px 0 10px}
.simpleStage{height:112px}
.simpleSlots{bottom:20px;gap:22px}
.simpleSlots .formSlot{width:102px;height:56px}
.simpleSlot{cursor:pointer;border-style:solid}
.simpleSlot.awaitingSlot{border-color:#f0c262;box-shadow:0 0 0 2px #5b431f inset,0 0 12px #f0c26244}
.emptyPlus{font-size:24px;color:#6f8290;margin-top:8px}
.slotHeroName{position:absolute;bottom:5px;font-size:11px;color:#f1d9a2}
.simpleRoster{grid-template-columns:repeat(6,minmax(0,1fr));gap:7px}
.simplePick{min-width:0;min-height:157px;padding:7px 6px;cursor:pointer}
.compactPreview{height:78px}
.simplePick h3{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.simplePick p{font-size:11px;line-height:1.25;min-height:30px}
.simplePick.lockedHeroPick{border-color:#4d4260;background:#141525}
.simplePick.lockedHeroPick .pickState{color:#b998e8}
.simplePick.premiumHeroPick{
  border-color:#e7b84b;
  background:linear-gradient(145deg,#27163b 0%,#151126 52%,#2b1b38 100%);
  box-shadow:inset 0 0 0 2px #6f4a16,0 0 12px #b767ff55;
}
.simplePick.premiumHeroPick:hover{
  border-color:#ffe292;
  box-shadow:inset 0 0 0 2px #9a6e24,0 0 18px #d585ff88;
}
.simplePick.premiumHeroPick h3{color:#ffe08a;text-shadow:0 1px 0 #000,0 0 7px #e7ad43aa}
.simplePick.premiumHeroPick .heroPreview{border-color:#a8752d;box-shadow:inset 0 0 10px #9a53d533}
.simplePick.premiumHeroPick .pickState{color:#e1a6ff;text-shadow:0 0 6px #b54cff88}
.simplePick.selectedPick{border-color:#fff0a8;box-shadow:0 0 0 2px #6b4f20 inset,0 0 14px #f0c26255}
.pickState{font-size:11px;color:#e3b866;margin-top:6px}
.partyActions{display:flex;justify-content:center;gap:10px}
.clearPartyBtn{width:110px;border-color:#596978;background:#17212a;color:#cbd4da}
.heroDragHint{display:none!important}


.slotRemove{
  position:absolute;right:3px;top:2px;width:18px;height:18px;
  display:grid;place-items:center;background:#4b1717;border:1px solid #a34b4b;
  color:#fff;font-size:13px;line-height:1;z-index:20
}
.slotRemove:hover{background:#7a2424}
.confirmParty{font-size:11px}

@media(max-width:900px){
  .simpleRoster{grid-template-columns:repeat(3,minmax(0,1fr))}
  .simplePick{min-height:145px}
  .simpleStage{height:104px}
}


.sixSkills{gap:6px}
.sixSkills .skill{width:58px;height:58px}
.heroSkill[data-hero="0"]{border-color:#8c5ad9}
.heroSkill[data-hero="1"]{border-color:#b06b3e}
.heroSkill[data-hero="2"]{border-color:#6fa878}
.heroSkill[data-hero="3"]{border-color:#8f45d8}
.heroSkill.inactiveHeroSkill{opacity:.38;filter:saturate(.55)}
.heroSkill.lockedHeroSkill{opacity:.42;filter:grayscale(1);cursor:not-allowed}
.heroSkill.lockedHeroSkill::after{content:'LOCKED';position:absolute;inset:auto 2px 2px;z-index:6;padding:2px 1px;background:#120b0be8;color:#ff8d8d;font-size:11px;text-align:center;letter-spacing:.4px}


.autoSkillWrap{display:flex;align-items:center;margin-right:5px}
.autoSkillsBtn{
 width:58px;height:58px;background:#101923;border:3px solid #566573;color:#c9d2d8;
 font-family:inherit;cursor:pointer;box-shadow:inset 0 0 0 2px #080c10,0 2px 0 #050709;
 display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px
}
.autoSkillsBtn b{font-size:11px;letter-spacing:.6px}
.autoSkillsBtn small{font-size:11px;opacity:.72}
.autoSkillsBtn.on{
 color:#d9ffe1;border-color:#55d57a;background:#153522;
 box-shadow:inset 0 0 0 2px #09160d,0 0 10px #45d66b66,0 2px 0 #050709
}
.autoSkillsBtn.on b{color:#77ef98}


/* compact AUTO toggle beside hotkeybar */
.autoSkillWrap{display:flex;align-items:center;margin-right:4px}
.autoSkillsBtn{
 width:38px!important;height:38px!important;min-width:38px;padding:0!important;
 border:2px solid #566573!important;background:#101923!important;color:#c9d2d8!important;
 display:grid!important;place-items:center!important;font-family:inherit!important;cursor:pointer!important;
 box-shadow:inset 0 0 0 1px #080c10,0 2px 0 #050709!important
}
.autoSkillsBtn b{font-size:11px!important;letter-spacing:.4px!important;line-height:1!important}
.autoSkillsBtn.on{
 color:#d9ffe1!important;border-color:#55d57a!important;background:#153522!important;
 box-shadow:inset 0 0 0 1px #09160d,0 0 8px #45d66b66,0 2px 0 #050709!important
}
.autoSkillsBtn.on b{color:#77ef98!important}


#sixSkillBar #autoSkillsBtn{
 display:grid!important;
 position:relative!important;
 visibility:visible!important;
 opacity:1!important;
 flex:0 0 38px!important;
 width:38px!important;height:58px!important;
 margin-right:3px!important;
 align-self:center!important;
 border:3px solid #667783!important;
 background:#17212b!important;
 color:#e3e9ed!important;
 z-index:20!important;
}
#sixSkillBar #autoSkillsBtn b{
 writing-mode:vertical-rl;
 transform:rotate(180deg);
 font-size:11px!important;
 letter-spacing:1px!important;
}
#sixSkillBar #autoSkillsBtn.on{
 border-color:#57dc7c!important;
 background:#153a22!important;
 box-shadow:inset 0 0 0 2px #08160c,0 0 9px #49df7066!important;
}


/* V44 — fundo embutido (PNG base64, 2,4 MB) removido na V464: nenhum elemento
   tinha a classe .gameWrap e regras seguintes pintam #gameWrap de cor solida. */
#game {
  background: transparent !important;
}


#gameWrap{background:#090c11!important}
#game{background:#090c11!important}


#gameWrap,.gameWrap{position:relative!important;background:#080b10!important;overflow:hidden!important}
#game{position:relative!important;z-index:1!important;background:transparent!important}
.gameModalOverlay,.hud,.topbar,.bottomNav,.partySlots,.skillbar,#sixSkillBar{
  position:relative;
  z-index:5;
}


/* V48 visual treatment — darker PS2-era dungeon */
.gameWrap,#gameWrap{background:#05070b!important}
#game{filter:contrast(1.03) saturate(.95) brightness(1.05)}
.topbar,.bottomNav,.gameModalCard,.hudPanel{
  background:linear-gradient(#0b1118,#070a0f)!important;
}
.gameWrap:after,#gameWrap:after{
  content:"";pointer-events:none;position:absolute;inset:0;z-index:30;
  box-shadow:inset 0 0 52px rgba(0,0,0,.26), inset 0 0 10px rgba(0,0,0,.18);
  mix-blend-mode:multiply;
}


/* V51 — skill bar reintegrated as a permanent gameplay HUD */
#sixSkillBar{
  display:flex!important;
  visibility:visible!important;
  opacity:1!important;
  position:fixed!important;
  left:50%!important;
  bottom:66px!important;
  transform:translateX(-50%)!important;
  z-index:10050!important;
  align-items:flex-end!important;
  justify-content:center!important;
  gap:5px!important;
  pointer-events:auto!important;
}
#sixSkillBar .heroSkill{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  flex:0 0 58px;
}
#sixSkillBar #autoSkillsBtn{
  display:grid!important;
  visibility:visible!important;
  opacity:1!important;
  flex:0 0 38px!important;
  pointer-events:auto!important;
}
.bottomNav{z-index:10020!important}


/* V53 — PLAYER HUD rebuilt from the reference */
html,body,button,.top,.bottom,.playerCard,.partySlot,.stagePanel,.lootLog,.skillbar{
  font-family:var(--font-ui)!important;
  font-weight:900!important;
  -webkit-font-smoothing:none;
  font-smooth:never;
  text-rendering:geometricPrecision;
}
.playerCard{
  position:absolute!important;
  top:14px!important;left:12px!important;
  width:292px!important;height:84px!important;
  padding:8px!important;
  display:flex!important;align-items:center!important;gap:10px!important;
  background:#091019f2!important;
  border:2px solid #385062!important;
  border-radius:0!important;
  box-shadow:
    inset 0 0 0 2px #02070b,
    inset 0 0 0 3px #172630,
    3px 3px 0 #020407!important;
  z-index:90!important;
}
.playerPortrait{
  position:relative;
  flex:0 0 58px;width:58px;height:58px;
  overflow:hidden;
  background:#07111b;
  border:2px solid #526a7d;
  box-shadow:inset 0 0 0 2px #02070c;
  image-rendering:pixelated;
}
.playerPortrait span{position:absolute;display:block;image-rendering:pixelated}
.playerPortrait .portraitFace{left:17px;top:19px;width:25px;height:23px;background:#f1d2ad;box-shadow:0 4px 0 #d4ad88}
.playerPortrait .portraitHair{left:11px;top:8px;width:37px;height:19px;background:#2466a5;box-shadow:5px -4px 0 #347fc7,-5px 5px 0 #174b7d,0 9px 0 #174b7d}
.playerPortrait .portraitBody{left:10px;top:42px;width:39px;height:18px;background:#213c72;box-shadow:6px 0 0 #2d5799}
.playerPortrait .portraitEye{top:28px;width:4px;height:4px;background:#17202a}
.playerPortrait .eyeL{left:22px}.playerPortrait .eyeR{left:34px}

/* active hero portrait variants */
.playerPortrait[data-hero="1"] .portraitHair{background:#69727a;box-shadow:5px -4px 0 #929aa0,-5px 5px 0 #4b535a,0 9px 0 #4b535a}
.playerPortrait[data-hero="1"] .portraitBody{background:#4d555b;box-shadow:6px 0 0 #727b82}
.playerPortrait[data-hero="2"] .portraitHair{background:#e8eee6;box-shadow:5px -4px 0 #ffffff,-5px 5px 0 #bcc9bb,0 9px 0 #bcc9bb}
.playerPortrait[data-hero="2"] .portraitBody{background:#7ea47f;box-shadow:6px 0 0 #a8c6a5}

.playerVitals{min-width:0;flex:1}
.playerHeader{
  display:flex;align-items:center;gap:8px;
  height:17px;margin-bottom:3px;
  color:#dce7ef;
  font-size:11px;
  line-height:1;
  letter-spacing:.02em;
  text-shadow:1px 1px 0 #000;
}
.playerHeader strong{
  color:#f1f4f6;
  font-size:11px;
  white-space:nowrap;
}
.statLine{
  height:15px;
  display:flex;
  align-items:center;
  gap:7px;
}
.pixelBar{
  flex:1;
  height:10px!important;
  margin:0!important;
  padding:1px;
  background:#030609!important;
  border:1px solid #70808d!important;
  box-shadow:inset 0 0 0 1px #111820;
}
.pixelBar i{
  display:block;
  height:100%!important;
  box-shadow:inset 0 2px 0 rgba(255,255,255,.16);
}
#hpBar{background:#dd3138!important}
#mpBar{background:#337be0!important}
#xpBar{background:#2d9a50!important}
.statValue{
  width:58px;
  color:#e7edf2;
  font-size:11px;
  line-height:1;
  text-align:left;
  white-space:nowrap;
  text-shadow:1px 1px 0 #000;
}
.statValue b{font-weight:900}


/* V56 — real raster dungeon art integration */
#game{
  image-rendering:pixelated!important;
  image-rendering:crisp-edges!important;
  filter:contrast(1.03) saturate(1.00) brightness(1.03)!important;
}


/* V104 — portraits in HEROES / PARTY FORMATION */
.heroAnimMount{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;transform:none!important}
.compactPreview{overflow:hidden!important}
.slotHeroMini{overflow:hidden!important;position:relative!important}
.simplePick .heroPreview{background:#000!important}
.simpleSlot .slotHeroMini{background:#000!important}


/* V107 — ALL CHARACTER PORTRAITS USE THE SAME BLACK BACKGROUND */
.partyStatusPortrait,
.charSheetPortrait,
.heroPreview,
.heroPreview.compactPreview,
.slotHeroMini,
.heroAnimMount,
.simplePick .heroPreview,
.simpleSlot .slotHeroMini{
  background:#000 !important;
}
.heroPortraitImg,
.heroPortraitRoster{
  background:#000 !important;
  mix-blend-mode:normal !important;
}

/* Hide the light/checkerboard-like pixels in portrait sources by placing a
   black backing layer behind every crop. */
.partyStatusPortrait,
.charSheetPortrait,
.heroPreview,
.slotHeroMini{
  overflow:hidden !important;
}


/* V109 — MAP footer button opens the Portal level map */
#portalOverlay{
  z-index:30000!important;
  pointer-events:auto!important;
}
#portalOverlay[aria-hidden="false"]{display:flex!important}
.portalWindow{pointer-events:auto!important}
#mapBtn.portalNavBtn{
  border-color:#9d7028;
  color:#ffd36a;
}


/* V110 — clean illustrated map + functional stage nodes */
.portalMapArt{
  object-fit:cover!important;
  filter:saturate(1.02) contrast(1.04)!important;
}
.portalStageNode{
  width:34px!important;height:34px!important;
  border:3px solid #5a3517!important;
  box-shadow:0 0 0 2px #f4bd58,0 3px 0 #2d1609,0 0 10px #000c!important;
  transition:transform .12s,filter .12s,box-shadow .12s;
}
.portalStageNode.selected{
  background:#35df78!important;
  border-color:#083b20!important;
  box-shadow:0 0 0 3px #9affbd,0 0 18px #36ee7f!important;
  animation:portalSelectedPulse .8s steps(2,end) infinite;
}
.portalStageNode.boss{
  width:46px!important;height:46px!important;
  background:#a51616!important;color:#fff!important;
  border-color:#370707!important;
}
.portalStageNode span{
  left:39px!important;top:6px!important;
  font-size:11px!important;
}
.portalStageNode.boss span{left:50px!important}
@keyframes portalSelectedPulse{
  0%,100%{filter:brightness(1)}
  50%{filter:brightness(1.28)}
}


/* V113 — PORTAL SURVIVAL COUNTDOWN */
#portalSurvivalTimer{
  position:absolute;right:14px;top:14px;z-index:79;
  min-width:188px;padding:9px 12px 8px;
  background:#080b0fe8;border:3px solid #9c7322;
  box-shadow:inset 0 0 0 2px #171008,0 5px 18px #000b;
  text-align:center;image-rendering:pixelated;pointer-events:none;
  display:flex;align-items:stretch;gap:7px
}
#portalSurvivalTimer .portalSurvivalInfo{min-width:188px;align-self:center}
#portalSurvivalTimer #stageRerunToggle{pointer-events:auto}
#portalSurvivalTimer .pstLabel{
  font-size:11px;color:#d7c27b;letter-spacing:.12em
}
#portalSurvivalTimer .pstStage{
  font-size:11px;color:#9eabb4;margin-top:2px;text-transform:uppercase
}
#portalSurvivalTimer .pstClock{
  font-size:24px;line-height:1.05;color:#fff1b0;margin-top:4px;
  text-shadow:2px 2px 0 #000
}
#portalSurvivalTimer.warning{border-color:#b84b34}
#portalSurvivalTimer.warning .pstClock{color:#ff8d65}
#portalSurvivalTimer.ready{border-color:#45cf75}
#portalSurvivalTimer.ready{
 pointer-events:auto!important;cursor:pointer;
 animation:bossReadyPulse .85s steps(2,end) infinite;
 box-shadow:inset 0 0 0 2px #0a2714,0 0 18px #45cf7588!important
}
#portalSurvivalTimer.ready:hover{filter:brightness(1.18)}
#portalSurvivalTimer.ready .pstClock{font-size:22px}
#portalSurvivalTimer.summoned{
 border-color:#b94b32!important;pointer-events:none!important;animation:none!important
}
#portalSurvivalTimer.summoned .pstClock{color:#ff9b72!important}
@keyframes bossReadyPulse{
  0%,100%{transform:scale(1)}
  50%{transform:scale(1.035)}
}

#portalSurvivalTimer.ready .pstClock{color:#74ef98}


/* V118 — TAVERN HUB presentation */
body.tavernHub #portalSurvivalTimer{display:none!important}

/* V131 — Tavern NPC RPG dialogue */
#npcDialogOverlay{
  position:absolute;inset:0;z-index:220;display:none;
  align-items:flex-end;justify-content:center;
  padding:0 24px 92px;
  pointer-events:none
}
#npcDialogOverlay.open{display:flex}
.npcDialogBox{
  width:min(920px,92vw);
  background:linear-gradient(#11151a,#080b0e);
  border:3px solid #a57932;
  box-shadow:inset 0 0 0 2px #21160b,0 14px 36px #000c;
  padding:16px;
  display:grid;grid-template-columns:110px 1fr;gap:16px;
  pointer-events:auto
}
.npcDialogPortrait{
  height:118px;background:#050608;border:2px solid #4a5865;
  display:flex;align-items:flex-end;justify-content:center;overflow:hidden
}
.npcDialogPortrait img{
  max-width:100%;max-height:100%;object-fit:contain;image-rendering:pixelated
}
.npcDialogMain{min-width:0}
.npcDialogName{
  color:#f1cb72;font-size:16px;letter-spacing:.08em;margin-bottom:7px
}
.npcDialogText{
  min-height:58px;color:#d8e1e8;font-size:11px;line-height:1.7;
  border-top:1px solid #34404b;border-bottom:1px solid #26313a;
  padding:10px 0;margin-bottom:12px
}
.npcDialogActions{display:flex;gap:10px;justify-content:flex-end}
.npcDialogBtn{
  min-width:122px;height:40px;border:2px solid #465563;background:#111923;
  color:#dfe8ef;cursor:pointer;font-size:11px
}
.npcDialogBtn:hover{filter:brightness(1.16)}
.npcDialogBtn.service{border-color:#aa7b2f;background:#3b2914;color:#ffd77d}
.npcDialogBtn.quest{border-color:#55769a;background:#142332;color:#bfe0ff}
.npcInteractHint{
  position:absolute;z-index:210;display:none;
  padding:7px 10px;background:#070a0ddd;border:2px solid #9f7834;
  color:#ffe08d;font-size:11px;pointer-events:none;
  transform:translate(-50%,-100%);
  box-shadow:0 5px 15px #000a
}
.npcServicePanel{
  grid-column:1/-1;display:none;border-top:1px solid #4a5661;
  margin-top:2px;padding-top:12px
}
.npcServicePanel.open{display:block}
.npcServiceTitle{color:#f0c76e;font-size:12px;margin-bottom:7px}
.npcServiceBody{color:#bfcbd4;font-size:11px;line-height:1.6}

/* V189 — hand-painted first-arrival narration and persistent guidance. */
#tavernNarratorOverlay{
  position:absolute;inset:0;z-index:260;display:none;align-items:flex-end;
  justify-content:center;padding:0 28px 105px;background:linear-gradient(180deg,#02050842,#020305b8);
}
#tavernNarratorOverlay.open{display:flex}
.tavernNarratorCard{
  width:min(850px,92vw);padding:20px 22px 18px;
  background:linear-gradient(100deg,#090d11f2,#11130ff2 58%,#0a0d0ef2);
  border:1px solid #68562f;box-shadow:inset 0 0 0 2px #151a17,0 18px 45px #000d;
  position:relative
}
.tavernNarratorCard::before{
  content:"";position:absolute;left:18px;right:18px;top:5px;height:1px;
  background:linear-gradient(90deg,transparent,#b28b43aa,transparent)
}
.tavernNarratorName{color:#bba879;font-size:11px;letter-spacing:.24em;margin-bottom:10px}
#tavernNarratorText{color:#e5dfd1;font-size:12px;line-height:1.85;min-height:48px;text-shadow:0 2px 3px #000}
#tavernNarratorContinue{
  float:right;margin-top:13px;min-width:145px;height:38px;border:1px solid #8c6b32;
  background:#251a0e;color:#f4d384;font:inherit;font-size:11px;cursor:pointer
}
#tavernNarratorContinue:hover{filter:brightness(1.18)}
/* Fica acima do centro: dentro do campo de visao natural, sem cobrir os
   personagens nem o chao. O elemento e ancorado pelo proprio centro, por isso
   o translate usa -50% no eixo Y. */
#tavernTutorialObjective{
  position:absolute;z-index:205;left:50%;top:38%;transform:translate(-50%,calc(-50% - 18px));
  width:min(520px,88vw);padding:10px 18px;text-align:center;pointer-events:none;
  background:linear-gradient(90deg,transparent,#090d10ed 13%,#090d10ed 87%,transparent);
  border-top:1px solid #80672f;border-bottom:1px solid #3e361f;
  opacity:0;transition:opacity .35s,transform .35s
}
#tavernTutorialObjective.show{opacity:1;transform:translate(-50%,-50%)}
#tavernTutorialObjective small{display:block;color:#a99058;font-size:11px;letter-spacing:.22em;margin-bottom:4px}
#tavernTutorialObjective strong{display:block;color:#f2d078;font-size:11px;letter-spacing:.08em}
#tavernTutorialObjective span{display:block;color:#b7c2c7;font-size:11px;margin-top:5px;line-height:1.45}
/* Sem descricao, o span vazio ainda reservaria margem e desalinharia a caixa. */
#tavernTutorialObjective span:empty{display:none}
@media(max-width:700px){
 #tavernNarratorOverlay{padding:0 12px 82px}
 .tavernNarratorCard{padding:16px}
 #tavernNarratorText{font-size:11px}
 #tavernTutorialObjective{top:34%}
}

/* V191 — restrained AAA HUD hierarchy.
   Attention map: identity/resources top-left, party left, objectives right,
   immediate actions bottom-center. The battlefield centre stays untouched. */
:root{
 --hud-ink:#070b10f2;
 --hud-ink-soft:#0b1118e8;
 --hud-edge:#334656;
 --hud-gold:#d4a64f;
 --hud-cold:#8fa9ba;
}
#app{
 grid-template-rows:66px minmax(0,1fr) 64px!important;
 background:#030507!important;
}
.top{
 position:relative;padding:7px 18px!important;gap:14px!important;
 background:linear-gradient(180deg,#101820 0%,#080d12 74%,#05080b 100%)!important;
 border-bottom:1px solid #3b4c58!important;
 box-shadow:0 6px 24px #000b,inset 0 -1px 0 #080b0e!important;
}
.top::after{
 content:"";position:absolute;left:18px;right:18px;bottom:3px;height:1px;
 background:linear-gradient(90deg,#b58a3f00,#b58a3f88 18%,#40505a66 72%,#40505a00);
 pointer-events:none
}
.topBrandBlock{
 width:220px;height:48px;display:flex;flex-direction:column;justify-content:center;
 padding:0 18px 0 14px;position:relative;
 background:linear-gradient(90deg,#1a130c99,#0b101400);
 border-left:2px solid #9b7135
}
.topBrandBlock::before{
 content:"";position:absolute;left:5px;top:8px;bottom:8px;width:1px;background:#dfb96166
}
.topBrandBlock .brand{
 min-width:0;color:#efd18b;font-family:var(--font-display)!important;
 font-size:23px!important;line-height:.9;letter-spacing:.07em;text-shadow:0 2px 0 #000,0 0 15px #b9782633
}
.topBrandBlock small{margin-top:6px;color:#738693;font-size:11px;letter-spacing:.27em}
.resourceDock{display:flex;align-items:center;gap:7px}
.resourceDock .currency{
 min-width:112px;height:42px;border-radius:2px!important;border:1px solid #263744!important;
 background:linear-gradient(180deg,#0d151c,#080d12)!important;
 box-shadow:inset 0 0 0 1px #030609!important;
 color:#82929d;font-size:11px;letter-spacing:.05em
}
.resourceDock .currency b{color:#f2d073;font-size:12px}
.topActions{display:flex;align-items:center;gap:7px}
.topActions .navbtn{
 min-width:84px;height:42px;padding:0 11px;border-radius:2px!important;
 border:1px solid #2e414f!important;background:linear-gradient(#111b23,#090f14)!important;
 color:#b9c5cd;font-size:11px;letter-spacing:.08em;
 box-shadow:inset 0 0 0 1px #05090c!important
}
.topActions .navbtn:hover{border-color:#a9823e!important;color:#f2d68f;filter:none!important}
#gameWrap{
 isolation:isolate;
 box-shadow:inset 0 0 0 1px #131c22,inset 0 20px 34px #0003!important
}
#gameWrap::before{
 content:"";position:absolute;inset:0;z-index:31;pointer-events:none;
 background:
  linear-gradient(90deg,#02050780 0,transparent 11%,transparent 88%,#02050775 100%),
  linear-gradient(180deg,#02050738 0,transparent 15%,transparent 83%,#0205075c 100%);
}
.partyStatusSidebar{
 left:18px!important;top:18px!important;width:244px!important;gap:5px!important;
 padding-top:25px;
}
.partyStatusSidebar::before{
 content:"PARTY";position:absolute;left:0;right:0;top:0;height:23px;padding:6px 10px;
 color:#d6bd7b;font-size:11px;letter-spacing:.15em;
 background:linear-gradient(90deg,#0a1118f2,#0a1118a8 78%,transparent);
 border-left:2px solid #b08742;border-top:1px solid #31434f
}
.partyStatusCard{
 height:70px!important;padding:5px 7px!important;grid-template-columns:46px 1fr!important;gap:7px!important;
 background:linear-gradient(100deg,#070c11f5,#0c141be8)!important;
 border:1px solid #324653!important;border-left:2px solid #526877!important;
 box-shadow:inset 0 0 0 1px #020507,2px 5px 15px #0009!important;
 transition:transform .12s,border-color .12s,background .12s
}
.partyStatusCard:hover{transform:translateX(3px);border-left-color:#c59a4a!important}
.partyStatusCard.active{
 border-color:#8e713d!important;border-left:3px solid #edc260!important;
 background:linear-gradient(100deg,#151108f5,#0d151be8)!important;
 box-shadow:inset 0 0 0 1px #1c160b,0 0 14px #c08a2830!important
}
.partyStatusPortrait{width:42px!important;height:54px!important;border:1px solid #526a79!important;box-shadow:inset 0 0 0 2px #020609!important}
.partyStatusHead{height:14px!important;font-size:11px!important;gap:5px!important}
.partyStatusHead b,.partyStatusHead strong{font-size:11px!important}
.partyFaithStack{font-size:11px!important;line-height:8px!important}
.partyStatusCard:has(.partyFaithStack) .partyStatusBars{gap:2px!important;margin-top:1px!important}
.partyStatusBars{gap:3px!important;margin-top:2px!important}
.partyStatusLine{grid-template-columns:1fr 49px!important;gap:5px!important}
.partyStatusBar{height:7px!important;border:1px solid #637480!important}
.partyStatusVal{font-size:11px!important}
.partyStatusCard .slotTag{font-size:11px!important;color:#d9bc74!important}
.stagePanel,.lootLog{
 right:18px!important;width:228px!important;border-radius:0!important;
 background:linear-gradient(100deg,#0a1016f2,#070b0fe9)!important;
 box-shadow:inset 0 0 0 1px #030609,0 8px 24px #000a!important
}
.stagePanel{
 top:116px!important;padding:10px 12px!important;border:1px solid #735c30!important;border-right:2px solid #c09445!important
}
.stageTitle{text-align:left!important;color:#e7c671!important;font-size:11px!important;letter-spacing:.09em}
.waveTxt{text-align:left!important;font-size:11px!important;color:#aab7bf}
.progress{height:5px!important;border:0!important;background:#020406!important}
.lootLog{
 top:220px!important;padding:10px 12px!important;border:1px solid #2e414e!important;
 border-right:2px solid #617687!important;font-size:11px!important;line-height:1.65!important;
 max-height:112px;overflow:hidden
}
.lootLog>div:first-child{font-size:11px;letter-spacing:.14em;margin-bottom:5px;color:#8396a2}
#portalSurvivalTimer{
 right:18px!important;top:18px!important;min-width:347px!important;width:auto!important;padding:7px!important;
 border:1px solid #725c30!important;border-right:2px solid #d0a44d!important;
 background:linear-gradient(100deg,#0a1016f2,#070b0ff2)!important;
 box-shadow:inset 0 0 0 1px #030609,0 8px 24px #000a!important
}
#portalSurvivalTimer .portalSurvivalInfo{min-width:218px;padding:1px 5px}
#portalSurvivalTimer .pstClock{font-size:20px!important}
body.tavernHub .stagePanel,body.tavernHub .lootLog{display:none!important}
#sixSkillBar{
 bottom:74px!important;gap:5px!important;padding:8px 11px 9px!important;
 background:linear-gradient(180deg,#101820f2,#070b10f5)!important;
 border:1px solid #344856!important;border-bottom:2px solid #9a7438!important;
 box-shadow:inset 0 0 0 1px #020507,0 8px 28px #000c!important
}
#sixSkillBar::before{
 content:"";position:absolute;left:20%;right:20%;top:-2px;height:1px;
 background:linear-gradient(90deg,transparent,#e2b85b99,transparent)
}
#sixSkillBar .heroSkill{
 flex-basis:50px!important;width:50px!important;height:50px!important;border-radius:2px!important;
 border:1px solid #4a6070!important;background:linear-gradient(145deg,#111c25,#070b10)!important;
 font-size:21px!important;box-shadow:inset 0 0 0 2px #03070a!important
}
#sixSkillBar .skillIcon{
 position:absolute;inset:2px;width:calc(100% - 4px);height:calc(100% - 4px);object-fit:cover;
 pointer-events:none;z-index:0;filter:saturate(1.06) contrast(1.04)
}
#sixSkillBar .heroSkill>span,#sixSkillBar .skillName{z-index:3;text-shadow:1px 1px 2px #000,0 0 3px #000}
#sixSkillBar .heroSkill .cd{z-index:4}
#sixSkillBar .heroSkill:hover{border-color:#d1a64e!important;transform:translateY(-2px)}
#sixSkillBar #autoSkillsBtn{
 height:50px!important;border-radius:2px!important;border:1px solid #506574!important;
 background:linear-gradient(#111b23,#080d12)!important
}
#sixSkillBar #autoSkillsBtn .systemSkillIcon{position:absolute;inset:4px;width:calc(100% - 8px);height:calc(100% - 8px);object-fit:cover;opacity:.78;pointer-events:none}
#sixSkillBar #autoSkillsBtn b{position:absolute;bottom:2px;left:2px;right:2px;z-index:2;writing-mode:horizontal-tb!important;transform:none!important;text-shadow:1px 1px 2px #000,0 0 3px #000}
.skillName{font-size:11px!important;color:#9daeb8!important}
.bottom{
 position:relative!important;padding:7px 18px!important;justify-content:center!important;gap:22px!important;
 background:linear-gradient(180deg,#070b0f 0%,#0c1319 100%)!important;
 border-top:1px solid #344651!important;box-shadow:0 -8px 25px #000a!important
}
.bottom::before{
 content:"";position:absolute;top:3px;left:24%;right:24%;height:1px;
 background:linear-gradient(90deg,transparent,#b88b4088,transparent)
}
.bottomNavCore,.bottomNavInventory{display:flex;align-items:center;gap:6px}
.bottomNavCore{padding-right:20px;border-right:1px solid #293944}
.bottom .navbtn{
 min-width:84px;height:44px;padding:0 10px;border-radius:2px!important;
 border:1px solid #2e424f!important;background:linear-gradient(#111b23,#080d12)!important;
 color:#aebdc6;font-size:11px!important;letter-spacing:.06em;
 box-shadow:inset 0 0 0 1px #03070a!important
}
.bottom .navbtn:hover,.bottom .navbtn.active{
 border-color:#b88c41!important;background:linear-gradient(#20180e,#0e1114)!important;
 color:#f1d181!important;filter:none!important
}
.bottom #mapBtn{border-color:#8c6b32!important;color:#edca76!important}
/* V245 reversible BAG navigation experiment. Remove this body class to restore it. */
body.hideBagExperimentV245 #stashBtn{display:none!important}
.hint{
 left:18px!important;bottom:14px!important;max-width:350px;padding:7px 9px!important;
 background:#070c11d9!important;border:1px solid #293b47!important;color:#7f929e!important;
 font-size:11px!important;line-height:1.5
}
@media(max-width:1100px){
 .topBrandBlock{width:170px}.topBrandBlock .brand{font-size:19px!important}
 .resourceDock .currency{min-width:92px}.topActions .navbtn{min-width:70px;padding:0 7px}
 .partyStatusSidebar{width:214px!important}.stagePanel,.lootLog{width:205px!important;min-width:205px!important}
 #portalSurvivalTimer{min-width:324px!important}
 .bottom .navbtn{min-width:72px;padding:0 7px}
}
@media(max-width:760px){
 #app{grid-template-rows:58px minmax(0,1fr) 58px!important}
 .top{padding:5px 8px!important}.topBrandBlock{width:128px;height:42px;padding-left:9px}.topBrandBlock .brand{font-size:16px!important}.topBrandBlock small{display:none}
 .resourceDock{gap:3px}.resourceDock .currency{min-width:70px;height:38px;font-size:0}.resourceDock .currency b{font-size:11px}.topActions{display:none}
 .partyStatusSidebar{left:7px!important;top:7px!important;width:176px!important;transform:scale(.88);transform-origin:top left}
 .stagePanel{right:7px!important;width:174px!important;min-width:174px!important}.lootLog{display:none!important}
 #portalSurvivalTimer{right:7px!important;min-width:286px!important;max-width:calc(100vw - 14px);padding:5px!important;gap:4px}
 #portalSurvivalTimer .portalSurvivalInfo{min-width:165px;padding:1px 3px}
 #portalSurvivalTimer #stageRerunToggle{min-width:108px}
 #sixSkillBar{bottom:63px!important;max-width:94vw;overflow-x:auto;justify-content:flex-start!important}
 .bottom{padding:6px 8px!important;overflow-x:auto!important;justify-content:flex-start!important;gap:8px!important}
 .bottomNavCore,.bottomNavInventory{flex:0 0 auto}.bottom .navbtn{min-width:70px;height:40px}
}

/* V146 Innkeeper Food Service */
#innkeeperFoodPanelV146{
  position:absolute; inset:0; display:none; align-items:center; justify-content:center;
  background:rgba(7,4,10,.82); z-index:9998; font-family:inherit;
}
#innkeeperFoodPanelV146.active{display:flex}
#innkeeperFoodPanelV146 .food-shell{
  width:min(920px,92vw); max-height:86vh; overflow:auto;
  background:linear-gradient(180deg,#241413,#120b10);
  border:3px solid #b77832; box-shadow:0 0 0 3px #4b2518,0 18px 45px #000;
  padding:18px;
}
#innkeeperFoodPanelV146 .food-title{
  text-align:center; color:#ffd796; font-size:24px; letter-spacing:2px; margin-bottom:4px;
}
#innkeeperFoodPanelV146 .food-sub{
  text-align:center; color:#c7b29e; font-size:12px; margin-bottom:16px;
}
#innkeeperFoodPanelV146 .food-heroes,
#innkeeperFoodPanelV146 .food-items{
  display:grid; gap:10px;
}
#innkeeperFoodPanelV146 .food-heroes{grid-template-columns:repeat(4,1fr);margin-bottom:14px}
#innkeeperFoodPanelV146 .food-items{grid-template-columns:repeat(3,1fr)}
#innkeeperFoodPanelV146 button{
  cursor:pointer; font-family:inherit;
}
#innkeeperFoodPanelV146 .hero-pick,
#innkeeperFoodPanelV146 .meal-card{
  background:#171015; color:#eee; border:2px solid #5c4032; padding:12px;
}
#innkeeperFoodPanelV146 .hero-pick.selected{
  border-color:#efb65d; box-shadow:0 0 12px rgba(239,182,93,.3);
}
#innkeeperFoodPanelV146 .hero-pick .nm{display:block;color:#fff1d2;font-weight:700}
#innkeeperFoodPanelV146 .hero-pick .st{display:block;color:#9f8e86;font-size:11px;margin-top:3px}
#innkeeperFoodPanelV146 .meal-card h3{margin:0 0 7px;color:#ffd58c;font-size:16px}
#innkeeperFoodPanelV146 .meal-card p{margin:4px 0;color:#c8b8ad;font-size:12px;line-height:1.45}
#innkeeperFoodPanelV146 .meal-card .effect{color:#f3e6cf}
#innkeeperFoodPanelV146 .meal-card .buy{
  width:100%; margin-top:9px; padding:9px; background:#5e2f1f; color:#ffe3ac;
  border:2px solid #a96734; font-weight:700;
}
#innkeeperFoodPanelV146 .meal-card .buy:hover{filter:brightness(1.15)}
#innkeeperFoodPanelV146 .food-footer{
  display:flex; justify-content:space-between; align-items:center; margin-top:14px;
  gap:12px; color:#c9b294; font-size:11px;
}
#innkeeperFoodPanelV146 .close-food{
  padding:9px 16px;background:#2b1a1b;color:#eee;border:2px solid #6b4a3c;
}
#innkeeperFoodPanelV146 .food-toast{
  min-height:18px; color:#ffd985; text-align:center; margin-top:8px; font-size:12px;
}


/* V147 Innkeeper Drinks Service */
#innkeeperDrinkPanelV147{
  position:absolute; inset:0; display:none; align-items:center; justify-content:center;
  background:rgba(7,4,10,.84); z-index:9999; font-family:inherit;
}
#innkeeperDrinkPanelV147.active{display:flex}
#innkeeperDrinkPanelV147 .drink-shell{
  width:min(820px,92vw); max-height:86vh; overflow:auto;
  background:linear-gradient(180deg,#1e1514,#0f0a0d);
  border:3px solid #9e6732; box-shadow:0 0 0 3px #40261b,0 18px 45px #000;
  padding:18px;
}
#innkeeperDrinkPanelV147 .drink-title{
  text-align:center; color:#ffd69b; font-size:24px; letter-spacing:2px; margin-bottom:4px;
}
#innkeeperDrinkPanelV147 .drink-sub{
  text-align:center; color:#c7b4a2; font-size:12px; margin-bottom:16px;
}
#innkeeperDrinkPanelV147 .drink-heroes{
  display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:14px;
}
#innkeeperDrinkPanelV147 .hero-pick-drink,
#innkeeperDrinkPanelV147 .drink-card{
  background:#171015; color:#eee; border:2px solid #5b4030; padding:12px;
}
#innkeeperDrinkPanelV147 .hero-pick-drink.selected{
  border-color:#e3a955; box-shadow:0 0 12px rgba(227,169,85,.28);
}
#innkeeperDrinkPanelV147 .hero-pick-drink .nm{display:block;color:#fff0d0;font-weight:700}
#innkeeperDrinkPanelV147 .hero-pick-drink .st{display:block;color:#9f8d82;font-size:11px;margin-top:3px}
#innkeeperDrinkPanelV147 .drink-items{
  display:grid; grid-template-columns:repeat(2,1fr); gap:12px;
}
#innkeeperDrinkPanelV147 .drink-card h3{margin:0 0 7px;color:#ffd58c;font-size:17px}
#innkeeperDrinkPanelV147 .drink-card p{margin:4px 0;color:#c9b8ab;font-size:12px;line-height:1.45}
#innkeeperDrinkPanelV147 .drink-card .effect{color:#f1e5d0}
#innkeeperDrinkPanelV147 button{cursor:pointer;font-family:inherit}
#innkeeperDrinkPanelV147 .drink-btn{
  width:100%; margin-top:9px; padding:9px; background:#5a3021; color:#ffe3ac;
  border:2px solid #a66c39; font-weight:700;
}
#innkeeperDrinkPanelV147 .drink-footer{
  display:flex; justify-content:space-between; align-items:center; gap:12px;
  margin-top:14px; color:#c9b294; font-size:11px;
}
#innkeeperDrinkPanelV147 .close-drink{
  padding:9px 16px;background:#2b1a1b;color:#eee;border:2px solid #6b4a3c;
}
#innkeeperDrinkPanelV147 .drink-toast{
  min-height:18px; color:#ffd985; text-align:center; margin-top:8px; font-size:12px;
}


/* V149 Premium daily-use labels */
.premium-daily-v149{
  margin-top:8px;
  padding:6px 8px;
  border:1px solid #8d6337;
  background:rgba(126,76,28,.18);
  color:#f3c77f;
  font-size:11px;
  text-align:center;
  letter-spacing:.5px;
}


/* V150 — Account Training / Trainer */
.trainer-service-v150{
  display:grid;grid-template-columns:1fr auto;gap:10px 16px;align-items:center;
  margin-top:8px;padding:10px;border:2px solid #5f4930;background:#0e1012;
}
.trainer-service-v150 .tlvl{font-size:15px;color:#ffd17b}
.trainer-service-v150 .tmeta{font-size:11px;color:#aeb9c0;line-height:1.55}
.trainer-service-v150 .trainer-open-v150{
  grid-row:1/3;grid-column:2;padding:10px 15px;border:2px solid #ad7534;
  background:#442916;color:#ffe0a2;font-family:inherit;font-size:11px;cursor:pointer;
}
#trainerOverlayV150{
  position:fixed;inset:0;z-index:16000;display:none;
  background:#050608f2;align-items:center;justify-content:center;padding:14px;
  font-family:inherit;
}
#trainerOverlayV150.active{display:flex}
#trainerOverlayV150 .trainer-window{
  width:min(1040px,96vw);max-height:94vh;overflow:auto;
  border:4px solid #4f5960;background:#0b0d10;
  box-shadow:inset 0 0 0 3px #16191d,inset 0 0 0 6px #765126,0 30px 90px #000;
}
#trainerOverlayV150 .trainer-head{
  display:flex;justify-content:space-between;align-items:center;gap:12px;
  padding:14px 18px;border-bottom:2px solid #5a432a;background:#17120d;
}
#trainerOverlayV150 .trainer-title{font-size:24px;color:#ffd080;letter-spacing:2px}
#trainerOverlayV150 .trainer-sub{font-size:11px;color:#aaa;line-height:1.5;margin-top:4px}
#trainerOverlayV150 .trainer-close{
  width:38px;height:38px;border:2px solid #815b37;background:#281914;color:#eee;
  font-family:inherit;cursor:pointer;
}
#trainerOverlayV150 .trainer-body{padding:14px}
#trainerOverlayV150 .trainer-status-grid{
  display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:10px;margin-bottom:12px;
}
#trainerOverlayV150 .trainer-stat{
  border:2px solid #343b42;background:#101419;padding:11px;min-height:72px;
}
#trainerOverlayV150 .trainer-stat b{display:block;color:#f4c56f;font-size:11px;margin-bottom:6px}
#trainerOverlayV150 .trainer-level-big{font-size:29px;color:#fff3d5}
#trainerOverlayV150 .trainer-small{font-size:11px;color:#a9b5bc;line-height:1.5}
#trainerOverlayV150 .training-xp-bar{
  height:15px;background:#07090b;border:2px solid #3d464d;margin-top:8px;overflow:hidden;
}
#trainerOverlayV150 .training-xp-bar i{
  display:block;height:100%;width:0;background:linear-gradient(90deg,#8c5a21,#e3ad4c);
}
#trainerOverlayV150 .premium-active{color:#ffe075}
#trainerOverlayV150 .premium-off{color:#8f9aa0}

#trainerOverlayV150 .training-controls{
  display:grid;grid-template-columns:1fr auto;gap:10px;margin-bottom:12px;
  border:2px solid #3b4248;background:#0e1216;padding:12px;
}
#trainerOverlayV150 .target-line{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
#trainerOverlayV150 .target-line button{
  width:34px;height:32px;border:2px solid #56636d;background:#151d23;color:#fff;
  font-family:inherit;cursor:pointer;
}
#trainerOverlayV150 .target-value{
  min-width:84px;text-align:center;color:#ffd078;font-size:19px;
}
#trainerOverlayV150 .training-cost-v255{
  padding:7px 10px;border:1px solid #7b5c27;background:#181309;color:#ffd36d;
  font-size:11px;letter-spacing:.04em;white-space:nowrap;
}
#trainerOverlayV150 .training-cost-v255.insufficient{border-color:#8c3d36;color:#ff8d82;background:#23100f}
#trainerOverlayV150 .target-line button:disabled{opacity:.38;cursor:not-allowed}
#trainerOverlayV150 .start-training{
  min-width:224px;border:3px solid #b4772e;background:#512d12;color:#ffe2a7;
  font-family:inherit;font-size:12px;cursor:pointer;padding:10px 14px;
}
#trainerOverlayV150 .start-training.insufficient{border-color:#7c3b35;background:#351513;color:#ffafa5}
#trainerOverlayV150 .start-training.stop{
  border-color:#9c4037;background:#481613;color:#ffd0c8;
}
#trainerOverlayV150 .start-training:disabled{opacity:.45;cursor:not-allowed}

#trainerOverlayV150 .training-yard{
  position:relative;height:330px;overflow:hidden;
  border:3px solid #55462f;
  background:
    linear-gradient(#15191b 0 18%,#23231d 18% 61%,#3a2d1e 61% 100%);
  box-shadow:inset 0 0 34px #000;
}
#trainerOverlayV150 .yard-sign{
  position:absolute;left:16px;top:14px;padding:7px 10px;border:2px solid #78572d;
  background:#22170e;color:#e9bb70;font-size:11px;z-index:4;
}
#trainerOverlayV150 .yard-floor-line{
  position:absolute;left:0;right:0;top:61%;height:3px;background:#654a2c;opacity:.7;
}
#trainerOverlayV150 .trainees-v150{
  position:absolute;left:4%;right:40%;bottom:30px;height:235px;
  display:flex;align-items:flex-end;justify-content:space-around;gap:8px;
}
#trainerOverlayV150 .trainee-v150{
  position:relative;width:120px;height:190px;display:flex;flex-direction:column;
  align-items:center;justify-content:flex-end;transform-origin:bottom center;
}
#trainerOverlayV150 .trainee-v150.training{animation:traineeAttackV150 .72s steps(4,end) infinite}
#trainerOverlayV150 .trainee-v150:nth-child(2).training{animation-delay:-.22s}
#trainerOverlayV150 .trainee-v150:nth-child(3).training{animation-delay:-.42s}
#trainerOverlayV150 .trainee-v150 img{
  width:82px;height:112px;object-fit:cover;object-position:top center;
  image-rendering:pixelated;border:2px solid #6c593d;background:#161319;
  box-shadow:0 4px 0 #070708;
}
#trainerOverlayV150 .trainee-v150 .hero-fallback{
  width:74px;height:104px;display:grid;place-items:center;font-size:42px;
  border:2px solid #6c593d;background:#161319;
}
#trainerOverlayV150 .trainee-v150 span{
  margin-top:6px;padding:4px 6px;background:#080a0ccc;border:1px solid #4c5358;
  color:#e9eef1;font-size:11px;text-align:center;
}
@keyframes traineeAttackV150{
  0%,45%,100%{transform:translateX(0) rotate(0)}
  55%,72%{transform:translateX(16px) rotate(2deg)}
}

#trainerOverlayV150 .dummies-v150{
  position:absolute;right:5%;bottom:28px;width:38%;height:238px;
  display:flex;justify-content:space-around;align-items:flex-end;
}
#trainerOverlayV150 .dummy-v150{
  position:relative;width:72px;height:190px;transform-origin:50% 84%;
}
#trainerOverlayV150 .dummy-v150.hit{animation:dummyHitV150 .72s steps(3,end) infinite}
#trainerOverlayV150 .dummy-v150:nth-child(2).hit{animation-delay:-.22s}
#trainerOverlayV150 .dummy-v150:nth-child(3).hit{animation-delay:-.42s}
#trainerOverlayV150 .dummy-head{
  position:absolute;left:20px;top:9px;width:32px;height:32px;border-radius:50%;
  background:#ba904f;border:4px solid #6b4b27;box-shadow:inset 0 0 0 3px #d7b66f;
}
#trainerOverlayV150 .dummy-post{
  position:absolute;left:31px;top:40px;width:10px;height:138px;background:#73502b;
  border-left:3px solid #3c2919;border-right:3px solid #3c2919;
}
#trainerOverlayV150 .dummy-arms{
  position:absolute;left:3px;top:68px;width:66px;height:10px;background:#76512b;
  border-top:3px solid #3c2919;border-bottom:3px solid #3c2919;
}
#trainerOverlayV150 .dummy-body{
  position:absolute;left:16px;top:58px;width:40px;height:65px;background:#b18443;
  border:4px solid #684721;clip-path:polygon(15% 0,85% 0,100% 100%,0 100%);
}
#trainerOverlayV150 .dummy-base{
  position:absolute;left:4px;bottom:3px;width:64px;height:13px;background:#49331f;
  border:3px solid #241910;
}
#trainerOverlayV150 .impact-v150{
  position:absolute;left:-7px;top:78px;color:#ffe38c;font-size:20px;opacity:0;
}
#trainerOverlayV150.training .impact-v150{animation:impactFlashV150 .72s steps(2,end) infinite}
#trainerOverlayV150 .dummy-v150:nth-child(2) .impact-v150{animation-delay:-.22s}
#trainerOverlayV150 .dummy-v150:nth-child(3) .impact-v150{animation-delay:-.42s}
@keyframes dummyHitV150{0%,48%,100%{transform:rotate(0)}58%{transform:rotate(5deg)}70%{transform:rotate(-3deg)}}
@keyframes impactFlashV150{0%,48%,76%,100%{opacity:0;transform:scale(.7)}55%,68%{opacity:1;transform:scale(1.25)}}

#trainerOverlayV150 .training-log{
  margin-top:10px;border:2px solid #303840;background:#080b0e;padding:9px 11px;
  color:#aab6bd;font-size:11px;min-height:34px;line-height:1.5;
}
#trainerOverlayV150 .training-rules{
  display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px;
}
#trainerOverlayV150 .training-rule{
  border:1px solid #423b30;background:#11110f;padding:8px;color:#aaa;font-size:11px;line-height:1.5;
}
#trainerOverlayV150 .training-rule b{color:#e9bb69;display:block;margin-bottom:4px}

@media(max-width:760px){
  #trainerOverlayV150 .trainer-status-grid{grid-template-columns:1fr}
  #trainerOverlayV150 .training-controls{grid-template-columns:1fr}
  #trainerOverlayV150 .training-yard{height:300px}
  #trainerOverlayV150 .trainees-v150{right:44%}
  #trainerOverlayV150 .training-rules{grid-template-columns:1fr}
}


/* V151 — Training Yard uses actual stage-style hero cutouts + supplied straw dummy */
#trainerOverlayV150 .training-stage-strip-v151{
  position:absolute;inset:0;pointer-events:none;overflow:hidden;
}
#trainerOverlayV150 .trainees-v151{
  position:absolute;left:5%;bottom:64px;width:46%;height:220px;
  display:flex;align-items:flex-end;justify-content:center;gap:0;
  z-index:3;pointer-events:none;
}
#trainerOverlayV150 .trainee-stage-v151{
  position:relative;width:142px;height:220px;display:flex;align-items:flex-end;
  justify-content:center;transform-origin:bottom center;pointer-events:none;
}
#trainerOverlayV150 .trainee-stage-v151 img{
  max-width:153px;max-height:203px;width:auto;height:auto;
  object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 7px 2px #000a);
  transform-origin:bottom center;
}
#trainerOverlayV150 .trainee-stage-v151[data-training-hero="4"] img,
#trainerOverlayV150 .trainee-stage-v151[data-training-hero="5"] img{
  max-width:142px;max-height:176px;
}

@media (max-height:760px){
  #characterSheetOverlay{padding-top:8px;padding-bottom:76px;align-items:flex-start}
  .charSheet{max-height:calc(100vh - 88px);padding:8px;column-gap:8px}
  .charSheetTop{padding:5px;margin-bottom:6px}
  .charAttrList,.charSkillList{gap:4px}
  .charAttr,.charSkillRow{padding:5px 7px}
  .charAttrDesc,.charSkillDesc{margin-top:1px}
  .charSheetSecretRow,.charSheetFooter{margin-top:6px}
}
#trainerOverlayV150.training .training-stage-strip-v151 .trainee-stage-v151{
  animation:trainingStageAttackV151 .78s steps(4,end) infinite;
}
#trainerOverlayV150.training .trainee-stage-v151:nth-child(2){animation-delay:-.24s}
#trainerOverlayV150.training .trainee-stage-v151:nth-child(3){animation-delay:-.46s}
#trainerOverlayV150 .trainee-stage-v151 span{
  position:absolute;left:50%;bottom:-2px;transform:translateX(-50%);
  white-space:nowrap;padding:3px 6px;background:#07090bd9;border:1px solid #4c5358;
  color:#eef3f5;font-size:11px;
}
@keyframes trainingStageAttackV151{
  0%,42%,100%{transform:translateX(0)}
  55%,72%{transform:translateX(20px)}
}
#trainerOverlayV150 .dummies-v151{
  position:absolute;right:3%;bottom:16px;width:40%;height:250px;
  display:flex;align-items:flex-end;justify-content:space-around;gap:4px;z-index:2;
  pointer-events:none;
}
#trainerOverlayV150 .dummy-wrap-v151{
  position:relative;width:112px;height:220px;display:flex;align-items:flex-end;
  justify-content:center;transform-origin:50% 88%;
}
#trainerOverlayV150 .dummy-wrap-v151 img{
  width:auto;height:205px;max-width:112px;object-fit:contain;
  image-rendering:pixelated;filter:drop-shadow(0 7px 2px #000a);
}
#trainerOverlayV150.training .training-stage-strip-v151 .dummy-wrap-v151{
  animation:trainingDummyHitV151 .78s steps(3,end) infinite;
}
#trainerOverlayV150.training .dummy-wrap-v151:nth-child(2){animation-delay:-.24s}
#trainerOverlayV150.training .dummy-wrap-v151:nth-child(3){animation-delay:-.46s}
#trainerOverlayV150 .dummy-wrap-v151 i{
  position:absolute;left:-3px;top:82px;color:#ffe592;font-style:normal;
  font-size:21px;opacity:0;text-shadow:0 0 8px #ffc757;
}
#trainerOverlayV150.training .dummy-wrap-v151 i{
  animation:trainingImpactV151 .78s steps(2,end) infinite;
}
#trainerOverlayV150.training .dummy-wrap-v151:nth-child(2) i{animation-delay:-.24s}
#trainerOverlayV150.training .dummy-wrap-v151:nth-child(3) i{animation-delay:-.46s}
@keyframes trainingDummyHitV151{
  0%,45%,100%{transform:rotate(0)}
  57%{transform:rotate(4deg)}
  72%{transform:rotate(-2deg)}
}
@keyframes trainingImpactV151{
  0%,46%,76%,100%{opacity:0;transform:scale(.7)}
  55%,67%{opacity:1;transform:scale(1.25)}
}
#trainerOverlayV150 .xp-sync-v151{
  margin-top:5px;color:#8db8c7;font-size:11px;line-height:1.45;
}


/* V152 — Dojo background + visible basic attacks */
#trainerOverlayV150 .training-yard{
  background-image:
    linear-gradient(rgba(5,6,8,.06),rgba(5,6,8,.10)),
    url("../assets/generated/trainer/training-yard.webp") !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
  border-color:#6f5330 !important;
}
#trainerOverlayV150 .yard-floor-line{display:none!important}
#trainerOverlayV150 .yard-sign{
  background:#170f08e8!important;
  border-color:#a56e27!important;
  color:#ffc865!important;
}

#trainerOverlayV150 .basic-fx-v152{
  position:absolute;pointer-events:none;z-index:6;opacity:0;
}
#trainerOverlayV150 .mage-fireball-v152{
  width:18px;height:18px;border-radius:50%;
  background:radial-gradient(circle,#fff3a1 0 22%,#ffad20 24% 50%,#e63b0d 52% 75%,transparent 77%);
  box-shadow:0 0 10px #ff5a13,0 0 18px #ffb11c;
  left:50%;top:58%;
}
#trainerOverlayV150.training .mage-fireball-v152.active{
  animation:mageFireV152 1.15s linear infinite;
}
@keyframes mageFireV152{
  0%,18%{opacity:0;transform:translate(0,0) scale(.7)}
  24%{opacity:1}
  70%{opacity:1;transform:translate(250px,-2px) scale(1)}
  74%{opacity:0;transform:translate(265px,-2px) scale(1.45)}
  100%{opacity:0}
}

#trainerOverlayV150 .warrior-slash-v152{
  width:58px;height:58px;border:5px solid #bfe7ff;
  border-left-color:transparent;border-bottom-color:transparent;border-radius:50%;
  filter:drop-shadow(0 0 6px #65baff);
  transform:rotate(34deg);
  left:50%;top:52%;
}
#trainerOverlayV150.training .warrior-slash-v152.active{
  animation:warriorSlashV152 .9s steps(4,end) infinite;
}
@keyframes warriorSlashV152{
  0%,35%,100%{opacity:0;transform:translate(0,0) rotate(34deg) scale(.6)}
  42%,62%{opacity:1;transform:translate(14px,0) rotate(34deg) scale(1)}
  70%{opacity:0;transform:translate(34px,0) rotate(34deg) scale(1.1)}
}

#trainerOverlayV150 .paladin-arc-v152{
  width:74px;height:74px;border:6px solid #ffe176;
  border-left-color:transparent;border-bottom-color:transparent;border-radius:50%;
  filter:drop-shadow(0 0 8px #ffd23e);
  left:50%;top:48%;transform:rotate(38deg);
}
#trainerOverlayV150.training .paladin-arc-v152.active{
  animation:paladinArcV152 1.02s steps(4,end) infinite;
}
@keyframes paladinArcV152{
  0%,42%,100%{opacity:0;transform:translate(0,0) rotate(38deg) scale(.65)}
  48%,68%{opacity:1;transform:translate(16px,0) rotate(38deg) scale(1)}
  76%{opacity:0;transform:translate(36px,0) rotate(38deg) scale(1.1)}
}

#trainerOverlayV150 .dummy-wrap-v151{
  filter:none;
}
#trainerOverlayV150 .training-stage-strip-v151{
  background:linear-gradient(to top,rgba(0,0,0,.20),transparent 42%);
}

/* V165 — non-interactive party training vignette. */
#trainerOverlayV150 .training-scene-status-v165{
  position:absolute;left:50%;top:14px;transform:translateX(-50%);z-index:7;
  padding:6px 12px;border:1px solid #65563e;background:#080b0ed9;
  color:#9eabb2;font-size:11px;letter-spacing:.7px;white-space:nowrap;
  pointer-events:none;
}
#trainerOverlayV150.training .training-scene-status-v165{
  color:#ffe083;border-color:#b27a2d;box-shadow:0 0 12px #d68a2738;
}
#trainerOverlayV150 .trainee-stage-v151::after{
  content:"";position:absolute;left:34%;bottom:12px;width:46px;height:8px;
  border-radius:50%;background:#0b080666;filter:blur(2px);opacity:0;
}
#trainerOverlayV150.training .trainee-stage-v151::after{
  animation:trainingDustV165 .82s steps(3,end) infinite;
}
#trainerOverlayV150.training .trainee-stage-v151[data-training-hero="0"]{
  animation:trainingMageCastV165 1.15s steps(5,end) infinite;
}
#trainerOverlayV150.training .trainee-stage-v151[data-training-hero="1"]{
  animation:trainingMeleeV165 .9s steps(4,end) infinite;
}
#trainerOverlayV150.training .trainee-stage-v151[data-training-hero="2"]{
  animation:trainingMeleeV165 1.02s steps(4,end) infinite -.28s;
}
#trainerOverlayV150.training .trainee-stage-v151[data-training-hero="3"]{
  animation:trainingArcherV165 .96s steps(5,end) infinite -.16s;
}
#trainerOverlayV150.training .trainee-stage-v151[data-training-hero="4"]{
  animation:trainingMeleeV165 .9s steps(4,end) infinite -.12s;
}
#trainerOverlayV150.training .trainee-stage-v151[data-training-hero="5"]{
  animation:trainingMageCastV165 1.15s steps(5,end) infinite -.34s;
}
@keyframes trainingMageCastV165{
  0%,18%,100%{transform:translateX(0) translateY(0)}
  28%,38%{transform:translateX(-5px) translateY(-2px)}
  48%,66%{transform:translateX(10px) translateY(0)}
}
@keyframes trainingMeleeV165{
  0%,28%,100%{transform:translateX(0) rotate(0)}
  38%{transform:translateX(-7px) rotate(-2deg)}
  50%,68%{transform:translateX(34px) rotate(2deg)}
  82%{transform:translateX(10px) rotate(0)}
}
@keyframes trainingArcherV165{
  0%,22%,100%{transform:translateX(0) rotate(0)}
  34%,48%{transform:translateX(-8px) rotate(-2deg)}
  58%,72%{transform:translateX(5px) rotate(1deg)}
}
@keyframes trainingDustV165{
  0%,30%,100%{opacity:0;transform:scale(.5)}
  45%,72%{opacity:.65;transform:scale(1.15)}
}
#trainerOverlayV150 .archer-arrow-v165{
  width:38px;height:3px;background:linear-gradient(90deg,#8e50df,#e0b8ff 70%,#fff);
  border-radius:2px;box-shadow:0 0 7px #9b4cff;
}
#trainerOverlayV150 .archer-arrow-v165::before{
  content:"";position:absolute;right:-5px;top:-3px;border-left:8px solid #e0b8ff;
  border-top:4px solid transparent;border-bottom:4px solid transparent;
}
#trainerOverlayV150.training .archer-arrow-v165.active{
  animation:trainingArrowV165 .96s linear infinite -.16s;
}
@keyframes trainingArrowV165{
  0%,38%{opacity:0;transform:translateX(0)}
  44%{opacity:1;transform:translateX(0)}
  76%{opacity:1;transform:translateX(245px)}
  79%,100%{opacity:0;transform:translateX(260px)}
}

#trainerOverlayV150 .warden-slash-v200{
  width:72px;height:72px;border:6px solid #bdf5ff;
  border-left-color:transparent;border-bottom-color:transparent;border-radius:50%;
  filter:drop-shadow(0 0 7px #43cfff);transform:rotate(34deg);
}
#trainerOverlayV150.training .warden-slash-v200.active{
  animation:wardenSlashV200 .9s steps(4,end) infinite -.12s;
}
@keyframes wardenSlashV200{
  0%,35%,100%{opacity:0;transform:translate(0,0) rotate(34deg) scale(.6)}
  42%,64%{opacity:1;transform:translate(18px,-3px) rotate(34deg) scale(1)}
  73%{opacity:0;transform:translate(40px,-3px) rotate(34deg) scale(1.15)}
}
#trainerOverlayV150 .arcane-bolt-v200{
  width:19px;height:19px;border-radius:50%;
  background:radial-gradient(circle,#fff 0 20%,#a9f46c 22% 48%,#38a94c 50% 72%,transparent 74%);
  box-shadow:0 0 10px #65dc62,0 0 20px #b7ff75;
}
#trainerOverlayV150.training .arcane-bolt-v200.active{
  animation:arcaneBoltV200 1.15s linear infinite -.34s;
}
@keyframes arcaneBoltV200{
  0%,18%{opacity:0;transform:translate(0,0) scale(.65)}
  25%{opacity:1}
  70%{opacity:1;transform:translate(250px,-2px) scale(1)}
  75%,100%{opacity:0;transform:translate(266px,-2px) scale(1.4)}
}


/* V154 — HARD ISOLATION: Training Yard visuals must never affect Stage combat */
#trainerOverlayV150{contain:layout paint style;}
#trainerOverlayV150 .trainee-stage-v151,
#trainerOverlayV150 .trainee-stage-v151 img,
#trainerOverlayV150 .training-stage-strip-v151,
#trainerOverlayV150 .dummies-v151,
#trainerOverlayV150 .dummy-wrap-v151{
  box-sizing:border-box;
}
/* Stage combat positioning remains owned exclusively by the original combat renderer. */
#gameCanvas, canvas#gameCanvas{transform:none!important;}


/* V163 — TBH-inspired Cube system */
.alch-cube-head-v163{border:1px solid #674526;background:#130f0c;padding:9px 10px;margin-bottom:10px}
.alch-cube-level-line-v163{display:flex;justify-content:space-between;gap:12px;align-items:center;color:#ffd66f;font-weight:900;font-size:11px}
.alch-cube-xp-v163{height:8px;border:1px solid #46515b;background:#070b0e;margin-top:7px;overflow:hidden}
.alch-cube-xp-v163 i{display:block;height:100%;background:linear-gradient(90deg,#c57a25,#f5c35d);width:0}
.alch-cube-sub-v163{display:flex;justify-content:space-between;margin-top:5px;font-size:11px;color:#9ca5ad}
.alch-op-lock-v163{opacity:.42!important;filter:grayscale(1)}
.alch-op-lock-v163::after{content:"  🔒";float:right}
.alch-tbh-info-v163{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:8px 0}
.alch-tbh-info-v163 div{border:1px solid #39434c;background:#0b1014;padding:7px;text-align:center;font-size:11px;color:#aab4bd}
.alch-tbh-info-v163 b{display:block;color:#ffd66f;font-size:11px;margin-bottom:3px}
.alch-slot-v160 .slot-icon-v163{font-size:24px;line-height:1}
.alch-slot-v160 .slot-lv-v163{position:absolute;bottom:3px;left:4px;font-size:11px;color:#d8d8d8}
.alch-operation-help-v163{font-size:11px;color:#b8a995;line-height:1.45;margin:8px 0}
.alch-result-preview-v163{border:1px solid #5b4430;background:#100d0b;padding:9px;margin:8px 0;text-align:center;color:#d7c6a7;font-size:11px}
.alch-result-preview-v163 strong{color:#ffd66f}
.engraving-line-v347 span{display:flex;align-items:center;gap:7px}.engraving-line-v347 i{width:9px;height:9px;transform:rotate(45deg);background:var(--jewel,#d991ff);box-shadow:0 0 7px var(--jewel,#d991ff)}
.native-engraving-mark-v347{position:absolute;left:3px;top:3px;color:#e0a2ff;font:900 11px/1 var(--font-display);text-shadow:0 0 5px #a536df,1px 1px #000;z-index:3}
.native-engraving-material-v347{border-color:var(--jewel,#d991ff)!important;background:repeating-linear-gradient(135deg,#091016 0 6px,#17101e 6px 10px)!important;box-shadow:inset 0 0 0 2px #05080b,0 0 8px color-mix(in srgb,var(--jewel,#d991ff) 40%,transparent)!important}
.native-engraving-material-v347 .native-bag-icon{color:var(--jewel,#d991ff);text-shadow:0 0 6px var(--jewel,#d991ff)}
.alch-selector-menu-v162 button small{float:right;color:#75818b}

/* Fury State — charged signature skill announcement. */
#furyAnnouncement{
  position:fixed;left:50%;top:20%;z-index:22000;
  min-width:min(620px,86vw);padding:13px 28px;
  transform:translate(-50%,-18px) scale(.96);opacity:0;pointer-events:none;
  border:2px solid #b66932;background:linear-gradient(90deg,#120806ee,#3b1209f2,#120806ee);
  box-shadow:0 0 0 2px #080403,0 0 30px #ff5b263f,inset 0 0 24px #ff6b241c;
  color:#ffe4a1;text-align:center;text-shadow:0 2px 0 #000;
  transition:opacity .16s ease,transform .16s ease;
}
#furyAnnouncement .furyAnnouncementIcon{position:absolute;left:14px;top:50%;width:48px;height:48px;transform:translateY(-50%);object-fit:cover;filter:drop-shadow(0 0 7px #ff753e88)}
#furyAnnouncement .furyAnnouncementCopy{display:block;padding-left:48px}
#furyAnnouncement.show{opacity:1;transform:translate(-50%,0) scale(1)}
#furyAnnouncement b{display:block;color:#ff9a42;font:900 18px var(--font-display);letter-spacing:2px}
#furyAnnouncement span{display:block;margin-top:5px;font:900 11px var(--font-ui);letter-spacing:1px}
@media(max-width:700px){
  #furyAnnouncement{min-width:82vw;padding:10px 14px}
  #furyAnnouncement b{font-size:14px}
  #furyAnnouncement span{font-size:11px}
}
