/* Мобильная версия «как приложение»: нижняя панель, компактная шапка, меню-шторка. */
:root{--tabbar-h:62px}
html{-webkit-tap-highlight-color:transparent}
a,button,summary,label,input,select,textarea{touch-action:manipulation}

/* плавные переходы между страницами (Chrome/Android): шапка и панель остаются на месте */
@view-transition{navigation:auto}
::view-transition-old(root),::view-transition-new(root){animation-duration:.16s}
.header{view-transition-name:m-header}
.m-tabbar{view-transition-name:m-tabbar}

.m-tabbar,.m-drawer-top{display:none}

@media (display-mode:standalone){
  html,body{overscroll-behavior-y:none}
  body{-webkit-touch-callout:none}
  .nav,.m-tabbar,.header,.btn,button{-webkit-user-select:none;user-select:none}
}

@media (max-width:820px){
  body{padding-bottom:calc(var(--tabbar-h) + env(safe-area-inset-bottom))}
  /* верхняя полоска с ссылками и языком уезжает в меню */
  .topbar{display:none}
  .header{padding-top:env(safe-area-inset-top);transition:transform .28s cubic-bezier(.22,.7,.3,1),box-shadow .2s}
  .header.is-hidden{transform:translateY(-110%)}
  .header__inner{min-height:58px;gap:10px}
  .brand{margin-right:auto}
  .brand__logo{width:auto;height:40px}
  .burger,.search-toggle,[aria-controls="searchPanel"]{min-width:44px;min-height:44px}
  .totop{display:none!important}
  input,select,textarea{font-size:16px!important}
  h1{overflow-wrap:anywhere;hyphens:auto}
  .hero h1{font-size:clamp(1.65rem,7.4vw,2.3rem);line-height:1.12}
  .container{padding-left:16px;padding-right:16px}

  /* нижняя панель вкладок */
  .m-tabbar{
    display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;z-index:120;
    padding:6px 6px calc(6px + env(safe-area-inset-bottom));
    background:rgba(255,255,255,.88);-webkit-backdrop-filter:blur(18px) saturate(160%);backdrop-filter:blur(18px) saturate(160%);
    border-top:1px solid var(--line);box-shadow:0 -10px 30px -18px rgba(36,18,66,.35);
    transition:transform .25s ease
  }
  .m-tab{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:50px;
    border:0;background:none;font:inherit;font-size:11px;font-weight:600;letter-spacing:0;color:var(--muted);text-decoration:none;border-radius:14px;cursor:pointer;
    transition:color .15s,transform .12s}
  .m-tab svg{width:24px;height:24px;transition:transform .2s}
  .m-tab:active{transform:scale(.92)}
  .m-tab.is-on{color:var(--tx-600)}
  .m-tab.is-on svg{transform:translateY(-1px)}
  .m-tab.is-on::before{content:"";position:absolute;top:-7px;left:50%;width:26px;height:3px;margin-left:-13px;border-radius:0 0 4px 4px;background:linear-gradient(90deg,var(--violet-500),var(--gold-500))}
  .m-tabbar.is-off{transform:translateY(110%)}
  .bot-lock .m-tabbar{display:none}
  .m-tabbar:has([data-m-menu].is-on) .m-tab:not([data-m-menu]){color:var(--muted)}
  .m-tabbar:has([data-m-menu].is-on) .m-tab:not([data-m-menu])::before{display:none}
  html:has(.nav.is-open) .bot-fab{display:none!important}

  /* меню-шторка */
  .nav{
    top:0;transform:translateY(100%);padding:calc(18px + env(safe-area-inset-top)) 0 calc(var(--tabbar-h) + 24px + env(safe-area-inset-bottom));
    border-radius:0;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;
    transition:transform .36s cubic-bezier(.22,.7,.3,1),visibility .36s;z-index:90
  }
  .nav.is-open{transform:none}
  .nav__list{padding:0 14px}
  .nav__list>li>a.nav__link{display:flex;align-items:center;justify-content:space-between;padding:15px 14px;font-weight:700;font-size:1.02rem;border-bottom:1px solid var(--line);border-radius:0}
  .nav__item--has-sub>a.nav__link::after{display:block!important;content:"";width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);opacity:.5;transition:transform .2s;position:static;margin-left:auto}
  .nav__item--has-sub.is-sub-open>a.nav__link::after{transform:rotate(-135deg)}
  .nav__item--has-sub>.nav__sub{display:none}
  .nav__item--has-sub.is-sub-open>.nav__sub{display:block;animation:mSub .22s ease}
  .nav__sub a{padding:12px 10px;font-size:.96rem;border-bottom:0}
  @keyframes mSub{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}

  .m-drawer-top{display:block;padding:0 14px 14px}
  .m-lang{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:4px;border-radius:14px;background:var(--violet-100)}
  .m-lang a{display:block;text-align:center;padding:11px 0;border-radius:11px;font-weight:700;font-size:.9rem;color:var(--ink-soft);text-decoration:none;border:0!important}
  .m-lang a.is-active{background:#fff;color:var(--tx-700);box-shadow:var(--shadow-sm)}
  .m-quick{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
  .m-quick a,.m-quick button{display:flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 10px;border:1px solid var(--line);border-radius:14px;background:var(--surface);font:inherit;font-size:.88rem;font-weight:600;color:var(--ink);text-decoration:none;cursor:pointer}
  .m-quick svg{width:18px;height:18px;flex:none}
  .m-quick .is-green{background:linear-gradient(135deg,#1f8a5b,#2fb37a);border-color:transparent;color:#fff}

  /* нажатие, как в приложении */
  .ab-feat:active,.ab-card:active,.ab-hubcard:active,.btn:active,.ab-tab:active,.card:active{transform:scale(.97)}

  /* чат-бот: тихая круглая кнопка над нижней панелью, без анимаций и подписей */
  html body .fab-group,html body .bot-fab--solo{bottom:calc(var(--tabbar-h) + env(safe-area-inset-bottom) + 14px)!important;right:14px!important}
  html body .bot-fab,html body .bot-fab.is-expanded{padding:0!important;background:transparent!important;box-shadow:none!important;border:0!important}
  html body .bot-fab .bot-fab__label,html body .bot-fab .bot-fab__badge,html body .bot-teaser{display:none!important}
  html body .bot-fab .bot-fab__ico{width:50px;height:50px;animation:none!important;box-shadow:0 8px 20px rgba(67,36,123,.4),0 0 0 2px #fff}
  html body .bot-fab .bot-fab__ico svg{width:24px;height:24px}
  html body .bot-fab .bot-fab__ico::after{width:11px;height:11px;box-shadow:0 0 0 2px #fff}
  html body .bot-fab{animation:none!important}
  /* окно чата — шторка на весь экран, выезжает снизу */
  html body .bot-head{padding-top:calc(.9rem + env(safe-area-inset-top))}
  html body .bot-panel{border-radius:0;padding-bottom:env(safe-area-inset-bottom);transform:translateY(100%);opacity:1;transition:transform .3s cubic-bezier(.22,.7,.3,1)}
  html body .bot-root.is-open .bot-panel{transform:none}
}
@media (max-width:820px) and (prefers-reduced-motion:reduce){.nav,.m-tabbar,.header{transition:none}}