/* ============================================================
   MeSite — Sinematik Tasarım Sistemi
   ------------------------------------------------------------
   Palet felsefesi: "karartılmış salon".
   Zemin, mavi-yeşile çalan sinema siyahı. Üstüne üç anlamlı durum:

     MAVİ   → Resmi Kanon. Algoritmanın seçtiği çizgi.
     TURUNCU→ Gönüllerin Şampiyonu. Kalabalığın seçtiği çizgi.
     ALTIN  → Mutlak Dal. İki çizginin kesiştiği yer; hem algoritma
              hem topluluk aynı dalda birleşmiş demektir.

   Altın bilerek üçüncü bir renk değil, ikisinin birleşimi:
   tile/edge şeritlerinde mavi → altın → turuncu geçişi kullanılıyor
   ki kesişme gözle de okunsun.

   Renk burada dekor değil, veri taşıyor.
   ============================================================ */

:root {
    /* --- Zemin katmanları (koyudan açığa) --- */
    --ink-950: #05060A;   /* sayfa dibi */
    --ink-900: #090B10;   /* ana zemin */
    --ink-850: #0E1118;   /* bölüm zemini */
    --ink-800: #141822;   /* kart */
    --ink-700: #1C212D;   /* kart hover / yükseltilmiş yüzey */
    --ink-600: #262C3A;   /* girinti, ayraç */

    /* --- Çizgiler ve cam --- */
    --line: rgba(255, 255, 255, 0.07);
    --line-strong: rgba(255, 255, 255, 0.14);
    --glass: rgba(14, 17, 24, 0.72);
    --glass-heavy: rgba(5, 6, 10, 0.88);

    /* --- Metin --- */
    --paper: #EEF1F7;         /* başlıklar */
    --paper-dim: #9AA3B5;     /* gövde */
    --paper-faint: #5B6478;   /* ipucu, meta */

    /* --- Yol renkleri (anlam taşır) --- */
    --canon: #63A4E0;             /* Resmi Kanon — algoritmanın çizgisi */
    --canon-deep: #2F6A9E;
    --canon-wash: rgba(99, 164, 224, 0.12);

    --champion: #E8873F;          /* Gönüllerin Şampiyonu — halkın çizgisi */
    --champion-deep: #B15C22;
    --champion-wash: rgba(232, 135, 63, 0.12);

    --absolute: #E3C77B;          /* Mutlak Dal — iki çizginin kesiştiği yer */
    --absolute-deep: #B2913F;
    --absolute-wash: rgba(227, 199, 123, 0.14);

    /* Kesişmenin görsel karşılığı: mavi → altın → turuncu */
    --absolute-blend: linear-gradient(90deg, var(--canon), var(--absolute), var(--champion));

    /* --- Marka ve durum --- */
    --gold: var(--absolute);      /* logo, birincil düğme, odak halkası */
    --gold-deep: var(--absolute-deep);
    --gold-wash: var(--absolute-wash);

    --danger: #D9503F;            /* hata, rapor, karantina uyarısı */
    --danger-deep: #A2372A;
    --danger-wash: rgba(217, 80, 63, 0.12);

    --spark: #F2B950;             /* Kıvılcım para birimi */
    --jade: #5BA88F;              /* onay / başarı */
    --rot: #7E3A3A;               /* çürümüş dal */

    /* --- Tipografi --- */
    --font-display: 'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-mono: 'JetBrains Mono', 'SF Mono', monospace;

    /* --- Ölçek --- */
    --space-xs: 0.25rem;
    --space-sm: 0.5rem;
    --space-md: 1rem;
    --space-lg: 1.5rem;
    --space-xl: 2rem;
    --space-2xl: 3rem;
    --space-3xl: 4rem;
    --space-4xl: 6rem;

    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 16px;
    --radius-xl: 24px;
    --radius-full: 9999px;

    /* --- Hareket --- */
    --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
    --transition-base: 250ms cubic-bezier(0.4, 0, 0.2, 1);
    --transition-slow: 400ms cubic-bezier(0.4, 0, 0.2, 1);
    --transition-spring: 500ms cubic-bezier(0.34, 1.56, 0.64, 1);

    /* --- Gölge / ışık --- */
    --shadow-card: 0 12px 32px rgba(0, 0, 0, 0.55);
    --shadow-lift: 0 20px 48px rgba(0, 0, 0, 0.7);
    --glow-canon: 0 0 24px rgba(99, 164, 224, 0.26);
    --glow-champion: 0 0 24px rgba(232, 135, 63, 0.26);
    --glow-absolute: 0 0 28px rgba(227, 199, 123, 0.30);
    --glow-gold: var(--glow-absolute);
}

/* Hareket hassasiyeti olan kullanıcılar için animasyonları kıs */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}