/* Token design system "Mustofa" (tokens.json v5). Satu tema: gelap. */
:root {
  color-scheme: dark;

  /* warna */
  --bg-primary: #0B0B0F;
  --violet-500: #8B5CF6;
  --blue-500: #3B82F6;
  --text-primary: #F5F5F7;
  --text-secondary: rgba(245, 245, 247, 0.7);
  --glow-violet: rgba(139, 92, 246, 0.35);
  --glow-blue: rgba(59, 130, 246, 0.15);
  --glass-edge: rgba(245, 245, 247, 0.85);
  --beam: rgba(245, 245, 247, 0.9);
  --dot: rgba(139, 92, 246, 0.8);
  --dot-bright: rgba(245, 245, 247, 0.7);
  --glass-fill: rgba(245, 245, 247, 0.04);
  --glass-fill-strong: rgba(245, 245, 247, 0.09);
  --glass-tint: rgba(139, 92, 246, 0.12);
  --glass-border: rgba(245, 245, 247, 0.14);
  --glass-sheen: rgba(245, 245, 247, 0.12);
  --glass-highlight: rgba(245, 245, 247, 0.5);

  /* gradient */
  --gradient-main: linear-gradient(90deg, #8B5CF6, #3B82F6);
  --gradient-glow: radial-gradient(circle, rgba(139,92,246,0.35) 0%, rgba(59,130,246,0.15) 45%, transparent 70%);

  /* tipografi */
  --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* spasi */
  --space-12: 12px;
  --space-20: 20px;
  --space-36: 36px;
  --content-max: 1120px;

  /* efek */
  --glow-size: 700px;
  --glow-size-mobile: 400px;
  --glow-blur: 60px;
  --dot-pitch: 14px;
  --beam-blur: 80px;
  --glass-blur: 20px;

  /* radius */
  --radius-card: 28px;
  --radius-pill: 999px;
  --radius-icon: 13px;

  /* bayangan */
  --shadow-glass: inset 0 1px 0 rgba(245,245,247,0.25), inset 0 0 32px rgba(139,92,246,0.12), 0 30px 60px -24px rgba(0,0,0,0.7);
}