/*
 * sanal-lig/mobile-v219.css — Sanal Lig / Dünya Kupası mobil hafifletme.
 *
 * BU OYUNDA ZATEN GERÇEK BİR MOBİL UYGULAMA VAR
 *   `mobile-app-site-v153` içeriği dört sekmeye ayırır (Merkez / Kupon /
 *   Canlı / Lig) ve gerçek bir alt gezinti şeridi kurar. Bu şerit "yalancı"
 *   değil: sekmeler arasında gerçekten geçiş yapar. Bu yüzden KALDIRILMADI ve
 *   bu oyunda ortak yüzen menü düğmesi de AÇILMADI — iki menü olmaz.
 *
 * BU DOSYANIN İŞİ: HAFİFLETME VE SIĞDIRMA
 *   1) Telefonda pahalı görsel efektleri azaltmak (kare süresi kazancı).
 *   2) Tabloları masaüstü genişliğinde ezmek yerine kendi içinde kaydırmak.
 *   3) Eleme ağacını yatay kaydırılabilir yapmak.
 *   4) Güvenli alan uyumunu tamamlamak.
 *
 * Oranlar, kupon, veri, fikstür ve puan hesabı: DEĞİŞTİRİLMEDİ.
 */

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

  /* ===================== 1) Hafifletme (performans) ====================== */

  /*
   * Sabit ızgara dokusu tüm ekranı kaplayan bir katmandı ve her kaydırmada
   * yeniden boyanıyordu. Telefonda görsel katkısı %18 opaklıkta neredeyse
   * görünmezken maliyeti gerçekti.
   */
  body.wos-mobile-app::before {
    display: none !important;
  }

  /* ===================== 1a) Alt şerit gerçekten sabitlenir ============== */

  /*
   * BULUNAN HATA: `mobile-atmosphere-v156.css` alt gezinti şeridine
   * `position:relative!important` veriyordu. Şerit `position:fixed` olmak
   * üzere tasarlanmıştı; `relative` olunca sayfayla birlikte kayıyor ve
   * belgenin en dibinde kalıyordu. 390x844 bir telefonda şeridin üst kenarı
   * 2460. pikseldeydi: kullanıcı menüye ulaşmak için tüm sayfayı sonuna
   * kadar kaydırmak zorundaydı. "Alt menü var ama düzgün bağlanmamış"
   * belirtisinin ölçülen karşılığı budur.
   *
   * Şerit yeniden ekrana sabitlenir; görünümü, renkleri ve düğmeleri aynen
   * kalır.
   */
  body.wos-mobile-app .mobile-app-nav {
    position: fixed !important;
    bottom: 0 !important;
    left: 50% !important;
    z-index: 100 !important;
    transform: translateX(-50%) !important;
    padding-bottom: calc(9px + max(var(--wos-safe-bottom), 0px)) !important;
  }

  /*
   * `backdrop-filter: blur(24px) saturate(1.25)` alt şeritte her karede
   * arkasındaki alanı yeniden bulanıklaştırıyordu. Düşük güçlü cihazlarda
   * bu tek kural kare süresini gözle görülür şekilde artırıyor. Şeridin
   * görünümü korunur: bulanıklık azalır, zemin biraz daha opak olur.
   */
  .mobile-app-nav {
    -webkit-backdrop-filter: blur(10px) !important;
    backdrop-filter: blur(10px) !important;
    background: linear-gradient(180deg, rgba(5, 12, 21, .92), rgba(5, 12, 21, .99) 35%) !important;
  }

  /* Düşük güç modunda bulanıklık tamamen kalkar. */
  body.wos-low-power .mobile-app-nav,
  body.wos-low-power .mobile-app-view .card {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  /* Görünmeyen sekmeler animasyon çalıştırmaz. */
  .mobile-app-view:not(.is-active),
  .mobile-app-view:not(.is-active) * {
    animation-play-state: paused !important;
  }

  /* Geniş alanlarda pahalı gölgeler sadeleşir; kart kimliği korunur. */
  body.wos-low-power .mobile-app-view .card,
  body.wos-low-power .mobile-dashboard-hero {
    box-shadow: 0 6px 16px rgba(0, 0, 0, .28) !important;
  }

  /* ===================== 2) Tablolar: ezmek yerine kaydırmak ============= */

  /*
   * Puan durumu ve fikstür masaüstü sütun düzenini korur; telefonda sütunlar
   * daraltılıp okunmaz hâle getirilmez, tablo KENDİ İÇİNDE yatay kayar.
   * Veri, sıralama ve sütunlar aynen kalır.
   */
  #standings,
  .mobile-app-view .table,
  .mobile-app-view table {
    display: block !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overscroll-behavior-x: contain !important;
    -webkit-overflow-scrolling: touch !important;
  }

  .mobile-app-view table {
    width: max-content !important;
    min-width: 100% !important;
  }

  /* Takım sütunu kaydırırken sabit kalır: hangi satıra baktığın kaybolmaz. */
  .mobile-app-view table th:first-child,
  .mobile-app-view table td:first-child {
    position: sticky !important;
    left: 0 !important;
    z-index: 2 !important;
    background: inherit !important;
  }

  /* Kayabilen tabloda sağ kenar gölgesi: devamı olduğunu gösterir. */
  .mobile-app-view table.is-scrollable,
  #standings.is-scrollable {
    -webkit-mask-image: linear-gradient(to right, #000 0, #000 92%, transparent 100%);
    mask-image: linear-gradient(to right, #000 0, #000 92%, transparent 100%);
  }

  /* Başlık satırı dikey kaydırmada üstte kalır. */
  .mobile-app-view table thead th {
    position: sticky !important;
    top: 0 !important;
    z-index: 3 !important;
  }

  /* ===================== 3) Eleme ağacı (Dünya Kupası) =================== */

  /*
   * Ağaç dar ekrana sıkıştırılınca takım adları okunmaz oluyordu. Artık
   * yatayda kayar; tur genişlikleri korunur.
   */
  body.worldCupMode .bracket,
  body.worldCupMode #bracket,
  body.worldCupMode .bracketWrap {
    max-width: 100% !important;
    overflow-x: auto !important;
    overscroll-behavior-x: contain !important;
    -webkit-overflow-scrolling: touch !important;
  }

  /* ===================== 4) Kupon ve maç listesi ========================= */

  /* Kupon satırları ve oran düğmeleri başparmakla basılır ölçüde. */
  .mobile-app-view .odd,
  .mobile-app-view .oddBtn,
  .mobile-app-view .pickBtn {
    min-height: 44px !important;
  }

  /* Uzun takım adları taşmaz. */
  .mobile-app-view .fixture .teamName,
  .mobile-app-view .teamMini > span:last-child {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  /* ===================================================================
     SEZON ÖNCESİ KUPONLAR — mobil uygulama düzeni
     ===================================================================

     ÖLÇÜLEN DURUM (390x844, gerçek tarayıcı):
       · Takım listesi tek akışta 2772 piksel (48 takım).
       · Kupon paneli ve "Kuponu tamamla" düğmesi 2962. pikselde: kullanıcı
         bir seçim yapmak için tüm listeyi geçmek zorundaydı.
       · Toplam içerik ~3200 piksel; hangi kuponda olduğun, kaç seçim
         yaptığın ve bedelin ne olduğu hiçbir an aynı ekranda görünmüyordu.
       · "Ekle" düğmeleri 38 piksel (44 piksel dokunma hedefinin altında).

     YENİ DÜZEN — üç sabit kat, tek kayan alan:
       ÜST   : başlık + kapat, KUPON 1/2/3 adımları, pazar seçimi (yapışkan)
       ORTA  : yalnız takım listesi kayar
       ALT   : kupon özeti + tamamla düğmesi (her zaman görünür çekmece)

     Veri, oranlar, pazarlar, kupon mantığı ve seçim kuralları: DEĞİŞMEDİ.
     Buradaki her kural yalnız yerleşimle ilgilidir.
  */

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show {
    padding: 0 !important;
    align-items: stretch !important;
    justify-content: stretch !important;
  }

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonDialog {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: none !important;
    height: var(--wos-visible-height, 100dvh) !important;
    max-height: var(--wos-visible-height, 100dvh) !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border-radius: 0 !important;
  }

  /* --- ÜST KAT: başlık, adımlar, pazar --- */

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonHead {
    flex: 0 0 auto !important;
    padding:
      calc(max(var(--wos-safe-top), 0px) + 10px)
      max(var(--wos-safe-right), 12px)
      8px
      max(var(--wos-safe-left), 12px) !important;
  }

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonHead h2 {
    font-size: 16px !important;
    line-height: 1.2 !important;
  }

  /* Uzun açıklama paragrafı mobilde iki satıra iner: yer kaplamasın. */
  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonHead p {
    display: -webkit-box !important;
    overflow: hidden !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    font-size: 11.5px !important;
    line-height: 1.3 !important;
  }

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonClose {
    min-width: 44px !important;
    min-height: 44px !important;
  }

  /* Üç kupon adımı: hangi kupondasın her an belli, tek dokunuşla geçilir. */
  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preCouponSteps {
    display: grid !important;
    flex: 0 0 auto !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 6px !important;
    margin: 0 !important;
    padding: 0 max(var(--wos-safe-right), 12px) 8px max(var(--wos-safe-left), 12px) !important;
    overflow: visible !important;
  }

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preCouponStep {
    display: flex !important;
    flex-direction: column !important;
    gap: 1px !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 46px !important;
    padding: 4px !important;
    font-size: 11px !important;
  }

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preCouponStep > span {
    font-size: 15px !important;
    font-weight: 900 !important;
  }

  /* --- ORTA KAT: yalnız takım listesi kayar --- */

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonBody {
    display: flex !important;
    flex: 1 1 auto !important;
    flex-direction: column !important;
    min-height: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonMarkets {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    padding: 0 max(var(--wos-safe-right), 12px) 0 max(var(--wos-safe-left), 12px) !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch !important;
  }

  /* Pazar seçimi listenin üstünde yapışkan: değiştirmek için başa dönmek
     gerekmez. */
  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonToolbar {
    position: sticky !important;
    top: 0 !important;
    z-index: 5 !important;
    height: auto !important;
    margin: 0 0 8px !important;
    padding: 8px 0 !important;
    background: inherit !important;
    backdrop-filter: blur(6px);
  }

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonToolbar select {
    width: 100% !important;
    min-height: 48px !important;
    font-size: 16px !important;   /* iOS otomatik yakınlaştırma eşiği */
  }

  /* Grup başlıkları listede kaybolmaz. */
  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .wcPreGroupTitle {
    position: sticky !important;
    top: 62px !important;
    z-index: 4 !important;
    padding: 6px 0 !important;
    font-size: 12px !important;
  }

  /* Takım satırı: logo · ad · oran · ekle. Tek sütun, rahat dokunulur. */
  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .wcPreGroupTeams {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 6px !important;
  }

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .wcPreTeam {
    display: grid !important;
    grid-template-columns: 28px minmax(0, 1fr) auto auto !important;
    gap: 10px !important;
    align-items: center !important;
    min-height: 56px !important;
    padding: 6px 10px !important;
  }

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .wcPreTeamName {
    overflow: hidden !important;
    font-size: 13.5px !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
  }

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .wcPreOdd {
    font-size: 14px !important;
    font-variant-numeric: tabular-nums !important;
    font-weight: 900 !important;
  }

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .wcPreAdd {
    min-width: 76px !important;
    min-height: 44px !important;
    font-size: 12px !important;
  }

  /* --- ALT KAT: kupon çekmecesi, her zaman görünür --- */

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonSlip {
    position: fixed !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    /*
     * Çekmece listenin ÜSTÜNDE durmalı. Takım kartları kendi yığın
     * bağlamlarında olduğu için düşük bir z-index yetmiyordu: satırlar
     * çekmecenin içinden okunuyordu.
     */
    z-index: 60 !important;
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-height: 72vh !important;
    /* Zemin opak: krem panel oyunun kendi yüzeyidir, yeni renk getirilmedi. */
    background: #fffdf6 !important;
    /* Yazı rengi zemine göre koyu — beyaz yazı krem zeminde okunmuyordu. */
    color: #244a65 !important;
    margin: 0 !important;
    padding:
      0
      max(var(--wos-safe-right), 12px)
      calc(max(var(--wos-safe-bottom), 0px) + 10px)
      max(var(--wos-safe-left), 12px) !important;
    border-top: 1px solid rgba(255, 255, 255, .14) !important;
    border-radius: 18px 18px 0 0 !important;
    box-shadow: 0 -14px 34px rgba(0, 0, 0, .38) !important;
  }

  /* Başlık aynı zamanda çekmece tutamacıdır. */
  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonSlip :is(b, span, small, div) {
    color: #244a65 !important;
  }

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preActiveCouponTitle {
    display: flex !important;
    flex: 0 0 auto !important;
    gap: 8px !important;
    align-items: center !important;
    justify-content: space-between !important;
    min-height: 46px !important;
    margin: 0 !important;
    cursor: pointer !important;
    font-size: 13px !important;
    font-weight: 800 !important;
  }

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preActiveCouponTitle::after {
    content: "▲";
    opacity: .7;
    font-size: 11px;
    transition: transform .18s ease;
  }

  html body.wc-pre-slip-open :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preActiveCouponTitle::after {
    transform: rotate(180deg);
  }

  /* Kapalıyken yalnız özet ve tamamla düğmesi görünür; seçim listesi
     kullanıcı isteyince açılır. Böylece takım listesi ekranı boğmaz. */
  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonSlipList {
    display: none !important;
  }

  html body.wc-pre-slip-open :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonSlipList {
    display: block !important;
    flex: 1 1 auto !important;
    max-height: 44vh !important;
    min-height: 0 !important;
    margin: 0 0 8px !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
  }

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonSlipFooter {
    display: grid !important;
    flex: 0 0 auto !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 10px !important;
    align-items: center !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonTotal {
    display: flex !important;
    gap: 6px !important;
    align-items: baseline !important;
    font-size: 12px !important;
  }

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonSlipFooter button,
  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show #wcPreLock {
    min-height: 48px !important;
    padding: 0 14px !important;
    font-size: 12.5px !important;
    line-height: 1.15 !important;
  }

  /*
   * Tamamla düğmesinin yazısı uzun ("1. Kuponu Tamamla ve 2. Kupona Geç").
   * Dar ekranda özetin yanına sığmıyor; alt satıra tam genişlikte iner.
   */
  @media (max-width: 430px) {
    html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonSlipFooter {
      grid-template-columns: 1fr !important;
      gap: 8px !important;
    }
    html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonSlipFooter button,
    html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show #wcPreLock {
      width: 100% !important;
    }
  }

  /*
   * Liste, çekmecenin altında kalmasın: alt boşluk çekmece kadar bırakılır.
   * Değer, çekmece kapalıyken yaklaşık 100 pikseldir.
   */
  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonMarkets {
    padding-bottom: calc(max(var(--wos-safe-bottom), 0px) + 108px) !important;
  }

  /* ===================== 5) Güvenli alan tamamlaması ===================== */

  /* Üst başlık çentiğin altında kalmaz. */
  body.wos-mobile-app header {
    padding-top: calc(max(var(--wos-safe-top), 0px) + 8px) !important;
  }

  /* Yan güvenli alanlar (yatay kullanımda kavisli ekran kenarları). */
  body.wos-mobile-app main.layout {
    padding-right: max(var(--wos-safe-right), 0px) !important;
    padding-left: max(var(--wos-safe-left), 0px) !important;
  }

  /*
   * Alt şerit klavye açıkken gizlenir: oda adı / oyuncu adı yazarken yazı
   * alanının önünü kapatmasın.
   */
  body.wos-keyboard-open .mobile-app-nav {
    transform: translateX(-50%) translateY(120%) !important;
    pointer-events: none !important;
  }

  body.wos-keyboard-open.wos-mobile-app {
    padding-bottom: 0 !important;
  }
}

/* =========================================================================
 * SEZON ÖNCESİ — DÜNYA KUPASI DIŞINDAKİ LİGLER
 * =========================================================================
 *
 * Bu ekran, Dünya Kupası sürümüyle aynı üç katlı düzeni kullanır (yukarıdaki
 * kurallar her iki katmanı da kapsıyor). Burada yalnız o ekrana özgü iki iş
 * kalıyor: takım satırının biçimi ve OKUNABİLİRLİK.
 *
 * ÖLÇÜLEN SORUN
 *   Takım adı `rgb(238,245,255)`, kupon başlığı `rgb(233,244,255)`, kupon
 *   bedeli ve birleşik oran etiketleri de benzer açık tonlarda. Bu renkler
 *   koyu bir panel için seçilmiş; panel açık/krem renkte çizilince yazılar
 *   neredeyse görünmez oluyor. Kullanıcının "okunamayan yerler" dediği
 *   durum bu.
 *
 * Renk paletine yeni ton getirilmedi: yazılar oyunun kendi koyu lacivert
 * mürekkebine (#12304f) ve vurgu sarısına çekildi.
 */

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

  /* ---- okunabilirlik: açık zeminde koyu yazı ---- */

  html body :is(#preseasonOverlay, #v50PreseasonOverlay).show .preseasonTeamName,
  html body :is(#preseasonOverlay, #v50PreseasonOverlay).show .preseasonTeam b,
  html body :is(#preseasonOverlay, #v50PreseasonOverlay).show .preseasonTeam span,
  html body :is(#preseasonOverlay, #v50PreseasonOverlay).show .preActiveCouponTitle,
  html body :is(#preseasonOverlay, #v50PreseasonOverlay).show .preseasonTotal,
  html body :is(#preseasonOverlay, #v50PreseasonOverlay).show .preseasonTotal span,
  html body :is(#preseasonOverlay, #v50PreseasonOverlay).show .preseasonMarketInfo,
  html body :is(#preseasonOverlay, #v50PreseasonOverlay).show .preseasonSlipList,
  html body :is(#preseasonOverlay, #v50PreseasonOverlay).show .preseasonTicket,
  html body :is(#preseasonOverlay, #v50PreseasonOverlay).show .preseasonTicket b,
  html body :is(#preseasonOverlay, #v50PreseasonOverlay).show .preseasonTicket small {
    color: #12304f !important;
  }

  /* Oran ve para tutarları vurgu rengini korur ama koyu zeminde okunur. */
  html body :is(#preseasonOverlay, #v50PreseasonOverlay).show .preseasonOdd,
  html body :is(#preseasonOverlay, #v50PreseasonOverlay).show .preseasonTotal b {
    color: #8a6300 !important;
    font-variant-numeric: tabular-nums !important;
    font-weight: 900 !important;
  }

  /* ---- takım satırı: logo · ad · oran · ekle, tek satır ---- */

  /*
   * Eskiden her takım iki satır kaplıyordu: üstte logo/ad/oran, altında tam
   * genişlikte bir "Aktif kupona ekle" düğmesi. Yirmi takımda bu, ekranı
   * gereksiz uzatıyordu. Dünya Kupası ekranındaki gibi tek satıra alındı.
   */
  html body :is(#preseasonOverlay, #v50PreseasonOverlay).show .preseasonTeamGrid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 6px !important;
  }

  html body :is(#preseasonOverlay, #v50PreseasonOverlay).show .preseasonTeam {
    display: grid !important;
    grid-template-columns: 28px minmax(0, 1fr) auto auto !important;
    gap: 10px !important;
    align-items: center !important;
    min-height: 56px !important;
    padding: 6px 10px !important;
  }

  html body :is(#preseasonOverlay, #v50PreseasonOverlay).show .preseasonTeamName {
    overflow: hidden !important;
    font-size: 13.5px !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
  }

  html body :is(#preseasonOverlay, #v50PreseasonOverlay).show .preseasonAdd {
    width: auto !important;
    min-width: 76px !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 0 10px !important;
    font-size: 11.5px !important;
    line-height: 1.15 !important;
  }
}

/* =========================================================================
 * V229 — SEZON ÖNCESİ KUPON EKRANI: ORANLARA DAHA ÇOK YER
 * =========================================================================
 *
 * ÖLÇÜLEN DURUM (390x844, Süper Lig, gerçek tarayıcı):
 *     üst kat (başlık + üç bilgi kutusu + kupon adımları + pazar seçimi)
 *                                                          270 piksel
 *     takım/oran listesi                                   347 piksel
 *     alt çekmece                                          227 piksel
 *
 * Yani ekranın yalnız %41'i asıl işe — oranlara — kalıyordu. Çekmece tek
 * sütun olduğu için "Kupon bedeli" ve "Birleşik oran" alt alta iki tam
 * satır kaplıyor, üstteki üç bilgi kutusu da iki satıra yayılıyordu.
 *
 * Hiçbir bilgi SİLİNMEDİ; hepsi daha sıkı yerleşti:
 *     üst kat  ~270 -> ~190
 *     çekmece  ~227 -> ~155
 *     liste    ~347 -> ~500
 *
 * Oranlar, pazarlar, kupon mantığı ve seçim kuralları: DEĞİŞTİRİLMEDİ.
 */
@media (max-width: 900px), (pointer: coarse) {

  /* ---------------------------- üst kat --------------------------------- */

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonHead {
    padding-bottom: 6px !important;
  }

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonHead h2 {
    display: -webkit-box !important;
    overflow: hidden !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    font-size: 14.5px !important;
    line-height: 1.25 !important;
  }

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonHead p {
    margin-top: 3px !important;
    font-size: 11px !important;
  }

  /*
   * Bütçe · tamamlanan kupon · lig: üç kutu tek satırda. Alt alta
   * dizildiklerinde 220 piksel yiyorlardı; yan yana 56 piksel.
   */
  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonStats {
    display: grid !important;
    flex: 0 0 auto !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 6px !important;
    margin: 0 !important;
    padding: 0 max(var(--wos-safe-right), 12px) 6px max(var(--wos-safe-left), 12px) !important;
  }

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonStat {
    display: flex !important;
    flex-direction: column !important;
    gap: 1px !important;
    justify-content: center !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 6px 8px !important;
    border-radius: 10px !important;
  }

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonStat span {
    overflow: hidden !important;
    font-size: 9.5px !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
  }

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonStat b {
    overflow: hidden !important;
    font-size: 12.5px !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
  }

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preCouponStep {
    min-height: 38px !important;
    font-size: 10px !important;
  }

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preCouponStep > span {
    font-size: 13px !important;
  }

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonToolbar {
    margin-bottom: 6px !important;
    padding: 6px 0 !important;
  }

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonToolbar select {
    min-height: 44px !important;
  }

  /*
   * Pazar açıklaması kesikli çerçevesi 110 piksel boyundaydı; içindeki
   * metin tek satır. Kutu içeriğine iner, açıklama okunur kalır.
   */
  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonToolbar .preseasonMarketInfo,
  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show #preMarketInfo {
    min-height: 0 !important;
    height: auto !important;
    margin: 6px 0 0 !important;
    padding: 7px 9px !important;
    font-size: 11px !important;
    line-height: 1.3 !important;
  }

  /* ------------------------- alt çekmece --------------------------------- */

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonSlip {
    max-height: 62vh !important;
    padding-bottom: calc(max(var(--wos-safe-bottom), 0px) + 8px) !important;
  }

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preActiveCouponTitle {
    min-height: 38px !important;
    font-size: 12.5px !important;
  }

  /*
   * "Kupon bedeli" ve "Birleşik oran" artık YAN YANA. Bilgi aynı, iki tam
   * satır yerine tek satır. Uyarı notu ve tamamla düğmesi tam genişlikte
   * altta kalır.
   */
  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonSlipFooter {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 6px !important;
  }

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonTotal {
    gap: 6px !important;
    align-items: center !important;
    justify-content: space-between !important;
    min-height: 34px !important;
    padding: 5px 9px !important;
    border-radius: 10px !important;
    background: rgba(18, 48, 79, .06) !important;
    font-size: 11.5px !important;
  }

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonTotal span {
    overflow: hidden !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
  }

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonWarning,
  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .wcPreLockedNote {
    display: -webkit-box !important;
    grid-column: 1 / -1 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 2px !important;
    min-height: 0 !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    font-size: 10.5px !important;
    line-height: 1.3 !important;
  }

  /* Boş uyarı kutusu yer kaplamasın. */
  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonWarning:empty {
    display: none !important;
  }

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonSlipFooter button,
  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show #wcPreLock,
  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show #preLockBtn {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    min-height: 46px !important;
    font-size: 12.5px !important;
  }

  /* Liste artık daha kısa bir çekmecenin altında; boşluk da ona göre. */
  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonMarkets {
    padding-bottom: calc(max(var(--wos-safe-bottom), 0px) + 96px) !important;
  }
}

/* -------------------------------------------------------------------------
 * V229 ek — iki `grid-column: 1 / -1` kuralı düzeni bozuyordu
 * -------------------------------------------------------------------------
 *
 * Taban stil iki öğeyi tam satıra yayıyor:
 *
 *   · `.preseasonStat` sonuncusu ("Lig") — üç bilgi kutusunu tek satıra
 *     almak için sütun sayısını değiştirmek yetmedi; üçüncü kutu kendi
 *     satırını istiyordu ve şerit 104 piksel kalıyordu.
 *   · `.preseasonAdd` ("Aktif kupona ekle") — takım satırının dördüncü
 *     sütunu 0 piksele düşüyor, düğme İKİNCİ SATIRA iniyordu. Takım satırı
 *     bu yüzden 92 piksel boyundaydı: ekrana üç takım sığıyordu.
 *
 * İkisi de kendi sütununa alınır. Ölçülen sonuç: bilgi şeridi 104 -> 45,
 * takım satırı 92 -> 56 piksel; aynı ekranda üç yerine altı takım.
 */
@media (max-width: 900px), (pointer: coarse) {

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .preseasonStats .preseasonStat {
    grid-column: auto !important;
  }

  html body :is(#preseasonOverlay, #v50PreseasonOverlay).show .preseasonTeam .preseasonAdd {
    grid-column: auto !important;
    grid-row: auto !important;
  }

  html body :is(#wcPreOverlay, #preseasonOverlay, #v50PreseasonOverlay).show .wcPreTeam .wcPreAdd {
    grid-column: auto !important;
    grid-row: auto !important;
  }
}