/* Gamer Store: Rewards tab, cart coupon list, membership card, shortcodes. */
.gsx-rewards, .gsx-rw-panel, .gsx-rw-cart { display: block; }
.gsx-rw-grid { display: grid; grid-template-columns: 1fr; gap: 16px; margin-bottom: 16px; }
@media (min-width: 720px) { .gsx-rw-grid { grid-template-columns: 1fr 1fr; } }
.gsx-rewards .gsx-card, .gsx-rw-cart .gsx-card, .gsx-rw-panel .gsx-card { margin-bottom: 16px; box-shadow: var(--shadow, none); }
.gsx-rw-grid .gsx-card { margin-bottom: 0; }
.gsx-rw-head { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.gsx-rw-title { margin: 0; font-family: var(--font-head, 'Sora', sans-serif); font-weight: 700; font-size: 20px; letter-spacing: -.01em; }
.gsx-rw-icon { width: 44px; height: 44px; border-radius: 12px; background: var(--gsx-amber); color: var(--gsx-on-amber); display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; }
.gsx-rw-icon--rank { border-radius: 50%; }
.gsx-rw-big { font-family: var(--font-head, 'Sora', sans-serif); font-size: 36px; font-weight: 700; line-height: 1.1; letter-spacing: -.02em; }
.gsx-rw-small { font-size: 14px; line-height: 1.5; }
.gsx-rw-progress-wrap { background: var(--gsx-bg); border-radius: 16px; padding: 12px 14px; margin-top: 12px; }
.gsx-rw-progress-label { display: flex; justify-content: space-between; gap: 10px; font-size: 14px; font-weight: 700; color: var(--gsx-muted); margin-bottom: 8px; }
.gsx-rw-bar { height: 12px; border-radius: 999px; background: var(--gsx-border); overflow: hidden; }
.gsx-rw-bar > span { display: block; height: 100%; border-radius: 999px; background: var(--gsx-mint); }
.gsx-rw-panel .gsx-rw-bar { margin: 12px 0 6px; }
.gsx-rw-panel__row { display: flex; justify-content: space-between; align-items: center; gap: 12px; }

.gsx-rw-ranks { list-style: none; margin: 0 0 16px; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 10px; }
.gsx-rw-rankcard { background: var(--gsx-bg); border: 2px solid var(--gsx-border); border-radius: 16px; padding: 14px; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 4px; }
.gsx-rw-rankcard.is-current { background: var(--gsx-surface); box-shadow: var(--shadow, 0 4px 14px rgba(0,0,0,.08)); }
.gsx-rw-dot { width: 36px; height: 36px; border-radius: 50%; display: block; }

.gsx-rw-tiers { border: 0; margin: 0 0 14px; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.gsx-rw-tier { position: relative; flex: 1 1 140px; min-height: 64px; display: flex; flex-direction: column; justify-content: center; gap: 2px; padding: 12px 16px; border: 2px solid var(--gsx-border); border-radius: 16px; cursor: pointer; background: var(--gsx-bg); }
.gsx-rw-tier input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.gsx-rw-tier:focus-within { outline: 3px solid var(--gsx-primary); outline-offset: 2px; }
.gsx-rw-tier:has(input:checked) { border-color: var(--gsx-primary); background: var(--gsx-surface); }
.gsx-rw-tier.is-disabled { opacity: .55; cursor: not-allowed; }
.gsx-rw-tier__euro { font-family: var(--font-head, 'Sora', sans-serif); font-size: 22px; font-weight: 700; }
.gsx-rw-tier__pts { font-size: 13px; font-weight: 700; color: var(--gsx-muted); }
.gsx-rw-msg { margin: 12px 0 0; font-weight: 600; min-height: 1.4em; }
.gsx-rw-msg.is-ok { color: var(--gsx-mint); }
.gsx-rw-msg.is-error { color: var(--gsx-coral); }

.gsx-rw-coupons { list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.gsx-rw-coupon { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; border-radius: 16px; background: var(--gsx-bg); border: 1px dashed var(--gsx-border); }
.gsx-rw-code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .5px; }
.gsx-rw-amount { font-weight: 700; color: var(--gsx-primary); }

.gsx-rw-tablewrap { overflow-x: auto; margin-top: 10px; }
.gsx-rw-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.gsx-rw-table th, .gsx-rw-table td { padding: 10px 8px; text-align: left; border-bottom: 1px solid var(--gsx-border); vertical-align: top; }
.gsx-rw-table th { color: var(--gsx-muted); font-size: 12px; text-transform: uppercase; letter-spacing: .6px; }
.gsx-rw-num { text-align: right !important; font-variant-numeric: tabular-nums; white-space: nowrap; }
.gsx-rw-table .is-plus { color: var(--gsx-mint); font-weight: 700; }
.gsx-rw-table .is-minus { color: var(--gsx-coral); font-weight: 700; }

/* Membership card */
.gsx-member-box { display: flex; flex-direction: column; gap: 14px; padding: 26px; border-radius: 20px; color: #f4f4f8; background: linear-gradient(160deg, #17142c, #2a1f5c); box-shadow: var(--shadow, none); }
.gsx-rw-member { margin-bottom: 16px; }
.gsx-member-box__head { display: flex; align-items: center; gap: 12px; }
.gsx-member-box__icon { width: 44px; height: 44px; border-radius: 14px; background: var(--gsx-amber); color: var(--gsx-on-amber); display: inline-flex; align-items: center; justify-content: center; }
.gsx-member-box__label { font-size: 12px; font-weight: 700; letter-spacing: 1px; }
.gsx-member-box__price { font-family: var(--font-head, 'Sora', sans-serif); font-size: 32px; font-weight: 700; }
.gsx-member-box__price span { font-size: 16px; opacity: .8; }
.gsx-member-box__list { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 10px; font-weight: 700; }
.gsx-member-box__status { margin: 0; font-weight: 700; color: var(--gsx-amber); }
.gsx-member-box__btn { margin-top: auto; display: flex; align-items: center; justify-content: center; min-height: 52px; border-radius: 999px; background: #fff; color: #5b3df5; font-weight: 700; text-decoration: none; }
.gsx-member-box__btn:hover, .gsx-member-box__btn:focus { filter: brightness(.96); }

.gsx-rw-badge { display: inline-block; }
@media (max-width: 480px) { .gsx-rw-coupon { flex-wrap: wrap; } .gsx-rw-big { font-size: 30px; } }

/* Rank ladder: game-style plates with a shield emblem and the money needed for each rank */
.gsx-rw-ranks { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
.gsx-rw-rankcard { position: relative; border: 0; border-bottom: 5px solid var(--rank-color, var(--gsx-border)); border-radius: 0; padding: 30px 12px 16px; gap: 4px; overflow: hidden; color: #f4f6f4;
	background: linear-gradient(170deg, color-mix(in srgb, var(--rank-color, #777) 26%, #0c0e0d) 0%, #0c0e0d 66%);
	clip-path: polygon(14px 0, 100% 0, 100% calc(100% - 14px), calc(100% - 14px) 100%, 0 100%, 0 14px); }
.gsx-rw-rankcard.is-current { background: linear-gradient(170deg, color-mix(in srgb, var(--rank-color, #777) 42%, #0c0e0d) 0%, #0c0e0d 72%); border-bottom-width: 8px; box-shadow: none; }
.gsx-rw-rankcard:not(.is-current):not(.is-reached) { opacity: .88; }
.gsx-rw-lv { position: absolute; left: 12px; top: 8px; font-size: 12px; font-weight: 800; letter-spacing: .16em; color: var(--rank-color); }
.gsx-rw-emblem { display: block; margin: 0 auto 6px; filter: drop-shadow(0 0 10px color-mix(in srgb, var(--rank-color) 55%, transparent)); }
.gsx-rw-emblem__hex { fill: var(--rank-color); }
.gsx-rw-emblem__inner { fill: color-mix(in srgb, var(--rank-color) 38%, #0c0e0d); stroke: color-mix(in srgb, var(--rank-color) 70%, #fff); stroke-width: 1.5; }
.gsx-rw-emblem__chev path { fill: none; stroke: #fff; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.gsx-rw-rankname { text-transform: uppercase; letter-spacing: .08em; font-size: 18px; color: #fff; text-shadow: 0 0 16px var(--rank-color); }
.gsx-rw-off { font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--rank-color); }
.gsx-rw-need { margin-top: 6px; padding-top: 8px; width: 100%; border-top: 1px solid rgba(255,255,255,.14); font-size: 13px; font-weight: 700; color: #e9ede9; line-height: 1.3; }
.gsx-rw-you { margin-top: 4px; font-size: 11px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: #2ee66b; }
.gsx-rw-rankcard.is-reached .gsx-rw-need::before { content: "\2713\00a0"; color: #2ee66b; }
