/* ORTAK — sayfa bölünmesiyle gelen yeni parçalar.
   Tasarım dosyasından SONRA yüklenir ama yalnızca hiçbir tasarımda karşılığı
   olmayan sınıfları tanımlar; var olanların üstüne yazmaz. Renk ve çizgi
   kalınlığı hep tasarımın kendi değişkenlerinden gelir, böylece dört üslupta da
   uyumlu görünür. */

/* ---------- tablo ---------- */
/* min-width:0 olmadan kaydırma kabı esnek/ızgara hücresi içinde tablonun
   genişliğine kadar büyür ve kaydırmak yerine sayfayı taşırır (dolu Kasalar
   tablosu 320 px'te brütalist ve Bauhaus'ta böyle taşıyordu). */
.tablo-sar { overflow-x: auto; min-width: 0; max-width: 100%; }
.tablo {
  width: 100%;
  border-collapse: collapse;
  font-variant-numeric: tabular-nums;
}
.tablo th, .tablo td {
  padding: 9px 14px;
  text-align: left;
  border-bottom: var(--cizgi, 1px) solid var(--cizgi-renk, var(--murekkep));
  white-space: nowrap;
}
.tablo thead th {
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--sonuk);
}
.tablo .say { text-align: right; font-family: "JetBrains Mono", ui-monospace, monospace; }
.tablo tbody tr:hover { background: var(--beton); }
.tablo tfoot td {
  border-bottom: 0;
  border-top: var(--kalin, 2px) solid var(--cizgi-renk, var(--murekkep));
  font-weight: 700;
}
.tablo tr.pasif { opacity: .5; }
.tablo .minik { font-size: 10px; color: var(--sonuk); font-weight: 400; }
.kasa-bag { color: inherit; font-weight: 700; }
.rozet.ince { background: none; color: var(--sonuk); border: var(--cizgi, 1px) solid var(--sonuk);
              padding: 1px 5px; margin: 0 0 0 6px; }

/* Ayarlar tablosundaki düzenlenebilir hücreler.
   Tam genişliğe yayılınca ad ile sermaye arasında koca bir boşluk kalıyor;
   tablo içeriğine göre daralsın. */
.kasa-ayar { width: auto; }
.kasa-ayar input { padding: 5px 7px; font-size: 13px; }
.kasa-ayar td:first-child input { width: 150px; }
.kasa-ayar .say input { width: 88px; text-align: right;
                        font-family: "JetBrains Mono", ui-monospace, monospace; }
/* display:flex burada hücre kutusunu bozar ve satırdan taşar — satır içi kalsın. */
.kasa-ayar .islem { white-space: nowrap; padding: 6px 10px; }
.kasa-ayar .islem > * { vertical-align: middle; }

/* ---------- bahis planı ---------- */
.plan-govde { display: flex; gap: 24px; align-items: flex-start; flex-wrap: wrap; }
.plan-birim {
  display: flex; flex-direction: column; gap: 6px;
  padding: 14px 20px; background: var(--sari); color: var(--sari-yazi, #000);
  border: var(--kalin, 2px) solid var(--cizgi-renk, var(--murekkep));
}
.plan-birim .etiket { color: inherit; }
.plan-sayi {
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 40px; font-weight: 700; line-height: 1; letter-spacing: -.02em;
}
.plan-sayi small { font-size: 15px; font-weight: 500; margin-left: 4px; }
.plan-tl {
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 16px; font-weight: 700;
}
.plan-yazi { flex: 1 1 320px; display: flex; flex-direction: column; gap: 8px; }
.plan-yazi p { max-width: 62ch; }
.plan-yazi a { color: inherit; }

/* ---------- miktar çarpanları ---------- */
/* Miktar alanında etiket+giriş bir <label> içinde; alanın kendi dizilişini
   sürdürsün diye aynı sütun akışını burada devralıyor. */
.alan > label { display: flex; flex-direction: column; gap: inherit; min-width: 0; }
/* Tasarımlar ".alan > span"a etiket biçimi verir; çarpan şeridi onu almasın. */
.carpanlar {
  display: flex; gap: 0; margin-top: 6px;
  font-size: inherit; font-weight: 400; letter-spacing: normal;
  text-transform: none; color: inherit;
}
.carpan {
  border: var(--cizgi, 1px) solid var(--sonuk); background: none; color: var(--sonuk);
  cursor: pointer; padding: 3px 9px; margin-right: -1px;
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 10.5px; letter-spacing: .06em;
}
.carpan:hover { background: var(--sari); color: var(--sari-yazi, #000);
                border-color: var(--murekkep); }

/* ---------- kırılım kapsamı ---------- */
.kapsam {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
  padding: 12px 16px;
  border-bottom: var(--cizgi, 1px) solid var(--cizgi-renk, var(--murekkep));
}
.kapsam .etiket { color: var(--sonuk); margin-right: 8px; }
.kapsam a { margin: 0; }
.kapsam a[aria-current="true"] { background: var(--murekkep); color: var(--kagit); }

/* İade düğmesi bütün tasarımlarda geçerli olsun diye burada: nötr, sönük ton. */
.durum button[aria-pressed="true"].i { background: var(--sonuk); color: var(--kagit); }

/* ---------- istek sürerken geri bildirim ---------- */
/* htmx istek atan öğeye .htmx-request ekler; yanıt gelene dek düğme sönük ve
   kilitli — yavaş bağlantıda "tıkladım, bir şey olmadı" hissi ve çift gönderim
   bunun sayesinde biter. */
.htmx-request { cursor: progress; }
form.htmx-request button, a.htmx-request, form.htmx-request .dugme {
  opacity: .55; pointer-events: none;
}

/* ---------- satırda düzenleme ---------- */
/* Lig artık satırda değiştirilebilir bir seçici; rozet görünümünü korur. */
select.lig-sec {
  width: auto; max-width: 150px;
  border: var(--cizgi, 1px) solid var(--cizgi-renk, var(--murekkep));
  background: var(--beton); color: var(--sonuk);
  padding: 1px 4px; border-radius: 2px; cursor: pointer;
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 9.5px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase;
  vertical-align: 2px; margin-right: 7px;
}
/* Oran ve miktar: değere dokununca giriş olduğu belli olan sessiz kutular. */
input.oran-giris, input.miktar-giris {
  border: var(--cizgi, 1px) solid transparent; background: none; color: inherit;
  padding: 1px 3px; border-radius: 2px;
  font-family: "JetBrains Mono", ui-monospace, monospace; font-size: inherit;
  -moz-appearance: textfield; appearance: textfield;
}
input.oran-giris::-webkit-inner-spin-button, input.miktar-giris::-webkit-inner-spin-button,
input.oran-giris::-webkit-outer-spin-button, input.miktar-giris::-webkit-outer-spin-button {
  -webkit-appearance: none; margin: 0;
}
input.oran-giris { width: 58px; }
input.miktar-giris { width: 58px; text-align: right; margin-right: 3px; }
input.oran-giris:hover, input.miktar-giris:hover,
input.oran-giris:focus-visible, input.miktar-giris:focus-visible {
  border-color: var(--sonuk);
}

/* ---------- hareket listesi sayfalaması ---------- */
.sayfalama {
  display: flex; align-items: center; justify-content: center; gap: 14px;
  padding: 12px 16px;
  border-top: var(--cizgi, 1px) solid var(--cizgi-renk, var(--murekkep));
}

/* ---------- kopya kasa: oran giriş adımı ---------- */
input.oran-tablo {
  width: 84px; text-align: right;
  font-family: "JetBrains Mono", ui-monospace, monospace;
}
.kopya-alt { display: flex; justify-content: flex-end; gap: 8px; }

/* Yeni kasa formundaki kopya seçici tam satıra yayılmasın. */
.tanim-ekle select { width: auto; flex: 0 1 auto; }
.tanim-ekle .onay { align-self: center; flex: 0 0 auto; white-space: nowrap; }

/* Birim yüzdesi alanı (15 Ekim 2026): kasa açma formunda ve kopyalama adımında aynı kalıp —
   etiket üstte küçük, sayı kutusu dar ve sağa yaslı. Ad alanı kalan yeri almaya devam eder. */
.alan-kucuk { display: flex; flex-direction: column; gap: 3px; font-size: 12px;
              flex: 0 0 auto; white-space: nowrap; align-self: center; }
/* Tema kuralı `.tanim-ekle input { flex: 1 1 170px }` SÜTUN kapsayıcıda DİKEY büyüme demek:
   kutu 170 px boyunda bir dikdörtgen oluyordu (15 Ekim 2026, ekran görüntüsünde görüldü).
   Seçici tema kuralından özgül (0,2,1 ↔ 0,1,1) ve ortak.css temalardan sonra yükleniyor. */
.tanim-ekle .alan-kucuk input, .kopya-yuzde .alan-kucuk input, .alan-kucuk input {
  flex: 0 0 auto; width: 72px; text-align: right;
  font-family: "JetBrains Mono", ui-monospace, monospace; }
/* Geçmiş maçta oyuncu marketi: ad + çizgi + yön + Al, tek satır (15 Ekim 2026). Kutu
   dizisinin yerine geçiyor, o yüzden `.market-secimler` gibi satır içinde akar. */
.oyuncu-ozel { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.oyuncu-ozel select { width: auto; flex: 0 1 auto; max-width: 240px; }
.oyuncu-ozel .oyuncu-cizgi, .oyuncu-ozel .oyuncu-yon { max-width: 90px; }

.kopya-yuzde { display: flex; align-items: flex-end; gap: 12px; flex-wrap: wrap; }
.kopya-yuzde .not { margin: 0; flex: 1 1 320px; }

/* Kasa sekmeleri hiçbir tasarımda ekrandan taşamaz: kasa sayısı artınca satır
   sarar. Tasarımların çoğu .kasa-secim'i sarmasız tek satır kuruyor; ortak.css
   her tasarımdan SONRA yüklendiği için bu kural hepsinde son söz olur. */
.kasa-secim { flex-wrap: wrap; min-width: 0; }

/* Üst bandın net rakamı: kasa sekmesinin içinde küçük kalır. */
.kasa-sekme .net { opacity: .8; }
.kasa-sekme[aria-current="true"] .net { opacity: 1; }
/* Sekme etkin renk (sarı ya da mürekkep) üstünde kâr/zarar rengi okunmaz. */
.kasa-sekme[aria-current="true"] .net.arti,
.kasa-sekme[aria-current="true"] .net.eksi,
.kasa-sekme:hover .net.arti,
.kasa-sekme:hover .net.eksi { color: inherit; }

@media (max-width: 820px) {
  .plan-govde { gap: 16px; }
  .plan-sayi { font-size: 34px; }
}

/* ---------- dar ekranda tablolar ---------- */
/* Telefonda tablo yana kaydırılarak okunmaz; ikincil sütunlar gizlenir,
   kalanlar ekrana sığar. Ayrıntı zaten kasanın kendi sayfasında. */
@media (max-width: 620px) {
  .tablo .dar-gizle { display: none; }
  .tablo th, .tablo td { padding: 8px 10px; }
  .tablo td:first-child { white-space: normal; }
  .kasa-ayar td:first-child input { width: 100px; }
  .kasa-ayar .say input { width: 64px; }
  /* Satır sağı (oran + 4 durum düğmesi + kâr + sil) dar ekranda sarabilsin —
     sade kendi bloğunda yapıyor, öbür dört tasarım bunu buradan alır. */
  .satir .sag { flex-wrap: wrap; row-gap: 4px; }
}

/* ---------- satırda maç saati ---------- */
/* Oran/miktar kutularıyla aynı sessiz görünüm; tarayıcının saat ok tuşları
   satırı şişirmesin diye gizlenir. */
input.saat-giris {
  border: var(--cizgi, 1px) solid transparent; background: none; color: inherit;
  padding: 1px 3px; border-radius: 2px; width: 60px;
  font-family: "JetBrains Mono", ui-monospace, monospace; font-size: inherit;
}
input.saat-giris:hover, input.saat-giris:focus-visible { border-color: var(--sonuk); }
input.saat-giris::-webkit-calendar-picker-indicator { display: none; }
/* Saat girilmemişse alan boş görünür; dolu olanla karışmasın diye soluk. */
input.saat-giris:invalid, input.saat-giris:placeholder-shown { color: var(--sonuk); }

/* ---------- kullanıcı ve çıkış ---------- */
/* Düğmenin görünümü tasarımdan gelir (.tema-dugme sınıfını da taşır): sade ve
   Memphis'te çerçeveli, İsviçre ve Bauhaus'ta düz yazı — her tasarımın kendi
   kontrol dili. Burada yalnızca yerleşim ayarlanır. */
.cikis-form { display: flex; margin-right: 6px; }
.cikis-dugme { white-space: nowrap; }
/* Kullanıcı adı düz yazı değil, tıklanabilir bir kontrol: baş harfi
   yuvarlakta, adı yanında. Görünümü .tema-dugme'den gelir, yani her tasarım
   onu kendi kontrol diliyle çizer. */
.kullanici-adi {
  display: inline-flex; align-items: center; gap: 7px;
  text-decoration: none; white-space: nowrap; margin-right: 2px;
  /* Dar tut: bu kontrol büyüyünce üst bant sarıyor ve kasa sekmeleri
     ikinci satıra düşüyor (ölçüldü: 36 px → 89 px, İsviçre'de h67 → h111). */
  padding-left: 6px; padding-right: 6px;
}
/* Ad HER ZAMAN görünür: "kimim" sorusu bir rozetten okunmuyordu. Dar ekranda
   yalnız baş harf. */
.kullanici-ad-yazi { display: inline; font-weight: 600; }
@media (max-width: 620px) { .kullanici-ad-yazi { display: none; } }
.kullanici-bas {
  flex: 0 0 auto;
  width: 19px; height: 19px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: var(--murekkep); color: var(--yuzey);
  font-size: 10px; font-weight: 700; line-height: 1;
  font-family: "JetBrains Mono", ui-monospace, monospace;
}
.kullanici-adi:hover .kullanici-bas { background: var(--sonuk); }

/* ---------- kullanıcı menüsü ---------- */
.kullanici-menu { position: relative; margin-left: auto; }
.kullanici-menu > summary { list-style: none; cursor: pointer; }
.kullanici-menu > summary::-webkit-details-marker { display: none; }
.kullanici-ok { font-size: 10px; opacity: .7; }
.kullanici-liste {
  position: absolute; right: 0; top: calc(100% + 6px); z-index: 60; min-width: 200px;
  background: var(--yuzey, #fff); color: var(--murekkep);
  border: var(--kalin, 2px) solid var(--murekkep); box-shadow: 0 8px 24px rgba(0,0,0,.18);
  display: flex; flex-direction: column;
}
.km-bas { display: flex; flex-direction: column; gap: 2px; padding: 10px 14px;
          border-bottom: var(--cizgi, 1px) solid var(--cizgi-renk, var(--murekkep)); }
.km-satir {
  display: block; width: 100%; text-align: left; font: inherit; font-size: 13.5px;
  padding: 10px 14px; background: none; border: 0; color: inherit; cursor: pointer;
  text-decoration: none; border-top: var(--cizgi, 1px) solid var(--cizgi-renk, var(--murekkep));
}
.km-bas + .km-satir { border-top: 0; }
.km-satir:hover { background: var(--beton); }
.km-cikis { color: var(--kayip); font-weight: 600; }
.cikis-form { margin: 0; }
@media (max-width: 620px) { .kullanici-liste { right: 0; left: auto; } }

/* ---------- giriş ekranı ---------- */
.giris-sayfa {
  min-height: 100vh; min-height: 100dvh;
  display: flex; align-items: center; justify-content: center;
  /* Tasarımların .sayfa dolgusu (alttan 40-120 px) kutuyu yukarı itiyordu;
     giriş ekranı tek işli bir sayfa, o dolguya ihtiyacı yok. */
  padding: 24px; gap: 0;
}
.giris-kutu {
  width: 100%; max-width: 360px;
  border: var(--cizgi, 1px) solid var(--cizgi-renk, var(--murekkep));
  background: var(--yuzey); padding: 28px 24px 24px;
  border-radius: var(--yuvarlak, 0);
}
.giris-kutu .marka { font-weight: 700; font-size: 18px; letter-spacing: -.01em; }
.giris-alt { color: var(--sonuk); font-size: 13px; margin: 6px 0 20px; }
.giris-form { display: flex; flex-direction: column; gap: 14px; }
.giris-form .dugme { margin-top: 4px; }
/* iOS 16px altındaki girişe odaklanınca sayfayı yakınlaştırıp öyle bırakır. */
@media (max-width: 620px) {
  .giris-form input { font-size: 16px; }
  /* Dar ekranda çıkış tema düğmesinin yanında kalsın
     (sade telefonda .tema-dugme'ye order:2 veriyor, form da onu izlesin). */
  .cikis-form { order: 2; }
}

/* ---------- form alanları dar ekranda daralabilsin ---------- */
/* Izgara hücresinin varsayılan min-width'i "auto"dur: içindeki input kendi
   iç genişliğinin (yaklaşık 20 karakter) altına inemez ve hücreyi ekran
   dışına taşırır. Tasarımların bir kısmı bunu kendi içinde çözüyor, bir
   kısmı çözmüyor; ortak.css hepsinden sonra yüklendiği için son söz burada.
   Kural yalnızca DARALMAYA izin verir, hiçbir şeyi genişletmez. */
.yeni .alan, .yeni .alan > label { min-width: 0; }
.yeni .alan input, .yeni .alan select { min-width: 0; max-width: 100%; }
/* Uzun etiket de hücreyi geremesin: tasarımların çoğu etiketi tek satıra
   sabitliyor, dar ekranda satır kırılması taşmaya yeğdir. */
.yeni .alan > span, .yeni .alan > label > span { white-space: normal; overflow-wrap: anywhere; }

/* Parola alanları dar ekranda 12 sütunluk ızgaraya sığmaz: sütun boşlukları
   (11 × ~24px) tek başına 264px yer kaplıyor, kart 320px ekranı taşırıyordu.
   Telefonda ızgarayı bırakıp alanları alt alta diziyoruz. Kural yalnızca bu
   forma bakar; öteki formların düzenine dokunulmaz. */
@media (max-width: 620px) {
  .hesap-form { display: flex; flex-direction: column; }
  .hesap-form .alan { grid-column: auto; width: 100%; }
  .hesap-form .dugme { align-self: flex-start; }
}

/* Tanım satırı (lig / tür / takım) 320px'te kabına sığmıyordu: içindeki ad
   girişi kendi iç genişliğinin altına inemiyor, esnek öğe de min-width:auto
   ile onu taşıyordu. Yalnız daralmaya izin verir. */
.tanim { min-width: 0; }
.tanim input { min-width: 0; }
/* Telefonda ad girişi + düğmeler tek satıra sığmazsa alta sarsın. */
@media (max-width: 620px) {
  .tanim { flex-wrap: wrap; }
}

/* ---------- maç adını kopyalama ---------- */
/* Maç adı düz yazı gibi görünür — düğme kutusu, çerçeve, arka plan yok.
   Tıklanabilirliği yalnızca imleç ve üzerine gelince çıkan alt çizgi belli
   eder; kopyalandığını sağ alttaki bildirim söyler. */
.mac-kopya {
  font: inherit; color: inherit; letter-spacing: inherit; text-transform: inherit;
  background: none; border: 0; padding: 0; margin: 0; border-radius: 0;
  -webkit-appearance: none; appearance: none; box-shadow: none;
  cursor: pointer; text-align: left; display: inline;
}
.mac-kopya:hover, .mac-kopya:focus-visible {
  text-decoration: underline; text-underline-offset: 3px;
}

/* Kırılım sekmeleri dar ekranda tek satıra sığmayınca sayfayı yana çekiyordu
   (brütalist tasarımda 320 px'te 45 px taşma). Sarsınlar. */
.sekmeler { flex-wrap: wrap; min-width: 0; }

/* ---------- yeni bahis formu: satır başına üç alan ---------- */
/* Tasarımlar 12 sütunluk ızgara kuruyor; .uc üçte bir yer kaplar.
   ortak.css hepsinden sonra yüklendiği için beş tasarımda da aynı düzen. */
.alan.uc { grid-column: span 4; }
/* Bahis türü tek hücrede ikiye bölünür: market + seçim. Hücre satırın en
   uzun alanı kadar uzuyor; flex-start olmazsa çift aşağı kayıp komşu
   alanların etiket hizasını kaçırıyor. */
.alan.ikili { flex-direction: row; gap: 8px; align-items: flex-start; }
.alan.ikili > label { flex: 1 1 0; min-width: 0; }
.alan.ikili input { width: 100%; }

/* ---------- defter satırında market ve seçim ---------- */
.satir .market { font-weight: 600; }
select.secim-sec {
  width: auto; max-width: 190px;
  border: var(--cizgi, 1px) solid transparent; background: none; color: inherit;
  padding: 1px 3px; border-radius: 2px; cursor: pointer;
  font-family: inherit; font-size: inherit;
}
select.secim-sec:hover, select.secim-sec:focus-visible { border-color: var(--sonuk); }

/* ---------- Ayarlar: markete bağlı seçimler ---------- */
.secim-market { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap;
                padding: 6px 0; min-width: 0; }
.secim-market > .etiket { flex: 0 0 140px; }
.secim-market .tanim-liste { flex: 1 1 240px; min-width: 0; }

/* ---------- kaydetme bildirimi ---------- */
/* Bildirim renkleri bilerek tasarımdan bağımsız: bunlar defter verisi değil,
   durum işareti. İsviçre'de "kazanç" siyah, Bauhaus'ta mavi — onları kullanmak
   "oldu / olmadı" ayrımını okunmaz kılardı. */
:root {
  --bildirim-iyi: #12A150;
  --bildirim-kotu: #D92D20;
}
.bildirimler {
  position: fixed; right: 16px; bottom: 16px; z-index: 60;
  display: flex; flex-direction: column; align-items: flex-end; gap: 10px;
  pointer-events: none;                 /* arkadaki sayfa tıklanabilir kalsın */
}
.bildirim {
  pointer-events: auto;
  display: flex; align-items: center; gap: 11px;
  max-width: min(380px, calc(100vw - 32px));
  padding: 13px 16px 13px 13px;
  border-radius: var(--yuvarlak, 3px);
  border: var(--cizgi, 1px) solid var(--cizgi-renk, var(--murekkep));
  border-left: 5px solid var(--bildirim-iyi);
  background: var(--yuzey); color: var(--murekkep);
  box-shadow: 0 8px 26px rgba(0, 0, 0, .22);
  font-size: 13px; font-weight: 600; line-height: 1.35;
  opacity: 0; transform: translateY(10px) scale(.97);
  transition: opacity .18s ease, transform .18s ease;
}
.bildirim.acik { opacity: 1; transform: none; }
/* Yuvarlak rozet: metne bakmadan da "oldu mu olmadı mı" anlaşılsın. */
.bildirim::before {
  content: "✓";
  flex: 0 0 auto;
  width: 22px; height: 22px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: var(--bildirim-iyi); color: #fff;
  font-size: 13px; font-weight: 700; line-height: 1;
}
.bildirim.kotu { border-left-color: var(--bildirim-kotu); color: var(--bildirim-kotu); }
.bildirim.kotu::before { content: "✕"; background: var(--bildirim-kotu); }
.bildirim-kapat {
  border: 0; background: none; color: inherit; cursor: pointer;
  font-size: 16px; line-height: 1; padding: 0 2px;
}
@media (prefers-reduced-motion: reduce) {
  .bildirim { transition: none; }
}
@media (max-width: 620px) {
  /* Telefonda alta yaslanır ve genişliği paylaşır. */
  .bildirimler { left: 12px; right: 12px; bottom: 12px; align-items: stretch; }
  .bildirim { max-width: none; }
  /* Form alanları telefonda tam satır. */
  .alan.uc { grid-column: 1 / -1; }
  .alan.ikili { flex-direction: column; align-items: stretch; gap: 5px; }
  .secim-market > .etiket { flex-basis: 100%; }
}

/* ---------- onay kutusu ---------- */
/* Tarayıcının confirm() penceresi yerine sayfanın kendi dili. <dialog>:
   odak tuzağı, Esc ve arka plan karartması tarayıcıdan geliyor. */
.onay-kutu {
  border: var(--cizgi, 1px) solid var(--cizgi-renk, var(--murekkep));
  background: var(--yuzey); color: var(--murekkep);
  border-radius: var(--yuvarlak, 2px);
  padding: 20px; max-width: min(380px, calc(100vw - 32px));
  box-shadow: 0 10px 40px rgba(0, 0, 0, .25);
}
.onay-kutu::backdrop { background: rgba(0, 0, 0, .35); }
.onay-soru { margin: 0 0 18px; line-height: 1.5; font-size: 14px; }
.onay-dugmeler { display: flex; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }

/* ---------- yedek listesi ---------- */
.yedek-liste { display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
               min-width: 0; padding-top: 4px; }

/* ---------- birleştirme formu ---------- */
.birlestir-form { display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
                  min-width: 0; padding-top: 6px; }
.birlestir-form select { width: auto; flex: 1 1 150px; min-width: 0; max-width: 100%; }
.birlestir-ok { color: var(--sonuk); font-weight: 700; }

/* ---------- para birimi seçici (Genel, toplam netin yanı) ---------- */
.para-secim { display: inline-flex; gap: 4px; margin-left: 10px; vertical-align: middle; }
.kur-notu { padding-top: 2px; }

/* Tasarım seçici artık POST formu: <a> yerine <button>. Tasarımlar bağlantıyı
   biçimlendiriyor, düğmenin tarayıcı zırhını burada söküyoruz ki aynı görünsün. */
.tasarim-secim button {
  font: inherit; cursor: pointer; background: none;
  border: 0; -webkit-appearance: none; appearance: none;
}

/* Çevrilen tutarın altında kasanın kendi parasındaki aslı — hangi rakamın
   nereden geldiği görünsün diye. Soluk ve küçük: asıl sayı üstteki. */
.asil {
  display: block; margin-top: 1px;
  font-size: 10px; font-weight: 400; color: var(--sonuk);
  font-family: "JetBrains Mono", ui-monospace, monospace;
  white-space: nowrap;
}

/* ---------- durum damgası ---------- */
/* Sonuç elle işaretlenmez; düğme değil, salt okunur damga. Renk yalnız
   paranın sonucuna ait: yeşil/kırmızı, gerisi sönük. */
.hal {
  display: inline-block; min-width: 68px; text-align: center;
  padding: 3px 8px; font-size: 11px; font-weight: 700; letter-spacing: .04em;
  text-transform: uppercase; border: var(--cizgi, 1px) solid var(--sonuk);
  color: var(--sonuk); font-family: "JetBrains Mono", ui-monospace, monospace;
}
.hal.k { background: var(--kazanc); border-color: var(--kazanc); color: #fff; }
.hal.y { background: var(--kayip); border-color: var(--kayip); color: #fff; }
/* ROZET ZEMİNİ TEMAYLA DÖNÜYOR, YAZI DÖNMÜYORDU (DENETIM.md B-53, 21 Eylül 2026): koyu modda
   --kazanc açık yeşile (#3DD673) dönünce beyaz-üstüne-açık-yeşil kalıyordu — 11 px metin için
   ölçülen kontrast 1,90 (WCAG eşiği 4,5). Koyuda zemin AÇIK olduğuna göre yazı KOYU olmalı;
   bu blok tema dosyalarının koyu bloklarının aynısı (ortak.css temalardan SONRA yüklenir). */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .hal.k,
  :root:not([data-theme="light"]) .hal.y { color: #10140F; }
}
:root[data-theme="dark"] .hal.k,
:root[data-theme="dark"] .hal.y { color: #10140F; }
.hal.i { border-style: dashed; }
.oran-yazi { font-family: "JetBrains Mono", ui-monospace, monospace; font-weight: 700;
             min-width: 56px; text-align: right; padding: 0 6px; }
.satir .paylas {
  font: inherit; font-size: 13px; cursor: pointer; background: none; border: 0;
  color: var(--sonuk); padding: 4px 6px;
}
.satir .paylas:hover { color: var(--murekkep); }
.satir .b-saat { font-family: "JetBrains Mono", ui-monospace, monospace; }
.satir .kupon-ligler { font-size: 12px; color: var(--sonuk); margin-left: 6px; }

/* ---------- kuponun maçları ---------- */
/* Her kayıt kupon; çok maçlıda maçlar hep açık, sol omurgayla bağlı. */
.bacaklar {
  list-style: none; margin: 6px 0 8px; padding: 0 0 0 10px;
  border-left: var(--kalin, 2px) solid var(--cizgi-renk, var(--murekkep));
}
.bacak {
  display: grid; grid-template-columns: 22px minmax(140px, 1fr) minmax(160px, 2fr) auto auto;
  gap: 4px 10px; align-items: center; padding: 4px 0; font-size: 13px;
}
.bacak + .bacak { border-top: var(--cizgi, 1px) solid var(--cizgi-renk, var(--murekkep)); }
.bacak .b-no {
  font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 11px;
  color: var(--sonuk); text-align: right;
}
.bacak .b-mac { font-weight: 600; }
.bacak .b-kunye { font-size: 12px; color: var(--sonuk); }
.bacak .b-kunye .market { font-weight: 600; color: var(--murekkep); }
.bacak.kazandi .b-mac { color: var(--kazanc); }
.bacak.kaybetti .b-mac { color: var(--kayip); }
.bacak .oran-giris { width: 64px; }
.bacak form.satir-ici { justify-self: end; }
.bacak .hal { justify-self: end; }
@media (max-width: 620px) {
  /* İki satır: üstte no · maç · oran · damga, altta künye. Otomatik yerleşim
     künyeyi 2. satıra atınca oran kutusu 22 piksellik ilk sütuna düşüyordu. */
  .bacak { grid-template-columns: 22px 1fr auto auto; }
  .bacak .b-no, .bacak .b-mac, .bacak form.satir-ici, .bacak .hal { grid-row: 1; }
  .bacak .b-mac { grid-column: 2; }
  .bacak form.satir-ici { grid-column: 3; }
  .bacak .hal { grid-column: 4; min-width: 0; }
  .bacak .b-kunye { grid-row: 2; grid-column: 2 / -1; }
  .bacak .oran-giris { width: 58px; }
}
.b-kunye .ayrac { margin: 0 5px; opacity: .45; }

/* ---------- yeni bahis: maç listesi ---------- */
/* Açılır liste yerine gün gün düğmeler: 200 maç arasında gezmek için arama
   kutusu, seçilen maç işaretli kalır. */
.mac-sec-alan #mac-ara {
  width: 100%; margin-bottom: 6px; font-size: 14px; padding: 9px 12px;
  border: var(--kalin, 2px) solid var(--murekkep); background: var(--yuzey, #fff); color: inherit;
}
/* Temalar .mac-dugme'ye display:grid veriyor; `hidden` özniteliği onu ezemez.
   Arama süzgeci bu satır olmadan hiçbir şeyi gizlemiyordu. */
.mac-dugme[hidden], .mac-gun[hidden] { display: none; }
/* Liste akışın içinde açılır (üstüne binmez): formun gerisini örtmesin. */
.mac-liste {
  max-height: 340px; overflow-y: auto; margin-top: 4px;
  background: var(--yuzey, #fff);
  border: var(--cizgi, 1px) solid var(--cizgi-renk, var(--murekkep));
}
.mac-liste[hidden] { display: none; }
.mac-gun-bas {
  position: sticky; top: 0; z-index: 1;
  font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 10.5px;
  letter-spacing: .12em; text-transform: uppercase; color: var(--sonuk);
  background: var(--beton); padding: 4px 10px;
}
.mac-dugme {
  display: grid; grid-template-columns: 5ch 1fr auto; gap: 10px; align-items: center;
  width: 100%; text-align: left; font: inherit; font-size: 13px; cursor: pointer;
  background: none; color: inherit; border: 0; padding: 6px 10px;
  border-top: var(--cizgi, 1px) solid var(--cizgi-renk, var(--murekkep));
}
.mac-dugme:hover { background: var(--beton); }
.mac-dugme[aria-pressed="true"] { background: var(--murekkep); color: var(--yuzey, #fff); }
.mac-dugme .md-saat { font-family: "JetBrains Mono", ui-monospace, monospace; }
.mac-dugme .md-mac { font-weight: 600; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.mac-dugme .md-ayrac { opacity: .5; font-weight: 400; }
.mac-dugme .amblem { width: 18px; height: 18px; object-fit: contain; }
.mac-dugme .md-lig { font-size: 11px; opacity: .7; white-space: nowrap; }
@media (max-width: 620px) {
  .mac-dugme { grid-template-columns: 5ch 1fr; }
  .mac-dugme .md-lig { grid-column: 2; }
}

/* ---------- yeni bahis: market paneli ---------- */
.mac-ozet {
  font-size: 13px; font-weight: 600; padding: 6px 0;
  font-family: "JetBrains Mono", ui-monospace, monospace;
}
.secim-yazi { font-size: 13px; font-weight: 600; padding: 8px 0; display: block; }
.market-yuva:empty { display: none; }
.market-yuva {
  border: var(--cizgi, 1px) solid var(--cizgi-renk, var(--murekkep));
  padding: 0 12px 10px; max-height: 520px; overflow-y: auto;
}
.market-yok { font-size: 12.5px; color: var(--sonuk); padding: 10px 0; }
.market-mac { display: flex; align-items: center; flex-wrap: wrap; gap: 8px;
              font-weight: 700; padding: 10px 0 6px; }
.market-mac .amblem { width: 22px; height: 22px; object-fit: contain; }
.market-mac-alt { flex-basis: 100%; }
.market-bolum-ad {
  position: sticky; top: 0; z-index: 1;
  font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 10.5px;
  letter-spacing: .12em; text-transform: uppercase; color: var(--sonuk);
  background: var(--beton); margin: 10px -12px 4px; padding: 5px 12px;
}
/* Her market bir satır: solda ad, sağda seçim kutuları. Kutu iki katlı —
   üstte seçim, altta oran — ki 30 kutuluk Üst/Alt satırı taranabilsin. */
.market-satir { display: grid; grid-template-columns: 170px 1fr; gap: 6px 12px; align-items: start;
                padding: 8px 0; border-top: var(--cizgi, 1px) solid var(--cizgi-renk, var(--murekkep)); }
.market-ad { font-size: 12.5px; font-weight: 600; padding-top: 6px; }
.market-secimler { display: flex; flex-wrap: wrap; gap: 5px; }
/* Öteki kaynağın oranı: kutunun üstünde küçük balon, yalnız imleç kutudayken.
   Yeşil: öteki kaynak daha yüksek veriyor; kırmızı: daha düşük. */
.oran-ipucu {
  position: fixed; z-index: 60; transform: translate(-50%, -100%); pointer-events: none;
  padding: 3px 8px; border: 1px solid var(--murekkep); background: var(--yuzey, #fff);
  color: var(--murekkep); font: 600 11.5px/1.3 "JetBrains Mono", ui-monospace, monospace;
  white-space: nowrap; box-shadow: 2px 2px 0 var(--murekkep);
}
.oran-ipucu[hidden] { display: none; }
/* Satır başına bir kaynak (öteki iki kaynak alt alta); renk satırın kendi karşılaştırması. */
.oran-ipucu-satir { text-align: left; }
.oran-ipucu-satir.bekliyor, .oran-ipucu-satir.yok { color: var(--sonuk); font-weight: 500; }
.oran-ipucu-satir.yuksek { color: var(--kazanc, #1a7f37); }
.oran-ipucu-satir.dusuk { color: var(--kayip); }
/* Değer sayfası: adil oran kalın, kaynaklar küçük; yeşil value, kırmızı altında. */
.dg-adil { font-weight: 700; font-variant-numeric: tabular-nums; }
.dg-kaynak { font-size: 11px; color: var(--sonuk); white-space: nowrap; font-variant-numeric: tabular-nums; }
/* İşaret bahisleri ve gol dökümü: oranlar okunur boyda (kullanıcı 11px'i okuyamadı, 9 Eylül) */
.dg-oran { font-size: 17px; font-weight: 700; font-variant-numeric: tabular-nums; }
.dg-cizgiler { font-size: 14px; font-variant-numeric: tabular-nums; line-height: 1.7; }
.dg-cizgiler b { font-weight: 600; color: var(--sonuk); }
.dg-cizgiler .dg-fiyat { font-weight: 700; }
.dg-ayar { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 6px 18px; margin: 8px 0 12px; }
.dg-ayar label { display: flex; gap: 8px; align-items: baseline; }
.dg-ayar .dg-kaynak { white-space: normal; }
.dg-esik { display: flex; gap: 18px; flex-wrap: wrap; align-items: center; margin-bottom: 8px; }
.dg-esik input { width: 5em; }
/* Canlı masa: kartlar (liste) ve tek maç masası (skor, ölçümler, fiyat tabloları). */
.cm-kartlar { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; }
.cm-kart { display: block; text-decoration: none; color: inherit; padding: 12px 14px; min-width: 0; }
.cm-kart:hover { outline: 2px solid var(--murekkep); }
.cm-sansli { box-shadow: inset 4px 0 0 var(--kayip); }
.cm-eksik { box-shadow: inset 4px 0 0 var(--kazanc, #1a7f37); }
.cm-ust { display: flex; justify-content: space-between; gap: 8px; }
.cm-dk { font-family: "JetBrains Mono", ui-monospace, monospace; color: var(--kazanc, #1a7f37); font-weight: 700; white-space: nowrap; }
.cm-skor-satir { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 10px; align-items: center; margin: 8px 0; }
.cm-takim { min-width: 0; overflow-wrap: anywhere; font-weight: 600; }
.cm-ev { text-align: right; }
.cm-skor { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 22px; font-weight: 800; white-space: nowrap; }
.cm-xg { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 13.5px; }
.cm-fark b { font-size: 15px; }
.cm-ipucu { font-size: 12px; color: var(--sonuk); margin-left: 6px; }
.cm-alt { margin-top: 6px; white-space: normal; }
.cm-miktar-satir { display: flex; flex-wrap: wrap; gap: 8px 18px; align-items: center; }
.cm-miktar-satir .dg-miktar { width: 4.5em; font-size: 15px; }
.cm-skor-buyuk { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto; gap: 12px; align-items: center; }
.cm-skor-buyuk .cm-skor { font-size: 30px; }
.cm-skor-buyuk .cm-takim { font-size: 17px; }
.cm-olcumler { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 8px 22px; margin-top: 12px; }
.cm-olcum { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.cm-deger { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; }
.cm-deger > b { font-size: 17px; }
.cm-olcum .dg-kaynak, .cm-miktar-satir .dg-kaynak { white-space: normal; }
.cm-goller { display: flex; flex-wrap: wrap; gap: 4px 6px; margin-top: 2px; }
.cm-gol { padding: 1px 7px; border: 1px solid var(--sonuk); font-variant-numeric: tabular-nums; white-space: nowrap; }
.cm-iki > .kart, .cm-form .kart { min-width: 0; }
@media (max-width: 640px) { .cm-adil { white-space: normal; } .cm-skor-buyuk .cm-takim { font-size: 15px; } }
.cm-tablo td { vertical-align: middle; }
.cm-fiyat { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cm-fiyat .dg-fiyat-dugme { font-size: 17px; padding: 4px 12px; }
.cm-adil { font-size: 12.5px; color: var(--sonuk); white-space: nowrap; font-variant-numeric: tabular-nums; }
.cm-adil b { font-size: 13px; }
.cm-iyi { border-color: var(--kazanc, #1a7f37); box-shadow: inset 0 0 0 2px var(--kazanc, #1a7f37); }
.cm-kotu { border-color: var(--kayip); opacity: .75; }
.cm-iki { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 12px; }
.cm-satir-fiyatlar { display: flex; flex-wrap: wrap; gap: 10px 26px; }
/* Beş soru (karar) ve öneri */
.cm-oneri { margin-top: 6px; font-size: 13.5px; display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: baseline; }
.cm-oneri-var { color: var(--kazanc, #1a7f37); }
.cm-oneri-cip { border: 1px solid var(--kazanc, #1a7f37); padding: 1px 8px; border-radius: 4px; white-space: nowrap; }
/* 420 px: "Pas: 3. Tempo ne diyor → …" satırı ve beş soru tablosunun cevapları kırılır, kart başlığındaki
   "model aldı: …" da; yoksa kart 600 px'e, tablo 790 px'e taşıyordu (10 Eylül 2026, sahte maçla görüldü). */
.cm-oneri .dg-kaynak, .cm-karar > header h2 .dg-kaynak { white-space: normal; overflow-wrap: anywhere; }
.cm-karar > header h2 { white-space: normal; min-width: 0; }
.cm-sorular td { padding: 6px 12px; white-space: normal; overflow-wrap: anywhere; }
.cm-soru { white-space: nowrap; font-weight: 600; }
@media (max-width: 620px) {
  .cm-sorular td { padding: 6px 8px; }
  .cm-soru { white-space: normal; }
}
.cm-gecti td:last-child { color: var(--kazanc, #1a7f37); font-weight: 700; }
.cm-kaldi td:last-child { color: var(--kayip); font-weight: 700; }
.cm-kaldi td { color: var(--sonuk); }
.cm-oneriler { display: flex; flex-wrap: wrap; gap: 10px 26px; }
.cm-oneriler .cm-fiyat { flex-direction: column; align-items: flex-start; gap: 4px; }
.cm-oneriler .cm-adil { white-space: normal; }
.oy-adil { font-size: 11.5px; font-weight: 600; white-space: nowrap; font-variant-numeric: tabular-nums; }
/* Model sayfası: özet kutuları, tür rozeti, gerekçe sütunu, gösterge tabloları ve tutma çubuğu. */
.md-ozet { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; }
.md-kutu { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border: 1px solid var(--sonuk); border-radius: 6px; }
.md-kutu > b { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 22px; font-variant-numeric: tabular-nums; }
.md-tur { display: inline-block; font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; padding: 1px 6px; border-radius: 4px; margin-right: 4px; border: 1px solid var(--sonuk); }
.md-tur-alt { border-color: #1f5fbf; color: #1f5fbf; }
.md-tur-ust { border-color: #1a7f37; color: #1a7f37; }
.md-tablo td { vertical-align: middle; }
.md-neden { font-size: 12px; color: var(--sonuk); white-space: normal; min-width: 220px; max-width: 420px; }
.md-bas { margin-top: 18px; }
.md-kovalar { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(700px, 100%), 1fr)); gap: 12px; align-items: start; }
.md-kova { min-width: 0; }
.md-kova .tablo-sar { margin-top: 0; overflow-x: visible; }
.md-kova table { table-layout: fixed; width: 100%; }
.md-kova th, .md-kova td { white-space: normal; overflow-wrap: anywhere; }
@media (max-width: 720px) { .md-kova th, .md-kova td { padding: 6px 5px; font-size: 12px; } }
.md-aciklama { white-space: normal; margin: 0; }
/* Çapraz tablo (11 Eylül 2026): kenar toplamı sütunu/satırı ayrık, 3'ten az bahisli hücre soluk. */
.md-capraz td, .md-capraz th { font-variant-numeric: tabular-nums; }
.md-capraz td.md-capraz-kenar, .md-capraz tr.md-capraz-kenar td { border-left: 1px solid var(--sonuk); background: var(--yuzey, transparent); }
.md-capraz tr.md-capraz-kenar td { border-left: 0; border-top: 1px solid var(--sonuk); }
.md-capraz td.md-capraz-kenar { border-top: 0; }
.md-capraz-az { color: var(--sonuk); font-weight: 400; }
.md-capraz-form { display: flex; flex-wrap: wrap; gap: 8px 20px; align-items: center; }
/* Model — kasalar (lig grupları) seçici ve sonuçlananlar sayfalaması (12 Eylül 2026) */
.md-kasalar tbody tr { cursor: pointer; }
/* Tıklanabilir başlıklar (13 Eylül 2026): sıralama sunucuda, başlık htmx ile istek atar. */
.md-sirala { cursor: pointer; user-select: none; white-space: nowrap; }
.md-sirala:hover { background: color-mix(in srgb, var(--sari) 22%, transparent); }
.md-sirala:focus-visible { outline: 2px solid var(--murekkep); outline-offset: -2px; }
.md-sirala.etkin { background: color-mix(in srgb, var(--sari) 14%, transparent); }
.md-sira-ok { font-size: 9px; vertical-align: 1px; opacity: .75; }
.md-kasalar td:first-child { overflow-wrap: normal; word-break: keep-all; }   /* "Şampiyonlar Ligi alt_v1" kelime ortasından bölünmesin */
.md-kasalar tbody tr:hover td { background: color-mix(in srgb, var(--sari) 18%, transparent); }
.md-kasalar tbody tr.secili td { background: color-mix(in srgb, var(--sari) 32%, transparent); font-weight: 600; }
.md-kasalar tbody tr:focus-visible { outline: 2px solid var(--murekkep); outline-offset: -2px; }
.md-sayfa { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.md-sayfa .md-sayfa-no { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 12px; color: var(--sonuk); }
.md-sayfa button[disabled] { opacity: .4; cursor: default; }
/* Model — sağa kaydırma yok (kullanıcı 12 Eylül gece): sabit sütun düzeni, hücreler sarar; dar ekranda ikincil sütunlar gizlenir */
.md-sabit { overflow-x: visible; }
.md-sabit table { table-layout: fixed; width: 100%; }
.md-sabit th, .md-sabit td { white-space: normal; overflow-wrap: anywhere; padding: 8px 8px; vertical-align: top; }
.md-sabit .md-neden { min-width: 0; max-width: none; font-size: 11.5px; line-height: 1.35; }
.md-sabit .say { text-align: right; white-space: nowrap; }         /* sayılar ve sonuç kırılmaz; sütun genişliği colgroup'ta */
.md-sabit .md-tur { white-space: nowrap; }
.md-sabit .md-kasa-pay { display: block; white-space: normal; font-size: 10.5px; line-height: 1.3; }
.md-kasa-kurallar { display: flex; flex-direction: column; gap: 6px; }
.md-kasa-etiket { display: inline-block; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 10px; letter-spacing: .04em; text-transform: uppercase; padding: 1px 6px; border: 1px solid var(--murekkep); border-radius: 3px; vertical-align: middle; }
.md-kasa-etiket.md-kasa-pl { background: var(--sari); color: #000; border-color: var(--sari); }
.md-kasa-etiket.md-kasa-sl { background: var(--murekkep); color: var(--kagit); }
/* Kasa artık lig × tür (13 Eylül 2026). Kullanıcı aynı gün: "alt_v1 ve üst_v1 fark edilir ve
   dikkat çekici değil, ona renk ve işaret ekle" — tür artık ayrı bir rozet: ok + ALT/ÜST + sürüm.
   Renkler md-tur ile AYNI (Alt mavi, Üst yeşil) ki sayfadaki iki gösterim tek dil konuşsun.
   Ok yönü anlamı taşır: ▼ az gol, ▲ çok gol — renk körlüğünde de ayırt edilir. */
.md-kasa-etiket { text-transform: none; letter-spacing: .02em; border: 0; padding: 0; }
.kasa-lig { white-space: normal; }
.kasa-tur { display: inline-block; margin-left: 5px; padding: 0 5px; border: 1px solid currentColor;
            border-radius: 4px; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 10px;
            font-weight: 700; letter-spacing: .06em; white-space: nowrap; vertical-align: 1px; }
.kasa-tur-alt { color: #1f5fbf; }
.kasa-tur-ust { color: #1a7f37; }
.kasa-tur-diger { color: var(--sonuk); }
.kasa-surum { margin-left: 4px; opacity: .6; font-weight: 400; letter-spacing: 0; }
.md-kasalar tbody tr.secili .kasa-tur { border-width: 2px; }
.md-kasa-kural summary { cursor: pointer; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 12px; }
.md-kural-liste { margin: 6px 0 4px 18px; padding: 0; font-size: 12.5px; line-height: 1.45; }
.md-kural-liste li { margin: 2px 0; }
@media (max-width: 720px) {
  /* dar ekranda oynama tablosu KART düzeni: her satır bir kutu, hücreler ızgara; başlık satırı ve ikincil sütunlar gizli */
  .md-biten thead, .md-biten colgroup { display: none; }
  .md-biten tbody tr { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2px 8px; padding: 8px 0; border-bottom: var(--cizgi, 1px) solid var(--cizgi-renk, var(--murekkep)); }
  .md-biten tbody td { display: block; border: 0; padding: 1px 0; text-align: left; }
  .md-biten tbody td:nth-child(1) { grid-column: 1 / -1; }
  .md-biten tbody td:nth-child(4) { grid-column: span 2; }
  .md-biten tbody td.md-neden { grid-column: 1 / -1; }
  .md-biten th:nth-child(6), .md-biten td:nth-child(6), .md-biten th:nth-child(7), .md-biten td:nth-child(7),
  .md-biten th:nth-child(8), .md-biten td:nth-child(8) { display: none; }
  /* Kasalar dar ekranda: colgroup GİZLENİR (13 Eylül 2026) — sabit genişlikli tabloda sütun gizleyince
     colgroup genişlikleri bir sola kayıp başlıkları üst üste bindiriyordu (md-kiyas'taki aynı hata).
     Kasa adları lig × tür olunca uzadığı için taban/sonuçlanan/tutan/ROI sütunları da kalkar;
     geriye kasa adı, oynama, düz kâr ve kasa kalır. */
  .md-kasalar colgroup { display: none; }
  .md-kasalar table, .md-sabit .md-kasalar { table-layout: auto; }
  .md-kasalar th:nth-child(2), .md-kasalar td:nth-child(2), .md-kasalar th:nth-child(4), .md-kasalar td:nth-child(4),
  .md-kasalar th:nth-child(5), .md-kasalar td:nth-child(5), .md-kasalar th:nth-child(7), .md-kasalar td:nth-child(7),
  .md-kasalar th:nth-child(9), .md-kasalar td:nth-child(9), .md-kasalar th:nth-child(10), .md-kasalar td:nth-child(10) { display: none; }
  /* Hangi sütuna göre sıralanmışsa O SÜTUN dar ekranda da görünür (13 Eylül 2026): gizli bir sütuna
     göre sıralayınca satırlar sebepsiz karışmış gibi duruyordu. data-sira sunucudan gelir. */
  .md-kasalar[data-sira="taban"] th:nth-child(2), .md-kasalar[data-sira="taban"] td:nth-child(2),
  .md-kasalar[data-sira="sonuclanan"] th:nth-child(4), .md-kasalar[data-sira="sonuclanan"] td:nth-child(4),
  .md-kasalar[data-sira="tutma"] th:nth-child(5), .md-kasalar[data-sira="tutma"] td:nth-child(5),
  .md-kasalar[data-sira="duz_roi"] th:nth-child(7), .md-kasalar[data-sira="duz_roi"] td:nth-child(7),
  .md-kasalar[data-sira="buyume"] th:nth-child(9), .md-kasalar[data-sira="buyume"] td:nth-child(9),
  .md-kasalar[data-sira="roi"] th:nth-child(10), .md-kasalar[data-sira="roi"] td:nth-child(10) { display: table-cell; }
  /* Kural — çizgi seçimi kıyası da KART düzeni (kullanıcı 12 Eylül: "mobilde kayıyor"): sütun gizlemek colgroup genişliklerini
     bir sola kaydırıyordu ("Oynanan" 38 px'e sıkışıp harf harf sarıyordu). Satır: maç · an | oynanan | sonuç | kâr · komşu | sonuç | kâr */
  .md-kiyas thead, .md-kiyas colgroup { display: none; }
  .md-kiyas tbody tr { display: grid; grid-template-columns: 1fr 1.7fr 1fr .8fr; gap: 2px 8px; padding: 8px 0; border-bottom: var(--cizgi, 1px) solid var(--cizgi-renk, var(--murekkep)); }
  .md-kiyas tbody td { display: block; border: 0; padding: 1px 0; text-align: left; }
  .md-kiyas tbody td:nth-child(1) { grid-column: 1 / -1; }
  .md-kiyas tbody td:nth-child(6) { grid-column: 1 / span 2; }
  .md-kiyas tbody td:nth-child(6)::before { content: "komşu "; font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--sonuk); }
  .md-sabit th, .md-sabit td { padding: 6px 5px; font-size: 12px; }
}
.md-capraz-sec { display: inline-flex; gap: 8px; align-items: center; white-space: nowrap; }
.md-capraz-sec select, .md-capraz-sec input { font: inherit; padding: 2px 6px; background: var(--yuzey, transparent); color: var(--murekkep); border: 1px solid var(--sonuk); }
.md-capraz-sec input[type=number] { width: 4.5em; }
.md-suzgec-ozet { margin: 8px 0 0; font-variant-numeric: tabular-nums; }
/* Bütün eşikleri tara (21 Eylül 2026): sonuç tablosu ve "zemini geçen" satır işareti. */
.kr-tarama-durum { margin: 0 0 10px; font-variant-numeric: tabular-nums; }
.kr-tarama-tablo td { font-variant-numeric: tabular-nums; }
.kr-tarama-tablo tr.kr-gecti td { background: color-mix(in srgb, var(--kazanc) 12%, transparent); }
.kr-tarama-tablo tr.kr-gecti td:first-child { box-shadow: inset 3px 0 0 var(--kazanc); }
/* "Temizle" yalnız süzgeç DOLUYKEN (DENETIM.md B-42): form hx-preserve'lü olduğu için sunucunun
   koşullu işaretlemesi DOM'a girmiyor — koşulu CSS soruyor, canlı değerlere bakarak. `boy`
   (sayfa boyu) süzgeç sayılmaz; sayı alanlarının hepsinde placeholder var, doluysa gösterilmez. */
.md-suzgec-temizle { display: none; }
#md-suzgec-form:has(select:not([name="boy"]) option:checked:not([value=""])) .md-suzgec-temizle,
#md-suzgec-form:has(input:not(:placeholder-shown)) .md-suzgec-temizle { display: inline-block; }
.md-cubuk-hucre { min-width: 180px; }
.md-cubuk { position: relative; display: inline-block; width: 120px; height: 12px; border: 1px solid var(--sonuk); border-radius: 3px; vertical-align: middle; overflow: hidden; background: var(--yuzey, transparent); }
.md-cubuk-dolu { position: absolute; left: 0; top: 0; bottom: 0; background: var(--kazanc, #1a7f37); opacity: .75; }
.md-cubuk-bek { position: absolute; top: -2px; bottom: -2px; width: 2px; background: var(--murekkep); }
.md-cubuk-yazi { font-size: 12.5px; margin-left: 6px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.md-kural-form { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.md-kural-form label { display: flex; gap: 8px; align-items: baseline; }
.dg-tikla { cursor: pointer; }
.dg-tikla:hover td { background: var(--beton, rgba(0,0,0,.04)); }
.oy-olcumler { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(360px, 100%), 1fr)); gap: 8px 18px; align-items: start; }
.oy-olcumler .tablo-sar { margin-top: 0; }
.dg-aciklama-kucuk { margin: 2px 0 10px; white-space: normal; }
.cm-model-rozet { font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; border: 1px solid var(--murekkep); padding: 0 5px; }
.cm-etiketli { display: inline-flex; flex-direction: column; gap: 4px; }
/* Maç oranları sayfası (/fikstur/{id}): geniş görünüm — ana marketler büyük çip kartları,
   çizgili marketler tam genişlik tablo. Yeni bahis panelinin sıkışık kutularının aksine
   her oran 20px, her çizgi kendi satırında, hiçbir çizgi gizli değil. */
.mo-amblem { width: 28px; height: 28px; object-fit: contain; vertical-align: -5px; margin: 0 8px; }
.mo-kaynak { margin: 4px 0 10px; display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.mo-bolum { margin-bottom: 18px; }
.mo-bolum-ad { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 12px; letter-spacing: .14em;
               text-transform: uppercase; color: var(--sonuk); margin: 14px 0 8px; }
.mo-kartlar { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; margin-bottom: 12px; }
.mo-kart { min-width: 0; }
.mo-kart header h3, .mo-tablo-kart header h3 { font-size: 15px; margin: 0; }
.mo-cipler { display: flex; flex-wrap: wrap; gap: 8px; padding: 12px 14px; }
.mo-cip { display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
          min-width: 88px; padding: 8px 12px; border: 1px solid var(--sonuk); border-radius: 6px; background: var(--yuzey, transparent); }
.mo-secim { font-size: 12.5px; color: var(--sonuk); white-space: nowrap; }
.mo-oran { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 20px; font-weight: 700; font-variant-numeric: tabular-nums; }
.mo-favori { border-color: var(--murekkep); }
.mo-tablolar { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(440px, 100%), 1fr)); gap: 12px; align-items: start; }
.mo-tablo-kart { min-width: 0; margin: 0; }
.mo-tablo-kart.mo-genis { grid-column: 1 / -1; }      /* 3+ sütunlu market (MS + Alt/Üst, handikap) tam genişlik */
.mo-tablo { table-layout: auto; }
.mo-tablo td:first-child { width: 1%; }
.mo-tablo td, .mo-tablo th { padding: 8px 12px; }
.mo-tablo .mo-cip { min-width: 96px; padding: 6px 10px; }
.mo-tablo .mo-secim { display: none; }
/* Çizgi okunurluğu (kullanıcı: "baremleri ayırt etmek zor"): çizgi koyu rozet, satırlar zebra,
   Üst çipi yeşil / Alt çipi mavi tonlu, sütun grupları (1 | 1X | X2 | 2) çizgiyle ayrılır. */
.mo-cizgi-rozet { display: inline-block; min-width: 3.2em; text-align: center; padding: 4px 8px; border-radius: 6px;
                  background: var(--bant, var(--murekkep)); color: var(--bant-yazi, var(--kagit, #fff)); font-family: "JetBrains Mono", ui-monospace, monospace;
                  font-size: 17px; font-weight: 700; white-space: nowrap; }
.mo-tablo tbody tr:nth-child(even) td { background: var(--beton, rgba(0,0,0,.04)); }
.mo-tablo tbody tr:nth-child(odd) td { background: transparent; }
.mo-ana td, .mo-tablo tbody tr.mo-ana:nth-child(even) td { background: rgba(255, 214, 0, .18); }
.mo-ana .mo-cizgi-rozet { outline: 3px solid rgba(255, 214, 0, .9); }
.mo-cip.mo-ust { border-color: #1a7f37; background: rgba(26, 127, 55, .10); }
.mo-cip.mo-alt { border-color: #1f5fbf; background: rgba(31, 95, 191, .10); }
.mo-th-ust { color: #1a7f37; }
.mo-th-alt { color: #1f5fbf; }
.mo-grup-bas th { font-size: 13px; letter-spacing: 0; text-transform: none; text-align: center; border-bottom: 0; padding-bottom: 2px; }
.mo-grup { border-left: 2px solid var(--murekkep); }
.mo-gruplu td.mo-grup-ilk, .mo-gruplu th.mo-grup-ilk { border-left: 2px solid var(--murekkep); }
.mo-gruplu td { padding: 6px 8px; }
.mo-gruplu .mo-cip { min-width: 74px; }
/* Koyu tema (12 Eylül gece): #1f5fbf mavi ve #1a7f37 yeşil siyahta sönük — açık tonları; seçili kasa satırı sarıyla karışıp
   zeytin oluyordu → yüzey zemin + sol sarı çubuk. İki bağlam: sistem koyu (açık zorlanmadıysa) ve elle koyu. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .mo-cip.mo-ust { background: rgba(26, 127, 55, .28); }
  :root:not([data-theme="light"]) .mo-cip.mo-alt { background: rgba(31, 95, 191, .30); }
  :root:not([data-theme="light"]) .md-tur-alt, :root:not([data-theme="light"]) .mo-th-alt { color: #7FB0FF; border-color: #7FB0FF; }
  :root:not([data-theme="light"]) .kasa-tur-alt { color: #7FB0FF; }
  :root:not([data-theme="light"]) .kasa-tur-ust { color: #3DD673; }
  :root:not([data-theme="light"]) .mo-cip.mo-alt { border-color: #7FB0FF; }
  :root:not([data-theme="light"]) .md-tur-ust, :root:not([data-theme="light"]) .mo-th-ust { color: #3DD673; border-color: #3DD673; }
  :root:not([data-theme="light"]) .mo-cip.mo-ust { border-color: #3DD673; }
  :root:not([data-theme="light"]) .md-kasalar tbody tr.secili td { background: var(--yuzey); }
  :root:not([data-theme="light"]) .md-kasalar tbody tr.secili td:first-child { box-shadow: inset 5px 0 0 var(--sari); }
  :root:not([data-theme="light"]) .mo-ana td, :root:not([data-theme="light"]) .mo-tablo tbody tr.mo-ana:nth-child(even) td { background: rgba(255, 214, 0, .14); }
}
:root[data-theme="dark"] .mo-cip.mo-ust { background: rgba(26, 127, 55, .28); border-color: #3DD673; }
:root[data-theme="dark"] .mo-cip.mo-alt { background: rgba(31, 95, 191, .30); border-color: #7FB0FF; }
:root[data-theme="dark"] .md-tur-alt, :root[data-theme="dark"] .mo-th-alt { color: #7FB0FF; border-color: #7FB0FF; }
:root[data-theme="dark"] .kasa-tur-alt { color: #7FB0FF; }
:root[data-theme="dark"] .kasa-tur-ust { color: #3DD673; }
:root[data-theme="dark"] .md-tur-ust, :root[data-theme="dark"] .mo-th-ust { color: #3DD673; border-color: #3DD673; }
:root[data-theme="dark"] .md-kasalar tbody tr.secili td { background: var(--yuzey); }
:root[data-theme="dark"] .md-kasalar tbody tr.secili td:first-child { box-shadow: inset 5px 0 0 var(--sari); }
@media (max-width: 640px) {
  .mo-kartlar { grid-template-columns: 1fr; }
  .mo-oran { font-size: 18px; }
  .mo-cip { min-width: 72px; padding: 6px 8px; }
  .mo-tablo td, .mo-tablo th { padding: 6px 6px; }
}
/* Gol dökümü: gol başına kart, içinde görüntü anları (+0/60/120/300 sn) ve çizgi çipleri. */
.gd-isaret > header h2 { color: var(--kazanc, #1a7f37); }
.gd-yildiz { color: var(--kazanc, #1a7f37); }
.gd-gol .aciklama { white-space: normal; }
.gd-anlar { display: flex; flex-direction: column; gap: 10px; }
.gd-an { display: grid; grid-template-columns: 5.5em minmax(0, 1fr); gap: 6px 12px; align-items: start;
         padding-top: 8px; border-top: var(--cizgi, 1px) solid var(--cizgi-renk, var(--murekkep)); }
.gd-an:first-child { border-top: 0; padding-top: 0; }
.gd-an-etiket { display: flex; flex-direction: column; gap: 2px; font-variant-numeric: tabular-nums; }
.gd-gruplar { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.gd-grup { display: grid; grid-template-columns: 9em minmax(0, 1fr); gap: 4px 10px; align-items: start; }
.gd-grup .etiket { padding-top: 6px; overflow-wrap: anywhere; }
.gd-grup .cm-goller { gap: 6px 10px; }
.gd-grup .cm-fiyat { gap: 5px; }
.gd-grup .dg-fiyat-dugme b { margin-right: 4px; }
@media (max-width: 640px) {
  .gd-an { grid-template-columns: 1fr; }
  .gd-an-etiket { flex-direction: row; gap: 10px; align-items: baseline; }
  .gd-grup { grid-template-columns: 1fr; }
  .gd-grup .etiket { padding-top: 0; }
}
/* Teletext'in altındaki fikstür (9 Eylül 2026) ve maç sayfasındaki geniş oranlar. */
.tt .tt-lig { padding: 0 8px; margin: 10px 0 2px; font-weight: 700; }
.tt .tt-mac.tt-fx { grid-template-columns: 11ch minmax(0, 1fr) 7ch minmax(0, 1fr) 17ch; }   /* "CMT 12.09 17:00" tek satır */
/* Dar ekranda (11 Eylül 2026): 11ch boşluk + 17ch durum takım adını 4 harfe indiriyordu. Sol boşluk
   sıfır, gün adı (.tt-gun) gizli → "12.09 17:00" / "BİTTİ 22:15" 11ch'e sığar. */
@media (max-width: 620px) {
  .tt .tt-mac.tt-fx { grid-template-columns: 0 minmax(0, 1fr) 6ch minmax(0, 1fr) 11ch; }
  .tt .tt-mac.tt-fx .tt-gun { display: none; }
}
.tt .tt-fx-suzgec { display: flex; flex-wrap: wrap; gap: 6px 18px; align-items: center; padding: 4px 8px 6px; }
.tt .tt-fx-suzgec label { display: inline-flex; gap: 8px; align-items: center; }
.tt .tt-fx-suzgec select { font: inherit; background: #000; color: #ff0; border: 1px solid #ff0; padding: 1px 4px; }
.tt .tt-fx-sec { color: #fff; text-decoration: none; padding: 0 5px; border: 1px solid #555; }
.tt .tt-fx-sec:hover { border-color: #ff0; color: #ff0; }
.tt .tt-fx-sec[aria-current="true"] { background: #ff0; color: #000; border-color: #ff0; font-weight: 700; }
/* ORANLAR kutusu (teletext maç sayfası) — bahis sitesi düzeni, koyu zemin. Kutu kendi içinde kayar.
   .ob-hucre: solda seçim adı gri, sağda oran sarı ve büyük. Çizgili satırda başta çizgi rozeti.
   Ana çizgi sol şeritli. Sekmeler üstte. 9 Eylül 2026, üçüncü tasarım. */
.tt .tt-oranlar-genis { background: #111; color: #eee; padding: 10px 12px; margin: 0 0 10px; border-radius: 6px;
                        max-height: 72vh; overflow-y: auto; overscroll-behavior: contain;
                        font-family: "Inter", system-ui, sans-serif; font-size: 14px; }
.ob-ust { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; margin-bottom: 8px; }
.ob-kaynaklar { display: inline-flex; gap: 4px; }
.ob-dugme { font: inherit; font-size: 12.5px; font-weight: 600; padding: 4px 12px; border: 1px solid #444; border-radius: 4px;
            background: #1c1c1c; color: #ddd; cursor: pointer; }
.ob-dugme:hover { border-color: #ffd400; color: #ffd400; }
.ob-dugme[aria-current="true"] { background: #ffd400; color: #111; border-color: #ffd400; }
.ob-not { font-size: 12px; color: #999; }
.ob-sekmeler { display: flex; flex-wrap: wrap; gap: 2px; border-bottom: 2px solid #333; margin: 4px 0 10px; position: sticky; top: -10px; background: #111; z-index: 2; padding-top: 4px; }
.ob-sekme { font: inherit; font-size: 13.5px; font-weight: 600; padding: 7px 14px; border: 0; border-bottom: 3px solid transparent;
            background: transparent; color: #aaa; cursor: pointer; margin-bottom: -2px; }
.ob-sekme:hover { color: #fff; }
.ob-sekme[aria-current="true"] { color: #ffd400; border-bottom-color: #ffd400; }
.ob-adet { font-size: 11px; color: #777; font-weight: 500; margin-left: 4px; }
.ob-bolum { font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: #8ab4ff; margin: 12px 2px 6px; }
/* Kartlar sütun akışında (masonry): kısa kartın altında boşluk kalmaz, uzun Üst/Alt yanında ötekiler dizilir. */
.ob-kartlar { columns: 3 300px; column-gap: 10px; }
.ob-kart { background: #1b1b1b; border: 1px solid #2a2a2a; border-radius: 6px; overflow: hidden; min-width: 0;
           break-inside: avoid; margin-bottom: 10px; }
.ob-kart.ob-cizgili:has(.ob-genis) { column-span: all; }
.ob-kart-bas { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; padding: 8px 12px; background: #242424;
               font-weight: 700; font-size: 14px; color: #fff; }
.ob-hucreler { display: grid; gap: 6px; padding: 8px; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); }
.ob-hucreler.ob-n2 { grid-template-columns: 1fr 1fr; }
.ob-hucreler.ob-n3 { grid-template-columns: 1fr 1fr 1fr; }
.ob-hucre { display: flex; justify-content: space-between; align-items: center; gap: 8px; min-width: 0; padding: 7px 10px;
            background: #262626; border: 1px solid #333; border-radius: 4px; }
.ob-hucre:hover { border-color: #ffd400; }
.ob-hucre.ob-bos { justify-content: center; color: #555; }
.ob-ad { font-size: 13px; color: #cfcfcf; min-width: 0; overflow-wrap: anywhere; }
.ob-oran { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 17px; font-weight: 700; color: #ffd400;
           font-variant-numeric: tabular-nums; white-space: nowrap; }
.ob-satirlar { padding: 6px 8px 8px; display: flex; flex-direction: column; gap: 4px; }
.ob-satir { display: grid; grid-template-columns: 3.4em repeat(var(--sutun, 2), minmax(0, 1fr)); gap: 6px; align-items: center; }
.ob-satir.ob-ana { box-shadow: -4px 0 0 #ffd400; border-radius: 2px; }
.ob-satir.ob-ana .ob-cizgi { color: #ffd400; }
.ob-cizgi { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 15px; font-weight: 700; color: #ddd; text-align: center;
            padding: 6px 0; }
.ob-satir.ob-baslik { grid-template-columns: 3.4em repeat(var(--sutun, 2), minmax(0, 1fr)); }
.ob-baslik .ob-sutun-ad { font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: #8a8a8a; text-align: center; }
.ob-genis .ob-hucre { justify-content: center; padding: 6px 4px; }
.ob-genis .ob-hucre .ob-ad { display: none; }
.ob-genis { overflow-x: auto; }
.ob-genis .ob-satir { min-width: 640px; }
.ob-oyuncu .ob-hucreler { grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); }
.ob-oyuncu .ob-kart { grid-column: 1 / -1; }
@media (max-width: 640px) {
  .ob-hucreler.ob-n3 { grid-template-columns: 1fr 1fr 1fr; }
  .ob-oran { font-size: 16px; }
  .ob-satir { grid-template-columns: 2.8em repeat(var(--sutun, 2), minmax(0, 1fr)); }
}
/* Fikstür sayfası: lig lig <details>; satır ızgara, takım adı sarar, sayfa yatay kaymaz. */
.fx-suzgec-form { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: flex-end; padding: 10px 14px; }
.fx-suzgec-form label { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.fx-suzgec-form select, .fx-suzgec-form input { max-width: 100%; }
.fx-liste { padding: 0 6px 6px; }
.fx-mac { border-top: var(--cizgi, 1px) solid var(--cizgi-renk, var(--murekkep)); }
.fx-mac:first-child { border-top: 0; }
.fx-satir { display: grid; grid-template-columns: 6.5em minmax(0, 1fr) auto minmax(0, 1fr) auto; gap: 4px 10px;
            align-items: center; padding: 9px 8px; cursor: pointer; list-style: none; min-width: 0; }
.fx-satir::-webkit-details-marker { display: none; }
.fx-satir:hover { background: var(--beton, rgba(0,0,0,.04)); }
.fx-mac[open] > .fx-satir { background: var(--beton, rgba(0,0,0,.04)); font-weight: 600; }
.fx-zaman { font-size: 12.5px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.fx-zaman .minik { margin-right: 3px; }
.fx-dk { color: var(--kazanc, #1a7f37); }
.fx-takim { min-width: 0; overflow-wrap: anywhere; display: flex; align-items: center; gap: 6px; }
.fx-ev { justify-content: flex-end; text-align: right; }
.fx-amblem { width: 18px; height: 18px; object-fit: contain; flex: none; }
.fx-skor { font-family: "JetBrains Mono", ui-monospace, monospace; font-variant-numeric: tabular-nums; white-space: nowrap; min-width: 2.5em; text-align: center; }
.fx-canli .fx-skor b { color: var(--kazanc, #1a7f37); }
.fx-bilgi { font-size: 11.5px; text-decoration: none; border: 1px solid var(--sonuk); padding: 1px 6px; color: inherit; white-space: nowrap; }
.fx-panel-kutu { padding: 0 8px 10px; }
.fx-arac { display: flex; gap: 8px; flex-wrap: wrap; padding: 4px 0 8px; }
.fx-panel { max-height: 640px; }
@media (max-width: 640px) {
  .fx-satir { grid-template-columns: 5em minmax(0, 1fr) auto minmax(0, 1fr); }
  .fx-bilgi { grid-column: 1; grid-row: 2; justify-self: start; }
  .fx-zaman .minik { display: none; }
}
/* Gol dökümünde her fiyat bir düğme: tıklayınca "oynadım" kaydı (canli_oynama). */
.dg-fiyatlar { display: flex; flex-wrap: wrap; gap: 4px 6px; align-items: center; }
.dg-fiyatlar .dg-miktar { width: 3.5em; font-size: 13px; margin-right: 4px; }
.dg-fiyat-dugme { font: inherit; font-size: 14px; padding: 2px 8px; border: 1px solid var(--sonuk); background: var(--yuzey, transparent);
  color: inherit; cursor: pointer; border-radius: 4px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.dg-fiyat-dugme b { font-weight: 600; color: var(--sonuk); margin-right: 3px; }
.dg-fiyat-dugme .dg-fiyat { font-weight: 700; }
.dg-fiyat-dugme:hover { border-color: var(--murekkep); }
.dg-fiyat-dugme.dg-oynandi { border-color: var(--kazanc, #1a7f37); box-shadow: inset 0 0 0 1px var(--kazanc, #1a7f37); }
.dg-sil { font: inherit; font-size: 12px; padding: 1px 6px; border: 1px solid var(--sonuk); background: transparent; color: inherit; cursor: pointer; }
.dg-arti { color: var(--kazanc, #1a7f37); font-weight: 600; }
.dg-eksi { color: var(--kayip); }
/* Üçüncü hâl: iade — kasa seyri noktalarıyla aynı renk sözlüğü (bkz. svg.kg .kg-nokta.kg-iade). */
.dg-iade { color: var(--iade, #E8A000); font-weight: 600; }
.dg-yok { opacity: .55; }
.dg-mac { min-width: 180px; }
.deger-tablo td.say { line-height: 1.35; }
tr.dg-value .dg-mac b::before { content: "★ "; color: var(--kazanc, #1a7f37); }
.dg-detay td { background: var(--yuzey, transparent); padding: 8px 12px 12px; }
.dg-detay-bas { display: flex; gap: 12px; align-items: center; margin-bottom: 6px; }
.dg-detay-bas .dugme { margin-left: auto; }
.dg-tum { font-size: 12.5px; }
.dg-secenek { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.dg-secenek a { padding: 2px 8px; border: 1px solid var(--sonuk); text-decoration: none; color: inherit; }
.dg-secenek a[aria-current="true"] { background: var(--murekkep); color: var(--kagit); border-color: var(--murekkep); }
.dg-secenek .etiket { margin-left: 8px; }
.market-secim {
  display: flex; flex-direction: column; align-items: center; min-width: 64px;
  font: inherit; font-size: 11.5px; line-height: 1.25; cursor: pointer;
  border: var(--cizgi, 1px) solid var(--sonuk); background: var(--yuzey, transparent); color: inherit;
  padding: 5px 9px;
}
.market-secim:hover { border-color: var(--murekkep); background: var(--beton); }
.market-secim[aria-pressed="true"] { background: var(--murekkep); color: var(--yuzey, #fff); border-color: var(--murekkep); }
.market-secim .oran { font-family: "JetBrains Mono", ui-monospace, monospace; font-weight: 700; font-size: 13px; }
.market-secim[hidden] { display: none; }
/* Geçmiş maç: formda oranın solundaki "Canlı" kutucuğu (yalnız bitmiş maçta görünür). */
.gecmis-canli { cursor: pointer; }
.gecmis-canli[hidden] { display: none; }   /* temanın .alan display'i hidden'ı ezmesin */
.gecmis-canli-kutu { display: inline-flex; align-items: center; gap: 6px; min-height: 34px; }
.gecmis-canli input { width: 18px; height: 18px; margin: 0; }
.gecmis-canli:has(input:not(:checked)) .rozet { opacity: .45; }
/* Geçmiş maç şablonu: oransız kutular daha alçak; "başka çizgi" satırı. */
.market-secim.oransiz { min-width: 56px; padding: 6px 8px; }
.cizgi-ozel { display: flex; gap: 6px; align-items: center; margin-top: 6px; flex-wrap: wrap; }
.cizgi-ozel input { width: 9ch; font: inherit; font-size: 12px; padding: 4px 6px; border: 1px solid var(--sonuk); background: var(--yuzey, #fff); color: inherit; }
.cizgi-ozel select { font: inherit; font-size: 12px; padding: 4px 6px; border: 1px solid var(--sonuk); background: var(--yuzey, #fff); color: inherit; max-width: 22ch; }
/* Canlıda oran değişince kısa bir yanıp sönme: yeşil arttı, kırmızı düştü. */
.market-secim.oran-artti { box-shadow: inset 0 0 0 2px var(--kazanc); }
.market-secim.oran-dustu { box-shadow: inset 0 0 0 2px var(--kayip); }
.market-panel { display: none; }
/* Çizgili market: her çizgi kendi satırında, solda çizgi etiketi. */
.market-cizgiler { display: flex; flex-direction: column; gap: 4px; }
.market-cizgi { display: grid; grid-template-columns: 4ch 1fr; gap: 8px; align-items: center; }
.market-cizgi[hidden] { display: none; }
.market-cizgi .cizgi-etiket { font-family: "JetBrains Mono", ui-monospace, monospace;
                              font-size: 12px; font-weight: 700; text-align: right; color: var(--sonuk); }
.market-satir.tablolu { align-items: start; }
.market-cizgiler .market-genislet { align-self: flex-start; margin: 2px 0 0 calc(4ch + 8px); }
.market-genislet {
  align-self: center; font: inherit; font-size: 11px; cursor: pointer;
  background: none; border: var(--cizgi, 1px) dashed var(--sonuk); color: var(--sonuk); padding: 4px 8px;
}
.market-genislet:hover { color: var(--murekkep); border-color: var(--murekkep); }

/* İskelet: oranlar yoldayken market satırlarının gölgesi. */
.iskelet { padding: 10px 0; }
.iskelet-bas, .iskelet-ad, .iskelet-kutu {
  background: var(--beton); border-radius: 2px;
  animation: iskelet-nefes 1.1s ease-in-out infinite;
}
.iskelet-bas { height: 18px; width: 40%; margin: 4px 0 12px; }
.iskelet-satir { display: grid; grid-template-columns: 170px 1fr; gap: 12px; align-items: center; padding: 7px 0; }
.iskelet-ad { height: 12px; width: 70%; }
.iskelet-kutular { display: flex; gap: 5px; flex-wrap: wrap; }
.iskelet-kutu { width: 64px; height: 34px; }
@keyframes iskelet-nefes { 0%, 100% { opacity: .45; } 50% { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .iskelet-bas, .iskelet-ad, .iskelet-kutu { animation: none; } }

/* CANLI rozeti: kırmızı yazı, kırmızı çerçeve, açık zemin — bir uyarı.
   ZEMİN TEMAYLA DÖNMELİ (B-53 ile aynı kalıp, 21 Eylül 2026 — kontrast tarayıcısı yakaladı):
   zemin SABİT beyazken --kayip koyu modda açık kırmızıya (#FF5F52) dönüyor ve 10 px yazı
   beyaz üstünde kalıyordu, ölçülen kontrast 3,00 (eşik 4,5). `--yuzey` her temada üç blokta
   da tanımlı: açıkta beyaz (görünüm aynı), koyuda koyu yüzey. */
.rozet.canli-rozet { background: var(--yuzey, #fff); color: var(--kayip); border: 2px solid var(--kayip);
                     font-weight: 700; }
/* Oranların kaynağı (1xBet / Nesine): sessiz, çerçeveli. */
.rozet.kaynak-rozet { background: none; color: var(--sonuk); border: 1px solid var(--sonuk);
                      font-weight: 600; letter-spacing: .02em; }
/* Yönetim → Hareketler (yalnız sahip). */
.hareket-suzgec { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.hareket-suzgec select, .hareket-suzgec input[type="date"] { flex: 0 0 auto; width: auto; }
.hareket-tablo td { vertical-align: top; }
.hareket-tablo .minik { font-size: 12px; color: var(--sonuk); white-space: nowrap; }
.hareket-tablo td:nth-child(5) { white-space: normal; max-width: 34ch; }
.hareket-eylem { font-weight: 600; }
/* Ayarlar → Oranlar ve maçlar: hangi veri nereden geliyor. */
.kaynak-tablo { border-collapse: collapse; margin-top: 10px; font-size: 13px; width: 100%; }
.kaynak-tablo th { text-align: left; font-weight: 600; padding: 4px 10px 4px 0; white-space: nowrap;
                   vertical-align: top; color: var(--sonuk); }
.kaynak-tablo td { padding: 4px 0; }
@media (max-width: 620px) {
  .market-satir { grid-template-columns: 1fr; gap: 4px; }
  .market-ad { padding-top: 0; }
}

/* ---------- kupon fişi (sol altta — bildirimler sağ altta) ---------- */
.kupon-fis {
  position: fixed; left: 16px; bottom: 16px; z-index: 40; width: min(380px, calc(100vw - 32px));
  background: var(--yuzey, #fff); color: var(--murekkep);
  border: var(--kalin, 2px) solid var(--murekkep); box-shadow: 0 6px 24px rgba(0,0,0,.18);
}
.kupon-bas {
  width: 100%; text-align: left; font: inherit; font-weight: 700; cursor: pointer;
  background: var(--sari); color: var(--sari-yazi, #000); border: 0; padding: 10px 14px;
}
.kupon-govde { padding: 10px 14px; }
.kupon-bacaklar { list-style: none; margin: 0 0 10px; padding: 0; font-size: 12.5px; }
/* [no] EV – DEP …… ORAN ×  /  lig · saat · MARKET seçim  */
.kupon-bacaklar li { display: grid; grid-template-columns: 18px 1fr auto 22px; gap: 2px 8px;
                     align-items: center; padding: 7px 0;
                     border-bottom: var(--cizgi, 1px) solid var(--cizgi-renk, var(--murekkep)); }
.kupon-bacaklar .kupon-no { grid-column: 1; grid-row: 1; font-size: 10px; text-align: center;
                            border: 1px solid var(--cizgi-renk, var(--sonuk)); color: var(--sonuk);
                            font-family: "JetBrains Mono", ui-monospace, monospace; }
.kupon-bacaklar .kupon-mac { grid-column: 2; grid-row: 1; font-weight: 600; min-width: 0;
                             overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kupon-bacaklar .kupon-oran { grid-column: 3; grid-row: 1; font-weight: 700; font-size: 13px;
                              font-family: "JetBrains Mono", ui-monospace, monospace; }
.kupon-bacaklar .kupon-secim { grid-column: 2 / 4; grid-row: 2; color: var(--sonuk); font-size: 11.5px; }
.kupon-bacaklar .kupon-secim strong { color: var(--murekkep); font-weight: 600; }
.kupon-bacaklar .kupon-kunye { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 10.5px; }
.kupon-bacaklar .kupon-secim .rozet { margin: 0 0 0 4px; font-size: 9px; padding: 0 4px; }
.kupon-bacaklar .kupon-sil { grid-column: 4; grid-row: 1 / span 2; font: inherit; cursor: pointer;
                             background: none; border: 0; color: var(--sonuk); font-size: 18px; }
.kupon-bacaklar .kupon-sil:hover { color: var(--kayip); }
.mac-dugme.md-canli .md-saat .rozet { margin: 0; font-size: 8.5px; padding: 0 3px; }
.mac-gun-canli .mac-gun-bas { color: var(--kayip); }
.mac-dugme .md-skor { font-family: "JetBrains Mono", ui-monospace, monospace; font-weight: 700;
                      padding: 0 6px; }
.mac-dugme.md-gecmis { opacity: .85; }
.gecmis-gun { display: flex; align-items: end; gap: 8px; padding: 8px 10px;
              border-top: var(--cizgi, 1px) solid var(--cizgi-renk, var(--murekkep)); }
.gecmis-gun label { display: flex; flex-direction: column; gap: 3px; }
.gecmis-gun input[type="date"] { width: auto; }
#gecmis-liste .market-yok { padding: 8px 10px; }
#gecmis-liste .mac-gun-bas { position: static; }
.gecmis-skor { font-family: "JetBrains Mono", ui-monospace, monospace; font-weight: 700; font-size: 16px;
               padding: 0 4px; }
.gecmis-form { display: grid; grid-template-columns: 1fr 1fr 110px auto; gap: 10px 12px; align-items: end;
               padding: 8px 0 4px; }
.gecmis-form .alan[hidden] { display: none; }
@media (max-width: 620px) { .gecmis-form { grid-template-columns: 1fr 1fr; } }
/* Seçim · oran · Fişe ekle — maç seçilince görünen tek satır. Temalar .alan'a
   display:flex verdiği için [hidden] tek başına yetmiyor. */
.secim-alani[hidden] { display: none; }
/* Tek satır: Seçim · [Canlı, yalnız geçmiş maçta] · Oran · Fişe ekle. */
.secim-ic { display: grid; grid-template-columns: 1fr auto 140px auto; gap: 12px 16px; align-items: end; }
.secim-ic:not(:has(.gecmis-canli:not([hidden]))) { grid-template-columns: 1fr 140px auto; }
@media (max-width: 620px) { .secim-ic, .secim-ic:not(:has(.gecmis-canli:not([hidden]))) { grid-template-columns: 1fr 1fr; } .secim-ic .dugme { grid-column: 1 / -1; } }

/* Arama kutusu panelin içinde YAPIŞKAN: liste kayarken üstte kalır. Bölüm
   başlıkları onun altına yapışır. */
.market-ara-alan { position: sticky; top: 0; z-index: 3; padding: 8px 0 6px;
                   background: var(--yuzey, #fff); margin: 0 -12px; padding-left: 12px; padding-right: 12px; }
.market-bolum-ad { top: 50px; }
#market-ara { width: 100%; padding: 7px 10px; font-size: 13px;
              border: var(--cizgi, 1px) solid var(--cizgi-renk, var(--murekkep)); }
.market-satir[hidden], .market-bolum[hidden] { display: none; }
.kupon-bacaklar .kupon-sil:hover { color: var(--kayip); }
.kupon-kaydet { display: flex; align-items: flex-end; gap: 8px; flex-wrap: wrap; }
.kupon-kaydet .alan { flex: 1 1 90px; }
.kupon-kaydet input { width: 100%; }
.kupon-miktar-yazi { flex-basis: 100%; }      /* miktar sorulmaz, kural yazar (16 Ekim 2026) */
.kupon-dugmeler { flex-basis: 100%; display: flex; gap: 8px; }
.satir-son-ic { justify-content: flex-end; }

/* ---------- teletext ---------- */
/* Pastiş: eski teletekst. Saf RGB köşeleri, tek aralıklı yazı, tema
   değişkenleri yok (siyah zemin her temada aynı). */
.tt {
  background: #000; color: #fff; padding: 14px 16px 18px; margin: 8px 0;
  font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 15px; line-height: 1.5;
  text-transform: uppercase;
}
.tt-bas { display: flex; gap: 16px; color: #0f0; margin-bottom: 8px; }
/* Yenileme aralığı: sağ üstte, teletext renkleriyle; seçince kaydeder. */
.tt { position: relative; }
.tt .tt-bas:first-of-type { padding-right: 18ch; }   /* saat, seçiciyle çakışmasın */
.tt-ayar { position: absolute; top: 0; right: 0; color: #ff0; font: inherit; }
.tt-ayar label { display: flex; align-items: center; gap: 6px; font-size: 12px; }
.tt-ayar select { background: #000; color: #0f0; border: 1px solid #0f0; font: inherit;
                  font-size: 12px; padding: 1px 4px; cursor: pointer; }
.tt-ayar select:focus { outline: 2px solid #ff0; }
/* Maç satırı bilgi sayfasına bağlantı: görünüm aynı, üstüne gelince sarı. */
a.tt-mac { color: inherit; text-decoration: none; }
a.tt-mac:hover .tt-ev, a.tt-mac:hover .tt-dep { color: #ff0; }
/* Bilgi sayfası (P303) iskeleti: veri gelene kadar gri bloklar, yavaş yanıp söner. */
.tt-iskelet .tt-yukleniyor { color: #bfe9ff; font-weight: 400; font-size: 12px; animation: tt-yanip 1.2s ease-in-out infinite; }
.tt-isk-satir { display: flex; gap: 10px; padding: 3px 0; }
.tt-isk-satir i { display: inline-block; height: 12px; background: #2a2a2a; animation: tt-yanip 1.2s ease-in-out infinite; }
.tt-isk-satir i:nth-child(2n) { animation-delay: .3s; }
.tt-isk-iki { justify-content: space-between; }
@keyframes tt-yanip { 0%, 100% { opacity: .35; } 50% { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .tt-isk-satir i, .tt-iskelet .tt-yukleniyor { animation: none; } }
/* Bilgi sayfası (P303) */
.tt-geri { display: inline-block; color: #0ff; text-decoration: none; margin-bottom: 8px; }
.tt-dugme { font: inherit; background: #000; color: #ff0; border: 1px solid #ff0; padding: 2px 10px; margin: 4px 0; cursor: pointer; }
.tt-dugme:hover { background: #ff0; color: #000; }
.tt-geri:hover { color: #ff0; }
.tt-mac.tt-buyuk { font-size: 18px; padding: 6px 0; }
.tt-mac.tt-buyuk .tt-amblem { width: 26px; height: 26px; }
.tt-alt-satir { text-align: center; color: #0ff; }
.tt-olaylar { margin: 6px 0 4px; }
.tt-olay { display: grid; grid-template-columns: minmax(0, 1fr) 7ch minmax(0, 1fr); gap: 8px; padding: 1px 0; }
.tt-olay-sol { text-align: right; } .tt-olay-dk { text-align: center; } .tt-olay-sag { text-align: left; }
.tt-olay b { font-weight: 700; }
.tt-istatistik { margin: 4px auto 2px; max-width: 60ch; }
.tt-ist-satir { display: grid; grid-template-columns: 6ch 1fr 6ch; gap: 8px; text-align: center; }
.tt-ist-satir span:first-child { text-align: right; } .tt-ist-satir span:last-child { text-align: left; }
.tt-oran { display: grid; grid-template-columns: 8ch repeat(7, minmax(0, 1fr)); gap: 4px; padding: 2px 0; }
.tt-oran span { text-align: center; }
.tt-oran span:first-child { text-align: left; }
.tt-oran-yok { grid-column: 2 / -1; text-align: left !important; }
.tt-gecmis { display: grid; grid-template-columns: 9ch minmax(0, 1fr) 6ch minmax(0, 1fr); gap: 8px; padding: 1px 0; }
.tt-gecmis .tt-ev { text-align: right; overflow: hidden; white-space: nowrap; }
.tt-gecmis .tt-dep { overflow: hidden; white-space: nowrap; }
.tt-gecmis .tt-skor { text-align: center; color: #ff0; font-weight: 700; }
.tt-not { padding: 3px 0 3px 2ch; text-indent: -2ch; line-height: 1.35; }
.tt-kadro { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 24px; }
.tt-kadro-taraf { min-width: 0; }
.tt-oyuncu { display: grid; grid-template-columns: 3ch 4ch minmax(0, 1fr); gap: 6px; white-space: nowrap; overflow: hidden; }
.tt-oyuncu span:first-child { text-align: right; }
.tt-yedek { color: #0ff; font-size: 12px; margin-top: 4px; line-height: 1.4; }
.tt-sakat { display: grid; grid-template-columns: 2ch minmax(0, 1fr) minmax(0, 1fr); gap: 8px; white-space: nowrap; }
.tt-sonraki { display: grid; grid-template-columns: 12ch minmax(0, 1fr) minmax(0, 14ch); gap: 8px; white-space: nowrap; }
.tt-sonraki span { overflow: hidden; text-overflow: ellipsis; }
.tt-sonraki span:last-child { font-size: 11px; text-align: right; }
.tt-sakat span { overflow: hidden; text-overflow: ellipsis; }
.tt-hakem { display: flex; flex-wrap: wrap; gap: 4px 20px; color: #0ff; }
.tt-puan { display: grid; grid-template-columns: 3ch minmax(0, 1fr) repeat(8, 4ch); gap: 4px; padding: 1px 0; }
.tt-puan span { text-align: right; }
.tt-puan .tt-puan-ad { text-align: left; overflow: hidden; white-space: nowrap; }
.tt-puan-vurgu { background: #ff0; color: #000; }
.tt-puan-vurgu .tt-sari { color: #000; font-weight: 700; }
@media (max-width: 620px) { .tt-kadro { grid-template-columns: 1fr; } }
@media (max-width: 620px) {
  .tt-oran { grid-template-columns: 7ch repeat(7, minmax(0, 1fr)); font-size: 11px; }
  .tt-mac.tt-buyuk { font-size: 14px; }
}
.tt-zaman { margin-left: auto; color: #ff0; }
.tt-bolum { background: #00f; color: #ff0; padding: 0 8px; margin: 12px 0 6px; font-weight: 700; }
.tt-lig { color: #0ff; margin-top: 8px; }
/* Beş sütun, SİMETRİK: sol boşluk · ev · skor · deplasman · durum. Sağdaki
   durum sütunu kadar solda boşluk var ki skor sayfanın tam ortasına düşsün;
   altındaki olay satırları (1fr 7ch 1fr) ve istatistik de ortaya hizalı. */
.tt-mac { display: grid; grid-template-columns: 11ch minmax(0, 1fr) 7ch minmax(0, 1fr) 11ch;
          gap: 8px; align-items: center; }
.tt-mac .tt-ev { grid-column: 2; } .tt-mac .tt-skor { grid-column: 3; }
.tt-mac .tt-dep { grid-column: 4; } .tt-mac .tt-durum { grid-column: 5; }
@media (max-width: 620px) {
  .tt-mac { grid-template-columns: 7ch minmax(0, 1fr) 6ch minmax(0, 1fr) 7ch; gap: 4px; }
}
.tt-mac .tt-ev, .tt-mac .tt-dep { display: flex; align-items: center; gap: 8px; min-width: 0; }
.tt-mac .tt-ev { justify-content: flex-end; }
.tt-mac .tt-ev, .tt-mac .tt-dep { overflow: hidden; white-space: nowrap; }
.tt-mac .tt-skor { text-align: center; color: #ff0; font-weight: 700; }
.tt-mac .tt-durum { text-align: right; }
.tt-amblem { flex: 0 0 auto; width: 18px; height: 18px; object-fit: contain; display: inline-block; }
.tt-durum-yesil .tt-durum { color: #0f0; } .tt-durum-kirmizi .tt-durum { color: #f00; }
.tt-durum-cyan .tt-durum { color: #0ff; }
.tt-canli .tt-skor { background: #ff0; color: #000; }
.tt-bahis { display: flex; justify-content: space-between; gap: 12px; padding-left: 2ch; color: #0ff; }
.tt-bahis .tt-hal { font-weight: 700; }
.tt-yesil { color: #0f0; } .tt-kirmizi { color: #f00; } .tt-cyan { color: #0ff; }
.tt-sari { color: #ff0; } .tt-beyaz { color: #fff; }
.tt-bos { color: #f0f; padding: 4px 0; }
.tt-alt { margin-top: 14px; color: #0f0; font-size: 12px; }
@media (max-width: 620px) {
  .tt { font-size: 12.5px; padding: 10px; }
  .tt-mac { grid-template-columns: minmax(0, 1fr) 6ch minmax(0, 1fr) 8ch; gap: 4px; }
  .tt-amblem { width: 14px; height: 14px; }
}

/* ---------- forum ---------- */
.f-gonderi { padding: 12px 16px; border-top: var(--cizgi, 1px) solid var(--cizgi-renk, var(--murekkep)); }
.f-ust { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 10px; }
.f-baslik { font-weight: 700; font-size: 15px; color: inherit; text-decoration: none; }
a.f-baslik:hover { text-decoration: underline; }
.f-kim { margin-left: auto; }
.f-alt { display: flex; align-items: center; gap: 12px; margin-top: 6px; }
.f-oylar { display: inline-flex; gap: 4px; }
.f-oy {
  font: inherit; font-size: 12px; cursor: pointer; background: none; color: inherit;
  border: var(--cizgi, 1px) solid var(--sonuk); padding: 2px 8px;
}
.f-oy:hover { border-color: var(--murekkep); }
.f-oy.basili { background: var(--murekkep); color: var(--yuzey, #fff); border-color: var(--murekkep); }
.f-metin { white-space: pre-wrap; line-height: 1.55; }
.f-kupon { padding: 8px 16px; }
.f-kupon .bacaklar { margin: 0; }
.f-kupon .bacak { grid-template-columns: 22px minmax(140px, 1fr) minmax(160px, 2fr) auto; }
/* Kupon künyesi: KUPON · n maç · toplam oran sağda, bacak oranlarının üstünde. */
.f-kupon-bas { display: flex; align-items: baseline; gap: 10px; padding: 4px 0 4px 32px; }
.f-kupon-bas .k-etiket { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 10.5px;
                         letter-spacing: .12em; font-weight: 700; color: var(--sonuk); }
.f-kupon-bas .k-adet { font-size: 12px; color: var(--sonuk); }
.f-kupon-bas .k-oran { margin-left: auto; font-size: 14px; }
.f-uyari { border-top: var(--cizgi, 1px) solid var(--cizgi-renk, var(--murekkep)); }
.f-uyari-satir { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 4px 0; font-size: 13px; }
.rozet.f-baska { background: var(--kayip); color: #fff; }
.f-oynandi { font-size: 13.5px; }
.f-guncel { border: var(--cizgi, 1px) solid var(--cizgi-renk, var(--murekkep)); padding: 8px 12px; }
.f-guncel .bacaklar { margin: 6px 0; }
.f-guncel .oran-yazi.arti { color: var(--kazanc); }
.f-guncel .oran-yazi.eksi { color: var(--kayip); }
.f-kupon-toplam { text-align: right; font-size: 13px; padding: 4px 0; }
.f-yorum { padding: 10px 16px; border-top: var(--cizgi, 1px) solid var(--cizgi-renk, var(--murekkep)); }
.f-yorum.kaldirildi { opacity: .55; }
.f-yorum-ust { display: flex; align-items: center; gap: 10px; margin-bottom: 4px; }
.f-yorum-ust .at { margin-left: auto; font: inherit; cursor: pointer; background: none; border: 0; color: var(--sonuk); }
.f-yonet { display: flex; gap: 8px; flex-wrap: wrap; }
/* Forumda gönderi tam açık: kupon, uyarı, oyna, yorumlar — hepsi bir arada.
   Sol olukta beğeni üst üste, gövde sağda; yorumlar baş harfli. */
.f-tam { display: grid; grid-template-columns: 64px 1fr; gap: 0 12px; padding: 16px 16px 12px; }
.f-oluk { padding-top: 2px; }
.f-oluk .f-oylar { flex-direction: column; gap: 4px; align-items: stretch; }
.f-oluk .f-oy { width: 100%; text-align: center; font-size: 11px; padding: 5px 4px; }
.f-govde { min-width: 0; }
.f-tam .f-ust { margin-bottom: 4px; }
.f-tam .f-metin { margin: 6px 0 10px; font-size: 14.5px; }
.f-tam .f-kupon { padding: 4px 0 8px; }
.f-oyna-alan { padding: 6px 0 4px; }
.f-tam .f-alt { margin: 8px 0 4px; flex-wrap: wrap; gap: 10px; }
.f-islem { font: inherit; font-size: 12px; cursor: pointer; background: none; border: 0;
           color: var(--sonuk); padding: 0; text-decoration: underline; }
.f-islem:hover { color: var(--murekkep); }
.f-yorumlar { margin-top: 10px; padding-top: 10px;
              border-top: var(--cizgi, 1px) solid var(--cizgi-renk, var(--murekkep)); }
.f-yorumlar .f-yorum { display: flex; gap: 10px; padding: 8px 0; border-top: 0; }
.f-avatar { flex: 0 0 auto; width: 26px; height: 26px; border-radius: 50%; margin-top: 1px;
            display: inline-flex; align-items: center; justify-content: center;
            background: var(--beton); color: var(--murekkep); font-size: 12px; font-weight: 700;
            font-family: "JetBrains Mono", ui-monospace, monospace; }
.f-yorum-govde { flex: 1 1 auto; min-width: 0; }
.f-yorum-ust { margin-bottom: 2px; }
.f-yorum .f-metin { font-size: 14px; margin: 0; }
.f-yorum-alt { margin-top: 4px; }
.f-yorum-alt .f-oy { font-size: 11px; padding: 1px 7px; }
.f-yorum-form { display: flex; gap: 8px; align-items: center; margin-top: 6px; }
.f-yorum-form input { flex: 1 1 auto; min-width: 0; }
@media (max-width: 620px) {
  .f-tam { grid-template-columns: 1fr; padding: 12px; }
  .f-oluk .f-oylar { flex-direction: row; }
  .f-oluk .f-oy { width: auto; }
}
.kart > header .aciklama a { color: inherit; }
.kart > header .aciklama a[aria-current="true"] { font-weight: 700; text-decoration: underline; }
textarea { width: 100%; font: inherit; padding: 8px 10px;
           border: var(--cizgi, 1px) solid var(--cizgi-renk, var(--murekkep));
           background: var(--yuzey, #fff); color: inherit; }

/* Denge sayfası (/denge): model oranı kalın, altında P Pinnacle adil / X 1xBet. */
.dn-model { font-weight: 700; font-variant-numeric: tabular-nums; }
.dn-guc { font-size: 11px; color: var(--sonuk); white-space: nowrap; }
.dn-sans { font-variant-numeric: tabular-nums; }
.dn-aciklama { font-size: 12.5px; color: var(--sonuk); max-width: 70ch; }
.dn-aciklama b { color: inherit; }

/* --- basketbol (canlı masa eşi; cm-* ile aynı sözlük, ek: sapma ve çizgi grafiği) --- */
.bk-sapma b { font-size: 17px; font-variant-numeric: tabular-nums; }
.bk-dusuk { box-shadow: inset 4px 0 0 var(--kazanc, #1a7f37); }   /* çizgi düştü → Üst adayı */
.bk-yuksek { box-shadow: inset 4px 0 0 var(--kayip); }             /* çizgi yükseldi → Alt adayı */
.bk-ceyrekler { display: flex; gap: 4px; flex-wrap: wrap; }
.bk-ceyrek { padding: 1px 6px; border: 1px solid var(--sonuk); border-radius: 4px; font-size: 12px; font-variant-numeric: tabular-nums; }
/* Momentum grafiği (canlı masa, gölge ölçü): yukarı ev sahibi baskısı, aşağı deplasman.
   preserveAspectRatio="none" — çubuklar dar ekranda da bütün genişliği doldursun. */
.cm-mom-grafik { width: 100%; height: 150px; display: block; }
.cm-mom-grafik .cm-mom-ev { fill: var(--kazanc, #0f6b3f); }
.cm-mom-grafik .cm-mom-dep { fill: var(--kayip, #b3261e); }
.cm-mom-grafik .cm-mom-sifir { stroke: currentColor; stroke-opacity: .35; }
.cm-mom-grafik .cm-mom-devre { stroke: currentColor; stroke-opacity: .2; stroke-dasharray: 3 3; }
.cm-mom-grafik .cm-mom-gol { stroke: var(--murekkep); stroke-opacity: .55; stroke-width: 1; }
.cm-mom-grafik text { font-size: 9px; fill: var(--sonuk); }
.cm-mom-grafik .cm-mom-gol-yazi { font-size: 8px; fill: var(--murekkep); }
@media (max-width: 620px) { .cm-mom-grafik { height: 120px; } }

.bk-grafik { width: 100%; height: auto; display: block; }
.bk-grafik .bk-on { stroke: var(--sonuk); stroke-dasharray: 4 4; }
.bk-grafik .bk-canli { stroke: var(--murekkep); fill: none; stroke-width: 2; }
.bk-grafik .bk-beklenen { stroke: var(--kazanc, #1a7f37); fill: none; stroke-width: 1.5; stroke-dasharray: 2 3; }
.bk-grafik text { font-size: 10px; fill: var(--sonuk); }
.bk-aciklama { display: flex; gap: 14px; flex-wrap: wrap; font-size: 12px; color: var(--sonuk); }
.bk-aciklama i { display: inline-block; width: 18px; border-top: 2px solid var(--murekkep); vertical-align: middle; margin-right: 4px; }
.bk-aciklama i.bk-on { border-top-style: dashed; border-color: var(--sonuk); }
.bk-aciklama i.bk-beklenen { border-top-style: dotted; border-color: var(--kazanc, #1a7f37); }
.bk-merdiven td { vertical-align: middle; }
.bk-ana td { font-weight: 700; }
.bk-olcum td, .bk-olcum th { padding: 6px 10px; }

/* ---------- Gölge sayfası (/golge) ---------- */
/* 12 Eylül 2026, kullanıcı: "3 modelin özetleri en başa, alt alta satır gibi; tıklayınca maçlar dökülsün; devam eden
   bahisler altında, satırda hangi model; sağa doğru kaydırma olmasın". Model başına <details> satırı (özet = altı ölçü);
   tablolar sabit sütun düzeni, hücreler sarar, kaydırma kabı YOK; 900 px altında özet satırı üç sütuna sarar, 620 px
   altında tablo satırı üç sütunlu karta dönüşür (hücre etiketi data-b'den). */
.gm-liste { padding: 0 6px 6px; }
/* Çizgi genişliği sabit 1px: `--cizgi` Bauhaus ve İsviçre'de RENK (var(--cizgi) solid … geçersiz kalıyor, çizgi kayboluyordu). */
.gm-model { border-top: 1px solid var(--cizgi-renk, var(--murekkep)); }
.gm-model:first-child { border-top: 0; }
.gm-satir { display: grid; grid-template-columns: minmax(200px, 2.2fr) repeat(6, minmax(0, 1fr)) 1.2em; gap: 6px 14px;
            align-items: center; padding: 12px 10px; cursor: pointer; list-style: none; min-width: 0; }
.gm-satir::-webkit-details-marker { display: none; }
/* Yedek mürekkepten türer: İsviçre/Bauhaus/Memphis'te --beton yok, koyu zeminde %4 siyah görünmüyordu. */
.gm-satir:hover, .gm-model[open] > .gm-satir { background: var(--beton, color-mix(in srgb, var(--murekkep) 7%, transparent)); }
.gm-ad { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.gm-ad > b { font-size: 15px; overflow-wrap: anywhere; }
.gm-satir .minik { font-size: 10.5px; color: var(--sonuk); white-space: normal; font-weight: 400; }
.gm-hucre { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.gm-etiket { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--sonuk); }
.gm-hucre > b { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 19px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.gm-hucre > b.gm-cift { font-size: 15px; }       /* "Alt · Üst" ikili sayı, 1280'de tek hücreye sığsın (+13.4 · +3.5) */
@media (max-width: 1100px) { .gm-hucre > b.gm-cift { font-size: 13px; } }   /* 1000–1024'te hücre 103 px, 15px'te 108 px taşıyordu */
.gm-ok { color: var(--sonuk); justify-self: end; transition: transform .15s; }
.gm-model[open] > .gm-satir .gm-ok { transform: rotate(90deg); }
.gm-acik { padding: 4px 10px 16px; }
.gm-tanim { margin: 0 0 10px; white-space: normal; }
.gm-ozet { margin: 0 0 10px; }
.gm-ozet .dg-kaynak { white-space: normal; }     /* tür kutusunun uzun alt satırı 420 px'te sarmalı, taşmamalı */
.gm-gunler { margin: 0 0 12px; white-space: normal; line-height: 1.7; }
.gm-baslik { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--sonuk); margin: 14px 0 6px; }
.gm-eski { margin-top: 8px; }
.gm-eski-baslik { cursor: pointer; font-size: 12.5px; color: var(--sonuk); padding: 8px 0; }
/* Tablolar: yatay kaydırma yok — sabit sütun genişlikleri (colgroup yüzdeleri), hücre sarar; sayılar sarmaz. */
.gm-tablo { table-layout: fixed; width: 100%; }
.gm-tablo th, .gm-tablo td { white-space: normal; overflow-wrap: anywhere; padding: 8px 8px; vertical-align: top; }
.gm-tablo td.say { white-space: nowrap; }
.gm-tablo .minik { white-space: nowrap; }
.gm-tablo .dg-kaynak, .gm-tablo .gm-market { white-space: normal; }
.gm-tablo .gm-dk { white-space: nowrap; }         /* canlı dakika "88'" ikiye bölünmesin */
.gm-skor { font-family: "JetBrains Mono", ui-monospace, monospace; font-weight: 800; }
.gm-oran { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 15px; }
.gm-neden { font-size: 11.5px; color: var(--sonuk); line-height: 1.4; }
.gm-ad .gm-rozet { align-self: start; }      /* .gm-ad flex sütun: rozet satırı germesin */
.gm-rozet { display: inline-block; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 10.5px; letter-spacing: .06em;
            text-transform: uppercase; border: 1px solid var(--murekkep); padding: 0 5px; margin: 0 4px 3px 0; white-space: nowrap; }
@media (max-width: 1000px) {
  /* Sabit yüzdeler dar ekranda sayı sütununu daraltıp komşusuna taşırıyordu (900 px'te "Kaybetti" ile "-1.00" üst üste);
     burada sütunlar içeriğe göre: sayılar sarmaz, uzun metin (maç, seçim, gerekçe) kalan yeri alır. overflow-wrap:anywhere
     auto düzende metin sütununun en dar genişliğini TEK HARF sayıp sütunu 30 px'e indiriyordu (harf harf sarma); en uzun
     kelime kadar olsun. 800 px altı zaten kart. */
  .gm-tablo { table-layout: auto; }
  .gm-tablo td { overflow-wrap: normal; }
}
@media (max-width: 900px) {
  .gm-satir { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .gm-ad { grid-column: 1 / -1; }
  .gm-ok { display: none; }
}
@media (max-width: 800px) {
  /* Kart eşiği 800 (620 idi): 621–780 arasında 10 sütun sarmayan sayılarla sığmıyor, Seçim/Gerekçe okunmaz oluyordu. */
  .gm-tablo, .gm-tablo tbody { display: block; }
  .gm-tablo thead, .gm-tablo colgroup { display: none; }
  .gm-tablo tr { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px 10px; padding: 10px 6px;
                 border-bottom: 1px solid var(--cizgi-renk, var(--murekkep)); }
  .gm-tablo td, .gm-tablo td.say { display: block; border: 0; padding: 0; text-align: left; white-space: normal; }
  .gm-tablo td::before { content: attr(data-b); display: block; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 9.5px;
                         letter-spacing: .1em; text-transform: uppercase; color: var(--sonuk); }
  .gm-tablo td.gm-mac, .gm-tablo td.gm-neden { grid-column: 1 / -1; }
  .gm-tablo td.gm-mac::before { display: none; }
}

/* Model — kasa seyri seçenekleri (12 Eylül gece): başlığın sağında radyo grubu; :has ile seçili panel görünür, sunucuya gitmez */
.kg-secenekler { display: flex; gap: 4px; flex-wrap: wrap; margin-left: auto; }
.kg-secenek { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 11px; text-transform: uppercase; letter-spacing: .04em;
  border: 1px solid var(--bant-yazi, var(--kagit)); padding: 3px 8px; cursor: pointer; color: var(--bant-yazi, var(--kagit)); opacity: .75; user-select: none; }
.kg-secenek:has(input:checked) { background: var(--bant-yazi, var(--kagit)); color: var(--bant, var(--murekkep)); opacity: 1; }   /* input etiketin İÇİNDE kalan yerler (ör. /basket/indirme) */
.kg-secenek input { position: absolute; opacity: 0; width: 0; height: 0; }
.kg-panel { display: none; }
.kg-panel-ozet { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 12px; color: var(--sonuk); margin: 0 0 8px; }
/* Seçim radyoları tazelenen gövdenin DIŞINDA (19 Eylül 2026) — bu yüzden kurallar `body:has(#id:checked)`
   ile yazılı, `.kg-secenek:has(input:checked)` ile DEĞİL: etiketin içinde artık input yok. Yeni pay seçeneği
   eklenince bu iki listeye de satır ekle. Anahtarlar: p10, p5, p3, norm, p10s. */
body:has(#ks-p10:checked) #kasa-seyri .kg-panel[data-secenek="p10"],
body:has(#ks-p5:checked) #kasa-seyri .kg-panel[data-secenek="p5"],
body:has(#ks-p3:checked) #kasa-seyri .kg-panel[data-secenek="p3"],
body:has(#ks-norm:checked) #kasa-seyri .kg-panel[data-secenek="norm"],
body:has(#ks-p10s:checked) #kasa-seyri .kg-panel[data-secenek="p10s"] { display: block; }
body:has(#ks-p10:checked) #kasa-seyri .kg-secenek[for="ks-p10"],
body:has(#ks-p5:checked) #kasa-seyri .kg-secenek[for="ks-p5"],
body:has(#ks-p3:checked) #kasa-seyri .kg-secenek[for="ks-p3"],
body:has(#ks-norm:checked) #kasa-seyri .kg-secenek[for="ks-norm"],
body:has(#ks-p10s:checked) #kasa-seyri .kg-secenek[for="ks-p10s"] { background: var(--bant-yazi, var(--kagit)); color: var(--bant, var(--murekkep)); opacity: 1; }
body:not(:has(input[name="ks-secenek"]:checked)) #kasa-seyri .kg-panel[data-secenek="p10"] { display: block; }

/* ---------------------------------------------------------------- Kurallar sayfası
   Karar eşiklerini görme ve düzenleme (14 Eylül 2026, kullanıcı "sitede bir yer yapsak,
   hem rahatça görebilirim hem rahatça düzenleyebilirim"). Her eşik bir satır: solda adı ve
   ne işe yaradığı, sağda girdi; altında koddaki gerekçesi katlanır halde. */
.kr-liste { display: grid; gap: 2px; }
.kr-esik { padding: 10px 0; border-bottom: var(--cizgi, 1px) solid var(--cizgi-renk, var(--murekkep)); }
.kr-esik:last-child { border-bottom: 0; }
.kr-ust { display: flex; gap: 12px; align-items: flex-start; flex-wrap: wrap; justify-content: space-between; }
.kr-ad { min-width: 12rem; flex: 1 1 14rem; }
.kr-form { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.kr-girdi { width: 7.5rem; font-family: "JetBrains Mono", ui-monospace, monospace; text-align: right; }
.kr-birim { font-size: 12px; color: var(--sonuk); min-width: 2.2rem; }
.kr-aciklama { margin: 4px 0 0; font-size: 12.5px; line-height: 1.45; color: var(--sonuk); max-width: 62ch; }
.kr-gerekce { margin-top: 4px; }
.kr-gerekce summary { cursor: pointer; font-size: 11.5px; letter-spacing: .04em;
                      text-transform: uppercase; color: var(--sonuk); }
.kr-gerekce p { margin: 5px 0 0; font-size: 12px; line-height: 1.5; max-width: 78ch;
                font-family: "JetBrains Mono", ui-monospace, monospace; }
/* Varsayılandan farklı eşik: solda sarı çubuk — hangi kuralları elle değiştirdiğin bir bakışta. */
.kr-degisti { border-left: 3px solid var(--sari); padding-left: 9px; margin-left: -12px; }
@media (max-width: 720px) {
  .kr-ust { flex-direction: column; gap: 6px; }
  .kr-form { width: 100%; }
  .kr-girdi { flex: 1 1 auto; width: auto; }
  /* `flex: 1 1 14rem` SÜTUN YÖNÜNDE YÜKSEKLİK OLUYOR (21 Eylül 2026). `.kr-ad`ın temel ölçüsü
     satır yönü için yazılmıştı; `.kr-ust` telefonda sütuna dönünce 14rem ana eksene, yani
     YÜKSEKLİĞE geçiyor ve her eşiğin başlığının altında ~220 piksel boşluk kalıyordu (30 eşik
     = 6.600 piksel boş kaydırma). Sütunda temel ölçü içeriğin kendisi olmalı. */
  .kr-ad { flex: 0 1 auto; min-width: 0; }
}

/* ---------------------------------------------------------------- Şema sayfası (/sema)
   Veri haritası: topladığımız her şeyin üç boyutlu dökümü (14 Eylül 2026, kullanıcı
   "bu veri haritasını siteye ekle"). Ada renkleri burada tanımlı — çizim onları
   getComputedStyle ile okuyor (static/sema.js), zemini de kabın kendi arka planından
   alıyor, böylece beş tasarımın ve iki temanın hepsinde uyumlu kalıyor. */
:root {
  --sema-mac:     #0A6C9C;
  --sema-fiyat:   #9A6B06;
  --sema-karar:   #1B7A46;
  --sema-basket:  #9B3D8C;
  --sema-defter:  #3A5AA8;
  --sema-sistem:  #6A6F77;
  --sema-kaynak:  #B5442A;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --sema-mac:    #4FC3E8;
    --sema-fiyat:  #F2B33D;
    --sema-karar:  #47C97C;
    --sema-basket: #DE7FCD;
    --sema-defter: #8AA9E8;
    --sema-sistem: #9AA3AD;
    --sema-kaynak: #F0805C;
  }
}
:root[data-theme="dark"] {
  --sema-mac:    #4FC3E8;
  --sema-fiyat:  #F2B33D;
  --sema-karar:  #47C97C;
  --sema-basket: #DE7FCD;
  --sema-defter: #8AA9E8;
  --sema-sistem: #9AA3AD;
  --sema-kaynak: #F0805C;
}

/* ölçü şeridi: sayfanın ve yedeğin başındaki dört rakam */
.sm-olculer { display: flex; flex-wrap: wrap; gap: 18px 28px; }
.sm-olcu { display: flex; flex-direction: column; gap: 2px; }
.sm-olcu-ad, .sm-cift .sm-olcu-ad {
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: var(--sonuk);
}
.sm-olcu b, .sm-cift b {
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 19px; font-variant-numeric: tabular-nums;
}

/* harita kutusu: tuval + iki yan panel + alt kumanda */
.sm-harita {
  position: relative;
  height: min(72vh, 680px);
  overflow: hidden;
  background: var(--yuzey, var(--kagit, #fff));
}
.sm-harita:fullscreen { height: 100vh; }
.sm-tuval { position: absolute; inset: 0; background: var(--yuzey, var(--kagit, #fff)); }
.sm-tuval canvas { display: block; }
.sm-tuval:focus-visible { outline: var(--kalin, 2px) solid var(--murekkep); outline-offset: -3px; }

.sm-yan {
  position: absolute; top: 12px; bottom: 54px;
  display: flex; flex-direction: column;
  background: var(--yuzey, var(--kagit, #fff));
  border: var(--cizgi, 1px) solid var(--cizgi-renk, var(--murekkep));
  max-height: calc(100% - 66px);
}
.sm-sol { left: 12px; width: 216px; }
.sm-sag { right: 12px; width: 314px; }
.sm-yan-bas {
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: var(--sonuk);
  padding: 7px 10px; border-bottom: var(--cizgi, 1px) solid var(--cizgi-renk, var(--murekkep));
}
.sm-yan-govde { overflow-y: auto; padding: 8px 10px 10px; }

.sm-ada-sat, .sm-tablo-sat {
  display: flex; align-items: center; gap: 7px; width: 100%;
  background: none; border: 0; cursor: pointer; text-align: left;
  font-family: "JetBrains Mono", ui-monospace, monospace;
  padding: 4px 4px; color: var(--murekkep);
}
.sm-ada-sat { font-size: 11.5px; }
.sm-tablo-sat { font-size: 11px; color: var(--sonuk); padding-left: 18px; }
.sm-ada-sat:hover, .sm-tablo-sat:hover { background: var(--beton, var(--yuzey)); color: var(--murekkep); }
.sm-ada-sat[aria-pressed="false"] { opacity: .4; }
.sm-tablo-sat[aria-current="true"] { color: var(--murekkep); font-weight: 700; background: var(--beton, var(--yuzey)); }
.sm-nokta { width: 9px; height: 9px; flex: 0 0 9px; }
.sm-say { margin-left: auto; font-size: 10px; color: var(--sonuk); font-variant-numeric: tabular-nums; }

.sm-ad { margin: 0; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 16px; }
.sm-ozet { margin: 8px 0 0; font-size: 12.5px; line-height: 1.5; color: var(--murekkep); }
.sm-cift { display: flex; gap: 22px; margin-top: 12px; }
.sm-cift div { display: flex; flex-direction: column; gap: 2px; }
.sm-bas {
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 10px; letter-spacing: .14em; text-transform: uppercase; color: var(--sonuk);
  margin: 16px 0 5px; padding-bottom: 4px;
  border-bottom: var(--cizgi, 1px) solid var(--cizgi-renk, var(--murekkep));
}
.sm-sutunlar { width: 100%; border-collapse: collapse; font-size: 11.5px; }
.sm-sutunlar td { padding: 3px 0; vertical-align: top; }
.sm-s-ad {
  font-family: "JetBrains Mono", ui-monospace, monospace;
  white-space: nowrap; padding-right: 9px !important; color: var(--murekkep);
}
.sm-s-not { color: var(--sonuk); line-height: 1.4; }
.sm-baglar { display: flex; flex-wrap: wrap; gap: 4px; }
.sm-bag {
  font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 10.5px;
  padding: 2px 6px; background: none; cursor: pointer; color: var(--sonuk);
  border: var(--cizgi, 1px) solid var(--cizgi-renk, var(--murekkep));
}
.sm-bag:hover { color: var(--murekkep); }

.sm-kumanda {
  position: absolute; left: 12px; right: 12px; bottom: 12px;
  display: flex; gap: 6px; align-items: center; flex-wrap: wrap;
}
.sm-dugme {
  font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 10.5px;
  letter-spacing: .06em; text-transform: uppercase; padding: 5px 9px; cursor: pointer;
  background: var(--yuzey, var(--kagit, #fff)); color: var(--sonuk);
  border: var(--cizgi, 1px) solid var(--cizgi-renk, var(--murekkep));
}
.sm-dugme:hover, .sm-dugme[aria-pressed="true"] { color: var(--murekkep); }
.sm-ipucu {
  font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 10px;
  color: var(--sonuk); margin-left: auto;
  background: var(--yuzey, var(--kagit, #fff)); padding: 2px 4px;
}

/* yedek bölümü */
.sm-ikili { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; margin-top: 18px; }
.sm-alt-bas {
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 11px; letter-spacing: .12em; text-transform: uppercase;
  margin: 0 0 6px; padding-top: 14px;
}
.sm-ikili > div > .sm-alt-bas:first-child { padding-top: 0; }
/* /sema disk dökümü (19 Eylül 2026): pay çubuğu, küçük not, kırmızı vurgu, ölçü altı satırı.
   Renkler TEMA DEĞİŞKENLERİNDEN okunur — beş tasarımın hepsinde ve koyu modda çalışsın. */
.sm-cubuk {
  display: inline-block; width: 46px; height: 7px; margin-right: 6px;
  background: color-mix(in srgb, var(--murekkep) 14%, transparent); vertical-align: middle;
}
.sm-cubuk::before {
  content: ""; display: block; height: 100%; width: var(--pay, 0%);
  background: var(--murekkep); opacity: .62;
}
.sm-kucuk { font-size: 11.5px; line-height: 1.45; color: var(--sonuk); }
/* Uzun anlatı sütunları SARSIN, tabloyu yatay kaydırmaya itmesin. ÖZGÜLLÜK: `.tablo td`
   (0,1,1) tek sınıfı (0,1,0) yeniyor — `white-space: nowrap` orada tanımlı, ezmek için
   seçici `.tablo td.…` olmalı (CLAUDE.md'deki tema ezme kuralının aynısı). */
.tablo td.sm-nicin, .tablo td.sm-anlati { white-space: normal; max-width: 30ch; }
@media (min-width: 900px) {
  .tablo td.sm-nicin { max-width: 44ch; }
  .tablo td.sm-anlati { max-width: 52ch; }
}
/* DAR EKRAN: uzun anlatı sütunları gizlenir. Gizlemeden önce sorun şuydu — `.tablo-sar` yatay
   kaydırdığı için metin ekran dışında kalıyor AMA sardığı için satır yüksekliğini şişiriyordu,
   yani görünmeyen metin yüzünden satırlar devasa oluyordu. Yedek katmanlarında metin
   kaybolmasın diye `.sm-dar-not` ile katman adının altına düşüyor. */
.sm-dar-not { display: none; }
@media (max-width: 899px) {
  .tablo th.sm-genis, .tablo td.sm-genis { display: none; }
  .sm-dar-not {
    display: block; margin-top: 4px; font-size: 11px; line-height: 1.45;
    color: var(--sonuk); white-space: normal; max-width: 34ch;
  }
}
.sm-kirmizi { color: var(--kayip); }
.sm-dip { margin: 12px 0 0; font-size: 12.5px; line-height: 1.6; color: var(--sonuk); }
.sm-dip b { color: var(--murekkep); }
.sm-liste { margin: 0; padding-left: 18px; font-size: 12.5px; line-height: 1.6; }
.sm-liste li { margin-bottom: 3px; }

@media (max-width: 900px) {
  .sm-sag { width: 260px; }
  .sm-sol { width: 180px; }
  .sm-ipucu { display: none; }
}
/* Dar ekranda paneller tuvalin üstüne binmez, altına dizilir. */
@media (max-width: 720px) {
  .sm-harita { height: auto; }
  .sm-tuval { position: relative; height: 58vh; min-height: 300px; }
  .sm-yan {
    position: static; width: auto; max-height: 220px;
    margin-top: 10px; bottom: auto; top: auto;
  }
  .sm-kumanda { position: static; margin-top: 10px; }
  .sm-ikili { grid-template-columns: 1fr; gap: 6px; }
}


/* --- CLV sayfası (17 Eylül 2026) ------------------------------------------------------------
   Kasa seyirleri yan yana: geniş ekranda iki sütun, dar ekranda tek. Grafik SVG viewBox'lı,
   yarım genişlikte kendiliğinden ölçekleniyor. */
.clv-kasalar { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(420px, 100%), 1fr));
               gap: 14px 18px; margin-top: 10px; }
.clv-kasa { min-width: 0; border: 1px solid var(--sonuk); border-radius: 6px; padding: 8px 10px 4px; }
.clv-kasa-bas { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 10px; margin-bottom: 4px; }
.clv-kasa-ad { font-weight: 700; }
.clv-kasa-say { font-family: "JetBrains Mono", ui-monospace, monospace; font-weight: 700;
                font-variant-numeric: tabular-nums; }
.clv-kasa-not { font-size: 11px; opacity: .75; margin-left: auto; }
.clv-ozet { margin: 10px 0 0; }
.kart-not { margin: 8px 0 0; font-size: 11.5px; }
.clv-yontem > summary { cursor: pointer; padding: 10px 12px; }
.clv-yontem[open] > summary { border-bottom: 1px solid var(--sonuk); }
.clv-yontem p, .clv-yontem ul { padding: 0 12px; }
.clv-yontem li { margin: 4px 0; }

/* Basket gölge kıyası (17 Eylül 2026): tablo sayıları taşımasın diye açıklamalar hücreden
   çıkarıldı, tablonun altında tanım listesi olarak duruyor. */
/* SON ÇEYREK KASA SEYRİ (14 Ekim 2026): tek gerçek teorimizin hesabı tabloda ve grafikte
   işaretli dursun — ötekiler kontrol kolu / emekli / kanıtsız gözlem. Sol sarı çubuk
   (seçili kasa satırının kalıbı), başlık tür rozetiyle aynı dili konuşur. */
.bk-c4-satir > td:first-child { box-shadow: inset 3px 0 0 var(--kazanc); }
.bk-c4-baslik { margin: 0 0 6px; font-size: 1em; display: flex; align-items: center; gap: 8px; }
#bk-c4-seyir { border-top: 1px solid var(--cizgi, var(--sonuk)); padding-top: 12px; }

.bk-golge-not { margin: 0; display: grid; grid-template-columns: max-content 1fr; gap: 4px 14px; }
.bk-golge-not dt { font-weight: 600; white-space: nowrap; }
.bk-golge-not dd { margin: 0; color: var(--sonuk); font-size: 0.92em; }
@media (max-width: 640px) {
  .bk-golge-not { grid-template-columns: 1fr; gap: 2px; }
  .bk-golge-not dd { margin-bottom: 8px; }
}

/* Gölge sayfası: kaynağın BÜTÜN kayıtları geriye dönük üretilmişse uyarı (18 Eylül 2026).
   Önceden ayrım yalnız "hem geriye dönük hem canlı varsa" görünüyordu; hepsi geriye dönük olan
   kaynakta "1 birim / oynama" yazıyordu ve rakamların maç sonrası düzeltilmiş xG ile üretildiği
   kayboluyordu. */
/* `.uyari` KULLANMA: o, beş temanın da sarı zeminli BLOK uyarı kutusu (stil.css:376 ve
   tasarim/*.css). Satır içi rozetin kendi adı olmalı. */
.gm-hucre .minik b.gm-gd { color: var(--kayip); font-weight: 600; }

/* CLV — kasa seyri PAY ŞERİDİ (18 Eylül 2026, kullanıcı: "sağ en üste %10 %5 %10 maks 1.500 gibi
   değerleri koy. Tıklayınca onları göstersin"). Model sayfasındaki `.kg-secenekler` kalıbının
   aynısı; üç benzetim de sunucuda hazır, seçim CSS `:has` ile — hiçbir isteğe girmez.
   Yeni seçenek eklenirse aşağıdaki listeye de bir satır ekle (Model'deki #kasa-seyri gibi). */
.clv-kasalar .kg-panel { display: none; }
/* Seçim radyoları tazelenen gövdenin DIŞINDA (19 Eylül 2026) — bu yüzden kurallar `body:has(#id:checked)`
   ile yazılı, `.kg-secenek:has(input:checked)` ile DEĞİL: etiketin içinde artık input yok. Yeni pay seçeneği
   eklenince bu iki listeye de satır ekle. Anahtarlar: p10, p5, p3, norm, p10s. */
body:has(#clv-ks-p10:checked) #clv-kasalar .kg-panel[data-secenek="p10"],
body:has(#clv-ks-p5:checked) #clv-kasalar .kg-panel[data-secenek="p5"],
body:has(#clv-ks-p3:checked) #clv-kasalar .kg-panel[data-secenek="p3"],
body:has(#clv-ks-norm:checked) #clv-kasalar .kg-panel[data-secenek="norm"],
body:has(#clv-ks-p10s:checked) #clv-kasalar .kg-panel[data-secenek="p10s"] { display: contents; }
body:has(#clv-ks-p10:checked) #clv-kasalar .kg-secenek[for="clv-ks-p10"],
body:has(#clv-ks-p5:checked) #clv-kasalar .kg-secenek[for="clv-ks-p5"],
body:has(#clv-ks-p3:checked) #clv-kasalar .kg-secenek[for="clv-ks-p3"],
body:has(#clv-ks-norm:checked) #clv-kasalar .kg-secenek[for="clv-ks-norm"],
body:has(#clv-ks-p10s:checked) #clv-kasalar .kg-secenek[for="clv-ks-p10s"] { background: var(--bant-yazi, var(--kagit)); color: var(--bant, var(--murekkep)); opacity: 1; }
body:not(:has(input[name="clv-ks"]:checked)) #clv-kasalar .kg-panel[data-secenek="p3"] { display: contents; }

/* BASKET VERİ İNDİRME (/basket/indirme, 18 Eylül 2026, kullanıcı "siteye bir buton koy istekler ben
   siteye girdiğim iplerden de atabileyim"). İstekleri tarayıcı atar; buradaki sayaçlar o koşunun
   durumu. `.md-kutu` ve `.kg-secenekler` yeniden kullanıldı, yalnız eksikler tanımlı. */
.bi-ozet { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin-bottom: 14px; }
.bi-kumanda { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin: 0 0 14px; }
.bi-etiket { font-size: 13px; color: var(--sonuk); display: inline-flex; gap: 6px; align-items: center; }
.bi-etiket input { width: 64px; }
.bi-cubuk { height: 8px; min-width: 80px; border: 1px solid var(--sonuk); border-radius: 4px; overflow: hidden; }
.bi-cubuk > i { display: block; height: 100%; background: var(--kazanc); }
.bi-log { margin: 0; padding: 10px; max-height: 190px; overflow: auto; font-size: 12px; line-height: 1.5;
          background: var(--yuzey); border: 1px solid var(--sonuk); border-radius: 6px; white-space: pre-wrap; }
.kg-secenekler .dugme.secili { border-color: var(--murekkep); font-weight: 600; }
.bi-kumanda .dugme:disabled { opacity: .45; cursor: default; }
.bi-ipucu { font-size: 11.5px; color: var(--sonuk); }

/* GÖLGE — dönem rozeti ve belirsizlik (18 Eylül 2026, kullanıcı "anlaşılması daha kolay olsun").
   Dört strateji tamamen geriye dönükken ROI'leri canlı olanlarla yan yana okunuyordu; rozet
   satırın başında, ROI'nin %95 aralığı da altında. `.uyari` kullanılmadı (blok uyarı kutusu). */
.gm-rozet { display: inline-block; font-size: 10px; letter-spacing: .06em; text-transform: uppercase;
            padding: 1px 6px; border-radius: 4px; border: 1px solid var(--sonuk); vertical-align: 2px; }
.gm-r-gd { border-color: var(--kayip); color: var(--kayip); }
.gm-r-canli { border-color: var(--kazanc); color: var(--kazanc); }
.gm-r-karma { border-color: var(--sonuk); color: var(--sonuk); }
.gm-r-belirsiz { color: var(--sonuk); font-weight: 400; }
.gm-roi .minik { line-height: 1.45; }

/* KASA KIYAS GRAFİĞİ (/clv, 18 Eylül 2026, kullanıcı "kasa seyirlerini daha interaktif ve kullanışlı
   yap"). Sekiz hesap TEK eksende; geometri deger.kasa_kiyas_verisi, çizim clv.html, fare vanilla JS.
   Seri paleti BURADA tanımlı: beş temanın hiçbirinde kategorik renk yoktu, ortak.css temalardan
   SONRA yüklendiği için buradan vermek hepsinde çalışır. Koyu blok açık paletin okunur karşılığı. */
:root {
  --seri-1: #1f5fbf; --seri-2: #d1670b; --seri-3: #1a7f37; --seri-4: #7b3fb3; --seri-5: #b3261e;
  --seri-6: #0f7d86; --seri-7: #b3168c; --seri-8: #6b6a17; --seri-9: #3a5a8c; --seri-10: #8a4b20;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --seri-1: #7FB0FF; --seri-2: #FFA95C; --seri-3: #3DD673; --seri-4: #C79BFF; --seri-5: #FF7B72;
    --seri-6: #4DD0D8; --seri-7: #FF7BD5; --seri-8: #D4D24A; --seri-9: #9FB6DE; --seri-10: #D79B6A;
  }
}
:root[data-theme="dark"] {
  --seri-1: #7FB0FF; --seri-2: #FFA95C; --seri-3: #3DD673; --seri-4: #C79BFF; --seri-5: #FF7B72;
  --seri-6: #4DD0D8; --seri-7: #FF7BD5; --seri-8: #D4D24A; --seri-9: #9FB6DE; --seri-10: #D79B6A;
}
.seri-1 { --seri: var(--seri-1); } .seri-2 { --seri: var(--seri-2); } .seri-3 { --seri: var(--seri-3); }
.seri-4 { --seri: var(--seri-4); } .seri-5 { --seri: var(--seri-5); } .seri-6 { --seri: var(--seri-6); }
.seri-7 { --seri: var(--seri-7); } .seri-8 { --seri: var(--seri-8); } .seri-9 { --seri: var(--seri-9); }
.seri-10 { --seri: var(--seri-10); }

/* Kıyas paneli yalnız seçili pay seçeneğinde görünür. `display: contents` KULLANILMAZ: ipucu
   mutlak konumlanıyor, kabın `position: relative` olması şart. */
#clv-kasalar > .kiyas-sar { display: none; position: relative; margin-bottom: 14px; }
body:has(#clv-ks-p10:checked) #clv-kasalar > .kiyas-sar[data-secenek="p10"],
body:has(#clv-ks-p5:checked) #clv-kasalar > .kiyas-sar[data-secenek="p5"],
body:has(#clv-ks-p3:checked) #clv-kasalar > .kiyas-sar[data-secenek="p3"],
body:has(#clv-ks-norm:checked) #clv-kasalar > .kiyas-sar[data-secenek="norm"],
body:has(#clv-ks-p10s:checked) #clv-kasalar > .kiyas-sar[data-secenek="p10s"] { display: block; }
body:not(:has(input[name="clv-ks"]:checked)) #clv-kasalar > .kiyas-sar[data-secenek="p3"] { display: block; }

.grafik.kiyas { width: 100%; height: auto; display: block; cursor: crosshair; }
.kiyas-kilavuz { stroke: var(--sonuk); stroke-width: 1; opacity: .25; }
.kiyas-sifir { opacity: .7; stroke-width: 2; }
.kiyas-gun { stroke: var(--sonuk); stroke-width: 1; opacity: .18; stroke-dasharray: 3 4; }
.kiyas-gun-yazi, .kiyas-centik { font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 11px; fill: var(--sonuk); }
.kiyas-cizgi { fill: none; stroke: var(--seri); stroke-width: 2.4; stroke-linejoin: round; }
.kiyas-son { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 11px;
  font-weight: 700; fill: var(--seri); }
.kiyas-bag { stroke: var(--seri); stroke-width: 1; opacity: .55; }
/* [hidden] display:flex'i ezemiyor — ipucu kapalıyken boş kutu görünüyordu (18 Eylül 2026). */
.kiyas-ipucu[hidden] { display: none; }
.kiyas-gizli { display: none; }
.kiyas-capraz { stroke: var(--murekkep); stroke-width: 1.5; opacity: .5; }
.kiyas-benekli { fill: var(--seri); stroke: var(--yuzey, var(--kagit)); stroke-width: 2; }

/* İpucu: SVG değil HTML — satır sayısı seriye göre değişiyor, metin sarması bedava. */
.kiyas-ipucu { position: absolute; top: 6px; z-index: 3; pointer-events: none;
  background: var(--yuzey, var(--kagit)); border: 1px solid var(--sonuk); border-radius: 4px;
  padding: 6px 8px; font-size: 12px; display: flex; flex-direction: column; gap: 2px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .18); max-width: 260px; }
.kiyas-ip-satir { display: flex; align-items: center; gap: 6px; white-space: nowrap; }
.kiyas-ip-satir b { margin-left: auto; font-family: "JetBrains Mono", ui-monospace, monospace; }
.kiyas-benek { width: 9px; height: 9px; border-radius: 2px; background: var(--seri);
  display: inline-block; flex: none; }

.kiyas-lejant { display: flex; flex-wrap: wrap; gap: 4px 6px; margin-top: 6px; }
.kiyas-anahtar { display: inline-flex; align-items: center; gap: 5px; font-size: 11px;
  padding: 3px 7px; border: 1px solid var(--sonuk); border-radius: 999px; background: none;
  color: inherit; cursor: pointer; font-family: inherit; }
.kiyas-anahtar b { font-family: "JetBrains Mono", ui-monospace, monospace; }
.kiyas-anahtar .kiyas-n { color: var(--sonuk); font-size: 10px; }
.kiyas-anahtar:hover { border-color: var(--seri); }
.kiyas-anahtar[aria-pressed="false"] { opacity: .4; text-decoration: line-through; }
.kiyas-anahtar[aria-pressed="false"] .kiyas-benek { background: var(--sonuk); }

@media (max-width: 560px) {
  .kiyas-ipucu { font-size: 11px; max-width: 200px; }
  .kiyas-anahtar { font-size: 10px; padding: 2px 6px; }
}

/* ODAK VE ELLE GEZME (19 Eylül 2026, kullanıcı: "okuması zor… böyle resim gibi duruyor").
   Kıyasta fareye en yakın çizgi öne çıkar, ötekiler soluklaşır — dokuz çizgi eşit ağırlıkta
   çizilince göz hiçbirini takip edemiyordu. Küçük grafikler de artık gezilebilir. */
.kiyas-odakli .kiyas-cizgi { opacity: .22; stroke-width: 1.8; }
.kiyas-odakli .kiyas-son, .kiyas-odakli .kiyas-bag { opacity: .3; }
.kiyas-odakli .kiyas-cizgi.kiyas-odak { opacity: 1; stroke-width: 3.4; }
.kiyas-odakli .kiyas-son.kiyas-odak { opacity: 1; }
.kiyas-odakli .kiyas-bag.kiyas-odak { opacity: .7; }
.kiyas-ip-satir.kiyas-ip-odak { font-weight: 700; }
.kiyas-ip-satir.kiyas-ip-odak::before { content: "▸"; margin-right: -2px; color: var(--sonuk); }
.kiyas-lejant + .kiyas-yardim, .kiyas-yardim { font-size: 10px; color: var(--sonuk); margin-top: 4px; }

.kg-sar { position: relative; display: block; }
.kg-sar .grafik.kg { cursor: crosshair; }
.kg-capraz-elle { stroke: var(--murekkep); stroke-width: 1.5; opacity: .45; }
.kg-benek-elle { fill: var(--murekkep); stroke: var(--yuzey, var(--kagit)); stroke-width: 2; }
.kg-ipucu-elle { position: absolute; top: 2px; z-index: 3; pointer-events: none;
  background: var(--yuzey, var(--kagit)); border: 1px solid var(--sonuk); border-radius: 4px;
  padding: 3px 7px; font-size: 11px; white-space: nowrap;
  font-family: "JetBrains Mono", ui-monospace, monospace; }
.kg-ipucu-elle[hidden] { display: none; }

/* Küçük grafik paneli `display: contents` ALAMAZ (19 Eylül 2026): kutusu olmayan öğede
   `position: relative` çalışmıyor, ipucu konumlanamıyordu. İstatistik satırındaki `.kg-panel`
   `contents` kalmaya devam eder (flex satırına akması için); yalnız grafik kabı blok olur. */
.clv-kasalar .kg-panel.kg-sar { display: none; }
body:has(#clv-ks-p10:checked) #clv-kasalar .kg-panel.kg-sar[data-secenek="p10"],
body:has(#clv-ks-p5:checked) #clv-kasalar .kg-panel.kg-sar[data-secenek="p5"],
body:has(#clv-ks-p3:checked) #clv-kasalar .kg-panel.kg-sar[data-secenek="p3"],
body:has(#clv-ks-norm:checked) #clv-kasalar .kg-panel.kg-sar[data-secenek="norm"],
body:has(#clv-ks-p10s:checked) #clv-kasalar .kg-panel.kg-sar[data-secenek="p10s"] { display: block; }
body:not(:has(input[name="clv-ks"]:checked)) #clv-kasalar .kg-panel.kg-sar[data-secenek="p3"] { display: block; }

/* KAPATILAN GÖLGELER (19 Eylül 2026, kullanıcı: "kapalı modeller normalde gözükmesin, ona
   tıklayınca açılsın, sonra tıklayınca gene kapansın"). Anahtar `#gm-kapali-ac` gövdenin
   DIŞINDA (htmx tazelemesi gövdeyi yeniden basıyor, içeride olsa sıfırlanırdı); kural kardeş
   seçiciyle gövdeye iniyor. Sunucuya istek yok, JS yok — kasa seyri seçenekleriyle aynı kalıp. */
#golge-govde .gm-kapali { display: none; }
#gm-kapali-ac:checked ~ #golge-govde .gm-kapali { display: block; }
.gm-kapali-dugme { margin-inline-start: auto; cursor: pointer; }
.gm-kapali-dugme .gm-k-gizle { display: none; }
#gm-kapali-ac:checked ~ #golge-govde .gm-kapali-dugme .gm-k-goster { display: none; }
#gm-kapali-ac:checked ~ #golge-govde .gm-kapali-dugme .gm-k-gizle { display: inline; }

/* ---------------------------------------------------------------- Kural etkisi ("ne değişir?")
   Bir eşiği DEĞİŞTİRMEDEN kasaya ne girip ne çıkacağını gösteren pencere (kullanıcı 21 Eylül
   2026: "kurallarda kasada giren ve çıkan bahisler de"). Ölçü kasa/kural_etki.py — ayrı süreçte
   koşan hakemli tarama. Burada hiçbir şey kaydedilmez, o yüzden görsel dili de kaydetme
   formundan AYRI: kesikli çerçeve, "deneme" olduğu bir bakışta belli olsun. */
.kr-dene { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin-top: 6px;
           padding: 6px 9px; border: 1px dashed var(--cizgi-renk, var(--murekkep));
           border-radius: 8px; width: fit-content; max-width: 100%; }
.kr-dene .minik { color: var(--sonuk); }
.kei { display: none; font-size: 12px; color: var(--sonuk); }
.htmx-request .kei, .kei.htmx-request { display: inline; }
.ke-kutu:empty { display: none; }
.ke-sonuc { margin-top: 10px; padding: 12px 14px; border: 1px solid var(--cizgi-renk, var(--murekkep));
            border-radius: 10px; background: var(--kart-zemin, transparent); }
.ke-baslik { display: flex; gap: 10px; align-items: baseline; flex-wrap: wrap; margin-bottom: 10px; }
.ke-baslik .minik { color: var(--sonuk); margin-left: auto; }
.ke-kapat { margin-left: 6px; }
.ke-sayilar { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 10px;
              margin-bottom: 12px; }
.ke-kutucuk { display: flex; flex-direction: column; gap: 1px; }
.ke-kutucuk .e { font-size: 11px; letter-spacing: .04em; text-transform: uppercase; color: var(--sonuk); }
.ke-kutucuk .b { font-size: 17px; font-weight: 650; font-variant-numeric: tabular-nums; }
.ke-kutucuk .f { font-size: 12.5px; font-variant-numeric: tabular-nums; }
.ke-liste { margin-top: 12px; }
.ke-liste h4 { margin: 0 0 5px; font-size: 13px; font-weight: 650; }
.ke-liste h4 span { font-weight: 600; margin-left: 6px; font-variant-numeric: tabular-nums; }
.ke-tablo { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.ke-tablo th { text-align: left; font-size: 10.5px; letter-spacing: .04em; text-transform: uppercase;
               color: var(--sonuk); font-weight: 600; padding: 3px 8px 3px 0; white-space: nowrap; }
.ke-tablo td { padding: 3px 8px 3px 0; border-top: 1px solid var(--cizgi-renk, var(--murekkep));
               white-space: nowrap; }
.ke-tablo .sag { text-align: right; }
.ke-tablo .sayi { font-variant-numeric: tabular-nums; }
.ke-kapsam { margin-top: 12px; }
.ke-kapsam summary { cursor: pointer; font-size: 11.5px; letter-spacing: .04em;
                     text-transform: uppercase; color: var(--sonuk); }
.ke-kapsam p, .ke-kapsam ul { font-size: 12px; line-height: 1.55; max-width: 80ch; }
.ke-kapsam ul { margin: 6px 0; padding-left: 20px; }
@media (max-width: 720px) {
  .kr-dene { width: 100%; }
  .ke-tablo { font-size: 11.5px; }
}
/* IZGARA ÖĞESİNİN `min-width: auto`SU: `.kr-esik` `.kr-liste` ızgarasının öğesi ve varsayılan
   `min-width: auto` ile İÇERİĞİ KADAR genişleyebiliyor — sonuç tablosu açılınca 420 pikselde
   sayfa 491'e taşıyordu (`.tablo-sar`ın kendi kaydırması devreye bile girmiyordu, çünkü
   kapsayıcı büyüyordu). Zinciri sıfırlıyoruz. */
.kr-esik, .ke-kutu, .ke-sonuc, .ke-liste { min-width: 0; }


/* KASA SEYRİ ÇİZGİ GRAFİĞİ (svg.kg) — 16 Ekim 2026'da stil.css'ten (Brütalist) buraya taşındı:
   kasa ve genel bakış sayfaları da bu bileşene geçti ve öteki dört temada hiç stili yoktu.
   Renkler tema değişkenlerinden, yani her temada ve koyu modda kendiliğinden doğru. */
/* Kasa seyri çizgi grafiği (12 Eylül 2026): ince kılavuz, gün bantları, mürekkep çizgi, sonuç renkli noktalar,
   :hover ile çapraz çizgi + ipucu (JS yok). Renkler tema değişkenlerinden, koyu temada kendiliğinden. */
svg.kg { font-family: "JetBrains Mono", ui-monospace, monospace; overflow: visible; }
svg.kg .kg-gun { fill: var(--murekkep); fill-opacity: .045; }
svg.kg .kg-gun-cizgi { stroke: var(--murekkep); stroke-opacity: .18; stroke-width: 1; }
svg.kg .kg-gun-yazi { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; fill: var(--sonuk); }
svg.kg .kg-kilavuz { stroke: var(--murekkep); stroke-opacity: .12; stroke-width: 1; }
svg.kg .kg-centik { font-size: 11px; fill: var(--sonuk); font-variant-numeric: tabular-nums; }
svg.kg .kg-yikama.kg-kazanc { fill: var(--kazanc); fill-opacity: .12; }
svg.kg .kg-yikama.kg-kayip { fill: var(--kayip); fill-opacity: .12; }
svg.kg .kg-taban { stroke: var(--murekkep); stroke-width: 1.5; stroke-opacity: .7; }
svg.kg .kg-taban-yazi { font-size: 10px; fill: var(--sonuk); letter-spacing: .06em; text-transform: uppercase; }
svg.kg .kg-cizgi { fill: none; stroke: var(--murekkep); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
svg.kg .kg-nokta { stroke: var(--kagit); stroke-width: 2; }
svg.kg .kg-nokta.kg-kazanc { fill: var(--kazanc); }
svg.kg .kg-nokta.kg-kayip { fill: var(--kayip); }
/* İADE (19 Eylül 2026): kasa kıpırdamadı, ne kazanç ne kayıp — üçüncü hâl, üçüncü renk.
   YALNIZ DOLGU DEĞİŞİR: halka ve kalınlık `.kg-nokta`dan gelir (kâğıt, 2), yani yeşil/kırmızıyla
   BİREBİR aynı biçim. İlk denemede `--sari` + mürekkep halka yazılmıştı; kullanıcı "sarılar
   diğerlerinden farklı duruyor, çevresi mi" dedi ve haklıydı — koyu halka noktayı çerçeveli bir
   jetona çeviriyordu. Asıl hata rengin kaynağıydı: `--sari` bu tema sözlüğünde YÜZEY rengi
   (levha zemini), İŞARET rengi değil — İsviçre'de #F2F2F2 (beyaza yakın), Beton'da #CBD2D5 gri,
   Sade koyuda #4A4222 kahve. Kâğıt halkayla görünmemesinin sebebi buydu, halkanın kendisi değil.
   `--iade` artık `--kazanc`/`--kayip` ile aynı sınıftan, her temanın üç bloğunda da tanımlı. */
svg.kg .kg-nokta.kg-iade { fill: var(--iade, #E8A000); }
svg.kg .kg-etiket { font-size: 12px; font-weight: 700; fill: var(--murekkep); paint-order: stroke; stroke: var(--kagit); stroke-width: 4px; stroke-linejoin: round; }
svg.kg .kg-son-levha { fill: var(--sari); }
svg.kg .kg-son-yazi { font-size: 15px; font-weight: 700; fill: #000; }
svg.kg .kg-hedef { fill: transparent; }
svg.kg .kg-ipucu { display: none; pointer-events: none; }
svg.kg .kg-sutun:hover .kg-ipucu { display: block; }
svg.kg .kg-capraz { stroke: var(--murekkep); stroke-width: 1; stroke-opacity: .5; }
svg.kg .kg-halka { fill: none; stroke: var(--murekkep); stroke-width: 2; }
svg.kg .kg-ipucu-kutu { fill: var(--kagit); stroke: var(--murekkep); stroke-width: 2; }
svg.kg .kg-ipucu-kasa { font-size: 15px; font-weight: 700; fill: var(--murekkep); }
svg.kg .kg-ipucu-kazanc { fill: var(--kazanc); } svg.kg .kg-ipucu-kayip { fill: var(--kayip); }
svg.kg .kg-ipucu-iade { fill: var(--murekkep); }   /* iadede kâr +0: yeşil yazmak yanıltıyordu */
svg.kg .kg-ipucu-satir { font-size: 11px; fill: var(--sonuk); }
@media (max-width: 620px) {
  svg.kg .kg-gun-yazi, svg.kg .kg-centik { font-size: 14px; }
  svg.kg .kg-gun-n { display: none; }
  svg.kg .kg-etiket { font-size: 16px; } svg.kg .kg-son-yazi { font-size: 18px; }
  svg.kg .kg-ipucu-kasa { font-size: 19px; } svg.kg .kg-ipucu-satir { font-size: 14px; }
}

/* Dar ekranda ayrı çizim (bkz. _parcalar.html `grafik`): 900 birimlik çizim telefonda okunmuyor. */
svg.kg.kg-dar { display: none; }
@media (max-width: 620px) {
  svg.kg.kg-genis { display: none; }
  svg.kg.kg-dar { display: block; }
  svg.kg.kg-dar .kg-gun-yazi, svg.kg.kg-dar .kg-centik { font-size: 12px; }
  svg.kg.kg-dar .kg-son-yazi { font-size: 15px; }
}

/* ---------- öteki sitede (16 Ekim 2026, /kasa/{id}/karsi ve genel bakış sütunu) ---------- */
.asil.arti { color: var(--kazanc); }
.asil.eksi { color: var(--kayip); }
.karsi-bag { color: inherit; font-weight: 700; text-decoration: underline dotted; text-underline-offset: 3px; }
.karsi-tablo .karsi-oran { font-size: 15px; font-family: "JetBrains Mono", ui-monospace, monospace; }
.karsi-tablo .karsi-bacak + .karsi-bacak { margin-top: 4px; }
.karsi-tablo .minik { display: block; font-size: 11.5px; }
.karsi-tablo .minik-hucre { white-space: nowrap; font-size: 12px; color: var(--sonuk); }
.karsi-desen { padding: 0 16px; line-height: 1.55; }
.karsi-desen ul { padding-left: 18px; }
.karsi-desen li { margin: 6px 0; }
/* Genel bakışın kasa tablosu "Öteki sitede" sütunuyla 12 sütun: 1280'de sığsın diye yatay boşluk dar. */
.kasa-tablo th, .kasa-tablo td { padding-left: 10px; padding-right: 10px; }
/* Telefonda sütun gizli, bilgi bakiyenin altında (`.dar-goster`). */
.tablo .dar-goster { display: none; }
@media (max-width: 620px) {
  .tablo .dar-goster { display: block; text-decoration: underline dotted; }
}
.karsi-tablo td.karsi-mac { white-space: normal; min-width: 180px; }
.karsi-not { padding: 8px 16px; }