/* ОБРАМЛЕНИЕ СТРАНИЦЫ ГОСТЕВОЙ ПЕСОЧНИЦЫ (§10.4 п. 2, 7 ЧТЗ визуального редактора маршрутов
   v1.1; веха В-5). Отдельным листом, а не `<style>` в разметке: CSP страницы —
   `style-src 'self'`, встроенные стили она не исполнит.

   Изображений здесь нет ни одного и быть не может: `img-src 'none'` той же политики запрещает
   и `<img>`, и фон в стилях. Знак витрины — начертание имени. */

/* СТРАНИЦА — КОЛОНКА НА ВЫСОТУ ОКНА, А РЕДАКТОР В НЕЙ ТЯНЕТСЯ. Своя `height: 100vh` у редактора
   на этой странице означала бы окно ПЛЮС шапка витрины плюс текст границ: холст уезжал бы за
   нижний край ровно на их высоту, и первое, что видел бы гость, — полоса текста и обрезанный
   маршрут (замер браузером 10.09.2026). */
body.bm-pesocnica {
  margin: 0;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  font: 14px/1.45 system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  color: #16202c;
  background: #fff;
}

body.bm-pesocnica > #bm-editor-root { flex: 1; min-height: 0; display: flex; }
body.bm-pesocnica .bm-editor { flex: 1; height: auto; min-height: 0; }

.bm-shapka {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 10px 16px;
  border-bottom: 1px solid #d6dde5;
}

.bm-shapka__znak {
  font-size: 19px;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: #16202c;
  text-decoration: none;
}

.bm-shapka nav { display: flex; gap: 16px; }
.bm-shapka nav a { color: #2f6fd0; text-decoration: none; }
.bm-shapka nav a:hover { text-decoration: underline; }

.bm-granicy {
  margin: 0;
  padding: 10px 16px;
  border-bottom: 1px solid #d6dde5;
  color: #4a5566;
  background: #f5f8fb;
}

.bm-knopka-ssylka {
  display: inline-block;
  padding: 8px 16px;
  border-radius: 4px;
  color: #fff;
  background: #2f6fd0;
  text-decoration: none;
}

.bm-smotrovaya ol,
.bm-smotrovaya ul { padding-left: 22px; }
.bm-smotrovaya__id { margin-left: 8px; color: #6b7684; font-size: 12px; }
.bm-zaglushka { padding: 16px; }
.bm-zaglushka__nahodki li { margin-bottom: 8px; }
.bm-zaglushka__pravka { color: #4a5566; }

/* ЧТО ПОКАЗАНО, РЕШАЕТ ПРАВИЛО СТИЛЯ, А НЕ СКРИПТ (§10.4 п. 7). Скрипту здесь взяться неоткуда:
   встроенных скриптов на странице нет по политике, а собранный клиент к этой секунде ещё не
   загружен — и посетитель телефона видел бы пустой экран ровно до того мгновения, когда ему всё
   равно нечего было бы с ним делать.

   ДВА УСЛОВИЯ, А НЕ ОДНО: ширина < 1024 px И сенсорный ввод названы в ЧТЗ отдельно. Планшет в
   альбомной ориентации шире тысячи точек, но холст его пальцем не даётся; узкое окно на
   настольной машине — наоборот. */
.bm-zaglushka { display: none; }

@media (max-width: 1023px), (pointer: coarse) {
  /* СЕЛЕКТОР ТОТ ЖЕ, ЧТО У ПРАВИЛА ВЫШЕ, И ЭТО НЕ ЛИШНЕЕ СЛОВО. `body.bm-pesocnica >
     #bm-editor-root` тянет холст на всю высоту страницы и весит больше, чем голый
     `#bm-editor-root`: спрятать холст голым селектором не выходило — правило высоты
     перебивало его специфичностью, и на узком окне холст оставался показанным поверх
     заглушки. Найдено браузерным сторожем 11.09.2026, первым же его запуском. */
  body.bm-pesocnica > #bm-editor-root { display: none; }
  .bm-zaglushka { display: block; }
}

/* ПРОБА НАСТРОЙКИ ЗАДАЧИ (/platform/nastroyka, ЧТЗ «Настройка задачи» §13, веха Н-6).
   Страница серверная и скриптов не несёт, поэтому и прятать здесь нечего, кроме заглушки:
   форма работает на любом окне, а объявление §13 п. 7 про минимальную ширину — про УДОБСТВО,
   и на узком экране показывается тем же правилом, что у пробы редактора. */
.bm-proba-nastroyki { max-width: 980px; margin: 0 auto; padding: 16px; }
.bm-proba-dorisovano,
.bm-proba-zadaniya,
.bm-proba-itog { margin: 24px 0; padding: 16px; border: 1px solid #dde3ea; border-radius: 8px; background: #fbfcfd; }
.bm-proba-zadaniya ol { padding-left: 22px; }
.bm-proba-zadaniya li { margin-bottom: 12px; }
.bm-proba-ozhidanie { display: block; color: #4a5566; font-size: 13px; margin-top: 4px; }
.bm-proba-forma fieldset { margin: 16px 0; border: 1px solid #dde3ea; border-radius: 8px; padding: 12px 16px; }
.bm-proba-forma legend { font-weight: 650; padding: 0 6px; }
.bm-proba-pole { margin-bottom: 16px; }
.bm-proba-pole label { display: block; font-weight: 600; margin-bottom: 4px; }
.bm-proba-pole input,
.bm-proba-pole select,
.bm-proba-pole textarea { width: 100%; box-sizing: border-box; padding: 6px 8px; border: 1px solid #c9d2dc; border-radius: 6px; }
.bm-proba-pole textarea { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 13px; }
.bm-proba-pояснение { color: #4a5566; font-size: 13px; margin: 2px 0; }
.bm-proba-granica { color: #4a5566; font-size: 13px; margin: 4px 0 0; }
/* ПРИЧИНА ГРАНИЦЫ — НЕ МЕЛКИЙ ШРИФТ ВНИЗУ (§13 п. 4, §18.6): без неё первое задание пробы
   показывает гостю стену без объяснения, то есть ровно то, против чего затеян документ. */
.bm-proba-prichina { color: #1f6feb; font-size: 13px; margin: 4px 0 0; }
.bm-proba-nahodki,
.bm-proba-nedostayushchee { list-style: none; padding: 0; margin: 8px 0 0; }
.bm-proba-nahodki li { margin: 6px 0; padding: 8px 12px; border-left: 4px solid #c62828; background: #fff; border-radius: 4px; }
.bm-proba-nedostayushchee li { margin: 6px 0; color: #8a5a00; }
.bm-proba-ok { color: #1b7f4b; font-weight: 600; }
.bm-proba-nepolno { color: #8a5a00; font-weight: 600; }