/* =====================================================================
 EGZERSİZ KÜTÜPHANESİ — DadaFit liste/filtre sayfası
 Chrome (token+topbar+header+drawer+bottom-nav+footer+modal+JS) hub'dan
 BİREBİR taşındı (dadafit-hub-v1.html). DadaFit recolor: --fit → #009d4f.
 Sayfa içeriği "SAYFA CSS" altına eklendi. Mega menü/chrome KİLİTLİ.
 ===================================================================== */

/* =====================================================================
 SAYFA CSS — EGZERSİZ KÜTÜPHANESİ
 ===================================================================== */
:root{
  --fit:var(--marka);          /* DadaFit aksanı (Pantone 7482 C) */
  --fit-deep:var(--marka-koyu);     /* hover / gradient ucu */
  --fit-tint:var(--marka-yikama-2);     /* yumuşak yeşil yıkama */
  --fit-line:var(--marka-cizgi);     /* yeşil-nötr hairline */
  --fit-bright:var(--marka-parlak);   /* koyu zeminde okunur aksan metni */
  --fit-dark:#211E16;     /* vurgu/hero zemini */
}
.sec-fit .eyebrow{color:var(--fit-deep)}
.sec-fit .eyebrow::before{background:var(--fit)}

/* ---- ÜST PANEL: koyu band + breadcrumb + başlık + arama (signature carry-over) ---- */
.lib-top{
  position:relative;overflow:hidden;margin-top:112px;
  /* hub df-hero-media deseni: desatüre görsel + koyu gradient overlay (metin solda okunur, görsel sağda belirir) */
  background:
    radial-gradient(820px 360px at 84% 14%,color-mix(in srgb, var(--marka) 20%, transparent),transparent 62%),
    linear-gradient(90deg,rgba(33,30,22,.94) 0%,rgba(29,26,20,.82) 46%,rgba(27,25,19,.74) 100%),
    linear-gradient(180deg,rgba(33,30,22,0) 58%,rgba(24,22,16,.62) 100%),
    url('https://images.unsplash.com/photo-1534438327276-14e5300c3a48?w=1680&q=80&auto=format&fit=crop&exp=7&gam=6&sat=-16') center 26%/cover no-repeat,
    #1b1913;
  padding:40px 0 38px;
}
.lib-top .wrap{position:relative;z-index:2}
.lib-crumb{display:flex;align-items:center;gap:9px;font-size:12.5px;font-weight:600;color:rgba(255,255,255,.6);margin-bottom:18px}
.lib-crumb a{color:rgba(255,255,255,.6);transition:color .2s var(--ease)}
.lib-crumb a:hover{color:#fff}
.lib-crumb i{font-size:9px;color:rgba(255,255,255,.34)}
.lib-crumb .cur{color:var(--fit-bright)}
.lib-top .eyebrow{color:var(--fit-bright)}
.lib-top .eyebrow::before{background:var(--fit-bright)}
.lib-top h1{color:#fff;font-size:39px;letter-spacing:-.02em;margin:14px 0 10px;max-width:680px}
.lib-top .lib-sub{color:rgba(255,255,255,.78);font-size:15.5px;font-weight:500;max-width:560px;line-height:1.55}
/* arama input — cam panel */
.lib-search{
  display:flex;align-items:center;gap:12px;margin-top:24px;max-width:520px;
  background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  border-radius:var(--radius-md);padding:4px 4px 4px 18px;
  transition:border-color .2s var(--ease),background .2s var(--ease);
}
.lib-search:focus-within{border-color:var(--fit-bright);background:rgba(255,255,255,.14)}
.lib-search i{color:rgba(255,255,255,.62);font-size:15px;flex:none}
.lib-search input{
  flex:1;min-width:0;background:none;border:none;outline:none;
  font-family:inherit;font-size:14.5px;font-weight:500;color:#fff;padding:11px 0;
}
.lib-search input::placeholder{color:rgba(255,255,255,.5)}
.lib-search button{
  flex:none;font-family:inherit;font-size:13.5px;font-weight:700;color:#fff;
  background:var(--fit);border:none;border-radius:var(--radius-sm);padding:0 18px;height:42px;cursor:pointer;
  transition:background .2s var(--ease);
}
.lib-search button:hover{background:var(--fit-deep)}
/* üst panel hızlı istatistik şeridi */
.lib-stats{display:flex;align-items:center;gap:26px;margin-top:24px;flex-wrap:wrap}
.lib-stat{display:flex;align-items:baseline;gap:8px}
.lib-stat b{font-size:20px;font-weight:800;color:#fff;letter-spacing:-.01em}
.lib-stat span{font-size:12.5px;font-weight:600;color:rgba(255,255,255,.62)}

/* ---- FİLTRE RAYI (sticky) — df-fchip dili ---- */
.lib-body{padding:var(--sec-pad-sm) 0 var(--sec-pad);background:var(--bg-white)}
.lib-filters{
  position:sticky;top:112px;z-index:40;
  background:rgba(255,255,255,.92);
  -webkit-backdrop-filter:saturate(150%) blur(8px);backdrop-filter:saturate(150%) blur(8px);
  border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:18px 20px 16px;margin-bottom:28px;box-shadow:var(--sh-sm);
}
.fgroup{display:flex;align-items:center;flex-wrap:wrap;gap:9px;padding:7px 0}
.fgroup+.fgroup{border-top:1px solid var(--line);margin-top:3px;padding-top:13px}
.fgroup .lbl{
  font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--muted);min-width:96px;flex:none;
}
.df-fchip{font-size:13px;font-weight:600;color:var(--slate);background:var(--paper);border:1px solid var(--line);padding:9px 16px;border-radius:var(--radius-sm);cursor:pointer;transition:.18s var(--ease);display:inline-flex;align-items:center;gap:7px}
.df-fchip i{font-size:12px;opacity:.8}
.df-fchip:hover{border-color:var(--fit);color:var(--fit-deep);background:var(--fit-tint)}
.df-fchip.on{border-color:var(--fit);color:#fff;background:var(--fit)}
.df-fchip.on i{opacity:1}
/* filtre rayı alt aksiyonu — temizle */
.fclear{
  margin-left:auto;font-size:12.5px;font-weight:700;color:var(--muted);
  background:none;border:none;cursor:pointer;display:inline-flex;align-items:center;gap:7px;
  padding:9px 6px;transition:color .2s var(--ease);
}
.fclear:hover{color:var(--fit-deep)}

/* ---- SONUÇ ÇUBUĞU: sayı + sıralama ---- */
.lib-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:22px;flex-wrap:wrap}
.lib-count{font-size:14px;font-weight:600;color:var(--slate-2)}
.lib-count b{color:var(--slate);font-weight:800}
/* ---- R8/20 · SAYININ SOLUNDAKİ DİKEY AYRAÇ KALDIRILDI ----
   Ayraç kabuğun genel filtre çubuğundan geliyor
   (`fit-shell.css` → `.ff-bar .ff-count::before`, 1px × 20px `--line`).
   Çubuk zaten `justify-content:space-between` ile iki uca yaslı: solda
   filtre açılırları, sağda sayı + sıralama. Ayraç ayırdığı iki grup
   arasında zaten 16px boşluk varken ikinci bir sınır çiziyor ve sayıyı
   sıralama düğmelerinden koparmak yerine onlara yapıştırıyordu.
   Kural KABUKTA (7 sayfada geçerli) — burada yalnız bu sayfa için
   kapatıldı; kabuk dosyası R8'de AJAN-A'nın kapsamında. */
/* R8 · yerel ezme KALDIRILDI (lead, birleştirme): kabuktaki
   `.ff-bar .ff-count::before` kuralı Beyar kararıyla 7 sayfadan birden
   silindi, ezilecek bir şey kalmadı. Ölü CSS bırakılmadı. */
/* Sağlık notunun gövdesi kademe düşmez — gerekçe egzersiz-detay-v1 ile aynı
   (kardeş marka `.reh-note` tek kademe; kalıcı güvenlik bilgisi ikincil
   tipografiye inmez). */
.lib-guide .note-more{font-size:14px;color:var(--slate-2)}
.lib-sort{display:flex;align-items:center;gap:8px}
.lib-sort .lbl{font-size:12.5px;font-weight:600;color:var(--muted)}
.sort-seg{display:inline-flex;background:var(--bg);border:1px solid var(--line);border-radius:var(--radius-md);padding:3px}
.sort-seg button{
  font-family:inherit;font-size:13px;font-weight:700;color:var(--slate-2);
  background:none;border:none;border-radius:var(--radius-sm);padding:8px 15px;cursor:pointer;
  transition:.18s var(--ease);
}
.sort-seg button:hover{color:var(--fit-deep)}
.sort-seg button.on{background:var(--fit);color:#fff}

/* ---- EGZERSİZ KART GRID'İ — full-görsel kart (hub-card dili) ---- */
.lib-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.ex-media{position:relative;height:188px;background-size:cover;background-position:center}
.ex-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(33,30,22,0) 48%,rgba(20,18,12,.58))}
/* kas grubu etiketi (sol üst) */
.ex-cat{position:absolute;top:12px;left:12px;z-index:2;background:var(--fit);color:#fff;font-size:11.5px;font-weight:700;padding:6px 12px;border-radius:var(--radius-sm);letter-spacing:.02em}
/* seviye rozeti (sağ üst) — yoğunluk pip'leri: dolu pip yeşil, boş pip nötr
 (aksan SADECE #009d4f; seviye sarı/kırmızı kodlaması YOK) */
/* ZORLUK ROZETİ SAĞ ALTA TAŞINDI (R16/1).
   ÖLÇÜLEN KUSUR: rozet `top:12px;right:12px`teydi ve kaydet düğmesi
   (`.kyt-btn`, `top:8px;right:8px`, 44×44) R15'te tam oraya eklendi.
   Üst üste bindiler: kesişim **1162 px²**, üç genişlikte de (1440·1024·390),
   bu sayfada 12 kartın 12'sinde. Düğme z-index 4'te olduğu için rozetin
   üstünü kapatıyordu — seviye okunmuyordu.
   Sağ alt köşe boştu (sol altta `.ex-tags` var), rozet oraya alındı.
   Kural artık kitte: docs/fit-kit.md §12 · kart üstü öğe yerleşimi. */
.ex-level{position:absolute;bottom:12px;right:12px;z-index:2;display:inline-flex;align-items:center;gap:7px;background:rgba(255,255,255,.94);color:var(--slate);font-size:11px;font-weight:700;padding:6px 11px;border-radius:var(--radius-sm)}
.ex-pips{display:inline-flex;gap:3px}
.ex-pips i{width:6px;height:6px;border-radius:50%;background:#d6dad7;display:block}
.ex-level.lv1 .ex-pips i:nth-child(-n+1),
.ex-level.lv2 .ex-pips i:nth-child(-n+2),
.ex-level.lv3 .ex-pips i:nth-child(-n+3){background:var(--fit)}
/* DAR KOLONDA ROZET ALT SOLA, ETİKETLERİN ÜSTÜNE GEÇER (R16/1).
   ÖLÇÜM (768 px, kart ızgarası 3 kolon): görsel genişliği 222 px, en geniş
   `.ex-level` 103 px, en geniş `.ex-tags` 134 px. 103 + 134 + iki kenar
   boşluğu, 222 px'e SIĞMIYOR — yan yana durmaları geometrik olarak
   imkânsız, o yüzden burada bir hizalama ayarı değil bir YERLEŞİM
   değişikliği gerekiyor. Rozet alt sola, etiketlerin bir sıra üstüne
   çıkar; ikisi de tam okunur, hiçbir bilgi gizlenmez.
   1440 ve 1024'te yan yana sığıyor (ölçüldü: çakışma 0), orada
   değişiklik yok. */
@media (min-width:641px) and (max-width:900px){
  .ex-level{left:12px;right:auto;bottom:46px}
}

/* alt etiket: ekipman ikonu */
.ex-tags{position:absolute;bottom:12px;left:12px;z-index:2;display:flex;gap:6px;flex-wrap:wrap}
.ex-tag{display:inline-flex;align-items:center;gap:6px;background:rgba(20,18,12,.72);color:#fff;font-size:11px;font-weight:700;padding:6px 10px;border-radius:var(--radius-sm);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.ex-tag i{font-size:11px}
.ex-body{padding:16px 18px 18px;display:flex;flex-direction:column;flex:1}
.ex-body h3{font-size:16.5px;margin-bottom:6px;letter-spacing:-.01em;transition:color .2s var(--ease)}
.ex-card:hover .ex-body h3{color:var(--fit-deep)}
.ex-body p{font-size:13px;color:var(--muted);font-weight:500;line-height:1.5}
.ex-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;padding-top:14px;margin-top:16px;border-top:1px solid var(--line);font-size:12.5px;color:var(--muted);font-weight:500}
.ex-foot .meta{display:inline-flex;align-items:center;gap:6px}
.ex-foot .go{display:inline-flex;align-items:center;gap:7px;color:var(--fit-deep);font-weight:700}
.ex-foot .go i{transition:transform .2s var(--ease)}
.ex-card:hover .ex-foot .go i{transform:translateX(3px)}

/* ---- DAHA FAZLA YÜKLE ---- */
/* ÖLÜ KURALLAR — R11/M6'da "Daha fazla yükle" bloğu kaldırıldı, yerine
   kabuktaki gerçek sayfalama geldi. Kurallar SİLİNMEDİ (kabuk sözleşmesi:
   ölü kural silinmez, kütüğe yazılır — kütük tasks/REVIZYON-11.md M6). */
.lib-more{display:flex;flex-direction:column;align-items:center;gap:14px;margin-top:40px}
.lib-more .btn-more{
  display:inline-flex;align-items:center;gap:10px;font-family:inherit;font-size:14.5px;font-weight:700;
  color:var(--slate);background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-md);
  padding:14px 30px;cursor:pointer;transition:.22s var(--ease);
}
.lib-more .btn-more:hover{border-color:var(--fit);color:var(--fit-deep);transform:translateY(-2px)}
.lib-more .btn-more i{color:var(--fit)}
.lib-more .more-note{font-size:12.5px;font-weight:500;color:var(--muted)}

/* boş durum (filtre eşleşmezse) */
/* §D2 (Dalga 4) — bu sayfa kabuktaki `.lib-empty` kuralının ESKİ hâlinin
   birebir kopyasını taşıyordu ve kabuğu eziyordu. Kopya kaldırıldı; kit
   artık tek yerden, `fit-shell.css`ten geliyor. */

/* ===================== SAYFA RESPONSIVE ===================== */
@media (max-width:1024px){
  .lib-top{margin-top:112px}
  .lib-filters{top:112px}
  .lib-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .lib-top h1{font-size:33px}
  .fgroup .lbl{min-width:88px}
}
@media (max-width:760px){
  .lib-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .lib-top{margin-top:62px;padding:30px 0 30px}
  .lib-top h1{font-size:27px}
  .lib-top .lib-sub{font-size:14px}
  .lib-search{max-width:none}
  .lib-stats{gap:18px;margin-top:20px}
  .lib-stat b{font-size:18px}
  .lib-body{padding:var(--sec-pad-sm) 0 var(--sec-pad)}
  /* sticky filtre bar mobilde tek satır yatay kaydır */
  .lib-filters{top:62px;padding:14px 14px 12px}
  .fgroup{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:5px}
  .fgroup::-webkit-scrollbar{display:none}
  .fgroup .lbl{position:sticky;left:0;background:rgba(255,255,255,.96);min-width:auto;padding-right:6px;z-index:1}
  .df-fchip{flex:none;white-space:nowrap}
  .fclear{flex:none}
  .lib-bar{margin-bottom:18px}
  .lib-sort{width:100%;justify-content:space-between}
  .sort-seg button{padding:8px 12px;font-size:12.5px}
  .lib-grid{grid-template-columns:1fr 1fr;gap:14px}
  .ex-media{height:148px}
  .ex-body{padding:13px 14px 15px}
  .ex-body h3{font-size:15px}
}
@media (max-width:400px){
  .lib-grid{grid-template-columns:1fr}
  .ex-media{height:200px}
}

/* ============ KABUK: topbar social + acct-pro + gw imza (hub parite) ============ */