/* ---------- Shop ---------- */
#shop {
	position: fixed; z-index: 9; right: 12px; top: calc(var(--hud) + 4px); bottom: calc(var(--tick) + 12px); width: 300px;
	display: flex; flex-direction: column; border-radius: 18px; overflow: hidden;
	background: var(--glass); border: 1px solid var(--line); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
	box-shadow: 0 20px 60px -20px rgba(0,0,0,.8);
}
.shop-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 12px 14px 8px; }
.shop-head h2 { margin: 0; font-family: "Anton", sans-serif; font-weight: 400; letter-spacing: .06em; font-size: 1.25rem; }
.shop-head p { margin: 2px 0 0; font-size: .7rem; color: var(--muted); font-weight: 600; }
#shop-close { display: none; }
.shop-list { flex: 1; overflow-y: auto; padding: 4px 10px 12px; display: flex; flex-direction: column; gap: 8px; scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.2) transparent; }
.item {
	position: relative; display: grid; grid-template-columns: 44px 1fr auto; align-items: center; gap: 10px; text-align: left; width: 100%;
	padding: 9px 10px; border-radius: 14px; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.08);
	opacity: .55; transition: transform .15s, background .2s, border-color .2s, opacity .2s;
}
.item .ico { font-size: 1.65rem; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 12px; background: rgba(255,255,255,.06); transition: filter .3s; }
.item .nm { display: block; font-size: .87rem; font-weight: 800; }
.item .desc { display: block; font-size: .68rem; color: var(--muted); line-height: 1.25; }
.item .meta { display: block; font-size: .74rem; font-weight: 800; margin-top: 3px; }
.item .cost { color: #ff8fa3; }
.item .rate { color: #5fdca4; }
.item .count { font-family: "Anton", sans-serif; font-size: 1.6rem; color: rgba(255,255,255,.28); min-width: 26px; text-align: right; }
.item.can { opacity: 1; border-color: rgba(255,212,59,.4); background: rgba(255,212,59,.07); }
.item.can .cost { color: var(--gold); }
.item.can:hover { transform: translateX(-4px); background: rgba(255,212,59,.14); }
.item.can::before {
	content: ""; position: absolute; inset: -1px; border-radius: inherit; padding: 1.5px; pointer-events: none;
	background: conic-gradient(from var(--a), transparent 0 65%, var(--gold) 82%, #fff 86%, transparent 92%);
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude;
	animation: spin 2.8s linear infinite;
}
@property --a { syntax: "<angle>"; inherits: false; initial-value: 0deg; }
@keyframes spin { to { --a: 360deg; } }
.item.locked .ico { filter: brightness(0) opacity(.45); }
.item.locked .nm { letter-spacing: .2em; }
.item.bought { animation: bought .45s; }
@keyframes bought { 30% { transform: scale(1.04); background: rgba(95,220,164,.25); } }
.item.deny { animation: deny .35s; }
@keyframes deny { 20%, 60% { transform: translateX(-6px); } 40%, 80% { transform: translateX(6px); } }
.item.click-up { border-style: dashed; }

.shop-foot { padding: 10px; border-top: 1px solid var(--line); }
.btn.prestige { width: 100%; color: #fff; background: linear-gradient(180deg, #2fd08a, #0f8a5a); box-shadow: 0 5px 0 #075c3b, 0 14px 30px -12px rgba(47,208,138,.8); }
.btn.prestige:disabled { opacity: .55; filter: grayscale(.7); pointer-events: none; }
.btn.prestige.ready { animation: readyglow 1.6s ease-in-out infinite; }
@keyframes readyglow { 50% { box-shadow: 0 5px 0 #075c3b, 0 0 34px 6px rgba(47,208,138,.75); } }
.shop-foot { display: flex; gap: 8px; }
.shop-foot .btn.prestige { flex: 1; }
.shop-foot .perks-btn.jiggle { animation: jiggle 4.5s ease-in-out infinite; }
.shop-foot .perks-btn.locked { opacity: .55; filter: grayscale(.7); }
.shop-foot .perks-btn.deny { animation: deny .35s; }

/* Buy 1× / 10× / 25× / 50× / 100× */
.buy-amt { display: flex; align-items: center; gap: 4px; padding: 0 10px 8px; }
.buy-amt span { font-size: .6rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); margin-right: 2px; }
.buy-amt button { flex: 1; padding: 6px 0; border-radius: 10px; font-size: .74rem; font-weight: 900; color: var(--muted); background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.08); transition: background .15s, border-color .15s, color .15s; }
.buy-amt button:hover { background: rgba(255,255,255,.12); color: #fff; }
.buy-amt button[aria-pressed="true"] { color: var(--gold); background: rgba(255,212,59,.14); border-color: var(--gold); }
.item .cost b { font-weight: 900; color: #fff; opacity: .7; }
.item[hidden] { display: none; }
.shop-more { margin: 4px 0 0; text-align: center; font-size: .7rem; font-weight: 800; color: var(--muted); }
.btn.prestige { min-width: 0; }
.btn.prestige small { white-space: normal; overflow-wrap: anywhere; line-height: 1.25; }