/* oa.css — Ortak Avı'na özgü görünüm (ortak: /assets/oyun/oyun.css). Renkler tokens.css'ten. Bölüm sınıfları kendine (T9):
   oa-b1, oa-b2 (tahta), od-b3, od-b4 (deste; od- önekli bileşen iki bölümde ortak, bilinçli). */
[hidden] { display: none !important; }
.hedef-satir { margin: .8rem 0 0; text-align: center; font-family: var(--font-baslik); font-weight: 600; font-size: 1.45rem; color: var(--nesne-gece); }
.kural-satir { margin: .15rem auto 0; max-width: 28rem; text-align: center; font-size: var(--punto-kucuk); font-weight: 700; color: var(--yardimci-mor); }

/* Tanıtım sürerken tahta, karar alanı, hedef ve kural satırı gizli (L9: tanıtım örneği oynanan tahtayla karışmasın) */
.tanitimda .tahta, .tanitimda .eylem, .tanitimda .bitir-satir, .tanitimda .sonuc, .tanitimda .hedef-satir, .tanitimda .kural-satir,
.tanitimda .od-kart, .tanitimda .od-dugmeler { display: none; }
.tanitim-sekil:empty { display: none; }
.tanitim-sekil { margin: 0 auto .6rem; max-width: 24rem; }

/* Bölüm 1–2 tahtası: 4 sütun */
.tahta-dort { grid-template-columns: repeat(4, 1fr); max-width: 22rem; }
.karo-kacan { box-shadow: inset 0 0 0 3px var(--amber); border: 2px dashed var(--amber); }
.karo-iz { font-size: .72rem; }
.bitir-satir { display: flex; justify-content: center; margin: .4rem 0 .2rem; }
.bitir-dugme { font-size: 1.05rem; }
.oyuncu .yigin { min-height: 2.9rem; align-content: flex-start; }   /* iki satır çip: dördüncü çip tahtayı itmesin (G5) */
.oyuncu-sen .oyuncu-yazi, .oyuncu-obur .oyuncu-yazi { min-width: 0; }
.skor-satiri .oyuncu { min-height: 4.4rem; }
.oyuncu .cip { border-radius: 6px; min-width: 1.6rem; text-align: center; }
/* Balon 360 px'te en uzun oyun içi balon kadar yer tutar: tahta dokunuşlar arasında zıplamasın (G5) */
.oa-b1 .balon, .oa-b2 .balon { min-height: 4.9rem; }

/* Bölüm 3–4: deste (sayaç, iki deste, kart, iki eşit düğme) */
.od-bas { display: grid; grid-template-columns: 1fr; gap: .3rem; align-items: center; }
.od-sayac { margin: 0; font-weight: 700; text-align: center; white-space: nowrap; }
.od-yiginlar { display: flex; justify-content: stretch; gap: .5rem; min-width: 0; }
.od-deste { flex: 1 1 0; min-width: 0; display: flex; flex-wrap: wrap; align-content: center; align-items: center; gap: .35rem; padding: .3rem .6rem; border-radius: 14px; min-height: 3rem; }
.od-sen { background: var(--bal-acik); border: 2px solid var(--bal); }
.od-obur { background: var(--yardimci-acik); border: 2px solid var(--yardimci-mor); }
.od-obur .obur { width: 2.4rem; height: 2.4rem; }
.od-deste-ad { font-size: .8rem; font-weight: 700; line-height: 1.1; }
.od-deste-kartlar { display: flex; flex-wrap: wrap; gap: 2px; flex: 1 1 100%; min-height: .8rem; }
.od-mini { width: .55rem; height: .8rem; border-radius: 2px; background: var(--bal); }
.od-obur .od-mini { background: var(--yardimci-mor); }
.od .kural-satir { margin-top: .4rem; }
.od-kart { margin: .5rem auto .7rem; max-width: 26rem; padding: .9rem 1rem; border-radius: 18px; background: var(--zemin);
  box-shadow: 0 5px 0 var(--nesne-tas-acik), inset 0 0 0 2px var(--nesne-tas-acik); text-align: center; min-height: 5.2rem; }
.od-kart-durum { min-height: 11.7rem; }   /* 360 px'te en uzun durum kalıbı: düğmeler kartlar arasında kaymasın (G5) */
.od-durum { margin: 0 0 .5rem; text-align: left; font-size: 1.02rem; font-weight: 600; }
.od-cumle { margin: 0; font-family: var(--font-baslik); font-weight: 600; font-size: 1.9rem; color: var(--nesne-gece); }
.od-dugmeler { display: grid; grid-template-columns: 1fr 1fr; grid-auto-rows: 1fr; gap: .5rem; max-width: 26rem; margin: 0 auto .7rem; }
.od-dugme { min-height: 3.6rem; padding: .3rem .5rem; border-radius: 14px; border: 2px solid var(--nesne-tas-acik); background: var(--kart);
  color: var(--metin); font: inherit; font-weight: 700; line-height: 1.25; cursor: pointer; box-shadow: 0 4px 0 var(--nesne-tas-acik); }
.od-dugme:active { transform: translateY(3px); box-shadow: 0 1px 0 var(--nesne-tas-acik); }
.od-dugme:disabled { opacity: .55; cursor: default; transform: none; }
@keyframes belir { to { opacity: 1; } }

/* === Ortak Avı: iki renk dili (birinci sayı bal, ikinci açık mor, ortak iki renk; kalan amber) === */
.oa-a { --oa-renk: var(--bal); --oa-acik: var(--bal-acik); }
.oa-b { --oa-renk: var(--yardimci-mor); --oa-acik: var(--yardimci-acik); }
.karo-sen.oa-karo-ortak { background: linear-gradient(135deg, var(--bal-acik) 50%, var(--yardimci-acik) 50%); box-shadow: inset 0 0 0 3px var(--yesil); }
.karo-obur.oa-karo-a { background: color-mix(in srgb, var(--bal) 45%, var(--kart)); border: 2px dashed var(--amber); }
.karo-obur.oa-karo-b { background: var(--yardimci-acik); border: 2px dashed var(--amber); }
.karo-obur.oa-karo-hic, .karo-obur.oa-karo-kat { background: var(--amber-acik); border: 2px dashed var(--amber); }

.oa-dogru { margin: .4rem auto 0; max-width: 24rem; }
.oa-dogru-svg { display: block; width: 100%; height: auto; overflow: visible; }
.oa-dogru-cizgi { stroke: var(--nesne-tas); stroke-width: 3; stroke-linecap: round; }
.oa-dogru-ad { font-family: var(--font-baslik); font-weight: 600; font-size: 15px; fill: var(--metin); }
.oa-durak circle { fill: var(--oa-renk); stroke: var(--nesne-tas-koyu); stroke-width: 1; }
.oa-dogru-sayi { font-family: var(--font-baslik); font-weight: 600; font-size: 14px; fill: var(--metin); text-anchor: middle; }
.oa-halka { fill: none !important; stroke: var(--nesne-gece) !important; stroke-width: 3 !important; }
.sonuc-dogru .oa-halka { stroke: var(--yesil) !important; }
.oa-bag { stroke: var(--nesne-gece); stroke-width: 2; stroke-dasharray: 4 3; }
.oa-kalan { fill: var(--amber); }
.oa-isaret { stroke: var(--amber); stroke-width: 3; stroke-linecap: round; }
.oa-dogru-n { font-size: 12px; font-weight: 700; fill: var(--metin); text-anchor: middle; }
.oa-adim { opacity: 0; animation: belir .45s ease forwards; }
@media (prefers-reduced-motion: reduce) { .oa-adim { opacity: 1; animation: none; } }

.oa-bolenler { margin: .4rem auto 0; max-width: 26rem; display: grid; gap: .3rem; }
.oa-liste { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: .25rem; padding: .3rem .5rem; border-radius: 12px; background: var(--oa-acik); }
.oa-liste-ad { font-weight: 700; font-size: var(--punto-kucuk); margin-right: .2rem; }
.oa-cip { min-width: 1.8rem; padding: .05rem .4rem; border-radius: 8px; text-align: center; background: var(--kart); border: 2px solid var(--oa-renk);
  font-family: var(--font-baslik); font-weight: 600; }
.oa-cip-ortak { background: linear-gradient(135deg, var(--bal-acik) 50%, var(--yardimci-acik) 50%); box-shadow: 0 0 0 3px var(--nesne-gece); }
.sonuc-dogru .oa-cip-ortak { box-shadow: 0 0 0 3px var(--yesil); }

.oa-bolmeler { margin: .4rem auto 0; max-width: 20rem; display: grid; gap: .25rem; }
.oa-bolme { margin: 0; padding: .2rem .6rem; border-radius: 10px; background: var(--oa-acik); border: 2px solid var(--oa-renk);
  font-family: var(--font-baslik); font-weight: 600; font-size: 1.15rem; text-align: center; }
.oa-bolme-kalan { padding: 0 .35rem; border-radius: 6px; background: var(--amber); }
.oa-bolme-tamam { color: var(--metin-soluk); font-size: .95rem; }

.oa-soru { margin: .3rem 0 0; font-weight: 800; color: var(--nesne-gece); }