.fan-app{padding-bottom:108px;background:radial-gradient(circle at 80% 8%,rgba(242,183,5,.09),transparent 25%),radial-gradient(circle at 8% 26%,rgba(34,181,107,.11),transparent 24%),var(--bg-0);min-height:100vh}.fan-header{position:relative}.fan-header-mark{border:1px solid var(--border);border-radius:999px;padding:7px 10px;color:var(--green-300);font-size:10px;font-weight:900;letter-spacing:.08em}.fan-profile-shell{padding:18px;max-width:1240px;margin:auto}.fan-eyebrow{display:block;color:var(--green-300);font-size:9px;font-weight:900;letter-spacing:.11em;text-transform:uppercase}.fan-auth-hero{margin:18px;padding:30px;min-height:260px;display:flex;align-items:center;justify-content:space-between;gap:25px;border:1px solid var(--border-strong);border-radius:30px;background:linear-gradient(135deg,#073d2c,#041a13 60%,#1d2d0e);overflow:hidden;position:relative}.fan-auth-hero:after{content:"FBF";position:absolute;right:-18px;bottom:-48px;font-size:150px;font-weight:950;color:rgba(255,255,255,.025)}.fan-auth-hero img{width:110px;filter:drop-shadow(0 18px 30px rgba(0,0,0,.4));z-index:1}.fan-auth-copy{max-width:570px;z-index:1}.fan-auth-copy h1{font-size:clamp(30px,6vw,58px);line-height:.98;letter-spacing:-.055em;margin:12px 0}.fan-auth-copy p{max-width:540px;color:var(--text-secondary);line-height:1.6}.fan-trust-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}.fan-trust-row span{padding:7px 10px;border-radius:999px;background:rgba(255,255,255,.055);font-size:9px;color:var(--text-secondary)}.fan-auth-card{max-width:650px;margin:18px auto;padding:24px;border-radius:26px;background:var(--surface);border:1px solid var(--border-strong)}.auth-tabs{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:5px;background:var(--bg-1);border-radius:999px}.auth-tabs button{border:0;border-radius:999px;background:transparent;color:var(--text-secondary);padding:11px;font-weight:800}.auth-tabs button.active{background:var(--gradient-gold);color:#071c14}.form-field{margin-top:14px}.form-field label{display:block;font-size:10px;font-weight:850;color:var(--text-secondary);letter-spacing:.04em;text-transform:uppercase}.form-field input,.form-field select{width:100%;margin-top:6px;padding:13px 14px;border:1px solid var(--border);border-radius:13px;background:var(--bg-1);color:var(--text-primary);font:inherit}.form-field input:focus,.form-field select:focus{outline:2px solid rgba(61,224,150,.25);border-color:var(--green-300)}.form-field small{display:block;margin-top:6px;color:var(--text-muted);font-size:10px}.password-field{display:flex;margin-top:6px;border:1px solid var(--border);border-radius:13px;background:var(--bg-1);overflow:hidden}.password-field input{margin:0;border:0;border-radius:0}.password-field button{border:0;background:transparent;color:var(--green-300);padding:0 14px;font-size:11px;font-weight:800}.btn-submit,.fan-primary-action{border:0;border-radius:999px;background:var(--gradient-gold);color:#071c14;font-weight:900;padding:13px 19px}.btn-submit{width:100%;margin-top:18px}.auth-text-button{display:block;margin:12px auto 0;border:0;background:transparent;color:var(--green-300);font-size:11px;font-weight:750}.auth-form-head{display:flex;gap:10px;align-items:center;margin-bottom:15px}.auth-form-head button{width:36px;height:36px;border-radius:50%;border:1px solid var(--border);background:transparent;color:var(--text-primary)}.auth-form-head strong,.auth-form-head small{display:block}.auth-form-head small{font-size:10px;color:var(--text-muted);margin-top:2px}.msg{margin-top:10px;font-size:11px;text-align:center}.msg.error{color:#ff6b70}.msg.success{color:var(--green-300)}
.fan-identity-card,.fan-progress-card,.fan-menu-card,.fan-panel,.fan-form-card,.prediction-card,.reward-card,.history-card{background:rgba(10,47,36,.78);border:1px solid var(--border);box-shadow:0 18px 50px rgba(0,0,0,.12)}.fan-identity-card{padding:24px;border-radius:28px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:18px;text-align:left}.avatar-wrap{position:relative;width:76px;height:76px}.avatar-circle,.avatar-wrap>img{width:76px;height:76px;border-radius:24px;display:grid;place-items:center;background:linear-gradient(150deg,#35db93,#f4bd18);color:#062118;font-weight:900;font-size:25px;object-fit:cover}.avatar-wrap>img{position:absolute;inset:0}.avatar-wrap button{position:absolute;right:-5px;bottom:-5px;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--border-strong);background:#082a20;color:#fff}.avatar-wrap button svg{width:14px}.identity-copy strong,.identity-copy span{display:block}.identity-copy strong{font-size:20px;margin:4px 0}.identity-copy>span:last-child{color:var(--text-muted);font-size:12px}.favorite-club-control{display:flex;align-items:center;gap:9px}.favorite-club-control img{width:34px;height:34px;object-fit:contain}.favorite-club-control select{max-width:220px;border:1px solid var(--border);border-radius:999px;padding:10px 12px;background:var(--bg-1);color:var(--text-primary);font-weight:750}.fan-progress-card{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:22px;margin-top:14px;padding:22px;border-radius:28px;background:linear-gradient(120deg,rgba(8,67,48,.92),rgba(5,32,24,.96) 60%,rgba(87,80,11,.4))}.progress-ring{width:105px;height:105px;border-radius:50%;display:grid;place-content:center;text-align:center;background:radial-gradient(circle at center,#073226 59%,transparent 61%),conic-gradient(var(--gold-500) var(--progress,0%),rgba(255,255,255,.09) 0);box-shadow:inset 0 0 0 1px var(--border)}.progress-ring strong{font-size:28px;line-height:1}.progress-ring span{font-size:9px;text-transform:uppercase;color:var(--text-muted);margin-top:3px}.progress-copy h2{font-size:22px;margin:4px 0}.progress-copy p{font-size:11px;color:var(--text-secondary)}.progress-track{height:6px;margin:12px 0 6px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden}.progress-track i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--green-300),var(--gold-500));border-radius:inherit}.progress-copy small{color:var(--text-muted);font-size:9px}.fan-menu{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:14px}.fan-menu-card{appearance:none;text-decoration:none;color:inherit;padding:18px;border-radius:22px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:13px;text-align:left;cursor:pointer;transition:transform .2s,border-color .2s}.fan-menu-card:hover{transform:translateY(-2px);border-color:var(--green-300)}.fan-menu-card.featured{background:linear-gradient(120deg,rgba(18,102,70,.8),rgba(8,49,36,.9));border-color:rgba(55,224,151,.38)}.fan-menu-card .menu-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:14px;background:rgba(255,255,255,.06);font-size:20px}.fan-menu-card strong,.fan-menu-card small{display:block}.fan-menu-card strong{font-size:13px}.fan-menu-card small{margin-top:4px;color:var(--text-muted);font-size:9px}.fan-menu-card b{font-size:24px;color:var(--green-300)}.fan-menu-card.danger strong,.fan-menu-card.danger b{color:#ff6267}.fan-menu-card.admin-entry{grid-column:1/-1}
.fan-panel{padding:22px;border-radius:28px}.panel-back{border:0;background:transparent;color:var(--green-300);font-weight:850;margin-bottom:16px}.panel-title,.panel-hero{padding:20px;border-radius:22px;background:linear-gradient(135deg,rgba(23,102,72,.34),rgba(3,24,18,.35));border:1px solid var(--border)}.panel-title h1,.panel-hero h1{font-size:clamp(26px,5vw,42px);letter-spacing:-.045em;margin:5px 0}.panel-title p,.panel-hero p{color:var(--text-secondary);font-size:11px;line-height:1.55}.prediction-hero{background:radial-gradient(circle at 90% 10%,rgba(242,183,5,.22),transparent 32%),linear-gradient(135deg,#084a35,#031f17)}.prediction-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:18px}.prediction-kpi{padding:12px;border-radius:14px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.07)}.prediction-kpi strong,.prediction-kpi small{display:block}.prediction-kpi strong{font-size:19px}.prediction-kpi small{font-size:8px;color:var(--text-muted);text-transform:uppercase;margin-top:3px}.fan-section-head{display:flex;align-items:end;justify-content:space-between;gap:12px;margin:28px 2px 12px}.fan-section-head span,.fan-section-head small{display:block}.fan-section-head span{font-size:16px;font-weight:900}.fan-section-head small{font-size:9px;color:var(--text-muted);margin-top:3px}.fan-section-head select{max-width:250px;padding:9px 11px;border:1px solid var(--border);border-radius:999px;background:var(--surface);color:var(--text-primary)}.prediction-grid,.reward-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.prediction-card{border-radius:22px;padding:16px}.prediction-meta{display:flex;justify-content:space-between;gap:10px;font-size:8px;text-transform:uppercase;color:var(--green-300);font-weight:850;letter-spacing:.06em}.prediction-teams{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;margin:18px 0}.prediction-team{text-align:center;min-width:0}.prediction-team img{display:block;width:48px;height:48px;object-fit:contain;margin:auto}.prediction-team strong{display:block;font-size:11px;margin-top:7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.prediction-score{display:flex;align-items:center;gap:6px}.prediction-score input{width:52px;height:54px;border:1px solid var(--border-strong);border-radius:14px;background:#041d16;color:#fff;text-align:center;font-size:22px;font-weight:900}.prediction-score b{color:var(--text-muted)}.prediction-card button,.fan-secondary-action{width:100%;border:1px solid rgba(55,224,151,.4);border-radius:999px;padding:11px;background:rgba(28,173,110,.12);color:var(--green-300);font-weight:850}.prediction-card button:disabled{opacity:.55}.prediction-lock{display:block;text-align:center;margin-top:8px;color:var(--text-muted);font-size:8px}.reward-card{border-radius:20px;padding:17px;position:relative;overflow:hidden}.reward-card:before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:linear-gradient(var(--green-300),var(--gold-500))}.reward-card strong{display:block}.reward-card p{font-size:10px;color:var(--text-secondary);line-height:1.5;margin:7px 0}.reward-card small{font-size:9px;color:var(--gold-500);font-weight:850}.reward-card button{margin-top:12px;width:100%;padding:9px;border-radius:999px;border:1px solid var(--border);background:transparent;color:var(--text-primary);font-weight:800}.reward-card button:disabled{opacity:.45}.history-card{padding:14px;border-radius:17px;margin-bottom:9px;display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center}.history-card strong,.history-card small{display:block}.history-card small{font-size:9px;color:var(--text-muted);margin-top:4px}.history-score{text-align:right}.history-score b{font-size:18px}.history-score span{display:block;color:var(--green-300);font-size:9px;font-weight:850;margin-top:3px}.state-msg{padding:16px;text-align:center;color:var(--text-muted);font-size:11px}.history-toggle{display:flex;gap:8px;align-items:center;margin:15px 3px 10px;color:var(--text-secondary);font-size:10px}.order-row{padding:16px;border-radius:19px;background:var(--surface);border:1px solid var(--border);margin-bottom:10px;font-size:11px}.order-row strong{display:block;font-size:13px;margin-bottom:5px}.order-status{display:inline-block;margin-top:7px;font-size:8px;font-weight:900;text-transform:uppercase;padding:4px 8px;border-radius:999px;background:rgba(242,183,5,.14);color:var(--gold-500)}.order-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.order-actions button{border:1px solid var(--border);border-radius:999px;background:transparent;color:var(--text-secondary);padding:7px 9px;font-size:9px;font-weight:800}.ticket-qr-wrap{margin-top:12px;padding:13px;border-radius:15px;background:#fff;display:flex;flex-direction:column;align-items:center;gap:5px;color:#222}.fan-form-card{padding:18px;border-radius:20px;margin-top:12px}.fan-form-card h2{font-size:15px}.fan-secondary-action{margin-top:16px}.privacy-note{padding:17px;border:1px solid var(--border);border-radius:18px;margin-top:12px;background:rgba(242,183,5,.055)}.privacy-note strong{font-size:12px}.privacy-note p{font-size:10px;line-height:1.55;color:var(--text-secondary);margin-top:5px}#fan-toast{position:fixed;z-index:9999;left:50%;bottom:110px;transform:translate(-50%,20px);opacity:0;pointer-events:none;max-width:min(90vw,520px);padding:11px 15px;border-radius:999px;background:#fff;color:#08251c;box-shadow:0 18px 45px rgba(0,0,0,.35);font-size:11px;font-weight:800;transition:.25s}#fan-toast.show{opacity:1;transform:translate(-50%,0)}#fan-toast.error{background:#c9343c;color:#fff}
@media(max-width:720px){.fan-profile-shell{padding:12px}.fan-auth-hero{margin:12px;padding:25px 20px;min-height:320px}.fan-auth-hero img{width:68px;align-self:flex-start}.fan-auth-copy h1{font-size:36px}.fan-auth-card{margin:12px}.fan-identity-card{grid-template-columns:auto 1fr;padding:18px}.favorite-club-control{grid-column:1/-1}.favorite-club-control select{flex:1;max-width:none}.fan-progress-card{grid-template-columns:auto 1fr;padding:17px;gap:14px}.progress-ring{width:83px;height:83px}.progress-copy h2{font-size:17px}.fan-progress-card>.fan-primary-action{grid-column:1/-1;width:100%}.fan-menu{grid-template-columns:1fr}.fan-menu-card.admin-entry{grid-column:auto}.fan-panel{padding:15px}.prediction-kpis{grid-template-columns:repeat(2,1fr)}.prediction-grid,.reward-grid{grid-template-columns:1fr}.fan-section-head{align-items:flex-start;flex-direction:column}.fan-section-head select{width:100%;max-width:none}}
@media(min-width:721px){.fan-panel{margin-top:14px}}

/* ---------------------------------------------------------------------------
   Menú de la cuenta — ritmo deliberado en lugar de rejilla dentada
   ---------------------------------------------------------------------------
   Son 7 tarjetas en una rejilla de 2 columnas: la última fila quedaba con una
   celda vacía y el bloque se veía desalineado. Además .admin-entry estaba
   declarada dos veces con valores opuestos (grid-column:1/-1 y luego auto),
   así que su ancho dependía del orden de carga.

   Ahora la composición es intencional:
     Palpites (destacado)      → ancho completo, es la acción principal
     Entradas · Compras
     Favoritos · Datos          → cuatro tarjetas en 2x2, perfectamente parejas
     Panel administrativo       → ancho completo cuando el rol lo habilita
     Cerrar sesión              → ancho completo y separada del resto
   -------------------------------------------------------------------------- */
.fan-menu .fan-menu-card.featured,
.fan-menu .fan-menu-card.admin-entry,
.fan-menu .fan-menu-card.danger { grid-column: 1 / -1; }

/* La salida no compite con las acciones de uso diario. */
.fan-menu .fan-menu-card.danger {
  margin-top: 6px;
  border-top: 1px solid var(--border);
  border-radius: 22px;
}

/* Una tarjeta oculta no debe reservar espacio en la rejilla. */
.fan-menu .fan-menu-card[hidden] { display: none !important; }

/* En una sola columna todas ocupan el ancho: la regla de arriba ya no aplica
   ninguna diferencia, pero se conserva el respiro de la acción de salida. */
@media (max-width: 640px) {
  .fan-menu .fan-menu-card.danger { margin-top: 4px; }
}
