/* =====================================================================
   LikedWin — Kick sahnesi (lws--kick, kck-*)
   Kabuk: organik-hit ohs-* + sahne-motor lws-* (önce yüklenir). Burada
   yalnız Kick'e özel görünümler: kanal sayfası, canlı yayın + sohbet,
   izleme sayacı. Kick arayüzü koyu: oynatıcı/kanal kartı temadan bağımsız
   koyu zemin (platformun kendi görünümü). Gradyan YOK.
   ===================================================================== */

.lws--kick {
    --lws-brand: #53fc18;
    --lws-brand-ink: #0b0e0f;
    --lws-brand-soft: rgba(83, 252, 24, .14);
    --kck-bg: #0b0e0f;
    --kck-panel: #191b1f;
    --kck-line: #24272c;
    --kck-text: #e6e8eb;
    --kck-muted: #9aa1ab;
}
/* Açık zeminde neon yeşil okunmaz: grafik, kanıt simgeleri koyu yeşil */
.lws--kick .ohs-chart__col.is-up i { background: #3cc80f; }
.lws--kick .lws-shot__img > i:first-child,
.lws--kick .lws-shots__cap i { color: #2f9e0c; }

/* ---------- Kanal sayfası ---------- */
.kck-chan { display: flex; flex-direction: column; gap: 12px; }
.kck-chan .ohs-search__top { justify-content: space-between; }
.kck-card {
    position: relative;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    border-radius: 14px;
    background: var(--kck-bg);
    color: var(--kck-text);
    overflow: hidden;
}
.kck-banner {
    position: relative;
    height: 92px;
    background: #14261a;
}
.kck-banner__tag {
    position: absolute;
    right: 12px; bottom: 10px;
    display: inline-flex; align-items: center; gap: 6px;
    padding: 4px 10px;
    border-radius: 6px;
    background: rgba(0, 0, 0, .55);
    font-size: 11.5px; font-weight: 600;
    color: var(--kck-text);
}
.kck-chan__row { display: flex; align-items: center; gap: 12px; padding: 0 16px; margin-top: -26px; }
.kck-ava {
    display: grid; place-items: center;
    flex: 0 0 auto;
    width: 64px; height: 64px;
    border-radius: 50%;
    border: 3px solid var(--kck-bg);
    background: #53fc18;
    color: #0b0e0f;
    font-family: 'Plus Jakarta Sans', 'Inter', sans-serif;
    font-size: 20px; font-weight: 800;
}
.kck-chan__name { display: flex; flex-direction: column; min-width: 0; margin: 26px auto 0 0; }
.kck-chan__name b { font-size: 16px; font-weight: 800; color: #fff; white-space: nowrap; }
.kck-chan__name b i { font-size: 12px; color: #53fc18; }
.kck-chan__name small { font-size: 12.5px; color: var(--kck-muted); }
.kck-chan__name small b { font-size: 12.5px; font-weight: 700; color: var(--kck-text); display: inline; }
.kck-follow { margin-top: 26px; border-radius: 8px; }
.kck-follow.is-on { background: var(--kck-panel); color: var(--kck-text); box-shadow: inset 0 0 0 1px var(--kck-line); }
.kck-follow.is-on i::before { content: "\f004"; font-weight: 900; color: #53fc18; }
.kck-tabs { display: flex; gap: 18px; padding: 14px 16px 0; border-bottom: 1px solid var(--kck-line); font-size: 13px; font-weight: 600; color: var(--kck-muted); }
.kck-tabs span { padding-bottom: 9px; }
.kck-tabs .is-on { color: #fff; box-shadow: inset 0 -2px 0 #53fc18; }
.kck-vods { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; padding: 12px 16px 16px; }
.kck-vod { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.kck-vod b { font-size: 12px; font-weight: 600; color: var(--kck-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kck-vod__th { position: relative; display: grid; place-items: center; height: 70px; border-radius: 8px; background: var(--kck-panel); color: var(--kck-muted); }
.kck-vod__th em { position: absolute; right: 6px; bottom: 6px; padding: 1px 5px; border-radius: 4px; background: rgba(0, 0, 0, .7); font-style: normal; font-size: 10.5px; color: #fff; }
.kck-plus { right: 26px; top: 112px; color: #53fc18; }

/* ---------- Canlı yayın ---------- */
.kck-live { display: flex; flex-direction: column; gap: 12px; }
.kck-live .ohs-search__top { justify-content: space-between; }
.kck-stream {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 190px;
    flex: 1 1 auto;
    min-height: 0;
    border-radius: 14px;
    background: var(--kck-bg);
    overflow: hidden;
}
.kck-player { position: relative; display: grid; place-items: center; min-height: 0; background: #101418; }
.kck-scene { display: flex; gap: 16px; font-size: 40px; color: #2c3a30; }
.kck-live-tag { position: absolute; left: 12px; top: 12px; padding: 3px 8px; border-radius: 4px; background: #53fc18; color: #0b0e0f; font-size: 11px; font-weight: 800; letter-spacing: .04em; }
.kck-viewers { position: absolute; left: 70px; top: 12px; display: inline-flex; align-items: center; gap: 6px; padding: 3px 8px; border-radius: 4px; background: rgba(0, 0, 0, .6); color: #fff; font-size: 12px; font-weight: 700; }
.kck-viewers.is-bump { animation: lws-bump .45s ease; }
.kck-player__bar { position: absolute; left: 0; right: 0; bottom: 0; display: flex; flex-direction: column; padding: 10px 12px; background: rgba(0, 0, 0, .55); }
.kck-player__bar b { font-size: 13px; color: #fff; }
.kck-player__bar small { font-size: 11.5px; color: var(--kck-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kck-chat { display: flex; flex-direction: column; min-height: 0; border-left: 1px solid var(--kck-line); background: var(--kck-panel); }
.kck-chat__h { padding: 10px 12px; border-bottom: 1px solid var(--kck-line); font-size: 12px; font-weight: 700; color: var(--kck-text); }
.kck-chat ul { display: flex; flex-direction: column; justify-content: flex-end; gap: 7px; flex: 1 1 auto; min-height: 0; margin: 0; padding: 10px 12px; list-style: none; overflow: hidden; }
.kck-chat li { font-size: 11.5px; line-height: 1.4; color: var(--kck-text); }
.kck-chat li.is-new { animation: kck-in .35s ease; }
@keyframes kck-in { from { opacity: 0; transform: translateY(6px); } }
.kck-chat__in { margin: 0 10px 10px; padding: 7px 10px; border-radius: 6px; background: var(--kck-bg); font-size: 11px; color: var(--kck-muted); }

/* İzleme sayacı (HUD): süre çubuğu + kanıt dakikaları */
.kck-hud { right: 210px; bottom: 16px; width: 270px; }
.kck-hud__bar { display: block; height: 5px; margin-top: 10px; border-radius: 3px; background: var(--line); overflow: hidden; }
.kck-hud__bar i { display: block; height: 100%; background: #3cc80f; transform: scaleX(1); transform-origin: left center; }
.kck-hud__marks { display: flex; justify-content: space-between; gap: 6px; margin-top: 8px; }
.kck-hud__marks span { display: inline-flex; align-items: center; gap: 4px; padding: 3px 7px; border-radius: 6px; background: var(--ok-bg); color: var(--ok-fg); font-size: 10.5px; font-weight: 700; transition: background var(--ease), color var(--ease); }
.kck-hud__marks span.is-off { background: var(--surface-2); color: var(--muted-2); }
.kck-hud__marks span.is-snap { animation: lws-pop .45s cubic-bezier(.2, .9, .3, 1.4); }

@media (max-width: 620px) {
    .kck-banner { height: 70px; }
    .kck-ava { width: 52px; height: 52px; font-size: 16px; }
    .kck-chan__row { gap: 10px; padding: 0 12px; }
    .kck-chan__name b { font-size: 14px; }
    .kck-follow { padding: 0 12px; font-size: 12px; }
    .kck-vods { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 12px; }
    .kck-vod:nth-child(3) { display: none; }
    .kck-stream { grid-template-columns: minmax(0, 1fr); }
    .kck-chat { display: none; }
    .kck-scene { font-size: 30px; }
    .kck-hud { right: 12px; left: 12px; width: auto; }
}