/* v2026.10-zzh · list (site yeniden tasarımı) · liste kabuğu ve satırlar (şartname §4b, §3.3, §2.7)
   Kapsam: .xlp = js/explorer.js liste sayfası (.page). Hareket yalnız transform/opacity; hareketi azaltınca son hâl (index.html genel kuralı). */

/* ---------------------------------------------------------------- hareket */
@keyframes xrIn{from{opacity:0;transform:translateY(8px)}}
@keyframes xvX{from{transform:scaleX(0)}}
@keyframes xvPop{from{opacity:0;transform:scale(.4)}}
@keyframes xsIn{from{opacity:0;transform:translateY(6px)}}

/* ---------------------------------------------------------------- kabuk: araç çubuğu, sekmeler + özet satırı */
.xlp .xrow{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin:0 0 12px}
.xlp .xrow > .xtabs{flex:0 1 auto;min-width:0;margin:0}
.xlp .xrow > .xsum{flex:1 1 380px;min-width:0;margin:0}
.xlp .xrow.xr-st > .xsum{flex-basis:100%}
.xlp .xsum{display:flex;flex-wrap:nowrap;align-items:center;gap:22px;height:44px;padding:0 18px;border-radius:14px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none}
.xlp .xsum::-webkit-scrollbar{display:none}
.xlp .xsum .it{flex:none;flex-direction:row;align-items:baseline;gap:5px;white-space:nowrap;animation:xsIn .26s var(--e-out,cubic-bezier(.25,1,.5,1)) backwards;animation-delay:calc(var(--i,0) * 30ms)}
.xlp .xsum .it b{font-size:15px}
.xlp .xsum .it span{font-size:12px}
.xlp .xsum .big,.xlp .xsum .it .big{font-size:19px}
.xlp .xtabs button{height:40px}

/* masaüstü araç çubuğu tek satır: ikincil düğmeler simge + ipucu (etiket ekran okuyucuda ve telefondaki "Süz ve görünüm" sayfasında) */
@media (min-width:681px){
  .xlp .xbar{flex-wrap:nowrap}
  .xlp .xbar .xsearch{min-width:180px}
  .xlp .xbar .xsearch input{height:40px}
  .xlp .xbar .lsec{display:flex;flex:none;align-items:center;gap:6px}
  .xlp .xbar .lsec .btn{height:40px}
}
@media (min-width:681px) and (max-width:1679px){
  .xlp .xbar .xbl{position:absolute!important;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .xlp .xbar .lsec .btn{padding:0 11px;gap:4px}
  .xlp .xbar .lsec .btn .xcn{margin-left:2px}
}
.xsr{position:absolute!important;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

/* ---------------------------------------------------------------- masaüstü tablo (§4b): satır 36 (sıkı 30), 24 px işaret */
.xlp .gwrap:not(.cards){--rowh:36px}
.xlp .gwrap.density-c:not(.cards){--rowh:30px}
.xlp .gwrap:not(.cards) .grow .av{width:24px;height:24px;font-size:9.5px}
.xlp .gwrap:not(.cards) .grow .av svg{width:13px;height:13px}
.xlp .gwrap.density-c:not(.cards) .grow .av{width:20px;height:20px;font-size:8.5px}
.xlp .gwrap.density-c:not(.cards) .grow .av svg{width:11px;height:11px}
.xlp .gwrap:not(.cards) .grow .nm{gap:9px}
.xlp .gwrap:not(.cards) .grow .nm > .badge{flex:none;overflow:visible}
.xlp .gwrap:not(.cards) .grow::after{left:45px}
.xlp .gwrap:not(.cards) .grow > div.num{font-variant-numeric:tabular-nums}
.xlp .gscroll{scroll-padding-top:44px}
/* düzenleyen: eşleşen kulübün 20 px logosu */
.xorg{display:inline-flex;align-items:center;gap:7px;max-width:100%;min-width:0;vertical-align:middle}
.xorg > span:last-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.grow .xorg-l,.xorg-l{width:20px!important;height:20px!important;flex:none}

/* ---------------------------------------------------------------- telefon kart satırı (§4b): 64 px (iki satırlık ad 76) */
.card-row.xr{padding:0 14px 0 66px;gap:3px;transition:background-color .15s,transform .14s var(--e-out,cubic-bezier(.25,1,.5,1))}
.card-row.xr::after{left:66px}
.card-row.xr.noav{padding-left:16px}
.card-row.xr.noav::after{left:16px}
.card-row.xr .c1,.card-row.xr .c2{padding-left:0!important}
.card-row.xr .av{left:14px;width:40px;height:40px;font-size:14px}
.xlp[data-xl="kulup"] .card-row.xr .av{left:12px;width:44px;height:44px}
.card-row.xr .c1{display:flex;align-items:baseline;gap:10px;font-size:15px;line-height:20px;min-width:0}
.card-row.xr .c1 .nm{flex:1 1 auto;min-width:0;font-size:15px;font-weight:650;letter-spacing:-.012em}
.card-row.xr .cv{display:inline-flex;flex-direction:row;align-items:baseline;gap:3px;margin-left:auto;flex:none;line-height:20px}
.card-row.xr .cv b{font-family:var(--f-round);font-size:17px;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--ink)}
.card-row.xr .cv i{font-style:normal;font-size:11px;font-weight:550;color:var(--muted);max-width:84px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.card-row.xr .c2{display:flex;align-items:center;gap:10px;min-height:16px;font-size:12.5px;line-height:16px;color:var(--muted)}
.card-row.xr .c2 .t{flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.card-row.xr .sep{margin:0 6px;opacity:.45}
.card-row.xr .xm b{font-weight:650;color:var(--ink-2);font-variant-numeric:tabular-nums}
.card-row.xr .xv{flex:none;margin-left:auto;display:inline-flex;align-items:center;line-height:0}
.card-row.xr .xv .faint{line-height:16px}
.card-row.xr:active{transform:scale(.985);background:var(--hover)}
/* iki satırlık ad: değer ilk satırla hizalı */
.card-row.xr.l2 .c1{align-items:flex-start}
.card-row.xr.l2 .c1 .nm > span:not(.badge):not(.av):not(.xnn){font-size:15px;line-height:18px}
.card-row.xr.l2 .cv{line-height:18px}
/* dik mani glifi (en yüksek parkur): iki dikme + iki sırık */
.xm-hh{white-space:nowrap}
.xm-j{display:inline-block;width:11px;height:9px;margin-right:4px;vertical-align:-.5px;border:solid currentColor;border-width:0 1.5px;opacity:.7;
  background:linear-gradient(currentColor,currentColor) 0 1px/100% 1.5px no-repeat,linear-gradient(currentColor,currentColor) 0 5px/100% 1.5px no-repeat}
/* vize şeridi (satır içinde sıkı) */
.card-row.xr .xv .vs{grid-template-columns:repeat(12,5px);gap:1.5px}
.card-row.xr .xv .vs i{height:12px;border-radius:2px}
/* kıvılcım (kulüp 36 × 16; diğer listelerde 48 × 18) */
.card-row.xr .xv .spark{width:48px;height:18px}
.xlp[data-xl="kulup"] .card-row.xr .xv .spark{width:36px;height:16px}
/* kombinasyon: binici baş harfleri + at simgesi; binici ve at iki satır */
.card-row .av.xav2{overflow:visible;padding:0 7px 7px 0;font-size:13px}
.xav2-h{position:absolute;right:-9px;bottom:-9px;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;color:#fff;
  background:radial-gradient(120% 120% at 30% 20%,color-mix(in srgb,var(--e-at) 62%,#fff) 0%,var(--e-at) 60%,color-mix(in srgb,var(--e-at) 70%,#000) 100%);box-shadow:0 0 0 2px var(--surface)}
.xav2-h svg{width:15px!important;height:15px!important}
.card-row.xr .nm > .xnn{display:flex!important;flex-direction:column;min-width:0;-webkit-line-clamp:unset!important;white-space:nowrap!important}
.xnn > span{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.xnn .xn1{font-size:15px;line-height:18px;font-weight:650}
.xnn .xn2{font-size:13px;line-height:17px;font-weight:600;color:var(--ink-2);letter-spacing:-.005em}
.xnn .xn2 .badge{margin-left:4px;font-size:10.5px;vertical-align:1px}
/* temiz tur farkı çubuğu: 48 px, sıfır ortada */
.xuf{display:inline-flex;align-items:center;gap:6px;line-height:16px}
.xuf b{min-width:22px;text-align:right;font-size:11.5px;font-weight:700;color:var(--ink-2);font-variant-numeric:tabular-nums}
.xuf.none b{color:var(--faint)}
.xuf-t{position:relative;display:block;width:48px;height:6px;border-radius:999px;background:var(--fill-2,var(--fill))}
.xuf-t::after{content:"";position:absolute;left:50%;top:-2px;bottom:-2px;width:1.5px;margin-left:-.75px;border-radius:1px;background:var(--line-strong)}
.xuf-f{position:absolute;top:0;bottom:0;display:block;border-radius:999px}
.xuf.pos .xuf-f{left:50%;background:var(--accent);transform-origin:left center}
.xuf.neg .xuf-f{right:50%;background:color-mix(in srgb,var(--ink) 38%,var(--surface));transform-origin:right center}

/* ---------------------------------------------------------------- satır hareketi (§3.3) */
/* giriş kademesi: kurulum / süzgeç değişiminden sonraki ilk 600 ms, görünen satırlar */
.gbody .grow.xin{animation:xrIn .26s var(--e-out,cubic-bezier(.25,1,.5,1)) backwards;animation-delay:calc(var(--d,0) * 30ms)}
/* satır içi çubuk ve şerit 240 ms büyür (kaydırmayla gelen satırda gecikmesiz; girişte satırla birlikte) */
.gbody .grow .vs,.gbody .grow .xuf-f{animation:xvX .24s var(--e-out,cubic-bezier(.25,1,.5,1)) backwards}
.gbody .grow .vs{transform-origin:left center}
.gbody .grow .qbar i{animation-duration:.24s}
.gbody .grow .spark .sl{animation-duration:.24s}
.gbody .grow .medals i{animation:xvPop .24s var(--pop,cubic-bezier(.34,1.4,.64,1)) backwards}
.gbody .grow.xin .vs,.gbody .grow.xin .xuf-f,.gbody .grow.xin .qbar i,.gbody .grow.xin .spark .sl,.gbody .grow.xin .medals i{animation-delay:calc(var(--d,0) * 30ms + 120ms)}
/* hızlı kaydırma, geri dönüş ve hareketi azalt: hareketsiz */
.gbody .grow.xst *{animation:none!important}
.gbody[data-fast] .grow{transition:none}

/* ---------------------------------------------------------------- telefon (390): ilk satır y ≤ 250 (sekmeli) / ≤ 200 (sekmesiz) */
@media (max-width:680px){
  .xlp .xmain .xbar{padding:6px 16px;margin:-6px -16px 0}
  .xlp .xmain .xbar .xsearch input,.xlp .xbar .ftoggle{height:44px}
  .xlp .actchips:not([hidden]){margin:2px -16px 6px}
  .xlp .xrow{flex-direction:column;align-items:stretch;flex-wrap:nowrap;gap:6px;margin:0}
  .xlp .xrow > .xtabs{margin:0 -16px;padding:0 16px}
  .xlp .xrow > .xsum{flex:none}
  .xlp .xsum{height:36px;gap:16px;padding:0 14px;border-radius:14px}
  .xlp .xsum .big,.xlp .xsum .it .big{font-size:17px}
  .xlp .xsum .it b{font-size:14px}
  .xlp .xsum .it span{font-size:11px}
  /* özet şeridi liste kartının başlığı olur (ayrı blok değil): tek kart, araya boşluk yok */
  .xlp .xmain:has(.gwrap.cards) .xsum{border-radius:16px 16px 0 0;box-shadow:0 0 0 .5px var(--line);background:var(--surface)}
  .xlp .xmain:has(.gwrap.cards) [data-r="body"] > .gwrap.cards{border-radius:0 0 var(--r) var(--r);border-top:.5px solid var(--line)}
  .xlp .xmain:not(:has(.gwrap.cards)) .xrow{margin-bottom:12px}
}

/* ---------------------------------------------------------------- kart tam listesi (#liste-…, js/rlist.js): ortak başlık */
.rlp .rlp-ph{margin-top:2px}
.ph-info .rlp-crit{font-weight:600;color:var(--ink)}
.ph-info .sub p{margin:0 0 8px}