/* 模具录入页 第 4 期(设计师图纸模块, 2026-09-30; 画板 D 板 dwg-canvas/Entry; 本体 public/mold-entry.js)
   全部走 styles.css / drawing-lib.css 的 :root 设计令牌(--dl-info 是 drawing-lib.css 里的源文件类型徽色)。
   必须在 mold-task.css 之后加载: 下面覆盖它的 .me-tk-chip / .me-tkbanner。不做手机专版, 只保证 ≤768 不炸。 */

/* 卡片: 左表单 + 右四格(2×2) */
.me-page .me-card { grid-template-columns: minmax(0, 1fr) minmax(0, 600px); }
.me-page .me-foot { flex-wrap: wrap; }
.me-foot-tip { color: var(--muted-2); font-size: 12px; }
.me-sum { color: var(--muted); font-size: 12px; }
.me-sum b { color: var(--ink); font-weight: 600; }
.me-tail { color: var(--muted-2); font-size: 12px; padding: 0 4px; }

.me-slots { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.me-slots .me-slot { min-width: 0; min-height: 168px; }
.me-slot .me-hint { color: var(--muted-2); font-size: 11px; line-height: 1.4; }
.me-slot .me-prev { flex: 1 1 auto; flex-direction: column; flex-wrap: nowrap; align-items: stretch; justify-content: center; gap: 6px; min-height: 84px; padding: 8px; border-radius: 8px; background: var(--fill); }
.me-slot .me-empty { text-align: center; color: var(--muted-2); font-size: 12px; }

/* 排队中的文件: 图片缩略 / 源文件卡, 都可撤 */
.me-qlist { display: flex; flex-wrap: wrap; gap: 8px; }
.me-qlist.is-src { flex-direction: column; flex-wrap: nowrap; gap: 4px; }
.me-q { position: relative; display: inline-flex; }
.me-q img { width: 64px; height: 64px; }
.me-qx { position: absolute; top: -6px; right: -6px; width: 18px; height: 18px; padding: 0; display: inline-grid; place-items: center; border: 1px solid var(--line); border-radius: 50%; background: var(--surface); color: var(--muted); cursor: pointer; }
.me-qx:hover { color: var(--bad); border-color: var(--bad); }
.me-qb { align-self: flex-start; height: 20px; padding: 0 8px; border-radius: 10px; background: var(--primary-50); color: var(--warn); font-size: 11px; font-style: normal; font-weight: 600; display: inline-flex; align-items: center; }
.me-file { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border: 1px solid var(--line-soft); border-radius: 6px; background: var(--surface); font-size: 12px; min-width: 0; }
.me-file .me-qx { position: static; flex: 0 0 auto; }
.me-tb { flex: 0 0 auto; height: 18px; padding: 0 6px; border-radius: 9px; background: var(--dl-info-soft); color: var(--dl-info); font-size: 11px; font-weight: 600; display: inline-flex; align-items: center; }
.me-fn { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.me-fs { flex: 0 0 auto; color: var(--muted); }

/* 页顶「我的开模任务」条(画板 D): 待接/出图中 两颗胶囊 + 任务胶囊 + 右侧「不按任务, 自由登记」 */
.me-tk-pill { height: 26px; padding: 0 12px; border-radius: 13px; background: var(--primary-50); color: var(--warn); font-weight: 600; display: inline-flex; align-items: center; }
.me-tk-pill.is-on { background: var(--primary); color: var(--surface); }
.me-tk-sep { width: 1px; height: 26px; background: var(--line); }
.me-tk-chip.is-hot { border-color: var(--primary-2); }
.me-tk-chip b { color: var(--bad); font-weight: 600; }
.me-tk-chip small.is-over, .me-tkbanner small.is-over { color: var(--bad); font-weight: 600; }
.me-tk-free { height: 26px; padding: 0 12px; border: 1px dashed var(--line); border-radius: 13px; background: transparent; color: var(--muted); font: inherit; cursor: pointer; }
.me-tk-free:hover { color: var(--primary); border-color: var(--primary); }
/* 表单头橙条: 任务号(实心胶囊) + 标题 · 下单人 日期 + 超期 + × */
.me-tkbanner .me-tkno { flex: 0 0 auto; height: 20px; padding: 0 8px; border-radius: 10px; background: var(--primary); color: var(--surface); font-size: 11px; display: inline-flex; align-items: center; overflow: visible; }
.me-tkbanner .me-tkt { flex: 1 1 auto; font-weight: 400; color: var(--ink); }

@media (max-width: 1200px) {
  .me-page .me-card { grid-template-columns: minmax(0, 1fr); }
  .me-page .me-left { border-right: 0; }
}
@media (max-width: 768px) {   /* 不做手机专版, 只保证不炸: 表单里写死列数的 .me-grid(行内 style)收成两列 */
  .me-page .me-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .me-page .me-head { flex-wrap: wrap; }
}
@media (max-width: 480px) {
  .me-page .me-grid { grid-template-columns: minmax(0, 1fr) !important; }
  .me-slots { grid-template-columns: minmax(0, 1fr); }
  .me-tk-free { flex: 1 1 100%; }
}