:root{
  --fondo:#F6F7F9; --morado:#6E5BFF; --moradoOsc:#5B49D6;
  --tinta:#2E1A5B; --texto:#3A3350; --gris:#695F89;
  --linea:#E7E4F2; --aviso:#FAEFD7; --avisoTxt:#745619;
}
*{box-sizing:border-box;margin:0;padding:0}
body{
  font-family:'Girose',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  background:var(--fondo);color:var(--texto);
  -webkit-font-smoothing:antialiased;line-height:1.6;
}
.marco{max-width:680px;margin:0 auto;padding:26px 16px 40px}

.cab{display:flex;align-items:center;gap:9px;margin-bottom:30px}
.cab a{display:flex;align-items:center;gap:9px;text-decoration:none;color:var(--tinta)}
.cab .g{width:auto;height:29px}
.cab span{font-weight:600;font-size:17px;letter-spacing:-.01em}

h1{font-size:30px;line-height:1.18;font-weight:700;letter-spacing:-.02em;color:var(--tinta);margin-bottom:10px}
h2{font-size:19px;font-weight:700;color:var(--tinta);margin:30px 0 8px;letter-spacing:-.01em}
h3{font-size:16px;font-weight:600;color:var(--tinta);margin:20px 0 4px}
p{margin-bottom:12px}
ul{margin:0 0 14px 20px}
li{margin-bottom:6px}
a{color:var(--moradoOsc)}
strong{color:var(--tinta);font-weight:600}
.fecha{font-size:14px;color:var(--gris);margin-bottom:26px}

.provisional{
  background:var(--aviso);color:var(--avisoTxt);border-radius:14px;
  padding:14px 16px;margin-bottom:28px;font-size:14.5px;line-height:1.5;
}
.provisional b{font-weight:700}

.tarjeta{background:#fff;border-radius:18px;padding:20px;margin-bottom:14px;
  box-shadow:0 1px 2px rgba(43,27,88,.05),0 8px 22px rgba(43,27,88,.05)}
.tarjeta h2{margin-top:0}
.tarjeta p:last-child{margin-bottom:0}

.btn{display:inline-flex;align-items:center;justify-content:center;
  height:52px;padding:0 26px;border-radius:14px;border:0;cursor:pointer;
  font-family:inherit;font-size:17px;font-weight:600;
  background:var(--morado);color:#fff;text-decoration:none}
.btn:active{background:var(--moradoOsc)}
.btn.ancho{width:100%}

label{display:block;font-size:14.5px;font-weight:600;color:var(--tinta);margin:16px 0 6px}
input,textarea,select{
  width:100%;font-family:inherit;font-size:16px;color:var(--tinta);
  background:#fff;border:1.5px solid var(--linea);border-radius:12px;
  padding:13px 14px;outline:none}
input:focus,textarea:focus,select:focus{border-color:var(--morado)}
textarea{min-height:110px;resize:vertical}
.ayuda{font-size:13.5px;color:var(--gris);margin-top:5px}

.pie{border-top:1px solid var(--linea);margin-top:40px;padding-top:20px;
  font-size:13.5px;color:var(--gris);line-height:1.8}
.pie a{color:var(--gris);margin-right:14px}

/* El campo trampa del formulario de borrar-cuenta.html (honeypot de Netlify):
   fuera de la pantalla, para que lo rellenen solo los robots. */
.oculto{position:absolute;left:-9999px}

/* SIN MODO OSCURO, a propósito · 27 oct 2026, Sergio.
   La app NO tiene modo oscuro, y es una decisión tomada: AppearanceScreen.js lo dice
   en su primera línea, «Solo modo Claro disponible en Beta (maestro 4.7.6)». Y estas
   páginas se abren DESDE DENTRO de la app (Términos y Privacidad), así que una página
   oscura saliendo de una app blanca es el camino que más gente va a hacer. Aquí había
   dos bloques @media (prefers-color-scheme: dark); se quitaron para que todas las
   páginas se vean siempre en claro, igual que la portada (portada.css nunca lo tuvo).
   El día que la app tenga modo oscuro, después de la Beta, se le pone a las dos a la vez.

   Y con ellos se fue el bloque rotulado «Portada (solo la usa index.html)»: era código
   muerto de una versión vieja. index.html carga portada.css, que se basta sola, y
   ninguna de las seis páginas que cargan esta hoja usaba esas clases, salvo .oculto,
   que se ha quedado arriba con su nombre de verdad. */