:root{
  --paper:#F5F2EC; --paper-2:#F0EBE1; --ink:#2A251D; --ink-soft:#5F584A;
  --muted:#8A8172; --faint:#B0A891; --rule:#D8CFBD; --rule-strong:#C7BCA4;
  --stamp:#8F4A34; --stamp-border:#B77358;
  --serif-d:'Playfair Display',Georgia,serif;
  --serif:'Lora',Georgia,'Times New Roman',serif;
  --mono:'PT Mono','Courier New',monospace;
}
*{box-sizing:border-box}
html,body{margin:0}
body{
  background-color:var(--paper);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='150' height='150'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0.16 0 0 0 0 0.14 0 0 0 0 0.11 0 0 0 0.03 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  color:var(--ink);font-family:var(--serif);font-size:17px;line-height:1.6;
}
a{color:inherit;text-decoration:none}
.wrap{max-width:1140px;margin:0 auto;padding:0 24px}

/* --- тонкая липкая полоска навигации (появляется при прокрутке вверх) --- */
.ministrip{position:fixed;top:0;left:0;right:0;z-index:50;background:var(--paper-2);border-bottom:1px solid var(--rule-strong);transform:translateY(-100%);transition:transform .22s ease;will-change:transform}
.ministrip.show{transform:translateY(0)}
.ms-inner{max-width:1140px;margin:0 auto;height:52px;display:flex;align-items:center;justify-content:space-between;padding:0 24px}
.ms-brand{font-family:var(--serif-d);font-weight:600;font-size:15px;letter-spacing:1px;text-transform:uppercase;color:#1E1A14}
.ms-brand:hover{color:var(--stamp)}
.ms-menu{display:flex;align-items:center;gap:18px}
.ms-menu a{font-family:var(--mono);font-weight:700;font-size:12px;letter-spacing:1.5px;text-transform:uppercase;color:#3E3930}
.ms-menu a:hover{color:var(--stamp)}
.ms-ico{display:inline-flex;align-items:center;color:var(--ink-soft);padding-left:14px;border-left:1px solid var(--rule-strong)}
.ms-ico:hover{color:var(--stamp)}
.ms-ico svg{display:block;width:18px;height:18px}
@media(max-width:560px){
  .ms-inner{height:46px}
  .ms-menu a:not(.ms-ico){display:none}
}

/* --- двухэтажная шапка: логотип + крупный титул, под ним меню --- */
header.bar{position:relative;background:var(--paper-2);border-bottom:3px double var(--ink);text-align:center;padding:24px 24px 0}
header.bar .brand{display:inline-flex;align-items:center;justify-content:center;gap:16px;font-family:var(--serif-d);font-weight:700;font-size:clamp(26px,5vw,42px);letter-spacing:1px;color:#1E1A14;text-transform:uppercase}
header.bar .brand span{text-align:center}
header.bar .brand img{height:50px;width:50px;object-fit:contain}
nav.menu{display:flex;gap:30px;flex-wrap:wrap;justify-content:center;padding:8px 0 16px}
nav.menu a{position:relative;font-family:var(--mono);font-weight:700;font-size:16px;letter-spacing:2px;text-transform:uppercase;color:#3E3930;padding:4px 0;border-bottom:1px solid transparent}
nav.menu a:hover,nav.menu a.on{color:var(--ink);border-bottom-color:var(--stamp)}

/* --- кастомная подсказка (нативный title стилизовать нельзя) --- */
nav.menu a[data-tip]::after{
  content:attr(data-tip);
  position:absolute;left:50%;top:calc(100% + 12px);transform:translateX(-50%);
  width:max-content;max-width:250px;
  font-family:var(--serif);font-style:italic;font-weight:400;font-size:15px;
  letter-spacing:0;text-transform:none;line-height:1.4;color:var(--ink-soft);
  background:var(--paper-2);border:1px solid var(--rule-strong);padding:9px 14px;
  box-shadow:0 6px 18px rgba(30,26,20,.12);
  opacity:0;pointer-events:none;transition:opacity .14s ease;z-index:30;
}
nav.menu a[data-tip]:hover::after{opacity:1}

/* --- поиск: иконка-лупа с хайрлайн-разделителем, а не пункт меню --- */
nav.menu a.ico{display:inline-flex;align-items:center;color:var(--ink-soft);margin-left:8px;padding:4px 0 4px 20px;border-bottom:1px solid transparent}
nav.menu a.ico::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);height:20px;width:1px;background:var(--rule-strong)}
nav.menu a.ico svg{display:block}
nav.menu a.ico:hover{color:var(--stamp);border-bottom-color:transparent}

/* --- «?» — путеводитель, кружок рядом с лупой --- */
nav.menu a.help-ico{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;margin-left:12px;padding:0;border:1.5px solid var(--stamp-border);border-radius:50%;color:var(--stamp);font-family:var(--serif-d);font-weight:700;font-size:15px;line-height:1;border-bottom:1.5px solid var(--stamp-border)}
nav.menu a.help-ico:hover{color:var(--paper);background:var(--stamp);border-color:var(--stamp)}

/* --- переключатель темы: луна (в светлой) / солнце (в тёмной) --- */
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;background:none;border:0;cursor:pointer;color:var(--ink-soft);padding:0;line-height:0}
.theme-toggle:hover{color:var(--stamp)}
.theme-toggle svg{display:block}
.theme-toggle .ic-sun{display:none}
[data-theme="dark"] .theme-toggle .ic-moon{display:none}
[data-theme="dark"] .theme-toggle .ic-sun{display:block}
.bar-theme{position:absolute;top:16px;right:18px;width:22px;height:22px}
.bar-theme svg{width:20px;height:20px}
.ms-theme{margin-left:14px;width:20px;height:20px}
.ms-theme svg{width:18px;height:18px}

.dateline{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-family:var(--mono);font-size:13px;letter-spacing:2px;text-transform:uppercase;color:#4A4437;max-width:620px;margin:12px auto 0;padding:0 24px}
.dateline a{color:inherit;border-bottom:1px solid transparent}
.dateline a:hover{color:var(--stamp);border-bottom-color:var(--stamp)}
@media(max-width:560px){.dateline{justify-content:center;gap:10px 16px;font-size:12px;letter-spacing:1.5px}}

/* --- «Свежее»: врезка-передовица на главной, до рубрик --- */
.lede{border-top:2px solid var(--ink);border-bottom:1px solid var(--rule);margin:12px 0 6px;padding:16px 0 22px}
.lede .kicker{display:inline-block;font-family:var(--mono);font-size:12px;letter-spacing:3px;text-transform:uppercase;color:var(--paper);background:var(--stamp);padding:4px 11px;margin-bottom:13px}
.lede-card{display:block}
.lede-ttl{font-family:var(--serif-d);font-weight:700;font-size:clamp(26px,3.4vw,31px);line-height:1.14;letter-spacing:.2px;margin:0 0 11px}
.lede-card:hover .lede-ttl{color:var(--stamp)}
.lede-dek{font-size:17px;line-height:1.6;color:var(--ink-soft);margin:0 0 13px;max-width:760px}

/* --- рубрика: жирная линия сверху, крупное имя, хвост-волосок вправо --- */
.rubhead{border-top:2px solid var(--ink);padding-top:14px;margin:38px 0 2px;display:flex;align-items:baseline;gap:18px}
.rubhead h2{font-family:var(--serif-d);font-weight:700;font-size:33px;line-height:1.08;margin:0;letter-spacing:.3px}
.rubhead h2 a{color:inherit}
.rubhead h2 a:hover{color:var(--stamp)}
.rubhead::after{content:"";flex:1;align-self:center;height:1px;background:var(--rule)}
.rubnote{font-family:var(--serif);font-style:italic;color:var(--muted);font-size:15px;margin:0 0 16px}

/* --- карточки: три в ряд, теги плотно под текстом --- */
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px 30px;align-items:start}
.card{display:flex;flex-direction:column;align-items:flex-start}
.card .ttl{font-family:var(--serif-d);font-weight:500;font-size:21px;line-height:1.22;margin:0 0 7px}
.card:hover .ttl{color:var(--stamp)}
.card .dek{font-size:15px;line-height:1.55;color:var(--ink-soft);margin:0 0 6px;
  display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  min-height:calc(1.55em * 2)}
.stamps{display:flex;gap:7px;flex-wrap:wrap;align-items:flex-start}
.stamp{display:inline-block;font-family:var(--mono);font-size:10px;letter-spacing:1.5px;text-transform:uppercase;color:var(--stamp);border:1px solid var(--stamp-border);padding:3px 8px;line-height:1.35;transform:rotate(-2deg);align-self:flex-start}
.stamp.sig{border-width:1.5px;background:rgba(143,74,52,.06)}
/* --- звезда «Любимое автором» у заголовка + кастомный тултип (как в меню) --- */
.fav{position:relative;display:inline-block;color:var(--stamp);font-size:.66em;vertical-align:.28em;margin-left:5px;line-height:0}
.fav[data-tip]::after{
  content:attr(data-tip);
  position:absolute;left:50%;top:calc(100% + 10px);transform:translateX(-50%);
  width:max-content;max-width:220px;
  font-family:var(--serif);font-style:italic;font-weight:400;font-size:14px;
  letter-spacing:0;text-transform:none;line-height:1.4;color:var(--ink-soft);
  background:var(--paper-2);border:1px solid var(--rule-strong);padding:8px 12px;
  box-shadow:0 6px 18px rgba(30,26,20,.12);
  opacity:0;pointer-events:none;transition:opacity .14s ease;z-index:30;
}
.fav[data-tip]:hover::after{opacity:1}

.more{display:block;width:max-content;margin:24px auto 4px;font-family:var(--mono);font-size:14px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--stamp);border:1.5px solid var(--stamp-border);padding:11px 24px;transition:background .15s ease,color .15s ease,border-color .15s ease}
.more:hover{background:var(--stamp);color:var(--paper);border-color:var(--stamp)}

/* --- страница чтения: яркая кнопка «назад» --- */
.readbar{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--rule-strong);padding:16px 0}
.readbar a{font-family:var(--mono);font-size:13px;letter-spacing:2px;text-transform:uppercase;color:var(--stamp)}
.readbar a:hover{color:var(--ink);border-bottom:1px solid var(--stamp)}
.readbar span{font-family:var(--mono);font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--muted)}
article.read{max-width:620px;margin:0 auto;padding:44px 0 60px}
article.read .stamps{margin-bottom:16px}
article.read h1{font-family:var(--serif-d);font-weight:700;font-size:clamp(30px,6vw,40px);line-height:1.12;margin:0 0 12px}
article.read .byline{font-family:var(--mono);font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--muted);margin-bottom:34px}
article.read .lead{font-weight:400;font-size:21px;line-height:1.7;font-style:italic;color:#4A4437;margin:0 0 26px}
article.read p{font-weight:500;font-size:19px;line-height:1.8;margin:0 0 22px}
article.read h2{font-family:var(--serif-d);font-weight:500;font-size:25px;margin:34px 0 14px}
.brk{text-align:center;color:var(--faint);font-family:var(--mono);letter-spacing:6px;margin:28px 0}

.tagband{text-align:center;padding:20px 0 6px}
.tagband .big{display:inline-block;font-family:var(--mono);font-size:20px;letter-spacing:4px;text-transform:uppercase;color:var(--stamp);border:2px solid var(--stamp-border);padding:8px 20px;transform:rotate(-1.5deg)}
.tagband .sub{font-style:italic;color:var(--muted);font-size:14px;padding:14px 0 0}
.taglist{max-width:640px;margin:22px auto 0}
.tagrow{display:flex;gap:18px;padding:22px 0;border-top:1px solid var(--rule)}
.tagrow .rub{flex:0 0 92px;font-family:var(--mono);font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--muted);padding-top:3px}

footer{border-top:1px solid var(--rule-strong);margin-top:34px;background:var(--paper-2)}
footer .row{display:flex;gap:7px 24px;flex-wrap:wrap;justify-content:center;max-width:1140px;margin:0 auto;padding:14px 24px 5px}
footer .row-fine{padding:0 24px 14px;gap:7px 20px}
footer .row-fine a{font-size:11px;letter-spacing:1.5px;color:var(--muted)}
footer a{font-family:var(--mono);font-size:12px;letter-spacing:2px;text-transform:uppercase;color:#4A4437}
footer a:hover{color:var(--stamp)}
@media(max-width:560px){
  footer .row{gap:5px 16px;padding:12px 16px 4px}
  footer .row-fine{padding:0 16px 12px;gap:5px 12px}
  footer .row-fine a{font-size:10px;letter-spacing:.5px}
}
a:focus-visible{outline:2px solid var(--stamp);outline-offset:3px}

.prose{max-width:620px;margin:0 auto;padding:36px 0 50px}
.prose h1{font-family:var(--serif-d);font-weight:700;font-size:34px;margin:0 0 20px}
.prose p{font-weight:500;font-size:18px;line-height:1.75;margin:0 0 18px}
.prose .intro{color:var(--muted)}
.prose ol.rules{margin:6px 0 20px;padding-left:26px}
.prose ol.rules li{font-weight:500;font-size:18px;line-height:1.75;margin:0 0 18px;padding-left:6px}
.prose ol.rules li::marker{font-family:var(--serif-d);color:var(--stamp)}
.prose .rlead{font-family:var(--serif-d)}
.prose .ph{font-family:var(--mono);font-size:13px;color:var(--faint)}
.searchbox input{width:100%;font-family:var(--serif);font-size:20px;color:var(--ink);background:transparent;border:none;border-bottom:2px solid var(--ink);padding:12px 4px;outline:none;margin:20px 0 6px}
.searchbox input::placeholder{color:var(--faint);font-style:italic}
.shint{font-family:var(--mono);font-size:11px;letter-spacing:1px;color:var(--faint);margin:8px 0 24px}

@media(max-width:900px){
  .grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){
  header.bar{padding:20px 14px 0}
  header.bar .brand{font-size:clamp(24px,7vw,32px);gap:14px}
  header.bar .brand img{height:60px;width:60px}
  .bar-theme{top:12px;right:14px}
  /* меню в одну строку: рубрики + лупа + «?» */
  nav.menu{gap:9px;flex-wrap:nowrap;padding:10px 2px 14px}
  nav.menu a{font-size:11px;letter-spacing:1px;white-space:nowrap}
  nav.menu a.ico{margin-left:6px;padding-left:8px}
  nav.menu a.ico::before{height:16px}
  nav.menu a.ico svg{width:16px;height:16px}
  nav.menu a.help-ico{width:20px;height:20px;margin-left:8px;font-size:12px}
  .grid{grid-template-columns:1fr}
  .rubhead h2{font-size:28px}
  article.read p{font-size:18px}
  /* режем вертикальный воздух служебных страниц на мобиле */
  .readbar{padding:11px 0}
  .readbar a{text-align:center}                 /* перенос «‹ Диагнозы и / фантазии» центрируем */
  .prose{padding:22px 0 40px}
  .prose h1{font-size:27px;margin:0 0 14px}
  .prose.help .hitem{padding:12px 0}
}

/* ==== картинки в тексте (генератор v2) ==== */
/* Страховка: ЛЮБАЯ картинка в тексте не шире колонки, даже если осталась инлайновой (не в figure). */
article.read img,article.read picture,.prose img,.prose picture{max-width:100%;height:auto}
article.read figure{margin:30px 0;padding:0}
article.read figure picture,article.read figure img{display:block;width:100%;height:auto;border:1px solid var(--rule)}
article.read figcaption{font-style:italic;color:var(--muted);font-size:14px;line-height:1.45;text-align:center;padding:9px 6px 0}
/* обтекание — только на десктопе */
@media(min-width:701px){
  article.read figure.right{float:right;width:300px;margin:6px 0 18px 30px}
  article.read figure.left{float:left;width:300px;margin:6px 30px 18px 0}
  article.read figure.wide{margin-left:-70px;margin-right:-70px}
  article.read figure.right figcaption,article.read figure.left figcaption{text-align:left}
}
article.read::after{content:"";display:block;clear:both}
/* markdown-it: лид (>) и разделитель (* * * / ---) */
article.read blockquote{margin:0 0 26px;padding:0;border:0}
article.read blockquote p{font-weight:400;font-size:21px;line-height:1.7;font-style:italic;color:#4A4437;margin:0 0 12px}
article.read hr{border:0;text-align:center;margin:30px 0;height:auto}
article.read hr::before{content:"* * *";color:var(--faint);font-family:var(--mono);letter-spacing:6px}
/* реплики диалога: тире висит у левого края, перенос строки выравнивается по тексту, воздух между репликами */
article.read p.dlg{font-weight:500;font-size:19px;line-height:1.7;margin:0 0 12px;padding-left:1.5em;text-indent:-1.5em}
article.read p.dlg+p:not(.dlg){margin-top:22px}

/* ==== фото автора на странице «Об авторе» ==== */
.prose.about figure{max-width:320px;margin:26px auto 30px;padding:10px 10px 0;background:var(--paper-2);border:1px solid var(--rule-strong)}
.prose.about figure picture,.prose.about figure img{display:block;width:100%;height:auto}
.prose.about figcaption{font-style:italic;color:var(--ink-soft);font-size:14px;line-height:1.45;text-align:center;padding:12px 4px 6px}
.prose.about a{color:var(--stamp);border-bottom:1px solid transparent}
.prose.about a:hover{border-bottom-color:var(--stamp)}

/* ==== концовка рассказа: TG-врезка + «Ещё по теме» ==== */
.endmatter{max-width:620px;margin:0 auto;padding:0 0 60px}
.tg-cta{text-align:center;margin:8px 0 0}
.tg-cta .tg-plane{width:24px;height:24px;color:var(--stamp);opacity:.92}
.tg-cta p{font-family:var(--serif);font-style:italic;font-size:18px;line-height:1.6;color:var(--ink-soft);margin:10px auto 0;max-width:440px}
.tg-cta a{color:var(--stamp);font-style:normal;font-weight:500;border-bottom:1px solid transparent}
.tg-cta a:hover{border-bottom-color:var(--stamp)}
.endsep{border:0;height:1px;background:var(--rule);max-width:130px;margin:36px auto}
.related h3{font-family:var(--mono);font-size:12px;letter-spacing:3px;text-transform:uppercase;color:var(--muted);text-align:center;margin:0 0 18px;font-weight:400}
.rel-row{display:flex;gap:16px;align-items:baseline;padding:15px 0;border-top:1px solid var(--rule)}
.rel-row:first-of-type{border-top:0}
.rel-row .rub{flex:0 0 84px;font-family:var(--mono);font-size:10px;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted);padding-top:4px}
.rel-b{flex:1}
.rel-t{display:block;font-family:var(--serif-d);font-weight:500;font-size:19px;line-height:1.25;color:var(--ink)}
.rel-row:hover .rel-t{color:var(--stamp)}
.rel-dek{display:block;font-size:14px;line-height:1.5;color:var(--muted);margin-top:3px}

/* ==== путеводитель «Что здесь происходит?» ==== */
.prose.help .hitem{padding:16px 0;border-top:1px solid var(--rule)}
.prose.help .hitem:first-of-type{border-top:0}
.prose.help .hterm{font-family:var(--serif-d);font-weight:600;font-size:20px;color:var(--ink);margin:0 0 4px}
.prose.help .hterm .hstar{color:var(--stamp);margin-right:5px}
.prose.help .hdesc{font-size:17px;line-height:1.6;color:var(--ink-soft);margin:0}
.prose.help .hfoot{margin-top:24px;padding-top:20px;border-top:2px solid var(--ink);font-size:17px;color:var(--ink)}
.prose.help .hfoot a{color:var(--stamp);border-bottom:1px solid var(--stamp)}

/* ==== тёмная тема: тёплая бумага (не чёрный), винный подсвечен, зерно пересобрано ==== */
[data-theme="dark"]{
  --paper:#1C1814; --paper-2:#242019; --ink:#E9E1D3; --ink-soft:#C4BAA8;
  --muted:#948A78; --faint:#6B6153; --rule:#38322A; --rule-strong:#4A4238;
  --stamp:#CB8064; --stamp-border:#A9634A;
}
[data-theme="dark"] body{
  background-color:var(--paper);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='150' height='150'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0.90 0 0 0 0 0.84 0 0 0 0 0.72 0 0 0 0.05 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
[data-theme="dark"] header.bar .brand,
[data-theme="dark"] .ms-brand{color:#EFE7D8}
/* лого — тёмные линии в тон чернил; в тёмной теме инвертируем к кремовому (обе ширины; в министрип лого нет) */
[data-theme="dark"] header.bar .brand img{filter:invert(1) sepia(.3) brightness(.9)}
[data-theme="dark"] nav.menu a,
[data-theme="dark"] .ms-menu a{color:#C4BAA8}
[data-theme="dark"] .dateline,
[data-theme="dark"] footer a{color:#9A8F7C}
[data-theme="dark"] footer .row-fine a{color:var(--faint)}
[data-theme="dark"] article.read .lead,
[data-theme="dark"] article.read blockquote p{color:#C4BAA8}
[data-theme="dark"] .stamp.sig{background:rgba(203,128,100,.10)}

/* ==== полоска согласия на cookies (острые углы, бумага, винный акцент) ==== */
.cookiebar{position:fixed;left:0;right:0;bottom:0;z-index:60;background:var(--paper-2);border-top:1px solid var(--rule-strong);box-shadow:0 -6px 20px rgba(30,26,20,.10);padding:14px 24px;display:flex;align-items:center;gap:18px;flex-wrap:wrap;justify-content:center}
.cookiebar[hidden]{display:none}
.cookiebar .cb-text{font-family:var(--serif);font-size:15px;line-height:1.5;color:var(--ink-soft);margin:0;max-width:640px}
.cookiebar .cb-btns{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.cookiebar button{font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;cursor:pointer;padding:9px 18px;border:1.5px solid var(--stamp-border);background:none;color:var(--stamp);transition:background .15s ease,color .15s ease,border-color .15s ease}
.cookiebar .cb-yes{background:var(--stamp);color:var(--paper);border-color:var(--stamp)}
.cookiebar .cb-yes:hover{background:var(--stamp-border);border-color:var(--stamp-border)}
.cookiebar .cb-no:hover{background:var(--stamp);color:var(--paper)}
.cookiebar .cb-more{font-family:var(--mono);font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--muted);border-bottom:1px solid transparent}
.cookiebar .cb-more:hover{color:var(--stamp);border-bottom-color:var(--stamp)}
@media(max-width:560px){
  .cookiebar{padding:12px 14px;gap:10px}
  .cookiebar .cb-text{font-size:14px}
  .cookiebar button{padding:8px 14px;font-size:11px}
}