/* SesliChat — halka açık site
   Sohbet arayüzüyle aynı renk dili, ama okunabilirlik ve SEO odaklı.

   RENK TEMALARI
   Bütün renkler değişken. `gece` VARSAYILANDIR ve hiç değişmedi —
   diğer temalar sadece :root[data-tema="…"] altında değişkenleri ezer.
   Seçim localStorage'da 'sc_site_tema' anahtarıyla saklanır. */

:root,
:root[data-tema="gece"] {
  --bg: #0a1020; --bg2: #0d1526; --panel: #121c33; --panel2: #17233d;
  --line: #24345a; --line2: #2f4470;
  --text: #cdd9ee; --dim: #7286a8; --dim2: #4a5b7d; --parlak: #fff;
  --acc: #2f7fe0; --acc-ust: #3a8ae8; --acc-alt: #1a5fb4;
  --acc-cizgi: #1b4f92; --acc-isik: #8fc4ff; --acc-rgb: 47,127,224;
  --hi: #46d8e0; --hi-rgb: 70,216,224;
  --isik: #1b336a;
  --gold: #ffc233; --green: #3fd67d; --purple: #a97bff; --red: #ff5a5a;
  --yazi-vurgu: #a9bcd8;
  --avatar1: #22345a; --avatar2: #182741;
  --kapak1: #1b2942; --kapak2: #16223a;
}

:root[data-tema="romantik"] {
  --bg: #160a12; --bg2: #1c0e17; --panel: #26121f; --panel2: #2f1727;
  --line: #4a2138; --line2: #5e2b47;
  --text: #f0d9e4; --dim: #b389a0; --dim2: #7d5a6c; --parlak: #fff;
  --acc: #ff6b9d; --acc-ust: #ff85ae; --acc-alt: #c9315f;
  --acc-cizgi: #a82a50; --acc-isik: #ffc2d8; --acc-rgb: 255,107,157;
  --hi: #ffb3cd; --hi-rgb: 255,179,205;
  --isik: #5c1e3c;
  --gold: #ffcf70; --green: #5fd8a0; --purple: #c98bff; --red: #ff5f7a;
  --yazi-vurgu: #e7bccd;
  --avatar1: #4a2138; --avatar2: #331625;
  --kapak1: #3a1b2c; --kapak2: #2a1220;
}

:root[data-tema="gulkurusu"] {
  --bg: #1a0e11; --bg2: #201216; --panel: #2b1920; --panel2: #341f28;
  --line: #4f2c37; --line2: #653844;
  --text: #f2dde2; --dim: #b5909a; --dim2: #7f606a; --parlak: #fff;
  --acc: #e0698a; --acc-ust: #ec7f9c; --acc-alt: #a8395a;
  --acc-cizgi: #8e2f4c; --acc-isik: #f2b8c6; --acc-rgb: 224,105,138;
  --hi: #f2b8c6; --hi-rgb: 242,184,198;
  --isik: #5a2536;
  --gold: #f0c987; --green: #6ed3a2; --purple: #cf9be0; --red: #ff6b6b;
  --yazi-vurgu: #e3c3cb;
  --avatar1: #4f2c37; --avatar2: #391f28;
  --kapak1: #3d222c; --kapak2: #2c1820;
}

:root[data-tema="gunbatimi"] {
  --bg: #190d07; --bg2: #20120a; --panel: #2c1a0f; --panel2: #362013;
  --line: #563318; --line2: #6d4220;
  --text: #f6e3d2; --dim: #b8977a; --dim2: #836b55; --parlak: #fff;
  --acc: #ff8c42; --acc-ust: #ffa15f; --acc-alt: #d1601c;
  --acc-cizgi: #a94a12; --acc-isik: #ffd08a; --acc-rgb: 255,140,66;
  --hi: #ffc06b; --hi-rgb: 255,192,107;
  --isik: #5e2d10;
  --gold: #ffd166; --green: #6fd88f; --purple: #d49bff; --red: #ff5f5f;
  --yazi-vurgu: #e9c9aa;
  --avatar1: #563318; --avatar2: #3d2411;
  --kapak1: #432714; --kapak2: #2f1b0e;
}

:root[data-tema="lavanta"] {
  --bg: #140a24; --bg2: #190e2c; --panel: #22143c; --panel2: #2a1a49;
  --line: #3d2769; --line2: #4e3384;
  --text: #e2d8f6; --dim: #9a8bc0; --dim2: #6d5f91; --parlak: #fff;
  --acc: #a97bff; --acc-ust: #bb94ff; --acc-alt: #7a45d6;
  --acc-cizgi: #6535bb; --acc-isik: #d9c2ff; --acc-rgb: 169,123,255;
  --hi: #d9c2ff; --hi-rgb: 217,194,255;
  --isik: #3d2178;
  --gold: #ffd873; --green: #6ee0a4; --purple: #cba6ff; --red: #ff6b8a;
  --yazi-vurgu: #cdbfe8;
  --avatar1: #3d2769; --avatar2: #2a1a49;
  --kapak1: #33205a; --kapak2: #241541;
}

:root[data-tema="orman"] {
  --bg: #07160f; --bg2: #0a1c14; --panel: #0f2a1e; --panel2: #133425;
  --line: #1e4d38; --line2: #296449;
  --text: #d3ecdf; --dim: #7ba491; --dim2: #557567; --parlak: #fff;
  --acc: #3fd67d; --acc-ust: #5ae294; --acc-alt: #1e9c56;
  --acc-cizgi: #177f45; --acc-isik: #a8f0c8; --acc-rgb: 63,214,125;
  --hi: #7ce8b0; --hi-rgb: 124,232,176;
  --isik: #125036;
  --gold: #ffd166; --green: #3fd67d; --purple: #a9b7ff; --red: #ff6b6b;
  --yazi-vurgu: #b6dcc7;
  --avatar1: #1e4d38; --avatar2: #133425;
  --kapak1: #17402e; --kapak2: #0f2a1e;
}

:root[data-tema="okyanus"] {
  --bg: #04161c; --bg2: #061d25; --panel: #0a2b36; --panel2: #0d3542;
  --line: #134d5f; --line2: #1a6379;
  --text: #cfeaf1; --dim: #76a3b1; --dim2: #4f7581; --parlak: #fff;
  --acc: #46d8e0; --acc-ust: #68e5eb; --acc-alt: #189aa4;
  --acc-cizgi: #127f88; --acc-isik: #a8eef2; --acc-rgb: 70,216,224;
  --hi: #a8eef2; --hi-rgb: 168,238,242;
  --isik: #0d4f5e;
  --gold: #ffd166; --green: #4fe0a8; --purple: #9fb8ff; --red: #ff6b7d;
  --yazi-vurgu: #b0d9e3;
  --avatar1: #134d5f; --avatar2: #0a2b36;
  --kapak1: #0f4152; --kapak2: #082733;
}

:root[data-tema="gunduz"] {
  --bg: #eef2f8; --bg2: #e4eaf3; --panel: #ffffff; --panel2: #f4f7fc;
  --line: #d3dcea; --line2: #bfcbe0;
  --text: #16212f; --dim: #55637a; --dim2: #7d8a9e; --parlak: #000;
  --acc: #1a5fb4; --acc-ust: #2f7fe0; --acc-alt: #14508f;
  --acc-cizgi: #14508f; --acc-isik: #0d47a1; --acc-rgb: 26,95,180;
  --hi: #0b6f78; --hi-rgb: 11,111,120;
  --isik: #c3d7f5;
  --gold: #a97b00; --green: #16794a; --purple: #6a3fbf; --red: #c62828;
  --yazi-vurgu: #3a4a63;
  --avatar1: #dbe6f7; --avatar2: #c9d8f0;
  --kapak1: #dde6f4; --kapak2: #cfdcef;
}
/* Açık temada rütbe renkleri koyulaşmalı — beyaz üstünde okunabilsin */
:root[data-tema="gunduz"] .r100 { color: #c02020; }
:root[data-tema="gunduz"] .r90  { color: #b34a00; }
:root[data-tema="gunduz"] .r80  { color: #8a6a00; }
:root[data-tema="gunduz"] .r70  { color: #7d6300; }
:root[data-tema="gunduz"] .r60  { color: #6a3fbf; }
:root[data-tema="gunduz"] .r50  { color: #7d55c9; }
:root[data-tema="gunduz"] .r40  { color: #17569e; }
:root[data-tema="gunduz"] .r30  { color: #2a6ba8; }
:root[data-tema="gunduz"] .r20  { color: #16794a; }
:root[data-tema="gunduz"] .marka,
:root[data-tema="gunduz"] .btn-gir,
:root[data-tema="gunduz"] .btn-buyuk { color: #fff; }
:root[data-tema="gunduz"] .marka { color: transparent; }

* { box-sizing: border-box; }
body {
  margin: 0; background: var(--bg); color: var(--text);
  font: 15px/1.7 "Segoe UI", Tahoma, system-ui, sans-serif;
}
a { color: inherit; text-decoration: none; }
h1, h2, h3 { line-height: 1.25; }
img { max-width: 100%; }

/* ── ÜST BAR ── */
.ust {
  display: flex; align-items: center; gap: 20px; padding: 12px 22px;
  background: linear-gradient(var(--panel2), var(--panel));
  border-bottom: 1px solid var(--line2); position: sticky; top: 0; z-index: 20;
  flex-wrap: wrap;
}
.marka {
  font-size: 21px; font-weight: 800;
  background: linear-gradient(var(--acc-isik), var(--acc));
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.ust nav { display: flex; gap: 16px; flex: 1; flex-wrap: wrap; }
.ust nav a { font-size: 14px; color: var(--dim); padding: 4px 0; border-bottom: 2px solid transparent; }
.ust nav a:hover { color: var(--text); }
.ust nav a.aktif { color: var(--parlak); border-bottom-color: var(--acc); }
.ust-sag { display: flex; align-items: center; gap: 14px; }
.canli { font-size: 12.5px; color: var(--dim); display: flex; align-items: center; gap: 6px; }
.canli i {
  width: 8px; height: 8px; border-radius: 50%; background: var(--green);
  box-shadow: 0 0 8px var(--green); animation: nb 1.6s infinite;
}
@keyframes nb { 0%,100% { opacity: 1 } 50% { opacity: .35 } }
.btn-gir {
  background: linear-gradient(var(--acc-ust), var(--acc-alt)); color: #fff; font-weight: 700;
  font-size: 12.5px; letter-spacing: .4px; padding: 9px 17px; border-radius: 5px;
  border: 1px solid var(--acc-cizgi);
}
.btn-gir:hover { filter: brightness(1.14); }

/* ── TEMA SEÇİCİ ── */
.tema-sec { position: relative; }
.tema-sec > button {
  background: var(--panel2); border: 1px solid var(--line2); color: var(--text);
  width: 32px; height: 32px; border-radius: 6px; cursor: pointer; font-size: 15px;
  line-height: 1; display: grid; place-items: center;
}
.tema-sec > button:hover { border-color: var(--acc); }
.tema-liste {
  display: none; position: absolute; right: 0; top: 38px; z-index: 40;
  background: var(--panel); border: 1px solid var(--line2); border-radius: 8px;
  padding: 8px; min-width: 190px; box-shadow: 0 12px 30px rgba(0,0,0,.45);
}
.tema-liste.acik { display: block; }
.tema-liste > b {
  display: block; font-size: 10px; letter-spacing: 1.1px; color: var(--dim);
  padding: 2px 8px 7px;
}
.tema-liste button {
  display: flex; align-items: center; gap: 9px; width: 100%; text-align: left;
  background: none; border: 0; color: var(--text); font: inherit; font-size: 13px;
  padding: 6px 8px; border-radius: 5px; cursor: pointer;
}
.tema-liste button:hover { background: rgba(var(--acc-rgb), .16); }
.tema-liste .ornek { display: flex; gap: 2px; }
.tema-liste .ornek i {
  width: 11px; height: 11px; border-radius: 3px; border: 1px solid rgba(255,255,255,.14);
}

/* ── DUYURU ŞERİDİ ── */
.serit {
  overflow: hidden; white-space: nowrap; border-bottom: 1px solid var(--line);
  background: linear-gradient(90deg, rgba(var(--acc-rgb), .18), transparent 60%);
  font-size: 13px; color: var(--acc-isik); padding: 7px 0;
}
.serit-ic { display: inline-block; padding-left: 100%; animation: kay 26s linear infinite; }
@keyframes kay { to { transform: translateX(-100%); } }
.serit:hover .serit-ic { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) {
  .serit-ic { animation: none; padding-left: 22px; }
  .canli i { animation: none; }
}

/* ── KAHRAMAN ── */
.kahraman {
  text-align: center; padding: 70px 22px 55px;
  background: radial-gradient(900px 420px at 50% -10%, var(--isik) 0%, transparent 62%);
  border-bottom: 1px solid var(--line);
}
.kahraman h1 { margin: 0 0 6px; font-size: clamp(30px, 5vw, 46px); }
/* "Sesimiz net!" — hem slogan hem adres. Marka vurgusu bunda. */
.kahraman .slogan {
  font-size: clamp(17px, 2.6vw, 25px); font-weight: 800; letter-spacing: .5px;
  color: var(--acc-isik); margin: 0 0 14px;
}
.kahraman p { margin: 0 auto 26px; max-width: 640px; color: var(--dim); font-size: 17px; }
.kahraman-btn { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.btn-buyuk {
  display: inline-block; padding: 14px 30px; border-radius: 7px;
  background: linear-gradient(var(--acc-ust), var(--acc-alt)); color: #fff;
  font-weight: 800; letter-spacing: .5px; border: 1px solid var(--acc-cizgi);
}
.btn-buyuk:hover { filter: brightness(1.14); }
.btn-buyuk.ikincil { background: var(--panel2); border-color: var(--line2); color: var(--text); }
.rozetler {
  display: flex; gap: 18px; justify-content: center; flex-wrap: wrap;
  margin-top: 28px; font-size: 13px; color: var(--dim);
}

/* ── SAYI ŞERİDİ ── */
.sayilar {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  max-width: 1160px; margin: 0 auto; padding: 0 22px;
  border-bottom: 1px solid var(--line);
}
.sayi { text-align: center; padding: 20px 8px; border-right: 1px solid var(--line); }
.sayi:last-child { border-right: 0; }
.sayi b {
  display: block; font-size: 27px; font-weight: 800; color: var(--acc-isik);
  font-variant-numeric: tabular-nums;
}
.sayi span { font-size: 12px; color: var(--dim); }

/* ── MİKROFON ŞERİDİ ── */
.mik-serit {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  max-width: 1160px; margin: 0 auto; padding: 12px 22px;
  border-bottom: 1px solid var(--line);
}
.mik-etiket {
  font-size: 10.5px; font-weight: 800; letter-spacing: 1px; color: var(--green);
}
.mik-kisi {
  display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px;
  background: var(--panel); border: 1px solid var(--line); border-radius: 20px;
  padding: 4px 12px;
}
.mik-kisi i {
  width: 6px; height: 6px; border-radius: 50%; background: var(--green);
  box-shadow: 0 0 7px var(--green);
}
.mik-kisi em { font-style: normal; font-size: 11px; color: var(--dim); }

/* ── NASIL ÇALIŞIR ── */
.nasil, .ozellikler { max-width: 1160px; margin: 0 auto; padding: 40px 22px 10px; }
.nasil h2, .ozellikler h2 {
  text-align: center; font-size: 23px; margin: 0 0 26px;
}
.adimlar { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.adim {
  position: relative; padding: 22px 20px 20px; border-radius: 9px;
  background: linear-gradient(var(--panel), var(--bg2)); border: 1px solid var(--line);
}
.adim .no {
  display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%;
  background: linear-gradient(var(--acc-ust), var(--acc-alt)); color: #fff;
  font-weight: 800; margin-bottom: 11px; border: 1px solid var(--acc-cizgi);
}
.adim b { display: block; font-size: 16px; margin-bottom: 5px; }
.adim p { margin: 0; font-size: 13.5px; color: var(--dim); }
/* Konu sayfalarına giden kapılar — tıklanabilir kartlar */
.kapilar .adim { transition: border-color .12s, transform .12s; }
.kapilar .adim:hover { border-color: var(--acc); transform: translateY(-2px); }
.kapilar .adim .no { background: none; border: 0; font-size: 26px; width: auto; height: auto; }
.kapilar .adim::after { content: '→'; position: absolute; right: 18px; top: 22px; color: var(--dim); }
.kapilar .adim:hover::after { color: var(--acc); }

/* ── ÖZELLİKLER ── */
.ozellik-izgara { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 14px; }
.ozellik {
  padding: 18px; border-radius: 9px; background: var(--panel);
  border: 1px solid var(--line);
}
.ozellik:hover { border-color: var(--acc); }
.ozellik > span { font-size: 24px; display: block; margin-bottom: 8px; }
.ozellik b { display: block; font-size: 15px; margin-bottom: 4px; }
.ozellik p { margin: 0; font-size: 13px; color: var(--dim); }

/* ── DÜZEN ── */
.kap { max-width: 1160px; margin: 0 auto; padding: 34px 22px 60px; }
.kap.dar { max-width: 900px; }
.izgara { display: grid; grid-template-columns: 1fr 300px; gap: 30px; }
.kap h2 { font-size: 21px; margin: 34px 0 14px; padding-bottom: 8px; border-bottom: 1px solid var(--line); }
.kap h2:first-child { margin-top: 0; }
.alt-baslik { color: var(--dim); margin-top: -8px; }
.bos { color: var(--dim); font-style: italic; }
.tumu { display: inline-block; margin-top: 12px; color: var(--hi); font-size: 13.5px; }
.tumu:hover { text-decoration: underline; }

/* ── ODALAR ── */
.oda-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 9px; }
.oda-izgara.genis { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
.oda {
  display: block; padding: 13px 15px; border-radius: 7px;
  background: linear-gradient(var(--panel), var(--bg2));
  border: 1px solid var(--line); position: relative;
}
.oda:hover { border-color: var(--acc); transform: translateY(-1px); }
.oda b { display: block; font-size: 14.5px; }
.oda-konu {
  display: block; font-size: 12px; color: var(--dim); margin-top: 3px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.oda-sayi {
  position: absolute; top: 12px; right: 13px;
  font-size: 11px; color: var(--dim); font-variant-numeric: tabular-nums;
}
.oda-sayi.dolu { color: var(--green); font-weight: 700; }

/* ── HABERLER ── */
.haber-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; }
.haber-izgara.genis { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.haber {
  display: flex; flex-direction: column; border-radius: 8px; overflow: hidden;
  background: linear-gradient(var(--panel), var(--bg2)); border: 1px solid var(--line);
}
.haber:hover { border-color: var(--acc); }
.kapak { height: 140px; background-size: cover; background-position: center; display: block; }
.kapak.bos-kapak {
  display: grid; place-items: center; font-size: 34px;
  background: linear-gradient(135deg, var(--kapak1), var(--kapak2));
}
.kategori {
  display: inline-block; margin: 12px 14px 0; padding: 2px 8px; border-radius: 10px;
  font-size: 10px; font-weight: 800; letter-spacing: .6px; text-transform: uppercase;
  color: var(--hi); background: rgba(var(--hi-rgb), .12); border: 1px solid rgba(var(--hi-rgb), .3);
  align-self: flex-start;
}
.haber b { margin: 8px 14px 0; font-size: 16px; }
.ozet {
  margin: 6px 14px 0; font-size: 13px; color: var(--dim); flex: 1;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.meta { margin: 10px 14px 13px; font-size: 11.5px; color: var(--dim2); }

/* ── YAZI ── */
.yazi { background: var(--panel); border: 1px solid var(--line); border-radius: 9px; padding: 28px; }
.geri { color: var(--hi); font-size: 13px; }
.yazi h1 { margin: 10px 0 12px; font-size: clamp(24px, 4vw, 34px); }
.yazi-meta { display: flex; gap: 16px; flex-wrap: wrap; font-size: 12.5px; color: var(--dim); margin-bottom: 18px; }
.yazi-kapak { width: 100%; border-radius: 7px; margin-bottom: 18px; }
.yazi-ozet {
  font-size: 16.5px; color: var(--yazi-vurgu); border-left: 3px solid var(--acc);
  padding-left: 14px; margin-bottom: 20px;
}
.yazi-govde p { margin: 0 0 15px; }
.yazi-govde strong { color: var(--parlak); }
.cagri {
  text-align: center; margin: 34px 0 0; padding: 30px 26px;
  background: linear-gradient(rgba(var(--acc-rgb), .13), transparent);
  border: 1px solid var(--line2); border-radius: 9px;
}
.cagri h2 { border: 0; margin: 0 0 6px; padding: 0; font-size: 22px; }
.cagri b { display: block; font-size: 19px; margin-bottom: 5px; }
.cagri p { color: var(--dim); margin: 0 0 16px; }

/* ── SSS ── */
.sss { margin-top: 44px; }
.sss h2 { text-align: center; border: 0; font-size: 23px; margin-bottom: 18px; }
.sss-oge { border: 1px solid var(--line); border-radius: 8px; margin-bottom: 8px; background: var(--panel); }
.sss-soru {
  display: flex; justify-content: space-between; align-items: center; gap: 12px;
  width: 100%; text-align: left; background: none; border: 0; cursor: pointer;
  color: var(--text); font: inherit; font-weight: 600; font-size: 14.5px; padding: 14px 16px;
}
.sss-soru span { color: var(--acc); font-size: 19px; flex: 0 0 auto; }
.sss-oge.acik .sss-soru span { transform: rotate(45deg); }
.sss-cevap { display: none; padding: 0 16px 14px; }
.sss-oge.acik .sss-cevap { display: block; }
.sss-cevap p { margin: 0; font-size: 13.5px; color: var(--dim); }
.sss-cevap b { color: var(--hi); }

/* ── YAN KUTULAR ── */
.kutu {
  background: linear-gradient(var(--panel), var(--bg2));
  border: 1px solid var(--line); border-radius: 8px; padding: 15px; margin-bottom: 16px;
}
.kutu h3 {
  margin: 0 0 11px; font-size: 11px; letter-spacing: 1.1px;
  color: var(--dim); text-transform: uppercase;
}
.kisi { display: flex; align-items: center; gap: 7px; padding: 4px 0; font-size: 13px; }
.kisi .ik { width: 16px; }
.kisi .nk { flex: 1; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kisi .rl { font-size: 10.5px; color: var(--dim); }
.kisi .nokta {
  width: 7px; height: 7px; border-radius: 50%; background: var(--green); flex: 0 0 auto;
}
.duvar {
  padding: 9px 11px; margin-bottom: 8px; border-radius: 6px;
  background: rgba(var(--acc-rgb), .07); border-left: 2px solid var(--acc);
}
.duvar b { font-size: 12px; color: var(--hi); }
.duvar p { margin: 3px 0; font-size: 13px; }
.duvar .zaman { font-size: 10.5px; color: var(--dim2); }
.sayac { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--line); font-size: 12.5px; color: var(--dim); }
.sayac b { color: var(--hi); font-size: 15px; }

/* ── CANLI HAREKET ── */
.akis-satir {
  display: flex; align-items: center; gap: 7px; font-size: 12.5px;
  padding: 4px 0; border-bottom: 1px dashed var(--line);
}
.akis-satir:last-child { border-bottom: 0; }
.akis-satir i { width: 6px; height: 6px; border-radius: 50%; flex: 0 0 auto; }
.akis-satir.g i { background: var(--green); }
.akis-satir.c i { background: var(--dim2); }
.akis-satir b { font-weight: 600; }
.akis-satir span { color: var(--dim); flex: 1; }
.akis-satir em { font-style: normal; font-size: 10.5px; color: var(--dim2); }

/* ── KADRO ── */
.kadro-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
.kadro-kart {
  text-align: center; padding: 16px 10px; border-radius: 8px;
  background: linear-gradient(var(--panel), var(--bg2)); border: 1px solid var(--line);
}
.kadro-kart.cevrimici { border-color: rgba(63,214,125,.4); }
.kadro-kart .avatar {
  width: 46px; height: 46px; margin: 0 auto 9px; border-radius: 8px;
  display: grid; place-items: center; font-size: 22px;
  background: linear-gradient(var(--avatar1), var(--avatar2)); border: 1px solid var(--line2);
}
.kadro-kart b { display: block; font-size: 14px; }
.kadro-kart span { display: block; font-size: 11.5px; color: var(--dim); }
.kadro-kart .durum { font-size: 10.5px; margin-top: 4px; }
.kadro-kart.cevrimici .durum { color: var(--green); }

/* rütbe renkleri */
.r100 { color: #ff4d4d; } .r90 { color: #ff7a3d; } .r80 { color: var(--gold); }
.r70 { color: #ffd966; } .r60 { color: var(--purple); } .r50 { color: #c3a2ff; }
.r40 { color: #57a9ff; } .r30 { color: #7fc0ff; } .r20 { color: var(--green); }

/* ── SAYFALAMA ── */
.sayfalama { display: flex; gap: 16px; justify-content: center; align-items: center; margin-top: 28px; }
.sayfalama a { color: var(--hi); font-size: 14px; }
.sayfalama span { color: var(--dim); font-size: 13px; }

/* ── ALT BİLGİ ── */
.alt { border-top: 1px solid var(--line2); background: var(--bg2); margin-top: 50px; }
.alt-ic {
  max-width: 1160px; margin: 0 auto; padding: 34px 22px;
  display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 26px;
}
.alt-ic b { display: block; margin-bottom: 9px; font-size: 14px; }
.alt-ic p { color: var(--dim); font-size: 13px; margin: 0; }
.alt-ic a { display: block; color: var(--dim); font-size: 13px; padding: 3px 0; }
.alt-ic a:hover { color: var(--hi); }
.telif {
  text-align: center; padding: 15px; border-top: 1px solid var(--line);
  font-size: 12px; color: var(--dim2);
}
/* "Sesyum ile kuruldu" — ürünün kendi pazarlaması. Beyaz etikette gizlenir. */
.telif .urun {
  display: inline-block; margin-left: 10px; padding-left: 10px;
  border-left: 1px solid var(--line); color: var(--dim);
}
.telif .urun:hover { color: var(--hi); }

@media (max-width: 860px) {
  .izgara { grid-template-columns: 1fr; }
  .alt-ic { grid-template-columns: 1fr; }
  .ust { gap: 12px; }
  .ust nav { order: 3; width: 100%; }
  .sayi { border-right: 0; border-bottom: 1px solid var(--line); }
}