/* THEIA — мобільні правки поверх збірки. Діють лише до 640px, крім кількох глобальних. */
:root { --thx-header: 100px; }
html { scroll-padding-top: var(--thx-header); }

@media (max-width: 640px) {
  /* 1. Віджет «Тея»: підказка не з'являється сама, пігулка тулиться в кут і не накриває кнопки */
  .th-hint { display: none !important; }
  .th-launch {
    left: auto !important; right: 10px !important; bottom: 10px !important;
    transform: scale(.86); transform-origin: right bottom;
  }
  body { padding-bottom: 56px; }

  /* 2. Шапка: підпис користувача і «Вийти» переїжджають у меню */
  [data-thx-hide] { display: none !important; }

  /* 3. Бургер і випадне меню */
  .thx-burger {
    display: inline-flex !important; align-items: center; justify-content: center;
    width: 44px; height: 44px; margin-left: auto; border-radius: 12px;
    border: 1px solid rgba(255,255,255,.18); background: rgba(10,20,23,.55);
    color: #fff; cursor: pointer; -webkit-tap-highlight-color: transparent;
  }
  .thx-burger svg { width: 22px; height: 22px; }
  .thx-menu {
    position: fixed; left: 8px; right: 8px; top: var(--thx-header);
    z-index: 2147483100; display: none; flex-direction: column; gap: 2px;
    padding: 8px; border-radius: 16px; border: 1px solid rgba(255,255,255,.14);
    background: rgba(6,20,23,.97); backdrop-filter: blur(12px);
    box-shadow: 0 18px 40px rgba(0,0,0,.45); max-height: 70vh; overflow-y: auto;
  }
  .thx-menu.open { display: flex; }
  .thx-menu a {
    display: block; padding: 13px 14px; border-radius: 10px;
    color: #e9eef0; font-size: 16px; line-height: 1.2; text-decoration: none;
  }
  .thx-menu a:active { background: rgba(242,178,51,.16); }
  .thx-menu .thx-sep { height: 1px; margin: 6px 4px; background: rgba(255,255,255,.12); }
  .thx-menu a.thx-accent { color: #f2b233; font-weight: 600; }

  /* 4. Поля форм — 16px, інакше iOS зумить сторінку при фокусі */
  input, textarea, select { font-size: 16px !important; }

  /* 5. Заголовки не ріжуться об правий край */
  h1, h2 { overflow-wrap: anywhere; }
  h1 { font-size: 38px !important; line-height: 1.06 !important; }

  /* 6. Горизонтальні скролери: видно, що є продовження */
  .thx-scrollhint {
    display: flex; align-items: center; gap: 6px; margin: 0 0 8px;
    font-size: 12px; color: #f2b233; opacity: .9;
  }
  .thx-scrollwrap { position: relative; }
  .thx-scrollwrap::after {
    content: ""; position: absolute; top: 0; right: 0; bottom: 0; width: 34px;
    pointer-events: none; background: linear-gradient(90deg, rgba(6,20,23,0), rgba(6,20,23,.85));
  }
}