/* HOLYLAND phone landscape shell.
   The physical left safe-area becomes navigation space, so the iPhone cutout
   never overlaps the conversation. Portrait and desktop remain untouched. */
/* Условие «альбомная» врёт, когда открыта клавиатура: она съедает высоту,
   высота становится меньше ширины, и браузер честно объявляет ориентацию
   альбомной. На телефоне 320 в ширину это и случилось — нижняя панель встала
   боковой полосой посреди портрета, и Лираз сняла это 20.09.

   Спрашиваем то, что на самом деле хотим знать: НЕ ОТКРЫТА ЛИ КЛАВИАТУРА.
   Признак kb-open ставит подгонка под видимую область по настоящему замеру,
   а не по догадке. Это и есть починка, а не обход.

   Ширина остаётся вторым рубежом — для браузеров, где видимую область
   померить нечем и признак поставить неоткуда. Настоящая альбомная у
   телефона всегда шире 480 точек: узкий 320-точечный экран в альбомной
   даёт 538; портрет с клавиатурой остаётся 320. */
@media (orientation:landscape) and (max-height:520px) and (min-width:480px){
  html[data-kind="phone"]:not(.kb-open){
    --hl-landscape-rail:calc(64px + env(safe-area-inset-left,0px));
    --hl-landscape-right:env(safe-area-inset-right,0px);
  }

  html[data-kind="phone"]:not(.kb-open) #app.is-entered{
    height:var(--app-h,100dvh);
    min-height:0;
    overflow:hidden;
  }
  html[data-kind="phone"]:not(.kb-open) .topbar,
  html[data-kind="phone"]:not(.kb-open) .main{
    margin-left:var(--hl-landscape-rail);
    margin-right:var(--hl-landscape-right);
    min-width:0;
  }
  html[data-kind="phone"]:not(.kb-open) .main{min-height:0}
  html[data-kind="phone"]:not(.kb-open) .view{
    padding-bottom:calc(18px + env(safe-area-inset-bottom,0px));
  }
  html[data-kind="phone"]:not(.kb-open) #v-music,
  html[data-kind="phone"]:not(.kb-open) #v-stickers{padding-bottom:0}

  html[data-kind="phone"]:not(.kb-open) .tabbar,
  html[data-kind="phone"]:not(.kb-open) .tabbar.hlhide,
  html[data-kind="phone"]:not(.kb-open) .tabbar.hlifhide,
  html[data-kind="phone"]:not(.kb-open) .tabbar.hlhide2{
    position:fixed!important;
    top:0!important;right:auto!important;bottom:0!important;left:0!important;
    transform:none!important;
    z-index:52;
    box-sizing:border-box;
    width:var(--hl-landscape-rail);
    height:var(--app-h,100dvh);
    display:flex!important;
    flex-direction:column;
    align-items:flex-end;
    justify-content:center;
    gap:3px;
    padding:
      max(7px,env(safe-area-inset-top,0px))
      6px
      max(7px,env(safe-area-inset-bottom,0px))
      max(6px,env(safe-area-inset-left,0px));
    border:0;
    border-right:1px solid rgba(209,191,235,.14);
    background:linear-gradient(180deg,rgba(8,6,15,.98),rgba(13,8,24,.98));
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    overflow:hidden;
  }
  html[data-kind="phone"]:not(.kb-open) .tab{
    flex:1 1 0;
    width:52px;
    max-height:64px;
    min-height:0;
    padding:5px 3px;
    border:1px solid transparent;
    border-radius:14px;
    justify-content:center;
    gap:2px;
    font-size:8px;
    line-height:1.05;
    white-space:nowrap;
    overflow:hidden;
  }
  html[data-kind="phone"]:not(.kb-open) .tab.on{
    border-color:rgba(230,198,106,.3);
    background:linear-gradient(145deg,rgba(230,198,106,.14),rgba(91,43,132,.2));
  }
  html[data-kind="phone"]:not(.kb-open) .tab .nav-icon{width:20px;height:20px;flex:0 0 auto}
  html[data-kind="phone"]:not(.kb-open) .tab > span:last-child{
    display:block;
    width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
    text-align:center;
  }

  html[data-kind="phone"]:not(.kb-open)[data-fit="on"] #room{
    left:var(--hl-landscape-rail)!important;
    right:var(--hl-landscape-right)!important;
    top:0!important;
    width:auto!important;
    height:var(--app-h,100dvh)!important;
    max-height:var(--app-h,100dvh)!important;
  }
  html[data-kind="phone"]:not(.kb-open) #room .rhead{
    min-height:62px;
    padding:7px max(16px,env(safe-area-inset-right,0px)) 7px 18px;
  }
  html[data-kind="phone"]:not(.kb-open) #room .msgs{
    padding-left:18px;
    padding-right:max(18px,env(safe-area-inset-right,0px));
  }
  html[data-kind="phone"]:not(.kb-open) #room .composer,
  html[data-kind="phone"]:not(.kb-open) #room .replybar{
    padding-right:max(12px,env(safe-area-inset-right,0px));
  }

  html[data-kind="phone"]:not(.kb-open)[data-theme="light"] .tabbar{
    border-right-color:rgba(92,55,124,.16);
    background:linear-gradient(180deg,rgba(249,245,252,.98),rgba(238,229,246,.98));
  }
}