/* ============================================
   responsive.css — 手机自适应层（仅小屏生效）
   Node-StockLab · 纯CSS，不动布局逻辑
   断点：≤768px 手机 / ≤480px 小屏手机
   ============================================ */

@media (max-width: 768px) {
  /* 侧栏 → 顶部横向导航条 */
  .sidebar {
    position: fixed; inset: 0 0 auto 0; width: 100%; height: auto;
    flex-direction: row; align-items: center; gap: 6px;
    padding: 8px 10px; overflow-x: auto; overflow-y: hidden;
    border-right: none; border-bottom: 1px solid var(--line); z-index: 100;
  }
  .sidebar .brand { display: flex; align-items: center; gap: 6px; margin-right: 6px; flex-shrink: 0; }
  .sidebar .brand strong, .sidebar .brand span, .sidebar .privacy { display: none; }
  .sidebar nav { display: flex; flex-direction: row; gap: 2px; }
  .sidebar .nav { width: auto; margin: 0; padding: 7px 10px; font-size: 13px; white-space: nowrap; }
  .sidebar .nav.active { box-shadow: inset 0 -2px 0 var(--accent); }

  .shell { margin-left: 0; }

  /* 顶栏：收紧 + 可换行 */
  .top { padding: 10px 12px; flex-wrap: wrap; gap: 6px; }
  .top h1 { font-size: 17px; }
  .top p { font-size: 11px; }
  .top-status { flex-wrap: wrap; gap: 6px; font-size: 11px; }
  #topMarketState { font-size: 11px; padding: 3px 8px; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

  /* 卡片与栅格：单列化 */
  .card { padding: 14px; }
  .metrics { grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: 8px; }
  .card-head h3 { font-size: 15px; }
  .section-intro { padding: 6px 2px; }
  .section-intro h2 { font-size: 17px; }
  .hero-actions { flex-wrap: wrap; }
  .watch-grid, .near-grid, .quote-grid { grid-template-columns: 1fr; }
  .welcome { flex-direction: column; align-items: flex-start; gap: 10px; }
  .market-orb { display: none; }
  .search-form { flex-wrap: wrap; }
  .news-item { flex-wrap: wrap; }
  main { padding: 12px; }
}

@media (max-width: 480px) {
  .brand b { font-size: 13px; }
  .sidebar .nav { font-size: 12px; padding: 6px 8px; }
  #quickScan { font-size: 12px; padding: 6px 10px; }
  .top-status > span:first-child { display: none; } /* 数据源标签让位 */
}
