feat(tema): açık / koyu / sistem teması

- TemaSaglayici (next-themes) + alt bilgide TemaSecici
- globals.css: .dark bloğunda palet token'ları çevrilir; bileşenlere
  dark: sınıfı yazılmaz
- yüzeyler bg-white → bg-card, koyu haplar text-slate-50, SVG'lerde
  sabit renk yerine değişken
- DESIGN.md §2.3 + tasarim-denetim kuralları (yuzey-beyaz,
  koyu-hap-beyaz-yazi, dark-sinif), AGENTS.md karanlık mod bölümü
- docs: koyu tema denetimi raporu

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>

src/features/sihirbaz/components/cta-sira-form.tsx

@@ -251,7 +251,7 @@ export function CtaSiraForm({
             className={
               tur === t.deger
                 ? "cursor-pointer rounded-full border border-primary bg-primary px-3 py-1.5 text-xs font-medium text-white transition-colors duration-200"
-                : "cursor-pointer rounded-full border border-slate-200 bg-white px-3 py-1.5 text-xs text-slate-600 transition-colors duration-200 hover:border-slate-300 hover:bg-slate-50"
+                : "cursor-pointer rounded-full border border-slate-200 bg-card px-3 py-1.5 text-xs text-slate-600 transition-colors duration-200 hover:border-slate-300 hover:bg-slate-50"
             }
           >
             {t.etiket}
@@ -319,7 +319,7 @@ export function CtaSiraForm({
   const cekmece = (
     <Drawer open={acik} onOpenChange={acikDegisti} handleOnly>
       <DrawerContent
-        className="max-h-[92dvh] bg-white sm:mx-auto sm:max-w-2xl sm:border-x sm:border-slate-200 sm:shadow-2xl"
+        className="max-h-[92dvh] bg-card sm:mx-auto sm:max-w-2xl sm:border-x sm:border-slate-200 sm:shadow-2xl"
       >
         <DrawerClose className="absolute top-3 right-3 z-10 flex size-9 cursor-pointer items-center justify-center rounded-full border border-slate-200 bg-popover text-slate-500 transition-[background-color,transform] duration-150 hover:bg-slate-100 hover:text-slate-800 active:scale-[0.96]">
           <X className="size-4" aria-hidden />
@@ -386,7 +386,7 @@ export function CtaSiraForm({
         aria-labelledby={baslikId}
         className={cn(
           "relative isolate overflow-hidden rounded-2xl border px-5 py-4 text-left transition-colors duration-200 sm:py-5",
-          profil ? "border-transparent bg-primary text-white" : "border-slate-200 bg-white",
+          profil ? "border-transparent bg-primary text-white" : "border-slate-200 bg-card",
         )}
       >
         {profil ? <PikselZemin seed={11} /> : null}

src/features/sihirbaz/components/hero-form.tsx

@@ -155,7 +155,7 @@ export function HeroForm() {
             className={
               tur === t.deger
                 ? "cursor-pointer rounded-full border border-primary bg-primary px-3 py-1.5 text-xs font-medium text-white transition-colors duration-200"
-                : "cursor-pointer rounded-full border border-slate-200 bg-white px-3 py-1.5 text-xs text-slate-600 transition-colors duration-200 hover:border-slate-300 hover:bg-slate-50"
+                : "cursor-pointer rounded-full border border-slate-200 bg-card px-3 py-1.5 text-xs text-slate-600 transition-colors duration-200 hover:border-slate-300 hover:bg-slate-50"
             }
           >
             {t.etiket}

src/features/sihirbaz/components/il-secim-haritasi.tsx

@@ -73,9 +73,9 @@ export function IlSecimHaritasi({
                     ? "oklch(0.705 0.213 47.6)" // orange-500
                     : adet
                       ? `oklch(0.623 0.188 259.8 / ${0.25 + 0.65 * yogunluk})`
-                      : "oklch(0.929 0.013 255.5)" // slate-200
+                      : "var(--color-slate-200)"
                 }
-                stroke={seciliMi ? "oklch(0.553 0.195 38.4)" : "white"}
+                stroke={seciliMi ? "oklch(0.553 0.195 38.4)" : "var(--card)"}
                 strokeWidth={seciliMi ? 2 : 1}
                 onClick={adet ? () => onToggle(key) : undefined}
                 role={adet ? "button" : undefined}

src/features/sihirbaz/components/sihirbaz-adimlar.tsx

@@ -48,7 +48,7 @@ export function Cip({
       className={
         secili
           ? `${temel} border-primary bg-primary text-white`
-          : `${temel} border-slate-200 bg-white text-slate-700 hover:border-orange-500 hover:bg-orange-50/60 hover:text-orange-500`
+          : `${temel} border-slate-200 bg-card text-slate-700 hover:border-orange-500 hover:bg-orange-50/60 hover:text-orange-500`
       }
     >
       {children}
@@ -345,7 +345,7 @@ export function SihirbazAdimlar({
             En fazla 5 il seçebilirsin. İstersen boş bırak, fark etmez.
           </p>
 
-          <div className="mt-4 flex h-11 items-center gap-2 rounded-full border border-slate-200 bg-white px-4 transition-colors focus-within:border-slate-300">
+          <div className="mt-4 flex h-11 items-center gap-2 rounded-full border border-slate-200 bg-card px-4 transition-colors focus-within:border-slate-300">
             <Search className="size-4 shrink-0 text-slate-400" aria-hidden />
             <input
               type="text"
@@ -354,7 +354,7 @@ export function SihirbazAdimlar({
               placeholder="İl ara..."
               aria-label="İl ara"
               autoComplete="off"
-              className="min-w-0 flex-1 bg-transparent text-base text-slate-950 outline-none placeholder:text-slate-400"
+              className="min-w-0 flex-1 bg-transparent text-base text-slate-900 outline-none placeholder:text-slate-400"
             />
             {ilArama ? (
               <button
@@ -394,7 +394,7 @@ export function SihirbazAdimlar({
               <button
                 type="button"
                 onClick={() => setTumIllerAcik(true)}
-                className="inline-flex h-10 cursor-pointer items-center rounded-full border border-dashed border-slate-300 bg-white px-3.5 text-sm font-semibold text-slate-500 transition-[background-color,border-color,color,transform] duration-150 hover:border-orange-500 hover:bg-orange-50/60 hover:text-orange-500 active:scale-[0.97]"
+                className="inline-flex h-10 cursor-pointer items-center rounded-full border border-dashed border-slate-300 bg-card px-3.5 text-sm font-semibold text-slate-500 transition-[background-color,border-color,color,transform] duration-150 hover:border-orange-500 hover:bg-orange-50/60 hover:text-orange-500 active:scale-[0.97]"
               >
                 +{gorunenTurkiyeIlleri.length - IL_ON_IZLEME} il daha
               </button>
@@ -406,7 +406,7 @@ export function SihirbazAdimlar({
               <button
                 type="button"
                 onClick={() => setTumIllerAcik(false)}
-                className="inline-flex h-10 cursor-pointer items-center rounded-full border border-dashed border-slate-300 bg-white px-3.5 text-sm font-semibold text-slate-500 transition-[background-color,border-color,color,transform] duration-150 hover:border-orange-500 hover:bg-orange-50/60 hover:text-orange-500 active:scale-[0.97]"
+                className="inline-flex h-10 cursor-pointer items-center rounded-full border border-dashed border-slate-300 bg-card px-3.5 text-sm font-semibold text-slate-500 transition-[background-color,border-color,color,transform] duration-150 hover:border-orange-500 hover:bg-orange-50/60 hover:text-orange-500 active:scale-[0.97]"
               >
                 Daha az göster
               </button>