/* game_shop.css — модалка поверх всего и 8-бит */
#shop-modal{
  position: fixed; inset: 0; display: none;
  z-index: 2147483647;            /* выше любого персонажа/экрана */
  pointer-events: none;           /* включим точечно на дочерних */
}
#shop-modal.open{ display:block; }

.shop-backdrop{
  position:absolute; inset:0;
  background: rgba(0,0,0,.75);
  pointer-events: auto;
}

.shop-card{
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:min(560px, 92vw);
  background:#0b1020; color:#e9efff;
  border:4px solid #000; box-shadow:0 0 0 4px var(--border), 0 0 0 8px #000;
  display:grid; grid-template-rows:auto 1fr;
  pointer-events: auto;          /* кликабельно */
}

.shop-header{
  display:flex; align-items:center; gap:10px; justify-content:space-between;
  padding:10px 12px; border-bottom:4px solid #000; background:#091028;
}
.shop-header .close{ border-color:var(--border); }
.shop-header .shop-mcap{ font-size:12px; color:#ffd34d; }

.shop-list{ padding:10px; display:grid; gap:8px; background:#0a1326; }

.shop-row{
  display:grid; grid-template-columns:1fr 100px 90px; gap:8px;
  align-items:center; padding:8px; background:#0b1733; border:2px solid var(--border);
}
.shop-name{ font-size:12px; color:#fff; }
.shop-cost{ font-size:12px; color:#ffd34d; text-align:right; }

.shop-row .btn{
  font:inherit; color:#fff; background:#203a86; outline:2px solid #000; border:2px solid var(--border);
  padding:8px 10px; cursor:pointer; border-radius:0; text-align:center;
}
.shop-row .btn:active{ transform: translateY(1px); }

/* поверх всего */
#shop-modal{ position:fixed; inset:0; display:none; z-index:2147483647; pointer-events:none; }
#shop-modal.open{ display:block; }
.shop-backdrop{ position:absolute; inset:0; background:rgba(0,0,0,.75); pointer-events:auto; }
.shop-card{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:min(560px,92vw);
  background:#0b1020; color:#e9efff; border:4px solid #000; box-shadow:0 0 0 4px var(--border),0 0 0 8px #000;
  display:grid; grid-template-rows:auto auto 1fr; pointer-events:auto;
}
.shop-header{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 12px; border-bottom:4px solid #000; background:#091028; }
.shop-meta{ display:flex; gap:14px; font-size:12px; }
.shop-note{ font-size:11px; color:#ffd34d; padding:8px 12px; border-bottom:2px solid #000; background:#0a1326; }

.shop-list{ padding:10px; display:grid; gap:8px; background:#0a1326; }
.shop-row{ display:grid; grid-template-columns:1fr 110px 90px; gap:8px; align-items:center; padding:8px; background:#0b1733; border:2px solid var(--border); }
.shop-name{ font-size:12px; color:#fff; }
.shop-desc{ font-size:10px; color:#b9c7ff; margin-top:4px; }
.shop-cost{ font-size:12px; color:#ffd34d; text-align:right; }
.shop-row .btn{ font:inherit; color:#fff; background:#203a86; outline:2px solid #000; border:2px solid var(--border); padding:8px 10px; cursor:pointer; border-radius:0; text-align:center; }
.shop-row .btn:active{ transform:translateY(1px); }
.shop-row .btn.disabled{ opacity:.55; pointer-events:none; filter:grayscale(1); }

.shop-locked{ padding:10px; border:2px dashed var(--border); font-size:12px; color:#a7b8ff; background:#0b1530; }
