/* =============================================================================
   mobile.css —— 手机/平板竖屏适配（必须最后加载，以覆盖所有皮肤含 home-a1.css）
   断点：
     ≤980px  顶栏「不竖排 + 不溢出」兜底（覆盖平板与手机；隐藏长状态徽章）
     ≤900px  考生信息表单 → 整齐网格布局
     ≤560px  手机竖屏主样式（顶栏紧凑 / 导航 / 英雄区 / 栅格 / 输入）
     ≤430px  小屏手机微调（隐藏用户名等）
   说明：本文件只做布局与尺寸适配，不改任何业务逻辑、DOM 结构与皮肤配色。
   ============================================================================= */

/* ---------------------------------------------------------------------------
   0. 顶栏：防竖排 + 防横向溢出（≤980 覆盖平板，根治"整页右移裁切 / logo 竖排"）
   关键点：
     ① .brand b 永不逐字换行 → logo 不再竖排成「学/途/点/点」
     ② #dataPill 等长徽章在平板及以下隐藏（放不下且是最大的撑宽元凶）
     ③ .topbar 允许换行作为终极兜底；overflow:clip 不破坏 sticky 吸顶
--------------------------------------------------------------------------- */
@media (max-width: 980px){
  html, body{ max-width: 100%; overflow-x: clip; }

  .topbar{ flex-wrap: wrap; row-gap: 8px; }
  .topbar .spacer{ flex: 1 1 0; min-width: 0; }

  /* logo 永不竖排 */
  .brand{ min-width: 0; }
  .brand b{ white-space: nowrap; }
  .brand .sub{ display: none; }

  /* 隐藏最长的状态徽章「实时·数据库·N校/N条投档线」与 AI 标语徽章 */
  #dataPill{ display: none !important; }
  .topbar > .pill{ display: none !important; }
}

/* ---------------------------------------------------------------------------
   1. 顶栏：手机竖屏紧凑
--------------------------------------------------------------------------- */
@media (max-width: 560px){
  .topbar{ gap: 8px; padding: 10px 14px; }

  .brand{ gap: 8px; }
  .brand b{ font-size: 17px; }
  .seal{ width: 30px; height: 30px; font-size: 17px; border-radius: 8px; }

  .iconbtn{ width: 34px; height: 34px; }
  .iconbtn svg{ width: 17px; height: 17px; }

  /* 用户栏：注意「用户管理 / 登出」按钮就嵌在 .xtauth-user 内，不能整块隐藏 */
  .topbar-auth{ min-width: 0; }
  .topbar-auth .xtauth-pill{ gap: 6px; }
  .topbar-auth .xtauth-user{ gap: 6px; padding: 4px 6px 4px 10px; }
  .topbar-auth .xtauth-user b{               /* 仅用户名截断，按钮保持完整 */
    font-size: 12px; max-width: 72px;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  }
  .topbar-auth .xtauth-out{ padding: 4px 9px; font-size: 12px; white-space: nowrap; }
}

@media (max-width: 430px){
  /* 小屏手机：只隐藏用户名本身（保留「用户管理 / 登出」两个操作） */
  .topbar-auth .xtauth-user b{ display: none; }
  .topbar{ padding: 9px 12px; }
  .brand b{ font-size: 16px; }
}

/* ---------------------------------------------------------------------------
   2. 主导航 mainnav —— 横向滑动（已自带 overflow-x:auto，这里隐藏滚动条 + 收紧）
--------------------------------------------------------------------------- */
@media (max-width: 560px){
  .mainnav{ padding: 0 12px; gap: 2px; scrollbar-width: none; }
  .mainnav::-webkit-scrollbar{ display: none; }
  .mainnav button{ padding: 11px 12px 10px; font-size: 13.5px; }
  .nav-group{ gap: 0; }
}

/* ---------------------------------------------------------------------------
   3. 首页英雄区 hero（home-a1.css 最后加载，故在此覆盖字号与排布）
--------------------------------------------------------------------------- */
@media (max-width: 560px){
  .pgA1 .hero{ min-height: auto; padding: 52px 18px 36px; }

  .pgA1 .kicker{ font-size: 11px; letter-spacing: 1.4px; }

  .pgA1 .hero h1{
    font-size: clamp(28px, 8.4vw, 40px);
    line-height: 1.22; margin: 18px 0 14px; letter-spacing: .4px;
  }
  .pgA1 h1 .flip{ min-width: auto; }

  .pgA1 .sub.rv, .pgA1 .sub{ font-size: 14px; line-height: 1.75; }

  .pgA1 .hero-cta{ margin-top: 26px; gap: 10px; flex-direction: column; align-items: stretch; }
  .pgA1 .hero-cta .btn{ width: 100%; justify-content: center; padding: 13px 22px; font-size: 14.5px; }

  .pgA1 .stats{ margin-top: 38px; grid-template-columns: 1fr 1fr; }
  .pgA1 .stat{ padding: 18px 10px; }
  .pgA1 .stat .n{ font-size: 25px; }
  .pgA1 .stat .n small{ font-size: 13px; }
  .pgA1 .stat .l{ font-size: 11.5px; }
}

/* ---------------------------------------------------------------------------
   4. 考生信息条 scorebar —— 从"横向信息条"改造为"整齐表单网格"
   ≤900px 覆盖平板与手机：双列对齐、去竖线、长字段整行、勾选成对、位次整行。
   同时取消其 sticky：这么高的表单吸顶会盖住内容，改为随页面滚动。
--------------------------------------------------------------------------- */
@media (max-width: 900px){
  .scorebar-wrap{ position: static; padding: 12px 14px; }

  .scorebar{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-auto-flow: row dense;          /* 整行元素留下的空位由后续字段回填，避免空洞 */
    gap: 12px;
    align-items: end;                   /* 标签在上、输入框底对齐，更整齐 */
    max-width: none;
  }

  /* 去掉横条专用的竖线分隔 */
  .scorebar > .sb-div{ display: none; }

  /* 跨整行的元素：标题 / 切换学生 / 长文本初中 / 全省位次 / 按科目精填 */
  .scorebar > .sb-lead,
  .scorebar > .sb-stu,
  .scorebar > .sb-field-school,
  .scorebar > .sb-rank,
  .scorebar > .sb-toggle{ grid-column: 1 / -1; }

  .scorebar .sb-lead{ width: auto; justify-content: flex-start; padding-left: 2px; }
  .scorebar .sb-stu{ justify-content: flex-start; margin: 0; }

  /* 字段：标签 + 输入，输入/选择充满整格 */
  .sb-field{ padding: 0; gap: 3px; min-width: 0; }
  .sb-field label{ font-size: 11px; }
  .sb-field input, .sb-field select{
    width: 100%; min-width: 0; box-sizing: border-box;
    padding: 9px 11px; font-size: 16px;      /* ≥16px 防止 iOS 聚焦放大 */
    font-family: var(--sans);
  }
  .sb-field-school{ position: relative; }     /* 锚定匹配下拉 .sb-sug */

  /* 两个勾选项各占一格、整行排满；窄屏单列时各占一行 */
  .sb-id{ justify-content: center; padding: 10px; }

  /* 全省位次盒子整行居中展示 */
  .sb-rank{ margin: 0; width: auto; justify-content: center; padding: 10px 14px; }

  /* 按科目精填整行 */
  .sb-toggle{ width: 100%; justify-content: center; }
}

@media (max-width: 380px){
  /* 极窄屏：表单收为单列，避免两列过挤 */
  .scorebar{ grid-template-columns: 1fr; }
}

/* ---------------------------------------------------------------------------
   5. 通用栅格收拢 + 宽表兜底 + 容器留白 + 防输入放大
--------------------------------------------------------------------------- */
@media (max-width: 560px){
  .wrap{ padding-left: 16px; padding-right: 16px; }

  .grid, .dash-grid, .draft-grid,
  .rank-hero, .subj-grid, .tl-legend,
  .dash-card .grid{ grid-template-columns: 1fr !important; }

  .qhero{ padding: 22px 0 8px; }
  .qhero h1{ font-size: 24px; }
  .qhero p{ font-size: 14px; }

  /* JS 生成的宽数据表：取消最小宽度并缩小字号自适应（pk-table/rk-chart/pk-trend 已各自带横向滚动容器） */
  table.exam-grid{ min-width: 0; font-size: 12px; }

  /* 其余页面常见输入控件统一 ≥16px，杜绝 iOS 聚焦放大跳动 */
  .filterbar input, .filterbar .sel,
  .draft-top .sel,
  .xtauth-card input{ font-size: 16px; }

  /* ── 逐校数轴卡片（冲稳保展开行）手机优化 ──
     原 .v4x-row 为「校名198px | 数轴1fr | 档签96px」三栏，手机上数轴被挤到≈70px、分差药丸重叠。
     改为「校名 + 档签」一行、「数轴」整行铺满，数轴恢复可读。 */
  .rp .v4x-row, .v4x-row{
    grid-template-columns: 1fr auto;
    grid-template-areas: "label tag" "axis axis";
    column-gap: 8px; row-gap: 6px; padding: 13px 2px 11px;
  }
  .v4x-label{ grid-area: label; }
  .v4x-v{ grid-area: tag; }
  .v4x-axis{ grid-area: axis; width: 100%; min-width: 0; height: 46px; }
  .v4x-sch{ font-size: 13px; }
  .v4x-gap, .v4x-gapv{ font-size: 11px; }

  /* 志愿草表官方表格：手机上收窄「批次/志愿类别」两列，给「学校名称」更多空间 */
  .draft-form{ font-size: 12px; }
  .draft-form th, .draft-form td{ padding: 6px 6px; }
  .draft-form .dfp-side{ width: 42px; }
  .dfp-batch{ width: 42px; }
  .dfp-batch .dfp-bn{ letter-spacing: 2px; }
  .dfp-cat{ width: 90px; font-size: 11.5px; line-height: 1.45; }
  .dfp-cat .dfp-par{ margin-left: 4px; padding: 1px 4px; }
  .dfp-sch{ padding: 4px 4px; }
  .dfp-sch .slot{ padding: 4px 6px; gap: 5px; min-height: 34px; }
  .dfp-sch .slot.empty{ font-size: 12px; }
  .dfp-sch .slot .slot-nm{ font-size: 12.5px; }
  .dfp-sch .slot .slot-meta{ font-size: 10px; }
  .draft-form-title{ font-size: 15px; padding: 11px 10px; }
}

/* ---------------------------------------------------------------------------
   6. 报告页手机端：防止报告卡片、统计卡和冲稳保学校行横向撑宽
   现象：手机截图/浏览时只看到左半边，右侧预测线、分差或统计卡被裁掉。
   原因：report.js 会动态注入一组较宽的冲稳保行列宽，且部分卡片缺少 min-width:0。
--------------------------------------------------------------------------- */
@media (max-width: 560px){
  .page[data-page="report"] .wrap{
    max-width: 100%;
    padding-left: 12px;
    padding-right: 12px;
    overflow-x: hidden;
  }

  .page[data-page="report"] .hero,
  .page[data-page="report"] .hero p,
  .page[data-page="report"] .hero h1{
    max-width: 100%;
    min-width: 0;
    overflow-wrap: anywhere;
  }

  .page[data-page="report"] .hero p{
    display: block !important;
    width: 100% !important;
    white-space: normal !important;
    word-break: break-all;
  }

  .page[data-page="report"] .stage,
  .page[data-page="report"] .grid,
  .page[data-page="report"] .form-aside,
  .page[data-page="report"] .form-aside .card,
  .page[data-page="report"] .report,
  .page[data-page="report"] #reportEl,
  .page[data-page="report"] .rp,
  .page[data-page="report"] .rep-body,
  .page[data-page="report"] .sec,
  .page[data-page="report"] .stats,
  .page[data-page="report"] .rp-v5,
  .page[data-page="report"] .rp-v5 .b-list,
  .page[data-page="report"] .rp-v5 .b-row{
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .page[data-page="report"] .grid,
  .page[data-page="report"] .form-aside,
  .page[data-page="report"] .form-aside .card,
  .page[data-page="report"] .stage,
  .page[data-page="report"] .report{
    width: 100% !important;
  }

  .page[data-page="report"] .report{
    overflow: hidden;
    border-radius: 14px;
  }

  .page[data-page="report"] .rep-head{
    padding: 22px 16px 18px !important;
  }

  .page[data-page="report"] .rep-head .kk{
    font-size: 10px;
    letter-spacing: 2px;
  }

  .page[data-page="report"] .rep-head h1{
    font-size: clamp(22px, 6.4vw, 27px);
    line-height: 1.32;
    letter-spacing: 0;
  }

  .page[data-page="report"] .rep-head .seal2{
    display: none !important;
  }

  .page[data-page="report"] .rep-tags{
    gap: 6px;
  }

  .page[data-page="report"] .rtag{
    padding: 5px 8px;
    font-size: 12px;
  }

  .page[data-page="report"] .rep-body{
    padding: 6px 16px 22px !important;
  }

  .page[data-page="report"] .stats{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px;
  }

  .page[data-page="report"] .stat{
    min-width: 0 !important;
    padding: 12px 8px;
  }

  .page[data-page="report"] .stat .v{
    font-size: clamp(20px, 7vw, 25px);
    white-space: nowrap;
  }

  .page[data-page="report"] .stat .l{
    font-size: 11px;
  }

  .page[data-page="report"] .rp-cards{
    grid-template-columns: 1fr !important;
  }

  .page[data-page="report"] .rp-v5 .b-tabs{
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 3px;
    scrollbar-width: none;
  }

  .page[data-page="report"] .rp-v5 .b-tabs::-webkit-scrollbar{
    display: none;
  }

  .page[data-page="report"] .rp-v5 .b-tab{
    flex: 0 0 auto;
  }

  .page[data-page="report"] .rp-v5 .b-row{
    margin-left: 0 !important;
    margin-right: 0 !important;
    border-radius: 10px;
  }

  .page[data-page="report"] .rp-v5 .b-row-l1{
    grid-template-columns: 10px minmax(0, 1fr) auto !important;
    grid-template-rows: auto auto;
    gap: 6px 8px !important;
    padding: 12px 2px !important;
  }

  .page[data-page="report"] .rp-v5 .b-rank-dot{
    grid-column: 1;
    grid-row: 1;
    align-self: center;
  }

  .page[data-page="report"] .rp-v5 .b-nm{
    grid-column: 2;
    grid-row: 1;
    min-width: 0 !important;
  }

  .page[data-page="report"] .rp-v5 .b-nm > b{
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    line-height: 1.35;
  }

  .page[data-page="report"] .rp-v5 .b-line{
    grid-column: 2;
    grid-row: 2;
    align-items: flex-start !important;
    justify-self: start;
  }

  .page[data-page="report"] .rp-v5 .b-line b{
    font-size: 16px;
  }

  .page[data-page="report"] .rp-v5 .gap-badge{
    grid-column: 3;
    grid-row: 2;
    justify-self: end;
    padding: 1px 7px;
    font-size: 11px;
  }

  .page[data-page="report"] .rp-v5 .spark,
  .page[data-page="report"] .rp-v5 .spark-na{
    display: none !important;
  }

  .page[data-page="report"] .rp-v5 .b-chev{
    grid-column: 3;
    grid-row: 1;
    align-self: center;
    justify-self: end;
  }

  .page[data-page="report"] .rp-v5 .b-drawer{
    min-width: 0;
    padding: 4px 2px 12px 20px;
    overflow-x: hidden;
  }

  .page[data-page="report"] .prose table,
  .page[data-page="report"] #aiReportBody .md-table{
    display: block;
    max-width: 100%;
    overflow-x: auto;
  }

  .page[data-page="report"] img,
  .page[data-page="report"] svg,
  .page[data-page="report"] canvas{
    max-width: 100%;
    height: auto;
  }
}

/* =============================================================================
   §9 2026-07 三批 · 手机端补丁(实测截图驱动:iPhone 390×844)
   B. 结果宽表横滑   C. 看板卫星图横滑(提示在 city_zoom 注入)
   E. 主导航打磨(隐藏分组标签)   其余页面实测正常,不动。
   [2026-07-11] 原 A 段(AI 咨询上下堆叠+历史横向票签)整段删除:豆包式改版后
   chat.js 自带 ≤760px 抽屉布局,本段 aiConvCol/aiChatWrap 等 ID 规则权重
   反压新抽屉——历史对话被打横、抽屉被 width:100% 撑满,即手机端排版错乱根因。
   此文件不得再用 ID 选择器覆盖 AI 咨询(冒烟测试⑫有守卫)。
============================================================================= */

/* ---------- B. 结果型宽表:容器横滑 + 最小宽,杜绝右缘贴边硬挤 ---------- */
@media (max-width: 560px){
  /* 分数线查询总表 */
  #lineTable{ display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; white-space: nowrap; }
  #lineTable th, #lineTable td{ white-space: nowrap; }
  /* 指标到校结果区(初中名额表/目标高中命中横幅内表) */
  #tgResult{ overflow-x: auto; -webkit-overflow-scrolling: touch; }
  #tgResult table, #tgResult .dtable{ min-width: 560px; }
  /* 学校对比大表:横滑 + 首列(对比项)收窄,给学校列让位 */
  #pkResult{ overflow-x: auto; -webkit-overflow-scrolling: touch; }
  #pkResult table{ min-width: 620px; }
  #pkResult table th:first-child, #pkResult table td:first-child{ width: 96px; min-width: 96px; white-space: normal; }

  /* ---------- E. 主导航:隐藏"规划/查询/工具"分组小标,页签更省宽 ---------- */
  .mainnav .ng-label{ display: none; }
}