/* İSNAD Künye Atölyesi — canlı oyun (canli.html telefon, canli-perde.html perde).
   Renkler ve Atıf stil.css'ten (açık/koyu tema oradan). Telefon önce:
   375×812 ve 812×375; dokunma hedefleri 44 px. Perde masaüstü/projektör. */

:root{
  --s0:#1F5FA8; --s1:#8A6414; --s2:#1F6B4D; --s3:#9B2C2C;   /* A B C D: seçenek işaretleri */
  --altin:#C9A227;
}
body.canli-tel,body.canli-perde{padding:0;margin:0;background:var(--kagit);color:var(--murekkep);min-height:100vh}
.canli-tel button,.canli-perde button{font:inherit;cursor:pointer}
.canli-tel button:focus-visible,.canli-perde button:focus-visible,.canli-tel input:focus-visible,.canli-perde input:focus-visible,
.canli-tel a:focus-visible,.canli-perde a:focus-visible{outline:3px solid var(--vurgu);outline-offset:2px}
button.birincil,button.ikincil{min-height:44px;border-radius:8px;padding:.55rem 1rem;border:1px solid}
button.buyuk{font-size:1.1rem;padding:.75rem 1.3rem}
button:disabled{opacity:.5;cursor:default}
.ust-etiket{font-family:var(--veri);font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--murekkep-3)}
i{font-style:italic}

/* ══ TELEFON ══════════════════════════════════════════════════════════════ */
.c-sarmal{max-width:34rem;margin:0 auto;padding:max(12px,env(safe-area-inset-top)) 16px calc(16px + env(safe-area-inset-bottom))}
.c-bekle{padding:2rem 0;text-align:center;color:var(--murekkep-2)}
.c-kart{background:var(--panel);border:1px solid var(--cizgi);border-radius:12px;padding:1rem;margin:.6rem 0;display:flex;flex-direction:column;gap:.7rem}
.c-atif .as-g{width:88px}
.c-atif .as-balon{margin-bottom:.6rem}
.c-alan{display:flex;flex-direction:column;gap:.2rem;font-weight:600;font-size:.95rem}
.c-alan input{min-height:48px;padding:.5rem .7rem;font:inherit;font-size:1.1rem;background:var(--kagit);color:var(--murekkep);border:1px solid var(--cizgi-koyu);border-radius:6px}
#c-kod{font-family:var(--veri);font-size:1.6rem;letter-spacing:.3em;max-width:12rem}
#c-sinif{font-family:var(--veri);letter-spacing:.1em;max-width:10rem}
#c-form{display:flex;flex-direction:column;gap:.8rem}
.c-ben{margin:0}
.c-hata{margin:0;min-height:1.2rem;color:var(--olmaz);font-weight:600}
.c-uyari{margin:0;background:var(--uyari-zem);color:var(--murekkep);padding:.5rem .7rem;border-radius:6px}
.c-not{margin:0;font-size:.86rem;color:var(--murekkep-2)}
.c-not a,.c-bag{color:var(--vurgu)}
.c-bag{background:none;border:0;padding:.7rem .2rem;margin:-.7rem 0;text-decoration:underline;font-size:.86rem;line-height:1.2}
.c-genis{width:100%}
.c-aydinlatma{font-size:.86rem;color:var(--murekkep-2);border-left:3px solid var(--cizgi-koyu);padding-left:.7rem}
.c-dugme-bag{display:inline-flex;align-items:center;min-height:44px;padding:.5rem 1rem;border-radius:8px;background:var(--vurgu);color:var(--kagit);text-decoration:none;font-weight:600}

.c-soru{display:flex;flex-direction:column;gap:.6rem;padding-bottom:5.5rem}
.c-soru-bas{display:flex;justify-content:space-between;align-items:center;font-family:var(--veri);font-size:.85rem;color:var(--murekkep-2)}
.c-etiket{background:var(--vurgu);color:var(--kagit);padding:.15rem .6rem;border-radius:99px;font-family:var(--govde);font-weight:700;font-size:.9rem}
.c-alt-baslik{margin:0;font-size:.85rem;color:var(--murekkep-3)}
.c-sayac-satir{display:flex;align-items:center;gap:.6rem}
.c-sayac{flex:1;height:6px;background:var(--cizgi);border-radius:3px;overflow:hidden}
.c-sayac-sn{font-family:var(--veri);min-width:2ch;text-align:right}
[tabindex="-1"]:focus{outline:none}
.c-sayac span{display:block;height:100%;width:100%;background:var(--vurgu);transition:width .2s linear}
.c-yonerge{margin:0;font-weight:650}
.c-yonerge small{font-weight:400;color:var(--murekkep-2)}
.c-kunye{margin:0;font-family:var(--serif);font-size:1.05rem;line-height:1.5;background:var(--panel-2);padding:.6rem .7rem;border-radius:8px;overflow-wrap:anywhere}

/* Hatayı bul: parçalar dokunulabilir; ayırıcılar ayrı küçük taş. */
.c-parcalar{display:flex;flex-wrap:wrap;gap:.4rem}
.c-parca{min-height:44px;min-width:44px;padding:.35rem .6rem;border-radius:8px;border:2px solid var(--cizgi-koyu);background:var(--panel);color:var(--murekkep);
  font-family:var(--serif);font-size:1rem;line-height:1.3;text-align:left;overflow-wrap:anywhere}
.canli-tel .c-parca{font-family:var(--serif)}
.canli-tel .c-parca.c-ara,.canli-tel .c-parca.c-son{font-family:var(--veri);font-weight:700;background:var(--panel-2);justify-content:center;text-align:center}
.c-parca[aria-pressed="true"]{border-color:var(--isaret);background:var(--isaret-zem);box-shadow:0 0 0 2px var(--isaret)}
.c-dizilen{margin:0;padding:.4rem .4rem .4rem 2rem;min-height:3.2rem;border:2px dashed var(--cizgi-koyu);border-radius:8px;display:flex;flex-direction:column;gap:.35rem}
.c-dizilen .c-parca{width:100%;border-color:var(--vurgu)}

.c-secenekler{display:flex;flex-direction:column;gap:.5rem}
.c-secenek{display:flex;gap:.6rem;align-items:center;min-height:52px;padding:.5rem .6rem;border-radius:10px;border:2px solid var(--cizgi-koyu);
  background:var(--panel);color:var(--murekkep);text-align:left;font-size:1rem}
.c-secenekler.kunye .c-secenek{font-family:var(--serif);font-size:.95rem;line-height:1.4;align-items:flex-start}
.c-harf{flex:none;width:2rem;height:2rem;border-radius:6px;display:grid;place-items:center;color:#fff;font-family:var(--govde);font-weight:800}
.renk0 .c-harf,.renk0 .p-harf{background:var(--s0)} .renk1 .c-harf,.renk1 .p-harf{background:var(--s1)}
.renk2 .c-harf,.renk2 .p-harf{background:var(--s2)} .renk3 .c-harf,.renk3 .p-harf{background:var(--s3)}
.c-secenek[aria-pressed="true"]{border-color:var(--vurgu);background:var(--vurgu-yum);box-shadow:0 0 0 2px var(--vurgu)}
.c-gonder{position:fixed;left:0;right:0;bottom:0;padding:.6rem max(16px,env(safe-area-inset-right)) calc(.6rem + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));background:var(--kagit);border-top:1px solid var(--cizgi)}
.c-gonder button{display:block;max-width:34rem;margin:0 auto}

.c-sonuc-baslik{margin:0;font-family:var(--serif);font-size:1.9rem;text-align:center}
.c-sonuc.dogru .c-sonuc-baslik{color:var(--olur)}
.c-sonuc.yanlis .c-sonuc-baslik{color:var(--murekkep-2)}
.c-kural{margin:0}
.c-dogrusu{background:var(--olur-zem);border-left:4px solid var(--olur);padding:.5rem .7rem;border-radius:6px}
.c-dogrusu p{margin:.2rem 0}
.c-dogrusu .c-kunye{background:none;padding:0}
.c-puan{margin:0;text-align:center;font-size:1.05rem}
.c-puan b{font-size:1.5rem}

/* Yatay telefon: Atıf küçülür, seçenekler iki sütun. */
@media (orientation:landscape) and (max-height:500px){
  .c-sarmal{max-width:none;padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}
  .c-atif .as-g{width:56px}
  .c-secenekler{display:grid;grid-template-columns:1fr 1fr}
  .c-soru{padding-bottom:4.4rem}
  .c-gonder{padding-top:.4rem;padding-bottom:.4rem}
  .c-sonuc-baslik{font-size:1.4rem}
}

/* ══ PERDE ════════════════════════════════════════════════════════════════ */
.p-sarmal{max-width:110rem;margin:0 auto;padding:0 clamp(16px,2.5vw,40px) 2rem}
.p-bekle{padding:3rem 0;text-align:center;font-size:1.3rem;color:var(--murekkep-2)}
.p-kart{background:var(--panel);border:1px solid var(--cizgi);border-radius:12px;padding:1rem 1.2rem;margin:0 0 1rem}
.p-giris{max-width:34rem;margin:3rem auto;text-align:center}
.p-giris-atif{width:140px;height:140px;margin:0 auto}
.p-giris h1,.p-ust h1{font-family:var(--serif);font-weight:400;font-size:2rem;margin:.2rem 0}
.p-ust{display:flex;justify-content:space-between;align-items:flex-end;gap:1rem;flex-wrap:wrap;padding:1.2rem 0 .8rem}
.p-kim{font-size:.9rem;color:var(--murekkep-2)}
.p-kim a,.p-not a{color:var(--vurgu)}
.p-not{font-size:.88rem;color:var(--murekkep-2);margin:.4rem 0}
.p-hata{color:var(--olmaz);font-weight:600;min-height:1.2rem}
.p-uyari{background:var(--uyari-zem);padding:.6rem .8rem;border-radius:6px}
.p-satir{display:flex;gap:.6rem;flex-wrap:wrap;align-items:center;margin:.6rem 0}
.p-bag{background:none;border:0;padding:0;color:var(--vurgu);text-decoration:underline;min-height:44px}
.canli-perde button.birincil{background:var(--vurgu);color:var(--kagit);border-color:var(--vurgu);font-weight:600}
.canli-perde button.ikincil{background:transparent;color:var(--vurgu);border-color:var(--cizgi-koyu)}
.p-don{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;border-left:4px solid var(--altin)}

.p-kur h2{font-family:var(--serif);font-weight:400;margin:0 0 .4rem}
.p-kur fieldset{border:0;padding:0;margin:0 0 1rem}
.p-kur legend{font-weight:700;margin-bottom:.4rem}
.p-kur legend small{font-weight:400;color:var(--murekkep-2)}
.p-secler{display:flex;flex-wrap:wrap;gap:.4rem}
.p-sec{display:flex;align-items:center;gap:.45rem;min-height:44px;padding:.3rem .7rem;border:1px solid var(--cizgi-koyu);border-radius:8px;cursor:pointer}
.p-sec small{color:var(--murekkep-3)}
.p-sec:has(input:checked){background:var(--vurgu-yum);border-color:var(--vurgu)}
.p-sec input{width:1.1rem;height:1.1rem}
.p-dugmeler{display:flex;flex-wrap:wrap;gap:.4rem}
.p-secim{min-height:44px;padding:.35rem .9rem;border-radius:8px;border:1px solid var(--cizgi-koyu);background:var(--panel);color:var(--murekkep)}
.p-secim.secili{background:var(--vurgu);color:var(--kagit);border-color:var(--vurgu);font-weight:600}
.p-iki{display:flex;gap:2rem;flex-wrap:wrap}

.p-cubuk{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;padding:.5rem 0;border-bottom:1px solid var(--cizgi);margin-bottom:1rem}
.p-kod-kucuk{font-family:var(--veri);font-size:1.05rem}
.p-kod-kucuk b{font-size:1.3rem;letter-spacing:.12em}
.p-cubuk-ara{flex:1}
.p-arac{min-height:40px;padding:.3rem .7rem;border-radius:8px;border:1px solid var(--cizgi-koyu);background:transparent;color:var(--murekkep-2);font-size:.9rem}
.p-arac[aria-pressed="true"]{color:var(--vurgu);border-color:var(--vurgu)}

/* Atıf (perdede tek; sunucu) */
.p-atif .atif-soz{align-items:flex-end}
.p-atif .as-g{width:clamp(110px,10vw,170px)}
.p-atif .as-balon{font-size:clamp(1.05rem,1.4vw,1.45rem);max-width:40rem}
.p-atif-yazan{width:clamp(90px,8vw,130px);height:auto;aspect-ratio:1;display:block}

/* Lobi */
.p-lobi{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:2rem;align-items:start}
.p-katil{display:flex;gap:2rem;align-items:center;margin-top:1.4rem;flex-wrap:wrap}
.p-qr{width:clamp(180px,20vw,300px);aspect-ratio:1;background:#fff;padding:12px;border-radius:12px}
.p-qr svg{width:100%;height:100%;display:block}
.p-buyuk-kod{font-family:var(--veri);font-weight:800;font-size:clamp(3rem,5vw,6rem);letter-spacing:.12em;line-height:1;color:var(--lacivert)}
.p-adres{font-family:var(--veri);font-size:clamp(.9rem,1.2vw,1.2rem);color:var(--murekkep-2);overflow-wrap:anywhere}
.p-lobi-sag h2{font-family:var(--serif);font-weight:400;margin:0 0 .6rem;display:flex;align-items:center;gap:.6rem}
.p-sayi{background:var(--vurgu);color:var(--kagit);border-radius:99px;padding:0 .7rem;font-family:var(--govde);font-weight:700;font-size:1.1rem}
.p-adlar{display:flex;flex-wrap:wrap;gap:.4rem;max-height:46vh;overflow:auto}
.p-ad{min-height:40px;padding:.3rem .8rem;border-radius:99px;border:1px solid var(--cizgi-koyu);background:var(--panel-2);color:var(--murekkep);font-size:1.05rem;animation:pBelir .35s ease-out both}
.p-ad.onay{border-color:var(--olmaz);color:var(--olmaz)}
@keyframes pBelir{from{transform:scale(.6);opacity:0}to{transform:none;opacity:1}}

/* Soru */
.p-soru-bas{display:flex;gap:1rem;align-items:center;flex-wrap:wrap;font-size:1.05rem;color:var(--murekkep-2)}
.p-etiket{background:var(--vurgu);color:var(--kagit);font-weight:700;border-radius:99px;padding:.15rem .8rem}
.p-no{margin-left:auto;font-family:var(--veri)}
.p-soru-ust{display:flex;justify-content:space-between;align-items:center;gap:1.5rem;margin:.8rem 0 1rem}
.p-soru-metin{font-family:var(--serif);font-weight:400;font-size:clamp(1.6rem,2.6vw,2.6rem);margin:0;line-height:1.2}
.p-sayac{position:relative;width:clamp(80px,7vw,120px);aspect-ratio:1;flex:none}
.p-sayac svg{width:100%;height:100%;transform:rotate(-90deg)}
.p-sayac circle{fill:none;stroke-width:4}
.p-sayac .iz{stroke:var(--cizgi)}
.p-sayac .dolu{stroke:var(--vurgu);stroke-dasharray:119.4;stroke-dashoffset:0;transition:stroke-dashoffset .2s linear}
.p-sayac b{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--veri);font-size:clamp(1.6rem,2.6vw,2.6rem)}
.p-satir-kunye{font-family:var(--serif);font-size:clamp(1.3rem,2.1vw,2.2rem);line-height:1.55;margin:0 0 1rem;background:var(--panel);border:1px solid var(--cizgi);border-radius:12px;padding:1rem 1.2rem;overflow-wrap:anywhere}
/* Parçalar arasında ek boşluk yok: "Raşit ." gibi noktadan önce boşluk izlenimi vermesin (R5-6). */
.p-parcali .p-parca{border-bottom:3px solid transparent;padding:0}
.p-parcali .p-parca.dogru{background:var(--isaret-zem);border-bottom-color:var(--isaret);border-radius:4px}
.p-ara{font-family:var(--veri);font-weight:700;color:var(--vurgu)}
.p-parcali .p-ara{font-family:inherit;font-weight:inherit;color:inherit}
.p-parcali .dogru .p-ara{font-family:var(--veri);font-weight:700;color:var(--isaret)}
.p-secenekler{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.p-secenekler.kunye{grid-template-columns:1fr}
.p-secenek{display:flex;gap:.8rem;align-items:center;background:var(--panel);border:2px solid var(--cizgi);border-radius:12px;padding:.7rem .9rem;font-size:clamp(1.1rem,1.6vw,1.6rem)}
.p-secenekler.kunye .p-secenek{font-family:var(--serif);font-size:clamp(1.05rem,1.5vw,1.5rem);line-height:1.45}
.p-harf{flex:none;width:2.4rem;height:2.4rem;border-radius:8px;display:grid;place-items:center;color:#fff;font-family:var(--govde);font-weight:800}
.p-sec-metin{flex:1;overflow-wrap:anywhere}
.p-sec-kod{display:block;font-family:var(--govde);font-size:.8rem;color:var(--murekkep-2);margin-top:.2rem}
.p-secenek.dogru{border-color:var(--olur);background:var(--olur-zem)}
.p-secenek.soluk{opacity:.55}
.p-sec-sayi{display:flex;align-items:center;gap:.5rem;min-width:9rem;font-family:var(--veri)}
.p-cubuk-iz{flex:1;height:10px;background:var(--cizgi);border-radius:5px;overflow:hidden;display:block;min-width:4rem}
.p-cubuk-iz span{display:block;height:100%;background:var(--vurgu);border-radius:5px}
.dogru .p-cubuk-iz span{background:var(--olur)}
.p-sirala{display:flex;flex-wrap:wrap;gap:.7rem;margin-bottom:1rem}
.p-sirala .p-parca{font-family:var(--serif);font-size:clamp(1.15rem,1.8vw,1.8rem);background:var(--panel);border:2px solid var(--cizgi-koyu);border-radius:10px;padding:.4rem .8rem}
.p-alt{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-top:1.2rem;font-size:1.2rem}
.p-yazan{margin-left:auto}

/* Sonuç */
.p-sonuc-ust h2{font-family:var(--serif);font-weight:400;font-size:clamp(1.6rem,2.4vw,2.4rem);margin:.6rem 0}
.p-sonuc{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:1.5rem;align-items:start}
.p-dogrusu{background:var(--olur-zem);border-left:5px solid var(--olur);border-radius:8px;padding:.6rem 1rem;margin-top:1rem}
.p-dogrusu .p-satir-kunye{background:none;border:0;padding:0;margin:.2rem 0 0}
.p-kural{background:var(--panel);border:1px solid var(--cizgi);border-left:5px solid var(--altin);border-radius:8px;padding:.6rem 1rem;margin:.8rem 0}
.p-kural p{margin:.3rem 0 0;font-size:clamp(1rem,1.2vw,1.2rem)}
.p-dagilim{margin-top:1rem;display:flex;flex-direction:column;gap:.4rem}
.p-dag-satir{display:grid;grid-template-columns:minmax(8rem,1.5fr) 2fr 3rem;gap:.8rem;align-items:center;font-size:1.15rem}
.p-dag-satir b{font-family:var(--veri);text-align:right}
.p-dag-ad{font-family:var(--serif);overflow-wrap:anywhere}
.p-tablo ol{margin:.3rem 0 0;padding-left:1.6rem;font-size:1.15rem}
.p-tablo li{display:flex;justify-content:space-between;gap:1rem;padding:.15rem 0;border-bottom:1px solid var(--cizgi)}
.p-tablo li b{font-family:var(--veri)}

/* Kürsü */
.p-son h1{font-family:var(--serif);font-weight:400;text-align:center;font-size:clamp(2.2rem,4vw,3.4rem);margin:.4rem 0 1rem}
.p-kursu{display:grid;grid-template-columns:repeat(3,minmax(0,16rem));justify-content:center;align-items:end;gap:1rem;min-height:18rem}
.p-kursu-yer{text-align:center;animation:pYuksel .8s cubic-bezier(.3,.7,.4,1) both}
.p-kursu-yer.y1{animation-delay:.9s}.p-kursu-yer.y2{animation-delay:.45s}
.p-kursu-ad{font-size:clamp(1.2rem,2vw,1.9rem);font-weight:700;overflow-wrap:anywhere}
.p-kursu-p{color:var(--murekkep-2);margin:.2rem 0 .5rem}
.p-kursu-blok{border-radius:10px 10px 0 0;display:grid;place-items:center;color:#fff;font-family:var(--serif);font-size:3rem}
.y1 .p-kursu-blok{height:11rem;background:var(--altin)}
.y2 .p-kursu-blok{height:8rem;background:#7D8DA6}
.y3 .p-kursu-blok{height:6rem;background:#A86A3C}
@keyframes pYuksel{from{transform:translateY(40px);opacity:0}to{transform:none;opacity:1}}
.p-son-alt{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:1.5rem;margin-top:1.5rem;align-items:start}
.p-buyuk-sayi{font-family:var(--serif);font-size:3.4rem;margin:0}
.p-konfeti{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:50}
.p-konfeti i{position:absolute;top:-12px;width:9px;height:14px;border-radius:2px;animation:pDus linear both}
@keyframes pDus{to{transform:translateY(105vh) rotate(540deg)}}

/* Geçmiş ve rapor */
.p-gecmis{list-style:none;padding:0}
.p-gecmis li{padding:.2rem 0;border-bottom:1px solid var(--cizgi)}
.p-tablo-kap{overflow-x:auto}
.p-rapor{border-collapse:collapse;width:100%;font-size:.95rem}
.p-rapor th,.p-rapor td{text-align:left;padding:.4rem .5rem;border-bottom:1px solid var(--cizgi);vertical-align:top}
.p-rapor small{color:var(--murekkep-2)}

@media (max-width:900px){
  .p-lobi,.p-sonuc,.p-son-alt{grid-template-columns:1fr}
  .p-secenekler{grid-template-columns:1fr}
}
.hareket-kapali .p-ad,.hareket-kapali .p-kursu-yer{animation:none}
@media (prefers-reduced-motion:reduce){.p-ad,.p-kursu-yer,.p-konfeti i{animation-duration:.01s}}