/* ============================================================
   TOOLS · PATTERNS
   Reusable background images, exposed as custom properties so
   components can apply them by `background-image: var(--pattern-*)`.
   Pure CSS — no preprocessor mixins available.
   ============================================================ */

:root {
  /* CRT scanlines — overlay at low opacity */
  --pattern-scanlines:
    repeating-linear-gradient(
      0deg,
      transparent 0,
      transparent 2px,
      rgba(0, 0, 0, 0.25) 3px,
      rgba(0, 0, 0, 0.25) 3px
    );

  /* Subtler scanlines for body text panels */
  --pattern-scanlines-soft:
    repeating-linear-gradient(
      0deg,
      transparent 0,
      transparent 3px,
      rgba(0, 0, 0, 0.12) 4px
    );

  /* Pixel grid — telemetry, annunciator backdrop */
  --pattern-grid:
    linear-gradient(var(--grid-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--grid-line) 1px, transparent 1px);

  --pattern-grid-major:
    linear-gradient(var(--grid-line-major) 1px, transparent 1px),
    linear-gradient(90deg, var(--grid-line-major) 1px, transparent 1px);

  /* Brushed metal — diagonal hairlines on bezel chrome */
  --pattern-brushed:
    repeating-linear-gradient(
      135deg,
      transparent 0,
      transparent 1px,
      rgba(255, 255, 255, 0.03) 1px,
      rgba(255, 255, 255, 0.03) 2px
    );

  /* Diagonal hazard stripes */
  --pattern-hazard:
    repeating-linear-gradient(
      45deg,
      var(--c-signal-amber) 0,
      var(--c-signal-amber) 12px,
      var(--c-black) 12px,
      var(--c-black) 24px
    );

  /* Vaporwave horizon — for hero / boot screen only */
  --pattern-horizon:
    linear-gradient(
      180deg,
      transparent 0%,
      transparent 60%,
      color-mix(in srgb, var(--c-signal-magenta) 30%, transparent) 60%,
      transparent 61%
    );

  /* The signature gradient — brand identity ONLY: the site wordmark and
     the hero highlight. A calm Birren sweep between luminous phosphor-cyan
     and rooted medium-blue, through teal. Runs right→left so the bright
     clarity end leads (left) and settles into grounded control (right). The
     saturated cyan clarity end holds contrast on both themes, so one gradient
     serves both. References the brand tokens directly so it stays put even as
     the signal palette retunes. */
  --gradient-vapor:
    linear-gradient(
      270deg,
      var(--c-brand-deep) 0%,
      var(--c-brand-mid) 50%,
      var(--c-brand-hi) 100%
    );

  /* Phosphor glow gradient — radial bloom on terminals */
  --gradient-phosphor:
    radial-gradient(
      ellipse at center,
      color-mix(in srgb, var(--c-phosphor-green) 15%, transparent) 0%,
      transparent 70%
    );

  /* CRT vignette — darken corners */
  --gradient-vignette:
    radial-gradient(
      ellipse at center,
      transparent 50%,
      rgba(0, 0, 0, 0.6) 100%
    );
}