/* Бургер-бейдж на логотипе + выпадающее меню (только сайт; в Telegram — нижняя панель). */
.vf-burger { display: none; }
.vf-web-menu, .vf-web-menu-backdrop { display: none; }

@media (max-width: 960px) {
    /* нижней панели на сайте нет — меню в логотипе */
    html.vf-web-nav .bottom-nav { display: none !important; }
    html.vf-web-nav body.page-main, html.vf-web-nav body.veo-generation-body { padding-bottom: 0 !important; }

    .vf-burger {
        position: absolute; right: -6px; bottom: -5px; z-index: 5; width: 20px; height: 20px; border-radius: 50%;
        display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2.2px;
        background: var(--vf-cta); box-shadow: 0 0 0 2px #040404, 0 4px 14px rgba(236, 224, 198, 0.35);
        transition: transform 0.45s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.3s;
    }
    .vf-burger span { display: block; width: 9px; height: 1.7px; border-radius: 2px; background: var(--vf-on); transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.2s; }
    html.vf-menu-open .vf-burger { transform: scale(1.12) rotate(90deg); box-shadow: 0 0 0 2px #040404, 0 0 22px rgba(236, 224, 198, 0.7); }
    html.vf-menu-open .vf-burger span:nth-child(1) { transform: translateY(3.9px) rotate(45deg); }
    html.vf-menu-open .vf-burger span:nth-child(2) { opacity: 0; }
    html.vf-menu-open .vf-burger span:nth-child(3) { transform: translateY(-3.9px) rotate(-45deg); }
    .veo-mobile-header-brand-trigger .veo-mobile-nav-trigger-icon { display: none !important; }
    .veo-mobile-header-brand-trigger:active .vf-burger, .mobile-logo:active .vf-burger { transform: scale(0.9); }

    .vf-web-menu-backdrop { display: block; position: fixed; inset: 0; z-index: 9990; background: rgba(0, 0, 0, 0.6); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); opacity: 0; pointer-events: none; transition: opacity 0.3s; }
    html.vf-menu-open .vf-web-menu-backdrop { opacity: 1; pointer-events: auto; }
    .vf-web-menu {
        display: flex; flex-direction: column; gap: 6px; position: fixed; z-index: 9991; left: 10px; right: 10px;
        top: calc(env(safe-area-inset-top, 0px) + 62px); max-width: 460px; padding: 10px;
        border-radius: 24px; background: rgba(9, 9, 13, 0.97); border: 1px solid rgba(247, 239, 222, 0.2);
        box-shadow: 0 30px 80px -16px rgba(0, 0, 0, 0.95), 0 0 60px rgba(247, 239, 222, 0.05);
        opacity: 0; transform: translateY(-10px) scale(0.98); transform-origin: 24px -8px; pointer-events: none;
        transition: opacity 0.25s ease, transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
    }
    html.vf-menu-open .vf-web-menu { opacity: 1; transform: none; pointer-events: auto; }
    .vf-web-menu a {
        display: flex; align-items: center; gap: 14px; padding: 14px; border-radius: 16px; color: #ececf1; text-decoration: none;
        font: 700 16px/1.2 "Inter", -apple-system, sans-serif; background: rgba(247, 239, 222, 0.04);
        opacity: 0; transform: translateX(-12px); transition: opacity 0.3s ease, transform 0.45s cubic-bezier(0.22, 1, 0.36, 1), background 0.2s;
    }
    html.vf-menu-open .vf-web-menu a { opacity: 1; transform: none; transition-delay: calc(var(--i) * 45ms + 60ms), calc(var(--i) * 45ms + 60ms), 0s; }
    .vf-web-menu a:active { background: rgba(247, 239, 222, 0.14); }
    .vf-web-menu a svg { width: 22px; height: 22px; stroke: var(--vf-ink); fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: 0 0 22px; }
    .vf-web-menu a.is-on { background: var(--vf-cta); color: var(--vf-on); }
    .vf-web-menu a.is-on svg { stroke: var(--vf-on); }
    html.vf-menu-open { overflow: hidden; }
}
@media (prefers-reduced-motion: reduce) { .vf-web-menu, .vf-web-menu a, .vf-burger, .vf-burger span { transition-duration: 0.01ms !important; } }
@media (max-width: 960px) {
    .vf-web-menu { max-height: calc(calc(100svh / var(--vf-z, 1)) - 80px - env(safe-area-inset-top, 0px)); overflow-y: auto; gap: 4px; background: rgba(8, 9, 9, 0.97) !important; border-color: rgba(236, 224, 198, 0.2) !important; }
    .vf-web-menu a { padding: 12px 14px; font-size: 15px; }
    .vf-web-menu a:nth-child(6) { margin-top: 8px; position: relative; }
    .vf-web-menu a:nth-child(6)::before { content: ""; position: absolute; left: 12px; right: 12px; top: -7px; height: 1px; background: rgba(236, 224, 198, 0.14); }
    .vf-web-menu a:active { background: rgba(236, 224, 198, 0.16) !important; }
}
