/* Afterglow — tokens de diseño. Papel (claro) y tinta (oscuro); un único acento: rojo tinta.
   Los valores son tripletas RGB para poder usar opacidad: rgb(var(--edge) / 0.5). */
:root,
:root[data-theme="light"] {
  color-scheme: light;
  --ink: 246 241 231;      /* fondo: papel */
  --panel: 251 248 241;
  --panel2: 239 233 220;
  --panel3: 232 225 210;
  --edge: 221 213 196;     /* líneas */
  --fg: 27 24 21;          /* texto principal (en Tailwind: "white") */
  --s100: 38 34 30;
  --s200: 53 48 43;
  --s300: 74 69 62;
  --s400: 95 89 80;
  --s500: 112 105 96;
  --s600: 141 134 122;
  --gold: 176 112 14;
  --accent-rgb: 184 50 31;   /* rojo tinta */
  --accent2-rgb: 150 38 22;
  --on-accent: 255 255 255;
  --scrim: 20 17 14;         /* velos sobre imágenes (siempre oscuros) */
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --ink: 20 18 16;
  --panel: 27 25 22;
  --panel2: 35 32 28;
  --panel3: 43 39 34;
  --edge: 56 51 45;
  --fg: 244 239 230;
  --s100: 235 230 220;
  --s200: 213 207 195;
  --s300: 185 178 165;
  --s400: 154 147 134;
  --s500: 134 127 115;
  --s600: 98 92 83;
  --gold: 245 196 81;
  --accent-rgb: 232 96 72;
  --accent2-rgb: 244 128 104;
  --on-accent: 24 14 10;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --ink: 20 18 16;
    --panel: 27 25 22;
    --panel2: 35 32 28;
    --panel3: 43 39 34;
    --edge: 56 51 45;
    --fg: 244 239 230;
    --s100: 235 230 220;
    --s200: 213 207 195;
    --s300: 185 178 165;
    --s400: 154 147 134;
    --s500: 134 127 115;
    --s600: 98 92 83;
    --gold: 245 196 81;
    --accent-rgb: 232 96 72;
    --accent2-rgb: 244 128 104;
    --on-accent: 24 14 10;
  }
}