/* ============================================================================
   Г1 · КАРКАС. Подключается ПОСЛЕ brand.css и перекрывает его.
   Здесь только то, что увидено глазом на снимках 01.09.2026, и то, что
   попросил V: свёрнутое меню как отдельный намеренный вид + значки пунктов.
   Палитра не заводится своя — берутся переменные brand.css.
   ========================================================================== */

:root{
  /* 64, а не 56: мишень нажатия ≥44 px требует поля по 10 вокруг значка 18,
     плюс красная полоса активного 3 px слева не должна лезть под значок. */
  --shell-w-min:64px;
}

/* ── ЗНАК СВЁРНУТОГО ВИДА ───────────────────────────────────────────────────
   В широкой колонке стоит замок «ЛАМИНА AI × САНТАН» из двух словесных
   логотипов. В 64 px словесный логотип нечитаем в принципе — уменьшать его
   значило бы выдавать обрубок за решение. Поэтому у узкого вида СВОЙ знак:
   торец плиты (тот же элемент, что в lamina.svg) и имя арендатора набором
   в разрядку. Знак — не картинка, а инлайновый SVG, поэтому наследует цвет. */
.shell-sign,.shell-sign-t{display:none}
.shell-sign{color:var(--ink);line-height:0}
.shell-sign-t{font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink-2);line-height:1;margin-top:7px;white-space:nowrap}

/* ── СВЁРНУТОЕ СОСТОЯНИЕ ────────────────────────────────────────────────────
   Два входа в него: кнопка (html[data-menu=collapsed]) и узкое окно (≤1180).
   Правила общие, поэтому написаны один раз через :where(). */
html[data-menu="collapsed"] .shell{grid-template-columns:var(--shell-w-min) minmax(0,1fr)}

html[data-menu="collapsed"] .shell-brand{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  height:78px;padding:0;gap:0}
html[data-menu="collapsed"] .lockup{flex-direction:column;align-items:center;gap:0;width:auto}
html[data-menu="collapsed"] .lockup img.mark,
html[data-menu="collapsed"] .lockup img.tenant,
html[data-menu="collapsed"] .lockup .x{display:none}
html[data-menu="collapsed"] .shell-sign,
html[data-menu="collapsed"] .shell-sign-t{display:block}

/* пункт: квадратная мишень 44×44, значок ровно по центру */
html[data-menu="collapsed"] .shell-item a{
  display:flex;align-items:center;justify-content:center;
  padding:0;min-height:44px;margin:2px 6px;border-radius:var(--r-m);
  border-left:0;box-shadow:none;position:relative}
html[data-menu="collapsed"] .shell-icon{flex:0 0 20px;padding:0;justify-content:center}
html[data-menu="collapsed"] .shell-item.is-here a{
  background:var(--surface);box-shadow:0 1px 2px rgba(18,21,26,.06)}
/* состояние не только цветом: у активного слева остаётся красная засечка */
html[data-menu="collapsed"] .shell-item.is-here a::before{
  content:"";position:absolute;left:-6px;top:50%;transform:translateY(-50%);
  width:3px;height:22px;border-radius:0 2px 2px 0;background:var(--red)}
html[data-menu="collapsed"] .shell-item.is-here .shell-icon{color:var(--red-text)}
html[data-menu="collapsed"] .shell-sub{margin-top:10px;padding-top:10px}
html[data-menu="collapsed"] .shell-sub-head{display:none}
html[data-menu="collapsed"] .shell-foot{justify-content:center;padding:10px 0}
html[data-menu="collapsed"] .shell-out{font-size:12px}

/* то же самое, когда узко само окно */
@media (max-width:1180px) and (min-width:721px){
  .shell{grid-template-columns:var(--shell-w-min) minmax(0,1fr)}
  .shell-brand{display:flex;flex-direction:column;align-items:center;justify-content:center;
    height:78px;padding:0;gap:0}
  .lockup{flex-direction:column;align-items:center;gap:0;width:auto}
  .lockup img.mark,.lockup img.tenant,.lockup .x{display:none}
  .shell-sign,.shell-sign-t{display:block}
  .shell-item a{display:flex;align-items:center;justify-content:center;padding:0;
    min-height:44px;margin:2px 6px;border-radius:var(--r-m);border-left:0;position:relative}
  .shell-icon{flex:0 0 20px;padding:0;justify-content:center}
  .shell-item.is-here a{background:var(--surface);box-shadow:0 1px 2px rgba(18,21,26,.06)}
  .shell-item.is-here a::before{content:"";position:absolute;left:-6px;top:50%;
    transform:translateY(-50%);width:3px;height:22px;border-radius:0 2px 2px 0;background:var(--red)}
  .shell-item.is-here .shell-icon{color:var(--red-text)}
  .shell-sub-head{display:none}
}

/* ── ЗНАЧКИ ВЕРХНЕГО МЕНЮ ───────────────────────────────────────────────────
   Разметка их даёт всегда (макрос znak в shell.html), CSS только выравнивает.
   В широком виде значок стоит по верхней строке имени, а не по центру блока
   из двух строк — иначе он «плывёт» вниз относительно названия. */
.shell-icon{flex:0 0 18px;display:flex;justify-content:center;align-items:center;
  height:18px;padding:0;margin-top:1px;color:var(--grey)}
.shell-icon svg{display:block}
.shell-item a:hover .shell-icon{color:var(--ink-2)}
.shell-item.is-here .shell-icon{color:var(--red-text)}
.shell-item.is-later .shell-icon{opacity:.7}

/* ── ПОДСКАЗКА В УЗКОЙ КОЛОНКЕ ─────────────────────────────────────────────
   Ярлык живёт в body, не в колонке: у колонки overflow:hidden, внутри её
   подсказку срезало бы по 64 px. Текст тот же, что в aria-label, поэтому
   читалке экрана он не нужен — role=presentation. */
.shell-tip{position:fixed;z-index:80;max-width:280px;pointer-events:none;
  padding:7px 10px;border-radius:var(--r-s);
  background:var(--graphite-hi);color:#fff;   /* 14,8:1 — белое на #1b212d */
  font-family:var(--font);font-size:12.5px;line-height:1.35;
  box-shadow:0 8px 24px -12px rgba(18,21,26,.6);
  opacity:0;transform:translateX(-4px);
  transition:opacity 140ms var(--ease),transform 140ms var(--ease)}
.shell-tip.is-on{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.shell-tip{transition:none}}

/* ── ТЕЛЕФОН ───────────────────────────────────────────────────────────────
   Колонка не «сворачивается», а ложится лентой значков сверху: одна строка,
   которая едет вбок внутри себя, а не ломает страницу. Знак и имя арендатора
   стоят слева якорем, «Выйти» — справа. Проверено на 390 px. */
@media (max-width:720px){
  html[data-menu="collapsed"] .shell{grid-template-columns:minmax(0,1fr)}
  .shell-side,html[data-menu="collapsed"] .shell-side{
    position:sticky;top:0;z-index:20;height:auto;flex-direction:row;align-items:stretch;
    overflow:visible;border-right:0;border-bottom:1px solid var(--line)}

  .shell-brand,html[data-menu="collapsed"] .shell-brand{
    flex:0 0 auto;flex-direction:row;align-items:center;gap:8px;height:52px;
    padding:0 10px;border-bottom:0;border-right:1px solid var(--line)}
  .lockup,html[data-menu="collapsed"] .lockup{flex-direction:row;align-items:center;gap:8px}
  .lockup img.mark,.lockup img.tenant,.lockup .x{display:none}
  .shell-sign,.shell-sign-t,
  html[data-menu="collapsed"] .shell-sign,html[data-menu="collapsed"] .shell-sign-t{display:block}
  .shell-sign svg{width:18px;height:23px}
  .shell-sign-t{margin-top:0;font-size:9px}

  .shell-toggle{display:none}   /* сворачивать нечего: лента и так узкая */

  /* лента: один ряд, прокрутка вбок внутри ленты */
  .shell-menu{flex:1 1 auto;display:flex;align-items:stretch;padding:0;
    overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}
  .shell-list{display:flex;flex:0 0 auto;align-items:stretch}
  .shell-sub{display:flex;flex:0 0 auto;margin:0;padding:0 0 0 6px;
    border-top:0;border-left:1px solid var(--line)}
  .shell-sublist{display:flex}
  .shell-group,.shell-sub-head{display:none}

  .shell-item a,html[data-menu="collapsed"] .shell-item a{
    display:flex;align-items:center;justify-content:center;
    min-height:52px;min-width:48px;margin:0;padding:0 12px;
    border-radius:0;border-left:0;box-shadow:none}
  .shell-item.is-here a,html[data-menu="collapsed"] .shell-item.is-here a{
    background:var(--surface);box-shadow:none}
  .shell-item.is-here a::before,
  html[data-menu="collapsed"] .shell-item.is-here a::before{
    left:0;right:0;top:auto;bottom:0;transform:none;width:auto;height:3px;border-radius:0}

  .shell-foot,html[data-menu="collapsed"] .shell-foot{
    flex:0 0 auto;border-top:0;border-left:1px solid var(--line);
    padding:0 12px;align-items:center}
  .shell-tip{display:none}   /* на сенсоре наведения нет — ярлык был бы обманом */
}

/* ============================================================================
   ПО ЖУРНАЛУ ДЕФЕКТОВ (партия 1 от Г4)
   ========================================================================== */

/* D-4 · Приглушённый текст был #898f97 — на белом это 3,26:1 при норме 4,5.
   Им набраны подписи плиток, ВСЕ шапки таблиц, .muted, .note, даты. Правка
   одна: поднимаем сам токен. Палитра фирменная не трогается — #898f97 не
   фирменный цвет клиента, это наш служебный серый.
     #697078 на #fff ..... 5,01:1
     #697078 на #f6f6f4 .. 4,63:1  (подложка меню и карточек — тоже проходит)
   #6b7280 брать нельзя: на тёплом #f6f6f4 он даёт 4,47 — недобор. Посчитано. */
:root{--grey:#697078}

/* D-3 · Вертикальная вкладка «Копилот» приклеена к правому краю окна и лежит
   поверх таблиц. Она fixed и своей ширины не отдаёт — значит место под неё
   должно оставить содержимое. Плюс буква «К» упиралась в рамку. */
/* Вкладка боковая только шире 900: ниже copilot.css (строка 159) превращает её
   в плавающую пилюлю у нижнего края, и место надо отдавать не справа, а снизу. */
@media (min-width:901px){
  .shell-content{padding-right:72px}
  .shell-top{padding-right:72px}
}
.cp-fab{padding:16px 11px;line-height:1.25}

/* D-39 · На узких ширинах пилюля «Копилот» висит на bottom:18 и высотой ~42 px
   ложится поверх последних строк содержимого (шапка таблицы «Заказы» на «/»,
   абзац .s-now-a на /projects/1). Пилюля fixed — своей высоты потоку не отдаёт,
   значит запас снизу оставляет каркас: 18 (её отступ) + 42 (её высота) +
   44 (чтобы под ней не оказалось даже края строки) = 104.
   Причина в чужом файле не лечится: copilot.css:159 задаёт саму пилюлю, а вот
   отступ под неё — дело того, кто владеет полем содержимого, то есть каркаса. */
@media (max-width:900px){
  .shell-content{padding-bottom:104px}
  .cp-fab{padding:11px 18px}
}

/* D-29 · Подменю проекта упиралось в подвал, и не было видно, что список
   прокручивается. Прокрутка есть, но её нечем заметить — добавляем тень-край
   у нижней границы области меню: край показывает, что ниже ещё есть работа. */
.shell-menu{scrollbar-gutter:stable}
.shell-foot{box-shadow:0 -10px 12px -12px rgba(18,21,26,.45)}