/* =====================================================================
   MATCHCHASE TASARIM SİSTEMİ — TEK KAYNAK (2026-06-05)
   "Light Mode & Slate" ekosistemi. Yeni logo ile uyumlu.

   MİMARİ: Yeni palet ANA KAYNAK olarak tanımlanır. Eski değişken isimleri
   (--accent-color, --text-primary, --bg-base vb.) silinmez — yeni palete
   ALIAS (köprü) olarak bağlanır. Böylece 3050 satır + tüm CSS dosyaları
   eski isimleri okumaya devam eder, hiçbir kullanım yetim kalmaz.

   Kendi kafadan ara ton ICAT ETME. Sadece bu havuzu kullan.
   ===================================================================== */
:root {
    /* ── FONT SKALASI (Sprint-1 font token, 2026-06-10) ──────────
       Exact-value mapping: token değeri = eski literal, GÖRSEL DEĞİŞMEZ.
       Yakın değer birleştirme YOK. em/px/clamp/!important/dinamik dokunulmaz. */
    --mc-fs-2xs:     0.65rem;
    --mc-fs-xs:      0.70rem;
    --mc-fs-xs-plus: 0.72rem;
    --mc-fs-sm:      0.75rem;
    --mc-fs-sm-plus: 0.78rem;
    --mc-fs-md:      0.80rem;
    --mc-fs-md-plus: 0.82rem;
    --mc-fs-lg:      0.85rem;
    --mc-fs-xl:      0.90rem;
    --mc-fs-xl-plus: 0.95rem;
    --mc-fs-2xl:     1.05rem;
    --mc-fs-3xl:     1.20rem;

    /* ── YENİ PALET (ANA KAYNAK) ─────────────────────────────── */
    /* Zeminler */
    --bg-body:          #f8fafc;   /* sayfa zemini */
    --bg-panel:         #ffffff;   /* kart/panel zemini */
    --bg-panel-hover:   #f1f5f9;   /* hover */

    /* Marka yeşili */
    --brand-primary:    #0d832d;   /* kurumsal yeşil (yeni) */
    --brand-neon:       #0d832d;   /* TEK YEŞİL (eski #4ade80; vizyoner 2026-06-07: hepsi #0d832d) */
    --brand-gradient:   linear-gradient(135deg, var(--brand-primary), var(--brand-neon));

    /* Slate (lacivert-gri) — eski siyah zeminlerin yerine */
    --slate-gradient:   linear-gradient(135deg, #1e293b, #0f172a);
    --slate-solid:      #0f172a;   /* düz slate (navbar, başlık bandı) */

    /* Kırmızı */
    --red-gradient:     linear-gradient(135deg, #dc2626, #991b1b);

    /* Metin */
    --text-main:        #0f172a;   /* ana metin */
    --text-muted:       #64748b;   /* ikincil metin */

    /* Kenarlık */
    --border-color:     #e2e8f0;

    /* Durum renkleri (galibiyet / beraberlik / mağlubiyet) */
    --status-win:       #0d832d;
    --status-draw:      #ea580c;   /* Beraberlik artık gri DEĞİL — sıcak turuncu */
    --status-loss:      #dc2626;

    /* ── ESKİ İSİM ALIASLARI (KÖPRÜ) — silinmez, yeni palete bağlı ── */
    /* 3050 satır + mobile/desktop CSS bu isimleri okumaya devam eder. */
    --bg-base:          var(--bg-body);
    --text-primary:     var(--text-main);
    --text-secondary:   var(--text-muted);
    --accent-color:     var(--brand-primary);
    --accent-glow:      rgba(13, 131, 45, 0.2);
    --success:          var(--brand-primary);
    --danger:           var(--status-loss);

    /* Skor kutusu arka planları — yeni palete uyumlandı */
    --score-win-bg:     rgba(13, 131, 45, 0.6);
    --score-win-border: rgba(13, 131, 45, 0.4);
    --score-loss-bg:    rgba(220, 38, 38, 0.6);
    --score-loss-border: rgba(220, 38, 38, 0.4);
    --score-draw-bg:    rgba(234, 88, 12, 0.6);    /* turuncu beraberlik */
    --score-draw-border: rgba(255, 255, 255, 0.05);
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    scrollbar-width: auto;
    scrollbar-color: rgba(13, 131, 45, 0.5) rgba(13, 131, 45, 0.05);
    -webkit-tap-highlight-color: transparent;   /* mobil dokunma mavi parlamasını kapat */
}

/* Custom WebKit Scrollbar (Theme Synchronized) */
::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-track {
    background: var(--slate-solid);
}

::-webkit-scrollbar-thumb {
    background: var(--brand-gradient);
    border-radius: 0;
    border: 1px solid var(--slate-solid);
}

::-webkit-scrollbar-thumb:hover {
    background: var(--brand-gradient);
}

html {
    font-size: clamp(12.5px, 2.8vw + 3px, 16px); /* Central fluid scaling — telefon aralığında da akışkan (2026-06-01, eski eğri 458px altında 11.5px'e kilitleniyordu) */
}

body {
    font-family: 'Inter', arial, helvetica, sans-serif;
    line-height: 1.35;
    background-color: var(--bg-base);
    color: var(--text-primary);
    min-height: 100vh;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

#app {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

/* Panel utility */
.glass-panel {
    background: var(--bg-panel);
    border: 1px solid var(--border-color);
    box-shadow: none;            /* TEK DİL: gölge süsü kaldırıldı (takım/TD/hakem header'ları) 2026-06-07 */
    border-radius: 0;            /* düz köşe */
}

/* Top Navbar */
.top-navbar {
    width: 100%;
    background: var(--slate-solid);
    color: #ffffff;
    box-shadow: 0 4px 10px rgba(0,0,0,0.15);
    z-index: 100;
}

.top-navbar-inner {
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 1.5rem;
    height: 70px;
}

.nav-brand {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.nav-brand .brand-name {
    font-size: 1.4rem;
    font-weight: 700;
    letter-spacing: 1px;
    color: #ffffff;
    margin: 0;
    line-height: 1;
}

.nav-brand .mc-brand-link {
    display: block;
    text-decoration: none;
    line-height: 0;
}

.nav-brand .mc-brand-logo {
    height: 34px;
    width: auto;
    aspect-ratio: 536 / 82;   /* CLS: SVG doğal oranı (viewBox 13421:2045 ≈ 6.54). width="223" attribute
                                  KALDIRILDI — mobilde 223px zorlayıp SVG yüklenince 157'ye sıçrıyordu
                                  (vizyoner: "önce büyük geliyor sonra Üye ol'u görünce küçülüyor").
                                  aspect-ratio height ile genişliği baştan hesaplar → mobil/desktop
                                  çelişkisi YOK, reflow YOK. */
    display: block;
}

/* SEO Faz 1.2 — Visually hidden h1 (semantic markup, screen reader/Google için, görsel etkisi yok) */
.mc-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* SEO Faz 1.3 — "<Entity> Hakkında" descriptive paragraf bloğu (sayfa altı, içerik zenginleştirme) */
.mc-seo-about-block {
    margin-top: 12px;            /* boş geçiş standardı (eski 28) */
    margin-bottom: 12px;         /* eski 20 */
}
.mc-seo-about-card {
    background: var(--bg-card, #ffffff);
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 0;              /* düz köşe (site geneli tek dil — radius süsü kaldırıldı 2026-06-07) */
    padding: 24px 28px;
    box-shadow: none;             /* gölge süsü kaldırıldı (tek dil) */
}
.mc-seo-about-title {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--text-primary, #0f172a);
    margin: 0 0 14px 0;
    line-height: 1.3;
}
.mc-seo-about-subtitle {
    font-size: 1rem;
    font-weight: 600;
    color: var(--text-primary, #0f172a);
    margin: 18px 0 10px 0;
}
.mc-seo-about-text {
    font-size: 0.92rem;
    line-height: 1.65;
    color: var(--text-secondary, #475569);
    margin: 0 0 12px 0;
}
.mc-seo-about-text strong {
    color: var(--text-primary, #0f172a);
    font-weight: 600;
}
@media (max-width: 900px) {
    .mc-seo-about-card { padding: 18px 20px; }
    .mc-seo-about-title { font-size: 1.1rem; }
    .mc-seo-about-text { font-size: 0.88rem; }
}

/* SEO Faz 2 — Tarihsel sinyaller bloğu (match path SSR inject, og_meta.js) */
.mc-seo-signals-block {
    margin: 12px 0;               /* boş geçiş standardı 12px (eski 28/20) */
    background: var(--bg-card, #ffffff);
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 0;             /* düz köşe (tek dil) */
    padding: 24px 28px;
    box-shadow: none;            /* gölge süsü kaldırıldı */
}
.mc-seo-signals-header {
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    padding-bottom: 14px;
    margin-bottom: 18px;
}
.mc-seo-signals-block h2 {
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--text-primary, #0f172a);
    margin: 0 0 8px 0;
    line-height: 1.3;
}
.mc-seo-signals-intro {
    font-size: 0.88rem;
    line-height: 1.55;
    color: var(--text-secondary, #475569);
    margin: 0;
}
.mc-seo-signals-group {
    margin: 18px 0 14px 0;
}
.mc-seo-signals-group h3 {
    font-size: 1rem;
    font-weight: 600;
    color: var(--text-primary, #0f172a);
    margin: 0 0 8px 0;
    line-height: 1.35;
    padding-bottom: 6px;
    border-bottom: 1px dashed rgba(0, 0, 0, 0.08);
}
.mc-seo-signals-group ul {
    margin: 0;
    padding-left: 22px;
    list-style: disc;
}
.mc-seo-signals-group li {
    font-size: var(--mc-fs-xl);
    line-height: 1.6;
    color: var(--text-secondary, #475569);
    margin-bottom: 6px;
}
@media (max-width: 900px) {
    .mc-seo-signals-block { padding: 18px 20px; }
    .mc-seo-signals-block h2 { font-size: 1.1rem; }
    .mc-seo-signals-group h3 { font-size: var(--mc-fs-xl-plus); }
    .mc-seo-signals-group li { font-size: var(--mc-fs-lg); }
}

.nav-brand .subtitle {
    font-size: var(--mc-fs-2xs);
    color: #ffffff;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-top: 2px;
    text-align: center;
}

.nav-menu {
    display: flex;
    align-items: center;
    gap: 1.5rem;
}

.nav-horizontal-list {
    list-style: none;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    padding: 0;
}

.nav-horizontal-list li {
    padding: 0.5rem 1rem;
    border-radius: 6px;
    cursor: pointer;
    font-size: var(--mc-fs-xl-plus);
    transition: all 0.2s ease;
    color: #dddddd;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid transparent;
}

.nav-horizontal-list li:hover {
    background: rgba(13, 131, 45, 0.25);
    color: #ffffff;
}

.nav-horizontal-list li.active {
    background: rgba(255, 255, 255, 0.12);
    color: #ffffff;
    font-weight: 600;
    border-color: rgba(255, 255, 255, 0.18);
}

.nav-divider {
    width: 1px;
    height: 30px;
    background: rgba(255, 255, 255, 0.15);
}

.menu-flag {
    width: 24px;
    height: auto;
    border-radius: 2px;
}

/* ═══════════════════════════════════════════════════════════════
   SEO Ana Menü (2026-05-18) — Ana Sayfa + Lig İncele dropdown
   ═══════════════════════════════════════════════════════════════ */

.mc-main-nav {
    display: inline-flex !important;
    align-items: center;
    gap: 0;
    list-style: none;
    margin: 0;
    padding: 0;
}

.mc-main-nav li {
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
    display: flex;
    margin-right: -1px; /* border overlap — stats-tabs ile birebir */
}
.mc-main-nav li:hover {
    background: transparent !important;
}

/* Lig dashboard .tab-btn ile BIREBIR — keskin köşeler, ovallik YOK */
.mc-nav-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    background: var(--slate-gradient);
    border: 1px solid #444444;
    color: #dddddd;
    padding: 0.6rem 1.75rem;
    font-family: inherit;
    font-size: var(--mc-fs-xl);
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    position: relative;
    border-radius: 0 !important;
    text-decoration: none;
    line-height: 1.2;
    white-space: nowrap;
    text-transform: none;
    letter-spacing: normal;
}
.mc-nav-btn:hover {
    background: rgba(13, 131, 45, 0.25);
    border-color: rgba(13, 131, 45, 0.6);
    color: #ffffff;
    z-index: 3;
}
.mc-main-nav li:hover {
    z-index: 3 !important;
    background: transparent !important;
}
/* Aktif (Ana Sayfa primary, li.active, dropdown açık) — yeşil gradient */
.mc-nav-btn-primary,
.mc-main-nav li.active .mc-nav-btn,
.mc-dropdown-parent.open .mc-nav-btn {
    background: var(--brand-gradient);
    border-color: var(--brand-primary);
    color: #ffffff;
    font-weight: bold;
    z-index: 2;
}
.mc-nav-btn-primary:hover,
.mc-main-nav li.active .mc-nav-btn:hover,
.mc-dropdown-parent.open .mc-nav-btn:hover {
    background: var(--brand-gradient);
    border-color: var(--brand-primary);
    color: #ffffff;
    z-index: 4;
}
.mc-nav-btn-outline {
    /* Tab strip stilinden farklı yok — HTML semantik etiket */
}

.mc-dropdown-parent {
    position: relative;
}
.mc-dropdown-arrow {
    font-size: var(--mc-fs-xs);
    margin-left: 0.2rem;
    opacity: 0.85;
    transition: transform 0.18s ease;
}
.mc-dropdown-parent.open .mc-dropdown-arrow {
    transform: rotate(180deg);
}

/* Dropdown menu — kurumsal beyaz panel */
.mc-dropdown-menu {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    min-width: 280px;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.18), 0 4px 12px rgba(0, 0, 0, 0.08);
    list-style: none;
    padding: 8px;
    margin: 0;
    z-index: 1000;
    display: none;
}
.mc-dropdown-parent.open .mc-dropdown-menu {
    display: block;
    animation: mcDropdownFade 0.14s ease-out;
}
@keyframes mcDropdownFade {
    from { opacity: 0; transform: translateY(-6px); }
    to   { opacity: 1; transform: translateY(0); }
}
.mc-dropdown-menu li {
    padding: 0 !important;
    margin: 0;
    border: none !important;
    background: transparent !important;
    display: block;
}
.mc-dropdown-menu li:hover {
    background: transparent !important;
}

/* Lig satırı — grid: bayrak sabit kolon + lig adı */
.mc-dropdown-menu li > a {
    display: grid;
    grid-template-columns: 22px 1fr;
    align-items: center;
    gap: 12px;
    padding: 9px 14px;
    color: #0f172a;
    text-decoration: none;
    font-size: var(--mc-fs-xl);
    font-weight: 500;
    border-radius: 6px;
    transition: background 0.12s ease, color 0.12s ease;
    cursor: pointer;
    text-transform: none;
    letter-spacing: normal;
}
.mc-dropdown-menu li > a:hover {
    background: rgba(13, 131, 45, 0.08);
    color: var(--success);
}

/* Bayrak SVG — desktop sabit boyut 22x15, kurumsal gölge */
.mc-lig-flag {
    width: 22px;
    height: 15px;
    object-fit: cover;
    border-radius: 2px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
    display: block;
}
.mc-lig-text {
    white-space: nowrap;
    color: inherit;
}

/* ─── MOBİL — drawer içinde dikey blok, dropdown position:static ─── */
@media (max-width: 900px) {
    .mc-main-nav {
        flex-direction: column !important;
        align-items: stretch;
        gap: 0.4rem;
        width: 100%;
    }
    .mc-main-nav li {
        width: 100%;
        display: block !important;
    }
    .mc-nav-btn {
        width: 100%;
        justify-content: flex-start;
        padding: 8px 14px;
        font-size: var(--mc-fs-sm-plus);
    }
    .mc-nav-btn-outline {
        color: #ffffff;
        border-color: rgba(255, 255, 255, 0.20);
        background: rgba(255, 255, 255, 0.04);
    }
    /* Bayrak küçültme — mobilde 32px yer israfı */
    .mc-lig-flag {
        width: 22px;
        height: 16px;
    }
    .mc-dropdown-menu {
        position: static;
        box-shadow: none;
        border: 1px solid rgba(255, 255, 255, 0.10);
        background: rgba(255, 255, 255, 0.04);
        border-radius: 8px;
        margin: 4px 0 0 0;
        padding: 4px;
        min-width: auto;
        width: 100%;
    }
    .mc-dropdown-menu li > a {
        grid-template-columns: 22px 1fr !important;
        gap: 10px;
        color: #ffffff;
        font-size: 0.88rem;
        padding: 10px 12px;
    }
    .mc-dropdown-menu li > a:hover {
        background: rgba(255, 255, 255, 0.10);
        color: #ffffff;
    }
    .mc-dropdown-arrow {
        margin-left: auto;
    }
}

/* Eski stiller kullanmasın — boş ondan eski .mc-main-nav li padding override */

.mc-main-nav li > a,
.mc-main-nav li > button.mc-dropdown-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.55rem 1rem;
    border-radius: 6px;
    color: #dddddd;
    text-decoration: none;
    font-size: var(--mc-fs-xl-plus);
    font-weight: 500;
    background: transparent;
    border: 1px solid transparent;
    cursor: pointer;
    transition: all 0.2s ease;
    font-family: inherit;
}

.mc-main-nav li > a:hover,
.mc-main-nav li > button.mc-dropdown-toggle:hover {
    background: rgba(13, 131, 45, 0.25);
    color: #ffffff;
}

.mc-main-nav li.active > a {
    background: rgba(13, 131, 45, 0.20);
    color: var(--success);
    border-color: rgba(13, 131, 45, 0.40);
}

/* Dropdown parent */
.mc-dropdown-parent {
    position: relative;
}

.mc-dropdown-arrow {
    font-size: var(--mc-fs-sm);
    margin-left: 0.25rem;
    transition: transform 0.15s ease;
}

.mc-dropdown-parent.open .mc-dropdown-arrow {
    transform: rotate(180deg);
}

/* Dropdown menu */
.mc-dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    margin-top: 6px;
    min-width: 280px;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.18);
    list-style: none;
    padding: 6px 0;
    z-index: 1000;
    display: none;
}

.mc-dropdown-parent.open .mc-dropdown-menu {
    display: block;
    animation: mcDropdownFade 0.12s ease-out;
}

@keyframes mcDropdownFade {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

.mc-dropdown-menu li {
    padding: 0;
    margin: 0;
    border: none;
}

.mc-dropdown-menu li > a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 16px;
    color: #0f172a;
    text-decoration: none;
    font-size: var(--mc-fs-xl-plus);
    font-weight: 500;
    transition: background 0.12s ease;
}

.mc-dropdown-menu li > a:hover {
    background: #f1f5f9;
    color: #0f172a;
}

.mc-dropdown-menu li > a .fi {
    font-size: 1.4rem;
    border-radius: 2px;
    flex-shrink: 0;
}

.mc-dropdown-menu li > a .mc-lig-incele-text {
    white-space: nowrap;
}

/* MOBİL — dropdown tam genişlik dikey blok */
@media (max-width: 900px) {
    .mc-main-nav {
        flex-direction: column;
        align-items: stretch;
        gap: 0.25rem;
        width: 100%;
    }
    .mc-main-nav li > a,
    .mc-main-nav li > button.mc-dropdown-toggle {
        width: 100%;
        justify-content: flex-start;
    }
    .mc-dropdown-menu {
        position: static;
        box-shadow: none;
        border: none;
        background: rgba(0,0,0,0.04);
        border-radius: 6px;
        margin-top: 4px;
        min-width: auto;
    }
    .mc-dropdown-menu li > a {
        color: #ffffff;
    }
    .mc-dropdown-menu li > a:hover {
        background: rgba(255,255,255,0.08);
        color: #ffffff;
    }
}

/* Workspace Layout */
.workspace-container {
    display: flex;
    flex: 1;
    max-width: 1400px;
    width: 100%;
    margin: 0 auto;
    position: relative;
    box-sizing: border-box;
}

/* Main Content */
.main-content {
    flex: 1;
    padding: 6px 2rem 12px 2rem; /* ÜST 6px (navbar komşuluğu istisna); ALT 12px (içerik->footer boş geçiş standardı); yan 2rem nefes */
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 12px; /* BOŞ DİKEY ARALIK STANDARDI = 12px (bölüm->bölüm, header->içerik->about).
                  İSTİSNA: back-nav->header 6 olsun diye .mc-back-nav'a margin-bottom:-6px telafisi (aşağıda). */
    min-width: 0; /* Prevents flex items from overflowing horizontally */
}

/* Right Sidebar (Monetization & Insights) */
.right-sidebar {
    width: 300px;
    min-width: 300px;
    padding: 2rem 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 2rem;
    background: var(--bg-panel);
    border-left: 1px solid var(--border-color);
    box-shadow: -2px 0 10px rgba(0,0,0,0.02);
}

.insight-card {
    background: var(--bg-panel);
    border: 1px solid var(--border-color);
    border-radius: 6px;
    padding: 1rem;
    margin-bottom: 1rem;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05);
}

.insight-card h4 {
    color: var(--text-secondary);
    font-size: var(--mc-fs-sm);
    text-transform: uppercase;
    letter-spacing: 1.5px; /* Slightly wider tracking for overlines */
    margin-bottom: 0.5rem;
}

.insight-card p {
    color: var(--text-primary);
    font-size: var(--mc-fs-xl-plus); /* Proportional scaling */
    line-height: 1.5;
}

.insight-card p strong {
    color: var(--success);
}

/* Header */
.dashboard-header {
    border-radius: 0;            /* düz köşe (tek dil) */
    padding: 1.5rem 2.5rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.league-info h2 {
    font-size: 1.6rem;
    font-weight: 700;
    letter-spacing: -0.5px;
    margin-bottom: 0.25rem;
}

.league-info p {
    color: var(--text-secondary);
    font-size: var(--mc-fs-xl-plus);
}

.stats {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    align-items: flex-end;
}

.stat-line {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: var(--mc-fs-lg);
}

.stat-line .label {
    font-size: var(--mc-fs-md);
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    white-space: nowrap;
}

.stat-line .value {
    font-size: var(--mc-fs-md);
    font-weight: 700;
    color: var(--accent-color);
    white-space: nowrap;
}

.stat-divider {
    color: var(--border-color);
    font-size: var(--mc-fs-xl);
    margin: 0 0.25rem;
}

#view-container {
    flex: 1;
    /* Anti-flicker: fadeIn animasyonu kaldırıldı — tab geçişlerinde hayalet yazı sorununa neden oluyordu */
}

/* ── CLS Faz 2 (2026-06-12) — ÜST VIEW CONTAINER YER REZERVASYONU ──────────
   SORUN: bu container'lar display:none başlayıp JS ile geç doluyordu. İçerik
   gelene kadar 0px → altlarındaki SEO blokları (#mc-page-about-container +
   #mc-seo-signals-container, HTML'de altta, Google için SSR'lı) ilk paint'te
   YUKARI çıkıyor, sonra view içeriği gelince aşağı tekmeleniyordu = CLS suçlusu.
   ÇÖZÜM: görünür olan view container ilk paint'te min-height ile yer ayırır →
   SEO bloğu baştan fold ALTINA düşer, içerik gelince kaymaz. SEO bloğu HTML'de
   KALIR (kaldırılmadı, lazy yapılmadı) → SEO korunur, kullanıcı zıplamaz.
   KANIT (mobil prod sim): lig 0.32→0.12, takım 0.68→0.11, oyuncu 0.59→0.12.
   display:none olan container zaten yer kaplamaz; sadece aktif olan rezerve eder.
   NOT: maç/H2H'taki #mc-seo-signals-container (2013px, view container DIŞINDA)
   bu fix'le tam çözülmez — ayrı route-aware skeleton işi (og_meta.js). */
#view-container,
#player-view-container,
#official-view-container,
#h2h-view-container,
#mc-mainpage-container {
    min-height: 90vh;
}

/* Teams Grid */
.teams-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); /* Prevent small-device overflow */
    gap: 1.25rem;
}

.team-card {
    background: var(--bg-panel);
    border: 1px solid var(--border-color);
    border-radius: 12px;
    padding: 1.5rem;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    position: relative;
    overflow: hidden;
}

.team-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: var(--accent-color);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.3s ease;
}

.team-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
    background: var(--bg-panel-hover);
    border-color: var(--brand-primary);
}

.team-card:hover::before {
    transform: scaleX(1);
}

.team-header {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.team-logo-placeholder {
    width: 50px;
    height: 50px;
    border-radius: 8px;
    background: #f8f8f8;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1.25rem;
    color: var(--accent-color);
    border: 1px solid var(--border-color);
}

.team-name {
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: -0.5px;
}

.team-stats {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.team-stat-row {
    display: flex;
    justify-content: space-between;
    font-size: var(--mc-fs-xl);
}

.team-stat-row .label { color: var(--text-secondary); }
.team-stat-row .val { font-weight: 500; }

/* Squad View */
.squad-view-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 2rem;
}

.back-btn {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
    padding: 0.5rem 1rem;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s;
    font-family: inherit;
    font-size: var(--mc-fs-xl);
}

.back-btn:hover {
    background: rgba(255, 255, 255, 0.1);
}

/* ════════ BACK-NAV — TEK STANDART GERİ NAVİGASYON (2026-06-06) ════════
   Künye ÜSTÜNDE, sol, dikey 3px (kullanıcı: 6 geniş, 3 alt 3 üst). Lig referans stili (slate 13/600, şeffaf).
   Her detay sayfası renderBackNav() ile basar; history.back() ("nereden geldiyse"). */
.mc-back-nav {
    display: flex;
    align-items: center;
    padding: 0;                /* KRİTİK: dikey 0. navbar->backnav boşluğu .main-content padding-top:6px'ten gelir;
                                  yazının dikey ortalaması butonun KENDİ 6px iç padding'inden gelir.
                                  Buraya 6 verilirse butonun 6'sıyla TOPLANIP yazıyı üste iter + kutu uzar (kullanıcı vakası). */
    margin: 0 0 -6px 0;        /* TELAFİ: .main-content gap:12 ama back-nav->header navbar komşuluğu istisnası 6 olsun
                                  (12 - 6 = 6). Diğer boş geçişler 12 kalır. */
}
.mc-back-nav-btn {
    background: transparent;
    border: 0;
    color: var(--text-muted, #64748b);
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    padding: 6px 12px;          /* sol 12px nefes + dikey 6px */
    cursor: pointer;
    border-radius: 6px;
    transition: color .15s, background .15s;
}
.mc-back-nav-btn:hover {
    color: var(--text-main, #0f172a);
    background: var(--line-soft, #f1f5f9);
}

/* Data Table */
.data-table-container {
    background: var(--bg-panel);
    border: 1px solid var(--border-color);
    border-radius: 0;
    overflow-x: hidden;
}

.data-table {
    width: 100%; /* Tablo panelinin tam genişliğini kullansın */
    border-collapse: collapse; /* Siyah th zemininde görünen dikey beyaz çizgileri kaldırır */
}

.data-table.fixtures-table {
    table-layout: fixed;
    overflow: hidden;
    max-width: 100%;
}

/* Fikstür tablolarında Ev/Dep takım, TD ve Hakem isimleri
   hücre genişliğini aşarsa tek satırda kırpılmak yerine 2. satıra kaysın.
   Mobil davranışı (tek satır + ellipsis) aynen korunuyor, bu kural sadece desktop'ta aktif. */
@media (min-width: 901px) {
    .fixtures-table:not(.mc-card-fixture) td.home-team-cell,
    .fixtures-table:not(.mc-card-fixture) td.away-team-cell,
    .fixtures-table:not(.mc-card-fixture) td.hide-mobile {
        white-space: normal !important;
        line-height: 1.25;
    }
    /* İŞ-2 (2026-06-11): wrap inline-flex — X2 count kartın 3px sağında AKIŞ İÇİNDE
       (eski köşe-bindirme absolute rozet SÖKÜLDÜ, vizyoner kararı: düz kırmızı font). */
    .fixtures-table:not(.mc-card-fixture) .mc-red-card-wrap {
        position: relative;
        display: inline-flex;
        align-items: center;
        gap: 3px;
        margin: 0 2px 0 3px;
        overflow: visible;
        vertical-align: middle;
        line-height: 0;
        cursor: help;
    }
    .fixtures-table:not(.mc-card-fixture) .mc-red-card-multi {
        margin-right: 2px;
    }
    .fixtures-table:not(.mc-card-fixture) .mc-red-card-icon {
        display: block;
        width: 10px;
        height: 13px;
        border-radius: 2px;
        background: #ef4444;
        border: 1px solid #7f1d1d;
    }
    .fixtures-table:not(.mc-card-fixture) .mc-red-card-count {
        position: static;
        font-size: 0.62rem;
        line-height: 1;
        font-weight: 700;
        color: #dc2626;
        background: none;
        border: none;
        border-radius: 0;
        padding: 0;
        min-width: 0;
        text-align: left;
        pointer-events: none;
        white-space: nowrap;
        box-shadow: none;
    }
}


.data-table th, 
.data-table td {
    padding: 0.4rem 1rem;
    border-bottom: 1px solid #e0e0e0;
    vertical-align: middle;
    font-size: var(--mc-fs-xl); /* 1 punto dropped */
}

.data-table.compact-table th, 
.data-table.compact-table td {
    padding: 0.3rem 0.5rem;
    font-size: var(--mc-fs-md);
}

.data-table.compact-table th {
    font-size: var(--mc-fs-xs);
    letter-spacing: 0px;
}

.data-table th {
    color: #ffffff;
    font-weight: 600;
    font-size: var(--mc-fs-sm); /* Dropped from 0.85 */
    letter-spacing: 0.5px;
    text-transform: uppercase;
    background: var(--slate-solid); /* Sleek, dark modern header */
    border: 1px solid #334155;
    white-space: normal; /* allow wrapping instead of blowing layout width */
}

.data-table tr:hover td {
    background: #f8fafc; /* Sleek slate-50 hover effect */
}

.data-table tr:last-child td {
    border-bottom: none;
}

.player-cell {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.player-avatar {
    width: 32px;
    height: 32px;
    min-width: 32px;
    border-radius: 50%; /* Perfect circle */
    background: #f1f5f9; /* Light slate background */
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--mc-fs-md); /* Dropped from 0.85 */
    font-weight: 700;
    color: var(--text-primary); /* Dark text for contrast */
    border: 1px solid #e2e8f0;
}

.player-name {
    font-weight: 600;
    font-size: var(--mc-fs-lg); /* Dropped from 0.95 */
    color: var(--text-primary);
}

.player-position {
    display: inline-block;
    padding: 0.2rem 0;
    width: 42px;
    text-align: center;
    border-radius: 2px;
    font-size: var(--mc-fs-xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border: 1px solid var(--border-color);
}

/* Premium Readable Position Colors (Dark Text on Light Pastel Backgrounds) */
.pos-gk { color: #854d0e; background: #fef08a; border-color: #fde047; }
.pos-def { color: #075985; background: #e0f2fe; border-color: #bae6fd; }
.pos-mid { color: #166534; background: #dcfce7; border-color: #bbf7d0; }
.pos-fwd { color: #991b1b; background: #fee2e2; border-color: #fecaca; }

/* Animations */
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Modal Styles */
.modal-overlay {
    position: fixed; top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0, 0, 0, 0.7); backdrop-filter: blur(10px);
    z-index: 1000; display: flex; align-items: center; justify-content: center;
    opacity: 0; pointer-events: none; transition: opacity 0.3s ease;
}
.modal-overlay.active { opacity: 1; pointer-events: auto; }
.modal-content {
    width: 96%; max-width: 1400px; max-height: 90vh; overflow-y: auto;
    border-radius: 8px; padding: clamp(1.5rem, 3vw, 2.5rem); position: relative;
    transform: translateY(20px); transition: transform 0.3s;
    background: #ffffff;
    box-shadow: 0 10px 40px rgba(0,0,0,0.3);
}
.modal-overlay.active .modal-content { transform: translateY(0); }
.close-btn {
    position: absolute; top: 1rem; right: 1.5rem; background: transparent;
    border: none; color: #666; font-size: 2rem;
    cursor: pointer; transition: color 0.2s;
}
.close-btn:hover { color: #e50b01; }
.player-profile-header { display: flex; gap: 1.5rem; align-items: center; margin-bottom: 2rem; border-bottom: 1px solid var(--border-color); padding-bottom: 1.5rem; }
.player-large-avatar { width: 80px; height: 80px; border-radius: 16px; background: linear-gradient(135deg, var(--accent-color), var(--success)); display: flex; align-items: center; justify-content: center; font-size: 2.5rem; font-weight: 700; color: white;}
.player-profile-details h2 { font-size: 1.7rem; font-weight: 700; margin-bottom: 0.25rem; letter-spacing: -0.5px; }
.player-profile-details p { color: var(--text-secondary); font-size: var(--mc-fs-xl); }
.stats-table { width: 100%; border-collapse: collapse; margin-top: 1rem; background: transparent; border-radius: 0; overflow: hidden; table-layout: auto; border: 1px solid var(--border-color); }
.stats-table th, .stats-table td { padding: 0.5rem 0.6rem; border-bottom: 1px solid var(--border-color); text-align: right; vertical-align: middle; font-variant-numeric: tabular-nums; }
.stats-table th { color: #ffffff; font-size: var(--mc-fs-sm); text-transform: uppercase; background: #000000; font-weight: 600; }
.stats-table tr:hover td { background: rgba(255, 255, 255, 0.05); }
.empty-stats { text-align: center; padding: 3rem; color: var(--text-secondary); font-style: italic; }

/* SAKATLIK TABLOSU KLP sütunu — MASAÜSTÜ: logo + kulüp ADI yan yana (kullanıcı 2026-06-03:
   "kulüplerin logolarını koy"). Millî takımda bayrak + ülke adı. Mobilde sadece logo/bayrak
   (mobile-profile.css @media: isim gizli). KLP hücresi sola hizalı (logo+isim okunur). */
.mc-injury-table td:nth-child(4) { text-align: left; }
/* Başlık: masaüstü KULÜP, mobil KLP (mobile-profile @media short gösterir) */
.mc-injury-table .mc-klp-short { display: none; }
.mc-injury-table .mc-klp-full { display: inline; }

/* Metin Sütunlarını Sola Hizala (Sezon, Müsabaka, �Slke, Seviye, Kulüp) */
.stats-table th:nth-child(1), .stats-table td:nth-child(1),
.stats-table th:nth-child(2), .stats-table td:nth-child(2),
.stats-table th:nth-child(3), .stats-table td:nth-child(3),
.stats-table th:nth-child(4), .stats-table td:nth-child(4),
.stats-table th:nth-child(5), .stats-table td:nth-child(5) {
    text-align: left;
}
/* Müsabaka (2) ve Kulüp (5) gibi uzun isimleri biraz daha dar alanda tut ama kaydırma yapmadan sı�xdır */
.stats-table td:nth-child(2), .stats-table td:nth-child(5) {
    max-width: 15vw;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
/* Stats Tabs */
.stats-tabs {
    display: inline-flex;
    margin-bottom: 12px;     /* BOŞ DİKEY ARALIK STANDARDI 12px (sekme->içerik). Eski 1.5rem=24px.
                                İçerik kartının inline margin-top'u 0'a çekildi (çift boşluk olmasın). */
    border-radius: 0;
    align-items: center;
}

/* ═══════════════════════════════════════════════════════════════════
   APPLE-STYLE TAB (2026-06-06) — GLOBAL TEK MERKEZ
   Eski siyah bloklu/gradient/çerçeveli "2010 havası" sekme → şeffaf zemin,
   aktif sekmenin altında ince yeşil çizgi (Apple App Store / The Athletic dili).
   Bu class GLOBAL: lig + takım + h2h + oyuncu + sortbar sekmeleri (6 sayfa).
   Kullanıcı onayı 2026-06-06: "bu olsun, her yeri etkilesin, sıkıntı yok".

   STANDART TAB PADDING: 12px üst/alt + 16px yan (sekme nefes standardı —
   her yeni tab bu padding'i kullanır, [[feedback-apple-tab-standart-padding]]).
   ═══════════════════════════════════════════════════════════════════ */
.tab-btn {
    background: transparent;
    background-image: none;
    border: none;
    border-bottom: 2px solid transparent;   /* aktif olunca yeşile döner */
    border-radius: 0;
    color: #94a3b8;                          /* pasif: soluk slate */
    padding: 12px 12px;                      /* STANDART tab padding: 12px her yön */
    cursor: pointer;
    font-family: inherit;
    font-size: var(--mc-fs-xl);
    font-weight: 600;
    transition: color 0.2s, border-color 0.2s;
    margin-right: 0;
    position: relative;
    white-space: nowrap;
}

.tab-btn:hover {
    background: transparent;
    border-bottom-color: transparent;
    color: var(--text-main);                /* hover: tok slate */
}

.tab-btn.active {
    background: transparent;
    background-image: none;
    border: none;
    border-bottom: 2px solid var(--slate-solid);   /* aktif: LACİVERT alt çizgi (2026-06-07 vizyoner: çizgi lacivert) */
    color: var(--brand-primary);            /* aktif: YEŞİL yazı (nerede olduğun vurgusu güçlü) */
    font-weight: 700;
}

/* Anasayfa sortbar (mc-mode-tab / mc-sort-tab) — TEK MERKEZ .tab-btn dili (2026-06-07).
   Eskiden mc_main_sortbar.js'te inline renk vardı (her yer kendi rengi); artık renk buradan.
   Aktif: YEŞİL yazı + LACİVERT alt çizgi. Pasif: soluk slate. */
.mc-mode-tab, .mc-sort-tab {
    color: #64748b;                          /* pasif: slate-600 (a11y 2026-06-14: #94a3b8 2.45:1 kırıktı → #64748b AA, aynı hue koyu) */
    border-bottom: 2px solid transparent;
    font-weight: 600;
    transition: color 0.15s, border-color 0.15s;
}
.mc-mode-tab:hover:not(.active), .mc-sort-tab:hover:not(.active) {
    color: var(--text-main);
}
.mc-mode-tab.active, .mc-sort-tab.active {
    color: var(--brand-primary);            /* aktif: YEŞİL yazı */
    border-bottom-color: var(--slate-solid);   /* aktif: LACİVERT alt çizgi */
    font-weight: 700;
}

/* Simulation Engine Styles */
.simulation-container {
    padding: 1rem;
    max-width: 1100px;
    margin: 0 auto;
}

.fade-in {
    animation: fadeIn 0.3s ease forwards;
}

/* Tab pane'lerin opak arka planı: alt katmandaki hayalet yazıları engeller */
.league-tab-pane {
    background: var(--bg-base);
    min-height: 100px;
}

.sim-selectors {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    margin-top: 2.5rem;
}

.team-selector-box {
    flex: 1;
    padding: 2.5rem;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    transition: transform 0.3s ease;
}

.team-selector-box:hover {
    transform: translateY(-5px);
}

.team-selector-box h3 {
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 1.1rem;
}

.sim-select {
    width: 100%;
    max-width: 250px;
    padding: 8px 12px;
    border-radius: 6px;
    border: 1px solid rgba(255,255,255,0.15);
    background: rgba(0,0,0,0.3);
    color: white;
    font-size: var(--mc-fs-xl-plus);
    font-family: inherit;
    outline: none;
    cursor: pointer;
    transition: all 0.2s;
    appearance: none;
}

.sim-select:focus {
    border-color: var(--accent-color);
    box-shadow: none;
}

.sim-select option {
    background: var(--slate-solid);
    color: white;
}

.sim-select option:checked {
    background: var(--brand-gradient) !important;
    background-color: var(--brand-primary) !important; /* Fallback for browsers that don't support gradient on options */
    color: white !important;
}
.team-preview {
    margin-top: 2rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

.preview-logo {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: rgba(255,255,255,0.05);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.5rem;
    font-weight: 800;
    color: rgba(255,255,255,0.2);
    border: 2px dashed rgba(255,255,255,0.1);
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.preview-logo.active {
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.2), rgba(16, 185, 129, 0.05));
    color: var(--success);
    border: 2px solid var(--success);
    box-shadow: 0 10px 25px rgba(16, 185, 129, 0.2);
    transform: scale(1.05);
}

.preview-logo.active.away {
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.2), rgba(239, 68, 68, 0.05));
    color: var(--danger);
    border: 2px solid var(--danger);
    box-shadow: 0 10px 25px rgba(239, 68, 68, 0.2);
}

.preview-name {
    font-size: 1.4rem;
    font-weight: 600;
    color: var(--text-primary);
}

.team-preview.empty .preview-name {
    display: none;
}

.sim-vs-divider {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.vs-circle {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: #f8f8f8;
    border: 1px solid #dddddd;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--mc-fs-3xl);
    font-weight: 800;
    color: #666666;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

.action-btn {
    padding: 1.25rem 3rem;
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: 2px;
    border-radius: 8px;
    border: none;
    background: #e0e0e0;
    color: #999999;
    cursor: not-allowed;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    font-family: inherit;
    box-shadow: none;
}

.action-btn.ready {
    background: var(--brand-primary);
    color: white;
    cursor: pointer;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    border: 1px solid var(--brand-primary);
}

.action-btn.ready:hover {
    background: #539900;
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

.action-btn.ready:active {
    transform: translateY(1px);
}

.text-center {
    text-align: center;
}

/* Custom Flag Glossy Effect */
.pg-flag {
    position: relative;
    overflow: hidden;
}

.pg-flag::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 50%;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0.75) 0%, rgba(255, 255, 255, 0) 100%);
    pointer-events: none;
    z-index: 10;
}

/* Media Queries for Responsiveness */
@media (max-width: 1250px) {
    .workspace-container {
        flex-direction: column;
    }
    
    .right-sidebar {
        width: 100%;
        min-width: 100%;
        border-left: none;
        border-top: 1px solid var(--border-color);
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
    }
    
    .insights-container {
        flex: 1;
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
        gap: 1rem;
    }
}

/* ════════════════════════════════════════════════════════════════════
   MOBILE @media (max-width: 900px) — MODÜLERLEŞTİRİLDİ (2026-05-12)
   ════════════════════════════════════════════════════════════════════
   Önceki 928 satırlık @media (max-width: 900px) bloğu (eski 837-1763)
   5 ayrı dosyaya bölündü:
     - css/mobile-shared.css   → navbar/drawer/auth/sidebar/scrollbar/layout/calendar/shared-table
     - css/mobile-mainpage.css → anasayfa fixture table (.mc-mainpage-table)
     - css/mobile-league.css   → lig sayfası (teams/standings/fixtures/managers/referees)
     - css/mobile-team.css     → takım sayfası (squad/perf/transfers/predictions)
     - css/mobile-match.css    → maç inceleme (sub-tab, form, h2h, smart-stats)
   index.html: 5 ayrı <link> tag (her dosyanın cache buster
'
ı ayrı).
   Disiplin: yeni mobil kural eklerken hangi view's dosyasına ait olduğunu seç.
   ════════════════════════════════════════════════════════════════════ */

@media (max-width: 600px) {
    .dashboard-header {
        padding: 1rem;
    }
    
    .league-info h2 {
        font-size: 1.25rem;
    }
    
    .teams-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .nav-horizontal-list {
        flex-wrap: wrap; /* allow double rows on very narrow phones */
        justify-content: center;
        gap: 0.25rem;
    }
    
    .nav-horizontal-list li {
        padding: 0.35rem 0.5rem;
        font-size: var(--mc-fs-md);
    }
}

/* --- RESPONSIVE PITCH CSS --- */
.pitch-container {
    position: relative;
    width: 100%;
    margin: 0 auto;
    border-radius: 8px;
    background: repeating-linear-gradient(
        90deg,
        #4ba027,
        #4ba027 5.55%,
        #479724 5.55%,
        #479724 11.1%
    );
    border: 3px solid rgba(255, 255, 255, 0.7);
    box-shadow: inset 0 0 40px rgba(0,0,0,0.25);
    overflow: hidden;
    aspect-ratio: 1.5 / 1;
    min-height: 500px;
    max-width: 1100px;
}

.pitch-layer {
    position: absolute; top:0; left:0; width:100%; height:100%; pointer-events:none;
}

.pitch-desktop { display: block; }
.pitch-mobile { display: none; }

.pitch-line {
    position: absolute;
    border: 2px solid rgba(255, 255, 255, 0.65);
}
.pitch-circle {
    position: absolute;
    border: 2px solid rgba(255, 255, 255, 0.65);
    border-radius: 50%;
    aspect-ratio: 1;
    transform: translate(-50%, -50%);
}
.pitch-point {
    position: absolute;
    width: 6px; height: 6px;
    background: rgba(255, 255, 255, 0.65);
    border-radius: 50%;
    transform: translate(-50%, -50%);
}

/* DESKTOP LAYOUT */
.pitch-desktop .p-center-line { top:0; bottom:0; left:50%; border-left-width: 2px; }
.pitch-desktop .p-center-circle { top:50%; left:50%; height:25%; }
.pitch-desktop .p-center-spot { top:50%; left:50%; }

.pitch-desktop .p-pen-left { top:20%; bottom:20%; left:0; width:16%; border-left:none; }
.pitch-desktop .p-goal-left { top:35%; bottom:35%; left:0; width:6%; border-left:none; }
.pitch-desktop .p-spot-left { top:50%; left:12%; }

.pitch-desktop .p-pen-right { top:20%; bottom:20%; right:0; width:16%; border-right:none; }
.pitch-desktop .p-goal-right { top:35%; bottom:35%; right:0; width:6%; border-right:none; }
.pitch-desktop .p-spot-right { top:50%; right:12%; }

/* MOBILE LAYOUT */
.pitch-mobile .p-center-line { left:0; right:0; top:50%; border-top-width: 2px; }
.pitch-mobile .p-center-circle { top:50%; left:50%; width:25%; }
.pitch-mobile .p-center-spot { top:50%; left:50%; }

.pitch-mobile .p-pen-bottom { left:20%; right:20%; bottom:0; height:16%; border-bottom:none; }
.pitch-mobile .p-goal-bottom { left:35%; right:35%; bottom:0; height:6%; border-bottom:none; }
.pitch-mobile .p-spot-bottom { left:50%; bottom:12%; }

.pitch-mobile .p-pen-top { left:20%; right:20%; top:0; height:16%; border-top:none; }
.pitch-mobile .p-goal-top { left:35%; right:35%; top:0; height:6%; border-top:none; }
.pitch-mobile .p-spot-top { left:50%; top:12%; }

/* PLAYER ZONES */
.player-squad-zone {
    position: absolute;
    transform: translate(-50%, -50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    z-index: 20;

    /* Desktop Mapping */
    left: var(--pos-x);
    top: var(--pos-y);
    width: 200px;
}

/* 2026-06-04: 768→900 kanonik mobil eşiğe hizalandı — saha telefon-mod toggle'ı (.pitch-desktop/.pitch-mobile)
   + dikey layout bu blokta. Eski 768 yüzünden 769-900px'de saha masaüstü kalıyordu ("telefona geçmiyor" bug'ı).
   Blok TAMAMEN sahaya ait (.pitch-container/.pitch-desktop/.pitch-mobile/.player-squad-zone) — başka layout etkilenmez. */
@media (max-width: 900px) {
    .pitch-container {
        aspect-ratio: 9 / 16;
        min-height: 80vh;
        max-width: 100%;
        background: repeating-linear-gradient(
            180deg,
            #4ba027,
            #4ba027 5.55%,
            #479724 5.55%,
            #479724 11.1%
        );
    }
    .pitch-desktop { display: none; }
    .pitch-mobile { display: block; }

    .player-squad-zone {
        /* Swap X and Y for vertical orientation & support optional mobile overrides */
        left: var(--mob-pos-y, var(--pos-y));
        top: calc(100% - var(--mob-pos-x, var(--pos-x)));
        width: 150px;
        flex-direction: row;
        justify-content: center;
        flex-wrap: wrap;
        gap: 0 !important;
    }
    /* KURAL 1: Kaleci zone alt sınır referansı — sahanın alt çizgisinden 4 px yukarıda
       En alttaki kaleci kartının BİTİŞ kenarı = saha alt kenarı - 4 px.
       Diğer takımlarda kaleci sayısı 2-5 arası değişse de alt sınır sabit kalır.
       Not: bottom değeri token negative margin + scale origin etkisinden ötürü 0 olarak set
       edildi; visual gap ~4 px çıkar (token margin: -1px ve scale 0.9 etkisi). */
    .player-squad-zone[data-position="Goalkeeper"] {
        top: auto !important;
        bottom: 0 !important;
        transform: translate(-50%, 0) !important;
    }
    /* Oyuncu kartları mobile'da 0.90 ölçek + negatif margin ile DOM alanı kompanse */
    .pitch-container .pitch-player-token {
        transform: scale(0.9);
        transform-origin: top center;
        margin: -1px -7px !important;
    }
    /* Beyaz metric kutusu: 36 px visual (= 45 px DOM, scale 0.8) + 2px yatay padding */
    .pitch-container .pitch-player-token > div:nth-child(2) {
        width: 45px !important;
        flex: 0 0 45px !important;
        max-width: 45px !important;
        padding: 4px 2px !important;
    }
    /* Siyah isim kutusu: 62 px visual (= 77.5 px DOM, scale 0.8) */
    .pitch-container .pitch-player-token > div:nth-child(1) {
        width: 77.5px !important;
        flex: 0 0 77.5px !important;
        max-width: 77.5px !important;
    }
}

/* Hover Underline Menu */
.hover-underline-menu { display: flex; gap: 30px; align-items: center; justify-content: center; margin-bottom: 25px; padding-bottom: 5px; }
.hover-underline-menu a { position: relative; text-decoration: none; color: var(--text-secondary); font-weight: bold; font-size: var(--mc-fs-xl-plus); padding: 5px 0; cursor: pointer; transition: color 0.3s; }
.hover-underline-menu a:hover, .hover-underline-menu a.active { color: var(--text-primary); }

/* Baseline setup for the line */
.hover-underline-menu a::before { 
    content: ""; position: absolute; z-index: 2; left: 0; right: 100%; bottom: 0px; 
    height: 3px; border-radius: 2px;
    background: var(--brand-gradient);
    transition-property: right, background; transition-duration: 0.3s; transition-timing-function: ease-out; 
}

/* Hover state (Bright green gradient sliding in) */
.hover-underline-menu a:hover::before { 
    right: 0; 
    background: var(--brand-gradient);
}

/* Active state (Dark gradient) */
.hover-underline-menu a.active::before { 
    right: 0; 
    background: var(--slate-gradient);
}

/* Cross Hover Enhancements — TEK STANDART: satır hover SLATE (#f1f5f9), her ekran her tablo.
   2026-06-06: eski yeşil rgba(90,145,0,0.20) KALDIRILDI (vizyoner: "nerede yeşil hover varsa slate, standart bir olsun").
   Bu genel kural (masaüstü+mobil); fikstür satırları (.mc-st-fix-row) zaten slate → tam bütünlük. */
.data-table tr.team-row:hover td {
    background-color: #f1f5f9 !important;
}
.data-table tr.team-row.opp-highlight td { 
    background-color: rgba(198, 40, 40, 0.3) !important; 
    border-top: 1px dashed rgba(198, 40, 40, 0.7) !important; 
    border-bottom: 1px dashed rgba(198, 40, 40, 0.7) !important; 
}

/* ══════════════════════════════════════════════════════════════
   PANEL HEADER — koyu başlık kutusu (tüm sekmelerde ortak)
   JS'de: class="mc-panel-header" kullan, inline stil YAZMA
   ══════════════════════════════════════════════════════════════ */
.mc-panel-header {
    background: var(--slate-solid);
    border: 1px solid #555555;
    padding: 10px 15px;
    margin-bottom: 12px;         /* boş geçiş standardı (eski 20) */
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 0;            /* düz köşe (tek dil) */
}
.mc-panel-header-title {
    color: #ffffff;
    font-weight: bold;
    font-size: var(--mc-fs-2xl);
    display: flex;
    align-items: center;
}
.mc-panel-header-title i {
    margin-right: 8px;
    opacity: 0.8;
}
.mc-panel-header-right {
    display: flex;
    align-items: center;
    gap: 15px;
}
/* Panel başlığı içindeki custom dropdown — yazı beyaz olmalı */
.mc-panel-header .mc-summary {
    color: #ffffff;
    border-bottom-color: rgba(255,255,255,0.3);
}
.mc-panel-header .mc-summary::after {
    border-top-color: rgba(255,255,255,0.5);
}

/* ══════════════════════════════════════════════════════════════
   CARD WRAPPER — tablo/içerik sarmalayıcı kutu
   ══════════════════════════════════════════════════════════════ */
.mc-card {
    background: var(--bg-card);
    padding: 0;                  /* yaslı: içerik kenara dayansın (eski 15px) */
    border-radius: 0;            /* düz köşe */
    border: 1px solid rgba(255,255,255,0.05);
    margin-top: 12px;            /* boş geçiş standardı (eski 20) */
    box-shadow: none;            /* gölge süsü kaldırıldı */
    overflow: hidden;            /* iç tablo köşeyi taşmasın */
}

/* MatchChase Vanilla Custom Select Component
   No more Native Browser constraints. Total custom color mapping. */
.mc-custom-select {
    position: relative;
    user-select: none;
    display: inline-block;
}
.mc-summary {
    background: transparent; border: none; border-bottom: 1px solid var(--text-secondary); color: var(--text-primary); font-size: var(--mc-fs-xl-plus); font-weight: 500; cursor: pointer; padding: 4px 22px 4px 8px; transition: border-color 0.3s;
    position: relative; text-align: left; white-space: nowrap;
}
.mc-summary:hover {
    border-color: var(--accent-color);
}
.mc-summary::after {
    content: '';
    width: 0; height: 0;
    border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 5px solid #888888;
    position: absolute; right: 8px; top: 50%; transform: translateY(-50%);
}
.mc-summary.no-caret::after {
    display: none !important;
}
.mc-dropdown {
    position: absolute; top: 100%; right: 0; margin-top: 5px;
    background: var(--slate-solid); border: 1px solid #333; border-radius: 0;
    list-style: none; padding: 0;
    max-height: 300px; overflow-y: auto; min-width: 100%;
    z-index: 1000; box-shadow: 0 8px 20px rgba(0,0,0,0.5);
    display: none;
}
.mc-custom-select.open .mc-dropdown { display: block; }
.mc-custom-select.open .mc-summary::after {
    border-top: none; border-bottom: 5px solid var(--accent-color);
}

.mc-option {
    padding: 7px 12px; color: #ffffff; cursor: pointer; font-size: var(--mc-fs-xl); border-bottom: 1px solid rgba(255,255,255,0.05); text-align: left; white-space: nowrap;
}
.mc-option:last-child { border-bottom: none; }
.mc-option:hover {
    background: rgba(198, 40, 40, 0.6);
    color: #ffffff; font-weight: 500;
}
.mc-option.selected {
    background: rgba(46, 125, 50, 0.6); 
    font-weight: 600; color: #ffffff;
}

/* Scrollbar specific to custom dropdown as requested */
.mc-dropdown::-webkit-scrollbar { width: 8px; }
.mc-dropdown::-webkit-scrollbar-track { background: rgba(0, 0, 0, 0); }
.mc-dropdown::-webkit-scrollbar-thumb { background: rgba(0, 0, 0, 0); border-radius: 0; }
.mc-dropdown::-webkit-scrollbar-thumb:hover { background: rgba(0, 0, 0, 0); }

/* ══════════════════════════════════════════════════════════════
   PREDICTIONS VIEW — Tahmin ve Sonuçlar tablosu
   ══════════════════════════════════════════════════════════════ */

/* Özet kartları */
.pv-summary-grid { margin-bottom: 10px; }
.pv-summary-title {
    font-size: var(--mc-fs-xl); font-weight: 600; color: var(--text-primary);
    margin-bottom: 10px; padding-left: 2px;
}
.pv-summary-cards {
    display: flex; gap: 12px;
}
.pv-summary-card {
    flex: 1;
    background: var(--bg-panel);
    border: 1px solid var(--border-color);
    border-radius: 6px;
    padding: 12px 15px;
}
.pv-card-title {
    font-weight: 700; font-size: var(--mc-fs-lg); color: var(--accent-color);
    margin-bottom: 8px; text-align: center;
    padding-bottom: 6px; border-bottom: 2px solid var(--accent-color);
}
.pv-card-row {
    display: flex; justify-content: space-between; align-items: center;
    padding: 3px 0; font-size: var(--mc-fs-md-plus); color: var(--text-secondary);
}
.pv-card-val { font-weight: 700; color: var(--text-primary); font-size: var(--mc-fs-md-plus); font-variant-numeric: tabular-nums; }
.pv-card-total {
    margin-top: 4px; padding-top: 6px;
    border-top: 1px solid var(--border-color);
    font-size: var(--mc-fs-sm-plus); color: #999;
}

/* Tahmin tablosu */
.pv-table { table-layout: fixed; border-collapse: collapse; }
.pv-table thead th {
    position: sticky; top: 0; z-index: 2;
}

/* Motor başlık renkleri */
.pv-th-match {
    background: var(--slate-solid) !important; color: #fff !important;
}
.pv-th-ss1 {
    background: #1a5276 !important; color: #fff !important;
}
/* Rozetli hücre — 1X2 marketlerinde takım profili bandında model tahminini tutuyor */
.pv-val.pv-has-badge {
    position: relative;
    font-weight: 700 !important;
    box-shadow: inset 0 0 0 2px #f1c40f !important;
    cursor: help;
}
.pv-val.pv-has-badge::after {
    content: '★';
    position: absolute;
    top: 1px; right: 3px;
    font-size: 0.7em;
    color: #f1c40f;
    text-shadow: 0 0 2px #000;
    line-height: 1;
}
.pv-th-dc {
    background: #6c3483 !important; color: #fff !important;
}
.pv-th-int {
    background: #1e8449 !important; color: #fff !important;
}
.pv-th-sub {
    font-size: 0.7rem !important; padding: 3px 4px !important;
    text-align: center !important; font-weight: 600 !important;
}

/* Tahmin hücreleri */
.pv-val {
    text-align: center !important;
    font-size: 0.8rem !important;
    padding: 4px 3px !important;
    font-variant-numeric: tabular-nums;
}

/* Eski takım adı hücresi — İstatistik Takımlar tablosu hala kullanıyor */
.pv-team-cell {
    font-size: var(--mc-fs-md-plus);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    max-width: 140px;
}

/* Birleşik maç hücresi (Tahminler tablosu): ev + skor + dep + altın bölge — grid ile sabit hiza */
.pv-match-cell {
    font-size: var(--mc-fs-md-plus);
    padding: 6px 10px;
}
.pv-match-wrap {
    display: grid;
    grid-template-columns: 1fr 52px 1fr 42px;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}
.pv-match-home, .pv-match-away {
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}
.pv-match-home { text-align: right; }
.pv-match-away { text-align: left; }
.pv-match-score {
    font-weight: 700;
    padding: 2px 6px;
    background: rgba(0, 0, 0, 0.05);
    border-radius: 4px;
    text-align: center;
    font-size: var(--mc-fs-md-plus);
    justify-self: center;
}
.pv-match-score.pv-not-played {
    background: transparent;
    color: #888;
    font-weight: 400;
}
.pv-match-badge {
    /* Altın bölge rozeti için sabit yer — rozet olmasa da kolon korunur */
    text-align: center;
    min-width: 42px;
}

/* Renklendirme */
.pv-hit {
    background: rgba(46, 125, 50, 0.25) !important;
    color: #1b5e20 !important;
    font-weight: 700 !important;
}
.pv-miss {
    background: rgba(198, 40, 40, 0.15) !important;
    color: #c62828 !important;
    text-decoration: line-through;
    opacity: 0.7;
}
.pv-actual {
    background: rgba(46, 125, 50, 0.08) !important;
    font-weight: 600 !important;
}
.pv-predicted {
    background: rgba(13, 131, 45, 0.08) !important;
    font-weight: 600 !important;
}

/* Henüz oynanmamış maç */
.pv-upcoming td { opacity: 0.6; }
.pv-not-played { color: #999 !important; font-weight: 400 !important; }

/* Boş hücre (rozet modunda gösterilmeyen) */
.pv-empty { color: transparent !important; }

/* Bant dışı tahmin — okunur ama soluk (referans amaçlı) */
.pv-val-muted {
    opacity: 0.35 !important;
    color: #888 !important;
    font-weight: 400 !important;
    background-color: transparent !important;
}

/* Mod/alt/market geçiş tabları — APPLE-STYLE UNDERLINE (2026-06-07 vizyoner: .tab-btn diline taşı).
   Eski "dolu yeşil blok / segment" (2010 dili) kaldırıldı; şeffaf zemin + aktif yeşil alt çizgi + slate yazı. */
.pv-mode-btn {
    background: transparent; border: 0; border-bottom: 2px solid transparent; color: #94a3b8;
    padding: 5px 12px; font-size: var(--mc-fs-sm-plus); cursor: pointer;
    font-family: inherit; transition: color .15s, border-color .15s;
}
.pv-mode-btn.pv-mode-active {
    color: var(--brand-primary); border-bottom-color: var(--slate-solid); font-weight: 700;
}
.pv-mode-btn:hover:not(.pv-mode-active) { color: var(--text-main); }

/* Alt tab sistemi */
.pv-sub-tabs {
    display: flex; gap: 0;
}
.pv-sub-tab {
    background: transparent; border: 0; border-bottom: 2px solid transparent; color: #94a3b8;
    padding: 8px 20px; font-size: var(--mc-fs-lg); font-weight: 600; cursor: pointer;
    font-family: inherit; transition: color .15s, border-color .15s; position: relative;
}
.pv-sub-tab:hover:not(.pv-sub-tab-active) { color: var(--text-main); }
.pv-sub-tab-active {
    color: var(--brand-primary); border-bottom-color: var(--slate-solid); font-weight: 700; z-index: 1;
}

/* Market tabları */
.pv-market-tabs { display: flex; gap: 0; }
.pv-market-tab {
    background: transparent; border: 0; border-bottom: 2px solid transparent; color: #94a3b8;
    padding: 6px 16px; font-size: var(--mc-fs-md-plus); font-weight: 600; cursor: pointer;
    font-family: inherit; transition: color .15s, border-color .15s;
}
/* Hover state sadece gerçek hover destekleyen cihazlarda (touch'ta sticky :hover sorununu önler) */
@media (hover: hover) and (pointer: fine) {
    .pv-market-tab:hover:not(.pv-market-tab-active) { color: var(--text-main); }
}
.pv-market-tab-active {
    color: var(--brand-primary); border-bottom-color: var(--slate-solid); font-weight: 700;
}

/* Takım istatistik tablosu */
.pv-team-stats-table { table-layout: fixed; }

/* Satır hover — yeşil/kırmızı hücreleri ezmesin */
.pv-table tbody tr:hover td {
    background: rgba(0, 0, 0, 0.06);
}
.pv-table tbody tr:hover td.pv-hit {
    background: rgba(46, 125, 50, 0.30) !important;
}
.pv-table tbody tr:hover td.pv-miss {
    background: rgba(198, 40, 40, 0.20) !important;
}
.pv-table tbody tr:hover td.pv-actual {
    background: rgba(46, 125, 50, 0.12) !important;
}

/* ══════════════════════════════════════════════
   SMART STATS — Akıllı İstatistik
   ══════════════════════════════════════════════ */
.mc-smart-stats-container {
    padding: 15px 0;
}

/* Alt menü (hover-underline) ek stiller */
.ss-sub-menu a.ss-tab-disabled {
    color: var(--text-secondary, #999) !important;
    opacity: 0.45;
    cursor: not-allowed;
}
.ss-tab-count {
    display: inline-block;
    background: rgba(0,0,0,0.08);
    color: var(--text-secondary, #666);
    font-size: var(--mc-fs-2xs);
    font-weight: 700;
    padding: 1px 5px;
    margin-left: 4px;
    vertical-align: middle;
}
.ss-sub-menu a.active .ss-tab-count {
    background: rgba(0,0,0,0.15);
    color: var(--text-primary, #333);
}
/* İstatistik ikonu — menü öğesinin sağında */
.ss-stats-icon {
    margin-left: 6px;
    font-size: 0.75em;
    color: var(--success);
    cursor: pointer;
    opacity: 0.6;
    transition: opacity 0.2s, color 0.2s;
    vertical-align: baseline;
}
.ss-stats-icon:hover {
    opacity: 1;
    color: var(--text-primary, #333);
}
.ss-stats-icon.ss-stats-locked {
    color: var(--danger, #e53935);
    opacity: 0.8;
    cursor: not-allowed;
}
.ss-stats-icon.ss-stats-locked:hover {
    color: var(--danger, #e53935);
    opacity: 1;
}
.ss-pipe {
    color: var(--text-secondary, #999);
    font-size: var(--mc-fs-md);
    opacity: 0.4;
    user-select: none;
}
.ss-pipe:last-child {
    display: none;
}

/* Katman özet paneli */
.ss-layer-summary {
    background: var(--bg-panel, #f8f8f8);
    border: 1px solid rgba(0,0,0,0.08);
    padding: 15px;
    margin-bottom: 20px;
}
.ss-layer-row {
    display: flex;
    align-items: center;
    padding: 6px 0;
    border-bottom: 1px solid rgba(0,0,0,0.04);
}
.ss-layer-row:last-child {
    border-bottom: none;
}
.ss-layer-icon {
    width: 28px;
    text-align: center;
    color: var(--text-secondary, #666);
    font-size: var(--mc-fs-lg);
}
.ss-layer-label {
    flex: 1;
    font-size: var(--mc-fs-lg);
    color: var(--text-primary, #333);
    font-weight: 500;
}
.ss-layer-status {
    font-size: var(--mc-fs-md);
    font-weight: 600;
}

/* Bölüm başlıkları */
.ss-section {
    margin-bottom: 25px;
}
.ss-section-title {
    font-size: var(--mc-fs-xl-plus);
    font-weight: 700;
    color: var(--text-primary, #333);
    margin-bottom: 15px;
    padding-bottom: 8px;
    border-bottom: 2px solid var(--success);
}

/* Market satırları */
.ss-market-row {
    margin-bottom: 12px;
}
.ss-market-labels {
    display: flex;
    justify-content: space-between;
    margin-bottom: 4px;
    font-size: var(--mc-fs-md);
    font-weight: 600;
    color: var(--text-primary, #333);
}
.ss-market-values {
    display: flex;
    justify-content: space-between;
    margin-top: 4px;
    font-size: var(--mc-fs-lg);
}

/* Çift yönlü bar */
.ss-bar-track {
    display: flex;
    height: 16px;
    background: rgba(0,0,0,0.06);
    overflow: hidden;
}
.ss-bar-fill {
    height: 100%;
    transition: width 0.8s ease;
}
.ss-bar-left {
    /* soldan sağa büyür */
}
.ss-bar-right {
    margin-left: auto;
    /* sağdan sola büyür */
}

/* Alt bilgi */
.ss-footer {
    font-size: var(--mc-fs-sm);
    color: var(--text-secondary, #888);
    text-align: center;
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid rgba(0,0,0,0.06);
    line-height: 1.5;
}

/* ═══════════════════════════════════════════════════════════════
   FAZ 7b2 — CSS hover sınıfları (eski inline onmouseover yerine)
   ═══════════════════════════════════════════════════════════════ */

/* Basit underline link (manager/referee link, breadcrumb, oyuncu link) */
.mc-link-underline-hover { text-decoration: none; cursor: pointer; }
.mc-link-underline-hover:hover { text-decoration: underline; }

/* Takım adı: 2026-06-06 TEK STANDART — hover'da NE renk NE altçizgi (vizyoner: "renk menk almasın,
   çizgiyi de kaldır, tıklayan takıma gitsin yeter"). cursor:pointer tıklanabilirliği gösterir. Her sayfada ortak. */
.mc-team-name-hover { color: var(--text-primary); cursor: pointer; }
.mc-team-name-hover:hover { color: var(--text-primary); text-decoration: none; }

.mc-team-name-hover-inherit { color: inherit; cursor: pointer; }
.mc-team-name-hover-inherit:hover { color: inherit; text-decoration: none; }

/* Accordion satırı (Compare card açılır kapanır) */
.mc-card-row-hover { background: var(--bg-secondary, rgba(0,0,0,0.02)); transition: background 0.2s; cursor: pointer; }
.mc-card-row-hover:hover { background: var(--border-color, rgba(0,0,0,0.05)); }

/* Hafta nav buton (mainpage prev/next) */
.mc-week-nav-btn { background: rgba(255,255,255,0.06); color: #888; transition: all 0.2s; }
.mc-week-nav-btn:hover { background: rgba(13,131,45,0.3); color: #fff; }

/* Today butonu (mainpage takvim "Bugün") */
.mc-today-btn { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.08); color: #ccc; transition: all 0.2s; }
.mc-today-btn:hover { background: rgba(13,131,45,0.25); border-color: rgba(13,131,45,0.4); color: #fff; }

/* Modal close butonu (TD/hakem profil header) */
.mc-modal-close-btn { color: #aaa; transition: color 0.2s; }
.mc-modal-close-btn:hover { color: #fff; }

/* Match global nav (önceki/sonraki maç butonu) */
.match-global-nav-btn { background: #ffffff; border: 1px solid #e5e7eb; transition: background 0.15s, border-color 0.15s; }
.match-global-nav-btn:hover { background: #f8fafc; border-color: #cbd5e1; }

/* Sibling nav (oyuncu önceki/sonraki butonu) */
.sibling-nav-btn { background: var(--bg-card); border: 1px solid var(--border-color); transition: all 0.15s; }
.sibling-nav-btn:hover { background: var(--bg-panel-hover); border-color: var(--accent-color); }

/* Compare BFI / Chaos / TimeDecay tetikleyici buton (active sınıfı varsa hover yok) */
.mc-trigger-btn { transition: background 0.2s; cursor: pointer; }
.mc-trigger-btn:not(.bfi-active):not(.chaos-active):not(.timedecay-active):hover {
    background: var(--red-gradient);
}
.mc-trigger-btn:not(.bfi-active):not(.chaos-active):not(.timedecay-active):hover i {
    color: #ffffff;
}

/* ═══════════════════════════════════════════════════════════════════
   ÜYELİK SİSTEMİ — Üst nav auth-section (Faz 4a, 2026-05-09)
   Anonim: "Giriş yap | Üye ol" linkleri
   Üye: username + ⚠ rozet (onay yoksa) + Hesabım + Çıkış
   ═══════════════════════════════════════════════════════════════════ */
.auth-section {
    margin-left: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    /* width 252px + center: 4 menü sağ kenarı içerik kolonuna (965) hizalanır,
       Giriş/Üye butonları reklam sütununun üstünde ortalı durur (2026-06-03 kullanıcı). */
    width: 252px;
    padding-left: 0;
}

.auth-state {
    display: flex;
    align-items: center;
    gap: 8px;
}

.auth-link {
    color: #ffffff;
    text-decoration: none;
    padding: 8px 16px;
    border-radius: 0;
    font-size: var(--mc-fs-xl);
    font-weight: 600;
    font-family: inherit;
    background: #f59e0b;
    border: none;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
    white-space: nowrap;
}

.auth-link:hover {
    background: #ea8a06;
    color: #ffffff;
}

/* "Üye ol" — vurgu CTA */
.auth-cta {
    background: var(--success, #5a9b00) !important;
    color: #ffffff;
    font-weight: 600;
    border: none !important;
}

.auth-cta:hover {
    background: var(--success, #5a9b00);
    color: #ffffff;
    filter: brightness(1.1);
}

/* ── Üye pill + dropdown menu (kullanıcı seçimi: Seçenek C) ───────── */
#auth-user {
    position: relative;
}

.auth-user-pill {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 3px 10px 3px 3px;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 24px;
    color: #ffffff;
    font-family: inherit;
    font-size: var(--mc-fs-xl);
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
    flex-shrink: 0;
}

/* Kompakt pill — username pill'de gizli (yer kazanmak için), dropdown header'da görünür */
.auth-user-pill .auth-username {
    display: none;
}

.auth-user-pill:hover,
.auth-user-pill[aria-expanded="true"] {
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(255, 255, 255, 0.18);
}

.auth-user-avatar {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--success);
    color: #ffffff;
    font-weight: 700;
    font-size: var(--mc-fs-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    text-transform: uppercase;
    line-height: 1;
}

.auth-username {
    color: #ffffff;
    font-weight: 600;
    font-size: 0.92rem;
    line-height: 1;
}

.auth-unverified {
    color: #f59e0b;
    font-size: var(--mc-fs-lg);
    cursor: help;
    user-select: none;
}

.auth-pill-arrow {
    color: rgba(255, 255, 255, 0.55);
    font-size: var(--mc-fs-xs);
    transition: transform 0.15s;
    margin-left: 2px;
}

.auth-user-pill[aria-expanded="true"] .auth-pill-arrow {
    transform: rotate(180deg);
}

/* Dropdown menü */
.auth-user-menu {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    min-width: 180px;
    background: #1f1f1f;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
    padding: 6px;
    display: none;
    z-index: 200;
}

.auth-user-menu.open {
    display: block;
}

/* Dropdown header — username + email "Hoş geldin" bilgisi */
.auth-menu-header {
    padding: 10px 12px 12px 12px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    margin-bottom: 4px;
}

.auth-menu-username {
    color: #ffffff;
    font-weight: 600;
    font-size: var(--mc-fs-xl-plus);
    line-height: 1.2;
    margin-bottom: 2px;
}

.auth-menu-email {
    color: rgba(255, 255, 255, 0.5);
    font-size: var(--mc-fs-sm-plus);
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.auth-menu-item {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 9px 12px;
    background: transparent;
    border: none;
    color: #d8d8d8;
    font-family: inherit;
    font-size: var(--mc-fs-xl);
    text-decoration: none;
    cursor: pointer;
    border-radius: 5px;
    text-align: left;
    transition: background 0.12s, color 0.12s;
    box-sizing: border-box;
}

.auth-menu-item i {
    width: 16px;
    text-align: center;
    color: rgba(255, 255, 255, 0.5);
    font-size: var(--mc-fs-xl);
    transition: color 0.12s;
}

.auth-menu-item:hover {
    background: rgba(255, 255, 255, 0.08);
    color: #ffffff;
}

.auth-menu-item:hover i {
    color: rgba(255, 255, 255, 0.85);
}

.auth-menu-logout:hover {
    background: rgba(255, 71, 87, 0.12);
    color: #ff6b78;
}

.auth-menu-logout:hover i {
    color: #ff6b78;
}

/* ═══════════════════════════════════════════════════════════════════
   AUTH FORM SAYFALARI (Faz 4b1) — /giris, /uye-ol, /sifre-unuttum
   Site açık tema (--text-primary:#333, --border:#ccc, --success:#508200).
   Form: position:fixed overlay + nav altında (top:80px) ortalanmış.
   ═══════════════════════════════════════════════════════════════════ */

#mc-auth-page {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: #f5f5f7;
    z-index: 50;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 100px 20px 40px;  /* nav alanı için üst padding */
    box-sizing: border-box;
    overflow-y: auto;
}

.auth-form-container {
    width: 100%;
    max-width: 420px;
    background: #ffffff;
    border: 1px solid #e0e0e0;
    border-radius: 12px;
    padding: 32px 28px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
    margin: auto;  /* flex parent'tan bağımsız ortalama */
}

.auth-form-title {
    color: var(--text-main);
    font-size: 1.6rem;
    margin: 0 0 8px 0;
    font-weight: 600;
}

.auth-form-desc {
    color: #555555;
    font-size: var(--mc-fs-xl);
    margin: 0 0 20px 0;
    line-height: 1.5;
}

.auth-form {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-top: 20px;
}

.auth-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.auth-field label {
    color: var(--text-main);
    font-size: var(--mc-fs-xl);
    font-weight: 500;
}

.auth-field input {
    width: 100%;
    padding: 10px 12px;
    background: #ffffff;
    border: 1px solid #cccccc;
    border-radius: 6px;
    color: var(--text-main);
    font-size: var(--mc-fs-xl-plus);
    font-family: inherit;
    transition: border-color 0.15s, box-shadow 0.15s;
    box-sizing: border-box;
}

.auth-field input:focus {
    outline: none;
    border-color: var(--success);
    box-shadow: 0 0 0 3px rgba(13, 131, 45, 0.18);
}

.auth-hint {
    color: #888888;
    font-size: var(--mc-fs-md);
    margin-top: 2px;
}

.auth-error {
    color: #d32f2f;
    font-size: var(--mc-fs-md-plus);
    min-height: 1em;
}

.auth-success {
    color: var(--success);
    font-size: var(--mc-fs-xl);
    margin-top: 8px;
    line-height: 1.5;
}

.auth-submit-btn {
    width: 100%;
    padding: 12px;
    background: var(--success);
    color: #ffffff;
    border: none;
    border-radius: 6px;
    font-size: 1rem;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    transition: filter 0.15s;
    margin-top: 8px;
}

.auth-submit-btn:hover:not(:disabled) {
    filter: brightness(1.08);
}

.auth-submit-btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.auth-divider {
    display: flex;
    align-items: center;
    margin: 24px 0 18px 0;
    color: #888888;
    font-size: var(--mc-fs-sm-plus);
    text-transform: uppercase;
    letter-spacing: 1px;
}

.auth-divider::before,
.auth-divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background: #e0e0e0;
}

.auth-divider span {
    padding: 0 12px;
}

.auth-alt-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    padding: 11px 14px;
    background: #ffffff;
    color: var(--text-main);
    border: 1px solid #cccccc;
    border-radius: 6px;
    font-size: var(--mc-fs-xl);
    font-family: inherit;
    text-decoration: none;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
    margin-bottom: 8px;
    box-sizing: border-box;
}

.auth-alt-btn:hover:not(:disabled) {
    background: #f5f5f5;
    border-color: #999999;
}

.auth-alt-btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.auth-google-btn .fa-google {
    color: #4285F4;
}

.auth-form-footer {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid #e0e0e0;
    text-align: center;
}

.auth-form-footer a {
    color: #555555;
    text-decoration: none;
    font-size: 0.88rem;
}

.auth-form-footer a:hover {
    color: var(--success);
}

.auth-success-block {
    color: var(--text-main);
    line-height: 1.6;
    margin: 16px 0;
}

.auth-success-block p {
    margin: 8px 0;
}

.auth-success-block code {
    background: #f0f0f0;
    padding: 2px 6px;
    border-radius: 3px;
    font-size: var(--mc-fs-lg);
    font-family: monospace;
    color: var(--text-main);
}

/* Token tüketici sayfaları (Faz 4b2) — verify-email, magic-link, reset-password */
.auth-status-message {
    text-align: center;
    padding: 20px 0;
    color: var(--text-main);
}

.auth-status-message i.fa-spinner {
    color: var(--success);
    font-size: 2rem;
    display: block;
    margin-bottom: 12px;
}

.auth-status-message i.fa-check-circle {
    margin-right: 6px;
}

.auth-status-message p {
    margin: 8px 0;
    font-size: var(--mc-fs-xl-plus);
}

.auth-success-text {
    color: var(--success);
    font-size: 1rem;
    font-weight: 500;
    margin: 8px 0 16px 0;
}

.auth-error-block {
    color: #d32f2f;
    font-size: var(--mc-fs-xl-plus);
    margin: 8px 0 16px 0;
    line-height: 1.5;
}

.auth-error-block code {
    background: #fff;
    padding: 1px 5px;
    border-radius: 3px;
    border: 1px solid #f0c2c2;
    font-family: monospace;
    font-size: var(--mc-fs-lg);
}

/* ═══════════════════════════════════════════════════════════════════
   HESABIM SAYFASI (Faz 4c) — /hesabim
   ═══════════════════════════════════════════════════════════════════ */

.account-container {
    max-width: 560px;
}

.account-header {
    display: flex;
    align-items: center;
    gap: 14px;
    padding-bottom: 20px;
    border-bottom: 1px solid #e0e0e0;
    margin-bottom: 20px;
}

.account-avatar {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: var(--success);
    color: #ffffff;
    font-weight: 700;
    font-size: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    text-transform: uppercase;
    line-height: 1;
}

.account-header-info {
    min-width: 0;
    overflow: hidden;
}

.account-header-info h2 {
    word-break: break-word;
}

.account-warning {
    background: #fff8e1;
    border: 1px solid #ffd54f;
    color: #6a5000;
    padding: 12px 14px;
    border-radius: 6px;
    margin-bottom: 18px;
    font-size: var(--mc-fs-xl);
    display: flex;
    align-items: flex-start;
    gap: 10px;
    line-height: 1.4;
}

.account-warning i {
    color: #c89000;
    font-size: 1rem;
    margin-top: 2px;
}

.account-section {
    margin-bottom: 24px;
}

.account-section-title {
    font-size: var(--mc-fs-sm-plus);
    font-weight: 700;
    color: #555;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: 0 0 10px 0;
    padding-bottom: 8px;
    border-bottom: 1px solid #e0e0e0;
}

.account-info-list {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 10px 16px;
    margin: 0;
    font-size: 0.92rem;
    align-items: baseline;
}

.account-info-list dt {
    color: #777;
    font-weight: 500;
    white-space: nowrap;
}

.account-info-list dd {
    color: var(--text-main);
    margin: 0;
    word-break: break-word;
}

.account-pill-verified {
    display: inline-block;
    background: rgba(13, 131, 45, 0.12);
    color: var(--success);
    border-radius: 12px;
    padding: 1px 9px;
    font-size: var(--mc-fs-sm-plus);
    font-weight: 600;
    margin-left: 6px;
    vertical-align: middle;
}

.account-provider-badge {
    display: inline-block;
    background: #f0f0f0;
    color: var(--text-main);
    border-radius: 12px;
    padding: 3px 10px;
    font-size: var(--mc-fs-md-plus);
    margin: 2px 4px 2px 0;
}

.account-actions {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.account-danger-btn {
    color: #d32f2f !important;
    border-color: #f0c2c2 !important;
}

.account-danger-btn:hover:not(:disabled) {
    background: #ffebee !important;
    border-color: #d32f2f !important;
    color: #d32f2f !important;
}

.account-danger-btn i {
    color: #d32f2f;
}

/* ═══════════════════════════════════════════════════════════════════
   ANONIM CTA BANNER (Faz 5a) — sadece anonim user, dismissible
   ═══════════════════════════════════════════════════════════════════ */

.mc-anon-banner {
    background: linear-gradient(90deg, rgba(13, 131, 45, 0.10) 0%, rgba(13, 131, 45, 0.02) 100%);
    border-bottom: 1px solid rgba(13, 131, 45, 0.20);
    color: var(--text-main);
    font-size: 0.92rem;
}

.mc-anon-banner-inner {
    max-width: 1400px;
    margin: 0 auto;
    padding: 12px 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}

.mc-anon-banner-text {
    flex: 1;
    min-width: 250px;
}

.mc-anon-banner-text strong {
    color: var(--success);
    font-weight: 700;
    margin-right: 6px;
}

.mc-anon-banner-desc {
    color: #555;
    font-size: 0.88rem;
}

.mc-anon-banner-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.mc-anon-banner-btn {
    display: inline-block;
    padding: 6px 16px;
    font-size: 0.88rem;
    border-radius: 6px;
    text-decoration: none;
    color: var(--text-main);
    background: transparent;
    border: 1px solid #cccccc;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
    font-family: inherit;
    cursor: pointer;
    white-space: nowrap;
}

.mc-anon-banner-btn:hover {
    background: #ffffff;
    border-color: #999;
    color: var(--text-main);
}

.mc-anon-banner-cta {
    background: var(--success);
    color: #ffffff;
    border-color: var(--success);
    font-weight: 600;
}

.mc-anon-banner-cta:hover {
    background: var(--success);
    color: #ffffff;
    filter: brightness(1.08);
    border-color: var(--success);
}

.mc-anon-banner-close {
    background: transparent;
    border: none;
    color: #888;
    font-size: 1.4rem;
    cursor: pointer;
    padding: 0 6px;
    line-height: 1;
    transition: color 0.15s;
    font-family: inherit;
}

.mc-anon-banner-close:hover {
    color: var(--text-main);
}

/* Mobile — banner dikey istif */
@media (max-width: 600px) {
    .mc-anon-banner-inner {
        flex-direction: column;
        align-items: flex-start;
        padding: 10px 16px;
    }
    .mc-anon-banner-desc {
        display: block;
        margin-top: 4px;
    }
    .mc-anon-banner-actions {
        align-self: stretch;
        justify-content: flex-end;
    }
}


/* === Maç sayfası Paylaş butonu dropdown (mc_share.js) === */
.mc-share-dropdown {
    background: #ffffff;
    border: 1px solid #ccc;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
    border-radius: 6px;
    padding: 6px 0;
    min-width: 200px;
    font-size: var(--mc-fs-xl-plus);
}
.mc-share-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    color: #333;
    text-decoration: none;
    background: none;
    border: none;
    width: 100%;
    text-align: left;
    cursor: pointer;
    font-size: var(--mc-fs-xl-plus);
    transition: background 0.15s;
}
.mc-share-item:hover {
    background: #f5f5f5;
}
.mc-share-item i {
    width: 20px;
    text-align: center;
}
.mc-share-copy {
    border-top: 1px solid #eee;
    margin-top: 4px;
    padding-top: 12px;
}

/* === Maç Paylaş Modal — kart önizleme + paylaş butonları === */
.mc-share-modal {
    position: fixed;
    inset: 0;
    z-index: 10001;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    animation: mcShareFadeIn 0.18s ease-out;
}
.mc-share-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.78);
    cursor: pointer;
}
.mc-share-modal-content {
    position: relative;
    background: #ffffff;
    border-radius: 10px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
    max-width: 720px;
    width: 100%;
    max-height: 90vh;
    overflow-y: auto;
    padding: 24px;
    z-index: 1;
}
.mc-share-modal-close {
    position: absolute;
    top: 10px;
    right: 10px;
    background: rgba(0, 0, 0, 0.06);
    border: none;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    cursor: pointer;
    font-size: 1.1rem;
    color: #333;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s;
}
.mc-share-modal-close:hover {
    background: rgba(0, 0, 0, 0.12);
}
.mc-share-modal-image {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 6px;
    margin: 8px 0 16px 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}
.mc-share-modal-image-fallback {
    background: #f0f0f0;
    color: #888;
    padding: 60px 20px;
    text-align: center;
    border-radius: 6px;
    margin: 8px 0 16px 0;
    font-size: var(--mc-fs-xl-plus);
}
.mc-share-modal-title {
    font-size: var(--mc-fs-2xl);
    font-weight: 600;
    color: #333;
    margin-bottom: 18px;
    text-align: center;
}
.mc-share-modal-buttons {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 8px;
}
.mc-share-modal-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 11px 14px;
    background: #f5f5f5;
    color: #333;
    text-decoration: none;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: var(--mc-fs-xl-plus);
    font-weight: 500;
    transition: background 0.15s, transform 0.1s;
}
.mc-share-modal-btn:hover {
    background: #e8e8e8;
    transform: translateY(-1px);
}
.mc-share-modal-btn i {
    font-size: var(--mc-fs-2xl);
}
.mc-share-modal-btn-whatsapp i { color: #25D366; }
.mc-share-modal-btn-twitter i  { color: #1DA1F2; }
.mc-share-modal-btn-telegram i { color: #0088cc; }
.mc-share-modal-btn-facebook i { color: #1877F2; }
.mc-share-modal-btn-linkedin i { color: #0A66C2; }
.mc-share-modal-btn-copy i { color: var(--brand-primary); }

@keyframes mcShareFadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}

@media (max-width: 600px) {
    .mc-share-modal { padding: 10px; }
    .mc-share-modal-content { padding: 16px; }
    .mc-share-modal-buttons { grid-template-columns: repeat(2, 1fr); }
}

/* =====================================================================
   MC POSITION HISTOGRAM — TM tm_position_raw 14 kutu yatay grid
   (2026-05-28 — Kadro Sahada 2. sub-tab, Lazio test sayfası birebir)
   ===================================================================== */
.mc-pos-hist-wrap { max-width: 1000px; margin: 0 auto; }
.mc-pos-hist-summary { background:#fff; border:1px solid #ddd; padding:14px 18px; margin-bottom:14px; }
.mc-pos-hist-summary h3 { margin:0 0 10px; font-size:14px; letter-spacing:0.5px; text-transform:uppercase; color:var(--text-main); }
.mc-pos-hist-tabs { display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin-bottom:10px; }
.mc-pos-hist-tabs:last-child { margin-bottom:0; }
.mc-pos-hist-tabs .lbl { font-size:12px; letter-spacing:1px; text-transform:uppercase; font-weight:700; color:var(--text-main); min-width:90px; }
.mc-pos-hist-tabs button { background:#fff; border:1px solid var(--text-main); color:var(--text-main); padding:6px 14px; cursor:pointer; font-weight:600; font-size:13px; font-family:inherit; }
.mc-pos-hist-tabs button.active { background:var(--slate-solid); color:#fff; }
.mc-pos-hist-tabs button:hover:not(.active) { background:#f5f5f5; }
.mc-pos-hist-selection { text-align:center; font-size:13px; color:var(--text-main); background:#f6fbef; border:1px solid #cfe3a5; padding:8px 12px; margin-bottom:14px; }
.mc-pos-hist-selection b { color:var(--brand-primary); }
.mc-pos-hist-gridwrap { overflow-x:auto; }
.mc-pos-hist-grid {
    display:grid;
    grid-template-columns: repeat(6, minmax(125px, 1fr));
    grid-template-rows: 150px 150px 150px;
    column-gap:8px; row-gap:8px;
    min-width:790px;
}
.mc-pos-hist-grid .pos-GK  { grid-column:1; grid-row:2; }
.mc-pos-hist-grid .pos-DL  { grid-column:2; grid-row:1; }
.mc-pos-hist-grid .pos-DC  { grid-column:2; grid-row:2; }
.mc-pos-hist-grid .pos-DR  { grid-column:2; grid-row:3; }
.mc-pos-hist-grid .pos-DMC { grid-column:3; grid-row:2; }
.mc-pos-hist-grid .pos-ML  { grid-column:4; grid-row:1; }
.mc-pos-hist-grid .pos-MC  { grid-column:4; grid-row:2; }
.mc-pos-hist-grid .pos-MR  { grid-column:4; grid-row:3; }
.mc-pos-hist-grid .pos-AML { grid-column:5; grid-row:1; }
.mc-pos-hist-grid .pos-AMC { grid-column:5; grid-row:2; }
.mc-pos-hist-grid .pos-AMR { grid-column:5; grid-row:3; }
.mc-pos-hist-grid .pos-FWL { grid-column:6; grid-row:1; }
.mc-pos-hist-grid .pos-FW  { grid-column:6; grid-row:2; }
.mc-pos-hist-grid .pos-FWR { grid-column:6; grid-row:3; }
.mc-pos-hist-box { background:#fff; border:1px solid #ddd; display:flex; flex-direction:column; overflow:hidden; }
.mc-pos-hist-box .head { display:grid; grid-template-columns: 1fr 28px 34px; background:var(--slate-solid); color:#fff; padding:0; font-size:9px; font-weight:700; flex-shrink:0; }
.mc-pos-hist-box .head .lbl { padding:6px 8px; letter-spacing:1px; }
.mc-pos-hist-box .head .apps, .mc-pos-hist-box .head .rating { background:var(--brand-primary); color:#fff; padding:6px 0; font-size:8.5px; text-align:center; }
.mc-pos-hist-box .head .apps { border-right:1px solid rgba(255,255,255,0.18); }
.mc-pos-hist-box .head .rating { border-left:1px solid rgba(255,255,255,0.18); }
.mc-pos-hist-box .body { flex:1; overflow:hidden; }
.mc-pos-hist-box .row-data { display:grid; grid-template-columns: 1fr 28px 34px; padding:0; border-bottom:1px solid #f1f1f1; font-size:10px; align-items:center; min-height:22px; box-sizing:border-box; }
.mc-pos-hist-box .row-data:last-child { border-bottom:none; }
.mc-pos-hist-box .row-data.top1 { background:#f6fbef; font-weight:700; }
.mc-pos-hist-box .name { color:#0f172a; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:0 8px; }
.mc-pos-hist-box .a { text-align:center; color:#475569; font-weight:600; }
.mc-pos-hist-box .r { text-align:center; color:var(--brand-primary); font-weight:600; }
.mc-pos-hist-box .empty { flex:1; padding:10px; color:#aaa; font-style:italic; text-align:center; font-size:11px; display:flex; align-items:center; justify-content:center; }
.mc-pos-hist-box .mc-pos-hist-more { flex-shrink:0; text-align:center; padding:5px 6px; background:#f6fbef; color:var(--brand-primary); font-size:10px; font-weight:700; cursor:pointer; border-top:1px solid #cfe3a5; letter-spacing:0.3px; }
.mc-pos-hist-box .mc-pos-hist-more:hover { background:#e8f5e9; }
.mc-pos-hist-tabs .mc-pos-hist-metric-sel { background:#fff; border:1px solid var(--text-main); color:var(--text-main); padding:6px 10px; font-weight:600; font-size:13px; font-family:inherit; cursor:pointer; min-width:170px; }
.mc-pos-hist-tabs .mc-pos-hist-metric-sel:hover { background:#f5f5f5; }
.mc-pos-hist-tabs .mc-pos-hist-metric-sel:focus { outline:2px solid var(--brand-primary); outline-offset:1px; }

/* ===== Takımlar — Metrik Rehberi (Legend) — inline style'dan taşındı (2026-06-06 refactor) ===== */
.mc-teams-legend { margin-top:12px; padding:14px 16px; background:#f8fafc; border:1px solid var(--border-color); border-radius:0; }
.mc-teams-legend-title { color:#475569; margin:0 0 8px; font-size:12px; font-weight:700; letter-spacing:0.2px; text-transform:uppercase; }
.mc-teams-legend-body { font-size:12px; color:#64748b; line-height:1.65; display:flex; flex-direction:column; gap:5px; }
.mc-teams-legend-body p { margin:0; }
.mc-teams-legend-body strong { color:#334155; }
.mc-teams-legend-body .mc-legend-dot-win { color:var(--status-win); }
.mc-teams-legend-body .mc-legend-dot-draw { color:var(--status-draw); }
.mc-teams-legend-body .mc-legend-dot-loss { color:var(--status-loss); }

/* ===== Takımlar tablosu — SABİT inline style'lardan taşındı (2026-06-06 refactor, Seçenek 1) ===== */
/* Dinamik stiller (form-dot rengi ${c}, MP-skor color-mix zemini, piyasa bar genişliği ${pct}%) INLINE kalır — runtime'da hesaplanır. */
.mc-teams-state { text-align:center; padding:50px; color:var(--text-secondary); }
.mc-teams-state-error { color:var(--danger); padding:15px; text-align:center; }
.mc-teams-empty { color:var(--text-light, #94a3b8); }
.mc-teams-form-wrap { display:inline-flex; gap:3px; align-items:center; justify-content:center; }
.mc-teams-logo-sm { width:21px; height:21px; object-fit:contain; }
.mc-teams-logo-md { width:24px; height:24px; object-fit:contain; }
.mc-teams-link-reset { color:inherit; text-decoration:none; }
.mc-teams-mv-cell { display:flex; flex-direction:column; align-items:flex-end; gap:4px; }
.mc-teams-mv-val { font-weight:700; color:var(--slate-solid); line-height:1; font-size:0.85rem; }
.mc-teams-mv-bar { width:100%; max-width:120px; height:4px; background:var(--bg-panel-hover, #f1f5f9); border-radius:2px; overflow:hidden; position:relative; }
.mc-teams-mv-bar-fill { position:absolute; right:0; top:0; height:100%; background:var(--slate-solid); border-radius:2px; }
.mc-teams-name-cell { display:flex; align-items:center; gap:10px; font-weight:500; }
@media (max-width:900px){
  .mc-teams-mv-val { font-size:0.72rem; }
  .mc-teams-mv-bar { max-width:52px; }
}

/* ===== Puan Tablosu (Standings) — SABİT inline'lardan taşındı (2026-06-06 Faz4 hazırlık, Anti denetim) ===== */
/* Dinamik kalanlar: form kutusu renk (${bgColor}/${bColor} G/M/B'ye göre), ceza rozeti rengi (${badgeColor}) — INLINE. */
.mc-st-state { padding:50px; text-align:center; color:var(--text-secondary); font-size:1.2rem; }
.mc-st-empty { color:#aaa; text-align:center; padding:50px; font-size:1.1rem; }
.mc-st-error { color:var(--danger); padding:30px; text-align:center; font-size:1.1rem; }
.mc-st-error-detail { color:#aaa; font-size:0.9rem; }
.mc-st-season-label { color:#dddddd; font-size:0.9rem; }
.mc-st-sort-arrow { font-size:0.7rem; }
.mc-st-name-link { color:inherit; text-decoration:none; font-weight:500; }
.mc-st-name-span { font-weight:500; }
/* Form kutusu: boyut/font/gap class+@media; RENK inline (dinamik). */
.mc-st-form-wrap { display:flex; align-items:center; justify-content:center; gap:3px; }
.mc-st-form-box { min-width:22px; height:22px; padding:0 5px; display:inline-flex; align-items:center; justify-content:center; font-size:0.75rem; font-weight:bold; border-radius:4px; box-shadow:0 1px 2px rgba(0,0,0,0.12); color:#fff; }
.mc-st-form-sep { width:1px; height:20px; background:rgba(255,255,255,0.15); margin:0 5px; }
.mc-st-form-next { position:relative; }
.mc-st-form-next img { width:20px; height:20px; object-fit:contain; opacity:0.95; filter:drop-shadow(0 1px 1px rgba(0,0,0,0.3)); }
.mc-st-form-next-badge { position:absolute; bottom:-6px; right:-6px; font-size:8px; font-weight:bold; background:rgb(198,40,40); color:#fff; border-radius:2px; padding:0 2px; }
.mc-st-penalty { font-size:0.7rem; font-weight:600; margin-left:3px; vertical-align:super; }
@media (max-width:900px){
  .mc-st-form-wrap { gap:2px; }
  .mc-st-form-box { width:14px; height:14px; font-size:0.6rem; }
}

/* ============================================================
   FAZ 4 — Puan Tablosu Lüks UI (Anti demo mimarisi + KURUMSAL renkler)
   1A: Muted açık başlık (FotMob/Apple) — .mc-standings-table SCOPE'unda
       (.data-table genel koyu başlık DOKUNULMADI — fikstür tabloları korunur)
   2A: Renkler KURUMSAL (--status-win #0d832d), demo #4ade80 KULLANILMADI
   ============================================================ */

/* Kontrol barı (koyu bant başlık yerine — Takımlar dili, açık zemin) */
.mc-st-controls {
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:12px; background:var(--bg-panel); border-bottom:1px solid var(--border-color);
  flex-wrap:wrap;
}
/* Segment (Genel / İç Saha / Deplasman) — slate-soft kapsül, aktif beyaz */
.mc-st-segment { display:inline-flex; background:var(--slate-soft, #f1f5f9); padding:4px; border-radius:8px; border:1px solid var(--border-color); }
.mc-st-seg-btn {
  padding:6px 16px; font:700 12px/1 Inter,system-ui,sans-serif; color:var(--text-muted);
  background:transparent; border:none; border-radius:6px; cursor:pointer; transition:all .15s;
}
.mc-st-seg-btn:hover { color:var(--slate-solid, #0f172a); }
.mc-st-seg-btn.active { background:#fff; color:var(--slate-solid, #0f172a); box-shadow:0 1px 3px rgba(15,23,42,0.1); }

/* xG pill — KURUMSAL renk (demo #4ade80 değil): over=yeşil zemin, under=kırmızı zemin */
.mc-standings-table td.mc-st-xg-col { text-align:center; }
.mc-standings-table .xg-pill {
  display:inline-block; min-width:42px; padding:3px 6px; border-radius:6px;
  font:800 11px/1.2 Inter,system-ui,sans-serif; font-variant-numeric:tabular-nums;
}
.mc-standings-table .xg-over { background:color-mix(in srgb, var(--status-win) 12%, transparent); color:var(--status-win); }
.mc-standings-table .xg-under { background:color-mix(in srgb, var(--status-loss) 12%, transparent); color:var(--status-loss); }
.mc-standings-table th.mc-st-xg-col { color:var(--text-muted); }

/* ===== FAZ4 Adım3 — SPLIT-SCREEN (masaüstü) + optimize sütun + son hafta fikstür ===== */
/* Mobil: alt alta (tablo üstte, fikstür altında) */
.mc-st-split { display:flex; flex-direction:column; gap:16px; }
.mc-st-split-left { min-width:0; }
.mc-st-fixture-panel { background:#fff; border:1px solid var(--border-color); overflow:hidden; }
.mc-st-fix-header { display:flex; align-items:center; justify-content:space-between; padding:12px; background:var(--slate-soft,#f1f5f9); border-bottom:1px solid var(--border-color); }
.mc-st-fix-header span:first-child { font:800 13px/1 Inter,system-ui,sans-serif; color:var(--slate-solid,#0f172a); }
.mc-st-fix-tag { font:600 10px/1 Inter; color:var(--text-muted); }
.mc-st-fix-row { display:flex; align-items:center; gap:8px; padding:9px 12px; border-bottom:1px solid #eef2f7; }
.mc-st-fix-row:last-child { border-bottom:none; }
.mc-st-fix-row:hover { background:var(--slate-soft,#f1f5f9); }
.mc-st-fix-teams { flex:1 1 auto; min-width:0; display:flex; flex-direction:column; gap:5px; }
.mc-st-fix-tl { display:flex; align-items:center; justify-content:space-between; gap:6px; }
.mc-st-fix-tl .nm { display:flex; align-items:center; gap:6px; min-width:0; overflow:hidden; font:600 11px/1 Inter; color:var(--text-main,#0f172a); }
.mc-st-fix-tl .nm span { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mc-st-fix-logo { width:16px; height:16px; object-fit:contain; flex:0 0 auto; }
/* S: skorlar NÖTR (slate), renk cümbüşü YOK — sadece KAZANAN bold (font-weight:700), gerisi normal */
.mc-st-fix-sc { font:500 12px/1 Inter; color:var(--text-main,#0f172a); flex:0 0 auto; min-width:12px; text-align:right; }
.mc-st-fix-sc.win { font-weight:700; }
.mc-st-fix-sc.lose { font-weight:500; color:var(--text-muted,#64748b); }
.mc-st-fix-dt { flex:0 0 auto; text-align:center; border-left:1px solid var(--border-color); padding-left:8px; white-space:nowrap; display:flex; flex-direction:column; gap:2px; }
.mc-st-fix-dt .g { font:600 10px/1 Inter; color:var(--text-muted); }
.mc-st-fix-dt .s { font:700 11px/1 Inter; color:var(--text-main,#0f172a); }

@media (min-width:901px){
  /* Yan yana: sol esnek tablo + sağ 240px fikstür */
  .mc-st-split { flex-direction:row; gap:16px; align-items:flex-start; }
  .mc-st-split-left { flex:1 1 auto; }
  .mc-st-fixture-panel { flex:0 0 240px; }
  /* Sol kart ÇERÇEVESİZ (FotMob düz) + tablo PHOTOSHOP küçültme (zoom 0.90) */
  .mc-st-split-left .mc-standings-card { background:transparent; box-shadow:none; border:none; border-radius:0; padding:0; margin:0; }
  /* sol kontrol barı ile sağ fikstür başlığı aynı hizadan başlasın (kart margin-top'u sıfırlandı) */
  .mc-st-split-left > article { margin:0; }
  /* 2026-06-06: zoom:0.90 KALDIRILDI — ana tabloyu %90 küçültüp fontu 14→12.6 yapıyordu, fikstür (14) ile
     tutarsızlık (vizyoner: "fikstürden neden küçük"). zoom'suz taşma yok (tablo 728 < pane 730). Tek standart 14px. */
  .mc-st-split-left .mc-standings-table { table-layout:fixed; width:100%; }
  .mc-st-split-left .mc-standings-table th,
  .mc-st-split-left .mc-standings-table td { padding-left:4px; padding-right:4px; }
  /* Optimize sütun genişlikleri (ölçülen gereken px; Takım=3 esnek auto) */
  .mc-st-split-left .mc-standings-table th:nth-child(1), .mc-st-split-left .mc-standings-table td:nth-child(1) { width:30px; }
  .mc-st-split-left .mc-standings-table th:nth-child(2), .mc-st-split-left .mc-standings-table td:nth-child(2) { width:34px; }
  .mc-st-split-left .mc-standings-table th:nth-child(3), .mc-st-split-left .mc-standings-table td:nth-child(3) { width:auto; }
  .mc-st-split-left .mc-standings-table th:nth-child(4), .mc-st-split-left .mc-standings-table td:nth-child(4) { width:30px; }
  .mc-st-split-left .mc-standings-table th:nth-child(5), .mc-st-split-left .mc-standings-table td:nth-child(5) { width:30px; }
  .mc-st-split-left .mc-standings-table th:nth-child(6), .mc-st-split-left .mc-standings-table td:nth-child(6) { width:30px; }
  .mc-st-split-left .mc-standings-table th:nth-child(7), .mc-st-split-left .mc-standings-table td:nth-child(7) { width:30px; }
  .mc-st-split-left .mc-standings-table th:nth-child(8), .mc-st-split-left .mc-standings-table td:nth-child(8) { width:30px; }
  .mc-st-split-left .mc-standings-table th:nth-child(9), .mc-st-split-left .mc-standings-table td:nth-child(9) { width:30px; }
  .mc-st-split-left .mc-standings-table th:nth-child(10), .mc-st-split-left .mc-standings-table td:nth-child(10) { width:36px; }
  .mc-st-split-left .mc-standings-table th:nth-child(11), .mc-st-split-left .mc-standings-table td:nth-child(11) { width:42px; }
  .mc-st-split-left .mc-standings-table th:nth-child(12), .mc-st-split-left .mc-standings-table td:nth-child(12) { width:42px; }
  .mc-st-split-left .mc-standings-table th:nth-child(13), .mc-st-split-left .mc-standings-table td:nth-child(13) { width:46px; }
  .mc-st-split-left .mc-standings-table th:nth-child(14), .mc-st-split-left .mc-standings-table td:nth-child(14) { width:108px; }
  /* Form kutuları: split'te (dar alan) küçült ki 5 rozet sütuna SIĞSIN (taşma fix, vizyoner 1280px yakaladı) */
  .mc-st-split-left .mc-st-form-box { min-width:18px; height:18px; padding:0 3px; }
  .mc-st-split-left .mc-st-form-wrap { gap:2px; }
}

/* 1A — Muted başlık: koyu .data-table th'i SADECE puan tablosunda ez */
.mc-standings-table.data-table th {
  background: var(--bg-panel);
  color: var(--text-muted);
  border: none;
  border-bottom: 1px solid var(--border-color);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  white-space: nowrap;
}
/* Tabular-nums: rakamlar Excel gibi hizalı (titremesiz) */
.mc-standings-table.data-table td { font-variant-numeric: tabular-nums; }

/* Hücre yapısı (template inline'larından taşındı — tek merkez, çakışma yok) */
.mc-standings-table td.st-rank { text-align:center; font-size:0.95rem; font-weight:bold; color:var(--text-secondary); }
.mc-standings-table td.mc-st-logo { text-align:center; }
.mc-standings-table td.st-logo img, .mc-standings-table .st-logo { width:24px; height:24px; object-fit:contain; vertical-align:middle; }
.mc-standings-table td.st-name { text-align:left; font-weight:500; font-size:1.05rem; color:var(--text-primary); cursor:pointer; }
.mc-standings-table td.st-p { text-align:center; color:var(--text-secondary); font-weight:500; }
.mc-standings-table td.st-f, .mc-standings-table td.st-a { text-align:center; color:var(--text-primary); }
.mc-standings-table td.st-gd { text-align:center; font-weight:bold; }
.mc-standings-table td.st-pts { text-align:center; font-weight:bold; color:var(--status-win); }
.mc-standings-table td.st-form { text-align:center; vertical-align:middle; }

/* W/D/L renkleri (KURUMSAL — JS hardcode #4ade80/#a3a3a3/#f87171 yerine) */
.mc-standings-table td.st-w { text-align:center; color:var(--status-win); font-weight:bold; }
.mc-standings-table td.st-d { text-align:center; color:var(--text-muted); font-weight:bold; }
.mc-standings-table td.st-l { text-align:center; color:var(--status-loss); font-weight:bold; }

/* Sıra (rank) renkleri — JS inline rankStyle yerine class */
.mc-standings-table .rank-ucl { color: var(--brand-primary); font-weight: bold; }   /* Şampiyonlar Ligi */
.mc-standings-table .rank-uel { color: #3b82f6; font-weight: bold; }                  /* Avrupa */
.mc-standings-table .rank-rel { color: var(--status-loss); font-weight: bold; }       /* Düşme */

/* ===== Puan Tablosu MOBİL CAROUSEL (2026-06-06 Faz2) — Takım Performans modeli BİREBİR, STICKY YOK =====
   2 TAM tablo sayfası yan yana (.mc-st-page), .mc-st-carousel flex+scroll-snap ile kaydırılır.
   Sabit 4'lü (#·Logo·Takım·O) HER İKİ sayfada tekrar render → kaydırınca sabit görünür.
   Mobilde JS Form'u P'den ÖNCE taşır → nth: 1#  2logo  3takım  4O  5G  6B  7M  8A  9Y  10AV  11xGF  12xGA  13Form  14P
   Sayfa 1: O·G·B·M·Form·P görünür (A·Y·AV·xG·xA gizli) | Sayfa 2: O·A·Y·AV·xG·xA görünür (G·B·M·Form·P gizli) */
@media (max-width:900px){
  /* CAROUSEL kabı — flex + yatay scroll-snap (Performans .mc-perf-carousel birebir) */
  .mc-st-carousel{
    display:flex !important; flex-wrap:nowrap !important;
    overflow-x:auto !important; overflow-y:hidden !important;
    scroll-snap-type:x mandatory !important; -webkit-overflow-scrolling:touch;
    gap:0 !important; scrollbar-width:none !important;
  }
  .mc-st-carousel::-webkit-scrollbar{ display:none; width:0; height:0; }
  .mc-st-page{ flex:0 0 100% !important; min-width:100% !important; scroll-snap-align:start !important; scroll-snap-stop:always !important; }

  /* Her sayfadaki tablo: tam genişlik, sağ/sol 12px nefes */
  .mc-st-carousel .mc-standings-table.data-table{ min-width:0 !important; width:calc(100% - 24px) !important; margin:0 12px !important; box-sizing:border-box; table-layout:fixed; }

  /* ── SABİT 4'LÜ (her iki sayfada ortak): #(1) Logo(2) Takım(3) O(4) ── */
  .mc-st-carousel .mc-standings-table th:nth-child(1), .mc-st-carousel .mc-standings-table td:nth-child(1){ width:26px !important; text-align:right !important; padding-right:8px !important; padding-left:0 !important; }
  .mc-st-carousel .mc-standings-table th:nth-child(2), .mc-st-carousel .mc-standings-table td:nth-child(2){ width:24px !important; text-align:center !important; }
  .mc-st-carousel .mc-standings-table th:nth-child(3), .mc-st-carousel .mc-standings-table td:nth-child(3){ width:110px !important; min-width:110px !important; max-width:110px !important; text-align:left !important; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .mc-st-carousel .mc-standings-table th:nth-child(4), .mc-st-carousel .mc-standings-table td:nth-child(4){ width:24px !important; text-align:right !important; }

  /* ── SAYFA 1 (data-st-page=1): O·G·B·M·Form·P görünür, 2.tablo (A·Y·AV·xG·xA) GİZLİ ── */
  .mc-st-page[data-st-page="1"] .mc-standings-table th:nth-child(8),  .mc-st-page[data-st-page="1"] .mc-standings-table td:nth-child(8),
  .mc-st-page[data-st-page="1"] .mc-standings-table th:nth-child(9),  .mc-st-page[data-st-page="1"] .mc-standings-table td:nth-child(9),
  .mc-st-page[data-st-page="1"] .mc-standings-table th:nth-child(10), .mc-st-page[data-st-page="1"] .mc-standings-table td:nth-child(10),
  .mc-st-page[data-st-page="1"] .mc-standings-table th:nth-child(11), .mc-st-page[data-st-page="1"] .mc-standings-table td:nth-child(11),
  .mc-st-page[data-st-page="1"] .mc-standings-table th:nth-child(12), .mc-st-page[data-st-page="1"] .mc-standings-table td:nth-child(12){ display:none !important; }
  /* G(5) B(6) M(7) sağa */
  .mc-st-page[data-st-page="1"] .mc-standings-table th:nth-child(5), .mc-st-page[data-st-page="1"] .mc-standings-table td:nth-child(5),
  .mc-st-page[data-st-page="1"] .mc-standings-table th:nth-child(6), .mc-st-page[data-st-page="1"] .mc-standings-table td:nth-child(6),
  .mc-st-page[data-st-page="1"] .mc-standings-table th:nth-child(7), .mc-st-page[data-st-page="1"] .mc-standings-table td:nth-child(7){ width:22px !important; text-align:right !important; }
  /* Form(13) ortada esnek */
  .mc-st-page[data-st-page="1"] .mc-standings-table th:nth-child(13), .mc-st-page[data-st-page="1"] .mc-standings-table td:nth-child(13){ width:auto !important; text-align:center !important; }
  /* P(14) sağda + 12px nefes */
  .mc-st-page[data-st-page="1"] .mc-standings-table th:nth-child(14), .mc-st-page[data-st-page="1"] .mc-standings-table td:nth-child(14){ width:34px !important; text-align:right !important; padding-right:12px !important; white-space:nowrap !important; }
  /* P semibold + muted */
  .mc-st-page[data-st-page="1"] .mc-standings-table td:nth-child(14),
  .mc-st-page[data-st-page="1"] .mc-standings-table td:nth-child(14) *{ font-weight:600 !important; color:var(--text-secondary) !important; }

  /* ── SAYFA 2 (data-st-page=2): O·A·Y·AV·xG·xA görünür, 1.tablo (G·B·M·Form·P) GİZLİ ── */
  .mc-st-page[data-st-page="2"] .mc-standings-table th:nth-child(5),  .mc-st-page[data-st-page="2"] .mc-standings-table td:nth-child(5),
  .mc-st-page[data-st-page="2"] .mc-standings-table th:nth-child(6),  .mc-st-page[data-st-page="2"] .mc-standings-table td:nth-child(6),
  .mc-st-page[data-st-page="2"] .mc-standings-table th:nth-child(7),  .mc-st-page[data-st-page="2"] .mc-standings-table td:nth-child(7),
  .mc-st-page[data-st-page="2"] .mc-standings-table th:nth-child(13), .mc-st-page[data-st-page="2"] .mc-standings-table td:nth-child(13),
  .mc-st-page[data-st-page="2"] .mc-standings-table th:nth-child(14), .mc-st-page[data-st-page="2"] .mc-standings-table td:nth-child(14){ display:none !important; }
  /* A(8) Y(9) sağa yaslı, dar */
  .mc-st-page[data-st-page="2"] .mc-standings-table th:nth-child(8), .mc-st-page[data-st-page="2"] .mc-standings-table td:nth-child(8),
  .mc-st-page[data-st-page="2"] .mc-standings-table th:nth-child(9), .mc-st-page[data-st-page="2"] .mc-standings-table td:nth-child(9){ width:24px !important; text-align:right !important; padding:0 !important; }
  /* AV(10) sağa yaslı (başlık+değer hizalı) */
  .mc-st-page[data-st-page="2"] .mc-standings-table th:nth-child(10), .mc-st-page[data-st-page="2"] .mc-standings-table td:nth-child(10){ width:30px !important; text-align:right !important; padding:0 !important; }
  /* xG(11) center, dar (xA'ya yakın) */
  .mc-st-page[data-st-page="2"] .mc-standings-table th:nth-child(11), .mc-st-page[data-st-page="2"] .mc-standings-table td:nth-child(11){ width:40px !important; text-align:center !important; padding:0 !important; }
  /* xA(12) center, padding-right:0 — nefes tablo margin'inden. Genişlik 38px. */
  .mc-st-page[data-st-page="2"] .mc-standings-table th:nth-child(12), .mc-st-page[data-st-page="2"] .mc-standings-table td:nth-child(12){ width:38px !important; text-align:center !important; padding-left:0 !important; padding-right:0 !important; }
  /* xA başlık + pill 3px sağa (translateX) → sağ nefes 16→13px (sayfa1 P ile eşit). transform hizayı bozmaz. */
  .mc-st-page[data-st-page="2"] .mc-standings-table th:nth-child(12){ transform:translateX(3px) !important; }
  .mc-st-page[data-st-page="2"] .mc-standings-table td:nth-child(12) .xg-pill{ transform:translateX(3px) !important; }

  /* ── ORTAK: font 13px, bold seçimli, form-dot dili, pill (her iki sayfa) ── */
  .mc-st-carousel .mc-standings-table th,
  .mc-st-carousel .mc-standings-table td,
  .mc-st-carousel .mc-standings-table td *{ font-size:13px !important; font-weight:400 !important; }
  .mc-st-carousel .mc-standings-table th{ font-weight:700 !important; }
  .mc-st-carousel .mc-standings-table td.st-name,
  .mc-st-carousel .mc-standings-table td.st-name span,
  .mc-st-carousel .mc-standings-table td.st-name a{ font-weight:600 !important; }

  /* FORM → Takımlar dili: 6px yuvarlak dot. vertical-align:middle → dot'lar rakamlarla DİKEY ortalı (baseline alta kaçırıyordu). */
  .mc-st-carousel td.st-form{ vertical-align:middle !important; }
  .mc-st-carousel td.st-form .mc-st-form-wrap{ display:inline-flex !important; gap:3px !important; align-items:center; justify-content:center; vertical-align:middle !important; }
  .mc-st-carousel td.st-form .mc-st-form-box{
    width:6px !important; height:6px !important; min-width:6px !important; padding:0 !important;
    border-radius:50% !important; border:none !important; font-size:0 !important; box-shadow:none !important;
    display:block !important; color:transparent !important;
  }
  .mc-st-carousel td.st-form .mc-st-form-box[data-r="G"]{ background:#0d832d !important; }
  .mc-st-carousel td.st-form .mc-st-form-box[data-r="M"]{ background:#dc2626 !important; }
  .mc-st-carousel td.st-form .mc-st-form-box[data-r="B"]{ background:#ea580c !important; }
  .mc-st-carousel td.st-form .mc-st-form-sep{ display:none !important; }

  /* xG/xA pill — nowrap + dikey SIKI (padding 1px) → sayfa 2 satırı sayfa 1 ile EŞİT yükseklik (33→29px).
     KÖK: pill 3px dikey padding satırı şişiriyordu → carousel sayfa 2'ye göre uzuyordu → sayfa 1 altında 73px boşluk. */
  .mc-st-carousel .mc-standings-table td .xg-pill{ padding:1px 5px !important; min-width:34px !important; white-space:nowrap !important; display:inline-block !important; line-height:1 !important; vertical-align:middle !important; }
  .mc-st-carousel .mc-standings-table tbody td{ line-height:1 !important; }

  /* 2026-06-06: carousel align-items flex-start → sayfalar gerilmez, sayfa1 altı 73px boşluk gider */
  .mc-st-carousel{ align-items:flex-start !important; }

  .mc-card{ box-shadow:none !important; }
  /* puan tablosu kartı margin-top:20 KALDIR — .main-content gap (12px) zaten dikey ritmi veriyor,
     üstüne 20px margin = ÇİFT boşluk. Kart iç padding 15→12. Sadece mobil+standings (masaüstü dokunulmaz). */
  .mc-standings-card{ margin-top:0 !important; padding-top:12px !important; padding-bottom:12px !important; }

  /* KONTROL BARI: sezon sol 12px + segment kutusu sayfanın EN SAĞINA yaslı (padding-right:0 + margin-left:auto) + OVALLİK SIFIR */
  .mc-st-controls{ display:flex !important; justify-content:space-between !important; align-items:center !important; padding-left:12px !important; padding-right:0 !important; }
  .mc-st-segment{ border-radius:0 !important; margin-left:auto !important; }
  .mc-st-segment .mc-st-seg-btn, .mc-st-segment .mc-st-seg-btn.active{ border-radius:0 !important; }

  /* SON HAFTA SKORLARI jilet: sabit genişlik + sağa hizalı + tabular-nums */
  .mc-st-fix-sc{ min-width:14px !important; text-align:right !important; font-variant-numeric:tabular-nums !important; }

  /* HOVER TEK STANDART: puan tablosu YEŞİL hover → slate (#f1f5f9), fikstür ile aynı (site standardı) */
  .data-table tr.team-row:hover td,
  .mc-standings-table.data-table tr:hover td{ background:#f1f5f9 !important; }
  .mc-st-fix-row:hover{ background:#f1f5f9 !important; }
}

/* ===== Puan Tablosu MASAÜSTÜ (2026-06-06) — sadece ≥901px, mobil ETKİLENMEZ =====
   Tek standart: her şey 14px Inter, takım+puan lacivert+semibold, başlık semibold, form 7px dot,
   form daralt+fikstür genişlet, fikstür: takım semibold + tamamlandı gizli + tarih/saat 11px + skor jilet. */
@media (min-width:901px){
  /* TÜM tablo + kontrol barı + fikstür = 14px */
  .mc-standings-table th, .mc-standings-table td, .mc-standings-table td *{ font-size:14px !important; }
  .mc-st-controls .mc-summary, .mc-st-seg-btn{ font-size:14px !important; }
  .mc-st-fix-header span, .mc-st-fix-tl .nm, .mc-st-fix-sc{ font-size:14px !important; }

  /* Başlık satırı semibold */
  .mc-standings-table th{ font-weight:600 !important; }
  /* Takım ismi + puan: lacivert + semibold; gerisi normal */
  .mc-standings-table td{ font-weight:400 !important; }
  .mc-standings-table td.st-name, .mc-standings-table td.st-name span, .mc-standings-table td.st-name a{ color:#0f172a !important; font-weight:600 !important; }
  .mc-standings-table td.st-pts, .mc-standings-table td.st-pts *{ color:#0f172a !important; font-weight:600 !important; }

  /* FORM → Takımlar dili: 7px yuvarlak dot, harf gizli, mevcut renk korunur */
  .mc-standings-table td.st-form .mc-st-form-wrap{ display:inline-flex !important; gap:3px !important; align-items:center; justify-content:center; }
  .mc-standings-table td.st-form .mc-st-form-box{ width:7px !important; height:7px !important; min-width:7px !important; padding:0 !important; border-radius:50% !important; font-size:0 !important; color:transparent !important; box-shadow:none !important; display:block !important; }

  /* Form hücresini içeriğe daralt + kazanılan fikstür panele */
  .mc-standings-table th:nth-child(13), .mc-standings-table td.st-form{ width:52px !important; }
  .mc-st-fixture-panel{ flex:0 0 290px !important; }

  /* Fikstür paneli: takım adı semibold + tamamlandı gizli + tarih/saat 11px + skor sabit jilet */
  .mc-st-fix-tl .nm{ font-weight:600 !important; }
  .mc-st-fix-tag{ display:none !important; }
  .mc-st-fix-dt, .mc-st-fix-dt *{ font-size:11px !important; }
  .mc-st-fix-sc{ min-width:16px !important; width:16px !important; text-align:right !important; font-variant-numeric:tabular-nums !important; flex:0 0 16px !important; }
}

/* ══════════════════════════════════════════════════════════════════════
   PREMIUM HEADER (geçiş alanı) — 6 sekme ortak giriş kapısı standardı.
   İZOLE sınıf: eski .mc-panel-header (koyu) ve .mc-st-controls EZİLMEZ;
   bu sınıf SADECE Takımlar/Puan/Fikstür/TD/Hakem/Tahmin sekmelerinde kullanılır.
   Kaynak: demo_transition_only.html (açık tema). Onay: 2026-06-07 Aa+Ba.
   ══════════════════════════════════════════════════════════════════════ */
.mc-premium-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 16px; border-bottom: 1px solid var(--border-color, #e2e8f0);
  background: var(--surface, #ffffff); flex-wrap: wrap; gap: 12px;
}
.mc-premium-header-title {
  font-size: 16px; font-weight: 700; color: var(--ink, #0f172a);
  margin: 0; display: flex; align-items: center; gap: 10px;
}
.mc-premium-header-title i { color: var(--brand-primary, #0d832d); }
.mc-premium-header-title .mc-ph-sub { font-size: 12px; color: var(--muted, #64748b); font-weight: 400; }
.mc-premium-header-right { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }

/* Ortak kontrol elemanları (demo: mc-select / mc-segment / checkbox) */
.mc-premium-header .mc-summary { color: var(--ink, #0f172a); border-bottom-color: rgba(15,23,42,0.2); }
.mc-premium-header .mc-summary::after { border-top-color: rgba(15,23,42,0.5); }
.mc-premium-segment { display: inline-flex; background: var(--slate-soft, #f1f5f9); padding: 4px; border-radius: 8px; border: 1px solid var(--border-color, #e2e8f0); }
.mc-premium-seg-btn { background: transparent; border: none; padding: 6px 14px; font: 700 13px/1 Inter, system-ui, sans-serif; color: var(--muted, #64748b); border-radius: 6px; cursor: pointer; transition: all .15s; }
.mc-premium-seg-btn:hover { color: var(--ink, #0f172a); }
.mc-premium-seg-btn.active { background: var(--surface, #fff); color: var(--ink, #0f172a); box-shadow: 0 1px 3px rgba(15,23,42,0.12); }
.mc-premium-checkbox-label { display: flex; align-items: center; gap: 8px; cursor: pointer; color: var(--muted, #64748b); font-size: 13px; font-weight: 600; }
.mc-premium-checkbox-label input { width: 16px; height: 16px; accent-color: var(--success, #16a34a); cursor: pointer; }
.mc-premium-info-btn { display: flex; align-items: center; gap: 6px; background: var(--slate-soft, #f1f5f9); border: 1px solid var(--border-color, #e2e8f0); padding: 7px 14px; font: 600 13px/1 Inter, system-ui, sans-serif; color: var(--ink, #0f172a); border-radius: 6px; cursor: pointer; transition: all .15s; }
.mc-premium-info-btn:hover { background: #e8eef4; }
.mc-premium-info-btn.active { color: var(--brand-primary, #0d832d); border-color: var(--brand-primary, #0d832d); }

/* ══════════════════════════════════════════════════════════════════════
   PREMIUM TABLE STANDARD — Demo 2 (Brand Accent + Zebra). Onay 2026-06-07.
   İZOLE: sadece .mc-premium-table atanan tablolar etkilenir. Eski .data-table
   kuralları SİLİNMEDİ. Kararlar: 1a (Tahminler hariç) / 2a (TD-Hakem ortalama
   renk korunur) / 3a (th'de !important VAR — eski kapkara başlığı ezer; td'de
   !important YOK — pv-hit/pv-miss/mc-cell-above/below gibi bilgi-renkleri
   doğal kazansın).
   ══════════════════════════════════════════════════════════════════════ */
/* Başlık — eski koyu .data-table th'i ez (th'de !important, 3a) */
.mc-premium-table th {
  background: rgba(13, 131, 45, 0.04) !important;
  color: var(--ink-2, #334155) !important;
  font-weight: 700 !important;
  font-size: 12px !important;
  text-transform: none !important;       /* eski uppercase iptal */
  letter-spacing: 0 !important;
  border-bottom: 2px solid rgba(13, 131, 45, 0.1) !important;
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
}
.mc-premium-table th.active-sort { color: var(--brand-primary, #0d832d) !important; }
/* Hücre — !important YOK (3a): bilgi-renkleri kendiliğinden üstte kalır */
.mc-premium-table td {
  border-bottom: 1px solid var(--border-color, #e2e8f0);
  vertical-align: middle;
}
/* Zebra — even satır nötr zemin. AMA bilgi-renk taşıyan hücreler MUAF (1a+2a). */
.mc-premium-table tbody tr:nth-child(even) td:not(.pv-hit):not(.pv-miss):not(.pv-predicted):not(.pv-val-muted):not(.mc-cell-above):not(.mc-cell-below) {
  background: var(--bg, #f8fafc);
}
/* Hover — uçuk yeşil, yine bilgi-renk hücreleri muaf */
.mc-premium-table tbody tr:hover td:not(.pv-hit):not(.pv-miss):not(.pv-predicted):not(.pv-val-muted):not(.mc-cell-above):not(.mc-cell-below) {
  background: rgba(13, 131, 45, 0.03);
}

/* .mc-fx-rich-table zebra/hover kuralları Gate-5'te SİLİNDİ (2026-06-09):
   rich variant ölü kod kaldırıldı (renderer hiç mc-fx-rich-table üretmiyordu). */