/* ============================================================
   BLACK RIVER DESIGN SYSTEM — Tokens
   Svartåbladet ("Black River Times")
   ============================================================ */

:root {
  /* ── Colors: Dark Neutrals (R=G=B) ── */
  --color-bg:              #0A0A0A;
  --color-surface:         #141414;
  --color-surface-raised:  #1E1E1E;
  --color-border:          #2A2A2A;
  --color-border-subtle:   #1E1E1E;
  --color-text:            #E8E8E8;
  --color-text-secondary:  #A0A0A0;
  --color-text-muted:      #6E6E6E;

  /* ── Accent: River Blue (from Svartåbladet logo SVGs) ── */
  --color-river:           #258BBC;
  --color-river-bright:    #3AA3D4;
  --color-river-dim:       #1A6A94;

  /* ── Signal Colors ── */
  --color-breaking:        #D42020;
  --color-breaking-bg:     #2A0808;
  --color-opinion:         #C47A1A;
  --color-sport:           #1A8A4A;

  /* ── Spacing: 8px Grid ── */
  --space-1:   0.25rem;  /*  4px */
  --space-2:   0.5rem;   /*  8px */
  --space-3:   0.75rem;  /* 12px */
  --space-4:   1rem;     /* 16px */
  --space-5:   1.5rem;   /* 24px */
  --space-6:   2rem;     /* 32px */
  --space-7:   2.5rem;   /* 40px */
  --space-8:   3rem;     /* 48px */
  --space-9:   4rem;     /* 64px */
  --space-10:  5rem;     /* 80px */

  /* ── Typography: Font Families ── */
  --font-headline: "Barlow Condensed", "Arial Narrow", sans-serif;
  --font-body:     "Space Grotesk", "Helvetica Neue", sans-serif;
  --font-mono:     "JetBrains Mono", "Fira Code", monospace;

  /* ── Typography: Weights ── */
  --weight-regular:   400;
  --weight-medium:    500;
  --weight-semibold:  600;
  --weight-bold:      700;
  --weight-extrabold: 800;

  /* ── Rules: Signature thick river-blue borders ── */
  --rule-thin:   2px solid var(--color-river);
  --rule-medium: 4px solid var(--color-river);
  --rule-thick:  6px solid var(--color-river);

  /* ── Grid Dimensions ── */
  --grid-max-width:    1280px;
  --grid-gutter:       var(--space-4);
  --grid-story-main:   7fr;
  --grid-story-side:   5fr;
  --sidebar-width:     320px;

  /* ── Motion ── */
  --ease-out:    cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --duration-fast:   120ms;
  --duration-normal: 200ms;
  --duration-slow:   400ms;

  /* ── Z-index Scale ── */
  --z-header:   100;
  --z-breaking: 200;
  --z-overlay:  300;

  /* ── Breakpoints (reference — used in media queries) ──
     --bp-sm:  400px
     --bp-md:  600px
     --bp-lg:  900px
     --bp-xl: 1280px
  */
}