/* ============================================================
   投放矩阵（C 版）：行=账号 列=任务 格=状态
   颜色只用 theme.css token；格子 hover 浮现「可点」信号。
   ============================================================ */

.mxwrap{padding:0;overflow:hidden}
.mxwrap .ch{padding:14px 16px 10px}
.mxwrap .filters{padding:0 16px}
.mxscroll{overflow:auto;max-height:calc(100vh - 260px)}
.mxgrid{display:grid;gap:4px;padding:0 12px 12px;min-width:max-content}
/* 剪辑师六站矩阵：列数固定（任务+六站），必须一屏放下不横向滚动，
   所以不吃 max-content 撑宽，fr 列随容器均分、条目文字换行 */
.mxgrid.mxfit{min-width:0}

.mxcell{border:1px solid var(--line);border-radius:8px;background:var(--panel);
  padding:7px 10px;min-height:44px;text-align:left;font:inherit;color:var(--txt);
  display:flex;flex-direction:column;justify-content:center;gap:1px}
.mxcell b{font-size:12.4px;font-weight:600;line-height:1.35}
.mxcell span{font-size:10.6px;color:var(--txt3);line-height:1.3}

/* 头行与账号列：吸顶/吸左，滚动不丢上下文 */
.mx-head{position:sticky;top:0;z-index:2;background:var(--panel3);font-weight:600}
.mx-acc{position:sticky;left:0;z-index:1;background:var(--panel3)}
.mx-acc.mx-head{z-index:3}
.mx-acc b{font-family:var(--mono);font-size:12px}
/* 任务等级徽标（C2.97）：只有「来自任务看板」的任务才有（板外手工录的没有等级，不画）。
   15px 高 / 9.5px 等宽字，与 12px 任务名同基线——232px 的行头里 SSS 也只占约 28px，
   任务名照常换行，列宽、行高、六站格子的尺寸一律不动。配色沿用看板卡片那套：
   红 SSS → 橙 SS → 紫 S → 蓝 A → 灰 B，同一个任务在三个矩阵里颜色永远一致。 */
.mx-lv{display:inline-block;margin-right:5px;padding:0 3px;border-radius:4px;
  font:700 9.5px/14px var(--mono);letter-spacing:.2px;vertical-align:1px;
  color:var(--txt2);border:1px solid var(--line);background:var(--soft);cursor:help;
  white-space:nowrap;overflow:visible;text-overflow:clip}
/* 行头那条 .mx-acc span 会把 display/字号/行高一起覆盖（它的特异性更高），
   所以徽标的规矩必须再压一层，否则会变成一条满宽的灰带 */
.mx-acc b .mx-lv{display:inline-block;font:700 9.5px/14px var(--mono);padding:0 3px;vertical-align:1px;
  white-space:nowrap;overflow:visible;text-overflow:clip}
.mx-lv.lv-sss{color:var(--red);border-color:color-mix(in srgb,var(--red) 42%,transparent);background:color-mix(in srgb,var(--red) 10%,transparent)}
.mx-lv.lv-ss{color:var(--amber);border-color:color-mix(in srgb,var(--amber) 45%,transparent);background:color-mix(in srgb,var(--amber) 12%,transparent)}
.mx-lv.lv-s{color:var(--purple);border-color:color-mix(in srgb,var(--purple) 42%,transparent);background:color-mix(in srgb,var(--purple) 10%,transparent)}
.mx-lv.lv-a{color:var(--blue);border-color:var(--line-blue);background:var(--blue-d)}
.mx-lv.lv-b{color:var(--txt3);border-color:var(--line);background:var(--soft)}
/* 行头要求注记（C2.15）：非分段「500(10条)」；分段「分段 3帖$4 ▸ 6帖$8」紫色一眼区分 */
.mxreq-stage{color:var(--purple);font-weight:600}

/* 空格：虚线，安静地表示「没接」 */
.mx-empty{border-style:dashed;background:transparent;color:var(--txt3);
  align-items:center;justify-content:center;display:flex}

/* 走过的站留痕（C2.119）：任务已经离开这一站，但那一刻要留在格里。
   做成「上面小字说是哪一步、下面时间」的两行，比一行长文本更容易扫。
   样式刻意保持「空」的质感：虚线框（和空格一致）、不加底色、整体压到六成不透明度 ——
   它是痕迹，不是条目，不能看起来像有东西在这里等着人点。 */
.mx-empty.mx-hist{flex-direction:column;gap:1px;color:var(--txt3);
  line-height:1.25;padding:3px 6px;opacity:.58}
.mx-empty.mx-hist:hover{opacity:.8}
/* C2.230：「走过这一站但没留下时刻」（现在是绕过「我已制作」直接投流的那种）。
   不能画成「—」——那是「没走过」的意思。淡琥珀 + 虚线，扫一眼就知道「这格缺数据」而不是「这格是空」。 */
.mx-empty.mx-hist.is-miss{color:var(--amber);border-color:var(--line-amber);border-style:dashed}
.mx-empty.mx-hist.is-miss b{font-weight:600;font-size:11px}
.mx-hist span{font-size:10.5px;letter-spacing:.2px}
.mx-hist b{font-size:11.5px;font-weight:600;font-variant-numeric:tabular-nums}
/* 紧凑 / 超紧凑模式下只留时间，标签省掉 —— 那两档一行只放得下一行字 */
.mx-dense .mx-hist span,.mx-ultra .mx-hist span{display:none}
.mx-dense .mx-hist,.mx-ultra .mx-hist{padding:0 4px;flex-direction:row}

/* 配色纪律（C2.13）：蓝 = 要动手（待投流/去关投放/剪辑师动作格），其他色 = 不用动 */
.mx-act,.mx-pend{background:var(--blue-d);border-color:var(--line-blue);color:var(--blue)}
.mx-act span,.mx-pend span{color:var(--blue);opacity:.75}
.mx-act{font-weight:600;box-shadow:inset 0 0 0 1px var(--line-blue)}
.mx-run{background:var(--amber-d);border-color:var(--line-amber);color:var(--amber)}
.mx-run span{color:var(--amber);opacity:.8}
.mx-ok{background:var(--green-d);border-color:var(--line-green);color:var(--green)}
.mx-ok span{color:var(--green);opacity:.8}
.mx-no{background:var(--red-d);border-color:var(--line-red);color:var(--red)}
.mx-no span{color:var(--red);opacity:.8}
.mx-mute{background:var(--soft);border-color:var(--line);color:var(--txt2)}

/* 可点的格子（待投流）：hover 浮现主操作信号 */
button.mxcell{cursor:pointer}
button.mxcell.can:hover{border-color:var(--brand);box-shadow:0 0 0 1px var(--brand)}
button.mxcell:not(.can){cursor:default}

.mxseg{font-size:10.4px;color:var(--purple);margin-top:2px}
button.mxcell.can:hover{transform:translateY(-1px)}

/* 一格多条（同账号同任务多轮）：外壳中性，条目各自带状态色 */
.mxcell.mx-multi{background:var(--soft);padding:4px;gap:4px;justify-content:flex-start}
.mxent{border:1px solid var(--line);border-radius:6px;padding:5px 8px;text-align:left;
  font:inherit;display:flex;flex-direction:column;gap:1px;width:100%}
.mxent b{font-size:12.2px;font-weight:600;line-height:1.35}
.mxent span{font-size:10.6px;opacity:.85;line-height:1.3}
button.mxent{cursor:pointer}
button.mxent:hover{border-color:var(--txt3)}
button.mxent.can:hover{border-color:var(--brand);box-shadow:0 0 0 1px var(--brand);transform:translateY(-1px)}

/* 投放中格角上的「关」（C2.132）：能提前关，但不是该关。
   蓝只落在这一颗小按钮上——整格染蓝会和「达标该去关」抢信号。
   按钮不能套按钮，所以它是主条目的同级兄弟、绝对定位在右下角。 */
/* C2.138：包装层必须跟着格子一起拉伸。上一版只写了 width:100%，于是条目成了
   「宽度撑满、高度只占内容」——琥珀格下面空出一截，看起来像没填满。
   格子是 flex column，这里补 flex:1 + align-items:stretch，让条目和兄弟条目一样铺满。 */
.mxent-wrap{position:relative;display:flex;flex:1 1 auto;width:100%;align-items:stretch}
.mxent-wrap>.mxent{flex:1 1 auto;padding-right:34px}
.mxent-stop{position:absolute;right:5px;bottom:5px;z-index:1;
  font:inherit;font-size:10.6px;font-weight:600;line-height:1;padding:3px 6px;
  border-radius:5px;cursor:pointer;
  border:1px solid var(--line-blue);background:var(--blue-d);color:var(--blue)}
.mxent-stop:hover{border-color:var(--blue);background:var(--blue);color:var(--on-primary)}
.mxent-stop:focus-visible{outline:2px solid var(--blue);outline-offset:1px}
/* 紧凑档：格子只有一行字高，角标压成圆点，字号缩到 10px 免得挤掉状态词 */
.mx-dense .mxent-stop,.mx-ultra .mxent-stop{padding:2px 4px;font-size:10px;bottom:4px;right:4px}
.mx-dense .mxent-wrap>.mxent,.mx-ultra .mxent-wrap>.mxent{padding-right:30px}

/* 明细弹层底部的动作区（矩阵格子点进来后的操作位） */
.detail-acts{display:flex;gap:8px;align-items:center;margin-top:10px;flex-wrap:wrap}
.detail-acts .link-in{flex:1;min-width:220px}
/* 交制作 / 判失败平行一对（C2.19）：等宽同行，主色在前优先引导 */
.detail-acts.detail-pair .btn{flex:1;min-width:0;justify-content:center}

/* 「还有 N 条」与格内清单弹层 */
.mx-more{border-style:dashed;color:var(--txt3);cursor:pointer}
.mx-more:hover{color:var(--brand);border-color:var(--brand)}
.cellist{display:flex;flex-direction:column;gap:6px}

/* 列头点击排序（C2.16）：点列头 = 该状态任务置顶 + 按创建时间排，再点恢复 */
.mx-sort{cursor:pointer;user-select:none}
.mx-sort:hover{border-color:var(--line-blue)}
.mx-sort.on{border-color:var(--blue);box-shadow:inset 0 0 0 1px var(--line-blue);background:var(--blue-d)}
.mxsort-tag{font-style:normal;font-size:10px;color:var(--blue);margin-left:5px;font-weight:400}

/* 六站列头的计数角标 */
.mxcol-n{font-family:var(--mono);font-size:10.6px;color:var(--txt3);margin-left:6px;font-weight:400}

/* 管理员任务总览：六站统计卡（C2.30），佣金到账卡带条数小字 */
.stats.s6{grid-template-columns:repeat(6,1fr)}
.stats.s6 .stat .fine{display:block;margin-top:2px}

/* ============================================================
   行头三行重排（C2.205）
   ------------------------------------------------------------
   ① 任务名：单行，超出省略号（折行会让行高翻倍，一屏看不到几条）
   ② 时间：北京时间，日期 + 时刻，跨年两端带年份
   ③ 评级 + 完整账号 + 剪辑师 + 要求（`200(5条)` 原样）

   行头 232 → 260：账号名必须完整显示，232px 下第三行只有 212px，
   装不下 18~19 个字符的 handle（实测线上最长 19）。代价是状态格整体右移 28px。
   ============================================================ */
.mx-acc.nrh{justify-content:flex-start;gap:0;padding:7px 9px;min-height:0}

/* ① 谁的号：评级徽标（有才渲染，没有不留空）+ 账号（不带 @）+ 剪辑师 */
.mx-acc.nrh .nrh-l1{display:flex;align-items:center;gap:5px;width:100%;flex:0 0 auto;
  white-space:nowrap;overflow:hidden}
.mx-acc.nrh .nrh-a{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  font-size:13.2px;font-weight:650;line-height:1.45;letter-spacing:-.1px;color:var(--txt);
  font-variant-numeric:tabular-nums}
/* 评级徽标与待办点 / 新指派点：不参与压缩，也不参与账号名的截断 */
.mx-acc.nrh .nrh-l1 .rat-badge,
.mx-acc.nrh .nrh-l1 .mx-todo,
.mx-acc.nrh .nrh-l1 .mx-newdot{flex:0 0 auto}
.mx-acc.nrh .nrh-l1 .rat-badge{font-size:9.6px;padding:2px 5px;margin:0;color:#fff}
.mx-acc.nrh .nrh-e{flex:0 0 auto;margin-left:auto;font-size:10.6px;color:var(--txt2);
  padding:0 6px;line-height:1.6;border-radius:9px;background:var(--soft);border:1px solid var(--line);
  max-width:45%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* 同一账号同一任务的多条登记：用「录入时刻」区分，只写时间不写编号（C2.224） */
.mx-acc.nrh .nrh-l1 .mx-dup{flex:0 0 auto;font-style:normal;font-size:9.8px;font-weight:600;
  line-height:1;padding:2px 5px;border-radius:5px;letter-spacing:.2px;white-space:nowrap;
  color:var(--txt3);background:transparent;border:1px dashed var(--line)}

/* ② 什么活：等级徽标 + 任务名（单行，放不下用 … 截断；全名在悬停提示里） */
.mx-acc.nrh .nrh-l2{display:flex;align-items:center;gap:5px;width:100%;flex:0 0 auto;margin-top:1px;
  white-space:nowrap;overflow:hidden;font-size:12.2px;line-height:1.45}
.mx-acc.nrh .nrh-t{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  font-weight:600;color:var(--txt)}
.mx-acc.nrh .nrh-l2 .mx-lv{flex:0 0 auto;white-space:nowrap;min-width:max-content}

/* ③ 要多少：门槛 `200(5)`（分段 `200(5)/300(6)`）+ 设备号 */
.mx-acc.nrh .nrh-l3{display:flex;align-items:center;gap:6px;width:100%;flex:0 0 auto;margin-top:3px;
  overflow:hidden;font-size:10.8px;line-height:1.45;color:var(--txt2)}
.mx-acc.nrh .nrh-r{flex:0 0 auto;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  font-size:11.6px;font-weight:700;line-height:1.5;padding:1px 6px;border-radius:6px;
  color:var(--blue);background:var(--blue-d);border:1px solid var(--line-blue);
  font-variant-numeric:tabular-nums}
/* 分段任务：同一格式、紫色底，扫列时能一眼分出「这条要多段」 */
.mx-acc.nrh .nrh-r.is-staged{color:var(--purple);background:var(--purple-d);border-color:var(--purple-d)}
/* 设备号（C2.228）：位置不动（仍在门槛右边、同一行同一顺序），只把它「做重」一点。
   原来 --txt3 + 一条极淡描边，跟底下的时间留痕一个重量，投流师说找不到是哪个设备。
   现在：字号 10.8 → 11.6（与门槛同档）、字重 700、文字用主色 --txt、
   底换成 --track（浅绿灰，白卡与深卡上都看得见）、描边 --line2。
   为什么不用彩色实底：门槛 chip 已经是蓝/紫实底，设备号再上色就两个"重点"打架；
   中性底 + 高对比字足够跳出来，又不抢「要几条、要多少播放」。
   允许被压（flex:0 1 auto）：行头只有 300px 时，被截的只能是设备号——
   门槛是投流师第一个要看的数，剪辑师名字也是找人用的，两者都不许截。 */
.mx-acc.nrh .nrh-dev{flex:0 1 auto;min-width:0;white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis;padding:1.5px 7px;border-radius:6px;
  font-size:11.6px;font-weight:700;letter-spacing:.1px;line-height:1.5;
  color:var(--txt);background:var(--track);border:1px solid var(--line2);
  font-variant-numeric:tabular-nums}
/* 未登记 / 已释放：不给底、不加重，退回到「说明」的重量（否则每行都在喊） */
.mx-acc.nrh .nrh-dev.is-none{font-size:10.8px;font-weight:600;letter-spacing:0;
  color:var(--txt3);background:transparent;border-color:var(--line)}

/* 密集档：三行结构不变，只收紧内边距；三行一律 flex:0 0 auto，谁都不许被压成 0 高 */
.mx-dense .mx-acc.nrh,.mx-ultra .mx-acc.nrh{flex-direction:column;flex-wrap:nowrap;
  column-gap:0;row-gap:0;padding:5px 8px}
.mx-dense .mx-acc.nrh .nrh-l1,.mx-ultra .mx-acc.nrh .nrh-l1,
.mx-dense .mx-acc.nrh .nrh-l2,.mx-ultra .mx-acc.nrh .nrh-l2,
.mx-dense .mx-acc.nrh .nrh-l3,.mx-ultra .mx-acc.nrh .nrh-l3{flex:0 0 auto;white-space:nowrap;overflow:hidden}
.mx-dense .mx-acc.nrh .nrh-a,.mx-ultra .mx-acc.nrh .nrh-a{font-size:12.4px}
.mx-dense .mx-acc.nrh .nrh-l3,.mx-ultra .mx-acc.nrh .nrh-l3{margin-top:1px}
/* 密集档：设备号跟着收一档，但字重与配色不变——压的是内边距，不是可见性 */
.mx-dense .mx-acc.nrh .nrh-dev,.mx-ultra .mx-acc.nrh .nrh-dev{padding:0 6px}
.mx-ultra .mx-acc.nrh .nrh-dev{font-size:11px}

/* 悬停提示（views/matrix-tip.js 挂到 body 上）：反色小卡，不被矩阵滚动容器裁掉 */
#mx-tip{position:fixed;z-index:90;display:none;max-width:340px;padding:8px 11px;border-radius:9px;
  background:var(--txt);color:var(--bg);font-size:11.5px;line-height:1.6;pointer-events:none;
  box-shadow:0 10px 26px rgba(0,0,0,.28)}
/* 四行：任务全名 / 建立 / 北京时间 / 美国时间。
   时间行做成「标签 + 值」两列 grid：三个标签左对齐、三串时间左端成一条竖线，
   上下对照同一段区间时不用左右找对齐。 */
#mx-tip b{display:block;margin-bottom:3px;font-weight:650}
#mx-tip span{display:grid;grid-template-columns:52px 1fr;gap:7px;
  opacity:.82;font-variant-numeric:tabular-nums;line-height:1.55}
#mx-tip span i{font-style:normal;opacity:.72}
/* 美国时间是「对账用」的第二参考，整行比北京时间再淡一档 */
#mx-tip span.t-us{opacity:.68}
#mx-tip span.t-us i{opacity:.66}
#mx-tip.on{display:block}
#mx-tip b{display:block;font-size:12px;font-weight:600;margin-bottom:3px;word-break:break-word}
#mx-tip span{opacity:.78;font-variant-numeric:tabular-nums}

/* ---------- C2.250 筛选条：具体日期 ---------- */

/* 日期框不能吃 .filters input 的 min-width:150px —— 一排下来会把搜索框挤没。
   单独压到 132px，且只在「指定日期」档才显示（JS 控制 hidden）。 */
.filters .mf-date {
  min-width: 0;
  width: 132px;
  padding: 0 6px;
  font-size: 12px;
}

/* 日历按钮：跟着下拉走，别用主按钮色（它不是提交动作） */
.filters .mf-date-btn {
  white-space: nowrap;
  flex: 0 0 auto;
}