

.portalNavBtn{border-color:#9b4b28!important;background:linear-gradient(#3a1912,#1d0d0a)!important;color:#ffd08a!important}
.portalOverlay{position:fixed;inset:0;z-index:12000;background:#020305e8;display:none;align-items:center;justify-content:center;padding:14px}
.portalWindow{position:relative;width:min(520px,94vw);max-height:94vh;overflow:auto;background:#090c10;border:4px solid #424b53;box-shadow:inset 0 0 0 3px #0a0b0d,inset 0 0 0 6px #7a2f16,0 28px 80px #000;padding:10px;image-rendering:pixelated}
.portalHeader{height:58px;display:grid;place-items:center;background:linear-gradient(#8c201e,#4a1211);border:3px solid #b85a24;box-shadow:inset 0 0 0 2px #2d0908;color:#ffb64a;text-shadow:3px 3px 0 #42110c;font-size:29px;letter-spacing:.08em;margin-bottom:8px}
.portalClose{position:absolute;right:18px;top:20px;z-index:5;width:34px;height:34px;border:2px solid #e37235;background:#551812;color:#ffe0a0;font-size:18px;cursor:pointer}
.portalSubbar{display:flex;align-items:center;justify-content:space-between;background:#15100d;border:2px solid #6f3219;padding:8px 12px;color:#f0c186;font-size:11px;margin-bottom:8px}
.portalRealm{color:#ff9b4a}.portalAct{color:#ffe1a1}
.portalMapWrap{position:relative;width:100%;aspect-ratio:900/1074;background:#160b07;border:3px solid #9b3e17;overflow:hidden;box-shadow:inset 0 0 0 2px #2a0d07}
.portalMapArt{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.96) contrast(1.03)}
.portalNodes{position:absolute;inset:0;pointer-events:none}
.portalStageNode{position:absolute;width:38px;height:38px;border-radius:50%;transform:translate(-50%,-50%);pointer-events:auto;cursor:pointer;background:#f4ead1;border:4px solid #5a3517;color:#18100a;font-size:11px;display:grid;place-items:center;box-shadow:0 0 0 2px #f2b24c,0 3px 0 #2d1609,0 0 12px #0009}
.portalStageNode:hover{transform:translate(-50%,-50%) scale(1.12);filter:brightness(1.15)}
.portalStageNode.selected{background:#38e57a;border-color:#083c20;box-shadow:0 0 0 2px #8effb4,0 0 16px #42f682}
.portalStageNode.boss{width:48px;height:48px;background:#9e1717;color:#fff;border-color:#2d0707;box-shadow:0 0 0 3px #d9a43d,0 0 18px #ff3d27aa;font-size:15px}
.portalStageNode span{position:absolute;left:44px;top:8px;white-space:nowrap;background:#0b0806e8;border:1px solid #6b4221;padding:2px 5px;color:#ffe3ac;font-size:11px;pointer-events:none}
.portalStageNode.boss span{left:52px;color:#ff6d55}
.portalDifficultyTitle{text-align:center;color:#f1c679;font-size:11px;margin:10px 0 6px}
.portalDifficulty{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.portalDifficulty button{height:38px;border:2px solid #384b58;background:#0c1720;color:#9fd9ff;font-size:11px;cursor:pointer}
.portalDifficulty button[data-difficulty="normal"]{color:#c7f39b}.portalDifficulty button[data-difficulty="nightmare"]{color:#c99cff}.portalDifficulty button[data-difficulty="dreadful"]{color:#ff6969}
.portalDifficulty button.active{border-color:#e2b24b;background:#34250d;box-shadow:0 0 10px #e2b24b55;color:#ffe1a1}
.portalInfo{margin-top:8px;min-height:31px;border:1px solid #493525;background:#0a0d10;padding:8px;color:#b9c3cb;font-size:11px;text-align:center}

/* V111 — PARTY DEFEAT / GAME OVER */
#gameOverOverlay{
 position:fixed;inset:0;z-index:40000;display:none;
 align-items:center;justify-content:center;
 background:rgba(0,0,0,.76);
 backdrop-filter:brightness(.38) saturate(.65);
}
.gameOverCard{
 width:min(560px,90vw);
 text-align:center;
 padding:34px 26px 28px;
 background:linear-gradient(#100b0b,#07090c);
 border:4px solid #4b2020;
 box-shadow:inset 0 0 0 3px #0a0505,inset 0 0 0 6px #741f1f,0 24px 70px #000;
 image-rendering:pixelated
}
.gameOverTitle{
 color:#d54c43;
 font-size:46px;
 letter-spacing:.11em;
 line-height:1;
 text-shadow:4px 4px 0 #3a0909,0 0 15px #b91f1f88;
 margin-bottom:12px
}
.gameOverSub{
 color:#b8a6a0;
 font-size:11px;
 margin-bottom:24px;
 letter-spacing:.05em
}
.gameOverActions{
 display:flex;justify-content:center;gap:12px;flex-wrap:wrap
}
.gameOverBtn{
 min-width:160px;height:46px;
 border:3px solid #65462a;
 background:#21150d;color:#f2c777;
 box-shadow:inset 0 0 0 2px #090604;
 cursor:pointer;font-size:11px
}
.gameOverBtn:hover{filter:brightness(1.2)}
.gameOverBtn.primary{
 border-color:#a64c2e;
 background:#4b1b14;
 color:#ffd08a
}

@media(max-width:700px){.portalWindow{width:min(470px,96vw)}.portalDifficulty{grid-template-columns:repeat(2,1fr)}.portalHeader{font-size:23px}}

.gameModalOverlay{z-index:9999!important;position:absolute;inset:0;background:#000c;display:none;align-items:center;justify-content:center;z-index:18}
.gameModalCard{width:min(900px,94vw);max-height:82vh;overflow:auto;background:#0a0f15;border:2px solid #9c7322;padding:18px;box-shadow:0 22px 70px #000}
.gameModalCard h2{color:#f1d18b;margin:0 0 14px}
.menuGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px}
.menuCard{background:#111a23;border:1px solid #344555;padding:14px;min-height:115px}
.menuCard.activeCard{border-color:#e0a83e;box-shadow:0 0 14px #e0a83e33}
.menuCard h3{margin:0 0 7px;font-size:13px;color:#fff}
.menuCard p{margin:4px 0;color:#9fadb9;font-size:11px;line-height:1.45}
.menuAction{margin-top:9px;background:#192734;border:1px solid #496074;padding:7px 10px;cursor:pointer;font-size:11px}
.menuAction:hover{filter:brightness(1.2)}
.slotGrid{display:grid;grid-template-columns:repeat(8,1fr);gap:6px;margin-top:12px}
.invSlot{aspect-ratio:1;background:#0c1218;border:1px solid #34414e;display:grid;place-items:center;font-size:18px}
/* V138 — BAG: 5 Chrome-style tabs, each page is a 6x6 inventory */
.bagShell{max-width:720px;margin:0 auto}
.bagTopInfo{
  display:flex;justify-content:space-between;gap:16px;align-items:center;
  padding:8px 10px;background:#070b0f;border:2px solid #263847;
  color:#aebdca;font-size:11px
}
.bagTopInfo b{color:#f1d18b}
.bagTabs{
  display:flex;align-items:flex-end;gap:3px;
  margin-top:12px;padding-left:6px;
  border-bottom:2px solid #43525f
}
.bagTab{
  position:relative;min-width:102px;height:34px;
  padding:0 16px;border:2px solid #344653;border-bottom:0;
  background:#101821;color:#8fa1af;cursor:pointer;
  clip-path:polygon(8px 0,calc(100% - 8px) 0,100% 8px,100% 100%,0 100%,0 8px);
  font-size:11px
}
.bagTab:hover{background:#16232d;color:#d5e0e7}
.bagTab.active{
  height:38px;background:#0c1218;color:#ffd471;
  border-color:#9d762b;z-index:2
}
.bagPage{
  padding:12px;background:#0c1218;
  border:2px solid #43525f;border-top:0;
  box-shadow:inset 0 0 0 2px #05080b
}
.bagGrid{
  display:grid;grid-template-columns:repeat(6,64px);grid-template-rows:repeat(6,64px);
  justify-content:center;gap:7px
}
.bagSlot{
  width:64px;height:64px;
  background:linear-gradient(#101821,#090e13);
  border:2px solid #344653;
  box-shadow:inset 2px 2px 0 #17242d,inset -2px -2px 0 #030506;
  display:grid;place-items:center;font-size:24px;
  image-rendering:pixelated
}
.bagSlot:hover{border-color:#b18435;background:#151d24}
.bagSlotIndex{
  position:absolute;opacity:.35;font-size:11px;align-self:end;justify-self:end;
  margin:0 4px 3px 0;color:#aab7c0
}
.bagSlot{position:relative}
@media(max-width:620px){
  .bagTabs{overflow-x:auto}
  .bagTab{min-width:82px}
  .bagGrid{grid-template-columns:repeat(6,48px);grid-template-rows:repeat(6,48px);gap:5px}
  .bagSlot{width:48px;height:48px;font-size:19px}
}

.regionLine{display:flex;align-items:center;justify-content:space-between;background:#101821;border:1px solid #2f3d49;padding:12px;margin:7px 0}
.statRow{display:flex;justify-content:space-between;border-bottom:1px solid #202c36;padding:7px 0;font-size:11px}
.buyRow{display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:center;background:#101821;border:1px solid #303f4d;padding:10px;margin:7px 0}

/* V112 — START transition: reverse of Game Over fade */
#stageStartOverlay{
 position:fixed;inset:0;z-index:39990;display:none;
 align-items:center;justify-content:center;background:#000;
 opacity:1;pointer-events:none
}
#stageStartOverlay.reveal{display:flex;animation:stageStartReveal 1.45s steps(20,end) forwards}
.stageStartText{
 color:#ffd071;font-size:30px;letter-spacing:.10em;text-align:center;
 text-shadow:3px 3px 0 #4a160b,0 0 14px #ff7a2155
}
.stageStartText small{
 display:block;margin-top:12px;color:#c7b49b;font-size:11px;letter-spacing:.16em
}
@keyframes stageStartReveal{
 0%,28%{opacity:1}
 100%{opacity:0}
}

/* V117 — STAGE CLEAR result screen */
#stageClearOverlay{
 position:fixed;inset:0;z-index:40010;display:none;
 align-items:center;justify-content:center;
 background:rgba(0,0,0,.68);
 backdrop-filter:brightness(.52) saturate(.78);
 opacity:0
}
#stageClearOverlay.show{
 display:flex;
 animation:stageClearFadeIn .55s steps(12,end) forwards
}
.stageClearCard{
 width:min(560px,90vw);
 text-align:center;
 padding:34px 26px 28px;
 background:linear-gradient(#0c120d,#07090c);
 border:4px solid #385a36;
 box-shadow:inset 0 0 0 3px #050805,inset 0 0 0 6px #307a42,0 24px 70px #000;
 image-rendering:pixelated
}
.stageClearTitle{
 color:#79ef95;
 font-size:42px;
 letter-spacing:.10em;
 line-height:1;
 text-shadow:4px 4px 0 #0c3516,0 0 16px #4ee77966;
 margin-bottom:12px
}
.stageClearSub{
 color:#c2d4c5;
 font-size:11px;
 margin-bottom:24px;
 letter-spacing:.06em;
 line-height:1.5
}
.stageClearActions{
 display:flex;justify-content:center;gap:12px;flex-wrap:wrap
}
.stageClearBtn{
 min-width:165px;height:46px;
 border:3px solid #4d6650;
 background:#101b12;color:#cfe7d3;
 box-shadow:inset 0 0 0 2px #050805;
 cursor:pointer;font-size:11px
}
.stageClearBtn:hover{filter:brightness(1.18)}
.stageClearBtn.primary{
 border-color:#54b86e;
 background:#173b21;
 color:#92f6aa
}
.stageClearBtn:disabled{opacity:.45;filter:grayscale(1);cursor:not-allowed}
@keyframes stageClearFadeIn{
 0%{opacity:0}
 100%{opacity:1}
}
