/* dz/dz.css — ОБЩАЯ дизайн-система сайта ai.lteam.ru: один на все
 * страницы (витрина, чат, кабинет) [слово владельца 01.11: «сайдбар как
 * шапка сайта живёт один на все страницы отдельно»]. Bahnschrift, чёрный
 * + шампань, тонкие линии, ASCII-фон, контейнеры-стёкла. Токены и все
 * классы dz-*. Меняется в ОДНОМ месте. */
/* ── Дизайн-система витрины: Bahnschrift, чёрный + шампань, тонкие
     линии. Токены локальные — оболочку ядра не трогаем; оболочку прячем
     целиком: у витрины свой левый сайдбар. День — переопределение токенов
     на body [11.2]; язык — свои запасные шрифты [11.3]. ── */
  :root {
    --dz-fon: #0a0c0e;
    --dz-panel: #11151a;
    --dz-liniya: #2a2f34;
    --dz-tekst: #d6dde3;
    --dz-tusklo: #87929b;
    --dz-shampan: #d8c9a3;
    --dz-shrift: "Bahnschrift", "Bahnschrift SemiCondensed", "Bahnschrift Condensed", "Arial Narrow", "Segoe UI", sans-serif;
  }
  /* ДЕНЬ [11.2]: тёплая бумага вместо чёрного, латунь вместо шампани. */
  body[data-dz-rezhim="den"] {
    --dz-fon: #f3efe7;
    --dz-panel: #faf7f0;
    --dz-liniya: #d9d2c2;
    --dz-tekst: #26292d;
    --dz-tusklo: #6e757c;
    --dz-shampan: #8a7440;
  }
  /* КИТАЙСКИЙ [11.3]: Bahnschrift без CJK — запасные шрифты системы. */
  body[data-dz-yaz="zh"] {
    --dz-shrift: "Bahnschrift", "Microsoft YaHei", "PingFang SC", "Noto Sans SC", "Segoe UI", sans-serif;
  }
  /* ВЬЕТНАМСКИЙ: диакритика — в Segoe UI, если Bahnschrift её не держит. */
  body[data-dz-yaz="vi"] {
    --dz-shrift: "Bahnschrift", "Segoe UI", "Arial Narrow", sans-serif;
  }
  body:has(.dz-vitrina) .sidebar,
  body:has(.dz-vitrina) .top-bar,
  body.dz-stranica .sidebar,
  body.dz-stranica .top-bar { display: none !important; }
  body:has(.dz-vitrina),
  body.dz-stranica {
    overflow: auto !important;
    background: var(--dz-fon) !important;
  }
  body:has(.dz-vitrina) .fw-container,
  body.dz-stranica .fw-container {
    max-width: none !important; padding: 0 !important; margin: 0 !important;
  }

  /* ── ASCII-фон: холст под всем содержимым ── */
  #dz-fon { position: fixed; inset: 0; z-index: 0; pointer-events: none; }

  .dz-vitrina {
    position: relative; z-index: 1;
    font-family: var(--dz-shrift);
    color: var(--dz-tekst);
    font-stretch: semi-condensed;
    letter-spacing: .01em;
  }

  /* ── Левый сайдбар: складывается в рельсу, ширина тянется за край.
     Хром сайдбара не выделяется мышью [11.5] — текстовый курсор у
     лямбды исчез вместе с выделением. ── */
  .dz-sb {
    position: fixed; top: 0; left: 0; bottom: 0; z-index: 30;
    width: var(--dz-sb-shirina, 280px);
    font-family: var(--dz-shrift);
    background: color-mix(in srgb, var(--dz-panel) 94%, transparent);
    border-right: 1px solid var(--dz-liniya);
    display: flex; flex-direction: column;
    transition: width .18s ease;
    overflow: hidden;
    user-select: none; -webkit-user-select: none;
  }
  .dz-sb.dz-svernut { width: 56px; }
  .dz-sb-kray {
    position: absolute; right: -3px; top: 0; bottom: 0; width: 9px;
    cursor: col-resize; z-index: 5;
  }
  .dz-sb-kray:hover { background: color-mix(in srgb, var(--dz-shampan) 22%, transparent); }
  /* Grip по серединке края [11.7]: виден, что край двигается. */
  .dz-sb-kray::after {
    content: '⋮'; position: absolute; top: 50%; left: 1px;
    transform: translateY(-50%);
    font-size: 14px; line-height: 1; letter-spacing: 2px;
    color: var(--dz-tusklo); opacity: .75; pointer-events: none;
    transition: color .2s, opacity .2s;
  }
  .dz-sb-kray:hover::after { color: var(--dz-shampan); opacity: 1; }
  .dz-sb-shapka {
    display: flex; align-items: center; gap: 10px;
    padding: 18px 14px 14px; border-bottom: 1px solid var(--dz-liniya);
    white-space: nowrap;
  }
  /* Логотип — кнопка λ: клик сворачивает/разворачивает сайдбар. */
  .dz-sb-logotip {
    display: flex; align-items: center; gap: 10px;
    background: none; border: none; padding: 0; margin: 0;
    cursor: pointer; font-family: var(--dz-shrift); text-align: left;
    flex-shrink: 0;
  }
  /* Лямбда = длина волны и период полураспада [идея владельца 01.11]:
     в кружке логотипа живёт БЕГУЩАЯ ЗАТУХАЮЩАЯ СИНУСОИДА — амплитуда
     падает вдвое за период полураспада, волна мерцает и ползёт. Рисует
     dz.js, холст один на страницу. */
  .dz-sb-lambda { display: block; width: 24px; height: 24px;
                  cursor: pointer; }
  .dz-sb-lambda.dz-lambda-sv { width: 24px; height: 24px; }
  .dz-sb-logotip { position: relative; }
  /* кольцо — как у круглых кнопок языка и варианта фона */
  .dz-sb-logotip::before {
    content: ''; position: absolute; inset: -5px; border-radius: 50%;
    border: 1px solid transparent; border-top-color: var(--dz-shampan);
    opacity: .3; animation: dz-vrash 3.4s linear infinite;
    pointer-events: none;
  }
  .dz-sb-logotip:hover::before { opacity: .95; }
  .dz-sb-logotip:hover .dz-sb-lambda.dz-lambda-sv {
    filter: drop-shadow(0 0 6px rgba(216, 201, 163, .45));
  }
  /* Имя — ссылка домой [11.6]: из любой панели на главную. */
  .dz-sb-imya { font-size: 15px; letter-spacing: .18em; color: var(--dz-shampan);
                font-weight: 600; white-space: nowrap; text-decoration: none;
                cursor: pointer; }
  .dz-sb-imya:hover { filter: brightness(1.15); }
  .dz-sb-imya small { font-size: 10px; color: var(--dz-tusklo); letter-spacing: .12em; }
  /* При схлопывании всё ПРИЖАТО К ЛЕВОМУ КРАЮ [11.2], ничего не центрируется;
     подписи гаснут плавно (правила выше), раскладка не прыгает. */

  .dz-sb-nav { display: flex; flex-direction: column; padding: 14px 8px; gap: 2px;
               border-bottom: 1px solid var(--dz-liniya); }
  .dz-sb-nav a {
    display: flex; align-items: center; gap: 12px;
    padding: 9px 10px; border-radius: 6px; text-decoration: none;
    color: var(--dz-tusklo); font-size: 13px; letter-spacing: .12em;
    text-transform: uppercase; white-space: nowrap;
    border: 1px solid transparent;
    /* паддинги переходят вместе с шириной: иконки не щёлкают влево */
    transition: padding .18s ease;
  }
  .dz-sb-nav a:hover { color: var(--dz-shampan); border-color: var(--dz-liniya); }
  .dz-sb-nav .dz-ikona { width: 22px; text-align: center; flex-shrink: 0;
                         font-size: 14px; }
  .dz-sb.dz-svernut .dz-sb-nav a { padding: 9px 4px; }
  /* Подписи не прячутся мгновенно: ширина уезжает — подписи гаснут
     следом и просто обрезаются краем сайдбара. Дёрганья строк нет
     [замечание владельца 01.11: «ряды скачут лево-право»]. */
  .dz-sb-nav a span:not(.dz-ikona), .dz-sb-imya, .dz-sb-niz .dz-sb-podpis,
  .dz-akkount .dz-imya, .dz-akkount .dz-vyhod, .dz-ikony {
    transition: opacity .14s ease .06s;
  }
  .dz-sb.dz-svernut .dz-sb-nav a span:not(.dz-ikona),
  .dz-sb.dz-svernut .dz-sb-imya,
  .dz-sb.dz-svernut .dz-sb-niz .dz-sb-podpis,
  .dz-sb.dz-svernut .dz-akkount .dz-imya,
  .dz-sb.dz-svernut .dz-akkount .dz-vyhod,
  .dz-sb.dz-svernut .dz-ikony {
    opacity: 0; pointer-events: none;
    transition: opacity .08s ease;
  }

  /* ── Три круглые иконки [11]: вариант фона, режим, язык. Кольцо
     вращается неспешно и всегда — живой значок, как в чате консоли;
     при наведении — ярче. ── */
  .dz-ikony { display: flex; gap: 9px; padding: 14px 12px;
              border-bottom: 1px solid var(--dz-liniya); }
  .dz-krug {
    position: relative; width: 34px; height: 34px; border-radius: 50%;
    border: 1px solid var(--dz-liniya); background: transparent;
    color: var(--dz-tusklo); cursor: pointer; padding: 0;
    font-family: var(--dz-shrift); font-size: 13px; line-height: 1;
    display: flex; align-items: center; justify-content: center;
    transition: color .2s, border-color .2s;
  }
  .dz-krug::before {
    content: ''; position: absolute; inset: -4px; border-radius: 50%;
    border: 1px solid transparent; border-top-color: var(--dz-shampan);
    opacity: .3; animation: dz-vrash 3.4s linear infinite;
    pointer-events: none;
  }
  .dz-krug:hover { color: var(--dz-shampan); border-color: var(--dz-shampan); }
  .dz-krug:hover::before { opacity: .9; }
  @keyframes dz-vrash { to { transform: rotate(360deg); } }
  .dz-krug .dz-yaz-znak { font-size: 10px; letter-spacing: .06em; font-weight: 600; }

  .dz-sb-niz { margin-top: auto; padding: 14px; border-top: 1px solid var(--dz-liniya);
               display: grid; gap: 10px; }
  .dz-akkount {
    display: flex; align-items: center; gap: 10px; white-space: nowrap;
    padding: 9px 10px; border-radius: 6px; border: 1px solid var(--dz-liniya);
    text-decoration: none; color: var(--dz-tekst); font-size: 13px;
    cursor: pointer;
    transition: padding .18s ease, border-color .2s;
  }
  .dz-akkount:hover { border-color: var(--dz-shampan); }
  .dz-akkount .dz-svg { color: var(--dz-shampan); flex-shrink: 0; }
  .dz-akkount .dz-imya { overflow: hidden; text-overflow: ellipsis; letter-spacing: .04em; }
  .dz-sb.dz-svernut .dz-akkount { padding: 9px 4px; gap: 0; }
  .dz-vyhod { background: none; border: none; color: var(--dz-tusklo); cursor: pointer;
              padding: 2px; margin-left: auto; font-family: var(--dz-shrift);
              display: flex; align-items: center; }
  .dz-vyhod .dz-svg { color: var(--dz-tusklo); transition: color .2s; }
  .dz-vyhod:hover .dz-svg { color: #d98a8a; }
  body[data-dz-rezhim="den"] .dz-vyhod:hover .dz-svg { color: #a03030; }
  /* Подпись внизу — по центру, в одну строку [11.8]: при схлопывании
     прячется красиво, без прыжка на новую строку. */
  .dz-sb-podpis { font-size: 10px; color: var(--dz-tusklo); letter-spacing: .14em;
                  text-transform: uppercase; white-space: nowrap;
                  text-align: center; overflow: hidden; }

  /* ── Контент: справа от сайдбара ── */
  .dz-glav { margin-left: var(--dz-sb-shirina, 280px); min-height: 100vh;
             transition: margin .18s ease; }
  body.dz-svernut .dz-glav, .dz-sb.dz-svernut ~ .dz-glav { margin-left: 56px; }
  .dz-list { max-width: 1060px; margin: 0 auto; padding: 0 34px 80px; }

  .dz-geroy { padding: 90px 0 60px; }
  .dz-nadpis { font-size: 12px; letter-spacing: .42em; text-transform: uppercase;
               color: var(--dz-shampan); margin: 0 0 20px; }
  .dz-geroy h1 {
    font-size: clamp(34px, 5.2vw, 66px); line-height: 1.04; margin: 0 0 22px;
    color: var(--dz-tekst); font-weight: 600; text-transform: uppercase;
    letter-spacing: .02em; font-stretch: condensed;
  }
  .dz-geroy h1 .dz-tusklo { color: var(--dz-tusklo); font-weight: 300; }
  /* Вторая строка героя — подзаголовок по слову владельца 31.10. */
  .dz-geroy h1 .dz-vtoraya { display: block; margin-top: 12px;
                             font-size: .34em; letter-spacing: .2em;
                             font-weight: 300; color: var(--dz-tusklo); }
  .dz-cherha { width: 74px; height: 2px; background: var(--dz-shampan); margin: 0 0 24px; }
  .dz-geroy p.dz-vedet { font-size: 16px; line-height: 1.7; max-width: 620px;
                         color: var(--dz-tekst); opacity: .88; margin: 0 0 30px; }
  .dz-knopki { display: flex; gap: 14px; flex-wrap: wrap; }
  .dz-knopka {
    display: inline-block; padding: 12px 26px; border-radius: 2px;
    border: 1px solid var(--dz-liniya); color: var(--dz-tekst);
    text-decoration: none; font-size: 13px; letter-spacing: .18em;
    text-transform: uppercase; background: transparent; cursor: pointer;
    font-family: var(--dz-shrift); transition: border-color .2s, color .2s, background .2s;
  }
  .dz-knopka:hover { border-color: var(--dz-shampan); color: var(--dz-shampan); }
  .dz-knopka.dz-glavnaya { background: var(--dz-shampan); color: #0a0c0e;
                           border-color: var(--dz-shampan); font-weight: 600; }
  .dz-knopka.dz-glavnaya:hover { filter: brightness(1.08); }
  body[data-dz-rezhim="den"] .dz-knopka.dz-glavnaya { color: #f3efe7; }

  /* Компактная карточка входа в герое [11.9]: раскрывается кнопкой
     «Войти», по умолчанию спрятана. */
  .dz-karta-vhod { border: 1px solid var(--dz-liniya);
                   border-left: 2px solid var(--dz-shampan);
                   padding: 22px; max-width: 480px;
                   background: color-mix(in srgb, var(--dz-panel) 72%, transparent);
                   backdrop-filter: blur(3px); margin-top: 26px; }
  .dz-karta-vhod h3 { margin: 0 0 4px; color: var(--dz-tekst); font-size: 19px;
                      text-transform: uppercase; letter-spacing: .08em; }
  .dz-karta-vhod .dz-podpis { margin-bottom: 14px; }
  .dz-pole { width: 100%; box-sizing: border-box; padding: 12px 14px; margin-bottom: 10px;
             background: var(--dz-fon); color: var(--dz-tekst);
             border: 1px solid var(--dz-liniya); border-radius: 2px;
             font-family: var(--dz-shrift); font-size: 14px; letter-spacing: .08em; outline: none; }
  .dz-pole:focus { border-color: var(--dz-shampan); }
  .dz-status { min-height: 18px; font-size: 11px; letter-spacing: .1em;
               text-transform: uppercase; margin-top: 10px; color: var(--dz-tusklo); }
  .dz-status.dz-beda { color: #d98a8a; }
  .dz-status.dz-uda { color: #9dc8a2; }
  .dz-podskazka { font-size: 11px; color: var(--dz-shampan); min-height: 14px; }

  .dz-razdel { margin-top: 80px; padding-top: 26px; border-top: 1px solid var(--dz-liniya);
               scroll-margin-top: 30px; }
  .dz-nomer { font-size: 11px; letter-spacing: .3em; color: var(--dz-shampan);
              margin: 0 0 8px; }
  .dz-zagolovok { font-size: 30px; margin: 0 0 6px; color: var(--dz-tekst);
                  text-transform: uppercase; letter-spacing: .04em; font-weight: 600;
                  font-stretch: condensed; }
  .dz-podpis { color: var(--dz-tusklo); font-size: 13px; margin: 0 0 22px; }

  .dz-plitki { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
               gap: 1px; background: var(--dz-liniya); border: 1px solid var(--dz-liniya); }
  .dz-plitka { background: color-mix(in srgb, var(--dz-fon) 58%, transparent);
              backdrop-filter: blur(2px); padding: 22px; }
  .dz-plitka .dz-znach { font-size: 20px; color: var(--dz-shampan); }
  .dz-plitka h3 { margin: 12px 0 8px; font-size: 15px; color: var(--dz-tekst);
                  text-transform: uppercase; letter-spacing: .1em; font-weight: 600; }
  .dz-plitka p { margin: 0; font-size: 13px; line-height: 1.65; color: var(--dz-tusklo); }

  .dz-lenta { display: grid; gap: 1px; background: var(--dz-liniya);
              border: 1px solid var(--dz-liniya); }
  .dz-zapis { background: color-mix(in srgb, var(--dz-fon) 58%, transparent);
             backdrop-filter: blur(2px); padding: 16px 20px; }
  .dz-zapis .dz-shapka { display: flex; gap: 12px; align-items: baseline;
                         flex-wrap: wrap; margin-bottom: 6px; }
  .dz-zapis .dz-data { font-size: 11px; color: var(--dz-tusklo); letter-spacing: .14em; }
  .dz-zapis h4 { margin: 0 0 6px; font-size: 15px; color: var(--dz-tekst); }
  .dz-zapis p { margin: 0; font-size: 13px; line-height: 1.65; color: var(--dz-tusklo); }
  .dz-reliz .dz-liniya-nadpis { font-size: 12px; color: var(--dz-tekst); font-weight: 600;
                                text-transform: uppercase; letter-spacing: .1em; }
  .dz-reliz .dz-versiya { font-size: 11px; color: var(--dz-shampan); letter-spacing: .1em; }

  .dz-skachivat { display: grid; gap: 1px; background: var(--dz-liniya);
                  border: 1px solid var(--dz-liniya); }
  .dz-skachat { display: flex; gap: 18px; align-items: flex-start;
              background: color-mix(in srgb, var(--dz-fon) 58%, transparent);
              backdrop-filter: blur(2px); padding: 20px; }
  .dz-skachat .dz-sk-tekst { flex: 1; }
  .dz-skachat h3 { margin: 0 0 6px; font-size: 16px; color: var(--dz-tekst);
                   text-transform: uppercase; letter-spacing: .08em; }
  .dz-skachat p { margin: 0 0 8px; font-size: 13px; line-height: 1.6; color: var(--dz-tusklo); }
  .dz-skachat ul { margin: 0 0 8px; padding-left: 18px; font-size: 12px; color: var(--dz-tusklo); }
  .dz-skachat li { margin: 2px 0; }
  .dz-st { font-size: 10px; text-transform: uppercase; letter-spacing: .14em;
           border-radius: 2px; padding: 3px 9px; white-space: nowrap;
           border: 1px solid var(--dz-liniya); }
  .dz-st-gotovo      { color: #9dc8a2; border-color: #9dc8a2; }
  .dz-st-gotovitsya  { color: var(--dz-shampan); border-color: var(--dz-shampan); }
  .dz-st-zamysel     { color: var(--dz-tusklo); }
  .dz-primechanie { font-size: 12px; color: var(--dz-tusklo); font-style: italic; }
  .dz-beda-razdela { border: 1px solid #d98a8a; padding: 12px 16px; color: #d98a8a;
                     font-size: 12px; }

  @media (max-width: 900px) {
    .dz-sb { width: 56px; border-right: 1px solid var(--dz-liniya); }
    .dz-sb .dz-sb-imya, .dz-sb .dz-sb-nav a span:not(.dz-ikona),
    .dz-sb .dz-sb-niz .dz-sb-podpis, .dz-sb .dz-ikony,
    .dz-sb .dz-akkount .dz-imya, .dz-sb .dz-akkount .dz-vyhod { opacity: 0; pointer-events: none; }
    .dz-sb .dz-sb-nav a { padding: 9px 4px; }
    .dz-sb .dz-akkount { padding: 9px 4px; gap: 0; }
    .dz-glav { margin-left: 56px; }
    .dz-list { padding: 0 20px 60px; }
    .dz-geroy { padding: 50px 0 40px; }
  }
  @media (prefers-reduced-motion: reduce) {
    #dz-fon { display: none; }
    .dz-krug::before { animation: none; }
  }

/* ── Баланс в сайдбаре [слово владельца 01.11: «над всеми иконками»] ── */
.dz-balans { display: grid; gap: 4px; padding: 10px 12px;
             border-bottom: 1px solid var(--dz-liniya); }
.dz-balans-stroka { display: flex; align-items: baseline; gap: 8px;
                    white-space: nowrap; }
.dz-balans-stroka b { color: var(--dz-shampan); font-size: 16px;
                      font-weight: 600; font-stretch: condensed; }
.dz-balans-stroka span { color: var(--dz-tusklo); font-size: 10px;
                         letter-spacing: .12em; text-transform: uppercase; }
.dz-sb.dz-svernut .dz-balans { display: none; }