/* Tienda (m=shop) y Recargar (m=donate): un panel grande de portada, como la tienda de referencia. */
.shp, .rc { --gold: #f0b54a; --gold-2: #ffd27a; --text: #f6efe2; --mute: #a8a090; --line: #ffffff17; --panel: #16131a;
  position: relative; padding: 34px 0 70px; background: radial-gradient(1000px 500px at 50% -10%, #3a2a1233, transparent 70%), #0e0d11; color: var(--text); }
.shp .wrap, .rc .wrap { width: min(1160px, calc(100% - 32px)); }

/* Shared pieces */
.sh-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.sh-chip { display: inline-flex; align-items: center; gap: 6px; padding: 4px 11px; border-radius: 999px; border: 1px solid #f0b54a59; background: #f0b54a14; color: #f3d39a; font-size: 12px; font-weight: 800; letter-spacing: .1em; }
.sh-chip.is-gold { border-color: transparent; background: linear-gradient(180deg, #ffd27a, #f0a93a); color: #2b1a04; }
.sh-title { margin: 0 0 14px; font-size: clamp(40px, 6vw, 72px); line-height: .95; font-weight: 900; letter-spacing: .01em; color: #fff7ea; text-shadow: 0 6px 30px #0009; }
.sh-title span { background: linear-gradient(180deg, #ffe3a3, #f0a93a 70%, #c9811b); -webkit-background-clip: text; background-clip: text; color: transparent; }
.sh-lead { margin: 0; max-width: 560px; font-size: 18px; line-height: 1.55; color: #e2d9c8; }
.sh-coin { display: inline-grid; place-items: center; flex: none; width: 22px; height: 22px; border-radius: 50%; font-size: 8px; font-weight: 900; color: #2a1c05; background: radial-gradient(circle at 35% 30%, #fff0bf, #f0b54a 55%, #a86d14); box-shadow: inset 0 -2px 0 #0004, 0 1px 4px #0008; }
.sh-coin.is-c1 { color: #0b1a33; background: radial-gradient(circle at 35% 30%, #d6ecff, #6fb4ff 55%, #2f63b8); }
.sh-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 10px 22px; border-radius: 999px; border: 1px solid #d9bc8459; background: #ffffff0a; color: var(--text, #f6efe2); font: inherit; font-size: 15px; font-weight: 800; text-decoration: none; cursor: pointer; transition: background .15s, border-color .15s, transform .15s, box-shadow .15s; }
.sh-btn:hover { border-color: var(--gold, #f0b54a); background: #f0b54a1a; }
.sh-btn.is-main { border-color: #ffd98a; background: linear-gradient(180deg, #ffd27a, #e9a02f); color: #2b1a04; box-shadow: 0 10px 26px #e9a02f40; }
.sh-btn.is-main:hover { transform: translateY(-1px); box-shadow: 0 14px 30px #e9a02f59; }
.sh-btn.is-line { border-color: #ffffff59; background: transparent; }
.sh-btn[disabled] { opacity: .5; cursor: not-allowed; transform: none; box-shadow: none; }
.sh-flash { margin-bottom: 16px; padding: 14px 18px; border-radius: 14px; font-size: 15px; font-weight: 600; }
.sh-flash.is-ok { background: #1d3a24; border: 1px solid #5fbf74; color: #d8f5de; }
.sh-flash.is-error { background: #3a1d1d; border: 1px solid #d0675f; color: #ffdcd8; }
.sh-empty { margin-top: 18px; padding: 34px; border-radius: 16px; border: 1px dashed #ffffff26; text-align: center; color: var(--mute); font-size: 16px; }
i.is-ok, i.is-gift, i.is-coin, i.is-shield { display: inline-block; flex: none; width: 18px; height: 18px; border-radius: 50%; background: center / 12px no-repeat; }
i.is-ok { background-color: #37b45a; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5 10 17 19 7'/%3E%3C/svg%3E"); }
i.is-gift { border-radius: 4px; background-color: #e9a02f; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232b1a04' stroke-width='2.4'%3E%3Cpath d='M4 11h16v9H4zM3 7h18v4H3zM12 7v13M12 7c-2-4-6-3-5 0M12 7c2-4 6-3 5 0'/%3E%3C/svg%3E"); }
i.is-coin { background-image: radial-gradient(circle at 35% 30%, #fff0bf, #f0b54a 55%, #a86d14); }
i.is-shield { border-radius: 5px 5px 9px 9px; background-color: #e9a02f; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232b1a04' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M7 12.5 10.5 16 17 9'/%3E%3C/svg%3E"); }

/* Portada de la Tienda */
.shp-panel, .rc-panel { position: relative; overflow: hidden; padding: 38px 40px 34px; border-radius: 28px; border: 1px solid #f0b54a33;
  background: radial-gradient(700px 420px at 78% 30%, #f0b54a26, transparent 70%), radial-gradient(500px 300px at 10% 100%, #8a5bff12, transparent 70%), linear-gradient(160deg, #221c17, #121015 60%);
  box-shadow: 0 30px 80px #000a, inset 0 1px 0 #ffffff10; }
.shp-head, .rc-head { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); align-items: center; gap: 24px; }
.shp-hint { margin: 22px 0 12px; font-size: 14px; color: #cfc6b5; }
.shp-buttons { display: flex; flex-wrap: wrap; gap: 12px; }
.shp-buttons .sh-btn { min-width: 190px; }
.shp-wallet { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 22px; }
.shp-wallet > span { display: flex; align-items: center; gap: 10px; padding: 8px 16px 8px 10px; border-radius: 14px; border: 1px solid var(--line); background: #0d0c10b3; }
.shp-wallet .sh-coin { width: 30px; height: 30px; font-size: 10px; }
.shp-wallet small { display: block; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--mute); }
.shp-wallet b { font-size: 20px; }
.shp-perks { display: flex; flex-wrap: wrap; gap: 8px 22px; margin: 22px 0 0; padding: 0; list-style: none; }
.shp-perks li { display: flex; align-items: center; gap: 8px; font-size: 14px; color: #ddd3c1; }
.shp-art { position: relative; height: 330px; }
.shp-art::before { content: ''; position: absolute; inset: 8% 10%; border-radius: 50%; background: radial-gradient(circle, #f0b54a40, transparent 65%); filter: blur(6px); }
.shp-art img { position: absolute; object-fit: contain; filter: drop-shadow(0 18px 24px #000c); animation: sh-float 6s ease-in-out infinite; }
.shp-art .is-1 { left: 30%; top: 14%; width: 46%; animation-delay: 0s; }
.shp-art .is-2 { left: 2%; top: 4%; width: 32%; animation-delay: -1s; }
.shp-art .is-3 { right: 0; top: 0; width: 26%; animation-delay: -2s; }
.shp-art .is-4 { left: 6%; bottom: 2%; width: 22%; animation-delay: -3s; }
.shp-art .is-5 { right: 4%; bottom: 10%; width: 34%; animation-delay: -4s; }
.shp-art .is-6 { left: 40%; bottom: -2%; width: 20%; animation-delay: -5s; }
@keyframes sh-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
@media (prefers-reduced-motion: reduce) { .shp-art img { animation: none; } }
.shp-cats { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin-top: 30px; }
.shp-cat { position: relative; display: flex; flex-direction: column; justify-content: space-between; min-height: 104px; padding: 14px 14px 12px; border-radius: 16px; border: 1px solid var(--line); background: linear-gradient(180deg, #1d1a20, #121115); color: var(--text); font: inherit; text-align: left; cursor: pointer; overflow: hidden; transition: border-color .15s, transform .15s; }
.shp-cat:hover { border-color: #f0b54a80; transform: translateY(-2px); }
.shp-cat strong { position: relative; z-index: 1; max-width: 60%; font-size: 14px; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.shp-cat > span { position: relative; z-index: 1; display: flex; align-items: center; gap: 5px; font-size: 13px; color: var(--mute); }
.shp-cat > span b { font-size: 18px; color: var(--text); }
.shp-cat img { position: absolute; right: 8px; bottom: 8px; width: 62px; height: 62px; object-fit: contain; filter: drop-shadow(0 6px 10px #000c); transition: transform .2s; }
.shp-cat:hover img { transform: scale(1.08) rotate(-4deg); }

/* Pestañas y secciones */
.sh-tabs { position: sticky; top: 8px; z-index: 20; display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin: 26px 0 34px; padding: 8px; border-radius: 18px; border: 1px solid var(--line); background: #141217f2; backdrop-filter: blur(8px); }
.sh-tab { padding: 10px 18px; border-radius: 12px; border: 0; background: transparent; color: #d8cfbe; font: inherit; font-size: 15px; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; cursor: pointer; }
.sh-tab:hover { color: #fff; background: #ffffff0d; }
.sh-tab.is-active { background: linear-gradient(180deg, #ffd27a, #e9a02f); color: #2b1a04; }
.sh-panel[hidden] { display: none; }
.sh-sec-head { margin-bottom: 22px; }
.sh-sec-head h2 { margin: 12px 0 8px; font-size: clamp(30px, 4vw, 46px); line-height: 1; font-weight: 900; text-transform: uppercase; color: #fff7ea; }
.sh-sec-head p { margin: 0; max-width: 760px; font-size: 16px; line-height: 1.55; color: #cfc6b5; }
.sh-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 16px; }
.sh-card { position: relative; display: flex; flex-direction: column; gap: 10px; padding: 16px; border-radius: 20px; border: 1px solid var(--line); background: linear-gradient(180deg, #1f1b22, #131216); transition: border-color .15s, transform .15s, box-shadow .15s; }
.sh-card:hover { border-color: #f0b54a66; transform: translateY(-3px); box-shadow: 0 18px 40px #0009; }
.sh-flag { position: absolute; top: 14px; right: 14px; z-index: 1; padding: 3px 10px; border-radius: 8px; background: #37b45a; color: #fff; font-size: 11px; font-weight: 900; letter-spacing: .08em; }
.sh-flag.is-sale { background: #e0564c; }
.sh-flag.is-gold { background: linear-gradient(180deg, #ffd27a, #e9a02f); color: #2b1a04; }
.sh-art { display: grid; place-items: center; height: 150px; border-radius: 14px; background: radial-gradient(circle at 50% 55%, #f0b54a2e, transparent 60%), #0e0d11; border: 1px solid #ffffff0d; }
.sh-art img { width: 128px; height: 128px; object-fit: contain; filter: drop-shadow(0 10px 14px #000d); transition: transform .2s; }
.sh-card:hover .sh-art img { transform: scale(1.06); }
.sh-art img.is-pixel { width: 72px; height: 72px; image-rendering: pixelated; }
.sh-card h3 { margin: 4px 0 0; font-size: 18px; line-height: 1.25; color: #ffe2a8; }
.sh-text { margin: 0; font-size: 14px; line-height: 1.5; color: #cfc6b5; }
.sh-more summary { font-size: 13px; color: #d9bc84; cursor: pointer; }
.sh-more p { margin: 6px 0 0; font-size: 13px; line-height: 1.55; color: #b9b1a3; }
.sh-pick, .sh-pay { display: flex; flex-wrap: wrap; gap: 6px; }
.sh-pick label, .sh-pay label { position: relative; cursor: pointer; }
.sh-pick input, .sh-pay input { position: absolute; opacity: 0; pointer-events: none; }
.sh-pick span { display: inline-block; padding: 6px 12px; border-radius: 999px; border: 1px solid var(--line); background: #0d0c10; font-size: 13px; font-weight: 800; color: #cfc6b5; }
.sh-pick input:checked + span { border-color: transparent; color: #2b1a04; background: linear-gradient(180deg, #ffd27a, #e9a02f); }
.sh-pick input:focus-visible + span, .sh-pay input:focus-visible + span { outline: 2px solid #ffd27a; outline-offset: 2px; }
.sh-card > .sh-pick { margin-top: auto; padding-top: 4px; }
.sh-pay label > span { display: inline-flex; align-items: center; gap: 7px; padding: 6px 12px 6px 7px; border-radius: 12px; border: 1px solid var(--line); background: #0d0c10; }
.sh-pay b { font-size: 18px; color: var(--text); }
.sh-pay s { font-size: 12px; color: var(--mute); }
.sh-pay input:checked + span { border-color: #f0b54a; background: #f0b54a1c; }
.sh-bound { margin: 0; font-size: 12px; color: #9bb7ff; }
.sh-bound[hidden], .sh-warn[hidden], .sh-gift[hidden] { display: none; }
.sh-actions { display: flex; gap: 8px; }
.sh-actions .sh-btn { flex: 1; min-height: 42px; padding: 8px 14px; font-size: 14px; }
.sh-vip { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.sh-vip-card { position: relative; display: flex; flex-direction: column; gap: 14px; padding: 24px 20px 20px; border-radius: 22px; border: 1px solid #ffffff1f; background: linear-gradient(180deg, #202536, #121318); }
.sh-vip-card.is-l2 { background: linear-gradient(180deg, #2a2138, #131218); border-color: #b48cff40; }
.sh-vip-card.is-l3 { background: linear-gradient(180deg, #33281a, #141216); border-color: #f0b54a66; box-shadow: 0 0 40px #f0b54a1f; }
.sh-vip-card header { display: flex; align-items: center; gap: 14px; }
.sh-vip-card h3 { margin: 0; font-size: 24px; font-weight: 900; color: #fff7ea; }
.sh-vip-gem { width: 36px; height: 36px; transform: rotate(45deg); border-radius: 8px; background: linear-gradient(135deg, #cfe5ff, #5d8fd6); box-shadow: 0 0 16px #6fb4ff66; }
.is-l2 .sh-vip-gem { background: linear-gradient(135deg, #ead6ff, #8c5ad6); box-shadow: 0 0 16px #b48cff66; }
.is-l3 .sh-vip-gem { background: linear-gradient(135deg, #ffe7a6, #d98d1f); box-shadow: 0 0 20px #f0b54a80; }
.sh-vip-perks { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.sh-vip-perks li { padding: 9px 12px; border-radius: 12px; background: #ffffff08; font-size: 14px; color: #ddd3c1; }
.sh-vip-perks b { font-size: 16px; color: #7fd18b; }
.sh-price { display: flex; align-items: center; gap: 10px; }
.sh-price .sh-coin { width: 30px; height: 30px; font-size: 10px; }
.sh-price b { font-size: 32px; font-weight: 900; }
.sh-note { margin: 16px 0 0; font-size: 14px; color: var(--mute); }
.sh-note a, .sh-warn a { color: var(--gold); }
.sh-help { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 40px; }
.sh-help > div { padding: 18px 20px; border-radius: 16px; border: 1px solid var(--line); background: #141217; }
.sh-help h4 { margin: 0 0 6px; font-size: 15px; color: #ffe2a8; }
.sh-help p { margin: 0; font-size: 14px; line-height: 1.55; color: #b9b1a3; }
.sh-history { margin-top: 28px; }
.sh-history h4 { margin: 0 0 10px; font-size: 15px; color: #ffe2a8; }
.sh-history ul { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.sh-history li { display: grid; grid-template-columns: 110px minmax(0, 1fr) 160px 110px 140px; align-items: center; gap: 10px; padding: 10px 14px; border-radius: 12px; background: #141217; border: 1px solid var(--line); font-size: 14px; color: #c9c1b3; }
.sh-history li span { font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: var(--mute); }
.sh-history li strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text); }
.sh-history li em { font-style: normal; }
.sh-history li em.is-paid { color: #7fd18b; }
.sh-history li em.is-mismatch { color: #f0b54a; }
.sh-history li em.is-rejected, .sh-history li em.is-reversed { color: #e0786f; }
.sh-history li b { text-align: right; color: var(--text); }
.sh-history li time { font-size: 12px; text-align: right; color: var(--mute); }
.sh-dialog { position: fixed; inset: 0; width: min(460px, calc(100% - 32px)); height: fit-content; max-height: calc(100% - 32px); margin: auto; overflow: auto; padding: 0; border-radius: 20px; border: 1px solid #d9bc8459; background: #17151b; color: #f6efe2; box-shadow: 0 30px 80px #000c; }
.sh-dialog::backdrop { background: #000000b3; }
.sh-dialog form { display: grid; gap: 14px; padding: 22px; }
.sh-dialog h2 { margin: 0; font-size: 20px; color: #ffe2a8; }
.sh-sum { display: grid; gap: 2px; }
.sh-sum div { display: flex; justify-content: space-between; gap: 12px; padding: 8px 0; border-bottom: 1px solid #ffffff12; font-size: 14px; }
.sh-sum span { color: #a8a090; }
.sh-warn { margin: 0; padding: 10px 12px; border-radius: 10px; background: #3a2a14; color: #ffd9a0; font-size: 14px; }
.sh-gift { display: grid; gap: 10px; margin: 0; padding: 0; border: 0; }
.sh-gift label { display: grid; gap: 6px; font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: #a8a090; }
.sh-gift input, .sh-gift select { padding: 10px 12px; border-radius: 10px; border: 1px solid #ffffff26; background: #0d0c10; color: #f6efe2; font: inherit; font-size: 15px; text-transform: none; letter-spacing: 0; }
.sh-gift input:focus, .sh-gift select:focus { outline: none; border-color: #f0b54a; }

/* Recargar */
.rc-copy { position: relative; z-index: 1; }
.rc-notice { display: flex; gap: 10px; align-items: flex-start; max-width: 520px; margin: 20px 0 0; padding: 12px 16px; border-radius: 14px; border: 1px solid #f0b54a59; background: #f0b54a10; font-size: 14px; line-height: 1.5; color: #e2d9c8; }
.rc-notice svg { flex: none; width: 20px; height: 20px; margin-top: 1px; color: #ffb547; }
.rc-notice b { color: #ffcf73; }
.rc-art { display: grid; place-items: center; }
.ec-pile { display: block; width: 100%; height: auto; overflow: visible; }
.ec-pile.is-hero { max-width: 430px; filter: drop-shadow(0 26px 30px #000b); }
.rc-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin: 30px 0 14px; }
.rc-label { font-size: 13px; font-weight: 900; letter-spacing: .16em; color: #cfc6b5; }
.rc-trust { display: flex; flex-wrap: wrap; gap: 8px 22px; }
.rc-trust span { display: flex; align-items: center; gap: 8px; font-size: 14px; color: #ddd3c1; }
.rc-packs { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; padding-top: 10px; }
.rc-pack { position: relative; cursor: pointer; }
.rc-pack input, .rc-method input { position: absolute; opacity: 0; pointer-events: none; }
.rc-pack-body { position: relative; display: grid; justify-items: center; gap: 4px; height: 100%; box-sizing: border-box; padding: 16px 10px 14px; border-radius: 18px; border: 1px solid var(--line); background: linear-gradient(180deg, #1f1b20, #121115); text-align: center; transition: border-color .15s, transform .15s, box-shadow .15s, background .15s; }
.rc-pack:hover .rc-pack-body { border-color: #f0b54a80; transform: translateY(-2px); }
.rc-pack input:checked + .rc-pack-body { border-color: #ffd27a; background: linear-gradient(180deg, #34291a, #17141a); box-shadow: 0 0 0 1px #ffd27a, 0 16px 36px #f0b54a2e; }
.rc-pack input:focus-visible + .rc-pack-body, .rc-method input:focus-visible + span { outline: 2px solid #ffd27a; outline-offset: 3px; }
.rc-extra { position: absolute; top: -11px; left: 50%; transform: translateX(-50%); padding: 2px 10px; border-radius: 999px; background: linear-gradient(180deg, #ffd27a, #e9a02f); color: #2b1a04; font-size: 12px; font-style: normal; font-weight: 900; }
.rc-radio { position: absolute; top: 10px; right: 10px; width: 18px; height: 18px; border-radius: 50%; border: 2px solid #ffffff4d; }
.rc-pack input:checked + .rc-pack-body .rc-radio { border-color: transparent; background: #f0b54a center / 12px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232b1a04' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5 10 17 19 7'/%3E%3C/svg%3E"); }
.rc-pack-body .ec-pile { width: 92px; margin: 4px 0 2px; }
.rc-pack-body strong { font-size: 22px; font-weight: 900; color: #fff7ea; }
.rc-pack-body strong small { padding: 1px 6px; border-radius: 6px; background: #f0b54a26; color: #ffcf73; font-size: 11px; vertical-align: 3px; }
.rc-pack-body b { font-size: 15px; font-weight: 900; color: #ffe2a8; }
.rc-gift { font-size: 12px; font-weight: 700; color: #7fd18b; }
.rc-sel { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin-top: 16px; padding: 12px 14px 12px 12px; border-radius: 18px; border: 1px solid #f0b54a59; background: linear-gradient(90deg, #2a2218, #15131a); }
.rc-sel-art { display: grid; place-items: center; width: 64px; height: 46px; }
.rc-sel-art .ec-pile { width: 64px; }
.rc-sel-pack small { display: block; font-size: 12px; font-weight: 900; letter-spacing: .14em; color: var(--mute); }
.rc-sel-pack strong { font-size: 22px; font-weight: 900; }
.rc-sel-price { margin-left: auto; font-size: 24px; font-weight: 900; color: #fff7ea; }
.rc-sel .sh-btn { min-width: 170px; }
.pm { margin-top: 56px; scroll-margin-top: 90px; }
.pm h2 { margin: 0 0 10px; font-size: clamp(30px, 4vw, 46px); font-weight: 900; color: #fff7ea; }
.pm > p { margin: 0 0 18px; max-width: 560px; font-size: 16px; line-height: 1.55; color: #cfc6b5; }
.pm-consent { display: flex; gap: 10px; align-items: flex-start; max-width: 720px; margin: 0 0 18px; font-size: 14px; line-height: 1.5; color: #cfc6b5; cursor: pointer; }
.pm-consent input { flex: none; width: 18px; height: 18px; margin-top: 2px; accent-color: #f0b54a; }
.pm-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 300px)); gap: 16px; }
.pm-card { display: grid; gap: 18px; padding: 22px 20px 20px; border-radius: 20px; border: 1px solid #ffffff1f; background: linear-gradient(180deg, #1f1b20, #141217); color: inherit; font: inherit; text-align: left; cursor: pointer; transition: border-color .15s, transform .15s, box-shadow .15s; }
.pm-card:hover, .pm-card:focus-visible { border-color: #f0b54a; transform: translateY(-2px); box-shadow: 0 16px 36px #0009; outline: none; }
.pm-card[disabled] { cursor: not-allowed; }
.pm-logo { justify-self: start; font-size: 26px; font-weight: 900; letter-spacing: -.01em; }
.pm-card.is-paymentwall .pm-logo { color: #ff8a1f; }
.pm-card.is-paypal .pm-logo { padding: 4px 16px; border-radius: 999px; background: #fff; color: #003087; font-size: 20px; font-style: italic; }
.pm-card.is-mercadopago .pm-logo { color: #4fc3f7; }
.pm-badges { display: flex; flex-wrap: wrap; gap: 8px; padding-top: 16px; border-top: 1px solid #ffffff1a; }
.pm-b { display: inline-grid; place-items: center; min-width: 46px; height: 28px; padding: 0 8px; border-radius: 6px; background: #ffffff12; font-size: 12px; font-style: normal; font-weight: 900; color: #e8e2d6; }
.pm-b.is-visa { color: #8fb0ff; font-style: italic; font-size: 14px; }
.pm-b.is-mc { background: #ffffff12 center / 30px 18px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 18'%3E%3Ccircle cx='10' cy='9' r='8' fill='%23eb001b'/%3E%3Ccircle cx='20' cy='9' r='8' fill='%23f79e1b' fill-opacity='.9'/%3E%3C/svg%3E"); }
.pm-b.is-apple { background: #f6efe2; color: #111; }
.pm-b.is-local { font-size: 11px; font-weight: 800; color: #cfc6b5; }
.rc-methods { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 12px; margin-top: 12px; }
.rc-method { position: relative; cursor: pointer; }
.rc-method > span { display: grid; grid-template-columns: 44px 1fr; column-gap: 12px; align-items: center; height: 100%; box-sizing: border-box; padding: 14px 16px; border-radius: 16px; border: 1px solid var(--line); background: #121115; }
.rc-method strong { font-size: 16px; color: var(--text); }
.rc-method small { grid-column: 2; font-size: 13px; color: var(--mute); }
.rc-method input:checked + span { border-color: #ffd27a; background: #2a2218; }
.rc-logo { grid-row: span 2; width: 44px; height: 44px; border-radius: 12px; background: #ffffff10 center / 26px no-repeat; }
.rc-method.is-paymentwall .rc-logo { background-color: #ff7a00; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2'%3E%3Crect x='2.5' y='5' width='19' height='14' rx='2'/%3E%3Cpath d='M2.5 10h19M6 15h4'/%3E%3C/svg%3E"); }
.rc-method.is-paypal .rc-logo { background-color: #003087; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M7 21H3.6L6.6 3h7.2c3.4 0 5.3 1.9 4.8 5-.6 3.8-3.2 5.3-6.7 5.3H9.5z'/%3E%3C/svg%3E"); }
.rc-method.is-mercadopago .rc-logo { background-color: #00b1ea; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M3 12c3-4 6-4 9 0s6 4 9 0'/%3E%3Cpath d='M8 13.5 11 16l5-5'/%3E%3C/svg%3E"); }
.rc-total { display: flex; flex-wrap: wrap; align-items: center; gap: 24px; margin-top: 16px; padding: 16px 20px; border-radius: 18px; border: 1px solid #f0b54a40; background: linear-gradient(90deg, #2a2218, #141217); }
.rc-total small { display: block; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--mute); }
.rc-total strong { font-size: 24px; font-weight: 900; }
.rc-total .sh-btn { margin-left: auto; min-width: 230px; min-height: 50px; font-size: 16px; }
.rc-guest { display: grid; justify-items: center; gap: 12px; margin: 34px auto 0; max-width: 420px; }
.rc-guest p { display: flex; align-items: center; gap: 8px; margin: 0 0 4px; font-size: 16px; color: #cfc6b5; }
.rc-guest p svg { width: 20px; height: 20px; color: #ffcf73; }
.rc-big { display: flex; align-items: center; justify-content: space-between; gap: 14px; width: 100%; padding: 16px 22px; border-radius: 16px; border: 1px solid #ffffff2e; background: #f6efe2; color: #1b1510; font: inherit; text-align: left; text-decoration: none; cursor: pointer; transition: transform .15s, box-shadow .15s; }
.rc-big.is-main { border-color: #ffd98a; background: linear-gradient(180deg, #ffd27a, #e9a02f); box-shadow: 0 12px 30px #e9a02f40; }
.rc-big:hover { transform: translateY(-2px); }
.rc-big strong { display: block; font-size: 19px; font-weight: 900; }
.rc-big small { font-size: 13px; opacity: .75; }
.rc-big i { font-style: normal; font-size: 22px; }
.rc-small { margin: 26px 0 0; text-align: center; font-size: 13px; color: var(--mute); }

@media (max-width: 1080px) { .rc-packs { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 20px; } }
@media (max-width: 900px) {
  .shp-panel, .rc-panel { padding: 26px 20px 24px; border-radius: 22px; }
  .shp-head, .rc-head { grid-template-columns: 1fr; }
  .shp-art { height: 230px; order: -1; }
  .rc-art { order: -1; max-width: 300px; margin: 0 auto; }
  .sh-vip, .sh-help { grid-template-columns: 1fr; }
  .sh-history li { grid-template-columns: 1fr auto; }
  .sh-history li em, .sh-history li time { grid-column: 1; text-align: left; }
  .sh-tabs { justify-content: flex-start; overflow-x: auto; flex-wrap: nowrap; }
}
@media (max-width: 560px) {
  .rc-packs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rc-total .sh-btn, .rc-sel .sh-btn { width: 100%; margin-left: 0; }
  .shp-cats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Preguntas frecuentes (Recargar) */
.faq { margin-top: 70px; }
.faq-head { text-align: center; margin-bottom: 30px; }
.faq-head h2 { margin: 0 0 12px; font-size: clamp(32px, 4.5vw, 52px); font-weight: 900; letter-spacing: .02em; background: linear-gradient(180deg, #ffe3a3, #f0a93a 70%, #c9811b); -webkit-background-clip: text; background-clip: text; color: transparent; }
.faq-head p { margin: 0 auto; max-width: 520px; font-size: 16px; line-height: 1.6; color: #cfc6b5; }
.faq-body { display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: 20px; align-items: start; }
.faq-list { display: grid; gap: 10px; }
.faq-list[hidden] { display: none; }
.faq-item { border-radius: 16px; border: 1px solid var(--line); background: #0f0e12; transition: border-color .15s; }
.faq-item[open] { border-color: #f0b54a80; box-shadow: inset 3px 0 0 #f0b54a; background: linear-gradient(180deg, #1a1612, #0f0e12); }
.faq-item summary { display: flex; align-items: center; gap: 16px; padding: 18px 20px; cursor: pointer; list-style: none; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-n { flex: none; font-size: 13px; font-weight: 800; color: var(--mute); }
.faq-item[open] .faq-n { color: #ffcf73; }
.faq-q { flex: 1; font-size: 17px; font-weight: 800; color: #f6efe2; }
.faq-item[open] .faq-q { color: #ffe2a8; }
.faq-item summary i { flex: none; width: 32px; height: 32px; border-radius: 50%; border: 1px solid #ffffff40; background: center / 14px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f6efe2' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); transition: transform .2s; }
.faq-item[open] summary i { transform: rotate(180deg); border-color: transparent; background-color: #f0b54a; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232b1a04' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); }
.faq-a { padding: 0 24px 20px 56px; font-size: 15px; line-height: 1.6; color: #ddd3c1; }
.faq-a p { margin: 0 0 8px; max-width: 640px; }
.faq-a a { color: #fff; font-weight: 700; text-decoration: underline; }
.faq-side { position: sticky; top: 90px; display: grid; gap: 14px; }
.faq-cats { display: grid; gap: 4px; padding: 8px; border-radius: 16px; border: 1px solid var(--line); background: #0f0e12; }
.faq-cat { padding: 12px 14px; border-radius: 10px; border: 0; background: transparent; color: #ddd3c1; font: inherit; font-size: 15px; font-weight: 800; text-align: left; text-decoration: none; cursor: pointer; }
.faq-cat:hover { background: #ffffff0a; color: #fff; }
.faq-cat.is-active { background: #2a2218; color: #ffcf73; box-shadow: inset 3px 0 0 #f0b54a; }
.faq-help { display: grid; justify-items: start; gap: 10px; padding: 18px; border-radius: 16px; border: 1px solid var(--line); background: #0f0e12; }
.faq-help h3 { margin: 0; font-size: 16px; color: #f6efe2; }
.faq-help p { margin: 0; font-size: 14px; line-height: 1.5; color: #b9b1a3; }
.faq-help .sh-btn { min-height: 36px; padding: 6px 14px; font-size: 13px; border-color: #f0b54a80; color: #ffcf73; }
.rc-big-ico { flex: none; width: 26px; height: 26px; }
.rc-big > span { flex: 1; }
@media (max-width: 900px) { .faq-body { grid-template-columns: 1fr; } .faq-side { position: static; order: -1; } .faq-cats { display: flex; flex-wrap: wrap; } .faq-a { padding-left: 20px; } }