/*
 Crownspire Academy • Mondschloss inventory structural correction.
 Approved authority: Gotische Fantasy-Inventaroberfläche mit Mondschloss.png
 The previous two-column arrangement has been replaced with actual separate
 navigation, character/gear, item grid and item detail zones.
 Original PNG frames, slots, buttons and coins are reused; NO new artwork.
 */
#inventoryDialog.inventory-mondschloss-composition{
 position:relative;
 display:none;
 width:min(1530px,99vw)!important;
 height:min(94dvh,900px)!important;
 max-height:98dvh!important;
 padding:12px 17px 17px!important;
 overflow:hidden!important;
}
#inventoryDialog.inventory-mondschloss-composition[open]{display:flex!important}
#inventoryDialog.inventory-mondschloss-composition>header{
 position:relative;
 height:60px;min-height:60px;flex:0 0 auto;
 margin:0 4px 3px;
 justify-content:center;
}
#inventoryDialog.inventory-mondschloss-composition>header>h2{
 font:500 clamp(20px,2vw,30px)/1.2 Cinzel,Georgia,serif;
 letter-spacing:.11em;color:#e9e8f2;
 text-align:center;text-shadow:0 0 16px #9a7bc949;
}
#inventoryDialog.inventory-mondschloss-composition>header>button.close{
 position:absolute;right:0;top:0;min-width:44px!important;
 width:44px;height:44px;margin:0;
}
/* Actual side navigation, rather than the old top toolbar. */
#inventoryDialog.inventory-mondschloss-composition>.inventory-side-navigation{
 position:absolute!important;
 z-index:9;left:22px;top:109px;bottom:57px;
 width:clamp(117px,12vw,175px);
 height:auto;min-height:0;
 display:flex!important;
 flex-direction:column!important;
 align-items:stretch;justify-content:flex-start;
 gap:8px!important;
 margin:0!important;padding:6px 4px!important;
 background:transparent!important;border:0!important;
}
#inventoryDialog.inventory-mondschloss-composition>.inventory-side-navigation button{
 flex:0 0 auto;
 display:flex;align-items:center;justify-content:center;
 width:100%!important;height:clamp(51px,7.7vh,71px)!important;
 min-width:0!important;min-height:47px!important;
 font:500 14px/1.15 Cinzel,Georgia,serif;
 color:#e6e0ef;white-space:normal;letter-spacing:.035em;
 padding:6px!important;
}
#inventoryDialog.inventory-mondschloss-composition>.inventory-side-navigation button::before{
 background-image:var(--inv-button-strip)!important;
 background-size:100% 100%;
}
/* Layout contains three distinct real elements, not one subdivided right panel. */
#inventoryDialog.inventory-mondschloss-composition>.rpg-layout{
 flex:1 1 auto;
 display:grid!important;
 grid-template-columns:minmax(220px,.94fr) minmax(255px,1.13fr) minmax(190px,.69fr)!important;
 grid-template-rows:minmax(0,1fr)!important;
 align-items:stretch;
 gap:9px!important;
 margin:0 0 0 clamp(125px,13vw,183px)!important;
 padding:5px 0 0!important;
 min-width:0;min-height:0!important;overflow:hidden!important;
}
#inventoryDialog.inventory-mondschloss-composition>.rpg-layout[hidden]{display:none!important}
#inventoryDialog.inventory-mondschloss-composition>.rpg-layout>div{
 position:relative!important;
 display:flex!important;flex-direction:column!important;
 min-width:0!important;min-height:0!important;overflow:hidden!important;
}
#inventoryDialog.inventory-mondschloss-composition>.rpg-layout>div:first-child,
#inventoryDialog.inventory-mondschloss-composition>.rpg-layout>div:nth-child(2),
#inventoryDialog.inventory-mondschloss-composition>.rpg-layout>.inventory-detail-column{
 border:solid transparent!important;
 border-width:19px!important;
 border-image:url('/assets/ui/panel.png') 105 fill / 19px / 0 stretch!important;
 background:#05080de8!important;
 padding:8px!important;
}
#inventoryDialog.inventory-mondschloss-composition .inventory-character-stage{
 min-height:0!important;
 padding:18px 2px 5px!important;
 flex:1 1 auto;
}
#inventoryDialog.inventory-mondschloss-composition .inventory-character-stage>.rpg-preview{
 height:100%!important;min-height:110px!important;flex:1!important;
}
#inventoryDialog.inventory-mondschloss-composition .inventory-character-caption{
 bottom:33px;
}
#inventoryDialog.inventory-mondschloss-composition .equipment-slots{
 inset:28px 4px 38px!important;
}
#inventoryDialog.inventory-mondschloss-composition .equipment-slots .rpg-slot{
 width:clamp(34px,3.5vw,47px)!important;
 height:clamp(34px,3.5vw,47px)!important;
}
#inventoryDialog.inventory-mondschloss-composition>.rpg-layout>div:nth-child(2){
 gap:3px;
}
#inventoryDialog.inventory-mondschloss-composition .rpg-tabs{
 display:grid!important;
 grid-template-columns:repeat(3,minmax(0,1fr));
 gap:3px!important;flex:0 0 auto;
 padding:4px 0 0!important;margin:0 0 8px!important;
}
#inventoryDialog.inventory-mondschloss-composition .rpg-tabs .inventory-png-button{
 display:grid;place-items:center;
 width:100%!important;min-width:0!important;
 min-height:44px!important;height:48px!important;
 font:500 clamp(10px,.9vw,13px)/1.15 Cinzel,Georgia,serif!important;
 padding:4px!important;
}
#inventoryDialog.inventory-mondschloss-composition .rpg-grid{
 flex:1 1 auto;
 height:auto!important;min-height:0!important;
 max-height:100%!important;
 grid-template-columns:repeat(5,minmax(0,1fr));
 grid-auto-rows:clamp(48px,6.5vh,73px);
 gap:3px!important;
 align-content:start;
 padding:3px!important;
 overflow-y:auto!important;
}
#inventoryDialog.inventory-mondschloss-composition .rpg-grid .rpg-slot{
 min-height:48px!important;
 max-height:74px!important;
}
#inventoryDialog.inventory-mondschloss-composition .inventory-permanent-details{
 width:100%;height:100%;
 flex:1 1 auto;min-height:0!important;max-height:none!important;
 display:flex;flex-direction:column;
 margin:0!important;padding:10px 8px!important;
 border:0!important;border-image:none!important;
 background:transparent!important;
 overflow-y:auto!important;
}
#inventoryDialog.inventory-mondschloss-composition .inventory-info-heading{
 margin:0 0 13px!important;
 font:500 15px Cinzel,Georgia,serif;
 letter-spacing:.08em;text-align:center;
}
#inventoryDialog.inventory-mondschloss-composition .inventory-permanent-details .rpg-details{
 flex:1 1 auto;overflow-y:auto;
 text-align:center;min-height:0;
}
#inventoryDialog.inventory-mondschloss-composition .inventory-permanent-details .inventory-info-icon{
 float:none;display:block;
 width:min(130px,80%);height:clamp(80px,15vh,155px);
 margin:5px auto 13px;
 object-fit:contain;
}
#inventoryDialog.inventory-mondschloss-composition .inventory-permanent-details .rpg-details h3{
 font:500 clamp(17px,1.6vw,22px)/1.2 Cinzel,Georgia,serif;
 text-align:center;color:#e9e4f1;
}
#inventoryDialog.inventory-mondschloss-composition .inventory-permanent-details .rpg-details p{
 line-height:1.45;
}
#inventoryDialog.inventory-mondschloss-composition .inventory-item-menu{
 z-index:45;
 width:min(305px,94%)!important;
 max-height:min(72%,460px)!important;
 top:50px;right:10px;left:auto;
}
#inventoryDialog.inventory-mondschloss-composition .rpg-toast{
 flex:0 0 auto;text-align:center;min-height:22px!important;
}
/* Currency counters are immediately visible near the upper-right header. */
#inventoryDialog.inventory-mondschloss-composition>.rpg-coins{
 position:absolute;z-index:3;
 top:70px;right:36px;left:auto;bottom:auto;
 width:auto;min-width:250px;height:36px;min-height:36px;
 margin:0!important;padding:0 5px!important;
 border:0!important;
 display:flex;justify-content:flex-end;gap:clamp(8px,1.5vw,20px);
}
#inventoryDialog.inventory-mondschloss-composition .rpg-coins img{
 width:26px;height:26px;
}
#inventoryDialog.inventory-mondschloss-composition .inventory-skills-page,
#inventoryDialog.inventory-mondschloss-composition .inventory-codex-page,
#inventoryDialog.inventory-mondschloss-composition .inventory-stats-page{
 margin:0 0 0 clamp(125px,13vw,183px);
}
/* Tablet portrait: keep panel order, reduce side rail, preserve usable touch targets. */
@media(max-width:1050px) and (min-width:701px){
 #inventoryDialog.inventory-mondschloss-composition>.inventory-side-navigation{
  left:17px;width:99px;
 }
 #inventoryDialog.inventory-mondschloss-composition>.inventory-side-navigation button{
  font-size:11px!important;min-height:45px!important;
 }
 #inventoryDialog.inventory-mondschloss-composition>.rpg-layout{
  margin-left:110px!important;
  grid-template-columns:minmax(175px,.85fr) minmax(200px,1.15fr) minmax(150px,.7fr)!important;
  gap:5px!important;
 }
 #inventoryDialog.inventory-mondschloss-composition>.rpg-layout>div{
  border-width:13px!important;
  border-image:url('/assets/ui/panel.png') 105 fill / 13px / 0 stretch!important;
  padding:4px!important;
 }
 #inventoryDialog.inventory-mondschloss-composition .equipment-slots .rpg-slot{
  width:36px!important;height:36px!important;
 }
 #inventoryDialog.inventory-mondschloss-composition .inventory-rpg-tabs .inventory-png-button{
  font-size:10px!important;
 }
 #inventoryDialog.inventory-mondschloss-composition .inventory-skills-page,
 #inventoryDialog.inventory-mondschloss-composition .inventory-codex-page,
 #inventoryDialog.inventory-mondschloss-composition .inventory-stats-page{margin-left:110px}
}
/* Phone: same three real panels in a compact vertically stacked flow. */
@media(max-width:700px){
 #inventoryDialog.inventory-mondschloss-composition{
  width:100vw!important;max-width:100vw!important;
  height:100dvh!important;max-height:100dvh!important;
  padding:3px!important;
 }
 #inventoryDialog.inventory-mondschloss-composition>header{
  height:36px;min-height:36px;margin:0;
 }
 #inventoryDialog.inventory-mondschloss-composition>header>h2{font-size:16px}
 #inventoryDialog.inventory-mondschloss-composition>header>button.close{
  right:2px;top:0;height:36px;width:36px;min-width:36px!important;
 }
 #inventoryDialog.inventory-mondschloss-composition>.inventory-side-navigation{
  position:relative!important;
  top:auto;bottom:auto;left:auto;right:auto;
  width:100%!important;height:42px;min-height:42px;
  display:flex!important;flex-direction:row!important;
  flex:0 0 42px;
  gap:3px!important;padding:0!important;
  margin:0!important;
 }
 #inventoryDialog.inventory-mondschloss-composition>.inventory-side-navigation button{
  flex:1 1 0;
  width:auto!important;height:42px!important;min-height:42px!important;
  font-size:10px!important;padding:2px!important;
 }
 #inventoryDialog.inventory-mondschloss-composition>.rpg-layout{
  margin:0!important;padding:0!important;
  grid-template-columns:minmax(0,1fr)!important;
  grid-template-rows:minmax(125px,.95fr) minmax(175px,1.3fr) minmax(85px,.6fr)!important;
  gap:3px!important;min-height:0!important;
 }
 #inventoryDialog.inventory-mondschloss-composition>.rpg-layout>div:first-child,
 #inventoryDialog.inventory-mondschloss-composition>.rpg-layout>div:nth-child(2),
 #inventoryDialog.inventory-mondschloss-composition>.rpg-layout>.inventory-detail-column{
  border-width:12px!important;
  border-image:url('/assets/ui/panel.png') 105 fill / 12px / 0 stretch!important;
  padding:2px!important;
 }
 #inventoryDialog.inventory-mondschloss-composition .inventory-character-stage{
  padding:11px 0 0!important;
 }
 #inventoryDialog.inventory-mondschloss-composition .inventory-character-stage>.rpg-preview{
  min-height:80px!important;
 }
 #inventoryDialog.inventory-mondschloss-composition .inventory-character-caption{bottom:19px;font-size:11px}
 #inventoryDialog.inventory-mondschloss-composition .equipment-slots{inset:14px 4px 21px!important}
 #inventoryDialog.inventory-mondschloss-composition .equipment-slots .rpg-slot{
  width:clamp(30px,8vw,37px)!important;height:clamp(30px,8vw,37px)!important;
 }
 #inventoryDialog.inventory-mondschloss-composition .rpg-tabs{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1px!important;margin:0!important;padding:0!important;
 }
 #inventoryDialog.inventory-mondschloss-composition .rpg-tabs .inventory-png-button{
  height:31px!important;min-height:31px!important;
  font-size:10px!important;padding:2px!important;
 }
 #inventoryDialog.inventory-mondschloss-composition .rpg-grid{
  grid-template-columns:repeat(5,minmax(0,1fr));
  grid-auto-rows:42px;min-height:35px!important;max-height:100%!important;
 }
 #inventoryDialog.inventory-mondschloss-composition .rpg-grid .rpg-slot{
  min-height:40px!important;height:42px!important;
 }
 #inventoryDialog.inventory-mondschloss-composition>.rpg-coins{
  position:relative;top:auto;right:auto;
  width:100%;min-width:0;max-width:100%;
  height:30px;min-height:30px;
  margin:0!important;justify-content:center;
 }
 #inventoryDialog.inventory-mondschloss-composition .rpg-coins img{width:20px;height:20px}
 #inventoryDialog.inventory-mondschloss-composition .inventory-permanent-details{
  padding:2px 5px!important;max-height:none!important;
 }
 #inventoryDialog.inventory-mondschloss-composition .inventory-permanent-details .inventory-info-heading{
  font-size:11px;margin:0 0 3px!important;
 }
 #inventoryDialog.inventory-mondschloss-composition .inventory-permanent-details .inventory-info-icon{
  float:left;width:44px;height:44px;margin:2px 7px 2px 0;
 }
 #inventoryDialog.inventory-mondschloss-composition .inventory-permanent-details .rpg-details h3{
  font-size:14px;
 }
 #inventoryDialog.inventory-mondschloss-composition .inventory-skills-page,
 #inventoryDialog.inventory-mondschloss-composition .inventory-codex-page,
 #inventoryDialog.inventory-mondschloss-composition .inventory-stats-page{margin:0}
}
@media(max-width:700px) and (max-height:610px){
 #inventoryDialog.inventory-mondschloss-composition>.rpg-layout{
  grid-template-rows:minmax(90px,.7fr) minmax(125px,1fr) minmax(80px,.5fr)!important;
 }
}
@media(max-width:700px) and (orientation:landscape) and (max-height:490px){
 #inventoryDialog.inventory-mondschloss-composition>.rpg-layout{
  grid-template-columns:minmax(125px,.9fr) minmax(170px,1.15fr) minmax(120px,.75fr)!important;
  grid-template-rows:minmax(0,1fr)!important;
 }
}