/* ============================================================
   NeuroProject / НейроПроект — Foundations
   Color tokens + typography tokens + semantic styles.
   All custom properties are prefixed --np-.
   ============================================================ */

/* Local brand fonts (Inter + JetBrains Mono). Files in fonts/. */
/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/Inter-400-cyrillic-ext.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/Inter-400-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/Inter-400-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/Inter-400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/Inter-500-cyrillic-ext.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/Inter-500-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/Inter-500-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/Inter-500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('fonts/Inter-600-cyrillic-ext.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('fonts/Inter-600-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('fonts/Inter-600-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('fonts/Inter-600-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('fonts/Inter-700-cyrillic-ext.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('fonts/Inter-700-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('fonts/Inter-700-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('fonts/Inter-700-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/JetBrainsMono-400-cyrillic-ext.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/JetBrainsMono-400-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/JetBrainsMono-400-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('fonts/JetBrainsMono-400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/JetBrainsMono-500-cyrillic-ext.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/JetBrainsMono-500-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/JetBrainsMono-500-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/JetBrainsMono-500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('fonts/JetBrainsMono-600-cyrillic-ext.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('fonts/JetBrainsMono-600-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('fonts/JetBrainsMono-600-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('fonts/JetBrainsMono-600-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  /* ---- Navy (primary brand) ---- */
  --np-navy-900: #111D3E;
  --np-navy-800: #172650;
  --np-navy-700: #1E3268;
  --np-navy-600: #263F80;
  --np-navy-500: #2D4B97;
  --np-navy:     #1B2D5B;  /* base */

  /* ---- Blue (accent — links, info, primary actions) ---- */
  --np-blue-700: #1A4FA0;
  --np-blue-600: #2160B8;
  --np-blue-500: #2B6FCB;
  --np-blue-400: #4A8AD8;
  --np-blue-300: #6FA4E5;
  --np-blue:     #2B6FCB;  /* base */

  /* ---- Cyan (connections, data viz, edges) ---- */
  --np-cyan-500: #2AADDB;
  --np-cyan-400: #4DC3E8;
  --np-cyan-300: #7BD5F0;
  --np-cyan-200: #A8E4F6;
  --np-cyan-100: #D4F2FB;
  --np-cyan:     #4DC3E8;  /* base */

  /* ---- Orange (focal point / AI accent / primary CTA) ---- */
  --np-orange-700: #C67A10;
  --np-orange-600: #D98B15;
  --np-orange-500: #EFA01E;
  --np-orange-400: #F4B44A;
  --np-orange-300: #F7C876;
  --np-orange-200: #FADCA3;
  --np-orange-100: #FEF0D5;
  --np-orange-bg:  #FEF0D5;
  --np-orange:     #EFA01E;  /* base */

  /* ---- Neutrals ---- */
  --np-gray-950: #0A0E1A;
  --np-gray-900: #141928;
  --np-gray-800: #262C3D;
  --np-gray-700: #3A4155;
  --np-gray-600: #515870;
  --np-gray-500: #6B738A;
  --np-gray-400: #8E95A9;
  --np-gray-300: #B4B9C8;
  --np-gray-200: #D5D8E1;
  --np-gray-100: #ECEEF3;
  --np-gray-50:  #F5F6F9;
  --np-white:    #FFFFFF;

  /* ---- Semantic ---- */
  --np-success:    #1A9D5C;
  --np-success-bg: #E8F7EF;
  --np-warning:    #E5980B;
  --np-warning-bg: #FEF5E0;
  --np-error:      #D63B3B;
  --np-error-bg:   #FCEAEA;
  --np-info:       #2B6FCB;
  --np-info-bg:    #E6F0FA;

  /* ---- Chart sequence (ordered for contrast between adjacent series) ---- */
  --np-chart-1: #2B6FCB;  /* blue */
  --np-chart-2: #EFA01E;  /* orange */
  --np-chart-3: #1A9D5C;  /* green */
  --np-chart-4: #4DC3E8;  /* cyan */
  --np-chart-5: #D63B3B;  /* red */
  --np-chart-6: #8B5CF6;  /* purple */
  --np-chart-7: #1B2D5B;  /* navy */
  --np-chart-8: #F4B44A;  /* amber */

  /* ---- Foreground / background aliases ---- */
  --np-fg-1: var(--np-gray-900);  /* body text */
  --np-fg-2: var(--np-gray-600);  /* secondary text */
  --np-fg-3: var(--np-gray-400);  /* tertiary / captions */
  --np-fg-inverse: var(--np-white);
  --np-bg-1: var(--np-gray-50);   /* app background */
  --np-bg-2: var(--np-white);     /* surface */
  --np-bg-3: var(--np-gray-100);  /* subtle surface */
  --np-border: var(--np-gray-100);
  --np-border-strong: var(--np-gray-200);

  /* ---- Typography ---- */
  --np-font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --np-font-display: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --np-font-mono: 'JetBrains Mono', 'Fira Code', 'SF Mono', monospace;

  /* Font sizes */
  --np-text-xs: 0.75rem;    /* 12px */
  --np-text-sm: 0.875rem;   /* 14px */
  --np-text-base: 1rem;     /* 16px */
  --np-text-lg: 1.125rem;   /* 18px */
  --np-text-xl: 1.25rem;    /* 20px */
  --np-text-2xl: 1.5rem;    /* 24px */
  --np-text-3xl: 1.875rem;  /* 30px */
  --np-text-4xl: 2.25rem;   /* 36px */
  --np-text-5xl: 3rem;      /* 48px */

  /* Font weights */
  --np-font-normal: 400;
  --np-font-medium: 500;
  --np-font-semibold: 600;
  --np-font-bold: 700;

  /* Line heights */
  --np-leading-tight: 1.2;
  --np-leading-normal: 1.5;
  --np-leading-relaxed: 1.65;

  /* ---- Spacing (4px scale) ---- */
  --np-space-1:  0.25rem;   /* 4px */
  --np-space-2:  0.5rem;    /* 8px */
  --np-space-3:  0.75rem;   /* 12px */
  --np-space-4:  1rem;      /* 16px */
  --np-space-5:  1.25rem;   /* 20px */
  --np-space-6:  1.5rem;    /* 24px */
  --np-space-8:  2rem;      /* 32px */
  --np-space-10: 2.5rem;    /* 40px */
  --np-space-12: 3rem;      /* 48px */
  --np-space-16: 4rem;      /* 64px */
  --np-space-20: 5rem;      /* 80px */
  --np-space-24: 6rem;      /* 96px */

  /* ---- Radii ---- */
  --np-radius-none: 0;
  --np-radius-sm:   6px;
  --np-radius-md:   10px;
  --np-radius-lg:   14px;
  --np-radius-xl:   20px;
  --np-radius-full: 9999px;

  /* ---- Shadows (soft, navy-tinted) ---- */
  --np-shadow-sm: 0 1px 3px rgba(17,29,62,0.08), 0 1px 2px rgba(17,29,62,0.04);
  --np-shadow-md: 0 4px 12px rgba(17,29,62,0.10), 0 2px 4px rgba(17,29,62,0.05);
  --np-shadow-lg: 0 12px 32px rgba(17,29,62,0.12), 0 4px 8px rgba(17,29,62,0.06);
  --np-shadow-xl: 0 20px 48px rgba(17,29,62,0.15), 0 8px 16px rgba(17,29,62,0.08);

  /* ---- Glow shadows (used for emphasis / AI moments) ---- */
  --np-shadow-glow-blue:   0 0 20px rgba(43,111,203,0.25);
  --np-shadow-glow-cyan:   0 0 20px rgba(77,195,232,0.25);
  --np-shadow-glow-orange: 0 0 20px rgba(239,160,30,0.30);

  /* ---- Motion ---- */
  --np-transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
  --np-transition-base: 250ms cubic-bezier(0.4, 0, 0.2, 1);
  --np-transition-slow: 400ms cubic-bezier(0.4, 0, 0.2, 1);

  /* ---- Z-index ---- */
  --np-z-dropdown: 100;
  --np-z-sticky:   200;
  --np-z-overlay:  300;
  --np-z-modal:    400;
  --np-z-toast:    500;
}

/* ============================================================
   Semantic element styles
   ============================================================ */

html { scroll-behavior: smooth; }

body {
  font-family: var(--np-font-body);
  font-size: var(--np-text-base);
  line-height: var(--np-leading-normal);
  color: var(--np-fg-1);
  background: var(--np-bg-1);
  -webkit-font-smoothing: antialiased;
}

h1, .np-h1 {
  font-family: var(--np-font-display);
  font-size: var(--np-text-4xl);
  font-weight: var(--np-font-bold);
  letter-spacing: -0.01em;
  line-height: var(--np-leading-tight);
  color: var(--np-navy);
}

h2, .np-h2 {
  font-family: var(--np-font-display);
  font-size: var(--np-text-3xl);
  font-weight: var(--np-font-bold);
  letter-spacing: -0.01em;
  line-height: var(--np-leading-tight);
  color: var(--np-navy);
}

h3, .np-h3 {
  font-size: var(--np-text-2xl);
  font-weight: var(--np-font-semibold);
  line-height: var(--np-leading-tight);
  color: var(--np-gray-800);
}

h4, .np-h4 {
  font-size: var(--np-text-xl);
  font-weight: var(--np-font-semibold);
  color: var(--np-gray-800);
}

.np-display {
  font-size: var(--np-text-5xl);
  font-weight: var(--np-font-bold);
  letter-spacing: -0.02em;
  line-height: 1.1;
  color: var(--np-navy);
}

p, .np-body {
  font-size: var(--np-text-base);
  line-height: var(--np-leading-normal);
  color: var(--np-fg-1);
}

.np-body-lg {
  font-size: var(--np-text-lg);
  line-height: var(--np-leading-relaxed);
}

.np-body-sm {
  font-size: var(--np-text-sm);
  line-height: var(--np-leading-normal);
}

.np-caption {
  font-size: var(--np-text-xs);
  font-weight: var(--np-font-medium);
  color: var(--np-gray-500);
}

.np-mono, code, pre {
  font-family: var(--np-font-mono);
  font-size: var(--np-text-sm);
}

.np-label-uppercase {
  font-size: var(--np-text-xs);
  font-weight: var(--np-font-semibold);
  color: var(--np-gray-500);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

a {
  color: var(--np-blue);
  text-decoration: none;
  transition: color var(--np-transition-fast);
}

a:hover { color: var(--np-blue-700); text-decoration: underline; }

::selection { background: var(--np-cyan-200); color: var(--np-navy-900); }