.compose-container {
    max-width: 500px;
    margin: 0 auto;
}

.recipient-selector {
    margin-bottom: var(--space-sm);
}

.recipient-selector select {
    margin-bottom: var(--space-sm);
}

.recipient-input-row {
    display: flex;
    gap: var(--space-sm);
}

.recipient-input-row input { flex: 1; }

.recipient-display {
    margin-top: var(--space-sm);
    font-size: 13px;
    color: var(--accent);
    min-height: 20px;
}

.compose-extras {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-sm);
    align-items: center;
    margin: var(--space-md) 0;
}

.compose-preview {
    max-width: 100px;
    max-height: 100px;
    border-radius: var(--radius);
}

.attachments-list {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-xs);
}

.attachment-item {
    padding: var(--space-xs) var(--space-sm);
    background: var(--accent-bg);
    border-radius: 12px;
    font-size: 12px;
    color: var(--accent);
}