/* Вводный экран в зоне чата: «Что важно знать» и «Получить ответ».
   Макет — холст «Вводный экран: вопросы о городе», вариант Б (выбор владельца
   17.09.2026): цвета и шрифты оттуда целиком. Бюджет высоты — треть экрана:
   281 px на 844, из них 44 — полоса; плиткам и кнопке остаётся 237. */

body.home-mode .feed,
body.home-mode .dock{display:none}

.home{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;overflow:hidden}
/* Низ учитывает safe-area (`env(...)`): Mini App рисуется под home-indicator и
   вырезом (`viewport-fit=cover`), и без этого кнопка «Спросить» на iPhone
   пряталась под системную полосу. На Android inset=0 — регресса нет. Тот же
   приём у композера, полосы слоёв, FAB и карточки товара (одна причина). */
.home .hbody{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;gap:8px;
  padding:8px var(--gut) calc(10px + env(safe-area-inset-bottom));overflow-y:auto}
.home .push{margin-top:auto}
.home .empty{padding:16px var(--gut);font-size:13px;color:var(--ink-3)}
.home .note{margin:0;font-size:12px;line-height:1.35;color:var(--ink-3)}
.home .lab{font-size:12px;font-weight:700;color:var(--ink-3)}

/* «Личные» в полосе — только на вводном экране и только когда есть разговоры. */
.minebtn{flex:0 0 auto;margin-left:auto;min-width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;gap:3px;
  padding:0 6px;font-size:16px;color:var(--ink-2)}
.minebtn b{min-width:18px;height:18px;padding:0 5px;border-radius:999px;display:inline-grid;place-items:center;
  font-size:11px;background:var(--accent);color:var(--on-accent)}
.minebtn:not([hidden]) + .langbtn{margin-left:0}

/* ---- intro ---- */
/* Вводный экран АДАПТИРУЕТСЯ под высоту, а не скроллится (владелец): подсказка
   и кнопка фиксированы, плитки делят оставшееся место поровну. Базовый
   `.hbody` скроллится (нужно ответу — длинный текст), поэтому не скроллим
   только intro. FAQ-вид скроллит свой список сам (`.flist`). */
.home .hbody.intro{overflow:hidden}
.home .hhead{flex:0 0 auto;display:flex;align-items:baseline;justify-content:space-between;gap:8px;min-height:18px}
.home .hhead .all{position:relative;font-size:13px;font-weight:700;color:var(--accent-ink)}
.home .hhead .all::after{content:"";position:absolute;inset:-13px -8px}

.home .tiles{flex:0 0 auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
/* В intro плитки забирают всё свободное по высоте и делят его поровну (две
   строки по `1fr`), поэтому кнопка стоит чётко у дна без скролла. */
.home .hbody.intro .tiles{flex:1 1 auto;min-height:0;grid-auto-rows:1fr}
.home .tile{display:flex;flex-direction:column;gap:1px;min-height:44px;padding:6px 10px;overflow:hidden;
  border-radius:var(--radius);background:var(--surface);box-shadow:0 0 0 1px var(--line);text-align:left}
.home .tile b{font-size:13.5px;line-height:1.25;color:var(--accent-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Кусок ответа — две строки максимум: третья выдавила бы кнопку из трети. */
.home .tile small{font-size:12.5px;line-height:1.3;color:var(--ink-2);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* Бирюзовая кнопка — единственная заливка зоны (eze-ui «Заливка — одна на зону»).
   Цвет — `--cta-fill` = `--accent`: бирюза бренда (#0096C7, край шапки ASIANA),
   с 19.09.2026 это заливка ВСЕХ главных кнопок приложения. Путь 17.09.2026:
   градиент CTA ASIANA → перелив шапки → зелёный → бирюза → зелёный → бирюза.
   Белый на ней 3,39:1 (на зелёном было 6,01) — принято владельцем. */
.home .askbtn{flex:0 0 auto;display:flex;align-items:center;gap:10px;height:48px;padding:0 10px 0 8px;
  border-radius:var(--radius);background:var(--cta-fill);color:var(--cta-ink);text-align:left}
.home .askbtn .e{flex:0 0 auto;width:32px;height:32px;border-radius:8px;display:grid;place-items:center;
  font-size:17px;background:rgba(255,255,255,.16)}
.home .askbtn .t{flex:1 1 auto;min-width:0;font-size:15px;font-weight:700;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.home .askbtn.slim{height:44px;padding:0 10px 0 12px}
.home .askbtn.slim .t{font-size:14px}
.home .pill{flex:0 0 auto;white-space:nowrap;display:inline-flex;align-items:center;gap:3px;height:24px;
  padding:0 9px;border-radius:999px;font-size:12px;font-weight:700;background:rgba(255,255,255,.18)}

/* Готовый ответ — строкой на месте подписи, а не лишним блоком. */
.home .hready{flex:0 0 auto;display:flex;align-items:center;gap:8px;min-height:44px;padding:0 12px;
  border-radius:var(--radius-sm);background:var(--accent-soft);color:var(--ink);text-align:left}
.home .hready .dot{flex:0 0 auto;width:8px;height:8px;border-radius:50%;background:var(--accent)}
.home .hready .tx{flex:1 1 auto;min-width:0;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.home .hready .go{font-weight:700;color:var(--accent-ink)}
/* Строка ответа занимает место подписи, но она на 26 px выше. Замер 17.09.2026
   на 390×844: с ней кнопка «Спросить» уезжала за низ экрана. Плитки отдают
   вторую строку куска ответа — кнопка важнее. */
.home .hready ~ .tiles .tile small{-webkit-line-clamp:1}

/* ---- частые вопросы ---- */
.home .fsearch{flex:0 0 auto;height:40px;padding:0 10px;border-radius:var(--radius-sm);
  border:1px solid var(--line);background:var(--sunk);color:var(--ink);font-size:14px}
.home .fsearch::placeholder{color:var(--ink-3)}
.home .flist{flex:1 1 auto;min-height:0;overflow-y:auto;margin:0 calc(-1 * var(--gut));padding:0 var(--gut)}
.home .ftopic{border-top:1px solid var(--line)}
.home .ftopic:first-child{border-top:0}
.home .fhead{width:100%;min-height:46px;display:flex;align-items:center;justify-content:space-between;gap:10px;
  font-size:15px;font-weight:700;color:var(--ink);text-align:left}
.home .fhead .n{font-style:normal;font-size:12px;font-weight:600;color:var(--ink-3)}
/* Шеврон вместо «N ›» на раскрытой теме/вопросе: стрелка обещает раскрытие
   на месте (вариант V1, выбор владельца 17.09.2026). */
.home .cv{font-style:normal;font-size:16px;line-height:1;color:var(--accent-ink)}
.home .fitem{border-top:1px solid var(--line)}
/* Вопрос с отступом — видно, что он вложен в тему; открытый жирный + шеврон. */
.home .fq{width:100%;min-height:42px;display:flex;align-items:center;gap:8px;
  padding:6px 0 6px 28px;font-size:14px;line-height:1.35;color:var(--ink);text-align:left}
.home .fq .fqt{flex:1 1 auto;min-width:0}
.home .fq .cv{flex:0 0 auto}
.home .fitem.open .fq{font-weight:700}
/* Ответ — с бирюзовой чертой слева (как кнопка «Спросить», --accent-ink),
   под вопросом и с тем же отступом. */
.home .fa{margin:0 0 12px 28px;padding-left:12px;border-left:2px solid var(--accent);
  font-size:13.5px;line-height:1.5;color:var(--ink-2)}

/* ---- вопрос, ход поиска, ответ ---- */
/* Экран вопроса: рекомендация сверху, поле РАСТЁТ на свободное место,
   кнопка ко дну — пустоты нет (17.09.2026). Блок целиком НЕ скроллится
   (владелец: «может адаптироваться под экран и стоять чётко»): подсказка и
   кнопка фиксированы, всё оставшееся забирает поле, а прокрутка — внутри
   поля и только при длинном тексте. `max-height:none` снимает 40vh-потолок
   базового `.askinput`, из-за которого и появлялся внешний скролл. */
.home .hbody.ask{overflow:hidden}
.home .hbody.ask .askinput{flex:1 1 auto;min-height:72px;max-height:none;overflow-y:auto}
/* Рекомендация — с бирюзовой чертой, как ответ: это подсказка от нас. */
.home .asktip{flex:0 0 auto;margin:2px 0 0;padding-left:12px;border-left:2px solid var(--accent);
  font-size:13px;line-height:1.4;color:var(--ink)}
/* Обводка — перелив ASIANA: градиент рамкой не задать, поэтому два фона —
   цвет поля до края отступов и перелив до края рамки. */
.home .askinput{flex:0 0 auto;min-height:72px;max-height:40vh;resize:none;padding:10px 12px;
  border-radius:var(--radius-sm);border:2px solid transparent;
  background:linear-gradient(var(--surface),var(--surface)) padding-box,var(--accent-grad) border-box;
  color:var(--ink);font:inherit;font-size:15px;line-height:1.4;outline:none}
.home .askinput::placeholder{color:var(--ink-3)}
.home .askbtn[hidden]{display:none}
/* Выключенная кнопка «Получить ответ» — видна, но не зовёт: текст короче
   порога. Гаснет заливкой и текстом, а не пропадает (см. wireAsk). */
.home .askbtn[disabled]{opacity:.45;pointer-events:none}
.home .hbody.ask .askbtn{justify-content:center}
.home .hbody.ask .askbtn .t{flex:0 1 auto}

.home .qbox{flex:0 0 auto;padding:10px 12px;border-radius:var(--radius-sm);background:var(--surface);
  box-shadow:0 0 0 1px var(--line);font-size:15px;line-height:1.4;color:var(--ink)}
.home .step{display:flex;gap:10px;align-items:flex-start}
.home .step .m{flex:0 0 22px;height:22px;border-radius:50%;display:grid;place-items:center;
  font-size:12px;font-weight:700;box-shadow:0 0 0 1.5px var(--line-2);color:var(--ink-3)}
.home .step.done .m{background:var(--accent);color:var(--on-accent);box-shadow:none}
.home .step.now .m{box-shadow:0 0 0 2px var(--accent);color:var(--accent-ink)}
.home .step .s{display:flex;flex-direction:column;gap:1px;min-width:0}
.home .step b{font-size:14px;color:var(--ink)}
.home .step.wait b{color:var(--ink-3);font-weight:600}
.home .step small{font-size:12.5px;color:var(--ink-2)}

.home .helpful{flex:0 0 auto;display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--ink-3)}
.home .helpful .hv{width:34px;height:34px;border-radius:8px;box-shadow:0 0 0 1px var(--line-2);
  display:grid;place-items:center;font-size:15px}
.home .helpful .hv.on{background:var(--accent-soft);box-shadow:0 0 0 1px var(--accent)}
.home .qline{font-size:13px;color:var(--ink-2)}
.home .acard{padding:10px 12px;border-radius:var(--radius);background:var(--surface);box-shadow:0 0 0 1px var(--line)}
.home .atext{margin:0;font-size:15px;line-height:1.45;color:var(--ink)}
.home .places{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.home .pchip{min-height:36px;padding:0 10px;border-radius:999px;font-size:13px;font-weight:700;
  color:var(--accent-ink);box-shadow:0 0 0 1px var(--line-2)}
.home .src{padding:7px 0;border-top:1px solid var(--line)}
.home .src:first-child{border-top:0}
.home .quote{font-size:13.5px;line-height:1.4;color:var(--ink)}
.home .acts{flex:0 0 auto;display:flex;gap:8px}
.home .hbtn{flex:1 1 0;height:44px;border-radius:var(--radius-sm);box-shadow:0 0 0 1px var(--line-2);
  font-size:14px;font-weight:600;color:var(--ink);text-align:center}
.home .energy .big{font-size:17px;color:var(--ink)}
