/* Atlas — otonomi sayfası · kök style.css değişkenleriyle; burada yalnız bu sayfanın parçaları */
:root{--ok:#0f766e}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--ok:#34d399}}
:root[data-theme="dark"]{--ok:#34d399}

main{counter-reset:sec}
.sec .idx.auto::before{counter-increment:sec;content:"§ " counter(sec,decimal-leading-zero)}
.hero .lead+.lead{margin-top:12px}
.nojs{border-left:2px solid var(--warn);padding-left:12px;margin-top:18px;color:var(--mut);font-size:.9375rem}
.stack{display:grid;gap:28px;min-width:0}
.stack>*{min-width:0}

/* damga: ölçümün tarihi ve saati */
.stamp{font:500 .6875rem/1.5 var(--mono);letter-spacing:.04em;text-transform:none;color:var(--mut);white-space:nowrap}
.stamp::before{content:"";display:inline-block;width:6px;height:6px;border:1px solid var(--warn);margin-right:6px;vertical-align:.04em}
.cell .stamp{display:block;margin-top:12px}

/* şekil altı: ne gösteriyor */
.what{color:var(--mut);font-size:.9375rem;line-height:1.6;margin-top:12px;max-width:44em}
.what b{font:500 .6875rem var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--fg);margin-right:8px}
.what .stamp{display:block;margin-top:6px}
.note{border-left:2px solid var(--warn);padding-left:12px;font-size:.9688rem;line-height:1.55;margin-top:14px;max-width:40em}
.fig{max-width:560px}
.fig svg{padding:14px 10px}

/* sayaçlar */
.meters{display:grid;gap:1px;background:var(--line);border:1px solid var(--line2)}
.meter{background:var(--surface);padding:20px 16px 22px;min-width:0;transition:background .15s}
.meter:hover{background:color-mix(in srgb,var(--surface) 92%,var(--acc))}
.mhead{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:6px 14px;margin-bottom:14px}
.mhead .idx{margin:0;color:var(--fg)}
.seg{display:flex;gap:2px;height:14px;margin-bottom:16px}
.seg i{display:block;flex:1 1 0;min-width:2px;background:var(--mut)}
.seg .c-ok,.bar .c-ok{background:var(--ok)}
.seg .c-acc{background:var(--acc)}
.seg .c-warn,.bar .c-warn{background:var(--warn)}
.seg .c-dim{background:var(--line2)}
.vals{display:flex;flex-wrap:wrap;gap:16px 24px}
.vals li{min-width:0}
.vals li::before{content:"";display:block;width:14px;height:3px;background:var(--mut);margin-bottom:8px}
.vals .k-ok::before{background:var(--ok)}
.vals .k-acc::before{background:var(--acc)}
.vals .k-warn::before{background:var(--warn)}
.vals .k-dim::before{background:var(--line2)}
.vals .k-fg::before{background:var(--fg)}
.vals b{display:block;font:400 clamp(1.9rem,8vw,2.6rem)/1 var(--serif);letter-spacing:-.02em}
.vals span span{display:inline;margin:0}
.vals>li>span{display:block;font:500 .6875rem/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--mut);margin-top:6px}
.vals+.vals{margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}
.vals.sm{gap:12px 18px;margin-bottom:6px}
.vals.sm b{font-size:clamp(1.3rem,5.5vw,1.7rem)}
.vals.sm b.yok{font-size:1rem;line-height:1.5;color:var(--mut)}
.note a{color:var(--fg);text-underline-offset:3px;white-space:nowrap}
.bar{height:8px;background:var(--line);margin:14px 0 6px}
.bar i{display:block;height:100%;width:0;min-width:1px;background:var(--acc)}
.barlab{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font:500 .6875rem/1.5 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--mut)}
.barlab b{color:var(--fg);font-weight:500}

/* ajan karneleri: iskelet sayfada, sayılar ve çizgi otonomi.js ile #olcum.ajanlar'dan */
.agents{display:grid;gap:12px;min-width:0}
.agent{border:1px solid var(--line2);border-top:2px solid var(--acc);background:var(--surface);padding:18px 16px 20px;min-width:0;transition:border-color .15s,background .15s}
.agent:hover{background:color-mix(in srgb,var(--surface) 92%,var(--acc))}
.agent .mhead{margin-bottom:8px;flex-wrap:nowrap}
.agent h3{font:400 1.5rem/1.1 var(--serif);letter-spacing:-.01em;margin:0;min-width:0;overflow-wrap:anywhere}
.agent .mhead .idx{color:var(--mut);white-space:nowrap}
.arole{color:var(--mut);font-size:.9375rem;line-height:1.5}
.abody{margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.ayok{font:500 .6875rem/1.5 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--mut)}
.agent.yok{border-style:dashed}
.agent.yok .ayok{color:var(--warn)}
.astat{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.astat li{min-width:0}
.astat b{display:block;font:400 1.375rem/1.1 var(--serif);letter-spacing:-.01em;overflow-wrap:anywhere}
.astat span{display:block;font:500 .625rem/1.4 var(--mono);letter-spacing:.05em;text-transform:uppercase;color:var(--mut);margin-top:5px;overflow-wrap:anywhere}
.spark{width:100%;height:auto;margin-top:14px;overflow:visible}
.spark path{fill:none;vector-effect:non-scaling-stroke}
.spark .sb{stroke:var(--line2);stroke-width:1;stroke-dasharray:2 3}
.spark .sa{fill:var(--fg);opacity:.06}
.spark .sg{stroke:var(--fg);stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round}
.spark .so{stroke:var(--ok);stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round}
.spark .sn{fill:var(--acc)}
.acap{display:flex;justify-content:space-between;gap:10px;font:500 .625rem/1.4 var(--mono);letter-spacing:.05em;text-transform:uppercase;color:var(--mut);margin-top:4px}
.aday{font-size:.9375rem;line-height:1.5;margin-top:12px}

/* yöntem kartları */
.cards{counter-reset:card}
.cards .cell .idx::before{counter-increment:card;content:counter(card,decimal-leading-zero) " · "}
.cards .cell p b{color:var(--fg);font-weight:500}
.retired{border:1px dashed var(--line2);background:var(--surface);padding:22px 18px 24px}
.retired p{color:var(--mut);font-size:.9688rem;max-width:40em}
.badge{display:inline-block;font:500 .6875rem var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--warn);border:1px solid var(--warn);padding:3px 9px;margin-bottom:14px;transform:rotate(-2deg)}

/* ajan ağı */
.p{fill:var(--fg)}
.p.b{fill:var(--mut)}
.p.g{fill:var(--ok)}
.p.r{fill:var(--warn)}
.p.n{fill:var(--bg);stroke:var(--mut);stroke-width:1.2}
.tally{display:flex;flex-wrap:wrap;gap:6px 18px;padding:10px 12px;border-top:1px solid var(--line);background:var(--surface);font:500 .6875rem/1.5 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--mut)}
.tally b{color:var(--fg);font-weight:500;display:inline-block;min-width:2ch;text-align:right}
.tally span::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:7px;vertical-align:-.02em}
.tally .tg::before{background:var(--ok)}
.tally .tr::before{background:var(--warn)}
.tally .tn::before{box-shadow:inset 0 0 0 1.2px var(--mut)}
.tally .tt::before{display:none}

/* emeklilik hunisi */
.src{fill:var(--fg)}
.rib{fill:var(--mut);opacity:.16}
.bin{fill:var(--mut)}
.flow{fill:none;stroke:var(--mut);stroke-width:1.4;stroke-linecap:round;stroke-dasharray:2 8}
.b-ok .rib,.b-ok .bin{fill:var(--ok)}.b-ok .flow{stroke:var(--ok)}
.b-warn .rib,.b-warn .bin{fill:var(--warn)}.b-warn .flow{stroke:var(--warn)}
.lab .num{font:500 13px var(--mono);fill:var(--fg)}
.etk rect{fill:var(--bg);stroke:var(--warn);stroke-width:1.2}
.etk text{fill:var(--fg)}

/* ablasyon */
.dot,.od{fill:var(--acc)}
.dbar{fill:var(--fg)}
.ybar{fill:var(--mut)}
.chk{fill:none;stroke:var(--ok);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;opacity:0}
.chk.on{opacity:1}
.gate.on{stroke:var(--ok)}

/* zaman çizgisi */
.tl{display:grid;gap:0}
.tl li{position:relative;padding:0 0 18px 22px;border-left:1px solid var(--line2)}
.tl li:last-child{padding-bottom:0}
.tl li::before{content:"";position:absolute;left:-5px;top:4px;width:9px;height:9px;background:var(--bg);border:1px solid var(--acc)}
.tl b{display:block;font:500 .75rem var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--warn)}
.tl span{color:var(--mut);font-size:.9688rem}

@media (min-width:600px){
  .cells.m3{grid-template-columns:1fr 1fr}
  .agents{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (min-width:760px){
  .meters{grid-template-columns:1fr 1fr}
  .meter{padding:26px 22px 28px}
  .meter.wide{grid-column:1/-1}
  .retired{padding:28px 26px 30px}
  .tl{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:26px 22px}
  .tl li{border-left:0;border-top:1px solid var(--line2);padding:18px 0 0}
  .tl li::before{left:0;top:-5px}
}
@media (min-width:1100px){
  .cells.m3{grid-template-columns:repeat(3,1fr)}
}

/* hareket: yalnız izin varsa; her hareket bir sayıya ya da akışa bağlı */
@media (prefers-reduced-motion:no-preference){
  .js .seg{clip-path:inset(0 100% 0 0)}
  .js .in .seg,.js .seg.in{clip-path:inset(0);transition:clip-path 1.1s cubic-bezier(.2,.7,.2,1)}
  .js .bar i{transform:scaleX(0);transform-origin:left}
  .js .in .bar i{transform:none;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
  .in .flow{animation:akis 1.1s linear infinite}
  .js .etk{opacity:0}
  .js .in .etk{opacity:1;animation:dus 2.6s cubic-bezier(.5,0,.9,.6) .8s backwards}
  .js .spark .sg,.js .spark .so{stroke-dasharray:1;stroke-dashoffset:1}
  .js .in .spark .sg,.js .in .spark .so{stroke-dashoffset:0;transition:stroke-dashoffset 1.2s cubic-bezier(.2,.7,.2,1)}
  .js .in .spark .so{transition-delay:.25s}
  .js .spark .sa,.js .spark .sn{opacity:0}
  .js .in .spark .sa{opacity:.06;transition:opacity .6s ease .9s}
  .js .in .spark .sn{opacity:1;transform-box:fill-box;transform-origin:center;animation:nabiz 2.4s ease-in-out 1.2s infinite;transition:opacity .2s linear 1.1s}
  .in .orb{transform-origin:210px 170px;animation:don 12s linear infinite}
  .in .st{animation:vur 12s linear infinite}
  .in .st.s2{animation-delay:3s}.in .st.s3{animation-delay:6s}.in .st.s4{animation-delay:9s}
}
@keyframes akis{to{stroke-dashoffset:-10}}
@keyframes dus{0%{transform:translateY(-386px);opacity:0}12%{opacity:1}100%{transform:none;opacity:1}}
@keyframes don{to{transform:rotate(360deg)}}
@keyframes nabiz{0%,100%{transform:scale(1)}50%{transform:scale(1.6)}}
@keyframes vur{0%{stroke-width:6}9%,100%{stroke-width:1.5}}
@media (prefers-reduced-motion:reduce){
  .flow,.etk,.orb,.st,.seg,.bar i,.spark path,.spark circle{animation:none!important;transition:none!important}
}