/* ============================================================
   Kişisel OS — yenilenmiş arayüz katmanı
   Maketin (araclar/yerel/yenilenmis-ui) tasarım dili, sitenin kendi
   sınıf adlarıyla. index.html'deki gömülü stilden SONRA yüklenir;
   app.js/stilEkle modül stillerini bu link'in ÖNÜNE koyar.
   Renk yazma, token kullan.
   ============================================================ */

/* ============ 1 · tokenlar (TEK KAYNAK, v0.96) ============
   Bütün tasarım değişkenleri burada; index.html'de token yok. Bu bloğun dışında hex renk yazılmaz.
   Metin tokenları (-t, --mut, --fnt) zemin üstünde en az 4,5:1. Dolgu tokenları (--ok, --amb, --miss,
   --acc) nokta, çizgi ve zemin içindir; yazı rengi olarak -t eşini kullan.
   Eski adlar (--blue, --bluet, --acch, --r, --rs, --rk, --sh, --shs, --hov) en altta takma ad olarak
   çalışmaya devam eder; yeni kodda yeni adları kullan. */
:root{
  /* yüzey ve çizgi */
  --bg:#f4f4fa; --bg2:#eeedf7; --sf:#ffffff; --sf2:#fafafe;
  --line:#e9e7f3; --line2:#dedbec;
  /* metin */
  --ink:#16122e; --txt:#3a3760; --mut:#5c5982; --fnt:#6a678f;
  /* vurgu: yalnız "şimdi", ACİL ve ＋ */
  --acc:#ff6a33; --acc-t:#c2410c; --acc-dolgu:#d04712; --acc-ust:#ffffff; --tint:#fff0e8;
  /* durum */
  --ok:#0fa678; --amb:#d99b0b; --miss:#e04b52; --wait:#dedbec;
  --ok-t:#0b7d5b; --amb-t:#92580a; --miss-t:#c8343c;
  --rz-sf:#c8343c; --rz-ink:#ffffff;
  /* Claude */
  --c-claude:#d97757; --claude-t:#b4532f; --claude-tint:rgba(217,119,87,.13);
  /* ters yüzey (sayfa başına tek birincil eylem, toast) ve seçili durum (çip, segment, sekme) */
  --ters-sf:#16122e; --ters-ink:#ffffff;
  --secili:#16122e; --secili-ink:#ffffff;
  --odak:#16122e;
  /* yazı ölçeği (8 adım) */
  --y-et:11px; --y-meta:12.5px; --y-kucuk:14px; --y-govde:15px; --y-kart:17px; --y-bolum:20px; --y-sayfa:26px; --y-sayi:34px;
  /* aralık ölçeği (4 tabanlı) */
  --a1:4px; --a2:8px; --a3:12px; --a4:16px; --a5:20px; --a6:24px; --a7:32px; --a8:48px;
  /* yarıçap */
  --r-xs:6px; --r-s:12px; --r-m:16px; --r-l:22px; --r-tam:999px;
  /* gölge: kart · küçük kart · kalkış (yalnız fareyle) · üst katman (sheet, palet, toast) */
  --g1:0 1px 2px rgba(28,20,70,.04),0 12px 26px -16px rgba(28,20,70,.22);
  --g1s:0 1px 2px rgba(28,20,70,.04),0 8px 18px -14px rgba(28,20,70,.22);
  --g2:0 2px 6px rgba(28,20,70,.06),0 26px 48px -22px rgba(28,20,70,.34);
  --g3:0 30px 70px -20px rgba(10,8,30,.5);
  /* hareket */
  --ease:cubic-bezier(.23,1,.32,1); --ease-drawer:cubic-bezier(.32,.72,0,1); --hiz-k:150ms; --hiz-o:240ms;
  --glow:0 0 0 0 transparent;
  /* kabuk */
  --kok1:#26204c; --kok2:#15102e;
  --nav:color-mix(in srgb,#ffffff 88%,transparent);
  --scrim:rgba(10,8,30,.5);
  --rail:250px;
  /* alan renkleri (karo, çizgi, nokta; yazı için değil) */
  --c-saglik:#0d9488;--c-spor:#7c3aed;--c-maneviyat:#c98a12;--c-gelisim:#65a30d;--c-zihin:#8b5cf6;
  --c-is:#64748b;--c-para:#16a34a;--c-eticaret:#0891b2;--c-marka:#db2777;--c-imaj:#b07d54;
  --c-sosyal:#f43f5e;--c-varlik:#8b8178;--c-kisisel:#64748b;--c-beceri:#4f46e5;
  --c-arsiv:#2563eb;--c-gorev:#4f46e5;
  --k-uyku:#7c5cff; --k-adim:#16a34a; --k-nabiz:#e04b52; --k-spor:#7c3aed;
  /* takma adlar: eski adlar (yeni kodda kullanma) */
  --acch:var(--acc-t); --blue:var(--claude-t); --bluet:var(--claude-tint);
  --r:var(--r-l); --rs:var(--r-m); --rk:var(--r-s);
  --sh:var(--g1); --shs:var(--g1s); --hov:var(--g2);
  color-scheme:light;
}
:root.dark{
  --bg:#0b0a1a; --bg2:#242046; --sf:#171530; --sf2:#1d1a3a;
  --line:#282450; --line2:#332e5e;
  --ink:#f2f0ff; --txt:#cdc9e8; --mut:#a6a1ca; --fnt:#9692bd;
  --acc:#ff7a45; --acc-t:#ffa274; --acc-dolgu:#ff7a45; --acc-ust:#16122e; --tint:rgba(255,122,69,.15);
  --ok:#3fcf8e; --amb:#f2b84b; --miss:#ff7a80; --wait:#332e5e;
  --ok-t:#3fcf8e; --amb-t:#f2b84b; --miss-t:#ff8a90;
  --rz-sf:#ff7a80; --rz-ink:#16122e;
  --c-claude:#e29a7d; --claude-t:#e29a7d; --claude-tint:rgba(226,154,125,.14);
  /* koyu temada seçili durum düz beyaz değil: Claude tonlu, ince çerçeveli zemin */
  --ters-sf:#ffffff; --ters-ink:#16122e;
  --secili:color-mix(in srgb,#e29a7d 30%,#1d1a3a); --secili-ink:#f2f0ff;
  --odak:#f2f0ff;
  --g1:0 14px 32px -20px rgba(0,0,0,.85);
  --g1s:0 10px 24px -18px rgba(0,0,0,.8);
  --g2:0 24px 52px -22px rgba(0,0,0,1);
  --g3:0 30px 70px -20px rgba(0,0,0,.7);
  --glow:0 0 18px 3px rgba(255,122,69,.4);
  --kok1:#262049; --kok2:#14102c;
  --nav:color-mix(in srgb,#171530 88%,transparent);
  --scrim:rgba(2,3,12,.62);
  --c-saglik:#2dd4bf;--c-spor:#a78bfa;--c-maneviyat:#facc15;--c-gelisim:#a3e635;--c-zihin:#c4b5fd;
  --c-is:#94a3b8;--c-para:#4ade80;--c-eticaret:#22d3ee;--c-marka:#f472b6;--c-imaj:#d6a77a;
  --c-sosyal:#fb7185;--c-varlik:#a8a29e;--c-kisisel:#94a3b8;--c-beceri:#a5b4fc;
  --c-arsiv:#60a5fa;--c-gorev:#a5b4fc;
  --k-uyku:#a78bfa; --k-adim:#4ade80; --k-nabiz:#ff8a90; --k-spor:#a78bfa;
  color-scheme:dark;
}
/* ---- 1b · hazır paletler (ürün kişiselleştirmesi, Kasım 2026) ----
   html[data-palet] yalnız kisisel.js koyar (sunucu kişiselleştirmeyi açtıysa); öznitelik yoksa yukarıdaki varsayılan aynen.
   Palet zemin, çizgi, metin, vurgu ve vitrin tonunu değiştirir; alan renkleri (kimlik) ve durum renkleri sabit; Claude rengi yalnız Mono'da griye döner.
   Kontrast: --mut/--fnt ve --acc-t zemin ve kart üstünde ≥ 4,5:1; --acc-ust, --acc-dolgu üstünde ≥ 4,5:1. */
:root[data-palet="okyanus"]{
  --bg:#f0f5fa; --bg2:#e3edf7; --sf2:#f7fafd; --line:#dde7f1; --line2:#cddbea;
  --ink:#0d1b2e; --txt:#2c3e56; --mut:#4a5d77; --fnt:#56697f;
  --acc:#0ea5e9; --acc-t:#0369a1; --acc-dolgu:#0369a1; --acc-ust:#ffffff; --tint:#e0f2fe;
  --ters-sf:#0d1b2e; --secili:#0d1b2e; --odak:#0d1b2e; --kok1:#123a5e; --kok2:#0a1f38; --k-uyku:#0ea5e9;
}
:root.dark[data-palet="okyanus"]{
  --bg:#06111e; --bg2:#15283d; --sf:#0e1c2d; --sf2:#132438; --line:#1c3149; --line2:#263d58;
  --ink:#eef6ff; --txt:#c7d6e7; --mut:#9db1c8; --fnt:#8ea3bb;
  --acc:#38bdf8; --acc-t:#7dd3fc; --acc-dolgu:#38bdf8; --acc-ust:#06111e; --tint:rgba(56,189,248,.15);
  --ters-sf:#ffffff; --secili:color-mix(in srgb,#38bdf8 28%,#132438); --odak:#eef6ff; --kok1:#10324f; --kok2:#071a2c;
  --nav:color-mix(in srgb,#0e1c2d 88%,transparent); --k-uyku:#38bdf8;
}
:root[data-palet="orman"]{
  --bg:#f2f6f1; --bg2:#e5eee3; --sf2:#f9fbf8; --line:#dfe8dc; --line2:#cfdccb;
  --ink:#122319; --txt:#304537; --mut:#4c6153; --fnt:#586d5f;
  --acc:#16a34a; --acc-t:#15803d; --acc-dolgu:#15803d; --acc-ust:#ffffff; --tint:#e6f6ec;
  --ters-sf:#122319; --secili:#122319; --odak:#122319; --kok1:#1d3d2b; --kok2:#0f2418; --k-uyku:#16a34a;
}
:root.dark[data-palet="orman"]{
  --bg:#07120b; --bg2:#192a1f; --sf:#101e15; --sf2:#15261b; --line:#1e3325; --line2:#284131;
  --ink:#eef8f0; --txt:#cbe0d0; --mut:#a1b9a7; --fnt:#91aa97;
  --acc:#4ade80; --acc-t:#86efac; --acc-dolgu:#4ade80; --acc-ust:#07120b; --tint:rgba(74,222,128,.14);
  --ters-sf:#ffffff; --secili:color-mix(in srgb,#4ade80 26%,#15261b); --odak:#eef8f0; --kok1:#173826; --kok2:#0a1f14;
  --nav:color-mix(in srgb,#101e15 88%,transparent); --k-uyku:#4ade80;
}
:root[data-palet="gunbatimi"]{
  --bg:#fbf3f0; --bg2:#f5e7e2; --sf2:#fffaf9; --line:#efe0da; --line2:#e5cfc7;
  --ink:#2a1318; --txt:#4b3035; --mut:#6b4f55; --fnt:#775b61;
  --acc:#f43f5e; --acc-t:#be123c; --acc-dolgu:#be123c; --acc-ust:#ffffff; --tint:#ffe8ec;
  --ters-sf:#2a1318; --secili:#2a1318; --odak:#2a1318; --kok1:#4a1f3a; --kok2:#2a0f22; --k-uyku:#f43f5e;
}
:root.dark[data-palet="gunbatimi"]{
  --bg:#14090f; --bg2:#2d1923; --sf:#1e1018; --sf2:#25141e; --line:#38212e; --line2:#462a3a;
  --ink:#fff0f3; --txt:#e9cfd6; --mut:#c7a5af; --fnt:#b8949f;
  --acc:#fb7185; --acc-t:#fda4af; --acc-dolgu:#fb7185; --acc-ust:#14090f; --tint:rgba(251,113,133,.15);
  --ters-sf:#ffffff; --secili:color-mix(in srgb,#fb7185 28%,#25141e); --odak:#fff0f3; --kok1:#47203a; --kok2:#240d1e;
  --nav:color-mix(in srgb,#1e1018 88%,transparent); --k-uyku:#fb7185;
}
:root[data-palet="mono"]{
  --bg:#f4f4f5; --bg2:#e9e9eb; --sf2:#fafafa; --line:#e4e4e7; --line2:#d4d4d8;
  --ink:#18181b; --txt:#3f3f46; --mut:#57575f; --fnt:#65656d;
  --acc:#52525b; --acc-t:#3f3f46; --acc-dolgu:#27272a; --acc-ust:#ffffff; --tint:#ececee;
  --ters-sf:#18181b; --secili:#18181b; --odak:#18181b; --kok1:#2e2e33; --kok2:#18181b;
  --k-uyku:#71717a; --c-claude:#71717a; --claude-t:#52525b; --claude-tint:rgba(113,113,122,.13);
}
:root.dark[data-palet="mono"]{
  --bg:#0a0a0b; --bg2:#222225; --sf:#151517; --sf2:#1b1b1e; --line:#28282c; --line2:#333339;
  --ink:#f4f4f5; --txt:#d4d4d8; --mut:#a8a8b0; --fnt:#96969e;
  --acc:#d4d4d8; --acc-t:#e4e4e7; --acc-dolgu:#e4e4e7; --acc-ust:#18181b; --tint:rgba(228,228,231,.12);
  --ters-sf:#ffffff; --secili:#3a3a40; --odak:#f4f4f5; --kok1:#26262a; --kok2:#111113;
  --nav:color-mix(in srgb,#151517 88%,transparent);
  --k-uyku:#a1a1aa; --c-claude:#a1a1aa; --claude-t:#d4d4d8; --claude-tint:rgba(161,161,170,.14);
}
/* Kişiselleştir sayfasındaki palet önizlemesi (açık · koyu üçer renk: zemin, vitrin, vurgu) */
[data-palet-on="varsayilan"]{--on-a1:#f4f4fa;--on-a2:#26204c;--on-a3:#ff6a33;--on-k1:#0b0a1a;--on-k2:#171530;--on-k3:#ff7a45}
[data-palet-on="okyanus"]{--on-a1:#f0f5fa;--on-a2:#123a5e;--on-a3:#0ea5e9;--on-k1:#06111e;--on-k2:#0e1c2d;--on-k3:#38bdf8}
[data-palet-on="orman"]{--on-a1:#f2f6f1;--on-a2:#1d3d2b;--on-a3:#16a34a;--on-k1:#07120b;--on-k2:#101e15;--on-k3:#4ade80}
[data-palet-on="gunbatimi"]{--on-a1:#fbf3f0;--on-a2:#4a1f3a;--on-a3:#f43f5e;--on-k1:#14090f;--on-k2:#1e1018;--on-k3:#fb7185}
[data-palet-on="mono"]{--on-a1:#f4f4f5;--on-a2:#2e2e33;--on-a3:#52525b;--on-k1:#0a0a0b;--on-k2:#151517;--on-k3:#d4d4d8}
/* Yazı boyutu: px'le yazılmış eski kurallar dahil her şey aynı oranda büyür (zoom); düzen ölçüleri birlikte ölçeklenir */
:root[data-yazi="kucuk"] body{zoom:.92}
:root[data-yazi="buyuk"] body{zoom:1.1}
[data-alan="claude"]{--c:var(--c-claude)}
[data-alan="ibadet"]{--c:var(--c-maneviyat)}
[data-alan="firsat"]{--c:var(--c-is)}
[data-alan="finans"]{--c:var(--c-para)}
[data-alan="instagram"]{--c:var(--c-marka)}
[data-alan="beceri"]{--c:var(--c-beceri)}
[data-alan="gorev"],[data-alan="gorevler"]{--c:var(--c-gorev)}
[data-alan="rutinler"]{--c:var(--c-kisisel)}
[data-alan="arsiv"]{--c:var(--c-arsiv)}

/* ============ 2 · zemin ============ */
html{background:var(--bg)}
body{font-size:15px;min-height:100vh;background-color:var(--bg);background-attachment:fixed;background-repeat:no-repeat;
  background-image:radial-gradient(54vw 38vh at 4% -8%,color-mix(in srgb,var(--k-uyku) 13%,transparent),transparent 70%),
             radial-gradient(48vw 34vh at 99% 0%,color-mix(in srgb,var(--c-saglik) 10%,transparent),transparent 70%),
             radial-gradient(44vw 30vh at 60% 106%,color-mix(in srgb,var(--c-claude) 10%,transparent),transparent 70%)}
h1,h2,h3{text-wrap:balance}

/* emoji karoları (maketin ikon dili) */
.e{line-height:1;display:inline-block;font-style:normal;
  font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif;
  transition:transform .35s cubic-bezier(.2,1.4,.4,1)}
.e.xl{font-size:38px}.e.lg{font-size:30px}.e.md{font-size:23px}.e.sm{font-size:18px}
span.e.xl{font-size:38px}span.e.lg{font-size:30px}span.e.md{font-size:23px}span.e.sm{font-size:18px}
.ak > span.e{font-size:30px;line-height:1}.gc > span.e{font-size:38px}
.eclaude{width:1em;height:1em;display:inline-block;vertical-align:-.14em;color:var(--c-claude);fill:none}
.e.md .eclaude,.e.lg .eclaude,.e.sm .eclaude,.e.xl .eclaude{width:1em;height:1em}

/* ============ 3 · düğmeler · girdiler ============ */
.btn{height:38px;padding:0 16px;border-radius:var(--rk);background:var(--bg2);color:var(--ink);
  font-size:13.5px;font-weight:600;border:1px solid transparent;gap:8px;
  transition:transform .24s cubic-bezier(.2,1.4,.4,1),box-shadow .28s,background .25s,border-color .25s}
@media (hover:hover){.btn:hover{transform:translateY(-2px);box-shadow:var(--shs);background:var(--sf);border-color:var(--line2)}}
.btn:active{transform:scale(.96)}
.btn.ink,.btn.ana{background:var(--ink);color:var(--sf);border-color:transparent}
/* B-11: koyu temada birincil düğme düz beyaz değil; seçili tonu + ince Claude çerçevesi */
:root.dark .btn.ink,:root.dark .btn.ana{background:var(--secili);color:var(--secili-ink);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--c-claude) 45%,transparent)}
@media (hover:hover){.btn.ink:hover,.btn.ana:hover{background:var(--ink);filter:brightness(1.15);border-color:transparent;color:var(--sf)}}
@media (hover:hover){:root.dark .btn.ink:hover,:root.dark .btn.ana:hover{background:var(--secili);filter:brightness(1.15);color:var(--secili-ink)}}
.btn.soft{background:var(--bg2);border-color:transparent}
.btn.acc{background:var(--acc-dolgu);color:var(--acc-ust);border-color:transparent}
.btn.ghost,.btn.gh{background:transparent;color:var(--mut);font-weight:500;padding:0 10px}
@media (hover:hover){.btn.ghost:hover,.btn.gh:hover{background:var(--bg2);box-shadow:none;border-color:transparent}}
.btn.sm{height:32px;padding:0 12px;font-size:12.5px;border-radius:10px}
.btn.wide,.btn.tam{width:100%;justify-content:center;height:44px;border-radius:var(--rk)}
.btn.cam{background:rgba(255,255,255,.12);color:#fff;border-color:transparent}
@media (hover:hover){.btn.cam:hover{background:rgba(255,255,255,.22);border-color:transparent;color:#fff}}
.btn.bey{background:#fff;color:#16122e;border-color:transparent}
@media (hover:hover){.btn.bey:hover{background:#fff;filter:brightness(.95);border-color:transparent;color:#16122e}}
.btn.teh{background:color-mix(in srgb,var(--miss) 12%,transparent);color:var(--miss-t)}
.btn .ic{width:15px;height:15px}
.lnk{color:var(--mut);font-weight:600;text-decoration:none}
@media (hover:hover){.lnk:hover{color:var(--ink)}}
.dug{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
.acts{gap:8px}

.inp{height:40px;border-radius:var(--rk);border:1px solid var(--line);background:var(--sf);color:var(--ink);
  font-size:14px;padding:0 12px;transition:border-color .2s,box-shadow .2s}
.inp:focus{outline:none;border-color:var(--c-claude);box-shadow:0 0 0 3px color-mix(in srgb,var(--c-claude) 14%,transparent)}
textarea.inp{height:auto;padding:11px 12px;line-height:1.5;min-height:62px}
.frm{display:grid;gap:12px}
.frm label,.gl2,.uyku label{display:block;font-size:11.5px;font-weight:600;color:var(--mut);margin-bottom:5px}
.frm .ipuc,.ipuc{font-size:11px;color:var(--fnt);margin-top:4px;line-height:1.45}
.ekle{display:flex;gap:8px;padding:11px 14px;border-top:1px solid var(--line);background:var(--sf2)}
.ekle .inp{flex:1;height:38px}
.chip{height:32px;padding:0 13px;border-radius:999px;border:1px solid var(--line);background:var(--bg2);
  color:var(--mut);font-size:12.5px;font-weight:600;transition:transform .22s,opacity .22s,background-color .22s,color .22s,border-color .22s,box-shadow .22s}
@media (hover:hover){.chip:hover{background:var(--sf);color:var(--ink);border-color:var(--line2)}}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--sf);border-color:transparent}
:root.dark .chip[aria-pressed="true"]{background:var(--secili);color:var(--secili-ink);border-color:color-mix(in srgb,var(--c-claude) 45%,transparent)}

/* ============ 4 · kart · bölüm başlığı ============ */
.card,.k,.pulse,.note,.mood,.trail,.yazkutu,.izg,.m-grafikkart,.ctxk,.tl{
  background:var(--sf);border-radius:var(--r);box-shadow:var(--sh);overflow:hidden;position:relative;
  transition:transform .38s cubic-bezier(.2,.9,.3,1.04),box-shadow .38s}
@media (hover:hover){.k.hv:hover{transform:translateY(-3px);box-shadow:var(--hov)}}
.kb{padding:16px var(--a4)}
.sh,.bas{display:flex;align-items:center;gap:10px;margin:0 4px 10px}
.sh h2,.bas h2{font-size:15px;font-weight:600;color:var(--ink);letter-spacing:-.02em;text-transform:none;
  display:flex;align-items:center;gap:9px;line-height:1.25}
/* B-01: metin + <em>sayı</em> içeren başlık flex'te üç ayrı öğeye bölünüyordu ("Şu an / konuşmamız gereken | 10 | acil…") */
.sh h2:has(> em),.bas h2:has(> em){display:block}
.sh h2:has(> em) > :is(.ti,.e),.bas h2:has(> em) > :is(.ti,.e){display:inline-grid;vertical-align:middle;margin-right:8px}
.sh h2 em{color:var(--acc);font-style:normal}
.sh .m,.bas .m{margin-left:auto;font-size:11.5px;color:var(--fnt);white-space:nowrap}
.sh .m b,.bas .m b{font-weight:700;color:var(--mut)}
.sh a,.sh button.lnk,.bas .lnk,.bas a{margin-left:auto;font-size:12px;font-weight:600;color:var(--mut)}
.sh .m + a,.sh .m + button,.bas .m + a{margin-left:10px}
.bos,.m-bos{font-size:13px;color:var(--mut);line-height:1.55}
.m-bos{padding:20px 16px;text-align:center}
.sec:not(.inp){padding:22px 20px 0}
.grp,.pr-grp,.ys-g{font-size:var(--y-et);font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--mut);padding:11px 4px 5px}
.m-not,.privnote,.gnot{font-size:11.5px;color:var(--fnt);line-height:1.55}

/* ============ 5 · SIDEBAR (ray) ============ */
@media (min-width:1024px){
  .rail{width:var(--rail);padding:14px 11px 11px;background:var(--sf);border-right:1px solid var(--line);overflow:hidden}
}
.ck-panel{background:var(--sf);padding:calc(env(safe-area-inset-top) + 14px) 11px calc(env(safe-area-inset-bottom) + 11px)}   /* B-15: güvenli alan ezilmesin */
.marka{display:flex;align-items:center;gap:11px;padding:4px 6px 14px;text-decoration:none}
.marka .lg{width:36px;height:36px;flex:none;display:grid;place-items:center;border-radius:0;overflow:visible;
  transition:transform .4s cubic-bezier(.2,1.4,.4,1)}
@media (hover:hover){.marka:hover .lg{transform:rotate(-8deg) scale(1.06)}}
.marka .lg .logo{width:36px;height:36px}
.marka .ad{min-width:0;flex:1}
.marka .ad b{display:flex;align-items:center;gap:6px;font-size:15px;font-weight:500;letter-spacing:.22em;color:var(--ink);line-height:1}
.marka .ad b .os{letter-spacing:.1em;font-size:10.5px;font-weight:700;padding:3px 6px 2px;border-radius:7px;background:var(--ink);color:var(--sf)}
:root.dark .marka .ad b .os{background:var(--ters-sf);color:var(--ters-ink)}
.marka .ad span{display:block;font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--fnt);margin-top:5px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.marka .icb{margin-left:auto;background:transparent;box-shadow:none}

.yazd{position:relative;display:flex;align-items:center;gap:10px;height:46px;padding:0 8px 0 7px;border-radius:15px;
  margin-bottom:9px;overflow:hidden;width:100%;border:0;
  background:linear-gradient(135deg,#2a2350,#16122e);color:#fff;font-size:14px;font-weight:600;
  box-shadow:0 10px 22px -12px rgba(22,18,46,.8);transition:transform .28s cubic-bezier(.2,1.4,.4,1),box-shadow .3s}
:root.dark .yazd{background:linear-gradient(135deg,var(--ters-sf),color-mix(in srgb,var(--ters-sf) 86%,var(--c-claude)));color:var(--ters-ink)}
.yazd .yi{width:32px;height:32px;border-radius:11px;background:rgba(255,255,255,.15);display:grid;place-items:center;
  font-size:16px;flex:none;transition:transform .35s cubic-bezier(.2,1.5,.4,1)}
:root.dark .yazd .yi{background:rgba(22,18,46,.1)}
.yazd .rt{flex:1;min-width:0;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.yazd kbd{margin-left:auto;margin-right:6px;font:inherit;font-size:10.5px;font-weight:600;opacity:.6;background:none;border:0;padding:0}
.yazd::after{content:"";position:absolute;top:-30%;bottom:-30%;left:0;width:40%;transform:translateX(-160%) skewX(-16deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.25),transparent)}
@media (hover:hover){.yazd:hover{transform:translateY(-2px);box-shadow:0 16px 28px -12px rgba(22,18,46,.85)}}
@media (hover:hover){.yazd:hover .yi{transform:rotate(-12deg) scale(1.08)}}
@media (hover:hover){.yazd:hover::after{animation:yt-parla 1s cubic-bezier(.3,.6,.4,1)}}
@keyframes yt-parla{to{transform:translateX(330%) skewX(-16deg)}}
.yazd:active{transform:scale(.97)}

.arad{display:flex;align-items:center;gap:9px;height:36px;padding:0 11px;border-radius:var(--rk);background:var(--bg2);
  color:var(--mut);font-size:12.5px;margin-bottom:10px;border:1px solid transparent;width:100%;
  transition:border-color .25s,background .25s}
@media (hover:hover){.arad:hover{background:var(--sf2);border-color:var(--line2);color:var(--ink)}}
.arad .rt{flex:1;min-width:0;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.arad kbd{margin-left:auto;font:inherit;font-size:10.5px;color:var(--fnt);background:var(--sf);border:1px solid var(--line);border-radius:6px;padding:1px 5px}

.rl{flex:1;min-height:0;overflow-y:auto;margin:0 -3px;padding:0 3px 18px;scrollbar-width:thin;display:block;
  /* alt kenar solar: liste kesik değil, kaydırılabilir olduğu belli olsun (son öğe dolgu sayesinde tam görünür) */
  -webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 22px),transparent);mask-image:linear-gradient(to bottom,#000 calc(100% - 22px),transparent)}
.rl::-webkit-scrollbar{width:4px}
.rl::-webkit-scrollbar-thumb{background:var(--line2);border-radius:4px}
.rg{font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--mut);padding:11px 9px 4px}
.rs{display:flex;align-items:center;gap:11px;height:38px;padding:0 10px;border-radius:var(--rk);font-size:13.5px;
  color:var(--txt);position:relative;text-decoration:none;
  transition:background .2s,color .2s,transform .22s}
.rs .e{font-size:16px;width:20px;text-align:center;flex:none}
.rs .rt{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (hover:hover){.rs:hover{background:color-mix(in srgb,var(--c,var(--c-claude)) 14%,transparent);color:var(--ink);transform:translateX(3px)}}
@media (hover:hover){.rs:hover .e{transform:scale(1.14)}}
.rs.on{background:color-mix(in srgb,var(--c,var(--c-claude)) 20%,transparent);color:color-mix(in srgb,var(--c) 72%,var(--ink));font-weight:700}
.rs.on .e{transform:scale(1.1)}
.rs.on::before{content:"";position:absolute;left:-11px;top:7px;bottom:7px;width:3px;border-radius:0 3px 3px 0;background:var(--c,var(--c-claude))}
.rs kbd{margin-left:auto;font:inherit;font-size:10px;color:var(--fnt);opacity:0;transition:opacity .15s;background:none;border:0}
@media (hover:hover){.rs:hover kbd{opacity:1}}
.rs .say2{margin-left:auto;min-width:18px;height:18px;padding:0 5px;border-radius:999px;
  background:color-mix(in srgb,var(--c,var(--mut)) 15%,transparent);
  color:color-mix(in srgb,var(--c,var(--mut)) 78%,var(--ink));font-size:10px;font-weight:700;display:grid;place-items:center}
.rs.on .say2{background:color-mix(in srgb,var(--c) 30%,transparent)}
.rs .rnok{margin-left:auto;width:7px;height:7px;border-radius:50%;background:var(--c,var(--acc));flex:none}
.rs .rnok.hata{background:var(--miss)}

.ralt{border-top:1px solid var(--line);margin-top:7px;padding-top:9px;display:grid;gap:7px}
.rtur{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--mut);padding:0 8px;line-height:1.4}
.rtur i{width:6px;height:6px;border-radius:50%;background:var(--c-claude);flex:none}
@keyframes yt-nb{0%,100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--c-claude) 55%,transparent)}70%{box-shadow:0 0 0 7px transparent}}
.rdurum{display:flex;align-items:center;gap:8px;padding:0 8px;font-size:11px;color:var(--mut)}
.rdurum .rt{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rbar{display:flex;align-items:center;gap:6px}
.rkul{flex:1;min-width:0;display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:15px;text-align:left;
  text-decoration:none;background:linear-gradient(135deg,#2a2350,#16122e);color:#fff;
  box-shadow:0 10px 22px -14px rgba(22,18,46,.9);transition:transform .28s cubic-bezier(.2,1.4,.4,1),box-shadow .3s}
:root.dark .rkul{background:linear-gradient(135deg,#241f47,#151230)}
@media (hover:hover){.rkul:hover{transform:translateY(-2px);box-shadow:0 16px 28px -14px rgba(22,18,46,.95)}}
/* overflow:hidden YOK: yuvarlak kırpma noktayı dairenin içine alıyordu ve nokta
   fotoğrafın üstünde yamalı duruyordu. Kırpmayı artık img'in kendi yarıçapı yapıyor,
   nokta da kenara, dışarı taşabilecek şekilde oturuyor. */
.rkul .av{width:36px;height:36px;border-radius:50%;flex:none;position:relative;
  background:linear-gradient(150deg,var(--c-claude),var(--c-zihin));display:grid;place-items:center;
  font-size:16px;color:#fff;font-weight:700;box-shadow:0 6px 14px -8px var(--c-claude)}
.rkul .av img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}
.rkul .av i{position:absolute;right:-1px;bottom:-1px;width:10px;height:10px;border-radius:50%;
  background:var(--ok);border:2px solid #1b1638;box-sizing:content-box}
.rkul .rt{min-width:0;flex:1}
.rkul b{display:block;font-size:13px;font-weight:600;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rkul small{display:block;font-size:10.5px;color:rgba(255,255,255,.55);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rkul .git{margin-left:auto;font-size:15px;color:rgba(255,255,255,.5);flex:none}
.rbar > .icb{width:36px;height:36px;border-radius:12px;flex:none;background:var(--bg2);box-shadow:none;border:0;color:var(--mut)}
.gizli .rbar [data-gizli]{background:var(--ink);color:var(--sf)}

/* dar ray */
.rail-dar .rail .rt,.rail-dar .rail kbd,.rail-dar .rg,.rail-dar .marka .ad{display:none}
.rail-dar .marka{justify-content:center;padding:2px 0 14px}
.rail-dar .yazd,.rail-dar .arad,.rail-dar .rs{width:44px;padding:0;justify-content:center;margin-left:auto;margin-right:auto}
.rail-dar .rs .say2{position:absolute;top:2px;right:2px;min-width:15px;height:15px;padding:0 3px;font-size:9px;margin:0}
.rail-dar .rs .rnok{position:absolute;top:5px;right:5px;margin:0}
.rail-dar .rbar{flex-direction:column}
.rail-dar .rkul{flex:none;padding:5px}
.rail-dar .rkul .git{display:none}
.rail-dar .rdurum,.rail-dar .rtur{justify-content:center;padding:2px 0;text-align:center}

/* ============ 6 · ALT ÇUBUK ============ */
@media (max-width:1023px){
.nav{display:grid;grid-template-columns:repeat(5,1fr);align-items:end;
  padding:9px 6px calc(env(safe-area-inset-bottom) + 9px);
  background:var(--nav);backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);
  border-top:1px solid var(--line);box-shadow:none}
.nav a,.nav button{position:relative;display:flex;flex-direction:column;align-items:center;gap:3px;
  font-size:10.5px;font-weight:600;color:var(--mut);padding:5px 0 2px;background:none;border:0;transition:color .25s}
.nav a .e,.nav button .e{font-size:21px;transition:transform .32s cubic-bezier(.2,1.5,.4,1)}
.nav .on{color:var(--ink)}
.nav .on .e{transform:translateY(-1px) scale(1.06)}
.nav .on::before{display:none}
.nav .on::after{content:"";position:absolute;bottom:-4px;width:18px;height:3px;border-radius:3px;background:var(--acc)}
.nav a:active .e{transform:scale(.9)}
.nav .yaz{margin-top:-24px;color:var(--ink)}
.nav .yaz .fab{width:52px;height:52px;border-radius:18px;background:linear-gradient(140deg,#2a2350,#16122e);color:#fff;
  display:grid;place-items:center;box-shadow:0 14px 26px -12px rgba(22,18,46,.9),0 0 0 5px var(--bg);
  transition:transform .3s cubic-bezier(.2,1.5,.4,1)}
:root.dark .nav .yaz .fab{background:linear-gradient(140deg,var(--ters-sf),color-mix(in srgb,var(--ters-sf) 86%,var(--c-claude)));color:var(--ters-ink)}
.nav .yaz .fab .e{font-size:22px}
.nav .yaz:active .fab{transform:scale(.94)}
.nav .yaz::after{display:none}
.nav a .say2{position:absolute;top:0;right:calc(50% - 20px);min-width:16px;height:16px;padding:0 4px;border-radius:999px;
  background:var(--acc-dolgu);color:var(--acc-ust);font-size:10px;font-weight:700;display:grid;place-items:center}

}
/* ============ 7 · MOBİL ÜST ÇUBUK ============ */
@media (max-width:1023px){
.ust{display:flex;align-items:center;gap:11px;padding:calc(env(safe-area-inset-top) + 9px) 14px 9px;height:auto;min-height:0;
  background:color-mix(in srgb,var(--sf) 86%,transparent);
  backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);
  border-bottom:1px solid transparent;box-shadow:none;
  transition:transform .38s cubic-bezier(.2,.9,.3,1),border-color .3s,box-shadow .3s}
.ust.golge{border-bottom-color:var(--line);box-shadow:0 10px 24px -20px rgba(20,12,60,.6)}
.ust .icb{width:34px;height:34px;border-radius:11px;background:var(--bg2);border:0;box-shadow:none;color:var(--ink);flex:none;font-size:15px}
.ust .icb .ic{width:18px;height:18px}
.gizli .ust [data-gizli]{background:var(--ink);color:var(--sf)}
.ust-marka{display:flex;align-items:center;gap:9px;flex:1;min-width:0;height:34px}
.ust-lg{width:26px;height:26px}
.ust-ad{height:20px}
.ust-ad b,.ust-ad span{font-size:15px;font-weight:600;letter-spacing:-.01em;color:var(--ink)}

}
/* ============ 8 · sayfa üstü ============ */
.pg-hd{padding:2px 20px 0}
.ustb{display:flex;align-items:center;gap:12px;margin-bottom:13px}
.ustb > .bl{min-width:0;flex:1}
.ustb .sel{font-size:12.5px;color:var(--mut);margin:0 0 2px}
.ustb h1{margin:0;font-size:clamp(21px,5.4vw,26px);font-weight:600;letter-spacing:-.035em;color:var(--ink);line-height:1.12}
.ustb .alt3{font-size:12.5px;color:var(--mut);margin:3px 0 0;line-height:1.45}
.ustb .sag{margin-left:auto;display:flex;align-items:center;gap:8px;flex:none}
.mnu{width:42px;height:42px;border-radius:13px;background:var(--sf);box-shadow:var(--sh);display:grid;place-items:center;
  font-size:17px;flex:none;border:0}
@media (min-width:1024px){.mnu{display:none}}
.seg{display:flex;gap:2px;padding:3px;border-radius:999px;background:var(--sf);box-shadow:var(--sh)}
.seg a,.seg span,.seg button{height:32px;padding:0 14px;border-radius:999px;font-size:12.5px;font-weight:600;color:var(--mut);
  display:inline-flex;align-items:center;transition:transform .25s,opacity .25s,background-color .25s,color .25s,border-color .25s,box-shadow .25s;box-shadow:none;background:none;border:0}
.seg .on{background:var(--ink);color:var(--sf);box-shadow:none}
:root.dark .seg .on{background:var(--secili);color:var(--secili-ink)}
.icb{width:38px;height:38px;border-radius:12px;background:var(--sf);box-shadow:var(--sh);border:0;
  display:grid;place-items:center;font-size:16px;color:var(--ink);transition:transform .25s}
@media (hover:hover){.icb:hover{transform:translateY(-2px)}}
.gizli .icb.eye,.gizli .icb.goz{background:var(--ink);color:var(--sf)}
.back,.geri{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;color:var(--mut);margin-bottom:6px}
@media (hover:hover){.back:hover,.geri:hover{color:var(--ink)}}
.hava{display:flex;align-items:center;gap:7px;height:38px;padding:0 13px 0 9px;border-radius:999px;background:var(--sf);
  box-shadow:var(--sh);font-size:12px;color:var(--mut);border:0;transition:transform .25s,box-shadow .28s}
@media (hover:hover){.hava:hover{transform:translateY(-2px);box-shadow:var(--hov)}}
.hava b{font-size:15px;font-weight:600;color:var(--ink)}

/* ============ 9 · zaman barı (.vk) ============ */
.vk{background:var(--sf);border-radius:var(--r);box-shadow:var(--sh);padding:14px var(--a4) 10px;margin:0 20px 14px;
  position:relative;overflow:hidden}
.vk::after{content:"";position:absolute;right:-80px;top:-100px;width:230px;height:230px;border-radius:50%;
  background:radial-gradient(circle,color-mix(in srgb,var(--c-maneviyat) 15%,transparent),transparent 70%)}
.vk-h{display:flex;align-items:center;gap:11px;position:relative;z-index:1}
.vk-h > div{min-width:0}
.vk-h b{font-size:14.5px;font-weight:600;color:var(--ink);display:block;line-height:1.2}
.vk-h .alt2{font-size:11.5px;color:var(--mut);display:block}
.vk-h .kalan{margin-left:auto;text-align:right;line-height:1.2;flex:none}
.vk-h .kalan b{font-size:14.5px;color:var(--acch);font-variant-numeric:tabular-nums}
.vk-h .kalan span{font-size:10.5px;color:var(--fnt);display:block}
.cizgi{position:relative;height:52px;margin:16px 24px 0;z-index:1}
.cizgi .yol{position:absolute;left:0;right:0;top:5px;height:4px;border-radius:4px;background:var(--bg2);overflow:hidden}
.cizgi .yol i{position:absolute;inset:0 auto 0 0;width:0;border-radius:4px;
  background:linear-gradient(90deg,color-mix(in srgb,var(--c-maneviyat) 45%,transparent),var(--acc));
  animation:yt-dol 1.6s cubic-bezier(.2,.85,.25,1) .3s forwards}
@keyframes yt-dol{to{width:var(--w)}}
.nk{position:absolute;top:0;transform:translateX(-50%);display:grid;justify-items:center;gap:5px;width:56px}
.nk i{width:11px;height:11px;border-radius:50%;background:var(--sf);border:2.5px solid var(--line2);position:relative;z-index:2}
.nk.gecti i{background:var(--c-maneviyat);border-color:var(--c-maneviyat)}
.nk.ok i{background:var(--ok);border-color:var(--ok)}
.nk.kz i{background:var(--amb);border-color:var(--amb)}
.nk.simdi i{width:15px;height:15px;margin-top:-2px;background:var(--acc);border-color:var(--sf)}
/* Nabiz halkasi box-shadow yerine ayri bir katmanda olcekleniyor: box-shadow
   canlandirmak her karede YENIDEN BOYAMA demek ve compositor'a devredilemez.
   transform+opacity ile ayni gorunum, ana is parcacigi bos kalir. */
.nk.simdi i::after{content:"";position:absolute;inset:0;border-radius:50%;pointer-events:none;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--acc) 22%,transparent);
  animation:yt-nab 2.2s ease-in-out infinite}
@keyframes yt-nab{0%,100%{transform:scale(1);opacity:1}65%{transform:scale(1.85);opacity:0}}
.nk b{font-size:12px;font-weight:700;color:var(--mut);font-variant-numeric:tabular-nums;line-height:1}
.nk span{font-size:9.5px;color:var(--fnt);line-height:1}
.nk.gecti b{color:color-mix(in srgb,var(--c-maneviyat) 80%,var(--ink))}
.nk.simdi b{color:var(--acch)}
.nk.simdi span{color:var(--acc-t);font-weight:600}
/* 9.1 · (v0.87) Vakti girmiş ama cevabı yazılmamış namaz: içi boş altın halka ("bekliyor"), dolu halka
   (kılındı/geçti) ile karışmasın. Namazda kırmızı yok. */
.nk.bekle i{background:var(--sf);border-color:var(--c-maneviyat)}
.nk.bekle b{color:color-mix(in srgb,var(--c-maneviyat) 80%,var(--ink))}
.nk.bekle span{color:var(--mut)}
/* Gizli mod: noktalar da namaz durumunu ele vermez (eski .pd kuralıyla aynı niyet). */
.gizli .nk.ok i,.gizli .nk.kz i,.gizli .nk.bekle i,.gizli .nk.gecti i{background:var(--sf);border-color:var(--line2)}
/* 9.2 · Bar bir bağlantı (v0.87): tamamına dokununca Maneviyat açılır. Hover'da kart hafifçe kalkar,
   sağdaki ok öne çıkar; klavye odağı çerçeveyle görünür. .vk-h b genel kuralı (display:block, 14.5 px)
   alt satırdaki "cevap bekliyor" vurgusunu da yakalar, o yüzden burada geri alınıyor. */
a.vk{display:block;color:inherit;text-decoration:none;cursor:pointer;
  transition:transform .32s cubic-bezier(.2,.9,.3,1.05),box-shadow .32s}
a.vk:active{transform:scale(.99)}
a.vk:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
@media (hover:hover) and (pointer:fine){
  a.vk:hover{transform:translateY(-2px);box-shadow:var(--hov)}
  a.vk:hover .vk-ok{transform:translateX(3px);background:var(--c-maneviyat);color:#fff}
}
.vk-ok{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;flex:none;margin-left:4px;position:relative;z-index:1;
  background:color-mix(in srgb,var(--c-maneviyat) 14%,transparent);color:color-mix(in srgb,var(--c-maneviyat) 80%,var(--ink));
  transition:transform .3s cubic-bezier(.2,1.4,.4,1),background-color .3s,color .3s}
.vk-ok .ic{width:15px;height:15px;stroke-width:2.2}
.vk-h .alt2 .vk-bek{display:inline;font-size:inherit;line-height:inherit;font-weight:600;color:color-mix(in srgb,var(--c-maneviyat) 75%,var(--ink))}
/* 9.3 · (v0.87) Kılınmadı / pas: içi boş gri halka, saat soluk — "kayıt yok" (bekle) ve "kılındı" ile karışmaz; kırmızı yok. */
.nk.yok i{background:var(--sf);border-color:var(--mut)}
.nk.yok b{color:var(--fnt)}
.gizli .nk.yok i{background:var(--sf);border-color:var(--line2)}

/* ============ 9.4 · Bugün v0.87: Gündem dökümü, Claude kartı bayatlığı, tek satır kurulum, namaz karosu durumları ============ */
.gwait .gnd-dok{flex:1;min-width:0;white-space:normal;text-align:right;line-height:1.45}   /* uzun döküm sarsın, sayfayı genişletmesin */
/* Alan nabzı (v0.87): iki sütunlu ızgarada (telefon; masaüstünde Bugün'ün sağ sütunu) karo sayısı tekse sonuncusu
   yalnız kalmasın, iki sütunu kaplasın. 3-4 sütunlu Alanlar sayfasına dokunmaz. */
@media (max-width:639px){.ag > .ak:last-child:nth-child(odd){grid-column:1 / -1}}
@media (min-width:1024px) and (max-width:1599px){.bugun .ag > .ak:last-child:nth-child(odd){grid-column:1 / -1}}
.cl .cl-bayat{color:var(--mut);font-weight:600}
.cl p a{color:inherit;font-weight:600;text-underline-offset:2px}
/* İlk kurulum tek satır (eksik ≤ 3): tam kart yerine */
.kur-mini{display:flex;align-items:center;gap:4px;background:var(--sf);border-radius:var(--rs);box-shadow:var(--shs);padding:0 6px 0 0}
.kur-mini-a{flex:1;min-width:0;display:flex;align-items:center;gap:9px;padding:11px 14px;font-size:12.5px;color:var(--mut);text-decoration:none}
.kur-mini-a b{color:var(--ink);font-weight:600;font-size:13px;flex:none}
.kur-mini-a > span:not(.e){flex:1 1 0;width:0;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kur-mini-a > .ic{width:14px;height:14px;color:var(--fnt);flex:none;margin-left:auto}
.kur-mini-x{width:32px;height:32px;border-radius:50%;border:0;background:transparent;color:var(--fnt);display:grid;place-items:center;flex:none;padding:0}
.kur-mini-x .ic{width:14px;height:14px}
@media (hover:hover) and (pointer:fine){.kur-mini-a:hover b{color:var(--acch)}.kur-mini-x:hover{background:var(--bg2);color:var(--ink)}}
/* Namaz karosu: bekle = vakti çıktı, cevap yok (kesikli altın çerçeve) · yok = kılınmadı/pas (çizgi); gizli modda hepsi nötr */
.vkt-k.bekle{opacity:1;outline:1.5px dashed color-mix(in srgb,var(--c-maneviyat) 60%,transparent);outline-offset:-2px}
.vkt-k.bekle b{color:color-mix(in srgb,var(--c-maneviyat) 80%,var(--ink))}
.vkt-k.yok{opacity:1}
.vkt-k.yok b{color:var(--fnt)}
.vkt-k.yok::after{content:"–";font-size:11px;font-weight:700;color:var(--mut);line-height:1}
.gizli .vkt-k.ok,.gizli .vkt-k.kz,.gizli .vkt-k.yok,.gizli .vkt-k.bekle{background:var(--bg2);outline:0}
.gizli .vkt-k.ok b,.gizli .vkt-k.kz b,.gizli .vkt-k.yok b,.gizli .vkt-k.bekle b{color:var(--mut)}
.gizli .vkt-k.ok::after,.gizli .vkt-k.yok::after{content:none}
.vkt-alt{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:9px;font-size:12px;color:var(--mut)}
.vkt-alt .lnk{font-size:12.5px;flex:none}
/* Vitrin çubukları: "kayıt yok" kesikli boş çubuk (gmBar durum parametresi) */
.brr i.brr-bos{background:transparent;border:1px dashed rgba(255,255,255,.35);border-radius:3px}
/* Uyku karosundaki Z'ler kendi 28 px kutusunu aşıp not metninin üstüne biniyordu */
.uyg{overflow:hidden}

/* ============ 10 · KOYU VİTRİN (.kok / .hero) ============ */
.kok,.hero{position:relative;border-radius:var(--r);padding:19px;color:#fff;overflow:hidden;
  background:radial-gradient(118% 128% at 8% -12%,#342c63 0%,var(--kok1) 46%,var(--kok2) 100%);
  box-shadow:0 22px 44px -24px rgba(20,12,60,.7)}
.kok::after,.hero::after{content:"";position:absolute;right:-80px;top:-100px;width:260px;height:260px;border-radius:50%;
  background:radial-gradient(circle,color-mix(in srgb,var(--c,#7c5cff) 42%,transparent),transparent 66%);
  }
.hero::before{display:none}
@keyframes yt-yuz{to{transform:translate(-24px,18px) scale(1.15)}}
.kok-i,.hero > *{position:relative;z-index:1}
.kok .et,.hero-t{display:inline-flex;align-items:center;gap:7px;font-size:10px;font-weight:700;letter-spacing:.13em;
  text-transform:uppercase;padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.12);color:#ffc7ad!important}
.kok .et i{width:6px;height:6px;border-radius:50%;background:var(--acc)}
@keyframes yt-cik{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.28;transform:scale(.6)}}
.hero-t{display:flex;width:auto}
.hero-t .sp{margin-left:10px;color:rgba(255,255,255,.62);letter-spacing:.02em;text-transform:none;font-weight:500}
.kok h3,.hero h3{font-size:clamp(19px,4.4vw,23px);font-weight:600;letter-spacing:-.03em;line-height:1.24;
  margin:12px 0 0;color:#fff}
.kok p,.hero p{font-size:13px;color:rgba(255,255,255,.64);margin:7px 0 0 0;line-height:1.5}
.hero .acts{margin-left:0;margin-top:14px}
.hero h3 .ti,.hero .ti{background:rgba(255,255,255,.12);color:#fff}
.hero .m-yan > div{color:#fff}
.hero .m-ilerleme{background:rgba(255,255,255,.14)}
.hero .m-ilerleme i{background:#fff;opacity:.9}
.hero .chip{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.1);color:rgba(255,255,255,.7)}
.hero .chip[aria-pressed="true"]{background:#fff;color:#16122e;border-color:#fff}
.hero .lnk{color:rgba(255,255,255,.8)}
.hero .btn{background:rgba(255,255,255,.12);color:#fff;border-color:transparent}
@media (hover:hover){.hero .btn:hover{background:rgba(255,255,255,.22);color:#fff}}
.hero .btn.ink,.hero .btn.ana{background:#fff;color:#16122e}
@media (hover:hover){.hero .btn.ink:hover,.hero .btn.ana:hover{background:#fff;filter:brightness(.95);color:#16122e}}
.hero .hero-n > span{background:rgba(255,255,255,.08);color:rgba(255,255,255,.8);box-shadow:none}
.hero .hero-n time{color:rgba(255,255,255,.55)}
.kok .msk{position:absolute;right:14px;top:8px;width:96px;height:152px;object-fit:cover;object-position:top center;
  mask-image:linear-gradient(180deg,#000 76%,transparent);-webkit-mask-image:linear-gradient(180deg,#000 76%,transparent);
  z-index:1;pointer-events:none}
@media (max-width:599px){.kok .msk{display:none}}
@keyframes yt-suz{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@media (min-width:600px){.kok.maskotlu .kok-i > *{max-width:calc(100% - 118px)}}
.kok .blok{display:grid;gap:7px;margin-top:14px;position:relative;z-index:1}
.kok .blok div{display:flex;align-items:center;gap:11px;font-size:13.5px;color:rgba(255,255,255,.84);
  background:rgba(255,255,255,.07);border-radius:var(--rk);padding:9px 12px}
.kok .blok time{font-size:12.5px;color:rgba(255,255,255,.55);font-variant-numeric:tabular-nums;width:44px;flex:none}
.kok-alt{margin-top:13px;font-size:11.5px;color:rgba(255,255,255,.5);position:relative;z-index:1}
/* .lnk2 <button> olarak basiliyor ama tarayicinin varsayilan dugme gorunumunu
   hic sifirlamiyordu: zemin rgb(240,240,240), kenar 2px outset, yazi ise beyaz —
   koyu vitrinde acik gri kutu uzerinde beyaz yazi, yani okunmuyordu. */
.lnk2{appearance:none;-webkit-appearance:none;background:none;border:0;padding:0;margin:0;
  font:inherit;font-size:11.5px;font-weight:600;color:rgba(255,255,255,.8);cursor:pointer;
  text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
@media (hover:hover) and (pointer:fine){.lnk2:hover{color:#fff}}

/* canlı ölçüm karoları */
.canli{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin-top:17px;position:relative;z-index:1}
@media (min-width:640px){.canli{grid-template-columns:repeat(4,1fr)}}
/* İş: talep hattı yoksa üç kutu (telefonda üçüncüsü tam satır) */
.canli.is-uc>:last-child{grid-column:1/-1}
/* Ayarlar → Hizmet: koç kipine geçiş adımları */
.ay-hz-ol{margin:6px 0 0;padding-left:20px;display:grid;gap:5px;font-size:13.5px;line-height:1.45;color:var(--mut)}
/* Karşılama: kurulumda açılan alanlar */
.hg-acik{display:flex;flex-wrap:wrap;gap:7px;padding:14px 16px}
.hg-acik .chip{display:inline-flex;align-items:center;gap:6px;color:var(--ink)}
@media (min-width:640px){.canli.is-uc{grid-template-columns:repeat(3,1fr)}.canli.is-uc>:last-child{grid-column:auto}}
/* [ürün] Sağlık kapalı üye: iki karo (enerji · ruh hâli) masaüstünde de iki eşit sütun */
@media (min-width:640px){.canli.is-iki{grid-template-columns:repeat(2,1fr)}}
/* [ürün] Plan: kapalı alanlardaki görevlerin sayısı (görev listesinin altında, küçük) */
.gm-kapali-not{margin:8px 4px 0;font-size:var(--y-kucuk);color:var(--mut)}
.cn{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.08);border-radius:var(--rs);padding:12px;
  text-align:left;width:100%;position:relative;color:#fff;
  transition:background .3s,transform .34s cubic-bezier(.2,.9,.3,1.05),box-shadow .3s}
@media (hover:hover){button.cn:hover{background:rgba(255,255,255,.14);transform:translateY(-3px);box-shadow:0 16px 30px -18px #000}}
button.cn:active{transform:scale(.97)}
button.cn::after{content:"›";position:absolute;right:11px;top:10px;font-size:15px;color:rgba(255,255,255,.35);transition:transform .3s,color .3s}
@media (hover:hover){button.cn:hover::after{transform:translateX(3px);color:rgba(255,255,255,.7)}}
.cn .ct{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.cn .ad2{font-size:9.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:rgba(255,255,255,.48)}
.cn .sy2{font-size:22px;font-weight:700;letter-spacing:-.04em;color:#fff;font-variant-numeric:tabular-nums;line-height:1.05}
.cn .sy2 small{font-size:11px;font-weight:600;color:rgba(255,255,255,.68);margin-left:2px}
.cn .nt2{font-size:10.5px;color:rgba(255,255,255,.66);margin-top:3px;line-height:1.35}
.cn .gor2{margin-top:10px;height:28px}
.uyg{position:relative;height:28px}
.uyg .ay{position:absolute;left:0;bottom:-2px;font-size:22px;transform:rotate(-8deg)}
@keyframes yt-ayy{0%,100%{transform:rotate(-8deg)}50%{transform:rotate(8deg)}}
.zz{position:absolute;font-weight:700;color:#c4b5fd;opacity:.6}
.zz.z1{left:22px;bottom:8px;font-size:11px}
.zz.z2{left:31px;bottom:14px;font-size:14px;animation-delay:1.3s}
.zz.z3{left:42px;bottom:3px;font-size:9px;animation-delay:2.5s}
@keyframes yt-zz{0%{opacity:0;transform:translate(0,0) scale(.6)}25%{opacity:1}100%{opacity:0;transform:translate(13px,-22px) scale(1.2)}}
.brr{display:flex;align-items:flex-end;gap:3px;height:28px}
.brr i{flex:1;height:100%;border-radius:3px;background:rgba(255,255,255,.14);transform-origin:bottom;transform:scaleY(.12);
  animation:yt-cik2 .85s cubic-bezier(.2,1.45,.4,1) forwards}
.brr i.v{background:linear-gradient(180deg,var(--kr,#a78bfa),color-mix(in srgb,var(--kr,#a78bfa) 40%,transparent))}
.brr i.bg{background:linear-gradient(180deg,#fff,rgba(255,255,255,.45))}
@keyframes yt-cik2{to{transform:scaleY(var(--h,1))}}
.ekg{width:100%;height:28px;overflow:visible}
.ekg path{stroke:#ff9aa0;stroke-width:2.2;fill:none;stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:170;stroke-dashoffset:170;animation:yt-ciz 1.4s ease-out 1 forwards}
@keyframes yt-ciz{to{stroke-dashoffset:0}}

/* ============ 11 · GÜNDEM KARTI (.gc) ============ */
.gc{display:grid;grid-template-columns:auto 1fr;gap:14px;padding:16px;border-radius:var(--rs);background:var(--sf);
  box-shadow:var(--sh);transition:transform .38s cubic-bezier(.2,.9,.3,1.04),box-shadow .38s}
@media (hover:hover){.gc:hover{transform:translateY(-3px);box-shadow:var(--hov)}}
.gc + .gc{margin-top:var(--a3)}
.gc > .e{align-self:start}
.gc-t{display:flex;align-items:center;gap:8px;margin-bottom:7px;flex-wrap:wrap}
.gc-t .kn,.gc-t .stamp{margin-left:auto;font-size:11px;color:var(--fnt);white-space:nowrap}
.gc h3{font-size:15.5px;font-weight:600;color:var(--ink);line-height:1.38;letter-spacing:-.015em;margin:0}
.gc .nd,.gc .why{margin-top:5px;font-size:12.5px;color:var(--mut);line-height:1.45}
.gc .nd i,.gc .why .k{font-style:normal;color:var(--fnt)}
.tag,.rz{font-size:9.5px;font-weight:700;letter-spacing:.1em;padding:4px 9px;border-radius:8px;background:var(--bg2);color:var(--mut);line-height:1.2}
.tag.acil,.rz.acil{background:var(--tint);color:var(--acch)}
/* Kart kapanışı iki aşamalı ve İKİNCİ aşama kısa tutuluyor.
   Eskiden 0,46 sn boyunca max-height + margin + padding + border birlikte
   oynuyordu; bunların hepsi yeniden yerleşim tetikliyor, telefonda her karede
   sayfanın tamamı yeniden hesaplanıyor ve kapanış "tekliyor" görünüyordu.
   Şimdi: 0-55% yalnız opacity + transform (yerleşim yok, GPU'da akar),
   55-100% yalnız yükseklik kapanır. Dolgu/kenarlık animasyonla değil, tek
   adımda sıfırlanır. contain: kapanan kartın yeniden yerleşimi kendi içinde kalır. */
.gc.kapan{animation:yt-kapan .34s cubic-bezier(.33,0,.15,1) forwards;overflow:hidden;
  will-change:opacity,transform;pointer-events:none;contain:layout paint}
@keyframes yt-kapan{
  0%{opacity:1;transform:none;max-height:var(--gc-h,640px)}
  55%{opacity:0;transform:translateX(10px) scale(.99);max-height:var(--gc-h,640px)}
  55.01%{padding-top:0;padding-bottom:0;border-width:0}
  100%{opacity:0;transform:translateX(10px) scale(.99);max-height:0;
       margin-top:-10px;padding-top:0;padding-bottom:0;border-width:0}}
.alan-dikkat .gc{border-left:3px solid var(--miss)}
.gwait{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:13px 4px 0;font-size:12px;color:var(--mut)}
.gwait a,.gwait button{color:var(--ink);font-weight:600}

/* ============ 12 · rutin blokları ============ */
.rt-b{padding:15px var(--a4)}
.rt-b + .rt-b{border-top:1px solid var(--line)}
.rt-h{display:flex;align-items:center;gap:12px}
.rt-h > div{min-width:0;flex:1}
.rt-h b{display:block;font-size:14.5px;font-weight:600;color:var(--ink);line-height:1.2}
.rt-h .alt2{display:block;font-size:11.5px;color:var(--mut)}
.rt-h .btn,.rt-h .tik,.rt-h .rt-sy{margin-left:auto;flex:none}
.rt-sy{font-size:17px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
.rt-sy small{font-size:11px;font-weight:600;color:var(--mut)}
.tik{font-size:11.5px;font-weight:700;color:var(--ok);background:color-mix(in srgb,var(--ok) 13%,transparent);
  padding:6px 12px;border-radius:999px;white-space:nowrap}
.rt-b.bitti .rt-h b{color:var(--mut)}
.vkt{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin-top:12px}
.vkt-k{padding:9px 3px 8px;border-radius:13px;background:var(--bg2);display:grid;gap:3px;justify-items:center;border:0;
  transition:transform .28s cubic-bezier(.2,1.4,.4,1),background .25s,box-shadow .3s}
.vkt-k b{font-size:12.5px;font-weight:700;color:var(--mut);font-variant-numeric:tabular-nums;line-height:1}
.vkt-k span{font-size:9.5px;color:var(--fnt);line-height:1}
@media (hover:hover){.vkt-k:hover{transform:translateY(-3px);box-shadow:var(--shs)}}
.vkt-k.gecti{opacity:.6}
.vkt-k.ok{background:color-mix(in srgb,var(--ok) 15%,transparent);opacity:1}
.vkt-k.ok b{color:color-mix(in srgb,var(--ok) 82%,var(--ink))}
.vkt-k.ok::after{content:"\2713";font-size:10px;font-weight:700;color:var(--ok);line-height:1}
.vkt-k.kz{background:color-mix(in srgb,var(--amb) 15%,transparent);opacity:1}
.vkt-k.kz b{color:color-mix(in srgb,var(--amb) 85%,var(--ink))}
.vkt-k.simdi{background:var(--tint);box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--acc) 42%,transparent);opacity:1}
.vkt-k.simdi b{color:var(--acch)}
.vkt-k.simdi span{color:var(--acc-t);font-weight:600}
.cpl{display:flex;gap:8px;margin-top:11px;flex-wrap:wrap}
.cp{display:inline-flex;align-items:center;gap:9px;height:40px;padding:0 15px 0 12px;border-radius:13px;background:var(--bg2);
  font-size:13.5px;font-weight:600;color:var(--ink);border:0;
  transition:transform .26s cubic-bezier(.2,1.4,.4,1),background .25s,box-shadow .3s}
.cp i{width:20px;height:20px;border-radius:50%;border:1.6px solid var(--line2);display:grid;place-items:center;font-size:10px;
  font-style:normal;color:transparent;transition:transform .3s cubic-bezier(.2,1.5,.4,1),opacity .3s cubic-bezier(.2,1.5,.4,1),background-color .3s cubic-bezier(.2,1.5,.4,1),color .3s cubic-bezier(.2,1.5,.4,1),border-color .3s cubic-bezier(.2,1.5,.4,1),box-shadow .3s cubic-bezier(.2,1.5,.4,1);flex:none}
@media (hover:hover){.cp:hover{transform:translateY(-3px);box-shadow:var(--shs)}}
.cp.ok{background:color-mix(in srgb,var(--ok) 14%,transparent)}
.cp.ok i{background:var(--ok);border-color:var(--ok);color:#fff;transform:scale(1.08)}
.cp.kz{background:color-mix(in srgb,var(--amb) 14%,transparent)}
.cp.kz i{background:var(--amb);border-color:var(--amb);color:#fff}
.cp .zm2{font-size:11px;font-weight:500;color:var(--mut)}
.su-c{height:11px;border-radius:999px;background:var(--bg2);margin-top:11px;overflow:hidden;position:relative}
.su-c i{position:absolute;inset:0 auto 0 0;width:var(--w,0%);border-radius:999px;
  background:linear-gradient(90deg,#5fd4e4,#0e9aa8);transition:width .9s cubic-bezier(.2,1.15,.3,1)}
/* Su ölçü düğmeleri: ÜÇÜ EŞİT, tek satır. Eskiden flex-wrap'ti; 375 px'te
   "+0,25" ve "+0,5" yan yana sığıyor, "+1,5" tek başına alt satıra düşüp iki katı
   genişlikte duruyordu ve "kalan 2 L" yanına sıkışıp sarıyordu. */
.su-a{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:10px}
/* İkinci satır: geri al solda, kalan sağda. Ölçü ızgarasına karışmıyorlar. */
.su-n{display:flex;align-items:center;gap:10px;margin-top:8px}
.su-n .nt3,.su-a .nt3{font-size:11.5px;color:var(--mut);margin-left:auto}

/* ============ 13 · liste satırı (.sat) ============ */
.sat{display:flex;align-items:center;gap:12px;padding:12px var(--a4);transition:background .22s;width:100%;
  text-align:left;background:none;border:0;color:inherit}
.sat + .sat{border-top:1px solid var(--line)}
@media (hover:hover){.sat:hover{background:var(--sf2)}}
.hal{width:21px;height:21px;border-radius:50%;border:1.7px solid var(--line2);flex:none;display:grid;place-items:center;
  font-size:10px;color:transparent;transition:transform .3s cubic-bezier(.2,1.5,.4,1),opacity .3s cubic-bezier(.2,1.5,.4,1),background-color .3s cubic-bezier(.2,1.5,.4,1),color .3s cubic-bezier(.2,1.5,.4,1),border-color .3s cubic-bezier(.2,1.5,.4,1),box-shadow .3s cubic-bezier(.2,1.5,.4,1)}
@media (hover:hover){.sat:hover .hal{border-color:var(--c-gorev)}}
.sat.ok .hal{background:var(--ok);border-color:var(--ok);color:#fff}
.sat.ok .gv b{color:var(--mut);text-decoration:line-through;text-decoration-color:var(--line2)}
.gv{flex:1;min-width:0}
.gv b{display:block;font-weight:600;font-size:14px;color:var(--ink);line-height:1.3}
.gv span{display:block;font-size:11.5px;color:var(--mut)}
.gv .ert{color:var(--amb);font-weight:600}
.gv .gec{color:var(--miss);font-weight:600}
.git2{font-size:16px;color:var(--fnt);transition:transform .25s}
@media (hover:hover){.sat:hover .git2{transform:translateX(3px);color:var(--mut)}}
.sag3{flex:none;display:flex;align-items:center;gap:7px;flex-wrap:wrap;justify-content:flex-end}
.sat .hd-t,.odm .hd-t,.hrk .hd-t,.bcr .hd-t,.kmb .hd-t,.ktp .hd-t,.tkp2 .hd-t,.isl .hd-t,.rtn .hd-t{
  display:grid;gap:2px;margin-bottom:0;flex:1;min-width:0}
.sat .hd-t b{font-size:13.5px;line-height:1.35;font-weight:600;color:var(--ink)}
.sat .hd-t span{font-size:11.5px;color:var(--mut);line-height:1.45}

/* hedef satırı (.hd) */
.hd{padding:13px var(--a4)}
.hd + .hd{border-top:1px solid var(--line)}
.hd-t{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:7px}
.hd-t b{font-size:14px;font-weight:600;color:var(--ink)}
.hd-t i{font-style:normal;font-size:12.5px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
/* Eşik hedefi (hedef ≤X) yüzde göstermez; sağ üstte durum sözcüğü durur.
   "veri az" yüzde kadar güçlü okunmasın diye soluk, "tutuldu" yeşil. */
.hd-t i.ok,.hdf-top span.ok{color:var(--ok)}
.hd-t i.az,.hdf-top span.az{color:var(--mut);font-weight:600}
.cb,.m-ilerleme{height:9px;border-radius:999px;background:var(--bg2);overflow:hidden;position:relative}
.cb i{position:absolute;inset:0 auto 0 0;width:0;border-radius:999px;
  animation:yt-dol 1.5s cubic-bezier(.2,.9,.3,1) .4s forwards;
  background:linear-gradient(90deg,color-mix(in srgb,var(--c,var(--ink)) 50%,#fff),var(--c,var(--ink)))}
.m-ilerleme i{border-radius:999px;background:var(--c,var(--ink));opacity:.85}
.m-ilerleme.ok i{background:var(--ok);opacity:1}
.m-ilerleme.vurgu i{background:var(--acc);opacity:1}
.hd p{margin-top:6px;font-size:11.5px;color:var(--mut);display:flex;justify-content:space-between;gap:10px}

/* iz ve karar satırları */
.izr,.tr{display:grid;grid-template-columns:46px 1fr auto;gap:10px;align-items:center;padding:8px 0;font-size:13px}
.izr + .izr,.tr + .tr{border-top:1px solid var(--line)}
.izr time,.tr time{font-size:12px;color:var(--fnt);font-variant-numeric:tabular-nums}
.izr .kay,.src{font-size:10px;color:var(--fnt);background:var(--bg2);border-radius:6px;padding:2px 7px;white-space:nowrap}
.krr{display:grid;grid-template-columns:46px 1fr auto;gap:10px;align-items:center;padding:9px 0;font-size:12.5px;color:var(--txt)}
.krr + .krr{border-top:1px solid var(--line)}
.krr time{font-size:11.5px;color:var(--fnt);font-variant-numeric:tabular-nums}
.krr button{font-size:11.5px;font-weight:600;color:var(--mut);background:none;border:0}
@media (hover:hover){.krr button:hover{color:var(--ink)}}
.trail{padding:4px 16px 10px}
.tb{display:flex;justify-content:space-between;align-items:baseline;padding:11px 0 6px;font-size:12px;color:var(--mut)}
.tb b{font-weight:600;color:var(--ink)}

/* ============ 14 · alan karoları ============ */
.ag{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
@media (min-width:640px){.ag{grid-template-columns:repeat(3,minmax(0,1fr))}}
.ak{position:relative;display:grid;gap:2px;padding:15px 14px 14px;border-radius:var(--rs);background:var(--sf);
  box-shadow:var(--sh);overflow:hidden;text-decoration:none;
  transition:transform .42s cubic-bezier(.2,.9,.3,1.05),box-shadow .42s,background .42s}
.ak::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--c);
  transform:scaleX(0);transform-origin:left;transition:transform .45s cubic-bezier(.2,.9,.3,1)}
.ak::after{content:"";position:absolute;right:-42px;bottom:-52px;width:138px;height:138px;border-radius:50%;
  background:radial-gradient(circle,color-mix(in srgb,var(--c) 22%,transparent),transparent 68%);opacity:.5;
  transition:transform .6s cubic-bezier(.2,.9,.3,1),opacity .45s}
.ak .git3{position:absolute;right:13px;bottom:12px;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;
  font-size:13px;background:color-mix(in srgb,var(--c) 14%,transparent);color:color-mix(in srgb,var(--c) 80%,var(--ink));
  opacity:0;transform:translateX(-6px) scale(.8);transition:transform .4s cubic-bezier(.2,1.4,.4,1),opacity .4s cubic-bezier(.2,1.4,.4,1),background-color .4s cubic-bezier(.2,1.4,.4,1),color .4s cubic-bezier(.2,1.4,.4,1),border-color .4s cubic-bezier(.2,1.4,.4,1),box-shadow .4s cubic-bezier(.2,1.4,.4,1)}
@media (hover:hover){.ak:hover{transform:translateY(-4px);
  box-shadow:0 2px 6px rgba(28,20,70,.06),0 28px 50px -24px color-mix(in srgb,var(--c) 55%,rgba(28,20,70,.4))}}
@media (hover:hover){.ak:hover::before{transform:scaleX(1)}}
@media (hover:hover){.ak:hover::after{transform:scale(1.35) translate(-6px,-6px);opacity:.85}}
@media (hover:hover){.ak:hover .git3{opacity:1;transform:none}}
@media (hover:hover){.ak:hover .e{transform:translateY(-2px) scale(1.06)}}
@media (hover:hover){.ak:hover b{color:color-mix(in srgb,var(--c) 70%,var(--ink))}}
.ak > .e{margin-bottom:8px;transition:transform .4s cubic-bezier(.2,.8,.3,1)}
.ak b{font-size:13.5px;font-weight:600;color:var(--ink);position:relative;z-index:1;transition:color .35s;display:flex;align-items:center;gap:5px}
.ak b .ic{width:12px;height:12px;color:var(--fnt)}
.ak > span:not(.e):not(.git3){font-size:11px;color:var(--mut);position:relative;z-index:1;line-height:1.4}
.ak .mk,.ak .say2{position:absolute;top:12px;right:12px;min-width:19px;height:19px;padding:0 6px;border-radius:999px;
  background:color-mix(in srgb,var(--c) 90%,#000);color:#fff;font-size:10px;font-weight:700;display:grid;place-items:center}
.ak.pasif,.ak.durak{opacity:.55}
.alan-ag{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}   /* B-05: telefonda 2 sütun (230 px'te tek sütuna düşüyordu) */
.alan-ag .ak{background:linear-gradient(160deg,color-mix(in srgb,var(--c) 11%,var(--sf)),var(--sf) 72%)}
.alan-ag .ak b{font-size:15.5px;letter-spacing:-.02em}
.alan-ag .ak > span:not(.e):not(.git3){font-size:12px}
.alan-ag .ak > .e{font-size:32px;margin-bottom:10px}
@media (min-width:900px){.alan-ag{grid-template-columns:repeat(3,1fr);gap:13px}
  .alan-ag .ak{padding:18px 17px 17px;min-height:138px}}
@media (min-width:1400px){.alan-ag{grid-template-columns:repeat(4,1fr)}}
/* hedef karoları */
.hg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.hk{background:var(--sf);border-radius:var(--rs);box-shadow:var(--sh);padding:13px;display:flex;align-items:center;gap:12px}
.hk b{font-size:13.5px;font-weight:600}

/* alanlar üst özeti */
.oz{display:none}
@media (min-width:900px){
  .oz{display:flex;gap:22px;align-items:center;border-radius:var(--r);padding:18px 22px;color:#fff;position:relative;overflow:hidden;
    background:radial-gradient(110% 130% at 10% -20%,#332a55 0%,#241d42 45%,#14102b 100%);
    box-shadow:0 22px 44px -26px rgba(20,12,60,.7)}
  .oz::after{content:"";position:absolute;right:-60px;top:-80px;width:220px;height:220px;border-radius:50%;
    background:radial-gradient(circle,color-mix(in srgb,var(--c-claude) 45%,transparent),transparent 68%)}
}
.oz .sol2{position:relative;z-index:1;flex:1;min-width:0}
.oz .sol2 b{display:block;font-size:17px;font-weight:600;letter-spacing:-.02em}
.oz .sol2 span{font-size:12.5px;color:rgba(255,255,255,.6);margin-top:4px;display:block;line-height:1.45}
.oz .kt{position:relative;z-index:1;text-align:right;flex:none}
.oz .kt b{display:block;font-size:24px;font-weight:700;letter-spacing:-.03em;font-variant-numeric:tabular-nums;line-height:1}
.oz .kt span{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.5)}
.oz .ayr{position:relative;z-index:1;width:1px;height:38px;background:rgba(255,255,255,.14);flex:none}

/* ============ 15 · Claude · söz · içgörü · sistem ============ */
.cl{border-radius:var(--r);padding:17px var(--a4);box-shadow:var(--sh);margin-top:0;
  background:linear-gradient(150deg,color-mix(in srgb,var(--c-claude) 13%,transparent),var(--sf) 62%)}
.cl-h{display:flex;align-items:center;gap:11px;margin-bottom:10px;font-size:14.5px;font-weight:600;color:var(--ink);text-transform:none;letter-spacing:0}
.cl-h b{font-size:14.5px;font-weight:600;color:var(--ink)}
.cl-h .zm{margin-left:auto;font-size:11px;color:var(--fnt);font-weight:500}
.cl p{font-size:13.5px;line-height:1.55;color:var(--ink);white-space:pre-line}
.cl-bos{font-size:12.5px;color:var(--mut)}
.tur{display:flex;gap:6px;margin-top:12px;flex-wrap:wrap}
.tur span{font-size:10.5px;color:var(--mut);background:var(--bg2);border-radius:999px;padding:5px 11px;font-variant-numeric:tabular-nums}
.tur span.ilk{background:color-mix(in srgb,var(--c-claude) 15%,transparent);color:var(--c-claude);font-weight:700}
.soz{position:relative;border-radius:var(--r);padding:17px 46px 17px 20px;box-shadow:var(--sh);font-size:13.5px;line-height:1.6;
  color:var(--ink);font-weight:300;margin:0 20px 4px;
  background:linear-gradient(105deg,color-mix(in srgb,var(--ok) 13%,var(--sf)),var(--sf) 62%);
  border-left:4px solid color-mix(in srgb,var(--ok) 65%,transparent)}
.soz::before{display:none}
.soz p{font-size:13.5px;font-weight:300;color:var(--ink)}
.soz small{display:block;margin-top:7px;font-size:11px;font-weight:600;color:var(--fnt)}
.soz .icb{position:absolute;top:12px;right:12px;width:28px;height:28px;border-radius:50%;background:var(--bg2);
  box-shadow:none;color:var(--fnt);transition:background .25s,transform .3s,color .25s}
@media (hover:hover){.soz .icb:hover{background:var(--ink);color:var(--sf);transform:rotate(90deg)}}
.ins,.ing{display:grid;grid-template-columns:auto 1fr;gap:6px 12px;padding:16px var(--a4);font-size:13px;line-height:1.5;margin:0;
  background:var(--sf);border-radius:var(--r);box-shadow:var(--sh)}
.ins .il,.ing .il{font-size:9.5px;font-weight:700;letter-spacing:.13em;color:var(--mut);padding-top:3px}
.ins .is,.ing .is{grid-column:2;font-size:11px;color:var(--fnt)}
.sys{display:flex;gap:9px;font-size:11px;color:var(--fnt);padding:2px 8px;line-height:1.5;margin:20px 22px 0}
.sys i,.gdot{width:6px;height:6px;border-radius:50%;background:var(--ok);margin-top:5px;flex:none}
.gdot.off{background:var(--miss)}

/* ilk kurulum */
.kur{padding:15px var(--a4)}
.kur-h{display:flex;align-items:center;gap:11px;margin-bottom:11px}
.kur-h > div{flex:1;min-width:0}
.kur-h b{font-size:14.5px;font-weight:600;color:var(--ink);display:block}
.kur-h .alt2{font-size:11.5px;color:var(--mut);display:block}
.kur-h .yuz{margin-left:auto;font-size:13px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
.kur-c{height:7px;border-radius:999px;background:var(--bg2);overflow:hidden;position:relative;margin-bottom:12px}
.kur-c i{position:absolute;inset:0 auto 0 0;width:0;border-radius:999px;
  background:linear-gradient(90deg,var(--c-claude),var(--c-gelisim));animation:yt-dol 1.5s cubic-bezier(.2,.9,.3,1) .4s forwards}
.kur-l{display:grid;gap:7px}
.kur-s{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:var(--rk);background:var(--bg2);font-size:13px;
  color:var(--txt);transition:background .25s,transform .25s;width:100%;text-align:left;text-decoration:none;border:0}
@media (hover:hover){.kur-s:hover{background:var(--sf2);transform:translateX(3px)}}
.kur-s .no{width:20px;height:20px;border-radius:50%;border:1.6px dashed var(--line2);flex:none;display:grid;place-items:center}
.kur-s.ok .no{background:var(--ok);border:0;color:#fff}
.kur-s > div{flex:1;min-width:0}
.kur-s b{font-weight:600;color:var(--ink);font-size:13.5px;display:block}
.kur-s span{display:block;font-size:11px;color:var(--mut)}
.kur-s .git{margin-left:auto;font-size:15px;color:var(--fnt);flex:none}

/* ============ 16 · PLAN · zaman cetveli ============ */
.tl{padding:6px 0 10px;background:var(--sf);border-radius:var(--r);box-shadow:var(--sh)}
.tl > * + *{border-top:0}
.tl-r{display:grid;grid-template-columns:62px minmax(0,1fr);gap:13px;padding:0 18px;position:relative;align-items:start}
.tl-r .zm,.tl-r .tl-t{font-size:15.5px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums;
  padding-top:18px;text-align:right;letter-spacing:-.02em}
.tl-r .zm small,.tl-r .tl-t small{display:block;font-size:11px;font-weight:600;color:var(--fnt);margin-top:1px;letter-spacing:0}
.tl-k{position:relative;margin:5px 0;padding:12px 14px;border-radius:var(--rs);background:var(--sf2);border:1px solid var(--line);
  display:flex;align-items:flex-start;gap:11px;
  transition:transform .3s cubic-bezier(.2,.9,.3,1.04),box-shadow .3s,border-color .3s}
@media (hover:hover){.tl-k:hover{transform:translateX(3px);box-shadow:var(--shs);border-color:color-mix(in srgb,var(--c) 40%,transparent)}}
.tl-k::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:3px;border-radius:0 3px 3px 0;background:var(--c);opacity:.65}
.tl-k > .bl{flex:1;min-width:0}
.tl-k b{display:block;font-size:14px;font-weight:600;color:var(--ink);line-height:1.3}
.tl-k span,.tl-k p{font-size:11.5px;color:var(--mut);margin:2px 0 0;line-height:1.45}
.tl-k .tur{display:block;font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--c,var(--fnt));margin:0 0 3px}
.tl-k .sag2,.tl-k .tl-a{margin-left:auto;display:flex;align-items:center;gap:6px;flex:none}
.tl-k.yapildi,.tl-k.bitti{background:color-mix(in srgb,var(--ok) 7%,var(--sf));border-color:color-mix(in srgb,var(--ok) 28%,transparent)}
.tl-k.yapildi::before,.tl-k.bitti::before{background:var(--ok);opacity:1}
.tl-k.yapildi b,.tl-k.bitti b{color:var(--mut)}
.tl-k.simdi{background:var(--tint);border-color:color-mix(in srgb,var(--acc) 40%,transparent)}
.tl-k.simdi::before{background:var(--acc);opacity:1}
.tl-k.simdi .tur{color:var(--acch)}
.tl-k.kaydi b{color:var(--fnt);text-decoration:line-through;text-decoration-color:var(--line2)}
.tl-k.vakit{background:transparent;border-style:dashed}
.tl .tl-now,.tl-now{display:grid;grid-template-columns:62px 1fr;gap:13px;padding:0 18px;align-items:center;margin:5px 0;background:none}
.tl-now time{font-size:13px;font-weight:700;color:var(--acch);text-align:right;font-variant-numeric:tabular-nums}
.tl-now i{height:2px;border-radius:2px;background:var(--acc);position:relative;box-shadow:none}
.tl-now i::before{content:"";position:absolute;left:-4px;top:-3px;width:8px;height:8px;border-radius:50%;background:var(--acc);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--acc) 22%,transparent)}
.tl-v{display:grid;grid-template-columns:62px 1fr;gap:13px;padding:7px var(--a4);font-size:12px;color:var(--mut)}
.tl-v time{font-variant-numeric:tabular-nums;color:var(--fnt);text-align:right}
.tl-ok{width:26px;height:26px;border-radius:50%;background:var(--ok);color:#fff;display:grid;place-items:center;flex:none}
.tl-ok .ic{width:14px;height:14px;stroke-width:2.6}
.tl-kat{display:flex;align-items:center;gap:6px;width:100%;padding:9px var(--a4);background:none;border:0;
  font-size:12px;font-weight:600;color:var(--mut)}
.tl-kat .ic{width:14px;height:14px;transform:rotate(90deg)}
.tl-sec{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.esnek,.nxt{background:var(--sf2);border-top:1px solid var(--line);padding:13px var(--a4)}
.esnek .lbl,.nxt .lbl{font-size:10px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--fnt);margin-bottom:9px}
.esnek .es,.tl-e{display:flex;align-items:center;gap:11px;padding:9px 0;border:0}
.esnek .es + .es,.tl-e + .tl-e{border-top:1px solid var(--line)}
.esnek .es > .bl,.tl-e .tl-b{flex:1;min-width:0}
.esnek .es b,.tl-e b{display:block;font-size:13.5px;font-weight:600;color:var(--ink)}
.esnek .es span,.tl-e p{display:block;font-size:11px;color:var(--mut);margin:0}
.tl-e .tl-a{margin-left:auto;flex:none;display:flex;gap:6px;align-items:center}
.tl-e.bitti b{color:var(--mut)}
.btn.onay{background:color-mix(in srgb,var(--ok) 13%,transparent);color:var(--ok);border-color:transparent;font-weight:700;
  width:38px;padding:0;justify-content:center;font-size:15px;border-radius:11px}
@media (hover:hover){.btn.onay:hover{background:color-mix(in srgb,var(--ok) 20%,transparent);border-color:transparent;color:var(--ok)}}
.btn.onay.dolu{background:var(--ok);color:#fff;box-shadow:0 8px 16px -8px var(--ok);font-size:16px}
.yuk{display:flex;align-items:flex-end;gap:7px;height:86px;padding:14px var(--a4) 0}
.yuk > div{flex:1;display:grid;grid-template-rows:1fr auto;justify-items:center;gap:6px;height:100%}
.yuk i{width:100%;align-self:end;border-radius:6px 6px 3px 3px;background:color-mix(in srgb,var(--c-claude) 45%,transparent);
  transform-origin:bottom;transform:scaleY(0);animation:yt-cik2 .8s cubic-bezier(.2,1.4,.4,1) forwards}
.yuk > div.bugun i{background:linear-gradient(180deg,var(--acc),var(--acch))}
.yuk small{font-size:10px;color:var(--fnt)}
.mod{display:grid;grid-template-columns:1fr;gap:9px;padding:14px var(--a4)}
@media (min-width:560px){.mod{grid-template-columns:1fr 1fr}}
.mod button{display:flex;align-items:center;gap:10px;padding:12px;border-radius:var(--rs);background:var(--bg2);text-align:left;border:0;
  transition:transform .28s cubic-bezier(.2,1.4,.4,1),background .25s,box-shadow .3s}
@media (hover:hover){.mod button:hover{transform:translateY(-3px);box-shadow:var(--shs)}}
.mod button > div{min-width:0}
.mod button b{display:block;font-size:13.5px;font-weight:600;color:var(--ink)}
.mod button span{font-size:10.5px;color:var(--mut);line-height:1.35}
.mod button.on{background:color-mix(in srgb,var(--c-claude) 16%,transparent);
  box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--c-claude) 40%,transparent)}
.ykl{padding:12px var(--a4)}
.ykl .s{display:flex;align-items:center;gap:11px;padding:7px 0;font-size:13px;flex-wrap:wrap}
.ykl .s + .s{border-top:1px solid var(--line)}
.ykl time{font-size:11.5px;color:var(--fnt);width:44px;flex:none;font-variant-numeric:tabular-nums}
.ykl b{font-weight:600;color:var(--ink);font-size:13.5px}
.ykl .cv{font-size:11.5px;color:var(--mut);margin-left:auto;text-align:right}
.ykl .sec2{display:flex;gap:6px;margin-left:auto;flex-wrap:wrap}
.plan-b{font-size:17px;font-weight:600;color:var(--ink);letter-spacing:-.02em;margin:0 4px 10px}

/* ============ 17 · CLAUDE ekranı ============ */
.cdurum{position:relative;border-radius:var(--r);padding:18px;color:#fff;overflow:hidden;
  background:radial-gradient(120% 130% at 12% -10%,#3a2a4f 0%,#241c3f 45%,#15102c 100%);
  box-shadow:0 22px 44px -24px rgba(20,12,60,.75)}
.cdurum::after{content:"";position:absolute;right:-70px;top:-90px;width:240px;height:240px;border-radius:50%;
  background:radial-gradient(circle,color-mix(in srgb,var(--c-claude) 55%,transparent),transparent 66%);
  }
.cd-i{position:relative;z-index:1}
.cd-ust{display:flex;align-items:center;gap:12px}
.cd-lg{width:44px;height:44px;border-radius:15px;background:rgba(255,255,255,.1);display:grid;place-items:center;flex:none;color:#e29a7d}
.cd-lg .ic{width:26px;height:26px}
.cd-ust > div{min-width:0}
.cd-ust b{display:block;font-size:16px;font-weight:600;letter-spacing:-.02em}
.cd-ust .dur{display:flex;align-items:center;gap:6px;font-size:11.5px;color:rgba(255,255,255,.6);margin-top:3px}
.cd-ust .dur i{position:relative;width:6px;height:6px;border-radius:50%;background:#4ade80}
.cd-ust .dur i::after{content:"";position:absolute;inset:0;border-radius:50%;pointer-events:none;
  box-shadow:0 0 0 3px rgba(74,222,128,1);opacity:0}
@keyframes yt-nb2{0%{transform:scale(1);opacity:.5}70%,100%{transform:scale(2.4);opacity:0}}
.cd-sayac{margin-top:16px;display:flex;align-items:flex-end;gap:11px}
.cd-sayac b{font-size:30px;font-weight:700;letter-spacing:-.04em;line-height:.95;font-variant-numeric:tabular-nums}
.cd-sayac span{font-size:12px;color:rgba(255,255,255,.55);padding-bottom:3px}
.cd-c{height:5px;border-radius:5px;background:rgba(255,255,255,.14);margin-top:12px;overflow:hidden;position:relative}
.cd-c i{position:absolute;inset:0 auto 0 0;width:0;border-radius:5px;background:linear-gradient(90deg,var(--c-claude),#ffd7c4);
  animation:yt-dol 1.6s cubic-bezier(.2,.85,.25,1) .3s forwards}
.cd-sy2{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:15px}
.cd-sy2 div{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.08);border-radius:var(--rk);padding:9px 10px}
.cd-sy2 b{display:block;font-size:17px;font-weight:700;font-variant-numeric:tabular-nums}
.cd-sy2 span{font-size:10px;color:rgba(255,255,255,.5);letter-spacing:.04em}
.cd-dug{display:flex;gap:8px;margin-top:15px;flex-wrap:wrap}
.hzl{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:14px 16px}
.hzl button{display:flex;align-items:center;gap:10px;padding:11px 12px;border-radius:var(--rk);background:var(--bg2);text-align:left;border:0;
  transition:transform .28s cubic-bezier(.2,1.4,.4,1),background .25s,box-shadow .3s}
@media (hover:hover){.hzl button:hover{transform:translateY(-3px);box-shadow:var(--shs);background:var(--sf2)}}
.hzl button > div{min-width:0}
.hzl b{display:block;font-size:12.5px;font-weight:600;color:var(--ink)}
.hzl span{font-size:10px;color:var(--mut)}
.onr{display:flex;gap:12px;padding:14px var(--a4);align-items:flex-start}
.onr + .onr{border-top:1px solid var(--line)}
.onr > div{min-width:0;flex:1}
.onr b{display:block;font-size:13.5px;font-weight:600;color:var(--ink);line-height:1.3}
.onr p{font-size:12px;color:var(--mut);margin-top:3px;line-height:1.45}
.onr .dug2{display:flex;gap:7px;margin-top:9px;flex-wrap:wrap}
.tur2{display:flex;align-items:center;gap:11px;padding:12px var(--a4)}
.tur2 + .tur2{border-top:1px solid var(--line)}
.tur2 .nk2{width:26px;height:26px;border-radius:50%;flex:none;display:grid;place-items:center;font-size:11px;font-weight:700;
  background:var(--bg2);color:var(--fnt);border:1.5px solid var(--line2)}
.tur2.ok .nk2{background:var(--ok);border-color:var(--ok);color:#fff}
.tur2.simdi2 .nk2{background:var(--tint);border-color:color-mix(in srgb,var(--acc) 45%,transparent);color:var(--acch)}
.tur2 > div{min-width:0;flex:1}
.tur2 b{display:block;font-size:13.5px;font-weight:600;color:var(--ink)}
.tur2 span{font-size:11.5px;color:var(--mut)}
.tur2 .sa{margin-left:auto;font-size:12px;color:var(--fnt);font-variant-numeric:tabular-nums;flex:none}
.tkp{display:flex;align-items:center;gap:11px;padding:12px var(--a4)}
.tkp + .tkp{border-top:1px solid var(--line)}
.tkp .gun2{width:46px;height:44px;border-radius:14px;display:grid;place-items:center;align-content:center;gap:1px;flex:none;
  background:color-mix(in srgb,var(--c) 13%,transparent);border:1px solid color-mix(in srgb,var(--c) 22%,transparent);
  color:color-mix(in srgb,var(--c) 82%,var(--ink));line-height:1}
.tkp .gun2 b{font-size:16px;font-weight:700;font-variant-numeric:tabular-nums;color:inherit;display:block}
.tkp .gun2 span{font-size:8.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;opacity:.75;color:inherit}
.tkp .gun2.bugun2{background:color-mix(in srgb,var(--ok) 15%,transparent);border-color:color-mix(in srgb,var(--ok) 28%,transparent);color:var(--ok)}
.tkp .gun2.bugun2 b{font-size:12px;letter-spacing:-.01em}
.tkp > div{min-width:0;flex:1}
.tkp b{display:block;font-size:13.5px;font-weight:600;color:var(--ink)}
.tkp span{font-size:11.5px;color:var(--mut)}
.nt5{padding:13px var(--a4)}
.nt5 + .nt5{border-top:1px solid var(--line)}
.nt5 time{display:block;font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--fnt);margin-bottom:5px}
.nt5 p{font-size:13px;line-height:1.55;color:var(--txt)}
.gun-ay,.gun-bas{display:flex;align-items:center;gap:11px;margin:4px 0;font-size:10.5px;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;color:var(--fnt);text-align:center}
.gun-ay::before,.gun-ay::after,.gun-bas::before,.gun-bas::after{content:"";flex:1;height:1px;background:var(--line)}

/* sohbet */
.chat{padding-top:0}
.chat-kutu,.shb{display:flex;flex-direction:column;gap:13px;padding:18px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
.chat-kutu::-webkit-scrollbar,.shb::-webkit-scrollbar{width:5px}
.chat-kutu::-webkit-scrollbar-thumb,.shb::-webkit-scrollbar-thumb{background:var(--line2);border-radius:5px}
.msg{max-width:88%;display:flex;gap:11px;background:none;box-shadow:none;padding:0;border-radius:0}
.msg + .msg{margin-top:0}
.msg .av2{width:30px;height:30px;border-radius:50%;flex:none;display:grid;place-items:center;font-size:13px;font-weight:700;
  background:color-mix(in srgb,var(--c-claude) 16%,transparent);color:var(--c-claude)}
.msg .av2 .ic{width:18px;height:18px}
.msg.u{align-self:flex-end;flex-direction:row-reverse;margin-left:auto}
.msg.u .av2{background:var(--ink);color:var(--sf)}
:root.dark .msg.u .av2{background:var(--bg2);color:var(--ink)}
.msg .bl3{position:relative;border-radius:18px;padding:11px 14px;font-size:13.5px;line-height:1.55;
  background:var(--sf2);border:1px solid var(--line);color:var(--txt);min-width:0}
/* Claude balonu: Claude rengine çalan hafif degrade. Kaldırılan şey bu DEĞİL,
   satırın arkasındaki kare kutuydu (bkz. 44.3) — balonun kendi degradesi geri. */
.msg.c .bl3{border-bottom-left-radius:6px;
  background:linear-gradient(140deg,color-mix(in srgb,var(--c-claude) 10%,var(--sf2)),var(--sf2) 70%)}
.msg.u .bl3{border-bottom-right-radius:6px;background:var(--ink);color:var(--bg);border-color:transparent}
:root.dark .msg.u .bl3{background:var(--bg2);color:var(--ink)}
.msg .who{display:flex;gap:6px;font-size:10.5px;margin-bottom:4px;opacity:.7;white-space:normal}
.msg.c .who{color:var(--c-claude);font-weight:600;opacity:1}
.msg .who time{margin-left:auto;font-variant-numeric:tabular-nums}
.msg .mt{white-space:pre-line}
.msg .kayit{margin-top:6px;font-size:12px;color:var(--ok);white-space:pre-line}
.msg .dur{display:block;margin-top:5px;font-size:10.5px;opacity:.6;text-align:right}
.yaz2,.chat-yaz .yazkutu{display:flex;gap:9px;padding:12px 14px;border-top:1px solid var(--line);background:var(--sf2);align-items:flex-end}
.yaz2 textarea{flex:1;min-height:42px;max-height:120px;border-radius:15px;border:1px solid var(--line);background:var(--sf);
  color:var(--ink);font-size:14px;padding:11px 14px;resize:none;line-height:1.4}
.gonder{width:42px;height:42px;border-radius:14px;background:var(--ink);color:var(--sf);display:grid;place-items:center;
  font-size:16px;flex:none;border:0;transition:transform .25s cubic-bezier(.2,1.4,.4,1),filter .25s}
:root.dark .gonder{background:var(--acc-dolgu);color:var(--acc-ust)}
@media (hover:hover){.gonder:hover{transform:translateY(-2px) scale(1.04)}}

/* ============ 18 · İŞ ============ */
.sek,.m-sekme{display:flex;gap:6px;padding:5px;border-radius:999px;background:var(--sf);box-shadow:var(--sh);
  overflow-x:auto;scrollbar-width:none;margin:0 20px}
.sek::-webkit-scrollbar,.m-sekme::-webkit-scrollbar{display:none}
.sek button,.m-sekme a,.m-sekme button{flex:none;height:36px;padding:0 16px;border-radius:999px;font-size:13px;font-weight:600;
  color:var(--mut);white-space:nowrap;border:0;background:none;display:inline-flex;align-items:center;gap:6px;transition:transform .25s,opacity .25s,background-color .25s,color .25s,border-color .25s,box-shadow .25s}
.sek button.on,.m-sekme [aria-current="true"],.m-sekme .on{background:var(--ink);color:var(--sf)}
:root.dark .sek button.on,:root.dark .m-sekme [aria-current="true"],:root.dark .m-sekme .on{background:var(--secili);color:var(--secili-ink)}
.sek button .sy4,.m-sekme .say{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:999px;
  background:color-mix(in srgb,var(--mut) 16%,transparent);font-size:10.5px;opacity:1}
.sek button.on .sy4,.m-sekme [aria-current="true"] .say{background:rgba(255,255,255,.22)}
:root.dark .sek button.on .sy4,:root.dark .m-sekme [aria-current="true"] .say{background:rgba(0,0,0,.16)}
.m-sekme .say2{margin-left:6px;min-width:16px;height:16px;font-size:10px;padding:0 4px;border-radius:999px;
  background:var(--acc-dolgu);color:var(--acc-ust);display:inline-grid;place-items:center;font-weight:700}
.asama{display:grid;gap:11px}
@media (min-width:900px){.asama{grid-template-columns:repeat(3,1fr)}}
.as-k{background:var(--sf);border-radius:var(--rs);box-shadow:var(--sh);overflow:hidden}
.as-h{display:flex;align-items:center;gap:9px;padding:12px 15px;border-bottom:1px solid var(--line);font-size:11px;font-weight:700;
  letter-spacing:.11em;text-transform:uppercase;color:var(--mut)}
.as-h i{width:8px;height:8px;border-radius:50%;background:var(--c,var(--mut));font-style:normal;flex:none}
.as-h .sy5{margin-left:auto;font-weight:700;color:var(--ink);font-size:12px}
.pj,.job{padding:13px 15px;transition:background .22s;background:var(--sf);border-radius:0;box-shadow:none;margin:0}
.pj + .pj,.job + .job{border-top:1px solid var(--line);margin-top:0}
@media (hover:hover){.pj:hover,.job:hover{background:var(--sf2)}}
.pj b,.job h3{display:block;font-size:14px;font-weight:600;color:var(--ink);line-height:1.3;margin:0}
.pj .mus{font-size:11.5px;color:var(--mut);margin-top:2px}
.pj .alt4{display:flex;align-items:center;gap:8px;margin-top:9px;flex-wrap:wrap}
.pj .tt{font-size:13px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
.vd{font-size:10.5px;font-weight:700;letter-spacing:.05em;padding:4px 8px;border-radius:7px;background:var(--bg2);color:var(--mut)}
.vd.acil2{background:var(--tint);color:var(--acch)}
.vd.ok2{background:color-mix(in srgb,var(--ok) 14%,transparent);color:var(--ok)}
.pj .ilerle{margin-top:10px;height:5px;border-radius:5px;background:var(--bg2);overflow:hidden}
.pj .ilerle i{display:block;height:100%;border-radius:5px;background:var(--c,var(--c-is));width:var(--w,0);transition:width .5s cubic-bezier(.2,.9,.3,1)}
.pj-a{display:flex;align-items:center;gap:7px;margin-top:11px;flex-wrap:wrap}
.pj-a .btn{height:30px;padding:0 11px;font-size:12px}
.pj-a .as-n{margin-left:auto;font-size:11px;font-weight:700;color:var(--fnt);font-variant-numeric:tabular-nums}
.tah{display:flex;align-items:center;gap:13px;padding:14px var(--a4);flex-wrap:wrap}
.tah + .tah{border-top:1px solid var(--line)}
.tah > div{min-width:0;flex:1}
.tah .tt2{font-size:17px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap}
.tah .dr{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;font-size:20px;flex:none;
  background:color-mix(in srgb,var(--c,var(--mut)) 13%,transparent)}
.tah b{display:block;font-size:14px;font-weight:600;color:var(--ink)}
.tah span{font-size:11.5px;color:var(--mut)}
.tlp{display:grid;grid-template-columns:auto 1fr auto;gap:13px;padding:15px var(--a4);align-items:start}
.tlp + .tlp{border-top:1px solid var(--line)}
.tlp .sure2{font-size:10.5px;font-weight:700;letter-spacing:.05em;padding:4px 9px;border-radius:7px;background:var(--tint);
  color:var(--acch);white-space:nowrap}
.tlp b{display:block;font-size:14.5px;font-weight:600;color:var(--ink);line-height:1.35}
.tlp p{font-size:12px;color:var(--mut);margin-top:4px;line-height:1.45}
.kpi,.m-kpi{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
@media (min-width:560px){.kpi,.m-kpi{grid-template-columns:repeat(4,1fr)}}
.kpi > div,.m-kpi > div{background:var(--sf);border-radius:var(--rs);box-shadow:var(--sh);padding:14px 15px}
.kpi b,.m-kpi b{display:block;font-size:22px;font-weight:700;color:var(--ink);letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.kpi span,.m-kpi span{display:block;font-size:10.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--mut);margin-top:3px}
.kpi small,.m-kpi small{display:block;font-size:11px;color:var(--fnt);margin-top:5px}
.gl{display:flex;justify-content:space-between;font-size:11px;font-weight:700;letter-spacing:.11em;text-transform:uppercase;
  color:var(--fnt);margin:14px 4px 7px}
.gl b{font-weight:700;color:var(--mut)}

/* ============ 19 · MANEVİYAT ============ */
.vkr{display:grid;grid-template-columns:repeat(5,1fr);gap:9px;margin-top:17px;position:relative;z-index:1}
@media (max-width:640px){.vkr{grid-template-columns:repeat(3,1fr);gap:7px}}
.vkr-k{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.09);border-radius:var(--rs);
  display:grid;overflow:hidden;transition:background .3s,transform .3s,border-color .3s,box-shadow .3s}
@media (hover:hover){.vkr-k:hover{background:rgba(255,255,255,.13);transform:translateY(-2px)}}
.vkr-t{display:grid;justify-items:center;gap:5px;padding:12px 8px 9px;width:100%;background:none;border:0;cursor:pointer}
.vkr-k .ad3{font-size:12px;font-weight:600;color:rgba(255,255,255,.85)}
.vkr-k .st2{font-size:16px;font-weight:700;color:#fff;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.vkr-k .hlk{width:28px;height:28px;border-radius:50%;border:2px solid rgba(255,255,255,.25);display:grid;place-items:center;
  font-size:13px;color:transparent;transition:transform .35s cubic-bezier(.2,1.5,.4,1),opacity .35s cubic-bezier(.2,1.5,.4,1),background-color .35s cubic-bezier(.2,1.5,.4,1),color .35s cubic-bezier(.2,1.5,.4,1),border-color .35s cubic-bezier(.2,1.5,.4,1),box-shadow .35s cubic-bezier(.2,1.5,.4,1)}
.vkr-k .hlk .ic{width:15px;height:15px;stroke-width:2.6}
@media (hover:hover){.vkr-t:hover .hlk{border-color:rgba(255,255,255,.55);color:rgba(255,255,255,.4)}}
.vkr-k .dr3{font-size:10px;color:rgba(255,255,255,.45);letter-spacing:.02em}
.vkr-k .cmt{font-size:10.5px;font-weight:600;color:rgba(255,255,255,.45);padding:7px 8px;border:0;background:none;
  border-top:1px solid rgba(255,255,255,.08);transition:transform .25s,opacity .25s,background-color .25s,color .25s,border-color .25s,box-shadow .25s;cursor:pointer}
@media (hover:hover){.vkr-k .cmt:hover{background:rgba(255,255,255,.14);color:#fff}}
.vkr-k.ok{background:rgba(126,231,180,.14);border-color:rgba(126,231,180,.3)}
.vkr-k.ok .hlk{background:#3fcf8e;border-color:#3fcf8e;color:#0b3b28}
.vkr-k.ok .dr3{color:#7ee7b4}
.vkr-k.cem{background:rgba(126,231,180,.18);border-color:rgba(126,231,180,.38)}
.vkr-k.cem .hlk{background:#3fcf8e;border-color:#fff;color:#0b3b28;box-shadow:0 0 0 3px rgba(255,255,255,.22)}
.vkr-k.cem .dr3,.vkr-k.cem .cmt{color:#7ee7b4}
.vkr-k.kaza{background:rgba(242,184,75,.12);border-color:rgba(242,184,75,.26)}
.vkr-k.kaza .hlk{border-color:#f2b84b;color:#f2b84b}
.vkr-k.kaza .dr3{color:#f2b84b}
.vkr-k.aktif{background:rgba(255,255,255,.14);border-color:color-mix(in srgb,var(--acc) 62%,transparent);
  box-shadow:0 0 0 1.5px color-mix(in srgb,var(--acc) 40%,transparent),0 10px 26px -14px var(--acc)}
.vkr-k.aktif .st2{color:#ffd0ba}
.vkr-k.aktif .dr3{color:var(--acc);font-weight:600}
.vkr-k.aktif .hlk{border-color:color-mix(in srgb,var(--acc) 70%,transparent);color:color-mix(in srgb,var(--acc) 60%,transparent);
  animation:yt-vk 2.4s ease-in-out infinite}
@keyframes yt-vk{0%,100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--acc) 42%,transparent)}60%{box-shadow:0 0 0 7px transparent}}
.vkr-k.gelecek{opacity:.48}
.vkr-k.gelecek .cmt{display:none}
/* Son 7 gün ızgarası (Maneviyat): satır başlığı hücrelere yaslı, sütun başlığında gün + ayın günü,
   bugün turuncu çerçeveyle, Cuma altın çizgiyle işaretli. Boş hücre dolu blok değil çerçeve. */
.hafta-t{display:grid;grid-template-columns:52px repeat(7,minmax(0,1fr));gap:4px;align-items:stretch;
  font-variant-numeric:tabular-nums}
.ht-b{display:flex;align-items:center;justify-content:flex-end;font-size:11.5px;font-weight:600;color:var(--mut);
  padding:0 8px 0 0;white-space:nowrap;letter-spacing:-.01em}
.ht-g{display:grid;justify-items:center;align-content:end;gap:1px;padding-bottom:5px;line-height:1.1}
.ht-g b{font-size:9.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--fnt)}
.ht-g em{font-style:normal;font-size:11.5px;font-weight:600;color:var(--mut)}
.ht-g.cum b,.ht-g.cum em{color:var(--c-maneviyat)}
.ht-g.bug b{color:var(--acc)}
.ht-g.bug em{color:var(--ink);font-weight:700}
.ht-h{height:30px;border-radius:9px;position:relative;background:color-mix(in srgb,var(--line2) 50%,transparent);
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--line2) 85%,transparent);
  transition:transform .25s cubic-bezier(.2,1.35,.4,1)}
.ht-h.ok,.ht-h.cem{background:var(--ok);box-shadow:none}
.ht-h.kaza{background:var(--amb);box-shadow:none}
.ht-h.cum{box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--c-maneviyat) 55%,transparent)}
.ht-h.bug{outline:1.5px solid color-mix(in srgb,var(--acc) 55%,transparent);outline-offset:1.5px}
.ht-h.cem i{position:absolute;inset:0;margin:auto;width:7px;height:7px;border-radius:50%;background:#fff;
  box-shadow:0 0 0 2px color-mix(in srgb,#000 24%,transparent)}
@media (hover:hover) and (pointer:fine){.ht-h:hover{transform:translateY(-2px)}}
@media (prefers-reduced-motion:reduce){.ht-h{transition:none}@media (hover:hover){.ht-h:hover{transform:none}}}
/* Lejant: gömülü stil yalnız .lejant .cell'e ölçü veriyor; buradaki sınıfsız <i>'ler 0x0 kalıyordu.
   Ölçü yalnız bu lejanta (.ht-l) veriliyor, ötekilere dokunulmuyor. */
.lejant.ht-l{gap:6px 7px}
.lejant.ht-l span{gap:6px;padding:4px 9px 4px 7px;border-radius:999px;font-weight:600;color:var(--mut);
  background:color-mix(in srgb,var(--line2) 30%,transparent)}
.lejant.ht-l i{width:14px;height:10px;border-radius:4px;display:grid;place-items:center;flex:none}
.lejant.ht-l i.ok{background:var(--ok)}
.lejant.ht-l i.kaza{background:var(--amb)}
.lejant.ht-l i.bos{background:color-mix(in srgb,var(--line2) 50%,transparent);
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--line2) 85%,transparent)}
.lejant.ht-l i.cem u{width:5px;height:5px;border-radius:50%;text-decoration:none;background:#fff;
  box-shadow:0 0 0 1.5px color-mix(in srgb,#000 24%,transparent)}
@container (max-width:420px){
  .m-ibadet .hafta-t{grid-template-columns:42px repeat(7,minmax(0,1fr));gap:3px}
  .m-ibadet .ht-b{font-size:10.5px;padding-right:5px}
  .m-ibadet .ht-g em{font-size:10.5px}
  .m-ibadet .ht-h{height:26px;border-radius:7px}
}
.cuma-s{display:flex;gap:7px}
.cuma-s i{flex:1;height:30px;border-radius:9px;background:var(--line2);opacity:.6;transition:transform .25s}
.cuma-s i.ok{background:var(--c-maneviyat);opacity:1}
.cuma-s i.bugun{box-shadow:inset 0 0 0 2px var(--acc)}
@media (hover:hover){.cuma-s i:hover{transform:translateY(-2px)}}
.seri2{color:var(--amb);font-weight:700}
.olcek10,.scl{display:grid;grid-template-columns:repeat(10,1fr);gap:5px}
.olcek10 button,.scl button{height:38px;border-radius:10px;background:var(--bg2);font-size:13px;font-weight:600;color:var(--mut);border:0;
  transition:transform .25s cubic-bezier(.2,1.3,.4,1),opacity .25s cubic-bezier(.2,1.3,.4,1),background-color .25s cubic-bezier(.2,1.3,.4,1),color .25s cubic-bezier(.2,1.3,.4,1),border-color .25s cubic-bezier(.2,1.3,.4,1),box-shadow .25s cubic-bezier(.2,1.3,.4,1)}
@media (hover:hover){.olcek10 button:hover,.scl button:hover{background:var(--sf2);color:var(--ink);transform:translateY(-2px)}}
.olcek10 button.on,.scl button[aria-pressed="true"]{background:var(--c,var(--acc));color:#fff;font-weight:700;
  box-shadow:0 8px 16px -8px var(--c,var(--ink))}
.scl.s5{grid-template-columns:repeat(5,1fr)}
.scl.s4{grid-template-columns:repeat(4,1fr)}
.tsb{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.tsb-k{padding:16px 12px;border-radius:var(--rs);background:var(--bg2);display:grid;gap:3px;justify-items:center;border:0;
  transition:transform .2s cubic-bezier(.2,1.5,.4,1),background .25s}
@media (hover:hover){.tsb-k:hover{background:var(--sf2)}}
.tsb-k b{font-size:26px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums;letter-spacing:-.03em}
.tsb-k span{font-size:12px;font-weight:600;color:var(--txt)}
.tsb-k small{font-size:10px;color:var(--fnt)}
.miniz{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}
@media (min-width:560px){.miniz{grid-template-columns:repeat(3,1fr)}}
.miniz div{background:var(--bg2);border-radius:var(--rk);padding:11px 12px}
.miniz b{display:block;font-size:15.5px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.miniz span{display:block;font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--mut);margin-top:3px}
.miniz small{display:block;font-size:10.5px;color:var(--fnt);margin-top:3px}
.olc-bas{display:flex;align-items:center;gap:13px;margin-bottom:14px}
.olc-bas .sy3{font-size:32px;font-weight:700;letter-spacing:-.04em;color:var(--ink);font-variant-numeric:tabular-nums;line-height:1}
.olc-bas .sy3 small{font-size:14px;font-weight:600;color:var(--mut);margin-left:3px}
.olc-bas .nt4{font-size:12.5px;color:var(--mut);margin-top:3px}
.cizelge{display:flex;align-items:flex-end;gap:5px;height:88px;margin-bottom:6px}
.cizelge > div{flex:1;display:grid;grid-template-rows:1fr auto;justify-items:center;gap:5px;height:100%}
.cizelge i{width:100%;align-self:end;border-radius:5px 5px 3px 3px;transform-origin:bottom;transform:scaleY(0);
  background:linear-gradient(180deg,var(--c,var(--c-claude)),color-mix(in srgb,var(--c,var(--c-claude)) 40%,transparent));
  animation:yt-cik2 .8s cubic-bezier(.2,1.4,.4,1) forwards}
.cizelge small{font-size:9.5px;color:var(--fnt)}
.tbl{width:100%;border-collapse:collapse;font-size:13px}
.tbl td{padding:8px 0;border-top:1px solid var(--line)}
.tbl tr:first-child td{border-top:0}
.tbl td:first-child{color:var(--mut);width:46%}
.tbl td:last-child{text-align:right;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums}

/* ============ 20 · PROFİL · ayarlar ============ */
.pf-koyu{background:linear-gradient(135deg,#2a2350,#16122e);box-shadow:0 16px 34px -20px rgba(22,18,46,.9);
  transition:transform .35s cubic-bezier(.2,1.4,.4,1),box-shadow .35s;display:block;text-decoration:none}
:root.dark .pf-koyu{background:linear-gradient(135deg,#241f47,#151230)}
@media (hover:hover){.pf-koyu:hover{transform:translateY(-3px);box-shadow:0 24px 44px -20px rgba(22,18,46,.95)}}
.pf-koyu .bilgi b{color:#fff}
.pf-koyu .bilgi span{color:rgba(255,255,255,.62)}
.pf-koyu .git2{color:rgba(255,255,255,.55)}
.pf-koyu .pr{border-color:rgba(255,255,255,.1)}
.pf-koyu .pr + .pr{border-top-color:rgba(255,255,255,.1)}
.pf-koyu .pr b{color:#fff}
.pf-koyu .pr span{color:rgba(255,255,255,.55)}
.pf-ust{display:flex;align-items:center;gap:16px;padding:20px var(--a4)}
.pf-av{width:84px;height:84px;border-radius:28px;flex:none;position:relative;overflow:hidden;display:grid;place-items:center;
  background:linear-gradient(150deg,var(--c-claude),var(--c-zihin));color:#fff;font-size:32px;font-weight:700;border:0;
  box-shadow:0 14px 28px -14px var(--c-claude)}
.pf-av img{width:100%;height:100%;object-fit:cover}
.pf-av .dgs{position:absolute;inset:auto 0 0;height:26px;background:rgba(10,8,30,.55);color:#fff;font-size:10px;font-weight:600;
  display:grid;place-items:center;opacity:0;transition:opacity .25s}
@media (hover:hover){.pf-av:hover .dgs{opacity:1}}
.pf-ust .bilgi{min-width:0}
.pf-ust .bilgi b{display:block;font-size:20px;font-weight:600;color:var(--ink);letter-spacing:-.02em}
.pf-ust .bilgi span{font-size:12.5px;color:var(--mut)}
.pf-ust .rozet{display:inline-flex;align-items:center;gap:6px;margin-top:7px;font-size:11px;font-weight:600;color:var(--c-claude);
  background:color-mix(in srgb,var(--c-claude) 18%,transparent);border-radius:999px;padding:5px 11px}
.ikili2{display:grid;gap:12px}
@media (min-width:560px){.ikili2{grid-template-columns:1fr 1fr}}
.opt{display:flex;align-items:center;gap:12px;padding:13px 16px;width:100%;text-align:left;transition:background .22s;border:0;background:none}
.opt + .opt{border-top:1px solid var(--line)}
@media (hover:hover){.opt:hover{background:var(--sf2)}}
.opt .rd{width:20px;height:20px;border-radius:50%;border:2px solid var(--line2);flex:none;display:grid;place-items:center;
  transition:transform .25s,opacity .25s,background-color .25s,color .25s,border-color .25s,box-shadow .25s;margin:0}
.opt[aria-checked="true"] .rd{border:2px solid var(--c-claude)}
.opt[aria-checked="true"] .rd::after{content:"";width:10px;height:10px;border-radius:50%;background:var(--c-claude)}
.opt > div{min-width:0}
.opt b{display:block;font-size:14px;font-weight:600;color:var(--ink)}
.opt small{display:block;font-size:11.5px;color:var(--mut);line-height:1.45;margin-top:2px}
.tg{display:flex;align-items:center;gap:12px;padding:13px 16px;width:100%;text-align:left;transition:background .22s;border:0;background:none}
.tg + .tg,.tg + .opt,.opt + .tg{border-top:1px solid var(--line)}
@media (hover:hover){.tg:hover{background:var(--sf2)}}
.tg > div{flex:1;min-width:0}
.tg b{display:block;font-size:14px;font-weight:600;color:var(--ink)}
.tg small{display:block;font-size:11.5px;color:var(--mut);line-height:1.45;margin-top:2px}
.tgl{margin-left:auto;width:44px;height:26px;border-radius:999px;background:var(--line2);flex:none;position:relative;
  transition:background .3s;box-shadow:none}
.tgl::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;
  box-shadow:0 2px 5px rgba(0,0,0,.2);transition:transform .3s cubic-bezier(.2,1.4,.4,1)}
.tg[aria-checked="true"] .tgl{background:var(--c-claude);box-shadow:none}
.tg[aria-checked="true"] .tgl::after{left:3px;transform:translateX(18px);background:#fff}
.pr{display:grid;grid-template-columns:minmax(110px,auto) 1fr auto;align-items:center;gap:12px;padding:12px 16px;font-size:13px;
  text-decoration:none;background:none;border:0;text-align:left;width:100%}
.pr + .pr{border-top:1px solid var(--line)}
.pr b{font-weight:600;color:var(--ink);font-size:13.5px;display:flex;align-items:center;gap:6px}
.pr span{color:var(--mut);font-size:12.5px;text-align:right}
.pr .git2{font-size:15px;color:var(--fnt)}
.pr > .ic{width:15px;height:15px;color:var(--fnt)}
.pr.pasif b{color:var(--mut)}
.pr.uyari b{color:var(--miss)}
.anh{display:flex;align-items:center;gap:12px;padding:12px 16px}
.anh + .anh{border-top:1px solid var(--line)}

/* ============ 21 · modül uyumu ============ */
.m-satir{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3px 12px;align-items:baseline;padding:12px 16px}
.m-satir + .m-satir{border-top:1px solid var(--line)}
.m-satir b{font-size:13.5px;font-weight:600;color:var(--ink)}
.m-satir .m-alt{grid-column:1/-1;font-size:11.5px;color:var(--mut);line-height:1.45}
.m-satir .m-sag{font-size:12.5px;color:var(--mut);text-align:right;white-space:nowrap}
.m-rozet{display:inline-flex;align-items:center;height:20px;padding:0 8px;border-radius:999px;font-size:10.5px;font-weight:700;
  background:var(--bg2);color:var(--mut)}
.m-rozet.ok{background:color-mix(in srgb,var(--ok) 16%,transparent);color:var(--ok-t)}
.m-rozet.uyari{background:color-mix(in srgb,var(--amb) 18%,transparent);color:var(--amb-t)}
.m-rozet.kirmizi{background:color-mix(in srgb,var(--miss) 15%,transparent);color:var(--miss-t)}
.m-rozet.acil{background:var(--tint);color:var(--acch)}
.m-rozet.claude{background:color-mix(in srgb,var(--c-claude) 16%,transparent);color:var(--claude-t)}
.m-onay{display:flex;align-items:center;gap:11px;padding:12px 16px;width:100%;background:none;border:0;text-align:left}
.m-onay + .m-onay{border-top:1px solid var(--line)}
.m-onay .kutu{width:21px;height:21px;border-radius:50%;border:1.7px solid var(--line2);flex:none;display:grid;place-items:center;
  color:transparent;transition:transform .3s cubic-bezier(.2,1.5,.4,1),opacity .3s cubic-bezier(.2,1.5,.4,1),background-color .3s cubic-bezier(.2,1.5,.4,1),color .3s cubic-bezier(.2,1.5,.4,1),border-color .3s cubic-bezier(.2,1.5,.4,1),box-shadow .3s cubic-bezier(.2,1.5,.4,1)}
.m-onay .kutu .ic{width:13px;height:13px;stroke-width:2.6}
.m-onay[aria-checked="true"] .kutu{background:var(--ok);border-color:var(--ok);color:#fff}
.m-onay > span{flex:1;min-width:0;font-size:14px;font-weight:600;color:var(--ink)}
.m-onay[aria-checked="true"] > span{color:var(--mut);text-decoration:line-through;text-decoration-color:var(--line2)}
.m-onay em.gm{display:block;font-style:normal;font-size:11.5px;font-weight:500;color:var(--mut);margin-top:2px;text-decoration:none}
.m-grafikkart{padding:var(--a4)}
.m-grafikkart .sh{margin-bottom:10px}
.m-kanban > section{background:var(--bg2);border-radius:var(--r);padding:10px}
.m-kart{background:var(--sf);border-radius:var(--rs);box-shadow:var(--shs);padding:12px 14px}
.izg{padding:13px 14px}
.cell{border-radius:6px}
.lejant{font-size:10.5px;color:var(--mut);margin-top:11px}
.ti{border-radius:10px;background:color-mix(in srgb,var(--c,var(--mut)) 14%,transparent)}
.ti.b{border-radius:13px}
.ti.k{border-radius:8px}
.st{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;padding:0 20px 2px}
.st > div,.st > button{background:var(--sf);border-radius:var(--rs);box-shadow:var(--sh);padding:13px 14px;border:0;text-align:left;
  transition:transform .3s cubic-bezier(.2,.9,.3,1.05),box-shadow .3s}
@media (hover:hover){.st > button:hover{transform:translateY(-3px);box-shadow:var(--hov)}}
.st .ic{width:17px;height:17px;color:var(--c,var(--mut))}
.st b{display:block;font-size:19px;font-weight:700;color:var(--ink);letter-spacing:-.03em;margin-top:7px;font-variant-numeric:tabular-nums}
.st span{display:block;font-size:11px;color:var(--mut);margin-top:2px}
.mdz-yan .ctxk{padding:16px var(--a4)}
.mrow + .mrow{margin-top:14px}
.mrow-h b{font-size:14px;font-weight:600;color:var(--ink)}
.mrow-h span{font-size:12px;color:var(--mut)}
.more{display:flex;justify-content:space-between;align-items:center;padding:12px var(--a4);font-size:12.5px;font-weight:600;
  color:var(--mut);border-top:1px solid var(--line);background:none;border-left:0;border-right:0;border-bottom:0;width:100%}
.more .ic{width:16px;height:16px;color:var(--fnt)}
.row{padding:12px 16px}
.row + .row{border-top:1px solid var(--line)}
.row-top b{font-weight:600;font-size:14.5px}
.ring{width:21px;height:21px;border-radius:50%;border:1.7px solid var(--line2)}
.ans .btn{height:38px}
.nl{font-size:12.5px}
.karar{display:grid;grid-template-columns:22px minmax(0,1fr) auto;gap:10px;padding:11px 16px;font-size:12.5px}
.karar + .karar{border-top:1px solid var(--line)}
.gcps{display:flex;flex-wrap:wrap;gap:6px;padding:0 20px}
.gcp{display:inline-flex;align-items:center;height:30px;padding:0 12px;border-radius:999px;background:var(--sf);box-shadow:var(--shs);
  font-size:11.5px;color:var(--mut);gap:5px}
.gcp.cl{color:var(--c-claude);background:color-mix(in srgb,var(--c-claude) 13%,transparent);box-shadow:none;padding:0 12px;margin:0}
.bdot{background:var(--c-claude)}
.hdf{padding:13px 16px}
.hdf + .hdf{border-top:1px solid var(--line)}
.hdf-top b{font-size:14px;font-weight:600}
.adim li.ok{color:var(--fnt)}
.ks-kart{padding:15px var(--a4)}
.ks-s{min-height:52px}
.ks-i{border-radius:50%}

/* ============ 22 · sheet · toast · palet ============ */
.sheet{background:var(--sf);border-radius:26px 26px 0 0;box-shadow:0 -20px 60px -20px rgba(10,8,30,.5)}
.grab{width:38px;height:4px;border-radius:4px;background:var(--line2)}
.sheet-h h2{font-size:17px;font-weight:600}
.sheet-h button{font-size:13px;font-weight:600;color:var(--mut)}
@media (min-width:1024px){.sheet{border-radius:var(--r)}}
.toast{border-radius:16px;background:var(--ink);color:var(--sf);box-shadow:0 20px 40px -16px rgba(0,0,0,.55);
  font-size:13.5px;padding:12px 14px}
:root.dark .toast{background:var(--ters-sf);color:var(--ters-ink)}
.toast button{color:var(--acc);font-weight:700}
.palet-k,.secici-k{border-radius:var(--r);box-shadow:0 30px 70px -20px rgba(10,8,30,.5)}
.palet-i{border-radius:var(--rk)}
.palet-i[aria-selected="true"]{background:var(--bg2)}
.setup{border-radius:var(--r);box-shadow:var(--sh)}

/* ============ 24 · yerleşim ============ */
@media (min-width:1024px){
  .icerik{padding:22px clamp(20px,3vw,44px) 56px}
  #ekran{max-width:1330px}
  .vk,.soz,.sek,.m-sekme,.st,.gcps,.sys{margin-left:0;margin-right:0;padding-left:0;padding-right:0}
  .sec.chat,.sec.chat-yaz{padding-left:0;padding-right:0}
  .sek,.m-sekme{padding:5px}
  .vk{padding:14px var(--a4) 10px}
  .soz{padding:17px 46px 17px 20px}
  .sys{margin:20px 2px 0}
}
@media (max-width:1023px){
  .icerik{padding-top:4px}
}
.gir{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

/* ============ 25 · rozet · marka · çekmece düzeltmeleri ============ */
.say2{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:999px;
  background:color-mix(in srgb,var(--c,var(--acc)) 18%,transparent);color:color-mix(in srgb,var(--c,var(--acc)) 82%,var(--ink));
  font-size:10px;font-weight:700;font-style:normal;line-height:1;vertical-align:1px}
.sh .say2,.bas .say2{margin-right:4px}
.pr b .say2{margin-left:4px}
.marka .ml{display:flex;align-items:center;gap:11px;flex:1;min-width:0;text-decoration:none}
.marka .lg .logo{color:var(--ink)}
.ck-panel .marka{padding-right:0}
.ck-panel .yazd{height:48px;font-size:15px}
.ck-panel .rs{height:42px;font-size:14.5px}
.ck-panel kbd,.ck kbd{display:none}
.ck-kapat{width:34px;height:34px;border-radius:11px;background:var(--bg2);box-shadow:none;color:var(--mut);flex:none}
.rdar{width:30px;height:30px;border-radius:9px;background:transparent;box-shadow:none;color:var(--fnt);flex:none}
.rdar .ic{width:16px;height:16px;transform:rotate(180deg)}
.rail-dar .rdar .ic{transform:none}
.rail-dar .marka .ml{flex:none;justify-content:center}
.rail-dar .marka{flex-direction:column;gap:10px}
.gizli .icb[data-gizli]{background:var(--ink);color:var(--sf)}
:root.dark .gizli .icb[data-gizli]{background:var(--secili);color:var(--secili-ink)}

/* ============ 26 · geniş ekranda iki sütun ============ */
@media (min-width:1024px){
  .bugun{gap:0 26px}
  .ikili{gap:0 26px}
  .sec{padding-top:24px}
}

/* ============ 27 · koyu yüzeylerde token haritası ============
   .hero / .kok / .cdurum / .oz içindeki her şey (modüllerin kendi CSS'i dâhil)
   koyu zemine göre okunur: yüzey, çizgi ve metin tokenları burada yeniden tanımlanır.
   Böylece 12 modülün stiline dokunmadan koyu vitrin çalışır. */
.hero,.kok,.cdurum,.oz,.zh-cnot{
  --sf:rgba(255,255,255,.07); --sf2:rgba(255,255,255,.11); --bg:rgba(255,255,255,.06); --bg2:rgba(255,255,255,.09);
  --line:rgba(255,255,255,.1); --line2:rgba(255,255,255,.18); --wait:rgba(255,255,255,.22);
  --ink:#ffffff; --txt:rgba(255,255,255,.87); --mut:rgba(255,255,255,.7); --fnt:rgba(255,255,255,.58);
  --sh:none; --shs:none; --hov:0 16px 30px -18px rgba(0,0,0,.6);
  --ok:#3fcf8e; --miss:#ff8a90; --amb:#f2b84b; --acch:#ffb595;
  --c-saglik:#2dd4bf;--c-spor:#a78bfa;--c-maneviyat:#facc15;--c-gelisim:#a3e635;--c-zihin:#c4b5fd;
  --c-is:#94a3b8;--c-para:#4ade80;--c-eticaret:#22d3ee;--c-marka:#f472b6;--c-imaj:#d6a77a;
  --c-sosyal:#fb7185;--c-varlik:#a8a29e;--c-kisisel:#cbd5e1;--c-beceri:#a5b4fc;--c-claude:#e29a7d;--c-gorev:#a5b4fc;--c-arsiv:#7fb2ff;
  color:#fff;
}
.hero h3,.hero b,.hero .m-satir b,.hero .sh h2{color:#fff}
.hero .m-halka text{fill:#fff}
.hero .m-cubuk .gc-s i{background:rgba(255,255,255,.75)}
.hero .m-cubuk .gc-s.vurgu i{background:var(--acc)}
.hero .m-cizgi .gz-cizgi,.hero .m-cizgi .gz-son{stroke:#fff;background:#fff}
.hero .m-cizgi .gz-dolgu{fill:#fff;opacity:.12}
.hero .card,.kok .card{background:rgba(255,255,255,.07);box-shadow:none}
.hero .inp,.kok .inp{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.14);color:#fff}
.hero .scl button,.kok .scl button{background:rgba(255,255,255,.08);color:rgba(255,255,255,.65)}
.hero .scl button[aria-pressed="true"]{background:#fff;color:#16122e}
.hero .cb i,.kok .cb i{background:linear-gradient(90deg,rgba(255,255,255,.55),#fff)}
/* koyu kutudaki mod/etiket şeridi */
.kok .sp-hl,.hero .sp-hl{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px;position:relative;z-index:1}
.kok .sp-hl span,.hero .sp-hl span{font-size:11.5px;font-weight:600;color:rgba(255,255,255,.72);
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.08);border-radius:999px;padding:5px 11px}

/* ============ 28 · ufak düzeltmeler ============ */
.yuk i{max-width:46px;margin:0 auto}
a.cn{text-decoration:none;display:block}
@media (hover:hover){a.cn:hover{background:rgba(255,255,255,.14);transform:translateY(-3px);box-shadow:0 16px 30px -18px #000}}
a.cn::after{content:"›";position:absolute;right:11px;top:10px;font-size:15px;color:rgba(255,255,255,.35);transition:transform .3s,color .3s}
@media (hover:hover){a.cn:hover::after{transform:translateX(3px);color:rgba(255,255,255,.7)}}
.canli .cn .sy2{overflow-wrap:anywhere}
.ustb .alt3.vakit{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.ustb .alt3 .nowdot{width:7px;height:7px;border-radius:50%;background:var(--acc);box-shadow:0 0 0 3px var(--tint);display:inline-block}
.ustb .alt3 b{color:var(--ink);font-weight:600}
.ustb .alt3 .sep{color:var(--fnt)}
@media (max-width:660px){
  .ustb{flex-wrap:wrap}
  .ustb .bl{flex:1 1 55%}
  .ustb .sag{gap:6px}
  .ustb .seg{padding:2px}
  /* Baslik altindaki eylem (ör. "Sabah yoklamasını değiştir") artik alt yazinin
     icinde degil, kendi satirinda: baslikta yer daraltmiyor, dokunma alani buyuk. */
  .pg-eylem{margin:10px 0 2px}
  .pg-eylem .btn{max-width:100%}
  .ustb .seg a,.ustb .seg span,.ustb .seg button{height:28px;padding:0 10px;font-size:11.5px}
  .ustb h1{font-size:20px}
  .hava{height:36px;padding:0 10px 0 8px;gap:5px}
  .hava b{font-size:14px}
  .hava span:last-child{display:none}
  .icb{width:36px;height:36px;font-size:15px}
}
/* alan sayfalarında modül gövdesi ile yan sütun */
.mdz-yan .sec:not(.inp){padding-top:0}

/* ============ 29 · kart içi form ve boşluk düzeltmeleri ============ */
.card > .frm,.k > .frm,.pulse > .frm{padding:16px var(--a4)}
.card > .kb + .frm{padding-top:0}
.card > .olcek10,.card > .cizelge,.card > .hafta-t{margin:14px 16px}
.yazkutu > .frm{padding:0}
.ctxk > .frm{padding:0}
.sec:not(.inp) > .card > .ekle:first-child{border-top:0}
.tek{display:grid;gap:14px;align-content:start;max-width:860px;margin:0 auto}
/* .tek > .sec yan boşluğu artık sıfırlanmıyor: mobilde kartlar ekran kenarına yapışıyordu.
   Masaüstünde zaten 40. bölümdeki min-width:1024px kuralı sıfırlıyor. */
.pf-koyu .pf-ust + .pr{border-top:1px solid rgba(255,255,255,.1)}
.pj .mus,.tah span,.tlp p{overflow-wrap:anywhere}
.m-sekme a,.sek a{text-decoration:none}
.oz{margin-bottom:0}

/* ============ 30 · .gc iki biçim: emoji + gövde (gündem) ve düz kart (hafıza notu) ============ */
.gc{display:block}
.gc:has(> .e){display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start}
.gc-top{display:flex;align-items:center;gap:8px;margin-bottom:7px;flex-wrap:wrap}
.gc-top .stamp{margin-left:auto;font-size:11px;color:var(--fnt);white-space:nowrap}
.gc .acts{margin-top:12px}
.hf-metin{font-size:14px!important;font-weight:400!important;line-height:1.6}

/* ============ 31 · hizalama · bildirim · profil kutusu düzeltmeleri ============ */
/* Bölüm kabuğu ile sekme şeridi aynı sol kenardan başlasın (masaüstü) */
@media (min-width:1024px){
  .sec:not(.inp),.pg-hd{padding-left:0;padding-right:0}
  .icerik .sec:not(.inp){padding-top:24px}
}
/* Koyu profil kutusundaki yazılar her iki temada da beyaz */
.card.pf-koyu .pf-ust .bilgi b,article.pf-koyu .pf-ust .bilgi b{color:#fff}
.card.pf-koyu .pf-ust .bilgi span,article.pf-koyu .pf-ust .bilgi span{color:rgba(255,255,255,.62)}
.card.pf-koyu .pf-ust .rozet,article.pf-koyu .pf-ust .rozet{color:#ffd7c4;background:rgba(255,255,255,.14)}
/* v0.94: "meslek ekle" düz yazı değil, meslek alanına götüren bağlantı */
.pf-ust .pf-mes{display:block;padding:0;font-size:12.5px;color:rgba(255,255,255,.72);text-decoration:underline dotted;text-underline-offset:3px}
@media (hover:hover){.pf-ust .pf-mes:hover{color:#fff}}
/* v0.94: kod → ad etiketi satır başlığının (.pr b, .pr small, .tg b) blok stilini almasın; cümlenin içinde kalsın */
.kod-ad > b.priv{display:inline;font-size:inherit;gap:0}
.kod-ad > small.kod{display:inline;margin:0}
/* v0.94: takvimin ay okları genel .icb (38 px gölgeli kutu, hover'da kalkma) değil; tk-n kendi stilini taşır */
.secici .tk-n{width:34px;height:34px;border-radius:var(--rk);background:none;box-shadow:none;transform:none;color:var(--mut);flex:none;display:grid;place-items:center;border:0;cursor:pointer}
@media (hover:hover){.secici .tk-n:hover{transform:none}}
/* v0.94: takvimde ay/yıl seçimi ve elle yazma */
.tk-yaz{display:flex;gap:6px;padding:8px 10px 2px}
.tk-yaz .inp{flex:1;min-width:0;height:36px;font-size:14px;font-variant-numeric:tabular-nums;letter-spacing:.02em}
.tk-yaz .btn{flex:none;height:36px}
.tk-bas{display:flex;align-items:center;gap:2px;min-width:0}
.tk-sec{display:inline-flex;align-items:center;gap:3px;height:32px;padding:0 8px;border:0;border-radius:var(--rk);background:none;font:inherit;font-size:14.5px;font-weight:600;color:var(--ink);cursor:pointer;white-space:nowrap}
.tk-sec .ic{width:12px;height:12px;color:var(--fnt);transform:rotate(90deg);transition:transform 150ms ease}
.tk-sec.acik{background:var(--bg2)}
.tk-sec.acik .ic{transform:rotate(-90deg)}
.tk-ag{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:8px 10px 12px}
.tk-ag.yil{grid-template-columns:repeat(4,1fr)}
.tk-o{height:44px;border:0;border-radius:var(--rk);background:var(--bg2);font:inherit;font-size:14px;color:var(--txt);cursor:pointer;font-variant-numeric:tabular-nums}
.tk-o.gunb{box-shadow:inset 0 0 0 1px var(--line2);font-weight:600;color:var(--ink)}
.tk-o.secili{background:var(--ink);color:var(--bg);font-weight:600;box-shadow:none}
.tk-o[disabled]{opacity:.3;cursor:default}
.secici.pop .tk-o{height:38px;font-size:13.5px}
@media (hover:hover) and (pointer:fine){.tk-sec:hover{background:var(--bg2)}.tk-o:hover:not([disabled]):not(.secili){background:var(--sf2);box-shadow:inset 0 0 0 1px var(--ink)}}
.card.pf-koyu .pr b,article.pf-koyu .pr b{color:#fff}
.card.pf-koyu .pr span,article.pf-koyu .pr span{color:rgba(255,255,255,.6)}
.card.pf-koyu .git2,article.pf-koyu .git2{color:rgba(255,255,255,.5)}
.pf-koyu{color:#fff}

/* Bildirim (toast) içeriğe değmesin: içerik alanında ortalı, belirgin gölge */
.toast{max-width:min(520px,calc(100vw - 28px));bottom:calc(env(safe-area-inset-bottom) + 96px);
  box-shadow:0 22px 46px -18px rgba(10,8,30,.6);z-index:60}
@media (min-width:1024px){
  .toast{left:var(--rail);right:0;width:auto;max-width:520px;margin:0 auto;bottom:22px}
}
/* sayfa içi küçük uyarı ve not satırları bileşenlere yapışmasın */
.m-not{margin:10px 4px 0}
.privnote{margin:20px 4px 0;display:flex;gap:8px;align-items:flex-start}
.gwait{margin:12px 4px 0}
.sec:not(.inp) > .bos,.sec:not(.inp) > p.bos{margin:0 4px}
.ipuc{margin-top:5px}

/* ============ 32 · sohbet baloncuğu (maket) ============ */
.msg .bl3 .zm3{display:block;font-size:10.5px;margin-top:6px;opacity:.55}
.msg .bl3 .kay2{font-size:9.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;opacity:.75;margin-left:6px}
.msg .who{display:none}
.msg.c .bl3{color:var(--txt)}
.msg .mt{white-space:pre-line}
.msg .dur{display:block;margin-top:5px;font-size:10.5px;opacity:.6;text-align:right}

/* ============ 33 · GİRİŞ EKRANI (maket: gr-*) ============ */
:root.giris-ac body{overflow-x:hidden}
/* Klavye odağı her etkileşimli öğede görünür (girdide .inp:focus halkası zaten var). */
.gr-seg button:focus-visible,.gr-g:focus-visible,.gr-d:focus-visible,.gr-ek summary:focus-visible{outline:2px solid var(--acc);outline-offset:2px;border-radius:10px}
.gr{position:relative;min-height:100dvh;display:grid;place-items:center;overflow:hidden;
  padding:calc(env(safe-area-inset-top) + 22px) calc(env(safe-area-inset-right) + 16px)
          calc(env(safe-area-inset-bottom) + 22px) calc(env(safe-area-inset-left) + 16px)}
.gr-fon{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;
  transform:translate3d(calc(var(--px,0) * -14px),calc(var(--py,0) * -12px),0);transition:transform .5s cubic-bezier(.2,.7,.3,1)}
.gr-fon span{position:absolute;width:min(72vw,560px);aspect-ratio:1;border-radius:50%;filter:blur(64px);opacity:.34;will-change:transform}
.gr-fon .f1{left:-16vw;top:-14vh;background:radial-gradient(circle at 38% 38%,var(--acc),transparent 62%);animation:gf1 24s ease-in-out infinite alternate}
.gr-fon .f2{right:-14vw;bottom:-12vh;background:radial-gradient(circle at 58% 42%,var(--c-zihin),transparent 62%);animation:gf2 30s ease-in-out infinite alternate}
.gr-fon .f3{width:min(46vw,400px);left:46%;top:54%;opacity:.16;background:radial-gradient(circle,var(--ok),transparent 60%);animation:gf3 36s ease-in-out infinite alternate}
.gr-fon::after{content:"";position:absolute;inset:-10%;opacity:.5;
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:44px 44px;
  -webkit-mask-image:radial-gradient(circle at 50% 42%,#000,transparent 72%);mask-image:radial-gradient(circle at 50% 42%,#000,transparent 72%)}
:root.dark .gr-fon span{opacity:.42}
@keyframes gf1{to{transform:translate(8vw,6vh) scale(1.12)}}
@keyframes gf2{to{transform:translate(-7vw,-5vh) scale(1.08)}}
@keyframes gf3{to{transform:translate(-4vw,4vh) scale(1.16)}}
@keyframes grGir{from{opacity:0;transform:translateY(20px) scale(.985)}to{opacity:1;transform:none}}

.gr-t{position:fixed;top:calc(env(safe-area-inset-top) + 12px);right:calc(env(safe-area-inset-right) + 12px);z-index:3;display:flex;gap:8px}
.gr-t .icb{width:44px;height:44px}
.gr-s{position:relative;z-index:1;display:grid;justify-items:center;gap:0;width:100%;max-width:420px}
/* Koyu marka paneli (v0.68): maskot şeridinin yerini aldı. HER İKİ temada koyu kalır — maketteki
   gibi açık sayfanın üstünde kontrast bir yüzey. Tema değişkenleri kullanılmaz, kendi paleti vardır. */
/* order:-1 iki yerde birden ise yarar: dar ekranda panel formun ÜSTÜNE, geniş ekranda SOL sütuna geçer.
   DOM'da form önce durur (odak sırası önce forma gitsin), görsel sıra CSS'ten gelir. */
.gr-v{order:-1;position:relative;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;
  border-radius:26px;padding:30px 28px 28px;color:#efedff;isolation:isolate;
  background:linear-gradient(158deg,#191634 0%,#100d24 55%,#0a0818 100%);
  border:1px solid rgba(255,255,255,.08);box-shadow:0 44px 100px -46px rgba(0,0,0,.85);
  animation:grGir .6s cubic-bezier(.2,.75,.3,1) both}
/* Maketteki çapraz parıltı: imleçle kaymaz, sabit durur ki metni yıkamasın. */
.gr-v::before{content:"";position:absolute;z-index:-1;top:-32%;right:-24%;width:58%;height:164%;transform:rotate(19deg);
  background:linear-gradient(104deg,transparent 18%,rgba(255,255,255,.17) 50%,transparent 82%);filter:blur(14px);pointer-events:none}
/* Logo filigranı: üstten taşar, maketteki gibi tepesi kırpılır. */
.gr-v-fl{position:absolute;z-index:-1;top:-7%;left:50%;transform:translateX(-50%);width:74%;line-height:0;
  opacity:.13;color:#fff;pointer-events:none;
  /* Logonun gövdesi degrade (url(#lg-grad)) — currentColor tek başına yetmiyor: filigran tek renk olsun diye
     doygunluk sıfırlanıp beyaza itilir, yoksa maketteki gri filigran yerine mavi bir leke çıkıyor. */
  filter:grayscale(1) brightness(3)}
.gr-v-fl .logo{width:100%;height:auto}
/* İmleci izleyen yumuşak ışık: değişkenleri girisEfekt() panelin kendi sınırlarına göre yazar. */
.gr-v::after{content:"";position:absolute;z-index:-1;inset:0;border-radius:inherit;pointer-events:none;opacity:.6;
  background:radial-gradient(420px circle at var(--mx,72%) var(--my,16%),rgba(255,255,255,.10),transparent 64%)}
.gr-v-ic{position:relative}
.gr-v-ad{display:block;margin-bottom:14px;font-size:13px;font-weight:500;letter-spacing:.04em;color:rgba(239,237,255,.72)}
.gr-v-b{margin:0 0 10px;font-size:25px;font-weight:600;letter-spacing:-.03em;line-height:1.2;color:#fff}
.gr-v-p{margin:0 0 10px;font-size:13px;line-height:1.6;color:rgba(239,237,255,.74)}
.gr-v-p2{margin:0;font-size:12.5px;line-height:1.55;color:rgba(239,237,255,.56)}
/* İç kart (maketteki CTA kutusu): maskot + dönen ipucu. */
.gr-v-k{display:flex;align-items:center;gap:13px;margin-top:22px;padding:14px;border-radius:18px;
  background:rgba(255,255,255,.065);border:1px solid rgba(255,255,255,.09)}
.gr-v-mk{width:52px;height:52px;flex:none;border-radius:50%;object-fit:cover;object-position:50% 3%;
  background:rgba(255,255,255,.08)}
.gr-v-kt{min-width:0}
.gr-v-kt b{display:block;font-size:12px;font-weight:600;color:rgba(239,237,255,.66);margin-bottom:3px}
.gr-v-kt p{margin:0;font-size:13px;line-height:1.45;color:#fff;animation:grGir .45s ease both}
/* Kart zemini %94: animasyonlu hâleler metnin altından geçerken kontrast düşmesin. */
.gr-k{width:100%;position:relative;background:color-mix(in srgb,var(--sf) 94%,transparent);backdrop-filter:blur(18px);
  border:1px solid var(--line);border-radius:var(--r);padding:26px 24px 22px;box-shadow:0 34px 90px -34px rgba(24,20,48,.5);
  animation:grGir .6s cubic-bezier(.2,.75,.3,1) .1s both}
/* İmleci izleyen yumuşak ışık (app.js girisEfekt --mx/--my yazar; dokunmatikte hiç çalışmaz). */
@media (hover:hover) and (pointer:fine){
  .gr-k::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:.55;
    background:radial-gradient(240px circle at var(--mx,50%) var(--my,0%),color-mix(in srgb,var(--acc) 12%,transparent),transparent 70%)}
}
:root.dark .gr-k{box-shadow:0 34px 90px -30px rgba(0,0,0,.85)}
.gr-k::before{content:"";position:absolute;inset:0 16px auto;height:1px;background:linear-gradient(90deg,transparent,var(--acc),transparent);opacity:.6}
.gr-k.sars{animation:grSars .4s}
@keyframes grSars{0%,100%{transform:none}25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
.gr-mr{display:flex;align-items:center;gap:12px;margin-bottom:20px}
.gr-lg,.gr-mr .logo{width:38px;height:38px;flex:none;color:var(--ink)}
.gr-mr b{display:block;font-size:15.5px;font-weight:600;letter-spacing:.06em;color:var(--ink);line-height:1.2}
.gr-mr span{display:block;font-size:12px;color:var(--mut)}
.gr-h{margin:0 0 8px;font-size:28px;font-weight:600;letter-spacing:-.035em;color:var(--mut);line-height:1.15}
.gr-h b{font-weight:600;background:linear-gradient(92deg,var(--acc),var(--acch,#ff9d5c));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.gr-p{margin:0 0 18px;font-size:13.5px;color:var(--mut);line-height:1.55}
.gr-seg{display:grid;grid-template-columns:1fr 1fr;background:var(--bg2);border-radius:var(--rk);padding:4px;gap:2px;margin-bottom:16px}
.gr-seg button{height:44px;border:0;border-radius:10px;background:none;font:inherit;font-size:13px;font-weight:600;color:var(--mut);cursor:pointer}
.gr-seg button[aria-selected="true"]{background:var(--sf);color:var(--ink);box-shadow:var(--shs)}
.gr-f{display:grid;gap:13px}
.gr-f label{display:block;margin-bottom:5px;font-size:12px;font-weight:500;color:var(--mut)}
.gr-a{position:relative}
.gr-f .inp{height:48px;font-size:15px;width:100%}
.gr-g{position:absolute;right:2px;top:2px;width:44px;height:44px;border:0;background:none;border-radius:var(--rs);color:var(--mut);
  display:grid;place-items:center;cursor:pointer;transition:transform .2s,opacity .2s,background-color .2s,color .2s,border-color .2s,box-shadow .2s}
@media (hover:hover){.gr-g:hover{background:var(--bg2);color:var(--ink)}}
.gr-g.acik{color:var(--acc)}
.gr-g .ic{width:18px;height:18px}
.gr-d{height:48px;font-size:15px;justify-content:center;position:relative;overflow:hidden;width:100%}
/* Parıltı sürekli dönmüyor (koyu temada beyaz düğmede zaten görünmüyordu): yalnız fareyle üstüne gelince. */
.gr-d::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.22) 50%,transparent 70%);
  transform:translateX(-100%)}
@media (hover:hover) and (pointer:fine){.gr-d:hover::after{animation:grPrlt 1.1s ease-in-out}}
:root.dark .gr-d::after{background:linear-gradient(105deg,transparent 30%,rgba(24,20,48,.16) 50%,transparent 70%)}
@keyframes grPrlt{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
.gr-d[disabled]{opacity:.75}
.gr-soz{margin:16px 0 0;padding:12px 14px;border-radius:var(--rs);background:var(--bg2);border-left:3px solid color-mix(in srgb,var(--ok) 60%,transparent)}
.gr-soz p{margin:0;font-size:12.5px;line-height:1.55;color:var(--txt)}
.gr-soz small{display:block;margin-top:6px;font-size:11.5px;color:var(--mut)}
.gr-rz{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.gr-rz span{font-size:11.5px;font-weight:500;color:var(--mut);background:var(--bg2);border:1px solid var(--line);
  border-radius:999px;padding:5px 11px;opacity:0;animation:grGir .5s cubic-bezier(.2,.75,.3,1) both}
/* "Bugün ne var?" katlanır: kritik yol (alanlar + düğme) ilk ekranda kalsın, süs altta dursun. */
.gr-ek{margin:16px 0 0}
.gr-ek summary{min-height:44px;display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--mut);cursor:pointer;list-style:none}
.gr-ek summary::-webkit-details-marker{display:none}
.gr-ek summary::after{content:"▾";font-size:11px;transition:transform .2s var(--ease,ease)}
.gr-ek[open] summary::after{transform:rotate(180deg)}
.gr-caps{margin:0;font-size:12px;color:var(--amb)}
.gr-ip{margin:-4px 0 0;font-size:11.5px;color:var(--mut);line-height:1.5}
.gr-ip code{font-size:11px;background:var(--bg2);border-radius:5px;padding:1px 5px}
.gr-n{display:flex;align-items:flex-start;gap:8px;margin:14px 0 0;padding-top:14px;border-top:1px solid var(--line);
  font-size:11.5px;color:var(--mut);line-height:1.55}
.gr-c{display:flex;align-items:center;gap:7px;justify-content:center;margin:15px 0 calc(env(safe-area-inset-bottom) + 4px);font-size:11.5px;color:var(--mut)}
.gr-c i{width:7px;height:7px;border-radius:50%;background:var(--ok);animation:grNbz 2.2s ease-in-out infinite}
.gr-c.yok i{background:var(--miss);animation:none}
@keyframes grNbz{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--ok) 55%,transparent)}70%,100%{box-shadow:0 0 0 7px transparent}}
/* Hata satırı her zaman yer kaplar: hata çıkınca kart büyüyüp altındaki her şeyi aşağı itmesin. */
.gr .err{margin:12px 0 0;min-height:1.2em;font-size:13px;line-height:1.35;color:var(--miss)}
.gsp{display:inline-block;width:15px;height:15px;margin-right:8px;vertical-align:-2px;border-radius:50%;
  border:2px solid currentColor;border-top-color:transparent;animation:grDon .7s linear infinite}
@keyframes grDon{to{transform:rotate(360deg)}}
@media (max-width:640px){
  .gr-k{padding:22px 18px 18px}
  .gr-h{font-size:24px}
  .gr-f .inp{font-size:16px}   /* iOS odakta yakınlaştırmasın */
}
/* Kısa ekran (klavye açık ya da yatay telefon): maskot şeridi kalkar, kritik yol görünür kalır. */
@media (max-height:700px){
  .gr-v{display:none}
  .gr{padding-top:calc(env(safe-area-inset-top) + 12px);padding-bottom:calc(env(safe-area-inset-bottom) + 12px)}
}
/* Dar ekran: koyu panel formun ÜSTÜNE geçer ve kompakt bir şeride iner (maskot + dönen ipucu).
   Marka metni orada yer kaplamasın diye gizlenir; iç kart zemini de panelin kendisi olur. */
@media (max-width:919px){
  .gr-v{margin-bottom:14px;padding:11px 13px;border-radius:var(--rs);min-height:0;
    box-shadow:0 18px 40px -26px rgba(0,0,0,.7)}
  .gr-v::before,.gr-v-fl,.gr-v-ad,.gr-v-b,.gr-v-p,.gr-v-p2{display:none}
  .gr-v-k{margin:0;padding:0;background:none;border:0;gap:11px}
  .gr-v-mk{width:44px;height:44px}
  .gr-v-kt b{font-size:11px}
  .gr-v-kt p{font-size:12.5px}
}
/* Yüklenirken (giriş_durum yanıtı gelmeden) boş kart: eski ekran kalmasın, zıplama olmasın. */
.gr-bos{min-height:340px;opacity:.55}
/* Geniş ekran: iki sütun — solda maskot ve balon, sağda kart. 416 px'lik tek sütun 1440 px'te ekranı boş bırakıyordu. */
@media (min-width:920px){
  .gr-s{grid-template-columns:minmax(360px,468px) minmax(300px,392px);align-items:center;justify-items:stretch;
    gap:clamp(30px,4.5vw,72px);max-width:920px}
  /* Maketteki gibi form sütununda kart yok: doğrudan sayfanın üstünde durur, ağırlık koyu paneldedir.
     :root.dark .gr-k de yazılmalı — o kuralın özgüllüğü daha yüksek, yoksa kart gitmesine rağmen gölgesi
     kalıp formun altında boşlukta duran bir leke bırakıyor. */
  .gr-k,:root.dark .gr-k{background:none;border:0;box-shadow:none;backdrop-filter:none;padding:0}
  .gr-k::before,.gr-k::after{display:none}
  .gr-v{min-height:560px}
  .gr-c{grid-column:1 / -1}
}
@media (min-width:920px) and (max-height:820px){
  .gr-v{min-height:470px;padding:24px 22px 22px}
  .gr-v-b{font-size:22px}
}
/* Geniş ama KISA ekran (1366x768 dizüstü, yatay tablet): maskot zaten gizli — ızgara tek sütuna düşsün,
   yoksa kart 420 px'lik ikinci sütunda kalıp sağa yaslanıyordu. */
@media (min-width:920px) and (max-height:700px){
  .gr-s{grid-template-columns:420px;justify-content:center;max-width:420px}
  /* Panel gizlendiğinde form tek başına kalıyor: kart giydirmesi geri gelsin, boşlukta yüzmesin (v0.68).
     Yukarıdaki soyma kuralı :root.dark ile yazıldığı için burada da öyle yazılmalı; düz .gr-k onu yenemez
     ve koyu temada "kart yok ama gölgesi var" hâli kalırdı. */
  .gr-k,:root.dark .gr-k{background:color-mix(in srgb,var(--sf) 94%,transparent);backdrop-filter:blur(18px);
    border:1px solid var(--line);padding:26px 24px 22px;box-shadow:0 34px 90px -34px rgba(24,20,48,.5)}
  :root.dark .gr-k{box-shadow:0 34px 90px -30px rgba(0,0,0,.85)}
  .gr-k::before,.gr-k::after{display:block}
}
@media (prefers-reduced-motion:reduce){
  .gr-fon span,.gr-d::after,.gr-c i{animation:none!important}
  .gr-k,.gr-v,.gr-v-kt p,.gr-rz span{animation:none!important;opacity:1!important}
}

/* ============ 34 · KPI şeridi maketin .ok4 karoları gibi ============ */
.st{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;padding:0 20px 2px}
@media (min-width:760px){.st{grid-template-columns:repeat(4,minmax(0,1fr))}}
.st > div,.st > button{border-radius:var(--rs);padding:15px;box-shadow:var(--sh);position:relative;overflow:hidden;border:0;text-align:left;
  background:linear-gradient(160deg,color-mix(in srgb,var(--c,var(--mut)) 15%,var(--sf)),var(--sf) 72%);
  transition:transform .38s cubic-bezier(.2,.9,.3,1.04),box-shadow .38s}
@media (hover:hover){.st > div:hover,.st > button:hover{transform:translateY(-3px);box-shadow:var(--hov)}}
.st .ic{width:24px;height:24px;color:var(--c,var(--mut));display:block;margin-bottom:9px}
.st b{display:block;font-size:23px;font-weight:700;letter-spacing:-.035em;color:var(--ink);font-variant-numeric:tabular-nums;line-height:1.05;margin-top:0}
.st b small,.st b em{font-size:12px;font-weight:600;color:var(--mut);margin-left:2px;font-style:normal}
.st span{display:block;font-size:11px;color:var(--mut);margin-top:5px;line-height:1.35;white-space:normal}
.st button.lnk{font-size:11.5px}

/* Sağlık ve Spor vitrinleri koyu kutuya döndü: iç parçalar token haritasını kullanır */
[data-m] .hero.sg-hero,[data-m] .hero.sp-hero{padding:19px;border-radius:var(--r);color:#fff;
  background:radial-gradient(118% 128% at 8% -12%,#342c63 0%,var(--kok1) 46%,var(--kok2) 100%);
  box-shadow:0 22px 44px -24px rgba(20,12,60,.7)}
[data-m] .hero.sg-hero.iyi::after,[data-m] .hero.sp-hero::after{background:radial-gradient(circle,color-mix(in srgb,var(--c,#7c5cff) 42%,transparent),transparent 66%)}
.sg-hero .sg-mini > div,.sp-hero .sp-mini > div{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.08);border-radius:var(--rs);box-shadow:none}
.sg-hero .sg-h-et,.sp-hero .sp-h-et{display:inline-flex;align-items:center;gap:7px;font-size:10px;font-weight:700;letter-spacing:.13em;
  text-transform:uppercase;padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.12);color:#ffc7ad}
.sg-hero h3,.sp-hero h3{color:#fff;margin-top:12px}
.sg-hero .lnk,.sp-hero .lnk{color:rgba(255,255,255,.8)}
.sg-hero .sg-senk,.sp-hero .sp-senk{color:rgba(255,255,255,.5);font-size:11.5px}

/* ============ 35 · animasyonlar yalnız sayfa değişince oynasın ============
   Ekran her dokunuşta yeniden çizildiği için çubuk ve sütun animasyonları
   varsayılan olarak kapalı; giriş animasyonu sadece #ekran.yeni'de çalışır.
   Değeri değişen çubuklar (su, hedef…) barlariBoya() ile yumuşak geçer. */
@keyframes yt-dol{from{width:0}}
@keyframes yt-cik2{from{transform:scaleY(.06)}}
@keyframes yt-buyu{from{transform:scaleY(0)}}

.cb i,.kur-c i,.cd-c i,.cizgi .yol i,.su-c i,.hfz-b i,.par-o i,.bcr-c i{
  width:var(--w,0);animation:none;transition:width .85s cubic-bezier(.2,1.15,.3,1)}
.brr i{transform:scaleY(var(--h,1));animation:none}
.cizelge i,.yuk i,.cift-c .cc-b i{transform:none;animation:none}
#ekran.yeni .cb i,#ekran.yeni .kur-c i,#ekran.yeni .cd-c i,#ekran.yeni .cizgi .yol i{
  animation:yt-dol 1.3s cubic-bezier(.2,.85,.25,1) .15s both}
#ekran.yeni .brr i{animation:yt-cik2 .85s cubic-bezier(.2,1.45,.4,1) both}
#ekran.yeni .cizelge i,#ekran.yeni .yuk i{animation:yt-buyu .8s cubic-bezier(.2,1.4,.4,1) both}
.su-c i::after{animation:none}
.cb i::after{animation:none}
#ekran.yeni .cb i::after{animation:sup 1.5s cubic-bezier(.3,.6,.4,1) 1.2s 1}

/* ============ 36 · hedef satırı ============ */
.cb{background:color-mix(in srgb,var(--c,var(--mut)) 13%,var(--bg2))}
.cb.bos{background:var(--bg2);opacity:.5}
.hd p span:last-child{color:var(--fnt);white-space:nowrap}
.hd-t i{font-style:normal}

/* ============ 37 · sabah yoklaması ve liste dokunuşu ============ */
.mood .m-etiketler + .mrow{margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}
.mood .mrow textarea.inp{margin-top:6px}
.uyku label{margin-bottom:0}
.uyku .inp,.gl2 .inp{margin-top:5px}
.sat,.m-onay,.vkt-k,.cp,.kur-s,.hal{cursor:pointer}
.sat:active{transform:scale(.995)}
.gc{cursor:default}

/* kapanış animasyonu (gündem kartı) */
.gc.kapan{overflow:hidden}


/* ============ 38 · koyu temada düğme ve yüzey kontrastı ============
   Koyu temada --bg2 ile --sf aynı tondaydı; kart üstündeki düğmeler kayboluyordu. */
/* koyu --bg2 artık 1 · tokenlar'da (#242046) */
:root.dark .btn{border-color:var(--line2)}
:root.dark .btn.ink,:root.dark .btn.ana,:root.dark .btn.bey{border-color:transparent}
:root.dark .btn.ghost,:root.dark .btn.gh{border-color:transparent;background:transparent}
@media (hover:hover){:root.dark .btn.ghost:hover,:root.dark .btn.gh:hover{background:var(--bg2)}}
:root.dark .chip{border-color:var(--line2)}
/* Cevap satırı (Yaptım · Minimum · Yapmadım · Bugün pas).
   ESKİDEN repeat(var(--n),1fr) idi: 1fr'in alt sınırı min-content, düğme yazısı da
   sarmıyor. Dört seçenekli bir rutinde (ör. "Diyafram nefesi") satırın min-content'i
   443 px çıkıyor ve 412 px'lik telefonda SAYFANIN TAMAMINI o genişliğe zorluyordu:
   kartlar ekrandan taşıyor, metin kenardan kesiliyordu. auto-fit + minmax(84px,1fr)
   ile satır dar ekranda kendiliğinden alt alta sarıyor ve min-content 84 px'te kalıyor. */
.ans{display:grid;grid-template-columns:repeat(auto-fit,minmax(84px,1fr));gap:7px;margin-top:11px}
.ans .btn{height:38px;padding:0 8px;font-size:13px;justify-content:center;background:var(--bg2);
  border-color:var(--line2);min-width:0;overflow:hidden;text-overflow:ellipsis}
.ans .btn.yes{background:color-mix(in srgb,var(--ok) 14%,transparent);border-color:color-mix(in srgb,var(--ok) 32%,transparent);color:var(--ok-t);font-weight:700}
.ans .btn.yes .ic{color:var(--ok-t)}
@media (hover:hover){.ans .btn:hover{background:var(--sf2);transform:translateY(-2px)}}
.row{padding:13px 16px}
.row + .row{border-top:1px solid var(--line)}
.row-top b{font-size:14.5px;font-weight:600}
.row-alt{margin:6px 0 0 30px;font-size:12px;color:var(--mut)}
.nxt .lbl{color:var(--fnt)}

/* ============ 39 · plan: cetvel saatleri, mod karoları ============ */
.tl-r .zm,.tl-r .tl-t{font-size:18px;font-weight:700;letter-spacing:-.03em;padding-top:17px}
.tl-r .zm small,.tl-r .tl-t small{font-size:11.5px;margin-top:2px}
.tl-v time{font-size:15px;font-weight:600}
.tl-now time{font-size:14px}
@media (max-width:640px){.tl-r,.tl-v,.tl .tl-now,.tl-now{grid-template-columns:54px 1fr;gap:10px;padding:0 14px}
  .tl-r .zm,.tl-r .tl-t{font-size:16px}}
.mod button{border:1px solid transparent;position:relative;overflow:hidden}
@media (hover:hover){.mod button:hover{transform:translateY(-3px);box-shadow:var(--sh);background:var(--sf2);border-color:var(--line2)}}
.mod button:active{transform:scale(.97)}
.mod button .e{transition:transform .35s cubic-bezier(.2,1.5,.4,1)}
@media (hover:hover){.mod button:hover .e{transform:scale(1.12) rotate(-6deg)}}
.mod button.on{background:color-mix(in srgb,var(--acc) 13%,transparent);
  border-color:color-mix(in srgb,var(--acc) 42%,transparent);box-shadow:none}
.mod button.on::after{content:"✓";position:absolute;top:8px;right:10px;font-size:12px;font-weight:700;color:var(--acch)}
@media (hover:hover){.mod button.on:hover{background:color-mix(in srgb,var(--acc) 18%,transparent)}}
.mod button[disabled]{opacity:1;cursor:default}
@media (hover:hover){.mod button[disabled]:hover{transform:none;box-shadow:none}}

/* ============ 40 · bekleyen konular ve bölüm araları ============ */
.alan-dikkat{padding-bottom:6px}
.alan-dikkat .gc{border-left:3px solid var(--miss)}
.sec:not(.inp) + .sec:not(.inp){padding-top:22px}
.grp,.pr-grp,.ys-g{padding:16px 4px 6px}
.sec:not(.inp) > .grp:first-child{padding-top:0}
.yazkutu{padding:14px 16px}
.yazkutu + .yazkutu{margin-top:var(--a3)}
.ikili > div > .sec:not(.inp):first-child{padding-top:0}
.bugun .col > .sec:not(.inp):first-child{padding-top:0}

/* ============ 41 · bölüm araları: bekleyen konular sekme şeridine değmesin ============ */
.m-sekme{margin-top:20px}
.sec:not(.inp) > .sek,.sec:not(.inp) > .m-sekme{margin-top:0}
.alan-dikkat{padding-bottom:0}
.mdz-ana > [data-m] > .m-sekme:first-child{margin-top:20px}
.sec:not(.inp).alan-dikkat + .sec:not(.inp){padding-top:22px}

/* ============ 42 · Sağlık vitrini maketin ölçüm karoları gibi ============ */
.sg-hero .sg-mini,.sp-hero .sp-mini{grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:9px;margin-top:16px}
.sg-hero .sg-mini > div,.sp-hero .sp-mini > div{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.08);
  border-radius:var(--rs);padding:12px;box-shadow:none}
.sg-hero .sg-mini > div > span,.sp-hero .sp-mini > div > span{font-size:9.5px;font-weight:700;letter-spacing:.13em;
  text-transform:uppercase;color:rgba(255,255,255,.48)}
.sg-hero .sg-mini b,.sp-hero .sp-mini b{font-size:22px;font-weight:700;letter-spacing:-.04em;color:#fff;margin-top:7px;
  font-variant-numeric:tabular-nums;line-height:1.05}
.sg-hero .sg-mini b em,.sp-hero .sp-mini b em{font-size:11px;font-weight:600;color:rgba(255,255,255,.55);font-style:normal;margin-left:2px}
.sg-hero .sg-mini small,.sp-hero .sp-mini small{font-size:10.5px;color:rgba(255,255,255,.5);margin-top:4px;display:block;line-height:1.35}
.sg-hero .sg-evre{height:12px;border-radius:7px;margin-top:14px}
.sg-hero .sg-evre-lej{color:rgba(255,255,255,.6);margin-top:8px}
.sg-hero .sg-evre-lej b{color:#fff}
.sg-hero .sg-bar{background:rgba(255,255,255,.16)}
.sg-hero .sg-bar i{background:#fff}
.sg-hero .sg-h-ust{display:flex;align-items:flex-start;gap:12px}
.sg-hero .sg-h-ust > div{flex:1;min-width:0}

/* ============ 43 · geri bildirim düzeltmeleri ============ */

/* 43a · hedef satırı: kart içinde yan boşluğu geri kazansın, sayı rozeti hizalansın */
.card > .hd,article > .hd{padding:14px var(--a4)}
.bugun .card > .hd,.bugun article > .hd{padding-left:18px;padding-right:18px}
.hd-t{align-items:center}
.hd-t b{line-height:1.3;letter-spacing:-.01em}
.hd-t i{flex:none;font-size:12.5px;padding:2px 8px;border-radius:999px;
  background:color-mix(in srgb,var(--c,var(--acc)) 14%,transparent);color:color-mix(in srgb,var(--c,var(--acc)) 82%,var(--ink))}
.hd .cb{margin-top:1px}
.hd p{margin-top:8px;align-items:baseline}
.hd p span:first-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (hover:hover){.hd:hover .hd-t b{color:color-mix(in srgb,var(--c,var(--acc)) 55%,var(--ink))}}
.hd-t b,.hd-t i{transition:color .3s}

/* 43b · alan karosu: sağ alttaki ok ve yuvarlak halka kaldırıldı */
.ak > span.git3.git3{display:none}
.ak::after{display:none}
@media (hover:hover){.ak:hover{transform:translateY(-4px);
  box-shadow:0 2px 6px rgba(28,20,70,.06),0 22px 42px -22px color-mix(in srgb,var(--c) 48%,rgba(28,20,70,.36))}}
.ak > span:not(.e):not(.git3){padding-right:2px}

/* 43c · "yapıldı" rozet düğmesi satırı bozuyordu (ikon 22px'e şişiyordu) */
.tik{display:inline-flex;align-items:center;gap:5px;height:28px;padding:0 11px;line-height:1;border:0}
.tik .ic{width:13px;height:13px;flex:none}
.rt-h{min-height:44px}

/* 43d · ölçek düğmesi seçiliyken koyu temada okunur olsun */
:root.dark .scl button[aria-pressed="true"],:root.dark .olcek10 button.on{color:#fff}
.scl button[aria-pressed="true"],.olcek10 button.on{box-shadow:0 8px 16px -8px color-mix(in srgb,var(--c,var(--acc)) 55%,transparent)}

/* ============ 44 · üst araçlar · görev satırı · su · gündem ============ */

/* 44a · hava/göz/tema her sayfada: alan sayfasının başlığında da yer bulsun */
.pg-top{gap:14px;flex-wrap:wrap}
.pg-top > .sag{display:flex;align-items:center;gap:8px;margin-left:auto;flex-wrap:wrap;justify-content:flex-end}
.hava{cursor:pointer}
@media (hover:hover){.hava:hover{background:var(--sf2);border-color:var(--line2);transform:translateY(-1px)}}
@media (max-width:640px){.pg-top > .sag .hava span{display:none}}

/* 44b · görev satırı: sil düğmesi satırın sağında, üstüne gelince çıkar */
.sat-s{display:flex;align-items:stretch;position:relative}
.sat-s + .sat-s{border-top:1px solid var(--line)}
.sat-s > .sat{flex:1;min-width:0}
.sat-s > .sat + .sat{border-top:0}
.sat-sil{flex:none;width:38px;display:grid;place-items:center;border:0;background:none;color:var(--fnt);
  opacity:0;transition:opacity .2s,color .2s,background .2s;cursor:pointer;border-radius:var(--rs)}
.sat-sil .ic{width:14px;height:14px}
.sat-sil:focus-visible{opacity:1}@media (hover:hover){.sat-s:hover .sat-sil{opacity:1}}
@media (hover:hover){.sat-sil:hover{color:var(--miss);background:color-mix(in srgb,var(--miss) 12%,transparent)}}
.sat-sil.onay{width:auto;opacity:1;padding:0 14px 0 4px;display:flex;align-items:center;gap:10px;background:none}
.sat-sil.onay .lnk{font-size:12px}
.sat-sil.onay .gk{color:var(--miss);font-weight:700}
@media (hover:none){.sat-sil{opacity:.55}}

/* 44c · onay kutucuğundaki tik ortalı olsun */
.hal .ic{width:11px;height:11px;display:block;color:currentColor}
.hal{line-height:0}
.sat.ok .hal .ic{color:#fff}

/* 44d · su sayacı: 0/2 L biçiminde */
.rt-sy small{font-size:11.5px;font-weight:600;color:var(--mut);margin-left:1px}
.su-a .btn{white-space:nowrap;width:100%;padding:0 8px}

/* 44e · gündem kartı düğmeleri: turuncu vurgulu, belirgin hover */
.gc .dug,.gc .acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.gc .dug .btn,.gc .acts .btn{position:relative;overflow:hidden}
/* Alan bildiriminin ertele / gerek yok seçenekleri (v0.69): ikincil düğmeler sağa yaslı ve sessiz; seçim açıkken
   üç süre aynı satırda kalır. Dokunmatikte hedef en az 40 px. */
.gc .ge-ek,.gc .ge-sec{display:flex;flex-wrap:wrap;gap:6px;margin-left:auto}
.gc .ge-ek .btn,.gc .ge-sec .btn{padding:0 10px}
@media (pointer:coarse){.gc .ge-ek .btn,.gc .ge-sec .btn{min-height:40px}}
.ge-frm .ge-ip{margin:2px 2px 4px;font-size:13px;line-height:1.5;color:var(--mut)}
:root.dark .gc .dug .btn.ana,:root.dark .gc .acts .btn.ana,
.gc .dug .btn.ana,.gc .acts .btn.ana{background:var(--acc-dolgu);color:var(--acc-ust);border-color:transparent;
  box-shadow:0 10px 22px -12px color-mix(in srgb,var(--acc) 85%,transparent)}
@media (hover:hover){:root.dark .gc .dug .btn.ana:hover,:root.dark .gc .acts .btn.ana:hover,.gc .dug .btn.ana:hover,.gc .acts .btn.ana:hover{background:var(--acch);color:#fff;filter:none;transform:translateY(-2px);
  box-shadow:0 16px 30px -12px color-mix(in srgb,var(--acc) 95%,transparent)}}
.gc .dug .btn:not(.ana),.gc .acts .btn:not(.ana){border-color:var(--line2);background:var(--bg2);color:var(--mut)}
@media (hover:hover){.gc .dug .btn:not(.ana):hover,.gc .acts .btn:not(.ana):hover{color:var(--acch);
  border-color:color-mix(in srgb,var(--acc) 48%,transparent);
  background:color-mix(in srgb,var(--acc) 11%,transparent);transform:translateY(-2px)}}
.gc .dug .btn:active,.gc .acts .btn:active{transform:scale(.97)}
@media (hover:hover){.gc:hover{border-color:color-mix(in srgb,var(--acc) 26%,var(--line))}}

/* ============ 45 · bölüm araları: vitrin altı ve grup başlıkları ============ */
/* §40'taki "ilk bölümün üst boşluğunu sil" kuralı yalnız sayfa başlığının hemen altında geçerli;
   sütunlar bir vitrin kartının altında başlıyorsa boşluk kalmalı, yoksa kutular birbirine değiyor. */
.ikili > div > .sec:not(.inp):first-child,.bugun .col > .sec:not(.inp):first-child{padding-top:22px}
.pg-hd + .ikili > div > .sec:not(.inp):first-child,
.pg-hd + .bugun .col > .sec:not(.inp):first-child,
.ikili > div > .sec:not(.inp).o1:first-child{padding-top:0}
.pg-hd + .sec:not(.inp):has(> .kok),.pg-hd + .sec:not(.inp):has(> .hero){padding-top:0}
/* Vitrin kartı ile altındaki sütunlar arasında nefes payı */
.sec:not(.inp):has(> .kok){padding-bottom:4px}

/* Grup başlığı ("BUGÜN", "PLANLANMAMIŞ") bölüm başlığına yakın dursun */
.sh + .grp,.sh + .pr-grp,.sh + .ys-g{padding-top:4px}
.card + .grp,.grp + .card{margin-top:0}

/* ============ 46 · alan sayfası başlık altı ve kart içi grafikler ============ */
.pg-hd .pg-sub{margin-bottom:2px}
.sec.alan-dikkat{padding-top:20px}
.alan-dikkat .sh{margin-bottom:10px}
.alan-durak{padding-top:20px}
/* Alan sayfasında ilk sekme şeridi başlığa değmesin */
.pg-hd + .m-sekme,.alan-dikkat + .m-sekme{margin-top:20px}
/* Kart içindeki çizelgeler kenara yapışmasın, gün etiketleri barlardan ayrılsın */
.kb > .cizelge,.card > .cizelge{margin-left:18px;margin-right:18px}
.cizelge{min-height:74px}
.cizelge > div{gap:6px}
.cizelge small{line-height:1.2;white-space:nowrap}
.cizelge + .acts,.cizelge + .m-not,.cizelge + p{margin-top:10px}

/* ============ 47 · İş: sekme şeridi, arama, akış kartları ============ */
/* Sekmeler <a> ile çiziliyor; seçili sekme belli olsun. */
.sek a,.sek button{flex:none;height:36px;padding:0 16px;border-radius:999px;font-size:13px;font-weight:600;color:var(--mut);
  white-space:nowrap;border:0;background:none;display:inline-flex;align-items:center;gap:7px;text-decoration:none;
  transition:background .22s,color .22s,transform .2s}
@media (hover:hover){.sek a:hover,.sek button:hover{background:var(--bg2);color:var(--ink)}}
.sek a.on,.sek a[aria-current="true"],.sek button.on{background:var(--ink);color:var(--sf)}
:root.dark .sek a.on,:root.dark .sek a[aria-current="true"],:root.dark .sek button.on{background:var(--secili);color:var(--secili-ink)}
.sek a .sy4,.sek button .sy4{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:999px;
  background:var(--bg2);font-size:11px;font-weight:700;color:inherit}
.sek a.on .sy4,.sek a[aria-current="true"] .sy4{background:rgba(255,255,255,.22)}
:root.dark .sek a.on .sy4,:root.dark .sek a[aria-current="true"] .sy4{background:rgba(0,0,0,.16)}
.sek{margin-bottom:0}

/* Arama kutusu: kart genişliğinde, ikonlu alan gibi dursun */
.is-ara{margin-bottom:12px}
.is-ara .inp{width:100%;height:42px;font-size:13.5px}
.is-ara .inp::-webkit-search-cancel-button{filter:grayscale(1);opacity:.5}

/* Akış sütunları: dar sütunda kart içi nefes alsın */
.asama{gap:13px;align-items:start}
@media (min-width:900px){.asama{grid-template-columns:repeat(auto-fit,minmax(272px,1fr))}}
.as-k{align-self:start}
.as-h{letter-spacing:.09em;color:var(--fnt)}
.pj{padding:14px 15px}
.pj b{font-size:13.5px}
.pj .mus{line-height:1.45;overflow-wrap:anywhere}
.pj .alt4{margin-top:10px}
.pj-a{flex-wrap:wrap;gap:6px;margin-top:12px}
.pj-a .btn{height:30px;padding:0 10px;font-size:12px}
.pj-a .as-n{margin-left:auto;padding-left:6px}
.pj .ilerle i{transition:width .6s cubic-bezier(.2,.9,.3,1)}

/* Tahsilat ve talep satırları dar ekranda taşmasın */
.tah{flex-wrap:wrap;row-gap:10px}
.tah > div:not(.sag3){flex:1 1 180px;min-width:0}
.tah .sag3{flex-wrap:wrap;row-gap:8px}
.tah .btn{height:32px;padding:0 12px;font-size:12.5px}
@media (max-width:760px){.tah .sag3{margin-left:0;flex:1 0 100%;justify-content:flex-start}
  .tah .tt2{font-size:16px}}
.tlp .acts,.tlp .sag3{flex-wrap:wrap;gap:7px}
@media (max-width:760px){.tlp{grid-template-columns:1fr}}

/* ============ 47b · İş: aşama renkleri, aşama şeridi, kart, ayrıntı paneli, yaşlandırma, aylık grafik ============ */
/* Aşama rengi --asr (data-as = projects.status). Turuncu ve Claude rengi kullanılmaz: turuncu yalnız şimdi/ACİL'in. */
[data-as="teklif"]{--asr:var(--fnt)}
[data-as="onaylandi"]{--asr:var(--c-beceri)}
[data-as="uretimde"]{--asr:var(--c-spor)}
[data-as="teslim_bekliyor"]{--asr:var(--amb)}
[data-as="teslim_edildi"]{--asr:var(--c-eticaret)}
[data-as="odeme_bekliyor"],[data-as="kapandi"]{--asr:var(--c-para)}
[data-as="iptal"]{--asr:var(--miss)}

/* Arama kutusu: büyüteç ikonlu */
.is-ara{position:relative}
.is-ara > .ic{position:absolute;left:14px;top:50%;width:16px;height:16px;transform:translateY(-50%);color:var(--fnt);pointer-events:none}
.is-ara .inp{padding-left:40px}

/* Aşama şeridi (Akış üstü): adet + tutar; dokununca o aşamaya süzer. Dar ekranda yatay kayar. */
.is-hat{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 -4px 8px;padding:2px 4px 4px}
.is-hat::-webkit-scrollbar{display:none}
.is-hat-a{flex:1 0 118px;display:flex;flex-direction:column;align-items:flex-start;gap:3px;padding:10px 12px;border-radius:var(--rk);
  background:var(--sf);box-shadow:var(--shs);border:1px solid transparent;text-align:left;cursor:pointer;color:var(--txt);font:inherit;
  transition:border-color .2s,box-shadow .2s,transform .2s}
.is-hat-a .ad{display:flex;align-items:center;gap:6px;font-size:11.5px;font-weight:600;color:var(--mut);white-space:nowrap}
.is-hat-a .ad i{width:7px;height:7px;border-radius:50%;background:var(--asr,var(--mut));flex:none}
.is-hat-a b{font-size:20px;font-weight:700;color:var(--ink);letter-spacing:-.03em;line-height:1.1;font-variant-numeric:tabular-nums}
.is-hat-a small{font-size:11px;color:var(--fnt);font-variant-numeric:tabular-nums;white-space:nowrap}
@media (hover:hover){.is-hat-a:hover:not(:disabled){border-color:var(--line2);transform:translateY(-1px)}}
.is-hat-a.on{border-color:var(--asr,var(--ink));box-shadow:inset 0 0 0 1px var(--asr,var(--ink)),var(--shs)}
.is-hat-a.bos{opacity:.5;cursor:default;box-shadow:none;background:var(--sf2)}
.is-hat-bar{display:flex;gap:3px;height:6px;margin:0 2px 14px}
.is-hat-bar i{border-radius:3px;background:var(--asr);min-width:6px}

/* Akış sütunu: üstte aşama rengi, başlıkta toplam tutar */
.as-k[data-as]{border-top:3px solid var(--asr)}
.as-k[data-as] .as-h i{background:var(--asr)}
.as-h .as-t{margin-left:auto;font-size:11.5px;font-weight:600;letter-spacing:0;color:var(--mut);font-variant-numeric:tabular-nums}
.as-h .as-t + .sy5{margin-left:9px}
@media (min-width:900px){.asama.tek{grid-template-columns:minmax(0,1fr)}}

/* Kart: başlık bir düğme (ayrıntı paneli), notun ilk satırı, 7 parçalı aşama şeridi */
.pj-u{display:flex;gap:10px;align-items:flex-start}
.pj-b{min-width:0;flex:1}
.pj-t{display:block;width:100%;padding:0;margin:0;border:0;background:none;font:inherit;font-size:13.5px;font-weight:600;color:var(--ink);
  line-height:1.3;text-align:left;cursor:pointer;border-radius:4px;overflow-wrap:anywhere}
.tah .pj-t{font-size:14px}
@media (hover:hover){.pj-t:hover{text-decoration:underline;text-underline-offset:3px;text-decoration-color:color-mix(in srgb,var(--ink) 35%,transparent)}}
.pj-t:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.pj-not{margin:8px 0 0;padding-left:10px;border-left:2px solid var(--line2);font-size:12px;line-height:1.45;color:var(--mut);overflow-wrap:anywhere}
.pj .tt.yok{font-size:12px;font-weight:500;color:var(--fnt)}
.pj-ad{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px;margin-top:11px}
.pj-ad i{height:5px;border-radius:3px;background:var(--bg2);transition:background .3s}
.pj-ad i.g{background:color-mix(in srgb,var(--asr,var(--c-is)) 38%,var(--bg2))}
.pj-ad i.on{background:var(--asr,var(--c-is))}

/* Tahsilat: alınan / tutar şeridi; yaşlandırma kutuları */
.tah > div.tah-od:not(.sag3){flex:1 0 100%;display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:-2px;font-size:11.5px;color:var(--mut)}
.tah-bar{flex:0 0 110px;height:5px;border-radius:5px;background:var(--bg2);overflow:hidden}
.tah-bar i{display:block;height:100%;width:var(--w,0);border-radius:5px;background:var(--c-para)}
.tah-od .lnk{font-size:11.5px}
.is-yas{margin-bottom:12px}
.is-yas > div{position:relative;overflow:hidden}
.is-yas > div::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--line2)}
.is-yas > .gecti::before{background:var(--miss)}
.is-yas > .yakin::before{background:var(--amb)}
.is-yas > .sonra::before{background:var(--c-para)}
.is-yas > .gecti:not(.sifir) b{color:var(--miss)}
.is-yas > .sifir{opacity:.55}
.is-yas b{font-size:18px}

/* Geçmiş: son 6 ayın tahsilatı; sütun bir düğme (ay süzgeci) */
.is-ay-k{padding:16px 14px 12px}
.is-ay{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;align-items:end;height:156px}
.is-ay-s{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:5px;height:100%;min-width:0;padding:6px 2px 5px;
  border:0;border-radius:12px;background:none;cursor:pointer;font:inherit;color:var(--mut);transition:background .2s,color .2s}
@media (hover:hover){.is-ay-s:hover{background:var(--bg2)}}
.is-ay-s .v{font-size:11px;font-weight:700;color:var(--txt);font-variant-numeric:tabular-nums;white-space:nowrap}
.is-ay-s .c{flex:1;width:100%;max-width:46px;display:flex;align-items:flex-end;border-radius:8px;background:color-mix(in srgb,var(--c-para) 7%,transparent)}
.is-ay-s .c i{display:block;width:100%;height:var(--h,0);border-radius:8px;
  background:linear-gradient(180deg,var(--c-para),color-mix(in srgb,var(--c-para) 55%,transparent));transition:height .5s cubic-bezier(.2,.9,.3,1)}
.is-ay-s .a{font-size:11.5px;font-weight:600}
.is-ay-s.on{background:color-mix(in srgb,var(--c-para) 13%,transparent);color:var(--ink)}
.is-ay-s.sifir .v{color:var(--fnt);font-weight:500}
.is-ay-alt{margin:10px 2px 0;font-size:12px;line-height:1.5;color:var(--mut)}
.is-ay-alt b{color:var(--ink)}
.is-ay-alt .lnk{font-size:12px;margin-left:6px}

/* Uzun "Bekleyen konular" listesi: ilk 3 kart, kalanı düğmeyle */
.alan-dikkat-fazla{display:block;margin:10px auto 0;padding:8px 14px;font-size:12.5px}

/* İş ayrıntı paneli (sheet 'is-detay') */
.isd{display:grid;gap:14px;padding-bottom:8px}
.isd-ust{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.isd-ust p{margin:0;min-width:0;font-size:12.5px;line-height:1.5;color:var(--mut);overflow-wrap:anywhere}
.isd-dr{flex:none;background:color-mix(in srgb,var(--asr) 16%,transparent);color:var(--asr)}
.isd-ad{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
.isd-ad li{display:flex;flex-direction:column;gap:6px;min-width:0}
.isd-ad i{height:6px;border-radius:3px;background:var(--bg2)}
.isd-ad li.g i{background:color-mix(in srgb,var(--asr) 38%,var(--bg2))}
.isd-ad li.on i{background:var(--asr)}
.isd-ad span{font-size:10px;line-height:1.25;text-align:center;color:var(--fnt);overflow-wrap:anywhere}
.isd-ad li.on span{color:var(--ink);font-weight:700}
@media (max-width:520px){.isd-ad span{display:none}}
.isd-iptal{margin:0;padding:10px 12px;border-radius:12px;background:color-mix(in srgb,var(--miss) 10%,transparent);color:var(--miss);font-size:12.5px}
.isd-kv{display:grid;grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:8px;margin:0}
.isd-kv > div{min-width:0;padding:9px 11px;border-radius:12px;background:var(--bg2)}
.isd-kv dt{font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--mut)}
.isd-kv dd{margin:3px 0 0;font-size:14px;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.isd-kv dd small{font-size:10.5px;font-weight:500;color:var(--fnt)}
.isd-kv em.gec{display:block;margin-top:1px;font-style:normal;font-size:11px;font-weight:700;color:var(--miss)}
.isd-a{display:flex;flex-wrap:wrap;gap:7px}
.isd-b h4{display:flex;align-items:center;gap:7px;margin:0 0 8px;font-size:11px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--mut)}
.isd-b h4 small{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--bg2);
  font-size:10.5px;letter-spacing:0;color:var(--txt)}
.isd-not{margin:0;padding:10px 12px;border-radius:12px;background:var(--bg2);font-size:13px;line-height:1.55;color:var(--txt);white-space:pre-wrap;overflow-wrap:anywhere}
.isd-bos{margin:0;font-size:12.5px;color:var(--fnt)}
.isd-od{list-style:none;margin:0;padding:0;border-radius:12px;background:var(--bg2);overflow:hidden}
.isd-od li{display:flex;align-items:center;flex-wrap:wrap;gap:4px 10px;padding:9px 12px;font-size:12.5px;color:var(--mut)}
.isd-od li + li{border-top:1px solid var(--line)}
.isd-od li b{min-width:84px;font-size:14px;color:var(--ink);font-variant-numeric:tabular-nums}
.isd-od li > span{flex:1;min-width:0;overflow-wrap:anywhere}
.isd-od li.geri b{color:var(--fnt);text-decoration:line-through}
.isd-tl{margin:0;display:flex;align-items:center;flex-wrap:wrap;gap:8px;font-size:12.5px;color:var(--txt)}
.isd-tl > span{flex:1;min-width:0;overflow-wrap:anywhere}
.isd-zc{list-style:none;margin:0;padding:0 0 0 2px}
.isd-zc li{position:relative;display:flex;gap:12px;padding:0 0 12px}
.isd-zc li::before{content:"";position:absolute;left:4px;top:14px;bottom:0;width:2px;background:var(--line)}
.isd-zc li:last-child{padding-bottom:0}
.isd-zc li:last-child::before{display:none}
.isd-zc li > i{position:relative;z-index:1;flex:none;width:10px;height:10px;margin-top:4px;border-radius:50%;background:var(--line2);box-shadow:0 0 0 3px var(--sf)}
.isd-zc li.yeni > i{background:var(--ink)}
.isd-zc li.asama > i{background:var(--c-beceri)}
.isd-zc li.odeme > i{background:var(--c-para)}
.isd-zc li.geri > i{background:var(--amb)}
.isd-zc li.iptal > i{background:var(--miss)}
.isd-zc li > div{min-width:0}
.isd-zc p{margin:0;font-size:13px;line-height:1.4;color:var(--txt);overflow-wrap:anywhere}
.isd-zc small{font-size:11px;color:var(--fnt)}
.isd-tum{margin:8px 0 0 24px;font-size:12px}

/* ============ 48 · Sağlık özeti: yeni arayüzdeki iki sütun ============ */
/* Modül gövdesi 860 px'e kadar tek sütun; sağlık özeti biraz daha erken ikiye ayrılsın. */
@container (min-width:720px){
  [data-m] .sg-iki{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 24px;align-items:start}
}
/* (Modülde container-type tanımlı; genişlik kararı yalnız konteynerden verilir.
    Pencere geniş ama modül sütunu darken ikiye bölmek kartları sıkıştırıyordu.) */
.sg-iki > div > .sec:not(.inp):first-child{padding-top:22px}
/* Vücut yaşı kutusu maketteki halka gibi: büyük sayı, çevresinde yumuşak ton */
.sg-hero .sg-mini > div .yon{color:var(--ok)}
.st.olc4,.sec > .st{gap:10px}

/* ============ 49 · Sağlık: maketteki bileşen karşılıkları ============ */

/* 49a · Vitrin ölçüm hücreleri: makette en çok 4 (sağlıkta 3); 130px eşiği 5-7 sütuna sıkıştırıyordu */
.sg-hero .sg-mini,.sp-hero .sp-mini{grid-template-columns:repeat(auto-fit,minmax(172px,1fr))}
.sg-hero .sg-mini > div,.sp-hero .sp-mini > div{transition:background .3s,transform .34s cubic-bezier(.2,.9,.3,1.05),box-shadow .3s}
@media (hover:hover) and (pointer:fine){
  .sg-hero .sg-mini > div:hover,.sp-hero .sp-mini > div:hover{background:rgba(255,255,255,.14);transform:translateY(-3px);box-shadow:0 16px 30px -18px #000}
}

/* 49b · Vücut yaşı halkası (maketteki .yas-h): .va-yas kutusu halkaya dönüşür, markup değişmez */
@container (min-width:560px){.m-saglik .va-ust,.m-spor .va-ust{grid-template-columns:200px minmax(0,1fr)}}
.m-saglik .va-yas,.m-spor .va-yas{display:grid;grid-template-columns:78px minmax(0,1fr);grid-template-rows:auto auto;
  align-items:center;column-gap:15px;background:none;padding:2px 0}
.m-saglik .va-yas b,.m-spor .va-yas b{grid-column:1;grid-row:1 / 3;align-self:center;width:78px;height:78px;margin:0;
  display:grid;place-items:center;font-size:26px;line-height:1;letter-spacing:-.04em;border-radius:50%;position:relative;isolation:isolate}
.m-saglik .va-yas b::before,.m-spor .va-yas b::before{content:"";position:absolute;inset:0;border-radius:50%;z-index:-1;
  background:conic-gradient(var(--c-saglik) 0 100%);
  -webkit-mask:radial-gradient(circle,transparent 0 31px,#000 31px);mask:radial-gradient(circle,transparent 0 31px,#000 31px)}
.m-saglik .va-yas.iy b::before,.m-spor .va-yas.iy b::before{background:conic-gradient(var(--ok) 0 100%)}
.m-saglik .va-yas.kt b::before,.m-spor .va-yas.kt b::before{background:conic-gradient(var(--amb) 0 100%)}
.m-saglik .va-yas > span,.m-spor .va-yas > span{grid-column:2;grid-row:1;align-self:end;
  font-size:15px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--ink)}
.m-saglik .va-yas > small,.m-spor .va-yas > small{grid-column:2;grid-row:2;align-self:start;font-size:12px}
/* Sistemin ilk 4 haftası: antrenman ortalaması eksik, vücut yaşına girmiyor */
.va-yas .va-az{display:table;margin-top:5px;padding:2px 8px;border-radius:99px;font-style:normal;font-weight:600;font-size:11px;
  color:var(--mut);background:color-mix(in srgb,var(--mut) 14%,transparent);white-space:nowrap}

/* 49c · Ölçüm karoları maketteki .miniz gibi: en çok 3-4 sütun, değer üstte, etiket altta büyük harf, kırpma yok */
.m-saglik .va-grid,.m-spor .va-grid,.m-saglik .sg-vgrid{grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:9px}
.m-saglik .va-grid > div,.m-spor .va-grid > div,.m-saglik .sg-vgrid > div{display:flex;flex-direction:column;padding:11px 12px;border-radius:var(--rk)}
.m-saglik .va-grid > div > span,.m-spor .va-grid > div > span,.m-saglik .sg-vgrid > div > span{order:2;margin-top:3px;
  font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--mut)}
.m-saglik .va-grid > div > b,.m-spor .va-grid > div > b,.m-saglik .sg-vgrid > div > b{order:1;font-size:15.5px;letter-spacing:-.02em;
  white-space:normal;overflow:visible;text-overflow:clip}
.m-saglik .va-grid > div > small,.m-spor .va-grid > div > small,.m-saglik .sg-vgrid > div > small{order:3;margin-top:3px;
  white-space:normal;overflow:visible;text-overflow:clip;line-height:1.35}

/* 49d · Öneriler maketteki .oner2 hapları gibi */
.m-saglik .va-oneri,.m-spor .va-oneri{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:8px}
.m-saglik .va-oneri li,.m-spor .va-oneri li{background:var(--bg2);border-radius:var(--rk);padding:9px 12px;font-size:12.5px;line-height:1.45;color:var(--txt)}
.m-saglik .va-oneri li + li,.m-spor .va-oneri li + li{margin-top:0}
.m-saglik .va-oneri li::before,.m-spor .va-oneri li::before{content:"💡 "}

/* 49e · 14 gün şeridi: gradyanlı sütun + kesintisiz mide şeridi (maket .cizelge + .mide-c) */
.m-saglik .sg-serit{height:132px;gap:5px}
.m-saglik .sg-serit .u{max-width:none;border-radius:5px 5px 3px 3px;
  background:linear-gradient(180deg,var(--k-uyku),color-mix(in srgb,var(--k-uyku) 40%,transparent))}
.m-saglik .sg-serit .m{max-width:none;height:5px;border-radius:3px}
.m-saglik .sg-serit small{font-size:9.5px}
.m-saglik .lejant i.cell{width:11px;height:5px;border-radius:3px}

/* 49f · .tah satırlarındaki ikon karosu maketteki .dr ölçüsünde (44px) */
.m-saglik .tah > .ti.b{width:44px;height:44px;border-radius:14px}
.m-saglik .tah > .ti.b .ic{width:22px;height:22px}
.m-saglik .tah .sg-sonra{margin-top:8px}

/* 49g · Doktor dosyası ve Vücut sekmeleri: modül sütunu 830px olduğu için .ikili eşiği .sg-iki gibi 720px */
@container (min-width:720px){
  .m-saglik .ikili{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 24px;align-items:start}
}

/* ============ 50 · doktor dosyası satır eylemleri ============ */
.sg-dakt{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:6px}
.sg-dakt .btn.sm{height:30px;padding:0 12px;font-size:12.5px;gap:6px}
.sg-dakt .btn.soft{background:color-mix(in srgb,var(--ok) 14%,transparent);
  border:1px solid color-mix(in srgb,var(--ok) 30%,transparent);color:var(--ok);font-weight:600}
@media (hover:hover){.sg-dakt .btn.soft:hover{background:color-mix(in srgb,var(--ok) 22%,transparent);transform:translateY(-2px)}}
.sg-dakt .btn.soft .ic{width:13px;height:13px}
.m-satir.m-bitti > b{color:var(--mut)}
.m-satir.m-bitti{opacity:.72}
.m-satir b .m-rozet{margin-left:7px;font-weight:600}

/* ============ 51 · hareket azaltma: gündem kartı yine de kapansın ============
   *{animation:none!important} kuralı yt-kapan'ı tamamen öldürüyordu; kart olduğu yerde
   donuyor, kullanıcı "kapanmıyor" görüyordu. Burada animasyon yerine son durum uygulanır. */
@media (prefers-reduced-motion:reduce){
  .gc.kapan{max-height:0!important;opacity:0!important;overflow:hidden;
    margin-top:0!important;padding-top:0!important;padding-bottom:0!important;border-width:0!important}
}

/* ============ 52 · dar sütunda .tah satırı: sağdaki rozet harf harf sarmasın ============ */
.tah .sag3{flex:0 0 auto;min-width:max-content}
.tah > div:not(.sag3){flex:1 1 140px}
.tah .vd,.tah .tt2,.tah .m-rozet{white-space:nowrap}
.tah .sag3 .btn{white-space:nowrap}
.m-saglik .tah,.m-spor .tah{row-gap:8px}
/* Vücut analizi düğmeleri iç içe geçmesin */
.m-saglik .va .acts,.m-spor .va .acts,.m-saglik .va .dug{display:flex;flex-wrap:wrap;gap:8px}


/* ============ 40 · MOBİL DÜZELTMELERİ ============
   375–430 px'te tespit edilen kenar boşluğu, taşma, kesilme ve dokunma
   sorunlarının tamamı burada. Dosyanın sonunda: modül CSS'lerinden ve
   yukarıdaki kurallardan sonra çalışır. */

/* 40.1 · Bölüm başlığı kartla aynı kenardan başlasın.
   .sec zaten 20px yan boşluk veriyor; .sh'nin ek 4px'i başlıkları kaydırıyordu. */
.sh,.bas{margin-left:0;margin-right:0}

/* 40.2 · .tek içindeki kart ve ızgaralar da 20px kenar boşluğu alsın
   (Alanlar sayfasında .ag/.card doğrudan .tek altında, .sec içinde değil). */
@media (max-width:1023px){
  .tek > .ag,.tek > .card,.tek > .k,.tek > .oz,.tek > .pulse,.tek > .yazkutu{margin-left:20px;margin-right:20px}
}
@media (min-width:1024px){
  .tek > .sec:not(.inp){padding-left:0;padding-right:0}
}

/* 40.3 · Sekme şeridi .sec içindeyken çift boşluk almasın (İş: 40px → 20px) */
.sec:not(.inp) > .sek,.sec:not(.inp) > .m-sekme{margin-left:0;margin-right:0}

/* 40.4 · .sek de taşınca kenarları solsun (şimdiye kadar yalnız .m-sekme'de vardı) */
.sek.sag-sol{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 40px),transparent);
  mask-image:linear-gradient(90deg,#000 calc(100% - 40px),transparent)}
.sek.sol-sol{-webkit-mask-image:linear-gradient(90deg,transparent,#000 40px);
  mask-image:linear-gradient(90deg,transparent,#000 40px)}
.sek.sag-sol.sol-sol{-webkit-mask-image:linear-gradient(90deg,transparent,#000 40px,#000 calc(100% - 40px),transparent);
  mask-image:linear-gradient(90deg,transparent,#000 40px,#000 calc(100% - 40px),transparent)}

/* 40.5 · Solma maskesi kabın kendi arka planını ve sağ yuvarlak ucunu yiyordu.
   Dar ekranda kapsül kalkıyor, haplar tek tek zemin alıyor; maske yalnız hapları soluyor. */
/* 1023px: alt cubuk ve ust cubugun sinirini izler. 760'ta kesilince 761-1023 bandinda
   (tablet dikey) kapsul geri gelip maskenin altinda sag ucu yine kayboluyordu. */
@media (max-width:1023px){
  .sek,.m-sekme{background:transparent;box-shadow:none;border-radius:0;padding:4px 0}
  .sek button,.m-sekme a,.m-sekme button{background:var(--sf);box-shadow:var(--shs)}
}

/* 40.6 · Plan › "Claude'un soruları": cevap düğmeleri soru metninin üstüne biniyordu.
   Düğme kümesi kendi satırına iniyor, soru metni tam genişliği alıyor. */
@media (max-width:760px){
  .ykl .s{align-items:flex-start;row-gap:8px}
  .ykl .sec2{flex:0 0 100%;margin-left:0;padding-left:55px}
}

/* 40.7 · Anahtar satırları: etiket 0 px'e çöküp açıklama ekran dışına taşıyordu (Spor). */
@media (max-width:760px){
  .m-onay{flex-wrap:wrap;row-gap:4px}
  .m-onay > span:not(.kutu):not(.ti){flex:1 1 0;min-width:0}
  .m-onay small{white-space:normal;line-height:1.45;max-width:100%}
  .m-onay.sp-oto small{flex:0 0 100%;margin-left:0;padding-left:32px}
}

/* 40.8 · Çekmece: liste alt bilgi bloğunun altında sert kesiliyordu. */
.ck-panel .rl{padding-bottom:10px}
.ck-panel .ralt{position:relative}
.ck-panel .ralt::before{content:"";position:absolute;left:0;right:0;top:-25px;height:24px;
  pointer-events:none;background:linear-gradient(180deg,transparent,var(--sf))}

/* 40.9 · Komut paleti: mobilde klavye rozetleri gereksiz, alt kenar sert kesiliyordu. */
@media (max-width:1023px){
  .palet-l kbd,.palet-f{display:none}
  .palet-k{position:relative}
  .palet-l{padding-bottom:10px}
  .palet-k::after{content:"";position:absolute;left:0;right:0;bottom:0;height:22px;
    pointer-events:none;border-radius:0 0 var(--r) var(--r);
    background:linear-gradient(180deg,transparent,var(--sf))}
}

/* 40.10 · Sayfa başlığındaki hava/gizli/tema çipleri her sayfada aynı yerde dursun:
   başlık uzunluğuna göre kâh yan kâh alt satıra kayıyordu. */
/* nowrap DEGIL: yatay modda (740x360) hava cipi uzun metne acilinca baslik 28 px'e
   eziliyordu. Basliga 140 px'lik taban verip cipleri sigmadiginda alt satira birakiyoruz;
   boylece baslik hicbir genislikte cokmuyor, cipler her zaman sag ustte hizali. */
@media (max-width:1023px){
  .pg-hd .ustb,.pg-hd .pg-top{flex-wrap:wrap;align-items:flex-start;gap:10px 12px}
  .pg-hd .ustb > .bl,.pg-hd .pg-top > h1{flex:1 1 140px;min-width:0}
  .pg-hd .pg-top > h1{white-space:normal;text-wrap:balance}
  .pg-hd .ustb > .sag,.pg-hd .pg-top > .sag{flex:0 1 auto;margin-left:auto;min-width:0;flex-wrap:wrap;justify-content:flex-end}
}

/* 40.11 · İmaj › kombin uyumu tek satıra sıkışıp "…" ile kesiliyordu; iki satıra insin. */
.m-imaj .im-km .im-uy{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;
  -webkit-box-orient:vertical;overflow:hidden}

/* 40.12 · Çubuk grafik tarih etiketleri (12 çubukta) ortadan kesiliyordu. */
@media (max-width:760px){
  .m-cubuk .gc-et span{overflow:visible}
}

/* 40.13 · Dolu metin alanı içeriği kesiyordu (3. satır yarım kalıyordu). */
textarea.inp{field-sizing:content;max-height:46dvh;overflow-y:auto}

/* 40.14 · Claude sohbeti: yükseklik sabit 392px çıkarmaya bağlıydı,
   kısa telefonlarda 220px'e iniyordu. */
@media (max-width:1023px){
  .chat-kutu{min-height:min(46dvh,340px)}
}

/* 40.15 · ✏️ sayfası: alt kenarda son çip sırası kırpılıyordu. */
@media (max-width:1023px){
  .sheet{max-height:88dvh;padding-bottom:calc(env(safe-area-inset-bottom) + 22px)}
}

/* 40.16 · Dokunma boyutları.
   index.html'deki @media (pointer:coarse) boyut artışları buradaki düz kurallar
   tarafından eziliyordu; geri getiriliyor. Vuruş alanı da 44px'e tamamlanıyor. */
@media (pointer:coarse){
  .btn.sm{height:34px}
  .tl-a .btn.sm{height:34px}
  .chip{height:36px}
  :where(.btn,.chip,.icb,.lnk,.back,.sh a,.sh button,.bas a,.bas button,.krr button,
    .m-sekme a,.m-sekme button,.sek button,.seg a,.seg button,.gwait a,.gwait button,
    .privnote a,.row-alt button,.tik,.lnk2):not(.dikkat){position:relative}
  :where(.btn,.chip,.icb,.lnk,.back,.sh a,.sh button,.bas a,.bas button,.krr button,
    .m-sekme a,.m-sekme button,.sek button,.seg a,.seg button,.gwait a,.gwait button,
    .privnote a,.row-alt button,.tik,.lnk2):not(.dikkat)::after{content:"";position:absolute;
    inset:clamp(-13px,calc(50% - 22px),0px)}
}

/* 40.17 · ✏️ sayfası: iki satırlık örnek metin görünsün (tek satırda kesiliyordu). */
@media (max-width:1023px){
  .field textarea{min-height:50px}
}

/* ============ 53 · "Claude'a anlat" maketteki gibi sayfanın altında ============
   Sağ yapışkan ray yerine tam genişlikte alt bölüm (maket: alan-*.html sonundaki bölüm).
   Böylece modül gövdesi de tüm genişliği kullanır; Sağlık özeti iki sütuna rahat açılır. */
.ctx-a{min-width:0}
.ctxk label{margin:0 2px 6px}
.ctxk .ctx-a + .ctx-a{margin-top:12px}
/* Ray her genişlikte blok: ayırıcı boşluk medya sorgusuna bağlı olmamalı, çünkü
   .mdz-yan .sec:not(.inp){padding-top:0} kuralı (yukarıda) her genişlikte çalışıyor. */
.mdz{display:block}
.mdz > .mdz-yan{position:static;top:auto;margin-top:24px}
@media (min-width:1024px){
  .mdz > .mdz-yan{margin-top:30px}
  /* Tam genişlikte üç kutu yan yana (maketteki .frm gibi) */
  .mdz-yan .ctxk{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 18px;align-items:start}
  .mdz-yan .ctxk .ctx-a + .ctx-a{margin-top:0}
  .mdz-yan .ctxk > .acts,.mdz-yan .ctxk > .not{grid-column:1 / -1}
  .mdz-yan .ctxk > .acts{margin-top:14px}
  .mdz-yan .ctxk .inp{min-height:76px}
  .mdz-yan .yazkutu{max-width:none}
}

/* 40.18 · Plan › günün cetveli: düğme kümesi satırı taşırıp metni tek kelimeye
   düşürüyordu (320 px'te kart ekran dışına çıkıyordu). */
@media (max-width:760px){
  .tl-k{flex-wrap:wrap;row-gap:8px}
  .tl-k > .bl{flex:1 1 130px;min-width:0}
  .tl-k .sag2,.tl-k .tl-a{margin-left:auto;flex:none}
}
@media (max-width:420px){
  .tl-r{grid-template-columns:50px minmax(0,1fr);gap:9px;padding:0 12px}
  .tl-k{padding:11px}
}

/* ============ 54 · Rutinler alanı: vitrin karoları, .rtn satırı, hafta özeti ============
   Maket: yenilenmis-ui-taslak/alan-rutinler.html (+ tema.css:1313-1326).
   .kok / .kok-i / .izg / .lejant / .vd.ok2 / .btn.sm / .e.md / .rtn .hd-t zaten vardı;
   burada yalnız eksik olan parçalar tanımlanıyor. */
.rt-g{position:relative;z-index:1;display:grid;grid-template-columns:repeat(auto-fit,minmax(112px,1fr));gap:9px;margin-top:16px}
.rt-k{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.08);border-radius:var(--rs);
  padding:12px 10px;display:grid;justify-items:center;align-content:start;gap:5px;
  color:#fff;font:inherit;text-align:center;cursor:pointer;-webkit-appearance:none;appearance:none;
  transition:background-color .3s,border-color .3s,transform .34s cubic-bezier(.2,.9,.3,1.05)}
.rt-k b{font-size:12.5px;font-weight:600;color:#fff;line-height:1.3;max-width:100%;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rt-k > span:last-child{font-size:11px;color:rgba(255,255,255,.5);line-height:1.3}
.rt-k:active{transform:scale(.97)}
.rt-k:focus-visible{outline:2px solid rgba(255,255,255,.55);outline-offset:2px}
@media (hover:hover) and (pointer:fine){.rt-k:hover{background:rgba(255,255,255,.13);transform:translateY(-2px)}}
.rt-k.ok{background:rgba(126,231,180,.14);border-color:rgba(126,231,180,.28)}
.rt-k.ok > span:last-child{color:#7ee7b4}
.rt-k.min{background:rgba(242,184,75,.12);border-color:rgba(242,184,75,.26)}
.rt-k.min > span:last-child{color:#f2b84b}
.rt-k.pas{opacity:.55}
.rt-k.yok{background:rgba(255,138,138,.1);border-color:rgba(255,138,138,.24)}
.rt-k.yok > span:last-child{color:#ff9d9d}
.rt-k.acik{border-color:rgba(255,255,255,.3)}
@media (prefers-reduced-motion:reduce){.rt-k{transition:none}.rt-k:active{transform:none}@media (hover:hover){.rt-k:hover{transform:none}}}

/* satır: emoji · ad ve saat · düğmeler (ya da "yapıldı" rozeti) */
.rtn{display:flex;align-items:center;gap:11px;padding:13px 16px;flex-wrap:wrap}
.rtn + .rtn{border-top:1px solid var(--line)}
.rtn > .e{flex:none}
.rtn .hd-t{min-width:110px}
.rtn .hd-t b{font-size:13.5px;line-height:1.35;font-weight:600;color:var(--ink)}
.rtn .hd-t span{font-size:11.5px;color:var(--mut);line-height:1.45}
.rtn.bitti .hd-t b{color:var(--mut)}
.rtn .vd{flex:none;white-space:nowrap}
.rtn > .lnk{flex:none;font-size:11.5px}
.rtn > .kr{flex:1 0 100%;margin:5px 0 0 34px}
.rtn-d{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;flex:none;margin-left:auto}
@media (max-width:719px){
  .rtn-d{flex:1 0 100%;justify-content:flex-start;margin-left:0}
  .rtn-d .btn{flex:1;min-width:88px;justify-content:center}
}
/* Rutinler satırındaki su: ölçü ızgarası ve "geri al" alt alta, satırın tamamını
   kaplar. .rtn-d flex olduğu için ikisi yan yana geliyor ve ızgara eziliyordu. */
.rtn-d.su-sat{display:block;flex:1 0 100%;margin-left:0;width:100%}
.rtn-d.su-sat .su-c{margin-top:2px}
.rtn-d.su-sat .su-a{margin-top:9px}
.rtn-d.su-sat .btn{flex:none;min-width:0}

/* ============================================================
   Hareket çizimleri (Workout Guide / Everkinetic · CC BY-SA 4.0)
   Dosyalar tek renk silüet. <img> yerine MASKE olarak basılıyorlar:
   böylece rengi currentColor'dan alıyorlar ve koyu/açık temada
   kendiliğinden doğru renge düşüyorlar. Atıf: Ayarlar → Sistem.
   ============================================================ */
.hrz{display:block;width:34px;height:34px;flex:none;background:currentColor;
  -webkit-mask:var(--hrz) center/contain no-repeat;mask:var(--hrz) center/contain no-repeat}
/* Hareket detayındaki üç kare: başlangıç · orta · bitiş */
.hrz-serit{display:flex;gap:10px;align-items:stretch;margin-top:12px}
.hrz-serit .hrz{flex:1;width:auto;height:auto;aspect-ratio:1;min-width:0;
  background:color-mix(in srgb,currentColor 88%,transparent)}
.hrz-serit.buyuk{gap:8px}
.hrz-alt{margin:6px 0 0;font-size:11.5px;color:var(--fnt);text-align:center;letter-spacing:.02em}
/* Şablon ve plan kartında hareket şeridi */
.hrz-kutu{display:flex;gap:10px;flex-wrap:wrap;margin:10px 0 2px}
.hrz-h{display:flex;flex-direction:column;align-items:center;gap:3px;width:56px;min-width:0}
.hrz-h .hrz{width:44px;height:44px;background:color-mix(in srgb,var(--ink) 72%,transparent)}
.hrz-h small{font-size:9.5px;line-height:1.25;color:var(--fnt);text-align:center;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word}
.hrz-h.art{justify-content:center;font-size:12px;font-weight:600;color:var(--mut);height:44px}
.hrz-kutu.kucuk{gap:7px;margin:8px 0 0}
.hrz-kutu.kucuk .hrz-h{width:44px}
.hrz-kutu.kucuk .hrz-h .hrz{width:34px;height:34px}
.hrz-kutu.kucuk .hrz-h small{font-size:9px}
/* Hareketler sayfası: kutu ızgarası — mobilde 2, masaüstünde 4 yan yana.
   Satır listesi yerine kutu, çünkü hareketi adından değil çiziminden tanımak
   daha hızlı ve çizimler zaten kare. */
.sp-hg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
@media (min-width:600px){.sp-hg{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:900px){.sp-hg{grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}}
.sp-hk{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:0;
  padding:12px 9px 11px;border-radius:var(--rs);background:var(--sf);border:1px solid var(--line);
  box-shadow:var(--shs);text-decoration:none;color:inherit}
/* Geçiş yalnız fare olan cihazda kurulur: dokunmatikte hiç kullanılmayan
   transform+box-shadow geçişi her kutuda bir katman açıyordu (140 kutu). */
.sp-hk:active{transform:scale(.98)}
@media (hover:hover) and (pointer:fine){
  .sp-hk{transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
  .sp-hk:hover{transform:translateY(-2px);box-shadow:var(--sh);border-color:color-mix(in srgb,var(--c-spor,var(--acc)) 45%,var(--line))}
}
/* Maskesi henüz takılmamış kutu boş kalmasın: yerini tutan soluk zemin. */
.hrz[data-hrz]{background:color-mix(in srgb,var(--ink) 8%,transparent);border-radius:8px}
.sp-hk-g{display:block;width:100%;aspect-ratio:1.15;display:grid;place-items:center;margin-bottom:4px}
.sp-hk-g .hrz{width:100%;height:100%;background:color-mix(in srgb,var(--ink) 58%,transparent)}
.sp-hk.dolu .sp-hk-g .hrz{background:color-mix(in srgb,var(--ink) 78%,transparent)}
/* Çizimi olmayan (kullanıcının eklediği) hareket: baş harf rozeti */
.sp-hk-yok{font-style:normal;font-size:20px;font-weight:700;color:var(--mut);
  width:46px;height:46px;border-radius:50%;background:var(--bg2);display:grid;place-items:center}
.sp-hk b{font-size:12.5px;font-weight:600;line-height:1.3;text-align:center;color:var(--ink);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word}
.sp-hk-d{font-size:11.5px;font-variant-numeric:tabular-nums;color:var(--ink);font-weight:600;margin-top:2px}
.sp-hk:not(.dolu) .sp-hk-d{color:var(--mut);font-weight:500}
.sp-hk-n{font-size:10.5px;color:var(--fnt)}
@media (max-width:420px){
  .hrz-h{width:50px}
  .hrz-h .hrz{width:40px;height:40px}
}

/* ---- Spor özeti: masaüstünde iki sütun ----
   Sol: bugün ne yapılacak (rutin, Claude'un planı, hero, KPI, saatten bekleyenler).
   Sağ: geçmiş (grafik, son antrenmanlar, rekorlar, form). "Claude'a anlat" bu
   bölünmenin dışında, modül kabuğunda en altta kalıyor. */
.sp-iki{display:block}
@media (min-width:1024px){
  .sp-iki{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 26px;align-items:start}
  .sp-sol > .sec:first-child,.sp-sag > .sec:first-child{padding-top:20px}
}

/* ---- Rutinler sayfası: masaüstünde iki sütun ----
   Sol: kategoriler (Takviye · Sağlık · Spor…). Sağ: Son 7 gün ızgarası, yapışkan —
   listeyi işaretlerken hafta gözden kaybolmuyor. Mobilde tek sütun, sıra değişmiyor. */
.rt-iki{display:block}
@media (min-width:1024px){
  .rt-iki{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,0.85fr);gap:0 26px;align-items:start}
  .rt-sag{position:sticky;top:12px}
  .rt-sol > .sec:first-child,.rt-sag > .sec:first-child{padding-top:22px}
  /* Dar sütunda 7 günlük ızgaranın satır etiketi taşmasın. */
  .rt-sag .rt-oz{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
  .rt-sag .rt-oz > div{padding:10px 11px}
}

/* hafta özeti: maketteki "Rutin ekle" formunun yerinde (sunucuda rutin ekleme ucu yok) */
.rt-oz{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-bottom:11px}
.rt-oz > div{background:var(--sf);border-radius:var(--rs);box-shadow:var(--shs);padding:12px 13px;min-width:0}
.rt-oz b{display:block;font-size:19px;font-weight:700;letter-spacing:-.02em;color:var(--ink);
  font-variant-numeric:tabular-nums;line-height:1.15}
.rt-oz span{display:block;font-size:11px;color:var(--mut);margin-top:3px;line-height:1.35;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:399px){
  .rt-oz{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rt-oz > div:last-child{grid-column:1 / -1}
}

/* 40.19 · .tah sag blok: 52. bolumdeki "min-width:max-content" alti dugmeli tahsilat
   satirinda kutuyu 429 px'e kilitleyip karti ekranin 94 px disina tasiriyordu
   (#/is/tahsilat, 375 px). Cocuklarin kendi white-space:nowrap'i harf harf sarmayi
   zaten onluyor; kapsayicinin max-content'e kilitlenmesine gerek yok. */
.tah .sag3{min-width:min-content}
@media (max-width:1023px){
  .tah .sag3{flex:1 0 100%;margin-left:0;justify-content:flex-start}
}

/* ============ 55 · Maneviyat · yıllık namaz dökümü ============
   Kullanıcı tablo istemiyor: sayılar, cümleler ve satır satır veri.
   Vakit ve ay satırları .pr düzenini (etiket · çubuk · sayı) yeniden kullanır; dört sayı .miniz kutusudur.
   Çubuğun dolgusu .cb i içindeki var(--c) üzerinden gelir; .m-ibadet{--c:var(--c-maneviyat)} olduğu için altındır. */
.ib-ybas{margin:0;padding:15px 16px 0;font-size:13px;line-height:1.6;color:var(--txt)}
.ib-ybas b{color:var(--ink);font-weight:700;font-variant-numeric:tabular-nums}
.ib-y4{margin:13px 16px 2px;grid-template-columns:repeat(2,minmax(0,1fr))}
.ib-y4 div{box-shadow:inset 0 0 0 1px var(--line)}
.ib-yg{margin:8px 0 0;padding:14px 16px 6px;border-top:1px solid var(--line)}
.ib-yr{grid-template-columns:minmax(64px,auto) minmax(40px,1fr) auto;gap:10px;padding:8px 16px}
.ib-yr + .ib-yr{border-top:0}
.ib-yr b{font-size:12.5px;font-weight:600}
.ib-yr > span:last-child{font-size:11.5px;color:var(--mut);font-variant-numeric:tabular-nums;white-space:nowrap}
.ib-yc{display:block;height:6px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line)}
.ib-yn{margin-top:12px}
.ib-yn b{color:var(--ink);font-weight:700;font-variant-numeric:tabular-nums}
@container (min-width:560px){.ib-y4{grid-template-columns:repeat(4,minmax(0,1fr))}}
@container (max-width:400px){
  .ib-yr{grid-template-columns:minmax(56px,auto) minmax(28px,1fr) auto;gap:8px;padding:8px 14px}
  .ib-yr > span:last-child{font-size:11px}
}

/* 40.20 · Vakit cizelgesi: .nk isaretleri gun icindeki saate gore yuzdeyle konumlaniyor.
   320 px'te Ogle ve Ikindi merkezleri 31 px kaliyor, 12 px'lik saatler 32 px genisliginde
   oldugu icin "12:3116:00" diye birbirine giriyordu. Yaziyi kapsayiciyla birlikte olcekle. */
@media (max-width:1023px){
  .nk b{font-size:clamp(9px,3.1vw,12px)}
  .nk span{font-size:clamp(7.5px,2.5vw,9.5px)}
}


/* ============ 41 · MOBIL DENETIMI · IKINCI TUR ============
   Kaynak taramasinda cikip tarayicida dogrulanan kusurlar. */

/* 41.1 · iOS yakinlastirma korumasi olmus.
   index.html:326 "@media (max-width:600px){.inp{font-size:16px}}" diyor ve yorumu
   "telefonda odaklaninca sayfa buyumesin". Ama yeni-tema.css:111 ayni ozgullukte
   (.inp, 0-1-0) ve MEDYA SORGUSUZ 14px veriyor; sonra yuklendigi icin her genislikte
   kazaniyor. Olculdu: telefonda butun girdiler 14px. iOS Safari 16px altinda odakta
   sayfayi kendiliginden yakinlastiriyor ve geri almiyor. Yazarin niyeti geri getiriliyor.
   .uyku/.gl2 (index.html:503) ve .gr-f (1346) kendi ozgullukleriyle kacan aileler. */
@media (max-width:600px){
  .inp,textarea.inp,select.inp,
  .uyku .inp,.gl2 .inp,.ekle .inp,.gr-f .inp,
  .palet-in,.field textarea,.yaz2 textarea{font-size:16px}
}

/* 41.2 · Dokunmatikte yapiskan :hover.
   index.html:650 butun hover etkilerini bilerek "@media (hover:hover) and (pointer:fine)"
   icine almis; yeni-tema.css 49 kuralda bu korumayi sorgusuz geri getirmis. iOS'ta dokunulan
   kart/dugme kalkmis halde asili kaliyor, yanindakiyle hizasi bozuluyor. Sadece hareket
   eden transform'lar notrlenir; sus amacli ::before/::after'lara dokunulmaz (onlarin
   taban degeri scaleX(0) gibi bir sey, none yapmak onlari bozar). */
@media (hover:none){
  .btn:hover,.k.hv:hover,.yazd:hover,.yazd:hover .yi,.rs:hover,.rs:hover .e,
  .rkul:hover,.icb:hover,.hava:hover,.soz .icb:hover,
  button.cn:hover,a.cn:hover,.gc:hover,a.gc:hover,.vkt-k:hover,.cp:hover,
  .ak:hover,.ak:hover .e,.hk:hover,.kur-s:hover,.tl-k:hover,
  .mod button:hover,.mod button:hover .e,.hzl button:hover,.gonder:hover,
  .vkr-k:hover,.ht-h:hover,.cuma-s i:hover,
  .olcek10 button:hover,.scl button:hover,.pf-koyu:hover,
  .st > div:hover,.st > button:hover,.ans .btn:hover,.sg-dakt .btn.soft:hover,
  .rt-k:hover,.m-eticaret .et-kart:hover,.m-instagram .m-ig-kart:hover,
  .marka:hover .lg{transform:none}
}

/* 41.3 · .scl 10 sutunluk izgara; ama moduller onu 2-3 secenekli satirlar icin de
   kullaniyor (.fn-yon "Alacak/Borc", .fr-onc "Yuksek/Orta/Dusuk", .fr-hd, .fr-ht).
   Olculdu: 3 dugme 10 sutunun ilk ucune dusuyor -> 28-40 px kutular, yazi disari
   tasiyor, satirin %70'i bos. Sutun sayisi artik oge sayisini izliyor.
   Gercek 1-10 olceklerinde de dugmeler 25,8x38 px kaliyordu; dar ekranda 5x2'ye iner. */
.scl:not(:has(> :nth-child(6))),.olcek10:not(:has(> :nth-child(6))){
  grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr)}
@media (max-width:430px){
  .scl:has(> :nth-child(6)),.olcek10:has(> :nth-child(6)){grid-template-columns:repeat(5,minmax(0,1fr))}
}

/* 41.4 · .st karolarindaki buyuk deger tek satira kilitli (index.html:610 nowrap+ellipsis).
   Cok parcali degerler ("12 gr · 3 ceyrek") ve "7 sa 30 dk" dar telefonda "..." ile
   kesiliyor; kullanici rakami okuyamiyor. Kesilmektense alt satira insin. */
@media (max-width:1023px){
  .st b{white-space:normal;overflow-wrap:anywhere;line-height:1.15}
}

/* 41.5 · Komut paleti centik payi almiyordu: kurulu PWA'da arama kutusu ve kapat
   dugmesi durum cubugunun altinda kaliyordu. */
@media (max-width:1023px){
  .palet{padding-top:calc(env(safe-area-inset-top) + 8px)}
}

/* 41.6 · Spor set/kalem satirlari: .sp-set izgarasi 20px+12px+30px sabit sutun ve
   4x6px bosluk ayiriyor, ustune .sp-u .inp sag tarafta birim etiketi icin 46px,
   solda 12px dolgu tutuyor. 320 px'te sayiya kalan ic genislik ~27 px'e iniyor
   (41.1 ile yazi 16 px olunca daha da dar) -- girilen kilo/tekrar gorunmuyor.
   Dar ekranda sabit paylar kisaltiliyor. */
@media (max-width:430px){
  .m-spor .sp-set{grid-template-columns:18px minmax(0,1fr) 10px minmax(0,1fr) 28px;gap:4px}
  .m-spor .sp-set.tek{grid-template-columns:18px minmax(0,1fr) 28px}
  .m-spor .sp-kalem{gap:4px}
  .m-spor .sp-u .inp{padding-left:8px;padding-right:32px}
  .m-spor .sp-u span{right:6px;font-size:10px}
}


/* ============ 42 · MOBIL DENETIMI · MODUL SATIRLARI ============
   Kaynak denetiminde cikip 320-430 px'te olculerek dogrulanan sikismalar. */

/* 42.1 · Sayfa basligi: dar ekranda cip kumesi kucuImuyor, baslik 0-30 px'e cokuyordu.
   Cipler kendi icinde sarsin, baslik uzun tek kelimede kirilabilsin. */
.pg-hd .ustb h1,.pg-hd .pg-top h1{overflow-wrap:anywhere}
@media (max-width:430px){
  .pg-hd .ustb > .sag,.pg-hd .pg-top > .sag{flex:0 1 auto;min-width:0;flex-wrap:wrap;
    justify-content:flex-end;row-gap:6px}
}

/* 42.2 · Saglik/Spor vitrinindeki olcum karolari 172 px'lik minmax yuzunden
   butun telefonlarda TEK sutuna dusuyordu (320 px'te alti karo alt alta). */
@media (max-width:640px){
  .sg-hero .sg-mini,.sp-hero .sp-mini,.sg-mini,.sp-mini{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* 42.3 · Para > Gelir/Gider/Net ucIusu: 320 px'te uc sutun 75 px'e dusup
   tutarlarin hepsini "..." ile kesiyordu (olculdu: uctu de kirpik). */
@media (max-width:380px){
  .m-finans .fn-ay{grid-template-columns:repeat(2,minmax(0,1fr))}
  .m-finans .fn-ay > div:nth-child(3):last-child{grid-column:1 / -1}
}

/* 42.4 · Para > butceli kategori satiri: ilerleme cubugu 320 px'te 12 px'e
   dusup anlamsizlasiyordu (olculdu). Cubuk kendi satirina insin. */
@media (max-width:430px){
  .m-finans .fn-ks{grid-template-columns:minmax(0,1fr) auto;row-gap:5px}
  .m-finans .fn-ks i{grid-column:1 / -1}
  .m-finans .fn-ks > span{white-space:normal;overflow:visible;line-height:1.25}
}

/* 42.5 · Arsiv > Puanin: on yildiz kart disina tasiyip kirpiliyordu; 8/9/10 verilemiyordu. */
@media (max-width:1023px){
  .m-arsiv .ar-pk{grid-template-columns:minmax(0,1fr);gap:10px;justify-items:start}
  .m-arsiv .ar-yildizlar{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:2px;width:100%}
  .m-arsiv .ar-yildiz{width:auto;min-width:0}
}

/* 42.6 · Arsiv > izleme kaydi satiri: sil dugmesi konumlandirilmis oldugu icin
   sure yazisinin ustune biniyordu. Dugme akisa alinir. */
.m-arsiv .ar-ot{grid-template-columns:minmax(0,1fr) auto auto}
.m-arsiv .ar-otsil{position:static;grid-column:3;grid-row:1;align-self:center}

/* 42.7 · Sosyal > kisi basligi: dogum gunu rozeti daralmadigi icin adi ~70 px'e
   sikistirip harf harf kiriyordu. Rozet alt satira insin. */
@media (max-width:440px){
  .m-sosyal .so-kbu{flex-wrap:wrap}
  .m-sosyal .so-kbu > .m-rozet{order:3;flex:none;margin-left:58px}
}

/* 42.8 · Sosyal > kisi formu: Gun/Ay/Yil satiri cekmeceden tasiyordu (320 px'te
   322 px'lik satir 284 px'lik cekmecede). Sutunlar daralabilir olsun. */
.m-sosyal .so-dg{grid-template-columns:minmax(0,1fr) minmax(0,1.6fr) minmax(0,1fr)}

/* 42.9 · Imaj > Hafta: bugunun satirindaki "Giydim" dugmesi kombin adini
   2-3 harfe dusuruyordu. Dugme kendi satirina insin. */
@media (max-width:430px){
  .m-imaj .im-hg{flex-wrap:wrap}
  .m-imaj .im-hgb{flex:1 1 100%;min-width:0}
  .m-imaj .im-hgg{flex:0 0 auto;order:9;margin:0 0 4px auto}
}

/* 42.10 · Onay kutusu satirlari: .frm label kurali (11.5 px, soluk, ust etiket)
   bunlari da yakaliyordu; satir okunmaz bir etikete donuyordu. */
.frm label.fn-cb,.frm label.fr-cb,.frm label.vr-cb,
.frm label:has(> input[type="checkbox"]){display:flex;align-items:center;gap:10px;
  min-height:44px;font-size:14px;font-weight:500;color:var(--txt);margin-bottom:0}
.frm label.fn-cb input[type="checkbox"],.frm label.fr-cb input[type="checkbox"],
.frm label.vr-cb input[type="checkbox"],
.frm label:has(> input[type="checkbox"]) input[type="checkbox"]{width:20px;height:20px;flex:none;margin:0}

/* 42.11 · Ibadet vitrini: "+ cemaat" seridi ~30 px ve namaz dugmesine 1 px mesafede.
   .vkr-k overflow:hidden oldugu icin ::after ile tasirma ise yaramaz; gercek yukseklik. */
@media (pointer:coarse){
  .vkr-k .cmt{min-height:40px;padding:10px 8px}
}

/* 42.12 · Modul hata karti sifir dolguluydu: metin yuvarlak kosede kirpiliyor,
   kirmizi hata seridi hic cizilmiyordu. */
.card.mhata{padding:16px var(--a4);box-shadow:var(--sh),inset 3px 0 0 var(--miss)}

/* 42.13 · Gizli modda 1-10 / 1-5 olcek dugmeleri bulaniktı ama tiklanabilir kaliyordu:
   kullanici gormeden puan veriyordu. Rakamlar net kalir, gizlenmesi gereken
   tek sey SECIM; o da bulanik yerine notr gosterimle saklanir. */
:root.gizli .scl.priv,:root.gizli .olcek10.priv{filter:none}
:root.gizli .scl.priv button[aria-pressed="true"],
:root.gizli .olcek10.priv button[aria-pressed="true"]{background:var(--bg2);color:var(--mut);
  border-color:transparent;box-shadow:none;font-weight:600}


/* ============ 43 · MOBIL AKICILIK ============
   Olcum (masaustu Chrome, 375 px, Bugun ekrani): tam stil yeniden hesabi 13,1 ms,
   tema/gizli mod gecisi 31,8 ms. Orta sinif telefonda bunun ~4 kati.

   DENENIP VAZGECILEN: content-visibility:auto ekran disi bolumlerde yeniden hesabi
   13,1 -> 2,0 ms'ye dusuruyordu, ama bu Chrome surumunde contain-intrinsic-size'in
   "auto" degeri gercek boyu hatirlamadi: sayfa yuksekligi 6.586 px yerine 3.032-6.960 px
   arasinda takili kaldi ve tam gezmeye ragmen yakinsamadi. Bozuk kaydirma cubugu
   agirliktan kotu; geri alindi. (Ayni sey .card/.ag uzerinde de denendi, ayni sonuc.)
   :has() kurallarinin maliyeti olculdu: fark yok (2,90 -> 2,95 ms). */

/* 43.1 · Ust ve alt cubuktaki arka plan bulanikligi, kaydirilan icerigin uzerinde
   duran iki tam genislikte katman; her karede yeniden bulaniklastirilir — telefon
   GPU'sunda kaydirmayi en cok zorlayan is. Yaricap 18 -> 12 px, saturate kaldirildi. */
@media (max-width:1023px){
  .ust,.nav{backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
}

/* 43.2 · Kapali cekmece "visibility:hidden" ile duruyor; Chrome bu durumda
   animasyonlari DURDURMAZ. Icindeki .rtur i noktasi yt-nb ile box-shadow
   oynatiyor — box-shadow birlestirilemez, yani gorunmeyen bir oge icin her
   karede yeniden boyama. Her sayfada, surekli. */
.ck:not(.acik) .ck-panel *,.ck:not(.acik) .ck-panel *::before,.ck:not(.acik) .ck-panel *::after{
  animation-play-state:paused
}

/* 43.2b · Masaustu rayi mobilde gizli ama DOM'da; icindeki ayni nokta da
   animasyonlu kaliyor. Emniyet icin durduruluyor. */
@media (max-width:1023px){
  .rail *,.rail *::before,.rail *::after{animation-play-state:paused}
}

/* 43.3 · Nabiz karosundaki EKG cizgisi stroke-dashoffset oynatiyor: SVG geometrisi,
   yani birlestirilemez, her karede ana is parcaciginda yeniden boyama — hem de
   sonsuz. Dokunmatikte uc turdan sonra cizili halde kalir. */
@media (hover:none){
  .ekg path{animation-iteration-count:3;animation-fill-mode:forwards}
}

/* 43.4 · Bolum kutulari kendi yerlesim sinirini korusun.
   NOT: burada bir sure "contain:layout paint" vardi; paint, kutunun DISINA tasan
   her seyi kirpiyor — "Siradaki adim" panelinin altindaki buyuk golge (0 22px 44px
   -24px) kesik gorunuyordu. Golge kirpilmasin diye yalnizca layout birakildi. */
@media (max-width:1023px){
  .icerik section.sec{contain:layout}
}


/* ============ 44 · MOBIL GERI BILDIRIM DUZELTMELERI ============ */

/* 44.1 · Gunun sozu komsulariyla hizali degildi: .soz'un kendi 20px yan marji
   .sec'in 20px dolgusuna EKLENIYOR, kart 40->335 kaliyordu (ustu ve alti 20->355).
   .sek/.m-sekme'de cozulen desenin aynisi. */
.sec:not(.inp) > .soz{margin-left:0;margin-right:0}

/* 44.2 · Gizli mod ve tema dugmeleri ust cubuga tasindi (ustHtml).
   Hero'daki cip kumesinden kaldiriliyor: Gun/Hafta + hava alt satira tasmiyor. */
@media (max-width:1023px){
  .pg-hd .sag > .icb.goz,
  .pg-hd .sag > button[data-tema-dur],
  .ustb .sag > .icb.goz,
  .ustb .sag > button[data-tema-dur]{display:none}
}

/* 44.3 · Claude sohbeti: .msg{background:none} yaziliydi ama .msg.u ve .msg.c
   (0-2-0) onu eziyordu; mesajlarin ARKASINDA kare kosleli renkli bir kutu
   kaliyordu — kullanicida beyaz, Claude'da index.html'deki --bluet seftali.
   Gorunumu zaten icindeki .bl3 balonu tasiyor, satirin kendisi seffaf olmali.
   (.msg.u once duzeltilmis, .msg.c atlanmisti.) */
.msg.u,.msg.c{background:none;box-shadow:none;border-radius:0;padding:0}

/* 44.4 · Emoji ikonlar altindan kesiliyordu: .e{line-height:1} 30px kutu veriyor,
   glif 35px istiyor; ustune .ak > span:not(.ti) ve .lg overflow:hidden koyuyor.
   Satir yuksekligini buyutmek her yerde hizayi kaydirirdi; tasmasina izin
   vermek yeterli — glif tam ciziliyor, yerlesim hic degismiyor. */
.e,.ak > span.e,.gc > span.e,.e.lg,.e.md,.e.sm,.e.xl{overflow:visible}

/* 44.5 · "Ben ve sistem" / Profil satirlari: aciklama sutunu etiketle ayni satirda
   yaris ediyor, 320px'te uc satira sarip oka dayaniyordu. Dar ekranda alt alta. */
@media (max-width:520px){
  .pr:has(> .git2){display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 10px;align-items:center}
  .pr:has(> .git2) > b{grid-column:1;grid-row:1;justify-self:start}
  .pr:has(> .git2) > span{grid-column:1;grid-row:2;justify-self:start;text-align:left}
  .pr:has(> .git2) > .git2{grid-column:2;grid-row:1 / span 2;align-self:center}
}

/* 44.6 · Bugun ekraninda dikey sira ve ust bosluklar.
   Eskiden: baslik -> namaz akisi -> gunun sozu; aralarda 36 px ve 26 px bosluk vardi.
   v0.87: gunun sozu artik .bugun.tek icinde, vitrinin altinda (vakit bari ilk ekranda; sozun order kurali kalkti).
   Kapsayici (#ekran) yalnizca Bugun'de flex yapiliyor (.vk yalnizca orada) — boylece
   diger sayfalarda marj birlesmesi (margin collapsing) degismiyor. */
@media (max-width:1023px){
  #ekran:has(> .vk){display:flex;flex-direction:column}
  #ekran:has(> .vk) > .pg-hd{order:0}
  #ekran:has(> .vk) > .vk{order:1;margin-top:8px;margin-bottom:0}
  #ekran:has(> .vk) > .bugun,#ekran:has(> .vk) > .tek{order:2}
  #ekran:has(> .vk) > .bugun > .sec:first-child{padding-top:16px}
  .bugun.tek > .sec > .soz{margin-left:0;margin-right:0}
}
@media (min-width:1024px){.bugun .col > .sec > .soz{margin-left:0;margin-right:0}}


/* ============ 45 · GERI BILDIRIM · PROFIL, DOKTOR, ZIHIN ============ */

/* 45.1 · Doktor dosyasi: bir .sec icinde art arda gelen kartlarin arasinda hic
   bosluk yoktu (blok() "<div class=grp>+<div class=card>" basiyor, sonuna da
   HAZIRLIK icin ayri bir <article class=card> geliyor). Kartlar birbirine
   yapisik duruyor, golgeler ust uste biniyordu. */
.sec:not(.inp) > .card + .card,
.sec:not(.inp) > .card + .pulse,
.sec:not(.inp) > .pulse + .card{margin-top:var(--a3)}

/* 45.2 · Profil fotografi: 84 -> 100 px. Fotograf varken altindaki renkli
   halo (box-shadow ... var(--c-claude), 14px asagi kaymis) fotografin altinda
   hizasiz bir zemin gibi gorunuyordu; harf avatarinda kalir, fotografta notr
   ve ortali bir golgeye doner. Gradyan zemin de fotografin arkasinda gerekmez. */
.pf-av{width:100px;height:100px;border-radius:32px;font-size:38px}
.pf-av:has(img){background:none;box-shadow:0 12px 26px -16px rgba(10,8,30,.6)}
.pf-av img{display:block;border-radius:inherit}
@media (max-width:520px){
  .pf-av{width:88px;height:88px;border-radius:28px;font-size:34px}
}

/* 45.3 · Plan basligindaki "Sabah yoklamasini degistir": .alt3'un soluk gri
   metni icinde .lnk olarak duruyordu, okunmuyordu. Artik kendi satirinda cip. */
.yk-degistir{margin-top:8px}

/* 45.4 · Zihin: masaustunde solda puanlama + son 14 gun, sagda "Neyle birlikte"
   ve sonrasi. .ikili zaten 1024 px'in altinda tek sutuna iniyor. */
@media (min-width:1024px){
  .zh-ikili > div > .sec:first-child{padding-top:0}
}

/* 45.5 · Nefes gostergesi buyutuldu. */
.zh-daire{width:132px;height:132px}
.zh-daire span{font-size:13px}
@media (max-width:430px){.zh-daire{width:116px;height:116px}}

/* 45.7 · Zihin > "Claude notu": Claude'un biraktigi tek not.
   Koyu vitrin diliyle (.kok / .hero) ayni: ayni radyal gradyan, ayni golge,
   ayni yaricap ve sag ustte yumusak bir Claude isigi. 27. bolumdeki token
   haritasina eklendigi icin icindeki her sey koyu zemine gore okunur.
   Vitrindeki oruntuden tek farki: isik animasyonsuz — sayfada surekli donen
   bir animasyon daha olmasin. */
.zh-cnot{position:relative;overflow:hidden;border-radius:var(--r);padding:18px;color:#fff;
  background:radial-gradient(118% 128% at 8% -12%,#342c63 0%,var(--kok1) 46%,var(--kok2) 100%);
  box-shadow:0 22px 44px -24px rgba(20,12,60,.7)}
.zh-cnot::after{content:"";position:absolute;right:-70px;top:-92px;width:232px;height:232px;border-radius:50%;
  pointer-events:none;background:radial-gradient(circle,color-mix(in srgb,#e29a7d 38%,transparent),transparent 66%)}
.zh-cnot > *{position:relative;z-index:1}
.zh-cnot-et{display:inline-flex;align-items:center;gap:7px;margin-bottom:13px;
  font-size:10px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;
  padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.12);color:#ffc7ad}
.zh-cnot-et .eclaude{color:#ffc7ad}
.zh-cnot p{margin:0;font-size:14px;line-height:1.62;color:rgba(255,255,255,.92);
  white-space:pre-line;overflow-wrap:anywhere}
.zh-cnot-zm{display:block;margin-top:13px;font-size:11px;color:rgba(255,255,255,.45)}

/* Not yokken: ayni panel, kisilmis — alan belli olsun ama one cikmasin. */
.zh-cnot-bos{box-shadow:0 14px 30px -24px rgba(20,12,60,.6)}
.zh-cnot-bos::after{opacity:.4}
.zh-cnot-bos p{font-size:12.5px;line-height:1.6;color:rgba(255,255,255,.58)}
.zh-cnot-bos .zh-cnot-et{background:rgba(255,255,255,.08);color:rgba(255,255,255,.55)}
.zh-cnot-bos .zh-cnot-et .eclaude{color:rgba(255,255,255,.55)}

/* ============================================================
   46 · Bayat alan serisi
   Bir alan modulu sunucudan guncellenemediginde panel eskiden onbellekteki
   kopyayi sessizce cizmeye devam ediyordu: ekran dolu gorunuyor, her yazma
   arka planda reddediliyor ve kullanici nedenini hicbir yerde goremiyordu.
   Bu serit o durumu gorunur kilar. Uyari rengi icin --c-para/--kirmizi degil,
   temanin kendi uyari jetonunu kullaniyoruz.
   ============================================================ */
.m-bayat{display:flex;align-items:flex-start;gap:12px;padding:13px 15px;border-radius:var(--r);
  background:color-mix(in srgb,var(--miss) 9%,var(--sf));
  box-shadow:inset 3px 0 0 0 var(--miss),var(--shs)}
.m-bayat > div{flex:1 1 auto;min-width:0}
.m-bayat b{display:block;font-size:13.5px;color:var(--ink)}
.m-bayat span{display:block;margin-top:3px;font-size:12px;line-height:1.5;color:var(--mut);overflow-wrap:anywhere}
.m-bayat .btn{flex:none;align-self:center}
@media (max-width:520px){
  .m-bayat{flex-wrap:wrap}
  .m-bayat .btn{width:100%;align-self:stretch}
}

/* ============================================================
   47 · Bugun basligi ve Claude sohbeti
   ============================================================ */

/* 47.1 · Mobilde Gun/Hafta ikilisi basliktan kalkiyor. 98 px yer kapliyordu ve
   gun adini ikinci satira kiriyordu: "Cumartesi, 19 Eylul" 152 px'e sigmiyor,
   ikili kalkinca baslik 256 px'e cikip tek satira dusuyor. Hafta gorunumune
   Plan sekmesinden zaten ulasiliyor. Sag ustte yalniz hava kaliyor. */
@media (max-width:1023px){
  /* YALNIZ Bugun'deki Gun/Hafta ikilisi (.seg-gh). Plan sayfasinin basliginda da
     .seg var ama o Bugun/Yarin anahtari; genel bir kural onu da gizleyip Plan'i
     mobilde kullanilmaz yapardi. */
  .pg-hd .sag > .seg-gh{display:none}
  .pg-hd .ustb > .bl{flex:1 1 200px}
  /* Sag tarafinda ANAHTAR olan basliklarda (Plan'daki Bugün/Yarın) taban 200 px
     fazla: 200 + 178 (anahtar + hava) + 12 bosluk satira sigmiyor ve anahtar tek
     basina ikinci satira dusuyordu — baslik 157 px yer kapliyordu. Bugün'de .sag
     yalniz hava oldugu icin oradaki 200 px yerinde kaliyor. */
  .pg-hd .ustb:has(> .sag .seg:not(.seg-gh)) > .bl{flex:1 1 120px}
}

/* 47.2 · Claude sayfasi: mobilde tek sutun (once sohbet, altinda durum paneli),
   masaustunde IKI sutun ve sohbet SAGDA.
   Isaretlemede sohbet once geliyor (mobilde ustte olmali), bu yuzden sutun sirasi
   `order` ile ters cevriliyor; DOM sirasi degismedigi icin klavyeyle gezinme ve
   ekran okuyucu mobildeki sirayi koruyor. */
.ikili.gelen{display:block}
.ikili.gelen > div + div{margin-top:18px}
@media (min-width:1024px){
  /* Sohbet daha genis: sol sutun kart yiginin, sag sutun okunacak metin. */
  .ikili.gelen{display:grid;grid-template-columns:minmax(0,0.82fr) minmax(0,1.18fr);
    gap:0 26px;align-items:start}
  .ikili.gelen > div:first-child{order:2;min-width:0}
  .ikili.gelen > div + div{order:1;min-width:0;margin-top:0}
  /* Sohbet artik yarim genislikte: 72ch siniri kutuyu daraltiyordu, kaldiriyoruz. */
  .ikili.gelen .msg .bl3{max-width:86%}
  /* Iki sutun da ekrani doldursun; sag sutundaki kutu kendi icinde kaysin. */
  .ikili.gelen > div:first-child{position:sticky;top:0}
}

/* 47.3 · Sohbet kutusu ekrani doldursun (degerler olcumle belirlendi). */
.chat-kutu{height:calc(100dvh - 318px);min-height:240px}
@media (min-width:1024px){
  .chat-kutu{height:calc(100dvh - 250px);min-height:420px;padding:20px 22px}
  /* Alan tam genislikte ama SATIR uzunlugu serbest degil: 938 px'lik bir kutuda
     balon 744 px'e cikiyor ve satirlar 110+ karaktere uzuyordu. Okunur uzunlukta
     kesiyoruz; kutu yine ekrani dolduruyor. */
  .msg .bl3{font-size:14.5px;max-width:72ch}
}

/* 47.4 · Mobilde ucuz bir ic ice kutu yigini vardi: beyaz .card > gri .chat-kutu
   > balon. Ust iki katmani kaldiriyoruz; geriye yalniz balon kaliyor, sohbet
   kenardan kenara akiyor ve yazi buyuyor. */
@media (max-width:1023px){
  .sec.chat{padding-left:0;padding-right:0}
  .sec.chat > .card{border-radius:0;box-shadow:none;background:none;border:0}
  .chat-kutu{background:none;padding:8px 16px 12px}
  .msg{max-width:94%}
  .msg .bl3{font-size:15px;line-height:1.58;padding:12px 15px}
  .msg .av2{width:28px;height:28px}
  .yaz2{border-radius:0;padding:10px 16px calc(10px + env(safe-area-inset-bottom))}
  /* Bu sayfanin ust satirinda yalnizca Claude turu kalsin. */
  #ekran:has(> .ikili.gelen) .pg-hd .sag > button.hava,
  #ekran:has(> .ikili.gelen) .pg-hd .sag > button[data-yenile]{display:none}
}

/* ============================================================
   48 · Geriye dönük rutin girişi (Bölüm 6)
   Rutinler sayfasında "hangi güne yazıyorum" şeridi. Geçmiş gün seçiliyken
   ekrandaki işaretler hâlâ BUGÜNÜN durumu olduğu için uyarı satırı çıkar.
   ============================================================ */
.rt-gun{margin-top:14px}
.rt-gun .m-etiketler{align-items:center;gap:6px}
.rt-gun-et{font-size:11.5px;color:var(--fnt);letter-spacing:.02em;margin-right:2px}
.rt-gun .chip{padding:0 11px;font-variant-numeric:tabular-nums}
.rt-gun-uy{margin:9px 2px 0;padding:9px 11px;border-radius:12px;
  background:color-mix(in srgb,var(--amb) 12%,transparent);
  border:1px solid color-mix(in srgb,var(--amb) 34%,transparent);color:var(--ink)}
.rt-gun-uy b{color:var(--ink)}
@media (max-width:420px){
  .rt-gun .chip{height:34px;padding:0 10px;font-size:12.5px}
  .rt-gun-et{width:100%;margin:0 0 2px}
}
/* "sonradan" rozeti: kayıt geriye dönük girildi. Uyarı değil, bilgi —
   istatistikte normal sayılıyor, o yüzden kırmızı değil nötr. */
.rt-snr{display:inline-block;font-style:normal;font-size:9.5px;letter-spacing:.04em;
  padding:1px 6px;margin-left:5px;border-radius:999px;vertical-align:1px;
  background:var(--bg2);border:1px solid var(--line);color:var(--fnt);white-space:nowrap}

/* ============================================================
   49 · Gösterim modu (Bölüm 7)
   Panel birine gösterilirken hassas alanlar kapanır ve kayıt yazılmaz.
   Düğme menünün altında, açıkken belirgin: yanlışlıkla açık kalmasın.
   ============================================================ */
.gstr{display:flex;align-items:center;gap:10px;width:100%;margin-top:10px;padding:11px 12px;
  border-radius:14px;border:1px solid var(--line);background:var(--bg2);color:var(--fnt);
  font-size:12.5px;font-weight:600;text-align:left;cursor:pointer;
  transition:background-color 150ms ease,color 150ms ease,border-color 150ms ease}
.gstr .e{font-size:15px;line-height:1;flex:none}
.gstr.on{background:color-mix(in srgb,var(--amb) 16%,var(--bg2));
  border-color:color-mix(in srgb,var(--amb) 50%,transparent);color:var(--ink)}
@media (hover:hover) and (pointer:fine){.gstr:hover{background:var(--sf);color:var(--ink)}}
.rail.dar .gstr{justify-content:center;padding:11px 0}
.rail.dar .gstr .rt{display:none}
/* Kapalı alana adresten girilirse: örnek değerler, gerçek kayıt yok. */
.gstr-ornek{padding:16px var(--a4)}
.gstr-ornek > b{display:block;font-size:15px;color:var(--ink)}
.gstr-ornek > p{margin:6px 0 12px;font-size:12.5px;line-height:1.55;color:var(--fnt)}
.gstr-ornek .pulse{margin:0}
/* Gösterim modunda yazma düğmeleri gizlenmez, tıklanınca sunucu reddeder ve sebebini söyler —
   düğmenin kaybolması "bozuk" hissi veriyor, reddin gerekçesi öğreticidir. */
:root.gosterim .yazd{opacity:.55}
/* Gösterim modu şeridi: mod açıkken panelden hiçbir kayıt yazılmıyor (api.php 423).
   Tek işaret sönük bir düğmeydi; kullanıcı düğmelere basıp "çalışmıyor" sanıyordu. */
.gsr{display:flex;align-items:center;gap:12px;margin:0 0 4px;padding:12px 15px;border-radius:var(--rs);
  background:color-mix(in srgb,var(--amb) 18%,var(--sf));border:1px solid color-mix(in srgb,var(--amb) 45%,transparent)}
.gsr .e{font-size:18px;line-height:1;flex:none}
.gsr > div{min-width:0;flex:1}
.gsr b{display:block;font-size:13.5px;font-weight:600;color:var(--ink)}
.gsr span{display:block;font-size:12px;color:var(--fnt);line-height:1.45}
.gsr span b{display:inline;font-size:12px}
.gsr .btn{flex:none}
.gsr.hata{background:color-mix(in srgb,var(--miss) 14%,var(--sf));
  border-color:color-mix(in srgb,var(--miss) 45%,transparent)}
/* Taşma denetimi çıktısı: kopyalanabilsin diye seçilebilir, kendi içinde kayar. */
/* YAPISAL KORUMA: sayfa kapları, içindeki hiçbir öğenin min-content'i yüzünden
   ekrandan geniş olamaz. Bunlar dış sarmalayıcının flex/grid öğeleri ve
   varsayılan min-width:auto ile min-content'e kilitleniyorlardı; tek bir geniş
   satır (bkz. .ans) bütün sayfayı yana kaydırıyordu. Taşan öğe artık kendi
   kutusunda kalır, sayfa genişlemez. */
.bugun,.ikili,.mdz,.mdz-ana,.rt-iki,.rt-sol,.rt-sag,.sp-iki,.sp-sol,.sp-sag{min-width:0}

.tasma-sonuc{margin:10px 0 0;padding:10px 12px;border-radius:var(--rs);background:var(--bg2);
  font:11.5px/1.5 ui-monospace,Consolas,monospace;color:var(--ink);white-space:pre-wrap;
  word-break:break-word;max-height:260px;overflow:auto;user-select:text;-webkit-user-select:text}
@media (max-width:520px){.gsr{flex-wrap:wrap}.gsr .btn{width:100%}}

/* 50 · Hedef önceliği (Bölüm 4). Yalnız 1 ve 2 görünür: 3 varsayılan, rozet gürültü olmasın. */
/* Rakam yuvarlağın içine TAM oturmuyordu: rozet satır içi bir kutu ve varsayılan
   olarak yazı tabanına (baseline) hizalanıyor, üstelik miras alınan line-height
   (1.35) rakamı kutunun içinde yukarı itiyordu. line-height:1 + vertical-align:middle
   ile rakam kutunun ortasında, kutu da yazının ortasında duruyor. */
.hd-onc{flex:none;font-style:normal;display:inline-grid;place-items:center;
  width:19px;height:19px;line-height:1;vertical-align:middle;box-sizing:border-box;
  margin-right:6px;border-radius:50%;font-size:10.5px;font-weight:700;
  font-variant-numeric:tabular-nums;
  background:var(--bg2);border:1px solid var(--line);color:var(--fnt)}
/* Esnek kapsayıcıda (Plan sayfasındaki büyük kart) baseline hizası geçerli değil;
   orada zaten align-items:center var, vertical-align'a gerek kalmıyor. */
.hdf-top b .hd-onc{vertical-align:baseline}
/* Ana sayfadaki rakam gerçekte şundan kayıyordu: yukarıdaki "34 · Hedefler" bölümünün
   .hd-t i kuralı (sağdaki %40 hapı için yazılmış) torun seçici olduğu için rozeti de
   yakalıyor ve özgüllükte (0,1,1 > 0,1,0) kazanıyor. Sızan padding:2px 8px + 12,5px punto
   19 px'lik dairenin iç kutusunu 1 px'e düşürüyor, place-items:center de kendinden geniş
   rakamı ortalayamıyor. Hapın kuralına dokunmadan, yalnız rozet kapsamında geri alıyoruz. */
/* Gece penceresi uyarısı (02:00–imsak): namaz kaydı hangi güne gidiyor, başlıkta tek satır (v0.67) */
.pg-hd .gc-uy{margin:4px 0 0;font-size:12.5px;color:var(--mut)}
.pg-hd .gc-uy b{color:var(--ink);font-weight:600}
.hd-t b .hd-onc{padding:0;font-size:10.5px}
.hd-t b .hd-onc:not(.bir){background:var(--bg2);color:var(--fnt)}
.hd-onc.bir{background:color-mix(in srgb,var(--amb) 22%,transparent);
  border-color:color-mix(in srgb,var(--amb) 45%,transparent);color:var(--amb)}

/* ============================================================
   51 · Su litre bazlı (Bölüm C/3)
   Dört düğme dar ekranda sarar; hedef ayarı katlanır, gürültü yapmaz.
   ============================================================ */
/* Su olcu duglemeleri artik izgara (bkz. .su-a yukarida); buradaki flex geri alindi. */
.su-h{margin-top:10px;padding-top:9px;border-top:1px solid var(--line)}
.su-h > summary{font-size:11.5px;color:var(--fnt);cursor:pointer;list-style:none}
.su-h > summary::-webkit-details-marker{display:none}
.su-h > summary::after{content:' · değiştir';color:var(--mut)}
.su-hf{display:flex;align-items:center;gap:8px;margin-top:8px}
.su-hf .inp{width:88px;text-align:center;font-variant-numeric:tabular-nums}
.su-hf span{font-size:12px;color:var(--fnt)}
/* 420 px altında yazıyı biraz küçült: üç sütun bozulmasın diye sarma yok. */
@media (max-width:400px){.su-a .btn{font-size:11.5px;padding:0 4px}}

/* ============================================================
   56 · İş → Talepler: Okul Site talep hattı
   Grup çipleri + kanal süzgeci, analiz şeridi (.m-kpi), zengin talep kartı (.tlp.th).
   .tlp b blok ve 14.5 px; kart içindeki satır içi <b>'ler burada geri alınır.
   ============================================================ */
.th-arac{display:flex;align-items:center;gap:8px;margin:12px 0}
.th-grup{display:flex;gap:6px;flex:1;min-width:0;overflow-x:auto;scrollbar-width:none;padding:2px 1px}
.th-grup::-webkit-scrollbar{display:none}
.th-grup .chip{flex:none;display:inline-flex;align-items:center;gap:6px}
.th-grup .chip .sy{font-size:11px;font-weight:700;opacity:.65;font-variant-numeric:tabular-nums}
.th-grup .chip .say2{background:var(--acc-dolgu);color:var(--acc-ust)}
/* <select> site seçicisiyle gizlenir (secBagla), yanına .inp.sec düğmesi gelir: boyu çiplerle aynı, genişliği içeriği kadar */
.th-kanal,.th-kanal + .inp.sec{flex:none;width:auto;max-width:10.5em;height:32px;padding:0 10px;font-size:12.5px;border-radius:999px}
.th-kanal + .inp.sec .ic{width:14px;height:14px}
.th-kpi{margin-top:4px}
.th-kpi b{font-size:20px}
.th-not{margin:0 4px 10px}
.tlp.th{grid-template-columns:minmax(0,1fr);gap:0}
.tlp.th p{margin-bottom:0}
.th-b{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:11px;align-items:start}
.th-t b small{font-size:11px;font-weight:600;color:var(--fnt)}
.th-r{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}
.tlp .sure2.sade{background:var(--bg2);color:var(--mut)}
.tlp .th-m{margin-top:9px}
.th-m b,.th-kz b,.th-c b,.th-kh b{display:inline;font-size:inherit;line-height:inherit}
.th-m b{font-weight:600;color:var(--txt)}
.th-kz{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:8px;font-size:12px;color:var(--mut)}
.th-kz b{font-size:15px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
.th-kz .lnk{font-size:12.5px;font-weight:600}
.th-u{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}
.th-u .src{white-space:normal;overflow-wrap:anywhere}
.th-c{margin-top:10px;padding:10px 12px;border-radius:12px;background:color-mix(in srgb,var(--c-claude) 8%,transparent);
  border:1px solid color-mix(in srgb,var(--c-claude) 20%,transparent)}
.th-ch{display:flex;align-items:center;gap:7px;flex-wrap:wrap;font-size:12px}
.th-c b{font-weight:700;color:var(--c-claude)}
.th-c time{margin-left:auto;font-size:11px;color:var(--fnt);font-variant-numeric:tabular-nums}
.tlp .th-c p{color:var(--txt);font-size:12.5px;margin-top:6px;white-space:pre-line}
.th-c .th-ad i{font-style:normal;font-weight:700;color:var(--mut);margin-right:6px}
.th-c.yok{display:flex;align-items:center;gap:7px;background:none;border-style:dashed;font-size:12px;color:var(--fnt)}
.th-k{margin-top:10px;padding:10px 12px;border-radius:12px;background:var(--bg2)}
.th-kh{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:11.5px;color:var(--mut)}
.th-kh + p,.th-k p + p{margin-top:4px}
.th-k p + .th-kh,.th-k .th-ac + .th-kh{margin-top:10px}
.th-kh b{font-weight:700;color:var(--ink)}
.th-kh span{margin-left:auto;font-size:11px;color:var(--fnt)}
.th-kh .ic{width:13px;height:13px;flex:none}
.tlp .th-k p{color:var(--txt);font-size:12.5px}
.th-k small{font-size:10.5px;color:var(--fnt);font-weight:600}
.th-ac{display:inline-flex;align-items:baseline;gap:6px;margin-top:6px;font-size:12px;text-decoration:none}
.th-ac > span{text-decoration:underline;text-underline-offset:3px}
.tlp .th-msj{margin-top:6px;padding:9px 11px;border-radius:10px;background:var(--sf);white-space:pre-wrap;color:var(--ink)}
.th-k.sil{display:flex;gap:8px;align-items:flex-start;font-size:12px;color:var(--mut);line-height:1.5}
.th-k.sil .ic{width:14px;height:14px;flex:none;margin-top:2px}
.tlp.th.pasif > :not(.dug){opacity:.72}
.tlp.th .dug{margin-top:12px}
.tlp.th .dug .btn .ic{width:13px;height:13px}
@media (max-width:420px){.th-kh span{margin-left:0;flex-basis:100%}}
/* Telefonda çipler yana kaymasın: çipler ve kanal düğmesi aynı esnek satırda sarar (iki satır, hepsi görünür) */
@media (max-width:560px){.th-arac{flex-wrap:wrap;gap:6px}.th-grup{display:contents}}
/* v0.64 · Rutin önceliği çipi (Rutinler kartı): dokununca yüksek → normal → düşük döner. Düşük = günde 1 sessiz hatırlatma */
.rt-onc{display:inline-flex;align-items:center;margin-left:6px;padding:1px 7px;border:0;border-radius:99px;font:inherit;font-size:10.5px;
  font-weight:600;line-height:1.6;cursor:pointer;vertical-align:1px;white-space:nowrap;color:var(--mut);background:color-mix(in srgb,var(--mut) 13%,transparent)}
.rt-onc.o-yuksek{color:var(--blue);background:color-mix(in srgb,var(--blue) 14%,transparent)}
.rt-onc.o-dusuk{color:var(--mut);background:transparent;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--mut) 35%,transparent)}
.rt-onc:focus-visible{outline:2px solid var(--blue);outline-offset:1px}
/* Askıdaki rutin: "askıda — gerekçe" satırında tek dokunuşla Yeniden aç */
.kr .kr-ac{margin-left:6px;padding:3px 10px;font-size:11.5px;vertical-align:1px}

/* ============ 46 · BECERILER (v0.70) ============ */
/* Çubuk grafikte (bosIsaret) kayıtsız gün/hafta aralığın her yerinde aynı "–"; bugün / bu hafta sütunu ve etiketi vurgulu */
.m-cubuk.bos-isaret .gc-s.vurgu{background:color-mix(in srgb,var(--acc) 9%,transparent);border-radius:6px 6px 0 0}
.m-cubuk.bos-isaret .gc-s.vurgu.yok em{color:var(--acc);font-weight:700}
.m-cubuk.bos-isaret .gc-et span.vurgu{color:var(--ink);font-weight:600}
/* "Claude'a anlat": alanlar doluysa daraltılmış özet (Düzenle ile açılır); diğer sekmelerde tek satır bağlantı */
.ctx-ozet dl{margin:0;display:grid;gap:10px}
.ctx-ozet dt{font-size:12px;color:var(--mut);margin:0 0 2px}
.ctx-ozet dd{margin:0;font-size:14px;color:var(--ink);line-height:1.45;white-space:pre-line;overflow-wrap:anywhere;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.ctx-ozet dd.bos{color:var(--fnt)}
.ctx-ozet .acts{margin-top:12px}
@media (min-width:1024px){
  .mdz-yan .ctxk.ctx-ozet{display:block}
  .mdz-yan .ctx-ozet dl{grid-template-columns:repeat(3,minmax(0,1fr));gap:0 18px}
}
.ctx-satir{display:inline-flex;align-items:center;min-height:40px;padding:0 2px;font-size:13.5px;font-weight:500;color:var(--mut);text-decoration:none}
@media (hover:hover){.ctx-satir:hover{color:var(--ink);text-decoration:underline;text-underline-offset:3px}}

/* ============ 47 · JARVIS V2 (v0.74) ============ */
/* Rutin satırındaki "toplu" çipi: toplu = gün içinde sorulmaz, akşam listesinde sorulur; anlık = vaktinde tek tek */
.rt-onc.o-toplu{color:var(--acch);background:color-mix(in srgb,var(--acc) 13%,transparent)}
.rt-onc.o-anlik{color:var(--mut);background:transparent;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--mut) 35%,transparent)}
/* Günün ana işi: cetvel satırındaki yıldız ve vurgulu blok */
.ana-y{flex:none;width:32px;height:32px;border:0;border-radius:10px;background:transparent;color:var(--fnt);font-size:17px;line-height:1;
  cursor:pointer;display:grid;place-items:center;transition:color .2s,background .2s}
@media (hover:hover){.ana-y:hover{background:color-mix(in srgb,var(--acc) 10%,transparent);color:var(--acch)}}
.ana-y.on{color:var(--acch)}
.ana-y:focus-visible{outline:2px solid var(--blue);outline-offset:1px}
.tl-k.ana{border-color:color-mix(in srgb,var(--acc) 45%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--acc) 22%,transparent)}
.tl-k.ana::before{background:var(--acc);opacity:1}
.card.ana-is{display:flex;align-items:flex-start;gap:13px;padding:15px var(--a4)}
.card.ana-is > div{min-width:0;flex:1}
.card.ana-is small{display:block;font-size:10px;font-weight:700;letter-spacing:.1em;color:var(--acch);margin-bottom:3px}
.card.ana-is b{display:block;font-size:15px;font-weight:600;color:var(--ink);line-height:1.3;overflow-wrap:anywhere}
.card.ana-is span:not(.e){display:block;font-size:12px;color:var(--mut);margin-top:3px;line-height:1.45}
.card.ana-is .dug2{display:flex;gap:7px;margin-top:11px;flex-wrap:wrap}
.card.ana-is.bos b{font-size:14px;color:var(--mut)}
/* Haftalık kart: etiket · değer · not, satır satır */
.hfk{padding:6px 0}
.hfk-s{display:grid;grid-template-columns:24px minmax(0,1fr) auto;gap:4px 10px;align-items:baseline;padding:10px var(--a4)}
.hfk-s + .hfk-s{border-top:1px solid var(--line)}
.hfk-s b{font-size:13.5px;font-weight:600;color:var(--ink)}
.hfk-s > span:not(.e){font-size:13.5px;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.hfk-s small{grid-column:2 / -1;font-size:11.5px;color:var(--mut);line-height:1.4;overflow-wrap:anywhere}

/* ============ 48 · AYARLAR 2.0 (ay-) — genel bakış + kategorili alt sayfalar (v0.87) ============
   Bütün sınıflar "ay-" önekli (index.html'deki ebeveynsiz .on .rs .rg .bos .tek ile çakışmasın).
   Renkler yalnız token + color-mix: koyu tema için ayrı kural yok. Masaüstü (≥1024) solda yapışkan menü. */
.ay-yer{min-width:0}
.ay-icerik{min-width:0}
.ay-icerik > .sec:first-child,.ay-icerik > .ay-kabuk:first-child > .sec:first-child{padding-top:0}
.ay-icerik .card + .card{margin-top:var(--a3)}
/* Sarmalanan yardımcının ilk başlığı sayfa başlığıyla çift olmasın: görsel gizli, erişilebilirlik ağacında kalır */
.ay-kabuk > .sec:first-child > .sh{justify-content:flex-start;position:relative}
.ay-kabuk > .sec:first-child > .sh > h2{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;margin:0}
.ay-kabuk > .sec:first-child > .sh > .m{margin-left:0}
.ay-kabuk > .sec:first-child > .sh > .m + .lnk,.ay-kabuk > .sec:first-child > .sh > .m + button{margin-left:auto}
/* başlık: kategori karosu */
.ay-ik{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;flex:none;
  background:color-mix(in srgb,var(--c,var(--mut)) 14%,transparent)}
.ay-ik .e{font-size:18px}
.ay-ik.b{width:46px;height:46px;border-radius:14px}
.ay-ik.b .e{font-size:23px}
/* yan menü (yalnız masaüstü) */
.ay-menu{display:none}
.ay-pf{display:flex;align-items:center;gap:10px;padding:8px 10px 12px;margin-bottom:4px;border-bottom:1px solid var(--line);text-decoration:none;color:inherit}
.ay-pf .pf-av{width:36px;height:36px;border-radius:12px;font-size:15px;box-shadow:none}
.ay-pf-t{min-width:0;flex:1}
.ay-pf-t b{display:block;font-size:13.5px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ay-pf-t small{display:block;font-size:11px;color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ay-pf .git2{color:var(--fnt);font-size:15px}
.ay-grp{padding:12px 10px 4px;font-size:10.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--fnt)}
.ay-yl{position:relative;display:flex;align-items:center;gap:9px;height:36px;padding:0 10px;border-radius:10px;font-size:13.5px;font-weight:500;
  color:var(--txt);text-decoration:none;transition:background-color .18s,color .18s}
.ay-yl .e{font-size:16px;width:20px;text-align:center;flex:none}
.ay-yl .ay-ad{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ay-yl .say2{margin-left:auto}
@media (hover:hover){.ay-yl:hover{background:var(--bg2);color:var(--ink)}}
.ay-yl.ay-on{background:color-mix(in srgb,var(--c,var(--ink)) 12%,transparent);color:var(--ink);font-weight:700}
.ay-yl.ay-on::before{content:"";position:absolute;left:0;top:9px;bottom:9px;width:3px;border-radius:3px;background:var(--c,var(--ink))}
.ay-yl:focus-visible{outline:2px solid var(--blue);outline-offset:-2px}
.ay-yan-alt{display:flex;align-items:center;gap:8px;margin-top:8px;padding:10px 10px 4px;border-top:1px solid var(--line);font-size:11.5px;color:var(--fnt);min-width:0}
.ay-yan-alt .gdot{margin-top:0}
.ay-yan-alt span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (min-width:1024px){
  .ay-yer{display:grid;grid-template-columns:236px minmax(0,1fr);gap:0 28px;align-items:start}
  .ay-icerik{max-width:780px}
  .ay-menu{display:block;position:sticky;top:12px;align-self:start;max-height:calc(100vh - 24px);overflow-y:auto;overflow-x:hidden;padding:8px;scrollbar-width:thin}
  .ay-pf-sec{display:none}
  .ay-icerik > .ay-pf-sec + .sec:not(.inp){padding-top:0}
  .pg-hd .ay-geri{display:none}
}
/* genel bakış: durum karoları */
.ay-durum{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
@media (min-width:720px){.ay-durum{grid-template-columns:repeat(4,minmax(0,1fr))}}
.ay-karo{display:block;background:var(--sf);border-radius:var(--rs);box-shadow:var(--sh);padding:13px 14px 12px 16px;text-decoration:none;min-width:0;
  position:relative;overflow:hidden;color:inherit;transition:transform .25s,box-shadow .25s}
.ay-karo::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--line2)}
.ay-karo.ok::before{background:var(--ok)}.ay-karo.amb::before{background:var(--amb)}.ay-karo.miss::before{background:var(--miss)}
.ay-karo b{display:block;font-size:22px;font-weight:700;letter-spacing:-.03em;color:var(--ink);line-height:1.1;font-variant-numeric:tabular-nums}
.ay-karo.ok b{color:var(--ok)}.ay-karo.amb b{color:var(--amb)}.ay-karo.miss b{color:var(--miss)}
.ay-karo b small{font-size:13px;font-weight:500;color:var(--mut);letter-spacing:0}
.ay-karo span{display:block;font-size:11.5px;color:var(--mut);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ay-karo:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
@media (hover:hover) and (pointer:fine){.ay-karo:hover{transform:translateY(-3px);box-shadow:var(--hov)}}
/* hızlı eylemler: telefonda yatay kayar, masaüstünde sarar */
.ay-hizli{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:12px -20px 0;padding:2px 20px 4px}
.ay-hizli::-webkit-scrollbar{display:none}
.ay-hizli .btn{flex:none}
.ay-hizli .btn .ic{width:15px;height:15px}
.ay-hizli .btn .e{font-size:14px}
@media (min-width:1024px){.ay-hizli{margin-left:0;margin-right:0;padding-left:0;padding-right:0;flex-wrap:wrap}}
/* ayar arama */
.ay-ara{position:relative}
.ay-ara .inp{padding-left:40px;padding-right:40px;height:46px;border-radius:13px;-webkit-appearance:none;appearance:none}
.ay-ara .inp::-webkit-search-cancel-button,.ay-ara .inp::-webkit-search-decoration{-webkit-appearance:none;display:none}
.ay-ara-ic{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--fnt);pointer-events:none;display:grid}
.ay-ara-ic .ic{width:17px;height:17px}
.ay-ara-sil{position:absolute;right:9px;top:50%;transform:translateY(-50%);width:28px;height:28px;border-radius:8px;border:0;
  background:var(--bg2);color:var(--mut);display:grid;place-items:center;cursor:pointer}
@media (hover:hover){.ay-ara-sil:hover{background:var(--line2);color:var(--ink)}}
.ay-ara-sil .ic{width:14px;height:14px}
.ay-ara-bos{margin:10px 4px 0}
.ay-ariyor .ay-durum-sec,.ay-ariyor .ay-pf-sec,.ay-ariyor .ay-dikkat-sec,.ay-ariyor .ay-son,.ay-ariyor .ay-alt,.ay-ariyor .ay-gez{display:none}
.ay-ariyor .ay-ara-sec{padding-top:0}
/* dikkat listesi */
.ay-dk{display:grid;grid-template-columns:10px minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:11px 16px}
.ay-dk + .ay-dk,.ay-tamam + .ay-dk{border-top:1px solid var(--line)}
.ay-dk i{width:9px;height:9px;border-radius:50%;background:var(--amb);justify-self:center}
.ay-dk.miss i{background:var(--miss)}
.ay-dk.bilgi i{background:var(--c-claude)}
.ay-dk a{min-width:0;text-decoration:none;color:inherit}
.ay-dk a b{display:block;font-size:14px;font-weight:600;color:var(--ink);line-height:1.3}
.ay-dk a span{display:block;font-size:12.5px;color:var(--mut);line-height:1.4;margin-top:1px;overflow-wrap:anywhere}
.ay-dk .lnk{font-size:12px;white-space:nowrap}
.ay-dk .git2{color:var(--fnt);font-size:15px;grid-column:-2}
.ay-tamam{display:flex;align-items:center;gap:12px;padding:14px 16px}
.ay-tamam > .ic{width:22px;height:22px;color:var(--ok);stroke-width:2.2;flex:none}
.ay-tamam > i{width:10px;height:10px;border-radius:50%;background:var(--amb);flex:none;margin:0 6px}
.ay-tamam b{display:block;font-size:14px;font-weight:600;color:var(--ink)}
.ay-tamam span{display:block;font-size:12.5px;color:var(--mut);line-height:1.4}
@keyframes ay-nabiz{50%{opacity:.25}}
/* kategori listesi (telefon) ve karo ızgarası (masaüstü) */
.ay-sat{display:grid;grid-template-columns:36px minmax(0,1fr) auto;gap:12px;align-items:center;min-height:58px;padding:10px 16px;
  text-decoration:none;color:inherit;transition:background-color .2s}
.ay-sat + .ay-sat{border-top:1px solid var(--line)}
.ay-sat > div{min-width:0}
.ay-sat b{display:block;font-size:14.5px;font-weight:600;color:var(--ink)}
.ay-sat > div > span{display:block;font-size:12.5px;color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}
.ay-sag{display:flex;align-items:center;gap:8px}
.ay-sat .git2{color:var(--fnt);font-size:16px}
.ay-sat:focus-visible{outline:2px solid var(--blue);outline-offset:-2px}
@media (hover:hover) and (pointer:fine){.ay-sat:hover{background:var(--sf2)}}
.ay-kat-sec,.ay-son{display:none}
.ay-kat-ag > .ak:last-child:nth-child(odd){grid-column:auto}
.ay-kat-ag .ak{min-height:122px}
@media (min-width:1024px){.ay-liste-sec{display:none}.ay-kat-sec,.ay-son{display:block}}
.ay-rz-miss{--c:var(--miss)}
.ay-rz-amb{--c:var(--amb)}
/* önceki / sonraki */
.ay-gez{display:flex;justify-content:space-between;gap:12px;padding:22px 20px 0}
.ay-gez a{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:600;color:var(--mut);text-decoration:none;min-width:0}
.ay-gez a span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (hover:hover){.ay-gez a:hover{color:var(--ink)}}
.ay-gez a .ic{width:16px;height:16px;flex:none}
.ay-gez a:first-child .ic{transform:scaleX(-1)}
.ay-gez .ay-sonra{margin-left:auto}
.ay-alt{margin:18px 20px 0}
@media (min-width:1024px){.ay-gez{padding-left:0;padding-right:0}.ay-alt{margin-left:0;margin-right:0}}
/* uyarı şeritleri, tehlikeli bölge, sayaç karoları */
.ay-not{display:block;margin:10px 0 0;padding:10px 13px;border-radius:var(--rk);font-size:12.5px;line-height:1.5;color:var(--txt);
  background:color-mix(in srgb,var(--amb) 10%,var(--sf));box-shadow:inset 3px 0 0 var(--amb)}
.ay-not b{font-weight:600;color:var(--ink)}
.ay-not.kirmizi{background:color-mix(in srgb,var(--miss) 9%,var(--sf));box-shadow:inset 3px 0 0 var(--miss)}
.ay-not.bilgi{background:color-mix(in srgb,var(--c-claude) 10%,var(--sf));box-shadow:inset 3px 0 0 var(--c-claude)}
.card.ay-uyari{box-shadow:var(--sh),inset 0 0 0 1px color-mix(in srgb,var(--amb) 50%,transparent)}
.tg.ay-amb{box-shadow:inset 3px 0 0 var(--amb)}
.ay-tehlike{margin-top:12px;padding:10px;border-radius:14px;background:color-mix(in srgb,var(--miss) 6%,transparent);
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--miss) 35%,transparent)}
.ay-teh-bas{font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--miss);padding:2px 6px 0}
.ay-tehlike > .bos{margin:8px 6px 0}
.ay-tehlike > .card{margin-top:8px}
@media (max-width:420px){.ay-tehlike .iki{grid-template-columns:1fr}}
.ay-sayac{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ay-sayac > div{background:var(--sf);border-radius:var(--rs);box-shadow:var(--sh);padding:12px 14px;min-width:0}
.ay-sayac span{display:block;font-size:11.5px;color:var(--mut)}
.ay-sayac b{display:block;font-size:19px;font-weight:700;letter-spacing:-.02em;color:var(--ink);margin-top:2px;font-variant-numeric:tabular-nums}
.ay-sayac b small{font-size:12px;color:var(--mut);font-weight:500;letter-spacing:0}
.ay-sayac .kur-c{height:5px;margin:9px 0 0}
.ay-sayac .kur-c i{background:var(--c-claude)}
.ay-sayac .amb .kur-c i{background:var(--amb)}
.ay-sayac .amb b{color:var(--amb)}
/* sistem: tanılama ve lisans kartları, gruplu durum listesi */
.ay-tani,.ay-lisans{padding:14px 16px}
.ay-tani .acts{margin-top:0}
.ay-tani .m-not{margin:10px 0 0}
.ay-lisans .m-not{margin:0}
.ay-icerik .pulse > .pr-grp:first-child{border-top:0;padding-top:10px}
.trail > .pr-grp{padding-left:0;padding-right:0}
.trail > .pr-grp:first-child{border-top:0}
.tr.ay-red time{color:var(--miss);font-weight:600}
/* hesap: parola formu katlı */
.ay-icerik .card > .more{width:100%;background:none;border:0;border-top:1px solid var(--line);font-family:inherit;cursor:pointer}
.ay-icerik .card > .more[aria-expanded="true"] .ic{transform:rotate(-90deg)}
.ay-icerik .card > .more .ic{transform:rotate(90deg);transition:transform .25s}
/* Görünüm → Hareketi azalt: cihaz ayarından bağımsız, aynı etkiyi verir */
:root.hareket-az *,:root.hareket-az *::before,:root.hareket-az *::after{transition-duration:0s!important;animation-duration:0s!important;scroll-behavior:auto!important}

/* ============ 49 · BİLDİRİM AYARLARI (bl-) — kategori, kanal, ne zaman, sıklık (v0.89) ============
   Kategori satırı: solda ad ve açıklama, sağda iki kanal çipi (dar ekranda alta iner, çipler eşit genişlikte).
   Renkler yalnız token: koyu tema ayrı kural istemez. */
.bl-kat,.bl-sik{padding:2px 0}
.bl-r,.bl-s{padding:13px 16px}
.bl-r + .bl-r,.bl-s + .bl-s{border-top:1px solid var(--line)}
.bl-ust{display:flex;align-items:center;gap:10px 14px;flex-wrap:wrap}
.bl-t{flex:1 1 200px;min-width:0}
.bl-t b{display:flex;align-items:center;flex-wrap:wrap;gap:6px;font-size:14px;font-weight:600;color:var(--ink)}
.bl-t small{display:block;font-size:11.5px;color:var(--mut);line-height:1.45;margin-top:2px}
.bl-k,.bl-cip{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.bl-k .chip,.bl-cip .chip{padding:0 11px;font-variant-numeric:tabular-nums}
.bl-k .chip .e{font-size:13px}
.bl-k .chip:disabled{opacity:.55;cursor:default}
.bl-alt{display:flex;align-items:center;gap:8px 10px;flex-wrap:wrap;margin-top:10px}
.bl-et{font-size:11px;font-weight:600;color:var(--fnt);min-width:56px}
.bl-seg{background:var(--bg2);box-shadow:none}
.bl-seg button{padding:0 12px;font-size:12px}
.bl-not{font-size:11.5px;color:var(--mut)}
.bl-not a{color:inherit;text-underline-offset:2px}
.bl-kapali .bl-t b{color:var(--mut)}
.bl-s .bl-cip{margin-top:9px}
.bl-s .bl-cip + .bl-cip{margin-top:6px}
@media (max-width:480px){
  .bl-k{width:100%}
  .bl-k .chip{flex:1}
  .bl-s .bl-et{flex-basis:100%}   /* "Başlar / Biter" kendi satırında: taşan çip etiketin altına kaymasın */
}

/* ============ 50 · DURUM DEĞERLENDİRMESİ (dr-) — #/durum (v0.90) ============
   Sırası: sorular (iş isteyen) → genel durum → yön → çıkarımlar → alan kartları. Yargı rengi soldaki şeritte
   (iyi --ok, dikkat --amb, kötü --miss); renkler yalnız token, koyu tema ayrı kural istemez. */
.dr-arac{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:2px 0 4px}
.dr-ton{background:var(--bg2);box-shadow:none}
.dr-ton button{padding:0 12px;font-size:12px}
.dr-arac .btn .e{margin-right:5px}
.dr-sorular{display:grid;gap:var(--a3)}
.dr-soru{padding:14px 16px}
.dr-soru.dr-sert{box-shadow:var(--sh),inset 3px 0 0 var(--miss)}
.dr-ust{display:flex;align-items:center;gap:7px;font-size:11.5px;color:var(--mut)}
.dr-alan{font-weight:700;color:var(--ink)}
.dr-kim{margin-left:auto;display:inline-flex;align-items:center;gap:4px;font-size:11px;color:var(--fnt)}
.dr-kim .e{font-size:12px}
.dr-metin{margin:8px 0 0;font-size:15px;font-weight:600;line-height:1.45;color:var(--ink)}
.dr-kanit{margin:5px 0 0;font-size:12px;color:var(--mut);line-height:1.45;overflow-wrap:anywhere}
.dr-cip{display:flex;flex-wrap:wrap;gap:6px;margin-top:11px}
.dr-acikla{display:flex;gap:8px;align-items:flex-end;margin-top:10px}
.dr-acikla .inp{flex:1;min-width:0;min-height:38px;resize:none}
.dr-gecmis{margin-top:10px}
.dr-gecmis summary{cursor:pointer;font-size:12.5px;color:var(--mut);padding:6px 2px}
.dr-gecmis .card{margin-top:6px}
.dr-cevap{display:flex;gap:10px;align-items:flex-start;padding:11px 16px}
.dr-cevap + .dr-cevap{border-top:1px solid var(--line)}
.dr-cevap > div{flex:1;min-width:0}
.dr-cevap p{margin:0;font-size:13px;color:var(--txt);line-height:1.4}
.dr-cevap small{display:block;margin-top:3px;font-size:12px;color:var(--mut);overflow-wrap:anywhere}
.dr-genel{padding:14px 16px}
.dr-cl .dr-kim{margin-left:0}
.dr-cl p{margin:6px 0 0;font-size:14px;line-height:1.55;color:var(--ink)}
.dr-sis{margin:0;font-size:13px;color:var(--txt);line-height:1.5}
.dr-cl + .dr-sis{margin-top:10px;padding-top:10px;border-top:1px solid var(--line)}
.dr-yon{margin:0;padding:12px 16px 12px 34px;display:grid;gap:6px;font-size:14px;line-height:1.45;color:var(--ink)}
.dr-cik{display:flex;gap:10px;align-items:flex-start;padding:12px 16px}
.dr-cik + .dr-cik{border-top:1px solid var(--line)}
.dr-cik > div{flex:1;min-width:0}
.dr-cik p{margin:0;font-size:13.5px;line-height:1.45;color:var(--ink)}
.dr-cik small{display:block;margin-top:3px;font-size:11.5px;color:var(--mut);overflow-wrap:anywhere}
.dr-cik .dr-kim{margin-left:0;flex:none}
.dr-cik.dr-kotu{box-shadow:inset 3px 0 0 var(--miss)}
.dr-cik.dr-dikkat{box-shadow:inset 3px 0 0 var(--amb)}
.dr-cik.dr-iyi{box-shadow:inset 3px 0 0 var(--ok)}
.dr-alanlar{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:var(--a3)}
.dr-ak{background:var(--sf);border-radius:var(--rs);box-shadow:var(--sh);padding:12px 14px 12px 16px;position:relative;overflow:hidden;min-width:0}
.dr-ak::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--line2)}
.dr-ak.dr-iyi::before{background:var(--ok)}
.dr-ak.dr-dikkat::before{background:var(--amb)}
.dr-ak.dr-kotu::before{background:var(--miss)}
.dr-ak-ust{display:flex;align-items:center;gap:7px}
.dr-ak-ust b{font-size:13.5px;color:var(--ink)}
.dr-ak-ust .m-rozet{margin-left:auto}
.dr-ak p{margin:6px 0 0;font-size:13px;line-height:1.4;color:var(--txt)}
.dr-ak small{display:block;margin-top:4px;font-size:11.5px;line-height:1.4;color:var(--mut);overflow-wrap:anywhere}
.dr-ak .dr-hedef{color:var(--fnt);font-style:italic}
.dr-bugun{display:flex;align-items:center;gap:12px;padding:13px 16px;text-decoration:none;color:inherit}
.dr-bugun > div{flex:1;min-width:0}
.dr-bugun b{display:block;font-size:14px;color:var(--ink)}
.dr-bugun > div > span{display:block;margin-top:2px;font-size:12.5px;line-height:1.4;color:var(--mut)}
.dr-bugun > .ic{width:16px;height:16px;color:var(--fnt);flex:none}
@media (max-width:480px){
  .dr-acikla{flex-direction:column;align-items:stretch}
  .dr-alanlar{grid-template-columns:1fr}
}

/* ============ 51 · PEŞİMDE KOÇ (dr-, v0.91) — kapı bandı, koç ayarı, saat sözü, anlaşma, hayat alanları ============
   Kapı bandı sayfanın en üstünde: kilitliyken kırmızı şerit, acil geçişte sarı. Renkler yalnız token (koyu tema kendiliğinden). */
.dr-kapi{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:4px 0 10px;padding:12px 16px;border-radius:var(--rs);
  background:color-mix(in srgb,var(--miss) 9%,var(--sf));box-shadow:var(--shs),inset 3px 0 0 var(--miss)}
.dr-kapi > div{flex:1;min-width:200px}
.dr-kapi b{display:block;font-size:14.5px;color:var(--ink)}
.dr-kapi span{display:block;margin-top:2px;font-size:12.5px;line-height:1.4;color:var(--txt)}
.dr-kapi small{font-size:12px;color:var(--mut)}
.dr-kapi.acil{background:color-mix(in srgb,var(--amb) 10%,var(--sf));box-shadow:var(--shs),inset 3px 0 0 var(--amb)}
.dr-israr{font-size:12px;color:var(--mut)}
.dr-ayar-sec{margin-top:6px}
.dr-ayar{padding:0}
.dr-ayar summary{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:11px 16px;cursor:pointer;list-style:none}
.dr-ayar summary::-webkit-details-marker{display:none}
.dr-ayar summary::after{content:"▾";margin-left:auto;color:var(--fnt);font-size:12px;transition:transform .15s}
.dr-ayar[open] summary::after{transform:rotate(180deg)}
.dr-ayar summary b{font-size:13.5px;color:var(--ink)}
.dr-ayar summary span{font-size:12px;color:var(--mut);min-width:0;overflow-wrap:anywhere}
.dr-ay-ic{padding:2px 16px 12px;display:grid;gap:9px;border-top:1px solid var(--line)}
.dr-ay{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding-top:9px}
.dr-ay-ad{width:52px;flex:none;font-size:12px;font-weight:600;color:var(--mut)}
.dr-ay .seg{flex-wrap:wrap}
.dr-ay-ic .m-not{margin:2px 0 0}
.dr-saat{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:11px 16px}
.dr-saat + .dr-saat{border-top:1px solid var(--line)}
.dr-saat p{flex:1;min-width:140px;margin:0;font-size:13.5px;color:var(--ink);line-height:1.4}
.dr-saat small{font-size:12px;color:var(--mut)}
.dr-saat .dr-cip{margin-top:0}
.dr-saat-s{font-weight:700;font-size:13px;color:var(--ink);flex:none}
.dr-saat.simdi{box-shadow:inset 3px 0 0 var(--acc)}
.dr-anlasmalar{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:var(--a3)}
.dr-anl{background:var(--sf);border-radius:var(--rs);box-shadow:var(--sh);padding:12px 14px;min-width:0}
.dr-anl-ust{display:flex;align-items:center;gap:8px}
.dr-anl-ust b{font-size:13.5px;color:var(--ink);min-width:0;overflow-wrap:anywhere}
.dr-anl-ust .m-rozet{margin-left:auto;flex:none}
.dr-anl p{margin:8px 0 0;font-size:13px;color:var(--txt);line-height:1.4;overflow-wrap:anywhere}
.dr-anl small{display:block;margin-top:4px;font-size:11.5px;color:var(--mut);line-height:1.4;overflow-wrap:anywhere}
.dr-bar{height:7px;margin-top:9px;border-radius:99px;background:var(--bg2);overflow:hidden}
.dr-bar i{display:block;height:100%;border-radius:inherit;background:var(--acc);transition:width .3s}
.dr-anl.dr-kazanildi .dr-bar i{background:var(--ok)}
.dr-anl.dr-kaybedildi .dr-bar i,.dr-anl.dr-iptal .dr-bar i,.dr-anl.dr-reddedildi .dr-bar i{background:var(--line2)}
.dr-hayat{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px}
.dr-hy{display:flex;align-items:center;gap:9px;background:var(--sf);border-radius:var(--rk);box-shadow:var(--shs);padding:10px 12px 10px 14px;position:relative;overflow:hidden;min-width:0}
.dr-hy::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--line2)}
.dr-hy.dr-iyi::before{background:var(--ok)}
.dr-hy.dr-dikkat::before{background:var(--amb)}
.dr-hy.dr-kotu::before{background:var(--miss)}
.dr-hy > div{min-width:0}
.dr-hy b{display:block;font-size:13px;color:var(--ink)}
.dr-hy small{display:block;font-size:11.5px;color:var(--mut);line-height:1.35}
.dr-genel.dr-patlama{box-shadow:var(--sh),inset 3px 0 0 var(--miss)}
.dr-genel.dr-patlama .dr-cl p{font-weight:600}
@media (max-width:480px){
  .dr-anlasmalar,.dr-hayat{grid-template-columns:1fr}
  .dr-ay-ad{width:100%}
  .dr-kapi .btn{width:100%}
}

/* ============ 52 · AKILLI KAPI VE SOHBET (dr-, v0.92) ============
   Kapı kilitliyken kapalı sayfalar solgun; kapı bandında açık sayfalara geçiş çipleri; soruda "işin sayfası" bağlantısı. */
.kapi-kilitli{opacity:.42}
@media (hover:hover){.kapi-kilitli:hover{opacity:.62}}
.dr-kapi .dr-cip{margin-top:8px}
.dr-kapi .chip{text-decoration:none}
.dr-git{display:inline-block;margin-top:10px;padding:8px 0;font-size:12.5px;font-weight:600;color:var(--acc-t);text-decoration:none}
@media (hover:hover){.dr-git:hover{text-decoration:underline}}
a.dr-hy{text-decoration:none;color:inherit}
@media (hover:hover){a.dr-hy:hover{box-shadow:var(--hov)}}
.dr-ipucu{display:flex;gap:10px;align-items:flex-start;padding:12px 16px}
.dr-ipucu p{margin:0;font-size:13px;line-height:1.5;color:var(--txt)}
.dr-ipucu b{color:var(--ink)}
/* Kapı bandı ve araç satırı bölüm kabuğunda: telefonda öteki kartlarla aynı 20 px kenar */
.sec.dr-bas,.icerik .sec.dr-bas:not(.inp){padding-top:8px}

/* ============ 53 · FOTOĞRAF KUTUSU VE HAFTALIK KARNE (gl-foto, kr-, v0.93) ============
   Claude sayfasında 📎 ve fotoğraflı mesajın küçük resmi; #/karne: genel not, alan notları, yüzleşme, seriler, mektup. */
.yaz2 .ek{width:42px;height:42px;flex:none;border-radius:14px;border:1px solid var(--line);background:var(--sf);font-size:18px;
  display:grid;place-items:center;cursor:pointer;transition:transform .15s}
@media (hover:hover){.yaz2 .ek:hover{transform:translateY(-2px)}}
.gl-foto{display:block;max-width:240px;padding:0;border:0;border-radius:var(--rk);overflow:hidden;background:var(--bg2);cursor:zoom-in;text-align:left}
.gl-foto img{display:block;width:100%;min-height:90px;max-height:280px;object-fit:cover;background:var(--bg2)}
.gl-foto span{display:block;padding:4px 8px;font-size:11px;color:var(--mut)}
span.gl-foto.yok{cursor:default;padding:10px 12px;font-size:12px;color:var(--mut)}
.gl-foto + .mt{margin-top:6px}
.foto-perde{position:fixed;inset:0;z-index:1000;background:rgba(8,6,20,.88);display:grid;place-items:center;align-content:center;gap:10px;cursor:zoom-out;padding:16px}
.foto-perde img{max-width:min(94vw,1200px);max-height:84vh;border-radius:12px;box-shadow:0 10px 40px rgba(0,0,0,.5)}
.foto-perde span{color:#fff;font-size:12px;opacity:.75}
.kr-ust{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding-top:8px}
.kr-genel{display:flex;align-items:center;gap:16px;padding:16px var(--a4)}
.kr-harf{flex:none;width:68px;height:68px;border-radius:50%;display:grid;place-items:center;font-size:34px;font-weight:700;
  color:#fff;background:var(--line2)}
.kr-harf.sm{width:42px;height:42px;font-size:20px}
.kr-A .kr-harf,.kr-B .kr-harf,.kr-davet.kr-A .kr-harf,.kr-davet.kr-B .kr-harf{background:var(--ok)}
.kr-C .kr-harf,.kr-davet.kr-C .kr-harf{background:var(--amb)}
.kr-D .kr-harf,.kr-F .kr-harf,.kr-davet.kr-D .kr-harf,.kr-davet.kr-F .kr-harf{background:var(--miss)}
.kr-g{min-width:0}
.kr-g b{display:block;font-size:17px;color:var(--ink)}
.kr-g p{margin:3px 0 0;font-size:13.5px;line-height:1.45;color:var(--txt)}
.kr-g small{display:block;margin-top:4px;font-size:12px;color:var(--mut)}
.kr-alanlar{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:8px}
.kr-ak{background:var(--sf);border-radius:var(--rs);box-shadow:var(--shs);padding:11px 13px;min-width:0}
.kr-ak-ust{display:flex;align-items:center;gap:7px}
.kr-ak-ust b{font-size:13px;color:var(--ink)}
.kr-ak-ust .kr-not{margin-left:auto;font-weight:700;min-width:26px;text-align:center}
.kr-ak small{display:block;margin-top:6px;font-size:11.5px;line-height:1.35;color:var(--mut);overflow-wrap:anywhere}
.kr-ak .dr-bar{margin-top:8px}
.kr-A .dr-bar i,.kr-B .dr-bar i{background:var(--ok)}
.kr-C .dr-bar i{background:var(--amb)}
.kr-D .dr-bar i,.kr-F .dr-bar i{background:var(--miss)}
.kr-yuz{padding:12px 16px}
.kr-soz{display:flex;flex-direction:column;gap:7px;margin-bottom:8px}
.kr-sz{display:flex;align-items:flex-start;gap:10px;min-width:0}
.kr-sz p{margin:0;font-size:13px;color:var(--ink);overflow-wrap:anywhere}
.kr-sz small{font-size:11.5px;color:var(--mut)}
.kr-i{flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-size:13px;font-weight:700;background:var(--bg2);color:var(--mut)}
.kr-sz.ok .kr-i{background:color-mix(in srgb,var(--ok) 18%,transparent);color:var(--ok)}
.kr-sz.kirmizi .kr-i{background:color-mix(in srgb,var(--miss) 18%,transparent);color:var(--miss)}
.kr-sz.uyari .kr-i{background:color-mix(in srgb,var(--amb) 20%,transparent);color:var(--amb)}
.kr-satir{margin:6px 0 0;font-size:12.5px;line-height:1.5;color:var(--txt);overflow-wrap:anywhere}
.kr-seriler{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:8px}
.kr-seri{background:var(--sf);border-radius:var(--rs);box-shadow:var(--shs);padding:12px 14px;display:flex;flex-direction:column;gap:2px;min-width:0}
.kr-seri b{font-size:26px;line-height:1.1;color:var(--ink)}
.kr-seri small{font-size:11px;color:var(--mut);line-height:1.35;overflow-wrap:anywhere}
.kr-koc{padding:12px 16px}
.kr-koc > p:first-child{margin:0;font-size:13.5px;color:var(--txt)}
.kr-mektup{display:flex;gap:12px;align-items:flex-start;padding:14px 16px}
.kr-mektup p{margin:0;font-size:14px;line-height:1.6;color:var(--txt);white-space:pre-line}
.kr-mektup small{display:block;margin-top:8px;font-size:12.5px;color:var(--mut)}
a.kr-davet{display:flex;align-items:center;gap:12px;padding:12px 16px;text-decoration:none;color:inherit;box-shadow:var(--sh),inset 3px 0 0 var(--acc)}
a.kr-davet b{display:block;font-size:14px;color:var(--ink)}
a.kr-davet small{display:block;font-size:12px;color:var(--mut)}
@media (max-width:480px){
  .kr-genel{gap:12px;padding:14px}
  .kr-harf{width:56px;height:56px;font-size:28px}
  .kr-alanlar{grid-template-columns:1fr 1fr}
}

/* ============================================================
   TEMEL KİP (ürünleştirme, 10 Eki 2026) — config urun.kip = 'temel': Claude yok.
   app.js kipi M.kisi'den okur, <html>'e "temel" sınıfını koyar. Şablonlar Claude kartlarını zaten
   çizmiyor; bu kurallar gözden kaçan bağlantı ve düğmeler için ikinci savunma hattı. #/gelen temel kipte "Notlar"
   olarak açık (Telegram ve panel notları), o yüzden bağlantısı gizlenmez.
   ============================================================ */
:root.temel a[href="#/hafiza"],:root.temel [data-claude-sohbet],:root.temel [data-dr-claude],
:root.temel .cl[data-alan="claude"]{display:none!important}

/* ============================================================
   56 · v0.96 KABUK — alt çubuk (SVG), Koç sekmesi (ko-), üst çubuk avatarı, sheet kapatma, odak
   Gezinme ikonları SVG (K19); emoji yalnız alan kimliğinde. Hex yok: hepsi 1 · tokenlar'dan.
   ============================================================ */
/* alt çubuk: Bugün · Plan · ＋ · Koç · Alanlar */
.nav a .ic,.nav button .ic{width:22px;height:22px;stroke-width:1.8}
.nav a > span{font-size:11px;line-height:1.1}
.nav .on .ic{stroke-width:2.2;color:var(--ink)}
.nav .yaz .fab .ic{width:24px;height:24px;stroke-width:2.4}
/* kenar (masaüstü ray + telefon çekmecesi) */
.rs > .ic{width:19px;height:19px;flex:none;color:color-mix(in srgb,var(--c,var(--mut)) 80%,var(--ink))}
.rs.on > .ic{color:var(--c,var(--ink))}
/* kenarda rozet yalnız acil konu ve açık soru: hepsi aynı "dikkat" rengi */
.rs .say2{background:color-mix(in srgb,var(--miss) 15%,transparent);color:var(--miss-t)}
.yazd .yi .ic{width:17px;height:17px;stroke-width:2}
.arad > .ic{width:16px;height:16px;flex:none}
.rbar > .icb .ic{width:18px;height:18px}
/* üst çubuk (telefon): avatar → Ayarlar */
.ust-av{position:relative;width:34px;height:34px;border-radius:50%;flex:none;display:grid;place-items:center;overflow:hidden;
  background:var(--secili);color:var(--secili-ink);font-size:14px;font-weight:700;text-decoration:none}
.ust-av img{width:100%;height:100%;object-fit:cover;display:block}
.ust-av.on{box-shadow:0 0 0 2px var(--c-claude)}
@media (pointer:coarse){.ust-av{overflow:visible}.ust-av img{border-radius:50%}.ust-av::after{content:"";position:absolute;inset:-5px}}
/* Koç: üstte "Claude'la konuş", altında Sorular · Sohbet · Karne · Hafıza */
.ko-ust{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:6px 20px 2px}
.ko-sek{display:flex;gap:2px;padding:3px;border-radius:var(--r-tam);background:var(--sf);box-shadow:var(--g1);overflow-x:auto;scrollbar-width:none;flex:1 1 auto;min-width:0}
.ko-sek::-webkit-scrollbar{display:none}
.ko-sek-a{flex:1 0 auto;display:inline-flex;align-items:center;justify-content:center;gap:6px;height:40px;padding:0 14px;border-radius:var(--r-tam);
  font-size:13.5px;font-weight:600;color:var(--mut);text-decoration:none;white-space:nowrap}
.ko-sek-a.ko-on{background:var(--secili);color:var(--secili-ink)}
.ko-sek-a .say2{margin:0}
.ko-konus{height:42px;gap:8px;flex:none}
.ko-konus .ic{width:17px;height:17px;color:var(--c-claude)}
:root.dark .ko-konus .ic{color:inherit}
@media (max-width:1023px){.ko-ust{flex-direction:column;align-items:stretch}.ko-konus{order:-1;width:100%}}
@media (min-width:1024px){.ko-ust{padding:0 0 4px}.ko-sek{flex:0 1 auto}}
.ko-gelen .chat-kutu{height:calc(100dvh - 420px)}
@media (min-width:1024px){.ko-gelen .chat-kutu{height:calc(100dvh - 304px)}}
/* sheet: 44 px kapat düğmesi (eskiden 50×24 "Vazgeç") */
.sheet-h{align-items:center}
.sheet-h .sheet-x{width:44px;height:44px;margin:-8px -10px -8px 0;padding:0;display:grid;place-items:center;border-radius:var(--r-s);color:var(--mut)}
.sheet-h .sheet-x .ic{width:20px;height:20px}
/* odak halkası kartın kenarında kırpılmasın (B-09): kart overflow:hidden; halka içe çizilir */
:focus-visible{outline-color:var(--odak)}
:is(.card,.pulse,.note,.mood,.trail,.yazkutu,.izg,.m-grafikkart,.ctxk,.tl,.k) :focus-visible{outline-offset:-2px}
/* Durum sorusu: açıklama kutusu katlı, "Gönder" yalnız yazı varken (v0.96) */
.dr-alt{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:6px}
.dr-alt .dr-git{margin-top:0}
.dr-ac{padding:10px 0;font-size:12.5px}
.dr-acikla:has(textarea:placeholder-shown) .dr-gonder{display:none}
/* bekleyen konular tek satır özet (B-20) */
.alan-dikkat-kisa{padding-top:14px}
.ui-ozet{display:flex;align-items:center;gap:10px;width:100%;min-height:44px;margin-top:8px;padding:8px 14px;border:0;border-radius:var(--r-m);
  background:var(--sf);box-shadow:var(--g1s);font:inherit;font-size:13.5px;font-weight:600;color:var(--ink);text-align:left;cursor:pointer}
.alan-dikkat-kisa .ui-ozet{margin-top:0}
.ui-ozet > span{flex:1;min-width:0}
.ui-ozet > .ic{width:16px;height:16px;color:var(--fnt);flex:none}
.ui-ozet[aria-expanded="true"] > .ic{transform:rotate(-90deg)}
.ui-ozet .say2{--c:var(--miss)}
/* sekme şeridinde <button> da <a> gibi görünsün (İmaj "Daha fazla" ve OS.ui.sekmeler'e düğme ekleyen modüller) */
.m-sekme button{font-family:inherit;line-height:1;cursor:pointer;text-align:center}
.m-sekme button .rz{margin-left:6px;min-width:16px;height:16px;font-size:10px;padding:0 4px}
.m-sekme button[aria-current="true"] .rz,.m-sekme button.on .rz{background:var(--bg);color:var(--miss-t)}

/* ============================================================
   57 · OS.ui (ui-) — ortak bileşenlerin tek tanımı (app.js UI). Modüller bunları kullanabilir.
   ============================================================ */
.ui-satir{display:flex;align-items:center;gap:12px;width:100%;min-height:52px;padding:10px 16px;border:0;background:none;font:inherit;color:inherit;text-align:left;text-decoration:none}
.ui-satir + .ui-satir{border-top:1px solid var(--line)}
.ui-satir-m{flex:1;min-width:0}
.ui-satir-m b{display:block;font-size:var(--y-kucuk);font-weight:600;color:var(--ink);line-height:1.3;overflow-wrap:anywhere}
.ui-satir-m small{display:block;margin-top:2px;font-size:var(--y-meta);color:var(--mut);line-height:1.4}
.ui-satir-s{flex:none;font-size:13px;color:var(--mut);font-variant-numeric:tabular-nums;text-align:right}
.ui-satir .ui-git{width:16px;height:16px;flex:none;color:var(--fnt)}
.ui-bos{display:grid;justify-items:center;gap:8px;padding:22px var(--a4);text-align:center}
.ui-bos > .ic{width:26px;height:26px;color:var(--fnt)}
.ui-bos p{margin:0;max-width:44ch;font-size:13.5px;line-height:1.5;color:var(--mut)}
.ui-alan{display:grid;gap:5px}
.ui-alan-et{font-size:var(--y-et);font-weight:600;letter-spacing:.02em;color:var(--mut)}
.ui-alan-ip{font-size:var(--y-et);color:var(--fnt);line-height:1.45}
.ui-alan-hata{font-size:12px;font-weight:600;color:var(--miss-t)}
.ui-alan .inp[aria-invalid="true"]{border-color:var(--miss);box-shadow:0 0 0 3px color-mix(in srgb,var(--miss) 14%,transparent)}
.ui-vitrin{padding:18px}
.ui-vitrin h3{margin-top:10px}
.ui-vitrin .ui-vitrin-alt,.ui-vitrin .acts{margin-left:0}
.ui-vk-l{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:8px;margin-top:14px}
.ui-vk{display:grid;gap:4px;min-width:0;padding:10px 12px;border-radius:var(--r-m);background:var(--sf);text-decoration:none;color:inherit}
.ui-vk-et{font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--mut)}
.ui-vk b{font-size:20px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.ui-vk b small{font-size:12px;font-weight:600;color:var(--mut);margin-left:2px}
.ui-vk-alt{font-size:11px;color:var(--fnt)}
.ui-vitrin-bos{display:flex;align-items:center;gap:12px;padding:12px 16px}
.ui-vitrin-bos > span:not(.e){flex:1;min-width:0}
.ui-vitrin-bos b{display:block;font-size:14px;font-weight:600;color:var(--ink)}
.ui-vitrin-bos small{display:block;font-size:12.5px;color:var(--mut);margin-top:1px}
/* ＋ Yaz sheet'inin ilk iki satırı: Claude'la konuş · Claude'a not */
.ui-yaz-ust{margin:0 0 12px;border-radius:var(--r-m);background:var(--sf2);box-shadow:inset 0 0 0 1px var(--line);overflow:hidden}
.ui-yaz-ust .ui-satir{min-height:50px;cursor:pointer}
.ui-yaz-ust .ui-satir > span{flex:1;min-width:0}
.ui-yaz-ust .ui-satir b{display:block;font-size:14.5px;font-weight:600;color:var(--ink)}
.ui-yaz-ust .ui-satir small{display:block;font-size:12px;color:var(--mut)}
.ui-yaz-ust .ui-claude{width:19px;height:19px;flex:none;color:var(--c-claude)}
.ui-yaz-ust .ui-git{width:15px;height:15px;flex:none;color:var(--fnt)}
.ui-yaz-ust .ui-sec{width:16px;height:16px;flex:none;color:transparent;stroke-width:2.6}
.ui-yaz-ust [aria-pressed="true"]{background:var(--claude-tint)}
.ui-yaz-ust [aria-pressed="true"] .ui-sec{color:var(--claude-t)}
@media (hover:hover){.ui-satir:is(a,button):hover,.ui-ozet:hover{background:var(--sf2)}}

/* ============================================================
   58 · HİZALAMA TURU (24 Eki, 2. tur) — kabuk ve ortak bileşenler
   Kart içi yatay boşluk tek değer (--a4), kartlar arası tek değer (--a3), sayfa kenarı telefonda 20 px,
   masaüstünde içerik kolonunun solu; ikon karoları 22 px. Yalnız token.
   ============================================================ */
/* bölüm başlığı: ikon · başlık · meta · eylem aynı orta çizgide; ikon karoları tek boy */
.sh{align-items:center}
.sh h2 > .e,.bas h2 > .e{width:22px;height:22px;display:inline-grid;place-items:center;flex:none;font-size:16px;line-height:1}
.sh > .m,.sh > a,.sh > button{align-self:center;line-height:1.3}
.pr b > .e{width:22px;height:22px;display:inline-grid;place-items:center;flex:none;font-size:16px;line-height:1}
/* kenar: emoji ve SVG ikon aynı genişlikte, metin tek sütunda başlar */
.rs > .ic,.rs > .e{width:20px;height:20px;flex:none}
.rs > .e{display:inline-grid;place-items:center;font-size:16px}
/* Koç kabuğu: masaüstünde konuş düğmesi kart sağ kenarına yaslı */
@media (min-width:1024px){.ko-konus{margin-left:auto}}
/* sheet: başlık, gövde ve ✕ simgesi aynı iç kenarda */
.sheet-h{margin:0 0 12px}
.sheet-h .sheet-x{margin:-8px -12px -8px 0}
/* Ayarlar: profil satırı ve karttaki ok sağdan 16 px (öteki satırlarla aynı) */
.pf-ust .git2,.ay-pf .git2{margin-right:0}
/* Profil ve Alanlar: içerik kolonu başlıkla aynı solda (ortalanınca başlıktan 47 px içeride kalıyordu) */
.tek.pf-sayfa,.tek.al-sayfa{margin-left:0}
.tek.al-sayfa{max-width:1150px}
.ay-pf-ust{padding:var(--a4)}
/* Alanlar: grup süzgeci tek satır, kartsız; telefonda yana kayar, ızgarayla aynı kenarda */
.al-filtre{display:flex;gap:var(--a2);overflow-x:auto;scrollbar-width:none;margin:0 0 var(--a3);padding:2px 0}
.al-filtre::-webkit-scrollbar{display:none}
.al-filtre .btn{flex:none}
.alan-ag{align-items:stretch}
.alan-ag .ak{height:100%}

/* ---------- yerleşim yardımcıları (ui-): A2 Bugün panosu ve modüller kullanır ----------
   .ui-izgara-12  12 sütunlu ızgara; çocuk telefonda tam genişlik, masaüstünde .ui-k3/.ui-k4/.ui-k6/.ui-k8/.ui-k9 kadar.
                  .ui-m6: telefonda da yarım (iki karo yan yana). Satırdaki öğeler eşit yükseklikte (stretch).
   .ui-karo       küçük kart: etiket (.ui-karo-et) · değer (.ui-karo-d) · açıklama (.ui-karo-a) · dipte .ui-karo-alt.
   .ui-esit       eşit genişlik ve yükseklikte kart satırı (telefonda alt alta); içindeki .card dikey esner, dipteki öğe alta yaslanır. */
.ui-izgara-12{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--a3);align-items:stretch}
.ui-izgara-12 > *{grid-column:span 12;min-width:0}
.ui-izgara-12 > .ui-m6{grid-column:span 6}
@media (min-width:640px){.ui-izgara-12 > .ui-t6{grid-column:span 6}.ui-izgara-12 > .ui-t4{grid-column:span 4}}
@media (min-width:1024px){
  .ui-izgara-12 > .ui-k3{grid-column:span 3}.ui-izgara-12 > .ui-k4{grid-column:span 4}.ui-izgara-12 > .ui-k6{grid-column:span 6}
  .ui-izgara-12 > .ui-k8{grid-column:span 8}.ui-izgara-12 > .ui-k9{grid-column:span 9}.ui-izgara-12 > .ui-k12{grid-column:span 12}
}
.ui-karo{display:flex;flex-direction:column;gap:var(--a1);min-width:0;padding:var(--a3) var(--a4);border-radius:var(--r-m);background:var(--sf);box-shadow:var(--g1s);color:inherit;text-decoration:none}
.ui-karo-et{display:flex;align-items:center;gap:var(--a2);font-size:var(--y-et);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--mut)}
.ui-karo-et > .ic,.ui-karo-et > .e{width:18px;height:18px;flex:none;display:inline-grid;place-items:center;font-size:15px;letter-spacing:0}
.ui-karo-d{font-size:var(--y-bolum);font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums;letter-spacing:-.02em;line-height:1.15}
.ui-karo-d small{font-size:var(--y-meta);font-weight:600;color:var(--mut);margin-left:2px}
.ui-karo-a{font-size:var(--y-meta);color:var(--mut);line-height:1.4}
.ui-karo > .ui-karo-alt{margin-top:auto;padding-top:var(--a2)}
.ui-esit{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:var(--a3);align-items:stretch}
.ui-esit > *{min-width:0}
.ui-esit > .card,.ui-esit > .ui-karo{display:flex;flex-direction:column}
.ui-esit > .card > :last-child:not(:first-child){margin-top:auto}
@media (max-width:639px){.ui-esit{grid-auto-flow:row;grid-auto-columns:auto}}
@media (hover:hover){a.ui-karo:hover{box-shadow:var(--g2)}}

/* ============ 58 · Kişiselleştir (ks-, ürün; kisisel.js) ============
   Yalnız ürün kurulumunda görünür (html.ks-acik). Var olan .tg/.opt/.chip/OS.ui parçalarının üstüne ince düzen. */
.ks-sayfa{display:flex;flex-direction:column;min-width:0}
.ks-sayfa > .ks-bolum:first-child{padding-top:0}
.ks-not{margin:0 4px var(--a3);font-size:var(--y-kucuk);color:var(--mut);line-height:1.5}
.ks-not b{color:var(--ink);font-weight:600}
.ks-et{display:block;font-size:var(--y-meta);font-weight:600;color:var(--mut);margin:0 0 6px}
.ks-sat{display:flex;gap:var(--a2);flex-wrap:wrap;align-items:center}
.ks-sat .btn{min-height:40px}
/* ad */
.ks-ad{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--a4);padding:var(--a4)}
.ks-ad-on{display:flex;align-items:center;gap:11px;padding:var(--a3) var(--a4);border-radius:var(--r-m);background:var(--bg2);min-width:0}
.ks-ad-lg .logo{width:32px;height:32px;display:block}
.ks-ad-on b{display:flex;align-items:center;gap:6px;min-width:0;font-size:var(--y-govde);font-weight:500;letter-spacing:.18em;color:var(--ink);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.ks-ad-on b .os{letter-spacing:.1em;font-size:10.5px;font-weight:700;padding:3px 6px 2px;border-radius:7px;background:var(--ters-sf);color:var(--ters-ink)}
.ks-ad-f{display:flex;flex-direction:column;gap:var(--a3);min-width:0}
.ks-ad-f .m-not{margin:0}
@media (min-width:768px){.ks-ad{grid-template-columns:minmax(0,240px) minmax(0,1fr);align-items:start}}
/* alanlar: .tg satırları; geniş ekranda iki sütun */
.ks-alanlar{display:grid;grid-template-columns:minmax(0,1fr)}
.ks-alanlar .tg{min-height:60px}
.ks-alanlar .tg + .tg{border-top:1px solid var(--line)}
.ks-alanlar .tg[disabled]{opacity:.55;cursor:not-allowed}
.ks-alan-e{flex:none;width:36px;height:36px;display:grid;place-items:center;border-radius:var(--r-s);background:color-mix(in srgb,var(--c,var(--c-kisisel)) 12%,var(--sf2))}
@media (min-width:768px){
  .ks-alanlar{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ks-alanlar .tg:nth-child(2){border-top:0}
  .ks-alanlar .tg:nth-child(odd){border-right:1px solid var(--line)}
}
/* Maneviyat */
.ks-secler{margin-bottom:var(--a3)}
.ks-manevi-ad{display:flex;flex-wrap:wrap;gap:var(--a2);align-items:flex-end;margin-bottom:var(--a2)}
.ks-manevi-ad > :first-child{flex:1 1 220px;min-width:0}
.ks-manevi-ad .m-not{margin:0}
.ks-beta{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:var(--r-tam);background:var(--claude-tint);color:var(--claude-t);font-size:var(--y-et);font-weight:600;letter-spacing:.02em;vertical-align:middle;line-height:1.5;text-transform:uppercase}
.ks-beta-ac{border:0;cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;gap:3px}
.ks-beta-ac svg{width:11px;height:11px;transition:transform .18s ease}
.ks-beta-ac[aria-expanded="true"] svg{transform:rotate(180deg)}
.ks-beta-ac:focus-visible{outline:2px solid var(--claude-t);outline-offset:2px}
.ks-beta-not[hidden]{display:none}
.ks-beta-not{margin:0 20px var(--a3);padding:var(--a2) var(--a4);border-radius:var(--r-s);background:var(--claude-tint);color:var(--txt);font-size:var(--y-meta);line-height:1.5}
.ks-beta-not b{color:var(--claude-t)}.ks-beta-not a{color:var(--claude-t);font-weight:600}
.ks-gizli-tarih{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ks-sehir{display:flex;flex-direction:column;gap:var(--a2);padding:var(--a4);margin-bottom:var(--a3)}
.ks-sehir-sat{display:flex;flex-wrap:wrap;gap:var(--a2);align-items:center;margin-top:6px}
.ks-sehir-sat select{flex:1 1 180px;min-width:0;max-width:280px}
/* tema: palet kartları (önizleme tokenları 1b'de) */
.ks-paller{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--a2)}
@media (min-width:768px){.ks-paller{grid-template-columns:repeat(5,minmax(0,1fr))}}
.ks-pal{display:flex;flex-direction:column;gap:var(--a2);min-width:0;padding:var(--a2);border-radius:var(--r-m);border:2px solid var(--line);background:var(--sf);
  color:var(--ink);font:inherit;text-align:left;cursor:pointer;box-shadow:var(--g1s)}
.ks-pal[aria-checked="true"]{border-color:var(--odak)}
.ks-pal-on{display:grid;grid-template-columns:1fr 1fr;border-radius:var(--r-s);overflow:hidden;height:52px}
.ks-pal-a,.ks-pal-k{display:flex;align-items:flex-end;gap:4px;padding:6px}
.ks-pal-a{background:var(--on-a1)}
.ks-pal-k{background:var(--on-k1)}
.ks-pal-on i{display:block;flex:1;height:14px;border-radius:4px}
.ks-pal-a i:nth-child(1){background:var(--on-a2);height:30px}.ks-pal-a i:nth-child(2){background:var(--on-a3)}.ks-pal-a i:nth-child(3){background:var(--on-a2);opacity:.35}
.ks-pal-k i:nth-child(1){background:var(--on-k2);height:30px}.ks-pal-k i:nth-child(2){background:var(--on-k3)}.ks-pal-k i:nth-child(3){background:var(--on-k2)}
.ks-pal-m{display:flex;flex-direction:column;min-width:0;padding:0 2px 2px}
.ks-pal-m b{font-size:var(--y-kucuk);font-weight:600}
.ks-pal-m small{font-size:var(--y-meta);color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ks-tema-alt{display:flex;flex-wrap:wrap;gap:var(--a4);margin:var(--a4) 0 var(--a2)}
.ks-tema-alt > div{min-width:0}
.ks-seg{display:inline-grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:1px;border:1px solid var(--line2);border-radius:var(--r-s);overflow:hidden;background:var(--line2)}
.ks-seg button{min-height:40px;padding:0 14px;border:0;background:var(--sf);color:var(--txt);font:inherit;font-size:var(--y-meta);font-weight:600;cursor:pointer;white-space:nowrap}
@media (max-width:599px){
  .ks-tema-alt > div{flex:1 1 100%}
  .ks-seg{display:grid;width:100%}
  .ks-seg-4{grid-auto-flow:row;grid-template-columns:repeat(2,minmax(0,1fr))}
}
.ks-seg button[aria-checked="true"]{background:var(--secili);color:var(--secili-ink)}
/* hazır düzen çipleri, öneriler */
.ks-hz{display:flex;flex-wrap:wrap;align-items:center;gap:var(--a2);margin-top:var(--a3)}
.ks-hz .ks-et{margin:0 var(--a1) 0 0}
.ks-hz .chip{min-height:40px}
/* namazsız Maneviyat sayfası, kapalı alan */
.ks-manevi .ks-mliste{padding:0}
.ks-mr{position:relative}
.ks-mr + .ks-mr{border-top:1px solid var(--line)}
.ks-mr > .row{border:0}
.ks-mr-x{position:absolute;top:10px;right:10px;min-height:40px}
.ks-mr .row-top .m{margin-right:72px}
.ks-mbos,.ks-mekle{padding:var(--a4)}
.ks-mbos p{margin:0;font-size:var(--y-kucuk);color:var(--mut)}
.ks-mekle .ks-hz{margin:0 0 var(--a4)}
.ks-mform{display:flex;flex-wrap:wrap;gap:var(--a2);align-items:flex-end}
.ks-mform > :first-child{flex:2 1 200px;min-width:0}
.ks-mform > :nth-child(2){flex:1 1 120px;min-width:0}
.ks-mform .btn{min-height:40px}
.ks-mekle .m-not{margin:var(--a3) 0 0}
.ks-kapali{display:flex;gap:var(--a4);align-items:flex-start;padding:var(--a4)}
.ks-kapali b{font-size:var(--y-kart);color:var(--ink)}
.ks-kapali p{margin:4px 0 var(--a3);font-size:var(--y-kucuk);color:var(--mut)}
.ks-kapali > div{min-width:0}
.ks-kapali .m-not{margin:0 0 var(--a3)}
.ks-tanit{margin:0 0 var(--a3);padding:0 0 0 var(--a4);display:grid;gap:var(--a1);font-size:var(--y-govde);color:var(--txt);line-height:1.45}
.ks-tanit li::marker{color:var(--acc-t)}
.ks-kapali p.ks-tanit-kim{color:var(--txt)}
/* alan listesi katmanları: Temel · Hayatına göre · İşin varsa (katlı) */
.ks-katman{margin:0 0 var(--a4)}
.ks-katman-bas{display:flex;align-items:baseline;gap:var(--a2);margin:0 4px var(--a2);font-size:var(--y-kucuk);font-weight:600;color:var(--ink)}
.ks-katman-bas small{font-size:var(--y-meta);font-weight:500;color:var(--mut)}
.ks-katman-nis > summary{cursor:pointer;list-style:none;min-height:40px;align-items:center;padding:0 4px;margin:0 0 var(--a2);border-radius:var(--r-s)}
.ks-katman-nis > summary::-webkit-details-marker{display:none}
.ks-katman-nis > summary::after{content:"";width:8px;height:8px;margin-left:auto;border-right:2px solid var(--mut);border-bottom:2px solid var(--mut);transform:rotate(45deg) translateY(-2px);transition:transform var(--hiz-k) var(--ease)}
.ks-katman-nis[open] > summary::after{transform:rotate(-135deg) translateY(-2px)}
.ks-katman-nis > summary:focus-visible{outline:2px solid var(--odak);outline-offset:2px}
.ks-alanlar .tg small.ks-alan-kim{color:var(--fnt);font-size:var(--y-et)}
/* Alanlar → Keşfet: kapalı alanların kartları (375'te tek sütun) */
.ks-kesfet{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--a3)}
@media (min-width:640px){.ks-kesfet{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1280px){.ks-kesfet{grid-template-columns:repeat(3,minmax(0,1fr))}}
.ks-kesfet-kart{display:grid;grid-template-columns:40px minmax(0,1fr);align-content:start;gap:var(--a3);min-width:0;padding:var(--a4);border-radius:var(--r-m);border:1px dashed var(--line2);background:var(--sf)}
.ks-kesfet-e{flex:none;width:40px;height:40px;display:grid;place-items:center;border-radius:var(--r-s);background:var(--bg2)}
.ks-kesfet-m{display:flex;flex-direction:column;gap:2px;min-width:0}
.ks-kesfet-m b{font-size:var(--y-govde);font-weight:600;color:var(--ink)}
.ks-kesfet-m span{font-size:var(--y-kucuk);color:var(--txt)}
.ks-kesfet-m small{font-size:var(--y-meta);color:var(--mut);line-height:1.45}
.ks-kesfet-d{grid-column:1 / -1;display:flex;flex-wrap:wrap;align-items:center;gap:var(--a3)}
.ks-kesfet-d .btn{min-height:40px;min-width:72px}
.ks-kesfet-ne{display:inline-flex;align-items:center;min-height:40px;font-size:var(--y-meta);font-weight:600;color:var(--acc-t)}
@media (hover:hover){.ks-kesfet-kart:hover{border-color:var(--line2);box-shadow:var(--g1s)}.ks-kesfet-ne:hover{text-decoration:underline}}
/* kenar menüde adı tıkla-düzenle */
:root.ks-acik .marka .ad b{cursor:text}
@media (hover:hover){:root.ks-acik .marka .ml:hover .ad b{text-decoration:underline dotted;text-underline-offset:4px}}
.marka .ks-ad-gir{width:100%;height:36px;font-size:var(--y-kucuk);font-weight:600;letter-spacing:0}

/* 58 · Ürün görünümü (Kasım 2026): yalnız kişiselleştirme açıkken (html.ks-acik). Tek kart dili: aynı yarıçap, ince
   çerçeve, hafif gölge; tutarlı bölüm başlığı; telefonda dar kenar ve belirgin alt çubuk. Tek kişilik kurulumda etkisiz. */
:root.ks-acik .card{border-radius:var(--r-m);box-shadow:var(--g1s);border:1px solid var(--line)}
/* Bugün'ün bölümleri zaten kart: içindeki karta ikinci çerçeve ve gölge gelmesin (iç içe kutu görünümü) */
:root.ks-acik .bg-kart .card,:root.ks-acik .bg-kart .ui-karo .card{border:0;box-shadow:none}
:root.ks-acik .sec > .sh h2{font-size:var(--y-kart);font-weight:600;letter-spacing:-.01em}
:root.ks-acik .sec > .sh .m{font-size:var(--y-meta);color:var(--fnt)}
:root.ks-acik .bg-pano{row-gap:var(--a3)}
:root.ks-acik .ks-beta-not{border:1px solid color-mix(in srgb,var(--c-claude) 25%,transparent)}
@media (max-width:1023px){
  :root.ks-acik .sec{padding:16px 16px 0}
  :root.ks-acik .ks-beta-not{margin:0 16px var(--a3)}
  :root.ks-acik .nav{border-top:1px solid var(--line);box-shadow:0 -6px 24px color-mix(in srgb,var(--ink) 6%,transparent)}
}
/* Mobil uygulama kabuğu (Capacitor) ya da ana ekrana eklenmiş PWA: html.uygulama (kisisel.js) */
:root.uygulama body{overscroll-behavior-y:none;-webkit-tap-highlight-color:transparent}
:root.uygulama .nav,:root.uygulama #ust,:root.uygulama .btn{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
/* Kenar menü listesi (.rl): kaydırma ipucu (Kasım 2026). Eski alt maske son öğeyi tam gösterdiği için liste bitmiş sanılıyordu
   (1280×900'de 7 alanla son iki alan gizli). Yerine kaydırma gölgesi: altında öğe varken alt kenarda gölge, sona gelince
   "local" örtü gölgeyi kapatır; üstte de aynısı. Zemin kenar çubuğunun rengi (--sf), yalnız token. Yalnız ürün (ks-acik):
   tek kişilik kurulumun menüsü değişmez. */
:root.ks-acik .rl{-webkit-mask-image:none;mask-image:none;
  background:linear-gradient(var(--sf) 40%,transparent) top/100% 26px no-repeat local,
    linear-gradient(transparent,var(--sf) 60%) bottom/100% 26px no-repeat local,
    radial-gradient(farthest-side at 50% 0,color-mix(in srgb,var(--ink) 16%,transparent),transparent) top/100% 12px no-repeat scroll,
    radial-gradient(farthest-side at 50% 100%,color-mix(in srgb,var(--ink) 22%,transparent),transparent) bottom/100% 14px no-repeat scroll}
@media (hover:hover){:root.ks-acik .rl{scrollbar-color:var(--line2) transparent}}
/* Kısa masaüstü ekranı (≤960 px yükseklik): satırlar ve alt blok sıkışır, 7 alan 900 px'te kaydırmadan sığar */
@media (min-width:1024px) and (max-height:960px){
  :root.ks-acik .rl{padding-bottom:8px}
  :root.ks-acik .rl .rs{height:34px}
  :root.ks-acik .rl .rg{padding:8px 9px 3px}
  :root.ks-acik .ralt{margin-top:5px;padding-top:7px;gap:5px}
}