/* Tınaztepe Vakfı — Burs Başvuru Sistemi
   Tasarım dili: kurumsal güven. Vakfın mevcut kimliği açık mavi/beyaz; onu koyulaştırıp
   okunabilirlik ve ciddiyet ekledik. Tek dosya, bağımlılık yok. */

:root {
  --lacivert: #1b1b6b;
  --lacivert-700: #303090;
  --mavi: #0057a7;
  --mavi-acik: #eaeaf8;

  --metin: #16212e;
  --metin-2: #4a5a6d;
  /* En açık gri SÜS DEĞİL: ipucu, adım, belge notu, kontenjan alt satırı gibi işlevsel
     yönerge metnini taşır. Eski #7b8899 beyazda 3.61:1 kalıyordu (WCAG AA eşiği 4.5:1).
     #616b78 aynı mavi-gri tonda ama koyu: beyaz 5.41:1 · --zemin 5.07:1 ·
     --mavi-acik 4.54:1 · --amber-bg 4.92:1 — metin-3'ün oturduğu HER zemin eşiği geçiyor.
     Hiyerarşi korunur: metin 16.26:1 > metin-2 7.06:1 > metin-3 5.41:1 (beyaz üzerinde). */
  --metin-3: #616b78;
  --cizgi: #dfe5ec;
  --zemin: #f5f8fb;
  --kart: #ffffff;

  --yesil: #17734d;
  --yesil-bg: #e6f4ee;
  --kirmizi: #b3261e;
  --kirmizi-bg: #fceceb;
  --amber: #8a5a00;
  --amber-bg: #fdf3e2;

  /* Küçük-metin ölçeği (E turu, 17.08.2026): 0.72–0.95 bandında 13 ayrı değer vardı,
     rozet ailesi tek başına 5 boydaydı. Üç basamak: ince (rozet/etiket), kucuk (meta/ipucu),
     govde-2 (ikincil gövde: filtre, kontrol, sayaç). .95rem ayrıca durur (.btn ile eş). */
  --yazi-ince: .78rem;
  --yazi-kucuk: .85rem;
  --yazi-govde2: .9rem;
  --r: 10px;
  /* İkincil yarıçap ailesi (düğme, girdi, küçük yüzeyler) — bilinçli ayrım. */
  --r-kucuk: 8px;
  --golge: 0 1px 2px rgba(13,43,78,.06), 0 4px 16px rgba(13,43,78,.06);
  --olcu: 68rem;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
  font-size: 16px;
  line-height: 1.6;
  color: var(--metin);
  background: var(--zemin);
  /* Sarma politikasının (1) numaralı parçası — gerekçesi aşağıdaki blokta. */
  overflow-wrap: break-word;
}
h1, h2, h3 { line-height: 1.25; text-wrap: balance; margin: 0 0 .5rem; color: var(--lacivert); }
h1 { font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.3rem); letter-spacing: -.02em; }
h2 { font-size: clamp(1.25rem, 1.05rem + .8vw, 1.6rem); letter-spacing: -.01em; }
h3 { font-size: 1.08rem; }
p { margin: 0 0 1rem; }
a { color: var(--mavi); }

/* ── Metin sarma ve taşma politikası ──────────────────────────────────────────
   Sunucu 120 karakter ad, 140 karakter okul adı, 500 karakter adres kabul ediyor ve
   bu alanlarda BOŞLUK ZORUNLU DEĞİL. Boşluksuz uzun bir dizi (yapıştırılmış bağlantı,
   dosya adı, tek parça yazılmış kurum adı) sarma kuralı yokken kırılamaz sayılır ve
   kabından taşar. Politika iki parçadır ve İKİSİ DE gerekir:

   (1) SARMA — `break-word` gövdeye konur, kalıtımla her yüzeye iner (tek kural, tek yer).
       Kırma yalnız kelime tek başına satıra sığmadığında devreye girer; normal Türkçe
       metin önce boşluktan sarar, okunabilirlik bozulmaz.
       `anywhere` gövdeye KONMAZ: o, kutuların en-küçük içerik boyunu da 1 karaktere
       indirir; düğme/rozet gibi boyutu içeriğinden gelen öğeler harf harf sarmaya başlar.

   (2) BOYUT — sarma tek başına yetmez. Izgara/esnek kutuların otomatik en-küçük boyu
       (min-width:auto) öğeyi İÇERİĞİNİN en-küçük boyuna kilitler; kırılamaz 120
       karakterlik dizi kabı ne kadar dar olursa olsun kutuyu şişirir ve sayfayı yatay
       kaydırır. Bu yüzden kullanıcı verisi taşıyan öğelerde otomatik en-küçük boy
       kapatılır: esnek/ızgara öğesinde min-width:0, ızgara izinde minmax(0,1fr).
       ⚠️ Yeni bir 1fr izi yazarken minmax(0,1fr) yaz: çıplak `1fr` = minmax(auto,1fr)
       demektir ve auto burada "içeriğin en-küçük boyu"dur.

   Tablo hücresi tek istisnadır: otomatik tablo düzeninde sütun genişliği hücrenin
   en-küçük boyundan hesaplanır ve orada min-width:0 diye bir kaldıraç yoktur — hücrede
   `anywhere` şart. Atomik hücreler (takip no, tarih, rozet) zaten white-space:nowrap
   ile korunduğu için tarih/numara ortadan bölünmez. */

/* (2) — kullanıcı verisi basan esnek/ızgara öğelerinde otomatik en-küçük boy kapalı.
   .detay-satir > *  : ad/okul/adres değeri · .kart-baslik h1 : başlıktaki başvuran adı
   .belge*           : belge adı + dosya adı · .kuyruk/.secim/.hesap : ad ve serbest not */
.detay-satir > *,
.kart-baslik h1, .kart-baslik h2, .kart-baslik h3,
.belge, .belge > div, .belge > span, .belge-ust > div, .satir-form,
.kuyruk-ust > div, .secim-uye, .hesap-ad { min-width: 0; }

td { overflow-wrap: anywhere; }

/* ── Kabuk ── */
.ust {
  background: var(--lacivert);
  color: #fff;
  border-bottom: 3px solid var(--mavi); /* eski --altin tokeni kaldırıldı: değeri --mavi ile birebir aynıydı, ad yalan söylüyordu */
}
.ust-ic {
  max-width: var(--olcu); margin: 0 auto; padding: 1rem 1.25rem;
  display: flex; align-items: center; gap: 1rem; flex-wrap: wrap;
}
.marka { display: flex; align-items: center; gap: .85rem; text-decoration: none; color: #fff; }
.marka-logo { height: 42px; width: auto; display: block; }
.marka-ayrac { width: 1px; height: 28px; background: rgba(255,255,255,.28); display: block; }
.marka-ad { font-weight: 700; font-size: 1.05rem; letter-spacing: -.01em; }
.marka-alt { font-size: var(--yazi-kucuk); opacity: .85; display: block; font-weight: 500; letter-spacing: .01em; }
/* ⚠️ SIRA ÖNEMLİ (denetim 2026-08-17): bu blok, .marka-alt temel kuralından SONRA gelmek
   ZORUNDA. Eskiden temel kural bloğun ALTINDAYDI; medya sorgusu özgüllük eklemediği için
   aynı özgüllükteki iki kuraldan kaynakta sonra gelen kazanır ve `display:none` sessizce
   eziliyordu — dar ekranda gizlenmesi istenen alt yazı hiç gizlenmiyordu. */
@media (max-width: 560px) {
  .marka-logo { height: 34px; }
  .marka-ayrac { display: none; }
  .marka-alt { display: none; }
}
.ust-sag { margin-left: auto; display: flex; gap: .75rem; align-items: center; font-size: var(--yazi-govde2); }
/* .25rem dikey dolgu: bağlantı yüksekliği 23px → ~31px (WCAG 2.5.8 24px tabanının üstü).
   Dokunmatikte pointer:coarse bloğu ayrıca 44px'e çeker. */
.ust-sag a { color: #cfe0f2; text-decoration: none; padding: .25rem 0; display: inline-block; }
.ust-sag a:hover { color: #fff; text-decoration: underline; }

.kap { max-width: var(--olcu); margin: 0 auto; padding: 1.75rem 1.25rem 4rem; }
.kap-dar { max-width: 46rem; }

.alt {
  border-top: 1px solid var(--cizgi); background: var(--kart);
  padding: 1.5rem 1.25rem; margin-top: 3rem;
  color: var(--metin-3); font-size: var(--yazi-kucuk);
}
.alt-ic { max-width: var(--olcu); margin: 0 auto; display: flex; gap: 1rem; flex-wrap: wrap; }
.alt a { color: var(--metin-2); }

/* ── Kart ── */
.kart {
  background: var(--kart); border: 1px solid var(--cizgi); border-radius: var(--r);
  padding: 1.25rem; box-shadow: var(--golge); margin-bottom: 1rem;
}
.kart-baslik { display: flex; align-items: center; gap: .6rem; margin-bottom: 1rem; flex-wrap: wrap; }
/* Kart içinde başlık ile gövdeyi ince çizgi ayırır — 15 kartlık sayfada bölüm sınırı yalnız
   kart kenarlığından okunuyordu. Satır içi border:0 ezmeleri (ör. Kurul Seçimi alt başlığı)
   bilinçli olarak kuralı geçersiz kılar; print .kart kenarlıklarını zaten sıfırlıyor. */
.kart > .kart-baslik { padding-bottom: .6rem; border-bottom: 1px solid var(--cizgi); }
/* yayik: başlık solda, eylem düğmeleri sağda — 17 satır-içi justify-content bu varyanta indi. */
.kart-baslik.yayik { justify-content: space-between; }
/* h1 boyu (denetim 2026-08-17): 11 ekran başlığı .kart-baslik içinde yaşıyor ve orada
   `.kap > h1:first-of-type` (1.5rem) eşleşmiyordu — h1 küresel clamp'e düşüp geniş ekranda
   36.8px'e çıkıyordu; ekrandan ekrana BEŞ farklı başlık boyu vardı. Tek kural hepsini
   .kap kuralıyla aynı boya (1.5rem) getirir; JSX'lerdeki style="margin:0" artık gereksiz
   ama zararsız (ayrı temizlik turu). */
.kart-baslik h1 { margin: 0; font-size: 1.5rem; }
.kart-baslik h2, .kart-baslik h3 { margin: 0; }

/* ── Hero ── */
.hero {
  background: linear-gradient(160deg, #1b1b6b 0%, #303090 55%, #0057a7 100%);
  color: #fff; border-radius: var(--r); padding: 2.5rem 2rem; margin-bottom: 1.75rem;
}
.hero h1 { color: #fff; margin-bottom: .75rem; }
.hero p { color: #d6e4f2; max-width: 46rem; margin-bottom: 1.5rem; }
.hero-rozet {
  display: inline-block; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
  padding: .3rem .75rem; border-radius: 999px; font-size: var(--yazi-kucuk); margin-bottom: 1rem;
}

/* ── Buton ── */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  padding: .7rem 1.3rem; border-radius: var(--r-kucuk); border: 1px solid transparent;
  font: inherit; font-weight: 600; font-size: .95rem; cursor: pointer; text-decoration: none;
  /* Sabit satır yüksekliği (10.09): `font: inherit` line-height'i de miras aldığı için AYNI
     sınıfa sahip <button> ile <a> 3px farklı yükseklik alıyordu (ölçüldü: "Filtrele" 40px,
     komşu bağlantı düğmeleri 37px). Tek değer, her düğme aynı formülle çizilir. */
  line-height: 1.25;
  transition: background .15s, border-color .15s;
}
.btn-ana { background: var(--mavi); color: #fff; }
.btn-ana:hover { background: #004a90; }
.btn-beyaz { background: #fff; color: var(--lacivert); }
.btn-beyaz:hover { background: #f0f5fa; }
.btn-cizgi { background: #fff; color: var(--lacivert); border-color: var(--cizgi); }
.btn-cizgi:hover { border-color: var(--mavi); color: var(--mavi); }
.btn-kucuk { padding: .4rem .8rem; font-size: var(--yazi-kucuk); }
/* ── Devre dışı düğme (denetim 2026-08-17) ──
   Bu seçici HİÇ YOKTU. .btn-ana rengi yazar kaynağında sabitlendiği için tarayıcının
   kendi "disabled = gri" kuralını (UA kaynağı) her zaman yeniyordu: kapalı dönemde
   başvuran, tam mavi ve tıklanabilir GÖRÜNEN bir "Başvuruyu Gönder" düğmesi görüyordu.
   Renkler ölçülü: #5c6672 / #e3e8ee = 4.6:1 (WCAG AA 4.5 eşiğinin üstü) — devre dışı
   metin için kontrast şartı aranmaz ama etiket yine de okunmalı. */
.btn:disabled, .btn[disabled] {
  background: #e3e8ee; color: #5c6672; border-color: #cbd4de;
  cursor: not-allowed; box-shadow: none;
}
.btn:disabled:hover, .btn[disabled]:hover { background: #e3e8ee; border-color: #cbd4de; color: #5c6672; }
/* ── Tehlike düğmesi (denetim 2026-08-17) ──
   Geri alınamaz eylem için üçüncü bir biçim YOKTU: "Kalıcı Olarak Sil" ile "Filtrele"
   aynı görünüyordu. Kural: bu sınıf YALNIZ geri alınamaz eyleme takılır (kalıcı silme,
   imha, hesap silme) — sık kullanılırsa anlamı aşınır ve yeniden görünmez olur.
   Kontrast: #fff / #b3261e = 6.6:1. */
.btn-tehlike { background: var(--kirmizi); color: #fff; border-color: transparent; }
.btn-tehlike:hover { background: #8f1e17; }
/* Çerçeveli tehlike: aynı ekranda İKİ geri-alınamaz eylem varsa (seçilenleri imha et /
   tümünü imha et) ikisi de kırmızı aileden kalır ama hiyerarşi korunur — iki dolu kırmızı
   yan yana hangisinin birincil olduğunu söyleyemezdi. */
.btn-tehlike-cizgi { background: #fff; color: var(--kirmizi); border-color: var(--kirmizi); }
.btn-tehlike-cizgi:hover { background: var(--kirmizi-bg); }
/* WCAG 1.4.11 (denetim 2026-08-16): #7fb2e0 beyazda 2.25:1 idi — 3:1 eşiğinin altı.
   Varsayılan halka koyu (lacivert, beyazda 14.8:1); koyu şeritlerde (üst bar, panel menüsü,
   hero) açık renk KAPSAM ile geri verilir (lacivertte 6.6:1). */
.btn:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid var(--lacivert); outline-offset: 2px;
}
.ust :focus-visible, .yan-menu :focus-visible, .hero :focus-visible {
  outline-color: #7fb2e0;
}
.btn-sira { display: flex; gap: .75rem; flex-wrap: wrap; }
/* ── PANELDE TEK DÜĞME BOYU (10.09.2026) ────────────────────────────────────────────────
   Ölçüm: panel ekranlarında 27 düğme 36px iken form gönderme düğmeleri (btn-ana, örn.
   "Filtrele" · "Kararı Kaydet") 42px duruyordu; aynı kartta iki boy yan yana gelince
   hiyerarşi değil dağınıklık okunuyordu. Panelde boy TEK, hiyerarşi RENKLE: btn-ana mavi
   (birincil), btn-cizgi beyaz (ikincil), btn-tehlike-cizgi kırmızı (geri dönüşsüz).
   ⚠️ Kural YALNIZ panel kabuğunda (.panel-duzen) geçerli: başvuru yüzündeki büyük çağrı
      düğmeleri ("Başvuru Yap", adım "Devam Et") o kabukta yaşar ve boyunu korur.
   ⚠️ Dokunma hedefi: mobilde .btn min-height 44px (aşağıdaki mobil blok) — küçültme
      erişilebilirlik eşiğini düşürmüyor. */
.panel-duzen .btn { padding: .4rem .8rem; font-size: var(--yazi-kucuk); }

/* ── Form ── */
.alan { margin-bottom: 1.15rem; }
.alan > label, .alan-baslik {
  display: block; font-weight: 600; font-size: var(--yazi-govde2); color: var(--metin); margin-bottom: .35rem;
}
/* ── İpucu / yardım metni (denetim 2026-08-17: kapsam genelleştirildi) ──
   Eski tek tanım `.alan .ipucu` idi: sınıf YALNIZ form alanı içindeyken çalışıyordu.
   Panelde <p class="ipucu"> 41 yerde form DIŞINDA kullanılıyordu (ekran giriş cümleleri)
   ve o paragraflar hiçbir stil almıyordu — aynı cümle bir ekranda küçük gri, diğerinde
   normal boy siyah çıkıyordu. Taban kural artık genel; alan-içi pay ayrı satırda. */
.ipucu { display: block; font-weight: 400; font-size: var(--yazi-kucuk); color: var(--metin-3); }
.alan .ipucu { margin-top: .15rem; }
.zorunlu { color: var(--kirmizi); font-weight: 700; }
input[type=text], input[type=tel], input[type=email], input[type=number], input[type=date],
input[type=password], select, textarea {
  width: 100%; padding: .6rem .7rem; font: inherit; font-size: .95rem;
  border: 1px solid #75818f; /* WCAG 1.4.11: eski #c5cfdb 1.58:1 idi; girdinin tek siniri bu kenarlik */ border-radius: var(--r-kucuk); background: #fff; color: var(--metin);
}
input:focus, select:focus, textarea:focus { border-color: var(--mavi); }
textarea { min-height: 5.5rem; resize: vertical; }
/* Dosya girdisi tarayıcıdan ~258px İÇSEL genişlikle gelir; 375px telefonda kartın içine
   sığmayıp satırı yatay taşırıyordu. min-width:0 esnek satırda küçülmesine izin verir,
   max-width kabından taşmasını keser. Genişlik verilmez — dosya adı kadar yer kaplar. */
input[type=file] { min-width: 0; max-width: 100%; }
/* ── Yer tutucu kontrastı (denetim 2026-08-17) ──
   Hiç kural yoktu; tarayıcı varsayılanı beyazda 2.35:1 (eski WebKit #a9a9a9) ile 3.63:1
   (yeni Chrome/Firefox currentColor %54) arasında — AA eşiği 4.5:1'in altı. --metin-3
   beyazda 5.41:1 (ölçümü :root bloğunda). `opacity:1` ŞART: Firefox yer tutucuya
   varsayılan %54 saydamlık uygular, renk verilse bile onsuz soldurur. */
::placeholder { color: var(--metin-3); opacity: 1; }
.izgara { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 0 1rem; }
.izgara-3 { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 0 1rem; }
.tam { grid-column: 1 / -1; }
@media (max-width: 640px) { .izgara, .izgara-3 { grid-template-columns: minmax(0,1fr); } }

.secim { display: flex; gap: 1.25rem; flex-wrap: wrap; padding-top: .2rem; }
.secim label { display: inline-flex; align-items: center; gap: .4rem; font-weight: 400; font-size: .95rem; cursor: pointer; }
.secim input { width: auto; margin: 0; }

.onay {
  display: flex; gap: .65rem; align-items: flex-start;
  background: var(--mavi-acik); border: 1px solid #cfe0f2; border-radius: var(--r-kucuk); padding: .9rem 1rem;
  margin-bottom: .85rem;
}
.onay input { width: auto; margin-top: .25rem; flex-shrink: 0; }
.onay label { font-weight: 400; font-size: var(--yazi-govde2); line-height: 1.5; }

/* ── Adım göstergesi ── */
.adimlar { display: flex; gap: .35rem; margin-bottom: 1.5rem; flex-wrap: wrap; }
.adim {
  flex: 1 1 5.5rem; min-width: 5.5rem; padding: .5rem .6rem; border-radius: 6px;
  background: var(--kart); border: 1px solid var(--cizgi); font-size: var(--yazi-ince); color: var(--metin-3);
  text-decoration: none; text-align: center;
}
.adim-no { display: block; font-weight: 700; font-size: .95rem; color: var(--metin-3); }
.adim.aktif { background: var(--lacivert); border-color: var(--lacivert); color: #fff; }
.adim.aktif .adim-no { color: #fff; }
.adim.tamam { border-color: #a8cfae; background: var(--yesil-bg); color: var(--yesil); }
.adim.tamam .adim-no { color: var(--yesil); }

/* ── Rozet / durum ── */
.rozet {
  display: inline-flex; align-items: center; gap: .3rem; padding: .2rem .55rem;
  border-radius: 999px; font-size: var(--yazi-ince); font-weight: 600; white-space: nowrap;
}
.rozet-gri { background: #eef2f6; color: var(--metin-2); }
.rozet-mavi { background: var(--mavi-acik); color: var(--mavi); }
.rozet-yesil { background: var(--yesil-bg); color: var(--yesil); }
.rozet-kirmizi { background: var(--kirmizi-bg); color: var(--kirmizi); }
.rozet-amber { background: var(--amber-bg); color: var(--amber); }
/* RED = nihai olumsuz karar — TASLAK grisinden ve EKSIK_BELGE kirmizisindan ayrışır (karar 16.08) */
.rozet-koyu { background: var(--metin-2); color: #fff; }

/* ── Uyarı kutuları ── */
.kutu { border-radius: var(--r-kucuk); padding: .9rem 1.1rem; margin-bottom: 1.25rem; font-size: var(--yazi-govde2); }
.kutu-bilgi { background: var(--mavi-acik); border-left: 4px solid var(--mavi); }
.kutu-uyari { background: var(--amber-bg); border-left: 4px solid var(--amber); }
.kutu-basari { background: var(--yesil-bg); border-left: 4px solid var(--yesil); }
.kutu-hata { background: var(--kirmizi-bg); border-left: 4px solid var(--kirmizi); }
.kutu p:last-child { margin-bottom: 0; }
.kutu strong { color: inherit; }

/* ── Duyuru kutusu (10.09.2026, vakıf: "vurgulama için renklendirme ve çerçeve yapılabilir") ──
   Kardeş .kutu-* varyantlarından AYRI TUTULDU: onlar sol kenarlıklı DURUM kutularıdır (dönem açık/kapalı,
   hata, bilgi) ve sayfada birden çok kez geçer; bu ise vakfın İLAN METNİNİ taşıyan tek, tam çerçeveli blok.
   Başlık şeridi kutunun kendi çerçeve rengini taşır ki uzun sayfada tek bakışta ayrışsın. Kontrast:
   --lacivert zemin üstünde beyaz 13.6:1, --mavi-acik zemin üstünde gövde metni 4.54:1 (dosya başı notu). */
.kutu-duyuru { background: var(--mavi-acik); border: 2px solid var(--lacivert); border-radius: var(--r-kucuk);
  margin-bottom: 1.25rem; overflow: hidden; }
.kutu-duyuru-baslik { background: var(--lacivert); color: #fff; font-weight: 700; letter-spacing: .08em;
  padding: .5rem 1.1rem; font-size: var(--yazi-govde2); }
.kutu-duyuru-govde { padding: .9rem 1.1rem; font-size: var(--yazi-govde2); }
.kutu-duyuru-govde p { margin-bottom: .6rem; }
.kutu-duyuru-govde p:last-child { margin-bottom: 0; }
.kutu-duyuru-govde ul { margin: .2rem 0 .6rem 1.2rem; padding: 0; }
.kutu-duyuru-govde li { margin-bottom: .25rem; }

/* ── Liste işlem sütunu (10.09.2026) ────────────────────────────────────────────────────
   Eylem düğmeleri eskiden DURUM rozetinin hücresine giriyordu; düğme kimi satırda çizilip
   kimi satırda çizilmediği için sütun genişliği satır satır oynuyor ve tablo hizasız
   görünüyordu (vakıf geri bildirimi: "çok kötü duruyor"). Eylemler kendi sütununa alındı:
   genişlik SABİT, düğmeler yan yana ve aynı boyda; düğmesi olmayan satırda hücre boş kalır,
   hiza bozulmaz. Dar ekranda tablo zaten .tablo-sar içinde yatay kayar. */
/* İki eylem ALT ALTA (10.09 ikinci tur): yan yana düzen sütuna 241px yedirip AD SOYAD
   sütununu 92px'e düşürüyordu ve isimler bölünüyordu. Dikey düzende sütun 7.6rem, düğmeler
   tam genişlik: hem eşit boy (simetri) hem yer kazancı — satır yüksekliği zaten temas/oy
   meta satırlarıyla dolu olduğu için ikinci düğme satırı bedelsiz. */
.islem-hucre { width: 7.6rem; white-space: nowrap; }
.islem-hucre .btn-sira { flex-direction: column; gap: .3rem; flex-wrap: nowrap; align-items: stretch; }
.islem-hucre form { display: inline; margin: 0; }
/* Yan yana iki eylem AYNI genişlikte: ölçüldü, "İşleme Al" 84px iken "Uygun Değil" 104px
   duruyordu ve satır satır kayan iki düğme tabloyu dağıtıyordu (vakıf: "uyumsuz duruyor").
   Genişlik en uzun etikete göre sabitlendi; metin değişirse düğmeler birlikte büyür. */
.islem-hucre .btn { width: 100%; min-width: 0; }

/* ── Tablo ── */
.tablo-sar { overflow-x: auto; border: 1px solid var(--cizgi); border-radius: var(--r); background: var(--kart); }
table { width: 100%; border-collapse: collapse; font-size: var(--yazi-govde2); }
th, td { padding: .55rem .75rem; text-align: left; border-bottom: 1px solid var(--cizgi); vertical-align: middle; }
/* Satır yüksekliği ~34px→~38px: liste ekranları 55+ yaş görevliler için sıkıydı. */
td { padding-top: .7rem; padding-bottom: .7rem; }
th {
  background: #f7f9fc; font-size: var(--yazi-ince); text-transform: uppercase; letter-spacing: .04em;
  color: var(--metin-2); font-weight: 600; white-space: nowrap;
  box-shadow: inset 0 -1px 0 var(--cizgi);
  /* `position: sticky` KALDIRILDI (denetim 2026-08-17): 25 tablonun 25'i .tablo-sar
     içinde ve sarıcının `overflow-x: auto`su yapışma bağlamını sarıcıya çeker — başlık
     hiçbir tabloda hiçbir zaman yapışmıyordu, kural ölüydü. Ölü kuralın maliyeti yalan
     vaat: birisi "başlık yapışsın" diye buraya bakar, kuralı görür, çalıştığını sanır. */
}
tbody tr:nth-child(even) { background: var(--zemin); }
tbody tr:last-child td { border-bottom: none; }
tbody tr:hover { background: #f4f8fd; }
/* ── Bildirim defteri sütunları (denetim 2026-08-17) ──
   İki satır içi stil sınıfa taşındı ki dar ekranda gevşetilebilsinler: masaüstünde alıcı
   adresi tek satır kalır (defter taranır, okunmaz) ve özet sütununa 18rem taban verilir;
   dar ekranda İKİSİ DE bırakılır — ölçüldü: 8 sütunlu defter 374px'te 1253px'e çıkıyor,
   görünen alanın 3.76 KATI yatay kaydırma istiyordu. Tek başına gerçekçi bir üniversite
   e-postası 366px sütun yapıyordu. */
.defter-alici { white-space: nowrap; }
.defter-ozet { min-width: 18rem; }
@media (max-width: 48rem) {
  .defter-alici { white-space: normal; overflow-wrap: anywhere; }
  .defter-ozet { min-width: 0; }
}

/* ── DAR EKRANDA SÜTUN DAĞILIMI (denetim 2026-08-17) ──
   `th { nowrap }` + `td { overflow-wrap:anywhere }` ikilisi, tablo kaba sığmadığında
   genişliği TERS dağıtıyordu: "Toplam başvuru" başlığı tek haneli bir sayı için 135px
   alırken öğrencinin adı 86px'e sıkışıp beş satıra bölünüyordu — uzun başlıklı sayı
   sütunu şişiyor, kısa başlıklı metin sütunu eziliyordu. Dar ekranda başlık sarabilir:
   başlıklar sütunun tabanı olmaktan çıkınca genişlik veriye göre dağılır. */
@media (max-width: 48rem) {
  th { white-space: normal; }
  /* İsim sütunu tabanı: başlık sarması tek başına yetmedi (ölçüldü: ad hâlâ 99px / 6 satır)
     çünkü komşu hücrelerin nowrap içerikleri (takip no, tarih, rozet) kendi tabanlarını
     koyuyor. h-ad yalnız İKİ büyük listenin isim hücresinde (başvuru + kütük) — genel bir
     td:first-child kuralı imha ekranındaki onay-kutusu sütununu da şişirirdi. */
  td.h-ad { min-width: 11rem; }
}
td.sayi { font-variant-numeric: tabular-nums; }
/* ── Tekrar eden satır-içi stillerin sınıf karşılıkları (denetim 2026-08-17, E turu) ──
   299 satır-içi stilin %56'sı 12 desene düşüyordu; en büyükleri buraya taşındı. Yeni ekran
   yazan kişi satır-içi stil KOPYALAMAZ, bu sınıfları kullanır. */
/* Atomik hücre — takip no, tarih, sezon, tutar. Bölünmesi anlamı bozar (bkz. sarma notu).
   49 ayrı <td style="white-space:nowrap"> bu sınıfa indi. */
td.tek, th.tek { white-space: nowrap; }
/* Meta not — küçük gri yardımcı satır (dosya adı altı, imza rolü, kuyruk özeti).
   Dört ayrı sınıf aynı iki satırı tekrarlıyordu; tek kaynak burada. */
.meta-not, .belge-not, .kuyruk-meta, .imza-rol { font-size: var(--yazi-kucuk); color: var(--metin-3); }
/* Ham ayar/kimlik değeri gösterimi (ayarlar anahtarları, sürüm damgası). */
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .92em; }
/* Metnin ARKASINA eklenen rozet (ad yanı, başlık sonu) — iki farklı elle değer (.4/.35) tekleşti. */
.rozet-ek { margin-left: .4rem; }
/* İçeriğin altında duran kutu — üstündeki metinden ayrılır. */
.kutu-alt { margin-top: 1rem; }
/* Liste ekranlarının serbest-metin arama kutusu — üç farklı elle genişlik (14/16/18rem) tekleşti. */
.filtre input.ara { min-width: 16rem; }
/* ── Not akışı (dosya notları, 17.08) — zaman akışı deseni: kim/ne zaman + metin. ── */
.not-akisi { display: flex; flex-direction: column; gap: .6rem; }
.not-satir { border: 1px solid var(--cizgi); border-radius: var(--r-kucuk); padding: .6rem .8rem; background: var(--zemin); }
.not-ust { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; font-size: var(--yazi-kucuk); color: var(--metin-2); }
.not-satir { border-left: 3px solid var(--cizgi); }
.not-satir.randevu { border-left-color: var(--mavi); background: var(--mavi-acik); }
.not-metin { margin: .3rem 0 0; white-space: pre-wrap; font-size: var(--yazi-govde2); }

/* Liste üstü sayaç satırı ("N kayıt · süzgeç...") — 10 ekranda satır-içi yazılıyordu. */
.liste-ust > p { font-size: var(--yazi-govde2); color: var(--metin-2); margin: 0; }
/* "N kayıt · süzgeç…" satırı: değerler renkle ayrışır — bu satır "neden az kayıt görüyorum"
   sorusunun tek cevabı, taramada gözden kaçıyordu. */
.liste-ust > p strong { color: var(--lacivert); }
.satir-link { color: var(--lacivert); font-weight: 600; text-decoration: none; }
.satir-link:hover { color: var(--mavi); text-decoration: underline; }

/* ── Panel — sol dikey menü (docs/PANEL-MIMARI.md §4) ────────────────────────
   Eski yatay şerit (.panel-ust / .panel-menu*) KALDIRILDI: 14 maddelik menü yönetici
   rolünde 6 satıra sarıp ekranın üçte birini yiyordu. Menü 4 madde + YÖNETİM grubuna
   indi ve sola geçti; marka, dönem ve kişi bloğu aynı sütunda toplandı.
   ⚠️ .ust / .marka* / .alt KALDI: onları başvuru (public) kabuğu kullanıyor. */
.panel-duzen {
  display: grid; grid-template-columns: 248px minmax(0, 1fr);
  align-items: start; min-height: 100vh;
}
.yan-menu {
  background: var(--lacivert); color: #fff;
  display: flex; flex-direction: column; gap: .25rem;
  padding: 1.1rem .75rem 1rem;
  /* Uzun listede menü ekranda kalsın; kendi içinde kayar (sayfayı değil kendini). */
  position: sticky; top: 0; height: 100vh; overflow-y: auto;
}
.yan-marka {
  display: flex; flex-direction: column; gap: .1rem;
  color: #fff; text-decoration: none;
  padding: 0 .55rem .85rem; margin-bottom: .35rem;
  border-bottom: 1px solid rgba(255,255,255,.14);
}
.yan-marka img { height: 38px; width: auto; display: block; margin-bottom: .5rem; }
.yan-marka b { font-size: 1rem; font-weight: 700; letter-spacing: -.01em; }
.yan-marka span { font-size: var(--yazi-kucuk); opacity: .72; }

/* Katlama düğmesi — yalnız dar ekranda görünür (aşağıdaki 900px bloğu). */
.yan-ac { display: none; }
.yan-ac > summary {
  list-style: none; cursor: pointer;
  display: flex; align-items: center; min-height: 44px; padding: 0 .65rem;
  border: 1px solid rgba(255,255,255,.28); border-radius: var(--r-kucuk);
  font-size: var(--yazi-govde2); font-weight: 600;
}
.yan-ac > summary::-webkit-details-marker { display: none; }
.yan-ac > summary::after { content: '▾'; margin-left: auto; }
.yan-ac[open] > summary::after { content: '▴'; }

.yan-govde { display: flex; flex-direction: column; flex: 1 1 auto; }
.yan-nav { display: flex; flex-direction: column; gap: .1rem; }
.yan-grup {
  margin: .95rem .65rem .25rem; color: rgba(255,255,255,.6);
  font-size: var(--yazi-ince); font-weight: 700; letter-spacing: .08em; line-height: 1.3;
}
.yan-oge { display: block; text-decoration: none; color: rgba(255,255,255,.85); }
.yan-oge-ic {
  display: flex; align-items: center; min-height: 38px; padding: 0 .65rem;
  border-radius: var(--r-kucuk); font-size: var(--yazi-govde2); font-weight: 500;
}
.yan-oge:hover .yan-oge-ic { background: rgba(255,255,255,.10); color: #fff; }
/* Etkin madde beyaz zeminli, lacivert yazılı (maket kararı 25.08). Renk TEK BAŞINA anlam
   taşımasın diye aria-current da basılıyor (bkz. ui/layout.tsx). */
.yan-oge.aktif { color: var(--lacivert); font-weight: 600; }
.yan-oge.aktif .yan-oge-ic { background: #fff; }

/* Kişi bloğu menünün EN ALTINDA (margin-top:auto) — günlük iş yukarıda kalsın. */
.yan-kisi {
  margin-top: auto; padding: .8rem .65rem 0;
  border-top: 1px solid rgba(255,255,255,.14);
  display: flex; align-items: center; gap: .7rem; flex-wrap: wrap;
  font-size: var(--yazi-kucuk);
}
.yan-kisi > div { flex: 1 1 100%; opacity: .85; }
.yan-kisi a { color: #cfe0f2; text-decoration: none; padding: .25rem 0; display: inline-block; }
.yan-kisi a:hover { color: #fff; text-decoration: underline; }

/* İçerik başlık satırı — şimdilik tek konuğu Rehber yardım bağlantısı (plan §7). */
.icerik-ust { display: flex; justify-content: flex-end; margin-bottom: .4rem; }

/* ── DAR EKRAN: menü üste iner ve JS'SİZ katlanır ───────────────────────────
   Katlanan gövde <details>'in İÇİNDE DEĞİL kardeşi: kapalı bir details'in içeriğini
   geniş ekranda CSS ile geri açmak güvenilir değil, kullanıcı menüyü dar ekranda
   kapatıp pencereyi büyütünce menüsüz kalırdı. Kardeş kuralı yalnız bu blokta
   yaşadığı için geniş ekranda gövde her hâlükârda görünür. */
@media (max-width: 900px) {
  .panel-duzen { display: block; }
  .yan-menu { position: static; height: auto; overflow: visible; padding-bottom: .85rem; }
  .yan-marka { padding-bottom: .7rem; }
  .yan-ac { display: block; }
  .yan-govde { display: none; }
  .yan-ac[open] ~ .yan-govde { display: flex; }
  /* Dokunma hedefi: dar ekran fiilen tablet/telefon demek. */
  .yan-oge-ic { min-height: 44px; }
  .yan-kisi a { min-height: 44px; display: inline-flex; align-items: center; }
}

/* Dağılım çubuğu — raporlarda grafik kütüphanesi yok, oran genişlikle veriliyor.
   Sunucuda render edilir; JavaScript kapalıyken de doğru okunur. */
.dagilim { display: grid; gap: .55rem; }
.dagilim-satir { display: grid; grid-template-columns: 11rem minmax(0,1fr) 4.5rem; gap: .75rem; align-items: center; }
.dagilim-ad { font-size: var(--yazi-govde2); color: var(--metin-2); }
.dagilim-cubuk { background: var(--mavi-acik); border-radius: 999px; height: .7rem; overflow: hidden; }
.dagilim-dolgu { display: block; height: 100%; background: var(--lacivert-700); border-radius: 999px; }
.dagilim-deger { font-variant-numeric: tabular-nums; font-weight: 600; text-align: right; }
@media (max-width: 40rem) {
  .dagilim-satir { grid-template-columns: minmax(0,1fr) 3.5rem; }
  .dagilim-cubuk { grid-column: 1 / -1; }
}

/* Puan rozetleri — komisyon değerlendirmesi. */
.puan-serit { display: flex; gap: .4rem; flex-wrap: wrap; align-items: center; }
.puan {
  /* 999px: kapsül ailesiyle (rozet/cip/rol-rozet) aynı geometri — aynı satırda iki farklı
     köşe yarıçapı görünüyordu. --r yalnız kart/tablo/kutu yüzeylerinde kalır. */
  background: var(--mavi-acik); color: var(--lacivert); border-radius: 999px;
  padding: .3rem .6rem; font-size: var(--yazi-kucuk);
}
.puan b { font-variant-numeric: tabular-nums; }
.puan-toplam { background: var(--lacivert); color: #fff; font-weight: 600; }

/* ── Kurul kontenjan şeridi ──
   Üyeler kontenjanı kendi aralarında paylaşıyor; kimin kaç seçtiğini görmeden bunu yapamazlar.
   Şerit dosya detayında ve liste üstünde AYNI bileşenle görünür. */
.kontenjan-serit {
  display: flex; gap: .4rem; flex-wrap: wrap; align-items: stretch;
  background: var(--kart); border: 1px solid var(--cizgi); border-radius: var(--r);
  padding: .55rem; margin-bottom: 1rem;
}
.kontenjan-uye {
  flex: 1 1 7.5rem; min-width: 7.5rem; padding: .4rem .6rem;
  border-radius: var(--r-kucuk); background: var(--zemin); border: 1px solid transparent;
}
.kontenjan-uye.ben { border-color: var(--mavi); background: var(--mavi-acik); }
.kontenjan-uye.asim { border-color: var(--amber); background: var(--amber-bg); }
.kontenjan-ad { font-size: var(--yazi-kucuk); color: var(--metin-2); display: block; margin-bottom: .15rem; }
.kontenjan-sayi { font-size: 1.05rem; font-weight: 700; color: var(--lacivert); font-variant-numeric: tabular-nums; }
.kontenjan-alt { font-size: var(--yazi-kucuk); color: var(--metin-3); }

/* ── Kurul seçim kartı ── */
/* Tek sütun açıkça kapatılır — .belge-liste ile aynı gerekçe: örtük `auto` iz, satırın
   en-küçük boyuna (uzun üye adı / serbest not) büyüyüp kabından taşabiliyor. */
.secim-liste { display: grid; grid-template-columns: minmax(0,1fr); gap: .5rem; }
.secim-satir {
  display: flex; gap: .6rem; align-items: baseline; flex-wrap: wrap;
  padding: .6rem .75rem; border-radius: var(--r-kucuk); background: var(--zemin);
  border-left: 3px solid var(--cizgi);
}
.secim-satir.evet { border-left-color: var(--yesil); background: var(--yesil-bg); }
.secim-satir.hayir { border-left-color: var(--kirmizi); background: var(--kirmizi-bg); }
.secim-satir.bos { opacity: .7; }
.secim-uye { font-weight: 600; color: var(--metin); }
.secim-not { flex: 1 1 100%; font-size: var(--yazi-govde2); color: var(--metin-2); margin: .2rem 0 0; }

/* ── Hızlı erişim çipleri — "eksik belgesi olanlar", "karar bekleyenler" gibi ──
   Dikey ritim (C turu, 2026-08-29): başvuru listesinin üç katmanı iki kurala oturur —
   BLOKLAR arası 1.1rem (görünüm şeridi · kontenjan · filtre kartı altı), BİRBİRİNE BAĞLI
   çiftler arası .5rem (ana şerit→görünüm şeridi, çip şeridi→filtre kartı). Çip şeridi bu
   yüzden .5rem'le hemen altındaki filtre kartına yaslanır: ikisi tek "süzgeç bölgesi"dir. */
/* ── SÜREÇ ŞERİDİ (05.09, panel/surec-seridi.tsx) — dört aşama; 900px altında 2, 560px altında 1 sütun. */
.surec {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .5rem;
  list-style: none; margin: 0 0 .5rem; padding: 0;
}
.surec-adim {
  display: flex; gap: .6rem; min-width: 0;
  background: var(--kart); border: 1px solid var(--cizgi); border-radius: var(--r); padding: .6rem .7rem;
}
.surec-adim.aktif { border-color: var(--lacivert); box-shadow: inset 3px 0 0 var(--lacivert); }
.surec-no {
  flex: none; width: 1.5rem; height: 1.5rem; border-radius: 50%;
  background: var(--lacivert); color: #fff; font-size: var(--yazi-kucuk); font-weight: 700;
  display: inline-flex; align-items: center; justify-content: center; font-variant-numeric: tabular-nums;
}
.surec-govde { display: flex; flex-direction: column; gap: .15rem; min-width: 0; }
.surec-ad { font-weight: 600; color: var(--lacivert); font-size: var(--yazi-govde2); font-variant-numeric: tabular-nums; }
.surec-ad a { color: inherit; text-decoration: none; border-bottom: 1px solid var(--mavi); }
.surec-ad a:hover { color: var(--mavi); }
.surec-kim { font-size: var(--yazi-kucuk); color: var(--metin-2); }
.surec-ne { font-size: var(--yazi-kucuk); color: var(--metin-3); }
@media (max-width: 900px) { .surec { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .surec { grid-template-columns: minmax(0, 1fr); } }

.hizli-erisim {
  display: flex; gap: .45rem; flex-wrap: wrap;
  background: var(--kart); border: 1px solid var(--cizgi); border-radius: var(--r);
  padding: .6rem .7rem; margin-bottom: .5rem;
}
.cip {
  display: inline-flex; align-items: center; gap: .35rem;
  padding: .4rem .7rem; border-radius: 999px; text-decoration: none;
  background: var(--kart); border: 1px solid var(--cizgi); color: var(--metin-2);
  font-size: var(--yazi-kucuk); white-space: nowrap;
}
.cip:hover { border-color: var(--mavi); color: var(--lacivert); }
.cip.aktif { background: var(--lacivert); border-color: var(--lacivert); color: #fff; }
.cip b { font-variant-numeric: tabular-nums; }
.cip-uyari { border-color: #e8c07a; background: var(--amber-bg); color: var(--amber); }

/* ── Geliştirme modu şeridi — açık olduğu GİZLENMEZ ── */
.gelistirme-serit {
  background: var(--kirmizi); color: #fff; text-align: center;
  padding: .45rem 1rem; font-size: var(--yazi-kucuk); font-weight: 600;
  position: sticky; top: 0; z-index: 50;
}
.gelistirme-serit a { color: #fff; text-decoration: underline; }

/* ── Kullanıcı yönetimi ── */
.rol-rozet {
  display: inline-block; padding: .15rem .5rem; border-radius: 999px;
  font-size: var(--yazi-ince); font-weight: 600;
}
.rol-yonetici { background: var(--lacivert); color: #fff; }
.rol-idari { background: var(--mavi-acik); color: var(--lacivert); }
.rol-komisyon { background: var(--yesil-bg); color: var(--yesil); }

/* (Yatay panel menüsünün yapışkanlık kuralları kaldırıldı: menü sola geçti, yapışkanlık
   artık .yan-menu'nün kendi kuralında — 2026-08-25.) */

/* Rol etiketi — görevli hangi yetkiyle baktığını her ekranda görsün. */
.rol-etiket {
  margin-left: .45rem; padding: .1rem .45rem; border-radius: 999px;
  background: rgba(255,255,255,.16); font-size: var(--yazi-ince); letter-spacing: .01em;
}
.filtre .btn-sira { margin-left: auto; }
.filtre {
  display: flex; gap: .55rem; flex-wrap: wrap; align-items: flex-end;
  background: var(--kart); border: 1px solid var(--cizgi); border-radius: var(--r);
  padding: .75rem .85rem; margin-bottom: 1.1rem;
}
.filtre .alan label { font-size: var(--yazi-kucuk); color: var(--metin-3); margin-bottom: .15rem; }
.filtre input, .filtre select { padding: .45rem .6rem; font-size: var(--yazi-govde2); min-width: 9rem; }
/* .filtre .btn padding KALDIRILDI (10.09): panelin tek düğme boyu kuralını (.panel-duzen .btn)
   eşit özgüllükle ama daha sonra tanımlandığı için eziyordu; süzgeç kartındaki "Filtrele" komşu
   düğmelerden 3px yüksek duruyordu. Boy artık TEK yerden gelir. */
.filtre .alan { margin: 0; }
.sayac-sira { display: flex; gap: .5rem; flex-wrap: wrap; margin-bottom: 1.1rem; }
.sayac {
  flex: 1 1 7rem; background: var(--kart); border: 1px solid var(--cizgi); border-radius: var(--r);
  padding: .55rem .75rem; text-decoration: none; color: inherit;
  display: flex; flex-direction: column-reverse; gap: .1rem;
  transition: border-color .15s, box-shadow .15s;
}
.sayac:hover { border-color: var(--mavi); box-shadow: 0 1px 3px rgba(13,43,78,.08); }
.sayac-olumlu { border-color: #b7dcc9; background: linear-gradient(180deg,#f4fbf7 0%,#fff 60%); }
.sayac-olumlu .sayac-deger { color: var(--yesil); }
.sayac-deger { font-size: 1.35rem; font-weight: 700; color: var(--lacivert); line-height: 1.15; font-variant-numeric: tabular-nums; }
.sayac-ad { font-size: var(--yazi-kucuk); color: var(--metin-2); letter-spacing: .01em; }

/* Değer sütunu minmax(0,1fr): çıplak 1fr iken iz, DEĞERİN en-küçük boyuna büyüyordu —
   boşluksuz 120 karakterlik ad sütunu ~998px yapıp masaüstünde bile sayfayı kaydırıyordu. */
.detay-satir { display: grid; grid-template-columns: 13rem minmax(0,1fr); gap: .5rem 1rem; padding: .45rem 0; border-bottom: 1px solid var(--cizgi); font-size: var(--yazi-govde2); }
.detay-satir:last-child { border-bottom: none; }
.detay-ad { color: var(--metin-2); }
.detay-deger { color: var(--metin); font-weight: 500; }
.detay-bos { color: var(--metin-3); font-style: italic; font-weight: 400; margin: 0; }
@media (max-width: 560px) { .detay-satir { grid-template-columns: minmax(0,1fr); gap: 0; } }

/* Tek sütun AÇIKÇA minmax(0,1fr): örtük iz `auto` idi ve auto'nun alt sınırı satırın
   en-küçük boyu. Dosya girdisinin içsel genişliği (258px) + .belge dolgusu (27.2px) +
   kenarlıklar (2px) = 287.2px'lik bir taban oluşturuyor, iz kabından DAR olamıyordu:
   375px'te kart içi tam dolu (marj 0), 360px'te kutu kabından ~16px, 320px'te sayfa
   ~12px taşıyordu. İz artık kabı geçemez; kutunun kendisi de min-width:0 ile izin
   içinde kalır, dosya girdisi mevcut max-width:100% kuralıyla küçülür. */
.belge-liste { display: grid; grid-template-columns: minmax(0,1fr); gap: .5rem; }
/* Satır dar ekranda SARMALI: nowrap iken dosya girdisi + "Yükle" düğmesi 375px'e sığmıyor,
   düğme ekran dışında kalıyordu. wrap yalnız sığmadığında devreye girer — geniş ekranda
   satır tek satır kalır, ayrı kesme noktası gerekmez. */
.belge {
  display: flex; align-items: center; gap: .7rem; flex-wrap: wrap; padding: .65rem .85rem;
  border: 1px solid var(--cizgi); border-radius: var(--r-kucuk); background: var(--kart); font-size: var(--yazi-govde2);
}
.belge-ad { font-weight: 600; }
/* Panel Belgeler sekmesi (vakıf 09.09): ad büyük punto + kalın; büyük harf JSX'te tr-TR ile. Başvuru yüzü dokunulmadı. */
.belge-ad-vurgu { font-weight: 700; font-size: 1.05rem; letter-spacing: .01em; }
.belge-meta { color: var(--metin-3); font-size: var(--yazi-kucuk); }
.belge .btn { margin-left: auto; }

/* ── Liste üst şeridi (kayıt sayısı + dışa aktarma) ── */
.liste-ust {
  display: flex; align-items: center; gap: .75rem; flex-wrap: wrap;
  justify-content: space-between; margin-bottom: .6rem;
}

/* ── Sekme şeridi (2026-08-25) ───────────────────────────────────────────────
   2026-08-10'da kaldırılmıştı (başvuru DETAYI 4 sekmeden tek sayfaya inmişti). Şimdi başka
   bir iş için geri geliyor: bir ekranın SÜZÜLMÜŞ görünümleri (Başvurular: tümü/işlemde/red/
   eksik · Öğrenciler: tümü/bursiyer) ayrı menü maddesi değil sekme olur — kavram sayısı
   üçte kalsın (docs/PANEL-MIMARI.md §3). Sekme yalnız süzgeçtir, sütunları değiştirmez.
   Sekmeler <a> olmalı: JS yok, görünüm adresten (?gorunum=) okunur ve paylaşılabilir. */
.sekme-serit {
  display: flex; gap: .25rem; flex-wrap: wrap; align-items: flex-end;
  border-bottom: 1px solid var(--cizgi); margin-bottom: 1.1rem;
}
.sekme {
  display: inline-flex; align-items: center; gap: .4rem;
  padding: .55rem .9rem; margin-bottom: -1px;
  text-decoration: none; color: var(--metin-2);
  font-size: var(--yazi-govde2); font-weight: 500;
  border-bottom: 3px solid transparent;
}
.sekme:hover { color: var(--lacivert); }
/* Etkin sekme renk DIŞINDA kalınlık ve alt çizgiyle de belli (WCAG 1.4.1). */
.sekme.aktif { color: var(--lacivert); font-weight: 700; border-bottom-color: var(--lacivert); }

/* ── Ana ayrım şeridi (2026-08-28) ──
   Başvuru listesinin EN ÜST ayrımı (Yeni Başvurular · Başvuru Yenileme) görünüm şeridinin
   üstünde durur; iki şerit aynı görsel dilde olunca hiyerarşi okunmuyordu. Ana şerit hap
   biçimli: alt çizgi yok, seçili ayrım dolgun lacivert zemin alır (mevcut değişkenler,
   yeni renk yok; #fff düğme ailesinde zaten kullanılıyor). .sekme-serit ile BİRLİKTE
   yazılır ki yazdırma gizlemesi ve temel davranış kalıtımla gelsin. */
.sekme-serit-ana { border-bottom: 0; gap: .5rem; margin-bottom: .5rem; align-items: center; }
.sekme-serit-ana .sekme {
  padding: .55rem 1.15rem; margin-bottom: 0;
  font-size: 1rem; font-weight: 600;
  border: 1px solid var(--cizgi); border-radius: 999px; background: var(--kart);
}
.sekme-serit-ana .sekme:hover { color: var(--lacivert); border-color: var(--lacivert-700); }
.sekme-serit-ana .sekme.aktif { color: #fff; background: var(--lacivert); border-color: var(--lacivert); }

/* ── Belge doğrulama satırı (e-Devlet tek tık asistanı) ── */
.belge-blok { display: block; }
.belge-ust { display: flex; align-items: flex-start; gap: .7rem; flex-wrap: wrap; }
.belge-eylem { margin-left: auto; display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.belge-alt {
  display: flex; align-items: center; gap: .5rem; flex-wrap: wrap;
  margin-top: .65rem; padding-top: .65rem; border-top: 1px dashed var(--cizgi);
}
.belge-ust .btn, .belge-alt .btn { margin-left: 0; }
/* Etiket + girdi + düğme dar ekranda alt alta düşer; nowrap iken "Kaydet" ekran dışında
   kalıyordu. Girdinin min-width:0 alması şart: esnek öğenin varsayılan min-width:auto
   değeri onu İÇSEL genişliğine kilitler ve 13rem'lik genişlik hiç uygulanmaz. */
.satir-form { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; margin: 0; }
.satir-form label { margin: 0; }
/* Dikey dolgu .4rem: .btn-kucuk ile aynı (C turu) — satır formlarında girdi ile düğme
   yan yana durur, .35rem'lik girdi düğmeden ~2px kısa kalıp satırı diş diş gösteriyordu. */
input.giris-mini { width: 13rem; min-width: 0; max-width: 100%; padding: .4rem .55rem; font-size: var(--yazi-kucuk); }
.belge-not { font-size: var(--yazi-kucuk); color: var(--metin-3); }

/* ── Tablo hücresinde yaşayan formlar (C turu, 2026-08-29) ──
   Arşivdeki "Bursiyerlere Aktar" (onay kutusu + tutar + düğme) ve Görüşülenler'deki nihai
   karar formu, kart ölçeğindeki .onay/.alan kurallarıyla çiziliyordu: tek satırlık tablo
   hücresi kart kadar dolgu ve boşluk alıyordu. Kapsam bilinçli olarak `td` ile sınırlı —
   kartlardaki onay kutuları (imha, kullanıcılar, değerlendirme) DEĞİŞMEZ.
   ⚠️ `white-space: normal` ŞART: nihai karar formu `td.tek` (nowrap) hücresinde yaşıyor,
   kalıtım onay etiketini tek satıra kilitleyip hücreyi ekran boyu genişletiyordu.
   min/max genişlik: min 15rem etiketi harf harf kırılmaktan korur (td'nin `anywhere`
   kuralı), max 26rem geniş ekranda kutunun satır boyu yayılmasını keser. */
td .onay {
  padding: .5rem .65rem; gap: .5rem; margin-bottom: .5rem;
  min-width: 15rem; max-width: 26rem;
}
td .onay label { font-size: var(--yazi-kucuk); line-height: 1.45; white-space: normal; }
td .onay input { margin-top: .15rem; }
td .alan { margin-bottom: .5rem; max-width: 26rem; }
td .alan > label { font-size: var(--yazi-kucuk); margin-bottom: .2rem; }
td .alan input { padding: .45rem .6rem; font-size: var(--yazi-govde2); }
td .btn-sira { gap: .5rem; }

.bos-durum { text-align: center; padding: 3rem 1rem; color: var(--metin-3); }
.bos-durum h3 { color: var(--metin-2); }

.yazdir { display: none; }
@media print {
  /* Kâğıda çıkmayanlar: gezinme, düğmeler, formlar (karar/seçim/not girişleri),
     yıldız, sayaçlar. Kâğıttaki dosya OKUNUR, üzerinde işlem yapılmaz.
     .gorusuldu-sutun: Takvim'in "Görüşüldü" sütunu — içeriği (details+form) kâğıtta
     zaten gizli, başlık tek başına kalıp altı boş sütun basıyordu; th+td birlikte kalkar. */
  .ust, .alt, .filtre, .btn, .btn-sira, .adimlar, .liste-ust .btn,
  .yan-menu, .icerik-ust, .sekme-serit, form, .sayac-sira, .hizli-erisim, .kontenjan-ozet,
  .kutu-basari, .kutu-bilgi, .gorusuldu-sutun { display: none !important; }
  /* Menü kâğıda basılmadığı için ızgara da kalkar: içerik sayfanın tam genişliğini alsın,
     248px'lik boş sütun sol kenarda beyaz bant bırakmasın. */
  .panel-duzen { display: block; }
  body { background: #fff; font-size: 10.5pt; color: #000; }
  .kap { max-width: none; padding: 0; }
  .kart {
    box-shadow: none; border: 0; border-bottom: 1px solid #bbb; border-radius: 0;
    break-inside: avoid; padding: .6rem 0; margin-bottom: .4rem;
  }
  h1 { font-size: 15pt; } h2 { font-size: 12pt; margin-bottom: .3rem; }
  .detay-satir { padding: .15rem 0; }
  th, td { padding: .3rem .45rem; font-size: 9.5pt; }
  /* th sticky kuralı kaldırıldığı için buradaki static geçersiz kılması da kalktı. */
  .rozet { border: 1px solid #999; background: #fff !important; color: #000 !important; }
  /* Zebra ekran içindir: yazıcı gri bant basmasın (rozet nötrleştirmesiyle aynı ilke). */
  tbody tr:nth-child(even) { background: #fff !important; }
  /* Randevu vurgusu kâğıtta renksiz kalır ama kenarlık bilgi taşımaya devam eder. */
  .not-satir.randevu { background: #fff !important; border-left-color: #666 !important; }
  a { color: #000; text-decoration: none; }
  /* ── .yazdir kancası CANLANDI (denetim 2026-08-17) ──
     Sınıf ekranda gizli (yukarıda display:none) ama print karşılığı HİÇ yazılmamıştı —
     ölü kancaydı. Şimdi: form içinde yaşayan OKUNUR verinin (görüşme notu, yönetim
     değerlendirme notu) yazdırma-özel kopyası bu sınıfla basılır.
     ⚠️ .yazdir div'i formun İÇİNE KONMAZ: `form { display:none !important }` bir atayı
     gizlediğinde içindeki hiçbir kural onu geri getiremez. Kopya formun DIŞINDA,
     kardeş olarak durur (panel.tsx'te ikisi de böyle yerleştirildi). */
  .yazdir { display: block !important; }
  /* İmha aday listeleri form İÇİNDE yaşar (satır seçim kutuları oradan gönderilir) ve
     form kâğıtta gizli — ekranda "3 aday" başlığı basılıp altı BOŞ çıkıyordu. Bu üç form
     yazdirilir işaretli: kâğıtta içerik görünür, düğmeler zaten .btn kuralıyla gizli.
     Seçim kutuları kâğıtta boş kutucuk olarak kalır — elle işaretlenebilir, zarar değil fayda. */
  form.yazdirilir { display: block !important; }
  /* Tablo satırı ve belge kartı sayfa ortasından bölünmesin (kart düzeyi zaten korunuyordu). */
  tr, .belge, .secim-satir { break-inside: avoid; }
  /* Islak imzalı tutanakta imza bloğu sayfa ortasından bölünmesin. */
  .imza-sira, .imza-kutu { break-inside: avoid; }
  /* Belge bağlantıları kâğıtta işlevsiz — adları kalır, "indir" görünümü kalkar. */
  .satir-link { text-decoration: none; }
}



/* Ekran başlığı ile ilk kart arasındaki ritim — her sayfada aynı. */
.kap > h1:first-of-type { margin: .25rem 0 .35rem; font-size: 1.5rem; }
.kap > h1 + .ipucu, .kap > h1 + p { margin-top: 0; }

/* Kontenjan özeti — liste ekranı için tek satır. Tam tablo dosya ekranında.
   Alt boşluk 1.1rem: liste ekranının blok ritmiyle aynı (bkz. .hizli-erisim notu). */
.kontenjan-ozet {
  display: flex; gap: 1.25rem; flex-wrap: wrap; align-items: baseline;
  background: var(--kart); border: 1px solid var(--cizgi); border-radius: var(--r);
  padding: .5rem .8rem; margin-bottom: 1.1rem;
  font-size: var(--yazi-govde2); color: var(--metin-2);
}
.kontenjan-ozet strong { color: var(--lacivert); font-variant-numeric: tabular-nums; }
.kontenjan-ozet .asim { color: var(--amber); }
.kontenjan-ozet .asim strong { color: var(--amber); }

/* Rapor kırılımları — küçük kartlar yan yana, dar ekranda alt alta.
   auto-fit + minmax: sütun sayısını CSS seçer, JS yok.
   min(26rem, 100%) ŞART: çıplak 26rem (=416px) alt sınırı 375px görünüm penceresinden
   geniştir, auto-fit daha aşağı inemez ve ızgara sayfayı yatay taşırır. min() ile alt
   sınır dar ekranda kabın genişliğine düşer. */
.rapor-izgara {
  display: grid; gap: 1rem;
  grid-template-columns: repeat(auto-fit, minmax(min(26rem, 100%), 1fr));
  margin-bottom: 1rem;
}
.rapor-izgara > .kart { margin-bottom: 0; }

/* Açılır hesap kartı — <details>/<summary>, istemci JS yok. */
.hesap-kart { padding: 0; }
.hesap-kart > *:not(summary) { margin-left: 1rem; margin-right: 1rem; }
.hesap-kart > *:last-child { margin-bottom: 1rem; }
.hesap-ozet {
  display: flex; align-items: center; justify-content: space-between; gap: .75rem;
  flex-wrap: wrap; padding: .8rem 1rem; cursor: pointer; list-style: none;
  border-radius: var(--r); transition: background .15s;
}
.hesap-ozet::-webkit-details-marker { display: none; }
.hesap-ozet:hover { background: #f7f9fc; }
.hesap-ozet::before {
  content: '▸'; color: var(--metin-3); font-size: var(--yazi-govde2);
  transition: transform .15s; display: inline-block;
}
.hesap-kart[open] > .hesap-ozet::before { transform: rotate(90deg); }
.hesap-kart[open] > .hesap-ozet { border-bottom: 1px solid var(--cizgi); border-radius: var(--r) var(--r) 0 0; }
.hesap-ad { flex: 1 1 auto; font-weight: 600; }
.hesap-kadi { font-weight: 400; color: var(--metin-2); }
.hesap-rozet { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; }
.hesap-oturum { font-size: var(--yazi-kucuk); color: var(--metin-3); }

/* Defter tablosunda mesaj özeti — iki satırda kırpılır, satır boyu sabit kalır. */
.ozet-hucre {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden; font-size: var(--yazi-kucuk); color: var(--metin-3);
}

/* Seçili sayaç — süzgeç olarak etkin olan sayaç çerçeveyle belli olur. */
.sayac-secili { border-color: var(--mavi); box-shadow: inset 0 0 0 1px var(--mavi); }

/* İşbaşı şeridi — açılışta rolüne göre sıradaki iş; tek cümle, tek düğme. */

/* Tuzak alan — insana ve ekran okuyucuya görünmez, botun DOM'unda durur.
   display:none KULLANILMAZ: gelişmiş botlar onu tanır; ekran dışı konum daha dayanıklı. */
.hp-alan { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }

/* Karar kuyruğu satırı */
.kuyruk-satir {
  background: var(--kart); border: 1px solid var(--cizgi); border-radius: var(--r);
  padding: .85rem 1rem; margin-bottom: .7rem;
}
.kuyruk-ust { display: flex; justify-content: space-between; align-items: flex-start; gap: .75rem; flex-wrap: wrap; }
.kuyruk-ad { font-weight: 600; font-size: 1.02rem; color: var(--lacivert); text-decoration: none; }
.kuyruk-ad:hover { text-decoration: underline; }
.kuyruk-meta { font-size: var(--yazi-kucuk); color: var(--metin-3); margin-top: .15rem; }
.kuyruk-secimler { margin: .6rem 0 0 1.1rem; padding: 0; font-size: var(--yazi-govde2); }
.kuyruk-secimler li { margin-bottom: .2rem; }
.kuyruk-not { color: var(--metin-2); margin-left: .35rem; font-style: italic; }
.kuyruk-eylem {
  display: flex; gap: 1.25rem; align-items: flex-end; flex-wrap: wrap;
  margin-top: .7rem; padding-top: .7rem; border-top: 1px solid var(--cizgi);
}

/* Karar tutanağı */
.tutanak-baslik { text-align: center; margin-bottom: 1.1rem; }
.tutanak-vakif { font-weight: 700; font-size: 1.05rem; margin: 0; }
.tutanak-ad { font-size: .95rem; margin: .2rem 0 0; }
.tutanak-tarih { font-size: var(--yazi-kucuk); color: var(--metin-3); margin: .2rem 0 0; }
.imza-sira { display: flex; gap: 2rem; flex-wrap: wrap; margin-top: 2.2rem; justify-content: space-around; }
.imza-kutu { text-align: center; min-width: 11rem; }
.imza-cizgi { border-bottom: 1px solid var(--metin-2); height: 2.6rem; margin-bottom: .3rem; }
.imza-ad { font-weight: 600; font-size: var(--yazi-govde2); }
.imza-rol { font-size: var(--yazi-kucuk); color: var(--metin-3); }

/* Şifreyi göster anahtarı — şifre formlarının altında küçük onay kutusu. */
.sifre-goster {
  display: inline-flex; align-items: center; gap: .4rem;
  font-size: var(--yazi-kucuk); color: var(--metin-2); margin: .2rem 0 .8rem; cursor: pointer;
}
.sifre-goster input { width: auto; margin: 0; }

/* ── Dokunmatik hedef büyütme (WCAG 2.5.8 / 44px kılavuzu) ──────────────────
   Yalnız dokunmatik işaretçide: masaüstü yoğunluğu DEĞİŞMEZ. 55+ kullanıcı ve tablet
   olasılığı için küçük düğme/bağlantı hedefleri parmak boyuna çekilir (UX turu, 2026-08-15). */
@media (pointer: coarse) {
  .btn, .btn-kucuk { min-height: 44px; }
  input.giris-mini { min-height: 44px; padding: .5rem .65rem; }
  .yan-oge-ic { min-height: 44px; }
  input[type="checkbox"], input[type="radio"] { width: 1.35rem; height: 1.35rem; }
  .sifre-goster { min-height: 44px; }
  td a, .detay-satir a { padding: .35rem 0; display: inline-block; }
  /* Üst bar bağlantıları ("Şifrem", "Çıkış"): 23px yükseklikle WCAG 2.5.8'in 24px
     tabanının bile altındaydı — bar her ekranda durduğu için en sık dokunulan hedefler. */
  .ust-sag a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 .35rem; }
  /* Panelin kişi bloğundaki "Şifrem"/"Çıkış" da aynı sebeple (geniş tablette de dokunmatik). */
  .yan-kisi a { display: inline-flex; align-items: center; min-height: 44px; }
  /* Politika bloğunun kendi kapsam eksikleri (denetim): çipler ve filtre girdileri dışarıda kalmıştı. */
  .cip { min-height: 44px; }
  .sekme { min-height: 44px; }
  /* Dokunma hedefi: panelde düğme boyu küçültüldü (10.09), mobilde eşik korunur. */
  .panel-duzen .btn { min-height: 44px; }
  .filtre input, .filtre select { min-height: 44px; }
}

/* ── fieldset/legend sıfırlaması (WCAG 1.3.1 radyo grupları) ─────────────────
   Radyo bileşeni artık fieldset+legend üretir; tarayıcı varsayılan çerçeve/girintisi
   sıfırlanır ki görünüm eski span.alan-baslik ile birebir aynı kalsın. */
fieldset.alan { border: 0; padding: 0; margin: 0 0 1.15rem; min-width: 0; }
fieldset.alan legend.alan-baslik { padding: 0; }

/* ── T.C. kimlik alanının CANLI geri bildirimi ───────────────────────────────
   Yazarken durum söyler (kaç hane girildi / numara doğrulandı mı), böylece
   kullanıcı "Kaydet ve Devam"a basmadan önce anlar. Renk TEK BAŞINA anlam
   taşımaz: metin de değişir (WCAG 1.4.1). */
.ipucu.ipucu-olumlu { color: var(--yesil); }
.ipucu.ipucu-uyari { color: var(--amber); }

/* ── Görüşmeler ekranı (2026-08-26): satır içi formlar + yaklaşan görüşme şeridi ──
   Form düzeni .satir-form, metin girdisi .giris-mini (mevcut dil, yeni kopya yok).
   datetime-local taban girdi kuralının tip listesinde yok (input[type=text,...]) —
   kenarlık/dolgu burada, satır formunun ölçüsünde tamamlanır. */
.satir-form input[type=datetime-local] {
  /* Dikey dolgu .4rem — .giris-mini/.btn-kucuk yüksekliğiyle aynı satır ritmi (C turu). */
  font: inherit; font-size: var(--yazi-kucuk); padding: .4rem .55rem;
  border: 1px solid #75818f; border-radius: var(--r-kucuk);
  background: #fff; color: var(--metin); max-width: 100%;
}
/* Yaklaşan görüşme şeridi (.kutu-bilgi içinde) — madde listesi sıkı dursun. */
.yaklasan-liste { margin: .35rem 0 0; padding-left: 1.2rem; }
.yaklasan-liste li { margin: .2rem 0; }
/* "Görüşüldü işaretle" katlanır mini-form: summary düğme gibi görünür, JS yok. */
.gorusuldu-ac summary { cursor: pointer; list-style: none; }
.gorusuldu-ac summary::-webkit-details-marker { display: none; }
/* Ajandanın gün blokları (C turu): aralık bloklar ARASINDA durur — eski hâlde her gün
   başlığı kendi üst boşluğunu taşıyordu ve İLK gün kartın dolgusuna bir 1.25rem daha
   ekleyip tepede çift boşluk bırakıyordu. Kardeş seçici ilk bloğu kendiliğinden ayırır. */
.gun-blok + .gun-blok { margin-top: 1.4rem; }

/* ── Randevular · Takvim ızgarası (2026-08-26, md.9): aylık genel bakış, salt SSR tablo ──
   Renkler mevcut değişkenlerden (yeni renk yok): randevulu gün --mavi-acik dolgu, bugün
   --mavi iç çerçeve, ay dışı dolgu hücresi --zemin. Zebra ve hover ızgarada anlamsızdır
   (satır değil GÜN okunur) — tarafsızlanır. Dar ekranda .tablo-sar yatay kaydırır;
   min-width 7 sütunun okunur tabanı. */
.takvim-izgara { table-layout: fixed; min-width: 42rem; }
.takvim-izgara th { text-align: center; }
/* height tablo hücresinde ASGARİ gibi davranır: gün hücresi boşken 5.4rem durur, günün
   tüm randevuları listelendiğinde (28.08 — "+N randevu" özeti kalktı) içerikle büyür. */
.takvim-izgara td {
  vertical-align: top; height: 5.4rem; padding: .35rem .4rem;
  border-left: 1px solid var(--cizgi);
}
.takvim-izgara td:first-child { border-left: 0; }
.takvim-izgara tbody tr:nth-child(even), .takvim-izgara tbody tr:hover { background: transparent; }
.takvim-izgara td.takvim-bos { background: var(--zemin); }
.takvim-izgara td.takvim-dolu { background: var(--mavi-acik); }
.takvim-izgara td.takvim-bugun { outline: 2px solid var(--mavi); outline-offset: -2px; }
.takvim-gun-no { display: block; font-weight: 600; font-size: var(--yazi-kucuk); color: var(--metin-2); }
.takvim-izgara td.takvim-bugun .takvim-gun-no { color: var(--mavi); }
.takvim-randevu {
  display: block; font-size: var(--yazi-ince); line-height: 1.3; margin-top: .15rem;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
/* (.takvim-fazla kalktı, 28.08: hücre artık günün tüm randevularını listeliyor.) */
@media print {
  /* Izgara kâğıtta okunur kalır: hücre yüksekliği içeriğe iner, bugün çerçevesi siyah
     basılır, dolu-gün dolgusu tarayıcıya zorlanır (kenarlıklar zaten her zaman çıkar).
     Ay gezinme düğmeleri .btn print kuralıyla kendiliğinden gizli. */
  .takvim-izgara td { height: auto; }
  .takvim-izgara td.takvim-bugun { outline: 2px solid #000; }
  .takvim-izgara td.takvim-dolu {
    background: var(--mavi-acik) !important;
    -webkit-print-color-adjust: exact; print-color-adjust: exact;
  }
}

/* ── Başvuru listesi satır vurgusu (2026-08-27, md.2; gri bacak 28.08 toplantı md.6-7) ──
   Rengi domain/kurul.ts · dosyaTakipRengi üretir; burada yalnız ekran karşılığı durur.
   Zemin mevcut -bg tonlarından (rozet/kutu ailesi) — yumuşak, metin kontrastı bozulmaz;
   ilk hücredeki sol şerit renk körlüğü ve yazdırma için İKİNCİ sinyaldir (WCAG 1.4.1'in
   metin ayağı listenin altındaki açıklama satırı + hücre title'ı).
   Gri (yalnız "Kararsız" oyu): zemin rozet-gri ailesinin tonu (#eef2f6), şerit --metin-3.
   Zebra zemini (--zemin #f5f8fb) ile fark bilerek hafiftir — ayrımı asıl sol şerit taşır,
   yazdırmada da kenarlık her tarayıcıda basıldığı için gri satır kâğıtta ayırt edilir.
   ⚠️ KAYNAK SIRASI BİLİNÇLİ: zebra (nth-child) ve hover kurallarıyla özgüllük eşit —
   dosyanın SONUNDA durdukları için bu sınıflar kazanır; yukarı taşınırlarsa vurgu söner. */
tbody tr.satir-yesil { background: var(--yesil-bg); }
tbody tr.satir-kirmizi { background: var(--kirmizi-bg); }
tbody tr.satir-sari { background: var(--amber-bg); }
tbody tr.satir-gri { background: #eef2f6; }
tr.satir-yesil > td:first-child { border-left: 4px solid var(--yesil); }
tr.satir-kirmizi > td:first-child { border-left: 4px solid var(--kirmizi); }
tr.satir-sari > td:first-child { border-left: 4px solid var(--amber); }
tr.satir-gri > td:first-child { border-left: 4px solid var(--metin-3); }
/* Şerit dolgudan düşülür (C turu): 4px'lik sol kenarlık ilk hücrenin içeriğini renkli
   satırlarda 4px sağa itiyor, takip numarası sütunu renksiz satırlarla diş diş kalıyordu.
   Dolgu kenarlık kadar kısılır; sütun her satırda aynı hizada başlar. */
tr.satir-yesil > td:first-child, tr.satir-kirmizi > td:first-child,
tr.satir-sari > td:first-child, tr.satir-gri > td:first-child {
  padding-left: calc(.75rem - 4px);
}

@media print {
  /* Yazdırmada zebra beyaza zorlanıyor (üstteki print bloğu); satır vurgusu hafif tonuyla
     AYRICA korunur ve tarayıcıya arka planı basması söylenir. Arka plan basmayan
     tarayıcıda ilk hücrenin sol şeridi (kenarlıklar her zaman basılır) ayrımı taşır. */
  tbody tr.satir-yesil { background: var(--yesil-bg) !important; }
  tbody tr.satir-kirmizi { background: var(--kirmizi-bg) !important; }
  tbody tr.satir-sari { background: var(--amber-bg) !important; }
  tbody tr.satir-gri { background: #eef2f6 !important; }
  tbody tr.satir-yesil, tbody tr.satir-kirmizi, tbody tr.satir-sari, tbody tr.satir-gri,
  tr.satir-yesil > td:first-child, tr.satir-kirmizi > td:first-child,
  tr.satir-sari > td:first-child, tr.satir-gri > td:first-child {
    -webkit-print-color-adjust: exact; print-color-adjust: exact;
  }
}