/* Оформление режима API.
 *
 * Прежняя версия прятала весь интерфейс правилом
 *   .api-mode .screenwrap > :not([data-live-root]) { display:none }
 * и показывала вместо него экран загрузки. Это была вторая половина той же
 * ошибки, что и подмена разметки в live.ts: нарисованный интерфейс скрывался,
 * а на его месте рисовался служебный. Теперь здесь только то, ради чего этот
 * файл нужен, — мини-апп занимает весь экран устройства, без витрины вокруг. */

.api-mode body { display:block; padding:0; margin:0; min-height:100dvh; }

/* Витрина прототипа: заголовок, пояснения и тумблеры показа. В мини-аппе их нет. */
.api-mode .intro, .api-mode .side { display:none; }

/* Рамка телефона внутри телефона не нужна: приложение и есть экран. */
.api-mode .device {
  width:100%; max-width:600px; margin:auto; height:100dvh; max-height:none;
  padding:0; border-radius:0; box-shadow:none; border:0;
}
.api-mode .screenwrap { border-radius:0; }

/* Вырез, часы и индикаторы сети — декорация макета, на реальном устройстве
   их рисует система. */
.api-mode .status, .api-mode .island, .api-mode .home-ind { display:none; }

.api-mode [hidden] { display:none !important; }
.api-mode button:disabled { opacity:.55; cursor:default; }

/* Ввод сумм и паёв: в прототипе полей нет, поэтому поле берёт вид его карточек.
   Переменные — те же, что у .box и .task; прежний var(--card) в теме не
   существует, и поле светилось белым на тёмном экране. */
.api-mode .live-form { display:flex; gap:8px; margin:10px 0 12px; }
.api-mode .live-form input { min-width:0; flex:1; padding:10px 12px; border:1px solid var(--line); border-radius:10px;
  background:var(--surface); color:var(--ink); font:inherit; }
.api-mode .live-form input::placeholder { color:var(--muted); }
.api-mode .live-form input:focus-visible { outline:none; border-color:var(--brand); }
.api-mode .live-confirm { margin:14px 0; }

/* Одиночная подпись живого режима стоит вне карточки, поэтому ей нужен тот же
   боковой отступ, что и у заголовков, и воздух снизу. */
.api-mode .spec.lv { margin:6px 2px 12px; }
/* Подписи к дверям наружу в карточке владельца. */
.api-mode .lv-doors { margin: 10px 2px 2px; }
/* Экран без нарисованного заголовка начинается на той же высоте, что и прочие. */
.api-mode .screen > [data-live="events"]:first-child { display:block; padding-top:4px; }
/* Вторая строка карточки работника: его собственный доход рядом с вашим вкладом. */
.api-mode .ucard .own { font-family:var(--mono,monospace); font-size:10.5px; color:var(--muted,#8a8a8a); }
.api-mode details.lv > summary { cursor:pointer; font-size:12px; color:var(--muted,#888); margin:8px 2px; }
