/* ─────────── 0. TEMEL & DEĞİŞKENLER ─────────── */
*{margin:0;padding:0;box-sizing:border-box}
:root{
  /* ══════════════════════════════════════════════════════════════
     TİP ÖLÇEĞİ (r140)

     Ölçüm: dosyada 12 ayrı yazı boyutu vardı (8·9·10·11·12·13·14·16·
     17·21·26·42). Bu bir ölçek değil, zamanla oluşmuş bir kayma —
     hiçbir şey öne çıkmıyor çünkü her şey birbirine yakın.

     Altı basamağa indirildi. Basamaklar 1.25 oranıyla ilerler:
       kunye  10   — rozet, alt yazı, birim
       govde  12.5 — okunacak metin
       ara    14   — vurgulu satır, düğme
       baslik 17   — bölüm başlığı
       one    22   — sayfa başlığı, sayı
       sahne  42   — sayaç (tek başına, imza)

     DİSPLAY YÜZÜ: Amiri. Uygulama Arapça için zaten onu taşıyor;
     Türkçe başlıklarda da kullanınca iki yazı tek sese dönüşüyor.
     Gövde metni Google Sans/sistem yüzünde kalır — okunurluk için. */
  --t-kunye:10px;
  --t-govde:12.5px;
  --t-ara:14px;
  --t-baslik:17px;
  --t-one:22px;
  --t-sahne:clamp(34px,11vw,46px);
  --f-display:"Amiri",Georgia,"Times New Roman",serif;
  --serif:var(--f-display);
  --f-ui:"Figtree","Google Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-mono:ui-monospace,"SFMono-Regular",Consolas,"Liberation Mono",monospace;

  /* r102: YÜZEY RENKLERİ TEMAYA BAĞLANDI.
     Kart camı, sayfa zeminleri ve girdi alanları Zümrüt'ün yeşilimsi
     tonuna SABİT yazılmıştı; Gül temasında kırmızı zeminin üstünde
     yeşil kartlar duruyordu. Kanal listesi olarak tutulur ki alfa ayrı
     verilebilsin: rgba(var(--yuzeyK),.75) */
  --yuzeyK:10,24,20;
  --sayfaK:9,22,19;
  --sayfa2K:6,15,13;
  --girdiK:6,20,18;
  --vurguK:20,50,45;

  --ok:#3fbf7f; --okbg:rgba(63,191,127,.14);
  --rec:#e0574a; --recbg:rgba(224,87,74,.15);
  --uyari:#e0a53a; --uyaribg:rgba(224,165,58,.14);
  --bilgi:#4aa3d0;

  --bg:#05090c;
  --bg2:#091411;
  --e1:0 2px 8px -4px rgba(0,0,0,.5);
  --e2:0 8px 22px -12px rgba(0,0,0,.62);
  --e3:0 14px 38px -14px rgba(0,0,0,.72);
  --e4:0 20px 56px -16px rgba(0,0,0,.82);
  --panel:rgba(var(--sayfaK),.74);
  --card:var(--panel);
  --card2:rgba(var(--sayfa2K),.78);
  --line:color-mix(in srgb,var(--gold) 16%,transparent);
  --line2:color-mix(in srgb,var(--gold) 34%,transparent);
  --gold:#c9a227;
  --goldh:#ecd27e;
  --ivory:#efe7d3;
  --text:var(--ivory);
  --mut:#93a89e;
  --dim:#5d7168;
  --danger:#c25b4e;
  --r:16px;
  --fD:'Cormorant Garamond',Georgia,'Times New Roman',serif;
  --fA:'Amiri','Scheherazade New',serif;
  --fB:'Figtree',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --glassA:0.82;
  --bgGrad:radial-gradient(1100px 640px at 50% -8%,rgba(var(--vurguK),.55),transparent 62%),radial-gradient(860px 620px at 88% 108%,rgba(15,34,66,.45),transparent 60%),linear-gradient(180deg,#081310,#050b0e 55%,#04070a);
  --ebru1:#0d2b26;--ebru2:#12352e;--ebru3:#0e2a3d;--ebru4:#173043;--ebru5:#175646;
  --photic:radial-gradient(ellipse at 50% 42%,#f6e7b4 0%,#cfa92e 65%,#8a7018 100%);
}
/* ═══ TEMALAR ═══ */
body[data-tema="zumrut"]{--bgGrad:radial-gradient(1100px 640px at 50% -8%,rgba(19,64,53,.55),transparent 62%),radial-gradient(860px 620px at 88% 108%,rgba(15,34,66,.45),transparent 60%),linear-gradient(180deg,#081310,#050b0e 55%,#04070a);--ebru1:#0d2b26;--ebru2:#12352e;--ebru3:#0e2a3d;--ebru4:#173043;--ebru5:#175646;--photic:radial-gradient(ellipse at 50% 42%,#f6e7b4 0%,#cfa92e 65%,#8a7018 100%)}
body[data-tema="gul"]{--yuzeyK:40,14,20;--sayfaK:38,14,20;--sayfa2K:26,9,13;--girdiK:34,12,17;--vurguK:96,28,42;--ok:#93a67c;--bg:#0f070a;--gold:#d9a05f;--goldh:#f0c78f;--ivory:#f3e6de;--mut:#c9a8a0;--dim:#8a6a66;--line:rgba(217,160,95,.18);--line2:rgba(217,160,95,.45);--danger:#c25b6e;--bgGrad:radial-gradient(1100px 640px at 50% -8%,rgba(142,58,76,.4),transparent 62%),radial-gradient(860px 620px at 88% 108%,rgba(90,26,40,.42),transparent 60%),linear-gradient(180deg,#1c0d12,#12080c 55%,#0d0609);--ebru1:#2a1016;--ebru2:#3d1620;--ebru3:#4a1a26;--ebru4:#5c2530;--ebru5:#1a0b10;--photic:radial-gradient(ellipse at 50% 42%,#f0c78f 0%,#c45a6e 60%,#6e2030 100%);--ok:#93a67c;--rec:#d9524a;--uyari:#d99a3a;--bilgi:#c98fb0;--emerald:#6d2733;--teal:#9c4b5a}
/* ══════════════════════════════════════════════════════════════════
   CANLI TEMALAR (r141)

   Mevcut 15 tema koyu ve sakin; kullanıcı daha canlı seçenek istedi.
   Dördü de aynı kurala uyar: ZEMİN KOYU KALIR (uzun seansta göz
   yormasın, AMOLED'de pil yesin), CANLILIK vurgu ve ışıkta olur.
   Her biri belirli bir VAKTE ya da hâle bağlı — süs değil, karşılık. */

/* ── FÎRÛZE SEMÂ — türkuaz & çini mavisi ──
   Selçuklu çinisi ve Semerkant kubbeleri. Gündüz açıklığı, ferahlık. */
body[data-tema="firuze"]{--yuzeyK:10,44,50;--sayfaK:8,38,44;--sayfa2K:5,26,31;--girdiK:9,34,40;--vurguK:16,110,120;
--bg:#04181d;--gold:#2fd4d4;--goldh:#8ff2ee;--ivory:#e6fbfa;--mut:#8fc4c8;--dim:#55868c;
--line:rgba(47,212,212,.20);--line2:rgba(47,212,212,.48);--danger:#ff6b7a;
--bgGrad:radial-gradient(1100px 640px at 50% -8%,rgba(20,150,160,.42),transparent 62%),radial-gradient(860px 620px at 88% 108%,rgba(12,90,105,.44),transparent 60%),linear-gradient(180deg,#07242b,#051a20 55%,#031216);
--ebru1:#0a3038;--ebru2:#0f4a52;--ebru3:#146a70;--ebru4:#1d8f92;--ebru5:#062026;
--photic:radial-gradient(ellipse at 50% 42%,#8ff2ee 0%,#2fd4d4 58%,#0a5f6b 100%);
--ok:#5fe0a8;--rec:#ff5f6d;--uyari:#ffc857;--bilgi:#7fd8ff;--emerald:#0f5f60;--teal:#2fd4d4}

/* ── ERGUVAN VAKTİ — mor & fuşya ──
   İstanbul'un erguvan mevsimi. Akşam üstü, vecd ve coşku. */
body[data-tema="erguvan"]{--yuzeyK:44,14,52;--sayfaK:38,12,46;--sayfa2K:26,8,32;--girdiK:34,11,42;--vurguK:120,26,120;
--bg:#150620;--gold:#e05fd0;--goldh:#ffa8ee;--ivory:#fae8fb;--mut:#c79ad4;--dim:#8a5f9a;
--line:rgba(224,95,208,.20);--line2:rgba(224,95,208,.48);--danger:#ff5f8a;
--bgGrad:radial-gradient(1100px 640px at 50% -8%,rgba(150,40,150,.44),transparent 62%),radial-gradient(860px 620px at 88% 108%,rgba(90,24,110,.46),transparent 60%),linear-gradient(180deg,#260d33,#1a0824 55%,#110518);
--ebru1:#2e0e3a;--ebru2:#451450;--ebru3:#5f1c6b;--ebru4:#7d2688;--ebru5:#1c0824;
--photic:radial-gradient(ellipse at 50% 42%,#ffa8ee 0%,#e05fd0 58%,#6b1a72 100%);
--ok:#7fe6b0;--rec:#ff5f7a;--uyari:#ffcf5f;--bilgi:#a8c8ff;--emerald:#5a1a68;--teal:#b455c9}

/* ── NAR ATEŞİ — kızıl & amber ──
   Nar tanesi ve mangal koru. Kabz vaktinde ısıtan, canlandıran. */
body[data-tema="nar"]{--yuzeyK:52,16,14;--sayfaK:44,13,11;--sayfa2K:30,9,8;--girdiK:40,12,10;--vurguK:140,38,26;
--bg:#1a0806;--gold:#ff8f3f;--goldh:#ffc07a;--ivory:#ffeee2;--mut:#d9a08c;--dim:#96685c;
--line:rgba(255,143,63,.20);--line2:rgba(255,143,63,.48);--danger:#ff4d4d;
--bgGrad:radial-gradient(1100px 640px at 50% -8%,rgba(180,50,30,.44),transparent 62%),radial-gradient(860px 620px at 88% 108%,rgba(120,30,20,.46),transparent 60%),linear-gradient(180deg,#2c0f0a,#1f0a07 55%,#150705);
--ebru1:#33110c;--ebru2:#4d1a10;--ebru3:#6e2814;--ebru4:#94391a;--ebru5:#1f0a07;
--photic:radial-gradient(ellipse at 50% 42%,#ffc07a 0%,#ff8f3f 58%,#8a2f14 100%);
--ok:#8fd97a;--rec:#ff4040;--uyari:#ffd24d;--bilgi:#ffb37a;--emerald:#6e2814;--teal:#e0703a}

/* ── ZÜMRÜT NURU — parlak yeşil & altın ──
   Uygulamanın kendi Zümrüt'ünün canlı kardeşi. Bast, ferahlık, şükür. */
body[data-tema="nur"]{--yuzeyK:8,48,34;--sayfaK:6,40,29;--sayfa2K:4,27,20;--girdiK:7,36,26;--vurguK:14,120,80;
--bg:#031a12;--gold:#3fe08f;--goldh:#9cffcb;--ivory:#e6fff2;--mut:#8fd0b0;--dim:#508a70;
--line:rgba(63,224,143,.20);--line2:rgba(63,224,143,.48);--danger:#ff6b7a;
--bgGrad:radial-gradient(1100px 640px at 50% -8%,rgba(18,150,100,.42),transparent 62%),radial-gradient(860px 620px at 88% 108%,rgba(10,95,66,.46),transparent 60%),linear-gradient(180deg,#06281c,#041e15 55%,#02140e);
--ebru1:#073522;--ebru2:#0b4d31;--ebru3:#106a44;--ebru4:#178f5c;--ebru5:#041e15;
--photic:radial-gradient(ellipse at 50% 42%,#9cffcb 0%,#3fe08f 58%,#0a5f40 100%);
--ok:#3fe08f;--rec:#ff5f6d;--uyari:#ffd24d;--bilgi:#7fe0d0;--emerald:#0f6a45;--teal:#2fc9a0}

/* ═══ AMOLED — MUTLAK SİYAH ═══
   OLED/AMOLED ekranlarda siyah piksel tamamen kapanır, akım çekmez.
   Bu tema zemini gerçek #000 yapar (koyu gri değil), gradyanları
   kaldırır ve süsleme katmanlarını kısar — uzun seanslarda gözle
   görülür pil tasarrufu sağlar. */
body[data-tema="amoled"]{--yuzeyK:14,14,14;--sayfaK:11,11,11;--sayfa2K:6,6,6;--girdiK:10,10,10;--vurguK:33,33,33;
  --bg:#000000;--gold:#c9a227;--goldh:#e8d493;--ivory:#efe7d3;
  --ink:#e6e2d8;--mut:#8e8a80;--dim:#5a5751;
  --line:rgba(201,162,39,.16);--line2:rgba(201,162,39,.34);
  --bgGrad:none;                       /* gradyan yok: her piksel gerçekten siyah */
  --panel:rgba(255,255,255,.028);
  --ebru1:#000;--ebru2:#050505;--ebru3:#000;--ebru4:#080604;--ebru5:#000;
  --photic:radial-gradient(ellipse at 50% 42%,#e8d493 0%,#c9a227 58%,#3a2f0c 100%);
  --ok:#3ea87a;--uyari:#d9a05f;--uyaribg:rgba(217,160,95,.1);--re:#c05a4a;
}
body[data-tema="amoled"]{background:#000}
/* arka plan dokusu ve ışıltılar kapalı — hem estetik hem pil */
body[data-tema="amoled"] #ebruC{opacity:.10}
body[data-tema="amoled"] .rStar,
body[data-tema="amoled"] .spark{display:none}
body[data-tema="amoled"] .card,
body[data-tema="amoled"] .chn{background:#000;border-color:rgba(201,162,39,.14)}
body[data-tema="amoled"] .sheet,
body[data-tema="amoled"] #logSheet,
body[data-tema="amoled"] #recSheet{background:#000}
body[data-tema="gece"]{--yuzeyK:22,28,40;--sayfaK:19,26,38;--sayfa2K:13,20,33;--girdiK:18,25,37;--vurguK:40,46,58;--bg:#080f1c;--gold:#c9a227;--goldh:#7fd4c1;--ivory:#e8eef2;--mut:#9db2bd;--dim:#5d7079;--line:rgba(46,143,127,.22);--line2:rgba(46,143,127,.5);--bgGrad:radial-gradient(1100px 640px at 50% -8%,rgba(46,143,127,.35),transparent 62%),radial-gradient(860px 620px at 88% 108%,rgba(15,34,66,.55),transparent 60%),linear-gradient(180deg,#0d1f33,#080f1c 55%,#060b14);--ebru1:#0a1626;--ebru2:#12352e;--ebru3:#173043;--ebru4:#175646;--ebru5:#1d3a52;--photic:radial-gradient(ellipse at 50% 42%,#bfeee0 0%,#2e8f7f 62%,#14463c 100%);--ok:#3ea8c9;--rec:#e0574a;--uyari:#d9a53a;--bilgi:#5ab0e0}
body[data-tema="col"]{--yuzeyK:31,26,23;--sayfaK:29,24,20;--sayfa2K:23,18,14;--girdiK:27,23,19;--vurguK:49,44,41;--bg:#120d09;--gold:#c1793a;--goldh:#e8a967;--ivory:#efe3d2;--mut:#c2a98d;--dim:#7d6a54;--line:rgba(193,121,58,.2);--line2:rgba(193,121,58,.48);--bgGrad:radial-gradient(1100px 640px at 50% -8%,rgba(110,74,42,.5),transparent 62%),radial-gradient(860px 620px at 88% 108%,rgba(58,166,160,.25),transparent 60%),linear-gradient(180deg,#1d1610,#120d09 55%,#0d0906);--ebru1:#1d1610;--ebru2:#3a2a1a;--ebru3:#6e4a2a;--ebru4:#3aa6a0;--ebru5:#2a1d12;--photic:radial-gradient(ellipse at 50% 42%,#e8a967 0%,#c1793a 62%,#6e3a18 100%);--ok:#c9a24a;--rec:#c0503a;--uyari:#d9a53a;--bilgi:#8a9a5a}
body[data-tema="nebula"]{--yuzeyK:24,20,35;--sayfaK:22,17,32;--sayfa2K:16,11,27;--girdiK:21,16,31;--vurguK:43,38,52;--bg:#0b0616;--gold:#c264d9;--goldh:#8ab4ff;--ivory:#ece6f7;--mut:#ab9ac2;--dim:#6b5c80;--line:rgba(178,100,217,.2);--line2:rgba(178,100,217,.48);--danger:#e0475f;--bgGrad:radial-gradient(1100px 640px at 50% -8%,rgba(150,60,200,.5),transparent 62%),radial-gradient(860px 620px at 88% 108%,rgba(40,80,220,.42),transparent 60%),radial-gradient(700px 500px at 8% 100%,rgba(210,40,75,.3),transparent 55%),linear-gradient(180deg,#170b28,#0d0618 55%,#08040f);--ebru1:#2a1145;--ebru2:#1a2e6b;--ebru3:#5c1a4a;--ebru4:#7a1f3a;--ebru5:#2040a0;--photic:radial-gradient(ellipse at 50% 42%,#ffd6f0 0%,#c264d9 38%,#5a6ad9 68%,#a01840 100%);--ok:#5ac99a;--rec:#e05a7a;--uyari:#d9a53a;--bilgi:#9a7ad0}
body[data-tema="aymoru"]{--yuzeyK:23,27,40;--sayfaK:21,25,38;--sayfa2K:15,19,33;--girdiK:20,24,37;--vurguK:42,45,58;--bg:#0a0e1c;--gold:#8a7fd4;--goldh:#b8aef0;--ivory:#e6e3f5;--mut:#9a95c0;--dim:#5f5a85;--line:rgba(138,127,212,.2);--line2:rgba(138,127,212,.46);--bgGrad:radial-gradient(1100px 640px at 50% -8%,rgba(120,100,220,.42),transparent 62%),radial-gradient(860px 620px at 88% 108%,rgba(40,70,190,.4),transparent 60%),linear-gradient(180deg,#141b38,#0a0e1c 55%,#070a15);--ebru1:#1a1f45;--ebru2:#2a2a6e;--ebru3:#3d3a8a;--ebru4:#241852;--ebru5:#151030;--photic:radial-gradient(ellipse at 50% 42%,#e6ddff 0%,#a78bfa 55%,#4c3a9e 100%);--ok:#6ac0a0;--rec:#d96a8a;--uyari:#d9b06a;--bilgi:#a08ad0}
body[data-tema="kizil"]{--yuzeyK:33,19,20;--sayfaK:31,16,17;--sayfa2K:25,10,11;--girdiK:29,15,16;--vurguK:51,38,38;--bg:#140506;--gold:#d9542e;--goldh:#ff8a5c;--ivory:#f5e2da;--mut:#c2938a;--dim:#7d5450;--line:rgba(217,84,46,.2);--line2:rgba(217,84,46,.48);--bgGrad:radial-gradient(1100px 640px at 50% -8%,rgba(190,40,40,.45),transparent 62%),radial-gradient(860px 620px at 88% 108%,rgba(120,20,20,.4),transparent 60%),linear-gradient(180deg,#240a08,#160504 55%,#0d0302);--ebru1:#3a0f0c;--ebru2:#5c1610;--ebru3:#7a2010;--ebru4:#a03818;--ebru5:#2a0806;--photic:radial-gradient(ellipse at 50% 42%,#ffcfa0 0%,#d9542e 55%,#6e1408 100%);--ok:#5abf8a;--rec:#ff6a5a;--uyari:#f0a840;--bilgi:#d08a6a}
body[data-tema="kuzey"]{--yuzeyK:19,28,33;--sayfaK:16,26,31;--sayfa2K:10,20,25;--girdiK:15,25,29;--vurguK:38,46,51;--bg:#050f14;--gold:#2ee6b8;--goldh:#d966e8;--ivory:#dff5ef;--mut:#8fb8ae;--dim:#4f7268;--line:rgba(46,230,184,.18);--line2:rgba(46,230,184,.42);--bgGrad:radial-gradient(1100px 640px at 50% -8%,rgba(46,220,180,.35),transparent 62%),radial-gradient(860px 620px at 88% 108%,rgba(180,50,210,.32),transparent 60%),linear-gradient(180deg,#0a1c1e,#050f14 55%,#03080a);--ebru1:#0c2e28;--ebru2:#124a3e;--ebru3:#5c1a5a;--ebru4:#2a1a5c;--ebru5:#0e3f52;--photic:radial-gradient(ellipse at 50% 42%,#c8ffe8 0%,#2ee6b8 45%,#a020c0 100%);--ok:#4ac9b0;--rec:#e0674a;--uyari:#e0b04a;--bilgi:#5ab0d0}
body[data-tema="altin"]{--yuzeyK:23,22,19;--sayfaK:21,19,16;--sayfa2K:15,13,10;--girdiK:20,18,15;--vurguK:42,40,38;--bg:#0a0805;--gold:#e0af3d;--goldh:#ffd76a;--ivory:#f5ecd8;--mut:#b8a878;--dim:#7a6d48;--line:rgba(224,175,61,.2);--line2:rgba(224,175,61,.5);--bgGrad:radial-gradient(1100px 640px at 50% -8%,rgba(180,140,40,.4),transparent 62%),radial-gradient(860px 620px at 88% 108%,rgba(90,70,20,.35),transparent 60%),linear-gradient(180deg,#161006,#0a0805 55%,#060402);--ebru1:#2a2008;--ebru2:#4a3810;--ebru3:#6e5418;--ebru4:#8a6a1a;--ebru5:#1a1404;--photic:radial-gradient(ellipse at 50% 42%,#fff3c0 0%,#e0af3d 55%,#7a5a10 100%);--ok:#7ab04a;--rec:#c0603a;--uyari:#e0b04a;--bilgi:#b0904a}
body[data-tema="okyanus"]{--yuzeyK:18,25,37;--sayfaK:15,23,34;--sayfa2K:10,17,29;--girdiK:14,22,33;--vurguK:37,44,54;--bg:#040c18;--gold:#3d8ee0;--goldh:#7ec4ff;--ivory:#e2eef8;--mut:#87a8c2;--dim:#4a6478;--line:rgba(61,142,224,.2);--line2:rgba(61,142,224,.46);--bgGrad:radial-gradient(1100px 640px at 50% -8%,rgba(40,100,190,.4),transparent 62%),radial-gradient(860px 620px at 88% 108%,rgba(10,40,90,.45),transparent 60%),linear-gradient(180deg,#0a1c30,#040c18 55%,#02060e);--ebru1:#0c2038;--ebru2:#123a5c;--ebru3:#1a5488;--ebru4:#2a70a8;--ebru5:#081428;--photic:radial-gradient(ellipse at 50% 42%,#c8e8ff 0%,#3d8ee0 55%,#0a3868 100%);--ok:#3ec9b0;--rec:#e0674a;--uyari:#e0b04a;--bilgi:#4ab0e0}
body[data-tema="gumus"]{--yuzeyK:26,27,29;--sayfaK:24,25,27;--sayfa2K:18,19,21;--girdiK:23,24,26;--vurguK:44,45,47;--bg:#0d0e10;--gold:#a8b0b8;--goldh:#e0e6ea;--ivory:#eef1f3;--mut:#9aa2a8;--dim:#5c6268;--line:rgba(168,176,184,.2);--line2:rgba(168,176,184,.42);--bgGrad:radial-gradient(1100px 640px at 50% -8%,rgba(160,170,180,.22),transparent 62%),radial-gradient(860px 620px at 88% 108%,rgba(80,90,100,.28),transparent 60%),linear-gradient(180deg,#16181a,#0d0e10 55%,#08090a);--ebru1:#1c1e20;--ebru2:#2e3236;--ebru3:#484e54;--ebru4:#666e74;--ebru5:#101214;--photic:radial-gradient(ellipse at 50% 42%,#ffffff 0%,#a8b0b8 55%,#484e54 100%);--ok:#5ab090;--rec:#d0604a;--uyari:#d0a04a;--bilgi:#7a9ab0}
body[data-tema="sabah"]{--yuzeyK:235,228,213;--sayfaK:239,232,216;--sayfa2K:224,217,203;--girdiK:231,225,210;--vurguK:212,206,192;--bg:#f6efdf;--gold:#a9822a;--goldh:#8a6716;--ivory:#3c3122;--mut:#6d5c42;--dim:#98876b;--line:rgba(122,94,32,.28);--line2:rgba(122,94,32,.55);--danger:#b0503a;--panel:rgba(246,239,223,.9);--bgGrad:radial-gradient(1100px 640px at 50% -8%,color-mix(in srgb,var(--gold) 14%,transparent),transparent 62%),radial-gradient(860px 620px at 88% 108%,rgba(30,92,79,.1),transparent 60%),linear-gradient(180deg,#f7f0e1,#eee2c8 60%,#e6d8ba);--ebru1:#d8c79a;--ebru2:#c9b380;--ebru3:#a9822a;--ebru4:#1e5c4f;--ebru5:#8a6716;--photic:radial-gradient(ellipse at 50% 42%,#fff3cf 0%,#d9b84a 60%,#a98a2a 100%);--ok:#3a9a5a;--okbg:rgba(58,154,90,.13);--rec:#c0503a;--recbg:rgba(192,80,58,.12);--uyari:#b0803a;--uyaribg:rgba(176,128,58,.13);--bilgi:#3a7a9a}
body[data-tema="sabah"]{--teal:#1e6d5e;--emerald:#14513f;--ok:#1f7a55}
body[data-tema="safran"]{--yuzeyK:30,18,8;--sayfaK:27,16,6;--sayfa2K:20,10,2;--girdiK:26,15,5;--vurguK:50,36,24;--bg:#1a0d00;--gold:#d4622a;--goldh:#f0a06a;--ivory:#fde8d8;--mut:#c09a84;--dim:#806050;--line:rgba(212,98,42,.2);--line2:rgba(212,98,42,.5);--bgGrad:radial-gradient(1100px 640px at 50% -8%,rgba(180,80,30,.5),transparent 62%),radial-gradient(860px 620px at 88% 108%,rgba(120,30,10,.4),transparent 60%),linear-gradient(180deg,#2a1006,#1a0d00 55%,#0e0600);--ebru1:#2a1408;--ebru2:#4a2010;--ebru3:#6b2d0e;--ebru4:#8a3a14;--ebru5:#1a0a02;--photic:radial-gradient(ellipse at 50% 42%,#ffd4a0 0%,#d4622a 55%,#6e2808 100%);--ok:#5ab87a;--rec:#d04040;--uyari:#d4a030;--bilgi:#c09a60}
/* ⚠ r141: `--gold:#2a4db5` zemine karşı 2.67 kontrast veriyordu —
   okunabilirlik eşiğinin (3.0) altında. Vurgu rengi olarak kullanıldığı
   her yerde (başlık, rozet, çerçeve) zor seçiliyordu. Aynı indigo
   ailesinde kalıp açıldı: #2a4db5 → #5b8ae8 (kontrast 2.67 → ~6.4). */
body[data-tema="lacivert"]{--yuzeyK:16,24,52;--sayfaK:13,21,50;--sayfa2K:8,15,44;--girdiK:12,20,49;--vurguK:32,42,64;--bg:#040918;--gold:#5b8ae8;--goldh:#9dc2ff;--ivory:#d0dcf7;--mut:#8898c0;--dim:#485878;--line:rgba(42,77,181,.22);--line2:rgba(42,77,181,.5);--bgGrad:radial-gradient(1100px 640px at 50% -8%,rgba(42,77,200,.48),transparent 62%),radial-gradient(860px 620px at 88% 108%,rgba(10,20,80,.5),transparent 60%),linear-gradient(180deg,#0e1f4a,#040918 55%,#020510);--ebru1:#0d1f4a;--ebru2:#163070;--ebru3:#1e4294;--ebru4:#2a5ab8;--ebru5:#08112a;--photic:radial-gradient(ellipse at 50% 42%,#d0e4ff 0%,#4a80e0 55%,#0a2060 100%);--ok:#40b080;--rec:#d04060;--uyari:#c0a030;--bilgi:#5090d0}
/* Açık tema — koyu yüzeyleri kâğıda çevir */
body[data-tema="sabah"] .card{background:rgba(255,255,255,.55);box-shadow:0 2px 14px rgba(60,49,34,.06)}
body[data-tema="sabah"] select,body[data-tema="sabah"] #zSearch,body[data-tema="sabah"] .jRow input,body[data-tema="sabah"] .jRow select,body[data-tema="sabah"] input[type=number]{background:rgba(255,255,255,.72);color:#3c3122}
body[data-tema="sabah"] .chn{background:rgba(255,255,255,.42)}
body[data-tema="sabah"] .rut,body[data-tema="sabah"] .pre,body[data-tema="sabah"] .cat,body[data-tema="sabah"] .zItem,body[data-tema="sabah"] .sess,body[data-tema="sabah"] .seg button,body[data-tema="sabah"] .bandChips span{background:rgba(255,255,255,.45)}
body[data-tema="sabah"] input[type=range]:not(#ns *)::-webkit-slider-runnable-track{background:linear-gradient(90deg,var(--gold) var(--val,50%),rgba(60,49,34,.16) var(--val,50%))}
body[data-tema="sabah"] input[type=range]:not(#ns *)::-moz-range-track{background:linear-gradient(90deg,var(--gold) var(--val,50%),rgba(60,49,34,.16) var(--val,50%))}
body[data-tema="sabah"] .sw{background:rgba(60,49,34,.14)}
body[data-tema="sabah"] #logSheet,body[data-tema="sabah"] #rateToast,body[data-tema="sabah"] #temaSheet{background:linear-gradient(180deg,#f7f1e2,#efe4cc)}
body[data-tema="sabah"] .rxInputRow input,body[data-tema="sabah"] .aikeyRow input,body[data-tema="sabah"] .vaultRow input{background:rgba(255,255,255,.78);border-color:rgba(60,49,34,.28)}
body[data-tema="sabah"] .vaultCard{background:rgba(255,255,255,.62);border-color:rgba(90,70,150,.3)}
body[data-tema="sabah"] .vaultHead,body[data-tema="sabah"] .vaultCount,body[data-tema="sabah"] .vaultChange b{color:#5a4696}
body[data-tema="sabah"] .vEs{color:#5a4696}
body[data-tema="sabah"] .rxWhy,body[data-tema="sabah"] .mzbzNote,body[data-tema="sabah"] .vaultWarn{background:rgba(0,0,0,.06)}
body[data-tema="sabah"] #bgEbru{opacity:.42;mix-blend-mode:multiply}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  /* ⚠ ONARIM: --ink / --emerald / --teal yalnızca #tk üzerinde tanımlıydı ve
     #tk ana uygulamanın atası olmadığı için bu değişkenler ana arayüzde HİÇ
     çözülmüyordu (var(--emerald) kullanan border/background kuralları sessizce
     düşüyordu). Artık body'de: --ink temayla birlikte kayar. */
  --ink:var(--ivory);
  --teal:#2e8f7f;
  --emerald:#1e5c4f;
  --ok:#5fd39e;
  font-family:var(--fB);color:var(--ivory);min-height:100vh;line-height:1.45;
  background:var(--bgGrad);
  background-attachment:fixed;
}
/* Girih (sekiz köşeli yıldız) dokusu — tıklamayı asla engellemez */
body::before{
  content:'';position:fixed;inset:0;z-index:0;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96'%3E%3Cg fill='none' stroke='%23c9a227' stroke-opacity='.055'%3E%3Crect x='30' y='30' width='36' height='36'/%3E%3Crect x='30' y='30' width='36' height='36' transform='rotate(45 48 48)'/%3E%3C/g%3E%3C/svg%3E");
}
/* Nefes alan nur — yine pointer-events:none */
body::after{
  content:'';position:fixed;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(560px 340px at 50% 16%, color-mix(in srgb,var(--gold) 6%,transparent), transparent 70%);
  animation:breath 9s ease-in-out infinite;
}
@keyframes breath{0%,100%{opacity:.45}50%{opacity:1}}
/* ── A) Tezhip köşe motifleri ── */
.mrCard{position:relative}
.tzh{position:absolute;width:46px;height:46px;color:var(--goldh);opacity:.5;pointer-events:none;z-index:3}
.tzh svg{width:100%;height:100%;display:block}
.tzh.tl{top:6px;left:6px}
.tzh.tr{top:6px;right:6px;transform:scaleX(-1)}
.tzh.bl{bottom:6px;left:6px;transform:scaleY(-1)}
.tzh.br{bottom:6px;right:6px;transform:scale(-1,-1)}
/* ── D) Nefes halosu ── */
.breathHalo{position:absolute;left:50%;top:50%;width:220px;height:220px;margin:-110px 0 0 -110px;border-radius:50%;
  pointer-events:none;z-index:0;border:1.5px solid color-mix(in srgb,var(--goldh) 28%,transparent);
  background:radial-gradient(circle,color-mix(in srgb,var(--goldh) 5%,transparent),transparent 68%);opacity:0;transition:opacity 0.8s}
.breathHalo.on{opacity:1;animation:breathe448 16s ease-in-out infinite}
@keyframes breathe448{
  0%{transform:scale(.72)}
  25%{transform:scale(1.06)}   /* 4 sn al */
  50%{transform:scale(1.06)}   /* 4 sn tut */
  100%{transform:scale(.72)}   /* 8 sn ver */
}
@media (prefers-reduced-motion:reduce){.breathHalo.on{animation:none;transform:scale(.9)}}
/* ── B) Tesbih imame göstergesi ── */
.tsbGauge{position:absolute;right:10px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;gap:4px;pointer-events:none;z-index:4;opacity:0;transition:opacity 0.45s}
.tsbGauge.on{opacity:.85}
.tsbGauge .bead{width:7px;height:7px;border-radius:50%;background:color-mix(in srgb,var(--goldh) 25%,transparent);transition:all 0.2s}
.tsbGauge .bead.lit{background:var(--goldh);box-shadow:0 0 6px color-mix(in srgb,var(--goldh) 70%,transparent)}
.tsbGauge .imame{width:10px;height:16px;border-radius:7px;background:linear-gradient(180deg,var(--goldh),var(--gold));margin-bottom:2px}
.tsbHint{position:absolute;left:0;right:0;bottom:12px;text-align:center;font-size:9.5px;color:var(--dim);pointer-events:none;z-index:4;opacity:.6}
/* ── C) Kandil modu ── */
#kandil{position:fixed;inset:0;z-index:2000;background:#000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;
  opacity:0;visibility:hidden;transition:opacity 1.1s cubic-bezier(.32,.9,.35,1);cursor:pointer;-webkit-tap-highlight-color:transparent}
#kandil.on{opacity:1;visibility:visible;pointer-events:auto}
#kandil:not(.on){pointer-events:none!important}
#kandil .kSaat{font:300 60px/1 "Space Grotesk",sans-serif;color:color-mix(in srgb,var(--goldh) 90%,transparent);letter-spacing:.04em;font-variant-numeric:tabular-nums}
#kandil .kTarih{font-size:12.5px;color:rgba(255,255,255,.3);letter-spacing:.2em;text-transform:uppercase}
#kandil .kFlame{position:relative;width:44px;height:64px;margin:6px 0}
#kandil .kFlame .glow{position:absolute;left:50%;top:14px;width:70px;height:70px;margin-left:-35px;border-radius:50%;
  background:radial-gradient(circle,rgba(236,180,90,.5),rgba(236,150,60,.12) 55%,transparent 72%);animation:kglow 3.6s ease-in-out infinite}
#kandil .kFlame .fl{position:absolute;left:50%;top:8px;width:16px;height:30px;margin-left:-8px;border-radius:50% 50% 50% 50%/62% 62% 40% 40%;
  background:linear-gradient(180deg,#fff3c4,#f4b24a 55%,#d9542e);transform-origin:50% 100%;animation:kflame 1.9s ease-in-out infinite;filter:blur(.4px)}
#kandil .kFlame .wick{position:absolute;left:50%;top:36px;width:2px;height:8px;margin-left:-1px;background:#3a2a18}
#kandil .kFlame .base{position:absolute;left:50%;bottom:0;width:26px;height:22px;margin-left:-13px;border-radius:5px 5px 7px 7px;background:linear-gradient(180deg,color-mix(in srgb,var(--goldh) 55%,transparent),color-mix(in srgb,var(--gold) 28%,transparent))}
#kandil .kEsma{text-align:center}
#kandil .kEsma .ar{font-family:'Amiri',serif;font-size:30px;color:color-mix(in srgb,var(--goldh) 92%,transparent);margin-bottom:5px}
#kandil .kEsma .tr{font-size:11.5px;color:rgba(255,255,255,.4);letter-spacing:.14em}
#kandil .kHint{position:absolute;bottom:calc(34px + env(safe-area-inset-bottom));font-size:10.5px;color:rgba(255,255,255,.22);letter-spacing:.16em}
@keyframes kflame{0%,100%{transform:rotate(-2deg) scaleY(1)}25%{transform:rotate(2deg) scaleY(1.06)}50%{transform:rotate(-1deg) scaleY(.96)}75%{transform:rotate(1.5deg) scaleY(1.03)}}
@keyframes kglow{0%,100%{opacity:.6;transform:scale(.95)}50%{opacity:1;transform:scale(1.08)}}
@media (prefers-reduced-motion:reduce){#kandil .kFlame .fl,#kandil .kFlame .glow{animation:none}}
/* nefes halosu toggle satırı için (ayarlar) */

.wrap{max-width:740px;margin:0 auto;padding:14px 12px calc(40px + env(safe-area-inset-bottom));position:relative;z-index:1}

/* ─────────── 1. BAŞLIK ─────────── */
header{text-align:center;padding:12px 0 14px}
.logo:not(#ns *){font-size:42px;line-height:1;color:var(--goldh);text-shadow:0 0 28px color-mix(in srgb,var(--gold) 55%,transparent);display:block}
h1{font-family:var(--fD);font-weight:600;font-size:30px;letter-spacing:.38em;text-indent:.38em;margin-top:4px}
.sub{font-size:10.5px;color:var(--mut);letter-spacing:.26em;text-transform:uppercase;margin-top:3px}

/* ─────────── 2. KARTLAR & GENEL ─────────── */
.card:not(#ns *){
  background:linear-gradient(180deg,rgba(255,255,255,.028),rgba(255,255,255,0)), var(--panel);
  border:1px solid var(--line);border-radius:var(--r);padding:16px;
  -webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);
}
.secT{font-family:var(--fD);font-weight:700;font-size:21px;color:var(--goldh);letter-spacing:.05em;margin:20px 2px 11px;text-shadow:0 0 22px color-mix(in srgb,var(--gold) 32%,transparent);display:flex;align-items:center;gap:12px}
.secT::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,var(--line2),transparent)}
.hint{font-size:11.5px;color:var(--dim);margin:10px 4px 0;line-height:1.5}

/* ═══ İçsel Reçete (SÜKÛN Hekîm) ═══ */
.rxIntro{background:color-mix(in srgb,var(--gold) 6%,transparent);border:1px solid var(--line);border-radius:13px;padding:13px 15px;margin-bottom:12px}
.rxIntro b{font-size:16.5px;color:var(--goldh)}
.rxIntro p{font-size:12.5px;color:var(--mut);margin:6px 0 0;line-height:1.6}
/* ═══ Zikir ilerleme halkası (imza sahne katmanı) ═══ */
.progArc{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none}
.progArc svg{transform:rotate(-90deg)}
#zProgArc{transition:stroke-dashoffset 0.3s cubic-bezier(.32,.9,.35,1)}

/* ═══ Bugün kartı ═══ */
.todayCard{background:linear-gradient(135deg,rgba(46,143,127,.14),color-mix(in srgb,var(--gold) 7%,transparent));border:1px solid var(--line2);border-radius:13px;padding:14px 15px;margin:2px 0 4px}
.tcTop{display:flex;align-items:center;gap:12px;margin-bottom:11px}
.tcMoon{font-size:26px;line-height:1}
.tcHi{font-size:14px;font-weight:700;color:var(--goldh)}
.tcSub{font-size:10.5px;color:var(--mut)}
.tcName[hidden]{display:none!important}
.tcName{display:flex;gap:8px;margin-bottom:7px}
.tcName input{flex:1;min-width:0;background:rgba(var(--girdiK),.5);border:1px solid var(--line);border-radius:10px;padding:9px 11px;color:var(--ink);font-family:inherit}
.tcName input:focus{outline:none;border-color:var(--line2)}
.tcName .btn{flex:none}
.tcSkip[hidden]{display:none!important}
.tcSkip{display:block;width:100%;background:none;border:none;font-size:10.5px;color:var(--dim);text-align:center;margin-bottom:9px;cursor:pointer;font-family:inherit;padding:4px}
.tcStats{display:flex;gap:8px;margin-bottom:11px}
.todayCard.prCompanion .tcStats{display:none}
.tcStat{flex:1;background:rgba(0,0,0,.18);border-radius:10px;padding:8px 6px;text-align:center}
.tcN{font-size:16.5px;font-weight:700;color:var(--goldh);font-variant-numeric:tabular-nums}
.tcL{font-size:9.5px;color:var(--dim);text-transform:uppercase;letter-spacing:.05em;margin-top:2px}
.tcRow{display:flex;gap:8px}
.tcGo{flex:1;background:rgba(46,143,127,.16);border:1px solid var(--emerald);color:#8fe3cf;border-radius:13px;padding:11px 8px;font-size:12.5px;text-align:center;font-weight:600;cursor:pointer;font-family:inherit;min-height:40px}
.tcGo.alt{background:color-mix(in srgb,var(--gold) 10%,transparent);border-color:var(--line2);color:var(--goldh)}
body[data-tema="sabah"] .tcStat{background:rgba(0,0,0,.07)}
body[data-tema="sabah"] .tcName input{background:rgba(255,255,255,.78);border-color:rgba(60,49,34,.28)}
body[data-tema="sabah"] .tcGo{color:#1e5c4f}

/* ═══ Numerik Hz girişi ═══ */
.numIn{width:84px;flex:none;background:rgba(var(--girdiK),.5);border:1px solid var(--line);border-radius:10px;padding:7px 9px;color:var(--ink);text-align:right;font-family:inherit;font-variant-numeric:tabular-nums}
.numIn:focus{outline:none;border-color:var(--line2)}
#ns .numIn{margin-top:7px;background:rgba(26,27,58,.7);border-color:rgba(123,111,240,.3);color:#E8E8FF}
#ns .octBtn{flex:none;min-width:38px;min-height:38px;margin-top:7px;background:rgba(123,111,240,.12);border:1px solid rgba(123,111,240,.3);color:#c9c1ff;border-radius:10px;font-size:11.5px;font-family:inherit;cursor:pointer}
#ns .octBtn:active{background:rgba(123,111,240,.24)}
#ns .wave-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;flex:1}
#ns .wave-btn{background:rgba(255,255,255,.04);border:1px solid rgba(123,111,240,.22);border-radius:10px;padding:9px 4px;color:var(--ghost-dim);font-size:16.5px;cursor:pointer;font-family:inherit;transition:background 0.2s,border-color 0.2s,color 0.2s}
#ns .wave-btn.active{background:rgba(123,111,240,.18);border-color:rgba(123,111,240,.6);color:#c9c1ff}
#ns .balRow{margin-top:14px;padding-top:13px;border-top:1px solid rgba(123,111,240,.15)}
#ns .balHead{font-size:12.5px;color:var(--ghost-dim);margin-bottom:9px;display:flex;align-items:center;justify-content:space-between}
#ns .balReset{background:none;border:1px solid rgba(123,111,240,.3);color:#c9c1ff;border-radius:10px;width:26px;height:26px;font-size:14px;cursor:pointer;font-family:inherit}
#ns .balSliders{display:flex;gap:16px}
#ns .balCol{flex:1;display:flex;align-items:center;gap:8px}
#ns .balCol span{font-size:11.5px;color:#c9c1ff;font-weight:700;width:12px}
#ns .balCol input[type=range]{flex:1}
#ns .balCol b{font-size:10.5px;color:var(--ghost-dim);font-variant-numeric:tabular-nums;width:36px;text-align:right}
#ns .sweepGoBtn{background:rgba(46,232,199,.12);border:1px solid rgba(46,232,199,.4);color:#8ff0e0;border-radius:10px;padding:12px;font-size:12.5px;font-family:inherit;cursor:pointer;min-height:40px}
#ns .sweepGoBtn.stopBtn{background:rgba(255,90,90,.1);border-color:rgba(255,120,120,.4);color:#ff9e9e}
#ns .sweepLoop{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--ghost-dim);cursor:pointer}
#ns .sweepLoop input{width:17px;height:17px}
#ns .libSearch{width:100%;background:rgba(26,27,58,.7);border:1px solid rgba(123,111,240,.3);border-radius:10px;padding:11px 13px;color:#E8E8FF;font-family:inherit;font-size:14px;margin-bottom:11px}
#ns .libSearch:focus{outline:none;border-color:rgba(123,111,240,.65)}
#ns .libAZ{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:11px}
#ns .libChip{width:28px;height:28px;flex:none;background:rgba(255,255,255,.04);border:1px solid rgba(123,111,240,.2);border-radius:10px;color:var(--ghost-dim);font-size:11.5px;cursor:pointer;font-family:inherit}
#ns .libChip.active{background:rgba(123,111,240,.28);border-color:rgba(123,111,240,.7);color:#fff}
#ns .libNote{font-size:10.5px;color:var(--ghost-faint);line-height:1.5;margin-bottom:12px}
#ns .libEmpty{font-size:12.5px;color:var(--ghost-dim);text-align:center;padding:20px 0}
#ns .libRow{background:rgba(255,255,255,.03);border:1px solid rgba(123,111,240,.16);border-left:3px solid rgba(123,111,240,.4);border-radius:10px;padding:10px 12px;margin-bottom:7px;cursor:pointer;transition:background 0.2s,border-color 0.2s}
#ns .libRow:active{background:rgba(123,111,240,.14)}
#ns .libRowT{font-size:14px;font-weight:600;color:#E8E8FF;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
#ns .libSrc{font-size:9.5px;font-weight:400;color:#8ff0e0;background:rgba(46,232,199,.1);border-radius:7px;padding:2px 6px;margin-left:auto}
#ns .libRowS{font-size:11.5px;color:var(--ghost-dim);margin-top:3px;line-height:1.4}
/* Kaynağa göre çoklu renk — SÜKÛN altın, Solfej menekşe, NeuroSync camgöbeği */
#ns .libRow.libGold{border-left-color:#e0b84a}
#ns .libGold .libSrc{color:#f0d68a;background:rgba(224,184,74,.14)}
#ns .libRow.libViolet{border-left-color:#a78bfa}
#ns .libViolet .libSrc{color:#c9b8ff;background:rgba(167,139,250,.14)}
#ns .libRow.libCyan{border-left-color:#2ee8c7}
#ns .libCyan .libSrc{color:#8ff0e0;background:rgba(46,232,199,.14)}
#ns .libRow.libJourney{border-left-style:dashed;opacity:.88}
#ns .libJT{font-size:9.5px;color:#ffb86b;background:rgba(255,184,107,.12);border-radius:7px;padding:2px 6px}
body[data-tema="sabah"] .numIn{background:rgba(255,255,255,.78);border-color:rgba(60,49,34,.28)}

/* ═══ Haftalık zikir seyri ═══ */
.wkCard{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:13px;padding:12px 13px;margin:0 0 12px}
.wkT{font-size:12.5px;font-weight:700;color:var(--goldh);margin-bottom:10px}
.wkT small{font-weight:400;color:var(--dim);font-size:10.5px}
.wkWeek{display:flex;align-items:flex-end;gap:8px;height:84px;margin-bottom:8px}
.wkDay{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:4px;height:100%}
.wkBar{width:100%;border-radius:6px 6px 3px 3px;background:linear-gradient(180deg,var(--goldh),color-mix(in srgb,var(--gold) 45%,transparent));min-height:4px}
.wkBar.wkEmpty{height:7px;background:rgba(255,255,255,.05);border:1px dashed rgba(255,255,255,.14)}
.wkDay small{font-size:9.5px;color:var(--dim)}
.wkToday .wkBar:not(.wkEmpty){background:linear-gradient(180deg,#8fe3cf,var(--emerald));box-shadow:0 0 12px rgba(46,143,127,.35)}
/* r102: gül temasında bu çubuk sabit turkuazdı — kırmızı zeminde
   yabancı duruyordu. Tema değişkeninden türetiliyor. */
body[data-tema="gul"] .wkToday .wkBar:not(.wkEmpty){background:linear-gradient(180deg,color-mix(in srgb,var(--emerald) 45%,var(--goldh)),var(--emerald));box-shadow:0 0 12px rgba(160,50,70,.35)}
.wkToday small{color:#8fe3cf;font-weight:700}
.wkStreak{display:flex;align-items:center;gap:8px;background:color-mix(in srgb,var(--gold) 7%,transparent);border-radius:10px;padding:8px 11px;font-size:11.5px;color:var(--mut)}
.wkStreak b{color:var(--goldh)}
body[data-tema="sabah"] .wkBar.wkEmpty{background:rgba(60,49,34,.06);border-color:rgba(60,49,34,.22)}

/* ═══ Mini Oynatıcı ═══ */
/* genişletilebilir mini denetim */
#miniBar{flex-direction:column;align-items:stretch;gap:0}
.mbUst{display:flex;align-items:center;gap:8px;width:100%;flex-wrap:wrap}
/* r107: denetim kümesi. Başlık en az 110px isteyince, altı düğme
   sığmadığında küme alt satıra iner — metin asla eziLmez. */
.mbKontrol{display:flex;flex-wrap:nowrap;align-items:center;gap:7px;flex:0 0 auto;margin-left:auto}
.mbAlt{display:flex;flex-direction:column;gap:9px;width:100%;
  margin-top:11px;padding-top:11px;border-top:1px solid var(--line)}
.mbAlt[hidden]{display:none}
.mbSatir{display:flex;align-items:center;gap:9px}
.mbEt{flex:none;font:600 9.5px/1 "Figtree";letter-spacing:.1em;text-transform:uppercase;
  color:var(--dim);width:26px}
.mbSatir input[type=range]{flex:1;min-width:0}
.mbDeg{flex:none;font:600 10px/1 "Figtree";color:var(--goldh);
  font-variant-numeric:tabular-nums;min-width:34px;text-align:right}
.mbHiz{flex:1;display:flex;gap:4px}
.mbHiz button{flex:1;padding:7px 4px;border-radius:8px;cursor:pointer;font-family:inherit;
  font:600 10px/1 "Figtree";color:var(--mut);border:1px solid var(--line);
  background:transparent;transition:color .2s,border-color .2s,background .2s}
.mbHiz button.on{color:var(--goldh);border-color:color-mix(in srgb,var(--gold) 45%,transparent);
  background:color-mix(in srgb,var(--gold) 12%,transparent)}
/* r101: çubuktaki ton/mekân satırları
   «Yankı» satırında hem kaydırıcı hem 8D düğmesi var; .mbHiz varsayılan
   flex:1 olduğu için kaydırıcıyı eziyordu — burada daraltılıyor. */
/* Etiket sütunu 26px'ti; "YANKI" sığmayıp "YAN" diye kesiliyordu.
   Satırlar hizalı kalsın diye sütun topluca genişletiliyor —
   kaydırıcılar esnek olduğu için yalnız birkaç piksel kısalıyor. */
#mbAlt .mbEt{width:46px}
/* "Yankı" harf aralığı (.1em) yüzünden 50px istiyordu; yalnız bu
   etikette aralık kısılıyor — büyük/küçük harf düzeni bozulmuyor. */
#mbMekanSatir .mbEt{letter-spacing:.02em}
.mbIpuc{padding-left:55px}
#mbMekanSatir .mbHiz{flex:none}
#mbMekanSatir .mbHiz button{flex:none;min-width:40px}
#mbMekanSatir .mbDeg{min-width:44px}
.mbIpuc{font:400 9px/1.5 "Figtree";color:var(--dim);margin:-2px 0 0}
.mbIpuc b{color:var(--mut);font-weight:600}
/* r105: atlama düğmeleri — sınıra gelince soluklaşır ama kaybolmaz,
   kullanıcı nerede olduğunu görsün. */
#mbOnceki[disabled],#mbSonraki[disabled]{opacity:.3;pointer-events:none}
/* r113: cihaz sesiyle okunurken yankı/8D uygulanamaz — satır soluk */
#mbMekanSatir.pasif{opacity:.42}
#mbMekanSatir input[disabled],#mbMekanSatir button[disabled]{pointer-events:none}
#mbOnceki[hidden],#mbSonraki[hidden]{display:none!important}
/* ── ZİKİR AÇILIŞI (r118) ───────────────────────────────────
   Yaklaşma yalnız transform+opacity ile: ikisi de derleyici (compositor)
   üstünde çalışır, telefonda kare düşürmez. Yerleşim özelliklerine
   (width/top/font-size) DOKUNULMAZ. */
/* r123: tövbe sonrası öneri kartı */
.zaKat.oneri{background:radial-gradient(ellipse at center,rgba(var(--sayfaK),.94) 0%,rgba(0,0,0,.96) 74%)}
.zaKat.oneri .zaAr{font-size:clamp(24px,7.6vw,40px);margin:16px 0 4px}
.zaOneriAd{font-size:13.5px;font-weight:600;color:var(--goldh);letter-spacing:.02em}
.zaBtnler{display:flex;gap:9px;justify-content:center;margin-top:22px;flex-wrap:wrap}
.zaBtnler .btn{font-size:12.5px;padding:9px 17px}
.zaBtnler .zaEvet{background:color-mix(in srgb,var(--gold) 20%,transparent);
  border-color:var(--gold);color:var(--goldh);font-weight:600}
/* r131: «bir daha sorma» */
.zaSorma{display:flex;align-items:center;justify-content:center;gap:7px;
  margin-top:16px;font-size:10.5px;color:var(--dim);cursor:pointer}
.zaSorma input{width:15px;height:15px;accent-color:var(--gold)}

/* r129: terkip kurucu */
.trkSec{display:flex;flex-wrap:wrap;gap:5px;max-height:190px;overflow-y:auto;
  padding:8px;border:1px solid var(--line);border-radius:10px;margin-top:8px;
  background:color-mix(in srgb,var(--gold) 2%,transparent)}
.trkSec .trkAd{font-size:11px;padding:5px 9px;border:1px solid var(--line);
  border-radius:999px;color:var(--mut);cursor:pointer;user-select:none;
  transition:background .18s,border-color .18s,color .18s}
.trkSec .trkAd:active{transform:scale(.97)}
.trkSec .trkAd.on{background:color-mix(in srgb,var(--gold) 20%,transparent);
  border-color:var(--gold);color:var(--goldh);font-weight:600}
.trkSec .trkAd .sira{font-size:9px;opacity:.75;margin-left:3px}
.trkOnizle{margin-top:9px;padding:10px 12px;border-radius:10px;text-align:center;
  border:1px solid var(--line);min-height:44px;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:4px}
.trkOnizle .ar{font-family:"Amiri",serif;font-size:19px;color:var(--gold);direction:rtl;line-height:1.85}
.trkOnizle .tr{font-size:12px;color:var(--goldh);font-weight:600}
.trkOnizle .bos{font-size:11px;color:var(--dim)}
.trkKayitli{margin-top:10px;display:flex;flex-direction:column;gap:6px}
.trkKayitli .baslik{font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--dim);margin-bottom:2px}
.trkKart{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:11px;
  border:1px solid var(--line);background:color-mix(in srgb,var(--gold) 4%,transparent)}
.trkKart .bilgi{flex:1;min-width:0}
.trkKart .ad{display:block;font-size:12.5px;font-weight:600;color:var(--goldh);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.trkKart .ozet{display:block;font-size:10px;color:var(--dim);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}
.trkKart button{flex:0 0 auto;padding:5px 9px;border-radius:8px;font-size:11px;
  border:1px solid var(--line);background:transparent;color:var(--goldh);cursor:pointer}
.trkKart button.sil{color:#e0908f;border-color:rgba(224,144,143,.34)}
/* terkip kaynak rozeti */
.trkKay{display:inline-block;font-size:8.5px;letter-spacing:.06em;text-transform:uppercase;
  padding:2px 6px;border-radius:999px;margin-left:6px;vertical-align:middle}
/* r131: Hizb — okunuş satırı altın, meâl sönük */
/* ══ HİZBÜ'L-VİKÂYE görünümü (r138) ══ */

/* r140: bu kural genel `.jEd summary`'ye taşındı — burada kalması
   gereksiz özel durum yaratıyordu. */

/* her bend KENDİ rengini taşır (satır içi --bc değişkeninden) */
.hzvKisim .tvkRow{
  border:1px solid color-mix(in srgb,var(--bc,var(--line)) 34%,transparent);
  border-left:3px solid var(--bc,var(--line));
  border-radius:10px;padding:9px 11px;margin-bottom:6px;
  background:color-mix(in srgb,var(--bc,var(--gold)) 5%,transparent);
  transition:box-shadow .35s ease,border-color .35s ease,background .35s ease}
.hzvKisim .tvkRow .sn{font-size:9.5px;font-weight:700;color:var(--bc,var(--gold));
  min-width:17px;font-variant-numeric:tabular-nums;opacity:.85}
.hzvKisim .tvkRow b{font-weight:500;letter-spacing:.01em}
.hzvKisim .tvkRow .kd{font-size:9px;color:var(--ok);margin-left:6px}

/* AKTİF bend — neon çerçeve, kendi renginde */
.hzvKisim .tvkRow.cal{
  border-color:var(--bc,var(--gold));
  background:color-mix(in srgb,var(--bc,var(--gold)) 15%,transparent);
  box-shadow:0 0 0 1px var(--bc,var(--gold)),
             0 0 14px color-mix(in srgb,var(--bc,var(--gold)) 58%,transparent),
             inset 0 0 18px color-mix(in srgb,var(--bc,var(--gold)) 16%,transparent);
  animation:hzvNeon 2.1s ease-in-out infinite}
@keyframes hzvNeon{
  0%,100%{box-shadow:0 0 0 1px var(--bc,var(--gold)),
    0 0 10px color-mix(in srgb,var(--bc,var(--gold)) 42%,transparent),
    inset 0 0 14px color-mix(in srgb,var(--bc,var(--gold)) 12%,transparent)}
  50%{box-shadow:0 0 0 1px var(--bc,var(--gold)),
    0 0 22px color-mix(in srgb,var(--bc,var(--gold)) 74%,transparent),
    inset 0 0 22px color-mix(in srgb,var(--bc,var(--gold)) 22%,transparent)}}
@media (prefers-reduced-motion:reduce){.hzvKisim .tvkRow.cal{animation:none}}
/* «şimdi okunuyor» işareti */
.hzvKisim .tvkRow.cal .sn::after{content:' ▸';color:var(--bc,var(--gold))}
.hzvKisim .tvkRow.cal b{color:var(--ink);font-weight:600}

/* görünüm kulakçığı */
.hzvSekme{display:flex;gap:5px;margin-top:10px}
.hzvSekme .hzvS{flex:1;font-size:10.5px;padding:6px 4px;border:1px solid var(--line);
  border-radius:8px;background:transparent;color:var(--mut);cursor:pointer;
  transition:background .2s,color .2s,border-color .2s}
.hzvSekme .hzvS.on{background:color-mix(in srgb,var(--gold) 16%,transparent);
  border-color:var(--gold);color:var(--goldh);font-weight:600}

/* metin — okunuş ve anlam ayrı biçimde */
.hzvText .tvBlok{border-left:2px solid color-mix(in srgb,var(--bc,var(--line)) 45%,transparent);
  padding-left:10px;margin-bottom:11px;transition:border-color .3s}
.hzvText .tvBlok.on{border-left-color:var(--bc,var(--gold))}
.hzvText .tvP{font-size:12px;line-height:1.85;margin:0 0 5px}
.hzvText .hzvOkunus{color:var(--goldh);font-weight:500}
.hzvText .hzvAnlam{color:var(--mut);font-size:11px;font-style:italic;line-height:1.75}
.hzvText .tvP.on{background:color-mix(in srgb,var(--bc,var(--gold)) 14%,transparent);
  border-radius:6px;padding:4px 7px}
/* kulakçığa göre gizleme */
.hzvText.g-oku .hzvAnlam{display:none}
.hzvText.g-anlam .hzvOkunus{display:none}
/* r140: etiket içi mini simge — emoji yerine aynı SVG ailesi.
   Emoji cihazdan cihaza değişir ve rasterdır; SVG tema rengini alır. */
.ikoMini{display:inline-flex;width:11px;height:11px;vertical-align:-1px;opacity:.82}
.ikoMini svg{width:100%;height:100%}
/* İstatistik satırı: rakam öne, etiket geri, sayılar tabular. */
.tcN{font-size:var(--t-one);font-weight:300;color:var(--goldh);
  font-variant-numeric:tabular-nums;line-height:1.15}
.tcL{font-size:var(--t-kunye);color:var(--dim);letter-spacing:.09em;
  text-transform:uppercase;margin-top:3px}
/* r149: bugünün menzili kısayolu */
.kltBugun{font-size:11px;line-height:1.6;color:var(--mut);margin-top:9px;
  padding:9px 11px;border-radius:9px;
  background:color-mix(in srgb,var(--ok) 8%,transparent);
  border-left:2px solid color-mix(in srgb,var(--ok) 50%,transparent)}
.kltBugun b{color:var(--ok)}
.kltBugun a{color:var(--goldh);border-bottom:1px dotted;text-decoration:none}

/* r147: Kayıtlarım */
.ydkDurum{font-size:10px;color:var(--dim);margin-top:8px;min-height:1.2em}
.ydkListe{margin-top:8px;max-height:220px;overflow-y:auto}
.ydkSat{display:flex;align-items:center;gap:8px;padding:8px 10px;margin-bottom:5px;
  border-radius:9px;background:color-mix(in srgb,var(--gold) 4%,transparent);
  border-left:2px solid color-mix(in srgb,var(--gold) 30%,transparent)}
.ydkSat b{flex:1;min-width:0;font-size:11.5px;font-weight:400;color:var(--ink);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ydkSat button{flex:none;width:28px;height:28px;border-radius:8px;font-size:11px;
  border:1px solid var(--line);background:transparent;color:var(--mut);cursor:pointer}
.ydkSat .ydkSil{color:var(--danger);border-color:color-mix(in srgb,var(--danger) 30%,transparent)}
.ydkBos{font-size:10.5px;color:var(--dim);padding:10px 2px}

/* r146: kilitli bölüm */
.kltBar{display:flex;gap:7px;margin-top:9px;align-items:center}
.kltBar input{flex:1;min-width:0;font-size:13px;padding:9px 11px;border-radius:9px;
  border:1px solid var(--line);background:rgba(var(--girdiK),.55);color:var(--ink)}
.kltBar .btn{font-size:12px;padding:9px 14px;flex:none}
.kltNot{font-size:9.5px;line-height:1.7;color:var(--dim);margin-top:9px;
  padding:9px 11px;border-left:2px solid color-mix(in srgb,var(--uyari) 45%,transparent);
  background:color-mix(in srgb,var(--uyari) 5%,transparent);border-radius:0 8px 8px 0}
.kltNot b{color:var(--uyari)}
.kltNot a{color:var(--goldh)}
/* ══ r147 · #1 EYLEM IZGARASI HİYERARŞİSİ ══
   Ölçüm: DURDUR (nadir, geri alınamaz) ile ENGLISH (nadir, zararsız)
   aynı ağırlıktaydı. Üç kademe:
     birincil  — sık kullanılan (Kaydet, Günlük)
     ikincil   — nadir yardımcı (English, Tema, MİDİ)  → geri çekilir
     tehlikeli — Durdur                                → ayrı renk */
/* Nadir yardımcılar geri çekilir; dokununca tam görünür. */
.dockItem{transition:opacity .22s,border-color .22s}
.dockItem#temaBtn,.dockItem#langBtn,.dockItem#midiBtn,.dockItem#sleepWrap{opacity:.6}
.dockItem#temaBtn:hover,.dockItem#langBtn:hover,.dockItem#midiBtn:hover,
.dockItem#temaBtn:focus-visible,.dockItem#langBtn:focus-visible,
.dockItem#midiBtn:focus-visible{opacity:1}
/* Geri alınamaz eylem kendi rengini taşısın — zaten `.danger` var, güçlendirildi */
.dockItem.danger{border-color:color-mix(in srgb,var(--danger) 45%,transparent);
  background:color-mix(in srgb,var(--danger) 7%,transparent)}

/* ══ r147 · #3 SEYİR / ARAÇ GRUPLARI ══
   Zikir sekmesinde sekiz açılır panel alt alta duruyordu; kaydırma
   uzuyordu. İki başlık altında toplandı. */
.zGrup{margin-top:14px}
.zGrupBas{font:400 11px/1 var(--f-display);letter-spacing:.22em;
  text-transform:uppercase;color:var(--dim);padding:0 2px 7px;
  border-bottom:1px solid var(--line);margin-bottom:9px}

.zItem.renkli{border-color:color-mix(in srgb,var(--ic) 42%,transparent);
  color:color-mix(in srgb,var(--ic) 78%,var(--ink))}
.zItem.renkli.act{background:color-mix(in srgb,var(--ic) 20%,transparent);
  border-color:var(--ic);color:var(--ic);
  box-shadow:0 0 12px color-mix(in srgb,var(--ic) 40%,transparent)}
/* r139: ALTIN TOZU — sayaç çekilirken çerçeve parıldar.
   Yalnız opacity/transform/box-shadow — derleyici üstünde çalışır. */
.zStage{position:relative}
.zStage.toz::before{content:'';position:absolute;inset:-3px;border-radius:inherit;
  pointer-events:none;background:
    radial-gradient(2px 2px at 12% 18%, color-mix(in srgb,var(--gold) 92%,transparent) 40%, transparent 55%),
    radial-gradient(1.6px 1.6px at 86% 24%, color-mix(in srgb,var(--goldh) 88%,transparent) 40%, transparent 55%),
    radial-gradient(2.2px 2.2px at 30% 88%, color-mix(in srgb,var(--gold) 85%,transparent) 40%, transparent 55%),
    radial-gradient(1.4px 1.4px at 68% 92%, color-mix(in srgb,var(--goldh) 90%,transparent) 40%, transparent 55%),
    radial-gradient(1.8px 1.8px at 6% 62%, color-mix(in srgb,var(--gold) 80%,transparent) 40%, transparent 55%),
    radial-gradient(1.5px 1.5px at 95% 70%, color-mix(in srgb,var(--gold) 84%,transparent) 40%, transparent 55%);
  opacity:0;animation:tozSac 2.4s ease-out forwards}
@keyframes tozSac{0%{opacity:0;transform:scale(.985)}18%{opacity:1}100%{opacity:0;transform:scale(1.035)}}
/* r139: AKIŞ SÜRERKEN sürekli, hafif parıltı. Her tıkta patlama yapmak
   göz yorardı; akış açıkken yavaş dönen bir toz perdesi var, devir
   dolunca `.toz` ile kısa bir patlama gelir. */
.zStage.tozAkis::before{
  content:'';position:absolute;inset:-2px;border-radius:inherit;pointer-events:none;
  background:
    radial-gradient(1.6px 1.6px at 18% 22%, color-mix(in srgb,var(--gold) 70%,transparent) 40%, transparent 55%),
    radial-gradient(1.3px 1.3px at 78% 30%, color-mix(in srgb,var(--goldh) 65%,transparent) 40%, transparent 55%),
    radial-gradient(1.7px 1.7px at 36% 84%, color-mix(in srgb,var(--gold) 62%,transparent) 40%, transparent 55%),
    radial-gradient(1.2px 1.2px at 72% 90%, color-mix(in srgb,var(--goldh) 68%,transparent) 40%, transparent 55%);
  animation:tozAkisA 4.2s ease-in-out infinite}
@keyframes tozAkisA{
  0%,100%{opacity:.22;transform:scale(1)}
  50%{opacity:.62;transform:scale(1.012)}}
@media (prefers-reduced-motion:reduce){.zStage.tozAkis::before{animation:none;opacity:.3}}

.zStage.toz::after{content:'';position:absolute;inset:0;border-radius:inherit;
  pointer-events:none;
  box-shadow:0 0 0 1px color-mix(in srgb,var(--gold) 55%,transparent),
             0 0 22px color-mix(in srgb,var(--gold) 34%,transparent);
  opacity:0;animation:tozHale 2.4s ease-out forwards}
@keyframes tozHale{0%{opacity:0}22%{opacity:1}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){
  .zStage.toz::before,.zStage.toz::after{animation:none;opacity:0}}

/* r149: ay menzili satırı */
.zMenzil{font-size:10.5px;line-height:1.65;color:var(--mut);margin:9px auto 0;
  max-width:min(94%,430px);padding:8px 11px;text-align:left;
  border-left:2px solid color-mix(in srgb,var(--bilgi,var(--gold)) 45%,transparent);
  background:color-mix(in srgb,var(--bilgi,var(--gold)) 5%,transparent);border-radius:0 9px 9px 0}
.zMenzil b{color:var(--goldh);font-weight:600}
.zMenzil.simdi{border-left-color:var(--ok);
  background:color-mix(in srgb,var(--ok) 9%,transparent)}
.mzSimdi{display:inline-block;font-size:9px;letter-spacing:.08em;text-transform:uppercase;
  padding:2px 7px;border-radius:999px;margin-left:6px;
  background:color-mix(in srgb,var(--ok) 22%,transparent);color:var(--ok);font-weight:600}

/* r150: matris satırı — harf, ebced, unsur */
.mzMat{margin-top:6px;font-size:10px;color:var(--dim);display:flex;flex-wrap:wrap;
  gap:4px 8px;align-items:center}
.mzMat b{color:var(--goldh);font-variant-numeric:tabular-nums}
.mzH{font-family:"Amiri",serif;font-size:15px;color:var(--gold);line-height:1}
.mzU{padding:1px 7px;border-radius:999px;font-size:9px;letter-spacing:.05em}
.mzU.u-ates{background:color-mix(in srgb,#e2653f 22%,transparent);color:#ff9a6a}
.mzU.u-toprak{background:color-mix(in srgb,#8a6a3a 26%,transparent);color:#d9b177}
.mzU.u-hava{background:color-mix(in srgb,#7fb3d0 22%,transparent);color:#a8d8f0}
.mzU.u-su{background:color-mix(in srgb,#4a7fb0 24%,transparent);color:#8fc0e8}

/* r146: kilitli bölüm uyarısı */
.zUyari{font-size:10px;line-height:1.7;color:var(--mut);margin:9px auto 0;
  max-width:min(94%,430px);padding:8px 11px;text-align:left;
  border-left:2px solid color-mix(in srgb,var(--uyari) 55%,transparent);
  background:color-mix(in srgb,var(--uyari) 6%,transparent);border-radius:0 9px 9px 0}
.zUyari b{color:var(--uyari);font-weight:600}
.zNiyet{font-size:10.5px;line-height:1.65;color:var(--mut);margin:9px auto 0;
  max-width:min(94%,430px);padding:8px 11px;text-align:left;
  border-left:2px solid color-mix(in srgb,var(--gold) 45%,transparent);
  background:color-mix(in srgb,var(--gold) 5%,transparent);border-radius:0 9px 9px 0}
.zNiyet b{color:var(--goldh);font-weight:600}
.trkKay.ekberi{background:color-mix(in srgb,#7a9fd4 22%,transparent);color:#a8c8ec}
.trkKay.mucerrebat{background:color-mix(in srgb,#c98a3a 22%,transparent);color:#e8b168}
.trkKay.ayet{background:color-mix(in srgb,var(--ok) 18%,transparent);color:var(--ok)}
.trkKay.gelenek{background:color-mix(in srgb,var(--gold) 15%,transparent);color:var(--goldh)}

/* r126: sayaç sahnesindeki bağlam şeridi */
#zModBadge{
  font-size:10.5px;color:var(--goldh);background:color-mix(in srgb,var(--gold) 9%,transparent);
  border-left:2px solid color-mix(in srgb,var(--gold) 55%,transparent);
  border-radius:0 8px 8px 0;padding:7px 10px;margin:6px 0 4px;
  line-height:1.5;transition:opacity .3s
}
#zModBadge b{font-weight:600;color:var(--gold)}

/* r126: aktif-dur — hatim/letâif çalışırken buton kırmızı nabız alır.
   Kullanıcı sayfayı kaydırdıktan sonra geri gelince "bu buton duraklatır"
   mesajını görsel olarak anlasın. Duraklatılınca nabız durur. */
.btn.aktif-dur{
  border-color:#d9542e;
  background:rgba(217,84,46,.15);
  color:#ff9a7a;
  animation:recPulse 1.4s ease-in-out infinite;
}

/* r123: sayaca yönlendirildiğinde kısa vurgu — «değişen yer burası» */
.zStage.zVurgu{animation:zVurguA 2.6s ease-out}
@keyframes zVurguA{
  0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--gold) 62%,transparent)}
  18%{box-shadow:0 0 0 7px color-mix(in srgb,var(--gold) 30%,transparent)}
  100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--gold) 0%,transparent)}}
@media (prefers-reduced-motion:reduce){.zStage.zVurgu{animation:none;
  outline:2px solid var(--gold);outline-offset:3px}}

/* r119: yönerge sönümü — üç açılıştan sonra tek satır, dokununca açılır */
.zYonerge{cursor:pointer;transition:max-height .3s ease,opacity .25s ease}
.zYonerge.kisa{max-height:1.7em;overflow:hidden;position:relative;opacity:.72;
  white-space:nowrap;text-overflow:ellipsis}
.zYonerge.kisa::after{content:'⌄';position:absolute;right:8px;top:7px;color:var(--dim);font-size:11px}

/* r119: zikir sonu ses seçimi */
.huSec{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:7px}
.huSec .huK{font-size:11px;padding:6px 11px}
.huSec .huK.on{background:color-mix(in srgb,var(--gold) 18%,transparent);
  border-color:var(--gold);color:var(--goldh);font-weight:600}
.huBar{display:flex;flex-wrap:wrap;align-items:center;gap:7px}
.huBar .btn{font-size:11px;padding:6px 11px}
.huBar .btn.has{border-color:var(--ok);color:var(--ok)}
.huDurum{font-size:9.5px;color:var(--dim);flex:1;min-width:110px;line-height:1.5}

/* r118: «ne yapmam gerek» yönergesi — modül başında, göz yormadan */
.zYonerge{font-size:11px;line-height:1.62;color:var(--mut);margin:8px 0 10px;
  padding:9px 11px;border-left:2px solid var(--line2);
  background:color-mix(in srgb,var(--gold) 5%,transparent);border-radius:0 9px 9px 0}
.zYonerge b{color:var(--goldh);font-weight:600}
.zaKat{position:fixed;inset:0;z-index:2147483100;display:flex;align-items:center;
  justify-content:center;padding:26px;text-align:center;
  background:radial-gradient(ellipse at center,rgba(var(--sayfaK),.90) 0%,rgba(0,0,0,.94) 78%);
  -webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);
  opacity:0;transition:opacity .30s ease;cursor:pointer}
.zaKat.acik{opacity:1}
.zaIc{max-width:560px;width:100%;
  transform:scale(.62) translateZ(0);opacity:0;
  transition:transform 1.05s cubic-bezier(.19,1,.22,1),opacity .55s ease}
.zaKat.acik .zaIc{transform:scale(1);opacity:1}
/* Geri çekilme: kapanırken uzaklaşarak silinir */
.zaKat:not(.acik) .zaIc{transform:scale(1.34);opacity:0;
  transition:transform .34s ease-in,opacity .26s ease-in}
.zaAr{font-family:"Amiri",serif;font-size:clamp(30px,10vw,54px);line-height:1.75;
  color:var(--gold);direction:rtl;margin-bottom:14px;
  text-shadow:0 0 26px color-mix(in srgb,var(--gold) 34%,transparent)}
.zaTr{font-size:clamp(15px,4.6vw,21px);font-weight:600;color:var(--goldh);letter-spacing:.02em}
.zaAlt{font-size:11.5px;color:var(--mut);margin-top:7px;letter-spacing:.09em;text-transform:uppercase}
/* r119: nefes yönergesi — sayının üstünde, asıl mesaj bu */
.zaNefes{font-size:13px;color:var(--goldh);margin-top:20px;letter-spacing:.06em;
  min-height:1.2em;opacity:.92}
/* r119: tamamlanma anı */
.zaKat.tamam .zaTr{font-size:clamp(17px,5.4vw,24px);color:var(--gold)}
.zaTik{font-size:clamp(38px,12vw,58px);color:var(--gold);margin-bottom:12px;
  text-shadow:0 0 30px color-mix(in srgb,var(--gold) 45%,transparent);
  animation:zaTikA .9s cubic-bezier(.19,1,.22,1)}
@keyframes zaTikA{0%{transform:scale(.4) rotate(-25deg);opacity:0}
  60%{transform:scale(1.14) rotate(4deg);opacity:1}100%{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.zaTik{animation:none}}
.zaSay{font-size:clamp(24px,7vw,34px);font-weight:700;color:var(--mut);margin-top:5px;opacity:.62;
  font-variant-numeric:tabular-nums;min-height:1.1em}
.zaSay.vur{animation:zaVur .62s ease-out}
@keyframes zaVur{0%{transform:scale(.72);opacity:.25}45%{transform:scale(1.1);opacity:1}100%{transform:scale(1);opacity:.9}}
.zaAtla{margin-top:20px;font-size:10.5px;color:var(--dim);letter-spacing:.11em;text-transform:uppercase}
/* Kısa kip — bölüm/isim geçişi: daha küçük, geri sayımsız */
/* Kısa kipte de alttaki metin okunmasın — saydamlık düşük kalırsa
   arkadaki yazı zikrin üstüne biner (ölçümde görüldü). */
.zaKat.kisa{background:radial-gradient(ellipse at center,rgba(var(--sayfaK),.94) 0%,rgba(0,0,0,.96) 72%)}
.zaKat.kisa .zaAr{font-size:clamp(24px,7.4vw,38px)}
.zaKat.kisa .zaIc{transition:transform .5s cubic-bezier(.19,1,.22,1),opacity .3s ease}
/* Hareket azaltma: yaklaşma yok, yalnız yumuşak geçiş */
.zaKat.az .zaIc,.zaKat.az:not(.acik) .zaIc{transform:none;transition:opacity .3s ease}
.zaKat.az .zaSay.vur{animation:none}
@media (prefers-reduced-motion:reduce){
  .zaIc,.zaKat:not(.acik) .zaIc{transform:none!important;transition:opacity .3s ease}
  .zaSay.vur{animation:none}
}

/* ── NELER YENİLENDİ (r112) ─────────────────────────────────── */
.nyKat{position:fixed;inset:0;z-index:2147483000;display:flex;align-items:flex-end;
  justify-content:center;background:rgba(0,0,0,.62);opacity:0;transition:opacity .22s;
  -webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.nyKat.acik{opacity:1}
.nyKutu{width:100%;max-width:560px;max-height:78vh;display:flex;flex-direction:column;
  background:rgba(var(--sayfaK),.985);border:1px solid var(--line2);
  border-radius:18px 18px 0 0;box-shadow:var(--e2);
  transform:translateY(14px);transition:transform .26s cubic-bezier(.32,.9,.35,1)}
.nyKat.acik .nyKutu{transform:none}
.nyBas{display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:14px 16px 10px;border-bottom:1px solid var(--line)}
.nyBas span{font:600 12px/1.3 "Figtree";letter-spacing:.1em;text-transform:uppercase;color:var(--goldh)}
.avBtn.avMuh{margin-top:8px;background:transparent;
  border:1px dashed rgba(236,210,126,.42);color:var(--goldh,#ecd27e);opacity:.85}
.avBtn.avMuh:hover,.avBtn.avMuh:focus-visible{opacity:1}
.nyDaha{display:block;width:100%;margin:14px 0 4px;padding:11px 14px;border-radius:12px;
  border:1px dashed var(--line);background:transparent;color:var(--goldh,#ecd27e);
  font:600 13px/1.3 inherit;cursor:pointer;opacity:.8;transition:opacity .2s ease}
.nyDaha:hover,.nyDaha:focus-visible{opacity:1}
.nyDaha:disabled{cursor:default;opacity:.5}
.nyDiag{width:32px;height:32px;border-radius:50%;border:1px solid var(--line);
  background:transparent;color:var(--goldh,#ecd27e);cursor:pointer;font-size:13px;flex:none;
  margin-right:6px;opacity:.75;transition:opacity .2s ease}
.nyDiag:hover,.nyDiag:focus-visible{opacity:1}
.nyX{width:32px;height:32px;border-radius:50%;border:1px solid var(--line);
  background:transparent;color:var(--mut);cursor:pointer;font-size:13px;flex:none}
.nyIc{overflow-y:auto;padding:12px 16px 20px;-webkit-overflow-scrolling:touch}
.nyKayit{margin-bottom:16px}
.nySur{display:flex;align-items:baseline;gap:8px;margin-bottom:6px}
.nySur b{font:700 12.5px/1 "Figtree";color:var(--goldh)}
.nySur i{font:400 10px/1 "Figtree";font-style:normal;color:var(--dim)}
.nyIc ul{margin:0;padding-left:18px}
.nyIc li{font-size:12.5px;line-height:1.62;color:var(--mut);margin-bottom:5px}
.nyBos{font-size:12px;color:var(--dim);padding:8px 0}
/* Toast'taki ikincil düğme birincil kadar dikkat çekmesin */
.skToast .act.ikincil{background:transparent;border:1px solid var(--line);color:var(--mut)}
@media (prefers-reduced-motion:reduce){
  .nyKat,.nyKutu{transition:none}
}
#mbAc{transition:transform .28s cubic-bezier(.32,.9,.35,1)}
#mbAc.acik{transform:rotate(180deg)}
/* tekrar döngüsü çubuğu */
/* Döngü çubuğu ile mini bar sabit konumdaydı; mini bar denetimleri
   açılınca büyüyüp döngü çubuğunun ÜSTÜNE biniyordu. Artık ikisi tek bir
   alt yığında akar — biri büyüyünce diğeri yukarı itilir, çakışma olmaz. */
/* çalanların tam listesi — alt sayfa */
#calanSayfa{position:fixed;inset:auto 0 0 0;z-index:760;max-height:78vh;overflow-y:auto;
  overscroll-behavior:contain;
  background:linear-gradient(180deg,color-mix(in srgb,var(--gold) 6%,var(--bg)),var(--bg));
  border-top:1px solid var(--line2);border-radius:20px 20px 0 0;
  padding:14px 16px calc(24px + env(safe-area-inset-bottom));box-shadow:var(--e4)}
#calanSayfa[hidden]{display:none}
.csBaslik{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.csBaslik span{font:700 9.5px/1 "Figtree";letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}
#csKapat{margin-left:auto;width:30px;height:30px;border-radius:50%;cursor:pointer;
  font-family:inherit;font-size:12px;color:var(--mut);border:1px solid var(--line);background:transparent}
.csGrup{font:700 8.5px/1 "Figtree";letter-spacing:.18em;text-transform:uppercase;
  color:var(--dim);margin:12px 0 6px}
.csGrup:first-child{margin-top:0}
/* denetimli kart: ses, tempo, süre */
.csKart{margin-bottom:6px;border-radius:11px;border:1px solid var(--line);
  background:rgba(255,255,255,.02);overflow:hidden}
.csKart.denetimli .csSatir{border-bottom:1px solid color-mix(in srgb,var(--gold) 10%,transparent);margin-bottom:0}
.csKart .csSatir{border:none;background:none;margin-bottom:0}
.csDenetim{padding:8px 11px 10px;display:flex;flex-direction:column;gap:7px}
.csRow{display:flex;align-items:center;gap:8px}
.csEt{flex:none;width:34px;font:600 8.5px/1 "Figtree";letter-spacing:.1em;
  text-transform:uppercase;color:var(--dim)}
.csRow input[type=range]{flex:1;min-width:0;height:20px}
.csDeg{flex:none;min-width:42px;text-align:right;font:600 9.5px/1 "Figtree";
  color:var(--goldh);font-variant-numeric:tabular-nums}
.csSureBtn{flex:1;display:flex;gap:4px}
.csSureBtn button{flex:1;padding:6px 3px;border-radius:7px;cursor:pointer;font-family:inherit;
  font:600 9px/1 "Figtree";color:var(--mut);border:1px solid var(--line);
  background:transparent;transition:color .2s,border-color .2s,background .2s}
.csSureBtn button.on{color:var(--goldh);
  border-color:color-mix(in srgb,var(--gold) 45%,transparent);
  background:color-mix(in srgb,var(--gold) 12%,transparent)}
.csSure{flex:none;font:700 9px/1 "Figtree";color:var(--gold);
  padding:4px 8px;border-radius:99px;font-variant-numeric:tabular-nums;
  background:color-mix(in srgb,var(--gold) 14%,transparent)}
.csSatir{display:flex;align-items:center;gap:10px;padding:9px 11px;margin-bottom:5px;
  border-radius:10px;border:1px solid var(--line);background:rgba(255,255,255,.02)}
.csAd{flex:1;min-width:0;font:500 11px/1.4 "Figtree";color:var(--ink);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.csEk{flex:none;font:600 9.5px/1 "Figtree";color:var(--goldh);
  font-variant-numeric:tabular-nums;white-space:nowrap}
.csKapa{flex:none;width:26px;height:26px;border-radius:8px;cursor:pointer;
  font-family:inherit;font-size:10px;color:var(--dim);
  border:1px solid var(--line);background:transparent}
#altYigin{position:fixed;left:10px;right:10px;
  bottom:calc(10px + env(safe-area-inset-bottom));z-index:700;
  display:flex;flex-direction:column;gap:8px;pointer-events:none}
#altYigin>*{pointer-events:auto}
#donguCubuk{position:static;left:auto;right:auto;bottom:auto;z-index:auto;
  display:flex;align-items:center;gap:10px;padding:9px 13px;border-radius:12px;
  border:1px solid color-mix(in srgb,var(--gold) 42%,transparent);
  background:color-mix(in srgb,var(--gold) 12%,var(--bg));box-shadow:var(--e2)}
#donguCubuk[hidden]{display:none}
.dcAd{flex:1;min-width:0;font:600 11px/1.3 "Figtree";color:var(--goldh);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dcSay{flex:none;font:700 11px/1 "Figtree";color:var(--ink);
  font-variant-numeric:tabular-nums;padding:5px 9px;border-radius:99px;
  background:color-mix(in srgb,var(--gold) 18%,transparent)}
#dcDur{flex:none;font:600 10px/1 "Figtree";padding:8px 11px;border-radius:9px;
  cursor:pointer;font-family:inherit;color:var(--mut);
  border:1px solid var(--line);background:transparent}
#miniBar[hidden]{display:none}
#miniBar{position:static;
 display:flex;align-items:center;gap:12px;background:rgba(var(--sayfaK),.93);
 -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
 border:1px solid var(--line2);border-radius:13px;padding:10px 13px;
 box-shadow:var(--e2);position:relative;
  border-color:color-mix(in srgb,var(--gold) 34%,transparent);
  box-shadow:var(--e2), 0 0 18px -6px color-mix(in srgb,var(--gold) 45%,transparent)}
/* Çerçevede dolaşan altın ışıltı — bir şey çalarken canlı olduğunu gösterir.
   Konumlandırma katmanı olduğu için içeriği engellemez. */
#miniBar::before{content:'';position:absolute;inset:-1px;border-radius:inherit;
  padding:1px;pointer-events:none;
  background:conic-gradient(from var(--isikAci,0deg),
    transparent 0deg, transparent 250deg,
    color-mix(in srgb,var(--goldh) 85%,transparent) 300deg,
    color-mix(in srgb,var(--gold) 60%,transparent) 330deg,
    transparent 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
  animation:barIsilti 4.5s linear infinite}
@keyframes barIsilti{to{--isikAci:360deg}}
@property --isikAci{syntax:'<angle>';initial-value:0deg;inherits:false}
@media (prefers-reduced-motion:reduce){#miniBar::before{animation:none;opacity:.4}}
#miniBar.paused{border-color:rgba(255,255,255,.18)}
.mbPulse{width:34px;height:34px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;font-size:16.5px;
 background:radial-gradient(circle,color-mix(in srgb,var(--goldh) 35%,transparent),color-mix(in srgb,var(--gold) 10%,transparent));animation:mbPl 2.2s ease-in-out infinite}
#miniBar.paused .mbPulse{animation:none;opacity:.55;filter:grayscale(.6)}
@keyframes mbPl{0%,100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--goldh) 25%,transparent)}50%{box-shadow:0 0 0 8px color-mix(in srgb,var(--goldh) 0%,transparent)}}
.mbInfo{flex:1 1 110px;min-width:0}
.mbT{font-size:12.5px;font-weight:600;color:var(--goldh);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#miniBar.paused .mbT{color:var(--mut)}
.mbS{font-size:10.5px;color:var(--mut);white-space:normal;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;line-height:1.45}
.mbBtn{width:36px;height:36px;border-radius:50%;border:1px solid var(--line2);background:color-mix(in srgb,var(--gold) 10%,transparent);
 color:var(--goldh);font-size:16.5px;flex:none;display:flex;align-items:center;justify-content:center;cursor:pointer;font-family:inherit}
.mbBtn.stop{color:#ff9e9e;border-color:rgba(255,120,120,.3);background:rgba(255,90,90,.06)}
body[data-tema="sabah"] #miniBar{background:rgba(247,241,226,.95)}
/* Bar görünürken: toast'lar yukarı, içerik altına nefes payı */
body.mini-on #rateToast{bottom:calc(78px + env(safe-area-inset-bottom))}
body.mini-on .rxToastMsg{bottom:calc(82px + env(safe-area-inset-bottom))}
body.mini-on .wrap{padding-bottom:calc(96px + env(safe-area-inset-bottom))}

/* ═══ Mobil dokunma & kullanılabilirlik paketi ═══ */
/* iOS Safari, odaklanılan giriş 16px altındaysa sayfayı zorla yakınlaştırır;
   tüm yazılabilir girişleri/seçimleri 16px'e sabitleyerek bunu kökten önlüyoruz. */
input[type=text],input[type=password],input[type=email],input[type=number],select,textarea{font-size:16.5px!important}
/* Çift-dokunuş yakınlaştırma ve 300ms dokunuş gecikmesini öldür — hızlı zikir
   çekiminde kritik (aksi hâlde art arda dokunuşlar zoom'a dönüşebiliyor). */
button,summary,.sw,.tab,.tabTekke,.rut,.rxChip,.rxHistRow,.mzbzTap,.rxItem,.zP{touch-action:manipulation}
/* .sw anahtarları görsel olarak 42×23; ::before ile görünmez dokunma alanını
   her yönde 10px büyütüyoruz (knob ::after'ta, ::before boştaydı). */
.sw::before{content:'';position:absolute;inset:-10px}
/* Küçük yardımcı butonlar 35px ölçüldü; 40px min dokunma yüksekliği. */
.btn{min-height:40px}
.rxHistFav,.rxHistDel{min-width:34px;min-height:34px}

.rxNowBtn{display:flex;align-items:center;gap:8px;width:100%;text-align:left;background:linear-gradient(90deg,rgba(46,143,127,.16),color-mix(in srgb,var(--gold) 8%,transparent));border:1px solid var(--line2);border-radius:13px;padding:11px 13px;color:var(--ink);font-size:12.5px;font-family:inherit;cursor:pointer;margin-bottom:11px;transition:background 0.2s}
.rxNowBtn b{color:var(--goldh)}
.rxNowBtn span{margin-left:auto;color:var(--goldh)}
.rxNowBtn:active{background:rgba(46,143,127,.22)}
.rxHistTitle{font-size:10.5px;color:var(--dim);text-transform:uppercase;letter-spacing:.05em;margin:2px 2px 7px}
.rxHistRow{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:10px;padding:9px 11px;margin-bottom:7px;cursor:pointer}
.rxHistRow:active{background:color-mix(in srgb,var(--gold) 8%,transparent)}
.rxHistIc{font-size:16.5px}
.rxHistTt{flex:1;font-size:12.5px;color:var(--ink)}
.rxHistFav,.rxHistDel{background:none;border:none;font-size:16.5px;color:var(--dim);cursor:pointer;padding:3px 6px;font-family:inherit}
.rxHistFav.on{color:var(--goldh)}
.rxHistDel:active{color:#ff9e9e}
#rxHist{margin-bottom:12px}
.rxRut{background:color-mix(in srgb,var(--gold) 10%,transparent);border-color:var(--line2);color:var(--goldh)}
.rxChips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:11px}
.rxChip{background:rgba(255,255,255,.04);border:1px solid var(--line);color:var(--ink);border-radius:20px;padding:7px 12px;font-size:12.5px;cursor:pointer;transition:background 0.2s,border-color 0.2s}
.rxChip:hover,.rxChip:active{background:color-mix(in srgb,var(--gold) 12%,transparent);border-color:var(--line2)}
.rxInputRow{display:flex;gap:8px;margin-bottom:14px}
.rxInputRow input{flex:1;min-width:0;background:rgba(var(--girdiK),.5);border:1px solid var(--line);border-radius:10px;padding:11px 13px;color:var(--ink);font-size:14px;font-family:inherit}
.rxInputRow input:focus{outline:none;border-color:var(--line2)}
.rxInputRow .btn{flex:none;white-space:nowrap}
.rxCard{background:linear-gradient(180deg,rgba(var(--vurguK),.4),rgba(var(--girdiK),.35));border:1px solid var(--line2);border-radius:13px;padding:16px;animation:rxIn .4s ease}
@keyframes rxIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.rxHead{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.rxIcon{width:30px;height:30px;flex:none;display:flex;align-items:center;justify-content:center;filter:drop-shadow(0 0 5px currentColor)}
.rxIcon svg{width:100%;height:100%}
.rxHead b{font-size:16.5px;color:var(--goldh);display:block}
.rxHead small{font-size:10.5px;color:var(--dim)}
.rxWhy{font-size:12.5px;line-height:1.7;color:var(--mut);background:rgba(0,0,0,.16);border-radius:10px;padding:12px 13px;margin-bottom:13px}
.rxGrid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:13px}
.rxItem{position:relative;background:rgba(255,255,255,.035);border:1px solid var(--line);border-radius:13px;padding:12px;cursor:pointer;transition:border-color 0.2s,background 0.2s;display:flex;flex-direction:column;gap:4px}
.rxItem:not(.rxBreath):hover{border-color:var(--line2);background:color-mix(in srgb,var(--gold) 8%,transparent)}
.rxItem[role="button"]:focus-visible,.libRow[role="button"]:focus-visible{outline:2px solid var(--goldh);outline-offset:2px}
.rxItem.rxBreath{grid-column:1 / -1}
.rxItem.rxBreath[data-rx]{cursor:pointer}
.rxItem.rxBreath[data-rx]:hover{border-color:var(--line2);background:color-mix(in srgb,var(--gold) 8%,transparent)}
.rxItem.rxDone{border-color:var(--emerald);background:rgba(46,143,127,.12)}
.rxK{font-size:10.5px;color:var(--dim);text-transform:uppercase;letter-spacing:.04em}
.rxItem b{font-size:14px;color:var(--ink)}
.rxItem small{font-size:10.5px;color:var(--mut)}
.rxApply{font-size:10.5px;color:var(--goldh);margin-top:3px}
.rxItem.rxDone .rxApply{color:#5fd39e}
.rxAmbWrap{display:flex;flex-wrap:wrap;gap:4px;margin:2px 0}
.rxAmbChip{font-size:10.5px;background:rgba(255,255,255,.06);border-radius:10px;padding:3px 7px;color:var(--ink)}
.rxRitual{font-size:11.5px;line-height:1.65;color:var(--mut);border-left:2px solid var(--line2);padding:2px 0 2px 11px;margin-bottom:14px}
.rxRitual b{color:var(--goldh)}
.rxActions{display:flex;gap:8px;flex-wrap:wrap}
.rxActions .btn{flex:1;min-width:130px}
.rxAll{background:rgba(46,143,127,.14);border-color:var(--emerald);color:#8fe3cf}
.rxAI{background:rgba(123,111,240,.1);border-color:rgba(123,111,240,.35);color:#c9c1ff}
.rxAIBox{margin-top:13px}
.rxAIHint{font-size:11.5px;line-height:1.6;color:var(--mut);background:rgba(123,111,240,.08);border:1px solid rgba(123,111,240,.25);border-radius:10px;padding:11px 13px}
.rxAIload{font-size:12.5px;color:#c9c1ff;padding:10px 0}
.rxAITitle{font-size:12.5px;color:#c9c1ff;font-weight:600;margin-bottom:6px}
.rxAIText{font-size:12.5px;line-height:1.72;color:var(--ink);background:rgba(123,111,240,.07);border-radius:10px;padding:12px 13px}
.rxToastMsg{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(20px);background:rgba(var(--vurguK),.96);border:1px solid var(--line2);color:var(--goldh);padding:11px 18px;border-radius:20px;font-size:12.5px;opacity:0;pointer-events:none;transition:opacity 0.3s,transform 0.3s;z-index:200}
.rxToastMsg.show{opacity:1;transform:translateX(-50%) translateY(0)}
.aikeyBox{margin-top:14px;background:rgba(123,111,240,.06);border:1px solid rgba(123,111,240,.22);border-radius:13px;padding:12px 13px}
.aikeyBox b{font-size:14px;color:#c9c1ff}
.aikeyBox p{font-size:11.5px;color:var(--mut);margin:5px 0 9px;line-height:1.55}
.aikeyRow{display:flex;gap:8px}
.aikeyRow input{flex:1;min-width:0;background:rgba(var(--girdiK),.5);border:1px solid var(--line);border-radius:10px;padding:9px 11px;color:var(--ink);font-size:12.5px;font-family:inherit}
.aikeyRow input:focus{outline:none;border-color:var(--line2)}
.aikeyRow .btn{flex:none}
.aikeyStatus{font-size:11.5px;color:var(--mut);margin-top:7px;min-height:14px}
.aikeyRemember{display:flex;align-items:center;gap:7px;margin-top:8px;color:var(--mut);font-size:11.5px;cursor:pointer}
.aikeyRemember input{accent-color:var(--gold)}
/* r941 AI settings: one native dialog, one set of secret inputs. */
#r941AISettings{color:#eee8da;background:#0b1721;border:1px solid #a98a52;border-radius:20px;width:min(620px,calc(100vw - 24px));max-height:85dvh;box-sizing:border-box;padding:16px;overflow:auto;overscroll-behavior:contain}
#r941AISettings::backdrop{background:rgba(0,0,0,.65)}
#r941AISettings header{display:flex;align-items:center;justify-content:space-between;gap:12px}
#r941AISettings h2{font-size:20px}#r941AISettings header button{padding:10px 18px;min-height:44px;color:inherit;background:#203443;border:1px solid #927e53;border-radius:14px}
#aiProvidersBox .aiProviderGrid{grid-template-columns:1fr;gap:12px}
#aiProvidersBox .aiProviderRow{display:grid;gap:8px;min-width:0;grid-template-columns:1fr}
#aiProvidersBox input:not([type=checkbox]),#aiProvidersBox select{width:100%;box-sizing:border-box;min-width:0;min-height:44px;background:#10222e;color:#f2ead8;border:1px solid #657786;border-radius:10px;padding:10px;font-size:16px}
#aiProvidersBox .aiProviderActions{display:flex;flex-wrap:wrap;gap:8px}#aiProvidersBox .aiProviderActions button{min-height:44px;white-space:normal}
#aiProvidersBox a{color:#9ddcec}#aiProvidersBox small{display:block;line-height:1.5}#aiProvidersBox details{padding:12px 0}#aiProvidersBox summary{min-height:44px;cursor:pointer}


/* ═══ Yâ Mezcelin • Yâ Bezcelin (Berhetiyye — iç & dış arınma) ═══ */
.mzbzBar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:9px}
.mzbzBar .btn{flex:none}
.mzbzBar .mzbzHint{font-size:9.5px;color:var(--dim);line-height:1.5;flex:1;min-width:120px}
.mzbzCard{padding:4px 2px}
.mzbzAr{font-size:26px;text-align:center;color:var(--goldh);letter-spacing:.02em;margin:6px 0 4px;direction:rtl;transition:text-shadow 0.45s,color 0.45s}
.mzbzAr.glow{color:#fff;text-shadow:0 0 18px color-mix(in srgb,var(--goldh) 80%,transparent)}
.mzbzTr{text-align:center;font-size:14px;color:var(--ink);font-weight:600;letter-spacing:.04em;margin-bottom:11px}
.mzbzEsma{display:flex;flex-direction:column;gap:8px;margin-bottom:13px}
.mzbzEsma span{background:color-mix(in srgb,var(--gold) 6%,transparent);border:1px solid var(--line);border-radius:10px;padding:8px 11px;font-size:12.5px;color:var(--ink);display:flex;flex-direction:column;gap:4px}
.mzbzEsma b{color:var(--goldh)}
.mzbzEsma small{font-size:10.5px;color:var(--mut)}
.mzbzCounter{display:flex;align-items:stretch;gap:8px;margin-bottom:12px}
.mzbzTap{flex:1;background:linear-gradient(180deg,rgba(46,143,127,.16),rgba(var(--vurguK),.3));border:1px solid var(--line2);border-radius:13px;padding:16px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:4px;transition:transform 0.12s,background 0.2s;-webkit-tap-highlight-color:transparent;user-select:none}
.mzbzTap:active{background:rgba(46,143,127,.24)}
.mzbzTap.pulse{animation:mzbzPulse .28s ease}
@keyframes mzbzPulse{0%{transform:scale(1)}40%{transform:scale(1.05)}100%{transform:scale(1)}}
.mzbzN{font-size:30px;font-weight:700;color:var(--goldh);font-variant-numeric:tabular-nums;line-height:1}
.mzbzTap small{font-size:10.5px;color:var(--mut);letter-spacing:.05em;text-transform:uppercase}
.mzbzReset{flex:none;padding:0 15px;font-size:16.5px}
.mzbzNote{font-size:11.5px;line-height:1.68;color:var(--mut);background:rgba(0,0,0,.16);border-radius:10px;padding:11px 13px;border-left:2px solid var(--line2)}
.mzbzNote b{color:var(--goldh)}

/* ═══ Gizli Kasa (Berhetiyye) ═══ */
/* Mühr-ü Süleyman yüzüğü — gizli kasanın kapısı.
   Yedi dokunuşta açılır; her dokunuşta hafifçe parlar. */
/* Sürüm yazısı: her temanın kendi vurgu rengiyle boyanır (--goldh),
   hafif bir parıltıyla — «kalp huzuru niyetiyle» yazısının yanında sönük
   gri durmasın diye. Zümrüt temasında --goldh tanımsız olduğu için orada
   turkuaz bir yedek renk (fuşya ailesine yakın canlı bir ton) kullanılır. */
/* Sürüm etiketi: her temanın KENDİ --goldh'sini kullanır (fallback artık
   zümrütün kendi şampanya-altını #ecd27e — önceki fuşya zümrütle çatışıyordu,
   çünkü zümrüt zaten :root'ta güzel bir goldh tanımlıyordu, üstüne yazmıştım).
   Premium his: kalın ağırlık, hafif harf aralığı, iki katmanlı ışıltı (yakın
   sıkı parlama + uzak yumuşak hâle) ve nefes alır gibi yavaş nabız —
   dikkat çekmeden fark edilir bir canlılık. */
#surumEtiket{
  color:var(--goldh, #ecd27e);
  font-weight:700;
  letter-spacing:.015em;
  /* r512 — B-05: Android'de uzun basma NATIVE METIN SECIMINE gidiyordu.
     Chrome ~500 ms'de seçimi başlatıp "Göster/Kopyala/Paylaş" menüsünü ve
     Google arama çubuğunu açıyor; dokunuş dizisi touchcancel ile kesiliyor
     ve 650 ms'lik uzun basma sayacımız hiç dolmuyordu. Seçimi ve callout'u
     bu elemanda kapatmak jesti JS'e bırakır. touch-action:manipulation
     ayrıca çift dokunuşla yakınlaştırma gecikmesini kaldırır. */
  -webkit-user-select:none;
  -moz-user-select:none;
  user-select:none;
  -webkit-touch-callout:none;
  touch-action:manipulation;
  text-shadow:
    0 0 1px color-mix(in srgb, var(--goldh, #ecd27e) 70%, transparent),
    0 0 8px color-mix(in srgb, var(--goldh, #ecd27e) 40%, transparent),
    0 0 18px color-mix(in srgb, var(--goldh, #ecd27e) 22%, transparent);
  transition:color .4s ease, text-shadow .4s ease;
  animation:surumNefes 3.6s ease-in-out infinite;
}
@keyframes surumNefes{
  0%,100%{ filter:brightness(1) saturate(1); }
  50%{ filter:brightness(1.14) saturate(1.18); }
}
@media (prefers-reduced-motion:reduce){ #surumEtiket{ animation:none; } }
#r625DiagQuick{
  display:inline-flex;align-items:center;justify-content:center;min-height:44px;margin:9px 4px 4px;
  padding:9px 15px;border:1px solid color-mix(in srgb,var(--goldh,#ecd27e) 35%,var(--line));
  border-radius:13px;background:color-mix(in srgb,var(--gold,#d6b36b) 8%,rgba(var(--sayfa2K),.72));
  color:var(--goldh,#ecd27e);font:750 11px/1.2 "Figtree",system-ui;letter-spacing:.02em;
  touch-action:manipulation;cursor:pointer;-webkit-tap-highlight-color:transparent
}
#r625DiagQuick:active{transform:scale(.98)}

#vaultTrigger{display:inline-flex;align-items:center;justify-content:center;
  width:28px;height:28px;vertical-align:-.32em;cursor:pointer;
  color:color-mix(in srgb,var(--gold) 55%,transparent);
  border-radius:50%;transition:color .2s,transform .12s cubic-bezier(.32,.9,.35,1),box-shadow .3s;
  -webkit-tap-highlight-color:transparent}
#vaultTrigger .ico{width:100%;height:100%}
#vaultTrigger:active{transform:scale(.86)}
#vaultTrigger.dokun .ico{filter:drop-shadow(0 0 12px rgba(255,225,140,.95)) brightness(1.18)}
#vaultTrigger.dokun{box-shadow:0 0 0 2px color-mix(in srgb,var(--gold) 20%,transparent)}
#vaultTrigger.acildi{color:var(--goldh);animation:muhurAcil .9s cubic-bezier(.32,.9,.35,1)}
@keyframes muhurAcil{
  0%{transform:scale(1) rotate(0)}
  40%{transform:scale(1.35) rotate(180deg)}
  100%{transform:scale(1) rotate(360deg)}}
@media (prefers-reduced-motion:reduce){#vaultTrigger.acildi{animation:none}}
.vaultCard{margin-top:14px;background:rgba(10,10,20,.5);border:1px solid rgba(123,111,240,.28);border-radius:13px;padding:13px 14px}
.vaultHead{font-size:14px;color:#c9c1ff;font-weight:600;margin-bottom:9px}
.vaultInfo{font-size:11.5px;color:var(--mut);line-height:1.55;margin:0 0 10px}
/* parola alanı + göz düğmesi */
.pwSar{position:relative;display:flex;flex:1;min-width:0}
.pwSar input{flex:1;min-width:0;padding-right:40px!important}
.pwGoz{position:absolute;right:4px;top:50%;transform:translateY(-50%);
  width:32px;height:32px;border:none;background:transparent;cursor:pointer;
  display:grid;place-items:center;color:var(--mut);font-family:inherit;
  border-radius:8px;transition:color .2s,background .2s}
.pwGoz:hover{color:var(--goldh)}
.pwGoz:active{background:rgba(255,255,255,.06)}
.pwGoz .ico{width:1.15em;height:1.15em}
.pwGoz.acik{color:var(--goldh)}
/* parolamı unuttum */
.vaultUnut{display:block;margin:10px auto 0;background:none;border:none;cursor:pointer;
  font:500 10.5px/1.5 "Figtree";color:var(--dim);text-decoration:underline;
  text-underline-offset:3px;font-family:inherit;padding:4px 8px}
.vaultUnut:hover{color:var(--mut)}
.vaultSifirla{margin-top:12px;padding:12px;border-radius:12px;
  border:1px solid var(--line2);background:color-mix(in srgb,var(--uyari) 8%,transparent)}
.vaultSifirla[hidden]{display:none}
.vaultSifirla p{font:400 10.5px/1.7 "Figtree";color:var(--mut);margin:0 0 10px}
.vaultSifirla b{color:var(--uyari)}
.vaultRow{display:flex;gap:8px}
.vaultRow input{flex:1;min-width:0;background:rgba(var(--girdiK),.55);border:1px solid var(--line);border-radius:10px;padding:9px 11px;color:var(--ink);font-size:12.5px;font-family:inherit;letter-spacing:.05em}
.vaultRow input:focus{outline:none;border-color:rgba(123,111,240,.5)}
.vaultRow .btn{flex:none}
.vaultMsg{font-size:11.5px;color:var(--mut);margin-top:7px;min-height:14px}
.vaultBar{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:9px}
.vaultCount{font-size:11.5px;color:#c9c1ff}
.vaultWarn{font-size:10.5px;line-height:1.6;color:var(--mut);background:rgba(0,0,0,.22);border-radius:10px;padding:10px 11px;margin-bottom:11px}
#vaultList{display:flex;flex-direction:column;gap:8px}
.vItem{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:10px;padding:11px 12px}
.vName{font-size:14px;font-weight:700;color:var(--goldh);margin-bottom:2px}
.vEs{font-size:12.5px;color:#c9c1ff;margin-bottom:5px}
.vM{font-size:12.5px;color:var(--ink);line-height:1.55}
.vD{font-size:11.5px;color:var(--mut);margin-top:4px}
.vI{font-size:11.5px;color:var(--mut);font-style:italic;margin-top:3px}
.vaultChange{margin-top:13px;border-top:1px solid var(--line);padding-top:11px}
.vaultChange b{font-size:12.5px;color:#c9c1ff}
.vaultChange p{font-size:10.5px;color:var(--mut);line-height:1.5;margin:5px 0 8px}
button{font-family:inherit;color:inherit;background:none;border:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
select:not(#ns *){
  font-family:inherit;font-size:12.5px;color:var(--ivory);
  background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:10px;
  padding:7px 8px;outline:none;
}
select option{background:#0b1512;color:var(--ivory)}
.btn{
  padding:9px 14px;border-radius:10px;font-weight:600;font-size:14px;
  border:1px solid var(--line2);color:var(--goldh);
  background:linear-gradient(180deg,color-mix(in srgb,var(--gold) 14%,transparent),color-mix(in srgb,var(--gold) 4%,transparent));
  transition:transform 0.12s, box-shadow 0.2s;
}
.btn:active{transform:scale(.96)}
.btn.danger{color:#e8b1a8;border-color:rgba(194,91,78,.45);background:linear-gradient(180deg,rgba(194,91,78,.16),rgba(194,91,78,.04))}
.btn.playing{box-shadow:0 0 18px color-mix(in srgb,var(--gold) 35%,transparent), inset 0 0 12px color-mix(in srgb,var(--gold) 15%,transparent)}
.btn.rec{color:var(--rec);border-color:var(--rec);animation:recBlink 1.1s ease infinite}

/* ─────────── 3. ANA SES ÇUBUĞU ─────────── */
.mbRow{display:flex;align-items:center;gap:8px}
.mbRow.wrap{flex-wrap:wrap;row-gap:8px}
.mIc{font-size:16.5px;flex:none}
#timerBadge{font-size:11.5px;color:var(--goldh);min-width:0;white-space:nowrap}

/* ─────────── 4. SEKMELER ─────────── */
/* ── Kumanda ızgarası: ikon + minik etiket, basılı tutunca açıklama ── */
.dock{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:10px}
/* dock düğmesi alt belirteci — hangi modda olduğunu gösterir */
.dlAlt{display:block;font:700 7.5px/1 "Figtree";letter-spacing:.14em;text-transform:uppercase;
  color:var(--goldh);opacity:.85;margin-top:2px}
.dockItem{position:relative}
.dockItem{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
  min-height:58px;padding:8px 4px 7px;border-radius:13px;cursor:pointer;font-family:inherit;
  border:1px solid var(--line);
  background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.012) 46%,transparent),var(--panel);
  box-shadow:0 1px 0 rgba(255,255,255,.06) inset,0 8px 20px -16px rgba(0,0,0,.8);
  transition:transform 0.2s,border-color 0.2s,box-shadow 0.2s}
.dockItem.wide{grid-column:span 2;flex-direction:row;gap:8px;justify-content:flex-start;padding:8px 11px}
.dockItem:active{transform:scale(.955)}
.dockItem:hover,.dockItem.tipOn{border-color:var(--line2);
  box-shadow:0 1px 0 rgba(255,255,255,.09) inset,0 0 0 1px color-mix(in srgb,var(--gold) 22%,transparent),0 10px 26px -18px rgba(0,0,0,.9)}
.dockItem .di{font-size:16.5px;line-height:1;filter:drop-shadow(0 0 10px color-mix(in srgb,var(--gold) 30%,transparent))}
.dockItem .dl{font:600 9.5px/1.15 "Figtree";letter-spacing:.13em;text-transform:uppercase;color:var(--mut);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.dockItem:hover .dl,.dockItem.tipOn .dl{color:var(--goldh)}
.dockItem.wide .di{font-size:16.5px}
.dockItem.wide .dl{position:absolute;left:11px;bottom:4px;font-size:9.5px;color:var(--dim)}
.dockItem.wide select{flex:1;min-width:0;background:transparent;border:none;outline:none;
  color:var(--goldh);font:600 12.5px/1 "Figtree";padding:0 0 9px;cursor:pointer;
  -webkit-appearance:none;appearance:none;text-align:left}
.dockItem.wide select option{background:#0b1a17;color:var(--ivory)}
.dockItem.danger{border-color:color-mix(in srgb,var(--danger) 42%,transparent)}
.dockItem .di.dStop{width:1.05em;height:1.05em;border-radius:3px;background:currentColor;display:inline-block}
.dockItem.danger .di{color:var(--danger);filter:drop-shadow(0 0 10px color-mix(in srgb,var(--danger) 35%,transparent))}
.dockItem.danger .dl{color:color-mix(in srgb,var(--danger) 78%,var(--mut))}
.dockItem .dBadge{position:absolute;top:5px;right:6px;width:6px;height:6px;border-radius:50%;
  background:var(--gold);box-shadow:0 0 8px var(--gold);opacity:0;transition:opacity 0.3s}
.dockItem.on .dBadge{opacity:1}
body[data-tema="sabah"] .dockItem.wide select option{background:#f6efdf;color:#3c3122}
/* açıklama balonu */
.dockTip{position:fixed;z-index:9997;max-width:min(310px,84vw);padding:11px 14px;border-radius:13px;
  font:400 11.5px/1.65 "Figtree";color:var(--ivory);
  background:linear-gradient(180deg,rgba(var(--sayfaK),.985),rgba(var(--yuzeyK),.995));
  border:1px solid var(--line2);box-shadow:var(--e3);
  opacity:0;transform:translateY(-5px);transition:opacity 0.2s,transform 0.2s;pointer-events:none}
.dockTip.on{opacity:1;transform:translateY(0)}
.dockTip b{display:block;color:var(--goldh);font:600 11.5px/1.4 "Figtree";letter-spacing:.05em;
  text-transform:uppercase;margin-bottom:4px}
body[data-tema="sabah"] .dockTip{background:linear-gradient(180deg,rgba(252,248,239,.99),rgba(245,238,222,.99))}
.card,.zStage,.sldRow,.jRow,.dock,.tvkBox{max-width:100%}
.sldRow>input[type=range]{min-width:0}
/* ── SVG simge sistemi: currentColor ile tema rengini alır ── */
/* Okunabilirlik tabanı: <small> tarayıcı varsayılanıyla 0.8em'e düşüp
   9px altına iniyordu. Oransal küçülme korunuyor ama 9.5px'in altına inmiyor. */
small{font-size:max(9.5px,.86em)}
[class*="Alt"] span,[class*="alt"] small{font-size:max(9.5px,.86em)}
.ico{display:inline-block;vertical-align:-.14em;width:1em;height:1em;flex:none;color:inherit}
/* Yüzük gerçek metal renklerini taşır; boyutu biraz büyük ve hâlesi var. */
#vaultTrigger .ico{width:26px;height:26px;filter:drop-shadow(0 0 6px rgba(240,200,96,.45))}
/* Düğmelerde metin dikey ortalanırken simge satır kutusunun tepesinde
   kalıyordu; düğmeyi flex'e alarak ikisini aynı eksene getir. */
.btn:has(> .ico),button:has(> .ico){display:inline-flex;align-items:center;justify-content:center;gap:.42em}
.btn > .ico,button > .ico{vertical-align:0}
.opt span:has(> .ico){display:inline-flex;align-items:center;gap:.4em;flex-wrap:wrap}
.pT:has(> .ico),.genBas:has(> .ico){display:flex;align-items:center;gap:.45em}
.secT .ico{width:.9em;height:.9em;vertical-align:-.08em;margin-right:.05em;color:var(--gold)}
.pHead .ico,.gRow>b .ico{margin-right:.35em}
summary .ico{margin-right:.3em;color:var(--gold)}
/* ═══ SEÇİM BELİRGİNLİĞİ ═══
   Seçili öğeler eskiden yalnız ince bir kenarlıkla ayrılıyordu ve vurgu rengi
   sabit altındı — tema değişince seçim görünmez kalıyordu. Artık her seçim:
   temanın kendi vurgu rengini alır + sol işaret çubuğu + halka + hafif yükselme. */
.zItem.act,.cat.act{
  box-shadow:0 0 0 1.5px color-mix(in srgb,var(--gold) 55%,transparent),
             0 6px 18px -10px color-mix(in srgb,var(--gold) 60%,transparent);
  font-weight:700;transform:translateY(-1px)}
.zItem,.cat{transition:transform 0.2s cubic-bezier(.3,1.3,.5,1),box-shadow 0.2s,background 0.2s,color 0.2s}
.zItem.act::before,.cat.act::before{content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);
  width:3px;height:58%;border-radius:0 3px 3px 0;background:var(--goldh)}
.zItem,.cat{position:relative}
.tab.act{position:relative}
.tab.act::after{content:'';position:absolute;left:50%;bottom:3px;transform:translateX(-50%);
  width:20px;height:2.5px;border-radius:3px;background:var(--goldh);
  box-shadow:0 0 10px color-mix(in srgb,var(--goldh) 70%,transparent)}
.pre.act,.chn.on{position:relative}
.pre.act::before,.chn.on::before{content:'';position:absolute;left:0;top:10%;bottom:10%;width:3px;
  border-radius:0 3px 3px 0;background:linear-gradient(180deg,var(--goldh),var(--gold));z-index:2}
.pre.act{box-shadow:0 0 0 1.5px color-mix(in srgb,var(--gold) 45%,transparent),
                    0 8px 22px -12px color-mix(in srgb,var(--gold) 55%,transparent)}
/* dokunma anında geri bildirim — her yerde tutarlı */
.zItem:active,.cat:active,.pre:active,.chip:active,.tab:active,.btn:active{transform:scale(.965)}
.btn,.chip{transition:transform 0.12s,box-shadow 0.2s,border-color 0.2s,background 0.2s,color 0.2s}
/* seçili chip ve anahtar da temanın rengini alsın */
.chip.on{box-shadow:0 0 0 1.5px color-mix(in srgb,var(--gold) 45%,transparent)}
/* ── Tasavvuf sözü kartı ──
   (Bu blok daha önce eklenmemişti; kutu stilsiz görünüyordu.) */
/* veri durumu kutusu */
/* birleşik defter */
/* ═══ İSTATİSTİK EKRANI ═══ */
/* Neuro Engine kartı — ekranın altından yükselir, hiçbir şeyi engellemez */
#neuroKart{position:fixed;left:12px;right:12px;bottom:calc(78px + env(safe-area-inset-bottom));
  z-index:900;padding:14px 15px;border-radius:16px;
  border:1px solid color-mix(in srgb,var(--gold) 40%,transparent);
  background:linear-gradient(160deg,color-mix(in srgb,var(--gold) 11%,var(--bg)),var(--bg));
  box-shadow:var(--e3);animation:nkGir .42s cubic-bezier(.32,.9,.35,1) both}
#neuroKart[hidden]{display:none}
@keyframes nkGir{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){#neuroKart{animation:none}}
.nkBas{font:700 8.5px/1 "Figtree";letter-spacing:.22em;color:var(--gold);
  display:flex;align-items:center;gap:6px;margin-bottom:9px;opacity:.9}
.nkBas .ico{width:1.2em;height:1.2em}
.nkBaslik{font:600 13px/1.4 "Figtree";color:var(--ink);margin-bottom:6px}
.nkGerekce{font:400 10.5px/1.6 "Figtree";color:var(--goldh);margin-bottom:5px}
.nkEylem{font:400 10.5px/1.65 "Figtree";color:var(--mut);margin-bottom:12px}
.nkBtn{display:flex;gap:7px;flex-wrap:wrap;align-items:center}
.nkBtn button{font:600 10.5px/1 "Figtree";padding:9px 13px;border-radius:10px;cursor:pointer;
  font-family:inherit;color:var(--goldh);
  border:1px solid color-mix(in srgb,var(--gold) 40%,transparent);
  background:color-mix(in srgb,var(--gold) 10%,transparent);transition:transform .12s cubic-bezier(.32,.9,.35,1)}
.nkBtn button:active{transform:scale(.95)}
#nkHayir{color:var(--mut);border-color:var(--line);background:transparent}
.nkSessiz{margin-left:auto;font-size:9.5px!important;padding:7px 9px!important;
  color:var(--dim)!important;border:none!important;background:none!important;
  text-decoration:underline;text-underline-offset:3px}
.istUst{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:4px 0 10px}
.istAralik{display:flex;gap:4px}
.istAralik button{font:600 9.5px/1 "Figtree";padding:6px 9px;border-radius:99px;cursor:pointer;
  font-family:inherit;color:var(--mut);border:1px solid var(--line);background:transparent;
  transition:color .2s,border-color .2s,background .2s}
.istAralik button.on{color:var(--goldh);border-color:color-mix(in srgb,var(--gold) 45%,transparent);
  background:color-mix(in srgb,var(--gold) 12%,transparent)}
.istKutular{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
.istKutu{flex:1;min-width:66px;padding:9px 8px;border-radius:11px;text-align:center;
  border:1px solid var(--line);background:rgba(255,255,255,.02)}
.istKutu b{display:block;font:700 17px/1.1 "Figtree";color:var(--goldh);font-variant-numeric:tabular-nums}
.istKutu small{display:block;font:400 8.5px/1.3 "Figtree";color:var(--dim);margin-top:3px}
.istKutu.vurgu{border-color:color-mix(in srgb,var(--gold) 45%,transparent);
  background:color-mix(in srgb,var(--gold) 10%,transparent)}
.istBolum{margin-bottom:16px}
.istBaslik{font:700 9px/1 "Figtree";letter-spacing:.16em;text-transform:uppercase;color:var(--gold);
  margin-bottom:9px;display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.istBaslik small{font:400 8.5px/1 "Figtree";letter-spacing:0;text-transform:none;color:var(--dim)}
/* günlük çubuk grafik */
.istGrafik{display:flex;align-items:flex-end;gap:3px;height:76px;
  padding:6px 8px;border-radius:10px;border:1px solid var(--line);background:rgba(255,255,255,.015)}
.istCubuk{flex:1;min-width:0;height:100%;display:flex;align-items:flex-end}
.istCubuk i{display:block;width:100%;height:var(--h);min-height:2px;border-radius:3px 3px 1px 1px;
  background:linear-gradient(180deg,color-mix(in srgb,var(--gold) 75%,transparent),color-mix(in srgb,var(--gold) 30%,transparent));
  transition:height .45s cubic-bezier(.32,.9,.35,1)}
.istCubuk.bugun i{background:linear-gradient(180deg,var(--goldh),color-mix(in srgb,var(--gold) 45%,transparent));
  box-shadow:0 0 10px color-mix(in srgb,var(--gold) 40%,transparent)}
.istEtiketler{display:flex;gap:3px;margin-top:5px;padding:0 8px}
.istEtiketler span{flex:1;text-align:center;font:500 8px/1 "Figtree";color:var(--dim)}
.istEtiketler.ince{justify-content:space-between}
.istEtiketler.ince span{flex:none}
/* saat dağılımı */
.istSaatler{display:flex;align-items:flex-end;gap:1.5px;height:44px;
  padding:5px 8px;border-radius:10px;border:1px solid var(--line);background:rgba(255,255,255,.015)}
.istSaat{flex:1;min-width:0;height:var(--h);min-height:2px;border-radius:2px;
  background:color-mix(in srgb,var(--gold) 55%,transparent);align-self:flex-end}
/* listeler */
.istSatir{display:flex;align-items:center;gap:8px;padding:5px 2px;
  font:400 10.5px/1.4 "Figtree";color:var(--ink)}
.isAd{flex:0 0 38%;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.isBar{flex:1;min-width:0;height:6px;border-radius:99px;background:rgba(255,255,255,.05);overflow:hidden}
.isBar i{display:block;height:100%;border-radius:99px;
  background:linear-gradient(90deg,color-mix(in srgb,var(--gold) 70%,transparent),var(--goldh));
  transition:width .5s cubic-bezier(.32,.9,.35,1)}
.isN{flex:none;font:600 9.5px/1 "Figtree";color:var(--goldh);font-variant-numeric:tabular-nums;min-width:26px;text-align:right}
.istNot{font:400 9.5px/1.6 "Figtree";color:var(--dim);text-align:center;padding-top:2px}
.bdBas{font:700 9.5px/1 "Figtree";letter-spacing:.22em;color:var(--gold);margin:4px 0 9px}
.bdKutu{border:1px solid var(--line);border-radius:13px;padding:11px 12px;margin-bottom:14px;
  background:rgba(255,255,255,.02)}
.bdOzet{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.bdOzet span{font:600 9.5px/1.5 "Figtree";color:var(--mut);
  border:1px solid var(--line);border-radius:99px;padding:4px 10px}
.bdOzet b{color:var(--goldh);font-size:11.5px}
.bdListe{display:flex;flex-direction:column;gap:4px}
.bdSatir{display:flex;align-items:baseline;gap:8px;font:400 10.5px/1.6 "Figtree";color:var(--mut);
  padding:5px 7px;border-radius:7px;background:rgba(255,255,255,.015)}
.bdSatir.tekke{background:color-mix(in srgb,var(--gold) 6%,transparent)}
.bdGun{flex:none;width:52px;color:var(--dim);font-variant-numeric:tabular-nums}
.bdDetay{flex:1;min-width:0;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bdSure{flex:none;color:var(--goldh);font-weight:600;font-variant-numeric:tabular-nums}
.veriKutu{border:1px solid var(--line);border-radius:13px;padding:11px 13px;margin-bottom:11px;
  background:rgba(255,255,255,.02)}
.veriSatir{display:flex;justify-content:space-between;align-items:baseline;gap:12px;
  font:400 10.5px/1.9 "Figtree";color:var(--mut)}
.veriSatir b{color:var(--goldh);font-weight:600}
.veriNot{font:400 9.5px/1.6 "Figtree";color:var(--ok);margin-top:7px}
.veriUyari{font:400 9.5px/1.65 "Figtree";color:var(--uyari);margin-top:8px;
  padding:8px 10px;border-radius:10px;background:var(--uyaribg)}
.veriUyari b{color:var(--uyari)}
#sozKutu{position:relative;margin:11px 0 2px;padding:12px 42px 12px 14px;border-radius:13px;
  border:1px solid var(--line);background:color-mix(in srgb,var(--gold) 6%,transparent)}
#sozKutu[hidden]{display:none}
.sozMetin{font:italic 500 14px/1.8 var(--fD);color:var(--ink)}
/* hadîs kartı — sözlerden ayrı dursun */
#sozKutu.hadis{border-color:color-mix(in srgb,var(--ok) 34%,transparent);
  background:color-mix(in srgb,var(--ok) 6%,transparent)}
#sozKutu.hadis .sozKim{color:var(--ok)}
#sozKutu.hadis .sozYeni{color:var(--ok)}
.sozTur{font:700 8.5px/1 "Figtree";letter-spacing:.2em;color:var(--ok);
  display:flex;align-items:center;gap:5px;margin-bottom:8px;opacity:.9}
.sozTur.nispet{color:var(--gold)}
.sozTur .ico{width:1.1em;height:1.1em}
.sozGuncel{font:400 10.5px/1.7 "Figtree";color:var(--mut);margin-top:8px;
  padding-top:8px;border-top:1px dashed color-mix(in srgb,var(--gold) 22%,transparent)}
.sozKim{font:600 9.5px/1.5 "Figtree";color:var(--gold);margin-top:8px;letter-spacing:.03em}
.sozKim i{font-style:normal;color:var(--dim);font-weight:400}
.sozYeni{position:absolute;top:9px;right:9px;width:27px;height:27px;border-radius:10px;cursor:pointer;
  border:1px solid var(--line);background:transparent;color:var(--gold);font-size:12.5px;
  display:grid;place-items:center;font-family:inherit;transition:transform 0.2s}
.sozYeni:active{transform:scale(.9) rotate(-90deg)}
.sozSay{font:600 9.5px/1 "Figtree";color:var(--goldh)}
#sozSheet{position:fixed;inset:auto 0 0 0;z-index:960;max-height:82vh;overflow-y:auto;
  overscroll-behavior:contain;
  background:linear-gradient(180deg,rgba(var(--sayfaK),.97),rgba(var(--sayfa2K),.99));
  border-top:1px solid var(--line2);border-radius:20px 20px 0 0;
  padding:14px 16px calc(18px + env(safe-area-inset-bottom))}
#sozSheet[hidden]{display:none}
#sozSheet textarea{width:100%;border-radius:10px;border:1px solid var(--line);
  background:rgba(0,0,0,.25);color:var(--ink);padding:12px;font:400 12.5px/1.7 "Figtree";resize:vertical}
body[data-tema="sabah"] #sozSheet{background:linear-gradient(180deg,rgba(250,245,234,.99),rgba(243,235,217,.99))}
body[data-tema="sabah"] #sozSheet textarea{background:rgba(255,255,255,.7)}
/* Sekme geçişi zaten var: .tabEbru animasyonu (0.42s) — tekrar eklenmedi. */
.bosDurum{display:flex;flex-direction:column;align-items:center;gap:8px;
  padding:24px 16px;text-align:center;color:var(--dim)}
.bosDurum .ico{width:1.9em;height:1.9em;color:var(--gold);opacity:.5}
.bosDurum b{font:600 11.5px/1.5 "Figtree";color:var(--mut)}
.bosDurum small{font:400 10.5px/1.6 "Figtree";color:var(--dim);max-width:230px}
.tabs{display:flex;gap:4px;margin:14px 0 14px;padding:4px;border-radius:13px;border:1px solid var(--line);
  position:sticky;top:6px;z-index:60;
  background:rgba(var(--yuzeyK),.97);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
body[data-tema="sabah"] .tabs{background:rgba(247,241,226,.97)}
.tab{flex:1;text-align:center;padding:10px 4px;border-radius:10px;color:var(--mut);font-weight:600;font-size:14px;letter-spacing:.03em;transition:0.2s}
.tab.act{color:var(--goldh);background:linear-gradient(180deg,color-mix(in srgb,var(--gold) 16%,transparent),color-mix(in srgb,var(--gold) 5%,transparent));box-shadow:inset 0 0 0 1px var(--line2)}
.tabTekke{cursor:pointer;font:inherit;flex:.9;display:flex;align-items:center;justify-content:center;padding:10px 4px;border-radius:10px;text-decoration:none;color:var(--goldh);font-weight:600;font-size:14px;letter-spacing:.03em;border:1px solid var(--line2);background:color-mix(in srgb,var(--gold) 7%,transparent);box-shadow:0 0 14px color-mix(in srgb,var(--gold) 8%,transparent) inset}

/* ─────────── 5. KAYDIRICILAR (sliders) ─────────── */
input[type=range]:not(#ns *){-webkit-appearance:none;appearance:none;background:transparent;height:26px;width:100%;--val:50%}
input[type=range]:not(#ns *)::-webkit-slider-runnable-track{height:4px;border-radius:7px;background:linear-gradient(90deg,var(--gold) var(--val),rgba(255,255,255,.12) var(--val))}
input[type=range]:not(#ns *)::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;margin-top:-6px;background:radial-gradient(circle at 35% 35%,var(--goldh),var(--gold));border:1px solid color-mix(in srgb,var(--gold) 55%,#000);box-shadow:0 0 9px color-mix(in srgb,var(--gold) 60%,transparent)}
input[type=range]:not(#ns *)::-moz-range-track{height:4px;border-radius:7px;background:rgba(255,255,255,.12)}
input[type=range]::-moz-range-progress{height:4px;border-radius:7px;background:var(--gold)}
input[type=range]:not(#ns *)::-moz-range-thumb{width:15px;height:15px;border-radius:50%;background:radial-gradient(circle at 35% 35%,var(--goldh),var(--gold));border:1px solid color-mix(in srgb,var(--gold) 55%,#000);box-shadow:0 0 9px color-mix(in srgb,var(--gold) 60%,transparent)}
/* ═══ 3B METALİK FREKANS DÜĞMESİ ═══
   20–18000 Hz aralığı logaritmik haritalanır: doğrusal olsaydı kullanışlı
   bölge (100–1000 Hz) toplam yolun %4'üne sıkışırdı. Metal gövde dışa
   bombeli (üstten ışık), iç kısım tersine gradyanla içe girintili. */
.knobWrap{margin:14px 0 12px}
.knobBaslik{font:700 9.5px/1 "Figtree";letter-spacing:.14em;text-transform:uppercase;
  color:var(--goldh);margin-bottom:12px;display:flex;align-items:center;gap:6px;justify-content:center}
.knobSatir{display:flex;align-items:center;justify-content:center;gap:16px}
.knob3d{position:relative;width:132px;height:132px;flex:none;cursor:grab;
  color:var(--gold);touch-action:pan-y pinch-zoom;-webkit-tap-highlight-color:transparent;
  filter:drop-shadow(0 6px 14px rgba(0,0,0,.5))}
.knob3d:active{cursor:grabbing}
.knob3d:focus-visible{outline:2px solid var(--gold);outline-offset:6px;border-radius:50%}
.knobSvg{width:100%;height:100%;display:block}
.knobIpucu{position:absolute;inset:0;pointer-events:none;
  display:flex;flex-direction:column;align-items:center;justify-content:space-between;
  padding:9px 0;opacity:.28;transition:opacity .25s}
.knob3d:hover .knobIpucu,.knob3d:active .knobIpucu{opacity:.7}
.kiUst,.kiAlt{font-size:9px;color:var(--ink);line-height:1}
.knobYardim{text-align:center;font:400 9.5px/1.5 "Figtree";color:var(--dim);margin-top:9px}
.knobYardim b{color:var(--goldh);font-weight:600}
.knobDeger{position:absolute;inset:0;display:flex;flex-direction:column;
  align-items:center;justify-content:center;pointer-events:none;gap:1px}
.knobDeger b{font:700 20px/1 "Figtree";color:var(--ink);
  text-shadow:0 1px 3px rgba(0,0,0,.75);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.knobDeger small{font:600 8.5px/1 "Figtree";letter-spacing:.2em;color:var(--goldh);opacity:.9}
/* -/+ düğmeleri: aynı metal dilde, küçük ve bombeli */
.knobBtn{width:44px;height:44px;flex:none;border-radius:50%;cursor:pointer;font-family:inherit;
  font:400 22px/1 "Figtree";color:var(--ink);
  border:1px solid color-mix(in srgb,var(--gold) 30%,transparent);
  background:linear-gradient(160deg,#dfe6ee 0%,#96a3b2 38%,#5f6a76 72%,#8b97a5 100%);
  box-shadow:inset 0 1px 2px rgba(255,255,255,.6), inset 0 -2px 4px rgba(0,0,0,.4), var(--e2);
  display:grid;place-items:center;transition:transform .12s cubic-bezier(.32,.9,.35,1),box-shadow .2s;
  text-shadow:0 1px 2px rgba(0,0,0,.5)}
.knobBtn:active{transform:scale(.92);
  box-shadow:inset 0 2px 6px rgba(0,0,0,.55), inset 0 -1px 2px rgba(255,255,255,.25)}
.oktavSatir{display:flex;gap:8px;margin-top:10px}
.oktavSatir .octBtn{flex:1;min-width:0;padding:9px 6px;border-radius:10px;
  font:600 11px/1 "Figtree";white-space:nowrap}
.knobAlt{display:flex;align-items:center;gap:8px;margin-top:14px}
.knobAlt .numIn{flex:none;width:88px}
.knobAlt input[type=range]{flex:1;min-width:0}
.sldRow{display:flex;align-items:center;gap:12px;margin:6px 0;flex-wrap:wrap}
/* Dar ekranda (≤360 px) «Hedef · 33 · Ebced · Elle» tek satıra sığmıyor ve
   sayfayı yatay taşırıyordu; artık sarıyor ve alanlar daralabiliyor. */
.sldRow>label{flex:0 0 auto}
.sldRow>select,.sldRow>input{min-width:0}
.sldRow>input[type=range]{flex:1 1 110px}
.sldRow>.ebBtn{flex:0 1 auto;white-space:nowrap}
.sldRow label{font-size:12.5px;color:var(--mut);min-width:74px}
.sldRow input{flex:1}
.valB{font-size:11.5px;color:var(--goldh);min-width:70px;text-align:right;font-variant-numeric:tabular-nums}


/* ═══ r166 — PREMIUM HEDEF / EBCED / SERBEST ═══
   Sayaç motorundaki #targetSel korunur ama görünmez; kullanıcı tek, net bir
   hedef arayüzü görür. Mobilde iki sütun daralınca otomatik tek kolona döner. */
.targetPremium{margin:12px 0 14px}
.targetModeRow{display:grid;grid-template-columns:74px minmax(0,1fr) auto;gap:10px;align-items:center}
.targetModeLabel{font-size:12.5px;color:var(--mut)}
.targetModeSeg{min-width:0;display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:rgba(255,255,255,.025)}
.targetModeBtn,.targetManualBtn,.targetApplyBtn{font-family:inherit;cursor:pointer;color:var(--mut);transition:background .2s,border-color .2s,color .2s,transform .12s,box-shadow .2s}
.targetModeBtn{min-width:0;min-height:48px;padding:0 14px;border:0;background:transparent;display:flex;align-items:center;justify-content:center;gap:8px;font-size:14px}
.targetModeBtn+ .targetModeBtn{border-left:1px solid var(--line)}
.targetModeBtn.act{color:var(--ivory);background:linear-gradient(180deg,color-mix(in srgb,var(--gold) 12%,transparent),rgba(255,255,255,.025));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--gold) 55%,transparent),0 0 16px color-mix(in srgb,var(--gold) 8%,transparent)}
.targetModeBtn .ico,.targetManualBtn .ico{color:var(--goldh);width:16px;height:16px}
.targetManualBtn{min-height:48px;white-space:nowrap;padding:0 15px;border-radius:14px;border:1px solid var(--line2);background:rgba(255,255,255,.025);display:flex;align-items:center;gap:7px;font-size:13px}
.targetManualBtn:active,.targetModeBtn:active,.targetApplyBtn:active{transform:scale(.97)}
.targetLegacySel{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important;clip-path:inset(50%)!important}
.targetDetailCard{margin:12px 0 0;border:1px solid var(--line);border-radius:16px;background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,.012));display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:0;overflow:hidden}
.targetDetailCol{min-width:0;padding:13px 14px 11px}
.targetDetailTitle{text-align:center;font-size:12px;color:var(--goldh);margin-bottom:9px}
.targetDetailActions{display:grid;grid-template-columns:minmax(72px,1fr) auto;gap:8px;align-items:center}
.targetValueBox,.targetValueInput{box-sizing:border-box;width:100%;height:42px;border-radius:11px;border:1px solid var(--line);background:rgba(0,0,0,.18);color:var(--ivory);font:500 19px/1 var(--fB);display:flex;align-items:center;justify-content:center;text-align:center;font-variant-numeric:tabular-nums;outline:none}
.targetValueInput:focus{border-color:var(--line2);box-shadow:0 0 0 2px color-mix(in srgb,var(--gold) 10%,transparent)}
.targetApplyBtn{height:42px;padding:0 13px;border:1px solid var(--line2);border-radius:11px;background:color-mix(in srgb,var(--gold) 5%,transparent);color:var(--goldh);font-size:12px}
.targetDetailHelp{font-size:9.5px;line-height:1.45;color:var(--dim);margin-top:7px;text-align:center}
.targetOr{align-self:stretch;display:grid;place-items:center;color:var(--gold);font-size:10px;position:relative;padding:0 5px}
.targetOr::before,.targetOr::after{content:'';position:absolute;left:50%;width:1px;height:31%;background:var(--line)}
.targetOr::before{top:4%}.targetOr::after{bottom:16%}
.targetHint{grid-column:1/-1;min-height:42px;border:0;border-top:1px solid var(--line);background:rgba(255,255,255,.012);color:var(--dim);padding:0 14px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:9px;text-align:left;font:500 10.5px/1.4 var(--fB);cursor:pointer}
.targetHint>span:first-child{color:var(--goldh);font-size:14px}.targetHint>span:last-child{color:var(--goldh);font-size:19px}
@media(max-width:430px){
  .targetModeRow{grid-template-columns:58px minmax(0,1fr) auto;gap:7px}
  .targetModeBtn{padding:0 8px;font-size:12px;gap:5px}.targetManualBtn{padding:0 10px;font-size:11.5px}
  .targetDetailCol{padding:11px 9px 10px}.targetDetailActions{grid-template-columns:1fr;gap:6px}.targetApplyBtn{width:100%}
}
@media(max-width:355px){
  .targetModeRow{grid-template-columns:1fr auto}.targetModeLabel{grid-column:1/-1;margin-bottom:-2px}.targetDetailCard{grid-template-columns:1fr}.targetOr{display:none}.targetDetailCol+.targetDetailCol{border-top:1px solid var(--line)}
}

/* ─────────── 6. AÇ/KAPAT ANAHTARI ─────────── */
.sw{position:relative;width:42px;height:23px;flex:none;border-radius:20px;background:rgba(255,255,255,.09);border:1px solid var(--line);transition:0.3s}
.sw::after{content:'';position:absolute;top:2px;left:2px;width:17px;height:17px;border-radius:50%;background:#7d938a;transition:0.3s}
.sw.on{background:linear-gradient(90deg,#6d5410,#c9a227);border-color:var(--line2)}
.sw.on::after{left:21px;background:#fff7e0;box-shadow:0 0 9px color-mix(in srgb,var(--goldh) 90%,transparent)}

/* ─────────── 7. AMBİYANS MİKSERİ ─────────── */
/* çalan kanallar şeridi */
#calanSerit{display:flex;flex-wrap:wrap;gap:6px;align-items:center;
  padding:9px 10px;margin:0 0 10px;border-radius:12px;
  border:1px solid color-mix(in srgb,var(--gold) 26%,transparent);
  background:color-mix(in srgb,var(--gold) 7%,transparent)}
#calanSerit[hidden]{display:none}
.csBas{font:700 8.5px/1 "Figtree";letter-spacing:.2em;color:var(--gold);opacity:.85;margin-right:2px}
/* ⚠ r102: .csEt İKİ AYRI bileşende kullanılıyordu — «Şu an çalanlar»
   sayfasındaki SES/SÜRE etiketi (34px, minik) ve çalan şeridindeki
   hap düğmesi. Aynı ad olduğu için hap dolgusu (padding 6/9 + yuvarlak
   kenar) etikete de uygulanıyor, satır taşıyordu. Şerit düğmesi
   .csSeritEt adına taşındı; iki bileşen artık birbirine karışmıyor. */
.csSeritEt{font:600 10px/1 "Figtree";padding:6px 9px;border-radius:99px;cursor:pointer;font-family:inherit;
  color:var(--ink);border:1px solid var(--line);background:rgba(255,255,255,.03);
  display:inline-flex;align-items:center;gap:5px;transition:transform .12s cubic-bezier(.32,.9,.35,1),border-color .2s}
.csSeritEt:active{transform:scale(.94)}
.csSeritEt i{font-style:normal;color:var(--dim);font-size:9px}
.csSeritEt:hover{border-color:color-mix(in srgb,var(--gold) 45%,transparent)}
.csHepsi{font:500 9.5px/1 "Figtree";color:var(--dim);background:none;border:none;cursor:pointer;
  font-family:inherit;text-decoration:underline;text-underline-offset:3px;padding:4px 6px}
.sessRow{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px}
.sess{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 6px;border-radius:13px;border:1px solid var(--line);background:rgba(255,255,255,.03);transition:0.2s}
.sess:active{transform:scale(.97)}
.sess .sIc{font-size:21px}
.sess b{font-size:12.5px;color:var(--ivory)}
.sess small{font-size:9.5px;color:var(--dim)}
.mixGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(144px,1fr));gap:8px;align-items:start}
.chn{padding:9px 10px 7px;border-radius:13px;border:1px solid var(--line);background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,0)),var(--panel);transition:border-color 0.3s, box-shadow 0.3s;overflow:hidden}
.chn.on{border-color:var(--line2);box-shadow:0 0 16px color-mix(in srgb,var(--gold) 12%,transparent), inset 0 0 20px color-mix(in srgb,var(--gold) 5%,transparent)}
.chTop{display:flex;align-items:center;gap:8px;margin-bottom:3px}
.chIc{font-size:16.5px;flex:none}
/* min-width:0 olmadan flex öğesi içeriği kadar büyür ve ellipsis hiç devreye girmez —
   uzun özel ses adları satır atlayıp kartı komşularından uzun yapıyordu (grid'i bozuyordu). */
.chName{flex:1;min-width:0;font-size:12.5px;font-weight:600;line-height:1.2;overflow:hidden}
.chName b{display:block;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chName small{display:block;font-weight:400;font-size:9.5px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Düzenle/Sil artık ayrı, ince bir alt satırda — üst satırda (ikon+isim+anahtar)
   isimle aynı hizada sıkışmıyorlar; bu isme gerçek genişlik kazandırdı
   (14px'ten ~80px'e çıktı, ölçüldü). */
.chActions{display:flex;gap:8px;margin:5px 0 2px}
.chEdit,.chDel{flex:1;min-height:26px;border-radius:7px;border:1px solid var(--line);background:rgba(255,255,255,.03);color:var(--dim);font-size:10.5px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:4px;transition:0.2s;font-family:inherit}
.chEdit:active{background:color-mix(in srgb,var(--gold) 14%,transparent);color:var(--goldh);border-color:var(--line2)}
.chDel:active{background:rgba(194,91,78,.18);color:#e8b1a8;border-color:rgba(194,91,78,.4)}

/* ─────────── 8. FREKANS MODÜLÜ ─────────── */
.orbWrap{display:flex;align-items:center;gap:16px;margin-bottom:10px}
.orb{
  width:64px;height:64px;flex:none;border-radius:50%;position:relative;
  background:radial-gradient(circle at 38% 32%,#f2dc9b,#c9a227 45%,#6d5410 78%,#3c2f09);
  box-shadow:0 0 26px color-mix(in srgb,var(--gold) 35%,transparent);
  animation:orbP var(--bd,1s) ease-in-out infinite;animation-play-state:paused;opacity:.45;transition:opacity 0.45s;
}
.orb.live{animation-play-state:running;opacity:1}
@keyframes orbP{0%,100%{transform:scale(.82);box-shadow:0 0 12px color-mix(in srgb,var(--gold) 25%,transparent)}50%{transform:scale(1);box-shadow:0 0 34px color-mix(in srgb,var(--gold) 60%,transparent)}}
.bandInfo b{font-family:var(--fD);font-size:21px;color:var(--goldh);letter-spacing:.04em}
.bandInfo p{font-size:12.5px;color:var(--mut)}
.seg{display:flex;gap:4px;background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:10px;padding:4px;margin:10px 0}
.seg button{flex:1;padding:7px 4px;border-radius:10px;font-size:12.5px;font-weight:600;color:var(--mut)}
.seg button.act{color:var(--goldh);background:color-mix(in srgb,var(--gold) 13%,transparent);box-shadow:inset 0 0 0 1px var(--line2)}
.bandChips{display:flex;gap:4px;margin:2px 0 8px}

/* ── TON ÖN AYARLARI (r97) ──────────────────────────────────────
   .seg gibi ama dört düğme mobil ekranda tek satıra sığmıyor;
   sarmalı ızgara kullanılıyor. */
.eqPre{display:grid;grid-template-columns:repeat(2,1fr);gap:5px;margin:8px 0 10px}
.eqPre button{padding:8px 6px;border-radius:11px;font-size:11.5px;font-weight:600;
  color:var(--mut);border:1px solid var(--line);background:rgba(255,255,255,.03)}
.eqPre button.act{color:var(--goldh);border-color:var(--line2);
  background:color-mix(in srgb,var(--gold) 12%,transparent)}
.eqPre button:active{transform:scale(.965)}
@media (min-width:480px){ .eqPre{grid-template-columns:repeat(4,1fr)} }
.bandChips span{flex:1;text-align:center;font-size:9.5px;padding:3px 0;border-radius:7px;color:var(--dim);border:1px solid transparent}
.bandChips span.act{color:var(--goldh);border-color:var(--line2);background:color-mix(in srgb,var(--gold) 8%,transparent)}
.frBtns{display:flex;gap:8px;margin-top:10px}
.frBtns .btn{flex:1;text-align:center;padding:12px}
.presetGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(158px,1fr));gap:12px}
.pre{
  text-align:left;padding:12px;border-radius:13px;border:1px solid var(--line);
  background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,0)),var(--panel);
  display:flex;flex-direction:column;gap:4px;transition:0.2s;
}
.pre:active{transform:scale(.97)}
.pre.act{border-color:var(--line2);box-shadow:0 0 16px color-mix(in srgb,var(--gold) 16%,transparent)}
.pre .pIc{font-size:21px}
.pre b{font-size:14px;line-height:1.2}
.pre small{font-size:10.5px;color:var(--mut);line-height:1.35}
#journeyBox{margin-top:12px;padding:10px 12px;border-radius:13px;border:1px dashed var(--line2);background:color-mix(in srgb,var(--gold) 5%,transparent)}
#journeyBox b{color:var(--goldh);font-size:14px}
#journeyBox p{font-size:11.5px;color:var(--mut);margin-top:2px}

/* ─────────── 9. ZİKİR MODÜLÜ ─────────── */
.catRow{display:flex;gap:8px;overflow-x:auto;padding:2px 2px 8px;scrollbar-width:none}
.catRow::-webkit-scrollbar{display:none}
.cat{flex:none;padding:8px 13px;border-radius:20px;font-size:12.5px;font-weight:600;color:var(--mut);border:1px solid var(--line);background:rgba(255,255,255,.03)}
.cat.act{color:var(--goldh);border-color:var(--line2);background:color-mix(in srgb,var(--gold) 10%,transparent)}
.zList{display:flex;flex-wrap:wrap;gap:8px;max-height:142px;overflow-y:auto;padding:2px 2px 8px;scrollbar-width:thin}
.zList::-webkit-scrollbar{display:none}
/* r181 — Esmâ/Berhetiyye varsayılan tek-sıra kompakt liste.
   Kullanıcı isterse tüm isimleri açar; arama sırasında liste otomatik tam görünür. */
.zList.compactOneRow{flex-wrap:nowrap;max-height:40px;overflow:hidden;padding-bottom:2px;
  -webkit-mask-image:linear-gradient(90deg,#000 0,#000 91%,transparent 100%);
  mask-image:linear-gradient(90deg,#000 0,#000 91%,transparent 100%)}
.zList.showAllNames{max-height:none;overflow:visible;-webkit-mask-image:none;mask-image:none;padding-bottom:8px}
.zListToggle{width:100%;margin:4px 0 10px;padding:8px 12px;min-height:34px;border-radius:11px;
  border:1px solid color-mix(in srgb,var(--gold) 22%,var(--line));
  background:color-mix(in srgb,var(--gold) 6%,transparent);color:var(--goldh);
  font:600 11.5px/1.2 inherit;letter-spacing:.01em;cursor:pointer;
  display:flex;align-items:center;justify-content:center;gap:7px;transition:.18s ease}
.zListToggle:hover{background:color-mix(in srgb,var(--gold) 10%,transparent);border-color:var(--line2)}
.zListToggle:active{transform:scale(.985)}
.zListToggle[hidden]{display:none!important}
.zListToggle .zltCount{color:var(--dim);font-size:10px;font-weight:500}
body[data-tema="sabah"] .zListToggle{background:rgba(255,255,255,.45)}
.zItem{flex:none;max-width:230px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:8px 12px;border-radius:13px;font-size:12.5px;color:var(--ivory);border:1px solid var(--line);background:rgba(255,255,255,.03)}
.zItem.act{color:var(--goldh);border-color:var(--line2);background:color-mix(in srgb,var(--gold) 10%,transparent)}

/* İmza sahne: dönen altın halkalar içinde yaşayan zikir */
.zStage{position:relative;min-height:295px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;overflow:hidden;text-align:center;padding:26px 16px}
.rings{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none}
.ring{position:absolute;border-radius:50%}
/* Halkalar sabit pikseldeydi; 344 px dar ekranda (360 px ve altı) sayfayı
   yatay taşırıyordu. Artık görünüm genişliğine göre küçülüyor, oranlar korunuyor. */
.r1:not(#ns *){width:min(300px,80vw);height:min(300px,80vw);border:1px dashed color-mix(in srgb,var(--gold) 40%,transparent);animation:spin 85s linear infinite}
.r2:not(#ns *){width:min(344px,91vw);height:min(344px,91vw);border:1px solid color-mix(in srgb,var(--gold) 14%,transparent);animation:spin 140s linear infinite reverse}
.r3:not(#ns *){width:min(252px,67vw);height:min(252px,67vw);border:1px dotted color-mix(in srgb,var(--goldh) 28%,transparent);animation:spin 60s linear infinite reverse}
.rStar{position:absolute;font-size:14px;color:var(--gold);opacity:.55;text-shadow:0 0 8px color-mix(in srgb,var(--gold) 60%,transparent)}
@keyframes spin{to{transform:rotate(360deg)}}
.zGlow{position:absolute;width:340px;height:340px;border-radius:50%;pointer-events:none;background:radial-gradient(circle,color-mix(in srgb,var(--gold) 13%,transparent),transparent 62%);animation:breath 7s ease-in-out infinite}
.zAr{font-family:var(--fA);font-size:33px;line-height:1.7;color:var(--goldh);direction:rtl;text-shadow:0 0 26px color-mix(in srgb,var(--gold) 35%,transparent);position:relative;max-width:100%}
/* uzun sûre metinleri sahneyi taşırmasın */
.zAr.long{font-size:21px;line-height:2;max-width:34ch;text-shadow:0 0 18px color-mix(in srgb,var(--gold) 28%,transparent)}
.zAr.vlong{font-size:16.5px;line-height:2.05;max-width:40ch}
.zOku{font-family:var(--fD);font-style:italic;font-size:12.5px;line-height:1.65;color:var(--mut);max-width:38ch;margin-top:7px;position:relative}
.zTr{font-family:var(--fD);font-style:italic;font-weight:600;font-size:25px;line-height:1.25;color:var(--ivory);position:relative;max-width:30ch}
.zMean{font-size:12.5px;color:var(--mut);max-width:36ch;position:relative}
.swap .zAr,.swap .zTr,.swap .zMean{animation:swapIn .55s ease}
@keyframes swapIn{0%{opacity:0;transform:translateY(10px)}100%{opacity:1;transform:none}}
.pulse{animation:none!important;text-shadow:inherit!important;filter:none!important;transform:none!important}

/* Sayaç & kontroller */
.zCtl{margin-top:10px}
.cntRow{display:flex;align-items:center;gap:16px}
.cntNums{flex:1}
.cntBig{font-family:var(--fD);font-weight:600;font-size:44px;line-height:1;color:var(--goldh);font-variant-numeric:tabular-nums}
.cntSub{font-size:12.5px;color:var(--mut);margin-top:2px}
.progWrap{position:relative;width:68px;height:68px;flex:none}
.progWrap svg{transform:rotate(-90deg)}
.progWrap .pc{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:11.5px;color:var(--goldh);font-weight:600}
.zOpts{display:grid;grid-template-columns:1fr;gap:12px;margin:12px 0 4px}
.opt{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12.5px;color:var(--mut)}
.tapBtn{
  width:100%;margin-top:10px;padding:24px;border-radius:13px;font-size:16.5px;font-weight:700;letter-spacing:.14em;
  color:var(--goldh);border:1px solid var(--line2);
  background:radial-gradient(140% 200% at 50% -40%,color-mix(in srgb,var(--gold) 24%,transparent),color-mix(in srgb,var(--gold) 5%,transparent));
  box-shadow:inset 0 0 22px color-mix(in srgb,var(--gold) 8%,transparent);
  transition:transform 0.12s;user-select:none;-webkit-user-select:none;
}
.tapBtn:active{transform:scale(.975)}
.zStage{cursor:pointer}
.zStage:active{transform:scale(.992)}
.chPrev{flex:none;width:26px;height:26px;border-radius:50%;border:1px solid var(--line2);
  background:color-mix(in srgb,var(--gold) 12%,transparent);color:var(--goldh);font-size:10.5px;
  display:flex;align-items:center;justify-content:center;padding:0 0 0 1px;cursor:pointer}
.chPrev:active{transform:scale(.9)}
.zBtns{display:flex;gap:8px;margin-top:9px}
.zBtns .btn{flex:1;text-align:center}
.statLine{text-align:center;font-size:11.5px;color:var(--dim);margin-top:12px}
.statLine b{color:var(--goldh)}

/* ─────────── 10. ALT BİLGİ & ORTAK ─────────── */
section[hidden]{display:none}
.chipLbl{font-size:9.5px;letter-spacing:.14em;color:var(--dim);margin:10px 2px 4px;display:flex;justify-content:space-between;align-items:baseline}
.chipLbl small{letter-spacing:.06em;color:var(--gold);font-size:9.5px}
#bandChips span{cursor:pointer}
.wrapChips{flex-wrap:wrap}
.wrapChips span{flex:0 0 auto;min-width:46px;padding:4px 9px;cursor:pointer;border-color:var(--line);color:var(--mut)}
.wrapChips span:active{transform:scale(.94)}
.wrapChips span.act{color:var(--goldh);border-color:var(--line2);background:color-mix(in srgb,var(--gold) 10%,transparent)}
.lrLine{font-size:10.5px;color:var(--dim);text-align:center;margin-top:9px;min-height:14px;letter-spacing:.04em}
.zTools{display:flex;flex-direction:column;gap:8px;margin:2px 0 10px}
#zSearch{background:rgba(var(--girdiK),.6);border:1px solid var(--line);border-radius:10px;padding:9px 12px;color:var(--ink);font:inherit;font-size:12.5px;outline:none;width:100%}
#zSearch:focus{border-color:var(--line2)}
#zSearch::placeholder{color:var(--dim)}
.noHit{font-size:11.5px;color:var(--dim);padding:6px 4px}
.zEb{margin-top:9px;font-size:10.5px;color:var(--gold);letter-spacing:.12em;position:relative;text-transform:uppercase}
.ebBtn{background:color-mix(in srgb,var(--gold) 10%,transparent);border:1px solid var(--line2);color:var(--goldh);border-radius:10px;padding:7px 11px;font:inherit;font-size:11.5px;cursor:pointer;white-space:nowrap}
.ebBtn:active{transform:scale(.96)}
#modeSeg button{font-size:11.5px;padding-left:2px;padding-right:2px}
.jEd{margin-top:12px;border:1px solid var(--line);border-radius:13px;padding:10px 12px;background:rgba(255,255,255,.02)}
/* ── Başlıklar: sol altın şerit, büyük punto, açılınca dönen ok ── */
.jEd summary{cursor:pointer;position:relative;display:flex;align-items:center;gap:8px;
  /* r140: 600 → 400. Kalın başlık her paneli öne çıkarıyordu; hepsi
     öne çıkınca hiçbiri çıkmıyor. İnce ve geniş aralıklı Amiri, r138'de
     Hizb'de denendi ve tuttu — bütün panellere yayıldı. */
  font-family:var(--f-display);font-weight:400;font-size:var(--t-baslik);line-height:1.4;
  color:var(--goldh);letter-spacing:.035em;padding:4px 0 4px 12px;
  text-shadow:0 0 20px color-mix(in srgb,var(--gold) 26%,transparent)}
.jEd summary::-webkit-details-marker{display:none}
.jEd summary::before{content:'';position:absolute;left:0;top:4px;bottom:4px;width:3px;border-radius:3px;
  background:linear-gradient(180deg,var(--gold),transparent);opacity:.85}
.jEd summary::after{content:'▾';margin-left:auto;font-size:11.5px;color:var(--gold);opacity:.75;
  display:inline-block;line-height:1;transform:rotate(0deg);transform-origin:50% 50%;
  transition:transform 0.3s cubic-bezier(.4,1.4,.5,1),opacity 0.2s}
.jEd[open]>summary::after{transform:rotate(180deg);opacity:1}
.jEd[open]>summary{margin-bottom:9px;padding-bottom:9px;
  border-bottom:1px solid color-mix(in srgb,var(--gold) 22%,transparent)}
.jEd[open]>summary::before{opacity:1;background:linear-gradient(180deg,var(--goldh),var(--gold))}
.jRow{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:8px;font-size:11.5px;color:var(--dim)}
.jRow>select,.jRow>input[type=number]{min-width:0;flex:1 1 96px}
.jRow>.ebBtn{flex:0 1 auto}
.jRow select,.jRow input{background:rgba(var(--girdiK),.6);border:1px solid var(--line);border-radius:10px;padding:8px;color:var(--ink);font:inherit;font-size:12.5px}
.jRow select{flex:1;min-width:0}
.jRow input{width:58px;text-align:center}
.jRow .x{border:1px solid var(--line);background:none;color:var(--dim);border-radius:10px;width:30px;height:34px;cursor:pointer;flex:none}
#rateToast{position:fixed;left:12px;right:12px;bottom:14px;z-index:900;background:rgba(var(--sayfaK),.96);border:1px solid var(--line2);border-radius:13px;padding:12px 14px;font-size:12.5px;color:var(--ink);backdrop-filter:blur(10px);box-shadow:var(--e2)}
.rateRow{display:flex;gap:8px;margin-top:9px;justify-content:center;flex-wrap:wrap}
.rateRow button{font-size:12.5px;background:none;border:1px solid var(--line);border-radius:10px;min-width:44px;height:40px;color:var(--gold);cursor:pointer}
.rateRow button:active{transform:scale(.92)}
#logSheet{position:fixed;inset:auto 0 0 0;max-height:70vh;overflow-y:auto;z-index:960;background:linear-gradient(180deg,rgba(var(--sayfaK),.97),rgba(var(--sayfa2K),.99));border-top:1px solid var(--line2);border-radius:20px 20px 0 0;padding:14px 16px calc(16px + env(safe-area-inset-bottom))}
.lsHead{display:flex;align-items:center;gap:12px;margin-bottom:8px;color:var(--goldh)}
.lsHead span{margin-left:auto;font-size:10.5px;color:var(--dim)}
.lsHead button{background:none;border:1px solid var(--line);color:var(--mut);border-radius:10px;width:30px;height:30px;cursor:pointer}
.lsItem{display:flex;gap:8px;align-items:baseline;font-size:11.5px;color:var(--mut);padding:8px 2px;border-bottom:1px dashed var(--line)}
.lsItem b{color:var(--ink);font-weight:600;flex:none}
.lsItem .m{margin-left:auto;color:var(--gold);white-space:nowrap;flex:none}
.lsIns{display:flex;flex-direction:column;gap:4px;font-size:11.5px;color:var(--mut);border:1px solid var(--line);border-radius:10px;padding:9px 11px;margin-bottom:9px}
.lsIns b{color:var(--goldh)}
.lsBars{display:flex;gap:8px;align-items:flex-end;height:56px;margin:2px 2px 12px;padding:0 2px}
.lsBars .lb{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:4px;height:100%}
.lsBars .lb i{display:block;width:100%;min-height:2px;background:linear-gradient(180deg,var(--goldh),var(--gold));border-radius:3px 3px 0 0;opacity:.85}
.lsBars .lb s{text-decoration:none;font-size:9.5px;color:var(--dim)}
#virdBar{display:flex;align-items:center;gap:8px;border:1px solid var(--line2);background:color-mix(in srgb,var(--gold) 7%,transparent);border-radius:13px;padding:9px 12px;margin:2px 0 10px;font-size:12.5px;color:var(--ink)}
#virdBar .btn{margin-left:auto;flex:none;padding:7px 12px}
#virdBar.done{border-color:rgba(80,190,130,.45);background:rgba(40,120,80,.12)}
#recBtn{font-size:14px}
#recBtn.rec,#vhRec.rec{color:var(--rec);border-color:var(--rec);animation:recBlink 1.1s ease infinite}
@keyframes recBlink{50%{opacity:.45}}
#aveOv{position:fixed;inset:0;z-index:800;pointer-events:none;opacity:0;background:radial-gradient(ellipse at 50% 42%,#f6e7b4 0%,#cfa92e 65%,#8a7018 100%)}
#bgEbru{position:fixed;inset:0;width:100%;height:100%;z-index:-1;opacity:.55;pointer-events:none}
#bgParticles{position:fixed;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}
.rutRow{display:flex;gap:8px;overflow-x:auto;margin:0 0 12px;padding:2px 2px 4px;scrollbar-width:none}
.rut{flex:none;display:flex;align-items:center;gap:8px;border:1px solid var(--line2);background:color-mix(in srgb,var(--gold) 8%,transparent);color:var(--goldh);border-radius:99px;padding:8px 13px;font-size:11.5px;cursor:pointer;white-space:nowrap}
.rut:active{transform:scale(.96)}
.rut .rx{color:var(--dim);padding:0 1px;font-size:14px;line-height:1}
.rut.add{border-style:dashed;color:var(--mut);background:transparent}
.hatStat{font-size:11.5px;color:var(--mut);margin:8px 0 7px;line-height:1.55}
.hatStat b{color:var(--goldh)}
.hatBar{height:5px;border-radius:3px;background:rgba(255,255,255,.07);overflow:hidden}
.hatBar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--gold),var(--goldh));border-radius:3px;transition:width 0.45s}
.hatCells{display:flex;flex-wrap:wrap;gap:2.5px;margin-top:8px}
.hatCells span{width:6px;height:6px;border-radius:3px;background:rgba(255,255,255,.08)}
.hatCells span.d{background:var(--gold)}
.hatCells span.a{background:var(--goldh);box-shadow:0 0 6px var(--goldh);animation:hatPulse 1.6s ease infinite}
@keyframes hatPulse{50%{opacity:.45}}
#ltfMap{display:flex;justify-content:center;margin-top:8px}
#ltfMap svg{width:174px;height:auto}
.ltfP{transition:opacity 0.45s}
.ltfP.dim{opacity:.28}
.ltfP.act circle:first-child{animation:ltfGlow 2.2s ease infinite}
@keyframes ltfGlow{50%{opacity:.32}}
.ltfInfo{font-size:11.5px;color:var(--mut);text-align:center;margin-top:8px;line-height:1.65;min-height:48px}
.ltfInfo b{color:var(--goldh)}
.ltfDots{display:flex;gap:8px;justify-content:center;margin-top:7px}
.ltfDots i{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.1)}
.ltfDots i.d{background:var(--gold)}
.ltfDots i.a{background:var(--goldh);box-shadow:0 0 8px var(--goldh)}
.zStage{position:relative}
/* Düğmeler eskiden sahnenin sağ üstünde mutlak konumluydu; Âyetü'l-Kürsî gibi
   uzun metinler satır satır büyüyünce âyetin üstüne biniyordu. Artık metnin
   altında, akışın içinde bir çubukta duruyorlar — hiçbir uzunlukta çakışmaz. */
.zBar{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:14px 0 2px;position:relative;z-index:6}
.zBar .spkBtn{position:static;width:auto;height:auto;border-radius:13px;padding:8px 11px 7px;
  display:flex;flex-direction:column;align-items:center;gap:4px;font-size:16.5px;line-height:1;min-width:62px}
.zBar .spkBtn span{font:600 9.5px/1.15 "Figtree";letter-spacing:.11em;text-transform:uppercase;
  color:var(--mut);white-space:nowrap}
.zBar .spkBtn.has span{color:var(--goldh)}

/* ── FAVORİ YILDIZI ────────────────────────────────────────────
   Tek SVG kullanılıyor; "boş" hâl içi oyulmuş görünsün diye dolgu
   saydamlaştırılıp kontur çiziliyor. Böylece her dokunuşta simgeyi
   değiştirip yeniden hidratlamaya gerek kalmıyor. */
.favBtn .ico{fill:transparent;stroke:currentColor;stroke-width:1.5px;
  stroke-linejoin:round;transition:fill .22s,transform .22s cubic-bezier(.3,1.4,.5,1)}
.favBtn.on{color:var(--goldh);border-color:color-mix(in srgb,var(--goldh) 55%,transparent)}
.favBtn.on .ico{fill:currentColor;stroke:currentColor;transform:scale(1.1)}
.favBtn.on span{color:var(--goldh)}
@media (prefers-reduced-motion:reduce){ .favBtn .ico{transition:none} }
.zBar .spkBtn.zq{font:700 16.5px/1 "Figtree";color:var(--gold);border-style:dashed}
.spkBtn{position:absolute;top:10px;right:10px;z-index:5;width:34px;height:34px;border-radius:50%;border:1px solid var(--line);background:rgba(var(--girdiK),.55);color:var(--mut);font-size:14px;cursor:pointer;backdrop-filter:blur(4px)}
.spkBtn:active{transform:scale(.92)}
.spkBtn.rec2{right:52px}
.zBar .spkBtn.rec2,.zBar .spkBtn.rec3{right:auto;top:auto}
.spkBtn.rec2.has{color:var(--ok);border-color:color-mix(in srgb,var(--ok) 50%,transparent)}
.spkBtn.rec3{right:94px;color:color-mix(in srgb,var(--goldh) 55%,transparent);border-color:color-mix(in srgb,var(--goldh) 40%,transparent)}
.spkBtn.rec3.has{color:#ecd27e;border-color:color-mix(in srgb,var(--goldh) 75%,transparent);box-shadow:0 0 11px color-mix(in srgb,var(--goldh) 45%,transparent)}
.spkBtn.rec3.recording{color:var(--rec);border-color:var(--rec);animation:recBlink 1.1s ease infinite}
.spkBtn.rec2.recording{color:var(--rec);border-color:var(--rec);animation:recBlink 1.1s ease infinite}
.pitBig{font:600 34px/1 "Cormorant Garamond",serif;color:var(--goldh);text-align:center;margin-top:10px;text-shadow:0 0 20px color-mix(in srgb,var(--gold) 25%,transparent)}
.pitSub{font-size:10.5px;color:var(--dim);text-align:center;margin-top:5px;min-height:14px}
.pitSeg{display:flex;flex-wrap:wrap;gap:8px;margin-top:9px;justify-content:center}
.pitSeg span{border:1px solid var(--line);border-radius:10px;padding:5px 9px;font-size:10.5px;color:var(--mut);cursor:pointer}
.pitSeg span.act{color:var(--goldh);border-color:var(--line2)}
.pre{position:relative}
.pre.mine{border-color:rgba(72,200,220,.4)}
.pre .myx{position:absolute;top:5px;right:8px;color:var(--dim);font-size:11.5px}
body.mode-mini [data-lvl="midi"],body.mode-mini [data-lvl="pro"],body.mode-midi [data-lvl="pro"]{display:none!important}
body.mode-mini .chn:not(.on){display:none}
body.mode-mini .card{padding:14px}
/* ── Alt sayfalar: perde + yukarı kayma ──
   Sorun: sayfalar sessizce beliriyordu; kullanıcı bir şeyin açıldığını
   fark etmiyordu. Artık arka plan kararıyor, sayfa aşağıdan kayarak
   geliyor ve perdeye dokunmak kapatıyor. */
#sheetScrim{position:fixed;inset:0;z-index:955;background:rgba(var(--girdiK),.6);
  -webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);animation:scrimIn .22s ease}
#sheetScrim[hidden]{display:none}
@keyframes scrimIn{from{opacity:0}to{opacity:1}}
@keyframes sheetUp{from{transform:translateY(14%);opacity:.4}to{transform:translateY(0);opacity:1}}
#temaSheet:not([hidden]),#helpSheet:not([hidden]),#recSheet:not([hidden]),
#customSoundSheet:not([hidden]),#micHelpSheet:not([hidden]),#logSheet:not([hidden]){
  animation:sheetUp .3s cubic-bezier(.22,1,.36,1)}
/* tutamak — aşağı çekilebilir olduğunu ima eder */
#temaSheet::before,#helpSheet::before,#recSheet::before,
#customSoundSheet::before,#micHelpSheet::before,#logSheet::before{
  content:'';display:block;width:38px;height:4px;border-radius:99px;margin:-4px auto 10px;
  background:color-mix(in srgb,var(--gold) 40%,transparent)}
@media (prefers-reduced-motion:reduce){
  #sheetScrim,#temaSheet:not([hidden]),#helpSheet:not([hidden]),#recSheet:not([hidden]),
  #customSoundSheet:not([hidden]),#micHelpSheet:not([hidden]),#logSheet:not([hidden]){animation:none}
}
body[data-tema="sabah"] #sheetScrim{background:rgba(60,49,34,.4)}
#temaSheet,#helpSheet,#recSheet,#customSoundSheet,#micHelpSheet{position:fixed;inset:auto 0 0 0;z-index:960;background:linear-gradient(180deg,rgba(var(--sayfaK),.97),rgba(var(--sayfa2K),.99));border-top:1px solid var(--line2);border-radius:20px 20px 0 0;padding:14px 16px calc(18px + env(safe-area-inset-bottom));max-height:78vh;overflow-y:auto}
.tkHead{display:flex;align-items:center;gap:12px;margin-bottom:11px;color:var(--goldh);font:600 14px/1 "Cormorant Garamond",serif;letter-spacing:.14em}
.tkHead button{margin-left:auto;background:none;border:1px solid var(--line);color:var(--mut);border-radius:10px;width:30px;height:30px;cursor:pointer}
.tkOpt{display:flex;align-items:center;gap:12px;padding:11px 12px;border:1px solid var(--line);border-radius:13px;margin-bottom:8px;cursor:pointer}
.tkOpt:active{transform:scale(.99)}
.tkOpt.act{border-color:var(--line2);background:color-mix(in srgb,var(--gold) 9%,transparent)}
.tkOpt b{font-size:12.5px;color:var(--ink);flex:1;font-weight:600}
.tkOpt .sw5{display:flex;gap:4px}
.tkOpt .sw5 i{width:16px;height:16px;border-radius:7px;border:1px solid rgba(255,255,255,.16)}
.tkOpt .chk{color:var(--goldh);font-size:16.5px;width:16px;text-align:center}
.tvBar{display:flex;align-items:center;gap:8px;margin:8px 0 4px}
.tvBar .btn{flex:none;padding:8px 13px}
/* ⚠ r102: [hidden] YAZAR STİLİNE YENİLİR. .duaRecBtn kendi display'ini
   verdiği için hidden konsa da görünüyordu — tövbe çubuğundaki eski
   kayıt mikrofonu kutunun dışına taşıyordu. Açıkça bastırılıyor. */
.duaRecBtn[hidden],#tvPlay[hidden]{display:none!important}
.duaRecBtn{flex:none;padding:8px 11px;border:1px solid color-mix(in srgb,var(--goldh) 40%,transparent);border-radius:10px;background:color-mix(in srgb,var(--goldh) 7%,transparent);color:var(--goldh);cursor:pointer;font-size:14px;transition:all 0.3s}
.duaRecBtn.has{border-color:var(--goldh);background:color-mix(in srgb,var(--goldh) 16%,transparent)}
/* r124: aynı kırmızı-nabız stili Hû ve Mezcelin kayıt düğmelerine de
   uygulanabilsin diye ortak sınıf eklendi. */
.duaRecBtn.recording,.btn.recording{border-color:#d9542e;background:rgba(217,84,46,.2);color:#ff9a7a;animation:recPulse 1.1s ease-in-out infinite}
@keyframes recPulse{0%,100%{opacity:1}50%{opacity:.55}}
.duaRecMenu{display:flex;gap:8px;align-items:center;margin:6px 0 2px;font-size:10.5px;color:var(--mut);flex-wrap:wrap}
.virdVakit{display:flex;align-items:center;gap:8px;margin:2px 0 9px;font-size:11.5px;color:var(--mut);flex-wrap:wrap}
.virdVakit select{flex:1;min-width:130px;padding:6px 9px;border-radius:10px;background:rgba(255,255,255,.05);border:1px solid var(--line);color:var(--ivory);font-size:11.5px}
.tcVirdSug{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:9px 0 2px;padding:9px 11px;border-radius:10px;background:linear-gradient(150deg,color-mix(in srgb,var(--goldh) 14%,transparent),transparent);border:1px solid color-mix(in srgb,var(--goldh) 30%,transparent);font-size:11.5px;color:var(--ivory)}
.tcVirdSug .txt{flex:1 1 100%;line-height:1.5;margin-bottom:2px}
.tcVirdSug button{flex:none;padding:6px 12px;border-radius:10px;background:var(--goldh);border:none;color:#1a1408;font-weight:600;cursor:pointer;font-size:11.5px}
.tcVirdSug button.sugX{background:transparent;border:1px solid color-mix(in srgb,var(--goldh) 32%,transparent);color:var(--mut);font-weight:500;padding:6px 10px}
.tcVirdSug button:active{transform:scale(.95)}
.virdBar{display:flex;gap:8px;align-items:center;margin-bottom:9px;flex-wrap:wrap}
.virdBar select{flex:1;min-width:120px;padding:7px 9px;border-radius:10px;background:rgba(255,255,255,.05);border:1px solid var(--line);color:var(--ivory);font-size:12.5px}
.virdBar button{flex:none;padding:7px 10px;border-radius:10px;background:color-mix(in srgb,var(--goldh) 10%,transparent);border:1px solid color-mix(in srgb,var(--goldh) 30%,transparent);color:var(--goldh);cursor:pointer;font-size:12.5px}
.virdBar button:active{transform:scale(.95)}
.virdName{font-size:14px;color:var(--goldh);font-weight:600;margin:2px 0 6px}
.duaOnlyRow{display:flex;align-items:center;gap:8px;margin:7px 0 2px;font-size:11.5px;color:var(--mut);cursor:pointer;user-select:none}
.duaOnlyRow .sw{flex:none;width:34px;height:19px;border-radius:13px;background:rgba(255,255,255,.14);position:relative;transition:background 0.3s}
.duaOnlyRow .sw::after{content:'';position:absolute;left:2px;top:2px;width:15px;height:15px;border-radius:50%;background:var(--ivory);transition:transform 0.3s}
.duaOnlyRow.on .sw{background:var(--goldh)}
.duaOnlyRow.on .sw::after{transform:translateX(15px)}
/* ── Nasuh Tövbesi: kısım kısım kayıt ── */
/* ── Vird programı satırları: esmâ seçici kendi satırında, tam genişlik ── */
/* Kart daha ekonomik: dikey boşluk daraltıldı — dolgu, aralık ve satır
   yükseklikleri küçüldü; okunabilirlik korunarak yer kazanıldı. */
#virdRows .jRow{display:grid;grid-template-columns:1fr auto auto;
  grid-template-areas:"day num btn" "sel sel sel";
  gap:4px 7px;align-items:end;flex-wrap:initial;
  padding:7px 9px;margin-top:5px;border:1px solid var(--line);border-radius:9px;
  background:rgba(255,255,255,.02);border-left:2.5px solid var(--vc,var(--line))}
#virdRows .jRow>b{grid-area:day;align-self:center;font:600 11px/1.25 "Figtree";color:var(--goldh);letter-spacing:.03em}
/* Ebced Değeri etiketi kutuyla ortalı — az önce sola yaslıydı, kutunun
   ortasıyla hizasız duruyordu. */
#virdRows .jRow>.virdNumWrap{grid-area:num;display:flex;flex-direction:column;align-items:center;gap:2px;width:82px;min-width:0}
#virdRows .jRow>.virdNumWrap>label{font:700 8.5px/1.15 "Figtree";letter-spacing:.05em;text-transform:uppercase;
  color:var(--goldh);white-space:nowrap;text-align:center;width:100%}
#virdRows .jRow>.virdNumWrap>input[type=number]{width:100%;min-width:0;text-align:center;font-weight:700;
  padding-top:5px;padding-bottom:5px;border-color:color-mix(in srgb,var(--vc,var(--line)) 40%,var(--line))}
#virdRows .jRow>.x{grid-area:btn;width:30px;height:30px}
#virdRows .jRow>select{grid-area:sel;width:100%;min-width:0;flex:initial;
  font-size:12.5px;padding:9px 11px;white-space:normal;border-color:color-mix(in srgb,var(--vc,var(--line)) 45%,var(--line))}
/* ── Renkli kısım blokları (salavât + tövbe) ── */
/* ── Delâilü'l-Hayrât ── */
.dlBugun{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:11px 13px;border-radius:13px;
  border:1px solid color-mix(in srgb,var(--kc) 45%,transparent);
  background:color-mix(in srgb,var(--kc) 10%,transparent)}
.dlBugun.bos{border-style:dashed;opacity:.85}
.dlGun{font:700 9.5px/1 "Figtree";letter-spacing:.16em;text-transform:uppercase;
  color:var(--kc);border:1px solid color-mix(in srgb,var(--kc) 45%,transparent);
  border-radius:99px;padding:4px 9px}
.dlBugun>b{font:700 14px/1.2 var(--fD);color:var(--kc)}
.dlBugun>small{flex:1 0 100%;font:400 9.5px/1.5 "Figtree";color:var(--mut)}
.dlList{display:flex;flex-direction:column;gap:8px;margin-top:4px}
.dlRow{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:10px;
  border:1px solid var(--line);background:rgba(255,255,255,.02);transition:0.2s}
.dlRow.dolu{border-color:color-mix(in srgb,var(--kc) 42%,transparent);
  background:color-mix(in srgb,var(--kc) 7%,transparent)}
.dlRow.bugun{box-shadow:0 0 0 1.5px color-mix(in srgb,var(--kc) 55%,transparent)}
.dlRow.rec{border-color:var(--rec);background:var(--recbg)}
.dlNokta{flex:none;width:9px;height:9px;border-radius:50%;background:var(--kc);
  box-shadow:0 0 7px color-mix(in srgb,var(--kc) 70%,transparent)}
.dlRow:not(.dolu) .dlNokta{background:transparent;border:1.5px solid color-mix(in srgb,var(--kc) 55%,transparent);box-shadow:none}
.dlAd{flex:1;min-width:0}
.dlAd b{display:block;font:600 11.5px/1.35 "Figtree";color:var(--ink)}
.dlAd small{display:block;font:400 9.5px/1.4 "Figtree";color:var(--dim);margin-top:2px}
.dlBtns{flex:none;display:flex;gap:4px}
.dlB{width:28px;height:28px;border-radius:10px;cursor:pointer;font-size:11.5px;font-family:inherit;
  display:grid;place-items:center;color:var(--kc);
  border:1px solid color-mix(in srgb,var(--kc) 40%,transparent);
  background:color-mix(in srgb,var(--kc) 8%,transparent);transition:transform 0.12s}
.dlB:active{transform:scale(.9)}
.dlRow.rec .dlB.mic{background:var(--rec);border-color:var(--rec);color:#fff;animation:tvkPulse 1.1s infinite}
.genAyar{border-top:1px solid var(--line);margin-top:14px;padding-top:12px}
.genBas{font:700 9.5px/1 "Figtree";letter-spacing:.22em;color:var(--gold);margin-bottom:10px}
.hizRow{display:flex;gap:4px;margin:4px 0 12px}
.hizBtn{flex:1;padding:9px 4px;border-radius:10px;cursor:pointer;font-family:inherit;
  font:600 11.5px/1 "Figtree";color:var(--mut);border:1px solid var(--line);
  background:rgba(255,255,255,.02);transition:transform .12s cubic-bezier(.32,.9,.35,1),border-color .2s,color .2s,background .2s}
.hizBtn:active{transform:scale(.94)}
.hizBtn.on{color:var(--goldh);border-color:color-mix(in srgb,var(--gold) 50%,transparent);
  background:color-mix(in srgb,var(--gold) 13%,transparent)}
.genNot{font-size:9.5px;color:var(--dim);line-height:1.6;margin:5px 0 10px}
.genNot b{color:var(--goldh)}
.genNot.uyari{color:var(--uyari)}
.genAyar .opt small{display:block;font:400 9.5px/1.4 "Figtree";color:var(--dim);margin-top:2px}
.dlB.calan{background:var(--rec);border-color:var(--rec);color:#fff;animation:tvkPulse 1.2s infinite}
.dlCalar{display:flex;flex-direction:column;gap:8px;padding:9px 11px;margin:8px 0;
  border-radius:10px;border:1px solid var(--line2);
  background:color-mix(in srgb,var(--gold) 9%,transparent)}
.dlCalar[hidden]{display:none}
#dlProg{font:600 10.5px/1.4 "Figtree";color:var(--goldh);letter-spacing:.02em}
.dlRow.okunuyor{box-shadow:0 0 0 2px var(--kc);background:color-mix(in srgb,var(--kc) 14%,transparent)}
.dlNot{font-size:9.5px;color:var(--dim);line-height:1.65;margin-top:10px}
.dlNot b{color:var(--goldh)}
#dlEditSheet{position:fixed;inset:auto 0 0 0;z-index:960;max-height:82vh;overflow-y:auto;
  background:linear-gradient(180deg,rgba(var(--sayfaK),.97),rgba(var(--sayfa2K),.99));
  border-top:1px solid var(--line2);border-radius:20px 20px 0 0;
  padding:14px 16px calc(18px + env(safe-area-inset-bottom))}
#dlEditSheet[hidden]{display:none}
.dlLbl{display:block;font:700 9.5px/1 "Figtree";letter-spacing:.14em;text-transform:uppercase;
  color:var(--goldh);margin:12px 0 5px}
#dlEditSheet textarea{width:100%;border-radius:10px;border:1px solid var(--line);
  background:rgba(0,0,0,.25);color:var(--ink);padding:12px;font:400 12.5px/1.7 "Figtree";resize:vertical}
#dlAr{font-size:16.5px;line-height:2.1}
.dlUyari{font-size:9.5px;color:var(--dim);line-height:1.6;margin:9px 0}
body[data-tema="sabah"] #dlEditSheet{background:linear-gradient(180deg,rgba(250,245,234,.99),rgba(243,235,217,.99))}
body[data-tema="sabah"] #dlEditSheet textarea{background:rgba(255,255,255,.7)}
/* okuma göstergesi — hangi kısım okunuyor */
#tvProg,#dhProg{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.okNo{flex:none;font:700 9.5px/1 "Figtree";letter-spacing:.04em;
  padding:4px 8px;border-radius:99px;color:var(--kc);
  border:1px solid color-mix(in srgb,var(--kc) 45%,transparent);
  background:color-mix(in srgb,var(--kc) 12%,transparent)}
.okAd{flex:1;min-width:0;font:600 10.5px/1.45 "Figtree";color:var(--kc)}
/* metinde okunan kısım */
.kisimBlok.okunuyor{background:color-mix(in srgb,var(--kc) 10%,transparent);
  box-shadow:-3px 0 0 var(--kc)}
/* kayıt listesinde okunan satır */
.tvkRow.okunan{border-color:color-mix(in srgb,var(--kc) 60%,transparent);
  background:color-mix(in srgb,var(--kc) 12%,transparent)}
.tvkRow.okunan .tvkNokta{animation:okunanNabiz 1.4s ease-in-out infinite}
@keyframes okunanNabiz{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.5);opacity:.6}}
@media (prefers-reduced-motion:reduce){.tvkRow.okunan .tvkNokta{animation:none}}
.kisimBlok{position:relative;margin:12px 0;padding:2px 0 2px 13px;
  border-left:3px solid var(--kc);border-radius:0 10px 10px 0;transition:background 0.3s,opacity 0.3s}
.kisimBlok.gizli{display:none}
.kisimBlok.okunuyor{background:color-mix(in srgb,var(--kc) 9%,transparent)}
.kisimBas{display:flex;align-items:center;gap:8px;margin:0 0 6px;flex-wrap:wrap}
.kisimBas>b{flex:1;min-width:0;font:700 12.5px/1.35 var(--fD);color:var(--kc);letter-spacing:.02em}
.kisimNo{flex:none;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;
  font:700 10.5px/1 "Figtree";background:color-mix(in srgb,var(--kc) 22%,transparent);
  color:var(--kc);border:1px solid color-mix(in srgb,var(--kc) 45%,transparent)}
.kisimBlok.kayitli .kisimNo{background:var(--kc);color:#0b1116;border-color:transparent}
.kisimBtns{flex:none;display:flex;gap:4px}
.kisimB{width:27px;height:27px;border-radius:10px;cursor:pointer;font-size:11.5px;font-family:inherit;
  display:grid;place-items:center;color:var(--kc);
  border:1px solid color-mix(in srgb,var(--kc) 40%,transparent);
  background:color-mix(in srgb,var(--kc) 8%,transparent);transition:transform 0.12s}
.kisimB:active{transform:scale(.9)}
.kisimBlok.kaydediyor .kisimB.mic{background:var(--rec);border-color:var(--rec);color:#fff;
  animation:tvkPulse 1.1s infinite}
.kisimBlok.kayitli .kisimBas>b::after{content:' ✓';color:var(--kc);font-size:11.5px}
/* açıklamayı atla düğmesi */
#dhAtlaBtn.on{border-color:var(--line2);background:color-mix(in srgb,var(--gold) 14%,transparent);
  color:var(--goldh)}
/* kayıt listesindeki renk noktası — metindeki başlıkla eşleşir */
.tvkRow .tvkNokta{flex:none;width:9px;height:9px;border-radius:50%;background:var(--kc);
  box-shadow:0 0 7px color-mix(in srgb,var(--kc) 70%,transparent)}
/* r100: eski tam kayıt satırı, kısımlar listesinin altında ayrı başlıkla */
.tvkEskiBas{flex-basis:100%;font:600 9.5px/1.4 "Figtree";letter-spacing:.12em;
  text-transform:uppercase;color:var(--dim);margin:10px 0 2px;
  padding-top:9px;border-top:1px solid var(--line)}
.tvMetinBtn{width:100%;margin-top:10px;font-size:11.5px}
.tvkBox{margin:9px 0 4px;border:1px solid var(--line);border-radius:13px;padding:10px 12px;
  background:linear-gradient(180deg,rgba(255,255,255,.035),transparent 60%),var(--panel)}
.tvkBox>summary{cursor:pointer;font:600 12.5px/1.4 var(--fD);color:var(--goldh);letter-spacing:.03em;
  display:flex;align-items:center;gap:8px}
.tvkBox>summary::-webkit-details-marker{display:none}
.tvkBox>summary::after{content:'▾';margin-left:auto;color:var(--gold);display:inline-block;transform:rotate(0deg);transition:transform 0.3s}
.tvkBox[open]>summary::after{transform:rotate(180deg)}
.tvkHint{font:500 9.5px/1 "Figtree";color:var(--dim);border:1px solid var(--line);border-radius:99px;padding:3px 8px}
.tvkStat{font-size:10.5px;color:var(--mut);line-height:1.6;margin:9px 0 8px}
.tvkStat b{color:var(--goldh)}
.tvkList{display:flex;flex-direction:column;gap:8px;max-height:290px;overflow-y:auto;padding-right:2px}
.tvkRow{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:10px;
  border:1px solid var(--line);background:rgba(255,255,255,.02);transition:0.2s}
.tvkRow.var{border-color:color-mix(in srgb,var(--gold) 45%,transparent);background:color-mix(in srgb,var(--gold) 7%,transparent)}
.tvkRow.rec{border-color:var(--rec);background:var(--recbg)}
.tvkRow.cal{border-color:var(--line2);background:color-mix(in srgb,var(--gold) 14%,transparent);box-shadow:0 0 14px -4px var(--line2)}
.tvkNo{flex:none;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;
  font:700 10.5px/1 "Figtree";background:color-mix(in srgb,var(--gold) 16%,transparent);color:var(--goldh);border:1px solid var(--line)}
.tvkRow.var .tvkNo{background:var(--gold);color:#1a1408;border-color:transparent}
.tvkAd{flex:1;min-width:0}
.tvkAd b{display:block;font:600 11.5px/1.4 "Figtree";color:var(--ink)}
.tvkAd small{display:block;font:400 9.5px/1.4 "Figtree";color:var(--dim);margin-top:2px}
.tvkBtns{flex:none;display:flex;gap:4px}
.tvkB{width:29px;height:29px;border-radius:10px;border:1px solid var(--line);background:rgba(255,255,255,.04);
  color:var(--goldh);font-size:12.5px;cursor:pointer;display:grid;place-items:center;font-family:inherit}
.tvkB:active{transform:scale(.92)}
.tvkB.mic.on{background:var(--rec);border-color:var(--rec);color:#fff;animation:tvkPulse 1.1s infinite}
.tvkB.sil{color:var(--dim)}
@keyframes tvkPulse{0%,100%{opacity:1}50%{opacity:.45}}
.tvkNot{font-size:9.5px;color:var(--dim);line-height:1.6;margin-top:9px}
.recTip{font-size:9.5px;color:var(--dim);line-height:1.5;margin:5px 0 2px;padding:6px 9px;border-radius:10px;background:color-mix(in srgb,var(--goldh) 6%,transparent);border:1px solid color-mix(in srgb,var(--goldh) 16%,transparent)}
.recTip .recClock{display:inline-block;font:700 11.5px/1 "JetBrains Mono",monospace;color:var(--rec);margin-right:5px;letter-spacing:.04em}
#recNow{position:fixed;left:50%;top:calc(9px + env(safe-area-inset-top));transform:translate(-50%,-16px);
  z-index:9998;display:none;align-items:center;gap:8px;padding:9px 16px;border-radius:99px;
  background:var(--recbg);border:1px solid color-mix(in srgb,var(--rec) 55%,transparent);color:var(--ivory);backdrop-filter:blur(10px);
  box-shadow:var(--e2);opacity:0;transition:opacity 0.3s,transform 0.3s;pointer-events:none}
#recNow.on{display:flex;opacity:1;transform:translate(-50%,0)}
#recNow i{flex:none;width:9px;height:9px;border-radius:50%;background:var(--rec);font-style:normal;
  animation:recNowPulse 1.1s ease-in-out infinite}
#recNow b{font:700 14px/1 "JetBrains Mono",monospace;letter-spacing:.05em;color:var(--rec)}
#recNow small{font:400 10.5px/1.3 "Figtree";color:var(--mut);max-width:44vw}
@keyframes recNowPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.25;transform:scale(.8)}}
.sukunToast{position:fixed;left:50%;bottom:86px;transform:translate(-50%,14px);z-index:9999;max-width:86vw;
  padding:10px 15px;border-radius:13px;font-size:11.5px;line-height:1.5;text-align:center;
  background:rgba(var(--sayfaK),.94);color:var(--ivory);border:1px solid color-mix(in srgb,var(--goldh) 30%,transparent);
  box-shadow:var(--e2);opacity:0;pointer-events:none;transition:opacity 0.3s,transform 0.3s}
.sukunToast.on{opacity:1;transform:translate(-50%,0)}
.duaRecMenu .tag{padding:3px 8px;border-radius:20px;background:color-mix(in srgb,var(--goldh) 12%,transparent);color:var(--goldh);font-size:9.5px}
.duaRecMenu button{border:1px solid var(--line);border-radius:10px;background:rgba(255,255,255,.04);color:var(--ivory);cursor:pointer;padding:5px 9px;font-size:10.5px}
.duaRecHint{font-size:9.5px;color:var(--dim);line-height:1.6;margin-top:4px}
.tvProg{margin-left:auto;font-size:10.5px;color:var(--dim);font-variant-numeric:tabular-nums}
.seyBar{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:8px 0 4px}
.seyBar .btn{flex:none;width:100%;padding:9px 6px;font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.seyBar #seyStop{grid-column:1 / -1;background:rgba(255,90,90,.08);border-color:rgba(255,120,120,.35);color:#ff9e9e}
.seyProgRow{grid-column:1 / -1;text-align:center;font-size:10.5px;color:var(--dim);font-variant-numeric:tabular-nums;min-height:14px}
@media (min-width:420px){
  .seyBar{grid-template-columns:1fr 1fr 1fr}
  .seyBar #seyStop{grid-column:auto}
}
.tvText{max-height:230px;overflow-y:auto;border:1px solid var(--line);border-radius:13px;padding:11px 13px;background:rgba(var(--girdiK),.4);scrollbar-width:thin}
.tvP{font-size:12.5px;line-height:1.72;color:var(--mut);margin:0 0 11px;padding:5px 8px;border-radius:10px;cursor:pointer;transition:background 0.3s,color 0.3s;letter-spacing:.01em}
.tvP:last-child{margin-bottom:0}
.tvP:hover{color:var(--ink)}
.tvP.on{color:var(--ink);background:color-mix(in srgb,var(--gold) 12%,transparent);box-shadow:inset 0 0 0 1px var(--line2)}
.qRow{display:flex;align-items:center;gap:12px;border:1px solid var(--line2);background:color-mix(in srgb,var(--gold) 7%,transparent);border-radius:13px;padding:10px 12px;margin:0 0 12px}
.qRow>div{flex:1;min-width:0}
.qRow b{font-size:12.5px;color:var(--ink);font-weight:600;display:block}
.qRow small{display:block;font-size:9.5px;color:var(--dim);margin-top:1px;font-weight:400;line-height:1.4}
.qGuideBtn{display:none;flex:none;border:1px solid var(--line2);background:color-mix(in srgb,var(--gold) 12%,transparent);color:var(--goldh);border-radius:10px;padding:8px 11px;font-size:10.5px;cursor:pointer;white-space:nowrap}
body.helpOn .qGuideBtn{display:inline-flex}
.qb{display:none;width:16px;height:15px;line-height:15px;border-radius:50%;border:1px solid var(--line2);color:var(--goldh);background:color-mix(in srgb,var(--gold) 14%,transparent);font:600 10.5px/15px "Figtree",sans-serif;text-align:center;cursor:pointer;margin-left:5px;vertical-align:middle}
body.helpOn .qb{display:inline-block}
.qb:active{transform:scale(.9)}
#qBubble{position:fixed;left:0;top:0;z-index:1200;max-width:264px;min-width:160px;background:linear-gradient(180deg,rgba(var(--vurguK),.98),rgba(var(--yuzeyK),.99));border:1px solid var(--line2);border-radius:13px;padding:11px 13px;font-size:11.5px;line-height:1.62;color:var(--ink);box-shadow:var(--e3);opacity:0;transform:translateY(4px) scale(.97);transition:opacity 0.2s,transform 0.2s;pointer-events:none}
#qBubble.show{opacity:1;transform:translateY(0) scale(1);pointer-events:auto}
#qBubble b{color:var(--goldh)}
.qArrow{position:absolute;width:11px;height:11px;background:#0e211c;transform:rotate(45deg);z-index:-1}
#qBubble.below .qArrow{top:-5px;border-left:1px solid var(--line2);border-top:1px solid var(--line2)}
#qBubble.above .qArrow{bottom:-5px;border-right:1px solid var(--line2);border-bottom:1px solid var(--line2)}
.gRow{border-bottom:1px dashed var(--line);padding:10px 2px}
.gRow:last-child{border-bottom:none}
.gRow>b{display:block;font-size:12.5px;color:var(--goldh);margin-bottom:4px}
.gRow p{font-size:11.5px;color:var(--mut);line-height:1.62;margin:0}
.gRow p b{color:var(--ink)}
.nefsInfo{font-size:11.5px;color:var(--mut);line-height:1.65;margin:8px 0 4px;padding:9px 11px;border:1px solid var(--line);border-radius:10px}
.nefsInfo b{color:var(--goldh)}
.nefsRows,.cakraRows{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.nefsRow,.cakraRow{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;cursor:pointer;transition:border-color 0.2s,background 0.2s}
.nefsRow:active,.cakraRow:active{transform:scale(.99)}
.nefsRow.act,.cakraRow.act{border-color:var(--line2);background:color-mix(in srgb,var(--gold) 8%,transparent)}
.nefsRow .glyph,.cakraRow .glyph{width:30px;height:30px;flex:none;display:flex;align-items:center;justify-content:center;filter:drop-shadow(0 0 5px currentColor)}
.nefsRow .glyph svg,.cakraRow .glyph svg{width:100%;height:100%}
.nefsRow .tx,.cakraRow .tx{flex:1;min-width:0}
.nefsRow .tx b,.cakraRow .tx b{display:block;font-size:12.5px;color:var(--ink);font-weight:600}
.nefsRow .tx small,.cakraRow .tx small{display:block;font-size:10.5px;color:var(--dim);line-height:1.4;margin-top:1px}
.nefsRow .ar,.cakraRow .hz{flex:none;font-size:11.5px;color:var(--gold);font-variant-numeric:tabular-nums}
.nefsRow .ar{font-family:"Amiri",serif;font-size:16.5px}
.nefsProg{margin-top:9px;font-size:11.5px;color:var(--mut);line-height:1.6}
.nefsProg .pbar{height:6px;border-radius:3px;background:rgba(255,255,255,.07);overflow:hidden;margin:6px 0}
.nefsProg .pbar i{display:block;height:100%;background:linear-gradient(90deg,var(--gold),var(--goldh));border-radius:3px;transition:width 0.45s}
.nefsProg .steps{display:flex;gap:4px;flex-wrap:wrap;margin-top:5px}
.nefsProg .steps s{width:10px;height:10px;border-radius:3px;background:rgba(255,255,255,.08);text-decoration:none}
.nefsProg .steps s.d{background:var(--gold)}
.nefsProg .steps s.a{background:var(--goldh);box-shadow:0 0 6px var(--goldh)}
.zNav{display:flex;gap:8px;overflow-x:auto;padding:2px 2px 9px;margin-bottom:4px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.zNav::-webkit-scrollbar{display:none}
.zNav button{flex:none;border:1px solid var(--line);background:rgba(255,255,255,.02);color:var(--mut);border-radius:99px;padding:8px 13px;font:600 11.5px/1 "Figtree",sans-serif;letter-spacing:.02em;cursor:pointer;white-space:nowrap;transition:color 0.2s,border-color 0.2s,background 0.2s}
.zNav button:active{transform:scale(.95)}
.zNav button.act{color:var(--goldh);border-color:var(--line2);background:color-mix(in srgb,var(--gold) 10%,transparent)}
.zFlash{animation:zBoxFlash 1.1s ease}
@keyframes zBoxFlash{0%,100%{box-shadow:0 0 0 0 transparent}30%{box-shadow:0 0 0 2px var(--line2)}}
.preFilter{display:flex;gap:8px;overflow-x:auto;padding:0 0 10px;scrollbar-width:none;margin-bottom:2px}
.preFilter::-webkit-scrollbar{display:none}
.preFilter button{flex:none;border:1px solid var(--line);background:rgba(255,255,255,.02);color:var(--mut);border-radius:99px;padding:6px 11px;font:600 10.5px/1 "Figtree",sans-serif;cursor:pointer;white-space:nowrap}
.preFilter button.act{color:var(--goldh);border-color:var(--line2);background:color-mix(in srgb,var(--gold) 10%,transparent)}
.preCat{font:600 10.5px/1 "Figtree",sans-serif;letter-spacing:.12em;color:var(--gold);text-transform:uppercase;margin:12px 2px 8px;opacity:.85}
.preCat:first-child{margin-top:2px}
.preGrid2{display:grid;grid-template-columns:1fr 1fr;gap:8px}
/* ═══════════════ ULTRA-PREMIUM GÖRSEL KATMAN ═══════════════ */
/* Yalnızca SÜKÛN kapsamı (#ns ve #tk kendi kimliklerini korur) */

/* ── Kartlar: derinlik + üst ışık çizgisi + iç parıltı ── */
.card:not(#ns *):not(#tk *){
  position:relative;
  background:
    linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.004) 42%,transparent),
    var(--panel,rgba(255,255,255,.02));
  box-shadow:
    0 1px 0 rgba(255,255,255,.06) inset,
    0 18px 40px -20px rgba(0,0,0,.65),
    0 2px 10px -6px rgba(0,0,0,.5);
  border:1px solid transparent;
  background-clip:padding-box;
}
.card:not(#ns *):not(#tk *)::before{
  content:'';position:absolute;inset:0;border-radius:inherit;padding:4px;
  background:linear-gradient(160deg,var(--line2),transparent 38%,transparent 64%,color-mix(in srgb,var(--gold) 14%,transparent));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;opacity:.75}

/* ── Kaydırıcılar: cam parlaklığı, kabarık ışıltılı thumb ── */
input[type=range]:not(#ns *){height:30px}
input[type=range]:not(#ns *)::-webkit-slider-runnable-track{
  height:6px;border-radius:7px;
  background:
    linear-gradient(90deg,var(--goldh) 0%,var(--gold) var(--val),rgba(255,255,255,.10) var(--val),rgba(255,255,255,.055) 100%);
  box-shadow:0 1px 2px rgba(0,0,0,.5) inset,0 0 10px color-mix(in srgb,var(--gold) 18%,transparent)}
input[type=range]:not(#ns *)::-webkit-slider-thumb{
  -webkit-appearance:none;width:20px;height:20px;border-radius:50%;margin-top:-7px;
  background:
    radial-gradient(circle at 34% 30%,#fff6d8,#f0d688 34%,var(--gold) 68%,#8a6c17);
  border:1px solid rgba(255,247,220,.7);
  box-shadow:
    0 0 0 4px color-mix(in srgb,var(--gold) 14%,transparent),
    0 2px 6px rgba(0,0,0,.5),
    0 0 14px color-mix(in srgb,var(--goldh) 55%,transparent);
  transition:transform 0.12s,box-shadow 0.2s}
input[type=range]:not(#ns *):active::-webkit-slider-thumb{
  transform:scale(1.18);
  box-shadow:0 0 0 6px color-mix(in srgb,var(--gold) 20%,transparent),0 3px 9px rgba(0,0,0,.55),0 0 20px color-mix(in srgb,var(--goldh) 80%,transparent)}
input[type=range]:not(#ns *)::-moz-range-track{height:6px;border-radius:7px;background:rgba(255,255,255,.09);box-shadow:0 1px 2px rgba(0,0,0,.5) inset}
input[type=range]:not(#ns *)::-moz-range-progress{height:6px;border-radius:7px;background:linear-gradient(90deg,var(--goldh),var(--gold))}
input[type=range]:not(#ns *)::-moz-range-thumb{
  width:19px;height:19px;border-radius:50%;
  background:radial-gradient(circle at 34% 30%,#fff6d8,var(--gold) 68%,#8a6c17);
  border:1px solid rgba(255,247,220,.7);
  box-shadow:0 0 0 4px color-mix(in srgb,var(--gold) 14%,transparent),0 2px 6px rgba(0,0,0,.5),0 0 14px color-mix(in srgb,var(--goldh) 55%,transparent)}

/* ── Aç/kapat anahtarı: cam gövde, kabarık knob ── */
.sw:not(#ns *):not(#tk *){
  width:44px;height:24px;
  background:linear-gradient(180deg,rgba(0,0,0,.28),rgba(255,255,255,.04));
  box-shadow:0 1px 2px rgba(0,0,0,.45) inset;border:1px solid var(--line)}
.sw:not(#ns *):not(#tk *)::after{
  width:18px;height:18px;top:2px;left:2px;
  background:radial-gradient(circle at 35% 30%,#fbfdfc,#95aaa0);
  box-shadow:0 1px 3px rgba(0,0,0,.5),0 0 0 1px rgba(0,0,0,.15)}
.sw.on:not(#ns *):not(#tk *){
  background:linear-gradient(90deg,#5a4410,#c9a227 70%,#e6c766);
  box-shadow:0 0 12px color-mix(in srgb,var(--gold) 35%,transparent),0 1px 2px rgba(0,0,0,.35) inset}
.sw.on:not(#ns *):not(#tk *)::after{
  left:22px;background:radial-gradient(circle at 35% 30%,#fffdf4,#f2dfa0);
  box-shadow:0 1px 3px rgba(0,0,0,.4),0 0 12px rgba(255,240,190,.9)}

/* ── Butonlar: üst parlaklık + baskı geri bildirimi ── */
.btn:not(#ns *):not(#tk *){
  position:relative;
  background:
    linear-gradient(180deg,rgba(255,255,255,.10),transparent 46%),
    linear-gradient(180deg,color-mix(in srgb,var(--gold) 16%,transparent),color-mix(in srgb,var(--gold) 4%,transparent));
  box-shadow:0 1px 0 rgba(255,255,255,.08) inset,0 6px 16px -10px rgba(0,0,0,.6);
  transition:transform 0.12s,box-shadow 0.2s,border-color 0.2s}
.btn:not(#ns *):not(#tk *):active{transform:translateY(1px) scale(.985);box-shadow:0 2px 8px -6px rgba(0,0,0,.7) inset}
.btn.danger:not(#ns *):not(#tk *){
  background:linear-gradient(180deg,rgba(255,255,255,.08),transparent 46%),linear-gradient(180deg,rgba(200,80,70,.2),rgba(200,80,70,.06))}

/* ── Sekme çubuğu: cam hazne + aktif sekmede kabarıklık ──
   Cam gradyanı TEK BAŞINA zemin olarak kullanılmamalı: :not(#ns *) içindeki id
   yüzünden bu kuralın özgüllüğü 1,1,0 ve temel .tabs kuralını eziyordu; geriye
   en çok %22 siyah kalıyor, yapışkan çubuğun altından kaydırılan içerik sızıyordu.
   Artık gradyan, temadan türeyen opak bir zeminin ÜSTÜNE biniyor. */
.tabs:not(#ns *){
  background:
    linear-gradient(180deg,rgba(0,0,0,.22),rgba(255,255,255,.02)),
    color-mix(in srgb,var(--bg) 97%,transparent);
  box-shadow:0 1px 2px rgba(0,0,0,.4) inset,0 1px 0 rgba(255,255,255,.05),0 6px 18px -12px rgba(0,0,0,.7)}

/* ── Açık tema (sabah): sabit koyu renkle yazılmış yüzeyleri de çevir ──
   Bu paneller doğrudan koyu rgba ile tanımlanmıştı; açık temada metin rengi
   koyuya döndüğü için koyu zemin + koyu metin okunamaz hâle geliyordu.
   Tema değişkeni kullanmadıkları için toplu istisna gerekiyor. */
body[data-tema="sabah"] #mrSheet,
body[data-tema="sabah"] #ruyaSheet,
body[data-tema="sabah"] #haySheet,
body[data-tema="sabah"] #muhSheet,
body[data-tema="sabah"] #virdSheet,
body[data-tema="sabah"] #fatSheet,
body[data-tema="sabah"] #yksSheet{background:rgba(249,244,233,.94)}
body[data-tema="sabah"] #temaSheet,
body[data-tema="sabah"] #helpSheet,
body[data-tema="sabah"] #recSheet,
body[data-tema="sabah"] #customSoundSheet,
body[data-tema="sabah"] #micHelpSheet,
body[data-tema="sabah"] #logSheet{background:linear-gradient(180deg,rgba(250,245,234,.985),rgba(243,235,217,.995))}
body[data-tema="sabah"] #rateToast{background:rgba(250,245,234,.97)}
body[data-tema="sabah"] .rxToastMsg{background:rgba(250,245,234,.97);color:var(--goldh)}
body[data-tema="sabah"] #qBubble,
body[data-tema="sabah"] #preTip,
body[data-tema="sabah"] .sukunToast{background:linear-gradient(180deg,rgba(252,248,239,.99),rgba(245,238,222,.99))}
body[data-tema="sabah"] #qArrow,
body[data-tema="sabah"] #ptArrow{background:rgba(250,245,234,.99)}
body[data-tema="sabah"] .obInner,
body[data-tema="sabah"] .dcInner{background:rgba(250,245,234,.93)}
body[data-tema="sabah"] #logSheet,
body[data-tema="sabah"] #temaSheet,
body[data-tema="sabah"] #helpSheet,
body[data-tema="sabah"] #recSheet,
body[data-tema="sabah"] #customSoundSheet,
body[data-tema="sabah"] #micHelpSheet,
body[data-tema="sabah"] #rateToast,
body[data-tema="sabah"] #qBubble,
body[data-tema="sabah"] #preTip,
body[data-tema="sabah"] .sukunToast{box-shadow:0 10px 40px rgba(122,94,32,.22)}
body[data-tema="sabah"] .tabs:not(#ns *){
  background:
    linear-gradient(180deg,rgba(0,0,0,.04),rgba(255,255,255,.34)),
    color-mix(in srgb,var(--bg) 97%,transparent);
  box-shadow:0 1px 2px rgba(122,94,32,.12) inset,0 1px 0 rgba(255,255,255,.7),0 6px 18px -12px rgba(122,94,32,.35)}
.tab.act:not(#ns *){
  background:linear-gradient(180deg,color-mix(in srgb,var(--gold) 24%,transparent),color-mix(in srgb,var(--gold) 6%,transparent));
  box-shadow:inset 0 0 0 1px var(--line2),0 4px 14px -8px color-mix(in srgb,var(--gold) 50%,transparent),0 1px 0 rgba(255,255,255,.08) inset}

/* ── Kanal kartları (mikser) & preset/session: baskı ışıltısı ── */
.chn:not(#ns *){
  background:
    linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.006) 40%,transparent),
    var(--panel);
  box-shadow:0 1px 0 rgba(255,255,255,.05) inset,0 10px 22px -16px rgba(0,0,0,.6)}
.chn.on:not(#ns *){
  box-shadow:0 0 20px color-mix(in srgb,var(--gold) 18%,transparent),inset 0 0 26px color-mix(in srgb,var(--gold) 7%,transparent),0 1px 0 rgba(255,255,255,.06) inset;
  border-color:var(--line2)}
.pre:not(#ns *),.sess:not(#ns *){
  background:linear-gradient(180deg,rgba(255,255,255,.045),transparent 55%),rgba(255,255,255,.02);
  box-shadow:0 1px 0 rgba(255,255,255,.045) inset,0 8px 18px -14px rgba(0,0,0,.55);
  transition:transform 0.12s,box-shadow 0.2s,border-color 0.2s}
.pre:not(#ns *):active,.sess:not(#ns *):active{transform:translateY(1px) scale(.98)}
.pre.act:not(#ns *){
  border-color:var(--line2);
  box-shadow:0 0 18px color-mix(in srgb,var(--gold) 22%,transparent),inset 0 0 0 1px var(--line2),0 1px 0 rgba(255,255,255,.06) inset}

/* ── Başlık logosu & orb: daha zengin parıltı ── */
.orb:not(#ns *){
  box-shadow:0 0 30px color-mix(in srgb,var(--gold) 40%,transparent),0 0 0 1px rgba(255,247,220,.15) inset,0 8px 20px -10px rgba(0,0,0,.6)}

/* ── Sayaç sahnesi: hafif cam kubbe ── */
.zStage:not(#ns *){
  background:
    radial-gradient(120% 80% at 50% 0%,color-mix(in srgb,var(--gold) 6%,transparent),transparent 60%),
    linear-gradient(180deg,rgba(255,255,255,.04),transparent 40%),
    var(--panel);
  box-shadow:0 1px 0 rgba(255,255,255,.06) inset,0 22px 48px -24px rgba(0,0,0,.7)}

/* ── Alt-nav & filtre çipleri: aktif çipte tatlı parıltı ── */
.zNav button.act,.preFilter button.act{box-shadow:0 0 12px -2px color-mix(in srgb,var(--gold) 35%,transparent),0 1px 0 rgba(255,255,255,.06) inset}

/* ── Kaydırma çubuğu inceltme (premium his) ── */
*::-webkit-scrollbar{width:7px;height:7px}
*::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--gold) 28%,transparent);border-radius:99px}
*::-webkit-scrollbar-track{background:transparent}

#preTip{
  position:fixed;left:0;top:0;z-index:1250;max-width:290px;min-width:190px;
  padding:12px 14px;border-radius:13px;pointer-events:none;
  background:
    linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.01) 45%,transparent),
    rgba(var(--yuzeyK),var(--glassA));
  -webkit-backdrop-filter:blur(22px) saturate(1.35);backdrop-filter:blur(22px) saturate(1.35);
  border:1px solid transparent;background-clip:padding-box;
  box-shadow:0 1px 0 rgba(255,255,255,.08) inset,0 20px 46px -18px rgba(0,0,0,.75),0 0 24px color-mix(in srgb,var(--gold) 10%,transparent);
  opacity:0;transform:translateY(6px) scale(.96);transition:opacity 0.2s cubic-bezier(.2,.7,.3,1),transform 0.2s cubic-bezier(.2,.7,.3,1)}
#preTip.show{opacity:1;transform:translateY(0) scale(1)}
#preTip::before{
  content:'';position:absolute;inset:0;border-radius:inherit;padding:4px;
  background:linear-gradient(150deg,var(--line2),transparent 40%,transparent 62%,color-mix(in srgb,var(--gold) 20%,transparent));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.ptArrow{position:absolute;width:12px;height:12px;transform:rotate(45deg);
  background:rgba(var(--yuzeyK),var(--glassA));-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);z-index:-1}
#preTip.below .ptArrow{top:-5px;left:calc(var(--ax,50%) - 6px);border-left:1px solid var(--line2);border-top:1px solid var(--line2)}
#preTip.above .ptArrow{bottom:-5px;left:calc(var(--ax,50%) - 6px);border-right:1px solid var(--line2);border-bottom:1px solid var(--line2)}
.ptHead{display:flex;align-items:center;gap:8px;margin-bottom:5px}
.ptIc{font-size:21px;filter:drop-shadow(0 0 6px color-mix(in srgb,var(--gold) 40%,transparent))}
#ptName{font:600 14px/1.25 "Cormorant Garamond",serif;letter-spacing:.02em;color:var(--goldh)}
.ptSub{font-size:10.5px;color:var(--gold);letter-spacing:.03em;margin-bottom:7px;font-variant-numeric:tabular-nums;opacity:.9}
.ptBody{font-size:11.5px;line-height:1.6;color:var(--ivory)}
.pre{position:relative;-webkit-touch-callout:none}
.pre.tipping{border-color:var(--line2);box-shadow:0 0 20px color-mix(in srgb,var(--gold) 28%,transparent),inset 0 0 0 1px var(--line2)!important}
.preAcc{
  border:1px solid var(--line);border-radius:13px;margin-bottom:10px;overflow:hidden;
  background:
    linear-gradient(180deg,rgba(255,255,255,.035),transparent 40%),
    rgba(255,255,255,.015);
  box-shadow:0 1px 0 rgba(255,255,255,.04) inset,0 10px 24px -18px rgba(0,0,0,.6);
  transition:border-color 0.3s,box-shadow 0.3s}
.preAcc.open{border-color:var(--line2);box-shadow:0 0 20px -6px color-mix(in srgb,var(--gold) 22%,transparent),0 1px 0 rgba(255,255,255,.05) inset}
.preAccHead{
  width:100%;display:flex;align-items:center;gap:12px;padding:13px 14px;cursor:pointer;
  background:transparent;border:none;text-align:left;font:inherit;color:var(--ink);
  -webkit-tap-highlight-color:transparent}
.preAccHead:active{background:color-mix(in srgb,var(--gold) 5%,transparent)}
.preAccT{flex:1;font:600 12.5px/1.2 "Figtree",sans-serif;letter-spacing:.02em;color:var(--ivory)}
.preAcc.open .preAccT{color:var(--goldh)}
.preAccN{flex:none;font-size:10.5px;color:var(--gold);background:color-mix(in srgb,var(--gold) 12%,transparent);border:1px solid var(--line);border-radius:99px;min-width:22px;height:20px;display:inline-flex;align-items:center;justify-content:center;padding:0 6px;font-variant-numeric:tabular-nums}
.preAccChev{flex:none;font-size:16.5px;color:var(--mut);transition:transform 0.3s cubic-bezier(.2,.7,.3,1);transform:rotate(0)}
.preAcc.open .preAccChev{transform:rotate(180deg);color:var(--goldh)}
.preAccBody{max-height:0;overflow:hidden;transition:max-height 0.3s cubic-bezier(.3,.7,.3,1)}
.preAccInner{padding:2px 12px 13px}
/* ═══ KOMPAKT PREMIUM SET DÜZENİ — taşma & uzama düzeltmesi ═══ */
/* Kök düzeltme: #presets artık akordiyon konteyneri, grid değil */
#presets,#mixer{display:block}
#presets>.preFilter{display:flex;flex-wrap:nowrap;overflow-x:auto}
/* İç grid: minmax(0,1fr) ile asla yatay taşmaz */
.preGrid2{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
/* Kompakt kartlar: sıkı padding, satır sınırı ile boy kontrolü */
.pre:not(#ns *){padding:9px 10px;border-radius:13px;gap:4px;min-width:0;overflow:hidden}
.pre .pIc{font-size:16.5px;line-height:1;margin-bottom:1px}
.pre b{
  font-size:11.5px;line-height:1.18;font-weight:600;
  display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word}
.pre small{
  font-size:9.5px;line-height:1.28;
  display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* Akordiyon başlığı & çerçevesi biraz daha sıkı */
.preAccHead{padding:11px 13px}
.preAccT{font-size:12.5px}
.preAccInner{padding:2px 10px 11px}
.preAcc{margin-bottom:8px;border-radius:13px}
/* Filtre çipleri kompakt */
.preFilter button{padding:6px 10px;font-size:10.5px}
/* Kendi setlerinin sil butonu kart içinde kalsın */
.pre.mine{padding-right:22px}
.pre .myx{top:4px;right:6px}
/* ═══════════ ALTIN VARAK & IŞILTI EFEKTLERİ ═══════════ */
@keyframes goldSweep{0%{background-position:-160% 0}60%,100%{background-position:260% 0}}
@keyframes sparkTwinkle{0%,100%{opacity:0;transform:scale(.3)}50%{opacity:1;transform:scale(1)}}
@keyframes logoGlow{0%,100%{filter:drop-shadow(0 0 6px color-mix(in srgb,var(--gold) 40%,transparent))}50%{filter:drop-shadow(0 0 16px color-mix(in srgb,var(--goldh) 75%,transparent))}}
@keyframes foilShift{0%{background-position:0% 50%}100%{background-position:200% 50%}}

/* Başlık: akan altın varak parıltısı */
.shimmer-text{
  background:linear-gradient(100deg,var(--gold) 0%,var(--gold) 32%,#fff6d8 46%,#ffffff 50%,#fff6d8 54%,var(--goldh) 68%,var(--gold) 100%);
  background-size:220% 100%;
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;
  animation:goldSweep 5.5s ease-in-out infinite}
.shimmer-logo{position:relative;display:inline-block;animation:logoGlow 4.5s ease-in-out infinite;overflow:visible}
.spark{position:absolute;width:6px;height:6px;pointer-events:none;
  background:radial-gradient(circle,#fff 0%,#ffe9a8 35%,transparent 70%);
  border-radius:50%;opacity:0}
.spark::before,.spark::after{content:'';position:absolute;inset:0;
  background:linear-gradient(#fff,transparent);width:1.5px;left:2.25px;height:14px;top:-4px;
  filter:blur(.3px)}
.spark::after{transform:rotate(90deg)}
.spark.s1{top:-2px;left:-6px;animation:sparkTwinkle 3.2s ease-in-out .2s infinite}
.spark.s2{top:8px;right:-8px;left:auto;animation:sparkTwinkle 3.8s ease-in-out 1.4s infinite}
.spark.s3{bottom:-4px;left:14px;animation:sparkTwinkle 4.1s ease-in-out 2.6s infinite}

/* Aktif ögelerde altın varak süpürme parıltısı */
.tab.act,.pre.act,.preAcc.open .preAccHead,.sess:active,.nefsRow.act,.cakraRow.act{position:relative;overflow:hidden}
.tab.act::after,.pre.act::after,.nefsRow.act::after,.cakraRow.act::after{
  content:'';position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;
  background:linear-gradient(105deg,transparent 30%,rgba(255,247,220,.16) 45%,rgba(255,255,255,.28) 50%,rgba(255,247,220,.16) 55%,transparent 70%);
  background-size:220% 100%;background-repeat:no-repeat;
  animation:goldSweep 3.6s ease-in-out infinite;mix-blend-mode:screen}

/* Anlık dokunuş parlaması (JS ile eklenir) */
@keyframes tapFlash{0%{opacity:.55;transform:scale(.4)}100%{opacity:0;transform:scale(1.9)}}
.tap-glow{position:fixed;z-index:2000;width:60px;height:60px;margin:-30px 0 0 -30px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(255,247,220,.7) 0%,color-mix(in srgb,var(--gold) 35%,transparent) 40%,transparent 72%);
  animation:tapFlash .55s ease-out forwards}
.sparkle-burst{position:fixed;z-index:2001;pointer-events:none;font-size:14px;color:#fff6d8;
  text-shadow:0 0 8px color-mix(in srgb,var(--goldh) 90%,transparent);animation:sparkFly .7s ease-out forwards}
@keyframes sparkFly{0%{opacity:1;transform:translate(0,0) scale(.5) rotate(0)}100%{opacity:0;transform:translate(var(--dx),var(--dy)) scale(1.1) rotate(140deg)}}

/* Orb: altın varak dönen doku */
.orb:not(#ns *)::after{
  content:'';position:absolute;inset:0;border-radius:50%;pointer-events:none;
  background:linear-gradient(120deg,transparent 20%,rgba(255,247,220,.35) 48%,rgba(255,255,255,.5) 50%,rgba(255,247,220,.35) 52%,transparent 80%);
  background-size:220% 220%;animation:foilShift 3.4s linear infinite;mix-blend-mode:screen;opacity:.6}

/* Aktif akordiyon başlığında ince altın çizgi parıltısı */
.preAcc.open .preAccHead::after{
  content:'';position:absolute;left:0;bottom:0;height:1px;width:100%;
  background:linear-gradient(90deg,transparent,var(--goldh),transparent);
  background-size:200% 100%;animation:foilShift 3s linear infinite}

/* Hareketi azalt tercihinde tüm ışıltılar dursun */
@media (prefers-reduced-motion:reduce){
  .shimmer-text,.shimmer-logo,.spark,.tab.act::after,.pre.act::after,.nefsRow.act::after,.cakraRow.act::after,.orb::after,.preAcc.open .preAccHead::after{animation:none!important}
  .shimmer-text{-webkit-text-fill-color:var(--goldh);color:var(--goldh)}
}
/* ═══ ZİKİR SAHNESİ — akan altın hat çerçeve ═══ */
.zStage:not(#ns *){border:1px solid transparent;background-clip:padding-box}
.zStage:not(#ns *)::after{
  content:'';position:absolute;inset:0;border-radius:inherit;padding:1.5px;pointer-events:none;z-index:2;
  background:linear-gradient(120deg,var(--gold),var(--goldh) 20%,#fff6d8 30%,var(--goldh) 40%,var(--gold) 60%,var(--goldh) 80%,var(--gold));
  background-size:300% 100%;animation:foilShift 6s linear infinite;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;opacity:.55}

/* ═══ SEKME GEÇİŞİ — ebru dalgalanması ═══ */
@keyframes tabEbru{0%{opacity:0;transform:scale(1.015) translateY(6px)}100%{opacity:1;transform:none}}
section[id^="tab-"]:not([hidden]){animation:tabEbru .42s cubic-bezier(.2,.7,.3,1)}

/* ═══ ÇAKRA TAM EKRAN GÖRSELİ ═══ */
#cakraViz{position:fixed;inset:0;z-index:1400;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;
  background:radial-gradient(circle at 50% 45%,rgba(0,0,0,.55),rgba(0,0,0,.9));backdrop-filter:blur(3px)}
#cakraViz[hidden]{display:none!important}
.cvOrb{width:210px;height:210px;border-radius:50%;transition:background 1.4s cubic-bezier(.32,.9,.35,1),box-shadow 1.4s cubic-bezier(.32,.9,.35,1);
  animation:cvPulse 3.4s ease-in-out infinite}
@keyframes cvPulse{0%,100%{transform:scale(.86)}50%{transform:scale(1.06)}}
.cvName{font:600 21px/1.2 "Cormorant Garamond",serif;letter-spacing:.05em;color:#fff;text-shadow:0 0 24px currentColor;transition:color 1.4s}
.cvHz{font-size:14px;color:rgba(255,255,255,.72);letter-spacing:.1em;font-variant-numeric:tabular-nums}
.cvClose{position:absolute;bottom:calc(34px + env(safe-area-inset-bottom));border:1px solid rgba(255,255,255,.3);background:rgba(255,255,255,.08);color:#fff;border-radius:99px;padding:10px 20px;font-size:14px;cursor:pointer;backdrop-filter:blur(6px)}

/* ── Saf nur tamamlanma sahnesi ── */
#cakraViz{transition:background 1.6s cubic-bezier(.32,.9,.35,1)}
#cakraViz.nur{background:radial-gradient(circle at 50% 42%,rgba(255,248,222,.18),rgba(8,10,8,.95) 64%)}
#cakraViz.nur .cvOrb{animation:nurBreath 2.8s ease-in-out infinite}
#cakraViz .nurRays{position:absolute;left:50%;top:50%;width:min(150vw,620px);height:min(150vw,620px);transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;opacity:0;transition:opacity 1.4s cubic-bezier(.32,.9,.35,1);
  background:repeating-conic-gradient(from 0deg,rgba(255,244,208,.14) 0deg 6deg,rgba(255,244,208,0) 6deg 24deg);
  -webkit-mask:radial-gradient(circle,rgba(0,0,0,.95) 16%,transparent 66%);mask:radial-gradient(circle,rgba(0,0,0,.95) 16%,transparent 66%)}
#cakraViz.nur .nurRays{opacity:1;animation:nurSpin 30s linear infinite}
#cakraViz .nurRing{position:absolute;left:50%;top:50%;width:210px;height:210px;margin:-105px 0 0 -105px;border-radius:50%;border:2px solid rgba(255,246,214,.85);opacity:0;pointer-events:none}
#cakraViz.nur .nurRing{animation:nurRing 3s ease-out infinite}
#cakraViz.nur .nurRing.r2{animation-delay:1s}
#cakraViz.nur .nurRing.r3{animation-delay:2s}
#cakraViz.nur .cvName{text-shadow:0 0 34px rgba(255,246,214,.9),0 0 70px color-mix(in srgb,var(--goldh) 60%,transparent)}
@keyframes nurSpin{from{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes nurRing{0%{transform:scale(.55);opacity:.9}70%{opacity:.22}100%{transform:scale(2.7);opacity:0}}
@keyframes nurBreath{0%,100%{transform:scale(.97)}50%{transform:scale(1.07)}}
@media (prefers-reduced-motion:reduce){#cakraViz.nur .nurRays,#cakraViz.nur .nurRing,#cakraViz.nur .cvOrb{animation:none}}

/* ── Niyet Zikri afişi ── */
#niyetBanner{position:fixed;left:50%;top:14%;z-index:1500;max-width:min(92vw,430px);text-align:center;
  background:linear-gradient(165deg,rgba(var(--vurguK),.94),rgba(var(--yuzeyK),.96));border:1px solid color-mix(in srgb,var(--goldh) 55%,transparent);border-radius:20px;padding:16px 24px 14px;
  box-shadow:0 0 60px color-mix(in srgb,var(--goldh) 28%,transparent),0 18px 50px rgba(0,0,0,.55);backdrop-filter:blur(8px);
  opacity:0;transform:translate(-50%,-10px);pointer-events:none;transition:opacity 0.45s cubic-bezier(.32,.9,.35,1),transform 0.45s cubic-bezier(.32,.9,.35,1)}
#niyetBanner[hidden]{display:none!important}
#niyetBanner.show{opacity:1;transform:translate(-50%,0)}
#niyetBanner .nbAr{font-family:var(--fA);font-size:23px;line-height:1.9;color:#f3e6c8;direction:rtl;text-shadow:0 0 22px color-mix(in srgb,var(--goldh) 40%,transparent)}
#niyetBanner .nbTr,.niyetCard .nbTr{font:600 14px/1.5 "Cormorant Garamond",serif;font-style:italic;color:var(--goldh);letter-spacing:.04em;margin-top:4px}
#niyetBanner .nbMean,.niyetCard .nbMean{font-size:10.5px;color:var(--mut);margin-top:5px;line-height:1.55}
.niyetCard{text-align:center;padding:12px 10px 10px;border:1px dashed color-mix(in srgb,var(--goldh) 35%,transparent);border-radius:13px;background:color-mix(in srgb,var(--goldh) 5%,transparent);margin-top:8px}
.niyetCard .nbAr{font-family:var(--fA);font-size:24px;line-height:1.9;color:var(--goldh);direction:rtl}
.riyRow{display:flex;gap:12px;align-items:center;padding:9px 11px;border-radius:13px;margin-bottom:6px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.08)}
.riyRow .ic{font-size:21px;flex:none;width:22px;text-align:center}
.riyRow b{font-size:12.5px;color:var(--ivory);display:block}
.riyRow small{font-size:10.5px;color:var(--mut);display:block;line-height:1.4}
.hayMed.closed{opacity:.55;filter:grayscale(.35)}
/* ── SÜKÛN toast (SW güncelleme + yedek hatırlatma) ── */
.skToast{position:fixed;left:12px;right:12px;bottom:calc(74px + env(safe-area-inset-bottom));z-index:1600;
  display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:13px;
  background:linear-gradient(160deg,rgba(var(--vurguK),.97),rgba(var(--yuzeyK),.98));
  border:1px solid color-mix(in srgb,var(--goldh) 50%,transparent);box-shadow:0 14px 44px rgba(0,0,0,.55),0 0 26px color-mix(in srgb,var(--goldh) 14%,transparent);
  font-size:12.5px;color:var(--ivory);opacity:0;transform:translateY(12px);transition:all 0.45s cubic-bezier(.2,1,.3,1);pointer-events:none}
.skToast.show{opacity:1;transform:none;pointer-events:auto}
.skToast .msg{flex:1;line-height:1.5}
.skToast button{flex:none;border:1px solid color-mix(in srgb,var(--goldh) 60%,transparent);border-radius:10px;padding:8px 13px;cursor:pointer;
  background:linear-gradient(150deg,color-mix(in srgb,var(--goldh) 22%,transparent),color-mix(in srgb,var(--goldh) 6%,transparent));color:var(--goldh);font:600 12.5px/1 "Cormorant Garamond",serif}
.skToast .x{border-color:rgba(255,255,255,.2);background:rgba(255,255,255,.05);color:var(--mut);padding:8px 10px}
/* ── Yedekleme kutusu ── */
.bakRow{display:flex;gap:8px;margin-top:9px}
.bakRow .btn{flex:1}
.bakStat{font-size:10.5px;color:var(--mut);margin-top:8px;line-height:1.6}
/* ── Vakit Farkındalığı ── */
.vkRow{display:flex;align-items:baseline;gap:8px;padding:7px 9px;border-radius:10px;border:1px solid transparent;margin-top:4px;font-size:11.5px}
.vkRow .vkT{flex:none;width:44px;font:600 10.5px/1 "JetBrains Mono",monospace;color:var(--mut)}
.vkRow b{font-weight:600;color:var(--ivory);white-space:nowrap}
.vkRow i{margin-left:auto;font-style:normal;font-size:9.5px;color:var(--dim);text-align:right}
.vkRow.ker{opacity:.62}
.vkRow.act{border-color:color-mix(in srgb,var(--goldh) 55%,transparent);background:linear-gradient(150deg,color-mix(in srgb,var(--goldh) 13%,transparent),color-mix(in srgb,var(--goldh) 3%,transparent));box-shadow:0 0 14px color-mix(in srgb,var(--goldh) 16%,transparent)}
.vkRow.act .vkT{color:var(--goldh)}
.vkSug{display:flex;align-items:center;gap:8px;margin-top:10px;padding:10px 11px;border-radius:13px;border:1px dashed color-mix(in srgb,var(--goldh) 40%,transparent);font-size:11.5px;color:var(--ivory)}
.vkSug button{flex:none;margin-left:auto}
.vkEmpty{font-size:10.5px;color:var(--mut);line-height:1.7;margin-top:8px}
.vkFoot{font-size:9.5px;color:var(--dim);line-height:1.65;margin-top:10px;border-top:1px dashed rgba(255,255,255,.1);padding-top:8px}
.vkLocRow{display:flex;gap:8px;margin-top:9px}
.vkLocRow .btn{flex:1;padding:8px 10px;font-size:11.5px}
/* ── Fâtiha âyeti — rehber kartı bağ bölümü ── */
.fatCard{position:relative;text-align:center;padding:15px 14px 12px;border-radius:13px;margin:12px 0 6px;
  background:linear-gradient(160deg,color-mix(in srgb,var(--mc,#ecd27e) 12%,transparent),rgba(0,0,0,.14));
  border:1px solid color-mix(in srgb,var(--mc,#ecd27e) 32%,transparent)}
.fatCard .fno{font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--mut);margin-bottom:7px}
.fatCard .faa{font-family:'Amiri',serif;font-size:21px;line-height:1.9;color:var(--ivory);direction:rtl}
.fatCard .fam{font-size:12.5px;color:var(--ivory);opacity:.9;font-style:italic;margin-top:7px;line-height:1.6}
.fatCard .fbn{font-size:10.5px;color:var(--mut);margin-top:9px;line-height:1.65;border-top:1px dashed color-mix(in srgb,var(--mc,#ecd27e) 26%,transparent);padding-top:8px}
.fatCard .fbn b{color:color-mix(in srgb,var(--mc,#ecd27e) 82%,white)}
/* ── Fâtiha Seyri sayfası ── */
.fsList{display:flex;flex-direction:column;gap:8px;margin-top:4px}
.fsStep{border:1px solid rgba(255,255,255,.1);border-left:3px solid var(--sc,#888);border-radius:13px;padding:11px 13px;cursor:pointer;transition:all 0.3s cubic-bezier(.32,.9,.35,1);background:rgba(255,255,255,.02)}
.fsStep:hover{background:rgba(255,255,255,.045)}
.fsStep .fh{display:flex;align-items:baseline;gap:8px}
.fsStep .fn{flex:none;width:18px;height:18px;border-radius:50%;font:700 9.5px/18px sans-serif;text-align:center;color:#0d120f;background:var(--sc,#888)}
.fsStep b{font-size:11.5px;color:var(--ivory)}
.fsStep .fmk{margin-left:auto;font-size:9.5px;color:var(--mut)}
/* ── Vird Defteri ── */
.virdWrap{display:flex;flex-direction:column;gap:8px}
.virdChain{display:flex;flex-direction:column;gap:8px}
.virdItem{display:flex;align-items:center;gap:8px;padding:9px 10px;border-radius:10px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.03)}
.virdItem.cur{border-color:color-mix(in srgb,var(--goldh) 60%,transparent);background:linear-gradient(150deg,color-mix(in srgb,var(--goldh) 14%,transparent),color-mix(in srgb,var(--goldh) 3%,transparent));box-shadow:0 0 14px color-mix(in srgb,var(--goldh) 16%,transparent)}
.virdItem.done{opacity:.5}
.virdItem .vn{flex:none;width:18px;height:18px;border-radius:50%;font:700 9.5px/18px sans-serif;text-align:center;color:#0d120f;background:var(--goldh)}
.virdItem .vt{flex:1;min-width:0}
.virdItem .vt b{font-size:11.5px;color:var(--ivory);display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.virdItem .vt small{font-size:9.5px;color:var(--mut)}
.virdItem .vc{flex:none;font:700 12.5px/1 "JetBrains Mono",monospace;color:var(--goldh);min-width:38px;text-align:right}
.virdItem .vx{flex:none;border:none;background:none;color:var(--dim);cursor:pointer;font-size:16.5px;padding:2px 4px}
.virdItem .vmove{flex:none;display:flex;flex-direction:column;gap:4px}
.virdItem .vmove button{border:none;background:none;color:var(--mut);cursor:pointer;font-size:9.5px;line-height:1;padding:1px 3px}
.virdAdd{display:flex;gap:8px;flex-wrap:wrap;margin-top:2px}
.virdAdd select,.virdAdd input{flex:1;min-width:0;background:rgba(0,0,0,.25);border:1px solid var(--line);border-radius:10px;color:var(--ivory);padding:8px 9px;font-size:11.5px}
.virdAdd input{max-width:64px;flex:none}
.virdEmpty{font-size:10.5px;color:var(--mut);line-height:1.7;text-align:center;padding:14px 8px}
.virdBig{font:700 16.5px/1 "JetBrains Mono",monospace;color:var(--goldh)}
.fsStep .fa{font-family:'Amiri',serif;font-size:16.5px;color:var(--ivory);direction:rtl;text-align:right;margin-top:6px;line-height:1.8}
.fsStep .fi{font-size:10.5px;color:var(--dim);margin-top:5px;line-height:1.55}
.fsStep.on{border-color:var(--sc);background:color-mix(in srgb,var(--sc) 15%,transparent);box-shadow:0 0 15px color-mix(in srgb,var(--sc) 40%,transparent)}
/* ── Âyetü'l-Kürsî kart listesi (Fâtiha Seyri mimarisi) ── */
.akList{max-height:360px;overflow-y:auto;padding:4px 2px;scrollbar-width:thin}
.akList .fsStep .fa{font-size:21px;line-height:2.05}
.akList .fsStep .fi{font-size:11.5px;color:var(--mut)}
.fsStep .ftr{font-size:10.5px;color:var(--dim);font-style:italic;margin-top:5px;line-height:1.6;letter-spacing:.01em}
.fsStep .fbag{font-size:9.5px;color:var(--mut);margin-top:8px;padding-top:7px;line-height:1.65;
  border-top:1px dashed color-mix(in srgb,var(--sc,#c9a227) 30%,transparent)}
.akIntro{font-size:10.5px;color:var(--dim);line-height:1.7;padding:8px 10px;margin:2px 0 8px;
  border-radius:10px;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.07)}
.akIntro.akEdeb{margin:10px 0 6px}
.akIntro.akDis{font-size:9.5px;background:none;border:none;padding:2px 4px;margin:0}
.hayMed[data-kapi]{cursor:pointer;position:relative;perspective:340px}
.hayMed[data-kapi] .e{display:inline-block;transform-origin:left center;transition:transform 0.45s cubic-bezier(.6,.05,.3,1)}
.hayMed[data-kapi].closed .e{transform:rotateY(-72deg)}
.hayMed[data-kapi] .seal{position:absolute;top:8px;right:8px;font-size:16.5px;color:var(--goldh);opacity:0;transform:scale(2.4) rotate(-30deg);transition:all 0.45s cubic-bezier(.2,1.4,.4,1);text-shadow:0 0 10px color-mix(in srgb,var(--goldh) 80%,transparent);pointer-events:none}
.hayMed[data-kapi].closed .seal{opacity:1;transform:scale(1) rotate(0)}

/* ── Nefs Merdiveni (urûc) ── */
.nefsLadder{position:relative;display:flex;flex-direction:column-reverse;gap:4px;margin:6px 0 12px;padding:10px 8px 8px;border:1px dashed color-mix(in srgb,var(--goldh) 28%,transparent);border-radius:13px;background:linear-gradient(180deg,color-mix(in srgb,var(--goldh) 5%,transparent),transparent 60%)}
.nlStep{display:flex;align-items:center;gap:8px;height:26px;border-radius:10px;cursor:pointer;padding:0 9px;
  border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.03);transition:all 0.3s cubic-bezier(.32,.9,.35,1);position:relative}
.nlStep b{font-size:10.5px;color:var(--ivory);font-weight:600;letter-spacing:.04em}
.nlStep .no{flex:none;width:16px;height:16px;border-radius:50%;font-size:9.5px;display:flex;align-items:center;justify-content:center;color:#0d120f;background:var(--sc,#888);font-weight:700}
.nlStep .esm{margin-left:auto;font-size:9.5px;color:var(--mut)}
.nlStep.act{border-color:var(--sc);background:color-mix(in srgb,var(--sc) 14%,transparent);box-shadow:0 0 14px color-mix(in srgb,var(--sc) 45%,transparent)}
.nlStep.act:before{content:'';position:absolute;left:-4px;top:50%;width:9px;height:9px;margin-top:-4.5px;border-radius:50%;background:#fff6d8;box-shadow:0 0 12px 4px rgba(255,246,216,.8);animation:nlHalo 2.2s ease-in-out infinite}
@keyframes nlHalo{0%,100%{box-shadow:0 0 10px 3px rgba(255,246,216,.7)}50%{box-shadow:0 0 18px 7px rgba(255,246,216,.95)}}
.nlStep:nth-child(1){margin-right:42%}.nlStep:nth-child(2){margin-right:35%}.nlStep:nth-child(3){margin-right:28%}
.nlStep:nth-child(4){margin-right:21%}.nlStep:nth-child(5){margin-right:14%}.nlStep:nth-child(6){margin-right:7%}
@media (prefers-reduced-motion:reduce){.nlStep.act:before{animation:none}}

/* ── Rehber sembol vinyeti ── */
.mrSym{display:flex;justify-content:center;margin:0 0 12px}
.mrSym svg{width:96px;height:76px;color:var(--mc,#ecd27e);filter:drop-shadow(0 0 14px color-mix(in srgb,var(--mc,#ecd27e) 55%,transparent))}

/* ── Muhasebe ısı haritası ── */
.muhHeat{display:grid;grid-template-columns:repeat(10,1fr);gap:4px;margin:8px 0 2px}
.muhHeat i{aspect-ratio:1;border-radius:7px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.09)}
.muhHeat i.d{border-color:transparent;box-shadow:0 0 7px color-mix(in srgb,var(--hc,#ecd27e) 55%,transparent)}

/* ── Nefs Külliyatı sayfaları (Rehber • Rüya • Muhasebe • İstiare • Vird) ── */
.mrSheet{position:fixed;inset:0;z-index:1450;display:flex;flex-direction:column;background:rgba(var(--girdiK),.72);backdrop-filter:blur(14px)}
.mrSheet[hidden]{display:none!important}
.mrCard{margin:auto 10px;margin-top:max(16px,env(safe-area-inset-top));margin-bottom:max(16px,env(safe-area-inset-bottom));max-height:calc(100% - 32px);display:flex;flex-direction:column;border-radius:20px;overflow:hidden;
  background:linear-gradient(170deg,rgba(var(--vurguK),.97),rgba(var(--yuzeyK),.98));border:1px solid color-mix(in srgb,var(--goldh) 40%,transparent);box-shadow:0 0 0 1px rgba(0,0,0,.4),0 30px 80px rgba(0,0,0,.6),0 0 70px color-mix(in srgb,var(--goldh) 12%,transparent)}
.mrHead{position:relative;padding:20px 18px 16px;background:color-mix(in srgb,var(--goldh) 7%,transparent);background:radial-gradient(120% 160% at 50% -30%,color-mix(in srgb,var(--mc,#c9a227) 34%,transparent),transparent 70%);border-bottom:1px solid color-mix(in srgb,var(--goldh) 22%,transparent)}
.mrHead .ar{font-family:var(--fA);font-size:34px;line-height:1.5;color:var(--mc,#ecd27e);direction:rtl;text-shadow:0 0 30px color-mix(in srgb,var(--goldh) 50%,transparent);text-shadow:0 0 30px color-mix(in srgb,var(--mc,#ecd27e) 55%,transparent)}
.mrHead h3{margin:2px 0 0;font:600 21px/1.25 "Cormorant Garamond",serif;letter-spacing:.04em;color:var(--ivory,#efe7d3)}
.mrHead .sub{font-size:10.5px;color:var(--mut);margin-top:4px;letter-spacing:.06em}
.mrX{position:absolute;top:12px;right:12px;width:34px;height:34px;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.07);color:#fff;font-size:16.5px;cursor:pointer}
.mrBody{overflow:auto;padding:14px 16px 20px;-webkit-overflow-scrolling:touch}
.ayetCard{position:relative;text-align:center;padding:16px 14px 12px;border-radius:13px;margin:2px 0 14px;
  background:linear-gradient(160deg,color-mix(in srgb,var(--goldh) 8%,transparent),color-mix(in srgb,var(--goldh) 2%,transparent));border:1px solid color-mix(in srgb,var(--goldh) 45%,transparent);box-shadow:inset 0 0 40px color-mix(in srgb,var(--goldh) 6%,transparent)}
.ayetCard:before,.ayetCard:after{content:'✦';position:absolute;top:6px;font-size:10.5px;color:color-mix(in srgb,var(--goldh) 70%,transparent)}
.ayetCard:before{left:10px}.ayetCard:after{right:10px}
.ayetCard .aa{font-family:var(--fA);font-size:24px;line-height:2;color:var(--goldh);direction:rtl}
.ayetCard .am{font-size:12.5px;color:var(--ivory);font-style:italic;margin-top:6px;line-height:1.6}
.ayetCard .ref{font-size:9.5px;color:var(--mut);letter-spacing:.14em;margin-top:6px;text-transform:uppercase}
.mrSec{font-size:10.5px;letter-spacing:.16em;color:var(--mut);margin:14px 0 8px;text-transform:uppercase}
.sifatGrid{display:flex;flex-wrap:wrap;gap:8px}
.sifatChip{border:1px solid color-mix(in srgb,var(--goldh) 50%,transparent);border:1px solid color-mix(in srgb,var(--mc,#c9a227) 55%,transparent);color:var(--ivory);background:color-mix(in srgb,var(--goldh) 8%,transparent);background:color-mix(in srgb,var(--mc,#c9a227) 10%,transparent);
  border-radius:99px;padding:7px 13px;font-size:11.5px;line-height:1.2;cursor:pointer;transition:all 0.2s cubic-bezier(.32,.9,.35,1);user-select:none}
.sifatChip.on{background:linear-gradient(140deg,var(--mc,#c9a227),color-mix(in srgb,var(--mc,#c9a227) 55%,#000));color:#0d120f;font-weight:600;box-shadow:0 4px 16px color-mix(in srgb,var(--goldh) 40%,transparent);box-shadow:0 4px 16px color-mix(in srgb,var(--mc,#c9a227) 45%,transparent)}
.mrProse{font-size:12.5px;color:var(--ivory);line-height:1.75;opacity:.94}
.mrMeta{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.mrMeta i{font-style:normal;font-size:10.5px;color:var(--mut);border:1px solid rgba(255,255,255,.14);border-radius:10px;padding:5px 9px;background:rgba(255,255,255,.03)}
.mrGo{display:block;width:100%;margin-top:16px;padding:12px;border-radius:13px;border:1px solid color-mix(in srgb,var(--goldh) 60%,transparent);cursor:pointer;
  background:linear-gradient(150deg,color-mix(in srgb,var(--goldh) 20%,transparent),color-mix(in srgb,var(--goldh) 6%,transparent));color:var(--goldh);font:600 14px/1 "Cormorant Garamond",serif;letter-spacing:.08em}
.mrGo.alt{margin-top:8px;border-color:rgba(255,255,255,.22);background:rgba(255,255,255,.05);color:var(--ivory)}
/* Rüya Pusulası */
.ruyaChips{display:flex;gap:8px;overflow-x:auto;padding:2px 0 8px;-webkit-overflow-scrolling:touch}
.ruyaChips b{flex:none;font-weight:500;font-size:10.5px;color:var(--ivory);border:1px solid rgba(255,255,255,.18);border-radius:99px;padding:6px 12px;cursor:pointer;background:rgba(255,255,255,.04);white-space:nowrap}
.ruyaChips b.on{border-color:var(--goldh);color:#0d120f;background:var(--goldh);font-weight:600}
.ruyaItem{display:flex;gap:12px;align-items:flex-start;padding:10px 12px;border-radius:13px;margin-bottom:7px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.07);border-left:3px solid var(--rc,#c9a227)}
.ruyaItem b{font-size:12.5px;color:var(--ivory);display:block}
.ruyaItem small{font-size:11.5px;color:var(--mut);line-height:1.5;display:block;margin-top:2px}
.ruyaItem .tag{margin-left:auto;flex:none;font-size:9.5px;color:var(--rc,#c9a227);border:1px solid color-mix(in srgb,var(--goldh) 50%,transparent);border:1px solid color-mix(in srgb,var(--rc,#c9a227) 55%,transparent);border-radius:7px;padding:3px 7px;letter-spacing:.06em}
/* Hayvan madalyonları */
.hayGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(86px,1fr));gap:12px}
.hayMed{text-align:center;padding:12px 6px 10px;border-radius:13px;cursor:pointer;transition:transform 0.2s cubic-bezier(.32,.9,.35,1),box-shadow 0.2s cubic-bezier(.32,.9,.35,1);
  background:radial-gradient(90% 90% at 50% 20%,color-mix(in srgb,var(--goldh) 12%,transparent),rgba(var(--yuzeyK),.9) 74%);border:1px solid color-mix(in srgb,var(--goldh) 35%,transparent);box-shadow:inset 0 0 24px rgba(0,0,0,.5)}
.hayMed:active{transform:scale(.94)}
.hayMed .e{font-size:33px;line-height:1;filter:drop-shadow(0 3px 8px rgba(0,0,0,.6))}
.hayMed b{display:block;font-size:11.5px;color:var(--goldh);margin-top:6px;font-family:"Cormorant Garamond",serif;letter-spacing:.05em}
.hayMed small{display:block;font-size:9.5px;color:var(--mut);line-height:1.4;margin-top:2px}
/* Muhasebe */
.muhDots{display:flex;gap:4px;margin:8px 0 2px}
.muhDots i{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.15)}
.muhDots i.d{background:var(--goldh);border-color:var(--goldh);box-shadow:0 0 8px color-mix(in srgb,var(--goldh) 60%,transparent)}
/* Yükseliş Virdi */
.yksRow{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:13px;margin-bottom:8px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.09);transition:all 0.3s cubic-bezier(.32,.9,.35,1)}
.yksRow.cur{border-color:var(--goldh);background:linear-gradient(150deg,color-mix(in srgb,var(--goldh) 16%,transparent),color-mix(in srgb,var(--goldh) 4%,transparent));box-shadow:0 0 24px color-mix(in srgb,var(--goldh) 18%,transparent)}
.yksRow.done{opacity:.55}
.yksRow .k{flex:none;width:26px;height:26px;border-radius:50%;border:1px solid color-mix(in srgb,var(--goldh) 50%,transparent);display:flex;align-items:center;justify-content:center;font-size:11.5px;color:var(--goldh)}
.yksRow.done .k{background:var(--goldh);color:#0d120f}
.yksRow .aa{font-family:var(--fA);font-size:16.5px;color:var(--goldh);direction:rtl;margin-left:auto}
.yksRow b{font-size:12.5px;color:var(--ivory);display:block}
.yksRow small{font-size:10.5px;color:var(--mut);display:block}
.nfoBtn{flex:none;width:30px;height:30px;margin:0 4px;border-radius:10px;border:1px solid color-mix(in srgb,var(--goldh) 35%,transparent);background:color-mix(in srgb,var(--goldh) 8%,transparent);font-size:14px;cursor:pointer;color:var(--goldh)}

/* ══════ SPLASH SCREEN EFEKTLERİ ══════ */
@keyframes radialBurst {
  0% { opacity: 1; transform: scale(0.8); }
  100% { opacity: 0; transform: scale(3.5); }
}
.splash-burst {
  position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(circle at center, color-mix(in srgb,var(--goldh) 28%,transparent) 0%, color-mix(in srgb,var(--gold) 12%,transparent) 40%, transparent 70%);
  animation: radialBurst 0.7s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
  z-index: 10; border-radius: inherit;
}

@keyframes goldRise {
  0% { opacity: 0; transform: translateY(20px) scale(0.5); }
  20% { opacity: 1; transform: translateY(0) scale(1.2); }
  100% { opacity: 0; transform: translateY(-90px) scale(0); }
}
.splash-particle {
  position: fixed; width: 5px; height: 5px; border-radius: 50%;
  background: #fff6d8; box-shadow: 0 0 12px #c9a227;
  animation: goldRise 1s ease-in forwards;
  pointer-events: none; z-index: 1500;
}

@keyframes blurDissolve {
  0% { filter: blur(14px); opacity: 0; transform: scale(1.02); }
  100% { filter: blur(0px); opacity: 1; transform: scale(1); }
}
.blur-in {
  animation: blurDissolve 0.9s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
}

.fade-out-splash {
  transition: opacity 0.8s ease-out, visibility 0.8s;
  opacity: 0 !important;
  visibility: hidden !important;
}

/* ═══ GÜNLÜK MANEVİ SÖZ KARTI ═══ */
body.splash-open > .wrap{
  filter:blur(8px);
  opacity:0.5;
  transition:filter 0.8s,opacity 0.8s;
  pointer-events:none;
}
#onboardCard{
  position:fixed;inset:0;z-index:1500;display:flex;align-items:center;justify-content:center;padding:24px;
  background:radial-gradient(circle at 50% 40%,rgba(var(--sayfaK),.88),rgba(var(--sayfa2K),.97));backdrop-filter:blur(8px);
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity 0.45s cubic-bezier(.32,.9,.35,1),visibility 0.45s;
}
#onboardCard.ob-active{opacity:1;visibility:visible;pointer-events:auto}
.obInner{max-width:380px;width:100%;text-align:center;padding:34px 26px 26px;border-radius:20px;position:relative;
  background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.01) 40%,transparent),rgba(var(--yuzeyK),.75);
  box-shadow:0 30px 70px -26px rgba(0,0,0,.85),0 0 40px color-mix(in srgb,var(--gold) 14%,transparent)}
.obInner::before{content:'';position:absolute;inset:0;border-radius:inherit;padding:1.5px;
  background:linear-gradient(140deg,var(--goldh),transparent 40%,transparent 60%,var(--gold));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.obDots{display:flex;justify-content:center;gap:8px;margin-bottom:18px}
.obDots span{width:6px;height:6px;border-radius:50%;background:var(--dim);transition:background 0.3s,transform 0.3s}
.obDots span.on{background:var(--goldh);transform:scale(1.3)}
.obGlyph{width:52px;height:52px;margin:0 auto 16px;color:var(--goldh);filter:drop-shadow(0 0 8px color-mix(in srgb,var(--goldh) 40%,transparent));animation:logoGlow 4s ease-in-out infinite}
.obTitle{font:600 21px/1.3 "Cormorant Garamond",serif;color:var(--goldh);letter-spacing:.02em;margin-bottom:11px}
.obText{font-size:14px;line-height:1.65;color:var(--mut)}
.obBtns{display:flex;gap:12px;margin-top:24px}
.obSkip{flex:none;background:none;border:none;color:var(--dim);font-size:12.5px;cursor:pointer;font-family:inherit;padding:11px 14px}
.obNext{flex:1;background:color-mix(in srgb,var(--gold) 14%,transparent);border:1px solid var(--line2);color:var(--goldh);border-radius:13px;padding:12px;font-size:14px;font-weight:600;cursor:pointer;font-family:inherit;min-height:44px}
.obNext:active{background:color-mix(in srgb,var(--gold) 24%,transparent)}
body[data-tema="sabah"] .obTitle{color:#8a6716}
body[data-tema="sabah"] .obText{color:#6d5c42}

#dailyCard{
  position:fixed;inset:0;z-index:1450;display:flex;align-items:center;justify-content:center;padding:24px;
  background:radial-gradient(circle at 50% 40%,rgba(var(--sayfaK),.82),rgba(var(--sayfa2K),.95));backdrop-filter:blur(6px);
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity 0.8s cubic-bezier(.32,.9,.35,1),visibility 0.8s;
}
#dailyCard.daily-active{
  opacity:1;visibility:visible;pointer-events:auto;
  animation:tabEbru .5s ease;
}
.dcInner{max-width:400px;text-align:center;padding:30px 26px;border-radius:20px;position:relative;
  background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.01) 40%,transparent),rgba(var(--yuzeyK),.7);
  border:1px solid transparent;background-clip:padding-box;
  box-shadow:0 30px 70px -26px rgba(0,0,0,.85),0 0 40px color-mix(in srgb,var(--gold) 12%,transparent)}
.dcInner::before{content:'';position:absolute;inset:0;border-radius:inherit;padding:1.5px;
  background:linear-gradient(140deg,var(--goldh),transparent 40%,transparent 60%,var(--gold));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.dcOrn{font-size:26px;color:var(--goldh);margin-bottom:14px;animation:logoGlow 4s ease-in-out infinite}
.dcText{font:500 16.5px/1.6 "Cormorant Garamond",serif;color:var(--ivory);letter-spacing:.01em}
.dcSrc{margin-top:12px;font-size:12.5px;color:var(--gold);letter-spacing:.06em}
.lsHeatWrap{margin:12px 0}
.lsHeatT{font-size:10.5px;color:var(--dim);letter-spacing:.08em;text-transform:uppercase;margin-bottom:6px}
.lsHeat{display:grid;grid-template-columns:repeat(12,1fr);gap:4px}
.lsHeat i{aspect-ratio:1;border-radius:3px;background:rgba(255,255,255,.05);transition:transform 0.12s}
.lsHeat i:active{transform:scale(1.4)}
.lsEsma{display:flex;flex-direction:column;gap:4px;margin:4px 0 12px}
.lsEsma .er{display:flex;align-items:center;gap:8px;font-size:11.5px}
.lsEsma .er b{flex:none;color:var(--goldh);width:96px;font-weight:500}
.lsEsma .er .bar{flex:1;height:7px;border-radius:7px;background:rgba(255,255,255,.06);overflow:hidden}
.lsEsma .er .bar i{display:block;height:100%;background:linear-gradient(90deg,var(--gold),var(--goldh))}
.lsEsma .er .n{flex:none;color:var(--mut);font-variant-numeric:tabular-nums;width:52px;text-align:right}
.seyAr{font-family:"Amiri",serif;font-size:21px;line-height:2.1;color:var(--goldh);text-align:center;margin:10px 0 12px;text-shadow:0 0 18px color-mix(in srgb,var(--gold) 25%,transparent)}
.seyTr{font-size:14px;line-height:1.75;color:var(--ivory);text-align:center;font-style:italic;margin-bottom:10px;letter-spacing:.01em}
.seyMean{font-size:11.5px;line-height:1.65;color:var(--mut);border-left:2px solid var(--line2);padding:6px 0 6px 11px;margin-bottom:4px}
#seyBox summary{color:var(--goldh)}
#seyTrPlay.playing,#seyArPlay.playing,#seyMeanPlay.playing{color:#ff9e7a;border-color:#ff9e7a}
footer{margin-top:26px;text-align:center;font-size:10.5px;color:var(--dim);line-height:1.65;padding:0 8px}
.hpNote{display:flex;align-items:flex-start;gap:8px;font-size:11.5px;color:var(--mut);line-height:1.55;margin-top:10px;padding:8px 10px;border-radius:10px;background:rgba(255,255,255,.03);border:1px solid var(--line)}
.hpNote .hpIco{flex:none;font-size:14px;line-height:1.55}
.hpNote b{color:var(--goldh)}
@media (max-width:420px){
  .mixGrid,.presetGrid{grid-template-columns:1fr 1fr}
  h1{font-size:26px}
  .zAr{font-size:28px}.zTr{font-size:21px}
}
@media (prefers-reduced-motion:reduce){
  .ring,.orb,.zGlow,body::after{animation:none!important}
}

/* ═══════════════════════════════════════════════════════════════
   ✦ NERO GÖRSEL KATMANI
   Görsel Dil Kılavuzu'na sadık: figüratif yok — geometri, hat, ۞ türevleri.
   Tüm renkler tema değişkenlerinden türer (12 temanın hepsinde çalışır).
   ═══════════════════════════════════════════════════════════════ */

/* ── 1) SEKMELER: emojiden geometrik glif'e ────────────────────
   İkon üstte, etiket altta — dar ekranda "Ambiyans"ın satır kırması
   ve sekme çubuğunun taşması da böylece çözülüyor. */
.tabs{gap:4px;padding:5px}
.tab,.tabTekke{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:4px;padding:8px 2px 7px;min-width:0}
.tbIc{width:19px;height:19px;flex:none;display:block;color:currentColor;
  transition:transform 0.3s cubic-bezier(.2,.7,.3,1),filter 0.3s}
/* Önceki hâlde white-space:nowrap idi — daha uzun bir çeviri (ör. İngilizce)
   sekmenin sınırını taşıp komşu sekmeyle üst üste biniyordu (asıl sebep bir
   anahtar çakışmasıydı, o giderildi — ama savunma amaçlı sekme artık
   gerekirse iki satıra sarıyor, asla komşusuna binmiyor). */
.tbL{font-size:10.5px;font-weight:600;letter-spacing:.03em;line-height:1.2;
  white-space:normal;overflow-wrap:break-word;text-align:center;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tbRub{font-size:21px;line-height:19px;height:19px;display:block}
.tab.act .tbIc,.tabTekke .tbRub{filter:drop-shadow(0 0 7px color-mix(in srgb,var(--gold) 55%,transparent))}
.tab.act .tbIc{transform:translateY(-1px) scale(1.06)}
.tab:not(.act) .tbIc{opacity:.72}
@media (max-width:359px){.tbL{font-size:9.5px}.tbIc{width:17px;height:17px}}
/* Aktif sekmedeki altın süpürme ikonun üstünü kapatmasın */
.tab.act::after{mix-blend-mode:screen;opacity:.55}

/* ── 2) ZİKİR MÜHRÜ — imza katman ─────────────────────────────
   Sayaç ilerledikçe çember üzerindeki taneler yanar ve her tane
   {n/k} adımıyla bir kiriş çeker: zikir, gözünün önünde bir girih
   yıldızı olarak ÖRÜLÜR. Devir tamamlanınca mühür bir an tamamlanıp
   parlar ve yeniden açılır. Deterministik — aynı sayı, aynı şekil. */
.zMuhr{
  position:absolute;inset:0;margin:auto;
  width:276px;height:276px;max-width:100%;
  pointer-events:none;                 /* z-index YOK: metin üstte kalsın */
  transition:opacity 0.45s cubic-bezier(.32,.9,.35,1)}
.zStage:not(.zLive) .zMuhr{opacity:.72}

/* ── 3) FREKANS AYNASI — vuruşu görünür kılan şerit ───────────
   Binauralde iki taşıyıcı birbirinin üstünden kayar; kesiştikleri
   yerde zarf (beat) doğar. Kullanıcı "vuruş" kelimesini ilk kez
   burada GÖRÜR. */
.frMirror{
  position:relative;width:100%;height:112px;margin:10px 0 2px;
  border-radius:13px;overflow:hidden;
  border:1px solid var(--line);
  background:linear-gradient(180deg,rgba(0,0,0,.30),rgba(255,255,255,.022));
  box-shadow:0 1px 2px rgba(0,0,0,.35) inset}
body[data-tema="sabah"] .frMirror{background:linear-gradient(180deg,rgba(60,49,34,.07),rgba(255,255,255,.5))}
.frMirror canvas{width:100%;height:100%;display:block}
.frMirror.live{border-color:var(--line2);box-shadow:0 0 18px -6px color-mix(in srgb,var(--gold) 35%,transparent),0 1px 2px rgba(0,0,0,.35) inset}
.fmTag{
  position:absolute;left:11px;top:9px;font-size:9.5px;letter-spacing:.13em;
  text-transform:uppercase;font-weight:700;color:var(--gold);opacity:.85;
  pointer-events:none;font-variant-numeric:tabular-nums}
.fmL,.fmR{
  position:absolute;bottom:8px;font-size:9.5px;letter-spacing:.16em;
  text-transform:uppercase;font-style:normal;color:var(--dim);
  pointer-events:none;opacity:0;transition:opacity 0.45s}
.fmL{left:11px}.fmR{right:11px}
.frMirror.stereo .fmL,.frMirror.stereo .fmR{opacity:.75}

/* ── 4) AMBİYANS KANALLARI — canlı eşitleyici ─────────────────
   Açık kanalda dört çubuk nefes alır: "bu ses şu an akıyor". */
.chEq{display:none;flex:none;align-items:flex-end;gap:4px;height:13px;width:16px}
.chn.on .chEq{display:flex}
.chEq s{
  flex:1;text-decoration:none;border-radius:3px;height:24%;
  background:linear-gradient(180deg,var(--goldh),var(--gold));
  transform-origin:50% 100%;
  animation:chEqA 1.1s ease-in-out infinite}
.chEq s:nth-child(2){animation-duration:.76s;animation-delay:.15s}
.chEq s:nth-child(3){animation-duration:1.32s;animation-delay:.34s}
.chEq s:nth-child(4){animation-duration:.94s;animation-delay:.52s}
@keyframes chEqA{0%,100%{height:28%;opacity:.6}50%{height:100%;opacity:1}}

/* ── 5) BAŞLIK — ۞'in geometrisi: iki kare, 45° ───────────────
   Rub'-el-hizb'in kendisi zaten iki üst üste binmiş karedir; logonun
   arkasında onu yavaşça döndürüyoruz. */
.girih{
  position:absolute;left:50%;top:50%;width:70px;height:70px;
  margin:-35px 0 0 -35px;pointer-events:none;opacity:.34;
  animation:spin 96s linear infinite}
.girih i{position:absolute;inset:0;border:1px solid var(--gold);border-radius:7px}
.girih i:last-child{transform:rotate(45deg)}
h1.shimmer-text{position:relative;z-index:1}

/* ── 6) AÇILIŞ KOREOGRAFİSİ ───────────────────────────────────
   Sabit (sticky) öğelerde transform kullanılmıyor: transform bir
   containing block oluşturup yapışkanlığı bozardı. */
@keyframes neroRise{from{opacity:0;transform:translateY(13px)}to{opacity:1;transform:none}}
@keyframes neroFade{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:no-preference){
  .wrap>header{animation:neroRise .75s cubic-bezier(.2,.7,.3,1) both}
  .wrap>.masterBar{animation:neroFade .7s ease .1s both}
  .wrap>.todayCard{animation:neroRise .75s cubic-bezier(.2,.7,.3,1) .18s both}
  .wrap>.tabs{animation:neroFade .6s ease .28s both}
  .wrap>.rutRow{animation:neroFade .6s ease .34s both}
}

/* ── 7) KLAVYE ODAĞI — görünür ve altın ───────────────────────
   Kalite tabanı: fare olmadan da gezilebilmeli. */
.tab:focus-visible,.tabTekke:focus-visible,.btn:focus-visible,.sw:focus-visible,
.cat:focus-visible,.zItem:focus-visible,.pre:focus-visible,.sess:focus-visible,
.rxChip:focus-visible,.zNav button:focus-visible,summary:focus-visible,
input:focus-visible,select:focus-visible{
  outline:2px solid var(--goldh);outline-offset:2px;border-radius:10px}

/* ── 8) HAREKETİ AZALT ────────────────────────────────────────*/
@media (prefers-reduced-motion:reduce){
  .girih,.chEq s{animation:none!important}
  .chEq s{height:58%}
}

/* ── 8b) YÜKSEK KONTRAST ──────────────────────────────────────
   Cihazında "kontrastı artır" açık olan kullanıcı (görme azlığı,
   güneş altında kullanım, yaşa bağlı kontrast duyarlılığı kaybı)
   bu bloğu alır. Uygulamanın altın/loş estetiği kasıtlı ama düşük
   kontrastlı: --mut ve --dim gövde metni WCAG AA'nın altında kalıyor.
   Renk kimliği korunur, yalnız ışık artırılır; hiçbir yerleşim değişmez. */
@media (prefers-contrast:more){
  :root{
    --mut:#c6d6cd;          /* ikincil metin — okunur seviyeye çıkar */
    --dim:#9db0a6;          /* en soluk metin */
    --ivory:#fbf6ea;
    --goldh:#f4dd93;
    --line:color-mix(in srgb,var(--gold) 46%,transparent);
    --line2:color-mix(in srgb,var(--gold) 72%,transparent);
    --panel:rgba(var(--sayfaK),.94);   /* cam etkisi altındaki metni netleştirir */
    --glassA:0.96;
  }
  /* İnce ayırıcılar yüksek kontrastta görünmez oluyordu */
  .card,.pre,.zItem,.sess,.opt,.sldRow{border-color:var(--line2)}
  /* Odak halkası daha kalın */
  .tab:focus-visible,.tabTekke:focus-visible,.btn:focus-visible,.sw:focus-visible,
  .cat:focus-visible,.zItem:focus-visible,.pre:focus-visible,.sess:focus-visible,
  .rxChip:focus-visible,.zNav button:focus-visible,summary:focus-visible,
  input:focus-visible,select:focus-visible{outline-width:3px;outline-offset:3px}
  /* Yalnız opaklıkla belirtilen durumlar (pasif/etkin) ayırt edilemiyordu */
  .sw{border:1px solid var(--line2)}
  .sw.on{box-shadow:inset 0 0 0 2px var(--goldh)}
}

/* ═══ r155 — ZİKİR BİLGİ / SAYAÇ AYRIMI ═══ */
.zStage{min-height:0;justify-content:flex-start;overflow:visible;padding:24px 18px 18px;gap:10px;cursor:default!important;text-align:center}
.zStage:active{transform:none!important}
.zStage .zAr,.zStage .zOku,.zStage .zTr{align-self:center}
.zStage .zMenzil,.zStage .zUyari,.zStage .zNiyet,.zStage .zMean{width:100%;max-width:none;box-sizing:border-box;text-align:left}
.zStage .zMenzil{margin-top:14px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:rgba(var(--girdiK),.30)}
.zStage .zUyari,.zStage .zNiyet,.zStage .zMean{margin-top:8px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:rgba(var(--girdiK),.24);line-height:1.7}
.zStage .zUyari{border-left:2px solid var(--uyari)}
.zStage .zNiyet{border-left:2px solid var(--gold)}
.zStage .zMean{font-size:12.5px;color:var(--ivory)}
.zStage .zEb{margin-top:6px}
.zCountTitle{display:flex;align-items:center;justify-content:center;gap:10px;color:var(--goldh);font-family:var(--fD);font-size:15px;letter-spacing:.16em;margin:0 0 12px}
.zCountTitle::before,.zCountTitle::after{content:'';height:1px;flex:1;background:linear-gradient(90deg,transparent,var(--line2))}
.zCountTitle::after{background:linear-gradient(90deg,var(--line2),transparent)}
.zCounterRow{display:grid;grid-template-columns:minmax(68px,.72fr) minmax(176px,1.45fr) minmax(68px,.72fr);gap:10px;align-items:center}
.zCounterSide{min-height:94px;border:1px solid var(--line);border-radius:13px;background:rgba(var(--girdiK),.28);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:8px 5px;text-align:center}
.zCounterSide small{font-size:9px;letter-spacing:.12em;color:var(--mut)}
.zCounterSide b{font-family:var(--fD);font-size:24px;line-height:1.05;color:var(--goldh);font-variant-numeric:tabular-nums;margin:5px 0 3px}
.zCounterSide em{font-style:normal;font-size:8.5px;color:var(--dim)}
.zCountVisual{position:relative;width:min(100%,220px);aspect-ratio:1;margin:auto;border-radius:50%;display:flex;align-items:center;justify-content:center;overflow:hidden;cursor:pointer;outline:none;isolation:isolate;touch-action:pan-y;user-select:none;-webkit-user-select:none;background:radial-gradient(circle at 50% 45%,rgba(var(--girdiK),.65),rgba(var(--girdiK),.12) 63%,transparent 65%)}
.zCountVisual:focus-visible{box-shadow:0 0 0 2px var(--goldh),0 0 22px color-mix(in srgb,var(--gold) 28%,transparent)}
.zCountVisual:active{transform:scale(.985)}
.zCountVisual .rings,.zCountVisual .progArc,.zCountVisual .zMuhr,.zCountVisual .zGlow,.zCountVisual .breathHalo,.zCountVisual .tsbGauge{position:absolute;inset:0;margin:auto}
.zCountVisual .zMuhr{width:100%;height:100%}
.zCountVisual .progArc svg{width:100%;height:100%}
.zCountVisual .r1:not(#ns *){width:72%;height:72%}.zCountVisual .r2:not(#ns *){width:90%;height:90%}.zCountVisual .r3:not(#ns *){width:58%;height:58%}
.zCountVisual .zGlow{width:100%;height:100%}
.zCountVisual .cntNums{position:relative;z-index:4;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;pointer-events:none}
.zCountVisual .cntNums small{font-size:8.5px;letter-spacing:.14em;color:var(--mut);margin-bottom:2px}
.zCountVisual .cntBig{font-size:38px;text-shadow:0 0 20px color-mix(in srgb,var(--gold) 28%,transparent)}
.cntPct{font-size:10px;color:var(--goldh);margin-top:3px;font-variant-numeric:tabular-nums}
.zCtl>.cntSub{text-align:center;margin:8px 0 2px}
.zCtl .tapBtn{margin-top:12px}
.zBar{width:100%;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:14px}
.zBar .spkBtn{min-width:0;width:100%;padding:10px 5px 9px}
.zBar .spkBtn:nth-child(5),.zBar .spkBtn:nth-child(6){grid-column:span 2}
@media(max-width:390px){.zCounterRow{grid-template-columns:62px minmax(154px,1fr) 62px;gap:7px}.zCounterSide{min-height:84px}.zCounterSide b{font-size:20px}.zCountVisual .cntBig{font-size:32px}.zBar{grid-template-columns:repeat(2,minmax(0,1fr))}.zBar .spkBtn:nth-child(5),.zBar .spkBtn:nth-child(6){grid-column:span 1}}
@media(max-width:335px){.zCounterRow{grid-template-columns:1fr}.zCounterSide{min-height:58px}.zCountVisual{width:180px}.zCounterSide{flex-direction:row;gap:8px}.zCounterSide b{margin:0;font-size:20px}}