/* ============================================================
   ÇEMBER GÖRÜNÜMÜ — deneysel
   Bu dosyayı silmek görünümü kaldırır (bkz. cember.js başındaki not).
   ============================================================ */

/* Sonuç aşamasının hızlı revizyon aleti. #sonuc içinde yaşadığı için soru
   aşamasında kendiliğinden görünmez — karar 1 yapısal olarak korunur. */
#cember{
  max-width:min(560px, 92vw);
  margin:0 auto 26px;
}
#cemberSvg{width:100%;height:auto;display:block;overflow:visible;}

/* Seçenek bantları — kategori diliminin içinde, yarıçap boyunca dizili */
.cember-bant{
  fill:var(--kagit-ust);
  stroke:var(--cizgi);
  stroke-width:.75;
  cursor:pointer;
  transition:fill .15s ease;
}
.cember-bant:hover{fill:var(--altin);}
.cember-bant.secili{fill:var(--murekkep);stroke:var(--murekkep);}
.cember-bant.secili:hover{fill:var(--altin);stroke:var(--altin);}

/* Bant kalınsa seçenek adı içine yazılır */
.cember-secenek{
  font-family:"Karla",sans-serif;font-size:11px;
  fill:var(--murekkep);
  text-anchor:middle;dominant-baseline:middle;
  pointer-events:none;
}
.cember-secenek.secili{fill:var(--kagit);font-weight:600;}

/* Kategori yayı — bölümlerin dış sınırını tek bakışta gösteren kalın çizgi */
.cember-yay{
  fill:var(--murekkep);
  pointer-events:none;
}

.cember-etiket{
  font-family:"Archivo",sans-serif;font-size:10.5px;font-weight:600;
  letter-spacing:.08em;text-transform:uppercase;
  fill:var(--silik);
  text-anchor:middle;dominant-baseline:middle;
  pointer-events:none;
}

/* Ortadaki rakam */
.cember-merkez{pointer-events:none;}
/* Yeşil (--ozgur): kaldırılan "… yaşında özgür" satırının rengiydi. Merkezde
   tek başına kalan tutarı hem canlandırıyor hem şeritteki "özgür yıllar"
   rengiyle aynı dili konuşuyor. */
#cemberRakam{
  font-family:"Archivo",sans-serif;font-weight:800;font-size:31px;
  letter-spacing:-.03em;fill:var(--ozgur);text-anchor:middle;
}
/* Bantları etiketlenemeyecek kadar çok olan kategoride (16 şehir) seçilenin adı */
.cember-secim{
  font-family:"Karla",sans-serif;font-size:12.5px;font-weight:600;
  fill:var(--murekkep);
  text-anchor:middle;dominant-baseline:middle;
  pointer-events:none;
}
/* Üstüne gelinen seçeneğin adı — çemberin dışında, ortada yer kalsın diye */
#cemberIpucu{
  margin:2px 0 0;text-align:center;min-height:1.4em;
  font-family:"Karla",sans-serif;font-size:14px;color:var(--silik);
}
.cember-baslik{
  font-family:"Archivo",sans-serif;font-size:10px;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;fill:var(--silik);text-anchor:middle;
}

@media (prefers-reduced-motion: reduce){
  .cember-bant{transition:none;}
}