/* ── GECE MAÇI ortak tasarim dili — maclar/mac/oyuncu sayfalari bunu +
   kendi sayfa css'ini yukler (landing: css/landing.css, kendi token
   kopyasiyla — ileride buraya birlestirilebilir).
   NOT: buyuk harf CSS'e birakilmaz (text-transform 'i'yi 'I' yapar) —
   VERSAL metinler HTML'de/JS'te elle yazilir. ── */
:root {
  color-scheme: dark;
  --zemin:  #0b120e;
  --kart:   #131c16;
  --yuzey2: #1a2620;
  --cizgi:  rgba(242,246,241,.08);
  --cizgi2: rgba(242,246,241,.16);
  --cim:    #35c56b;
  --cim-dim:rgba(53,197,107,.16);
  --amber:  #e8b93e;
  --amber-dim: rgba(232,185,62,.14);
  --hata:   #e2574b;
  --hata-dim: rgba(226,87,75,.14);
  --ink:    #f2f6f1;
  --ink2:   #9fb3a6;
  --soluk:  #6e8377;
  --display: "Barlow Condensed", "Arial Narrow", system-ui, sans-serif;
  --govde: system-ui, -apple-system, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--zemin); color: var(--ink); font-family: var(--govde); line-height: 1.55; }
.sarici { max-width: 880px; margin: 0 auto; padding: 0 20px; }
h1, h2 { font-family: var(--display); line-height: .95; margin: 0; }
.mikro { font-size: 11px; font-weight: 700; letter-spacing: .14em; color: var(--soluk); }
.sayi { font-variant-numeric: tabular-nums; font-weight: 800; letter-spacing: -.02em; }

.ustbar { position: sticky; top: 0; z-index: 10; background: rgba(11,18,14,.86); backdrop-filter: blur(10px); border-bottom: 1px solid var(--cizgi); }
.ustbar .ic { display: flex; align-items: center; gap: 22px; padding: 14px 20px; max-width: 880px; margin: 0 auto; }
.marka { display: flex; align-items: center; gap: 10px; font-family: var(--display); font-size: 21px; font-weight: 700; letter-spacing: .02em; color: var(--ink); text-decoration: none; }
.marka .top { width: 13px; height: 13px; border-radius: 50%; background: var(--cim); }
.ustbar nav { margin-left: auto; display: flex; gap: 18px; align-items: center; }
.ustbar nav a { color: var(--ink2); text-decoration: none; font-size: 14px; font-weight: 600; }
.ustbar nav a.aktif, .ustbar nav a:hover { color: var(--ink); }

.kart { background: var(--kart); border: 1px solid var(--cizgi); border-radius: 16px; padding: 16px; }
a.kart { display: block; color: inherit; text-decoration: none; }
a.kart:hover { border-color: var(--cizgi2); background: #16211a; }

.yelek { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 8px; font-size: 11px; font-weight: 700; flex-shrink: 0; }
.yelek.s { background: #0a0a0a; color: var(--ink); border: 1px solid var(--cizgi2); }
.yelek.b { background: #f5f5f2; color: var(--zemin); border: 1px solid #f5f5f2; }

.rozet { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; }
.rozet.cim { background: var(--cim-dim); color: var(--cim); }
.rozet.amber { background: var(--amber-dim); color: var(--amber); }
.rozet.hata { background: var(--hata-dim); color: var(--hata); }

.vs { display: flex; align-items: center; gap: 8px; }
.vs .deger { font-size: 13px; font-weight: 800; font-variant-numeric: tabular-nums; }
.vs-bar { flex: 1; display: flex; height: 6px; gap: 2px; }
.vs-bar i { display: block; border-radius: 4px; }
.vs-bar .s-pay { background: var(--cim); }
.vs-bar .b-pay { background: var(--yuzey2); border: 1px solid var(--cizgi2); }

.durum-notu { text-align: center; color: var(--ink2); padding: 48px 16px; }
.durum-notu.hata { color: var(--hata); }

footer { border-top: 1px solid var(--cizgi); margin-top: 56px; padding: 24px 0 36px; color: var(--soluk); font-size: 13px; }
footer .ic { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; }