:root { --фон: #F7F5F1; --лист: #FFFFFF; --текст: #1F2328; --серый: #6B7280; --линия: #E3DFD7; --зелёный: #1F7A63; --красный: #C2410C; --красный-фон: #FDECE4; --жёлтый: #B7791F; --жёлтый-фон: #FFF7E6; }
* { box-sizing: border-box; }
[hidden] { display: none !important; } /* иначе display:flex у .запись перебивает hidden */
html, body { margin: 0; background: var(--фон); color: var(--текст); font-family: "Golos Text", -apple-system, "Segoe UI", Roboto, sans-serif; font-size: 17px; line-height: 1.4; }
body { padding-bottom: 150px; }
input, textarea, button { font: inherit; }
textarea, input { font-size: 16px; } /* 16px: иначе iPhone приближает экран при наборе */
.шапка { padding: max(20px, env(safe-area-inset-top)) 20px 12px; display: flex; flex-direction: column; gap: 12px; }
.надпись { font-size: 13px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--серый); }
.надпись.зелёная { color: var(--зелёный); }
.серый { color: var(--серый); font-size: 15px; }
h1 { font-size: 26px; margin: 4px 0 0; line-height: 1.15; }
h2 { font-size: 24px; margin: 4px 0; line-height: 1.15; }
.вкладки { display: flex; gap: 8px; }
.вкладка { flex: 1; height: 44px; border: 1px solid var(--линия); background: var(--лист); border-radius: 10px; color: var(--серый); font-weight: 600; }
.вкладка.активна { background: var(--текст); color: #fff; border-color: var(--текст); }
.экран { padding: 0 20px; }
.плитки { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.плитка { background: var(--лист); border: 1px solid var(--линия); border-radius: 12px; padding: 12px 14px; }
.плитка b { display: block; font-size: 24px; line-height: 1; }
.плитка span { font-size: 13px; color: var(--серый); }
.плитка.тревога { background: var(--красный-фон); border-color: #F3C9B5; }
.плитка.тревога b { color: var(--красный); }
.список { display: flex; flex-direction: column; gap: 8px; }
.строка { display: flex; align-items: center; gap: 12px; background: var(--лист); border: 1px solid var(--линия); border-radius: 12px; padding: 14px; min-height: 64px; width: 100%; text-align: left; cursor: pointer; }
.строка.выбран { border-color: var(--зелёный); box-shadow: 0 0 0 2px var(--зелёный) inset; }
.строка.тревога { border-color: #F3C9B5; }
.точка { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; background: var(--линия); }
.точка.есть { background: var(--зелёный); }
.точка.тревога { background: var(--красный); }
.строка .имя { font-weight: 600; }
.строка .что { font-size: 14px; color: var(--серый); }
.строка .что.тревога { color: #9A3412; }
.низ { position: fixed; left: 0; right: 0; bottom: 0; padding: 12px 20px max(24px, env(safe-area-inset-bottom)); background: var(--фон); display: flex; flex-direction: column; align-items: center; gap: 6px; }
.главная-кнопка { width: 100%; height: 64px; border: 0; border-radius: 16px; background: var(--зелёный); color: #fff; font-size: 19px; font-weight: 600; display: flex; align-items: center; justify-content: center; gap: 12px; box-shadow: 0 6px 18px rgba(31,122,99,.28); }
.главная-кнопка:disabled { background: #9CA3AF; box-shadow: none; }
.главная-кнопка.слушает { background: var(--красный); animation: пульс 1.2s infinite; }
@keyframes пульс { 50% { box-shadow: 0 0 0 10px rgba(194,65,12,.15); } }
.подсказка { font-size: 13px; color: var(--серый); }
.запись { position: fixed; inset: 0; background: var(--фон); overflow: auto; padding: max(20px, env(safe-area-inset-top)) 20px max(24px, env(safe-area-inset-bottom)); display: flex; flex-direction: column; gap: 14px; }
.сказанное textarea { width: 100%; border: 1px solid var(--линия); border-radius: 12px; padding: 12px; background: #EFECE6; color: #4B5563; resize: vertical; }
.карточки { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.карточка { background: var(--лист); border: 1px solid var(--линия); border-radius: 12px; padding: 12px 14px; }
.карточка .з { font-size: 13px; color: var(--серый); }
.карточка .в { font-size: 19px; font-weight: 700; }
.карточка .п { font-size: 13px; color: var(--серый); }
.карточка.широкая { grid-column: 1 / -1; }
.сигнал, .медицина { border-radius: 12px; padding: 12px 14px; font-size: 15px; }
.сигнал { background: var(--жёлтый-фон); border: 1px solid #F1D9A6; color: #7C4A03; }
.медицина { background: var(--красный-фон); border: 1px solid #F3C9B5; color: #9A3412; }
.кнопки { display: flex; gap: 10px; margin-top: auto; }
.кнопка-вторая { height: 56px; padding: 0 16px; border-radius: 14px; background: var(--лист); border: 1px solid #D5D0C6; color: #374151; font-weight: 600; }
.кнопка-главная { flex: 1; height: 56px; border: 0; border-radius: 14px; background: var(--зелёный); color: #fff; font-weight: 600; font-size: 17px; }
.кнопка-главная:disabled { background: #9CA3AF; }
/* Ссылка в виде главной кнопки — «Войти через Рутдайн» (уход на my.rootdyne.ru, не fetch) */
.кнопка-главная.кнопка-ссылка { display: flex; align-items: center; justify-content: center; text-decoration: none; flex: none; }
.отчёт { background: var(--лист); border: 1px solid var(--линия); border-radius: 12px; padding: 12px 14px; display: flex; flex-direction: column; gap: 6px; }
.отчёт button { align-self: flex-start; height: 40px; padding: 0 14px; border-radius: 10px; border: 1px solid #D5D0C6; background: #fff; font-weight: 600; color: #374151; }
button:focus-visible, textarea:focus-visible { outline: 3px solid #7FC8B4; outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { .главная-кнопка.слушает { animation: none; } }

.метка { display: inline-block; font-size: 12px; font-weight: 600; color: #9A3412; background: var(--красный-фон); border-radius: 6px; padding: 1px 6px; vertical-align: middle; }
.карточка.мед { border-color: #C7D9F2; background: #F3F7FC; }
.карточка.мед .з { color: #3B5B8C; }
.назначения { background: var(--лист); border: 1px solid var(--линия); border-radius: 12px; padding: 12px 14px; display: flex; flex-direction: column; gap: 6px; font-size: 15px; }
.назначение { display: flex; justify-content: space-between; gap: 10px; align-items: center; }
.ссылка { background: none; border: 0; color: var(--зелёный); font-weight: 600; padding: 8px 0; min-height: 44px; text-align: left; }

/* Встроенных style="" нет намеренно: политика безопасности страницы их запрещает (style-src 'self'). */
.надпись.раздел { margin: 20px 0 8px; }
.отступ { margin-top: 10px; }
.растяжка { flex: 1; min-width: 0; }
.кнопки-отчёта { display: flex; gap: 8px; flex-wrap: wrap; }
.войдите { padding: 40px 20px; font-size: 18px; }

/* ── Дома, дни, карточка проживающего ── */
.дома { display: flex; gap: 8px; flex-wrap: wrap; }
.дом { height: 36px; padding: 0 12px; border-radius: 18px; border: 1px solid var(--линия); background: var(--лист); color: var(--серый); font-size: 14px; font-weight: 600; }
.дом.активен { background: var(--зелёный); border-color: var(--зелёный); color: #fff; }
.дни { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 8px 0 4px; }
.день-кнопка { width: 44px; height: 44px; border-radius: 12px; border: 1px solid var(--линия); background: var(--лист); font-size: 22px; color: var(--текст); }
.день-кнопка:disabled { color: var(--линия); }
.день-имя { font-weight: 600; font-size: 16px; text-transform: capitalize; }
.стрелка { color: #9CA3AF; font-size: 22px; }
.человек { padding: max(16px, env(safe-area-inset-top)) 20px 170px; }
.шапка-человека { display: flex; flex-direction: column; gap: 4px; margin-bottom: 8px; }
.шапка-человека .ссылка { padding: 6px 0; }
.низ-человека { position: fixed; left: 0; right: 0; bottom: 0; padding: 12px 20px max(24px, env(safe-area-inset-bottom)); background: var(--фон); display: flex; flex-direction: column; align-items: center; gap: 6px; }
.запись-строка { display: flex; gap: 10px; align-items: flex-start; background: var(--лист); border: 1px solid var(--линия); border-radius: 12px; padding: 12px 14px; }
.запись-строка.тревога { border-color: #F3C9B5; }
.что-время { font-size: 13px; color: var(--серый); }
.цитата { font-style: italic; margin-top: 4px; }
.удалить { color: #9CA3AF; font-size: 18px; min-width: 44px; text-align: center; }
.времена { display: flex; gap: 8px; flex-wrap: wrap; margin: 6px 0; }
.приём { height: 44px; min-width: 76px; padding: 0 12px; border-radius: 10px; border: 1px solid #D5D0C6; background: var(--лист); font-weight: 600; font-size: 15px; color: var(--текст); }
.приём:disabled { color: #9CA3AF; }
.приём.выдано { background: #E3F2EC; border-color: #7FC8B4; color: var(--зелёный); }
.приём.просрочено { background: var(--красный-фон); border-color: #F3C9B5; color: #9A3412; }
.ссылка.мелкая { font-size: 13px; color: var(--серый); min-height: 32px; padding: 4px 0; }
.текст-отчёта { width: 100%; border: 1px solid var(--линия); border-radius: 10px; padding: 10px; background: #FBFAF7; resize: vertical; }
.вкладки, .дома { margin-top: 4px; }

.раздел-строка { display: flex; justify-content: space-between; align-items: baseline; margin: 20px 0 8px; }
.ссылка-кнопка { display: inline-flex; align-items: center; text-decoration: none; }
#действия-сводки .кнопка-вторая { height: 44px; font-size: 15px; }
.мелко { font-size: 13px; align-self: center; }

/* ── Формы вместо prompt, крупный шрифт, поиск, журнал ── */
.шторка { position: fixed; inset: 0; background: rgba(31,35,40,.45); display: flex; align-items: flex-end; justify-content: center; z-index: 50; }
.лист { width: 100%; max-width: 520px; background: var(--лист); border-radius: 18px 18px 0 0; padding: 20px 20px max(24px, env(safe-area-inset-bottom)); display: flex; flex-direction: column; gap: 12px; }
.лист h3 { margin: 0; font-size: 20px; }
.лист label { display: flex; flex-direction: column; gap: 4px; font-size: 14px; color: var(--серый); }
.лист input, .лист textarea { border: 1px solid var(--линия); border-radius: 10px; padding: 12px; font-size: 17px; color: var(--текст); background: #FBFAF7; }
.лист .кнопки { margin-top: 4px; }
.плашка { position: fixed; left: 16px; right: 16px; bottom: 100px; background: #1F2328; color: #fff; padding: 12px 16px; border-radius: 12px; z-index: 60; font-size: 15px; }
.вкладка.шрифт { flex: 0 0 56px; font-size: 18px; }
.поиск { width: 100%; height: 44px; border: 1px solid var(--линия); border-radius: 12px; padding: 0 12px; background: var(--лист); margin-bottom: 8px; }
.журнал-строка { padding: 6px 0; border-bottom: 1px solid var(--линия); font-size: 14px; }
body.крупно { font-size: 20px; }
body.крупно .строка .что, body.крупно .карточка .з, body.крупно .подсказка, body.крупно .надпись { font-size: 16px; }
body.крупно .строка .имя, body.крупно .карточка .в { font-size: 21px; }
body.крупно .главная-кнопка { font-size: 21px; height: 72px; }
body.крупно .приём { font-size: 18px; height: 52px; }

/* ── Этажи и комнаты ── */
.дом-заголовок { font-family: inherit; font-weight: 700; font-size: 18px; margin: 14px 0 4px; }
.этаж { font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--серый); margin: 12px 0 2px; }
.комната { display: flex; justify-content: space-between; align-items: baseline; padding: 8px 2px 4px; font-weight: 600; font-size: 15px; border-bottom: 1px solid var(--линия); margin-bottom: 4px; }
.комната .серый { font-weight: 400; font-size: 13px; }

.стоп { width: 100%; height: 72px; margin-top: auto; box-shadow: 0 6px 18px rgba(194,65,12,.28); border: 0; border-radius: 16px; background: var(--красный); color: #fff; font-size: 22px; font-weight: 700; animation: пульс 1.2s infinite; }
body.крупно .стоп { font-size: 26px; height: 84px; }
.зелёный-текст { color: var(--зелёный); }
.отчёт.отправлен .текст-отчёта { background: #F1F6F3; }
#кнопка-измерения { align-self: center; padding: 2px 0; min-height: 32px; }

/* ── Экран «Дом» ── */
.столбики { display: flex; align-items: flex-end; gap: 8px; background: var(--лист); border: 1px solid var(--линия); border-radius: 12px; padding: 14px; height: 132px; box-sizing: border-box; }
.столбик { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 6px; justify-content: flex-end; height: 100%; }
.палка { width: 100%; background: #D7E6E0; border-radius: 4px; }
.палка.сегодня { background: var(--зелёный); }
.подпись-дня { font-size: 12px; color: var(--серый); }
.подпись-дня.сегодня { color: var(--текст); font-weight: 600; }
.роль { background: var(--лист); border: 1px solid var(--линия); border-radius: 12px; padding: 14px; display: flex; flex-direction: column; gap: 6px; }
.роль .имя { font-size: 18px; font-weight: 700; }
.роль .что { font-size: 15px; line-height: 1.45; }
#экран-дом .надпись.раздел { display: block; }

.полоса-глазами { display: flex; justify-content: space-between; align-items: center; gap: 12px; background: #FFF7E6; border: 1px solid #F1D9A6; color: #7C4A03; border-radius: 12px; padding: 8px 14px; font-size: 14px; font-weight: 600; }
.полоса-глазами .ссылка { color: #7C4A03; min-height: 32px; padding: 4px 0; }

/* ── Вход, регистрация, персонал, заселение ── */
.вход { padding: 32px 20px max(24px, env(safe-area-inset-bottom)); display: flex; flex-direction: column; gap: 20px; }
.вход-шапка { display: flex; flex-direction: column; gap: 6px; }
.вход-шапка h1 { font-size: 26px; margin: 4px 0 0; line-height: 1.15; }
.значок { width: 56px; height: 56px; border-radius: 14px; background: var(--зелёный); display: flex; align-items: center; justify-content: center; margin-bottom: 6px; }
.карточка-формы { background: var(--лист); border: 1px solid var(--линия); border-radius: 14px; padding: 18px; display: flex; flex-direction: column; gap: 12px; }
.карточка-формы .имя { font-size: 19px; font-weight: 700; }
.карточка-формы label { display: flex; flex-direction: column; gap: 4px; font-size: 14px; color: var(--серый); }
.карточка-формы input { border: 1px solid var(--линия); border-radius: 10px; padding: 12px; font-size: 17px; background: #FBFAF7; color: var(--текст); }
.по-центру { text-align: center; align-self: center; }
.ошибка { color: #9A3412; background: var(--красный-фон); border: 1px solid #F3C9B5; border-radius: 10px; padding: 10px 12px; font-size: 15px; }
.код-крупно { font-size: 44px; font-weight: 700; letter-spacing: .16em; color: var(--зелёный); text-align: center; background: #E3F2EC; border: 1px solid #7FC8B4; border-radius: 14px; padding: 22px 12px; }
.поселить { width: 100%; border: 1px dashed #C9D6CF; background: none; border-radius: 12px; padding: 14px; min-height: 56px; color: var(--зелёный); font-weight: 600; font-size: 16px; }
.выбор { display: flex; gap: 8px; flex-wrap: wrap; }
.кнопки-строки { display: flex; flex-direction: column; gap: 2px; align-items: flex-end; }
.строка.выключен { opacity: .55; }
.кнопка-вторая.широкая { width: 100%; height: 52px; }
#экран-персонал { padding-bottom: 40px; }