/* Dark Mage of Mossfen — the Storage window (v1.73): the account's storage at an owl's inn, on the right like the
   Shop (shop.css), in the Bag's cells (items.css). */
#storage {
  top: 12px; right: 12px; z-index: 5;
  width: min(424px, calc(100% - 24px));
  max-height: calc(100% - 100px);
  overflow-y: auto;
  padding: 10px 14px 12px;
}
#storage header { align-items: center; }
#storage .shop-who p::before, #storage .shop-who p::after { content: none; }
#storage .shop-who p { font-style: normal; font-size: 13.5px; color: var(--ink-dim); }
#storage .shop-who p b { color: var(--ink); font-weight: 600; }
.storage-h {
  margin: 8px 0 0; font: 700 12px/1 var(--f-display); letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-dim);
}
/* a hundred cells: four rows in view, the rest a scroll away */
.storage-grid { max-height: 164px; overflow-y: auto; padding-right: 2px; margin-top: 6px; }
.storage-bag { margin-top: 6px; }
.storage-coins {
  display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin: 4px 0 6px;
  font: 600 13px/1 var(--f-display); letter-spacing: 0.04em; color: var(--ink-dim);
}
.storage-coins span { margin-right: auto; }
.storage-coins input {
  width: 92px; padding: 5px 7px; border: 1px solid #000; border-radius: 4px; background: #0b0f0c;
  box-shadow: inset 0 0 0 1px var(--edge); color: var(--ink); font: 400 14px/1 var(--f-num);
}
.storage-coins input:focus-visible { outline: 2px solid #f3d68a; outline-offset: 1px; }
body.storage-open #inspect { left: auto; transform: none; right: calc(min(424px, 100% - 24px) + 24px); }
@media (max-width: 760px) {
  body.storage-open #inspect { right: auto; left: 50%; transform: translateX(-50%); }
  .storage-grid { max-height: 146px; }
}