/* SAHNE · REHBERLİK: DANIŞMAN GÖRÜŞME NOTU → AİLEYE YALNIZ KONU VE KARAR (includes/scenes/guidance.php) — iki telefon. Adımlar:
   s1 Danışanlarım'da Can Kılınç'a dokunulur → öğrenci sayfası · s2 not yazılır, sonraki görüşme 02.11.2026 · s3 «Veli görsün» +
   «Öğrenci görsün» → Konu / Karar alanları + önizleme («Veli ve öğrenci şunu görecek», uyarı) · s4 konu ve karar yazılır, önizleme
   dolar · s5 «Görüşmeyi kaydet» → «Kaydediliyor…» → yenilenen sayfa, «Görüşme notu kaydedildi.» · s6 görüşme geçmişi (7 kayıt) ·
   s7 velinin kilit ekranına «Danışman notu eklendi» · s8 «Gözlem ve görüşmeler»: konu, karar, sonraki görüşme — not metni yok.
   Telefon ölçüsü sabit (264 × 444): kaydırma miktarları her kap genişliğinde aynı. Geniş kapta (≥ 600 px) telefonlar yan yana,
   aralarındaki rayda bildirim gider; dar kapta velinin telefonu 7. adımda öğretmeninkinin üstüne kayar. */
.gdn { container-type: inline-size; --pw: 264px; --ph: 444px;
  --yA: 140px; --yB: 337px; --yC: 491px; --yD: 585px;
  --gdn-ok: #047857; --gdn-ok-ink: #065f46; --gdn-spring: cubic-bezier(.34, 1.56, .64, 1); --gdn-scroll: cubic-bezier(.32, .12, .2, 1); }
.gdn svg { display: block; }
.gdn-i { width: 14px; height: 14px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

/* çapraz geçiş yığını: katmanlar aynı ızgara hücresinde üst üste */
.gdn-x { display: grid; min-width: 0; }
.gdn-x > * { grid-area: 1 / 1; min-width: 0; }

/* ── sahne zemini ── */
.gdn-st { --gap: clamp(24px, 100cqw - 2 * var(--pw) - 80px, 120px);
  position: relative; height: calc(var(--ph) + 34px); border-radius: 18px; overflow: hidden;
  background:
    radial-gradient(circle at 1px 1px, rgba(20, 61, 107, .09) 1px, transparent 1.4px) 0 0 / 16px 16px,
    radial-gradient(120% 80% at 50% 0%, #f3f7fc 0%, #e8eef6 60%, #e2e9f2 100%);
  box-shadow: inset 0 0 0 1px rgba(20, 61, 107, .07), inset 0 1px 0 rgba(255, 255, 255, .7); }
.gdn-rail { position: absolute; z-index: 0; top: 150px; left: round(down, 50cqw - var(--gap) / 2, 1px); width: var(--gap); height: 2px; border-radius: 2px;
  background: repeating-linear-gradient(90deg, rgba(20, 61, 107, .28) 0 4px, transparent 4px 9px); }
.gdn-rail i { position: absolute; top: -3px; left: 50%; width: 8px; height: 8px; margin-left: -4px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 1.5px rgba(20, 61, 107, .35); }
.gdn-rail b { position: absolute; top: -4px; left: -5px; width: 10px; height: 10px; border-radius: 50%; background: var(--sun); box-shadow: 0 0 0 3px rgba(255, 182, 39, .28); opacity: 0; }
.gdn.s7:not(.s8) .gdn-rail b { animation: gdn-sig .6s cubic-bezier(.45, 0, .25, 1) both; }
@keyframes gdn-sig { 0% { opacity: 0; translate: 0 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { opacity: 0; translate: var(--gap) 0; } }

/* ── telefon ── */
.gdn-tel { position: absolute; z-index: 2; top: 10px; width: var(--pw); height: var(--ph); padding: 5px; border-radius: 34px;
  background: linear-gradient(160deg, #24364f 0%, #101c2e 45%, #0a1322 100%);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .1), inset 0 1px 0 rgba(255, 255, 255, .16), 0 1px 2px rgba(10, 22, 40, .25), 0 26px 44px -22px rgba(10, 22, 40, .65);
  transition: translate .6s var(--ui-ease), opacity .4s var(--ui-ease); }
.gdn-tel--t { left: round(down, 50cqw - var(--gap) / 2 - var(--pw), 1px); }
.gdn-tel--v { left: round(down, 50cqw + var(--gap) / 2, 1px); }
.gdn-scr { position: relative; height: 100%; border-radius: 29px; overflow: hidden; background: #f4f6f9; font-size: 10.5px; line-height: 1.35; color: var(--ui-text); isolation: isolate; }
.gdn-scr::after { content: ""; position: absolute; z-index: 20; inset: 0; border-radius: inherit; background: rgba(226, 233, 242, .5); opacity: 0; transition: opacity .45s var(--ui-ease); pointer-events: none; }
.gdn-home { position: absolute; z-index: 12; left: 50%; bottom: 5px; width: 76px; height: 4px; margin-left: -38px; border-radius: 3px; background: rgba(13, 22, 36, .7); }
.gdn-tag { position: absolute; z-index: 3; left: 50%; bottom: -11px; display: inline-flex; align-items: center; gap: 4px; height: 21px; padding: 0 9px 0 7px; border-radius: 999px; translate: -50% 0;
  background: #fff; color: var(--navy); font-size: 10px; font-weight: 800; white-space: nowrap; box-shadow: 0 0 0 1px rgba(20, 61, 107, .14), 0 4px 10px -4px rgba(16, 37, 64, .4);
  transition: opacity .35s var(--ui-ease); }
.gdn-tag .gdn-i { width: 11px; height: 11px; stroke-width: 2.4; }

/* durum çubuğu (saat · ada · sinyal, wi-fi, pil) */
.gdn-sb { position: absolute; z-index: 11; inset: 0 0 auto; height: 22px; display: flex; align-items: center; justify-content: space-between; padding: 0 12px 0 18px; color: #0b1526; pointer-events: none; }
.gdn-sb > b { font-size: 10px; font-weight: 800; letter-spacing: -.01em; font-variant-numeric: tabular-nums; }
.gdn-isl { position: absolute; left: 50%; top: 5px; width: 50px; height: 14px; margin-left: -25px; border-radius: 999px; background: #05070b; }
.gdn-sbi { display: flex; align-items: center; gap: 2px; }
.gdn-sbi .gdn-i { width: 10px; height: 10px; stroke-width: 2.6; }
.gdn-sbi .gdn-bat { width: 15px; height: 11px; }
.gdn-sb--v { color: #fff; transition: color .3s var(--ui-ease) .45s; }
.gdn.s8 .gdn-sb--v { color: #0b1526; }
/* saat 12:38 → 12:40 (kayıt anı) */
.gdn-t1, .gdn-t2 { transition: opacity .3s var(--ui-ease) .4s; }
.gdn-t2, .gdn.s5 .gdn-t1 { opacity: 0; }
.gdn.s5 .gdn-t2 { opacity: 1; }

/* dokunuş: parmak izi + halka dalgası */
.gdn-tap { position: absolute; z-index: 9; width: 26px; height: 26px; margin: -13px 0 0 -13px; border-radius: 50%; pointer-events: none; opacity: 0;
  background: radial-gradient(circle, rgba(20, 61, 107, .34) 0%, rgba(20, 61, 107, .2) 60%, rgba(20, 61, 107, .1) 100%); box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, .55); }
.gdn-tap i { position: absolute; inset: -6px; border-radius: 50%; box-shadow: 0 0 0 2px rgba(29, 79, 134, .5); opacity: 0; }
@keyframes gdn-tap { 0% { opacity: 0; scale: 1.45; } 28% { opacity: 1; scale: 1; } 46% { scale: .8; } 64% { opacity: .9; scale: .9; } 100% { opacity: 0; scale: .9; } }
@keyframes gdn-rip { 0% { opacity: 0; scale: .4; } 15% { opacity: .85; } 100% { opacity: 0; scale: 1.9; } }
@keyframes gdn-push { 50% { scale: .96; } }
@keyframes gdn-blink { 0%, 49% { opacity: 1; } 50%, 100% { opacity: 0; } }

/* ── öğretmen uygulaması: üst şerit ── */
.gdn-hd { position: absolute; z-index: 3; inset: 0 0 auto; height: 62px; display: flex; align-items: center; gap: 6px; padding: 22px 9px 0;
  background: linear-gradient(180deg, #dce4ef 0%, #e9eef5 70%, #eff2f7 100%); box-shadow: inset 0 -1px 0 #d9e0ea; }
.gdn-ib { position: relative; flex: none; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #fff; color: #273246;
  box-shadow: 0 0 0 1px rgba(16, 37, 64, .06), 0 1px 2px rgba(16, 37, 64, .08), inset 0 1px 0 rgba(255, 255, 255, .6); }
.gdn-ib .gdn-i { width: 14px; height: 14px; }
.gdn-ib--bell::after { content: ""; position: absolute; top: 4px; right: 5px; width: 6px; height: 6px; border-radius: 50%; background: #e0352b; box-shadow: 0 0 0 1.5px #fff; }
.gdn-av { flex: none; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--navy); color: #fff; font-size: 10px; font-weight: 800; letter-spacing: .03em;
  box-shadow: 0 0 0 2px #fff, 0 2px 6px -2px rgba(16, 37, 64, .55); }
.gdn-tt { flex: 1; min-width: 0; line-height: 1.15; }
.gdn-tt b { display: block; font-size: 13.5px; font-weight: 800; letter-spacing: -.015em; white-space: nowrap; }
.gdn-tt span { display: block; margin-top: 2px; font-size: 10px; font-weight: 600; color: var(--ui-muted); white-space: nowrap; }

/* alt sekmeler */
.gdn-tab { position: absolute; z-index: 6; inset: auto 0 0; height: 48px; display: flex; justify-content: space-between; padding: 5px 12px 12px;
  background: rgba(255, 255, 255, .97); box-shadow: inset 0 1px 0 rgba(16, 37, 64, .08); }
.gdn-tab > span { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; font-size: 10px; font-weight: 700; line-height: 1; color: #3b4352; white-space: nowrap; letter-spacing: -.015em; }
.gdn-tab .gdn-i { width: 15px; height: 15px; stroke-width: 1.9; }

/* ortak kart / rozet / kare simge */
.gdn-card { position: relative; border-radius: 13px; 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); }
.gdn-bdg { display: inline-flex; align-items: center; height: 15px; padding: 0 5px; border-radius: 5px; font-style: normal; font-size: 10px; font-weight: 800; line-height: 1; white-space: nowrap; }
.gdn-bdg--z { background: #f1f1f3; color: #52525b; }
.gdn-bdg--e { background: #e3f6ec; color: var(--gdn-ok); }
.gdn-bdg--b { background: #e6eef8; color: var(--navy-soft); }
.gdn-tile { flex: none; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 9px; background: var(--ui-primary-soft); color: var(--navy-soft); }
.gdn-tile .gdn-i { width: 15px; height: 15px; stroke-width: 1.9; }
.gdn-tile--v { background: #efeafd; color: #6d3fd1; }
.gdn-sec { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; height: 26px; padding: 6px 2px 0; }
.gdn-sec b { font-size: 12.5px; font-weight: 800; letter-spacing: -.01em; color: #18181b; }
.gdn-sec small { font-size: 10px; font-weight: 800; color: var(--ui-muted); }

/* ── Danışanlarım (liste) ── */
.gdn-lv, .gdn-sv { position: absolute; inset: 0; }
.gdn-lv { z-index: 1; transition: translate .5s var(--ui-ease) .4s; }
.gdn-lv::after { content: ""; position: absolute; z-index: 4; inset: 0; background: rgba(15, 23, 42, .14); opacity: 0; transition: opacity .5s var(--ui-ease) .4s; pointer-events: none; }
.gdn-body { position: absolute; left: 0; right: 0; top: 62px; bottom: 48px; overflow: hidden; padding: 8px 9px 0; }
.gdn-srch { display: flex; align-items: center; gap: 7px; height: 32px; padding: 0 10px; border-radius: 11px; background: #fff; font-size: 10.5px; font-weight: 600; color: #8a93a3;
  box-shadow: 0 0 0 1px var(--ui-line-2), 0 1px 1px rgba(16, 37, 64, .03); }
.gdn-srch .gdn-i { width: 13px; height: 13px; color: #6a7486; }
.gdn-list { margin-top: 8px; }
.gdn-r { position: relative; display: flex; align-items: flex-start; gap: 8px; padding: 8px 8px 8px 9px; box-shadow: inset 0 1px 0 #f0f1f4; transition: background-color .25s var(--ui-ease) .18s; }
.gdn-r:first-child { box-shadow: none; }
.gdn-r .gdn-tile { margin-top: 6px; }
.gdn-r__t { flex: 1; min-width: 0; }
.gdn-r__t b { position: relative; display: block; font-size: 11.5px; font-weight: 700; line-height: 14px; letter-spacing: -.005em; color: #18181b; white-space: nowrap; }
.gdn-r__t em { margin-top: 3px; }
.gdn-r__t span { display: block; margin-top: 3px; font-size: 10px; font-weight: 500; line-height: 12.5px; color: #52525b; }
.gdn-chev { width: 13px; height: 13px; margin-top: 15px; color: #a1a1aa; }
.gdn-tap--can { left: 34px; top: 7px; }
.gdn.s1 .gdn-r--can { background: #eef3f9; }
.gdn.s1:not(.s2) .gdn-tap--can { animation: gdn-tap .7s var(--ui-ease) .05s both; }
.gdn.s1:not(.s2) .gdn-tap--can i { animation: gdn-rip .55s ease-out .25s both; }
.gdn.s1 .gdn-lv { translate: -30% 0; }
.gdn.s1 .gdn-lv::after { opacity: 1; }

/* ── öğrenci sayfası ── */
.gdn-sv { z-index: 2; translate: 100% 0; box-shadow: -10px 0 24px -14px rgba(16, 37, 64, .45); transition: translate .5s var(--ui-ease) .4s; background: #f4f6f9; }
.gdn.s1 .gdn-sv { translate: 0 0; }
.gdn-vp { position: absolute; left: 0; right: 0; top: 62px; bottom: 48px; overflow: hidden; }
.gdn-col { position: absolute; inset: 0 0 auto; padding: 4px 9px 14px; }
.gdn-col--a { transition: translate .6s var(--gdn-scroll), opacity .25s var(--ui-ease); }
.gdn.s2 .gdn-col--a { translate: 0 calc(-1 * var(--yA)); }
/* s3: «Veli görsün» s2 konumunda görünür ve dokunulur; alanlar açılınca sayfa aşağı kayar (önce kaydırılsaydı içerik bitmiş olurdu) */
.gdn.s3 .gdn-col--a { translate: 0 calc(-1 * var(--yB)); transition-delay: .55s, 0s; }
.gdn.s4 .gdn-col--a { translate: 0 calc(-1 * var(--yC)); transition-delay: 0s, 0s; }
.gdn-col--b { opacity: 0; transition: opacity .3s var(--ui-ease), translate .7s var(--gdn-scroll) .1s; }
.gdn.s5 .gdn-col--a { opacity: 0; transition-delay: 0s, 1.15s; }
.gdn.s5 .gdn-col--b { opacity: 1; transition-delay: 1.25s, 0s; }
.gdn.s6 .gdn-col--b { translate: 0 calc(-1 * var(--yD)); }

/* kurs ve kulüpler */
.gdn-kr { display: flex; align-items: flex-start; gap: 8px; padding: 8px 9px; box-shadow: inset 0 1px 0 #f0f1f4; }
.gdn-kr:first-child { box-shadow: none; }
.gdn-kr__t { flex: 1; min-width: 0; }
.gdn-kr__t b { display: block; font-size: 11px; font-weight: 700; line-height: 14px; color: #18181b; }
.gdn-kr__t > span { display: flex; align-items: center; gap: 5px; margin-top: 3px; font-size: 10px; font-weight: 600; color: #52525b; white-space: nowrap; }

/* görüşme ekle formu */
.gdn-form { padding: 9px 10px 10px; overflow: visible; }
.gdn-lbl { display: block; margin: 9px 0 4px; font-size: 10px; font-weight: 700; line-height: 13px; color: #52525b; }
.gdn-form > .gdn-lbl:first-child { margin-top: 0; }
.gdn-seg { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; }
.gdn-seg > * { display: grid; place-items: center; height: 28px; border-radius: 9px; background: #fff; font-size: 10.5px; font-weight: 700; color: #3f3f46; white-space: nowrap;
  box-shadow: inset 0 0 0 1px #d4d4d8; }
.gdn-seg > b { background: #eef3fa; color: var(--navy); box-shadow: inset 0 0 0 1.5px var(--navy-soft); }
.gdn-ta, .gdn-in { position: relative; display: block; border-radius: 10px; background: #fff; box-shadow: inset 0 0 0 1px #d4d4d8, 0 1px 1px rgba(16, 37, 64, .03);
  transition: box-shadow .25s var(--ui-ease); }
.gdn-ta { height: 88px; padding: 6px 8px; font-size: 10.5px; font-weight: 600; line-height: 15px; color: #27272a; }
.gdn-ta .gdn-ph { position: absolute; left: 8px; top: 6px; }
.gdn-ph { color: #9ca3af; font-weight: 500; white-space: nowrap; transition: opacity .2s var(--ui-ease); }
.gdn-in { display: flex; align-items: center; gap: 6px; height: 30px; padding: 0 9px; font-size: 10.5px; font-weight: 600; color: #27272a; }
.gdn-in .gdn-x { flex: 1; }
.gdn-in .gdn-x > * { align-self: center; }
.gdn-in > .gdn-i { width: 13px; height: 13px; color: #52525b; }
.gdn-ty { display: block; width: max-content; white-space: nowrap; clip-path: inset(0 100% 0 0); }
.gdn-car { display: inline-block; width: 1.5px; height: 12px; margin-left: 1px; border-radius: 1px; vertical-align: -2px; background: var(--navy-soft); opacity: 0; }
.gdn-in .gdn-ty { line-height: 30px; }

/* s2: not yazılır, sonraki görüşme girilir */
.gdn-ta--not .gdn-ty { transition: clip-path var(--du) steps(var(--c)) var(--t0); }
.gdn.s2 .gdn-ta--not .gdn-ty { clip-path: inset(0 -4px 0 0); }
.gdn.s2 .gdn-ta--not .gdn-ph { opacity: 0; transition-delay: .58s; }
.gdn.s2:not(.s3) .gdn-ta--not { box-shadow: inset 0 0 0 1.5px var(--navy-soft), 0 0 0 3px rgba(29, 79, 134, .13); transition-delay: .45s; }
.gdn.s2:not(.s3) .gdn-ta--not .gdn-car { animation: gdn-blink 1s steps(1) 1.6s infinite; }
.gdn-dt1 { opacity: 0; transition: opacity .2s var(--ui-ease) 1.62s; }
.gdn.s2 .gdn-in--dt .gdn-dt0 { opacity: 0; transition-delay: 1.6s; }
.gdn.s2 .gdn-dt1 { opacity: 1; }
.gdn.s2:not(.s3) .gdn-in--dt { animation: gdn-fdt 1.8s linear both; }
@keyframes gdn-fdt { 0%, 82% { box-shadow: inset 0 0 0 1px #d4d4d8; } 86%, 100% { box-shadow: inset 0 0 0 1.5px var(--navy-soft), 0 0 0 3px rgba(29, 79, 134, .13); } }

/* aileyle paylaş */
.gdn-fs { position: relative; display: block; margin-top: 12px; padding: 12px 8px 8px; border-radius: 11px; box-shadow: inset 0 0 0 1px #e4e4e7; }
.gdn-lg { position: absolute; left: 8px; top: -7px; padding: 0 4px; background: #fff; font-size: 10px; font-weight: 700; line-height: 13px; color: #52525b; }
.gdn-cbs { display: flex; gap: 5px; }
.gdn-cb { position: relative; display: inline-flex; align-items: center; gap: 5px; height: 30px; padding: 0 7px; border-radius: 9px; background: #fff; font-size: 10.5px; font-weight: 700; color: #3f3f46; white-space: nowrap;
  box-shadow: inset 0 0 0 1.5px #e4e4e7; transition: background-color .2s var(--ui-ease), box-shadow .2s var(--ui-ease), color .2s var(--ui-ease); }
.gdn-cb > i { display: grid; place-items: center; width: 13px; height: 13px; border-radius: 3.5px; background: #fff; color: #fff; box-shadow: inset 0 0 0 1.5px #a1a1aa;
  transition: background-color .2s var(--ui-ease), box-shadow .2s var(--ui-ease); }
.gdn-cb > i .gdn-i { width: 10px; height: 10px; stroke-width: 3.2; opacity: 0; scale: .4; transition: opacity .15s var(--ui-ease), scale .35s var(--gdn-spring); }
.gdn-help { display: block; margin-top: 6px; font-size: 10px; font-weight: 500; line-height: 13px; color: #6b7280; }
.gdn-tap--veli { left: 22px; top: 15px; }
.gdn-tap--ogr { left: 24px; top: 15px; }
.gdn.s3:not(.s4) .gdn-tap--veli { animation: gdn-tap .6s var(--ui-ease) .12s both; }
.gdn.s3:not(.s4) .gdn-tap--veli i { animation: gdn-rip .5s ease-out .29s both; }
.gdn.s3:not(.s4) .gdn-tap--ogr { animation: gdn-tap .6s var(--ui-ease) 1.1s both; }
.gdn.s3:not(.s4) .gdn-tap--ogr i { animation: gdn-rip .5s ease-out 1.27s both; }
.gdn.s3 .gdn-col--a .gdn-cb { background: #eef3fa; color: var(--navy); box-shadow: inset 0 0 0 1.5px var(--navy-soft); }
.gdn.s3 .gdn-col--a .gdn-cb > i { background: var(--navy-soft); box-shadow: inset 0 0 0 1.5px var(--navy-soft); }
.gdn.s3 .gdn-col--a .gdn-cb > i .gdn-i { opacity: 1; scale: 1; }
.gdn.s3 .gdn-col--a .gdn-cb--v, .gdn.s3 .gdn-col--a .gdn-cb--v > i, .gdn.s3 .gdn-col--a .gdn-cb--v > i .gdn-i { transition-delay: .29s; }
.gdn.s3 .gdn-col--a .gdn-cb--o, .gdn.s3 .gdn-col--a .gdn-cb--o > i, .gdn.s3 .gdn-col--a .gdn-cb--o > i .gdn-i { transition-delay: 1.27s; }

/* paylaşım seçilince açılan alanlar + önizleme (grid satırı 0fr → 1fr) */
.gdn-pa { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .5s var(--ui-ease) .34s; }
.gdn-pa__in { display: block; min-height: 0; overflow: hidden; opacity: 0; transition: opacity .3s var(--ui-ease) .4s; }
.gdn.s3 .gdn-pa { grid-template-rows: 1fr; }
.gdn.s3 .gdn-pa__in { opacity: 1; }
.gdn-pa__in > .gdn-lbl:first-child { margin-top: 8px; }
.gdn-ta--kr { height: 48px; }
.gdn-pv { display: block; margin-top: 8px; padding: 7px 9px 8px; border-radius: 10px; background: #f1f6fc; box-shadow: inset 0 0 0 1px #c8d7ea; }
.gdn-pv__kim { font-size: 10px; font-weight: 800; line-height: 13px; letter-spacing: .03em; color: var(--navy-soft); white-space: nowrap; }
.gdn-pv__konu { margin-top: 2px; font-size: 11.5px; font-weight: 800; line-height: 15px; color: #18181b; }
.gdn-pv__tur, .gdn-pv__sn { display: block; margin-top: 2px; font-size: 10px; font-weight: 700; line-height: 13px; color: #6b7280; }
.gdn-gr { display: grid; }
.gdn-gr > span { min-height: 0; overflow: hidden; }
.gdn-pv__kr { grid-template-rows: 0fr; font-size: 10px; font-weight: 500; line-height: 13px; color: #3f3f46; transition: grid-template-rows .4s var(--ui-ease) 1.66s, opacity .3s var(--ui-ease) 1.7s; opacity: 0; }
.gdn-pv__kr > span { padding-top: 2px; }
.gdn-pv__uy { grid-template-rows: 1fr; font-size: 10px; font-weight: 700; line-height: 13px; color: #b45309; transition: grid-template-rows .35s var(--ui-ease) .9s, opacity .2s var(--ui-ease) .9s; }
.gdn-pv__uy > span { padding-top: 5px; }
.gdn.s4 .gdn-pv__kr { grid-template-rows: 1fr; opacity: 1; }
.gdn.s4 .gdn-pv__uy { grid-template-rows: 0fr; opacity: 0; }
.gdn-k1, .gdn-k2, .gdn-c1, .gdn-c2 { transition: opacity .2s var(--ui-ease); }
.gdn-k1, .gdn-k2, .gdn-c2 { opacity: 0; }
.gdn.s3:not(.s4) .gdn-k1 { animation: gdn-k1 1.5s linear both; }
@keyframes gdn-k1 { 0%, 80% { opacity: 1; } 86%, 100% { opacity: 0; } }
.gdn.s3 .gdn-k2 { opacity: 1; transition-delay: 1.3s; }
.gdn.s4 .gdn-c1 { opacity: 0; transition-delay: .88s; }
.gdn.s4 .gdn-c2 { opacity: 1; transition-delay: .9s; }

/* s4: konu ve karar yazılır */
.gdn-in--konu .gdn-ty, .gdn-ta--kr .gdn-ty { transition: clip-path var(--du) steps(var(--c)) var(--t0); }
.gdn.s4 .gdn-in--konu .gdn-ty, .gdn.s4 .gdn-ta--kr .gdn-ty { clip-path: inset(0 -4px 0 0); }
.gdn.s4 .gdn-in--konu .gdn-ph { opacity: 0; transition-delay: .48s; }
.gdn.s4 .gdn-ta--kr .gdn-ph { opacity: 0; transition-delay: 1s; }
.gdn.s4:not(.s5) .gdn-in--konu { animation: gdn-fk 2s linear both; }
.gdn.s4:not(.s5) .gdn-ta--kr { animation: gdn-fr 2s linear both; }
.gdn.s4:not(.s5) .gdn-in--konu .gdn-car { animation: gdn-ck 2s linear both; }
.gdn.s4:not(.s5) .gdn-ta--kr .gdn-car { animation: gdn-blink 1s steps(1) 1.75s infinite; }
@keyframes gdn-fk { 0%, 20% { box-shadow: inset 0 0 0 1px #d4d4d8; } 23%, 48% { box-shadow: inset 0 0 0 1.5px var(--navy-soft), 0 0 0 3px rgba(29, 79, 134, .13); } 51%, 100% { box-shadow: inset 0 0 0 1px #d4d4d8; } }
@keyframes gdn-fr { 0%, 48% { box-shadow: inset 0 0 0 1px #d4d4d8; } 51%, 100% { box-shadow: inset 0 0 0 1.5px var(--navy-soft), 0 0 0 3px rgba(29, 79, 134, .13); } }
@keyframes gdn-ck { 0%, 43% { opacity: 0; } 44%, 49% { opacity: 1; } 50%, 100% { opacity: 0; } }

/* kaydet */
.gdn-btn { position: relative; display: flex; align-items: center; justify-content: center; gap: 6px; height: 34px; margin-top: 10px; border-radius: 11px; color: #fff; font-size: 11.5px; font-weight: 800; white-space: nowrap;
  background: linear-gradient(180deg, #1b4b80, var(--navy)); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18), 0 1px 2px rgba(16, 37, 64, .22), 0 8px 16px -10px rgba(16, 37, 64, .6); }
.gdn-btn .gdn-i { width: 13px; height: 13px; stroke-width: 2.8; }
.gdn-tap--save { left: 62%; top: 17px; }
.gdn.s5:not(.s6) .gdn-btn--go { animation: gdn-push .3s var(--ui-ease) .3s; }
.gdn.s5:not(.s6) .gdn-tap--save { animation: gdn-tap .6s var(--ui-ease) .05s both; }
.gdn.s5:not(.s6) .gdn-tap--save i { animation: gdn-rip .5s ease-out .22s both; }

/* «Kaydediliyor…» katmanı (footer.php data-busy) */
.gdn-busy { position: absolute; inset: 0; z-index: 8; display: grid; place-items: center; padding: 0 18px; background: rgba(18, 22, 31, .62); opacity: 0; pointer-events: none; }
.gdn-busy__c { display: flex; flex-direction: column; align-items: center; width: 100%; max-width: 210px; padding: 14px 12px 13px; border-radius: 16px; background: #fff; text-align: center;
  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); }
.gdn-busy__c b { margin-top: 9px; font-size: 12.5px; font-weight: 800; color: var(--ui-text); }
.gdn-busy__c span { margin-top: 3px; font-size: 10px; font-weight: 700; line-height: 1.35; color: var(--ui-muted); text-wrap: balance; }
.gdn-spin { width: 26px; height: 26px; color: var(--navy-soft); stroke-width: 3; fill: none; stroke: currentColor; stroke-linecap: round; animation: gdn-rot .8s linear infinite; }
.gdn-spin circle { opacity: .2; }
@keyframes gdn-rot { to { rotate: 1turn; } }
.gdn.s5:not(.s6) .gdn-busy { animation: gdn-busy 1.6s var(--ui-ease) both; }
@keyframes gdn-busy { 0%, 26% { opacity: 0; } 32%, 74% { opacity: 1; } 80%, 100% { opacity: 0; } }

/* yenilenen sayfa: yeşil şerit + görüşme geçmişi */
.gdn-fl { display: flex; align-items: flex-start; gap: 6px; margin: 6px 0 2px; padding: 7px 9px; border-radius: 10px; background: #e3f6ec; color: var(--gdn-ok-ink); font-size: 10.5px; font-weight: 700; line-height: 14px;
  box-shadow: inset 0 0 0 1px rgba(4, 120, 87, .12); }
.gdn-fl .gdn-i { width: 13px; height: 13px; margin-top: 0; stroke-width: 2.3; }
.gdn-col--b .gdn-fl { scale: .97; opacity: 0; transition: opacity .3s var(--ui-ease) 1.35s, scale .45s var(--gdn-spring) 1.35s; }
.gdn.s5 .gdn-col--b .gdn-fl { opacity: 1; scale: 1; }
.gdn-sec--h { margin-top: 2px; }
.gdn-hi { display: block; padding: 9px 10px 10px; box-shadow: inset 0 1px 0 #f0f1f4; }
.gdn-hi:first-child { box-shadow: none; }
.gdn-hi__r { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 5px; }
.gdn-hi__r > b { font-size: 10px; font-weight: 800; letter-spacing: .03em; color: #6b7280; }
.gdn-hi__k { display: block; margin-top: 5px; font-size: 11.5px; font-weight: 800; line-height: 15px; color: #18181b; }
.gdn-hi__m { display: block; margin-top: 3px; font-size: 10.5px; font-weight: 500; line-height: 14.5px; color: #27272a; }
.gdn-hi__c { display: block; margin-top: 5px; font-size: 10px; font-weight: 500; line-height: 13.5px; color: #3f3f46; }
.gdn-hi__c b { font-weight: 800; }
.gdn-hi__s { display: block; margin-top: 4px; font-size: 10px; font-weight: 700; line-height: 13px; color: #6b7280; }

/* ── velinin telefonu: kilit ekranı ── */
.gdn-lock { position: absolute; inset: 0; z-index: 1; display: flex; flex-direction: column; align-items: center; color: #fff;
  background:
    radial-gradient(80% 50% at 85% 18%, rgba(84, 141, 204, .45) 0%, rgba(84, 141, 204, 0) 70%),
    radial-gradient(70% 45% at 10% 85%, rgba(255, 182, 39, .16) 0%, rgba(255, 182, 39, 0) 70%),
    linear-gradient(168deg, #22598f 0%, #143d6b 46%, #0a2340 100%);
  transition: opacity .35s var(--ui-ease) .42s; }
.gdn-wall { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.gdn-lock > .gdn-lock__k, .gdn-lock > .gdn-lock__h, .gdn-lock > .gdn-lock__d { position: relative; }
.gdn-lock__k { width: 13px; height: 13px; margin-top: 30px; opacity: .85; stroke-width: 2.2; }
.gdn-lock__h { margin-top: 6px; font-size: 50px; font-weight: 700; line-height: 1; letter-spacing: -.03em; font-variant-numeric: tabular-nums; text-shadow: 0 2px 14px rgba(5, 15, 30, .25); }
.gdn-lock__h > * { text-align: center; }
.gdn-lock__d { margin-top: 6px; font-size: 11.5px; font-weight: 700; letter-spacing: .01em; color: rgba(255, 255, 255, .88); }
.gdn-lock__b { position: absolute; left: 22px; right: 22px; bottom: 22px; display: flex; justify-content: space-between; }
.gdn-lock__b > span { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: rgba(255, 255, 255, .16); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14); }
.gdn-lock__b .gdn-i { width: 15px; height: 15px; }
.gdn-tel--v .gdn-home { background: rgba(255, 255, 255, .85); transition: background-color .3s var(--ui-ease) .45s; }
.gdn.s8 .gdn-tel--v .gdn-home { background: rgba(13, 22, 36, .7); }

/* bildirim kartı */
.gdn-nt { position: absolute; left: 9px; right: 9px; top: 146px; display: flex; align-items: flex-start; gap: 8px; padding: 9px 10px 10px; border-radius: 16px; color: #0b1526;
  background: rgba(255, 255, 255, .9); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .35), 0 2px 4px rgba(5, 15, 30, .12), 0 16px 30px -14px rgba(5, 15, 30, .55);
  opacity: 0; translate: 0 -14px; scale: .94; transition: opacity .3s var(--ui-ease), translate .55s var(--gdn-spring), scale .55s var(--gdn-spring); }
.gdn-nt img { flex: none; width: 26px; height: 26px; border-radius: 7px; }
.gdn-nt__t { flex: 1; min-width: 0; font-size: 10.5px; font-weight: 600; line-height: 14px; color: #1f2937; }
.gdn-nt__h { display: flex; align-items: baseline; justify-content: space-between; gap: 6px; margin-bottom: 1px; }
.gdn-nt__h b { font-size: 11px; font-weight: 800; color: #0b1526; white-space: nowrap; }
.gdn-nt__h em { flex: none; font-style: normal; font-size: 10px; font-weight: 600; color: #6b7280; }
.gdn.s7 .gdn-nt { opacity: 1; translate: 0 0; scale: 1; transition-delay: .5s; }
.gdn-tap--nt { left: 50%; top: 50%; }
.gdn.s8 .gdn-tap--nt { animation: gdn-tap .6s var(--ui-ease) .02s both; }
.gdn.s8 .gdn-tap--nt i { animation: gdn-rip .5s ease-out .18s both; }
.gdn.s8 .gdn-nt { scale: .97; transition-delay: .2s; }
.gdn.s8 .gdn-lock { opacity: 0; }

/* ── «Gözlem ve görüşmeler» (veli) ── */
.gdn-pp { position: absolute; inset: 0; z-index: 2; background: #f6f7fb; opacity: 0; scale: .96; transition: opacity .35s var(--ui-ease) .42s, scale .5s var(--ui-ease) .42s; }
.gdn.s8 .gdn-pp { opacity: 1; scale: 1; }
.gdn-ph2 { position: absolute; inset: 22px 0 auto; height: 40px; display: flex; align-items: center; gap: 8px; padding: 0 10px 0 12px; }
.gdn-ph2__b { width: 16px; height: 16px; color: #18181b; stroke-width: 2.2; }
.gdn svg.gdn-logo { flex: none; width: 28px; height: 28px; border-radius: 50%; box-shadow: 0 0 0 1.5px rgba(255, 255, 255, .8), 0 2px 5px -1px rgba(16, 37, 64, .4); }
.gdn-ph2__sp { flex: 1; }
.gdn-ph2__bell { position: relative; display: grid; place-items: center; width: 26px; height: 26px; color: #27272a; }
.gdn-ph2__bell .gdn-i { width: 15px; height: 15px; }
.gdn-ph2__bell::after { content: ""; position: absolute; top: 3px; right: 4px; width: 6px; height: 6px; border-radius: 50%; background: #ef4444; box-shadow: 0 0 0 1.5px #f6f7fb; }
.gdn-ph2__av { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #fff; color: var(--navy-soft); font-size: 12.5px; font-weight: 800; box-shadow: 0 0 0 1.5px #e4e4e7; }
.gdn-pb { position: absolute; left: 0; right: 0; top: 62px; bottom: 48px; overflow: hidden; padding: 2px 10px 0; }
.gdn-kids { display: flex; gap: 6px; }
.gdn-kid { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 11px 0 3px; border-radius: 13px; background: #fff; font-size: 10.5px; font-weight: 800; color: #3f3f46; box-shadow: inset 0 0 0 1px #e4e4e7; }
.gdn-kid i { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; font-style: normal; font-size: 10.5px; font-weight: 800; color: var(--navy-soft); }
.gdn-kid--on { background: linear-gradient(180deg, #1b4b80, var(--navy)); color: #fff; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16), 0 4px 10px -6px rgba(16, 37, 64, .6); }
.gdn-kid--on i { background: rgba(255, 255, 255, .2); color: #fff; }
.gdn-pt { display: block; margin-top: 9px; font-size: 15px; font-weight: 800; line-height: 19px; letter-spacing: -.02em; color: #0f172a; white-space: nowrap; }
.gdn-pl { display: block; margin-top: 1px; font-size: 10px; font-weight: 500; line-height: 13px; color: #52525b; }
.gdn-sec--p { margin-top: 2px; }
.gdn-sec--p b { font-size: 12px; }
.gdn-pc { margin-top: 2px; }
.gdn-pi { display: flex; align-items: flex-start; gap: 9px; padding: 9px 10px 10px; box-shadow: inset 0 1px 0 #f0f1f4; }
.gdn-pi:first-child { box-shadow: none; }
.gdn-pi--new { background: #f2f6fb; }
.gdn.s8 .gdn-pi--new { animation: gdn-hl 1.6s var(--ui-ease) .55s both; }
@keyframes gdn-hl { 0% { background-color: #fff; } 30% { background-color: #e5eef9; } 100% { background-color: #f2f6fb; } }
.gdn-pi__t { flex: 1; min-width: 0; }
.gdn-pi__t > b { display: block; font-size: 12px; font-weight: 800; line-height: 15px; letter-spacing: -.01em; color: #0f172a; }
.gdn-pi__m { display: block; margin-top: 2px; font-size: 10px; font-weight: 500; line-height: 13px; color: #52525b; }
.gdn-pi__c { display: block; margin-top: 6px; padding: 5px 8px 6px; border-radius: 8px; background: #f4f4f5; font-size: 10.5px; font-weight: 700; line-height: 14px; color: #3f3f46; }
.gdn-pi--new .gdn-pi__c { background: #fff; box-shadow: inset 0 0 0 1px #e8ebf0; }
.gdn-pi__c small { display: block; margin-bottom: 1px; font-size: 10px; font-weight: 700; letter-spacing: .05em; line-height: 13px; color: #6b7280; }
.gdn-pi__s { display: block; margin-top: 5px; font-size: 10px; font-weight: 600; line-height: 13px; color: #52525b; }
.gdn-tab--p { z-index: 3; }
.gdn-tab--p > span:first-child { color: #3b4352; }

/* ── DAR KAP: telefonlar üst üste; velinin telefonu 7. adımda öğretmeninkinin üstüne kayar ── */
@container (max-width: 599px) {
  .gdn-st { --off: clamp(0px, round(down, (100cqw - var(--pw)) / 2 - 12px, 1px), 96px); }
  .gdn-rail { display: none; }
  .gdn-tel--t, .gdn-tel--v { left: round(down, 50cqw - var(--pw) / 2, 1px); }
  .gdn-tel--v { z-index: 4; opacity: 0; translate: calc(var(--off) + 44px) 0; }
  .gdn.s7 .gdn-tel--t { translate: calc(-1 * var(--off)) 0; }
  .gdn.s7 .gdn-tel--t .gdn-scr::after { opacity: 1; }
  .gdn.s7 .gdn-tel--t .gdn-tag { opacity: 0; }
  .gdn.s7 .gdn-tel--v { opacity: 1; translate: var(--off) 0; }
  .gdn.s7 .gdn-nt { transition-delay: .68s; }
}