:root {
  --fs: 1;

  --selva:      #14211A;
  --hoja:       #21382B;
  --papel:      #F4EBDC;
  --tarjeta:    #FBF5EA;
  --cereza:     #B23A2B;
  --mandarina:  #E08A2B;
  --arena:      #E3D3B8;
  --tinta:      #14211A;
  --tinta-2:    #55655A;
  --linea:      #E3D3B8;

  /* materiales del grano (pieza interactiva) */
  --piel:       #B23A2B;
  --mucilago:   #E0A76B;
  --pergamino:  #DCC9A6;
  --pergamino-seco: #F0E4CC;
  --plata:      #CFC5B0;
  --grano:      #7D9B63;
  --tostado:    #6B3A22;
  --liquido:    #33200F;
  --crema:      #C99A5C;
  --hoja-verde: #4E7A45;

  --display: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --texto:   "Karla", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono:    "DM Mono", ui-monospace, SFMono-Regular, Consolas, monospace;

  --r: 16px;
  --r-lg: 18px;
  --max: 1180px;
  --sombra: 0 2px 0 rgba(20,33,26,.05), 0 18px 34px -24px rgba(20,33,26,.55);

  /* aliases para módulo guía */
  --verde: var(--selva);
  --gris: var(--tinta-2);
  --agua: var(--tinta-2);
  --border: 1px solid var(--linea);
  --paso: clamp(1rem, 3vw, 1.5rem);
}

html[data-theme="noche"] {
  --papel:   #14211A;
  --tarjeta: #1E3228;
  --tinta:   #F4EBDC;
  --tinta-2: #A8BCAE;
  --arena:   #35513F;
  --linea:   #2E4738;
  --cereza:  #E4705C;
  --mandarina: #F0A93F;
  --sombra: 0 2px 0 rgba(0,0,0,.25), 0 22px 40px -26px #000;
  --verde: var(--selva);
  --gris: var(--tinta-2);
}