/* =====================================================================
   LikedWin — X sahnesi (lws--x, xw-*)
   Kabuk: organik-hit ohs-* + sahne-motor lws-* (önce yüklenir). Burada
   yalnız X'e özel görünümler: profil, gönderi ayrıntısı (eylem çubuğu,
   yeniden gönder menüsü, yanıt kutusu, alıntı penceresi), gönderi ve
   takipçi analizi. X arayüzü platformun koyu ("Işıklar kapalı") renkleriyle
   çizilir: siyah zemin, açık yazı — sitenin iki temasında da aynı.
   Gradyan YOK.
   ===================================================================== */

.lws--x {
    --lws-brand: #0f1419;
    --lws-brand-ink: #fff;
    --lws-brand-soft: rgba(15, 20, 25, .08);
    --xw-bg: #000;
    --xw-panel: #16181c;
    --xw-line: #2f3336;
    --xw-text: #e7e9ea;
    --xw-muted: #71767b;
    --xw-blue: #1d9bf0;
    --xw-pink: #f91880;
    --xw-green: #00ba7c;
}
/* Koyu temada siyah marka zemini kaybolur: açık zemin + siyah simge */
:root[data-theme="dark"] .lws--x { --lws-brand: #e7e9ea; --lws-brand-ink: #0f1419; --lws-brand-soft: rgba(231, 233, 234, .12); }
@media (prefers-color-scheme: dark) {
    :root:not([data-theme]) .lws--x { --lws-brand: #e7e9ea; --lws-brand-ink: #0f1419; --lws-brand-soft: rgba(231, 233, 234, .12); }
}
.lws--x .lws-shot__img > i:first-child,
.lws--x .lws-shots__cap i { color: var(--ink); }

/* ---------- Ortak X kartı ---------- */
.xw-pv { display: flex; flex-direction: column; gap: 12px; }
.xw-pv .ohs-search__top { justify-content: space-between; }
.xw-card {
    position: relative;
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    border: 1px solid var(--xw-line);
    border-radius: 16px;
    background: var(--xw-bg);
    color: var(--xw-text);
    font-family: 'Inter', -apple-system, 'Segoe UI', sans-serif;
    overflow: hidden;
}
.xw-bar { display: flex; align-items: center; gap: 22px; flex: 0 0 auto; padding: 9px 14px; }
.xw-bar > i { font-size: 15px; color: var(--xw-text); }
.xw-bar > span:not(.xw-an__tag) { display: flex; flex-direction: column; min-width: 0; margin-right: auto; }
.xw-bar b { font-size: 16px; font-weight: 800; color: var(--xw-text); line-height: 1.2; }
.xw-bar small { font-size: 12px; color: var(--xw-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.xw-ava {
    display: grid; place-items: center;
    flex: 0 0 auto;
    width: 40px; height: 40px;
    border-radius: 50%;
    background: #c8a27a;
    color: #2b1d12;
    font-size: 16px;
}
.xw-ava--xs { width: 22px; height: 22px; font-size: 10px; }
.xw-ava--sm { width: 32px; height: 32px; font-size: 13px; }
.xw-ava--alt { background: #2c3a4a; color: #9cc3e6; }
.xw-ava--xl { width: 78px; height: 78px; font-size: 30px; border: 4px solid var(--xw-bg); }
.xw-pava { display: block; flex: 0 0 auto; width: 32px; height: 32px; border-radius: 50%; overflow: hidden; }
.xw-pava svg, .xw-pava img { display: block; width: 100%; height: 100%; object-fit: cover; }
.xw-badge { font-size: 14px; color: var(--xw-blue); }
.xw-btn {
    display: inline-flex; align-items: center;
    flex: 0 0 auto;
    height: 32px;
    padding: 0 16px;
    border-radius: 999px;
    background: #eff3f4;
    color: #0f1419;
    font-size: 13.5px;
    font-weight: 700;
    opacity: .5;
    transition: opacity .2s ease, transform .15s ease;
}
.xw-btn.is-ready, .xw-compose.has-val .xw-btn { opacity: 1; }
.xw-btn.is-press { transform: scale(.93); }
.xw-caret { display: inline-block; width: 2px; height: 1.1em; margin-left: 1px; vertical-align: -2px; background: var(--xw-blue); opacity: 0; }
.xw-compose.is-focus .xw-caret, .xw-qt.is-on .xw-caret { animation: xw-blink 1s steps(1) infinite; }
@keyframes xw-blink { 0%, 50% { opacity: 1; } 51%, 100% { opacity: 0; } }
.xw-plus { left: 0; top: 0; color: var(--xw-pink); z-index: 6; }

/* ---------- Profil ---------- */
.xw-cover { display: flex; align-items: center; justify-content: center; gap: 26px; flex: 0 0 auto; height: 92px; background: #3a2b20; color: #6b5442; font-size: 30px; }
.xw-prof__row { display: flex; align-items: flex-end; justify-content: space-between; padding: 0 14px; margin-top: -40px; }
.xw-follow {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 92px; height: 36px;
    padding: 0 18px;
    border-radius: 999px;
    background: #eff3f4;
    color: #0f1419;
    font-size: 14px;
    font-weight: 700;
    white-space: nowrap;
    transition: background .2s ease, color .2s ease, transform .15s ease;
}
.xw-follow.is-on { background: transparent; color: var(--xw-text); box-shadow: inset 0 0 0 1px #536471; }
.xw-follow.is-press { transform: scale(.94); }
.xw-prof__id { display: flex; flex-direction: column; padding: 8px 14px 0; }
.xw-prof__id b { font-size: 19px; font-weight: 800; color: var(--xw-text); }
.xw-prof__id small { font-size: 13.5px; color: var(--xw-muted); }
.xw-prof__bio { margin: 8px 14px 0; font-size: 14px; line-height: 1.4; color: var(--xw-text); }
.xw-prof__meta, .xw-prof__nums { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 8px 14px 0; font-size: 13px; color: var(--xw-muted); }
.xw-prof__meta i { margin-right: 4px; }
.xw-prof__nums b { font-weight: 700; color: var(--xw-text); font-variant-numeric: tabular-nums; }
.xw-tabs { display: flex; justify-content: space-between; margin-top: 12px; padding: 0 14px; border-bottom: 1px solid var(--xw-line); font-size: 14px; font-weight: 600; color: var(--xw-muted); }
.xw-tabs span { padding: 0 4px 11px; }
.xw-tabs .is-on { color: var(--xw-text); font-weight: 700; box-shadow: inset 0 -4px 0 var(--xw-blue); }

/* Sabitlenmiş gönderi (profil altı; kart taşarsa kırpılır) */
.xw-pin { display: flex; gap: 10px; flex: 1 1 auto; min-height: 0; padding: 10px 14px 0; overflow: hidden; }
.xw-pin__b { display: flex; flex-direction: column; gap: 2px; min-width: 0; font-size: 13.5px; line-height: 1.35; }
.xw-pin__b small { font-size: 12px; font-weight: 700; color: var(--xw-muted); }
.xw-pin__b small i { margin-right: 4px; }
.xw-pin__b span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--xw-muted); }
.xw-pin__b span b { color: var(--xw-text); }
.xw-pin__b p { margin: 0; color: var(--xw-text); }

/* ---------- Gönderi ayrıntısı ---------- */
.xw-head { display: flex; align-items: center; gap: 10px; padding: 2px 14px 0; }
.xw-id { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.xw-id b { font-size: 15px; font-weight: 700; color: var(--xw-text); white-space: nowrap; }
.xw-id small { font-size: 13.5px; color: var(--xw-muted); }
.xw-more { margin-left: auto; color: var(--xw-muted); font-size: 15px; }
.xw-text { margin: 10px 14px 0; font-size: 16px; line-height: 1.4; color: var(--xw-text); }
.xw-media {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2px;
    flex: 1 1 auto;
    min-height: 40px;
    margin: 12px 14px 0;
    border: 1px solid var(--xw-line);
    border-radius: 16px;
    overflow: hidden;
}
.xw-media span { display: grid; place-items: center; background: #3b2a1e; color: #c8a27a; font-size: 34px; }
.xw-media span + span { background: #26331f; color: #8fb27a; }
.xw-meta { margin: 12px 14px 0; padding-bottom: 11px; border-bottom: 1px solid var(--xw-line); font-size: 13.5px; color: var(--xw-muted); }
.xw-meta b { font-weight: 700; color: var(--xw-text); }
.xw-acts { position: relative; display: flex; align-items: center; justify-content: space-between; flex: 0 0 auto; padding: 4px 10px; border-bottom: 1px solid var(--xw-line); }
.xw-act {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 6px;
    border-radius: 999px;
    color: var(--xw-muted);
    font-size: 13px;
    transition: color .2s ease, transform .15s ease;
}
.xw-act i { font-size: 17px; }
.xw-act b { font-weight: 500; font-variant-numeric: tabular-nums; }
.xw-act.is-press { transform: scale(.9); }
.xw-act--like.is-on { color: var(--xw-pink); }
.xw-act--like.is-on i::before { content: "\f004"; font-weight: 900; }
.xw-act--rt.is-on { color: var(--xw-green); }
.xw-act--save.is-on { color: var(--xw-blue); }
.xw-act--save.is-on i::before { content: "\f02e"; font-weight: 900; }
.xw-act.is-on i { animation: lws-pop .45s cubic-bezier(.2, .9, .3, 1.4); }

/* "Yeniden gönder · Alıntı" menüsü (eylem çubuğunun üstünde) */
.xw-menu,
.xw-sug,
.xw-qt,
.xw-toast {
    visibility: hidden;
    opacity: 0;
    transition: opacity .22s ease, transform .28s cubic-bezier(.2, .9, .3, 1.2), visibility 0s linear .28s;
}
.xw-menu.is-on, .xw-sug.is-on, .xw-qt.is-on, .xw-toast.is-on { visibility: visible; opacity: 1; transition-delay: 0s; }
.xw-menu {
    position: absolute;
    left: calc(25% - 46px);
    bottom: calc(100% - 6px);
    z-index: 4;
    display: flex;
    flex-direction: column;
    padding: 4px 0;
    border-radius: 12px;
    background: var(--xw-bg);
    box-shadow: 0 0 14px rgba(255, 255, 255, .18), 0 0 2px 1px rgba(255, 255, 255, .14);
    transform: translateY(6px);
}
.xw-menu.is-on { transform: none; }
.xw-menu span { display: flex; align-items: center; gap: 12px; padding: 10px 18px 10px 14px; font-size: 14px; font-weight: 700; color: var(--xw-text); white-space: nowrap; }
.xw-menu i { width: 16px; font-size: 15px; }

/* Yanıt kutusu + yanıtlar */
.xw-compose { position: relative; display: flex; align-items: center; gap: 10px; flex: 0 0 auto; padding: 10px 14px; border-bottom: 1px solid var(--xw-line); }
.xw-input { position: relative; flex: 1 1 auto; min-width: 0; min-height: 22px; font-size: 15px; line-height: 1.35; color: var(--xw-text); }
.xw-input__ph { position: absolute; left: 0; top: 0; color: var(--xw-muted); white-space: nowrap; pointer-events: none; }
.xw-compose.has-val .xw-input__ph { display: none; }
[data-xw-typed].is-mention { color: var(--xw-blue); }
.xw-sug {
    position: absolute;
    left: 56px; top: calc(100% - 4px);
    z-index: 5;
    display: flex; align-items: center; gap: 10px;
    padding: 10px 16px 10px 12px;
    border-radius: 10px;
    background: var(--xw-bg);
    box-shadow: 0 0 14px rgba(255, 255, 255, .18), 0 0 2px 1px rgba(255, 255, 255, .14);
    transform: translateY(6px);
}
.xw-sug.is-on { transform: none; }
.xw-sug > span:last-child { display: flex; flex-direction: column; line-height: 1.25; }
.xw-sug b { font-size: 14px; color: var(--xw-text); }
.xw-sug small { font-size: 12.5px; color: var(--xw-muted); }
.xw-replies { flex: 1 1 auto; min-height: 0; margin: 0; padding: 0; list-style: none; overflow: hidden; }
.xw-reply { display: flex; gap: 10px; padding: 10px 14px; border-bottom: 1px solid var(--xw-line); }
.xw-reply.is-new { animation: xw-in .4s ease; }
@keyframes xw-in { from { opacity: 0; transform: translateY(-8px); } }
.xw-reply__b { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.xw-reply__h { font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.xw-reply__h b { font-weight: 700; color: var(--xw-text); }
.xw-reply__h small { font-size: 13px; color: var(--xw-muted); }
.xw-reply__t { font-size: 14px; line-height: 1.35; color: var(--xw-text); }
.xw-mention { color: var(--xw-blue); }

/* Alıntı penceresi */
.xw-qt {
    position: absolute;
    top: 12px; left: 12px; right: 12px;
    z-index: 5;
    display: flex;
    flex-direction: column;
    padding: 10px 14px 12px;
    border-radius: 16px;
    background: var(--xw-bg);
    box-shadow: 0 0 0 600px rgba(91, 112, 131, .4), 0 0 14px rgba(255, 255, 255, .16);
    transform: translateY(10px) scale(.98);
}
.xw-qt.is-on { transform: none; }
.xw-qt__top { display: flex; align-items: center; justify-content: space-between; font-size: 14px; font-weight: 700; color: var(--xw-blue); }
.xw-qt__top i { font-size: 17px; color: var(--xw-text); }
.xw-qt__body { display: flex; gap: 10px; padding: 12px 0 14px; }
.xw-qt__body .xw-pava { width: 38px; height: 38px; }
.xw-qt__main { display: flex; flex-direction: column; gap: 12px; flex: 1 1 auto; min-width: 0; }
.xw-qt__in { min-height: 26px; font-size: 17px; line-height: 1.35; color: var(--xw-text); }
.xw-qt__card { display: flex; gap: 8px; padding: 10px 12px; border: 1px solid var(--xw-line); border-radius: 14px; }
.xw-qt__card > span:last-child { min-width: 0; font-size: 13.5px; line-height: 1.35; }
.xw-qt__card b { color: var(--xw-text); }
.xw-qt__card small { color: var(--xw-muted); font-size: 13px; }
.xw-qt__card em { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin-top: 2px; font-style: normal; color: var(--xw-text); }
.xw-qt__foot { display: flex; align-items: center; justify-content: space-between; padding-top: 10px; border-top: 1px solid var(--xw-line); }
.xw-qt__tools { display: flex; gap: 16px; font-size: 16px; color: var(--xw-blue); }

.xw-toast {
    position: absolute;
    left: 50%; bottom: 14px;
    z-index: 6;
    display: inline-flex; align-items: center; gap: 8px;
    padding: 9px 16px;
    border-radius: 8px;
    background: var(--xw-blue);
    color: #fff;
    font-size: 13.5px;
    font-weight: 700;
    white-space: nowrap;
    transform: translate(-50%, 10px);
}
.xw-toast.is-on { transform: translate(-50%, 0); }

/* ---------- Analiz (son ekran) ---------- */
.xw-dash { display: flex; flex-direction: column; }
.xw-an__tag { flex: 0 0 auto; padding: 4px 12px; border: 1px solid var(--xw-line); border-radius: 999px; font-size: 12px; font-weight: 700; color: var(--xw-text); }
.xw-an__post { display: flex; align-items: center; gap: 10px; margin: 0 14px; padding: 9px 12px; border: 1px solid var(--xw-line); border-radius: 12px; font-size: 13px; color: var(--xw-muted); }
.xw-an__post > span:last-child { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.xw-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 12px 14px 0; }
.xw-tile { display: flex; flex-direction: column; gap: 2px; min-width: 0; padding: 10px 12px; border: 1px solid var(--xw-line); border-radius: 12px; }
.xw-tile small, .xw-met small { font-size: 11.5px; color: var(--xw-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.xw-tile b { font-size: 20px; font-weight: 800; letter-spacing: -.01em; color: var(--xw-text); font-variant-numeric: tabular-nums; }
.xw-mets { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; margin: 8px 14px 0; }
.xw-met {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 2px 6px;
    min-width: 0;
    padding: 8px 10px;
    border-radius: 10px;
    background: var(--xw-panel);
}
.xw-met i { grid-row: 1; grid-column: 1; font-size: 13px; color: var(--xw-muted); }
.xw-met.is-up { box-shadow: inset 0 0 0 1px rgba(29, 155, 240, .55); }
.xw-met b { grid-column: 1 / -1; font-size: 15px; font-weight: 800; color: var(--xw-text); font-variant-numeric: tabular-nums; }
.xw-met small { grid-column: 1 / -1; }
.xw-met em { grid-row: 1; grid-column: 2; justify-self: end; font-style: normal; font-size: 11px; font-weight: 700; color: var(--xw-green); }
.xw-met--like.is-up i { color: var(--xw-pink); }
.xw-met--rt.is-up i { color: var(--xw-green); }
.xw-met--reply.is-up i, .xw-met--save.is-up i, .xw-met--quote.is-up i { color: var(--xw-blue); }
.xw-chart { display: flex; flex-direction: column; gap: 8px; flex: 1 1 auto; min-height: 0; margin: 8px 14px 14px; padding: 10px 12px 8px; border: 1px solid var(--xw-line); border-radius: 12px; }
.xw-chart__cap { font-size: 12px; font-weight: 700; color: var(--xw-muted); }
.xw-chart__bars { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 8px; flex: 1 1 auto; min-height: 0; }
.xw-chart__bars--12 { grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 6px; }
.xw-chart__bars > span { display: flex; flex-direction: column; justify-content: flex-end; gap: 5px; min-height: 0; }
.xw-chart__bars i {
    display: block;
    height: var(--h);
    border-radius: 4px 4px 2px 2px;
    background: var(--xw-blue);
    transform: scaleY(0);
    transform-origin: bottom center;
    transition: transform .7s cubic-bezier(.2, .8, .2, 1);
    transition-delay: calc(var(--i) * .06s);
}
.xw-chart.is-grow .xw-chart__bars i { transform: scaleY(1); }
.xw-chart__bars small { height: 13px; font-size: 10.5px; line-height: 13px; text-align: center; color: var(--xw-muted); white-space: nowrap; }
.lws--x .ohs-win { background: var(--xw-blue); color: #fff; }
.lws--x .ohs-win i { color: #fff; }

/* Takipçi analizi */
.xw-an__big { display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; margin: 2px 14px 0; }
.xw-an__big > span:first-child { display: flex; flex-direction: column; }
.xw-an__big small { font-size: 13px; color: var(--xw-muted); }
.xw-an__big b { font-size: 30px; font-weight: 800; letter-spacing: -.02em; color: var(--xw-text); font-variant-numeric: tabular-nums; }
.xw-up { display: inline-flex; align-items: center; gap: 6px; margin-bottom: 6px; font-size: 13px; font-weight: 700; color: var(--xw-green); white-space: nowrap; }
.xw-an__split { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 10px; flex: 1 1 auto; min-height: 0; margin: 12px 14px 14px; }
.xw-an__split .xw-chart { margin: 0; }
.xw-nf { display: flex; flex-direction: column; gap: 6px; min-height: 0; padding: 10px 12px; border: 1px solid var(--xw-line); border-radius: 12px; overflow: hidden; }
.xw-nf ul { display: flex; flex-direction: column; margin: 0; padding: 0; list-style: none; }
.xw-nf li { display: flex; align-items: center; gap: 9px; padding: 8px 0; border-bottom: 1px solid var(--xw-line); }
.xw-nf li:last-child { border-bottom: 0; }
.xw-nf__id { display: flex; flex-direction: column; min-width: 0; margin-right: auto; line-height: 1.25; }
.xw-nf__id b { font-size: 13px; color: var(--xw-text); }
.xw-nf__id small { font-size: 11.5px; color: var(--xw-muted); white-space: nowrap; }
.xw-nf__btn { flex: 0 0 auto; padding: 5px 12px; border-radius: 999px; background: #eff3f4; color: #0f1419; font-size: 12px; font-weight: 700; }

@media (max-width: 620px) {
    .xw-pv { gap: 10px; }
    .xw-bar { gap: 18px; padding: 8px 12px; }
    .xw-bar b { font-size: 15px; }
    .xw-cover { height: 64px; font-size: 22px; }
    .xw-prof__row { margin-top: -32px; padding: 0 12px; }
    .xw-ava--xl { width: 64px; height: 64px; font-size: 24px; }
    .xw-follow { height: 32px; min-width: 0; padding: 0 14px; font-size: 13px; }
    .xw-prof__id { padding: 6px 12px 0; }
    .xw-prof__id b { font-size: 17px; }
    .xw-prof__bio { margin: 6px 12px 0; font-size: 13px; }
    .xw-prof__meta { display: none; }
    .xw-prof__nums { margin: 6px 12px 0; font-size: 12.5px; }
    .xw-tabs { margin-top: 10px; padding: 0 12px; font-size: 13px; }
    .xw-tabs span:nth-child(4) { display: none; }
    .xw-head { padding: 0 12px; }
    .xw-text { margin: 8px 12px 0; font-size: 14px; }
    .xw-media { margin: 10px 12px 0; }
    .xw-media span { font-size: 26px; }
    .xw-meta { margin: 8px 12px 0; padding-bottom: 8px; font-size: 12px; }
    .xw-acts { padding: 2px 6px; }
    .xw-act { gap: 4px; font-size: 12px; }
    .xw-act i { font-size: 15px; }
    .xw-act--share { display: none; }
    .xw-menu { left: calc(25% - 36px); }
    .xw-compose { padding: 8px 12px; }
    .xw-input { font-size: 13.5px; }
    .xw-btn { height: 30px; padding: 0 13px; font-size: 12.5px; }
    .xw-sug { left: 12px; }
    .xw-reply { padding: 8px 12px; }
    .xw-reply__t { font-size: 13px; }
    .xw-qt { top: 8px; left: 8px; right: 8px; padding: 10px 12px; }
    .xw-qt__in { font-size: 15px; }
    .xw-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; margin: 10px 12px 0; }
    .xw-tile { padding: 8px 10px; }
    .xw-tile b { font-size: 17px; }
    .xw-an__post { margin: 0 12px; }
    .xw-mets { gap: 4px; margin: 6px 12px 0; }
    .xw-met { padding: 7px 6px; gap: 2px 3px; }
    .xw-met small { display: none; }
    .xw-met b { font-size: 13px; }
    .xw-met em { font-size: 9.5px; }
    .xw-chart { margin: 6px 12px 12px; }
    .xw-chart__bars--12 { gap: 4px; }
    .xw-an__big { margin: 0 12px; }
    .xw-an__big b { font-size: 26px; }
    .xw-an__split { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) auto; margin: 10px 12px 12px; }
    .xw-nf li:nth-child(n+2) { display: none; }
    .xw-pin { padding: 10px 12px 0; }
    .lws--x .ohs-win { width: calc(100% - 28px); white-space: normal; font-size: 13px; justify-content: center; text-align: center; }
}