/* ═══════════════════════════════════════════════════════════════════════════
   UNIR2 — Pantallas de entrada (login, passkey, onboarding, errores) con el estilo «Red de Sinaps».
   Se carga después del estilo propio de cada página y lo reemplaza.
   ═══════════════════════════════════════════════════════════════════════════ */
body.u-auth{min-height:100vh;margin:0;display:flex;align-items:center;justify-content:center;padding:24px 16px;overflow-x:hidden;
  font-family:var(--f-body);color:var(--fg);background:var(--bg);
  background-image:radial-gradient(900px 600px at 50% -10%,color-mix(in srgb,var(--axon) 26%,transparent),transparent 70%),
                   radial-gradient(700px 500px at 100% 110%,color-mix(in srgb,var(--synapse) 14%,transparent),transparent 70%),
                   radial-gradient(600px 500px at 0% 100%,color-mix(in srgb,var(--spark) 9%,transparent),transparent 70%)}
body.u-auth::before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.55;
  background-image:radial-gradient(1.5px 1.5px at 12% 18%,var(--synapse),transparent 60%),radial-gradient(1.2px 1.2px at 78% 12%,var(--axon),transparent 60%),
    radial-gradient(1.4px 1.4px at 88% 64%,var(--synapse),transparent 60%),radial-gradient(1.1px 1.1px at 24% 82%,var(--spark),transparent 60%),
    radial-gradient(1.3px 1.3px at 52% 92%,var(--axon),transparent 60%),radial-gradient(1px 1px at 64% 38%,var(--fg),transparent 60%),
    radial-gradient(1px 1px at 36% 44%,var(--fg),transparent 60%),radial-gradient(1.2px 1.2px at 6% 58%,var(--synapse),transparent 60%);
  animation:ua-twinkle 6s ease-in-out infinite alternate}
@keyframes ua-twinkle{to{opacity:.25}}
body.u-auth::after{display:none}

body.u-auth .auth-card,body.u-auth .card,body.u-auth .box{position:relative;z-index:1;width:100%;max-width:440px;padding:34px 30px;border-radius:24px;text-align:center;
  background:var(--surface-2);border:1px solid var(--line-strong);box-shadow:var(--shadow),0 0 60px -20px color-mix(in srgb,var(--synapse) 45%,transparent);
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);color:var(--fg)}
body.u-auth .auth-brand{margin-bottom:26px}
body.u-auth .auth-brand img,body.u-auth .box > img{width:64px;height:64px;border-radius:18px;margin:0 auto 16px;display:block;
  box-shadow:0 0 0 1px var(--line-strong),0 10px 40px -8px color-mix(in srgb,var(--brand) 70%,transparent);animation:ua-pulse 3.2s ease-in-out infinite}
@keyframes ua-pulse{50%{box-shadow:0 0 0 1px var(--line-strong),0 10px 50px -4px color-mix(in srgb,var(--synapse) 80%,transparent)}}
body.u-auth h1{font-family:var(--f-display);font-weight:500;font-size:clamp(20px,4.6vw,24px);line-height:1.25;color:var(--fg);margin-bottom:8px;letter-spacing:.01em}
body.u-auth .auth-brand p,body.u-auth .sub,body.u-auth .box p,body.u-auth p{color:var(--muted);font-size:14px;line-height:1.55}
body.u-auth .icon-wrap{width:64px;height:64px;border-radius:18px;margin:0 auto 18px;display:grid;place-items:center;font-size:28px;color:var(--synapse);
  background:color-mix(in srgb,var(--synapse) 12%,transparent);border:1px solid color-mix(in srgb,var(--synapse) 40%,transparent);box-shadow:0 0 30px -6px var(--synapse)}
body.u-auth .email-pill{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:99px;font-size:12.5px;font-weight:700;margin:6px 0 18px;
  background:color-mix(in srgb,var(--fg) 6%,transparent);border:1px solid var(--line);color:var(--muted)}

body.u-auth .btn-google,body.u-auth .btn-primary,body.u-auth a.btn,body.u-auth button.btn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;
  min-height:50px;padding:0 18px;border-radius:14px;font-family:var(--f-body);font-weight:800;font-size:15px;cursor:pointer;text-decoration:none;transition:filter .15s,border-color .15s,transform .15s}
body.u-auth .btn-google{background:var(--btn);color:var(--btn-fg);border:1px solid var(--btn)}
body.u-auth .btn-google:hover{filter:brightness(1.06);transform:translateY(-1px);color:var(--btn-fg)}
body.u-auth .btn-primary,body.u-auth a.btn,body.u-auth button.btn{background:var(--brand);color:#fff;border:1px solid var(--brand);box-shadow:0 10px 30px -12px var(--brand)}
body.u-auth .btn-primary:hover,body.u-auth a.btn:hover,body.u-auth button.btn:hover{filter:brightness(1.08);color:#fff}
body.u-auth .btn-primary:disabled{opacity:.6;cursor:not-allowed}
body.u-auth button.co{background:transparent;color:var(--fg);border:1px solid var(--line-strong);justify-content:flex-start;box-shadow:none;margin-top:8px}
body.u-auth button.co:hover{border-color:var(--synapse)}

body.u-auth .form-group{margin-bottom:14px;text-align:left}
body.u-auth .form-label{display:block;font-size:12.5px;font-weight:700;color:var(--muted);margin-bottom:6px}
body.u-auth .form-control{width:100%;min-height:46px;padding:10px 14px;border-radius:12px;border:1px solid var(--line-strong);background:var(--input);color:var(--fg);font-family:var(--f-body);font-size:14.5px}
body.u-auth .form-control:focus{outline:none;border-color:var(--synapse);box-shadow:0 0 0 3px color-mix(in srgb,var(--synapse) 20%,transparent)}
body.u-auth select.form-control option{background:var(--surface-solid);color:var(--fg)}
body.u-auth .hint{font-size:12px;color:var(--faint);margin-top:6px}

body.u-auth .alert{display:none;align-items:flex-start;gap:8px;padding:12px 14px;border-radius:12px;font-size:13.5px;margin-bottom:16px;text-align:left;border:1px solid}
body.u-auth .alert.show,body.u-auth .alert.alert-danger{display:flex}
body.u-auth .alert-danger,body.u-auth .alert.error{background:var(--danger-bg);border-color:color-mix(in srgb,var(--danger) 40%,transparent);color:var(--fg)}
body.u-auth .alert.success{background:var(--ok-bg);border-color:color-mix(in srgb,var(--ok) 40%,transparent);color:var(--fg)}
body.u-auth .alert i{color:var(--danger)} body.u-auth .alert.success i{color:var(--ok)}
body.u-auth .warn{background:var(--warn-bg);border:1px solid color-mix(in srgb,var(--warn) 40%,transparent);color:var(--fg);border-radius:12px;padding:10px 12px;font-size:13px;text-align:left}

body.u-auth .benefits{list-style:none;display:flex;flex-direction:column;gap:8px;margin:0 0 20px;text-align:left}
body.u-auth .benefit{display:flex;gap:8px;align-items:flex-start;font-size:13.5px;color:var(--fg)}
body.u-auth .benefit i{color:var(--ok);margin-top:2px}

body.u-auth .auth-footer,body.u-auth .cancel{display:block;margin-top:20px;font-size:12.5px;color:var(--faint);background:none;border:0;font-family:var(--f-body)}
body.u-auth .auth-footer a,body.u-auth .cancel:hover{color:var(--synapse)}

body.u-auth .u-auth-err{font-size:64px;font-family:var(--f-display);font-weight:500;line-height:1;margin-bottom:10px;
  background:linear-gradient(135deg,var(--synapse),var(--axon) 60%,var(--spark));-webkit-background-clip:text;background-clip:text;color:transparent}
@media (max-width:480px){body.u-auth .auth-card,body.u-auth .card,body.u-auth .box{padding:28px 20px;border-radius:20px}}
@media (prefers-reduced-motion:reduce){body.u-auth::before,body.u-auth .auth-brand img{animation:none}}