/* Shared navigation and office-page typography. Preserve the live palette and content surfaces. */
#root .app-shell {
  --shell-text: 14px;
  --shell-label: 13px;
  --shell-space: 8px;
}
#root .app-shell > :is(.topbar,.primary-rail,.secondary-sidebar,.secondary-opener) {
  line-height: 1.5;
}
#root .app-shell .top-brand { min-width: 0; }
#root .app-shell .top-brand > span { min-width: 0; }
#root .app-shell .top-brand b { font-size: 15px; line-height: 1.45; letter-spacing: .01em; }
#root .app-shell .top-brand small { font-size: 13px; line-height: 1.5; }
#root .app-shell .top-context { gap: 12px; }
#root .app-shell .primary-rail nav > button { color: #dce7f1; background: transparent; min-height: 56px; }
#root .app-shell .primary-rail nav > button small { font-size: var(--shell-label); line-height: 1.5; letter-spacing: 0; }
#root .app-shell .primary-rail nav > button.active { color: #fff; background: #344b5c; border-color: #61727f; }
#root .app-shell .primary-rail nav > button:hover { color: #fff; background: #304959; }
#root .app-shell .primary-rail nav > button:focus-visible { outline: 2px solid #d6e9ff; outline-offset: -3px; }
#root .app-shell .primary-rail .shell-nav-more { display: none; }
#root .app-shell .secondary-sidebar nav { align-content: start; gap: 4px; }
#root .app-shell .secondary-sidebar nav button { min-height: 44px; padding: 10px 12px; font-size: var(--shell-text); line-height: 1.5; }
#root .app-shell .secondary-route-label { overflow-wrap: anywhere; }
#root .app-shell .secondary-sidebar header h2 { font-size: 20px; font-weight: 600; line-height: 1.4; }
#root .app-shell .breadcrumb { min-height: 48px; gap: 8px; font-size: 13px; line-height: 1.5; }
#root .app-shell .breadcrumb > button { min-width: 44px; min-height: 44px; }
#root .app-shell:not(:has(.executive-cockpit,.assistant-workspace,.research-figure-module,.figure-family-home)) .main-content :is(.page-header h1,.panel-header h2) {
  letter-spacing: 0; font-weight: 600;
}
#root .app-shell:not(:has(.executive-cockpit,.assistant-workspace,.research-figure-module,.figure-family-home)) .main-content .page-header h1 { font-size: 24px; line-height: 1.45; }
#root .app-shell:not(:has(.executive-cockpit,.assistant-workspace,.research-figure-module,.figure-family-home)) .main-content .panel-header h2 { font-size: 18px; line-height: 1.5; }
#root .app-shell:not(:has(.executive-cockpit,.assistant-workspace,.research-figure-module,.figure-family-home)) .main-content :is(.page-description,.panel-header p) { font-size: 14px; line-height: 1.7; }
@media (max-width: 760px) {
  #root .app-shell { grid-template-columns: minmax(0,1fr); grid-template-rows: auto auto minmax(0,1fr); }
  #root .app-shell > .topbar { position: relative; top: auto; min-height: 64px; height: auto; padding: 12px 16px; gap: 12px; flex-wrap: wrap; }
  #root .app-shell .top-brand { flex: 1 1 180px; }
  #root .app-shell .top-brand b { white-space: normal; }
  #root .app-shell .top-context { min-width: 0; max-width: 100%; gap: 8px; flex-wrap: wrap; }
  #root .app-shell > .primary-rail { position: fixed; z-index: 70; inset: auto 0 0; width: 100%; height: auto; max-height: 65dvh; overflow-y: auto; padding: 6px 8px calc(6px + env(safe-area-inset-bottom,0px)); border: 0; border-top: 1px solid #61727f; }
  #root .app-shell .primary-rail nav { display: grid; width: 100%; grid-template-columns: repeat(var(--shell-nav-count),minmax(0,1fr)); gap: 4px; overflow: visible; }
  #root .app-shell .primary-rail nav > button { width: 100%; min-width: 0; min-height: 60px; padding: 6px 2px; gap: 2px; flex: initial; }
  #root .app-shell .primary-rail nav > button::before { display: none; }
  #root .app-shell .primary-rail nav > button span { width: 24px; height: 24px; }
  #root .app-shell .primary-rail nav > button small { white-space: normal; }
  #root .app-shell .primary-rail .writing-preview-label { font-size: 11px; white-space: normal; }
  #root .app-shell .primary-rail[data-shell-menu-open="false"] nav > button:nth-of-type(n+5):not(.shell-nav-more) { display: none; }
  #root .app-shell .primary-rail nav > .shell-nav-more { display: grid; }
  #root .app-shell .primary-rail[data-shell-menu-open="true"] nav { grid-template-columns: repeat(4,minmax(0,1fr)); }
  #root .app-shell .primary-rail[data-shell-menu-open="true"] .shell-nav-more { grid-column: 1 / -1; min-height: 44px; display: flex; align-items: center; justify-content: center; }
  #root .app-shell > .secondary-sidebar { grid-column: 1; position: relative; inset: auto; width: 100%; height: auto; padding: 8px 12px; }
  #root .app-shell .secondary-sidebar nav { display: flex; flex-wrap: wrap; gap: 4px; overflow: visible; padding: 0; }
  #root .app-shell .secondary-sidebar nav button { width: auto; max-width: 100%; min-height: 44px; padding: 8px 12px; }
  #root .app-shell.secondary-collapsed > .secondary-sidebar { display: none; }
  #root .app-shell > .secondary-opener { display: flex; position: relative; inset: auto; grid-column: 1; width: 100%; min-height: 44px; padding: 8px 16px; align-items: center; gap: 8px; }
  #root .app-shell > .secondary-opener::after { content: "展开本栏功能"; font-size: 14px; }
  #root .app-shell > .main-content { grid-column: 1; padding: 0 16px calc(104px + env(safe-area-inset-bottom,0px)); }
  #root .app-shell .breadcrumb { margin-bottom: 12px; flex-wrap: wrap; }
  #root .app-shell:not(:has(.executive-cockpit,.assistant-workspace,.research-figure-module,.figure-family-home)) .main-content .page-header h1 { font-size: 21px; }
}
