/* 邮件标签靠右 (mail_tags.js): the tags of a mail row in a right-hand column, fixed slots so the same kind of tag
   lines up from row to row — type, 单号, status — then the rest. Under 1100px they drop below the subject. */
li.mail .mbody{flex:1 1 auto}
.mail-tags{flex:none;display:grid;grid-template-columns:190px 140px 100px;align-items:center;column-gap:8px;row-gap:4px;margin-top:1px;cursor:pointer}
.mt-slot{display:flex;align-items:center;gap:4px;min-width:0}
/* The rest goes on a line of its own under the three slots: whole chips that wrap, never squeezed into a column. */
.mt-extra{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:4px;justify-content:flex-start;min-width:0;max-width:446px}
.mt-extra:empty{display:none}
.mt-extra>*{flex:none;max-width:100%;white-space:nowrap}
.mt-extra .tag{margin-left:0}
.mail-tags button{font:inherit;cursor:pointer}
.mt-type{display:inline-flex;align-items:center;gap:5px;max-width:100%;padding:2px 8px;border:1px solid transparent;border-radius:999px;font-size:11px!important;line-height:1.5;text-align:left;box-shadow:none}
.mt-type span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mt-type em{flex:none;font-style:normal;font-weight:700;font-size:10px;opacity:.9}
.mt-type em.suggest{font-weight:600;opacity:.75}
.mt-type em.party{max-width:96px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-right:4px;border-right:1px solid currentColor}
.mail-party-pending{font-size:12.5px;padding:5px 10px;border:1px dashed var(--acc,#4dbdd3);border-radius:8px;background:transparent;color:inherit;cursor:pointer}
.mail-party-pending b{margin-left:2px;padding:0 6px;border-radius:8px;background:var(--acc,#4dbdd3);color:#fff;font-size:11px}
.mail-pending{width:min(900px,96vw);max-height:90vh;display:flex;flex-direction:column}
.mail-pending h2 small{font-size:13px;color:var(--dim);font-weight:400}
.mail-pending-outlook{display:flex;align-items:center;gap:6px;margin:4px 0 8px;font-size:12.5px}
.mail-pending-outlook input{width:auto}
.mail-pending-list{list-style:none;margin:0;padding:0;overflow:auto;flex:1;min-height:0;display:grid;gap:6px}
.mail-pending-list li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 10px;align-items:center;padding:8px 10px;border:1px solid var(--line);border-radius:10px}
.mail-pending-list li.done{opacity:.6}
.mail-pending-main{display:grid;gap:2px;min-width:0}
.mail-pending-main input{font:inherit;font-weight:600;padding:4px 8px;border:1px solid var(--line);border-radius:6px;background:transparent;color:inherit}
.mail-pending-main small{color:var(--dim);font-size:11.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mail-pending-actions{display:flex;gap:4px;flex-wrap:wrap}
.mail-pending-actions button{font-size:12px;padding:4px 10px}
.mail-pending-actions select{font-size:12px;padding:3px 6px;max-width:130px}
.mail-pending-note{grid-column:1/-1;font-size:12px}
.mail-pending-empty{justify-content:center;color:var(--dim)}
.mt-type em.unknown{display:inline-grid;place-items:center;width:14px;height:14px;border-radius:50%;background:#0000002e;font-size:9px}
.mt-type.scm{background:#103f4d;color:#7ee5f3;border-color:#246779}
.mt-type.trading{background:#463719;color:#ffd37a;border-color:#695526}
.mt-type.bank{background:#492433;color:#ff9bb8;border-color:#73374f}
.mt-type.government{background:#302b55;color:#b9b0ff;border-color:#504985}
.mt-type.event{background:#193b39;color:#88e4cf;border-color:#2d625e}
.mt-type.other{background:#293644;color:#b6c5d2;border-color:#445565}
.mt-ref{display:inline-flex;align-items:center;gap:4px;max-width:100%;padding:2px 8px;border:1px solid var(--line);border-radius:6px;background:transparent;color:inherit;font-size:11px!important;font-variant-numeric:tabular-nums;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;box-shadow:none}
.mt-ref small{padding:0 5px;border-radius:8px;background:color-mix(in srgb,var(--acc,#4dbdd3) 22%,transparent);font-size:10px}
.mt-ref.on{border-color:var(--acc,#4dbdd3)}
.mt-more{font-size:10.5px;color:var(--dim)}
.mt-state{display:inline-block;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:700;white-space:nowrap}
.mt-state.await{background:#5a222a;color:#ff9a9f}
.mt-state.chase{background:#4a3612;color:#ffcf70}
.mt-state.them{background:#26384b;color:#b7c9db;font-weight:600}
html[data-theme="light"] .mt-type.scm{background:#e3f4f8;color:#0b5566;border-color:#a9d6e1}
html[data-theme="light"] .mt-type.trading{background:#fbf1dc;color:#7a5508;border-color:#e8cf95}
html[data-theme="light"] .mt-type.bank{background:#fbe5ec;color:#8a2346;border-color:#eab4c6}
html[data-theme="light"] .mt-type.government{background:#ebe9fb;color:#3f379a;border-color:#c6c1f0}
html[data-theme="light"] .mt-type.event{background:#e2f5f1;color:#1b6156;border-color:#a8dccf}
html[data-theme="light"] .mt-type.other{background:#eef1f5;color:#4a5a6b;border-color:#d1d9e2}
html[data-theme="light"] .mt-state.await{background:#fde6e7;color:#b42318}
html[data-theme="light"] .mt-state.chase{background:#fdf1d8;color:#8a5a00}
html[data-theme="light"] .mt-state.them{background:#eef1f5;color:#4a5a6b}
/* 客户 / 供应商 of the sender, over the Pasta card in the preview (mail_party.js). */
.mail-party{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:6px 0 2px}
.mail-party-chip{display:inline-flex;align-items:baseline;gap:6px;padding:4px 10px;border:1px solid var(--line);border-radius:999px;background:var(--surface1,transparent);color:inherit;font:inherit;font-size:12.5px;font-weight:600}
.mail-party-chip small{font-weight:400;color:var(--dim)}
button.mail-party-chip{cursor:pointer}
button.mail-party-chip:hover{border-color:var(--acc,#4dbdd3)}
.mail-party-chip.unknown{font-weight:400;color:var(--dim);border-style:dashed}
.mail-party-add{font-size:12px;padding:4px 10px}
.mail-party-form{width:min(560px,96vw)}
.mail-party-roles{display:flex;flex-wrap:wrap;gap:6px 16px;margin:4px 0 10px;padding:6px 10px;border:1px solid var(--line);border-radius:8px}
.mail-party-roles legend{padding:0 4px;font-size:12px;color:var(--dim)}
.mail-party-roles label{display:inline-flex;align-items:center;gap:5px}
.mail-party-status{margin:6px 0 0;padding:6px 10px;border-radius:8px;background:var(--surface2);font-size:12.5px}
@media(max-width:1100px){li.mail{flex-wrap:wrap}.mail-tags{order:3;flex-basis:100%;grid-template-columns:auto auto auto 1fr;justify-content:start;padding-left:27px}}
.mail-party-shared{margin:0 0 10px;padding:6px 10px;border-radius:8px;background:var(--surface1,#f5f7fa);font-size:12px;color:var(--dim)}
/* 公共邮箱 together (shared_mail_ui.js): who claimed it, who is replying, who answered, overdue. */
.tag.shared-tag{border-color:color-mix(in srgb,var(--acc) 30%,var(--line));color:var(--acc2)}
.tag.shared-tag.busy{border-color:var(--warn);color:var(--warn)}
.tag.shared-tag.done{border-color:var(--ok);color:var(--ok)}
.tag.shared-tag.late{border-color:var(--bad,#d93f3f);color:var(--bad,#d93f3f);font-weight:700}
.shared-mail-lines{display:grid;gap:4px;margin:8px 0;padding:8px 10px;border:1px dashed var(--line);border-radius:10px;font-size:12px;color:var(--txt)}
.shared-mail-lines .busy{color:var(--warn)}.shared-mail-lines .done{color:var(--ok)}.shared-mail-lines .late{color:var(--bad,#d93f3f);font-weight:700}
.shared-mail-lines .shared-note{color:var(--dim)}
.shared-handover summary{cursor:pointer;color:var(--acc2);font-weight:700}
.shared-handover>div{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.shared-handover input{flex:1 1 180px;min-width:0}
/* 内部备注, 自动分派 and 看板 (shared_mail_ui.js) */
.shared-notes summary{cursor:pointer;font-weight:700;color:var(--acc2)}
.shared-notes ul{list-style:none;margin:6px 0;padding:0;display:grid;gap:4px}
.shared-notes li{display:grid;grid-template-columns:auto auto 1fr;gap:6px;align-items:baseline}
.shared-notes li time{font-size:12px;color:var(--dim)}
.shared-notes>div,.shared-rule{display:flex;gap:6px;align-items:center;margin-top:6px}
.shared-notes input,.shared-rule input{flex:1 1 160px;min-width:0}
.work-mailbox-shared-tools{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:flex-start;gap:8px;margin-top:6px}
.work-mailbox-shared-tools>button,.shared-rules summary{font-size:12px;cursor:pointer}
.shared-rules{flex:1 1 100%}
.shared-rules-form{display:grid;gap:8px;margin-top:6px;font-size:12px}
.shared-rule-turn{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center}
.shared-rule-turn label{display:inline-flex;gap:4px;align-items:center}
.shared-board-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:10px 0}
.shared-board-tiles>div{display:grid;gap:2px;padding:10px;border:1px solid var(--line);border-radius:10px;text-align:center}
.shared-board-tiles b{font-size:20px}.shared-board-tiles span{font-size:12px;color:var(--dim)}
.shared-board-tiles .warn b{color:var(--bad,#d93f3f)}
.shared-board table{width:100%;border-collapse:collapse;font-size:13px}
.shared-board th,.shared-board td{padding:6px 8px;border-bottom:1px solid var(--line);text-align:left}
@media(max-width:600px){.shared-board-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* 建档：同一公司在邮件里的联系人、已有的卡片、域名范围 (Dylan 2026-11-03) */
.mail-party-family{display:grid;gap:4px;margin:4px 0 10px;padding:6px 10px;border:1px solid var(--line);border-radius:8px;max-height:220px;overflow:auto}
.mail-party-family legend{padding:0 4px;font-size:12px;color:var(--dim)}
.mail-party-family label{display:flex;align-items:center;gap:8px;padding:3px 0}
.mail-party-family label input{width:auto;margin:0;flex:none}
.mail-party-family span{display:flex;flex-direction:column;min-width:0}
.mail-party-family small{color:var(--dim);font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mail-party-siblings{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;margin:0 0 10px;padding:8px 10px;border-radius:8px;background:color-mix(in srgb,var(--acc) 8%,transparent)}
.mail-party-siblings small{flex:1 1 100%;color:var(--dim)}
.mail-party-scope label{display:inline-flex;align-items:center;gap:5px;margin-right:14px}
.mail-party-scope label input{width:auto;margin:0}
.mail-party-scope small{color:var(--dim)}.mail-party-form{max-height:calc(100vh - 32px);overflow:auto}