/* ============================================================
   KIZIL GECE — ElmaFM teması
   Kaynak: Google Stitch "ElmaFM Kirmizi Siyah Tema 1" (Tailwind) → saf CSS.
   Kural: çerçeve yok; kartlar zemin tonu + yumuşak gölgeyle ayrılır.
   ============================================================ */
/* Yazı tipleri sunucudan (Google Fonts bağımlılığı yok), Türkçe harfler latin-ext dosyasında */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url(/fonts/temalar/inter-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url(/fonts/temalar/inter-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url(/fonts/temalar/outfit-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url(/fonts/temalar/outfit-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
    --kg-zemin: #0d0e11;
    --kg-yuzey: #121316;
    --kg-yuzey-1: #1b1b1f;
    --kg-yuzey-2: #1f1f23;
    --kg-yuzey-3: #292a2d;
    --kg-parlak: #38393c;
    --kg-yazi: #e3e2e6;
    --kg-yazi-2: #e9bcb7;
    --kg-soluk: #af8783;
    --kg-soluk-2: #5f3f3b;
    --kg-pembe: #ffb4ab;
    --kg-kirmizi: #ff544b;
    --kg-kizil: #bb0112;
    --kg-kizil-2: #ff5447;
    --kg-yesil: #34d399;
    --kg-golge: 0 10px 30px rgba(0, 0, 0, .45);
    --kg-parilti: 0 0 24px -2px rgba(255, 30, 39, .45);
    --kg-baslik: 'Outfit', system-ui, sans-serif;
    --kg-govde: 'Inter', system-ui, sans-serif;

    /* Üyelik ve sohbet sayfaları Klasik view'dan gelir; renklerini bu değişkenlerden alır. */
    --k-zemin: #121316;
    --k-murekkep: #e3e2e6;
    --k-koyu: #292a2d;
    --k-koyu-yazi: #e3e2e6;
    --k-cizgi-koyu: transparent;
    --k-girdi: #1b1b1f;
    --k-beyaz-yazi: #ffffff;
    --k-ikincil: #e9bcb7;
    --k-soluk: #af8783;
    --k-soluk2: #af8783;
    --k-cizgi: transparent;
    --k-cizgi2: rgba(255, 255, 255, .06);
    --k-yuzey: #1b1b1f;
    --k-vurgu: #ff544b;
    --k-lacivert: #ffb4ab;
    --k-yesil: #34d399;
    --k-altin: #ffb4ab;
    --k-altin2: #ff544b;
    --k-metin: #e3e2e6;
    --k-baslik-font: 'Outfit';
    --k-govde-font: 'Inter';
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body.kg {
    margin: 0; background: var(--kg-zemin); color: var(--kg-yazi);
    font-family: var(--kg-govde); font-size: 14px; line-height: 1.55;
    -webkit-font-smoothing: antialiased; padding-bottom: 112px;
}
/* Sıfırlamalar :where() ile — özgüllüğü sıfır, bileşen sınıfları her zaman kazanır. */
.kg :where(a) { color: inherit; text-decoration: none; }
.kg :where(img) { display: block; max-width: 100%; }
.kg :where(button, input, textarea, select) { font: inherit; color: inherit; }
.kg ::selection { background: var(--kg-kizil); color: #fff; }
.kg :where(h1, h2, h3, h4) { margin: 0; font-family: var(--kg-baslik); color: #fff; }
.kg :where(p) { margin: 0; }
.kg .ikon { flex-shrink: 0; }

.kg-kap { width: 100%; max-width: 1440px; margin: 0 auto; padding: 0 32px; }

/* ---------- canlı nokta ---------- */
@keyframes kg-nabiz { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: .4; transform: scale(1.15); } }
.kg-nokta { width: 8px; height: 8px; border-radius: 50%; background: var(--kg-kirmizi); display: inline-block; animation: kg-nabiz 1.6s cubic-bezier(.4, 0, .6, 1) infinite; flex-shrink: 0; }
.kg-nokta.kucuk { width: 6px; height: 6px; }
.kg-nokta.yesil { background: var(--kg-yesil); }

/* ---------- rozetler ---------- */
.kg-rozet { display: inline-flex; align-items: center; gap: 6px; padding: 3px 9px; border-radius: 2px; font-size: 10px; line-height: 14px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; background: var(--kg-kizil); color: #fff; }
.kg-rozet.gri { background: var(--kg-parlak); }
.kg-rozet.koyu { background: var(--kg-yuzey-3); }
.kg-rozet.canli { border-radius: 12px; background: rgba(255, 30, 39, .16); color: #fff; padding: 2px 10px; }
.kg-rozet.ince { background: rgba(187, 1, 18, .3); color: var(--kg-pembe); padding: 1px 6px; }
.kg-rozet.yeni { background: rgba(255, 180, 171, .16); color: #ffdad6; padding: 1px 6px; }
.kg-etiket { font-size: 10px; line-height: 14px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--kg-soluk); }
.kg-olcu { font-size: 12px; line-height: 16px; font-weight: 500; letter-spacing: .05em; }

/* ---------- düğmeler ---------- */
.kg-dugme { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 8px 16px; border: 0; border-radius: 4px; cursor: pointer; font-size: 12px; font-weight: 600; letter-spacing: .04em; color: #fff; background: var(--kg-yuzey-3); transition: background .15s, transform .1s; }
.kg-dugme:hover { background: var(--kg-parlak); }
.kg-dugme:active { transform: scale(.97); }
.kg-dugme.kizil { background: var(--kg-kizil); box-shadow: 0 8px 18px rgba(187, 1, 18, .3); }
.kg-dugme.kizil:hover { background: var(--kg-kizil-2); }
.kg-dugme.tam { width: 100%; padding: 10px 16px; }
.kg-dugme.kucuk { padding: 4px 10px; font-size: 10px; border-radius: 2px; background: var(--kg-zemin); }
.kg-dugme.kucuk:hover { background: var(--kg-kizil); }
.kg-bag { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 600; letter-spacing: .04em; color: var(--kg-pembe); transition: color .15s; }
.kg-bag:hover { color: #fff; }

/* ---------- kartlar ---------- */
.kg-kart { background: var(--kg-yuzey); border-radius: 8px; box-shadow: var(--kg-golge); }
.kg-kart-bas { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-bottom: 14px; margin-bottom: 14px; box-shadow: 0 1px 0 rgba(255, 255, 255, .05); }
.kg-kart-bas h2, .kg-kart-bas h3 { font-size: 16px; line-height: 24px; font-weight: 700; display: flex; align-items: center; gap: 8px; }
.kg-kart-bas .ikon { color: var(--kg-kirmizi); }

/* ---------- bölüm başlığı ---------- */
.kg-bolum-bas { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 22px; }
.kg-ust-rozetler { display: flex; align-items: center; gap: 8px; }
.kg-bolum-bas h2 { font-size: 24px; line-height: 32px; font-weight: 700; letter-spacing: -.01em; margin-top: 6px; }
.kg-bolum-bas p { color: var(--kg-yazi-2); font-size: 12px; line-height: 18px; margin-top: 2px; }

/* ---------- önizleme şeridi ---------- */
.tema-onizleme { position: fixed; top: 10px; left: 50%; transform: translateX(-50%); z-index: 200; display: flex; align-items: center; gap: 12px; padding: 8px 14px; border-radius: 6px; font: 600 12px/1.3 system-ui, sans-serif; background: #fff; color: #111; box-shadow: 0 8px 30px rgba(0, 0, 0, .35); }
.tema-onizleme a { color: #bb0112; text-decoration: underline; }

/* ============================================================
   ÜST ŞERİT + MENÜ
   ============================================================ */
.kg-serit { background: var(--kg-zemin); color: var(--kg-yazi-2); padding: 8px 0; font-size: 10px; line-height: 14px; font-weight: 700; letter-spacing: .06em; }
.kg-serit .kg-kap { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.kg-serit-sol { display: flex; align-items: center; gap: 12px; min-width: 0; }
.kg-serit-sol .program { font-family: var(--kg-baslik); font-size: 12px; font-weight: 600; letter-spacing: 0; color: var(--kg-yazi); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kg-serit-sol .ayrac { color: var(--kg-soluk); }
.kg-serit .olcu { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 500; letter-spacing: .05em; }
.kg-serit-sag { display: flex; align-items: center; gap: 16px; font-size: 12px; font-weight: 500; letter-spacing: .05em; }
.kg-serit-sag a { color: var(--kg-pembe); display: inline-flex; align-items: center; gap: 5px; }

.kg-ust { position: sticky; top: 0; z-index: 50; background: rgba(18, 19, 22, .95); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); box-shadow: 0 6px 20px rgba(0, 0, 0, .35); }
.kg-ust .kg-kap { display: flex; align-items: center; justify-content: space-between; gap: 24px; height: 80px; }
.kg-logo { display: flex; align-items: center; gap: 4px; flex-shrink: 0; }
.kg-logo .duz { font-family: var(--kg-baslik); font-size: 24px; line-height: 32px; font-weight: 700; letter-spacing: -.02em; color: #fff; }
.kg-logo .vurgu { font-family: var(--kg-baslik); font-size: 16px; line-height: 24px; font-weight: 700; letter-spacing: .05em; color: #fff; background: var(--kg-kizil); padding: 2px 8px; border-radius: 4px; }
.kg-nav { display: flex; align-items: center; gap: 30px; }
.kg-nav a { position: relative; font-family: var(--kg-baslik); font-size: 16px; line-height: 24px; font-weight: 500; color: var(--kg-yazi-2); padding: 4px 0; transition: color .15s; white-space: nowrap; }
.kg-nav a:hover { color: var(--kg-pembe); }
.kg-nav a.acik { color: var(--kg-pembe); font-weight: 700; }
.kg-nav a.acik::after { content: ""; position: absolute; left: 50%; bottom: -6px; width: 6px; height: 6px; margin-left: -3px; border-radius: 50%; background: var(--kg-kirmizi); }
.kg-ust-sag { display: flex; align-items: center; gap: 14px; flex-shrink: 0; }
.kg-giris { display: inline-flex; align-items: center; gap: 6px; padding: 6px 8px; border-radius: 4px; font-size: 12px; font-weight: 600; letter-spacing: .04em; color: var(--kg-yazi-2); transition: color .15s, background .15s; }
.kg-giris:hover { color: var(--kg-pembe); background: var(--kg-yuzey-2); }
.kg-dinle { display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; border: 0; border-radius: 4px; cursor: pointer; font-size: 14px; font-weight: 600; letter-spacing: .02em; color: #fff; background: var(--kg-kizil); box-shadow: 0 10px 15px -3px rgba(187, 1, 18, .25); transition: background .15s, transform .1s; white-space: nowrap; }
.kg-dinle:hover { background: var(--kg-kizil-2); }
.kg-dinle:active { transform: scale(.97); }
.kg-dinle .ikon { animation: kg-nabiz 2s ease-in-out infinite; }
.kg-menu-ac { display: none; width: 42px; height: 42px; border: 0; border-radius: 4px; background: var(--kg-yuzey-2); color: #fff; cursor: pointer; align-items: center; justify-content: center; }

.kg-menu-panel { position: fixed; inset: 0; z-index: 150; background: rgba(13, 14, 17, .98); display: flex; flex-direction: column; padding: 18px 20px 120px; overflow-y: auto; }
.kg-menu-panel[hidden] { display: none; }
.kg-menu-ust { display: flex; align-items: center; justify-content: space-between; margin-bottom: 24px; }
.kg-menu-kapat { width: 42px; height: 42px; border: 0; border-radius: 4px; background: var(--kg-yuzey-2); color: #fff; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
.kg-menu-liste { display: flex; flex-direction: column; gap: 6px; }
.kg-menu-liste a { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; border-radius: 6px; background: var(--kg-yuzey); font-family: var(--kg-baslik); font-size: 20px; font-weight: 600; color: #fff; }
.kg-menu-liste a.acik { background: var(--kg-kizil); }
.kg-menu-alt { margin-top: 24px; display: flex; flex-direction: column; gap: 6px; font-size: 12px; color: var(--kg-yazi-2); }

/* ---------- reklam ---------- */
.kg-reklam-serit { margin-top: 24px; }
.kg-reklam { position: relative; background: var(--kg-yuzey-2); border-radius: 8px; padding: 26px 14px 14px; display: flex; justify-content: center; box-shadow: var(--kg-golge); }
.kg-reklam > .kg-etiket { position: absolute; top: 8px; left: 12px; letter-spacing: .2em; }
.kg-reklam img { width: 100%; height: auto; border-radius: 4px; }
.kg-reklam-ic { width: 100%; max-width: 970px; }

/* ============================================================
   ANA SAYFA
   ============================================================ */
.kg-ana { padding-top: 32px; padding-bottom: 8px; display: flex; flex-direction: column; gap: 48px; }
.kg-izgara { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 24px; }
.kg-izgara.genis { gap: 32px; }
.kg-s8 { grid-column: span 8; }
.kg-s4 { grid-column: span 4; }
.kg-yigin { display: flex; flex-direction: column; gap: 24px; }

/* manşet */
.kg-manset { position: relative; display: flex; flex-direction: column; justify-content: flex-end; min-height: 460px; border-radius: 8px; overflow: hidden; background: var(--kg-yuzey); box-shadow: var(--kg-golge); }
.kg-manset-gorsel { position: absolute; inset: 0; background-size: cover; background-position: center; transition: transform .7s; }
.kg-manset:hover .kg-manset-gorsel { transform: scale(1.05); }
.kg-manset::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, var(--kg-zemin) 0%, rgba(13, 14, 17, .7) 50%, transparent 100%); }
.kg-manset-ic { position: relative; z-index: 1; padding: 32px; display: flex; flex-direction: column; gap: 12px; }
.kg-manset-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; color: var(--kg-yazi-2); }
.kg-manset-meta span { display: inline-flex; align-items: center; gap: 5px; }
.kg-manset h1 { font-size: 36px; line-height: 44px; font-weight: 800; letter-spacing: -.015em; max-width: 672px; transition: color .15s; }
.kg-manset:hover h1 { color: var(--kg-pembe); }
.kg-manset-ozet { color: var(--kg-yazi-2); max-width: 672px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.kg-manset-alt { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 6px; }
.kg-yazar { display: flex; align-items: center; gap: 12px; }
.kg-avatar { width: 36px; height: 36px; border-radius: 50%; background: var(--kg-yuzey-2); color: var(--kg-pembe); font-weight: 700; display: flex; align-items: center; justify-content: center; font-size: 13px; }
.kg-yazar b { display: block; font-family: var(--kg-baslik); font-size: 12px; font-weight: 600; color: #fff; }
.kg-yazar small { display: block; font-size: 12px; color: var(--kg-soluk); }
.kg-manset .kg-dugme:hover { background: var(--kg-kizil); }

/* canlı stüdyo */
.kg-studyo { padding: 20px; display: flex; flex-direction: column; gap: 16px; }
.kg-sunucu { background: var(--kg-yuzey-1); border-radius: 4px; padding: 16px; box-shadow: var(--kg-parilti); }
.kg-sunucu-ust { display: flex; align-items: flex-start; gap: 16px; }
.kg-sunucu-ust img, .kg-sunucu-ust .yer { width: 64px; height: 64px; border-radius: 4px; object-fit: cover; background: var(--kg-yuzey-3); flex-shrink: 0; }
.kg-sunucu-ust .yer { display: flex; align-items: center; justify-content: center; color: var(--kg-kirmizi); }
.kg-sunucu .etk { font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--kg-kirmizi); }
.kg-sunucu h3 { font-size: 20px; line-height: 26px; font-weight: 700; }
.kg-sunucu p { font-size: 12px; color: var(--kg-yazi-2); margin-top: 2px; }
.kg-sunucu-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 8px; }
.kg-sunucu-meta span { display: inline-flex; align-items: center; gap: 4px; }
.kg-sunucu-meta .saat { color: #fff; }
.kg-sunucu-meta .saat .ikon, .kg-sunucu-meta .dinleyici { color: var(--kg-pembe); }
.kg-calan { display: flex; align-items: center; gap: 8px; margin-top: 12px; padding: 9px 10px; border-radius: 4px; background: rgba(13, 14, 17, .55); font-size: 12px; color: #fff; min-width: 0; }
.kg-calan .ikon { color: var(--kg-pembe); }
.kg-calan span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kg-akis-bas { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.kg-akis-liste { display: flex; flex-direction: column; gap: 6px; }
.kg-akis { display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 2px; background: var(--kg-zemin); color: var(--kg-yazi-2); font-size: 12px; }
.kg-akis .saat { font-size: 12px; font-weight: 500; letter-spacing: .05em; color: var(--kg-soluk); }
.kg-akis .ad { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kg-akis.bitti { opacity: .55; color: var(--kg-soluk); }
.kg-akis.canli { background: var(--kg-yuzey-2); color: #fff; box-shadow: inset 0 0 0 100vmax rgba(255, 30, 39, .06); }
.kg-akis.canli .saat { color: var(--kg-pembe); font-weight: 700; }
.kg-akis.canli .ad { font-weight: 600; }

/* top 10 */
.kg-top { padding: 24px; }
.kg-top-satirlar { display: flex; flex-direction: column; gap: 2px; margin-top: 4px; }
.kg-sarki { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 10px 8px; border-radius: 4px; transition: background .15s; }
.kg-sarki:hover { background: rgba(41, 42, 45, .6); }
.kg-sarki-sol { display: flex; align-items: center; gap: 16px; min-width: 0; }
.kg-sira { width: 32px; text-align: center; font-family: var(--kg-baslik); font-size: 20px; line-height: 28px; font-weight: 700; color: #fff; flex-shrink: 0; }
.kg-sira.ilk { color: var(--kg-pembe); }
.kg-kapak { width: 48px; height: 48px; border-radius: 2px; object-fit: cover; background: var(--kg-yuzey-3); flex-shrink: 0; }
.kg-sarki-ad { display: flex; align-items: center; gap: 8px; min-width: 0; }
.kg-sarki-ad h3 { font-size: 16px; line-height: 24px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: color .15s; }
.kg-sarki:hover .kg-sarki-ad h3 { color: var(--kg-pembe); }
.kg-sarki-sanatci { font-size: 12px; color: var(--kg-yazi-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kg-sarki-sag { display: flex; align-items: center; gap: 18px; flex-shrink: 0; }
.kg-hareket { text-align: right; }
.kg-hareket b { display: block; font-size: 12px; font-weight: 700; letter-spacing: .05em; }
.kg-hareket .up, .kg-hareket .new { color: var(--kg-yesil); }
.kg-hareket .down { color: var(--kg-kirmizi); }
.kg-hareket .same { color: var(--kg-soluk); }
.kg-hareket small { font-size: 10px; font-weight: 700; letter-spacing: .06em; color: var(--kg-soluk); }
.kg-oy-form { margin: 0; }
.kg-oy-durum { font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--kg-soluk); padding: 4px 10px; }
.kg-oy-durum.benim { color: var(--kg-pembe); }
.kg-oy-sayi { font-size: 12px; font-weight: 600; color: var(--kg-yazi-2); min-width: 44px; text-align: right; }

/* istek hattı + sohbet */
.kg-form { display: flex; flex-direction: column; gap: 12px; }
.kg-form label { display: flex; flex-direction: column; gap: 4px; }
.kg-form label > span { font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--kg-soluk); }
.kg-form input, .kg-form textarea { width: 100%; border: 0; border-radius: 4px; padding: 9px 12px; background: var(--kg-zemin); color: var(--kg-yazi); font-size: 12px; line-height: 18px; outline: none; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .15s; }
.kg-form input:focus, .kg-form textarea:focus { box-shadow: inset 0 0 0 1px var(--kg-kizil); }
.kg-form textarea { resize: none; }
.kg-form input::placeholder, .kg-form textarea::placeholder { color: var(--kg-soluk); }
.kg-form .kg-dugme { text-transform: uppercase; letter-spacing: .08em; font-weight: 700; }
.kg-bildirim { padding: 10px 12px; border-radius: 4px; background: rgba(52, 211, 153, .1); color: var(--kg-yesil); font-size: 12px; font-weight: 600; }
.kg-bildirim.hata { background: rgba(255, 84, 75, .12); color: var(--kg-pembe); }
.kg-aciklama { color: var(--kg-yazi-2); font-size: 12px; line-height: 18px; margin-bottom: 16px; }
.kg-sohbet-kart .kg-cevrimici { display: inline-flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 500; letter-spacing: .05em; color: var(--kg-yesil); }
.kg-sohbet-tanitim { margin: 4px 0 14px; padding: 12px; border-radius: 4px; background: var(--kg-zemin); color: var(--kg-yazi-2); font-size: 12px; line-height: 18px; }

/* haftalık akış */
.kg-hafta { padding: 24px; }
.kg-simdi { display: inline-flex; align-items: center; gap: 8px; color: var(--kg-soluk); font-size: 12px; font-weight: 500; letter-spacing: .05em; }
.kg-simdi b { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 2px; background: var(--kg-yuzey-3); color: #fff; font-weight: 500; box-shadow: var(--kg-parilti); }
.kg-hafta-kaydir { overflow-x: auto; margin-top: 8px; padding: 4px 4px 8px; }
.kg-hafta-izgara { min-width: 980px; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 12px; }
.kg-gun { background: var(--kg-yuzey-1); border-radius: 4px; padding: 12px; display: flex; flex-direction: column; gap: 10px; }
.kg-gun.haftasonu { background: rgba(41, 42, 45, .45); }
.kg-gun.bugun { background: var(--kg-yuzey-2); box-shadow: 0 0 0 2px rgba(187, 1, 18, .6), var(--kg-golge); }
.kg-gun-bas { text-align: center; padding-bottom: 8px; }
.kg-gun-bas b { display: block; font-family: var(--kg-baslik); font-size: 14px; line-height: 20px; font-weight: 700; color: #fff; }
.kg-gun-bas small { font-size: 12px; font-weight: 500; letter-spacing: .05em; color: var(--kg-soluk); }
.kg-gun.bugun .kg-gun-bas b { color: var(--kg-pembe); }
.kg-gun.bugun .kg-gun-bas small { color: var(--kg-kirmizi); font-weight: 700; }
.kg-gun.haftasonu .kg-gun-bas small { color: var(--kg-pembe); }
.kg-hucre { padding: 10px; border-radius: 2px; background: var(--kg-zemin); font-size: 12px; }
.kg-hucre small { display: block; font-size: 11px; font-weight: 500; letter-spacing: .05em; color: var(--kg-soluk); }
.kg-hucre b { display: block; margin-top: 2px; font-weight: 600; color: #fff; font-size: 13px; line-height: 18px; }
.kg-gun.bugun .kg-hucre { opacity: .7; }
.kg-gun.bugun .kg-hucre.canli, .kg-hucre.canli { opacity: 1; background: var(--kg-yuzey-3); box-shadow: 0 0 0 2px var(--kg-kirmizi), var(--kg-parilti); }
.kg-hucre.canli small { color: var(--kg-pembe); font-weight: 700; }
.kg-hucre.canli .kg-rozet { margin-bottom: 6px; padding: 1px 6px; }
.kg-hucre.bos b { color: var(--kg-soluk); font-weight: 500; }

/* programcılar */
.kg-dortlu { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.kg-programci { overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; transition: box-shadow .2s; }
.kg-programci:hover { box-shadow: var(--kg-golge), 0 0 0 1px rgba(187, 1, 18, .4); }
.kg-programci-gorsel { position: relative; height: 240px; overflow: hidden; background: var(--kg-yuzey-3); }
.kg-programci-gorsel img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.kg-programci:hover .kg-programci-gorsel img { transform: scale(1.05); }
.kg-programci-gorsel::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, var(--kg-yuzey) 0%, rgba(18, 19, 22, .4) 45%, transparent 100%); }
.kg-programci-gorsel .kg-rozet { position: absolute; top: 12px; left: 12px; z-index: 1; }
.kg-programci-ic { padding: 20px; display: flex; flex-direction: column; gap: 8px; }
.kg-programci h3 { font-size: 20px; line-height: 28px; font-weight: 700; transition: color .15s; }
.kg-programci:hover h3 { color: var(--kg-pembe); }
.kg-programci .prog { font-size: 12px; font-weight: 600; letter-spacing: .04em; color: var(--kg-pembe); }
.kg-programci .tanitim { font-size: 12px; line-height: 18px; color: var(--kg-yazi-2); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.kg-programci-alt { padding: 0 20px 20px; }
.kg-cipler { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.kg-cip { padding: 2px 8px; border-radius: 2px; background: var(--kg-yuzey-2); font-size: 11px; color: var(--kg-yazi-2); }

/* magazin */
.kg-ikili { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.kg-haber { overflow: hidden; display: flex; flex-direction: column; transition: box-shadow .2s; }
.kg-haber:hover { box-shadow: var(--kg-golge), 0 0 0 1px rgba(187, 1, 18, .35); }
.kg-haber-gorsel { position: relative; height: 192px; overflow: hidden; background: var(--kg-yuzey-3); }
.kg-haber-gorsel img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.kg-haber:hover .kg-haber-gorsel img { transform: scale(1.05); }
.kg-haber-gorsel .kg-rozet { position: absolute; top: 12px; left: 12px; }
.kg-haber-ic { padding: 20px; flex: 1; display: flex; flex-direction: column; justify-content: space-between; gap: 14px; }
.kg-haber-meta { display: flex; align-items: center; gap: 8px; color: var(--kg-soluk); margin-bottom: 8px; }
.kg-haber h3 { font-size: 20px; line-height: 28px; font-weight: 700; transition: color .15s; }
.kg-haber:hover h3 { color: var(--kg-pembe); }
.kg-arsiv { padding: 20px; }
.kg-arsiv-liste { display: flex; flex-direction: column; gap: 6px; }
.kg-arsiv-liste a { display: block; padding: 10px; margin: 0 -10px; border-radius: 4px; transition: background .15s; }
.kg-arsiv-liste a:hover { background: var(--kg-yuzey-1); }
.kg-arsiv-liste h4 { font-family: var(--kg-govde); font-size: 14px; line-height: 22px; font-weight: 600; color: #fff; transition: color .15s; }
.kg-arsiv-liste a:hover h4 { color: var(--kg-pembe); }
.kg-arsiv-liste small { font-size: 11px; font-weight: 500; letter-spacing: .05em; color: var(--kg-soluk); }

/* ============================================================
   İÇ SAYFALAR
   ============================================================ */
.kg-sayfa-bas { padding: 40px 0 8px; display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 32px; align-items: end; }
.kg-sayfa-bas h1 { font-size: 48px; line-height: 56px; font-weight: 800; letter-spacing: -.02em; margin-top: 10px; }
.kg-sayfa-bas p { color: var(--kg-yazi-2); font-size: 15px; line-height: 24px; }
.kg-ic { padding-top: 28px; display: flex; flex-direction: column; gap: 40px; }

/* top 10 sayfası */
.kg-zirve { overflow: hidden; }
.kg-zirve-gorsel { position: relative; height: 340px; background: var(--kg-yuzey-3); }
.kg-zirve-gorsel img { width: 100%; height: 100%; object-fit: cover; }
.kg-zirve-gorsel::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, var(--kg-yuzey) 0%, transparent 60%); }
.kg-zirve-ic { padding: 0 24px 24px; margin-top: -60px; position: relative; z-index: 1; display: flex; flex-direction: column; gap: 10px; }
.kg-zirve-ic .buyuk { font-family: var(--kg-baslik); font-size: 64px; line-height: 1; font-weight: 800; color: var(--kg-pembe); }
.kg-zirve-ic h2 { font-size: 30px; line-height: 36px; font-weight: 800; }
.kg-zirve-ic p { color: var(--kg-yazi-2); font-size: 15px; }

/* haber detayı */
.kg-haber-detay { overflow: hidden; }
.kg-haber-detay-gorsel { height: 420px; background: var(--kg-yuzey-3); }
.kg-haber-detay-gorsel img { width: 100%; height: 100%; object-fit: cover; }
.kg-haber-detay-ic { padding: 32px; display: flex; flex-direction: column; gap: 18px; }
.kg-haber-detay-ic .ozet { font-size: 18px; line-height: 30px; font-weight: 500; color: #fff; }
.kg-metin { font-size: 16px; line-height: 28px; color: var(--kg-yazi-2); max-width: 760px; }
.kg-metin p { margin: 0 0 18px; }
.kg-metin h2, .kg-metin h3 { color: #fff; margin: 28px 0 12px; line-height: 1.25; }
.kg-metin h2 { font-size: 26px; }
.kg-metin h3 { font-size: 21px; }
.kg-metin img { max-width: 100%; height: auto; margin: 18px 0; border-radius: 6px; }
.kg-metin a { color: var(--kg-pembe); text-decoration: underline; }
.kg-metin ul, .kg-metin ol { margin: 0 0 18px 20px; padding: 0; }
.kg-metin li { margin-bottom: 7px; }
.kg-metin blockquote { margin: 22px 0; padding: 14px 18px; border-radius: 4px; background: var(--kg-yuzey-1); color: #fff; font-size: 18px; box-shadow: inset 3px 0 0 var(--kg-kizil); }
.kg-metin hr { border: 0; height: 1px; background: rgba(255, 255, 255, .06); margin: 26px 0; }
.kg-yan-haber { display: grid; grid-template-columns: minmax(0, 1fr) 96px; gap: 14px; align-items: center; padding: 10px; margin: 0 -10px; border-radius: 4px; transition: background .15s; }
.kg-yan-haber:hover { background: var(--kg-yuzey-1); }
.kg-yan-haber img { width: 96px; height: 72px; object-fit: cover; border-radius: 4px; background: var(--kg-yuzey-3); }
.kg-yan-haber b { display: block; font-size: 14px; line-height: 20px; font-weight: 600; color: #fff; margin: 3px 0; }
.kg-yan-haber small { font-size: 11px; color: var(--kg-soluk); }

/* programlar sayfası */
.kg-program-liste { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.kg-program { padding: 24px; display: flex; flex-direction: column; gap: 10px; }
.kg-program h3 { font-size: 22px; line-height: 28px; font-weight: 700; }
.kg-program .kim { font-size: 12px; font-weight: 600; color: var(--kg-pembe); letter-spacing: .04em; }
.kg-program p { color: var(--kg-yazi-2); font-size: 14px; line-height: 22px; }

/* programcılar sayfası */
.kg-programci-genis { display: grid; grid-template-columns: 320px minmax(0, 1fr) 260px; gap: 0; overflow: hidden; }
.kg-programci-genis > img, .kg-programci-genis > .yer { width: 100%; height: 100%; min-height: 340px; object-fit: cover; background: var(--kg-yuzey-3); }
.kg-programci-genis .govde { padding: 32px; display: flex; flex-direction: column; gap: 12px; }
.kg-programci-genis h2 { font-size: 32px; line-height: 38px; font-weight: 800; }
.kg-programci-genis .prog { font-size: 13px; font-weight: 600; color: var(--kg-pembe); letter-spacing: .04em; }
.kg-programci-genis .tanitim { color: var(--kg-yazi-2); font-size: 15px; line-height: 26px; }
.kg-programci-genis .yan { padding: 28px 24px; background: var(--kg-yuzey-1); display: flex; flex-direction: column; gap: 10px; }
.kg-programci-genis .yan span.parca { display: flex; align-items: center; gap: 8px; font-size: 14px; color: #fff; }
.kg-programci-genis .yan span.parca .ikon { color: var(--kg-kirmizi); }

/* iletişim */
.kg-bilgi { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 16px; padding: 16px 0; }
.kg-bilgi + .kg-bilgi { box-shadow: 0 -1px 0 rgba(255, 255, 255, .05); }
.kg-bilgi b { display: block; font-size: 16px; color: #fff; font-weight: 600; }
.kg-bilgi small { font-size: 12px; color: var(--kg-soluk); }
.kg-teknik { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.kg-teknik div { padding: 16px; border-radius: 4px; background: var(--kg-yuzey-1); }
.kg-teknik b { display: block; font-family: var(--kg-baslik); font-size: 22px; font-weight: 700; color: var(--kg-pembe); }
.kg-teknik small { font-size: 12px; color: var(--kg-soluk); }
.kg-form.genis input, .kg-form.genis textarea { font-size: 14px; padding: 12px 14px; }

/* ============================================================
   ALT BİLGİ
   ============================================================ */
.kg-alt { background: var(--kg-zemin); margin-top: 64px; padding: 40px 0 24px; box-shadow: 0 -1px 0 rgba(255, 255, 255, .04); }
.kg-alt-izgara { display: grid; grid-template-columns: 2fr repeat(3, minmax(0, 1fr)); gap: 32px; padding-bottom: 40px; }
.kg-alt-marka { display: flex; flex-direction: column; gap: 16px; }
.kg-alt-marka p { color: var(--kg-yazi-2); font-size: 12px; line-height: 18px; max-width: 384px; }
.kg-alt h4 { font-size: 16px; line-height: 24px; font-weight: 700; margin-bottom: 12px; }
.kg-alt ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.kg-alt li a { font-size: 12px; color: var(--kg-yazi-2); transition: color .15s; }
.kg-alt li a:hover { color: var(--kg-pembe); }
.kg-alt-son { padding-top: 24px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; font-size: 12px; color: var(--kg-soluk); box-shadow: 0 -1px 0 rgba(255, 255, 255, .04); }

/* ============================================================
   SABİT PLAYER
   ============================================================ */
.kg-player { position: fixed; left: 0; right: 0; bottom: 0; z-index: 100; background: rgba(13, 14, 17, .95); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); box-shadow: 0 -12px 30px rgba(0, 0, 0, .5); padding: 12px 0; }
.kg-player .kg-kap { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.kg-pl-sol { display: flex; align-items: center; gap: 14px; min-width: 0; width: 320px; }
.kg-pl-kapak { position: relative; flex-shrink: 0; }
.kg-pl-kapak img { width: 48px; height: 48px; border-radius: 2px; object-fit: cover; background: var(--kg-yuzey-3); box-shadow: 0 0 0 1px rgba(255, 84, 75, .4); }
.kg-pl-kapak i { position: absolute; top: -4px; right: -4px; width: 12px; height: 12px; border-radius: 50%; background: var(--kg-kizil); box-shadow: 0 0 0 2px var(--kg-zemin); }
.kg-pl-bilgi { min-width: 0; }
.kg-pl-bilgi .ust { display: flex; align-items: center; gap: 6px; min-width: 0; }
.kg-pl-bilgi .ust .kg-rozet { font-size: 9px; padding: 1px 6px; flex-shrink: 0; }
.kg-pl-bilgi .sarki { font-family: var(--kg-baslik); font-size: 13px; font-weight: 700; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kg-pl-bilgi .sanatci { font-size: 12px; color: var(--kg-yazi-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
.kg-pl-orta { flex: 1; max-width: 576px; display: flex; flex-direction: column; align-items: center; gap: 6px; }
.kg-oynat { width: 40px; height: 40px; border: 0; border-radius: 12px; cursor: pointer; display: flex; align-items: center; justify-content: center; color: #fff; background: var(--kg-kizil); box-shadow: 0 10px 15px -3px rgba(187, 1, 18, .4); transition: background .15s, transform .1s; }
.kg-oynat:hover { background: var(--kg-kizil-2); }
.kg-oynat:active { transform: scale(.95); }
.kg-pl-dalga { width: 100%; display: flex; align-items: center; gap: 8px; font-size: 10px; font-weight: 700; letter-spacing: .05em; }
.kg-pl-dalga .sure { color: var(--kg-pembe); flex-shrink: 0; min-width: 32px; }
.kg-pl-dalga .durum { color: var(--kg-soluk); flex-shrink: 0; text-transform: uppercase; }
.kg-cubuklar { flex: 1; height: 24px; display: flex; align-items: center; gap: 2px; padding: 0 4px; border-radius: 2px; background: var(--kg-yuzey-2); overflow: hidden; }
.kg-cubuklar span { flex: 1; max-width: 4px; min-width: 2px; height: 3px; border-radius: 2px; background: var(--kg-soluk-2); }
.kg-pl-sag { width: 320px; display: flex; align-items: center; justify-content: flex-end; gap: 20px; }
.kg-pl-dinleyici { text-align: right; }
.kg-pl-dinleyici b { display: flex; align-items: center; justify-content: flex-end; gap: 6px; font-size: 11px; font-weight: 600; letter-spacing: .05em; color: var(--kg-pembe); }
.kg-pl-dinleyici small { display: block; font-size: 10px; color: var(--kg-soluk); }
.kg-pl-ses { display: flex; align-items: center; gap: 8px; color: var(--kg-soluk); }
.kg-pl-ses input { width: 84px; accent-color: var(--kg-kizil); cursor: pointer; }

/* sayfa geçişi sırasında hafif soluklaşma (gezinti.js) */
html.yukleniyor #sayfa { opacity: .6; transition: opacity .15s; }

/* ============================================================
   DUYARLI (tablet + telefon)
   ============================================================ */
@media (max-width: 1180px) {
    .kg-nav { gap: 20px; }
    .kg-nav a { font-size: 15px; }
    .kg-dortlu { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .kg-programci-genis { grid-template-columns: 260px minmax(0, 1fr); }
    .kg-programci-genis .yan { grid-column: 1 / -1; }
}
@media (max-width: 1024px) {
    .kg-nav, .kg-giris span { display: none; }
    .kg-menu-ac { display: inline-flex; }
    .kg-s8, .kg-s4 { grid-column: 1 / -1; }
    .kg-pl-sag { display: none; }
    .kg-pl-sol { width: auto; flex: 1; }
    .kg-alt-izgara { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .kg-alt-marka { grid-column: 1 / -1; }
    .kg-sayfa-bas { grid-template-columns: 1fr; gap: 12px; }
}
@media (max-width: 720px) {
    .kg-kap { padding: 0 16px; }
    .kg-serit-sag, .kg-serit .gizle-mobil { display: none; }
    .kg-ust .kg-kap { height: 64px; gap: 10px; }
    .kg-logo .duz { font-size: 21px; }
    .kg-dinle { padding: 8px 12px; font-size: 13px; }
    .kg-dinle .yazi-uzun { display: none; }
    .kg-ana { padding-top: 20px; gap: 32px; }
    .kg-manset { min-height: 420px; }
    .kg-manset-ic { padding: 20px; }
    .kg-manset h1 { font-size: 26px; line-height: 34px; }
    .kg-manset-alt { flex-wrap: wrap; }
    .kg-top, .kg-hafta { padding: 16px; }
    .kg-sarki { padding: 10px 4px; gap: 10px; }
    .kg-sarki-sol { gap: 10px; }
    .kg-sira { width: 24px; font-size: 17px; }
    .kg-kapak { width: 42px; height: 42px; }
    .kg-hareket, .kg-oy-sayi { display: none; }
    .kg-sarki-sag { gap: 8px; }
    .kg-dortlu, .kg-ikili, .kg-program-liste { grid-template-columns: 1fr; }
    .kg-bolum-bas h2 { font-size: 22px; }
    .kg-alt-izgara { grid-template-columns: 1fr 1fr; gap: 24px; }
    .kg-sayfa-bas h1 { font-size: 34px; line-height: 40px; }
    .kg-programci-genis { grid-template-columns: 1fr; }
    .kg-programci-genis > img, .kg-programci-genis > .yer { min-height: 280px; height: 280px; }
    .kg-programci-genis .govde { padding: 22px; }
    .kg-haber-detay-gorsel { height: 240px; }
    .kg-haber-detay-ic { padding: 20px; }
    .kg-teknik { grid-template-columns: 1fr; }
    .kg-bilgi { grid-template-columns: 1fr; gap: 4px; }
    .kg-player { padding: 10px 0; }
    .kg-pl-orta { flex: 0 0 auto; }
    .kg-pl-dalga { display: none; }
    body.kg { padding-bottom: 84px; }
}

/* istek hattı açılır penceresi (Views/Shared/_IstekPencere) */
:root { --ip-zemin: #121316; --ip-yazi: #e3e2e6; --ip-soluk: #af8783; --ip-girdi: #0d0e11; --ip-vurgu: #bb0112; --ip-baslik: 'Outfit', sans-serif; --ip-baslik-kalinlik: 800; --ip-baslik-buyuk: none; --ip-govde: 'Inter', system-ui, sans-serif; --ip-kose: 6px; }