/* La paleta del tutor, en un solo lugar.
 *
 * Estaba escrita tres veces —esta hoja, `entrar.html` y `panel.html`— y ya
 * habia empezado a separarse: el mismo rojo `#f28b82` se llamaba `--error` en
 * una y `--rojo` en la otra, y aqui no existia. Cambiar un color significaba
 * acordarse de tres archivos, y el que se olvidara quedaba con el color viejo.
 *
 * `estilos.css` sigue siendo la hoja del escenario (sin scroll, sin seleccion)
 * y el panel sigue con la suya: lo que se comparte son los colores, no el
 * acomodo. Por eso esto es una hoja aparte y no una fusion de las tres.
 */
:root {
  --fondo: #10151f;
  --fondo2: #1a2233;
  --acento: #4f9d58;
  --acento2: #e4b94f;
  --texto: #f4f7fb;
  --tenue: #97a3b8;
  --ok: #4ade80;
  --rojo: #f28b82;
  /* Mas claro que --rojo: avisa sin alarmar (el corte de una sesion no es un
   * fallo, es informacion). */
  --rojo-suave: #f0a3a3;
}

/* El anillo de foco. No lo declaraba ninguna de las tres hojas: sobre un fondo
 * tan oscuro (#10151f) el del navegador casi no se ve. Va en :focus-visible
 * para que salga con el teclado y no en cada toque de la tablet. */
:focus-visible {
  outline: 2px solid var(--acento2);
  outline-offset: 2px;
}