/* Araç merkezi (/tools/) — katalog görünümü (kit üstüne). Kapsam: .bvk-t-index (+ yalnız bu sayfanın hero'su).
   Kural: vh/sticky/fixed yok (gömülü); altın yalnız seçili + odak + birincil eylem; token'lar kitten (--kzk-*).
   Küçük resimler açık temada da koyu kuyuda (kit notu: önizlemeler koyu kalır). */

/* ───────── hero (bölge dışında; yalnız hub'ı taşıyan main) ───────── */
html body main:has(>.bvk-t-index)>section.hero{display:block;text-align:left;padding:30px 0 4px;margin:0;max-width:none}
html body main:has(>.bvk-t-index)>section.hero h1{margin:12px 0 10px;font:700 46px/1.06 var(--kzk-display);letter-spacing:-1.4px;color:var(--kzk-text)}
html body main:has(>.bvk-t-index)>section.hero p{margin:0;max-width:660px;font:400 16px/1.55 var(--kzk-font);color:var(--kzk-muted)}
html body main:has(>.bvk-t-index)>section.hero .chip{display:inline-flex}
@media (max-width:600px){
  html body main:has(>.bvk-t-index)>section.hero{padding:18px 0 0}
  html body main:has(>.bvk-t-index)>section.hero h1{font-size:32px;letter-spacing:-.8px}
  html body main:has(>.bvk-t-index)>section.hero p{font-size:14.5px}
}

/* ───────── palet (önizleme renkleri) ───────── */
.bvk-t-index{--h1:#8a55ef;--h2:#b480ff;--h3:#f9c544;--hw:#120f1b;--hub-r:14px;margin-bottom:28px}
.bvk-t-index[data-pal=neon]{--h1:#00d4f0;--h2:#ff2bd6;--h3:#c6ff3d;--hw:#0b0c18}
.bvk-t-index[data-pal=pastel]{--h1:#ff8fc8;--h2:#a5b4fc;--h3:#fde68a;--hw:#17131f}
.bvk-t-index[data-pal=esports]{--h1:#ff3b5c;--h2:#ff9f1c;--h3:#f5f5f5;--hw:#120d10}
.bvk-t-index[data-pal=ocean]{--h1:#22b8e6;--h2:#3b6cf0;--h3:#a7f3d0;--hw:#0b1220}
.bvk-t-index[data-pal=mono]{--h1:#d9d6e3;--h2:#8f8a9e;--h3:#ffffff;--hw:#121216}
.bvk-t-index [hidden]{display:none!important}
.bvk-t-index .hub-i{width:18px;height:18px;flex:none;display:block}

/* ───────── istatistik şeridi ───────── */
.bvk-t-index .hub-stats{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 18px;padding:0}
.bvk-t-index .hub-stats li{display:inline-flex;align-items:baseline;gap:7px;padding:7px 13px;border-radius:999px;background:var(--kzk-card);border:1px solid var(--kzk-line);font:500 13px/1.2 var(--kzk-font);color:var(--kzk-muted)}
.bvk-t-index .hub-stats b{font:700 16px/1 var(--kzk-display);color:var(--kzk-lilac);letter-spacing:-.2px}

/* ───────── araç çubuğu ───────── */
.bvk-t-index .hub-bar{padding:16px;display:flex;flex-direction:column;gap:14px;margin-bottom:26px}
.bvk-t-index .hub-row1{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.bvk-t-index .hub-search{flex:1 1 360px;min-width:0;position:relative;display:flex;align-items:center}
.bvk-t-index .hub-search>.hub-i{position:absolute;left:15px;width:20px;height:20px;color:var(--kzk-muted);pointer-events:none}
.bvk-t-index .hub-search input{width:100%;height:50px;padding:0 48px 0 46px;border-radius:12px;font:500 15px/1 var(--kzk-font)}
.bvk-t-index .hub-search input::-webkit-search-cancel-button{cursor:pointer}
.bvk-t-index .hub-kbd{position:absolute;right:12px;display:grid;place-items:center;min-width:24px;height:24px;padding:0 6px;border-radius:6px;border:1px solid var(--kzk-line-2);background:var(--kzk-card-2);font:600 12px/1 var(--kzk-mono);color:var(--kzk-muted);pointer-events:none}
.bvk-t-index .hub-search input:focus~.hub-kbd,.bvk-t-index .hub-search input:not(:placeholder-shown)~.hub-kbd{opacity:0}
.bvk-t-index .hub-ctl{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.bvk-t-index .hub-ctl .kzk-seg--track>button{padding:0 12px;min-height:38px}
.bvk-t-index .hub-view>button{padding:0 10px!important}
.bvk-t-index .hub-view .hub-i{width:18px;height:18px}

/* kategori ve niyet çipleri */
.bvk-t-index .hub-cats,.bvk-t-index .hub-tags{display:flex;flex-wrap:wrap;gap:8px;min-width:0}
.bvk-t-index .hub-cats>button,.bvk-t-index .hub-tags>button{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 14px;border-radius:11px;border:1px solid var(--kzk-line-2);background:var(--kzk-card-2);color:var(--kzk-text-2);font:600 14px/1 var(--kzk-font);cursor:pointer;white-space:nowrap;transition:border-color .15s,background .15s,color .15s}
.bvk-t-index .hub-cats>button .hub-i,.bvk-t-index .hub-tags>button .hub-i{color:var(--kzk-lilac)}
.bvk-t-index .hub-cats>button:hover,.bvk-t-index .hub-tags>button:hover{border-color:var(--kzk-line-hover);color:var(--kzk-text)}
.bvk-t-index .hub-cats>button[aria-pressed=true],.bvk-t-index .hub-tags>button[aria-pressed=true]{border-color:var(--kzk-gold-line);background:var(--kzk-sel-bg);color:var(--kzk-gold);box-shadow:0 0 0 3px var(--kzk-gold-ring)}
.bvk-t-index .hub-cats>button[aria-pressed=true] .hub-i,.bvk-t-index .hub-tags>button[aria-pressed=true] .hub-i{color:var(--kzk-gold)}
.bvk-t-index .hub-n{display:inline-grid;place-items:center;min-width:24px;height:22px;padding:0 7px;border-radius:999px;background:var(--kzk-card-3);color:var(--kzk-text-2);font:600 12px/1 var(--kzk-font)}
.bvk-t-index .hub-n:empty{display:none}
.bvk-t-index [aria-pressed=true]>.hub-n{background:color-mix(in srgb,var(--kzk-gold) 18%,transparent);color:var(--kzk-gold)}
.bvk-t-index .is-zero{opacity:.55}
.bvk-t-index .hub-tags>button{height:36px;padding:0 12px;font-size:13px;border-radius:999px}
.bvk-t-index .hub-tags>button .hub-i{width:16px;height:16px}
.bvk-t-index .hub-row3{display:flex;align-items:center;justify-content:space-between;gap:12px 20px;flex-wrap:wrap;padding-top:14px;border-top:1px solid var(--kzk-line)}
.bvk-t-index :is(.hub-cats,.hub-tags)>button:focus-visible,.bvk-t-index .hub-pal>button:focus-visible,.bvk-t-index .hub-fav:focus-visible,.bvk-t-index .hub-sugg>button:focus-visible{outline:2px solid var(--kzk-focus);outline-offset:2px}

/* önizleme renkleri */
.bvk-t-index .hub-pal{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.bvk-t-index .hub-pal .kzk-label{margin:0 4px 0 0;white-space:nowrap}
.bvk-t-index .hub-pal>button{width:30px;height:30px;padding:3px;border-radius:50%;border:1.5px solid transparent;background:transparent;cursor:pointer;display:grid;place-items:center;transition:border-color .15s,transform .15s}
.bvk-t-index .hub-pal>button i{display:block;width:100%;height:100%;border-radius:50%;background:conic-gradient(var(--a) 0 140deg,var(--b) 140deg 260deg,var(--c) 260deg 360deg);box-shadow:inset 0 0 0 1px rgba(255,255,255,.18)}
.bvk-t-index .hub-pal>button:hover{transform:scale(1.08)}
.bvk-t-index .hub-pal>button[aria-checked=true]{border-color:var(--kzk-gold-line);box-shadow:0 0 0 3px var(--kzk-gold-ring)}
.bvk-t-index .hub-statusrow{display:flex;align-items:center;gap:12px;min-height:22px;margin-top:-4px}
.bvk-t-index .hub-reset{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:999px;border:1px solid var(--kzk-line-2);background:transparent;color:var(--kzk-lilac);font:600 12px/1.2 var(--kzk-font);cursor:pointer}
.bvk-t-index .hub-reset .hub-i{width:13px;height:13px}
.bvk-t-index .hub-reset:hover{border-color:var(--kzk-lilac)}
.bvk-t-index .hub-reset:focus-visible{outline:2px solid var(--kzk-focus);outline-offset:2px}
.bvk-t-index .hub-status{margin:0;font:500 12.5px/1.3 var(--kzk-font);color:var(--kzk-faint)}

/* ───────── bölüm başlıkları ───────── */
.bvk-t-index .hub-sec-head{display:flex;align-items:center;gap:14px;margin:0 0 14px;min-width:0}
.bvk-t-index .hub-h2{margin:0;font:700 21px/1.2 var(--kzk-display);letter-spacing:-.3px;color:var(--kzk-text)}
.bvk-t-index .hub-aside{margin-left:auto;font:500 13px/1.3 var(--kzk-font);color:var(--kzk-muted);white-space:nowrap}
.bvk-t-index .hub-sec-ic{width:42px;height:42px;flex:none;border-radius:12px;display:grid;place-items:center;background:var(--kzk-hl-bg);border:1px solid var(--kzk-hl-line);color:var(--kzk-lilac)}
.bvk-t-index .hub-sec-ic .hub-i{width:22px;height:22px}
.bvk-t-index .hub-sec-txt{min-width:0}
.bvk-t-index .hub-tagline{margin:3px 0 0;font:400 13.5px/1.4 var(--kzk-font);color:var(--kzk-muted)}
.bvk-t-index .hub-sec{margin:0 0 34px;scroll-margin-top:90px}
.bvk-t-index .hub-jump,.bvk-t-index .hub-featsec{margin:0 0 34px}

/* ───────── küçük resim kuyusu + SVG sınıfları ───────── */
.bvk-t-index .hub-art{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;
  background:radial-gradient(110% 90% at 88% -5%,color-mix(in srgb,var(--h1) 34%,transparent),transparent 62%),radial-gradient(80% 80% at -5% 105%,color-mix(in srgb,var(--h2) 22%,transparent),transparent 60%),var(--hw);transition:background .35s}
.bvk-t-index .hub-art::after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:20px 20px;mask-image:radial-gradient(ellipse at 50% 40%,#000 30%,transparent 80%);pointer-events:none}
.bvk-t-index .hub-art svg{position:relative;z-index:1;display:block;width:100%;height:100%}
.bvk-t-index .hub-art :is(.c1,.c1t){fill:var(--h1)}
.bvk-t-index .hub-art :is(.c2,.c2t){fill:var(--h2)}
.bvk-t-index .hub-art :is(.c3,.c3t){fill:var(--h3)}
.bvk-t-index .hub-art .s1{stroke:var(--h1)}
.bvk-t-index .hub-art .s2{stroke:var(--h2)}
.bvk-t-index .hub-art .s3{stroke:var(--h3)}
.bvk-t-index .hub-art .s0{stroke:rgba(255,255,255,.1)}
.bvk-t-index .hub-art :is(.sd,.s3d){stroke:#16121f}
.bvk-t-index .hub-art :is(.d0,.d0t){fill:#16121f}
.bvk-t-index .hub-art .d1{fill:#221d31}
.bvk-t-index .hub-art .d2{fill:#3a3352}
.bvk-t-index .hub-art .d3{fill:rgba(255,255,255,.13)}
.bvk-t-index .hub-art .d3b{fill:rgba(8,6,14,.62)}
.bvk-t-index .hub-art .w{fill:#fff}
.bvk-t-index .hub-art .blur{filter:blur(7px);opacity:.75}
.bvk-t-index .hub-art .tx{fill:#fff;font-family:var(--kzk-display)}
.bvk-t-index .hub-art .tx2{fill:#b3adc8;font-family:var(--kzk-font)}
.bvk-t-index .hub-art :is(.c1t,.c2t,.c3t,.d0t){font-family:var(--kzk-display)}
.bvk-t-index .hub-art .lv{fill:#e5384f}
.bvk-t-index .hub-art .yt{fill:#ff3341}
.bvk-t-index .hub-art .gr{fill:var(--h1)}
.bvk-t-index .hub-art .gr2{fill:var(--h1);opacity:.28}
.bvk-t-index .hub-art .o5{opacity:.5}.bvk-t-index .hub-art .o6{opacity:.6}.bvk-t-index .hub-art .o7{opacity:.7}.bvk-t-index .hub-art .o8{opacity:.8}.bvk-t-index .hub-art .o9{opacity:.9}
.bvk-t-index .hub-art .c1,.bvk-t-index .hub-art .c2,.bvk-t-index .hub-art .c3{transition:fill .35s}

/* canlılık: öne çıkanlar görünürken, kartlar fareyle/odakla; ekran dışında durur */
.bvk-t-index .hub-art .an{transform-box:fill-box;animation-play-state:paused}
.bvk-t-index .hub-art--live.is-vis .an,.bvk-t-index .tool:is(:hover,:focus-visible) .hub-art.is-vis .an,.bvk-t-index .hub-jumpcard:hover .hub-art .an{animation-play-state:running}
.bvk-t-index .an-glow{animation:hubGlow 2.4s ease-in-out infinite}
.bvk-t-index .an-blink{animation:hubBlink 1.6s ease-in-out infinite}
.bvk-t-index .an-slide{animation:hubSlide 4.2s var(--kzk-ease) infinite}
.bvk-t-index .an-dot1{animation:hubDot 1.4s ease-in-out infinite}
.bvk-t-index .an-dot2{animation:hubDot 1.4s ease-in-out .2s infinite}
.bvk-t-index .an-dot3{animation:hubDot 1.4s ease-in-out .4s infinite}
.bvk-t-index .an-scroll{animation:hubScroll 7.2s linear infinite}
.bvk-t-index .an-fill{transform-origin:0 50%;animation:hubFill 4.6s var(--kzk-ease) infinite}
.bvk-t-index circle.an-fill{transform-origin:50% 50%;animation-name:hubKnob}
.bvk-t-index .an-ring{animation:hubRing 6s linear infinite}
.bvk-t-index .an-pop{transform-origin:50% 50%;animation:hubPop 3s var(--kzk-ease) infinite}
.bvk-t-index .an-bounce{transform-origin:50% 100%;animation:hubBounce .9s ease-in-out infinite}
.bvk-t-index .an-mouth{transform-origin:50% 50%;animation:hubMouth .45s ease-in-out infinite alternate}
.bvk-t-index .an-eq{transform-origin:50% 50%;animation:hubEq .8s ease-in-out infinite alternate}
.bvk-t-index .an-spin{transform-box:view-box;animation:hubSpin 5s cubic-bezier(.25,.8,.3,1) infinite}
.bvk-t-index .an-glitch{animation:hubGlitch 2.2s steps(1) infinite}
@keyframes hubGlow{0%,100%{opacity:.8}50%{opacity:.25}}
@keyframes hubBlink{0%,100%{opacity:1}50%{opacity:.35}}
@keyframes hubSlide{0%,60%{transform:none;opacity:1}68%{transform:translateX(-24px);opacity:0}72%{transform:translateX(-90px);opacity:0}86%,100%{transform:none;opacity:1}}
@keyframes hubDot{0%,100%{opacity:1}50%{opacity:.25}}
@keyframes hubScroll{0%{transform:none}100%{transform:translateY(-144px)}}
@keyframes hubFill{0%,100%{transform:none}12%{transform:scaleX(.3)}70%{transform:none}}
@keyframes hubKnob{0%,100%{transform:none}12%{transform:translateX(-106px)}70%{transform:none}}
@keyframes hubRing{0%{stroke-dashoffset:90}100%{stroke-dashoffset:314}}
@keyframes hubPop{0%,72%,100%{transform:none;opacity:1}80%{transform:scale(.86);opacity:0}86%{transform:scale(1.05);opacity:1}92%{transform:none}}
@keyframes hubBounce{0%,100%{transform:none}50%{transform:translateY(-5px)}}
@keyframes hubMouth{0%{transform:scaleY(.25)}100%{transform:scaleY(1.15)}}
@keyframes hubEq{0%{transform:scaleY(.35)}100%{transform:none}}
@keyframes hubSpin{0%{transform:none}70%,100%{transform:rotate(720deg)}}
@keyframes hubGlitch{0%,100%{transform:none}20%{transform:translate(2px,-1px)}24%{transform:translate(-3px,1px)}28%{transform:none}64%{transform:translate(-2px,0)}67%{transform:none}}
@media (prefers-reduced-motion:reduce){.bvk-t-index .hub-art .an{animation:none!important}}

/* ───────── öne çıkanlar (bento) ───────── */
.bvk-t-index .hub-feats{display:grid;gap:14px;grid-template-columns:repeat(2,minmax(0,1fr))}
.bvk-t-index .hub-feat{position:relative;display:flex;flex-direction:column;min-width:0;border-radius:16px;overflow:hidden;background:var(--kzk-card);border:1px solid var(--kzk-line);color:var(--kzk-text);text-decoration:none;box-shadow:var(--kzk-shadow-card);transition:border-color .18s,transform .18s,box-shadow .18s}
.bvk-t-index .hub-feat:hover{border-color:var(--kzk-hl-line);transform:translateY(-2px);box-shadow:0 18px 40px rgba(10,6,24,.28)}
.bvk-t-index .hub-feat:focus-visible{outline:2px solid var(--kzk-focus);outline-offset:3px}
.bvk-t-index .hub-feat .hub-art{flex:1 1 auto;min-height:0}
.bvk-t-index .hub-fbody{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"rank title" "desc desc" "open open";column-gap:10px;row-gap:4px;align-items:center;padding:14px 16px 16px}
.bvk-t-index .hub-rank{grid-area:rank;padding:3px 8px;border-radius:7px;background:var(--kzk-hl-bg);border:1px solid var(--kzk-hl-line);color:var(--kzk-lilac);font:700 12px/1 var(--kzk-display)}
.bvk-t-index .hub-feat h3{grid-area:title;margin:0;font:700 17px/1.2 var(--kzk-display);letter-spacing:-.2px;color:var(--kzk-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bvk-t-index .hub-feat p{grid-area:desc;margin:2px 0 0;font:400 13px/1.45 var(--kzk-font);color:var(--kzk-muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.bvk-t-index .hub-feat .hub-open{grid-area:open;margin-top:8px}
.bvk-t-index .hub-feat--hero{grid-column:1/-1}
.bvk-t-index .hub-feat--hero .hub-art{aspect-ratio:16/5}
.bvk-t-index .hub-feat--hero h3{font-size:22px}
.bvk-t-index .hub-feat--hero p{font-size:14px}
@container kzk (min-width:1000px){
  .bvk-t-index .hub-feats{grid-template-columns:1.5fr 1fr 1fr;grid-template-rows:auto auto}
  .bvk-t-index .hub-feat--hero{grid-column:1;grid-row:1/span 2}
  .bvk-t-index .hub-feat--hero .hub-art{aspect-ratio:auto;min-height:280px}
  .bvk-t-index .hub-feat--hero .hub-fbody{padding:18px 22px 22px}
  .bvk-t-index .hub-feat--hero h3{font-size:26px;letter-spacing:-.5px}
  .bvk-t-index .hub-feat--hero p{font-size:14.5px;max-width:560px}
}
@container kzk (max-width:619px){
  .bvk-t-index .hub-feats{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;padding-bottom:6px;scrollbar-width:thin;overscroll-behavior-x:contain}
  .bvk-t-index .hub-feat{flex:0 0 82%;scroll-snap-align:start}
  .bvk-t-index .hub-feat--hero .hub-art{aspect-ratio:16/9}
  .bvk-t-index .hub-feat--hero h3{font-size:17px}
  .bvk-t-index .hub-feat--hero p{font-size:13px}
}

/* ───────── katalog kartları ───────── */
.bvk-t-index .hub-grid{display:grid;gap:14px;grid-template-columns:repeat(2,minmax(0,1fr))}
@container kzk (min-width:820px){.bvk-t-index .hub-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@container kzk (min-width:1180px){.bvk-t-index .hub-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
.bvk-t-index .hub-cell{position:relative;min-width:0}
.bvk-t-index .hub-cell .tool{position:relative;display:flex;flex-direction:column;height:100%;margin:0;padding:0;border-radius:var(--hub-r);overflow:hidden;background:var(--kzk-card);border:1px solid var(--kzk-line);color:var(--kzk-text);text-decoration:none;box-shadow:var(--kzk-shadow-card);transition:border-color .18s,transform .18s,box-shadow .18s}
.bvk-t-index .hub-cell .tool:hover{border-color:var(--kzk-hl-line);transform:translateY(-2px);box-shadow:0 16px 34px rgba(10,6,24,.24)}
.bvk-t-index .hub-cell .tool:focus-visible{outline:2px solid var(--kzk-focus);outline-offset:3px}
.bvk-t-index .hub-badges{position:absolute;top:10px;left:10px;z-index:2;display:flex;gap:6px;align-items:center}
.bvk-t-index .hub-badge{padding:3px 8px;border-radius:7px;font:700 11px/1.1 var(--kzk-font);letter-spacing:.2px;background:rgba(14,11,22,.78);border:1px solid rgba(255,255,255,.14);color:#fff;backdrop-filter:blur(6px)}
.bvk-t-index .hub-badge--pop{color:#ffd76a;border-color:rgba(249,197,68,.45)}
.bvk-t-index .hub-badge--new{color:#7df0ad;border-color:rgba(71,237,129,.4)}
.bvk-t-index .hub-anim{display:grid;place-items:center;width:22px;height:22px;border-radius:7px;background:rgba(14,11,22,.78);border:1px solid rgba(255,255,255,.14);color:#d8c4ff}
.bvk-t-index .hub-anim .hub-i{width:14px;height:14px}
.bvk-t-index .hub-body{display:block;padding:13px 16px 4px}
.bvk-t-index .hub-cell .tool h3{margin:0 0 5px;font:700 15.5px/1.25 var(--kzk-display);letter-spacing:-.15px;color:var(--kzk-text)}
.bvk-t-index .hub-cell .tool p{margin:0;font:400 13px/1.45 var(--kzk-font);color:var(--kzk-muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.bvk-t-index .hub-foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 16px 14px;min-width:0}
.bvk-t-index .hub-chips{display:flex;gap:5px;flex-wrap:wrap;min-width:0;max-height:22px;overflow:hidden}
.bvk-t-index .hub-chip{padding:3px 7px;border-radius:6px;background:var(--kzk-card-2);border:1px solid var(--kzk-line);font:600 11px/1.2 var(--kzk-font);color:var(--kzk-text-2);white-space:nowrap}
.bvk-t-index .hub-open{display:inline-flex;align-items:center;gap:6px;flex:none;font:600 13px/1 var(--kzk-font);color:var(--kzk-lilac);white-space:nowrap;transition:color .15s}
.bvk-t-index .hub-open .hub-arr{width:15px;height:15px;transition:transform .18s var(--kzk-ease)}
.bvk-t-index :is(.tool,.hub-feat):hover .hub-open{color:var(--kzk-gold)}
.bvk-t-index :is(.tool,.hub-feat):hover .hub-arr{transform:translateX(3px)}

/* favori yıldızı */
.bvk-t-index .hub-fav{position:absolute;top:8px;right:8px;z-index:3;width:34px;height:34px;display:grid;place-items:center;padding:0;border-radius:10px;border:1px solid rgba(255,255,255,.16);background:rgba(14,11,22,.72);color:#fff;cursor:pointer;opacity:0;transition:opacity .15s,transform .15s,color .15s;backdrop-filter:blur(6px)}
.bvk-t-index .hub-fav .hub-i{width:17px;height:17px}
.bvk-t-index .hub-cell:hover .hub-fav,.bvk-t-index .hub-fav:focus-visible,.bvk-t-index .hub-fav[aria-pressed=true]{opacity:1}
.bvk-t-index .hub-fav:hover{transform:scale(1.06)}
.bvk-t-index .hub-fav[aria-pressed=true]{color:#f9c544;border-color:rgba(249,197,68,.5)}
.bvk-t-index .hub-fav[aria-pressed=true] .hub-i{fill:currentColor}
@media (hover:none){.bvk-t-index .hub-fav{opacity:1}}

/* liste görünümü */
.bvk-t-index[data-view=list] .hub-grid{grid-template-columns:minmax(0,1fr);gap:10px}
@container kzk (min-width:1000px){.bvk-t-index[data-view=list] .hub-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.bvk-t-index[data-view=list] .hub-cell .tool{flex-direction:row;align-items:center;min-height:96px}
.bvk-t-index[data-view=list] .hub-cell .hub-art{flex:0 0 150px;align-self:stretch;aspect-ratio:auto}
.bvk-t-index[data-view=list] .hub-body{flex:1 1 auto;min-width:0;padding:12px 14px}
.bvk-t-index[data-view=list] .hub-cell .tool p{-webkit-line-clamp:1}
.bvk-t-index[data-view=list] .hub-foot{margin:0;flex:none;flex-direction:column;align-items:flex-end;padding:12px 52px 12px 0}
.bvk-t-index[data-view=list] .hub-chips{justify-content:flex-end;max-width:160px}
.bvk-t-index[data-view=list] .hub-badges{top:8px;left:8px}
.bvk-t-index[data-view=list] .hub-badge{font-size:10px;padding:2px 6px}
.bvk-t-index[data-view=list] .hub-fav{top:50%;margin-top:-17px;opacity:1;background:var(--kzk-card-2);border-color:var(--kzk-line);color:var(--kzk-muted)}
.bvk-t-index[data-view=list] .hub-fav[aria-pressed=true]{color:var(--kzk-gold);border-color:var(--kzk-gold-line)}

/* dar kap (telefon / dar panel): kartlar her zaman sıkı satır */
@container kzk (max-width:619px){
  .bvk-t-index .hub-grid,.bvk-t-index[data-view=list] .hub-grid{grid-template-columns:minmax(0,1fr);gap:10px}
  .bvk-t-index .hub-cell .tool{flex-direction:row;align-items:stretch;min-height:0}
  .bvk-t-index .hub-cell .hub-art{flex:0 0 112px;aspect-ratio:auto;min-height:84px}
  .bvk-t-index .hub-body{flex:1 1 auto;min-width:0;padding:11px 46px 11px 12px}
  .bvk-t-index .hub-cell .tool h3{font-size:14.5px;margin-bottom:3px}
  .bvk-t-index .hub-cell .tool p{font-size:12.5px;-webkit-line-clamp:2}
  .bvk-t-index .hub-foot,.bvk-t-index[data-view=list] .hub-foot{display:none}
  .bvk-t-index .hub-badges{top:6px;left:6px}
  .bvk-t-index .hub-badge{font-size:9.5px;padding:2px 5px}
  .bvk-t-index .hub-anim{display:none}
  .bvk-t-index .hub-fav,.bvk-t-index[data-view=list] .hub-fav{top:50%;margin-top:-16px;right:8px;width:32px;height:32px;opacity:1;background:transparent;border-color:transparent;color:var(--kzk-faint);backdrop-filter:none}
  .bvk-t-index .hub-fav[aria-pressed=true]{color:var(--kzk-gold)}
  .bvk-t-index .hub-ctl{width:100%;justify-content:space-between}
  .bvk-t-index .hub-ctl-lbl{display:none}
  .bvk-t-index .hub-view{display:none!important}
  .bvk-t-index .hub-cats,.bvk-t-index .hub-tags{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 -16px;padding:2px 16px 4px;overscroll-behavior-x:contain}
  .bvk-t-index .hub-cats::-webkit-scrollbar,.bvk-t-index .hub-tags::-webkit-scrollbar{display:none}
  .bvk-t-index .hub-cats>button,.bvk-t-index .hub-tags>button{flex:none}
  .bvk-t-index .hub-row3{display:block}
  .bvk-t-index .hub-pal{margin-top:12px}
  .bvk-t-index .hub-sec-head{align-items:flex-start;flex-wrap:wrap}
  .bvk-t-index .hub-featsec .hub-aside{display:none}
  .bvk-t-index .hub-ctl .kzk-seg{flex:1 1 auto}
  .bvk-t-index .hub-pal{gap:5px}
  .bvk-t-index .hub-pal>button{width:28px;height:28px}
  .bvk-t-index .hub-h2{font-size:19px}
  .bvk-t-index .hub-stats li{padding:6px 11px;font-size:12px}
}
@container kzk (max-width:619px){
  .bvk-t-index .hub-sec-head:has(.hub-sec-ic){flex-wrap:nowrap}
  .bvk-t-index .hub-sec-n{align-self:center}
}

/* ───────── kaldığın yerden ───────── */
.bvk-t-index .hub-jump-row{display:flex;gap:10px;flex-wrap:wrap}
.bvk-t-index .hub-jumpcard{display:flex;align-items:center;gap:10px;padding:6px 14px 6px 6px;border-radius:12px;background:var(--kzk-card);border:1px solid var(--kzk-line);color:var(--kzk-text);text-decoration:none;min-width:0;max-width:280px;transition:border-color .15s}
.bvk-t-index .hub-jumpcard:hover{border-color:var(--kzk-hl-line)}
.bvk-t-index .hub-jumpcard:focus-visible{outline:2px solid var(--kzk-focus);outline-offset:2px}
.bvk-t-index .hub-art--mini{width:72px;flex:none;border-radius:8px}
.bvk-t-index .hub-jump-txt{display:flex;flex-direction:column;gap:2px;min-width:0}
.bvk-t-index .hub-jump-name{font:600 13.5px/1.2 var(--kzk-font);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bvk-t-index .hub-jump-tag{font:500 11.5px/1.2 var(--kzk-font);color:var(--kzk-muted)}
.bvk-t-index .hub-jumpcard.is-fav .hub-jump-tag{color:var(--kzk-gold)}
@container kzk (max-width:619px){
  .bvk-t-index .hub-jump-row{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 -16px;padding:0 16px 4px}
  .bvk-t-index .hub-jumpcard{flex:none}
  .bvk-t-index .hub-jump .hub-aside{display:none}
}

/* ───────── boş durum ───────── */
.bvk-t-index .hub-empty{margin:4px 0 34px;padding:34px 20px;border-radius:16px;border:1px dashed var(--kzk-line-2);background:var(--kzk-card);text-align:center}
.bvk-t-index .hub-empty-i{width:40px!important;height:40px!important;margin:0 auto 10px;color:var(--kzk-lilac)}
.bvk-t-index .hub-empty p{margin:6px 0 14px;color:var(--kzk-muted);font-size:14px}
.bvk-t-index .hub-sugg{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:16px}
.bvk-t-index .hub-sugg>button{height:32px;padding:0 12px;border-radius:999px;border:1px solid var(--kzk-hl-line);background:var(--kzk-hl-bg);color:var(--kzk-lilac);font:600 13px/1 var(--kzk-font);cursor:pointer}
.bvk-t-index .hub-sugg>button:hover{border-color:var(--kzk-lilac)}

/* ───────── panel bandı ───────── */
.bvk-t-index .hub-cta-band{position:relative;display:flex;align-items:center;gap:22px;padding:22px 24px;border-radius:18px;overflow:hidden;background:linear-gradient(120deg,color-mix(in srgb,var(--kzk-purple) 22%,var(--kzk-card)),var(--kzk-card) 60%);border:1px solid var(--kzk-hl-line)}
.bvk-t-index .hub-cta-art{position:relative;flex:none;width:96px;height:72px}
.bvk-t-index .hub-cta-art span{position:absolute;width:64px;height:40px;border-radius:9px;border:1px solid rgba(255,255,255,.18);background:linear-gradient(135deg,#8a55ef,#b480ff)}
.bvk-t-index .hub-cta-art span:nth-child(1){left:0;top:0;opacity:.45}
.bvk-t-index .hub-cta-art span:nth-child(2){left:16px;top:16px;opacity:.7;background:linear-gradient(135deg,#6d3ce0,#8a55ef)}
.bvk-t-index .hub-cta-art span:nth-child(3){left:32px;top:32px;background:linear-gradient(135deg,#2a2240,#3b3157);box-shadow:inset 0 0 0 2px #f9c544}
.bvk-t-index .hub-cta-txt{flex:1 1 auto;min-width:0}
.bvk-t-index .hub-cta-txt p{margin:6px 0 0;color:var(--kzk-muted);font:400 14px/1.5 var(--kzk-font);max-width:620px}
.bvk-t-index .hub-cta-btn{flex:none;text-decoration:none}
.bvk-t-index .hub-cta-btn .hub-arr{width:16px;height:16px}
@container kzk (max-width:619px){
  .bvk-t-index .hub-cta-band{flex-direction:column;align-items:flex-start;gap:14px;padding:18px}
  .bvk-t-index .hub-cta-art{display:none}
  .bvk-t-index .hub-cta-btn{width:100%;justify-content:center}
}

/* ───────── gömülü (panel iframe) ───────── */
html.bv-embed .bvk-t-index .hub-cta-band,html.bv-embed .bvk-t-index .hub-stats{display:none}
html.bv-embed .bvk-t-index .hub-bar{margin-top:4px}

/* ───────── tur 1 düzeltmeleri ───────── */
/* amiral araçlar varsayılan görünümde katalogda tekrarlanmaz (süzme/arama etkinse hepsi görünür) */
.bvk-t-index.is-dedupe .hub-cell[data-feat]{display:none}
/* kart başına "Aracı aç" tekrarı gürültü: kartın tamamı zaten bağlantı */
.bvk-t-index .hub-cell .hub-open{display:none}
.bvk-t-index .hub-foot{justify-content:flex-start}
/* yıldız: masaüstünde sönük de olsa bulunabilir; dokunmatikte 40px */
.bvk-t-index .hub-fav{opacity:.6}
@media (pointer:coarse){.bvk-t-index .hub-fav{width:40px;height:40px}}
/* palet seçimi altın değil mürekkep halkası (altın = seçili kategori + odak) */
.bvk-t-index .hub-pal>button[aria-checked=true]{border-color:var(--kzk-text);box-shadow:none}
/* açık tema: koyu kuyular kâğıt gibi ince çerçeve + yumuşak gölge */
:root[data-theme=light] .bvk-t-index .hub-art:not(.hub-art--mini){box-shadow:inset 0 0 0 1px rgba(30,20,60,.08)}
:root[data-theme=light] .bvk-t-index :is(.tool,.hub-feat){box-shadow:0 1px 2px rgba(40,30,80,.08),0 8px 22px rgba(40,30,80,.08)}
@media (prefers-color-scheme:light){:root:not([data-theme=dark]) .bvk-t-index :is(.tool,.hub-feat){box-shadow:0 1px 2px rgba(40,30,80,.08),0 8px 22px rgba(40,30,80,.08)}}
/* klavye ipucu dokunmatikte anlamsız */
@media (hover:none),(max-width:600px){.bvk-t-index .hub-kbd{display:none}.bvk-t-index .hub-search input{padding-right:16px}}
/* hero hap sayısı telefonda tek satır */
@media (max-width:480px){html body main:has(>.bvk-t-index) .hub-stats li:nth-child(n+4){display:none}}
/* telefon: kaydırılan çip sıralarında sağ kenar solması + satır ritmi */
@container kzk (max-width:619px){
  .bvk-t-index .hub-cats,.bvk-t-index .hub-tags{scroll-snap-type:x proximity;-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent);mask-image:linear-gradient(90deg,#000 88%,transparent)}
  .bvk-t-index .hub-cats>button,.bvk-t-index .hub-tags>button{scroll-snap-align:start}
  .bvk-t-index .hub-cell .tool{min-height:76px}
}
/* gömülü: amiral kartlar tek yatay şerit (770'te 5 kart üst üste binmesin) */
html.bv-embed .bvk-t-index .hub-feats{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;padding-bottom:6px;scrollbar-width:thin;overscroll-behavior-x:contain}
html.bv-embed .bvk-t-index .hub-feat{flex:0 0 min(46%,380px);scroll-snap-align:start}
html.bv-embed .bvk-t-index .hub-feat--hero{flex-basis:min(60%,480px)}
html.bv-embed .bvk-t-index .hub-feat--hero .hub-art{aspect-ratio:16/9;min-height:0}
@container kzk (max-width:619px){html.bv-embed .bvk-t-index .hub-feat,html.bv-embed .bvk-t-index .hub-feat--hero{flex-basis:82%}}