.ui-form { display: grid; gap: var(--form-section-gap); }
.ui-field { display: grid; gap: var(--field-label-gap); min-width: 0; }
.ui-field > label, .ui-field > input { margin: 0; }
.ui-field > input { width: 100%; min-width: 0; }
.ui-dialog { width: min(520px, calc(100vw - 32px)); padding: var(--form-section-gap); }
.ui-dialog-heading { display: flex; align-items: center; justify-content: space-between; gap: var(--field-gap); margin-bottom: var(--form-section-gap); }
.ui-dialog-heading > h2 { margin: 0; }
.ui-dialog-body { display: grid; gap: var(--form-section-gap); }
.ui-dialog-body p { margin: 0; }
.ui-actions { display: flex; align-items: center; justify-content: flex-end; gap: var(--field-label-gap); flex-wrap: wrap; }
.ui-error { color: var(--danger); font-size: .875rem; }
.ui-error:empty { display: none; }
.ui-help { color: var(--muted); font-size: .875rem; line-height: 1.5; }
.ui-avatar { position: relative; display: inline-grid; place-items: center; width: 36px; height: 36px; flex: 0 0 36px; aspect-ratio: 1; overflow: hidden; border-radius: 50%; background: var(--selected); color: var(--text); font-size: .875rem; }
.ui-avatar img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: inherit; }
.ui-member-list { display: grid; gap: var(--field-gap); list-style: none; margin: 0; padding: 0; }
.ui-member { display: flex; align-items: center; gap: var(--field-gap); }
.ui-member > .ui-member-copy { flex: 1; min-width: 0; }
.ui-member-copy > strong, .ui-member-copy > small { display: block; overflow-wrap: anywhere; }
.ui-member-copy > small { color: var(--muted); margin-top: 4px; }
.ui-member .icon { flex-shrink: 0; }
.ui-invitation { display: grid; gap: var(--field-gap); }
.ui-invitation input { min-width: 0; width: 100%; }
#join-view { width: min(460px, 100%); }
#join-view > h1 { margin-top: 0; }
#join-view .ui-form { width: 100%; margin-top: var(--form-section-gap); }
#join-view .ui-form > button { margin-top: 0; }
#join-view > .ui-help { margin-bottom: var(--form-section-gap); }
#project-share { flex-shrink: 0; }
.project-toolbar-actions { display: flex; align-items: center; gap: var(--field-label-gap); }
.sidebar-bottom [data-account] { justify-content: flex-start; gap: var(--field-label-gap); }
.sidebar-bottom [data-account] > span:not(.ui-avatar):not(.material-symbols-rounded) { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sidebar-bottom [data-account] > .material-symbols-rounded { flex-shrink: 0; font-size: 18px; }
.ui-project-members { display: inline-flex; align-items: center; gap: var(--space-2); padding: 6px 12px; background: transparent; color: var(--muted); }
.ui-avatar-stack { display: inline-flex; align-items: center; padding-inline-start: 6px; }
.ui-avatar-stack .ui-avatar { margin-inline-start: -6px; box-shadow: 0 0 0 2px var(--background); }
.ui-project-members > .material-symbols-rounded { font-size: 20px; }
.ui-settings-tabs { margin-top: calc(-1 * var(--space-2)); }
.ui-profile-avatar { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-3); }
.ui-profile-avatar [data-avatar-preview] > .ui-avatar { width: 64px; height: 64px; font-size: 20px; }
.ui-profile-avatar [data-avatar-choose], .ui-settings-footer [data-logout] { display: inline-flex; align-items: center; gap: var(--space-2); }
.ui-setting-option { display: flex; align-items: center; justify-content: space-between; gap: var(--field-gap); min-height: var(--control-height); margin: 0; color: var(--text); }
.ui-settings-footer { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--field-gap); }
.ui-settings-footer > .ui-actions { margin-inline-start: auto; }
.ui-settings-footer [data-logout] { padding-inline: 0; background: transparent; color: var(--muted); }
.ui-settings-footer [data-logout]:hover { color: var(--text); }
#account-settings [data-save-status]:empty { display: none; }
#account-settings [role=tabpanel]:not([hidden]) { animation: ui-settings-reveal var(--duration-reveal) var(--ease-standard); }
@keyframes ui-settings-reveal { from { opacity: 0; } to { opacity: 1; } }
:root[data-motion=reduced] #account-settings [role=tabpanel] { animation: none; }
.ui-activity { display: grid; gap: var(--space-4); margin: 0; font-size: .875rem; line-height: 1.5; }
.ui-activity > div { display: grid; gap: var(--space-1); }
.ui-activity dt { color: var(--muted); }
.ui-activity dd { display: flex; align-items: center; gap: var(--space-2); margin: 0; flex-wrap: wrap; }
.ui-activity .ui-avatar { width: 28px; height: 28px; flex-basis: 28px; font-size: 11px; }
.ui-activity-name { overflow-wrap: anywhere; }
.ui-activity-date { margin-inline-start: auto; color: var(--muted); font-variant-numeric: tabular-nums; }
#task-activity, #resource-activity, #note-activity, [data-event-activity] { margin-top: var(--form-section-gap); }
@media (prefers-reduced-motion: reduce) { #account-settings [role=tabpanel]:not([hidden]) { animation: none; } }
@media (max-width: 400px) {
  .ui-activity-date { width: 100%; margin-inline-start: 36px; }
  .ui-profile-avatar { gap: var(--space-2); }
  .ui-profile-avatar [data-avatar-choose] { padding-inline: 12px; font-size: .8125rem; }
  .ui-profile-avatar [data-avatar-choose] > .material-symbols-rounded { display: none; }
}
body[data-integrations="false"] #note-chat-toggle { display: none; }
@media (max-width: 560px) {
  .ui-dialog { padding: var(--field-gap); }
  .project-toolbar-actions { flex-wrap: wrap; justify-content: flex-end; }
}
