/* История за портретами — стиль сайта (v1) */
:root{
  --night:#120a0e; --wall:#1c0e15; --plum:#3a1b28; --velvet:#8f1d2a;
  --gold:#c29b5c; --gold-hi:#e2c48c; --gold-lo:#6f5530;
  --ivory:#f1eee9; --ivory-2:#dcd2c6; --muted:#b9a79b;
  --display:"Noto Serif Display","Times New Roman",serif;
  --text:"Old Standard TT",Georgia,serif;
  --gutter:clamp(20px,6vw,96px);
  --ease:cubic-bezier(.16,1,.3,1);
  --frame:url(img/frame-emp.webp); --frame-slice:150 153; --frame-w:clamp(15px,1.7vw,26px);
}
*{box-sizing:border-box}
html{background:var(--night);color-scheme:dark;scrollbar-color:var(--gold-lo) var(--night);scroll-behavior:smooth}
body{margin:0;font-family:var(--text);color:var(--ivory);background:var(--night);
  font-size:clamp(17px,.55vw + 13px,20px);line-height:1.55;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
::selection{background:var(--velvet);color:var(--ivory)}
:focus-visible{outline:1px solid var(--gold-hi);outline-offset:5px}
a{color:inherit}
img{max-width:100%}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
body::after{content:"";position:fixed;inset:-50%;pointer-events:none;z-index:50;opacity:.07;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.display{font-family:var(--display);font-stretch:75%;font-weight:200;text-transform:uppercase;letter-spacing:.01em}
.caps{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase}
.rule{display:block;width:min(260px,70%);height:14px;color:var(--gold)}

/* ---------- шапка ---------- */
.topbar{position:absolute;inset:0 0 auto;z-index:30;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:24px var(--gutter)}
.brand{font-family:var(--display);font-stretch:75%;font-weight:300;font-size:15px;letter-spacing:.18em;text-transform:uppercase;text-decoration:none}
.nav{display:flex;gap:clamp(18px,2.6vw,40px)}
.nav a{font-size:13px;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;color:var(--ivory-2);padding-block:6px;
  background:linear-gradient(var(--gold),var(--gold)) 0 100%/0 1px no-repeat;transition:background-size .5s var(--ease),color .3s}
.nav a:hover{color:var(--gold-hi);background-size:100% 1px}

/* ---------- кнопки, рамы ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:16px 26px;font-family:var(--text);font-size:13px;letter-spacing:.2em;
  text-transform:uppercase;text-decoration:none;border:1px solid var(--gold);background:var(--gold);color:#1a0e12;cursor:pointer;
  transition:background .4s var(--ease),color .4s,border-color .4s}
.btn:hover{background:var(--gold-hi);border-color:var(--gold-hi)}
.btn--ghost{background:transparent;color:var(--ivory);border-color:rgba(194,155,92,.55)}
.btn--ghost:hover{background:rgba(194,155,92,.14);color:var(--gold-hi)}
/* рама — картинка (frame-*.webp), нарезка border-image: углы не растягиваются на любом формате;
   тени: контактная у стены + мягкая вниз-вправо, чтобы рама висела, а не была приклеена */
.gilt{position:relative;border:var(--frame-w,20px) solid transparent;border-image:var(--frame) var(--frame-slice) round;background:#140a0e;
  box-shadow:0 1px 0 rgba(0,0,0,.9),0 3px 5px -1px rgba(0,0,0,.75),0 22px 30px -14px rgba(0,0,0,.8),0 54px 66px -38px rgba(0,0,0,.95)}
.gilt__in{position:relative;height:100%;overflow:hidden;background:#140a0e;box-shadow:inset 0 0 0 1px rgba(0,0,0,.85),inset 0 6px 14px -6px rgba(0,0,0,.8)}
.gilt__in>img{display:block;width:100%;height:100%;object-fit:cover}
.play{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}
.play span{width:68px;height:68px;border-radius:50%;display:grid;place-items:center;background:rgba(18,10,14,.72);border:1px solid var(--gold);color:var(--gold-hi)}
.play svg{width:18px;height:18px;margin-left:4px}

/* ---------- первый экран: загадка ---------- */
.riddle-hero{position:relative;min-height:100vh;min-height:100svh;display:grid}
.riddle-hero__visual{position:absolute;inset:0;overflow:hidden;background:var(--night) url(img/hall-wide-first.webp) no-repeat}
.riddle-hero__visual,.hall-after{background-size:var(--bg-size,cover);background-position:var(--bg-pos,72% 50%)}
/* запасной кадр «после» — только если ролик не сыграл (старый браузер, экономия трафика, отключённая анимация) */
.hall-after{position:absolute;inset:0;background-repeat:no-repeat;opacity:0;transition:opacity .5s linear}
.riddle-hero__visual.is-after .hall-after{opacity:1}
.riddle-hero__visual::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg,rgba(14,7,10,.95) 0%,rgba(14,7,10,.8) 34%,rgba(14,7,10,.1) 60%,transparent 72%),linear-gradient(0deg,rgba(14,7,10,.8),transparent 30%)}
/* портрет проявляется в окне рамы (рама — часть кадра «после», не CSS) */
.reveal{position:absolute;z-index:2;display:block;overflow:hidden;opacity:0;pointer-events:none;
  transition:opacity .55s var(--ease);box-shadow:inset 0 0 26px rgba(0,0,0,.6)}
.reveal>img{display:block;width:100%;height:100%;object-fit:cover}
.reveal.is-open{opacity:1;pointer-events:auto;cursor:pointer}
/* ткань снимают: ролик и есть фон — он лежит поверх картинки-постера и стоит на первом кадре,
   поэтому в момент ответа ничего не подменяется, начинается только движение */
.hall-video{position:absolute;z-index:1;object-fit:fill;opacity:0;pointer-events:none;transition:opacity .45s linear}
.hall-video.is-ready{opacity:1}
.reveal .play span{transition:background .3s var(--ease),transform .3s var(--ease)}
.reveal:hover .play span{background:var(--velvet);transform:scale(1.08)}
.reveal .gilt{height:100%;--frame-w:clamp(18px,2.4vw,38px)}
.riddle{position:relative;z-index:2;align-self:center;width:min(640px,100%);padding:110px var(--gutter) 110px;box-sizing:content-box}
.ask{margin:0 0 22px;color:var(--gold-hi);font-family:var(--display);font-stretch:75%;font-weight:300;text-transform:uppercase;letter-spacing:.14em;font-size:clamp(1rem,1.3vw,1.2rem)}
.riddle__q{margin:0 0 30px;font-family:var(--display);font-stretch:75%;font-weight:300;font-size:clamp(1.9rem,3.5vw,3.2rem);line-height:1.1;text-wrap:balance}
.answers{display:flex;flex-wrap:wrap;gap:12px}
.answers .btn{padding:15px 22px}
.riddle__hint{margin:22px 0 0;color:var(--muted)}
/* оба состояния загадки лежат в одной ячейке: при ответе высота первого экрана не меняется
   и зал не «прыгает» (баг, пойманный 20.09) */
.riddle__slot{display:grid}
.riddle__state{grid-area:1/1}
.riddle__state[hidden]{display:block!important;visibility:hidden;pointer-events:none}
.verdict{margin:0 0 10px;min-height:2.24em;font-family:var(--display);font-stretch:75%;font-weight:300;font-size:clamp(1.6rem,2.4vw,2.2rem);line-height:1.12}
.explain{margin:0 0 26px;color:var(--ivory-2);max-width:42ch}
.row{display:flex;flex-wrap:wrap;gap:12px}
.riddle-hero__foot{position:absolute;z-index:2;left:var(--gutter);right:var(--gutter);bottom:clamp(20px,4vh,40px);display:flex;justify-content:space-between;gap:20px;color:var(--muted)}
.riddle-hero__foot a{color:var(--ivory-2);text-decoration:none;border-bottom:1px solid var(--gold-lo)}

.section-title{margin:0 0 8px;font-size:clamp(2.2rem,4.6vw,4rem);line-height:1}
.section-lede{margin:0 0 40px;color:var(--muted);max-width:52ch}
.screen__video{position:relative;aspect-ratio:16/9;margin:6px;background:#000}
.screen__video iframe,.screen__video video{position:absolute;inset:0;width:100%;height:100%;border:0}
.screen__video video{background:#000;object-fit:contain}
.screen__video .vposter{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.screen__video--cover .vposter,.screen__video--cover .vplay{pointer-events:none}
.vplay{position:absolute;inset:0;display:grid;place-items:center;background:none;border:0;padding:0;cursor:pointer}
.vplay[hidden]{display:none}
.vfail{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(14px,2.2vw,22px);padding:20px;text-align:center;background:var(--night)}
.vfail__t{margin:0;font-family:var(--display);font-weight:400;color:var(--ivory);font-size:clamp(1.15rem,2vw,1.6rem);letter-spacing:.02em}
.vfail__b{font-family:var(--text);font-size:clamp(.72rem,1vw,.85rem);letter-spacing:.18em;text-transform:uppercase;color:var(--gold-hi);background:transparent;border:1px solid var(--gold);padding:.8em 1.7em;cursor:pointer;transition:background .3s var(--ease)}
.vfail__b:hover,.vfail__b:focus-visible{background:rgba(194,155,92,.14)}
.vplay span{width:84px;height:84px;border-radius:50%;display:grid;place-items:center;background:rgba(18,10,14,.72);border:1px solid var(--gold);color:var(--gold-hi);transition:background .3s var(--ease),transform .3s var(--ease)}
.vplay svg{width:22px;height:22px;margin-left:5px}
.vplay:hover span,.vplay:focus-visible span{background:var(--velvet);transform:scale(1.08)}
@media (max-width:600px){.vplay span{width:64px;height:64px}.vplay svg{width:18px;height:18px}}

/* ---------- стена выпусков ---------- */
.gallery{position:relative;overflow-x:clip;padding:clamp(80px,12vh,130px) var(--gutter) 130px;background:linear-gradient(180deg,var(--night) 0,transparent 180px),radial-gradient(90% 60% at 50% 0%,var(--plum) 0%,var(--wall) 62%),var(--wall)}  /* верхняя растушёвка — вместо ушедшего блока «Сейчас в зале» */
.gallery__head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:28px 48px}
.count{margin:12px 0 0;color:var(--muted)}
/* 09.10: блок «О проекте» на главной — после «Выпусков»; заголовок слева, текст справа, на узком экране — в столбик */
/* 10.10.2026, владелец: «здесь какой-то мрак» → вариант Б из mockups/about-20261010/: свет как у «Выпусков», золотая линия, девиз крупно под заголовком */
.about{padding:clamp(72px,10vh,120px) var(--gutter) clamp(72px,10vh,110px);background:radial-gradient(75% 95% at 70% 38%,rgba(58,27,40,.9) 0%,var(--wall) 58%,var(--night) 100%);border-top:1px solid rgba(194,155,92,.2)}
.about__in{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,6vw,110px);align-items:start}
.about h2{margin:0}
.about h2::after{content:"";display:block;width:84px;height:1px;background:var(--gold);margin-top:26px}
.about__lead{margin:30px 0 0;font-family:var(--display);font-stretch:75%;font-weight:200;font-size:clamp(1.9rem,3.3vw,3.1rem);line-height:1.1;letter-spacing:.01em;color:var(--gold-hi)}
.about__text{max-width:62ch}
.about__text p{margin:0 0 16px;color:var(--ivory-2);line-height:1.6}
.about__text p:last-child{margin-bottom:0}
@media (max-width:900px){.about__in{grid-template-columns:1fr}}
/* 16.10.2026, «Музеи проекта» — продолжение «О проекте» (макет mockups/museum-map-20261015/m2x): те же колонки 5:7 —
   слева заголовок, справа города; ниже, в рамке, музеи выбранного города */
.mu{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:30px clamp(28px,6vw,110px);margin-top:clamp(64px,9vh,100px);
  padding-top:clamp(48px,7vh,72px);border-top:1px solid rgba(194,155,92,.2);scroll-margin-top:24px}
.mu__t{margin:0;font-family:var(--display);font-stretch:75%;font-weight:200;text-transform:uppercase;letter-spacing:.01em;
  font-size:clamp(1.9rem,3.3vw,3.1rem);line-height:1.05;color:var(--ivory)}
.mu__t::after{content:"";display:block;width:84px;height:1px;background:var(--gold);margin-top:22px}
.mu-cities{display:flex;flex-wrap:wrap;gap:6px 26px;align-self:start;margin-top:6px}
.mu-cities button{font:inherit;font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--ivory-2);background:none;border:0;
  border-bottom:1px solid transparent;padding:10px 0;text-align:left;cursor:pointer;transition:color .3s,border-color .3s}
.mu-cities button:hover{color:var(--gold-hi)}
.mu-cities button[aria-pressed="true"]{color:var(--gold-hi);border-bottom-color:var(--gold)}
.mu-panels{grid-column:1/-1;margin-top:18px;padding:clamp(22px,2.6vw,34px) clamp(20px,2.8vw,38px) clamp(10px,1.4vw,18px);
  border:1px solid rgba(194,155,92,.4);background:rgba(58,27,40,.55)}
.mu-panel[hidden]{display:none}
.mu-panel+.mu-panel{margin-top:30px}   /* без скрипта видны все города подряд */
.mu-city__t{margin:0;font-family:var(--display);font-stretch:75%;font-weight:300;font-size:clamp(1.7rem,2.3vw,2.1rem);line-height:1.05;
  text-transform:uppercase;letter-spacing:.04em;color:var(--gold-hi)}
.mu-city__reg{font-family:var(--text);font-stretch:normal;font-size:.95rem;letter-spacing:0;text-transform:none;color:var(--muted);white-space:nowrap}
.mu-city__meta{margin:8px 0 6px;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.mu-ms{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr));gap:0 clamp(28px,4vw,60px);list-style:none;margin:4px 0 0;padding:0}
.mu-m{padding:18px 0 6px}
.mu-m__t{margin:0;font-family:var(--display);font-stretch:75%;font-weight:300;font-size:1.36rem;line-height:1.18;letter-spacing:.01em;color:var(--ivory)}
.mu-addr{margin-top:8px}
.mu-addr+.mu-addr{margin-top:18px}
.mu-addr__t{margin:0;color:var(--gold-hi);font-size:1rem;line-height:1.45}
.mu-m__h{list-style:none;margin:10px 0 12px;padding:0;color:var(--ivory-2);line-height:1.6}
.mu-m__h li{margin:0 0 4px}
.mu-m__h a{text-decoration:none;border-bottom:1px solid var(--gold-lo);white-space:nowrap;transition:color .3s,border-color .3s}
.mu-m__h a:hover{color:var(--gold-hi);border-color:var(--gold)}
/* своя схема городов (16.10): справа от заголовка и городов, точки по координатам на градусной сетке, без подложки */
.mu{grid-template-rows:auto 1fr auto}
.mu__t{grid-column:1;grid-row:1}
.mu-mapbox{grid-column:2;grid-row:1/span 2;padding:clamp(14px,2vw,26px) clamp(14px,2vw,28px);border:1px solid rgba(194,155,92,.38);
  background:radial-gradient(80% 85% at 42% 48%,rgba(84,40,58,.78) 0%,rgba(58,27,40,.6) 55%,rgba(46,21,32,.5) 100%)}
.mu-cities{grid-column:1;grid-row:2;margin-top:0}
.mu-panels{grid-row:3}
.mu-map{display:block;width:100%;height:auto;overflow:visible}
.mu-map--mob{display:none}
.mu-grat polyline{fill:none;stroke:rgba(226,196,140,.24);stroke-width:1;vector-effect:non-scaling-stroke}
.mu-inset rect{fill:rgba(194,155,92,.05);stroke:rgba(194,155,92,.45);stroke-width:1;vector-effect:non-scaling-stroke}
.mu-inset__t{fill:var(--muted);font-family:var(--text);letter-spacing:.2em;text-transform:uppercase}
.mu-pt{cursor:pointer;text-decoration:none}
.mu-pt__hit{fill:transparent}
.mu-pt__ring{fill:none;stroke:rgba(226,196,140,.5);stroke-width:1;transition:stroke .3s}
.mu-pt__dot{fill:var(--gold);transition:fill .3s}
.mu-pt text{fill:var(--ivory);font-family:var(--text);paint-order:stroke;stroke:#3a1b28;stroke-width:3px;stroke-linejoin:round;transition:fill .3s}
.mu-pt:hover .mu-pt__dot,.mu-pt.is-on .mu-pt__dot{fill:var(--gold-hi)}
.mu-pt:hover .mu-pt__ring,.mu-pt.is-on .mu-pt__ring{stroke:var(--gold-hi)}
.mu-pt:hover text,.mu-pt.is-on text{fill:var(--gold-hi)}
.mu-pt:focus{outline:none}
.mu-pt:focus-visible .mu-pt__ring{stroke:var(--gold-hi);stroke-width:2}
@media (max-width:900px){.mu{grid-template-columns:1fr;grid-template-rows:none}.mu>*{grid-column:auto;grid-row:auto}
  .mu__t{order:1}.mu-mapbox{order:2}.mu-cities{order:3}.mu-panels{order:4}}
@media (max-width:760px){.mu-mapbox{margin-inline:calc(-1 * var(--gutter));padding:10px 0;border-inline:0}
  .mu-map--desk{display:none}.mu-map--mob{display:block}}
@media (max-width:760px){
  .mu-cities{gap:0 20px}
  .mu-cities button{font-size:12px;letter-spacing:.14em;padding:12px 0}
  .mu-panels{margin-inline:calc(-1 * var(--gutter));padding:22px var(--gutter) 8px;border-inline:0}
  .mu-m__t{font-size:1.22rem}
}
.filters{display:flex;flex-wrap:wrap;gap:6px 26px}
.filters button{font:inherit;font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--ivory-2);background:none;border:0;padding:8px 0;cursor:pointer;
  border-bottom:1px solid transparent;transition:color .3s,border-color .3s}
.filters button:hover{color:var(--gold-hi)}
.filters button[aria-pressed="true"]{color:var(--gold-hi);border-color:var(--gold)}
.wall{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr));gap:80px clamp(28px,3.4vw,56px);margin:64px 0 0;padding:0;list-style:none}
.piece{position:relative}
.piece[hidden]{display:none}
.piece::before{content:"";position:absolute;left:50%;top:-90px;width:150%;height:115%;transform:translateX(-50%);pointer-events:none;
  background:radial-gradient(46% 42% at 50% 34%,rgba(240,196,160,.13),transparent 72%)}
.piece a{position:relative;display:block;text-decoration:none}
.piece .gilt__in>img{aspect-ratio:4/5;transition:transform 1.1s var(--ease),filter .8s var(--ease);filter:saturate(.9) brightness(.94)}
.piece a:hover .gilt__in>img,.piece a:focus-visible .gilt__in>img{transform:scale(1.045);filter:saturate(1) brightness(1)}
.piece .play{opacity:0;transition:opacity .5s var(--ease)}
.piece a:hover .play,.piece a:focus-visible .play{opacity:1}
.label{margin-top:22px;padding-top:14px;border-top:1px solid rgba(194,155,92,.28)}  /* этикетка под рамой */
.label h3{margin:0 0 7px;font-family:var(--display);font-stretch:75%;font-weight:300;font-size:clamp(1.45rem,1.8vw,1.8rem);line-height:1.08;letter-spacing:.01em}
.label p{margin:0;color:var(--gold-hi);display:flex;flex-wrap:wrap;gap:2px 10px}
.label p span+span::before{content:"·";margin-right:10px}
.piece--soon .label p{color:var(--muted)}

/* ---------- страница героя ---------- */
.hero-page{overflow-x:clip;padding:110px var(--gutter) 90px;background:radial-gradient(80% 50% at 50% 0%,var(--plum) 0%,var(--night) 70%)}
.crumbs{margin:0 0 36px}
.crumbs a{color:var(--ivory-2);text-decoration:none;border-bottom:1px solid var(--gold-lo)}
.hero-page h1{margin:0 0 12px;font-size:clamp(2.6rem,6vw,5.2rem);line-height:.98}
.meta{margin:0 0 40px;color:var(--gold-hi);display:flex;flex-wrap:wrap;gap:4px 12px}
.meta span:not(:last-child)::after{content:"·";margin-left:12px}   /* точка — в конце строки, а не в начале следующей (06.10) */
.player{max-width:1120px;--frame-w:clamp(16px,2.2vw,34px)}
.player .screen__video{margin:6px}
.player__stub{position:relative;aspect-ratio:16/9;margin:6px;display:grid;place-items:center;background:#000 url(img/drape.webp) center/contain no-repeat}
.player__stub .btn{position:relative;z-index:1}
.story{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:clamp(32px,6vw,90px);max-width:1120px;margin-top:56px}
.lede{margin:0 0 30px;font-family:var(--display);font-stretch:75%;font-weight:300;font-size:clamp(1.5rem,2.2vw,2.1rem);line-height:1.2}
.story h2{margin:0 0 16px;font-family:var(--display);font-stretch:75%;font-weight:300;text-transform:uppercase;letter-spacing:.06em;font-size:1.35rem;color:var(--gold-hi)}
.facts{margin:0;padding:0;list-style:none;display:grid;gap:18px}
.facts li{padding-left:26px;position:relative;color:var(--ivory-2)}
.facts li::before{content:"";position:absolute;left:0;top:.62em;width:9px;height:9px;transform:rotate(45deg);background:var(--gold)}
/* «Узнайте героя ближе» — финальная карточка выпуска: куда сходить, что почитать */
/* «К экзамену»: настоящее задание ФИПИ, текст произведения и квиз.
   Селекторы с префиксом .prep — иначе их перебивает общее правило .bio p (пойманный баг 23.09). */
.prep{margin:44px 0 0}
.prep > h3{margin:0 0 12px!important}
.prep .prep__lede{margin:0 0 26px;color:var(--ivory-2)}
.task{border:1px solid rgba(194,155,92,.35);background:rgba(18,10,14,.5);padding:24px 26px;margin:0 0 16px}
.prep .task__tag{margin:0 0 14px;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}
/* условие задания — шрифтом и кеглем справки (06.10): узкий дисплейный шрифт на длинном условии читался тяжело */
.prep .task__q{margin:0;line-height:1.5;color:var(--ivory)}
.task .qa__doc{margin-top:16px}
.task details{margin:18px 0 0}
.task summary{cursor:pointer;font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);
  list-style:none;display:inline-flex;align-items:center;gap:9px}
.task summary::-webkit-details-marker{display:none}
.task summary::before{content:"";width:12px;height:12px;border:1px solid var(--gold-lo);
  background:radial-gradient(circle at 50% 38%,var(--gold) 0 2px,transparent 2.2px)}
.task details[open] summary{color:var(--muted)}
.prep .task__hint{margin:16px 0 0;color:var(--ivory-2);font-size:.97em;line-height:1.55}
/* оговорка — отдельно от разбора, за тонкой линией */
.prep .task__hint--mark{margin-top:22px;padding-top:16px;border-top:1px solid rgba(194,155,92,.2);
  color:var(--muted);font-size:.9rem;line-height:1.5}
.prep .prep__from{margin:12px 0 0;font-size:.86rem;line-height:1.5;color:var(--muted)}

/* текст произведения */
.poem{margin:20px 0 0;padding:20px 22px;border-left:2px solid var(--gold-lo);background:rgba(58,27,40,.25)}
.prep .poem__t{margin:0 0 14px;font-family:var(--display);font-stretch:75%;font-weight:300;font-size:1rem;
  text-transform:uppercase;letter-spacing:.08em;color:var(--gold-hi)}
.poem__b{color:var(--ivory);line-height:1.7}
.poem__b span{display:block}
.poem__b br{display:block;content:"";height:.8em}
/* примечание к тексту — за линией, чтобы не сливалось со стихом */
.prep .poem__n{margin:18px 0 0;padding-top:14px;border-top:1px solid rgba(194,155,92,.22);
  font-size:.86rem;line-height:1.5;color:var(--muted)}

/* квиз */
.quiz{margin:26px 0 0}
.prep .quiz__q{margin:0 0 14px;color:var(--gold-hi)}
.quiz__opts{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.quiz__opts button{display:block;width:100%;text-align:left;font:inherit;font-size:.95em;line-height:1.45;color:var(--ivory-2);
  background:none;border:1px solid var(--gold-lo);padding:12px 15px;cursor:pointer;transition:border-color .25s,color .25s}
.quiz__opts button:hover:not(:disabled){border-color:var(--gold);color:var(--ivory)}
.quiz__opts button:disabled{cursor:default}
.quiz__opts button.is-ok{border-color:var(--gold);color:var(--gold-hi)}
.quiz__opts button.is-no{border-color:rgba(143,29,42,.8);color:var(--muted);text-decoration:line-through}
/* варианты с номерами — как в задании ФИПИ; задание с несколькими пропусками проходим по буквам (05.10) */
.quiz--num .quiz__opts{counter-reset:opt}
.quiz--num .quiz__opts li{counter-increment:opt}
.quiz--num .quiz__opts button::before{content:counter(opt) ") ";color:var(--gold)}
.quiz--num .quiz__opts button.is-no::before{color:inherit}
.gap.is-now,.pos.is-now{color:var(--gold-hi)}
.pos{display:block;margin-top:6px}
.pos__sep{display:none}
.pos__ans{font-style:normal;color:var(--gold-hi)}
.gap.is-filled{font-style:normal;color:var(--gold-hi);border-bottom:1px solid var(--gold-lo)}
.prep .quiz__sum{margin:16px 0 0;color:var(--ivory)}
.quiz__next{display:inline-block;margin-top:18px;font:inherit;font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-hi);
  background:none;border:1px solid var(--gold);padding:13px 18px;cursor:pointer;transition:background .25s}
.quiz__next[hidden]{display:none}
.quiz__next:hover,.quiz__next:focus-visible{background:rgba(143,29,42,.5)}
/* разбор — отступ и отбивка слева, чтобы не читался как ещё один вариант */
.prep .quiz__explain{margin:20px 0 0;padding-left:15px;border-left:2px solid var(--gold-lo);
  color:var(--ivory-2);font-size:.97em;line-height:1.55}

/* метки героя: предмет и класс, ОГЭ/ЕГЭ — сама метка ведёт к источнику */
.marks{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 0;padding:0;list-style:none}
.marks a{display:block;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-hi);
  border:1px solid var(--gold-lo);padding:6px 12px;text-decoration:none}
.marks a:hover{border-color:var(--gold);color:var(--ivory)}
.marks .marks__exam a{color:var(--night);background:var(--gold);border-color:var(--gold)}
.marks .marks__exam a:hover{background:var(--gold-hi);color:var(--night)}
/* «В школе» — одна строка, без рамки: класс уже назван меткой, здесь только что читать */
.bio .school{margin:34px 0 0;padding-left:16px;border-left:2px solid var(--gold-lo);color:var(--ivory-2);font-size:.97rem}
.school b{color:var(--gold-hi);font-weight:400}
/* кнопки «К ОГЭ/ЕГЭ» отделены от сфер и выделены золотом — это другой вопрос, не жанр */
.filters__exam{color:var(--gold)}
.filters__group{display:flex;gap:26px;margin-left:14px;padding-left:26px;border-left:1px solid rgba(194,155,92,.35)}
@media(max-width:560px){.filters__group{margin-left:0;padding-left:0;border-left:0;width:100%}}
/* «Узнайте ближе» (05.10, правка команды «тяжело читается»): описание — кеглем и интервалом справки;
   адрес с пометками — под кнопкой «На карте»; номера пунктов — счётчик */
.closer{padding:30px 30px 16px;border:1px solid rgba(194,155,92,.4);background:rgba(58,27,40,.5);margin-bottom:26px}
.closer > h2{margin:0 0 4px!important;line-height:1.2}
.closer ol{list-style:none;margin:0;padding:0;counter-reset:closer}
.closer li{padding:24px 0 14px;border-top:1px solid rgba(194,155,92,.24);counter-increment:closer}
.closer li:first-child{border-top:0;padding-top:20px}
.closer__t{margin:0!important;display:flex;align-items:baseline;gap:12px;font-family:var(--display);font-stretch:75%;font-weight:300;font-size:1.5rem;line-height:1.2;color:var(--ivory)}
.closer__t::before{content:counter(closer);flex:none;color:var(--gold)}
.closer__where{margin:9px 0 0!important;font-size:1rem;line-height:1.4;color:var(--gold-hi)}
.closer__d{margin:10px 0 0!important;color:var(--ivory-2)}
.closer__addr{margin:3px 0 0!important;font-size:.92rem;line-height:1.5;color:var(--muted)}
@media (max-width:760px){.closer{padding:24px 22px 12px}.closer__t{font-size:1.36rem}}
.closer__more{margin-top:2px}
.closer__more summary{cursor:pointer;font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);
  list-style:none;display:inline-flex;align-items:baseline;gap:9px;padding:9px 0}
.closer__more summary::-webkit-details-marker{display:none}
.closer__more summary::before{content:"";align-self:center;width:12px;height:12px;border:1px solid var(--gold-lo);
  background:radial-gradient(circle at 50% 38%,var(--gold) 0 2px,transparent 2.2px)}
.closer__more[open] summary{color:var(--muted)}
.closer__link{display:inline-block;margin-top:1px;padding:10px 0;font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);text-decoration:none}
.closer__link:hover,.closer__link:focus-visible{color:var(--gold-hi);text-decoration:underline}
.closer__map{margin-top:12px;aspect-ratio:16/9;border:1px solid rgba(194,155,92,.35);background:var(--wall)}
.closer__map iframe{display:block;width:100%;height:100%;border:0}
.museum{padding:26px 28px;border:1px solid rgba(194,155,92,.35);background:rgba(18,10,14,.5)}
.museum p{margin:0;color:var(--ivory-2)}
.museum__place{margin-top:16px!important}
.museum__place b{font-weight:400;color:var(--gold-hi)}
.museum__remark{color:var(--muted)}
.museum__map{margin-top:18px;aspect-ratio:4/3;border:1px solid rgba(194,155,92,.35);background:var(--wall)}
.museum__map iframe{display:block;width:100%;height:100%;border:0}
/* ссылка на выпуск в соцсети — под плеером */
.source{margin:14px 0 0;color:var(--muted);font-size:.85rem}
.more{margin-top:90px}
.more .wall{grid-template-columns:repeat(auto-fill,minmax(min(100%,170px),1fr));gap:48px 28px;margin-top:36px}
.more .label h3{font-size:1.25rem}

footer{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px 40px;padding:40px var(--gutter) 56px;border-top:1px solid rgba(194,155,92,.2);color:var(--muted);background:var(--wall)}


/* справка о герое: ФИО, годы, кратко, в школе, экзамены, характеристика, источники */
.story--bio{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}
.bio__head{padding-bottom:20px;margin-bottom:26px;border-bottom:1px solid rgba(194,155,92,.3)}
.story .bio__name{margin:0;font-size:clamp(1.9rem,3vw,2.6rem);text-transform:none;letter-spacing:0;color:var(--ivory);line-height:1.1}
.bio__years{margin:8px 0 0;font-family:var(--display);font-stretch:75%;font-size:1.5rem;color:var(--gold-hi)}
.bio h3{margin:40px 0 14px;font-family:var(--display);font-stretch:75%;font-weight:300;text-transform:uppercase;letter-spacing:.06em;font-size:1.35rem;color:var(--gold-hi)}
.bio__head+h3{margin-top:0}
.bio .roles{margin:14px 0 0;font-size:.85rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);line-height:1.6}
.bio p{margin:0 0 16px;color:var(--ivory-2)}
.bio p a.xref{color:inherit;text-decoration:underline;text-decoration-color:rgba(194,155,92,.55);text-decoration-thickness:1px;text-underline-offset:3px}
.bio p a.xref:hover,.bio p a.xref:focus-visible{color:var(--gold-hi);text-decoration-color:currentColor}
.bio__school{padding:14px 18px;border:1px solid rgba(194,155,92,.35);background:rgba(58,27,40,.4)}
.bio__school b{font-weight:400;color:var(--gold-hi)}
.ref{font-size:.62em;line-height:0;margin-left:2px;white-space:nowrap}  /* 08.10: номера сносок «1, 3» не рвутся между строками */
.ref a{color:var(--gold);text-decoration:none}
/* текст задания ФИПИ (например, «найдите ошибки») — курсивом за линией */
.qa__doc{margin:0 0 16px;padding:0 0 0 16px;border-left:1px solid rgba(194,155,92,.35);color:var(--ivory-2)}
.bio .charact__need{padding:14px 18px;border:1px solid rgba(194,155,92,.35);background:rgba(58,27,40,.4)}
.charact dl{margin:18px 0 0;display:grid;grid-template-columns:150px 1fr;gap:12px 20px}
.charact dt{font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:var(--gold);padding-top:4px}
.charact dd{margin:0;color:var(--ivory-2)}
.side{align-self:start;position:sticky;top:24px}
/* «Коротко: вопросы и ответы» (08.10.2026, вариант Б — раскрывающиеся строки; ответы — предложения справки, tools/faq.py) */
.faq{max-width:1120px;margin-top:56px;padding-top:24px;border-top:1px solid rgba(194,155,92,.25)}
.faq h3{margin:0 0 22px;font-family:var(--display);font-stretch:75%;font-weight:300;text-transform:uppercase;letter-spacing:.06em;font-size:1.2rem;color:var(--gold-hi)}
.faq__rows{max-width:760px;border-top:1px solid rgba(194,155,92,.25)}
.faq__rows details{border-bottom:1px solid rgba(194,155,92,.25)}
.faq__rows summary{cursor:pointer;list-style:none;display:flex;align-items:baseline;gap:14px;padding:16px 0;
  font-family:var(--display);font-stretch:75%;font-weight:300;font-size:1.35rem;line-height:1.2;color:var(--ivory)}
.faq__rows summary::-webkit-details-marker{display:none}
.faq__rows summary::before{content:"";flex:none;width:9px;height:9px;transform:translateY(-2px) rotate(45deg);border:1px solid var(--gold);transition:background .15s}
.faq__rows details[open] summary::before{background:var(--gold)}
.faq__rows summary:hover{color:var(--gold-hi)}
.faq__rows p{margin:0;padding:0 0 18px 23px;color:var(--ivory-2);line-height:1.55}
.sources{max-width:1120px;margin-top:56px;padding-top:24px;border-top:1px solid rgba(194,155,92,.25)}
.sources h3{margin:0 0 14px;font-family:var(--display);font-stretch:75%;font-weight:300;text-transform:uppercase;letter-spacing:.06em;font-size:1.2rem;color:var(--gold-hi)}
.sources ol{margin:0;padding-left:22px;color:var(--muted);font-size:.9rem;display:grid;gap:8px}
.sources a{color:var(--gold-hi)}
.sources li:target{color:var(--ivory)}

/* невысокие окна: ужимаем текст, чтобы первый экран не рос при ответе и зал не прыгал */
@media (min-width:761px) and (max-height:860px){
  .riddle{padding:70px var(--gutter)}
  .riddle__q{font-size:clamp(1.6rem,2.6vw,2.4rem);margin-bottom:22px}
  .explain{margin-bottom:18px}
  .ask{margin-bottom:16px}
}

/* ---------- команда проекта ---------- */
.team__list{list-style:none;margin:40px 0 0;padding:0;display:grid;gap:22px;grid-template-columns:repeat(5,1fr)}   /* 06.10 (ночь): пятеро — в ряд на широком экране */
@media (min-width:1280px){.person__text{padding:18px 18px 22px}.person__name{font-size:clamp(1.35rem,1.75vw,1.7rem)}.person__role{font-size:.72rem;letter-spacing:.1em}}
@media (max-width:1279px){.team__list{grid-template-columns:repeat(3,1fr);gap:28px}}
@media (max-width:1100px){.team__list{grid-template-columns:repeat(2,1fr)}}   /* 06.10: четверо — в ряд, два на два или столбцом, без одинокой карточки */
@media (max-width:560px){.team__list{grid-template-columns:1fr}}
.person{border:1px solid rgba(194,155,92,.28);background:rgba(58,27,40,.35);overflow:hidden}
.person__photo{display:block;width:100%;height:auto;filter:saturate(.85) contrast(1.03)}
.person__text{padding:22px 26px 26px}
.person__name{margin:0;font-family:var(--display);font-stretch:75%;font-weight:300;font-size:clamp(1.5rem,2.1vw,1.95rem);line-height:1.1}
.person__role{margin:10px 0 0;font-size:.78rem;letter-spacing:.12em;color:var(--gold-hi)}
.person__org{margin:12px 0 0;color:var(--ivory-2)}
.person__line{margin:10px 0 0;color:var(--muted)}
/* 03.11: «Команда производства» — подзаголовок группы без ролей; приём как у «Музеи проекта» (.mu__t), но мельче заголовка страницы */
.team__sub{margin:clamp(48px,7vh,72px) 0 0;padding-top:clamp(36px,5vh,48px);border-top:1px solid rgba(194,155,92,.2);font-family:var(--display);font-stretch:75%;font-weight:200;
  text-transform:uppercase;letter-spacing:.01em;font-size:clamp(1.6rem,2.6vw,2.4rem);line-height:1.05;color:var(--ivory)}
.team__sub::after{content:"";display:block;width:84px;height:1px;background:var(--gold);margin-top:20px}
.team__sub+.team__list{margin-top:32px}
footer a{color:var(--ivory-2);text-decoration:none;border-bottom:1px solid var(--gold-lo)}
.foot__links{display:flex;flex-wrap:wrap;gap:10px 32px}  /* 08.10: «Команда проекта» и каналы проекта — одной группой */
footer a:hover{color:var(--gold-hi)}

/* зона нажатия не меньше 24 px (06.10): невидимое поле вокруг мелких ссылок, вид не меняется */
.crumbs a,a.brand,.riddle-hero__foot a,.person__org a{position:relative}
.crumbs a::after,a.brand::after,.riddle-hero__foot a::after,.person__org a::after{content:"";position:absolute;inset:-9px -6px}
/* планшет: правая колонка слишком узкая — складываем страницу героя в одну колонку раньше (06.10) */
@media (max-width:900px){.story,.story--bio{grid-template-columns:1fr}.side{position:static}}
/* невысокий широкий экран: плеер целиком помещается в первый экран (06.10) */
@media (min-width:761px) and (max-height:1000px){
  /* 06.10, выбор владельца («вариант 1»): на невысоком экране шапка сжимается по высоте окна, и плеер занимает всё, что осталось до низа экрана.
     60px — строки «← Все выпуски» и подзаголовка с отступом заголовка; 34px — рама плеера; 16px — запас снизу. */
  .hero-page{--pt:clamp(80px,11svh,110px);--cm:clamp(12px,2.6svh,36px);--h1:clamp(2.6rem,min(6vw,8.4svh),5.2rem);--mm:clamp(14px,3svh,40px);padding-top:var(--pt)}
  .hero-page .crumbs{margin-bottom:var(--cm)}
  .hero-page h1{font-size:var(--h1)}
  .hero-page .meta{margin-bottom:var(--mm)}
  .player{max-width:min(1120px,max(560px,calc((100svh - var(--pt) - var(--cm) - var(--h1)*.98 - var(--mm) - 110px)*16/9)))}
}
/* длинная фамилия в заголовке на узком телефоне (06.10) */
@media (max-width:400px){.hero-page h1.h1--long{font-size:min(2.6rem,10vw)}}
.task__note{margin:6px 0 0;color:var(--gold-hi);font-size:.92rem}
.lost{max-width:52ch;margin:28px 0 0;font-size:1.15rem;color:var(--ivory-2)}.lost a{color:var(--gold-hi)}

/* ---------- телефон ---------- */
@media (max-width:760px){
  .nav{display:none}
  .brand{font-size:13px;letter-spacing:.16em}
  /* на телефоне текст не кладём на картинку: сверху зал с занавесом, ниже — загадка на чистом фоне */
  .riddle-hero{display:block;min-height:0}
  .riddle-hero__visual{position:relative;height:clamp(340px,58svh,520px);background-image:url(img/hall-mobile-first.webp)}
  .riddle-hero__visual,.hall-after{background-position:var(--bg-pos,50% 45%)}
  .riddle-hero__visual::after{background:linear-gradient(180deg,rgba(14,7,10,.75) 0%,transparent 26%,transparent 70%,var(--night) 100%)}
  .riddle{width:auto;padding:12px var(--gutter) 40px}
  .answers{flex-direction:column}
  .answers .btn{justify-content:flex-start;text-align:left}
  .riddle-hero__foot{position:static;padding:0 var(--gutter) 36px;flex-direction:column;gap:8px}
  .filters{gap:4px 20px}   /* 06.10 (выбор владельца — вариант А): на телефоне все фильтры видны сразу, в несколько строк; раньше строка листалась вбок */
  .filters__group{width:auto;gap:20px;margin-left:0;padding-left:0;border-left:0}
  .gallery__head>div{width:100%}
  .wall{grid-template-columns:repeat(2,1fr);gap:48px 16px;margin-top:40px}
  .more .wall{grid-template-columns:repeat(2,1fr);gap:40px 16px}   /* «Другие герои» — тоже в две колонки (06.10) */
  .label{margin-top:16px}
  .label h3{font-size:1.25rem}
  .label p{flex-direction:column;letter-spacing:.14em}
  .label p span+span::before{content:none}
  .story{grid-template-columns:1fr}
  .charact dl{grid-template-columns:1fr;gap:4px}
  .charact dd{margin-bottom:10px}
  .side{position:static}
}
@media (prefers-reduced-motion:reduce){*{transition-duration:.01ms!important;animation:none!important}html{scroll-behavior:auto}}
/* 09.10: набор. Заголовки — строки равной длины, абзацы — без одинокого слова в последней строке (где браузер умеет); короткие слова к соседям привязывает сборка (typo) */
h1,h2,h3,.about__lead{text-wrap:balance}
p,li,dd,dt,summary,figcaption{text-wrap:pretty}