/* ═══════════════════════════════════════
   tokens.css — Design tokens (The Darkroom)
   Sumber kanonik sistem visual. Lihat DESIGN.md.
   Salinan kembar: extension/shared/tokens.css — jaga tetap sinkron.
   Dimuat PERTAMA oleh setiap halaman, sebelum CSS lain.
   ═══════════════════════════════════════ */

:root {
  /* ── Surfaces (tonal ramp, gelap → terang) ── */
  --g-bg: #0b0d13;
  --g-surface: #12151d;
  --g-raised: #1a1f2b;

  /* ── Borders ── */
  --g-border: rgba(148, 163, 184, 0.11);
  --g-border-strong: rgba(148, 163, 184, 0.22);

  /* ── Text ── */
  --g-text: #e8ecf4;
  --g-muted: #97a1b5;
  --g-dim: #626d82;

  /* ── Accent — Signal Blue (satu-satunya aksen interaktif) ── */
  --g-accent: #60a5fa;
  --g-accent-bright: #93c5fd;
  --g-accent-soft: rgba(96, 165, 250, 0.14);

  /* ── Action buttons (gradient resmi: action → indigo) ── */
  --g-action: #3b82f6;
  --g-action-deep: #2563eb;
  --g-action-indigo: #6366f1;
  --g-gradient-action: linear-gradient(135deg, var(--g-action), var(--g-action-indigo));

  /* ── Status: success ── */
  --g-success-bright: #34d399;
  --g-success: #10b981;
  --g-success-deep: #059669;
  --g-success-text: #86efac;

  /* ── Status: warning ── */
  --g-warning-bright: #fcd34d;
  --g-warning: #fbbf24;
  --g-warning-deep: #f59e0b;

  /* ── Status: danger ── */
  --g-danger-bright: #fca5a5;
  --g-danger: #f87171;
  --g-danger-strong: #ef4444;
  --g-danger-deep: #dc2626;

  /* ── Data accents (bukan untuk chrome interaktif) ── */
  --g-purple: #a78bfa;
  --g-purple-deep: #8b5cf6;
  --g-teal: #2dd4bf;

  /* ── Radius ── */
  --g-radius-sm: 6px;
  --g-radius-md: 9px;
  --g-radius-lg: 12px;

  /* ── Elevation & motion ── */
  --g-shadow: 0 12px 32px rgba(0, 0, 0, 0.45);
  --g-glow-action: 0 4px 16px rgba(99, 102, 241, 0.3);
  --g-transition: 0.15s ease;
}