/* Страница «Школы Москвы на карте». Без inline-стилей и внешних шрифтов (CSP); токены — как у site.css. */
@font-face{font-family:'Onest';font-style:normal;font-weight:100 900;font-display:swap;
  src:url(../fonts/Onest-cyrillic-normal.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Onest';font-style:normal;font-weight:100 900;font-display:swap;
  src:url(../fonts/Onest-latin-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}
:root{--g:#0b6e4f;--gl:#eef4f0;--ink:#18231f;--mut:#46534c;--line:#dbe5df;--bg:#f6f9f7}
*{box-sizing:border-box;margin:0;padding:0}
/* Страница «прибита» к окну: position:fixed убирает прокручиваемую область документа, поэтому шапку нельзя «увести» вверх
   ни прокруткой, ни фокусом, ни масштабом (раньше шапка и карточка уезжали за край окна). */
html,body{margin:0;padding:0;overflow:hidden;overscroll-behavior:none}
body{position:fixed;inset:0;font:15px/1.5 'Onest',system-ui,sans-serif;color:var(--ink);background:var(--bg);display:flex;flex-direction:column}
.top{flex:none;padding:12px 16px 10px;border-bottom:1px solid var(--line);background:#fff}
.top h1{font-size:20px;font-weight:700;line-height:1.25}
.top p{color:var(--mut);font-size:14px;margin-top:3px;max-width:75ch}
.top .show{margin-top:6px;font-size:13px}
.top .show a{margin-right:10px;white-space:nowrap}
a{color:var(--g)}
/* карта и карточка школы лежат в одном контейнере: карточка в фиксированном месте, не обрезается и не двигает карту */
.stage{position:relative;flex:1 1 0;min-height:0}
#map{position:absolute;inset:0;background:#e9eeea}
.card{position:absolute;z-index:1000;top:12px;right:12px;width:320px;max-width:calc(100% - 24px);max-height:calc(100% - 24px);overflow:auto;background:#fff;
  border-radius:14px;box-shadow:0 6px 24px rgba(0,0,0,.28);font-size:14px;line-height:1.45}
.card[hidden]{display:none}
.card .x{position:absolute;top:6px;right:6px;z-index:2;width:28px;height:28px;border:0;border-radius:50%;background:rgba(255,255,255,.92);
  color:var(--ink);font:20px/28px 'Onest',system-ui,sans-serif;cursor:pointer}
.card .x:hover{background:#fff}
.nojs{padding:16px}
.leaflet-container:focus-visible{outline:2px solid var(--g);outline-offset:-3px}
/* Карта спокойнее: плитки OSM приглушены, чтобы метки были главным на экране. */
.leaflet-tile-pane{filter:saturate(.3) contrast(.9) brightness(1.07)}

/* маркер: капля цвета платформы */
.pin{background:none;border:0}
.pin span{display:block;width:26px;height:26px;border-radius:50% 50% 50% 0;background:var(--pin,var(--g));
  border:3px solid #fff;box-shadow:0 2px 6px rgba(0,0,0,.35);transform:rotate(-45deg);transition:transform .15s}
.pin:hover span,.pin.on span{transform:rotate(-45deg) scale(1.15)}

/* содержимое карточки */
.pop a{color:var(--g)}
.pop .ph{position:relative;height:150px;background:var(--gl)}
.pop .ph img{display:block;width:100%;height:100%;object-fit:cover}
.pop .ph .cr{position:absolute;left:0;right:0;bottom:0;padding:2px 8px;font-size:10px;line-height:1.3;color:#fff;background:rgba(0,0,0,.45)}
.pop .ph .cr a{color:#fff}
.pop .body{padding:10px 14px 12px}
.pop h2{font-size:16px;font-weight:700;line-height:1.25}
.pop .adr{color:var(--mut);font-size:13px;margin:2px 0 6px}
.pop ul{list-style:none}
.pop li{padding:8px 0;border-top:1px solid var(--line)}
.pop .ttl{font-weight:600;text-decoration:none;display:block}
.pop .ttl:hover{text-decoration:underline}
.pop .meta{color:var(--mut);font-size:12px}
.pop .row{display:flex;align-items:center;gap:8px;margin-top:6px;flex-wrap:wrap}
.pop .ic{display:inline-block;width:24px;height:24px;border-radius:50%}
.pop .ic img{display:block;width:24px;height:24px}
.pop .ic:hover,.pop .ic:focus-visible{transform:scale(1.12)}
.pop .read{display:inline-flex;align-items:center;gap:6px;padding:3px 10px 3px 4px;border:1px solid var(--g);border-radius:999px;
  font-size:13px;font-weight:600;text-decoration:none}
.pop .read img{width:20px;height:20px;display:block}
.pop .read:hover{background:var(--gl)}
@media (max-width:520px){
  .top h1{font-size:18px}
  .card{top:auto;right:8px;left:8px;bottom:8px;width:auto;max-height:60%}
  .pop .ph{height:110px}
}

/* поиск школы: крупное поле поверх карты (как в картографических сервисах), лупа, «×», подсказка клавиши «/» */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.search{position:absolute;z-index:1300;top:12px;left:12px;width:min(440px,calc(100% - 24px))}
.search .mag{position:absolute;left:14px;top:13px;color:var(--g);pointer-events:none}
.search input{width:100%;height:48px;padding:0 44px 0 46px;border:2px solid var(--g);border-radius:14px;background:#fff;color:var(--ink);
  font:16px/1.2 'Onest',system-ui,sans-serif;box-shadow:0 4px 18px rgba(0,0,0,.22)}
.search input::placeholder{color:#5d6b64;opacity:1}
.search input::-webkit-search-cancel-button,.search input::-webkit-search-decoration{-webkit-appearance:none;appearance:none}
.search input:focus-visible{outline:3px solid rgba(11,110,79,.35);outline-offset:1px}
.search .clr{position:absolute;right:6px;top:6px;width:36px;height:36px;border:0;border-radius:50%;background:transparent;color:var(--mut);
  font:24px/36px 'Onest',system-ui,sans-serif;cursor:pointer}
.search .clr:hover{background:var(--gl);color:var(--ink)}
.search .clr[hidden],.search .kbd[hidden]{display:none}
.search .kbd{position:absolute;right:12px;top:12px;min-width:24px;height:24px;padding:0 6px;border:1px solid var(--line);border-radius:6px;background:var(--gl);
  color:var(--mut);font:13px/22px 'Onest',system-ui,sans-serif;text-align:center}
@media (hover:none){.search .kbd{display:none}}
#results{position:absolute;left:0;right:0;top:54px;max-height:min(60vh,420px);overflow:auto;list-style:none;background:#fff;border:1px solid var(--line);
  border-radius:14px;box-shadow:0 8px 28px rgba(0,0,0,.25)}
#results[hidden]{display:none}
#results li{padding:10px 14px;cursor:pointer;border-top:1px solid var(--line)}
#results li:first-child{border-top:0}
#results li[aria-selected="true"],#results li:hover{background:var(--gl)}
#results .n{font-weight:600}
#results .a{display:block;color:var(--mut);font-size:12px}
#results .none{color:var(--mut);cursor:default}
#results .none:hover{background:#fff}
/* найденная школа: метка слегка «подпрыгивает» */
.pin.hit span{animation:hit .7s ease-in-out 3}
@keyframes hit{0%,100%{transform:rotate(-45deg) scale(1)}50%{transform:rotate(-45deg) scale(1.45)}}
@media (prefers-reduced-motion:reduce){.pin.hit span{animation:none;transform:rotate(-45deg) scale(1.3)}}

/* школа из нескольких зданий: общий цвет, номер на метке, список зданий в одной карточке */
.pin b{display:block;transform:rotate(45deg);width:20px;height:20px;font:700 12px/20px 'Onest',system-ui,sans-serif;color:#fff;text-align:center}
.pop .bl{list-style:none;margin:4px 0 6px}
.pop .bl li{border-radius:10px}
.pop .bl li.on{background:var(--gl)}
.pop .bl .b{display:flex;gap:8px;align-items:flex-start;width:100%;padding:5px 6px;border:0;background:none;text-align:left;cursor:pointer;font:inherit;color:inherit;border-radius:10px}
.pop .bl .b:hover{background:var(--gl)}
.pop .bl .num{flex:none;width:20px;height:20px;border-radius:50%;background:var(--g);color:#fff;font-size:12px;font-weight:700;line-height:20px;text-align:center}
.pop .bl .tx{display:block;min-width:0}
.pop .bl .l{display:block;font-weight:600;font-size:13px}
.pop .bl .a{display:block;color:var(--mut);font-size:12px}

/* число под значком площадки */
.pop .pl{display:inline-flex;flex-direction:column;align-items:center;gap:1px}
.pop .cnt{font-size:11px;line-height:1.1;color:var(--mut);white-space:nowrap}
.pop .stn{margin-top:8px;padding-top:8px;border-top:1px solid var(--line);color:var(--mut);font-size:11px;line-height:1.4}
/* названия школ прямо на карте */
.leaflet-tooltip.lbl{background:rgba(255,255,255,.92);border:0;border-radius:6px;box-shadow:0 1px 4px rgba(0,0,0,.25);color:#1d2b24;font:600 12px/1.2 'Onest',system-ui,sans-serif;padding:2px 6px;pointer-events:none;white-space:nowrap}
.leaflet-tooltip.lbl::before{display:none}
.search .kbd,.search .clr{z-index:1}

#map.nolbl .leaflet-tooltip.lbl{display:none}

/* краткое «о чём» и темы выпуска с таймкодами */
.pop .sum{margin-top:6px;color:var(--mut);font-size:12.5px;line-height:1.4}
.pop .tc{margin-top:6px;font-size:12.5px}
.pop .tc summary{cursor:pointer;color:var(--g);font-weight:600;padding:2px 0}
.pop .tc ol{list-style:none;margin-top:4px;max-height:210px;overflow:auto}
.pop .tc li{margin:0}
.pop .tc a{display:flex;gap:8px;padding:3px 0;text-decoration:none;color:var(--ink);line-height:1.3}
.pop .tc a:hover{text-decoration:underline}
.pop .tc .t{flex:none;min-width:3.6em;color:var(--mut);font-variant-numeric:tabular-nums}
/* «Страница школы» и «Поделиться» — значки справа от названия */
.pop .hd{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
.pop .tools{display:flex;gap:6px;flex:none;margin:-2px -4px 0 0}
.pop .tb{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border:2px solid var(--g);border-radius:50%;background:#fff;cursor:pointer;padding:0}
.pop .tb:hover,.pop .tb:focus-visible{background:var(--gl)}
.pop .tb img{display:block;width:22px;height:22px}
.pop .tb{position:relative}
.pop .tb[data-tip]::after{content:attr(data-tip);position:absolute;top:46px;right:0;z-index:3;padding:5px 10px;border-radius:8px;background:var(--ink);color:#fff;
  font:600 12px/1.3 'Onest',system-ui,sans-serif;white-space:nowrap;pointer-events:none}
.pop .tools.on-photo{position:absolute;top:8px;left:8px;margin:0;z-index:2}
.pop .tools.on-photo .tb{width:38px;height:38px;border-color:rgba(255,255,255,.95);background:rgba(255,255,255,.94);box-shadow:0 1px 4px rgba(0,0,0,.35)}
.pop .tools.on-photo .tb:hover{background:#fff}
.pop .tools.on-photo .tb[data-tip]::after{right:auto;left:0;top:44px}
