/* Static homepage diagram: three agents share a calm, readable email inbox. */
.rd-inbox-map { min-width:0; }
.rd-inbox-agents,.rd-inbox-connectors { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; max-width:350px; margin:0 auto; }
.rd-inbox-agents { margin-bottom:3px; }
.rd-inbox-agent { display:flex; flex-direction:column; align-items:center; gap:8px; color:var(--rd-ink); font-size:13px; white-space:nowrap; }
.rd-inbox-agent-icon { display:flex; align-items:center; justify-content:center; width:48px; height:48px; }
.rd-inbox-agent-face { display:block; width:48px; height:48px; }
.rd-inbox-agent-icon img { display:block; max-width:100%; object-fit:contain; margin:0; border:0; border-radius:0; }
.rd-inbox-claude-icon { width:38px; height:38px; }
.rd-inbox-chatgpt-icon { width:35px; height:35px; }
.rd-inbox-connectors { height:42px; color:#7d8ca8; }
.rd-inbox-connectors svg { display:block; width:20px; height:42px; justify-self:center; }
/* Keep the connectors crisp when the desktop SVG is scaled down. */
.rd-inbox-connectors path { vector-effect:non-scaling-stroke; }
.rd-inbox-card { border:1px solid #d7dce3; border-radius:5px; background:#fafbfc; color:#65707c; }
.rd-inbox-header { display:flex; align-items:center; gap:10px; padding:16px 18px; border-bottom:1px solid #e1e5ea; border-radius:5px 5px 0 0; background:#f0f2f5; }
.rd-inbox-icon { display:block; flex:none; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.rd-inbox-header .rd-inbox-icon { width:19px; height:19px; color:#8794a6; }
.rd-inbox-address { min-width:0; font-family:var(--rd-mono); font-size:12px; overflow-wrap:anywhere; }
.rd-inbox-message { padding:13px 18px; border-top:1px solid #ebedf1; line-height:1.45; }
.rd-inbox-header+.rd-inbox-message { border-top:0; }
.rd-inbox-sender-line { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:3px; }
.rd-inbox-sender { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; font-weight:500; color:#727c88; }
.rd-inbox-time { font-size:10px; color:#808994; white-space:nowrap; }
.rd-inbox-subject-line { display:flex; align-items:center; gap:8px; }
.rd-inbox-subject { font-size:13px; font-weight:500; }
.rd-inbox-subject-line .rd-inbox-icon { width:13px; height:13px; color:#9ca5b0; }
.rd-home .rd-inbox-preview { margin-top:3px; color:#7b8591; font-size:11.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

@media(min-width:801px) {
  .rd-inbox-map { display:flex; flex-direction:column; }
  .rd-inbox-agents,.rd-inbox-connectors { width:100%; }
  .rd-inbox-agent { gap:4px; font-size:12px; line-height:1.4; }
  .rd-inbox-agent-icon,.rd-inbox-agent-face { width:36px; height:36px; }
  .rd-inbox-claude-icon { width:30px; height:30px; }
  .rd-inbox-chatgpt-icon { width:28px; height:28px; }
  .rd-inbox-connectors,.rd-inbox-connectors svg { height:24px; }
  .rd-inbox-card { flex:1; display:grid; grid-template-rows:auto repeat(3,minmax(0,1fr)); }
  .rd-inbox-header { padding-block:9px; }
  .rd-inbox-message { display:flex; flex-direction:column; justify-content:center; padding-block:6px; line-height:1.3; }
  .rd-inbox-sender-line { margin-bottom:2px; }
  .rd-home .rd-inbox-preview { margin-top:2px; }
}
@media(max-width:800px) {
  .rd-inbox-map { width:100%; max-width:520px; margin-inline:auto!important; }
}
@media(max-width:480px) {
  .rd-inbox-agents,.rd-inbox-connectors { gap:12px; }
  .rd-inbox-agent { font-size:12px; }
  .rd-inbox-header { padding:14px; }
  .rd-inbox-address { font-size:10px; }
  .rd-inbox-message { padding:12px 14px; }
}

:is(html.dark,[data-theme="dark"]) .rd-inbox-card { background:var(--rd-paper); border-color:var(--rd-line); color:var(--rd-muted); }
:is(html.dark,[data-theme="dark"]) .rd-inbox-header { background:var(--rd-soft); border-color:var(--rd-line); }
:is(html.dark,[data-theme="dark"]) .rd-inbox-message { border-color:var(--rd-soft); }
:is(html.dark,[data-theme="dark"]) :is(.rd-inbox-sender,.rd-inbox-time,.rd-inbox-preview) { color:var(--rd-muted); }
:is(html.dark,[data-theme="dark"]) .rd-inbox-chatgpt-icon { filter:invert(1); opacity:.8; }