/* pages.css — стили ТОЛЬКО для статических страниц вне игры
 * (frontend/privacy.html, frontend/terms.html). Игровой page.css этот файл
 * не подключает и не трогает: пересечений по селекторам нет — всё под
 * префиксом .page*.
 *
 * Правила:
 *   - ничего со сторонних хостов (CSP прода: default-src 'none',
 *     style-src 'self'): шрифт — системный стек, картинка — свой логотип;
 *   - палитра — те же токены, что в assets/page.css (бирюзовая сцена,
 *     бежевая панель, бевели Win3.x), значения продублированы здесь,
 *     потому что page.css эти страницы не загружают;
 *   - колонка ~70 символов: длинный юридический текст должен читаться.
 */

:root {
  --scene-bg: #367b7a;
  --panel-bg: #e9d3c5;
  --panel-ink: #000000;
  --panel-edge: #8c7a70;
  --bevel-hi: #ffffff;
  --bevel-dk: #3c3c44;
  --link: #1a1a8c;
  --link-hover: #000060;
  --mono-bg: #f3e6dd;
}

.page-body {
  margin: 0;
  padding: 28px 16px 56px;
  background: var(--scene-bg);
  color: var(--panel-ink);
  font-family: Tahoma, "Segoe UI", "MS Sans Serif", Geneva, sans-serif;
  font-size: 15px;
  line-height: 1.55;
}

/* Бумажная панель: бевель Win3.x (свет сверху-слева, тень снизу-справа)
 * плюс жёсткая тень — тот же приём, что у модалов игры. */
.page {
  max-width: 70ch;
  margin: 0 auto;
  padding: 20px 28px 26px;
  background: var(--panel-bg);
  border: 2px solid;
  border-color: var(--bevel-hi) var(--bevel-dk) var(--bevel-dk) var(--bevel-hi);
  box-shadow: 3px 3px 0 var(--bevel-dk);
}

.page a { color: var(--link); }
.page a:hover { color: var(--link-hover); }

.page-back { margin: 0 0 14px; font-size: 14px; }

.page-head {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 0 0 18px;
  padding: 0 0 12px;
  border-bottom: 2px solid var(--panel-edge);
}

/* Логотип — пиксель-арт: масштабируется без сглаживания. */
.page-logo {
  flex: none;
  width: 48px;
  height: 48px;
  image-rendering: pixelated;
}

.page h1 {
  margin: 0;
  font-size: 22px;
  line-height: 1.2;
}

.page h2 {
  margin: 24px 0 8px;
  padding: 0 0 3px;
  font-size: 16px;
  border-bottom: 1px solid var(--panel-edge);
}

.page-meta {
  margin: 4px 0 0;
  font-size: 13px;
  line-height: 1.4;
}

.page p { margin: 0 0 10px; }
.page ul { margin: 0 0 10px; padding-left: 22px; }
.page li { margin: 0 0 5px; }

/* Имена кук, скоупов и ключей — моноширинным, чтобы не путать с текстом. */
.mono {
  font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  font-size: 0.92em;
  background: var(--mono-bg);
  padding: 0 3px;
}

.page-foot {
  margin: 22px 0 0;
  padding: 10px 0 0;
  border-top: 2px solid var(--panel-edge);
  font-size: 14px;
}

/* Узкий экран: панели нужны поля поменьше, колонка и так ограничена. */
@media (max-width: 560px) {
  .page-body { padding: 14px 8px 32px; }
  .page { padding: 14px 16px 18px; }
  .page h1 { font-size: 19px; }
}