/* Mobile immersive clean 20260730
   作用：减少手机端底部遮挡，让视频背景更明显。
   1. 底部功能栏隐藏“五行”入口，只保留：八字 / 合婚 / 择吉 / 起名 / 我的。
   2. 展开填写后，不再显示“收起看全景”按钮。
   3. 填写面板改成更透明的玻璃感，少挡背景动效。
*/
@media (max-width: 820px) {
  .mobile-bottom-nav {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  }

  .mobile-bottom-nav button[data-nav-key="supp"] {
    display: none !important;
  }
}

@media (max-width: 900px) {
  body.mobile-scene-entered.mobile-drawer-expanded .mobile-drawer-toggle {
    display: none !important;
  }

  body.mobile-scene-entered.mobile-drawer-collapsed .mobile-drawer-toggle {
    background: linear-gradient(180deg, rgba(255, 248, 222, .74), rgba(221, 193, 124, .56)) !important;
    border-color: rgba(246, 228, 171, .54) !important;
    box-shadow: 0 10px 24px rgba(0, 0, 0, .18) !important;
  }

  body.mobile-scene-entered.mobile-has-bottom-drawer #tab-bazi.tab-panel.active > .card:first-child,
  body.mobile-scene-entered.mobile-has-bottom-drawer #tab-heqin.tab-panel.active > .card:first-child,
  body.mobile-scene-entered.mobile-has-bottom-drawer #tab-zeri.tab-panel.active > .card:first-child,
  body.mobile-scene-entered.mobile-has-bottom-drawer #tab-naming.tab-panel.active > .card:first-child {
    background: linear-gradient(180deg, rgba(247, 239, 211, .42), rgba(223, 232, 214, .26)) !important;
    border-color: rgba(241, 222, 163, .38) !important;
    box-shadow: 0 -14px 34px rgba(5, 24, 21, .24) !important;
    backdrop-filter: blur(10px) saturate(1.08) !important;
    -webkit-backdrop-filter: blur(10px) saturate(1.08) !important;
  }

  body.mobile-scene-entered.mobile-drawer-collapsed.mobile-has-bottom-drawer #tab-bazi.tab-panel.active > .card:first-child,
  body.mobile-scene-entered.mobile-drawer-collapsed.mobile-has-bottom-drawer #tab-heqin.tab-panel.active > .card:first-child,
  body.mobile-scene-entered.mobile-drawer-collapsed.mobile-has-bottom-drawer #tab-zeri.tab-panel.active > .card:first-child,
  body.mobile-scene-entered.mobile-drawer-collapsed.mobile-has-bottom-drawer #tab-naming.tab-panel.active > .card:first-child {
    background: linear-gradient(180deg, rgba(246, 239, 211, .28), rgba(221, 231, 213, .18)) !important;
    border-color: rgba(241, 222, 163, .30) !important;
    box-shadow: 0 -10px 26px rgba(5, 24, 21, .18) !important;
  }

  body.mobile-scene-entered.mobile-has-bottom-drawer input,
  body.mobile-scene-entered.mobile-has-bottom-drawer select,
  body.mobile-scene-entered.mobile-has-bottom-drawer textarea {
    background: rgba(255, 255, 255, .46) !important;
    backdrop-filter: blur(6px) !important;
    -webkit-backdrop-filter: blur(6px) !important;
  }

  body.mobile-scene-entered.mobile-has-bottom-drawer .btn,
  body.mobile-scene-entered.mobile-has-bottom-drawer button.btn {
    box-shadow: 0 8px 20px rgba(0, 0, 0, .16) !important;
  }
}