/* =====================================================================
 SAYFA CSS — FİT TESTİ SONUCU
 ---------------------------------------------------------------------
 Kabuktan gelen ve BURADA TEKRAR TANIMLANMAYAN kitler:
 .lib-top + .lib-crumb + .lib-stats (banner), .fp-body / .fp-grid /
 .fp-card / .fp-head / .fp-stats / .fp-list / .fp-row / .fp-badge /
 .fp-chart (sonuç görselleştirme dili — fit-planim-ilerleme-v1 ile aynı),

 Burada YALNIZ tek bir sayfaya özgü ölçü var: üç kademeli seviye
 şeridi (.ts-scale). Kabukta üç kademeli "sen buradasın" göstergesi
 yok — .fp-days 7'li ızgara, .fp-bar tek çubuk. Raporda kabuğa
 taşınması önerildi.
 ===================================================================== */

/* üç kademeli başlangıç seviyesi şeridi — "senin sonucun" YALNIZ renkle
   değil, metin + ikon ile de işaretlenir (belge §20) */
.ts-scale{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:2px 0 4px}
.ts-step{border:1px solid var(--line);background:#f7f7f6;border-radius:var(--radius-md);padding:13px 10px;text-align:center}
.ts-step b{display:block;font-size:13.5px;font-weight:800;color:var(--slate);letter-spacing:-.01em}
.ts-step small{display:block;font-size:11.5px;font-weight:600;color:var(--muted);margin-top:3px;line-height:1.4}
.ts-step .ts-you{display:none}
.ts-step.on{background:var(--fit-tint);border-color:var(--fit)}
.ts-step.on b,.ts-step.on small{color:var(--fit-deep)}
.ts-step.on .ts-you{display:inline-flex;align-items:center;gap:5px;margin-top:7px;
  font-size:10.5px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;
  color:#fff;background:var(--fit);padding:4px 9px;border-radius:var(--radius-sm)}
.ts-step.on .ts-you i{font-size:9.5px}

   okunaklı (14.8:1) ama kardeş sayfalarla AYNI DİLDE DEĞİL. 1440'ta ölçtüm:
     pro-v1 · pro-odeme-v1 · reklam-ver-v1 · fit-testleri-v1  → CAM  rgba(255,255,255,.12)
     sss-v1 · (bu sayfa, düzeltmeden önce)                     → KREM rgb(247,241,230)
   Dört sayfa aynı satırı kendi <style>'ında tekrar ediyor; kabukta 0.
/* GEÇİCİ ÇÖZÜM (sayfa içi) — kabuğun .fp-chart kusuru
   ÖLÇÜM: .fp-col 150px, ama val + lbl + iki 8px boşluk 52px yiyor; .bar'ın
   height:%N değeri 150px'e göre çözülüyor ve kalan 98px'te flex-shrink ile
   kırpılıyor. Sonuç: %66 üzerindeki her değer AYNI 98px'e düşüyor.
   programlarim-v1.html#ilerleme'de de böyle: %76 ve %96 → ikisi de 98px.
   Burada .bar'ı, kalan boşluğu alan bir raya (.ts-track) koyuyorum; yüzde
   artık gerçek çubuk alanına göre çözülüyor. Kabuğa taşınması raporda önerildi. */
.ts-track{flex:1 1 auto;min-height:0;width:100%;display:flex;align-items:flex-end}
.ts-track>.bar{width:100%}

/* test seçici çip rayı — dar ekranda yatay kayar, taşma sayılmaz */
.ts-pick{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none;margin-bottom:18px}
.ts-pick::-webkit-scrollbar{display:none}
.ts-pick .fgroup{flex-wrap:nowrap;padding-top:0}

/* "planıma eklendi" durum satırı — ikon + metin, renkten bağımsız okunur */
.ts-status{display:none;align-items:center;gap:9px;margin-top:14px;font-size:13px;font-weight:700;color:var(--fit-deep)}
.ts-status.show{display:flex}
.ts-status i{font-size:13px}

.ts-acts{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}

@media (max-width:640px){
  .ts-scale{grid-template-columns:minmax(0,1fr)}
  .ts-acts .btn{width:100%;justify-content:center}
}