diff --git a/hubzilla/addon/assoc_profile/assoc_profile.css b/hubzilla/addon/assoc_profile/assoc_profile.css
new file mode 100644
index 0000000..695d3bd
--- /dev/null
+++ b/hubzilla/addon/assoc_profile/assoc_profile.css
@@ -0,0 +1,224 @@
+/* assoc_profile — v0.2.0
+   All colors via --civicinfra-* tokens.
+   All structural classes via civicinfra primitives. */
+
+/* ============================================================
+   PROFILE VIEW
+   ============================================================ */
+
+.assoc-profile-view {
+	margin-top: var(--civicinfra-space-6, 1.5rem);
+	padding-top: var(--civicinfra-space-4, 1rem);
+	border-top: 2px solid var(--civicinfra-rule, #b7ad9d);
+}
+
+.assoc-profile-group {
+	margin-bottom: var(--civicinfra-space-6, 1.5rem);
+}
+
+.assoc-profile-field {
+	display: grid;
+	grid-template-columns: 12rem 1fr;
+	gap: var(--civicinfra-space-2, 0.5rem);
+	padding: var(--civicinfra-space-1, 0.25rem) 0;
+	font-size: var(--civicinfra-fs-sm, 0.875rem);
+	line-height: 1.5;
+	border-bottom: 1px solid var(--civicinfra-surface-muted, #e7e1d6);
+}
+
+.assoc-profile-field:last-child {
+	border-bottom: none;
+}
+
+.assoc-field-label {
+	font-weight: 600;
+	color: var(--civicinfra-muted, #5f655d);
+	font-size: var(--civicinfra-fs-xs, 0.75rem);
+	text-transform: uppercase;
+	letter-spacing: 0.04em;
+	padding-top: 0.1rem;
+}
+
+.assoc-field-value {
+	color: var(--civicinfra-text, #24231f);
+}
+
+/* ============================================================
+   MANAGE INTERFACE
+   ============================================================ */
+
+.assoc-manage {
+	max-width: 72rem;
+}
+
+/* Search and filter bar */
+.assoc-search-bar {
+	display: flex;
+	flex-wrap: nowrap;
+	gap: var(--civicinfra-space-2, 0.5rem);
+	align-items: center;
+	padding: var(--civicinfra-space-2, 0.5rem) var(--civicinfra-space-3, 0.75rem);
+	background: var(--civicinfra-surface, #f2efe8);
+	border: 1px solid var(--civicinfra-border, #cfc6b6);
+	border-radius: var(--civicinfra-radius, 3px);
+	margin-bottom: var(--civicinfra-space-4, 1rem);
+	overflow-x: auto;
+}
+
+/* Search input grows, dropdowns are fixed width */
+.assoc-search-bar input[type="search"] {
+	flex: 1 1 12rem;
+	min-width: 8rem;
+	height: 2rem;
+	font-size: var(--civicinfra-fs-sm, 0.875rem);
+}
+
+.assoc-search-bar select {
+	flex: 0 0 auto;
+	width: 9rem;
+	height: 2rem;
+	font-size: var(--civicinfra-fs-sm, 0.875rem);
+}
+
+/* Bulk actions bar */
+.assoc-bulk-bar {
+	display: flex;
+	gap: var(--civicinfra-space-2, 0.5rem);
+	align-items: center;
+	padding: var(--civicinfra-space-2, 0.5rem) var(--civicinfra-space-3, 0.75rem);
+	background: var(--civicinfra-accent-muted, #d8c4a2);
+	border: 1px solid var(--civicinfra-accent, #8a673c);
+	border-radius: var(--civicinfra-radius, 3px);
+	margin-bottom: var(--civicinfra-space-3, 0.75rem);
+	font-size: var(--civicinfra-fs-sm, 0.875rem);
+	font-weight: 600;
+}
+
+/* Pagination */
+.assoc-pagination {
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	padding-top: var(--civicinfra-space-3, 0.75rem);
+	font-size: var(--civicinfra-fs-sm, 0.875rem);
+	color: var(--civicinfra-muted, #5f655d);
+	border-top: 1px solid var(--civicinfra-surface-muted, #e7e1d6);
+}
+
+/* Delete confirmation */
+.assoc-delete-confirm {
+	border: 1px solid var(--civicinfra-danger, #7a342c);
+	border-left: 0.35rem solid var(--civicinfra-danger, #7a342c);
+	background: color-mix(in srgb, var(--civicinfra-danger, #7a342c) 6%, var(--civicinfra-bg, #faf9f6));
+	padding: var(--civicinfra-space-4, 1rem);
+	border-radius: 0 var(--civicinfra-radius, 3px) var(--civicinfra-radius, 3px) 0;
+	margin-top: var(--civicinfra-space-6, 1.5rem);
+}
+
+.assoc-delete-confirm h5 {
+	color: var(--civicinfra-danger, #7a342c);
+	margin-bottom: var(--civicinfra-space-3, 0.75rem);
+}
+
+/* Diff view */
+.assoc-diff-entry {
+	margin-bottom: var(--civicinfra-space-4, 1rem);
+	border: 1px solid var(--civicinfra-border, #cfc6b6);
+	border-radius: var(--civicinfra-radius, 3px);
+	overflow: hidden;
+}
+
+.assoc-diff-entry-header {
+	background: var(--civicinfra-surface, #f2efe8);
+	padding: var(--civicinfra-space-2, 0.5rem) var(--civicinfra-space-4, 1rem);
+	font-weight: 700;
+	font-size: var(--civicinfra-fs-sm, 0.875rem);
+	border-bottom: 1px solid var(--civicinfra-border, #cfc6b6);
+	display: flex;
+	align-items: center;
+	gap: var(--civicinfra-space-3, 0.75rem);
+}
+
+.assoc-diff-entry-new {
+	border-left: 0.25rem solid var(--civicinfra-primary, #243f3b);
+}
+
+.assoc-diff-entry-changed {
+	border-left: 0.25rem solid var(--civicinfra-accent, #8a673c);
+}
+
+/* Edit form profile link */
+.assoc-profile-edit-link {
+	padding-top: var(--civicinfra-space-3, 0.75rem);
+}
+
+/* ============================================================
+   RESPONSIVE
+   ============================================================ */
+
+@media (max-width: 767.98px) {
+	.assoc-profile-field {
+		grid-template-columns: 1fr;
+		gap: var(--civicinfra-space-1, 0.25rem);
+	}
+
+	.assoc-field-label {
+		border-bottom: none;
+		padding-bottom: 0;
+	}
+
+	.assoc-search-bar {
+		flex-direction: column;
+	}
+
+	.assoc-manage {
+		max-width: 100%;
+	}
+}
+
+/* ============================================================
+   EDIT FORM — TABS
+   ============================================================ */
+
+.assoc-edit-tabs {
+	border-bottom: 2px solid var(--civicinfra-rule, #b7ad9d);
+}
+
+.assoc-edit-tabs .nav-link {
+	font-family: var(--bs-font-sans-serif);
+	font-size: var(--civicinfra-fs-sm, 0.875rem);
+	font-weight: 600;
+	color: var(--civicinfra-muted, #5f655d);
+	border: none;
+	border-bottom: 2px solid transparent;
+	margin-bottom: -2px;
+	padding: 0.5rem 1rem;
+	border-radius: 0;
+	transition: color var(--civicinfra-transition, 150ms ease),
+	            border-color var(--civicinfra-transition, 150ms ease);
+}
+
+.assoc-edit-tabs .nav-link:hover {
+	color: var(--civicinfra-text, #24231f);
+	border-bottom-color: var(--civicinfra-rule, #b7ad9d);
+}
+
+.assoc-edit-tabs .nav-link.active {
+	color: var(--civicinfra-primary, #243f3b);
+	border-bottom: 2px solid var(--civicinfra-primary, #243f3b);
+	background: none;
+}
+
+.assoc-edit-tab-content {
+	border: 1px solid var(--civicinfra-border, #cfc6b6);
+	border-top: none;
+}
+
+.assoc-tab-pane {
+	border-radius: 0 0 var(--civicinfra-radius, 3px) var(--civicinfra-radius, 3px);
+}
+
+.assoc-save-bar {
+	padding: var(--civicinfra-space-3, 0.75rem) 0;
+	margin-top: var(--civicinfra-space-3, 0.75rem);
+}