/* The 640-pixel logical layout preserves original assets and nearest-neighbour scaling. */
.original-chrome{margin:0;background:#080807;color:#f4db97;font:13px Georgia,serif;min-width:0;overflow:hidden;height:100vh;height:100dvh;}
.original-chrome>header,.original-chrome>.bar,.original-chrome>footer,.original-chrome #mapPane>aside,.original-chrome .map-area{display:none!important}
.original-chrome #mapPane{display:block!important;margin:0 auto!important;padding:0!important;width:var(--stage-width,640px)!important;height:500px;max-width:none!important;zoom:var(--game-zoom,1)}
.original-chrome #mapPane[hidden]{display:none!important}
.original-chrome canvas,.original-chrome img{image-rendering:auto}
.original-chrome .adventure-stage{position:relative;width:var(--stage-width,640px);height:500px;background-color:#070605;overflow:hidden}
.original-chrome .stage-frame{position:absolute;left:0;top:0;width:var(--stage-width,640px);height:480px;display:block;pointer-events:none;image-rendering:auto}
.original-chrome #viewport{position:absolute!important;left:16px;top:16px;width:var(--map-width,448px)!important;height:448px!important;min-height:0!important;border:0!important;border-radius:0!important;background:black;overflow:hidden;z-index:1}
.original-chrome #mapCanvas{width:100%!important;height:100%!important;display:block;touch-action:none}
.original-chrome #minimap,.original-chrome .hud-heroes,.original-chrome .hud-towns,.original-chrome .hud-buttons,.original-chrome .hud-day,.original-chrome .hud-coordinates,.original-chrome .hud-resources,.original-chrome .chrome-message{z-index:2}
.original-chrome #minimap{position:absolute;left:var(--hud-left,480px);top:16px;width:144px!important;height:144px!important;min-width:0;min-height:0;border:0;border-radius:0;margin:0;padding:0}
.hud-heroes,.hud-towns{position:absolute;top:177px;width:54px;height:126px;overflow-y:auto;scrollbar-width:none;display:flex;flex-direction:column;gap:2px}
.original-chrome .hud-heroes{left:calc(var(--hud-left,480px) + 1px)}
.original-chrome .hud-towns{left:calc(var(--hud-left,480px) + 73px)}
.hud-slot{position:relative;flex-shrink:0;height:30px;width:54px;padding:0!important;margin:0!important;background:transparent!important;border:0!important;border-radius:0!important;min-height:0!important;cursor:pointer;line-height:0}
.hud-slot canvas{width:54px;height:30px;display:block}
.hud-slot.selected{outline:2px solid #ffd459;outline-offset:-1px}
.hud-buttons{position:absolute;left:var(--hud-left,480px);top:320px;width:144px!important;display:grid;grid-template-columns:48px 48px 48px;gap:0}
.sprite-button{padding:0!important;margin:0!important;line-height:0!important;background:none!important;border:0!important;border-radius:0!important;min-width:0!important;min-height:0!important;box-shadow:none!important;cursor:pointer}
.sprite-button canvas{display:block;pointer-events:none}
.sprite-button:focus-visible{outline:2px solid #fff}
.sprite-button:disabled{filter:brightness(.45);cursor:default}

/* Authentic DOS Right Sidebar Resource Panel (ressmall.icn at 480, 396 below control buttons) */
.hud-resources{
  position:absolute;
  left:var(--hud-left,480px);
  top:396px;
  width:144px;
  height:68px;
  background-repeat:no-repeat!important;
  background-position:5px 2px!important;
  background-size:134px 56px!important;
  box-sizing:border-box;
}
.ressmall-top-val{
  position:absolute;
  top:26px;
  height:12px;
  line-height:12px;
  text-align:center;
  font:bold 9px Tahoma,Verdana,Georgia,sans-serif;
  color:#fff2c4;
  text-shadow:1px 1px 0 #000,-1px -1px 0 #000;
  white-space:nowrap;
  overflow:hidden;
}
.ressmall-sec-val{
  position:absolute;
  top:56px;
  width:22px;
  height:12px;
  line-height:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  font:bold 9px Tahoma,Verdana,Georgia,sans-serif;
  color:#ffe7a4;
  text-shadow:1px 1px 0 #000,-1px -1px 0 #000;
  white-space:nowrap;
}

/* Compact 20px Bottom Status Bar (y=480..500) */
.hud-day{position:absolute;left:12px;top:481px;width:160px;height:18px;line-height:18px;text-align:left;color:#f4db97;font:bold 11px Georgia,serif;text-shadow:1px 1px 0 #000}
.chrome-message{position:absolute;top:481px;left:176px;right:156px;height:18px;line-height:18px;text-align:center;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chrome-message #status{font-size:11px;color:#e2d3a2}
.hud-coordinates{position:absolute;right:12px;top:481px;width:140px;height:18px;line-height:18px;text-align:right;font:bold 11px Georgia,serif;color:#e5d29c;text-shadow:1px 1px #000}
.original-chrome #selectionCard{display:none!important;pointer-events:none}

/* Main Menu */
.main-menu{position:fixed;z-index:100;left:50%;top:50%;transform:translate(-50%,-50%);width:640px;height:480px;background:#15120f no-repeat;background-size:640px 480px!important;zoom:var(--menu-zoom,1)!important}
.main-menu[hidden]{display:none!important}
.original-chrome.menu-active #mapPane{visibility:hidden!important;pointer-events:none!important}
.original-chrome.menu-active .main-menu{visibility:visible}
.original-chrome.menu-active:before{content:'';position:fixed;inset:0;background:#050404;z-index:90;pointer-events:none}
.main-menu-controls{position:absolute;right:32px;top:14px;display:flex;flex-direction:column;gap:3px;z-index:5}
.main-menu-controls .sprite-button canvas{max-height:51px;width:auto}
.main-menu-mid-controls{position:absolute;left:50%;transform:translateX(-50%);bottom:18px;display:flex;flex-direction:column;align-items:center;gap:4px;z-index:6;background:rgba(16,12,8,0.86);border:2px ridge #d4a94e;padding:4px 6px;box-shadow:0 8px 24px rgba(0,0,0,0.9)}
.menu-loading{position:absolute;bottom:20px;left:20px;right:20px;white-space:normal;line-height:1.5;background:#15120fe8;padding:8px;color:#ffe2a0}

/* General DOS Dialogs */
.chrome-button,.chrome-dialog button:not(.sprite-button):not(.dos-caslwind-slot):not(.dos-overview-card):not(.dos-swap-slot):not(.dos-swap-art-btn):not(.dos-book-spell){font:bold 12px Georgia,serif;color:#f6e2a9;background:linear-gradient(180deg,#6b4923 0%,#3d2711 100%);border:1px solid #c99e4c;border-radius:0;padding:5px 10px;cursor:pointer;text-shadow:1px 1px 1px #000}
.chrome-button.accent{background:linear-gradient(180deg,#8c6422 0%,#4f3510 100%);border-color:#f0c869;color:#fff4ce}
.chrome-button:disabled,.chrome-dialog button:disabled{opacity:.5;cursor:default}
.chrome-dialog{outline:0!important;border-radius:0!important;box-sizing:border-box;width:640px;max-width:95vw;max-height:94vh;overflow:auto;padding:14px;background:#25221b;border:3px ridge #b38c39;color:#f5dd9a;background-size:cover;font:13px Georgia,serif;zoom:var(--game-zoom,1)}
.chrome-dialog::backdrop,.original-town::backdrop,.original-hero::backdrop,#eventModal::backdrop{background:rgba(0,0,0,0.72)}
.chrome-dialog-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;border-bottom:1px solid #967234;padding-bottom:6px}
.chrome-dialog-body{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;align-items:center}
.chrome-dialog-body>canvas,.chrome-dialog-body>img{flex:0 0 auto!important;align-self:center!important;width:auto;height:auto;object-fit:none}
.chrome-dialog-body>p{width:100%;margin:4px 0}
.chrome-dialog input,.chrome-dialog select{font:13px Georgia,serif;background:#15110c;color:#ffe8b1;border:1px solid #ac843a;padding:4px 6px}
.parchment-dialog{background-size:100% 100%!important;background-repeat:no-repeat!important;border:0!important;background-color:transparent!important;box-shadow:0 12px 36px #000c;padding:38px 28px 24px!important}
.dos-dialog-actions{width:100%;display:flex;justify-content:center;align-items:center;gap:14px;margin-top:8px}
.dos-notice-dialog{width:302px!important;min-width:286px!important;text-align:center}
.dos-thieves-dialog{width:420px!important;min-width:340px!important;text-align:center}
.dos-well-dialog{width:460px!important;min-width:360px!important;text-align:center}
.dos-notice-text{text-align:center;white-space:pre-line;line-height:1.42;color:#fff0c4;font-size:13px;width:100%}
.dos-ok-btn{margin:8px auto 0}

/* Redback Submenus (stpmain, stpnewgm, stpcmpgn, stpmp, stphotst) */
.dos-redback-dialog{width:194px!important;min-width:194px!important;height:410px!important;padding:0!important;border:0!important;overflow:hidden!important;background-size:194px 410px!important;box-shadow:0 0 30px #000}
.dos-redback-stage{position:relative;width:194px;height:410px}

/* New Game Setup (newgame.bin 322x459) */
.dos-newgame-dialog{width:322px!important;min-width:322px!important;height:459px!important;padding:0!important;border:0!important;overflow:hidden!important;background-size:322px 459px!important;box-shadow:0 0 30px #000}
.dos-newgame-stage{position:relative;width:322px;height:459px}
.dos-ng-sec-title{font:bold 12px Georgia,serif;color:#ffeaa8;text-shadow:1px 1px 1px #000;pointer-events:none}
.dos-ng-small-label{font:11px Georgia,serif;color:#ffeab3;text-shadow:1px 1px 1px #000;pointer-events:none}
.dos-ng-scenbar{position:absolute;left:24px;top:354px;width:249px;height:20px;border:0;background-color:transparent;color:#fff3c8;font:bold 11px Georgia,serif;text-align:center;line-height:20px;padding:0 6px;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Scenario Picker (sceninfo.bmp 322x459) */
.dos-sceninfo-dialog{width:322px!important;min-width:322px!important;height:459px!important;padding:18px 20px!important;border:0!important;overflow:hidden!important;background-size:322px 459px!important}
.dos-sceninfo-stage{position:relative;width:100%;height:100%;display:flex;flex-direction:column;gap:8px}
.dos-sceninfo-title{text-align:center;font:bold 14px Georgia,serif;color:#ffe8a3;margin-top:6px}
.dos-sceninfo-list{height:230px;overflow-y:auto;display:flex;flex-direction:column;gap:3px;background:#140f0acc;border:1px solid #8c6b32;padding:4px}
.dos-sceninfo-list button{text-align:left;font-size:11px;padding:4px 6px}
.dos-sceninfo-list button.active{background:#8b6420;color:#fff}
.dos-sceninfo-desc{height:105px;background:#140f0acc;border:1px solid #8c6b32;padding:6px;font-size:11px;line-height:1.35;white-space:pre-line;color:#f5deb0;overflow-y:auto}
.dos-sceninfo-ok{align-self:center;margin-top:auto}

/* Campaign Briefing (campback.bmp) */
.dos-campaign-dialog{width:520px!important;min-width:320px!important;padding:22px!important;background-size:cover!important}
.dos-campaign-stage{display:flex;flex-direction:column;gap:10px;width:100%;background:#18120be6;border:2px ridge #b58d3d;padding:16px;box-sizing:border-box}
.dos-campaign-header{font:bold 16px Georgia,serif;color:#ffe8a6;text-align:center}
.dos-campaign-lord-desc{font-size:13px;color:#f0d8a8;line-height:1.4}
.dos-campaign-select{width:100%;padding:6px}
.dos-campaign-goal{background:#291f13;border:1px solid #967234;padding:10px;color:#fff2c6;font-size:13px;line-height:1.4}

/* Control Panel (cpanel.bmp 322x459) */
.dos-cpanel-dialog{width:322px!important;min-width:322px!important;height:459px!important;padding:0!important;border:0!important;overflow:hidden!important;background-size:322px 459px!important;box-shadow:0 10px 30px #000}
.dos-cpanel-stage{position:relative;width:322px;height:459px}
.dos-cpanel-lbl{font:bold 11px Georgia,serif;color:#ffe8a8;text-align:center;text-shadow:1px 1px 1px #000;pointer-events:none}
.dos-cpanel-val{font:11px Georgia,serif;color:#fff4c8;text-align:center;text-shadow:1px 1px 1px #000;pointer-events:none}
.dos-cpanel-opt:hover{filter:brightness(1.15)}

/* Town / Castle Screen (townwind.bin 640x480:
   640x256 courtyard at (0,0), 640x212 strip.icn at (0,248), 640x20 bigbar.icn at (0,460)) */
.original-chrome .original-town{outline:0!important;position:fixed;padding:0;width:640px;height:480px;max-width:none;max-height:none;border:0;border-radius:0;background:#17130c;color:#ffdc9b;overflow:hidden;box-shadow:0 0 30px #000,0 0 0 2px #94712e;zoom:var(--game-zoom,1)}
.original-town>h2,.original-town>p:not(#townStatus),.original-town>label,.original-town>details,.original-town>h3,.original-town>#townRecruit,.original-town>#recruitTarget,.original-town>#closeTown,.original-town>#townTransfer,.original-town>#townStatus,.original-town>.town-actions{display:none!important}
.town-scene-wrap{position:absolute;left:0;top:0;width:640px;height:256px;overflow:hidden;z-index:1}
.town-scene{display:block;width:640px;height:256px;margin:0}
.town-armies{position:absolute;left:0;top:248px;width:640px;height:212px;background-color:transparent!important;background-repeat:no-repeat;background-size:640px 212px;z-index:2;pointer-events:none}
.town-armies button,.town-armies .town-treasury-box{pointer-events:auto}
.town-name-banner{position:absolute;left:231px;top:248px;width:179px;height:13px;background:none!important;display:flex;align-items:center;justify-content:center;font:bold 10px Georgia,serif;color:#fff2c5;text-shadow:1px 1px 1px #000;pointer-events:none;z-index:4}
.town-crest-slot{position:absolute!important;left:5px;top:14px;width:101px;height:93px;display:flex;align-items:center;justify-content:center}
.town-portrait{position:absolute!important;left:5px;top:113px;width:101px;height:93px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.town-empty-portrait{background-size:101px 93px!important;background-repeat:no-repeat!important;cursor:pointer}
.town-empty-portrait:hover{filter:brightness(1.18)}
.army-slot{position:absolute;box-sizing:border-box;width:82px;height:93px;border:0;padding:0;border-radius:0;background-color:transparent!important;background-size:82px 93px;color:#ffe4a3;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:0;box-shadow:none;font:14px Georgia,serif;cursor:pointer}
.army-slot canvas{width:82px;height:93px;image-rendering:auto;pointer-events:none}
.army-slot strong{position:absolute;bottom:4px;right:6px;text-shadow:1px 1px 0 #000,-1px -1px 0 #000;font:bold 9px Tahoma,Verdana,monospace;color:#fff4c8;pointer-events:none;z-index:2}
.army-slot.selected{outline:2px solid #fee365;filter:brightness(1.15)}
.army-slot:disabled{opacity:1;cursor:default}

/* Authentic DOS Right-Hand Castle Treasury Panel (552, 14, 82x158 above EXIT in strip.icn:0) */
.town-treasury-box{
  position:absolute;
  left:552px;
  top:14px;
  width:82px;
  height:158px;
  box-sizing:border-box;
  padding:3px 2px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  cursor:pointer;
}
.town-treasury-box:hover{filter:brightness(1.12)}
.town-treasury-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-template-rows:repeat(3,36px);
  gap:1px 2px;
  width:100%;
}
.town-treasury-cell{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-end;
  position:relative;
  height:36px;
}
.town-treasury-cell canvas{
  max-width:34px;
  max-height:24px;
  object-fit:contain;
  image-rendering:auto;
  pointer-events:none;
}
.town-treasury-cell span{
  font:bold 9px Tahoma,Verdana,Georgia,sans-serif;
  color:#fff2c6;
  line-height:10px;
  text-shadow:1px 1px 0 #000,-1px -1px 0 #000;
}
.town-treasury-gold{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-end;
  height:40px;
  border-top:1px solid rgba(180,140,65,0.35);
  padding-top:2px;
}
.town-treasury-gold canvas{
  max-width:66px;
  max-height:24px;
  object-fit:contain;
  image-rendering:auto;
  pointer-events:none;
}
.town-treasury-gold strong{
  font:bold 10px Tahoma,Verdana,Georgia,sans-serif;
  color:#ffe999;
  line-height:12px;
  text-shadow:1px 1px 0 #000,-1px -1px 0 #000;
}

.town-exit-btn{position:absolute!important;left:556px;top:174px}
.town-bottom-bar{position:absolute;left:0;top:460px;width:640px;height:20px;background-size:640px 20px!important;background-repeat:no-repeat!important;display:flex;align-items:center;justify-content:center;font:bold 11px Georgia,serif;color:#ffe8a8;text-shadow:1px 1px 1px #000;padding:0 18px;box-sizing:border-box;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;z-index:3}

/* Castle Options Window (caslwind.bin 640x262) & Mage Guild Window (magewind.bin 640x262) */
.dos-caslwind-dialog,.dos-magewind-dialog{width:640px!important;min-width:640px!important;height:262px!important;padding:0!important;border:2px ridge #b58d3d!important;overflow:hidden!important;background-size:640px 262px!important;box-shadow:0 14px 36px #000}
.dos-caslwind-stage,.dos-magewind-stage{position:relative;width:640px;height:262px}
.dos-caslwind-slot{position:absolute;width:137px;height:73px;padding:0;margin:0;border:0;background:transparent;cursor:pointer;overflow:hidden}
.dos-caslwind-slot:hover{filter:brightness(1.15);outline:1px solid #ffd86b}
.dos-caslwind-slot.is-built .dos-caslwind-art{filter:brightness(.88)}
.dos-caslwind-slot.is-locked .dos-caslwind-art{filter:grayscale(.35) brightness(.75)}
.dos-caslwind-art{position:absolute;left:0;top:0;width:137px;height:61px;display:block;pointer-events:none}
.dos-caslwind-name{position:absolute;left:0;top:61px;width:137px;height:12px;background-size:137px 14px;font:bold 9px Georgia,serif;color:#fff1c2;line-height:12px;text-align:center;text-shadow:1px 1px 1px #000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none}
.dos-caslwind-badge{position:absolute;right:3px;top:42px;pointer-events:none}
.dos-caslwind-bar{position:absolute;left:10px;top:239px;width:530px;height:19px;background-size:100% 19px!important;background-repeat:no-repeat!important;display:flex;align-items:center;justify-content:center;gap:10px;font:bold 11px Georgia,serif;color:#ffe8a8;text-shadow:1px 1px 1px #000;padding:0 12px;box-sizing:border-box}
.dos-caslwind-exit{position:absolute!important;left:550px;top:235px}

/* Mage Guild Window (magewind.bin) */
.dos-magewind-tower{
  position:absolute;
  left:10px;
  top:10px;
  width:152px;
  height:222px;
  border:2px ridge #a68038;
  box-shadow:inset 0 0 8px #000;
}
.dos-magewind-scroll{
  position:absolute;
  width:140px;
  height:52px;
  box-sizing:border-box;
  display:flex;
  align-items:center;
  justify-content:center;
  background-repeat:no-repeat;
  background-size:140px 52px!important;
  border:0!important;
  background-color:transparent!important;
  min-height:0!important;
  padding:2px 6px!important;
}
.dos-magewind-scroll.is-open{
  cursor:pointer;
  flex-direction:row!important;
  gap:6px!important;
  text-align:left!important;
}
.dos-magewind-scroll.is-open:hover{filter:brightness(1.12)}
.dos-magewind-spell-icon{
  max-width:38px!important;
  max-height:38px!important;
  flex-shrink:0;
}
.dos-magewind-spell-name{
  font:bold 10px Georgia,serif!important;
  color:#2b1806!important;
  text-shadow:0 1px 0 rgba(255,245,210,0.65)!important;
  line-height:1.15;
}
.dos-magewind-spell-desc{
  display:none!important;
}
.dos-magewind-seal{
  opacity:0.92;
  pointer-events:none;
}
.dos-magewind-buybtn{
  padding:1px 8px!important;
  font-size:10px!important;
  height:17px;
  line-height:15px;
}

/* Buy Building Confirmation (buybuil4.bin 286px wide: 137x61 art + 137x12 namebar below) */
.dos-buybuild-dialog{width:286px!important;min-width:286px!important}
.dos-buybuild-stage{display:flex;flex-direction:column;align-items:center;gap:8px;width:100%;text-align:center}
.dos-buybuild-title{font:bold 14px Georgia,serif;color:#ffe8a3;text-align:center;width:100%;text-shadow:1px 1px 1px #000}
.dos-buybuild-icon{position:relative;width:137px;height:73px;margin:2px auto;border:1px solid #8a682d;box-shadow:0 2px 6px rgba(0,0,0,0.65);overflow:hidden}
.dos-buybuild-art{display:block;width:137px;height:61px}
.dos-buybuild-namebar{width:137px;height:12px;background-size:137px 14px;background-repeat:no-repeat;font:bold 9px Georgia,serif;color:#fff1c2;line-height:12px;text-align:center;text-shadow:1px 1px 1px #000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dos-buybuild-desc{font-size:12px;color:#f6e2b3;line-height:1.35;white-space:pre-line;margin:0}
.dos-buybuild-costs{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin:4px 0}
.dos-buybuild-cost-item{display:flex;flex-direction:column;align-items:center;gap:2px;font-size:11px}

/* Recruit Hero Dialog (rcrthero.bin) */
.dos-rcrthero-dialog{width:286px!important;min-width:286px!important}
.dos-rcrthero-stage{display:flex;flex-direction:column;align-items:center;gap:8px;width:100%}
.dos-rcrthero-title{font:bold 15px Georgia,serif;color:#ffe8a3;text-align:center;text-shadow:1px 1px 1px #000}
.dos-rcrthero-pair{display:flex;justify-content:center;gap:10px;width:100%}
.dos-rcrthero-slot{display:flex;flex-direction:column;align-items:center;gap:4px;width:112px}
.dos-rcrthero-frame{position:relative;width:111px;height:105px;background-size:111px 105px;display:flex;align-items:center;justify-content:center;cursor:pointer}
.dos-rcrthero-port{width:101px;height:93px;pointer-events:none}
.dos-rcrthero-label{font:bold 11px Georgia,serif;color:#fff0c2;text-align:center;white-space:nowrap}
.dos-rcrthero-cost{display:flex;flex-direction:column;align-items:center;gap:2px;margin-top:2px;font-size:12px;color:#ffe8a3}

/* Tavern Dialog (tavwin.bin) */
.dos-tavern-dialog{width:286px!important;min-width:286px!important}
.dos-tavern-stage{display:flex;flex-direction:column;align-items:center;gap:8px;width:100%;text-align:center}
.dos-tavern-title{font:bold 15px Georgia,serif;color:#ffe8a3;text-shadow:1px 1px 1px #000}
.dos-tavern-scene{border:2px ridge #a68038;background:#000;line-height:0}
.dos-tavern-desc{font-size:12px;color:#f5e0b0;white-space:pre-line;line-height:1.4}

/* Recruit Creatures Dialog (recruit0.bin / recruit.bmp 320x294) */
.dos-recruit-dialog{width:320px!important;min-width:320px!important;height:294px!important;padding:0!important;border:0!important;overflow:hidden!important;background-size:320px 294px!important;box-shadow:0 12px 32px #000}
.dos-recruit-stage{position:relative;width:320px;height:294px}
.dos-recruit-title{position:absolute;left:16px;top:18px;width:288px;text-align:center;font:bold 14px Georgia,serif;color:#ffe9a6;text-shadow:1px 1px 1px #000}
.dos-recruit-sprite{position:absolute;left:41px;top:32px;width:82px;height:93px;pointer-events:none}
.dos-recruit-avail{position:absolute;left:26px;top:121px;width:112px;text-align:center;font:bold 11px Georgia,serif;color:#ffe8a8;text-shadow:1px 1px 1px #000}
.dos-recruit-unitcost{position:absolute;left:140px;top:49px;width:132px;height:68px;background-size:132px 68px;display:flex;align-items:center;justify-content:space-evenly;padding:4px;box-sizing:border-box}
.dos-recruit-res{display:flex;flex-direction:column;align-items:center;font:bold 11px Georgia,serif;color:#fff2c6}
.dos-recruit-buy-label{position:absolute;left:36px;top:147px;font:bold 12px Georgia,serif;color:#ffeab5;text-shadow:1px 1px 1px #000}
.dos-recruit-count-box{position:absolute;left:136px;top:145px;width:68px;height:19px;background-size:68px 19px;background-repeat:no-repeat;display:flex;align-items:center;justify-content:center}
.dos-recruit-input{width:62px;border:0!important;background:transparent!important;color:#fff!important;text-align:center;font:bold 13px Georgia,serif!important;padding:0!important}
.dos-recruit-up{position:absolute!important;left:207px;top:140px}
.dos-recruit-down{position:absolute!important;left:207px;top:155px}
.dos-recruit-max{position:absolute!important;left:236px;top:142px}
.dos-recruit-total-label{position:absolute;left:20px;top:180px;width:280px;text-align:center;font:bold 12px Georgia,serif;color:#ffe8a8;text-shadow:1px 1px 1px #000}
.dos-recruit-total{position:absolute;left:30px;top:196px;width:260px;height:42px;display:flex;align-items:center;justify-content:center;gap:16px}
.dos-recruit-err{position:absolute;left:10px;top:232px;width:300px;text-align:center;font-size:10px;color:#ff9e8a}
.dos-recruit-ok{position:absolute!important;left:36px;top:245px}
.dos-recruit-cancel{position:absolute!important;left:189px;top:245px}

/* Creature Info Window (viewarmy.icn 402x229) */
.dos-viewarmy-dialog{width:402px!important;min-width:402px!important;height:229px!important;padding:0!important;border:0!important;overflow:hidden!important;background:transparent!important;box-shadow:0 10px 30px #000}
.dos-viewarmy-stage{position:relative;width:402px;height:229px;background-size:402px 229px;background-repeat:no-repeat}
.dos-viewarmy-title{position:absolute;left:196px;top:20px;width:172px;text-align:center;font:bold 14px Georgia,serif;color:#ffe9a6;text-shadow:1px 1px 1px #000}
.dos-viewarmy-sprite{position:absolute;left:70px;top:62px;width:82px;height:93px;pointer-events:none}
.dos-viewarmy-count-plate{position:absolute;left:41px;top:174px;width:142px;height:38px;background-size:142px 38px;display:flex;align-items:center;justify-content:center;font:bold 15px Georgia,serif;color:#fff4c8}
.dos-viewarmy-stats{position:absolute;left:198px;top:43px;width:168px;display:flex;flex-direction:column;gap:2px;font:10px/1.18 Georgia,serif;color:#f5dfb0}
.dos-viewarmy-stat-row{display:flex;justify-content:space-between;border-bottom:1px solid rgba(160,125,60,0.3);padding:0}
.dos-viewarmy-split{position:absolute!important;left:42px;top:22px;padding:3px 8px!important;font-size:11px!important}
.dos-viewarmy-dismiss{position:absolute!important;left:200px;top:181px}
.dos-viewarmy-exit{position:absolute!important;left:295px;top:181px}

/* Kingdom Overview (overwind.bin 640x480) & Puzzle Map (viewpuzl.bmp 640x480) */
.dos-overview-dialog,.dos-puzzle-dialog{width:640px!important;min-width:640px!important;height:480px!important;padding:0!important;border:0!important;overflow:hidden!important;background:#080807!important;box-shadow:0 12px 36px #000}
.dos-overview-stage,.dos-puzzle-stage{position:relative;width:640px;height:480px;display:flex}
.dos-overview-banner{width:96px;height:480px;flex-shrink:0;background-size:96px 480px}
.dos-overview-main{position:relative;width:544px;height:480px;flex-shrink:0;background-size:544px 480px;padding:10px 16px 56px;box-sizing:border-box;display:flex;flex-direction:column;gap:8px}
.dos-overview-header{font:bold 14px Georgia,serif;color:#ffe9a8;text-align:center;text-shadow:1px 1px 1px #000;line-height:22px}
.dos-overview-section{background:rgba(20,15,9,0.78);border:1px solid #967234;padding:6px 8px}
.dos-overview-sec-title{font:bold 12px Georgia,serif;color:#ffe49e;margin-bottom:4px;border-bottom:1px solid #6e5223;padding-bottom:2px}
.dos-overview-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(145px,1fr));gap:6px;max-height:106px;overflow-y:auto}
.dos-overview-card{display:flex;align-items:center;gap:6px;background:#2b2113;border:1px solid #a8823e;padding:4px 6px;color:#ffeab8;cursor:pointer;text-align:left;font:11px Georgia,serif}
.dos-overview-card:hover{filter:brightness(1.18)}
.dos-overview-card strong{display:block;font-size:11px;color:#fff4cc}
.dos-overview-card small{display:block;font-size:10px;color:#d8c08e}
.dos-overview-resources{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;text-align:center}
.dos-overview-res{display:flex;flex-direction:column;align-items:center;gap:2px;background:#231a0f;border:1px solid #7d602c;padding:4px 2px;font-size:11px}
.dos-overview-res small{font-size:9px;color:#d9c291}
.dos-overview-puzzle-btn{position:absolute!important;left:16px;bottom:14px;font-size:11px!important;padding:4px 8px!important}
.dos-overview-gold-total{position:absolute;left:172px;bottom:8px;width:201px;height:46px;background-size:201px 46px;background-repeat:no-repeat;display:flex;flex-direction:column;align-items:center;justify-content:center;font:bold 11px Georgia,serif;color:#ffe9a6;text-shadow:1px 1px 1px #000}
.dos-overview-gold-total strong{font-size:14px;color:#fff4c8}
.dos-overview-exit{position:absolute!important;right:12px;bottom:10px}

/* Puzzle Map Sidebar (480, 176, 144x288) */
.dos-puzzle-sidebar{
  position:absolute;
  left:480px;
  top:176px;
  width:144px;
  height:288px;
  background:rgba(20,15,9,0.92);
  border:1px solid #967234;
  padding:8px;
  box-sizing:border-box;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  text-align:center;
  font-size:11px;
}
.dos-puzzle-title{font:bold 13px Georgia,serif;color:#ffe8a3}
.dos-worldview-list{width:100%;max-height:140px;overflow-y:auto;text-align:left;font-size:10px;display:flex;flex-direction:column;gap:2px}
.dos-worldview-item{border-bottom:1px solid rgba(150,115,52,0.3);padding:1px 0}

/* Hero Screen (herowind.bin 640x480) */
.original-chrome .original-hero{outline:0!important;position:fixed;padding:0;width:640px;height:480px;max-width:none;max-height:none;border:0;border-radius:0;background-size:640px 480px;color:#ffdc91;zoom:var(--game-zoom,1);overflow:hidden}
.hero-title{position:absolute;left:50px;top:73px;width:540px;text-align:center;font:bold 14px Georgia,serif;text-shadow:1px 1px 1px #000}
.hero-portrait{position:absolute;left:49px;top:101px;width:101px;height:93px}
.hero-crest-box{position:absolute!important;left:49px;top:200px;width:101px;height:93px;display:flex;align-items:center;justify-content:center}
.hero-crest-box:hover{filter:brightness(1.12)}
.hero-stat{position:absolute;top:101px;width:82px;height:93px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding-bottom:6px;box-sizing:border-box;font:12px Georgia,serif}
.hero-stat canvas{position:absolute;inset:0;width:82px;height:93px;z-index:0}
.hero-stat span,.hero-stat strong{position:relative;z-index:1;text-shadow:1px 1px 1px #000}
.hero-stat span{display:none}
.hero-stat strong{font:bold 10px Tahoma,Verdana,monospace;color:#fff4c8}
/* 5th Panel at (508, 101): Morale (top), Luck (middle), Experience (bottom) as in herowind.bin */
.hero-fifth-panel{position:absolute;left:508px;top:101px;width:82px;height:93px;background-size:82px 93px;background-repeat:no-repeat;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:3px 4px;box-sizing:border-box}
.hero-fifth-row{width:100%;height:26px;display:flex;align-items:center;justify-content:center;cursor:pointer}
.hero-fifth-row:hover,.hero-fifth-exp:hover{filter:brightness(1.2)}
.hero-fifth-exp{width:100%;height:32px;display:flex;align-items:center;justify-content:space-between;padding:0 2px;box-sizing:border-box;cursor:pointer}
.hero-fifth-exp strong{font:bold 12px Georgia,serif;color:#fff4c8;text-shadow:1px 1px 1px #000;margin-left:auto;margin-right:auto}
.hero-artifact{position:absolute;width:76px;height:76px;background-size:76px 76px;display:flex;align-items:center;justify-content:center}
.hero-artifact canvas{max-width:64px;max-height:64px;object-fit:contain}
.hero-bottom-bar{position:absolute;left:0;top:460px;width:640px;height:20px;background-size:640px 20px!important;background-repeat:no-repeat!important;display:flex;align-items:center;justify-content:center;font:bold 11px Georgia,serif;color:#ffe8a8;text-shadow:1px 1px 1px #000;padding:0 18px;box-sizing:border-box}

/* Hero-to-Hero Swap Window (swapwin.bmp 448x448) */
.dos-swap-dialog{width:448px!important;min-width:448px!important;height:448px!important;padding:12px!important;border:2px ridge #b58d3d!important;overflow:hidden!important;background-size:448px 448px!important}
.dos-swap-stage{position:relative;width:100%;height:100%;display:flex;flex-direction:column;gap:6px;background:rgba(18,13,8,0.82);padding:10px;box-sizing:border-box}
.dos-swap-title{text-align:center;font:bold 14px Georgia,serif;color:#ffe8a3}
.dos-swap-port{position:absolute;top:28px;width:72px;height:66px;cursor:pointer;border:1px solid #b58d3d}
.dos-swap-port.left{left:14px}
.dos-swap-port.right{right:14px}
.dos-swap-stats{margin:4px 96px;display:flex;flex-direction:column;gap:2px;font-size:11px;background:#22190e;border:1px solid #86652d;padding:4px 10px}
.dos-swap-stat-row{display:flex;justify-content:space-between}
.dos-swap-armies{display:flex;flex-direction:column;gap:6px;margin-top:6px}
.dos-swap-row-label{font:bold 11px Georgia,serif;color:#ffe49c;margin-bottom:2px}
.dos-swap-slots{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.dos-swap-slot{height:58px;background:#2b2012;border:1px solid #9e7837;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;color:#fff2c6;position:relative}
.dos-swap-slot.selected{outline:2px solid #ffd86b;background:#4a361a}
.dos-swap-slot strong{font-size:11px}
.dos-swap-arts{display:flex;flex-direction:column;gap:4px;margin-top:4px}
.dos-swap-art-list{display:flex;flex-wrap:wrap;gap:4px;min-height:36px;background:#1d150c;border:1px solid #755827;padding:3px}
.dos-swap-art-btn{width:34px;height:34px;padding:0;background:#2d2214;border:1px solid #a8823e;cursor:pointer;display:flex;align-items:center;justify-content:center}
.dos-swap-close{align-self:center;margin-top:auto}

/* Combat General Dialog (vgenwin.bin 250x202) */
.dos-vgen-dialog{width:250px!important;min-width:250px!important;height:202px!important;padding:0!important;border:0!important;overflow:hidden!important;background:transparent!important;box-shadow:0 10px 30px #000}
.dos-vgen-stage{position:relative;width:250px;height:202px;background-size:250px 202px;background-repeat:no-repeat}
.dos-vgen-title{position:absolute;left:8px;top:12px;width:234px;text-align:center;font:bold 12px Georgia,serif;color:#ffe9a8;text-shadow:1px 1px 1px #000}
.dos-vgen-port{position:absolute;left:11px;top:42px;width:101px;height:93px}
.dos-vgen-crest{position:absolute;left:133px;top:36px;width:111px;height:105px;background-size:111px 105px;display:flex;flex-direction:column;align-items:center;justify-content:center;font:10px/1.12 Georgia,serif;color:#fff4c8;text-shadow:1px 1px 1px #000;gap:0;padding:4px 6px;box-sizing:border-box}

/* Combat Options Dialog (apanel.bin 322x236) */
.dos-apanel-dialog{width:322px!important;min-width:322px!important;height:236px!important;padding:0!important;border:0!important;overflow:hidden!important;background-size:322px 236px!important;box-shadow:0 10px 30px #000}
.dos-apanel-stage{position:relative;width:322px;height:236px}

/* Surrender Dialog (surrendr.bin 470x205) */
.dos-surrender-dialog{width:470px!important;min-width:470px!important;height:205px!important;padding:0!important;border:0!important;overflow:hidden!important;background-size:470px 205px!important;box-shadow:0 10px 30px #000}
.dos-surrender-stage{position:relative;width:470px;height:205px}
.dos-surrender-frame{position:absolute;left:39px;top:32px;width:111px;height:105px;background-size:111px 105px;display:flex;align-items:center;justify-content:center}
.dos-surrender-port{width:101px;height:93px}
.dos-surrender-text{position:absolute;left:165px;top:34px;width:280px;height:105px;font:bold 12px/1.4 Georgia,serif;color:#fff2c6;text-shadow:1px 1px 1px #000;white-space:pre-line;display:flex;align-items:center}

/* High Scores (hiscore.bmp 640x480) */
.dos-hiscore-dialog{width:640px!important;min-width:640px!important;height:480px!important;padding:0!important;border:0!important;overflow:hidden!important;background-size:640px 480px!important}
.dos-hiscore-stage{position:relative;width:640px;height:480px;padding:36px 70px;box-sizing:border-box}
.dos-hiscore-title{text-align:center;font:bold 18px Georgia,serif;color:#ffe9a8;text-shadow:2px 2px 2px #000;margin-bottom:16px}
.dos-hiscore-list{display:flex;flex-direction:column;gap:8px;background:rgba(20,14,8,0.75);border:2px ridge #ad873b;padding:14px}
.dos-hiscore-row{display:flex;align-items:center;gap:12px;border-bottom:1px solid rgba(170,130,60,0.4);padding-bottom:6px;font-size:14px;color:#fff0c4}
.dos-hiscore-row span{margin-left:auto;color:#e0c890;font-size:13px}
.dos-hiscore-row b{min-width:80px;text-align:right;color:#ffd86b}
.dos-hiscore-exit{position:absolute!important;right:24px;bottom:20px}

.dos-credits-dialog{width:640px!important;min-width:640px!important;height:480px!important;padding:0!important;border:0!important;overflow:hidden!important}

/* Shared Grid Info */
.original-chrome .game-info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(125px,1fr));gap:8px;width:100%}
.original-chrome .game-info-item{background:rgba(32,20,46,0.75);border:1px solid #c49c48;padding:8px;display:flex;align-items:center;flex-direction:column;text-align:center;gap:4px;min-height:88px}
.original-chrome .game-info-item:hover{filter:brightness(1.15)}
.original-chrome .game-info-item canvas{max-height:58px;max-width:100%;object-fit:contain}
.original-chrome .game-info-item strong{color:#ffebbb;font-size:12px}
.original-chrome .game-info-item small{color:#edd5a3;font-size:10px}
.original-chrome .kingdom-list{width:100%;display:flex;flex-direction:column;gap:6px}
.original-chrome .kingdom-row{display:flex;align-items:center;gap:10px;border-bottom:1px solid rgba(200,160,80,0.4);padding:4px;min-width:0;font-size:12px}
.original-chrome .kingdom-row canvas{flex-shrink:0;max-height:36px;object-fit:contain}
.original-chrome .chapter-title{width:100%;font:bold 15px Georgia,serif;color:#ffe6a8;border-bottom:1px solid #ac8044;padding-bottom:4px;text-align:center}

/* Original DOS Event Modal (evntwin0.bin / evntwin1.bin using buybuild.icn & system.icn) */
.original-chrome #eventModal{outline:0!important;
  width:286px!important;
  min-width:286px!important;
  max-width:286px!important;
  padding:38px 24px 22px!important;
  border:0!important;
  border-radius:0!important;
  background-color:transparent!important;
  background-size:100% 100%!important;
  background-repeat:no-repeat!important;
  box-shadow:0 14px 38px rgba(0,0,0,0.85)!important;
  font:13px Georgia,serif;
  color:#fff0c4;
  text-align:center;
  zoom:var(--game-zoom,1);
}
.original-chrome #eventModal #eventTitle{
  margin:0 0 8px 0!important;
  padding:0!important;
  border:0!important;
  font:bold 14px Georgia,serif!important;
  color:#ffe8a3!important;
  text-shadow:1px 1px 1px #000!important;
  text-align:center!important;
}
.original-chrome #eventModal .event-body{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  gap:8px!important;
  margin:0!important;
  padding:0!important;
  background:none!important;
  border:0!important;
}
.original-chrome #eventModal #eventIcon{
  min-width:0!important;
  min-height:0!important;
  width:auto!important;
  height:auto!important;
  padding:2px!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  overflow:visible!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}
.original-chrome #eventModal #eventIcon img,
.original-chrome #eventModal #eventIcon canvas{
  transform:none!important;
  image-rendering:auto!important;
  width:auto!important;
  height:auto!important;
  max-width:223px!important;
  max-height:125px!important;
  object-fit:contain!important;
}
#tacticsSandbox #tacticsBoard .creature-sprite.wide-right-edge{
  left:calc(50% - 34px)!important;
}
.original-chrome #eventModal .event-desc{
  color:#fff0c8!important;
  font:12px/1.4 Georgia,serif!important;
  white-space:pre-line!important;
  text-align:center!important;
  text-shadow:1px 1px 1px #000!important;
  margin:0!important;
}
.original-chrome #eventModal #eventActions{
  display:flex!important;
  justify-content:center!important;
  align-items:center!important;
  gap:12px!important;
  margin-top:12px!important;
  padding:0!important;
  border:0!important;
}
.battle-result-art{max-width:223px;max-height:125px;height:auto;image-rendering:auto;border:1px solid #5a421c}

/* Debug mode */
.chrome-debug #mapPane>aside{display:block!important;position:fixed;left:0;top:0;width:300px;height:90vh;overflow:auto;z-index:110;background:#171a17}
.chrome-debug>.bar{display:flex!important;position:relative;z-index:120}

/* Authentic DOS Open Leather Spellbook (spellwin.bin: 348x242 two-page book.icn) */
.dos-spellbook-open{
  width:348px!important;
  min-width:348px!important;
  height:242px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
  z-index:auto!important;
}
.dos-book-stage{
  position:relative;
  width:348px;
  height:242px;
  background-repeat:no-repeat;
  background-size:348px 242px;
  filter:drop-shadow(0 12px 28px rgba(0,0,0,0.88));
}
.dos-book-page-hdr{
  position:absolute;
  top:12px;
  width:118px;
  text-align:center;
  font:bold 10px Georgia,serif;
  color:#3a220b;
  text-shadow:0 1px 0 rgba(255,245,215,0.65);
  pointer-events:none;
}
.dos-book-page-hdr.left{left:34px}
.dos-book-page-hdr.right{left:176px}
.dos-book-prev{position:absolute!important;left:11px;top:12px;z-index:4}
.dos-book-next{position:absolute!important;left:292px;top:12px;z-index:4}
.dos-book-empty{
  position:absolute;
  left:24px;
  top:64px;
  width:130px;
  text-align:center;
  font:11px/1.35 Georgia,serif;
  color:#3d240c;
  white-space:pre-line;
}
.dos-book-spell{
  position:absolute;
  width:136px;
  height:68px;
  min-height:0!important;
  padding:2px 4px!important;
  margin:0;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:1px!important;
  cursor:pointer;
  box-sizing:border-box;
}
.dos-book-spell:hover{
  background:transparent!important;
  border:0!important;
  filter:brightness(1.16) drop-shadow(0 0 3px rgba(255,215,90,0.75))!important;
}
.dos-book-spell.is-disabled{
  opacity:0.55;
}
.dos-book-spell canvas{
  max-height:32px!important;
  max-width:44px!important;
  object-fit:contain;
  pointer-events:none;
}
.dos-book-spell strong{
  font:bold 10px Georgia,serif!important;
  color:#2b1705!important;
  text-shadow:0 1px 0 rgba(255,248,225,0.7)!important;
  line-height:1.1;
}
.dos-book-spell small{
  font:9px/1.1 Georgia,serif!important;
  color:#4c2e10!important;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.dos-book-tab-combat{position:absolute!important;left:190px;top:167px;z-index:3}
.dos-book-tab-adv{position:absolute!important;left:218px;top:153px;z-index:3}
.dos-book-tab-close{position:absolute!important;left:270px;top:172px;z-index:3}
.dos-book-tab-combat.active,.dos-book-tab-adv.active{filter:brightness(1.2) drop-shadow(0 0 4px #ffd86b)}

/* =============================================================
   Original DOS Combat Screen (cmbtwin.bin 640x480:
   640x460 Arena + 640x20 textbar.icn Bottom Status Bar)
   ============================================================= */
.original-chrome>#tacticsSandbox:not(.tactics-fullscreen){display:none!important}
.original-chrome>#tacticsSandbox.tactics-fullscreen{
  zoom:1;
  position:fixed!important;
  inset:0!important;
  z-index:99999!important;
  width:100vw!important;
  height:100vh!important;
  max-width:100vw!important;
  max-height:100vh!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:#000!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
  box-shadow:none!important;
}
#tacticsSandbox.tactics-fullscreen>summary,
#tacticsSandbox.tactics-fullscreen>label,
#tacticsSandbox.tactics-fullscreen>p,
#tacticsSandbox.tactics-fullscreen>button:not(.combat-btn),
#tacticsSandbox.tactics-fullscreen #tacticsWorldContext,
#tacticsSandbox.tactics-fullscreen #tacticsReset,
#tacticsSandbox.tactics-fullscreen #tacticsSave,
#tacticsSandbox.tactics-fullscreen .file,
#tacticsSandbox.tactics-fullscreen #tacticsLog,
#tacticsSandbox.tactics-fullscreen #tacticsTurn{
  display:none!important;
}
.combat-stage{
  width:640px!important;
  height:480px!important;
  flex:0 0 480px!important;
  position:relative!important;
  display:flex!important;
  flex-direction:column!important;
  transform:scale(var(--combat-scale-x, var(--combat-scale, 1)), var(--combat-scale-y, var(--combat-scale, 1)))!important;
  transform-origin:center center!important;
  image-rendering:auto!important;
  box-shadow:none!important;
  background:#000!important;
  overflow:hidden!important;
}
.combat-stage #tacticsBoard,
#tacticsSandbox.tactics-fullscreen #tacticsBoard{
  width:640px!important;
  height:460px!important;
  min-height:460px!important;
  max-height:460px!important;
  flex:0 0 460px!important;
  margin:0!important;
  padding:0!important;
  box-sizing:border-box!important;
  position:relative!important;
  display:block!important;
  background-image:var(--original-battle-background)!important;
  background-size:640px 460px!important;
  background-repeat:no-repeat!important;
  background-position:0 0!important;
  border:0!important;
  box-shadow:none!important;
  overflow:hidden!important;
}

/* Staggered 7x5 Pointy-Top Hex Cells on the 640x460 Arena */
#tacticsSandbox #tacticsBoard .tactic-cell,
#tacticsSandbox.tactics-fullscreen #tacticsBoard .tactic-cell,
.combat-stage .tactic-cell{
  position:absolute!important;
  width:78px!important;
  height:98px!important;
  min-width:78px!important;
  min-height:98px!important;
  max-width:78px!important;
  max-height:98px!important;
  aspect-ratio:auto!important;
  transform:none!important;
  clip-path:none!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  overflow:visible!important;
}
/* Remove non-original HTML "ХОД" badge and yellow floor hex on active stack (active unit now uses authentic .std[0] yellow pixel contour!) */
#tacticsSandbox .tactic-cell.active-stack::after,
.combat-stage .tactic-cell.active-stack::after,
#tacticsBoard .tactic-cell.active-stack::before{
  content:none!important;
  display:none!important;
}
#tacticsBoard.show-grid .tactic-cell::before{
  content:''!important;
  display:block!important;
  position:absolute;
  inset:6px 2px;
  clip-path:polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
  border:1px solid rgba(235,215,145,0.22);
  background:rgba(0,0,0,0.04);
  pointer-events:none;
  z-index:3;
}
#tacticsBoard .tactic-cell.reachable::before{
  content:''!important;
  display:block!important;
  position:absolute;
  inset:6px 2px;
  clip-path:polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
  background:rgba(30,50,18,0.24);
  border:1px solid rgba(190,235,120,0.38);
  pointer-events:none;
  z-index:3;
}
#tacticsBoard .tactic-cell.spell-target-hex::before{
  content:''!important;
  display:block!important;
  position:absolute;
  inset:6px 2px;
  clip-path:polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
  background:rgba(255,215,64,0.22);
  border:1px solid rgba(255,235,90,0.75);
  pointer-events:none;
  z-index:4;
}
#tacticsBoard .tactic-cell.spell-target-ally::before{
  background:rgba(64,210,110,0.22)!important;
  border:1px solid rgba(110,255,150,0.8)!important;
}
#tacticsBoard .tactic-cell.spell-target-enemy::before{
  background:rgba(225,60,45,0.22)!important;
  border:1px solid rgba(255,110,85,0.8)!important;
}
#tacticsBoard .tactic-cell.spell-target-teleport::before{
  background:rgba(70,185,255,0.22)!important;
  border:1px solid rgba(120,220,255,0.85)!important;
}
#tacticsBoard .tactic-cell.spell-hover-ally::before{
  content:''!important;
  display:block!important;
  position:absolute;
  inset:4px 0;
  clip-path:polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
  background:rgba(75,245,130,0.42)!important;
  border:2px solid #7bff9e!important;
  box-shadow:inset 0 0 12px #52ff88!important;
  pointer-events:none;
  z-index:5;
}
#tacticsBoard .tactic-cell.spell-hover-ally .creature-sprite{
  filter:drop-shadow(0 -2px 0 #66ff99) drop-shadow(0 2px 0 #66ff99) drop-shadow(-2px 0 0 #66ff99) drop-shadow(2px 0 0 #66ff99) drop-shadow(0 0 8px #ffd966) brightness(1.18)!important;
}
#tacticsBoard .tactic-cell.spell-hover-enemy::before{
  content:''!important;
  display:block!important;
  position:absolute;
  inset:4px 0;
  clip-path:polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
  background:rgba(255,64,40,0.45)!important;
  border:2px solid #ff5c42!important;
  box-shadow:inset 0 0 12px #ff3b1f!important;
  pointer-events:none;
  z-index:5;
}
#tacticsBoard .tactic-cell.spell-hover-enemy .creature-sprite{
  filter:drop-shadow(0 -2px 0 #ff4422) drop-shadow(0 2px 0 #ff4422) drop-shadow(-2px 0 0 #ff4422) drop-shadow(2px 0 0 #ff4422) drop-shadow(0 0 8px #ff8800) brightness(1.18)!important;
}
#tacticsBoard .tactic-cell.spell-hover-teleport::before{
  content:''!important;
  display:block!important;
  position:absolute;
  inset:4px 0;
  clip-path:polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
  background:rgba(70,210,255,0.42)!important;
  border:2px solid #7ae1ff!important;
  box-shadow:inset 0 0 12px #42c8ff!important;
  pointer-events:none;
  z-index:5;
}
#tacticsBoard .tactic-cell.spell-hover-teleport .creature-sprite{
  filter:drop-shadow(0 -2px 0 #55ddff) drop-shadow(0 2px 0 #55ddff) drop-shadow(-2px 0 0 #55ddff) drop-shadow(2px 0 0 #55ddff) drop-shadow(0 0 8px #88eeff) brightness(1.18)!important;
}
#tacticsBoard .tactic-cell:hover::before{
  background:rgba(255,235,150,0.2)!important;
}

/* Native pixel size for terrain obstacles (trees, rocks, boulders) */
.combat-stage .terrain-prop{
  position:absolute!important;
  left:50%!important;
  bottom:14px!important;
  transform:translateX(-50%)!important;
  image-rendering:auto!important;
  pointer-events:none!important;
  z-index:11!important;
}

/* Hide debug A/B side markers in original DOS mode */
.combat-stage .side-mark{
  display:none!important;
}

/* Original DOS Stack Count Badge (textbar.icn frame 5: 20x11) */
#tacticsSandbox #tacticsBoard .stack-count,
.combat-stage #tacticsBoard .stack-count,
.combat-stage .stack-count{
  position:absolute!important;
  bottom:3px!important;
  right:4px!important;
  left:auto!important;
  top:auto!important;
  min-width:21px!important;
  height:11px!important;
  line-height:10px!important;
  padding:0 2px!important;
  box-sizing:border-box!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  background-color:#2c1d4a!important;
  background-size:100% 100%!important;
  background-repeat:no-repeat!important;
  border:1px solid #c9a759!important;
  border-radius:0!important;
  font:bold 8px/10px Tahoma,Verdana,monospace!important;
  letter-spacing:-0.2px!important;
  color:#fff6d6!important;
  text-shadow:1px 1px 0 #000!important;
  text-align:center!important;
  white-space:nowrap!important;
  z-index:45!important;
  pointer-events:none!important;
  box-shadow:0 1px 2px #000!important;
}
#tacticsSandbox #tacticsBoard .stack-count.stack-right,
.combat-stage .stack-count.stack-right{
  right:4px!important;
  left:auto!important;
}

/* Generals / Tents and Catapult on Battlefield */
.battle-general{
  position:absolute!important;
  background:transparent!important;
  border:0!important;
  padding:0!important;
  margin:0!important;
  cursor:pointer!important;
  z-index:10!important;
}
.battle-general:hover{
  filter:brightness(1.15);
}
.battle-general.left-general{
  left:4px!important;
  top:84px!important;
  width:70px!important;
  height:120px!important;
}
.battle-general.right-keep-general{
  right:0!important;
  top:0!important;
  width:90px!important;
  height:145px!important;
}
.battle-general-flag{
  position:absolute;
  left:26px;
  top:2px;
  pointer-events:none;
}
.battle-general.right-general{
  right:4px!important;
  top:34px!important;
  width:33px!important;
  height:104px!important;
}
.battle-catapult{
  position:absolute!important;
  left:4px!important;
  bottom:10px!important;
  width:145px!important;
  height:110px!important;
  pointer-events:none!important;
  z-index:22!important;
}

/* Active Spell Effect Badges on Combat Units */
.unit-spell-badges{
  position:absolute!important;
  top:4px!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:center!important;
  gap:2px!important;
  z-index:46!important;
  pointer-events:auto!important;
}
.unit-spell-badge{
  display:inline-flex!important;
  align-items:center!important;
  gap:1px!important;
  height:14px!important;
  padding:0 2px!important;
  background:rgba(16,12,8,0.88)!important;
  border-radius:2px!important;
  font:bold 8px Tahoma,Verdana,sans-serif!important;
  color:#fff6d6!important;
  line-height:12px!important;
  box-shadow:0 1px 3px #000!important;
}
.unit-spell-badge.is-buff{
  border:1px solid #52ff88!important;
  color:#a8ffbe!important;
}
.unit-spell-badge.is-debuff{
  border:1px solid #ff5c42!important;
  color:#ffb3a6!important;
}
.unit-spell-badge img{
  width:12px!important;
  height:12px!important;
  object-fit:contain!important;
  image-rendering:auto!important;
  pointer-events:none!important;
}
.unit-spell-badge b{
  font:bold 8px Tahoma,Verdana,sans-serif!important;
  text-shadow:1px 1px 0 #000!important;
}

/* Original DOS 640x20 Bottom Combat Bar (cmbtwin.bin + textbar.icn) */
.combat-panel{
  width:640px!important;
  height:20px!important;
  flex:0 0 20px!important;
  position:relative!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  margin:0!important;
  padding:0!important;
  background:#241c10!important;
  border:0!important;
  box-sizing:border-box!important;
  z-index:40!important;
}
.dos-combat-bar-btn{
  width:48px!important;
  height:20px!important;
  flex:0 0 48px!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  background-color:#3a2b16!important;
  background-size:48px 20px!important;
  background-repeat:no-repeat!important;
  cursor:pointer!important;
  box-shadow:none!important;
}
.dos-combat-bar-btn:disabled{
  filter:brightness(.55);
  cursor:default;
}
.combat-stage #tacticsStatus,
#tacticsSandbox.tactics-fullscreen #tacticsStatus{
  width:544px!important;
  height:20px!important;
  min-height:20px!important;
  max-height:20px!important;
  flex:0 0 544px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  line-height:20px!important;
  margin:0!important;
  padding:0 10px!important;
  box-sizing:border-box!important;
  font:bold 10px Georgia,serif!important;
  color:#fff2c6!important;
  text-shadow:1px 1px 1px #000!important;
  background-color:#2b2112!important;
  background-size:544px 20px!important;
  background-repeat:no-repeat!important;
  border:0!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  text-align:center!important;
}

/* Hide legacy HTML combat button bar from visual display while keeping DOM buttons accessible for hotkeys/tests */
#tacticsSandbox .combat-stage .tactics-actions,
.combat-stage .tactics-actions{
  position:fixed!important;
  left:-9999px!important;
  top:-9999px!important;
  width:1px!important;
  height:1px!important;
  opacity:0!important;
  pointer-events:none!important;
  overflow:hidden!important;
}

.battle-projectile{position:absolute;z-index:80;width:28px;height:3px;background:#eed9a0;pointer-events:none;transition:left .35s linear,top .35s linear;transform-origin:center}
.battle-projectile:after{content:"";position:absolute;right:-4px;top:-3px;border-left:7px solid #dedddd;border-top:4px solid transparent;border-bottom:4px solid transparent}
img.battle-projectile,canvas.battle-projectile{background:none!important;border:0!important;max-width:none!important;image-rendering:auto!important;filter:drop-shadow(0 3px 4px rgba(0,0,0,0.55));}
img.battle-projectile:after,canvas.battle-projectile:after{display:none!important;content:none!important;}
#tacticsSandbox .siege-wall,#tacticsSandbox .siege-underlay-canvas{image-rendering:auto}

/* Authentic DOS 1-bit Bitmap Number Rendering (font.icn 8x9 & smalfont.icn 4x7) */
.dos-bitmap-num{
  color:transparent!important;
  text-shadow:none!important;
  font-size:9px!important;
  line-height:1!important;
  image-rendering:auto!important;
  user-select:none;
}
.dos-puzzle-exit{
  margin-top:auto!important;
  align-self:center!important;
}

.dos-apanel-lbl{
  font:bold 10px Georgia,serif;
  color:#ffe9a8;
  text-align:center;
  text-shadow:1px 1px 1px #000;
  pointer-events:none;
  white-space:nowrap;
}
.original-chrome #eventModal #eventIcon canvas{
  image-rendering:auto!important;
  width:auto!important;
  height:auto!important;
  max-width:223px!important;
  max-height:125px!important;
  object-fit:contain!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
}

/* Enemy Turn Hourglass + Active AI Player Crest in Resource Area (hourglas.icn + brcrest.icn) */
.dos-enemy-hourglass{
  position:relative;
  width:144px;
  height:66px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  pointer-events:none;
}
.dos-enemy-hourglass canvas{
  display:block;
  width:144px;
  height:66px;
}
.dos-enemy-hourglass-lbl{
  position:absolute;
  left:0;
  bottom:1px;
  width:144px;
  text-align:center;
  font:bold 10px Georgia,serif;
  color:#ffe9a6;
  text-shadow:1px 1px 1px #000,-1px -1px 1px #000;
}

/* Authentic DOS Adventure Map Quick-Info Hover Miniature (qwikhero.bmp, qwiktown.bmp, qwikinfo.bmp) */
.dos-map-quick-preview{
  position:absolute;
  z-index:95;
  pointer-events:none;
  filter:drop-shadow(0 8px 18px rgba(0,0,0,0.88));
}
.dos-qwik-card{
  box-sizing:border-box;
  background-repeat:no-repeat;
  background-size:100% 100%;
  padding:12px 12px 10px;
  color:#2b1806;
  font:10px/1.2 Georgia,serif;
  display:flex;
  flex-direction:column;
  gap:5px;
}
.dos-qwik-hero{width:224px;height:174px;padding:12px 12px 10px}
.dos-qwik-town{width:224px;height:176px;padding:12px 12px 10px}
.dos-qwik-monster{width:162px;height:86px;justify-content:center;padding:10px 12px}
.dos-qwik-title{
  font:bold 11px Georgia,serif;
  color:#2b1705;
  text-shadow:0 1px 0 rgba(255,245,215,0.75);
  text-align:center;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.dos-qwik-top{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
}
.dos-qwik-stats{
  font:bold 9.5px/1.25 Georgia,serif;
  color:#382008;
  white-space:pre-line;
}
.dos-qwik-army{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:2px;
  align-items:end;
  justify-items:center;
  margin-top:auto;
  width:100%;
  min-height:66px;
  box-sizing:border-box;
  background:rgba(45,28,10,0.14);
  border:1px solid rgba(90,58,20,0.38);
  padding:3px 2px;
  overflow:hidden;
}
.dos-qwik-slot{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-end;
  width:100%;
  min-width:0;
  min-height:58px;
  text-align:center;
  overflow:hidden;
}
.dos-qwik-slot canvas{
  flex:0 0 auto;
  width:auto!important;
  height:auto!important;
  max-width:34px!important;
  max-height:31px!important;
  object-fit:contain!important;
  image-rendering:auto;
}
.dos-qwik-count{
  font:bold 10px Tahoma,Verdana,sans-serif;
  color:#fff4c8;
  background:#2a1b0dcc;
  padding:0 3px;
  border-radius:2px;
  line-height:11px;
  margin-top:1px;
  text-shadow:1px 1px 0 #000;
}
.dos-qwik-band{
  font:8.5px Georgia,serif;
  color:#2b1705;
  line-height:10px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:36px;
}
.dos-qwik-empty{
  grid-column:1 / -1;
  align-self:center;
  font:italic 10px Georgia,serif;
  color:#4a2d10;
  text-align:center;
}
.dos-qwik-mon-row{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
}
.dos-qwik-mon-info{
  display:flex;
  flex-direction:column;
  gap:2px;
  text-align:left;
}
.dos-qwik-mon-info strong{
  font:bold 11px Georgia,serif;
  color:#2b1705;
}
.dos-qwik-mon-info span{
  font:bold 10px Georgia,serif;
  color:#4e2e0e;
}

/* Ensure .tactic-cell never creates an isolated stacking context or extra odd-row shift,
   so .creature-sprite (z-index 12..26) layers above .battle-general (z-index 10)
   while .stack-count (z-index 60) and .unit-spell-badges (z-index 62) stay above all sprites! */
#tacticsSandbox #tacticsBoard .tactic-cell,
#tacticsSandbox #tacticsBoard .tactic-cell.odd-row,
#tacticsSandbox #tacticsBoard .tactic-cell.even-row,
.combat-stage #tacticsBoard .tactic-cell{
  transform:none!important;
}
#tacticsSandbox #tacticsBoard .creature-sprite,
.combat-stage #tacticsBoard .creature-sprite{
  bottom:14px!important;
}
#tacticsSandbox #tacticsBoard .stack-count,
.combat-stage #tacticsBoard .stack-count,
.combat-stage .stack-count{
  z-index:60!important;
}
#tacticsSandbox #tacticsBoard .unit-spell-badges,
.combat-stage #tacticsBoard .unit-spell-badges{
  z-index:62!important;
}


/* ============================================================================
 * v60.0: 3x ULTRA-HD REMASTER & UNSTRETCHED 16:9 WIDESCREEN COMBAT OVERRIDES
 * ============================================================================ */
.original-chrome canvas,
.original-chrome img,
.original-chrome .stage-frame,
.original-chrome .town-scene,
.army-slot canvas,
#tacticsSandbox #tacticsBoard .creature-sprite,
.combat-stage #tacticsBoard .creature-sprite,
.battle-general img,
.terrain-prop {
  image-rendering: auto !important;
}

.combat-stage {
  width: var(--combat-stage-w, 854px) !important;
  height: 480px !important;
  flex: 0 0 480px !important;
  transform: scale(var(--combat-scale, 1)) !important;
  transform-origin: center center !important;
}

.combat-stage #tacticsBoard,
#tacticsSandbox.tactics-fullscreen #tacticsBoard {
  width: var(--combat-stage-w, 854px) !important;
  height: 460px !important;
  min-height: 460px !important;
  max-height: 460px !important;
  flex: 0 0 460px !important;
  background-image: var(--original-battle-background) !important;
  background-size: cover !important;
  background-position: center bottom !important;
  background-repeat: no-repeat !important;
}

.combat-panel {
  width: var(--combat-stage-w, 854px) !important;
  height: 20px !important;
  flex: 0 0 20px !important;
}

.combat-stage #tacticsStatus,
#tacticsSandbox.tactics-fullscreen #tacticsStatus {
  width: var(--combat-status-w, 758px) !important;
  flex: 1 1 auto !important;
  background-size: 100% 20px !important;
}

.battle-general.left-general {
  left: 6px !important;
  top: 56px !important;
  width: 102px !important;
  height: 176px !important;
}
.battle-general.left-general img,
.battle-general.right-general img {
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: contain !important;
}

.battle-general.right-general {
  right: 14px !important;
  top: 52px !important;
  width: 36px !important;
  height: 112px !important;
}

.battle-general.left-general {
  left: 6px !important;
  top: 56px !important;
  width: 102px !important;
  height: 176px !important;
}
.battle-general.left-general img,
.battle-general.right-general img {
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: contain !important;
}


/* ============================================================================
 * v62.0 COMPLETE UI, NUMBER VISIBILITY, DOOR CENTERING & BATTLE TENT OVERRIDES
 * ============================================================================ */
.main-menu-controls {
  left: 441px !important;
  right: auto !important;
  top: 108px !important;
  gap: 10px !important;
}

.dos-bitmap-num,
.army-slot strong,
.town-treasury-item span,
.town-treasury-item strong,
.ressmall-top-val,
.ressmall-sec-val,
.dos-recruit-res span,
.dos-recruit-res strong {
  color: #fff4c8 !important;
  font-family: Tahoma, Verdana, sans-serif !important;
  font-weight: 800 !important;
  text-shadow: 0 1px 2px #000, 1px 0 1px #000, -1px 0 1px #000, 0 -1px 1px #000 !important;
  background-image: none !important;
}

.battle-general.left-general {
  left: 14px !important;
  top: 82px !important;
  width: 92px !important;
  height: 158px !important;
}

.dos-overview-dialog {
  background: transparent !important;
  box-shadow: none !important;
}


/* === v63 CONCEPT UI & HIGH-CONTRAST DIALOG OVERHAUL === */
.concept-top-resource-strip {
  position: absolute;
  left: 20px;
  top: 1px;
  width: 396px;
  height: 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 6px;
  pointer-events: none;
  z-index: 15;
}
.concept-top-res-item {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font: bold 9px Georgia, Tahoma, serif;
  color: #fff6d6;
  text-shadow: 0 1px 2px #000, 0 0 3px #000;
}

/* Ensure all 4 Hero Slots and all 4 Castle Slots in the Right Sidebar are always clearly visible */
#heroLocators {
  position: absolute !important;
  left: 482px !important;
  top: 175px !important;
  width: 62px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
}
#townLocators {
  position: absolute !important;
  left: 556px !important;
  top: 175px !important;
  width: 62px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
}
.hud-slot {
  width: 56px !important;
  height: 30px !important;
  border-radius: 3px;
  transition: transform 0.1s ease, filter 0.1s ease;
}
.hud-slot.selected {
  outline: 2px solid #ffe868 !important;
  box-shadow: 0 0 6px rgba(255, 232, 104, 0.75) !important;
}
.hud-slot.empty-slot {
  opacity: 0.88;
}

/* Fix invisible/dark text in Right-Click Popups (#mapQuickInfo) and all Dialogs (image_1e0c48.jpg, image_1e0f4f.jpg) */
#mapQuickInfo,
.dos-qwik-card,
.dos-qwik-card *,
.dos-qwik-mon-info,
.dos-qwik-mon-info strong,
.dos-qwik-mon-info span,
.dos-qwik-hero-title,
.dos-qwik-hero-meta,
.dos-qwik-town-title,
.dos-qwik-town-meta,
.chrome-dialog,
.chrome-dialog p,
.chrome-dialog span,
.chrome-dialog strong,
.chrome-dialog div,
#eventModal,
#eventTitle,
#eventDescription {
  color: #fff6d6 !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.95), 0 0 4px rgba(0, 0, 0, 0.9) !important;
}
.dos-qwik-mon-info strong,
.dos-qwik-hero-title,
.dos-qwik-town-title,
#eventTitle,
.dos-buybuild-title {
  color: #ffe484 !important;
}

/* Fix Hero Status Screen (.original-hero) layout & alignment (image_140f7a.jpg) */
.original-hero .hero-title {
  left: 49px !important;
  top: 28px !important;
  width: 542px !important;
  height: 56px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font: bold 16px Georgia, serif !important;
  color: #ffe888 !important;
  text-shadow: 0 2px 4px #000, 0 0 6px #000 !important;
  user-select: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
.original-hero .hero-stat span {
  position: absolute !important;
  left: 2px !important;
  right: 2px !important;
  bottom: 18px !important;
  top: auto !important;
  text-align: center !important;
  font: bold 9px Georgia, Tahoma, serif !important;
  color: #ffd868 !important;
  text-shadow: 0 1px 2px #000, 0 0 3px #000 !important;
  pointer-events: none !important;
}
.original-hero .hero-stat strong {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 3px !important;
  top: auto !important;
  display: flex !important;
  justify-content: center !important;
}


/* === v64 WIDESCREEN MAIN MENU, CASTLE CONCEPT STRIP & DIALOG POLISH === */
/* 1. Fullscreen Widescreen 16:9 Main Menu (854x480 logical scaled uniformly by --combat-scale) */
.original-chrome .main-menu {
  width: 854px !important;
  height: 480px !important;
  background-size: 854px 480px !important;
  background-position: center center !important;
  transform: translate(-50%, -50%) scale(var(--menu-zoom, 1)) !important;
}
.original-chrome .main-menu-controls {
  left: 626px !important;
  top: 124px !important;
  width: 127px !important;
}

/* 2. Symmetrical Action Buttons in Load Game & Notice Dialogs (image_5481bd.jpg) */
.dos-dialog-actions,
.event-actions {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 8px !important;
  width: 100% !important;
  margin: 12px auto 0 auto !important;
  padding: 0 10px !important;
  box-sizing: border-box !important;
}

/* 3. Castle Garrison & Hero Squad Strip by Concept (image_548863.jpg & image_54f1f6.jpg) */
.army-slot strong {
  position: absolute !important;
  left: 2px !important;
  right: 2px !important;
  bottom: 2px !important;
  height: 15px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  font: bold 11px Georgia, Tahoma, serif !important;
  color: #fff6d6 !important;
  text-shadow: 0 1px 2px #000, 0 0 3px #000 !important;
}
.town-treasury-box {
  left: 551px !important;
  top: 15px !important;
  width: 83px !important;
  height: 154px !important;
  padding: 4px 3px !important;
}
.town-treasury-grid {
  height: 106px !important;
  align-content: space-around !important;
}
.town-treasury-gold {
  margin-top: 4px !important;
  height: 36px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
}

/* 4. Hire Hero Dialog 2-Line Labels & Spacing (image_54edfc.jpg) */
.dos-rcrthero-pair {
  display: flex !important;
  justify-content: center !important;
  align-items: flex-start !important;
  gap: 28px !important;
  padding: 0 12px !important;
}
.dos-rcrthero-slot {
  width: 112px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}
.dos-rcrthero-label {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  line-height: 1.15 !important;
  margin: 4px 0 5px 0 !important;
  min-height: 26px !important;
}
.dos-rcrthero-label strong {
  font: bold 11px Georgia, serif !important;
  color: #ffe888 !important;
}
.dos-rcrthero-label span {
  font: 9.5px Georgia, serif !important;
  color: #d8e6ff !important;
}

/* 5. High Scores Hall of Fame Layout (image_547e15.jpg) */
.dos-hiscore-title {
  display: none !important; /* Already rendered in 3x HD hiscore.bmp banner! */
}
.dos-hiscore-list {
  position: absolute !important;
  left: 84px !important;
  top: 62px !important;
  width: 472px !important;
  height: 336px !important;
}
.dos-hiscore-exit {
  position: absolute !important;
  left: 277px !important;
  top: 416px !important;
}

/* 6. Tall Eye-Level Royal Command Pavilions on the Battlefield (image_5490bf.jpg) */
.battle-general.left-general {
  left: 8px !important;
  top: 68px !important;
  width: 105px !important;
  height: 200px !important;
}
.battle-general.right-general {
  right: 8px !important;
  top: 68px !important;
  width: 105px !important;
  height: 200px !important;
}
.battle-general img {
  width: 105px !important;
  height: 200px !important;
  object-fit: contain !important;
}


/* === v65 COMPLETE HUD, RESOURCE CELL, MAIN MENU, PUZZLE & BATTLEFIELD POLISH === */
/* 1. Widescreen 16:9 Main Menu — zoom:1 prevents double scaling (zoom * scale), fitting 100% inside viewport! */
.original-chrome .main-menu {
  zoom: 1 !important;
  width: 854px !important;
  height: 480px !important;
  background-size: 854px 480px !important;
  background-position: center center !important;
  transform: translate(-50%, -50%) scale(var(--menu-zoom, 1)) !important;
  transform-origin: center center !important;
  box-shadow: 0 12px 42px rgba(0, 0, 0, 0.92) !important;
}
.original-chrome .main-menu-controls {
  left: 626px !important;
  top: 102px !important;
  width: 127px !important;
}

/* 2. Adventure Stage 480px Height + Bottom Ornament Bar (y=456..480) + Status Plaques (top:459px) */
.original-chrome #mapPane,
.original-chrome .adventure-stage {
  height: 480px !important;
}
.original-chrome #viewport {
  left: 16px !important;
  top: 16px !important;
  height: 440px !important;
}
.original-chrome .hud-day {
  left: 12px !important;
  top: 459px !important;
  width: 154px !important;
  height: 18px !important;
  line-height: 18px !important;
  text-align: center !important;
}
.original-chrome .chrome-message {
  left: 178px !important;
  right: 164px !important;
  top: 459px !important;
  height: 18px !important;
  line-height: 18px !important;
  text-align: center !important;
}
.original-chrome .hud-coordinates {
  right: 12px !important;
  top: 459px !important;
  width: 144px !important;
  height: 18px !important;
  line-height: 18px !important;
  text-align: center !important;
}

/* 3. Top Resource Strip inside Clean Royal-Sapphire Channel (x=18..410, y=2..14) */
.concept-top-resource-strip {
  position: absolute !important;
  left: 18px !important;
  top: 2px !important;
  width: 392px !important;
  height: 12px !important;
  display: grid !important;
  grid-template-columns: repeat(7, 1fr) !important;
  align-items: center !important;
  padding: 0 2px !important;
  box-sizing: border-box !important;
  z-index: 4 !important;
  pointer-events: none !important;
}
.concept-top-res-item {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 3px !important;
  font: bold 8.5px Tahoma, Verdana, sans-serif !important;
  color: #fff6d6 !important;
  text-shadow: 0 1px 2px #000, 1px 0 1px #000 !important;
  overflow: hidden !important;
}

/* 4. Right Sidebar Buttons (advbtns_icn.zip at top:316px) & Resource Panel (ressmall.icn at top:395px) */
.original-chrome .hud-buttons {
  top: 316px !important;
  width: 144px !important;
  height: 72px !important;
}
.original-chrome .hud-resources {
  top: 395px !important;
  width: 144px !important;
  height: 60px !important;
  background-position: 5px 2px !important;
  background-size: 134px 56px !important;
}
.ressmall-top-val {
  top: 18px !important;
  height: 10px !important;
  line-height: 10px !important;
  font-size: 8.5px !important;
}
.ressmall-sec-val {
  top: 45px !important;
  width: 22px !important;
  height: 10px !important;
  line-height: 10px !important;
  font-size: 8.5px !important;
}
.dos-enemy-hourglass {
  position: relative !important;
  width: 144px !important;
  height: 60px !important;
}
.dos-enemy-hourglass-lbl {
  position: absolute !important;
  left: 6px !important;
  right: 6px !important;
  bottom: 2px !important;
  text-align: center !important;
  font: bold 9px Georgia, serif !important;
  color: #ffe888 !important;
  text-shadow: 0 1px 2px #000, 0 0 4px #000 !important;
  background: rgba(10, 16, 36, 0.85) !important;
  border-radius: 3px !important;
  padding: 1px 4px !important;
}

/* 5. Castle Build Window (caslwind) Bottom Hint Bar & Kingdom Overview (overwind) Alignment */
.dos-caslwind-bar {
  font: bold 9.5px Tahoma, Georgia, sans-serif !important;
  padding: 0 8px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
.dos-caslwind-status {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  max-width: 100% !important;
}
.dos-overview-res canvas {
  width: 34px !important;
  height: 26px !important;
  object-fit: contain !important;
}
.dos-overview-puzzle-btn {
  left: 16px !important;
  bottom: 14px !important;
  width: 168px !important;
  text-align: center !important;
  padding: 5px 6px !important;
}
.dos-overview-gold-total {
  left: 196px !important;
  bottom: 8px !important;
  width: 196px !important;
}


/* === v66 FULLSCREEN WIDESCREEN MAIN MENU, 2x TENTS, 1.5x SMALLER UNITS, ARCHIVE BUTTONS & CASTLE FIXES === */
/* 1. Fullscreen Widescreen Main Menu filling the entire viewport with buttons centered in the oak doors */
.original-chrome .main-menu {
  zoom: 1 !important;
  width: 854px !important;
  height: 480px !important;
  background-size: 854px 480px !important;
  background-position: center center !important;
  transform: translate(-50%, -50%) scale(var(--menu-scale-x, var(--menu-zoom, 1)), var(--menu-scale-y, var(--menu-zoom, 1))) !important;
  transform-origin: center center !important;
}
.original-chrome .main-menu-controls {
  left: 590px !important;
  top: 108px !important;
  width: 127px !important;
}

/* 2. Right Sidebar 6 Command Buttons from advbtns_icn.zip fitted 100% inside their gold bay */
.original-chrome .hud-buttons {
  left: calc(var(--hud-left, 480px) + 3px) !important;
  top: 318px !important;
  width: 138px !important;
  height: 68px !important;
  display: grid !important;
  grid-template-columns: 46px 46px 46px !important;
  grid-template-rows: 34px 34px !important;
  gap: 0 !important;
}
.original-chrome .hud-buttons .sprite-button,
.original-chrome .hud-buttons .sprite-button canvas {
  width: 46px !important;
  height: 34px !important;
  display: block !important;
}

/* 3. Castle Screen Bottom-Right EXIT Button fitted 100% inside the (548..636, 420..454) gold bay */
.original-town .town-exit {
  right: 9px !important;
  bottom: 29px !important;
  width: 78px !important;
  height: 26px !important;
}
.original-town .town-exit canvas {
  width: 78px !important;
  height: 26px !important;
}

/* 4. Commander Tent & Enemy War Standard 2x Larger on the Battlefield (164x300 px) */
.battle-general.left-general {
  left: 2px !important;
  top: 72px !important;
  width: 164px !important;
  height: 300px !important;
  z-index: 6 !important;
}
.battle-general.right-general {
  right: 2px !important;
  left: auto !important;
  top: 72px !important;
  width: 164px !important;
  height: 300px !important;
  z-index: 6 !important;
}
.battle-general img:first-child {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}


/* === v68 PERFECT RECRUIT & DIALOG FIELD ALIGNMENT === */
.dos-recruit-title {
  left: 16px !important;
  top: 13px !important;
  width: 288px !important;
  height: 20px !important;
  line-height: 20px !important;
  text-align: center !important;
}
.dos-recruit-sprite {
  left: 34px !important;
  top: 42px !important;
  width: 82px !important;
  height: 93px !important;
}
.dos-recruit-avail {
  left: 18px !important;
  top: 139px !important;
  width: 114px !important;
  text-align: center !important;
}
.dos-recruit-unitcost {
  left: 140px !important;
  top: 48px !important;
  width: 148px !important;
  height: 74px !important;
  background: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-evenly !important;
}
.dos-recruit-buy-label {
  left: 38px !important;
  top: 162px !important;
}
.dos-recruit-count-box {
  left: 114px !important;
  top: 159px !important;
  width: 72px !important;
  height: 22px !important;
  background: rgba(10, 14, 28, 0.92) !important;
  border: 1.5px solid #d8b25c !important;
  border-radius: 3px !important;
}
.dos-recruit-up {
  left: 192px !important;
  top: 155px !important;
}
.dos-recruit-down {
  left: 192px !important;
  top: 170px !important;
}
.dos-recruit-max {
  left: 218px !important;
  top: 157px !important;
}
.dos-recruit-total-label {
  left: 26px !important;
  top: 191px !important;
  width: 268px !important;
  text-align: center !important;
}
.dos-recruit-total {
  left: 26px !important;
  top: 206px !important;
  width: 268px !important;
  height: 34px !important;
}
.dos-recruit-ok {
  left: 40px !important;
  top: 252px !important;
}
.dos-recruit-cancel {
  left: 184px !important;
  top: 252px !important;
}

.sprite-button:focus, .sprite-button:focus-visible, dialog button:focus, dialog button:focus-visible { outline: none !important; }


/* ============================================================================
   v82 HD Refinements: Single Large 480x340 Spellbook, Centered Town EXIT,
   Full-Box Garrison & Hero Castles, and Centered Load Game Dialog Buttons
   ============================================================================ */
.town-crest-slot {
  left: 5px !important;
  top: 14px !important;
  width: 101px !important;
  height: 93px !important;
  padding: 0 !important;
  overflow: hidden !important;
}
.town-crest-slot canvas {
  width: 101px !important;
  height: 93px !important;
  display: block !important;
}
.hero-crest-box {
  left: 49px !important;
  top: 200px !important;
  width: 101px !important;
  height: 93px !important;
  padding: 0 !important;
  overflow: hidden !important;
}
.hero-crest-box canvas {
  width: 101px !important;
  height: 93px !important;
  display: block !important;
}
.town-exit-btn {
  position: absolute !important;
  left: 549px !important;
  top: 173px !important;
  width: 86px !important;
  height: 32px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
}
.town-exit-btn canvas {
  width: 82px !important;
  height: 28px !important;
  display: block !important;
}
.dos-load-dialog {
  width: 384px !important;
  min-width: 384px !important;
  padding: 36px 24px 26px !important;
  text-align: center !important;
}
.dos-load-dialog .dos-dialog-actions {
  width: 100% !important;
  display: flex !important;
  flex-direction: row !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 12px !important;
  margin: 12px auto 0 !important;
}

/* Single Large 3x HD Open Leather & Gold Spellbook (480x340 logical) */
.dos-spellbook-open {
  width: 480px !important;
  min-width: 480px !important;
  height: 340px !important;
}
.dos-book-stage {
  width: 480px !important;
  height: 340px !important;
  background-size: 480px 340px !important;
}
.dos-book-page-hdr {
  top: 24px !important;
  width: 180px !important;
  font: bold 11.5px Georgia, serif !important;
  color: #381e08 !important;
  text-shadow: 0 1px 0 rgba(255, 248, 225, 0.85) !important;
}
.dos-book-page-hdr.left { left: 48px !important; }
.dos-book-page-hdr.right { left: 252px !important; }
.dos-book-prev { left: 31px !important; top: 11px !important; }
.dos-book-next { left: 398px !important; top: 11px !important; }
.dos-book-empty {
  left: 52px !important;
  top: 96px !important;
  width: 172px !important;
  font: 12px/1.4 Georgia, serif !important;
}
.dos-book-spell {
  width: 182px !important;
  height: 94px !important;
  padding: 4px 6px !important;
  gap: 2px !important;
  border-radius: 6px !important;
  background: radial-gradient(ellipse at center, rgba(255, 246, 218, 0.35) 0%, rgba(210, 178, 120, 0.08) 100%) !important;
  border: 1px solid rgba(140, 96, 38, 0.28) !important;
}
.dos-book-spell:hover {
  background: radial-gradient(ellipse at center, rgba(255, 248, 215, 0.72) 0%, rgba(235, 195, 110, 0.28) 100%) !important;
  border: 1px solid rgba(185, 128, 32, 0.65) !important;
}
.dos-book-spell canvas {
  max-height: 40px !important;
  max-width: 48px !important;
  filter: drop-shadow(0 2px 3px rgba(60, 35, 10, 0.45));
}
.dos-book-spell strong {
  font: bold 11px Georgia, serif !important;
  color: #261204 !important;
}
.dos-book-spell small {
  font: 9.5px/1.18 Georgia, serif !important;
  color: #48280b !important;
}
.dos-book-tab-combat { left: 258px !important; top: 274px !important; }
.dos-book-tab-adv    { left: 304px !important; top: 266px !important; }
.dos-book-tab-close  { left: 376px !important; top: 276px !important; }


/* ============================================================================
   v83 HD Refinements: Unclipped Catapult Wheels & Lifted Town Treasury Numbers
   ============================================================================ */
.battle-catapult {
  bottom: 26px !important;
  left: 16px !important;
  z-index: 18 !important;
}
.town-treasury-box {
  padding: 2px 3px 5px !important;
  gap: 1px !important;
}
.town-treasury-grid {
  gap: 1px 2px !important;
  margin-top: -2px !important;
}
.town-treasury-cell {
  height: 36px !important;
  padding: 0 1px 3px !important;
  justify-content: flex-start !important;
}
.town-treasury-cell img,
.town-treasury-cell canvas {
  max-height: 20px !important;
  margin-bottom: 1px !important;
}
.town-treasury-cell strong {
  margin-top: -1px !important;
  line-height: 10px !important;
}
.town-treasury-gold {
  height: 36px !important;
  padding: 1px 2px 5px !important;
  justify-content: flex-start !important;
}
.town-treasury-gold img,
.town-treasury-gold canvas {
  max-height: 19px !important;
  margin-bottom: 1px !important;
}
.town-treasury-gold strong {
  margin-top: -1px !important;
  line-height: 11px !important;
}


/* ============================================================================
   v84.0 Complete Polish: Unclipped Right-Click Info Card, Integrated Status Bar & Siege Catapult
   ============================================================================ */
.original-chrome #viewport {
  left: 16px !important;
  top: 16px !important;
  height: 442px !important;
}
.original-chrome .hud-day {
  left: 20px !important;
  top: 460px !important;
  width: 130px !important;
  height: 18px !important;
  line-height: 18px !important;
  text-align: center !important;
  font: bold 11px Georgia, serif !important;
  color: #ffe89e !important;
  text-shadow: 0 1px 2px #000, 1px 0 1px #000 !important;
}
.original-chrome .chrome-message {
  left: 162px !important;
  right: 180px !important;
  top: 460px !important;
  height: 18px !important;
  line-height: 18px !important;
  text-align: center !important;
}
.original-chrome .chrome-message #status {
  font: bold 11px Georgia, serif !important;
  color: #f6e6b8 !important;
  text-shadow: 0 1px 2px #000, 1px 0 1px #000 !important;
}
.original-chrome .hud-coordinates {
  right: 12px !important;
  top: 460px !important;
  width: 152px !important;
  height: 18px !important;
  line-height: 18px !important;
  text-align: center !important;
  font: bold 11px Georgia, serif !important;
  color: #ffe89e !important;
  text-shadow: 0 1px 2px #000, 1px 0 1px #000 !important;
}

/* Auto-sizing Royal Obsidian & Gold Right-Click Info Card so text NEVER clips! */
.dos-qwik-card.dos-qwik-mine {
  width: 232px !important;
  min-height: 176px !important;
  height: auto !important;
  padding: 12px 14px 14px !important;
  box-sizing: border-box !important;
  background: linear-gradient(180deg, #1e1a30 0%, #120f1e 65%, #0b0914 100%) !important;
  border: 2px solid #e8c060 !important;
  box-shadow: inset 0 0 0 2px #090710, inset 0 0 0 3px rgba(255, 232, 155, 0.35), 0 10px 28px rgba(0, 0, 0, 0.88) !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  gap: 8px !important;
  overflow: visible !important;
}
.dos-qwik-card.dos-qwik-mine .dos-qwik-title {
  position: static !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 0 5px !important;
  border-bottom: 1px solid rgba(232, 192, 96, 0.35) !important;
  text-align: center !important;
  font: bold 12.5px Georgia, serif !important;
  color: #ffe898 !important;
  white-space: normal !important;
  line-height: 1.25 !important;
}
.dos-qwik-card.dos-qwik-mine .dos-qwik-top {
  position: static !important;
  width: 100% !important;
  height: auto !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 2px 0 !important;
}
.dos-qwik-card.dos-qwik-mine .dos-qwik-stats {
  flex: 1 1 auto !important;
  font: 11px/1.32 Georgia, serif !important;
  color: #f4e8c6 !important;
  white-space: pre-wrap !important;
  word-break: break-word !important;
}
.dos-qwik-card.dos-qwik-mine .dos-qwik-army {
  position: static !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 6px 4px 2px !important;
  border-top: 1px solid rgba(232, 192, 96, 0.35) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.dos-qwik-card.dos-qwik-mine .dos-qwik-empty {
  font: italic 10.5px/1.28 Georgia, serif !important;
  color: #ffd884 !important;
  text-align: center !important;
  white-space: normal !important;
}

/* Non-Overlapping Commander Tent & 4x HD Siege Catapult on the Left Battlefield */
.battle-general.left-general {
  left: 6px !important;
  top: 44px !important;
  width: 126px !important;
  height: 236px !important;
  z-index: 6 !important;
}
.battle-catapult {
  left: 14px !important;
  bottom: 22px !important;
  width: 142px !important;
  height: 108px !important;
  z-index: 18 !important;
}


/* ============================================================================
   v85.0 Direct High-DPI Battlefield Image Layer (Eliminates CSS Background Blur!)
   ============================================================================ */
#tacticsBoard > .battlefield-bg-img {
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center bottom !important;
  pointer-events: none !important;
  z-index: 0 !important;
  image-rendering: auto !important;
  user-select: none !important;
}
#tacticsSandbox.tactics-fullscreen #tacticsBoard {
  background-image: none !important;
}
.battle-general.right-keep-general {
  right: 0 !important;
  top: 0 !important;
  width: 124px !important;
  height: 154px !important;
  z-index: 12 !important;
}

/* v86.0 Tent & Catapult Grounding + Watchtower Keep Hotspot */
.battle-general.left-general img {
  filter: drop-shadow(0 6px 10px rgba(0, 0, 0, 0.82)) drop-shadow(0 0 2px rgba(0, 0, 0, 0.95)) !important;
}
.battle-catapult {
  left: 16px !important;
  bottom: 24px !important;
  width: 136px !important;
  height: 102px !important;
  filter: drop-shadow(0 4px 6px rgba(0, 0, 0, 0.65)) !important;
}
.battle-general.right-keep-general {
  right: 0 !important;
  top: 0 !important;
  width: 83px !important;
  height: 144px !important;
}

/* v86.0 Final Catapult Grounding & Spacing */
.battle-catapult {
  left: 6px !important;
  top: 312px !important;
  width: 112px !important;
  height: 82px !important;
  filter: drop-shadow(0 5px 5px rgba(8, 12, 6, 0.72)) contrast(1.06) saturate(1.05) !important;
}

/* ============================================================================
   v88.0 Perfectly Centered Bottom Status Bar Compartments & Credits Dialog
   ============================================================================ */
.original-chrome .hud-day {
  left: 16px !important;
  top: 460px !important;
  width: 138px !important;
  height: 18px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  line-height: 1 !important;
  padding: 0 4px !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}
.original-chrome .chrome-message {
  left: 158px !important;
  right: 176px !important;
  top: 460px !important;
  height: 18px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  padding: 0 8px !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}
.original-chrome .chrome-message #status {
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
  text-align: center !important;
}
.original-chrome .hud-coordinates {
  right: 8px !important;
  left: auto !important;
  top: 460px !important;
  width: 160px !important;
  height: 18px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  line-height: 1 !important;
  padding: 0 4px !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}
.dos-credits-dialog {
  width: 640px !important;
  min-width: 640px !important;
  max-width: 640px !important;
  height: 480px !important;
  min-height: 480px !important;
  max-height: 480px !important;
  padding: 0 !important;
  border: 0 !important;
  overflow: hidden !important;
  background: #0b0914 !important;
}
.dos-credits-dialog .chrome-dialog-body {
  width: 640px !important;
  height: 480px !important;
  padding: 0 !important;
  margin: 0 !important;
  display: block !important;
  overflow: hidden !important;
}

.dos-credits-dialog .chrome-dialog-body > img,
.dos-credits-dialog .chrome-dialog-body > canvas {
  width: 640px !important;
  height: 480px !important;
  max-width: 640px !important;
  max-height: 480px !important;
  object-fit: fill !important;
  display: block !important;
}

/* v89.0: High-Resolution Smooth Trilinear Mipmap Rendering for 4x HD Building Cards & Town Panoramas */
.dos-caslwind-art,
.dos-buybuild-art,
.original-chrome .dos-caslwind-art,
.original-chrome .dos-buybuild-art,
.original-chrome .town-scene {
  image-rendering: auto !important;
}

/* ============================================================================
 * v90.0: Unified Royal Obsidian & Gold Quick-Info Panel (.dos-qwik-card)
 * Ensures hero/town armies sit strictly inside the info panel box (never below it!)
 * ============================================================================ */
.dos-qwik-card,
.dos-qwik-card.dos-qwik-hero,
.dos-qwik-card.dos-qwik-town,
.dos-qwik-card.dos-qwik-mine,
.dos-qwik-card.dos-qwik-monster {
  width: 236px !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 10px 12px 12px !important;
  box-sizing: border-box !important;
  background: linear-gradient(180deg, #1e1a30 0%, #120f1e 65%, #0b0914 100%) !important;
  background-image: linear-gradient(180deg, #1e1a30 0%, #120f1e 65%, #0b0914 100%) !important;
  border: 2px solid #e8c060 !important;
  box-shadow: inset 0 0 0 2px #090710, inset 0 0 0 3px rgba(255, 232, 155, 0.35), 0 10px 28px rgba(0, 0, 0, 0.88) !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  align-items: stretch !important;
  gap: 7px !important;
  overflow: hidden !important;
}
.dos-qwik-card .dos-qwik-title {
  position: static !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 0 5px !important;
  border-bottom: 1px solid rgba(232, 192, 96, 0.38) !important;
  text-align: center !important;
  font: bold 12px/1.25 Georgia, serif !important;
  color: #ffe898 !important;
  white-space: normal !important;
}
.dos-qwik-card .dos-qwik-top {
  position: static !important;
  width: 100% !important;
  height: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 2px 0 !important;
}
.dos-qwik-card .dos-qwik-stats {
  flex: 1 1 auto !important;
  font: bold 11px/1.32 Georgia, serif !important;
  color: #f6ecd0 !important;
  white-space: pre-line !important;
  text-align: left !important;
}
.dos-qwik-card .dos-qwik-army {
  position: static !important;
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 3px !important;
  align-items: center !important;
  justify-items: center !important;
  margin: 2px 0 0 0 !important;
  padding: 6px 4px 5px !important;
  width: 100% !important;
  height: auto !important;
  min-height: 54px !important;
  box-sizing: border-box !important;
  background: rgba(10, 8, 18, 0.72) !important;
  border: 1px solid rgba(232, 192, 96, 0.45) !important;
  border-radius: 3px !important;
  overflow: hidden !important;
}
.dos-qwik-card.dos-qwik-mine .dos-qwik-army {
  display: flex !important;
  justify-content: center !important;
  min-height: 32px !important;
}
.dos-qwik-card .dos-qwik-slot {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 2px !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 46px !important;
  height: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  text-align: center !important;
  overflow: visible !important;
}
.dos-qwik-card .dos-qwik-slot canvas,
.dos-qwik-card .dos-qwik-slot img {
  flex: 0 0 auto !important;
  width: auto !important;
  height: auto !important;
  max-width: 36px !important;
  max-height: 32px !important;
  object-fit: contain !important;
  image-rendering: auto !important;
  display: block !important;
  margin: 0 auto !important;
}
.dos-qwik-card .dos-qwik-cnt,
.dos-qwik-card .dos-qwik-count {
  display: block !important;
  font: bold 10.5px/1.1 Tahoma, Verdana, sans-serif !important;
  color: #ffe888 !important;
  text-shadow: 0 1px 2px #000, 1px 0 1px #000, -1px 0 1px #000 !important;
  margin-top: 1px !important;
  padding: 0 2px !important;
  background: transparent !important;
  white-space: nowrap !important;
}


/* ============================================================================
 * v92.0 PATREON & BOOSTY EDITION UI (Bilingual Switcher, Auth, Sub Gate, Lobby, Session Recovery)
 * ============================================================================ */
.aetheria-patreon-hud {
  position: fixed;
  top: 10px;
  left: 14px;
  z-index: 160;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  pointer-events: auto;
}
body:not(.menu-active) .aetheria-patreon-hud {
  left: auto;
  right: 10px;
  top: 4px;
  transform: scale(0.92);
  transform-origin: top right;
}
body.battle-fullscreen-open .aetheria-patreon-hud {
  top: 6px;
  right: 12px;
  left: auto;
}
.ap-hud-btn {
  font: 12px Georgia, serif;
  color: #fff2c2;
  background: linear-gradient(180deg, rgba(28, 38, 74, 0.95) 0%, rgba(14, 18, 38, 0.96) 100%);
  border: 1.5px solid #e8c060;
  border-radius: 4px;
  padding: 4px 10px;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.75);
  text-shadow: 0 1px 2px #000;
  transition: transform 0.1s, border-color 0.15s;
}
.ap-hud-btn:hover {
  border-color: #fff298;
  background: linear-gradient(180deg, rgba(42, 58, 108, 0.98) 0%, rgba(20, 28, 56, 0.98) 100%);
}
.ap-hud-btn.ap-sub-active {
  border-color: #ffd868;
  background: linear-gradient(180deg, #4a3210 0%, #261806 100%);
}
.ap-tier-pill {
  display: inline-block;
  margin-left: 4px;
  padding: 1px 6px;
  border-radius: 3px;
  font-size: 10.5px;
  background: rgba(232, 192, 96, 0.22);
  border: 1px solid rgba(255, 224, 120, 0.55);
  color: #ffe898;
}
.aetheria-royal-modal {
  background: linear-gradient(180deg, #1b2238 0%, #101424 100%) !important;
  border: 2.5px solid #e8c060 !important;
  box-shadow: 0 14px 44px rgba(0, 0, 0, 0.92), inset 0 0 0 1px rgba(255, 232, 152, 0.25) !important;
  color: #fff0c4 !important;
  padding: 0 !important;
  max-width: 96vw !important;
}
.ap-modal-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 16px;
  background: linear-gradient(180deg, #2b365c 0%, #171e36 100%);
  border-bottom: 1.5px solid #d4a64a;
}
.ap-modal-head h3 {
  margin: 0;
  font: bold 15px Georgia, serif;
  color: #ffe898;
  text-shadow: 0 1px 2px #000;
}
.ap-close-x {
  background: transparent !important;
  border: 1px solid #c99e4c !important;
  color: #ffe898 !important;
  width: 26px;
  height: 26px;
  padding: 0 !important;
  cursor: pointer;
}
.ap-modal-body {
  padding: 14px 16px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.ap-alert {
  padding: 8px 12px;
  border-radius: 3px;
  font-size: 12.5px;
  line-height: 1.35;
}
.ap-alert-ok {
  background: rgba(26, 92, 52, 0.55);
  border: 1px solid #58d888;
  color: #d8ffe4;
}
.ap-alert-error {
  background: rgba(112, 24, 24, 0.65);
  border: 1px solid #ff6868;
  color: #ffd8d8;
}
.ap-tabs {
  display: flex;
  gap: 6px;
  border-bottom: 1px solid rgba(232, 192, 96, 0.35);
  padding-bottom: 6px;
}
.ap-tab {
  flex: 1;
  padding: 6px 10px !important;
  background: rgba(16, 20, 36, 0.8) !important;
  border: 1px solid #786030 !important;
  color: #d8c498 !important;
  cursor: pointer;
}
.ap-tab.active {
  background: linear-gradient(180deg, #8c6422 0%, #4f3510 100%) !important;
  border-color: #ffd868 !important;
  color: #fff8dc !important;
}
.ap-form {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ap-input, .ap-select {
  width: 100%;
  box-sizing: border-box;
  padding: 7px 10px !important;
  background: #0d111e !important;
  border: 1px solid #c49a45 !important;
  color: #fff2c6 !important;
  font: 13px Georgia, serif !important;
}
.ap-row {
  display: flex;
  gap: 8px;
  align-items: center;
}
.ap-full-btn {
  width: 100%;
  padding: 8px 12px !important;
  font-size: 13px !important;
}
.ap-profile-card, .ap-sub-box, .ap-create-room-panel, .ap-rooms-list-sec, .ap-gate-box {
  background: rgba(10, 14, 26, 0.72);
  border: 1px solid rgba(232, 192, 96, 0.45);
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.ap-sec-title {
  font: bold 13px Georgia, serif;
  color: #ffe488;
}
.ap-hint {
  margin: 0;
  font-size: 11.5px;
  color: #d8c89e;
  line-height: 1.35;
}
.ap-badge-gold {
  color: #ffe878;
  font-weight: bold;
}
.ap-badge-free {
  color: #ff9e88;
}
.ap-test-tier-row {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 4px;
}
.ap-test-tier-row button {
  flex: 1;
  font-size: 11px !important;
  padding: 4px 6px !important;
}
.ap-slots-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.ap-slot-card {
  background: rgba(20, 26, 46, 0.9);
  border: 1px solid rgba(212, 166, 74, 0.45);
  padding: 7px 9px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.ap-slot-title {
  font: bold 12px Georgia, serif;
  color: #ffe898;
}
.ap-slot-occ {
  font-size: 11.5px;
  color: #e8dcb8;
}
.ap-rooms-list {
  max-height: 135px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ap-room-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: rgba(22, 28, 48, 0.85);
  border: 1px solid rgba(200, 158, 76, 0.4);
  padding: 6px 10px;
}
.ap-room-code {
  font-family: monospace;
  color: #78d8ff;
  font-size: 12px;
}
.ap-modal-foot {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 4px;
}
.ap-gate-box {
  text-align: center;
  padding: 14px;
}
.ap-gate-icon {
  font-size: 32px;
}
.ap-gate-box h4 {
  margin: 4px 0;
  color: #ffe888;
}
.ap-gate-box p {
  margin: 4px 0;
  font-size: 12.5px;
  line-height: 1.4;
}
.aetheria-toast {
  position: fixed;
  bottom: 28px;
  left: 50%;
  transform: translateX(-50%) translateY(20px);
  background: linear-gradient(180deg, #1e2c54 0%, #101830 100%);
  border: 2px solid #ffd868;
  color: #fff6d0;
  padding: 7px 16px;
  font: bold 12.5px Georgia, serif;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.85);
  z-index: 9999;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.22s, transform 0.22s;
}
.aetheria-toast.visible {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}
.aetheria-online-banner {
  position: fixed;
  bottom: 22px;
  left: 18px;
  z-index: 140;
  padding: 3px 10px;
  font: 11.5px Georgia, serif;
  border-radius: 3px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.8);
  pointer-events: none;
}
.aetheria-online-banner.my-turn {
  background: rgba(20, 78, 42, 0.92);
  border: 1px solid #68f098;
  color: #e2ffe8;
}
.aetheria-online-banner.waiting-turn {
  background: rgba(78, 48, 16, 0.92);
  border: 1px solid #f0b848;
  color: #fff0c8;
}


.ap-alert-waiting {
  background: rgba(112, 78, 14, 0.65);
  border: 1px solid #ffd258;
  color: #fff2c2;
}
.ap-conn-badge {
  padding: 4px 10px;
  border-radius: 4px;
  font: bold 11.5px Georgia, serif;
  white-space: nowrap;
}
.ap-conn-badge.is-waiting {
  background: rgba(120, 82, 12, 0.85);
  border: 1px solid #ffd258;
  color: #ffe898;
}
.ap-conn-badge.is-ready {
  background: rgba(20, 92, 48, 0.85);
  border: 1px solid #68f098;
  color: #dcffe6;
}


/* ============================================================================
 * v94.0 MAIN MENU LIFT, BILINGUAL TITLE PLAQUE, TURN-LOCK SHIELD & DRAGGABLE CHAT
 * ============================================================================ */
.original-chrome .main-menu-controls {
  left: 590px !important;
  top: 56px !important;
  width: 127px !important;
  gap: 5px !important;
}
.original-chrome .main-menu-controls .sprite-button,
.original-chrome .main-menu-controls .sprite-button canvas {
  width: 127px !important;
  height: 43px !important;
}

/* Bilingual Main Menu Title Plaque (covers baked Russian title at 111,18,390,48) */
.main-menu-title-plaque {
  position: absolute;
  left: 111px;
  top: 18px;
  width: 390px;
  height: 48px;
  box-sizing: border-box;
  background: linear-gradient(180deg, #0e1528 0%, #141e38 50%, #0a1020 100%);
  border: 2px solid #e8c468;
  box-shadow: inset 0 0 0 1.5px rgba(255, 232, 152, 0.35), 0 4px 14px rgba(0, 0, 0, 0.65);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  z-index: 5;
}
.main-menu-title-plaque .mm-title-main {
  font: bold 18px Georgia, "Times New Roman", serif;
  letter-spacing: 0.8px;
  color: #ffe898;
  text-shadow: 0 2px 2px #000, 0 0 8px rgba(255, 210, 88, 0.35);
  line-height: 1.15;
  white-space: nowrap;
}
.main-menu-title-plaque .mm-title-sub {
  font: bold 9.5px Tahoma, Verdana, sans-serif;
  letter-spacing: 0.6px;
  color: #9ec0e6;
  text-shadow: 1px 1px 1px #000;
  margin-top: 2px;
  white-space: nowrap;
}

/* Online Waiting-Turn Command Shield (prevents clicking map/HUD during opponent turn) */
.aetheria-turn-lock-shield {
  position: absolute;
  inset: 0;
  z-index: 85;
  background: rgba(6, 10, 18, 0.14);
  cursor: not-allowed;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding-top: 24px;
  pointer-events: auto;
}
.aetheria-turn-lock-shield[hidden] {
  display: none !important;
}
.aetheria-turn-lock-shield .turn-lock-pill {
  background: rgba(18, 24, 42, 0.88);
  border: 1.5px solid #ffd268;
  color: #fff4ce;
  padding: 6px 16px;
  border-radius: 20px;
  font: 12px Georgia, serif;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.85);
  pointer-events: none;
}

/* Draggable Semi-Transparent General Chat & Match Control Window */
.aetheria-chat-widget {
  position: fixed;
  left: 16px;
  bottom: 34px;
  width: 336px;
  z-index: 9400;
  background: rgba(12, 16, 28, 0.72);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  border: 1.5px solid rgba(236, 196, 96, 0.78);
  border-radius: 6px;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.82);
  color: #f6e7bc;
  font: 12px Georgia, serif;
  display: flex;
  flex-direction: column;
  user-select: none;
}
.aetheria-chat-widget[hidden] {
  display: none !important;
}
.aetheria-chat-widget.minimized {
  width: 248px;
}
.aetheria-chat-widget.minimized .ap-chat-body {
  display: none !important;
}
.ap-chat-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 5px 9px;
  background: linear-gradient(180deg, rgba(44, 56, 92, 0.85) 0%, rgba(22, 28, 48, 0.85) 100%);
  border-bottom: 1px solid rgba(232, 192, 96, 0.55);
  border-radius: 5px 5px 0 0;
  cursor: move;
  touch-action: none;
}
.ap-chat-title {
  font: bold 12px Georgia, serif;
  color: #ffe898;
  text-shadow: 1px 1px 1px #000;
  display: flex;
  align-items: center;
  gap: 6px;
}
.ap-chat-hdr-btns {
  display: flex;
  gap: 4px;
}
.ap-chat-hdr-btn {
  background: rgba(255, 232, 152, 0.14);
  border: 1px solid rgba(232, 192, 96, 0.55);
  color: #ffe898;
  font: bold 11px Tahoma, sans-serif;
  padding: 1px 6px;
  border-radius: 3px;
  cursor: pointer;
}
.ap-chat-hdr-btn:hover {
  background: rgba(255, 232, 152, 0.28);
}
.ap-chat-body {
  display: flex;
  flex-direction: column;
  padding: 6px 8px 8px;
  gap: 6px;
}
.ap-chat-actions-bar {
  display: flex;
  gap: 4px;
  flex-wrap: nowrap;
}
.ap-chat-act-btn {
  flex: 1 1 0;
  background: linear-gradient(180deg, rgba(78, 56, 22, 0.85) 0%, rgba(44, 30, 10, 0.9) 100%);
  border: 1px solid rgba(232, 192, 96, 0.7);
  color: #fff2c6;
  font: bold 10.5px Tahoma, Verdana, sans-serif;
  padding: 4px 4px;
  border-radius: 3px;
  cursor: pointer;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-shadow: 1px 1px 1px #000;
}
.ap-chat-act-btn:hover {
  border-color: #ffe888;
  background: linear-gradient(180deg, rgba(108, 78, 28, 0.92) 0%, rgba(62, 42, 14, 0.95) 100%);
}
.ap-chat-act-btn.danger {
  background: linear-gradient(180deg, rgba(110, 28, 28, 0.85) 0%, rgba(64, 14, 14, 0.9) 100%);
  border-color: #f08080;
  color: #ffd8d8;
}
.ap-chat-vote-box {
  background: rgba(112, 32, 24, 0.78);
  border: 1px solid #ff9888;
  border-radius: 4px;
  padding: 5px 7px;
  font-size: 11px;
  color: #ffece8;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.ap-chat-saves-drawer {
  background: rgba(16, 22, 38, 0.92);
  border: 1px solid #d8b25c;
  border-radius: 4px;
  padding: 6px;
  max-height: 135px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.ap-chat-save-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  background: rgba(255, 255, 255, 0.05);
  padding: 4px 6px;
  border-radius: 3px;
  font-size: 11px;
}
.ap-chat-messages {
  height: 116px;
  overflow-y: auto;
  background: rgba(6, 9, 16, 0.52);
  border: 1px solid rgba(212, 174, 82, 0.35);
  border-radius: 4px;
  padding: 5px 7px;
  display: flex;
  flex-direction: column;
  gap: 3px;
  user-select: text;
}
.ap-chat-msg {
  font-size: 11.5px;
  line-height: 1.32;
  word-break: break-word;
}
.ap-chat-msg .ap-chat-time {
  color: #98a8c8;
  font-size: 10px;
  margin-right: 4px;
}
.ap-chat-msg .ap-chat-author {
  font-weight: bold;
  margin-right: 4px;
}
.ap-chat-msg.system-msg {
  color: #ffd878;
  font-style: italic;
}
.ap-chat-input-row {
  display: flex;
  gap: 5px;
}
.ap-chat-input {
  flex: 1;
  background: rgba(8, 12, 22, 0.82);
  border: 1px solid rgba(216, 178, 92, 0.65);
  border-radius: 3px;
  color: #fff4d2;
  padding: 4px 7px;
  font: 12px Georgia, serif;
}
.ap-chat-send-btn {
  background: linear-gradient(180deg, #8c6422 0%, #4f3510 100%);
  border: 1px solid #f0c869;
  color: #fff4ce;
  font: bold 11.5px Georgia, serif;
  padding: 4px 10px;
  border-radius: 3px;
  cursor: pointer;
}


/* ============================================================================
 * v95.0 MAIN MENU RATING LEADERBOARD, LOBBY HUB CHAT/WHISPERS & INVITE BANNERS
 * ============================================================================ */
.aetheria-mm-leaderboard {
  position: absolute;
  left: 18px;
  bottom: 14px;
  width: 310px;
  background: rgba(10, 14, 26, 0.84);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  border: 1.5px solid #e2be62;
  border-radius: 6px;
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.88);
  padding: 6px 9px 7px;
  color: #f6e7bc;
  font: 11px Georgia, serif;
  z-index: 12;
  pointer-events: auto;
}
.aetheria-mm-leaderboard.collapsed .ap-mm-lb-list {
  display: none !important;
}
.ap-mm-lb-hdr {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid rgba(226, 190, 98, 0.45);
  padding-bottom: 4px;
  margin-bottom: 4px;
  font: bold 11.5px Georgia, serif;
  color: #ffe898;
}
.ap-mm-lb-list {
  display: flex;
  flex-direction: column;
  gap: 3px;
  max-height: 112px;
  overflow-y: auto;
}
.ap-mm-lb-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: rgba(255, 255, 255, 0.05);
  padding: 2px 6px;
  border-radius: 3px;
  font-size: 11px;
}
.ap-mm-lb-row.is-me {
  background: rgba(236, 196, 88, 0.22);
  border: 1px solid rgba(255, 224, 120, 0.65);
}

/* Lobby Hub Chat, Online Players & Whisper / Invite Bar */
.ap-lobby-hub {
  background: rgba(12, 17, 30, 0.85);
  border: 1px solid rgba(232, 192, 96, 0.55);
  border-radius: 5px;
  padding: 8px;
  margin-top: 8px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ap-online-users-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  align-items: center;
}
.ap-online-user-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: rgba(28, 42, 74, 0.85);
  border: 1px solid rgba(130, 178, 255, 0.55);
  border-radius: 4px;
  padding: 2px 6px;
  font-size: 11px;
  color: #e4f0ff;
}
.ap-whisper-badge {
  background: rgba(124, 48, 168, 0.85);
  border: 1px solid #e0a8ff;
  color: #f8e8ff;
  padding: 2px 7px;
  border-radius: 3px;
  font-size: 11px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.ap-chat-msg.whisper-msg {
  background: rgba(112, 42, 156, 0.32);
  border-left: 2px solid #d898ff;
  padding-left: 5px;
  color: #f4dcff;
}
.ap-invite-banner {
  background: linear-gradient(90deg, rgba(28, 86, 52, 0.92), rgba(18, 56, 36, 0.92));
  border: 1.5px solid #78ff9e;
  border-radius: 5px;
  padding: 6px 10px;
  color: #e8fff0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  margin-bottom: 6px;
}


/* ============================================================================
 * v96.0 TWO-COLUMN COMPACT ONLINE LOBBY MODAL (NO ZOOM OVERFLOW, CRISP 11.5PX UI)
 * ============================================================================ */
.aetheria-royal-modal {
  zoom: 1 !important;
  transform: none !important;
  max-width: 95vw !important;
  max-height: 92vh !important;
  margin: auto !important;
  padding: 0 !important;
  overflow: hidden !important;
  font-family: Tahoma, Verdana, Georgia, sans-serif !important;
}
.aetheria-royal-modal[open] {
  display: flex !important;
  flex-direction: column !important;
}
.aetheria-royal-modal .ap-modal-head {
  padding: 7px 14px !important;
  flex: 0 0 auto !important;
}
.aetheria-royal-modal .ap-modal-head h3 {
  font: bold 13.5px Georgia, serif !important;
}
.aetheria-royal-modal .ap-modal-body {
  padding: 10px 12px 12px !important;
  gap: 8px !important;
  overflow-y: auto !important;
  max-height: calc(92vh - 42px) !important;
}
.aetheria-royal-modal .ap-lobby-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: rgba(16, 22, 40, 0.85);
  border: 1px solid rgba(232, 192, 96, 0.45);
  border-radius: 4px;
  padding: 4px 10px;
  font-size: 11.5px;
}
.ap-lobby-two-col {
  display: grid;
  grid-template-columns: 1.08fr 0.92fr;
  gap: 10px;
  align-items: stretch;
  width: 100%;
}
@media (max-width: 720px) {
  .ap-lobby-two-col {
    grid-template-columns: 1fr;
  }
}
.ap-lobby-col {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}
.ap-settings-grid2x2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px 8px;
}
.ap-field-box,
.ap-field-cell {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.ap-field-lbl {
  font: bold 10.5px Tahoma, Verdana, sans-serif;
  color: #e8cfa0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.aetheria-royal-modal .ap-input,
.aetheria-royal-modal .ap-select {
  padding: 3px 6px !important;
  height: 26px !important;
  font: 11.5px Tahoma, Verdana, sans-serif !important;
  border-radius: 3px !important;
}
.aetheria-royal-modal .ap-create-room-panel,
.aetheria-royal-modal .ap-rooms-list-sec,
.aetheria-royal-modal .ap-lobby-hub {
  padding: 8px 10px !important;
  gap: 6px !important;
  border-radius: 5px !important;
  margin-top: 0 !important;
}
.aetheria-royal-modal .ap-sec-title {
  font: bold 12px Georgia, serif !important;
  color: #ffe488 !important;
  border-bottom: 1px solid rgba(232, 192, 96, 0.28);
  padding-bottom: 3px;
  margin-bottom: 1px;
}
.aetheria-royal-modal .ap-slots-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px !important;
}
.aetheria-royal-modal .ap-slot-card {
  padding: 5px 7px !important;
  gap: 4px !important;
  border-radius: 4px;
}
.aetheria-royal-modal .ap-slot-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font: bold 11px Tahoma, Verdana, sans-serif !important;
  color: #ffe898;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ap-slot-controls-row {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 4px;
  width: 100%;
}
.ap-slot-controls-row .ap-select {
  margin-top: 0 !important;
  padding: 2px 4px !important;
  height: 24px !important;
  font-size: 11px !important;
}
.aetheria-royal-modal .ap-hint {
  font-size: 11px !important;
  line-height: 1.25 !important;
}
.aetheria-royal-modal .ap-full-btn {
  padding: 6px 10px !important;
  font-size: 12px !important;
  border-radius: 4px !important;
}
.aetheria-royal-modal .ap-rooms-list {
  max-height: 124px !important;
  min-height: 54px;
  gap: 4px !important;
}
.aetheria-royal-modal .ap-room-row {
  padding: 4px 8px !important;
  font-size: 11px !important;
  border-radius: 3px;
}
.aetheria-royal-modal .ap-alert {
  padding: 6px 9px !important;
  font-size: 11.5px !important;
  line-height: 1.3 !important;
}


/* ============================================================================
 * v97.0 FULLSCREEN 3-COLUMN ONLINE LOBBY, SCROLLABLE ONLINE PLAYERS COLUMN,
 * AND DEDICATED PRIVATE MESSAGES (DM) TAB WITH SCROLLABLE CONTACTS LIST
 * ============================================================================ */
.aetheria-royal-modal.ap-lobby-fullscreen {
  width: 96vw !important;
  height: 92vh !important;
  max-width: 1640px !important;
  max-height: 94vh !important;
  zoom: 1 !important;
  transform: none !important;
}
.aetheria-royal-modal.ap-lobby-fullscreen .ap-modal-body {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  max-height: calc(92vh - 42px) !important;
  overflow: hidden !important;
  padding: 10px 14px 12px !important;
  gap: 8px !important;
}
.ap-lobby-three-col {
  display: grid;
  grid-template-columns: 1.08fr 1.24fr 0.82fr;
  gap: 12px;
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
  overflow: hidden;
}
@media (max-width: 1024px) {
  .aetheria-royal-modal.ap-lobby-fullscreen .ap-modal-body {
    overflow-y: auto !important;
  }
  .ap-lobby-three-col {
    grid-template-columns: 1fr 1fr;
    overflow: visible;
  }
}
.ap-lobby-three-col > .ap-lobby-col {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
  min-height: 0;
  height: 100%;
  overflow: hidden;
}
/* Column 1: Room Creation / Staging Panel */
.ap-lobby-three-col .ap-create-room-panel {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  justify-content: space-between;
  gap: 8px !important;
  padding: 10px 12px !important;
}
/* Give both selects in each slot card equal 1fr 1fr space so color names never clip */
.ap-slot-controls-row {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 6px !important;
  width: 100%;
}
.ap-slot-controls-row .ap-select {
  margin-top: 0 !important;
  padding: 2px 5px !important;
  height: 26px !important;
  font-size: 11.5px !important;
  width: 100% !important;
  min-width: 0 !important;
}

/* Column 2 Top: Open Rooms List with Scroll */
.ap-lobby-three-col .ap-rooms-list-sec {
  display: flex;
  flex-direction: column;
  flex: 0 0 36%;
  min-height: 135px;
  max-height: 42%;
  overflow: hidden;
  padding: 9px 11px !important;
}
.ap-lobby-three-col .ap-rooms-list {
  flex: 1 1 auto !important;
  max-height: none !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  padding-right: 4px;
}

/* Column 2 Bottom: Communication Hub (Public Chat Tab + Private DMs & Contacts Tab) */
.ap-lobby-three-col .ap-lobby-hub {
  display: flex;
  flex-direction: column;
  flex: 1 1 64%;
  min-height: 0;
  overflow: hidden;
  padding: 9px 11px !important;
  gap: 7px !important;
}
.ap-comm-tabs {
  display: flex;
  gap: 6px;
  border-bottom: 1px solid rgba(232, 192, 96, 0.35);
  padding-bottom: 5px;
  flex: 0 0 auto;
}
.ap-comm-tab-btn {
  flex: 1;
  background: rgba(18, 26, 48, 0.85);
  border: 1px solid rgba(180, 152, 82, 0.55);
  color: #d6c89e;
  font: bold 11.5px Tahoma, Verdana, sans-serif;
  padding: 5px 8px;
  border-radius: 4px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  transition: background 0.12s ease, border-color 0.12s ease;
}
.ap-comm-tab-btn.active {
  background: linear-gradient(180deg, #7c561b 0%, #462f0d 100%);
  border-color: #ffd878;
  color: #fff6d6;
  box-shadow: 0 0 8px rgba(255, 210, 96, 0.35);
}
.ap-comm-tab-badge {
  background: #a438d8;
  color: #fff;
  font-size: 10px;
  padding: 1px 5px;
  border-radius: 8px;
  font-weight: bold;
}
.ap-comm-pane {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  gap: 6px;
  overflow: hidden;
}
.ap-comm-pane[hidden] {
  display: none !important;
}
.ap-comm-pane > .ap-chat-messages {
  flex: 1 1 auto !important;
  height: auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
}

/* Split Master-Detail View inside Private Messages (DM) Tab:
   Left = Scrollable Contacts List, Right = Selected Contact's Private Messages */
.ap-dm-split-pane {
  display: grid;
  grid-template-columns: 185px 1fr;
  gap: 8px;
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
}
.ap-dm-contacts-col {
  display: flex;
  flex-direction: column;
  min-height: 0;
  background: rgba(6, 10, 20, 0.65);
  border: 1px solid rgba(212, 174, 82, 0.38);
  border-radius: 4px;
  overflow: hidden;
}
.ap-dm-contacts-hdr {
  padding: 4px 7px;
  font: bold 10.5px Tahoma, sans-serif;
  color: #ffe28a;
  background: rgba(28, 38, 66, 0.75);
  border-bottom: 1px solid rgba(212, 174, 82, 0.3);
  flex: 0 0 auto;
}
.ap-dm-contacts-list {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 4px;
}
.ap-dm-contact-item {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 5px 7px;
  border-radius: 4px;
  background: rgba(24, 34, 58, 0.72);
  border: 1px solid rgba(140, 172, 230, 0.3);
  cursor: pointer;
  text-align: left;
  color: #e8f0ff;
  font: 11px Tahoma, sans-serif;
}
.ap-dm-contact-item:hover {
  background: rgba(44, 62, 102, 0.85);
}
.ap-dm-contact-item.active {
  background: linear-gradient(90deg, rgba(108, 44, 152, 0.82), rgba(58, 26, 92, 0.82));
  border-color: #e4a8ff;
  color: #fff;
}
.ap-dm-contact-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 4px;
  font-weight: bold;
}
.ap-dm-contact-preview {
  font-size: 10px;
  color: #b8c8e8;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ap-dm-thread-col {
  display: flex;
  flex-direction: column;
  min-height: 0;
  min-width: 0;
  gap: 5px;
  overflow: hidden;
}
.ap-dm-thread-hdr {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: rgba(88, 32, 128, 0.55);
  border: 1px solid rgba(224, 168, 255, 0.55);
  border-radius: 4px;
  padding: 4px 8px;
  font-size: 11px;
  color: #f8e8ff;
  flex: 0 0 auto;
}
.ap-dm-thread-col > .ap-chat-messages {
  flex: 1 1 auto !important;
  height: auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
}

/* Column 3 (Right): Dedicated Scrollable Online Players Column */
.ap-online-users-panel {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  height: 100%;
  background: rgba(12, 17, 30, 0.88);
  border: 1px solid rgba(232, 192, 96, 0.55);
  border-radius: 5px;
  padding: 9px 10px;
  gap: 7px;
  overflow: hidden;
}
.ap-online-users-search {
  width: 100%;
  flex: 0 0 auto;
}
.ap-online-users-col-list {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding-right: 3px;
}
.ap-online-user-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 6px;
  background: rgba(24, 36, 64, 0.86);
  border: 1px solid rgba(126, 172, 248, 0.45);
  border-radius: 4px;
  padding: 5px 8px;
  font-size: 11.5px;
  color: #eef5ff;
  flex: 0 0 auto;
}
.ap-online-user-row.is-me {
  border-color: rgba(255, 220, 110, 0.75);
  background: rgba(54, 46, 24, 0.72);
}
.ap-online-user-info {
  display: flex;
  flex-direction: column;
  min-width: 0;
  gap: 1px;
}
.ap-online-user-name {
  font-weight: bold;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ap-online-user-meta {
  font-size: 10px;
  color: #a8c4e8;
}
.ap-online-user-actions {
  display: flex;
  gap: 4px;
  flex: 0 0 auto;
}


/* v100.0: Floating Chat Widget Tabs, Unread DM Blinking Animation, and Online/Offline Player Indicators */
@keyframes apUnreadDmPulse {
  0%, 100% {
    box-shadow: 0 0 8px rgba(255, 210, 72, 0.75), inset 0 0 6px rgba(255, 210, 72, 0.35);
    border-color: #ffd858;
  }
  50% {
    box-shadow: 0 0 18px rgba(88, 255, 158, 0.95), 0 0 28px rgba(255, 196, 56, 0.85), inset 0 0 12px rgba(88, 255, 158, 0.55);
    border-color: #58ff9e;
  }
}
@keyframes apUnreadBadgeBlink {
  0%, 100% {
    background: linear-gradient(180deg, #ffb830 0%, #c86808 100%);
    color: #fff;
    transform: scale(1);
  }
  50% {
    background: linear-gradient(180deg, #36d878 0%, #148844 100%);
    color: #fff;
    transform: scale(1.06);
  }
}
.aetheria-chat-widget.has-unread-dm {
  animation: apUnreadDmPulse 1.15s infinite ease-in-out !important;
}
.aetheria-chat-widget.has-unread-dm .ap-chat-header {
  background: linear-gradient(90deg, rgba(78, 48, 12, 0.95) 0%, rgba(24, 72, 48, 0.95) 100%) !important;
}
.ap-chat-unread-badge {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 1px 6px;
  border-radius: 10px;
  font-size: 10px;
  font-weight: bold;
  border: 1px solid #fff3b0;
  cursor: pointer;
  animation: apUnreadBadgeBlink 0.95s infinite ease-in-out;
  white-space: nowrap;
}
.ap-widget-tabs {
  display: flex;
  gap: 3px;
  margin-bottom: 4px;
}
.ap-widget-tab-btn {
  flex: 1 1 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 3px 5px;
  font-size: 10.5px;
  font-weight: bold;
  color: #b8ccf0;
  background: rgba(16, 24, 44, 0.85);
  border: 1px solid rgba(120, 155, 220, 0.4);
  border-radius: 4px;
  cursor: pointer;
  white-space: nowrap;
}
.ap-widget-tab-btn.active {
  color: #fff4b8;
  background: linear-gradient(180deg, rgba(64, 48, 20, 0.95) 0%, rgba(36, 26, 10, 0.95) 100%);
  border-color: #f0c860;
}
.ap-widget-tab-btn.has-unread-dm {
  animation: apUnreadBadgeBlink 1.05s infinite ease-in-out;
  border-color: #fff090;
}
.ap-widget-dm-bar {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-bottom: 4px;
  font-size: 10.5px;
  color: #e6d4ff;
}
.ap-widget-dm-select {
  flex: 1 1 auto;
  min-width: 0;
  background: rgba(14, 18, 34, 0.95);
  color: #ffe898;
  border: 1px solid rgba(210, 165, 255, 0.55);
  border-radius: 3px;
  padding: 2px 4px;
  font-size: 10.5px;
}
.ap-widget-players-list {
  height: 112px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 3px;
  background: rgba(8, 12, 22, 0.78);
  border: 1px solid rgba(120, 155, 220, 0.3);
  border-radius: 4px;
}
.ap-widget-auth-gate {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 10px 8px;
  text-align: center;
  font-size: 11px;
  color: #c8daf8;
  background: rgba(10, 15, 28, 0.78);
  border: 1px dashed rgba(232, 192, 96, 0.45);
  border-radius: 4px;
}


/* v101.0: Illustrated Bilingual Encyclopedia (Credits), Royal Donate Page & Bug Report Modal */
.ap-codex-modal {
  width: 980px !important;
  max-width: 96vw !important;
  max-height: 92vh !important;
}
.ap-codex-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 12px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(212, 169, 78, 0.45);
}
.ap-codex-tab-btn {
  flex: 1 1 auto;
  min-width: 135px;
  padding: 7px 10px;
  font: bold 12px Georgia, serif;
  color: #e6d29a;
  background: linear-gradient(180deg, #2a2115 0%, #17110a 100%);
  border: 1px solid #967234;
  border-radius: 4px;
  cursor: pointer;
  text-align: center;
  transition: all 0.15s ease;
}
.ap-codex-tab-btn:hover {
  filter: brightness(1.15);
  border-color: #f0c869;
}
.ap-codex-tab-btn.active {
  color: #fff6d1;
  background: linear-gradient(180deg, #8c6422 0%, #4f3510 100%);
  border-color: #ffd86b;
  box-shadow: 0 0 10px rgba(255, 210, 88, 0.45);
}
.ap-codex-tab-btn.donate-tab {
  background: linear-gradient(180deg, #7c1f3c 0%, #440e20 100%);
  border-color: #ff85a8;
  color: #ffe6ee;
}
.ap-codex-tab-btn.donate-tab.active {
  background: linear-gradient(180deg, #b82956 0%, #6e1432 100%);
  border-color: #ffbfd2;
  box-shadow: 0 0 14px rgba(255, 105, 155, 0.7);
}
.ap-codex-pane {
  max-height: 70vh;
  overflow-y: auto;
  padding-right: 6px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.ap-codex-card {
  background: rgba(16, 20, 34, 0.88);
  border: 1px solid rgba(212, 169, 78, 0.55);
  border-radius: 6px;
  padding: 12px 14px;
  color: #f2e2b8;
  line-height: 1.48;
}
.ap-codex-card h4 {
  margin: 0 0 8px 0;
  font: bold 15px Georgia, serif;
  color: #ffe484;
  border-bottom: 1px solid rgba(212, 169, 78, 0.35);
  padding-bottom: 4px;
}
.ap-codex-lore-banner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin: 8px 0;
}
.ap-codex-art-box {
  background: #0c0e16;
  border: 2px ridge #b58d3d;
  border-radius: 4px;
  padding: 6px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  text-align: center;
}
.ap-codex-art-box canvas,
.ap-codex-art-box img {
  max-width: 100%;
  height: auto;
  border: 1px solid #5a441e;
}
.ap-codex-faction-block {
  background: rgba(14, 18, 30, 0.92);
  border: 2px ridge #b38c39;
  border-radius: 6px;
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.ap-codex-faction-top {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 12px;
  align-items: start;
}
.ap-codex-unit-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 8px;
}
.ap-codex-unit-item {
  background: rgba(26, 32, 50, 0.85);
  border: 1px solid rgba(190, 150, 72, 0.45);
  border-radius: 4px;
  padding: 6px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 3px;
  font-size: 11px;
}
.ap-codex-unit-item canvas {
  width: 68px;
  height: 76px;
  object-fit: contain;
}
.ap-donate-royal-box {
  background: radial-gradient(circle at top, rgba(72, 26, 48, 0.92), rgba(16, 14, 26, 0.96));
  border: 2px ridge #f0b858;
  border-radius: 8px;
  padding: 18px 20px;
  text-align: center;
  color: #fff2d0;
  box-shadow: inset 0 0 24px rgba(255, 190, 80, 0.18);
}
.ap-donate-pillars {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin: 14px 0;
  text-align: left;
}
.ap-donate-pillar {
  background: rgba(12, 16, 28, 0.82);
  border: 1px solid rgba(235, 185, 90, 0.5);
  border-radius: 6px;
  padding: 10px;
  font-size: 12px;
}
.ap-donate-cta-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 24px;
  font: bold 15px Georgia, serif;
  color: #fff9e6;
  background: linear-gradient(180deg, #d43f6e 0%, #88183c 100%);
  border: 2px solid #ffd278;
  border-radius: 6px;
  cursor: pointer;
  text-decoration: none;
  box-shadow: 0 4px 16px rgba(212, 63, 110, 0.55);
}
.ap-donate-cta-btn:hover {
  filter: brightness(1.15);
}
.ap-bug-paste-zone {
  border: 2px dashed rgba(232, 192, 96, 0.65);
  background: rgba(10, 14, 26, 0.82);
  border-radius: 6px;
  padding: 12px;
  text-align: center;
  color: #d6e4ff;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease;
}
.ap-bug-paste-zone:hover,
.ap-bug-paste-zone.drag-over {
  border-color: #68ff9e;
  background: rgba(18, 34, 28, 0.85);
}
.ap-bug-preview-img {
  max-width: 100%;
  max-height: 210px;
  border: 1px solid #c99e4c;
  border-radius: 4px;
  margin-top: 8px;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

/* ============================================================================
   v102.0 Harmonious Battlefield Commander Tent & War Standard Presentation
   - Eliminates dark bottom drop-shadow smudging
   - Adds crisp dual-tone contrast halo (warm gold + dark rim) so tents never
     blend with grass, dirt, lava, or snow backgrounds of matching color
   ============================================================================ */
.battle-general.left-general,
.battle-general.right-general {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  overflow: visible !important;
}
.battle-general.left-general img,
.battle-general.right-general img {
  filter: drop-shadow(0 0 1.5px rgba(255, 232, 150, 0.92)) drop-shadow(0 2px 3px rgba(18, 12, 6, 0.68)) brightness(1.04) saturate(1.06) !important;
  transition: transform 0.14s ease, filter 0.14s ease !important;
}
.battle-general.left-general:hover img,
.battle-general.right-general:hover img {
  transform: translateY(-2px) scale(1.03) !important;
  filter: drop-shadow(0 0 3px rgba(255, 240, 170, 1)) drop-shadow(0 3px 5px rgba(18, 12, 6, 0.8)) brightness(1.1) saturate(1.1) !important;
}


/* ============================================================================
 * v103.0 HUD HERO/CASTLE SCROLLING, HIGH-CONTRAST SELECTION FRAME,
 *        LOWERED MAIN MENU TITLE PLAQUE, ROYAL VICTORY MODAL,
 *        ELIMINATION / 7-DAY TOWNLESS MODALS & MOBILE AUTO-ROTATION
 * ============================================================================ */

/* 1. Lower Main Menu Title Plaque so top session HUD bar (#aetheriaPatreonHud) never overlaps it */
.main-menu-title-plaque {
  top: 62px !important;
  z-index: 8 !important;
}

/* 2. High-Contrast, Unmistakable Selection Frame for Active Hero & Active Castle in Right Sidebar */
.hud-heroes,
.hud-towns {
  overflow: hidden !important;
}
.hud-slot.selected {
  outline: 2.5px solid #ffe858 !important;
  outline-offset: -1px !important;
  box-shadow:
    0 0 0 1.5px #05040a,
    0 0 11px 2px rgba(255, 228, 72, 0.95),
    inset 0 0 8px rgba(120, 255, 218, 0.72) !important;
  filter: brightness(1.14) saturate(1.12);
  z-index: 4 !important;
  animation: aetheriaHudSlotPulse 1.6s infinite ease-in-out;
}
@keyframes aetheriaHudSlotPulse {
  0%, 100% {
    box-shadow:
      0 0 0 1.5px #05040a,
      0 0 9px 2px rgba(255, 228, 72, 0.88),
      inset 0 0 7px rgba(120, 255, 218, 0.65);
  }
  50% {
    box-shadow:
      0 0 0 1.5px #05040a,
      0 0 14px 3.5px rgba(255, 240, 110, 1),
      inset 0 0 10px rgba(145, 255, 230, 0.92);
  }
}

/* 3. Interactive Scroll Buttons & Scrollbar Track for Hero & Castle Sidebar Lists */
.hud-scroll-btn {
  position: absolute !important;
  width: 15px !important;
  height: 15px !important;
  padding: 0 !important;
  margin: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  background: rgba(255, 225, 110, 0.01) !important;
  border: 1px solid transparent !important;
  border-radius: 2px !important;
  cursor: pointer !important;
  z-index: 6 !important;
}
.hud-scroll-btn.can-scroll {
  border-color: rgba(255, 224, 102, 0.65) !important;
  box-shadow: 0 0 6px rgba(255, 216, 84, 0.55) !important;
}
.hud-scroll-btn.can-scroll:hover {
  background: rgba(255, 228, 115, 0.28) !important;
  border-color: #ffe868 !important;
}
.hud-scroll-btn:disabled {
  cursor: default !important;
  opacity: 0.45 !important;
}
.hud-hero-scroll-up {
  left: calc(var(--hud-left, 480px) + 57px) !important;
  top: 176px !important;
}
.hud-hero-scroll-down {
  left: calc(var(--hud-left, 480px) + 57px) !important;
  top: 288px !important;
}
.hud-town-scroll-up {
  left: calc(var(--hud-left, 480px) + 129px) !important;
  top: 176px !important;
}
.hud-town-scroll-down {
  left: calc(var(--hud-left, 480px) + 129px) !important;
  top: 288px !important;
}

.hud-scroll-track {
  position: absolute !important;
  top: 192px !important;
  width: 12px !important;
  height: 95px !important;
  z-index: 5 !important;
  cursor: pointer !important;
}
.hud-hero-scroll-track {
  left: calc(var(--hud-left, 480px) + 58px) !important;
}
.hud-town-scroll-track {
  left: calc(var(--hud-left, 480px) + 130px) !important;
}
.hud-scroll-thumb {
  position: absolute;
  left: 1px;
  top: 0;
  width: 8px;
  height: 94px;
  background: linear-gradient(180deg, #ffe082 0%, #c89428 50%, #7c5612 100%);
  border: 1px solid #fff3b8;
  border-radius: 2px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.85);
  pointer-events: none;
  transition: top 0.12s ease, height 0.12s ease;
}

.hud-list-count-badge {
  position: absolute !important;
  top: 164px !important;
  padding: 0 4px !important;
  height: 12px !important;
  line-height: 12px !important;
  background: rgba(14, 20, 36, 0.92) !important;
  border: 1px solid #f0c458 !important;
  border-radius: 3px !important;
  color: #ffe898 !important;
  font: bold 8.5px Tahoma, Verdana, sans-serif !important;
  text-align: center !important;
  z-index: 7 !important;
  pointer-events: none !important;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.9) !important;
}
.hud-hero-count-badge {
  left: calc(var(--hud-left, 480px) + 6px) !important;
}
.hud-town-count-badge {
  left: calc(var(--hud-left, 480px) + 78px) !important;
}

/* 4. Royal Victory Modal (#aetheriaVictoryModal) */
.dos-victory-royal-dialog {
  width: 560px !important;
  max-width: 95vw !important;
  background: radial-gradient(circle at top, #1e2846 0%, #0e1324 65%, #070a14 100%) !important;
  border: 3px ridge #f4c858 !important;
  border-radius: 8px !important;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.95), 0 0 24px rgba(255, 210, 80, 0.35) !important;
  padding: 16px 20px !important;
  color: #fff2cc !important;
}
.aetheria-victory-card {
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: 100%;
}
.av-header {
  display: flex;
  align-items: center;
  gap: 14px;
  background: rgba(10, 14, 26, 0.78);
  border: 1.5px solid rgba(242, 198, 92, 0.65);
  border-radius: 6px;
  padding: 8px 12px;
}
.av-crest {
  width: 52px !important;
  height: 58px !important;
  object-fit: contain !important;
  flex-shrink: 0;
}
.av-header-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  text-align: left;
}
.av-crown-tag {
  font: bold 11px Tahoma, Verdana, sans-serif;
  letter-spacing: 0.9px;
  color: #ffd868;
  text-shadow: 1px 1px 1px #000;
}
.av-winner-title {
  margin: 0;
  font: bold 19px Georgia, serif;
  color: #fff6d2;
  text-shadow: 0 2px 4px #000;
}
.av-sub {
  font-size: 12px;
  color: #bfd6f8;
}
.av-art-box {
  display: flex;
  justify-content: center;
  align-items: center;
  background: #080b14;
  border: 2px ridge #c99e4c;
  border-radius: 4px;
  padding: 4px;
}
.av-art-box canvas {
  width: 223px !important;
  height: 125px !important;
  image-rendering: auto;
}
.av-score-breakdown {
  background: rgba(8, 12, 22, 0.86);
  border: 1px solid rgba(226, 186, 88, 0.55);
  border-radius: 6px;
  padding: 8px 12px;
  display: flex;
  flex-direction: column;
  gap: 5px;
  font-size: 12.5px;
}
.av-score-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px dashed rgba(255, 232, 160, 0.16);
  padding-bottom: 3px;
}
.av-score-row b {
  color: #ffe888;
}
.av-mult-row em {
  color: #8ce8ff;
  font-style: normal;
}
.av-score-total-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 4px;
  font: bold 15px Georgia, serif;
  color: #ffe868;
}
.av-score-total-row strong {
  font-size: 18px;
  color: #78ff9e;
  text-shadow: 0 0 8px rgba(120, 255, 158, 0.45);
}
.av-rank-box {
  display: flex;
  align-items: center;
  gap: 12px;
  background: linear-gradient(90deg, rgba(44, 32, 14, 0.82) 0%, rgba(20, 26, 46, 0.85) 100%);
  border: 1.5px solid #e6bc5a;
  border-radius: 6px;
  padding: 8px 12px;
}
.av-rank-mon {
  width: 68px !important;
  height: 74px !important;
  object-fit: contain !important;
  flex-shrink: 0;
}
.av-rank-info {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 3px;
  text-align: left;
}
.av-rank-lbl {
  font: bold 10px Tahoma, sans-serif;
  color: #c8daf8;
  letter-spacing: 0.4px;
}
.av-rank-name {
  font: bold 16px Georgia, serif;
  color: #ffe888;
  text-shadow: 1px 1px 2px #000;
}
.av-name-input-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 4px;
  font-size: 11.5px;
}
.av-name-input {
  flex: 1;
  background: #0b101d !important;
  border: 1px solid #d8b054 !important;
  border-radius: 4px !important;
  color: #fff5d6 !important;
  padding: 4px 8px !important;
  font: bold 12px Georgia, serif !important;
}
.av-actions {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-top: 4px;
}

/* 5. Player Elimination & 7-Day Townless Warning Modals */
.aetheria-elimination-modal,
.aetheria-townless-modal {
  width: 440px !important;
  max-width: 92vw !important;
  background: radial-gradient(circle at top, #2c1824 0%, #14101e 75%, #090710 100%) !important;
  border: 2.5px ridge #e8b858 !important;
  border-radius: 8px !important;
  padding: 16px 20px !important;
  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.92) !important;
}
.aetheria-elim-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 10px;
}
.aetheria-elim-title {
  margin: 0;
  font: bold 16px Georgia, serif;
  color: #ffe898;
}
.aetheria-elim-desc {
  margin: 0;
  font-size: 13px;
  line-height: 1.45;
  color: #f6e7c4;
}
.aetheria-elim-rem {
  font-size: 12px;
  color: #9ec8ff;
  background: rgba(10, 16, 28, 0.78);
  border: 1px solid rgba(226, 186, 88, 0.45);
  border-radius: 4px;
  padding: 5px 12px;
}

/* 6. Automatic Mobile Browser & Smartphone Adaptation with Auto-Rotation */
.aetheria-mobile-rotate-pill {
  position: fixed;
  bottom: 8px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 9500;
  display: flex;
  align-items: center;
  gap: 6px;
  background: rgba(14, 20, 36, 0.94);
  border: 1.5px solid #ffd268;
  border-radius: 20px;
  padding: 4px 10px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.88);
  max-width: 94vw;
}
.aetheria-mobile-rotate-pill[hidden] {
  display: none !important;
}
.aetheria-mobile-rotate-btn {
  background: transparent;
  border: 0;
  color: #ffe898;
  font: bold 11px Georgia, serif;
  cursor: pointer;
  text-align: center;
}
.aetheria-mobile-rotate-close {
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 210, 104, 0.5);
  color: #fff;
  border-radius: 50%;
  width: 18px;
  height: 18px;
  font-size: 10px;
  line-height: 16px;
  padding: 0;
  cursor: pointer;
}

@media (max-width: 920px), (max-height: 540px) {
  .aetheria-patreon-hud {
    top: 4px !important;
    left: 6px !important;
    right: 6px !important;
    gap: 4px !important;
    flex-wrap: wrap !important;
  }
  .ap-hud-btn {
    padding: 3px 7px !important;
    font-size: 10.5px !important;
  }
  .aetheria-chat-widget {
    max-width: min(320px, 92vw) !important;
  }
  .aetheria-mm-leaderboard {
    width: 250px !important;
    font-size: 10px !important;
    left: 10px !important;
    bottom: 10px !important;
  }
}

body.is-portrait-mobile #mapPane {
  margin-top: 38px !important;
}
body.is-portrait-mobile .aetheria-chat-widget {
  left: 8px !important;
  bottom: 42px !important;
  width: calc(100vw - 16px) !important;
  max-width: none !important;
}


/* ============================================================================
 * v104.0 HIGH-RESOLUTION DEFEAT/VICTORY ART, ILLUSTRATED TUTORIAL & PRELOADER
 * ============================================================================ */
.aetheria-elim-art-wrap {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 4px;
}
.aetheria-elim-scene-canvas,
.battle-result-art {
  width: 280px !important;
  height: 156px !important;
  max-width: 100% !important;
  border-radius: 5px;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.85);
  image-rendering: auto !important;
}
.av-art-box canvas {
  width: 280px !important;
  height: 156px !important;
  image-rendering: auto !important;
}

.ap-tutorial-lesson-card h4 {
  margin: 0 0 8px 0;
  color: #ffe484;
  font: bold 15px Georgia, serif;
  border-bottom: 1px solid rgba(232, 192, 96, 0.35);
  padding-bottom: 4px;
}
.ap-tutorial-row {
  display: grid;
  grid-template-columns: 350px 1fr;
  gap: 14px;
  align-items: start;
}
.ap-tutorial-art-col {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.ap-tutorial-txt-col {
  font-size: 12.5px;
  color: #f4e6c4;
}
.ap-tutorial-txt-col code {
  background: rgba(255, 224, 110, 0.14);
  border: 1px solid rgba(232, 192, 96, 0.45);
  border-radius: 3px;
  padding: 0 4px;
  color: #ffe888;
  font-family: Tahoma, Verdana, sans-serif;
  font-size: 11px;
}
@media (max-width: 820px) {
  .ap-tutorial-row {
    grid-template-columns: 1fr;
  }
}


/* ============================================================================
 * v108.0 CROSS-BROWSER & WIDE/LANDSCAPE SMARTPHONE DIALOG FIT
 * Guarantees every dialog window fits 100% inside mobile (landscape & portrait)
 * and desktop viewports without clipping or overflowing top/bottom edges.
 * ============================================================================ */

/* Universal <dialog> top-layer reset: prevent UA inset:0 / max-height:calc(100%-2em) from clipping or offsetting */
.original-chrome dialog,
dialog.chrome-dialog,
dialog.fantasy-modal,
dialog.aetheria-royal-modal {
  zoom: 1 !important;
  inset: auto !important;
  left: 50% !important;
  top: 50% !important;
  right: auto !important;
  bottom: auto !important;
  margin: 0 !important;
}

/* 1. Fixed-Canvas 640x480 DOS Dialogs (Town, Hero, Overview, Puzzle, High Scores, Credits) */
.original-chrome .original-town,
.original-chrome .original-hero,
.original-chrome .dos-overview-dialog,
.original-chrome .dos-puzzle-dialog,
.original-chrome .dos-hiscore-dialog,
.original-chrome .dos-credits-dialog {
  max-width: none !important;
  max-height: none !important;
  position: fixed !important;
  transform: translate(-50%, -50%) scale(var(--this-dialog-scale, var(--dialog-scale, 1))) !important;
  transform-origin: center center !important;
}

/* 2. Wide 640x262 Dialogs (Castle Build Window & Mage Guild) */
.original-chrome .dos-caslwind-dialog,
.original-chrome .dos-magewind-dialog {
  max-width: none !important;
  max-height: none !important;
  position: fixed !important;
  transform: translate(-50%, -50%) scale(var(--this-dialog-scale, var(--dialog-wide-scale, 1))) !important;
  transform-origin: center center !important;
}

/* 3. Tall & Fixed-Stage DOS Dialogs (322x459 New Game / Scenario / CPanel, 194x410 Redback, 448x448 Swap, 348x242 Spellbook, 320x294 Recruit, 402x229 ViewArmy, 470x205 Surrender, 322x236 Apanel, 250x202 Vgen) */
.original-chrome .dos-newgame-dialog,
.original-chrome .dos-sceninfo-dialog,
.original-chrome .dos-cpanel-dialog,
.original-chrome .dos-redback-dialog,
.original-chrome .dos-swap-dialog,
.original-chrome .dos-spellbook-open,
.original-chrome .dos-spellbook-dialog {
  max-width: none !important;
  max-height: none !important;
  position: fixed !important;
  transform: translate(-50%, -50%) scale(var(--this-dialog-scale, var(--dialog-tall-scale, 1))) !important;
  transform-origin: center center !important;
}

.original-chrome .dos-recruit-dialog,
.original-chrome .dos-viewarmy-dialog,
.original-chrome .dos-surrender-dialog,
.original-chrome .dos-apanel-dialog,
.original-chrome .dos-vgen-dialog {
  max-width: none !important;
  max-height: none !important;
  position: fixed !important;
  transform: translate(-50%, -50%) scale(var(--this-dialog-scale, var(--dialog-compact-scale, 1))) !important;
  transform-origin: center center !important;
}

/* 4. Parchment & Variable-Content Dialogs (#eventModal, BuyBuild, RecruitHero, Tavern, Load, Notice, Thieves, Well, Campaign) */
.original-chrome #eventModal,
.original-chrome .dos-buybuild-dialog,
.original-chrome .dos-rcrthero-dialog,
.original-chrome .dos-tavern-dialog,
.original-chrome .dos-load-dialog,
.original-chrome .dos-notice-dialog,
.original-chrome .dos-thieves-dialog,
.original-chrome .dos-well-dialog,
.original-chrome .dos-campaign-dialog {
  max-width: none !important;
  max-height: none !important;
  position: fixed !important;
  transform: translate(-50%, -50%) scale(var(--this-dialog-scale, var(--dialog-compact-scale, 1))) !important;
  transform-origin: center center !important;
}

/* 5. Royal HTML Modals (Auth, Online Lobby, Encyclopedia/Credits, Bug Report, Victory, Elimination, Townless) */
.aetheria-royal-modal,
.dos-victory-royal-dialog,
.aetheria-elimination-modal,
.aetheria-townless-modal,
#heroSquadModal {
  position: fixed !important;
  left: 50% !important;
  top: 50% !important;
  right: auto !important;
  bottom: auto !important;
  margin: 0 !important;
  transform: translate(-50%, -50%) scale(var(--this-dialog-scale, 1)) !important;
  transform-origin: center center !important;
  max-width: min(96vw, calc(var(--vw-px, 100vw) - 12px)) !important;
  max-height: min(94dvh, calc(var(--vh-px, 100dvh) - 12px)) !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch;
  box-sizing: border-box !important;
}

/* 6. Wide Smartphone / Landscape Mobile Compaction (max-height: 560px or max-width: 960px) */
@media (max-width: 960px), (max-height: 560px) {
  .aetheria-royal-modal,
  .ap-codex-modal,
  .dos-victory-royal-dialog,
  .aetheria-elimination-modal,
  .aetheria-townless-modal {
    width: min(95vw, calc(var(--vw-px, 100vw) - 14px)) !important;
    max-width: min(95vw, calc(var(--vw-px, 100vw) - 14px)) !important;
    max-height: calc(var(--vh-px, 100dvh) - 12px) !important;
  }
  .aetheria-royal-modal .ap-modal-head {
    padding: 6px 12px !important;
  }
  .aetheria-royal-modal .ap-modal-head h3 {
    font-size: 14px !important;
  }
  .aetheria-royal-modal .ap-modal-body {
    max-height: calc(var(--vh-px, 100dvh) - 52px) !important;
    overflow-y: auto !important;
    padding: 8px 10px !important;
  }
  .ap-codex-pane {
    max-height: calc(var(--vh-px, 100dvh) - 102px) !important;
  }
  .ap-codex-faction-top,
  .ap-codex-lore-banner,
  .ap-donate-pillars,
  .ap-tutorial-row {
    grid-template-columns: 1fr !important;
  }
  .ap-lobby-three-col {
    grid-template-columns: 1fr !important;
    overflow-y: auto !important;
  }
  .ap-dm-split-pane {
    grid-template-columns: 130px 1fr !important;
  }
  .aetheria-elim-scene-canvas,
  .av-art-box canvas {
    width: min(190px, 52vw) !important;
    height: auto !important;
    aspect-ratio: 280 / 156 !important;
  }
  .dos-victory-royal-dialog,
  .aetheria-elimination-modal,
  .aetheria-townless-modal {
    padding: 8px 12px !important;
  }
  .aetheria-victory-card,
  .aetheria-elim-card {
    gap: 5px !important;
  }
}