/* v2026.10-zzh · home (site yeniden tasarımı · şartname §4a, §2.4, §2.7, §3.2)
   Telefon 390 × 844 hedefleri: anasayfa ≤ 3.000 px; sahne ≤ 600; "2026 sezonu" 2 × 2 kutucuk 132 px; "Kim önde?" ≤ 560 (şerit kartında
   3 sütunlu podyum + 4–5. satırlar, Düello şeridin son kartı); Keşfet + Biliyor muydunuz tek şerit (kart 300 px, 2 özellik / 1 bilgi);
   Rota sonu ≤ 420. Açıklama cümleleri "i" penceresinde (.hi → modal .ph-md). Hareket yalnız transform/opacity (SVG çiziminde
   stroke-dashoffset); şerit dışındaki grafikler "backwards" dolguyla yazılır, js/vgui.js MOV görünür alana girince oynatır ([data-mv]).
   Hareketi azalt: genel kural (index.html) bütün animasyonları kapatır, taban stil son hâldir. Kapsam: .home (sayfa kökü). */

/* ---------------------------------------------------------------- hareket anahtar kareleri */
@keyframes hzUp{from{opacity:0;transform:translateY(12px)}}
@keyframes hzDraw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes hzPop{from{opacity:0;transform:scale(.4)}}
@keyframes hzY{from{transform:scaleY(0)}}
@keyframes hzFade{from{opacity:0}}
@keyframes hzPod{from{opacity:0;transform:translateY(24px)}}
@keyframes hzDrop{from{opacity:0;transform:translateY(-16px)}}
@keyframes hzSway{0%{transform:rotate(0)}30%{transform:rotate(-6deg)}65%{transform:rotate(4deg)}100%{transform:rotate(0)}}

/* ---------------------------------------------------------------- bölüm ritmi ve başlık (§2.4) */
.home .hsec{margin-top:24px}
.home .sh2{display:flex;align-items:center;flex-wrap:nowrap;gap:8px;min-width:0;min-height:44px;margin:0 2px 10px}
.home .sh2 .sh-no{flex:none;display:inline-flex!important;align-items:center;gap:6px;margin:0;font:700 11.5px/1 var(--f-round);letter-spacing:.04em;color:var(--faint);font-variant-numeric:tabular-nums}
.home .sh2 .sh-no::before{width:14px}
.home .sh2 h2{flex:none;margin:0;font-family:var(--f-display);font-size:var(--t-h2,20px);font-weight:750;letter-spacing:-.02em;line-height:1.15;white-space:nowrap}
.home .sh2 .sh-m{flex:0 1 auto;min-width:0;display:inline-flex;align-items:center;height:22px;padding:0 9px;border-radius:999px;background:var(--fill);font-size:12px;font-weight:600;color:var(--muted);white-space:nowrap;overflow:hidden}
.home .sh2 .sh-m > span{overflow:hidden;text-overflow:ellipsis}
.home .sh2 .sh-r{display:flex!important;align-items:center;flex:0 1 auto;min-width:0;margin-left:auto}
.home .sh2 .sh-r .lnk{display:inline-flex;align-items:center;min-height:44px;max-width:100%;padding:0 2px;font-size:13px;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.home .sh2 .sh-r .lnk:hover{transform:translateX(2px)}
.home .sh2 > .hi{width:26px;height:26px;font-size:14px}
.home .sh2 > .hi::after{inset:-10px}

/* ---------------------------------------------------------------- "i" düğmesi (kart 22 px, bölüm 26 px; dokunma alanı 44) */
.home .hi{position:relative;flex:none;display:inline-grid;place-items:center;width:22px;height:22px;padding:0;border:0;border-radius:50%;cursor:pointer;
  background:color-mix(in srgb,var(--accent) 14%,var(--surface));color:var(--accent-ink);box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--accent) 40%,transparent);
  font:italic 800 12.5px/1 Georgia,"Times New Roman",serif;transition:transform .2s var(--spring),background-color .2s}
.home .hi::after{content:"";position:absolute;inset:-12px}
.home .hi:hover{transform:scale(1.08);background:color-mix(in srgb,var(--accent) 24%,var(--surface))}
.home .hi:focus-visible{outline:2.5px solid var(--accent);outline-offset:2px}
.home .hi span{pointer-events:none}
/* i penceresi (sayfa i'siyle aynı modal; gövde .ph-info) */
.hi-md .hi-info{display:flex;flex-direction:column;gap:10px}
.hi-md .hi-info p.sub{margin:0}
.hi-md .hi-how{display:flex;flex-direction:column;margin-top:4px;border-top:1px solid var(--line)}
.hi-md .hi-hh{padding:10px 2px 4px;font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.hi-md .hi-x{display:flex;align-items:center;gap:12px;min-height:48px;padding:0 4px;border:0;border-radius:12px;background:none;color:var(--ink);font:inherit;font-size:14.5px;font-weight:600;text-align:left;cursor:pointer}
.hi-md .hi-x + .hi-x{box-shadow:inset 0 1px 0 var(--line)}
.hi-md .hi-x:hover{background:var(--hover)}
.hi-md .hi-x > i{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:color-mix(in srgb,var(--xt,var(--accent)) 16%,var(--surface));color:color-mix(in srgb,var(--xt,var(--accent)) 75%,var(--ink));font:italic 800 14px/1 Georgia,"Times New Roman",serif}
.hi-md .hi-x > span{flex:1;min-width:0}
.hi-md .hi-x > svg{flex:none;width:16px;height:16px;fill:none;stroke:var(--muted);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.hi-md .hi-m{margin:2px 0 0;font-size:12.5px;color:var(--muted)}

/* ---------------------------------------------------------------- sahne (§4a: ≤ 600 px telefonda) */
.home .qa-card{will-change:auto}
.home .qa-w .qa-card::before{animation-iteration-count:6}          /* qaOrb sonsuz döngüydü: en çok 6 tekrar (§3.5) */
@media (max-width:680px){
  .home .st-grid{padding:14px 16px 4px}
  .home .st-h1{font-size:24px;line-height:1.08;margin:0}
  .home .st-q{height:48px;margin-top:10px}
  .home .st-vis{margin-top:6px}
  .home .qa-w .qa-card{min-height:376px;gap:7px;padding:12px 12px 12px}
  .home .qa-big{min-height:40px}
  .home .qa-big b{font-size:38px}
  .home .qa-vis{min-height:150px}
  .home .qa-no{font-size:52px;top:6px;right:10px}
  .home .stage .tkr{margin-top:2px}
}
@media (min-width:681px){
  .home .st-grid{padding-top:30px;padding-bottom:12px}
  .home .qa-w .qa-card{min-height:420px}
}

/* ---------------------------------------------------------------- "Senin için" (rol kısayolları): telefonda tek kaydırmalı satır */
@media (max-width:680px){
  .home .hme{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:12px -16px 0;padding:0 16px 2px}
  .home .hme::-webkit-scrollbar{display:none}
  .home .hme-l{flex:none;white-space:nowrap}
  .home .hme-b{flex:none;height:44px}
}

/* ---------------------------------------------------------------- 2026 sezonu: 2 × 2 kutucuk, 132 px */
.home .dgrid{column-gap:10px;row-gap:0}        /* boşluk satır aralığıyla değil kenar boşluğuyla: kapalı ayrıntı panelleri (4 × .dwrap) yer kaplamaz */
.home .dtw:nth-child(n+3){margin-top:10px}
.home .dwrap:not(.open){margin-top:0}
.home .dpanel{margin-top:10px}
.home .dtw{position:relative;display:flex;min-width:0;order:0;animation:hzUp .52s var(--spring) backwards;animation-delay:calc(var(--o) * 70ms)}
.home .dtw > .dtile{flex:1;min-width:0;height:132px;order:0;justify-content:flex-start;gap:4px;padding:12px 12px 12px 14px;animation:none}
.home .dtile .dt-k{padding-right:28px}                                   /* sağ üst: açılır ok */
.home .dtw > .hi{position:absolute;right:12px;bottom:15px;z-index:2}    /* i: kıvılcımın yanında, karşılaştırmanın açıklaması */
.home .dtw.has-i .dtile .spk{max-width:calc(100% - 32px)}
.home .dtile .dt-c{top:10px;right:9px;width:24px;height:24px}
.home .dtile .dt-c svg{width:13px;height:13px}
.home .dtile .dt-k{display:block;max-width:100%;font-size:11px;line-height:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.home .dtile .dt-v{gap:2px 8px}
.home .dtile .dt-v > b{font-size:28px;line-height:1.1}
.home .dtile .dt-x{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;white-space:normal;overflow:hidden;font-size:12px;line-height:1.4;text-wrap:balance}
.home .dtile .spk{display:block;width:auto;max-width:100%;height:28px;margin-top:auto}
.home .dmil{margin-top:10px}
/* hareket: kutucuk sayıları makarada döner, kıvılcım çizilir, son nokta belirir (görünür alana girince: REVEAL / MOV) */
.home .dtile .dt-v .od{animation:odo .8s cubic-bezier(.16,1,.3,1) backwards;animation-delay:calc(.12s + var(--o) * 60ms + var(--k) * 22ms)}
.home .dtile .dt-v .dch{animation:hzPop .26s var(--bounce) backwards;animation-delay:calc(.7s + var(--o) * 60ms)}
.home .dgrid .spk polyline:not(.pt){stroke-dasharray:1;animation:hzDraw .7s cubic-bezier(.25,1,.5,1) backwards;animation-delay:calc(.25s + var(--o) * 60ms)}
.home .dgrid .spk .pt{animation:hzFade .26s ease backwards;animation-delay:calc(.95s + var(--o) * 60ms)}
.home .dgrid .spk circle{transform-box:fill-box;transform-origin:center;animation:hzPop .26s var(--bounce) backwards;animation-delay:calc(.95s + var(--o) * 60ms)}
@media (min-width:681px){
  .home .dtw{order:var(--o)}
  .home .dtw:nth-child(n+3){margin-top:0}
  .home .dgrid{column-gap:12px}
  .home .dpanel{margin-top:12px}
  .home .dtw > .dtile{padding:14px 16px 14px 18px}
  .home .dtile .dt-v > b{font-size:32px}
  .home .dmil{margin-top:12px}
}

/* ---------------------------------------------------------------- Kim önde? (§4a: ≤ 560 px) */
.home .hsec[data-sec="sira"]{padding:20px 24px 16px}
.home .hsec[data-sec="sira"] .sh2{margin-bottom:8px}
@media (max-width:680px){.home .hsec[data-sec="sira"]{padding:12px 12px 10px;margin-inline:-6px;border-radius:24px}}
.home .rk-st{gap:10px}
.home .hsec[data-sec="sira"] .rlc{height:auto;min-height:372px}
.home .rlc-h{align-items:center;gap:10px;padding:12px 10px 6px 14px}
.home .rlc-tt{flex:1;min-width:0}
.home .rlc h3{font-size:16.5px;line-height:1.2;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;white-space:normal;text-wrap:balance}   /* 23.10: uzun başlık ("Temiz tur kombinasyonları") kesilmez, iki satıra iner */
.home .rlc .rlc-m{display:flex;align-items:center;gap:5px;margin-top:1px;font-size:12px;white-space:nowrap;overflow:hidden;-webkit-line-clamp:unset}
.home .rlc .rlc-m > i{font-style:normal;color:var(--faint)}
.home .rlc-h > .hi{margin-left:2px}
.home .rlc-h h3 .xi{display:none}       /* kartın i'si "Nasıl hesaplanır → CPX" satırını taşır; başlıkta ikinci i olmaz */
.home .rlc-h > .shb{margin:0 -4px 0 0}
.home .rlc-f{min-height:44px}
/* performans listeleri: her genişlikte 3 sütunlu podyum (2 · 1 · 3) + 4. ve 5. satır; taban engel sırığı motifiyle (§2.6) */
.home .rlc[data-mode="pod"] .rk{display:grid;flex:1 0 auto;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr) minmax(0,1fr);grid-template-areas:"p2 p1 p3" "r4 r4 r4" "r5 r5 r5";grid-template-rows:1fr auto auto;align-items:end;justify-items:stretch;column-gap:6px;padding:2px 10px 0}
.home .rlc[data-mode="pod"] .rk-r:nth-child(1){grid-area:p1;--ph:44px}
.home .rlc[data-mode="pod"] .rk-r:nth-child(2){grid-area:p2;--ph:34px}
.home .rlc[data-mode="pod"] .rk-r:nth-child(3){grid-area:p3;--ph:26px}
.home .rlc[data-mode="pod"] .rk-r:nth-child(4){grid-area:r4;margin-top:6px}
.home .rlc[data-mode="pod"] .rk-r:nth-child(5){grid-area:r5}
.home .rlc[data-mode="pod"] .rk-r:nth-child(n+4){min-height:44px;padding:2px 4px}
.home .rlc[data-mode="pod"] .rk-r:nth-child(4)::before{display:none}
.home .rlc[data-mode="pod"] .rk-r:nth-child(5)::before{left:40px;right:4px}
.home .rlc[data-mode="pod"] .rk-r:nth-child(-n+3){display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:2px;min-width:0;min-height:0;margin:0;padding:6px 0 0;text-align:center;background:none;box-shadow:none;border-radius:12px 12px 4px 4px}
.home .rlc[data-mode="pod"] .rk-r.rk-m1:nth-child(1){background:linear-gradient(180deg,rgba(240,194,94,.13),rgba(240,194,94,.02) 75%);box-shadow:inset 0 0 0 1px rgba(240,194,94,.24)}
.home .rlc[data-mode="pod"] .rk-r:nth-child(-n+3)::before,.home .rlc[data-mode="pod"] .rk-r:nth-child(-n+3)::after,.home .rlc[data-mode="pod"] .rk-r:nth-child(-n+3) .rk-bar{display:none}   /* 23.10: ::after (satır izi) dar kartta podyum sütununun arkasında kayık bir dikdörtgen olarak görünüyordu */
.home .rlc[data-mode="pod"] .rk-r:nth-child(-n+3) .rk-nm{order:1;align-items:center;width:100%;min-width:0;padding:0 4px}
.home .rlc[data-mode="pod"] .rk-r:nth-child(-n+3) .rk-a{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;max-width:100%;overflow:hidden;white-space:normal;font-size:13px;line-height:1.2;text-wrap:balance}
.home .rlc[data-mode="pod"] .rk-r:nth-child(1) .rk-a{font-size:14px;font-weight:650}
.home .rlc[data-mode="pod"] .rk-r:nth-child(-n+3) .rk-nm small{flex-wrap:wrap;justify-content:center;gap:2px 4px;max-width:100%;overflow:hidden;font-size:11.5px}
.home .rlc[data-mode="pod"] .rk-r:nth-child(-n+3) .rk-nm small > span{max-width:100%;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-wrap:balance;overflow-wrap:anywhere}
.home .rlc[data-mode="pod"] .rk-r:nth-child(-n+3) .rk-v{order:2;align-items:center;font-size:16px}
.home .rlc[data-mode="pod"] .rk-r:nth-child(1) .rk-v{font-size:21px;line-height:1.1;letter-spacing:-.02em}
.home .rlc[data-mode="pod"] .rk-r:nth-child(-n+3) .rk-mt{flex-wrap:wrap;justify-content:center;gap:0 4px;font-size:11.5px;line-height:15px}
.home .rlc[data-mode="pod"] .rk-r:nth-child(-n+3) .rk-n{position:relative;order:3;align-self:stretch;height:var(--ph);margin-top:4px;overflow:hidden;border-radius:10px 10px 3px 3px;transform-origin:50% 100%;
  background:linear-gradient(180deg,color-mix(in srgb,var(--mc,#fff) 30%,#1C2A6E),color-mix(in srgb,var(--mc,#fff) 8%,#152058))}
.home .rlc[data-mode="pod"] .rk-r:nth-child(-n+3) .rk-n::before{content:"";position:absolute;left:0;right:0;top:0;height:5px;
  background:repeating-linear-gradient(90deg,var(--mc,#fff) 0 12px,color-mix(in srgb,var(--mc,#fff) 22%,#fff) 12px 24px)}
.home .rlc[data-mode="pod"] .rk-r:nth-child(-n+3) .rk-md{width:22px;height:22px;margin-top:3px;font-size:12px}
.home .rlc[data-mode="pod"] .rk-r:nth-child(1) .rk-md{width:26px;height:26px;font-size:13.5px}
/* podyum hareketi (§3.2): sütun 24 px yükselir (3. 0, 2. 120, 1. 240 ms), taban büyür, kokart düşüp bir kez sallanır (+420 ms) */
.home .rlc.on[data-mode="pod"] .rk-r:nth-child(-n+3){animation:hzPod .56s var(--spring) backwards}
.home .rlc.on[data-mode="pod"] .rk-r:nth-child(-n+3) .rk-n{animation:hzY .56s var(--spring) backwards}
.home .rlc.on[data-mode="pod"] .rk-r:nth-child(-n+3) :is(.rk-nm,.rk-v,.rk-mt){animation:none}
.home .rlc.on[data-mode="pod"] .rk-r:nth-child(-n+3) .rk-md{animation:hzDrop .32s var(--bounce) backwards,hzSway .5s ease backwards}
.home .rlc.on[data-mode="pod"] .rk-r:nth-child(3),.home .rlc.on[data-mode="pod"] .rk-r:nth-child(3) .rk-n{animation-delay:0s}
.home .rlc.on[data-mode="pod"] .rk-r:nth-child(2),.home .rlc.on[data-mode="pod"] .rk-r:nth-child(2) .rk-n{animation-delay:.12s}
.home .rlc.on[data-mode="pod"] .rk-r:nth-child(1),.home .rlc.on[data-mode="pod"] .rk-r:nth-child(1) .rk-n{animation-delay:.24s}
.home .rlc.on[data-mode="pod"] .rk-r:nth-child(3) .rk-md{animation-delay:.42s,.74s}
.home .rlc.on[data-mode="pod"] .rk-r:nth-child(2) .rk-md{animation-delay:.54s,.86s}
.home .rlc.on[data-mode="pod"] .rk-r:nth-child(1) .rk-md{animation-delay:.66s,.98s}
.home .rlc.on[data-mode="pod"] .rk-r:nth-child(-n+3) .rk-v .od{animation-delay:calc(.36s + (3 - var(--i)) * 60ms + var(--k) * 22ms)}
/* Düello: şeridin son kartı (dik mani + okser çizimi) */
.home .rlc-duel{--lh:var(--gold)}
.home .rlc-duel .rlc-i{background:rgba(240,194,94,.16);color:#F0C25E;box-shadow:inset 0 0 0 1px rgba(240,194,94,.4)}
.home .rlc-duel .rlc-tt .s{display:block;font-size:13px;color:var(--ink-2)}
.home .rd-art{flex:1;min-height:0;display:grid;place-items:center;padding:4px 20px 0}
.home .rd-svg{display:block;width:100%;max-width:300px;height:auto;overflow:visible}
.home .rd-gr{stroke:rgba(255,255,255,.22);stroke-width:2;stroke-linecap:round}
.home .rd-st{fill:rgba(255,255,255,.62);transform-box:fill-box;transform-origin:50% 100%}
.home .rd-st.bk{fill:rgba(255,255,255,.3)}
.home .rd-pl{transform-box:fill-box}
.home .rd-pl line{stroke-width:6;stroke-linecap:round}
.home .rd-pl .a{stroke:#fff}
.home .rd-pl .b{stroke:var(--e-parkur);stroke-dasharray:11 11;stroke-linecap:butt}
.home .rd-p{margin:0;padding:10px 16px 0;font-size:13px;line-height:1.45;color:var(--muted);text-wrap:pretty}
.home .rlc-duel .rlc-f{justify-content:flex-end;padding:10px 14px 14px}
.home .rd-go{display:inline-flex;align-items:center;gap:6px;height:44px;padding:0 20px;border:0;border-radius:12px;cursor:pointer;font:800 14px/1 var(--f-body,inherit);color:#1A1405;background:linear-gradient(180deg,#FFE19A,#F0C25E);box-shadow:0 10px 24px -12px rgba(240,194,94,.8);transition:transform .25s var(--spring)}
.home .rd-go i{font-style:normal;transition:transform .25s var(--spring)}
.home .rd-go:hover i{transform:translateX(3px)}
.home .rd-go:active{transform:scale(.97)}
.home .rlc-duel.on .rd-st{animation:hzY .5s var(--spring) backwards;animation-delay:calc(var(--k) * 60ms)}
.home .rlc-duel.on .rd-pl{animation:hzDrop .45s var(--bounce) backwards;animation-delay:calc(.3s + var(--k) * 70ms)}
.home .rlc-duel.on .rd-go{animation:hzPop .3s var(--bounce) backwards .9s}
@media (min-width:681px){
  .home .hsec[data-sec="sira"] .rlc{min-height:376px}
  .home .rlc[data-mode="pod"] .rk{padding:4px 16px 0;column-gap:10px}
  .home .rlc[data-mode="pod"] .rk-r:nth-child(-n+3) .rk-a{font-size:14px}
  .home .rlc[data-mode="pod"] .rk-r:nth-child(1) .rk-v{font-size:24px}
  .home .rd-p{padding:10px 24px 0;font-size:13.5px}
}

/* ---------------------------------------------------------------- Keşfet + Biliyor muydunuz: tek şerit, kart 300 px */
.home .kx-st{gap:10px}
.home .kx-st .sty-s > *{height:300px;min-height:0}
.home .kx-st .vt{min-height:0;height:300px}
.home .kx-st .vt-p{flex:1 1 auto;min-height:0;margin:10px 10px 0;padding:12px;overflow:hidden;-webkit-mask-image:linear-gradient(180deg,#000 80%,transparent);mask-image:linear-gradient(180deg,#000 80%,transparent)}
.home .kx-st .v-p .vt-p{padding:12px}
.home .kx-st .vt-t{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;column-gap:10px;row-gap:0;padding:10px 10px 12px 14px}
.home .kx-st .vt-t > .vt-i{grid-column:1;grid-row:1 / span 2;align-self:center}
.home .kx-st .vt-t > b{grid-column:2;grid-row:1;min-width:0;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.home .kx-st .v-p .vt-t b{font-size:15px}
.home .kx-st .vt-t > em{grid-column:2;grid-row:2;margin:1px 0 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.home .kx-st .vt-t > .vt-s{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.home .kx-st .vt-t > .hi{grid-column:3;grid-row:1 / span 2;z-index:3}
.home .kx-st .vt-t > .shb{grid-column:4;grid-row:1 / span 2;align-self:center;margin:0 -2px 0 0;z-index:3}
.home .kx-st .vt-t > .vt-x{grid-column:2 / -1;grid-row:3;margin-top:2px}
/* bilgi kartı */
.home .kx-st .fc{min-height:0;height:300px;gap:3px;padding:14px 16px 8px;border-radius:22px}
.home .kx-st .fc-kk{padding-right:40px;font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:color-mix(in srgb,var(--fh,var(--accent)) 55%,var(--muted))}
.home .kx-st .fx-a .fc-kk{color:rgba(242,244,250,.6)}
.home .kx-st .fc > b{font-size:34px;line-height:1.08}
.home .kx-st .fx-a > b{font-size:38px}
.home .kx-st .fc p{font-size:13px;line-height:1.42}
.home .kx-st .fx-v{flex:1 1 auto;min-height:0;margin:4px 0 0;justify-content:center}
/* 23.10: sabit yükseklikteki kartta görsel taşmasın. Önce görsel kutusu ortalanıp küçülüyordu, nokta ızgarası yukarıda yazının,
   lejant aşağıda dipnotun üstüne biniyordu (iPhone'da yazı daha geniş, satır daha çok). Artık görsel üste yaslı ve kutunun dışına
   çıkmaz; Tek hata kartında nokta ızgarası kalan yüksekliğe oranını koruyarak sığar. */
.home .kx-st .fx-v{display:flex;flex-direction:column;justify-content:flex-start;overflow:hidden}
.home .kx-st .fx-a .fx-w{flex:1 1 0;min-height:24px;height:0;width:100%}
.home .kx-st .fx-a .fx-lg{flex:none;margin-top:6px;gap:2px 10px;font-size:11px}
.home .kx-st .fx-a > b{font-size:34px}
@media (max-width:680px){.home .kx-st .sty-s > *,.home .kx-st .vt,.home .kx-st .fc{height:316px}}
.home .kx-st .fxk-p{height:64px}
.home .kx-st .fx-lg{margin-top:8px;gap:3px 12px;font-size:11.5px}
.home .kx-st .fc-f{padding-top:4px;min-height:36px}
.home .kx-st .fc-go{min-height:36px}
@media (min-width:681px){
  .home .kx-st .sty-s > *,.home .kx-st .vt,.home .kx-st .fc{height:316px}
}

/* ---------------------------------------------------------------- Rota sonu (§4a: ≤ 420 px telefonda) */
.home .hnd-row{display:flex;align-items:center;gap:10px;width:100%;max-width:600px;min-height:28px}
.home .hnd-row .hnd-wk{flex:1 1 0;min-width:44px}
.home .hnd-row .hnd-wk svg{height:26px}
.home .hnd-row .hnd-cut{flex:none;white-space:nowrap}
.home .hnd-row > .hi{flex:none}
.home .hnd .hnd-wk rect:not(.fu){animation:hzY .6s var(--spring) backwards;animation-delay:calc(.15s + var(--i) * 14ms)}
.home .hnd .hnd-wk rect.fu{animation:hzFade .4s ease backwards .5s}
.home .hnd .hnd-wk line{animation:hzFade .4s ease backwards .9s}
@media (max-width:680px){
  .home .hnd{margin:24px -6px 12px}
  .home .hnd::after{display:none}
  .home .hnd-in{padding:14px 16px 10px}
  .home .hnd h2{font-size:20px;margin:6px 0 0}
  .home .hnd-q{margin-top:12px;background:none;box-shadow:none;overflow:visible;border-radius:0}
  .home .hnd-qb{height:48px;border-radius:14px;box-shadow:0 14px 30px -18px rgba(0,0,0,.7)}
  .home .hnd-sg{flex-direction:row;gap:6px;overflow-x:auto;scrollbar-width:none;margin:0 -16px;padding:8px 16px 0;scroll-padding:0 16px}
  .home .hnd-sg::-webkit-scrollbar{display:none}
  .home .hnd-r,.home .hnd-r + .hnd-r{flex:none;width:auto;max-width:82%;min-height:44px;padding:0 6px 0 12px;border-radius:999px;background:rgba(255,255,255,.07);box-shadow:inset 0 0 0 1px var(--line);grid-template-columns:14px minmax(0,auto) auto;gap:7px;font-size:13px}
  .home .hnd-r b{min-width:0}
  .home .hnd-n{margin-top:12px}
  .home .hnd-nh{min-height:20px;margin-bottom:6px}
  .home .hnd-c{min-height:44px}
  .home .hnd-sig{gap:2px;padding:6px 16px 2px}
  .home .hnd-l{padding-top:2px}
  .home .hnd-l button{min-height:44px}
}
@media (min-width:681px){
  .home .hnd{margin-top:32px}
  .home .hnd-in{padding:36px 40px 18px}
  .home .hnd-r{min-height:44px}
  .home .hnd-l button{min-height:44px}
  .home .hnd-sig{gap:8px;padding:12px 40px 8px}
}

/* ---------------------------------------------------------------- nokta ızgaraları satır satır dolar (§4a: satır başına 40 ms) */
.home .fc.on .fx-w circle{animation-delay:calc(.1s + var(--r, 0) * 40ms + var(--i) * 6ms)}
.home .qa-card.play .qv-w{animation-delay:calc(.1s + var(--i) * 4ms)}

/* ---------------------------------------------------------------- döngü sınırı (§3.5): arama önizlemesindeki imleç en çok 6 kez yanıp söner */
.home .mp-c{animation-iteration-count:6}