/* Adil Puan Durumu — "Yayın Odası"
 *
 * Tek stil dosyası, bütün sayfalar. Yeni maç sayfası eklemek stil işi
 * gerektirmez: site.py aynı sınıfları üretir.
 *
 * Renklerin anlamı sabittir ve karıştırılmaz:
 *   --hata / --dogru   YALNIZCA bir hakemin oyu için. Başka hiçbir yerde.
 *   --altin            "adil" olan her şey; markanın tek vurgusu.
 *   --mavi             bilançoda "aleyhine" tarafı.
 */

:root{
  color-scheme: dark light;

  --saha:#0A1211;  --kat:#111B18;  --kat2:#17231F;
  --cizgi:#22322C; --cizgi-ince:#1A2723;
  --ak:#E9F1ED;    --sis:#8DA098;  --puslu:#647670;

  --altin:#E7B84B; --altin-zemin:#2A2313;
  --hata:#FF6154;  --hata-zemin:#2E1512;
  --dogru:#3CD39A; --dogru-zemin:#0F2A21;
  --yok:#4E5E58;
  --mavi:#6FA8DC;

  --olcu:1120px;
  --yazi:"Archivo","Helvetica Neue",Arial,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
}

/* Koyu tema varsayılan (yukarıdaki :root). Açık tema iki yoldan gelir:
 * sistem tercihi ve sayfaya açıkça basılmış data-theme. İkisi de aynı
 * değerleri kullanır — bir yerde değiştirirsen ötekini de değiştir. */
@media (prefers-color-scheme: light){
  :root:not([data-theme="dark"]){
    --saha:#F1F4F2;  --kat:#FFFFFF;  --kat2:#F7F9F8;
    --cizgi:#DDE4E0; --cizgi-ince:#E9EEEB;
    --ak:#0C1614;    --sis:#5A6B65;  --puslu:#7C8B85;
    --altin:#9A6F14; --altin-zemin:#FAF1DC;
    --hata:#C7362B;  --hata-zemin:#FBE9E7;
    --dogru:#0E7A55; --dogru-zemin:#E4F4EE;
    --yok:#A9B5B0;
    --mavi:#215F8C;
  }
}
:root[data-theme="light"]{
    --saha:#F1F4F2;  --kat:#FFFFFF;  --kat2:#F7F9F8;
    --cizgi:#DDE4E0; --cizgi-ince:#E9EEEB;
    --ak:#0C1614;    --sis:#5A6B65;  --puslu:#7C8B85;
    --altin:#9A6F14; --altin-zemin:#FAF1DC;
    --hata:#C7362B;  --hata-zemin:#FBE9E7;
    --dogru:#0E7A55; --dogru-zemin:#E4F4EE;
    --yok:#A9B5B0;
    --mavi:#215F8C;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--saha); color:var(--ak);
  font-family:var(--yazi); font-size:15.5px; line-height:1.6;
  font-variation-settings:"wdth" 100;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit}
img{max-width:100%; display:block}

/* geniş, sıkışık başlık karakteri — sayfanın sesi budur */
.gen{font-variation-settings:"wdth" 125; letter-spacing:-.01em}
.sayi{font-family:var(--mono); font-variant-numeric:tabular-nums}

h1,h2,h3{margin:0; font-weight:700; line-height:1.1; color:var(--ak);
  font-variation-settings:"wdth" 125; letter-spacing:-.015em; text-wrap:balance}

.kabuk{position:relative; z-index:1; max-width:var(--olcu); margin:0 auto; padding:0 20px}

/* ---------------------------------------------------------- arkaplan filigran */
.filigran{position:fixed; right:-30px; bottom:-30px; width:clamp(300px,42vw,560px); aspect-ratio:1;
  pointer-events:none; z-index:0; background-repeat:no-repeat; background-position:center;
  background-size:contain; opacity:.06;
  -webkit-mask-image:radial-gradient(circle at center,rgba(0,0,0,1) 20%,rgba(0,0,0,0) 72%);
  mask-image:radial-gradient(circle at center,rgba(0,0,0,1) 20%,rgba(0,0,0,0) 72%)}
@media (prefers-color-scheme:light){
  :root:not([data-theme="dark"]) .filigran{opacity:.038}
}
:root[data-theme="light"] .filigran{opacity:.038}

/* ---------------------------------------------------------- üst bar */
.ust{position:sticky; top:0; z-index:40; background:color-mix(in srgb,var(--saha) 88%,transparent);
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); border-bottom:1px solid var(--cizgi)}
.ust-ic{max-width:var(--olcu); margin:0 auto; padding:0 16px;
  display:flex; align-items:center; gap:14px; height:56px}
.marka{display:flex; align-items:center; gap:8px; text-decoration:none; flex:none}
.marka svg{width:22px; height:22px; color:var(--altin)}
.marka-logo{width:28px; height:28px; border-radius:50%; object-fit:contain; flex:none;
  box-shadow:0 0 10px rgba(231,184,75,0.22); border:1px solid color-mix(in srgb,var(--altin) 35%,transparent);
  transition:transform .2s ease, box-shadow .2s ease, filter .2s ease}
.marka:hover .marka-logo{transform:scale(1.06); box-shadow:0 0 16px rgba(231,184,75,0.5); filter:brightness(1.08)}
.marka b{font-size:14.5px; font-variation-settings:"wdth" 116; letter-spacing:.02em;
  text-transform:uppercase; font-weight:700; white-space:nowrap}
.gezinti{display:flex; align-items:center; gap:3px; margin-left:auto; overflow-x:auto; scrollbar-width:none}
.gezinti::-webkit-scrollbar{display:none}
.gezinti a{text-decoration:none; color:var(--sis); font-size:13px; font-weight:500;
  padding:5px 7px; border-radius:6px; white-space:nowrap; transition:color .15s ease, background .15s ease}
.gezinti a:hover{color:var(--ak); background:var(--kat)}
.gezinti a[aria-current]{color:var(--altin); background:var(--altin-zemin); font-weight:600}
.gezinti .hesap{color:var(--altin); font-family:var(--mono); font-size:12.5px; padding:5px 6px}
.gezinti .hesap:hover{background:var(--altin-zemin); color:var(--altin)}

@media (max-width:1080px){
  .ust-ic{padding:0 12px; gap:10px}
  .marka b{font-size:13.5px}
  .gezinti{gap:2px}
  .gezinti a{font-size:12.5px; padding:4px 5px}
  .gezinti .hesap{font-size:12px; padding:4px 5px}
}
@media (max-width:860px){
  .gezinti .hesap{display:none}
}
@media (max-width:600px){
  .ust-ic{height:52px}
  .marka b{font-size:13px}
}

/* ---------------------------------------------------------- bölümler */
section{padding:44px 0; border-top:1px solid var(--cizgi-ince)}
section:first-of-type{border-top:0}
.etiket{font-size:12px; font-weight:600; letter-spacing:.14em; text-transform:uppercase;
  color:var(--altin); font-variation-settings:"wdth" 112; margin-bottom:8px}
section > h2{font-size:clamp(21px,3.4vw,27px)}
/* Bölümün adı başlık, ne anlattığı onun altındaki daha küçük satır.
   Kapaktaki h1 + .kicker ikilisinin bölüm ölçeğindeki hâli. */
.deck{margin:5px 0 0; font-size:clamp(15.5px,2.1vw,18px); font-weight:600;
  font-variation-settings:"wdth" 112; color:var(--altin); letter-spacing:-.005em}
/* Ölçü sayfanın kendi genişliği. 62ch'te satır sayfanın yarısını bile
   doldurmuyor, cümle ortadan bölünüyordu (Emre, 01.09.2026). */
.girizgah{color:var(--sis); font-size:15px; max-width:min(100%,124ch); margin:9px 0 0}

/* ---------------------------------------------------------- kapak */
.kapak{padding:38px 0 6px}
.acilis{padding-top:24px}
.alt-not{margin-top:18px}
.kapak h1{font-size:clamp(31px,7vw,54px); text-transform:uppercase; letter-spacing:-.02em}
.kicker{margin:12px 0 0; font-size:clamp(17px,2.6vw,22px); font-weight:600;
  font-variation-settings:"wdth" 112; color:var(--altin); letter-spacing:-.005em}
.kapak .alt{color:var(--sis); margin-top:0; font-size:15.5px}
.kapak-govde{display:grid; gap:22px; margin-top:14px}
@media (min-width:900px){ .kapak-govde{grid-template-columns:1fr 340px; gap:40px} }
.ozet{border-left:2px solid var(--altin); padding-left:16px}
.ozet p{margin:0 0 7px; font-size:16.5px; font-weight:600;
  font-variation-settings:"wdth" 112; line-height:1.35; text-wrap:balance}
.ozet-dip{display:block; margin-top:11px; color:var(--puslu); font-size:13.5px;
  font-family:var(--mono)}
.kapak-ust{display:flex; flex-wrap:wrap; align-items:baseline; gap:10px 16px}
.rozet{font-size:12.5px; font-weight:600; letter-spacing:.08em; text-transform:uppercase;
  color:var(--altin); background:var(--altin-zemin); border:1px solid color-mix(in srgb,var(--altin) 30%,transparent);
  padding:3px 10px; border-radius:99px}

/* ---------------------------------------------------------- puan tabloları */
.ikili{display:grid; grid-template-columns:1fr; gap:18px; margin-top:26px}
@media (min-width:920px){ .ikili{grid-template-columns:1fr 84px 1fr; gap:0; align-items:start} }
.tahta{background:var(--kat); border:1px solid var(--cizgi); border-radius:12px; overflow:hidden; display:flex; flex-direction:column}
.tahta > h3{font-size:16px; font-weight:700; letter-spacing:-.01em;
  font-variation-settings:"wdth" 118; color:var(--ak); padding:13px 16px;
  border-bottom:1px solid var(--cizgi); margin:0}
.tahta.adil{border-color:color-mix(in srgb,var(--altin) 34%,var(--cizgi))}
.tahta.adil > h3{color:var(--altin); background:var(--altin-zemin)}
.tahta-govde{overflow-x:auto; -webkit-overflow-scrolling:touch}

/* Sütunlar: # (22px), Arma (24px), Takım (minmax), O, G, B, M, A, Y (20px), AV (28px), P (32px) */
.satir{display:grid; grid-template-columns:22px 24px minmax(100px,1fr) 20px 20px 20px 20px 20px 20px 28px 32px;
  gap:0 6px; align-items:center; min-width:470px;
  padding:11.5px 14px; border-bottom:1px solid var(--cizgi-ince); text-decoration:none; color:inherit;
  transition:opacity .18s ease, background .15s ease}
.satir:last-child{border-bottom:0}
a.satir:hover{background:var(--kat2)}

/* İkili tablo etkileşimi: üzerine gelinen takım odaklanır, diğerleri soluklaşır */
.ikili.odak-var .satir.soluk{opacity:.22}
.ikili.odak-var .satir.aktif{opacity:1; background:var(--kat2)}
.tahta.adil .satir.aktif{background:color-mix(in srgb, var(--altin) 12%, var(--kat2))}
.satir.baslik{padding:8px 14px; background:var(--kat2); border-bottom:1px solid var(--cizgi)}
.satir.baslik span{font-size:12px; font-weight:600; letter-spacing:.08em;
  text-transform:uppercase; color:var(--puslu); font-family:var(--yazi)}
.satir.baslik .sira{text-align:right}
.satir.baslik .gbm{text-align:center}
.satir.baslik .av{text-align:right}
.satir.baslik .puan{text-align:right}
.sira{color:var(--puslu); font-size:14px; text-align:right}
.sira.yok{color:var(--altin); cursor:help}
.kulup{font-weight:600; font-size:15px; font-variation-settings:"wdth" 112;
  display:flex; align-items:center; gap:6px; min-width:0}
.kulup em{font-style:normal; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.gbm{color:var(--sis); font-size:14.5px; text-align:center}
.av{color:var(--sis); font-size:14.5px; text-align:right; font-variant-numeric:tabular-nums}
.puan{font-size:18.5px; font-weight:700; font-variation-settings:"wdth" 125;
  font-variant-numeric:tabular-nums; text-align:right; color:var(--ak)}
.tahta.adil .puan{color:var(--altin)}
.fark{font-size:11.5px; font-weight:700; padding:1.5px 5.5px; border-radius:99px; flex:none}
.fark.yukari{color:var(--dogru); background:var(--dogru-zemin)}
.fark.asagi{color:var(--hata); background:var(--hata-zemin)}

/* kulüp arması: TheSportsDB'den bir kez indirilen resmî rozet. Adresleri
   assets/armalar.css'te, veriden üretiliyor — burada yalnız ölçü var. */
.arma{width:24px; height:24px; flex:none; background:center/contain no-repeat}

/* kulüp şeridi: armanın YEDEĞİ. İki renkli ince bant; rozeti indirilmemiş
   bir kulüp (ör. küme düşmüş, bu sezonun listesinde yok) boş durmasın. */
.serit{width:5px; height:22px; border-radius:2px; flex:none; overflow:hidden;
  display:flex; flex-direction:column; box-shadow:inset 0 0 0 1px rgba(0,0,0,.22)}
.serit i{flex:1; display:block}
.satir > .serit{justify-self:center}

.ray{display:none}
@media (min-width:920px){ .ray{display:block; position:relative; align-self:stretch; pointer-events:none} }
.ray svg{width:100%; height:100%; display:block; overflow:visible}
.ray-hat{stroke:var(--altin); stroke-width:2.2px; opacity:0;
  transition:opacity .18s ease; pointer-events:none}
.ikili.odak-var .ray-hat.soluk{opacity:0}
.ikili.odak-var .ray-hat.aktif{opacity:1;
  filter:drop-shadow(0 0 4px color-mix(in srgb, var(--altin) 60%, transparent))}

/* ---------------------------------------------------------- bilanço */
.bilanco{margin-top:24px; border-top:1px solid var(--cizgi-ince)}
.cubuk{display:grid; grid-template-columns:152px 1fr 72px; gap:14px; align-items:center;
  padding:12px 12px; border-bottom:1px solid var(--cizgi-ince); text-decoration:none; color:inherit;
  transition:background .15s ease, border-radius .15s ease}
.cubuk:last-child{border-bottom:0}
a.cubuk:hover{background:var(--kat2); border-radius:8px}
.yol{position:relative; height:24px; background:
  linear-gradient(to right,transparent calc(50% - .5px),var(--cizgi) calc(50% - .5px),
  var(--cizgi) calc(50% + .5px),transparent calc(50% + .5px))}
.dolgu{position:absolute; top:4px; height:16px; border-radius:3px}
.dolgu.arti{background:var(--altin)}
.dolgu.eksi{background:var(--mavi)}
.katsayi{text-align:right; font-weight:600; font-family:var(--mono); font-size:14.5px}
.katsayi.arti{color:var(--altin)} .katsayi.eksi{color:var(--mavi)}
.pusula{display:flex; justify-content:space-between; color:var(--puslu); font-size:13px;
  padding:12px 12px 0}

/* ---------------------------------------------------------- maç kartları */
.hafta-baslik{display:flex; align-items:baseline; gap:12px; margin:30px 0 12px}
.hafta-baslik h3{font-size:13.5px; letter-spacing:.13em; text-transform:uppercase; color:var(--sis)}
.hafta-baslik .cizik{flex:1; height:1px; background:var(--cizgi-ince)}
.mac-liste{display:grid; gap:8px}
.mac{display:grid; grid-template-columns:1fr auto; gap:12px; align-items:center;
  background:var(--kat); border:1px solid var(--cizgi); border-radius:11px;
  padding:13px 15px; text-decoration:none; color:inherit; transition:border-color .12s,transform .12s}
.mac:hover{border-color:color-mix(in srgb,var(--altin) 45%,var(--cizgi)); transform:translateY(-1px)}
.mac-taraflar{display:flex; align-items:center; gap:10px; min-width:0; flex-wrap:wrap}
.mac-taraf{display:flex; align-items:center; gap:10px; min-width:0}
.mac-ad{font-weight:600; font-variation-settings:"wdth" 112; white-space:nowrap;
  min-width:0; overflow:hidden; text-overflow:ellipsis}
.mac-ad.sonuc-g{color:var(--ak)} .mac-ad.sonuc-m{color:var(--sis)}
.skor{font-family:var(--mono); font-weight:600; font-size:16px; letter-spacing:.02em;
  background:var(--kat2); border:1px solid var(--cizgi); border-radius:6px; padding:2px 9px}
.mac-sag{display:flex; align-items:center; gap:10px; flex:none}
.im{font-size:12.5px; font-weight:600; padding:3px 9px; border-radius:99px; white-space:nowrap;
  border:1px solid var(--cizgi); color:var(--sis)}
.im.hata{color:var(--hata); border-color:color-mix(in srgb,var(--hata) 40%,transparent);
  background:var(--hata-zemin)}
.im.altin{color:var(--altin); border-color:color-mix(in srgb,var(--altin) 40%,transparent);
  background:var(--altin-zemin)}
.im.sessiz{color:var(--puslu)}
.ok{color:var(--puslu); flex:none}
/* Dar ekranda maç kartı: iki kulüp alt alta, skor yanlarında. Serbest
   sarmada satır "Galatasaray / 3-2 Göztepe" diye bölünüyordu. */
@media (max-width:560px){
  .mac{grid-template-columns:1fr; gap:10px}
  .mac-taraflar{display:grid; grid-template-columns:1fr auto; gap:6px 12px}
  .mac-taraflar > .skor{grid-column:2; grid-row:1 / span 2; align-self:center}
}

/* ---------------------------------------------------------- maç sayfası */
.mac-kapak{padding:34px 0 26px}
.kirinti{color:var(--sis); font-size:13.5px; margin-bottom:14px}
.kirinti a{color:var(--sis); text-decoration:none}
.kirinti a:hover{color:var(--altin)}
.skor-tablosu{display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  gap:14px; align-items:center;
  background:var(--kat); border:1px solid var(--cizgi); border-radius:14px; padding:22px 18px}
.skor-taraf{display:flex; align-items:center; gap:11px; min-width:0}
.skor-taraf .arma{width:clamp(34px,7vw,46px); height:clamp(34px,7vw,46px)}
.skor-taraf.dep{flex-direction:row-reverse; text-align:right}
.skor-taraf .ad{font-size:clamp(16px,3.6vw,25px); font-weight:700;
  font-variation-settings:"wdth" 118; letter-spacing:-.01em; text-decoration:none;
  min-width:0; overflow-wrap:break-word}
.skor-taraf a.ad:hover{color:var(--altin)}
.skor-buyuk{font-family:var(--mono); font-size:clamp(26px,7vw,40px); font-weight:600;
  letter-spacing:.02em; white-space:nowrap; text-align:center}
/* Dar ekranda skor tablosu alt alta. Yan yana dizilince kulüp adı skorun
   üstüne biniyordu — arma gelmeden önce de biniyordu, arma büyüttü. */
@media (max-width:680px){
  .skor-tablosu{grid-template-columns:1fr; justify-items:center; gap:8px; padding:18px 14px}
  .skor-taraf{justify-content:center}
  .skor-taraf.dep{flex-direction:row; text-align:center}
}
.mac-kunye{display:flex; flex-wrap:wrap; gap:8px 20px; color:var(--sis); font-size:13.5px;
  margin-top:14px}
.mac-kunye b{color:var(--ak); font-weight:600}

/* ---------------------------------------------------------- çizelge */
.cizelge{position:relative; margin-top:22px; padding-left:64px}
.cizelge::before{content:""; position:absolute; left:47px; top:6px; bottom:6px; width:2px;
  background:var(--cizgi-ince); border-radius:2px}
.olay{position:relative; padding:7px 0; min-height:34px}
.dk{position:absolute; left:-64px; width:38px; text-align:right; font-family:var(--mono);
  font-size:13.5px; color:var(--puslu); padding-top:2px}
.nokta{position:absolute; left:-24px; top:9px; width:16px; height:16px; border-radius:50%;
  background:var(--saha); border:2px solid var(--cizgi); display:grid; place-items:center;
  font-size:9px; line-height:1}
.olay.gol .nokta{border-color:var(--ak)}
.olay.kart-sari .nokta{border-color:#E3B23C}
.olay.kart-kirmizi .nokta{border-color:var(--hata)}
.olay.var .nokta{border-color:var(--mavi)}
.olay.hata .nokta{border-color:var(--hata); background:var(--hata); width:18px; height:18px; left:-25px}
.olay-satir{display:flex; align-items:baseline; gap:9px; flex-wrap:wrap}
.olay-ad{font-weight:600; font-variation-settings:"wdth" 112}
.olay-not{color:var(--sis); font-size:14px}
.olay-kulup{color:var(--puslu); font-size:13px}

/* karar kartı — çizelgenin içindeki asıl içerik */
.karar{background:var(--kat); border:1px solid var(--cizgi); border-left:3px solid var(--hata);
  border-radius:11px; padding:16px 17px; margin:6px 0 4px}
.karar.elenen{border-left-color:var(--yok); background:transparent}
.karar-ust{display:flex; flex-wrap:wrap; align-items:baseline; gap:9px; margin-bottom:7px}
.tip{font-size:16px; font-weight:700; font-variation-settings:"wdth" 112;
  letter-spacing:-.01em; line-height:1.25; color:var(--ak); text-wrap:balance}
.karar.elenen .tip{font-size:15.5px; color:var(--sis)}
.karar p{margin:0 0 12px; font-size:15px}
.karar.elenen p{color:var(--sis); font-size:14.5px}
/* Soru şeridin üstünde durur ve ✕/✓'nin ne demek olduğunu söyler; asıl
   ağırlık hâlâ şeridin kendisinde. */
.karar-soru{color:var(--ak); font-weight:600; font-variation-settings:"wdth" 108}
.karar.elenen .karar-soru{color:var(--sis); font-weight:600}
/* Kaynakların cümlesi oydan SONRA ve daha sessiz: cevabı baştan vermesin.
   Adı `karar-ozet`: `.ozet` ana sayfanın altın çizgili manşet bloğu. */
.karar-ozet{margin:11px 0 0; font-size:14px; color:var(--puslu)}
.karar.elenen .karar-ozet{font-size:14px}

/* Görselli karar kartı: görsel alana dikeyde ortalı, soru ve oy şeridi solda */
.karar.gorselli .karar-govde{
  display:grid;
  grid-template-columns:minmax(0, 1fr) clamp(220px, 30%, 280px);
  gap:20px;
  align-items:center;
}
.karar-icerik{min-width:0}
.karar-gorsel{
  align-self:center;
  justify-self:center;
  width:100%;
  position:relative;
  border-radius:10px;
  overflow:hidden;
  border:1px solid var(--cizgi);
  background:var(--kat2);
  box-shadow:0 4px 14px rgba(0,0,0,.25);
  transition:border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.karar-gorsel:hover{
  border-color:var(--altin);
  box-shadow:0 6px 18px color-mix(in srgb, var(--altin) 20%, transparent);
}
.karar-gorsel-link{display:block; text-decoration:none; position:relative; overflow:hidden}
.karar-gorsel img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:16/10;
  object-fit:cover;
  border-radius:9px;
  border:0;
  margin:0;
  transition:transform .22s ease, opacity .22s ease;
}
.karar-gorsel:hover img{transform:scale(1.03); opacity:.95}
.gorsel-etiket{
  position:absolute;
  right:8px;
  bottom:8px;
  font-family:var(--mono);
  font-size:11px;
  font-weight:600;
  color:#F2F7F4;
  background:rgba(8,14,13,.84);
  border:1px solid rgba(233,241,237,.22);
  border-radius:4px;
  padding:2px 7px;
  pointer-events:none;
  letter-spacing:.02em;
  backdrop-filter:blur(4px);
}
@media (max-width:720px){
  .karar.gorselli .karar-govde{grid-template-columns:1fr; gap:14px}
  .karar-gorsel{width:100%; max-width:440px; margin:4px auto 0}
  .karar-gorsel img{max-height:240px}
}

/* -------------------------------------------------- imza: oy şeridi */
.oy-serit{border:1px solid var(--cizgi); border-radius:9px; overflow:hidden; background:var(--kat2)}
.oy-soru{background:var(--hata); color:#fff; font-size:13px; font-weight:600; padding:6px 11px;
  letter-spacing:.01em; display:flex; justify-content:space-between; gap:10px; align-items:center}
.oy-serit.temiz .oy-soru{background:var(--kat2); color:var(--sis); border-bottom:1px solid var(--cizgi)}
.oy-hucre{display:grid; grid-template-columns:repeat(3,1fr)}
.oy-hucre.uc{grid-template-columns:repeat(3,1fr)}
/* TRT bandında bir ya da iki uzman konuşuyor; altı sütunluk ızgaraya
   bırakılınca hücre satırın altıda birine sıkışıyordu. */
.oy-hucre.bir{grid-template-columns:1fr}
.oy-hucre.iki{grid-template-columns:repeat(2,1fr)}
.oy-hucre.uc .oy,.oy-hucre.bir .oy,.oy-hucre.iki .oy{border-top:0}
@media (min-width:640px){ .oy-hucre{grid-template-columns:repeat(6,1fr)}
  .oy-hucre.uc{grid-template-columns:repeat(3,1fr)}
  .oy-hucre.bir{grid-template-columns:1fr}
  .oy-hucre.iki{grid-template-columns:repeat(2,1fr)} }
.oy{padding:9px 4px 10px; text-align:center; border-right:1px solid var(--cizgi);
  border-top:1px solid var(--cizgi)}
.oy:nth-child(3n){border-right:0}
@media (min-width:640px){ .oy{border-top:0} .oy:nth-child(3n){border-right:1px solid var(--cizgi)}
  .oy:nth-child(6n){border-right:0} }
.oy-ad{display:block; font-size:12px; color:var(--sis); letter-spacing:.04em;
  text-transform:uppercase; font-weight:600; white-space:nowrap; overflow:hidden;
  text-overflow:ellipsis}
.oy-im{display:block; font-size:17.5px; line-height:1.3; font-weight:700}
.oy[data-oy="hata"] .oy-im{color:var(--hata)}
.oy[data-oy="dogru"] .oy-im{color:var(--dogru)}
.oy[data-oy="yok"] .oy-im{color:var(--yok)}
.oy[data-oy="hata"]{background:color-mix(in srgb,var(--hata) 9%,transparent)}
.oy[data-oy="dogru"]{background:color-mix(in srgb,var(--dogru) 9%,transparent)}
.oy-dip{font-size:13px; color:var(--puslu); padding:8px 11px; border-top:1px solid var(--cizgi)}
.oy-dip b{color:var(--sis); font-weight:600}

/* -------------------------------------------------- kanıtlar */
.kanitlar{margin-top:13px; display:grid; gap:9px}
.kanit{border:1px solid var(--cizgi); border-radius:9px; background:var(--kat2);
  padding:11px 13px; font-size:14px}
.kanit-ust{display:flex; align-items:center; gap:8px; margin-bottom:6px; flex-wrap:wrap}
.kanit-kim{font-weight:600; font-size:13.5px}
.kanit-tur{font-size:11.5px; letter-spacing:.09em; text-transform:uppercase; color:var(--puslu);
  border:1px solid var(--cizgi); border-radius:4px; padding:1px 6px}
.kanit-zaman{color:var(--puslu); font-size:13px; font-family:var(--mono); margin-left:auto}
.kanit q{color:var(--sis); font-style:normal; display:block; quotes:"“" "”"}
.kanit q::before{content:open-quote; color:var(--puslu)}
.kanit q::after{content:close-quote; color:var(--puslu)}
/* Köşe yazısının künyesi: gazete adı + yazının başlığı. Alıntının
 * altında, ondan sönük — sözü söyleyen kişi zaten üstte yazıyor. */
.kanit-kunye{margin-top:6px; font-size:13px; color:var(--puslu)}
.kanit a.git{display:inline-flex; align-items:center; gap:5px; margin-top:8px; font-size:13px;
  color:var(--altin); text-decoration:none; font-weight:600}
.kanit a.git:hover{text-decoration:underline}
.kanit img{border-radius:6px; margin-top:9px; border:1px solid var(--cizgi)}

/* Gömülü kaynak: hakemin sözü yerine sözün kendisi.
 *
 * Oynatıcı tıklanana kadar bir kapaktır — bir maç sayfasında yedi video
 * kanıtı olabiliyor, yedi iframe'i baştan kurmak sayfayı bitirir. Kapak
 * aynı zamanda YouTube'a giden gerçek bir bağlantı: betik çalışmazsa
 * kaynak yine açılır. */
.gomu{display:block; margin-top:9px; border-radius:8px}
.gomu.yt{position:relative; aspect-ratio:16/9; overflow:hidden; background:#05100E;
  border:1px solid var(--cizgi); text-decoration:none}
.gomu.yt img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  margin:0; border:0; border-radius:0; opacity:.66; transition:opacity .18s ease}
.gomu.yt:hover img,.gomu.yt:focus-visible img{opacity:.9}
.gomu.yt .yt-tus{position:absolute; inset:0; margin:auto; width:52px; height:36px;
  border-radius:9px; background:rgba(8,14,13,.74); border:1px solid rgba(233,241,237,.32);
  transition:border-color .18s ease, background .18s ease}
.gomu.yt .yt-tus::after{content:""; position:absolute; inset:0; margin:auto; width:0; height:0;
  border-left:12px solid #F2F7F4; border-top:7.5px solid transparent;
  border-bottom:7.5px solid transparent; transform:translateX(2px)}
.gomu.yt:hover .yt-tus,.gomu.yt:focus-visible .yt-tus{border-color:var(--altin);
  background:rgba(8,14,13,.9)}
.gomu.yt .yt-etiket{position:absolute; left:9px; bottom:9px; font-family:var(--mono);
  font-size:12px; color:#F2F7F4; background:rgba(8,14,13,.8);
  border:1px solid rgba(233,241,237,.16); border-radius:5px; padding:3px 7px}
.gomu.yt.acik iframe{position:absolute; inset:0; width:100%; height:100%; border:0}

/* X gömüsü kendi çerçevesini ve genişliğini getirir; ona karışmıyoruz.
 * flow-root şart: widget kendini float'luyor, yoksa kutu boyu sıfır kalıp
 * altındaki bağlantının üstüne biniyor.
 * X widget'ı yuvarlatılmış köşelerle (~13px) gelir; iframe'in dikdörtgen
 * tuvali dışarı taşarsa köşelerde beyaz üçgenler kalır. Kapsayıcı ve
 * iframe'i yuvarlatıp kırparak (clip-path + border-radius) bu artıklar
 * saydamlaştırılır. */
.gomu.x{display:flow-root; min-height:0; background:transparent}
.gomu.x .x-bekle{font-size:13px; color:var(--puslu); padding:13px 14px;
  border:1px dashed var(--cizgi); border-radius:8px}
.gomu.x .twitter-tweet,
.gomu.x .twitter-tweet-rendered,
.gomu.x iframe{margin:0 !important; background:transparent !important;
  background-color:transparent !important; border-radius:13px !important;
  overflow:hidden !important; clip-path:inset(0 round 13px) !important}
.kanitsiz{font-size:13px; color:var(--puslu); margin-top:10px;
  border-left:2px solid var(--cizgi); padding-left:10px}
.kanitsiz b{color:var(--sis); font-weight:600}

/* uyarı kutusu */
.uyari{border:1px solid color-mix(in srgb,var(--altin) 40%,transparent);
  background:var(--altin-zemin); border-radius:9px; padding:12px 14px; font-size:14px;
  color:var(--ak); margin-top:13px}
.uyari > b.baslik{color:var(--altin); display:block; font-size:13px; letter-spacing:.08em;
  text-transform:uppercase; margin-bottom:4px}
.uyari b{color:var(--ak); font-weight:600}
.rapor-not{font-size:13.5px; color:var(--sis); margin-top:10px;
  border-left:2px solid var(--altin); padding-left:11px}
.rapor-not b{color:var(--altin); font-weight:600}
.uyari.sayfa{margin:0 0 24px}

/* ---------------------------------------------------------- açılır liste */
details{background:var(--kat); border:1px solid var(--cizgi); border-radius:11px; margin-top:14px}
summary{cursor:pointer; padding:14px 16px; font-weight:600; font-size:15px; list-style:none;
  display:flex; align-items:center; gap:10px}
summary::-webkit-details-marker{display:none}
summary::after{content:"▾"; margin-left:auto; color:var(--puslu); transition:transform .15s}
details[open] summary::after{transform:rotate(180deg)}
details .ic{padding:0 16px 16px}
summary .im{margin-left:2px}

/* ---------------------------------------------------------- tablolar */
.kaydir{overflow-x:auto; border:1px solid var(--cizgi); border-radius:11px; background:var(--kat)}
table{border-collapse:collapse; width:100%; font-size:14.5px}
th{font-size:12px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--sis);
  text-align:left; padding:11px 13px; border-bottom:1px solid var(--cizgi); white-space:nowrap}
td{padding:11px 13px; border-bottom:1px solid var(--cizgi-ince); vertical-align:top}
tr:last-child td{border-bottom:0}
td.s{text-align:right; white-space:nowrap; font-family:var(--mono); font-variant-numeric:tabular-nums}
th.s{text-align:right}
tbody tr:hover{background:var(--kat2)}
td a{color:inherit; font-weight:600; text-decoration:none}
td a:hover{color:var(--altin)}

/* ---------------------------------------------------------- adil sonuç */
.sonuc-kutu{background:var(--kat); border:1px solid color-mix(in srgb,var(--altin) 30%,var(--cizgi));
  border-radius:13px; padding:20px 19px; margin-top:16px}
.sonuc-kutu > h3{font-size:13px; letter-spacing:.13em; text-transform:uppercase; color:var(--altin);
  margin-bottom:14px}
.hesap{display:grid; gap:0}
.hesap div{display:grid; grid-template-columns:1fr auto; gap:14px; padding:9px 0;
  border-bottom:1px solid var(--cizgi-ince); font-size:14.5px}
.hesap div:last-of-type{border-bottom:0}
.hesap span:first-child{color:var(--sis)}
.hesap span:last-child{font-family:var(--mono); font-variant-numeric:tabular-nums; font-weight:500}
.hesap .vurgu{border-top:1px solid var(--cizgi); margin-top:4px; padding-top:13px}
.hesap .vurgu span{color:var(--ak); font-weight:700; font-size:16px}
.hesap .vurgu span:last-child{color:var(--altin)}
.sonuc-cumle{margin:14px 0 0; font-size:15px; color:var(--sis)}
.sonuc-cumle b{color:var(--ak)}

/* ---------------------------------------------------------- küme sayfası */
.kume-takimlar{display:flex; flex-wrap:wrap; gap:8px; margin:16px 0 0}
.kume-takim-kart{display:inline-flex; align-items:center; gap:8px; padding:6px 12px;
  background:var(--kat); border:1px solid var(--cizgi); border-radius:8px;
  text-decoration:none; color:var(--ak); font-size:14px; font-weight:500;
  transition:border-color .15s ease, background .15s ease, transform .15s ease}
.kume-takim-kart:hover{background:var(--kat2); border-color:var(--altin); transform:translateY(-1px)}
.kume-takim-kart .arma{width:20px; height:20px; flex:none}
.kume-takim-kart .serit{width:6px; height:18px}
.kume-takim-kart span{white-space:nowrap}

/* ---------------------------------------------------------- takım sayfası */
.takim-kapak{display:flex; align-items:center; gap:16px; padding:34px 0 4px; flex-wrap:wrap}
.takim-kapak .serit{width:9px; height:52px}
.takim-kapak .arma{width:58px; height:58px}
.takim-kapak h1{font-size:clamp(28px,6.5vw,46px); text-transform:uppercase}
.kunye{display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--cizgi);
  border:1px solid var(--cizgi); border-radius:12px; overflow:hidden; margin-top:22px}
@media (min-width:720px){ .kunye{grid-template-columns:repeat(4,1fr)} }
.kunye div{background:var(--kat); padding:15px 16px}
.kunye dt{font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--sis);
  margin-bottom:5px}
.kunye dd{margin:0; font-size:23px; font-weight:700; font-variation-settings:"wdth" 125;
  font-variant-numeric:tabular-nums}
.kunye dd small{font-size:13.5px; color:var(--sis); font-weight:500; margin-left:5px;
  font-variation-settings:"wdth" 100}
.kunye dd.altin{color:var(--altin)}

/* ---------------------------------------------------------- yöntem */
.yazi-akis{max-width:68ch}
.yazi-akis h3{font-size:17px; margin:30px 0 8px}
.yazi-akis p{margin:0 0 13px; color:var(--sis)}
/* ---------------------------------------------------------- puanı değişen maçlar ızgarası */
.degisen-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(min(100%, 480px), 1fr)); gap:14px; margin-top:20px}
.degisen-kart{display:flex; flex-direction:column; background:var(--kat); border:1px solid var(--cizgi);
  border-radius:13px; overflow:hidden; text-decoration:none; color:inherit;
  transition:border-color .18s ease, transform .18s ease, box-shadow .18s ease}
.degisen-kart:hover{border-color:color-mix(in srgb,var(--altin) 50%,var(--cizgi)); transform:translateY(-2px);
  box-shadow:0 6px 20px rgba(0,0,0,.28)}

.degisen-kart-ust{display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:10px 15px; background:var(--kat2); border-bottom:1px solid var(--cizgi-ince)}
.degisen-hafta{font-size:12px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--sis)}
.degisen-etiketler{display:flex; align-items:center; gap:8px}
.degisen-git{font-size:12.5px; font-weight:600; color:var(--altin)}

.degisen-mac{display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:12px;
  padding:16px 15px 14px}
.degisen-taraf{display:flex; align-items:center; gap:9px; min-width:0}
.degisen-taraf.dep{justify-content:flex-end; text-align:right}
.degisen-ad{font-weight:600; font-size:15px; font-variation-settings:"wdth" 116;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.degisen-skor-alan{display:flex; flex-direction:column; align-items:center; gap:4px; flex:none}
.degisen-adil-sonuc{font-size:12px; color:var(--sis); white-space:nowrap}
.degisen-adil-sonuc b{color:var(--altin); font-weight:600}

.degisen-etkiler{display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--cizgi-ince);
  border-top:1px solid var(--cizgi-ince); margin-top:auto}
.degisen-etki{padding:11px 14px; background:var(--kat); display:flex; flex-direction:column; gap:5px}
.degisen-etki.soluk{opacity:.55}
.degisen-etki.vurgu{background:color-mix(in srgb,var(--altin-zemin) 35%,var(--kat))}
.degisen-etki-baslik{display:flex; align-items:center; justify-content:space-between; gap:6px}
.degisen-etki-ad{font-size:13px; font-weight:600; color:var(--ak); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.degisen-rozet{font-size:11.5px; font-weight:700; padding:2px 7px; border-radius:99px; white-space:nowrap; font-family:var(--mono)}
.degisen-rozet.yukari{color:var(--dogru); background:var(--dogru-zemin); border:1px solid color-mix(in srgb,var(--dogru) 30%,transparent)}
.degisen-rozet.asagi{color:var(--hata); background:var(--hata-zemin); border:1px solid color-mix(in srgb,var(--hata) 30%,transparent)}
.degisen-rozet.notr{color:var(--puslu); background:var(--kat2); border:1px solid var(--cizgi-ince)}

.degisen-etki-degerler{display:flex; flex-direction:column; gap:2px; font-size:12.5px; color:var(--sis)}
.degisen-puan-degisim b{color:var(--ak)}
.degisen-hata-toplam b.arti{color:var(--altin)}
.degisen-hata-toplam b.eksi{color:var(--mavi)}
.degisen-hata-toplam b.notr{color:var(--sis)}

/* ---------------------------------------------------------- hakem hataları raporu */
.hata-raporu{padding:44px 0}
.hata-filtreler{display:flex; flex-direction:column; gap:12px; margin:22px 0 24px; padding:16px 18px;
  background:var(--kat); border:1px solid var(--cizgi); border-radius:12px}
.hata-filtre-satir{display:flex; align-items:center; gap:12px; flex-wrap:wrap}
.filtre-etiket{font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.08em;
  color:var(--sis); min-width:84px; flex:none}
.filtre-butonlar{display:flex; align-items:center; gap:6px; flex-wrap:wrap}
.filtre-btn{display:inline-flex; align-items:center; gap:7px; padding:6px 12px; font-size:13px;
  font-weight:600; font-family:var(--yazi); color:var(--sis); background:var(--kat2);
  border:1px solid var(--cizgi); border-radius:8px; cursor:pointer;
  transition:color .15s ease, background .15s ease, border-color .15s ease, transform .15s ease;
  white-space:nowrap; user-select:none}
.filtre-btn:hover{color:var(--ak); background:color-mix(in srgb,var(--altin) 12%,var(--kat2));
  border-color:color-mix(in srgb,var(--altin) 40%,var(--cizgi)); transform:translateY(-1px)}
.filtre-btn.aktif{color:var(--ak); background:var(--altin-zemin); border-color:var(--altin);
  font-weight:700; box-shadow:0 0 10px rgba(231,184,75,0.18)}
.filtre-btn .arma{width:18px; height:18px}
.filtre-btn .rozet-sayi{font-family:var(--mono); font-size:11px; font-weight:700; padding:1px 6px;
  border-radius:99px; background:color-mix(in srgb,var(--ak) 10%,transparent); color:inherit}
.filtre-btn.aktif .rozet-sayi{background:var(--altin); color:#0A1211}

/* 1. Olay Akışı Izgarası & Kartları */
.hata-kart-izgara{display:grid; grid-template-columns:repeat(auto-fit, minmax(min(100%, 520px), 1fr));
  gap:16px; margin-top:18px}
.hata-karti{background:var(--kat); border:1px solid var(--cizgi); border-radius:13px; overflow:hidden;
  display:flex; flex-direction:column; box-shadow:0 4px 12px rgba(0,0,0,.15);
  transition:border-color .18s ease, transform .18s ease, box-shadow .18s ease}
.hata-karti:hover{border-color:color-mix(in srgb,var(--altin) 45%,var(--cizgi)); transform:translateY(-2px);
  box-shadow:0 8px 24px rgba(0,0,0,.25)}

.hata-kart-ust{display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:11px 16px; background:var(--kat2); border-bottom:1px solid var(--cizgi-ince); flex-wrap:wrap}
.hata-kart-ust-sol{display:flex; align-items:center; gap:8px; min-width:0; flex-wrap:wrap}
.hata-hafta-rozet{font-size:11.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:var(--sis); background:color-mix(in srgb,var(--sis) 15%,transparent); padding:2px 7px; border-radius:4px}
.hata-dakika-rozet{font-size:12px; font-weight:700; color:var(--ak); background:var(--kat);
  border:1px solid var(--cizgi); padding:2px 7px; border-radius:4px}
.hata-mac-link{display:inline-flex; align-items:center; gap:6px; text-decoration:none; font-size:13px;
  font-weight:600; color:var(--ak); transition:color .15s ease}
.hata-mac-link:hover{color:var(--altin)}
.hata-mac-link .arma{width:18px; height:18px}
.hata-mac-skor{font-size:12.5px; padding:1px 5px; background:var(--kat); border-radius:3px;
  border:1px solid var(--cizgi-ince)}
.hata-kart-ust-sag{display:flex; align-items:center; gap:8px; flex-wrap:wrap}
.hata-tip-etiket{font-size:11.5px; font-weight:600; color:var(--sis); background:var(--kat);
  border:1px solid var(--cizgi); padding:2px 8px; border-radius:99px}

.hata-kart-govde{padding:16px 16px 14px}
.hata-baslik{font-size:16.5px; font-weight:700; line-height:1.3; margin:0 0 6px;
  font-variation-settings:"wdth" 116}
.hata-baslik a{text-decoration:none; color:var(--ak); transition:color .15s ease}
.hata-baslik a:hover{color:var(--altin)}
.hata-aciklama{font-size:14px; color:var(--sis); margin:0; line-height:1.5}

/* Çift Taraflı Takım Etkisi (Dual Impact Box) */
.hata-cift-taraf{display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--cizgi-ince);
  border-top:1px solid var(--cizgi-ince); border-bottom:1px solid var(--cizgi-ince); margin-top:auto}
.hata-taraf-kutu{padding:13px 15px; background:var(--kat); display:flex; flex-direction:column;
  gap:6px; cursor:pointer; transition:background .18s ease; position:relative}
.hata-taraf-kutu:hover{background:var(--kat2)}
.hata-taraf-kutu.lehine{border-left:3px solid var(--dogru)}
.hata-taraf-kutu.aleyhine{border-left:3px solid var(--hata)}
.hata-taraf-kutu.lehine.vurgu{background:color-mix(in srgb,var(--dogru-zemin) 50%,var(--kat))}
.hata-taraf-kutu.aleyhine.vurgu{background:color-mix(in srgb,var(--hata-zemin) 50%,var(--kat))}
.hata-taraf-ust{display:flex; align-items:center; justify-content:space-between; gap:6px}
.hata-yon-etiket{font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase}
.hata-yon-etiket.arti{color:var(--dogru)}
.hata-yon-etiket.eksi{color:var(--hata)}
.hata-katsayi-rozet{font-size:12px; font-weight:700; padding:2px 7px; border-radius:99px;
  font-family:var(--mono)}
.hata-katsayi-rozet.arti{color:var(--altin); background:var(--altin-zemin);
  border:1px solid color-mix(in srgb,var(--altin) 35%,transparent)}
.hata-katsayi-rozet.eksi{color:var(--mavi); background:color-mix(in srgb,var(--mavi) 12%,transparent);
  border:1px solid color-mix(in srgb,var(--mavi) 35%,transparent)}
.hata-taraf-kulup{display:flex; align-items:center; gap:8px; min-width:0}
.hata-taraf-kulup .arma{width:22px; height:22px; flex:none}
.hata-kulup-ad{font-size:14.5px; font-weight:700; color:var(--ak); white-space:nowrap;
  overflow:hidden; text-overflow:ellipsis; font-variation-settings:"wdth" 114}
.hata-taraf-aciklama{font-size:12px; color:var(--puslu); line-height:1.3}

.hata-kart-alt{display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:10px 16px; background:var(--kat2); font-size:12.5px; color:var(--puslu); flex-wrap:wrap}
.hata-hakem-bilgi b{color:var(--sis); font-weight:600}
.hata-incele-btn{font-size:12.5px; font-weight:600; color:var(--altin); text-decoration:none;
  margin-left:auto; transition:transform .12s ease}
.hata-incele-btn:hover{text-decoration:underline; transform:translateX(2px)}

/* 2. Takım Gruplu Bilanço Görünümü */
.takim-hata-karti{background:var(--kat); border:1px solid var(--cizgi); border-radius:13px;
  overflow:hidden; margin-bottom:20px; box-shadow:0 4px 14px rgba(0,0,0,.15)}
.takim-hata-ust{display:flex; align-items:center; justify-content:space-between; gap:14px;
  padding:16px 18px; background:var(--kat2); border-bottom:1px solid var(--cizgi); flex-wrap:wrap}
.takim-hata-sol{display:flex; align-items:center; gap:12px; min-width:0}
.takim-hata-sol .arma{width:38px; height:38px; flex:none}
.takim-hata-ad{font-size:18px; font-weight:700; margin:0; font-variation-settings:"wdth" 118;
  color:var(--ak)}
.takim-hata-ozet-etiketler{display:flex; align-items:center; gap:6px; margin-top:4px; flex-wrap:wrap}
.takim-hata-ozet-etiketler .im.lehine{color:var(--dogru);
  border-color:color-mix(in srgb,var(--dogru) 35%,transparent); background:var(--dogru-zemin)}
.takim-hata-ozet-etiketler .im.aleyhine{color:var(--hata);
  border-color:color-mix(in srgb,var(--hata) 35%,transparent); background:var(--hata-zemin)}
.takim-hata-sag{display:flex; flex-direction:column; align-items:flex-end; gap:2px}
.takim-hata-net-etiket{font-size:11.5px; font-weight:600; text-transform:uppercase;
  letter-spacing:.08em; color:var(--sis)}
.takim-hata-net-puan{font-size:20px; font-weight:700; font-variation-settings:"wdth" 125}
.takim-hata-net-puan.arti{color:var(--altin)}
.takim-hata-net-puan.eksi{color:var(--mavi)}
.takim-hata-net-puan.notr{color:var(--sis)}

.takim-hata-sutunlar{display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--cizgi-ince)}
.takim-hata-sutun{background:var(--kat); padding:16px 18px; display:flex; flex-direction:column; gap:10px}
.sutun-baslik{font-size:13.5px; font-weight:700; color:var(--ak); display:flex; align-items:center;
  gap:8px; text-transform:uppercase; letter-spacing:.05em; border-bottom:1px solid var(--cizgi-ince);
  padding-bottom:10px}
.nokta-im{width:8px; height:8px; border-radius:50%; display:inline-block}
.nokta-im.arti{background:var(--dogru); box-shadow:0 0 6px var(--dogru)}
.nokta-im.eksi{background:var(--hata); box-shadow:0 0 6px var(--hata)}
.sutun-liste{display:grid; gap:8px}

.hata-mini-kart{display:flex; flex-direction:column; gap:4px; padding:10px 12px; background:var(--kat2);
  border:1px solid var(--cizgi); border-radius:9px; text-decoration:none; color:inherit;
  transition:all .15s ease}
.hata-mini-kart:hover{border-color:var(--altin); transform:translateY(-1px)}
.hata-mini-ust{display:flex; align-items:center; justify-content:space-between; gap:6px}
.hata-mini-hafta{font-size:11.5px; font-weight:700; color:var(--sis)}
.hata-mini-katsayi{font-size:12.5px; font-weight:700}
.hata-mini-katsayi.arti{color:var(--altin)}
.hata-mini-katsayi.eksi{color:var(--mavi)}
.hata-mini-baslik{font-size:13.5px; font-weight:600; color:var(--ak); line-height:1.3}
.hata-mini-rakip{font-size:12px; color:var(--puslu)}
.bos.mini{padding:12px; font-size:13px}

@media (max-width:680px){
  .hata-kart-izgara{grid-template-columns:1fr}
  .hata-cift-taraf{grid-template-columns:1fr}
  .takim-hata-sutunlar{grid-template-columns:1fr}
  .hata-filtreler{padding:12px 14px}
  .hata-filtre-satir{flex-direction:column; align-items:flex-start; gap:6px}
}

/* ---------------------------------------------------------- alt */
footer{position:relative; z-index:1; border-top:1px solid var(--cizgi); margin-top:40px; padding:26px 0 46px;
  color:var(--puslu); font-size:13.5px}
footer a{color:var(--sis)}
footer .alt-satir{display:flex; flex-wrap:wrap; gap:8px 20px; align-items:center}
footer .alt-satir .sag{margin-left:auto}

.bos{color:var(--sis); font-size:14px; background:var(--kat); border:1px dashed var(--cizgi);
  border-radius:11px; padding:22px 16px; text-align:center}

:focus-visible{outline:2px solid var(--altin); outline-offset:2px; border-radius:4px}
@media (prefers-reduced-motion:reduce){ *{transition:none !important} }