.shop-items-theme {
    background:
        radial-gradient(circle at 76% 27%, #d8a13d30, transparent 22%),
        linear-gradient(125deg, #17120d 22%, #3b2a17 67%, #15110d);
}

.shop-items-theme::before {
    background-color: #24180ea8;
    clip-path: polygon(62% 24%, 95% 24%, 95% 100%, 55% 100%, 55% 43%);
}

.shop-panel {
    grid-column: 1 / -1;
    width: 100%;
    padding: 14px;
    border: 1px solid #b58a453d;
    border-radius: 13px;
    background: #0d1117;
    box-shadow: inset 0 1px #ffffff08, 0 14px 35px #0005;
}

.shop-location-grid,
.shop-tier-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
}

.shop-location-card,
.shop-tier-card {
    display: grid;
    place-items: center;
    gap: 6px;
    min-width: 0;
    min-height: 112px;
    padding: 13px 8px;
    border: 1px solid var(--rarity-color, #b38b4d55);
    border-radius: 12px;
    color: #d9dde2;
    background:
        radial-gradient(circle at 50% 15%, var(--rarity-glow, #c7973921), transparent 58%),
        #12171e;
    text-align: center;
    cursor: pointer;
}

.shop-location-card > span,
.shop-tier-card > span {
    font-size: 28px;
}

.shop-location-card strong,
.shop-tier-card strong {
    max-width: 100%;
    overflow: hidden;
    font: 600 13px Georgia, serif;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.shop-location-card small,
.shop-tier-card small {
    color: #9098a2;
    font-size: 10px;
}

.shop-location-card.locked {
    opacity: 0.48;
    filter: grayscale(0.7);
}

.shop-items-grid {
    min-height: 112px;
}

.shop-loading,
.shop-error {
    display: grid;
    place-items: center;
    gap: 8px;
    min-height: 150px;
    color: #8f98a2;
    text-align: center;
}

.shop-error strong {
    color: #d5d9de;
}

.shop-error button {
    padding: 8px 13px;
    border: 1px solid #b38b4d55;
    border-radius: 8px;
    color: #e0c894;
    background: #2a2116;
}

@media (max-width: 520px) {
    .shop-panel {
        padding: 10px;
    }

    .shop-location-card,
    .shop-tier-card {
        min-height: 96px;
        padding: 10px 6px;
    }
}