[html]<style>
.timeline-filters {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--base-spacing);
  margin-bottom: calc(2 * var(--base-spacing));
}

.timeline-filter {
  display: inline-flex;
  align-items: center;
  background-color: #1d1815;
  font-family: var(--accent-font, "Verdana", sans-serif);
  font-size: 0.95rem;
  text-transform: uppercase;
  color: #a9a899;
  padding: calc(0.75 * var(--base-spacing, 8px)) var(--base-spacing, 8px);
  cursor: pointer;
  border-radius: calc(0.5 * var(--base-spacing, 8px));
  border: 1px solid #564d28;
  box-shadow: 0px 0px 10px #29260961 inset;
  transition: all 0.5s ease-in-out 0s;
  white-space: nowrap;
  line-height: 1;
  outline: none;
}

.timeline-filter:hover {
  background-color: #29221e;
  color: #a9a899;
  border-color: #6b6237;
  transition: all 0.5s ease-in-out 0s;
}

.timeline-filter.active {
  background-color: #2d3012;
  border-color: #757c3c;
  color: #a1ab55;
  box-shadow: 0px 0px 10px #00000090 inset, 0 0 5px #3d441530;
}

.timeline-filter.active:hover {
  background-color: #363b17;
  border-color: #a1ab55;
  color: #c4cf6a;
}
</style>

<div class="updated">
<div class="timeline-filters" id="timeline-filters"></div>
<div class="timeline" id="timeline-root"></div>
</div>

<script>
const TAG_LABELS = { common: "Общее", dragons: "Драконы", kioshin: "Киошин", karraman: "Карраман", valonia: "Валония", frostholm: "Фростхольм" };
const TAGS = Object.keys(TAG_LABELS);

const chronologyData = [
  {
    period: "~2200–1800 до ПЗ",
    events: [
      {
        title: "Эпоха племён и первобытных царств.",
        text: "Земли Тенебрии разделены между кочевыми племенами, охотничьими союзами и ранними земледельческими общинами. Люди поклоняются духам, богам солнца, луны и стихий, не имея единой власти и общего порядка.",
        tags: ["common"]
      },
      {
        title: "Первый контакт между драконами и людьми.",
        text: "Ранние племена описывают их как сошедших с небес мудрецов, принесших с собой знания о кузнечном деле, земледелии и магии.",
        tags: ["common", "dragons"]
      }
    ]
  },
  {
    period: "~1800–1001 до ПЗ",
    events: [
      {
        title: "Возникновение ранних государств.",
        text: "На континенте появляются ранние города, княжества и торговые союзы. Формируются первые культурные и политические традиции народов Тенебрии.",
        tags: ["common"]
      }
    ]
  },
  {
    period: "1000 до ПЗ",
    events: [
      {
        title: "Расцвет магии в Астарионе.",
        text: "Благодаря живущим среди людей драконам расположенное на территории нынешнего Фростхольма королевство Астарион стремительно развивает и систематизирует магические знания.",
        tags: ["dragons"]
      }
    ]
  },
  {
    period: "993 до ПЗ",
    events: [
      {
        title: "Оскверненный союз.",
        text: "Придворные маги Астариона начинают тайные эксперементы над взятыми под стражу драконами. Их конечная цель - подчинить себе первозданную силу.",
        tags: ["dragons"]
      }
    ]
  },
  {
    period: "985 до ПЗ",
    events: [
      {
        title: "Великая охота.",
        text: "Фрагменты тел драконов становятся ценным ресурсов для астарионских артефактологов. На территории страны стихийно формируются гильдии охотников и ведутся активные разработки специализированного оружия.",
        tags: ["common", "dragons"]
      },
      {
        title: "Раскол среди драконов.",
        text: "Чем чаще случаются инциденты с нападением на драконов, тем громче звучат голоса тех, кто требует запретить любое взаимодействие со смертными, взамен защищая границы.",
        tags: ["common", "dragons"]
      }
    ]
  },
  {
    period: "950 до ПЗ",
    events: [
      {
        title: "Основание Астарионской Империи.",
        text: "Пользуясь весомым преимуществом в магических знаниях и артефактологии, государство Астарион начинает объединение значительной части континента под своей властью.",
        tags: ["common"]
      }
    ]
  },
  {
    period: "~950–700 до ПЗ",
    events: [
      {
        title: "Век Завоеваний.",
        text: "Астарион покоряет большую часть известных земель, разрушая старые государства и насаждая единые законы, культуру и порядок.",
        tags: ["common"]
      },
      {
        title: "Создание драконоборцев.",
        text: "Опасаясь силы и знаний драконов, Император вербует лучших из охотников, магов и артефактологов. Из них внутри астарионских легионов формируются отряды специально обученных воинов, в дальнейшем названные драконоборцами.",
        tags: ["common", "dragons"]
      }
    ]
  },
  {
    period: "~700–150 до ПЗ",
    events: [
      {
        title: "Пик могущества Астариона.",
        text: "Империя становится величайшей державой эпохи и доминирует над большей частью континента.",
        tags: ["common"]
      },
      {
        title: "Война Истребления.",
        text: "Когда драконы отказываются признать абсолютную власть Императора, Астарион объявляет им открытую войну. Тела поверженных драконов доставляются в столицу для изготовления артефактов.",
        tags: ["common", "dragons"]
      }
    ]
  },
  {
    period: "~480 до ПЗ",
    events: [
      {
        title: "Великая Миграция.",
        text: "Из-за существенных потерь в затянувшейся Войне Истребления драконы отступают с материка, взамен обосновываясь на Островах Змея.",
        tags: ["dragons"]
      },
      {
        title: "Пришествие Небожителей.",
        text: "Те из драконов, кто еще верит в возможность взаимовыгодного союза с людьми, устанавливают контакт с разрозненными кланами островного архипелага Киошина. Они приносят с собой знания в обмен на провиант и содействуют созданию культов, возводящей их в статус священных существ.",
        tags: ["dragons", "kioshin"]
      }
    ]
  },
  {
    period: "~150–1 до ПЗ",
    events: [
      {
        title: "Закат Империи.",
        text: "Борьба за престол, мятежи и восстания покорённых народов постепенно разрушают Астарион изнутри.",
        tags: ["common"]
      },
      {
        title: "Перерождение драконоборцев.",
        text: "Предугадывая печальную судьбу Империи, легат ордена драконоборцев совершает государственную измену. Он отказывается подчиняться высшему военному командованию и взамен переносит штаб-квартиру в нынешний Карраман, считая его ключевым бастионом обороны.",
        tags: ["common", "dragons"]
      }
    ]
  },
  {
    period: "0 ПЗ",
    events: [
      {
        title: "Падение Астарионской Империи.",
        text: "Центр власти уничтожен, императорская семья распята на собственных знаменах.",
        tags: ["common"]
      },
      {
        title: "Начало Эпохи Разлома.",
        text: "Бывшие провинции и вассалы объявляют независимость, а континент распадается на множество молодых государств.",
        tags: ["common"]
      },
      {
        title: "Начало летоисчисления Падших Знамён.",
        text: "Падение Империи становится новой точкой отсчёта истории континента.",
        tags: ["common"]
      }
    ]
  },
  {
    period: "5 ПЗ",
    events: [
      {
        title: "Война Песка и Пепла.",
        text: "Драконы при содействии объединенного флота кланов Киошина предпренимают попытку вернуть себе часть земель на материке. Орден драконоборцев успешно отражает их атаки.",
        tags: ["dragons", "common", "kioshin"]
      }
    ]
  },
  {
    period: "42 ПЗ",
    events: [
      {
        title: "Основание Королевства Валония.",
        text: "Центральные западные земли объединяются под властью первого валонского монарха.",
        tags: ["valonia"]
      }
    ]
  },
  {
    period: "45 ПЗ",
    events: [
      {
        title: "Освящение власти Махдари.",
        text: "Карраман провозглашает династию Махдари живыми представителями Всевышнего на земле.",
        tags: ["karraman"]
      }
    ]
  },
  {
    period: "242 ПЗ",
    events: [
      {
        title: "Формирование современных границ Валонии.",
        text: "К королевству присоединяется Ардез, завершая территориальное объединение государства.",
        tags: ["valonia"]
      }
    ]
  },
  {
    period: "245 ПЗ",
    events: [
      {
        title: "Война Валонии и Каррамана.",
        text: "Пограничный конфликт из-за торговых караванов перерастает в девятимесячную войну. Карраман терпит поражение и подписывает невыгодный мир.",
        tags: ["valonia", "karraman"]
      }
    ]
  },
  {
    period: "423 ПЗ",
    events: [
      {
        title: "Торговый спор Валонии и Фростхольма.",
        text: "Конфликт из-за торговых маршрутов едва не приводит к войне, но стороны ограничиваются переговорами.",
        tags: ["valonia", "frostholm"]
      }
    ]
  },
  {
    period: "745 ПЗ",
    events: [
      {
        title: "Несостоявшийся династический союз.",
        text: "Попытка укрепить отношения Валонии и Фростхольма через брак заканчивается убийством валонского принца.",
        tags: ["valonia", "frostholm"]
      }
    ]
  },
  {
    period: "758 ПЗ",
    events: [
      {
        title: "Исчезновение драконов.",
        text: "Остров Пепла уходит под воду и вместе с ним исчезают и сами драконы. Разведчики ордена драконоборцев докладывают о том, что Острова Змея пусты.",
        tags: ["common", "dragons"]
      },
      {
        title: "Начало эпохи воюющих кланов Киошина.",
        text: "Лишившись мудрости Небожителей, архипелаг становится раздробленным между десятками милитаризированных родов и островных княжеств, ведущих непрерывную борьбу за земли и влияние.",
        tags: ["kioshin", "dragons"]
      }
    ]
  },
  {
    period: "858 ПЗ",
    events: [
      {
        title: "Распад ордена драконоборцев.",
        text: "Спустя сто лет после исчезновения драконов орден окончательно прекращает существование. Финансирование иссякло, драконы так и не вернулись — воины не видели смысла ждать невесть чего. Орден распался сам собой: кто-то разошёлся по наёмным дружинам, кто-то осел в городах, а накопленные знания о драконах осели в библиотеках Каррамана.",
        tags: ["common", "dragons"]
      }
    ]
  },
  {
    period: "1091 ПЗ",
    events: [
      {
        title: "Мятеж магов в Валонии.",
        text: "Попытка магического переворота в Валонии под предводительством герцога Вердена проваливается. После подавления мятежа учреждается Инквизиция.",
        tags: ["valonia"]
      }
    ]
  },
  {
    period: "1132 ПЗ",
    events: [
      {
        title: "Создание Совета Валонии.",
        text: "Формируется центральный орган власти из представителей Великих домов.",
        tags: ["valonia"]
      }
    ]
  },
  {
    period: "1156 ПЗ",
    events: [
      {
        title: "Священное Воссоединение Киошина.",
        text: "Клан Мин объединяет острова в единую Империю Киошин.",
        tags: ["kioshin"]
      }
    ]
  },
  {
    period: "1299 ПЗ",
    events: [
      {
        title: "Закрытие границ Киошина.",
        text: "Император издаёт указ «О незыблемости», запрещая активные контакты с внешним миром.",
        tags: ["kioshin"]
      }
    ]
  },
  {
    period: "1308 ПЗ",
    events: [
      {
        title: "Пограничные конфликты Каррамана и Валонии.",
        text: "Серия столкновений усиливает нестабильность на юго-западе континента.",
        tags: ["karraman", "valonia"]
      },
      {
        title: "Заключение Альянса Щита.",
        text: "Валония и Фростхольм создают военный союз против внешних угроз.",
        tags: ["valonia", "frostholm"]
      }
    ]
  },
  {
    period: "1329 ПЗ",
    events: [
      {
        title: "Восшествие Мин Луньюя.",
        text: "Новый Император Киошина считается слабым и полностью зависимым от клана Цзинь.",
        tags: ["kioshin"]
      }
    ]
  },
  {
    period: "1338 ПЗ",
    events: [
      {
        title: "Переворот Мин Шэньхана.",
        text: "Законный Император свергнут и казнён, начинается масштабная чистка клана Цзинь.",
        tags: ["kioshin"]
      }
    ]
  },
  {
    period: "1339 ПЗ",
    events: [
      {
        title: "Покушение на Императрицу Киошина.",
        text: "Министерство Наказаний связывает нападение с последствиями чисток.",
        tags: ["kioshin"]
      }
    ]
  },
  {
    period: "1340 ПЗ",
    events: [
      {
        title: "Сближение Каррамана и Валонии.",
        text: "Начинается постепенное восстановление торговых отношений.",
        tags: ["karraman", "valonia"]
      },
      {
        title: "Восстание на Нанкае.",
        text: "В Киошине подавлена попытка выдать самозванца за наследника престола.",
        tags: ["kioshin"]
      },
      {
        title: "Восстание в Скогмарке.",
        text: "Крупный мятеж в герцогстве Скогмарк, поднятый союзом недовольных лордов, подавлен королём жёсткой рукой: тысячи казнены, земли конфискованы. Под удар попал и младший брат короля принц Вигард — он сослан в отдалённую крепость Рунгар на побережье.",
        tags: ["frostholm"]
      }
    ]
  },
  {
    period: "1330–1332 ПЗ",
    events: [
      {
        title: "Мятеж Эйринна и Виндхольма.",
        text: "Воспользовавшись внутренними распрями в королевстве, Эйринн и Виндхольм объявляют о независимости и заключают союз между собой.",
        tags: ["frostholm"]
      }
    ]
  },
  {
    period: "1335 ПЗ",
    events: [
      {
        title: "Провал брачного союза с Валонией.",
        text: "Фростхольм предлагает династический брак с одним из Домов Валонии, однако Совет отклоняет предложение. В знак протеста Фростхольм разрывает торговый договор с Валонией на пять лет.",
        tags: ["frostholm", "valonia"]
      }
    ]
  },
  {
    period: "1341 ПЗ",
    events: [
      {
        title: "Начало Сезона Цветения.",
        text: "Астрологи Киошина предрекают стране период процветания.",
        tags: ["kioshin"]
      }
    ]
  },
  {
    period: "1346–1348 ПЗ",
    events: [
      {
        title: "Война за Эйринн.",
        text: "Фростхольм объявляет войну Эйринну, пытавшемуся сохранить независимость. После двух лет полномасштабного вторжения Эйринн побеждён: его земли переходят под прямое правление Фростхольма, местная знать частично уничтожена, частично подчинена, а протестные движения уходят в подполье.",
        tags: ["frostholm"]
      }
    ]
  },
  {
    period: "1348–1349 ПЗ",
    events: [
      {
        title: "Падение Виндхольма.",
        text: "Истощённый союзной войной с Эйринном против Фростхольма, Виндхольм капитулирует меньше чем за год. Корона берет верфи и порты Лунного моря под прямое управление.",
        tags: ["frostholm"]
      }
    ]
  },
  {
    period: "1349 ПЗ",
    events: [
      {
        title: "Помолвка Принца Лейфа и Княжны Юдиты.",
        text: "Стремясь избежать конфликта с Фростхольмом, получившим беспрепятственный доступ к Лунному Морю, Волгард стремится укрепить шаткий союз спешной помолвкой.",
        tags: ["frostholm"]
      }
    ]
  },
{
    period: "1354 ПЗ",
    events: [
      {
        title: "Свадьба Принца Лейфа и Княжны Юдиты.",
        text: "Княжна Юдита прибывает в Фростхейм и бракосочетается с Принцем Лейфом. Церемонию проводят священники Церкви Откровения.",
        tags: ["frostholm"]
      }
    ]
  },
{
    period: "1355 ПЗ",
    events: [
      {
        title: "Исчезновение Великого Княза Тадеуша.",
        text: "Корабль Великого Князя исчезает без следа во время зимнего шторма. После двух месяцев поисков его признают погибшим.",
        tags: ["frostholm"]
      }
    ]
  },
  {
    period: "1355–1357 ПЗ",
    events: [
      {
        title: "Война за Волград.",
        text: "Пользуясь расколом внутри Волгарда, произошедшего из-за исчезновения не оставившего после себя наследников Великого Князя, Фростхольм вторгается на земли своего союзника. Официально они действуют от имени Княжны Юдиты, стремясь не допустить гражданскую войну.",
        tags: ["frostholm"]
      }
    ]
  },
  {
    period: "1347 ПЗ",
    events: [
      {
        title: "Восшествие Каэля III.",
        text: "После смерти Франциска I Лавалльера трон Валонии занимает его наследник.",
        tags: ["valonia"]
      }
    ]
  },
  {
    period: "1356 ПЗ",
    events: [
      {
        title: "Восшествие Шахризара Махдари.",
        text: "Новый правитель Каррамана начинает проводить противоречивые реформы, включая союз с пиратами.",
        tags: ["karraman"]
      }
    ]
  },
  {
    period: "1359 ПЗ",
    events: [
      {
        title: "Настоящее время.",
        text: "Современная эпоха Тенебрии.",
        tags: ["common"]
      }
    ]
  },
  {
    period: "1358 ПЗ",
    events: [
      {
        month: "3 месяц",
        title: "Рождение наследников Валонии.",
        text: "Королева Элора Лавалльер рожает близнецов — принцев Лео и Лайо. Дом Фарлайтов начинает стремительное возвышение.",
        tags: ["valonia"]
      },
      {
        month: "4 месяц",
        title: "Свадьба принцессы Астрид.",
        text: "Принцесса Астрид неожиданно быстро выходит замуж за герцога Хельмланда Карстена Драгонвальда.",
        tags: ["frostholm"]
      },
      {
        month: "4 месяц",
        title: "Похищение принца Лайо.",
        text: "Принца похищают во время крещения. Расследование выводит на магов из Фростхольма. Валония направляет ноту протеста и закрывает границы.",
        tags: ["valonia", "frostholm"]
      },
      {
        month: "4 месяц",
        title: "Нападение Теней в Рошфоре.",
        text: "На участников и гостей турнира совершено нападение. Инквизиция фиксирует рост активности потусторонних сил.",
        tags: ["valonia"]
      },
      {
        month: "6 месяц",
        title: "Арест наместника Хокурю.",
        text: "Фа Гюрен обвинён в хищениях и злоупотреблении властью имперскими цензорами.",
        tags: ["kioshin"]
      },
      {
        month: "7 месяц",
        title: "Нападение на свадьбу Первого Принца.",
        text: "Неизвестные нападают на церемонию бракосочетания Первого Принца и Принцессы Шеньи, призывая к смерти узурпатора.",
        tags: ["kioshin"]
      },
      {
        month: "8 месяц",
        title: "Казнь Фа Гюрена.",
        text: "Опальный наместник Хокурю и двое его личных секретарей казнены.",
        tags: ["kioshin"]
      },
      {
        month: "8 месяц",
        title: "Возвращение принца Вигарда.",
        text: "Опальный брат короля Вигард Вольфхарт посещает столицу с необычным даром. В тот же день над городом пролетает исполинская тень дракона.",
        tags: ["frostholm", "dragons"]
      },
      {
        month: "9 месяц",
        title: "Нападение дракона.",
        text: "Во время торжеств Праздника Урожая дракон разрушает поместье герцога Хельмланда. Карстен Драгонвальд и принцесса Астрид считаются погибшими.",
        tags: ["frostholm", "dragons"]
      },
      {
        month: "9 месяц",
        title: "Казнь посла Фростхольма.",
        text: "Посол задержан в Валонии, обвинён в ереси и казнён. Канцлер Гаспар д'Альбион отправлен под домашний арест.",
        tags: ["valonia", "frostholm"]
      },
      {
        month: "10 месяц",
        title: "Свадьба Шахризара Махдари.",
        text: "Правитель Каррамана берёт в жёны Айшу Халу, дочь наира Горных Крепостей. Во время свадьбы происходит нападение пиратов.",
        tags: ["karraman"]
      },
      {
        month: "10 месяц",
        title: "Возвращение сыновей Мин Луньюя.",
        text: "Вместе с ними в Тэнрю прибывает Цзинь Лиан, последняя из клана Цзинь. Император заключает всех троих под домашний арест до выяснения обстоятельств нападения на свадьбу.",
        tags: ["kioshin"]
      },
      {
        month: "11 месяц",
        title: "Переговоры Валонии и Каррамана.",
        text: "На нейтральной территории стороны договариваются не обострять конфликт. Инициатором перемирия выступает наир Горных Крепостей Рахман эфенди.",
        tags: ["valonia", "karraman"]
      },
      {
        month: "11 месяц",
        title: "Смерть Каэля III. Регентство Лорента.",
        text: "Король Валонии Каэль III скончался после падения с лошади. Наследник-младенец не коронован. Умирающий король назначает принца Лорента регентом.",
        tags: ["valonia"]
      }
    ]
  }
];

const parsePeriodSort = (period) => {
  const beforePZ = period.includes("до ПЗ");
  const firstNum = parseFloat(period.replace(/[~\s]/g, "").match(/[\d]+/)?.[0] ?? "0");
  return beforePZ ? -firstNum : firstNum;
};

chronologyData.sort((a, b) => parsePeriodSort(a.period) - parsePeriodSort(b.period));

let activeTags = new Set();

const render = () => {
  const root = document.getElementById("timeline-root");
  const filtered = activeTags.size === 0
    ? chronologyData
    : chronologyData.map(({ period, events }) => ({
        period,
        events: events.filter(e => (e.tags ?? []).some(t => activeTags.has(t)))
      })).filter(({ events }) => events.length > 0);

  root.innerHTML = filtered.map(({ period, events }) => {
    const hasMonths = events.some(e => e.month);
    if (!hasMonths) {
      return `
    <div class="timeline-year">
      <div class="timeline-year-head">${period}</div>
      <div class="timeline-events">
        ${events.map(({ title, text, tags = [] }) => `
          <div class="timeline-event no-month" data-tags="${tags.join(" ")}">
            <div class="timeline-text"><b>${title}</b> ${text}</div>
          </div>
        `).join("")}
      </div>
    </div>`;
    }
    // Group events by month
    const groups = [];
    for (const e of events) {
      const m = e.month || "";
      const last = groups[groups.length - 1];
      if (last && last.month === m) {
        last.events.push(e);
      } else {
        groups.push({ month: m, events: [e] });
      }
    }
    return `
    <div class="timeline-year">
      <div class="timeline-year-head">${period}</div>
      <div class="timeline-events">
        ${groups.map(({ month, events: grp }) => `
          <div class="timeline-event" data-tags="${grp.flatMap(e => e.tags ?? []).join(" ")}">
            ${month ? `<div class="timeline-date">${month}</div>` : ""}
            <div class="timeline-text">${grp.map(({ title, text }) => `<b>${title}</b> ${text}`).join("<br><br>")}</div>
          </div>
        `).join("")}
      </div>
    </div>`;
  }).join("");
};

const renderFilters = () => {
  const container = document.getElementById("timeline-filters");
  container.innerHTML = TAGS.map(tag => `
    <button class="timeline-filter${activeTags.has(tag) ? " active" : ""}" data-tag="${tag}">${TAG_LABELS[tag]}</button>
  `).join("");

  container.querySelectorAll(".timeline-filter").forEach(btn => {
    btn.addEventListener("click", () => {
      const tag = btn.dataset.tag;
      activeTags.has(tag) ? activeTags.delete(tag) : activeTags.add(tag);
      renderFilters();
      render();
    });
  });
};

renderFilters();
render();
</script>[/html]
[hideprofile]