/* comms.css -- session 216. The Communications page and the Dashboard's communications column.
   The stylesheet of briefs/mh-comms-mockup-v1.html taken literally (its inline values, colours, radii, shadows, sizes), with every
   class named cm-* and every rule scoped under .cm, the way owner.css took owner-mockup-v3.html, so nothing here touches the rest
   of the hub. The screen's old style tag (the one qflowStyleTag() wrote) is retired: nothing on this page uses it. */
.cm,.cm *{box-sizing:border-box}
.cm{
  --cm-canvas:#f2f4f5; --cm-surface:#fff; --cm-surface-2:#e9ecee; --cm-line:#dfe3e6; --cm-line-strong:#c9d0d4; --cm-ink:#16181a; --cm-text:#4d545a; --cm-muted:#6b747b;
  --cm-b9:#0e363b; --cm-b7:#144d54; --cm-b5:#1d6e77; --cm-b3:#6fd5d4; --cm-b1:#dceff0; --cm-y5:#ffd13a; --cm-o5:#ff8a33; --cm-red:#b3261e; --cm-green:#2e9c7c; --cm-purple:#4a3a9a;
  --cm-sh-card:0 4px 14px 0 rgba(14,54,59,.08); --cm-sh-hero:0 10px 30px 0 rgba(14,54,59,.22);
  --cm-sans:'Inter','Segoe UI',system-ui,-apple-system,'Helvetica Neue',Arial,sans-serif;
  font-family:var(--cm-sans); color:var(--cm-ink);
}
.cm a{color:var(--cm-b5)} .cm a:hover{color:var(--cm-b7)}
.cm button{font-family:inherit}

/* ---- header ---- */
.cm .cm-head{display:flex;align-items:flex-end;gap:16px;flex-wrap:wrap}
.cm .cm-head h1{margin:0;font-size:32px;font-weight:800;letter-spacing:-0.03em;color:var(--cm-b7);line-height:1.15}
.cm .cm-head p{margin:6px 0 0 0;font-size:14px;color:var(--cm-text)}
.cm .cm-grow{flex-grow:1}
.cm .cm-range{display:flex;gap:6px}
.cm .cm-rangebtn{height:32px;padding:0 12px;border-radius:999px;border:1px solid var(--cm-line-strong);background:#fff;color:var(--cm-text);font-size:12.5px;font-weight:500;cursor:pointer}
.cm .cm-rangebtn.on{border-color:var(--cm-b7);background:var(--cm-b7);color:#fff;font-weight:700}

/* ---- channel toggles ---- */
.cm .cm-chan{display:flex;gap:6px;align-items:center;margin-top:14px;flex-wrap:wrap}
.cm .cm-chan .cm-lab{font-size:12.5px;color:var(--cm-muted);margin-right:4px}
.cm .cm-chbtn{height:30px;padding:0 12px;border-radius:999px;font-size:12.5px;font-weight:700;cursor:pointer;background:#fff;color:var(--cm-muted);border:1px solid var(--cm-line-strong)}
.cm .cm-chbtn.on{background:var(--cm-b7);color:#fff;border-color:var(--cm-b7)}
.cm .cm-chbtn.off{border-style:solid}
.cm .cm-chbtn.gone{border-style:dashed;cursor:not-allowed}
.cm .cm-chan .cm-hint{font-size:12px;color:var(--cm-muted)}

/* ---- highlights band ---- */
.cm .cm-hl{display:grid;grid-template-columns:1.25fr 1fr 1.15fr 1.2fr .9fr;gap:14px;margin-top:14px}
.cm .cm-card{background:#fff;border-radius:14px;box-shadow:var(--cm-sh-card);padding:14px 16px;display:flex;flex-direction:column;gap:8px;min-width:0}
.cm .cm-card.cm-hero{background:linear-gradient(135deg,var(--cm-b7),var(--cm-b9));box-shadow:var(--cm-sh-hero);padding:14px 18px;color:#fff;gap:6px}
.cm .cm-card .cm-ct{font-size:12.5px;font-weight:700;color:var(--cm-text)}
.cm .cm-hero .cm-ct{color:var(--cm-b3)}
/* Session 222, Part 1: a highlight card that counts unresolved items regardless
   of the top period says so in its own label, never contradicting the period
   total beside it. */
.cm .cm-anydate{font-style:normal;font-weight:500;font-size:10.5px;color:var(--cm-muted);margin-left:6px;text-transform:none}
.cm .cm-hero .cm-anydate{color:rgba(255,255,255,.72)}
.cm .cm-hero .cm-big{font-size:44px;font-weight:800;letter-spacing:-0.035em;line-height:.95}
.cm .cm-row-end{display:flex;align-items:flex-end;justify-content:space-between;gap:10px}
.cm .cm-hero .cm-sub{font-size:12.5px;color:#cfe7e8}
.cm .cm-num34{font-size:34px;font-weight:800;line-height:1}
.cm .cm-sub12{font-size:12px;color:var(--cm-muted)}
.cm .cm-num22{font-size:22px;font-weight:800}
.cm .cm-oldest{font-size:13px;color:var(--cm-ink)}
.cm .cm-oldest b{font-size:22px}
.cm .cm-svg{max-width:100%;height:auto;display:block}
.cm .cm-legend{display:flex;flex-wrap:wrap;gap:4px 12px}
.cm .cm-legend span{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;color:var(--cm-text)}
.cm .cm-legend i{width:8px;height:8px;border-radius:2px;display:inline-block}
.cm .cm-legend b{color:var(--cm-ink)}
.cm .cm-ringrow{display:flex;align-items:center;gap:12px}
.cm .cm-ringtxt{font-size:12.5px;color:var(--cm-text);line-height:1.35}
.cm .cm-empty{font-size:12.5px;color:var(--cm-muted);line-height:1.4}

/* ---- the three columns ---- */
.cm .cm-main{display:flex;gap:18px;margin-top:16px;height:660px;min-height:660px}
.cm .cm-queues{width:220px;flex-shrink:0;display:flex;flex-direction:column;gap:3px}
.cm .cm-q{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:10px;text-decoration:none;background:transparent;cursor:pointer;color:var(--cm-ink)}
.cm .cm-q:hover{text-decoration:none;background:#eaeeef}
.cm .cm-q.on{background:var(--cm-b1);box-shadow:inset 3px 0 0 var(--cm-b7)}
.cm .cm-q .sq{width:10px;height:10px;border-radius:3px;flex-shrink:0}
.cm .cm-q .cm-nm{flex-grow:1;font-size:13.5px;font-weight:600;color:var(--cm-ink)}
.cm .cm-q.on .cm-nm{font-weight:800}
.cm .cm-q .ct{font-size:13px;font-weight:800}
.cm .cm-qsep{height:1px;background:var(--cm-line);margin:6px 4px}
.cm .cm-q2{padding:8px 12px;font-size:13.5px;font-weight:600;color:var(--cm-text);text-decoration:none;border-radius:10px;cursor:pointer;display:block}
.cm .cm-q2:hover{text-decoration:none;background:#eaeeef}
.cm .cm-q2.on{background:var(--cm-b1);box-shadow:inset 3px 0 0 var(--cm-b7);font-weight:800;color:var(--cm-ink)}
.cm .cm-list{width:400px;flex-shrink:0;background:#fff;border-radius:14px;box-shadow:var(--cm-sh-card);overflow:hidden;display:flex;flex-direction:column}
.cm .cm-lh{padding:12px 16px;border-bottom:1px solid var(--cm-line);display:flex;justify-content:space-between;align-items:center;flex-shrink:0}
.cm .cm-lh .cm-t{font-size:15px;font-weight:800}
.cm .cm-lscroll{overflow-y:auto;flex-grow:1;min-height:0}
.cm .cm-item{padding:12px 16px;border-bottom:1px solid var(--cm-line);display:flex;gap:12px;background:#fff;cursor:pointer}
.cm .cm-item:hover{background:#f7f9f9}
.cm .cm-item.on{background:var(--cm-b1)}
.cm .cm-item .bar{width:4px;border-radius:2px;flex-shrink:0}
.cm .cm-av{width:32px;height:32px;flex-shrink:0;border-radius:999px;background:var(--cm-y5);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:var(--cm-ink)}
.cm .cm-av.big{width:40px;height:40px}
.cm .cm-ib{min-width:0;flex-grow:1;display:flex;flex-direction:column;gap:3px}
.cm .cm-ib .cm-top{display:flex;justify-content:space-between;gap:8px}
.cm .cm-ib .cm-nm{font-size:14px;font-weight:700;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cm .cm-ib .age{font-size:12px;font-weight:700;flex-shrink:0}
.cm .cm-ib .prop{font-size:12.5px;color:var(--cm-muted)}
.cm .cm-ib .snip{font-size:13px;color:var(--cm-text);line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cm .cm-pills{display:flex;gap:6px;flex-wrap:wrap}
.cm .cm-pill{display:inline-flex;align-items:center;padding:2px 9px;border-radius:999px;background:#fff;border:1px solid var(--cm-line-strong);color:var(--cm-text);font-size:11.5px;font-weight:600;white-space:nowrap}
.cm .cm-pill.tag{background:var(--cm-b1);border-color:var(--cm-b1);color:var(--cm-b7)}
.cm .cm-fortag{display:inline-flex;align-items:center;gap:5px;padding:2px 9px 2px 3px;border-radius:999px;background:#ece8fb;color:var(--cm-purple);font-size:11.5px;font-weight:700;white-space:nowrap}
.cm .cm-fortag i{width:16px;height:16px;border-radius:999px;background:var(--cm-purple);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:9.5px;font-style:normal}
.cm .cm-note{padding:14px 16px;font-size:13px;color:var(--cm-text);line-height:1.45}
.cm .cm-note.err{color:var(--cm-red)}
.cm .cm-half{padding:9px 16px;font-size:11.5px;font-weight:700;letter-spacing:.02em;text-transform:none;color:var(--cm-muted);background:#f7f9f9;border-bottom:1px solid var(--cm-line)}

/* ---- the reading pane ---- */
.cm .cm-pane{flex-grow:1;min-width:0;background:#fff;border-radius:14px;box-shadow:var(--cm-sh-card);display:flex;flex-direction:column;overflow:hidden}
.cm .cm-ph{padding:14px 20px;border-bottom:1px solid var(--cm-line);display:flex;align-items:center;gap:12px}
.cm .cm-ph .cm-who{flex-grow:1;min-width:0}
.cm .cm-ph .cm-who .n{font-size:18px;font-weight:800}
.cm .cm-ph .cm-who .s{font-size:12.5px;color:var(--cm-muted)}
.cm .cm-topic{display:inline-flex;align-items:center;padding:2px 9px;border-radius:999px;font-size:12px;font-weight:600;white-space:nowrap}
.cm .cm-review{margin:12px 20px 0 20px;padding:10px 14px;border-radius:10px;background:#f1eefd;display:flex;gap:10px;align-items:center}
.cm .cm-review .cm-t{font-size:13px;color:#3b2f7a}
.cm .cm-review .mark{margin-left:auto}
/* Session 222, Part 3/4: severity and Cost to us, on a complaint item only. */
.cm .cm-sevblock{margin:12px 20px 0 20px;padding:10px 14px;border-radius:10px;background:#f8f4e8;display:flex;flex-direction:column;gap:8px}
.cm .cm-sevtop{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.cm .cm-sevtop .lab{font-size:11.5px;font-weight:700;color:var(--cm-text);text-transform:uppercase;letter-spacing:.02em}
.cm .cm-sevreason{font-size:12.5px;color:var(--cm-muted)}
.cm .cm-sevbtns{display:flex;gap:6px;flex-wrap:wrap}
.cm .cm-sevpill i{font-style:italic;font-weight:500;margin-left:3px}
.cm .cm-costrow{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--cm-ink);padding-top:4px;border-top:1px solid #e6dfc8}
.cm .cm-sum{padding:12px 20px;display:grid;grid-template-columns:1.4fr 1fr;gap:14px;border-bottom:1px solid var(--cm-line)}
.cm .cm-sum > div{display:flex;flex-direction:column;gap:6px;min-width:0}
.cm .cm-sum .a{font-size:13.5px;color:var(--cm-ink)}
.cm .cm-sum .b{font-size:12.5px;color:var(--cm-muted)}
.cm .cm-sum .c{font-size:12.5px;color:var(--cm-text)}
.cm .cm-sum .c b{color:var(--cm-ink)}
.cm .cm-mini{background:#f2f4f5;border-radius:10px;padding:10px 12px;display:flex;flex-direction:column;gap:6px}
.cm .cm-mini .cm-t{font-size:12px;font-weight:700;color:var(--cm-text)}
.cm .cm-mini .mo{display:flex;justify-content:space-between;width:150px;max-width:100%;font-size:11px;color:var(--cm-muted)}
.cm .cm-mini .n{font-size:12px;color:var(--cm-text)}
.cm .cm-thread{flex-grow:1;overflow-y:auto;padding:14px 20px;display:flex;flex-direction:column;gap:10px;min-height:0}
.cm .cm-msg{display:flex;flex-direction:column;align-items:flex-start;gap:3px}
.cm .cm-msg.me{align-items:flex-end}
.cm .cm-msg .bub{max-width:80%;padding:10px 14px;border-radius:14px;background:#e9ecee;color:var(--cm-ink);font-size:13.5px;line-height:1.4;white-space:pre-wrap;word-break:break-word}
.cm .cm-msg.me .bub{background:var(--cm-b7);color:#fff}
.cm .cm-msg .en{max-width:80%;font-size:12.5px;color:var(--cm-muted);font-style:italic;white-space:pre-wrap}
.cm .cm-msg .cm-meta{font-size:11.5px;color:var(--cm-muted)}
.cm .cm-msg img{max-width:220px;border-radius:10px}
.cm .cm-acts{padding:12px 20px;border-top:1px solid var(--cm-line);display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.cm .cm-btn{height:34px;padding:0 12px;border:1.5px solid var(--cm-b7);border-radius:8px;background:#fff;font-size:13px;font-weight:700;color:var(--cm-b7);cursor:pointer;white-space:nowrap;display:inline-flex;align-items:center;text-decoration:none}
.cm .cm-btn:hover{background:var(--cm-b1);text-decoration:none}
.cm .cm-btn.pri{border:0;padding:0 14px;background:linear-gradient(180deg,var(--cm-y5),#f5c21c);color:var(--cm-ink)}
.cm .cm-btn.pri:hover{background:linear-gradient(180deg,#ffdb63,#f5c21c)}
.cm .cm-acts .lnk{font-size:13px;font-weight:600}
.cm .cm-form{margin:0 20px 12px 20px;padding:12px 14px;border-radius:10px;background:#f2f4f5;display:flex;flex-direction:column;gap:8px}
.cm .cm-form label{font-size:12px;font-weight:700;color:var(--cm-text)}
.cm .cm-form input[type=text],.cm .cm-form textarea,.cm .cm-form select{width:100%;font:inherit;font-size:13.5px;padding:8px 10px;border:1px solid var(--cm-line-strong);border-radius:8px;background:#fff;color:var(--cm-ink)}
.cm .cm-form textarea{min-height:64px;resize:vertical}
.cm .cm-form .row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.cm .cm-form .cm-fmsg{font-size:12.5px;color:var(--cm-muted)}
.cm .cm-form .cm-fmsg.err{color:var(--cm-red)}
.cm .cm-opts{display:flex;flex-direction:column;gap:2px}
.cm .cm-opt{padding:7px 10px;border-radius:8px;cursor:pointer;font-size:13px;background:#fff;border:1px solid var(--cm-line)}
.cm .cm-opt:hover{background:var(--cm-b1)}
.cm .cm-placeholder{margin:auto;padding:40px;text-align:center;color:var(--cm-muted);font-size:14px;max-width:420px;line-height:1.5}

/* ---- trends, restyled ---- */
.cm .cm-trends{flex-grow:1;min-width:0;background:#fff;border-radius:14px;box-shadow:var(--cm-sh-card);overflow:auto;padding:16px 20px;display:flex;flex-direction:column;gap:16px}
.cm .cm-trends h3{margin:0 0 6px 0;font-size:15px;font-weight:800}
.cm .cm-trends table{width:100%;border-collapse:collapse;font-size:13px}
.cm .cm-trends th{text-align:left;font-size:12px;color:var(--cm-muted);font-weight:700;padding:4px 8px;border-bottom:1px solid var(--cm-line)}
.cm .cm-trends td{padding:6px 8px;border-bottom:1px solid var(--cm-line)}

/* ---- the Dashboard column (screen 2) ---- */
.s-dash .cm-dashcols{display:flex;gap:20px;align-items:flex-start}
.s-dash .cm-dashleft{flex-grow:1;min-width:0}
/* Session 232: 440px to 374px; session 233: 374px to 348px (another 7%). Dashboard only. */
.s-dash .cm-dashcomms{width:348px;flex-shrink:0;display:flex;flex-direction:column;gap:12px}
@media (max-width:1279px){
  .s-dash .cm-dashcols{flex-direction:column}
  .s-dash .cm-dashleft{width:100%}
  .s-dash .cm-dashcomms{width:100%}
}
.cm .cm-dch{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px 12px}
.cm .cm-dch .cm-t{font-size:13px;font-weight:700;color:var(--cm-b5)}
.cm .cm-dch a{font-size:13px;font-weight:600}
/* Session 225, Part 1: the Dashboard column's own time filter, a separate saved
   preference from the Communications page's own period selector above. */
.cm .cm-dch .cm-dchmid{flex-grow:1;display:flex;justify-content:center;min-width:110px}
.cm .cm-dashperiod{height:26px;padding:0 8px;border-radius:999px;border:1px solid var(--cm-line-strong);background:#fff;color:var(--cm-text);font-size:11.5px;font-weight:600;cursor:pointer}
.cm .cm-dhero{background:linear-gradient(135deg,var(--cm-b7),var(--cm-b9));border-radius:14px;box-shadow:var(--cm-sh-hero);padding:14px 18px;color:#fff;display:flex;flex-direction:column;gap:10px}
.cm .cm-dhero .cm-ct{font-size:12.5px;font-weight:700;color:var(--cm-b3)}
.cm .cm-dhero .cm-big{font-size:44px;font-weight:800;letter-spacing:-0.035em;line-height:.95}
.cm .cm-dhero .lab{font-size:11.5px;color:#cfe7e8}
.cm .cm-dhero .cm-legend span{color:#e6f3f3}
.cm .cm-dhero .cm-legend b{color:#fff}
.cm .cm-dhero .mine{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:10px;background:rgba(255,255,255,.10);text-decoration:none;color:#fff;font-size:13px;font-weight:600}
.cm .cm-dhero .mine:hover{background:rgba(255,255,255,.16);text-decoration:none;color:#fff}
.cm .cm-dhero a.cm-clk{text-decoration:none;color:inherit;display:block}
.cm .cm-dbox{background:#fff;border-radius:14px;box-shadow:var(--cm-sh-card);padding:14px 16px 10px 16px;display:flex;flex-direction:column;gap:6px}
.cm .cm-dbox .hd{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.cm .cm-dbox .hd .cm-l{min-width:0}
.cm .cm-dbox .hd .cm-l .r1{display:flex;align-items:baseline;gap:8px}
.cm .cm-dbox .hd .n{font-size:28px;font-weight:800;letter-spacing:-0.03em;line-height:1}
.cm .cm-dbox .hd .tt{font-size:15px;font-weight:800;color:var(--cm-ink)}
.cm .cm-dbox .hd .ss{font-size:12px;color:var(--cm-muted);margin-top:3px}
.cm .cm-dbox .hd .cm-r{flex-shrink:0}
.cm .cm-dbox .cm-tagrow{display:flex;gap:4px;margin-top:4px;justify-content:flex-end}
.cm .cm-dbox .cm-pill.tag{font-size:11px}
.cm .cm-drow{display:flex;gap:10px;padding:8px 0;border-top:1px solid var(--cm-line);cursor:pointer}
.cm .cm-drow .bar{width:3px;border-radius:2px;flex-shrink:0}
.cm .cm-drow .bd{min-width:0;flex-grow:1}
.cm .cm-drow .l1{display:flex;justify-content:space-between;gap:8px}
.cm .cm-drow .l1 .cm-nm{font-size:13px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cm .cm-drow .l1 .cm-nm span{font-weight:450;color:var(--cm-muted)}
.cm .cm-drow .l1 .ag{font-size:11.5px;font-weight:700;white-space:nowrap}
.cm .cm-drow .l2{display:flex;justify-content:space-between;gap:8px;align-items:baseline}
.cm .cm-drow .l2 .sn{font-size:12.5px;color:var(--cm-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cm .cm-drow .l2 a{font-size:12.5px;font-weight:600;white-space:nowrap}
.cm .cm-dall{font-size:12.5px;font-weight:600;padding-top:4px}
.cm .cm-dnone{font-size:12.5px;color:var(--cm-muted);padding:8px 0;border-top:1px solid var(--cm-line)}
.cm .cm-splitcol{display:flex;flex-direction:column;gap:4px;align-items:flex-end}
.cm .cm-splitcol .lg{display:flex;gap:8px;font-size:11px;color:var(--cm-text)}
.cm .cm-clk{cursor:pointer}

/* ---- narrow screens ---- */
@media (max-width:1100px){
  .cm .cm-hl{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cm .cm-main{flex-direction:column;height:auto;min-height:0}
  .cm .cm-queues{width:100%;flex-direction:row;flex-wrap:wrap;gap:4px}
  .cm .cm-qsep{display:none}
  .cm .cm-list{width:100%;max-height:520px}
  .cm .cm-pane{min-height:420px}
}
@media (max-width:600px){
  .cm .cm-hl{grid-template-columns:minmax(0,1fr)}
  .cm .cm-head h1{font-size:26px}
  .cm .cm-sum{grid-template-columns:minmax(0,1fr)}
  .cm .cm-msg .bub,.cm .cm-msg .en{max-width:92%}
  .cm .cm-ph{flex-wrap:wrap}
  .cm .cm-acts{padding:12px 14px}
  .cm .cm-review{margin:12px 14px 0 14px;flex-wrap:wrap}
  .cm .cm-form{margin:0 14px 12px 14px}
  .cm .cm-sum,.cm .cm-ph,.cm .cm-thread{padding-left:14px;padding-right:14px}
}

/* the column's own stack, and the left side never runs under it */
.cm #cmDashBody{display:flex;flex-direction:column;gap:12px}
.s-dash .cm-dashleft{overflow-x:auto}

/* ============================================================
   Session 217: Open / All, channel tiles, big property and clean pickers, one-click actions
   (briefs/mh-comms-mockup-v2.html taken literally; the values below are its inline values)
   ============================================================ */
/* Session 218: Resolved/Unresolved replaces Close/Open-All; the period (Today/This
   week/This month) replaces the old range picker at the top. */
.cm .cm-unresolved{display:block;font-size:11px;font-weight:500;color:var(--cm-muted)}
.cm .cm-q.on .cm-unresolved{color:var(--cm-muted)}
.cm .cm-statustabs{display:flex;gap:4px;padding:8px 16px;background:#e9ecee;margin:0 16px 8px 16px;border-radius:10px;width:fit-content}
.cm .cm-statusbtn{border:0;cursor:pointer;height:28px;padding:0 12px;border-radius:7px;background:transparent;font-size:12.5px;font-weight:600;color:var(--cm-text)}
.cm .cm-statusbtn.on{background:#fff;box-shadow:var(--cm-sh-card);color:var(--cm-ink);font-weight:800}
.cm .cm-nextstep{margin-top:8px;display:flex;flex-direction:column;gap:6px}
.cm .cm-nsrow{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:#fff7e0;border:1px solid #f0dfa3;border-radius:8px;padding:8px 10px}
.cm .cm-nstxt{font-size:12.5px;color:var(--cm-ink);flex:1;min-width:120px}
.cm .cm-dates{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--cm-muted)}
.cm .cm-dates input{height:32px;font:inherit;font-size:12.5px;padding:0 8px;border:1px solid var(--cm-line-strong);border-radius:8px;background:#fff;color:var(--cm-ink)}
.cm .cm-legend2{display:inline-flex;gap:14px;align-items:center;flex-wrap:wrap}
.cm .cm-lg{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--cm-text)}
.cm .cm-tile{flex-shrink:0;display:flex;align-items:center;justify-content:center}
.cm .cm-srcl{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;min-width:0;max-width:100%}
.cm .cm-srcl i{width:8px;height:8px;border-radius:999px;flex-shrink:0;display:inline-block}
.cm .cm-role{font-size:12.5px;color:var(--cm-muted);margin-left:6px;font-weight:400}
.cm .cm-sub2{font-size:12px;color:var(--cm-muted);padding:0 16px 8px 16px;margin-top:-6px;background:#fff}
.cm .cm-agebar{display:flex;gap:6px;flex-wrap:wrap;padding:8px 12px;border-bottom:1px solid var(--cm-line)}
.cm .cm-agebtn{height:28px;padding:0 10px;border-radius:999px;border:1px solid var(--cm-line-strong);background:#fff;color:var(--cm-text);font-size:12px;font-weight:600;cursor:pointer}
.cm .cm-agebtn b{font-weight:800;margin-left:3px}
.cm .cm-agebtn.on{background:var(--cm-b7);border-color:var(--cm-b7);color:#fff}
.cm .cm-bulk{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:8px 14px;border-bottom:1px solid var(--cm-line);background:#f7f9f9;flex-shrink:0}
.cm .cm-bulk .cm-bt{font-size:12.5px;color:var(--cm-text)}
.cm .cm-bulk .cm-bt b{color:var(--cm-ink)}
.cm .cm-bulkassign{display:flex;gap:6px;flex-basis:100%;align-items:center}
.cm .cm-bulkassign:empty{display:none}
.cm .cm-bulkassign select,.cm .cm-bulkassign input{height:32px;font:inherit;font-size:12.5px;padding:0 8px;border:1px solid var(--cm-line-strong);border-radius:8px;background:#fff;min-width:0}
.cm .cm-bulkassign input{flex:1}
.cm .cm-chk{display:flex;align-items:flex-start;width:20px;flex-shrink:0;padding-top:2px}
.cm .cm-chk.all{align-items:center;padding-top:0}
.cm .cm-chk input{width:18px;height:18px;margin:0;cursor:pointer;accent-color:var(--cm-b7)}
.cm .cm-btn.sm{height:28px;padding:0 10px;font-size:12px}
.cm .cm-btn.ghost{border-color:var(--cm-line-strong);color:var(--cm-text)}
.cm .cm-btn.big{height:48px;padding:0 16px;border-radius:12px;font-size:14px}
.cm .cm-btn.alt{height:44px;font-weight:600}
.cm .cm-btn[disabled]{opacity:.55;cursor:default}
/* rows: a checkbox, the link (bar, tile, body), and the hover actions */
.cm .cm-item{position:relative;padding:12px 16px 12px 12px;gap:8px;cursor:default}
.cm .cm-itemlink{display:flex;gap:12px;min-width:0;flex-grow:1}
.cm .cm-item .cm-tile{margin-left:0}
.cm .cm-sugg{font-size:11px;color:var(--cm-muted);font-style:italic}
.cm .cm-item.closed{opacity:.6;background:#f7f9f9}
.cm .cm-item.closed.on{opacity:.85}
.cm .cm-closedl{font-size:12px;color:var(--cm-muted);line-height:1.35}
.cm .cm-rowact{position:absolute;right:10px;bottom:8px;display:none;gap:6px;background:linear-gradient(90deg,rgba(255,255,255,0),#fff 22%);padding-left:16px}
.cm .cm-item:hover .cm-rowact,.cm .cm-item:focus-within .cm-rowact{display:flex}
.cm .cm-item.on .cm-rowact{background:linear-gradient(90deg,rgba(220,239,240,0),var(--cm-b1) 22%)}
.cm .cm-ra{height:26px;padding:0 10px;border:1.5px solid var(--cm-b7);border-radius:7px;background:#fff;color:var(--cm-b7);font-size:12px;font-weight:700;cursor:pointer}
.cm .cm-ra:hover{background:var(--cm-b1)}
@media (hover:none){ .cm .cm-rowact{display:flex} }
/* pane: property and clean */
.cm .cm-pc{padding:14px 20px;border-bottom:1px solid var(--cm-line);display:flex;flex-direction:column;gap:12px;background:#f2f4f5}
.cm .cm-pc .lbl{font-size:13px;font-weight:800;color:var(--cm-ink);margin-bottom:6px}
.cm .cm-pc .lbl span{font-weight:500;color:var(--cm-muted);margin-left:4px}
.cm .cm-proprow{display:flex;gap:8px;align-items:center}
.cm .cm-propbox{flex-grow:1;min-width:0;height:48px;border:2px solid var(--cm-b7);border-radius:12px;background:#fff;display:flex;align-items:center;gap:10px;padding:0 14px;font-family:inherit;text-align:left}
.cm .cm-propbox .pn{font-size:15px;font-weight:800;color:var(--cm-ink);white-space:nowrap;max-width:55%;overflow:hidden;text-overflow:ellipsis}
.cm .cm-propbox .pr{font-size:12.5px;color:var(--cm-muted);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cm .cm-propbox .pr b{color:var(--cm-b5)}
.cm .cm-propbox.empty{border-style:dashed;cursor:pointer}
.cm .cm-propbox.empty .pn{max-width:none}
.cm .cm-altrow{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:8px}
.cm .cm-altrow .lab{font-size:12px;color:var(--cm-muted);flex-basis:100%}
.cm .cm-cleanrow{display:flex;gap:8px}
.cm .cm-cleancard{flex:1 1 0;min-width:0;text-align:left;cursor:pointer;font-family:inherit;border:1px solid var(--cm-line-strong);border-radius:12px;background:#fff;padding:10px 12px;display:flex;flex-direction:column;gap:2px}
.cm .cm-cleancard.on{border:2px solid var(--cm-b7);background:var(--cm-b1)}
.cm .cm-cleancard .k{font-size:12px;font-weight:700;color:var(--cm-b5);min-height:15px}
.cm .cm-cleancard .d{font-size:14px;font-weight:800;color:var(--cm-ink)}
.cm .cm-cleancard .w{font-size:12.5px;color:var(--cm-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cm .cm-cleancard .sv{font-size:12px;color:var(--cm-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cm .cm-cleancard.other{flex:0 0 90px;border-style:dashed;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:var(--cm-b7)}
.cm .cm-opt.big{padding:12px 14px;font-size:14px}
.cm .cm-form .cm-bigin{height:48px;font-size:15px;border-radius:12px;border:2px solid var(--cm-b7)}
.cm .cm-review .cm-btn.sm{flex-shrink:0}
.cm .cm-review{flex-wrap:wrap}
/* the Resolved. Undo message: fixed, not a dialog */
.cm .cm-toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:60;background:var(--cm-b9);color:#fff;border-radius:12px;padding:10px 16px;display:none;align-items:center;gap:14px;font-size:13.5px;box-shadow:0 10px 30px rgba(14,54,59,.35);max-width:calc(100vw - 32px)}
.cm .cm-toast.show{display:flex}
.cm .cm-undo{border:0;background:var(--cm-y5);color:var(--cm-ink);font-weight:800;font-size:13px;border-radius:8px;height:30px;padding:0 14px;cursor:pointer}
@media (max-width:700px){
  .cm .cm-statustabs{width:calc(100% - 32px)}
  .cm .cm-statusbtn{flex:1}
  .cm .cm-proprow{flex-direction:column;align-items:stretch}
  .cm .cm-cleanrow{flex-wrap:wrap}
  .cm .cm-cleancard{flex:1 1 45%}
  .cm .cm-propbox{height:auto;min-height:48px;flex-wrap:wrap;padding:8px 14px}
}

/* session 217 layout corrections found in the 1440 proof: the pane scrolls as a whole (the property and clean block made the
   fixed-height pane squeeze the thread to nothing), the action row stays at the bottom, the clean cards wrap when the pane is narrow */
.cm .cm-pane{overflow-y:auto}
.cm .cm-thread{flex:0 0 auto;overflow:visible;min-height:120px}
.cm .cm-acts{position:sticky;bottom:0;background:#fff;z-index:2;margin-top:auto}
.cm .cm-cleanrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
.cm .cm-cleancard.other{flex:none}
.cm .cm-propbox{height:auto;min-height:48px;flex-wrap:wrap;gap:2px 10px;padding:6px 14px}
.cm .cm-propbox .pn{max-width:none;white-space:normal}
.cm .cm-propbox .pr{white-space:normal}
.cm .cm-proprow .cm-btn.big{align-self:stretch;height:auto;min-height:48px}

/* Session 247, Part 7: complaints grouped by clean. */
.cm-grp{border:1px solid #e3d6d4;background:#fdf6f5;border-radius:10px;padding:10px 12px;margin:10px 0;display:flex;flex-direction:column;gap:6px}
.cm-grptop{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.cm-grptop .lab{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:#8a2a1e}
.cm-gmem{font-size:12px;color:#6b747b}
.cm-reopen{background:#fde4e0;color:#b3261e}
.cm-grpbtns{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.cm-mopts{display:flex;flex-direction:column;gap:6px;max-height:260px;overflow:auto}
.cm-mopt{text-align:left;border:1px solid #dfe3e6;background:#fff;border-radius:8px;padding:8px 10px;cursor:pointer;font:inherit;font-size:12.5px;min-width:0;overflow-wrap:anywhere}
.cm-mopt span{display:block;color:#6b747b;margin-top:2px}
.cm-mopt:hover{border-color:#1d6e77}
.cm-dups{margin:8px 12px;border:1px solid #f3df9a;background:#fff6da;border-radius:10px;font-size:12.5px}
.cm-dups summary{padding:8px 12px;font-weight:700;cursor:pointer;color:#5a3a00}
.cm-dupg{border-top:1px solid #f3df9a;padding:8px 12px;display:flex;flex-direction:column;gap:4px;min-width:0}
.cm-dupc{display:block;color:#16181a;text-decoration:none;overflow-wrap:anywhere;font-size:12px}
.cm-dupc:hover{text-decoration:underline}
.cm-dupg .row{display:flex;gap:6px;flex-wrap:wrap;margin-top:4px}
/* Session 249, Part 6: the duplicate list shows each complaint side by side */
.cm-dupintro{padding:0 12px 8px;color:#5a3a00;font-size:12.5px}
.cm-dupcols{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px;min-width:0}
.cm-dupcol{background:#fff;border:1px solid #f3df9a;border-radius:8px;padding:8px 10px;min-width:0;display:flex;flex-direction:column;gap:5px}
.cm-dupf{display:flex;flex-wrap:wrap;gap:4px 10px;font-size:11.5px;color:#4d545a}
.cm-dupf .cm-sev{font-weight:700;border-radius:999px;padding:1px 8px;background:#e9ecee;color:#4d545a}
.cm-dupf .cm-sev.l3{background:#fde4e0;color:#b1321f} .cm-dupf .cm-sev.l2{background:#fff0c2;color:#6b5200} .cm-dupf .cm-sev.l1{background:#e3f4ee;color:#1f6b53}
.cm-dupm p{margin:0 0 4px;font-size:12px;color:#16181a;overflow-wrap:anywhere} .cm-dupm p span{display:block;font-size:11px;color:#6b747b}
.cm-dupm em{color:#6b747b;font-style:normal}

/* ============================================================
   Session 250: topic and severity controls, Group by client, select and merge, the tag panel.
   Values taken from briefs/comms-controls-v2.html's own stylesheet.
   ============================================================ */
/* the reading pane's bar, always visible at the top while the message scrolls */
.cm .cm-ctl{position:sticky;top:0;z-index:5;background:#F6F8F9;border-bottom:1px solid #DCE1E5;padding:14px 18px;display:flex;flex-direction:column;gap:12px;flex-shrink:0}
.cm .cm-ctlline{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-width:0}
.cm .cm-ctl .lbl{font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#7A828A;width:78px;flex:none}
.cm .cm-chips{display:flex;gap:6px;flex-wrap:wrap;min-width:0;flex:1 1 0}
.cm .cm-chip{border:1.5px solid #DCE1E5;background:#fff;border-radius:999px;padding:6px 12px;font:600 13px var(--cm-sans);color:#4A4F55;cursor:pointer;display:flex;align-items:center;gap:6px;transition:all .12s;white-space:nowrap}
.cm .cm-chip i{width:9px;height:9px;border-radius:50%;flex:none}
.cm .cm-chip:hover{border-color:#1D6E77;transform:translateY(-1px)}
.cm .cm-chip.on{background:#1D6E77;border-color:#1D6E77;color:#fff}
.cm .cm-chip kbd{font:600 10px var(--cm-sans);color:#7A828A;border:1px solid #DCE1E5;border-radius:4px;padding:0 4px;background:#fff}
.cm .cm-chip.on kbd{color:#1D6E77}
.cm .cm-sevseg{display:flex;border:1.5px solid #DCE1E5;border-radius:12px;overflow:hidden;background:#fff;min-width:0}
.cm .cm-sevseg button{border:0;background:none;padding:8px 16px;font:700 13px var(--cm-sans);cursor:pointer;display:flex;flex-direction:column;align-items:center;line-height:1.2;color:#4A4F55;border-right:1px solid #DCE1E5;transition:background .12s}
.cm .cm-sevseg button:last-child{border-right:0}
.cm .cm-sevseg button small{font-size:10.5px;font-weight:600;color:#7A828A}
.cm .cm-sevseg button:hover{background:#EDEFF1}
.cm .cm-sevseg .s1.on{background:#E3F4EA;color:#1E6B3A} .cm .cm-sevseg .s2.on{background:#FFF6DA;color:#6B5200} .cm .cm-sevseg .s3.on{background:#FDE4E0;color:#C43D2B}
.cm .cm-sevseg.off{opacity:.35;pointer-events:none}
.cm .cm-hint2{font-size:12px;color:#7A828A}
.cm .cm-sevflag{display:inline-block;font-size:11.5px;font-weight:700;color:#8A4B00;background:#FFF1DC;border:1px solid #F0C98A;border-radius:10px;padding:2px 8px;white-space:nowrap} /* session 252 */
.cm .cm-sevflag.sm{padding:0;width:20px;height:20px;line-height:18px;text-align:center;border-radius:50%;align-self:center}

/* the list header's toggle and the client headers */
.cm .cm-lh{flex-wrap:wrap}
.cm .cm-tog{display:flex;align-items:center;gap:6px;font:600 12.5px var(--cm-sans);cursor:pointer;margin-left:auto;color:#4A4F55;white-space:nowrap}
.cm .cm-tog input{accent-color:#1D6E77;width:16px;height:16px;margin:0}
.cm .cm-gh{display:flex;align-items:center;gap:8px;padding:9px 16px;background:#FAFBFB;border-bottom:1px solid #DCE1E5;font-weight:700;color:#1A2A2D;font-size:13px;min-width:0}
.cm .cm-gh .nm{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cm .cm-gh .n{background:#EDEFF1;border-radius:999px;padding:1px 8px;font-size:11.5px;flex:none}
.cm .cm-ghsel{margin-left:auto;border:0;background:none;font:600 12px var(--cm-sans);color:#1D6E77;cursor:pointer;padding:2px 0;flex:none}
.cm .cm-ghsel:hover{text-decoration:underline}

/* the dark bulk bar */
.cm .cm-bulk.dark{background:#0E363B;color:#fff;border-bottom-color:#0E363B}
.cm .cm-bulk.dark .cm-bt,.cm .cm-bulk.dark .cm-bt b{color:#fff}
.cm .cm-bk{border:0;border-radius:8px;padding:6px 12px;font:700 12.5px var(--cm-sans);cursor:pointer}
.cm .cm-bk.mg{background:#FFD13A;color:#0A3F45}
.cm .cm-bk.mg:disabled{opacity:.4;cursor:default}
.cm .cm-bk.cl{background:rgba(255,255,255,.14);color:#fff}
.cm .cm-bksel{height:30px;border-radius:8px;border:0;background:rgba(255,255,255,.14);color:#fff;font:700 12.5px var(--cm-sans);padding:0 8px;cursor:pointer;max-width:100%}
.cm .cm-bksel option{color:#16181a;background:#fff}
.cm .cm-bksev{display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:600}
.cm .cm-bksev span{margin-right:2px}
.cm .cm-bksev .cm-bk{padding:5px 9px;background:rgba(255,255,255,.14);color:#fff}
.cm .cm-bksev .cm-bk.n1:hover{background:#E3F4EA;color:#1E6B3A} .cm .cm-bksev .cm-bk.n2:hover{background:#FFF6DA;color:#6B5200} .cm .cm-bksev .cm-bk.n3:hover{background:#FDE4E0;color:#C43D2B}
.cm .cm-bulk.dark .cm-btn{background:rgba(255,255,255,.14);color:#fff;border-color:transparent}
.cm .cm-bulk.dark .cm-btn:hover{background:rgba(255,255,255,.24)}

/* each row's compact controls */
.cm .cm-item{flex-wrap:wrap}
.cm .cm-item:hover{box-shadow:inset 3px 0 0 #FFD13A}
.cm .cm-rowctl{flex-basis:100%;display:flex;gap:6px;align-items:center;flex-wrap:wrap;padding-left:28px;min-width:0}
.cm .cm-rsel{border:1.5px solid #DCE1E5;border-radius:8px;padding:5px 8px;font:600 12px var(--cm-sans);background:#fff;cursor:pointer;color:#4A4F55;max-width:100%}
.cm .cm-rsel:hover{border-color:#1D6E77}
.cm .cm-dot3{display:flex;gap:3px}
.cm .cm-dot3 button{width:30px;height:28px;border:1.5px solid #DCE1E5;background:#fff;border-radius:7px;font:800 12px var(--cm-sans);cursor:pointer;color:#4A4F55;padding:0}
.cm .cm-dot3 button:hover{border-color:#1D6E77}
.cm .cm-dot3 button:disabled{opacity:.35;cursor:default;border-color:#DCE1E5}
.cm .cm-dot3 .on1{background:#E3F4EA;border-color:#9BD3B0;color:#1E6B3A} .cm .cm-dot3 .on2{background:#FFF6DA;border-color:#F3DF9A;color:#6B5200} .cm .cm-dot3 .on3{background:#FDE4E0;border-color:#F2A99E;color:#C43D2B}
.cm .cm-rowctl .cm-rowact{position:static;display:none;margin-left:auto;background:none;padding:0}
.cm .cm-item:hover .cm-rowctl .cm-rowact,.cm .cm-item:focus-within .cm-rowctl .cm-rowact{display:flex}
@media (hover:none){ .cm .cm-rowctl .cm-rowact{display:flex} }

/* the tag panel under a row: three fields side by side, stacked on a phone */
.cm .cm-item.tagging{background:#FAFBFB}
.cm .cm-tagp{flex-basis:100%;background:#F6F8F9;border:1px solid #DCE1E5;border-radius:10px;padding:12px;display:grid;gap:10px;grid-template-columns:repeat(3,minmax(0,1fr));min-width:0;cursor:default}
.cm .cm-tagp .fld{min-width:0;position:relative}
.cm .cm-tagp label{display:block;font-size:11px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:#7A828A;margin-bottom:4px}
.cm .cm-tagp input,.cm .cm-tagp select{width:100%;border:1.5px solid #DCE1E5;border-radius:8px;padding:7px 9px;font:500 13px var(--cm-sans);background:#fff;color:#16181a;min-width:0}
.cm .cm-tagp input:focus,.cm .cm-tagp select:focus{outline:none;border-color:#1D6E77}
.cm .cm-tagp input:disabled,.cm .cm-tagp select:disabled{background:#EDEFF1;color:#7A828A}
.cm .cm-tagp small{display:block;font-size:11px;color:#7A828A;margin-top:3px;overflow-wrap:anywhere}
.cm .cm-tgres{position:relative}
.cm .cm-tgres .opts{position:absolute;left:0;right:0;top:2px;z-index:9;background:#fff;border:1px solid #DCE1E5;border-radius:8px;box-shadow:0 8px 22px rgba(14,54,59,.16);max-height:220px;overflow:auto;display:flex;flex-direction:column}
.cm .cm-tgres .opts button{border:0;background:#fff;text-align:left;padding:7px 10px;font:500 13px var(--cm-sans);cursor:pointer;color:#16181a;border-bottom:1px solid #EDEFF1;overflow-wrap:anywhere}
.cm .cm-tgres .opts button:hover{background:#dceff0}
.cm .cm-tgres .opts button span{display:block;font-size:11px;color:#7A828A}
.cm .cm-tgres .none{padding:7px 10px;font-size:12px;color:#7A828A}
@media (max-width:760px){ .cm .cm-tagp{grid-template-columns:minmax(0,1fr)} .cm .cm-rowctl{padding-left:0} }
@media (max-width:600px){ .cm .cm-ctl{padding:12px 14px} .cm .cm-ctl .lbl{width:100%} .cm .cm-sevseg button{padding:7px 10px} }
/* session 250 layout fixes from the first 1440 look: a row's link takes the room left of the checkbox (never wraps under it);
   the row's topic box keeps its own width; in a narrow reading pane the labels sit inline so the bar stays short */
.cm .cm-itemlink{flex:1 1 0}
.cm .cm-rsel{width:auto;flex:0 1 auto}
.cm .cm-pane{container-type:inline-size}
@container (max-width:760px){
  .cm .cm-ctl{padding:12px 16px;gap:10px}
  .cm .cm-ctl .lbl{width:auto;margin-right:2px}
  .cm .cm-chips{flex:1 1 auto;gap:5px}
  .cm .cm-chip{padding:5px 10px;font-size:12.5px}
  .cm .cm-sevseg button{padding:7px 12px}
}
.cm .cm-bksel{width:auto}
.cm .cm-tagp input,.cm .cm-tagp select{font-size:12.5px;padding:7px 8px}
.cm-gmlist{display:flex;flex-wrap:wrap;gap:6px}
.cm-gm{display:inline-flex;align-items:center;gap:6px;background:#fff;border:1px solid #e3d6d4;border-radius:8px;padding:3px 4px 3px 8px;font-size:12px;color:#4d545a}

/* Session 251, Part 1: naming WhatsApp senders. The rail entry, the queue rows, the inline panel. */
.cm .cm-wrail-h{padding:6px 12px 2px;font-size:11.5px;font-weight:700;color:var(--cm-muted);text-transform:uppercase;letter-spacing:.04em}
.cm .cm-wrail{display:flex;align-items:center;gap:8px;padding:6px 8px 6px 12px;border-radius:10px}
.cm .cm-wrail.on{background:var(--cm-b1);box-shadow:inset 3px 0 0 var(--cm-b7)}
.cm .cm-wrail .cm-nm{flex:1 1 auto;min-width:0;font-size:13px;font-weight:600;color:var(--cm-ink)}
.cm .cm-wrail .ct{font-size:14px;font-weight:800;color:#1f9d55;min-width:18px;text-align:right}
.cm .cm-wrail-none{padding:8px 12px;font-size:12.5px;color:var(--cm-muted)}
.cm .cm-was{padding:12px 16px;border-bottom:1px solid var(--cm-line);display:flex;flex-direction:column;gap:5px;min-width:0}
.cm .cm-was.likely{background:#f6fbf8}
.cm .cm-was-top{display:flex;align-items:center;gap:8px;justify-content:space-between;flex-wrap:wrap}
.cm .cm-was-n{font-size:13.5px;font-weight:700;color:var(--cm-ink)}
.cm .cm-was-staff{display:inline-block;align-self:flex-start;font-size:12px;font-weight:700;color:#0e5a3a;background:#e2f4ee;border-radius:999px;padding:2px 10px}
.cm .cm-was-l,.cm .cm-was-last{font-size:12.5px;color:var(--cm-text);line-height:1.4;overflow-wrap:anywhere}
.cm .cm-meta .cm-btn.cm-waname{margin-left:6px;vertical-align:middle}
.cm .cm-walink{margin-left:6px;border:0;background:none;padding:0;font:inherit;font-size:11.5px;color:var(--cm-b5);text-decoration:underline;cursor:pointer}
.cm .cm-wap-host{align-self:stretch;min-width:0}
.cm .cm-wap{margin-top:6px;border:1px solid var(--cm-line-strong);border-radius:12px;background:#fff;padding:12px 14px;display:flex;flex-direction:column;gap:8px;font-size:13px;color:var(--cm-ink);min-width:0;max-width:100%;box-sizing:border-box}
.cm .cm-wap-h{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.cm .cm-wap-h .cm-meta{flex:1 1 auto}
.cm .cm-wap-x{border:0;background:none;font-size:20px;line-height:1;color:var(--cm-muted);cursor:pointer;padding:0 4px}
.cm .cm-wap-sec{display:flex;flex-direction:column;gap:3px;font-size:12.5px;color:var(--cm-text);overflow-wrap:anywhere}
.cm .cm-wap-lab{font-size:11.5px;font-weight:700;color:var(--cm-muted);text-transform:uppercase;letter-spacing:.04em;margin-top:2px}
.cm .cm-wap-msg{font-size:12.5px;color:var(--cm-ink);line-height:1.4}
.cm .cm-wap-tabs{display:flex;gap:6px;flex-wrap:wrap}
.cm .cm-wap-tab{height:32px;padding:0 12px;border-radius:999px;border:1px solid var(--cm-line-strong);background:#fff;color:var(--cm-text);font-size:12.5px;font-weight:600;cursor:pointer}
.cm .cm-wap-tab.on{background:var(--cm-b7);border-color:var(--cm-b7);color:#fff;font-weight:700}
.cm .cm-wap-picks{display:flex;gap:6px;flex-wrap:wrap}
.cm .cm-wap-picks .cm-btn.on{background:var(--cm-b1);border-color:var(--cm-b7);color:var(--cm-b7)}
.cm .cm-wap-in{height:34px;border:1px solid var(--cm-line-strong);border-radius:8px;padding:0 10px;font-size:13px;width:100%;max-width:320px;box-sizing:border-box;font-family:inherit}
.cm .cm-wap-res{display:flex;flex-direction:column;gap:4px}
.cm .cm-wap-opt{text-align:left;border:1px solid var(--cm-line);border-radius:8px;background:#fff;padding:7px 10px;font-size:13px;cursor:pointer;font-family:inherit;color:var(--cm-ink)}
.cm .cm-wap-opt:hover{background:var(--cm-b1)}
.cm .cm-wap-picked{font-size:12.5px;color:var(--cm-ink)}
.cm .cm-wap-warn{font-size:12.5px;color:#7a3b00;background:#fff4e2;border-radius:8px;padding:6px 10px}
.cm .cm-wap-acts{display:flex;gap:8px}
.cm .cm-wap-msgline{font-size:12.5px;color:var(--cm-muted);min-height:16px}
.cm .cm-wap-msgline.err{color:var(--cm-red)}
@media (max-width:1100px){ .cm .cm-wrail{flex:1 1 100%} .cm .cm-wrail-h{flex:1 1 100%} }
.cm .cm-wap-ul{margin:6px 0 0 18px;padding:0} .cm .cm-wap-ul li{margin:2px 0;overflow-wrap:anywhere} /* session 252 */
/* Session 284: "Sure" / "Not sure" beside a row's suggested topic (Jev's own confidence against the bar on Settings) */
.cm .cm-sure{display:inline-flex;align-items:center;font:600 11px var(--cm-sans);color:#1d6e77;background:#e3f1f2;border-radius:999px;padding:2px 8px;white-space:nowrap;flex:0 0 auto}
.cm .cm-sure.no{color:#3f474e;background:#e9ecee}
/* Session 285: a Job applicant row's link to the Candidates page, on its own line under the row (the row wraps) */
.cm .cm-candl{flex-basis:100%;padding-left:76px;font-size:12px;min-width:0}
.cm .cm-candl a{color:#244a7e;text-decoration:underline}
@media (max-width:760px){ .cm .cm-candl{padding-left:28px} }

/* Session 286, Part 1: the click rule. A row or pane being resolved fades at once; a topic the server refuses is greyed out
   (its click says why, no request). */
.cm .cm-going{ opacity: .45; transition: opacity .12s; pointer-events: none; }
.cm .cm-chip.refused{ opacity: .45; cursor: not-allowed; }

/* ============================================================
   Session 286, Part 2: the page rebuilt to the approved mockup. The values below are the stylesheet of
   briefs/s286-mockup-comms-complaints-1440.html and briefs/s286-mockup-comms-solicitation-1440.html (their <style> block and
   their inline styles), value for value, with every class named cmx-* and scoped under .cm .cmx so nothing here touches the
   rest of the hub. One page, one scroll bar: no rule here gives anything its own scroll.
   ============================================================ */
.cm .cmx{display:flex;flex-direction:column;gap:20px;font-family:Inter,system-ui,sans-serif;color:#16181a}
.cm .cmx a{color:#1d6e77;text-decoration:none}
.cm .cmx a:hover{color:#144d54;text-decoration:underline}
.cm .cmx-top{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px}
.cm .cmx-h1{margin:0;font-size:34px;font-weight:800;letter-spacing:-0.5px;color:#16181a;line-height:1.15}
.cm .cmx-sortline{font-size:14px;color:#6b747b;margin-top:4px}
.cm .cmx-seg{display:inline-flex;background:#e9ecee;border-radius:10px;padding:3px;flex-wrap:wrap}
.cm .cmx-seg button{height:36px;padding:0 14px;border:0;background:transparent;border-radius:8px;font-family:inherit;font-size:13.5px;font-weight:600;color:#4d545a;cursor:pointer}
.cm .cmx-seg button.on{background:#144d54;color:#ffffff}
.cm .cmx-chip{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 12px;border-radius:999px;font-size:13px;font-weight:600;background:#ffffff;color:#16181a;border:1px solid #c9d0d4;cursor:pointer;font-family:inherit;white-space:nowrap;text-decoration:none}
.cm .cmx-chip.sm{height:26px;padding:0 10px;font-size:12.5px}
.cm .cmx-chip.on,.cm .cmx-chip.tp.on{background:#144d54;color:#ffffff;border-color:#144d54}
.cm .cmx-chip.refused{opacity:.45;cursor:not-allowed}
.cm .cmx-dot{width:9px;height:9px;border-radius:50%;display:inline-block;flex:none}
/* the dark panel */
.cm .cmx-panel{background:linear-gradient(135deg,#144d54,#0e363b);border-radius:18px;color:#ffffff;padding:20px 24px;display:flex;flex-wrap:wrap;gap:28px 40px;align-items:center}
.cm .cmx-hero{display:flex;align-items:baseline;gap:12px}
.cm .cmx-big{font-size:52px;font-weight:800;letter-spacing:-1.5px;line-height:1}
.cm .cmx-herot{font-size:15px;font-weight:700}
.cm .cmx-heros{font-size:13px;color:#6fd5d4}
.cm .cmx-stats{display:flex;flex-wrap:wrap;gap:32px}
.cm .cmx-statn{font-size:28px;font-weight:800}
.cm .cmx-statn.gold{color:#ffd13a}
.cm .cmx-statl{font-size:12.5px;font-weight:600;opacity:.85}
.cm .cmx-chans{margin-left:auto;display:flex;flex-wrap:wrap;gap:8px}
.cm .cmx-chip.ch{background:#ffffff;border:0}
.cm .cmx-chip.ch.off{background:transparent;color:#ffffff;border:1px solid rgba(255,255,255,.5)}
.cm .cmx-chip.ch.off .cmx-dot{opacity:.5}
.cm .cmx-chip.ch.gone{opacity:.5;cursor:not-allowed}
/* the topic tabs: the chosen one changes colour only, so nothing moves */
.cm .cmx-tabs{display:flex;flex-wrap:wrap;gap:8px}
.cm .cmx .cmx-tab{display:inline-flex;align-items:center;gap:10px;height:44px;padding:0 16px;border-radius:10px;font-size:14.5px;font-weight:650;background:#ffffff;color:#16181a;border:1px solid #dfe3e6;cursor:pointer;font-family:inherit;white-space:nowrap;box-sizing:border-box;text-decoration:none}
.cm .cmx .cmx-tab:hover{text-decoration:none;color:#16181a}
.cm .cmx-tab .n{font-weight:800;font-size:15px;color:#16181a}
.cm .cmx .cmx-tab.on,.cm .cmx .cmx-tab.on:hover{background:#144d54;color:#ffffff;border-color:#144d54}
.cm .cmx-tab.on .n{color:#ffd13a}
.cm .cmx-more{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;font-size:13.5px;color:#6b747b;margin-top:-8px}
.cm .cmx-more .lab{font-weight:600}
.cm .cmx .cmx-mlink{font-weight:600}
.cm .cmx .cmx-mlink.on{color:#144d54;text-decoration:underline}
.cm .cmx-wa{display:contents}
/* the box and the list */
.cm .cmx-box{background:#ffffff;border-radius:14px;padding:18px;box-shadow:0 1px 2px rgba(16,24,26,.06),0 2px 8px rgba(16,24,26,.05);min-width:0}
.cm .cmx-listbox{padding:0;overflow:clip;container-type:inline-size;container-name:cmxlist}
.cm .cmx-listbox.cmx-loading{opacity:.55;transition:opacity .12s}
.cm .cmx-lhead{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;padding:16px 20px}
.cm .cmx-ltitle{font-size:19px;font-weight:800}
.cm .cmx-lsub{font-size:13px;color:#6b747b;margin-top:2px}
.cm .cmx-filters{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.cm .cmx-grp{display:inline-flex;gap:8px;align-items:center;font-size:13.5px;font-weight:600;color:#4d545a;cursor:pointer}
.cm .cmx-cbx{width:20px;height:20px;accent-color:#144d54;margin:2px 0 0;cursor:pointer}
.cm .cmx-hdr{display:grid;grid-template-columns:44px minmax(180px,1.1fr) minmax(200px,1.2fr) minmax(280px,2.6fr) 150px 84px;gap:16px;padding:12px 20px;background:#e9ecee;font-size:12.5px;font-weight:600;color:#4d545a}
.cm .cmx-hdr .rt{text-align:right}
.cm .cmx-row{display:grid;grid-template-columns:44px minmax(180px,1.1fr) minmax(200px,1.2fr) minmax(280px,2.6fr) 150px 84px;gap:16px;align-items:start;padding:16px 20px;border-top:1px solid #dfe3e6;cursor:pointer}
.cm .cmx-row:hover{background:#e9ecee}
.cm .cmx-row.sel{background:#dceff0}
.cm .cmx-row.open{background:#dceff0;border-top:1px solid #6fd5d4}
.cm .cmx-row.ghost{opacity:.8}
.cm .cmx-nm{font-size:15px;font-weight:700;color:#16181a;line-height:1.3;overflow-wrap:anywhere}
.cm .cmx-sub{font-size:13px;color:#6b747b;line-height:1.4;margin-top:3px;overflow-wrap:anywhere}
.cm .cmx-prop{font-size:14px;font-weight:600;color:#16181a;line-height:1.35;overflow-wrap:anywhere}
.cm .cmx-prop.none{color:#6b747b}
.cm .cmx-prop.big{font-size:15px}
.cm .cmx-sugg{font-size:12px;font-weight:500;color:#6b747b}
.cm .cmx-sum{font-size:14.5px;color:#4d545a;line-height:1.5;overflow-wrap:anywhere}
.cm .cmx-closedl{font-size:13px;color:#08513f;line-height:1.45;margin-top:6px}
.cm .cmx-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.cm .cmx-lvl{display:inline-flex;align-items:center;height:26px;padding:0 10px;border-radius:999px;font-size:12.5px;font-weight:700}
.cm .cmx-sure{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:999px;font-size:11.5px;font-weight:700;margin-top:6px}
.cm .cmx-sure.yes{background:#e2f4ee;color:#08513f}
.cm .cmx-sure.no{background:#fdf0d8;color:#7a5312}
.cm .cmx-age{font-size:14px;font-weight:700;color:#16181a;text-align:right}
.cm .cmx-gh{display:flex;align-items:center;gap:10px;padding:10px 20px;border-top:1px solid #dfe3e6;background:#f2f4f5;font-size:13.5px;font-weight:700;color:#16181a}
.cm .cmx-gh .n{font-weight:600;color:#6b747b}
.cm .cmx-note{padding:16px 20px;font-size:14px;color:#6b747b}
.cm .cmx-note.err{color:#b3261e}
.cm .cmx-dups{padding:0 20px 12px}
.cm .cmx-dups:empty{display:none}
.cm .cmx-foot{padding:16px 20px;border-top:1px solid #dfe3e6;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px}
.cm .cmx-showing{font-size:13.5px;color:#6b747b}
/* buttons */
.cm .cmx .cmx-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 18px;border-radius:10px;font-size:14.5px;font-weight:700;border:1px solid #c9d0d4;background:#ffffff;color:#16181a;cursor:pointer;font-family:inherit;text-decoration:none;box-sizing:border-box}
.cm .cmx .cmx-btn:hover{text-decoration:none;color:#16181a}
.cm .cmx .cmx-btn.y{background:linear-gradient(#ffd13a,#f5c21c);border-color:#f5c21c;box-shadow:0 3px 0 #d96a18}
.cm .cmx .cmx-btn.gl{background:transparent;color:#ffffff;border-color:rgba(255,255,255,.5)}
.cm .cmx .cmx-btn.busy{opacity:.6}
/* the open item, in place under its row */
.cm .cmx-work{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(320px,1fr);gap:20px;padding:4px 20px 22px 80px;background:#dceff0}
.cm .cmx-side{display:flex;flex-direction:column;gap:16px;min-width:0}
.cm .cmx-convh{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:8px}
.cm .cmx-convt{font-size:16px;font-weight:800}
.cm .cmx-msg{display:grid;grid-template-columns:120px 1fr;gap:16px;padding:14px 0;border-top:1px solid #dfe3e6}
.cm .cmx-who{font-size:13px;font-weight:700;color:#16181a;overflow-wrap:anywhere}
.cm .cmx-when{font-size:12.5px;color:#6b747b;margin-top:2px}
.cm .cmx-txt{font-size:15px;color:#16181a;line-height:1.55;white-space:pre-wrap;overflow-wrap:anywhere}
.cm .cmx-mutedtxt{color:#4d545a}
.cm .cmx-en{font-size:13.5px;color:#4d545a;line-height:1.5;margin-top:4px}
.cm .cmx-media{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.cm .cmx-media img{max-width:220px;max-height:220px;border-radius:8px;display:block}
.cm .cmx .cmx-earlier{height:36px;margin:6px 0 2px}
.cm .cmx-jev{margin-top:12px;background:#e9ecee;border-radius:10px;padding:12px 14px;font-size:13.5px;color:#4d545a;line-height:1.5}
.cm .cmx-jev b{color:#16181a}
.cm .cmx-k{font-size:12.5px;font-weight:600;color:#4d545a;margin-bottom:8px}
.cm .cmx-k.mt{margin-top:16px}
.cm .cmx-chips{display:flex;flex-wrap:wrap;gap:6px}
.cm .cmx-hint{font-size:12.5px;color:#6b747b;line-height:1.45;margin-top:8px}
.cm .cmx-why{display:block;margin-top:2px}
.cm .cmx-lvlseg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.cm .cmx-lvlseg.off{opacity:.5}
.cm .cmx .cmx-lv{height:52px;flex-direction:column;gap:0;font-size:13.5px;padding:0 6px}
.cm .cmx-lv span{font-size:11px;font-weight:500;color:#6b747b}
.cm .cmx .cmx-lv.on{color:#ffffff}
.cm .cmx .cmx-lv.on span{color:#ffffff}
.cm .cmx .cmx-lv.l1.on{background:#4d545a;border-color:#4d545a}
.cm .cmx .cmx-lv.l2.on{background:#9a4a0e;border-color:#9a4a0e}
.cm .cmx .cmx-lv.l3.on{background:#c43d2b;border-color:#c43d2b}
.cm .cmx-fr{display:flex;justify-content:space-between;gap:12px;align-items:start}
.cm .cmx-clean{font-size:15px;font-weight:700}
.cm .cmx-alts{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.cm .cmx-acts{grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.cm .cmx-nav{margin-left:auto;display:flex;gap:10px}
.cm .cmx-banner{grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:10px;align-items:center;background:#ffffff;border-radius:10px;padding:10px 14px;font-size:13.5px;color:#4d545a}
.cm .cmx-banner.done{background:#e2f4ee;color:#08513f}
.cm .cmx-banner .t{flex:1 1 260px}
.cm .cmx-gm{display:inline-flex;gap:6px;align-items:center}
.cm .cmx-form{grid-column:1 / -1}
.cm .cmx-form:empty{display:none}
.cm .cmx .cm-mopts,.cm .cmx .cm-opts{max-height:none;overflow:visible}
.cm .cmx-legacy:empty{display:none}
/* the bulk bar: sticks below the hub's fixed header while the page scrolls; nothing scrolls inside it */
.cm .cmx-bulk{position:sticky;top:calc(var(--hdrH, 74px) + var(--bandH, 7px));z-index:2;background:#144d54;color:#ffffff;padding:14px 20px}
.cm .cmx-bulk[hidden]{display:none}
.cm .cmx-bulkrow{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.cm .cmx-bulkn{font-size:16px;font-weight:800}
.cm .cmx-bulkundo{margin-left:auto;font-size:13px;color:#6fd5d4}
.cm .cmx-move{display:flex;flex-wrap:wrap;gap:6px;padding-top:10px}
.cm .cmx .cm-going{opacity:.45;transition:opacity .12s;pointer-events:none}
/* narrower than the list's six columns need (a laptop with the menu open): the phone layout, so nothing goes past the edge */
@container cmxlist (max-width: 1060px){
  .cmx-hdr{display:none}
  .cmx-row{grid-template-columns:32px 1fr;gap:8px 12px}
  .cmx-row > *:nth-child(n+3){grid-column:2}
  .cmx-age{text-align:left}
  .cmx-work{grid-template-columns:1fr !important;padding:4px 16px 18px 16px}
}
@media (max-width:900px){
  .cm .cmx-hdr{display:none}
  .cm .cmx-row{grid-template-columns:32px 1fr;gap:8px 12px}
  .cm .cmx-row > *:nth-child(n+3){grid-column:2}
  .cm .cmx-age{text-align:left}
  .cm .cmx-work{grid-template-columns:1fr !important;padding:4px 12px 16px 12px}
  .cm .cmx-msg{grid-template-columns:1fr;gap:4px}
  .cm .cmx-chans{margin-left:0}
  .cm .cmx-nav{margin-left:0}
  .cm .cmx-h1{font-size:28px}
}
.cm .cmx-banner{text-transform:none;letter-spacing:normal}

/* Session 287: an open item whose topic was changed away from this tab says where it went, and stays open where it is */
.cm .cmx-moved{margin-top:10px;background:#ffe8d6;color:#7a3a0a;border-radius:8px;padding:8px 12px;font-size:14px;font-weight:600;line-height:1.4}