.exa-connection {
  margin-top: 10px;
  border-top: 1px solid var(--trial-edge, #344b59);
  padding-top: 8px;
  color: var(--trial-nav-muted, #c2cdd4);
  font-size: 11px;
}
.exa-connection summary { display: flex; align-items: center; gap: 7px; min-height: 28px; cursor: pointer; list-style: none; }
.exa-connection summary::-webkit-details-marker { display: none; }
.exa-connection-dot { width: 6px; height: 6px; border-radius: 50%; background: #efc878; flex: none; }
.exa-connection[data-state="connected"] .exa-connection-dot { background: #89d9bc; }
.exa-connection[data-state="unavailable"] .exa-connection-dot { background: #ffb4b4; }
.exa-connection[data-state="unavailable"] summary { color: #ffd4d4; }
.exa-connection-chevron { margin-left: auto; }
.exa-connection[open] .exa-connection-chevron { transform: rotate(180deg); }
.exa-connection-details { padding: 8px 0 4px; line-height: 1.6; }
.exa-connection-details time { display: block; color: var(--trial-nav-text, #f4f7f9); }
.exa-connection-details p { margin: 8px 0; }
.exa-connection button { color: var(--trial-marker, #97e2df); padding: 4px 0; cursor: pointer; }
.exa-connection :is(summary, button):focus-visible { outline: 2px solid #97e2df; outline-offset: 3px; }
.exa-connection-warning {
  position: fixed; top: 100px; right: 16px; z-index: 9998;
  width: min(360px, calc(100vw - 32px)); padding: 14px 16px;
  border: 1px solid #e6b6b3; border-radius: 8px; background: #fff5f4;
  color: #79302c; box-shadow: 0 4px 14px #15232e14;
  font-size: 13px; line-height: 1.55;
}
.exa-connection-warning[hidden] { display: none; }
.exa-connection-warning button { display: block; margin-top: 8px; font-weight: 600; text-decoration: underline; cursor: pointer; }
.dark .exa-connection-warning { background: #38252b; border-color: #77515a; color: #ffd5d5; }