/* m3v.art / seek («Ищите») — раздел для долгого чтения.
   Два голоса на странице: сам текст притчи набран Old Standard — гарнитурой
   в духе русских книг XIX века, когда вышел Синодальный перевод (1876);
   всё, что говорим мы (предисловие, сноски, послесловие), — Golos Text. */

/* Шрифты лежат здесь же, а не на Google Fonts: из России он отвечает не всегда.
   Только кириллица и латиница, только нужные начертания. Лицензия — SIL OFL,
   тексты лицензий в fonts/. */
@font-face{font-family:"Old Standard TT";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/old-standard-tt-cyrillic-400-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Old Standard TT";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/old-standard-tt-latin-400-normal.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:"Old Standard TT";font-style:italic;font-weight:400;font-display:swap;src:url(fonts/old-standard-tt-cyrillic-400-italic.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Old Standard TT";font-style:italic;font-weight:400;font-display:swap;src:url(fonts/old-standard-tt-latin-400-italic.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:"Old Standard TT";font-style:normal;font-weight:700;font-display:swap;src:url(fonts/old-standard-tt-cyrillic-700-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Old Standard TT";font-style:normal;font-weight:700;font-display:swap;src:url(fonts/old-standard-tt-latin-700-normal.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:"Golos Text";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/golos-text-cyrillic-400-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Golos Text";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/golos-text-latin-400-normal.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:"Golos Text";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/golos-text-cyrillic-500-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Golos Text";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/golos-text-latin-500-normal.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:"Golos Text";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/golos-text-cyrillic-600-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Golos Text";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/golos-text-latin-600-normal.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}

html{color-scheme:light dark;-webkit-text-size-adjust:100%}
*{box-sizing:border-box}
body{margin:0}
[hidden]{display:none!important}

:root{
  --font-text:"Old Standard TT","Georgia","Times New Roman",serif;
  --font-ui:"Golos Text",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;

  --paper:#ECEDE6;      /* известняк */
  --panel:#E1E3D9;
  --surface:#F8F8F4;
  --ink:#1E2420;
  --muted:#5D655F;
  --rule:#CDD1C5;
  --accent:#2C4A94;     /* синий, «тхелет» */
  --accent-soft:#D9DEEC;
  --olive:#6F6A24;      /* номера стихов */
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#151916;
    --panel:#1E2420;
    --surface:#212823;
    --ink:#E4E6DE;
    --muted:#9CA39B;
    --rule:#2E352F;
    --accent:#9DB3EE;
    --accent-soft:#25304A;
    --olive:#BDB66A;
  }
}
:root[data-theme="dark"]{
  --paper:#151916;
  --panel:#1E2420;
  --surface:#212823;
  --ink:#E4E6DE;
  --muted:#9CA39B;
  --rule:#2E352F;
  --accent:#9DB3EE;
  --accent-soft:#25304A;
  --olive:#BDB66A;
}

body{
  background:var(--paper);
  color:var(--ink);
  font-family:var(--font-ui);
  font-size:1.0625rem;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
.wrap{max-width:46rem;margin:0 auto;padding:0 20px 72px}

a{color:var(--accent);text-decoration-thickness:1px;text-underline-offset:.2em}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:2px}

/* ---------- шапка ---------- */
.head{padding:44px 0 8px}
.crumbs{font-size:.875rem;color:var(--muted);display:flex;flex-wrap:wrap;gap:0 .5em}
.crumbs a{color:var(--muted);text-decoration:none}
.crumbs a:hover,.crumbs a:focus-visible{color:var(--accent);text-decoration:underline}
.crumbs span{opacity:.5}

h1{
  font-family:var(--font-text);
  font-weight:400;
  font-size:clamp(2.6rem,9vw,4.25rem);
  line-height:1.02;
  letter-spacing:-.01em;
  margin:.5em 0 .2em;
}
.ref{font-family:var(--font-text);font-style:italic;font-size:1.25rem;margin:0;color:var(--muted)}
.ref a{color:inherit}

/* ---------- части страницы ---------- */
.part{margin-top:2.75rem}
.part h2{
  font-family:var(--font-ui);
  font-weight:600;
  font-size:1rem;
  color:var(--muted);
  margin:0 0 .9rem;
  display:flex;align-items:center;gap:.75rem;
}
.part h2::after{content:"";flex:1;border-top:1px solid var(--rule)}

.part-before p,.part-after p{max-width:36rem;margin:0 0 1em}
.part-before p:first-of-type{font-size:1.12rem}

/* текст притчи — главное на странице */
.part-text{margin-top:3.25rem}
.part-text h2{color:var(--olive)}
.translation{font-size:.9rem;color:var(--muted);margin:-.4rem 0 1.4rem}
.gap{font-size:.95rem;color:var(--muted);font-style:italic;margin:1.2rem 0;padding-left:2.4rem}
.v{
  position:relative;
  font-family:var(--font-text);
  font-size:1.3rem;
  line-height:1.62;
  margin:0 0 .55em;
  padding-left:2.4rem;
  hanging-punctuation:first;
}
.vn{
  position:absolute;left:0;top:.42em;width:1.7rem;text-align:right;
  font-family:var(--font-ui);font-size:.72rem;font-weight:600;
  color:var(--olive);font-variant-numeric:tabular-nums;line-height:1;
}

/* сноска в тексте: цифра на плашке — видно, что на неё можно нажать */
sup.fn{line-height:0;vertical-align:.55em;font-size:.58em;margin-left:.08em}
sup.fn a{
  display:inline-block;min-width:1.55em;padding:.28em .32em .22em;
  font-family:var(--font-ui);font-weight:600;line-height:1;text-align:center;
  text-decoration:none;color:var(--accent);
  background:var(--accent-soft);border-radius:.4em;
  position:relative;
}
sup.fn a::after{content:"";position:absolute;inset:-.6em -.35em}   /* зона под палец */
sup.fn a:hover{background:var(--accent);color:var(--paper)}
sup.fn a.is-open{background:var(--accent);color:var(--paper)}

/* «?» у ссылки на источник */
.src{
  display:inline-grid;place-items:center;
  width:1.15em;height:1.15em;margin:0 0 0 .18em;padding:0;
  vertical-align:.32em;
  font:600 .62em/1 var(--font-ui);
  color:var(--accent);background:transparent;
  border:1px solid currentColor;border-radius:50%;
  cursor:pointer;
  position:relative;
}
.src::after{content:"";position:absolute;inset:-.55em}  /* зона нажатия */
.src:hover,.src.is-open{background:var(--accent);color:var(--paper);border-color:var(--accent)}

/* пояснение: карточка у знака (широкий экран) или панель снизу (телефон) */
.pop{
  font-family:var(--font-ui);font-size:1rem;line-height:1.55;color:var(--ink);
  background:var(--surface);
  border:1px solid var(--rule);
  box-shadow:0 10px 30px -12px rgba(20,30,25,.35);
  z-index:20;
}
.pop-head{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;
          font-size:.85rem;font-weight:600;color:var(--muted);margin-bottom:.35rem}
.pop-close{font:500 .85rem var(--font-ui);color:var(--accent);background:none;border:0;padding:.3rem 0 .3rem .6rem;cursor:pointer}
.pop-close:hover{text-decoration:underline}
.pop-body p{margin:0}
.pop-body .src{display:none}
.pop-go{display:inline-block;margin-top:.5rem;font-size:.92rem}

.pop.float{position:absolute;border-radius:10px;padding:.75rem 1rem .9rem}
.pop.float::before{                      /* стрелка к знаку */
  content:"";position:absolute;top:-7px;left:calc(var(--arrow,24px) - 6px);
  width:12px;height:12px;background:var(--surface);
  border-left:1px solid var(--rule);border-top:1px solid var(--rule);
  transform:rotate(45deg);
}
.pop.float.above::before{top:auto;bottom:-7px;transform:rotate(225deg)}

.pop.sheet{
  position:fixed;left:0;right:0;bottom:0;
  max-height:70vh;overflow:auto;-webkit-overflow-scrolling:touch;
  border-radius:16px 16px 0 0;border-bottom:0;
  padding:.6rem 20px calc(1.2rem + env(safe-area-inset-bottom));
}
.pop.sheet::before{content:"";display:block;width:40px;height:4px;border-radius:2px;
                   background:var(--rule);margin:0 auto .6rem}
.shade{position:fixed;inset:0;background:rgba(10,14,12,.32);z-index:19}
html.sheet-open{overflow:hidden}

@media (prefers-reduced-motion: no-preference){
  .pop.float{animation:pop-in .14s ease-out}
  .pop.sheet{animation:sheet-in .2s ease-out}
  .shade{animation:fade .2s ease-out}
  @keyframes pop-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
  @keyframes sheet-in{from{transform:translateY(100%)}to{transform:none}}
  @keyframes fade{from{opacity:0}to{opacity:1}}
}

/* список сносок внизу — для печати и без JS */
.part-notes{font-size:.95rem}
.notes{margin:0;padding-left:1.6rem}
.notes li{margin:0 0 .8em;padding-left:.2rem}
.notes li::marker{color:var(--olive);font-weight:600}
.notes .back{font-size:.85rem;color:var(--muted)}
.notes li:target{background:var(--accent-soft);border-radius:4px;outline:6px solid var(--accent-soft)}

/* ---------- соседние притчи ---------- */
.pager{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:3.5rem;
       padding-top:1.4rem;border-top:1px solid var(--rule)}
.pager a{text-decoration:none;font-family:var(--font-text);font-size:1.35rem;line-height:1.2;color:var(--ink)}
.pager a span{display:block;font-family:var(--font-ui);font-size:.85rem;color:var(--muted);margin-bottom:.25rem}
.pager a:hover{color:var(--accent)}
.pager .next{text-align:right}
.up{margin:1.6rem 0 0;font-size:.95rem}

/* ---------- оглавления ---------- */
.lede{font-size:1.15rem;max-width:36rem;margin:.6rem 0 0}
.how{color:var(--muted);max-width:36rem;margin:1rem 0 0;font-size:.98rem}
.toc{list-style:none;margin:2.5rem 0 0;padding:0}
.toc li{border-top:1px solid var(--rule)}
.toc li:last-child{border-bottom:1px solid var(--rule)}
.toc a{display:flex;align-items:baseline;gap:1rem;padding:.8rem 0;text-decoration:none;color:var(--ink)}
.toc .t{font-family:var(--font-text);font-size:1.6rem;line-height:1.2;flex:1}
.toc .r{font-size:.9rem;color:var(--olive);font-variant-numeric:tabular-nums;white-space:nowrap}
.toc a:hover .t{color:var(--accent)}
.toc li > p{margin:-.4rem 0 .9rem;color:var(--muted);max-width:34rem}

.foot{margin-top:4rem;font-size:.85rem;color:var(--muted)}
.foot a{color:var(--muted)}

/* Телефон: всё крупнее. Old Standard с маленьким очком, на узком экране
   ему нужен кегль заметно больше, чем у соседнего гротеска. Размеры заданы
   в rem, поэтому достаточно поднять корневой кегль. */
@media (max-width:640px){
  html{font-size:18.5px}
  .head{padding-top:24px}
  h1{font-size:2.6rem}
  .ref{font-size:1.15rem}
  .part-before p:first-of-type{font-size:1.06rem}
  .v{font-size:1.28rem;line-height:1.5;padding-left:1.7rem}
  .vn{width:1.25rem;font-size:.7rem}
  .gap{padding-left:1.7rem}
  .toc .t{font-size:1.45rem}
  .pager a{font-size:1.2rem}
  .pop{font-size:1.02rem}
}

@media print{
  .src,.pager,.up,.foot,.crumbs{display:none}
  body{background:#fff;color:#000}
  a{color:inherit}
}