/* ═══════════════════════════════════════════════════════════════════════════
   fleet-blog · скин арендатора zhedor («Мысли»).

   🔴 Это НАДСТРОЙКА над `blog.css`, а не второй набор стилей: подключается
   ПОСЛЕ него и переопределяет только переменные и десяток правил. Разметка
   у всех арендаторов одна — второй набор шаблонов означал бы, что любую
   правку ленты надо делать дважды, и один из двух раз про неё забудут.

   Значения взяты 1-в-1 со старой страницы (`zhedor/site/blog/index.html`
   и `_P_CSS` в `zhedor/site/admins/blog.py`) — это и есть «сохранить скин».
   ═══════════════════════════════════════════════════════════════════════════ */

:root{
--font:'Inter',system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
--serif:'Cormorant Garamond',Georgia,serif;
--bg:#FCFBF9;--card:#F4F0EA;--soft:#F4F0EA;
--ink:#16140F;--ink2:#3f3c34;--muted:#8C887E;--faint:#8C887E;
--line:#E7E4DC;
/* золото занимает место акцента: на нём держатся даты, ссылки и кнопки */
--violet:#9A8458;--violet2:#9A8458;--violetRGB:154,132,88;--violet2RGB:154,132,88;
--shadow:0 10px 30px rgba(0,0,0,.06),0 2px 6px rgba(0,0,0,.04);
--r-card:16px;--r-plate:8px;--r-av:14px;
--blog-onacc:#FCFBF9;
--blog-chip:#F4F0EA;
}
html[data-theme="dark"]{
--bg:#121110;--card:#1B1A17;--soft:#1B1A17;
--ink:#ECE8E0;--ink2:#C9C3B7;--muted:#8B8579;--faint:#8B8579;
--line:#2B2824;
--violet:#C2A86A;--violet2:#C2A86A;--violetRGB:194,168,106;--violet2RGB:194,168,106;
--blog-onacc:#121110;
--blog-chip:#1B1A17;
}
@media (prefers-color-scheme:dark){
html:not([data-theme="light"]){
--bg:#121110;--card:#1B1A17;--soft:#1B1A17;
--ink:#ECE8E0;--ink2:#C9C3B7;--muted:#8B8579;--faint:#8B8579;
--line:#2B2824;
--violet:#C2A86A;--violet2:#C2A86A;--violetRGB:194,168,106;--violet2RGB:194,168,106;
--blog-onacc:#121110;
--blog-chip:#1B1A17;
}}

/* ─── чего у личного микроблога нет ──────────────────────────────────────── */
/* 🔴 Обложки и аватара нет и не будет: полоса-заглушка в фиолетовую косую
   штриховку — это вид блога специалиста Pika, а здесь она читается как чужой
   элемент, приехавший вместе с движком. Пустой кружок аватара — как
   незагрузившаяся картинка. */
.sk-zhedor .b-nocover{display:none}
.sk-zhedor .b-noav{display:none}
.sk-zhedor .b-wrapin{padding-top:26px}

/* ─── типографика: серифный заголовок и курсивная золотая дата ───────────── */
body.sk-zhedor{font-weight:300;-webkit-font-smoothing:antialiased}
.sk-zhedor .b-h1{font-family:var(--serif);font-weight:300;letter-spacing:.01em;
  line-height:1.05;font-size:clamp(2.2rem,6vw,3.4rem)}
.sk-zhedor .b-desc{color:var(--muted)}
.sk-zhedor .b-date{font-family:var(--serif);font-style:italic;color:var(--violet);
  font-size:1.15rem;letter-spacing:.01em}

/* 🔴 ГЛАВНОЕ правило скина. Тексты zhedor многоабзацные (самый длинный — 12 366
   знаков), а `.b-txt` в общем файле переводы строк не держит: без `pre-wrap`
   все 222 записи схлопываются в сплошную стену текста. Старый движок печатал
   тело именно так. */
.sk-zhedor .b-txt{white-space:pre-wrap;word-wrap:break-word;
  color:var(--ink2);font-weight:300;font-size:1.04rem;line-height:1.8}
.sk-zhedor .b-txt a{color:var(--violet);text-decoration:underline;text-underline-offset:2px}

/* фасад YouTube внутри текста: чужой плеер грузится только по клику */
.sk-zhedor .b-ytf,.b-ytf{position:relative;display:block;width:100%;aspect-ratio:16/9;
  border-radius:12px;overflow:hidden;margin:16px 0;background:#000}
.b-ytf img{width:100%;height:100%;object-fit:cover;display:block;opacity:.9}
.b-ytf:hover img{opacity:1}
.b-ytfp{position:absolute;inset:0;margin:auto;width:64px;height:46px;border-radius:12px;
  background:rgba(0,0,0,.65);color:#fff;display:flex;align-items:center;justify-content:center}

/* теги под записью */
.b-tags{margin-top:14px;font-size:.76rem;color:var(--muted);letter-spacing:.02em}

/* ─── крошки, соседние записи, «Ещё из блога» ────────────────────────────── */
.b-crumb{font-size:.72rem;letter-spacing:.06em;color:var(--muted);margin-bottom:14px}
.b-crumb a{color:var(--muted);text-decoration:none}
.b-crumb a:hover{color:var(--violet)}
.b-pnav{display:flex;justify-content:space-between;gap:14px;margin-top:34px;padding-top:20px;
  border-top:1px solid var(--line)}
.b-pnav a{flex:0 1 46%;text-decoration:none;color:var(--muted);font-size:.9rem;transition:.2s}
.b-pnav a:hover{color:var(--violet)}
.b-pnav b{display:block;font-weight:400;color:var(--ink2);margin-top:4px;font-size:.86rem;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.b-nvn{margin-left:auto;text-align:right}
.b-also{margin-top:34px;padding-top:20px;border-top:1px solid var(--line)}
.b-alsoh{font-family:var(--serif);font-weight:400;font-size:1.5rem;color:var(--ink);
  margin-bottom:12px}
.b-also ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.b-also a{display:flex;gap:12px;align-items:baseline;text-decoration:none;color:var(--ink2);
  font-size:.94rem;line-height:1.5;transition:.2s}
.b-also a:hover{color:var(--violet)}
.b-also i{flex:0 0 auto;font-family:var(--serif);font-style:italic;color:var(--violet);
  font-size:1rem;min-width:96px}
.b-also span{min-width:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  overflow:hidden}
@media (max-width:520px){
  .b-also a{flex-direction:column;gap:2px}
  .b-also i{min-width:0}
}
