/* 百工AI 全局移动端适配 v2 — 与theme.css协同 */
/* theme.css已有3档响应式(1024/768/767)，本文件补充页面级移动端细节 */

/* ===== 基础防溢出 ===== */
html{overflow-x:hidden;max-width:100vw}
body{overflow-x:hidden!important;max-width:100vw!important;-webkit-text-size-adjust:100%}

/* ===== 手机端(<768px) ===== */
@media(max-width:767px){
  /* 底部Tab栏空间 */
  body{padding-bottom:64px!important}
  .site-footer,.footer{padding-bottom:78px!important}

  /* 安全区域(iPhone刘海/底部横条) */
  @supports(padding:max(0px)){
    .sb-tab-bar{padding-bottom:max(6px,env(safe-area-inset-bottom))}
    body{padding-bottom:max(64px,calc(64px + env(safe-area-inset-bottom)))!important}
  }

  /* 首页英雄区 */
  .hero,.hero-section,.hero-area{padding:28px 14px 18px!important}
  .hero h1,.hero-section h1{font-size:22px!important;line-height:1.3!important}
  .hero p,.hero-section p{font-size:14px!important}
  .hero-btns,.hero-actions{flex-direction:column!important;gap:8px!important}
  .hero-btns a,.hero-actions a,.hero-btns button,.hero-actions button{width:100%!important;text-align:center!important}

  /* 技能卡片网格 — 2列优先，极小屏1列 */
  .skill-grid,.skills-grid{
    grid-template-columns:repeat(2,1fr)!important;
    gap:10px!important;
  }
  .skill-card,.skill-item{
    border-radius:10px!important;
    overflow:hidden!important;
  }
  .skill-card .card-body,.skill-card .skill-info{padding:10px!important}
  .skill-card h3,.skill-card .skill-name{font-size:13px!important;line-height:1.3!important}
  .skill-card p,.skill-card .skill-desc{font-size:12px!important;-webkit-line-clamp:2!important;display:-webkit-box!important;-webkit-box-orient:vertical!important;overflow:hidden!important}
  .skill-card .price,.skill-card .skill-price{font-size:13px!important}
  .skill-card img,.skill-card .cover{height:100px!important;object-fit:cover!important}

  /* 极小屏(≤375px)回退1列 */
  @media(max-width:375px){
    .skill-grid,.skills-grid{grid-template-columns:1fr!important}
  }

  /* 分类栏 — 横向滚动 */
  .cat-grid,.cat-bar,.category-bar,.cat-nav{
    display:flex!important;
    overflow-x:auto!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
    gap:6px!important;
    padding:6px 0!important;
    white-space:nowrap!important;
    flex-wrap:nowrap!important;
  }
  .cat-grid::-webkit-scrollbar,.cat-bar::-webkit-scrollbar{display:none!important}
  .cat-card,.cat-btn,.category-item{
    flex-shrink:0!important;
    padding:6px 14px!important;
    font-size:13px!important;
    border-radius:20px!important;
  }

  /* 市场页 */
  .market-grid,.market-content .grid{
    grid-template-columns:1fr!important;
    gap:12px!important;
  }
  .combo-card,.combo-item{border-radius:12px!important;padding:14px!important}
  .combo-card h3{font-size:15px!important}
  .combo-pricing{flex-wrap:wrap!important}

  /* 管家页(butler)侧边栏 */
  .sidebar{position:fixed!important;left:0;top:0;height:100%!important;z-index:50!important;transform:translateX(-100%)!important;transition:transform .25s ease!important}
  .sidebar.open{transform:translateX(0)!important}
  .menu-btn,.sidebar-toggle{display:flex!important}
  .chat-area,.chat-main{padding:0 6px!important}
  .msg-bubble,.message-bubble{max-width:88%!important;font-size:14px!important;padding:10px 12px!important}
  .input-area,.chat-input-bar{padding:8px 6px!important;padding-bottom:max(8px,env(safe-area-inset-bottom))!important}
  .input-area textarea,.chat-input-bar textarea{font-size:16px!important;min-height:40px!important}

  /* 空间页(space) */
  .space-sidebar,.profile-sidebar,.side-panel{
    position:fixed!important;left:0;top:0;height:100%!important;z-index:50!important;
    transform:translateX(-100%)!important;transition:transform .25s ease!important;
    width:280px!important;
  }
  .space-sidebar.open,.profile-sidebar.open{transform:translateX(0)!important}
  .space-main,.main-content{width:100%!important;margin-left:0!important}

  /* 技能详情页 */
  .detail-layout,.skill-detail-grid{flex-direction:column!important}
  .detail-sidebar,.detail-aside{width:100%!important;border-right:none!important;border-bottom:1px solid #e5e7eb!important}
  .review-section,.rating-area{padding:12px!important}

  /* 弹窗/面板 */
  .modal,.overlay-panel,.popup{
    margin:0!important;left:0!important;right:0!important;bottom:0!important;
    width:100%!important;max-width:100%!important;
    max-height:85vh!important;border-radius:16px 16px 0 0!important;
    overflow-y:auto!important;
  }
  .modal-overlay,.overlay-bg{background:rgba(0,0,0,.4)!important}

  /* 表单 */
  input,textarea,select,.form-input{
    font-size:16px!important;
    min-height:44px!important;
    padding:10px 12px!important;
    border-radius:8px!important;
  }
  button,a.btn,.btn{
    min-height:44px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:10px 18px!important;
    font-size:14px!important;
  }

  /* 导航 */
  .nav-links{display:none!important}
  .nav-hamburger{display:block!important}
  .nav-dropdown.show{display:block!important}

  /* Tab栏 */
  .sb-tab-bar{display:flex!important;position:fixed!important;bottom:0!important;left:0!important;right:0!important;z-index:999!important;background:#fff!important;border-top:1px solid #e5e7eb!important}

  /* 通用间距收紧 */
  .section,.section-block{padding:20px 12px!important}
  .container,.page-container{padding:0 12px!important}
}
/* ===== 手机端页面级增强 ===== */
@media(max-width:767px){


  /* ===== 首页home_v2 增强 ===== */
  #skillBodyCards{grid-template-columns:repeat(2,1fr)!important;gap:8px!important}
  #skillBodyWall{padding:0 8px!important;margin:12px auto 0!important}
  .sb-card{padding:10px 8px!important;border-radius:10px!important}
  .sb-icon{font-size:24px!important;width:36px!important;height:36px!important}
  .sb-name{font-size:11px!important;line-height:1.2!important}
  .sb-tag{font-size:10px!important;padding:1px 6px!important}
  #heroChatContainer{margin:12px 8px 0!important}
  .ic-in{padding:10px 12px 0!important}
  .ic-in textarea{font-size:16px!important}
  .ic-bar{padding:4px 8px 6px!important;gap:4px!important}
  .ic-bar button,.ic-bar .ib-btn{min-width:32px!important;min-height:32px!important;font-size:14px!important;padding:4px 8px!important}
  #heroChatArea{max-height:300px!important}
  .hero-chat-msg{font-size:14px!important;padding:8px 10px!important;max-width:90%!important}
  .plus-panel{bottom:52px!important;left:4px!important;right:4px!important;border-radius:12px!important}

  /* ===== butler管家页增强 ===== */
  #sidebarOverlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:49}
  #sidebarOverlay.show{display:block}
  .sidebar{width:260px!important;background:#fff!important;box-shadow:2px 0 12px rgba(0,0,0,.08)!important}
  .chat-main,.chat-area{width:100%!important;padding:0!important}
  #msgWrap{padding:8px 4px!important}
  .msg{padding:6px 8px!important}
  .msg .m-body{font-size:14px!important;max-width:85%!important;padding:8px 10px!important;border-radius:12px!important}
  .msg.me .m-body{border-radius:12px 12px 4px 12px!important}
  .msg.bot .m-body{border-radius:12px 12px 12px 4px!important}
  #inputBar{padding:6px 8px!important;padding-bottom:max(6px,env(safe-area-inset-bottom))!important;gap:4px!important}
  #inputBar textarea{font-size:16px!important;min-height:36px!important}
  #comboPanel{position:fixed!important;bottom:0!important;left:0!important;right:0!important;top:auto!important;width:100%!important;max-height:55vh!important;border-radius:16px 16px 0 0!important;box-shadow:0 -4px 20px rgba(0,0,0,.12)!important}
  .combo-card{padding:10px 12px!important;margin-bottom:6px!important;border-radius:10px!important}
  .cc-name{font-size:14px!important}
  .cc-desc{font-size:12px!important}
  .cc-meta{font-size:11px!important;gap:6px!important}
  .settings-panel,.kb-panel,.cap-panel{width:100%!important;max-width:100%!important;height:85vh!important;border-radius:16px 16px 0 0!important;bottom:0!important;left:0!important;right:0!important;top:auto!important}
  #emojiPanel{bottom:48px!important;left:4px!important;right:4px!important}

  /* ===== market市场页增强 ===== */
  .type-tabs{display:flex!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch!important;scrollbar-width:none!important;gap:4px!important;padding:6px 0!important;white-space:nowrap!important;flex-wrap:nowrap!important}
  .type-tabs::-webkit-scrollbar{display:none!important}
  .type-tab{flex-shrink:0!important;padding:6px 12px!important;font-size:13px!important;border-radius:16px!important}
  .cat-tabs{display:flex!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch!important;scrollbar-width:none!important;gap:4px!important;padding:6px 0!important;white-space:nowrap!important;flex-wrap:nowrap!important}
  .cat-tabs::-webkit-scrollbar{display:none!important}
  .cat-tab{flex-shrink:0!important;padding:5px 10px!important;font-size:12px!important}
  #grid{grid-template-columns:1fr!important;gap:10px!important;padding:0 8px!important}
  .skill-card{border-radius:12px!important}
  .skill-card .card-cover{height:100px!important}
  .scroll-row .skill-card{min-width:150px!important;max-width:150px!important}
  .scroll-row .skill-card .card-cover{height:64px!important}
  .scroll-row .skill-card .card-body{padding:8px 10px!important}
  .scroll-row .skill-card .card-title{font-size:13px!important}
  .scroll-row .skill-card .card-desc{font-size:11px!important}
  .skill-card .card-body{padding:10px!important}
  .skill-card .card-title{font-size:14px!important}
  .skill-card .card-desc{font-size:12px!important;-webkit-line-clamp:2!important;display:-webkit-box!important;-webkit-box-orient:vertical!important;overflow:hidden!important}
  .sort-bar{flex-wrap:wrap!important;gap:6px!important;padding:8px!important}
  .sort-bar select{font-size:13px!important;padding:4px 8px!important}

  /* ===== space空间页增强 ===== */
  .space-sidebar{width:260px!important}
  .space-main{width:100%!important;padding:12px 8px!important}
  .space-tabs{display:flex!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch!important;scrollbar-width:none!important;gap:2px!important;white-space:nowrap!important;flex-wrap:nowrap!important}
  .space-tabs::-webkit-scrollbar{display:none!important}
  .space-tab{flex-shrink:0!important;padding:8px 14px!important;font-size:13px!important}
  .body-card{padding:12px!important;border-radius:10px!important;margin-bottom:8px!important}
  .modal{width:95%!important;max-width:95%!important;margin:10px auto!important;border-radius:12px!important}
  .modal-body{padding:12px!important}

}
/* ===== 平板(768-1023px) ===== */
@media(min-width:768px) and (max-width:1023px){
  .skill-grid,.skills-grid{
    grid-template-columns:repeat(2,1fr)!important;
    gap:14px!important;
  }
  .sidebar{width:220px!important}
}

/* ===== 触控优化 ===== */
@media(pointer:coarse){
  a,button,.btn,.tab-btn,.nav-item a,.subnav a{
    min-height:44px!important;
    min-width:44px!important;
  }
  input,textarea,select{
    font-size:16px!important;
  }
}