/* ══════════════════════════════════════════════════════════════════════
   MIA 移动端专属样式 — 底部 Tab 导航，Chat 优先
   ══════════════════════════════════════════════════════════════════════ */

/* ── 底部 Tab 导航栏 ────────────────────────────────────────────────── */
.mia-mobile-tabbar {
  display: none; /* 默认隐藏，仅移动端显示 */
}

@media (max-width: 640px) {

  /* ── 底部导航 ── */
  .mia-mobile-tabbar {
    display: flex;
    position: fixed;
    bottom: 0; left: 0; right: 0;
    height: 3.25rem;
    background: #020617f5;
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border-top: 1px solid rgba(148, 163, 184, .12);
    z-index: 500;
    padding: 0 .5rem;
    justify-content: space-around;
    align-items: stretch;
  }

  .mia-mobile-tab {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .18rem;
    font-size: .62rem;
    font-weight: 600;
    letter-spacing: .02em;
    color: #64748B;
    background: none;
    border: none;
    cursor: pointer;
    border-top: 2px solid transparent;
    transition: color .2s ease, border-color .2s ease;
  }

  .mia-mobile-tab:active {
    opacity: .7;
  }

  .mia-mobile-tab.active {
    color: #22C55E;
    border-top-color: #22C55E;
  }

  .mia-mobile-tab-icon {
    font-size: 1.15rem;
    line-height: 1;
  }

  /* ── 页面留出底部 Tab 高度 ── */
  body {
    padding-bottom: 3.25rem !important;
  }

  /* ── 全局布局重置 ── */
  .mia-home-shell {
    gap: 0 !important;
    padding: 0 !important;
  }

  /* 状态栏紧凑化 */
  .mia-status-rail {
    display: none !important; /* 手机上完全隐藏状态栏，节省空间 */
  }

  .mia-layout-content {
    padding: .5rem .75rem !important;
  }

  /* ── Grid：单列，无间距 ── */
  .mia-home-grid {
    display: block !important;
    gap: 0 !important;
    grid-template-columns: 1fr !important;
  }

  /* ── 仪表盘列（数据 tab 时显示）── */
  .mia-dashboard-column {
    min-height: 0 !important;
    max-height: none !important;
    height: calc(100vh - 3.25rem - 3.25rem) !important;
    overflow-y: auto !important;
    padding: .6rem .75rem !important;
    display: none; /* JS 控制显示 */
  }

  .mia-dashboard-column.mia-mobile-active {
    display: block;
  }

  /* ── 聊天列（Chat tab 时显示）── */
  .mia-chat-column {
    min-height: 0 !important;
    max-height: none !important;
    height: calc(100vh - 3.25rem - 3.25rem) !important;
    padding: .5rem .75rem !important;
    display: none; /* JS 控制显示 */
  }

  .mia-chat-column.mia-mobile-active {
    display: flex;
    flex-direction: column;
  }

  .mia-chat-column-pinned {
    max-height: none !important;
    min-height: 0 !important;
    height: 100% !important;
    flex: 1 !important;
  }

  /* ── 聊天头部精简 ── */
  .mia-chat-header {
    margin-bottom: .4rem !important;
    padding-bottom: .35rem !important;
  }

  .mia-chat-header h2 {
    font-size: 1rem !important;
    font-weight: 700 !important;
  }

  .mia-column-subtitle {
    font-size: .68rem !important;
  }

  /* ── 快捷提示词紧凑 ── */
  .mia-quick-prompts {
    margin-bottom: .4rem !important;
  }

  .mia-quick-prompts-copy {
    display: none !important;
  }

  .mia-quick-prompts-list {
    gap: .3rem !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    padding-bottom: .2rem !important;
  }

  .mia-quick-prompt-chip {
    flex-shrink: 0 !important;
    font-size: .7rem !important;
    padding: .22rem .6rem !important;
    white-space: nowrap !important;
  }

  /* ── 聊天记录区（最关键）── */
  .mia-chat-history {
    flex: 1 !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  .mia-chat-history-scroll {
    height: 100% !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }

  /* ── 聊天气泡：字体显著放大 ── */
  .mia-chat-bubble {
    padding: .7rem .9rem !important;
    border-radius: .85rem !important;
    max-width: 88% !important;
  }

  .mia-chat-bubble p,
  .mia-chat-bubble div,
  .mia-chat-bubble span:not(.mia-chat-role) {
    font-size: .97rem !important;
    line-height: 1.65 !important;
  }

  /* 角色标签 */
  .mia-chat-role {
    font-size: .72rem !important;
    margin-bottom: .25rem !important;
  }

  /* 时间戳 */
  .mia-chat-time {
    font-size: .62rem !important;
    margin-top: .2rem !important;
  }

  /* ── 输入框区域 ── */
  .mia-chat-composer,
  .mia-chat-composer-row {
    padding: .5rem 0 0 !important;
  }

  .mia-chat-composer-input {
    font-size: .92rem !important;
    min-height: 2.5rem !important;
    max-height: 5rem !important;
    padding: .55rem .75rem !important;
    border-radius: .75rem !important;
    line-height: 1.5 !important;
  }

  .mia-chat-send-button {
    min-width: 3.75rem !important;
    min-height: 2.4rem !important;
    font-size: .85rem !important;
    font-weight: 700 !important;
    border-radius: .75rem !important;
    flex-shrink: 0 !important;
    flex-grow: 0 !important;
  }

  .mia-icon-btn {
    width: 2.1rem !important;
    height: 2.1rem !important;
    font-size: 1rem !important;
    flex-shrink: 0 !important;
  }

  .mia-chat-composer-row {
    gap: .4rem !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
  }

  /* ── 仪表盘 Tab 内内容优化 ── */
  .mia-tab-bar {
    gap: .2rem !important;
    padding-bottom: .4rem !important;
    margin-bottom: .6rem !important;
  }

  .mia-tab-button {
    font-size: .75rem !important;
    padding: .3rem .6rem !important;
  }

  .mia-column-header h2 {
    font-size: .95rem !important;
  }

  /* 卡片内文字 */
  .mia-panel p,
  .mia-chat-message p {
    font-size: .88rem !important;
    line-height: 1.6 !important;
  }

  /* ── 移动端在线状态指示点 ── */
  .mia-mobile-tabbar-badge {
    width: .45rem;
    height: .45rem;
    border-radius: 50%;
    background: #22C55E;
    position: absolute;
    top: .3rem;
    right: calc(50% - 1rem);
  }

} /* end @media (max-width: 640px) */


/* ── 480px 以下更激进的优化 ─────────────────────────────────────────── */
@media (max-width: 480px) {

  .mia-layout-header {
    height: 2.9rem !important;
    padding: 0 .85rem !important;
  }

  .mia-layout-brand-mark {
    width: 1.6rem !important;
    height: 1.6rem !important;
  }

  .mia-layout-brand-name {
    font-size: .9rem !important;
  }

  .mia-dashboard-column,
  .mia-chat-column {
    height: calc(100vh - 2.9rem - 3.25rem) !important;
  }

  /* 更大的发送按钮触摸区域 */
  .mia-chat-send-button {
    min-height: 2.7rem !important;
    min-width: 4rem !important;
  }

  .mia-chat-composer-input {
    min-height: 2.7rem !important;
  }

  .mia-chat-bubble p,
  .mia-chat-bubble div {
    font-size: 1rem !important;
  }

}