/* ═══════════════════════════════════════════════════════════
   PIGMENTOS
   ───────────────────────────────────────────────────────────
   La paleta no decora: informa. Cada cadena tiene su tierra —
   trigo en ocre, ganado en almagre, madera en umbra — y lo que
   baja del barco va en añil, porque el índigo también venía de
   ultramar.

   SUSTRATO. El marco es umbra y no cambia nunca. La página es
   tiza: cal de pared encalada, no papel crema.
   ═══════════════════════════════════════════════════════════ */
:root{
  --umbra:#241D17; --umbra2:#33291F; --umbra3:#443628; --umbra4:#5A4938; --umbra5:#77624B;
  --tiza:#E5E1D2; --tiza2:#DBD6C4; --tiza3:#CAC3AC; --tiza4:#B2A98F; --tiza5:#948B72;
  --tinta:#1E1913; --tinta2:#3D3428;
  --ocre:#C08A2E; --ocre-o:#8E6317; --ocre-c:#DCAE55;
  --almagre:#9E3B2C; --almagre-c:#C4685A;
  --verde:#4F7355; --verde-c:#84A187;
  --anil:#33475E; --anil-c:#6E88A3;
  --madera:#6E5638;

  --disp:'Cormorant Unicase',Georgia,serif;
  --serif:'Alegreya',Georgia,serif;
  --sans:'Alegreya Sans',system-ui,-apple-system,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,monospace;
  --lin:1px solid var(--tiza3);

  /* ── MEDIDAS DEL MARCO ──
     La banda de arriba dice lo que no puede faltar nunca. Todo
     lo demás bajó al rail de la izquierda, que es donde hay
     espacio de sobra: la pantalla es más ancha que alta. */
  --banda:56px;
  --rail:216px;

  /* ── EL RADIO ES UNA AFFORDANCE, NO UN ADORNO ──
     Regla dura: si tiene las esquinas redondeadas, se toca.
     Fichas, paneles, chips y barras van a escuadra; botones,
     pestañas y controles son lo único redondeado de la
     pantalla. Así no hace falta leer para saber qué es un
     botón. */
  --rad:5px;
}

/* pigmentos por cadena */
.c-trigo{--pig:var(--ocre)}
.c-ganado{--pig:var(--almagre)}
.c-madera{--pig:var(--madera)}
.c-mar{--pig:var(--anil)}