



  :root{



    --bg:#0f1524; --panel:#171f33; --panel2:#1d2740; --line:#283350;



    --ink:#e8eefc; --sub:#8fa0c0; --blue:#4d8dff; --red:#ff5d6c; --green:#2fd39b;



    --orange:#ffb454; --purple:#a78bfa; --cyan:#38d2e8;



  }



  *{box-sizing:border-box; margin:0; padding:0;}



  body{font-family:"Microsoft YaHei","PingFang SC",sans-serif; background:var(--bg); color:var(--ink); padding:24px 20px 40px;}



  .wrap{max-width:1200px; margin:0 auto;}



  header{display:block; margin-bottom:44px; position:relative;}
  .welcome{display:block; text-align:center; font-size:12px; color:var(--sub); font-weight:400; margin-top:14px;}
  header>div:first-child{text-align:center; margin-bottom:14px;}
  .hdr2{display:flex; align-items:center; justify-content:center; gap:64px; flex-wrap:wrap;}
  .hdr2 .sub{white-space:nowrap; max-width:100%;}
  .hdr3{display:flex; align-items:center; justify-content:center; gap:8px; flex-wrap:wrap; margin-top:10px;}



  header>div:first-child{flex:1; text-align:center;}



  header>div:last-child{flex-shrink:0;}



  header h1{font-size:clamp(19px, 4.2vw, 30px); letter-spacing:1px; margin-bottom:12px; white-space:nowrap;}



  header h1 span{color:var(--blue);}



  header .sub{color:var(--sub); font-size:12.5px; margin-top:6px;}



  .badge{display:inline-block; background:transparent; border:1px solid rgba(143,160,192,.35); color:var(--sub); border-radius:20px; padding:3px 14px; font-size:12px;}



  /* KPI */



  .kpis{display:grid; grid-template-columns:repeat(6,1fr); gap:10px; margin-bottom:20px;}



  .kpi{background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:8px 10px; min-width:0; overflow:hidden;}
  .kpi .lab{font-size:36px;color:var(--blue);margin-bottom:2px;font-weight:700;line-height:1.05;text-align:center;}
  .mrow{display:flex;justify-content:space-between;align-items:baseline;padding:0px 4px;font-size:13px;line-height:1.2;}
  .mrow .ml{color:var(--sub);}
  .mrow .mv{color:var(--ink);white-space:nowrap;font-weight:600;}
  .mrow .mv b{color:var(--orange);font-size:14px;}
.mrow .mv .u{color:var(--sub);font-size:10.5px;font-weight:400;margin-left:1px;}
  .clickable{background:var(--panel2);border:1px solid var(--line);border-radius:7px;padding:1px 4px;margin:1px 0 0;cursor:pointer;transition:background .15s, border-color .15s;}
  .kpi.blue.mid{display:flex;flex-direction:column;}
  .kpi.blue.mid .wave-mini{flex:1 1 auto; display:flex; flex-direction:column; justify-content:space-around;}

  /* 到货入库卡: 卡片等高, 波段4行均分填满 */

  .kpi.green{display:flex; flex-direction:column;}

  .kpi.green .wave-mini{flex:1 1 auto; display:flex; flex-direction:column; justify-content:space-between; padding-bottom:10px;}

  .kpi.green .wm-row{margin-bottom:0;}
  .kpi-custom{display:flex;flex-direction:column;}
  .kpi-custom .mrow{flex:1 1 auto; align-items:center;}
  .clickable:hover{background:#243150;border-color:var(--blue);}



  .kpi .lab{color:var(--sub); font-size:12.5px;}



  .kpi .num{font-size:30px; font-weight:700; margin-top:4px; line-height:1.2;}



  .kpi .sub{font-size:11.5px; color:var(--sub); margin-top:4px;}



  .kpi.blue .num{color:var(--blue);} .kpi.red .num{color:var(--red);font-weight:600;} .kpi.green .num{color:var(--green);}



  .kpi.orange .num{color:var(--orange);} .kpi.purple .num{color:var(--purple);}



  .kpi.wide{grid-column:span 2;}



  .kpi.wide .num{font-size:22px; white-space:nowrap;}

  .kpi.mid .num{font-size:24px;}
  .kpi.dense .num{font-size:18px; line-height:1.4;}



  .wave-mini{margin-top:10px; border-top:1px solid rgba(255,255,255,.09); padding-top:9px;}



  .wm-row{display:flex; align-items:center; gap:0; font-size:11.5px; margin-bottom:6px;}
  .wm-row .wm-orange{color:#f59e0b;}



  .wm-row span{color:var(--sub); flex-shrink:0;}



  .wm-track{flex:1; background:var(--panel2); border-radius:4px; height:10px; overflow:hidden;}



  .wm-fill{height:100%; background:var(--blue); border-radius:4px; min-width:2px;}



  .wm-row b{min-width:104px; text-align:right; font-size:11px; white-space:nowrap; flex-shrink:0;}



  /* 延迟分档（集成在责任部门分布卡内） */



  .late-buckets{margin-top:40px; border-top:1px solid rgba(255,255,255,.09); padding-top:12px;}



  .lb-title{font-size:14.5px; color:var(--ink); margin-bottom:10px; font-weight:600;}



  .lb-row{display:flex; align-items:center; gap:8px; font-size:13px; margin-bottom:7px;}



  .lb-row span{width:80px; color:var(--ink); flex-shrink:0; white-space:nowrap;}



  .lb-track{flex:1; background:var(--panel2); border-radius:4px; height:7px; overflow:hidden;}



  .lb-fill{height:100%; background:var(--red); border-radius:4px; min-width:2px;}



  .lb-row b{min-width:88px; text-align:right; font-size:13px; white-space:nowrap; font-weight:600;}



  /* 生产类型到货曲线 */



  .arrive-curve{margin-top:16px; border-top:1px solid rgba(255,255,255,.09); padding-top:12px;}



  .arrive-curve .ac-title{font-size:14.5px; color:var(--ink); margin-bottom:4px; font-weight:600;}



  .arrive-curve .ac-hint{font-size:11.5px; color:var(--sub); margin-bottom:10px;}



  .arrive-curve svg{display:block;}



  /* 采购到货分布 */



  .buyer-tbl{width:100%; border-collapse:collapse; font-size:13.5px; table-layout:auto;}



  .buyer-tbl th{background:var(--panel2); color:var(--sub); text-align:left; padding:6px 8px; border-bottom:1px solid var(--line); font-weight:600; white-space:nowrap;}



  .buyer-tbl td{padding:6px 8px; border-bottom:1px solid #1c2742; white-space:nowrap;}



  .buyer-tbl tr:last-child td{border-bottom:none;}



  .buyer-tbl td.ok{color:var(--green); font-weight:600;}



  .buyer-tbl td.warn{color:var(--red);font-weight:600; font-weight:600;}



  /* 三张表第一列统一宽度，视觉对齐 */



  .buyer-tbl th:first-child,.buyer-tbl td:first-child{min-width:90px;}



  /* 两栏布局：左表格 + 右明细 */



  .duo{display:flex; gap:18px; align-items:flex-start;}



  .duo-l{flex:1; min-width:0; overflow-x:auto;}



  .duo-r{width:auto; min-width:112px; flex-shrink:0; border-left:1px solid rgba(255,255,255,.09); padding-left:10px;}



  .dr-title{font-size:13.5px; color:var(--ink); font-weight:600; margin-bottom:8px;}



  #buyerPanel{display:flex; flex-direction:column; position:relative;}#buyerPanel .duo{flex:1 1 auto; min-height:0; align-items:stretch;}#buyerPanel .duo-l{overflow-y:auto;}
  #buyerPanel .duo-l .buyer-tbl th,#buyerPanel .duo-l .buyer-tbl td{padding:10px 8px;}#buyerPanel .duo-r{display:flex; flex-direction:column; min-height:0;}#buyerDueList{flex:1 1 auto; min-height:0; max-height:none; overflow-y:auto; overflow-x:hidden;}
  .btn-detail{position:absolute; top:14px; right:16px; background:var(--panel2); border:1px solid var(--line); color:var(--ink); padding:7px 14px; border-radius:8px; font-size:12.5px; font-weight:600; cursor:pointer; z-index:5;}
  .btn-detail:hover{filter:brightness(1.15);}
  .dr-list{max-height:300px; overflow-y:auto; overflow-x:hidden;}



  .dr-group{font-size:13.5px; color:var(--sub); font-weight:600; margin:8px 0 2px;}



  .dr-row{display:flex; justify-content:space-between; gap:10px; font-size:13.5px; padding:4px 0; border-bottom:1px dashed rgba(255,255,255,.07);}



  .dr-row b{font-weight:600; color:var(--ink); white-space:nowrap;}



  .dr-row span{color:var(--sub); white-space:nowrap;}



  /* 理单主表格：撑满整行 */



  .lidan-tbl{width:100%; font-size:13.5px;}
  /* 手机端：理单/跟单表格横向滚动 */
  #lidanTable,#gendanTable{overflow-x:auto; -webkit-overflow-scrolling:touch;}
  #lidanPanel,#gendanPanel{display:flex; flex-direction:column;}
  #lidanTable,#gendanTable{flex:1; min-height:0; overflow:auto;}
  #lidanPanel .lidan-tbl th,#lidanPanel .lidan-tbl td,
  #gendanPanel .lidan-tbl th,#gendanPanel .lidan-tbl td{padding:7px 8px;}
  #lidanTable .lidan-tbl{min-width:720px;}
  #gendanTable .lidan-tbl{min-width:0;}



  .lidan-tbl th,.lidan-tbl td{padding:6px 8px;}



  /* 可生产款信息表格（独立卡片，撑满整行） */



  .info-tbl{width:100%; table-layout:auto; font-size:13.5px;}



  .info-tbl th,.info-tbl td{padding:6px 10px; white-space:nowrap; text-align:center;}



  /* 第一列左对齐，与上面两张卡片对齐 */



  .info-tbl th:first-child,.info-tbl td:first-child{text-align:left;}



  .info-tbl th{cursor:pointer; user-select:none;}



  .info-tbl th:hover{color:var(--ink);}



  /* 款多时滚动（正好显示 8 行，超过 8 行出现滚动条） */



  #prodInfo{max-height:252px; overflow-y:auto;}



  /* 可生产款信息筛选行 */



  .prod-filters{display:flex; gap:8px; margin-bottom:10px; flex-wrap:wrap;}



  .prod-filters select,.prod-filters input{background:var(--panel2); border:1px solid var(--line); border-radius:7px; color:var(--ink); padding:5px 8px; font-size:13.5px; outline:none;}



  .prod-filters input{width:120px;}



  /* 上传数据按钮 + 弹窗 */



  .explain-tbl{width:100%;border-collapse:collapse;font-size:12.5px;table-layout:fixed;}
  .explain-tbl th{background:var(--panel);color:var(--blue);font-size:12.5px;padding:8px 10px;text-align:left;border:1px solid var(--line);position:sticky;top:0;z-index:5;}
  .explain-tbl td{padding:8px 10px;border:1px solid var(--line);color:var(--ink);line-height:1.6;vertical-align:top;word-break:break-word;}
  .explain-tbl tr:nth-child(even) td{background:rgba(255,255,255,.02);}
  .upbtn{background:var(--panel2); border:1px solid var(--line); color:var(--ink); border-radius:8px; padding:7px 14px; font-size:12.5px; cursor:pointer; font-weight:600;}



  .upbtn:hover{filter:brightness(1.15);}



  .modal{position:fixed; inset:0; background:rgba(0,0,0,.55); display:flex; align-items:center; justify-content:center; z-index:99;}



  .modal-box{background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:22px 26px; width:500px; max-width:92vw;}



  .modal-box h3{margin:0 0 8px;}



  .mhint{color:var(--sub); font-size:12.5px; margin-bottom:14px; line-height:1.7;}



  .mrow{margin:10px 0; display:flex; gap:8px; align-items:center; flex-wrap:wrap;}



  .mrow input[type=text],.mrow input[type=password]{background:var(--panel2); border:1px solid var(--line); border-radius:7px; color:var(--ink); padding:6px 10px; font-size:12.5px; flex:1; min-width:140px; outline:none;}



  .mrow button{background:var(--blue); color:#fff; border:none; border-radius:7px; padding:6px 12px; cursor:pointer; font-size:12.5px;}



  .mrow button.gray{background:#3a4a6e;}



  .mstatus{margin:10px 0; font-size:13px; min-height:20px; line-height:1.5;}



  .file-btn{display:inline-block; background:#3a4a6e; color:var(--ink); border-radius:8px; padding:8px 16px; font-size:13px; cursor:pointer;}



  .file-btn:hover{filter:brightness(1.15);}



  #upFile{display:none;}



  /* 图表网格 */



  .grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(340px,1fr)); gap:14px; margin-bottom:20px;}
  .grid2{display:grid; grid-template-columns:repeat(2,1fr); gap:14px; margin-bottom:20px;}
  /* 品控质检信息：三等分 */
  .qc-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:10px;}
  .qc-cell{background:var(--panel2); border:1px solid var(--line); border-radius:10px; padding:12px 10px; display:flex; flex-direction:column; height:100%;}
  .qc-title{font-size:13px; font-weight:600; color:var(--ink); text-align:center; padding-bottom:8px; border-bottom:1px solid rgba(255,255,255,.08); margin-bottom:8px;}
  .qc-content{flex:1; display:flex; align-items:center; justify-content:center; color:var(--sub); font-size:12px; min-height:250px; text-align:center;}
  .qc-lines{flex:1; display:flex; flex-direction:column; align-items:stretch; justify-content:space-evenly; gap:15px; min-height:250px;}
  .qc-line{display:flex; align-items:center; justify-content:space-between; gap:6px; font-size:12.5px;}
  .qc-line>span{color:var(--sub); white-space:nowrap;}
  .qc-line b{font-weight:400; white-space:nowrap;}
  .qc-line .qc-num{color:var(--orange); font-weight:700;}
  .qc-line .qc-unit{color:var(--sub); font-weight:400;}
  .qc-line-click{cursor:pointer; margin:0 -4px; padding:0 4px; border-radius:6px; transition:background .15s;}
  .qc-line-click:hover{background:rgba(77,141,255,.12);}
  .qc-line-click:hover b{color:var(--orange);}
  /* 任务明细：窄屏横向滚动 + 内容完整不截断 */
  .task-scroll{display:block; overflow-x:auto; overflow-y:visible; width:100%; max-width:100%; -webkit-overflow-scrolling:touch;}
  .task-scroll > div{display:block; min-width:1000px;}
  .task-scroll span{white-space:normal !important; word-break:break-all !important; overflow:visible !important; text-overflow:clip !important;}



  .panel{background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:18px 20px;}
  .wrap > .panel{margin-bottom:20px;}



  .panel h2{font-size:14.5px; margin-bottom:4px;}
  #bmPanel h2,#ptypePanel h2,#zlxxPanel h2,#pfxxPanel h2{text-align:center; color:var(--blue); font-size:20px;}
  .lb-title{text-align:center; color:var(--blue); font-size:20px;}
  .arrive-curve .ac-title{text-align:center; color:var(--blue); font-size:20px;}
  #ptypeChart{margin-top:12px;}



  /* 三个核心卡片标题：蓝色突出、加大、居中 */



  .panel h2.center{text-align:center; font-size:20px; color:var(--blue);}



  .panel .hint{color:var(--sub); font-size:11.5px; margin-bottom:14px;}



  .bar-row{display:flex; align-items:center; gap:2px; margin-bottom:8px; font-size:12.5px;}



  .bar-row .bl{width:50px; color:var(--sub); text-align:left; flex-shrink:0;}



  .bar-track{flex:1; min-width:50px; background:var(--panel2); border-radius:6px; height:20px; overflow:hidden;}



  .bar-fill{height:100%; border-radius:6px; min-width:2px; transition:width .4s;}
  .bar-fill{position:relative; overflow:hidden;}
  .bar-arrive{position:absolute; top:0; left:0; bottom:0; background:var(--orange); z-index:1;}
      .bar-row .chip{margin-left:0; width:76px; padding:1px 4px; font-size:10.5px;}
      .bar-rk{position:absolute; top:0; left:0; bottom:0; background:var(--green); z-index:2;}
      .bar-row .rk-chip{display:inline-block; width:72px; text-align:center; color:var(--green); font-size:10.5px; white-space:nowrap;}
      .ac-lg{margin-left:10px; font-size:11px; color:var(--sub); font-weight:400;}
      .ac-lg i{display:inline-block; width:10px; height:4px; border-radius:2px; margin-right:4px; vertical-align:middle;}
  .bar-row .arr-chip{display:inline-block; width:72px; text-align:center; color:var(--orange); font-size:10.5px; white-space:nowrap; flex-shrink:0;}
      /* 看全貌弹窗（现代深色数据表） */
      #fullViewMx .fv-wrap{background:#1d2433; border:1px solid #36415c; border-radius:10px; overflow:auto; box-shadow:0 8px 24px rgba(0,0,0,.35); flex:1; min-height:0; box-sizing:border-box;}
      #fullViewMx table{border-collapse:separate; border-spacing:0; font-size:12.5px; background:transparent; table-layout:fixed;}
      #fullViewMx th{background:#26304a; color:#e8ecf4; font-weight:700; padding:9px 4px; border-bottom:2px solid #3b82f6; border-right:1px solid rgba(90,106,148,.28); text-align:center; position:sticky; top:0; z-index:2;}
      #fullViewMx th:last-child{border-right:none;}
      #fullViewMx td{padding:7px 5px; border-bottom:1px solid #2c3446; border-right:1px solid rgba(90,106,148,.2); text-align:center; color:#c8d0e0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
      #fullViewMx td:last-child{border-right:none;}
      #fullViewMx tr:nth-child(even) td{background:rgba(255,255,255,.02);}
      #fullViewMx tr:hover td{background:rgba(59,130,246,.07);}
      #fullViewMx .num{text-align:right; font-variant-numeric:tabular-nums;}
      #fullViewMx .dc{color:#f59e0b; font-weight:600;}
      #fullViewMx .rk{color:#2fd39b; font-weight:600;}
      #fullViewMx .wj{color:#ff5d6c; font-weight:600;}
      #fullViewMx .red{color:#ff5d6c;}
      #fullViewMx .orange{color:#f59e0b;}
      #fullViewMx .grn{color:#2fd39b;}
      #fullViewMx .fv-kpi td{border-bottom:1px solid #2c3446; font-size:14px; padding:10px 4px; text-align:center !important;}
      #fullViewMx .fv-kpi td.num{text-align:center !important;}
      #fullViewMx .fv-kpi .kpi-left{text-align:left; font-size:14px; font-weight:600; color:#e8ecf4;}
      #fullViewMx .klabel{font-size:10px; color:#8a94ab; font-weight:400; margin-top:3px;}
      #fullViewMx input,#fullViewMx select{background:var(--panel2); border:1px solid var(--line); color:#c8d0e0; border-radius:6px;}
      #fullViewMx .fv-btn{background:#2a3348; border:1px solid #5a6a94; color:#e8ecf4; border-radius:8px; padding:6px 14px; font-size:12.5px; cursor:pointer;}
      #fullViewMx .fv-btn:hover{background:#36415c;}
      #fullViewMx .fv-btn-blue{background:#2f6fd8; color:#fff; border:none; border-radius:8px; padding:6px 14px; font-size:12.5px; cursor:pointer;}
      #fullViewMx .kgap{margin-left:8px;}
      #fullViewMx .fv-dd{position:relative; display:inline-block;}
      #fullViewMx .fv-dd-panel{display:none; position:absolute; right:0; top:100%; margin-top:4px; background:#232a3a; border:1px solid #5a6a94; border-radius:8px; padding:8px 10px; z-index:100; max-height:340px; overflow:auto; width:190px; box-shadow:0 8px 24px rgba(0,0,0,.4);}
      #fullViewMx .fv-dd-panel label{display:flex; align-items:center; gap:6px; padding:4px 2px; font-size:12.5px; color:#c8d0e0; cursor:pointer; white-space:nowrap;}
      #fullViewMx .fv-dd-panel label:hover{color:#fff;}
      #fullViewMx .ctr{text-align:center !important;}
  .sum-row td{color:var(--orange); font-weight:700;}
  .sum-row td b{color:var(--orange);}



  .bar-row .bv{width:62px; color:var(--ink); font-weight:600; white-space:nowrap; flex-shrink:0; font-size:12px;}



  /* 环形图 */



  .donut-wrap{display:flex; align-items:center; gap:22px; flex-wrap:wrap;}



  .donut{position:relative; width:150px; height:150px; flex-shrink:0;}



  .donut svg{transform:rotate(-90deg);}



  .donut .center{position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center;}



  .donut .center b{font-size:26px;}



  .donut .center span{color:var(--sub); font-size:11.5px;}



  .legend{flex:1; min-width:150px;}



  .legend .li{display:flex; align-items:center; gap:8px; font-size:13px; margin-bottom:9px;}



  .legend .dot{width:10px; height:10px; border-radius:3px; flex-shrink:0;}



  .legend .n{margin-left:auto; font-weight:600;}



  /* 表格 */



  .panel.tbl{padding:0; overflow:hidden;}



  .tbl-head{padding:16px 20px 10px; display:flex; flex-wrap:wrap; gap:10px; align-items:center;}



  .tbl-head h2{font-size:14.5px; margin-right:auto;}



  select,input{background:var(--panel2); border:1px solid var(--line); color:var(--ink); border-radius:8px; padding:6px 10px; font-size:12.5px; outline:none;}



  select:focus,input:focus{border-color:var(--blue);}



  input::placeholder{color:#5b6b8a;}



  .tbl-scroll{overflow-x:auto; max-height:520px; overflow-y:auto;}
  /* 四卡片等高 + 内部弹性滚动 */
  #prodPanel{display:flex; flex-direction:column; position:relative;}
  .prod-tabs{display:flex; gap:8px; margin-bottom:8px;}
  .prod-tab{background:var(--panel2); border:1px solid var(--line); border-radius:7px; padding:4px 14px; font-size:13px; color:var(--sub); cursor:pointer; font-weight:600;}
  .prod-tab.active{background:var(--blue); color:#fff; border-color:var(--blue);}
  .prod-sum{margin-bottom:8px; font-size:14px; color:var(--orange); font-weight:700;}
  #prodPanel #prodInfo{flex:1 1 auto; min-height:0; max-height:none; overflow-y:auto;}
  #detailPanel{display:flex; flex-direction:column;}
  #detailPanel .tbl-scroll{flex:1 1 auto; min-height:0; max-height:none; overflow-y:auto; overflow-x:auto;}
  #detailPanel .tbl-head h2.center{flex-basis:100%; text-align:center; font-size:20px; color:var(--blue); margin:0 0 4px;}
  /* 滚动条: 轨道与背景同色, 滑块保持灰色 */
  ::-webkit-scrollbar{width:9px; height:9px;}
  ::-webkit-scrollbar-track{background:var(--bg);}
  ::-webkit-scrollbar-thumb{background:#8a94a8; border-radius:5px; border:2px solid var(--bg);}
  ::-webkit-scrollbar-thumb:hover{background:#9aa4b8;}
  ::-webkit-scrollbar-corner{background:var(--bg);}



  table{width:100%; border-collapse:collapse; font-size:12.5px; min-width:760px;}



  th{position:sticky; top:0; background:var(--panel2); color:var(--sub); text-align:left; padding:9px 12px; border-bottom:1px solid var(--line); cursor:pointer; user-select:none; white-space:nowrap; font-weight:600;}



  th:hover{color:var(--ink);}



  th .arr{font-size:10px; color:var(--blue);}



  td{padding:8px 12px; border-bottom:1px solid #1c2742; white-space:nowrap;}



  tr:hover td{background:#1b2540;}



  .tag{display:inline-block; padding:2px 10px; border-radius:12px; font-size:11.5px;}



  .tag.tech{background:rgba(77,141,255,.15); color:#7fb0ff;}



  .tag.buy{background:rgba(255,180,84,.15); color:#ffc877;}



  .tag.ok{background:rgba(47,211,155,.15); color:#5fe0b2;}



  .tag.other{background:rgba(167,139,250,.15); color:#c3b3ff;}



  .late{color:#ff5d6c; font-weight:600;}



  .okc{color:#2fd39b; font-weight:600;}



  .empty{padding:40px; text-align:center; color:var(--sub); font-size:13px;}



  .cnt{margin-left:auto; color:var(--sub); font-size:12px; padding:16px 20px;}



  footer{color:var(--sub); font-size:11.5px; text-align:center; margin-top:8px; line-height:1.9;}



  .chip{display:inline-block; background:var(--panel2); border:1px solid var(--line); border-radius:6px; padding:1px 8px; font-size:11px; color:var(--sub); margin-left:6px; min-width:100px; text-align:center; box-sizing:border-box;}



  @media (max-width:640px){



    body{padding:14px 10px 30px; overflow-x:hidden;}



    .wrap{max-width:100%; overflow-x:hidden;}



    .grid{grid-template-columns:1fr;}
    .grid2{grid-template-columns:1fr;}
    .qc-grid{gap:8px; grid-template-columns:1fr;}
    .qc-cell{padding:10px 12px;}
    .qc-title{font-size:13px;}
    .qc-content{font-size:11px; min-height:100px;}
    .qc-lines{min-height:170px;}
    .donut-wrap{flex-direction:column; align-items:flex-start; gap:12px;}
    .donut-wrap .legend{flex-wrap:wrap;}



    .kpis{grid-template-columns:1fr;}
    .kpi .mrow{flex-wrap:wrap; row-gap:2px;}
    .hdr2{flex-wrap:wrap; gap:16px;}
    .hdr3{flex-wrap:wrap;}
    #taskMx{padding:8px;}
    #taskMx > div{width:98vw;}
    .task-item{padding:10px 10px;}



    .kpi .num{font-size:24px;}



    /* 手机端: 未按时到齐明细窄列(只够款号), 采购表获得更多空间 */
    #buyerPanel .duo{gap:8px;}
    #buyerPanel .duo-r{min-width:0; max-width:112px; padding-left:8px; max-height:none;}
    #buyerPanel .dr-list{overflow-x:auto; overflow-y:auto;}
    #buyerPanel .dr-title{font-size:12px;}
    #buyerPanel .dr-group{font-size:12px; line-height:1.5;}
    #buyerPanel .dr-row b{font-size:12.5px;}



    /* 手机端: 生产类型构成紧凑布局 (防溢出) */
    .bar-row{gap:6px; flex-wrap:wrap;}
    .bar-row .bl{width:56px; font-size:12px;}
    .bar-track{flex:1; max-width:130px; min-width:28px;}
    .bar-row .bv{min-width:0; font-size:11.5px; white-space:nowrap; flex-shrink:0;}
    .bar-row .chip{min-width:0; font-size:10.5px; padding:1px 3px; margin-left:0; white-space:nowrap; flex-shrink:0;}
    .bar-row .arr-chip{min-width:0; font-size:10.5px; white-space:nowrap; flex-shrink:0;}
     .bar-row .rk-chip{min-width:0; font-size:10.5px; white-space:nowrap; flex-shrink:0;}
      
    #ptypeChart{margin-top:10px;}
  }





  #loginOverlay{position:fixed; inset:0; z-index:9999; background:radial-gradient(ellipse at 50% -10%, rgba(47,107,255,.16), transparent 55%), radial-gradient(ellipse at 85% 110%, rgba(45,212,191,.08), transparent 50%), var(--bg); display:flex; align-items:center; justify-content:center;}
  .gcard{position:relative; overflow:hidden; background:linear-gradient(180deg, rgba(47,107,255,.07), rgba(38,45,62,.4) 30%), var(--panel); border:1px solid rgba(74,158,255,.28); border-radius:18px; padding:38px 40px 32px; width:min(380px,86vw); text-align:center; box-shadow:0 12px 40px rgba(0,0,0,.45), 0 0 60px rgba(47,107,255,.10), inset 0 1px 0 rgba(255,255,255,.04);}
  .glow-bar{position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg, transparent, #2f6bff 30%, #2dd4bf 70%, transparent); opacity:.9;}
  .gco-en{font-size:9.5px; letter-spacing:2.5px; color:var(--sub); opacity:.75; margin-bottom:10px;}
  .glogo{font-size:22px; font-weight:700; color:var(--ink); letter-spacing:2px; margin-bottom:12px;}
  .gdiv{display:flex; align-items:center; justify-content:center; gap:8px; margin:0 0 12px;}
  .gdiv span{height:1px; width:56px; background:linear-gradient(90deg, transparent, rgba(143,160,192,.5));}
  .gdiv span:last-child{background:linear-gradient(270deg, transparent, rgba(143,160,192,.5));}
  .gdiv i{width:5px; height:5px; border-radius:50%; background:#4a9eff; box-shadow:0 0 8px rgba(74,158,255,.8);}
  .gsub{font-size:14px; color:#aebcd6; letter-spacing:1px; margin-bottom:8px;}
  .ghint{font-size:11px; color:var(--sub); opacity:.7; margin-bottom:22px;}
  #loginOverlay input{display:block; width:100%; box-sizing:border-box; margin:0 0 12px; padding:11px 14px; background:rgba(255,255,255,.045); border:1px solid rgba(143,160,192,.26); border-radius:9px; color:#eaf0fa; font-size:14px; outline:none; caret-color:#4a9eff; transition:border-color .15s, background .15s;}
  #loginOverlay input::placeholder{color:rgba(143,160,192,.5);}
  #loginOverlay input:hover{border-color:rgba(143,160,192,.45);}
  #loginOverlay input:focus{border-color:#4a9eff; background:rgba(255,255,255,.07); box-shadow:0 0 0 3px rgba(47,107,255,.12);}
  #loginOverlay input:-webkit-autofill,
  #loginOverlay input:-webkit-autofill:hover,
  #loginOverlay input:-webkit-autofill:focus{
    -webkit-text-fill-color:#eaf0fa;
    -webkit-box-shadow:0 0 0 1000px #232a3a inset;
    transition:background-color 9999s ease-in-out 0s;
    caret-color:#4a9eff;
  }
  #loginOverlay input:focus{border-color:var(--blue); box-shadow:0 0 0 3px rgba(47,107,255,.15);}
  #loginOverlay input::placeholder{color:var(--sub); opacity:.6;}
  .gerr{color:var(--red);font-weight:600; font-size:12.5px; min-height:18px; margin-bottom:6px;}
  .gbtn{width:100%; padding:11px 0; background:linear-gradient(135deg, #2f6bff, #1e4fd6); border:none; border-radius:9px; color:#fff; font-size:15px; font-weight:600; letter-spacing:6px; cursor:pointer; transition:box-shadow .2s, transform .1s;}
  .gbtn:hover{box-shadow:0 6px 20px rgba(47,107,255,.35); transform:translateY(-1px);}
  .gbtn:active{transform:translateY(0);}
  .visit-btn{background:var(--panel2); border:1px solid var(--line); color:var(--ink); border-radius:8px; padding:7px 14px; font-size:12.5px; cursor:pointer; font-weight:600;}
  .visit-btn:hover{border-color:var(--blue);}


  .vs-day{font-size:13px;font-weight:700;color:var(--blue);margin:14px 0 6px;padding-left:8px;border-left:3px solid var(--blue);}
  .vs-sum{font-size:13px; color:var(--ink); font-weight:600; margin-bottom:8px;}
  .vs-row{display:flex; justify-content:space-between; align-items:center; background:var(--panel2); border:1px solid var(--line); border-radius:8px; padding:8px 12px; margin-bottom:6px; font-size:13px;}
  .vs-row b{color:var(--ink);}
  .vs-row span{color:var(--sub); font-size:12px;}
  .vs-tbl{width:100%; border-collapse:collapse; font-size:12.5px; margin-top:10px;}
  .vs-tbl th{background:var(--panel2); color:var(--sub); text-align:left; padding:7px 10px; border-bottom:1px solid var(--line); white-space:nowrap;}
  .vs-tbl td{padding:6px 10px; border-bottom:1px solid #1c2742; white-space:nowrap;}
