/* Ana sayfa (story) stilleri. style.css'ten sonra yüklenir; ortak kuralları burada ezer. */
.story{--ink-2:#1B2A37;--hair:rgba(13,27,38,.08)}

/* ---------- arka plan: sakin ışık + ince ızgara + vinyet (bulut/güneş/tepe yok) ---------- */
.st-bg{overflow:hidden;box-shadow:inset 0 0 180px rgba(8,40,70,.07)}
.st-bg i{position:absolute;inset:0;transition:opacity .7s ease}
.st-bg .g-l{background:
  radial-gradient(52% 64% at 74% 46%,rgba(255,255,255,.85),rgba(255,255,255,0) 72%),
  radial-gradient(46% 56% at 6% -6%,rgba(105,200,241,.26),rgba(105,200,241,0) 72%)}
.st-bg .g-l::after,.st-bg .g-d::after{content:"";position:absolute;inset:0;background-size:72px 72px;
  -webkit-mask-image:radial-gradient(ellipse 70% 62% at 50% 46%,#000 8%,transparent 78%);mask-image:radial-gradient(ellipse 70% 62% at 50% 46%,#000 8%,transparent 78%)}
.st-bg .g-l::after{background-image:linear-gradient(rgba(10,70,115,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(10,70,115,.055) 1px,transparent 1px)}
.st-bg .g-d{opacity:0;background:
  radial-gradient(50% 60% at 28% 48%,rgba(58,167,227,.34),rgba(58,167,227,0) 72%),
  radial-gradient(60% 50% at 100% 0,rgba(105,200,241,.14),rgba(105,200,241,0) 70%)}
.st-bg .g-d::after{background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px)}
.stage.on-dark .g-l{opacity:0}.stage.on-dark .g-d{opacity:1}
.stage.on-dark .st-bg{box-shadow:inset 0 0 220px rgba(0,10,25,.28)}

/* ---------- tipografi ---------- */
.mega,.display{text-wrap:balance}
.mega{font-weight:700;letter-spacing:-.04em;line-height:.96}
.scene-p{font:500 clamp(18px,1.6vw,22px)/1.5 var(--body);color:#4A5B6B;max-width:25em;letter-spacing:-.005em}
.ch-talk .scene-p{color:rgba(255,255,255,.82)}
.display{font-weight:700;letter-spacing:-.035em}
.display em{color:var(--deep)}
.ch-fin .display.sm{font-weight:700}
.hero-copy .lead{font-size:clamp(17px,1.4vw,19px);line-height:1.6;color:#4A5B6B}
.eyebrow{display:flex;align-items:center;gap:10px;font:600 12px/1 var(--body);letter-spacing:.16em;color:var(--deep-2);margin-bottom:18px}
.eyebrow.on-blue{color:rgba(216,240,253,.92)}
.eyebrow .no{min-width:0;height:auto;margin:0;padding:6px 9px 5px;border-radius:8px;background:rgba(10,112,179,.08);color:var(--deep);box-shadow:inset 0 0 0 1px rgba(10,112,179,.22);font:700 12px/1 var(--body);letter-spacing:.06em;font-variant-numeric:tabular-nums}
.ch-talk .eyebrow .no{background:rgba(255,255,255,.1);color:#CFEBFB;box-shadow:inset 0 0 0 1px rgba(255,255,255,.28)}
.pill{background:rgba(255,255,255,.7);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(10,112,179,.16);box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 6px 18px -10px rgba(10,70,115,.35);color:var(--deep-2);font:600 13px/1 var(--body);letter-spacing:.01em;padding:9px 14px 9px 12px}
.pill .dot{width:7px;height:7px;background:#2A9AD8;box-shadow:0 0 0 4px rgba(42,154,216,.18)}

/* ---------- orbit çipleri (cam arayüz) ---------- */
.chip-o{gap:9px;padding:8px 14px 8px 8px;background:rgba(255,255,255,.62);-webkit-backdrop-filter:blur(16px) saturate(1.4);backdrop-filter:blur(16px) saturate(1.4);border:1px solid rgba(255,255,255,.85);
  box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 12px 28px -14px rgba(8,50,90,.45),0 0 0 1px rgba(10,70,115,.06);font:600 14px/1 var(--body);letter-spacing:-.005em;color:var(--ink-2)}
.chip-o svg{box-sizing:content-box;width:16px;height:16px;padding:6px;border-radius:50%;background:linear-gradient(160deg,#EAF6FD,#CDE9F8);color:var(--deep);box-shadow:inset 0 0 0 1px rgba(10,112,179,.14)}

/* ---------- konuşma balonu ---------- */
.hero-bubble{background:#fff;border:1px solid rgba(10,70,115,.1);border-radius:16px 16px 16px 6px;padding:11px 16px;font:500 14.5px/1.4 var(--body);color:var(--ink-2);letter-spacing:-.005em;box-shadow:0 14px 30px -14px rgba(8,50,90,.4),0 1px 2px rgba(8,50,90,.08)}
.hero-bubble::after{left:28px;bottom:-6px;width:12px;height:12px;border:0;border-right:1px solid rgba(10,70,115,.1);border-bottom:1px solid rgba(10,70,115,.1);border-radius:0 0 3px 0;transform:rotate(45deg)}
.hero-bubble.pop{animation:none}

/* ---------- kaydırma ipucu + nokta gezinme ---------- */
.scroll-hint{font:600 11px/1 var(--body);letter-spacing:.2em;color:#5A6C7C;gap:8px}
.scroll-hint i{width:1px;height:34px;background:linear-gradient(#5A6C7C,transparent)}
.dots-nav{gap:0;padding:8px 5px;border-radius:99px;background:rgba(255,255,255,.5);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.7);box-shadow:0 8px 24px -12px rgba(8,50,90,.35)}
.dots-nav button{height:26px;min-width:22px;padding:0 6px;justify-content:center;color:var(--deep-2)}
.dots-nav i{width:5px;height:5px;opacity:.3;transition:transform .3s,opacity .3s,height .3s}
.dots-nav button[aria-current=true] i{height:16px;border-radius:99px;transform:none;opacity:.95}
.dots-nav span{right:34px;background:rgba(13,27,38,.92);font:600 12px/1 var(--body);padding:6px 10px;border-radius:8px}
.dots-nav.on-dark{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.18)}
.dots-nav.on-dark button{color:#fff}

/* ---------- telefon: cihaz gövdesi ---------- */
.ch .phone,.phone{--bz:#04070a;border-radius:50px;padding:0;
  background:linear-gradient(135deg,#6b7783 0,#2a333c 9%,#10161c 28%,#0c1116 62%,#26303a 90%,#6b7783 100%);
  box-shadow:0 0 0 1px rgba(0,0,0,.55),inset 0 0 0 1.2px rgba(255,255,255,.28),inset 0 0 0 3.5px #0a0f14,
    0 60px 90px -34px rgba(4,30,60,.55),0 24px 40px -22px rgba(4,30,60,.45)}
.phone::before{content:"";position:absolute;z-index:0;left:-3px;top:86px;width:4px;height:150px;border-radius:3px 0 0 3px;transform:none;
  background:linear-gradient(to bottom,#3a4651 0 24px,transparent 24px 46px,#3a4651 46px 92px,transparent 92px 104px,#3a4651 104px 150px);box-shadow:none}
.phone::after{content:"";position:absolute;z-index:0;right:-3px;top:150px;width:4px;height:72px;border-radius:0 3px 3px 0;background:#3a4651}
.ph-screen{inset:11px;border-radius:40px;box-shadow:0 0 0 4px var(--bz);background:#F4F7FA;padding:48px 13px 22px;gap:9px;z-index:1}
.ph-screen::after{content:"";position:absolute;inset:0;z-index:30;pointer-events:none;border-radius:inherit;
  background:linear-gradient(118deg,rgba(255,255,255,.2) 0,rgba(255,255,255,.07) 22%,rgba(255,255,255,0) 40%),linear-gradient(to bottom,rgba(255,255,255,.08),rgba(255,255,255,0) 14%)}
.ph-status{position:absolute;z-index:25;left:0;right:0;top:0;height:46px;padding:0 24px 0 28px;display:flex;align-items:center;justify-content:space-between;color:var(--ink)}
.ph-status b{font:700 14px/1 var(--body);letter-spacing:-.01em;padding-top:2px}
.ph-island{position:absolute;left:50%;top:10px;width:78px;height:23px;border-radius:99px;background:#000;transform:translateX(-50%)}
.ph-island::after{content:"";position:absolute;right:9px;top:7px;width:8px;height:8px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#2b3a55,#0a0e16 70%)}
.ph-status span{display:flex;align-items:center;gap:5px;padding-top:2px}.ph-status svg{height:11px;width:auto;fill:currentColor}
.ph-home{position:absolute;z-index:26;left:50%;bottom:7px;width:96px;height:4px;border-radius:99px;background:var(--ink);opacity:.85;transform:translateX(-50%)}
.ph-bar{padding:2px 2px 0}.ph-bar b{font:700 22px/1 var(--display);letter-spacing:-.025em}
.ph-ex{font:600 9.5px/1 var(--body);letter-spacing:.08em;color:#5A6C7C;border:0;padding:4px 8px;border-radius:99px;background:rgba(13,27,38,.06);box-shadow:inset 0 0 0 1px rgba(13,27,38,.08)}

/* ---------- 1 / tarama ---------- */
.cam{height:auto;flex:1 1 150px;min-height:118px;max-height:220px;border-radius:20px;
  background:radial-gradient(120% 90% at 50% 38%,rgba(255,255,255,.22),rgba(255,255,255,0) 55%),
   repeating-linear-gradient(97deg,rgba(0,0,0,.05) 0 2px,rgba(255,255,255,.02) 2px 7px),
   linear-gradient(160deg,#9a7653,#6f4f35);box-shadow:inset 0 0 0 1px rgba(0,0,0,.25),inset 0 -30px 50px -20px rgba(0,0,0,.45)}
.plate-wrap{width:min(142px,56%)}
.plate{filter:drop-shadow(0 14px 12px rgba(30,15,5,.45))}
.vf{width:24px;height:24px;border-width:2.5px;border-color:rgba(255,255,255,.95)}
.cam-tag{position:absolute;z-index:2;left:50%;top:11px;transform:translateX(-50%);font:700 9.5px/1 var(--body);letter-spacing:.14em;color:#fff;padding:4px 9px;border-radius:99px;background:rgba(10,20,30,.45);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.scanline{height:2px;background:linear-gradient(90deg,transparent,#8fdcff 20%,#fff 50%,#8fdcff 80%,transparent);box-shadow:0 0 16px 3px rgba(105,200,241,.9)}
.res{gap:5px}
.res li{grid-template-columns:auto 1fr auto auto;gap:8px;border:0;border-radius:12px;padding:8px 10px;font:600 12.5px/1.2 var(--body);box-shadow:0 1px 2px rgba(13,27,38,.05),0 0 0 1px rgba(13,27,38,.05)}
.fd{width:9px;height:9px;border-radius:50%;background:#E08A2E;box-shadow:0 0 0 3px rgba(224,138,46,.18)}.fd2{background:#E9C96B;box-shadow:0 0 0 3px rgba(233,201,107,.25)}.fd3{background:#9CCBEA;box-shadow:0 0 0 3px rgba(156,203,234,.3)}
.res .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.res em{min-width:0;font:700 10.5px/1 var(--body);color:var(--green);background:var(--green-soft);padding:4px 6px;border-radius:99px}
.res b{font:700 12.5px/1 var(--body);min-width:0;letter-spacing:-.01em;color:var(--ink)}
.res-total{padding:0 3px;font:600 12px/1 var(--body);color:#5A6C7C;align-items:center}
.res-total b{font:700 20px/1 var(--display);color:var(--ink);letter-spacing:-.02em}
.added{margin-top:auto;border-radius:13px;padding:11px;background:linear-gradient(180deg,#1A8A47,#13773A);box-shadow:0 8px 16px -8px rgba(19,119,58,.6),inset 0 1px 0 rgba(255,255,255,.25);font:600 13.5px/1 var(--body)}

/* ---------- 2 / sohbet ---------- */
.ch-talk .ph-screen{background:#EEF3F7}
.chat-head{gap:9px;border-bottom:1px solid var(--hair);margin:0 -13px;padding:0 13px 9px 11px;background:rgba(255,255,255,.72);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.chat-head .back{width:18px;height:18px;color:var(--deep);flex:none}
.chat-head .av{position:relative;width:34px;height:34px;background:linear-gradient(160deg,#EAF6FD,#CDE9F8);box-shadow:inset 0 0 0 1px rgba(10,112,179,.15)}
.chat-head .av img{height:100%;width:100%;object-fit:cover;border-radius:50%}
.chat-head .av u{position:absolute;right:-1px;bottom:0;width:9px;height:9px;border-radius:50%;background:#22A24F;box-shadow:0 0 0 2px #fff}
.chat-head b{font:700 14.5px/1.15 var(--body);letter-spacing:-.01em}.chat-head small{font:500 11.5px/1 var(--body);color:#5A6C7C}
.chat-head div{flex:1;display:grid;gap:2px}
.chat-head .more{display:flex;gap:2.5px}.chat-head .more i{width:3.5px;height:3.5px;border-radius:50%;background:#7C8D9C}
.chat-body{gap:7px;padding-top:4px}
.chat-body .day{margin:2px 0 4px;text-align:center;font:600 10px/1 var(--body);letter-spacing:.1em;text-transform:uppercase;color:#7C8D9C}
.msg{max-width:84%;border-radius:18px;padding:9px 12px;font:500 13px/1.38 var(--body);letter-spacing:-.005em}
.msg.me{background:linear-gradient(170deg,#1388D4,#0A68A8);box-shadow:0 6px 14px -8px rgba(10,104,168,.7);border-bottom-right-radius:6px}
.msg.fl{background:#fff;border:0;box-shadow:0 1px 2px rgba(13,27,38,.06),0 0 0 1px rgba(13,27,38,.04);border-bottom-left-radius:6px}
.msg.dots i{background:#A9B8C5}
.bars{height:20px}.bars i{width:2.5px;opacity:.95}
.apply{margin-top:9px;border-radius:10px;background:#0B64A3;box-shadow:none;font:600 12.5px/1 var(--body);padding:10px}
.chat-in{gap:8px;border:0;border-radius:99px;padding:5px 5px 5px 11px;color:#8798A7;font:500 13px var(--body);background:#fff;box-shadow:0 0 0 1px rgba(13,27,38,.08),0 8px 18px -12px rgba(13,27,38,.3);margin-bottom:2px}
.chat-in .plus{width:17px;height:17px;color:#7C8D9C;flex:none}
.mic{width:34px;height:34px;background:linear-gradient(170deg,#1388D4,#0A68A8)}.mic svg{width:16px;height:16px}

/* ---------- 3 / program tahtası ---------- */
.board{gap:12px;padding:16px;border-radius:26px;background:rgba(255,255,255,.7);-webkit-backdrop-filter:blur(18px) saturate(1.3);backdrop-filter:blur(18px) saturate(1.3);
  border:1px solid rgba(255,255,255,.9);box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 40px 70px -36px rgba(8,50,90,.4),0 0 0 1px rgba(10,70,115,.07)}
.b-head{display:flex;align-items:center;justify-content:space-between;padding:2px 2px 0}
.b-head b{font:700 17px/1 var(--display);letter-spacing:-.02em;color:var(--ink)}
.days{gap:7px}
.dc{min-height:112px;padding:11px 9px 10px;border-radius:14px;background:#0B64A3;color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 10px 18px -12px rgba(11,100,163,.7)}
.dc small{font:600 11px/1 var(--body);opacity:.8;letter-spacing:.08em}
.dc b{font:600 clamp(12px,1.05vw,14px)/1.1 var(--body);letter-spacing:-.01em}
.dc.rest{background:#fff;box-shadow:0 0 0 1px rgba(13,27,38,.07);border:0;color:#6B7C8B}
.dc .dots-m{height:4px;width:60%;background:rgba(255,255,255,.4)}.dc.rest .dots-m{background:#E4EAF0;width:30%}
.dc.sat b{left:9px;bottom:24px}
.exlist{border:0;border-radius:18px;padding:15px 16px;gap:9px;background:#fff;box-shadow:0 0 0 1px rgba(13,27,38,.06),0 14px 28px -20px rgba(13,27,38,.4);counter-reset:ex}
.exlist h3{font:700 16px/1 var(--display);letter-spacing:-.02em;margin-bottom:2px}
.er{counter-increment:ex;grid-template-columns:22px 1fr auto;gap:5px 10px;font:500 14px/1.2 var(--body);color:var(--ink)}
.er::before{content:counter(ex);grid-row:1;display:grid;place-items:center;width:22px;height:22px;border-radius:7px;background:#EAF3FA;color:var(--deep);font:700 11px/1 var(--body)}
.er b{font:600 13px/1 var(--body);color:#5A6C7C;font-variant-numeric:tabular-nums}
.er i{grid-column:2/-1;height:4px;background:linear-gradient(90deg,#0B64A3,#69C8F1)}
.chatpill{gap:10px;margin-top:28px;padding:7px 18px 7px 7px;background:rgba(255,255,255,.7);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.9);box-shadow:0 12px 26px -14px rgba(8,50,90,.4),0 0 0 1px rgba(10,70,115,.07);font:500 15px/1.2 var(--body);color:var(--ink-2)}
.chatpill .av{width:32px;height:32px;background:linear-gradient(160deg,#EAF6FD,#CDE9F8)}.chatpill .av img{height:100%;width:100%;border-radius:50%;object-fit:cover}

/* ---------- 4 / öğün ---------- */
.ch-meal .ph-screen{background:#F5F7F8}
.rings{grid-template-columns:auto 1fr;gap:14px;padding:11px 12px;border:0;border-radius:18px;box-shadow:0 1px 2px rgba(13,27,38,.05),0 0 0 1px rgba(13,27,38,.05)}
.ring-box{position:relative;width:88px;height:88px}
.rings svg{width:88px;height:88px}
.ring-n{left:0;top:0;width:88px;height:88px}.ring-n b{font:700 24px/1 var(--display);letter-spacing:-.03em;color:var(--ink)}.ring-n small{font:500 10px/1.1 var(--body);color:#6B7C8B;margin-top:1px}
.macro{display:grid;gap:7px}
.mr small{display:block;font:600 10.5px/1 var(--body);color:#5A6C7C;margin:0 0 4px;text-transform:capitalize}
.mbar{height:5px;background:#E8EEF3}.mbar i{background:linear-gradient(90deg,#0B64A3,#3AA7E3)}
.mr.c .mbar i{background:linear-gradient(90deg,#E8A317,#F5B94B)}.mr.f .mbar i{background:linear-gradient(90deg,#7A8EA0,#A6B6C4)}
.deck{height:auto;flex:1 1 160px;min-height:150px}
.mc{gap:11px;padding:10px;border:0;border-radius:16px;box-shadow:0 0 0 1px rgba(13,27,38,.05),0 10px 22px -12px rgba(13,27,38,.28)}
.mc.m2{top:14px;left:7px;right:7px}.mc.m3{top:28px;left:14px;right:14px}
.mimg{width:48px;height:48px;background:none;border-radius:12px;overflow:hidden}.mimg svg{width:100%;height:100%}
.mc b{font:600 13.5px/1.2 var(--body);letter-spacing:-.01em}.mc small{font:500 11px/1.4 var(--body);color:#5A6C7C}
.star{right:-5px;top:-9px;font:700 10px/1 var(--body);letter-spacing:.02em;padding:5px 8px;background:linear-gradient(180deg,#FBB631,#F59E0B);color:#3b2400;box-shadow:0 6px 12px -6px rgba(245,158,11,.8);transform:rotate(3deg)}
.addbtn{border-radius:13px;padding:12px;background:linear-gradient(180deg,#1388D4,#0A68A8);box-shadow:0 10px 18px -10px rgba(10,104,168,.8),inset 0 1px 0 rgba(255,255,255,.28);font:600 14px/1 var(--body)}

/* halka ve protein çubuğu kaydırmayla sürülür ama gizli başlamamalı (style.css [data-s]{opacity:0} kuralını ezer) */
.js:not(.fx-static) [data-s="ring"],.js:not(.fx-static) [data-s="mbar"]{opacity:1}

/* ---------- mobil (390x844) ---------- */
@media(max-width:960px){
  .dc.rest b{font-size:0}.dc.rest b::before{content:"–";font-size:14px}
  .eyebrow{margin-bottom:10px}
  .scene-p{font-size:16.5px;line-height:1.45}
  .ch .phone{border-radius:42px}
  .ph-screen{inset:9px;border-radius:34px;padding:43px 11px 18px;gap:7px;box-shadow:0 0 0 3.5px var(--bz)}
  .ph-status{height:40px;padding:0 20px 0 24px}.ph-status b{font-size:12.5px}.ph-island{top:8px;width:66px;height:20px}.ph-status svg{height:9px}
  .phone::before{top:66px;height:110px}.phone::after{top:110px;height:54px}
  .ph-bar b{font-size:19px}
  .ring-box,.rings svg,.ring-n{width:74px;height:74px}.ring-n b{font-size:20px}.rings{padding:8px 10px;gap:10px}
  .msg{font-size:12px;padding:8px 10px}.cam{min-height:96px}
  .dc{min-height:78px}.board{padding:11px;gap:9px;border-radius:20px}.b-head b{font-size:15px}
  .er{font-size:12.5px}
  .chip-o{font-size:12.5px;padding:6px 11px 6px 6px}.chip-o svg{width:13px;height:13px;padding:5px}
  .hero-bubble{font-size:13px}
}

/* ---------- azaltılmış hareket (html.fx-static) ---------- */
.fx-static .ch-hero{background:linear-gradient(180deg,#E7F0F7,#F3F7FA)}
.fx-static .ch-snap{background:linear-gradient(180deg,#F3F7FA,#EAF1F7)}
.fx-static .ch-talk{background:linear-gradient(160deg,#083A60,#0B4670 60%,#0A5A93 130%)}
.fx-static .ch-plan{background:#F2F5F8}
.fx-static .ch-meal{background:linear-gradient(180deg,#F2F5F8,#EAF3F5)}
.fx-static .ch-fin{background:linear-gradient(135deg,#0A5A93,#0A64A3 60%,#2A8DCB)}
.fx-static .st-bg i{display:none}