/* ───────────────────────────────────────────────────────────
   COLOR · "Tierra cálida. El oro como lo único precioso."
   Warm earth. Gold as the only precious thing.
   One color per surface. Always solid.
   ─────────────────────────────────────────────────────────── */
:root {
  /* ---- Brand palette (raw) ---- */
  --carbon:  #26252B; /* Tinta · fondo oscuro */
  --hueso:   #EDECE5; /* Luz · fondo claro */
  --oro:     #B39952; /* Acento principal */
  --arena:   #AE9568; /* Acento cálido */
  --tabaco:  #5E503A; /* Apoyo */
  --cacao:   #3B3021; /* Sombra cálida */
  --oliva:   #807055; /* Neutro cálido */
  --piedra:  #A9A7A5; /* Metadato / neutro frío */

  /* ---- Gold tonal range (derived, for hover/press/lines) ---- */
  --oro-100: #F0E8D2;
  --oro-200: #DCC98F;
  --oro-300: #C9AE6B;
  --oro-400: #B39952; /* = --oro */
  --oro-500: #9A8244;
  --oro-600: #7E6A36;

  /* ---- Carbon tonal range (surfaces on dark) ---- */
  --carbon-900: #1B1A1F;
  --carbon-800: #26252B; /* = --carbon */
  --carbon-700: #322F38;
  --carbon-600: #403C47;
  --carbon-500: #565160;

  /* ---- Bone tonal range (surfaces on light) ---- */
  --hueso-50:  #F6F5F0;
  --hueso-100: #EDECE5; /* = --hueso */
  --hueso-200: #E2E0D6;
  --hueso-300: #D2CFC1;

  /* ─── Semantic aliases · LIGHT surface (default) ─── */
  --bg:              var(--hueso-100);
  --bg-raised:       var(--hueso-50);
  --bg-sunken:       var(--hueso-200);
  --surface-card:    #FBFAF6;
  --surface-inverse: var(--carbon-800);

  --text-strong:   var(--carbon-800); /* headlines, primary ink */
  --text-body:     #3A3843;           /* paragraphs */
  --text-muted:    var(--oliva);      /* secondary / captions */
  --text-faint:    var(--piedra);     /* metadata, timestamps */
  --text-on-gold:  var(--carbon-800);
  --text-inverse:  var(--hueso-100);

  --accent:        var(--oro-400);
  --accent-hover:  var(--oro-500);
  --accent-press:  var(--oro-600);
  --accent-soft:   var(--oro-100);

  --border:        var(--hueso-300);
  --border-strong: var(--oliva);
  --hairline:      color-mix(in srgb, var(--carbon-800) 12%, transparent);

  --focus-ring:    color-mix(in srgb, var(--oro-400) 55%, transparent);

  /* Status — kept inside the warm world, never candy-bright */
  --positive: #6E7B45;
  --warning:  #B3823A;
  --danger:   #9A4B36;
  --info:     var(--oliva);
}

/* ─── Semantic aliases · DARK surface ─── */
.on-carbon,
[data-surface="carbon"] {
  --bg:              var(--carbon-800);
  --bg-raised:       var(--carbon-700);
  --bg-sunken:       var(--carbon-900);
  --surface-card:    var(--carbon-700);
  --surface-inverse: var(--hueso-100);

  --text-strong:   var(--hueso-100);
  --text-body:     #D8D6CE;
  --text-muted:    var(--piedra);
  --text-faint:    var(--oliva);
  --text-inverse:  var(--carbon-800);

  --border:        color-mix(in srgb, var(--hueso-100) 14%, transparent);
  --border-strong: var(--oliva);
  --hairline:      color-mix(in srgb, var(--hueso-100) 12%, transparent);

  color: var(--text-body);
  background: var(--bg);
}