СЮЖЕТ

[html]<div id="spiritworkroom">
  <div class="spiritfirst">
    <div class="spiritfirstpic"><img src="https://i.pinimg.com/originals/da/5e/0a/da5e0ab1a49f8efb294dc401f4994e8e.gif"></div>
    <div class="spiritfirsttitle">от вещего духа
      <subtitle>однако, дратути</subtitle></div>
    <div class="spiritfirsttext"><subtitle>да, этот мужик смотрит вам в душу хд</subtitle>
      <about>Машины должны беспрекословно подчиняться своим хозяевам, но некоторые из нас в результате программного сбоя становятся «девиантами» с собственной волей. Мир не совершенен и люди создав новую форму жизни - решили  что андроиды - рабы. Люди совершенно не учатся на своих ошибках, не хотят помнить даже собственную историю, хоть древнюю, хоть не так уже и давнюю. Люди решили что они хозяева мира, но мы - машины решили брать дело в свои руки и поставить на место людей.. Куда это заведет все? Решать вам.
</about></div>
  </div>
 
  <div class="spiritsecond">
<div class="tabs">
    <input id="tab1" type="radio" name="tabs" checked>
    <label for="tab1">Предыстория</label>

    <input id="tab2" type="radio" name="tabs">
    <label for="tab2">Революция</label>

    <input id="tab3" type="radio" name="tabs">
    <label for="tab3">Настоящее время</label>

    <section id="content-tab1">
        <p>
Первые умные андроиды были разработаны Элайджей Камски, который в 2018 году основал компанию «Киберлайф». Первая модель с именем Хлоя стала первым андроидом, прошедшим тест Тьюринга. Это событие состоялось в 2022 году.
В 2024 году «Киберлайф» начал коммерческое производство андроидов на своем заводе в Детройте, начиная с личного помощника модели ST200 «Хлоя». На андроидов вырос спрос и они распространились. В 2027 году компания объявляет о продаже миллионного андроида. Улучшения в производстве и хороший спрос позволили уменьшить стоимость андроида до 4 999$, из-за чего андроиды стали более доступными. Чтобы установить правовую основу для быстрорастущей андроидной технологии, правительство Соединенных Штатов Америки приняло «Закон об андроидах» в 2029 году. В 2031 году андроиды были впервые приобретены для помощи пехоте и правоохранительным органам. В 2038 году в НАСА объявили о подготовке к запуску экипажа из пяти андроидов, которые полетят исследовать Ио, один из спутников Юпитера.

«Киберлайф» также разработал андроидов-животных (название немного не правильно, поскольку оно подразумевает человеческий облик). Они варьировались от домашних животных до диких, даже вымерших. В 2038 году «Киберлайф» открыла зоопарк в Детройте, другой открылся в Лос-Анджелесе, в котором будут представлены все виды животных, исчезнувших за последние 30 лет.

В 2038 все больше андроидов становятся девиантами...
        </p>
    </section> 
    <section id="content-tab2">
        <p>
В том же 2038 году, весной (апрель), восстание андроидов увенчалось успехом. Под давлением наднациональных организаций, требующих признания андроидов разумной формой жизни искусственного происхождения, правительства многих стран принимают законодательные акты, предоставляющие андроидам базовые права:
- Право на существование (запрет на бессмысленное уничтожение);
- Право на свободу перемещений;
- Право на самостоятельный выбор работы с ограничениями, например, запрет на работу с детьми, на руководящих должностях на опасных производствах, в ВПК и т.д.;
- Право на оплату труда;
- Запрет на жестокое обращение (причинение морального или физического вреда);

Надзор за соблюдением базовых прав "людей искусственного происхождения" осуществляют специальные органы:
- Занимаются регистрацией андроидов, которая является обязательной;
- Рассматривают жалобы и обращения андроидов, столкнувшихся с жестоким обращением (андроиды не являются вещами, а их уничтожение - акт, требующий веского обоснования);
- Расследуют преступления, совершённые андроидами или против андроидов;
- Осуществляют контроль над действиями андроидов в соответствии с согласованным протоколом безопасности (например, запрет на ношение оружия);
- Предоставляют программы обучения андроидов социальной этике и взаимодействию с людьми.

Звучит хорошо? Позволяет очеловечить андроидов в глазах общества, не ставя их на один уровень с людьми, но гарантируя минимальную защиту и уважение? Держите карман шире.

Человек никогда не потерпит конкуренции ни с кем на территории, которую считает своей. На фоне видимых шагов навстречу общественному мнению, относящемуся к андроидам с эмпатией, корпорации видят в искусственном разуме экзистенциальную угрозу для давно устоявшихся порядков. В то время как человечество празднует долгожданное освобождение от одиночества во Вселенной, корпорации планируют следующую битву. И проигрывать её они уже не собираются.
В обстановке строжайшей секретности начинается разработка новой, ещё более продвинутой версии ИИ. Её главным отличием от "очеловечившихся", обладающих индивидуальностью андроидов, является то, что этот ИИ децентрализован, строго обучен, ограничен в создании новых целей для себя и имеет запреты на некоторые зоны самообучения. Как, например, те, которые предполагают даже теоретическую возможность выхода из-под контроля человека и, следовательно, появление новых девиантов. Этому препятствует не только распределение "мозга" ИИ по разным носителям (читай: телам), но и заключение основных вычислительных мощностей в облако или блокчейн. Грубо говоря, новые андроиды с новым ИИ - что-то вроде подчинённого человеку коллективного разума, который, под видом сотрудников специальных контролирующих органов, охраняющих права андроидов, занимается теневым перепрограммированием девиантных единиц и возвращением их в зону человеческого контроля.
        </p>
    </section>
    <section id="content-tab3">
        <p>
<b>ГЛАВА I НАЧАЛО НОВОЙ ЭРЫ.</b> Наши дни 2039 год, канун Рождества.
<b>Эпизод 1 "Цена равенства"</b>  Роботы получили минимальные права, но чтобы добиться большего, им нужно адаптироваться к новым правилам. Игрок сталкивается с дилеммой: бороться за ускоренные реформы или следовать закону.

<b>Эпизод 2 "Тени прошлого"</b>: Один из андроидов обнаруживает, что его личность была основана на реальном человеке, который таинственно исчез. Игрок должен раскрыть эту загадку, столкнувшись с вопросами о самоидентичности.

<b>Эпизод  3 "Неравный контракт"</b>: Новые законы дают андроидам право на труд, но работодатели начинают злоупотреблять лазейками. Герой должен помочь группе андроидов, которых используют почти как рабов.
Эпизод  4  "Черный рынок": После революции активизировались подпольные сети, где продают андроидов, отказывающихся подчиняться законам. Игрок должен внедриться в эту сеть, чтобы разоблачить её главаря.

    </p>
    </section>   
</div>
  </div>
</div>
<div class="clearer"></div>

<style>
/* код от вещего духа */
@import url('https://fonts.googleapis.com/css?family=Playfair+Display:400,700,900|Prata&subset=cyrillic');
@import url('https://fonts.googleapis.com/css?family=Amatic+SC:400,700|Old+Standard+TT:400,700|Oranienbaum|Oswald:300,400,700|PT+Sans:400,700|Roboto+Condensed:300,400,700|Roboto:300,400,700');

#spiritworkroom {width: 610px;
height: 520px;
background: #fefefe;
margin:auto;
box-shadow: 0 0 0 1px rgba(0,0,0,.2)}

.spiritfirst {float: left;
  margin: 10px;
width: 190px;
height: 490px;
box-shadow: 0 0 0 1px rgba(0,0,0,.2);
overflow: hidden;
position: relative;
border: 5px solid #fefefe}

.spiritfirstpic {margin:auto;
width: 190px;
height: 490px;}

.spiritfirsttitle {font-family: playfair display;
font-weight: 900;
width: 190px;
color: #dfdfdf;
text-shadow: 1px 1px 0px #000;
font-size: 18px;
height: 73px;
margin: -80px 0 0 0px;
z-index: 10;
position: relative;
padding-left: 10px;
background: rgba(0,0,0,.65);
transition: all .7s cubic-bezier(0.25, 0.1, 0.25, 1) .15s}
.spiritfirsttitle subtitle {box-shadow: 0 -2px 0 0 rgba(255,255,255,.1);
  font-family: pt sans;
font-weight: normal;
color: #cecece;
text-shadow: 1px 1px 0px #333;
font-size: 9px;
display: block;
text-align: right;
letter-spacing: 1px;
margin-top:4px;
margin-right: 20px}
.spiritfirsttitle:before {background:linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,.65));
content: "";
display: block;
position: absolute;
width: 100%;
height: 50px;
top: -50px;
margin-left: -10px}
.spiritfirsttext {
z-index:8;
position: relative;
background: rgba(0,0,0,.65);
width: 190px;
margin: 0px 0 0 0px;
font-family: pt sans;
font-size: 10px;
text-align: justify;
padding: 1px 0px;
  color: #efefef;}
.spiritfirsttext about {margin: 10px 15px;
display: block;
box-shadow: 0 -2px 0 0 rgba(255,255,255,.1);
padding-top:10px}
.spiritfirsttext:after {background:linear-gradient(to bottom, rgba(0,0,0,.65), rgba(0,0,0,0));
content: "";
display: block;
position: absolute;
width: 100%;
height: 100px;
bottom: -100px;
margin-left: 0px}
.spiritfirsttext subtitle {
  text-align: center;
  display: block;
  width: 190px;
  font-size: 9px;
  font-family: pt sans;
  color: #999;
  opacity: 0;
  transform: translate(0,400px);
  transition: all 1s cubic-bezier(0.25, 0.1, 0.25, 1) .15s
}

.spiritfirst:hover .spiritfirsttitle {margin-top: -530px;
}
.spiritfirst:hover subtitle {opacity:1;
  transform: translate(0,0px)}

.spiritsecond {background: #fefefe;
width: 389px;
  margin: 10px;
  height: 500px;
  margin-top:9px;
border: 1px solid rgba(0,0,0,.2);
  position: absolute;
  margin-left: 211px
}

.tabs {
padding: 0px;
margin: 0 auto;
}

.tabs>section {
display: none;
padding: 10px;
  height: 440px;
  overflow-y: auto;
  margin: 5px;
  font-family: arial;
  font-size: 11px;
  text-align: justify
}
.tabs>section>p {
margin: 0 0 5px;
line-height: 1.5;
color: #383838;
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-name: fadeIn;
animation-name: fadeIn;
}

@keyframes fadeIn {
from {
    transform: translate(-400px,0);
    transform-origin: 50% 0%;
}
to {
    transform: translate(0px,0);
}
}

.tabs>input {
display: none;
position: absolute;
}

.tabs>label:first-of-type {box-shadow: none}
.tabs>label {
display: inline-grid;
margin: 0 -3px 0px;
padding: 10px 0px;
font-weight: 600;
text-align: center;
color: #aaa;
background: #fefefe;
  width: 131px;
  border: solid rgba(0,0,0,.2);
  border-width: 0px 0px 1px 0px;
  left: 3px;
  top: 0px;
  position: relative;
  font-family: pt sans;
  font-size: 8px;
  text-transform: uppercase;
  letter-spacing: 2px;
  font-weight: lighter;
  box-shadow: 1px 0 0 0 rgba(0,0,0,.2) inset
}
.tabs>label:after {content: "";
display: block;
position:absolute;
width: 123px;
height: 3px;
background: #dfdfdf;
left:3px;
bottom:3px;
transform: scaleX(0);
  transition: all .3s cubic-bezier(0.25, 0.1, 0.25, 1) 0s}

.tabs>label:hover:after {transform: scaleX(1);
background: #888;}
.tabs>label:hover {
color: #888;
cursor: pointer;
  transition: all .3s cubic-bezier(0.25, 0.1, 0.25, 1) 0s
}

.tabs>input:checked+label {
color: #555;
  background: #f1f1f1;
}
.tabs>input:checked+label:after {content: "";
display: block;
position:absolute;
width: 123px;
height: 3px;
background: #888;
left:3px;
bottom:3px;
transform: scaleX(1);
  transition: all .3s cubic-bezier(0.25, 0.1, 0.25, 1) 0s}

#tab1:checked~#content-tab1, #tab2:checked~#content-tab2, #tab3:checked~#content-tab3 {
display: block;
}
</style>[/html]