:root{--renk-lacivert:#212348;--renk-bordo:#921831;--renk-koyu-yesil:#0b5e34;--renk-acik-gri:#f3f5f8;--renk-panel-grisi:#e2e6eb;--renk-cizgi-grisi:#d9dee7;--renk-metin-grisi:#6c757d;--yazi-tipi:"Inter",ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--golge:0 18px 50px rgba(33,35,72,.20)}*{box-sizing:border-box}body{margin:0;font-family:var(--yazi-tipi);color:var(--renk-lacivert);background:var(--renk-acik-gri)}.giris-sayfasi{min-height:100vh;overflow:hidden;color:var(--renk-acik-gri);background:linear-gradient(115deg,var(--renk-lacivert) 0%,var(--renk-lacivert) 48%,var(--renk-bordo) 100%)}.giris-izgarasi{position:fixed;inset:0;opacity:.14;background-image:linear-gradient(rgba(243,245,248,.24) 1px,transparent 1px),linear-gradient(90deg,rgba(243,245,248,.24) 1px,transparent 1px);background-size:114px 114px}.proje-rozeti{position:fixed;z-index:5;top:28px;left:24px;display:flex;align-items:center;gap:14px;padding:12px 18px;color:var(--renk-lacivert);background:var(--renk-acik-gri);border:1px solid var(--renk-cizgi-grisi);border-radius:22px;box-shadow:var(--golge)}.proje-kisaltmasi,.ust-proje-kisaltmasi{display:grid;place-items:center;color:var(--renk-acik-gri);background:var(--renk-bordo);font-weight:800}.proje-kisaltmasi{width:48px;height:48px;border-radius:12px}.proje-rozeti strong,.proje-rozeti small,.kurumsal-panel-metni strong,.kurumsal-panel-metni small{display:block}.proje-rozeti small{color:var(--renk-metin-grisi)}.kurumsal-panel-metni{position:fixed;top:38px;right:30px;text-align:right}.giris-duzeni{position:relative;z-index:2;min-height:100vh;display:grid;grid-template-columns:1fr minmax(390px,520px);align-items:center;gap:7vw;padding:150px 3.2vw 86px}.giris-tanitimi h1{max-width:920px;margin:0;font-size:clamp(3.4rem,5.4vw,6.2rem);line-height:.98;font-weight:800}.giris-tanitimi>p{max-width:880px;margin:28px 0 42px;color:rgba(243,245,248,.86);font-size:1.25rem}.modul-kartlari{display:grid;grid-template-columns:repeat(3,minmax(160px,220px));gap:16px}.modul-karti{padding:22px 24px;background:rgba(226,230,235,.09);border:1px solid rgba(217,222,231,.28);border-radius:13px}.modul-karti strong,.modul-karti span{display:block}.giris-karti{padding:34px;background:rgba(33,35,72,.84);border:1px solid rgba(217,222,231,.30);border-radius:30px;box-shadow:var(--golge)}.giris-karti-basligi{display:flex;align-items:center;gap:17px;margin-bottom:30px}.giris-simgesi{width:68px;height:68px;display:grid;place-items:center;background:linear-gradient(135deg,var(--renk-bordo),var(--renk-lacivert));border-radius:20px}.giris-karti .form-control{min-height:58px;background:var(--renk-acik-gri);border:1px solid var(--renk-cizgi-grisi)}.kurumsal-dugme{color:var(--renk-acik-gri);background:var(--renk-bordo);border-color:var(--renk-bordo);font-weight:800}.giris-alt-bilgi{position:fixed;bottom:12px;left:0;right:0;text-align:center}.uygulama-sayfasi{height:100vh;overflow:hidden;background:linear-gradient(110deg,var(--renk-lacivert),var(--renk-bordo))}.uygulama-kabugu{height:100vh;display:grid;grid-template-rows:68px minmax(0,1fr) 30px}.ust-menu{display:flex;align-items:center;gap:18px;padding:8px 16px;color:var(--renk-acik-gri)}.ust-proje-rozeti{display:flex;align-items:center;gap:10px;padding:7px 12px;color:var(--renk-lacivert);background:var(--renk-acik-gri);border-radius:14px;text-decoration:none}.ust-proje-kisaltmasi{width:36px;height:36px;border-radius:9px}.ust-proje-rozeti strong,.ust-proje-rozeti small{display:block}.ana-menu{display:flex;gap:4px;flex:1;overflow-x:auto}.ana-menu-baglantisi{padding:9px 11px;color:var(--renk-acik-gri);text-decoration:none;border-radius:18px;white-space:nowrap}.ana-menu-baglantisi.aktif,.ana-menu-baglantisi:hover{background:rgba(226,230,235,.15)}.kullanici-alani{display:flex;gap:12px;align-items:center}.cikis-dugmesi{color:var(--renk-acik-gri);background:transparent;border:0}.uygulama-penceresi-sarmalayici{min-height:0;padding:0 16px;overflow:hidden}.uygulama-penceresi{height:100%;overflow-y:auto;overflow-x:hidden;background:var(--renk-acik-gri);border:1px solid var(--renk-cizgi-grisi);border-radius:20px;box-shadow:var(--golge);scrollbar-color:var(--renk-metin-grisi) var(--renk-panel-grisi)}.uygulama-icerigi{padding:20px}.uygulama-alt-bilgi{display:flex;align-items:center;justify-content:center;color:var(--renk-acik-gri)}.sayfa-basligi{display:flex;gap:16px;align-items:center}.sayfa-simgesi{width:52px;height:52px;display:grid;place-items:center;color:var(--renk-acik-gri);background:var(--renk-lacivert);border-radius:12px}.kpi-izgarasi{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:18px}.kpi-karti{padding:20px;color:var(--renk-acik-gri);background:var(--renk-lacivert);border-radius:10px}.kpi-karti.panel-rengi{color:var(--renk-lacivert);background:var(--renk-panel-grisi)}.kpi-karti.bordo{background:var(--renk-bordo)}.kpi-karti.yesil{background:var(--renk-koyu-yesil)}.kpi-karti span,.kpi-karti strong,.kpi-karti small{display:block}.kpi-karti strong{font-size:2rem}.panel-karti{margin-top:16px;background:var(--renk-acik-gri);border:1px solid var(--renk-cizgi-grisi);border-radius:12px;overflow:hidden}.panel-karti-basligi{display:flex;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--renk-cizgi-grisi)}.table{--bs-table-bg:var(--renk-acik-gri);--bs-table-border-color:var(--renk-cizgi-grisi)}.table thead th{background:var(--renk-panel-grisi)}.durum-etiketi{padding:5px 10px;background:var(--renk-panel-grisi);border-radius:15px}.durum-etiketi.basarili{color:var(--renk-acik-gri);background:var(--renk-koyu-yesil)}.bos-durum{min-height:220px;display:grid;place-content:center;text-align:center;color:var(--renk-metin-grisi)}.hata-sayfasi{min-height:100vh;display:grid;place-items:center;background:linear-gradient(110deg,var(--renk-lacivert),var(--renk-bordo))}.hata-karti{padding:48px;text-align:center;background:var(--renk-acik-gri);border-radius:24px}.hata-karti>strong{font-size:4rem;color:var(--renk-bordo)}@media(max-width:991px){.giris-sayfasi{overflow-y:auto}.giris-duzeni{grid-template-columns:1fr}.kpi-izgarasi{grid-template-columns:repeat(2,1fr)}}@media(max-width:767px){.giris-duzeni{padding:118px 16px 70px}.modul-kartlari,.kpi-izgarasi{grid-template-columns:1fr}.kurumsal-panel-metni{display:none}.uygulama-penceresi-sarmalayici{padding:0 8px}}

/* =============================================================================
   FAZ 5 — Panel bilesenleri
   Renkler yalnizca 03-KURUMSAL-TASARIM-SISTEMI.md paletinden kullanilir.
   Responsive davranis ortak bilesenlerden gelir (08-RESPONSIVE-...md).
   ============================================================================= */

/* --- Mobil menu dugmesi --- */
.menu-dugmesi{padding:6px 12px;font-size:1.35rem;line-height:1;color:var(--renk-acik-gri);background:transparent;border:1px solid rgba(226,230,235,.35);border-radius:10px}
.menu-dugmesi:focus-visible{outline:3px solid var(--renk-acik-gri);outline-offset:2px}

/* --- Offcanvas menu (tablet/mobil) --- */
.tsts-offcanvas{color:var(--renk-acik-gri);background:var(--renk-lacivert);max-width:86vw}
.tsts-offcanvas .offcanvas-header{border-bottom:1px solid var(--renk-cizgi-grisi)}
.tsts-offcanvas .btn-close{filter:invert(1) grayscale(100%) brightness(200%)}
.offcanvas-menu{display:flex;flex-direction:column;gap:4px}
.offcanvas-menu-baglantisi{display:block;padding:12px 14px;color:var(--renk-acik-gri);text-decoration:none;border-radius:10px}
.offcanvas-menu-baglantisi:hover,.offcanvas-menu-baglantisi.aktif{background:rgba(226,230,235,.16)}
.offcanvas-menu-baglantisi small{display:block;color:var(--renk-cizgi-grisi)}
.offcanvas-menu-baglantisi.pasif,.ana-menu-baglantisi.pasif{opacity:.55;cursor:not-allowed}

/* --- Yol izi --- */
.yol-izi{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px;padding:0;list-style:none;color:var(--renk-metin-grisi);font-size:.9rem}
.yol-izi li+li::before{content:"/";margin-right:8px}

/* --- Sayfa basligi --- */
.sayfa-basligi h1{margin:0;font-size:1.6rem}
.sayfa-basligi small{color:var(--renk-metin-grisi)}

/* --- Toolbar / filtre: dar ekranda alt alta --- */
.arac-cubugu{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;margin-top:16px}
.arac-cubugu .alan{display:flex;flex-direction:column;gap:4px;min-width:150px;flex:1 1 150px}
.arac-cubugu label{font-size:.85rem;color:var(--renk-metin-grisi)}
.arac-cubugu .dugme-grubu{display:flex;flex-wrap:wrap;gap:8px}

/* --- Kartlar: mobilde tek, tablette iki, desktopta dort kolon --- */
.kpi-izgarasi{grid-template-columns:repeat(4,minmax(0,1fr))}
.kpi-karti strong{font-size:1.7rem;overflow-wrap:anywhere}
.kpi-karti small{color:inherit;opacity:.85}

/* --- Tablolar: sayfa degil, tablo kayar --- */
.table-responsive{overflow-x:auto;-webkit-overflow-scrolling:touch}
.tsts-tablo{width:100%;margin:0;font-size:.92rem}
.tsts-tablo th,.tsts-tablo td{white-space:nowrap;vertical-align:middle}
.tsts-tablo td.sarabilir{white-space:normal;min-width:220px;overflow-wrap:anywhere}
.tsts-tablo td.uzun-deger{max-width:280px;overflow:hidden;text-overflow:ellipsis}

/* --- Durum etiketleri --- */
.durum-etiketi.uyari{color:var(--renk-acik-gri);background:var(--renk-bordo)}
.durum-etiketi.notr{color:var(--renk-lacivert);background:var(--renk-cizgi-grisi)}
.deger-pozitif{color:var(--renk-koyu-yesil);font-weight:700}
.deger-negatif{color:var(--renk-bordo);font-weight:700}

/* Bootstrap `.table > :not(caption) > * > *` hucre rengini DOGRUDAN atar
   (0,1,2) ve tekil sinif secicisini (0,1,0) yener. Bu yuzden renk siniflari
   `<td>` uzerine verildiginde SESSIZCE etkisiz kaliyordu: NET PnL, GERC. R,
   MFE ve MAE kalin ama siyah ciziliyordu. `<span>` icine yazilan YON sutunu
   calisiyordu, cunku o secici hucreyi hedeflemiyor.

   Ozgullugu (0,2,1) yaparak duzeltilir; siniflarin kendisi degismedigi icin
   tablo disindaki kullanimlar aynen kalir. */
.tsts-tablo td.deger-pozitif{color:var(--renk-koyu-yesil)}
.tsts-tablo td.deger-negatif{color:var(--renk-bordo)}

/* --- Bilgi kutusu (veri kalitesi notu, yetersiz orneklem vb.) --- */
.bilgi-kutusu{display:flex;gap:10px;padding:12px 14px;margin-top:14px;color:var(--renk-lacivert);background:var(--renk-panel-grisi);border-left:4px solid var(--renk-bordo);border-radius:8px;font-size:.9rem}
.bilgi-kutusu.notr{border-left-color:var(--renk-metin-grisi)}

/* --- Formlar: mobilde tek kolon --- */
.tsts-form .satir{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.tsts-form label{display:block;margin-bottom:4px;font-size:.9rem}
.tsts-form .form-control,.tsts-form .form-select{border-color:var(--renk-cizgi-grisi)}
.tsts-form .dugme-satiri{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end;margin-top:16px}

/* --- Sayfalama --- */
.sayfalama{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:14px;font-size:.9rem}
.sayfalama a,.sayfalama span{padding:6px 11px;color:var(--renk-lacivert);background:var(--renk-panel-grisi);border-radius:8px;text-decoration:none}
.sayfalama .aktif{color:var(--renk-acik-gri);background:var(--renk-lacivert)}

/* --- Erisilebilirlik: gorunur odak --- */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--renk-bordo);outline-offset:2px}

/* --- Yikici islem dugmeleri: rahat dokunma hedefi ---
   Tablo icindeki `btn-sm` dugmeler 31px yuksekliginde kaliyordu. Bu, WCAG
   2.2 AA asgari hedefini (24px) gecer; ancak buradaki dugme ACIK BIR
   POZISYONU KAPATIR — dokunmatik ekranda yanlis basma maliyeti gercek
   paradir. Bu yuzden yalnizca kapatma dugmelerine 44px'lik rahat hedef
   verilir. Onay istemi (confirm) yerinde durur; bu onun YERINE gecmez,
   yanina eklenir. */
.kapatma-dugmesi{min-height:44px;min-width:44px}

/* =============================================================================
   Breakpointler — 576 / 768 / 992 / 1200
   ============================================================================= */
@media(max-width:1199px){.kpi-izgarasi{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:991px){
  .uygulama-kabugu{grid-template-rows:60px minmax(0,1fr) 30px}
  .ust-menu{gap:10px}
}
@media(max-width:767px){
  .kpi-izgarasi{grid-template-columns:1fr}
  .sayfa-basligi h1{font-size:1.3rem}
  .uygulama-icerigi{padding:14px}
  .arac-cubugu .alan{flex:1 1 100%}
  .tsts-form .dugme-satiri{justify-content:stretch}
  .tsts-form .dugme-satiri .btn{flex:1 1 auto}
}
@media(max-width:575px){
  .uygulama-penceresi-sarmalayici{padding:0 6px}
  .uygulama-icerigi{padding:10px}
}

/* --- Ust menu tasma duzeltmesi ---
   Flex ogeleri varsayilan `min-width:auto` ile icerik genisliginin altina
   INMEZ; bu yuzden 992px'de 9 menu kalemi sayfayi yatay tasiriyordu.
   `min-width:0` ile menu kendi `overflow-x:auto` alaninda kayar, SAYFA kaymaz. */
.ust-menu{min-width:0}
.ust-proje-rozeti{flex:0 0 auto;min-width:0}
.ana-menu{flex:1 1 0;min-width:0;scrollbar-width:thin}
.kullanici-alani{flex:0 0 auto;min-width:0}
.kullanici-alani>span{display:inline-block;max-width:170px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle}
@media(min-width:992px) and (max-width:1199px){.ana-menu-baglantisi{padding:9px 8px;font-size:.92rem}}

/* =============================================================================
   FAZ 7 — Gorsel ince ayar
   -----------------------------------------------------------------------------
   Palet DEGISMEDI: yalnizca 03-KURUMSAL-TASARIM-SISTEMI.md'deki yedi renk
   kullanilir. Buradaki tum yarisaydam degerler ayni renklerin rgba()
   karsiliklaridir; yeni bir renk TANIMLANMAZ.

   Responsive davranis DEGISMEDI: yeni breakpoint uretilmedi, mevcut
   576/768/992/1200 kirilim noktalari korunuyor (08-RESPONSIVE-...md).
   ============================================================================= */

/* --- 1) Yazi tipi -----------------------------------------------------------
   Inter YEREL barindirilir; CDN kullanilmaz (00-DEGISMEZ-STANDARTLAR.md ->
   "Varliklar yereldir").

   TEK DOSYA, TUM KALINLIKLAR: degisken (variable) font. `font-weight:100 900`
   araligi, 400/500/600/700 icin ayri ayri dort dosya indirmek yerine tek
   istekle karsilanir. Ara kalinliklar da kullanilabilir hale gelir.

   `font-display:swap`: font inene kadar metin fallback ile GORUNUR kalir,
   gorunmez metin (FOIT) olusmaz.

   DOSYA YOKSA: @font-face sessizce basarisiz olur ve tarayici asagidaki
   fallback yiginina duser. Sayfa BOZULMAZ, yalnizca sistem fontuyla gorunur.
   Sunucuda dosyanin varligini `saglikKontrolu.php` denetler.
   Yonerge: web/varliklar/fontlar/BENIOKU.md

   Tirnaklar CIFT: `tasarimKontrolu.php` CSS icinde birebir `"Inter"` ariyor;
   tek tirnak denetimi dusururdu. */
   IKI BICIM TANIMLI: tarayici listeyi SIRAYLA dener ve bir kaynak
   indirilemezse (orn. dosya yoksa) bir SONRAKINE gecer. Yani woff2 varsa
   o kullanilir, yoksa ttf'ye duser. Ikisinden biri yeterlidir; woff2
   yaklasik yari boyuttadir, tercih edilendir. */
@font-face{
  font-family:"Inter";
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
  src:url("/varliklar/fontlar/InterVariable.woff2") format("woff2-variations"),
      url("/varliklar/fontlar/InterVariable.ttf") format("truetype-variations");
}

:root{
  --yazi-tipi:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,
              "Helvetica Neue",Arial,sans-serif;

  /* Kose yaricapi ve golge olcegi — daginik degerler yerine tek kaynak. */
  --yaricap-kucuk:10px;
  --yaricap-orta:14px;
  --yaricap-buyuk:22px;
  --golge-kucuk:0 1px 2px rgba(33,35,72,.06),0 2px 8px rgba(33,35,72,.05);
  --golge-orta:0 2px 4px rgba(33,35,72,.05),0 8px 24px rgba(33,35,72,.08);
  --golge-pencere:0 2px 6px rgba(33,35,72,.10),0 24px 64px rgba(33,35,72,.30);
}

body{
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  line-height:1.5;
  letter-spacing:-.005em;
}

h1,h2,h3,.kpi-karti strong{letter-spacing:-.02em}

/* --- Sayisal hizalama -------------------------------------------------------
   `tabular-nums` her rakama AYNI genisligi verir. Orantili rakamlarda "1"
   digerlerinden dar oldugu icin alt alta duran fiyatlar/R degerleri sagdan
   kayik gorunur ve goz kolonu takip edemez.

   Fiyat, R, yuzde ve tutar gosterilen HER YERI kapsar: KPI kartlari, tablo
   hucreleri, artı/eksi degerler, sayfalama ve para/oran tasiyan rozetler.
   Metin alanlarina UYGULANMAZ — orada orantili rakam daha iyi okunur. */
.kpi-karti strong,
.tsts-tablo td,
.tsts-tablo th[scope="row"],
.deger-pozitif,
.deger-negatif,
.sayfalama,
.kayit-sayisi{font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}

/* --- 2) Ana pencerenin kenar cizgisi ----------------------------------------
   Koyu gradyan uzerindeki 1px'lik kenarlik, arka planla birlesince koyu bir
   cerceve gibi okunuyordu. Kaldirildi; ayrim artik yalnizca golgeden gelir. */
.uygulama-penceresi{
  border:0;
  border-radius:var(--yaricap-buyuk);
  box-shadow:var(--golge-pencere);
}

/* --- 3) Ic panellerde kaydirma cubugu YOK -----------------------------------
   Iki ayri sebep vardi:

   a) .table-responsive yalnizca overflow-x:auto tanimlar. CSS'te bir eksen
      auto iken digeri visible KALAMAZ; tarayici onu da auto yapar.
   b) Bootstrap'in .visually-hidden sinifi margin:-1px kullanir. Kaydirma
      baglaminda bu 1px'lik tasma dikey cubugu TETIKLER — tablodaki gizli
      caption tam olarak bunu yapiyordu.

   Sonuc: icerik sigsa bile kutuda dikey cubuk cikiyordu. Bu, 08-RESPONSIVE
   belgesindeki "cift scrollbar kabul edilmez" kuralinin ihlaliydi.

   Kutulara sabit yukseklik VERILMEZ: icerik ne kadarsa kutu o kadar uzar.
   Uzun listelerde cozum kaydirma degil, "Tumunu Gor" ile sayfalamadir. */
.panel-karti .table-responsive{overflow-y:hidden}
.panel-karti .table-responsive>.table>caption.visually-hidden{margin:0!important}

/* --- 4) Kaydirma cubugu: yuvarlak, pencere koseleriyle uyumlu --------------- */
.uygulama-penceresi{scrollbar-width:thin;scrollbar-color:rgba(33,35,72,.30) transparent}
.uygulama-penceresi::-webkit-scrollbar{width:12px;height:12px}
.uygulama-penceresi::-webkit-scrollbar-track{
  background:transparent;
  /* Ust/alt bosluk: cubuk yuvarlatilmis koselere DAYANMAZ. */
  margin:var(--yaricap-buyuk) 0;
}
.uygulama-penceresi::-webkit-scrollbar-thumb{
  background:rgba(33,35,72,.26);
  border-radius:999px;
  /* Saydam kenarlik + background-clip: cubugu inceltir, kenardan ayirir. */
  border:3px solid transparent;
  background-clip:content-box;
}
.uygulama-penceresi::-webkit-scrollbar-thumb:hover{background:rgba(33,35,72,.44);background-clip:content-box}
.uygulama-penceresi::-webkit-scrollbar-corner{background:transparent}

/* --- 5) Logo olcusu --------------------------------------------------------- */
.ust-proje-kisaltmasi{width:32px;height:32px;border-radius:9px;font-size:.68rem;letter-spacing:.02em}
.ust-proje-rozeti{gap:9px;padding:6px 11px;border-radius:12px}
.ust-proje-rozeti strong{font-size:.92rem;line-height:1.25}
.ust-proje-rozeti small{font-size:.72rem;line-height:1.2;color:var(--renk-metin-grisi)}

.proje-kisaltmasi{width:42px;height:42px;border-radius:12px;font-size:.9rem;letter-spacing:.02em}
.proje-rozeti{gap:12px;padding:10px 16px;border-radius:18px}

/* --- 6) Genel ince ayar ----------------------------------------------------- */

/* Ust menu: secili kalem daha net, gecisler yumusak. */
.ust-menu{padding:10px 18px}
.ana-menu-baglantisi{border-radius:10px;font-size:.94rem;font-weight:500;transition:background-color .15s ease}
.ana-menu-baglantisi.aktif{background:rgba(226,230,235,.20);font-weight:600}

/* Icerik nefes alsin. */
.uygulama-icerigi{padding:26px 28px}
.sayfa-basligi{gap:18px}
.sayfa-simgesi{border-radius:var(--yaricap-orta);box-shadow:var(--golge-kucuk)}

/* KPI kartlari. */
.kpi-izgarasi{gap:16px;margin-top:22px}
.kpi-karti{padding:22px 24px;border-radius:var(--yaricap-orta);box-shadow:var(--golge-orta)}
.kpi-karti span{font-size:.88rem;opacity:.88;letter-spacing:.01em}
/* Boyut SABIT verilmez: 1.7rem degeri daha once dar ekranda tasmayi onlemek
   icin bilerek dusurulmustu. clamp() genis ekranda buyutur ama dar ekranda
   o guvenli tabani korur. */
.kpi-karti strong{margin:6px 0 2px;font-size:clamp(1.55rem,1.15rem + 1.1vw,1.95rem);font-weight:700;overflow-wrap:anywhere}
.kpi-karti small{font-size:.82rem}

/* Panel kartlari. */
.panel-karti{margin-top:20px;border-radius:var(--yaricap-orta);box-shadow:var(--golge-kucuk)}
.panel-karti-basligi{align-items:center;padding:16px 22px;background:rgba(226,230,235,.45)}
.panel-karti-basligi h2{font-size:.98rem;letter-spacing:-.01em}

/* Tablolar: baslik satiri sakin, satirlar okunakli. */
.tsts-tablo th,.tsts-tablo td{padding:12px 16px}
.tsts-tablo thead th{
  font-size:.76rem;font-weight:600;letter-spacing:.06em;
  color:var(--renk-metin-grisi);border-bottom-width:1px;
}
.tsts-tablo tbody tr{transition:background-color .12s ease}
.tsts-tablo tbody tr:hover{background:rgba(226,230,235,.42)}
.tsts-tablo tbody tr:last-child>*{border-bottom-width:0}

/* Durum etiketleri: daha kompakt, daha okunakli. */
.durum-etiketi{
  display:inline-block;padding:4px 11px;border-radius:999px;
  font-size:.76rem;font-weight:600;letter-spacing:.02em;white-space:nowrap;
}

/* Dugmeler. */
.kurumsal-dugme{border-radius:9px;padding:7px 15px;letter-spacing:.01em;transition:filter .15s ease}
.kurumsal-dugme:hover{filter:brightness(1.08)}

/* Bos durum ve bilgi kutusu. */
.bos-durum{gap:6px;min-height:180px}
.bilgi-kutusu{border-radius:var(--yaricap-kucuk);box-shadow:var(--golge-kucuk)}

/* Giris ekrani kartlari. */
.giris-karti{border-radius:26px}
.modul-karti{border-radius:var(--yaricap-orta)}

/* Dar ekranda ic bosluklar yeniden daraltilir — yukaridaki 26/28px degeri
   yalnizca genis ekranlar icindir. */
@media(max-width:991px){
  .uygulama-icerigi{padding:20px}
  .ust-menu{padding:8px 14px}
}
@media(max-width:767px){
  .uygulama-icerigi{padding:16px}
  .kpi-karti{padding:18px 20px}
  .tsts-tablo th,.tsts-tablo td{padding:10px 12px}
  .panel-karti-basligi{padding:14px 16px}
}
@media(max-width:575px){
  .uygulama-icerigi{padding:12px}
  .uygulama-penceresi{border-radius:var(--yaricap-orta)}
  .uygulama-penceresi::-webkit-scrollbar-track{margin:var(--yaricap-orta) 0}
}

/* Hareket azaltma tercihi olan kullanicilarda gecisler kapanir. */
@media(prefers-reduced-motion:reduce){
  .ana-menu-baglantisi,.tsts-tablo tbody tr,.kurumsal-dugme{transition:none}
}

/* =============================================================================
   KOMPAKT OLCEK
   -----------------------------------------------------------------------------
   Onceki gorsel turda bosluklar ve yazi boyutlari BUYUTULMUSTU. Sonuc bir
   kurumsal panel icin fazla iriydi: butonlar tasacakmis gibi duruyor, ekranda
   daha az satir goruluyordu.

   Yogun veri gosteren bir panelde amac ferahlik degil OKUNAKLI YOGUNLUKTUR —
   ayni ekranda daha cok satir, daha az kaydirma. Asagidaki degerler o yonde
   geri cekilir.

   Palet ve kirilim noktalari DEGISMEDI.
   ============================================================================= */

/* Ust serit alcaltildi. */
.uygulama-kabugu{grid-template-rows:56px minmax(0,1fr) 26px}
.ust-menu{padding:6px 14px;gap:12px}
.ust-proje-kisaltmasi{width:28px;height:28px;border-radius:8px;font-size:.6rem}
.ust-proje-rozeti{gap:8px;padding:5px 9px;border-radius:10px}
.ust-proje-rozeti strong{font-size:.82rem;line-height:1.2}
.ust-proje-rozeti small{font-size:.66rem;line-height:1.15}
.ana-menu-baglantisi{padding:6px 10px;font-size:.86rem;border-radius:8px}
.kullanici-alani{gap:9px}
.kullanici-alani>span{font-size:.82rem;max-width:150px}
.cikis-dugmesi{font-size:.84rem;padding:5px 9px}

/* Ic bosluklar daraltildi. */
.uygulama-icerigi{padding:16px 18px}

/* Sayfa basligi kucultuldu. */
.sayfa-basligi{gap:12px}
.sayfa-simgesi{width:38px;height:38px;font-size:1rem;border-radius:10px}
.sayfa-basligi h1{font-size:1.2rem}
.sayfa-basligi small{font-size:.82rem}

/* KPI kartlari: rakam hala vurgulu ama kart cok daha alcak. */
.kpi-izgarasi{gap:12px;margin-top:14px}
.kpi-karti{padding:14px 16px;border-radius:10px}
.kpi-karti span{font-size:.78rem}
.kpi-karti strong{margin:3px 0 1px;font-size:clamp(1.25rem,1.05rem + .55vw,1.5rem)}
.kpi-karti small{font-size:.74rem}

/* Panel kartlari. */
.panel-karti{margin-top:14px;border-radius:10px}
.panel-karti-basligi{padding:10px 14px}
.panel-karti-basligi h2{font-size:.88rem}

/* Tablolar: satir yuksekligi dusuruldu, daha cok satir gorunur. */
.tsts-tablo{font-size:.85rem}
.tsts-tablo th,.tsts-tablo td{padding:7px 12px}
.tsts-tablo thead th{font-size:.7rem;letter-spacing:.05em}

/* Durum etiketleri kucultuldu. */
.durum-etiketi{padding:2px 8px;font-size:.7rem}

/* Dugmeler: asil sikayet buradaydi — yazi ve dolgu fazla iriydi. */
.kurumsal-dugme{padding:5px 12px;font-size:.82rem;font-weight:600;border-radius:7px}
.btn-sm.kurumsal-dugme{padding:4px 10px;font-size:.78rem}

/* Yikici islem dugmeleri KUCULTULMEZ: 44px dokunma hedefi bilincli bir
   karardir (acik pozisyon kapatir, yanlis basma maliyeti gercek paradir). */
.kapatma-dugmesi{min-height:44px;min-width:44px}

/* Diger bilesenler. */
.bilgi-kutusu{padding:9px 12px;font-size:.84rem;margin-top:10px}
.bos-durum{min-height:130px;font-size:.88rem}
.arac-cubugu{gap:8px;margin-top:12px}
.arac-cubugu label{font-size:.78rem}
.sayfalama{font-size:.84rem}
.sayfalama a,.sayfalama span{padding:4px 9px}
.yol-izi{font-size:.8rem;margin-bottom:8px}

@media(max-width:991px){
  .uygulama-kabugu{grid-template-rows:52px minmax(0,1fr) 26px}
  .uygulama-icerigi{padding:14px}
}
@media(max-width:767px){
  .uygulama-icerigi{padding:12px}
  .kpi-karti{padding:12px 14px}
  .tsts-tablo th,.tsts-tablo td{padding:6px 9px}
  .panel-karti-basligi{padding:9px 12px}
  .sayfa-basligi h1{font-size:1.1rem}
}
@media(max-width:575px){
  .uygulama-icerigi{padding:10px}
}

/* =============================================================================
   LOGO OLCUSU VE GIRIS EKRANI
   -----------------------------------------------------------------------------
   Referans: ayni sunucudaki Gelir Gider Takip paneli. Oradaki rozet daha
   kucuk ve dengeli; TSTS'te hem kare hem cevresindeki bosluk buyuktu, bu da
   basligi ezip rozeti sayfanin en agir ogesi haline getiriyordu.
   ============================================================================= */

/* --- Rozet (her iki ekran) --------------------------------------------------
   Kare kuculdu, bosluklar daraldi, yazi olculeri kareyle orantilandi. */
.proje-rozeti{top:20px;left:20px;gap:10px;padding:8px 13px;border-radius:14px}
.proje-kisaltmasi{width:36px;height:36px;border-radius:10px;font-size:.78rem;letter-spacing:.02em}
.proje-rozeti strong{font-size:.95rem;line-height:1.25}
.proje-rozeti small{font-size:.75rem;line-height:1.2}

.ust-proje-kisaltmasi{width:28px;height:28px;border-radius:8px;font-size:.6rem}
.ust-proje-rozeti{gap:8px;padding:5px 10px;border-radius:10px}
.ust-proje-rozeti strong{font-size:.8rem}
.ust-proje-rozeti small{font-size:.65rem}

.kurumsal-panel-metni{top:26px;right:24px}
.kurumsal-panel-metni small{font-size:.72rem;letter-spacing:.08em;opacity:.8}
.kurumsal-panel-metni strong{font-size:1rem}

/* --- Giris ekrani duzeni ----------------------------------------------------
   Baslik clamp tavani 6.2rem'di; genis ekranda satirlar ekrani doldurup
   rozetle carpisiyordu. Tavan indirildi, ust bosluk azaldi. */
/* DIKKAT — `grid-template-columns` BURADA TANIMLANMAZ.
   Dosyanin basindaki `@media(max-width:991px)` blogu bu izgarayi tek kolona
   indiriyor. Kosulsuz bir yeniden tanim BURADAN SONRA geldigi icin ayni
   ozgullukte kazanir ve o daraltmayi OLDURUR: 576/768'de giris karti iki
   kolonda kalip ekrandan tasar. Kolon tanimi asagida, min-width blogunda. */
.giris-duzeni{gap:5vw;padding:110px 3.2vw 74px}

/* Genis ekranda daha dar sag kolon (onceki 390-520px yerine 360-470px).
   `min-width` kullaniliyor ki dar ekrandaki tek kolona DOKUNMASIN. */
@media(min-width:992px){
  .giris-duzeni{grid-template-columns:1fr minmax(360px,470px)}
}
.giris-tanitimi h1{font-size:clamp(2.6rem,4.2vw,4.4rem);line-height:1.02;letter-spacing:-.025em}
.giris-tanitimi>p{margin:20px 0 32px;font-size:1.05rem;max-width:620px}

/* Ayni tuzak: `@media(max-width:767px)` bu kartlari tek kolona indiriyor.
   Kolon tanimi kosulsuz yazilamaz. */
.modul-kartlari{gap:12px}

@media(min-width:768px){
  .modul-kartlari{grid-template-columns:repeat(3,minmax(140px,190px))}
}
.modul-karti{padding:15px 17px;border-radius:12px}
.modul-karti strong{font-size:.95rem}
.modul-karti span{font-size:.82rem;opacity:.82;line-height:1.35}

/* --- Giris karti ------------------------------------------------------------ */
.giris-karti{padding:28px 28px 30px;border-radius:22px}
.giris-karti-basligi{gap:14px;margin-bottom:24px}
.giris-simgesi{width:52px;height:52px;border-radius:15px;padding:13px;color:var(--renk-acik-gri)}
.giris-simgesi svg{width:100%;height:100%;display:block}
.giris-karti-basligi small{font-size:.7rem;letter-spacing:.1em;opacity:.75}
.giris-karti-basligi h2{margin:2px 0 0;font-size:1.25rem;letter-spacing:-.02em}

.giris-karti label{display:block;margin:0 0 6px;font-size:.82rem;font-weight:500;opacity:.86}

/* --- Alan icindeki simge ----------------------------------------------------
   Simge alanin ICINDE durur; ayri bir sutun acmak dar ekranda tasma
   uretirdi. Isaretci gecirgen: simgeye tiklamak alani odaklamayi engellemez. */
.giris-alani{position:relative;margin-bottom:16px}
.giris-alani-simgesi{
  position:absolute;left:13px;top:50%;transform:translateY(-50%);
  width:18px;height:18px;pointer-events:none;
  color:var(--renk-metin-grisi);
}
.giris-alani-simgesi svg{width:100%;height:100%;display:block}
.giris-karti .form-control{min-height:46px;padding-left:40px;border-radius:11px;font-size:.94rem}
.giris-karti .form-control:focus{border-color:var(--renk-bordo);box-shadow:0 0 0 3px rgba(146,24,49,.22)}

/* --- Giris dugmesi ---------------------------------------------------------- */
.giris-dugmesi{
  display:flex;align-items:center;justify-content:center;gap:9px;
  min-height:46px;margin-top:4px;font-size:.95rem;font-weight:700;
  letter-spacing:.01em;border-radius:11px;
}
.giris-dugmesi svg{width:17px;height:17px;flex:0 0 auto}

.alert{border-radius:11px;font-size:.88rem;padding:10px 13px}

.giris-alt-bilgi{font-size:.8rem;opacity:.72}

@media(max-width:991px){
  .giris-duzeni{padding:96px 3.2vw 64px}
  .giris-tanitimi h1{font-size:clamp(2.2rem,6vw,3.2rem)}
}
@media(max-width:767px){
  .proje-rozeti{top:14px;left:14px;padding:7px 11px}
  .proje-kisaltmasi{width:32px;height:32px}
  .giris-duzeni{padding:84px 16px 56px}
  .giris-karti{padding:22px 20px 24px}
  .modul-kartlari{gap:10px}
}

/* --- Stratejiler ekrani (salt okunur bilgi) -------------------------------- */
.strateji-govdesi{padding:16px 18px;font-size:.88rem;line-height:1.6}
.strateji-govdesi p{margin:0 0 12px}
.strateji-ozet{font-size:.95rem;font-weight:500}
.strateji-alt-baslik{margin:16px 0 7px;font-size:.78rem;font-weight:600;
  letter-spacing:.05em;color:var(--renk-metin-grisi)}
.strateji-govdesi ul{margin:0 0 12px;padding-left:19px}
.strateji-govdesi li{margin-bottom:5px}
.strateji-kodu{display:block;margin-top:2px;font-size:.72rem;
  letter-spacing:.03em;color:var(--renk-metin-grisi)}
.strateji-yonler{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:0 22px}
.strateji-alt-bilgi{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;
  margin-top:14px;padding-top:12px;border-top:1px solid var(--renk-cizgi-grisi);
  font-size:.8rem;color:var(--renk-metin-grisi)}
.strateji-belge code{font-size:.78rem;color:var(--renk-metin-grisi)}

/* --- KPI kart renkleri ------------------------------------------------------
   Kartlar paletteki DORT kurumsal renk arasinda donusumlu kullanilir:
   lacivert, bordo, koyu yesil ve koyu gri. Amac ekranin tek renge
   bogulmamasi.

   Koyu gri paletteki `--renk-metin-grisi`dir; palette baska koyu gri YOKTUR
   (`--renk-panel-grisi` acik gridir ve `.panel-rengi` olarak zaten kullanilir).

   Kucuk metin bu zeminde tam opaklikta ve biraz daha kalin yazilir: acik gri
   uzerindeki kontrast oraninin sinirda kalmasi, soluk bir etiketi okunmaz
   hale getirirdi. */
.kpi-karti.gri{color:var(--renk-acik-gri);background:var(--renk-metin-grisi)}
.kpi-karti.gri span,.kpi-karti.gri small{opacity:1;font-weight:500}

/* --- Simge dugmeleri --------------------------------------------------------
   Metinli dugmeler tablo satirlarini gereksiz yukseltiyordu. Simge dugme kare
   ve dar; satir yuksekligi belirgin sekilde duser.

   ERISILEBILIRLIK: metin kayboldugu icin her simge dugmesinde `aria-label` ve
   `title` ZORUNLUDUR (bkz. sablonlar). Simgenin kendisi `aria-hidden`.

   OLCU: 38px. WCAG 2.2 AA asgari dokunma hedefi 24px'tir; bu onun rahatca
   ustunde ve metinli surumden dar. */
.simge-dugmesi{
  display:inline-grid;place-items:center;
  width:38px;height:38px;padding:0;
  border:1px solid transparent;border-radius:9px;
  background:transparent;color:var(--renk-lacivert);
  text-decoration:none;cursor:pointer;
  transition:background-color .15s ease,color .15s ease;
}
.simge-dugmesi svg{width:18px;height:18px;display:block}
.simge-dugmesi:hover{background:rgba(33,35,72,.08)}
.simge-dugmesi:focus-visible{outline:3px solid var(--renk-bordo);outline-offset:2px}

/* Filtre cubugu: dolu zeminli iki kare (referans panelle ayni dil). */
.simge-dugmesi.lacivert{color:var(--renk-acik-gri);background:var(--renk-lacivert)}
.simge-dugmesi.lacivert:hover{background:var(--renk-lacivert);filter:brightness(1.25)}
.simge-dugmesi.bordo{color:var(--renk-acik-gri);background:var(--renk-bordo)}
.simge-dugmesi.bordo:hover{background:var(--renk-bordo);filter:brightness(1.15)}

/* --- Kapatma dugmesi --------------------------------------------------------
   ONCEKI KARAR GUNCELLENDI. Daha once 44x44 metinli bir dugmeydi; gerekce
   "yanlis basmanin maliyeti gercek para" idi. Iki ayrim yapildi:

   PAPER  : gercek para YOK. 38px simge yeterli; onay istemi (confirm)
            yerinde duruyor ve asil koruma zaten odur.
   CANLI  : gercek para VAR. Dokunma hedefi 44px'te BIRAKILDI ve dugme dolu
            bordo zeminle ayirt edildi — iki farkli agirliktaki eylem ayni
            gorunmemeli. */
.kapatma-dugmesi{color:var(--renk-bordo);border-color:var(--renk-cizgi-grisi)}
.kapatma-dugmesi:hover{color:var(--renk-acik-gri);background:var(--renk-bordo);border-color:var(--renk-bordo)}

/* Dolu bordo + 44px: geri alinamaz eylemin ortak dili. Canli ekranda gercek
   para oldugu icin, paper satirinda ise iki zararsiz dugmeyle ayni hucreyi
   paylastigi icin gerekli. */
.kapatma-dugmesi.canli,
.satir-eylemleri .kapatma-dugmesi{
  width:44px;height:44px;
  color:var(--renk-acik-gri);background:var(--renk-bordo);border-color:var(--renk-bordo);
}
.kapatma-dugmesi.canli:hover,
.satir-eylemleri .kapatma-dugmesi:hover{background:var(--renk-bordo);filter:brightness(1.15)}
.kapatma-dugmesi.canli svg,
.satir-eylemleri .kapatma-dugmesi svg{width:20px;height:20px}

/* Simge dugme tasiyan hucre dar kalsin; satir gereksiz genislemesin. */
.tsts-tablo td:has(> form > .simge-dugmesi),
.tsts-tablo td:has(> .simge-dugmesi),
.tsts-tablo td.eylem-hucresi{width:1%;white-space:nowrap;padding-top:4px;padding-bottom:4px}

/* --- Satir eylemleri --------------------------------------------------------
   Bir satirin tum eylemleri (acilis grafigi, kapanis grafigi, kapatma) TEK
   hucrede yan yana durur. Ayri bir GRAFIK sutunu tabloyu bir sutun daha
   genisletiyordu; tablo zaten genis.

   IKI FARKLI AGIRLIK, IKI FARKLI OLCU:

   GRAFIK dugmeleri 30px. Yaptiklari sey yalnizca GORUNTULEMEK; yanlis basmanin
   maliyeti bir pencerenin acilip kapanmasidir. WCAG 2.2 AA asgari dokunma
   hedefi 24px'tir, 30px onun ustunde kalir.

   KAPATMA dugmesi 44px ve DOLU zeminli. Yaptigi sey GERI ALINAMAZ. Ayni
   hucrede iki zararsiz dugmenin yanina girdigi icin olcu, dolgu ve ikon
   olmak uzere UC ayri isaretle ayrisir; tek basina renk yetmezdi, cunku
   kapanis grafigi de bordo.

   NOT — ONCEKI KARAR DEGISTI: paper kapatma dugmesi daha once 38px sade bir
   dugmeydi ve gerekcesi "paper'da gercek para yok, onay istemi yeterli" idi.
   O gerekce dugme TEK BASINA dururken geciyordu. Artik gorsel olarak ayrisma
   ihtiyaci belirleyici; olcu canli ekranla ayni seviyeye cikarildi.

   Kapatma oncesindeki bosluk de bu yuzden BILEREK. */
.satir-eylemleri{display:flex;align-items:center;gap:2px}
.satir-eylemleri form:not(:first-child){margin-left:9px}
.satir-eylemleri .grafik-dugmesi{width:30px;height:30px;border-radius:8px}
.satir-eylemleri .grafik-dugmesi svg{width:15px;height:15px}

/* Asama rengi: acilis koyu yesil (pozisyona giris), kapanis bordo (cikis).
   Ayni renk ciftini grafigin kendisi de kullanir — yukselen mum yesil,
   alcalan bordo — yani ikonun rengi acacagi seyi onceden soyler. */
.grafik-dugmesi.acilis{color:var(--renk-koyu-yesil)}
.grafik-dugmesi.kapanis{color:var(--renk-bordo)}

/* --- Filtre cubugu yerlesimi ------------------------------------------------
   `.dugme-grubu` ayni zamanda `.alan` sinifini tasir ve oradan
   `flex-direction:column` miras alir. Metinli dugmelerde bu fark edilmiyordu;
   simge dugmelere gecince iki kare ALT ALTA dizildi ve satir gereksiz
   yukseldi. Yon acikca yataya sabitlenir.

   `flex:0 0 auto` — dugme grubu, filtre alanlari gibi buyuyup bos yer
   kaplamasin; genisligi icerigi kadar olsun. */
.arac-cubugu .alan.dugme-grubu{
  flex-direction:row;
  align-items:flex-end;
  flex:0 0 auto;
  min-width:0;
  gap:8px;
}

/* Baslik ile filtreler arasindaki bosluk daraltildi. */
.arac-cubugu{margin-top:8px}
.arac-cubugu .alan{gap:3px}
.arac-cubugu label{font-size:.76rem;margin:0}

/* --- Grafik penceresi -------------------------------------------------------
   Mumlar acilis/kapanis aninda toplanip saklanir; bu ekran onlari yalnizca
   cizer. Renkler paletten gelir: yukselen mum koyu yesil, alcalan bordo. */
.grafik-alani{width:100%;height:420px;border-radius:var(--yaricap-kucuk);overflow:hidden}
.grafik-icerik{border-radius:var(--yaricap-orta)}
.grafik-alt-baslik{display:block;margin-top:2px;font-size:.78rem;color:var(--renk-metin-grisi)}
.grafik-lejant{display:flex;flex-wrap:wrap;gap:14px;margin-top:12px;font-size:.8rem}
.grafik-lejant-kalemi{display:inline-flex;align-items:center;gap:6px;color:var(--renk-metin-grisi)}
.grafik-lejant-kalemi i{width:10px;height:10px;border-radius:3px;display:inline-block}

@media(max-width:767px){
  .grafik-alani{height:300px}
}