/* =====================================================================
   Lengwi · páginas de acceso (entrar, registro, recuperar, nueva contraseña)
   Mismos colores y tipografías que la página de inicio.
   ===================================================================== */
:root{
  --bg:#faf6ee; --card:#fffdf9; --ink:#4d4a44; --head:#45403a; --muted:#8a8072;
  --accent:#4a7a52; --accent-dark:#33573a; --accent-soft:#e3ecdf;
  --line:#e9e1d1; --field:#fffefb; --focus:#9cc0a2;
  --err:#b3492c; --err-soft:#f7e2d8;
  --wm-a:#3e822d; --wm-b:#d25c08;
  --serif:"Lora",Georgia,serif;
  --sans:"Karla",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
*{box-sizing:border-box;}
html,body{margin:0;}
body{background:var(--bg); color:var(--ink); font-family:var(--sans); font-size:16px; line-height:1.55; -webkit-font-smoothing:antialiased;}
a{color:var(--accent-dark); font-weight:600;}
a:hover{color:var(--accent);}
[hidden]{display:none !important;}

.auth{min-height:100vh; display:flex; flex-direction:column; align-items:center; gap:22px; padding:40px 16px 32px;}

.brand{display:flex; align-items:center; gap:8px; text-decoration:none;}
.wm-logo{height:30px; width:auto;}
.wm{font-family:var(--serif); font-weight:700; font-size:1.55rem; letter-spacing:-.01em; line-height:1;}
.wm-a{color:var(--wm-a);} .wm-b{color:var(--wm-b);}

.auth-card{width:100%; max-width:420px; background:var(--card); border:1px solid var(--line); border-radius:18px;
  padding:32px 30px 30px; box-shadow:0 18px 40px -28px rgba(58,44,28,.35);}
.auth-card h1{font-family:var(--serif); color:var(--head); font-size:1.75rem; line-height:1.2; letter-spacing:-.01em; margin:0; text-wrap:balance;}
.auth-sub{margin:6px 0 0; color:var(--muted); font-size:.95rem;}

.auth-msg{margin:20px 0 0; padding:12px 14px; border-radius:12px; font-size:.93rem; line-height:1.45;}
.auth-msg.is-error{background:var(--err-soft); color:#7f3017;}
.auth-msg.is-ok{background:var(--accent-soft); color:var(--accent-dark);}

.oauth{margin-top:24px;}
.btn-google{width:100%; display:flex; align-items:center; justify-content:center; gap:10px; padding:12px 16px;
  background:#fff; color:#3c4043; border:1px solid #dadce0; border-radius:999px; font:600 1rem var(--sans); cursor:pointer;}
.btn-google:hover{background:#f8f9fa; border-color:#c6c9cc;}
.btn-google svg{width:18px; height:18px; flex:none;}
.divider{display:flex; align-items:center; gap:12px; margin:22px 0 4px; color:var(--muted); font-size:.85rem;}
.divider::before,.divider::after{content:""; flex:1; height:1px; background:var(--line);}

form{display:flex; flex-direction:column; gap:6px; margin-top:20px;}
.oauth:not([hidden]) + form{margin-top:10px;}
label{font-weight:600; font-size:.9rem; color:var(--head); margin-top:10px;}
.label-row{display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-top:10px;}
.label-row label{margin-top:0;}
.small-link{font-size:.85rem;}
.hint{font-size:.82rem; color:var(--muted); margin:2px 0 0;}
input[type=email],input[type=text],input[type=password]{width:100%; padding:12px 14px; font:400 1rem var(--sans); color:var(--ink);
  background:var(--field); border:1px solid var(--line); border-radius:12px; outline:none; transition:border-color .15s, box-shadow .15s;}
input:focus{border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft);}
input[aria-invalid=true]{border-color:var(--err);}
.pw-wrap{position:relative;}
.pw-wrap input{padding-right:84px;}
.pw-toggle{position:absolute; right:8px; top:50%; transform:translateY(-50%); background:none; border:0; padding:6px 8px;
  color:var(--accent-dark); font:600 .82rem var(--sans); cursor:pointer; border-radius:8px;}
.pw-toggle:hover{background:var(--accent-soft);}

.btn-primary{margin-top:20px; width:100%; display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:13px 26px;
  background:var(--accent); color:#fff; border:0; border-radius:999px; font:600 1.02rem var(--sans); cursor:pointer;
  box-shadow:0 6px 16px -6px rgba(51,87,58,.55); transition:background .15s;}
.btn-primary:hover{background:var(--accent-dark);}
.btn-primary[disabled]{opacity:.65; cursor:wait;}
.btn-secondary{margin-top:14px; width:100%; padding:11px 20px; background:transparent; color:var(--accent-dark);
  border:1px solid var(--line); border-radius:999px; font:600 .95rem var(--sans); cursor:pointer;}
.btn-secondary:hover{border-color:var(--accent);}
.btn-secondary[disabled]{opacity:.6; cursor:default;}

.done{margin-top:22px; text-align:center;}
.done-ico{width:56px; height:56px; margin:0 auto 12px; border-radius:16px; display:flex; align-items:center; justify-content:center;
  background:var(--accent-soft); color:var(--accent-dark);}
.done-ico svg{width:28px; height:28px;}
.done h2{font-family:var(--serif); color:var(--head); font-size:1.3rem; margin:0 0 8px;}
.done p{margin:0 0 6px; font-size:.95rem;}
.done .muted{color:var(--muted); font-size:.88rem;}

.auth-foot{margin:0; font-size:.9rem; color:var(--muted);}
.auth-foot a{color:var(--muted); font-weight:600;}

:focus-visible{outline:2px solid var(--accent); outline-offset:2px;}
@media (max-width:440px){ .auth{padding-top:28px;} .auth-card{padding:26px 20px 24px; border-radius:16px;} }
@media (prefers-reduced-motion:reduce){ *{transition:none !important;} }