/* ==========================================================================
   Google Stitch Design Tokens — Auto-generated via stitch_sync.py
   Project: eFootball™ Forensic Lab (v4.0.0)
   ========================================================================== */

:root {
  /* Stitch System Color Tokens */
  --stitch-sys-color-primary: #00f2fe;
  --stitch-sys-color-primary-glow: rgba(0, 242, 254, 0.35);
  --stitch-sys-color-secondary: #38bdf8;
  --stitch-sys-color-tertiary: #a855f7;
  --stitch-sys-color-success: #10b981;
  --stitch-sys-color-warning: #f59e0b;

  /* Surfaces & Elevation */
  --stitch-sys-surface-ground: #070a12;
  --stitch-sys-surface-base: #0d1220;
  --stitch-sys-surface-glass: rgba(13, 18, 32, 0.85);
  --stitch-sys-border: rgba(255, 255, 255, 0.08);
  --stitch-sys-border-glow: rgba(0, 242, 254, 0.25);

  /* Legacy Variable Aliases (Zero Breaking Changes) */
  --accent-cyan: var(--stitch-sys-color-primary);
  --accent-blue: var(--stitch-sys-color-secondary);
  --accent-purple: var(--stitch-sys-color-tertiary);
  --accent-emerald: var(--stitch-sys-color-success);
  --accent-amber: var(--stitch-sys-color-warning);
  --bg-dark: var(--stitch-sys-surface-ground);
  --bg-card: var(--stitch-sys-surface-base);
  --border-color: var(--stitch-sys-border);

  /* Typography Scale */
  --font-sans: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
  --font-mono: 'JetBrains Mono', monospace;
  --stitch-sys-typescale-display: 800 2.25rem/1.2 var(--font-sans);
  --stitch-sys-typescale-headline: 700 1.5rem/1.3 var(--font-sans);
  --stitch-sys-typescale-title: 600 1.1rem/1.4 var(--font-sans);
  --stitch-sys-typescale-body: 400 0.92rem/1.55 var(--font-sans);
  --stitch-sys-typescale-caption: 600 0.75rem/1.3 var(--font-mono);

  /* Spacing Scale */
  --stitch-spacing-xs: 8px;
  --stitch-spacing-sm: 12px;
  --stitch-spacing-md: 16px;
  --stitch-spacing-lg: 24px;
  --stitch-spacing-xl: 32px;
}

/* Stitch Glassmorphism & Elevation Utilities */
.stitch-surface-glass {
  background: var(--stitch-sys-surface-glass);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid var(--stitch-sys-border);
}

.stitch-glow-primary {
  box-shadow: 0 0 20px var(--stitch-sys-color-primary-glow);
}

.stitch-card-interactive {
  transition: transform 0.22s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.22s ease, border-color 0.22s ease;
}
.stitch-card-interactive:hover {
  transform: translateY(-3px);
  border-color: var(--stitch-sys-border-glow);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.6), 0 0 16px var(--stitch-sys-color-primary-glow);
}