/* ==========================================================================
   iddialifutbol.com — saha temalı canlı skor arayüzü
   Tek dosya, bağımlılıksız. Renk paleti ve saha arka planı burada.
   ========================================================================== */

:root {
    --pitch-900: #04140b;
    --pitch-800: #0a2a17;
    --pitch-700: #0f3d22;
    --pitch-600: #14532d;
    --pitch-500: #16a34a;
    --pitch-400: #22c55e;
    --lime:      #a3e635;
    --ink:       #eafff2;
    --muted:     #9fc7ad;
    --line:      rgba(163, 230, 53, .14);
    --card:      rgba(6, 26, 15, .72);
    --card-solid:#0b2114;
    --live:      #ff3b47;
    --green:     #16a34a;
    --gold:      #fbbf24;
    --shadow:    0 10px 30px rgba(0,0,0,.35);
    --radius:    16px;
    --maxw:      1160px;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
    margin: 0;
    font-family: "Inter", "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;
    color: var(--ink);
    background-color: var(--pitch-900);
    background-image:
        radial-gradient(1200px 600px at 50% -10%, rgba(34,197,94,.22), transparent 60%),
        repeating-linear-gradient(90deg, transparent 0 78px, rgba(255,255,255,.028) 78px 156px),
        linear-gradient(180deg, var(--pitch-800), var(--pitch-900) 70%);
    background-attachment: fixed;
    min-height: 100vh;
    -webkit-font-smoothing: antialiased;
}

/* Saha çizgileri: ince orta yuvarlak + orta çizgi hissi (dekoratif) */
body::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 50% 42%, transparent 118px, rgba(255,255,255,.05) 119px, transparent 121px),
        linear-gradient(180deg, transparent calc(42% - 1px), rgba(255,255,255,.05) 42%, transparent calc(42% + 1px));
    z-index: 0;
    opacity: .5;
}

.wrap { max-width: var(--maxw); margin: 0 auto; padding: 0 18px; position: relative; z-index: 1; }

a { color: inherit; text-decoration: none; }

/* ---------- Üst bar ---------- */
.topbar {
    position: sticky; top: 0; z-index: 40;
    backdrop-filter: blur(10px);
    background: linear-gradient(180deg, rgba(4,20,11,.92), rgba(4,20,11,.75));
    border-bottom: 1px solid var(--line);
}
.topbar__row { display: flex; align-items: center; gap: 18px; height: 62px; }
.brand { display: flex; align-items: center; gap: 10px; font-weight: 800; font-size: 20px; letter-spacing: -.02em; }
.brand__ball {
    width: 30px; height: 30px; border-radius: 50%;
    background: radial-gradient(circle at 35% 30%, #fff, #cbd5c1 60%, #0b2114 61%);
    box-shadow: inset 0 0 0 2px #0b2114, var(--shadow);
    position: relative; flex: none;
}
.brand__ball::after { content:"⚽"; position:absolute; inset:0; display:grid; place-items:center; font-size:18px; }
.brand b { color: var(--lime); }

.nav { display: flex; gap: 4px; margin-left: auto; flex-wrap: wrap; }
.nav a {
    padding: 8px 14px; border-radius: 999px; font-weight: 600; font-size: 14px; color: var(--muted);
    transition: .15s;
}
.nav a:hover, .nav a.active { color: var(--pitch-900); background: var(--pitch-400); }

.menu-toggle { display:none; margin-left:auto; background:none; border:1px solid var(--line); color:var(--ink); border-radius:10px; padding:8px 12px; font-size:18px; cursor:pointer; }

/* ---------- Hero ---------- */
.hero { padding: 34px 0 10px; }
.hero h1 { margin: 0 0 6px; font-size: clamp(26px, 4vw, 40px); letter-spacing: -.03em; }
.hero h1 span { color: var(--lime); }
.hero p { margin: 0; color: var(--muted); max-width: 640px; }

/* ---------- Reklam / sponsor slotları ---------- */
.ad {
    display: grid; place-items: center; text-align: center;
    border: 1px dashed rgba(163,230,53,.28);
    border-radius: 14px;
    background: repeating-linear-gradient(45deg, rgba(163,230,53,.04) 0 12px, transparent 12px 24px);
    color: var(--muted); font-size: 12px; letter-spacing: .12em; text-transform: uppercase;
    overflow: hidden;
}
.ad small { display:block; opacity:.7; font-size:10px; margin-top:2px; }
.ad--leaderboard { min-height: 90px; margin: 16px 0; }
.ad--billboard   { min-height: 120px; margin: 16px 0; }
.ad--box         { min-height: 250px; }
.ad--infeed      { min-height: 96px; margin: 4px 0; }
.ad--sticky {
    position: sticky; bottom: 0; z-index: 35; min-height: 64px; margin-top: 18px;
    background: linear-gradient(180deg, rgba(4,20,11,.6), rgba(4,20,11,.96));
    border: 1px solid var(--line); border-bottom: none;
    border-radius: 14px 14px 0 0;
}
.sponsor-strip {
    display: flex; align-items: center; gap: 22px; flex-wrap: wrap; justify-content: center;
    padding: 14px 16px; margin: 16px 0;
    background: var(--card); border: 1px solid var(--line); border-radius: 14px;
}
.sponsor-strip .lbl { font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.sponsor-strip .logo {
    padding: 8px 16px; border-radius: 10px; background: rgba(255,255,255,.05);
    border: 1px solid var(--line); font-weight: 700; color: var(--muted);
}

/* ---------- Layout grid ---------- */
.layout { display: grid; grid-template-columns: 1fr 300px; gap: 22px; align-items: start; margin-top: 8px; }

/* Izgara/flex çocukları varsayılan olarak min-width:auto taşır: içeriklerinin
   en dar hâlinden daha fazla küçülemezler. Lig sayfasındaki hafta şeridinde
   34 çip var; bu şeridin "en dar hâli" ~1600px olduğu için 1fr kolonu o kadar
   şişiyor, sağdaki 300px'lik sütunu ekrandan dışarı itiyor ve maç satırları
   sayfa genişliğini aşıyordu. Kaydırma kutusunun (overflow-x:auto) devreye
   girebilmesi için ebeveynin küçülebilmesi şart.

   Tek satır ama etkisi geniş: aynı tuzak puan durumu tablosu gibi geniş
   içeriklerde de sessizce duruyordu. */
.layout > * { min-width: 0; }
.sidebar { position: sticky; top: 78px; display: grid; gap: 18px; }

/* ---------- Bölüm başlığı ---------- */
.section-head { display: flex; align-items: center; gap: 10px; margin: 26px 0 12px; }
.section-head h2 { font-size: 18px; margin: 0; letter-spacing: -.01em; }
.section-head .count { font-size: 12px; color: var(--pitch-900); background: var(--lime); padding: 2px 9px; border-radius: 999px; font-weight: 800; }
.live-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--live); box-shadow: 0 0 0 0 rgba(255,59,71,.6); animation: pulse 1.4s infinite; }
@keyframes pulse { 0%{box-shadow:0 0 0 0 rgba(255,59,71,.55)} 70%{box-shadow:0 0 0 10px rgba(255,59,71,0)} 100%{box-shadow:0 0 0 0 rgba(255,59,71,0)} }

/* ---------- Lig grubu ---------- */
.league-block { margin-bottom: 16px; }
.league-block__head {
    display: flex; align-items: center; gap: 10px; padding: 8px 12px;
    background: rgba(10,42,23,.6); border: 1px solid var(--line); border-radius: 12px 12px 0 0;
    font-weight: 700; font-size: 14px;
}
.league-block__head .flag { font-size: 16px; }
.league-block__head img { width: 20px; height: 20px; object-fit: contain; }
.league-block__body { border: 1px solid var(--line); border-top: none; border-radius: 0 0 12px 12px; overflow: hidden; }

/* ---------- Maç kartı (link + ok ile açılır) ---------- */
.match { border-top: 1px solid rgba(255,255,255,.05); background: var(--card); }
.match:first-child { border-top: none; }
.match__head { display: flex; align-items: stretch; }
.match__link {
    flex: 1; min-width: 0; display: grid; grid-template-columns: 50px 1fr auto 1fr; align-items: center; gap: 8px;
    padding: 9px 12px; color: inherit; transition: background .15s;
}
.match__link:hover { background: rgba(22,163,74,.10); }
.match__toggle {
    flex: none; width: 46px; border: none; background: rgba(255,255,255,.03); color: var(--muted);
    font-size: 14px; cursor: pointer; display: grid; place-items: center; transition: color .2s, background .15s;
}
.match__toggle:hover { background: rgba(22,163,74,.18); color: var(--lime); }
.match__toggle svg { display: block; transition: transform .2s; }
.match--open .match__toggle { color: var(--lime); background: rgba(22,163,74,.16); }
.match--open .match__toggle svg { transform: rotate(180deg); }
.match__panel { max-height: 0; overflow: hidden; transition: max-height .3s ease; background: rgba(4,20,11,.45); }
.match--open .match__panel { max-height: 560px; }
.match__panel-inner { padding: 4px 12px 12px; }

/* Alta açılan olay listesi */
.mev__loading, .mev__empty { color: var(--muted); font-size: 13px; padding: 10px 2px; }
.mev__list { list-style: none; margin: 0; padding: 6px 0; display: grid; gap: 3px; }
.mev__item { display: flex; align-items: center; gap: 10px; padding: 7px 10px; border-radius: 10px; font-size: 14px; }
.mev__item--home { background: linear-gradient(90deg, rgba(59,130,246,.12), transparent 70%); }
.mev__item--away { background: linear-gradient(270deg, rgba(245,158,11,.14), transparent 70%); flex-direction: row-reverse; text-align: right; }
.mev__min { font-weight: 800; color: var(--lime); min-width: 30px; font-variant-numeric: tabular-nums; }
.mev__ic { font-size: 15px; }
.mev__txt b { font-weight: 700; }
.mev__txt small { color: var(--muted); font-size: 12px; margin-left: 6px; }
.mev__item--away .mev__txt small { margin-left: 0; margin-right: 6px; }
.mev__more { display: inline-block; margin-top: 8px; font-size: 13px; font-weight: 700; color: var(--lime); }
.mev__more:hover { text-decoration: underline; }
.match__status { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px; text-align: center; font-size: 11px; font-weight: 700; color: var(--muted); line-height:1.2; }
.match__status .min { color: var(--live); font-size:11px; }
.match__status .badge-live { color: var(--live); }
.match__status .badge-ms { color: var(--muted); }
.match__status .ko-date { color: var(--muted); }
.match__status .st-other { font-size:10.5px; }

/* Karşılıklı (yatay) takım dizilişi — ince tek satır */
.match__side { display: flex; align-items: center; gap: 8px; min-width: 0; }
.match__side--home { justify-content: flex-end; }
.match__side--home .team__name { text-align: right; }
.match__side--away { justify-content: flex-start; }
.team__logo { width: 22px; height: 22px; object-fit: contain; flex: none; }
.team__logo--ph { width: 22px; height: 22px; border-radius: 6px; background: linear-gradient(135deg, var(--pitch-600), var(--pitch-700)); display:grid; place-items:center; font-size:11px; font-weight:800; color: var(--lime); flex:none; }
.team__name { font-size: 14px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pl-photo { width: 30px; height: 30px; border-radius: 50%; object-fit: cover; flex: none; background: var(--pitch-700); border: 1px solid var(--line); }

.match__score { display: flex; flex-direction: column; align-items: center; gap: 0; min-width: 62px; font-variant-numeric: tabular-nums; }
.match__score-line { display: flex; align-items: center; gap: 8px; }
.match__score-sep { color: var(--muted); opacity: .45; font-weight: 700; font-size: 14px; }
.match__score b { font-size: 17px; font-weight: 800; min-width: 15px; text-align: center; }
.match__score .g-win { color: var(--lime); }
.match__vs { color: var(--muted); opacity: .5; font-weight: 700; font-size: 15px; }
.match__ht { display:block; margin-top:2px; font-size:10.5px; font-weight:700; color: var(--muted); letter-spacing:.01em; white-space:nowrap; }

/* ---------- Puan durumu tablosu ---------- */
.table-card { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
table.standings { width: 100%; border-collapse: collapse; font-size: 14px; }
table.standings th, table.standings td { padding: 11px 10px; text-align: center; }
table.standings th { background: rgba(10,42,23,.7); color: var(--muted); font-size: 11px; text-transform: uppercase; letter-spacing: .06em; position: sticky; top: 0; }
table.standings td.team-cell, table.standings th.team-cell { text-align: left; }
table.standings tbody tr { border-top: 1px solid rgba(255,255,255,.04); }
table.standings tbody tr:hover { background: rgba(22,163,74,.09); }
.rank { display:inline-grid; place-items:center; width: 24px; height: 24px; border-radius: 7px; font-weight: 800; font-size: 12px; background: rgba(255,255,255,.05); }
.rank.ucl { background: var(--pitch-500); color: #04140b; }
.rank.uel { background: #2563eb; color: #fff; }
.rank.rel { background: #b91c1c; color: #fff; }
.pts { font-weight: 800; color: var(--lime); }
.form { display: inline-flex; gap: 3px; }
.form i { width: 16px; height: 16px; border-radius: 4px; font-style: normal; font-size: 10px; font-weight: 800; display:grid; place-items:center; color:#04140b; }
.form i.W { background: var(--pitch-400); }
.form i.D { background: #cbd5c1; }
.form i.L { background: #ef4444; color:#fff; }

/* ---------- Tarih gezinme ---------- */
.date-nav { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 8px 0 18px;
    background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 10px 14px; }
.date-nav a { padding: 8px 14px; border-radius: 10px; background: rgba(255,255,255,.05); font-weight: 700; font-size: 14px; }
.date-nav a:hover { background: var(--pitch-500); color:#04140b; }
.date-nav .cur { font-weight: 800; }

/* ---------- Maç detay ---------- */
.match-hero { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 26px 18px; text-align: center; margin-bottom: 18px; position: relative; overflow: hidden; }
.match-hero::before { content:""; position:absolute; inset:0; background: radial-gradient(600px 200px at 50% 0, rgba(34,197,94,.18), transparent 70%); }
.match-hero__teams { position:relative; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 14px; }
.match-hero__team { display: grid; justify-items: center; gap: 10px; }
.match-hero__team .big-logo { width: 64px; height: 64px; object-fit: contain; }
.match-hero__team .big-logo--ph { width:64px; height:64px; border-radius: 16px; background: linear-gradient(135deg, var(--pitch-600), var(--pitch-700)); display:grid; place-items:center; font-size:22px; font-weight:800; color:var(--lime); }
.match-hero__team h3 { margin: 0; font-size: 18px; }
.match-hero__score { font-size: 44px; font-weight: 900; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.match-hero__meta { position:relative; margin-top: 12px; color: var(--muted); font-size: 14px; }
.match-hero__meta .live { color: var(--live); font-weight: 800; }
.match-hero__periods { display:flex; justify-content:center; flex-wrap:wrap; gap:8px; margin-top:12px; }
.match-hero__periods .mper { display:inline-flex; align-items:center; gap:6px; background: rgba(255,255,255,.04); border:1px solid var(--line); border-radius:999px; padding:5px 12px; font-size:13px; font-weight:800; font-variant-numeric: tabular-nums; letter-spacing:-.01em; }
.match-hero__periods .mper i { font-style:normal; font-weight:700; font-size:11px; color: var(--muted); letter-spacing:.02em; }
.match-hero__periods .mper--ms { background: rgba(163,230,53,.12); border-color: rgba(163,230,53,.35); }
.match-hero__periods .mper--ms i { color: var(--lime); }

.events { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 6px 0; }
.event { display: grid; grid-template-columns: 44px 1fr; gap: 10px; padding: 12px 16px; border-top: 1px solid rgba(255,255,255,.04); align-items:center; }
.event:first-child { border-top: none; }
.event.away { direction: rtl; text-align: right; }
.event.away .event__body { direction: ltr; }
.event__min { font-weight: 800; color: var(--lime); }
.event__type { font-size: 12px; color: var(--muted); }

/* ---------- Genel yardımcılar ---------- */
.card { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 16px; }
.card h3 { margin: 0 0 10px; font-size: 15px; }
.chip-list { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { padding: 7px 12px; border-radius: 999px; background: rgba(255,255,255,.05); border: 1px solid var(--line); font-size: 13px; font-weight: 600; color: var(--muted); }
.chip:hover, .chip.active { background: var(--pitch-400); color: #04140b; border-color: transparent; }
.demo-banner { margin: 14px 0 0; padding: 10px 14px; border-radius: 12px; background: rgba(251,191,36,.12); border: 1px solid rgba(251,191,36,.3); color: var(--gold); font-size: 13px; }
.empty { padding: 30px; text-align: center; color: var(--muted); }

/* ---------- Footer ---------- */
.footer { margin-top: 40px; padding: 26px 0; border-top: 1px solid var(--line); color: var(--muted); font-size: 13px; }
.footer .cols { display: flex; flex-wrap: wrap; gap: 24px; justify-content: space-between; }
.footer a:hover { color: var(--lime); }
.footer .legal { margin-top: 16px; font-size: 11.5px; opacity: .8; line-height: 1.6; }

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
    .layout { grid-template-columns: 1fr; }
    .sidebar { position: static; order: 3; }
    .nav { display: none; position: absolute; top: 100%; left: 0; right: 0; flex-direction: column; background: var(--card-solid); padding: 10px; border-bottom: 1px solid var(--line); }
    .nav.open { display: flex; }
    .menu-toggle { display: inline-block; }
}
@media (max-width: 520px) {
    .team__name { font-size: 13.5px; }
    table.standings .hide-sm { display: none; }
    .match-hero__score { font-size: 34px; }
}

/* ==========================================================================
   Diziliş (saha görünümü) · Model tahmini · İstatistik barları
   ========================================================================== */

.lineups { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }

.pitch { border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; background: var(--card); display: flex; flex-direction: column; }
.pitch__head { display: flex; align-items: center; justify-content: space-between; padding: 10px 14px; font-size: 14px; background: rgba(10,42,23,.7); }
.pitch__head span { font-weight: 800; color: var(--lime); letter-spacing: .04em; }
.pitch__field {
    position: relative; flex: 1;
    display: flex; flex-direction: column; justify-content: space-between;
    gap: 6px; padding: 18px 8px 30px; min-height: 470px;
    background:
        radial-gradient(circle at 50% 50%, transparent 46px, rgba(255,255,255,.10) 47px, transparent 49px),
        linear-gradient(0deg, transparent 49.6%, rgba(255,255,255,.10) 50%, transparent 50.4%),
        repeating-linear-gradient(0deg, rgba(255,255,255,.03) 0 40px, transparent 40px 80px),
        linear-gradient(180deg, #0e4526, #0a3319);
}
.pitch--away .pitch__field { background:
        radial-gradient(circle at 50% 50%, transparent 46px, rgba(255,255,255,.10) 47px, transparent 49px),
        linear-gradient(0deg, transparent 49.6%, rgba(255,255,255,.10) 50%, transparent 50.4%),
        repeating-linear-gradient(0deg, rgba(255,255,255,.03) 0 40px, transparent 40px 80px),
        linear-gradient(180deg, #0d4023, #0a3016); }
.pitch__row { display: flex; justify-content: space-around; align-items: center; }
.pitch__coach { padding: 9px 14px; font-size: 12px; color: var(--muted); border-top: 1px solid var(--line); }
.pitch__coach b { color: var(--ink); }

.pl { display: grid; justify-items: center; gap: 3px; width: 66px; text-align: center; }
.pl__dot {
    position: relative; width: 36px; height: 36px; border-radius: 50%;
    display: grid; place-items: center; font-weight: 800; font-size: 14px;
    box-shadow: var(--shadow); border: 2px solid rgba(255,255,255,.85);
}
.pl__dot--home { background: linear-gradient(160deg, #1e40af, #1d4ed8); color: #fff; }
.pl__dot--away { background: linear-gradient(160deg, #f59e0b, #fbbf24); color: #3a2a04; border-color: rgba(0,0,0,.35); }
.pl__num { pointer-events: none; }
.pl__goal { position: absolute; top: -8px; right: -10px; font-size: 13px; filter: drop-shadow(0 1px 1px #000); }
.pl__goal i { font-style: normal; font-size: 9px; font-weight: 800; }
.pl__card { position: absolute; top: -6px; left: -8px; width: 9px; height: 13px; border-radius: 2px; box-shadow: 0 1px 2px rgba(0,0,0,.5); }
.pl__card.y { background: #facc15; }
.pl__card.r { background: #ef4444; }
.pl__name { font-size: 11.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 66px; color: #eafff2; text-shadow: 0 1px 2px rgba(0,0,0,.6); }
.pl__rating { font-size: 10.5px; font-weight: 800; padding: 1px 6px; border-radius: 6px; color: #04140b; }
.pl__rating.hi { background: var(--pitch-400); }
.pl__rating.mid { background: #cbd5c1; }
.pl__rating.lo { background: #f59e0b; }
.pl__rating.nr { background: rgba(255,255,255,.15); color: var(--muted); }

/* Model tahmini kartı */
.pred { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 16px 18px; margin-bottom: 8px; }
.pred__teams { display: flex; align-items: center; justify-content: space-between; font-weight: 700; font-size: 14px; margin-bottom: 10px; }
.pred__teams small { color: var(--muted); font-weight: 600; text-transform: uppercase; letter-spacing: .1em; font-size: 10px; }
.pred__bar { display: flex; height: 12px; border-radius: 999px; overflow: hidden; background: rgba(255,255,255,.06); }
.pred__bar .seg--h { background: #3b82f6; }
.pred__bar .seg--d { background: #6b7280; }
.pred__bar .seg--a { background: #ef4444; }
.pred__labels { display: flex; justify-content: space-between; margin-top: 8px; font-size: 13px; color: var(--muted); }
.pred__labels b { color: var(--ink); }
.pred__chips { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 14px; }
.pchip { display: flex; align-items: center; gap: 8px; padding: 10px 14px; border-radius: 12px; background: rgba(255,255,255,.04); border: 1px solid var(--line); }
.pchip b { font-size: 18px; color: var(--lime); font-variant-numeric: tabular-nums; }
.pchip small { color: var(--muted); font-size: 11px; }
.pchip__tag { padding: 3px 9px; border-radius: 8px; background: var(--pitch-500); color: #04140b; font-weight: 800; font-size: 12px; }
.pchip__tag.alt { background: #3b82f6; color: #fff; }
.pred__advice { margin-top: 14px; font-size: 14px; }
.pred__advice b { color: var(--lime); }
.pred__note { margin-top: 6px; font-size: 13px; color: var(--muted); }
.pred__disclaimer { margin-top: 12px; font-size: 11px; color: var(--muted); opacity: .8; border-top: 1px solid var(--line); padding-top: 10px; }

/* İstatistik barları */
.stats .stat { padding: 10px 0; border-top: 1px solid rgba(255,255,255,.05); }
.stats .stat:first-child { border-top: none; }
.stat__row { display: flex; justify-content: space-between; align-items: center; font-size: 14px; }
.stat__row span { color: var(--muted); font-size: 13px; }
.stat__bar { display: flex; height: 6px; margin-top: 7px; border-radius: 999px; overflow: hidden; background: rgba(255,255,255,.06); }
.stat__h { background: var(--pitch-400); }
.stat__a { background: #6b7280; }

@media (max-width: 640px) {
    .lineups { grid-template-columns: 1fr; }
    .pitch__field { min-height: 420px; }
}

/* ---- Diziliş ince ayar ---- */
.pl { width: 88px; gap: 2px; }
.pl__pos { font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: rgba(234,255,242,.5); }
.pl__name { max-width: 88px; }
.pl__rating { padding: 1px 6px; }
.pitch__field { padding: 18px 4px 34px; }
.pitch__row { padding: 3px 0; position: relative; z-index: 1; }

/* Kaleci tarafındaki kale (file) */
.pitch__goal {
    position: absolute; left: 50%; transform: translateX(-50%); bottom: 4px;
    width: 116px; height: 30px; z-index: 0; opacity: .5;
    border: 2px solid rgba(255,255,255,.6); border-bottom: none; border-radius: 3px 3px 0 0;
    background-image:
        repeating-linear-gradient(90deg, rgba(255,255,255,.28) 0 1px, transparent 1px 11px),
        repeating-linear-gradient(0deg,  rgba(255,255,255,.28) 0 1px, transparent 1px 11px);
}

/* ==========================================================================
   Skor kartı topla oynama · Açılır paneller (accordion) · Mini puan durumu
   ========================================================================== */
:root { --home-c: #1d4ed8; --away-c: #f59e0b; }

/* Skor kartı: takım renkli topla oynama barı */
.match-hero.is-toggle { cursor: pointer; }
.match-hero__poss { position: relative; max-width: 440px; margin: 18px auto 0; }
.match-hero__poss .pbar { display: flex; height: 10px; border-radius: 999px; overflow: hidden; background: rgba(255,255,255,.08); }
.match-hero__poss .pbar .h { background: var(--home-c); }
.match-hero__poss .pbar .a { background: var(--away-c); }
.match-hero__poss .plab { display: flex; justify-content: space-between; align-items: center; margin-top: 6px; font-size: 12px; color: var(--muted); }
.match-hero__poss .plab b { color: var(--ink); font-variant-numeric: tabular-nums; }
.match-hero__poss .plab .mid { text-transform: uppercase; letter-spacing: .1em; font-size: 10px; }
.match-hero__hint { position: relative; margin-top: 12px; font-size: 12px; color: var(--lime); font-weight: 700; }

/* Açılır paneller */
.acc { border: 1px solid var(--line); border-radius: 14px; overflow: hidden; margin-bottom: 12px; background: var(--card); }
.acc__head { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 13px 16px; background: rgba(10,42,23,.55); border: none; color: var(--ink); font-size: 15px; font-weight: 800; cursor: pointer; text-align: left; }
.acc__head:hover { background: rgba(22,163,74,.12); }
.acc__chev { color: var(--muted); transition: transform .2s, color .2s; }
.acc--open .acc__chev { transform: rotate(180deg); color: var(--lime); }
.acc__body { max-height: 0; overflow: hidden; transition: max-height .3s ease; }
.acc--open .acc__body { max-height: 1200px; }
.acc__inner { padding: 8px 14px 14px; }

/* Mini puan durumu (maç detay sidebar) */
.mini { max-height: 360px; overflow-y: auto; }
.mini table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.mini thead th { position: sticky; top: 0; background: var(--card-solid); z-index: 1; }
.mini th, .mini td { padding: 6px 5px; text-align: center; }
.mini th { color: var(--muted); font-size: 10px; text-transform: uppercase; letter-spacing: .05em; }
.mini td.tc, .mini th.tc { text-align: left; }
.mini tbody tr { border-top: 1px solid rgba(255,255,255,.05); }
.mini tbody tr.hl { background: rgba(163,230,53,.14); }
.mini .r { display: inline-grid; place-items: center; width: 20px; height: 20px; border-radius: 6px; font-weight: 800; font-size: 11px; background: rgba(255,255,255,.06); }
.mini .r.ucl { background: var(--pitch-500); color: #04140b; }
.mini .r.rel { background: #b91c1c; color: #fff; }
.mini .tn { display: inline-block; max-width: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: middle; }
.mini .p { font-weight: 800; color: var(--lime); }
.mini__more { display: inline-block; margin-top: 10px; font-size: 12px; font-weight: 700; color: var(--lime); }

/* ---- Diziliş başlık logosu + mini tablo logosu ---- */
.pitch__team { display: flex; align-items: center; gap: 8px; }
.pitch__logo { width: 22px; height: 22px; object-fit: contain; }
.mini__logo { width: 18px; height: 18px; object-fit: contain; vertical-align: middle; margin-right: 6px; }
.mini .tn { max-width: 96px; }

/* ---- Sıradaki maçlar ---- */
.nextfx { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.nfx { background: var(--card); border: 1px solid var(--line); border-radius: 14px; padding: 14px 16px; }
.nfx__owner { display: flex; align-items: center; gap: 8px; font-weight: 800; }
.nfx__owner img { width: 22px; height: 22px; object-fit: contain; }
.nfx__owner small { margin-left: auto; color: var(--muted); font-weight: 600; font-size: 11px; text-transform: uppercase; letter-spacing: .08em; }
.nfx__match { display: flex; align-items: center; gap: 10px; margin-top: 12px; font-size: 16px; }
.nfx__match img { width: 26px; height: 26px; object-fit: contain; }
.nfx__match b { font-weight: 700; }
.nfx__ha { font-size: 11px; font-weight: 800; padding: 3px 8px; border-radius: 8px; }
.nfx__ha.ev { background: var(--pitch-500); color: #04140b; }
.nfx__ha.dep { background: #3b82f6; color: #fff; }
.nfx__meta { margin-top: 10px; color: var(--muted); font-size: 13px; }
@media (max-width: 640px) { .nextfx { grid-template-columns: 1fr; } }

/* ---- Lig seçimi (aşağı açılan combobox) ---- */
.lgbar { display: flex; align-items: center; gap: 12px; margin: 22px 0 10px; }
.lgbar__label { color: var(--muted); font-weight: 700; font-size: 14px; }
.lgdrop { position: relative; }
.lgdrop__btn {
    display: flex; align-items: center; gap: 14px; min-width: 250px; justify-content: space-between;
    padding: 12px 16px; border-radius: 12px; border: 1px solid var(--line);
    background: var(--card); color: var(--ink); font-weight: 800; font-size: 15px; cursor: pointer;
}
.lgdrop__btn:hover { border-color: rgba(163,230,53,.4); }
.lgdrop__chev { color: var(--muted); transition: transform .2s, color .2s; }
.lgdrop.open .lgdrop__chev { transform: rotate(180deg); color: var(--lime); }
.lgdrop__menu {
    position: absolute; top: calc(100% + 6px); left: 0; z-index: 30; min-width: 270px;
    list-style: none; margin: 0; padding: 6px; border-radius: 12px;
    background: var(--card-solid); border: 1px solid var(--line); box-shadow: var(--shadow);
    max-height: 340px; overflow-y: auto;
    opacity: 0; visibility: hidden; transform: translateY(-6px);
    transition: opacity .15s ease, transform .15s ease, visibility .15s;
}
.lgdrop.open .lgdrop__menu { opacity: 1; visibility: visible; transform: translateY(0); }
.lgdrop__menu li { margin: 0; }
.lgdrop__menu a { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 12px; border-radius: 9px; font-weight: 600; }
.lgdrop__menu a small { color: var(--muted); font-weight: 500; font-size: 12px; }
.lgdrop__menu a:hover { background: rgba(22,163,74,.14); }
/* Seçili satır eskiden dolu yeşildi (--pitch-500). Sorun şuydu: o yeşilin
   üzerinde hem lig logosu hem ikincil metin okunmuyordu, üstelik menüdeki en
   dikkat çekici öğe SEÇİLİ olan değil, kullanıcının seçmek İSTEDİĞİ öğe
   olmalı. Artık ince bir tint + sol kenarda lime bir şerit: seçili olduğu
   belli ama satırın içeriğini boğmuyor. */
.lgdrop__menu a.sel {
    background: rgba(163,230,53,.14);
    color: var(--ink);
    box-shadow: inset 3px 0 0 0 var(--lime);
}
.lgdrop__menu a.sel .lgb__name { color: var(--lime); }
.lgdrop__menu a.sel small { color: var(--muted); }
@media (max-width: 520px) {
    .lgbar { flex-wrap: wrap; }
    .lgdrop, .lgdrop__btn, .lgdrop__menu { width: 100%; min-width: 0; }
}

/* ---- Lig seçici + Canlı Maçlar başlığı aynı satırda ---- */
.livebar { display: flex; align-items: center; gap: 16px; margin: 10px 0 14px; flex-wrap: wrap; }
.livebar__title { display: flex; align-items: center; gap: 10px; }
.livebar__title h2 { font-size: 18px; margin: 0; letter-spacing: -.01em; }
.livebar .lgdrop { margin-left: auto; }               /* seçiciyi en sağa it */
.livebar .lgdrop__menu { left: auto; right: 0; }       /* menü sağ kenara hizalı açılsın */
.lgdrop__chev { width: 18px; height: 18px; }
@media (max-width: 560px) {
    .livebar { gap: 10px; }
    .livebar .lgdrop, .livebar .lgdrop__btn { width: 100%; min-width: 0; }
}

/* ==========================================================================
   Sade logo: "futbol"daki o harfi bir top; arada bir yerinde zıplar
   ========================================================================== */
.logo-word { display: inline-flex; align-items: baseline; letter-spacing: -.02em; white-space: nowrap; }
.logo-word .logo-word__i { color: var(--ink); }
.logo-word b { color: var(--lime); }

.logo-ball {
    display: inline-block; font-size: .92em; line-height: 1; margin: 0 .04em; vertical-align: -.04em;
    transform-origin: 50% 100%;
    animation: oBounce 3.4s ease-in-out infinite;   /* arada bir zıpla */
}
/* zıplama: her döngüde kısa bir çift sıçrama, sonra dinlen */
@keyframes oBounce {
    0%, 62%, 100% { transform: translateY(0) scaleY(1); }
    66% { transform: translateY(0) scaleY(.86); }        /* çömel */
    74% { transform: translateY(-7px) scaleY(1.06); }    /* yüksek sıçrama */
    82% { transform: translateY(0) scaleY(.92); }        /* iniş */
    88% { transform: translateY(-3px) scaleY(1.02); }    /* küçük ikinci sıçrama */
    94% { transform: translateY(0) scaleY(1); }
}
.brand:hover .logo-ball { animation-duration: 1.1s; }    /* üstüne gelince daha canlı */

@media (prefers-reduced-motion: reduce) {
    .logo-ball { animation: none; }
}

/* ---- Mobil ince ayarlar ---- */
@media (max-width: 520px) {
    .date-nav { padding: 8px 10px; gap: 8px; }
    .date-nav .cur { font-size: 13px; text-align: center; }
    .date-nav a { padding: 8px 10px; font-size: 13px; white-space: nowrap; }
    .hero h1 { font-size: 26px; }
    .livebar__title h2 { font-size: 17px; }
}

/* ---- Lig + Sezon seçici birlikte (puan durumu) ---- */
.livebar .lg-actions { margin-left: auto; display: flex; gap: 10px; flex-wrap: wrap; }
.livebar .lg-actions .lgdrop { margin-left: 0; }
.lgdrop--sm .lgdrop__btn { min-width: 140px; }
.lgdrop--sm .lgdrop__menu { min-width: 170px; }
.season-tag { font-size: 12px; font-weight: 800; color: var(--pitch-900); background: var(--lime); padding: 2px 9px; border-radius: 999px; }
@media (max-width: 560px) {
    .livebar .lg-actions { width: 100%; }
    .livebar .lg-actions .lgdrop, .livebar .lg-actions .lgdrop__btn { width: 100%; }
}

/* ---------- Takım detay sayfası ---------- */
.tm-hero { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin: 2px 0 16px; }
.tm-head { display: flex; align-items: center; gap: 16px; min-width: 0; }
.tm-head h1 { font-size: clamp(22px, 3vw, 30px); letter-spacing: -.02em; }
.tm-logo { width: 60px; height: 60px; object-fit: contain; flex: none; }
.tm-hero p { color: var(--muted); }
.tm-hero .lg-actions { display: flex; gap: 10px; flex-wrap: wrap; }
@media (max-width: 560px) { .tm-hero .lg-actions { width: 100%; } .tm-hero .lg-actions .lgdrop, .tm-hero .lg-actions .lgdrop__btn { width: 100%; } }
.tm-cardhead { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.stat-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.stat { background: rgba(255,255,255,.04); border: 1px solid var(--line); border-radius: 12px; padding: 12px 10px; text-align: center; }
.stat b { display: block; font-size: 22px; font-weight: 800; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.stat span { display: block; margin-top: 3px; font-size: 11.5px; color: var(--muted); }
.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.split { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.split th { color: var(--muted); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; padding: 6px 4px; text-align: center; }
.split td { padding: 9px 4px; text-align: center; border-top: 1px solid var(--line); font-variant-numeric: tabular-nums; }
.split td.lbl { text-align: left; font-weight: 700; white-space: nowrap; }
@media (max-width: 560px) { .split { font-size: 13px; } .split th, .split td { padding-left: 3px; padding-right: 3px; } }
.tm-facts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.tm-facts .fact { font-size: 12px; color: var(--muted); background: rgba(255,255,255,.04); border: 1px solid var(--line); border-radius: 999px; padding: 5px 11px; }
.tm-facts .fact b { color: var(--ink); }
.sq-group { margin: 16px 0 8px; font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: var(--lime); }
.sq-group:first-child { margin-top: 4px; }
.squad-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.sq-card { display: flex; align-items: center; gap: 10px; background: rgba(255,255,255,.04); border: 1px solid var(--line); border-radius: 12px; padding: 8px 10px; min-width: 0; }
.sq-info { min-width: 0; display: grid; }
.sq-name { font-size: 13px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sq-age { font-size: 11px; color: var(--muted); }
.kv { display: grid; gap: 8px; }
.kv > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 13px; }
.kv span { color: var(--muted); }
.kv b { font-weight: 700; text-align: right; }
@media (max-width: 720px) {
    .stat-grid { grid-template-columns: repeat(2, 1fr); }
    .squad-grid { grid-template-columns: repeat(2, 1fr); }
    .tm-logo { width: 52px; height: 52px; }
}
.team-link { text-decoration: none; color: inherit; }
.team-link:hover .team__name { color: var(--lime); }

/* ---------- Maç öncesi / H2H ---------- */
.h2h-sum { display: grid; grid-template-columns: 1fr 1.4fr 1fr; align-items: center; gap: 14px; padding: 4px 2px 16px; }
.h2h-sum__side { display: grid; justify-items: center; gap: 2px; }
.h2h-sum__side img { width: 36px; height: 36px; object-fit: contain; }
.h2h-sum__side b { font-size: 26px; font-weight: 800; line-height: 1; }
.h2h-sum__side span { font-size: 11px; color: var(--muted); }
.h2h-sum__mid { display: grid; gap: 8px; }
.h2h-sum__draw { text-align: center; }
.h2h-sum__draw b { font-size: 18px; font-weight: 800; }
.h2h-sum__draw span { display: block; font-size: 11px; color: var(--muted); }
.h2h-bar { display: flex; height: 10px; border-radius: 999px; overflow: hidden; background: rgba(255,255,255,.06); }
.h2h-bar .hw { background: var(--lime); }
.h2h-bar .dr { background: #cbd5c1; }
.h2h-bar .aw { background: #60a5fa; }
.h2h-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.h2h-row { display: grid; grid-template-columns: 96px 1fr auto 1fr; align-items: center; gap: 8px; padding: 8px 6px; border-top: 1px solid var(--line); font-size: 13px; }
.h2h-date { color: var(--muted); font-size: 11.5px; white-space: nowrap; }
.h2h-team { display: flex; align-items: center; gap: 7px; min-width: 0; }
.h2h-team img { width: 20px; height: 20px; object-fit: contain; flex: none; }
.h2h-team--h { justify-content: flex-end; text-align: right; }
.h2h-team--a { justify-content: flex-start; }
.h2h-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.h2h-team.w .h2h-name { font-weight: 800; color: var(--ink); }
.h2h-score { font-weight: 800; font-variant-numeric: tabular-nums; background: rgba(255,255,255,.05); border-radius: 8px; padding: 3px 9px; white-space: nowrap; }
@media (max-width: 560px) {
    .h2h-row { grid-template-columns: 1fr auto 1fr; }
    .h2h-date { display: none; }
    .h2h-name { max-width: 84px; }
}

/* ---------- Global sayfa başlığı (breadcrumb + pagebar) ---------- */
.crumbs { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin: 22px 0 10px; font-size: 12.5px; color: var(--muted); }
.crumbs a { color: var(--muted); text-decoration: none; }
.crumbs a:hover { color: var(--lime); }
.crumbs__sep { opacity: .5; }
.crumbs__cur { color: var(--ink); font-weight: 700; }
.pagebar { display: flex; align-items: center; gap: 16px; margin: 0 0 16px; flex-wrap: wrap; }
.pagebar__title { display: flex; align-items: center; gap: 10px; min-width: 0; }
.pagebar__title h1 { font-size: clamp(20px, 2.6vw, 26px); margin: 0; letter-spacing: -.02em; line-height: 1.15; }
.pagebar .lg-actions { margin-left: auto; display: flex; gap: 10px; flex-wrap: wrap; }
.pagebar .lg-actions .lgdrop { margin-left: 0; }
.pagebar .lg-actions .lgdrop__menu { left: auto; right: 0; }
@media (max-width: 560px) {
    .pagebar { gap: 10px; }
    .pagebar .lg-actions { width: 100%; }
    .pagebar .lg-actions .lgdrop, .pagebar .lg-actions .lgdrop__btn { width: 100%; }
}
.mini-team { display: inline-flex; align-items: center; }
.team-link:hover .tn { color: var(--lime); }

/* ---------- Sakatlıklar / Cezalılar ---------- */
.inj-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.inj-team { padding: 0; overflow: hidden; }
.inj-team__head { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-bottom: 1px solid var(--line); color: inherit; }
.inj-team__head img { width: 26px; height: 26px; object-fit: contain; flex: none; }
.inj-team__head h3 { margin: 0; font-size: 15px; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.inj-team__head.team-link:hover h3 { color: var(--lime); }
.inj-count { font-size: 12px; font-weight: 800; color: var(--pitch-900); background: var(--gold); border-radius: 999px; padding: 2px 9px; flex: none; }
.inj-list { list-style: none; margin: 0; padding: 6px 6px 10px; display: grid; gap: 2px; }
.inj-row { display: flex; align-items: center; gap: 10px; padding: 7px 8px; border-radius: 10px; }
.inj-row:hover { background: rgba(255,255,255,.03); }
.inj-name { flex: 1; min-width: 0; font-size: 13.5px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.inj-info { display: flex; align-items: center; gap: 8px; flex: none; }
.inj-reason { font-size: 11.5px; color: var(--muted); }
.inj-badge { font-size: 11px; font-weight: 700; border-radius: 999px; padding: 3px 8px; white-space: nowrap; }
.inj-badge.inj { background: rgba(251,191,36,.14); color: var(--gold); border: 1px solid rgba(251,191,36,.3); }
.inj-badge.susp { background: rgba(239,68,68,.14); color: #fca5a5; border: 1px solid rgba(239,68,68,.3); }
@media (max-width: 720px) {
    .inj-grid { grid-template-columns: 1fr; }
    .inj-reason { display: none; }
}

/* ---------- Takım transfer geçmişi ---------- */
.tr-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.tr-row { display: flex; align-items: center; gap: 10px; padding: 8px 6px; border-top: 1px solid var(--line); font-size: 13px; }
.tr-row:first-child { border-top: none; }
.tr-date { color: var(--muted); font-size: 11.5px; white-space: nowrap; min-width: 86px; flex: none; }
.tr-badge { font-size: 10.5px; font-weight: 800; border-radius: 999px; padding: 3px 8px; white-space: nowrap; flex: none; }
.tr-badge.in { background: rgba(34,197,94,.14); color: var(--pitch-400); border: 1px solid rgba(34,197,94,.3); }
.tr-badge.out { background: rgba(239,68,68,.12); color: #fca5a5; border: 1px solid rgba(239,68,68,.28); }
.tr-main { display: flex; align-items: center; gap: 7px; flex: 1; min-width: 0; }
.tr-player { font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 40%; }
.tr-sep { color: var(--muted); flex: none; }
.tr-other { display: inline-flex; align-items: center; gap: 6px; min-width: 0; color: inherit; }
.tr-other img { width: 18px; height: 18px; object-fit: contain; flex: none; }
.tr-other span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tr-other.team-link:hover span { color: var(--lime); }
.tr-fee { font-size: 12px; font-weight: 700; color: var(--lime); white-space: nowrap; flex: none; }
.tr-career { gap: 8px; }
.tr-career .tr-other { max-width: 42%; }
.tr-note { color: var(--muted); font-size: 11.5px; margin: 12px 2px 0; line-height: 1.5; }
@media (max-width: 560px) {
    .tr-date { display: none; }
    .tr-player { max-width: 34%; }
    .tr-career .tr-other { max-width: 40%; }
    .tr-career .tr-other img { width: 16px; height: 16px; }
}

/* ---------- Arama ---------- */
.topsearch { display: flex; align-items: center; gap: 8px; padding: 7px 12px; border-radius: 999px; background: rgba(255,255,255,.05); border: 1px solid var(--line); color: var(--muted); min-width: 180px; max-width: 280px; flex: 1 1 200px; transition: border-color .15s; }
.topsearch:focus-within { border-color: var(--pitch-400); }
.topsearch svg { flex: none; }
.topsearch input { flex: 1; min-width: 0; background: none; border: none; outline: none; color: var(--ink); font-size: 13.5px; font-family: inherit; }
.topsearch input::placeholder { color: var(--muted); }
.search-page { display: flex; gap: 10px; margin: 4px 0 18px; }
.search-page input { flex: 1; padding: 12px 16px; border-radius: 12px; background: rgba(255,255,255,.05); border: 1px solid var(--line); color: var(--ink); font-size: 15px; font-family: inherit; outline: none; }
.search-page input:focus { border-color: var(--pitch-400); }
.search-page button { padding: 0 20px; border-radius: 12px; border: none; background: var(--pitch-400); color: #04140b; font-weight: 800; font-size: 14px; cursor: pointer; }
.search-page button:hover { background: var(--lime); }
.search-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.search-hit { display: flex; align-items: center; gap: 11px; padding: 12px 14px; border-radius: 12px; background: var(--card); border: 1px solid var(--line); color: inherit; transition: border-color .15s, background .15s; min-width: 0; }
.search-hit:hover { border-color: var(--pitch-400); background: rgba(22,163,74,.08); }
.search-hit img { width: 28px; height: 28px; object-fit: contain; flex: none; }
.search-hit__ph { width: 28px; height: 28px; border-radius: 7px; background: linear-gradient(135deg, var(--pitch-600), var(--pitch-700)); display: grid; place-items: center; font-size: 11px; font-weight: 800; color: var(--lime); flex: none; }
.search-hit__name { font-weight: 600; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.search-hit__pl { width: 34px; height: 34px; border-radius: 50%; object-fit: cover; background: var(--pitch-700); border: 1px solid var(--line); flex: none; }
.search-hit__meta { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.search-hit__meta small { color: var(--muted); font-size: 11.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 760px) { .search-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .search-grid { grid-template-columns: 1fr; } }

/* ---------- Canlı arama önerileri (autocomplete) ---------- */
.topsearch-wrap { position: relative; display: flex; flex: 1 1 200px; max-width: 300px; }
.topsearch-wrap .topsearch { flex: 1; max-width: none; }
.ac-menu { position: absolute; top: calc(100% + 6px); left: 0; right: 0; z-index: 60; background: var(--card-solid); border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow); overflow: hidden; padding: 5px; }
.ac-item { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 9px; color: var(--ink); }
.ac-item:hover, .ac-item.active { background: rgba(22,163,74,.16); }
.ac-item img { width: 22px; height: 22px; object-fit: contain; flex: none; }
.ac-ph { width: 22px; height: 22px; border-radius: 6px; background: linear-gradient(135deg, var(--pitch-600), var(--pitch-700)); display: grid; place-items: center; font-size: 10px; font-weight: 800; color: var(--lime); flex: none; }
.ac-name { font-size: 13.5px; font-weight: 600; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ac-sub { font-size: 11px; color: var(--muted); flex: none; }
@media (max-width: 760px) {
    /* Mobilde arama kutusu taşmasın: header sarsın, arama tam genişlikte 2. satıra insin */
    .topbar__row { flex-wrap: wrap; height: auto; row-gap: 10px; padding-top: 10px; padding-bottom: 10px; }
    .brand { order: 1; }
    .menu-toggle { order: 2; margin-left: auto; }
    .topsearch-wrap { order: 3; flex: 1 1 100%; width: 100%; max-width: none; }
    .topsearch { min-width: 0; max-width: none; }
}

/* ---------- Oyuncu profili ---------- */
.pl-photo--xl { width: 60px; height: 60px; }
a.sq-card { color: inherit; transition: border-color .15s, background .15s; }
a.sq-card:hover { border-color: var(--pitch-400); background: rgba(22,163,74,.08); }
a.sq-card:hover .sq-name { color: var(--lime); }

/* Maç kartında hover: takım adları vurgulanır */
.match__link:hover .team__name { color: var(--ink); }

/* Dar ekranda karşılıklı diziliş daha da sıkışsın */
@media (max-width: 560px) {
    .match__link { grid-template-columns: 44px 1fr auto 1fr; gap: 6px; padding: 8px 8px; }
    .team__name { font-size: 12.5px; }
    .match__side { gap: 6px; }
    .team__logo, .team__logo--ph { width: 19px; height: 19px; }
    .match__score { min-width: 52px; }
    .match__score b { font-size: 15.5px; }
}

/* Maç detayında tıklanabilir takımlar */
.match-hero__team { color: inherit; }
a.match-hero__team:hover h3 { color: var(--lime); }
a.match-hero__team.is-static { cursor: default; }
a.h2h-team { color: inherit; }
a.h2h-team:hover .h2h-name { color: var(--lime); }
.nfx__opp { display: inline-flex; align-items: center; gap: 6px; color: inherit; }
.nfx__opp:hover b { color: var(--lime); }

/* Canlı yokken: sıradaki maçlar */
.upc-note { font-size: 12.5px; color: var(--muted); margin: 2px 0 10px; padding: 8px 12px; background: rgba(255,255,255,.03); border: 1px solid var(--line); border-radius: 10px; }
.match__status .ko-date { font-size: 11px; color: var(--muted); font-weight: 700; }
.match__status .ko-time { font-size: 13px; color: var(--ink); font-weight: 800; }

/* Diğer turnuva (Avrupa) canlı maç etiketi */
.match__comp { font-size: 11px; font-weight: 700; color: var(--lime); background: rgba(163,230,53,.08); padding: 4px 12px; border-bottom: 1px solid var(--line); letter-spacing: .02em; }

/* ---------- Sekmeler (tab) ---------- */
.tabs__nav { display: flex; gap: 4px; border-bottom: 1px solid var(--line); margin-bottom: 16px; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.tabs__btn { flex: none; white-space: nowrap; padding: 10px 14px; border: none; background: none; color: var(--muted); font-weight: 700; font-size: 13.5px; font-family: inherit; cursor: pointer; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.tabs__btn:hover { color: var(--ink); }
.tabs__btn.active { color: var(--lime); border-bottom-color: var(--lime); }
.tabs__panel { display: none; }
.tabs__panel.active { display: block; animation: tabin .18s ease; }
@keyframes tabin { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

/* Sekme butonlarında ikon hizası */
.tabs__btn { display: inline-flex; align-items: center; gap: 6px; }
.ic { flex: none; }

/* Son dizilişler — maçlar arası geçiş */
.lu-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.lu-chip { padding: 5px 10px; border-radius: 999px; border: 1px solid var(--line); background: rgba(255,255,255,.04); color: var(--muted); font-size: 12px; font-weight: 700; font-family: inherit; cursor: pointer; white-space: nowrap; }
.lu-chip:hover { color: var(--ink); }
.lu-chip.active { background: var(--pitch-400); color: #04140b; border-color: transparent; }
.lu-chip b { font-variant-numeric: tabular-nums; }
.lu-view { display: none; }
.lu-view.active { display: block; }
.lu-meta { font-size: 12.5px; color: var(--muted); margin: 10px 0 12px; }
.lu-meta b { color: var(--ink); }

/* Son dizilişler — yan yana 2 maç */
.lu-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.lu-cell { min-width: 0; }
.lu-meta small { display: block; color: var(--muted); font-size: 11.5px; margin-top: 2px; }
.lu-meta .lu-score { font-weight: 800; color: var(--lime); font-variant-numeric: tabular-nums; margin-left: 4px; }
/* Saha oyuncuları tıklanabilir */
.pl { color: inherit; }
.pl[href] { cursor: pointer; }
.pl[href]:hover .pl__name { color: var(--lime); }
.pl[href]:hover .pl__dot { box-shadow: 0 0 0 2px var(--lime); }
@media (max-width: 700px) { .lu-grid { grid-template-columns: 1fr; } }

/* İkonlu menü ve chip hizası */
.nav a { display: inline-flex; align-items: center; gap: 6px; }
.chip { display: inline-flex; align-items: center; gap: 6px; }
.chip .ic { flex: none; }

/* ---------- Boş durum CTA (promo) ---------- */
.promo { text-align: center; padding: 40px 24px; background:
    radial-gradient(700px 220px at 50% -20%, rgba(34,197,94,.18), transparent 70%), var(--card);
    border: 1px solid var(--line); border-radius: var(--radius); }
.promo__ball { font-size: 40px; line-height: 1; animation: promoBounce 1.8s ease-in-out infinite; }
@keyframes promoBounce { 0%,100%{ transform: translateY(0) } 50%{ transform: translateY(-8px) } }
.promo__title { margin: 12px 0 6px; font-size: 20px; letter-spacing: -.01em; }
.promo__text { margin: 0 auto; max-width: 440px; color: var(--muted); font-size: 14px; }
.promo__btn { display: inline-flex; align-items: center; gap: 8px; margin-top: 18px; padding: 11px 22px; border-radius: 999px;
    background: var(--pitch-400); color: #04140b; font-weight: 800; font-size: 14.5px; }
.promo__btn:hover { background: var(--lime); }
.promo__note { margin-top: 10px; font-size: 12px; color: var(--muted); }

/* ---------- Kayıt (erken erişim) sayfası ---------- */
.kayit { max-width: 560px; margin: 8px auto 0; text-align: center; background:
    radial-gradient(760px 260px at 50% -10%, rgba(34,197,94,.20), transparent 70%), var(--card);
    border: 1px solid var(--line); border-radius: var(--radius); padding: 40px 28px; }
.kayit__ball { font-size: 46px; animation: promoBounce 1.8s ease-in-out infinite; }
.kayit__title { margin: 14px 0 8px; font-size: clamp(22px, 3vw, 30px); letter-spacing: -.02em; }
.kayit__lead { margin: 0 auto; max-width: 460px; color: var(--muted); font-size: 15px; }
.kayit__benefits { list-style: none; margin: 22px auto; padding: 0; max-width: 380px; display: grid; gap: 10px; text-align: left; }
.kayit__benefits li { display: flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 600; }
.kayit__benefits .ic { color: var(--lime); flex: none; }
.kayit__form { display: flex; gap: 8px; max-width: 420px; margin: 6px auto 0; }
.kayit__form input { flex: 1; min-width: 0; padding: 13px 16px; border-radius: 12px; background: rgba(255,255,255,.06);
    border: 1px solid var(--line); color: var(--ink); font-size: 15px; font-family: inherit; outline: none; }
.kayit__form input:focus { border-color: var(--pitch-400); }
.kayit__form button { display: inline-flex; align-items: center; gap: 6px; padding: 0 20px; border: none; border-radius: 12px;
    background: var(--pitch-400); color: #04140b; font-weight: 800; font-size: 14.5px; cursor: pointer; }
.kayit__form button:hover { background: var(--lime); }
.kayit__ok { max-width: 420px; margin: 6px auto 0; display: flex; align-items: center; justify-content: center; gap: 8px;
    padding: 14px 16px; border-radius: 12px; background: rgba(34,197,94,.14); border: 1px solid rgba(34,197,94,.35);
    color: var(--pitch-400); font-weight: 700; }
.kayit__err { margin: 8px auto 0; color: #fca5a5; font-size: 13px; }
.kayit__fine { margin: 18px auto 0; max-width: 440px; font-size: 12px; color: var(--muted); }

/* ========== Reklam Ver / Sponsorluk sayfası ========== */
.rv-hero { margin: 6px 0 8px; padding: 40px 28px; text-align: center; border-radius: var(--radius);
    background: radial-gradient(900px 320px at 50% -20%, rgba(34,197,94,.22), transparent 70%), var(--card); border: 1px solid var(--line); }
.rv-hero__in { max-width: 720px; margin: 0 auto; }
.rv-badge { display: inline-block; font-size: 12px; font-weight: 800; color: var(--lime); background: rgba(163,230,53,.1); border: 1px solid var(--line); padding: 5px 12px; border-radius: 999px; }
.rv-hero h1 { margin: 14px 0 10px; font-size: clamp(26px, 4.4vw, 40px); letter-spacing: -.03em; line-height: 1.1; }
.rv-hero h1 span { color: var(--lime); }
.rv-hero p { margin: 0 auto; max-width: 600px; color: var(--muted); font-size: 15.5px; }
.rv-cta { display: flex; gap: 10px; justify-content: center; margin: 22px 0 8px; flex-wrap: wrap; }
.rv-btn { display: inline-flex; align-items: center; gap: 8px; padding: 12px 22px; border-radius: 999px; font-weight: 800; font-size: 14.5px; }
.rv-btn--primary { background: var(--pitch-400); color: #04140b; }
.rv-btn--primary:hover { background: var(--lime); }
.rv-btn--ghost { border: 1px solid var(--line); color: var(--ink); }
.rv-btn--ghost:hover { border-color: var(--pitch-400); }
.rv-metrics { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: 24px; }
.rv-metric { background: rgba(255,255,255,.04); border: 1px solid var(--line); border-radius: 12px; padding: 12px 8px; }
.rv-metric b { display: block; font-size: 20px; font-weight: 800; color: var(--lime); }
.rv-metric span { font-size: 11.5px; color: var(--muted); }
.rv-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.rv-card { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 18px; }
.rv-ic { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; background: rgba(163,230,53,.1); color: var(--lime); margin-bottom: 12px; }
.rv-card h3 { margin: 0 0 6px; font-size: 15.5px; }
.rv-card p { margin: 0; color: var(--muted); font-size: 13.5px; line-height: 1.5; }
.rv-bar { display: grid; grid-template-columns: 180px 1fr auto; align-items: center; gap: 12px; padding: 8px 0; }
.rv-bar__label { font-weight: 700; font-size: 13.5px; }
.rv-bar__track { height: 10px; border-radius: 999px; background: rgba(255,255,255,.07); overflow: hidden; }
.rv-bar__fill { height: 100%; background: linear-gradient(90deg, var(--pitch-500), var(--lime)); }
.rv-bar__val { font-size: 12.5px; color: var(--muted); white-space: nowrap; font-variant-numeric: tabular-nums; }
.rv-inv { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.rv-slot { display: flex; gap: 14px; align-items: center; background: var(--card); border: 1px solid var(--line); border-radius: 14px; padding: 16px; }
.rv-slot__ic { width: 44px; height: 44px; flex: none; border-radius: 12px; display: grid; place-items: center; background: rgba(163,230,53,.1); color: var(--lime); }
.rv-slot__body h3 { margin: 0 0 3px; font-size: 15px; }
.rv-slot__body h3 small { font-weight: 700; color: var(--muted); font-size: 12px; margin-left: 4px; }
.rv-slot__body p { margin: 0; color: var(--muted); font-size: 13px; }
.rv-target { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; margin: 26px 0 8px; padding: 26px;
    border-radius: var(--radius); border: 1px solid var(--line);
    background: radial-gradient(600px 200px at 15% 0%, rgba(34,197,94,.16), transparent 70%), var(--card); }
.rv-target h2 { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; }
.rv-target p { margin: 0 0 6px; color: var(--muted); max-width: 640px; font-size: 14.5px; }
.rv-target__note { font-size: 13px; color: var(--muted); opacity: .85; }
.rv-contact { text-align: center; margin: 30px 0 8px; padding: 34px 20px; border-radius: var(--radius);
    background: radial-gradient(700px 240px at 50% 120%, rgba(34,197,94,.16), transparent 70%), var(--card); border: 1px solid var(--line); }
.rv-contact h2 { margin: 0 0 6px; }
.rv-contact p { margin: 0 auto 16px; max-width: 460px; color: var(--muted); }
.rv-contact__mail { margin-top: 12px; font-size: 13px; color: var(--muted); }
@media (max-width: 820px) { .rv-grid { grid-template-columns: 1fr 1fr; } .rv-metrics { grid-template-columns: 1fr 1fr; } .rv-inv { grid-template-columns: 1fr; } .rv-bar { grid-template-columns: 120px 1fr; } .rv-bar__val { display: none; } }
@media (max-width: 520px) { .rv-grid { grid-template-columns: 1fr; } }

/* ---- Kampanya reklam görselleri (AdService) ---- */
.ad__img{position:relative;display:block;line-height:0;border-radius:10px;overflow:hidden}
.ad__img img{max-width:100%;height:auto;display:block;margin:0 auto;border-radius:10px}
.ad__tag{position:absolute;top:6px;right:6px;background:rgba(4,20,11,.72);color:#cbe8d4;font-size:10px;line-height:1;padding:3px 6px;border-radius:5px;letter-spacing:.02em;pointer-events:none}

/* ---- Kurumsal / yasal sayfalar ---- */
.legal{max-width:780px;line-height:1.75;color:var(--ink,#e9fff3);font-size:15px}
.legal p{margin:0 0 15px}
.legal h2{font-size:18px;margin:28px 0 10px}
.legal a{color:#a3e635;text-decoration:none}
.legal a:hover{text-decoration:underline}
.legal__upd{color:#94b8a5;font-size:13px}
.legal b{color:#fff}
.contact-cards{display:flex;gap:14px;flex-wrap:wrap;margin:6px 0 8px}
.contact-card{flex:1;min-width:220px;background:rgba(255,255,255,.03);border:1px solid rgba(163,230,53,.14);border-radius:12px;padding:16px 18px}
.contact-card__lbl{color:#94b8a5;font-size:12.5px;font-weight:600;margin-bottom:6px}
.contact-card__val{font-size:16px;font-weight:700;color:#a3e635!important}

/* ---- Çerez onay bandı ---- */
.cookie-bar{position:fixed;left:0;right:0;bottom:0;z-index:200;background:rgba(8,20,14,.97);border-top:1px solid rgba(163,230,53,.22);backdrop-filter:blur(8px);box-shadow:0 -8px 30px rgba(0,0,0,.4)}
.cookie-bar__in{max-width:1120px;margin:0 auto;padding:14px 20px;display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.cookie-bar__txt{margin:0;font-size:13.5px;color:#cfe9d8;line-height:1.55;flex:1;min-width:240px}
.cookie-bar__txt a{color:#a3e635;text-decoration:none}
.cookie-bar__btns{display:flex;gap:9px;flex-shrink:0}
.cookie-bar__btn{border:1px solid rgba(255,255,255,.18);background:transparent;color:#cfe9d8;padding:10px 18px;border-radius:9px;font-weight:700;font-size:13.5px;cursor:pointer;font-family:inherit}
.cookie-bar__btn--ok{background:#16a34a;border-color:#16a34a;color:#04140b}
.cookie-bar__btn--ok:hover{background:#a3e635;border-color:#a3e635}
.cookie-bar__btn--ghost:hover{border-color:#a3e635;color:#fff}

/* ---- Footer link kolonları ---- */
.footer-links{display:flex;gap:40px;flex-wrap:wrap}
.footer-links__col{display:flex;flex-direction:column;gap:7px}
.footer-links__h{color:#e9fff3;font-weight:700;font-size:13.5px;margin-bottom:3px}
.footer-links__col a{color:#94b8a5;font-size:13.5px;text-decoration:none}
.footer-links__col a:hover{color:#a3e635}
@media(max-width:560px){.footer-links{gap:24px}.cookie-bar__in{padding:12px 16px}}

/* ---- Günün maçları / bülten ---- */
.bl-datebar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:4px 0 10px}
.bl-nav{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border:1px solid rgba(255,255,255,.12);border-radius:10px;color:#cfe9d8;background:rgba(255,255,255,.03)}
.bl-nav:hover{border-color:#a3e635;color:#a3e635}
.bl-daytabs{display:flex;gap:4px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:11px;padding:4px}
.bl-day{padding:8px 16px;border-radius:8px;font-weight:700;font-size:13.5px;color:#94b8a5}
.bl-day:hover{color:#e9fff3}
.bl-day.on{background:#16a34a;color:#04140b}
.bl-datepick{display:flex;align-items:center;gap:8px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.03);border-radius:10px;padding:0 12px;color:#94b8a5;margin-left:auto}
.bl-datepick input{border:none;background:none;color:#e9fff3;font-family:inherit;font-size:13.5px;padding:9px 0;color-scheme:dark;outline:none}
.bl-current{color:#94b8a5;font-size:13.5px;font-weight:600;text-transform:capitalize;margin:2px 0 16px}
.bl-group{margin-bottom:20px}
.bl-group__head{display:flex;align-items:center;gap:9px;margin-bottom:10px;padding-bottom:8px;border-bottom:1px solid rgba(255,255,255,.08)}
.bl-group__flag{font-size:17px}
.bl-group__head a{font-weight:800;font-size:15px;color:#e9fff3}
.bl-group__head a:hover{color:#a3e635}
.bl-group__cnt{margin-left:auto;color:#94b8a5;font-size:12.5px;font-weight:600}
@media(max-width:560px){.bl-datepick{margin-left:0;order:5;width:100%}.bl-datepick input{flex:1}}

/* ---- Üyelik: giriş/kayıt formları ---- */
.auth-wrap{display:flex;justify-content:center;padding:10px 0 30px}
.auth-card{width:100%;max-width:420px;background:rgba(255,255,255,.03);border:1px solid rgba(163,230,53,.16);border-radius:16px;padding:28px 26px}
.auth-card__title{margin:0 0 4px;font-size:24px}
.auth-card__sub{margin:0 0 20px;color:#94b8a5;font-size:14px}
.auth-form label{display:block;font-weight:600;font-size:13px;margin:14px 0 6px;color:#e9fff3}
.auth-form input[type=text],.auth-form input[type=email],.auth-form input[type=password]{width:100%;padding:12px 14px;border-radius:10px;border:1px solid rgba(255,255,255,.14);background:#0a1712;color:#e9fff3;font-size:14px;font-family:inherit}
.auth-form input:focus{outline:none;border-color:#a3e635}
.auth-remember{display:flex!important;align-items:center;gap:8px;font-weight:600;font-size:13.5px;color:#cfe9d8;margin-top:14px}
.auth-remember input{width:auto}
.auth-btn{width:100%;margin-top:20px;background:#16a34a;color:#04140b;border:none;padding:13px;border-radius:10px;font-weight:800;font-size:15px;cursor:pointer;font-family:inherit}
.auth-btn:hover{background:#a3e635}
.auth-alt{margin-top:18px;text-align:center;color:#94b8a5;font-size:13.5px}
.auth-alt a{color:#a3e635;font-weight:700}
.auth-err{background:rgba(239,68,68,.12);border:1px solid rgba(239,68,68,.4);color:#fca5a5;padding:10px 13px;border-radius:10px;margin-bottom:14px;font-size:13.5px;display:flex;gap:8px;align-items:center}
.auth-ok{background:rgba(22,163,74,.15);border:1px solid rgba(34,197,94,.4);color:#bbf7d0;padding:10px 13px;border-radius:10px;font-size:13.5px;display:flex;gap:8px;align-items:center}

/* ---- Bildirim tercihleri (ayarlar + abonelik) ---- */
.pref-opt{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:15px 2px;border-top:1px solid var(--line);cursor:pointer}
.pref-opt:first-child{border-top:none}
.pref-opt b{display:block;font-size:15px;margin-bottom:3px}
.pref-opt small{color:var(--muted);font-size:12.5px;line-height:1.5}
.pref-sw{position:relative;flex:none;width:46px;height:26px}
.pref-sw input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}
.pref-sw i{position:absolute;inset:0;background:rgba(255,255,255,.12);border-radius:999px;transition:background .2s}
.pref-sw i::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:transform .2s}
.pref-sw input:checked+i{background:var(--green)}
.pref-sw input:checked+i::after{transform:translateX(20px)}

/* ---- Favori butonu (takım profili) ---- */
.fav-form{margin:10px 0 0}
.fav-btn{display:inline-flex;align-items:center;gap:7px;border:1px solid rgba(163,230,53,.4);background:rgba(163,230,53,.1);color:#a3e635;padding:8px 15px;border-radius:999px;font-weight:700;font-size:13px;cursor:pointer;font-family:inherit;text-decoration:none}
.fav-btn:hover{background:rgba(163,230,53,.18)}
.fav-btn.is-on{background:#16a34a;border-color:#16a34a;color:#04140b}
.fav-btn--ghost{border-color:rgba(255,255,255,.16);background:transparent;color:#cfe9d8}
.fav-btn--ghost:hover{border-color:#a3e635;color:#a3e635}

/* ---- Takımlarım ---- */
.tm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.tm-card{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:16px}
.tm-card__head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-bottom:12px;margin-bottom:12px;border-bottom:1px solid rgba(255,255,255,.08)}
.tm-card__head a{display:flex;align-items:center;gap:10px;color:#e9fff3;font-size:16px}
.tm-card__head img{width:30px;height:30px;object-fit:contain}
.tm-card__head a:hover b{color:#a3e635}
.tm-remove{background:none;border:1px solid rgba(255,255,255,.12);color:#94b8a5;width:30px;height:30px;border-radius:8px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.tm-remove:hover{color:#fca5a5;border-color:#ef4444}
.tm-slot{display:flex;align-items:center;gap:10px;padding:7px 0}
.tm-slot__lbl{color:#94b8a5;font-size:11.5px;font-weight:700;width:64px;flex:none;text-transform:uppercase;letter-spacing:.02em}
.tm-match{display:flex;align-items:center;gap:10px;flex:1;justify-content:space-between;color:#e9fff3;font-size:13.5px}
.tm-match:hover{color:#a3e635}
.tm-match__t i{opacity:.4;font-style:normal}
.tm-match__w{color:#94b8a5;font-size:12.5px;white-space:nowrap}
.tm-match__s{font-weight:800;white-space:nowrap}
.tm-match__s.is-live{color:#ef4444}
.tm-empty{color:#94b8a5;font-size:13px;flex:1}

/* ---- Nav üye linkleri ---- */
.nav__logout{margin:0}
.nav__logout button{background:none;border:none;color:inherit;font:inherit;cursor:pointer;display:inline-flex;align-items:center;gap:6px;padding:0}

/* ===== Header: tam genişlik + tek satır menü (override) ===== */
/* Geniş ekran: tam genişlik, tek satır, ayrık üye butonu */
@media (min-width: 1200px) {
    .topbar__row { max-width: 1340px; margin: 0 auto; padding: 0 24px; gap: 12px; }
    /* Arama içeriğini sarar, nav'a bitişik durur; artan boşluk marka tarafında.
       Dar ekranda küçülebilsin diye shrink açık. */
    .topsearch-wrap { margin-left: auto; flex: 0 1 210px; width: 210px; min-width: 150px; max-width: 210px; }
    .nav { display: flex; flex-wrap: nowrap; gap: 3px; margin-left: 0; align-items: center; position: static; background: none; padding: 0; border: none; }
    .nav a { padding: 8px 13px; font-size: 13.5px; white-space: nowrap; }
    .nav__member { margin-left: 10px; border: 1px solid rgba(163,230,53,.45); color: var(--lime); }
    .nav__member:hover, .nav__member.active { background: var(--pitch-400); color: var(--pitch-900); border-color: var(--pitch-400); }
    .nav__logout { margin-left: 2px; }
    .nav__logout button { white-space: nowrap; padding: 8px 10px; border-radius: 999px; }
    .nav__logout button:hover { background: rgba(239,68,68,.14); color: #fca5a5; }
    .menu-toggle { display: none; }
}
/* Orta/dar ekran: nav'ı hamburger menüye al (taşmayı önle) */
@media (max-width: 1199px) {
    .menu-toggle { display: inline-block; margin-left: auto; }
    .nav { display: none; position: absolute; top: 62px; left: 0; right: 0; flex-direction: column; background: var(--card-solid); padding: 10px; border-bottom: 1px solid var(--line); margin-left: 0; gap: 4px; z-index: 45; }
    .nav.open { display: flex; }
    .nav__member { margin-left: 0; }
}

/* Dolu reklam alanı: yer tutucu görünümünü (kesikli çerçeve/desen) kaldır */
.ad--filled { border: none; background: none; letter-spacing: normal; text-transform: none; min-height: 0; }

/* ---- Kayan maç şeridi (ticker) ---- */
.ticker{display:flex;align-items:stretch;margin:14px 0;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--card,#0f1d17)}
.ticker__tag{flex:none;display:flex;align-items:center;gap:7px;padding:0 15px;font-weight:800;font-size:12px;letter-spacing:.06em;background:rgba(163,230,53,.14);color:var(--lime,#a3e635)}
.ticker--live .ticker__tag{background:#ef4444;color:#fff}
.ticker__dot{width:8px;height:8px;border-radius:50%;background:#fff;animation:tkpulse 1s infinite;flex:none}
.ticker__viewport{flex:1;min-width:0;overflow:hidden;position:relative;-webkit-mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent);mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent)}
.ticker__track{display:flex;width:max-content;animation:tkscroll 45s linear infinite}
.ticker:hover .ticker__track{animation-play-state:paused}
.ticker__row{display:flex;align-items:center}
.tk{display:inline-flex;align-items:center;gap:9px;padding:11px 18px;white-space:nowrap;border-right:1px solid var(--line);color:var(--ink,#e9fff3);font-size:13.5px;text-decoration:none}
.tk:hover{background:rgba(163,230,53,.06)}
.tk__t{display:inline-flex;align-items:center;gap:6px;font-weight:600}
.tk__t img{width:18px;height:18px;object-fit:contain}
.tk__live{width:8px;height:8px;border-radius:50%;background:#ef4444;animation:tkpulse 1s infinite;flex:none}
.tk__sc{font-weight:800;color:#fff;font-size:14px}
.tk__sc i{opacity:.5;font-style:normal;margin:0 2px}
.tk__vs{color:var(--muted,#94b8a5);font-size:12.5px;font-weight:700}
.tk__min{color:#ef4444;font-weight:800;font-size:12px}
@keyframes tkscroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes tkpulse{0%,100%{opacity:1}50%{opacity:.25}}
@media(prefers-reduced-motion:reduce){.ticker__track{animation:none}}

/* Diğer canlı maçlar: takip listende olmayan lig başlığı (link değil) */
.bl-group__head b{font-weight:800;font-size:15px;color:#e9fff3}

/* reCAPTCHA v3: rozeti gizle (bilgilendirme metni formda gösteriliyor) */
.grecaptcha-badge { visibility: hidden !important; }
.auth-rc { color: var(--muted, #94b8a5); font-size: 11px; line-height: 1.55; text-align: center; margin-top: 14px; }
.auth-rc a { color: var(--lime, #a3e635); text-decoration: none; }

/* ==========================================================================
   Mobil uygulama (Capacitor) — güvenli alan / edge-to-edge desteği
   --------------------------------------------------------------------------
   Android 15+ (targetSdk 35+) uygulamayı zorunlu olarak "edge-to-edge" çizer:
   web içeriği durum çubuğunun ve jest/gezinme çubuğunun ALTINA taşar. Aynı
   durum çentikli iPhone'larda da geçerlidir.

   Çözüm iki kaynaktan beslenir:
     1) --safe-area-inset-*  → Capacitor 8 "System Bars" çekirdek eklentisi
                               tarafından yalnızca uygulama içinde enjekte edilir.
     2) env(safe-area-inset-*) → iOS/WebKit yerleşik değeri. Yalnızca sayfada
                               viewport-fit=cover varsa 0'dan farklı olur;
                               bunu da uygulama içinde native-bridge.js ayarlar.

   Bu yüzden normal tarayıcıda her iki kaynak da yok/0'dır → site görünümü
   HİÇ DEĞİŞMEZ. Kurallar sadece uygulama içinde devreye girer.
   ========================================================================== */
:root {
    --sa-top:    var(--safe-area-inset-top,    env(safe-area-inset-top,    0px));
    --sa-right:  var(--safe-area-inset-right,  env(safe-area-inset-right,  0px));
    --sa-bottom: var(--safe-area-inset-bottom, env(safe-area-inset-bottom, 0px));
    --sa-left:   var(--safe-area-inset-left,   env(safe-area-inset-left,   0px));
}

/* Yapışkan üst bar durum çubuğunun altında kalmasın */
.topbar { padding-top: var(--sa-top); }

/* Yatay çentik / kavisli ekran kenarları (manzara modu) */
.wrap {
    padding-left:  calc(18px + var(--sa-left));
    padding-right: calc(18px + var(--sa-right));
}

/* Alt gezinme çubuğunun üstünü kapatmasın */
.ad--sticky   { padding-bottom: var(--sa-bottom); }
.cookie-bar__in { padding-bottom: calc(14px + var(--sa-bottom)); }
.footer       { padding-bottom: calc(26px + var(--sa-bottom)); }

/* ==========================================================================
   Kaydırma çubukları (scrollbar)
   --------------------------------------------------------------------------
   macOS/Safari kaydırma çubuklarını üstte yüzen ince bir çubuk olarak çizer ve
   kullanılmadığında gizler; bu yüzden orada sorun görünmüyordu. Windows'ta
   Chrome ve Edge ise klasik kalın, oklu, açık gri çubuğu çiziyor — koyu saha
   temasının içinde yama gibi duruyor ve puan durumu / lig listesi gibi küçük
   kutuların iç genişliğini yiyor.

   Aşağıdaki kurallar her iki motorda da ince, temasıyla uyumlu bir çubuk verir.
   ========================================================================== */

/* Firefox + modern standart */
* {
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,.16) transparent;
}

/* Chrome / Edge / Safari */
*::-webkit-scrollbar { width: 9px; height: 9px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,.14);
    border-radius: 99px;
    border: 2px solid transparent;
    background-clip: content-box;
}
*::-webkit-scrollbar-thumb:hover { background: rgba(163,230,53,.45); background-clip: content-box; }
/* Köşedeki boş kare ve ok düğmeleri kalkar */
*::-webkit-scrollbar-corner { background: transparent; }
*::-webkit-scrollbar-button { display: none; height: 0; width: 0; }

/* Yatay kaydırılan şeritlerde (sekmeler, geniş tablolar) çubuğu tamamen gizle:
   zaten parmakla/trackpad ile kaydırılıyor, görünür çubuk sadece gürültü.
   Kaydırma işlevi aynen korunur. */
.tabs__nav { scrollbar-width: none; -ms-overflow-style: none; }
.tabs__nav::-webkit-scrollbar { height: 0; display: none; }

/* Dikey kaydırılan küçük kutular: çubuk içerik genişliğini yemesin diye üste bindir */
.mini, .lgdrop__menu { overscroll-behavior: contain; }

/* ==========================================================================
   Dar ekran düzeltmeleri
   ========================================================================== */

/* --- 1) .team kuralı geri geldi -----------------------------------------
   Şablonlar <a class="team"> / <span class="team"> kullanıyor ama app.css'te
   .team kuralı yoktu; öğe satır içi (inline) kaldığı için .team__name'deki
   overflow/ellipsis hiç çalışmıyordu. Uzun kulüp adları tabloyu şişirip
   .table-card'ın overflow:hidden'ı tarafından kaydırmasız kesiliyordu
   (ör. Bundesliga puan durumunda "P" sütunu yarıya kadar kırpılıyor).
   Şablonlardaki satır içi justify-content/gap stilleri de bu kuralın bir
   zamanlar flex olduğunu gösteriyor. */
.team { display: flex; align-items: center; gap: 8px; min-width: 0; }
.team .team__name { min-width: 0; }
@media (max-width: 560px) { .team .team__name { max-width: 140px; } }
@media (max-width: 400px) { .team .team__name { max-width: 108px; } }

/* --- 2) Diziliş sahası: oyuncu kutuları --------------------------------
   640px altında .pl 66px'ten 88px'e BÜYÜYORDU. 5 kişilik orta saha
   5×88=440px eder, saha ise ~314px → taşan kanat oyuncuları
   .pitch'in overflow:hidden'ı ile sessizce siliniyordu. */
@media (max-width: 640px) {
    .pl { width: min(88px, 19%); }
    .pl__name { max-width: 100%; }
}

/* --- 3) Mobil menü konumu ---------------------------------------------
   1199px media query'sindeki sabit top:62px, 900px'teki doğru top:100%
   değerini eziyordu. Üst bar dar ekranda satır sarıp ~102px olunca menü
   arama kutusunun üstüne biniyordu. */
@media (max-width: 1199px) { .nav { top: 100%; } }

/* --- 4) Puan durumu başlığı: yapışkanlık KALDIRILDI --------------------
   Geçmiş: th'de `position: sticky; top: 0` vardı ve başlık üst barın arkasında
   kalıyordu. 1.10.36'da top ofseti + z-index verdim; bu sefer başlık satırı
   içeriğin ÜZERİNE binip ilk sırayı okunmaz hale getirdi — ilk halinden kötü.

   Doğru çözüm sticky'yi tamamen kaldırmak: tablo zaten sayfayla birlikte
   kayıyor, kendi kaydırma kabı yok. Bu düzende yapışkan başlık ancak
   tablonun kendi kabı olsaydı anlamlı olurdu; o ayrı bir tasarım işi. */
table.standings th { position: static; top: auto; }

/* --- 5) Çerez bandı yapışkan reklamı örtüyordu -------------------------
   Bandı gizlemek yerine reklamı yukarı itiyoruz: gösterim sunucu tarafında
   zaten sayılıyor, görünmeyen bir reklam için gösterim saymak reklamvereni
   yanıltır. Bant kapanınca kural kendiliğinden düşer. */
body:has(.cookie-bar:not([hidden])) .ad--sticky { margin-bottom: 76px; }
@media (max-width: 560px) {
    body:has(.cookie-bar:not([hidden])) .ad--sticky { margin-bottom: 152px; }
}

/* --- 6) Maç kartı: takım adına daha fazla yer --------------------------
   360px'te ada yalnızca ~48px kalıyordu; "Manchester City" ve
   "Manchester United" ikisi de "Manch…" olarak görünüyordu. */
@media (max-width: 430px) {
    .match__link { grid-template-columns: 36px 1fr auto 1fr; gap: 5px; padding: 8px 6px; }
    .match__toggle { width: 34px; }
    .match__score { min-width: 44px; }
    .match__side { gap: 5px; }
    .team__logo, .team__logo--ph { width: 17px; height: 17px; }
}

/* --- 7) Dokunma hedefleri (44px eşiği) --------------------------------- */
@media (max-width: 760px) {
    .tm-remove { width: 44px; height: 44px; }
    .bl-nav { width: 44px; height: 44px; }
    .menu-toggle { padding: 12px 13px; }
}

/* --- 8) Yasal metin okunabilirliği ------------------------------------
   11.5px + opacity:.8, zaten soluk --muted rengin üstüne biniyordu. */
.footer .legal { font-size: 12.5px; opacity: 1; }

/* --- 9) Çok dar ekranlarda maç kartı (≤360px) --------------------------
   430px kuralı (bkz. 6) logoyu ve boşlukları küçültüyor ama isim yine tek
   satıra sıkışıyordu: "Manchester City" ve "Manchester United" bu genişlikte
   hâlâ ayırt edilemiyordu.

   Kartı alt alta yığmak yerine ismi İKİ SATIRA açıyoruz. Yığmak, listedeki
   maç yüksekliğini iki katına çıkarıp ekrana sığan maç sayısını yarıya
   indiriyordu — canlı skor listesinde en değerli şey aynı anda görülebilen
   maç sayısı. İki satır, yüksekliği ~14px artırıp ismi tam gösteriyor.

   Devre arası skoru bu genişlikte gizleniyor: maç sonucunun yanında ikincil
   bir bilgi ve yer darlığında ismin önüne geçmemeli. */
@media (max-width: 360px) {
    .match__link { padding: 9px 5px; gap: 4px; }

    .team .team__name,
    .team__name {
        max-width: none;
        white-space: normal;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        font-size: 12.5px;
        line-height: 1.22;
    }

    .match__ht { display: none; }
    .match__score { min-width: 40px; }
    .match__score b { font-size: 16px; }
}

/* ==========================================================================
   Lig sayfası ve lig kimliği — 1.11.22
   ==========================================================================
   Renkler ölçülerek seçildi, göz kararı değil. Sonuç dağılımı çubuğunun üç
   rengi (#16a34a / #6b7f72 / #0284c7) koyu zemine karşı renk körlüğü ayrımı,
   parlaklık bandı ve kontrast için doğrulandı. Beraberliğin GRİ olması bir
   estetik seçim değil: iç saha ↔ deplasman iki uç, beraberlik ortadaki nötr
   bölge. Sarı, beraberliği üçüncü bir taraf gibi gösteriyordu.
   ========================================================================== */

/* --- Lig rozeti: logo + ad. Lig adının göründüğü her yerde bu. ------------
   Bayrak emojisi kaldırıldı: Windows'ta 🇹🇷 / 🇪🇸 / 🇮🇹 bayrak olarak
   çizilmiyor, "TR" / "ES" / "IT" harf çifti olarak görünüyordu. Aynı listede
   kimi bayrak, kimi harf, kimi 🏆 çıkınca hiçbir standart kalmıyordu. */
.lgb { display: inline-flex; align-items: center; gap: 11px; min-width: 0; }

/* AÇIK PLAKA — bu sayfanın en önemli ayrıntısı.
   Lig amblemlerinin çoğu koyu renkli çizim (Premier League'in lacivert aslanı
   gibi) ve saydam zeminli. Koyu yeşil arka planın üzerine doğrudan konunca
   görünmüyorlardı; açılır menüde seçili satırın dolu yeşili üzerinde ise hiç
   okunmuyorlardı. Amblemi açık renkli bir plakanın üzerine oturtmak, koyu
   spor arayüzlerinde bu sorunun standart çözümü.

   İç çerçeve (inset ring) şunun için: amblemin kendisi açık renkliyse (bazı
   kupa amblemleri neredeyse beyaz) plaka üzerinde erimesin, en azından
   plakanın sınırı görünsün. Kimliği asıl taşıyan zaten yanındaki lig adı. */
.lgb__logo {
    flex: 0 0 auto; object-fit: contain;
    background: #f2f5f2;
    border-radius: 8px;
    padding: 3px;
    box-shadow: inset 0 0 0 1px rgba(4,20,11,.12);
}
/* Logo yüklenemedi: kırık görsel ikonu göstermek, hiç göstermemekten kötü. */
.lgb__logo.is-off { visibility: hidden; }
/* Yer tutucu da aynı plakada duruyor; yazı rengi bu yüzden KOYU olmak zorunda
   — açık plakada açık yazı okunmazdı. */
.lgb__logo--ph {
    display: grid; place-items: center; font-weight: 800;
    color: #14532d; letter-spacing: -.02em; padding: 0;
}
.lgb__text { min-width: 0; display: block; }
.lgb__name { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lgb__sub { display: block; margin-top: 1px; font-size: 11px; font-weight: 600; color: var(--muted); }

/* --- Lig sayfası başlığı (dört bölümün ortak üst şeridi) --- */
.lghead {
    display: flex; align-items: center; justify-content: space-between;
    flex-wrap: wrap; gap: 12px; margin: 14px 0 12px;
}
.lghead__id { display: flex; align-items: center; gap: 12px; min-width: 0; }
.lghead__id .lgb__logo { width: 46px; height: 46px; border-radius: 11px; padding: 4px; }
.lghead__h1 { margin: 0; font-size: 22px; font-weight: 900; letter-spacing: -.02em; }
.lghead__season {
    flex: 0 0 auto; padding: 4px 10px; border-radius: 999px;
    border: 1px solid var(--line); background: var(--card);
    font-size: 12px; font-weight: 700; color: var(--muted);
    font-variant-numeric: tabular-nums;
}
.lghead__actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

/* Başlıkta lig adı zaten rozetin içinde; rozetin kendi adını gizleyip
   h1'i tek doğru kaynak yapıyoruz (iki kez aynı ad görünmesin). */
.lghead__id .lgb__text { display: none; }

/* Açılır listede grup ayırıcı: dokuz lig düz liste hâlinde aranmıyor. */
.lgdrop__group {
    padding: 9px 14px 4px; font-size: 10.5px; font-weight: 800;
    text-transform: uppercase; letter-spacing: .09em; color: var(--muted);
}
.lgdrop__menu .lgb__logo { width: 28px; height: 28px; }
.lgdrop__cur { display: flex; align-items: center; min-width: 0; }

/* --- Sekme şeridi --- */
.ltabs {
    display: flex; gap: 4px; margin: 0 0 18px; padding-bottom: 2px;
    border-bottom: 1px solid var(--line);
    overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none;
}
.ltabs::-webkit-scrollbar { display: none; }
.ltabs__item {
    flex: 0 0 auto; padding: 10px 16px; border-radius: 10px 10px 0 0;
    font-size: 14px; font-weight: 700; color: var(--muted);
    text-decoration: none; white-space: nowrap;
    border-bottom: 2px solid transparent; margin-bottom: -3px;
}
.ltabs__item:hover { color: var(--ink); background: rgba(163,230,53,.06); }
.ltabs__item.is-active {
    color: var(--lime); border-bottom-color: var(--lime); background: rgba(163,230,53,.08);
}

/* --- Sezon özeti --- */
.lgstat { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 18px 18px 16px; }
.lgstat__row { display: flex; gap: 10px; }
.lgstat__cell { flex: 1; text-align: center; min-width: 0; }
.lgstat__cell b { display: block; font-size: 22px; font-weight: 900; font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
.lgstat__cell b span { font-size: 14px; font-weight: 700; color: var(--muted); }
.lgstat__cell small { display: block; margin-top: 3px; font-size: 11.5px; color: var(--muted); }

/* Sezon ilerlemesi: tek bir oranın bir sınıra karşı durumu — metre, grafik değil. */
.lgprog { margin-top: 16px; height: 7px; border-radius: 999px; background: rgba(255,255,255,.07); overflow: hidden; }
.lgprog i { display: block; height: 100%; background: linear-gradient(90deg, var(--pitch-500), var(--lime)); border-radius: 999px; }

/* --- Sonuç dağılımı: iki uç + nötr orta (doğrulanmış renkler) --- */
.lgout { margin-top: 20px; }
.lgout__bar { display: flex; height: 26px; border-radius: 7px; overflow: hidden; background: rgba(255,255,255,.05); }
.lgout__bar i {
    display: grid; place-items: center; min-width: 0;
    /* <i> tarayıcıda varsayılan olarak eğik: yüzdeler italik çıkıyordu. */
    font-style: normal;
    /* Dilimler arası 2px zemin boşluğu: iki dolgunun sınırı kaybolmasın. */
    box-shadow: 2px 0 0 0 var(--card-solid);
}
.lgout__bar i:last-child { box-shadow: none; }
.lgout__bar i b { font-size: 11.5px; font-weight: 800; font-variant-numeric: tabular-nums; }
.lgout__bar i.h { background: #16a34a; }
.lgout__bar i.h b { color: #04140b; }
.lgout__bar i.d { background: #6b7f72; }
.lgout__bar i.d b { color: #04140b; }
.lgout__bar i.a { background: #0284c7; }
.lgout__bar i.a b { color: #ffffff; }

.lgout__legend { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 11px; font-size: 12px; color: var(--muted); }
.lgout__legend span { display: inline-flex; align-items: center; gap: 6px; }
.lgout__legend i { width: 9px; height: 9px; border-radius: 3px; }
.lgout__legend i.h { background: #16a34a; }
.lgout__legend i.d { background: #6b7f72; }
.lgout__legend i.a { background: #0284c7; }

.lgnote { margin: 10px 0 0; font-size: 11.5px; color: var(--muted); line-height: 1.55; }
.lgdash { color: var(--muted); }

/* --- Haftaya göre gol: tek serilik eğilim grafiği ---
   Tek seri olduğu için gösterge kutusu yok; başlık serinin ne olduğunu
   söylüyor. Izgara ve eksen geride durur, veriyle yarışmaz. */
.lgchart {
    margin-top: 2px; padding: 14px 14px 10px;
    background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
}
/* height:auto + varsayılan preserveAspectRatio: ölçek her iki eksende eşit,
   yani SVG içindeki yazılar ezilmiyor. Sabit yükseklik + non-uniform ölçek
   metni yatayda geriyordu. */
.lgchart__svg { display: block; width: 100%; height: auto; overflow: visible; }
.lgchart__grid { stroke: rgba(255,255,255,.08); stroke-width: 1; }
.lgchart__avg { stroke: var(--muted); stroke-width: 1.5; stroke-dasharray: 5 4; opacity: .7; }
.lgchart__line { fill: none; stroke: #16a34a; stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.lgchart__pt circle { fill: #16a34a; stroke: var(--card-solid); stroke-width: 2; transition: r .12s; }
.lgchart__pt circle.is-key { fill: var(--lime); }
/* Vurulma alanı işaretten büyük: 3px'lik bir noktayı fareyle yakalamak zor. */
.lgchart__pt:hover circle { r: 6; fill: var(--lime); }
.lgchart__tick { fill: var(--muted); font-size: 10px; font-weight: 600; }
.lgchart__val { fill: var(--ink); font-size: 12px; font-weight: 800; }
.lgchart__avglab { fill: var(--muted); font-size: 10px; font-weight: 700; }

/* --- Bölüm başlığındaki "tümünü gör" bağlantısı --- */
.lgmore { margin-left: auto; font-size: 12.5px; font-weight: 700; color: var(--lime); text-decoration: none; white-space: nowrap; }
.lgmore:hover { text-decoration: underline; }
.card__h3row { display: flex; align-items: center; gap: 10px; }

/* --- Maç listesi kabı ---
   .league-block__body üst kenarlıksız (bir başlığın altına oturmak için
   tasarlandı); burada başlık ayrı bir öğe olduğu için dört kenarı da olan
   kendi kabını kullanıyoruz. */
.lgmatches { border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }

/* --- Krallık listesi (sağ kolon) ---
   Fotoğraf 26px'e SABİTLENDİ. Bu boyutlar yazılmadığında görseller sağlayıcının
   kendi çözünürlüğünde çiziliyor ve satırlar sayfayı aşağıya uzatıyor.
   list-style:none şart: yoksa <ol>'un kendi madde işareti bizim sıra
   numaramızla üst üste binip "1. 1" görünüyor. */
.lgtop { list-style: none; margin: 0; padding: 0; }
.lgtop li { display: flex; align-items: center; gap: 9px; padding: 9px 0; border-top: 1px solid rgba(255,255,255,.06); }
.lgtop li:first-child { border-top: none; padding-top: 2px; }
.lgtop__rank {
    flex: 0 0 auto; width: 16px; text-align: center;
    font-size: 12px; font-weight: 800; color: var(--muted); font-variant-numeric: tabular-nums;
}
.lgtop__ph {
    flex: 0 0 auto; width: 26px; height: 26px; border-radius: 999px;
    object-fit: cover; background: rgba(255,255,255,.06);
}
.lgtop__ph--empty { display: inline-block; }
.lgtop__who { flex: 1; min-width: 0; font-size: 13px; font-weight: 700; }
.lgtop__who > a, .lgtop__who { color: var(--ink); text-decoration: none; }
.lgtop__who > a:hover { color: var(--lime); }
.lgtop__who small {
    display: block; margin-top: 1px; font-size: 11px; font-weight: 600; color: var(--muted);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
/* Barlar hepsi aynı renkte: oyuncular ayırt edilmesi gereken seriler değil,
   uzunluk zaten farkı gösteriyor. Değere göre renklendirmek, barın boyunun
   söylediğini ikinci kez söylemek olurdu. */
.lgtop__bar {
    display: block; font-style: normal; height: 3px; margin-top: 5px; border-radius: 999px;
    background: #16a34a; min-width: 6px;
}
.lgtop__val {
    flex: 0 0 auto; font-size: 15px; font-weight: 900; color: var(--lime);
    font-variant-numeric: tabular-nums;
}

/* --- Form rozetleri: durum renkleri (kazandı / berabere / kaybetti) ---
   Bunlar "seri" değil DURUM. Ayrılmış durum renklerini kullanıyorlar ve her
   rozetin üzerinde harfi yazılı — renk tek başına anlam taşımıyor. */
.form i.W { background: #0ca30c; color: #04140b; }
.form i.D { background: #6b7f72; color: #04140b; }
.form i.L { background: #d03b3b; color: #ffffff; }

/* --- Hafta gezinmesi --- */
.wknav { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; }
.wknav__cur { flex: 1; margin: 0; text-align: center; font-size: 17px; font-weight: 800; }
.wknav__arrow {
    display: grid; place-items: center; width: 38px; height: 38px; flex: 0 0 auto;
    border: 1px solid var(--line); border-radius: 10px; background: var(--card);
    color: var(--ink); font-size: 20px; line-height: 1; text-decoration: none;
}
.wknav__arrow:hover { background: rgba(22,163,74,.14); color: var(--lime); }
.wknav__arrow.is-off { color: rgba(255,255,255,.16); background: transparent; }

.wkstrip {
    display: flex; gap: 6px; margin-bottom: 14px; padding-bottom: 4px;
    overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none;
}
.wkstrip::-webkit-scrollbar { display: none; }
.wkstrip__i {
    flex: 0 0 auto; min-width: 34px; padding: 7px 10px; border-radius: 9px;
    border: 1px solid var(--line); background: var(--card);
    font-size: 12.5px; font-weight: 700; color: var(--muted);
    text-align: center; text-decoration: none; font-variant-numeric: tabular-nums;
}
.wkstrip__i:hover { color: var(--ink); border-color: rgba(163,230,53,.3); }
.wkstrip__i.is-active { background: var(--lime); border-color: var(--lime); color: var(--pitch-900); }

@media (max-width: 640px) {
    .lghead { margin: 10px 0 10px; }
    .lghead__h1 { font-size: 18px; }
    .lghead__id .lgb__logo { width: 38px; height: 38px; border-radius: 9px; }
    .lghead__actions { width: 100%; }
    .lghead__actions .lgdrop { flex: 1 1 auto; }
    .lgdrop__btn { min-width: 0; width: 100%; }
    .lgstat { padding: 15px 14px 14px; }
    .lgstat__cell b { font-size: 19px; }
    .lgstat__cell small { font-size: 10.5px; }
    .ltabs__item { padding: 10px 12px; font-size: 13px; }
    /* Dar ekranda etiketler küçülsün — gizlemek yerine. nth-of-type ile
       "her ikinci etiket" denemesi yanlış olurdu: o seçici tüm <text>
       kardeşleri sayar, yalnızca eksen etiketlerini değil. */
    .lgchart__tick { font-size: 12px; }
    .lgchart__val { font-size: 14px; }
}