/* ============================================================
   KitKat — merkez token dosyası
   Yeni projeye başlarken BU DOSYAYI kopyala, paketi değiştir.
   Kaynak: Apple HIG (iOS 26 / Liquid Glass), WWDC25, doğrulanmış
   topluluk ölçümleri. pt→px eşlemesi 1pt = 1px (@1x konvansiyon).
   Sürüm geçmişi ve kullanan projeler: README.md
   ============================================================ */

:root {
  /* SÜRÜM — kopyalayan proje bu damgayı taşır (drift takibi) */
  --kitkat-version: "1.5.0";

  /* ---- Tipografi: Apple Dynamic Type ramp (Large), size/leading
     HIG doğrulanmış tam ölçek ---- */
  --font-ui: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, sans-serif;
  /* display: kimlik taşıyan başlık/marka/skor — fonts.css'i de kopyala */
  --font-display: "Unbounded", var(--font-ui);
  --fs-caption2: 11px;  --lh-caption2: 13px;
  --fs-caption: 12px;   --lh-caption: 16px;
  --fs-footnote: 13px;  --lh-footnote: 18px;
  --fs-subhead: 15px;   --lh-subhead: 20px;
  --fs-callout: 16px;   --lh-callout: 21px;
  --fs-body: 17px;      --lh-body: 22px;      /* iOS varsayılan metin boyutu */
  --fs-headline: 17px;  --lh-headline: 22px;  /* semibold */
  --fs-title3: 20px;    --lh-title3: 25px;
  --fs-title2: 22px;    --lh-title2: 28px;
  --fs-title1: 28px;    --lh-title1: 34px;
  --fs-large: 34px;     --lh-large: 41px;

  /* ---- Spacing: 8pt grid, 4pt alt bölme (topluluk konvansiyonu) ---- */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;
  --sp-8: 32px;
  --sp-10: 40px;

  /* ---- Kontrol boyutları: HIG control size ramp ---- */
  --ctl-mini: 28px;
  --ctl-sm: 32px;
  --ctl-md: 44px;   /* = minimum dokunma hedefi (44×44pt, HIG zorunlu) */
  --ctl-lg: 52px;
  --ctl-xl: 64px;
  --tap-min: 44px;

  /* ---- Radius: iOS 26 büyük+konsantrik köşe eğilimi ---- */
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 16px;
  --r-xl: 24px;
  --r-modal: 38px;   /* sheet/modal — cihaz ekran kavisiyle uyumlu büyük radius */
  --r-pill: 999px;
  /* Konsantrik kural: iç radius = dış radius − aradaki boşluk */
  --inset-float: 21px; /* yüzen bar/tab bar kenar boşluğu (topluluk ölçümü) */

  /* ---- Gölge ---- */
  --shadow-1: 0 1px 3px rgba(0,0,0,.10);
  --shadow-2: 0 4px 12px rgba(0,0,0,.12);
  --shadow-3: 0 12px 32px rgba(0,0,0,.18);

  /* ---- Liquid Glass materyali (web yaklaşımı)
     KURAL: glass SADECE chrome/navigasyon katmanı — içerik katmanında ASLA.
     regular (frosted) = metin taşıyan her şey; clear = sadece zengin görsel üstü ---- */
  --glass-blur: 20px;
  --glass-sat: 160%;
  --glass-bg: color-mix(in srgb, var(--surface) 62%, transparent);       /* regular/frosted */
  --glass-bg-clear: color-mix(in srgb, var(--surface) 28%, transparent); /* clear */
  --glass-edge: inset 0 1px 0 rgba(255,255,255,.22), inset 0 -1px 0 rgba(0,0,0,.12); /* lens kenarı */
  --glass-shadow: 0 8px 24px rgba(0,0,0,.22); /* glass zemine gölge DÜŞÜRÜR */

  /* ---- Motion: premium hissin yarısı timing ---- */
  --dur-instant: 100ms;  /* buton basılma */
  --dur-fast: 150ms;     /* hover/state geçişi */
  --dur-med: 250ms;      /* kart giriş, toast */
  --dur-slow: 400ms;     /* sheet/modal açılış */
  --ease-out: cubic-bezier(.25, .9, .3, 1);        /* iOS varsayılan his */
  --ease-spring: cubic-bezier(.34, 1.56, .64, 1);  /* taşmalı yay — ödül/pop */
  --ease-sheet: cubic-bezier(.32, .72, 0, 1);      /* bottom sheet eğrisi */

  /* ---- Semantik renkler (paketten bağımsız; kendi hex'lerimiz —
     Apple sistem hex'leri sürümden sürüme oynar, sabitleme YOK) ---- */
  --ok: #30d158;
  --warn: #ffd60a;
  --err: #ff453a;
}

/* Hazır motion kalıpları */
@keyframes kk-pop { from { transform: scale(.6); opacity: 0; } to { transform: scale(1); opacity: 1; } }
@keyframes kk-slide-up { from { transform: translateY(24px); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes kk-pulse { 0%,100% { transform: scale(1); } 50% { transform: scale(1.08); } }
.kk-pop { animation: kk-pop var(--dur-med) var(--ease-spring) both; }
.kk-slide-up { animation: kk-slide-up var(--dur-med) var(--ease-out) both; }

@media (prefers-reduced-motion: reduce) {
  .kk-pop, .kk-slide-up { animation: none; }
}

/* Erişilebilirlik: şeffaflık azaltılsın diyen kullanıcıda glass'ı katılaştır */
@media (prefers-reduced-transparency: reduce) {
  :root {
    --glass-bg: var(--surface);
    --glass-bg-clear: var(--surface);
    --glass-blur: 0px;
  }
}

/* ============================================================
   RENK PAKETLERİ — data-pack ile seçilir
   ============================================================ */

/* Paket: premium-dark (v0) */
:root, [data-pack="premium-dark"] {
  --bg: #0d0f14;
  --surface: #171a21;
  --surface-2: #21252e;
  --text: #f2f3f5;
  --text-dim: #9aa0ab;
  --accent: #5e8bff;
  --accent-2: #8b5eff;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(255,255,255,.08);
}

/* Paket: snorely-night — Snorely'ye özel: derin indigo gece göğü + violet.
   Uyku/sağlık app'i; sakin, düşük parlaklık, mavi-mor. */
[data-pack="snorely-night"] {
  --bg: #0a0b1e;
  --surface: #16182f;
  --surface-2: #21243f;
  --text: #eef0ff;
  --text-dim: #9a9ec8;
  --accent: #7c6bff;
  --accent-2: #a78bff;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(255,255,255,.08);
}
[data-pack="snorely-night"][data-mode="light"] {
  --bg: #f1f2fb; --surface: #ffffff; --surface-2: #e6e7f6;
  --text: #1a1b33; --text-dim: #5f6392;
  --accent: #6a58f0; --accent-2: #8b6bf0;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(26,27,51,.10);
}

/* Paket: cozy-pastel (v0) */
[data-pack="cozy-pastel"] {
  --bg: #faf6f0;
  --surface: #ffffff;
  --surface-2: #f3ece2;
  --text: #3d3733;
  --text-dim: #6e6459;
  --accent: #c9603f;
  --accent-2: #f2b880;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(61,55,51,.10);
}

/* Paket: neon-arcade (v1 — araştırma paleti: koyu taban + doygun aksanlar,
   kaynak: #00F5FF #7C4DFF #FF2DAA #0B0F1A #F7F7FF) */
[data-pack="neon-arcade"] {
  --bg: #0b0f1a;
  --surface: #131828;
  --surface-2: #1c2238;
  --text: #f7f7ff;
  --text-dim: #8490b5;
  --accent: #00f5ff;
  --accent-2: #ff2daa;
  --accent-3: #7c4dff;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(0,245,255,.15);
}

/* Paket: minimal-light — temiz iOS aydınlık; utility app / puzzle */
[data-pack="minimal-light"] {
  --bg: #f2f2f7;
  --surface: #ffffff;
  --surface-2: #e9e9ef;
  --text: #1c1c1e;
  --text-dim: #6d6d72;
  --accent: #007aff;
  --accent-2: #5ac8fa;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(0,0,0,.08);
}

/* Paket: sunset-glow — sıcak turuncu-pembe; casual / hyper-casual */
[data-pack="sunset-glow"] {
  --bg: #1d1023;
  --surface: #2a1832;
  --surface-2: #3a2144;
  --text: #fff3ec;
  --text-dim: #b99cae;
  --accent: #ff7847;
  --accent-2: #ff3d81;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(255,120,71,.14);
}

/* Paket: forest-zen — yeşil doğa; chill / cozy oyunlar (Olta, Ötüş) */
[data-pack="forest-zen"] {
  --bg: #0f1712;
  --surface: #18241c;
  --surface-2: #223128;
  --text: #eef7ef;
  --text-dim: #8fa896;
  --accent: #4ade80;
  --accent-2: #a3e635;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(74,222,128,.12);
}

/* Paket: ocean-deep — derin mavi-camgöbeği; dalış / uzay (Sonsuz Dalış, Brotato uzay) */
[data-pack="ocean-deep"] {
  --bg: #071018;
  --surface: #0d1b28;
  --surface-2: #14283a;
  --text: #e8f4fb;
  --text-dim: #7d99ad;
  --accent: #22d3ee;
  --accent-2: #3b82f6;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(34,211,238,.13);
}

/* Paket: royal-loot — mor-altın; RPG / loot / premium mağaza (Krallar Yolu) */
[data-pack="royal-loot"] {
  --bg: #120d1c;
  --surface: #1c1428;
  --surface-2: #291d3a;
  --text: #f6f0ff;
  --text-dim: #a291bd;
  --accent: #a855f7;
  --accent-2: #fbbf24;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(168,85,247,.15);
}

/* Paket: candy-pop — şeker pembe-mavi aydınlık; match / kids / Sudogu */
[data-pack="candy-pop"] {
  --bg: #fdf3f8;
  --surface: #ffffff;
  --surface-2: #fce7f1;
  --text: #4a2b3d;
  --text-dim: #8a5e77;
  --accent: #d1408d;
  --accent-2: #818cf8;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(244,114,182,.18);
}

/* Paket: confetti-party — mor→pembe davet/parti; davetiye app'in dili */
[data-pack="confetti-party"] {
  --bg: #0f0a16;
  --surface: #191021;
  --surface-2: #241730;
  --text: #f8f2fc;
  --text-dim: #a893b8;
  --accent: #a855f7;
  --accent-2: #ff4d8d;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(168,85,247,.16);
}

/* Paket: retro-diner — krem + turuncu/camgöbeği 70'ler retrosu; nostaljik casual */
[data-pack="retro-diner"] {
  --bg: #f6efdf;
  --surface: #fffaf0;
  --surface-2: #eee3cc;
  --text: #33261a;
  --text-dim: #75623e;
  --accent: #e6572b;
  --accent-2: #1a9e9a;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(51,38,26,.12);
}

/* Paket: lava-forge — kor/demir; dövüş, kule savunma (Taht Savunması, Beyblade) */
[data-pack="lava-forge"] {
  --bg: #140a08;
  --surface: #1f120d;
  --surface-2: #2c1a12;
  --text: #ffefe4;
  --text-dim: #b08d7a;
  --accent: #ff5a1f;
  --accent-2: #ffb020;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(255,90,31,.16);
}

/* Paket: ice-mint — buz mavisi/nane aydınlık; ferah puzzle, sağlık/zen app */
[data-pack="ice-mint"] {
  --bg: #eef6f7;
  --surface: #ffffff;
  --surface-2: #dceef0;
  --text: #143238;
  --text-dim: #4f7078;
  --accent: #087a8a;
  --accent-2: #34d399;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(20,50,56,.10);
}

/* Paket: noir-gold — siyah + altın lüks; premium mağaza, VIP, kumar-his olmayan şıklık */
[data-pack="noir-gold"] {
  --bg: #0b0a07;
  --surface: #15130d;
  --surface-2: #211d13;
  --text: #f7f1df;
  --text-dim: #a29878;
  --accent: #d4a938;
  --accent-2: #f3e3a0;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(212,169,56,.18);
}

/* Paket: toybox — canlı oyuncak renkleri aydınlık; kids, parti oyunları */
[data-pack="toybox"] {
  --bg: #fdf8ee;
  --surface: #ffffff;
  --surface-2: #fdeedd;
  --text: #2e2a3a;
  --text-dim: #6f6680;
  --accent: #d94e14;
  --accent-2: #3a86ff;
  --grad-accent: linear-gradient(135deg, #ffbe0b, var(--accent));
  --stroke: rgba(46,42,58,.12);
}

/* Paket: mono-brutal — beton brutalism; araçlar (Islık, BETONBOX ruhu) */
[data-pack="mono-brutal"] {
  --bg: #d9d9d4;
  --surface: #e8e8e3;
  --surface-2: #c7c7c0;
  --text: #16161a;
  --text-dim: #5d5d63;
  --accent: #16161a;
  --accent-2: #ff4d00;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(22,22,26,.25);
}

/* Paket: ink-paper — kırık beyaz kağıt + siyah mürekkep; Mürekkep oyunu.
   accent-2 KOYU tutulur → primary buton gradyanı siyah kalır (turuncu yok). */
[data-pack="ink-paper"] {
  --bg: #e6e0d2;
  --surface: #efeae0;
  --surface-2: #e2dccd;
  --text: #15141a;
  --text-dim: #5b564d;
  --accent: #15141a;
  --accent-2: #3a3833;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(21,20,26,.16);
}

/* ============================================================
   KARŞI-MODLAR — data-mode ile paketin zıt görünümü
   Kural (HIG): her renk light+dark varyantıyla gelmeli.
   Varsayılan mod paketin kimliği; data-mode karşıtını açar.
   ============================================================ */

/* :not([data-pack]) şart: yalın `:root[data-mode="light"]` (0,2,0) her paketin
   tek nitelikli bloğunu (0,1,0) ezip premium-dark'ın mavisini sızdırıyordu. */
[data-pack="premium-dark"][data-mode="light"], :root:not([data-pack])[data-mode="light"] {
  --bg: #f0f2f6; --surface: #ffffff; --surface-2: #e4e8ef;
  --text: #1a1d24; --text-dim: #5d6572;
  --accent: #3a62d6; --accent-2: #6d3fd9;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(26,29,36,.10);
}
[data-pack="cozy-pastel"][data-mode="dark"] {
  --bg: #201b17; --surface: #2a241f; --surface-2: #362e27;
  --text: #f4ede6; --text-dim: #b3a698;
  --accent: #e8927c; --accent-2: #f2b880;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(255,255,255,.09);
}
[data-pack="neon-arcade"][data-mode="light"] {
  --bg: #eef2f8; --surface: #ffffff; --surface-2: #dfe7f2;
  --text: #10141f; --text-dim: #5d6880;
  --accent: #007a86; --accent-2: #c2187f;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(16,20,31,.10);
}
[data-pack="minimal-light"][data-mode="dark"] {
  --bg: #000000; --surface: #1c1c1e; --surface-2: #2c2c2e;
  --text: #ffffff; --text-dim: #98989f;
  --accent: #0a84ff; --accent-2: #64d2ff;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(255,255,255,.10);
}
[data-pack="sunset-glow"][data-mode="light"] {
  --bg: #fdf1ec; --surface: #ffffff; --surface-2: #f7e0d5;
  --text: #33161f; --text-dim: #7a5d55;
  --accent: #d8431b; --accent-2: #d61e63;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(51,22,31,.10);
}
[data-pack="forest-zen"][data-mode="light"] {
  --bg: #eef5ee; --surface: #ffffff; --surface-2: #ddeadd;
  --text: #14261a; --text-dim: #587060;
  --accent: #1e8a4c; --accent-2: #4d7c0f;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(20,38,26,.10);
}
[data-pack="ocean-deep"][data-mode="light"] {
  --bg: #edf5f9; --surface: #ffffff; --surface-2: #d9e9f2;
  --text: #0c2231; --text-dim: #506d7c;
  --accent: #0e7d95; --accent-2: #1d4ed8;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(12,34,49,.10);
}
[data-pack="royal-loot"][data-mode="light"] {
  --bg: #f5f0fb; --surface: #ffffff; --surface-2: #e9dff5;
  --text: #241536; --text-dim: #6a5c80;
  --accent: #7e22ce; --accent-2: #b45309;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(36,21,54,.10);
}
[data-pack="candy-pop"][data-mode="dark"] {
  --bg: #1d1219; --surface: #281a23; --surface-2: #33222d;
  --text: #fbeaf3; --text-dim: #bb9dac;
  --accent: #f472b6; --accent-2: #818cf8;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(255,255,255,.09);
}
[data-pack="mono-brutal"][data-mode="dark"] {
  --bg: #1a1a1c; --surface: #242426; --surface-2: #2f2f31;
  --text: #e8e8e3; --text-dim: #a3a39c;
  --accent: #f0f0eb; --accent-2: #ff4d00;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(232,232,227,.18);
}
[data-pack="ink-paper"][data-mode="dark"] {
  --bg: #141418; --surface: #1b1b20; --surface-2: #262630;
  --text: #f0eee6; --text-dim: #9a988f;
  --accent: #f0eee6; --accent-2: #c9c6bd;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(240,238,230,.14);
}
[data-pack="confetti-party"][data-mode="light"] {
  --bg: #f8f2fb; --surface: #ffffff; --surface-2: #eee0f5;
  --text: #2a1636; --text-dim: #6e5d7c;
  --accent: #8b2fd6; --accent-2: #d6336c;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(42,22,54,.10);
}
[data-pack="retro-diner"][data-mode="dark"] {
  --bg: #221a10; --surface: #2d2418; --surface-2: #3a2f1f;
  --text: #f4ead6; --text-dim: #b3a284;
  --accent: #ff7a4d; --accent-2: #2fc4bf;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(255,255,255,.09);
}
[data-pack="lava-forge"][data-mode="light"] {
  --bg: #faf1ea; --surface: #ffffff; --surface-2: #f3e0d2;
  --text: #2e160c; --text-dim: #785f50;
  --accent: #c53d0c; --accent-2: #9a6a00;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(46,22,12,.10);
}
[data-pack="ice-mint"][data-mode="dark"] {
  --bg: #0c1e22; --surface: #142b30; --surface-2: #1c3a40;
  --text: #eaf6f7; --text-dim: #92b3b8;
  --accent: #2fd0e4; --accent-2: #34d399;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(47,208,228,.14);
}
[data-pack="noir-gold"][data-mode="light"] {
  --bg: #faf6ea; --surface: #fffdf4; --surface-2: #f0e8d2;
  --text: #262012; --text-dim: #746b4c;
  --accent: #86690f; --accent-2: #b8912e;
  --grad-accent: linear-gradient(135deg, var(--accent), var(--accent-2));
  --stroke: rgba(38,32,18,.12);
}
[data-pack="toybox"][data-mode="dark"] {
  --bg: #1c1926; --surface: #262233; --surface-2: #322c42;
  --text: #f6f2ea; --text-dim: #a49bb3;
  --accent: #ff8c42; --accent-2: #6aa5ff;
  --grad-accent: linear-gradient(135deg, #ffce3a, var(--accent));
  --stroke: rgba(246,242,234,.10);
}

/* Artırılmış kontrast: ikincil metni gövdeye yaklaştır, çizgileri koyulaştır */
@media (prefers-contrast: more) {
  :root, [data-pack] {
    --text-dim: color-mix(in srgb, var(--text) 78%, var(--text-dim));
    --stroke: color-mix(in srgb, var(--text) 30%, transparent);
  }
}