/* Login del panel (Ronda 22 · B1). Hoja propia y no inline: la CSP del server sirve
   `script-src 'self'` sin 'unsafe-inline', y el login es la única página que ve alguien
   sin sesión — tiene que cargar sí o sí. Los tokens vienen de `tokens.css` (R37), enlazada antes. */
*{box-sizing:border-box}
body{margin:0;min-height:100dvh;display:grid;place-items:center;padding:24px;
     background:var(--bg);color:var(--ink);font:14px/1.5 var(--font-sans)}
.card{width:min(100%,380px);background:var(--surface);border:1px solid var(--border);
      border-radius:16px;padding:28px;box-shadow:var(--shadow-md)}
.brand{display:flex;align-items:center;gap:10px;margin-bottom:4px}
.glyph{width:36px;height:36px;flex:none}   /* sello FO: el dibujo es icono/logo.svg */
h1{font:600 19px/1.2 var(--font-serif);margin:0}
.sub{color:var(--faint);font-size:11.5px;margin:2px 0 20px 46px}   /* 36 del sello + 10 de hueco: bajo el wordmark */
label{display:block;font-size:12px;color:var(--muted);margin:0 0 12px;font-weight:600}
input,textarea{display:block;width:100%;margin-top:5px;padding:9px 10px;font:13.5px var(--font-sans);
       color:var(--ink);background:var(--surface);border:1px solid var(--border);border-radius:9px}
input:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
button{width:100%;padding:10px;font:600 13px var(--font-sans);border-radius:9px;cursor:pointer;
       background:var(--accent);color:var(--accent-ink);border:1px solid var(--accent)}
button:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
button[disabled]{opacity:.55;cursor:progress}
.link{background:none;border:0;color:var(--accent);font-weight:600;font-size:12px;
      text-decoration:underline;padding:8px;margin-top:10px;width:auto;display:block;margin-inline:auto}
.msg{margin:0 0 14px;padding:9px 11px;border-radius:9px;font-size:12.5px;display:none}
.msg.err{display:block;background:var(--danger-dim);color:var(--danger)}
.msg.ok{display:block;background:var(--ok-dim);color:var(--ok)}
/* «Mantener mi sesión activa»: fila, no bloque — la etiqueta va al lado de la casilla. */
.chk{display:flex;align-items:center;gap:8px;font-weight:500;color:var(--faint);margin-bottom:14px}
.chk input{width:auto;margin:0;accent-color:var(--accent)}
.chk-nota{color:var(--faint);font-size:11.5px;line-height:1.4;margin:-8px 0 16px 0}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.pie{margin-top:18px;padding-top:14px;border-top:1px solid var(--border);color:var(--faint);font-size:11px;text-align:center}
[hidden]{display:none !important}
/* edición retail · segundo factor: campo a 16 px (iOS no hace zoom al enfocarlo) y objetivo táctil de 44 px */
#frmTotp input{font-size:16px;min-height:44px}
#frmTotp .link{min-height:44px}
/* edición retail (login.js pone body.retail): objetivos táctiles de 44 px */
.retail input:not([type=checkbox]),.retail button{min-height:44px}
.retail .chk{min-height:44px;margin-bottom:6px}
.retail .chk input{width:20px;height:20px}
.retail .link{min-height:44px}
.retail .pie-legal{margin-top:8px;padding-top:0;border-top:0}
.retail .pie-legal a{display:inline-block;padding:15px 6px}
.retail .chk-nota a{padding:15px 0}   /* en línea: el relleno vertical agranda el blanco táctil sin partir la frase */
#olvido,#invitacion{margin:14px 0 0}   /* el .chk-nota genérico sube 8 px: aquí va debajo del botón y no debe taparlo */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.retail a{color:var(--accent)}