/* Sonbahar Ligi 2026 - BRAND.md v2.0 uygulamasi (Whoop dili, PLAN.md 27).
   Ortam: gece, floodlight altinda padel kortu. Maclar hafta ici aksam.
   Kural: keyfi aksan rengi YOKTUR. Her renk tek bir sey soyler.

   TOKEN KATMANI. Renk, kose, bosluk, hareket burada; bilesenler yalniz var() okur.
   Whoop olcumu (PLAN 27.2): zemin ustte #232D32 altta #101215, kart yuzeyi beyazin
   ~%7'si, dolu dugme ~%12'si. Bizimki ayni yapi, mavi aileye cekilmis. */
:root{
  --gece:#0A121A;      /* zemin, kortun ustundeki gece gogu */
  --gece-ust:#1B2A35;  /* gradyanin ust ucu. Whoop #232D32'nin mavi karsiligi */
  --kort:#15222D;      /* kart yuzeyi */
  --kort-ac:#1E2F3C;   /* basili / secili / ic kart */
  --dolu:rgba(241,246,249,.10);   /* dolu gri dugme (Whoop ~%12) */
  --dolu-basili:rgba(241,246,249,.18);
  --cizgi:#253A49;
  --isik:#F1F6F9;      /* floodlight beyazi */
  --soluk:#7C93A5;
  /* kose: kart 16, dugme 12, kucuk oge 8, avatar daire. Kort gorseli 0 KALIR */
  --kose:16px; --kose-dugme:12px; --kose-kucuk:8px;
  /* hareket: veri gosteren hareket var, dekoratif yok (BRAND v2.0 Bolum 5) */
  --sure-hizli:120ms; --sure:220ms; --sure-veri:700ms;
  --egri:cubic-bezier(.2,.7,.2,1);
  /* SEN = FLOODLIGHT AMBERI. Limon yesili bilerek BIRAKILDI: Glass'in
     imza rengi o ve ayni yere dusmek istemiyoruz (OZELLIK_PLANI 1.4).
     Amber kortun ustundeki isigin rengi, konudan geliyor. */
  --top:#FFB627;       /* SEN. kendi verin + siradaki eylem. baska yerde YOK */
  --hali:#2BB673;      /* onaylandi, kazanildi */
  --flood:#6E8CA8;     /* onay bekliyor. Bekleme hali one cikmaz, GERI CEKILIR */
  --kirmizi:#FF5A5A;   /* hukmen, gelmedi */
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{-webkit-text-size-adjust:100%;overflow-x:hidden}
body{margin:0;color:var(--isik);
  /* Whoop zemini duz degil, ustten alta koyulasan gradyan. Sabit yukseklik:
     `fixed` iOS'ta calismaz, uzun sayfada gradyan tekrar etmesin diye no-repeat. */
  /* TUZAK (2026-09-05, Murat yakaladi): kisayolda renk yalniz SON katmana
     yazilabilir. Ilk katmana yazilinca tanim GECERSIZ sayiliyor, hata vermiyor,
     sayfa BEYAZ kaliyor. Ekran yakalama araci koyu sarmalayici kullandigi icin
     gormedi. Renk ayri satirda, hicbir katmanda degil. */
  background-color:var(--gece);
  background-image:
    radial-gradient(70% 34% at 100% 0%,rgba(139,181,255,.11),rgba(139,181,255,0) 62%),
    radial-gradient(60% 30% at 0% 16%,rgba(255,182,39,.07),rgba(255,182,39,0) 60%),
    linear-gradient(180deg,var(--gece-ust) 0,var(--gece) 560px);
  background-repeat:no-repeat;
  /* Murat 2026-09-05: "renk gecisleri yeni nesil havasi vermiyor". Iki yumusak
     isik: sag ustte gokyuzu mavisi (gece), sol ustte floodlight amberi. Ikisi
     de zemin tonu, anlam tasimaz; kartlar bunun ustunde yari saydam durur. */
  font:400 16px/1.55 Manrope,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  padding-bottom:calc(88px + env(safe-area-inset-bottom));overflow-x:hidden;
  -webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--top);outline-offset:2px}
.num{font-family:"Barlow Condensed",Manrope,sans-serif;font-variant-numeric:tabular-nums;
  letter-spacing:.01em}

/* ---- ust bant. BUYUK HARF etiket ekran basina TEK ---- */
header{background:rgba(27,42,53,.78);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);
  padding:max(16px,env(safe-area-inset-top)) 16px 14px;position:sticky;top:0;z-index:20}
header .ust{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
header .lig{font-size:11px;font-weight:700;letter-spacing:.1em;color:var(--soluk)}
header .kim{font-size:13px;color:var(--soluk);white-space:nowrap;display:inline-flex;
  align-items:center;gap:8px}
header h1{margin:4px 0 0;font-size:30px;font-weight:700;line-height:1.08;letter-spacing:-.02em}
/* sezon ilerlemesi: kac mac oynandi. Whoop her ekranda nerede oldugunu soyler */
header .ilerleme{margin-top:11px;display:flex;align-items:center;gap:9px}
header .cubuk{flex:1;height:4px;background:var(--dolu);position:relative;border-radius:2px;overflow:hidden}
header .cubuk i{position:absolute;left:0;top:0;bottom:0;background:var(--top);border-radius:2px}
header .oran{font-family:"Barlow Condensed",Manrope,sans-serif;font-size:13px;font-weight:700;
  color:var(--soluk);letter-spacing:.03em;white-space:nowrap}
main{padding:18px 16px 8px}

/* ---- hafta seridi ---- */
.hafta-serit{display:flex;background:var(--kort);border-radius:var(--kose-dugme);padding:4px;
  margin:-4px 0 20px;gap:2px}
.hafta-serit a{flex:1 1 0;min-width:0;text-align:center;padding:8px 0 7px;font-size:16px;color:var(--soluk);
  border-radius:calc(var(--kose-dugme) - 4px);
  font-family:"Barlow Condensed",Manrope,sans-serif;font-weight:600;
  transition:background-color var(--sure-hizli) ease,color var(--sure-hizli) ease}
.hafta-serit a.aktif{color:var(--isik);background:var(--dolu-basili)}
.hafta-serit a.aktif span{opacity:1;color:var(--top)}

/* ---- SEN: haftanin kendi macin ---- */
.benim{background:var(--kort);border-radius:var(--kose);box-shadow:inset 0 0 0 1px var(--top);
  padding:20px;margin-bottom:24px}
.benim .etiket{font-size:11px;font-weight:600;letter-spacing:.1em;color:var(--top)}
.benim .es{font-size:26px;font-weight:700;line-height:1.2;margin:9px 0 3px;letter-spacing:-.015em}
.benim .karsi{font-size:16px;color:var(--soluk)}
.benim .karsi b{color:var(--isik);font-weight:600}
.benim .ne-zaman{font-size:13px;color:var(--soluk);margin-top:14px;padding-top:13px;
  border-top:1px solid var(--cizgi)}

/* ---- kahraman sayi: kendi game toplamin ---- */
.kahraman{background:var(--kort);border-radius:var(--kose);box-shadow:inset 0 0 0 1px var(--top);
  padding:18px 20px 16px;
  margin-bottom:14px;display:flex;align-items:flex-end;justify-content:space-between;gap:16px}
.kahraman .sol .etiket{font-size:11px;font-weight:600;letter-spacing:.1em;color:var(--top)}
.kahraman .buyuk{font-family:"Barlow Condensed",Manrope,sans-serif;font-size:64px;font-weight:700;
  line-height:.88;margin-top:6px;font-variant-numeric:tabular-nums}
.kahraman .birim{font-size:13px;color:var(--soluk);margin-top:6px}
.kahraman .sag{text-align:right;font-size:13px;color:var(--soluk);line-height:1.9}
.kahraman .sag b{color:var(--isik);font-weight:600;
  font-family:"Barlow Condensed",Manrope,sans-serif;font-size:16px}

/* ---- mac satiri ---- */
.bolum{font-size:11px;font-weight:700;letter-spacing:.1em;color:var(--soluk);
  background:var(--kort);border-radius:var(--kose) var(--kose) 0 0;padding:15px 16px 6px;margin-bottom:0}
/* etiketin altindaki kart ustten duz baslar, ikisi tek kart gibi okunur */
.bolum + .liste,.bolum + .tabela,.bolum + .kart,.bolum + .secenek,.bolum + .kisi-kart,
.bolum + .kura-sonuc{border-top-left-radius:0;border-top-right-radius:0}
.bolum + .secenek{background:var(--kort);padding:6px 16px 16px;margin-bottom:12px}
.mac{display:block;background:var(--kort);border-bottom:1px solid var(--gece);padding:16px}
.mac.seninki{border-left:3px solid var(--top);padding-left:13px}
.mac .satir{display:flex;justify-content:space-between;align-items:flex-start;gap:14px}
.mac .taraf{font-size:16px;line-height:1.4;color:var(--soluk)}
.mac .taraf.kazanan{color:var(--isik);font-weight:700}
.mac .orta{font-size:11px;color:var(--soluk);margin:2px 0;letter-spacing:.06em}
.mac .sonuc{font-family:"Barlow Condensed",Manrope,sans-serif;font-size:22px;font-weight:600;
  font-variant-numeric:tabular-nums;white-space:nowrap;text-align:right;line-height:1.25}
.mac .dip{display:flex;justify-content:space-between;align-items:center;margin-top:13px;
  padding-top:12px;border-top:1px solid var(--cizgi);font-size:13px;color:var(--soluk)}
.durum{font-size:11px;font-weight:700;letter-spacing:.07em;padding:3px 8px;border-radius:6px}
.d-onayli{background:rgba(43,182,115,.16);color:var(--hali)}
.d-bekliyor{background:rgba(110,140,168,.20);color:#A9C0D4}
.d-yok{background:var(--kort-ac);color:var(--soluk)}
.d-dur{background:rgba(255,77,77,.16);color:var(--kirmizi)}
.git{color:var(--top);font-weight:700;font-size:13px}

/* ---- tabela ---- */
.tabela{background:var(--kort);border-radius:var(--kose);overflow:hidden;margin-bottom:12px}
.tabela .bas,.tabela .sat{display:grid;grid-template-columns:24px 1fr 56px 46px 34px;
  gap:10px;align-items:center;padding:0 16px}
.tabela .bas{padding-top:11px;padding-bottom:10px;border-bottom:1px solid var(--cizgi);
  font-size:11px;font-weight:700;letter-spacing:.09em;color:var(--soluk)}
.tabela .sat{padding-top:14px;padding-bottom:14px;border-bottom:1px solid var(--gece)}
.tabela .sat:last-child{border-bottom:none}
.tabela .sat.ben{background:var(--kort-ac);box-shadow:inset 3px 0 0 var(--top)}
.tabela .no{font-family:"Barlow Condensed",Manrope,sans-serif;font-size:19px;font-weight:700;
  color:var(--soluk)}
.tabela .sat.ben .no{color:var(--top)}
.tabela .ad{font-size:16px;line-height:1.25;font-weight:500}
.tabela .ag{font-family:"Barlow Condensed",Manrope,sans-serif;font-size:30px;font-weight:700;
  text-align:right;font-variant-numeric:tabular-nums;line-height:1}
.tabela .kucuk{font-family:"Barlow Condensed",Manrope,sans-serif;font-size:16px;text-align:right;
  color:var(--soluk);font-variant-numeric:tabular-nums}
.aciklama{font-size:13px;color:var(--soluk);margin:18px 2px 0;line-height:1.6;max-width:58ch}

/* ---- dugmeler ---- */
/* Whoop: dolu gri, BUYUK HARF aralikli, basinda ikon, ikisi yan yana.
   Birincil (ana) amber dolu, cunku amber = siradaki eylem. */
.dugme{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;min-height:52px;
  padding:14px 16px;border:0;border-radius:var(--kose-dugme);
  background:var(--dolu);color:var(--isik);font:700 13px/1.2 Manrope,sans-serif;
  letter-spacing:.09em;text-transform:uppercase;text-align:center;margin-top:10px;cursor:pointer;
  transition:background-color var(--sure-hizli) ease,transform var(--sure-hizli) ease,opacity var(--sure-hizli) ease}
.dugme svg{width:18px;height:18px;stroke:currentColor;stroke-width:2;fill:none;
  stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
.dugme.ana{background:var(--top);color:var(--gece)}
.dugme.ana:active{background:#E0A01F}
.dugme.sessiz{background:transparent;color:var(--soluk)}
.dugme:active{background:var(--dolu-basili);transform:scale(.97)}
/* ikili dugme: Whoop "+ ADD ACTIVITY | START ACTIVITY" */
.dugme-cift{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
.dugme-cift .dugme{margin-top:0}
/* bolum basligi + yuvarlak beyaz arti: Whoop "My Day  (+)" */
.baslik-satir{display:flex;justify-content:space-between;align-items:center;margin:26px 0 12px}
.baslik-satir h2{margin:0;font-size:26px;font-weight:700;letter-spacing:-.02em;line-height:1.1}
.arti{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;
  border-radius:50%;background:var(--isik);color:var(--gece);flex:0 0 auto;
  transition:transform var(--sure-hizli) ease}
.arti svg{width:20px;height:20px;stroke:currentColor;stroke-width:2.4;fill:none;stroke-linecap:round}
.arti:active{transform:scale(.92)}
/* BRAND.md 5: "kullanicinin eylemine cevap veren gecis VAR". Kodda hic yoktu;
   `transition` tek yerde geciyordu, o da olmayan bir seyi kapatan
   prefers-reduced-motion blogu. Yeni renk yok, yeni efekt yok. */
.sec,.uc button,.ikon-sec button,.git-ok,.geri{
  transition:background-color var(--sure-hizli) ease,border-color var(--sure-hizli) ease,color var(--sure-hizli) ease}
.secim{display:grid;grid-template-columns:repeat(5,1fr);gap:9px;margin-top:12px}
.secim button{min-height:56px;font-family:"Barlow Condensed",Manrope,sans-serif;font-size:26px;
  font-weight:700;border:0;border-radius:var(--kose-dugme);background:var(--dolu);color:var(--isik);cursor:pointer}
.secim button:active{background:var(--top);border-color:var(--top);color:var(--gece)}
.soru{font-size:13px;color:var(--soluk);margin:24px 0 2px}

/* ---- form ---- */
.alan{display:flex;gap:9px;margin-top:10px}
input[type=datetime-local],input[type=text],input[type=password]{flex:1;min-width:0;padding:13px;
  border:1px solid var(--cizgi);border-radius:var(--kose-dugme);background:var(--gece);color:var(--isik);
  font:400 15px Manrope,sans-serif}
.ms{display:flex;align-items:center;gap:12px;padding:12px 16px;border-top:1px solid var(--cizgi)}
.ms:first-child{border-top:none}
.ms .ne{flex:1;min-width:0}
.ms .gun{font-size:13px;font-weight:600;line-height:1.3}
.ms .gun.yok{color:var(--soluk);font-weight:400}
.ms .kimle{font-size:13px;color:var(--soluk);margin-top:2px}
.uc{display:flex;gap:0;flex:0 0 auto;border:1px solid var(--cizgi);border-radius:var(--kose-kucuk);
  overflow:hidden}
.uc button{min-width:44px;min-height:44px;padding:0 11px;border:0;border-left:1px solid var(--cizgi);
  background:transparent;color:var(--soluk);font:700 12px Manrope,sans-serif;cursor:pointer}
.uc button:first-child{border-left:0}
.uc button.secili.evet{background:var(--hali);color:var(--gece)}
.uc button.secili.belki{background:var(--flood);color:#0A121A}
.uc button.secili.hayir{background:var(--kirmizi);color:var(--gece)}

/* ---- alt gezinme ---- */
/* Whoop: gezinme yuzen bir pill, kenarlardan bosluklu, arkasi bulanik */
nav{position:fixed;bottom:calc(10px + env(safe-area-inset-bottom));left:12px;right:12px;z-index:30;
  display:flex;background:rgba(21,34,45,.88);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
  border:1px solid var(--cizgi);border-radius:28px;padding:2px 4px}
nav a{flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:center;gap:4px;
  padding:9px 2px 8px;font-size:11px;font-weight:600;color:var(--soluk);min-height:54px;
  border-radius:22px;transition:color var(--sure-hizli) ease,transform var(--sure-hizli) ease}
nav a:active{transform:scale(.94)}
nav a span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
nav a svg{width:22px;height:22px;stroke:currentColor;stroke-width:1.6;fill:none;
  stroke-linecap:round;stroke-linejoin:round}
nav a.aktif{color:var(--top)}
nav a.aktif svg{stroke-width:2.1}

.bos{color:var(--soluk);padding:48px 4px;font-size:16px;line-height:1.65;max-width:44ch}
.hata{background:rgba(255,90,90,.12);border-radius:var(--kose);color:#FFC2C2;
  padding:13px 15px;margin-bottom:16px;font-size:13px}
.ozet{background:var(--kort);border-radius:var(--kose);box-shadow:inset 0 0 0 1px var(--top);padding:20px}
.ozet.notr{box-shadow:none}
.ozet .skor{font-family:"Barlow Condensed",Manrope,sans-serif;font-size:44px;font-weight:700;
  font-variant-numeric:tabular-nums;line-height:1}
.ozet .kim{font-size:13px;color:var(--soluk);margin-top:8px}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ============================================================
   KORT: imza gorsel. Ustten gorunum, cam duvarlar, file, servis cizgisi.
   Kim hangi tarafta oynuyor tek bakista goruluyor. Tablo bunu yapamaz.
   ============================================================ */
.kort-gorsel{position:relative;padding:10px;border:1px solid var(--cizgi);
  background:radial-gradient(120% 70% at 50% 50%,rgba(43,182,115,.16),rgba(28,86,120,.10) 70%)}
/* cam duvar: dis cerceve ile ic saha arasinda bosluk birakan ikinci cizgi */
.kort-gorsel .saha{position:relative;border:1px solid rgba(242,246,248,.22)}
/* orta cizgi, kortun boyuna uzanan servis ortasi */
.kort-gorsel .saha::before{content:"";position:absolute;left:50%;top:12%;bottom:12%;
  width:1px;background:rgba(242,246,248,.13)}
.kort-gorsel .yari{padding:22px 14px;display:flex;flex-direction:column;gap:3px;
  align-items:center;text-align:center;position:relative;justify-content:center}
/* servis cizgisi: kortun enine */
.kort-gorsel .yari::after{content:"";position:absolute;left:0;right:0;height:1px;
  background:rgba(242,246,248,.22)}
.kort-gorsel .yari.ust::after{bottom:13px}
.kort-gorsel .yari.alt::after{top:13px}
/* file */
.kort-gorsel .file{position:relative;height:9px;margin:0 -1px;
  background:repeating-linear-gradient(90deg,rgba(242,246,248,.30) 0 1px,transparent 1px 3px),
             repeating-linear-gradient(0deg,rgba(242,246,248,.30) 0 1px,transparent 1px 3px);
  border-top:2px solid rgba(242,246,248,.85);border-bottom:1px solid rgba(242,246,248,.35)}
.kort-gorsel .file::before,.kort-gorsel .file::after{content:"";position:absolute;top:-5px;
  width:3px;height:19px;background:rgba(242,246,248,.85)}
.kort-gorsel .file::before{left:-1px}
.kort-gorsel .file::after{right:-1px}
/* oynanmis macta skor kortun ortasinda durur */
.kort-gorsel .kort-skor{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  z-index:2;background:var(--gece);border:1px solid var(--cizgi);padding:5px 12px;
  font-family:"Barlow Condensed",Manrope,sans-serif;font-size:22px;font-weight:700;
  font-variant-numeric:tabular-nums;letter-spacing:.02em;white-space:nowrap}
.kort-gorsel .isim{font-size:16px;font-weight:700;line-height:1.25;letter-spacing:-.01em}
.kort-gorsel .yari.sen .isim{color:var(--top)}
.kort-gorsel .yari.karsi .isim{color:var(--isik)}
.kort-gorsel .rol{font-size:11px;font-weight:700;letter-spacing:.12em;color:var(--soluk);
  margin-bottom:6px}
.kort-gorsel .yari.sen .rol{color:var(--soluk)}

/* hero blogu */
.hero{margin-bottom:30px}
.hero .ust-satir{display:flex;justify-content:space-between;align-items:baseline;
  margin-bottom:11px}
.hero .etiket{font-size:11px;font-weight:700;letter-spacing:.1em;color:var(--top)}
.hero .rez{font-size:11px;font-weight:600;letter-spacing:.08em;color:var(--soluk)}
.hero .nerede{display:flex;justify-content:space-between;gap:12px;align-items:baseline;
  padding:13px 2px 0;font-size:13px;color:var(--soluk)}
.hero .nerede .tarih{color:var(--isik);font-weight:600}

/* ---- liste: tek panel, ic ayrac. Siyah bosluk YOK ---- */
.liste{background:var(--kort);border-radius:var(--kose);overflow:hidden;margin-bottom:12px}
.satir-mac{display:block;padding:15px 16px;border-top:1px solid var(--cizgi)}
.satir-mac:first-child{border-top:none}
.satir-mac .ikili{display:flex;align-items:flex-start;gap:12px}
.satir-mac .taraflar{flex:1;min-width:0}
.satir-mac .tarafi{font-size:16px;line-height:1.4;color:var(--soluk);overflow-wrap:break-word}
.satir-mac .tarafi.kazandi{color:var(--isik);font-weight:700}
.satir-mac .ayrac{height:1px;background:var(--cizgi);margin:7px 0;width:26px}
.satir-mac .skor2{font-family:"Barlow Condensed",Manrope,sans-serif;font-size:19px;font-weight:700;
  font-variant-numeric:tabular-nums;flex:0 0 auto;text-align:right;line-height:1.3}
.satir-mac .alt{display:flex;justify-content:space-between;align-items:center;
  margin-top:10px;font-size:13px;color:var(--soluk)}

/* hafta seridi: tarihli */
.hafta-serit a span{display:block;font-family:Manrope,sans-serif;font-size:11px;
  font-weight:600;letter-spacing:.04em;opacity:.65;margin-top:1px}

/* ---- EKSIK OYUNCU (Y2). Musaitlikte "gelemiyorum" denince herkes gorur ---- */
/* Whoop bilgi bandi: renkli tonlu yuvarlak kart, solda isaret. Serit yok. */
.uyari{display:flex;gap:11px;align-items:flex-start;padding:13px 15px;margin-top:10px;
  border-radius:var(--kose-dugme);background:rgba(255,77,77,.11)}
.uyari.acik{background:rgba(255,182,39,.11)}
.uyari .nokta{flex:0 0 auto;width:8px;height:8px;background:var(--kirmizi);margin-top:6px;
  border-radius:50%}
.uyari.acik .nokta{background:var(--top)}
.uyari .metin{flex:1;min-width:0;font-size:13px;line-height:1.45}
.uyari .kim{font-weight:700}
.uyari .kural{display:block;font-size:13px;color:var(--soluk);margin-top:3px}
.kort-gorsel .isim.yok{text-decoration:line-through;text-decoration-thickness:2px;opacity:.45}
.kort-gorsel .yok-etiket{font-size:11px;font-weight:700;letter-spacing:.1em;color:var(--kirmizi);
  margin-top:4px}
.satir-mac .eksik-not{font-size:13px;color:var(--kirmizi);margin-top:7px;font-weight:600}
.satir-mac .eksik-not.acik{color:var(--top)}

/* lig disi mac etiketi + oyuncu secici */
.d-dostluk{background:rgba(110,140,168,.22);color:#B7CBDC}
.secici .dugme{margin-top:8px}
.secici .dugme:disabled{cursor:default}
.secici .alan{margin-top:8px}


/* ============================================================
   GIRIS EKRANI
   Ustte gorsel, altta koyu alan. Gorsel yoksa kort CSS ile cizilir,
   yani ekran hicbir durumda cıplak kalmaz.
   ============================================================ */
.giris{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}
.giris-gorsel{position:relative;flex:0 0 42vh;min-height:250px;overflow:hidden;
  background:#0d1a24}
.giris-gorsel img{width:100%;height:100%;object-fit:cover;display:block}
/* gorsel yoksa: floodlight altinda kort */
.giris-gorsel.yedek{background:
  radial-gradient(60% 42% at 50% 6%,rgba(255,182,39,.42),rgba(255,182,39,0) 70%),
  radial-gradient(130% 80% at 50% 108%,rgba(43,182,115,.30),rgba(10,18,26,0) 62%),
  linear-gradient(180deg,#0b1621,#0A121A)}
.giris-gorsel.yedek::before{content:"";position:absolute;left:12%;right:12%;top:44%;bottom:-6%;
  border:1px solid rgba(242,246,248,.20);border-bottom:0;
  background:linear-gradient(180deg,rgba(43,182,115,.10),transparent)}
.giris-gorsel.yedek::after{content:"";position:absolute;left:12%;right:12%;top:66%;height:3px;
  border-top:2px solid rgba(242,246,248,.55);
  background:repeating-linear-gradient(90deg,rgba(242,246,248,.22) 0 1px,transparent 1px 3px)}
/* gorselden koyu alana gecis */
.giris-gorsel .perde{position:absolute;inset:auto 0 0 0;height:62%;
  background:linear-gradient(180deg,rgba(10,18,26,0),var(--gece) 92%)}
.giris-govde{flex:1;padding:0 22px calc(28px + env(safe-area-inset-bottom));
  max-width:430px;width:100%;margin:0 auto;margin-top:-52px;position:relative;z-index:2}
.giris-govde .lig{font-size:11px;font-weight:700;letter-spacing:.11em;color:var(--top)}
.giris-govde h1{margin:5px 0 22px;font-size:30px;font-weight:700;letter-spacing:-.025em;line-height:1.05}
.giris-govde .alan{margin-top:8px}
.giris-govde .soru{margin:16px 0 0}

/* uygulama adi ust bantta, sezon adi ekranin altinda */
header .altbaslik{font-size:13px;color:var(--soluk);margin-top:3px}

/* ---- islem bildirisi (flash) ---- */
.bildiri{background:rgba(43,182,115,.13);border-radius:var(--kose-dugme);color:#BFEDD6;
  padding:13px 15px;margin-bottom:16px;font-size:13px;line-height:1.5}

/* ---- Y9 devamsizlik sayaci + Y5 cekilme ---- */
.kisi-kart{background:var(--kort);border-radius:var(--kose);padding:16px;margin-bottom:10px}
.kisi-kart.esik{box-shadow:inset 0 0 0 1px var(--kirmizi)}
.kisi-kart.ayrildi{opacity:.62}
.kisi-kart .ust{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.kisi-kart .isim{font-size:16px;font-weight:600}
.kisi-kart .alt{font-size:13px;color:var(--soluk);margin-top:4px;line-height:1.55}
/* Hafta serisi: her hafta bir kutu. Gelmedigi hafta kirmizi, geldigi yesil. */
.seri{display:flex;gap:5px;margin-top:11px;flex-wrap:wrap}
/* Whoop journal haftasi: daireler */
.seri i{display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;
  font-style:normal;font-size:11px;font-weight:700;background:var(--kort-ac);color:var(--soluk)}
.seri i.kacirdi{background:rgba(255,90,90,.20);color:#FFC2C2}
.seri i.geldi{background:rgba(43,182,115,.18);color:#8FE0B7}
.seri i.mazeretli{background:rgba(110,140,168,.20);color:#A9C0D4}
.satir-form{display:flex;gap:9px;margin-top:12px;align-items:stretch}
.satir-form input{flex:1;min-width:0}
.satir-form .dugme{width:auto;flex:0 0 auto;margin:0;white-space:nowrap}
.kura-grup{background:var(--kort);border-radius:var(--kose);box-shadow:inset 0 0 0 1px var(--top);
  padding:18px;margin-bottom:14px}
.kura-grup .kimler{font-size:16px;font-weight:600;line-height:1.4}
.kura-sonuc{background:var(--kort);border-radius:var(--kose);padding:15px 16px;margin-bottom:10px}
.kura-sonuc ol{margin:8px 0 0;padding-left:22px;font-size:16px;line-height:1.7}
.kura-sonuc ol li:first-child{color:var(--top);font-weight:700}

/* ============================================================
   A3 AVATAR. Dort kademe: FOTOGRAF > 3B gorsel > cizgi SVG > bas harf.
   DAIRE (BRAND v2.0): goz yuvarlagi "kisi", dikdortgeni "veri" okur.
   BRAND.md 2.2: dort renk disinda renk kullanilmaz, bu yuzden
   kisi basina renk YOK. Kendi avatarin amber, cunku `top` = SEN.
   ============================================================ */
.avt{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;border-radius:50%;
  width:var(--boy,26px);height:var(--boy,26px);background:var(--kort-ac);color:var(--soluk);
  font-family:"Barlow Condensed",Manrope,sans-serif;font-weight:700;
  font-size:calc(var(--boy,26px)*.48);line-height:1;letter-spacing:.01em;
  -webkit-user-select:none;user-select:none}
.avt.ben{background:var(--top);color:var(--gece)}
/* Kucuk boyda cizgi ikon bas harf kadar okunmali. .62 ve 1.7 ile soluk
   kaliyordu; 26 px kutuda 16 px'lik ince cizim. */
.avt svg{width:calc(var(--boy,26px)*.72);height:calc(var(--boy,26px)*.72);
  stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
/* Liste satirinda ikon, ada gore ikincil kalmamali */
.tabela .ad .avt,.tabela-mac .avt{color:var(--isik)}
.avt-ad{display:flex;align-items:center;gap:9px;min-width:0}
.avt-ad .avt-metin{min-width:0;overflow-wrap:break-word}

/* kort gorselinde isimler ortali duruyor, avatar da onlarla ayni hizada */
.kort-gorsel .isim .avt-ad{justify-content:center}
.kort-gorsel .yari.sen .avt{background:var(--top);color:var(--gece)}

/* siralama tablosunda avatar ada bitisik */
.tabela .ad .avt-ad{gap:8px}

/* ikon secici */
.ikon-sec{display:grid;grid-template-columns:repeat(auto-fill,minmax(58px,1fr));gap:8px;
  margin-top:12px}
.ikon-sec button{min-height:58px;display:flex;align-items:center;justify-content:center;
  background:var(--dolu);border:1px solid transparent;border-radius:var(--kose-dugme);color:var(--soluk);
  cursor:pointer;padding:0}
.ikon-sec button.secili{border-color:var(--top);color:var(--top);background:var(--kort-ac)}
.ikon-sec button svg{width:24px;height:24px;stroke:currentColor;stroke-width:1.7;fill:none;
  stroke-linecap:round;stroke-linejoin:round}
.ikon-sec button .harf{font-family:"Barlow Condensed",Manrope,sans-serif;font-size:19px;
  font-weight:700}
.takim-ikili{display:flex;flex-direction:column;gap:6px}
.takim-ikili .avt-ad{gap:8px}

/* ============================================================
   KORT, YATAY (gercek padel geometrisi)
   Kort 20 m x 10 m, yani 2:1. File 10 m'lik KISA kenar boyunca uzanir,
   dolayisiyla yatay cizimde file DIKEYDIR ve her yari TAM KAREDIR.
   Onceki cizimde her yari 3:1 yatik dikdortgendi; tenis kortu oranina
   yakin oldugu icin tenis gibi duruyordu (Murat, 2026-09-05).

   Servis cizgisi arka duvardan 6,95 m ileride: 6,95 / 20 = %34,75.
   Orta servis cizgisi yalniz servis alanini boler, kort boyunca UZANMAZ:
   %34,75 ile %65,25 arasi, yani uzunlugun %30,5'i. Tenisin merkez servis
   cizgisi kort boyunca gider, ayrimi yapan sey bu.
   ============================================================ */
.kort-gorsel.yatay .saha{aspect-ratio:2/1;display:flex;flex-direction:row;position:relative}
/* tenis gorunumu veren kort boyu orta cizgi yatayda KULLANILMAZ */
.kort-gorsel.yatay .saha::before{display:none}
/* servis cizgileri: iki yanda, dikey */
.kort-gorsel.yatay .saha::after{content:"";position:absolute;top:0;bottom:0;
  left:34.75%;right:34.75%;border-left:1px solid rgba(242,246,248,.22);
  border-right:1px solid rgba(242,246,248,.22);pointer-events:none}
/* orta servis cizgisi: yalniz servis alani boyunca, filenin iki yani */
.kort-gorsel.yatay .orta{position:absolute;top:50%;left:34.75%;right:34.75%;height:1px;
  background:rgba(242,246,248,.22);pointer-events:none}
.kort-gorsel.yatay .yari{flex:1 1 0;min-width:0;padding:10px 8px;gap:10px}
.kort-gorsel.yatay .yari::after{display:none}
/* file dikey: uzunlugu kortun eninde, direkler ust ve alt uclarda */
.kort-gorsel.yatay .file{height:auto;width:9px;margin:-1px 0;
  background:repeating-linear-gradient(90deg,rgba(242,246,248,.30) 0 1px,transparent 1px 3px),
             repeating-linear-gradient(0deg,rgba(242,246,248,.30) 0 1px,transparent 1px 3px);
  border-top:0;border-bottom:0;
  border-left:2px solid rgba(242,246,248,.85);border-right:1px solid rgba(242,246,248,.35)}
.kort-gorsel.yatay .file::before,.kort-gorsel.yatay .file::after{
  left:-5px;right:auto;top:auto;width:19px;height:3px}
.kort-gorsel.yatay .file::before{top:-1px}
.kort-gorsel.yatay .file::after{bottom:-1px;top:auto}
/* dar kareye sigmasi icin avatar adin USTUNDE durur */
.kort-gorsel.yatay .isim{font-size:13px;line-height:1.2}
.kort-gorsel.yatay .isim .avt-ad{flex-direction:column;gap:5px;text-align:center}
.kort-gorsel.yatay .rol{margin-bottom:2px}
/* Yatayda file DIKEY, yani kortun ortasi artik bos degil, isimler orada.
   Skor kutusu filenin TEPESINE asilir; yayin grafiklerindeki skor tabelasi
   gibi durur ve isimlerle cakismaz. */
.kort-gorsel.yatay .kort-skor{top:0;transform:translate(-50%,-50%)}
/* .ms satiri baglanti olarak da kullaniliyor (yonetim, profil) */
a.ms{color:inherit;text-decoration:none}
a.ms:active{background:var(--kort-ac)}
a.ms .git{flex:0 0 auto}

/* ============================================================
   SKOR GIRISI. Onceden alti adimli sihirbazdi: ne oldu, kim kazandi,
   kac kac, kaybeden hangi game'i aldi, her game icin sayi sec, ozet.
   Tek ekran oldu ve KAZANAN SORULMUYOR, skordan cikiyor (Murat, 2026-09-05).
   ============================================================ */
.skor-baslik{background:var(--kort);border-radius:var(--kose);padding:16px}
.skor-baslik .vs{font-size:11px;font-weight:700;letter-spacing:.12em;color:var(--soluk);
  margin:10px 0;padding-left:2px}
.secenek{display:flex;flex-wrap:wrap;gap:8px}
.sec{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border-radius:22px;
  border:1px solid transparent;background:var(--dolu);color:var(--soluk);font-size:13px;
  font-weight:600;cursor:pointer}
.sec input{position:absolute;opacity:0;width:0;height:0}
/* Secili secenek amber DEGIL. Varsayilan olarak zaten secili gelen
   "Normal oynandi", kullanicinin fiilen dolduracagi set kutularindan daha
   guclu bir vurgu aliyordu. Secim beyaza, vurgu kutuya gecti. */
.sec:has(input:checked){border-color:var(--isik);color:var(--isik);background:var(--kort-ac)}
.alan-blok{margin-top:22px}
.set-satir{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.set-satir .no{flex:0 0 58px;font-size:13px;color:var(--soluk);font-weight:600}
.set-satir input{flex:1 1 0;min-width:0;text-align:center;
  font-family:"Barlow Condensed",Manrope,sans-serif;font-size:26px;font-weight:700;
  padding:8px;border:1px solid var(--cizgi);border-radius:var(--kose-dugme);background:var(--gece);color:var(--isik);
  transition:border-color .12s ease}
/* Ekranin asil isi bu kutulari doldurmak. Odaktaki kutu amber, cunku
   "siradaki eylem" tam olarak o. */
.set-satir input:focus{border-color:var(--top);outline:none}
.set-satir input:placeholder-shown,.set-satir input:not(:focus):invalid{border-color:var(--cizgi)}
.set-satir .ayr{color:var(--soluk);font-size:19px}
.set-dugme{display:flex;gap:10px;margin-top:4px}
.set-dugme .dugme{flex:1 1 0;min-height:44px;font-size:13px}
.skor-ozet{margin-top:14px;padding-top:12px;border-top:1px solid var(--cizgi);
  font-size:13px;color:var(--soluk);line-height:1.5}
.skor-ozet b{color:var(--top)}

/* ============================================================
   MAC KARTI = SKOR TABELASI. Bir satir bir takim.
   Onceden dort isim alt alta diziliydi, iki takim tek liste gibi
   gorunuyordu (Murat, 2026-09-05).
   ============================================================ */
.tabela-mac .tk{display:flex;align-items:center;gap:10px;padding:7px 0;min-width:0}
.tabela-mac .tk + .tk{border-top:1px solid var(--gece)}
.tabela-mac .avatarlar{display:flex;flex:0 0 auto}
/* iki avatar hafifce ust uste: Whoop uye kumesi gibi, yer kazandirir */
.tabela-mac .avatarlar .avt + .avt{margin-left:-7px;box-shadow:0 0 0 2px var(--kort)}
.tabela-mac .avatarlar .avt.ben{position:relative;z-index:1}
.tabela-mac .adlar{flex:1 1 auto;min-width:0;font-size:16px;color:var(--soluk);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tabela-mac .tk.kazandi .adlar{color:var(--isik);font-weight:700}
.tabela-mac .game{display:flex;gap:8px;flex:0 0 auto}
.tabela-mac .game i{font-style:normal;font-family:"Barlow Condensed",Manrope,sans-serif;
  font-size:22px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--soluk);
  min-width:14px;text-align:center}
.tabela-mac .tk.kazandi .game i{color:var(--isik)}
/* geri baglantisi: ok tek basina degil, hedefin adiyla */
.geri{display:inline-block;font-size:13px;font-weight:600;color:var(--soluk);
  padding:2px 0 6px;letter-spacing:.01em}
.geri:active{color:var(--top)}

/* Liste satirinda dokunulabilirlik isareti. Amber DEGIL: satira gitmek bir
   eylem degil, satirin zaten yaptigi sey. Amber "SEN" ve "siradaki eylem"
   icin ayrildi (BRAND.md 2.2). */
.git-ok{color:var(--soluk);font-size:19px;line-height:1;flex:0 0 auto;padding-left:4px}

/* ============================================================
   C1 SIRALAMA DOLGUSU. Alti satirin rakamlarini tek tek karsilastirmak
   yerine fark goz taramasiyla okunsun. Ust banttaki sezon ilerleme
   cubugunun ayni motifi. Yeni renk yok, yuzey tonu.
   ============================================================ */
.tabela .sat{position:relative;isolation:isolate}
.tabela .sat::before{content:"";position:absolute;left:0;top:0;bottom:0;
  width:var(--oran,0);background:var(--kort-ac);z-index:-1}
/* Kendi satirinin zemini zaten --kort-ac. Dolgu gorunsun diye bir tik acik:
   yeni renk degil, floodlight beyazinin dusuk opakligi. */
.tabela .sat.ben::before{background:rgba(242,246,248,.07)}
/* C3: dolgulu rozet yalniz DURUM DEGISTIREN seyler icin. "temiz" bir durum
   degil, durumun YOKLUGU. Alti kartta ayni yesil rozet olunca renk hicbir
   sey ayirt etmiyordu (BRAND 2.2: her renk tek bir sey soyler). */
.durum-yaz{font-size:13px;color:var(--soluk);letter-spacing:.02em}
/* D3: yanitlanmamis ve yaklasan musaitlik varsa sekmede nokta.
   Amber, cunku gercekten siradaki eylem (BRAND 2.2 ile uyumlu). */
nav a{position:relative}
.nokta-sekme{position:absolute;top:8px;left:50%;margin-left:9px;width:6px;height:6px;
  background:var(--top)}
/* D5: lig disi macta alti oyuncu tam genislikte alt alta duruyordu. */
.oyuncu-izgara{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.oyuncu-izgara .dugme{margin-top:0}
/* D4: bos durum yalniz duz metindi, ekranda capa yoktu. */
.bos-durum{display:flex;flex-direction:column;align-items:center;gap:14px;
  padding:56px 24px;color:var(--soluk);font-size:16px;line-height:1.6;text-align:center}
.bos-durum svg{width:44px;height:44px;stroke:var(--cizgi);stroke-width:1.4;fill:none;
  stroke-linecap:round;stroke-linejoin:round}
/* 3B gorsel dairede: kare render kenarlari kirpilir, govde ortada kalir */
.ikon-sec button:has(img){border-radius:var(--kose-dugme)}

/* 3B avatar. Yalniz 40 px ve ustunde; altinda cizgi SVG kullaniliyor
   (olculdu: 3B render 26 px'te okunmuyor). Kare, kose 0, marka ici renk:
   govde lacivert, kenar isigi amber. */
.avt.gorselli{background:var(--kort);padding:0;overflow:hidden}
.avt.gorselli img{width:100%;height:100%;object-fit:cover;display:block}
/* Kendi avatarin: amber zemin yerine amber cerceve, cunku gorselin kendisi
   zaten koyu ve amber zemin uzerinde kayboluyor. */
.avt.ben.gorselli{background:var(--kort);box-shadow:inset 0 0 0 2px var(--top)}

.ikon-sec button img{width:100%;height:100%;object-fit:cover;display:block}
.ikon-sec button:has(img){padding:0;overflow:hidden}


/* ============================================================
   v2.0 WHOOP KATMANI (PLAN.md 27). Yeni bilesenler.
   ============================================================ */
/* genel kart */
.kart{background:var(--kort);border-radius:var(--kose);padding:16px;margin-bottom:12px}
.kart.sen{box-shadow:inset 0 0 0 1px var(--top)}

/* HALKA: Whoop'un uc halkasi. Sayi ortada, etiket altta.
   SVG daire, stroke-dasharray ile dolgu; --p 0..1. Cevre 2*pi*42 = 263,9. */
.halkalar{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:6px 0 22px}
.halka{--p:0;--renk:var(--isik);display:flex;flex-direction:column;align-items:center;gap:8px;
  text-align:center;min-width:0}
.halka .cember{position:relative;width:88px;height:88px}
.halka svg{width:100%;height:100%;transform:rotate(-90deg)}
.halka circle{fill:none;stroke-width:7;stroke-linecap:round}
.halka .ray{stroke:var(--dolu)}
.halka .deger{stroke:var(--renk,var(--isik));stroke-dasharray:263.9;
  stroke-dashoffset:calc(263.9 * (1 - var(--p,0)));
  animation:halka-ciz var(--sure-veri) var(--egri) both;
  filter:drop-shadow(0 0 6px color-mix(in srgb,var(--renk,var(--isik)) 55%,transparent))}
@keyframes halka-ciz{from{stroke-dashoffset:263.9}}
.halka .sayi{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-family:"Barlow Condensed",Manrope,sans-serif;font-size:30px;font-weight:700;line-height:1;
  font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.halka .sayi small{font-size:16px;font-weight:600;margin-left:1px;color:var(--soluk)}
.halka .etiket{font-size:11px;font-weight:700;letter-spacing:.1em;color:var(--soluk);
  display:inline-flex;align-items:center;gap:3px;white-space:nowrap}
.halka .etiket .ok{font-size:13px;line-height:1}
.halka.sen .etiket{color:var(--top)}
.halka.bos .deger{animation:none}

/* HERO FOTO: Whoop pazarlama karti gibi, fotograf ustte, icerik altta.
   Fotograf koyu perdeyle karta karisir, kort cizimi hemen altinda. */
.hero-foto{position:relative;height:118px;margin:-20px -20px 14px;overflow:hidden;
  border-radius:var(--kose) var(--kose) 0 0}
.hero-foto img{width:100%;height:100%;object-fit:cover;object-position:50% 38%;display:block;
  filter:saturate(.85) brightness(.9)}
.hero-foto::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(21,34,45,.05) 0,rgba(21,34,45,.35) 55%,var(--kort) 100%)}
.hero-foto .ustune{position:absolute;left:20px;bottom:10px;z-index:2;display:flex;
  justify-content:space-between;right:20px;align-items:baseline}

/* Skor kutusu (kort-skor) kortun ust kenarina asili duruyordu ve OYNANMIS
   macta TAKIM 1 / TAKIM 2 etiketlerini kapatiyordu; hero kartinda ustelik
   fotograf seridiyle cakisiyordu (ekran goruntusu 2026-09-05). Skoru olan
   kort 30 px asagi iner, kutu kortun USTUNE asilir: tel orgunun tepesindeki
   tabela gibi, hicbir ismin ustune gelmez. */
.kort-gorsel.yatay:has(.kort-skor){margin-top:30px}
.kort-gorsel.yatay .kort-skor{top:-4px;transform:translate(-50%,-100%)}
/* hero kartinda kutu fotograf seridindeki etikete 8 px degiyordu, kort biraz daha iner */
.hero-foto + .kort-gorsel.yatay:has(.kort-skor){margin-top:44px}

/* ust bantta avatar */
header .kim .avt{--boy:28px}

/* NADIR OLAY: holografik gradyan. Whoop yalniz CUSTOMIZE / family plan'da kullaniyor.
   Bizde yalniz lig sonunda sampiyon satiri. Baska yerde KULLANILMAZ. */
.nadir{background:linear-gradient(100deg,#F89894 0%,#E7B6C7 35%,#B8ACBF 65%,#8BB5FF 100%);
  color:#0A121A}
.nadir .no,.nadir .ad,.nadir .ag,.nadir .kucuk,.nadir .avt-metin{color:#0A121A!important}

/* SAYFA GECISI: tarayici destekliyorsa (Safari 18.2+, Chrome 126+) sayfalar
   arasi kisa capraz solma. Desteklemeyende hicbir sey olmaz. */
@view-transition{navigation:auto}
::view-transition-old(root){animation-duration:var(--sure-hizli)}
::view-transition-new(root){animation-duration:var(--sure)}
/* alt gezinme ve ust bant gecis sirasinda yerinde kalir */
nav{view-transition-name:gezinme}
header{view-transition-name:ustbant}

/* ISIK: halkanin parlamasi tek golge istisnasi (BRAND v2.0 Bolum 4).
   color-mix desteklemeyen tarayicida filter dusuyor, halka yine ciziliyor. */
@supports not (color: color-mix(in srgb, red 50%, blue)){.halka .deger{filter:none}}

@media (prefers-reduced-motion:reduce){
  .halka .deger{animation:none}
  ::view-transition-old(root),::view-transition-new(root){animation:none}}


/* ============================================================
   MAC KARTI (Murat 2026-09-05: "iki mac birbirinden ayrilmiyor, tek mac gibi").
   Her mac KENDI karti. Yuzey yari saydam gradyan (Whoop kartlari zeminin
   ustunde beyazin %7'si), ust kenarda 1 px isik. Kartlar arasi 10 px bosluk.
   ============================================================ */
.mac-kart{display:block;position:relative;border-radius:var(--kose);padding:13px 16px 12px;
  margin-bottom:10px;
  background:linear-gradient(180deg,rgba(241,246,249,.085),rgba(241,246,249,.035));
  box-shadow:inset 0 1px 0 rgba(241,246,249,.09);
  transition:transform var(--sure-hizli) ease,background-color var(--sure-hizli) ease}
a.mac-kart:active{transform:scale(.985)}
.mac-kart.seninki{box-shadow:inset 0 0 0 1px var(--top),inset 0 1px 0 rgba(255,182,39,.5)}
.mk-ust{display:flex;justify-content:space-between;align-items:center;gap:10px;
  font-size:11px;font-weight:700;letter-spacing:.09em;color:var(--soluk);margin-bottom:6px}
.mk-ust .durum{margin-left:auto}
.mk-alt{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:8px;
  padding-top:9px;border-top:1px solid rgba(241,246,249,.07);font-size:13px;color:var(--soluk)}
.mac-kart .tabela-mac .tk + .tk{border-top:1px solid rgba(241,246,249,.06)}
.mac-kart .tabela-mac .tk{padding:8px 0}
/* kazanan satirin skoru yesil: anlam tasiyan renk (onaylandi/kazanildi) */
.mac-kart .tabela-mac .tk.kazandi .game i{color:var(--hali);text-shadow:0 0 12px rgba(43,182,115,.45)}
/* hafta ayraci: Maclar listesinde haftalar arasinda */
.hafta-ayrac{display:flex;align-items:center;gap:12px;margin:22px 2px 10px;
  font-size:11px;font-weight:700;letter-spacing:.1em;color:var(--soluk);white-space:nowrap}
.hafta-ayrac::after{content:"";flex:1;height:1px;
  background:linear-gradient(90deg,var(--cizgi),rgba(37,58,73,0))}
.hafta-ayrac:first-child{margin-top:4px}

/* ---- Maclar, secenek B: TABELA. Yatay skor tabelasi, ortada setler ---- */
.tabela-kart{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:center}
.tabela-kart .takim{display:flex;flex-direction:column;gap:6px;min-width:0}
.tabela-kart .takim.sag{align-items:flex-end;text-align:right}
.tabela-kart .takim .avt-ad{gap:7px}
.tabela-kart .takim.sag .avt-ad{flex-direction:row-reverse}
.tabela-kart .takim .avt-metin{font-size:13px;font-weight:600;color:var(--soluk);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tabela-kart .takim.kazandi .avt-metin{color:var(--isik);font-weight:700}
.tabela-kart .orta{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:64px;
  padding:6px 10px;border-radius:var(--kose-dugme);background:rgba(10,18,26,.55)}
.tabela-kart .orta .set{font-family:"Barlow Condensed",Manrope,sans-serif;font-size:22px;
  font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:.03em;line-height:1.15}
.tabela-kart .orta .vs{font-size:13px;font-weight:700;letter-spacing:.12em;color:var(--soluk)}
.tabela-kart .orta .ne-zaman{font-size:11px;color:var(--soluk);white-space:nowrap}
/* skor SET olarak (2–0), altinda set icleri (6-3 6-4). Game toplami skor DEGIL (Murat 2026-09-06) */
.tabela-kart .orta .set-game{font-size:11px;color:var(--soluk);white-space:nowrap;letter-spacing:.04em}

/* ---- Maclar, secenek C: ZAMAN CIZGISI. Solda tarih pulu, dikey isik hatti ---- */
.zaman{position:relative;padding-left:58px}
.zaman::before{content:"";position:absolute;left:21px;top:8px;bottom:8px;width:2px;
  background:linear-gradient(180deg,rgba(255,182,39,.55),rgba(139,181,255,.35) 60%,rgba(37,58,73,0))}
.zaman .mac-kart{margin-bottom:12px}
.zaman .pul{position:absolute;left:-58px;top:10px;width:44px;text-align:center;
  border-radius:var(--kose-dugme);background:var(--kort);padding:5px 0 4px;
  box-shadow:inset 0 0 0 1px var(--cizgi)}
.zaman .pul .gun{font-family:"Barlow Condensed",Manrope,sans-serif;font-size:22px;font-weight:700;line-height:1}
.zaman .pul .ay{font-size:11px;font-weight:700;letter-spacing:.06em;color:var(--soluk);margin-top:1px}
.zaman .mac-kart.seninki .pul{box-shadow:inset 0 0 0 1px var(--top)}
.stil-sec{display:flex;gap:6px;margin:0 0 14px}
.stil-sec a{flex:1;text-align:center;padding:8px 0;border-radius:var(--kose-kucuk);font-size:11px;
  font-weight:700;letter-spacing:.08em;color:var(--soluk);background:var(--dolu)}
.stil-sec a.aktif{color:var(--gece);background:var(--isik)}

/* ============================================================
   PROFIL (Murat 2026-09-05: "ustune hicbir sey koymamissin").
   Whoop profil dili: buyuk daire fotograf, ad, rozet pulleri, uc halka,
   sonra olcu satirlari (ikon + etiket + buyuk sayi).
   ============================================================ */
.profil-hero{display:flex;flex-direction:column;align-items:center;text-align:center;
  padding:6px 0 4px;position:relative}
.profil-hero .avt{--boy:112px;box-shadow:0 0 0 3px var(--gece),0 0 0 5px var(--cizgi)}
.profil-hero .avt.ben{box-shadow:0 0 0 3px var(--gece),0 0 0 5px var(--top),0 0 34px rgba(255,182,39,.28)}
.profil-hero .avt:not(.gorselli){font-size:44px}
.profil-ad{font-size:26px;font-weight:700;margin-top:14px;letter-spacing:-.02em;line-height:1.1}
.profil-alt{font-size:13px;color:var(--soluk);margin-top:3px}
.rozetler{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap;justify-content:center}
.rozet{display:inline-flex;align-items:center;gap:6px;padding:7px 13px;border-radius:999px;
  background:var(--dolu);font-size:11px;font-weight:700;letter-spacing:.08em;color:var(--soluk)}
.rozet b{font-family:"Barlow Condensed",Manrope,sans-serif;font-size:16px;color:var(--isik);
  font-variant-numeric:tabular-nums}
.rozet.sen{background:rgba(255,182,39,.14);color:var(--top)}
.rozet.sen b{color:var(--top)}
.foto-degistir{display:flex;justify-content:center;gap:16px;margin-top:12px;font-size:13px;
  font-weight:600;color:var(--soluk)}
.foto-degistir label,.foto-degistir button{cursor:pointer;color:var(--soluk);background:none;
  border:0;padding:0;font:inherit;display:inline-flex;align-items:center;gap:5px}
.foto-degistir label:active,.foto-degistir button:active{color:var(--top)}
.foto-degistir svg{width:15px;height:15px;stroke:currentColor;stroke-width:2;fill:none;
  stroke-linecap:round;stroke-linejoin:round}
.profil-hero .halkalar{margin:22px 0 8px;width:100%}
/* olcu satiri: Whoop "My Dashboard" satirlari */
.metrik{display:flex;align-items:center;gap:12px;padding:13px 16px;border-top:1px solid rgba(241,246,249,.07)}
.metrik:first-child{border-top:0}
.metrik svg{width:22px;height:22px;stroke:var(--soluk);stroke-width:1.7;fill:none;
  stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
.metrik .ad{flex:1;min-width:0;font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.metrik .ad small{display:block;font-size:13px;font-weight:400;letter-spacing:0;text-transform:none;
  color:var(--soluk);margin-top:1px}
.metrik .deger{font-family:"Barlow Condensed",Manrope,sans-serif;font-size:30px;font-weight:700;
  font-variant-numeric:tabular-nums;line-height:1;white-space:nowrap}
.metrik .deger small{font-family:Manrope,sans-serif;font-size:13px;font-weight:600;color:var(--soluk);
  margin-left:2px}
.metrik .avt{--boy:34px}

/* ---- ust bantta seri sayaci (Whoop alev + sayi). Yalniz seri > 0 ---- */
header .sag{display:inline-flex;align-items:center;gap:10px}
.seri-ust{display:inline-flex;align-items:center;gap:3px;padding:4px 9px 4px 6px;border-radius:999px;
  background:rgba(255,182,39,.14);color:var(--top);
  font-family:"Barlow Condensed",Manrope,sans-serif;font-size:16px;font-weight:700;line-height:1}
.seri-ust svg{width:15px;height:15px;stroke:currentColor;stroke-width:2;fill:none;
  stroke-linecap:round;stroke-linejoin:round}

/* ---- fotograf kirpma ---- */
#kirp{margin-top:16px;width:100%;text-align:left}
.kirp-ust{font-size:11px;font-weight:700;letter-spacing:.1em;color:var(--soluk);
  display:flex;justify-content:space-between;margin-bottom:12px}
.kirp-ust span{font-weight:400;letter-spacing:0;text-transform:none;color:var(--soluk)}
.kirp-alan{position:relative;width:280px;max-width:100%;aspect-ratio:1;margin:0 auto;
  border-radius:var(--kose-dugme);overflow:hidden;background:var(--gece);touch-action:none}
.kirp-alan canvas{width:100%;height:100%;display:block;cursor:grab}
/* daire maske: avatar boyle gorunecek */
.kirp-maske{position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(circle at 50% 50%,transparent 49.5%,rgba(10,18,26,.62) 50.5%)}
#kirp input[type=range]{width:280px;max-width:100%;display:block;margin:14px auto 4px;accent-color:var(--top)}

/* ---- baglanti satiri (Whoop "HEALTH MONITOR >"): metrik + chevron ---- */
a.metrik.satir-link{color:inherit}
a.metrik.satir-link:active{background:var(--kort-ac)}
.metrik .git-ok{padding-left:6px}
.metrik .deger + .git-ok{margin-left:-2px}

/* ---- musaitlik karti: tarih pulu + es + uc durum ---- */
.ms-kart{display:flex;align-items:center;gap:12px;padding:12px 14px 12px 12px;margin-bottom:10px;
  border-radius:var(--kose);
  background:linear-gradient(180deg,rgba(241,246,249,.085),rgba(241,246,249,.035));
  box-shadow:inset 0 1px 0 rgba(241,246,249,.09)}
.ms-kart .pul{flex:0 0 44px;text-align:center;border-radius:var(--kose-dugme);
  background:rgba(10,18,26,.55);padding:6px 0 5px}
.ms-kart .pul .gun{font-family:"Barlow Condensed",Manrope,sans-serif;font-size:22px;font-weight:700;
  line-height:1;display:block}
.ms-kart .pul .ay{font-size:11px;font-weight:700;letter-spacing:.06em;color:var(--soluk);display:block;margin-top:2px}
.ms-kart .ne{flex:1;min-width:0}
.ms-kart .ne .gun{font-size:16px;font-weight:600;line-height:1.3}
.ms-kart .ne .kimle{font-size:13px;color:var(--soluk);margin-top:3px;display:flex;align-items:center;gap:5px;
  flex-wrap:wrap}
.ms-kart .ne .kimle .avt-ad{gap:5px}
.ms-kart .uc{border:0;background:rgba(10,18,26,.55);border-radius:var(--kose-dugme);padding:3px;gap:3px}
.ms-kart .uc button{border:0;border-radius:calc(var(--kose-dugme) - 3px);min-width:40px;min-height:40px;
  padding:0 8px;font-size:11px}
.ms-kart .uc button.secili.evet{background:var(--hali);color:var(--gece)}
.ms-kart .uc button.secili.belki{background:var(--flood);color:#0A121A}
.ms-kart .uc button.secili.hayir{background:var(--kirmizi);color:var(--gece)}
.ms-kart.cevapli{box-shadow:inset 0 1px 0 rgba(241,246,249,.09)}
@media (max-width:360px){.ms-kart{flex-wrap:wrap}.ms-kart .uc{margin-left:56px}}

/* ---- ust bant: can + rozet, ad yazmiyor ---- */
.can{position:relative;display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;
  border-radius:50%;background:var(--dolu);color:var(--isik)}
.can svg{width:19px;height:19px;stroke:currentColor;stroke-width:1.9;fill:none;stroke-linecap:round;stroke-linejoin:round}
.can i{position:absolute;top:-3px;right:-4px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;
  background:var(--top);color:var(--gece);font-style:normal;font-family:"Barlow Condensed",Manrope,sans-serif;
  font-size:13px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;
  box-shadow:0 0 0 2px var(--gece)}
header .kim .avt{--boy:32px}
.metrik.yeni{background:rgba(255,182,39,.06)}
.nokta-yeni{width:8px;height:8px;border-radius:50%;background:var(--top);flex:0 0 auto}

/* kapali dugme (lig disi: takimlar secilmeden Kaydet) sonuk gorunsun */
.dugme:disabled{opacity:.38;cursor:default;transform:none}

/* TUZAK: .metrik{display:flex} UA stilindeki [hidden]{display:none}i EZIYOR; gizli
   arkadas satirlari ekranda goruluyordu (ana.png). Test HTML niteligine bakti, gormedi. */
.metrik[hidden],.mac-kart[hidden]{display:none}

/* ---- FORM DAIRELERI (son 5 mac). G yesil dolu, M soluk halka, H kirmizi, yok kesikli ---- */
.form-seridi{display:inline-flex;align-items:center;gap:7px}
.form-seridi i{width:14px;height:14px;border-radius:50%;box-sizing:border-box;display:inline-block}
.form-seridi .f-g{background:var(--hali);box-shadow:0 0 8px rgba(43,182,115,.45)}
.form-seridi .f-m{border:2px solid var(--soluk)}
.form-seridi .f-h{border:2px solid var(--kirmizi)}
.form-seridi .f-yok{border:2px dashed var(--cizgi)}
.form-seridi .etiket{font-size:11px;font-weight:700;letter-spacing:.09em;color:var(--soluk);margin-left:6px}
.halka .sayi.kesir{font-size:26px}
.profil-hero .form-seridi{margin-top:14px}

/* ---- LIG KARTI (Home): yatay kaydirmali, kart = lig secici ---- */
.lig-kartlar{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -16px;padding:0 16px 4px;
  -webkit-overflow-scrolling:touch;scrollbar-width:none}
.lig-kartlar::-webkit-scrollbar{display:none}
.lig-kart{flex:0 0 100%;scroll-snap-align:start;display:block;border-radius:var(--kose);padding:16px;
  background:linear-gradient(160deg,rgba(255,182,39,.10),rgba(241,246,249,.05) 55%,rgba(139,181,255,.06));
  box-shadow:inset 0 1px 0 rgba(241,246,249,.10),inset 0 0 0 1px rgba(255,182,39,.28);color:inherit}
.lig-kartlar:has(.lig-kart + .lig-kart) .lig-kart{flex-basis:88%}
.lk-ust{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.lk-ad{font-size:19px;font-weight:700;letter-spacing:-.01em}
.lk-grup{font-size:11px;font-weight:700;letter-spacing:.09em;color:var(--soluk);text-transform:uppercase;white-space:nowrap}
.lk-satir{display:flex;gap:18px;margin:12px 0 12px}
.lk-buyuk b{font-family:"Barlow Condensed",Manrope,sans-serif;font-size:30px;font-weight:700;line-height:1;
  font-variant-numeric:tabular-nums}
.lk-buyuk small{font-size:13px;color:var(--soluk);margin-left:3px}
.lk-siradaki{display:flex;align-items:center;gap:8px;margin-top:12px;padding-top:11px;
  border-top:1px solid rgba(241,246,249,.08);font-size:13px;color:var(--isik)}
.lk-siradaki svg{width:16px;height:16px;stroke:var(--soluk);stroke-width:1.8;fill:none;flex:0 0 auto}
.lk-siradaki span:first-of-type{flex:1;min-width:0}
/* bekleyen isler: amber cerceve, siradaki eylem */
.liste.kart-sen{box-shadow:inset 0 0 0 1px var(--top)}
.bolum + .liste.kart-sen{border-top-left-radius:0;border-top-right-radius:0}

/* ---- AVERAJ CUBUKLARI (profil alt sayfasi, S2): mac basi game farki, hafta gruplu.
   Yesil = game farki arti, soluk = eksi, kirmizi = hukmen kaybi. Amber YOK: kendi
   profilinde her cubuk zaten SEN (ajan-veri Bolum 1 #2). ---- */
.averaj{display:block;width:100%;height:auto}
.averaj .sifir,.averaj .ayrac{stroke:var(--dolu);stroke-width:1}
.averaj .yuva{fill:none;stroke:var(--dolu);stroke-dasharray:3 3}
.averaj text{fill:var(--soluk);text-anchor:middle;font-family:"Barlow Condensed",Manrope,sans-serif;font-weight:700}
.averaj .deger{font-size:13px;fill:var(--isik)}
.averaj .hafta{font-size:11px;letter-spacing:.09em}
.averaj a rect{transition:opacity var(--sure-hizli)}
.averaj a:active rect{opacity:.7}

/* ---- WORDMARK (Murat 2026-09-06: logo-tip-4, Manrope 800 buyuk harf, top yok).
   Ust bantta ve giris ekraninda "SPORTCO" metninin yerine. Seffaf PNG, static/logo.png ---- */
.wordmark{display:block;height:11px;width:auto}
.wordmark.giris-wm{height:16px}

/* ---- KAZANAN (Murat 2026-09-06: "hangi tarafin kazandigi belli degil"). Iki katman:
   (1) kendi macinda ust satirda KAZANDIN / KAYBETTIN etiketi; (2) her macta kazanan
   takimin adinin sonunda yesil isaret. Kazanan SET sayisina gore (mac_kazanan). ---- */
.d-kazandin{background:rgba(43,182,115,.18);color:var(--hali)}
.d-kaybettin{background:rgba(124,147,165,.18);color:var(--soluk)}
.mk-ust .d-kazandin,.mk-ust .d-kaybettin{margin-left:auto}
.mk-ust .durum + .d-kazandin,.mk-ust .durum + .d-kaybettin{margin-left:6px}
.tabela-mac .tk.kazandi .adlar::after,.tabela-kart .takim.kazandi::after{content:"\2713";color:var(--hali);
  font-weight:800;margin-left:6px;font-size:14px;text-shadow:0 0 10px rgba(43,182,115,.5)}
.tabela-kart .takim.kazandi{position:relative}
.tabela-kart .takim.kazandi::after{position:absolute;right:-4px;top:50%;transform:translateY(-50%)}
.tabela-kart .takim.sag.kazandi::after{right:auto;left:-4px}