/* CodeGO Industrial · tokens de diseño. Única fuente de color, tipografía, radios, sombras y movimiento.
   La identidad deriva de «Zolvek · Cobalt» (zolvek-mx/design-system/COLOR_AND_MOTION.md): grafito, blanco frío y cobalto.
   Los colores de estado operativo conservan su significado y no son colores de marca. Las escenas de planta no se reinterpretan como superficies de marca. */

@font-face { font-family: Manrope; src: url("assets/fonts/manrope-latin.woff2") format("woff2"); font-style: normal; font-weight: 400 800; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("assets/fonts/plex-mono-latin-400.woff2") format("woff2"); font-style: normal; font-weight: 400; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("assets/fonts/plex-mono-latin-500.woff2") format("woff2"); font-style: normal; font-weight: 500 700; font-display: swap; }

:root {
  /* Marca (mismos nombres y valores que zolvek-mx/stitch/site/atelier.css) */
  --z-bg: #f2f5fb; --z-surface: #ffffff; --z-raised: #e8eef8; --z-overlay: #e2eaf7;
  --z-line: #d7e0ee; --z-line-strong: #9babc4; --z-ink: #142036; --z-muted: #48566b; --z-dim: #526079;
  --z-accent: #2347d9; --z-accent-hover: #1735ad; --z-accent-dim: #e7edff; --z-focus: #2856ec;
  --z-on-dark: #f5f8ff; --z-muted-dark: #b9c8e2;
  --z-panel: #101b30; --z-panel-raised: #1c2e4e; --z-panel-line: #425b82;

  /* Rampa neutra fría (la luminosidad crece hacia 0). Los bordes de campo usan --n-500 (#7b8ca7, regla de marca). */
  --n-0: #ffffff; --n-25: #f8faff; --n-50: #f2f5fb; --n-100: #e8eef8; --n-150: #e2eaf7;
  --n-200: #d7e0ee; --n-300: #c2cee2; --n-400: #9babc4; --n-500: #7b8ca7; --n-600: #5d6e8a;
  --n-700: #48566b; --n-800: #2c3b52; --n-850: #1c2e4e; --n-900: #142036; --n-950: #101b30;

  /* Acción, selección y foco (cobalto) */
  --accent-50: #e7edff; --accent-100: #d6e0ff; --accent-200: #b3c3ee; --accent-400: #5f7de8;
  --accent-500: #2347d9; --accent-600: #1735ad; --accent-700: #0f2680; --accent-on-dark: #8fa8ff;
  --focus: #2856ec;

  /* Estados operativos: señal activa, memoria/aviso y fallo. Siempre acompañados de icono, forma o texto. */
  --ok: #00a86b; --ok-bg: #d6f8e8; --ok-ink: #005a38; --ok-line: #7fd3b0;
  --warn: #d58b18; --warn-bg: #fff2cf; --warn-ink: #704000; --warn-line: #e6c06b;
  --fault: #d4382c; --fault-bg: #fde8e6; --fault-ink: #8c1d16; --fault-line: #efaba4;
  --fluid: #1f9bd1;

  /* Tipografía: Manrope es la voz de la marca; la monoespaciada se reserva para direcciones, telemetría y código. */
  --font-ui: Manrope, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --fs-2xs: 10px; --fs-xs: 11px; --fs-sm: 12px; --fs-md: 13px; --fs-lg: 14px; --fs-xl: 16px; --fs-2xl: 18px; --fs-3xl: 20px; --fs-4xl: 24px; --fs-5xl: 28px;
  --lh-tight: 1.25; --lh-base: 1.45; --lh-prose: 1.6;

  /* Radios, espacio y elevación */
  --r-xs: 3px; --r-sm: 6px; --r-md: 10px; --r-pill: 999px;
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 20px; --sp-6: 24px; --sp-8: 32px; --sp-10: 40px;
  --shadow-ink: 16 27 48;
  --sh-1: 0 1px 2px rgb(var(--shadow-ink) / .08);
  --sh-2: 0 2px 8px rgb(var(--shadow-ink) / .10), 0 1px 2px rgb(var(--shadow-ink) / .06);
  --sh-3: 0 14px 36px rgb(var(--shadow-ink) / .18), 0 2px 6px rgb(var(--shadow-ink) / .08);

  /* Movimiento: respuesta inmediata, curvas con salida fuerte y nunca más de 300 ms en la interfaz. */
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
  --ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);
  --dur-1: 100ms; --dur-2: 150ms; --dur-3: 220ms; --dur-4: 300ms;

  /* Alias de compatibilidad: las hojas antiguas definían estos nombres con valores distintos (--green llegó a ser azul).
     Ahora hay una sola definición; no añadir variables nuevas con estos nombres. */
  --ink: var(--n-900); --muted: var(--n-700); --line: var(--n-200); --wash: var(--n-50); --paper: var(--n-0); --navy: var(--n-950);
  --green: var(--accent-500); --green-soft: var(--accent-50); --accent: var(--accent-500); --orange: var(--warn); --signal: var(--warn);
  --steel: var(--n-600); --steel-deep: var(--n-850); --steel-line: var(--n-300); --canvas: var(--n-25); --frame: var(--n-600); --dark: var(--n-850); --water: var(--fluid);
  --sans: var(--font-ui); --mono: var(--font-mono); --control-radius: var(--r-sm); --ui-fast: var(--dur-2); --text-subtle: var(--n-600);
  --pg-ink: var(--n-900); --pg-active: var(--accent-500); --pg-line: var(--n-200);
}

html { font-family: var(--font-ui); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; font-variant-numeric: tabular-nums; }
body, button, input, select, textarea { font-family: var(--font-ui); }
code, kbd, samp, pre { font-family: var(--font-mono); }