/* © 2026 VEYRO (ИП Макаров И. В.). appagent — проприетарная программа. Использование — по лицензионному договору https://appagent.ru/legal/offer/. Копирование и распространение без разрешения запрещены. */
/* Экран «Проекты» (макет Projects.dc): сводка, вкладки-фильтры со счётчиками и сетка белых плашек. Подключён в index.html после overview.css;
   значения — только из tokens.css, размеры в rem. Плашка — общий класс .tile из base.css (белая, рамка-тень 1 px, отступ --tile-pad; на ссылке class="tile prj-tile").
   Состояние — точка и серое слово (.ui-status из kit.css), прогресс — полоса 3 px (.ui-progress), числа — шрифтом чисел; цветных пилюль и заливок нет.
   Заголовок экрана и ошибка связи — общие, лежат в screens.css. Префикс prj- (pj- занят листом «Проект» в project.css).
   Ниже, после плашек, остались строки .plist/.pcard__*: их использует экран «Обзор». */

/* ---------- Сводка под заголовком ---------- */
.prj-sum { display: flex; flex-wrap: wrap; gap: var(--space-1) var(--space-5); color: var(--color-ink2); font: var(--text-ui-weight) var(--text-ui-size)/var(--text-ui-line) var(--font-sans); }
.prj-sum[hidden] { display: none; }
.prj-sum__a { color: var(--color-ink); font-weight: var(--weight-medium); }

/* ---------- Вкладки-фильтры: подчёркнутые вкладки kit (.ui-seg) со счётчиками шрифтом чисел ---------- */
.prj-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-2) var(--space-6); margin-bottom: var(--space-6); }
.prj-bar[hidden] { display: none; }
.prj-hint { margin: 0; }
.ui-seg.prj-seg { flex: 1 1 auto; min-width: 0; }
.prj-seg .ui-seg__b { white-space: nowrap; }
.prj-seg .ui-seg__n { font-family: var(--font-num); font-size: var(--text-label-size); }

/* ---------- Сетка плашек: 3 колонки на 1440, 1 на 390 ---------- */
.prj-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(20rem, 100%), 1fr)); gap: var(--tile-gap); list-style: none; margin: 0; padding: 0; }
.prj-grid > li { display: flex; min-width: 0; }
.prj-tile {
  display: flex; flex-direction: column; gap: var(--space-4); width: 100%; min-height: var(--size-touch-min);
  color: inherit; text-decoration: none;
  transition: transform var(--duration-base) var(--ease-out), box-shadow var(--duration-fast) var(--ease-out);
}
.prj-tile > * { min-width: 0; }
.prj-tile:hover { transform: translateY(calc(var(--space-1) * -0.5)); box-shadow: 0 0 0 1px var(--color-line2); }
.prj-tile:focus-visible { border-radius: var(--tile-radius); }

.prj-tile__top { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-3); }
.prj-id { display: flex; align-items: baseline; gap: var(--space-2); min-width: 0; }
.prj-name { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--color-ink); font-size: var(--text-h3-size); }
.prj-badge { flex: none; color: var(--color-acc-text); font: var(--weight-medium) var(--text-label-size)/1 var(--font-num); font-variant-numeric: var(--num-features); }
.prj-status { flex: none; display: flex; }
.prj-doing { color: var(--color-ink); font: var(--text-caption-weight) var(--text-caption-size)/var(--text-caption-line) var(--font-sans); overflow-wrap: anywhere; }

.prj-stage { display: grid; gap: var(--space-2); }
.prj-stage__t { font-size: var(--text-label-size); }
.prj-meter { height: var(--size-progress); }

.prj-meta { display: flex; flex-wrap: wrap; gap: var(--space-1) var(--space-4); color: var(--color-ink2); }
.prj-meta__i { min-width: 0; overflow-wrap: anywhere; }
.prj-meta .mono { font-size: inherit; color: var(--color-ink); }
.prj-meta__i[data-kind="rc"]::before {
  content: ""; display: inline-block; width: var(--size-dot); height: var(--size-dot); margin-right: var(--space-2);
  border-radius: var(--radius-round); background: var(--color-ink3); vertical-align: middle;
}
.prj-meta__i[data-rc="active"]::before { background: var(--color-dot-ok); }
.prj-meta__i[data-rc="starting"]::before { background: var(--color-dot-wait); }
.prj-meta__i[data-rc="failed"]::before { background: var(--color-danger); }

.prj-foot {
  display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--space-1) var(--space-3);
  margin-top: auto; padding-top: var(--space-3); border-top: 1px solid var(--color-line); color: var(--color-ink2);
}
.prj-foot__c { display: flex; flex-wrap: wrap; gap: var(--space-1) var(--space-3); }
.prj-foot .mono { font-size: inherit; color: var(--color-ink); }

@media (max-width: 47.9375rem) {
  .prj-hint { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .prj-tile { transition: none; }
  .prj-tile:hover { transform: none; }
}

/* ---------- Строки списка: экран «Обзор» (решения и «Идёт сейчас») ---------- */
.plist, .list.plist { display: grid; gap: 0; }
.plist > li, .list.plist > li { display: block; padding: 0; min-height: 0; }
.plist > li { border-top: 1px solid var(--color-line); }
.list.plist > li:first-child { border-top: 0; }
.plist > li:hover { background: var(--color-panel2); }
.pcard__a {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3) var(--space-4);
  height: 100%; min-height: var(--size-control); padding: var(--space-4) var(--space-6);
  color: inherit; text-decoration: none;
}
.pcard__a:focus-visible { outline-offset: calc(var(--size-focus-offset) * -1); }
.pcard__main { flex: 1 1 10rem; min-width: 0; display: grid; gap: var(--space-1); }
.pcard__meta { color: var(--color-ink3); font: var(--text-caption-weight) var(--text-label-size)/var(--text-caption-line) var(--font-sans); overflow-wrap: anywhere; }
.pcard__meta .mono { font-size: inherit; color: inherit; }
.pcard__name { overflow-wrap: anywhere; }
.pcard__now { color: var(--color-ink2); font: var(--text-caption-weight) var(--text-caption-size)/var(--text-caption-line) var(--font-sans); overflow-wrap: anywhere; }
.pcard__counts { display: flex; flex-wrap: wrap; gap: var(--space-1) var(--space-4); margin-top: var(--space-1); color: var(--color-ink3); font: var(--text-caption-weight) var(--text-label-size)/var(--text-caption-line) var(--font-sans); }
.pcard__counts .mono { font-size: inherit; color: inherit; }
.pcard__side { margin-left: auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: var(--space-1) var(--space-4); }
.pcard__time { white-space: nowrap; color: var(--color-ink3); font-size: var(--text-label-size); }
@media (max-width: 40rem) {
  .pcard__a { padding: var(--space-4); }
  .pcard__side { margin-left: 0; justify-content: flex-start; }
}

/* Блок групп прежнего вида экрана: на него ещё ссылается проверка каркаса (tests/pult-shell.test.mjs). */
.pgroups { background: var(--color-panel); border: 1px solid var(--color-line); border-radius: var(--radius-lg); overflow: hidden; }