/* vesaire arşivi — tek dosya stil, bağımlılık yok. */
:root {
  --zemin: #fbfaf8;
  --metin: #1d1c1a;
  --soluk: #6b6862;
  --cizgi: #e4e0d8;
  --vurgu: #8a4b2a;
  --kutu: #ffffff;
}
@media (prefers-color-scheme: dark) {
  :root {
    --zemin: #161513;
    --metin: #eceae5;
    --soluk: #a09b92;
    --cizgi: #2e2c28;
    --vurgu: #d99b6c;
    --kutu: #1e1d1a;
  }
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--zemin);
  color: var(--metin);
  font: 17px/1.65 ui-serif, Georgia, "Times New Roman", serif;
}
main { max-width: 46rem; margin: 0 auto; padding: 0 1.25rem 4rem; }
a { color: var(--vurgu); }

/* başlık ve menü */
.ust {
  max-width: 46rem;
  margin: 0 auto;
  padding: 1.75rem 1.25rem 1.25rem;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: baseline;
  justify-content: space-between;
}
.marka {
  font-weight: 700;
  font-size: 1.25rem;
  letter-spacing: .02em;
  text-decoration: none;
  color: var(--metin);
}
.ust nav { display: flex; gap: 1.1rem; font-size: .9rem; }
.ust nav a { color: var(--soluk); text-decoration: none; }
.ust nav a:hover { color: var(--vurgu); }

/* liste */
.liste-baslik { font-size: 1.9rem; margin: 1rem 0 .3rem; line-height: 1.2; }
.liste-ozet { color: var(--soluk); margin: 0 0 2rem; }
.kart { padding: 1.25rem 0; border-top: 1px solid var(--cizgi); }
.kart-baslik {
  display: block;
  font-size: 1.2rem;
  font-weight: 600;
  text-decoration: none;
  color: var(--metin);
  line-height: 1.35;
}
.kart-baslik:hover { color: var(--vurgu); }
.kart-meta, .yazi-meta {
  display: flex; flex-wrap: wrap; gap: .5rem; align-items: center;
  margin: .4rem 0; font-size: .82rem; color: var(--soluk);
  font-family: ui-sans-serif, system-ui, sans-serif;
}
.kart-ozet { margin: .35rem 0 0; color: var(--soluk); }
.etiket {
  text-decoration: none; color: var(--soluk);
  border: 1px solid var(--cizgi); border-radius: 999px;
  padding: .1rem .55rem; font-size: .75rem;
}
.etiket:hover { color: var(--vurgu); border-color: var(--vurgu); }

/* yazı */
.yazi h1 { font-size: 2rem; line-height: 1.22; margin: 1rem 0 .4rem; }
.yazi h2 { font-size: 1.4rem; margin: 2.2rem 0 .6rem; line-height: 1.3; }
.yazi h3 { font-size: 1.15rem; margin: 1.8rem 0 .5rem; }
.yazi p { margin: 0 0 1.1rem; }
.yazi img { max-width: 100%; height: auto; border-radius: 6px; }
.yazi blockquote {
  margin: 1.4rem 0; padding: .1rem 0 .1rem 1.1rem;
  border-left: 3px solid var(--vurgu); color: var(--soluk);
}
.yazi hr { border: 0; border-top: 1px solid var(--cizgi); margin: 2.4rem 0; }
.yazi code {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: .86em; background: var(--kutu);
  border: 1px solid var(--cizgi); border-radius: 4px; padding: .08em .35em;
}
.yazi pre {
  background: var(--kutu); border: 1px solid var(--cizgi); border-radius: 8px;
  padding: .9rem 1rem; overflow-x: auto;
}
.yazi pre code { background: none; border: 0; padding: 0; font-size: .82rem; }

/* tablolar — raporlar tablo dolu, yatayda taşarsa kendi içinde kaysın */
.tablo-sar { overflow-x: auto; margin: 1.4rem 0; }
.tablo-sar table { border-collapse: collapse; width: 100%; font-size: .9rem; }
.tablo-sar th, .tablo-sar td {
  border: 1px solid var(--cizgi); padding: .45rem .7rem; text-align: left;
  vertical-align: top;
}
.tablo-sar th { background: var(--kutu); font-weight: 600; }

/* reklam — içerikten görsel olarak ayrı dursun */
.reklam { margin: 2rem 0; min-height: 1px; }

.alt {
  max-width: 46rem; margin: 0 auto; padding: 1.5rem 1.25rem 3rem;
  border-top: 1px solid var(--cizgi); color: var(--soluk);
  font-size: .85rem; font-family: ui-sans-serif, system-ui, sans-serif;
}
.alt p { margin: .3rem 0; }

/* Gömülü raporlar: kendi <style>'ıyla gelen tam sayfa HTML çıktıları.
   body/html kuralları build.py tarafından .gomulu'ya yeniden yazılır, o yüzden
   burada sadece kabın makul davranmasını sağlıyoruz. */
.gomulu { margin-top: 1.5rem; }
.gomulu img { max-width: 100%; height: auto; }
.gomulu table { max-width: 100%; }
/* Rapor genelde kendi arka planını/dolgusunu taşır; arşiv gövdesinin
   okuma genişliğini aşmasın diye taşan içerik kendi içinde kayar. */
.gomulu { overflow-x: auto; }

/* --- Reklam yerleşimleri ---------------------------------------------------
   Duyarlı birimler akışın içinde; sabit boyutlu olanlar yalnız sığdıkları
   ekranda RENDER EDİLİR. Gizlemek yerine sığmayan ekranda hiç basmamak
   bilinçli: görünmeyen bir birimi push etmek görüntülenmeyen bir reklama
   gösterim yazar (build.py::reklam_itme bunu genişliğe bakarak engeller). */
.reklam-yatay { margin: 1.75rem 0 2rem; }
.reklam-kare  { margin: 2.5rem 0 1rem; }

/* 728x90 sabit: mobilde satır taşırır, o yüzden yalnız masaüstünde. */
.reklam-tabela { display: none; }
@media (min-width: 800px) {
  .reklam-tabela { display: block; margin: 2.5rem auto 0; text-align: center; }
}

/* Dikey birim: içerik sütunu 46rem, yanında yer kalan geniş ekranlarda
   sabit bir rayda durur; dar ekranda hiç görünmez (okuma akışını bölmez). */
.reklam-kenar { display: none; }
@media (min-width: 1240px) {
  .reklam-kenar {
    display: block; position: fixed; top: 7rem; right: 2.5rem;
    width: 160px; max-height: 600px;
  }
}