/* Палитра, типографика и орнамент. Всё, что задаёт «степной» характер,
   собрано здесь; app.css и рендер только пользуются переменными. */

:root {
  --paper:        #FBF7F0;   /* фон, цвет некрашеной бумаги */
  --paper-raised: #FFFDF8;   /* карточки, панели */
  --paper-sunk:   #F2ECE0;   /* впадины, полосы, ховер */
  --ink:          #1A1714;
  --ink-soft:     #4A423A;
  --muted:        #8C8378;   /* годы, второстепенное */
  --ochre:        #C8873F;   /* акцент, орнамент, выделение */
  --ochre-soft:   #E8D3B4;
  --indigo:       #1F3A5F;   /* линии связей, заголовки */
  --indigo-soft:  #C4CFDC;
  --rule:         #DED5C6;   /* разделители */
  --shadow:       0 1px 2px rgba(26, 23, 20, .06), 0 8px 24px rgba(26, 23, 20, .08);

  --serif: Georgia, "Iowan Old Style", "Palatino Linotype", "Times New Roman", serif;
  --sans:  system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --mono:  ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  --r-sm: 3px;
  --r-md: 6px;
  --r-lg: 12px;

  --header-h: 56px;
  --panel-w: 384px;
}

/* Тёмная палитра описана один раз и подключается из двух мест: по
   системной настройке и по явному выбору. Оговорка :not([data-theme="light"])
   обязательна — без неё системная тёмная перебивала бы кнопку. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --paper:        #16130F;
    --paper-raised: #1F1B16;
    --paper-sunk:   #29221A;
    --ink:          #EDE6DA;
    --ink-soft:     #C4BAAA;
    --muted:        #8E8474;
    --ochre:        #E0A15C;
    --ochre-soft:   #5A4429;
    --indigo:       #8FB0D6;
    --indigo-soft:  #33455C;
    --rule:         #362E25;
    --shadow:       0 1px 2px rgba(0, 0, 0, .4), 0 8px 24px rgba(0, 0, 0, .45);
  }
}

:root[data-theme="light"] { color-scheme: light; }

:root[data-theme="dark"] {
  color-scheme: dark;
  --paper: #16130F; --paper-raised: #1F1B16; --paper-sunk: #29221A;
  --ink: #EDE6DA; --ink-soft: #C4BAAA; --muted: #8E8474;
  --ochre: #E0A15C; --ochre-soft: #5A4429;
  --indigo: #8FB0D6; --indigo-soft: #33455C; --rule: #362E25;
  --shadow: 0 1px 2px rgba(0,0,0,.4), 0 8px 24px rgba(0,0,0,.45);
}

/* --------------------------------------------------------------- орнамент
   Калмыцкий меандр «зег»: непрерывная лента, свёрнутая в спирали.
   Используется ровно в трёх местах — полоса под шапкой, разделители
   в карточке человека, засечки выделенного узла. Больше — китч. */
.zeg {
  height: 14px;
  background-image: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' width='56' height='14' viewBox='0 0 56 14'>\
<path d='M0 12H56M7 12V3H31V8.5H17' fill='none' stroke='%23C8873F' \
stroke-width='1' stroke-linecap='butt'/></svg>");
  background-repeat: repeat-x;
  background-position: left center;
  opacity: .45;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .zeg { opacity: .4; }
}
:root[data-theme="dark"] .zeg { opacity: .4; }

/* Ромб-разделитель между супругами и в заголовках. */
.diamond::before {
  content: "◆";
  color: var(--ochre);
  font-size: .6em;
  vertical-align: .15em;
}