/* blox37 #6 — экран согласия на обработку персональных данных.
   Это ЭКРАН (живёт в #view), а не модалка: тем самым он не может «не поместиться» — самый
   переподанный баг проекта (skill §3, G1v) относится к окнам, а страница просто прокручивается.
   Прокручивается страница, но НЕ текст согласия: у текста своя ограниченная область (.cs-scroll),
   потому что именно её докрутка до конца открывает кнопку «Согласен». */

.cs-wrap{max-width:760px;margin:0 auto;padding:14px 12px 40px}

.cs-head{margin-bottom:12px}
.cs-title{font-size:20px;font-weight:800;line-height:1.25;color:var(--ink-strong)}
.cs-sub{margin-top:6px;font-size:14px;font-weight:600;color:var(--muted-strong);line-height:1.45}
.cs-ver{margin-top:4px;font-size:12px;font-weight:600;color:var(--muted)}

/* Ограниченная область чтения. dvh (не vh) — иначе адресная строка мобильного браузера
   съедает низ и «конец текста» оказывается недостижим. min() держит её разумной на десктопе. */
.cs-scroll{
  height:min(52dvh, 460px);
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--card);
  padding:16px 18px;
  box-shadow:var(--sh-inset);
}
/* Длинные слова, адреса и реквизиты не должны распирать страницу вбок (skill §3). */
.cs-scroll,.cs-scroll *{overflow-wrap:anywhere}

.cs-scroll h3{margin:18px 0 6px;font-size:15px;font-weight:800;color:var(--ink-strong);line-height:1.3}
.cs-scroll h3:first-child{margin-top:0}
.cs-scroll p{margin:0 0 10px;font-size:14px;line-height:1.55;color:var(--ink)}
.cs-scroll ul{margin:0 0 10px;padding-left:20px}
.cs-scroll li{font-size:14px;line-height:1.55;color:var(--ink);margin-bottom:4px}
.cs-scroll strong{font-weight:800;color:var(--ink-strong)}

/* Подсказка «долистайте» — гаснет, как только текст дочитан. Прячем классом с display:none,
   а не атрибутом hidden (skill §7: display в CSS сильнее hidden). */
.cs-note{margin-top:8px;font-size:13px;font-weight:700;color:var(--alert);
  display:flex;align-items:center;gap:6px;min-height:20px}
.cs-note.cs-off{display:none}
.cs-note svg{width:16px;height:16px}

/* Форма подписанта. Появляется вместе с кнопкой — до конца текста подписывать нечего. */
.cs-form{margin-top:14px;display:none}
.cs-form.cs-on{display:block}
.cs-form .mgr-field{max-width:none}
/* ≥16px обязательно: ниже этого iOS Safari зумит страницу и обратно уже не отматывает (skill §3). */
.cs-form .mgr-field input{font-size:16px;padding:10px 12px;border-radius:10px;min-height:44px}
.cs-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}
@media (max-width:520px){ .cs-grid{grid-template-columns:1fr} }

.cs-err{margin:4px 0 10px;font-size:13px;font-weight:700;color:var(--alert);
  display:flex;align-items:center;gap:6px}
.cs-err svg{width:16px;height:16px}

/* 24px между «Согласен» и «Не согласен» — это не вкус, а WCAG 2.5.8 (G8): у двух соседних
   целей с ПРОТИВОПОЛОЖНЫМ смыслом промах пальцем стоит дорого. */
.cs-actions{margin-top:14px;display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px}
.cs-no{background:none;border:none;padding:8px 4px;min-height:44px;cursor:pointer;
  font:inherit;font-size:14px;font-weight:700;color:var(--muted-strong);text-decoration:underline}
.cs-no:hover{color:var(--ink)}

/* blox38 #1 — ворота стали двухшаговыми: сперва данные ребёнка, потом текст. Номер шага говорит,
   что экран не последний, и объясняет, почему кнопки «Согласен» тут ещё нет. */
.cs-step{font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin-bottom:4px}
/* «Исправить данные ребёнка» — 44px высоты (G8): промах по ней уводит с прочитанного текста. */
.cs-fix{margin-top:8px;background:none;border:none;padding:8px 0;min-height:44px;cursor:pointer;
  font:inherit;font-size:13px;font-weight:700;color:var(--muted-strong);text-decoration:underline}
.cs-fix:hover{color:var(--ink)}

/* Экран после отказа — тот же контейнер, только текст и одна кнопка «назад». */
.cs-bye{margin-top:10px;font-size:15px;line-height:1.55;color:var(--ink)}
