/* =====================================================================
   SEVİYE TESTİ — sürüm 2 (seviye.js)
   7 Eki 2026: test DERS EKRANININ parçalarını kullanır (kullanıcı: "font
   ve renkler brand kit yapısından farklı"). Üst şerit `.od-kunye`, görev
   satırı `.ex-tr-satir`, cevap alanı/havuz `.zone` + `.chip`, eylem
   `.ex-actions` — stilleri ders katmanından gelir. Bu dosya YALNIZ
   testte olup derste olmayanı çizer: şıklar, kelime istemi, bölüm adı.
   Uygulama, tanıtım (.sv-tanitim) ve zorunlu yeniden test aynı işaretleme.
   ===================================================================== */

/* Yan sütun yok: ders ızgarası (1fr + 300px) testte sağda BOŞ sütun
   bırakıyordu — "sağda boşluk bırakma" kuralı. */
.sv-govde.ex-card { display: block; }
.sv-govde .ex-main { display: flex; flex-direction: column; gap: var(--sp-4); }

/* üst şeritteki bölüm adı ("1 / 3 · Kelimeler") */
.sv-kunye .sv-bolum {
  margin-left: auto; white-space: nowrap;
  font-size: var(--fs-sm); font-weight: 600; color: var(--muted);
}

/* istem: kelime iri, cümle derste olduğu gibi */
.sv-kelime { display: block; font-size: var(--fs-2xl); font-weight: 600; letter-spacing: -.01em; line-height: 1.15; }
.sv-bosluk { color: var(--accent); font-weight: 600; letter-spacing: .05em; }

/* ŞIKLAR — taşın dili: kart zemini, --chip-line kenar, 600 ağırlık,
   alt gölge çizgisi. Seçilebilir satır; harf rozeti bakır. */
.sv-secenekler { display: flex; flex-direction: column; gap: var(--sp-3); }
.sv-secenekler.sv-iki { flex-direction: row; flex-wrap: wrap; }
.sv-secenekler.sv-iki > .sv-secenek { flex: 1 1 160px; justify-content: center; }
.sv-secenek {
  display: flex; align-items: center; gap: var(--sp-3);
  width: 100%; min-height: var(--ctrl-h-lg);
  padding: var(--sp-2) var(--sp-4);
  background: var(--card); color: var(--text);
  border: 1.5px solid var(--chip-line); border-radius: var(--r-md);
  box-shadow: 0 2px 0 var(--line);
  font: inherit; font-size: var(--fs-md); font-weight: 600; text-align: left;
  cursor: pointer;
  transition: border-color var(--mo-hizli) var(--mo-cikis), background var(--mo-hizli) var(--mo-cikis);
}
.sv-secenek:hover { border-color: var(--accent); background: var(--accent-soft); }
.sv-secenek .ic { flex: none; width: 18px; height: 18px; color: var(--accent); }
.sv-harf {
  flex: none; display: inline-flex; align-items: center; justify-content: center;
  width: 28px; height: 28px; border-radius: var(--r-sm);
  background: var(--accent-soft); color: var(--accent);
  font-size: var(--fs-sm); font-weight: 600;
}

.sv-not {
  display: flex; gap: var(--sp-2); align-items: flex-start;
  margin: 0; font-size: var(--fs-sm); color: var(--muted);
}
.sv-not .ic { flex: none; width: 16px; height: 16px; margin-top: 2px; }

/* cümle kurma: taşlar <button> — ders taşı <div>; yazı ailesi miras */
button.chip.sv-tas { font-family: inherit; color: var(--text); cursor: pointer; }
.chip.sv-tas.kullanildi { visibility: hidden; }

/* sonuç ve kapı */
.sv-sonuc .stat-grid .sv { font-variant-numeric: tabular-nums; }
.sv-kapi .sub p { margin: 0 0 var(--sp-3); }
.sv-kapi .sub p:last-child { margin-bottom: 0; }

/* tanıtım sayfasında yuva tn-test kartı — kendi zemini yok */
.sv-tanitim .ex-card, .sv-tanitim .ex-main { background: none; border: 0; box-shadow: none; }

/* TELEFONDA "EYLEM ÜSTE" MUAFİYETİ (CLAUDE.md): sonuç kartında Devam
   satırı okunacak metnin üstüne sıçrıyordu. (0,3,0) — sonra yüklenen
   telefon katmanından özgül. */
.card.sv-sonuc > [class] { order: 0; }

@media (max-width: 940px) {
  .sv-kunye .sv-bolum { color: var(--yan-ink-govde, var(--muted)); font-size: var(--fs-xs); }
  .sv-secenek { min-height: var(--m-ctrl-h, 52px); }
}

/* Telefon alıştırma katmanı ikincil düğmeyi 52px İKON karesine çeviriyor
   (yazı gizli). "Bilmiyorum"un ikonu yok — boş kare kalıyordu; testte
   YAZIYLA durur. (0,5,0) > katmanın (0,4,0)'ı. */
.sv-govde .ex-actions > .btn.sv-bilmiyorum:not(.btn-primary) {
  width: auto; min-width: 0; flex: 0 1 auto; padding: 0 var(--sp-4);
  font-size: var(--fs-md); color: var(--muted);
}

/* DİNLEME (7 Eki 2026) — ders ekranındaki ses düğmesinin dili: bakır,
   iri; çalarken `mo-caliyor` (dragdrop speak) dalgalanır. */
.sv-dinle-satir { display: flex; align-items: center; gap: var(--sp-3); flex-wrap: wrap; }
.sv-dinle {
  display: inline-flex; align-items: center; gap: var(--sp-2);
  min-height: var(--ctrl-h-lg); padding: 0 var(--sp-5);
  border: 0; border-radius: var(--r-md);
  background: var(--accent); color: var(--ink-ters);
  font: inherit; font-size: var(--fs-md); font-weight: 600; cursor: pointer;
}
.sv-dinle .ic { width: 22px; height: 22px; }
.sv-dinle:hover { filter: brightness(1.05); }
.sv-yavas { min-height: var(--ctrl-h); }
/* giriş ekranı: seçenek metni iki parçalı (kalın başlık + açıklama) */
.sv-secenek > span b { font-weight: 600; }
.sv-secenek > span { font-weight: 400; }
.sv-secenek .sv-harf + span { font-weight: 600; }