/* Tarjeta y ventana de regalos (Trevix Turbo / Catalyst) */
.gift-card { width: min(460px, 100%); margin: 8px 0 4px; background: #1B1C21; border: 1px solid #2B2E35; border-radius: 14px; padding: 16px 18px 16px; color: #fff; box-sizing: border-box; }
.gift-card .gf-title { font-size: .8rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: #B5BAC1; margin-bottom: 12px; }
.gift-card .gf-row { display: flex; align-items: center; gap: 16px; }
.gf-icon { width: 64px; height: 64px; border-radius: 10px; flex: none; display: grid; place-items: center; background: #2A2D35; font-weight: 700; }
.gf-icon img { width: 60%; height: 60%; object-fit: contain; display: block; pointer-events: none; }
.gf-icon.sm { width: 36px; height: 36px; border-radius: 7px; } .gf-icon.lg { width: 88px; height: 88px; border-radius: 16px; margin: 4px auto 14px; }
.gf-icon.gf-bad { background: #3A2428; color: #F23F43; font-size: 1.6rem; }
.gift-card .gf-info { min-width: 0; flex: 1; }
.gift-card .gf-name { font-size: 1.35rem; font-weight: 600; line-height: 1.25; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gift-card .gf-sub { margin-top: 4px; color: #A3A8B3; font-size: .95rem; } .gift-card .gf-sub b { color: #DBDEE1; font-weight: 600; } .gift-card .gf-sub.small { font-size: .8rem; margin-top: 2px; }
.gift-card .gf-status { margin: 14px 0 0; color: #DBDEE1; font-size: .98rem; }
.gift-card .gf-btn { display: block; width: 100%; height: 44px; margin-top: 14px; border: 0; border-radius: 10px; background: #7c3aed; color: #fff; font: inherit; font-weight: 700; cursor: pointer; transition: background .15s, transform .1s; }
.gift-card .gf-btn:hover:not(:disabled) { background: #8b4df0; } .gift-card .gf-btn:active:not(:disabled) { transform: scale(.98); }
.gift-card .gf-btn.off, .gift-card .gf-btn:disabled { background: #26282E; color: #4E5058; cursor: default; font-weight: 800; }
.gift-card .gf-sk, .gift-card .gf-sk-line { background: linear-gradient(90deg, #26292F, #30343C, #26292F); background-size: 200% 100%; animation: gfShimmer 1.2s infinite linear; border-radius: 8px; }
.gift-card .gf-sk-line { height: 16px; width: 150px; margin-bottom: 8px; } .gift-card .gf-sk-line.s { width: 110px; height: 12px; } .gift-card .gf-title.gf-sk-line { height: 12px; width: 190px; }
@keyframes gfShimmer { to { background-position: -200% 0; } }

.gfm-overlay { position: fixed; inset: 0; z-index: 100000; background: rgba(0,0,0,.72); display: flex; align-items: center; justify-content: center; padding: 16px; opacity: 0; transition: opacity .18s; }
.gfm-overlay.open { opacity: 1; }
.gfm-panel { position: relative; width: min(440px, 100%); background: #2B2D31; border-radius: 12px; padding: 36px 28px 28px; box-shadow: 0 20px 60px rgba(0,0,0,.55); text-align: center; color: #fff; transform: scale(.96); transition: transform .18s; }
.gfm-overlay.open .gfm-panel { transform: none; }
.gfm-close { position: absolute; top: 12px; right: 12px; width: 32px; height: 32px; border: 0; border-radius: 8px; background: transparent; color: #B5BAC1; cursor: pointer; display: grid; place-items: center; }
.gfm-close:hover { color: #fff; background: rgba(255,255,255,.08); } .gfm-close svg { width: 18px; height: 18px; }
.gfm-avatar { width: 100px; height: 100px; border-radius: 50%; margin: 0 auto 14px; overflow: hidden; background: #3A3D45; display: grid; place-items: center; font-size: 2.4rem; font-weight: 700; }
.gfm-avatar img { width: 100%; height: 100%; object-fit: cover; } .gfm-avatar.gift { font-size: 3rem; } .gfm-avatar.bad { background: #3A2428; color: #F23F43; }
.gfm-from { color: #B5BAC1; font-size: 1rem; } .gfm-from b { color: #DBDEE1; }
.gfm-plan { display: flex; align-items: center; justify-content: center; gap: 10px; margin: 14px 0 0; font-size: 1.45rem; font-weight: 500; }
.gfm-title { font-size: 1.45rem; font-weight: 700; margin: 4px 0 8px; }
.gfm-msg { color: #B5BAC1; font-size: .95rem; line-height: 1.45; margin: 4px 4px 0; } .gfm-msg.dim { margin-top: 18px; }
.gfm-ben { list-style: none; margin: 14px auto 0; padding: 0; color: #B5BAC1; font-size: .9rem; } .gfm-ben li { margin: 3px 0; }
.gfm-btn { display: block; width: 100%; height: 44px; margin-top: 26px; border: 0; border-radius: 8px; background: #7c3aed; color: #fff; font: inherit; font-weight: 600; cursor: pointer; transition: background .15s; }
.gfm-btn:hover:not(:disabled) { background: #8b4df0; } .gfm-btn:disabled { background: #4A4D6A; color: #9A9DB5; cursor: default; } .gfm-btn.ghost { background: #3A3D45; }
.gfm-sk { margin: 12px auto; border-radius: 10px; background: linear-gradient(90deg, #30333A, #3B3F47, #30333A); background-size: 200% 100%; animation: gfShimmer 1.2s infinite linear; }
.gfm-sk.c { width: 100px; height: 100px; border-radius: 50%; } .gfm-sk.l { width: 220px; height: 18px; } .gfm-sk.t { height: 44px; margin-top: 30px; }
