/* ─── PROGRESSIVE OVERLOAD RADAR ─── */
.overload-section{
  padding:18px;
  background:linear-gradient(135deg,rgba(200,245,49,.04),rgba(255,255,255,.015));
  border:1px solid rgba(200,245,49,.2);
  border-radius:16px;
  margin-bottom:24px;
  /* SCALING FIX — tam ekranda devasa büyümesin, ortalansın */
  max-width:1100px;
  margin-left:auto;
  margin-right:auto;
}
.overload-head{
  display:flex;align-items:center;justify-content:space-between;
  gap:12px;flex-wrap:wrap;
  margin-bottom:16px;
  padding-bottom:14px;
  border-bottom:1px solid var(--border);
}
.overload-title{
  font-size:1.05rem;font-weight:900;color:var(--text-primary);
  letter-spacing:-0.3px;
}
.overload-sub{
  font-size:.74rem;color:var(--text-dim);font-weight:600;
  margin-top:3px;letter-spacing:.2px;
}
.overload-tabs{
  display:inline-flex;
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:10px;
  padding:3px;
  gap:2px;
}
.overload-tab{
  padding:6px 14px;
  font-family:inherit;
  font-size:.76rem;font-weight:700;
  background:transparent;border:none;
  color:var(--text-secondary);
  cursor:pointer;
  border-radius:8px;
  transition:background .15s,color .15s;
  -webkit-tap-highlight-color:transparent;
}
.overload-tab:hover{color:var(--text-primary)}
.overload-tab:focus,.overload-tab:focus-visible{outline:none;box-shadow:none}
.overload-tab.active{
  background:rgba(200,245,49,.15);
  color:var(--accent);
}

.overload-empty{
  padding:32px 18px;
  text-align:center;
  display:flex;flex-direction:column;align-items:center;gap:8px;
}
.overload-empty-icon{font-size:2.2rem;opacity:.4;margin-bottom:4px}
.overload-empty-title{
  font-size:.92rem;font-weight:700;color:var(--text-secondary);
  letter-spacing:-0.2px;
}
.overload-empty-sub{
  font-size:.78rem;color:var(--text-dim);font-weight:500;
  line-height:1.55;max-width:380px;
}

.overload-cards{display:flex;flex-direction:column;gap:12px}
.overload-card{
  background:rgba(255,255,255,.025);
  border:1px solid var(--border);
  border-radius:12px;
  padding:14px;
}
.overload-card-head{
  display:flex;align-items:center;justify-content:space-between;
  gap:12px;flex-wrap:wrap;
  margin-bottom:12px;
}
.overload-card-name{
  font-size:.95rem;font-weight:800;color:var(--text-primary);
  letter-spacing:-0.2px;
  flex:1;min-width:0;
}
.overload-trend{
  font-size:.74rem;font-weight:800;
  padding:5px 11px;border-radius:8px;
  letter-spacing:.2px;
  white-space:nowrap;
}
.overload-trend-up{
  background:rgba(16,185,129,.12);
  color:var(--green,#34d399);
  border:1px solid rgba(16,185,129,.3);
}
.overload-trend-down{
  background:rgba(255,80,80,.1);
  color:var(--red,#ff5050);
  border:1px solid rgba(255,80,80,.3);
}
.overload-trend-flat{
  background:rgba(255,255,255,.04);
  color:var(--text-secondary);
  border:1px solid var(--border);
}

.overload-card-stats{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:8px;
  margin-bottom:12px;
  padding:10px;
  background:rgba(0,0,0,.18);
  border-radius:10px;
}
.overload-stat{text-align:center}
.overload-stat-label{
  font-size:.65rem;font-weight:700;color:var(--text-dim);
  text-transform:uppercase;letter-spacing:.5px;
  margin-bottom:4px;
}
.overload-stat-val{
  font-size:1.05rem;font-weight:900;color:var(--text-primary);
  letter-spacing:-0.3px;
}

.overload-day-list{
  display:flex;flex-direction:column;gap:1px;
  background:var(--border);
  border:1px solid var(--border);
  border-radius:10px;
  overflow:hidden;
}
.overload-day-row{
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:14px;
  align-items:center;
  padding:10px 14px;
  background:var(--bg-card);
  font-size:.82rem;
  transition:background .15s;
}
.overload-day-row.is-peak{
  background:linear-gradient(90deg,rgba(200,245,49,.08),rgba(200,245,49,.02));
}
.overload-day-label{
  font-weight:700;color:var(--text-secondary);
  letter-spacing:.1px;font-size:.78rem;
  min-width:64px;
}
.overload-day-weight{
  font-weight:900;color:var(--text-primary);
  font-size:.98rem;letter-spacing:-0.3px;
}
.overload-day-row.is-peak .overload-day-weight{color:var(--accent)}
.overload-day-meta{
  font-size:.72rem;color:var(--text-dim);font-weight:600;
  letter-spacing:.2px;text-align:right;
}

/* ─── VIEW TOGGLE: Liste / Analiz Ekranı ─── */
.overload-view-toggle{
  display:flex;
  gap:6px;
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:11px;
  padding:4px;
  margin-bottom:14px;
}
.overload-view-btn{
  flex:1;
  padding:9px 14px;
  font-family:inherit;
  font-size:.78rem;font-weight:700;
  background:transparent;
  border:none;
  color:var(--text-secondary);
  cursor:pointer;
  border-radius:8px;
  transition:background .15s,color .15s;
  -webkit-tap-highlight-color:transparent;
  letter-spacing:.1px;
}
.overload-view-btn:hover{color:var(--text-primary)}
.overload-view-btn:focus,.overload-view-btn:focus-visible{outline:none;box-shadow:none}
.overload-view-btn.active{
  background:rgba(200,245,49,.15);
  color:var(--accent);
  font-weight:800;
}

/* ─── SESSION-BASED HIERARCHY (Madde 3) — accordion behaviour ─── */
.overload-sessions{display:flex;flex-direction:column;gap:10px}
.overload-session{
  background:rgba(255,255,255,.025);
  border:1px solid var(--border);
  border-radius:12px;
  overflow:hidden;
  transition:border-color .15s,background .15s;
}
.overload-session.is-open{
  border-color:rgba(200,245,49,.22);
  background:rgba(200,245,49,.025);
}
.overload-session-head{
  display:flex;align-items:center;justify-content:space-between;
  gap:12px;
  padding:13px 16px;
  cursor:pointer;
  user-select:none;
  -webkit-tap-highlight-color:transparent;
  transition:background .15s;
}
.overload-session-head:hover{background:rgba(255,255,255,.02)}
.overload-session-head-left{
  flex:1;min-width:0;
  display:flex;flex-direction:column;gap:3px;
}
.overload-session-head-right{
  display:flex;align-items:center;gap:10px;
  flex-shrink:0;
}
.overload-session-day{
  font-size:.86rem;font-weight:800;color:var(--text-primary);
  letter-spacing:-0.2px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.overload-session-time{
  font-size:.7rem;font-weight:700;color:var(--text-dim);
  background:rgba(255,255,255,.04);
  border:1px solid var(--border);
  border-radius:8px;
  padding:3px 9px;
  letter-spacing:.3px;
  white-space:nowrap;
}
.overload-session-program{
  font-size:.74rem;font-weight:700;
  color:var(--accent);
  letter-spacing:.1px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.overload-session-chevron{
  font-size:.85rem;color:var(--text-dim);
  transition:transform .22s;
  display:inline-block;
}
.overload-session.is-open .overload-session-chevron{
  transform:rotate(180deg);
  color:var(--accent);
}
.overload-session-body{
  padding:0 14px 14px;
  display:flex;flex-direction:column;gap:10px;
  border-top:1px solid var(--border);
  padding-top:12px;
}

/* Egzersiz bloğu (session içinde) */
.overload-ex-block{
  background:rgba(0,0,0,.18);
  border:1px solid var(--border);
  border-radius:11px;
  padding:11px 12px;
}
.overload-ex-head{
  display:flex;align-items:center;justify-content:space-between;
  gap:10px;flex-wrap:wrap;
  margin-bottom:8px;
  padding-bottom:8px;
  border-bottom:1px dashed rgba(255,255,255,.06);
}
.overload-ex-name{
  font-size:.9rem;font-weight:800;color:var(--text-primary);
  letter-spacing:-0.2px;
  flex:1;min-width:0;
}
.overload-ex-meta{
  font-size:.7rem;font-weight:700;color:var(--text-dim);
  letter-spacing:.2px;
  white-space:nowrap;
}

/* TÜM SETLER görünür (Madde 2) */
.overload-set-list{
  display:flex;flex-direction:column;gap:4px;
}
.overload-set-row{
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:14px;
  align-items:center;
  padding:7px 10px;
  background:rgba(255,255,255,.02);
  border-radius:8px;
  font-size:.82rem;
}
.overload-set-num{
  font-size:.66rem;font-weight:800;color:var(--text-dim);
  letter-spacing:.5px;
  min-width:48px;
}
.overload-set-weight{
  font-weight:900;color:var(--text-primary);
  font-size:.92rem;letter-spacing:-0.3px;
}
.overload-set-reps{
  font-size:.7rem;color:var(--text-dim);font-weight:600;
  letter-spacing:.2px;text-align:right;
}

/* ═══════════════════════════════════════════════════════════════
   ANALİZ EKRANI — 3-SAYFALI HİYERARŞİ (Sprint refactor)
   ═══════════════════════════════════════════════════════════════
   Sayfa 1: cat-select (Üst Vücut + Alt Vücut başlıkları, kategori kartları)
   Sayfa 2: cat-detail (büyük hero + alt-grup buton listesi)
   Sayfa 3: analysis-detail-screen (mevcut — grafik + egzersiz + V-Slope)
   ═══════════════════════════════════════════════════════════════ */

/* ─── SAYFA 1: KATEGORİ SEÇİM ─── */
.cat-select-wrap{
  display:flex;flex-direction:column;gap:18px;
  min-height:420px;
  /* Slide-in route animation — geri tuşuyla bu ekrana dönüldüğünde
     soldan kayarak gelir (kullanıcı "geri gittiğini" hisseder). */
  animation:routeSlideFromLeft .28s cubic-bezier(.22,.61,.36,1);
}
@keyframes routeSlideFromLeft{
  from{opacity:0;transform:translateX(-24px)}
  to{opacity:1;transform:translateX(0)}
}
.cat-region-block{
  display:flex;flex-direction:column;gap:12px;
}
/* Region head — solda büyük ikon (kompozisyon), sağda hizalı başlıklar.
   Bu, kullanıcının istediği "görsel-yazı hiyerarşisi": kompozisyon
   solda büyük ve belirgin, yazılar sağda okunabilir bloklar halinde. */
.cat-region-head{
  display:flex;align-items:center;gap:18px;
  padding:14px 18px;
  background:linear-gradient(135deg,rgba(200,245,49,.05),rgba(255,255,255,.015));
  border:1px solid rgba(200,245,49,.18);
  border-radius:14px;
  margin-bottom:2px;
}
.cat-region-icon{
  /* Region ikonu — kompozisyonun yer aldığı SOL ALAN, büyük ve nefes alan.
     Önceki 38px → 64px, yazıların solunda dominant duruyor ama hiyerarşiyi
     bozmuyor (yazılar hâlâ sağda hizalı). */
  width:64px;height:64px;
  display:flex;align-items:center;justify-content:center;
  border-radius:14px;
  background:rgba(0,0,0,.3);
  border:1px solid rgba(200,245,49,.3);
  color:var(--accent);
  flex-shrink:0;
}
.cat-region-icon svg{width:38px;height:38px;display:block}
.cat-region-titles{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.cat-region-title{
  font-size:1.05rem;font-weight:900;color:var(--text-primary);
  letter-spacing:-0.3px;
}
.cat-region-sub{
  font-size:.74rem;font-weight:700;color:var(--text-dim);
  letter-spacing:.3px;
  text-transform:uppercase;
}
.cat-region-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:10px;
}
.cat-card{
  display:flex;align-items:center;gap:18px;
  padding:18px;
  background:rgba(255,255,255,.025);
  border:1px solid var(--border);
  border-radius:14px;
  cursor:pointer;
  font-family:inherit;
  text-align:left;
  width:100%;
  /* Sabit min-height — kompozisyon (ikon) için yeterli alan, kart yüksekliği
     hep aynı (grid'te 1 satır boş kalsa bile düzen bozulmaz) */
  min-height:96px;
  transition:background .15s,border-color .15s,transform .1s;
  -webkit-tap-highlight-color:transparent;
  box-shadow:none;
  outline:none;
}
.cat-card:not(.is-empty):hover{
  background:rgba(200,245,49,.05);
  border-color:rgba(200,245,49,.32);
  transform:translateY(-1px);
}
.cat-card:not(.is-empty):active{transform:scale(.98)}
.cat-card:focus,.cat-card:focus-visible{outline:none;box-shadow:none}
.cat-card.is-empty{opacity:.5;cursor:not-allowed}
.cat-card-icon{
  /* Kart ikonu — kompozisyon alanı. 48px → 60px, sol tarafta dominant ama
     yazıları ezmeyen, dramatik kareli bir kompozisyon kutusu. */
  width:60px;height:60px;
  display:flex;align-items:center;justify-content:center;
  border-radius:14px;
  background:rgba(255,255,255,.04);
  border:1px solid var(--border);
  color:var(--text-secondary);
  flex-shrink:0;
  transition:background .15s,border-color .15s,color .15s,transform .15s;
}
.cat-card-icon svg{width:34px;height:34px;display:block}
.cat-card:not(.is-empty):hover .cat-card-icon{
  background:rgba(200,245,49,.12);
  border-color:rgba(200,245,49,.4);
  color:var(--accent);
  transform:scale(1.04);
}
.cat-card-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.cat-card-title{
  font-size:.96rem;font-weight:900;color:var(--text-primary);
  letter-spacing:-0.2px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.cat-card-sub{
  font-size:.72rem;font-weight:600;color:var(--text-dim);
  font-style:italic;
  letter-spacing:.2px;
}
.cat-card-meta{
  font-size:.7rem;font-weight:700;color:var(--text-secondary);
  letter-spacing:.2px;
  margin-top:3px;
}
.cat-card-empty-tag{
  font-size:.64rem;font-weight:700;color:var(--text-dim);
  text-transform:uppercase;letter-spacing:.4px;
  font-style:italic;
}
.cat-card-arrow{
  font-size:1.3rem;color:var(--text-dim);
  font-weight:300;
  flex-shrink:0;
  transition:transform .12s,color .12s;
}
.cat-card:not(.is-empty):hover .cat-card-arrow{
  color:var(--accent);
  transform:translateX(3px);
}

/* ─── SAYFA 2: KATEGORİ DETAY (DEVASA HERO + ALT GRUP BUTONLARI) ─── */
.cat-hero{
  display:flex;align-items:center;gap:28px;
  padding:32px 28px;
  background:var(--bg-card);
  border:1px solid rgba(200,245,49,.28);
  border-radius:20px;
  /* DEVASA hero — sol kompozisyon alanı için kocaman alan, native app
     hero card hissi. Önceki 140px → 280px. */
  min-height:280px;
  position:relative;
  overflow:hidden;
}
/* Dekoratif arka plan dokusu — kompozisyonu çerçeveler */
.cat-hero::before{
  content:'';
  position:absolute;
  top:-40px;right:-40px;
  width:240px;height:240px;
  border-radius:50%;
  background:transparent;
  pointer-events:none;
}
.cat-hero-icon{
  /* SOL KOMPOZİSYON ALANI — kocaman, dramatik, dominant.
     Önceki 96px → 180px (büyük tablet ve desktop için).
     Mobile'da otomatik küçülür (media query aşağıda). */
  width:180px;height:180px;
  display:flex;align-items:center;justify-content:center;
  border-radius:28px;
  background:
    linear-gradient(145deg,rgba(0,0,0,.4),rgba(0,0,0,.2));
  border:1px solid rgba(200,245,49,.35);
  color:var(--accent);
  flex-shrink:0;
  position:relative;
  z-index:1;
  /* İç gölge ile derinlik — kompozisyon "yerleşik" hissi */
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    inset 0 -2px 8px rgba(0,0,0,.3);
}
.cat-hero-icon svg{
  /* SVG ikonu kompozisyon alanını dolduran boyutta — küçük gözükmesin */
  width:120px;height:120px;
  display:block;
  /* Hafif drop shadow — kompozisyona derinlik */
  filter:drop-shadow(0 4px 12px rgba(200,245,49,.2));
}
.cat-hero-label{
  flex:1;min-width:0;
  position:relative;z-index:1;
  display:flex;flex-direction:column;gap:8px;
}
.cat-hero-title{
  /* Devasa başlık — hero hissi */
  font-size:2.2rem;font-weight:900;color:var(--text-primary);
  letter-spacing:-0.8px;
  line-height:1.05;
}
.cat-hero-sub{
  font-size:1rem;font-weight:600;color:var(--text-dim);
  font-style:italic;
  letter-spacing:.3px;
}
/* Mobile responsive — kompozisyon alanı küçülür ama hiyerarşi korunur */
@media (max-width:600px){
  .cat-hero{
    padding:22px 18px;
    gap:18px;
    min-height:200px;
  }
  .cat-hero-icon{
    width:120px;height:120px;
    border-radius:20px;
  }
  .cat-hero-icon svg{
    width:78px;height:78px;
  }
  .cat-hero-title{font-size:1.5rem;letter-spacing:-0.5px}
  .cat-hero-sub{font-size:.85rem}
}
/* Çok dar ekranlar — column layout (kompozisyon üstte, yazı altta) */
@media (max-width:380px){
  .cat-hero{
    flex-direction:column;
    text-align:center;
    align-items:center;
    min-height:auto;
    padding:24px 16px;
  }
}

/* Alt-grup buton listesi */
.subgroup-list{
  display:flex;flex-direction:column;gap:8px;
  /* Layout shift önleme — kategoriler arası geçişte (3 alt-grup vs 5 alt-grup
     olan kategoriler) sayfa yüksekliği zıplamasın. 5 satır × ~70px = ~350px
     rezerve. Boş satırlar görünmez ama alan korunur. */
  min-height:360px;
}
.subgroup-row{
  display:flex;align-items:center;gap:14px;
  width:100%;
  padding:14px 16px;
  background:rgba(0,0,0,.18);
  border:1px solid var(--border);
  border-radius:12px;
  cursor:pointer;
  font-family:inherit;
  text-align:left;
  transition:background .15s,border-color .15s,transform .1s;
  -webkit-tap-highlight-color:transparent;
  box-shadow:none;
  outline:none;
}
.subgroup-row:not(.is-empty):hover{
  background:rgba(200,245,49,.06);
  border-color:rgba(200,245,49,.32);
}
.subgroup-row:not(.is-empty):active{transform:scale(.99)}
.subgroup-row:focus,.subgroup-row:focus-visible{outline:none;box-shadow:none}
.subgroup-row.is-empty{opacity:.5;cursor:not-allowed}
.subgroup-row-icon{
  width:38px;height:38px;
  display:flex;align-items:center;justify-content:center;
  border-radius:10px;
  background:rgba(255,255,255,.04);
  border:1px solid var(--border);
  color:var(--text-secondary);
  flex-shrink:0;
  transition:background .15s,border-color .15s,color .15s;
}
.subgroup-row-icon svg{width:20px;height:20px;display:block}
.subgroup-row:not(.is-empty):hover .subgroup-row-icon{
  background:rgba(200,245,49,.1);
  border-color:rgba(200,245,49,.32);
  color:var(--accent);
}
.subgroup-row-body{flex:1;min-width:0}
.subgroup-row-title{
  font-size:.92rem;font-weight:800;color:var(--text-primary);
  letter-spacing:-0.2px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.subgroup-row-sub{
  font-size:.72rem;font-weight:600;color:var(--text-dim);
  font-style:italic;
  letter-spacing:.2px;
  margin-top:1px;
}
.subgroup-row-meta{
  display:flex;align-items:center;gap:10px;
  flex-shrink:0;
}
.subgroup-row-count{
  font-size:.7rem;font-weight:700;color:var(--text-secondary);
  letter-spacing:.1px;
  white-space:nowrap;
}
.subgroup-row-empty-tag{
  font-size:.64rem;font-weight:700;color:var(--text-dim);
  text-transform:uppercase;letter-spacing:.4px;
  font-style:italic;
}
.subgroup-row-arrow{
  font-size:1.15rem;color:var(--text-dim);
  font-weight:300;
  transition:transform .12s,color .12s;
}
.subgroup-row:not(.is-empty):hover .subgroup-row-arrow{
  color:var(--accent);
  transform:translateX(3px);
}

/* Breadcrumb içindeki ayraç */
.crumb-sep{
  color:var(--text-dim);
  margin:0 4px;
  font-weight:400;
}

/* ─── EGZERSİZ KÜTÜPHANESİ (kategori detay altında) ─── */
/* ═══════════════════════════════════════════════════════════════
   RADAR SESSION MODAL (RSM) — Excel/Data Grid Detayı
   ═══════════════════════════════════════════════════════════════
   Tam-ekran modal — günlük antrenman detayını Excel benzeri
   grid içinde gösterir. Egzersizler satır × setler sütun.
   Mobile-first responsive, sticky sol sütun, smooth scroll.
*/

.rsm-modal-overlay{
  position:fixed;
  inset:0;
  /* PERF (§4.5): backdrop-filter kaldırıldı — keyframe blur'un KENDİSİNİ anime
     ediyordu (her karede tam ekran gaussian blur = en pahalı desen). Animasyon
     yalnızca opacity'ye indirildi (GPU-dostu, 60fps). */
  background:var(--bg-overlay);
  /* [D2b cila] --z-modal(9500) YANLIŞTI: detay paneli 10100'ün ARKASINA
     düşüyordu — gün kartı "geri'ye basınca açılıyor" bug'ının kökü (§4.1).
     Resmi ölçek: --z-detail-modal (10200, C0 token'ı). */
  z-index:var(--z-detail-modal,10200);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:var(--space-base);
  animation:rsmOverlayIn var(--duration-base) var(--ease-out);
}
@keyframes rsmOverlayIn{
  from{opacity:0}
  to{opacity:1}
}

.rsm-modal{
  width:100%;
  max-width:1100px;
  max-height:90vh;
  background:var(--bg-card);
  border:1px solid var(--border-strong);
  border-radius:var(--radius-2xl);
  box-shadow:var(--shadow-2xl);
  display:flex;
  flex-direction:column;
  overflow:hidden;
  animation:rsmModalIn var(--duration-slow) var(--ease-bounce);
}
@keyframes rsmModalIn{
  from{opacity:0;transform:translateY(24px) scale(0.96)}
  to{opacity:1;transform:translateY(0) scale(1)}
}

/* Modal header */
.rsm-modal-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:var(--space-base);
  padding:var(--space-xl) var(--space-xl) var(--space-lg);
  border-bottom:1px solid var(--border);
  background:linear-gradient(135deg,var(--accent-50) 0%,transparent 60%);
}
.rsm-modal-header-left{
  flex:1;
  min-width:0;
}
.rsm-modal-date{
  font-size:var(--font-xl);
  font-weight:var(--fw-black);
  color:var(--text-primary);
  letter-spacing:var(--tracking-tight);
  line-height:var(--leading-tight);
  margin-bottom:var(--space-sm);
}
.rsm-modal-meta{
  display:flex;
  align-items:center;
  gap:var(--space-sm);
  flex-wrap:wrap;
}
.rsm-modal-meta-pill{
  display:inline-flex;
  align-items:center;
  gap:var(--space-xs);
  padding:var(--space-xs) var(--space-md);
  background:var(--accent-100);
  border:1px solid var(--border-accent);
  border-radius:var(--radius-pill);
  font-size:var(--font-xs);
  font-weight:var(--fw-bold);
  color:var(--accent);
  letter-spacing:var(--tracking-tight);
}
.rsm-modal-meta-sep{color:var(--text-dim);font-weight:var(--fw-bold)}
.rsm-modal-meta-time{
  font-size:var(--font-xs);
  font-weight:var(--fw-semibold);
  color:var(--text-secondary);
}
.rsm-modal-close{
  flex-shrink:0;
  width:40px;
  height:40px;
  border-radius:var(--radius-pill);
  background:rgba(255,255,255,0.04);
  border:1px solid var(--border);
  color:var(--text-secondary);
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:background var(--duration-fast) var(--ease-out),
             color var(--duration-fast) var(--ease-out),
             transform var(--duration-fast) var(--ease-out);
}
.rsm-modal-close:hover{
  background:var(--red-soft);
  color:var(--red);
  border-color:rgba(255,80,80,0.2);
  transform:rotate(90deg);
}

/* Stats strip */
.rsm-modal-stats{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:var(--space-sm);
  padding:var(--space-lg) var(--space-xl);
  background:rgba(0,0,0,0.2);
  border-bottom:1px solid var(--border);
}
.rsm-stat{
  text-align:center;
  padding:var(--space-md);
  background:rgba(255,255,255,0.02);
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  transition:border-color var(--duration-fast) var(--ease-out),
             background var(--duration-fast) var(--ease-out);
}
.rsm-stat:hover{
  border-color:var(--border-accent);
  background:var(--accent-50);
}
.rsm-stat-value{
  font-size:var(--font-2xl);
  font-weight:var(--fw-black);
  color:var(--accent);
  letter-spacing:var(--tracking-tight);
  line-height:1;
  margin-bottom:var(--space-xs);
}
.rsm-stat-label{
  font-size:var(--font-2xs);
  font-weight:var(--fw-bold);
  color:var(--text-tertiary);
  text-transform:uppercase;
  letter-spacing:var(--tracking-wider);
}

/* Modal body — scrollable */
.rsm-modal-body{
  flex:1;
  overflow:auto;
  padding:var(--space-lg) var(--space-xl) var(--space-xl);
}

/* Table wrap — horizontal scroll için */
.rsm-table-wrap{
  width:100%;
  overflow-x:auto;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  background:rgba(0,0,0,0.15);
}

/* Excel-style table */
.rsm-table{
  width:100%;
  border-collapse:collapse;
  font-size:var(--font-sm);
}
.rsm-th{
  padding:var(--space-md) var(--space-base);
  text-align:center;
  font-size:var(--font-xs);
  font-weight:var(--fw-bold);
  color:var(--text-secondary);
  text-transform:uppercase;
  letter-spacing:var(--tracking-wide);
  background:rgba(255,255,255,0.03);
  border-bottom:2px solid var(--border-strong);
  white-space:nowrap;
}
.rsm-th-sticky{
  position:sticky;
  left:0;
  background:var(--bg-elevated);
  text-align:left;
  z-index:2;
  min-width:180px;
  border-right:1px solid var(--border-strong);
}
.rsm-th-summary{
  color:var(--accent);
  background:var(--accent-50);
  border-left:1px solid var(--border-accent);
}

.rsm-row{
  transition:background var(--duration-fast) var(--ease-out);
}
.rsm-row:nth-child(even){background:rgba(255,255,255,0.015)}
.rsm-row:hover{background:var(--accent-50)}
.rsm-row:hover .rsm-td-name{
  background:var(--bg-card-hover);
  color:var(--accent);
}

.rsm-td{
  padding:var(--space-md) var(--space-base);
  text-align:center;
  border-bottom:1px solid var(--border);
  border-right:1px solid rgba(255,255,255,0.03);
  vertical-align:middle;
}
.rsm-row:last-child .rsm-td{border-bottom:none}

.rsm-td-name{
  position:sticky;
  left:0;
  background:var(--bg-card);
  text-align:left;
  font-weight:var(--fw-bold);
  color:var(--text-primary);
  letter-spacing:var(--tracking-tight);
  z-index:1;
  border-right:1px solid var(--border-strong);
  min-width:180px;
  transition:background var(--duration-fast) var(--ease-out),
             color var(--duration-fast) var(--ease-out);
}

.rsm-cell-kg{
  font-size:var(--font-base);
  font-weight:var(--fw-extrabold);
  color:var(--text-primary);
  letter-spacing:var(--tracking-tight);
  line-height:1;
  margin-bottom:2px;
}
.rsm-cell-reps{
  font-size:var(--font-2xs);
  font-weight:var(--fw-medium);
  color:var(--text-tertiary);
  letter-spacing:var(--tracking-wide);
}
.rsm-td-empty{
  color:var(--text-dim);
  font-weight:var(--fw-medium);
}
.rsm-td-summary{
  font-weight:var(--fw-extrabold);
  color:var(--accent);
  background:var(--accent-50);
  border-left:1px solid var(--border-accent);
  font-size:var(--font-base);
  letter-spacing:var(--tracking-tight);
}

/* Scrollbar styling */
.rsm-table-wrap::-webkit-scrollbar,
.rsm-modal-body::-webkit-scrollbar{height:8px;width:8px}
.rsm-table-wrap::-webkit-scrollbar-track,
.rsm-modal-body::-webkit-scrollbar-track{background:rgba(0,0,0,0.2)}
.rsm-table-wrap::-webkit-scrollbar-thumb,
.rsm-modal-body::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.15);border-radius:4px}
.rsm-table-wrap::-webkit-scrollbar-thumb:hover,
.rsm-modal-body::-webkit-scrollbar-thumb:hover{background:var(--accent-300)}

/* Mobile responsive */
@media (max-width:768px){
  .rsm-modal{
    max-height:96vh;
    border-radius:var(--radius-xl);
  }
  .rsm-modal-header{padding:var(--space-lg) var(--space-base) var(--space-md)}
  .rsm-modal-date{font-size:var(--font-lg)}
  .rsm-modal-stats{
    padding:var(--space-md) var(--space-base);
    gap:var(--space-xs);
  }
  .rsm-stat{padding:var(--space-sm)}
  .rsm-stat-value{font-size:var(--font-lg)}
  .rsm-modal-body{padding:var(--space-md) var(--space-base) var(--space-lg)}
  .rsm-th,.rsm-td{padding:var(--space-sm) var(--space-md)}
  .rsm-td-name,.rsm-th-sticky{min-width:140px;font-size:var(--font-xs)}
  .rsm-cell-kg{font-size:var(--font-sm)}
  .rsm-cell-reps{font-size:9px}
}

/* ─── EGZERSİZ DROPDOWN — Dark UI Autocomplete ─── */
/* Native <datalist>'ın beyaz arkaplanı dark UI ile uyumsuz.
   Bu yüzden custom dropdown — input'a yazıldıkça kütüphaneden
   filtreli öneriler düşer, koyu tema, hover vurgulu. */
.ex-input-wrap{
  position:relative;
  display:flex;
  flex:1;
  min-width:0;
}
.ex-dropdown{
  position:absolute;
  top:calc(100% + 2px);
  left:0;
  right:0;
  background:#1a1d1f;
  border:1px solid var(--border);
  border-radius:8px;
  max-height:240px;
  overflow-y:auto;
  z-index:1000;
  box-shadow:0 8px 24px rgba(0,0,0,.5);
  display:none;
}
.ex-dropdown.open{display:block}
.ex-dropdown-item{
  padding:8px 12px;
  font-size:.78rem;
  color:var(--text-primary);
  cursor:pointer;
  border-bottom:1px solid rgba(255,255,255,.04);
  transition:background .12s;
  display:flex;
  flex-direction:column;
  gap:1px;
}
.ex-dropdown-item:last-child{border-bottom:none}
.ex-dropdown-item:hover,
.ex-dropdown-item.active{
  background:rgba(200,245,49,.08);
}
.ex-dropdown-item-tr{
  font-weight:700;
  color:var(--text-primary);
}
.ex-dropdown-item-en{
  font-size:.64rem;
  font-weight:600;
  font-style:italic;
  color:var(--text-dim);
}
.ex-dropdown-empty{
  padding:14px 12px;
  text-align:center;
  font-size:.74rem;
  color:var(--text-dim);
  font-style:italic;
}
/* Scrollbar dark theme */
.ex-dropdown::-webkit-scrollbar{width:8px}
.ex-dropdown::-webkit-scrollbar-track{background:rgba(0,0,0,.2)}
.ex-dropdown::-webkit-scrollbar-thumb{background:rgba(255,255,255,.15);border-radius:4px}
.ex-dropdown::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.25)}

.exlib-wrap{
  display:flex;flex-direction:column;gap:14px;
  /* Layout shift önleme — kütüphane geç yüklense bile alan rezerve */
  min-height:200px;
}
.exlib-section{
  background:rgba(0,0,0,.18);
  border:1px solid var(--border);
  border-radius:12px;
  padding:14px 14px 12px;
}
.exlib-section-head{
  display:flex;align-items:center;justify-content:space-between;
  gap:10px;
  padding-bottom:10px;
  margin-bottom:10px;
  border-bottom:1px solid rgba(255,255,255,.06);
}
.exlib-section-title{
  font-size:.86rem;font-weight:800;color:var(--text-primary);
  letter-spacing:-0.2px;
}
.exlib-section-count{
  font-size:.66rem;font-weight:700;color:var(--accent);
  letter-spacing:.4px;
  text-transform:uppercase;
  background:rgba(200,245,49,.08);
  border:1px solid rgba(200,245,49,.22);
  padding:3px 8px;
  border-radius:6px;
}
.exlib-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:6px;
}
.exlib-item{
  display:flex;flex-direction:column;gap:1px;
  padding:8px 10px;
  background:rgba(255,255,255,.025);
  border:1px solid var(--border);
  border-radius:8px;
  transition:background .15s,border-color .15s;
}
.exlib-item:hover{
  background:rgba(200,245,49,.05);
  border-color:rgba(200,245,49,.22);
}
.exlib-item-tr{
  font-size:.78rem;font-weight:700;color:var(--text-primary);
  letter-spacing:-0.1px;
}
.exlib-item-en{
  font-size:.66rem;font-weight:600;color:var(--text-dim);
  font-style:italic;
  letter-spacing:.2px;
}

/* ═══════════════════════════════════════════════════════════════
   ANALİZ EKRANI — TWO-TIER REGION ACCORDION + DETAY EKRANI
   ═══════════════════════════════════════════════════════════════ */

/* Üst-level wrapper — Üst Vücut + Alt Vücut accordion'ları */
.region-wrap{
  display:flex;flex-direction:column;gap:14px;
}
.region-block{
  background:rgba(255,255,255,.025);
  border:1px solid var(--border);
  border-radius:14px;
  overflow:hidden;
  transition:border-color .15s,background .15s;
}
.region-block.is-open{
  border-color:rgba(200,245,49,.25);
  background:rgba(200,245,49,.025);
}
.region-head{
  display:flex;align-items:center;justify-content:space-between;
  gap:12px;
  padding:16px 18px;
  cursor:pointer;
  user-select:none;
  -webkit-tap-highlight-color:transparent;
  transition:background .15s;
}
.region-head:hover{background:rgba(255,255,255,.02)}
.region-head-left{
  display:flex;align-items:center;gap:14px;
  flex:1;min-width:0;
}
.region-head-icon{
  width:42px;height:42px;
  display:flex;align-items:center;justify-content:center;
  border-radius:11px;
  background:rgba(200,245,49,.08);
  border:1px solid rgba(200,245,49,.2);
  color:var(--accent);
  flex-shrink:0;
}
.region-head-icon svg{
  width:22px;height:22px;
  display:block;
}
.region-head-titles{
  flex:1;min-width:0;
  display:flex;flex-direction:column;gap:2px;
}
.region-head-title{
  font-size:1rem;font-weight:900;color:var(--text-primary);
  letter-spacing:-0.3px;
}
.region-head-sub{
  font-size:.72rem;font-weight:700;color:var(--text-dim);
  letter-spacing:.2px;
}
.region-head-right{
  display:flex;align-items:center;gap:12px;
  flex-shrink:0;
}
.region-head-stat{
  font-size:.74rem;font-weight:700;color:var(--text-secondary);
  letter-spacing:.2px;
}
.region-head-chevron{
  font-size:.85rem;color:var(--text-dim);
  transition:transform .22s;
  display:inline-block;
}
.region-block.is-open .region-head-chevron{
  transform:rotate(180deg);color:var(--accent);
}
.region-body{
  padding:0 12px 12px;
  display:flex;flex-direction:column;gap:6px;
  border-top:1px solid var(--border);
  padding-top:10px;
}

/* Bölge içi kas grubu satırı — buton, tıklanınca detay ekranı açılır */
.region-group-row{
  display:flex;align-items:center;gap:12px;
  width:100%;
  padding:11px 12px;
  background:rgba(0,0,0,.18);
  border:1px solid var(--border);
  border-radius:10px;
  cursor:pointer;
  font-family:inherit;
  text-align:left;
  transition:background .15s,border-color .15s,transform .1s;
  -webkit-tap-highlight-color:transparent;
}
.region-group-row:not(.is-empty):hover{
  background:rgba(200,245,49,.06);
  border-color:rgba(200,245,49,.3);
}
.region-group-row:not(.is-empty):active{transform:scale(.99)}
.region-group-row:focus,.region-group-row:focus-visible{outline:none;box-shadow:none}
.region-group-row.is-empty{
  opacity:.5;
  cursor:not-allowed;
}
.region-group-icon{
  width:34px;height:34px;
  display:flex;align-items:center;justify-content:center;
  border-radius:9px;
  background:rgba(255,255,255,.04);
  border:1px solid var(--border);
  color:var(--text-secondary);
  flex-shrink:0;
}
.region-group-icon svg{
  width:18px;height:18px;
  display:block;
}
.region-group-row:not(.is-empty):hover .region-group-icon{
  background:rgba(200,245,49,.1);
  border-color:rgba(200,245,49,.3);
  color:var(--accent);
}
.region-group-row.is-empty .region-group-icon{
  opacity:.55;
}
/* Detay ekranı başlık ikonu — küçük, aksanlı */
.analysis-detail-title-icon{
  display:inline-flex;align-items:center;justify-content:center;
  width:30px;height:30px;
  border-radius:8px;
  background:rgba(200,245,49,.08);
  border:1px solid rgba(200,245,49,.22);
  color:var(--accent);
  margin-right:4px;
  vertical-align:middle;
}
.analysis-detail-title-icon svg{
  width:18px;height:18px;
  display:block;
}
.region-group-name{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.region-group-name-tr{
  font-size:.88rem;font-weight:800;color:var(--text-primary);
  letter-spacing:-0.2px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.region-group-name-en{
  font-size:.7rem;font-weight:600;color:var(--text-dim);
  letter-spacing:.2px;
  font-style:italic;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.region-group-meta{
  display:flex;align-items:center;gap:8px;
  flex-shrink:0;
}
.region-group-count{
  font-size:.7rem;font-weight:700;color:var(--text-secondary);
  letter-spacing:.1px;
  white-space:nowrap;
}
.region-group-empty-tag{
  font-size:.66rem;font-weight:700;color:var(--text-dim);
  letter-spacing:.3px;
  text-transform:uppercase;
  font-style:italic;
}
.region-group-arrow{
  font-size:1.1rem;color:var(--text-dim);
  font-weight:300;
  transition:transform .12s,color .12s;
}
.region-group-row:not(.is-empty):hover .region-group-arrow{
  color:var(--accent);
  transform:translateX(2px);
}

/* ═══════════════════════════════════════════════════════════════
   DETAY EKRANI — kas grubu tıklandığında açılan ferah ekran
   ═══════════════════════════════════════════════════════════════ */

.analysis-detail-screen{
  display:flex;flex-direction:column;gap:16px;
  /* Layout shift önleme — kategori detay (hero+sublist) ile alt-grup
     detay (header+chart+exlist) arasında stabil yükseklik. Aksi halde
     iki ekran arası geçişte sayfa zıplıyor. */
  min-height:680px;
  /* TAŞMA KORUMASI — bu konteynerin içindeki hiçbir şey ebeveyni aşamaz */
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  overflow-x:hidden;
  min-width:0;
  /* Slide-in from RIGHT — kategori veya alt-gruba "ileri gitme" hissi.
     Native app push navigation karakteri. */
  animation:routeSlideFromRight .28s cubic-bezier(.22,.61,.36,1);
}
@keyframes routeSlideFromRight{
  from{opacity:0;transform:translateX(24px)}
  to{opacity:1;transform:translateX(0)}
}

/* Üst-level overload-section için minimum yükseklik rezervasyonu —
   sekmeler (Liste/Analiz) arasında geçişte sayfa yüksekliği sabit kalsın.
   SCALING: max-width 1100px (üstteki tanımla aynı), tam ekranda
   devasa büyümesin, ortalansın. */
.overload-section{
  min-height:480px;
  /* TAŞMA KORUMASI + SCALING SINIRI */
  width:100%;
  max-width:1100px;
  box-sizing:border-box;
  overflow-x:hidden;
  min-width:0;
  margin-left:auto;
  margin-right:auto;
}

.analysis-detail-head{
  display:flex;align-items:center;gap:12px;
  padding:14px 16px;
  background:rgba(255,255,255,.025);
  border:1px solid var(--border);
  border-radius:14px;
}
.analysis-detail-back{
  width:44px;height:44px;
  flex-shrink:0;
  border-radius:12px;
  background:rgba(255,255,255,.06);
  border:1px solid var(--border);
  color:var(--text-secondary);
  font-size:1.35rem;font-weight:600;
  font-family:inherit;
  cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:background .15s,border-color .15s,color .15s,transform .12s;
  -webkit-tap-highlight-color:transparent;
  /* PM gereği — agresif gölge/ring temizliği */
  box-shadow:none !important;
  outline:none;
}
.analysis-detail-back:hover{
  background:rgba(200,245,49,.1);
  border-color:rgba(200,245,49,.35);
  color:var(--accent);
  transform:translateX(-2px);
}
.analysis-detail-back:active{
  transform:scale(.94) translateX(-2px);
}
.analysis-detail-back:focus,
.analysis-detail-back:focus-visible{
  outline:none !important;
  box-shadow:none !important;
  -webkit-tap-highlight-color:transparent;
}
.analysis-detail-titles{flex:1;min-width:0}
.analysis-detail-title{
  font-size:1.05rem;font-weight:900;color:var(--text-primary);
  letter-spacing:-0.3px;
  display:flex;align-items:center;gap:8px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.analysis-detail-sub{
  font-size:.74rem;font-weight:600;color:var(--text-dim);
  font-style:italic;
  letter-spacing:.2px;
  margin-top:2px;
}

/* Period dropdown */
.detail-period-wrap{position:relative;flex-shrink:0}
.detail-period-btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 14px;
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:10px;
  color:var(--text-primary);
  font-family:inherit;
  font-size:.78rem;font-weight:800;
  letter-spacing:.1px;
  cursor:pointer;
  transition:background .15s,border-color .15s;
  -webkit-tap-highlight-color:transparent;
  /* PM gereği — inatçı gölge/focus ring temizlik */
  box-shadow:none !important;
  outline:none;
}
.detail-period-btn:hover{
  background:rgba(200,245,49,.06);
  border-color:rgba(200,245,49,.3);
  box-shadow:none !important;
}
.detail-period-btn:focus,
.detail-period-btn:focus-visible,
.detail-period-btn:active{
  outline:none !important;
  box-shadow:none !important;
  -webkit-tap-highlight-color:transparent;
}
.detail-period-caret{
  font-size:.8rem;color:var(--text-dim);
}
.detail-period-menu{
  position:absolute;
  top:calc(100% + 6px);
  right:0;
  min-width:140px;
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:11px;
  /* Hafif derinlik ama agresif gölge yok — sadece elevation hissi */
  box-shadow:0 6px 20px rgba(0,0,0,.35);
  z-index:30;
  overflow:hidden;
  display:flex;flex-direction:column;
  animation:periodMenuIn .14s ease-out;
}
@keyframes periodMenuIn{
  from{opacity:0;transform:translateY(-4px)}
  to{opacity:1;transform:translateY(0)}
}
.detail-period-option{
  padding:10px 14px;
  background:transparent;
  border:none;
  text-align:left;
  font-family:inherit;
  font-size:.8rem;font-weight:700;
  color:var(--text-secondary);
  cursor:pointer;
  transition:background .12s,color .12s;
  -webkit-tap-highlight-color:transparent;
  /* PM gereği — gölge/ring tamamen yok */
  box-shadow:none !important;
  outline:none;
}
.detail-period-option:hover{background:rgba(200,245,49,.08);color:var(--text-primary)}
.detail-period-option:focus,
.detail-period-option:focus-visible,
.detail-period-option:active{
  outline:none !important;
  box-shadow:none !important;
  -webkit-tap-highlight-color:transparent;
}
.detail-period-option.is-active{
  background:rgba(200,245,49,.12);
  color:var(--accent);
}

/* ─── ÇİZGİ GRAFİĞİ (Paint çizimine sadık) ─── */
.region-chart{
  background:rgba(0,0,0,.2);
  border:1px solid var(--border);
  border-radius:14px;
  padding:14px;
  /* Layout shift çözümü — kapsayıcı yüksekliği ÖNCEDEN rezerve edilir. */
  min-height:300px;
  position:relative;
  /* TAŞMA KORUMASI — çok katmanlı:
     1. width:100% + max-width:100% → ebeveyne sığ
     2. box-sizing:border-box → padding ve border GENİŞLİĞE DAHİL (taşma yok)
     3. overflow:hidden → içerideki SVG asla dışarı taşamaz
     4. min-width:0 → flex/grid içinde "min içerik genişliği" hilesi engellenir */
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  overflow:hidden;
  min-width:0;
}
.region-chart *{
  /* Tüm alt-elementler kapsayıcıyı asla aşamaz */
  max-width:100%;
  box-sizing:border-box;
}
.region-chart-head{
  display:flex;align-items:center;justify-content:space-between;
  gap:10px;flex-wrap:wrap;
  margin-bottom:10px;
  width:100%;
  min-width:0;
}
.region-chart-title{
  font-size:.88rem;font-weight:800;color:var(--text-primary);
  letter-spacing:-0.2px;
  /* Uzun başlıklar kapsayıcıyı patlatamaz */
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  min-width:0;
  flex:1;
}
.region-chart-meta{
  display:flex;align-items:center;gap:6px;
  font-size:.72rem;font-weight:700;color:var(--text-dim);
  letter-spacing:.2px;
  flex-shrink:0;
}
.region-chart-y-label{color:var(--accent)}
.region-chart-sep{opacity:.4}
.region-chart-svgwrap{
  width:100%;
  max-width:100%;
  /* SVG için sabit aspect-ratio — viewBox 560x260 ile uyumlu (~2.15:1).
     Bu, SVG yüklenmeden önce alanı tutar, layout shift yok. */
  aspect-ratio:600/300;
  min-height:200px;
  position:relative;
  /* TAŞMA KORUMASI 2. KATMAN — SVG hesaplanan genişlikten taşarsa kırpılır */
  overflow:hidden;
  box-sizing:border-box;
  /* Mobile'da çok dar ekranlarda chart ezilmesin */
  min-width:0;
}
.region-chart-svg{
  width:100%;
  height:100%;
  max-width:100%;
  max-height:100%;
  display:block;
  /* SVG'nin viewBox dışına çıkma ihtimaline karşı son kalkan */
  overflow:hidden;
  /* Smooth fade-in — SVG attach olduğu anda yumuşakça belirir */
  animation:chartFadeIn .25s ease-out;
}
@keyframes chartFadeIn{
  from{opacity:0;transform:translateY(4px)}
  to{opacity:1;transform:translateY(0)}
}
.region-chart-empty{
  /* Empty state grafikle aynı alanı kaplasın — layout shift yok */
  min-height:200px;
  aspect-ratio:600/300;
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  display:flex;align-items:center;justify-content:center;
  text-align:center;
  color:var(--text-dim);
  font-size:.84rem;font-weight:600;
  background:rgba(255,255,255,.02);
  border:1px dashed var(--border);
  border-radius:12px;
  padding:14px;
}

/* SVG eleman stilleri — currentColor uyumlu */
.region-chart-svg .chart-axis{
  stroke:var(--border-strong);
  stroke-width:1.5;
}
/* L-eksen ok başlı — daha güçlü, beyaza yakın */
.region-chart-svg .chart-axis-strong{
  stroke:rgba(255,255,255,0.35);
  stroke-width:2;
  stroke-linecap:square;
  color:rgba(255,255,255,0.35); /* marker fill için */
}
.region-chart-svg .chart-grid{
  stroke:rgba(255,255,255,.06);
  stroke-width:1;
  stroke-dasharray:3,3;
}
.region-chart-svg .chart-axis-label{
  fill:var(--text-secondary);
  font-family:inherit;
  font-size:11px;
  font-weight:700;
  letter-spacing:.3px;
}
.region-chart-svg .chart-axis-title{
  fill:var(--text-primary);
  font-family:inherit;
  font-size:11px;
  font-weight:800;
  letter-spacing:1px;
  text-transform:uppercase;
}
.region-chart-svg .chart-axis-title-y{
  fill:var(--accent);
}
.region-chart-svg .chart-axis-title-x{
  fill:var(--text-primary);
}
.region-chart-svg .chart-bar{
  fill:rgba(200,245,49,.14);
  stroke:rgba(200,245,49,.32);
  stroke-width:1;
  transition:fill var(--duration-fast) var(--ease-out);
}
.region-chart-svg .chart-bar:hover{fill:rgba(200,245,49,.28)}
/* Trend çizgisi — kalın, parlak, glow ile dramatik */
.region-chart-svg .chart-line{
  stroke:var(--accent);
  stroke-width:3;
  stroke-linecap:round;
  stroke-linejoin:round;
  fill:none;
  filter:drop-shadow(0 2px 8px rgba(200,245,49,.45));
}
/* Noktalar — büyük, halolu, premium */
.region-chart-svg .chart-dot{
  fill:var(--accent);
  stroke:var(--bg-card);
  stroke-width:2.5;
  filter:drop-shadow(0 0 4px rgba(200,245,49,.6));
  transition:r var(--duration-fast) var(--ease-bounce);
}
.region-chart-svg .chart-dot:hover{r:7}
.region-chart-svg .chart-dot-halo{
  fill:var(--accent);
  opacity:.18;
}

/* Detay ekranındaki egzersiz listesi başlığı + accordion (mevcut V-Slope korunuyor) */
.analysis-detail-section-title{
  display:flex;align-items:center;justify-content:space-between;
  padding:0 4px;
  font-size:.86rem;font-weight:900;color:var(--text-primary);
  letter-spacing:-0.2px;
  margin-top:4px;
}
.analysis-detail-section-count{
  font-size:.7rem;font-weight:700;color:var(--text-dim);
  letter-spacing:.3px;
  text-transform:uppercase;
}
.analysis-detail-exlist{
  display:flex;flex-direction:column;gap:8px;
}

.analysis-ex{
  background:rgba(0,0,0,.18);
  border:1px solid var(--border);
  border-radius:10px;
  overflow:hidden;
  transition:border-color .15s;
}
.analysis-ex.is-open{border-color:rgba(200,245,49,.3)}
.analysis-ex-head{
  display:flex;align-items:center;justify-content:space-between;
  gap:10px;
  padding:11px 14px;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  user-select:none;
  transition:background .15s;
}
.analysis-ex-head:hover{background:rgba(255,255,255,.02)}
.analysis-ex-name{
  font-size:.85rem;font-weight:700;color:var(--text-primary);
  letter-spacing:-0.1px;
  flex:1;min-width:0;
}
.analysis-ex-meta{
  display:flex;align-items:center;gap:10px;
  flex-shrink:0;
}
.analysis-ex-stat{
  font-size:.7rem;font-weight:700;color:var(--text-dim);
  letter-spacing:.2px;
}
.analysis-ex-chevron{
  font-size:.8rem;color:var(--text-dim);
  transition:transform .2s;
  display:inline-block;
}
.analysis-ex.is-open .analysis-ex-chevron{transform:rotate(180deg);color:var(--accent)}

/* Trend bölümü (egzersiz açıldığında) */
.analysis-trend{
  padding:14px;
  background:rgba(0,0,0,.25);
  border-top:1px solid var(--border);
  display:flex;flex-direction:column;gap:14px;
}

/* ─── V-SLOPE TREND KARTI (Madde 3) ───
   Tabansız üçgen — başlangıç ile son arası eğim çizgisi. Yeşil (yukarı),
   kırmızı (aşağı), gri (sabit). Çizginin uçlarında değer + label. */
.slope-card{
  border-radius:14px;
  border:1px solid var(--border);
  overflow:hidden;
  background:rgba(0,0,0,.2);
}
.slope-card.slope-up{
  border-color:rgba(16,185,129,.35);
  background:linear-gradient(135deg,rgba(16,185,129,.06),rgba(16,185,129,.02));
  color:var(--green,#34d399);
}
.slope-card.slope-down{
  border-color:rgba(255,80,80,.35);
  background:linear-gradient(135deg,rgba(255,80,80,.06),rgba(255,80,80,.02));
  color:var(--red,#ff5050);
}
.slope-card.slope-flat{
  border-color:var(--border);
  background:rgba(255,255,255,.02);
  color:var(--text-secondary);
}

.slope-head{
  display:flex;align-items:center;gap:14px;
  padding:14px 16px;
  border-bottom:1px solid var(--border);
}
.slope-head-arrow{
  font-size:1.8rem;
  width:48px;height:48px;
  display:flex;align-items:center;justify-content:center;
  border-radius:12px;
  flex-shrink:0;
  background:rgba(0,0,0,.3);
  color:currentColor;
}
.slope-head-body{flex:1;min-width:0}
.slope-head-label{
  font-size:.66rem;font-weight:800;
  text-transform:uppercase;letter-spacing:.6px;
  color:var(--text-dim);
  margin-bottom:4px;
}
.slope-head-text{
  font-size:1rem;font-weight:800;
  color:currentColor;
  letter-spacing:-0.2px;
}

.slope-chart-wrap{
  padding:14px 12px 8px;
  background:rgba(0,0,0,.18);
  /* V-Slope SVG için yer rezervasyonu — viewBox 320x140 → ~2.28:1 */
  aspect-ratio:320/140;
  min-height:140px;
  position:relative;
  /* TAŞMA KORUMASI */
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  overflow:hidden;
  min-width:0;
}
.slope-svg{
  width:100%;
  height:100%;
  max-width:100%;
  max-height:100%;
  display:block;
  color:currentColor;
  overflow:hidden;
  /* Smooth fade-in — exercise tıklandığında SVG yumuşak belirir */
  animation:chartFadeIn .22s ease-out;
}
/* SVG text styling — currentColor inherits from slope-card */
.slope-svg .slope-label-text{
  fill:currentColor;
  font-family:inherit;
  font-size:14px;
  font-weight:900;
  letter-spacing:-0.3px;
}
.slope-svg .slope-label-sub{
  fill:var(--text-dim);
  font-family:inherit;
  font-size:9.5px;
  font-weight:700;
  letter-spacing:.5px;
  text-transform:uppercase;
}

/* Günlük tablo */
.analysis-day-table{
  background:rgba(255,255,255,.02);
  border:1px solid var(--border);
  border-radius:10px;
  overflow:hidden;
}
.analysis-day-table-head{
  display:grid;
  grid-template-columns:1fr 1fr 1.4fr;
  gap:10px;
  padding:8px 14px;
  background:rgba(255,255,255,.03);
  border-bottom:1px solid var(--border);
  font-size:.66rem;font-weight:800;
  text-transform:uppercase;letter-spacing:.6px;
  color:var(--text-dim);
}
.analysis-day-row{
  display:grid;
  grid-template-columns:1fr 1fr 1.4fr;
  gap:10px;
  padding:9px 14px;
  font-size:.82rem;
  border-bottom:1px solid rgba(255,255,255,.03);
}
.analysis-day-row:last-child{border-bottom:none}
.analysis-day-label{
  color:var(--text-secondary);font-weight:700;
  letter-spacing:.1px;
}
.analysis-day-weight{
  color:var(--text-primary);font-weight:900;
  letter-spacing:-0.2px;
}
.analysis-day-delta{
  font-size:.76rem;font-weight:700;
  letter-spacing:.2px;
}
.analysis-delta-up{color:var(--green,#34d399)}
.analysis-delta-down{color:var(--red,#ff5050)}
.analysis-delta-flat{color:var(--text-secondary)}
.analysis-delta-start{color:var(--text-dim);font-style:italic}
.detail-section-title{font-size:.7rem;font-weight:600;color:var(--text-dim);text-transform:uppercase;letter-spacing:1.5px;margin-bottom:12px}
.detail-info-row{
  display:flex;
  /* PM v3 fix: sağa yaslı eski "space-between" yerine SOLA hizalı */
  justify-content:flex-start;
  align-items:center;
  gap:16px;
  padding:10px 0;
  border-bottom:1px solid var(--border);
  font-size:.85rem;
}
.detail-info-label{
  color:var(--text-dim);
  /* Sabit genişlikli etiket — değer kolonu solda hizalı kalır */
  min-width:140px;
  flex-shrink:0;
}
.detail-info-value{
  font-weight:600;
  text-align:left;
}
.detail-info-value em.ev-empty{
  font-style:italic;
  color:var(--text-dim);
  font-weight:500;
  opacity:.7;
}
.detail-info-value.delta-loss{color:#10B981}
.detail-info-value.delta-gain{color:#FB923C}

/* ─── PROGRAM UYUM BAR (Madde 4) ─── */
/* Excel'deki Program Uyum Oranı'nın UI eşitliği */
.compliance-block{
  background:linear-gradient(135deg,rgba(200,245,49,0.04),rgba(200,245,49,0.01));
  border:1px solid rgba(200,245,49,0.18);
  border-radius:14px;
  padding:16px 18px;
}
.compliance-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}
.compliance-head-left{flex:1;min-width:0}
.compliance-title{
  font-size:.78rem;
  font-weight:800;
  letter-spacing:.5px;
  text-transform:uppercase;
  color:var(--text-dim);
  margin-bottom:2px;
}
.compliance-sub{
  font-size:.84rem;
  font-weight:600;
  color:var(--text-secondary);
}
.compliance-pct{
  font-size:1.6rem;
  font-weight:900;
  letter-spacing:-0.5px;
  color:var(--accent);
  line-height:1;
}
.compliance-bar{
  width:100%;
  height:8px;
  background:rgba(255,255,255,0.04);
  border-radius:999px;
  overflow:hidden;
  position:relative;
}
.compliance-bar-fill{
  height:100%;
  background:linear-gradient(90deg,#98BE1C,#C8F531);
  border-radius:999px;
  transition:width .6s cubic-bezier(.25,.46,.45,.94);
  box-shadow:0 0 12px rgba(200,245,49,0.3);
}
/* [C4 cila] min-height: bar bazı sekmelerde boş, bazılarında butonlu — yükseklik
   sabitlenmezse üstündeki .detail-content her sekme geçişinde büyüyüp küçülüyor
   (butonların "zıplaması" buydu). 72px = 16+40(btn-accent)+16. */
.detail-actions{display:flex;gap:8px;padding:16px 24px;border-top:1px solid var(--border);flex-shrink:0;min-height:72px;align-items:center}
.detail-empty{text-align:center;padding:40px 20px;color:var(--text-dim);font-size:.85rem}
.detail-empty-icon{font-size:2rem;margin-bottom:12px}

/* ─── KİLİTLİ GÜN ─── (Workout Completion Badge — YENI DAVRANIŞ) */
/* PM kararıyla davranış değişti: kilit artık "engelleyici" değil bilgilendirici.
   Yeni egzersiz eklendiğinde gün otomatik olarak "tamamlanmadı"ya döner. */
.day-locked-badge{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:10px 14px;
  margin-top:8px;
  margin-bottom:8px;
  background:rgba(16,185,129,.06);
  border:1px solid rgba(16,185,129,.22);
  border-radius:8px;
  color:var(--green,#10B981);
  font-family:inherit;
  font-size:.74rem;
  font-weight:700;
  letter-spacing:.2px;
  width:100%;
  user-select:none;
}
.day-locked-badge svg{flex-shrink:0;opacity:.85}
/* Tamamlanan gün'ün başlığında küçük check işareti — koç durumu hemen görür */
.day-block.day-locked .day-header::after{
  content:'✓';
  margin-left:6px;
  font-size:.8rem;
  color:var(--green,#10B981);
  font-weight:900;
}

/* CALENDAR IN DETAIL */
.week-nav{display:flex;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap}
.week-nav-btn{width:32px;height:32px;border-radius:8px;border:1px solid var(--border);background:none;cursor:pointer;color:var(--text-dim);font-size:.8rem}
.week-label{font-size:.85rem;font-weight:700;min-width:180px;text-align:center}
.cal-week{display:grid;grid-template-columns:60px repeat(7,1fr);gap:2px;margin-bottom:16px}
.cal-week-header{font-size:.65rem;color:var(--text-dim);text-transform:uppercase;letter-spacing:1px;text-align:center;padding:8px 4px;font-weight:600}
.cal-time-slot{font-size:.7rem;color:var(--text-dim);display:flex;align-items:flex-start;padding-top:4px;justify-content:center}
.cal-cell{min-height:90px;max-height:180px;overflow-y:auto;background:rgba(255,255,255,.015);border:1px solid var(--border);border-radius:8px;padding:6px;cursor:pointer;position:relative;transition:background .15s}
.cal-cell::-webkit-scrollbar{width:3px}
.cal-cell::-webkit-scrollbar-thumb{background:rgba(200,245,49,.15);border-radius:2px}
.cal-cell:hover{background:rgba(255,255,255,.035);border-color:var(--border);box-shadow:none!important;outline:none;text-shadow:none!important}
.cal-cell.today{border-color:rgba(200,245,49,.2);background:rgba(200,245,49,.02)}
.cal-day-num{font-size:.7rem;font-weight:600;margin-bottom:4px;color:var(--text-secondary)}
.cal-cell.today .cal-day-num{color:var(--accent)}
.cal-tag-wrap{display:flex;align-items:center;gap:4px;margin-bottom:5px;max-width:100%}
.cal-tag-wrap:hover{box-shadow:none!important;outline:none;text-shadow:none!important}
.cal-tag{font-size:.78rem;font-weight:700;padding:6px 10px;border-radius:6px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;flex:1;min-width:0;box-shadow:none!important;outline:none;filter:none;transition:none;text-shadow:none!important;-webkit-tap-highlight-color:transparent}
.cal-tag:hover,.cal-tag:active,.cal-tag:focus{box-shadow:none!important;outline:none;filter:none;transform:none;text-shadow:none!important}
.cal-tag.workout{background:rgba(200,245,49,.12);color:var(--accent)}
.cal-tag.workout.done{background:rgba(16,185,129,.15);color:var(--green)}
.cal-tag.workout.missed{background:rgba(255,80,80,.1);color:var(--red)}
.cal-tag.external{background:rgba(255,159,67,.1);color:var(--orange)}
.cal-tag.nutrition{background:rgba(96,165,250,.1);color:var(--blue)}
.cal-tag.checkin{background:rgba(168,85,247,.1);color:var(--purple)}
.cal-tag.rest{background:rgba(255,255,255,.05);color:var(--text-dim)}
.cal-tag.appointment{background:rgba(167,139,250,.14);color:#A78BFA;font-weight:700}
.cal-tag.appointment.done{background:rgba(16,185,129,.15);color:var(--green)}
.cal-tag.appointment.missed{background:rgba(255,80,80,.1);color:var(--red)}
.cal-tag-del{width:20px;height:20px;min-width:20px;border-radius:5px;border:none;background:rgba(255,80,80,.08);color:var(--red);font-size:.7rem;cursor:pointer;display:none;align-items:center;justify-content:center;flex-shrink:0;padding:0;font-weight:700}
.cal-tag-wrap:hover .cal-tag-del{display:flex}
