/* Keep the three workspace routes visible on phones without changing their pages. */
.mobile-bottom-nav,.mobile-drawer-heading { display:none; }
@media (max-width:767px) {
  #app { --mobile-navigation-height:64px; }
  .mobile-menu-button { flex-shrink:0; min-width:58px; min-height:44px; gap:5px; font-size:13px; }
  .mobile-menu-button > span:first-child { font-size:20px; line-height:1; }
  .app-logo-description { display:none; }
  .app-logo { white-space:nowrap; overflow:hidden; }
  .app-logo .logo-mark { flex-shrink:0; }
  .mobile-bottom-nav {
    position:fixed; left:0; right:0; bottom:0; z-index:1100;
    display:grid; grid-template-columns:repeat(4,minmax(0,1fr));
    height:calc(var(--mobile-navigation-height) + env(safe-area-inset-bottom,0px));
    box-sizing:border-box;
    padding:6px max(8px,env(safe-area-inset-right,0px)) calc(6px + env(safe-area-inset-bottom,0px)) max(8px,env(safe-area-inset-left,0px));
    border-top:1px solid var(--border,#d5e2f0); background:#fff;
    box-shadow:0 -3px 14px rgba(25,74,117,.05);
  }
  .mobile-bottom-nav > a,.mobile-bottom-nav > button {
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px;
    min-width:0; min-height:44px; margin:0; padding:3px 6px; border:0; border-radius:8px;
    background:transparent; color:#536c86; font:inherit; font-size:12px; line-height:1.3;
    text-decoration:none; cursor:pointer; -webkit-tap-highlight-color:transparent;
  }
  .mobile-bottom-nav .el-icon { width:21px; height:21px; font-size:21px; }
  .mobile-bottom-nav > .is-active { color:var(--primary,#26659c); background:#edf5fc; font-weight:650; }
  .mobile-bottom-nav > a:active,.mobile-bottom-nav > button:active { background:#e5effa; }
  .mobile-bottom-nav > a:focus-visible,.mobile-bottom-nav > button:focus-visible,.mobile-menu-button:focus-visible,.mobile-drawer-heading button:focus-visible { outline:2px solid var(--primary,#26659c); outline-offset:-2px; }
  .app-main-content { padding-bottom:calc(var(--mobile-navigation-height) + env(safe-area-inset-bottom,0px))!important; scroll-padding-bottom:20px; }
  .ai-fab { bottom:calc(var(--mobile-navigation-height) + env(safe-area-inset-bottom,0px) + 16px); }
  .ai-panel { bottom:calc(var(--mobile-navigation-height) + env(safe-area-inset-bottom,0px) + 80px); max-height:calc(100dvh - var(--mobile-navigation-height) - 150px); }
  .app-sidebar { padding-bottom:env(safe-area-inset-bottom,0px); }
  .mobile-drawer-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 12px 6px 20px; color:var(--primary-dark,#194a75); }
  .mobile-drawer-heading strong { font-size:16px; }
  .mobile-drawer-heading button { min-width:48px; min-height:44px; border:0; border-radius:6px; background:#edf5fc; color:var(--primary,#26659c); font:inherit; font-size:14px; cursor:pointer; }
}