/* v561 shared inventory/chest/trade skin.
   Keep each panel's established behavior; use a flat blue frame and teal slots. */
:root {
  --inv561-frame-top: #13778d;
  --inv561-frame-mid: #13778d;
  --inv561-frame-bottom: #13778d;
  --inv561-frame-edge: #174956;
  --inv561-content-top: #13778d;
  --inv561-content-bottom: #13778d;
  --inv561-slot-top: #4f9295;
  --inv561-slot-bottom: #4f9295;
  --inv561-slot-edge: #1e5d62;
  --inv561-text: #f1f6ee;
}

/* Matching outer card treatment for player inventory, both chests and trade. */
#inventory.inventory.game-panel.inventory-window-v561,
#chestPanel.inventory.chest-panel.game-panel.inventory-window-v561,
#structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561,
#tradePanel.trade-panel.social-panel.inventory-window-v561 {
  box-sizing: border-box !important;
  padding: 8px !important;
  border: 4px solid var(--inv561-frame-edge) !important;
  border-radius: 16px !important;
  background: #13778d !important;
  color: var(--inv561-text) !important;
  box-shadow: 0 6px 0 rgba(3, 35, 50, .48), 0 18px 38px rgba(0, 0, 0, .28), inset 0 2px 0 rgba(255, 255, 255, .24) !important;
  opacity: .98 !important;
  overflow: visible !important;
}

#inventory.inventory.game-panel.inventory-window-v561 {
  width: 544px !important;
  max-width: 544px !important;
  height: 440px !important;
  max-height: 440px !important;
}

#chestPanel.inventory.chest-panel.game-panel.inventory-window-v561,
#structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561 {
  width: 544px !important;
  max-width: 544px !important;
  height: 560px !important;
  max-height: 560px !important;
}

/* Keep the same header, title and close-button placement on every container. */
#inventory.inventory-window-v561 .inventory-shell-v561,
#chestPanel.inventory-window-v561 .inventory-shell-v561,
#structurePanel.inventory-window-v561 .inventory-shell-v561,
#tradePanel.inventory-window-v561 .social-body {
  box-sizing: border-box !important;
  min-width: 0 !important;
  min-height: 0 !important;
}

#inventory.inventory-window-v561 .inventory-shell-v561,
#chestPanel.inventory-window-v561 .inventory-shell-v561,
#structurePanel.inventory-window-v561 .storagechest-shell-v325 {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  height: 100% !important;
  padding: 3px 5px 5px !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

#inventory.inventory-window-v561 .inventory-header-v561,
#chestPanel.inventory-window-v561 .inventory-header-v561,
#structurePanel.inventory-window-v561 .inventory-header-v561,
#tradePanel.inventory-window-v561 .inventory-header-v561 {
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  min-height: 50px !important;
  height: 50px !important;
  margin: 0 !important;
  padding: 2px 8px 7px !important;
  border: 0 !important;
  background: transparent !important;
}

#inventory.inventory-window-v561 .inventory-title-v561,
#chestPanel.inventory-window-v561 .inventory-title-v561,
#structurePanel.inventory-window-v561 .inventory-title-v561,
#tradePanel.inventory-window-v561 .inventory-title-v561 {
  color: var(--inv561-text) !important;
  font-size: 25px !important;
  font-weight: 900 !important;
  line-height: 1.1 !important;
  text-shadow: 0 2px 0 rgba(4, 34, 48, .72) !important;
}

/* Base teal slots. Item images and counts remain untouched. */
#inventory.inventory-window-v561 .inventory-grid-v561,
#chestPanel.inventory-window-v561 .inventory-grid-v561,
#structurePanel.inventory-window-v561 .storagechest-grid-v319 {
  box-sizing: border-box !important;
  flex: 1 1 auto !important;
  display: grid !important;
  justify-content: center !important;
  align-content: center !important;
  min-width: 0 !important;
  min-height: 0 !important;
  width: 100% !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 8px !important;
  border: 3px solid rgba(5, 43, 59, .98) !important;
  border-radius: 11px !important;
  background: #126f86 !important;
  box-shadow: inset 0 2px 0 rgba(114, 215, 229, .12) !important;
  overflow: hidden !important;
}

#inventory.inventory-window-v561 .inventory-grid-v561--player {
  grid-template-columns: repeat(7, 66px) !important;
  grid-auto-rows: 66px !important;
  gap: 8px !important;
}

#chestPanel.inventory-window-v561 .inventory-grid-v561--storage,
#structurePanel.inventory-window-v561 .storagechest-grid-v319 {
  grid-template-columns: repeat(6, 56px) !important;
  grid-auto-rows: 56px !important;
  gap: 8px !important;
}

#inventory.inventory-window-v561 .inventory-slot-v561,
#chestPanel.inventory-window-v561 .inventory-slot-v561,
#structurePanel.inventory-window-v561 .storagechest-slot-v319 {
  box-sizing: border-box !important;
  min-width: 0 !important;
  padding: 2px !important;
  border: 2px solid var(--inv561-slot-edge) !important;
  border-radius: 9px !important;
  background-color: var(--inv561-slot-bottom) !important;
  box-shadow: inset 0 1px 0 rgba(164, 229, 233, .16), 0 2px 0 rgba(3, 27, 42, .40) !important;
}

#inventory.inventory-window-v561 .inventory-grid-v561--player .inventory-slot-v561 {
  width: 66px !important;
  min-width: 66px !important;
  height: 66px !important;
  min-height: 66px !important;
}

#chestPanel.inventory-window-v561 .inventory-grid-v561--storage .inventory-slot-v561,
#structurePanel.inventory-window-v561 .storagechest-grid-v319 .storagechest-slot-v319 {
  width: 56px !important;
  min-width: 56px !important;
  height: 56px !important;
  min-height: 56px !important;
}

#inventory.inventory-window-v561 .inventory-slot-v561:empty,
#chestPanel.inventory-window-v561 .inventory-slot-v561:empty,
#structurePanel.inventory-window-v561 .storagechest-slot-v319:empty {
  background-image: none !important;
}

#inventory.inventory-window-v561 .inventory-slot-v561:hover,
#inventory.inventory-window-v561 .inventory-slot-v561.selected,
#inventory.inventory-window-v561 .inventory-slot-v561.picked,
#chestPanel.inventory-window-v561 .inventory-slot-v561:hover,
#chestPanel.inventory-window-v561 .inventory-slot-v561.selected,
#chestPanel.inventory-window-v561 .inventory-slot-v561.picked,
#structurePanel.inventory-window-v561 .storagechest-slot-v319:hover,
#structurePanel.inventory-window-v561 .storagechest-slot-v319.selected,
#structurePanel.inventory-window-v561 .storagechest-slot-v319.picked {
  border-color: #9ce8f2 !important;
  background-color: #298198 !important;
  box-shadow: inset 0 0 0 1px rgba(185, 238, 242, .22), 0 0 8px rgba(37, 175, 206, .34) !important;
}

/* Keep the chest actions in the same blue palette and preserve their behavior. */
#chestPanel.inventory-window-v561 .chest-actions-v325,
#structurePanel.inventory-window-v561 .chest-actions-v325 {
  display: flex !important;
  gap: 10px !important;
  margin: 9px 2px 0 !important;
}

#chestPanel.inventory-window-v561 .chest-bulk-button-v325,
#structurePanel.inventory-window-v561 .chest-bulk-button-v325 {
  flex: 1 1 0 !important;
  min-width: 0 !important;
}

#chestPanel.inventory-window-v561 .chest-note,
#structurePanel.inventory-window-v561 .storagechest-note-v325 {
  margin: 7px 2px 0 !important;
  color: #f1f6ee !important;
  text-align: center !important;
}

/* Trade uses the same frame/inset/cell colors without changing offer controls. */
#tradePanel.inventory-window-v561 .social-head,
#tradePanel.inventory-window-v561 .inventory-header-v561 {
  min-height: 50px !important;
  height: 50px !important;
  padding: 2px 8px 7px !important;
  border: 0 !important;
  background: transparent !important;
}

#tradePanel.inventory-window-v561 .social-title,
#tradePanel.inventory-window-v561 .trade-modern-title {
  color: var(--inv561-text) !important;
  font-size: 25px !important;
  font-weight: 900 !important;
  text-shadow: 0 2px 0 rgba(4, 34, 48, .72) !important;
}

#tradePanel.inventory-window-v561 .social-body,
#tradePanel.inventory-window-v561 .ahardice-trade-body-v148 {
  box-sizing: border-box !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 9px !important;
  border: 3px solid rgba(5, 43, 59, .98) !important;
  border-radius: 11px !important;
  background: #126f86 !important;
  color: var(--inv561-text) !important;
}

#tradePanel.inventory-window-v561 .ahardice-trade-row-v148,
#tradePanel.inventory-window-v561 .ahardice-trade-empty-v192,
#tradePanel.inventory-window-v561 .trade-modern-offer,
#tradePanel.inventory-window-v561 .trade-stack-list {
  border-color: var(--inv561-slot-edge) !important;
  border-radius: 9px !important;
  background-color: #57969c !important;
  color: var(--inv561-text) !important;
}

#tradePanel.inventory-window-v561 .trade-offer-grid {
  border-color: rgba(5, 43, 59, .98) !important;
  border-radius: 10px !important;
  background: #126f86 !important;
}

#tradePanel.inventory-window-v561 .trade-offer-slot {
  border-color: var(--inv561-slot-edge) !important;
  border-radius: 8px !important;
  background-color: var(--inv561-slot-bottom) !important;
  box-shadow: inset 0 1px 0 rgba(164, 229, 233, .16) !important;
}

/* The reference close button's cyan face; keep the existing 38px hit target. */
#inventory.inventory-window-v561 .panel-close,
#chestPanel.inventory-window-v561 .panel-close,
#structurePanel.inventory-window-v561 .panel-close,
#tradePanel.inventory-window-v561 .panel-close {
  border-color: #176076 !important;
  border-radius: 6px !important;
  background: #48a8bb !important;
  color: #f2fbf8 !important;
  text-shadow: 0 1px 1px rgba(10, 64, 76, .55) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .20), 0 2px 0 rgba(5, 57, 70, .30) !important;
}

@media (max-width: 900px) {
  #inventory.inventory.game-panel.inventory-window-v561,
  #chestPanel.inventory.chest-panel.game-panel.inventory-window-v561,
  #structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561,
  #tradePanel.trade-panel.social-panel.inventory-window-v561 {
    width: min(544px, calc(100vw - 24px)) !important;
    max-width: calc(100vw - 24px) !important;
  }

  #inventory.inventory-window-v561 .inventory-grid-v561--player {
    grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
    grid-auto-rows: minmax(0, 1fr) !important;
  }

  #inventory.inventory-window-v561 .inventory-grid-v561--player .inventory-slot-v561 {
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 1 !important;
  }
}

/* Match the intended v561 cell geometry over the legacy inventory selectors. */
#inventory.inventory.game-panel #inventoryGrid.inventory-grid.inventory-grid-v561--player,
body.trade-active #inventory.inventory.game-panel #inventoryGrid.inventory-grid.inventory-grid-v561--player,
body.chest-open-v198 #inventory.inventory.game-panel #inventoryGrid.inventory-grid.inventory-grid-v561--player,
body.structure-storagechest-open-v325 #inventory.inventory.game-panel #inventoryGrid.inventory-grid.inventory-grid-v561--player {
  grid-template-columns: repeat(7, 66px) !important;
  grid-auto-rows: 66px !important;
  gap: 4px !important;
}

#inventory.inventory.game-panel #inventoryGrid.inventory-grid.inventory-grid-v561--player > .inventory-slot.inventory-slot-v561,
body.trade-active #inventory.inventory.game-panel #inventoryGrid.inventory-grid.inventory-grid-v561--player > .inventory-slot.inventory-slot-v561,
body.chest-open-v198 #inventory.inventory.game-panel #inventoryGrid.inventory-grid.inventory-grid-v561--player > .inventory-slot.inventory-slot-v561,
body.structure-storagechest-open-v325 #inventory.inventory.game-panel #inventoryGrid.inventory-grid.inventory-grid-v561--player > .inventory-slot.inventory-slot-v561 {
  box-sizing: border-box !important;
  width: 66px !important;
  min-width: 66px !important;
  height: 66px !important;
  min-height: 66px !important;
  border: 2px solid var(--inv561-slot-edge) !important;
  border-radius: 9px !important;
  background-color: var(--inv561-slot-bottom) !important;
}

#chestPanel.inventory.chest-panel.game-panel #chestGrid.inventory-grid.inventory-grid-v561--storage,
#structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561 .storagechest-grid-v319 {
  grid-template-columns: repeat(6, 56px) !important;
  grid-auto-rows: 56px !important;
  gap: 8px !important;
}

/* Preserve the cyan Dynast.io-style close face over legacy green button rules. */
#inventory.inventory.game-panel .panel-close.floating-close,
#chestPanel.inventory.chest-panel.game-panel .panel-close.floating-close,
#structurePanel.structure-panel.storagechest-modern-v325 .structure-close.floating-close,
#tradePanel.trade-panel.social-panel .social-close.floating-close,
#tradePanel.trade-panel.social-panel .panel-close.floating-close {
  border-color: #176076 !important;
  border-radius: 6px !important;
  background: #48a8bb !important;
  color: #f2fbf8 !important;
  text-shadow: 0 1px 1px rgba(10, 64, 76, .55) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .20), 0 2px 0 rgba(5, 57, 70, .30) !important;
}

/* Final cascade guard for dynamic inventory close buttons. */
html body #inventory.inventory.game-panel.inventory-window-v561 .inventory-header-v561 > button.panel-close.floating-close.inventory-close-v561,
html body #chestPanel.inventory.chest-panel.game-panel.inventory-window-v561 .inventory-header-v561 > button.panel-close.floating-close.inventory-close-v561,
html body #structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561 .inventory-header-v561 > button.structure-close.panel-close.floating-close.inventory-close-v561,
html body #tradePanel.trade-panel.social-panel.inventory-window-v561 .inventory-header-v561 > button.social-close.panel-close.floating-close.inventory-close-v561 {
  border-color: #176076 !important;
  border-radius: 6px !important;
  background: #48a8bb !important;
  color: #f2fbf8 !important;
  text-shadow: 0 1px 1px rgba(10, 64, 76, .55) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .20), 0 2px 0 rgba(5, 57, 70, .30) !important;
}



/* Replace legacy brown inset/slot colors after the old high-specificity rules. */
#inventory.inventory.game-panel #inventoryGrid.inventory-grid.inventory-grid-v561--player,
body.trade-active #inventory.inventory.game-panel #inventoryGrid.inventory-grid.inventory-grid-v561--player,
body.chest-open-v198 #inventory.inventory.game-panel #inventoryGrid.inventory-grid.inventory-grid-v561--player,
body.structure-storagechest-open-v325 #inventory.inventory.game-panel #inventoryGrid.inventory-grid.inventory-grid-v561--player,
#chestPanel.inventory.chest-panel.game-panel #chestGrid.inventory-grid.inventory-grid-v561--storage,
body.chest-open-v198 #chestPanel.inventory.chest-panel.game-panel #chestGrid.inventory-grid.inventory-grid-v561--storage,
#structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561 .storagechest-grid-v319,
body.structure-storagechest-open-v325 #structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561 .storagechest-grid-v319 {
  border-color: rgba(5, 43, 59, .98) !important;
  background: #126f86 !important;
  box-shadow: inset 0 2px 0 rgba(114, 215, 229, .12) !important;
}

#inventory.inventory.game-panel #inventoryGrid.inventory-grid.inventory-grid-v561--player > .inventory-slot.inventory-slot-v561,
body.trade-active #inventory.inventory.game-panel #inventoryGrid.inventory-grid.inventory-grid-v561--player > .inventory-slot.inventory-slot-v561,
body.chest-open-v198 #inventory.inventory.game-panel #inventoryGrid.inventory-grid.inventory-grid-v561--player > .inventory-slot.inventory-slot-v561,
body.structure-storagechest-open-v325 #inventory.inventory.game-panel #inventoryGrid.inventory-grid.inventory-grid-v561--player > .inventory-slot.inventory-slot-v561,
#chestPanel.inventory.chest-panel.game-panel #chestGrid.inventory-grid.inventory-grid-v561--storage > .inventory-slot.inventory-slot-v561,
body.chest-open-v198 #chestPanel.inventory.chest-panel.game-panel #chestGrid.inventory-grid.inventory-grid-v561--storage > .inventory-slot.inventory-slot-v561,
#structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561 .storagechest-grid-v319 > .storagechest-slot-v319,
body.structure-storagechest-open-v325 #structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561 .storagechest-grid-v319 > .storagechest-slot-v319 {
  border-color: var(--inv561-slot-edge) !important;
  background-color: var(--inv561-slot-bottom) !important;
  box-shadow: inset 0 1px 0 rgba(164, 229, 233, .16), 0 2px 0 rgba(3, 27, 42, .40) !important;
}

#inventory.inventory.game-panel #inventoryGrid.inventory-grid.inventory-grid-v561--player > .inventory-slot.inventory-slot-v561:not([style*="background-image"]),
body.trade-active #inventory.inventory.game-panel #inventoryGrid.inventory-grid.inventory-grid-v561--player > .inventory-slot.inventory-slot-v561:not([style*="background-image"]),
body.chest-open-v198 #inventory.inventory.game-panel #inventoryGrid.inventory-grid.inventory-grid-v561--player > .inventory-slot.inventory-slot-v561:not([style*="background-image"]),
#chestPanel.inventory.chest-panel.game-panel #chestGrid.inventory-grid.inventory-grid-v561--storage > .inventory-slot.inventory-slot-v561:not([style*="background-image"]),
body.chest-open-v198 #chestPanel.inventory.chest-panel.game-panel #chestGrid.inventory-grid.inventory-grid-v561--storage > .inventory-slot.inventory-slot-v561:not([style*="background-image"]),
#structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561 .storagechest-grid-v319 > .storagechest-slot-v319:not([style*="background-image"]),
body.structure-storagechest-open-v325 #structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561 .storagechest-grid-v319 > .storagechest-slot-v319:not([style*="background-image"]) {
  background-image: none !important;
}

#tradePanel.trade-panel.social-panel.inventory-window-v561 .social-body,
#tradePanel.trade-panel.social-panel.inventory-window-v561 .ahardice-trade-body-v148,
body.trade-active #tradePanel.trade-panel.social-panel .social-body,
body.trade-active #tradePanel.trade-panel.social-panel .ahardice-trade-body-v148,
body.trade-session-active #tradePanel.trade-panel.social-panel .social-body,
body.trade-session-active #tradePanel.trade-panel.social-panel .ahardice-trade-body-v148 {
  border-color: rgba(5, 43, 59, .98) !important;
  background: #126f86 !important;
  color: var(--inv561-text) !important;
}

#tradePanel.trade-panel.social-panel.inventory-window-v561 .ahardice-trade-row-v148,
#tradePanel.trade-panel.social-panel.inventory-window-v561 .ahardice-trade-empty-v192,
#tradePanel.trade-panel.social-panel.inventory-window-v561 .trade-modern-offer,
#tradePanel.trade-panel.social-panel.inventory-window-v561 .trade-stack-list,
body.trade-active #tradePanel.trade-panel.social-panel .trade-modern-offer,
body.trade-active #tradePanel.trade-panel.social-panel .trade-stack-list,
body.trade-session-active #tradePanel.trade-panel.social-panel .trade-modern-offer,
body.trade-session-active #tradePanel.trade-panel.social-panel .trade-stack-list {
  border-color: var(--inv561-slot-edge) !important;
  background-color: var(--inv561-content-top) !important;
  color: var(--inv561-text) !important;
}

#tradePanel.trade-panel.social-panel.inventory-window-v561 .trade-offer-grid,
body.trade-active #tradePanel.trade-panel.social-panel .trade-offer-grid,
body.trade-session-active #tradePanel.trade-panel.social-panel .trade-offer-grid {
  border-color: rgba(5, 43, 59, .98) !important;
  background: #126f86 !important;
}

#tradePanel.trade-panel.social-panel.inventory-window-v561 .trade-offer-slot,
body.trade-active #tradePanel.trade-panel.social-panel .trade-offer-slot,
body.trade-session-active #tradePanel.trade-panel.social-panel .trade-offer-slot {
  border-color: var(--inv561-slot-edge) !important;
  background-color: var(--inv561-slot-bottom) !important;
  box-shadow: inset 0 1px 0 rgba(164, 229, 233, .16) !important;
}

/* Flat blue palette shared by inventory, chest and trade surfaces. */
html body #inventory.inventory.game-panel.inventory-window-v561,
html body #chestPanel.inventory.chest-panel.game-panel.inventory-window-v561,
html body #structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561,
html body #tradePanel.trade-panel.social-panel.inventory-window-v561 {
  background: #13778d !important;
}

html body #inventory.inventory.game-panel.inventory-window-v561 #inventoryGrid.inventory-grid,
html body #chestPanel.inventory.chest-panel.game-panel.inventory-window-v561 #chestGrid.inventory-grid,
html body #structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561 .storagechest-grid-v319,
html body #tradePanel.trade-panel.social-panel.inventory-window-v561 .social-body,
html body #tradePanel.trade-panel.social-panel.inventory-window-v561 .ahardice-trade-body-v148,
html body #tradePanel.trade-panel.social-panel.inventory-window-v561 .trade-offer-grid {
  border-color: #174956 !important;
  background: #13778d !important;
  box-shadow: inset 0 1px 0 rgba(137, 215, 223, .12) !important;
}

html body #inventory.inventory.game-panel.inventory-window-v561 #inventoryGrid.inventory-grid > .inventory-slot,
html body #chestPanel.inventory.chest-panel.game-panel.inventory-window-v561 #chestGrid.inventory-grid > .inventory-slot,
html body #structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561 .storagechest-grid-v319 > .storagechest-slot-v319,
html body #tradePanel.trade-panel.social-panel.inventory-window-v561 .trade-offer-slot {
  border-color: #1e5d62 !important;
  background-color: #4f9295 !important;
  box-shadow: inset 0 1px 0 rgba(194, 233, 231, .15), 0 1px 0 rgba(4, 46, 62, .28) !important;
}

html body #inventory.inventory.game-panel.inventory-window-v561 #inventoryGrid.inventory-grid > .inventory-slot:empty,
html body #chestPanel.inventory.chest-panel.game-panel.inventory-window-v561 #chestGrid.inventory-grid > .inventory-slot:empty,
html body #structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561 .storagechest-grid-v319 > .storagechest-slot-v319:empty {
  background-image: none !important;
}

html body #tradePanel.trade-panel.social-panel.inventory-window-v561 .ahardice-trade-row-v148,
html body #tradePanel.trade-panel.social-panel.inventory-window-v561 .ahardice-trade-empty-v192,
html body #tradePanel.trade-panel.social-panel.inventory-window-v561 .trade-modern-offer,
html body #tradePanel.trade-panel.social-panel.inventory-window-v561 .trade-stack-list {
  border-color: #1e5d62 !important;
  background: #4f9295 !important;
}

html body #inventory.inventory.game-panel.inventory-window-v561 .inventory-header-v561 > .panel-close,
html body #chestPanel.inventory.chest-panel.game-panel.inventory-window-v561 .inventory-header-v561 > .panel-close,
html body #structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561 .inventory-header-v561 > .panel-close,
html body #tradePanel.trade-panel.social-panel.inventory-window-v561 .social-close,
html body #tradePanel.trade-panel.social-panel.inventory-window-v561 .panel-close {
  border-color: #1f6c7a !important;
  background: #98c4c6 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .20), 0 2px 0 rgba(5, 57, 70, .30) !important;
}

/* Match the supplied Dynast.io inventory reference: slots sit directly on the panel. */
html body #inventory.inventory.game-panel.inventory-window-v561 {
  width: 544px !important;
  max-width: 544px !important;
  height: 440px !important;
  max-height: 440px !important;
  padding: 13px 11px 11px 17px !important;
  border: 2px solid #174956 !important;
  border-radius: 12px !important;
  background: #13778d !important;
  box-shadow: 0 2px 0 rgba(3, 42, 57, .36), 0 6px 12px rgba(0, 0, 0, .15) !important;
}

html body #inventory.inventory.game-panel.inventory-window-v561 .inventory-shell-v561 {
  width: 100% !important;
  height: 100% !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

html body #inventory.inventory.game-panel.inventory-window-v561 .inventory-header-v561 {
  flex: 0 0 52px !important;
  min-height: 52px !important;
  height: 52px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

html body #inventory.inventory.game-panel.inventory-window-v561 .inventory-title-v561 {
  color: #e9f0e8 !important;
  font-size: 25px !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 1px rgba(3, 51, 66, .45) !important;
}

html body #inventory.inventory.game-panel.inventory-window-v561 #inventoryGrid.inventory-grid.inventory-grid-v561--player {
  flex: 1 1 auto !important;
  display: grid !important;
  grid-template-columns: repeat(7, 67px) !important;
  grid-template-rows: repeat(5, 67px) !important;
  grid-auto-rows: 67px !important;
  justify-content: center !important;
  align-content: start !important;
  gap: 6px !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

html body #inventory.inventory.game-panel.inventory-window-v561 #inventoryGrid.inventory-grid.inventory-grid-v561--player > .inventory-slot.inventory-slot-v561 {
  box-sizing: border-box !important;
  width: 67px !important;
  min-width: 67px !important;
  height: 67px !important;
  min-height: 67px !important;
  padding: 2px !important;
  border: 1px solid #1e5d62 !important;
  border-radius: 7px !important;
  background-color: #4f9295 !important;
  box-shadow: none !important;
}

html body #inventory.inventory.game-panel.inventory-window-v561 #inventoryGrid.inventory-grid.inventory-grid-v561--player > .inventory-slot.inventory-slot-v561:empty {
  background-image: none !important;
}

html body #inventory.inventory.game-panel.inventory-window-v561 .inventory-header-v561 > .panel-close,
html body #inventory.inventory.game-panel.inventory-window-v561 .inventory-header-v561 > .inventory-close-v561 {
  box-sizing: border-box !important;
  width: 40px !important;
  min-width: 40px !important;
  height: 40px !important;
  min-height: 40px !important;
  border: 2px solid #1f6c7a !important;
  border-radius: 6px !important;
  background: #98c4c6 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .20), 0 2px 0 rgba(5, 57, 70, .30) !important;
}

/* Carry the same flat blue panel and individual teal cells into chest/trade windows. */
html body #chestPanel.inventory.chest-panel.game-panel.inventory-window-v561,
html body #structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561,
html body #tradePanel.trade-panel.social-panel.inventory-window-v561 {
  border: 2px solid #174956 !important;
  border-radius: 12px !important;
  background: #13778d !important;
  box-shadow: 0 2px 0 rgba(3, 42, 57, .36), 0 6px 12px rgba(0, 0, 0, .15) !important;
}

html body #chestPanel.inventory.chest-panel.game-panel.inventory-window-v561 .inventory-grid-v561,
html body #structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561 .storagechest-grid-v319 {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body #chestPanel.inventory.chest-panel.game-panel.inventory-window-v561 .inventory-slot-v561,
html body #structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561 .storagechest-slot-v319,
html body #tradePanel.trade-panel.social-panel.inventory-window-v561 .trade-offer-slot {
  border-color: #1e5d62 !important;
  border-radius: 7px !important;
  background-color: #4f9295 !important;
  box-shadow: none !important;
}

html body #chestPanel.inventory.chest-panel.game-panel.inventory-window-v561 .inventory-slot-v561:empty,
html body #structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561 .storagechest-slot-v319:empty {
  background-image: none !important;
}

/* Reuse the reference header and frame on both chest panels. Keep their grids and actions. */
html body #chestPanel.inventory.chest-panel.game-panel.inventory-window-v561,
html body #structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561 {
  padding: 13px 11px 11px 17px !important;
}

html body #chestPanel.inventory.chest-panel.game-panel.inventory-window-v561 .inventory-shell-v561,
html body #structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561 .storagechest-shell-v325 {
  width: 100% !important;
  height: 100% !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body #chestPanel.inventory.chest-panel.game-panel.inventory-window-v561 .inventory-header-v561,
html body #structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561 .inventory-header-v561 {
  flex: 0 0 52px !important;
  min-height: 52px !important;
  height: 52px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

html body #chestPanel.inventory.chest-panel.game-panel.inventory-window-v561 .inventory-title-v561,
html body #structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561 .inventory-title-v561 {
  color: #e9f0e8 !important;
  font-size: 25px !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 1px rgba(3, 51, 66, .45) !important;
}

html body #chestPanel.inventory.chest-panel.game-panel.inventory-window-v561 .inventory-header-v561 > .panel-close,
html body #structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561 .inventory-header-v561 > .panel-close {
  box-sizing: border-box !important;
  width: 40px !important;
  min-width: 40px !important;
  height: 40px !important;
  min-height: 40px !important;
  border: 2px solid #1f6c7a !important;
  border-radius: 6px !important;
  background: #98c4c6 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .20), 0 2px 0 rgba(5, 57, 70, .30) !important;
}

/* Trade gets the same title, close button, flat frame, and slot treatment. */
html body #tradePanel.trade-panel.social-panel.inventory-window-v561 {
  padding: 13px 11px 11px 17px !important;
  gap: 0 !important;
}

html body #tradePanel.trade-panel.social-panel.inventory-window-v561 .social-head,
html body #tradePanel.trade-panel.social-panel.inventory-window-v561 .inventory-header-v561 {
  flex: 0 0 52px !important;
  min-height: 52px !important;
  height: 52px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

html body #tradePanel.trade-panel.social-panel.inventory-window-v561 .social-title,
html body #tradePanel.trade-panel.social-panel.inventory-window-v561 .inventory-title-v561 {
  color: #e9f0e8 !important;
  font-size: 25px !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 1px rgba(3, 51, 66, .45) !important;
}

html body #tradePanel.trade-panel.social-panel.inventory-window-v561 .social-close,
html body #tradePanel.trade-panel.social-panel.inventory-window-v561 .panel-close {
  box-sizing: border-box !important;
  width: 40px !important;
  min-width: 40px !important;
  height: 40px !important;
  min-height: 40px !important;
  border: 2px solid #1f6c7a !important;
  border-radius: 6px !important;
  background: #98c4c6 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .20), 0 2px 0 rgba(5, 57, 70, .30) !important;
}

html body #tradePanel.trade-panel.social-panel.inventory-window-v561 .social-body,
html body #tradePanel.trade-panel.social-panel.inventory-window-v561 .ahardice-trade-body-v148 {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  height: auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body #tradePanel.trade-panel.social-panel.inventory-window-v561 .ahardice-trade-list-v148 {
  height: 100% !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}

html body #tradePanel.trade-panel.social-panel.inventory-window-v561 .ahardice-trade-row-v148,
html body #tradePanel.trade-panel.social-panel.inventory-window-v561 .ahardice-trade-empty-v192 {
  border: 1px solid #1e5d62 !important;
  border-radius: 7px !important;
  background: #4f9295 !important;
  color: #f1f6ee !important;
}

html body #tradePanel.trade-panel.social-panel.inventory-window-v561 .trade-modern-offer {
  border: 1px solid #174956 !important;
  border-radius: 8px !important;
  background: #13778d !important;
}

html body #tradePanel.trade-panel.social-panel.inventory-window-v561 .trade-stack-list,
html body #tradePanel.trade-panel.social-panel.inventory-window-v561 .trade-offer-grid {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body #tradePanel.trade-panel.social-panel.inventory-window-v561 .trade-offer-slot {
  border: 1px solid #1e5d62 !important;
  border-radius: 6px !important;
  background-color: #4f9295 !important;
  box-shadow: none !important;
}

/* Storage keeps 30 cells (6x5), but uses the same cell size and finish as inventory. */
html body #chestPanel.inventory.chest-panel.game-panel.inventory-window-v561 #chestGrid.inventory-grid.inventory-grid-v561--storage,
html body #structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561 .storagechest-grid-v319 {
  grid-template-columns: repeat(6, 67px) !important;
  grid-template-rows: repeat(5, 67px) !important;
  grid-auto-rows: 67px !important;
  justify-content: center !important;
  align-content: start !important;
  gap: 6px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body #chestPanel.inventory.chest-panel.game-panel.inventory-window-v561 #chestGrid.inventory-grid.inventory-grid-v561--storage > .inventory-slot.inventory-slot-v561,
html body #structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561 .storagechest-grid-v319 > .storagechest-slot-v319 {
  box-sizing: border-box !important;
  width: 67px !important;
  min-width: 67px !important;
  height: 67px !important;
  min-height: 67px !important;
  padding: 2px !important;
  border: 1px solid #1e5d62 !important;
  border-radius: 7px !important;
  background-color: #4f9295 !important;
  box-shadow: none !important;
}

/* Keep the personal and world chests on one shared layout. */
html body.chest-open-v198 #chestPanel.inventory.chest-panel.game-panel.inventory-window-v561,
html body.structure-storagechest-open-v325 #structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561 {
  box-sizing: border-box !important;
  width: 544px !important;
  max-width: 544px !important;
  height: 560px !important;
  max-height: 560px !important;
  padding: 13px 11px 11px 17px !important;
  border: 2px solid #174956 !important;
  border-radius: 12px !important;
  background: #13778d !important;
  box-shadow: 0 2px 0 rgba(3, 42, 57, .36), 0 6px 12px rgba(0, 0, 0, .15) !important;
}

html body.chest-open-v198 #chestPanel.inventory.chest-panel.game-panel.inventory-window-v561 .inventory-shell-v561,
html body.structure-storagechest-open-v325 #structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561 .storagechest-shell-v325 {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  height: 100% !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

html body.chest-open-v198 #chestPanel.inventory.chest-panel.game-panel.inventory-window-v561 .inventory-header-v561,
html body.structure-storagechest-open-v325 #structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561 .inventory-header-v561 {
  flex: 0 0 52px !important;
  min-height: 52px !important;
  height: 52px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

html body.chest-open-v198 #chestPanel.inventory.chest-panel.game-panel.inventory-window-v561 .inventory-title-v561,
html body.structure-storagechest-open-v325 #structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561 .inventory-title-v561 {
  color: #e9f0e8 !important;
  font-size: 25px !important;
  font-weight: 900 !important;
  text-shadow: 0 1px 1px rgba(3, 51, 66, .45) !important;
}

html body.chest-open-v198 #chestPanel.inventory.chest-panel.game-panel.inventory-window-v561 .inventory-header-v561 > .panel-close,
html body.structure-storagechest-open-v325 #structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561 .inventory-header-v561 > .panel-close {
  box-sizing: border-box !important;
  width: 40px !important;
  min-width: 40px !important;
  height: 40px !important;
  min-height: 40px !important;
  border: 2px solid #1f6c7a !important;
  border-radius: 6px !important;
  background: #98c4c6 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .20), 0 2px 0 rgba(5, 57, 70, .30) !important;
}

html body.chest-open-v198 #chestPanel.inventory.chest-panel.game-panel.inventory-window-v561 #chestGrid.inventory-grid.inventory-grid-v561--storage,
html body.structure-storagechest-open-v325 #structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561 .storagechest-grid-v319 {
  box-sizing: border-box !important;
  flex: 0 0 359px !important;
  height: 359px !important;
  min-height: 359px !important;
  max-height: 359px !important;
  grid-template-columns: repeat(6, 67px) !important;
  grid-template-rows: repeat(5, 67px) !important;
  grid-auto-rows: 67px !important;
  justify-content: center !important;
  align-content: start !important;
  gap: 6px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body.chest-open-v198 #chestPanel.inventory.chest-panel.game-panel.inventory-window-v561 #chestGrid.inventory-grid.inventory-grid-v561--storage > .inventory-slot.inventory-slot-v561,
html body.structure-storagechest-open-v325 #structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561 .storagechest-grid-v319 > .storagechest-slot-v319 {
  box-sizing: border-box !important;
  width: 67px !important;
  min-width: 67px !important;
  height: 67px !important;
  min-height: 67px !important;
  padding: 2px !important;
  border: 1px solid #1e5d62 !important;
  border-radius: 7px !important;
  background-color: #4f9295 !important;
  box-shadow: none !important;
}

html body.chest-open-v198 #chestPanel.inventory.chest-panel.game-panel.inventory-window-v561 .chest-actions-v325,
html body.structure-storagechest-open-v325 #structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561 .chest-actions-v325 {
  flex: 0 0 auto !important;
  margin: 10px 0 8px !important;
}

html body.chest-open-v198 #chestPanel.inventory.chest-panel.game-panel.inventory-window-v561 .chest-bulk-button-v325,
html body.structure-storagechest-open-v325 #structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561 .chest-bulk-button-v325 {
  box-shadow: none !important;
  text-shadow: none !important;
}

html body.chest-open-v198 #chestPanel.inventory.chest-panel.game-panel.inventory-window-v561 .chest-note,
html body.structure-storagechest-open-v325 #structurePanel.structure-panel.storagechest-modern-v325.inventory-window-v561 .storagechest-note-v325 {
  display: block !important;
  flex: 0 0 auto !important;
  min-height: 18px !important;
  max-width: 100% !important;
  margin: 0 2px !important;
  color: #e9f0e8 !important;
  line-height: 18px !important;
  text-align: center !important;
}