.receiving-section{--route-ink:#292929;--route-muted:#777178;--route-border:#e7e3e6;--route-surface:#fff;--route-selected:#f5f1f5;display:grid;grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);position:relative;border:1px solid var(--grid-line,#dedbdd);background:var(--paper,#fafafa);min-height:570px}
.receiving-header{padding:44px 24px;display:flex;flex-direction:column;justify-content:flex-start;border-right:1px solid var(--grid-line,#dedbdd)}
.receiving-header h2{margin:0 0 20px;font-size:clamp(28px,3vw,36px);line-height:1.15;letter-spacing:-.04em;font-weight:500;text-wrap:balance}
.receiving-header p{font:500 15px/1.6 'Instrument Sans',sans-serif;color:#252023;margin:0;max-width:34ch}
.receiving-examples{margin-top:28px;min-height:220px;position:relative;border-left:1px solid #e2dde1}
.receiving-examples button{appearance:none;position:relative;display:block;width:100%;padding:14px 0 14px 16px;margin:0;border:0;background:none;text-align:left;color:#827b81;font:500 15px/1.4 'Instrument Sans',sans-serif;cursor:pointer;border-radius:0}
.receiving-examples button[aria-pressed="true"]{color:#292929}
.receiving-examples button::after{content:'';position:absolute;left:-1px;top:0;bottom:0;width:2px;background:#898087;opacity:0;transform:scaleY(var(--progress,0));transform-origin:top}
.receiving-examples button[aria-pressed="true"]::after{opacity:1}
.receiving-examples small{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows 280ms cubic-bezier(.165,.84,.44,1),opacity 280ms cubic-bezier(.165,.84,.44,1);font-size:12px;line-height:1.5;color:#777178}
.receiving-examples small>span{overflow:hidden}
.receiving-examples small>span::before{content:'';display:block;height:6px}
.receiving-examples [aria-pressed="true"] small{grid-template-rows:1fr;opacity:1}
.receiving-examples button:focus-visible{outline:2px solid #94789e;outline-offset:3px}
@media(hover:hover) and (pointer:fine){.receiving-examples button:hover{color:#292929}}
.receiving-inbox{min-width:0;padding:44px 24px;color:var(--route-ink);display:flex;flex-direction:column;justify-content:center;box-sizing:border-box}
.receiving-diagram{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 48px minmax(0,1fr);gap:24px;align-items:center;min-height:260px;isolation:isolate}
.receiving-wires{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:2}
.receiving-file{position:relative;z-index:3;background:#fff;border:0;border-radius:0;padding:12px;min-width:0;min-height:232px;box-sizing:border-box;display:flex;flex-direction:column;gap:12px;box-shadow:0 2px 8px #30232c04}
.receiving-file::after{content:'';position:absolute;inset:-7px;border:1px solid #e5e0e4;border-radius:8px;pointer-events:none}
.receiving-window-bar{display:flex;align-items:center;gap:5px;color:#797279;font-size:9px;white-space:nowrap}
.receiving-window-dots{color:#d3ced2;font-size:5px;letter-spacing:1px;margin-right:3px}
.receiving-window-bar img{width:12px;height:12px;object-fit:contain}
.receiving-prompt{position:relative;min-height:88px;font:500 12px/1.45 'Instrument Sans',sans-serif;margin:0}
.receiving-prompt p{margin:0;overflow-wrap:anywhere}
.receiving-prompt-space{visibility:hidden}
.receiving-prompt [data-receiver-message]{position:absolute;inset:0}
.receiving-prompt mark{color:#996e9a;background:transparent;text-decoration:underline;text-decoration-color:#c799c2;text-underline-offset:3px;text-decoration-thickness:1.5px}
.receiving-attachment{display:flex;align-items:center;gap:7px;min-height:38px;font-size:10px;line-height:1.3}
.receiving-attachment img{width:40px;height:30px;object-fit:contain;flex:none}
.receiving-section[data-attachment="false"] .receiving-attachment{visibility:hidden}
.receiving-hub{position:relative;z-index:3}
.receiving-mark{width:48px;height:48px;border:1px solid #e0d9df;border-radius:50%;background:#f0ecef;display:grid;place-items:center;color:#4c1628;box-sizing:border-box;box-shadow:0 1px 3px #352b3108}
.receiving-mark svg{width:26px;height:26px}
.receiving-hub-label{position:absolute;top:56px;left:50%;transform:translateX(-50%);font-size:9px;color:var(--route-muted)}
.receiving-routes{position:relative;display:grid;gap:12px;min-width:0}
.receiving-route{position:relative;display:flex;align-items:center;gap:6px;height:40px;padding:0 9px;border:1px solid #e8e3e6;border-radius:24px;background:var(--paper,#fafafa);font-size:10px;white-space:nowrap;min-width:0}
.receiving-route>span{transition:opacity 280ms cubic-bezier(.165,.84,.44,1)}
.receiving-route-muted{color:#756d75}
.receiving-route-muted>span{opacity:.5}
.receiving-route-active{color:#292929;background:#f0edf0;border-color:#ddd5dd}
.receiving-person{display:grid;place-items:center;width:16px;height:16px;flex:0 0 16px;border-radius:50%;color:#997a9e;font-size:9px}
.receiving-status{margin-left:auto;font-size:8px;color:#3c795b;background:#e6efe8;padding:3px 5px;border-radius:10px}
.receiving-status:empty{display:none}
.receiving-caption{display:flex;gap:6px;justify-content:center;align-items:center;margin-top:32px;font-size:10px;color:#777178;min-height:24px;opacity:0}
.receiving-intent-badge{padding:4px 8px;border-radius:12px;background:#eeebee;color:#6e606e;font-size:10px}
.receiving-caption>[data-receiver-caption]{padding:4px 8px;border-radius:12px;background:#f0eaf5;color:#816594}
.receiving-agent{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:6px;font-size:10px;line-height:1.5;margin-top:12px;color:#726672}
.receiving-access{color:#898089;font-size:9px}
.hero-example .draft-attachment[hidden]{display:none!important}
@media(min-width:1100px){.receiving-inbox{padding-inline:32px}.receiving-diagram{grid-template-columns:minmax(0,1.05fr) 56px minmax(0,1fr);gap:28px}.receiving-mark{width:56px;height:56px}.receiving-hub-label{top:64px}.receiving-prompt{font-size:14px}.receiving-route{font-size:12px}.receiving-file{padding:14px;min-height:246px}}
@media(max-width:800px){.receiving-section{grid-template-columns:1fr;min-height:0}.receiving-header{padding:28px 24px;border-right:0;border-bottom:1px solid var(--grid-line,#dedbdd)}.receiving-inbox{width:100%;max-width:600px;justify-self:center;padding:36px 24px}.receiving-header h2 br{display:none}.receiving-header p{max-width:40ch}.receiving-examples{min-height:215px;margin-top:24px}}
@media(max-width:640px){.receiving-diagram{grid-template-columns:1fr;gap:32px;justify-items:center}.receiving-file{grid-column:1;width:min(100%,260px);min-height:232px;padding:14px 16px}.receiving-prompt{font-size:14px;min-height:66px}.receiving-hub{grid-column:1;grid-row:2}.receiving-hub-label{display:none}.receiving-routes{grid-column:1;grid-row:3;width:100%;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.receiving-route{height:72px;flex-direction:column;justify-content:center;gap:4px;padding:6px 4px;font-size:10px;white-space:normal;text-align:center;border-radius:16px}.receiving-route .receiving-status{margin-left:0;padding:2px 4px;font-size:8px}.receiving-agent{font-size:10px}.receiving-access{flex-basis:100%;text-align:center}}
@media(prefers-reduced-motion:reduce){.receiving-examples small,.receiving-route>span{transition:opacity 200ms ease}}
.receiving-prompt mark{position:relative;text-decoration:none}
.receiving-prompt mark::after{content:'';position:absolute;left:0;right:0;bottom:-2px;height:1.5px;background:#c799c2;transform-origin:left}
@media(prefers-reduced-motion:no-preference){.receiving-prompt mark::after{animation:receiver-cue-draw 350ms cubic-bezier(.165,.84,.44,1) both}}
@keyframes receiver-cue-draw{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media(min-width:801px){.receiving-prompt{font-size:14px;min-height:102px}.receiving-window-bar{font-size:10px}.receiving-route{font-size:12px}.receiving-file{min-height:246px}}

/* Reuse the graph’s profile illustrations for human recipients. */
.receiving-person[data-receiver-avatar]{width:26px;height:26px;flex-basis:26px}
.receiving-person[data-receiver-avatar] .ag-person{display:block;width:26px;height:26px;border-radius:50%;overflow:hidden}
.receiving-person[data-receiver-avatar] svg{display:block;width:100%;height:100%}

.receiving-team-logo{color:#edb5c2}
.receiving-team-logo svg{display:block;width:18px;height:18px}

/* Match the surrounding sections: continuous outer rails and one rule per edge. */
.receiving-section::before,
.receiving-section::after {
  content: '';
  position: absolute;
  top: -1px;
  bottom: -1px;
  width: calc(50vw - 50% - 1px);
  border-block: 1px solid var(--grid-line);
  pointer-events: none;
}
.receiving-section::before { right: calc(100% + 1px); }
.receiving-section::after { left: calc(100% + 1px); }
.receiving-section + .setup-divider-space::before { content: none; }

@media (min-width: 801px) {
  .receiving-header { padding-block-start: clamp(64px, 12svh, 120px); }
  .receiving-header h2 { margin-block-end: 24px; }
  .receiving-examples { margin-block-start: 40px; }
  .receiving-examples button { padding-block: 18px; }
}
