/* ============================================================
   Boltzmann — design tokens (colors · type · spacing · effects)
   Ported verbatim from the Boltzmann Design System for use as a
   plain-CSS Zola theme. Light is default (:root); dark overrides
   live under [data-theme="dark"].
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@0,400;0,500;0,600;1,400&family=IBM+Plex+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&family=IBM+Plex+Serif:ital,wght@0,400;0,500;0,600;1,400&display=swap');

:root {
  /* --- Neutrals: warm gray, anchored on #363333 & #fafafa --- */
  --gray-0:   #ffffff;
  --gray-50:  #fafafa;
  --gray-100: #f3f1f1;
  --gray-200: #e7e5e4;
  --gray-300: #d6d3d2;
  --gray-400: #b6b2b1;
  --gray-500: #8f8b8a;
  --gray-600: #6b6766;
  --gray-700: #4e4a49;
  --gray-800: #363333;
  --gray-900: #262323;
  --gray-950: #1a1817;

  /* --- Brand blue: royalblue, the action & link color --- */
  --blue-100: #e6ecfc;
  --blue-200: #c4d1f6;
  --blue-300: #9db3f1;
  --blue-400: #6b8bea;
  --blue-500: #4169e1;   /* royalblue */
  --blue-600: #3355c9;
  --blue-700: #2841a1;
  --blue-800: #1f3079;

  /* --- Cyan/teal accent: the #0ce highlight & focus energy --- */
  --cyan-100: #d5f6fc;
  --cyan-200: #a3ecf8;
  --cyan-300: #5fdcf0;
  --cyan-400: #22cfe8;
  --cyan-500: #00bcd8;
  --cyan-600: #0098b0;
  --cyan-700: #017286;

  /* --- Entropy spectrum: header aurora, low->high energy --- */
  --spectrum-violet: #6b3a80;
  --spectrum-indigo: #445089;
  --spectrum-teal:   #2a8f8f;
  --spectrum-gold:   #a89a2e;
  --spectrum-amber:  #b9812f;
  --spectrum-rust:   #a8432f;

  /* --- Semantic hues --- */
  --green-100: #dcf2e6;
  --green-500: #1f8a5b;   /* signed / verified */
  --green-600: #16724a;
  --green-700: #0f5636;

  --amber-100: #f8eccf;
  --amber-500: #b9812f;   /* caution / unverified */
  --amber-600: #97671f;

  --red-100:  #f8dcd7;
  --red-500:  #c0392b;    /* threat / compromised */
  --red-600:  #9c2b20;
  --red-700:  #79201a;

  /* ============ SEMANTIC ALIASES (light) ============ */
  --text-body:    var(--gray-900);
  --text-strong:  var(--gray-950);
  --text-muted:   var(--gray-600);
  --text-subtle:  var(--gray-500);
  --text-inverse: var(--gray-50);
  --text-link:    var(--blue-500);
  --text-link-hover: var(--blue-600);
  --text-code:    var(--gray-800);

  --surface-page:    var(--gray-50);
  --surface-card:    var(--gray-0);
  --surface-sunken:  var(--gray-100);
  --surface-raised:  var(--gray-0);
  --surface-code:    var(--gray-900);
  --surface-inverse: var(--gray-900);
  --surface-hover:   var(--gray-100);
  --surface-selected: var(--blue-100);

  --border-subtle:  var(--gray-200);
  --border-default: var(--gray-300);
  --border-strong:  var(--gray-500);
  --border-inverse: var(--gray-700);

  --accent:        var(--blue-500);
  --accent-hover:  var(--blue-600);
  --accent-active: var(--blue-700);
  --accent-soft:   var(--blue-100);
  --highlight:     var(--cyan-400);
  --focus-ring:    var(--cyan-400);

  --success-fg: var(--green-600);  --success-bg: var(--green-100);  --success-solid: var(--green-500);
  --warning-fg: var(--amber-600);  --warning-bg: var(--amber-100);  --warning-solid: var(--amber-500);
  --danger-fg:  var(--red-600);    --danger-bg:  var(--red-100);    --danger-solid:  var(--red-500);
  --info-fg:    var(--blue-600);   --info-bg:    var(--blue-100);   --info-solid:    var(--blue-500);

  --grid-line: rgba(42, 143, 143, 0.14);

  /* --- Type --- */
  --font-sans:  "IBM Plex Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono:  "IBM Plex Mono", ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
  --font-serif: "IBM Plex Serif", ui-serif, Georgia, "Times New Roman", serif;

  --weight-light:    300;
  --weight-regular:  400;
  --weight-medium:   500;
  --weight-semibold: 600;
  --weight-bold:     700;

  --text-xs:   0.75rem;
  --text-sm:   0.875rem;
  --text-base: 1rem;
  --text-md:   1.125rem;
  --text-lg:   1.375rem;
  --text-xl:   1.75rem;
  --text-2xl:  2.25rem;
  --text-3xl:  3rem;
  --text-4xl:  4rem;

  --leading-none:    1;
  --leading-tight:   1.2;
  --leading-snug:    1.35;
  --leading-normal:  1.6;
  --leading-relaxed: 1.75;
  --leading-code:    1.666;

  --tracking-tight:  -0.02em;
  --tracking-normal: 0;
  --tracking-wide:   0.02em;
  --tracking-caps:   0.06em;

  /* --- Spacing & layout --- */
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.5rem;
  --space-6:  2rem;
  --space-7:  2.5rem;
  --space-8:  3rem;
  --space-9:  4rem;
  --space-10: 6rem;

  --rhythm: 1.6666rem;

  --measure-prose: 50rem;
  --measure-wide:  76rem;
  --sidebar-width: 16.666rem;

  --radius-none: 0;
  --radius-sm:   2px;
  --radius-md:   4px;
  --radius-lg:   6px;
  --radius-pill: 999px;

  --control-height-sm: 30px;
  --control-height-md: 38px;
  --control-height-lg: 46px;

  /* --- Effects --- */
  --border-width:        1px;
  --border-width-strong: 2px;
  --border-width-accent: 3px;

  --shadow-none: none;
  --shadow-sm:  0 1px 2px rgba(26, 24, 23, 0.06);
  --shadow-md:  0 2px 6px rgba(26, 24, 23, 0.08), 0 1px 2px rgba(26, 24, 23, 0.06);
  --shadow-lg:  0 8px 24px rgba(26, 24, 23, 0.12), 0 2px 6px rgba(26, 24, 23, 0.06);
  --shadow-focus: 0 0 0 3px var(--accent-soft);

  --blur-glass: blur(6px);

  --ease-out:     cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out:  cubic-bezier(0.4, 0, 0.2, 1);
  --duration-fast:   120ms;
  --duration-normal: 200ms;
  --duration-slow:   600ms;

  --ring: 0 0 0 2px var(--surface-page), 0 0 0 4px var(--focus-ring);
}

/* ============ DARK MODE ============ */
[data-theme="dark"] {
  --text-body:    var(--gray-200);
  --text-strong:  var(--gray-50);
  --text-muted:   var(--gray-400);
  --text-subtle:  var(--gray-500);
  --text-inverse: var(--gray-950);
  --text-link:    #8aa4f0;
  --text-link-hover: #a9beff;
  --text-code:    var(--gray-200);

  --surface-page:    var(--gray-950);
  --surface-card:    var(--gray-900);
  --surface-sunken:  #211e1e;
  --surface-raised:  var(--gray-800);
  --surface-code:    #100f0f;
  --surface-inverse: var(--gray-50);
  --surface-hover:   var(--gray-800);
  --surface-selected: rgba(65, 105, 225, 0.22);

  --border-subtle:  #302c2c;
  --border-default: var(--gray-800);
  --border-strong:  var(--gray-700);
  --border-inverse: var(--gray-300);

  --accent:        #5c7fea;
  --accent-hover:  #7592ef;
  --accent-active: #94abf4;
  --accent-soft:   rgba(65, 105, 225, 0.18);
  --highlight:     var(--cyan-400);
  --focus-ring:    var(--cyan-400);

  --success-fg: #4fbe8b;  --success-bg: rgba(31, 138, 91, 0.18);  --success-solid: var(--green-500);
  --warning-fg: #d7a54e;  --warning-bg: rgba(185, 129, 47, 0.20); --warning-solid: var(--amber-500);
  --danger-fg:  #e07a6d;  --danger-bg:  rgba(192, 57, 43, 0.20);  --danger-solid:  var(--red-500);
  --info-fg:    #8aa4f0;  --info-bg:    rgba(65, 105, 225, 0.18); --info-solid:    var(--blue-400);

  --grid-line: rgba(42, 143, 143, 0.16);

  --shadow-sm:  0 1px 2px rgba(0, 0, 0, 0.4);
  --shadow-md:  0 2px 6px rgba(0, 0, 0, 0.45), 0 1px 2px rgba(0, 0, 0, 0.4);
  --shadow-lg:  0 10px 30px rgba(0, 0, 0, 0.55), 0 2px 6px rgba(0, 0, 0, 0.4);
}