/* View > Mail (S-0000-0588) */
.mailv { display: flex; flex-direction: column; height: 100%; padding: 10px 14px; gap: 8px; box-sizing: border-box; overflow: auto; font: var(--ui-fs) var(--font-ui); }
.mailv-head { display: flex; align-items: center; gap: 8px; }
.mailv-spacer { flex: 1; }
.mailv-tabs { display: flex; gap: 4px; flex-wrap: wrap; }
.mailv-tab { background: var(--surface2); color: var(--text); border: 1px solid var(--rule); border-radius: 12px; padding: 2px 10px; font: inherit; cursor: pointer; }
.mailv-tab.on { border-color: var(--accent); color: var(--accent-hi); }
.mailv-btn { background: var(--surface2); color: var(--text); border: 1px solid var(--rule); border-radius: 4px; padding: 3px 10px; font: inherit; cursor: pointer; }
.mailv-btn.primary { background: var(--accent); border-color: var(--accent); color: var(--accent-tx); }
.mailv-table { border-collapse: collapse; width: 100%; }
.mailv-table th { text-align: left; font-weight: 600; color: var(--text-dim); border-bottom: 1px solid var(--rule); padding: 4px 6px; }
.mailv-table td { padding: 5px 6px; border-bottom: 1px solid var(--rule); cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 22em; }
.mailv-table tr:hover td { background: var(--surface2); }
.mailv-table tr.unread td { font-weight: 600; color: var(--text-strong); }
.mailv-subj { max-width: 30em; }
.mailv-when { color: var(--text-dim); }
.mailv-empty, .mailv-note { color: var(--text-dim); }
.mailv-msghead { display: flex; flex-direction: column; gap: 3px; border-bottom: 1px solid var(--rule); padding-bottom: 8px; }
.mailv-subjbig { font-size: calc(var(--ui-fs) * 1.25); font-weight: 600; color: var(--text-strong); }
.mailv-hl { display: flex; gap: 8px; align-items: center; }
.mailv-k { color: var(--text-dim); min-width: 5em; }
.mailv-in { flex: 1; background: var(--bg); color: var(--text); border: 1px solid var(--rule); border-radius: 4px; padding: 3px 6px; font: inherit; }
.mailv-body { margin: 0; white-space: pre-wrap; font: var(--ui-fs) var(--font-ui); color: var(--text); }
.mailv-reply { display: flex; flex-direction: column; gap: 6px; align-items: flex-start; border-top: 1px solid var(--rule); padding-top: 8px; }
.mailv-text { width: 100%; box-sizing: border-box; background: var(--bg); color: var(--text); border: 1px solid var(--rule); border-radius: 4px; padding: 6px; font: inherit; }
.mailv-status.ok { color: var(--ok); }
.mailv-status.bad { color: var(--danger-tx); }