/* ---------- состояния связи и загрузки (ЭКРАНЫ, раздел 10): новых в прототипе не было, оформлены в его стиле ---------- */

/* тонкая полоска под шапкой, пока данные обновляются (10.1) */
.loadbar { flex: none; position: relative; height: 2px; overflow: hidden; }
.loadbar::before { content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 34%; border-radius: 1px; background: var(--accent); animation: load-slide 1.1s var(--ease-out) infinite; }
@keyframes load-slide { from { transform: translateX(-100%); } to { transform: translateX(300%); } }

/* плашка «Нет связи с сервером…» (10.2) */
.offline { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 4px 16px 0; padding: 4px 4px 4px 14px; border-radius: 16px; background: var(--surface); border: 1px solid var(--line); box-shadow: 0 1px 2px color-mix(in srgb, var(--shade) var(--shade-s), transparent); font-size: 14px; line-height: 18px; color: var(--muted); }
.offline-btn { flex: none; min-height: 44px; padding: 0 12px; border-radius: 14px; color: var(--accent); font-weight: 600; }
.offline-btn:active { background: var(--surface-2); }

/* серая карточка-заглушка при первом запуске, пока на телефоне нет данных (10.1); кнопки под ней неактивны */
.card.is-wait { cursor: default; box-shadow: var(--shadow-card); }
.wait-line { display: block; border-radius: 8px; background: color-mix(in srgb, var(--line) 70%, var(--surface)); animation: wait-pulse 1.4s ease-in-out infinite; }
.wait-line.wl-s { width: 96px; height: 14px; }
.wait-line.wl-l { width: 82%; height: 26px; margin-top: 16px; }
.wait-line.wl-m { width: 54%; height: 16px; margin-top: 14px; }
@keyframes wait-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .55; } }
.ans:disabled { opacity: .45; }
@media (prefers-reduced-motion: reduce) { .loadbar::before { animation: none; width: 100%; opacity: .5; } .wait-line { animation: none; } }

/* «Бизнес» [v1]: заглушка «Скоро» по центру страницы */
.page-business > .biz-wait { min-height: 100%; }

/* вложение, которое не дошло до сервера: плитка с причиной и «Повторить» (в «Подробнее» и заметке), кнопка в строке вложения у поля записи */
.ft-fail { grid-column: 1 / -1; flex-direction: row; align-items: center; gap: 12px; }
.ft-fail .ft-pv { flex: none; width: 56px; }
.ft-t { flex: 1; min-width: 0; display: grid; gap: 2px; }
.ft-fail .ft-pv { opacity: .6; box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--urgent) 60%, var(--line)); }
.ft-e { font-size: 13px; line-height: 16px; color: color-mix(in srgb, var(--urgent) 85%, var(--text)); overflow-wrap: anywhere; }
.ft-retry, .att-retry { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 14px; border-radius: 22px; background: var(--surface-2); color: var(--accent); font-size: 15px; line-height: 20px; font-weight: 600; }
.ft-retry:active, .att-retry:active { background: var(--line); }
.att-retry { flex: none; }