/* Раздел «История в цифрах» (/istorii/): витрина и «Как мы отбираем источники».
   Опирается на токены и компоненты app.css; здесь только то, чего там нет. */

.ist-hero{padding-top:var(--s10);padding-bottom:var(--s7)}
.ist-hero h1{max-width:18ch;margin-top:var(--s4)}
.ist-hero h1 em{font-family:Literata,Georgia,serif;font-style:italic;font-weight:400;color:var(--blue)}
.ist-hero .lead{max-width:var(--measure);font-size:19px;color:var(--ink-mid);margin-top:var(--s5)}
.ist-hero .facts{display:flex;flex-wrap:wrap;gap:var(--s2) var(--s3);margin-top:var(--s6)}

/* ===================== витрина: каталог историй ===================== */
.ist-hero{padding-bottom:var(--s8)}
.ist-list{padding-top:0;padding-bottom:var(--s10)}

/* панель: темы и поиск */
.ist-tools{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s4) var(--s6);margin-bottom:var(--s5)}
.ist-chips{display:flex;flex-wrap:wrap;gap:8px}
.ist-chip{display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:0 14px;border-radius:99px;border:1px solid var(--line-2);background:transparent;color:var(--ink-mid);font:600 14px/1 Manrope,system-ui,sans-serif;cursor:pointer;transition:background .2s,border-color .2s,color .2s}
.ist-chip i{font-style:normal;font-size:12px;font-weight:600;color:var(--ink-soft)}
.ist-chip:hover{border-color:rgba(255,255,255,.4);color:var(--ink)}
.ist-chip[aria-pressed="true"]{background:var(--blue);border-color:var(--blue);color:#1A0F08}
.ist-chip[aria-pressed="true"] i{color:rgba(26,15,8,.7)}
.ist-chip:focus-visible,.ist-search input:focus-visible,.ist-morebtn:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.ist-search{position:relative;flex:0 1 260px;min-width:210px;margin-left:auto}
.ist-search input{width:100%;height:44px;border-radius:99px;border:1px solid var(--line-2);background:var(--sky);color:var(--ink);padding:0 42px 0 42px;font:inherit;font-size:15px}
.ist-search input::placeholder{color:var(--ink-soft)}
.ist-search input::-webkit-search-cancel-button{display:none}
.ist-search>svg{position:absolute;left:15px;top:50%;width:16px;height:16px;transform:translateY(-50%);color:var(--ink-soft);pointer-events:none}
.ist-search button{position:absolute;right:6px;top:50%;width:32px;height:32px;transform:translateY(-50%);display:grid;place-items:center;border:0;border-radius:50%;background:transparent;color:var(--ink-soft);cursor:pointer}
.ist-search button:hover{background:var(--sky-2);color:var(--ink)}
.ist-search button[hidden]{display:none}
.ist-count{margin:0 0 var(--s5);font-size:14px;color:var(--ink-soft)}

/* сетка: 3 → 2 → 1 колонки; карточка-приглашение занимает остаток ряда, поэтому дыр не бывает */
.ist-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s6);align-items:stretch}
.ist-grid>[hidden]{display:none}

/* карточка */
.st{position:relative;display:flex;flex-direction:column;min-width:0;border-radius:24px;overflow:hidden;background:var(--sky);border:1px solid var(--line);color:var(--ink);text-decoration:none;box-shadow:var(--sh-1);transition:transform .35s var(--ease),border-color .35s,box-shadow .35s;opacity:0;transform:translateY(22px)}
.st.st-in{opacity:1;transform:translateY(0);transition:opacity .6s var(--ease),transform .6s var(--ease),border-color .35s,box-shadow .35s}
.st:hover{color:var(--ink);transform:translateY(-4px);border-color:rgba(227,162,127,.5);box-shadow:var(--sh-2)}
.st:active{transform:scale(.985)}
.st:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
.st-img{position:relative;display:block;aspect-ratio:16/10;overflow:hidden;background:#0C141C}
.st-img::before{content:"";position:absolute;inset:0;z-index:1;background:var(--clay,#E3A27F);mix-blend-mode:color;opacity:.14;pointer-events:none}
.st-img img{width:100%;height:100%;object-fit:cover;display:block;filter:grayscale(.5) contrast(1.05) brightness(.9);transition:transform .9s var(--ease),filter .5s;-webkit-user-drag:none;user-select:none}
.st:hover .st-img img{transform:scale(1.05);filter:grayscale(.05) contrast(1.05) brightness(1)}
.st-img::after{content:"";position:absolute;inset:auto 0 0 0;height:55%;background:linear-gradient(0deg,var(--sky) 0%,rgba(15,25,35,0) 100%)}
.st-badge{position:absolute;left:var(--s5);top:var(--s5);z-index:2;padding:5px 12px;border-radius:99px;background:var(--blue);color:#1A0F08;font:700 11px/1 Manrope,system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase}
.st-body{display:flex;flex-direction:column;flex:1;padding:0 var(--s6) var(--s6);margin-top:calc(var(--s7) * -1);position:relative;z-index:1}
.st-num{font:600 clamp(38px,3.6vw,54px)/1 Unbounded,Manrope,sans-serif;letter-spacing:-.045em;color:var(--blue-deep);white-space:nowrap}
.st-body h3{margin-top:var(--s4);font-size:clamp(21px,1.9vw,25px);color:var(--ink)}
.st-text{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;margin-top:var(--s3);font-size:15px;line-height:1.6;color:var(--ink-mid)}
.st-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:var(--s4)}
.st-tags b{display:inline-flex;align-items:center;min-height:26px;padding:0 11px;border-radius:99px;background:var(--blue-pale);color:var(--blue-deep);font:600 12px/1 Manrope,system-ui,sans-serif}
.st-feats{display:flex;flex-wrap:wrap;gap:4px 14px;margin-top:10px}
.st-feats i{display:inline-flex;align-items:center;gap:5px;font:500 12px/1 Manrope,system-ui,sans-serif;font-style:normal;color:var(--ink-soft)}
.st-feats svg{width:13px;height:13px;flex:none;color:var(--clay)}
.st-meta{display:flex;flex-wrap:wrap;gap:4px 16px;margin-top:var(--s4);font-size:13px;color:var(--ink-soft)}
.st-meta i{font-style:normal}
.st-foot{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s4);margin-top:auto;padding-top:var(--s5)}
.st-src{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:12.5px;color:var(--ink-soft);line-height:1.45}
.st-src b{font-weight:600;color:var(--ink-mid)}
.st-go{display:grid;place-items:center;flex:none;width:46px;height:46px;border-radius:50%;background:var(--blue);color:#1A0F08;transition:transform .3s var(--ease),background .2s}
.st-go svg{width:18px;height:18px}
.st:hover .st-go{transform:translateX(4px);background:var(--blue-deep)}


/* приглашение предложить тему: занимает остаток ряда */
.st-more{grid-column:1 / -1;flex-direction:row;align-items:center;flex-wrap:wrap;gap:var(--s5) var(--s7);padding:var(--s6) var(--s7);background:transparent;border:1px dashed var(--line-2);box-shadow:none}
.st-more:hover{transform:none;border-color:var(--line-2);box-shadow:none}
.st-plus{display:grid;place-items:center;flex:none;width:52px;height:52px;border-radius:50%;background:var(--blue-pale);color:var(--blue-deep);font-size:28px;font-weight:300;line-height:1}
.st-moretxt{flex:1 1 260px;min-width:0}
.st-moretxt h3{margin:0;font-size:clamp(19px,1.8vw,23px)}
.st-moretxt p{margin:var(--s2) 0 0;font-size:15px;line-height:1.55;color:var(--ink-mid)}
.st-more .btn{flex:none}

.ist-empty{padding:var(--s8) var(--s6);text-align:center;border:1px dashed var(--line-2);border-radius:24px;color:var(--ink-mid)}
.ist-empty[hidden]{display:none}
.ist-empty b{display:block;margin-bottom:var(--s2);font-size:19px;color:var(--ink)}
.ist-more{display:flex;justify-content:center;margin-top:var(--s6)}
.ist-more[hidden]{display:none}
.ist-morebtn{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 26px;border-radius:99px;border:1px solid var(--line-2);background:var(--sky);color:var(--ink);font:600 15px/1 Manrope,system-ui,sans-serif;cursor:pointer;transition:background .2s,border-color .2s}
.ist-morebtn:hover{background:var(--sky-2);border-color:rgba(255,255,255,.4)}

@media(max-width:1100px){
  .ist-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s5)}
  .ist-hero{padding-top:var(--s9)}
  .st-body{padding:0 var(--s5) var(--s5)}
}
@media(max-width:700px){
  .ist-hero{padding-top:var(--s8);padding-bottom:var(--s6)}
  .ist-hero .lead{font-size:17px}
  .ist-tools{gap:var(--s3)}
  .ist-search{flex:1 1 100%;order:-1}
  .ist-chips{flex-wrap:nowrap;overflow-x:auto;margin-inline:calc(var(--gutter) * -1);padding:2px var(--gutter);scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 var(--gutter),#000 calc(100% - var(--gutter)),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 var(--gutter),#000 calc(100% - var(--gutter)),transparent 100%);width:calc(100% + var(--gutter) * 2)}
  .ist-chips::-webkit-scrollbar{display:none}
  .ist-chip{flex:none}
  .ist-grid{grid-template-columns:1fr;gap:var(--s4)}
  .st{border-radius:20px}
  .st-body{margin-top:calc(var(--s6) * -1)}
  .st-more{padding:var(--s5);border-radius:20px}
  .st-more .btn{width:100%}
  .ist-list{padding-bottom:var(--s8)}
}
@media(prefers-reduced-motion:reduce){.st,.st-img img,.st-go{transition:none}.st{opacity:1;transform:none}}
/* «Как мы работаем» */
.ist-how{padding-top:0}
.ist-how .band{padding:var(--s10) var(--s8)}
.ist-how .steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap);margin-top:var(--s8)}
.ist-how .step{background:var(--sky);border:1px solid var(--line);border-radius:var(--r-card);padding:var(--s6)}
.ist-how .step b{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--blue-pale);color:var(--blue-deep);font-size:14px;margin-bottom:var(--s4)}
.ist-how .step h4{margin-bottom:var(--s2)}
.ist-how .step p{font-size:15px;color:var(--ink-mid)}
.ist-status{display:flex;flex-wrap:wrap;gap:var(--s3) var(--s6);align-items:center;margin-top:var(--s7);padding-top:var(--s6);border-top:1px solid var(--line-2);font-size:14.5px;color:var(--ink-mid)}
.ist-status strong{color:var(--ink)}

/* страница «Как мы отбираем источники» */
.ist-doc{padding-top:var(--s10);padding-bottom:var(--s10)}
.ist-doc .back{display:inline-flex;font-size:14px;font-weight:600;margin-bottom:var(--s5)}
.ist-doc h1{font-size:clamp(30px,4.2vw,48px);max-width:20ch}
.ist-doc .lead{max-width:var(--measure);font-size:19px;color:var(--ink-mid);margin-top:var(--s5)}
.ist-doc h2{font-size:clamp(21px,2.4vw,26px);margin-top:var(--s9)}
.ist-doc .body{max-width:var(--measure)}
.ist-doc p,.ist-doc li{color:var(--ink-mid);font-size:16.5px}
.ist-doc ol,.ist-doc ul.dots{margin:var(--s4) 0 0;padding-left:22px}
.ist-doc ul.dots{list-style:disc}
.ist-doc ol{list-style:decimal}
.ist-doc li{margin-bottom:var(--s3)}
.ist-doc table{width:100%;max-width:var(--measure);border-collapse:collapse;margin-top:var(--s5);font-size:15px}
.ist-doc th,.ist-doc td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line)}
.ist-doc th{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft)}

/* страница обращения (/istorii/predlozhit/): опирается на zayavka.css */
.ist-back{display:inline-flex;font-size:14px;font-weight:600;margin-bottom:var(--s5)}
.ist-opt{font-weight:400;color:var(--ink-soft)}
.ist-select{width:100%;height:50px;font:inherit;font-size:16px;color:var(--ink);background:#fff;border:1px solid var(--line-2);border-radius:var(--r-ctl);padding:0 var(--s4);transition:border-color .18s,box-shadow .18s}
.ist-select:hover{border-color:#B2CDE8}
.ist-select:focus{outline:0;border-color:var(--blue);box-shadow:0 0 0 3px rgba(46,119,201,.13)}

/* выбор типа обращения: два варианта в ряд; на телефоне — в столбик */
.zv .pick.duo{grid-template-columns:repeat(2,minmax(0,1fr))}
.zv .pick.duo label:last-child:nth-child(odd){grid-column:1 / -1}
@media(max-width:600px){.zv .fld textarea{min-height:150px}.zv .pick.duo{grid-template-columns:minmax(0,1fr)}.ist-back{margin-bottom:var(--s4)}.ist-select{height:48px}}
.zv .zv-form{border-radius:var(--r-block)}
@media(max-width:600px){.zv .zv-form,.zv .zv-info{border-radius:var(--r-card)}}
@media(min-width:601px) and (max-width:900px){.zv .zv-side{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s4)}}

/* обращение: шапка и выбор типа */
.zv .zv-head{max-width:none}
.zv .ist-back{margin-bottom:var(--s7)}
.zv .zv-head h1{font-size:clamp(34px,4.6vw,56px);margin-top:0}
.zv .zv-head p{max-width:60ch;margin-top:var(--s5)}
.zv .zv-grid{margin-top:var(--s9)}
.zv .pick.duo label{align-items:flex-start;padding:var(--s4) var(--s5);min-height:0}
.zv .pick.duo .mark{margin-top:2px}
.zv .pk b{display:block;font-size:15.5px;font-weight:600;line-height:1.3}
.zv .pk small{display:block;margin-top:3px;font-size:13px;font-weight:400;color:var(--ink-soft);line-height:1.4}
@media(max-width:600px){.zv .ist-back{margin-bottom:var(--s5)}.zv .zv-grid{margin-top:var(--s7)}.zv .zv-head h1{font-size:clamp(30px,9vw,38px)}}

/* ============================================================
   Палитра раздела «История в цифрах»: тёмная, с тёплым акцентом — как в самих историях.
   Структура шапки, подвала, сетка и компоненты — общие с сайтом; меняются только токены,
   поэтому человек сразу видит, что оказался в другом разделе.
   ============================================================ */
body.ist{
  --bg:#0A1119; --sky:#0F1923; --sky-2:#152431;
  --line:rgba(255,255,255,.10); --line-2:rgba(255,255,255,.20);
  --ink:#F2F6FA; --ink-mid:#C4D2E2; --ink-soft:#8FA3B8;
  --blue:#E3A27F; --blue-deep:#F0BFA3; --blue-pale:rgba(227,162,127,.14); --blue-ghost:rgba(227,162,127,.22);
  --mint-pale:rgba(78,158,134,.16); --clay-pale:rgba(190,110,90,.16);
  --sh-1:0 1px 2px rgba(0,0,0,.3), 0 4px 14px rgba(0,0,0,.25);
  --sh-2:0 2px 6px rgba(0,0,0,.35), 0 14px 34px rgba(0,0,0,.35);
  background:var(--bg);color:var(--ink);color-scheme:dark;
}
body.ist .topbar{background:rgba(10,17,25,.92)}
body.ist .btn,body.ist .nav .btn-sm,body.ist .skip:focus{color:#1A0F08}
body.ist .btn:hover,body.ist .nav .btn-sm:hover{color:#1A0F08;background:var(--blue-deep);border-color:var(--blue-deep)}
body.ist .btn-ghost,body.ist .btn-login,body.ist .burger,body.ist .card,body.ist .mnav a{background:var(--sky);color:var(--ink)}
body.ist .btn-ghost:hover{background:var(--sky-2);color:var(--ink)}
body.ist .mnav{background:var(--bg)}
body.ist .cookie-box{background:var(--sky);box-shadow:0 4px 12px rgba(0,0,0,.4),0 24px 56px rgba(0,0,0,.5)}
body.ist .cookie-box .btn-ghost{background:transparent}
body.ist footer{background:var(--sky)}
body.ist .ist-how .step{background:var(--sky-2);border-color:var(--line)}
body.ist .ist-how .band{background:var(--sky)}
body.ist .ist-hero h1 em{color:var(--blue-deep)}
body.ist .tag{background:var(--blue-pale);color:var(--blue-deep)}
/* форма обращения */
body.ist .zv-form{background:var(--sky);border-color:var(--line)}
body.ist .fld input,body.ist .fld textarea,body.ist .ist-select{background:var(--bg);color:var(--ink);border-color:var(--line-2)}
body.ist .fld input::placeholder,body.ist .fld textarea::placeholder{color:var(--ink-soft)}
body.ist .fld input:hover,body.ist .fld textarea:hover,body.ist .ist-select:hover{border-color:rgba(255,255,255,.34)}
body.ist .fld input:focus,body.ist .fld textarea:focus,body.ist .ist-select:focus{box-shadow:0 0 0 3px rgba(227,162,127,.22)}
body.ist .pick label:hover{background:var(--sky-2)}
body.ist .zv-info,body.ist .zv-empty{background:var(--sky)}
body.ist .agree-full{background:var(--bg);border-color:var(--line)}
body.ist .flash{background:var(--mint-pale);border-color:rgba(78,158,134,.4);color:#9AD4BF}
body.ist .alert-bad{background:var(--clay-pale);border-color:rgba(190,110,90,.45);color:#F0B3A3}
body.ist .err{color:#F0A28E}
body.ist .ist-doc th,body.ist .ist-doc td{border-color:var(--line)}
body.ist ::selection{background:rgba(227,162,127,.35)}


/* «Как мы работаем» и документ: адаптив (после базовых правил, чтобы не перебивались) */
@media(max-width:1024px){.ist-how .band{padding:var(--s9) var(--s7)}}
@media(max-width:960px){
  .ist-how .band{padding:var(--s8) var(--s6)}
  .ist-how .steps{grid-template-columns:1fr;gap:var(--s3);margin-top:var(--s7)}
  .ist-how .step{display:grid;grid-template-columns:34px minmax(0,1fr);column-gap:var(--s4);padding:var(--s5)}
  .ist-how .step b{grid-row:1 / span 2;margin:0}
  .ist-how .step h4{margin:0 0 var(--s1)}
  .ist-status{flex-direction:column;align-items:flex-start;gap:var(--s2)}
}
@media(max-width:640px){
  .ist-how .band{padding:var(--s7) var(--s4);border-radius:var(--r-card)}
  .ist-how .step{padding:var(--s4);column-gap:var(--s3);border-radius:12px}
  .ist-how .sec-head .lead{font-size:17px}
  .ist-doc{padding-top:var(--s8)}
  .ist-doc .lead{font-size:17px}
  .ist-doc h2{margin-top:var(--s8)}
  .ist-doc th,.ist-doc td{padding:9px 8px}
}
.ist-hint .h-touch{display:none}
@media(pointer:coarse){.ist-hint .h-mouse{display:none}.ist-hint .h-touch{display:inline}}

.zv .zv-info p{font-size:14px;line-height:1.6;color:var(--ink-mid);font-weight:400}


/* ===== просьба убрать материал (/istorii/udalenie/) ===== */
.ud .zv-head h1{max-width:20ch}
.pick.stack{grid-template-columns:1fr}
.pick.stack label:last-child{grid-column:auto}
.pick.stack label{align-items:flex-start;padding:var(--s4) var(--s5);min-height:0}
.pick.stack .mark{margin-top:2px}
.pick.chk .mark{border-radius:6px}
.pick.chk .mark::after{width:10px;height:10px;border-radius:3px}
.pk b{display:block;font-size:15.5px;font-weight:600;line-height:1.35}
.pk small{display:block;margin-top:3px;font-size:13px;font-weight:400;color:var(--ink-soft);line-height:1.45}


.st-more{align-content:center}
@media(max-width:1100px){.ist-search{flex:1 1 100%;max-width:none;margin-left:0;order:-1}}