/*
 * son-harf/mobile-v219.css — Son Harf mobil düzeni.
 *
 * KLAVYE AÇIKKEN GÖRÜNMESİ GEREKENLER (görev metninden):
 *   kalan süre · kullanılacak SON HARF · son yazılan kelime · aktif input ·
 *   son kullanılan kelimeler · puanlar · gönder düğmesi · hata bildirimi
 *
 * Hepsi aşağıdaki tek sütunda, kendi öncelik sırasıyla yerleşir. Oyuncu
 * kelime yazarken oyunun durumunu görmek için klavyeyi kapatmak zorunda
 * kalmaz.
 *
 * Renk, arka plan, tipografi kimliği: DEĞİŞTİRİLMEDİ.
 */

@media (max-width: 900px), (pointer: coarse) {

  /* ===================================================================
     Üst başlık — eskiden JavaScript'ten inline `!important` ile kuruluyordu
     =================================================================== */

  /*
   * mobile-app-v154.js her açılışta dört kez çalışıp bu düzeni JS'ten
   * yazıyordu. Aynı sonuç burada, tek yerleşim hesabıyla elde edilir.
   */
  body.son-harf-page .sh-nav {
    display: grid !important;
    grid-template-areas: "back . actions" "brand brand brand" !important;
    grid-template-columns: 132px minmax(0, 1fr) 96px !important;
    grid-template-rows: 44px 24px !important;
    height: auto !important;
    min-height: 92px !important;
    padding-top: max(var(--wos-safe-top), 4px) !important;
  }

  body.son-harf-page .sh-nav .sh-back { grid-area: back !important; }

  body.son-harf-page .sh-nav .sh-brand {
    position: static !important;
    grid-area: brand !important;
    justify-self: center !important;
    max-width: none !important;
    transform: none !important;
  }

  body.son-harf-page .sh-nav .sh-nav-actions {
    position: static !important;
    grid-area: actions !important;
    justify-self: end !important;
    width: 96px !important;
    height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.son-harf-page .sh-nav .sh-nav-actions .sh-nav-tool {
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    padding: 0 !important;
  }

  body.son-harf-page .sh-nav .sh-nav-actions #shInfoButton {
    width: 96px !important;
    min-width: 96px !important;
    padding: 0 8px !important;
  }

  /* ===================================================================
     OYUN KARTI HER İKİ DURUMDA DA TEK SÜTUN
     =================================================================== */

  /*
   * Gerçek iPhone'da çekilen görüntüde skor kutusu alt kenarından kesiliyor,
   * altında yüzlerce piksel boşluk kalıyor ve yazı alanı tek başına ekranın
   * dibinde duruyordu. Sebep: `son-harf-v111.css` ve `mobile-app-v154.css`
   * `#wordForm`u `position:fixed` ile ekrana çiviliyor; kartın içeriği ise
   * yukarıda kalıyor. Arada hiçbir şeyin doldurmadığı bir boşluk oluşuyor.
   *
   * Form akışa geri alınır ve kart bir sütun olur: üstte süre ve kelime,
   * ortada puanlar ile geçmiş, altta yazı alanı.
   */
  html body.sh-v111-playing .sh-game-card {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
  }

  html body.sh-v111-playing:not(.wos-keyboard-open) .sh-game-card {
    min-height: calc(var(--wos-visible-height, 100dvh) - 150px) !important;
  }

  html body.sh-v111-playing #wordForm,
  html body.sh-word-input-active #wordForm {
    position: static !important;
    inset: auto !important;
    flex: 0 0 auto !important;
    width: 100% !important;
    margin: 0 !important;
    transform: none !important;
  }

  /* Klavye kapalıyken sıralama: başlık → kelime → puanlar → giriş → geçmiş. */
  html body.sh-v111-playing:not(.wos-keyboard-open) .sh-game-card .sh-card-head { order: 1 !important; }
  html body.sh-v111-playing:not(.wos-keyboard-open) .sh-game-card .sh-word-row { order: 2 !important; }
  html body.sh-v111-playing:not(.wos-keyboard-open) .sh-game-card #scoreLine { order: 3 !important; }
  html body.sh-v111-playing:not(.wos-keyboard-open) .sh-game-card #wordForm { order: 4 !important; }
  html body.sh-v111-playing:not(.wos-keyboard-open) .sh-game-card #feedback { order: 5 !important; }
  html body.sh-v111-playing:not(.wos-keyboard-open) .sh-game-card #eventFeed {
    order: 6 !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-y: auto !important;
  }

  /* Puan kutusu kesilmesin: içeriği kadar yer alır. */
  html body.sh-v111-playing .sh-game-card #scoreLine .scorebox {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  /* ===================================================================
     KLAVYE AÇIK — oyuna odaklı düzen
     =================================================================== */

  /*
   * iOS SAFARİ'DE `position: fixed` KULLANILMIYOR.
   *
   * Önceki sürüm kartı görünür alana çivilemek için `position:fixed` +
   * `top: var(--wos-viewport-top)` kullanıyordu. Gerçek iPhone'da bu
   * güvenilir değil: klavye açılırken Safari sayfayı kendi kaydırıyor,
   * sabit öğe DÜZEN görüntü alanına göre konumlanıyor ve iki ölçü bir
   * kareliğine ayrışıyor. Kullanıcının gönderdiği ekran görüntülerinde
   * sonuç şuydu — yazı alanı klavyenin (ve üstündeki aksesuar şeridinin)
   * altında yarı görünür kalıyor, kartın ortasında ölü boşluk oluşuyordu.
   *
   * Yeni yaklaşım iOS'a KARŞI değil, ONUNLA çalışır: kart akışta kalır,
   * yalnız kompaktlaşır; yazı alanını görünür alana taşımayı Safari'nin
   * kendi "odaklanan alanı kaydır" davranışına bırakırız. `scroll-margin`
   * ile de klavyenin üstünde rahat bir pay bırakılır.
   *
   * Böylece hem ölü boşluk kalkar hem de giriş her zaman klavyenin üstünde
   * kalır; sıra, süre, kelime ve puan satırı da onun hemen üstünde durur.
   */
  html body.sh-v111-playing.wos-keyboard-open .sh-game-card,
  html body.wos-keyboard-open .sh-game-card {
    position: relative !important;
    inset: auto !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 10px max(var(--wos-safe-right), 12px) 12px max(var(--wos-safe-left), 12px) !important;
    overflow: visible !important;
  }

  /*
   * Safari, odaklanan alanı klavyenin hemen üstüne getirir. Aksesuar şeridi
   * (yukarı/aşağı okları ve onay işareti) için ek pay bırakılmazsa giriş o
   * şeridin altında kalıyor — ekran görüntüsündeki durum buydu.
   */
  html body.wos-keyboard-open #wordForm,
  html body #wordInput {
    scroll-margin-bottom: 96px !important;
    scroll-margin-top: 12px !important;
  }

  /* 1) Süre + sıra — her zaman görünür, tek satır. */
  html body.wos-keyboard-open .sh-game-card .sh-card-head {
    flex: 0 0 auto !important;
    order: 1 !important;
    margin: 0 !important;
  }

  /*
   * "🎮 OYUN ALANI" etiketi telefonda oynarken yer kaplıyor ve hiçbir bilgi
   * taşımıyor — hangi ekranda olduğun zaten belli. Klavye açık/kapalı fark
   * etmeksizin oynanış sırasında gizlenir; kurulum ekranında durur.
   */
  html body.sh-v111-playing .sh-game-card .sh-kicker { display: none !important; }

  html body.wos-keyboard-open .sh-game-card #timer {
    font-size: 22px !important;
  }

  /*
   * "Sıra: ..." HAPI NEDEN OKUNMUYORDU
   *
   * Sayfa içi biçim hapa AÇIK bir zemin veriyor:
   *     .pill { background:#f6f9fd !important; color:#485e7a !important }
   *
   * Mobil atmosfer katmanı (mobile-atmosphere-v156.css) ise başlık şeridini
   * koyulaştırıp içindeki yazıyı beyaza çeviriyor:
   *     .sh-card-head { background: linear-gradient(105deg,#042337,#09494e) }
   *     .sh-card-head .pill, .sh-card-head .timer { color:#fff !important }
   *
   * İki katman ayrı ÖZELLİKLERİ değiştirdiği için çakışma sayılmıyor ve
   * ikisi de yürürlükte kalıyor: açık zemin + beyaz yazı. Sonuç, ekran
   * görüntüsündeki neredeyse görünmez "Sıra: Sen" yazısı.
   *
   * Doğru çözüm yazının rengini değiştirmek değil — koyu şeridin üstünde
   * koyu yazı da okunmaz. Hapın ZEMİNİ şeride uydurulur: koyu, saydam,
   * altın çerçeveli. Beyaz yazı böylece her iki katmanla da uyumlu olur.
   */
  html body .sh-game-card .sh-card-head #turnText,
  html body.wos-keyboard-open .sh-game-card .sh-card-head #turnText {
    max-width: 52vw !important;
    overflow: hidden !important;
    padding: 5px 10px !important;
    border: 1px solid rgba(235, 203, 125, .45) !important;
    background: rgba(2, 20, 32, .55) !important;
    color: #ffffff !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
  }

  /*
   * 2) SON HARF en belirgin öğedir. Mevcut kelime yanında durur; ikisi tek
   *    satırda kalır ki dikey alan tabloya ve geçmişe kalsın.
   */
  html body.wos-keyboard-open .sh-game-card .sh-word-row {
    flex: 0 0 auto !important;
    order: 2 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 20px 86px !important;
    gap: 8px !important;
    align-items: center !important;
  }

  html body.wos-keyboard-open .sh-game-card .wordbox {
    padding: 6px 10px !important;
  }

  html body.wos-keyboard-open .sh-game-card .wordbox strong {
    font-size: clamp(20px, 6.4vw, 28px) !important;
    letter-spacing: .12em !important;
  }

  html body.wos-keyboard-open .sh-game-card .sh-flow {
    font-size: 20px !important;
  }

  html body.wos-keyboard-open .sh-game-card .prefix {
    width: 62px !important;
    height: 62px !important;
    font-size: 32px !important;
  }

  /*
   * 3) PUANLAR — İKİDEN FAZLA OYUNCU DA SIĞAR.
   *
   * Önceki sürüm yan kaydırmalı tek satırdı: üçüncü ve dördüncü oyuncu
   * ekranın dışında kalıyor, kullanıcı onları görmek için şeridi yana
   * sürüklemek zorundaydı. Artık saran bir ızgara — iki sütun, gerektiği
   * kadar satır. Dört oyuncuda iki satır olur ve hepsi aynı anda görünür.
   */
  html body.sh-v111-playing .sh-game-card #scoreLine,
  html body.wos-keyboard-open .sh-game-card #scoreLine {
    flex: 0 0 auto !important;
    order: 3 !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 6px !important;
    margin: 0 !important;
    overflow: visible !important;
    /*
     * ESKİ KATMAN ŞERİDİ TEK SATIRA KİLİTLİYORDU.
     *
     * Bir önceki kuşak, puan şeridini yatay kaydırmalı TEK satır olarak
     * tasarladığı için `max-height: 48px` koymuş. Izgaraya çevirince ikinci
     * satır çiziliyor ama kabın yüksekliği 48'de kaldığı için satır kabın
     * DIŞINA taşıyor ve altındaki yazı alanının üstüne biniyordu (ölçüldü:
     * kutular 239→268, form 261'de başlıyor — 7 piksel çakışma).
     *
     * Yükseklik içeriğe bırakılır; satır sayısı oyuncu sayısına göre
     * kendiliğinden artar.
     */
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
  }

  /* Beş ve üzeri oyuncuda sütun sayısı artar, kutular kısalır. */
  html body .sh-game-card #scoreLine:has(> :nth-child(5)) {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  html body .sh-game-card #scoreLine:has(> :nth-child(5)) .scorebox {
    padding: 4px 6px !important;
    font-size: 9.5px !important;
  }

  html body.wos-keyboard-open .sh-game-card #scoreLine .scorebox {
    min-width: 0 !important;
    padding: 5px 8px !important;
    font-size: 10.5px !important;
  }

  /*
   * 4) Son kelimeler: kalan alanın tamamını alır ve KENDİ İÇİNDE kayar.
   *    En yeni kaydı görünür tutma işini mobile-scene-v219.js yapar.
   */
  /*
   * Kelime geçmişi klavye açıkken ESNEMEZ, sabit bir pencereye oturur.
   * Akış düzeninde `flex:1` vermek kartı uzatıp girişi klavyenin altına
   * itiyordu. Sabit yükseklikte kendi içinde kayar; en yeni kaydı görünür
   * tutmayı mobile-scene-v219.js yapar.
   */
  html body.wos-keyboard-open .sh-game-card #eventFeed {
    flex: 0 0 auto !important;
    order: 4 !important;
    height: 84px !important;
    min-height: 0 !important;
    max-height: 84px !important;
    margin: 0 !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch !important;
  }

  html body.wos-keyboard-open .sh-game-card #eventFeed .event {
    padding: 5px 8px !important;
    font-size: 11px !important;
  }

  /* 5) Hata / bilgi satırı: inputu veya süreyi kapatmaz, tek satır kalır. */
  html body.wos-keyboard-open .sh-game-card #feedback {
    flex: 0 0 auto !important;
    order: 5 !important;
    min-height: 0 !important;
    max-height: 30px !important;
    margin: 0 !important;
    padding: 6px 10px !important;
    overflow: hidden !important;
    font-size: 11px !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
  }

  /*
   * 6) Yazı alanı klavyenin hemen üstünde.
   *
   * `margin-top:auto` kritik: kelime geçmişi henüz boşken (`#eventFeed`
   * içi boş olduğu için gizleniyor) sütunda 220 piksellik ölü boşluk
   * kalıyor ve yazı alanı ekranın ortasında asılı duruyordu. Otomatik üst
   * boşluk, alan boş da olsa dolu da olsa girişi klavyenin hemen üstüne
   * yapıştırır.
   */
  /*
   * Sütun artık görünür alanı kaplamadığı için otomatik üst boşluk
   * (`margin-top:auto`) gerekmez — akışta o boşluk doğrudan ölü alana
   * dönüşüyordu. Giriş, kendinden önceki bloğun hemen altında durur.
   */
  html body.wos-keyboard-open .sh-game-card #wordForm {
    flex: 0 0 auto !important;
    order: 6 !important;
    margin: 2px 0 0 !important;
  }

  /*
   * KLAVYE AÇIKKEN PUAN VE KELİME SAYISI GÖRÜNÜR KALIR.
   *
   * İstenen: "son harfin ve son kelimenin göründüğü yerin hemen altında,
   * odadakilerin kaç puan / kaç kelime yazdığı klavyeyle yazarken de
   * görünsün." Kutu tek satıra dizilir: ad · puan · kelime sayacı. Böylece
   * hem sığar hem de hiçbir bilgi düşmez.
   */
  /*
   * KUTU İÇİ: TEK SATIR DEĞİL, İKİ SATIR.
   *
   * Tek satırda ad, puan ve kelime sayacı yan yana duruyordu. İki sütunlu
   * ızgarada her gözün genişliği ~185 piksele düşünce ad, esnek olan tek
   * parça olduğu için ezildi: ekran görüntüsünde oyuncu adları tek harfe
   * ("S", "P") inmişti. Oysa dört oyuncuyu sığdırmanın amacı KİMİN kaç
   * puanı olduğunu görebilmek.
   *
   * Artık ad kendi satırında tam genişlikte durur, puan ve sayaç altında
   * yan yana gelir. Kutu 2 piksel uzar, ad okunur olur.
   */
  html body.wos-keyboard-open .sh-game-card #scoreLine .scorebox {
    display: block !important;
    padding: 5px 8px !important;
    line-height: 1.25 !important;
    overflow: hidden !important;
  }

  html body.wos-keyboard-open .sh-game-card #scoreLine .scorebox .name {
    display: block !important;
    max-width: 100% !important;
    overflow: hidden !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
  }

  html body.wos-keyboard-open .sh-game-card #scoreLine .scorebox b {
    display: inline !important;
    margin-right: 5px !important;
    font-size: 13px !important;
  }

  html body.wos-keyboard-open .sh-game-card #scoreLine .scorebox .meta {
    display: inline !important;
    font-size: 9px !important;
    opacity: .78 !important;
    white-space: nowrap !important;
  }

  /*
   * Sıradaki oyuncunun kutusundaki "Sıra" rozeti mutlak konumlu ve sağ üst
   * köşede duruyor; iki sütunlu dar gözde adın ve sayacın üstüne biniyordu.
   * Klavye açıkken kaldırılır — sıra bilgisi zaten iki yerde daha var:
   * başlıktaki "Sıra: ..." hapı ve kutunun yeşil vurgusu.
   */
  html body.wos-keyboard-open .sh-game-card #scoreLine .scorebox.active:after {
    display: none !important;
  }

  /*
   * Üç ve daha fazla oyuncuda puan ızgarası iki satıra çıkar. O satırlara
   * yer açmak için kelime geçmişi penceresi kısalır — giriş alanı klavyenin
   * üstünde kalsın diye. Dört oyuncuda pencere daha da kısalır.
   */
  html body.wos-keyboard-open .sh-game-card #scoreLine:has(> :nth-child(3)) ~ #eventFeed {
    height: 62px !important;
    max-height: 62px !important;
  }

  html body.wos-keyboard-open .sh-game-card #scoreLine:has(> :nth-child(5)) ~ #eventFeed {
    height: 46px !important;
    max-height: 46px !important;
  }

  html body.wos-keyboard-open #wordInput {
    height: 48px !important;
    font-size: 16px !important;   /* iOS otomatik yakınlaştırma eşiği */
  }

  html body.wos-keyboard-open #sendWord {
    height: 48px !important;
    min-width: 96px !important;
  }

  /* Klavye açıkken ikincil bloklar sahneyi daraltmasın. */
  html body.sh-v111-playing.wos-keyboard-open .sh-game-card .sh-input-label,
  html body.sh-v111-playing.wos-keyboard-open .sh-game-card .rules,
  html body.sh-v111-playing.wos-keyboard-open .sh-game-card #wordAppealButton,
  html body.sh-v111-playing.wos-keyboard-open .sh-side-card,
  html body.sh-v111-playing.wos-keyboard-open .sh-hero,
  html body.sh-v111-playing.wos-keyboard-open .sh-tabs,
  html body.sh-v111-playing.wos-keyboard-open .sh-setup-card,
  html body.sh-v111-playing.wos-keyboard-open .sh-nav {
    display: none !important;
  }

  /* ===================================================================
     KLAVYE KAPALI — rahat kurulum ve oynanış
     =================================================================== */

  /* Kurulum düğmeleri başparmak ölçüsünde. */
  html body:not(.wos-keyboard-open) .sh-action-row .btn,
  html body:not(.wos-keyboard-open) .sh-action-row .btn2,
  html body:not(.wos-keyboard-open) .sh-tabs .tab {
    min-height: 48px !important;
  }

  /* Kurulum alanları iOS'ta yakınlaştırma tetiklemesin. */
  html body .sh-setup-card input,
  html body .sh-setup-card select {
    height: 48px !important;
    font-size: 16px !important;
  }

  /* Oda kodu okunur ve tek dokunuşla seçilebilir. */
  html body #roomView,
  html body .sh-room-code {
    -webkit-user-select: all !important;
    user-select: all !important;
  }

  /* Kullanılan kelimeler listesi kendi içinde kayar, sayfayı uzatmaz. */
  html body .sh-used-block .used {
    max-height: 132px !important;
    overscroll-behavior: contain !important;
  }
}

/*
 * Çok kısa GÖRÜNÜR alan (küçük telefon + klavye).
 *
 * 320x568 bir telefonda klavye açıldığında geriye 268 piksel kalıyor.
 * `@media (max-height:430px)` bunu göremez — medya sorgusu düzen görüntü
 * alanını ölçer, klavye ise yalnız görsel alanı küçültür. Bu yüzden ölçüyü
 * ortak zeminden gelen sınıf taşır.
 *
 * Öncelik: yazı alanı ve gönder düğmesi HER ZAMAN kalır; önce puan şeridi,
 * sonra geri bildirim, en sonda kelime geçmişi kısalır.
 */
@media (max-width: 900px), (pointer: coarse) {
  /*
   * Kısa görünür alanda düşme sırası: önce geri bildirim, sonra kelime
   * geçmişi. SON HARF, mevcut kelime, PUAN SATIRI ve giriş her koşulda
   * kalır — kullanıcının açıkça istediği bilgiler bunlar.
   *
   * 320x568 bir telefonda klavye açıkken geriye 268 piksel kalıyor; geçmiş
   * penceresi (84 piksel) burada kalırsa son harf kutusu ekranın üstünden
   * taşıyor.
   */
  html body.wos-vh-short.wos-keyboard-open .sh-game-card #feedback,
  html body.wos-vh-short.wos-keyboard-open .sh-game-card #eventFeed {
    display: none !important;
  }

  html body.wos-vh-short.wos-keyboard-open .sh-game-card #scoreLine .scorebox {
    padding: 4px 7px !important;
    font-size: 9.5px !important;
  }
  html body.wos-vh-short.wos-keyboard-open .sh-game-card .prefix {
    width: 52px !important;
    height: 52px !important;
    font-size: 26px !important;
  }
  html body.wos-vh-short.wos-keyboard-open .sh-game-card .wordbox strong {
    font-size: 20px !important;
  }
  /* Geçmiş tamamen sıfıra kadar inebilir: giriş alanı asla ezilmez. */
  html body.wos-vh-short.wos-keyboard-open .sh-game-card #eventFeed {
    flex: 1 1 0 !important;
    min-height: 0 !important;
  }
  html body.wos-vh-xshort.wos-keyboard-open .sh-game-card #eventFeed,
  html body.wos-vh-xshort.wos-keyboard-open .sh-game-card .sh-card-head {
    display: none !important;
  }
  html body.wos-vh-xshort.wos-keyboard-open #wordInput,
  html body.wos-vh-xshort.wos-keyboard-open #sendWord {
    height: 44px !important;
  }

  /*
   * 320x568'DE SON HARF KUTUSU EKRANIN ÜSTÜNDEN TAŞIYORDU.
   *
   * Ölçüm (klavye açık, görünür alan 268 piksel):
   *     kart      -82 → 200   (282 piksel)
   *     kelime satırı -72 → 67 (139 piksel)   ← asıl yük burada
   *     puanlar    73 → 116
   *     giriş     124 → 188
   *
   * Kart görünür alandan 14 piksel uzun olduğu için tarayıcı girişi
   * klavyenin üstünde tutmak adına üstü dışarı itiyor ve "son harf" —
   * yani oyunun tek zorunlu bilgisi — ekrandan çıkıyordu.
   *
   * Bu ölçüde kelime satırı sıkılaştırılır: harf kutusu küçülür ve iki
   * başlıkçık ("Mevcut kelime" / "Son harf") kalkar. Başlıkçıkların
   * anlattığı şey zaten kutuların kendisinde duruyor; oyunun ihtiyacı olan
   * harf, kelime, puan ve giriş dördü de ekranda kalır.
   */
  html body.wos-vh-xshort.wos-keyboard-open .sh-game-card .sh-word-row {
    gap: 6px !important;
    grid-template-columns: minmax(0, 1fr) 16px 64px !important;
  }
  html body.wos-vh-xshort.wos-keyboard-open .sh-game-card .wordbox small,
  html body.wos-vh-xshort.wos-keyboard-open .sh-game-card .sh-prefix-box small {
    display: none !important;
  }
  html body.wos-vh-xshort.wos-keyboard-open .sh-game-card .wordbox {
    padding: 4px 8px !important;
  }
  html body.wos-vh-xshort.wos-keyboard-open .sh-game-card .wordbox strong {
    font-size: 18px !important;
  }
  /*
   * KİMLİK SEÇİCİSİ GEREKLİ.
   *
   * `mobile-final-v168.css` harf kutusunu KİMLİKLE sabitliyor:
   *     body.wos-keyboard-open.sh-word-input-active #prefix { width:58px … }
   * Sınıfla yazılan bir kural (`.prefix`) bunu yenemez — ilk denemede kutu
   * 58 pikselde kaldı ve kart yine taşıyordu. Aynı kimlik burada da
   * kullanılır ki bu ölçüde küçülme gerçekten uygulansın.
   */
  html body.wos-vh-xshort.wos-keyboard-open .sh-game-card #prefix {
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    font-size: 23px !important;
  }

  /*
   * `mobile-final-v184.css` kelime satırına 39 piksel üst boşluk koyuyor —
   * mutlak konumlu süre aynası oraya oturuyor. Bu ölçüde o boşluk da
   * kısalır ve ayna küçülür; süre görünür kalır, yalnız daha az yer kaplar.
   */
  html body.wos-vh-xshort.wos-keyboard-open .sh-game-card .sh-word-row {
    padding-top: 24px !important;
  }
  html body.wos-vh-xshort.wos-keyboard-open .sh-game-card .sh-mobile-timer-v184 {
    top: 2px !important;
    padding: 1px 6px !important;
    font-size: 11px !important;
  }
  html body.wos-vh-xshort.wos-keyboard-open .sh-game-card .sh-flow {
    font-size: 15px !important;
  }
  html body.wos-vh-xshort.wos-keyboard-open .sh-game-card {
    gap: 4px !important;
    padding-top: 6px !important;
    padding-bottom: 8px !important;
  }
}

/* =========================================================================
 * V229 — SIRA SENDE VURGUSU
 * =========================================================================
 *
 * Sıra kullanıcıya geçtiğinde yazı alanı ekranın ortasına getirilir
 * (mobile-v219.js) ve bir buçuk saniyelik bir vurgu alır. Vurgu yalnız
 * kenarlık ve gölge oynatır; kutunun ölçüsü, yeri ve rengi değişmez —
 * yazarken hiçbir şey kaymaz.
 */
@media (max-width: 900px), (pointer: coarse) {
  html body .sh-turn-pulse {
    animation: sh-turn-pulse-v229 1.4s ease-out 1;
  }

  @keyframes sh-turn-pulse-v229 {
    0%   { box-shadow: 0 0 0 0 rgba(28, 150, 110, .55); }
    55%  { box-shadow: 0 0 0 8px rgba(28, 150, 110, 0); }
    100% { box-shadow: 0 0 0 0 rgba(28, 150, 110, 0); }
  }

  /* Hareketi azaltılmış cihazlarda yanıp sönme yerine sabit bir çerçeve. */
  @media (prefers-reduced-motion: reduce) {
    html body .sh-turn-pulse {
      animation: none;
      box-shadow: 0 0 0 3px rgba(28, 150, 110, .45);
    }
  }
}

/* =========================================================================
 * V230 — KLAVYE AÇIKKEN TUR GÜNLÜĞÜ DE GÖRÜNÜR
 * =========================================================================
 *
 * İstenen akış: kelimeyi gönder, kimin kaç puan aldığını gör, sıra dönünce
 * hemen yazmaya devam et. İlk iki adım kopuktu — klavye açıkken tur
 * günlüğü ve durum satırı ekranda hiç yoktu.
 *
 * BULUNAN SEBEP
 *   `mobile-layout-v157.css` şunu diyor:
 *       body.wos-mobile-keyboard-open.sh-word-input-active #eventFeed
 *           { display: none !important }
 *   V219 katmanı bu iki bloğa yükseklik ve sıra veriyor ama `display`
 *   ÖZELLİĞİNİ hiç yazmıyor. İki kural farklı özellikleri değiştirdiği
 *   için çakışma sayılmıyor; ikisi de yürürlükte kalıyor ve sonuç
 *   "yerleşimi hesaplanmış ama görünmeyen" bir blok oluyor.
 *
 * `display` artık burada da yazılıyor: günlük klavyenin üstünde, puan
 * satırıyla yazı alanının arasında duruyor. Kaydırma gerekmiyor.
 *
 * Puanlama, sıra ve kelime doğrulama: DEĞİŞTİRİLMEDİ.
 */
@media (max-width: 900px), (pointer: coarse) {

  html body.wos-keyboard-open .sh-game-card #eventFeed {
    display: grid !important;
    height: 78px !important;
    max-height: 78px !important;
  }

  /*
   * `mobile-layout-v157.css` ayrıca `.eventfeed { visibility: hidden }`
   * yazıyor. `display` ile `visibility` AYRI özellikler olduğu için bu iki
   * kural çakışmıyor, ikisi de yürürlükte kalıyordu: blok yer kaplıyor ama
   * içindeki satırlar görünmüyordu — ekranda puan satırıyla yazı alanı
   * arasında boş bir dikdörtgen olarak çıkıyordu. İkincisi de burada
   * açıkça geri alınır.
   */
  html body.wos-keyboard-open .sh-game-card #eventFeed,
  html body.wos-keyboard-open .sh-game-card #eventFeed .event {
    visibility: visible !important;
  }

  /* Henüz kayıt yokken boş kutu yer kaplamasın. */
  html body.wos-keyboard-open .sh-game-card #eventFeed:empty {
    display: none !important;
  }

  html body.wos-keyboard-open .sh-game-card #feedback {
    display: block !important;
  }

  html body.wos-keyboard-open .sh-game-card #feedback:empty {
    display: none !important;
  }

  /*
   * Kısa ekranda (klavye açıkken 430 pikselin altı) günlük düşer: puan
   * satırı, mevcut kelime ve yazı alanı önceliklidir. Durum satırı kalır —
   * tek satır ve en çok bilgi veren yer orası.
   */
  html body.wos-vh-short.wos-keyboard-open .sh-game-card #eventFeed,
  html body.wos-vh-xshort.wos-keyboard-open .sh-game-card #eventFeed {
    display: none !important;
  }
}