/* Base común de las tres propuestas de gracias en una sola pantalla (7 nov 2026). Tokens de thelegacyclub.es
   (Helvetica Neue 300/700, -0.02em, 13/1.6, plata #c8c8c8) y el metal líquido de la app como único préstamo. */
:root{
  --plata:#c8c8c8; --t2:rgba(255,255,255,.75); --t3:rgba(255,255,255,.6); --b1:rgba(255,255,255,.08); --b2:rgba(255,255,255,.15);
  --cristal:linear-gradient(135deg,rgba(255,255,255,.2) 0%,rgba(255,255,255,.06) 48%,rgba(255,255,255,.11) 100%),rgba(11,11,11,.35);
  --ease:cubic-bezier(.22,1,.36,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{background:#000;height:100%}
body{font-family:"Helvetica Neue","Inter",-apple-system,BlinkMacSystemFont,sans-serif;font-weight:300;font-size:13px;line-height:1.6;
  letter-spacing:-0.02em;color:#fff;-webkit-font-smoothing:antialiased}
button{font:inherit;color:inherit;letter-spacing:inherit;background:none;border:0;cursor:pointer}
a{color:inherit;text-decoration:none}
b,strong{font-weight:700}
.lucide{width:16px;height:16px;flex:0 0 16px;stroke:currentColor;stroke-width:1.5;fill:none;stroke-linecap:round;stroke-linejoin:round}
[data-metal]{position:relative;isolation:isolate;overflow:hidden;
  background:radial-gradient(38% 28% at 70% 22%,rgba(255,255,255,.5) 0%,rgba(200,200,200,.25) 24%,rgba(26,26,26,0) 62%),
  radial-gradient(46% 34% at 24% 52%,rgba(200,200,200,.32) 0%,rgba(26,26,26,0) 70%),linear-gradient(160deg,#0a0a0a 0%,#1a1a1a 40%,#2c2c2c 62%,#0d0d0d 100%)}
[data-metal].metal-ok{background:#0b0b0b}
.logo{font-size:13px;font-weight:700;letter-spacing:.02em;line-height:1}
.logo span{color:transparent;-webkit-text-stroke:.7px #fff}
.cristal{border:1px solid rgba(255,255,255,.14);background:var(--cristal);-webkit-backdrop-filter:blur(32px) saturate(180%);backdrop-filter:blur(32px) saturate(180%)}
.pill{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:50px;font-size:12px;line-height:1.2;color:rgba(255,255,255,.88)}
.punto{width:6px;height:6px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 3px rgba(34,197,94,.18)}
.avatar{border-radius:50%;object-fit:cover;filter:grayscale(1);background:#fff}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;gap:7px;padding:8px 12px;border-radius:50px;font-size:12px;line-height:1.2}
.chip .lucide{width:14px;height:14px;flex-basis:14px;color:var(--plata)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 20px;border-radius:50px;font-size:13px;font-weight:700;line-height:1.2;
  transition:transform .3s var(--ease),background .3s var(--ease)}
.btn-blanco{background:#fff;color:#000}
.btn-cristal{color:#fff;font-weight:300;border:1px solid rgba(255,255,255,.22);background:var(--cristal);-webkit-backdrop-filter:blur(32px) saturate(180%);backdrop-filter:blur(32px) saturate(180%)}
.btn:active{transform:scale(.98)}
.video{display:flex;align-items:center;gap:12px;padding:8px;border-radius:16px}
.video img{width:84px;aspect-ratio:16/9;object-fit:cover;border-radius:10px;flex:0 0 84px}
.video b{display:block;font-size:13px;line-height:17px}
.video span{display:inline-flex;align-items:center;gap:5px;font-size:11px;line-height:15px;color:var(--t3)}
.video .flecha{margin-left:auto;color:var(--t3)}
.miembros{display:flex;align-items:center;gap:10px;font-size:12px;color:var(--t2)}
.miembros .caras{display:flex}
.miembros .caras img{width:26px;height:26px;border-radius:50%;object-fit:cover;filter:grayscale(1);border:1.5px solid #000}
.miembros .caras img + img{margin-left:-9px}
.proto{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(6px + env(safe-area-inset-bottom,0px));z-index:30;pointer-events:none;
  font-size:10px;color:rgba(255,255,255,.4)}
:focus-visible{outline:2px solid #fff;outline-offset:3px;border-radius:12px}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
[hidden]{display:none!important}
