/* =====================================================================
   DCBOT — DESIGN TOKENS (tek kaynak)
   Renk, yazı tipi, boşluk, köşe, süre ve easing değerleri sadece burada tanımlanır.
   Eski style.css değişkenleri (--bg, --blurple vb.) aşağıda bu token'lara bağlanır; böylece
   panelin tamamı tek yerden yeni temaya geçer. Sadece karanlık tema.
   ===================================================================== */
:root {
  color-scheme: dark;

  /* Renk */
  --c-black-premium: #0B0B0C; /* premium siyah */
  --c-brown: #8B5E34;         /* sıcak kahverengi (altınla uyumlu) */
  --c-bg: #0B0B0C;
  --c-surface: #0B0B0C;
  --c-card: #111111;
  --c-card-hover: #161616;
  --c-line: rgba(255,255,255,0.08);
  --c-line-strong: rgba(255,255,255,0.14);
  --c-line-hover: rgba(250,204,21,0.35);
  --c-accent: #FACC15;
  --c-accent-2: #8B5E34;   /* ikinci vurgu: kahverengi */
  --c-accent-2-dark: #B98550; /* kahverengi açık ton (hover) */
  --c-accent-dark: #A87F05;
  --c-accent-fill: #EAB308;
  --c-accent-soft: rgba(250,204,21,0.10);
  --c-text: #FAFAFA;
  --c-body: #A1A1AA;
  --c-faint: #52525B;        /* sadece süs/devre dışı için */
  --c-muted: #8A8A94;        /* okunması gereken soluk metin (AA kontrast) */
  --c-danger: #F0525C;
  --c-warn: #F5A623;

  /* Yazı tipi */
  --f-head: 'Inter', 'Geist', system-ui, sans-serif;
  --f-body: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --f-mono: 'JetBrains Mono', ui-monospace, 'Fira Code', monospace;
  --fs-h1: clamp(2.5rem, 6vw, 5rem);
  --fs-h2: clamp(1.75rem, 3.6vw, 2.75rem);
  --fs-lead: clamp(1.02rem, 1.5vw, 1.2rem);
  --track-head: -0.03em;

  /* Köşe */
  --r-card: 12px;
  --r-btn: 8px;
  --r-pill: 6px;

  /* Boşluk (4px tabanlı) */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 24px; --s-6: 32px; --s-7: 48px; --s-8: 72px; --s-9: 112px;

  /* Hareket */
  --t-fast: 150ms;
  --t-base: 220ms;
  --t-slow: 600ms;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);

  /* Yerleşim */
  --max-w: 1280px;
  --nav-w: 248px;
  --nav-w-collapsed: 72px;
  --tap: 44px;

  /* ---- Eski değişkenleri yeni token'lara bağla ---- */
  --bg: var(--c-bg);
  --bg-elevated: var(--c-surface);
  --bg-card: var(--c-card);
  --bg-card-hover: var(--c-card-hover);
  --border: var(--c-line);
  --border-strong: var(--c-line-strong);
  --text: var(--c-text);
  --text-muted: var(--c-body);
  --text-faint: var(--c-muted);
  --blurple: var(--c-accent);
  --blurple-hover: #EAB308;
  --blurple-soft: var(--c-accent-soft);
  --blurple-border: var(--c-line-hover);
  --teal: var(--c-accent);
  --green: var(--c-accent);
  --red: var(--c-danger);
  --amber: var(--c-warn);
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: var(--r-card);
  --mono: var(--f-mono);
  --shadow-sm: 0 1px 2px rgba(0,0,0,.5);
  --shadow-md: 0 8px 24px rgba(0,0,0,.5);
  --shadow-lg: 0 20px 50px rgba(0,0,0,.6);
  --glow-sm: 0 0 10px rgba(250,204,21,.45);
  --glow-md: 0 0 28px rgba(250,204,21,.28);
}

@property --angle { syntax: '<angle>'; initial-value: 0deg; inherits: false; }