/* MiCerebro — tokens visuales canónicos.
 * Esta capa no crea una nueva generación visual: normaliza las variables heredadas
 * para que shell, navegación, formularios y chat compartan contraste y foco.
 */
:root {
  --mc-bg-canvas: #02040b;
  --mc-bg-page: #050914;
  --mc-bg-elevated: #091122;
  --mc-bg-elevated-strong: #0a1225;
  --mc-bg-soft: #0f1930;

  --mc-text: #f4f8ff;
  --mc-text-soft: #d9e5f6;
  --mc-text-muted: #9cacc7;
  --mc-text-subtle: #8c9bb6;
  --mc-text-inverse: #071221;

  --mc-line: rgba(127, 156, 214, .20);
  --mc-line-strong: rgba(79, 173, 255, .42);
  --mc-cyan: #42d9ff;
  --mc-blue: #268cff;
  --mc-blue-strong: #1769ff;
  --mc-violet: #7c5cff;
  --mc-purple: #b35cff;
  --mc-green: #46d7a1;
  --mc-danger: #ff7f8b;
  --mc-link: #72d8ff;

  --mc-focus-ring: 0 0 0 3px rgba(66, 217, 255, .34);
  --mc-radius-xs: 10px;
  --mc-radius-sm: 14px;
  --mc-radius-md: 18px;
  --mc-radius-lg: 26px;
  --mc-shadow: 0 26px 72px rgba(0, 0, 0, .36);
}

/* Compatibilidad temporal con las capas anteriores.
 * Los componentes nuevos deben consumir --mc-* directamente.
 */
body.nv5 {
  --nv-bg-0: var(--mc-bg-canvas);
  --nv-bg-1: var(--mc-bg-page);
  --nv-bg-2: #081020;
  --nv-panel: rgba(8, 15, 31, .82);
  --nv-panel-strong: rgba(10, 18, 37, .96);
  --nv-panel-soft: rgba(15, 25, 48, .68);
  --nv-line: var(--mc-line);
  --nv-line-strong: var(--mc-line-strong);
  --nv-text: var(--mc-text);
  --nv-text-2: var(--mc-text-soft);
  --nv-muted: var(--mc-text-subtle);
  --nv-cyan: var(--mc-cyan);
  --nv-blue: var(--mc-blue);
  --nv-blue-2: var(--mc-blue-strong);
  --nv-violet: var(--mc-violet);
  --nv-purple: var(--mc-purple);
  --nv-green: var(--mc-green);
  --nv-danger: var(--mc-danger);
  --nv-radius-xs: var(--mc-radius-xs);
  --nv-radius-sm: var(--mc-radius-sm);
  --nv-radius: var(--mc-radius-md);
  --nv-radius-lg: var(--mc-radius-lg);
  --nv-shadow: var(--mc-shadow);

  --nv-readable: var(--mc-text);
  --nv-readable-soft: var(--mc-text-soft);
  --nv-readable-muted: var(--mc-text-muted);
  --nv-focus: var(--mc-cyan);

  --ink: var(--mc-text);
  --muted: var(--mc-text-muted);
  --blue: var(--mc-blue);
  --blue-soft: rgba(38, 140, 255, .13);
  --surface: var(--mc-bg-page);
  --card: rgba(9, 17, 34, .88);
  --line: var(--mc-line);
  --danger: var(--mc-danger);
  --ok: var(--mc-green);
  --radius: var(--mc-radius-md);
}

body.nv5 a { color: var(--mc-link); }
body.nv5 :is(button, input, textarea, select, a):focus-visible {
  outline-color: var(--mc-cyan);
}