Объявления: окно у игрока и редактор в админке

Окно — вариант E из макетов: заголовок в плашке-шапке, текст, точки очереди
и «Понятно», крестика нет. Очередь идёт от старого к новому; закрытое сразу
уходит из кэша, следующее открывается без ожидания сети. У повторно
показанного объявления под заголовком — красная пометка «обновлено».
AppShell показывает окно на любой странице и только когда пароль задан:
обязательное окно пароля всегда первое. Новые и изменённые объявления
приходят SSE-событием announcements, отложенное начало показа — перезапросом
раз в 5 минут.

Админка — вкладка «Объявления» с редактором R1: contenteditable и панель
(жирный, курсив, золотой и красный акцент, эмодзи, снятие оформления),
вставка и перетаскивание только простым текстом, счётчик символов, период
показа по МСК, переключатели «показывать новым игрокам» и «показать заново».
Предпросмотр — тем же окном, что у игрока. Список со статусом, счётчиком
«закрыли N из M» и действиями: изменить, снять с показа, дублировать,
удалить. Выделение текста в форме — полупрозрачный оранжевый вместо синего.

schema.d.ts пересобран из OpenAPI. #84

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

frontend/src/styles/global.css

@@ -487,3 +487,93 @@ input:focus, select:focus, textarea:focus { border-color: var(--accent); }
 .toast-top-error { border-left-color: var(--danger); }
 .toast-top-title { font-weight: 700; }
 .toast-top-body { margin-top: 2px; font-size: 13px; color: var(--text-muted); }
+
+/* ─── Объявления администрации (#84) ─── */
+
+/* Окно (вариант E): заголовок — в плашке-шапке на всю ширину модалки. */
+.ann-modal { max-height: calc(100dvh - 48px); overflow-y: auto; }
+.ann-ribbon {
+  margin: -18px -18px 14px;
+  padding: 12px 18px;
+  background: var(--surface-2);
+  border-bottom: 1px solid var(--border);
+  border-radius: var(--radius) var(--radius) 0 0;
+}
+.ann-ribbon-title { font-weight: 700; font-size: 16px; line-height: 1.3; overflow-wrap: anywhere; }
+/* Пометка повторного показа — мелкой строкой под заголовком, красным. */
+.ann-updated { margin-top: 2px; font-size: 12px; color: var(--danger); }
+.ann-actions { margin-top: 16px; justify-content: space-between; align-items: center; }
+.ann-dots { display: flex; gap: 6px; align-items: center; }
+.ann-dots i { display: block; width: 6px; height: 6px; border-radius: 50%; background: var(--border); }
+.ann-dots i.on { background: var(--accent-2); }
+
+/* Текст объявления — и в окне, и в редакторе админки (там он выглядит так же). */
+.ann-body { font-size: 14px; line-height: 1.5; color: var(--text); overflow-wrap: anywhere; }
+.ann-body p { margin: 0; }
+.ann-body p + p { margin-top: 10px; }
+/* Акценты: золотой — цвет ссылок и бейджа «идёт», красный — для предупреждений. */
+.ann-body mark { background: none; color: var(--accent-2); font-weight: 600; }
+.ann-body mark.red { color: var(--danger); }
+
+/* Редактор (вариант R1) */
+.rte-toolbar {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  flex-wrap: wrap;
+  padding: 8px;
+  background: var(--surface-2);
+  border: 1px solid var(--border);
+  border-bottom: none;
+  border-radius: var(--radius-sm) var(--radius-sm) 0 0;
+}
+.rte-tool {
+  min-width: 32px;
+  height: 32px;
+  padding: 0 8px;
+  border: 1px solid var(--border);
+  border-radius: 8px;
+  background: var(--surface);
+  color: var(--text);
+  font-size: 14px;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+}
+.rte-tool:hover { border-color: var(--accent-2); }
+.rte-gold { color: var(--accent-2); font-weight: 700; }
+.rte-red { color: var(--danger); font-weight: 700; }
+.rte-sep { width: 1px; height: 22px; background: var(--border); }
+.rte-editor {
+  min-height: 130px;
+  background: var(--surface-2);
+  border: 1px solid var(--border);
+  border-radius: 0 0 var(--radius-sm) var(--radius-sm);
+  padding: 10px 12px;
+  outline: none;
+}
+.rte-editor:focus { border-color: var(--accent); }
+.rte-editor:empty::before { content: attr(data-placeholder); color: var(--text-muted); }
+.rte-emoji {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 4px;
+  margin-top: 6px;
+  padding: 8px;
+  background: var(--surface);
+  border: 1px solid var(--border);
+  border-radius: var(--radius-sm);
+}
+.rte-emoji button {
+  width: 34px;
+  height: 34px;
+  border: none;
+  background: none;
+  font-size: 18px;
+  border-radius: 8px;
+}
+.rte-emoji button:hover { background: var(--surface-2); }
+.rte-counter { font-size: 12px; color: var(--text-muted); margin-top: 4px; text-align: right; }
+.rte-counter.over { color: var(--danger); }
+/* Выделение текста в форме объявления — полупрозрачный --accent-2 вместо системного синего. */
+.ann-form ::selection { background: rgba(240, 160, 75, 0.35); }