/* v2026.10-zzh · rank (site yeniden tasarımı) · Sıralamalar (#puan) ve Karşılaştır (#karsilastir) · şartname §4c, §3.2
   Podyum (2-1-3, kokart, engel sırığı tabanı), kafa kafaya, içgörü çip şeridi, tek satır gösterge açıklaması, 52 px satır,
   başa baş işareti, takip edilen satır; Karşılaştır boş durum (iki dik mani), skor tahtası, yan yana çubuklar.
   Hareket yalnız transform/opacity, `animation … backwards` (MOV görünür olunca oynatır); hareketi azalt: son hâl taban stil. */

/* ---------------------------------------------------------------- sayfa i'si (açıklama penceresi içeriği) */
.pu-pg .phead > .sub,.cmp-pg .phead > .sub{display:none}
.ph-info .sub > p{margin:0 0 14px}
.ph-info .ph-dl{display:grid;gap:10px;margin:0 0 16px;padding:12px 14px;border-radius:14px;background:var(--surface-2);box-shadow:inset 0 0 0 .5px var(--line)}
.ph-info .ph-dl div{min-width:0}
.ph-info .ph-dl dt{font-size:13px;font-weight:700;color:var(--ink);line-height:1.35}
.ph-info .ph-dl dt:first-letter{text-transform:uppercase}
.ph-info .ph-dl dd{margin:2px 0 0;font-size:13.5px;line-height:1.5;color:var(--muted)}
.ph-info .ph-dl .ak-dc{vertical-align:1px}
.ph-info .ph-xl{display:flex;flex-direction:column;margin:0 0 16px}
.ph-info .ph-xl-t{font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:2px 0 4px}
.ph-md .ph-info .sub .ph-xr,.ph-info .sub .ph-xr{display:flex;align-items:center;gap:12px;min-height:48px;width:100%;padding:0 4px;border:0;border-bottom:.5px solid var(--line);border-radius:0;background:none;text-align:left;font:600 15px/1.25 var(--f-body);color:var(--ink);cursor:pointer}
.ph-info .ph-xr:hover{background:var(--hover)}
.ph-info .ph-xr > i{flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--xt,var(--accent)) 15%,var(--surface));color:var(--xt,var(--accent));font:italic 800 13px/1 Georgia,"Times New Roman",serif}
.ph-info .ph-xr > span{flex:1;min-width:0}
.ph-info .ph-xr > em{font-style:normal;color:var(--muted);transition:transform .2s var(--spring)}
.ph-info .ph-xr:hover > em{transform:translateX(2px)}
.ph-md .ph-info .sub .ph-go,.ph-info .sub .ph-go{display:inline-flex;align-items:center;gap:6px;min-height:44px;margin-top:4px;padding:0;font-weight:650;color:var(--accent-ink)}

/* ---------------------------------------------------------------- gösterge açıklaması (tek satır, 28 px) */
.ak-key{position:relative;display:flex;align-items:center;gap:14px;height:28px;margin:0 0 8px;padding:0 2px;font-size:12px;color:var(--muted);white-space:nowrap;overflow-x:auto;overflow-y:hidden;scrollbar-width:none}
.ak-key::-webkit-scrollbar{display:none}
.ak-k{display:inline-flex;align-items:center;gap:6px;flex:none}
.ak-k .ak-g{width:22px;height:6px}
.ak-k .ak-spk{width:26px;height:11px}
.ak-k .ak-dc.lo{height:18px;font-size:11px}
.ak-k.tie{color:var(--ink-2)}
.ak-k .sd{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--c,var(--accent))}
.ak-k .sd + .sd{margin-left:-4px}
.ak-k .lead{font-size:12px;font-weight:650;color:var(--accent-ink)}
.ak-kh{position:sticky;right:0;margin-left:auto;flex:none;display:inline-flex;align-items:center;gap:4px;height:28px;padding:0 2px 0 18px;border:0;background:linear-gradient(90deg,transparent,var(--bg) 16px);color:var(--accent-ink);font:650 12.5px var(--f-body);cursor:pointer}
.ak-kh::after{content:"";position:absolute;inset:-8px -4px -8px 8px}
.ak-kh i{font-style:normal;transition:transform .2s var(--spring)}
.ak-kh:hover i{transform:translateX(2px)}

/* ---------------------------------------------------------------- Sıralamalar */
.rk-mrow{display:none}
.rk-col{min-width:0}
@media (min-width:681px){.rk-col{max-width:960px}}

/* kokart (yalnız 1.–3.; gerçek derece rengi) */
.rk-ko{--mc:var(--gold);position:relative;display:inline-grid;place-items:center;flex:none;width:22px;height:27px}
.rk-ko.m2{--mc:var(--silver)}.rk-ko.m3{--mc:var(--bronze)}
.rk-ko svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.rk-ko .rb{fill:color-mix(in srgb,var(--mc) 74%,#000)}
.rk-ko .pl{fill:var(--mc);stroke:color-mix(in srgb,var(--mc) 55%,#fff);stroke-width:2.2;stroke-dasharray:1.4 1.25}
.rk-ko .ct{fill:color-mix(in srgb,var(--mc) 32%,#fff)}
.rk-ko > b,.rk-ko > .rkn{position:relative;top:-3.6px;font:800 10.5px/1 var(--f-round);color:#1D2230!important;letter-spacing:-.02em;text-align:center}

/* podyum: 2-1-3, taban engel sırığı */
.rk-pod{--pd:0ms;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:end;gap:16px;margin:2px 0 14px;padding:22px 24px 0;border-radius:var(--r);background:var(--surface);box-shadow:var(--sh);overflow:hidden;isolation:isolate}
.rk-pod::before{content:"";position:absolute;inset:auto 0 0;height:1px;background:var(--line)}
.rk-pc{--sh-h:24px;display:flex;flex-direction:column;align-items:center;gap:4px;min-width:0;padding:0;border:0;background:none;color:inherit;font:inherit;text-align:center;cursor:pointer;animation:rkUp .56s var(--spring) backwards;animation-delay:var(--pd)}
.rk-pc.p1{order:2;--pd:240ms;--sh-h:56px}
.rk-pc.p2{order:1;--pd:120ms;--sh-h:38px}
.rk-pc.p3{order:3;--pd:0ms;--sh-h:24px}
.rk-pa{position:relative;display:inline-grid;margin:6px 0 2px}
.rk-pa .av{width:56px;height:56px;font-size:19px}
.rk-pa .av svg{width:26px;height:26px}
.rk-pc.p1 .rk-pa .av{width:64px;height:64px;font-size:22px}
.rk-pa .rk-ko{position:absolute;right:-13px;top:-9px;width:26px;height:32px;transform-origin:50% 6%;animation:rkKo .8s var(--spring) backwards;animation-delay:calc(var(--pd) + 420ms)}
.rk-pa .rk-ko > b{font-size:12px;top:-4.3px}
.rk-pn{max-width:100%;font-size:14.5px;font-weight:650;line-height:1.25;letter-spacing:-.015em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere;min-height:2.5em}
.rk-pv{display:inline-flex;align-items:baseline;gap:4px;font:650 30px/1.05 var(--f-round);letter-spacing:-.03em;font-variant-numeric:tabular-nums;color:var(--ink)}
.rk-pc.p1 .rk-pv{font-size:36px}
.rk-pv small{font:600 12px var(--f-body);letter-spacing:0;color:var(--muted)}
.rk-pv .od{animation:odo .9s cubic-bezier(.16,1,.3,1) backwards;animation-delay:calc(var(--pd) + 200ms + var(--k,0) * 40ms)}
.rk-pg{font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.rk-pg b{font-weight:700;color:var(--ink-2);font-variant-numeric:tabular-nums}
.rk-ps{position:relative;align-self:stretch;height:var(--sh-h);margin-top:8px;border-radius:12px 12px 0 0;background:color-mix(in srgb,var(--c) 9%,var(--surface-2))}
.rk-ps .pole{position:absolute;left:-4px;right:-4px;top:0;height:8px;border-radius:4px;background:repeating-linear-gradient(90deg,var(--c) 0 14px,color-mix(in srgb,var(--c) 30%,var(--surface)) 14px 28px);box-shadow:0 1px 0 color-mix(in srgb,var(--c) 40%,transparent);transform-origin:center;animation:rkPole .6s var(--spring) backwards;animation-delay:calc(var(--pd) + 160ms)}
.rk-pc:hover .rk-pn{color:var(--accent-ink)}
.rk-pc:focus-visible{outline:2.5px solid var(--accent);outline-offset:3px;border-radius:14px}
@media (hover:hover){.rk-pc:hover .rk-pa .rk-ko{animation:rkWob .6s var(--spring)}}
.rk-pod.still .rk-pc,.rk-pod.still .rk-ko,.rk-pod.still .pole,.rk-pod.still .od{animation:none}

/* kafa kafaya */
.rk-h2h{display:flex;align-items:center;gap:12px;min-height:60px;margin:0 0 10px;padding:8px 8px 8px 12px;border-radius:16px;background:var(--surface);box-shadow:var(--sh);animation:rkIn .45s var(--spring) .32s backwards}
.rk-h2a{display:flex;flex:none}
.rk-h2a .av{width:34px;height:34px;font-size:12px;box-shadow:0 0 0 2px var(--surface)}
.rk-h2a .av + .av{margin-left:-6px}                 /* öndeki avatarın halkası arkadakinin baş harfini örtmez */
.rk-h2t{display:flex;flex-direction:column;gap:1px;min-width:0;flex:1}
.rk-h2l{font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:color-mix(in srgb,var(--c) 72%,var(--ink))}
.rk-h2r{display:flex;align-items:baseline;gap:3px;font:700 15px/1.2 var(--f-round);font-variant-numeric:tabular-nums;color:var(--ink)}
.rk-h2r > i{font-style:normal;color:var(--faint);font-weight:500}
.rk-h2v{margin-left:8px;font-weight:500;color:var(--ink-2)}
.rk-h2v b{font-weight:700}
.rk-h2v small{font:600 11.5px var(--f-body);color:var(--muted)}
.rk-h2n{display:flex;gap:5px;min-width:0;font-size:12.5px;color:var(--muted);white-space:nowrap}
.rk-h2n span{min-width:0;overflow:hidden;text-overflow:ellipsis}
.rk-h2n span:first-child{flex:0 1 auto}
.rk-h2n i{font-style:normal;flex:none}
.rk-h2b{flex:none;display:inline-flex;align-items:center;gap:6px;height:44px;padding:0 14px;border:0;border-radius:12px;background:var(--accent-soft);color:var(--accent-ink);font-size:13.5px;font-weight:650;box-shadow:none}
.rk-h2b i{font-style:normal;transition:transform .2s var(--spring)}
.rk-h2b:hover{background:color-mix(in srgb,var(--accent) 16%,var(--surface))}
.rk-h2b:hover i{transform:translateX(2px)}

/* içgörü çipleri (56 px, yatay şerit) */
.rk-ins{display:flex;gap:8px;margin:0 0 6px;padding:2px 2px 6px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;scrollbar-width:none}
.rk-ins::-webkit-scrollbar{display:none}
.rk-ic{flex:none;scroll-snap-align:start;display:flex;flex-direction:column;justify-content:center;gap:3px;height:56px;max-width:300px;padding:0 14px;border:0;border-radius:14px;background:var(--surface);box-shadow:var(--sh);color:inherit;font:inherit;text-align:left;animation:rkIn .42s var(--spring) backwards;animation-delay:calc(var(--i,0) * 70ms + 380ms)}
.rk-ic.go{cursor:pointer}
.rk-ic.go:hover{box-shadow:var(--sh),0 0 0 1.5px color-mix(in srgb,var(--accent) 40%,transparent)}
.rk-icl{font-size:11.5px;font-weight:600;color:var(--muted);white-space:nowrap}
.rk-icv{display:flex;align-items:baseline;gap:4px;white-space:nowrap;min-width:0}
.rk-icv > b{font:650 18px/1.1 var(--f-round);letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--ink)}
.rk-icv > small{font:600 11.5px var(--f-body);color:var(--muted)}
.rk-ict{margin-left:4px;font-size:12.5px;color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;min-width:0}

/* liste */
.pu-pg .rkrow,.pu-pg .rkhead{grid-template-columns:44px 36px minmax(0,1fr) 92px 72px 76px 118px}
.pu-pg .rklist.wx .rkrow,.pu-pg .rklist.wx .rkhead{grid-template-columns:44px 36px minmax(0,1fr) 92px 72px 76px 150px}
.pu-pg .rkhead > span{white-space:normal;line-height:1.2;overflow-wrap:anywhere}
.pu-pg .rkrow{min-height:52px;padding-top:7px;padding-bottom:7px;animation:rkIn .32s var(--spring) backwards;animation-delay:calc(var(--i,0) * 30ms)}
.pu-pg .rkrow + .rkrow::before{left:120px}
.pu-pg .rkrow .av{width:36px;height:36px;font-size:13px}
.pu-pg .rkrow .av svg{width:18px;height:18px}
.pu-pg .rkv .rkb i,.pu-pg .rkv .ak-db i{animation-delay:calc(var(--i,0) * 40ms + 120ms)}
.rkk{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-width:0}
.rkk .rkn{font-size:16px;font-weight:750;font-variant-numeric:tabular-nums}
.rkk .rk-ko .rkn{font-size:10.5px}
.rk-tw{display:inline-grid;place-items:center;height:9px;color:var(--accent);line-height:0}
.rk-tie{width:12px;height:8px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.ak-k .rk-tie{width:14px;height:9px;color:var(--accent)}
.rk-avw{position:relative;display:inline-grid;line-height:0}
.rk-fw{position:absolute;right:-4px;bottom:-3px;display:grid;place-items:center;width:16px;height:16px;border-radius:50%;background:var(--accent);color:var(--on-accent);font:normal 700 9.5px/1 var(--f-body);box-shadow:0 0 0 2px var(--surface)}
.rkrow.fw{background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 7%,transparent),transparent 60%)}
.rkg{font:600 12.5px var(--f-round);color:var(--muted);text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.rkrow.tie .rkg{color:var(--accent-ink)}
.rkhead .rkg{display:block;text-align:right;font:600 12px var(--f-body)}
.rk-more{display:flex;align-items:center;justify-content:center;gap:12px;padding:12px 16px 4px}
.rk-more .btn{min-height:44px;padding:0 20px;font-weight:650}
.rk-mn{font-size:12.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.rk-mn b{color:var(--ink-2);font-weight:650}
/* takip edilen satır: liste görünürken altta yapışkan */
.rk-fwp{position:sticky;bottom:16px;z-index:6;display:flex;align-items:center;gap:8px;min-height:44px;margin:10px 12px 0;padding:0 14px;border-radius:14px;cursor:pointer;
  background:color-mix(in srgb,var(--surface) 90%,transparent);-webkit-backdrop-filter:blur(16px) saturate(1.5);backdrop-filter:blur(16px) saturate(1.5);
  box-shadow:0 10px 26px -14px rgba(12,18,32,.4),inset 0 0 0 1.5px color-mix(in srgb,var(--accent) 38%,transparent);animation:rkIn .4s var(--spring) .6s backwards}
.rk-fwp > em{font-style:normal;color:var(--accent)}
.rk-fwr{font:750 14px var(--f-round);font-variant-numeric:tabular-nums;color:var(--accent-ink)}
.rk-fwn{flex:1;min-width:0;font-size:14px;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rk-fwx{flex:none;font-size:11.5px;font-weight:650;color:var(--muted);background:var(--fill);border-radius:999px;padding:2px 7px}
.rk-fwp > b{font:650 15px var(--f-round);font-variant-numeric:tabular-nums}
.rk-fwp > i{font-style:normal;font-size:11px;color:var(--muted)}
.rk-fwp:focus-visible{outline:2.5px solid var(--accent);outline-offset:2px}

/* ---------------------------------------------------------------- Karşılaştır */
.cmp-pg .xbar{align-items:center}
.cmp-pg .ak-ent{margin:6px 0 12px}
/* boş durum */
.cmp-hero{display:flex;flex-direction:column;align-items:center;gap:10px;margin:2px 0 22px;padding:16px 18px 20px;border-radius:24px;background:var(--surface);box-shadow:var(--sh);text-align:center}
.cmp-il{display:block;width:100%;max-width:280px;height:120px;overflow:visible}
.cmp-il .gl{stroke:var(--line-strong);stroke-width:1.2;fill:none}
.cmp-il .gt{stroke:var(--line-strong);stroke-width:1;fill:none;transform-box:fill-box;transform-origin:left;animation:rkPole .7s var(--spring) backwards}
.cmp-il .st{fill:color-mix(in srgb,var(--ink) 26%,var(--surface));transform-box:fill-box;transform-origin:50% 100%;animation:cmpRise .52s var(--spring) backwards;animation-delay:calc(var(--d) + 80ms)}
.cmp-il .ft{stroke:color-mix(in srgb,var(--ink) 26%,var(--surface));stroke-width:2.5;stroke-linecap:round;fill:none}
.cmp-il .pb{stroke:var(--c);stroke-width:6.5;stroke-linecap:round;fill:none}
.cmp-il .ps{stroke:color-mix(in srgb,var(--c) 28%,var(--surface));stroke-width:6.5;stroke-dasharray:9 9;stroke-dashoffset:-9;fill:none}
.cmp-il .pl{animation:cmpDrop .5s var(--bounce) backwards;animation-delay:calc(var(--d) + 420ms + var(--k) * 110ms)}
.cmp-ht{margin:0;font:750 22px/1.15 var(--f-display);letter-spacing:-.02em}
.cmp-hero .cmp-s{width:100%;max-width:440px;margin-top:4px}
.cmp-hero .cmp-s input{height:44px;font-size:16px}
.cmp-hero #cmpsug{justify-content:center}
.cmp-blk{margin:0 0 20px}
.cmp-h{margin:0 0 10px;font:750 18px/1.2 var(--f-display);letter-spacing:-.02em}
.cmp-pres{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}
.cmp-pre{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"l l" "a n" "g g";align-items:center;gap:8px 12px;min-height:44px;padding:14px 16px;border:0;border-radius:18px;background:var(--surface);box-shadow:var(--sh);color:inherit;font:inherit;text-align:left;cursor:pointer;animation:rkIn .42s var(--spring) backwards;animation-delay:calc(var(--i,0) * 70ms + 300ms)}
.cmp-pre:hover{box-shadow:var(--sh),0 0 0 1.5px color-mix(in srgb,var(--accent) 38%,transparent)}
.cmp-pl{grid-area:l;font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.cmp-pa{grid-area:a;display:flex}
.cmp-pa > span{display:inline-grid;border-radius:50%;box-shadow:0 0 0 2px var(--surface),0 0 0 4px var(--c)}
.cmp-pa > span + span{margin-left:-6px}
.cmp-pa .av{width:38px;height:38px;font-size:13px}
.cmp-pn{grid-area:n;display:flex;flex-direction:column;min-width:0;line-height:1.3}
.cmp-pn b{font-size:14px;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cmp-pgo{grid-area:g;display:flex;align-items:center;gap:6px;color:var(--accent-ink);font-size:13.5px;font-weight:650}
.cmp-pgo i{font-style:normal;transition:transform .2s var(--spring)}
.cmp-pre:hover .cmp-pgo i{transform:translateX(2px)}
.cmp-qc{display:flex;flex-wrap:wrap;gap:8px}
.cmp-qa{position:relative;display:inline-flex;align-items:center;gap:6px;max-width:100%;height:40px;padding:0 12px;border:0;border-radius:12px;background:var(--surface);box-shadow:var(--sh);color:var(--ink);font:600 13.5px var(--f-body);cursor:pointer;animation:rkPop .3s var(--bounce) backwards;animation-delay:calc(var(--i,0) * 40ms + 420ms)}
.cmp-qa::after{content:"";position:absolute;inset:-2px}
.cmp-qa:hover{box-shadow:var(--sh),0 0 0 1.5px color-mix(in srgb,var(--accent) 38%,transparent)}
.cmp-qr{font:650 12px var(--f-round);color:var(--muted);font-variant-numeric:tabular-nums}
.cmp-qn{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cmp-qa > i{font-style:normal;font-weight:800;color:var(--accent);font-size:15px}
/* skor tahtası */
.cmp-sb{margin:2px 0 12px;padding:14px 16px;border-radius:20px;background:var(--surface);box-shadow:var(--sh)}
.cmp-sb.two{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:12px}
.cmp-sbp{display:flex;flex-direction:column;align-items:center;gap:6px;min-width:0;text-align:center}
.cmp-sbp .av{width:44px;height:44px;font-size:15px;box-shadow:0 0 0 2.5px var(--surface),0 0 0 4.5px var(--c)}
.cmp-sbp > b{max-width:100%;font-size:13px;font-weight:600;line-height:1.25;color:var(--ink-2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cmp-sbp.ld > b{font-weight:750;color:var(--ink)}
.cmp-sbs{display:flex;flex-direction:column;align-items:center;gap:6px}
.cmp-sbk{display:flex;align-items:center;gap:10px;font:800 40px/1 var(--f-round);letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.cmp-sbk b{color:var(--ink-2);animation:rkPop .4s var(--bounce) backwards}
.cmp-sbk b + i + b{animation-delay:.08s}
.cmp-sbk b.ld{color:var(--accent-ink)}
.cmp-sbk i{font-style:normal;font-weight:500;color:var(--faint)}
.cmp-sbl{font-size:11.5px;font-weight:600;color:var(--muted);white-space:nowrap}
.cmp-sb.wait .cmp-sbk b{color:var(--faint);animation:none}
.cmp-sbm{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.cmp-sbr{display:grid;grid-template-columns:minmax(0,40%) minmax(30px,1fr) auto;align-items:center;gap:10px}
.cmp-sbr .sd{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--c);margin-right:6px}
.cmp-sbn{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13.5px;font-weight:600}
.cmp-sbr > .sd{display:none}
.cmp-sbt{position:relative;height:10px;border-radius:999px;background:var(--ak-trk)}
.cmp-sbt i{position:absolute;left:0;top:0;bottom:0;width:calc(var(--v) * 100%);border-radius:inherit;background:color-mix(in srgb,var(--c) 45%,var(--surface));transform-origin:left;animation:barX .72s var(--spring) backwards;animation-delay:calc(var(--i,0) * 60ms)}
.cmp-sbr.ld .cmp-sbt i{background:var(--c)}
.cmp-sbr > b{font:800 22px/1 var(--f-round);font-variant-numeric:tabular-nums;color:var(--ink-2)}
.cmp-sbr.ld > b{color:var(--accent-ink)}
/* kariyer: ölçü başına yan yana çubuklar */
.cmp-duel{padding:4px 18px 8px}
.cmp-dh{display:flex;justify-content:space-between;gap:12px;padding:10px 0 8px;border-bottom:.5px solid var(--line);font-size:12px;font-weight:650;color:var(--ink-2)}
.cmp-dh span{display:flex;align-items:center;gap:6px;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cmp-dh .sd,.cmp-dnn .sd{flex:none;width:8px;height:8px;border-radius:50%;background:var(--c)}
.cmp-drs{display:grid;grid-template-columns:minmax(0,1fr)}
@media (min-width:900px){.cmp-duel.two .cmp-drs{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:36px}}
.cmp-dr{padding:12px 0;border-bottom:.5px solid var(--line);min-width:0}
.cmp-dr:last-child{border-bottom:0}
@media (min-width:900px){.cmp-duel.two .cmp-dr:nth-last-child(2){border-bottom:0}}
.cmp-d1{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:10px}
.cmp-dr .cmp-dl{display:flex;align-items:center;justify-content:center;gap:4px;min-width:0;font-size:13px;font-weight:650;color:var(--ink);text-align:center}
.cmp-dr .cmp-dl .nm{white-space:nowrap}
.cmp-dv{display:flex;align-items:center;gap:6px;min-width:0}
.cmp-dv.b{justify-content:flex-end}
.cmp-dv b{font:650 17px/1 var(--f-round);letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--ink-2)}
.cmp-dv.ld b{color:var(--ink);font-weight:750}
.cmp-duel .lead{flex:none;padding:2px 7px;border-radius:999px;background:var(--accent-soft);color:var(--accent-ink);font-size:11px;font-weight:700;animation:rkPop .32s var(--bounce) backwards;animation-delay:calc(var(--i,0) * 60ms + 620ms)}
.cmp-dt{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:4px;height:10px;margin:8px 0 0}
.cmp-dt::after{content:"";position:absolute;left:50%;top:-4px;bottom:-4px;width:2px;margin-left:-1px;border-radius:1px;background:var(--ak-tick)}
.cmp-dt .h{position:relative;background:var(--ak-trk)}
.cmp-dt .h.a{border-radius:999px 0 0 999px}
.cmp-dt .h.b{border-radius:0 999px 999px 0}
.cmp-dt .h i{position:absolute;top:0;bottom:0;width:calc(var(--v) * 100%);background:color-mix(in srgb,var(--c) 38%,var(--surface));animation:barX .72s var(--spring) backwards;animation-delay:calc(var(--i,0) * 60ms + 120ms)}
.cmp-dt .h.a i{right:0;transform-origin:right;border-radius:999px 0 0 999px}
.cmp-dt .h.b i{left:0;transform-origin:left;border-radius:0 999px 999px 0}
.cmp-dt .h.ld i{background:var(--c)}
.cmp-d2{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:6px;font-size:12px;color:var(--muted)}
.cmp-d2 .cmp-ds{min-width:0}
.cmp-d2 .medals{flex-wrap:wrap}
.cmp-dm{display:block;margin-top:5px;text-align:center;font-size:11.5px;color:var(--muted)}
.cmp-dr.n .cmp-dl{justify-content:flex-start;text-align:left;margin-bottom:2px}
.cmp-dr.n .cmp-dm{display:inline;margin:0 0 0 6px;font-weight:500;text-align:left}
.cmp-dn{display:grid;grid-template-columns:minmax(0,34%) minmax(30px,1fr) auto;grid-template-areas:"n t v" "s s s";align-items:center;column-gap:10px;row-gap:2px;margin-top:6px}
.cmp-dnn{grid-area:n;display:flex;align-items:center;gap:6px;min-width:0;font-size:12.5px;color:var(--ink-2)}
.cmp-dnn > span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cmp-dnt{grid-area:t;position:relative;height:8px;border-radius:999px;background:var(--ak-trk)}
.cmp-dnt i{position:absolute;left:0;top:0;bottom:0;width:calc(var(--v) * 100%);border-radius:inherit;background:color-mix(in srgb,var(--c) 38%,var(--surface));transform-origin:left;animation:barX .72s var(--spring) backwards;animation-delay:calc(var(--i,0) * 50ms + var(--j,0) * 40ms)}
.cmp-dn.ld .cmp-dnt i{background:var(--c)}
.cmp-dnv{grid-area:v;display:flex;align-items:center;gap:6px}
.cmp-dnv b{font:650 15px/1 var(--f-round);font-variant-numeric:tabular-nums;color:var(--ink-2)}
.cmp-dn.ld .cmp-dnv b{color:var(--ink);font-weight:750}
.cmp-dns{grid-area:s;font-size:12px;color:var(--muted)}
.cmp-pg .ak-sec > .card.cmp-duel{margin-top:0}

/* ---------------------------------------------------------------- telefon */
@media (max-width:680px){
  .rk-mrow{display:flex;align-items:center;gap:8px;margin:0 0 10px;min-width:0}
  .rk-mrow .pu-ms{display:block;order:0;flex:0 1 auto;min-width:0;max-width:none;margin:0}
  .rk-mrow .pu-ms .msc-l{height:40px}
  .rk-mrow .pu-yr{order:0;margin:0}
  .rk-mrow .pu-ms + .xi{order:0;margin:0}
  .rk-pod{gap:8px;margin:0 0 10px;padding:12px 10px 0;border-radius:20px}
  .rk-pc{gap:2px}
  .rk-pc.p1{--sh-h:58px}.rk-pc.p2{--sh-h:34px}.rk-pc.p3{--sh-h:20px}   /* üçüncü basamak sırığın altında da görünür */
  .rk-pa{margin:4px 0 2px}
  .rk-pa .av,.rk-pc.p1 .rk-pa .av{width:44px;height:44px;font-size:15px}
  .rk-pa .av svg{width:22px;height:22px}
  .rk-pa .rk-ko{right:-11px;top:-7px;width:22px;height:27px}
  .rk-pa .rk-ko > b{font-size:10.5px;top:-3.6px}
  .rk-pn{font-size:12.5px}
  .rk-pv,.rk-pc.p1 .rk-pv{font-size:22px}
  .rk-pv small{font-size:10.5px}
  .rk-pg{font-size:11.5px}
  .rk-pc.p1 .rk-pg{display:none}
  .rk-ps{margin-top:6px;border-radius:10px 10px 0 0}
  .rk-ps .pole{height:6px;left:-3px;right:-3px;background:repeating-linear-gradient(90deg,var(--c) 0 10px,color-mix(in srgb,var(--c) 30%,var(--surface)) 10px 20px)}
  .rk-h2h{min-height:56px;padding:6px 6px 6px 10px;gap:10px}
  .rk-h2b{padding:0 12px}
  .rk-ins{margin:0 -16px 4px;padding:2px 16px 6px;scroll-padding:0 16px}
  .ak-key{margin:0 -16px 6px;padding:0 16px}
  .ak-k.dk{display:none}
  .ak-kh{right:-16px;padding-right:16px}
  .pu-pg .rkrow,.pu-pg .rklist.wx .rkrow,.pu-pg .rkhead,.pu-pg .rklist.wx .rkhead{grid-template-columns:30px 36px minmax(0,1fr) auto;gap:10px;padding:7px 14px}
  .pu-pg .rkrow .rks,.pu-pg .rkrow .rkc,.pu-pg .rkrow .rkg{display:none}
  .pu-pg .rkhead{display:none}
  .pu-pg .rkrow + .rkrow::before{left:100px}
  .pu-pg .rklist.haspod .rkrow.pd{display:none}
  .pu-pg .rklist.haspod .rkrow.pd + .rkrow:not(.pd)::before{display:none}
  .pu-pg .rklist .card-h{padding-bottom:6px}
  .rkk .rkn{font-size:15px}
  .rk-fwp{bottom:8px;margin:10px 8px 0}   /* #main'in alt dolgusu (sekme çubuğu payı) yapışkan alanın dışında */
  .rk-more{flex-direction:column;gap:6px}
  /* Karşılaştır */
  .cmp-pg .xbar{flex-wrap:wrap}
  .cmp-pg .xbar .xsearch{flex:1 1 100%;max-width:none!important;order:-1}
  .cmp-hero{gap:8px;padding:10px 14px 14px;margin-bottom:16px}
  .cmp-il{height:100px}
  .cmp-ht{font-size:20px}
  .cmp-blk{margin-bottom:16px}
  .cmp-h{margin-bottom:8px}
  .cmp-qc{display:grid;grid-template-rows:repeat(2,40px);grid-auto-flow:column;grid-auto-columns:max-content;gap:8px;margin:0 -16px;padding:2px 16px 6px;overflow-x:auto;scrollbar-width:none}
  .cmp-qc::-webkit-scrollbar{display:none}
  .cmp-qa{max-width:210px}
  .cmp-pres{display:flex;gap:10px;margin:0 -16px;padding:2px 16px 6px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 16px;scrollbar-width:none}
  .cmp-pres::-webkit-scrollbar{display:none}
  .cmp-pre{flex:0 0 78%;scroll-snap-align:start}
  .cmp-pres .cmp-pre:only-child{flex-basis:100%}
  .cmp-duel{padding:2px 14px 6px}
  .cmp-sb{padding:12px 12px}
  .cmp-sbk{font-size:40px}
  /* P1-8: engel atlama kartlarında ad, çubuk ve değer tek satırda (etiket satırın üstünde kalmaz) */
  .cmp-pg #cmpAn .ak-mg .ak-row{grid-template-columns:minmax(0,32%) minmax(28px,1fr) auto;grid-template-areas:"l t v" "s s s";column-gap:10px;row-gap:3px;align-items:center}
  .cmp-pg #cmpAn .ak-mg .ak-row .ak-l{font-size:12.5px;gap:5px}
  .cmp-pg #cmpAn .ak-mg .ak-row .ak-v{gap:4px}
  .cmp-pg #cmpAn .ak-mg .ak-row .ak-v b{font-size:15px}
  .cmp-pg #cmpAn .ak-mg .ak-row .ak-dc{height:20px;padding:0 6px;font-size:11px}
  .cmp-pg #cmpAn .ak-mg .ak-row .lead{padding:2px 6px;border-radius:999px;background:var(--accent-soft);font-size:10.5px}
  .cmp-pg #cmpAn .ak-mg .ak-row .ak-s{font-size:11.5px}
  .cmp-pg .ak-mg .ak-row .ak-l .nm .xi{display:none}
  /* kısa cevap: yatay şerit */
  .cmp-pg [data-cmpins] .ak-ins-g{display:flex;gap:10px;margin:0 -16px 12px;padding:2px 16px 6px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 16px;scrollbar-width:none}
  .cmp-pg [data-cmpins] .ak-ins-g::-webkit-scrollbar{display:none}
  .cmp-pg [data-cmpins] .ak-ins{flex:0 0 78%;scroll-snap-align:start}
  .cmp-pg [data-cmpins] .ak-ins:only-child{flex-basis:100%}
}
@media (min-width:681px){
  .cmp-pg [data-cmpins] .ak-ins-g{margin-bottom:14px}
}

/* ---------------------------------------------------------------- hareket (§3.2)
   Not: hareketli çubukların atasında overflow:hidden yok; scaleX(0) başlangıçlı hedef kırpma kenarında kalınca görünürlük gözlemcisi onu hiç "görünür" saymıyor (MOV). */
@keyframes rkUp{from{opacity:0;transform:translateY(24px)}}
@keyframes rkIn{from{opacity:0;transform:translateY(8px)}}
@keyframes rkPop{from{opacity:0;transform:scale(.4)}}
@keyframes rkPole{from{transform:scaleX(0)}}
@keyframes rkKo{0%{opacity:0;transform:translateY(-26px) rotate(-16deg)}55%{opacity:1;transform:translateY(0) rotate(6deg)}78%{transform:rotate(-6deg)}100%{transform:none}}
@keyframes rkWob{0%,100%{transform:none}30%{transform:rotate(6deg)}65%{transform:rotate(-6deg)}}
@keyframes cmpRise{from{transform:scaleY(0)}}
@keyframes cmpDrop{from{opacity:0;transform:translateY(-16px)}}
.noanim .rkrow,.noanim .rk-ic,.noanim .rk-h2h,.noanim .rk-fwp,.noanim .cmp-pre,.noanim .cmp-qa{animation:none}
@media (prefers-reduced-motion:reduce){
  .rk-pc,.rk-ko,.rk-ps .pole,.rk-pv .od,.rk-h2h,.rk-ic,.pu-pg .rkrow,.rk-fwp,.cmp-il *,.cmp-pre,.cmp-qa,.cmp-sbk b,.cmp-duel .lead,.cmp-dt .h i,.cmp-dnt i,.cmp-sbt i{animation:none!important}
}
.cmp-d1.n{display:flex;align-items:baseline;gap:6px}
.cmp-d1.n .cmp-dm{display:inline;margin:0;text-align:left}
.cmp-duel{position:relative}
.cmp-dh{padding-right:36px;flex-wrap:wrap;row-gap:4px}
.cmp-duel:not(.two) .cmp-dh{justify-content:flex-start;column-gap:16px}
.cmp-dh > .shb{position:absolute;top:4px;right:6px;margin:0}
.cmp-dr .cmp-dl{grid-area:auto}
.rk-h2a .av:first-child,.cmp-pa > span:first-child{position:relative;z-index:1}

/* SYS (birleştirme): podyum tabanı sayfa tonunda (turuncu bronzla, yeşil temiz turla karışmasın) */
.rk-ps .pole{--c:var(--accent)}
/* 23.10: sayfa i'sinde terim ve tek satır tanımı aynı satırda (tanımlar ikinci kez listelenmez) */
.ph-xr.hd,.ph-info .sub .ph-xr.hd,.ph-md .ph-info .sub .ph-xr.hd{align-items:flex-start;padding-top:12px;padding-bottom:12px}
.ph-xr.hd > i,.ph-info .ph-xr.hd > i{margin-top:-3px}
.ph-xr.hd > em,.ph-info .ph-xr.hd > em{align-self:center}
.ph-xd{display:block;margin-top:3px;font-size:13px;font-weight:400;line-height:1.42;color:var(--muted)}
/* 23.10: telefonda "Nasıl hesaplanır" sekmesi segmentte yok; o görünümde segment yerine geri dönüş çubuğu (seçili sekme görünmüyordu) */
.pu-back{display:none}
@media (max-width:680px){
  .pu-ent.nas .seg{display:none}
  .pu-back{display:flex;align-items:center;gap:12px;flex:1 1 auto;min-width:0}
  .pu-back .btn{flex:none;min-height:44px;padding:0 14px}
  .pu-back b{min-width:0;font:700 16px/1.2 var(--f-display);color:var(--ink)}
}
/* v2026.10-zzzz5 · takip edilen satırın yapışkan kopyası: opak zemin (arkadaki satırlar içinden görünmüyordu), asıl satır ekrandayken
   yumuşakça çekilir (js/pages.js IntersectionObserver) */
.rk-fwp{background:var(--surface);transition:opacity .28s ease,transform .32s cubic-bezier(.22,1,.36,1);box-shadow:0 14px 30px -16px rgba(0,0,0,.55),0 0 0 6px color-mix(in srgb,var(--bg) 70%,transparent),inset 0 0 0 1.5px color-mix(in srgb,var(--accent) 38%,transparent)}
.rk-fwp.hid{opacity:0;transform:translateY(10px) scale(.98);pointer-events:none}
@media (prefers-reduced-motion:reduce){.rk-fwp{transition:opacity .2s linear}.rk-fwp.hid{transform:none}}
