/* Marina — Chris's communication feedback, October 2.
   Load last, after the approved template-color companion. Presentation only.
   The host supplies truthful text/state and controls the lifetime of activity.
   Nothing here infers delivery, starts work, or changes the common composer. */
.comm-activity {display:inline-flex;align-items:center;gap:5px;color:inherit;font:500 .8125rem/1.4 var(--sans);white-space:nowrap;min-width:0}
.comm-activity-label {display:inline;position:static;width:auto;height:auto;margin:0;overflow:visible;clip-path:none}
.comm-working-dots {display:inline-flex;align-items:center;gap:3px;flex:none;width:18px;height:12px;color:inherit}
.comm-working-dots>span {width:4px;height:4px;flex:none;border-radius:50%;background:currentColor;animation:staffmor-working-breathe 1.4s ease-in-out infinite}
.comm-working-dots>span:nth-child(2) {animation-delay:.16s}
.comm-working-dots>span:nth-child(3) {animation-delay:.32s}
@keyframes staffmor-working-breathe {0%,75%,100%{opacity:.38}35%{opacity:1}}
.office-console-shell .rail :is(.chat-label,.rail-reorder-row>a,.rail-team-link):has(>.comm-activity) {grid-template-columns:26px minmax(0,1fr) max-content 18px;gap:4px}
.office-console-shell .rail .comm-activity {grid-column:3;grid-row:1;justify-self:end;margin:0;width:auto;height:auto;color:inherit;font:500 .75rem/1.4 var(--sans)}
.comm-activity-detail {margin:5px 0 0;color:var(--muted);font:400 .875rem/1.5 var(--sans)}
.comm-connection {display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 8px;color:var(--muted);font:400 .8125rem/1.45 var(--sans)}
.comm-connection strong {font-weight:600;color:var(--ink)}
.comm-message-receipt {display:flex;align-items:center;flex-wrap:wrap;gap:5px 8px;margin:0;color:var(--muted);font:400 .8125rem/1.45 var(--sans)}
.comm-message-receipt .comm-receipt-word {color:var(--ink);font-weight:500}
.comm-message-receipt[data-state="delivered"] .comm-receipt-word {color:var(--accent)}
.comm-connected-apps {min-width:0;border:1px solid var(--line);border-radius:12px;padding:16px;background:var(--surface)}
.comm-connected-apps-head {display:flex;align-items:center;justify-content:space-between;gap:8px 16px;flex-wrap:wrap;margin:0 0 12px}
.comm-connected-apps-head h2 {margin:0;color:var(--accent);font:600 1rem/1.4 var(--sans)}
.comm-connected-apps-actions {display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.comm-connected-apps-actions .btn {min-height:32px;margin:0;padding:5px 12px;font:600 .875rem/1.4 var(--sans)}
.comm-connected-apps-list {display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:10px;list-style:none;margin:0;padding:0;min-width:0}
.comm-app-card {display:grid;grid-template-columns:32px minmax(0,1fr);gap:4px 10px;align-items:center;border:1px solid var(--line);border-radius:9px;padding:10px 12px;min-width:0;background:var(--ground)}
.comm-app-icon {grid-column:1;grid-row:1 / span 2;display:grid;place-items:center;width:32px;height:32px;border-radius:8px;background:var(--accent-soft);color:var(--accent)}
.comm-app-icon svg {width:21px;height:21px;display:block}
.comm-app-name {grid-column:2;margin:0;color:var(--ink);font:600 .9375rem/1.4 var(--sans);overflow-wrap:anywhere}
.comm-app-state {grid-column:2;margin:0;color:var(--muted);font:400 .8125rem/1.45 var(--sans);overflow-wrap:anywhere}
.comm-app-note {margin:10px 0 0;color:var(--muted);font:400 .875rem/1.5 var(--sans);overflow-wrap:anywhere}
.comm-dm-empty {display:flex;align-items:flex-start;gap:14px;max-width:600px;margin:22px 0;padding:18px;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--ink)}
.comm-dm-avatar {flex:none;width:40px;height:40px;display:grid;place-items:center;object-fit:contain;border-radius:50%;background:var(--accent-soft);color:var(--accent);font:600 1rem/1 var(--sans)}
.comm-dm-empty h2 {margin:0 0 5px;color:var(--ink);font:600 1.125rem/1.4 var(--sans)}
.comm-dm-empty p {margin:0;color:var(--muted);font:400 1rem/1.55 var(--sans);overflow-wrap:anywhere}
.comm-dm-empty .btn {margin:12px 0 0}
@media(max-width:820px) {
 .comm-connected-apps {padding:14px}
 .comm-connected-apps-head {gap:10px}
 .comm-connected-apps-actions .btn {min-height:44px}
 .comm-connected-apps-list {grid-template-columns:minmax(0,1fr)}
 .comm-dm-empty {padding:14px;gap:10px}
}
@media(prefers-reduced-motion:reduce) {.comm-working-dots>span {animation:none;opacity:1}}