/* ═══════════════════════════════════════════════════════════════
   İrem Şahin — Video Montaj Sistemi
   Tasarım: krem/bej + koyu · serif başlık · sinema/analog estetiği
   ═══════════════════════════════════════════════════════════════ */

:root {
  --krem:      #efe7d7;
  --krem-koyu: #ded3bd;
  --murekkep:  #1a1713;
  --altin:     #b99b5f;
  --vurgu:     #c8a45c;
  --cizgi:     rgba(26, 23, 19, 0.12);
  --golge:     0 18px 50px rgba(10, 8, 5, 0.35);
  --radius:    22px;
  --serif:     "Playfair Display", "Georgia", "Times New Roman", serif;
  --sans:      "Inter", -apple-system, "Segoe UI", Roboto, sans-serif;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

html, body {
  height: 100%;
  background: var(--murekkep);
  color: var(--murekkep);
  font-family: var(--sans);
  overflow: hidden;
}

/* ───────────── SAHNE (ana / panel geçişi) ───────────── */
.sahne { display: none; }
.sahne.aktif { display: flex; }

#ana {
  position: fixed; inset: 0;
  flex-direction: column;
  padding: 3.2vh 4vw 2.4vh;
  background:
    radial-gradient(1200px 700px at 70% -10%, #2a2419 0%, transparent 60%),
    linear-gradient(160deg, #14110d 0%, #1f1a12 55%, #0e0b08 100%);
  color: var(--krem);
}

/* ───────────── ÜST BAŞLIK ───────────── */
.ust-baslik {
  display: flex; align-items: center; justify-content: space-between;
  padding-bottom: 2.2vh;
}
.ust-baslik h1 {
  font-family: var(--serif);
  font-size: clamp(20px, 2.4vw, 34px);
  font-weight: 700;
  letter-spacing: .5px;
  line-height: 1.05;
  color: var(--krem);
}
.ust-baslik h1 span {
  display: block;
  font-family: var(--sans);
  font-size: clamp(10px, .95vw, 13px);
  font-weight: 500;
  letter-spacing: 3.5px;
  text-transform: uppercase;
  color: var(--altin);
  margin-top: 6px;
}
.durum-nokta {
  width: 12px; height: 12px; border-radius: 50%;
  background: #6b6255;
  box-shadow: 0 0 0 4px rgba(107, 98, 85, .18);
  transition: background .3s, box-shadow .3s;
}
.durum-nokta.canli {
  background: #57c98a;
  box-shadow: 0 0 0 4px rgba(87, 201, 138, .22), 0 0 18px rgba(87, 201, 138, .6);
}
.durum-nokta.olu { background: #c95b5b; box-shadow: 0 0 0 4px rgba(201,91,91,.22); }

/* ───────────── 3 BANT ───────────── */
.bantlar {
  flex: 1;
  display: flex; flex-direction: column;
  gap: 1.8vh;
  min-height: 0;
}
.bant {
  position: relative;
  flex: 1;
  min-height: 0;
  border-radius: var(--radius);
  overflow: hidden;
  cursor: pointer;
  border: 3px solid #0a0806;
  box-shadow: var(--golge);
  outline: none;
  transition: flex .55s cubic-bezier(.22,.9,.28,1), transform .35s, box-shadow .35s;
}
.bant:focus-visible { box-shadow: var(--golge), 0 0 0 3px var(--vurgu); }
.bant:hover { transform: translateY(-3px); box-shadow: 0 26px 60px rgba(0,0,0,.5); }

.bant-arka {
  position: absolute; inset: 0;
  background-size: cover; background-position: center;
  transform: scale(1.04);
  transition: transform .8s cubic-bezier(.22,.9,.28,1), filter .4s;
}
.bant:hover .bant-arka { transform: scale(1.10); filter: brightness(1.08); }

/* arkaplan görselleri — gradyan + doku (dış servis yok) */
.arastirma-arka {
  background:
    linear-gradient(120deg, rgba(20,17,13,.72) 0%, rgba(20,17,13,.28) 55%, rgba(20,17,13,.6) 100%),
    repeating-conic-gradient(from 20deg at 30% 40%, #cabfa6 0% 6%, #e5dcc6 6% 12%, #b8a883 12% 18%);
  background-blend-mode: multiply, normal;
}
.tasarim-arka {
  background:
    linear-gradient(120deg, rgba(12,8,22,.68) 0%, rgba(60,20,80,.34) 50%, rgba(12,8,22,.66) 100%),
    radial-gradient(circle at 22% 55%, #7b3fb0 0%, transparent 42%),
    radial-gradient(circle at 68% 40%, #d94f8a 0%, transparent 40%),
    linear-gradient(90deg, #2a1240, #1b0d2c);
}
.paylasim-arka {
  background:
    linear-gradient(120deg, rgba(14,16,20,.66) 0%, rgba(14,16,20,.30) 55%, rgba(14,16,20,.62) 100%),
    linear-gradient(105deg, #b9c3cc 0%, #dfe5ea 45%, #9aa6b2 100%);
}

.bant-icerik {
  position: relative; z-index: 2;
  height: 100%;
  display: flex; flex-direction: column; justify-content: center;
  padding: 0 clamp(24px, 4vw, 64px);
}
.bant-no {
  font-family: var(--serif);
  font-size: clamp(14px, 1.4vw, 20px);
  color: var(--vurgu);
  letter-spacing: 4px;
  margin-bottom: 6px;
}
.bant-icerik h2 {
  font-family: var(--serif);
  font-size: clamp(30px, 4.4vw, 68px);
  font-weight: 700;
  line-height: 1;
  color: #fff;
  text-shadow: 0 3px 22px rgba(0,0,0,.55);
}
.bant-icerik p {
  margin-top: 10px;
  font-size: clamp(11px, 1.05vw, 15px);
  letter-spacing: 1.2px;
  color: rgba(255,255,255,.82);
  text-shadow: 0 2px 12px rgba(0,0,0,.6);
}
.bant-ok {
  position: absolute; right: clamp(20px, 3vw, 46px); top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  font-size: clamp(24px, 3vw, 46px);
  color: rgba(255,255,255,.65);
  transition: transform .4s, color .4s;
}
.bant:hover .bant-ok { transform: translate(8px, -50%); color: var(--vurgu); }

/* ───────────── ALT BİLGİ ───────────── */
.alt-bilgi {
  display: flex; justify-content: space-between; align-items: center;
  padding-top: 1.8vh;
  font-size: 12px; letter-spacing: 1.5px;
  color: #8a8272;
  text-transform: uppercase;
}

/* ───────────── PANEL (tam ekran, blur arkaplan) ───────────── */
.panel {
  position: fixed; inset: 0; z-index: 100;
  display: none;
  align-items: center; justify-content: center;
}
.panel.acik { display: flex; animation: panelGir .35s ease; }
@keyframes panelGir { from { opacity: 0; } to { opacity: 1; } }

.panel-arka {
  position: absolute; inset: 0;
  background-size: cover; background-position: center;
  filter: blur(22px) brightness(.5);
  transform: scale(1.12);
}
.panel-kutu {
  position: relative;
  width: min(1500px, 94vw);
  height: min(92vh, 1000px);
  border-radius: var(--radius);
  background: rgba(239, 231, 215, .96);
  backdrop-filter: blur(6px);
  box-shadow: 0 40px 100px rgba(0,0,0,.6);
  border: 3px solid #0a0806;
  overflow: hidden;
  display: flex; flex-direction: column;
  animation: kutuGir .4s cubic-bezier(.22,.9,.28,1);
}
@keyframes kutuGir { from { transform: translateY(24px) scale(.98); opacity: 0; } to { transform: none; opacity: 1; } }

.panel-kapat {
  position: absolute; top: 18px; right: 22px; z-index: 5;
  width: 44px; height: 44px;
  border: none; border-radius: 50%;
  background: rgba(26,23,19,.08);
  color: var(--murekkep);
  font-size: 20px; cursor: pointer;
  transition: background .25s, transform .25s;
}
.panel-kapat:hover { background: var(--murekkep); color: var(--krem); transform: rotate(90deg); }

.panel-baslik {
  padding: 34px 46px 20px;
  border-bottom: 1px solid var(--cizgi);
}
.panel-baslik h2 {
  font-family: var(--serif);
  font-size: clamp(24px, 2.6vw, 40px);
  font-weight: 700;
  color: var(--murekkep);
}
.panel-baslik p {
  margin-top: 6px;
  font-size: 13px; letter-spacing: 2px; text-transform: uppercase;
  color: #8a7f68;
}
.panel-govde {
  flex: 1; overflow: auto;
  padding: 30px 46px 46px;
}

/* ───────────── KAYNAK KARTLARI (araştırma paneli) ───────────── */
.kaynak-izgara {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 20px;
}
.kaynak-kart {
  background: rgba(255,255,255,.72);
  border: 1px solid var(--cizgi);
  border-radius: 16px;
  padding: 24px 22px;
  min-height: 230px;
  display: flex; flex-direction: column;
  cursor: pointer;
  transition: transform .3s, box-shadow .3s, background .3s;
}
.kaynak-kart:hover {
  transform: translateY(-4px);
  background: #fff;
  box-shadow: 0 18px 40px rgba(26,23,19,.14);
}
.kaynak-kart h3 {
  font-family: var(--serif);
  font-size: 20px;
  margin-bottom: 12px;
  color: var(--murekkep);
}
.kaynak-kart p {
  font-size: 13.5px; line-height: 1.6; color: #6f6656;
  flex: 1;
}
.kaynak-kart .kk-alt {
  margin-top: 14px; padding-top: 12px;
  border-top: 1px dashed var(--cizgi);
  font-size: 11px; letter-spacing: 2px; text-transform: uppercase;
  color: var(--altin);
}

.bos-durum {
  text-align: center;
  padding: 70px 20px;
  color: #8a7f68;
  font-family: var(--serif);
  font-size: 19px;
}
.bos-durum small {
  display: block; margin-top: 12px;
  font-family: var(--sans); font-size: 13px;
  letter-spacing: 1px; color: #a89e88;
}

@media (max-width: 780px) {
  .bant-icerik h2 { font-size: 34px; }
  .panel-baslik, .panel-govde { padding-left: 22px; padding-right: 22px; }
}

/* ═══════════════ İLERLEME ÇUBUĞU (bant içi dolan pil) ═══════════════ */
.bant { position: relative; }
.bant-dolgu {
  position: absolute; left: 0; top: 0; bottom: 0;
  width: 0%;
  background: linear-gradient(90deg, rgba(200,164,92,.55), rgba(212,178,106,.85));
  transition: width .5s cubic-bezier(.22,.9,.28,1);
  z-index: 1;
  pointer-events: none;
}
.bant-dolgu::after {
  content: ""; position: absolute; right: 0; top: 0; bottom: 0; width: 3px;
  background: rgba(255,255,255,.85);
  box-shadow: 0 0 14px rgba(255,255,255,.9);
}
.bant.tamamlandi .bant-dolgu { background: linear-gradient(90deg, rgba(87,201,138,.5), rgba(110,220,155,.8)); }
.bant-icerik { position: relative; z-index: 2; }
.bant-yuzde {
  display: inline-block; margin-top: 12px;
  font-family: var(--serif); font-size: clamp(13px,1.3vw,17px);
  color: #fff; letter-spacing: 1px;
  background: rgba(0,0,0,.42); backdrop-filter: blur(4px);
  padding: 5px 14px; border-radius: 20px;
  border: 1px solid rgba(255,255,255,.22);
}
.bant-yuzde:empty { display: none; }

/* ═══════════════ ARAŞTIRMA PANELİ ═══════════════ */
.ar-giris {
  display: grid; grid-template-columns: 1fr auto; gap: 12px;
  margin-bottom: 22px; align-items: stretch;
}
.ar-giris input {
  width: 100%; padding: 15px 20px;
  border: 2px solid var(--cizgi); border-radius: 14px;
  font-size: 15.5px; font-family: var(--sans); background: #fff;
  color: var(--murekkep); outline: none;
  transition: border-color .25s, box-shadow .25s;
}
.ar-giris input:focus { border-color: var(--vurgu); box-shadow: 0 0 0 4px rgba(200,164,92,.15); }
.ar-giris button {
  padding: 15px 30px; border: none; border-radius: 14px;
  background: var(--murekkep); color: var(--krem);
  font-size: 15px; font-weight: 600; cursor: pointer;
  white-space: nowrap; transition: background .25s, transform .2s;
}
.ar-giris button:hover { background: #000; transform: translateY(-1px); }

.ar-kaldigi {
  padding: 13px 18px; margin-bottom: 20px;
  background: rgba(200,164,92,.14); border-radius: 12px;
  font-size: 13px; color: #6b5520;
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
}
.ar-devam {
  padding: 7px 18px; border: none; border-radius: 9px;
  background: var(--vurgu); color: #241c0c;
  font-size: 12.5px; font-weight: 700; cursor: pointer;
}
.ar-devam:hover { background: #d4b26a; }

.ar-yukleniyor { text-align: center; padding: 60px 20px; color: #6f6656; }
.ar-yukleniyor b { color: var(--murekkep); }
.ar-spinner {
  width: 44px; height: 44px; margin: 0 auto 18px;
  border: 4px solid var(--cizgi); border-top-color: var(--vurgu);
  border-radius: 50%; animation: don .9s linear infinite;
}
@keyframes don { to { transform: rotate(360deg); } }
.ar-yukleniyor small { display: block; margin-top: 8px; font-size: 12px; color: #a89e88; }
.ar-hata { padding: 22px; border-radius: 14px; background: #f6e3e3; color: #8a3b3b; font-size: 14px; }

.ar-ust {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 16px; margin-bottom: 18px; padding-bottom: 15px;
  border-bottom: 1px solid var(--cizgi); flex-wrap: wrap;
}
.ar-ust-sol { min-width: 0; }
.ar-ust h3 { font-family: var(--serif); font-size: clamp(20px,2.2vw,26px); color: var(--murekkep); word-break: break-word; }
.ar-meta { font-size: 12px; color: #a89e88; }
.ar-yeni {
  padding: 9px 18px; border: 1px solid var(--cizgi); border-radius: 10px;
  background: transparent; color: var(--murekkep); cursor: pointer;
  font-size: 12.5px; white-space: nowrap; transition: background .25s;
}
.ar-yeni:hover { background: rgba(0,0,0,.05); }

/* kaynak kartları — eşit ve tıklanabilir */
.ar-kaynaklar {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 14px; margin-bottom: 16px;
}
.ar-kart {
  position: relative; display: flex; flex-direction: column;
  border: 2px solid var(--cizgi); border-radius: 15px;
  padding: 16px 16px 12px; background: rgba(255,255,255,.72);
  cursor: pointer; user-select: none;
  min-height: 148px;
  transition: transform .22s, box-shadow .22s, border-color .22s, background .22s;
}
.ar-kart:hover { transform: translateY(-3px); box-shadow: 0 14px 30px rgba(26,23,19,.13); }
.ar-kart:active { transform: translateY(-1px) scale(.995); }
.ar-kart.secili { border-color: var(--vurgu); background: #fff; box-shadow: 0 14px 32px rgba(200,164,92,.24); }
.ar-kart.bos { opacity: .72; }
.ar-kart-ikon { font-size: 19px; margin-bottom: 7px; }
.ar-kart-bas { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 7px; }
.ar-kart-bas h4 { font-family: var(--serif); font-size: 15.5px; color: var(--murekkep); line-height: 1.2; }
.ar-badge {
  flex: 0 0 auto; min-width: 26px; height: 23px; padding: 0 8px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 12px; font-size: 11.5px; font-weight: 700;
}
.ar-badge.yesil { background: #d8f0e0; color: #1f7a48; }
.ar-badge.gri { background: #e8e2d5; color: #8a7f68; }
.ar-badge.kirmizi { background: #f6e0e0; color: #a03b3b; }
.ar-kart-not { font-size: 12px; line-height: 1.45; color: #6f6656; flex: 1; }
.ar-kart-alt {
  margin-top: 10px; padding-top: 8px; border-top: 1px dashed var(--cizgi);
  font-size: 10px; letter-spacing: 1px; text-transform: uppercase; color: var(--altin);
}
.ar-kart.secili .ar-kart-alt { color: #1f7a48; }

.ar-altbilgi {
  display: flex; gap: 20px; align-items: center; flex-wrap: wrap;
  font-size: 12px; color: #8a7f68; margin-bottom: 20px;
  padding: 10px 14px; background: rgba(0,0,0,.03); border-radius: 10px;
}
.ar-altbilgi b { color: var(--murekkep); }
.ar-sec-sayi { margin-left: auto; color: var(--altin); font-weight: 600; }

.ar-blok { margin-bottom: 26px; scroll-margin-top: 10px; }
.ar-blok-bas {
  font-family: var(--serif); font-size: 17px; color: var(--murekkep);
  margin-bottom: 14px; display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap;
}
.ar-blok-bas span { font-family: var(--sans); font-size: 10.5px; letter-spacing: 1.1px;
  text-transform: uppercase; color: #a89e88; }

/* YouTube kutucukları */
.yt-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(215px,1fr)); gap: 13px; }
.yt-kart {
  display: flex; flex-direction: column;
  border: 2px solid transparent; border-radius: 13px;
  overflow: hidden; background: #fff; cursor: pointer;
  transition: transform .22s, box-shadow .22s, border-color .22s;
}
.yt-kart:hover { transform: translateY(-3px); box-shadow: 0 14px 30px rgba(26,23,19,.15); }
.yt-kart.secili { border-color: var(--vurgu); box-shadow: 0 12px 28px rgba(200,164,92,.28); }
.yt-kapak { position: relative; aspect-ratio: 16/9; background: #e8e2d5; overflow: hidden; }
.yt-kapak img { width: 100%; height: 100%; object-fit: cover; display: block; }
.yt-kart.secili .yt-kapak::after { content:""; position:absolute; inset:0; background: rgba(200,164,92,.16); }
.yt-sure {
  position: absolute; right: 7px; bottom: 7px;
  background: rgba(0,0,0,.82); color: #fff;
  font-size: 11px; font-weight: 600; padding: 2px 6px; border-radius: 4px;
}
.yt-sec {
  position: absolute; top: 7px; right: 7px;
  width: 25px; height: 25px; border-radius: 50%;
  background: rgba(0,0,0,.5); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 14px; font-weight: 700;
}
.yt-kart.secili .yt-sec { background: var(--vurgu); color: #241c0c; }
.yt-govde { padding: 10px 12px 12px; }
.yt-govde h5 { font-size: 12.5px; font-weight: 600; color: var(--murekkep); line-height: 1.4; margin-bottom: 6px;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.yt-alt { display: flex; justify-content: space-between; font-size: 11px; color: #a89e88; gap: 8px; }
.yt-izl { color: var(--altin); font-weight: 600; white-space: nowrap; }
.yt-link { display: inline-block; margin-top: 7px; font-size: 10.5px; color: var(--altin);
  text-decoration: none; font-weight: 600; }
.yt-link:hover { text-decoration: underline; }

/* Trends çipleri */
.tr-grup { margin-bottom: 13px; }
.tr-grup.solgun { opacity: .6; }
.tr-bas { font-size: 10.5px; letter-spacing: 1.1px; text-transform: uppercase; color: #a89e88; margin-bottom: 7px; }
.tr-cipler { display: flex; flex-wrap: wrap; gap: 7px; }
.tr-cip { padding: 6px 14px; border-radius: 18px; font-size: 12px;
  background: #f0eadd; border: 1px solid var(--cizgi); color: #5a5245; cursor: help; }
.tr-cip.ilgili { background: #f3ecd9; border-color: var(--vurgu); color: #6b5520; font-weight: 600; }

/* X / Twitch / Sosyal kutucukları */
.xc-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px,1fr)); gap: 11px; }
.xc-kart { display: flex; gap: 11px; padding: 13px;
  border: 1px solid var(--cizgi); border-radius: 12px; background: #fff;
  transition: transform .22s, box-shadow .22s; }
.xc-kart:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(26,23,19,.1); }
.xc-kart.canli { border-color: #57c98a; background: #f2fbf6; }
.xc-us { font-size: 17px; line-height: 1; }
.xc-govde { min-width: 0; }
.xc-govde p { font-size: 12.5px; line-height: 1.45; color: var(--murekkep); margin-bottom: 6px; }
.xc-alt { font-size: 10.5px; color: #a89e88; }
.canli-yazi { color: #1f7a48; font-weight: 700; }

.ar-not { margin-top: 12px; padding: 11px 15px; background: #f3ede1;
  border-radius: 10px; font-size: 12px; color: #7a6f58; }

/* alt / brief */
.ar-alt { margin: 20px 0 16px; }
.ar-brief { padding: 13px 28px; border: none; border-radius: 12px;
  background: var(--vurgu); color: #241c0c; font-size: 14px; font-weight: 700;
  cursor: pointer; transition: background .25s, transform .2s; }
.ar-brief:hover:not(:disabled) { background: #d4b26a; transform: translateY(-1px); }
.ar-brief:disabled { opacity: .45; cursor: not-allowed; }

.ar-detay { border: 1px solid var(--cizgi); border-radius: 14px; padding: 20px;
  background: rgba(255,255,255,.55); font-size: 13.5px; color: #6f6656; }
.ar-ipucu { color: #a89e88; font-size: 12.5px; }
.ar-detay-bas { font-family: var(--serif); font-size: 17px; color: var(--murekkep);
  margin-bottom: 13px; padding-bottom: 9px; border-bottom: 1px solid var(--cizgi); }
.ar-sec-liste { list-style: none; }
.ar-sec-liste li { padding: 8px 0; border-bottom: 1px solid rgba(0,0,0,.06);
  font-size: 13px; color: var(--murekkep); display: flex; flex-direction: column; gap: 3px; }
.ar-dim { font-size: 11.5px; color: #a89e88; }
.ar-tablo-sar { overflow-x: auto; }
.ar-tablo { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.ar-tablo th, .ar-tablo td { border: 1px solid var(--cizgi); padding: 8px 12px; text-align: left; }
.ar-tablo th { background: rgba(0,0,0,.05); color: var(--murekkep); font-weight: 600; }
.ar-tablo tr:hover td { background: rgba(200,164,92,.07); }

.ar-brief-icerik { line-height: 1.75; color: #4a4438; }
.ar-brief-icerik h2 { font-family: var(--serif); font-size: 20px; color: var(--murekkep); margin: 20px 0 10px; }
.ar-brief-icerik h3 { font-family: var(--serif); font-size: 16.5px; color: var(--murekkep); margin: 17px 0 8px; }
.ar-brief-icerik h4 { font-size: 13.5px; color: var(--murekkep); margin: 13px 0 6px; }
.ar-brief-icerik ul { margin: 8px 0 10px 20px; }
.ar-brief-icerik li { margin: 4px 0; }
.ar-brief-icerik table { width: 100%; border-collapse: collapse; margin: 12px 0; font-size: 12.5px; }
.ar-brief-icerik td { border: 1px solid var(--cizgi); padding: 7px 11px; }
.ar-brief-icerik table tr:first-child td { background: rgba(0,0,0,.05); font-weight: 600; color: var(--murekkep); }
.ar-brief-icerik blockquote { border-left: 3px solid var(--vurgu); padding-left: 14px; margin: 12px 0; color: #7a6f58; font-style: italic; }

.ar-blok.vurgu { animation: vurguParla 1.3s ease; }
@keyframes vurguParla { 0%,100%{background:transparent;} 30%{background:rgba(200,164,92,.14);} }

body.panel-acik { overflow: hidden; }

/* ─── GERÇEK İLERLEME (panel içi) ─── */
.ar-gercek-cubuk {
  width: min(420px, 80%); height: 12px; margin: 22px auto 10px;
  background: #e2d9c5; border-radius: 8px; overflow: hidden;
  border: 1px solid var(--cizgi);
}
.ar-gercek-dolgu {
  height: 100%; width: 0%;
  background: linear-gradient(90deg, var(--vurgu), #d4b26a);
  border-radius: 8px; transition: width .4s ease;
}
.ar-gercek-yuzde {
  font-family: var(--serif); font-size: 26px; font-weight: 700;
  color: var(--murekkep); margin-bottom: 14px;
}
.ar-gercek-liste {
  display: flex; flex-wrap: wrap; gap: 8px; justify-content: center;
  max-width: 560px; margin: 0 auto;
}
.ar-k-satir {
  font-size: 11.5px; padding: 5px 12px; border-radius: 15px;
  background: rgba(0,0,0,.05); color: #a89e88;
  transition: background .3s, color .3s;
}
.ar-k-satir.tamam { background: #d8f0e0; color: #1f7a48; font-weight: 600; }

/* ─── GEÇMİŞ ARAŞTIRMALAR ─── */
.gecmis-izgara {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(230px,1fr)); gap: 12px;
}
.gecmis-kart {
  border: 1px solid var(--cizgi); border-radius: 12px; padding: 13px 15px;
  background: rgba(255,255,255,.7); cursor: pointer;
  transition: transform .22s, box-shadow .22s, border-color .22s;
}
.gecmis-kart:hover { transform: translateY(-3px); border-color: var(--vurgu);
  box-shadow: 0 12px 26px rgba(26,23,19,.12); }
.gk-ust { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; margin-bottom: 6px; }
.gk-konu { font-family: var(--serif); font-size: 14.5px; color: var(--murekkep); font-weight: 600; }
.gk-tarih { font-size: 10.5px; color: #a89e88; white-space: nowrap; }
.gk-alt { font-size: 11px; color: #8a7f68; }
#arGecmis { margin-top: 30px; padding-top: 22px; border-top: 1px solid var(--cizgi); }

/* ─── İÇERİK POPUP (video/gönderi) ─── */
.ar-popup { position: fixed; inset: 0; z-index: 300; display: none;
  align-items: center; justify-content: center; }
.ar-popup.acik { display: flex; animation: popGir .25s ease; }
@keyframes popGir { from{opacity:0} to{opacity:1} }
.ar-popup-arka { position: absolute; inset: 0; background: rgba(10,8,5,.72);
  backdrop-filter: blur(6px); }
.ar-popup-kutu {
  position: relative; width: min(880px, 92vw); max-height: 90vh;
  background: #f7f3ea; border-radius: 18px; overflow: auto;
  border: 3px solid #0a0806; box-shadow: 0 40px 100px rgba(0,0,0,.6);
  padding: 26px 30px 30px; animation: popKutu .3s cubic-bezier(.22,.9,.28,1);
}
@keyframes popKutu { from{transform:translateY(20px) scale(.97);opacity:0} to{transform:none;opacity:1} }
.ar-popup-kapat {
  position: absolute; top: 14px; right: 16px; width: 40px; height: 40px;
  border: none; border-radius: 50%; background: rgba(0,0,0,.07);
  font-size: 18px; cursor: pointer; color: var(--murekkep);
  transition: background .2s, transform .2s; z-index: 2;
}
.ar-popup-kapat:hover { background: var(--murekkep); color: var(--krem); transform: rotate(90deg); }
.ar-popup-baslik { font-family: var(--serif); font-size: 20px; color: var(--murekkep);
  margin-bottom: 6px; padding-right: 44px; line-height: 1.3; }
.ar-popup-meta { font-size: 12px; color: #a89e88; margin-bottom: 16px; }
.ar-popup-video { position: relative; aspect-ratio: 16/9; background: #000;
  border-radius: 12px; overflow: hidden; margin-bottom: 14px; }
.ar-popup-video iframe { width: 100%; height: 100%; border: 0; display: block; }
.ar-popup-aciklama { font-size: 14px; line-height: 1.65; color: #4a4438;
  margin-bottom: 14px; white-space: pre-wrap; }
.ar-popup-link { display: inline-block; font-size: 13px; color: var(--altin);
  text-decoration: none; font-weight: 600; margin-bottom: 16px; }
.ar-popup-link:hover { text-decoration: underline; }
.ar-popup-sec {
  display: flex; align-items: center; gap: 10px; padding: 13px 16px;
  background: rgba(200,164,92,.14); border-radius: 11px;
  font-size: 13.5px; color: #6b5520; cursor: pointer; font-weight: 600;
}
.ar-popup-sec input { width: 18px; height: 18px; accent-color: var(--vurgu); cursor: pointer; }

/* tıklanabilir kutucuk işareti */
.xc-kart.tiklanir { cursor: pointer; }
.xc-kart.tiklanir:hover { border-color: var(--vurgu); }
.xc-kart.tiklanir::after {
  content: "↗"; position: absolute; top: 10px; right: 12px;
  font-size: 13px; color: var(--altin); opacity: 0; transition: opacity .2s;
}
.xc-kart.tiklanir:hover::after { opacity: 1; }
.xc-kart.tiklanir { position: relative; }

/* Popup boyut düzeltmesi — seçim kutusu görünür kalsın */
.ar-popup-kutu {
  width: min(760px, 90vw) !important;
  max-height: 86vh !important;
  padding: 22px 26px 24px !important;
  display: flex; flex-direction: column;
}
.ar-popup-govde { overflow: auto; }
.ar-popup-video { max-height: 46vh; }

/* ─── MESAJ KUTUSU BUTONU (üst sağ) ─── */
.ust-sag { display: flex; align-items: center; gap: 16px; }
.trend-btn {
  position: relative; width: 46px; height: 46px;
  border: 2px solid rgba(255,255,255,.18); border-radius: 14px;
  background: rgba(255,255,255,.06); color: var(--krem);
  font-size: 20px; cursor: pointer;
  transition: background .25s, transform .2s, border-color .25s;
}
.trend-btn:hover { background: rgba(255,255,255,.14); transform: translateY(-2px); }
.trend-btn.yeni { border-color: var(--vurgu); animation: trendParla 2s infinite; }
@keyframes trendParla {
  0%,100% { box-shadow: 0 0 0 0 rgba(200,164,92,.5); }
  50% { box-shadow: 0 0 0 8px rgba(200,164,92,0); }
}
.trend-rozet {
  position: absolute; top: -6px; right: -6px;
  min-width: 20px; height: 20px; padding: 0 5px;
  background: #d9534f; color: #fff;
  border-radius: 10px; font-size: 11px; font-weight: 700;
  display: none; align-items: center; justify-content: center;
}

/* ─── TREND KUTUSU (panel) ─── */
.trend-kutu { position: fixed; inset: 0; z-index: 250; display: none;
  align-items: center; justify-content: center; }
.trend-kutu.acik { display: flex; animation: popGir .25s ease; }
.trend-arka { position: absolute; inset: 0; background: rgba(10,8,5,.7);
  backdrop-filter: blur(6px); }
.trend-panel {
  position: relative; width: min(1050px, 94vw); height: min(90vh, 900px);
  background: #f7f3ea; border-radius: 20px; border: 3px solid #0a0806;
  box-shadow: 0 40px 100px rgba(0,0,0,.6); display: flex; flex-direction: column;
  overflow: hidden; animation: popKutu .3s cubic-bezier(.22,.9,.28,1);
}
.trend-bas {
  display: flex; align-items: center; justify-content: space-between;
  padding: 22px 28px 18px; border-bottom: 1px solid var(--cizgi);
  background: linear-gradient(180deg, #fbf8f2, #f5efe3);
}
.trend-bas h2 { font-family: var(--serif); font-size: 23px; color: var(--murekkep); }
.trend-alt { font-size: 12px; color: #a89e88; }
.trend-bas-sag { display: flex; gap: 10px; }
.trend-yenile, .trend-kapat {
  width: 42px; height: 42px; border: none; border-radius: 12px;
  background: rgba(0,0,0,.06); color: var(--murekkep);
  font-size: 18px; cursor: pointer; transition: background .2s, transform .2s;
}
.trend-yenile:hover, .trend-kapat:hover { background: var(--murekkep); color: var(--krem); }
.trend-kapat:hover { transform: rotate(90deg); }
.trend-govde { flex: 1; overflow: auto; padding: 22px 28px 30px; }

.trend-yukleniyor { text-align: center; padding: 70px 20px; color: #6f6656; }
.trend-yukleniyor small { display: block; margin-top: 8px; font-size: 12px; color: #a89e88; }

/* trend kartları */
.tr-kart {
  border: 1px solid var(--cizgi); border-radius: 15px;
  padding: 18px 20px; margin-bottom: 16px; background: #fff;
  transition: box-shadow .25s, border-color .25s;
}
.tr-kart:hover { box-shadow: 0 12px 30px rgba(26,23,19,.1); border-color: var(--vurgu); }
.tr-kart-bas { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.tr-sira {
  flex: 0 0 auto; width: 30px; height: 30px; border-radius: 9px;
  background: var(--murekkep); color: var(--krem);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--serif); font-size: 15px; font-weight: 700;
}
.tr-kart-bas h3 { font-family: var(--serif); font-size: 19px; color: var(--murekkep); flex: 1; }
.tr-trafik {
  font-size: 11px; letter-spacing: .5px; color: #1f7a48;
  background: #d8f0e0; padding: 4px 10px; border-radius: 12px; white-space: nowrap;
}
.tr-icerik { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.tr-bolum-bas {
  font-size: 10.5px; letter-spacing: 1.1px; text-transform: uppercase;
  color: #a89e88; margin-bottom: 8px; padding-bottom: 6px;
  border-bottom: 1px solid var(--cizgi);
}
.tr-satir {
  display: flex; flex-direction: column; gap: 2px; padding: 7px 0;
  text-decoration: none; font-size: 12.5px; color: var(--murekkep);
  line-height: 1.4; border-bottom: 1px solid rgba(0,0,0,.04);
}
.tr-satir:hover { color: var(--altin); }
.tr-satir em { font-size: 10.5px; color: #a89e88; font-style: normal; }
.tr-yok { font-size: 12px; color: #b8ae9a; }
.tr-eylem { margin-top: 14px; padding-top: 12px; border-top: 1px dashed var(--cizgi); }
.tr-arastir {
  padding: 9px 20px; border: none; border-radius: 10px;
  background: var(--vurgu); color: #241c0c; font-size: 12.5px; font-weight: 700;
  cursor: pointer; transition: background .2s, transform .2s;
}
.tr-arastir:hover { background: #d4b26a; transform: translateY(-1px); }

/* ─── VİDEO ÖNEM SKORU — renkli çerçeve ─── */
.tr-satir.skor-yesil {
  border-left: 4px solid #2ecc71;
  background: rgba(46,204,113,.09);
  padding-left: 12px;
  border-radius: 8px;
  animation: neonYesil 2.2s ease-in-out infinite;
}
@keyframes neonYesil {
  0%,100% { box-shadow: 0 0 0 0 rgba(46,204,113,.5); }
  50% { box-shadow: 0 0 12px 2px rgba(46,204,113,.75); }
}
.tr-satir.skor-turuncu {
  border-left: 4px solid #e8933a;
  background: rgba(232,147,58,.09);
  padding-left: 12px;
  border-radius: 8px;
}
.tr-satir.skor-kirmizi {
  border-left: 4px solid #e74c3c;
  background: rgba(231,76,60,.07);
  padding-left: 12px;
  border-radius: 8px;
  opacity: .82;
}
.tr-satir.skor-gri { border-left: 4px solid #c8bfa8; padding-left: 12px; border-radius: 8px; }

/* skor rozeti */
.tr-skor-bas { display: flex; align-items: center; gap: 9px; }
.tr-skor-rozet {
  flex: 0 0 auto; min-width: 30px; height: 24px; padding: 0 7px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 8px; font-size: 12px; font-weight: 800;
  font-family: var(--sans); color: #fff;
}
.skor-bg-yesil { background: #2ecc71; color: #0d3b21; }
.skor-bg-turuncu { background: #e8933a; color: #3d2408; }
.skor-bg-kirmizi { background: #e74c3c; color: #fff; }
.skor-bg-gri { background: #c8bfa8; color: #4a4438; }

/* trend kartı başlığına da skor ipucu */
.tr-skor-not {
  font-size: 10px; letter-spacing: .8px; text-transform: uppercase;
  color: #a89e88; margin-left: auto;
}
.tr-skor-aciklama {
  display: flex; gap: 14px; align-items: center; flex-wrap: wrap;
  padding: 10px 14px; margin-bottom: 16px;
  background: rgba(0,0,0,.03); border-radius: 10px;
  font-size: 11px; color: #8a7f68;
}
.tr-skor-aciklama b { padding: 2px 8px; border-radius: 6px; color: #fff; font-size: 10.5px; }

/* ─── 📊 İSTATİSTİK TABLOSU ─── */
.tr-eylem { display: flex; gap: 10px; flex-wrap: wrap; }
.tr-tablo-btn {
  padding: 9px 20px; border: 1px solid var(--cizgi); border-radius: 10px;
  background: transparent; color: var(--murekkep); font-size: 12.5px;
  font-weight: 600; cursor: pointer; transition: background .2s;
}
.tr-tablo-btn:hover { background: rgba(0,0,0,.06); }

.tr-tablo-kutu { position: fixed; inset: 0; z-index: 270; display: none;
  align-items: center; justify-content: center; }
.tr-tablo-kutu.acik { display: flex; animation: popGir .25s ease; }
.tr-tablo-arka { position: absolute; inset: 0; background: rgba(10,8,5,.72); backdrop-filter: blur(6px); }
.tr-tablo-panel {
  position: relative; width: min(1200px, 96vw); height: min(90vh, 880px);
  background: #f7f3ea; border-radius: 18px; border: 3px solid #0a0806;
  box-shadow: 0 40px 100px rgba(0,0,0,.6); display: flex; flex-direction: column;
  overflow: hidden; animation: popKutu .3s cubic-bezier(.22,.9,.28,1);
}
.tr-tablo-bas { display: flex; align-items: center; justify-content: space-between;
  padding: 20px 26px 16px; border-bottom: 1px solid var(--cizgi); background: #fbf8f2; }
.tr-tablo-bas h3 { font-family: var(--serif); font-size: 21px; color: var(--murekkep); }
.tr-kapat2 { width: 40px; height: 40px; border: none; border-radius: 11px;
  background: rgba(0,0,0,.06); color: var(--murekkep); font-size: 17px; cursor: pointer;
  transition: background .2s, transform .2s; }
.tr-kapat2:hover { background: var(--murekkep); color: var(--krem); transform: rotate(90deg); }
.tr-tablo-govde { flex: 1; overflow: auto; padding: 16px 22px; }
.tr-tablo-alt { display: flex; align-items: center; justify-content: space-between;
  gap: 16px; padding: 14px 26px; border-top: 1px solid var(--cizgi); background: #fbf8f2; }
#trTabloSecim { font-size: 12px; letter-spacing: .8px; text-transform: uppercase; color: #a89e88; }
.tr-brief-btn { padding: 12px 26px; border: none; border-radius: 11px;
  background: var(--vurgu); color: #241c0c; font-size: 13.5px; font-weight: 700;
  cursor: pointer; transition: background .2s, transform .2s; }
.tr-brief-btn:hover { background: #d4b26a; transform: translateY(-1px); }

/* tablo */
.tr-tab { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.tr-tab thead th {
  position: sticky; top: 0; z-index: 2;
  background: #efe8da; color: var(--murekkep); font-weight: 700;
  padding: 11px 12px; text-align: left; border-bottom: 2px solid var(--cizgi);
  cursor: pointer; user-select: none; white-space: nowrap;
}
.tr-tab thead th.tr-th:hover { background: #e6ddc9; }
.tr-tab thead th.aktif { color: var(--altin); }
.tr-th-sec { width: 34px; cursor: default !important; }
.tr-sat { border-bottom: 1px solid rgba(0,0,0,.05); }
.tr-sat:hover { background: rgba(200,164,92,.08); }
.tr-sat.skor-yesil { border-left: 4px solid #2ecc71; }
.tr-sat.skor-turuncu { border-left: 4px solid #e8933a; }
.tr-sat.skor-kirmizi { border-left: 4px solid #e74c3c; opacity: .85; }
.tr-td-sec { text-align: center; }
.tr-sec { width: 17px; height: 17px; accent-color: var(--vurgu); cursor: pointer; }
.tr-td-baslik { max-width: 430px; }
.tr-td-baslik a { color: var(--murekkep); text-decoration: none; font-weight: 600; }
.tr-td-baslik a:hover { color: var(--altin); text-decoration: underline; }
.tr-td-baslik em { display: block; font-size: 10.5px; color: #a89e88; font-style: normal; margin-top: 3px; }
.tr-td-sayi { text-align: right; white-space: nowrap; color: #5a5245; }
.tr-td-skor { text-align: center; }
.tr-td-skor b { display: inline-block; min-width: 30px; padding: 3px 7px;
  border-radius: 7px; font-size: 12px; font-weight: 800; }
.tr-tur { display: inline-block; padding: 3px 9px; border-radius: 8px;
  font-size: 10.5px; font-weight: 700; white-space: nowrap; }
.tr-tur-youtube { background: #fdeaea; color: #c0392b; }
.tr-tur-x { background: #e8e8e8; color: #222; }
.tr-tur-twitch { background: #efe0f8; color: #7d3cb5; }

.tr-fikir { padding: 10px; }
.tr-fikir h4 { font-family: var(--serif); font-size: 19px; color: var(--murekkep); margin-bottom: 16px; }
.tr-fikir-tablo { margin-bottom: 16px; }
.tr-fikir-tablo td { padding: 9px 14px; border: 1px solid var(--cizgi); font-size: 13px; }
.tr-fikir-tablo td:first-child { color: #8a7f68; width: 200px; }
.tr-fikir-not { padding: 15px 18px; background: rgba(200,164,92,.13);
  border-radius: 12px; font-size: 13.5px; line-height: 1.65; color: #6b5520; margin-bottom: 16px; }

/* ─── GEÇMİŞ SİLME ─── */
.gk-sil {
  position: absolute; top: 8px; right: 8px;
  width: 26px; height: 26px; border: none; border-radius: 50%;
  background: rgba(0,0,0,.06); color: #a03b3b;
  font-size: 13px; font-weight: 700; cursor: pointer;
  opacity: 0; transition: opacity .2s, background .2s, transform .2s;
}
.gecmis-kart { position: relative; }
.gecmis-kart:hover .gk-sil { opacity: 1; }
.gk-sil:hover { background: #e74c3c; color: #fff; transform: scale(1.1); }
.gecmis-temizle {
  margin-left: auto; padding: 6px 14px;
  border: 1px solid rgba(231,76,60,.35); border-radius: 9px;
  background: transparent; color: #a03b3b;
  font-size: 11px; font-weight: 600; cursor: pointer;
  transition: background .2s, color .2s;
}
.gecmis-temizle:hover { background: #e74c3c; color: #fff; }
/* ─── İSTATİSTİK SATIRI + REAKSİYON ETİKETİ (2026-10-07) ─── */
.tr-istat {
  display: block; font-size: 11px; color: #8a7f68;
  font-style: normal; margin-top: 3px; line-height: 1.5;
}
.tr-reaks {
  display: inline-block; margin-left: 6px; padding: 2px 8px;
  border-radius: 8px; font-size: 10px; font-weight: 800;
  letter-spacing: .3px; white-space: nowrap;
}
.tr-reaks.viral {
  background: linear-gradient(90deg, #ff4757, #ff6b81); color: #fff;
  animation: viralParla 1.6s ease-in-out infinite;
}
@keyframes viralParla {
  0%,100% { box-shadow: 0 0 0 0 rgba(255,71,87,.6); }
  50% { box-shadow: 0 0 10px 3px rgba(255,71,87,.5); }
}
.tr-reaks.yuksek { background: #ffe0b2; color: #8a5300; }
.tr-reaks.orta { background: #e8e2d5; color: #6f6656; }
.tr-reaks.dusuk { background: #f0eee8; color: #a89e88; }

/* akıllı mod seçimi */
.ar-akilli-sec {
  display: flex; align-items: center; gap: 10px;
  padding: 11px 16px; margin-bottom: 18px;
  background: rgba(200,164,92,.13); border-radius: 11px;
  font-size: 12.5px; color: #6b5520; cursor: pointer;
  transition: background .2s;
}
.ar-akilli-sec:hover { background: rgba(200,164,92,.2); }
.ar-akilli-sec input { width: 17px; height: 17px; accent-color: var(--vurgu); cursor: pointer; }

/* ─── ARAŞTIRMA: sekme/oturum uyarısı (⛔ 2026-10-07) ─────────────── */
.ar-uyari {
  background: #fff8e6;
  border: 1px solid #f0c36d;
  border-left: 4px solid #e8a33d;
  border-radius: 8px;
  padding: 12px 14px;
  margin: 0 0 14px 0;
}
.ar-uyari-bas {
  font-weight: 700;
  color: #8a5a00;
  font-size: 14px;
  margin-bottom: 8px;
}
.ar-uyari-liste {
  margin: 0 0 8px 18px;
  padding: 0;
  font-size: 13px;
  line-height: 1.7;
  color: #5a3d00;
}
.ar-uyari-not {
  font-size: 12px;
  color: #8a6d3b;
  font-style: italic;
}
.u-kirmizi { color: #c0392b; font-weight: 600; }
.u-turuncu { color: #d35400; font-weight: 600; }
.u-url { color: #888; font-size: 11px; margin-left: 6px; }

/* ─── ARAŞTIRMA MOD BUTONLARI (⚡ Hızlı / 🧠 Derin) ─────────────── */
.ar-modlar {
  display: flex;
  gap: 12px;
  margin: 12px 0 16px 0;
  flex-wrap: wrap;
}
.ar-mod-btn {
  flex: 1 1 220px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 3px;
  padding: 14px 18px;
  border: 1.5px solid rgba(255,255,255,.16);
  border-radius: 12px;
  background: rgba(255,255,255,.04);
  color: #f2ede4;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  transition: all .18s ease;
  text-align: left;
}
.ar-mod-btn small {
  font-size: 11.5px;
  font-weight: 400;
  opacity: .62;
  letter-spacing: .2px;
}
.ar-mod-btn:hover { transform: translateY(-1px); }
.ar-mod-btn.hizli {
  border-color: rgba(212,175,55,.55);
  background: linear-gradient(135deg, rgba(212,175,55,.14), rgba(212,175,55,.05));
}
.ar-mod-btn.hizli:hover {
  border-color: rgba(212,175,55,.95);
  box-shadow: 0 4px 18px rgba(212,175,55,.22);
}
.ar-mod-btn.derin {
  border-color: rgba(138,92,246,.5);
  background: linear-gradient(135deg, rgba(138,92,246,.16), rgba(138,92,246,.05));
}
.ar-mod-btn.derin:hover {
  border-color: rgba(138,92,246,.95);
  box-shadow: 0 4px 18px rgba(138,92,246,.25);
}
.ar-mod-btn:disabled { opacity: .45; cursor: not-allowed; transform: none; }

/* ─── Trends: yükselen terim çipi (⛔ 2026-10-07) ─────────────────── */
.tr-cip.yukselen {
  background: linear-gradient(135deg, rgba(230,90,60,.18), rgba(230,90,60,.06));
  border-color: rgba(230,90,60,.55);
  color: #ffb59f;
}

/* ─── INSTAGRAM KARTLARI (YouTube kartı görünümü) ⛔ 2026-10-07 ────── */
.ig-kapak {
  background: linear-gradient(135deg, #2b1a3d, #4a2b5e);
  position: relative;
  overflow: hidden;
}
.ig-kapak img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
}
.ig-kapak.resimsiz::after {
  content: "📷";
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: 38px; opacity: .45;
}
.ig-isaret {
  position: absolute; top: 6px; right: 6px;
  font-size: 14px; opacity: .85;
  background: rgba(0,0,0,.45);
  border-radius: 6px; padding: 2px 6px;
  pointer-events: none;
}
.ig-kart .yt-govde h5 { min-height: 34px; }

/* ─── Instagram hashtag çipleri ─────────────────────────────────── */
.ar-hashtag {
  display: flex; flex-wrap: wrap; gap: 6px;
  margin: 0 0 12px 0;
}
.ar-hash {
  font-size: 11.5px; padding: 3px 9px;
  border-radius: 20px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.05);
  color: #cbbde0;
}
.ar-hash.dolu {
  border-color: rgba(212,175,55,.5);
  background: rgba(212,175,55,.12);
  color: #e8d79a;
}
.ar-hash.bos { opacity: .45; }

/* ─── AI (ChatGPT · Gemini) kartları ⛔ 2026-10-07 ─────────────────── */
.yz-izgara {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 12px;
}
.yz-kart {
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 10px;
  padding: 12px 14px;
  background: rgba(255,255,255,.03);
}
.yz-kart.dolu { border-left: 3px solid rgba(120,200,160,.7); }
.yz-kart.bos  { border-left: 3px solid rgba(200,90,90,.5); opacity: .65; }
.yz-bas {
  font-size: 13.5px; color: #e8e2d6;
  margin-bottom: 8px;
  display: flex; align-items: center; gap: 6px;
}
.yz-durum {
  margin-left: auto; font-size: 11px;
  color: #9c9484; font-weight: 400;
}
.yz-cevap {
  font-size: 12.5px; line-height: 1.65;
  color: #b8b0a0;
  white-space: pre-wrap;
  max-height: 260px; overflow: auto;
}

/* ─── AI kart seçim + kopyala ⛔ 2026-10-07 ─────────────────────────── */
.yz-kart.tiklanir { cursor: pointer; transition: border-color .15s, transform .15s; }
.yz-kart.tiklanir:hover { border-color: rgba(212,175,55,.5); transform: translateY(-1px); }
.yz-kart.secili {
  border-color: rgba(212,175,55,.85) !important;
  box-shadow: 0 0 0 1px rgba(212,175,55,.35);
}
.yz-sec { color: #d4af37; font-weight: 700; margin-left: 6px; }
.yz-link {
  display: inline-block; margin-top: 8px;
  font-size: 11px; color: #8a8375;
  text-decoration: underline; cursor: pointer;
}
.yz-link:hover { color: #d4af37; }

/* ─── Perplexity önerileri (detay panelinde) ─────────────────────── */
.pr-oneri-bas {
  font-size: 12px; color: #9c9484; margin: 14px 0 6px 0;
  text-transform: uppercase; letter-spacing: .5px;
}
.pr-oneriler { display: flex; flex-wrap: wrap; gap: 6px; }
.pr-oneri {
  font-size: 12px; padding: 4px 10px; border-radius: 20px;
  border: 1px solid rgba(138,92,246,.45);
  background: rgba(138,92,246,.10);
  color: #cbbde0; cursor: pointer;
}
.pr-oneri:hover { border-color: rgba(138,92,246,.9); }

/* ─── AI cevabı TAM gösterim (kırpma yok) ⛔ 2026-10-07 ─────────────── */
.yz-cevap.tam {
  white-space: pre-wrap;
  max-height: none;          /* TAM metin — kaydırma gerekmez */
  word-break: break-word;
  line-height: 1.55;
}

/* ─── Instagram kart: görsel + beğeni/yorum ⛔ 2026-10-07 ────────────── */
.ig-kapak .ig-sayilar {
  position: absolute;
  left: 6px; bottom: 6px;
  display: flex; gap: 6px;
  z-index: 3;
}
.ig-kapak .ig-say {
  background: rgba(0,0,0,.62);
  color: #fff;
  font-size: 11px;
  padding: 2px 7px;
  border-radius: 10px;
  white-space: nowrap;
}
.ig-kapak img { object-fit: cover; width: 100%; height: 100%; display: block; }

/* ─── VİRAL BLOK ⛔ 2026-10-07 ─────────────────────────────────────── */
.vr-liste { display: flex; flex-direction: column; gap: 6px; }
.vr-satir {
  display: flex; align-items: center; gap: 8px;
  padding: 7px 10px; border-radius: 8px;
  background: rgba(255,255,255,.035);
  border: 1px solid rgba(255,255,255,.06);
}
.vr-puan {
  min-width: 96px; text-align: right;
  color: #ffb84d; font-weight: 700; font-size: 12px;
  font-variant-numeric: tabular-nums;
}
.vr-baslik { flex: 1; font-size: 13px; color: #e8e2d4; }
.vr-kaynak { font-size: 10px; color: #8a8375; text-transform: uppercase; }
.vr-say { font-size: 11px; color: #c9c0ad; white-space: nowrap; }
.vr-turlar { display: flex; flex-direction: column; gap: 5px; margin-bottom: 12px; }
.vr-tur {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  font-size: 12px; color: #b9b1a0;
}
.vr-q {
  background: rgba(212,175,55,.12); border: 1px solid rgba(212,175,55,.28);
  color: #e0cf9a; padding: 1px 7px; border-radius: 9px; font-size: 11px;
}
.vr-tur-yeni { color: #7fc98a; font-weight: 600; }
.vr-not { color: #a99; font-style: italic; }
.vr-ek-not { margin-top: 10px; font-size: 12px; color: #9c9484; }