/* ============================================================================
 * DISTANCE OF LIFE — "SADE" TEMA KATMANI
 * ----------------------------------------------------------------------------
 * Bu dosya index.html'i DEĞİŞTİRMEZ. Mevcut tema ailesi mantığının üzerine
 * (theme-klasik / theme-kirmizi ile aynı desen) dördüncü bir aile ekler:
 *
 *     body.theme-sade            → koyu (varsayılan)
 *     body.theme-sade.light      → açık
 *
 * KURULUM — index.html'de 3 küçük ekleme:
 *
 * 1) <head> içinde, MEVCUT TÜM <style> bloklarından SONRA:
 *      <link rel="stylesheet" href="theme-sade.css">
 *
 * 2) setThemeFamily() ve iki adet remove() satırında listeye 'theme-sade' ekle:
 *      b.classList.remove('theme-klasik','theme-kirmizi','theme-sade');
 *      else if(fam==='sade') b.classList.add('theme-sade');
 *    (aynı ekleme loadThemeFamily ve sayfa açılış IIFE'sinde de yapılmalı)
 *
 * 3) Tema seçicisine (#themePicker) bir buton:
 *      <button class="theme-opt" data-theme="sade" onclick="setThemeFamily('sade')">
 *        <div class="theme-swatch theme-swatch-sade"></div>
 *        <div class="theme-opt-name">Sade</div>
 *        <div class="theme-opt-desc">Nötr · sessiz</div>
 *      </button>
 *
 * TASARIM DİLİ: tek vurgu rengi (#52AEBD), nötr siyah/grafit yüzeyler,
 * gradyan yok, neon parlaması yok, sistem yazı tipi, geniş yarıçap, gruplanmış
 * satır listeleri. Oyunlaştırma görünür ama sessiz.
 * ==========================================================================*/

/* ---------- 1. Değişkenler ---------- */
body.theme-sade{
  --bg:#000000;
  --surface:#1C1C1E;
  --surface2:#2C2C2E;
  --border:rgba(255,255,255,0.07);
  --accent:#52AEBD;
  --accent2:#52AEBD;
  --accent3:#52AEBD;
  --accent4:#52AEBD;
  --accent5:#52AEBD;
  --ring-color:#52AEBD;
  --text:#FFFFFF;
  --muted:rgba(235,235,245,0.60);
  --radius:22px;

  --fd-line:rgba(255,255,255,.07);
  --fd-line-h:rgba(255,255,255,.14);
  --fd-track:#3A3A3C;
  --fd-inset:rgba(255,255,255,.04);
  --fd-inset2:rgba(255,255,255,.06);
  --fd-text2:rgba(235,235,245,.60);
  --fd-faint:rgba(235,235,245,.40);
  --fd-shadow:none;
  --fd-shadow-h:none;
}
body.theme-sade.light{
  --bg:#F2F2F7;
  --surface:#FFFFFF;
  --surface2:#F2F2F7;
  --border:rgba(0,0,0,0.07);
  --text:#000000;
  --muted:rgba(60,60,67,0.60);
  --fd-line:rgba(0,0,0,.07);
  --fd-line-h:rgba(0,0,0,.14);
  --fd-track:#E5E5EA;
  --fd-inset:rgba(0,0,0,.03);
  --fd-inset2:rgba(0,0,0,.05);
  --fd-text2:rgba(60,60,67,.60);
  --fd-faint:rgba(60,60,67,.40);
}

/* ---------- 2. Zemin: parıltı ve doku yok ---------- */
body.theme-sade{
  background-image:none !important;
  background-color:var(--bg);
  -webkit-font-smoothing:antialiased;
}

/* ---------- 3. Tipografi: tek sistem yazı tipi ----------------------------
 * README bolum 6: "Tek aile ... Space Grotesk / Bebas Neue / JetBrains Mono /
 * DM Sans KULLANILMAZ." Bu dort aile uygulamanin her yerinde, cogu zaman satir
 * ici stille dagitilmis durumda; tek tek secici kovalamak yerine 18.2'deki
 * golge supurgesiyle ayni desen: tek supurge, sonra kasitli istisnalar.
 * Kapsam yalnizca .theme-sade govdesi — diger temalar etkilenmez.           */
body.theme-sade,
body.theme-sade *{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif !important;
  font-synthesis:none;
}
/* Mono yazi tipi gidince sayi sutunlari kayiyordu; hizayi rakam genisligiyle
   koru (gorsel dil bozulmadan tablo/istatistik okunur kalir). */
body.theme-sade .fd-mono,
body.theme-sade .stat-val,
body.theme-sade .full-stat-val,
body.theme-sade .bar-val,
body.theme-sade .macro-val,
body.theme-sade .pm-val,
body.theme-sade .kingdom-time-total,
body.theme-sade .kingdom-pop,
body.theme-sade .sd-metric-val,
body.theme-sade .sd-lvl-xp,
body.theme-sade .sd-lvl-num,
body.theme-sade .profile-since,
body.theme-sade #versionTag{
  font-variant-numeric:tabular-nums;
}
body.theme-sade .app-title{
  background:none;
  -webkit-text-fill-color:var(--text);
  color:var(--text);
  font-size:28px;
  font-weight:700;
  letter-spacing:-.5px;
}
body.theme-sade .login-logo{
  background:none;
  -webkit-text-fill-color:var(--text);
  color:var(--text);
  letter-spacing:-.5px;
}
body.theme-sade .card-title{
  font-size:17px;
  font-weight:600;
  letter-spacing:-.2px;
}
body.theme-sade .stat-val,
body.theme-sade .pm-val,
body.theme-sade .ring-info .val,
body.theme-sade .water-big .num{letter-spacing:-.4px;font-weight:600;}
body.theme-sade .stat-label{font-size:12px;letter-spacing:0;text-transform:none;}
body.theme-sade .section-sep,
body.theme-sade .section-sep2{
  font-size:13px;font-weight:600;letter-spacing:.06em;
  color:var(--muted);border-bottom:none;padding:16px 4px 8px;
}

/* ---------- 4. Kart: düz yüzey, gölge yok ---------- */
body.theme-sade .card{
  background:var(--surface) !important;
  border:none;
  border-radius:22px;
  box-shadow:none !important;
}
body.theme-sade .card:hover{box-shadow:none !important;}
body.theme-sade .card::before,
body.theme-sade .card::after{display:none !important;}

/* ---------- 5. Vurgu noktaları ve rozetler: sessiz ---------- */
body.theme-sade .dot,
body.theme-sade .dot.b,
body.theme-sade .dot.r,
body.theme-sade .dot.o{background:var(--accent);box-shadow:none !important;}
body.theme-sade .badge,
body.theme-sade .badge.g,
body.theme-sade .badge.b,
body.theme-sade .badge.o,
body.theme-sade .badge.r{
  background:var(--surface2);color:var(--muted);
  border-radius:8px;font-size:12px;
}
body.theme-sade .stat-val.g,
body.theme-sade .stat-val.b,
body.theme-sade .stat-val.o,
body.theme-sade .stat-val.r,
body.theme-sade .stat-val.p{color:var(--text);}

/* ---------- 6. Sekmeler: dolgu yerine seçili blok ---------- */
body.theme-sade .tgroup{
  background:var(--surface) !important;
  border:none;border-radius:14px;
  color:var(--muted);font-weight:500;
  box-shadow:none !important;transform:none !important;
}
body.theme-sade .tgroup.active{
  background:var(--surface2) !important;
  color:var(--text);font-weight:600;
  box-shadow:none !important;
}
body.theme-sade .tab{border:none;border-radius:20px;font-size:13px;}
body.theme-sade .tab.active{
  background:var(--surface2) !important;
  color:var(--text);box-shadow:none !important;
}
body.theme-sade .tab-edit-btn,
body.theme-sade .tab-edit-btn.on{
  background:var(--surface) !important;border:none;border-radius:12px;
  color:var(--muted);
}
body.theme-sade .tab-edit-btn.on{color:var(--accent);}

/* ---------- 7. Butonlar: tek vurgu, gradyan yok ---------- */
body.theme-sade .btn,
body.theme-sade .btn.b2,
body.theme-sade .btn.b4{
  background:var(--accent) !important;
  color:#00252B;
  border-radius:14px;padding:11px 18px;font-weight:600;
  box-shadow:none !important;
}
body.theme-sade .btn:hover{filter:brightness(1.06);box-shadow:none !important;}
body.theme-sade .btn.ghost{
  background:var(--surface2) !important;
  color:var(--text);border:none;
}
body.theme-sade .btn-danger{
  background:var(--surface2);color:#FF453A;border:none;border-radius:14px;
}
body.theme-sade .btn-danger:hover{background:rgba(255,69,58,.16);}
body.theme-sade .btn-logout-big{
  background:var(--surface2);border:none;border-radius:14px;color:var(--text);
}
body.theme-sade .login-btn{background:var(--accent);color:#00252B;box-shadow:none;}
body.theme-sade .danger-zone{border:none;background:var(--surface);border-radius:18px;}
body.theme-sade .danger-title{color:#FF453A;}
body.theme-sade .ripple{display:none;}

/* ---------- 8. Girdi alanları ---------- */
body.theme-sade .input,
body.theme-sade .textarea,
body.theme-sade select,
body.theme-sade input[type="text"],
body.theme-sade input[type="number"],
body.theme-sade input[type="date"],
body.theme-sade input[type="time"],
body.theme-sade input[type="email"],
body.theme-sade input[type="password"]{
  background:var(--surface2);border:none;border-radius:12px;color:var(--text);
}
body.theme-sade .food-img-upload{
  background:var(--surface2);border:1px dashed var(--fd-line-h);border-radius:14px;
}
body.theme-sade .food-img-upload:hover{background:var(--surface2);border-color:var(--accent);}

/* ---------- 9. İstatistik kutuları ve satır listeleri ---------- */
body.theme-sade .stat-box,
body.theme-sade .full-stat{
  background:var(--surface2);border:none;border-radius:16px;
}
body.theme-sade .stat-grid{gap:12px;}

/* ---------- 10. Çubuklar ve halkalar: tek renk ---------- */
body.theme-sade .bar-bg{background:var(--fd-track);border-radius:4px;height:6px;}
body.theme-sade .bar-fill{background:var(--accent) !important;border-radius:4px;}
body.theme-sade .header-xp-fill{background:var(--accent) !important;}
body.theme-sade .bar-shine{animation:none;}
body.theme-sade .progress-fill,
body.theme-sade .prog-fill{background:var(--accent) !important;box-shadow:none !important;}

/* ---------- 11. Alt gezinme (3a: yuzen hap + ortada Ana Sayfa) ---------- */
body.theme-sade .bottom-nav{
  background:rgba(28,28,30,.86);
  backdrop-filter:saturate(180%) blur(24px);
  -webkit-backdrop-filter:saturate(180%) blur(24px);
  border:1px solid rgba(255,255,255,.09);
  box-shadow:none;
}
body.theme-sade.light .bottom-nav{
  background:rgba(255,255,255,.86);border-color:var(--border);
}
body.theme-sade .bn-item{color:var(--muted);}
body.theme-sade .bn-item.active,
body.theme-sade .bn-item.active .bn-lbl{color:var(--accent);}
/* Ortadaki Ana Sayfa: tek vurgu rengi, vurgu ustu koyu metin, parlama yok.
   Halka rengi zeminle ayni olmali ki buton navdan "kesilmis" gorunsun. */
body.theme-sade .bn-item.bn-home{
  background:var(--accent);
  color:#00252B;
  border-color:var(--bg);
  box-shadow:none;
}

/* ---------- 12. Oyunlaştırma: görünür ama sessiz ---------- */
body.theme-sade .na-hero{
  background:var(--surface) !important;border:none !important;box-shadow:none !important;
}
body.theme-sade .na-hero-ring,
body.theme-sade .na-lvl-circle .na-week-cell{box-shadow:none !important;}
body.theme-sade .na-hero-bar-fill{background:var(--accent) !important;box-shadow:none !important;}
body.theme-sade .na-hero-streak,
body.theme-sade .na-quests-title{color:var(--muted);}
body.theme-sade .na-week-cell.on{background:var(--accent) !important;}
body.theme-sade .na-week-cell.today{background:var(--surface2) !important;box-shadow:inset 0 0 0 2px var(--accent) !important;}
body.theme-sade .na-badge.unlocked{background:var(--surface2);border-color:transparent;}
body.theme-sade .mot-bar{background:var(--surface) !important;}
body.theme-sade .mot-text{color:var(--muted) !important;}

/* ---------- 13. Kalan gradyan / parlama süpürgesi ---------- */
body.theme-sade .pomo-dot.active,
body.theme-sade .city-cell.selected,
body.theme-sade .habit-check,
body.theme-sade .app-logo-img{box-shadow:none !important;}

/* ---------- 14. Tema seçici için "Sade" örneği ---------- */
.theme-swatch-sade{background:#000;border:1px solid rgba(255,255,255,.12);position:relative;}
.theme-swatch-sade::after{
  content:"";position:absolute;left:50%;top:50%;
  width:38%;height:38%;margin:-19% 0 0 -19%;
  border-radius:50%;background:#52AEBD;
}

/* ---------- 14b. Dokunma hedefleri: hicbir yerde 44px altina inme ----------
 * README bolum 7: "Dokunma hedefi: hicbir yerde 44px altina inmez." Olctum,
 * inmisti: form alanlari 35-43px, filtre cipleri 27px, gun sekmeleri 38px,
 * katlanan baslik satirlari 22px. Yukseklik min-height ile aciliyor; genislik
 * zaten yeterliydi (en dar buton 50px).
 * Kapsam yalnizca .theme-sade — diger temalarin yerlesimi degismez.        */
body.theme-sade .inp,
body.theme-sade .sel,
body.theme-sade .input,
body.theme-sade .btn,
body.theme-sade .fd-input,
body.theme-sade .fd-sel,
body.theme-sade .fd-btn,
body.theme-sade .flt-btn,
body.theme-sade .st-quick,
body.theme-sade .rota-day-tab,
body.theme-sade .prog-day-tab,
body.theme-sade .diet-day,
body.theme-sade .water-btn,
body.theme-sade .mood-btn,
body.theme-sade .qa-opt,
body.theme-sade .theme-opt,
body.theme-sade .tmode-btn,
body.theme-sade .watch-flt,
body.theme-sade .pomo-btn,
body.theme-sade .kview-btn,
body.theme-sade .rem-day,
body.theme-sade .med-info-btn,
body.theme-sade .companion-chip,
body.theme-sade .lb-sort-btn,
body.theme-sade .sound-toggle,
body.theme-sade .btn-logout-big,
body.theme-sade select,
body.theme-sade input[type="text"],
body.theme-sade input[type="number"],
body.theme-sade input[type="date"],
body.theme-sade input[type="time"],
body.theme-sade input[type="email"],
body.theme-sade input[type="password"]{
  min-height:44px;
}
/* Bazi butonlar yeterince yuksek ama cok dar (35-38px). Genislik tabani. */
body.theme-sade .btn,
body.theme-sade .fd-btn,
body.theme-sade .lb-sort-btn,
body.theme-sade .kview-btn,
body.theme-sade .watch-flt,
body.theme-sade .flt-btn{
  min-width:44px;
}
/* .rem-day BILEREK disarida: 7 gun cipi tek satira sigiyor (46px), 44px taban
   verilince satir kayiyor ve son cip tam genislige uzuyordu. Yukseklik 44px,
   genislik 38-46px — yan yana dizili ciplerde bu yeterli. */
/* Katlanan kart basliklari satir yuksekligi kadar kaliyordu; dokunulabilir
   satira cikariliyor. */
body.theme-sade .collapse-head{
  min-height:44px;
  display:flex;
  align-items:center;
}
/* Bugun ekranindaki "+ 250 ml" 3a'da bilerek 34px. Gorunum korunuyor, dokunma
   alani gorunmez bir katmanla 44px'e tasiniyor. */
/* Kompakt kalmasi gereken kucuk butonlar: gorunum ayni, dokunma alani 44px.
   .tap44 sinifi index.html'de elle veriliyor (satir ici stilli, sinifsiz
   butonlar icin baska tutamak yok). */
body.theme-sade .tap44{position:relative;}
body.theme-sade .tap44::after{
  content:"";
  position:absolute;
  left:50%;top:50%;
  width:44px;height:44px;
  transform:translate(-50%,-50%);
}
body.theme-sade .rota-chip{min-height:44px;}
body.theme-sade #notifHeader,
body.theme-sade [id^="rpSeg"],
body.theme-sade .up{min-height:44px;}
body.theme-sade #notifHeader{display:flex;align-items:center;}
/* AI kredi rozeti kart basligi satirinda; satiri buyutmeden dokunma alani ver */
body.theme-sade .ai-credit{position:relative;}
body.theme-sade .ai-credit::after{
  content:"";position:absolute;left:50%;top:50%;
  width:44px;height:44px;transform:translate(-50%,-50%);
}
body.theme-sade .sd-metric-btn{position:relative;}
body.theme-sade .sd-metric-btn::after{
  content:"";
  position:absolute;
  left:0;right:0;
  top:50%;
  height:44px;
  transform:translateY(-50%);
}

/* ---------- 15. Hareket azaltma tercihine saygı ---------- */
/* Gecis suresi: README bolum 7 "200-250ms ease". Uygulamanin varsayilani
   .3s; Sade'de tasarimin araligina cekiliyor. Hareket azaltma tercihi
   index.html'deki genel blokta ele aliniyor (tum temalar icin). */
body.theme-sade .section.active{animation-duration:.24s;}
@media (prefers-reduced-motion:reduce){
  body.theme-sade .section.active{animation:none;}
}

/* ============================================================================
 * 16. SIZINTI KAPATMA — index.html'de SABİT KODLANMIŞ neon renkler
 * ----------------------------------------------------------------------------
 * Bölüm 1–15 tema değişkenlerini nötrleştiriyor, ama temel CSS'te renkleri
 * değişkenden almayan (rgba(200,241,53), #7ef5ff, rgba(255,46,136)… ) kurallar
 * var. Bunlar Sade temada da olduğu gibi çiziliyordu. Aşağısı yalnızca onları
 * kapatır — var(--accent*) kullanan gradyanlar zaten tek renge düşüyor (tüm
 * accent'ler #52AEBD), onlara dokunmaya gerek yok.
 * ==========================================================================*/

/* ---------- 16.1 İlerleme çubukları: düz tek renk ---------- */
body.theme-sade .pbar.g,
body.theme-sade .pbar.b,
body.theme-sade .pbar.o,
body.theme-sade .pbar.r,
body.theme-sade .water-bar-fill,
body.theme-sade .diet-summary-fill,
body.theme-sade .prog-summary-fill,
body.theme-sade .watch-ep-fill,
body.theme-sade .upgrade-bar-fill{
  background:var(--accent) !important;
}
body.theme-sade .glass.on::after{background:var(--accent) !important;opacity:.9;}

/* ---------- 16.2 Seçili hap / çip / mesaj: düz vurgu + koyu metin ---------- */
body.theme-sade .diet-day.active,
body.theme-sade .ex-chk.on,
body.theme-sade .prog-day-tab.active,
body.theme-sade .cmsg.user,
body.theme-sade .pw-cta.primary,
body.theme-sade .ai-plan-bar .pill.paid,
body.theme-sade .header-plan.paid{
  background:var(--accent) !important;
  color:#00252B !important;
  border-color:transparent !important;
}

/* ---------- 16.3 Gradyanlı yüzeyler: düz kart ---------- */
body.theme-sade .pwa-card,
body.theme-sade .goal-add-card,
body.theme-sade .pm-box,
body.theme-sade .ai-box,
body.theme-sade .fd-card,
body.theme-sade .fd-hero,
body.theme-sade .iso-stage{
  background:var(--surface) !important;
  border-color:var(--border) !important;
  box-shadow:none !important;
}
body.theme-sade .watch-poster{background:var(--surface2) !important;}
body.theme-sade .ai-box::before{background:var(--accent) !important;}
body.theme-sade .fd-sec .ln{background:var(--fd-line) !important;}
body.theme-sade .rota-now-line{background:var(--accent) !important;}

/* ---------- 16.4 Avatarlar: nötr yüzey, neon çerçeve yok ---------- */
body.theme-sade .avatar,
body.theme-sade .header-avatar{
  background:var(--surface2) !important;
  border-color:var(--border) !important;
}
body.theme-sade .ai-avatar{background:var(--accent) !important;color:#00252B;}

/* ---------- 16.5 Parlamalar: tamamen kaldır ---------- */
body.theme-sade .login-logo-img,
body.theme-sade .rota-insert-line,
body.theme-sade .goal-item.goal-r,
body.theme-sade .goal-item.goal-o,
body.theme-sade .goal-item.goal-g,
body.theme-sade .inst-dot.active-dot,
body.theme-sade .watch-card.editing,
body.theme-sade .pet-face.legend,
body.theme-sade .fd-ico,
body.theme-sade .fd-ico.lime,
body.theme-sade .fd-ico.teal,
body.theme-sade .fd-ico.amber,
body.theme-sade .fd-ico.pink,
body.theme-sade .fd-ico.purple,
body.theme-sade .qa-fab{
  box-shadow:none !important;
}
/* Renkle kodlanmış ikon kutuları tek yüzeye iner (ayrım renkle değil,
   tipografi ve boşlukla yapılır — bkz. README bölüm 6). */
body.theme-sade .fd-ico,
body.theme-sade .fd-ico.lime,
body.theme-sade .fd-ico.teal,
body.theme-sade .fd-ico.amber,
body.theme-sade .fd-ico.pink,
body.theme-sade .fd-ico.purple{background:var(--surface2) !important;}
body.theme-sade .goal-item.goal-r,
body.theme-sade .goal-item.goal-o,
body.theme-sade .goal-item.goal-g{border-left-color:var(--accent) !important;}
body.theme-sade .inst-dot.active-dot,
body.theme-sade .watch-card.editing,
body.theme-sade .pet-face.legend{border-color:var(--accent) !important;}
body.theme-sade .qa-fab{background:var(--accent) !important;color:#00252B;}

/* ---------- 16.6 Krallık / izometrik harita: parıltı yok ---------- */
body.theme-sade .city-cell.bmax{
  background:var(--surface2) !important;
  border-color:var(--accent) !important;
}
body.theme-sade .iso-tile.sel,
body.theme-sade .iso-bld.lv3 svg,
body.theme-sade .iso-bld.lv4 svg,
body.theme-sade .iso-bld.bmax svg,
body.theme-sade .iso-bld.sel svg,
body.theme-sade .city-cell.lv3 .cell-ewrap,
body.theme-sade .city-cell.lv4 .cell-ewrap{
  filter:none !important;
}
/* .iso-emoji'nin gölgesi neon değil, OKUNABİLİRLİK içindir (emoji haritanın
   üstünde duruyor) — bilerek bırakıldı. */

/* ---------- 16.6b Parsel ızgarası: Sade parsel dili (9a §5) ----------------
   Izgara boyutu (4x4 / 6x6 / 9x9) DEGISMEZ — yalnizca gorsel dil sadelesir:
   kesikli kenarlik yerine ic cerceve, gradyan/parlama yok, olcek animasyonu yok.
   Uygulanan iki durum: "Buyuyor" (dolu parsel) ve "Bos parsel". Tasarimdaki
   Duraklamis / Insaatta / Kilitli durumlari veri karsiligi olmadigi icin YOK. */
/* Mevsim tonu satir ici stil olarak yaziliyor (renderKingdom); Sade'de
   gradyan yok, o yuzden !important ile duz zemine indiriliyor. */
body.theme-sade .city-grid{gap:8px;padding:0;background:transparent !important;}
body.theme-sade .city-cell{
  background:var(--surface2);
  border:none;
  border-radius:16px;
  padding:9px;
  transition:background .18s;
}
body.theme-sade .city-cell:hover{
  background:var(--fd-track);
  border:none;
  transform:none;
}
body.theme-sade .city-cell.selected{
  box-shadow:inset 0 0 0 1.5px var(--accent) !important;
  border:none;
}
/* Bos parsel: seffaf zemin + ince ic cerceve, ortada arti ve etiket.
   !important sart: bolum 18.2'deki "body.theme-sade *{box-shadow:none}"
   supurgesi kasitli ic halkalari da siliyor — dosyanin kurali, geri vermek. */
body.theme-sade .city-cell.empty-cell{
  background:transparent !important;
  border:none;
  box-shadow:inset 0 0 0 1.5px var(--fd-line-h) !important;
}
body.theme-sade .kplot-sw.empty{
  box-shadow:inset 0 0 0 1.5px var(--fd-line-h) !important;
}
body.theme-sade .cell-plus{
  font-weight:300;
  color:var(--fd-faint);
  line-height:1;
}
body.theme-sade .cell-empty-lbl{
  color:var(--fd-faint);
  text-shadow:none;
  font-weight:600;
}
/* Seviye rozeti: koyu hap degil, duz vurgu metni */
body.theme-sade .city-cell .cell-lv{
  background:transparent;
  padding:0;
  font-size:10px;
  font-weight:600;
  color:var(--accent);
}
body.theme-sade .city-cell .cell-lv.maxed{
  background:transparent;
  color:var(--muted);
}
body.theme-sade .city-cell .cell-label{
  font-size:10.5px;
  font-weight:600;
  text-shadow:none;
}
/* Mini ilerleme cubugu: 3px, tek renk */
body.theme-sade .cell-progress{
  height:3px;
  background:var(--fd-track);
  border-radius:2px;
}
body.theme-sade .cell-progress-fill{
  background:var(--accent);
  border-radius:2px;
}

/* ---------- 16.7 Nefes çemberi: parıltı yerine düz halka ---------- */
body.theme-sade .med-breath-circle{
  background:rgba(82,174,189,.18) !important;
  box-shadow:inset 0 0 0 2px var(--accent) !important;
}

/* ---------- 16.8 Gradyan yazı: düz metin ---------- */
body.theme-sade .pw-title{
  background:none !important;
  -webkit-text-fill-color:var(--text);
  color:var(--text);
  font-weight:700;
}

/* ---------- 16.9 Durum şeritleri: düz renk + sistem yazı tipi ---------- */
body.theme-sade .offline-bar{
  background:#FF9F0A !important;color:#00252B !important;box-shadow:none !important;
}
body.theme-sade .offline-bar.synced{background:var(--accent) !important;}
body.theme-sade .verify-bar{
  background:var(--surface2) !important;color:var(--text) !important;box-shadow:none !important;
}
body.theme-sade .offline-bar,
body.theme-sade .verify-bar{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
}

/* ============================================================================
 * 17. SATIR-İÇİ style="" SIZINTILARI
 * ----------------------------------------------------------------------------
 * index.html'de bazı öğelerin neon rengi doğrudan style özniteliğinde duruyor
 * (ör. header'daki "Lv 1" rozeti). Satır-içi stili yalnızca !important ezebilir.
 * Burada YALNIZCA kararlı bir id/sınıfı olanlar kapatılıyor; geri kalanlar
 * Katman B'de işaretlemeden temizlenmeli (bkz. README bölüm 2).
 * ==========================================================================*/
body.theme-sade #xpMini{
  background:var(--surface2) !important;
  border-color:transparent !important;
  color:var(--accent) !important;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif !important;
}
body.theme-sade #checkinToggleBtn,
body.theme-sade .todo-cat{
  background:var(--surface2) !important;
  border-color:transparent !important;
  color:var(--muted) !important;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif !important;
}
body.theme-sade #watchSaveBtn{background:var(--accent) !important;color:#00252B !important;}
body.theme-sade #pomoFinishBtn,
body.theme-sade #pomoSkipBreakBtn{
  border-color:var(--border) !important;
  color:var(--accent) !important;
}
/* .dot'un rengi bazı yerlerde satır-içi veriliyor — tek vurgu kuralı gereği ezilir. */
body.theme-sade .dot,
body.theme-sade .dot.b,
body.theme-sade .dot.r,
body.theme-sade .dot.o{background:var(--accent) !important;}

/* ============================================================================
 * 18. TON DEĞİŞKENLERİ + GENEL GÖLGE SÜPÜRGESİ
 * ==========================================================================*/

/* ---------- 18.1 Vurgu tonları (index.html'de --tint* olarak tanımlı) ------ */
body.theme-sade{
  --tint:rgba(82,174,189,.12);
  --tint-bd:rgba(82,174,189,.28);
  --tint2:rgba(82,174,189,.12);
  --tint2-bd:rgba(82,174,189,.28);
  --accent5:#52AEBD;
}

/* ---------- 18.2 Gölge yok ------------------------------------------------
 * README bölüm 6: "Gölge: yok (tek istisna: alt gezinme blur)". Tek tek
 * seçici kovalamak yerine tek süpürge; kasıtlı iç halkalar aşağıda geri
 * verilir (daha yüksek özgüllük, sıra fark etmez).                          */
body.theme-sade *{ box-shadow:none !important; }
body.theme-sade .na-week-cell.today{ box-shadow:inset 0 0 0 2px var(--accent) !important; }
body.theme-sade .med-breath-circle{ box-shadow:inset 0 0 0 2px var(--accent) !important; }

/* ---------- 18.3 Kalan neon kenarlıklar ---------------------------------- */
body.theme-sade .consent-trigger:hover,
body.theme-sade .consent-check-row:hover,
body.theme-sade .consent-check-row.checked,
body.theme-sade .reg-consent-item.ok{
  border-color:var(--accent) !important;
  background:var(--tint) !important;
}
body.theme-sade .mot-btn{
  background:var(--surface2) !important;
  border-color:transparent !important;
  color:var(--accent) !important;
}
body.theme-sade .logout-btn{
  background:var(--surface2) !important;
  border-color:transparent !important;
  color:var(--muted) !important;
}
body.theme-sade .logout-btn:hover{ background:var(--fd-track) !important; }
body.theme-sade .login-err{
  background:rgba(255,69,58,.12) !important;
  border-color:transparent !important;
  color:#FF453A !important;
}
body.theme-sade .pw-success{
  background:var(--tint) !important;
  border-color:transparent !important;
  color:var(--accent) !important;
}

/* ============================================================================
 * 19. RGB ÜÇLÜLERİ — tek vurgu kuralının kök noktası
 * ----------------------------------------------------------------------------
 * index.html'de 186 yerde sabit kodlu olan rgba() tonları artık bu altı
 * değişkenden besleniyor. Hepsini tek vurguya indirmek, teker teker seçici
 * ezmeden bütün ton/kenarlık sızıntılarını kapatır.
 * Uyarı (#FF9F0A) ve yıkıcı (#FF453A) bilerek dışarıda — onlar renkle anlam
 * taşır, bkz. README bölüm 6.
 * ==========================================================================*/
body.theme-sade{
  --accent-rgb:82,174,189;
  --accent2-rgb:82,174,189;
  --accent3-rgb:82,174,189;
  --accent4-rgb:82,174,189;
  --pink-rgb:82,174,189;
  --purple-rgb:82,174,189;
}
/* Kenarlık nötr kalmalı — vurgu rengiyle çerçevelenmiş kart istemiyoruz. */
body.theme-sade{ --border:rgba(255,255,255,0.07); }
body.theme-sade.light{ --border:rgba(0,0,0,0.07); }

/* ---------- 19.1 Anlam tasiyan renkler: Sade jetonlarina hizala ----------- */
body.theme-sade{
  --danger:#FF453A;  --danger-rgb:255,69,58;
  --warn:#FF9F0A;    --warn-rgb:255,159,10;
}
body.theme-sade.light{
  --danger:#FF3B30;  --danger-rgb:255,59,48;
  --warn:#FF9500;    --warn-rgb:255,149,0;
}

/* Kategori çipleri tek vurguya iner; üstündeki metin okunur kalsın. */
body.theme-sade .watch-flt.active{ color:#00252B !important; }
/* .cat-film zemini %15 saydam ton - metin vurgu renginde kalmali. */
body.theme-sade .cat-film{ color:var(--accent) !important; }
