/* deporte — kişisel gelişim paneli stilleri
   İki görünümde de çalışır: modern değişkenleri (--m-*) yoksa klasik
   karşılıklarına düşer. Turuncu vurgu deporte klasör rengiyle (#e0701f) aynı. */

:root { --d-vurgu: #c25a12; --d-parlak: #e0701f; }

/* ---------- ikinci ısı haritası paleti (aynı ızgara, turuncu) ---------- */
.isi-spor .m-isi .s1, .isi-spor .m-isi-lejant .s1 { background: #3a2412; }
.isi-spor .m-isi .s2, .isi-spor .m-isi-lejant .s2 { background: #7a3f13; }
.isi-spor .m-isi .s3, .isi-spor .m-isi-lejant .s3 { background: #b45a17; }
.isi-spor .m-isi .s4, .isi-spor .m-isi-lejant .s4 { background: var(--d-parlak); }
.isi-spor .m-isi i.d-dinlenme { background: transparent; box-shadow: inset 0 0 0 1px #4a453f; }

/* Kâğıt zeminli deporte iç sayfasında açık tonlar */
.d-sayfa .isi-spor .m-isi i { background: #e7e3da; }
.d-sayfa .isi-spor .m-isi .s1 { background: #f6e3d2; }
.d-sayfa .isi-spor .m-isi .s2 { background: #edb98a; }
.d-sayfa .isi-spor .m-isi .s3 { background: #d98a41; }
.d-sayfa .isi-spor .m-isi .s4 { background: var(--d-parlak); }
.d-sayfa .isi-spor .m-isi-lejant i { background: #e7e3da; }
.d-sayfa .isi-spor .m-isi-lejant .s1 { background: #f6e3d2; }
.d-sayfa .isi-spor .m-isi-lejant .s2 { background: #edb98a; }
.d-sayfa .isi-spor .m-isi-lejant .s3 { background: #d98a41; }
.d-sayfa .isi-spor .m-isi-lejant .s4 { background: var(--d-parlak); }
.d-sayfa .isi-spor .m-isi i.d-dinlenme { background: transparent; box-shadow: inset 0 0 0 1px #c9c3b6; }
.d-sayfa .isi-spor .m-isi i:hover { outline: 1px solid var(--d-vurgu); }

/* ilerleme çubukları deporte renginde (modern tema kuralını geçmeli) */
body .d-sayfa .d-satir .cetvel-dolu { background: var(--dal-renk, var(--d-vurgu)); }
body .d-sayfa .d-satir .cetvel-yuzde { color: var(--dal-renk, var(--d-vurgu)); }

.d-ana-isi { margin-top: 4px; }
.d-ana-isi .m-gunluk-baslik a { float: right; color: var(--d-parlak); text-transform: none; letter-spacing: .04em; }
.d-seri { color: var(--d-parlak); }
body.modern .m-gunluk-sol { display: flex; flex-direction: column; gap: 26px; }

/* ---------- başlık ve uyarı ---------- */
.d-tarih { font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-orta); color: var(--m-gri, #57534b); }
.d-hedef-link {
  font-family: var(--m-mono, Consolas, monospace);
  font-size: var(--yz-kucuk); text-transform: uppercase; letter-spacing: .06em;
  color: var(--d-vurgu); margin-left: auto;
}
.d-uyari {
  border: 1px dashed var(--m-cizgi, #e7e3da);
  padding: 16px 18px; margin: 18px 0;
  display: flex; flex-wrap: wrap; gap: 12px; align-items: center; font-size: var(--yz-buyuk);
}

/* ---------- gün özeti ---------- */
.d-ozet { display: flex; align-items: center; gap: 20px; margin: 18px 0 22px; }
/* özgüllük .d-svg{width:100%} kuralını geçmeli — yoksa halka sayfayı kaplıyor */
.d-ozet svg.d-halka { width: 92px; height: 92px; color: var(--d-vurgu); flex: none; }
.d-ozet-metin { flex: 1; display: flex; flex-direction: column; gap: 4px; }
.d-ozet-metin b { font-family: var(--m-serif, Georgia, serif); font-size: calc(30px * var(--yz)); font-weight: 400; }
.d-ozet-metin i { font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-orta); color: var(--m-gri, #57534b); font-style: normal; }
.d-etiket {
  font-family: var(--m-mono, Consolas, monospace);
  font-size: var(--yz-kucuk); letter-spacing: .06em; padding: 2px 8px; align-self: flex-start; color: #fff;
}
.d-etiket.s0 { background: #9a948a; }
.d-etiket.s1 { background: #b4552d; }
.d-etiket.s2 { background: #a9822f; }
.d-etiket.s3 { background: #2f6b4f; }
.d-etiket.s4 { background: #0f8a63; }

/* ---------- günlük giriş blokları ---------- */
.d-bloklar { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 18px; }
.d-bloklar.d-pasif { opacity: .4; pointer-events: none; }
.d-blok { border: 1px solid var(--m-cizgi, #e7e3da); padding: 14px 16px; }
.d-satir { padding: 8px 0; border-bottom: 1px dotted var(--m-cizgi, #e7e3da); }
.d-satir:last-child { border-bottom: none; }
.d-satir-ust { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.d-ad { font-size: var(--yz-buyuk); }
.d-ad i { font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-kucuk); color: var(--m-gri, #57534b); font-style: normal; margin-left: 6px; }
.d-asim { font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-kucuk); color: #0f8a63; }
.d-girdi { display: flex; align-items: center; gap: 8px; margin: 8px 0 4px; }
.d-girdi input[type=number] {
  width: 4.8em; text-align: center; padding: 8px;
  font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-dev);
  border: 1px solid var(--m-cizgi, #e7e3da); background: var(--m-kagit, #fff);
}
.d-adim {
  min-width: 46px; min-height: 44px; cursor: pointer;
  border: 1px solid var(--m-cizgi, #e7e3da); background: var(--m-dolgu, #f3efe8);
  font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-normal);
}
.d-adim:hover { border-color: var(--m-murekkep, #1c1b18); }
.d-kutu-satir label { display: flex; align-items: center; gap: 10px; font-size: var(--yz-buyuk); cursor: pointer; padding: 6px 0; }
.d-kutu-satir input[type=checkbox] { width: 20px; height: 20px; accent-color: var(--d-vurgu); }
.d-yorum { margin-top: 18px; min-height: 90px; }

/* ---------- grafikler ---------- */
.d-isi-blok, .d-egilim, .d-grafikler { margin-top: 30px; }
.d-egilim { color: var(--d-vurgu); }
.d-svg { width: 100%; height: auto; display: block; }
.d-grafikler { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 20px; }
.d-dal-karti { border: 1px solid var(--m-cizgi, #e7e3da); padding: 14px 16px; color: var(--d-vurgu); }
.d-dal-ust { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.d-dal-ust h3 { font-family: var(--m-serif, Georgia, serif); font-weight: 400; font-size: var(--yz-dev); color: var(--m-murekkep, #1c1b18); }
.d-dal-ust i { font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-mini); color: var(--m-gri, #57534b); font-style: normal; margin-left: 6px; }
.d-periyot { display: flex; gap: 4px; }
.d-periyot button {
  font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-mini);
  text-transform: uppercase; letter-spacing: .06em; padding: 4px 8px;
  border: 1px solid var(--m-cizgi, #e7e3da); background: none; color: var(--m-gri, #57534b); cursor: pointer;
}
.d-periyot button.secili { border-color: var(--d-vurgu); color: var(--d-vurgu); }
.d-istatistik {
  display: flex; flex-wrap: wrap; gap: 14px; margin-top: 10px;
  font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-kucuk); color: var(--m-gri, #57534b);
}
.d-istatistik b { color: var(--m-murekkep, #1c1b18); font-weight: 400; font-size: var(--yz-normal); }

/* ---------- hedef düzenleme ---------- */
.d-ay-nav { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 18px 0 20px; }
.d-ay-nav input[type=month] {
  font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-normal); padding: 7px 10px;
  border: 1px solid var(--m-cizgi, #e7e3da); background: var(--m-kagit, #fff);
}
.d-hedef-satir { padding: 12px 0; border-bottom: 1px dotted var(--m-cizgi, #e7e3da); }
.d-hedef-ust { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.d-hedef-alt { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin-top: 10px; }
.d-dilim-kutu {
  display: flex; align-items: center; gap: 6px; padding: 5px 9px;
  border: 1px solid var(--m-cizgi, #e7e3da);
  font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-kucuk); color: var(--m-gri, #57534b);
}
.d-dilim-kutu.secili { border-color: var(--d-vurgu); color: var(--d-vurgu); }
.d-dilim-kutu label { display: flex; align-items: center; gap: 5px; cursor: pointer; }
.d-dilim-kutu input[type=checkbox] { accent-color: var(--d-vurgu); }
.d-set { display: flex; align-items: center; gap: 3px; border-left: 1px solid var(--m-cizgi, #e7e3da); padding-left: 6px; }
.d-set input { width: 3.4em; padding: 3px 4px; text-align: center; font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-orta); border: 1px solid var(--m-cizgi, #e7e3da); background: var(--m-kagit, #fff); }
.d-gun-secim { display: flex; gap: 3px; align-items: center; }
.d-gun-dugme {
  min-width: 2.6em; padding: 5px .5em; cursor: pointer;
  font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-mini);
  border: 1px solid var(--m-cizgi, #e7e3da); background: none; color: #b9b3a7;
}
.d-gun-dugme.secili { border-color: var(--d-vurgu); color: var(--d-vurgu); background: #fdf2e8; }
.d-gun-not { font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-mini); color: var(--d-vurgu); margin-left: 4px; }
.d-toplam { font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-kucuk); color: var(--m-gri, #57534b); margin-left: auto; }
.d-toplam b { color: var(--m-murekkep, #1c1b18); font-size: var(--yz-normal); font-weight: 400; }
.d-set-sayac { font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-kucuk); color: var(--d-vurgu); white-space: nowrap; }

/* sonradan tamamlanan günler: aynı renk + çapraz tarama (telafi işareti) */
.isi-spor .m-isi i.d-telafi {
  background-image: repeating-linear-gradient(45deg, rgba(255,255,255,.55) 0 1.5px, transparent 1.5px 4px);
}
.d-sayfa .isi-spor .m-isi i.d-telafi {
  background-image: repeating-linear-gradient(45deg, rgba(0,0,0,.28) 0 1.5px, transparent 1.5px 4px);
}
.d-harita-ipucu { float: right; text-transform: none; letter-spacing: .04em; color: var(--m-gri, #57534b); }
.d-telafi-rozet { font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-mini); color: var(--d-vurgu); border: 1px solid var(--d-vurgu); padding: 2px 7px; }

/* ay notu */
.d-ay-not { margin-top: 22px; }
.d-ay-not textarea { min-height: 70px; }
.d-ay-rozet {
  border-left: 3px solid var(--d-vurgu); padding: 8px 12px; margin: 14px 0 0;
  background: #fdf2e8; font-size: var(--yz-normal); color: #4a463f;
}
.d-ay-rozet b { font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-kucuk); text-transform: uppercase; letter-spacing: .06em; color: var(--d-vurgu); margin-right: 8px; }
/* grafik ızgarasının sonundaki "+" kartı */
.d-ekle-karti {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  min-height: 120px; border: 1px dashed var(--m-cizgi, #e7e3da); color: #b9b3a7;
  text-decoration: none; transition: border-color .15s, color .15s;
}
.d-ekle-karti:hover { border-color: var(--d-vurgu); color: var(--d-vurgu); }
.d-arti { font-size: calc(30px * var(--yz)); line-height: 1; font-family: var(--m-serif, Georgia, serif); }
.d-ekle-yazi { font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-mini); text-transform: uppercase; letter-spacing: .06em; }
.d-vurgu-an { outline: 2px solid var(--d-vurgu); outline-offset: 2px; }

.d-dal-ekle select {
  min-width: 190px; padding: 9px 12px; font-size: var(--yz-buyuk);
  border: 1px solid var(--m-cizgi, #e7e3da); background: var(--m-kagit, #fff);
}
.d-hedef-satir input[type=text] { flex: 1; min-width: 130px; padding: 7px 10px; border: 1px solid var(--m-cizgi, #e7e3da); background: var(--m-kagit, #fff); font-size: var(--yz-buyuk); }
.d-hedef-satir input[type=number] { width: 4.6em; padding: 7px; text-align: center; border: 1px solid var(--m-cizgi, #e7e3da); background: var(--m-kagit, #fff); font-family: var(--m-mono, Consolas, monospace); }
.d-kutu-etiket { font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-mini); text-transform: uppercase; letter-spacing: .06em; color: var(--m-gri, #57534b); }
.d-dilim-secim { display: flex; gap: 6px; flex-wrap: wrap; min-width: 0; }
.d-dilim-secim label {
  display: flex; align-items: center; gap: 5px; cursor: pointer;
  font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-kucuk); padding: 5px 9px;
  border: 1px solid var(--m-cizgi, #e7e3da); color: var(--m-gri, #57534b);
}
.d-dilim-secim label.secili { border-color: var(--d-vurgu); color: var(--d-vurgu); }
.d-dilim-secim input { accent-color: var(--d-vurgu); }
.d-dal-ekle { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.d-dal-ekle input[type=text] { flex: 1; min-width: 150px; padding: 9px 12px; border: 1px solid var(--m-cizgi, #e7e3da); background: var(--m-kagit, #fff); }
.d-dal-ekle input[type=number] { width: 5em; padding: 9px; text-align: center; border: 1px solid var(--m-cizgi, #e7e3da); background: var(--m-kagit, #fff); }
.d-arsiv { margin-top: 16px; font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-kucuk); color: var(--m-gri, #57534b); }

.deporte-link { font-size: var(--yz-buyuk); font-weight: 600; border-bottom: 2px solid var(--d-parlak); padding-bottom: 2px; }
body.misafir .deporte-link { display: none; }

/* NOT: deporte ekranları modern görünümde de KÂĞIT zeminli `.ic-sayfa` içinde
   açılıyor. Bu yüzden koyu tema renkleri uygulanmaz — yalnız ana sayfadaki
   (koyu zeminde duran) ikinci ısı haritası bloğu koyu renkleri kullanır. */
body.modern .d-ana-isi .m-gunluk-baslik { color: #a49c90; }
body.modern .d-ana-isi .z-bos { color: #a49c90; }

/* iç sayfada koyu metin — kâğıt zeminde okunur kalsın */
.d-sayfa .d-ozet-metin b, .d-sayfa .d-dal-ust h3, .d-hedef-sayfa .d-dal-ust h3,
.d-sayfa .d-istatistik b, .d-sayfa .d-ad { color: var(--m-murekkep, #1c1b18); }
.d-sayfa .d-tarih, .d-sayfa .d-ad i, .d-sayfa .d-ozet-metin i,
.d-sayfa .d-istatistik, .d-hedef-sayfa .d-kutu-etiket, .d-hedef-sayfa .d-arsiv,
.d-sayfa .z-bos, .d-hedef-sayfa .z-bos, .d-sayfa .m-gunluk-baslik,
.d-hedef-sayfa .m-gunluk-baslik { color: var(--m-gri, #57534b); }
.d-sayfa .not-alani, .d-sayfa .not-durum { color: var(--m-murekkep, #1c1b18); }

@media (max-width: 900px) {
  .d-bloklar, .d-grafikler { grid-template-columns: 1fr; }
  .d-ozet { gap: 14px; }
  .d-ozet svg.d-halka { width: 72px; height: 72px; }
  .d-hedef-satir { flex-direction: column; align-items: stretch; }
  .d-dilim-secim { justify-content: space-between; }
  .not-durum[data-d-durum] { position: sticky; bottom: 0; background: var(--m-kagit, #fff); padding: 6px 0; }
  body.modern .not-durum[data-d-durum] { background: var(--n-zemin, #161310); }
}

/* ---------- gelişim grafiği ---------- */
.d-gelisim {
  border: 1px solid var(--cizgi, #3a3530);
  padding: 16px 18px 12px;
  margin-top: 22px;
}
.d-gelisim-ust {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
.d-gelisim-ust .m-gunluk-baslik { margin: 0; }
.d-gelisim-sec {
  font-family: var(--m-mono, var(--mono));
  font-size: var(--yz-normal);
  background: #221e1a;
  color: var(--n-krem, #f4efe4);
  border: 1px solid #4a453f;
  padding: 5px 10px;
  cursor: pointer;
}
.d-gelisim-sec:focus { outline: none; border-color: var(--gun-rengi, #f2cf1d); }
.d-sayfa .d-gelisim-sec { background: var(--kagit, #fff); color: var(--murekkep, #1c1b18); border-color: var(--cizgi, #ddd); }
.d-gelisim-mod { display: flex; gap: 4px; margin-left: auto; }
.d-gelisim-mod button {
  font-family: var(--m-mono, var(--mono));
  font-size: var(--yz-mini);
  text-transform: uppercase;
  letter-spacing: .06em;
  background: none;
  border: 1px solid #4a453f;
  color: #a49c90;
  padding: 4px 9px;
  cursor: pointer;
}
.d-gelisim-mod button.secili {
  color: var(--gun-rengi, #f2cf1d);
  border-color: var(--gun-rengi, #f2cf1d);
}
.d-gelisim-ozet {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 18px;
  font-family: var(--m-mono, var(--mono));
  font-size: var(--yz-kucuk);
  color: #a49c90;
  margin-bottom: 10px;
}
.d-gelisim-ozet b { color: var(--n-krem, #f4efe4); font-weight: 600; font-size: var(--yz-normal); }
.d-gelisim-ozet i { font-style: normal; opacity: .7; }
.d-gelisim-ozet .d-zincir b { color: var(--gun-rengi, #f2cf1d); }
.d-gelisim-svg { width: 100%; height: auto; color: var(--dal-renk, #e0701f); display: block; }
.d-gelisim-alt {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  font-family: var(--m-mono, var(--mono));
  font-size: var(--yz-mini);
  color: #7d766c;
  margin-top: 6px;
}
.d-gelisim-lejant { display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.d-gelisim-lejant i {
  display: inline-block;
  width: 10px; height: 10px;
  margin-left: 8px;
  vertical-align: -1px;
  font-style: normal;
}
.d-gelisim-lejant i:first-child { margin-left: 0; }
.d-gelisim-lejant .l-cubuk { background: var(--dal-renk, #e0701f); }
.d-gelisim-lejant .l-hedef { height: 0; border-top: 1px dashed currentColor; width: 14px; }
.d-gelisim-lejant .l-cizgi { height: 0; border-top: 2px solid var(--gun-rengi, #f2cf1d); width: 14px; }
.d-gelisim-lejant .l-kacan { background: #d0212e; height: 3px; }

/* kâğıt zeminli deporte iç sayfası */
.d-sayfa .d-gelisim-ozet { color: var(--soluk, #57534b); }
.d-sayfa .d-gelisim-ozet b { color: var(--murekkep, #1c1b18); }
.d-sayfa .d-gelisim-mod button { border-color: var(--cizgi, #ddd); color: var(--soluk, #57534b); }
.d-sayfa .d-gelisim-alt { color: var(--soluk, #57534b); }

@media (max-width: 800px) {
  .d-gelisim { padding: 12px 12px 10px; }
  .d-gelisim-mod { margin-left: 0; }
  .d-gelisim-ozet { gap: 2px 12px; }
  .d-gelisim-alt { flex-direction: column; align-items: flex-start; }
}

/* ölçüm birimi düğmeleri (bir çubuk kaç günü toplar) */
.d-gelisim-kova { display: flex; gap: 4px; flex-wrap: wrap; }
.d-gelisim-kova button {
  font-family: var(--m-mono, var(--mono));
  font-size: var(--yz-mini);
  text-transform: uppercase;
  letter-spacing: .06em;
  background: none;
  border: 1px solid #4a453f;
  color: #a49c90;
  padding: 4px 9px;
  cursor: pointer;
  position: relative;
}
.d-gelisim-kova button.secili { color: var(--d-parlak); border-color: var(--d-parlak); }
.d-gelisim-kova button i {
  font-style: normal;
  font-size: .75em;
  opacity: .65;
  margin-left: 5px;
  letter-spacing: 0;
}
.d-sayfa .d-gelisim-kova button { border-color: var(--m-cizgi, #e7e3da); color: var(--m-gri, #57534b); }
.d-sayfa .d-gelisim-kova button.secili { color: var(--d-vurgu); border-color: var(--d-vurgu); }
@media (max-width: 800px) {
  .d-gelisim-kova { width: 100%; }
  .d-gelisim-kova button { flex: 1; padding: 5px 4px; }
}


/* ---------- hedef ekranı: dar ekranda taşmasın ----------
   01.09.2026: 390px'lik ekranda dilim seçimi (sabah/akşam/serbest + set
   kutuları) 440px yer kaplayıp sayfayı yatay kaydırıyordu; sağdaki alanlar
   ekran dışında kalıyor, "sayı girme ekranı yok" gibi görünüyordu. */
@media (max-width: 800px) {
  .d-hedef-satir { overflow-wrap: anywhere; }
  .d-hedef-ust, .d-hedef-alt { gap: 8px; }
  .d-hedef-ust > input[type=text] { flex: 1 1 100%; min-width: 0; }
  .d-hedef-ust > input[type=number] { width: 5em; }
  .d-hedef-alt { flex-direction: column; align-items: stretch; }
  .d-dilim-secim { width: 100%; }
  .d-dilim-kutu { flex: 1 1 auto; min-width: 0; justify-content: space-between; }
  .d-set { padding-left: 4px; }
  .d-set input { width: 3em; }
  .d-gun-secim { display: flex; flex-wrap: wrap; gap: 4px; }
  .d-gun-dugme { flex: 1 1 auto; min-width: 2.4em; }
  /* "sayısala çevir" satırın altına tam genişlikte insin: dar ekranda
     küçük bir düğme olarak kaybolmasın */
  .d-hedef-ust > button[data-islem="d-tip"] { flex: 1 1 100%; padding: 8px; }
}

/* "sayı gireyim" düğmesi: kutu tipindeki satırda asıl çıkış yolu bu, göze çarpsın */
.d-tip-vurgu { border: 1px solid var(--d-vurgu) !important; color: var(--d-vurgu) !important; }
.d-kutu-etiket { font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-kucuk); color: var(--m-gri, #57534b); }

/* ---------- panolar: seri şeridi · açık hesap · karne · dal rafı ----------
   Hepsi deporte iç sayfasında (kâğıt zemin) durur; renkler --m-* değişkenlerine
   düşer, yoksa klasik karşılıklarına. Ölçü birimi mevcut bloklarla aynı:
   1px kesik/çizgi çerçeve, mono etiket, turuncu vurgu. */

/* 1. seri şeridi */
.d-serit {
  display: flex; flex-wrap: wrap; gap: 6px 22px; align-items: baseline;
  border-top: 1px solid var(--m-cizgi, #e7e3da);
  border-bottom: 1px solid var(--m-cizgi, #e7e3da);
  padding: 10px 2px; margin: 4px 0 20px;
  font-family: var(--m-mono, Consolas, monospace);
  font-size: var(--yz-kucuk); color: var(--m-gri, #57534b);
}
.d-serit b { font-size: var(--yz-orta); color: var(--m-murekkep, #1c1b18); font-weight: 600; }
.d-serit i { font-style: normal; opacity: .75; }
.d-serit .d-serit-ana b { color: var(--d-vurgu); }
.d-serit .d-rozet { padding-left: 14px; border-left: 1px solid var(--m-cizgi, #e7e3da); }

/* 2. açık hesap */
.d-acik-hesap { border: 1px solid var(--m-cizgi, #e7e3da); padding: 16px 18px 14px; margin: 22px 0; }
.d-acik-hesap .m-gunluk-baslik { margin: 0 0 12px; }
/* Sütunlar LİSTE düzeyinde tanımlı, satırlar display:contents — her satır kendi
   grid'i olunca ad/sayı sütunları satır başına farklı genişlik alıyor, çubuklar
   farklı x'ten başlıyor ve tempo çizgisi zikzak oluyordu (kullanıcı 2026-09-06). */
.d-borc-liste {
  display: grid;
  grid-template-columns: minmax(84px, max-content) 1fr max-content minmax(72px, max-content);
  gap: 8px 12px; align-items: center;
  font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-kucuk);
  color: var(--m-gri, #57534b);
}
.d-borc-satir { display: contents; }
.d-borc-sayi { white-space: nowrap; }
.d-borc-ad { color: var(--m-murekkep, #1c1b18); }
.d-borc-cetvel { position: relative; height: 8px; background: var(--m-cizgi, #e7e3da); display: block; }
.d-borc-dolu { position: absolute; inset: 0 auto 0 0; background: var(--d-vurgu); display: block; }
/* tempo işareti: "bugüne kadar burada olman gerekirdi" */
.d-borc-tempo {
  position: absolute; top: -3px; bottom: -3px; width: 0;
  border-left: 2px dashed var(--m-murekkep, #1c1b18); opacity: .8; display: block;
}
.d-borc-sayi b { color: var(--m-murekkep, #1c1b18); font-weight: 600; }
.d-borc-durum { text-align: right; }
.d-borc-durum em { font-style: normal; color: #b3261e; }
.d-geride .d-borc-dolu { background: #d98a41; }

.d-eksik-baslik {
  font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-kucuk);
  text-transform: uppercase; letter-spacing: .06em; color: var(--m-gri, #57534b);
  margin: 18px 0 8px; padding-top: 14px; border-top: 1px dashed var(--m-cizgi, #e7e3da);
}
.d-borc-aciklama {
  font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-mini);
  color: var(--m-gri, #57534b); opacity: .85; margin: 10px 0 0;
}
.d-eksik-baslik i { display: block; text-transform: none; letter-spacing: 0; opacity: .8; font-style: normal; margin-top: 3px; }
.d-eksik-liste { display: flex; flex-direction: column; }
.d-eksik-satir {
  display: grid; grid-template-columns: minmax(96px, auto) 46px 1fr auto;
  gap: 12px; align-items: center; padding: 7px 4px;
  border-bottom: 1px solid var(--m-cizgi, #e7e3da);
  font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-kucuk);
  color: var(--m-gri, #57534b); text-decoration: none; cursor: pointer;
}
.d-eksik-satir:hover { background: rgba(224, 112, 31, .07); }
.d-eksik-tarih { color: var(--m-murekkep, #1c1b18); }
.d-eksik-tarih i { font-style: normal; opacity: .6; margin-left: 4px; }
.d-eksik-not { text-align: center; padding: 2px 0; color: var(--m-murekkep, #1c1b18); background: #f0ece4; }
.d-eksik-not.d-s1 { background: #f6e3d2; }
.d-eksik-not.d-s2 { background: #edb98a; }
.d-eksik-not.d-s3 { background: #d98a41; color: #fff; }
.d-eksik-not.d-s4 { background: var(--d-parlak); color: #fff; }
.d-eksik-ne i { font-style: normal; opacity: .65; }
.d-eksik-git { color: var(--d-vurgu); opacity: 0; transition: opacity .12s; }
.d-eksik-satir:hover .d-eksik-git { opacity: 1; }
.d-eksik-tumu {
  margin-top: 10px; background: none; cursor: pointer;
  border: 1px solid var(--m-cizgi, #e7e3da); color: var(--d-vurgu);
  font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-mini);
  text-transform: uppercase; letter-spacing: .06em; padding: 5px 12px;
}
.d-eksik-tumu:hover { border-color: var(--d-vurgu); }

/* 3. ay karnesi */
.d-karne { margin: 22px 0; }
.d-karne-kutular {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  border: 1px solid var(--m-cizgi, #e7e3da); border-width: 1px 0 0 1px;
}
.d-karne-kutu {
  border: 1px solid var(--m-cizgi, #e7e3da); border-width: 0 1px 1px 0;
  padding: 14px 16px; display: flex; flex-direction: column; gap: 3px;
}
.d-karne-kutu b { font-family: var(--m-serif, Georgia, serif); font-size: calc(28px * var(--yz)); font-weight: 400; color: var(--m-murekkep, #1c1b18); }
.d-karne-kutu span, .d-karne-kutu i {
  font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-kucuk);
  color: var(--m-gri, #57534b); font-style: normal;
}
.d-karne-kutu .d-artis { color: #1f7a3d; }
.d-karne-kutu .d-azalis { color: #b3261e; }
.d-karne-kutu.d-zayif b { color: var(--d-vurgu); }

/* 4. dal rafı */
.d-raf { border: 1px solid var(--m-cizgi, #e7e3da); padding: 16px 18px 8px; margin: 22px 0; }
.d-raf .m-gunluk-baslik { margin: 0 0 10px; }
.d-raf-satir {
  display: grid; grid-template-columns: minmax(104px, 1fr) 2.4fr auto auto auto;
  gap: 14px; align-items: center; padding: 8px 0;
  border-top: 1px solid var(--m-cizgi, #e7e3da);
  font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-kucuk);
  color: var(--m-gri, #57534b);
}
.d-raf-satir:first-of-type { border-top: 0; }
.d-raf-ad { color: var(--m-murekkep, #1c1b18); }
.d-raf-ad i { font-style: normal; opacity: .6; }
.d-raf-satir b { color: var(--m-murekkep, #1c1b18); font-weight: 600; }
.d-raf-yuzde b { color: var(--d-vurgu); }
.d-raf-grafik { display: block; }
.d-raf-grafik { color: var(--d-parlak); }
.d-raf-grafik svg { width: 100%; height: 32px; color: inherit; display: block; }
.d-raf-grafik .z-bos { margin: 0; }

@media (max-width: 800px) {
  .d-serit { gap: 4px 14px; }
  .d-serit .d-rozet { padding-left: 0; border-left: 0; }
  .d-acik-hesap, .d-raf { padding: 12px 12px 10px; }
  .d-borc-liste { display: flex; flex-direction: column; gap: 8px; }
  .d-borc-satir { display: grid; grid-template-columns: 1fr auto; grid-template-areas: "ad durum" "cetvel cetvel" "sayi sayi"; gap: 4px 10px; }
  .d-borc-ad { grid-area: ad; }
  .d-borc-durum { grid-area: durum; }
  .d-borc-cetvel { grid-area: cetvel; }
  .d-borc-sayi { grid-area: sayi; }
  .d-eksik-satir { grid-template-columns: auto 46px 1fr; }
  .d-eksik-git { display: none; }
  .d-raf-satir { grid-template-columns: 1fr auto; grid-template-areas: "ad yuzde" "grafik grafik" "sayi gun"; gap: 4px 10px; }
  .d-raf-ad { grid-area: ad; }
  .d-raf-yuzde { grid-area: yuzde; text-align: right; }
  .d-raf-grafik { grid-area: grafik; }
  .d-raf-sayi { grid-area: sayi; }
  .d-raf-gun { grid-area: gun; text-align: right; }
}

/* ---------- kategori renkleri + tek dokunuş "tamam" ---------- */
/* Satırın sol şeridi kategori rengi; renk yoksa şerit görünmez, düzen kaymaz. */
.d-satir { border-left: 3px solid var(--dal-renk, transparent); padding-left: 10px; }
.d-kutu-satir { border-left-width: 3px; }

.d-tam {
  font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-orta);
  line-height: 1; background: none; cursor: pointer;
  border: 1px solid var(--m-cizgi, #e7e3da); color: var(--m-gri, #57534b);
  padding: 6px 10px; margin-left: 2px;
}
.d-tam:hover { border-color: var(--dal-renk, var(--d-vurgu)); color: var(--dal-renk, var(--d-vurgu)); }
.d-tam-acik { background: var(--dal-renk, var(--d-vurgu)); border-color: var(--dal-renk, var(--d-vurgu)); color: #fff; }

/* kategori renk seçici (hedef ekranı) */
.d-renk-blok { border: 1px solid var(--m-cizgi, #e7e3da); padding: 14px 16px; margin: 22px 0; }
.d-renk-blok .m-gunluk-baslik { margin: 0 0 6px; }
.d-renk-blok .kisisel-aciklama { margin: 0 0 12px; }
.d-renk-satir {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px;
  padding: 8px 0; border-top: 1px dotted var(--m-cizgi, #e7e3da);
  font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-kucuk);
}
.d-renk-satir:first-of-type { border-top: 0; }
.d-renk-ad { display: inline-flex; align-items: center; gap: 8px; min-width: 150px; color: var(--m-murekkep, #1c1b18); }
.d-renk-ad i { width: 12px; height: 12px; display: inline-block; }
.d-renk-palet { display: inline-flex; gap: 5px; }
.d-renk-nokta { width: 20px; height: 20px; border: 1px solid transparent; cursor: pointer; padding: 0; }
.d-renk-nokta:hover { outline: 1px solid var(--m-murekkep, #1c1b18); outline-offset: 1px; }
.d-renk-nokta.secili { box-shadow: inset 0 0 0 2px var(--m-kagit, #fff); border-color: var(--m-murekkep, #1c1b18); }
.d-renk-ozel { display: inline-flex; align-items: center; gap: 6px; color: var(--m-gri, #57534b); }
.d-renk-ozel input[type=color] { width: 34px; height: 22px; padding: 0; border: 1px solid var(--m-cizgi, #e7e3da); background: none; cursor: pointer; }
.d-renk-sifirla {
  background: none; border: 1px solid var(--m-cizgi, #e7e3da); cursor: pointer;
  font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-mini);
  color: var(--m-gri, #57534b); padding: 3px 8px;
}

/* karnedeki kategori şeridi */
.d-kat-serit {
  display: flex; flex-wrap: wrap; gap: 6px 18px; margin-top: 10px;
  font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-kucuk);
  color: var(--m-gri, #57534b);
}
.d-kat-oge { display: inline-flex; align-items: center; gap: 6px; }
.d-kat-oge i { width: 10px; height: 10px; display: inline-block; }
.d-kat-oge b { color: var(--m-murekkep, #1c1b18); font-weight: 600; }

/* dal rafındaki renk noktası */
.d-raf-ad em { width: 9px; height: 9px; display: inline-block; margin-right: 7px; font-style: normal; }

@media (max-width: 800px) {
  .d-renk-ad { min-width: 100%; }
  .d-tam { padding: 6px 8px; }
}

/* hedef satırındaki kategori seçici */
.d-kat-sec { display: inline-flex; align-items: center; gap: 6px; }
.d-kat-sec i { width: 11px; height: 11px; display: inline-block; flex: none; }
.d-kat-sec select {
  font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-kucuk);
  background: var(--m-kagit, #fff); color: var(--m-murekkep, #1c1b18);
  border: 1px solid var(--m-cizgi, #e7e3da); padding: 4px 6px; cursor: pointer; max-width: 150px;
}

/* ---------- karne gezinmesi + yıl tablosu ---------- */
.d-karne-gez { display: inline-flex; gap: 4px; margin-left: 10px; vertical-align: middle; }
.d-karne-gez button {
  font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-mini);
  background: none; border: 1px solid var(--m-cizgi, #e7e3da); color: var(--m-gri, #57534b);
  padding: 2px 8px; cursor: pointer; text-transform: none; letter-spacing: 0;
}
.d-karne-gez button:hover:not(:disabled) { border-color: var(--d-vurgu); color: var(--d-vurgu); }
.d-karne-gez button:disabled { opacity: .3; cursor: default; }
.d-karne-gez .d-karne-bugun { color: var(--d-vurgu); border-color: var(--d-vurgu); }

.d-yil-tablo { margin-top: 16px; border-top: 1px dashed var(--m-cizgi, #e7e3da); padding-top: 12px; }
.d-yil-baslik {
  font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-kucuk);
  text-transform: uppercase; letter-spacing: .06em; color: var(--m-gri, #57534b); margin-bottom: 6px;
}
.d-yil-satir {
  display: grid; grid-template-columns: minmax(74px, 1fr) 64px minmax(96px, 1fr) 1.4fr;
  gap: 12px; align-items: center; width: 100%; text-align: left;
  background: none; border: 0; border-bottom: 1px solid var(--m-cizgi, #e7e3da);
  padding: 7px 4px; cursor: pointer;
  font-family: var(--m-mono, Consolas, monospace); font-size: var(--yz-kucuk);
  color: var(--m-gri, #57534b);
}
.d-yil-satir:hover { background: rgba(224, 112, 31, .07); }
.d-yil-satir.secili { background: rgba(224, 112, 31, .12); }
.d-yil-ay { color: var(--m-murekkep, #1c1b18); }
.d-yil-not b { color: var(--m-murekkep, #1c1b18); font-weight: 600; font-size: var(--yz-orta); }
.d-yil-kat { display: inline-flex; align-items: center; gap: 6px; }
.d-yil-kat i { width: 9px; height: 9px; display: inline-block; flex: none; }

@media (max-width: 800px) {
  .d-yil-satir { grid-template-columns: 1fr auto; grid-template-areas: "ay not" "tam kat"; gap: 3px 10px; }
  .d-yil-ay { grid-area: ay; }
  .d-yil-not { grid-area: not; text-align: right; }
  .d-yil-tam { grid-area: tam; }
  .d-yil-kat { grid-area: kat; justify-content: flex-end; }
  .d-karne-gez { margin-left: 6px; }
}