/* SAHNE · CARİ HESAP VE VELİ EKSTRESİ (includes/scenes/ledger.php) — 5 adım (data-steps="5" = en yüksek .s5):
   s0 Tuna Yılmaz · Tek öğrenci ekstresi (5 hareket, yürüyen bakiye) · s1 «Kapsam» açılır · s2 «Veli birleşik»: Veli alanı,
   ÖĞRENCİ sütunu, Rıza'nın hareketleri araya girer, kartlar ileri sayar · s3 sayfa kayar: TOPLAM + bakiye notu ·
   s4 yukarı, «PDF» · s5 PDF ekstre (son adım; hareket azaltmada durağan kare).
   Telefon (≤ 470 px): s1 «Filtrele» tetikleyicisi → alt yaprak → KAPSAM; s2 yaprak kapanır; s4 sayfa kaymış kalır, şeritteki PDF.
   Ölçüler .ldg-win değişkenlerinde; kaydırma miktarı blok yüksekliklerinden HESAPLANIR (kap genişliği değişse de doğru yere iner).
   --c1: s1'de KAPSAM imlecinin gecikmesi (telefonda önce yaprak açılır) · --c4: s4'te PDF imlecinin gecikmesi. */
@property --ldg-a { syntax: '<integer>'; inherits: false; initial-value: 0; }
@property --ldg-b { syntax: '<integer>'; inherits: false; initial-value: 0; }
@property --ldg-og { syntax: '<length>'; inherits: true; initial-value: 0px; }

.ldg { container-type: inline-size; --d: 0s; --ldg-spring: cubic-bezier(.34, 1.56, .64, 1); --ldg-scroll: cubic-bezier(.32, .12, .2, 1); }
.ldg.s2 { --d: .75s; } .ldg.s3 { --d: 0s; }
.ldg-win {
  --H: 448px; --top: 34px; --ph: 62px; --fh: 60px; --kh: 46px; --g: 9px; --rh: 20px; --px: 14px; --dp: 12px; --c1: .3s; --c4: .5s;
  /* BORÇ/ALACAK 78 px: kalın TOPLAM tutarı (64,7 px) 6 px iç boşlukla sığar; ÖĞRENCİ 66 px («Tuna Yılmaz» + 6 + 6) */
  --og: 66px; --cols: 62px minmax(0, 1fr) var(--ldg-og) 78px 78px 78px;
  --sc: calc(var(--ph) + var(--fh) + var(--kh) + 3 * var(--g) - 8px);
  --line: #e4e4e7; --line-2: #d4d4d8; --ink: #18181b; --mut: #71717a;
  position: relative; height: var(--H); background: #f6f7f9; transition: --ldg-og .5s var(--ui-ease) .75s;
}
.ldg.s2 .ldg-win { --ldg-og: var(--og); }
.ldg-i { width: 14px; height: 14px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

/* çapraz geçiş: iki durum aynı ızgara hücresinde; on-0-2 = 2. adıma dek, on-2 = 2. adımdan itibaren */
.ldg-x { display: inline-grid; min-width: 0; vertical-align: top; }
.ldg-x > * { grid-area: 1 / 1; min-width: 0; }
.ldg [class*="on-"] { opacity: 0; transform: translateY(3px); transition: opacity .3s var(--ui-ease) var(--d), transform .35s var(--ui-ease) var(--d); }
.ldg:not(.s2) .on-0-2, .ldg.s2 .on-2 { opacity: 1; transform: none; }

/* imleç: .ldg-hit tıklama noktası; ok ucu orada, halka dalgası çevresinde */
.ldg-hit { position: absolute; z-index: 7; width: 0; height: 0; pointer-events: none; }
.ldg-hit .ui-cur { left: -5px; top: -3px; transform: translate(14px, 12px); transition: opacity .2s var(--ui-ease); }
.ldg-rip { position: absolute; left: -11px; top: -11px; width: 22px; height: 22px; border-radius: 50%; box-shadow: 0 0 0 2px rgba(29, 79, 134, .55); opacity: 0; }
@keyframes ldg-cur { 0% { opacity: 0; transform: translate(14px, 12px); } 34% { opacity: 1; transform: none; scale: 1; } 50% { scale: .8; } 64%, 100% { opacity: 1; transform: none; scale: 1; } }
@keyframes ldg-cur-out { 0% { opacity: 0; transform: translate(-6px, -22px); } 30% { opacity: 1; transform: none; scale: 1; } 44% { scale: .8; } 56% { scale: 1; } 76% { opacity: 1; transform: none; } 100% { opacity: 0; transform: none; } }
@keyframes ldg-rip { 0% { opacity: 0; scale: .25; } 12% { opacity: .9; } 100% { opacity: 0; scale: 1.7; } }
@keyframes ldg-push { 50% { scale: .94; } }
@keyframes ldg-new { 0%, 35% { background-color: #e8f0fa; } 100% { background-color: rgba(232, 240, 250, 0); } }

/* ── üst şerit (uygulama kabuğu) ── */
.ldg-top { position: relative; z-index: 3; display: flex; align-items: center; gap: 8px; height: var(--top); padding: 0 12px; background: #fff; box-shadow: inset 0 -1px 0 var(--ui-line); }
.ldg svg.ldg-logo { flex: none; width: 22px; height: 22px; border-radius: 50%; box-shadow: 0 1px 3px rgba(16, 37, 64, .3); }
.ldg-term { flex: none; display: inline-flex; align-items: center; gap: 5px; height: 24px; padding: 0 6px 0 7px; border-radius: 7px; background: #fff; box-shadow: inset 0 0 0 1px var(--ui-line-2);
  font-size: 11px; font-weight: 700; color: var(--ui-text); font-variant-numeric: tabular-nums; }
.ldg-term .ldg-i { width: 12px; height: 12px; color: var(--ui-muted); }
.ldg-crumb { flex: 1; min-width: 0; display: flex; align-items: center; gap: 3px; font-size: 11px; font-weight: 600; color: var(--ui-muted); white-space: nowrap; }
.ldg-crumb__k { display: inline-flex; align-items: center; gap: 3px; }
.ldg-crumb .ldg-i { width: 11px; height: 11px; color: #a1a1aa; }
.ldg-crumb b { font-weight: 800; color: var(--ui-text); }
.ldg-tb-i { position: relative; flex: none; display: grid; place-items: center; width: 24px; height: 24px; color: #3f3f46; }
.ldg-tb-i .ldg-i { width: 15px; height: 15px; }
.ldg-bell em { position: absolute; top: -2px; right: -3px; display: grid; place-items: center; min-width: 15px; height: 15px; padding: 0 3px; border-radius: 8px; background: #dc2626; box-shadow: 0 0 0 1.5px #fff;
  font-style: normal; font-size: 10px; font-weight: 800; line-height: 1; color: #fff; }
.ldg-av { flex: none; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: linear-gradient(135deg, var(--navy-soft), var(--navy)); color: #fff; font-size: 11px; font-weight: 800;
  box-shadow: 0 0 0 1.5px #fff, 0 1px 3px rgba(16, 37, 64, .35); }
.ldg-burger, .ldg-mt, .ldg-mpdf, .ldg-more { display: none; }
.ldg-mt { flex: 1; min-width: 0; font-size: 14px; font-weight: 800; letter-spacing: -.01em; color: var(--ui-text); white-space: nowrap; }
.ldg-mpdf { position: relative; flex: none; place-items: center; width: 28px; height: 28px; border-radius: 8px; color: #fff; background: linear-gradient(135deg, var(--navy-soft), var(--navy));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18), 0 1px 2px rgba(16, 37, 64, .25); }
.ldg-mpdf .ldg-hit { right: 7px; bottom: 7px; }

/* ── sayfa (kayan içerik) ── */
.ldg-pg { position: absolute; z-index: 1; left: 0; right: 0; top: var(--top); bottom: 0; overflow: hidden; }
.ldg-pg::after { content: ""; position: absolute; z-index: 2; left: 0; right: 0; bottom: 0; height: 14px; background: linear-gradient(rgba(246, 247, 249, 0), #f6f7f9); pointer-events: none; transition: opacity .3s var(--ui-ease) .4s; }
.ldg.s3:not(.s4) .ldg-pg::after { opacity: 0; }
.ldg-scr { padding: 0 var(--px) 16px; translate: 0 0; transition: translate .75s var(--ldg-scroll) .1s; }
.ldg.s3:not(.s4) .ldg-scr { translate: 0 calc(-1 * var(--sc)); transition-duration: .95s; transition-delay: .15s; }
.ldg-sbar { position: absolute; z-index: 3; right: 3px; top: 6px; bottom: 6px; width: 4px; opacity: 0; transition: opacity .3s var(--ui-ease) .2s; }
.ldg-sbar > i { display: block; height: 46%; border-radius: 2px; background: rgba(16, 37, 64, .3); transition: translate .75s var(--ldg-scroll) .1s; }
.ldg.s3:not(.s5) .ldg-sbar { opacity: 1; transition-delay: 0s; }
.ldg.s3:not(.s4) .ldg-sbar > i { translate: 0 117%; transition-duration: .95s; transition-delay: .15s; }

/* başlık: Geri · Cari Ekstre (?) · açıklama · PDF / Yazdır */
.ldg-ph { position: relative; height: var(--ph); padding-top: 9px; }
.ldg-back { display: flex; align-items: center; gap: 4px; height: 14px; font-size: 10.5px; font-weight: 700; color: var(--ui-muted); }
.ldg-back .ldg-i { width: 12px; height: 12px; }
.ldg-ph__t { display: flex; align-items: center; gap: 7px; height: 22px; margin-top: 2px; }
.ldg-ph__t b { font-size: 17px; font-weight: 800; letter-spacing: -.02em; color: #0f172a; }
.ldg-help { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: var(--ui-primary-soft); color: var(--navy-soft); box-shadow: inset 0 0 0 1px #c9d9ee; }
.ldg-help .ldg-i { width: 13px; height: 13px; }
.ldg-ph__d { display: block; height: 15px; margin-top: 1px; font-size: 11.5px; font-weight: 600; line-height: 15px; color: #52525b; white-space: nowrap; }
.ldg-acts { position: absolute; top: 15px; right: 0; display: flex; gap: 6px; }
.ldg-btn { position: relative; display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 11px; border-radius: 9px; font-size: 11.5px; font-weight: 800; white-space: nowrap; }
.ldg-btn .ldg-i { width: 14px; height: 14px; }
.ldg-btn--pdf { color: #fff; background: linear-gradient(135deg, var(--navy-soft), var(--navy));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18), 0 1px 2px rgba(16, 37, 64, .2), 0 6px 14px -8px rgba(20, 61, 107, .75); }
.ldg-btn--pr { color: #27272a; background: #fff; box-shadow: inset 0 0 0 1px var(--line-2), 0 1px 2px rgba(16, 37, 64, .06); }
.ldg-btn--pr .ldg-i { color: #52525b; }
.ldg-btn--pdf .ldg-hit { right: 16px; bottom: 9px; }
.ldg.s4:not(.s5) .ldg-btn--pdf, .ldg.s4:not(.s5) .ldg-mpdf { animation: ldg-push .3s var(--ui-ease) calc(var(--c4) + .35s); }
.ldg.s4:not(.s5) .ldg-hit--pdf .ui-cur, .ldg.s4:not(.s5) .ldg-hit--mpdf .ui-cur { animation: ldg-cur .9s var(--ui-ease) var(--c4) both; }
.ldg.s4:not(.s5) .ldg-hit--pdf .ldg-rip, .ldg.s4:not(.s5) .ldg-hit--mpdf .ldg-rip { animation: ldg-rip .55s ease-out calc(var(--c4) + .35s) both; }

/* ── süzgeç: KAPSAM · VELİ · BAŞLANGIÇ · BİTİŞ · Filtrele ── */
.ldg-flt { position: relative; z-index: 4; display: flex; flex-wrap: wrap; align-items: flex-end; align-content: center; gap: 8px; height: var(--fh); margin-top: var(--g); padding: 0 10px; border-radius: 12px; background: #fff;
  box-shadow: 0 0 0 1px var(--ui-line), 0 1px 2px rgba(16, 37, 64, .05), inset 0 1px 0 rgba(255, 255, 255, .6); }
.ldg-fld { position: relative; flex: none; min-width: 0; }
.ldg-lbl { display: block; height: 13px; margin-bottom: 3px; font-size: 10px; font-weight: 800; line-height: 13px; letter-spacing: .03em; color: var(--mut); white-space: nowrap; }
.ldg-sel, .ldg-in { position: relative; display: flex; align-items: center; gap: 6px; height: 28px; padding: 0 8px 0 9px; border-radius: 8px; background: #fff; font-size: 11.5px; font-weight: 700; color: var(--ink);
  white-space: nowrap; box-shadow: inset 0 0 0 1px var(--line-2), 0 1px 1px rgba(16, 37, 64, .03); transition: box-shadow .25s var(--ui-ease); }
.ldg-sel > :first-child { flex: 1; }
.ldg-chev { width: 13px; height: 13px; color: var(--mut); }
.ldg-in { font-weight: 600; font-variant-numeric: tabular-nums; }
.ldg-in .ldg-i { width: 13px; height: 13px; margin-left: auto; color: #3f3f46; }
.ldg-fld--kap { width: 112px; }
.ldg-fld--veli { width: 126px; max-width: 0; margin-left: -8px; overflow: hidden; opacity: 0;
  transition: max-width .5s var(--ui-ease) .75s, margin-left .5s var(--ui-ease) .75s, opacity .3s var(--ui-ease) .9s; }
.ldg.s2 .ldg-fld--veli { max-width: 126px; margin-left: 0; opacity: 1; }
.ldg-fld--dt { width: 100px; }
.ldg-br { display: none; }
.ldg-go { flex: none; display: grid; place-items: center; height: 28px; padding: 0 11px; border-radius: 8px; background: #fff; font-size: 11.5px; font-weight: 800; color: var(--ink);
  box-shadow: inset 0 0 0 1px var(--line-2), 0 1px 2px rgba(16, 37, 64, .05); }
.ldg-fld--kap .ldg-sel .ldg-hit { right: 20px; bottom: 9px; }
.ldg.s1:not(.s2) .ldg-fld--kap .ldg-sel { box-shadow: inset 0 0 0 1px var(--navy-soft), 0 0 0 3px rgba(29, 79, 134, .15); transition-delay: calc(var(--c1) + .4s); }
.ldg.s1:not(.s2) .ldg-hit--kap .ui-cur { animation: ldg-cur .85s var(--ui-ease) var(--c1) both; }
.ldg.s1:not(.s2) .ldg-hit--kap .ldg-rip { animation: ldg-rip .55s ease-out calc(var(--c1) + .38s) both; }
/* açılır seçenek listesi (yerel seçici) */
.ldg-menu { position: absolute; z-index: 8; left: 0; top: calc(100% + 4px); width: 150px; padding: 4px; border-radius: 10px; background: #fff;
  box-shadow: 0 0 0 1px rgba(16, 37, 64, .1), 0 2px 4px rgba(16, 37, 64, .06), 0 14px 28px -10px rgba(16, 37, 64, .4);
  opacity: 0; scale: .96; transform-origin: 20% 0; transition: opacity .18s var(--ui-ease) .5s, scale .18s var(--ui-ease) .5s; }
.ldg.s1:not(.s2) .ldg-menu { opacity: 1; scale: 1; transition-delay: calc(var(--c1) + .42s); }
.ldg-opt { position: relative; display: flex; align-items: center; gap: 6px; height: 28px; padding: 0 8px 0 6px; border-radius: 6px; font-size: 11.5px; font-weight: 600; color: var(--ink); white-space: nowrap;
  transition: background-color .15s var(--ui-ease) .28s, color .15s var(--ui-ease) .28s; }
.ldg-opt .ldg-i { width: 13px; height: 13px; stroke-width: 2.4; color: var(--navy-soft); }
.ldg-opt--vb .ldg-i { visibility: hidden; }
.ldg-opt--on { background: #f1f4f8; font-weight: 700; }
.ldg.s2 .ldg-opt--vb { background: var(--navy-soft); color: #fff; }
.ldg.s2 .ldg-opt--on { background: #fff; transition-delay: .28s; }
.ldg-opt--vb .ldg-hit { left: 68px; top: 15px; }
.ldg.s2:not(.s3) .ldg-hit--opt .ui-cur { animation: ldg-cur-out .95s var(--ui-ease) both; }
.ldg.s2:not(.s3) .ldg-hit--opt .ldg-rip { animation: ldg-rip .5s ease-out .3s both; }

/* ── özet kartları (ileri sayar) ── */
.ldg-kt { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; height: var(--kh); margin-top: var(--g); }
.ldg-k { display: block; min-width: 0; padding: 7px 10px 0; border-radius: 11px; background: #fff;
  box-shadow: 0 0 0 1px var(--ui-line), 0 1px 2px rgba(16, 37, 64, .05), inset 0 1px 0 rgba(255, 255, 255, .6); }
.ldg-k small { display: block; height: 13px; font-size: 10px; font-weight: 800; line-height: 13px; letter-spacing: .03em; color: var(--mut); white-space: nowrap; }
.ldg-n { display: block; margin-top: 3px; font-size: 14.5px; font-weight: 800; line-height: 18px; letter-spacing: -.01em; color: #52525b; font-variant-numeric: tabular-nums; white-space: nowrap;
  counter-reset: la var(--ldg-a) lb var(--ldg-b); transition: --ldg-a 1s var(--ui-ease) calc(.8s + var(--i, 0) * 70ms), --ldg-b 1s var(--ui-ease) calc(.8s + var(--i, 0) * 70ms); }
.ldg-n::after { content: counter(la) "." counter(lb) ",00\00a0₺"; }
.ldg-k:nth-child(1) .ldg-n { --i: 0; } .ldg-k:nth-child(2) .ldg-n { --i: 1; } .ldg-k:nth-child(3) .ldg-n { --i: 2; } .ldg-k:nth-child(4) .ldg-n { --i: 3; }
.ldg-k--ba .ldg-n { color: #dc2626; }
.ldg-k--vg .ldg-n { color: #d97706; }
.ldg-n--bo { --ldg-a: 120; --ldg-b: 600; } .ldg.s2 .ldg-n--bo { --ldg-a: 251; --ldg-b: 550; }
.ldg-n--al { --ldg-a: 60; --ldg-b: 300; } .ldg.s2 .ldg-n--al { --ldg-a: 147; --ldg-b: 600; }
.ldg-n--ba, .ldg-n--vg { --ldg-a: 60; --ldg-b: 300; } .ldg.s2 .ldg-n--ba, .ldg.s2 .ldg-n--vg { --ldg-a: 103; --ldg-b: 950; }

/* ── ekstre belgesi (ekranda ve PDF'te aynı gövde) ── */
.ldg-doc { margin-top: var(--g); padding: 10px var(--dp); border-radius: 14px; background: #fff;
  box-shadow: 0 0 0 1px var(--ui-line), 0 1px 2px rgba(16, 37, 64, .05), 0 14px 30px -22px rgba(16, 37, 64, .45), inset 0 1px 0 rgba(255, 255, 255, .6); }
.ldg-org { font-size: 10.5px; font-weight: 700; line-height: 13px; color: #52525b; text-align: center; }
.ldg-ttl { margin-top: 1px; font-size: 14px; font-weight: 800; line-height: 19px; letter-spacing: .1em; color: var(--ink); text-align: center; }
.ldg-sub { display: grid; justify-items: center; margin: 1px 0 7px; padding-bottom: 6px; border-bottom: 2px solid var(--ink); font-size: 10px; font-weight: 600; line-height: 13px; color: #52525b; white-space: nowrap; font-variant-numeric: tabular-nums; }
.ldg-sub .ldg-x { justify-items: center; }
.ldg-tbl { border: 1px solid var(--line-2); font-size: 10px; line-height: 13px; color: var(--ink); font-variant-numeric: tabular-nums; }
.ldg-tb { position: relative; height: calc(5 * var(--rh)); transition: height .55s var(--ui-ease) .75s; }
.ldg.s2 .ldg-tb { height: calc(10 * var(--rh)); }
.ldg-tr { display: grid; grid-template-columns: var(--cols); align-items: center; height: var(--rh); box-shadow: inset 0 1px 0 var(--line); }
.ldg-tr > * { min-width: 0; height: 100%; display: flex; align-items: center; padding: 0 6px; white-space: nowrap; overflow: hidden; }
.ldg-tr > * + * { box-shadow: inset 1px 0 0 var(--line); }
/* tarih sütunu 62 px: «05.08.2026» (53,8 px) iki yanda 4 px boşlukla sığar (6 px'te sağ iç boşluğa taşıyordu) */
.ldg-tr > :first-child { padding: 0 4px; }
.ldg-tr--h { height: 18px; box-shadow: none; background: #f4f4f5; font-size: 10px; font-weight: 800; letter-spacing: .02em; color: #3f3f46; }
.ldg-tb .ldg-tr { --y: var(--y0); --tx: 0px; position: absolute; left: 0; right: 0; top: 0; translate: var(--tx) calc(var(--y) * var(--rh));
  transition: translate .55s var(--ui-ease) .75s, opacity .35s var(--ui-ease) .75s; }
.ldg.s2 .ldg-tb .ldg-tr { --y: var(--y1); }
.ldg-tb .ldg-tr--new { --tx: -10px; opacity: 0; transition-delay: calc(.85s + var(--i) * 70ms); }
.ldg.s2 .ldg-tb .ldg-tr--new { --tx: 0px; opacity: 1; }
.ldg.s2:not(.s3) .ldg-tr--new { animation: ldg-new 1s ease-out calc(.95s + var(--i) * 70ms) both; }
.ldg-tr .c-bo, .ldg-tr .c-al, .ldg-tr .c-ba { justify-content: flex-end; }
.ldg-tr .c-ba { font-weight: 800; }
.ldg-tr .c-ba .ldg-x { justify-items: end; }
.c-ac b { font-weight: 400; }
.ac-t { min-width: 0; overflow: hidden; text-overflow: clip; }
.c-ac em { font-style: normal; color: var(--mut); white-space: pre; }
.ldg-tr .c-og { padding: 0; }
.c-og > span { padding: 0 6px; }
.og-s { display: none; }
.ldg-tbl:not(.ldg-tbl--pdf) .c-og > span { opacity: 0; transition: opacity .3s var(--ui-ease) .9s; }
.ldg.s2 .ldg-tbl .c-og > span { opacity: 1; }
.ldg-tr--f { height: var(--rh); background: #fafafa; font-weight: 800; }
.ldg-tr--f .c-tp { grid-column: 1 / 4; }
.ldg-note { margin-top: 8px; padding: 5px 8px; border: 1px solid var(--line-2); font-size: 10.5px; line-height: 14px; color: var(--ink); font-variant-numeric: tabular-nums; }
.ldg-note b { font-weight: 800; }
.ldg-note .ldg-x { display: grid; }
.ldg-foot { margin-top: 6px; font-size: 10px; font-weight: 600; line-height: 13px; color: var(--mut); text-align: right; font-variant-numeric: tabular-nums; }

/* ── telefon parçaları (yalnız ≤ 470 px kapta görünür): «Filtrele» tetikleyicisi + alt yaprak ── */
.ldg-trig, .ldg-msh { display: none; }
.ldg-trig { position: relative; align-items: center; gap: 7px; height: var(--th, 32px); margin-top: var(--g); padding: 0 9px 0 10px; border-radius: 10px; background: #fff;
  box-shadow: 0 0 0 1px #e4e4e7, 0 1px 2px rgba(24, 24, 27, .05), inset 0 1px 0 rgba(255, 255, 255, .6); font-size: 12px; font-weight: 800; color: #3f3f46; }
.ldg-trig > .ldg-i:first-child { width: 15px; height: 15px; stroke-width: 2.2; }
.ldg-cnt { margin-left: auto; display: grid; place-items: center; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; background: var(--navy-soft); color: #fff;
  font-size: 10px; font-weight: 800; line-height: 1; font-variant-numeric: tabular-nums; }
.ldg-cnt .ldg-x { justify-items: center; }
.ldg-trig .ldg-chev { width: 14px; height: 14px; stroke-width: 2.2; opacity: .45; color: currentColor; }
.ldg-trig .ldg-hit { left: 46px; top: 17px; }
@keyframes ldg-pop { 40% { scale: 1.22; } }
.ldg.s1:not(.s2) .ldg-trig { animation: ldg-push .3s var(--ui-ease) .3s; }
.ldg.s1:not(.s2) .ldg-hit--trig .ui-cur { animation: ldg-cur-out .8s var(--ui-ease) both; }
.ldg.s1:not(.s2) .ldg-hit--trig .ldg-rip { animation: ldg-rip .5s ease-out .3s both; }
.ldg.s2:not(.s3) .ldg-cnt { animation: ldg-pop .45s var(--ldg-spring) .8s; }
/* alttan açılan yaprak: karartma + üst köşeleri yuvarlak panel; KAPSAM değişince form gönderilir → sayfayla birlikte kapanır */
.ldg-msh { position: absolute; z-index: 9; inset: 0; opacity: 0; pointer-events: none; transition: opacity .25s var(--ui-ease) .5s; }
.ldg.s1:not(.s2) .ldg-msh { opacity: 1; transition-duration: .2s; transition-delay: .38s; }
.ldg-msh__scrim { position: absolute; inset: 0; background: rgba(0, 0, 0, .42); }
.ldg-msh__p { position: absolute; left: 0; right: 0; bottom: 0; padding: 7px 12px 14px; border-radius: 18px 18px 0 0; background: #fff;
  box-shadow: 0 -10px 30px -14px rgba(0, 0, 0, .45); translate: 0 100%; transition: translate .32s cubic-bezier(.32, .72, 0, 1) .38s; }
.ldg.s1 .ldg-msh__p { translate: 0 0; }
.ldg-msh__grab { display: block; width: 34px; height: 4px; margin: 0 auto 10px; border-radius: 999px; background: #d4d4d8; }
.ldg-msh__h { display: flex; align-items: center; justify-content: space-between; height: 20px; margin-bottom: 10px; }
.ldg-msh__h b { font-size: 14px; font-weight: 800; color: var(--ink); }
.ldg-msh__h span { font-size: 12px; font-weight: 800; color: var(--navy-soft); }
/* form yaprakta kendi kartını korur (admin-ledger-detail.php:211 rounded-2xl border-2 p-3) */
.ldg-msh__f { display: block; padding: 10px; border-radius: 12px; background: #fff; box-shadow: 0 0 0 1px var(--ui-line), 0 1px 2px rgba(16, 37, 64, .05); }
.ldg-msh .ldg-fld { display: block; width: auto; margin-bottom: 8px; }
.ldg-msh .ldg-go { height: 30px; }
/* açılır liste BAŞLANGIÇ alanını örter, BİTİŞ etiketine binmez (3 + 25 + 25 + 3 = 56 px; etiket seçicinin 60 px altında) */
.ldg-msh .ldg-menu { top: calc(100% + 3px); right: 0; width: auto; padding: 3px; }
.ldg-msh .ldg-opt { height: 25px; }

/* ── PDF (A4 dikey sayfa: yükseklik = genişlik × 297/210; sayfanın boş alt kısmı pencerenin dışında kalır) ── */
.ldg-pdf { position: absolute; z-index: 10; inset: 0; background: rgba(11, 26, 48, .36); opacity: 0; pointer-events: none; transition: opacity .35s var(--ui-ease); }
.ldg.s5 .ldg-pdf { opacity: 1; }
.ldg-file { display: flex; align-items: center; gap: 7px; width: max-content; max-width: calc(100% - 24px); height: 28px; margin: 9px auto 0; padding: 0 5px 0 4px; border-radius: 9px; background: #fff;
  box-shadow: 0 0 0 1px rgba(16, 37, 64, .08), 0 6px 16px -8px rgba(0, 0, 0, .45); opacity: 0; translate: 0 -6px; transition: opacity .3s var(--ui-ease) .45s, translate .45s var(--ldg-spring) .45s; }
.ldg-file__i { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 6px; background: #fee2e2; color: #b91c1c; }
.ldg-file__i .ldg-i { width: 13px; height: 13px; }
.ldg-file b { min-width: 0; font-size: 11px; font-weight: 700; color: var(--ink); white-space: nowrap; }
.ldg-file__d { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 6px; background: #ecfdf5; color: #047857; }
.ldg-file__d .ldg-i { width: 12px; height: 12px; stroke-width: 2.4; }
.ldg.s5 .ldg-file { opacity: 1; translate: 0 0; }
/* 641 px kapta da açıklama 222 px: «Tahsilat · bank_transfer (EFT…)» (209,3 px) + 6 + 6 sığar; ÖĞRENCİ 65 px («Tuna Yılmaz» 53,4 px);
   tutar sütunları 78 px (kalın TOPLAM tutarı 64,7 px, iki yanda ≥ 6 px) */
.ldg-sheet { --cols: 62px minmax(0, 1fr) 65px 78px 78px 76px; --rh: 16px;
  width: min(calc(100% - 24px), 620px); aspect-ratio: 210 / 297; margin: 8px auto 0; padding: 18px 16px 12px; border-radius: 2px; background: #fff;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, .06), 0 2px 4px rgba(0, 0, 0, .1), 0 28px 50px -18px rgba(0, 0, 0, .55);
  opacity: 0; translate: 0 34px; transition: opacity .3s var(--ui-ease) .1s, translate .65s cubic-bezier(.3, 1.2, .5, 1) .1s; }
.ldg.s5 .ldg-sheet { opacity: 1; translate: 0 0; }
.ldg-sheet .ldg-sub { margin-bottom: 8px; }
.ldg .ldg-tbl--pdf .ldg-tb { height: auto; }
.ldg .ldg-tbl--pdf .ldg-tb .ldg-tr { position: static; translate: none; opacity: 1; }
.ldg-tbl--pdf .ldg-tr--h { height: 16px; }

/* ── 640 px ve altı: tahsilat referansı «(EFT…)» açıklama sütununa sığmaz → gizlenir (ekranda ve PDF'te) ── */
@container (max-width: 640px) {
  .c-ac em { display: none; }
}

/* ── ORTA KAP (≤ 600 px): iki satırlı süzgeç, kısa tablo (Tarih · Açıklama · Öğrenci · Bakiye) ── */
@container (max-width: 600px) {
  .ldg-win { --H: 480px; --ph: 46px; --fh: 112px; --cols: 62px minmax(0, 1fr) var(--ldg-og) 78px; --og: 76px; }
  .ldg-back { display: none; }
  .ldg-ph { padding-top: 6px; }
  .ldg-acts { top: 7px; }
  .ldg-crumb__k, .ldg-term { display: none; }
  .ldg-flt { align-content: center; row-gap: 8px; padding: 0 10px; }
  .ldg-br { display: block; flex-basis: 100%; height: 0; }
  .ldg-fld--veli { margin-left: 0; }
  .ldg-kt { gap: 6px; }
  .ldg-n { font-size: 13px; }
  .ldg-k { padding: 7px 7px 0; }
  .ldg-tr .c-bo, .ldg-tr .c-al { display: none; }
  .ldg-sheet { --cols: 62px minmax(0, 1fr) 76px 78px; width: calc(100% - 24px); padding: 14px 14px 10px; }
}

/* ── TELEFON (≤ 470 px): uygulamanın mobil kabuğu (1024 px altı) — başlık şeritte + PDF simge düğmesi; süzgeç «Filtrele»
   tetikleyicisinin arkasında (alt yaprak); kartlar tek sütun; tablo yana kayar (sağda solma). ── */
@container (max-width: 470px) {
  .ldg-win { --H: 480px; --top: 40px; --ph: 0px; --th: 32px; --kh: calc(4 * 38px + 3 * 6px); --g: 8px; --px: 10px; --dp: 10px; --og: 76px;
    --c1: .8s; --c4: .15s;
    /* açıklama sütunu en az doğal genişliği (209,3 + 12 px); geniş telefon kabında görünen alanın 24 px öncesinde biter →
       sonraki sütun her genişlikte yalnız 28 px solmanın altında başlar (BORÇ/ALACAK yarıdan kesik görünmez) */
    --ac: max(222px, calc(100cqw - 2 * var(--px) - 2 * var(--dp) - 86px));
    --cols: 62px var(--ac) var(--ldg-og) 78px 78px 80px;
    --sc: calc(var(--th) + var(--kh) + 3 * var(--g) - 8px); }
  .ldg-top { gap: 6px; padding: 0 8px 0 6px; }
  .ldg-burger, .ldg-more { display: grid; }
  .ldg-mpdf { display: grid; }
  .ldg-mt { display: block; }
  .ldg svg.ldg-logo, .ldg-crumb, .ldg-srch, .ldg-ph, .ldg-flt { display: none; }
  .ldg-trig { display: flex; }
  .ldg-msh { display: block; }
  /* kartlar alt alta (sm:grid-cols-4 telefonda tek sütun) */
  .ldg-kt { grid-template-columns: minmax(0, 1fr); gap: 6px; }
  .ldg-k { height: 38px; padding: 5px 10px 0; }
  .ldg-n { margin-top: 2px; font-size: 13px; line-height: 16px; }
  /* tablo .table-scroll içinde: tam genişlik, Tarih + Açıklama görünür, sağ kenarda 28 px solma */
  .ldg-tw { overflow: hidden; -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 28px), transparent); mask-image: linear-gradient(to right, #000 calc(100% - 28px), transparent); }
  .ldg-doc .ldg-tbl { width: calc(62px + var(--ac) + var(--ldg-og) + 78px + 78px + 80px + 2px); }
  .ldg-doc .ldg-tr .c-bo, .ldg-doc .ldg-tr .c-al { display: flex; }
  .ldg-doc .c-ac em { display: inline; }
  .ldg-note { padding: 5px 7px; font-size: 10px; line-height: 14px; }
  /* s4: PDF düğmesi şeritte → sayfa kaymış kalır */
  .ldg.s4 .ldg-scr { translate: 0 calc(-1 * var(--sc)); }
  .ldg.s4 .ldg-sbar > i { translate: 0 117%; }
  .ldg.s4 .ldg-pg::after { opacity: 0; }
  /* PDF: Tarih · Açıklama · Öğrenci (kısa ad) · Bakiye */
  /* telefondaki PDF görüntüleyicisi gibi sayfa genişliğe oturur; 320 px kapta da «Taksit tahakkuku (2/10)» (106 px) sığar */
  .ldg-sheet { --cols: 58px minmax(0, 1fr) 54px 70px; --rh: 18px; width: calc(100% - 6px); padding: 12px 7px 10px; }
  .ldg-sheet .ldg-tr > *, .ldg-sheet .c-og > span { padding: 0 2px; }
  .ldg-sheet .ldg-tr .c-og { padding: 0; }
  .ldg-sheet .og-f { display: none; }
  .ldg-sheet .og-s { display: block; }
  .ldg-file b { font-size: 10.5px; }
}