/* ---------- Favori Buildler ---------- */
.fv-root svg { width: 16px; height: 16px; flex: none; }
.fv-hero { position: relative; overflow: hidden; isolation: isolate; background: #06070a; min-height: 440px; display: flex; align-items: flex-end; }
.fv-hero-in { width: 100%; padding-top: 80px; padding-bottom: 0; }
.fv-hero-in > * { animation: rise .9s cubic-bezier(.2,.8,.2,1) both; }
.fv-title { margin: 14px 0 12px; font: 700 clamp(38px, 5vw, 66px)/1 var(--f-display); background: linear-gradient(180deg, #fff3d6, #d9b26f 62%, #8f7140); -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 8px 30px rgba(0,0,0,.9)); }
.fv-sub { max-width: 640px; margin: 0 0 30px; color: #b6aa94; font-size: 17px; line-height: 1.6; }
/* sekmeler heykel şeridinin altında; aşağı kaydırınca üst menünün altında yapışık kalır */
.fv-tabs { position: sticky; top: var(--hdr); z-index: 5; display: flex; gap: 6px; margin-bottom: 28px; border-bottom: 1px solid rgba(217,178,111,.2);
  background: linear-gradient(180deg, rgba(10,11,14,.94), rgba(10,11,14,.86)); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.fv-tab { position: relative; display: flex; align-items: center; gap: 12px; padding: 14px 22px 16px 14px; color: #8b7f6b; transition: color .25s, background .25s;
  background: linear-gradient(180deg, transparent, rgba(255,255,255,.02)); border: 1px solid transparent; border-bottom: 0; }
/* iki sekme alanı eşit paylaşır, içerikleri ortalanır */
.fv-tab { flex: 1 1 0; min-width: 0; justify-content: center; }
.fv-tab:hover { color: #f3e2bb; }
.fv-tab.on { color: #fff3d6; background: linear-gradient(180deg, rgba(200,29,51,.2), rgba(10,9,9,.95)); border-color: rgba(217,178,111,.28); }
.fv-tab.on::after { content: ''; position: absolute; left: 12px; right: 12px; bottom: -1px; height: 2px; background: linear-gradient(90deg, transparent, #e2bd78, transparent); box-shadow: 0 0 12px #e2bd78; }
.fv-tic { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid rgba(217,178,111,.25); background: rgba(0,0,0,.4); }
.fv-tic svg { width: 20px; height: 20px; }
.fv-tab.verified.on .fv-tic { color: #7fe39a; border-color: rgba(95,211,122,.5); box-shadow: 0 0 16px rgba(95,211,122,.25); }
.fv-tab.creator.on .fv-tic { color: #c99cff; border-color: rgba(201,156,255,.5); box-shadow: 0 0 16px rgba(201,156,255,.25); }
.fv-tab b { display: block; font: 700 16px var(--f-display); letter-spacing: .02em; }
.fv-tab small { display: block; font: 600 11px var(--f-head); letter-spacing: .16em; text-transform: uppercase; color: #7d7262; }

.fv-sec { padding-top: 34px; overflow-x: clip; min-height: 100vh; }
.fv-feat-h { display: flex; align-items: baseline; gap: 18px; flex-wrap: wrap; margin-bottom: 16px; }
.fv-feat-h h2 { display: flex; align-items: center; gap: 10px; margin: 0; font: 700 24px var(--f-display); color: #f3e2bb; }
.fv-feat-h h2 svg { width: 20px; height: 20px; color: #e2bd78; filter: drop-shadow(0 0 8px rgba(226,189,120,.6)); }
.fv-feat-h p { margin: 0; color: #7d7262; font-size: 14px; }
.fv-feat { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-bottom: 34px; }
.fv-fcard { position: relative; display: flex; align-items: flex-end; min-height: 210px; overflow: hidden; isolation: isolate; color: inherit;
  border: 1px solid rgba(217,178,111,.22); box-shadow: 0 18px 44px rgba(0,0,0,.5); transition: border-color .3s, box-shadow .3s; }
.fv-fcard:hover { border-color: rgba(243,220,170,.6); box-shadow: 0 22px 54px rgba(0,0,0,.6), 0 0 34px rgba(200,29,51,.25); }
.fv-fbg { position: absolute; inset: 0; z-index: -3; background: center 30% / cover; filter: saturate(1.1) brightness(.75); transition: transform .8s cubic-bezier(.2,.8,.2,1); }
.fv-fcard:hover .fv-fbg { transform: scale(1.06); }
.fv-fcard::after { content: ''; position: absolute; inset: 0; z-index: -2; background: linear-gradient(90deg, rgba(8,7,8,.97) 25%, rgba(8,7,8,.7) 55%, rgba(8,7,8,.15)), linear-gradient(0deg, rgba(8,7,8,.8), transparent 50%); }
.fv-fmed { position: absolute; right: 18px; top: 50%; z-index: -1; width: 150px; height: 150px; transform: translateY(-50%); border-radius: 50%; padding: 3px;
  background: conic-gradient(#f3dcaa, #8f6a35, #f3dcaa, #8f6a35, #f3dcaa); box-shadow: 0 0 34px rgba(200,29,51,.45); opacity: .9; transition: transform .6s; }
.fv-fmed img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; border: 3px solid #0a0909; }
.fv-fcard:hover .fv-fmed { transform: translateY(-50%) scale(1.06) rotate(-3deg); }
.fv-fin { display: grid; gap: 8px; padding: 22px 190px 20px 24px; }
.fv-ftitle { font: 700 21px/1.25 var(--f-display); color: #fff3d6; text-shadow: 0 2px 12px #000; }
.fv-fin > small { color: #a99d88; font-size: 13.5px; }
.fv-fin em, .fv-rmeta em { font-style: normal; font-weight: 700; color: #e2bd78; }
.fv-sample { position: absolute; right: 10px; top: 10px; padding: 2px 8px; font: 700 9.5px var(--f-head); letter-spacing: .18em; text-transform: uppercase; color: #0b0d14; background: #8fb6ff; }
.fv-sample.in { position: static; }

.fv-badge { display: inline-flex; align-items: center; gap: 6px; justify-self: start; padding: 3px 9px; font: 700 10.5px var(--f-head); letter-spacing: .16em; text-transform: uppercase; }
.fv-badge svg { width: 14px; height: 14px; }
.fv-badge.v { color: #9ff0b4; background: rgba(60,160,90,.18); border: 1px solid rgba(95,211,122,.45); }
.fv-badge.c { color: #dcc2ff; background: rgba(140,90,220,.18); border: 1px solid rgba(201,156,255,.45); }
.fv-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.fv-chip { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; font: 600 12.5px var(--f-body); color: #e2d6bd; background: rgba(10,8,8,.75); border: 1px solid rgba(217,178,111,.2); }
.fv-chip.cls { padding: 2px 10px 2px 3px; }
.fv-chip.cls img { width: 22px; height: 22px; border-radius: 2px; object-fit: cover; object-position: center 20%; }
.fv-chip.dim { color: #a99d88; }
.fv-chip.hc { color: #ff8f80; border-color: rgba(255,107,90,.4); }
.fv-chip.more { color: #a99d88; }
.fv-chip.d-beginner { color: #9ff0b4; } .fv-chip.d-intermediate { color: #f2c57a; } .fv-chip.d-advanced { color: #ff9a8a; }

.fv-filter { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; padding: 14px; margin-bottom: 14px; background: linear-gradient(180deg, #14110f, #0c0a0a); border: 1px solid rgba(217,178,111,.16); }
.fv-search { display: flex; align-items: center; gap: 10px; flex: 1 1 240px; height: 44px; padding: 0 14px; background: rgba(0,0,0,.45); border: 1px solid rgba(217,178,111,.2); }
.fv-search:focus-within { border-color: rgba(243,220,170,.55); box-shadow: 0 0 18px rgba(200,29,51,.15); }
.fv-search svg { color: #7d7262; }
.fv-search input { flex: 1; min-width: 0; color: var(--text); background: none; border: 0; outline: none; font: 15px var(--f-body); }
.fv-filter select { height: 44px; padding: 0 34px 0 12px; color: #e2d6bd; background: #0d0b0b url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e2bd78' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") right 10px center / 14px no-repeat;
  border: 1px solid rgba(217,178,111,.2); font: 600 14px var(--f-body); -webkit-appearance: none; appearance: none; cursor: pointer; }
.fv-filter select:hover { border-color: rgba(243,220,170,.5); }

.fv-list { display: grid; gap: 12px; }
.fv-lh { color: #7d7262; font-size: 13.5px; }
.fv-lh b { color: #e8d9bb; }
.fv-lh a { color: var(--gold2); margin-left: 6px; }
.fv-row { position: relative; display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: 18px; padding: 18px 20px; overflow: hidden; isolation: isolate;
  background: linear-gradient(180deg, #13100e, #0b0a0a); border: 1px solid rgba(217,178,111,.15); transition: border-color .3s, box-shadow .3s; animation: rise .5s cubic-bezier(.2,.8,.2,1) both; }
.fv-row:hover { border-color: rgba(243,220,170,.45); box-shadow: 0 0 28px rgba(200,29,51,.15); }
.fv-rbg { position: absolute; top: 0; right: 0; bottom: 0; width: 55%; z-index: -1; background: center 30% / cover; opacity: .35; filter: saturate(1.1);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 60%); mask-image: linear-gradient(90deg, transparent, #000 60%); transition: opacity .4s; }
.fv-row:hover .fv-rbg { opacity: .5; }
.fv-por img { width: 76px; height: 76px; object-fit: cover; object-position: center 20%; border: 1px solid rgba(226,189,120,.5); box-shadow: 0 0 0 3px rgba(10,9,9,.9), 0 0 0 4px rgba(226,189,120,.25), 0 10px 22px rgba(0,0,0,.6); }
.fv-rmain { display: grid; gap: 8px; min-width: 0; }
.fv-rtitle { font: 700 19px/1.3 var(--f-display); color: #f3e2bb; }
.fv-rtitle:hover { color: #fff; }
.fv-rmeta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; color: #8b7f6b; font-size: 13.5px; }
.fv-gems { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 2px; }
.fv-gem { width: 46px; height: 46px; display: grid; place-items: center; background: radial-gradient(circle, #1f1813, #070606); border: 1px solid rgba(217,178,111,.25); transition: transform .2s, border-color .2s; }
.fv-gem img { width: 40px; height: 40px; object-fit: contain; }
.fv-gem i { font: 700 15px var(--f-display); font-style: normal; color: #b39a6c; }
.fv-gem:hover { transform: translateY(-3px); border-color: #e2bd78; }
.fv-rfoot { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px; margin-top: 4px; }
.fv-acts { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.fv-act { display: inline-flex; align-items: center; gap: 7px; height: 36px; padding: 0 12px; cursor: pointer; color: #c9bba1; background: rgba(0,0,0,.4);
  border: 1px solid rgba(217,178,111,.2); font: 600 13px var(--f-body); transition: all .2s; }
.fv-act b { color: #fff3d6; }
.fv-act:hover { color: #fff3d6; border-color: rgba(243,220,170,.55); }
.fv-act.on { color: #ff8f9a; border-color: rgba(255,90,100,.55); background: rgba(200,29,51,.18); }
.fv-act.on svg { fill: currentColor; }
.fv-views { display: inline-flex; align-items: center; gap: 6px; margin-left: 4px; color: #6f6656; font-size: 12.5px; }
.fv-empty, .fv-none { grid-column: 1 / -1; color: #7d7262; }
.fv-none { display: grid; justify-items: center; gap: 6px; padding: 40px; text-align: center; border: 1px dashed rgba(217,178,111,.2); }
.fv-none svg { width: 30px; height: 30px; color: var(--ember); }
.fv-none b { font: 700 18px var(--f-display); color: #e8d9bb; }
.fv-none p { margin: 0; }

/* rozetler: build rehberi sayfası ve yönetici kontrolü */
.bg-badge-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 10px; }
.bg-admin-badge { display: inline-flex; align-items: center; gap: 8px; padding: 6px 10px; background: rgba(0,0,0,.5); border: 1px dashed rgba(255,90,100,.4); font-size: 12.5px; color: #a99d88; }
.bg-admin-badge select { height: 30px; color: #f3e2bb; background: #0d0b0b; border: 1px solid rgba(217,178,111,.3); font: 600 12.5px var(--f-body); }
.bg-admin-badge label { display: inline-flex; align-items: center; gap: 5px; cursor: pointer; }

@media (max-width: 1000px) {
  .fv-feat { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .fv-hero { min-height: 0; }
  .fv-hero-in { padding-top: 46px; }
  .fv-tabs { gap: 2px; }
  .fv-tab { flex: 1; padding: 10px 8px 12px; gap: 8px; }
  .fv-tic { width: 32px; height: 32px; }
  .fv-tab b { font-size: 13px; }
  .fv-fin { padding: 18px 18px 16px; }
  .fv-fmed { width: 96px; height: 96px; right: -14px; opacity: .45; }
  .fv-ftitle { font-size: 18px; }
  .fv-filter select { flex: 1 1 45%; }
  .fv-row { grid-template-columns: 52px minmax(0, 1fr); gap: 12px; padding: 14px; }
  .fv-por img { width: 52px; height: 52px; }
  .fv-rtitle { font-size: 16px; }
  .fv-gem { width: 38px; height: 38px; }
  .fv-gem img { width: 32px; height: 32px; }
  .fv-rbg { width: 100%; opacity: .18; }
}
