/* ============================================================
   «Слово дня» — раздел редакции.

   Служебный экран: макета у него нет, в редизайн он не входит, а
   доступен только учётке с правами. Вынесен из styles.css целиком,
   чтобы старый слой остался витриной Дзена и ничем больше. Вид не
   менялся — краски перенесены как были, под своими именами.

   Шапка раздела и возврат берутся из screens.css: они общие со всеми
   вложенными экранами, и разделу редакции досталось единственное
   новое, что в нём есть.

   ⚠️ Известная особенность, перенесена как есть: `.panel p` весом
   (0,1,1) перебивает одноклассовый `.editor-msg`, и сообщение об
   успехе выходит серым, а не зелёным. Чинится добавлением класса к
   селектору — но это уже изменение вида, а его не заказывали.
   ============================================================ */

:root {
  --editor-card: #ffffff;      /* блок формы */
  --editor-card-line: #ddd6ca; /* его обводка */
  --editor-field: #eff0f2;     /* поля ввода, строка игрока */
  --editor-line: #e6e6ea;      /* обводка полей */
  --editor-text: #1a1a1a;
  --editor-muted: #83838c;     /* ярлыки, сноски, мелкие подписи */
  --editor-key: #e8e9eb;       /* второстепенная кнопка */
  --editor-key-hover: #ddd6ca;
  --editor-input: #ffffff;     /* поле в строке игрока */
  --editor-accent: #ff5317;    /* основная кнопка, значок «редакция», ошибка */
  --editor-ok: #4a9d4e;        /* успешное сообщение */
}

@media (prefers-color-scheme: dark) {
  :root[data-theme="system"] {
    --editor-card: #26262c;
    --editor-card-line: #3b3b45;
    --editor-field: #171719;
    --editor-line: #35353d;
    --editor-text: #fafafa;
    --editor-muted: #b5b5bd;
    --editor-key: #36363d;
    --editor-key-hover: #3b3b45;
    --editor-input: #232325;
  }
}

:root[data-theme="dark"] {
  --editor-card: #26262c;
  --editor-card-line: #3b3b45;
  --editor-field: #171719;
  --editor-line: #35353d;
  --editor-text: #fafafa;
  --editor-muted: #b5b5bd;
  --editor-key: #36363d;
  --editor-key-hover: #3b3b45;
  --editor-input: #232325;
}

/* Панель раздела: содержимое по левому краю, в отличие от игровых
   экранов, где всё центровано. */
.panel { align-items: stretch; text-align: left; }
.panel p { font-size: 13px; line-height: 1.5; color: var(--editor-muted); }

.submit-word {
  width: 100%;
  background: var(--editor-accent);
  color: #fff;
  border-radius: 14px;
  padding: 13px;
  font-weight: 700;
  font-size: 15px;
}

.submit-word:disabled { opacity: .45; cursor: default; }

/* Второстепенное действие: тот же размер, но без заливки акцентом */
.submit-word.ghost {
  background: var(--editor-key);
  color: var(--editor-text);
}

.submit-word.ghost:hover { background: var(--editor-key-hover); }

.switch {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 8px 0;
  text-align: left;
}

.switch input { width: 18px; height: 18px; margin-top: 2px; flex: none; accent-color: var(--editor-accent); }
.switch-text { display: flex; flex-direction: column; gap: 2px; }
.switch-text b { font-size: 14px; font-weight: 600; }
.switch-text small { font-size: 12px; line-height: 1.35; color: var(--editor-muted); }
.switch input:disabled + .switch-text { opacity: .55; }

/* Формы идут одна за другой, поэтому каждая отбита рамкой */
#view-editor .editor-form,
#view-editor .editor-players {
  margin-top: 14px;
  padding: 12px 14px;
  border-radius: 14px;
  background: var(--editor-card);
  border: 1px solid var(--editor-card-line);
  text-align: left;
}

.editor-current { font-size: 13px; line-height: 1.5; margin-bottom: 10px; }
.editor-current b { letter-spacing: .08em; }
.editor-form { display: flex; flex-direction: column; gap: 8px; }
.editor-form label { font-size: 12px; color: var(--editor-muted); }

.editor-form input {
  height: 42px;
  padding: 0 12px;
  border-radius: 10px;
  border: 1px solid var(--editor-line);
  background: var(--editor-field);
  text-transform: uppercase;
  letter-spacing: .12em;
}

.editor-note { font-size: 11px; color: var(--editor-muted); margin-top: 8px; line-height: 1.4; }

.editor-form textarea {
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid var(--editor-line);
  background: var(--editor-field);
  font: inherit;
  font-size: 13px;
  resize: vertical;
}

.editor-actions { display: flex; gap: 8px; }
.editor-actions .submit-word { flex: 1; }
.editor-actions .ghost { background: var(--editor-key); color: var(--editor-text); }

.editor-msg {
  margin: 8px 0 4px;
  font-size: 12px;
  line-height: 1.4;
  color: var(--editor-ok);
  font-weight: 600;
}

.editor-msg.error { color: var(--editor-accent); }

/* Счётчик знаков подсказки. Перебор не прячем и не блокируем: текст мог
   прийти из «Сгенерировать», и редактору важно видеть, сколько лишнего,
   а не упереться в молчаливый предел (§9.4 брифа). */
.editor-counter {
  margin: 4px 0 0;
  font-size: 11px;
  line-height: 1.4;
  color: var(--editor-muted);
}
.editor-counter.is-over { color: var(--editor-accent); font-weight: 600; }

/* Настройки экономики */
.econ-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.econ-grid label { display: flex; flex-direction: column; gap: 4px; font-size: 11px; color: var(--editor-muted); }
.econ-grid input { height: 36px; padding: 0 8px; border-radius: 8px; border: 1px solid var(--editor-line); background: var(--editor-field); }
.econ-switch { padding: 4px 0; }

/* Раздел «Игроки»: строки рисует app.js после загрузки списка */
.editor-players { margin-top: 14px; display: flex; flex-direction: column; gap: 8px; }
.editor-players > label { font-size: 12px; color: var(--editor-muted); }
.players-list { display: flex; flex-direction: column; gap: 8px; max-height: 260px; overflow-y: auto; }
.players-empty { font-size: 12px; color: var(--editor-muted); }

.player-row {
  padding: 10px;
  border-radius: 12px;
  background: var(--editor-field);
  border: 1px solid var(--editor-line);
}

.player-main { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-bottom: 8px; }
.player-main b { font-size: 13px; }
.player-main small { width: 100%; font-size: 11px; color: var(--editor-muted); }

.player-badge {
  padding: 2px 7px;
  border-radius: 999px;
  background: var(--editor-accent);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
}

.player-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.player-actions input { width: 64px; height: 30px; padding: 0 8px; border-radius: 8px; border: 1px solid var(--editor-line); background: var(--editor-input); font-size: 12px; }
.player-actions button { padding: 0 10px; height: 30px; border-radius: 8px; background: var(--editor-key); font-size: 12px; font-weight: 600; }
.player-actions button:hover { background: var(--editor-key-hover); }