/* ── La entrada, más luxury (23-sep-2026) ────────────────────────────────
   Pedro, tras cuatro rondas de opciones: "tiene que seguir con la misma,
   solo mejorar para que se vea más luxury". La pantalla no cambia de forma
   (el haz desde arriba, "Bienvenido a ΛTMΛ", la tarjeta de vidrio); se
   afinan los materiales. Vale para entrar, crear cuenta e invitación, que
   usan las mismas piezas (.acceso / .tarjeta-acceso).

   Carga el último; quitar su <link> devuelve la entrada de antes. */

/* El nombre: más liviano y con más aire. */
.acceso .marca-grande .sobre{ font-family:Jost, sans-serif; font-weight:300; letter-spacing:.55em !important; color:rgba(238,237,245,.72) }
.acceso .marca-grande .logo{ font-weight:200 !important; letter-spacing:.42em }

/* La tarjeta: más angosta, borde más fino y el filo de arriba encendido
   justo donde cae el haz. */
.acceso .tarjeta-acceso{
  position:relative; max-width:400px; padding:40px 36px 30px; border-radius:26px;
  background:linear-gradient(180deg, rgba(20,14,48,.62), rgba(8,6,22,.78)) !important;
  border:1px solid rgba(185,165,255,.14) !important;
  box-shadow:0 50px 120px -40px rgba(0,0,0,.95), inset 0 1px 0 rgba(238,237,245,.05) !important;
  backdrop-filter:blur(28px) saturate(1.2); -webkit-backdrop-filter:blur(28px) saturate(1.2);
}
.acceso .tarjeta-acceso::before{
  content:''; position:absolute; top:-1px; left:50%; width:62%; height:1px; transform:translateX(-50%);
  background:linear-gradient(90deg, transparent, rgba(211,197,255,.9), transparent);
  box-shadow:0 0 18px 2px rgba(185,165,255,.45); pointer-events:none;
}
.acceso .tarjeta-acceso:focus-within{ border-color:rgba(185,165,255,.3) !important }
.acceso .tarjeta-acceso h1{ font-weight:200 !important; font-size:30px !important; letter-spacing:-.02em; margin-bottom:6px }
.acceso .tarjeta-acceso .entradilla{ font-size:13px !important; color:rgba(238,237,245,.55) !important; margin-bottom:26px }

/* Los campos: oscuros, con borde de un pelo. El autocompletar de Chrome
   pintaba el fondo de blanco; se tapa con una sombra interior. */
.acceso .campo label{ font-size:9.5px !important; letter-spacing:.3em !important; color:rgba(238,237,245,.45) !important; margin-left:2px }
.acceso input{
  padding:15px 18px !important; border-radius:14px !important;
  background:rgba(238,237,245,.035) !important; border:1px solid rgba(238,237,245,.1) !important; box-shadow:none !important;
  color:#eeedf5 !important; font:300 15px var(--display) !important; letter-spacing:.01em;
  transition:border-color .3s, box-shadow .3s, background .3s;
}
.acceso input::placeholder{ color:rgba(238,237,245,.28) }
.acceso input:focus{ border-color:rgba(185,165,255,.5) !important; background:rgba(238,237,245,.05) !important; box-shadow:0 0 0 5px rgba(185,165,255,.07) !important }
.acceso input:-webkit-autofill, .acceso input:-webkit-autofill:hover, .acceso input:-webkit-autofill:focus{
  -webkit-text-fill-color:#eeedf5 !important; caret-color:#eeedf5;
  -webkit-box-shadow:0 0 0 1000px #140f2e inset !important; transition:background-color 9999s;
}

/* El botón: la misma píldora con su luz que recorre el borde, pero en
   versalitas finas, como el resto de la app. */
.acceso .tarjeta-acceso .btn-luz{ margin-top:14px; padding:16px 24px !important; font-size:11px !important; font-weight:400 !important; letter-spacing:.34em !important; text-transform:uppercase !important }
.acceso .tarjeta-acceso .btn-luz::after{ font-size:12px; letter-spacing:0 }

/* Los avisos ("Cerraste sesión", errores): una línea, no una caja. */
.acceso .tarjeta-acceso .nota{ padding:10px 14px !important; border-radius:12px !important; font-size:12.5px; background:rgba(238,237,245,.03) !important; border:1px solid rgba(238,237,245,.08) !important; box-shadow:none !important; backdrop-filter:none !important }
.acceso .tarjeta-acceso .nota.bien{ color:rgb(95,242,214) !important; border-color:rgba(95,242,214,.2) !important }

/* Las ayudas: un pie discreto separado por una línea fina. */
.acceso .aviso-correo{ margin-top:24px !important; padding:20px 0 0 !important; border:0 !important; border-top:1px solid rgba(238,237,245,.07) !important; border-radius:0 !important; background:transparent !important; box-shadow:none !important; backdrop-filter:none !important; text-align:center; font-size:11.5px !important; color:rgba(238,237,245,.45) !important }
.acceso .tarjeta-acceso .pista{ font-size:11.5px !important; line-height:1.6; color:rgba(238,237,245,.4) !important; margin-top:10px !important }
.acceso .tarjeta-acceso a{ color:#d3c5ff !important; text-decoration:none; border-bottom:1px solid rgba(211,197,255,.3) }

/* Continuar con Google (26-sep-2026): la misma píldora, en vidrio, con la G de colores. */
.acceso .separador-o{ display:flex; align-items:center; gap:14px; margin:18px 0 14px; color:rgba(238,237,245,.35); font-size:10px; letter-spacing:.3em; text-transform:uppercase }
.acceso .separador-o::before, .acceso .separador-o::after{ content:''; flex:1; height:1px; background:rgba(238,237,245,.08) }
.acceso .tarjeta-acceso a.btn-google{
  display:flex; align-items:center; justify-content:center; gap:12px; width:100%; box-sizing:border-box; padding:14px 20px;
  border-radius:99px; border:1px solid rgba(238,237,245,.14) !important; background:rgba(238,237,245,.04);
  color:#eeedf5 !important; font:400 11px Jost, sans-serif; letter-spacing:.24em; text-transform:uppercase; text-decoration:none;
  transition:background .25s, border-color .25s;
}
.acceso .tarjeta-acceso a.btn-google:hover{ background:rgba(238,237,245,.08); border-color:rgba(185,165,255,.35) !important }