/* İlk 11'ini Kur (/spor/ilk-11/): takım seçimi, maç kutusu, diziliş, saha, yedekler, sonuç şeridi,
   son kurulan 11'ler akışı, oyuncu seçme paneli ve paylaşım penceresi. Sitenin spor rengi: kırmızı #fe0000. */

/* Üye kontrolü bitene kadar (hazir sınıfı gelene kadar) başlık ve bekleme notu dışında hiçbir şey görünmez */
.ilk11:not(.hazir) > :not(.title):not(.ilk11Bekle) { display: none; }
.ilk11Bekle { padding: 24px 0; color: var(--i11-fg2); font-size: 14px; }
.ilk11.hazir .ilk11Bekle { display: none; }

.ilk11 {
    --i11-kirmizi: #fe0000;
    --i11-fg: #1c1b19;
    --i11-fg2: #6b6862;
    --i11-cizgi: #dcd9d3;
    --i11-yuzey: #fff;
    --i11-yuzey2: #f1efeb;
    --i11-saha: #2e8b4a;
    --i11-saha2: #2a7f43;
    --i11-saha-cizgi: rgba(255,255,255,.75);
    --i11-iyi: #1d8a4b;
    --i11-kotu: #c8261f;
    --i11-altin: #d9a200;
    --i11-dis: "Barlow Condensed", "Arial Narrow", Arial, sans-serif;
    color: var(--i11-fg);
    font-family: Inter, Arial, sans-serif;
    font-size: 15px;
    line-height: 1.4;
}

    .ilk11 *, .ilk11 *::before, .ilk11 *::after { box-sizing: border-box; }
    .ilk11 button { font-family: inherit; font-size: inherit; color: inherit; cursor: pointer; }
    .ilk11 button:disabled { cursor: not-allowed; }
    .ilk11 h2, .ilk11 h3 { font-family: var(--i11-dis); margin: 0; line-height: 1.05; }
    .ilk11 [hidden] { display: none !important; }

/* Sayfa başlığı sitenin h1.title stilinde kalır (Inter 36px) */
.ilk11 h1.title { margin-bottom: 16px; }
/* Spor sayfalarında header gövdeye masaüstünde 222px, mobilde 156px üst boşluk verir; spor sayfaları bunu spAltMenü'nün eksi üst marjıyla
   daraltır (spor-veri.css). Bu sayfada o menü yok, aynı daraltma burada yapılır: şerit ile başlık arası masaüstü 28px, tablet ~22px, telefon 20px */
@media (min-width: 1025px) { .ilk11 { margin-top: -34px; } }
@media (min-width: 768px) and (max-width: 1024px) { .ilk11 { margin-top: -23px; } }
@media (max-width: 767px) { .ilk11 { margin-top: -40px; } }
.ilk11 { padding-bottom: 40px; }   /* içerik footer'a yapışmasın */

/* Kurma alanı üstte (dar sütun, ortada), son kurulan 11'ler altında tam genişlikte */
.ilk11Iki { display: grid; grid-template-columns: 1fr; gap: 32px; }
.ilk11Kur, .ilk11Akis { min-width: 0; }
.ilk11Kur { width: 100%; max-width: 560px; margin: 0 auto; }

/* ---- Takımlar: tek satır, yatay kaydırma; iki yanda ok (sığıyorsa oklar gizli); logo üstte ad altta ---- */
.ilk11TakimSerit { position: relative; margin-bottom: 14px; border-radius: 12px; background: var(--i11-yuzey); border: 1px solid var(--i11-cizgi); padding: 4px 6px; }   /* beyaz kart: arkası beyaz logolar sayfa zemininde sırıtmasın */
    /* Takım seçilmeden tahtaya dokunulunca şerit kısa süre vurgulanır */
    .ilk11TakimSerit.dikkat { animation: ilk11Dikkat 1.4s ease; }
@keyframes ilk11Dikkat { 0%, 100% { box-shadow: none; } 25%, 60% { box-shadow: 0 0 0 3px var(--i11-kirmizi); } }
/* Pasif düğmelerde tık kapsayıcıya düşer, orada eksik olan söylenir */
.ilk11Dizilis:disabled, .ilk11Yedek:disabled, .ilk11AltBar .ilk11Btn:disabled { pointer-events: none; }
.ilk11Takimlar { display: flex; flex-wrap: nowrap; gap: 4px; padding: 4px 2px; overflow-x: auto; scroll-behavior: smooth; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
    .ilk11Takimlar::-webkit-scrollbar { display: none; }
.ilk11Ok { width: 32px; height: 32px; border: 1px solid #e3e3e3; border-radius: 50%; background: #fff; box-shadow: 0 1px 4px rgba(0,0,0,.2); position: absolute; top: 50%; z-index: 2; transform: translateY(-50%); padding: 0; }
    .ilk11Ok.geri { left: -12px; }
    .ilk11Ok.ileri { right: -12px; }
    .ilk11Ok::before { content: ""; position: absolute; top: 50%; left: 50%; width: 8px; height: 8px; border-top: 2px solid #333; border-right: 2px solid #333; transform: translate(-65%, -50%) rotate(45deg); }
    .ilk11Ok.geri::before { transform: translate(-35%, -50%) rotate(-135deg); }
    .ilk11Ok:disabled { visibility: hidden; }
.ilk11Takim { flex: 0 0 auto; min-width: 76px; display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 6px 8px; border: 1px solid transparent; border-radius: 10px; background: none; scroll-snap-align: center; }
    .ilk11Takim:hover { background: var(--i11-yuzey); border-color: var(--i11-cizgi); }
    .ilk11Takim.secili { background: var(--i11-yuzey); border-color: var(--i11-fg); box-shadow: inset 0 0 0 1px var(--i11-fg); }
    .ilk11Takim img { width: 40px; height: 40px; object-fit: contain; }
    .ilk11Takim .ad { font-weight: 600; font-size: 11px; line-height: 1.15; text-align: center; white-space: nowrap; color: var(--i11-fg2); }
    .ilk11Takim.secili .ad { color: var(--i11-fg); }
@media (max-width: 480px) { .ilk11Takim { min-width: 62px; padding: 6px 6px; } .ilk11Takim img { width: 34px; height: 34px; } .ilk11Takim .ad { font-size: 10px; } }

/* ---- Maç kutusu ---- */
/* Maç kutusu: üç satır ortalı; karşılaşma, lig ve saat, kilit durumu */
.ilk11Mac { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px; background: var(--i11-yuzey); border: 1px solid var(--i11-cizgi); border-radius: 12px; padding: 12px; margin-bottom: 10px; }
    .ilk11Mac .eslesme { font-family: var(--i11-dis); font-weight: 700; font-size: 22px; line-height: 1.1; display: flex; align-items: center; justify-content: center; gap: 8px; flex-wrap: nowrap; max-width: 100%; }
    .ilk11Mac .eslesme span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .ilk11Mac .eslesme .tire { color: var(--i11-fg2); font-weight: 500; }
    .ilk11Mac .eslesme img { width: 40px; height: 40px; object-fit: contain; flex: 0 0 auto; }
    .ilk11Mac .zaman { color: var(--i11-fg2); font-size: 13px; }
        .ilk11Mac .zaman .stad { display: block; font-size: 12px; margin-top: 2px; }   /* lig ve saatin altında stadyum */
    .ilk11Mac .kilit { font-size: 11px; text-transform: uppercase; letter-spacing: .08em; padding: 4px 8px; border-radius: 6px; background: var(--i11-yuzey2); color: var(--i11-fg2); white-space: nowrap; margin-top: 2px; }
        .ilk11Mac .kilit.acik { background: var(--i11-kotu); color: #fff; }
.ilk11MacYok { padding: 4px 0; color: var(--i11-fg2); margin-bottom: 12px; }   /* düz bilgi notu, giriş alanı gibi görünmesin */

/* ---- Diziliş ---- */
.ilk11Dizilisler { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 10px; }
.ilk11Dizilis { font-family: var(--i11-dis); font-weight: 700; font-size: 16px; letter-spacing: .04em; padding: 5px 11px; border-radius: 8px; border: 1px solid var(--i11-cizgi); background: var(--i11-yuzey); }
    .ilk11Dizilis.secili { background: var(--i11-fg); color: #fff; border-color: var(--i11-fg); }

/* ---- Saha ---- */
.ilk11Saha { position: relative; width: 100%; max-width: 100%; aspect-ratio: 3 / 4; border-radius: 14px; overflow: hidden; background: repeating-linear-gradient(180deg, var(--i11-saha) 0 12.5%, var(--i11-saha2) 12.5% 25%); box-shadow: 0 6px 20px rgba(28,27,25,.10); }
    .ilk11Saha svg.cizgiler { position: absolute; inset: 0; width: 100%; height: 100%; }
.ilk11Slot { position: absolute; left: var(--x); top: var(--y); transform: translate(-50%, -50%); width: 19%; display: flex; flex-direction: column; align-items: center; gap: 3px; border: 0; background: none; padding: 0; }

/* Stadyum görünümü, yatay (masaüstü: ana tahta, akış kartları ve paylaşılan 11 kartı): 16:9 fotoğraf olduğu gibi, yuvalar perspektif konumunda */
@media (min-width: 1025px) {
    .ilk11Kur { max-width: 920px; }
    .ilk11Saha.stadyum:not(.dikey) { aspect-ratio: 1672 / 941; background: #0c1526 url(/mstatic/assets/img/ilk11/stadyum.jpg?v=2) center / 100% 100% no-repeat; }
    .ilk11Saha.stadyum:not(.dikey) .ilk11Slot { left: var(--sx); top: var(--sy); width: 12%; transform: translate(-50%, -50%) scale(var(--sk, 1)); }
    .ilk11Saha.stadyum:not(.dikey) .ilk11Forma { width: 48px; height: 48px; font-size: 19px; }
    .ilk11Saha.stadyum:not(.dikey) .ilk11Slot .isim { font-size: 13px; }
    /* Akış kartları da stadyum: 5 satır sığsın diye kartlar 2 sütun, forma ve yazı küçük */
    .ilk11Kartlar { grid-template-columns: 1fr 1fr; }
    /* Küçük kartta yuva boyları kart genişliğine oranlı (cqw): satır aralığı yüksekliğin %14,75'i, yuva (forma + ad) bunun altında kalır */
    .ilk11Saha.mini.stadyum:not(.dikey) { border-radius: 10px; container-type: inline-size; }
    .ilk11Saha.mini.stadyum:not(.dikey) .ilk11Forma { width: 5.2cqw; height: 5.2cqw; font-size: 2.2cqw; border-width: 1px; }
    .ilk11Saha.mini.stadyum:not(.dikey) .ilk11Forma .no { min-width: 2.6cqw; height: 2.6cqw; font-size: 1.6cqw; right: -.7cqw; bottom: -.5cqw; padding: 0 .3cqw; border-radius: 1.3cqw; }
    .ilk11Saha.mini.stadyum:not(.dikey) .ilk11Slot { gap: .3cqw; width: 14%; }
    .ilk11Saha.mini.stadyum:not(.dikey) .ilk11Slot .isim { font-size: 1.9cqw; line-height: 1.3; padding: 0 .8cqw; border-radius: .6cqw; }
    .ilk11Saha.mini.stadyum:not(.dikey) .ilk11Kaptan, .ilk11Saha.mini.stadyum:not(.dikey) .ilk11Is { width: 2.6cqw; height: 2.6cqw; font-size: 1.6cqw; }
    .ilk11Saha.mini.stadyum:not(.dikey) .ilk11Kaptan { right: -.6cqw; top: -.6cqw; }
    .ilk11Saha.mini.stadyum:not(.dikey) .ilk11Is { left: -.6cqw; top: -.6cqw; }
}
.ilk11Forma { width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center; font-family: var(--i11-dis); font-weight: 800; font-size: 19px; color: #fff; background: linear-gradient(160deg, var(--r1) 50%, var(--r2) 50%); box-shadow: 0 2px 6px rgba(0,0,0,.35); text-shadow: 0 1px 2px rgba(0,0,0,.6); position: relative; flex: 0 0 auto; }
    .ilk11Forma.fotolu { background: #fff; border: 2px solid #fff; }
    .ilk11Forma img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; display: block; }
    .ilk11Forma .no { position: absolute; right: -6px; bottom: -5px; min-width: 19px; height: 19px; padding: 0 4px; border-radius: 10px; background: #1c1b19; color: #fff; font-size: 11px; display: grid; place-items: center; text-shadow: none; border: 1px solid #fff; }
.ilk11Slot.bos .ilk11Forma { background: rgba(0,0,0,.18); border: 2px dashed var(--i11-saha-cizgi); font-size: 12px; letter-spacing: .06em; text-shadow: none; box-shadow: none; }
.ilk11Slot .isim { font-size: 12px; font-weight: 600; color: #fff; background: rgba(0,0,0,.45); padding: 1px 6px; border-radius: 4px; max-width: 150%; white-space: nowrap; letter-spacing: -.01em; }   /* uzun soyad kesilmez, slotun iki yanına taşar */
.ilk11Slot.bos .isim { background: rgba(0,0,0,.35); color: #fff; font-weight: 500; }   /* çizgi üstüne denk gelse de okunur */
.ilk11Kaptan { position: absolute; right: -5px; top: -5px; width: 18px; height: 18px; border-radius: 50%; background: var(--i11-altin); color: #1c1b19; font-size: 11px; font-weight: 800; display: grid; place-items: center; font-family: var(--i11-dis); text-shadow: none; }
.ilk11Is { position: absolute; left: -5px; top: -5px; width: 18px; height: 18px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 800; color: #fff; text-shadow: none; }
    .ilk11Is.tuttu { background: var(--i11-iyi); }
    .ilk11Is.tutmadi { background: var(--i11-kotu); }
.ilk11Saha.kilitli .ilk11Slot { cursor: default; }
@media (hover: hover) { .ilk11Saha:not(.kilitli) .ilk11Slot:not(.bos):hover .ilk11Forma { transform: scale(1.06); transition: transform .15s; } }

/* Mini saha (akış kartı) */
.ilk11Saha.mini { border-radius: 10px; box-shadow: none; }
    .ilk11Saha.mini .ilk11Forma { width: 40px; height: 40px; font-size: 16px; box-shadow: none; }
    .ilk11Saha.mini .ilk11Forma .no { min-width: 16px; height: 16px; font-size: 10px; right: -5px; bottom: -4px; }
    .ilk11Saha.mini .isim { font-size: 11px; padding: 0 5px; }
    .ilk11Saha.mini .ilk11Kaptan { width: 16px; height: 16px; font-size: 10px; right: -4px; top: -4px; }
    .ilk11Saha.mini .ilk11Is { width: 16px; height: 16px; font-size: 10px; left: -4px; top: -4px; }
    .ilk11Saha.mini .ilk11Slot { cursor: default; }

/* Stadyum görünümü, dikey (telefon/tablet: ana tahta, akış kartları, paylaşılan 11 kartı): 3:4 fotoğraf olduğu gibi, yuvalar perspektif konumunda */
.ilk11Saha.stadyum { background: #0c1526 url(/mstatic/assets/img/ilk11/stadyum-dikey.jpg?v=2) center / 100% 100% no-repeat; }
    .ilk11Saha.stadyum svg.cizgiler { display: none; }
    .ilk11Saha.stadyum .ilk11Slot { left: var(--dx); top: var(--dy); transform: translate(-50%, -50%) scale(var(--dk, 1)); }
    .ilk11Saha.stadyum .ilk11Forma { width: 40px; height: 40px; font-size: 16px; }
    .ilk11Saha.stadyum .isim { font-size: 11px; }
/* 5 kişilik sıra telefon/tablette tek düz çizgide kalır: forma ve ad biraz küçük, adlar birbirine değmez (masaüstünde yer yeterli) */
@media (max-width: 1024px) {
    .ilk11Saha.stadyum .ilk11Slot.sik .ilk11Forma { width: 36px; height: 36px; font-size: 14px; }
    .ilk11Saha.stadyum .ilk11Slot.sik .isim { font-size: 9px; letter-spacing: -.02em; padding: 0 3px; }
}
    .ilk11Saha.mini.stadyum .ilk11Forma { width: 36px; height: 36px; font-size: 14px; }
    .ilk11Saha.mini.stadyum .ilk11Forma .no { min-width: 15px; height: 15px; font-size: 9px; }
    .ilk11Saha.mini.stadyum .isim { font-size: 10px; padding: 0 4px; }
    .ilk11Saha.mini.stadyum .ilk11Slot { gap: 2px; }

/* ---- Yedekler ---- */
.ilk11YedekBaslik { font-size: 12px; text-transform: uppercase; letter-spacing: .1em; color: var(--i11-fg2); margin: 12px 0 6px; }
.ilk11Yedekler { display: flex; gap: 8px; flex-wrap: wrap; }
.ilk11Yedek { display: flex; align-items: center; gap: 6px; padding: 4px 10px 4px 4px; border-radius: 999px; border: 1px solid var(--i11-cizgi); background: var(--i11-yuzey); font-size: 13px; }
    .ilk11Yedek .ilk11Forma { width: 28px; height: 28px; font-size: 13px; box-shadow: none; }
    .ilk11Yedek .ilk11Forma .no { display: none; }
    .ilk11Yedek.bos { border-style: dashed; color: var(--i11-fg2); }
        .ilk11Yedek.bos .ilk11Forma { background: var(--i11-yuzey2); color: var(--i11-fg2); text-shadow: none; font-size: 16px; }

/* ---- Alt bar ---- */
.ilk11AltBar { display: flex; align-items: center; gap: 10px; margin-top: 14px; flex-wrap: wrap; }
.ilk11Durum { font-family: var(--i11-dis); font-weight: 700; font-size: 20px; font-variant-numeric: tabular-nums; }
    .ilk11Durum small { font-family: Inter, Arial, sans-serif; font-weight: 500; font-size: 13px; color: var(--i11-fg2); margin-left: 6px; }
.ilk11Bos { flex: 1; }
.ilk11Btn { border: 1px solid var(--i11-cizgi); background: var(--i11-yuzey); padding: 9px 14px; border-radius: 9px; font-weight: 600; color: var(--i11-fg); text-decoration: none; display: inline-flex; align-items: center; justify-content: center; gap: 6px; }
    .ilk11Btn.ana { background: var(--i11-kirmizi); color: #fff; border-color: var(--i11-kirmizi); }
    .ilk11Btn.ana:disabled { opacity: .45; }
    .ilk11Btn.kucuk { padding: 6px 10px; font-size: 13px; }
.ilk11Not { font-size: 12px; color: var(--i11-fg2); margin-top: 10px; }

/* ---- Kayıt durumu: kayıtlı 11 mi, kaydedilmemiş değişiklik mi ---- */
.ilk11KayitDurum { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 13px; color: var(--i11-fg2); background: var(--i11-yuzey2); border-radius: 10px; padding: 8px 12px; margin-bottom: 10px; }
    .ilk11KayitDurum .uyari { color: var(--i11-kotu); font-weight: 600; }
    .ilk11KayitDurum button { border: 0; background: none; padding: 0; font-size: 13px; font-weight: 600; color: var(--i11-fg); text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }

/* ---- Sonuç şeridi ---- */
.ilk11Sonuc { display: flex; align-items: center; gap: 12px; background: var(--i11-yuzey); border: 1px solid var(--i11-cizgi); border-left: 5px solid var(--i11-iyi); border-radius: 12px; padding: 10px 12px; margin-bottom: 10px; }
    .ilk11Sonuc.kotu { border-left-color: var(--i11-kotu); }
    .ilk11Sonuc.notr { border-left-color: var(--i11-cizgi); }
    .ilk11Sonuc .yuzde { font-family: var(--i11-dis); font-weight: 800; font-size: 40px; line-height: 1; color: var(--i11-iyi); font-variant-numeric: tabular-nums; }
    .ilk11Sonuc.kotu .yuzde { color: var(--i11-kotu); }
    .ilk11Sonuc .aciklama { flex: 1; min-width: 0; }
        .ilk11Sonuc .aciklama b { display: block; font-family: var(--i11-dis); font-size: 18px; }
        .ilk11Sonuc .aciklama span { color: var(--i11-fg2); font-size: 13px; }
/* Rozet: amblem + koyu kalın ad, zeminsiz (amblem kırmızı, beyaz kartta kendini gösterir); amblemsiz "Rozet yok" soluk kutu */
.ilk11Rozet { display: inline-flex; align-items: center; gap: 8px; font-family: var(--i11-dis); font-weight: 700; font-size: 16px; letter-spacing: .02em; color: var(--i11-fg); white-space: nowrap; }
    .ilk11Rozet img { width: 48px; height: 48px; object-fit: contain; flex: 0 0 auto; }
    .ilk11Sonuc .ilk11Rozet { margin-left: auto; }
    .ilk11Rozet.gri { font-family: Inter, Arial, sans-serif; font-weight: 500; font-size: 12px; padding: 3px 9px; border-radius: 6px; background: var(--i11-yuzey2); color: var(--i11-fg2); margin-left: auto; }

/* ---- Akış ---- */
.ilk11Bolum { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin: 0 0 10px; }
    .ilk11Bolum h2 { font-size: 26px; font-weight: 800; text-transform: uppercase; }
    .ilk11Bolum span { color: var(--i11-fg2); font-size: 13px; }
.ilk11Filtre { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 12px; }
    .ilk11Filtre button { font-size: 13px; padding: 4px 10px; border-radius: 999px; border: 1px solid var(--i11-cizgi); background: var(--i11-yuzey); }
        .ilk11Filtre button.secili { background: var(--i11-fg); color: #fff; border-color: var(--i11-fg); }
.ilk11Kartlar { display: grid; gap: 14px; grid-template-columns: 1fr; }
@media (min-width: 640px) { .ilk11Kartlar { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1000px) and (max-width: 1024px) { .ilk11Kartlar { grid-template-columns: 1fr 1fr 1fr; } }   /* masaüstünde stadyum kartları 2 sütun (aşağıda) */
/* Kartlar aynı iskelette: üst bilgi tek satır, saha aynı hizada, alt çubuk en altta */
.ilk11Kart { background: var(--i11-yuzey); border: 1px solid var(--i11-cizgi); border-radius: 14px; overflow: hidden; min-width: 0; display: flex; flex-direction: column; }
.ilk11KartUst { display: flex; align-items: center; gap: 10px; padding: 10px 12px; }
.ilk11Avatar { width: 38px; height: 38px; border-radius: 50%; background: var(--i11-yuzey2); display: grid; place-items: center; font-family: var(--i11-dis); font-weight: 700; color: var(--i11-fg2); flex: 0 0 auto; overflow: hidden; }
    .ilk11Avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ilk11KartUst .kim { min-width: 0; flex: 1; }
    .ilk11KartUst .kim > b { display: block; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* Maç satırı: başlığın altında tam genişlik, "logo Ev - Dep logo"; altında maç saati. Çok uzun adlarda takım takım sarılır, kesilmez */
.ilk11KartMac { display: flex; flex-direction: column; align-items: center; align-self: flex-start; padding: 0 12px 10px; margin-top: -4px; font-size: 13px; color: var(--i11-fg2); }   /* saat, takım çiftinin altında ortalı */
    .ilk11KartMac .mac { display: flex; align-items: center; flex-wrap: wrap; gap: 2px 6px; }
        .ilk11KartMac .taraf { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }   /* logo ve ad birlikte kalır */
        .ilk11KartMac img { width: 20px; height: 20px; object-fit: contain; flex: 0 0 auto; }
        .ilk11KartMac b { color: var(--i11-fg); font-weight: 600; }
        .ilk11KartMac i { font-style: normal; }
    .ilk11KartMac .saat { display: block; margin-top: 3px; }
.ilk11KartUst .ne { text-align: right; font-size: 12px; color: var(--i11-fg2); white-space: nowrap; }
    .ilk11KartUst .ne b { display: block; font-family: var(--i11-dis); font-size: 17px; color: var(--i11-fg); }
.ilk11Kart .ilk11Saha { margin: 0 12px; width: auto; }
/* Kart altı iki sabit satır: sonuç satırı (yüzde, isim sayısı, rozet ya da bekleme notu; hiçbiri kısaltılmaz, sığmazsa sarılır)
   ve ince çizgiyle ayrılmış işlem satırı (beğeni solda, Paylaş / Kopyala sağda). Her kartta aynı yükseklik. */
.ilk11KartSonuc { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; padding: 10px 12px 8px; min-height: 46px; margin-top: auto; }
    .ilk11KartSonuc .puan { font-family: var(--i11-dis); font-weight: 800; font-size: 26px; line-height: 1; color: var(--i11-iyi); font-variant-numeric: tabular-nums; }
        .ilk11KartSonuc .puan.kotu { color: var(--i11-kotu); }
    .ilk11KartSonuc .isim { font-size: 12px; color: var(--i11-fg2); }
    .ilk11KartSonuc .ilk11Rozet { margin-left: auto; font-size: 14px; }
    .ilk11KartSonuc .ilk11Rozet img { width: 36px; height: 36px; }
    .ilk11KartSonuc .bekliyor { font-size: 13px; color: var(--i11-fg2); }
.ilk11KartIslem { display: flex; align-items: center; gap: 6px; padding: 8px 12px 10px; border-top: 1px solid var(--i11-cizgi); }
    .ilk11KartIslem .ilk11Bos { flex: 1 1 0; min-width: 0; }
    .ilk11KartIslem .ilk11Btn.kucuk { padding: 6px 10px; font-size: 12px; }
    .ilk11KartIslem .ilk11Begen { padding: 4px 6px; margin-left: -6px; }
.ilk11Begen { display: inline-flex; align-items: center; gap: 4px; border: 0; background: none; color: var(--i11-fg2); font-weight: 600; padding: 4px 6px; border-radius: 6px; }
    .ilk11Begen.aktif { color: var(--i11-kirmizi); }
.ilk11Daha { display: block; width: 100%; margin-top: 12px; }
.ilk11AkisBos { color: var(--i11-fg2); padding: 12px 0; }

/* ---- En çok bilenler: kişi listesi; kişiye tıklanınca kartlar o kişinin 11'leriyle dolar, üstte geri bağlantısı ---- */
.ilk11Kartlar.liste { display: block; }
.ilk11AkisGeri { display: flex; align-items: center; gap: 10px; margin: -4px 0 12px; font-size: 14px; }
    .ilk11AkisGeri button { border: 0; background: none; padding: 0; font-weight: 600; color: var(--i11-kirmizi); }
    .ilk11AkisGeri span { color: var(--i11-fg2); }
.ilk11Bilenler { list-style: none; margin: 0; padding: 0; background: var(--i11-yuzey); border: 1px solid var(--i11-cizgi); border-radius: 14px; overflow: hidden; }
    .ilk11Bilenler li + li { border-top: 1px solid var(--i11-cizgi); }
.ilk11Bilen { display: flex; align-items: center; gap: 10px; width: 100%; padding: 10px 12px; border: 0; background: none; text-align: left; }
    .ilk11Bilen:hover { background: var(--i11-yuzey2); }
    .ilk11Bilen .sira { font-family: var(--i11-dis); font-weight: 700; font-size: 18px; color: var(--i11-fg2); width: 26px; text-align: center; flex: 0 0 auto; }
    .ilk11Bilen .ilk11Avatar { width: 34px; height: 34px; font-size: 15px; }
    .ilk11Bilen .kim { flex: 1; min-width: 0; }
        .ilk11Bilen .kim b { display: block; font-weight: 600; }
        .ilk11Bilen .kim span { display: block; font-size: 12px; color: var(--i11-fg2); }
    .ilk11Bilen .yuzde { font-family: var(--i11-dis); font-weight: 800; font-size: 24px; line-height: 1; color: var(--i11-iyi); font-variant-numeric: tabular-nums; flex: 0 0 auto; }
        .ilk11Bilen .yuzde.kotu { color: var(--i11-kotu); }
        .ilk11Bilen .yuzde small { font-family: Inter, Arial, sans-serif; font-weight: 500; font-size: 11px; color: var(--i11-fg2); margin-left: 4px; }

/* ---- Rozet eşikleri: tahta notunun altında tek satır ---- */
.ilk11Rozetler { display: flex; flex-wrap: wrap; gap: 10px 22px; margin-top: 12px; font-size: 12px; color: var(--i11-fg2); }
    .ilk11Rozetler > span { display: inline-flex; flex-direction: column; align-items: center; gap: 2px; text-align: center; min-width: 96px; }
    .ilk11Rozetler img { width: 56px; height: 56px; object-fit: contain; }
    .ilk11Rozetler b { font-weight: 600; color: var(--i11-fg); }

/* ---- Oyuncu seçme paneli ---- */
.ilk11Perde { position: fixed; inset: 0; background: rgba(0,0,0,.45); display: none; z-index: 1000; }
    .ilk11Perde.acik { display: block; }
.ilk11Panel { position: fixed; left: 0; right: 0; bottom: 0; background: var(--i11-yuzey); border-radius: 16px 16px 0 0; z-index: 1001; max-height: 78vh; display: none; flex-direction: column; padding: 0 16px env(safe-area-inset-bottom, 0px); box-shadow: 0 -8px 30px rgba(0,0,0,.25); }
    .ilk11Panel.acik { display: flex; }
@media (min-width: 760px) { .ilk11Panel { left: 50%; right: auto; bottom: auto; top: 50%; transform: translate(-50%, -50%); width: 420px; max-height: 80vh; border-radius: 16px; } }
.ilk11PanelUst { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 0 8px; }
    .ilk11PanelUst h3 { font-size: 20px; }
    .ilk11PanelUst small { display: block; font-family: Inter, Arial, sans-serif; font-size: 13px; color: var(--i11-fg2); font-weight: 400; }
.ilk11Kapat { border: 0; background: var(--i11-yuzey2); width: 32px; height: 32px; border-radius: 50%; font-size: 18px; line-height: 1; flex: 0 0 auto; }
.ilk11Islemler { display: flex; gap: 8px; padding-bottom: 8px; flex-wrap: wrap; }
.ilk11Ara { width: 100%; padding: 9px 12px; border-radius: 9px; border: 1px solid var(--i11-cizgi); background: #fafaf8; color: var(--i11-fg); margin-bottom: 8px; font: inherit; }
.ilk11Liste { overflow-y: auto; margin: 0; padding: 0 0 12px; list-style: none; flex: 1; min-height: 0; }
    .ilk11Liste button { width: 100%; display: flex; align-items: center; gap: 10px; padding: 8px 6px; border: 0; border-top: 1px solid var(--i11-cizgi); background: none; text-align: left; }
        .ilk11Liste button .ilk11Forma { width: 34px; height: 34px; font-size: 15px; box-shadow: none; }
        .ilk11Liste button .ilk11Forma .no { display: none; }
        .ilk11Liste button .oad { flex: 1; font-weight: 600; min-width: 0; }
            .ilk11Liste button .oad small { display: block; font-weight: 400; color: var(--i11-fg2); font-size: 12px; }
        .ilk11Liste button .nerede { font-size: 12px; color: var(--i11-fg2); white-space: nowrap; }
        .ilk11Liste button.sahada { opacity: .55; }
    .ilk11Liste li.bos { padding: 12px; color: var(--i11-fg2); }
    .ilk11Liste li.ayrac { padding: 10px 6px 4px; font-size: 11px; text-transform: uppercase; letter-spacing: .1em; color: var(--i11-fg2); border-top: 1px solid var(--i11-cizgi); margin-top: 4px; }

/* ---- Pencere (giriş, paylaşım) ---- */
.ilk11Modal { position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); width: min(92vw, 440px); max-height: 90vh; overflow: auto; background: var(--i11-yuzey); border-radius: 16px; padding: 18px; z-index: 1002; display: none; box-shadow: 0 20px 60px rgba(0,0,0,.4); }
    .ilk11Modal.acik { display: block; }
    .ilk11Modal h3 { font-size: 24px; margin-bottom: 6px; }
    #ilk11Giris h3 { margin-bottom: 14px; }   /* açıklama yok, başlıkla düğmeler arası boşluk */
    .ilk11Modal p { margin: 0 0 12px; color: var(--i11-fg2); }
    .ilk11Modal .duzen { display: grid; gap: 8px; }
/* Önizleme: hikâye (9:16) görseli düğmeleri aşağı itmesin diye yüksekliği sınırlı */
.ilk11Onizleme { display: block; max-width: 100%; max-height: 50vh; width: auto; margin: 0 auto 10px; border-radius: 10px; border: 1px solid var(--i11-cizgi); background: var(--i11-yuzey2); }
.ilk11Boyutlar { display: flex; gap: 6px; margin-bottom: 10px; }
    .ilk11Boyutlar button { flex: 1; }
    .ilk11Boyutlar button small { font-weight: 500; color: var(--i11-fg2); }
    .ilk11Boyutlar button.secili { background: var(--i11-kirmizi); color: #fff; border-color: var(--i11-kirmizi); }
    .ilk11Boyutlar button.secili small { color: rgba(255,255,255,.85); }
/* Kanallar: ikili sıra, ana kanal tam genişlik */
.ilk11Kanallar { display: flex; flex-wrap: wrap; gap: 8px; }
    .ilk11Kanallar a, .ilk11Kanallar button { flex: 1 1 calc(50% - 4px); display: flex; align-items: center; justify-content: center; gap: 6px; padding: 10px; border-radius: 9px; border: 1px solid var(--i11-cizgi); background: #fafaf8; text-decoration: none; color: var(--i11-fg); font-weight: 600; font-size: 14px; }
    .ilk11Kanallar .ana { flex-basis: 100%; background: var(--i11-kirmizi); color: #fff; border-color: var(--i11-kirmizi); }
.ilk11PaylasAlt { display: flex; justify-content: center; gap: 18px; margin-top: 10px; }
    .ilk11PaylasAlt button { border: 0; background: none; padding: 4px 0; font-size: 13px; font-weight: 600; color: var(--i11-fg2); text-decoration: underline; text-underline-offset: 3px; }

/* ---- Paylaşılan 11 sayfası (/k/{kod}/) bir iniş sayfasıdır: kart, altında çağrı (sen de kur / bu 11'le başla), altında takımın haberleri.
   Tahta ve takım şeridi burada gösterilmez; her iki düğme takımın kurma sayfasına götürür. ---- */
.ilk11.paylasim > .ilk11TakimSerit, .ilk11.paylasim .ilk11Kur { display: none; }
.ilk11Paylasilan { max-width: 560px; margin: 0 auto 28px; }
@media (min-width: 1025px) { .ilk11Paylasilan { max-width: 920px; } }   /* masaüstünde kart yatay stadyumla ana tahta genişliğinde */
    .ilk11Paylasilan .ilk11Kart .ilk11Saha { box-shadow: none; }
    .ilk11Paylasilan .ilk11Slot { cursor: default; }
.ilk11SenDe { font-size: 26px; font-weight: 800; text-transform: uppercase; margin: 0 0 12px; }
.ilk11Cagri { max-width: 560px; margin: 0 auto 36px; text-align: center; }
    .ilk11Cagri p { margin: 0 0 14px; font-size: 14px; color: var(--i11-fg2); }
    .ilk11Cagri .duzen { display: flex; justify-content: center; gap: 8px; flex-wrap: wrap; }

/* ---- Paylaşılan 11 sayfası: çağrının altında, sayfanın sonunda takımın haberleri (tek sıra 4 kart; mobilde 2 sütun) ---- */
.ilk11Haberler { margin: 0; }
    .ilk11Haberler .ilk11Bolum a { color: inherit; text-decoration: none; }
    .ilk11Haberler .ilk11Bolum a:hover { text-decoration: underline; }
    .ilk11Haberler .ilk11Bolum .tumu { font-size: 13px; font-weight: 600; color: var(--i11-fg2); white-space: nowrap; }
.ilk11HaberKartlar { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (min-width: 760px) { .ilk11HaberKartlar { grid-template-columns: repeat(4, 1fr); } }
.ilk11Haber { display: block; background: var(--i11-yuzey); border: 1px solid var(--i11-cizgi); border-radius: 14px; overflow: hidden; color: var(--i11-fg); text-decoration: none; min-width: 0; }
    .ilk11Haber img { display: block; width: 100%; height: auto; aspect-ratio: 336 / 185; object-fit: cover; background: var(--i11-yuzey2); }
    .ilk11Haber h3 { font-family: Inter, Arial, sans-serif; font-size: 15px; font-weight: 600; line-height: 1.35; margin: 0; padding: 10px 12px 4px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
    .ilk11Haber time { display: block; padding: 0 12px 12px; font-size: 12px; color: var(--i11-fg2); }
    .ilk11Haber:hover h3 { text-decoration: underline; }
@media (max-width: 480px) { .ilk11Haber h3 { font-size: 13px; } }
/* Bildirim: kısa mesaj tek satır hap, uzun mesaj ortalı birkaç satıra sarılır (kesilmez) */
.ilk11Bildirim { position: fixed; left: 50%; bottom: calc(24px + env(safe-area-inset-bottom, 0px)); transform: translateX(-50%); background: var(--i11-fg); color: #fff; padding: 10px 18px; border-radius: 18px; font-weight: 600; font-size: 14px; line-height: 1.4; text-align: center; z-index: 1003; display: none; width: max-content; max-width: min(92vw, 520px); box-shadow: 0 6px 24px rgba(0,0,0,.25); }
    .ilk11Bildirim.goster { display: block; }

@media (max-width: 480px) {
    .ilk11Baslik h1 { font-size: 30px; }
    .ilk11Forma { width: 42px; height: 42px; font-size: 17px; }
    .ilk11Slot .isim { font-size: 11px; }
}