/* Sempati oyun içi stiller (Ajan B) — oyunlar.css'ten SONRA yüklenir. Yalnız .oyun-alan altında. */
.oyun-alan { --safir: #2f4fa2; --oyun-dogru: #2f4fa2; }
.oyun-alan .oyun-gorsel, .oyun-alan .oyun-cizim { display: block; width: 100%; height: auto; max-width: var(--g, 96px); aspect-ratio: 1; object-fit: contain; pointer-events: none; user-select: none; }
.oyun-alan .oyun-ikon { display: inline-block; vertical-align: middle; width: 1.3em; height: 1.3em; }
.oyun-alan .oyun-harf { font-family: "Plus Jakarta Sans", var(--sans, system-ui), sans-serif; font-weight: 700; line-height: 1; color: var(--murekkep, #0e1a3a); display: block; }
.oyun-alan .oyun-etiket { display: block; margin-top: 6px; font-size: .95rem; font-weight: 600; color: var(--murekkep, #0e1a3a); text-align: center; line-height: 1.2; }

/* dokunma hedefleri ≥ 64 px (çocuk) */
.oyun-alan .oyun-hucre, .oyun-alan .oyun-secenek, .oyun-alan .oyun-ped, .oyun-alan .oyun-kutu, .oyun-alan .oyun-hkart, .oyun-alan .oyun-sev, .oyun-alan .oyun-gg-btn { min-width: 64px; min-height: 64px; }
.oyun-alan .oyun-hucre { padding: 8px; }
.oyun-alan .oyun-hucre > span { display: grid; place-items: center; width: 100%; }
.oyun-alan .oyun-hucre .oyun-gorsel, .oyun-alan .oyun-hucre .oyun-cizim { max-width: 88%; }
.oyun-alan .oyun-hucre-etiketli { aspect-ratio: auto; flex-direction: column; }
.oyun-alan .oyun-izgara { width: min(100%, calc(var(--n) * 128px)); }
.oyun-alan .oyun-secenek { flex-direction: column; }
.oyun-alan .oyun-secenek .oyun-gorsel, .oyun-alan .oyun-secenek .oyun-cizim { width: 80px; }

/* sakin geri bildirim: doğruda safir halka, yanlışta hafif sallanma (kırmızı yok) */
.oyun-alan .oyun-dogru { box-shadow: 0 0 0 4px var(--safir) !important; }
.oyun-alan .oyun-goster-dogru { box-shadow: 0 0 0 4px var(--safir), 0 0 0 9px rgba(47, 79, 162, .18) !important; }
.oyun-alan .oyun-tepki.dogru { color: var(--safir); }
.oyun-alan .oyun-tepki.yanlis { color: var(--soluk, #5b6478); }
.oyun-alan .oyun-tepki { font-size: clamp(1.2rem, 3vw, 1.8rem); }

/* hafıza: Sempati kemer arka yüzü */
.oyun-alan .oyun-hkart-arka { background: #0e1a3a; overflow: hidden; }
.oyun-alan .oyun-hkart-arka .oyun-cizim { max-width: 60%; }
.oyun-alan .oyun-hkart-on { padding: 10%; }
.oyun-alan .oyun-hkart-on .oyun-gorsel { max-width: 100%; }
.oyun-alan .oyun-yer-degisti .oyun-hkart-arka { box-shadow: inset 0 0 0 4px #d99a2b; }
@media (max-width: 640px) {
  .oyun-alan .oyun-hafiza-izgara[data-satir="4"] .oyun-hkart, .oyun-alan .oyun-hafiza-izgara[data-satir="5"] .oyun-hkart { height: auto; aspect-ratio: 3 / 4; }
}

/* kim yok */
.oyun-alan .oyun-kutucuk { display: grid; place-items: center; width: clamp(72px, 18vw, 104px); aspect-ratio: 1; padding: 10px; background: var(--zemin, #fff); border: 1px solid var(--cizgi, #dde3ec); border-radius: 20px; }
.oyun-alan .oyun-perde .oyun-cizim { max-width: 150px; }

/* ışık sırası: renk + şekil */
.oyun-alan .oyun-ped .oyun-sekil { width: 60%; height: auto; }

/* gündüz – gece */
.oyun-gg { width: 100%; display: flex; flex-direction: column; align-items: center; gap: 18px; }
.oyun-gg-kural { font-size: 1rem; color: var(--murekkep, #0e1a3a); padding: 8px 16px; border-radius: 999px; background: var(--zemin-2, #eef2f8); text-align: center; }
.oyun-gg-kural.degisti { box-shadow: 0 0 0 3px #d99a2b; }
.oyun-gg-sahne { width: 100%; height: 200px; display: grid; place-items: center; border-radius: 22px; border: 1px solid var(--cizgi, #dde3ec); background: linear-gradient(#eef2fb, #f8fafe); }
.oyun-gg-nesne { opacity: 0; transition: opacity .25s; }
.oyun-gg-nesne.goster { opacity: 1; }
.oyun-gg-nesne .oyun-cizim { max-width: 150px; }
.oyun-gg-btnler { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; width: min(100%, 460px); }
.oyun-gg-btn { display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 88px; border-radius: 22px; border: 2px solid var(--murekkep, #0e1a3a); background: #fff; color: var(--murekkep, #0e1a3a); font-size: 1.4rem; font-weight: 700; cursor: pointer; }
.oyun-gg-btn.gece { background: #0e1a3a; color: #fff; }
.oyun-gg-btn .oyun-ikon { width: 40px; height: 40px; }
.oyun-gg-btn:disabled { opacity: .5; cursor: default; }

/* uçtu uçtu (görsel) */
.oyun-alan .oyun-uctu-resim { display: block; width: 130px; }
.oyun-alan .oyun-uctu-nesne.ucar .oyun-uctu-resim { animation: oyun-sallan 1.4s ease-in-out infinite; }
.oyun-alan .oyun-uctu-nesne.hata .oyun-uctu-resim { animation: oyun-salla .4s ease; }
.oyun-alan .oyun-ipucu { margin: 0; font-size: .85rem; color: var(--soluk, #5b6478); }

/* kural: çerçeveli kart (DCCS sınır versiyonu) */
.oyun-alan .oyun-kural-kart.cerceveli { outline: 6px solid #0e1a3a; outline-offset: 6px; border-radius: 18px; }
.oyun-alan .oyun-cue { display: inline-flex; align-items: center; gap: 8px; }
.oyun-alan .oyun-cue.degisti { box-shadow: 0 0 0 3px #d99a2b; }
.oyun-alan .oyun-cue.cerceve-ac { outline: 3px solid #0e1a3a; outline-offset: 2px; }

/* önce – sonra */
.oyun-alan .oyun-rutin-ad { margin: 0 0 10px; font-weight: 700; color: var(--murekkep, #0e1a3a); min-height: 1.2em; }
.oyun-alan .oyun-serit-oge .oyun-gorsel, .oyun-alan .oyun-serit-oge .oyun-cizim, .oyun-alan .oyun-serit-oge .oyun-sekil { width: 80%; height: auto; }
.oyun-alan .oyun-serit-oge.adimli { width: clamp(76px, 20vw, 120px); height: auto; min-height: 112px; flex-direction: column; padding: 8px 4px; position: relative; display: flex; align-items: center; justify-content: center; font-size: 1rem; }
.oyun-alan .oyun-serit-oge.adimli .oyun-cizim { width: 60px; }
.oyun-alan .oyun-serit-oge.adimli .oyun-etiket { font-size: .8rem; }
.oyun-alan .oyun-serit-oge.adimli.bos { font-size: 2rem; }
.oyun-alan .oyun-adim-no { position: absolute; top: 4px; left: 8px; font-style: normal; font-size: .75rem; font-weight: 700; color: var(--soluk, #5b6478); }
.oyun-alan .oyun-dinle-sat { text-align: center; margin: 0 0 10px; }
.oyun-alan .oyun-dinle .oyun-ikon { width: 22px; height: 22px; }

/* yıldız (SVG) */
.oyun-alan .oyun-yildiz { display: inline-block; color: inherit; }
.oyun-alan .oyun-yildiz-svg { display: block; }

/* başlangıç: kapak görseli, seviye açıklaması, veliye not */
.oyun-alan .oyun-baslangic-sanat img { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: inherit; }
.oyun-alan .oyun-sev-aciklama { margin: 6px 0 0; font-size: .92rem; color: var(--soluk, #5b6478); }
.oyun-alan .oyun-veli-not { margin: 16px 0; padding: 14px 18px; border-radius: 14px; background: var(--zemin, #f6f8fc); border-left: 4px solid var(--safir); text-align: left; }
.oyun-alan .oyun-veli-not p { margin: 4px 0 0; font-size: .93rem; }
.oyun-alan .oyun-anahtar i svg { display: block; }
.oyun-alan .oyun-cikartma .oyun-gorsel, .oyun-alan .oyun-cikartma .oyun-cizim, .oyun-alan .oyun-cikartma .oyun-sekil { width: 32px; height: 32px; }
.oyun-alan .oyun-yeni-cikartma .oyun-gorsel, .oyun-alan .oyun-yeni-cikartma .oyun-cizim { width: 56px; }

/* poster durum (lobi) */
.oyun-alan .poster-durum { margin: 8px 0 0; }
.oyun-alan .poster.yakinda .poster-kapak { opacity: .55; filter: grayscale(.4); }
.oyun-alan .poster.yakinda a[data-oyun] { cursor: default; }
.oyun-alan .poster-yakinda { display: inline-block; padding: 2px 10px; border-radius: 99px; font-size: .8rem; font-weight: 700; background: var(--zemin-2, #eef2f8); color: var(--soluk, #5b6478); }

@media (prefers-reduced-motion: reduce) {
  .oyun-alan .oyun-uctu-nesne.ucar .oyun-uctu-resim, .oyun-alan .oyun-uctu-nesne.hata .oyun-uctu-resim { animation: none !important; }
  .oyun-gg-nesne { transition: none; }
}

/* ===== Ajan C: dil ve duygu oyunları (oyunlar-dil.js) ===== */
.oyun-alan .dil-ses-yazi { margin: 0 0 8px; text-align: center; font-family: Fraunces, Georgia, serif; font-size: 2rem; font-weight: 700; color: var(--murekkep, #0e1a3a); }
.oyun-alan .dil-resim { display: flex; flex-direction: column; align-items: center; gap: 4px; margin-bottom: 10px; }
.oyun-alan .dil-resim:empty { display: none; }
.oyun-alan .dil-kelime { margin: 0; font-family: Fraunces, Georgia, serif; font-size: 2.2rem; letter-spacing: .06em; color: var(--murekkep, #0e1a3a); }
.oyun-alan .dil-bosluk { display: inline-block; min-width: 1ch; border-bottom: 3px solid currentColor; text-align: center; }
.oyun-alan .dil-harf { font-family: Fraunces, Georgia, serif; font-size: clamp(2.2rem, 7vw, 3.4rem); font-weight: 700; line-height: 1; color: var(--murekkep, #0e1a3a); }
.oyun-alan .dil-sayi { display: flex; flex-direction: column; align-items: center; gap: 6px; font-size: 2rem; }
.oyun-alan .dil-nokta { display: flex; gap: 6px; }
.oyun-alan .dil-nokta i { width: 12px; height: 12px; border-radius: 50%; background: var(--murekkep, #0e1a3a); }
.oyun-alan .dil-hece, .oyun-alan .dil-hikaye { min-height: 1.3em; margin: 8px 0; text-align: center; font-size: 1.2rem; font-weight: 600; color: var(--murekkep, #0e1a3a); }
.oyun-alan .dil-yuz { max-width: 88%; height: auto; }
.oyun-alan .dil-ritim { display: flex; flex-direction: column; align-items: center; gap: 14px; }
.oyun-alan .dil-isiklar { display: flex; align-items: center; list-style: none; margin: 0; padding: 0; min-height: 40px; }
.oyun-alan .dil-isiklar li { margin-right: 10px; }
.oyun-alan .dil-isiklar i { display: block; width: 30px; height: 30px; border-radius: 50%; border: 3px solid var(--murekkep, #0e1a3a); background: #fff; transition: transform .15s ease, background-color .15s ease; }
.oyun-alan .dil-isiklar .yanik i { background: #f1dc9a; transform: scale(1.15); }
.oyun-alan .dil-isiklar .senin i { background: #9fceb5; border-width: 6px; }
.oyun-alan .dil-davul { width: clamp(150px, 40vw, 200px); height: clamp(150px, 40vw, 200px); border-radius: 50%; border: 4px solid var(--murekkep, #0e1a3a); background: #f6e6d8; color: var(--murekkep, #0e1a3a); font-size: 1.4rem; font-weight: 700; cursor: pointer; touch-action: manipulation; }
.oyun-alan .dil-davul:disabled { opacity: .55; cursor: default; }
.oyun-alan .dil-davul:focus-visible { outline: 4px solid #3b5bdb; outline-offset: 4px; }
.oyun-alan .dil-davul.vur { animation: dil-vur .18s ease-out; }
@keyframes dil-vur { 50% { transform: scale(.94); } }
.oyun-alan .dil-durum { margin: 0; min-height: 1.3em; font-size: 1.15rem; font-weight: 600; text-align: center; }
.oyun-alan .dil-ritim.sade .dil-isiklar i { transition: none; transform: none !important; }
.oyun-alan .dil-ritim.sade .dil-davul.vur { animation: none; }
@media (prefers-reduced-motion: reduce) {
  .oyun-alan .dil-isiklar i { transition: none; transform: none !important; }
  .oyun-alan .dil-davul.vur { animation: none; }
}

/* Duygu Yüzleri: görsel türü anahtarı + fotoğraf kırpımı */
.oyun-alan .dil-mod { display: flex; gap: 6px; justify-content: center; margin: 0 0 8px; }
.oyun-alan .dil-mod button { font: inherit; font-size: .85rem; padding: 4px 12px; border-radius: 999px; border: 1.5px solid currentColor; background: transparent; color: inherit; cursor: pointer; min-height: 32px; }
.oyun-alan .dil-mod button.on { background: #0f1b3d; color: #fff; border-color: #0f1b3d; }
.oyun-alan .dil-foto { aspect-ratio: 1 / 1; object-fit: cover; object-position: 50% 25%; border-radius: 14px; }
.oyun-alan .dil-yz-not { text-align: center; font-size: .72rem; opacity: .7; margin: 6px 0 0; }
