/* ==========================================================================
   oyun.css — #sira-sende: günün sorusu, hızlı tur, sonuç (P4a)
   Ortak cevap düğmesi davranışı (.secenek dolgu/sarsıntı) da burada; ritmi-tani de kullanır.
   Kurallar: yeşil (--monitor) YALNIZ doğru cevapta; yanlış her zaman ✕ + metinle.
   Yalnız transform/opacity animasyonu (istisna: spec §2.6'daki clip-path dolgusu ve SVG çizimi).
   ========================================================================== */

/* ── Bölüm yerleşimi ─────────────────────────────────────────────────────── */
.bolum--sira { position: relative; }
.bolum--sira .giris-metni { max-width: 44ch; color: var(--yazi-2); margin-top: var(--b-4); }

.sira__izgara {
  display: grid;
  gap: var(--b-4);
  margin-top: clamp(32px, 6vw, 56px);
  align-items: start;
}
@media (min-width: 1024px) {
  .sira__izgara { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--b-5); }
}

.gunluk, .tur { scroll-margin-top: calc(var(--ust-yukseklik) + 12px); }

/* ── Ortak: cevap düğmesi (.secenek) ─────────────────────────────────────
   Temel görünüm, doğru dolgusu (::before, --dokun-x/--dokun-y) ve sarsıntı temel.css'te (P1b).
   Burada yalnız oyuna özgü düzen ve durumlar. */
.secenekler { display: grid; gap: 10px; }
.secenekler--kilitli .secenek { cursor: default; }
.secenekler--kilitli .secenek:not(.secenek--secili):active { transform: none; }
.secenek.secenek--secili { transform: scale(.985); }
.secenek.secenek--dogru, .secenek.secenek--yanlis, .secenek.secenek--soluk { transform: none; }
.secenek:disabled { color: var(--yazi); }

/* Yeniden açılışta sonuç animasyonsuz gösterilir */
.secenekler--anlik .secenek,
.secenekler--anlik .secenek::before,
.secenekler--anlik .secenek__ikon,
.secenekler--anlik .secenek__harf { transition: none !important; animation: none !important; }

/* ── Ortak: akordeon (grid 0fr → 1fr, 320ms) ────────────────────────────── */
.oyun-akordeon {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows var(--s-orta) var(--e-cikis);
}
.oyun-akordeon > .oyun-akordeon__ic {
  min-height: 0;
  overflow: hidden;
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s linear var(--s-orta), opacity var(--s-kisa) var(--e-standart);
}
.oyun-akordeon--acik { grid-template-rows: 1fr; }
.oyun-akordeon--acik > .oyun-akordeon__ic {
  visibility: visible;
  opacity: 1;
  transition: visibility 0s, opacity var(--s-orta) var(--e-cikis) 60ms;
}
.oyun-akordeon--anlik, .oyun-akordeon--anlik > .oyun-akordeon__ic { transition: none !important; }

/* ── Günün sorusu kartı ──────────────────────────────────────────────────── */
.gunluk__etiket {
  display: flex; align-items: flex-start; gap: 10px;
  color: var(--yazi-3);
  margin: 0;
}
.gunluk__etiket::before {
  content: ""; flex: none;
  width: 6px; height: 6px; border-radius: 50%;
  margin-top: .5em;
  background: var(--kirmizi);
}
.gunluk__alt { margin: 10px 0 0; color: var(--yazi-2); font-size: var(--t-kucuk); line-height: 1.5; }
.gunluk__doz-notu {
  margin: 12px 0 0;
  padding: 10px 12px;
  border-radius: var(--r-1);
  border: 1px solid var(--cizgi);
  background: rgba(255, 255, 255, .02);
  color: var(--yazi-2);
  font-size: var(--t-kucuk);
  line-height: 1.5;
}
.gunluk__metin { margin: 22px 0 18px; text-wrap: pretty; }
.gunluk__hata { margin: 20px 0 0; color: var(--yazi-2); }

.gunluk__serit { margin: -4px 0 18px; }
.gunluk__tuval {
  display: block;
  width: 100%; max-width: 360px; height: auto; aspect-ratio: 3 / 1;
  border-radius: var(--r-1);
  background: var(--monitor-zemin);
  border: 1px solid var(--monitor-cerceve);
}
.gunluk__dipnot { margin-top: 8px; color: var(--yazi-3); }

.gunluk__aciklama { margin-top: 0; }
.gunluk__aciklama.oyun-akordeon--acik { margin-top: 18px; }
.gunluk__sonuc {
  display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px;
  margin: 0;
  font-weight: 700;
}
.gunluk__sonuc-ikon { width: 18px; height: 18px; flex: none; }
.gunluk__sonuc--dogru { color: var(--monitor); }
.gunluk__sonuc--yanlis { color: var(--yanlis); }
.gunluk__dogru-cevap { color: var(--yazi); font-weight: 500; }
.gunluk__aciklama-metni { margin: 10px 0 0; color: var(--yazi-2); line-height: 1.6; max-width: var(--olcu); }
.gunluk__kaynak, .tur-inceleme__kaynak {
  margin: 12px 0 0;
  color: var(--yazi-3);
  text-transform: none;
  letter-spacing: .02em;
  line-height: 1.5;
}

/* Bugünün teaser'ı */
.gunluk__bugun {
  margin-top: 28px;
  padding-top: 24px;
  border-top: 1px dashed var(--cizgi);
}
.gunluk__etiket--bugun { color: var(--yazi-2); }
.gunluk__etiket--bugun::before { animation: oyunNabiz 1.2s var(--e-standart) infinite alternate; }
@keyframes oyunNabiz { from { opacity: 1; } to { opacity: .35; } }

.gunluk__bugun-not { margin: 10px 0 0; color: var(--yazi-2); font-size: var(--t-kucuk); line-height: 1.5; }
.gunluk__bugun-soru {
  margin: 14px 0 0;
  font-weight: 700;
  font-size: 1.125rem;
  line-height: 1.4;
  color: var(--yazi);
  text-wrap: pretty;
}
.gunluk__bugun-metin { margin: 12px 0 0; font-weight: 700; font-size: 1.125rem; line-height: 1.4; }
.gunluk__bugun .gunluk__serit { margin: 14px 0 0; }

.gunluk__kilit { position: relative; margin-top: 16px; }
.gunluk__hayaletler { display: grid; gap: 8px; }
.gunluk__hayalet {
  position: relative;
  display: flex; align-items: center; gap: 12px;
  height: 46px;
  padding: 0 14px;
  border-radius: var(--r-2);
  border: 1px dashed rgba(255, 255, 255, .10);
  background: rgba(255, 255, 255, .015);
  color: var(--yazi-3);
}
.gunluk__hayalet::after {
  content: "";
  height: 8px; width: var(--g, 70%);
  border-radius: var(--r-hap);
  background: linear-gradient(90deg, rgba(255, 255, 255, .07), rgba(255, 255, 255, .025));
}
.gunluk__kilit-rozet {
  position: absolute; left: 50%; top: 50%;
  transform: translate(-50%, -50%);
  display: inline-flex; align-items: center; gap: 8px;
  margin: 0;
  padding: 9px 16px;
  border-radius: var(--r-hap);
  background: var(--yuzey-3);
  border: 1px solid var(--cizgi);
  box-shadow: var(--kenar-isik), 0 12px 30px -12px rgba(0, 0, 0, .8);
  font-weight: 700; font-size: .9375rem;
  white-space: nowrap;
}
.gunluk__kilit-rozet .ikon { width: 16px; height: 16px; color: var(--yazi-2); }
.gunluk__bugun .magaza-grup { margin-top: 18px; }

/* ── Hızlı tur kartı ─────────────────────────────────────────────────────── */
.tur {
  background:
    radial-gradient(90% 70% at 100% 0%, rgba(215, 25, 32, .11), transparent 60%),
    radial-gradient(60% 50% at 0% 100%, rgba(58, 15, 22, .45), transparent 70%),
    var(--yuzey);
}
.tur > .mono:first-child { color: var(--yazi-3); margin: 0; }

.tur__iz { display: block; width: 100%; height: auto; overflow: visible; }
.tur__iz .atim {
  fill: none;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}
.tur__iz--giris { margin: 18px 0 22px; max-width: 520px; }
.tur__iz--giris .atim { stroke: var(--kirmizi); opacity: .28; animation: oyunAtim 3s linear infinite; }
.tur__iz--giris .atim:nth-child(2) { animation-delay: .6s; }
.tur__iz--giris .atim:nth-child(3) { animation-delay: 1.2s; }
.tur__iz--giris .atim:nth-child(4) { animation-delay: 1.8s; }
.tur__iz--giris .atim:nth-child(5) { animation-delay: 2.4s; }
@keyframes oyunAtim {
  0%, 100% { opacity: .28; }
  6% { opacity: 1; }
  30% { opacity: .28; }
}

.tur .baslik-3 { margin: 0; }
.tur__meta { margin: 12px 0 0; color: var(--yazi-3); }
.tur > p:not([class]) { margin: 14px 0 0; color: var(--yazi-2); max-width: 52ch; line-height: 1.55; }

.tur__meydan {
  margin-top: 20px;
  padding: 14px 16px;
  border-radius: var(--r-2);
  background: var(--yuzey-2);
  border: 1px solid var(--cizgi);
  position: relative;
}
/* Vurgu solda kalın çizgi DEĞİL, kartlardaki gibi üstte ince yansıma (spec §2.5). */
.tur__meydan::before, .tur-sonuc__rakip::before {
  content: ""; position: absolute; top: -1px; left: var(--r-2); right: var(--r-2); height: 1px;
  background: linear-gradient(90deg, transparent, var(--yansima, rgba(255,23,68,.6)), transparent);
  pointer-events: none;
}
.tur__meydan--eski { --yansima: rgba(125,133,149,.7); }
.tur__meydan-etiket {
  display: flex; align-items: center; gap: 8px;
  margin: 0; color: var(--kirmizi);
}
.tur__meydan--eski .tur__meydan-etiket { color: var(--yazi-3); }
.tur__meydan-etiket .ikon { width: 14px; height: 14px; }
.tur__meydan-metin { margin: 8px 0 0; color: var(--yazi-2); line-height: 1.5; }
.tur__meydan-skor { color: var(--yazi); font-weight: 700; font-variant-numeric: tabular-nums; }

[data-tur-basla] { margin-top: 22px; }
.tur__not { margin: 12px 0 0; color: var(--yazi-3); font-size: var(--t-kucuk); }
@media (max-width: 767px) {
  [data-tur-basla] { width: min(100%, 360px); min-height: 56px; }
}

/* Durumlar: tur ve sonuçta giriş içeriği saklanır, sahne tek başına kalır */
.tur[data-durum="soru"] > :not(.tur__sahne),
.tur[data-durum="sonuc"] > :not(.tur__sahne) { display: none !important; }
.tur[data-durum="soru"], .tur[data-durum="sonuc"] { min-height: min(640px, 82svh); }

/* ── Soru ekranı ─────────────────────────────────────────────────────────── */
.tur__ust {
  display: grid;
  grid-template-columns: 1fr auto auto;
  align-items: center;
  gap: 12px;
}
.tur__sayac { margin: 0; color: var(--yazi-3); }
.tur__sayac b { color: var(--yazi); font-weight: 700; }
.tur__saat {
  margin: 0;
  font-weight: 700;
  font-size: 1.25rem;
  letter-spacing: .04em;
  font-variant-numeric: tabular-nums;
  color: var(--yazi);
  text-transform: none;
}
.tur__cik {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  min-width: 44px; min-height: 44px;
  padding: 0 12px;
  border-radius: var(--r-hap);
  border: 1px solid var(--cizgi);
  background: transparent;
  color: var(--yazi-2);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: border-color var(--s-kisa), color var(--s-kisa), transform var(--s-bas) var(--e-standart);
}
.tur__cik .ikon { width: 12px; height: 12px; }
.tur__cik:active { transform: scale(.95); }
.tur__cik:focus-visible { outline: 3px solid var(--odak); outline-offset: 3px; }
@media (hover: hover) { .tur__cik:hover { border-color: rgba(255, 255, 255, .24); color: var(--yazi); } }
@media (max-width: 380px) { .tur__cik-yazi { display: none; } }

.tur__ilerleme { position: relative; margin: 16px 0 26px; }
.tur__iz--ilerleme .atim {
  stroke: var(--yazi-3);
  opacity: .4;
  transition: opacity var(--s-kisa), stroke var(--s-kisa);
}
.tur__iz--ilerleme .atim--gecti { opacity: .75; stroke: var(--yazi-2); }
.tur__iz--ilerleme .atim--simdi {
  stroke: var(--kirmizi); opacity: 1; stroke-width: 2;
  animation: oyunYan 420ms var(--e-cikis);
}
@keyframes oyunYan { from { opacity: .35; } to { opacity: 1; } }
.tur__iz--ilerleme .atim--dogru { stroke: var(--monitor); opacity: .9; }
.tur__iz--ilerleme .atim--yanlis { stroke: var(--yanlis); opacity: .9; }

.tur__isaretler {
  list-style: none; margin: 4px 0 0; padding: 0;
  display: grid; grid-template-columns: repeat(5, 1fr);
  height: 14px;
}
.tur__isaret { display: grid; justify-items: start; padding-left: calc(48% - 6px); }
.tur__isaret .ikon { width: 12px; height: 12px; animation: oyunBelir 240ms var(--e-cikis); }
.tur__isaret--dogru { color: var(--monitor); }
.tur__isaret--yanlis { color: var(--yanlis); }
@keyframes oyunBelir { from { opacity: 0; transform: scale(.4); } to { opacity: 1; transform: none; } }

.tur__soru { outline: none; }
.tur__kategori { display: inline-flex; margin: 0 0 16px; }
.tur__soru .tur__metin { margin: 0 0 22px; min-height: 2.4em; text-wrap: pretty; }

.tur__geri {
  display: flex; align-items: center; gap: 8px;
  min-height: 20px;
  margin: 16px 0 0;
  opacity: 0;
}
.tur__geri .ikon { width: 14px; height: 14px; }
.tur__geri--dogru, .tur__geri--yanlis { opacity: 1; transition: opacity var(--s-kisa) var(--e-standart); }
.tur__geri--dogru { color: var(--monitor); }
.tur__geri--yanlis { color: var(--yanlis); }

/* 900ms'lik "sonraki soru" çizgisi — bekleme görünür olsun */
.tur__sonraki {
  height: 2px; margin-top: 12px;
  border-radius: 2px;
  background: var(--cizgi-yumusak);
  overflow: hidden;
  opacity: 0;
}
.tur__sonraki span {
  display: block; height: 100%;
  background: var(--yazi-3);
  transform: scaleX(0);
  transform-origin: 0 50%;
}
.tur__soru--cevaplandi .tur__sonraki { opacity: 1; }
.tur__soru--cevaplandi .tur__sonraki span { animation: oyunSonraki 900ms linear forwards; }
@keyframes oyunSonraki { to { transform: scaleX(1); } }

/* ── Sonuç ekranı ────────────────────────────────────────────────────────── */
.tur-sonuc { outline: none; }
.tur-sonuc__ust { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; }
.tur-sonuc__etiket { margin: 0; color: var(--yazi-3); }
.tur-sonuc__rekor {
  margin: 0;
  padding: 5px 10px;
  border-radius: var(--r-hap);
  border: 1px solid rgba(255, 23, 68, .45);
  color: var(--kirmizi);
  font-weight: 700;
}
.tur-sonuc__skor {
  display: flex; align-items: baseline;
  margin: clamp(10px, 3vw, 24px) 0 0;
  color: var(--yazi);
  font-family: var(--font-baslik);
  font-weight: 900;
  font-stretch: 75%;
  font-size: var(--t-dev-sayi);
  line-height: .8;
  letter-spacing: -.03em;
  font-variant-numeric: tabular-nums;
}
@media (min-width: 1024px) { .tur-sonuc__skor { font-size: clamp(6rem, 17vw, 15rem); } }
.tur-sonuc__dogru { display: inline-block; }
.tur-sonuc__toplam { display: inline-block; color: rgba(243, 245, 249, .26); }

/* vector-effect KULLANMA: pathLength'e bağlı çizim animasyonunu ölçeklenmiş SVG'de bozuyor */
.tur-sonuc__iz { display: block; width: 100%; max-width: 560px; height: auto; margin-top: 10px; overflow: visible; }
.tur-sonuc__iz path {
  fill: none;
  stroke: var(--kirmizi);
  stroke-width: 1.8;
  stroke-linecap: round; stroke-linejoin: round;
}
/* İz soldan sağa açılır (clip-path; dasharray+pathLength ölçeklenmiş SVG'de yarım kalıyordu) */
.tur-sonuc--canli .tur-sonuc__iz {
  clip-path: inset(0 100% 0 0);
  animation: oyunIzAc 1100ms var(--e-cikis) 250ms forwards;
}
@keyframes oyunIzAc { to { clip-path: inset(0 0 0 0); } }

.tur-sonuc__sure { margin: 14px 0 0; color: var(--yazi-2); }
.tur-sonuc__eniyi { margin: 6px 0 0; color: var(--yazi-3); }

.tur-sonuc__rakip {
  margin-top: 22px;
  padding: 16px 18px;
  border-radius: var(--r-2);
  background: var(--yuzey-2);
  border: 1px solid var(--cizgi);
  position: relative;
}
.tur-sonuc__rakip[data-sonuc="rakip"] { --yansima: rgba(125,133,149,.7); }
.tur-sonuc__rakip[data-sonuc="berabere"] { --yansima: rgba(169,177,191,.7); }
.tur-sonuc__rakip-etiket { display: flex; align-items: center; gap: 8px; margin: 0; color: var(--yazi-3); }
.tur-sonuc__rakip-etiket .ikon { width: 14px; height: 14px; }
.tur-sonuc__rakip-skor { margin: 8px 0 0; color: var(--yazi-2); font-variant-numeric: tabular-nums; }
.tur-sonuc__hukum {
  margin: 6px 0 0;
  font-family: var(--font-serif);
  font-style: italic;
  font-size: clamp(1.75rem, 6vw, 2.5rem);
  line-height: 1.05;
  letter-spacing: -.01em;
  color: var(--yazi);
}

.tur-sonuc__dugmeler { display: grid; gap: 10px; margin-top: 26px; }
.tur-sonuc__dugmeler .dugme { width: 100%; }
.tur-sonuc__dugmeler .dugme .ikon { width: 18px; height: 18px; }
.tur-sonuc__metin-dugmeler { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 20px; }
.tur-sonuc__metin-dugmeler .dugme { width: auto; }
@media (min-width: 600px) {
  .tur-sonuc__dugmeler { grid-template-columns: 1fr 1fr; }
  .tur-sonuc__baglanti, .tur-sonuc__metin-dugmeler { grid-column: 1 / -1; }
  .tur-sonuc__metin-dugmeler { justify-content: flex-start; }
}

.tur__baglanti { display: grid; gap: 6px; }
.tur__baglanti .mono { color: var(--yazi-3); }
.tur__baglanti input {
  width: 100%;
  min-height: 44px;
  padding: 0 12px;
  border-radius: var(--r-1);
  border: 1px solid var(--cizgi);
  background: var(--zemin-2);
  color: var(--yazi);
  font: 500 .875rem/1 var(--font-mono);
}

/* Cevapları incele */
.tur-sonuc__inceleme.oyun-akordeon--acik { margin-top: 14px; }
.tur-inceleme { list-style: none; margin: 0; padding: 0; }
.tur-inceleme__oge { padding: 18px 0; border-top: 1px solid var(--cizgi-yumusak); }
.tur-inceleme__bas {
  display: flex; justify-content: space-between; align-items: center; gap: 12px;
  margin: 0; color: var(--yazi-3);
}
.tur-inceleme__durum { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; }
.tur-inceleme__durum .ikon { width: 12px; height: 12px; }
.tur-inceleme__oge--dogru .tur-inceleme__durum { color: var(--monitor); }
.tur-inceleme__oge--yanlis .tur-inceleme__durum { color: var(--yanlis); }
.tur-inceleme__soru { margin: 10px 0 0; font-weight: 700; line-height: 1.45; }
.tur-inceleme__cevap { margin: 8px 0 0; color: var(--yazi); line-height: 1.45; }
.tur-inceleme__anahtar { color: var(--yazi-3); }
.tur-inceleme__oge--yanlis .tur-inceleme__cevap:not(.tur-inceleme__cevap--dogru) span:last-child { color: var(--yanlis); }
.tur-inceleme__cevap--dogru span:last-child { color: var(--monitor); }
.tur-inceleme__aciklama { margin: 10px 0 0; color: var(--yazi-2); line-height: 1.6; }

/* CTA */
.tur-sonuc__cta {
  margin-top: 28px;
  padding-top: 24px;
  border-top: 1px solid var(--cizgi-yumusak);
}
.tur-sonuc__cta-metin { margin: 0; font-weight: 700; font-size: 1.0625rem; line-height: 1.45; max-width: 44ch; }
.tur-sonuc__sezon {
  display: flex; align-items: flex-start; gap: 8px;
  margin: 10px 0 0;
  color: var(--altin);
  font-size: var(--t-kucuk);
}
.tur-sonuc__sezon-nokta { flex: none; margin-top: .6em; width: 6px; height: 6px; border-radius: 50%; background: var(--altin); }
.tur-sonuc__cta .magaza-grup { margin-top: 18px; }

/* ── Azalt modu: aynı akış, animasyonsuz ─────────────────────────────────── */
html.hareket-azalt .secenek__ikon,
html.hareket-azalt .tur__iz .atim,
html.hareket-azalt .tur__isaret .ikon,
html.hareket-azalt .gunluk__etiket--bugun::before,
html.hareket-azalt .tur-sonuc__iz,
html.hareket-azalt .oyun-akordeon,
html.hareket-azalt .oyun-akordeon > .oyun-akordeon__ic {
  animation: none !important;
  transition: none !important;
}
html.hareket-azalt .tur__sonraki { display: none; }
html.hareket-azalt .tur-sonuc__iz { clip-path: none; }
@media (prefers-reduced-motion: reduce) {
  .secenek__ikon,
  .tur__iz .atim, .tur__isaret .ikon, .gunluk__etiket--bugun::before,
  .tur-sonuc__iz, .oyun-akordeon, .oyun-akordeon > .oyun-akordeon__ic {
    animation: none !important;
    transition: none !important;
  }
  .tur__sonraki { display: none; }
  .tur-sonuc__iz { clip-path: none; }
}
html.hareket-azalt .tur__iz--giris .atim { opacity: .6; }
@media (prefers-reduced-motion: reduce) { .tur__iz--giris .atim { opacity: .6; } }
.tur-sonuc__paylas--hazirlaniyor { opacity: .7; cursor: progress; }
