:root {
    --bg: #f2f2f7; --card: #ffffff; --text: #0d0d14;
    --muted: #737380; --brand: #595ced; --error: #d93838; --ok: #21a651;
    --border: #d9d9e0;
  }
  @media (prefers-color-scheme: dark) {
    :root {
      --bg: #121217; --card: #212129; --text: #f2f2f7;
      --muted: #9999a6; --brand: #787aff; --error: #ff6961; --ok: #4cc770;
      --border: #3a3a45;
    }
  }
  * { box-sizing: border-box; }
  body {
    margin: 0; min-height: 100vh; display: flex; align-items: center;
    justify-content: center; background: var(--bg); color: var(--text);
    font: 16px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
          "Helvetica Neue", Arial, sans-serif;
    padding: 16px;
  }
  .card {
    background: var(--card); border-radius: 16px; padding: 32px;
    width: 100%; max-width: 420px; box-shadow: 0 1px 4px rgb(0 0 0 / 8%);
  }
  .mark { display: block; margin: 0 auto 12px; }
  h1 { font-size: 22px; margin: 0 0 4px; text-align: center; }
  .sub { color: var(--muted); font-size: 14px; margin: 0 0 24px; text-align: center; }
  label { display: block; font-size: 14px; color: var(--muted); margin-bottom: 6px; }
  input[type="password"] {
    width: 100%; padding: 12px 14px; font-size: 16px; color: var(--text);
    background: var(--bg); border: 1px solid var(--border); border-radius: 10px;
    outline: none;
  }
  input[type="password"]:focus { border-color: var(--brand); }
  button {
    width: 100%; margin-top: 16px; padding: 13px; font-size: 16px;
    font-weight: 600; color: #fff; background: var(--brand); border: 0;
    border-radius: 10px; cursor: pointer;
  }
  button:disabled { opacity: 0.55; cursor: default; }
  .msg { margin-top: 14px; font-size: 14px; text-align: center; display: none; }
  .msg.error { color: var(--error); }
  .msg.ok { color: var(--ok); }
  .final { text-align: center; font-size: 16px; display: none; }
  .final .icon { font-size: 40px; display: block; margin-bottom: 12px; }

  /* --- Страница поддержки (фаза 46, 09.09.2026) --- */
  /* Карточка шире: у обращения текстовое поле, и 420px превращают его в
     колодец, куда неудобно писать. */
  .card { max-width: 520px; }
  input[type="email"], textarea {
    width: 100%; padding: 12px 14px; font-size: 16px; color: var(--text);
    background: var(--bg); border: 1px solid var(--border); border-radius: 10px;
    outline: none; font-family: inherit;
  }
  input[type="email"]:focus, textarea:focus { border-color: var(--brand); }
  textarea { resize: vertical; min-height: 120px; }
  label { margin-top: 14px; }
  .hint { color: var(--muted); font-size: 13px; margin: 6px 0 0; }
  .foot { font-size: 14px; text-align: center; margin: 18px 0 0; }
  .foot a { color: var(--brand); text-decoration: none; }
  .foot.muted a { color: var(--muted); }
  /* --- Частые вопросы (11.09.2026) --- */
  /* Ответы стоят в разметке, а не подгружаются: их читает и человек, и
     поисковый робот. `details` свёрнут по умолчанию - список из восьми
     раскрытых ответов оттеснил бы форму за экран, а пришли сюда чаще всего
     писать. */
  .faq { margin-top: 28px; border-top: 1px solid var(--border); padding-top: 20px; }
  .faq h2 { font-size: 17px; margin: 0 0 12px; }
  .faq details {
    border: 1px solid var(--border); border-radius: 10px;
    padding: 10px 14px; margin-bottom: 8px; background: var(--bg);
  }
  .faq summary { cursor: pointer; font-weight: 600; font-size: 15px; }
  .faq details[open] summary { margin-bottom: 8px; }
  .faq p { margin: 0; font-size: 14px; color: var(--muted); line-height: 1.5; }
  .langs { margin-top: 10px; }
  .langs strong { color: var(--text); font-weight: 600; }

  /* ⚠️ Приманка убрана СТИЛЕМ, а не `hidden`: поле с атрибутом `hidden`
     робот пропускает так же легко, как человек, и ловушка перестаёт ловить.
     Уводим за край экрана, оставляя поле настоящим. */
  .trap {
    position: absolute; left: -9999px; width: 1px; height: 1px;
    overflow: hidden;
  }