:root{
  /* gece mürekkebi */
  --ink:#0E1220;
  --ink-2:#151B2C;
  --ink-3:#1E263B;
  --line:#2B3550;
  --paper:#E8E3D6;
  --paper-dim:#9AA3B8;
  --star:#7E8FC4;

  /* dört element */
  --root:#C89A4E;    /* Toprak — Kök */
  --leaf:#4E9E7C;    /* Su — Yaprak */
  --flower:#D8C368;  /* Hava — Çiçek */
  --fruit:#C4573F;   /* Ateş — Meyve */

  --r-lg:20px; --r-md:14px; --r-sm:10px;
  --sp:clamp(16px,4vw,22px);
  --maxw:600px;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0}
body{
  background:
    radial-gradient(120% 60% at 50% -10%, #1B2340 0%, rgba(27,35,64,0) 60%),
    radial-gradient(90% 50% at 100% 100%, #16203A 0%, rgba(22,32,58,0) 55%),
    var(--ink);
  color:var(--paper);
  font-family:'Karla','Segoe UI',-apple-system,BlinkMacSystemFont,Roboto,sans-serif;
  font-size:16px;line-height:1.6;
  -webkit-font-smoothing:antialiased;
  min-height:100vh;
  padding-bottom:60px;
}
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.5;
  background-image:
    radial-gradient(1px 1px at 12% 18%, #6E80B8 40%, transparent 41%),
    radial-gradient(1px 1px at 78% 9%, #8FA0D6 40%, transparent 41%),
    radial-gradient(1px 1px at 34% 62%, #5E6E9E 40%, transparent 41%),
    radial-gradient(1px 1px at 89% 47%, #7186C0 40%, transparent 41%),
    radial-gradient(1px 1px at 57% 88%, #6577A8 40%, transparent 41%),
    radial-gradient(1px 1px at 22% 92%, #7E8FC4 40%, transparent 41%),
    radial-gradient(1px 1px at 66% 33%, #5C6B99 40%, transparent 41%);
  background-size:100% 100%;
}
.wrap{position:relative;z-index:1;max-width:var(--maxw);margin:0 auto;padding:0 var(--sp)}

h1,h2,h3,.disp{font-family:'Bodoni Moda',Didot,'Times New Roman',serif;font-weight:500;letter-spacing:-.005em;margin:0;font-optical-sizing:auto}
.eyebrow{
  font-size:10.5px;letter-spacing:.26em;text-transform:uppercase;
  color:var(--star);font-weight:600;
}

/* ---------- başlık ---------- */
.masthead{padding:26px 0 12px;text-align:center}
.masthead h1{font-size:clamp(30px,8.5vw,42px);line-height:1.05;margin-top:8px;letter-spacing:-.015em}
.masthead .sub{color:var(--paper-dim);font-size:13.5px;margin-top:6px}

/* ---------- sekmeler ---------- */
nav.tabs{
  position:sticky;top:0;z-index:20;margin:14px 0 0;
  padding:10px 0;
  background:linear-gradient(180deg, rgba(14,18,32,.96) 60%, rgba(14,18,32,0));
  backdrop-filter:blur(8px);
}
.tabrow{display:flex;gap:7px;overflow-x:auto;scrollbar-width:none;padding:2px}
.tabrow::-webkit-scrollbar{display:none}
.tab{
  flex:0 0 auto;border:1px solid var(--line);background:transparent;color:var(--paper-dim);
  font:inherit;font-size:13.5px;font-weight:600;padding:8px 15px;border-radius:999px;cursor:pointer;
  transition:.18s;white-space:nowrap;
}
.tab[aria-selected="true"]{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.tab:focus-visible{outline:2px solid var(--star);outline-offset:2px}

section.panel{display:none;padding-top:8px;animation:fade .3s ease}
section.panel.on{display:block}
@keyframes fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* ---------- kadran ---------- */
.dialwrap{display:flex;justify-content:center;margin:6px 0 2px}
svg.dial{width:min(310px,84vw);height:auto;overflow:visible}
.dial .ringlabel{font-family:'Karla',sans-serif;font-size:8px;font-weight:700;letter-spacing:.1em;fill:var(--paper-dim)}
.dial .ringlabel.act{fill:#0E1220}

/* ---------- hüküm kartı ---------- */
.verdict{
  margin-top:14px;border:1px solid var(--line);border-radius:var(--r-lg);
  background:linear-gradient(180deg,var(--ink-2),rgba(21,27,44,.4));
  padding:20px;text-align:center;position:relative;overflow:hidden;
}
.verdict::after{
  content:"";position:absolute;left:50%;top:-70px;width:220px;height:140px;transform:translateX(-50%);
  background:radial-gradient(closest-side, var(--acc,#fff), transparent 72%);opacity:.24;pointer-events:none;
}
.verdict .kind{font-family:'Bodoni Moda',serif;font-weight:500;font-size:clamp(34px,10vw,46px);line-height:1.02;letter-spacing:-.02em;color:var(--acc,#fff);margin-top:6px}
.verdict .where{margin-top:8px;font-size:14px;color:var(--paper-dim)}
.verdict .where b{color:var(--paper);font-weight:600}
.verdict .todo{
  margin-top:14px;padding-top:14px;border-top:1px solid var(--line);
  font-size:14.5px;text-align:left;
}
.verdict .todo p{margin:0 0 8px}
.verdict .todo p:last-child{margin:0}
.verdict .todo span{color:var(--acc,#fff);font-weight:700}

.facts{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:10px}
.fact{border:1px solid var(--line);border-radius:var(--r-md);background:rgba(21,27,44,.55);padding:11px 13px}
.fact .k{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--star);font-weight:600}
.fact .v{font-size:14.5px;font-weight:600;margin-top:3px}
.fact .v small{display:block;font-weight:500;font-size:12px;color:var(--paper-dim);letter-spacing:0}

.warn{
  margin-top:10px;border:1px solid rgba(196,87,63,.5);background:rgba(196,87,63,.12);
  border-radius:var(--r-md);padding:12px 14px;font-size:13.5px;
}
.warn b{color:var(--fruit)}
.warn p{margin:0 0 6px}.warn p:last-child{margin:0}

/* ---------- 7 gün şeridi ---------- */
.strip{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:4px 0 2px;margin:0 calc(-1*var(--sp));padding-left:var(--sp);padding-right:var(--sp)}
.strip::-webkit-scrollbar{display:none}
.dayc{
  font:inherit;color:inherit;
  flex:0 0 76px;border:1px solid var(--line);border-radius:var(--r-md);padding:10px 8px;text-align:center;
  background:rgba(21,27,44,.5);cursor:pointer;transition:.18s;
}
.dayc:hover,.dayc:focus-visible{border-color:var(--star);outline:none}
.dayc.now{border-color:var(--paper)}
.dayc .dw{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--paper-dim)}
.dayc .dn{font-family:'Bodoni Moda',serif;font-size:20px;margin:2px 0 6px}
.dayc .dk{font-size:11px;font-weight:700;color:var(--acc)}
.dayc .bar{height:3px;border-radius:2px;background:var(--acc);margin-top:7px;opacity:.85}

/* ---------- ay ızgarası ---------- */
.monthbar{display:flex;align-items:center;justify-content:space-between;margin:6px 0 12px}
.monthbar h2{font-size:20px}
.navbtn{
  font-family:inherit;
  border:1px solid var(--line);background:transparent;color:var(--paper);width:38px;height:38px;
  border-radius:50%;font-size:17px;cursor:pointer;line-height:1;
}
.navbtn:hover{border-color:var(--star)}
.grid{display:grid;grid-template-columns:repeat(7,1fr);gap:5px}
.gh{text-align:center;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--paper-dim);padding-bottom:4px}
.cell{
  font-family:inherit;color:inherit;
  aspect-ratio:1/1.25;border:1px solid var(--line);border-radius:9px;background:rgba(21,27,44,.45);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;cursor:pointer;
  font-size:13px;font-weight:600;transition:.15s;padding:2px;
}
.cell.empty{border:0;background:none;cursor:default}
.cell:hover{border-color:var(--star)}
.cell.now{border-color:var(--paper);border-width:1.5px}
.cell .dot{width:7px;height:7px;border-radius:50%;background:var(--acc)}
.cell .flag{position:relative;font-size:9px;color:var(--fruit);line-height:1;height:9px}
.legend{display:flex;flex-wrap:wrap;gap:10px 16px;margin-top:16px;font-size:12.5px;color:var(--paper-dim)}
.legend i{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--acc);margin-right:6px}

/* ---------- içerik listeleri ---------- */
.lead{color:var(--paper-dim);font-size:14.5px;margin:4px 0 18px}
.card{
  border:1px solid var(--line);border-radius:var(--r-lg);background:rgba(21,27,44,.55);
  padding:18px;margin-bottom:12px;position:relative;
}
.card.el{border-left:3px solid var(--acc)}
.card h3{font-size:19px;color:var(--acc,var(--paper))}
.card .tag{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--paper-dim);font-weight:600}
.card p{font-size:14.5px;margin:9px 0 0;color:#CFD5E4}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.chip{
  font-size:12.5px;padding:5px 11px;border-radius:999px;border:1px solid var(--line);
  background:rgba(255,255,255,.03);color:#D6DBE8;
}
.rows{margin-top:12px;border-top:1px solid var(--line)}
.row{display:flex;gap:12px;padding:11px 0;border-bottom:1px solid var(--line);font-size:14px}
.row:last-child{border-bottom:0}
.row b{flex:0 0 96px;color:var(--paper);font-weight:600}
.row span{color:#C3CADB}

details.acc{border:1px solid var(--line);border-radius:var(--r-md);margin-bottom:9px;background:rgba(21,27,44,.5);overflow:hidden}
details.acc summary{padding:14px 16px;cursor:pointer;font-weight:600;font-size:15px;list-style:none;display:flex;justify-content:space-between;gap:10px}
details.acc summary::-webkit-details-marker{display:none}
details.acc summary::after{content:"+";color:var(--star);font-size:18px;line-height:1}
details.acc[open] summary::after{content:"–"}
details.acc .body{padding:0 16px 16px;font-size:14.5px;color:#C7CEDF}
details.acc .body p{margin:0 0 10px}
details.acc .body p:last-child{margin:0}

/* ---------- markalar / reklam ---------- */
.promos{display:grid;gap:10px;margin-top:6px}
.promo{
  display:flex;gap:14px;align-items:center;text-decoration:none;color:inherit;
  border:1px solid var(--line);border-radius:var(--r-lg);padding:15px;background:rgba(21,27,44,.55);
  transition:.18s;
}
.promo:hover{border-color:var(--acc);transform:translateY(-1px)}
.promo .mark{flex:0 0 50px;height:50px;border-radius:14px;border:1px solid var(--acc);display:grid;place-items:center;color:var(--acc);background:rgba(255,255,255,.03)}
.promo .mark svg{width:32px;height:32px;stroke:var(--acc);fill:none;stroke-linecap:round;stroke-linejoin:round}
.promo .t{display:block;font-family:'Bodoni Moda',serif;font-size:17px;line-height:1.25}
.promo .d{display:block;font-size:13px;color:var(--paper-dim);margin-top:2px}
.promo .go{margin-left:auto;color:var(--acc);font-size:20px}

footer{margin:34px 0 10px;padding-top:18px;border-top:1px solid var(--line);text-align:center;color:var(--paper-dim);font-size:12.5px}
footer a{color:var(--star)}
.note{font-size:12.5px;color:var(--paper-dim);line-height:1.5;margin-top:14px}

/* ---------- gün detay çekmecesi ---------- */
.sheetbg{position:fixed;inset:0;background:rgba(6,9,17,.72);backdrop-filter:blur(3px);z-index:60;opacity:0;pointer-events:none;transition:.22s}
.sheetbg.on{opacity:1;pointer-events:auto}
.sheet{
  position:fixed;left:0;right:0;bottom:0;z-index:61;margin:0 auto;max-width:var(--maxw);
  background:var(--ink-2);border:1px solid var(--line);border-radius:22px 22px 0 0;
  padding:8px var(--sp) calc(24px + env(safe-area-inset-bottom));
  transform:translateY(102%);transition:transform .28s cubic-bezier(.22,1,.36,1);
  max-height:88vh;overflow-y:auto;
}
.sheet.on{transform:none}
.grab{width:42px;height:4px;border-radius:2px;background:var(--line);margin:6px auto 14px}
.sheet h3{font-family:'Bodoni Moda',serif;font-size:22px}
.sheet .dt{color:var(--paper-dim);font-size:13px;margin-bottom:14px}
.closebtn{width:100%;margin-top:16px;padding:13px;border-radius:var(--r-md);border:1px solid var(--line);background:transparent;color:var(--paper);font:inherit;font-weight:600;cursor:pointer}



/* ---------- sohbet arası tanıtım ---------- */
.plug{
  display:flex;gap:14px;align-items:center;text-decoration:none;color:inherit;
  margin-top:22px;padding:16px 16px 16px 15px;border-radius:var(--r-lg);
  border:1px solid var(--line);border-left:2px solid var(--acc);
  background:linear-gradient(100deg, rgba(255,255,255,.045), rgba(21,27,44,.3));
  transition:.2s;
}
.plug:hover{border-color:var(--acc);transform:translateY(-1px)}
.plug .ic{flex:0 0 44px;height:44px;color:var(--acc)}
.plug .ic svg{width:44px;height:44px;stroke:var(--acc);fill:none;stroke-linecap:round;stroke-linejoin:round}
.plug .say{font-family:'Bodoni Moda',serif;font-size:16px;font-style:italic;line-height:1.35}
.plug .who{display:block;font-family:'Karla',sans-serif;font-style:normal;font-size:12px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--acc);font-weight:700;margin-top:6px}
.plug .go{margin-left:auto;color:var(--acc);font-size:19px;opacity:.75}

.plugrow{display:grid;gap:10px;margin-top:20px}
.plugrow .lead-in{font-family:'Bodoni Moda',serif;font-style:italic;font-size:15.5px;color:var(--paper-dim)}

.footlinks{margin-top:12px;display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.footlinks a{text-decoration:none;font-size:12.5px;font-weight:600;color:var(--paper-dim);border-bottom:1px solid transparent}
.footlinks a:hover{color:var(--paper);border-bottom-color:var(--line)}

/* ---------- element işareti ---------- */
.vicon{display:flex;justify-content:center;margin-bottom:2px}
.vicon svg{width:40px;height:40px;stroke:var(--acc);fill:none;stroke-linecap:round;stroke-linejoin:round;opacity:.95}
.card .elic{position:absolute;top:16px;right:16px;width:34px;height:34px;opacity:.45}
.card .elic svg{width:34px;height:34px;stroke:var(--acc);fill:none;stroke-linecap:round;stroke-linejoin:round}

/* ---------- takvim üçlemesi ---------- */
.triple{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:10px}
.tri{
  border:1px solid var(--line);border-radius:var(--r-md);padding:11px 13px;
  background:linear-gradient(180deg,rgba(30,38,59,.7),rgba(21,27,44,.45));
}
.tri .k{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--star);font-weight:600}
.tri .v{font-family:'Bodoni Moda',serif;font-size:17px;margin-top:3px;line-height:1.2}
.tri .s{font-size:12px;color:var(--paper-dim);margin-top:2px}

/* ---------- namaz vakitleri ---------- */
.prayer{
  margin-top:12px;border:1px solid var(--line);border-radius:var(--r-lg);
  background:rgba(21,27,44,.6);padding:16px;
}
.prayer .top{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.prayer .top .eyebrow{margin-bottom:2px}
.prayer .next{font-size:13.5px;color:var(--paper)}
.prayer .next b{color:#9FE3C4;font-weight:700}
.citysel{
  font:inherit;font-size:13px;font-weight:600;color:var(--paper);background:var(--ink-3);
  border:1px solid var(--line);border-radius:999px;padding:7px 12px;cursor:pointer;
}
.vakits{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
.vak{border:1px solid var(--line);border-radius:var(--r-sm);padding:9px 6px;text-align:center;background:rgba(14,18,32,.5)}
.vak.on{border-color:#5FBF97;background:rgba(95,191,151,.13)}
.vak .n{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--paper-dim);font-weight:600}
.vak .t{font-family:'Bodoni Moda',serif;font-size:18px;margin-top:2px}
.vak.on .n{color:#9FE3C4}

/* ---------- halk takvimi ---------- */
.evt{
  border:1px solid var(--line);border-left:3px solid var(--star);border-radius:var(--r-md);
  background:rgba(21,27,44,.55);padding:13px 15px;margin-bottom:9px;
}
.evt .d{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--star);font-weight:600}
.evt .t{font-family:'Bodoni Moda',serif;font-size:16.5px;margin-top:3px}
.evt p{font-size:13.5px;color:#C3CADB;margin:5px 0 0}
.evt.today{border-left-color:var(--flower);background:rgba(216,195,104,.09)}
.evt.today .d{color:var(--flower)}

.mini{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:10px}
.mini div{border:1px solid var(--line);border-radius:var(--r-sm);padding:9px 11px;font-size:13px}
.mini div b{display:block;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--star);font-weight:600;margin-bottom:2px}

.cell .hj{font-size:8.5px;color:var(--paper-dim);line-height:1;height:9px}

@media (min-width:760px){
  .triple{grid-template-columns:repeat(4,1fr)}
  .vakits{grid-template-columns:repeat(6,1fr)}
  .mini{grid-template-columns:repeat(4,1fr)}
}

@media (min-width:760px){
  :root{--maxw:960px}
  .facts{grid-template-columns:repeat(4,1fr)}
  .promos{grid-template-columns:repeat(3,1fr)}
  .promo{flex-direction:column;align-items:flex-start;text-align:left}
  .promo .go{margin-left:0}
  .hero2{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:center}
}

/* ---------- uygulama kartı ---------- */
.appcard{
  margin-top:22px;border:1px solid var(--line);border-radius:var(--r-lg);
  background:rgba(21,27,44,.55);padding:16px;
}
.appgrid{margin-top:10px;display:grid;gap:10px}
.approw{
  display:flex;align-items:center;gap:12px;justify-content:space-between;
  border:1px solid var(--line);border-radius:var(--r-md);padding:12px 13px;background:rgba(14,18,32,.45);
}
.approw .at{font-family:'Bodoni Moda',serif;font-size:16px}
.approw .ad{font-size:12.5px;color:var(--paper-dim);margin-top:2px;max-width:30ch}
.aset{display:flex;align-items:center;gap:7px}
.atime{
  font:inherit;font-size:13px;font-weight:600;color:var(--paper);background:var(--ink-3);
  border:1px solid var(--line);border-radius:9px;padding:7px 9px;
}
.abtn{
  font:inherit;font-size:13px;font-weight:700;cursor:pointer;white-space:nowrap;
  background:var(--paper);color:var(--ink);border:0;border-radius:999px;padding:9px 16px;
}
.abtn.off{background:transparent;color:var(--paper-dim);border:1px solid var(--line)}
.abtn:focus-visible{outline:2px solid var(--star);outline-offset:2px}

/* ---------- gökyüzü şeridi ---------- */
.sky{display:grid;gap:8px;margin-bottom:18px}
.skyitem{
  border:1px solid var(--line);border-radius:var(--r-md);padding:13px 15px;
  background:linear-gradient(140deg,rgba(30,38,59,.75),rgba(21,27,44,.4));
}
.skyitem .k{font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--star);font-weight:700}
.skyitem .v{font-family:'Bodoni Moda',serif;font-size:22px;margin-top:4px;display:flex;align-items:center;gap:8px}
.skyitem .gl{font-size:24px;color:var(--flower);line-height:1}
.skyitem .s{font-size:12.5px;color:var(--paper-dim);margin-top:3px}
.prog{height:3px;border-radius:2px;background:var(--line);margin-top:10px;overflow:hidden}
.prog span{display:block;height:100%;background:linear-gradient(90deg,var(--star),var(--flower));
  border-radius:2px;transition:width 1.2s cubic-bezier(.22,1,.36,1)}

/* ---------- iş satırları ---------- */
details.work{
  border:1px solid var(--line);border-left:3px solid var(--dc);border-radius:var(--r-md);
  background:rgba(21,27,44,.5);margin-bottom:8px;overflow:hidden;transition:.2s;
}
details.work[open]{background:rgba(30,38,59,.6)}
details.work summary{padding:13px 15px;cursor:pointer;list-style:none}
details.work summary::-webkit-details-marker{display:none}
.wl{display:flex;gap:11px;align-items:flex-start}
.wim{color:var(--dc);font-size:14px;line-height:1.5}
.wn{display:block;font-family:'Bodoni Moda',serif;font-size:17px;line-height:1.25}
.wd{display:block;font-size:13px;color:var(--paper-dim);margin-top:3px}
.wbody{padding:0 15px 15px 41px}
.src{
  display:inline-block;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;
  color:var(--sc);border:1px solid var(--sc);border-radius:999px;padding:3px 10px;opacity:.9;margin-bottom:9px;
}
.wbody p{font-size:13.5px;color:#C3CADB;margin:0}
.wbody .nx{margin-top:9px;color:var(--paper)}
.wbody .nx b{color:#5FBF97}

/* ---------- gezegen saatleri ---------- */
.hours{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.hr{
  border:1px solid var(--line);border-radius:var(--r-sm);padding:9px 4px;text-align:center;
  background:rgba(21,27,44,.45);transition:.2s;
}
.hr.gece{background:rgba(10,13,24,.6);border-color:#232C44}
.hr.on{border-color:var(--flower);background:rgba(216,195,104,.13);animation:breathe 3.2s ease-in-out infinite}
.hr .hg{display:block;font-size:17px;color:var(--star)}
.hr.on .hg{color:var(--flower)}
.hr .hn{display:block;font-size:11px;font-weight:600;margin-top:1px}
.hr .ht{display:block;font-size:11px;color:var(--paper-dim);font-variant-numeric:tabular-nums}
@keyframes breathe{0%,100%{box-shadow:0 0 0 0 rgba(216,195,104,0)}50%{box-shadow:0 0 16px 0 rgba(216,195,104,.28)}}

.limitcard{
  margin-top:24px;border:1px solid rgba(196,87,63,.4);border-radius:var(--r-lg);
  background:rgba(196,87,63,.08);padding:17px;
}
.limitcard h3{font-size:18px;margin-top:5px}
.limitcard p{font-size:13.5px;color:#C9CFDE;margin:8px 0 0}

@media (min-width:760px){
  .sky{grid-template-columns:repeat(3,1fr)}
  .hours{grid-template-columns:repeat(8,1fr)}
}

/* ============================================================
   HAREKET
   ============================================================ */

/* kadran: ibre dönerek gider */
#ptrG{transition:transform 1.4s cubic-bezier(.34,1.2,.42,1)}
svg.dial{--acc:#E8E3D6}

/* tik halkası ağır ağır döner */
#ticks{transform-origin:0 0;animation:spin 240s linear infinite}
@keyframes spin{to{transform:rotate(-360deg)}}

/* burç dilimleri sırayla açılır */
.arcin{animation:arcin .7s cubic-bezier(.22,1,.36,1) backwards}
@keyframes arcin{
  from{opacity:0;transform:scale(.9)}
  to{opacity:inherit;transform:none}
}
#arcs path{transform-origin:0 0;transition:opacity .6s ease}

/* ay: yavaş nefes alan hale */
#halo{animation:hale 7s ease-in-out infinite;transform-origin:0 0}
@keyframes hale{0%,100%{opacity:.75;transform:scale(1)}50%{opacity:1;transform:scale(1.09)}}
#moonpath{transition:d .8s ease}

/* yıldızlar kıpırdar */
body::before{animation:twinkle 9s ease-in-out infinite}
@keyframes twinkle{0%,100%{opacity:.42}50%{opacity:.62}}

/* hüküm kartı girişi */
.verdict{animation:riseIn .65s cubic-bezier(.22,1,.36,1) both}
.vicon svg{animation:iconIn .8s cubic-bezier(.34,1.3,.5,1) both .1s}
@keyframes riseIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes iconIn{from{opacity:0;transform:scale(.72) rotate(-8deg)}to{opacity:.95;transform:none}}

/* panel içi kartlar sırayla gelir */
section.panel.on > *{animation:riseIn .5s cubic-bezier(.22,1,.36,1) backwards}
section.panel.on > *:nth-child(1){animation-delay:.02s}
section.panel.on > *:nth-child(2){animation-delay:.07s}
section.panel.on > *:nth-child(3){animation-delay:.12s}
section.panel.on > *:nth-child(4){animation-delay:.17s}
section.panel.on > *:nth-child(5){animation-delay:.22s}
section.panel.on > *:nth-child(n+6){animation-delay:.26s}

/* 7 gün şeridi ve ay ızgarası */
.dayc{animation:riseIn .5s cubic-bezier(.22,1,.36,1) backwards}
.strip .dayc:nth-child(1){animation-delay:.04s}.strip .dayc:nth-child(2){animation-delay:.09s}
.strip .dayc:nth-child(3){animation-delay:.14s}.strip .dayc:nth-child(4){animation-delay:.19s}
.strip .dayc:nth-child(5){animation-delay:.24s}.strip .dayc:nth-child(6){animation-delay:.29s}
.strip .dayc:nth-child(7){animation-delay:.34s}
.dayc:active{transform:scale(.96)}
.cell{animation:cellIn .4s ease backwards}
@keyframes cellIn{from{opacity:0;transform:scale(.92)}to{opacity:1;transform:none}}
.cell:active{transform:scale(.94)}
.cell.now{animation:cellIn .4s ease backwards, nowPulse 3.5s ease-in-out infinite .5s}
@keyframes nowPulse{0%,100%{box-shadow:0 0 0 0 rgba(232,227,214,0)}50%{box-shadow:0 0 0 3px rgba(232,227,214,.10)}}

/* kaydırınca belirme */
.rv{opacity:0;transform:translateY(18px);transition:opacity .6s ease, transform .6s cubic-bezier(.22,1,.36,1)}
.rv.seen{opacity:1;transform:none}

/* dokunma geri bildirimi */
.tab{transition:background .18s, color .18s, border-color .18s, transform .12s}
.tab:active{transform:scale(.94)}
.abtn{transition:transform .12s, filter .18s}
.abtn:active{transform:scale(.95)}
.plug:active,.promo:active{transform:scale(.99)}
details.work summary{transition:background .18s}
details.work summary:active{background:rgba(255,255,255,.04)}

/* sayı akışı */
.vak .t,.hr .ht,.skyitem .v{font-variant-numeric:tabular-nums}
.vak.on{animation:breathe 3.2s ease-in-out infinite}

/* çekmece arka planı */
.sheet{will-change:transform}

/* hareket azaltma tercihi her şeyi bastırır */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .rv{opacity:1!important;transform:none!important}
}

/* ---------- paylaşım penceresi ---------- */
.share{
  border:1px solid var(--line);border-radius:var(--r-lg);padding:20px 18px;
  background:
    radial-gradient(120% 80% at 50% 0%, rgba(216,195,104,.13), transparent 62%),
    linear-gradient(180deg,rgba(30,38,59,.8),rgba(21,27,44,.5));
  position:relative;overflow:hidden;
}
.share::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(115deg,transparent 42%,rgba(255,255,255,.07) 50%,transparent 58%);
  transform:translateX(-120%);animation:sheen 6.5s ease-in-out infinite 1.2s;
}
@keyframes sheen{0%{transform:translateX(-120%)}55%,100%{transform:translateX(120%)}}
.stime{
  font-family:'Bodoni Moda',serif;font-size:clamp(34px,10vw,46px);line-height:1.05;
  letter-spacing:-.02em;margin-top:6px;color:var(--flower);font-variant-numeric:tabular-nums;
}
.stime span{font-size:.55em;opacity:.55;margin:0 .18em;vertical-align:.12em}
.snote{font-size:13px;color:var(--paper-dim);margin:6px 0 0}
.sreasons{margin-top:16px;display:grid;gap:9px}
.sr{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;color:#CFD5E4;line-height:1.45}
.sr b{color:var(--paper);font-weight:700}
.srb{
  flex:0 0 auto;font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;
  color:var(--sc);border:1px solid var(--sc);border-radius:999px;padding:3px 8px;margin-top:1px;opacity:.9;
}
.salt{margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.salt .k{font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--star);font-weight:700;margin-bottom:7px}
.sa{display:flex;gap:10px;align-items:baseline;font-size:13.5px;padding:4px 0}
.sa b{font-family:'Bodoni Moda',serif;font-size:16px;font-variant-numeric:tabular-nums;min-width:112px}
.sa span{color:var(--paper-dim);font-size:12.5px}