.support-mail-panel {
  margin: 0 0 18px;
  border: 1px solid var(--management-border);
  border-radius: 11px;
  background: var(--management-side);
  overflow: hidden;
}
.support-mail-panel > summary {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 15px 18px;
  cursor: pointer;
  list-style: none;
}
.support-mail-panel > summary::-webkit-details-marker { display: none; }
.support-mail-panel > summary:hover { background: var(--management-surface); }
.support-mail-panel > summary:focus-visible { outline-offset: -3px; }
.support-mail-panel summary strong { display: block; font-size: 12px; font-weight: 650; }
.mail-summary-icon { color: var(--management-cyan); font-size: 20px; }
.mail-summary-caption { display: block; color: var(--management-muted); font-size: 11px; }
.mail-summary-action { margin-left: auto; color: var(--management-muted); font-size: 11px; white-space: nowrap; }
.mail-chevron { display: inline-block; margin-left: 9px; font-size: 18px; }
.support-mail-panel[open] .mail-chevron { transform: rotate(180deg); }
.support-mail-content { padding: 20px; border-top: 1px solid var(--management-border); }
.mail-activity-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.mail-activity-heading h2 { margin-bottom: 6px; font-size: 17px; }
.mail-activity-heading p { color: var(--management-muted); font-size: 12px; margin-bottom: 16px; max-width: 650px; }
.mail-activity-heading .button { flex-shrink: 0; }
.mail-channel-states { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0 0 17px; padding: 0; }
.mail-channel-states li { display: inline-flex; gap: 7px; color: var(--management-muted); font-size: 10px; padding: 4px 8px; border: 1px solid var(--management-border); border-radius: 6px; }
.mail-channel-states strong { font-weight: 600; color: var(--management-cyan); }
.mail-channel-states .is-paused strong { color: var(--management-muted); }
.mail-metrics { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 9px; margin: 0; }
.mail-metrics > div { padding: 12px; border: 1px solid var(--management-border); border-radius: 8px; background: var(--management-surface); min-width: 0; }
.mail-metrics dt { color: var(--management-muted); font-size: 10px; min-height: 31px; }
.mail-metrics dd { margin: 4px 0 0; font-size: 24px; line-height: 1.2; font-weight: 600; overflow-wrap: anywhere; }
.mail-metric-review dd { color: #f2c780; }
.mail-metric-held dd { color: var(--management-violet); }
.mail-as-of { margin: 10px 0 18px; color: var(--management-muted); font-size: 10px; }
.mail-activity-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; }
.mail-activity-card { min-width: 0; padding: 17px; border: 1px solid var(--management-border); border-radius: 9px; background: var(--management-surface); display: flex; flex-direction: column; }
.mail-card-heading h3 { font-size: 14px; margin-bottom: 5px; }
.mail-card-heading p { font-size: 11px; color: var(--management-muted); margin-bottom: 14px; }
.mail-activity-card > label { display: block; font-size: 10px; color: var(--management-muted); margin-bottom: 5px; }
.mail-list-status { font-size: 11px; color: var(--management-muted); margin: 12px 0; min-height: 17px; }
.mail-activity-list { list-style: none; margin: 0; padding: 0; min-width: 0; max-height: 450px; overflow-y: auto; overflow-wrap: anywhere; }
.mail-activity-list:empty { min-height: 0; }
.mail-activity-list li { border-top: 1px solid var(--management-border); padding: 13px 0; }
.mail-row-top { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 7px; }
.mail-row-title { font-size: 12px; font-weight: 600; }
.mail-state-badge { display: inline-block; border: 1px solid var(--management-border); border-radius: 5px; padding: 2px 6px; font-size: 9px; font-weight: 550; color: var(--management-muted); }
.mail-state-badge.unknown, .mail-state-badge.rejected { background: #352b1d; border-color: #635132; color: #f2c780; }
.mail-state-badge.quarantine { background: var(--management-violet-soft); border-color: #514169; color: var(--management-violet); }
.mail-state-badge.accepted, .mail-state-badge.applied { background: var(--management-cyan-soft); border-color: #2c5555; color: var(--management-cyan); }
.mail-row-recipient { margin: 6px 0 0; font-size: 11px; color: var(--management-text); }
.mail-row-note { margin: 6px 0 0; font-size: 11px; color: var(--management-muted); }
.mail-row-meta { display: flex; flex-wrap: wrap; gap: 5px 12px; color: var(--management-muted); font-size: 10px; margin-top: 8px; }
.mail-pagination { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: auto; padding-top: 12px; border-top: 1px solid var(--management-border); }
.mail-pagination span { color: var(--management-muted); font-size: 10px; text-align: center; }
.mail-review-open { display: block; width: 100%; padding: 0; border: 0; background: none; color: inherit; text-align: left; }
.mail-review-open:hover .mail-row-title { color: var(--management-cyan); }
.mail-review-open .mail-row-meta::after { content: 'Review email →'; margin-left: auto; color: var(--management-cyan); }
.mail-review-panel { margin-top: 18px; border: 1px solid var(--management-border); border-radius: 10px; padding: 20px; background: var(--management-surface); }
.mail-review-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.mail-review-eyebrow { color: var(--management-muted); font-size: 10px; }
.mail-review-heading h3 { font-size: 18px; margin: 4px 0 0; }
.mail-review-tools { display: flex; align-items: center; gap: 10px; }
.mail-review-status { margin: 14px 0; color: var(--management-muted); font-size: 12px; min-height: 18px; }
.mail-review-status.is-error { color: #f2c780; }
.mail-review-sender { display: flex; align-items: baseline; flex-wrap: wrap; gap: 7px 12px; font-size: 12px; overflow-wrap: anywhere; }
#mailReviewReceived { color: var(--management-muted); font-size: 10px; }
.mail-review-identity, .mail-review-reason { margin: 9px 0; color: var(--management-muted); font-size: 11px; }
.mail-review-preview { margin-top: 17px; padding: 17px; border: 1px solid var(--management-border); border-radius: 8px; background: var(--management-bg); }
.mail-review-preview h4 { margin: 0 0 7px; font-size: 15px; overflow-wrap: anywhere; }
.mail-review-body-source { color: var(--management-muted); margin: 0 0 12px; font-size: 10px; }
#mailReviewBody { margin: 0; max-height: 330px; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; font: inherit; font-size: 12px; line-height: 1.7; }
.mail-review-attachments { margin-top: 17px; }
.mail-review-attachments h4 { margin-bottom: 10px; font-size: 13px; }
.mail-review-routing { margin-top: 18px; border-left: 3px solid var(--management-violet); padding: 10px 13px; background: var(--management-violet-soft); border-radius: 0 7px 7px 0; }
.mail-review-routing strong { font-size: 11px; }
.mail-review-routing p { margin: 5px 0 0; font-size: 11px; overflow-wrap: anywhere; }
.mail-review-form { margin-top: 18px; }
.mail-review-form label { display: block; margin-bottom: 7px; font-size: 12px; }
.mail-review-form label span { color: var(--management-violet); font-size: 10px; }
.mail-review-form textarea { min-height: 88px; }
.mail-review-form textarea:read-only { opacity: .8; }
.mail-review-form p { margin: 7px 0 13px; font-size: 10px; color: var(--management-muted); }
.mail-review-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.mail-storage-card { margin: 16px 0; padding: 16px; border: 1px solid var(--management-border); border-radius: 8px; background: var(--management-surface); }
.mail-storage-card h3 { margin: 0 0 9px; font-size: 13px; }
.mail-storage-card p { margin: 8px 0 0; font-size: 11px; line-height: 1.6; color: var(--management-muted); }
.mail-storage-card progress { display: block; width: 100%; height: 9px; margin: 12px 0; accent-color: var(--management-cyan); }
.mail-storage-card.is-warning { border-color: #635132; }
.mail-storage-card.is-warning progress { accent-color: #f2c780; }
@media (max-width: 1200px) {
  .mail-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .mail-metrics dt { min-height: 0; }
}
@media (max-width: 720px) {
  .support-mail-panel > summary { padding: 13px; gap: 9px; }
  .mail-summary-caption { font-size: 10px; }
  .mail-summary-action { font-size: 0; }
  .mail-chevron { font-size: 20px; margin-left: 0; }
  .support-mail-content { padding: 14px; }
  .mail-activity-heading { flex-direction: column; gap: 0; }
  .mail-activity-heading p { margin-bottom: 12px; }
  .mail-activity-heading .button { margin-bottom: 16px; }
  .mail-activity-columns { grid-template-columns: minmax(0, 1fr); }
  .mail-activity-card { padding: 14px; }
  .mail-metrics > div { padding: 10px; }
  .mail-metrics dt { min-height: 30px; }
  .mail-metrics dd { font-size: 23px; }
  .mail-review-panel { padding: 14px; }
  .mail-review-heading { flex-direction: column; gap: 12px; }
  .mail-review-tools { align-self: stretch; justify-content: space-between; }
  .mail-review-preview { padding: 13px; }
  .mail-review-actions .button { flex: 1 1 100%; }
}