/* SAHNE · REVİR ZİYARETİ (includes/scenes/infirmary.php) — adımlar:
   s1 öğrenci araması «Oğuz O» → sonuç satırına tıklanır, «Seçili: Oğuz Orhan» · s2 Şikâyet türü «Ateş», ateş 38.9 ·
   s3 önce düğmelere kayar, sonra «Ziyareti kaydet» → «Başarılı» penceresi, «Ziyaret #301911», listede AÇIK (3 → 4 açık) ·
   s4 «Verilen ilaçlar»: veli onayı uyarısı vurgulanır (onay listesi açılmaz) · s5 Sonuç «Eve gönderildi», Sonuç notu ·
   s6 «Güncelle» (10:10) → iki yeni satır, 08:55'teki AÇIK rozetleri kalkar, «Veliyi bilgilendirdim» uyarısı ·
   s7 «Veliyi bilgilendirdim» → uyarı kalkar, sayfa ilaç kartına geri kayar · s8 Revir Panosu (sayaçlar, revirdekiler, sınıf
   yoğunluğu, tekrar edenler).
   Kaydırma: form içeriği .inf-scr'de tek sütun durur; her adımda --y kadar kayar. Blok yükseklikleri değişkende (--hS…--hN),
   kaydırma miktarı onlardan HESAPLANIR — kap genişliği değişip bloklar uzasa da hedef blok görünür alana düşer. */
@property --inf-n { syntax: '<integer>'; inherits: false; initial-value: 0; }

.inf { container-type: inline-size; --d: 0s; --inf-ok: #047857; --inf-spring: cubic-bezier(.34, 1.56, .64, 1);
  --amber-50: #fffbeb; --amber-200: #fde68a; --amber-300: #fcd34d; --amber-ink: #78350f; --amber-700: #b45309; }
/* ölçü değişkenleri kabın İÇİNDE (.inf-win) durur: kap sorgusu kabın kendisine uygulanmaz */
.inf-win { position: relative; border-radius: 14px;
  --stH: 262px; --hS: 74px; --hK: 58px; --hV: 72px; --hR: 58px; --hB: 44px; --hI: 204px; --hN: 56px; --y: 0px;
  /* --hI = ilaç kartı + 10 px, --hN = uyarı + 10 px. y3: düğme satırı görünür · y4: düğme satırı üstte, ilaç kartı tam */
  --y3: calc(-1 * var(--hS)); --y4: calc(-1 * (var(--hS) + var(--hK) + var(--hV) + var(--hR))); }
.inf.s3 .inf-win { --y: var(--y3); }
.inf.s4 .inf-win { --y: var(--y4); }
/* s5: s3 konumu — alt kesim ilaç kartının başlığı ile uyarı kutusu arasına düşer (her genişlikte blok sınırı) */
.inf.s5 .inf-win { --y: var(--y3); }
.inf.s6 .inf-win { --y: calc(var(--stH) - var(--hS) - var(--hK) - var(--hV) - var(--hR) - var(--hB) - var(--hI) - var(--hN)); }
/* s7: uyarı sönünce boş kalan yer kapanır — sayfa s4'teki konuma döner */
.inf.s7 .inf-win { --y: var(--y4); }
.inf-i { width: 14px; height: 14px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

/* çapraz geçiş: katmanlar aynı ızgara hücresinde üst üste; on-A-B = A. adımdan B. adıma kadar görünür */
.inf-x { display: grid; min-width: 0; }
.inf-x > * { grid-area: 1 / 1; min-width: 0; }
.inf [class*="on-"] { opacity: 0; transform: translateY(3px); transition: opacity .28s var(--ui-ease) var(--d), transform .35s var(--ui-ease) var(--d); }
.inf:not(.s1) .on-0-1, .inf:not(.s2) .on-0-2, .inf:not(.s3) .on-0-3, .inf:not(.s5) .on-0-5, .inf:not(.s8) .on-0-8,
.inf.s1 .on-1b, .inf.s2 .on-2, .inf.s3 .on-3, .inf.s3:not(.s6) .on-3-6, .inf.s5 .on-5, .inf.s6 .on-6, .inf.s8 .on-8 { opacity: 1; transform: none; }
/* adım içi zamanlama: sonucun göründüğü an (tıklamadan sonra) */
.inf.s1 { --d: 0s; } .inf.s2 { --d: .45s; } .inf.s3 { --d: 1.4s; } .inf.s5 { --d: 1.1s; } .inf.s6 { --d: .7s; } .inf.s8 { --d: .5s; }

/* imleç: .inf-hit tıklama noktasıdır; ok ucu tam orada, halka dalgası çevresinde */
.inf-hit { position: absolute; z-index: 7; width: 0; height: 0; pointer-events: none; }
.inf-hit .ui-cur { left: -5px; top: -3px; transform: translate(16px, 14px); transition: opacity .2s var(--ui-ease); }
.inf-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 inf-cur { 0% { opacity: 0; transform: translate(16px, 14px); } 36% { opacity: 1; transform: none; scale: 1; } 52% { scale: .8; } 66% { scale: 1; } 82% { opacity: 1; transform: none; } 100% { opacity: 0; transform: translate(4px, 5px); } }
@keyframes inf-curB { 0% { opacity: 0; transform: translate(16px, 14px); } 36% { opacity: 1; transform: none; scale: 1; } 52% { scale: .8; } 66% { scale: 1; } 82% { opacity: 1; transform: none; } 100% { opacity: 0; transform: translate(4px, 5px); } }
@keyframes inf-rip { 0% { opacity: 0; scale: .25; } 12% { opacity: .9; } 100% { opacity: 0; scale: 1.7; } }
@keyframes inf-push { 50% { scale: .95; } }
@keyframes inf-ring { 0% { box-shadow: 0 0 0 0 rgba(217, 119, 6, .45), inset 0 0 0 1px var(--amber-300); } 100% { box-shadow: 0 0 0 7px rgba(217, 119, 6, 0), inset 0 0 0 1px var(--amber-300); } }

/* ── başlık bandı (kurum rengi) ── */
.inf-band { display: flex; align-items: center; gap: 12px; margin: 12px 12px 0; padding: 10px 10px 10px 12px; border-radius: 12px; color: #fff;
  background: linear-gradient(120deg, var(--navy-night), var(--navy) 55%, var(--navy-soft));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 1px 2px rgba(11, 36, 64, .18), 0 10px 20px -14px rgba(11, 36, 64, .7); }
.inf-ico { flex: none; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; background: rgba(255, 255, 255, .13); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .2); }
.inf-ico .inf-i { width: 18px; height: 18px; stroke-width: 1.8; }
.inf-ico .inf-x > * { display: grid; place-items: center; }
.inf-ttl { flex: 1; line-height: 20px; }
.inf-ttl b { display: block; font-size: 15px; font-weight: 800; letter-spacing: -.01em; white-space: nowrap; }
.inf-ttl small { display: block; margin-top: 1px; font-size: 11.5px; line-height: 15px; font-weight: 600; color: rgba(255, 255, 255, .8); font-variant-numeric: tabular-nums; white-space: nowrap; }
.inf-acts { flex: none; justify-items: end; }
.inf-acts > * { display: flex; gap: 6px; }
.inf-bb { position: relative; display: inline-flex; align-items: center; gap: 5px; height: 30px; padding: 0 10px; border-radius: 9px; font-size: 11.5px; font-weight: 800; white-space: nowrap;
  color: #fff; background: rgba(255, 255, 255, .1); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .26); }
.inf-bb .inf-i { width: 13px; height: 13px; }
.inf-bb--p { color: var(--navy); background: #fff; box-shadow: inset 0 -1px 0 rgba(16, 37, 64, .12), 0 2px 6px -2px rgba(4, 16, 32, .5); }
.inf-bb--pano .inf-hit { right: 24px; bottom: 8px; }

/* ── gövde ── */
.inf-main { position: relative; margin-top: 10px; }
.inf-open { display: flex; align-items: center; gap: 8px; height: 30px; margin: 0 12px; padding: 0 12px; border-radius: 10px; background: var(--amber-50); color: var(--amber-ink);
  box-shadow: inset 0 0 0 1px var(--amber-300); font-size: 11.5px; font-weight: 800; white-space: nowrap; overflow: hidden; }
.inf-open .inf-i { width: 15px; height: 15px; color: var(--amber-700); }
.inf-open > span { min-width: 0; }
.inf-n { display: inline-grid; vertical-align: top; font-variant-numeric: tabular-nums; }
.inf-open__l { font-weight: 700; }
/* alt boşluk dolgu (margin değil): pano katmanı kartların alt kenarını tam örtsün */
.inf-vis { padding-bottom: 12px; }
.inf-cols { display: grid; grid-template-columns: 210px minmax(0, 1fr); gap: 10px; margin: 10px 12px 0; }

/* liste */
.inf-list { position: relative; min-width: 0; border-radius: 12px; background: #fff; overflow: hidden;
  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); }
.inf-list::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 26px; background: linear-gradient(rgba(255, 255, 255, 0), #fff); pointer-events: none; }
.inf-list__h { position: relative; z-index: 1; display: flex; align-items: center; gap: 4px; height: 30px; padding: 0 12px; background: #fff; border-bottom: 1px solid var(--ui-line); font-size: 10px; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; color: #6b7280; }
.inf-list__h b { display: inline-grid; font-variant-numeric: tabular-nums; }
/* satırlar akış dışında: liste yüksekliğini detay kartı belirler (9 satır kartı uzatmasın) */
.inf-rows { position: absolute; left: 0; right: 0; top: 30px; translate: 0 -120px; transition: translate .55s var(--ui-ease) 1.45s; }
.inf.s3 .inf-rows { translate: 0 -80px; }
.inf.s6 .inf-rows { translate: 0 0; transition-delay: .75s; }
.inf-r { position: relative; height: 40px; padding: 6px 12px 0; border-bottom: 1px solid #f1f2f4; transition: background-color .3s var(--ui-ease); }
.inf-r__t { display: flex; align-items: center; gap: 6px; height: 16px; }
.inf-r b { flex: 1; min-width: 0; font-size: 11.5px; font-weight: 800; color: #18181b; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.inf-r small { display: block; margin-top: 1px; font-size: 10px; font-weight: 700; line-height: 13px; color: #71717a; white-space: nowrap; letter-spacing: -.01em; font-variant-numeric: tabular-nums; }
.inf-acik { flex: none; height: 15px; padding: 0 6px; border-radius: 999px; background: #fef3c7; color: #b45309; font-style: normal; font-size: 10px; font-weight: 900; line-height: 15px; letter-spacing: .02em; }
.inf-r--new { background: #f2f6fb; box-shadow: inset 2px 0 0 var(--navy-soft); opacity: 0; transition: opacity .35s var(--ui-ease) 1.65s; }
.inf.s3 .inf-r--new { opacity: 1; }
.inf-r--in { opacity: 0; transition: opacity .35s var(--ui-ease) .95s; }
.inf.s6 .inf-r--in { opacity: 1; }
/* 08:55'te açık, 10:10'da kapanmış ziyaretler: rozet s6'da söner */
.inf-acik--k { transition: opacity .25s var(--ui-ease) .8s, scale .3s var(--ui-ease) .8s; }
.inf.s6 .inf-acik--k { opacity: 0; scale: .7; }

/* detay kartı */
.inf-det { position: relative; min-width: 0; padding: 10px 12px 0; 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); }
.inf-dh { height: 24px; margin-bottom: 8px; }
.inf-dh > * { display: flex; align-items: center; gap: 7px; white-space: nowrap; }
.inf-dh b { font-size: 13.5px; font-weight: 900; letter-spacing: -.01em; color: #18181b; }
.inf-dh small { font-size: 11.5px; font-weight: 700; color: #71717a; }
.inf-kun { display: inline-flex; align-items: center; gap: 4px; font-size: 11.5px; font-weight: 800; color: var(--navy-soft); }
.inf-kun .inf-i { width: 13px; height: 13px; }
.inf-stage { position: relative; height: var(--stH); overflow: hidden; border-radius: 0 0 12px 12px; }
.inf-stage::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 14px; background: linear-gradient(rgba(255, 255, 255, 0), #fff); pointer-events: none; }
.inf-scr { translate: 0 var(--y); transition: translate .7s cubic-bezier(.32, .12, .2, 1) var(--sd, 0s); }
.inf.s3 { --sd: 0s; } .inf.s4 { --sd: .05s; } .inf.s5 { --sd: 0s; } .inf.s6 { --sd: 1.25s; } .inf.s7 { --sd: 1s; }
.inf-blk { position: relative; }
.inf-blk--s { height: var(--hS); transition: opacity .3s var(--ui-ease) 1.4s; }
.inf.s3 .inf-blk--s { opacity: 0; }
.inf-blk--k { height: var(--hK); } .inf-blk--v { height: var(--hV); } .inf-blk--r { height: var(--hR); } .inf-blk--b { height: var(--hB); }
.inf-blk--i { height: var(--hI); } .inf-blk--n { height: var(--hN); }

/* alanlar */
.inf-g2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 10px; align-content: start; }
.inf-g4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-top: 4px; }
.inf-g3 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.7fr); gap: 8px; margin-top: 8px; }
/* «Doz» çizilmez (sadeleştirme): «Onay kaynağı» seçimi kesilmeden sığsın */
.inf-fld.inf-fld--doz { display: none; }
.inf-fld { position: relative; display: block; min-width: 0; }
.inf-lbl { display: flex; align-items: center; gap: 3px; height: 14px; margin-bottom: 4px; font-size: 11px; font-weight: 800; color: #27272a; white-space: nowrap; }
.inf-req { font-style: normal; color: #b91c1c; }
.inf-help { width: 12px; height: 12px; margin-left: 3px; color: #71717a; stroke-width: 1.8; }
.inf-cap { display: block; height: 12px; margin-bottom: 3px; font-size: 10px; font-weight: 800; line-height: 12px; letter-spacing: .02em; text-transform: uppercase; color: #6b7280; white-space: nowrap; }
.inf-in { position: relative; display: flex; align-items: center; gap: 6px; height: 30px; padding: 0 9px; border-radius: 8px; background: #fff; font-size: 11.5px; font-weight: 700; color: #18181b; white-space: nowrap;
  box-shadow: inset 0 0 0 1px var(--ui-line-2), 0 1px 1px rgba(16, 37, 64, .03); transition: box-shadow .3s var(--ui-ease); }
.inf-in .inf-x { flex: 1; }
.inf-in .inf-x > * { overflow: hidden; text-overflow: ellipsis; }
.inf-in--num { font-variant-numeric: tabular-nums; justify-content: space-between; }
.inf-in--sel { padding-right: 8px; }
.inf-chev { width: 13px; height: 13px; color: #71717a; }
.inf-mut { color: #52525b; }
.inf-q { width: 13px; height: 13px; color: #71717a; }
.inf-ph { color: #8b919c; font-weight: 600; }

/* yazım: harf harf açılır (clip-path, steps) */
.inf-type { display: inline-block; clip-path: inset(0 100% 0 0); }
.inf-caret { position: absolute; top: 8px; width: 1.5px; height: 14px; background: var(--navy-soft); opacity: 0; }

/* s1: arama + sonuç */
.inf-qv { position: relative; }
.inf-in--q { padding-left: 10px; }
.inf.s1 .inf-in--q, .inf.s2:not(.s3) .inf-in--kat, .inf.s5:not(.s6) .inf-in--son { box-shadow: inset 0 0 0 1px var(--navy-soft), 0 0 0 3px rgba(29, 79, 134, .14); }
.inf.s2 .inf-in--q { box-shadow: inset 0 0 0 1px var(--ui-line-2); }
/* aynı öğede iki canlandırma tek kuralda (ayrı kurallar birbirini ezer) */
.inf.s1:not(.s2) .on-1-1b { animation: inf-yaz6 .55s steps(6, end) .1s both, inf-qt 1.2s linear both; }
@keyframes inf-qt { 0% { opacity: 1; transform: none; } 85% { opacity: 1; transform: none; } 100% { opacity: 0; transform: translateY(-3px); } }
@keyframes inf-yaz6 { to { clip-path: inset(0 0 0 0); } }
.inf.s1 .on-1b { transition-delay: 1.1s; }
.inf.s2 .on-1b { transition-delay: 0s; }
.inf.s1:not(.s2) .inf-caret { left: 70px; animation: inf-caret .45s steps(1) .1s 2 both; }
@keyframes inf-caret { 50% { opacity: 1; } }
.inf-pick { display: block; height: 14px; margin-top: 4px; font-size: 10.5px; font-weight: 800; line-height: 14px; color: var(--navy-soft); opacity: 0; transition: opacity .3s var(--ui-ease) 1.15s; }
.inf.s1 .inf-pick { opacity: 1; }
.inf-dd { position: absolute; z-index: 5; left: 0; right: 0; top: 52px; padding: 3px; border-radius: 9px; background: #fff; opacity: 0; translate: 0 -4px; pointer-events: none;
  box-shadow: 0 0 0 1px var(--ui-line-2), 0 2px 4px rgba(16, 37, 64, .06), 0 14px 26px -12px rgba(16, 37, 64, .4); }
.inf-dd__r { position: relative; display: flex; align-items: center; height: 28px; padding: 0 9px; border-radius: 6px; font-size: 11.5px; font-weight: 700; color: #18181b; white-space: nowrap; overflow: visible; }
.inf.s1:not(.s2) .inf-dd { animation: inf-dd 1.25s var(--ui-ease) both; }
@keyframes inf-dd { 0%, 50% { opacity: 0; translate: 0 -4px; } 60%, 84% { opacity: 1; translate: 0 0; } 100% { opacity: 0; translate: 0 0; } }
.inf.s1:not(.s2) .inf-dd__r { animation: inf-ddr 1.25s linear both; }
@keyframes inf-ddr { 0%, 72% { background: #fff; } 74%, 100% { background: var(--ui-primary-soft); } }
.inf-dd .inf-hit { left: 92px; top: 15px; }
.inf.s1:not(.s2) .inf-hit--dd .ui-cur { animation: inf-cur .75s var(--ui-ease) .6s both; }
.inf.s1:not(.s2) .inf-hit--dd .inf-rip { animation: inf-rip .5s ease-out .95s both; }

/* s2: şikâyet türü + ateş */
.inf-in--kat .inf-hit { right: 30px; bottom: 9px; }
.inf.s2:not(.s3) .inf-hit--kat .ui-cur { animation: inf-curB .8s var(--ui-ease) both; }
.inf.s2:not(.s3) .inf-hit--kat .inf-rip { animation: inf-rip .5s ease-out .3s both; }
.inf.s2 .inf-type--ates { animation: inf-yaz4 .45s steps(4, end) .7s both; }
@keyframes inf-yaz4 { to { clip-path: inset(0 0 0 0); } }
.inf.s2:not(.s3) .inf-in--ates { box-shadow: inset 0 0 0 1px var(--navy-soft), 0 0 0 3px rgba(29, 79, 134, .14); transition-delay: .65s; }

/* düğmeler */
.inf-blk--b { display: flex; gap: 8px; }
.inf-btn { position: relative; flex: none; display: inline-grid; align-items: center; height: 30px; padding: 0 14px; border-radius: 9px; font-size: 11.5px; font-weight: 800; color: #fff; white-space: nowrap;
  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); }
.inf-btn > span { text-align: center; }
.inf-btn .inf-hit { right: 22px; bottom: 9px; }
.inf-btn2 { position: relative; flex: none; display: inline-flex; align-items: center; height: 30px; padding: 0 12px; border-radius: 9px; background: #fff; font-size: 11.5px; font-weight: 800; color: #3f3f46; white-space: nowrap;
  box-shadow: inset 0 0 0 1px #d4d4d8, 0 1px 2px rgba(16, 37, 64, .05); }
.inf-yeni { opacity: 0; transition: opacity .3s var(--ui-ease) var(--d); }
.inf.s3 .inf-yeni { opacity: 1; }
.inf.s3:not(.s4) .inf-btn { animation: inf-push .3s var(--ui-ease) 1.08s; }
.inf.s3:not(.s4) .inf-hit--kay .ui-cur { animation: inf-cur .9s var(--ui-ease) .7s both; }
.inf.s3:not(.s4) .inf-hit--kay .inf-rip { animation: inf-rip .5s ease-out 1.1s both; }
.inf.s6 .inf-btn { animation: inf-push .3s var(--ui-ease) .38s; }
.inf.s6:not(.s7) .inf-hit--gun .ui-cur { animation: inf-curB .9s var(--ui-ease) both; }
.inf.s6:not(.s7) .inf-hit--gun .inf-rip { animation: inf-rip .5s ease-out .4s both; }

/* ilaçlar */
.inf-card { padding: 10px 12px 12px; 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); }
.inf-card__h { display: block; height: 14px; font-size: 10.5px; font-weight: 900; line-height: 14px; letter-spacing: .06em; text-transform: uppercase; color: #6b7280; }
.inf-warn { display: flex; gap: 8px; margin-top: 8px; padding: 7px 10px; border-radius: 10px; background: var(--amber-50); color: var(--amber-ink); font-size: 11px; font-weight: 700; line-height: 15px;
  box-shadow: inset 0 0 0 1px var(--amber-300); text-wrap: pretty; }
.inf-warn b { font-weight: 900; }
.inf-warn .inf-i { width: 14px; height: 14px; margin-top: 1px; color: var(--amber-700); }
.inf.s4:not(.s5) .inf-warn { animation: inf-ring .9s ease-out .75s 2 both; }
.inf-card > .inf-btn2 { margin-top: 10px; height: 28px; }

/* veli bilgilendirme */
.inf-ntf { display: flex; align-items: center; gap: 10px; padding: 8px 8px 8px 12px; border-radius: 12px; background: var(--amber-50); color: var(--amber-ink); font-size: 11px; font-weight: 700; line-height: 15px;
  box-shadow: inset 0 0 0 1px var(--amber-300); opacity: 0; translate: 0 8px; transition: opacity .35s var(--ui-ease), translate .45s var(--ui-ease); }
.inf-ntf > span:first-child { flex: 1; min-width: 0; }
.inf-ntf b { font-weight: 900; }
.inf-btn3 { position: relative; flex: none; display: inline-flex; align-items: center; height: 30px; padding: 0 12px; border-radius: 9px; background: var(--amber-700); color: #fff; font-size: 11.5px; font-weight: 800; white-space: nowrap;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16), 0 1px 2px rgba(120, 53, 15, .3), 0 6px 12px -8px rgba(180, 83, 9, .8); }
.inf-btn3 .inf-hit { right: 30px; bottom: 9px; }
.inf.s6 .inf-ntf { opacity: 1; translate: 0 0; transition-delay: 1.6s; }
.inf.s7 .inf-ntf { opacity: 0; translate: 0 0; transition-delay: .95s; }
.inf.s7:not(.s8) .inf-btn3 { animation: inf-push .3s var(--ui-ease) .38s; }
.inf.s7:not(.s8) .inf-hit--veli .ui-cur { animation: inf-cur .9s var(--ui-ease) both; }
.inf.s7:not(.s8) .inf-hit--veli .inf-rip { animation: inf-rip .5s ease-out .4s both; }

/* s5: sonuç + not — önce sayfa kayar (.7 s), sonra imleç gelir ve tıklar (tek odak hareketi) */
.inf-in--son .inf-hit { right: 30px; bottom: 9px; }
.inf.s5:not(.s6) .inf-in--son { transition-delay: .85s; }
.inf.s5:not(.s6) .inf-hit--son .ui-cur { animation: inf-cur .85s var(--ui-ease) .8s both; }
.inf.s5:not(.s6) .inf-hit--son .inf-rip { animation: inf-rip .5s ease-out 1.1s both; }
.inf.s5 .inf-type--not { animation: inf-yazN .7s steps(13, end) 1.4s both; }
@keyframes inf-yazN { to { clip-path: inset(0 0 0 0); } }
.inf-in--not { overflow: hidden; }

/* ── «Başarılı» penceresi (SweetAlert) ── */
.inf-swal { position: absolute; z-index: 8; inset: -10px 0 0; display: grid; place-items: center; background: rgba(15, 23, 42, .36); opacity: 0; pointer-events: none; border-radius: 0 0 14px 14px; }
.inf-sw { grid-area: 1 / 1; display: flex; flex-direction: column; align-items: center; width: 224px; padding: 14px 14px 12px; border-radius: 14px; background: #fff; text-align: center; opacity: 0;
  box-shadow: 0 0 0 1px rgba(16, 37, 64, .06), 0 2px 4px rgba(0, 0, 0, .08), 0 24px 40px -16px rgba(0, 0, 0, .55); }
.inf-sw__ok svg { width: 40px; height: 40px; fill: none; stroke: #22c55e; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.inf-sw__ok circle { stroke: #bbf7d0; }
.inf-sw__ok path { stroke-dasharray: 36; stroke-dashoffset: 36; }
.inf-sw b { margin-top: 8px; font-size: 14px; font-weight: 800; color: #18181b; }
.inf-sw__t { margin-top: 3px; font-size: 11.5px; font-weight: 600; line-height: 15px; color: #3f3f46; }
.inf-sw__b { display: grid; place-items: center; height: 28px; margin-top: 10px; padding: 0 16px; border-radius: 8px; background: #18181b; color: #fff; font-size: 11.5px; font-weight: 800; }
@keyframes inf-swA { 0% { opacity: 0; } 16%, 80% { opacity: 1; } 100% { opacity: 0; } }
@keyframes inf-swB { 0% { opacity: 0; } 16%, 80% { opacity: 1; } 100% { opacity: 0; } }
@keyframes inf-swk { 0% { opacity: 0; scale: .86; } 18% { opacity: 1; scale: 1.02; } 26%, 80% { opacity: 1; scale: 1; } 100% { opacity: 0; scale: .96; } }
@keyframes inf-tik { 0%, 22% { stroke-dashoffset: 36; } 45%, 100% { stroke-dashoffset: 0; } }
@keyframes inf-tmm { 0%, 70% { scale: 1; filter: none; } 75% { scale: .94; filter: brightness(1.5); } 80%, 100% { scale: 1; filter: none; } }
.inf.s7:not(.s8) .inf-swal { animation: inf-swA 1.05s var(--ui-ease) .5s both; }
.inf.s6:not(.s7) .inf-swal { animation: inf-swB 1.05s var(--ui-ease) .5s both; }
.inf.s6:not(.s7) .inf-sw--6, .inf.s7:not(.s8) .inf-sw--7 { animation: inf-swk 1.05s var(--ui-ease) .5s both; }
.inf.s6:not(.s7) .inf-sw--6 path, .inf.s7:not(.s8) .inf-sw--7 path { animation: inf-tik 1.05s ease-out .5s both; }
.inf.s6:not(.s7) .inf-sw--6 .inf-sw__b, .inf.s7:not(.s8) .inf-sw--7 .inf-sw__b { animation: inf-tmm 1.05s linear .5s both; }
/* s3: kaydırma (.7 s) bittikten sonra tıklanır → pencere 1.2 s'de */
.inf.s3:not(.s4) .inf-swal { animation: inf-swA 1.05s var(--ui-ease) 1.2s both; }
.inf.s3:not(.s4) .inf-sw--3 { animation: inf-swk 1.05s var(--ui-ease) 1.2s both; }
.inf.s3:not(.s4) .inf-sw--3 path { animation: inf-tik 1.05s ease-out 1.2s both; }
.inf.s3:not(.s4) .inf-sw--3 .inf-sw__b { animation: inf-tmm 1.05s linear 1.2s both; }

/* ── REVİR PANOSU ── */
.inf-pano { position: absolute; z-index: 4; inset: -10px 0 0; padding: 10px 12px 12px; background: #fff; border-radius: 0 0 14px 14px; opacity: 0; translate: 0 10px;
  transition: opacity .35s var(--ui-ease), translate .5s var(--ui-ease); }
.inf.s8 .inf-pano { opacity: 1; translate: 0 0; transition-delay: .5s; }
.inf.s8 .inf-bb--pano { animation: inf-push .3s var(--ui-ease) .38s; }
.inf.s8 .inf-hit--pano .ui-cur { animation: inf-cur .9s var(--ui-ease) both; }
.inf.s8 .inf-hit--pano .inf-rip { animation: inf-rip .5s ease-out .4s both; }
.inf-kartlar { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.inf-kt { position: relative; display: block; min-width: 0; height: 74px; padding: 9px 10px 0; border-radius: 12px; opacity: 0; translate: 0 8px;
  transition: opacity .3s var(--ui-ease) calc(.6s + var(--i) * 70ms), translate .45s var(--inf-spring) calc(.6s + var(--i) * 70ms); }
.inf.s8 .inf-kt { opacity: 1; translate: 0 0; }
.inf-kt .inf-i { width: 16px; height: 16px; stroke-width: 1.9; }
.inf-kt b { display: block; margin-top: 4px; font-size: 21px; font-weight: 900; line-height: 24px; letter-spacing: -.02em; font-variant-numeric: tabular-nums;
  counter-reset: inf-n var(--inf-n); transition: --inf-n .7s var(--ui-ease) calc(.75s + var(--i) * 70ms); }
.inf-kt b::after { content: counter(inf-n); }
.inf-kt small { display: block; margin-top: 2px; font-size: 10px; font-weight: 900; line-height: 12px; letter-spacing: .03em; text-transform: uppercase; white-space: nowrap; }
.inf-kt--zi { background: #eef3fa; color: var(--navy-soft); box-shadow: inset 0 0 0 1px #c9d8ec, inset 0 1px 0 rgba(255, 255, 255, .6); }
.inf-kt--re { background: var(--amber-50); color: var(--amber-700); box-shadow: inset 0 0 0 1px var(--amber-200), inset 0 1px 0 rgba(255, 255, 255, .6); }
.inf-kt--ev { background: #fff; color: #3f3f46; box-shadow: inset 0 0 0 1px #e4e4e7, inset 0 1px 0 rgba(255, 255, 255, .6); }
.inf-kt--se { background: #fef2f2; color: #b91c1c; box-shadow: inset 0 0 0 1px #fecaca, inset 0 1px 0 rgba(255, 255, 255, .6); }
.inf.s8 .inf-kt--zi b { --inf-n: 6; }
.inf.s8 .inf-kt--re b { --inf-n: 1; }
.inf.s8 .inf-kt--ev b { --inf-n: 2; }
/* «Şu an revirde olanlar» (admin-infirmary.php:154–172): amber kenarlı beyaz kutu, ad kurum renginde */
.inf-rv { display: block; margin-top: 10px; padding: 8px 12px 6px; border-radius: 12px; background: #fff; opacity: 0; translate: 0 8px;
  box-shadow: inset 0 0 0 1px var(--amber-300), 0 1px 2px rgba(120, 53, 15, .06), inset 0 1px 0 rgba(255, 255, 255, .6);
  transition: opacity .3s var(--ui-ease) calc(.6s + var(--i) * 70ms), translate .45s var(--ui-ease) calc(.6s + var(--i) * 70ms); }
.inf.s8 .inf-rv { opacity: 1; translate: 0 0; }
.inf-rv__h { display: block; font-size: 10.5px; font-weight: 900; line-height: 14px; letter-spacing: .06em; text-transform: uppercase; color: var(--amber-700); }
.inf-rv__r { display: flex; align-items: center; justify-content: space-between; gap: 10px; height: 24px; white-space: nowrap; }
.inf-rv__r b { min-width: 0; font-size: 11.5px; font-weight: 800; color: var(--navy-soft); overflow: hidden; text-overflow: ellipsis; }
.inf-rv__r small { flex: none; font-size: 10.5px; font-weight: 700; color: #71717a; font-variant-numeric: tabular-nums; }
.inf-pg { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 10px; margin-top: 10px; }
.inf-pc { display: block; min-width: 0; padding: 10px 12px 8px; border-radius: 12px; background: #fff; opacity: 0; translate: 0 8px;
  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);
  transition: opacity .3s var(--ui-ease) calc(.6s + var(--i) * 70ms), translate .45s var(--ui-ease) calc(.6s + var(--i) * 70ms); }
.inf.s8 .inf-pc { opacity: 1; translate: 0 0; }
.inf-pc__h { display: block; font-size: 10.5px; font-weight: 900; line-height: 14px; letter-spacing: .06em; text-transform: uppercase; color: #52525b; }
.inf-pc__s { display: block; margin-top: 2px; font-size: 10px; font-weight: 700; line-height: 13px; color: #71717a; text-wrap: pretty; }
.inf-tr { display: grid; grid-template-columns: minmax(0, 1fr) 56px 60px 62px; align-items: center; height: 25px; border-bottom: 1px solid #f4f4f5; font-size: 11.5px; font-variant-numeric: tabular-nums;
  opacity: 0; transition: opacity .3s var(--ui-ease) calc(.95s + var(--j, 0) * 60ms); }
.inf.s8 .inf-tr { opacity: 1; }
.inf-tr > :not(:first-child) { text-align: right; }
.inf-tr b { font-weight: 800; color: #18181b; }
.inf-tr span { font-weight: 600; color: #71717a; }
.inf-tr > span:last-child { color: #71717a; }
.inf-tr.inf-tr--x { display: none; }
.inf-tr--h { height: 24px; margin-top: 6px; border-bottom: 1px solid #e4e4e7; font-size: 10.5px; opacity: 1; }
.inf-tr--h span { font-weight: 800; color: #27272a; }
.inf-tk { display: flex; align-items: center; justify-content: space-between; gap: 8px; height: 30px; border-bottom: 1px solid #f4f4f5; font-size: 11px; font-weight: 700; color: #71717a;
  opacity: 0; translate: 6px 0; transition: opacity .3s var(--ui-ease) calc(1.05s + var(--j) * 70ms), translate .35s var(--ui-ease) calc(1.05s + var(--j) * 70ms); }
.inf-tk:first-of-type { margin-top: 4px; }
.inf.s8 .inf-tk { opacity: 1; translate: 0 0; }
.inf-tk > span { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.inf-tk b { font-weight: 800; color: #18181b; }
.inf-tk em { flex: none; height: 18px; padding: 0 7px; border-radius: 999px; background: #fef3c7; color: #b45309; font-style: normal; font-size: 10px; font-weight: 900; line-height: 18px; }

/* ── DAR KAPLAR ── */
@container (max-width: 640px) {
  /* --hI 206 (kart 179): s6'da üst kesim kartın üst kenarına düşer, düğmenin gölgesi görünmez.
     --hV 130 (içerik 116 + 14): s0–s2'de sahne (262) tam vital bloğun sonunda biter, «Sonuç» etiketi kenara düşmez */
  .inf-win { --hV: 130px; --hI: 206px; --y3: calc(-1 * (var(--hS) + var(--hK))); }
  .inf-tr.inf-tr--x { display: grid; }
  .inf-cols { grid-template-columns: minmax(0, 1fr); }
  .inf-list { display: none; }
  .inf-g4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .inf-open__l { display: none; }
  .inf-pc__s { display: none; }
}
@container (max-width: 520px) {
  .inf-win { --hI: 204px; }
  .inf-crumb, .inf-bb--w { display: none; }
  .inf-bb__t { display: none; }
  .inf-bb { padding: 0 8px; }
  .inf-bb--pano .inf-hit { right: 8px; }
  .inf-pg { grid-template-columns: minmax(0, 1fr); }
  .inf-pc--tk { display: none; }
  .inf-kartlar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .inf-kt { height: 58px; padding: 7px 10px 0; }
  .inf-kt .inf-i { position: absolute; right: 10px; top: 9px; }
  .inf-kt b { margin-top: 0; }
  /* «Şu an revirde olanlar» sığmaz (sınıf tablosunun 5. satırı ≤640'ta zaten açık) */
  .inf-rv { display: none; }
}
@container (max-width: 470px) {
  /* ilaç kartı (262) düğme satırıyla sığmaz: s4/s7'de kart üste hizalanır; s6'da kesim uyarı ile İLAÇ alanı arasına düşer.
     --hK/--hR 114 (içerik 104 + 10). Vital bulgularda yalnız ATEŞ · NABIZ satırı (--hV 78 = 63 + 15): s0–s2'de sahne (266) tam
     vital bloğun sonunda biter; s3/s5'te alt kesim ilaç kartının başlığı ile uyarı kutusu arasına düşer.
     --hI 272 (kart 262 + 10) · --hN 104: toplam aynı kalır → s6 kaydırması ve İLAÇ etiketi yerinde, kart–veli kutusu arası 10 px */
  .inf-win { --stH: 266px; --hK: 114px; --hV: 78px; --hR: 114px; --hI: 272px; --hN: 104px;
    --y4: calc(-1 * (var(--hS) + var(--hK) + var(--hV) + var(--hR) + var(--hB))); }
  .inf-g4 > .inf-fld:nth-child(n+3) { display: none; }
  .inf-band { margin: 10px 10px 0; padding: 9px 8px 9px 10px; gap: 10px; }
  .inf-ico { width: 32px; height: 32px; border-radius: 9px; }
  .inf-ttl b { font-size: 14px; }
  .inf-ttl small { font-size: 11px; }
  .inf-open { margin: 0 10px; padding: 0 10px; }
  .inf-cols { margin: 10px 10px 0; }
  .inf-vis { padding-bottom: 10px; }
  .inf-det { padding: 10px 10px 0; }
  .inf-dh small { display: none; }
  .inf-g2 { grid-template-columns: minmax(0, 1fr); }
  .inf-g3 { grid-template-columns: minmax(0, 1fr); }
  .inf-ntf { flex-direction: column; align-items: stretch; gap: 8px; padding: 9px 10px; }
  .inf-btn3 { justify-content: center; }
  .inf-pano { padding: 10px 10px 10px; }
  .inf-sw { width: 210px; }
}
