/* Тёмная тема — та же тёплая бумага после заката. Геометрия и значения
   цветов не меняются: меняется только светлота материалов. */
:root{
  --canvas:#EBEAE6;
  --surface-glass:rgba(255,255,255,.82);
  --paper-glass:rgba(235,234,230,.76);
  --wait-ink:#7C4A06;
  --late-hover:#7E2418;
  --shift-track:#DBD9D2;
  --focus-ring:rgba(25,24,21,.07);
  --ink-rgb:25,24,21;
}

html[data-ui-theme="dark"]{
  /* Четыре уровня светлоты вместо одной серой плоскости: среда,
     навигационная бумага, рабочая поверхность и утопленный контроль.
     Вся стопка занимает 11.8 L* — столько же, сколько светлая (10.9).
     Прежняя занимала 21.1: поверхности забирались так высоко, что
     самая светлая из них становилась серединой шкалы, и чернилам не
     оставалось запаса — у --ink на карточке было 8.3:1 против 17.8:1
     в светлой теме. Отсюда и бралось ощущение мути. */
  --canvas:#151412;
  --paper:#1F1D1A;
  --card:#2F2C27;
  --sunk:#282420;
  /* Линейка отстоит от бумаги на те же 12.8 L*, что и в светлой теме.
     Прежние 26.8 делали из сетки календаря проволочный каркас: волосяные
     линии звучали вдвое громче, чем им положено. */
  --rule:#3C3832;
  --rule-2:#3F3B34;

  /* Три голоса, а не три крика. В светлой теме уровни чернил стоят
     ровными шагами 27 и 25 L*: заголовок, текст, подпись. В прежней
     тёмной шаги были 12.8 и 7.1 — второй и третий уровень звучали
     одинаково, и экран читался плоским. Теперь шаги 16.7 и 16.6.
     Ниже опускать третий уровень нельзя: 4.6:1 на самой светлой
     рабочей карточке — это порог AA, и мелкие подписи его держат. */
  --ink:#F0EEE8;
  --ink-2:#C2BFB7;
  --ink-3:#98938C;
  --ink-rgb:240,238,232;

  --accent:#F0EEE8;
  --accent-2:#FFFFFF;
  --accent-ink:#191715;

  /* Приборная полоса остаётся самым тёмным предметом на экране: в
     светлой теме она на 87 L* ниже рабочей поверхности и держит на себе
     весь замысел — шкала времени как прибор. В темноте такого запаса
     нет физически, поэтому полоса уходит к самому низу шкалы и получает
     край (см. ниже), а не пытается добрать разницей светлоты. */
  --band:#0C0D0B;
  --band-2:#131411;
  --band-3:#1A1A17;
  --band-ink:#F0EEE8;
  --band-ink-2:#928D85;
  --band-ink-3:#7A766F;

  /* Пигменты собраны из тона светлой темы, самой низкой светлоты, что
     ещё держит порог AA на своей подложке, и всей цветности, какая на
     этой светлоте помещается в sRGB. Порядок именно такой: раньше они
     поднимались множителем по каналам, и на L* 70 красный уходил в
     розовый, а янтарный терял половину цветности и становился хаки.

     Здесь пришлось выбирать. В светлой теме у «просрочена» запас 7.3:1,
     в тёмной на той же цветности выходит 4.8:1 — выше порога AA, но без
     прежнего запаса. Цветность важнее: статус в шахматке опознают
     боковым зрением по цвету, а не вчитываясь. */
  --ok:#499C7B;   --ok-bg:#16231C;   --ok-line:#083927;
  --wait:#CB7C00; --wait-bg:#2D2100; --wait-line:#392D00;
  --late:#F4583F; --late-bg:#301C18; --late-line:#5A2218;
  --stop:#8D8880; --stop-bg:#201E16; --stop-line:#322D1F;
  /* «Сейчас» — единственный насыщенный тон в палитре, и он оставался
     подобранным под светлую бумагу: на тёмной карточке давал 2.6:1, и
     тонкая красная черта переставала быть чертой. Поднят по светлоте до
     контраста светлой темы, но множителем по каналам, а не подмешиванием
     белого: иначе красный уезжает в розовый и перестаёт быть сигналом. */
  --now:#FF5D56;
  --wait-ink:#E5911E;
  --late-hover:#FF7A60;
  /* Серии графиков подняты по светлоте под тёмную карточку и проверены
     тем же валидатором на #2F2C27: те же три сущности, тот же порядок. */
  --viz-night:#4B93D6;
  --viz-hour:#B08A1E;
  --viz-extras:#A375BC;
  --viz-mute:#524C43;

  /* Заливки статусов и меток были в разы насыщеннее светлых — у
     «подтверждена» в 12.6 раза, — и шахматка от этого рябила цветными
     блоками там, где в светлой теме лежит подкрашенная бумага. Теперь у
     каждой пары та же насыщенность, что в светлой теме, при той же
     светлоте: контраст пигмента на заливке совпадает до сотых.

     Цветность считается по C* в Lab, а не отношением каналов: отношение
     на тёмной заливке даёт втрое меньше видимого цвета при том же числе.
     Но и равного C* мало. При низкой светлоте одна и та же цветность
     выглядит заметно бледнее — эффект Ханта, — и заливки с цветностью
     светлой темы читались серыми. Поэтому C* взята с запасом 2.2, а где
     sRGB кончается раньше (янтарные на низкой светлоте) — сколько влезло.
     Множитель подобран глазами на реальном размере карточки: при 1.7 цвет
     ещё робкий, при 3 заливка становится плашкой. */
  --tag-1-bg:#3F1C14; --tag-1-ink:#CD9D94;
  --tag-2-bg:#2A2100; --tag-2-ink:#AC976E;
  --tag-3-bg:#0E2A1C; --tag-3-ink:#8CB5A0;
  --tag-4-bg:#102838; --tag-4-ink:#93AFC0;
  --tag-5-bg:#2E2037; --tag-5-ink:#C4ABCD;
  --tag-6-bg:#2B271B; --tag-6-ink:#CFCBC3;

  --av-1:#4B5572; --av-2:#376D49; --av-3:#76583A;
  --av-4:#6A405D; --av-5:#296572; --av-6:#76443C;

  --off-paper:rgba(0,0,0,.193);
  --off-band:rgba(255,255,255,.055);
  --surface-glass:rgba(40,36,32,.78);
  --paper-glass:rgba(31,29,26,.84);
  --edge-light:rgba(255,255,255,.085);
  --shift-track:#2F2C26;
  --focus-ring:rgba(240,238,232,.12);
  --on-status:#0C0D0B;

  --sh-1:0 1px 2px rgba(0,0,0,.20),0 0 0 1px rgba(255,255,255,.055),inset 0 1px 0 rgba(255,255,255,.035);
  --sh-2:0 2px 4px rgba(0,0,0,.20),0 14px 30px rgba(0,0,0,.22),0 0 0 1px rgba(255,255,255,.065),inset 0 1px 0 rgba(255,255,255,.05);
  --sh-3:0 10px 24px rgba(0,0,0,.28),0 24px 52px rgba(0,0,0,.24),0 0 0 1px rgba(255,255,255,.045);
  --sh-modal:0 30px 64px -12px rgba(0,0,0,.62),0 0 0 1px rgba(255,255,255,.055);
}

body{color-scheme:light}
html[data-ui-theme="dark"] body{color-scheme:dark}
/* .side, .sheet и .dlg берут --theme-fade в свой переход сами
   (sidebar.css, modal.css): у них есть движение, которое нельзя стирать. */
body,.top,.work,.cal,.st,.jr-page,.gs-page,.pop{transition:var(--theme-fade)}

/* В светлой теме глубину создаёт разница белой карточки и бумаги. В тёмной
   тот же принцип требует отдельной среды. Рабочий chrome — сплошной, как в
   светлой: стекло стояло там, где под ним нечего размывать (меню рядом с
   экраном, а не над ним; окна непрозрачны на 96 %), и материал зависел от
   темы, а не от смысла. Стекло осталось только над тем, что под ним
   движется: липкие шапки, карточки уведомлений, затемнение под окном. */
html[data-ui-theme="dark"] body{background:var(--canvas)}
html[data-ui-theme="dark"] .side{
  background:var(--paper);
  box-shadow:inset -1px 0 0 rgba(255,255,255,.025);
}
html[data-ui-theme="dark"] .top{
  background:var(--paper);
  box-shadow:inset 0 -1px 0 rgba(0,0,0,.14),inset 0 1px 0 var(--edge-light);
}
html[data-ui-theme="dark"] :is(.cal,.st,.journal,.guests,.bookings){
  box-shadow:var(--sh-2);
}
/* Приборной полосе в темноте нечем добрать разницу светлотой: в светлой
   теме она на 87 L* ниже рабочей поверхности, здесь запас в пять раз
   меньше. Поэтому полосу отделяет край, а не глубина, — тот же приём,
   каким в светлой теме её отделяет сама чернота. */
html[data-ui-theme="dark"] :is(.bk-head,.cal-head,.ruler,.days-head,.gs-head){
  box-shadow:inset 0 -1px 0 var(--rule),inset 0 1px 0 var(--edge-light);
}
html[data-ui-theme="dark"] :is(.cal-top,.gs-top){
  background:color-mix(in srgb,var(--sunk) 78%,var(--card));
  box-shadow:inset 0 1px 0 var(--edge-light);
}
html[data-ui-theme="dark"] :is(.btn-ghost,.period-nav,.ico-btn,.seg,.search,.inp,.gs-find){
  box-shadow:var(--sh-1);
}
html[data-ui-theme="dark"] :is(.sheet,.dlg,.pop){
  border:1px solid rgba(255,255,255,.07);
  background:var(--card);
}
html[data-ui-theme="dark"] .scrim{
  background:rgba(18,17,15,.52);
  -webkit-backdrop-filter:blur(3px);
  backdrop-filter:blur(3px);
}

/* Фирменный lockup живёт в styles/lockup.css: он стоит в меню и от темы
   почти не зависит. Здесь остаётся только слово экрана сборки — знака
   рядом с ним нет, на том экране дятел живой. */
html[data-ui-theme="dark"] .boot-word{filter:brightness(0) invert(1);opacity:.94}

/* Дятел в приборе загрузки — та же беда, но решается иначе. Он не знак,
   а рисованная птица: чёрная спина, светлая грудка, красный хохолок —
   это её окрас, и менять его значит менять птицу. На тёмном фоне спина,
   крыло и хвост уходят в среду (1.19:1), и от птицы остаётся одна
   грудка без силуэта. Поэтому окрас не трогаем, а возвращаем контур —
   тем же приёмом, каким надпись отделяется от полупрозрачного
   материала: светлый край по самому силуэту, без ореола. */
html[data-ui-theme="dark"] .lw-mascot-body{
  --mascot-op:.88;
  filter:drop-shadow(0 0 .7px rgba(237,234,227,.9));
}
html[data-ui-theme="dark"] .lw-mascot[data-theme="winter"] .lw-mascot-body{--mascot-op:.92}
@media (hover:hover) and (pointer:fine){
  html[data-ui-theme="dark"] .loadwave:hover .lw-mascot-body{opacity:1}
}

/* ── Приборы не подчиняются теме ───────────────────────────────
   Чек, табло терминала и плита карточки гостя — физические предметы со
   своим материалом, а не поверхности интерфейса. Чек светлый в обеих
   темах, табло тёмное в обеих. Корпус табло брался из --accent, а он в
   тёмной теме светлый: прибор выворачивался наизнанку, тёмный экран
   оказывался в белой рамке. */
.pay-screen,.ci-term{
  --accent:#23211D;--accent-ink:#EDEAE3;
  --glass-1:#2B2925;--glass-2:#1D1B18;--glass-3:#1A1815;
  --band-ink:#EDEAE3;--band-ink-2:#A39C90;--band-ink-3:#8C8478;
}

/* Чек остаётся физической светлой бумагой даже в вечерней кассе. */
.rc,.rc-fly{
  --paper:#EBEAE6;--card:#FFFFFF;--sunk:#E1E0DA;--tape:#FCFBF7;
  --rule:#C9C6BE;--rule-2:#EDECE8;
  --ink:#191815;--ink-2:#57534B;--ink-3:#7D7871;
  --ok:#1E5540;--ok-bg:#E9F1EC;--ok-line:#BED4C9;
  --wait:#8A5406;--wait-bg:#FBF0DC;--wait-line:#E6D2A3;
  color-scheme:light;
}

@media(prefers-reduced-transparency:reduce){
  html[data-ui-theme="dark"] :is(.side,.top,.cal-top,.gs-top,.sheet,.dlg,.pop){
    -webkit-backdrop-filter:none;backdrop-filter:none;
  }
  html[data-ui-theme="dark"] .side{background:var(--paper)}
  html[data-ui-theme="dark"] .top{background:var(--paper)}
  html[data-ui-theme="dark"] :is(.cal-top,.gs-top,.sheet,.dlg,.pop){background:var(--card)}
}

@media(prefers-contrast:more){
  html[data-ui-theme="dark"]{--rule:#9C958A;--rule-2:#746E64}
  html[data-ui-theme="dark"] :is(.sheet,.dlg,.pop){border-color:var(--rule)}
}

@media print{
  html[data-ui-theme="dark"]{
    --paper:#FFFFFF;--card:#FFFFFF;--sunk:#F1F0EC;
    --rule:#C9C6BE;--rule-2:#EDECE8;
    --ink:#191815;--ink-2:#57534B;--ink-3:#7D7871;
  }
}
