/* Зоркий сокол — общий CSS. Концепция «кабинет окулиста»: таблица Сивцева, кольца Ландольта,
   дуохромный тест (красное/зелёное), бланк рецепта. Описание блоков и классов: design/README.md */

/* ---------- 1. Шрифты: локальные woff2, кириллица + латиница ---------- */
@font-face{font-family:'Geologica';font-style:normal;font-weight:400 800;font-display:swap;src:url(../fonts/geologica-cyrillic-var.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Geologica';font-style:normal;font-weight:400 800;font-display:swap;src:url(../fonts/geologica-latin-var.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:'Literata';font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/literata-cyrillic-var.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Literata';font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/literata-latin-var.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:'PT Mono';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/pt-mono-cyrillic-400.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'PT Mono';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/pt-mono-latin-400.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}

/* ---------- 2. Токены ---------- */
:root{
  --paper:#f4f2ec;      /* фон страницы: бумага бланка */
  --paper-2:#ebe7dc;    /* подложки */
  --box:#fdfdfa;        /* «световой короб»: панели, рамки картинок */
  --ink:#1a1e1c;        /* текст */
  --ink-2:#47504b;      /* вторичный текст */
  --ink-3:#616a65;      /* мета, подписи (4,99:1 на paper, 4,52:1 на paper-2) */
  --rule:#d9d4c7;       /* волосяные линии */
  --rule-2:#bcb6a6;     /* рамки */
  --case:#2a2f2c;       /* корпус аппарата Рота (рамка таблицы) */
  --wall:#22332e;       /* подвал: крашеная стена кабинета */
  --wall-ink:#e8ece6;
  --wall-dim:#a6b6ae;
  --mint:#e2ebe4;       /* заметки в тексте */
  --mint-rule:#b8cabe;
  --link:#13695b;       /* ссылки: без подчёркивания, цветом */
  --link-hover:#0a4d42;
  --red:#b5352a;        /* дуохром, указка, текущий пункт */
  --green:#3b7a4b;      /* дуохром */
  --f-ui:'Geologica',system-ui,-apple-system,'Segoe UI',sans-serif;
  --f-text:'Literata',Georgia,'Times New Roman',serif;
  --f-mono:'PT Mono',ui-monospace,Consolas,monospace;
  --wrap:1560px;
  --gutter:clamp(18px,2.5vw,40px);
  --measure:860px;      /* колонка текста */
  --sec:clamp(40px,4.5vw,60px);
}

/* ---------- 3. База ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:16px}
body{margin:0;background:var(--paper);color:var(--ink);font:400 18px/1.65 var(--f-text);overflow-wrap:break-word;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto}
a{color:var(--link);text-decoration:none}
a:hover{color:var(--link-hover);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.2em}
:focus-visible{outline:2px solid var(--red);outline-offset:2px}
h1,h2,h3,h4{font-family:var(--f-ui);color:var(--ink)}
.wrap{max-width:var(--wrap);margin:0 auto;padding-left:var(--gutter);padding-right:var(--gutter)}
.skip-link{position:absolute;left:-9999px;top:0}
.skip-link:focus{left:12px;top:10px;z-index:100;background:var(--ink);color:var(--paper);padding:8px 14px;font:600 15px var(--f-ui)}
.vh{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}

/* Кнопка */
.btn{display:inline-flex;align-items:center;gap:10px;padding:14px 22px;background:var(--ink);color:var(--paper);font:600 16px/1.1 var(--f-ui);border:0;border-radius:2px;cursor:pointer}
.btn:hover{background:var(--link-hover);color:#fff;text-decoration:none}
.btn--line{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}
.btn--line:hover{background:var(--ink);color:var(--paper)}

/* Кольцо Ландольта: <i class="landolt" style="--d:24px;--r:90deg"></i>; --r — куда смотрит разрыв (0 = вправо) */
.landolt{--d:20px;--r:0deg;display:inline-block;flex:none;width:var(--d);height:var(--d);border-radius:50%;
  border:calc(var(--d)/5) solid currentColor;transform:rotate(var(--r));
  clip-path:polygon(0 0,100% 0,100% 40%,50% 40%,50% 60%,100% 60%,100% 100%,0 100%)}

/* ---------- 4. Шапка ---------- */
.site-header{position:relative;z-index:30;background:var(--paper);border-bottom:1px solid var(--rule-2)}
.site-header::before{content:"";display:block;height:4px;background:linear-gradient(90deg,var(--red) 0 50%,var(--green) 50% 100%)}
.header-top{display:flex;align-items:center;gap:24px;min-height:78px;padding-top:10px;padding-bottom:10px}
.brand{display:flex;align-items:center;gap:14px;color:var(--ink);flex:none}
.brand:hover{color:var(--ink);text-decoration:none}
.brand-mark{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;width:48px;height:56px;flex:none;
  background:radial-gradient(ellipse at 50% 40%,#fff 0,#f7f6f0 100%);border:4px solid var(--case);font-family:var(--f-ui);font-weight:800;line-height:1;color:var(--ink)}
.brand-mark span{display:block;letter-spacing:.14em;margin-right:-.14em}
.brand-mark span:nth-child(1){font-size:16px}
.brand-mark span:nth-child(2){font-size:9.5px}
.brand-mark span:nth-child(3){font-size:6px}
.brand-text{display:flex;flex-direction:column}
.brand-name{font:800 24px/1 var(--f-ui);letter-spacing:-.015em}
.brand-tag{font:400 13px/1.25 var(--f-ui);color:var(--ink-3);margin-top:6px}
.header-links{margin-left:auto;display:flex;align-items:center;gap:26px;font:500 15px/1.2 var(--f-ui)}
.header-links a{color:var(--ink-2)}
.header-links a:hover{color:var(--link)}
.header-links .header-check{display:inline-flex;align-items:center;gap:10px;padding:10px 16px;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink);border-radius:2px}
.header-links .header-check:hover{background:var(--ink);color:var(--paper);text-decoration:none}
.header-check .landolt{--d:15px}

/* Кнопка мобильного меню: три полоски убывающей длины, как строки таблицы */
.nav-toggle{display:none;margin-left:auto;align-items:center;gap:10px;padding:10px 12px;background:none;border:0;box-shadow:inset 0 0 0 1.5px var(--ink);border-radius:2px;color:var(--ink);font:600 15px/1 var(--f-ui);cursor:pointer}
.nav-toggle-icon{display:flex;flex-direction:column;align-items:center;gap:3px;width:20px}
.nav-toggle-icon i{display:block;height:2.5px;background:currentColor}
.nav-toggle-icon i:nth-child(1){width:20px}
.nav-toggle-icon i:nth-child(2){width:14px}
.nav-toggle-icon i:nth-child(3){width:8px}
.site-header.is-open .nav-toggle{background:var(--ink);color:var(--paper)}

/* Меню рубрик */
.rubrics{border-top:1px solid var(--rule)}
.rubrics-list{list-style:none;margin:0;padding:0;display:flex;justify-content:space-between;gap:0 18px}
.rubrics-list a{display:block;padding:13px 0 11px;border-bottom:3px solid transparent;margin-bottom:-1px;font:500 15px/1.2 var(--f-ui);color:var(--ink);white-space:nowrap}
.rubrics-list a:hover{color:var(--link);text-decoration:none;border-bottom-color:var(--rule-2)}
.rubrics-list a[aria-current]{border-bottom-color:var(--red)}
.nav-extra{display:none}

@media (max-width:1399px){
  .rubrics-list{gap:0 12px}
  .rubrics-list a{font-size:14px}
}
@media (max-width:1279px){.rubrics-list{gap:0 8px}}
@media (max-width:1179px){
  .header-links{display:none}
  .nav-toggle{display:inline-flex}
  .rubrics{display:none;background:var(--box);border-top:1px solid var(--rule-2)}
  .site-header.is-open .rubrics{display:block}
  .rubrics-list{flex-direction:column;gap:0;padding:6px 0 4px}
  .rubrics-list li+li{border-top:1px solid var(--rule)}
  .rubrics-list a{display:flex;justify-content:space-between;align-items:baseline;padding:11px 0;border:0;margin:0;
    font-weight:800;text-transform:uppercase;letter-spacing:.08em;font-size:var(--fs,15px)}
  .rubrics-list a[aria-current]{color:var(--red)}
  /* в мобильном меню рубрики убывают, как строки таблицы Сивцева */
  .rubrics-list li:nth-child(1) a{--fs:23px}
  .rubrics-list li:nth-child(2) a{--fs:22px}
  .rubrics-list li:nth-child(3) a{--fs:21px}
  .rubrics-list li:nth-child(4) a{--fs:20px}
  .rubrics-list li:nth-child(5) a{--fs:19px}
  .rubrics-list li:nth-child(6) a{--fs:18px}
  .rubrics-list li:nth-child(7) a{--fs:17.5px}
  .rubrics-list li:nth-child(8) a{--fs:17px}
  .rubrics-list li:nth-child(9) a{--fs:16.5px}
  .rubrics-list li:nth-child(10) a{--fs:16px}
  .rubrics-list li:nth-child(11) a{--fs:15.5px}
  .rubrics-list li:nth-child(12) a{--fs:15px}
  .nav-extra{display:flex;flex-wrap:wrap;gap:0 22px;list-style:none;margin:0;padding:4px 0 8px;border-top:2px solid var(--ink);font:500 15px/1.3 var(--f-ui)}
  .nav-extra a{display:inline-block;padding:10px 0;color:var(--ink-2)}
  .nav-extra .nav-extra-check{color:var(--link);font-weight:600}
}
@media (max-width:520px){
  .header-top{min-height:66px;gap:12px}
  .brand{gap:10px}
  .brand-mark{width:40px;height:47px;border-width:3px}
  .brand-mark span:nth-child(1){font-size:13px}
  .brand-mark span:nth-child(2){font-size:8px}
  .brand-mark span:nth-child(3){display:none}
  .brand-name{font-size:20px}
  .brand-tag{font-size:12px;margin-top:4px}
  .nav-toggle-label{display:none}
}

/* ---------- 5. Хлебные крошки ---------- */
.crumbs{padding-top:18px;font:400 14px/1.4 var(--f-ui);color:var(--ink-3)}
.crumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:2px 0}
.crumbs li+li::before{content:"›";margin:0 9px;color:var(--rule-2)}
.crumbs a{color:var(--ink-2)}
.crumbs a:hover{color:var(--link)}

/* ---------- 6. Заголовки секций (h2 с линией сверху на всю ширину) ---------- */
.section{margin-top:var(--sec)}
.section-head{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:6px 24px;border-top:2px solid var(--ink);padding-top:14px;margin-bottom:24px}
.section-title{margin:0;font:700 clamp(23px,2vw,30px)/1.2 var(--f-ui);letter-spacing:-.01em}
.section-more{font:500 15px/1.3 var(--f-ui)}

/* ---------- 7. Статья ---------- */
.article{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"head" "cover" "aside" "body"}
.article-head{grid-area:head;padding:20px 0 26px;max-width:1120px}
.article-title{margin:0;font:700 clamp(30px,3.4vw,54px)/1.1 var(--f-ui);letter-spacing:-.018em;text-wrap:balance}
.article-meta{display:flex;flex-wrap:wrap;gap:4px 0;margin:16px 0 0;font:400 15px/1.5 var(--f-ui);color:var(--ink-3)}
.article-meta>:not(:last-child)::after{content:"·";margin:0 10px;color:var(--rule-2)}
.article-meta>*,.post-item__meta>*,.post-lead__meta>*,.tile__meta>*{white-space:nowrap}
.article-meta a{color:var(--ink-2)}
.article-meta a:hover{color:var(--link)}
.article-cover{grid-area:cover;margin:0 0 30px;padding:10px;background:var(--box);box-shadow:0 0 0 1px var(--rule-2)}
.article-cover img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover}
.article-aside{grid-area:aside;margin-bottom:30px}
.article-body{grid-area:body;min-width:0;max-width:var(--measure)}
@media (min-width:1080px){
  .article{grid-template-columns:minmax(0,var(--measure)) minmax(270px,400px);column-gap:clamp(40px,4.5vw,64px);justify-content:start;
    grid-template-areas:"head head" "cover aside" "body aside";grid-template-rows:auto auto 1fr}
  .article-aside{margin-bottom:0}
  .aside-sticky{position:sticky;top:18px}
}
/* широкий экран: колонка справа шире и прижата к тексту, без пустоты между ними */
@media (min-width:1600px){.article{grid-template-columns:minmax(0,var(--measure)) minmax(300px,480px)}}

/* Оглавление (details: на мобильном свёрнуто, на десктопе site.js раскрывает) */
.toc{background:var(--box);box-shadow:0 0 0 1px var(--rule-2);padding:16px 20px;font-family:var(--f-ui)}
.toc>summary{display:flex;justify-content:space-between;align-items:center;gap:12px;list-style:none;cursor:pointer;
  font:700 13px/1.3 var(--f-ui);text-transform:uppercase;letter-spacing:.14em;color:var(--ink)}
.toc>summary::-webkit-details-marker{display:none}
.toc>summary::after{content:"+";font:400 22px/1 var(--f-mono);color:var(--ink-3)}
.toc[open]>summary::after{content:"−"}
.toc-count{font:400 13px/1 var(--f-mono);letter-spacing:0;text-transform:none;color:var(--ink-3);margin-left:auto}
.toc-list{list-style:none;margin:12px 0 0;padding:0}
.toc-list li{border-top:1px solid var(--rule)}
.toc-list a{position:relative;display:block;padding:9px 0;font:400 15px/1.35 var(--f-ui);color:var(--ink-2)}
.toc-list a:hover{color:var(--link);text-decoration:none}
.toc-list a.is-active{color:var(--ink);font-weight:600}
/* указка врача: красная черта к активному пункту */
.toc-list a.is-active::after{content:"";position:absolute;left:-20px;top:50%;width:14px;height:2px;background:var(--red)}
@media (min-width:1080px){
  .toc>summary{cursor:default;pointer-events:none}
  .toc>summary::after{display:none}
  .toc-list{max-height:calc(100vh - 330px);overflow:auto;scrollbar-width:thin}
}
.aside-check{display:flex;align-items:center;gap:14px;margin-top:14px;padding:14px 16px;background:var(--ink);color:var(--paper);font:500 15px/1.35 var(--f-ui)}
.aside-check:hover{background:var(--link-hover);color:#fff;text-decoration:none}
.aside-check-rings{display:flex;align-items:center;gap:5px;flex:none}
.aside-check small{display:block;color:var(--wall-dim);font-size:13px;font-weight:400;margin-top:2px}
@media (max-width:1079px){.aside-check{display:none}}

/* ---------- 8. Текст статьи (.prose) ---------- */
.prose{font-size:19px;line-height:1.68}
.prose>:first-child{margin-top:0}
@media (max-width:640px){.prose{font-size:18px;line-height:1.64}}
.prose p{margin:0 0 1.05em}
.prose [style*="justify"]{text-align:left!important}
.prose strong,.prose b{font-weight:650}
.prose h2{margin:1.9em 0 .7em;padding-top:.65em;border-top:2px solid var(--ink);font:700 clamp(24px,2.1vw,31px)/1.2 var(--f-ui);letter-spacing:-.01em;scroll-margin-top:18px}
.prose h3{margin:1.6em 0 .55em;font:600 clamp(20px,1.6vw,22px)/1.3 var(--f-ui);scroll-margin-top:18px}
.prose h4{margin:1.5em 0 .6em;font:600 17px/1.4 var(--f-ui);color:var(--ink-2)}
.prose ul,.prose ol{margin:0 0 1.15em;padding:0}
.prose li{margin:.4em 0}
.prose li>p{margin:0}
.prose ul>li{list-style:none;position:relative;padding-left:1.55em}
/* маркер списка — линза: маленькое кольцо (без разрыва: кольцо Ландольта в тексте читается как буква «с») */
.prose ul>li::before{content:"";position:absolute;left:.3em;top:.64em;width:.44em;height:.44em;border-radius:50%;border:.11em solid var(--link)}
.prose ol{counter-reset:ol}
.prose ol>li{list-style:none;position:relative;padding-left:2em;counter-increment:ol}
.prose ol>li::before{content:counter(ol) ".";position:absolute;left:0;top:.08em;font:400 .86em/1.68 var(--f-mono);color:var(--red)}
.prose blockquote{margin:1.4em 0;padding:16px 22px;background:var(--mint);border-top:1px solid var(--mint-rule);border-bottom:1px solid var(--mint-rule);font-size:.95em;line-height:1.6}
.prose blockquote>:last-child{margin-bottom:0}
.prose hr{border:0;border-top:1px solid var(--rule-2);margin:2em 0}
.prose img{display:block;margin:0 auto}
.prose figure,.prose .wp-caption{margin:1.6em auto;max-width:100%!important}
.prose figure>img,.prose figure>a>img,.prose .wp-caption img{padding:8px;background:var(--box);box-shadow:0 0 0 1px var(--rule-2)}
.prose figcaption,.prose .wp-caption-text{margin:10px auto 0;max-width:640px;font:400 14.5px/1.45 var(--f-ui);color:var(--ink-2);text-align:center}
/* галерея (бывшая fotorama/[gallery]) */
.prose .gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:18px 14px;margin:1.2em 0 1.6em}
.prose .gallery figure{margin:0}
.prose .gallery img{width:100%;aspect-ratio:1;object-fit:cover;padding:5px}
.prose .gallery figcaption{margin-top:8px;font-size:13.5px;line-height:1.4;text-align:left;-webkit-hyphens:auto;hyphens:auto}
@media (max-width:400px){.prose .gallery{grid-template-columns:repeat(auto-fill,minmax(130px,1fr))}.prose .gallery figcaption{font-size:12.5px}}
/* видео: превью + загрузка плеера по клику (site.js) */
.video{position:relative;display:block;width:100%;aspect-ratio:16/9;margin:1.2em 0 1.6em;background:#111 center/cover no-repeat;border:0;padding:0;cursor:pointer;overflow:hidden}
.video::after{content:"";position:absolute;left:50%;top:50%;width:74px;height:52px;margin:-26px 0 0 -37px;border-radius:4px;
  background:rgba(20,24,22,.86) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M8 5v14l11-7z'/%3E%3C/svg%3E") center/30px no-repeat}
.video:hover::after{background-color:var(--red)}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.video-title{position:absolute;left:0;right:0;bottom:0;padding:24px 16px 12px;background:linear-gradient(transparent,rgba(0,0,0,.7));color:#fff;font:500 15px/1.35 var(--f-ui);text-align:left}

/* ---------- 9. Таблицы (как бланк рецепта: шапка моноширинным капителем) ---------- */
.table-wrap{position:relative;margin:1.3em 0 1.6em;overflow-x:auto;-webkit-overflow-scrolling:touch;border-top:2px solid var(--ink);border-bottom:2px solid var(--ink);
  /* тени прокрутки: появляются у края, за которым есть ещё колонки (крышки local едут вместе с таблицей) */
  background:linear-gradient(90deg,var(--paper) 30%,rgba(244,242,236,0)) left/40px 100% no-repeat local,
    linear-gradient(270deg,var(--paper) 30%,rgba(244,242,236,0)) right/40px 100% no-repeat local,
    radial-gradient(farthest-side at 0 50%,rgba(26,30,28,.2),rgba(26,30,28,0)) left/14px 100% no-repeat scroll,
    radial-gradient(farthest-side at 100% 50%,rgba(26,30,28,.2),rgba(26,30,28,0)) right/14px 100% no-repeat scroll}
/* таблицы от 3 колонок на телефоне: не уже 560px (иначе по слову в строке) и подсказка над ними */
@media (max-width:640px){
  .table-wrap--cols3 table{min-width:560px}
  .table-wrap--cols3::before{content:"Листайте таблицу вбок →";position:sticky;left:0;display:block;width:fit-content;padding:6px 0 4px;font:400 12.5px/1.3 var(--f-mono);color:var(--ink-3)}
}
.table-wrap table,.table{width:100%;border-collapse:collapse;font:400 16px/1.45 var(--f-ui)}
.table-wrap th,.table th{padding:11px 14px;background:var(--box);border-bottom:1px solid var(--ink);text-align:left;vertical-align:bottom;
  font:400 12.5px/1.3 var(--f-mono);text-transform:uppercase;letter-spacing:.08em;color:var(--ink-2)}
.table-wrap td,.table td{padding:11px 14px;border-bottom:1px solid var(--rule);vertical-align:top}
.table-wrap tr:last-child td,.table tr:last-child td{border-bottom:0}
.table-wrap tbody tr:nth-child(even),.table tbody tr:nth-child(even){background:rgba(255,255,255,.5)}
.table-wrap td:first-child,.table td:first-child{font-weight:600}
.table-wrap td[style],.table-wrap th[style]{text-align:left!important}
.table-cap{display:block;margin-bottom:6px;font:600 17px/1.4 var(--f-ui);color:var(--ink-2)}

/* ---------- 10. Списки статей ---------- */
/* 10.1 Строка списка (рубрика, «новые», «популярные») */
.post-list{display:grid;grid-template-columns:minmax(0,1fr);column-gap:clamp(32px,4vw,64px)}
.post-item{display:grid;grid-template-columns:200px minmax(0,1fr);gap:22px;align-items:start;padding:22px 0;border-top:1px solid var(--rule)}
.post-item__img{display:block;padding:5px;background:var(--box);box-shadow:0 0 0 1px var(--rule-2)}
.post-item__img img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover}
.post-item__title{margin:0;font:600 20px/1.3 var(--f-ui);letter-spacing:-.005em;text-wrap:pretty}
.post-item__title a{color:var(--ink)}
.post-item__title a:hover{color:var(--link)}
.post-item__excerpt{margin:8px 0 0;font:400 16px/1.55 var(--f-text);color:var(--ink-2);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.post-item__meta{margin:10px 0 0;font:400 13.5px/1.4 var(--f-ui);color:var(--ink-3)}
.post-item__meta>:not(:last-child)::after{content:"·";margin:0 8px;color:var(--rule-2)}
.post-item__meta a{color:var(--ink-2)}
@media (min-width:1000px){
  .post-list--2col{grid-template-columns:repeat(2,minmax(0,1fr))}
  .post-list--2col>.post-item:nth-child(2){border-top:1px solid var(--rule)}
}
@media (max-width:640px){
  .post-item{grid-template-columns:104px minmax(0,1fr);gap:14px;padding:16px 0}
  .post-item__img{padding:3px}
  .post-item__title{font-size:17px}
  .post-item__excerpt{display:none}
  .post-item__meta{margin-top:6px;font-size:13px}
}
/* компактная строка (без анонса, картинка меньше) */
.post-item--compact{grid-template-columns:132px minmax(0,1fr);gap:16px;padding:16px 0}
.post-item--compact .post-item__title{font-size:17.5px}
.lead-list .post-item--compact{grid-template-columns:112px minmax(0,1fr)}
@media (max-width:640px){.post-item--compact{grid-template-columns:96px minmax(0,1fr)}}

/* 10.2 Главная статья ленты (главная страница) */
.post-lead__img{display:block;padding:8px;background:var(--box);box-shadow:0 0 0 1px var(--rule-2)}
.post-lead__img img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover}
.post-lead__title{margin:18px 0 0;font:700 clamp(23px,2vw,30px)/1.2 var(--f-ui);letter-spacing:-.012em;text-wrap:balance}
.post-lead__title a{color:var(--ink)}
.post-lead__title a:hover{color:var(--link)}
.post-lead__excerpt{margin:10px 0 0;font:400 17px/1.6 var(--f-text);color:var(--ink-2)}
.post-lead__meta{margin:12px 0 0;font:400 14px/1.4 var(--f-ui);color:var(--ink-3)}
.post-lead__meta>:not(:last-child)::after{content:"·";margin:0 8px;color:var(--rule-2)}

/* 10.3 Плитки «Читайте также»: в ряд через вертикальные линейки, без карточек */
.tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.tile{padding:0 22px;border-left:1px solid var(--rule)}
.tile:first-child{padding-left:0;border-left:0}
.tile:last-child{padding-right:0}
.tile__img{display:block;padding:5px;background:var(--box);box-shadow:0 0 0 1px var(--rule-2)}
.tile__img img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover}
.tile__title{margin:14px 0 0;font:600 18px/1.32 var(--f-ui);text-wrap:pretty}
.tile__title a{color:var(--ink)}
.tile__title a:hover{color:var(--link)}
.tile__meta{margin:8px 0 0;font:400 13.5px/1.4 var(--f-ui);color:var(--ink-3)}
@media (max-width:1079px){
  .tiles{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:28px}
  .tile:nth-child(odd){padding-left:0;border-left:0}
  .tile:nth-child(even){padding-right:0}
}
@media (max-width:640px){
  .tiles{grid-template-columns:minmax(0,1fr);row-gap:0}
  .tile{display:grid;grid-template-columns:104px minmax(0,1fr);gap:0 14px;padding:14px 0!important;border-left:0;border-top:1px solid var(--rule)}
  .tile__img{grid-row:span 2;padding:3px}
  .tile__title{margin:0;font-size:16.5px}
  .tile__meta{margin-top:4px}
}

/* 10.4 Рейтинг «Читают чаще всего» */
.top-list{list-style:none;margin:0;padding:0;counter-reset:top;display:grid;grid-template-columns:minmax(0,1fr);column-gap:clamp(32px,4vw,64px)}
.top-list li{counter-increment:top;display:grid;grid-template-columns:46px minmax(0,1fr);gap:10px;padding:14px 0;border-top:1px solid var(--rule)}
.top-list li::before{content:counter(top,decimal-leading-zero);font:400 22px/1.15 var(--f-mono);color:var(--ink-3)}
.top-list a{display:block;font:500 18px/1.35 var(--f-ui);color:var(--ink)}
.top-list a:hover{color:var(--link)}
.top-list small{display:block;margin-top:4px;font:400 13.5px/1.4 var(--f-ui);color:var(--ink-3)}
@media (min-width:900px){.top-list{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:column;grid-template-rows:repeat(5,auto)}}

/* ---------- 11. Главная ---------- */
.home-top{display:grid;grid-template-columns:minmax(0,1fr);gap:28px;padding-top:28px;
  grid-template-areas:"intro" "chart" "check"}
@media (min-width:1080px){
  .home-top{grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:clamp(32px,3.6vw,64px);row-gap:28px;
    grid-template-areas:"chart intro" "chart check";grid-template-rows:auto 1fr;padding-top:34px}
}
.home-intro{grid-area:intro}
.home-title{margin:0;font:700 clamp(30px,3.1vw,48px)/1.1 var(--f-ui);letter-spacing:-.018em;text-wrap:balance}
.home-lead{margin:16px 0 0;font:400 19px/1.6 var(--f-text);color:var(--ink-2)}

/* Мини-бланк (как строка рецепта Sph / Cyl / Ax): подписи моно, значения крупно */
.rx{display:grid;grid-template-columns:repeat(var(--cols,3),minmax(0,1fr));margin:22px 0 0;border-top:2px solid var(--ink);border-bottom:1px solid var(--ink)}
.rx>div{padding:8px 14px 10px;border-left:1px solid var(--rule-2)}
.rx>div:first-child{border-left:0;padding-left:0}
.rx dt{font:400 12px/1.3 var(--f-mono);text-transform:uppercase;letter-spacing:.08em;color:var(--ink-3)}
.rx dd{margin:4px 0 0;font:700 26px/1.1 var(--f-ui);font-variant-numeric:tabular-nums}

/* Таблица рубрик — световой короб с таблицей Сивцева. Каждая строка = рубрика, буквы убывают сверху вниз */
.chart{grid-area:chart;align-self:start;display:flex;flex-direction:column;container-type:inline-size;padding:clamp(14px,2vw,30px) clamp(12px,2vw,30px) clamp(14px,1.6vw,22px);
  background:radial-gradient(ellipse 80% 70% at 50% 42%,#fff 0,#fbfbf7 55%,#f0efe7 100%);border:clamp(7px,.9vw,12px) solid var(--case);
  box-shadow:0 24px 46px -30px rgba(20,30,25,.55)}
.chart-cap{display:grid;grid-template-columns:4.2em minmax(0,1fr) 4.2em;align-items:end;padding-bottom:8px;border-bottom:1px solid var(--rule);
  font:400 12px/1.3 var(--f-mono);color:var(--ink-3)}
.chart-cap span:nth-child(2){text-align:center;text-transform:uppercase;letter-spacing:.12em}
.chart-cap span:nth-child(3){text-align:right}
.chart-rows{list-style:none;margin:0;padding:0;flex:1;display:flex;flex-direction:column;justify-content:space-around}
@media (min-width:1080px){.chart{align-self:stretch}}
.chart-row{display:grid;grid-template-columns:4.2em minmax(0,1fr) 4.2em;align-items:center;padding:.5em 0;color:var(--ink);font:400 12px/1 var(--f-mono)}
.chart-row:hover{text-decoration:none;color:var(--ink);background:rgba(226,235,228,.55)}
.chart-d{color:var(--ink-3)}
.chart-v{color:var(--ink-3);text-align:right}
.chart-name{justify-self:center;position:relative;font:800 var(--fs,20px)/1.05 var(--f-ui);letter-spacing:.11em;margin-right:-.11em;text-transform:uppercase;text-align:center;text-wrap:balance}
.chart-name sup{position:absolute;left:100%;top:-.1em;margin-left:.5em;font:400 12px/1 var(--f-mono);letter-spacing:0;color:var(--ink-3);white-space:nowrap}
/* указка: красная черта под строкой при наведении */
.chart-name::after{content:"";position:absolute;left:0;right:.11em;bottom:-.22em;height:3px;background:var(--red);transform:scaleX(0);transform-origin:left;transition:transform .18s}
.chart-row:hover .chart-name::after,.chart-row:focus-visible .chart-name::after{transform:scaleX(1)}
.chart-rows li:nth-child(1) .chart-name{--fs:clamp(25px,7.4cqi,62px)}
.chart-rows li:nth-child(2) .chart-name{--fs:clamp(23px,6.5cqi,54px)}
.chart-rows li:nth-child(3) .chart-name{--fs:clamp(22px,5.8cqi,47px)}
.chart-rows li:nth-child(4) .chart-name{--fs:clamp(21px,5.2cqi,42px)}
.chart-rows li:nth-child(5) .chart-name{--fs:clamp(20px,4.6cqi,37px)}
.chart-rows li:nth-child(6) .chart-name{--fs:clamp(19px,4.1cqi,33px)}
.chart-rows li:nth-child(7) .chart-name{--fs:clamp(18px,3.65cqi,29px)}
.chart-rows li:nth-child(8) .chart-name{--fs:clamp(17px,3.25cqi,26px)}
.chart-rows li:nth-child(9) .chart-name{--fs:clamp(16px,2.9cqi,23px)}
.chart-rows li:nth-child(10) .chart-name{--fs:clamp(15.5px,2.6cqi,21px)}
.chart-rows li:nth-child(11) .chart-name{--fs:clamp(15px,2.35cqi,19px)}
.chart-rows li:nth-child(12) .chart-name{--fs:clamp(14.5px,2.1cqi,17px)}
.chart-foot{margin:10px 0 0;padding-top:10px;border-top:1px solid var(--rule);font:400 12.5px/1.45 var(--f-mono);color:var(--ink-3);text-align:center}
@container (max-width:460px){
  .chart-cap,.chart-row{grid-template-columns:2.9em minmax(0,1fr) 2.6em}
  .chart-row{font-size:11px}
  .chart-name{letter-spacing:.05em;margin-right:-.05em}
  .chart-name sup{display:none}
}

/* Блок «Проверить зрение онлайн»: дуохромный тест (красная и зелёная половины) */
.check{grid-area:check;align-self:start;background:var(--box);box-shadow:0 0 0 1px var(--rule-2)}
.check-duo{display:grid;grid-template-columns:1fr 1fr;height:132px}
.check-duo>div{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:#121513}
.check-duo>div:first-child{background:#c0453a}
.check-duo>div:last-child{background:#4f8d5d}
.check-duo p{display:flex;align-items:center;gap:14px;margin:0}
.check-body{padding:22px 24px 24px}
.check-title{margin:0;font:700 clamp(23px,1.9vw,28px)/1.2 var(--f-ui)}
.check-body p{margin:10px 0 0;font:400 17px/1.6 var(--f-text);color:var(--ink-2)}
.check-body .check-note{font:400 14.5px/1.5 var(--f-ui);color:var(--ink-3)}
.check-body .btn{margin-top:18px}

/* Новые статьи: одна крупная + список */
.lead-list{display:grid;grid-template-columns:minmax(0,1fr);gap:8px clamp(32px,4vw,64px)}
.lead-list .post-list{align-content:start}
@media (min-width:1080px){
  .lead-list{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
  .lead-list .post-list{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lead-list .post-item:nth-child(-n+2){border-top:0;padding-top:0}
}
@media (max-width:1079px){.post-lead{padding-bottom:18px}}

/* ---------- 12. Рубрика ---------- */
.cat-head{display:grid;grid-template-columns:minmax(0,1fr);gap:24px;padding:20px 0 30px}
@media (min-width:1080px){.cat-head{grid-template-columns:minmax(0,var(--measure)) minmax(300px,1fr);column-gap:clamp(40px,4.5vw,88px);align-items:end}}
.cat-title{margin:0;font:700 clamp(32px,3.6vw,56px)/1.08 var(--f-ui);letter-spacing:-.02em}
.cat-descr{margin:14px 0 0;font:400 18px/1.62 var(--f-text);color:var(--ink-2)}
.cat-descr p{margin:0 0 .8em}
.cat-descr p:last-child{margin-bottom:0}
/* строка таблицы рубрики: та же строка, что на главной */
.cat-line{container-type:inline-size;padding:14px 18px;background:radial-gradient(ellipse at 50% 40%,#fff 0,#f4f3ec 100%);border:7px solid var(--case)}
.cat-line .chart-row{grid-template-columns:5.6em minmax(0,1fr) 5.6em;padding:.35em 0}
.cat-line .chart-row:hover{background:none}
.cat-line .chart-name{--fs:clamp(20px,7.5cqi,40px)}
@container (max-width:460px){
  .cat-line .chart-row{grid-template-columns:4em minmax(0,1fr) 4em}
  .cat-line .chart-name{font-size:min(var(--fs),5.4cqi);letter-spacing:.05em;margin-right:-.05em}
}
.cat-line-meta{display:flex;justify-content:space-between;gap:12px;margin-top:8px;padding-top:8px;border-top:1px solid var(--rule);font:400 12.5px/1.4 var(--f-mono);color:var(--ink-3)}

/* Пагинация: моноширинные «клетки», текущая — залитая */
.pagination{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 24px;margin-top:30px;padding-top:18px;border-top:2px solid var(--ink);font:400 16px/1 var(--f-mono)}
.pagination-pages{display:flex;flex-wrap:wrap;list-style:none;margin:0;padding:0;gap:6px}
.pagination-pages a,.pagination-pages span{display:grid;place-items:center;min-width:44px;height:44px;padding:0 10px;color:var(--ink);box-shadow:inset 0 0 0 1px var(--rule-2);background:var(--box)}
.pagination-pages a:hover{box-shadow:inset 0 0 0 1.5px var(--ink);text-decoration:none}
.pagination-pages a[aria-current]{background:var(--ink);color:var(--paper);box-shadow:none}
.pagination-pages .pagination-gap{box-shadow:none;background:none;min-width:24px;padding:0;color:var(--ink-3)}
.pagination-prev,.pagination-next{font:500 15px/1 var(--f-ui);color:var(--ink);padding:14px 4px}
.pagination-prev[aria-disabled],.pagination-next[aria-disabled]{visibility:hidden;pointer-events:none}
.pagination-info{flex-basis:100%;font:400 13px/1.4 var(--f-mono);color:var(--ink-3)}
@media (max-width:520px){
  .pagination{justify-content:center}
  .pagination-prev,.pagination-next{order:2}
  .pagination-pages{order:1;flex-basis:100%;justify-content:center}
  .pagination-info{order:3;text-align:center}
}

/* ---------- 13. Подвал ---------- */
.site-footer{margin-top:var(--sec);background:var(--wall);color:var(--wall-ink);font:400 15px/1.55 var(--f-ui)}
.site-footer a{color:#cfe0d7}
.site-footer a:hover{color:#fff}
.footer-warning{margin:0;padding:26px 0 24px;border-bottom:1px solid rgba(232,236,230,.18);font:400 16px/1.55 var(--f-ui);color:var(--wall-dim)}
.footer-warning p{margin:0;max-width:1180px}
.footer-warning strong{display:block;margin-bottom:4px;font:600 clamp(18px,1.5vw,22px)/1.35 var(--f-ui);color:#fff}
.footer-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:30px;padding:34px 0 30px}
@media (min-width:900px){.footer-grid{grid-template-columns:minmax(220px,1.1fr) minmax(0,1.6fr) minmax(0,1fr)}}
.footer-brand .brand{color:var(--wall-ink)}
.footer-brand .brand-mark{border-color:#0f1714}
.footer-brand .brand-tag{color:var(--wall-dim)}
.footer-brand p{margin:16px 0 0;color:var(--wall-dim);max-width:360px}
.footer-label{margin:0 0 10px;font:600 13px/1.3 var(--f-ui);text-transform:uppercase;letter-spacing:.14em;color:var(--wall-dim)}
.footer-links{list-style:none;margin:0;padding:0}
.footer-links li{padding:4px 0}
.footer-links--2col{columns:2;column-gap:28px}
.footer-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px 24px;padding:16px 0 22px;border-top:1px solid rgba(232,236,230,.18);font-size:13.5px;color:var(--wall-dim)}
/* последняя строка таблицы Сивцева: V = 2,0 */
.footer-lastline{display:flex;align-items:center;gap:14px;font:400 11px/1 var(--f-mono)}
.footer-lastline b{font:800 9px/1 var(--f-ui);letter-spacing:.42em;color:var(--wall-ink)}

/* ---------- 14. Печать ---------- */
@media print{
  .site-header,.site-footer,.article-aside,.related,.pagination{display:none}
  body{background:#fff;font-size:12pt}
  .prose a{color:inherit}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* ---------- 15. Дополнения движка: поиск, служебные страницы, разметка старых текстов ---------- */
/* Поиск в шапке (десктоп) и в мобильном меню */
.header-search,.nav-search,.search-form{display:flex;align-items:stretch;min-width:0}
.header-search{margin-left:auto;flex:0 0 auto;width:clamp(230px,17vw,280px)}
.header-search+.header-links{margin-left:0}
.header-search input,.nav-search input,.search-form input{flex:1;min-width:0;margin:0;padding:9px 12px;border:0;border-radius:2px 0 0 2px;
  box-shadow:inset 0 0 0 1.5px var(--rule-2);background:var(--box);font:400 15px/1.25 var(--f-ui);color:var(--ink);-webkit-appearance:none;appearance:none}
.header-search input:focus,.nav-search input:focus,.search-form input:focus{outline:0;box-shadow:inset 0 0 0 1.5px var(--ink)}
.header-search button,.nav-search button,.search-form button{flex:none;margin:0;padding:0 14px;border:0;border-radius:0 2px 2px 0;background:var(--ink);color:var(--paper);font:600 14px/1 var(--f-ui);cursor:pointer}
.header-search button:hover,.nav-search button:hover,.search-form button:hover{background:var(--link-hover)}
.nav-search{display:none}
@media (max-width:1179px){
  .header-search{display:none}
  .nav-search{display:flex;padding:14px 0 6px}
  .nav-search input{padding:11px 12px;font-size:16px}
}
/* Страница поиска */
.search-head{max-width:var(--measure)}
.search-form{margin-top:18px;max-width:640px}
.search-form input{padding:13px 14px;font-size:17px}
.search-form button{padding:0 22px;font-size:15px}
.search-count{margin:14px 0 0;font:400 15px/1.5 var(--f-ui);color:var(--ink-3)}
/* 404 */
.notfound{display:grid;grid-template-columns:minmax(0,1fr);gap:28px;padding-bottom:10px}
.notfound>*{grid-area:auto}
@media (min-width:1080px){.notfound{grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:clamp(32px,3.6vw,64px);align-items:start}}
.notfound-text{margin:14px 0 0;font:400 18px/1.6 var(--f-text);color:var(--ink-2)}
/* Текстовая страница */
.page .article-body{padding-bottom:10px}
.contact-mail{font-family:var(--f-ui)}
/* Встроенный плеер не с YouTube (Rutube) */
.video-embed{position:relative;width:100%;aspect-ratio:16/9;margin:1.2em 0 1.6em;background:#111}
.video-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
/* «Цветные подзаголовки» старых текстов: <p><span class="hl">…</span></p> */
.prose .hl,.prose .hl-red{font-family:var(--f-ui);font-weight:600;color:var(--link)}
.prose .hl-red{color:var(--red)}
/* Отзывы с форумов внутри текста: blockquote.quote-review > p + footer (имя, источник) */
.prose blockquote footer{margin-top:10px;font:400 14px/1.45 var(--f-ui);color:var(--ink-3);overflow-wrap:anywhere}
.prose blockquote footer p{margin:2px 0 0}
.prose blockquote footer strong{font-weight:600;color:var(--ink-2)}
/* Шок-контент: фото скрыто под размытием до клика (site.js) */
.prose img.image-shock:not(.is-shown){filter:blur(18px) grayscale(.5);cursor:pointer}
.prose .shock-wrap{position:relative;display:block;width:fit-content;max-width:100%;margin:0 auto;overflow:hidden}
.prose .shock-wrap::after{content:"Фото медицинского характера. Нажмите, чтобы посмотреть";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:max-content;max-width:86%;
  padding:8px 12px;background:rgba(26,30,28,.86);color:#fff;font:500 13px/1.35 var(--f-ui);text-align:center;pointer-events:none}
.prose .shock-wrap.is-shown::after{display:none}
/* Цели касания на телефоне: крошки, подвал — не ниже ~40px */
@media (max-width:640px){
  .crumbs{padding-top:8px}
  .crumbs a,.article-meta a{display:inline-block;padding:10px 0}
  .crumbs li>span{display:inline-block;padding:10px 0}
  .footer-links li{padding:0}
  .footer-links a{display:inline-block;padding:9px 0}
}
/* Текстовая страница с колонкой справа (как у статьи): «Проверить зрение» и «Читают чаще всего» */
.article--page{grid-template-areas:"head" "body" "aside"}
.article--page .article-aside{margin:30px 0 0}
@media (min-width:1080px){
  .article--page{grid-template-areas:"head head" "body aside";grid-template-rows:auto 1fr}
  .article--page .article-aside{margin:0}
}
.aside-top{margin-top:14px;padding:16px 20px 6px;background:var(--box);box-shadow:0 0 0 1px var(--rule-2)}
.aside-top-title{margin:0 0 4px;font:700 13px/1.3 var(--f-ui);text-transform:uppercase;letter-spacing:.14em}
.aside-top-list{list-style:none;margin:0;padding:0}
.aside-top-list li{border-top:1px solid var(--rule)}
.aside-top-list a{display:block;padding:10px 0;font:500 15.5px/1.35 var(--f-ui);color:var(--ink)}
.aside-top-list a:hover{color:var(--link);text-decoration:none}
/* Проверка зрения: инструкция слева, таблица Сивцева справа на всю оставшуюся ширину */
.vision-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:28px;max-width:none}
.vision-grid .prose{max-width:var(--measure)}
.vision-chart{margin:0;align-self:start}
.vision-scroll{position:relative;padding:10px;background:var(--box);box-shadow:0 0 0 1px var(--rule-2)}
.vision-scroll img{display:block;width:100%;max-width:720px;height:auto;margin:0 auto}
.vision-chart figcaption{margin:10px 0 0;font:400 14.5px/1.45 var(--f-ui);color:var(--ink-2)}
.vision-note{display:none;margin:0 0 12px;padding:12px 14px;background:var(--mint);border-top:1px solid var(--mint-rule);border-bottom:1px solid var(--mint-rule);font:400 15px/1.5 var(--f-ui);color:var(--ink)}
@media (min-width:1280px){
  .vision-grid{grid-template-columns:minmax(600px,1fr) minmax(0,740px);column-gap:clamp(32px,3.4vw,64px)}
  .vision-chart{position:sticky;top:18px}
}
@media (max-width:640px){
  .vision-note{display:block}
  .vision-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;padding:6px}
  .vision-scroll img{width:720px;max-width:none}
}