/* ============================================================
   CZYTELNECV — wspólne tokeny (kolory, typografia, cienie)
   Styl: precyzyjne narzędzie. Biel, neutralne szarości, cienkie linie
   i jeden mocny kolor (kobalt). Zmieniasz kolor tutaj → zmienia się wszędzie.
   ============================================================ */

:root {
  --paper: #FFFFFF;          /* tło strony */
  --paper-raised: #FFFFFF;   /* karty, panele */
  --paper-deep: #F5F6F8;     /* delikatne tło sekcji, pól, pasków */
  --ink: #0E1116;
  --ink-soft: #4B5263;
  --ink-faint: #858B98;
  --line: #E4E6EB;
  --line-strong: #CBD0D8;
  --accent: #2346D8;
  --accent-hover: #1B38B4;
  --accent-ink: #FFFFFF;
  --accent-soft: #EDF1FE;
  --gold: #A15C07;           /* uwaga / ostrzeżenie (bursztyn) */
  --gold-soft: #FFF5E3;
  --danger: #B42318;
  --danger-soft: #FEF0EE;
  --ok: #17784A;
  --ok-soft: #E9F7EF;
  --grid: rgba(35, 70, 216, .06);

  /* Pasek narzędzi — jasny, jak reszta aplikacji */
  --bar: #FFFFFF;
  --bar-raised: #F5F6F8;
  --bar-ink: #0E1116;
  --bar-muted: #5B6272;
  --bar-accent: #2346D8;
  --bar-line: #E4E6EB;

  /* Powiadomienia i nakładki — ciemne w obu motywach */
  --toast: #0E1116;
  --toast-ink: #F3F4F6;

  --radius: 6px;
  --radius-lg: 12px;
  --shadow-sm: 0 1px 2px rgba(14, 17, 22, .06);
  --shadow-md: 0 1px 2px rgba(14, 17, 22, .05), 0 8px 24px rgba(14, 17, 22, .08);
  --shadow-lg: 0 2px 4px rgba(14, 17, 22, .04), 0 24px 64px rgba(14, 17, 22, .14);
  --max: 1160px;
  --serif: 'Inter', -apple-system, 'Segoe UI', sans-serif;  /* nagłówki interfejsu (historyczna nazwa) */
  --sans: 'Inter', -apple-system, 'Segoe UI', sans-serif;
  --mono: 'IBM Plex Mono', ui-monospace, monospace;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --paper: #0C0E12; --paper-raised: #14171D; --paper-deep: #101318;
    --ink: #EEF0F4; --ink-soft: #A5ABB8; --ink-faint: #737A88;
    --line: #232730; --line-strong: #343944;
    --accent: #7B93FF; --accent-hover: #93A6FF; --accent-ink: #0C0E12; --accent-soft: #1A2140;
    --gold: #E3A54A; --gold-soft: #2E2310;
    --danger: #F08A7C; --danger-soft: #3A1C18;
    --ok: #6FCB9A; --ok-soft: #13291D;
    --grid: rgba(123, 147, 255, .06);
    --bar: #14171D; --bar-raised: #1B1F27; --bar-ink: #EEF0F4; --bar-muted: #A5ABB8; --bar-accent: #7B93FF; --bar-line: #232730;
    --toast: #EEF0F4; --toast-ink: #0C0E12;
    --shadow-md: 0 1px 2px rgba(0, 0, 0, .3), 0 8px 24px rgba(0, 0, 0, .35);
    --shadow-lg: 0 24px 64px rgba(0, 0, 0, .5);
  }
}
:root[data-theme="dark"] {
  --paper: #0C0E12; --paper-raised: #14171D; --paper-deep: #101318;
  --ink: #EEF0F4; --ink-soft: #A5ABB8; --ink-faint: #737A88;
  --line: #232730; --line-strong: #343944;
  --accent: #7B93FF; --accent-hover: #93A6FF; --accent-ink: #0C0E12; --accent-soft: #1A2140;
  --gold: #E3A54A; --gold-soft: #2E2310;
  --danger: #F08A7C; --danger-soft: #3A1C18;
  --ok: #6FCB9A; --ok-soft: #13291D;
  --grid: rgba(123, 147, 255, .06);
  --bar: #14171D; --bar-raised: #1B1F27; --bar-ink: #EEF0F4; --bar-muted: #A5ABB8; --bar-accent: #7B93FF; --bar-line: #232730;
  --toast: #EEF0F4; --toast-ink: #0C0E12;
  --shadow-md: 0 1px 2px rgba(0, 0, 0, .3), 0 8px 24px rgba(0, 0, 0, .35);
  --shadow-lg: 0 24px 64px rgba(0, 0, 0, .5);
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
}
