/* ==========================================================================
   CSKEDPEDIA — base.css
   Her sayfada yüklenen ortak dosya.
   Renkler, yazı tipleri ve bütün sayfalarda tekrar eden parçalar burada.
   Bir rengi buradan değiştirirsen bütün site birden değişir.
   ========================================================================== */

:root{
  /* --- MARKA RENKLERİ (logolardan ölçüldü, değiştirme) --- */
  --lacivert:      #0C205B;   /* aile laciverti */
  --turkuaz:       #0098A2;   /* CSKEDPEDIA vurgusu */
  --bordo:         #8E1B3C;   /* ED imzası — açık zeminde */
  --bordo-acik:    #E24C74;   /* ED imzası — koyu zeminde */
  --mercan:        #FC5E30;   /* CSKDINE vurgusu */

  /* --- CSKDINE sayfa zemini --- */
  --bg:            #070C16;
  --bg-grad:       radial-gradient(120% 80% at 50% -10%, #14243C 0%, #0A1120 60%, #070C16 100%);
  --panel:         rgba(255,255,255,.045);
  --panel-solid:   #0E1626;

  /* --- yazı renkleri --- */
  --ink:           #E7EDF7;
  --ink-2:         #7F92B0;
  --ink-3:         #8FA3C2;

  /* --- vurgu (CSKDINE sayfalarında mercan) --- */
  --vurgu:         var(--mercan);
  --vurgu-dim:     rgba(252,94,48,.15);
  --vurgu-ink:     #1A0B04;   /* mercan üstüne yazı */

  /* --- çizgiler --- */
  --line:          rgba(255,255,255,.12);
  --line-soft:     rgba(255,255,255,.08);

  /* --- ölçüler --- */
  --max:           560px;
  --safe-t:        env(safe-area-inset-top, 0px);
  --safe-b:        env(safe-area-inset-bottom, 0px);

  /* --- yazı tipleri --- */
  --font-marka:    "Outfit", "Manrope", system-ui, sans-serif;  /* logo ve marka */
  --font-baslik:   "Instrument Serif", Georgia, serif;          /* kitap dünyası */
  --font-metin:    "Manrope", system-ui, -apple-system, sans-serif;
}

*{ box-sizing: border-box }
html, body{ margin:0; padding:0 }

body{
  min-height: 100dvh;
  background: var(--bg);
  background-image: var(--bg-grad);
  background-attachment: fixed;
  color: var(--ink);
  font-family: var(--font-metin);
  font-size: 14px;
  line-height: 1.45;
  -webkit-font-smoothing: antialiased;
  overscroll-behavior-y: none;
}
body.kilitli{ overflow: hidden }

img{ display:block; max-width:100% }
a{ color: inherit; text-decoration: none }
button{
  font: inherit; color: inherit; background: none; border: 0;
  padding: 0; cursor: pointer; text-align: left;
}
:focus-visible{ outline: 2px solid var(--vurgu); outline-offset: 3px; border-radius: 6px }

@media (prefers-reduced-motion: reduce){
  *{ transition: none !important; scroll-behavior: auto !important }
}

.kapsayici{ max-width: var(--max); margin: 0 auto }


/* ==========================================================================
   MARKA YAZISI — CSKEDPEDIA
   ED bordo, A harfi logodaki gibi çubuksuz (Λ).
   Kullanımı:
     <span class="marka"><span class="n">CSK</span><span class="b">ED</span>
     <span class="t">PEDI</span><svg class="lam t" ...>…</svg></span>
   Koyu zeminde .marka.acik ekle.
   ========================================================================== */
.marka{
  font-family: var(--font-marka);
  font-weight: 500; letter-spacing: .055em; white-space: nowrap;
  display: inline-flex; align-items: baseline;
}
.marka .n{ color: var(--lacivert) }
.marka .t{ color: var(--turkuaz) }
.marka .b{ color: var(--bordo) }
.marka.acik .n{ color: #FFFFFF }
.marka.acik .b{ color: var(--bordo-acik) }
.marka.acik .t{ color: #2CC6CE }
.marka .lam{ height:.72em; width:.62em; flex:0 0 auto; align-self:baseline; margin-left:-.02em }
.marka .lam path{ stroke: currentColor; stroke-width: 11; fill: none }

/* alt markaların altındaki imza satırı */
.imza-satiri{
  font-family: var(--font-marka); font-size: 10.5px; letter-spacing: .1em;
  color: var(--ink-2); display: inline-flex; align-items: baseline; gap: .5em;
}
.imza-satiri .marka{ font-size: 11.5px; letter-spacing: .09em }


/* ==========================================================================
   KATMANLAR (sheet) — kitap listesi ve sohbet paneli
   ========================================================================== */
.katman{
  position: fixed; inset: 0; z-index: 100;
  background: var(--bg); background-image: var(--bg-grad);
  display: flex; flex-direction: column;
  transform: translateY(100%);
  transition: transform .34s cubic-bezier(.32,.72,0,1);
  visibility: hidden;
}
.katman.acik{ transform: none; visibility: visible }

.katman-baslik{
  display: flex; align-items: center; gap: 12px;
  padding: calc(14px + var(--safe-t)) 16px 14px;
  border-bottom: 1px solid var(--line-soft);
  background: rgba(10,17,32,.7);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
}
.katman-baslik h2{ font-size: 13px; font-weight: 700; margin: 0 }

.yuvarlak-dugme{
  width: 34px; height: 34px; flex: 0 0 34px;
  border-radius: 50%; background: rgba(255,255,255,.06);
  border: 1px solid var(--line);
  display: grid; place-items: center; font-size: 15px;
}
.katman-govde{ flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch }


/* ==========================================================================
   KİTAP LİSTESİ SATIRI
   ========================================================================== */
.liste{ padding: 8px 0 40px }
.liste-grup{
  font-size: 10px; letter-spacing: .2em; text-transform: uppercase;
  color: var(--vurgu); font-weight: 800; padding: 22px 22px 10px;
}
.satir{ display: flex; align-items: center; gap: 14px; padding: 9px 22px; width: 100% }
.satir:active{ background: rgba(255,255,255,.04) }
.satir img{
  width: 46px; height: 72px; flex: 0 0 46px;
  object-fit: cover; border-radius: 3px; box-shadow: 0 6px 14px -7px #000;
}
.satir b{ display:block; font-size: 13px; font-weight: 600; line-height: 1.35 }
.satir small{ font-size: 11px; color: var(--ink-2) }
.satir i{ margin-left: auto; font-style: normal; color: #5C6E8C }


/* ==========================================================================
   SOHBET PANELİ
   Şimdilik boş. Yapay zekâ bağlantısı assets/js/sohbet.js içine gelecek.
   ========================================================================== */
.sohbet-govde{
  flex: 1; display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  padding: 40px 32px; text-align: center; gap: 16px;
}
.sohbet-govde p{ margin: 0; font-family: var(--font-baslik); font-size: 23px }
.sohbet-govde small{ font-size: 12px; line-height: 1.6; color: var(--ink-2); max-width: 34ch }

.sohbet-alt{
  border-top: 1px solid var(--line-soft);
  padding: 12px 20px calc(18px + var(--safe-b));
}
.sohbet-form{
  display: flex; align-items: center; gap: 10px;
  max-width: var(--max); margin: 0 auto;
  padding: 5px 5px 5px 17px; border-radius: 999px;
  background: rgba(255,255,255,.07); border: 1px solid var(--line);
}
.sohbet-form input{
  flex: 1; min-width: 0; border: 0; background: none;
  font: inherit; font-size: 13.5px; color: var(--ink); padding: 8px 0;
}
.sohbet-form input::placeholder{ color: var(--ink-2) }
.sohbet-form input:focus{ outline: none }
.sohbet-form button{
  flex: 0 0 38px; width: 38px; height: 38px; border-radius: 50%;
  background: var(--vurgu); color: #FFF;
  display: grid; place-items: center; font-size: 15px; font-weight: 800;
}


/* ==========================================================================
   İMZA — sayfa sonundaki alıntı
   ========================================================================== */
.imza{ padding: 34px 26px 8px; text-align: center; color: var(--ink-2) }
.imza p{
  margin: 0; font-family: var(--font-baslik); font-style: italic;
  font-size: 17px; line-height: 1.5;
}
.imza small{
  display: block; margin-top: 10px;
  font-size: 10px; letter-spacing: .18em; text-transform: uppercase;
}


/* ==========================================================================
   CSKDINE marka kilidi — sayfa sonundaki "CSKDINE by CSKEDPEDIA"
   ========================================================================== */
.marka-alt{
  margin: 26px 0 0 !important; display: flex; flex-direction: column;
  align-items: center; gap: 7px;
}
.cskdine{
  font-family: var(--font-marka); font-size: 15px; font-weight: 600;
  letter-spacing: .13em; color: var(--mercan);
}
.ust-etiket .cskdine{ font-size: inherit; letter-spacing: .2em; font-weight: 700 }