* { margin:0; padding:0; box-sizing:border-box; }
body {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
  background: var(--bg);
  color: var(--text);
  font-size: 14px;
  line-height: 1.6;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: transparent;
}
button { cursor: pointer; border: none; outline: none; font-family: inherit; font-size: inherit; }
input, textarea, select { outline: none; font-family: inherit; font-size: inherit; }
a { text-decoration: none; color: inherit; }

/* ====== 响应式适配：手机/平板/PC ====== */

/* 手机端（<768px）：保持底部4Tab布局，全屏显示 */
@media (max-width: 767px) {
  body { background: var(--bg); }
  .sidebar-brand { display: none !important; }
}

/* 平板端（768-1023px）：左侧垂直导航 + 宽内容区 */
@media (min-width: 768px) and (max-width: 1023px) {
  body { background: #e8ecf2; display: flex; justify-content: center; min-height: 100vh; }
  #loginPage { max-width: 100%; width: 100%; }
  .login-box { max-width: 440px; }
  #appMain {
    max-width: 100%; width: 100%; height: 100vh;
    flex-direction: row !important;
  }
  .bottom-tabs {
    position: static !important; flex-direction: column !important;
    width: 80px !important; height: 100vh !important; flex-shrink: 0;
    box-shadow: 1px 0 0 var(--border-light);
    padding-bottom: 0 !important; justify-content: flex-start !important;
    padding-top: 8px !important;
  }
  .sidebar-brand { display: block !important; padding: 12px 8px 8px !important; border-bottom: 1px solid var(--border-light) !important; }
  .sidebar-brand i { font-size: 24px !important; }
  .sidebar-brand div { display: none !important; }
  .sidebar-user { display: none !important; }
  .bottom-tab {
    flex: none !important; padding: 14px 0 10px !important; gap: 3px !important;
  }
  .bottom-tab i { font-size: 20px !important; }
  .bottom-tab span:not(.badge) { font-size: 10px !important; }
  .bottom-tab .badge { right: calc(50% - 14px) !important; top: 6px !important; }
  .app-content { padding-bottom: 0 !important; }
  .app-header { padding: 0 24px !important; }
  .work-grid { grid-template-columns: repeat(5, 1fr) !important; }
  .msg-item { max-width: 700px; margin: 0 auto; }
  .colleague-item { max-width: 700px; margin: 0 auto; }
  .detail-page {
    left: 80px !important; max-width: calc(100% - 80px) !important;
    transform: none !important;
    animation: detailSlideIn 0.25s ease !important;
  }
  .modal-overlay { align-items: center !important; }
  .modal-box { border-radius: var(--radius-xl) !important; max-width: 520px !important; max-height: 80vh !important; animation: none !important; }
  .mine-header { padding: 32px 24px 28px; }
  .mine-avatar { width: 68px; height: 68px; font-size: 32px; }
  #tabMine > div:last-child { max-width: 600px; margin: 0 auto; }
  .mine-menu-item { padding: 14px 18px; }
}

/* PC端（>=1024px）：左侧侧边栏 + 中间宽内容区 */
@media (min-width: 1024px) {
  body { background: #e8ecf2; display: flex; justify-content: center; min-height: 100vh; }
  #loginPage { max-width: 100%; width: 100%; }
  .login-box { max-width: 440px; }
  #appMain {
    max-width: 100%; width: 100%; height: 100vh;
    flex-direction: row !important;
  }
  .bottom-tabs {
    position: static !important; flex-direction: column !important;
    width: 220px !important; height: 100vh !important; flex-shrink: 0;
    background: #fff !important; box-shadow: 1px 0 0 var(--border-light);
    padding: 0 !important; padding-top: 0 !important; padding-bottom: 0 !important;
    justify-content: flex-start !important;
  }
  .sidebar-brand { display: block !important; padding: 20px 16px 16px !important; text-align: center !important; border-bottom: 1px solid var(--border-light) !important; }
  .sidebar-brand i { font-size: 28px !important; }
  .sidebar-brand div { display: block !important; }
  .sidebar-user { display: block !important; }
  .bottom-tab {
    flex: none !important; flex-direction: row !important;
    justify-content: flex-start !important;
    padding: 14px 24px !important; gap: 14px !important;
    border-radius: 0 !important; font-size: 15px !important;
    position: relative; margin: 2px 8px; border-radius: 8px !important;
  }
  .bottom-tab i { font-size: 18px !important; transform: none !important; }
  .bottom-tab span:not(.badge) { font-size: 15px !important; }
  .bottom-tab.active {
    background: var(--primary-light) !important; color: var(--primary) !important;
  }
  .bottom-tab.active i { transform: none !important; }
  .bottom-tab .badge { position: static !important; margin-left: auto; }
  .app-content { padding-bottom: 0 !important; }
  .app-header { padding: 0 32px !important; }
  .tab-page.active { max-width: 960px; margin: 0 auto; padding: 0 24px; }
  #tabMine.active { max-width: none; padding: 0; }
  #tabMine .mine-header { max-width: none; }
  .mine-header-inner { max-width: 960px; margin: 0 auto; }
  .work-grid { grid-template-columns: repeat(6, 1fr) !important; gap: 20px 12px !important; }
  .msg-item { max-width: 700px; margin: 0 auto; }
  .colleague-item { max-width: 700px; margin: 0 auto; }
  .detail-page {
    left: 220px !important; width: calc(100% - 220px) !important;
    max-width: 800px !important; transform: none !important;
    border-left: 1px solid var(--border-light);
    box-shadow: -4px 0 24px rgba(0,0,0,0.08);
    animation: detailSlideIn 0.25s ease !important;
  }
  .detail-page-body { max-width: 740px; margin: 0 auto; }
  .modal-overlay { align-items: center !important; }
  .modal-box { border-radius: var(--radius-xl) !important; max-width: 560px !important; max-height: 80vh !important; animation: none !important; }
  .mine-header { padding: 36px 32px 28px; }
  .mine-avatar { width: 72px; height: 72px; font-size: 34px; margin-bottom: 16px; }
  .mine-name { font-size: 22px; }
  .mine-info { font-size: 14px; }
  .mine-stat-val { font-size: 20px; }
  .mine-stat-label { font-size: 12px; }
  .mine-section { padding: 12px 24px; }
  .mine-menu-item { padding: 15px 20px; }
  .mine-menu-item i { font-size: 19px; width: 30px; }
  .mine-menu-item span { font-size: 15px; }
  #tabMine > div:last-child { max-width: 700px; margin: 0 auto; }
  .contact-search { padding: 12px 24px; }
}

/* 超大屏（>=1440px）：内容区居中限宽 */
@media (min-width: 1440px) {
  .work-grid { grid-template-columns: repeat(8, 1fr) !important; }
  .tab-page.active { max-width: 1100px; }
  #tabMine.active { max-width: none; }
  #tabMine .mine-header { max-width: none; }
  .mine-header-inner { max-width: 1100px; margin: 0 auto; }
  .detail-page { max-width: 900px !important; }
  .detail-page-body { max-width: 840px; }
  .mine-header { padding: 44px 40px 32px; }
  .mine-avatar { width: 80px; height: 80px; font-size: 38px; margin-bottom: 18px; }
  .mine-name { font-size: 24px; }
  .mine-stat-val { font-size: 22px; }
  #tabMine > div:last-child { max-width: 800px; }
  .mine-menu-item { padding: 16px 24px; gap: 14px; }
  .mine-menu-item i { font-size: 20px; width: 32px; }
  .mine-menu-item span { font-size: 16px; }
}