/* © 2026 VEYRO (ИП Макаров И. В.). appagent — проприетарная программа. Использование — по лицензионному договору https://appagent.ru/legal/offer/. Копирование и распространение без разрешения запрещены. */
/* Раздел «Модули» и экран «Статьи» (#modules, #modules-articles). Подключён в index.html после phone.css; значения — только из tokens.css,
   размеры в rem. Плитки и чипы — из kit (tile, ui-chip, ui-kpi, ui-seg), здесь только раскладка. Классы с префиксом am-. */

.am { display: grid; gap: var(--tile-gap); align-content: start; }
.am > .head { margin-bottom: 0; }
.am-listhead { align-items: center; }
.am-strip { justify-self: start; }
.am-strip .ic { width: 1rem; height: 1rem; }
@media (min-width: 45.0625rem) { .am-strip { justify-self: end; } }

/* ---------- Список модулей ---------- */
.am-mods { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--tile-gap); }
@media (min-width: 48rem) { .am-mods { grid-template-columns: repeat(auto-fit, minmax(min(100%, 19rem), 1fr)); } }
.am-mod { display: grid; gap: var(--space-4); align-content: start; }
.am-mod__h { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--space-3); }
/* Плитка модуля: бейдж статуса всегда под названием, слева — одинаково для коротких («Установлен») и длинных («Можно установить») слов. */
.am-mod .am-mod__h { flex-direction: column; align-items: flex-start; flex-wrap: nowrap; gap: var(--space-3); }
.am-mod .am-mod__h .ui-chip { flex: none; }
.am-mod__t { display: flex; align-items: center; gap: var(--space-3); min-width: 0; }
.am-mod__t .h3 { margin: 0; overflow-wrap: anywhere; }
.am-mod__ico { flex: none; width: 2.5rem; height: 2.5rem; border-radius: var(--radius-sm); display: grid; place-items: center; background: var(--color-acc-soft); color: var(--color-acc-soft-text); }
.am-mod__ico svg { width: var(--size-icon); height: var(--size-icon); fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.am-mod .caption, .am-tile .caption, .am-kpi .caption { margin: 0; color: var(--color-ink2); }
.am-mod__facts { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.am-mod--link { position: relative; }
.am-mod--link:hover { background: var(--color-panel2); }
.am-mod__link { color: inherit; text-decoration: none; }
.am-mod__link::after { content: ''; position: absolute; inset: 0; border-radius: inherit; }
.am-mod__link:focus-visible { outline: none; }
.am-mod__link:focus-visible::after { outline: var(--size-focus-width) solid var(--color-focus); outline-offset: var(--size-focus-offset); }

/* ---------- Экран «Статьи» ---------- */
.am-head .head__acts { align-self: end; }
.am-back { display: inline-flex; align-items: center; min-height: var(--size-touch-min); text-decoration: none; }
.am-kicker { margin: 0; color: var(--color-ink2); }
.am-hint, .am-res { margin: 0; color: var(--color-ink2); }
.am-hint[hidden], .am-res:empty { display: none; }
.am-res[data-tone="ok"] { color: var(--color-ok-text); }
.am-res[data-tone="warn"] { color: var(--color-warn-text); }
.am [aria-disabled="true"] { cursor: not-allowed; }
.am .btn[aria-disabled="true"] { background: transparent; border-color: var(--color-line); color: var(--color-ink3); }
.am .btn--primary[aria-disabled="true"] { background: var(--color-panel2); }
.am .btn[aria-disabled="true"]:hover { background: transparent; border-color: var(--color-line); }

.am-sites { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.am-sites:empty { display: none; }
.am-site {
  display: inline-flex; align-items: center; gap: var(--space-2); min-height: var(--size-touch-min); padding-inline: var(--space-4);
  border-radius: var(--radius-pill); border: 1px solid var(--color-line2); background: transparent; color: var(--color-ink);
  font: var(--weight-medium) var(--text-ui-size)/1 var(--font-sans); cursor: pointer;
}
.am-site:hover:not([aria-disabled="true"]) { border-color: var(--color-ink); }
.am-site[aria-pressed="true"] { border-color: var(--color-acc); background: var(--color-acc-soft); color: var(--color-acc-soft-text); }
.am-site[aria-disabled="true"] { color: var(--color-ink2); border-style: dashed; }
.am-dot { width: var(--size-status-dot); height: var(--size-status-dot); border-radius: var(--radius-round); background: currentColor; flex: none; }
.am-dot--ok { color: var(--color-ok); }
.am-site__n { color: var(--color-ink3); font-weight: var(--weight-regular); }
.am-site[aria-pressed="true"] .am-site__n { color: inherit; }

.am-seg { overflow-x: auto; flex-wrap: nowrap; }
.am-seg .ui-seg__b { white-space: nowrap; }
.am-panel { display: grid; gap: var(--tile-gap); min-width: 0; }
.am-panel[hidden] { display: none; }
/* Общая панель под плитками: верх при прокрутке (scrollIntoView) ложится под закреплённую шапку, а не за неё. */
.am-panel--top { scroll-margin-top: var(--space-4); }
@media (min-width: 80rem) { .am-panel--top { scroll-margin-top: var(--space-20); } }

/* Непройденные проверки модуля по уровням: обязательные выделены тоном, остальные спокойные. */
.am-needs { display: grid; gap: var(--space-2); min-width: 0; padding-inline-start: var(--space-4); border-inline-start: .1875rem solid var(--color-line2); }
.am-needs[data-tone="warn"] { border-inline-start-color: var(--color-warn-text); }
.am-needs[data-tone="warn"] .am-needs__t { color: var(--color-warn-text); }
.am-needs__t { margin: 0; }

/* Шаги установки: маркер состояния (сделано, идёт, ждёт, нужно действие, ошибка) — цветом и значком, подпись остаётся словами. */
.am-step { position: relative; padding-inline-start: calc(var(--space-4) + var(--size-status-dot) + var(--space-3)); }
.am-step::before {
  content: ''; position: absolute; inset-inline-start: var(--space-4); inset-block-start: 50%; width: var(--size-status-dot); height: var(--size-status-dot);
  transform: translateY(-50%); border-radius: var(--radius-round); box-sizing: border-box; border: .125rem solid var(--color-line2); background: transparent;
}
.am-step--done { color: var(--color-ink2); }
.am-step--done::before { border-color: var(--color-ok); background: var(--color-ok); }
.am-step--now { background: var(--color-acc-soft); color: var(--color-acc-soft-text); }
.am-step--now::before { border-color: var(--color-acc); background: var(--color-acc); box-shadow: 0 0 0 .1875rem var(--color-acc-glow); }
.am-step--warn { color: var(--color-warn-text); }
.am-step--warn::before { border-color: var(--color-warn); background: var(--color-warn); }
.am-step--fail { color: var(--color-danger-text); }
.am-step--fail::before { border-color: var(--color-danger); background: var(--color-danger); }
.am-step--wait { color: var(--color-ink3); }

/* Ключи модуля: без буллетов, подпись читаемого кегля, чип «Задан / Не задан» по центру строки и не сжимается. */
.am-keylist { display: grid; gap: var(--space-5); margin: 0; padding: 0; list-style: none; }
.am-key { margin: 0; }
.am-key .am-key__h { flex-wrap: nowrap; align-items: center; gap: var(--space-4); }
.am-key__t { min-width: 0; overflow-wrap: anywhere; color: var(--color-ink); font: var(--text-ui-strong-weight) var(--text-ui-strong-size)/var(--text-ui-strong-line) var(--font-sans); letter-spacing: 0; text-transform: none; }
.am-key .ui-chip { flex: none; }

/* Выбор распознавания речи в окне подтверждения. */
.am-asr__w, .am-asr { display: grid; gap: var(--space-4); min-width: 0; }
.am-asr__g { display: grid; gap: var(--space-2); }
.am-asr__o { display: flex; align-items: center; gap: var(--space-3); min-height: var(--size-touch-min); }
.am-asr__i { flex: none; width: 1.25rem; height: 1.25rem; margin: 0; accent-color: var(--color-acc); }
.am-asr__i:focus-visible { outline: var(--size-focus-width) solid var(--color-focus); outline-offset: var(--size-focus-offset); }
.am-asr__l { flex: 1 1 auto; min-height: var(--size-touch-min); display: flex; align-items: center; color: var(--color-ink); cursor: pointer; }
.am-empty { max-width: none; }

.am-kpis { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--tile-gap); }
@media (min-width: 40rem) { .am-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 80rem) { .am-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.am-kpi { display: grid; gap: var(--space-3); align-content: start; }
.am-kpi .ui-kpi__v { font-size: var(--text-number-lg-size); line-height: var(--text-number-lg-line); letter-spacing: var(--text-number-lg-track); }
.am-kpi--next .ui-kpi__v { font-size: var(--text-h2-size); line-height: var(--text-h2-line); letter-spacing: var(--text-h2-track); white-space: nowrap; }
.am-of { color: var(--color-ink2); font-size: var(--text-caption-size); letter-spacing: 0; }
.am-kpi[data-tone="ok"] .ui-kpi__v { color: var(--color-ok-text); }
.am-kpi[data-tone="danger"] .ui-kpi__v { color: var(--color-danger-text); }
.am-bar { appearance: none; -webkit-appearance: none; width: 100%; height: var(--space-2); border: 0; border-radius: var(--radius-pill); overflow: hidden; background: var(--color-panel2); }
.am-bar::-webkit-progress-bar { background: var(--color-panel2); }
.am-bar::-webkit-progress-value { background: var(--color-acc); border-radius: var(--radius-pill); }
.am-bar::-moz-progress-bar { background: var(--color-acc); border-radius: var(--radius-pill); }

.am-banner {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-4) var(--space-5);
  padding: var(--space-5) var(--space-6); border-radius: var(--radius-lg); background: var(--color-acc-soft); color: var(--color-ink);
}
.am-banner p { margin: 0; }
.am-banner__t { display: grid; gap: var(--space-2); min-width: 0; flex: 1 1 16rem; }
.am-banner__acts { display: flex; flex-wrap: wrap; gap: var(--space-3); }
.am-banner__l { display: grid; gap: var(--space-1); margin: 0; padding: 0; list-style: none; overflow-wrap: anywhere; }

.am-tile { display: grid; gap: var(--space-4); align-content: start; }
.am-tile__h { margin: 0; color: var(--color-ink); font: var(--text-h3-weight) var(--text-h3-size)/var(--text-h3-line) var(--text-h3-family); letter-spacing: var(--text-h3-track); }
.am-note { margin: 0; }
.am-none { margin: 0; color: var(--color-ink2); }
.am-tile .ui, .am-tile .ui-strong { margin: 0; }
.am-segbox { min-width: 0; }

/* Таблица плана: на телефоне и планшете — строка-карточка, с 64rem — шесть колонок. */
.am-table { display: grid; }
.am-head-row { display: none; }
.am-plan { display: grid; }
.am-row {
  display: grid; grid-template-columns: 6.5rem minmax(0, 1fr) var(--size-touch-min); grid-template-areas: "cov t act" "d st st";
  gap: var(--space-2) var(--space-4); align-items: center; padding-block: var(--space-4); border-top: 1px solid var(--color-line);
}
.am-row:first-child { border-top: 0; }
.am-row > [role="cell"]:nth-child(1) { grid-area: d; }
.am-row > [role="cell"]:nth-child(2) { grid-area: cov; }
.am-row > [role="cell"]:nth-child(3) { grid-area: t; }
.am-row > [role="cell"]:nth-child(4) { display: none; }
.am-row > [role="cell"]:nth-child(5) { grid-area: st; }
.am-row > [role="cell"]:nth-child(6) { grid-area: act; }
.am-row__date { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-2); }
.am-row__t { display: grid; gap: var(--space-1); min-width: 0; overflow-wrap: anywhere; }
.am-kw { display: grid; gap: var(--space-1); min-width: 0; overflow-wrap: anywhere; }
.am-kw .caption { color: var(--color-ink2); }
.am-cover { display: block; width: 6.5rem; aspect-ratio: 16 / 9; border-radius: var(--radius-sm); object-fit: cover; background: var(--color-panel2); }
.am-cover--empty { display: grid; place-items: center; text-align: center; color: var(--color-ink2); font: var(--weight-medium) var(--text-label-size)/1.2 var(--font-sans); border: 1px dashed var(--color-line2); background: none; }
.am-st .ui-chip { white-space: normal; }
@media (min-width: 64rem) {
  .am-head-row, .am-row { grid-template-columns: 6.5rem 7.5rem minmax(0, 1fr) 11rem 9.5rem var(--size-touch-min); grid-template-areas: none; gap: var(--space-5); }
  .am-head-row {
    display: grid; padding-bottom: var(--space-3); border-bottom: 1px solid var(--color-line2); color: var(--color-ink2);
    font: var(--weight-medium) var(--text-label-size)/1 var(--font-sans);
  }
  .am-row > [role="cell"] { grid-area: auto !important; }
  .am-row > [role="cell"]:nth-child(4) { display: grid; }
  .am-row__date { display: grid; gap: var(--space-1); }
  .am-cover { width: 7.5rem; }
}

/* Меню «…» строки плана */
.am-menu { position: relative; }
.am-menu__btn {
  display: inline-flex; align-items: center; justify-content: center; width: var(--size-touch-min); height: var(--size-touch-min);
  border: 0; border-radius: var(--radius-pill); background: transparent; color: var(--color-ink2); cursor: pointer;
}
.am-menu__btn:hover { background: var(--color-panel2); color: var(--color-ink); }
.am-menu__list {
  position: absolute; z-index: 5; inset-block-start: calc(100% + var(--space-1)); inset-inline-end: 0; display: grid; min-width: min(18rem, 80vw); padding: var(--space-2);
  background: var(--color-panel); border: 1px solid var(--color-line2); border-radius: var(--radius-md); box-shadow: var(--surface-shadow);
}
.am-menu__list[hidden] { display: none; }
.am-menu__item {
  display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); min-height: var(--size-touch-min); padding: 0 var(--space-4);
  border: 0; border-radius: var(--radius-sm); background: transparent; color: var(--color-ink); text-align: start; text-decoration: none;
  font: var(--weight-regular) var(--text-ui-size)/1 var(--font-sans); cursor: pointer;
}
.am-menu__item:hover { background: var(--color-panel2); }
.am-menu__item[aria-disabled="true"] { color: var(--color-ink2); }
.am-menu__item .caption { color: var(--color-ink3); }

/* Подключения */
.am-conn { display: grid; grid-template-columns: minmax(0, 1fr); column-gap: var(--space-8); margin: 0; padding: 0; list-style: none; }
@media (min-width: 64rem) { .am-conn { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.am-c { display: grid; grid-template-columns: 2.5rem minmax(0, 1fr) auto; grid-template-areas: "ico t chip" ". act act"; gap: var(--space-2) var(--space-4); align-items: center; padding-block: var(--space-4); border-top: 1px solid var(--color-line); }
.am-c > :nth-child(1) { grid-area: ico; }
.am-c > :nth-child(2) { grid-area: t; }
.am-c > :nth-child(3) { grid-area: chip; }
.am-c > :nth-child(4) { grid-area: act; justify-self: start; }
.am-c__ico { width: 2.5rem; height: 2.5rem; border-radius: var(--radius-sm); display: grid; place-items: center; background: var(--color-panel2); color: var(--color-ink2); font: var(--weight-medium) var(--text-label-size)/1 var(--font-sans); }
.am-c__t { display: grid; gap: var(--space-1); min-width: 0; overflow-wrap: anywhere; }
.am-c__t p { margin: 0; }
@media (min-width: 64rem) {
  .am-c { grid-template-columns: 2.5rem minmax(0, 1fr) auto auto; grid-template-areas: none; }
  .am-c > :nth-child(n) { grid-area: auto; justify-self: auto; }
  .am-c:first-child, .am-c:nth-child(2) { border-top: 0; }
}
.am-c:first-child { border-top: 0; }

/* Телефон: нижняя панель не закрывает конец экрана, строка плана не тесная. */
@media (max-width: 45rem) {
  .am { padding-bottom: calc(var(--layout-tabbar) + var(--space-4)); }
  .am-row { grid-template-columns: 5rem minmax(0, 1fr) var(--size-touch-min); }
  .am-cover { width: 5rem; }
  .am-banner { padding: var(--space-4) var(--space-5); }
  .am-banner__acts { width: 100%; flex-direction: column; }
  .am-banner .btn { width: 100%; }
}