.btn-monstit-premium { background: linear-gradient(120deg, #705522, #413257); color: #ffe7a8; }
#screen-premium { justify-content: flex-start; overflow-y: auto; }
#screen-gem-store { justify-content: flex-start; overflow-y: auto; }
.gem-pack-list { list-style: none; display: grid; gap: 16px; margin: 20px 0; padding: 0; }
.gem-pack-list li { padding: 24px; background: #202d3d; border: 1px solid #526480; border-radius: 18px; text-align: center; }
.gem-pack-list h3 { color: #c6ecff; font-size: 1.5rem; }
.gem-pack-price { display: block; font-size: 1.8rem; color: #ffe7a8; margin: 16px 0; }
.gem-pack-list .btn { width: 100%; min-width: 0; }
.gem-pack-defs { position: absolute; width: 0; height: 0; overflow: hidden; }
.gem-pack-art { display: block; width: 140px; height: 105px; margin: 0 auto 12px; }
.premium-container { width: 100%; max-width: 560px; padding-bottom: 32px; }
.premium-cover { padding: 30px 18px; margin: 24px 0; border: 1px solid #a18a52; border-radius: 24px; background: radial-gradient(ellipse at 50% 25%, #75603055, transparent 70%), #272539; text-align: center; }
.premium-cover .eyebrow { color: #f7d88f; }
.premium-star { display: block; margin: 12px; font-size: 4rem; color: #ffdc75; text-shadow: 0 0 30px #ffcf5a55; }
.premium-cover h2 { font-size: clamp(1.9rem, 7vw, 2.7rem); color: #ffe9ad; }
.premium-cover p { color: #d4cee1; line-height: 1.7; margin: 14px 0 20px; }
.premium-soon { display: inline-block; padding: 8px 12px; border: 1px solid #8d795a; border-radius: 20px; font-size: .65rem; letter-spacing: .1em; color: #ffe7a8; }
.premium-benefits-title { font-size: 1.25rem; margin: 26px 0 16px; }
.premium-benefits { list-style: none; padding: 0; display: grid; gap: 12px; }
.premium-benefits li { display: flex; align-items: flex-start; gap: 16px; padding: 20px; border: 1px solid #455269; background: #202d3d; border-radius: 16px; }
.premium-benefits li > span { font-size: 1.7rem; }
.premium-benefits h3 { color: #f5e3b8; font-size: 1.1rem; }
.premium-benefits p, .premium-purchase p { color: #c3cddd; font-size: .9rem; line-height: 1.7; margin-top: 8px; }
.premium-purchase { margin: 24px 0; padding: 24px; border: 1px solid #796648; border-radius: 18px; background: #292b32; }
.premium-purchase .btn { width: 100%; min-width: 0; margin: 18px 0 8px; }
.premium-purchase .premium-note { font-size: .8rem; }

/* Live Premium page: price, grown-up check, member controls and the three Premium monsters */
.premium-return { margin: 0 0 16px; padding: 14px 18px; border-radius: 14px; background: #2d3b24; border: 1px solid #caee93; color: #eaffc9; font-weight: 700; text-align: center; }
.premium-monsters { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 18px 0 0; }
.premium-monsters figure { margin: 0; display: grid; justify-items: center; align-content: end; gap: 6px; height: 150px; padding: 10px 6px; border-radius: 16px; border: 1px solid #a18a52; background: radial-gradient(ellipse at 50% 70%, #75603044, transparent 70%), #202d3d; }
.premium-monsters figure > span { display: grid; place-items: end center; height: 100px; }
.premium-monsters .monster { scale: 1.15; transform-origin: 50% 100%; }
.premium-monsters figcaption { font-weight: 800; color: #ffe7a8; font-size: .85rem; }
.premium-consent { display: flex; gap: 10px; align-items: flex-start; margin-top: 16px; padding: 12px; border-radius: 12px; background: #1d2230; color: #e6ecf5; font-weight: 700; font-size: .9rem; cursor: pointer; }
.premium-consent input { width: 22px; height: 22px; flex: none; accent-color: #ffd166; margin-top: 1px; }
.premium-purchase .btn + .btn { margin-top: 0; }
.premium-msg { min-height: 1.2em; color: #ffe7a8 !important; font-weight: 700; }
.premium-test { padding: 10px 12px; border-radius: 10px; background: #3a2a10; border: 1px dashed #f7b733; color: #ffe0a3 !important; font-weight: 700; margin: 0 0 12px !important; }